@wordpress/components 28.13.0 → 28.14.1-next.cd6172eb0.0

package/build-module/resizable-box/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","clsx","Resizable","ResizeTooltip","jsx","_jsx","jsxs","_jsxs","HANDLE_CLASS_NAME","SIDE_HANDLE_CLASS_NAME","CORNER_HANDLE_CLASS_NAME","HANDLE_CLASSES","top","right","bottom","left","topLeft","topRight","bottomRight","bottomLeft","HANDLE_STYLES_OVERRIDES","width","undefined","height","HANDLE_STYLES","UnforwardedResizableBox","className","children","showHandle","__experimentalShowTooltip","showTooltip","__experimentalTooltipProps","tooltipProps","props","ref","handleClasses","handleStyles","ResizableBox"],"sources":["@wordpress/components/src/resizable-box/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { Resizable } from 're-resizable';\nimport type { ResizableProps } from 're-resizable';\nimport type { ReactNode, ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ResizeTooltip from './resize-tooltip';\n\nconst HANDLE_CLASS_NAME = 'components-resizable-box__handle';\nconst SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';\nconst CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';\n\nconst HANDLE_CLASSES = {\n\ttop: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top'\n\t),\n\tright: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottom: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom'\n\t),\n\tleft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopLeft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopRight: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomRight: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomLeft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-left'\n\t),\n};\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDES = {\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\nconst HANDLE_STYLES = {\n\ttop: HANDLE_STYLES_OVERRIDES,\n\tright: HANDLE_STYLES_OVERRIDES,\n\tbottom: HANDLE_STYLES_OVERRIDES,\n\tleft: HANDLE_STYLES_OVERRIDES,\n\ttopLeft: HANDLE_STYLES_OVERRIDES,\n\ttopRight: HANDLE_STYLES_OVERRIDES,\n\tbottomRight: HANDLE_STYLES_OVERRIDES,\n\tbottomLeft: HANDLE_STYLES_OVERRIDES,\n};\n\ntype ResizableBoxProps = ResizableProps & {\n\tchildren: ReactNode;\n\tshowHandle?: boolean;\n\t__experimentalShowTooltip?: boolean;\n\t__experimentalTooltipProps?: Parameters< typeof ResizeTooltip >[ 0 ];\n};\n\nfunction UnforwardedResizableBox(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tshowHandle = true,\n\t\t__experimentalShowTooltip: showTooltip = false,\n\t\t__experimentalTooltipProps: tooltipProps = {},\n\t\t...props\n\t}: ResizableBoxProps,\n\tref: ForwardedRef< Resizable >\n): JSX.Element {\n\treturn (\n\t\t<Resizable\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-resizable-box__container',\n\t\t\t\tshowHandle && 'has-show-handle',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\thandleClasses={ HANDLE_CLASSES }\n\t\t\thandleStyles={ HANDLE_STYLES }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ showTooltip && <ResizeTooltip { ...tooltipProps } /> }\n\t\t</Resizable>\n\t);\n}\n\nexport const ResizableBox = forwardRef( UnforwardedResizableBox );\n\nexport default ResizableBox;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,IAAI,MAAM,MAAM;AACvB,SAASC,SAAS,QAAQ,cAAc;AAIxC;AACA;AACA;AACA,OAAOC,aAAa,MAAM,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE7C,MAAMC,iBAAiB,GAAG,kCAAkC;AAC5D,MAAMC,sBAAsB,GAAG,uCAAuC;AACtE,MAAMC,wBAAwB,GAAG,yCAAyC;AAE1E,MAAMC,cAAc,GAAG;EACtBC,GAAG,EAAEX,IAAI,CACRO,iBAAiB,EACjBC,sBAAsB,EACtB,sCACD,CAAC;EACDI,KAAK,EAAEZ,IAAI,CACVO,iBAAiB,EACjBC,sBAAsB,EACtB,wCACD,CAAC;EACDK,MAAM,EAAEb,IAAI,CACXO,iBAAiB,EACjBC,sBAAsB,EACtB,yCACD,CAAC;EACDM,IAAI,EAAEd,IAAI,CACTO,iBAAiB,EACjBC,sBAAsB,EACtB,uCACD,CAAC;EACDO,OAAO,EAAEf,IAAI,CACZO,iBAAiB,EACjBE,wBAAwB,EACxB,sCAAsC,EACtC,uCACD,CAAC;EACDO,QAAQ,EAAEhB,IAAI,CACbO,iBAAiB,EACjBE,wBAAwB,EACxB,sCAAsC,EACtC,wCACD,CAAC;EACDQ,WAAW,EAAEjB,IAAI,CAChBO,iBAAiB,EACjBE,wBAAwB,EACxB,yCAAyC,EACzC,wCACD,CAAC;EACDS,UAAU,EAAElB,IAAI,CACfO,iBAAiB,EACjBE,wBAAwB,EACxB,yCAAyC,EACzC,uCACD;AACD,CAAC;;AAED;AACA,MAAMU,uBAAuB,GAAG;EAC/BC,KAAK,EAAEC,SAAS;EAChBC,MAAM,EAAED,SAAS;EACjBV,GAAG,EAAEU,SAAS;EACdT,KAAK,EAAES,SAAS;EAChBR,MAAM,EAAEQ,SAAS;EACjBP,IAAI,EAAEO;AACP,CAAC;AACD,MAAME,aAAa,GAAG;EACrBZ,GAAG,EAAEQ,uBAAuB;EAC5BP,KAAK,EAAEO,uBAAuB;EAC9BN,MAAM,EAAEM,uBAAuB;EAC/BL,IAAI,EAAEK,uBAAuB;EAC7BJ,OAAO,EAAEI,uBAAuB;EAChCH,QAAQ,EAAEG,uBAAuB;EACjCF,WAAW,EAAEE,uBAAuB;EACpCD,UAAU,EAAEC;AACb,CAAC;AASD,SAASK,uBAAuBA,CAC/B;EACCC,SAAS;EACTC,QAAQ;EACRC,UAAU,GAAG,IAAI;EACjBC,yBAAyB,EAAEC,WAAW,GAAG,KAAK;EAC9CC,0BAA0B,EAAEC,YAAY,GAAG,CAAC,CAAC;EAC7C,GAAGC;AACe,CAAC,EACpBC,GAA8B,EAChB;EACd,oBACC3B,KAAA,CAACL,SAAS;IACTwB,SAAS,EAAGzB,IAAI,CACf,qCAAqC,EACrC2B,UAAU,IAAI,iBAAiB,EAC/BF,SACD,CAAG;IACHS,aAAa,EAAGxB,cAAgB;IAChCyB,YAAY,EAAGZ,aAAe;IAC9BU,GAAG,EAAGA,GAAK;IAAA,GACND,KAAK;IAAAN,QAAA,GAERA,QAAQ,EACRG,WAAW,iBAAIzB,IAAA,CAACF,aAAa;MAAA,GAAM6B;IAAY,CAAI,CAAC;EAAA,CAC5C,CAAC;AAEd;AAEA,OAAO,MAAMK,YAAY,GAAGrC,UAAU,CAAEyB,uBAAwB,CAAC;AAEjE,eAAeY,YAAY","ignoreList":[]}
+{"version":3,"names":["forwardRef","clsx","Resizable","ResizeTooltip","jsx","_jsx","jsxs","_jsxs","HANDLE_CLASS_NAME","SIDE_HANDLE_CLASS_NAME","CORNER_HANDLE_CLASS_NAME","HANDLE_CLASSES","top","right","bottom","left","topLeft","topRight","bottomRight","bottomLeft","HANDLE_STYLES_OVERRIDES","width","undefined","height","HANDLE_STYLES","UnforwardedResizableBox","className","children","showHandle","__experimentalShowTooltip","showTooltip","__experimentalTooltipProps","tooltipProps","props","ref","handleComponent","Object","fromEntries","keys","map","key","tabIndex","handleClasses","handleStyles","ResizableBox"],"sources":["@wordpress/components/src/resizable-box/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { Resizable } from 're-resizable';\nimport type { ResizableProps } from 're-resizable';\nimport type { ReactNode, ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ResizeTooltip from './resize-tooltip';\n\nconst HANDLE_CLASS_NAME = 'components-resizable-box__handle';\nconst SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';\nconst CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';\n\nconst HANDLE_CLASSES = {\n\ttop: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top'\n\t),\n\tright: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottom: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom'\n\t),\n\tleft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopLeft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopRight: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomRight: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomLeft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-left'\n\t),\n};\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDES = {\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\nconst HANDLE_STYLES = {\n\ttop: HANDLE_STYLES_OVERRIDES,\n\tright: HANDLE_STYLES_OVERRIDES,\n\tbottom: HANDLE_STYLES_OVERRIDES,\n\tleft: HANDLE_STYLES_OVERRIDES,\n\ttopLeft: HANDLE_STYLES_OVERRIDES,\n\ttopRight: HANDLE_STYLES_OVERRIDES,\n\tbottomRight: HANDLE_STYLES_OVERRIDES,\n\tbottomLeft: HANDLE_STYLES_OVERRIDES,\n};\n\ntype ResizableBoxProps = ResizableProps & {\n\tchildren: ReactNode;\n\tshowHandle?: boolean;\n\t__experimentalShowTooltip?: boolean;\n\t__experimentalTooltipProps?: Parameters< typeof ResizeTooltip >[ 0 ];\n};\n\nfunction UnforwardedResizableBox(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tshowHandle = true,\n\t\t__experimentalShowTooltip: showTooltip = false,\n\t\t__experimentalTooltipProps: tooltipProps = {},\n\t\t...props\n\t}: ResizableBoxProps,\n\tref: ForwardedRef< Resizable >\n): JSX.Element {\n\treturn (\n\t\t<Resizable\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-resizable-box__container',\n\t\t\t\tshowHandle && 'has-show-handle',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\t// Add a focusable element within the drag handle. Unfortunately,\n\t\t\t// `re-resizable` does not make them properly focusable by default,\n\t\t\t// causing focus to move the the block wrapper which triggers block\n\t\t\t// drag.\n\t\t\thandleComponent={ Object.fromEntries(\n\t\t\t\tObject.keys( HANDLE_CLASSES ).map( ( key ) => [\n\t\t\t\t\tkey,\n\t\t\t\t\t<div key={ key } tabIndex={ -1 } />,\n\t\t\t\t] )\n\t\t\t) }\n\t\t\thandleClasses={ HANDLE_CLASSES }\n\t\t\thandleStyles={ HANDLE_STYLES }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ showTooltip && <ResizeTooltip { ...tooltipProps } /> }\n\t\t</Resizable>\n\t);\n}\n\nexport const ResizableBox = forwardRef( UnforwardedResizableBox );\n\nexport default ResizableBox;\n"],"mappings":"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","ignoreList":[]}

