UNPKG

@wordpress/components

Version:
8 lines (7 loc) 3.76 kB
{ "version": 3, "sources": ["../../src/slot-fill/slot.tsx"], "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { useObservableValue } from '@wordpress/compose';\nimport { useContext, useLayoutEffect, useRef, Children, cloneElement, isEmptyElement } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\nimport { Fragment as _Fragment, jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * Whether the argument is a function.\n *\n * @param maybeFunc The argument to check.\n * @return True if the argument is a function, false otherwise.\n */\nfunction isFunction(maybeFunc) {\n return typeof maybeFunc === 'function';\n}\nfunction addKeysToChildren(children) {\n return Children.map(children, (child, childIndex) => {\n if (!child || typeof child === 'string') {\n return child;\n }\n let childKey = childIndex;\n if (typeof child === 'object' && 'key' in child && child?.key) {\n childKey = child.key;\n }\n return cloneElement(child, {\n key: childKey\n });\n });\n}\nfunction Slot(props) {\n const {\n name,\n children,\n fillProps = {}\n } = props;\n const registry = useContext(SlotFillContext);\n const instanceRef = useRef({});\n useLayoutEffect(() => {\n const instance = instanceRef.current;\n registry.registerSlot(name, {\n type: 'children',\n instance\n });\n return () => registry.unregisterSlot(name, instance);\n }, [registry, name]);\n let fills = useObservableValue(registry.fills, name) ?? [];\n const currentSlot = useObservableValue(registry.slots, name);\n\n // Fills should only be rendered in the currently registered instance of the slot.\n if (!currentSlot || currentSlot.instance !== instanceRef.current) {\n fills = [];\n }\n const renderedFills = fills.map(fill => {\n const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children;\n return addKeysToChildren(fillChildren);\n }).filter(\n // In some cases fills are rendered only when some conditions apply.\n // This ensures that we only use non-empty fills when rendering, i.e.,\n // it allows us to render wrappers only when the fills are actually present.\n element => !isEmptyElement(element));\n return /*#__PURE__*/_jsx(_Fragment, {\n children: isFunction(children) ? children(renderedFills) : renderedFills\n });\n}\nexport default Slot;"], "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,qBAAmC;AACnC,qBAA4F;AAK5F,qBAA4B;AAC5B,yBAAmD;AAOnD,SAAS,WAAW,WAAW;AAC7B,SAAO,OAAO,cAAc;AAC9B;AACA,SAAS,kBAAkB,UAAU;AACnC,SAAO,wBAAS,IAAI,UAAU,CAAC,OAAO,eAAe;AACnD,QAAI,CAAC,SAAS,OAAO,UAAU,UAAU;AACvC,aAAO;AAAA,IACT;AACA,QAAI,WAAW;AACf,QAAI,OAAO,UAAU,YAAY,SAAS,SAAS,OAAO,KAAK;AAC7D,iBAAW,MAAM;AAAA,IACnB;AACA,eAAO,6BAAa,OAAO;AAAA,MACzB,KAAK;AAAA,IACP,CAAC;AAAA,EACH,CAAC;AACH;AACA,SAAS,KAAK,OAAO;AACnB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,YAAY,CAAC;AAAA,EACf,IAAI;AACJ,QAAM,eAAW,2BAAW,eAAAA,OAAe;AAC3C,QAAM,kBAAc,uBAAO,CAAC,CAAC;AAC7B,sCAAgB,MAAM;AACpB,UAAM,WAAW,YAAY;AAC7B,aAAS,aAAa,MAAM;AAAA,MAC1B,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AACD,WAAO,MAAM,SAAS,eAAe,MAAM,QAAQ;AAAA,EACrD,GAAG,CAAC,UAAU,IAAI,CAAC;AACnB,MAAI,YAAQ,mCAAmB,SAAS,OAAO,IAAI,KAAK,CAAC;AACzD,QAAM,kBAAc,mCAAmB,SAAS,OAAO,IAAI;AAG3D,MAAI,CAAC,eAAe,YAAY,aAAa,YAAY,SAAS;AAChE,YAAQ,CAAC;AAAA,EACX;AACA,QAAM,gBAAgB,MAAM,IAAI,UAAQ;AACtC,UAAM,eAAe,WAAW,KAAK,QAAQ,IAAI,KAAK,SAAS,SAAS,IAAI,KAAK;AACjF,WAAO,kBAAkB,YAAY;AAAA,EACvC,CAAC,EAAE;AAAA;AAAA;AAAA;AAAA,IAIH,aAAW,KAAC,+BAAe,OAAO;AAAA,EAAC;AACnC,SAAoB,uCAAAC,KAAK,mBAAAC,UAAW;AAAA,IAClC,UAAU,WAAW,QAAQ,IAAI,SAAS,aAAa,IAAI;AAAA,EAC7D,CAAC;AACH;AACA,IAAO,eAAQ;", "names": ["SlotFillContext", "_jsx", "_Fragment"] }