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

UI components for GeChiUI.

import _extends from "@babel/runtime/helpers/esm/extends";
import { createElement } from "@gechiui/element";
// @ts-nocheck

/**
 * GeChiUI dependencies
 */
import { useRef, useLayoutEffect, useContext, forwardRef } from '@gechiui/element';
import { useMergeRefs } from '@gechiui/compose';
/**
 * Internal dependencies
 */

import SlotFillContext from './slot-fill-context';

function Slot(_ref, forwardedRef) {
  let {
    name,
    fillProps = {},
    as: Component = 'div',
    ...props
  } = _ref;
  const registry = useContext(SlotFillContext);
  const ref = useRef();
  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

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

export default forwardRef(Slot);
//# sourceMappingURL=slot.js.map