package/build-module/slot-fill/bubbles-virtually/fill.js

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { useObservableValue } from '@wordpress/compose';
-import { useContext, useReducer, useRef, useEffect, createPortal } from '@wordpress/element';
+import { useContext, useRef, useEffect, createPortal } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -17,19 +17,15 @@ export default function Fill({
   var _slot$fillProps;
   const registry = useContext(SlotFillContext);
   const slot = useObservableValue(registry.slots, name);
-  const [, rerender] = useReducer(() => [], []);
-  const ref = useRef({
-    rerender
-  });
+  const instanceRef = useRef({});
+
+  // We register fills so we can keep track of their existence.
+  // Slots can use the `useSlotFills` hook to know if there're already fills
+  // registered so they can choose to render themselves or not.
   useEffect(() => {
-    // We register fills so we can keep track of their existence.
-    // Some Slot implementations need to know if there're already fills
-    // registered so they can choose to render themselves or not.
-    const refValue = ref.current;
-    registry.registerFill(name, refValue);
-    return () => {
-      registry.unregisterFill(name, refValue);
-    };
+    const instance = instanceRef.current;
+    registry.registerFill(name, instance);
+    return () => registry.unregisterFill(name, instance);
   }, [registry, name]);
   if (!slot || !slot.ref.current) {
     return null;

package/build-module/slot-fill/bubbles-virtually/fill.js.map

@@ -1 +1 @@
-{"version":3,"names":["useObservableValue","useContext","useReducer","useRef","useEffect","createPortal","SlotFillContext","StyleProvider","jsx","_jsx","Fill","name","children","_slot$fillProps","registry","slot","slots","rerender","ref","refValue","current","registerFill","unregisterFill","wrappedChildren","document","ownerDocument","fillProps"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/fill.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useObservableValue } from '@wordpress/compose';\nimport {\n\tuseContext,\n\tuseReducer,\n\tuseRef,\n\tuseEffect,\n\tcreatePortal,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\nimport StyleProvider from '../../style-provider';\nimport type { FillComponentProps } from '../types';\n\nexport default function Fill( { name, children }: FillComponentProps ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst slot = useObservableValue( registry.slots, name );\n\tconst [ , rerender ] = useReducer( () => [], [] );\n\tconst ref = useRef( { rerender } );\n\n\tuseEffect( () => {\n\t\t// We register fills so we can keep track of their existence.\n\t\t// Some Slot implementations need to know if there're already fills\n\t\t// registered so they can choose to render themselves or not.\n\t\tconst refValue = ref.current;\n\t\tregistry.registerFill( name, refValue );\n\t\treturn () => {\n\t\t\tregistry.unregisterFill( name, refValue );\n\t\t};\n\t}, [ registry, name ] );\n\n\tif ( ! slot || ! slot.ref.current ) {\n\t\treturn null;\n\t}\n\n\t// When using a `Fill`, the `children` will be rendered in the document of the\n\t// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`\n\t// to make sure we're referencing the right document/iframe (instead of the\n\t// context of the `Fill`'s parent).\n\tconst wrappedChildren = (\n\t\t<StyleProvider document={ slot.ref.current.ownerDocument }>\n\t\t\t{ typeof children === 'function'\n\t\t\t\t? children( slot.fillProps ?? {} )\n\t\t\t\t: children }\n\t\t</StyleProvider>\n\t);\n\n\treturn createPortal( wrappedChildren, slot.ref.current );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,oBAAoB;AACvD,SACCC,UAAU,EACVC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,YAAY,QACN,oBAAoB;;AAE3B;AACA;AACA;AACA,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,aAAa,MAAM,sBAAsB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGjD,eAAe,SAASC,IAAIA,CAAE;EAAEC,IAAI;EAAEC;AAA6B,CAAC,EAAG;EAAA,IAAAC,eAAA;EACtE,MAAMC,QAAQ,GAAGb,UAAU,CAAEK,eAAgB,CAAC;EAC9C,MAAMS,IAAI,GAAGf,kBAAkB,CAAEc,QAAQ,CAACE,KAAK,EAAEL,IAAK,CAAC;EACvD,MAAM,GAAIM,QAAQ,CAAE,GAAGf,UAAU,CAAE,MAAM,EAAE,EAAE,EAAG,CAAC;EACjD,MAAMgB,GAAG,GAAGf,MAAM,CAAE;IAAEc;EAAS,CAAE,CAAC;EAElCb,SAAS,CAAE,MAAM;IAChB;IACA;IACA;IACA,MAAMe,QAAQ,GAAGD,GAAG,CAACE,OAAO;IAC5BN,QAAQ,CAACO,YAAY,CAAEV,IAAI,EAAEQ,QAAS,CAAC;IACvC,OAAO,MAAM;MACZL,QAAQ,CAACQ,cAAc,CAAEX,IAAI,EAAEQ,QAAS,CAAC;IAC1C,CAAC;EACF,CAAC,EAAE,CAAEL,QAAQ,EAAEH,IAAI,CAAG,CAAC;EAEvB,IAAK,CAAEI,IAAI,IAAI,CAAEA,IAAI,CAACG,GAAG,CAACE,OAAO,EAAG;IACnC,OAAO,IAAI;EACZ;;EAEA;EACA;EACA;EACA;EACA,MAAMG,eAAe,gBACpBd,IAAA,CAACF,aAAa;IAACiB,QAAQ,EAAGT,IAAI,CAACG,GAAG,CAACE,OAAO,CAACK,aAAe;IAAAb,QAAA,EACvD,OAAOA,QAAQ,KAAK,UAAU,GAC7BA,QAAQ,EAAAC,eAAA,GAAEE,IAAI,CAACW,SAAS,cAAAb,eAAA,cAAAA,eAAA,GAAI,CAAC,CAAE,CAAC,GAChCD;EAAQ,CACG,CACf;EAED,OAAOP,YAAY,CAAEkB,eAAe,EAAER,IAAI,CAACG,GAAG,CAACE,OAAQ,CAAC;AACzD","ignoreList":[]}
+{"version":3,"names":["useObservableValue","useContext","useRef","useEffect","createPortal","SlotFillContext","StyleProvider","jsx","_jsx","Fill","name","children","_slot$fillProps","registry","slot","slots","instanceRef","instance","current","registerFill","unregisterFill","ref","wrappedChildren","document","ownerDocument","fillProps"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/fill.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useObservableValue } from '@wordpress/compose';\nimport {\n\tuseContext,\n\tuseRef,\n\tuseEffect,\n\tcreatePortal,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\nimport StyleProvider from '../../style-provider';\nimport type { FillComponentProps } from '../types';\n\nexport default function Fill( { name, children }: FillComponentProps ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst slot = useObservableValue( registry.slots, name );\n\tconst instanceRef = useRef( {} );\n\n\t// We register fills so we can keep track of their existence.\n\t// Slots can use the `useSlotFills` hook to know if there're already fills\n\t// registered so they can choose to render themselves or not.\n\tuseEffect( () => {\n\t\tconst instance = instanceRef.current;\n\t\tregistry.registerFill( name, instance );\n\t\treturn () => registry.unregisterFill( name, instance );\n\t}, [ registry, name ] );\n\n\tif ( ! slot || ! slot.ref.current ) {\n\t\treturn null;\n\t}\n\n\t// When using a `Fill`, the `children` will be rendered in the document of the\n\t// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`\n\t// to make sure we're referencing the right document/iframe (instead of the\n\t// context of the `Fill`'s parent).\n\tconst wrappedChildren = (\n\t\t<StyleProvider document={ slot.ref.current.ownerDocument }>\n\t\t\t{ typeof children === 'function'\n\t\t\t\t? children( slot.fillProps ?? {} )\n\t\t\t\t: children }\n\t\t</StyleProvider>\n\t);\n\n\treturn createPortal( wrappedChildren, slot.ref.current );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,oBAAoB;AACvD,SACCC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,YAAY,QACN,oBAAoB;;AAE3B;AACA;AACA;AACA,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,aAAa,MAAM,sBAAsB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGjD,eAAe,SAASC,IAAIA,CAAE;EAAEC,IAAI;EAAEC;AAA6B,CAAC,EAAG;EAAA,IAAAC,eAAA;EACtE,MAAMC,QAAQ,GAAGZ,UAAU,CAAEI,eAAgB,CAAC;EAC9C,MAAMS,IAAI,GAAGd,kBAAkB,CAAEa,QAAQ,CAACE,KAAK,EAAEL,IAAK,CAAC;EACvD,MAAMM,WAAW,GAAGd,MAAM,CAAE,CAAC,CAAE,CAAC;;EAEhC;EACA;EACA;EACAC,SAAS,CAAE,MAAM;IAChB,MAAMc,QAAQ,GAAGD,WAAW,CAACE,OAAO;IACpCL,QAAQ,CAACM,YAAY,CAAET,IAAI,EAAEO,QAAS,CAAC;IACvC,OAAO,MAAMJ,QAAQ,CAACO,cAAc,CAAEV,IAAI,EAAEO,QAAS,CAAC;EACvD,CAAC,EAAE,CAAEJ,QAAQ,EAAEH,IAAI,CAAG,CAAC;EAEvB,IAAK,CAAEI,IAAI,IAAI,CAAEA,IAAI,CAACO,GAAG,CAACH,OAAO,EAAG;IACnC,OAAO,IAAI;EACZ;;EAEA;EACA;EACA;EACA;EACA,MAAMI,eAAe,gBACpBd,IAAA,CAACF,aAAa;IAACiB,QAAQ,EAAGT,IAAI,CAACO,GAAG,CAACH,OAAO,CAACM,aAAe;IAAAb,QAAA,EACvD,OAAOA,QAAQ,KAAK,UAAU,GAC7BA,QAAQ,EAAAC,eAAA,GAAEE,IAAI,CAACW,SAAS,cAAAb,eAAA,cAAAA,eAAA,GAAI,CAAC,CAAE,CAAC,GAChCD;EAAQ,CACG,CACf;EAED,OAAOP,YAAY,CAAEkB,eAAe,EAAER,IAAI,CAACO,GAAG,CAACH,OAAQ,CAAC;AACzD","ignoreList":[]}

package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js

@@ -14,11 +14,9 @@ function createSlotRegistry() {
   const slots = observableMap();
   const fills = observableMap();
   const registerSlot = (name, ref, fillProps) => {
-    const slot = slots.get(name);
     slots.set(name, {
-      ...slot,
-      ref: ref || slot?.ref,
-      fillProps: fillProps || slot?.fillProps || {}
+      ref,
+      fillProps
     });
   };
   const unregisterSlot = (name, ref) => {
@@ -45,12 +43,10 @@ function createSlotRegistry() {
     if (isShallowEqual(slot.fillProps, fillProps)) {
       return;
     }
-    slot.fillProps = fillProps;
-    const slotFills = fills.get(name);
-    if (slotFills) {
-      // Force update fills.
-      slotFills.forEach(fill => fill.rerender());
-    }
+    slots.set(name, {
+      ref,
+      fillProps
+    });
   };
   const registerFill = (name, ref) => {
     fills.set(name, [...(fills.get(name) || []), ref]);

package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js.map

@@ -1 +1 @@
-{"version":3,"names":["useState","isShallowEqual","observableMap","SlotFillContext","jsx","_jsx","createSlotRegistry","slots","fills","registerSlot","name","ref","fillProps","slot","get","set","unregisterSlot","delete","updateSlot","slotFills","forEach","fill","rerender","registerFill","unregisterFill","fillsForName","filter","fillRef","SlotFillProvider","children","registry","Provider","value"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/slot-fill-provider.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\nimport { observableMap } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\nimport type {\n\tSlotFillProviderProps,\n\tSlotFillBubblesVirtuallyContext,\n} from '../types';\n\nfunction createSlotRegistry(): SlotFillBubblesVirtuallyContext {\n\tconst slots: SlotFillBubblesVirtuallyContext[ 'slots' ] = observableMap();\n\tconst fills: SlotFillBubblesVirtuallyContext[ 'fills' ] = observableMap();\n\n\tconst registerSlot: SlotFillBubblesVirtuallyContext[ 'registerSlot' ] = (\n\t\tname,\n\t\tref,\n\t\tfillProps\n\t) => {\n\t\tconst slot = slots.get( name );\n\n\t\tslots.set( name, {\n\t\t\t...slot,\n\t\t\tref: ref || slot?.ref,\n\t\t\tfillProps: fillProps || slot?.fillProps || {},\n\t\t} );\n\t};\n\n\tconst unregisterSlot: SlotFillBubblesVirtuallyContext[ 'unregisterSlot' ] =\n\t\t( name, ref ) => {\n\t\t\tconst slot = slots.get( name );\n\t\t\tif ( ! slot ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Make sure we're not unregistering a slot registered by another element\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412\n\t\t\tif ( slot.ref !== ref ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tslots.delete( name );\n\t\t};\n\n\tconst updateSlot: SlotFillBubblesVirtuallyContext[ 'updateSlot' ] = (\n\t\tname,\n\t\tref,\n\t\tfillProps\n\t) => {\n\t\tconst slot = slots.get( name );\n\t\tif ( ! slot ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( slot.ref !== ref ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isShallowEqual( slot.fillProps, fillProps ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tslot.fillProps = fillProps;\n\t\tconst slotFills = fills.get( name );\n\t\tif ( slotFills ) {\n\t\t\t// Force update fills.\n\t\t\tslotFills.forEach( ( fill ) => fill.rerender() );\n\t\t}\n\t};\n\n\tconst registerFill: SlotFillBubblesVirtuallyContext[ 'registerFill' ] = (\n\t\tname,\n\t\tref\n\t) => {\n\t\tfills.set( name, [ ...( fills.get( name ) || [] ), ref ] );\n\t};\n\n\tconst unregisterFill: SlotFillBubblesVirtuallyContext[ 'unregisterFill' ] =\n\t\t( name, ref ) => {\n\t\t\tconst fillsForName = fills.get( name );\n\t\t\tif ( ! fillsForName ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfills.set(\n\t\t\t\tname,\n\t\t\t\tfillsForName.filter( ( fillRef ) => fillRef !== ref )\n\t\t\t);\n\t\t};\n\n\treturn {\n\t\tslots,\n\t\tfills,\n\t\tregisterSlot,\n\t\tupdateSlot,\n\t\tunregisterSlot,\n\t\tregisterFill,\n\t\tunregisterFill,\n\t};\n}\n\nexport default function SlotFillProvider( {\n\tchildren,\n}: SlotFillProviderProps ) {\n\tconst [ registry ] = useState( createSlotRegistry );\n\treturn (\n\t\t<SlotFillContext.Provider value={ registry }>\n\t\t\t{ children }\n\t\t</SlotFillContext.Provider>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useState","isShallowEqual","observableMap","SlotFillContext","jsx","_jsx","createSlotRegistry","slots","fills","registerSlot","name","ref","fillProps","set","unregisterSlot","slot","get","delete","updateSlot","registerFill","unregisterFill","fillsForName","filter","fillRef","SlotFillProvider","children","registry","Provider","value"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/slot-fill-provider.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\nimport { observableMap } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\nimport type {\n\tSlotFillProviderProps,\n\tSlotFillBubblesVirtuallyContext,\n} from '../types';\n\nfunction createSlotRegistry(): SlotFillBubblesVirtuallyContext {\n\tconst slots: SlotFillBubblesVirtuallyContext[ 'slots' ] = observableMap();\n\tconst fills: SlotFillBubblesVirtuallyContext[ 'fills' ] = observableMap();\n\n\tconst registerSlot: SlotFillBubblesVirtuallyContext[ 'registerSlot' ] = (\n\t\tname,\n\t\tref,\n\t\tfillProps\n\t) => {\n\t\tslots.set( name, { ref, fillProps } );\n\t};\n\n\tconst unregisterSlot: SlotFillBubblesVirtuallyContext[ 'unregisterSlot' ] =\n\t\t( name, ref ) => {\n\t\t\tconst slot = slots.get( name );\n\t\t\tif ( ! slot ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Make sure we're not unregistering a slot registered by another element\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412\n\t\t\tif ( slot.ref !== ref ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tslots.delete( name );\n\t\t};\n\n\tconst updateSlot: SlotFillBubblesVirtuallyContext[ 'updateSlot' ] = (\n\t\tname,\n\t\tref,\n\t\tfillProps\n\t) => {\n\t\tconst slot = slots.get( name );\n\t\tif ( ! slot ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( slot.ref !== ref ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isShallowEqual( slot.fillProps, fillProps ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tslots.set( name, { ref, fillProps } );\n\t};\n\n\tconst registerFill: SlotFillBubblesVirtuallyContext[ 'registerFill' ] = (\n\t\tname,\n\t\tref\n\t) => {\n\t\tfills.set( name, [ ...( fills.get( name ) || [] ), ref ] );\n\t};\n\n\tconst unregisterFill: SlotFillBubblesVirtuallyContext[ 'unregisterFill' ] =\n\t\t( name, ref ) => {\n\t\t\tconst fillsForName = fills.get( name );\n\t\t\tif ( ! fillsForName ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfills.set(\n\t\t\t\tname,\n\t\t\t\tfillsForName.filter( ( fillRef ) => fillRef !== ref )\n\t\t\t);\n\t\t};\n\n\treturn {\n\t\tslots,\n\t\tfills,\n\t\tregisterSlot,\n\t\tupdateSlot,\n\t\tunregisterSlot,\n\t\tregisterFill,\n\t\tunregisterFill,\n\t};\n}\n\nexport default function SlotFillProvider( {\n\tchildren,\n}: SlotFillProviderProps ) {\n\tconst [ registry ] = useState( createSlotRegistry );\n\treturn (\n\t\t<SlotFillContext.Provider value={ registry }>\n\t\t\t{ children }\n\t\t</SlotFillContext.Provider>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAQ,QAAQ,oBAAoB;AAC7C,OAAOC,cAAc,MAAM,6BAA6B;AACxD,SAASC,aAAa,QAAQ,oBAAoB;;AAElD;AACA;AACA;AACA,OAAOC,eAAe,MAAM,qBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAMlD,SAASC,kBAAkBA,CAAA,EAAoC;EAC9D,MAAMC,KAAiD,GAAGL,aAAa,CAAC,CAAC;EACzE,MAAMM,KAAiD,GAAGN,aAAa,CAAC,CAAC;EAEzE,MAAMO,YAA+D,GAAGA,CACvEC,IAAI,EACJC,GAAG,EACHC,SAAS,KACL;IACJL,KAAK,CAACM,GAAG,CAAEH,IAAI,EAAE;MAAEC,GAAG;MAAEC;IAAU,CAAE,CAAC;EACtC,CAAC;EAED,MAAME,cAAmE,GACxEA,CAAEJ,IAAI,EAAEC,GAAG,KAAM;IAChB,MAAMI,IAAI,GAAGR,KAAK,CAACS,GAAG,CAAEN,IAAK,CAAC;IAC9B,IAAK,CAAEK,IAAI,EAAG;MACb;IACD;;IAEA;IACA;IACA,IAAKA,IAAI,CAACJ,GAAG,KAAKA,GAAG,EAAG;MACvB;IACD;IAEAJ,KAAK,CAACU,MAAM,CAAEP,IAAK,CAAC;EACrB,CAAC;EAEF,MAAMQ,UAA2D,GAAGA,CACnER,IAAI,EACJC,GAAG,EACHC,SAAS,KACL;IACJ,MAAMG,IAAI,GAAGR,KAAK,CAACS,GAAG,CAAEN,IAAK,CAAC;IAC9B,IAAK,CAAEK,IAAI,EAAG;MACb;IACD;IAEA,IAAKA,IAAI,CAACJ,GAAG,KAAKA,GAAG,EAAG;MACvB;IACD;IAEA,IAAKV,cAAc,CAAEc,IAAI,CAACH,SAAS,EAAEA,SAAU,CAAC,EAAG;MAClD;IACD;IAEAL,KAAK,CAACM,GAAG,CAAEH,IAAI,EAAE;MAAEC,GAAG;MAAEC;IAAU,CAAE,CAAC;EACtC,CAAC;EAED,MAAMO,YAA+D,GAAGA,CACvET,IAAI,EACJC,GAAG,KACC;IACJH,KAAK,CAACK,GAAG,CAAEH,IAAI,EAAE,CAAE,IAAKF,KAAK,CAACQ,GAAG,CAAEN,IAAK,CAAC,IAAI,EAAE,CAAE,EAAEC,GAAG,CAAG,CAAC;EAC3D,CAAC;EAED,MAAMS,cAAmE,GACxEA,CAAEV,IAAI,EAAEC,GAAG,KAAM;IAChB,MAAMU,YAAY,GAAGb,KAAK,CAACQ,GAAG,CAAEN,IAAK,CAAC;IACtC,IAAK,CAAEW,YAAY,EAAG;MACrB;IACD;IAEAb,KAAK,CAACK,GAAG,CACRH,IAAI,EACJW,YAAY,CAACC,MAAM,CAAIC,OAAO,IAAMA,OAAO,KAAKZ,GAAI,CACrD,CAAC;EACF,CAAC;EAEF,OAAO;IACNJ,KAAK;IACLC,KAAK;IACLC,YAAY;IACZS,UAAU;IACVJ,cAAc;IACdK,YAAY;IACZC;EACD,CAAC;AACF;AAEA,eAAe,SAASI,gBAAgBA,CAAE;EACzCC;AACsB,CAAC,EAAG;EAC1B,MAAM,CAAEC,QAAQ,CAAE,GAAG1B,QAAQ,CAAEM,kBAAmB,CAAC;EACnD,oBACCD,IAAA,CAACF,eAAe,CAACwB,QAAQ;IAACC,KAAK,EAAGF,QAAU;IAAAD,QAAA,EACzCA;EAAQ,CACe,CAAC;AAE7B","ignoreList":[]}

package/build-module/slot-fill/bubbles-virtually/slot.js

@@ -24,11 +24,7 @@ function Slot(props, forwardedRef) {
     children,
     ...restProps
   } = props;
-  const {
-    registerSlot,
-    unregisterSlot,
-    ...registry
-  } = useContext(SlotFillContext);
+  const registry = useContext(SlotFillContext);
   const ref = useRef(null);
 
   // We don't want to unregister and register the slot whenever
@@ -40,11 +36,9 @@ function Slot(props, forwardedRef) {
     fillPropsRef.current = fillProps;
   }, [fillProps]);
   useLayoutEffect(() => {
-    registerSlot(name, ref, fillPropsRef.current);
-    return () => {
-      unregisterSlot(name, ref);
-    };
-  }, [registerSlot, unregisterSlot, name]);
+    registry.registerSlot(name, ref, fillPropsRef.current);
+    return () => registry.unregisterSlot(name, ref);
+  }, [registry, name]);
   useLayoutEffect(() => {
     registry.updateSlot(name, ref, fillPropsRef.current);
   });

package/build-module/slot-fill/bubbles-virtually/slot.js.map

@@ -1 +1 @@
-{"version":3,"names":["useRef","useLayoutEffect","useContext","forwardRef","useMergeRefs","View","SlotFillContext","jsx","_jsx","Slot","props","forwardedRef","name","fillProps","as","children","restProps","registerSlot","unregisterSlot","registry","ref","fillPropsRef","current","updateSlot"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/slot.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseRef,\n\tuseLayoutEffect,\n\tuseContext,\n\tforwardRef,\n} from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { View } from '../../view';\nimport SlotFillContext from './slot-fill-context';\nimport type { WordPressComponentProps } from '../../context';\nimport type { SlotComponentProps } from '../types';\n\nfunction Slot(\n\tprops: WordPressComponentProps<\n\t\tOmit< SlotComponentProps, 'bubblesVirtually' >,\n\t\t'div'\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tname,\n\t\tfillProps = {},\n\t\tas,\n\t\t// `children` is not allowed. However, if it is passed,\n\t\t// it will be displayed as is, so remove `children`.\n\t\tchildren,\n\t\t...restProps\n\t} = props;\n\n\tconst { registerSlot, unregisterSlot, ...registry } =\n\t\tuseContext( SlotFillContext );\n\n\tconst ref = useRef< HTMLElement >( null );\n\n\t// We don't want to unregister and register the slot whenever\n\t// `fillProps` change, which would cause the fill to be re-mounted. Instead,\n\t// we can just update the slot (see hook below).\n\t// For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973\n\tconst fillPropsRef = useRef( fillProps );\n\tuseLayoutEffect( () => {\n\t\tfillPropsRef.current = fillProps;\n\t}, [ fillProps ] );\n\n\tuseLayoutEffect( () => {\n\t\tregisterSlot( name, ref, fillPropsRef.current );\n\t\treturn () => {\n\t\t\tunregisterSlot( name, ref );\n\t\t};\n\t}, [ registerSlot, unregisterSlot, name ] );\n\n\tuseLayoutEffect( () => {\n\t\tregistry.updateSlot( name, ref, fillPropsRef.current );\n\t} );\n\n\treturn (\n\t\t<View\n\t\t\tas={ as }\n\t\t\tref={ useMergeRefs( [ forwardedRef, ref ] ) }\n\t\t\t{ ...restProps }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( Slot );\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,MAAM,EACNC,eAAe,EACfC,UAAU,EACVC,UAAU,QACJ,oBAAoB;AAC3B,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA,SAASC,IAAI,QAAQ,YAAY;AACjC,OAAOC,eAAe,MAAM,qBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIlD,SAASC,IAAIA,CACZC,KAGC,EACDC,YAAiC,EAChC;EACD,MAAM;IACLC,IAAI;IACJC,SAAS,GAAG,CAAC,CAAC;IACdC,EAAE;IACF;IACA;IACAC,QAAQ;IACR,GAAGC;EACJ,CAAC,GAAGN,KAAK;EAET,MAAM;IAAEO,YAAY;IAAEC,cAAc;IAAE,GAAGC;EAAS,CAAC,GAClDjB,UAAU,CAAEI,eAAgB,CAAC;EAE9B,MAAMc,GAAG,GAAGpB,MAAM,CAAiB,IAAK,CAAC;;EAEzC;EACA;EACA;EACA;EACA,MAAMqB,YAAY,GAAGrB,MAAM,CAAEa,SAAU,CAAC;EACxCZ,eAAe,CAAE,MAAM;IACtBoB,YAAY,CAACC,OAAO,GAAGT,SAAS;EACjC,CAAC,EAAE,CAAEA,SAAS,CAAG,CAAC;EAElBZ,eAAe,CAAE,MAAM;IACtBgB,YAAY,CAAEL,IAAI,EAAEQ,GAAG,EAAEC,YAAY,CAACC,OAAQ,CAAC;IAC/C,OAAO,MAAM;MACZJ,cAAc,CAAEN,IAAI,EAAEQ,GAAI,CAAC;IAC5B,CAAC;EACF,CAAC,EAAE,CAAEH,YAAY,EAAEC,cAAc,EAAEN,IAAI,CAAG,CAAC;EAE3CX,eAAe,CAAE,MAAM;IACtBkB,QAAQ,CAACI,UAAU,CAAEX,IAAI,EAAEQ,GAAG,EAAEC,YAAY,CAACC,OAAQ,CAAC;EACvD,CAAE,CAAC;EAEH,oBACCd,IAAA,CAACH,IAAI;IACJS,EAAE,EAAGA,EAAI;IACTM,GAAG,EAAGhB,YAAY,CAAE,CAAEO,YAAY,EAAES,GAAG,CAAG,CAAG;IAAA,GACxCJ;EAAS,CACd,CAAC;AAEJ;AAEA,eAAeb,UAAU,CAAEM,IAAK,CAAC","ignoreList":[]}
+{"version":3,"names":["useRef","useLayoutEffect","useContext","forwardRef","useMergeRefs","View","SlotFillContext","jsx","_jsx","Slot","props","forwardedRef","name","fillProps","as","children","restProps","registry","ref","fillPropsRef","current","registerSlot","unregisterSlot","updateSlot"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/slot.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseRef,\n\tuseLayoutEffect,\n\tuseContext,\n\tforwardRef,\n} from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { View } from '../../view';\nimport SlotFillContext from './slot-fill-context';\nimport type { WordPressComponentProps } from '../../context';\nimport type { SlotComponentProps } from '../types';\n\nfunction Slot(\n\tprops: WordPressComponentProps<\n\t\tOmit< SlotComponentProps, 'bubblesVirtually' >,\n\t\t'div'\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tname,\n\t\tfillProps = {},\n\t\tas,\n\t\t// `children` is not allowed. However, if it is passed,\n\t\t// it will be displayed as is, so remove `children`.\n\t\tchildren,\n\t\t...restProps\n\t} = props;\n\n\tconst registry = useContext( SlotFillContext );\n\n\tconst ref = useRef< HTMLElement >( null );\n\n\t// We don't want to unregister and register the slot whenever\n\t// `fillProps` change, which would cause the fill to be re-mounted. Instead,\n\t// we can just update the slot (see hook below).\n\t// For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973\n\tconst fillPropsRef = useRef( fillProps );\n\tuseLayoutEffect( () => {\n\t\tfillPropsRef.current = fillProps;\n\t}, [ fillProps ] );\n\n\tuseLayoutEffect( () => {\n\t\tregistry.registerSlot( name, ref, fillPropsRef.current );\n\t\treturn () => registry.unregisterSlot( name, ref );\n\t}, [ registry, name ] );\n\n\tuseLayoutEffect( () => {\n\t\tregistry.updateSlot( name, ref, fillPropsRef.current );\n\t} );\n\n\treturn (\n\t\t<View\n\t\t\tas={ as }\n\t\t\tref={ useMergeRefs( [ forwardedRef, ref ] ) }\n\t\t\t{ ...restProps }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( Slot );\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,MAAM,EACNC,eAAe,EACfC,UAAU,EACVC,UAAU,QACJ,oBAAoB;AAC3B,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA,SAASC,IAAI,QAAQ,YAAY;AACjC,OAAOC,eAAe,MAAM,qBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIlD,SAASC,IAAIA,CACZC,KAGC,EACDC,YAAiC,EAChC;EACD,MAAM;IACLC,IAAI;IACJC,SAAS,GAAG,CAAC,CAAC;IACdC,EAAE;IACF;IACA;IACAC,QAAQ;IACR,GAAGC;EACJ,CAAC,GAAGN,KAAK;EAET,MAAMO,QAAQ,GAAGf,UAAU,CAAEI,eAAgB,CAAC;EAE9C,MAAMY,GAAG,GAAGlB,MAAM,CAAiB,IAAK,CAAC;;EAEzC;EACA;EACA;EACA;EACA,MAAMmB,YAAY,GAAGnB,MAAM,CAAEa,SAAU,CAAC;EACxCZ,eAAe,CAAE,MAAM;IACtBkB,YAAY,CAACC,OAAO,GAAGP,SAAS;EACjC,CAAC,EAAE,CAAEA,SAAS,CAAG,CAAC;EAElBZ,eAAe,CAAE,MAAM;IACtBgB,QAAQ,CAACI,YAAY,CAAET,IAAI,EAAEM,GAAG,EAAEC,YAAY,CAACC,OAAQ,CAAC;IACxD,OAAO,MAAMH,QAAQ,CAACK,cAAc,CAAEV,IAAI,EAAEM,GAAI,CAAC;EAClD,CAAC,EAAE,CAAED,QAAQ,EAAEL,IAAI,CAAG,CAAC;EAEvBX,eAAe,CAAE,MAAM;IACtBgB,QAAQ,CAACM,UAAU,CAAEX,IAAI,EAAEM,GAAG,EAAEC,YAAY,CAACC,OAAQ,CAAC;EACvD,CAAE,CAAC;EAEH,oBACCZ,IAAA,CAACH,IAAI;IACJS,EAAE,EAAGA,EAAI;IACTI,GAAG,EAAGd,YAAY,CAAE,CAAEO,YAAY,EAAEO,GAAG,CAAG,CAAG;IAAA,GACxCF;EAAS,CACd,CAAC;AAEJ;AAEA,eAAeb,UAAU,CAAEM,IAAK,CAAC","ignoreList":[]}

package/build-module/slot-fill/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/slot-fill/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type { ObservableMap } from '@wordpress/compose';\n\nexport type DistributiveOmit< T, K extends keyof any > = T extends any\n\t? Omit< T, K >\n\t: never;\n\nexport type SlotKey = string | symbol;\n\nexport type FillProps = Record< string, any >;\n\ntype SlotPropBase = {\n\t/**\n\t * Slot name.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * props to pass from `Slot` to `Fill`.\n\t *\n\t * @default {}\n\t */\n\tfillProps?: FillProps;\n};\n\nexport type SlotComponentProps =\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually: true;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: never;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: string;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: React.CSSProperties;\n\t  } )\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually?: false;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: ( fills: ReactNode ) => ReactNode;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: never;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: never;\n\t  } );\n\nexport type FillComponentProps = {\n\t/**\n\t * The name of the slot to fill into.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * Children elements or render function.\n\t */\n\tchildren?: ReactNode | ( ( fillProps: FillProps ) => ReactNode );\n};\n\nexport type SlotFillProviderProps = {\n\t/**\n\t * The children elements.\n\t */\n\tchildren: ReactNode;\n\n\t/**\n\t * Whether to pass slots to the parent provider if existent.\n\t */\n\tpassthrough?: boolean;\n};\n\nexport type SlotRef = RefObject< HTMLElement >;\nexport type Rerenderable = { rerender: () => void };\n\nexport type SlotFillBubblesVirtuallyContext = {\n\tslots: ObservableMap< SlotKey, { ref: SlotRef; fillProps: FillProps } >;\n\tfills: ObservableMap< SlotKey, Rerenderable[] >;\n\tregisterSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tunregisterSlot: ( name: SlotKey, ref: SlotRef ) => void;\n\tupdateSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tregisterFill: ( name: SlotKey, ref: Rerenderable ) => void;\n\tunregisterFill: ( name: SlotKey, ref: Rerenderable ) => void;\n\n\t/**\n\t * This helps the provider know if it's using the default context value or not.\n\t */\n\tisDefault?: boolean;\n};\n\nexport type BaseSlotFillContext = {\n\tregisterSlot: ( name: SlotKey, slot: Rerenderable ) => void;\n\tunregisterSlot: ( name: SlotKey, slot: Rerenderable ) => void;\n\tregisterFill: ( name: SlotKey, instance: FillComponentProps ) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillComponentProps ) => void;\n\tgetSlot: ( name: SlotKey ) => Rerenderable | undefined;\n\tgetFills: (\n\t\tname: SlotKey,\n\t\tslotInstance: Rerenderable\n\t) => FillComponentProps[];\n\tsubscribe: ( listener: () => void ) => () => void;\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/slot-fill/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type { ObservableMap } from '@wordpress/compose';\n\nexport type DistributiveOmit< T, K extends keyof any > = T extends any\n\t? Omit< T, K >\n\t: never;\n\nexport type SlotKey = string | symbol;\n\nexport type FillProps = Record< string, any >;\n\ntype SlotPropBase = {\n\t/**\n\t * Slot name.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * props to pass from `Slot` to `Fill`.\n\t *\n\t * @default {}\n\t */\n\tfillProps?: FillProps;\n};\n\nexport type SlotComponentProps =\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually: true;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: never;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: string;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: React.CSSProperties;\n\t  } )\n\t| ( SlotPropBase & {\n\t\t\t/**\n\t\t\t * By default, events will bubble to their parents on the DOM hierarchy (native event bubbling).\n\t\t\t * If set to true, events will bubble to their virtual parent in the React elements hierarchy instead,\n\t\t\t * also accept an optional `className`, `id`, etc.  to add to the slot container.\n\t\t\t */\n\t\t\tbubblesVirtually?: false;\n\n\t\t\t/**\n\t\t\t * A function that returns nodes to be rendered.\n\t\t\t * Supported only when `bubblesVirtually` is `false`.\n\t\t\t */\n\t\t\tchildren?: ( fills: ReactNode ) => ReactNode;\n\n\t\t\t/**\n\t\t\t * Additional className for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tclassName?: never;\n\n\t\t\t/**\n\t\t\t * Additional styles for the `Slot` component.\n\t\t\t * Supported only when `bubblesVirtually` is `true`.\n\t\t\t */\n\t\t\tstyle?: never;\n\t  } );\n\nexport type FillComponentProps = {\n\t/**\n\t * The name of the slot to fill into.\n\t */\n\tname: SlotKey;\n\n\t/**\n\t * Children elements or render function.\n\t */\n\tchildren?: ReactNode | ( ( fillProps: FillProps ) => ReactNode );\n};\n\nexport type SlotFillProviderProps = {\n\t/**\n\t * The children elements.\n\t */\n\tchildren: ReactNode;\n\n\t/**\n\t * Whether to pass slots to the parent provider if existent.\n\t */\n\tpassthrough?: boolean;\n};\n\nexport type SlotRef = RefObject< HTMLElement >;\nexport type Rerenderable = { rerender: () => void };\nexport type FillInstance = {};\n\nexport type SlotFillBubblesVirtuallyContext = {\n\tslots: ObservableMap< SlotKey, { ref: SlotRef; fillProps: FillProps } >;\n\tfills: ObservableMap< SlotKey, FillInstance[] >;\n\tregisterSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tunregisterSlot: ( name: SlotKey, ref: SlotRef ) => void;\n\tupdateSlot: ( name: SlotKey, ref: SlotRef, fillProps: FillProps ) => void;\n\tregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillInstance ) => void;\n\n\t/**\n\t * This helps the provider know if it's using the default context value or not.\n\t */\n\tisDefault?: boolean;\n};\n\nexport type BaseSlotFillContext = {\n\tregisterSlot: ( name: SlotKey, slot: Rerenderable ) => void;\n\tunregisterSlot: ( name: SlotKey, slot: Rerenderable ) => void;\n\tregisterFill: ( name: SlotKey, instance: FillComponentProps ) => void;\n\tunregisterFill: ( name: SlotKey, instance: FillComponentProps ) => void;\n\tgetSlot: ( name: SlotKey ) => Rerenderable | undefined;\n\tgetFills: (\n\t\tname: SlotKey,\n\t\tslotInstance: Rerenderable\n\t) => FillComponentProps[];\n\tsubscribe: ( listener: () => void ) => () => void;\n};\n"],"mappings":"","ignoreList":[]}

package/build-module/style-provider/index.js

@@ -1,4 +1,3 @@
-/* wp:polyfill */
 /**
  * External dependencies
  */

package/build-module/style-provider/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["CacheProvider","createCache","uuid","jsx","_jsx","uuidCache","Set","containerCacheMap","WeakMap","memoizedCreateCacheWithContainer","container","has","get","key","v4","replace","add","cache","set","StyleProvider","props","children","document","head","value"],"sources":["@wordpress/components/src/style-provider/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { CacheProvider } from '@emotion/react';\nimport createCache from '@emotion/cache';\nimport * as uuid from 'uuid';\n\n/**\n * Internal dependencies\n */\nimport type { StyleProviderProps } from './types';\n\nconst uuidCache = new Set();\n// Use a weak map so that when the container is detached it's automatically\n// dereferenced to avoid memory leak.\nconst containerCacheMap = new WeakMap();\n\nconst memoizedCreateCacheWithContainer = ( container: HTMLElement ) => {\n\tif ( containerCacheMap.has( container ) ) {\n\t\treturn containerCacheMap.get( container );\n\t}\n\n\t// Emotion only accepts alphabetical and hyphenated keys so we just\n\t// strip the numbers from the UUID. It _should_ be fine.\n\tlet key = uuid.v4().replace( /[0-9]/g, '' );\n\twhile ( uuidCache.has( key ) ) {\n\t\tkey = uuid.v4().replace( /[0-9]/g, '' );\n\t}\n\tuuidCache.add( key );\n\n\tconst cache = createCache( { container, key } );\n\tcontainerCacheMap.set( container, cache );\n\treturn cache;\n};\n\nexport function StyleProvider( props: StyleProviderProps ) {\n\tconst { children, document } = props;\n\n\tif ( ! document ) {\n\t\treturn null;\n\t}\n\n\tconst cache = memoizedCreateCacheWithContainer( document.head );\n\n\treturn <CacheProvider value={ cache }>{ children }</CacheProvider>;\n}\n\nexport default StyleProvider;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,gBAAgB;AAC9C,OAAOC,WAAW,MAAM,gBAAgB;AACxC,OAAO,KAAKC,IAAI,MAAM,MAAM;;AAE5B;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAKA,MAAMC,SAAS,GAAG,IAAIC,GAAG,CAAC,CAAC;AAC3B;AACA;AACA,MAAMC,iBAAiB,GAAG,IAAIC,OAAO,CAAC,CAAC;AAEvC,MAAMC,gCAAgC,GAAKC,SAAsB,IAAM;EACtE,IAAKH,iBAAiB,CAACI,GAAG,CAAED,SAAU,CAAC,EAAG;IACzC,OAAOH,iBAAiB,CAACK,GAAG,CAAEF,SAAU,CAAC;EAC1C;;EAEA;EACA;EACA,IAAIG,GAAG,GAAGX,IAAI,CAACY,EAAE,CAAC,CAAC,CAACC,OAAO,CAAE,QAAQ,EAAE,EAAG,CAAC;EAC3C,OAAQV,SAAS,CAACM,GAAG,CAAEE,GAAI,CAAC,EAAG;IAC9BA,GAAG,GAAGX,IAAI,CAACY,EAAE,CAAC,CAAC,CAACC,OAAO,CAAE,QAAQ,EAAE,EAAG,CAAC;EACxC;EACAV,SAAS,CAACW,GAAG,CAAEH,GAAI,CAAC;EAEpB,MAAMI,KAAK,GAAGhB,WAAW,CAAE;IAAES,SAAS;IAAEG;EAAI,CAAE,CAAC;EAC/CN,iBAAiB,CAACW,GAAG,CAAER,SAAS,EAAEO,KAAM,CAAC;EACzC,OAAOA,KAAK;AACb,CAAC;AAED,OAAO,SAASE,aAAaA,CAAEC,KAAyB,EAAG;EAC1D,MAAM;IAAEC,QAAQ;IAAEC;EAAS,CAAC,GAAGF,KAAK;EAEpC,IAAK,CAAEE,QAAQ,EAAG;IACjB,OAAO,IAAI;EACZ;EAEA,MAAML,KAAK,GAAGR,gCAAgC,CAAEa,QAAQ,CAACC,IAAK,CAAC;EAE/D,oBAAOnB,IAAA,CAACJ,aAAa;IAACwB,KAAK,EAAGP,KAAO;IAAAI,QAAA,EAAGA;EAAQ,CAAiB,CAAC;AACnE;AAEA,eAAeF,aAAa","ignoreList":[]}
+{"version":3,"names":["CacheProvider","createCache","uuid","jsx","_jsx","uuidCache","Set","containerCacheMap","WeakMap","memoizedCreateCacheWithContainer","container","has","get","key","v4","replace","add","cache","set","StyleProvider","props","children","document","head","value"],"sources":["@wordpress/components/src/style-provider/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { CacheProvider } from '@emotion/react';\nimport createCache from '@emotion/cache';\nimport * as uuid from 'uuid';\n\n/**\n * Internal dependencies\n */\nimport type { StyleProviderProps } from './types';\n\nconst uuidCache = new Set();\n// Use a weak map so that when the container is detached it's automatically\n// dereferenced to avoid memory leak.\nconst containerCacheMap = new WeakMap();\n\nconst memoizedCreateCacheWithContainer = ( container: HTMLElement ) => {\n\tif ( containerCacheMap.has( container ) ) {\n\t\treturn containerCacheMap.get( container );\n\t}\n\n\t// Emotion only accepts alphabetical and hyphenated keys so we just\n\t// strip the numbers from the UUID. It _should_ be fine.\n\tlet key = uuid.v4().replace( /[0-9]/g, '' );\n\twhile ( uuidCache.has( key ) ) {\n\t\tkey = uuid.v4().replace( /[0-9]/g, '' );\n\t}\n\tuuidCache.add( key );\n\n\tconst cache = createCache( { container, key } );\n\tcontainerCacheMap.set( container, cache );\n\treturn cache;\n};\n\nexport function StyleProvider( props: StyleProviderProps ) {\n\tconst { children, document } = props;\n\n\tif ( ! document ) {\n\t\treturn null;\n\t}\n\n\tconst cache = memoizedCreateCacheWithContainer( document.head );\n\n\treturn <CacheProvider value={ cache }>{ children }</CacheProvider>;\n}\n\nexport default StyleProvider;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,gBAAgB;AAC9C,OAAOC,WAAW,MAAM,gBAAgB;AACxC,OAAO,KAAKC,IAAI,MAAM,MAAM;;AAE5B;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAKA,MAAMC,SAAS,GAAG,IAAIC,GAAG,CAAC,CAAC;AAC3B;AACA;AACA,MAAMC,iBAAiB,GAAG,IAAIC,OAAO,CAAC,CAAC;AAEvC,MAAMC,gCAAgC,GAAKC,SAAsB,IAAM;EACtE,IAAKH,iBAAiB,CAACI,GAAG,CAAED,SAAU,CAAC,EAAG;IACzC,OAAOH,iBAAiB,CAACK,GAAG,CAAEF,SAAU,CAAC;EAC1C;;EAEA;EACA;EACA,IAAIG,GAAG,GAAGX,IAAI,CAACY,EAAE,CAAC,CAAC,CAACC,OAAO,CAAE,QAAQ,EAAE,EAAG,CAAC;EAC3C,OAAQV,SAAS,CAACM,GAAG,CAAEE,GAAI,CAAC,EAAG;IAC9BA,GAAG,GAAGX,IAAI,CAACY,EAAE,CAAC,CAAC,CAACC,OAAO,CAAE,QAAQ,EAAE,EAAG,CAAC;EACxC;EACAV,SAAS,CAACW,GAAG,CAAEH,GAAI,CAAC;EAEpB,MAAMI,KAAK,GAAGhB,WAAW,CAAE;IAAES,SAAS;IAAEG;EAAI,CAAE,CAAC;EAC/CN,iBAAiB,CAACW,GAAG,CAAER,SAAS,EAAEO,KAAM,CAAC;EACzC,OAAOA,KAAK;AACb,CAAC;AAED,OAAO,SAASE,aAAaA,CAAEC,KAAyB,EAAG;EAC1D,MAAM;IAAEC,QAAQ;IAAEC;EAAS,CAAC,GAAGF,KAAK;EAEpC,IAAK,CAAEE,QAAQ,EAAG;IACjB,OAAO,IAAI;EACZ;EAEA,MAAML,KAAK,GAAGR,gCAAgC,CAAEa,QAAQ,CAACC,IAAK,CAAC;EAE/D,oBAAOnB,IAAA,CAACJ,aAAa;IAACwB,KAAK,EAAGP,KAAO;IAAAI,QAAA,EAAGA;EAAQ,CAAiB,CAAC;AACnE;AAEA,eAAeF,aAAa","ignoreList":[]}

package/build-module/tabs/tab.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import * as Ariakit from '@ariakit/react';
-
 /**
  * WordPress dependencies
  */
@@ -30,15 +25,6 @@ export const Tab = forwardRef(function Tab({
     store,
     instanceId
   } = (_useTabsContext = useTabsContext()) !== null && _useTabsContext !== void 0 ? _useTabsContext : {};
-
-  // If the active item is not connected, the tablist may end up in a state
-  // where none of the tabs are tabbable. In this case, we force all tabs to
-  // be tabbable, so that as soon as an item received focus, it becomes active
-  // and Tablist goes back to working as expected.
-  // eslint-disable-next-line @wordpress/no-unused-vars-before-return
-  const tabbable = Ariakit.useStoreState(store, state => {
-    return state?.activeId !== null && !store?.item(state?.activeId)?.element?.isConnected;
-  });
   if (!store) {
     globalThis.SCRIPT_DEBUG === true ? warning('`Tabs.Tab` must be wrapped in a `Tabs` component.') : void 0;
     return null;
@@ -50,7 +36,6 @@ export const Tab = forwardRef(function Tab({
     id: instancedTabId,
     disabled: disabled,
     render: render,
-    tabbable: tabbable,
     ...otherProps,
     children: [/*#__PURE__*/_jsx(StyledTabChildren, {
       children: children

package/build-module/tabs/tab.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","forwardRef","warning","useTabsContext","Tab","StyledTab","TabChildren","StyledTabChildren","TabChevron","StyledTabChevron","chevronRight","jsx","_jsx","jsxs","_jsxs","children","tabId","disabled","render","otherProps","ref","_useTabsContext","store","instanceId","tabbable","useStoreState","state","activeId","item","element","isConnected","globalThis","SCRIPT_DEBUG","instancedTabId","id","icon"],"sources":["@wordpress/components/src/tabs/tab.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\n\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabProps } from './types';\nimport warning from '@wordpress/warning';\nimport { useTabsContext } from './context';\nimport {\n\tTab as StyledTab,\n\tTabChildren as StyledTabChildren,\n\tTabChevron as StyledTabChevron,\n} from './styles';\nimport type { WordPressComponentProps } from '../context';\nimport { chevronRight } from '@wordpress/icons';\n\nexport const Tab = forwardRef<\n\tHTMLButtonElement,\n\tOmit< WordPressComponentProps< TabProps, 'button', false >, 'id' >\n>( function Tab( { children, tabId, disabled, render, ...otherProps }, ref ) {\n\tconst { store, instanceId } = useTabsContext() ?? {};\n\n\t// If the active item is not connected, the tablist may end up in a state\n\t// where none of the tabs are tabbable. In this case, we force all tabs to\n\t// be tabbable, so that as soon as an item received focus, it becomes active\n\t// and Tablist goes back to working as expected.\n\t// eslint-disable-next-line @wordpress/no-unused-vars-before-return\n\tconst tabbable = Ariakit.useStoreState( store, ( state ) => {\n\t\treturn (\n\t\t\tstate?.activeId !== null &&\n\t\t\t! store?.item( state?.activeId )?.element?.isConnected\n\t\t);\n\t} );\n\n\tif ( ! store ) {\n\t\twarning( '`Tabs.Tab` must be wrapped in a `Tabs` component.' );\n\t\treturn null;\n\t}\n\n\tconst instancedTabId = `${ instanceId }-${ tabId }`;\n\n\treturn (\n\t\t<StyledTab\n\t\t\tref={ ref }\n\t\t\tstore={ store }\n\t\t\tid={ instancedTabId }\n\t\t\tdisabled={ disabled }\n\t\t\trender={ render }\n\t\t\ttabbable={ tabbable }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t<StyledTabChildren>{ children }</StyledTabChildren>\n\t\t\t<StyledTabChevron icon={ chevronRight } />\n\t\t</StyledTab>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;;AAEA,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;;AAEA,OAAOC,OAAO,MAAM,oBAAoB;AACxC,SAASC,cAAc,QAAQ,WAAW;AAC1C,SACCC,GAAG,IAAIC,SAAS,EAChBC,WAAW,IAAIC,iBAAiB,EAChCC,UAAU,IAAIC,gBAAgB,QACxB,UAAU;AAEjB,SAASC,YAAY,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEhD,OAAO,MAAMV,GAAG,GAAGH,UAAU,CAG1B,SAASG,GAAGA,CAAE;EAAEW,QAAQ;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;EAAE,GAAGC;AAAW,CAAC,EAAEC,GAAG,EAAG;EAAA,IAAAC,eAAA;EAC5E,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,IAAAF,eAAA,GAAGlB,cAAc,CAAC,CAAC,cAAAkB,eAAA,cAAAA,eAAA,GAAI,CAAC,CAAC;;EAEpD;EACA;EACA;EACA;EACA;EACA,MAAMG,QAAQ,GAAGxB,OAAO,CAACyB,aAAa,CAAEH,KAAK,EAAII,KAAK,IAAM;IAC3D,OACCA,KAAK,EAAEC,QAAQ,KAAK,IAAI,IACxB,CAAEL,KAAK,EAAEM,IAAI,CAAEF,KAAK,EAAEC,QAAS,CAAC,EAAEE,OAAO,EAAEC,WAAW;EAExD,CAAE,CAAC;EAEH,IAAK,CAAER,KAAK,EAAG;IACdS,UAAA,CAAAC,YAAA,YAAA9B,OAAO,CAAE,mDAAoD,CAAC;IAC9D,OAAO,IAAI;EACZ;EAEA,MAAM+B,cAAc,GAAG,GAAIV,UAAU,IAAMP,KAAK,EAAG;EAEnD,oBACCF,KAAA,CAACT,SAAS;IACTe,GAAG,EAAGA,GAAK;IACXE,KAAK,EAAGA,KAAO;IACfY,EAAE,EAAGD,cAAgB;IACrBhB,QAAQ,EAAGA,QAAU;IACrBC,MAAM,EAAGA,MAAQ;IACjBM,QAAQ,EAAGA,QAAU;IAAA,GAChBL,UAAU;IAAAJ,QAAA,gBAEfH,IAAA,CAACL,iBAAiB;MAAAQ,QAAA,EAAGA;IAAQ,CAAqB,CAAC,eACnDH,IAAA,CAACH,gBAAgB;MAAC0B,IAAI,EAAGzB;IAAc,CAAE,CAAC;EAAA,CAChC,CAAC;AAEd,CAAE,CAAC","ignoreList":[]}
+{"version":3,"names":["forwardRef","warning","useTabsContext","Tab","StyledTab","TabChildren","StyledTabChildren","TabChevron","StyledTabChevron","chevronRight","jsx","_jsx","jsxs","_jsxs","children","tabId","disabled","render","otherProps","ref","_useTabsContext","store","instanceId","globalThis","SCRIPT_DEBUG","instancedTabId","id","icon"],"sources":["@wordpress/components/src/tabs/tab.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\n\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabProps } from './types';\nimport warning from '@wordpress/warning';\nimport { useTabsContext } from './context';\nimport {\n\tTab as StyledTab,\n\tTabChildren as StyledTabChildren,\n\tTabChevron as StyledTabChevron,\n} from './styles';\nimport type { WordPressComponentProps } from '../context';\nimport { chevronRight } from '@wordpress/icons';\n\nexport const Tab = forwardRef<\n\tHTMLButtonElement,\n\tOmit< WordPressComponentProps< TabProps, 'button', false >, 'id' >\n>( function Tab( { children, tabId, disabled, render, ...otherProps }, ref ) {\n\tconst { store, instanceId } = useTabsContext() ?? {};\n\n\tif ( ! store ) {\n\t\twarning( '`Tabs.Tab` must be wrapped in a `Tabs` component.' );\n\t\treturn null;\n\t}\n\n\tconst instancedTabId = `${ instanceId }-${ tabId }`;\n\n\treturn (\n\t\t<StyledTab\n\t\t\tref={ ref }\n\t\t\tstore={ store }\n\t\t\tid={ instancedTabId }\n\t\t\tdisabled={ disabled }\n\t\t\trender={ render }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t<StyledTabChildren>{ children }</StyledTabChildren>\n\t\t\t<StyledTabChevron icon={ chevronRight } />\n\t\t</StyledTab>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;;AAEA,OAAOC,OAAO,MAAM,oBAAoB;AACxC,SAASC,cAAc,QAAQ,WAAW;AAC1C,SACCC,GAAG,IAAIC,SAAS,EAChBC,WAAW,IAAIC,iBAAiB,EAChCC,UAAU,IAAIC,gBAAgB,QACxB,UAAU;AAEjB,SAASC,YAAY,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEhD,OAAO,MAAMV,GAAG,GAAGH,UAAU,CAG1B,SAASG,GAAGA,CAAE;EAAEW,QAAQ;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;EAAE,GAAGC;AAAW,CAAC,EAAEC,GAAG,EAAG;EAAA,IAAAC,eAAA;EAC5E,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,IAAAF,eAAA,GAAGlB,cAAc,CAAC,CAAC,cAAAkB,eAAA,cAAAA,eAAA,GAAI,CAAC,CAAC;EAEpD,IAAK,CAAEC,KAAK,EAAG;IACdE,UAAA,CAAAC,YAAA,YAAAvB,OAAO,CAAE,mDAAoD,CAAC;IAC9D,OAAO,IAAI;EACZ;EAEA,MAAMwB,cAAc,GAAG,GAAIH,UAAU,IAAMP,KAAK,EAAG;EAEnD,oBACCF,KAAA,CAACT,SAAS;IACTe,GAAG,EAAGA,GAAK;IACXE,KAAK,EAAGA,KAAO;IACfK,EAAE,EAAGD,cAAgB;IACrBT,QAAQ,EAAGA,QAAU;IACrBC,MAAM,EAAGA,MAAQ;IAAA,GACZC,UAAU;IAAAJ,QAAA,gBAEfH,IAAA,CAACL,iBAAiB;MAAAQ,QAAA,EAAGA;IAAQ,CAAqB,CAAC,eACnDH,IAAA,CAACH,gBAAgB;MAACmB,IAAI,EAAGlB;IAAc,CAAE,CAAC;EAAA,CAChC,CAAC;AAEd,CAAE,CAAC","ignoreList":[]}

package/build-module/toolbar/toolbar-button/index.js

@@ -41,6 +41,7 @@ function UnforwardedToolbarButton(props, ref) {
       children: /*#__PURE__*/_jsx(Button, {
         ref: ref,
         icon: restProps.icon,
+        size: "compact",
         label: title,
         shortcut: restProps.shortcut,
         "data-subscript": restProps.subscript,
@@ -71,6 +72,7 @@ function UnforwardedToolbarButton(props, ref) {
     ...restProps,
     ref: ref,
     children: toolbarItemProps => /*#__PURE__*/_jsx(Button, {
+      size: "compact",
       label: title,
       isPressed: isActive,
       ...toolbarItemProps,

package/build-module/toolbar/toolbar-button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","useContext","forwardRef","Button","ToolbarItem","ToolbarContext","ToolbarButtonContainer","jsx","_jsx","useDeprecatedProps","isDisabled","otherProps","disabled","UnforwardedToolbarButton","props","ref","children","className","containerClassName","extraProps","isActive","title","restProps","accessibleToolbarState","icon","label","shortcut","subscript","onClick","event","stopPropagation","isPressed","accessibleWhenDisabled","toolbarItemProps","ToolbarButton"],"sources":["@wordpress/components/src/toolbar/toolbar-button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef, MouseEvent as ReactMouseEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarButtonContainer from './toolbar-button-container';\nimport type { ToolbarButtonOverriddenProps, ToolbarButtonProps } from './types';\nimport type { WordPressComponentProps } from '../../context';\n\nfunction useDeprecatedProps( {\n\tisDisabled,\n\t...otherProps\n}: React.ComponentProps< typeof ToolbarButton > ) {\n\treturn {\n\t\tdisabled: isDisabled,\n\t\t...otherProps,\n\t};\n}\n\nfunction UnforwardedToolbarButton(\n\tprops: Omit<\n\t\tWordPressComponentProps< ToolbarButtonProps, typeof Button, false >,\n\t\t'accessibleWhenDisabled' // By default, ToolbarButton will be focusable when disabled.\n\t> &\n\t\tToolbarButtonOverriddenProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tcontainerClassName,\n\t\textraProps,\n\t\tisActive,\n\t\ttitle,\n\t\t...restProps\n\t} = useDeprecatedProps( props );\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ! accessibleToolbarState ) {\n\t\treturn (\n\t\t\t<ToolbarButtonContainer className={ containerClassName }>\n\t\t\t\t<Button\n\t\t\t\t\tref={ ref }\n\t\t\t\t\ticon={ restProps.icon }\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tshortcut={ restProps.shortcut }\n\t\t\t\t\tdata-subscript={ restProps.subscript }\n\t\t\t\t\tonClick={ (\n\t\t\t\t\t\tevent: ReactMouseEvent<\n\t\t\t\t\t\t\tHTMLButtonElement & HTMLAnchorElement,\n\t\t\t\t\t\t\tMouseEvent\n\t\t\t\t\t\t>\n\t\t\t\t\t) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t// TODO: Possible bug; maybe use onClick instead of restProps.onClick.\n\t\t\t\t\t\tif ( restProps.onClick ) {\n\t\t\t\t\t\t\trestProps.onClick( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-toolbar__control',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tdata-toolbar-item\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t</ToolbarButtonContainer>\n\t\t);\n\t}\n\n\t// ToobarItem will pass all props to the render prop child, which will pass\n\t// all props to Button. This means that ToolbarButton has the same API as\n\t// Button.\n\treturn (\n\t\t<ToolbarItem\n\t\t\tclassName={ clsx( 'components-toolbar-button', className ) }\n\t\t\t{ ...extraProps }\n\t\t\t{ ...restProps }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ ( toolbarItemProps ) => (\n\t\t\t\t<Button\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\t{ ...toolbarItemProps }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</ToolbarItem>\n\t);\n}\n\n/**\n * ToolbarButton can be used to add actions to a toolbar, usually inside a Toolbar\n * or ToolbarGroup when used to create general interfaces.\n *\n * ```jsx\n * import { Toolbar, ToolbarButton } from '@wordpress/components';\n * import { edit } from '@wordpress/icons';\n *\n * function MyToolbar() {\n *   return (\n *\t\t<Toolbar label=\"Options\">\n *\t\t\t<ToolbarButton\n *\t\t\t\ticon={ edit }\n *\t\t\t\tlabel=\"Edit\"\n *\t\t\t\tonClick={ () => alert( 'Editing' ) }\n *\t\t\t/>\n *\t\t</Toolbar>\n *   );\n * }\n * ```\n */\nexport const ToolbarButton = forwardRef( UnforwardedToolbarButton );\nexport default ToolbarButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AAGvB;AACA;AACA;AACA,SAASC,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;;AAE3D;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,WAAW,MAAM,iBAAiB;AACzC,OAAOC,cAAc,MAAM,oBAAoB;AAC/C,OAAOC,sBAAsB,MAAM,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIhE,SAASC,kBAAkBA,CAAE;EAC5BC,UAAU;EACV,GAAGC;AAC0C,CAAC,EAAG;EACjD,OAAO;IACNC,QAAQ,EAAEF,UAAU;IACpB,GAAGC;EACJ,CAAC;AACF;AAEA,SAASE,wBAAwBA,CAChCC,KAI6B,EAC7BC,GAAwB,EACvB;EACD,MAAM;IACLC,QAAQ;IACRC,SAAS;IACTC,kBAAkB;IAClBC,UAAU;IACVC,QAAQ;IACRC,KAAK;IACL,GAAGC;EACJ,CAAC,GAAGb,kBAAkB,CAAEK,KAAM,CAAC;EAC/B,MAAMS,sBAAsB,GAAGtB,UAAU,CAAEI,cAAe,CAAC;EAE3D,IAAK,CAAEkB,sBAAsB,EAAG;IAC/B,oBACCf,IAAA,CAACF,sBAAsB;MAACW,SAAS,EAAGC,kBAAoB;MAAAF,QAAA,eACvDR,IAAA,CAACL,MAAM;QACNY,GAAG,EAAGA,GAAK;QACXS,IAAI,EAAGF,SAAS,CAACE,IAAM;QACvBC,KAAK,EAAGJ,KAAO;QACfK,QAAQ,EAAGJ,SAAS,CAACI,QAAU;QAC/B,kBAAiBJ,SAAS,CAACK,SAAW;QACtCC,OAAO,EACNC,KAGC,IACG;UACJA,KAAK,CAACC,eAAe,CAAC,CAAC;UACvB;UACA,IAAKR,SAAS,CAACM,OAAO,EAAG;YACxBN,SAAS,CAACM,OAAO,CAAEC,KAAM,CAAC;UAC3B;QACD,CAAG;QACHZ,SAAS,EAAGjB,IAAI,CACf,6BAA6B,EAC7BiB,SACD,CAAG;QACHc,SAAS,EAAGX,QAAU;QACtBY,sBAAsB;QACtB,yBAAiB;QAAA,GACZb,UAAU;QAAA,GACVG,SAAS;QAAAN,QAAA,EAEZA;MAAQ,CACH;IAAC,CACc,CAAC;EAE3B;;EAEA;EACA;EACA;EACA,oBACCR,IAAA,CAACJ,WAAW;IACXa,SAAS,EAAGjB,IAAI,CAAE,2BAA2B,EAAEiB,SAAU,CAAG;IAAA,GACvDE,UAAU;IAAA,GACVG,SAAS;IACdP,GAAG,EAAGA,GAAK;IAAAC,QAAA,EAEPiB,gBAAgB,iBACnBzB,IAAA,CAACL,MAAM;MACNsB,KAAK,EAAGJ,KAAO;MACfU,SAAS,EAAGX,QAAU;MAAA,GACjBa,gBAAgB;MAAAjB,QAAA,EAEnBA;IAAQ,CACH;EACR,CACW,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMkB,aAAa,GAAGhC,UAAU,CAAEW,wBAAyB,CAAC;AACnE,eAAeqB,aAAa","ignoreList":[]}
+{"version":3,"names":["clsx","useContext","forwardRef","Button","ToolbarItem","ToolbarContext","ToolbarButtonContainer","jsx","_jsx","useDeprecatedProps","isDisabled","otherProps","disabled","UnforwardedToolbarButton","props","ref","children","className","containerClassName","extraProps","isActive","title","restProps","accessibleToolbarState","icon","size","label","shortcut","subscript","onClick","event","stopPropagation","isPressed","accessibleWhenDisabled","toolbarItemProps","ToolbarButton"],"sources":["@wordpress/components/src/toolbar/toolbar-button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef, MouseEvent as ReactMouseEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarButtonContainer from './toolbar-button-container';\nimport type { ToolbarButtonOverriddenProps, ToolbarButtonProps } from './types';\nimport type { WordPressComponentProps } from '../../context';\n\nfunction useDeprecatedProps( {\n\tisDisabled,\n\t...otherProps\n}: React.ComponentProps< typeof ToolbarButton > ) {\n\treturn {\n\t\tdisabled: isDisabled,\n\t\t...otherProps,\n\t};\n}\n\nfunction UnforwardedToolbarButton(\n\tprops: Omit<\n\t\tWordPressComponentProps< ToolbarButtonProps, typeof Button, false >,\n\t\t'accessibleWhenDisabled' // By default, ToolbarButton will be focusable when disabled.\n\t> &\n\t\tToolbarButtonOverriddenProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tcontainerClassName,\n\t\textraProps,\n\t\tisActive,\n\t\ttitle,\n\t\t...restProps\n\t} = useDeprecatedProps( props );\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ! accessibleToolbarState ) {\n\t\treturn (\n\t\t\t<ToolbarButtonContainer className={ containerClassName }>\n\t\t\t\t<Button\n\t\t\t\t\tref={ ref }\n\t\t\t\t\ticon={ restProps.icon }\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tshortcut={ restProps.shortcut }\n\t\t\t\t\tdata-subscript={ restProps.subscript }\n\t\t\t\t\tonClick={ (\n\t\t\t\t\t\tevent: ReactMouseEvent<\n\t\t\t\t\t\t\tHTMLButtonElement & HTMLAnchorElement,\n\t\t\t\t\t\t\tMouseEvent\n\t\t\t\t\t\t>\n\t\t\t\t\t) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t// TODO: Possible bug; maybe use onClick instead of restProps.onClick.\n\t\t\t\t\t\tif ( restProps.onClick ) {\n\t\t\t\t\t\t\trestProps.onClick( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-toolbar__control',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tdata-toolbar-item\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t</ToolbarButtonContainer>\n\t\t);\n\t}\n\n\t// ToobarItem will pass all props to the render prop child, which will pass\n\t// all props to Button. This means that ToolbarButton has the same API as\n\t// Button.\n\treturn (\n\t\t<ToolbarItem\n\t\t\tclassName={ clsx( 'components-toolbar-button', className ) }\n\t\t\t{ ...extraProps }\n\t\t\t{ ...restProps }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ ( toolbarItemProps ) => (\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\t{ ...toolbarItemProps }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</ToolbarItem>\n\t);\n}\n\n/**\n * ToolbarButton can be used to add actions to a toolbar, usually inside a Toolbar\n * or ToolbarGroup when used to create general interfaces.\n *\n * ```jsx\n * import { Toolbar, ToolbarButton } from '@wordpress/components';\n * import { edit } from '@wordpress/icons';\n *\n * function MyToolbar() {\n *   return (\n *\t\t<Toolbar label=\"Options\">\n *\t\t\t<ToolbarButton\n *\t\t\t\ticon={ edit }\n *\t\t\t\tlabel=\"Edit\"\n *\t\t\t\tonClick={ () => alert( 'Editing' ) }\n *\t\t\t/>\n *\t\t</Toolbar>\n *   );\n * }\n * ```\n */\nexport const ToolbarButton = forwardRef( UnforwardedToolbarButton );\nexport default ToolbarButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AAGvB;AACA;AACA;AACA,SAASC,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;;AAE3D;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,WAAW,MAAM,iBAAiB;AACzC,OAAOC,cAAc,MAAM,oBAAoB;AAC/C,OAAOC,sBAAsB,MAAM,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIhE,SAASC,kBAAkBA,CAAE;EAC5BC,UAAU;EACV,GAAGC;AAC0C,CAAC,EAAG;EACjD,OAAO;IACNC,QAAQ,EAAEF,UAAU;IACpB,GAAGC;EACJ,CAAC;AACF;AAEA,SAASE,wBAAwBA,CAChCC,KAI6B,EAC7BC,GAAwB,EACvB;EACD,MAAM;IACLC,QAAQ;IACRC,SAAS;IACTC,kBAAkB;IAClBC,UAAU;IACVC,QAAQ;IACRC,KAAK;IACL,GAAGC;EACJ,CAAC,GAAGb,kBAAkB,CAAEK,KAAM,CAAC;EAC/B,MAAMS,sBAAsB,GAAGtB,UAAU,CAAEI,cAAe,CAAC;EAE3D,IAAK,CAAEkB,sBAAsB,EAAG;IAC/B,oBACCf,IAAA,CAACF,sBAAsB;MAACW,SAAS,EAAGC,kBAAoB;MAAAF,QAAA,eACvDR,IAAA,CAACL,MAAM;QACNY,GAAG,EAAGA,GAAK;QACXS,IAAI,EAAGF,SAAS,CAACE,IAAM;QACvBC,IAAI,EAAC,SAAS;QACdC,KAAK,EAAGL,KAAO;QACfM,QAAQ,EAAGL,SAAS,CAACK,QAAU;QAC/B,kBAAiBL,SAAS,CAACM,SAAW;QACtCC,OAAO,EACNC,KAGC,IACG;UACJA,KAAK,CAACC,eAAe,CAAC,CAAC;UACvB;UACA,IAAKT,SAAS,CAACO,OAAO,EAAG;YACxBP,SAAS,CAACO,OAAO,CAAEC,KAAM,CAAC;UAC3B;QACD,CAAG;QACHb,SAAS,EAAGjB,IAAI,CACf,6BAA6B,EAC7BiB,SACD,CAAG;QACHe,SAAS,EAAGZ,QAAU;QACtBa,sBAAsB;QACtB,yBAAiB;QAAA,GACZd,UAAU;QAAA,GACVG,SAAS;QAAAN,QAAA,EAEZA;MAAQ,CACH;IAAC,CACc,CAAC;EAE3B;;EAEA;EACA;EACA;EACA,oBACCR,IAAA,CAACJ,WAAW;IACXa,SAAS,EAAGjB,IAAI,CAAE,2BAA2B,EAAEiB,SAAU,CAAG;IAAA,GACvDE,UAAU;IAAA,GACVG,SAAS;IACdP,GAAG,EAAGA,GAAK;IAAAC,QAAA,EAEPkB,gBAAgB,iBACnB1B,IAAA,CAACL,MAAM;MACNsB,IAAI,EAAC,SAAS;MACdC,KAAK,EAAGL,KAAO;MACfW,SAAS,EAAGZ,QAAU;MAAA,GACjBc,gBAAgB;MAAAlB,QAAA,EAEnBA;IAAQ,CACH;EACR,CACW,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMmB,aAAa,GAAGjC,UAAU,CAAEW,wBAAyB,CAAC;AACnE,eAAesB,aAAa","ignoreList":[]}

package/build-module/tools-panel/tools-panel/component.js

@@ -69,6 +69,7 @@ const UnconnectedToolsPanel = (props, forwardedRef) => {
  *         onDeselect={ () => setHeight() }
  *       >
  *         <UnitControl
+ *           __next40pxDefaultSize
  *           label={ __( 'Height' ) }
  *           onChange={ setHeight }
  *           value={ height }
@@ -80,6 +81,7 @@ const UnconnectedToolsPanel = (props, forwardedRef) => {
  *         onDeselect={ () => setWidth() }
  *       >
  *         <UnitControl
+ *           __next40pxDefaultSize
  *           label={ __( 'Width' ) }
  *           onChange={ setWidth }
  *           value={ width }

package/build-module/tools-panel/tools-panel/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["ToolsPanelHeader","ToolsPanelContext","useToolsPanel","Grid","contextConnect","jsx","_jsx","jsxs","_jsxs","UnconnectedToolsPanel","props","forwardedRef","children","label","panelContext","resetAllItems","toggleItem","headingLevel","dropdownMenuProps","toolsPanelProps","columns","ref","Provider","value","resetAll","ToolsPanel"],"sources":["@wordpress/components/src/tools-panel/tools-panel/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ToolsPanelHeader from '../tools-panel-header';\nimport { ToolsPanelContext } from '../context';\nimport { useToolsPanel } from './hook';\nimport { Grid } from '../../grid';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport type { ToolsPanelProps } from '../types';\n\nconst UnconnectedToolsPanel = (\n\tprops: WordPressComponentProps< ToolsPanelProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tchildren,\n\t\tlabel,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\theadingLevel,\n\t\tdropdownMenuProps,\n\t\t...toolsPanelProps\n\t} = useToolsPanel( props );\n\n\treturn (\n\t\t<Grid { ...toolsPanelProps } columns={ 2 } ref={ forwardedRef }>\n\t\t\t<ToolsPanelContext.Provider value={ panelContext }>\n\t\t\t\t<ToolsPanelHeader\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tresetAll={ resetAllItems }\n\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t/>\n\t\t\t\t{ children }\n\t\t\t</ToolsPanelContext.Provider>\n\t\t</Grid>\n\t);\n};\n\n/**\n * The `ToolsPanel` is a container component that displays its children preceded\n * by a header. The header includes a dropdown menu which is automatically\n * generated from the panel's inner `ToolsPanelItems`.\n *\n * ```jsx\n * import { __ } from '@wordpress/i18n';\n * import {\n *   __experimentalToolsPanel as ToolsPanel,\n *   __experimentalToolsPanelItem as ToolsPanelItem,\n *   __experimentalUnitControl as UnitControl\n * } from '@wordpress/components';\n *\n * function Example() {\n *   const [ height, setHeight ] = useState();\n *   const [ width, setWidth ] = useState();\n *\n *   const resetAll = () => {\n *     setHeight();\n *     setWidth();\n *   }\n *\n *   return (\n *     <ToolsPanel label={ __( 'Dimensions' ) } resetAll={ resetAll }>\n *       <ToolsPanelItem\n *         hasValue={ () => !! height }\n *         label={ __( 'Height' ) }\n *         onDeselect={ () => setHeight() }\n *       >\n *         <UnitControl\n *           label={ __( 'Height' ) }\n *           onChange={ setHeight }\n *           value={ height }\n *         />\n *       </ToolsPanelItem>\n *       <ToolsPanelItem\n *         hasValue={ () => !! width }\n *         label={ __( 'Width' ) }\n *         onDeselect={ () => setWidth() }\n *       >\n *         <UnitControl\n *           label={ __( 'Width' ) }\n *           onChange={ setWidth }\n *           value={ width }\n *         />\n *       </ToolsPanelItem>\n *     </ToolsPanel>\n *   );\n * }\n * ```\n */\nexport const ToolsPanel = contextConnect( UnconnectedToolsPanel, 'ToolsPanel' );\n\nexport default ToolsPanel;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,gBAAgB,MAAM,uBAAuB;AACpD,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,aAAa,QAAQ,QAAQ;AACtC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAG/C,MAAMC,qBAAqB,GAAGA,CAC7BC,KAAwD,EACxDC,YAAiC,KAC7B;EACJ,MAAM;IACLC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZC,aAAa;IACbC,UAAU;IACVC,YAAY;IACZC,iBAAiB;IACjB,GAAGC;EACJ,CAAC,GAAGjB,aAAa,CAAEQ,KAAM,CAAC;EAE1B,oBACCJ,IAAA,CAACH,IAAI;IAAA,GAAMgB,eAAe;IAAGC,OAAO,EAAG,CAAG;IAACC,GAAG,EAAGV,YAAc;IAAAC,QAAA,eAC9DJ,KAAA,CAACP,iBAAiB,CAACqB,QAAQ;MAACC,KAAK,EAAGT,YAAc;MAAAF,QAAA,gBACjDN,IAAA,CAACN,gBAAgB;QAChBa,KAAK,EAAGA,KAAO;QACfW,QAAQ,EAAGT,aAAe;QAC1BC,UAAU,EAAGA,UAAY;QACzBC,YAAY,EAAGA,YAAc;QAC7BC,iBAAiB,EAAGA;MAAmB,CACvC,CAAC,EACAN,QAAQ;IAAA,CACiB;EAAC,CACxB,CAAC;AAET,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMa,UAAU,GAAGrB,cAAc,CAAEK,qBAAqB,EAAE,YAAa,CAAC;AAE/E,eAAegB,UAAU","ignoreList":[]}
+{"version":3,"names":["ToolsPanelHeader","ToolsPanelContext","useToolsPanel","Grid","contextConnect","jsx","_jsx","jsxs","_jsxs","UnconnectedToolsPanel","props","forwardedRef","children","label","panelContext","resetAllItems","toggleItem","headingLevel","dropdownMenuProps","toolsPanelProps","columns","ref","Provider","value","resetAll","ToolsPanel"],"sources":["@wordpress/components/src/tools-panel/tools-panel/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ToolsPanelHeader from '../tools-panel-header';\nimport { ToolsPanelContext } from '../context';\nimport { useToolsPanel } from './hook';\nimport { Grid } from '../../grid';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport type { ToolsPanelProps } from '../types';\n\nconst UnconnectedToolsPanel = (\n\tprops: WordPressComponentProps< ToolsPanelProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tchildren,\n\t\tlabel,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\theadingLevel,\n\t\tdropdownMenuProps,\n\t\t...toolsPanelProps\n\t} = useToolsPanel( props );\n\n\treturn (\n\t\t<Grid { ...toolsPanelProps } columns={ 2 } ref={ forwardedRef }>\n\t\t\t<ToolsPanelContext.Provider value={ panelContext }>\n\t\t\t\t<ToolsPanelHeader\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tresetAll={ resetAllItems }\n\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t/>\n\t\t\t\t{ children }\n\t\t\t</ToolsPanelContext.Provider>\n\t\t</Grid>\n\t);\n};\n\n/**\n * The `ToolsPanel` is a container component that displays its children preceded\n * by a header. The header includes a dropdown menu which is automatically\n * generated from the panel's inner `ToolsPanelItems`.\n *\n * ```jsx\n * import { __ } from '@wordpress/i18n';\n * import {\n *   __experimentalToolsPanel as ToolsPanel,\n *   __experimentalToolsPanelItem as ToolsPanelItem,\n *   __experimentalUnitControl as UnitControl\n * } from '@wordpress/components';\n *\n * function Example() {\n *   const [ height, setHeight ] = useState();\n *   const [ width, setWidth ] = useState();\n *\n *   const resetAll = () => {\n *     setHeight();\n *     setWidth();\n *   }\n *\n *   return (\n *     <ToolsPanel label={ __( 'Dimensions' ) } resetAll={ resetAll }>\n *       <ToolsPanelItem\n *         hasValue={ () => !! height }\n *         label={ __( 'Height' ) }\n *         onDeselect={ () => setHeight() }\n *       >\n *         <UnitControl\n *           __next40pxDefaultSize\n *           label={ __( 'Height' ) }\n *           onChange={ setHeight }\n *           value={ height }\n *         />\n *       </ToolsPanelItem>\n *       <ToolsPanelItem\n *         hasValue={ () => !! width }\n *         label={ __( 'Width' ) }\n *         onDeselect={ () => setWidth() }\n *       >\n *         <UnitControl\n *           __next40pxDefaultSize\n *           label={ __( 'Width' ) }\n *           onChange={ setWidth }\n *           value={ width }\n *         />\n *       </ToolsPanelItem>\n *     </ToolsPanel>\n *   );\n * }\n * ```\n */\nexport const ToolsPanel = contextConnect( UnconnectedToolsPanel, 'ToolsPanel' );\n\nexport default ToolsPanel;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,gBAAgB,MAAM,uBAAuB;AACpD,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,aAAa,QAAQ,QAAQ;AACtC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAG/C,MAAMC,qBAAqB,GAAGA,CAC7BC,KAAwD,EACxDC,YAAiC,KAC7B;EACJ,MAAM;IACLC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZC,aAAa;IACbC,UAAU;IACVC,YAAY;IACZC,iBAAiB;IACjB,GAAGC;EACJ,CAAC,GAAGjB,aAAa,CAAEQ,KAAM,CAAC;EAE1B,oBACCJ,IAAA,CAACH,IAAI;IAAA,GAAMgB,eAAe;IAAGC,OAAO,EAAG,CAAG;IAACC,GAAG,EAAGV,YAAc;IAAAC,QAAA,eAC9DJ,KAAA,CAACP,iBAAiB,CAACqB,QAAQ;MAACC,KAAK,EAAGT,YAAc;MAAAF,QAAA,gBACjDN,IAAA,CAACN,gBAAgB;QAChBa,KAAK,EAAGA,KAAO;QACfW,QAAQ,EAAGT,aAAe;QAC1BC,UAAU,EAAGA,UAAY;QACzBC,YAAY,EAAGA,YAAc;QAC7BC,iBAAiB,EAAGA;MAAmB,CACvC,CAAC,EACAN,QAAQ;IAAA,CACiB;EAAC,CACxB,CAAC;AAET,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMa,UAAU,GAAGrB,cAAc,CAAEK,qBAAqB,EAAE,YAAa,CAAC;AAE/E,eAAegB,UAAU","ignoreList":[]}

package/build-module/unit-control/index.js

@@ -21,6 +21,7 @@ import { CSS_UNITS, getParsedQuantityAndUnit, getUnitsWithCurrentUnit, getValidP
 import { useControlledState } from '../utils/hooks';
 import { escapeRegExp } from '../utils/strings';
 import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
+import { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';
 import { jsx as _jsx } from "react/jsx-runtime";
 function UnforwardedUnitControl(unitControlProps, forwardedRef) {
   const {
@@ -42,8 +43,15 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
     units: unitsProp = CSS_UNITS,
     value: valueProp,
     onFocus: onFocusProp,
+    __shouldNotWarnDeprecated36pxSize,
     ...props
   } = useDeprecated36pxDefaultSizeProp(unitControlProps);
+  maybeWarnDeprecated36pxSize({
+    componentName: 'UnitControl',
+    __next40pxDefaultSize: props.__next40pxDefaultSize,
+    size,
+    __shouldNotWarnDeprecated36pxSize
+  });
   if ('unit' in unitControlProps) {
     deprecated('UnitControl unit prop', {
       since: '5.6',
@@ -146,6 +154,7 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
   }
   return /*#__PURE__*/_jsx(ValueInput, {
     ...props,
+    __shouldNotWarnDeprecated36pxSize: true,
     autoComplete: autoComplete,
     className: classes,
     disabled: disabled,
@@ -176,7 +185,7 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
  * const Example = () => {
  *   const [ value, setValue ] = useState( '10px' );
  *
- *   return <UnitControl onChange={ setValue } value={ value } />;
+ *   return <UnitControl __next40pxDefaultSize onChange={ setValue } value={ value } />;
  * };
  * ```
  */

package/build-module/unit-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","deprecated","forwardRef","useMemo","useRef","useEffect","__","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","escapeRegExp","useDeprecated36pxDefaultSizeProp","jsx","_jsx","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","autoComplete","children","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","unit","unitProp","units","unitsProp","value","valueProp","onFocus","onFocusProp","props","since","hint","version","nonNullValueProp","undefined","reFirstCharacterOfUnits","list","firstUnitValue","rest","firstCharacters","reduce","carry","first","substring","includes","RegExp","parsedQuantity","parsedUnit","setUnit","length","initial","fallback","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","handleOnKeyDown","event","onKeyDown","metaKey","ctrlKey","test","key","refInputSuffix","current","focus","inputSuffix","ref","__next40pxDefaultSize","onBlur","step","_activeUnit$step","activeUnit","find","option","spinControls","suffix","type","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"sources":["@wordpress/components/src/unit-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { KeyboardEvent, ForwardedRef, SyntheticEvent } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport { escapeRegExp } from '../utils/strings';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer,\n\t\tautoComplete = 'off',\n\t\t// @ts-expect-error Ensure that children is omitted from restProps\n\t\tchildren,\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonFocus: onFocusProp,\n\t\t...props\n\t} = useDeprecated36pxDefaultSizeProp( unitControlProps );\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst [ units, reFirstCharacterOfUnits ] = useMemo( () => {\n\t\tconst list = getUnitsWithCurrentUnit(\n\t\t\tnonNullValueProp,\n\t\t\tunitProp,\n\t\t\tunitsProp\n\t\t);\n\t\tconst [ { value: firstUnitValue = '' } = {}, ...rest ] = list;\n\t\tconst firstCharacters = rest.reduce(\n\t\t\t( carry, { value } ) => {\n\t\t\t\tconst first = escapeRegExp( value?.substring( 0, 1 ) || '' );\n\t\t\t\treturn carry.includes( first )\n\t\t\t\t\t? carry\n\t\t\t\t\t: `${ carry }|${ first }`;\n\t\t\t},\n\t\t\tescapeRegExp( firstUnitValue.substring( 0, 1 ) )\n\t\t);\n\t\treturn [ list, new RegExp( `^(?:${ firstCharacters })$`, 'i' ) ];\n\t}, [ nonNullValueProp, unitProp, unitsProp ] );\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunits.length === 1 ? units[ 0 ].value : unitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit, setUnit ] );\n\n\tconst classes = clsx(\n\t\t'components-unit-control',\n\t\t// This class is added for legacy purposes to maintain it on the outer\n\t\t// wrapper. See: https://github.com/WordPress/gutenberg/pull/45139\n\t\t'components-unit-control-wrapper',\n\t\tclassName\n\t);\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent: SyntheticEvent;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tlet handleOnKeyDown;\n\tif ( ! disableUnits && isUnitSelectTabbable && units.length ) {\n\t\thandleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\t\tprops.onKeyDown?.( event );\n\t\t\t// Unless the meta or ctrl key was pressed (to avoid interfering with\n\t\t\t// shortcuts, e.g. pastes), move focus to the unit select if a key\n\t\t\t// matches the first character of a unit.\n\t\t\tif (\n\t\t\t\t! event.metaKey &&\n\t\t\t\t! event.ctrlKey &&\n\t\t\t\treFirstCharacterOfUnits.test( event.key )\n\t\t\t) {\n\t\t\t\trefInputSuffix.current?.focus();\n\t\t\t}\n\t\t};\n\t}\n\n\tconst refInputSuffix = useRef< HTMLSelectElement >( null );\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\tref={ refInputSuffix }\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={\n\t\t\t\t[ 'small', 'compact' ].includes( size ) ||\n\t\t\t\t( size === 'default' && ! props.__next40pxDefaultSize )\n\t\t\t\t\t? 'small'\n\t\t\t\t\t: 'default'\n\t\t\t}\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonFocus={ onFocusProp }\n\t\t\tonBlur={ unitControlProps.onBlur }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<ValueInput\n\t\t\t{ ...props }\n\t\t\tautoComplete={ autoComplete }\n\t\t\tclassName={ classes }\n\t\t\tdisabled={ disabled }\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\tlabel={ label }\n\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\tonChange={ handleOnQuantityChange }\n\t\t\tref={ forwardedRef }\n\t\t\tsize={ size }\n\t\t\tsuffix={ inputSuffix }\n\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\tstep={ step }\n\t\t\tonFocus={ onFocusProp }\n\t\t\t__unstableStateReducer={ __unstableStateReducer }\n\t\t/>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '10px' );\n *\n *   return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","deprecated","forwardRef","useMemo","useRef","useEffect","__","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","escapeRegExp","useDeprecated36pxDefaultSizeProp","maybeWarnDeprecated36pxSize","jsx","_jsx","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","autoComplete","children","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","unit","unitProp","units","unitsProp","value","valueProp","onFocus","onFocusProp","__shouldNotWarnDeprecated36pxSize","props","componentName","__next40pxDefaultSize","since","hint","version","nonNullValueProp","undefined","reFirstCharacterOfUnits","list","firstUnitValue","rest","firstCharacters","reduce","carry","first","substring","includes","RegExp","parsedQuantity","parsedUnit","setUnit","length","initial","fallback","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","handleOnKeyDown","event","onKeyDown","metaKey","ctrlKey","test","key","refInputSuffix","current","focus","inputSuffix","ref","onBlur","step","_activeUnit$step","activeUnit","find","option","spinControls","suffix","type","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"sources":["@wordpress/components/src/unit-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { KeyboardEvent, ForwardedRef, SyntheticEvent } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport { escapeRegExp } from '../utils/strings';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer,\n\t\tautoComplete = 'off',\n\t\t// @ts-expect-error Ensure that children is omitted from restProps\n\t\tchildren,\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonFocus: onFocusProp,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\t...props\n\t} = useDeprecated36pxDefaultSizeProp( unitControlProps );\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'UnitControl',\n\t\t__next40pxDefaultSize: props.__next40pxDefaultSize,\n\t\tsize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t} );\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst [ units, reFirstCharacterOfUnits ] = useMemo( () => {\n\t\tconst list = getUnitsWithCurrentUnit(\n\t\t\tnonNullValueProp,\n\t\t\tunitProp,\n\t\t\tunitsProp\n\t\t);\n\t\tconst [ { value: firstUnitValue = '' } = {}, ...rest ] = list;\n\t\tconst firstCharacters = rest.reduce(\n\t\t\t( carry, { value } ) => {\n\t\t\t\tconst first = escapeRegExp( value?.substring( 0, 1 ) || '' );\n\t\t\t\treturn carry.includes( first )\n\t\t\t\t\t? carry\n\t\t\t\t\t: `${ carry }|${ first }`;\n\t\t\t},\n\t\t\tescapeRegExp( firstUnitValue.substring( 0, 1 ) )\n\t\t);\n\t\treturn [ list, new RegExp( `^(?:${ firstCharacters })$`, 'i' ) ];\n\t}, [ nonNullValueProp, unitProp, unitsProp ] );\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunits.length === 1 ? units[ 0 ].value : unitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit, setUnit ] );\n\n\tconst classes = clsx(\n\t\t'components-unit-control',\n\t\t// This class is added for legacy purposes to maintain it on the outer\n\t\t// wrapper. See: https://github.com/WordPress/gutenberg/pull/45139\n\t\t'components-unit-control-wrapper',\n\t\tclassName\n\t);\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent: SyntheticEvent;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tlet handleOnKeyDown;\n\tif ( ! disableUnits && isUnitSelectTabbable && units.length ) {\n\t\thandleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\t\tprops.onKeyDown?.( event );\n\t\t\t// Unless the meta or ctrl key was pressed (to avoid interfering with\n\t\t\t// shortcuts, e.g. pastes), move focus to the unit select if a key\n\t\t\t// matches the first character of a unit.\n\t\t\tif (\n\t\t\t\t! event.metaKey &&\n\t\t\t\t! event.ctrlKey &&\n\t\t\t\treFirstCharacterOfUnits.test( event.key )\n\t\t\t) {\n\t\t\t\trefInputSuffix.current?.focus();\n\t\t\t}\n\t\t};\n\t}\n\n\tconst refInputSuffix = useRef< HTMLSelectElement >( null );\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\tref={ refInputSuffix }\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={\n\t\t\t\t[ 'small', 'compact' ].includes( size ) ||\n\t\t\t\t( size === 'default' && ! props.__next40pxDefaultSize )\n\t\t\t\t\t? 'small'\n\t\t\t\t\t: 'default'\n\t\t\t}\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonFocus={ onFocusProp }\n\t\t\tonBlur={ unitControlProps.onBlur }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<ValueInput\n\t\t\t{ ...props }\n\t\t\t__shouldNotWarnDeprecated36pxSize\n\t\t\tautoComplete={ autoComplete }\n\t\t\tclassName={ classes }\n\t\t\tdisabled={ disabled }\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\tlabel={ label }\n\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\tonChange={ handleOnQuantityChange }\n\t\t\tref={ forwardedRef }\n\t\t\tsize={ size }\n\t\t\tsuffix={ inputSuffix }\n\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\tstep={ step }\n\t\t\tonFocus={ onFocusProp }\n\t\t\t__unstableStateReducer={ __unstableStateReducer }\n\t\t/>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '10px' );\n *\n *   return <UnitControl __next40pxDefaultSize onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"],"mappings":"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","ignoreList":[]}

package/build-module/unit-control/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/unit-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { FocusEventHandler } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tInputChangeCallback,\n\tInputControlProps,\n} from '../input-control/types';\nimport type { NumberControlProps } from '../number-control/types';\n\nexport type SelectSize = 'default' | 'small';\n\nexport type WPUnitControlUnit = {\n\t/**\n\t * The value for the unit, used in a CSS value (e.g `px`).\n\t */\n\tvalue: string;\n\t/**\n\t * The label used in a dropdown selector for the unit.\n\t */\n\tlabel: string;\n\t/**\n\t * Default value (quantity) for the unit, used when switching units.\n\t */\n\tdefault?: number;\n\t/**\n\t * An accessible label used by screen readers.\n\t */\n\ta11yLabel?: string;\n\t/**\n\t * A step value used when incrementing/decrementing the value.\n\t */\n\tstep?: number;\n};\n\nexport type UnitControlOnChangeCallback = InputChangeCallback< {\n\tdata?: WPUnitControlUnit;\n} >;\n\nexport type UnitSelectControlProps = {\n\t/**\n\t * Whether the control can be focused via keyboard navigation.\n\t *\n\t * @default true\n\t */\n\tisUnitSelectTabbable?: boolean;\n\t/**\n\t * A callback function invoked when the value is changed.\n\t */\n\tonChange?: UnitControlOnChangeCallback;\n\t/**\n\t * The size of the unit select.\n\t */\n\tsize?: SelectSize;\n\t/**\n\t * Current unit.\n\t */\n\tunit?: string;\n\t/**\n\t * Available units to select from.\n\t *\n\t * @default CSS_UNITS\n\t */\n\tunits?: WPUnitControlUnit[];\n};\n\nexport type UnitControlProps = Pick< InputControlProps, 'size' > &\n\tOmit< UnitSelectControlProps, 'size' | 'unit' > &\n\tOmit< NumberControlProps, 'spinControls' | 'suffix' | 'type' > & {\n\t\t/**\n\t\t * If `true`, the unit `<select>` is hidden.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tdisableUnits?: boolean;\n\t\t/**\n\t\t * If `true`, and the selected unit provides a `default` value, this value is set\n\t\t * when changing units.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tisResetValueOnUnitChange?: boolean;\n\t\t/**\n\t\t * Callback when the `unit` changes.\n\t\t */\n\t\tonUnitChange?: UnitControlOnChangeCallback;\n\t\t/**\n\t\t * Current unit. _Note: this prop is deprecated. Instead, provide a unit with a value through the `value` prop._\n\t\t *\n\t\t * @deprecated\n\t\t */\n\t\tunit?: string;\n\t\t/**\n\t\t * Current value. If passed as a string, the current unit will be inferred from this value.\n\t\t * For example, a `value` of \"50%\" will set the current unit to `%`.\n\t\t */\n\t\tvalue?: string | number;\n\t\t/**\n\t\t * Callback when either the quantity or the unit inputs lose focus.\n\t\t */\n\t\tonBlur?: FocusEventHandler< HTMLInputElement | HTMLSelectElement >;\n\t\t/**\n\t\t * Callback when either the quantity or the unit inputs gains focus.\n\t\t */\n\t\tonFocus?: FocusEventHandler< HTMLInputElement | HTMLSelectElement >;\n\t};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/unit-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { FocusEventHandler } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tInputChangeCallback,\n\tInputControlProps,\n} from '../input-control/types';\nimport type { NumberControlProps } from '../number-control/types';\n\nexport type SelectSize = 'default' | 'small';\n\nexport type WPUnitControlUnit = {\n\t/**\n\t * The value for the unit, used in a CSS value (e.g `px`).\n\t */\n\tvalue: string;\n\t/**\n\t * The label used in a dropdown selector for the unit.\n\t */\n\tlabel: string;\n\t/**\n\t * Default value (quantity) for the unit, used when switching units.\n\t */\n\tdefault?: number;\n\t/**\n\t * An accessible label used by screen readers.\n\t */\n\ta11yLabel?: string;\n\t/**\n\t * A step value used when incrementing/decrementing the value.\n\t */\n\tstep?: number;\n};\n\nexport type UnitControlOnChangeCallback = InputChangeCallback< {\n\tdata?: WPUnitControlUnit;\n} >;\n\nexport type UnitSelectControlProps = {\n\t/**\n\t * Whether the control can be focused via keyboard navigation.\n\t *\n\t * @default true\n\t */\n\tisUnitSelectTabbable?: boolean;\n\t/**\n\t * A callback function invoked when the value is changed.\n\t */\n\tonChange?: UnitControlOnChangeCallback;\n\t/**\n\t * The size of the unit select.\n\t */\n\tsize?: SelectSize;\n\t/**\n\t * Current unit.\n\t */\n\tunit?: string;\n\t/**\n\t * Available units to select from.\n\t *\n\t * @default CSS_UNITS\n\t */\n\tunits?: WPUnitControlUnit[];\n};\n\nexport type UnitControlProps = Pick< InputControlProps, 'size' > &\n\tOmit< UnitSelectControlProps, 'size' | 'unit' > &\n\tOmit< NumberControlProps, 'spinControls' | 'suffix' | 'type' > & {\n\t\t/**\n\t\t * If `true`, the unit `<select>` is hidden.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tdisableUnits?: boolean;\n\t\t/**\n\t\t * If `true`, and the selected unit provides a `default` value, this value is set\n\t\t * when changing units.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tisResetValueOnUnitChange?: boolean;\n\t\t/**\n\t\t * Callback when the `unit` changes.\n\t\t */\n\t\tonUnitChange?: UnitControlOnChangeCallback;\n\t\t/**\n\t\t * Current unit. _Note: this prop is deprecated. Instead, provide a unit with a value through the `value` prop._\n\t\t *\n\t\t * @deprecated\n\t\t */\n\t\tunit?: string;\n\t\t/**\n\t\t * Current value. If passed as a string, the current unit will be inferred from this value.\n\t\t * For example, a `value` of \"50%\" will set the current unit to `%`.\n\t\t */\n\t\tvalue?: string | number;\n\t\t/**\n\t\t * Callback when either the quantity or the unit inputs lose focus.\n\t\t */\n\t\tonBlur?: FocusEventHandler< HTMLInputElement | HTMLSelectElement >;\n\t\t/**\n\t\t * Callback when either the quantity or the unit inputs gains focus.\n\t\t */\n\t\tonFocus?: FocusEventHandler< HTMLInputElement | HTMLSelectElement >;\n\t\t/**\n\t\t * Do not throw a warning for the deprecated 36px default size.\n\t\t * For internal components of other components that already throw the warning.\n\t\t *\n\t\t * @ignore\n\t\t */\n\t\t__shouldNotWarnDeprecated36pxSize?: boolean;\n\t};\n"],"mappings":"","ignoreList":[]}

package/build-style/style-rtl.css

@@ -1252,7 +1252,7 @@ body.is-dragging-components-draggable {
 }
 .components-dropdown-menu__menu .components-menu-item__button,
 .components-dropdown-menu__menu .components-menu-item__button.components-button {
-  min-height: 36px;
+  min-height: 40px;
   height: auto;
   text-align: right;
   padding-right: 8px;
@@ -1284,10 +1284,6 @@ body.is-dragging-components-draggable {
   margin: 8px 0;
 }
 
-.components-color-list-picker__swatch-button {
-  padding: 6px;
-}
-
 .components-color-list-picker__swatch-color {
   margin: 2px;
 }
@@ -1856,6 +1852,7 @@ body.is-dragging-components-draggable {
 
 .components-menu-items-choice,
 .components-menu-items-choice.components-button {
+  min-height: 40px;
   height: auto;
 }
 .components-menu-items-choice svg,
@@ -2799,6 +2796,13 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
 .components-resizable-box__container.has-show-handle .components-resizable-box__handle {
   display: block;
 }
+.components-resizable-box__handle > div {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  outline: none;
+}
 
 .components-resizable-box__container > img {
   width: inherit;