8 lines
12 KiB
Plaintext
8 lines
12 KiB
Plaintext
{
|
|
"version": 3,
|
|
"sources": ["../src/slot.tsx"],
|
|
"sourcesContent": ["import * as React from 'react';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\n\ndeclare module 'react' {\n interface ReactElement {\n $$typeof?: symbol | string;\n }\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\nexport type Usable<T> = PromiseLike<T> | React.Context<T>;\n\ninterface SlotProps extends React.HTMLAttributes<HTMLElement> {\n children?: React.ReactNode;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ export function createSlot(ownerName: string) {\n const Slot = React.forwardRef<HTMLElement, SlotProps>((props, forwardedRef) => {\n let { children, ...slotProps } = props;\n let slottableElement: React.ReactElement | null = null;\n let hasSlottable = false;\n const newChildren: React.ReactNode[] = [];\n\n if (isLazyComponent(children) && typeof use === 'function') {\n children = use(children._payload);\n }\n\n React.Children.forEach(children, (maybeSlottable) => {\n if (isSlottable(maybeSlottable)) {\n hasSlottable = true;\n const slottable = maybeSlottable;\n let child = 'child' in slottable.props ? slottable.props.child : slottable.props.children;\n\n if (isLazyComponent(child) && typeof use === 'function') {\n child = use(child._payload);\n }\n\n slottableElement = getSlottableElementFromSlottable(slottable, child);\n newChildren.push((slottableElement?.props as any)?.children);\n } else {\n newChildren.push(maybeSlottable);\n }\n });\n\n if (slottableElement) {\n slottableElement = React.cloneElement(slottableElement, undefined, newChildren);\n } else if (\n // A `Slottable` was found but it didn't resolve to a single element (e.g.\n // it wrapped multiple elements, text, or a render-prop `child` that\n // wasn't an element). Don't fall back to treating the `Slottable` wrapper\n // itself as the slot target \u2014 throw a descriptive error below instead.\n !hasSlottable &&\n React.Children.count(children) === 1 &&\n React.isValidElement(children)\n ) {\n slottableElement = children;\n }\n\n const slottableElementRef = slottableElement ? getElementRef(slottableElement) : undefined;\n const composedRef = useComposedRefs(forwardedRef, slottableElementRef);\n\n if (!slottableElement) {\n // Empty/falsy children (`null`, `undefined`, `false`, no children, etc.) are valid and\n // render nothing. Anything else is content we couldn't slot onto a single element, which\n // is a usage error, so we fail loudly with a clear message.\n if (children || children === 0) {\n throw new Error(\n hasSlottable ? createSlottableError(ownerName) : createSlotError(ownerName),\n );\n }\n return children;\n }\n\n const mergedProps = mergeProps(slotProps, slottableElement.props ?? {});\n\n // do not pass ref to React.Fragment for React 19 compatibility\n if (slottableElement.type !== React.Fragment) {\n mergedProps.ref = forwardedRef ? composedRef : slottableElementRef;\n }\n\n return React.cloneElement(slottableElement, mergedProps);\n });\n\n Slot.displayName = `${ownerName}.Slot`;\n return Slot;\n}\n\nconst Slot = createSlot('Slot');\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * -----------------------------------------------------------------------------------------------*/\n\nconst SLOTTABLE_IDENTIFIER = Symbol.for('radix.slottable');\n\ntype SlottableChildrenProps = { children: React.ReactNode };\ntype SlottableRenderFnProps = {\n child: React.ReactNode;\n children: (slottable: React.ReactNode) => React.ReactNode;\n};\n\ntype SlottableProps = SlottableRenderFnProps | SlottableChildrenProps;\ninterface SlottableComponent extends React.FC<SlottableProps> {\n __radixId: symbol;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ export function createSlottable(ownerName: string) {\n const Slottable: SlottableComponent = (props) =>\n 'child' in props ? props.children(props.child) : props.children;\n\n Slottable.displayName = `${ownerName}.Slottable`;\n Slottable.__radixId = SLOTTABLE_IDENTIFIER;\n return Slottable;\n}\n\nconst Slottable = createSlottable('Slottable');\n\n/* -------------------------------------------------------------------------------------------------\n * getSlottableElementFromSlottable\n * -----------------------------------------------------------------------------------------------*/\n\nconst getSlottableElementFromSlottable = (slottable: SlottableElement, child: React.ReactNode) => {\n if ('child' in slottable.props) {\n const child = slottable.props.child;\n if (!React.isValidElement<React.PropsWithChildren>(child)) return null;\n return React.cloneElement(child, undefined, slottable.props.children(child.props.children));\n }\n\n return React.isValidElement(child) ? child : null;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * mergeProps\n * -----------------------------------------------------------------------------------------------*/\n\ntype AnyProps = Record<string, any>;\n\nfunction mergeProps(slotProps: AnyProps, childProps: AnyProps) {\n // all child props should override\n const overrideProps = { ...childProps };\n\n for (const propName in childProps) {\n const slotPropValue = slotProps[propName];\n const childPropValue = childProps[propName];\n\n const isHandler = /^on[A-Z]/.test(propName);\n if (isHandler) {\n // if the handler exists on both, we compose them\n if (slotPropValue && childPropValue) {\n overrideProps[propName] = (...args: unknown[]) => {\n const result = childPropValue(...args);\n slotPropValue(...args);\n return result;\n };\n }\n // but if it exists only on the slot, we use only this one\n else if (slotPropValue) {\n overrideProps[propName] = slotPropValue;\n }\n }\n // if it's `style`, we merge them\n else if (propName === 'style') {\n overrideProps[propName] = { ...slotPropValue, ...childPropValue };\n } else if (propName === 'className') {\n overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ');\n }\n }\n\n return { ...slotProps, ...overrideProps };\n}\n\n/* -------------------------------------------------------------------------------------------------\n * getElementRef\n * -----------------------------------------------------------------------------------------------*/\n\n// Before React 19 accessing `element.props.ref` will throw a warning and suggest using `element.ref`\n// After React 19 accessing `element.ref` does the opposite.\n// https://github.com/facebook/react/pull/28348\n//\n// Access the ref using the method that doesn't yield a warning.\nfunction getElementRef(element: React.ReactElement) {\n // React <=18 in DEV\n let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get;\n let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;\n if (mayWarn) {\n return (element as any).ref;\n }\n\n // React 19 in DEV\n getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get;\n mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;\n if (mayWarn) {\n return (element.props as { ref?: React.Ref<unknown> }).ref;\n }\n\n // Not DEV\n return (element.props as { ref?: React.Ref<unknown> }).ref || (element as any).ref;\n}\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype SlottableElement = React.ReactElement<SlottableProps, SlottableComponent>;\n\nfunction isSlottable(\n child: React.ReactNode,\n): child is React.ReactElement<SlottableProps, typeof Slottable> {\n return (\n React.isValidElement(child) &&\n typeof child.type === 'function' &&\n '__radixId' in child.type &&\n child.type.__radixId === SLOTTABLE_IDENTIFIER\n );\n}\n\nconst REACT_LAZY_TYPE = Symbol.for('react.lazy');\n\ninterface LazyReactElement extends React.ReactElement {\n $$typeof: typeof REACT_LAZY_TYPE;\n _payload: PromiseLike<Exclude<React.ReactNode, PromiseLike<any>>>;\n}\n\nfunction isLazyComponent(element: React.ReactNode): element is LazyReactElement {\n return (\n element != null &&\n typeof element === 'object' &&\n '$$typeof' in element &&\n element.$$typeof === REACT_LAZY_TYPE &&\n '_payload' in element &&\n isPromiseLike(element._payload)\n );\n}\n\nfunction isPromiseLike(value: unknown): value is PromiseLike<unknown> {\n return typeof value === 'object' && value !== null && 'then' in value;\n}\n\nconst createSlotError = (ownerName: string) => {\n return `${ownerName} failed to slot onto its children. Expected a single React element child or \\`Slottable\\`.`;\n};\n\nconst createSlottableError = (ownerName: string) => {\n return `${ownerName} failed to slot onto its \\`Slottable\\`. Expected \\`Slottable\\` to receive a single React element child.`;\n};\n\nconst use: typeof React.use | undefined = (React as any)[' use '.trim().toString()];\n\nexport {\n Slot,\n Slottable,\n //\n Slot as Root,\n};\nexport type { SlotProps };\n"],
|
|
"mappings": "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",
|
|
"names": ["Slot", "Slottable", "child"]
|
|
}
|