{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "slot",
  "dependencies": [
    "@base-ui/react"
  ],
  "files": [
    {
      "path": "registry/default/lib/slot.tsx",
      "content": "\"use client\"\n\nimport { useRender } from \"@base-ui/react/use-render\"\nimport * as React from \"react\"\n\nexport type SlotProps = React.HTMLAttributes<HTMLElement> & {\n  children?: React.ReactNode\n}\n\ntype ElementWithChildren = React.ReactElement<{ children?: React.ReactNode }>\n\ntype PossibleRef<T> = React.Ref<T> | undefined\n\n/**\n * Combines multiple refs into a single ref callback.\n */\nexport function composeRefs<T>(...refs: PossibleRef<T>[]) {\n  return (node: null | T) => {\n    const cleanups = refs.map((ref) => setRef(ref, node))\n\n    if (cleanups.some((cleanup) => typeof cleanup === \"function\")) {\n      return () => {\n        cleanups.forEach((cleanup, index) => {\n          if (typeof cleanup === \"function\") {\n            cleanup()\n          } else {\n            setRef(refs[index], null)\n          }\n        })\n      }\n    }\n  }\n}\n\n/**\n * Marks which child of a `Slot` is the element to render. Its siblings are\n * placed inside that element, after its own children.\n */\nexport function Slottable({ children }: { children: React.ReactNode }) {\n  return <>{children}</>\n}\n\n/**\n * A memoized ref callback that forwards the node to every given ref.\n */\nexport function useComposedRefs<T>(...refs: PossibleRef<T>[]) {\n  // The refs themselves are the dependencies, matching Radix's useComposedRefs.\n  return React.useCallback(composeRefs(...refs), refs)\n}\n\nfunction getRenderElement(\n  children: React.ReactNode\n): React.ReactElement | undefined {\n  const childArray = React.Children.toArray(children)\n  const slottable = childArray.find(isSlottable)\n\n  if (!slottable) {\n    return React.isValidElement(children) ? children : undefined\n  }\n\n  const target = slottable.props.children\n  if (!React.isValidElement<{ children?: React.ReactNode }>(target)) {\n    return undefined\n  }\n\n  const siblings = childArray.map((child) =>\n    child === slottable ? target.props.children : child\n  )\n  return React.cloneElement(target, undefined, ...siblings)\n}\n\nfunction isSlottable(child: React.ReactNode): child is ElementWithChildren {\n  return React.isValidElement(child) && child.type === Slottable\n}\n\n/**\n * Sets a ref value. Returns the ref callback's cleanup function, if any.\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: null | T) {\n  if (typeof ref === \"function\") {\n    return ref(value)\n  }\n  if (ref !== null && ref !== undefined) {\n    ref.current = value\n  }\n}\n\n/**\n * Renders its single child element, merging the slot's props onto it.\n * Event handlers are chained, `className` and `style` are combined, and the\n * child's own props win otherwise. Built on Base UI's `useRender`.\n */\nexport const Slot = React.forwardRef<HTMLElement, SlotProps>(function Slot(\n  { children, ...props },\n  forwardedRef\n) {\n  const render = getRenderElement(children)\n\n  return useRender({\n    enabled: render !== undefined,\n    props,\n    ref: forwardedRef,\n    render,\n  })\n})\n",
      "type": "registry:lib"
    }
  ],
  "type": "registry:lib"
}