@gechiui/components/build/slot-fill/bubbles-virtually/slot.js

UI components for GeChiUI.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _element = require("@gechiui/element");

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _compose = require("@gechiui/compose");

var _slotFillContext = _interopRequireDefault(require("./slot-fill-context"));

// @ts-nocheck

/**
 * GeChiUI dependencies
 */

/**
 * Internal dependencies
 */
function Slot(_ref, forwardedRef) {
  let {
    name,
    fillProps = {},
    as: Component = 'div',
    ...props
  } = _ref;
  const registry = (0, _element.useContext)(_slotFillContext.default);
  const ref = (0, _element.useRef)();
  (0, _element.useLayoutEffect)(() => {
    registry.registerSlot(name, ref, fillProps);
    return () => {
      registry.unregisterSlot(name, ref);
    }; // We are not including fillProps in the deps because we don't want to
    // unregister and register the slot whenever fillProps change, which would
    // cause the fill to be re-mounted. We are only considering the initial value
    // of fillProps.
  }, [registry.registerSlot, registry.unregisterSlot, name]); // fillProps may be an update that interacts with the layout, so we
  // useLayoutEffect

  (0, _element.useLayoutEffect)(() => {
    registry.updateSlot(name, fillProps);
  });
  return (0, _element.createElement)(Component, (0, _extends2.default)({
    ref: (0, _compose.useMergeRefs)([forwardedRef, ref])
  }, props));
}

var _default = (0, _element.forwardRef)(Slot);

exports.default = _default;
//# sourceMappingURL=slot.js.map