@primer/react/dist/utils/as-slot.js

An implementation of GitHub's Primer Design System using React

import { warning } from './warning.js';

/**
 * Copies the `__SLOT__` marker from a slot-aware source component onto another
 * component, returning the same component reference typed as a slot.
 *
 * Useful when building reusable wrappers around Primer slot components that
 * still need to be recognised by the parent's slot scanner.
 *
 * @example
 * ```tsx
 * const ColoredLeadingVisual = asSlot(
 *   function ColoredLeadingVisual({color, children}) {
 *     return <ActionList.LeadingVisual><span style={{color}}>{children}</span></ActionList.LeadingVisual>
 *   },
 *   ActionList.LeadingVisual,
 * )
 * ```
 */
function asSlot(component, slotSource) {
  if (process.env.NODE_ENV !== "production") {
    process.env.NODE_ENV !== "production" ? warning(!slotSource.__SLOT__, 'asSlot: the provided slotSource does not have a `__SLOT__` marker. The wrapper will not be recognised by the parent slot scanner.') : void 0;
  }
  if (slotSource.__SLOT__) {
    component.__SLOT__ = slotSource.__SLOT__;
  }
  return component;
}

export { asSlot };