@wordpress/components 19.3.0 → 19.4.1

package/build/toggle-group-control/toggle-group-control/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"names":["noop","ToggleGroupControl","props","forwardedRef","className","isAdaptiveWidth","isBlock","label","hideLabelFromVision","help","onChange","value","children","otherProps","cx","containerRef","baseId","toString","radio","state","previousValue","setState","classes","styles","block","View","ConnectedToggleGroupControl"],"mappings":";;;;;;;;;AAWA;;;;AANA;;AAOA;;AAKA;;AAKA;;AACA;;AACA;;AAEA;;AACA;;;;;;AA3BA;AACA;AACA;AAEA;;AAUA;AACA;AACA;AAaA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,SAASC,kBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,eAAe,GAAG,KAFb;AAGLC,IAAAA,OAAO,GAAG,KAHL;AAILC,IAAAA,KAJK;AAKLC,IAAAA,mBAAmB,GAAG,KALjB;AAMLC,IAAAA,IANK;AAOLC,IAAAA,QAAQ,GAAGV,IAPN;AAQLW,IAAAA,KARK;AASLC,IAAAA,QATK;AAUL,OAAGC;AAVE,MAWF,+BAAkBX,KAAlB,EAAyB,oBAAzB,CAXJ;AAYA,QAAMY,EAAE,GAAG,mBAAX;AACA,QAAMC,YAAY,GAAG,sBAArB;AACA,QAAMC,MAAM,GAAG,4BACdf,kBADc,EAEd,sBAFc,EAGbgB,QAHa,EAAf;AAIA,QAAMC,KAAK,GAAG,2BAAe;AAC5BF,IAAAA,MAD4B;AAE5BG,IAAAA,KAAK,EAAER;AAFqB,GAAf,CAAd;AAIA,QAAMS,aAAa,GAAG,0BAAaT,KAAb,CAAtB,CAvBC,CAyBD;;AACA,8BAAiB,MAAM;AACtB;AACA;AACA,QAAKS,aAAa,KAAKF,KAAK,CAACC,KAA7B,EAAqC;AACpCT,MAAAA,QAAQ,CAAEQ,KAAK,CAACC,KAAR,CAAR;AACA;AACD,GAND,EAMG,CAAED,KAAK,CAACC,KAAR,CANH,EA1BC,CAkCD;;AACA,8BAAiB,MAAM;AACtB,QAAKR,KAAK,KAAKO,KAAK,CAACC,KAArB,EAA6B;AAC5BD,MAAAA,KAAK,CAACG,QAAN,CAAgBV,KAAhB;AACA;AACD,GAJD,EAIG,CAAEA,KAAF,CAJH;AAMA,QAAMW,OAAO,GAAG,sBACf,MACCR,EAAE,CACDS,MAAM,CAACtB,kBADN,EAEDK,OAAO,IAAIiB,MAAM,CAACC,KAFjB,EAGD,QAHC,EAIDpB,SAJC,CAFY,EAQf,CAAEA,SAAF,EAAaE,OAAb,CARe,CAAhB;AAUA,SACC,4BAAC,oBAAD;AAAa,IAAA,IAAI,EAAGG;AAApB,KACC,4BAAC,iBAAD,CAA2B,QAA3B;AACC,IAAA,KAAK,EAAG,EAAE,GAAGS,KAAL;AAAYZ,MAAAA,OAAO,EAAE,CAAED;AAAvB;AADT,KAGG,CAAEG,mBAAF,IACD,yCACC,4BAAC,oBAAD,CAAa,WAAb,QACGD,KADH,CADD,CAJF,EAUC,4BAAC,kBAAD,6BACMW,KADN;AAEC,kBAAaX,KAFd;AAGC,IAAA,EAAE,EAAGkB,UAHN;AAIC,IAAA,SAAS,EAAGH;AAJb,KAKMT,UALN;AAMC,IAAA,GAAG,EAAG,2BAAc,CAAEE,YAAF,EAAgBZ,YAAhB,CAAd;AANP,MAQGS,QARH,CAVD,CADD,CADD;AAyBA;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,MAAMc,2BAA2B,GAAG,6BACnCzB,kBADmC,EAEnC,oBAFmC,CAApC;eAKeyB,2B","sourcesContent":["/**\n * External dependencies\n */\nimport type { Ref } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport { RadioGroup, useRadioState } from 'reakit';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useMemo } from '@wordpress/element';\nimport { useMergeRefs, useInstanceId, usePrevious } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useUpdateEffect, useCx } from '../../utils/hooks';\nimport { View } from '../../view';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport ToggleGroupControlContext from '../context';\nimport * as styles from './styles';\n\nconst noop = () => {};\n\nfunction ToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'input' >,\n\tforwardedRef: Ref< any >\n) {\n\tconst {\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange = noop,\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\tconst cx = useCx();\n\tconst containerRef = useRef();\n\tconst baseId = useInstanceId(\n\t\tToggleGroupControl,\n\t\t'toggle-group-control'\n\t).toString();\n\tconst radio = useRadioState( {\n\t\tbaseId,\n\t\tstate: value,\n\t} );\n\tconst previousValue = usePrevious( value );\n\n\t// Propagate radio.state change\n\tuseUpdateEffect( () => {\n\t\t// Avoid calling onChange if radio state changed\n\t\t// from incoming value.\n\t\tif ( previousValue !== radio.state ) {\n\t\t\tonChange( radio.state );\n\t\t}\n\t}, [ radio.state ] );\n\n\t// Sync incoming value with radio.state\n\tuseUpdateEffect( () => {\n\t\tif ( value !== radio.state ) {\n\t\t\tradio.setState( value );\n\t\t}\n\t}, [ value ] );\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.ToggleGroupControl,\n\t\t\t\tisBlock && styles.block,\n\t\t\t\t'medium',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, isBlock ]\n\t);\n\treturn (\n\t\t<BaseControl help={ help }>\n\t\t\t<ToggleGroupControlContext.Provider\n\t\t\t\tvalue={ { ...radio, isBlock: ! isAdaptiveWidth } }\n\t\t\t>\n\t\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<RadioGroup\n\t\t\t\t\t{ ...radio }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tas={ View }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\tref={ useMergeRefs( [ containerRef, forwardedRef ] ) }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</RadioGroup>\n\t\t\t</ToggleGroupControlContext.Provider>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * @example\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nconst ConnectedToggleGroupControl = contextConnect(\n\tToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ConnectedToggleGroupControl;\n"]}
+{"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"names":["noop","ToggleGroupControl","props","forwardedRef","className","isAdaptiveWidth","isBlock","label","hideLabelFromVision","help","onChange","value","children","otherProps","cx","containerRef","baseId","toString","radio","state","previousValue","setState","classes","styles","block","View","ConnectedToggleGroupControl"],"mappings":";;;;;;;;;AAWA;;;;AANA;;AAOA;;AAKA;;AAKA;;AACA;;AACA;;AAEA;;AACA;;;;;;AA3BA;AACA;AACA;AAEA;;AAUA;AACA;AACA;AAaA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,SAASC,kBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,eAAe,GAAG,KAFb;AAGLC,IAAAA,OAAO,GAAG,KAHL;AAILC,IAAAA,KAJK;AAKLC,IAAAA,mBAAmB,GAAG,KALjB;AAMLC,IAAAA,IANK;AAOLC,IAAAA,QAAQ,GAAGV,IAPN;AAQLW,IAAAA,KARK;AASLC,IAAAA,QATK;AAUL,OAAGC;AAVE,MAWF,+BAAkBX,KAAlB,EAAyB,oBAAzB,CAXJ;AAYA,QAAMY,EAAE,GAAG,mBAAX;AACA,QAAMC,YAAY,GAAG,sBAArB;AACA,QAAMC,MAAM,GAAG,4BACdf,kBADc,EAEd,sBAFc,EAGbgB,QAHa,EAAf;AAIA,QAAMC,KAAK,GAAG,2BAAe;AAC5BF,IAAAA,MAD4B;AAE5BG,IAAAA,KAAK,EAAER;AAFqB,GAAf,CAAd;AAIA,QAAMS,aAAa,GAAG,0BAAaT,KAAb,CAAtB,CAvBC,CAyBD;;AACA,8BAAiB,MAAM;AACtB;AACA;AACA,QAAKS,aAAa,KAAKF,KAAK,CAACC,KAA7B,EAAqC;AACpCT,MAAAA,QAAQ,CAAEQ,KAAK,CAACC,KAAR,CAAR;AACA;AACD,GAND,EAMG,CAAED,KAAK,CAACC,KAAR,CANH,EA1BC,CAkCD;;AACA,8BAAiB,MAAM;AACtB,QAAKR,KAAK,KAAKO,KAAK,CAACC,KAArB,EAA6B;AAC5BD,MAAAA,KAAK,CAACG,QAAN,CAAgBV,KAAhB;AACA;AACD,GAJD,EAIG,CAAEA,KAAF,CAJH;AAMA,QAAMW,OAAO,GAAG,sBACf,MACCR,EAAE,CACDS,MAAM,CAACtB,kBADN,EAEDK,OAAO,IAAIiB,MAAM,CAACC,KAFjB,EAGD,QAHC,EAIDpB,SAJC,CAFY,EAQf,CAAEA,SAAF,EAAaU,EAAb,EAAiBR,OAAjB,CARe,CAAhB;AAUA,SACC,4BAAC,oBAAD;AAAa,IAAA,IAAI,EAAGG;AAApB,KACC,4BAAC,iBAAD,CAA2B,QAA3B;AACC,IAAA,KAAK,EAAG,EAAE,GAAGS,KAAL;AAAYZ,MAAAA,OAAO,EAAE,CAAED;AAAvB;AADT,KAGG,CAAEG,mBAAF,IACD,yCACC,4BAAC,oBAAD,CAAa,WAAb,QACGD,KADH,CADD,CAJF,EAUC,4BAAC,kBAAD,6BACMW,KADN;AAEC,kBAAaX,KAFd;AAGC,IAAA,EAAE,EAAGkB,UAHN;AAIC,IAAA,SAAS,EAAGH;AAJb,KAKMT,UALN;AAMC,IAAA,GAAG,EAAG,2BAAc,CAAEE,YAAF,EAAgBZ,YAAhB,CAAd;AANP,MAQGS,QARH,CAVD,CADD,CADD;AAyBA;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,MAAMc,2BAA2B,GAAG,6BACnCzB,kBADmC,EAEnC,oBAFmC,CAApC;eAKeyB,2B","sourcesContent":["/**\n * External dependencies\n */\nimport type { Ref } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport { RadioGroup, useRadioState } from 'reakit';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useMemo } from '@wordpress/element';\nimport { useMergeRefs, useInstanceId, usePrevious } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useUpdateEffect, useCx } from '../../utils/hooks';\nimport { View } from '../../view';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport ToggleGroupControlContext from '../context';\nimport * as styles from './styles';\n\nconst noop = () => {};\n\nfunction ToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'input' >,\n\tforwardedRef: Ref< any >\n) {\n\tconst {\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange = noop,\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\tconst cx = useCx();\n\tconst containerRef = useRef();\n\tconst baseId = useInstanceId(\n\t\tToggleGroupControl,\n\t\t'toggle-group-control'\n\t).toString();\n\tconst radio = useRadioState( {\n\t\tbaseId,\n\t\tstate: value,\n\t} );\n\tconst previousValue = usePrevious( value );\n\n\t// Propagate radio.state change\n\tuseUpdateEffect( () => {\n\t\t// Avoid calling onChange if radio state changed\n\t\t// from incoming value.\n\t\tif ( previousValue !== radio.state ) {\n\t\t\tonChange( radio.state );\n\t\t}\n\t}, [ radio.state ] );\n\n\t// Sync incoming value with radio.state\n\tuseUpdateEffect( () => {\n\t\tif ( value !== radio.state ) {\n\t\t\tradio.setState( value );\n\t\t}\n\t}, [ value ] );\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.ToggleGroupControl,\n\t\t\t\tisBlock && styles.block,\n\t\t\t\t'medium',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock ]\n\t);\n\treturn (\n\t\t<BaseControl help={ help }>\n\t\t\t<ToggleGroupControlContext.Provider\n\t\t\t\tvalue={ { ...radio, isBlock: ! isAdaptiveWidth } }\n\t\t\t>\n\t\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<RadioGroup\n\t\t\t\t\t{ ...radio }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tas={ View }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\tref={ useMergeRefs( [ containerRef, forwardedRef ] ) }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</RadioGroup>\n\t\t\t</ToggleGroupControlContext.Provider>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * @example\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nconst ConnectedToggleGroupControl = contextConnect(\n\tToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ConnectedToggleGroupControl;\n"]}

package/build/tools-panel/tools-panel/hook.js

@@ -55,6 +55,8 @@ const generateMenuItems = _ref => {
   return menuItems;
 };
 
+const isMenuItemTypeEmpty = obj => obj && Object.keys(obj).length === 0;
+
 function useToolsPanel(props) {
   const {
     className,
@@ -149,22 +151,20 @@ function useToolsPanel(props) {
 
   const [areAllOptionalControlsHidden, setAreAllOptionalControlsHidden] = (0, _element.useState)(false);
   (0, _element.useEffect)(() => {
-    if (menuItems.optional) {
-      const optionalItems = Object.entries(menuItems.optional);
-      const allControlsHidden = optionalItems.length > 0 && !optionalItems.some(_ref3 => {
+    if (isMenuItemTypeEmpty(menuItems === null || menuItems === void 0 ? void 0 : menuItems.default) && !isMenuItemTypeEmpty(menuItems === null || menuItems === void 0 ? void 0 : menuItems.optional)) {
+      const allControlsHidden = !Object.entries(menuItems.optional).some(_ref3 => {
         let [, isSelected] = _ref3;
         return isSelected;
       });
       setAreAllOptionalControlsHidden(allControlsHidden);
     }
-  }, [menuItems.optional, setAreAllOptionalControlsHidden]);
+  }, [menuItems, setAreAllOptionalControlsHidden]);
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => {
-    const hasDefaultMenuItems = (menuItems === null || menuItems === void 0 ? void 0 : menuItems.default) && !!Object.keys(menuItems === null || menuItems === void 0 ? void 0 : menuItems.default).length;
     const wrapperStyle = hasInnerWrapper && styles.ToolsPanelWithInnerWrapper(DEFAULT_COLUMNS);
-    const emptyStyle = !hasDefaultMenuItems && areAllOptionalControlsHidden && styles.ToolsPanelHiddenInnerWrapper;
+    const emptyStyle = isMenuItemTypeEmpty(menuItems === null || menuItems === void 0 ? void 0 : menuItems.default) && areAllOptionalControlsHidden && styles.ToolsPanelHiddenInnerWrapper;
     return cx(styles.ToolsPanel, wrapperStyle, emptyStyle, className);
-  }, [areAllOptionalControlsHidden, className, hasInnerWrapper, menuItems]); // Toggle the checked state of a menu item which is then used to determine
+  }, [areAllOptionalControlsHidden, className, cx, hasInnerWrapper, menuItems]); // Toggle the checked state of a menu item which is then used to determine
   // display of the item within the panel.
 
   const toggleItem = (0, _element.useCallback)(label => {

package/build/tools-panel/tools-panel/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel/hook.ts"],"names":["DEFAULT_COLUMNS","generateMenuItems","panelItems","shouldReset","currentMenuItems","menuItems","default","optional","forEach","hasValue","isShownByDefault","label","group","existingItemValue","value","undefined","useToolsPanel","props","className","resetAll","panelId","hasInnerWrapper","shouldRenderPlaceholderItems","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","otherProps","isResetting","wasResetting","current","setPanelItems","registerPanelItem","item","items","newItems","existingIndex","findIndex","oldItem","splice","deregisterPanelItem","index","setMenuItems","prevState","flagItemCustomization","newState","areAllOptionalControlsHidden","setAreAllOptionalControlsHidden","optionalItems","Object","entries","allControlsHidden","length","some","isSelected","cx","classes","hasDefaultMenuItems","keys","wrapperStyle","styles","ToolsPanelWithInnerWrapper","emptyStyle","ToolsPanelHiddenInnerWrapper","ToolsPanel","toggleItem","currentItem","find","menuGroup","newMenuItems","resetAllItems","filters","resetAllFilter","push","resetMenuItems","getFirstVisibleItemLabel","firstItem","firstDisplayedItem","lastDisplayedItem","reverse","panelContext","hasMenuItems"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type {\n\tToolsPanelItem,\n\tToolsPanelMenuItemKey,\n\tToolsPanelMenuItems,\n\tToolsPanelMenuItemsConfig,\n\tToolsPanelProps,\n} from '../types';\n\nconst DEFAULT_COLUMNS = 2;\n\nconst generateMenuItems = ( {\n\tpanelItems,\n\tshouldReset,\n\tcurrentMenuItems,\n}: ToolsPanelMenuItemsConfig ) => {\n\tconst menuItems: ToolsPanelMenuItems = { default: {}, optional: {} };\n\n\tpanelItems.forEach( ( { hasValue, isShownByDefault, label } ) => {\n\t\tconst group = isShownByDefault ? 'default' : 'optional';\n\n\t\t// If a menu item for this label already exists, do not overwrite its value.\n\t\t// This can cause default controls that have been flagged as customized to\n\t\t// lose their value.\n\t\tconst existingItemValue = currentMenuItems?.[ group ]?.[ label ];\n\t\tconst value =\n\t\t\texistingItemValue !== undefined ? existingItemValue : hasValue();\n\n\t\tmenuItems[ group ][ label ] = shouldReset ? false : value;\n\t} );\n\n\treturn menuItems;\n};\n\nexport function useToolsPanel(\n\tprops: WordPressComponentProps< ToolsPanelProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tresetAll,\n\t\tpanelId,\n\t\thasInnerWrapper,\n\t\tshouldRenderPlaceholderItems,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanel' );\n\n\tconst isResetting = useRef( false );\n\tconst wasResetting = isResetting.current;\n\n\t// `isResetting` is cleared via this hook to effectively batch together\n\t// the resetAll task. Without this, the flag is cleared after the first\n\t// control updates and forces a rerender with subsequent controls then\n\t// believing they need to reset, unfortunately using stale data.\n\tuseEffect( () => {\n\t\tif ( wasResetting ) {\n\t\t\tisResetting.current = false;\n\t\t}\n\t}, [ wasResetting ] );\n\n\t// Allow panel items to register themselves.\n\tconst [ panelItems, setPanelItems ] = useState< ToolsPanelItem[] >( [] );\n\n\tconst registerPanelItem = useCallback(\n\t\t( item: ToolsPanelItem ) => {\n\t\t\tsetPanelItems( ( items ) => {\n\t\t\t\tconst newItems = [ ...items ];\n\t\t\t\t// If an item with this label has already been registered, remove it\n\t\t\t\t// first. This can happen when an item is moved between the default\n\t\t\t\t// and optional groups.\n\t\t\t\tconst existingIndex = newItems.findIndex(\n\t\t\t\t\t( oldItem ) => oldItem.label === item.label\n\t\t\t\t);\n\t\t\t\tif ( existingIndex !== -1 ) {\n\t\t\t\t\tnewItems.splice( existingIndex, 1 );\n\t\t\t\t}\n\t\t\t\treturn [ ...newItems, item ];\n\t\t\t} );\n\t\t},\n\t\t[ setPanelItems ]\n\t);\n\n\t// Panels need to deregister on unmount to avoid orphans in menu state.\n\t// This is an issue when panel items are being injected via SlotFills.\n\tconst deregisterPanelItem = useCallback(\n\t\t( label: string ) => {\n\t\t\t// When switching selections between components injecting matching\n\t\t\t// controls, e.g. both panels have a \"padding\" control, the\n\t\t\t// deregistration of the first panel doesn't occur until after the\n\t\t\t// registration of the next.\n\t\t\tsetPanelItems( ( items ) => {\n\t\t\t\tconst newItems = [ ...items ];\n\t\t\t\tconst index = newItems.findIndex(\n\t\t\t\t\t( item ) => item.label === label\n\t\t\t\t);\n\t\t\t\tif ( index !== -1 ) {\n\t\t\t\t\tnewItems.splice( index, 1 );\n\t\t\t\t}\n\t\t\t\treturn newItems;\n\t\t\t} );\n\t\t},\n\t\t[ setPanelItems ]\n\t);\n\n\t// Manage and share display state of menu items representing child controls.\n\tconst [ menuItems, setMenuItems ] = useState< ToolsPanelMenuItems >( {\n\t\tdefault: {},\n\t\toptional: {},\n\t} );\n\n\t// Setup menuItems state as panel items register themselves.\n\tuseEffect( () => {\n\t\tsetMenuItems( ( prevState ) => {\n\t\t\tconst items = generateMenuItems( {\n\t\t\t\tpanelItems,\n\t\t\t\tshouldReset: false,\n\t\t\t\tcurrentMenuItems: prevState,\n\t\t\t} );\n\t\t\treturn items;\n\t\t} );\n\t}, [ generateMenuItems, panelItems, setMenuItems ] );\n\n\t// Force a menu item to be checked.\n\t// This is intended for use with default panel items. They are displayed\n\t// separately to optional items and have different display states,\n\t// we need to update that when their value is customized.\n\tconst flagItemCustomization = useCallback(\n\t\t( label: string, group: ToolsPanelMenuItemKey = 'default' ) => {\n\t\t\tsetMenuItems( ( items ) => {\n\t\t\t\tconst newState = {\n\t\t\t\t\t...items,\n\t\t\t\t\t[ group ]: {\n\t\t\t\t\t\t...items[ group ],\n\t\t\t\t\t\t[ label ]: true,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t\treturn newState;\n\t\t\t} );\n\t\t},\n\t\t[ setMenuItems ]\n\t);\n\n\t// Whether all optional menu items are hidden or not must be tracked\n\t// in order to later determine if the panel display is empty and handle\n\t// conditional display of a plus icon to indicate the presence of further\n\t// menu items.\n\tconst [\n\t\tareAllOptionalControlsHidden,\n\t\tsetAreAllOptionalControlsHidden,\n\t] = useState( false );\n\n\tuseEffect( () => {\n\t\tif ( menuItems.optional ) {\n\t\t\tconst optionalItems = Object.entries( menuItems.optional );\n\t\t\tconst allControlsHidden =\n\t\t\t\toptionalItems.length > 0 &&\n\t\t\t\t! optionalItems.some( ( [ , isSelected ] ) => isSelected );\n\t\t\tsetAreAllOptionalControlsHidden( allControlsHidden );\n\t\t}\n\t}, [ menuItems.optional, setAreAllOptionalControlsHidden ] );\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\tconst hasDefaultMenuItems =\n\t\t\tmenuItems?.default && !! Object.keys( menuItems?.default ).length;\n\t\tconst wrapperStyle =\n\t\t\thasInnerWrapper &&\n\t\t\tstyles.ToolsPanelWithInnerWrapper( DEFAULT_COLUMNS );\n\t\tconst emptyStyle =\n\t\t\t! hasDefaultMenuItems &&\n\t\t\tareAllOptionalControlsHidden &&\n\t\t\tstyles.ToolsPanelHiddenInnerWrapper;\n\n\t\treturn cx( styles.ToolsPanel, wrapperStyle, emptyStyle, className );\n\t}, [\n\t\tareAllOptionalControlsHidden,\n\t\tclassName,\n\t\thasInnerWrapper,\n\t\tmenuItems,\n\t] );\n\n\t// Toggle the checked state of a menu item which is then used to determine\n\t// display of the item within the panel.\n\tconst toggleItem = useCallback(\n\t\t( label: string ) => {\n\t\t\tconst currentItem = panelItems.find(\n\t\t\t\t( item ) => item.label === label\n\t\t\t);\n\n\t\t\tif ( ! currentItem ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst menuGroup = currentItem.isShownByDefault\n\t\t\t\t? 'default'\n\t\t\t\t: 'optional';\n\n\t\t\tconst newMenuItems = {\n\t\t\t\t...menuItems,\n\t\t\t\t[ menuGroup ]: {\n\t\t\t\t\t...menuItems[ menuGroup ],\n\t\t\t\t\t[ label ]: ! menuItems[ menuGroup ][ label ],\n\t\t\t\t},\n\t\t\t};\n\n\t\t\tsetMenuItems( newMenuItems );\n\t\t},\n\t\t[ menuItems, panelItems, setMenuItems ]\n\t);\n\n\t// Resets display of children and executes resetAll callback if available.\n\tconst resetAllItems = useCallback( () => {\n\t\tif ( typeof resetAll === 'function' ) {\n\t\t\tisResetting.current = true;\n\n\t\t\t// Collect available reset filters from panel items.\n\t\t\tconst filters: Array< () => void > = [];\n\t\t\tpanelItems.forEach( ( item ) => {\n\t\t\t\tif ( item.resetAllFilter ) {\n\t\t\t\t\tfilters.push( item.resetAllFilter );\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tresetAll( filters );\n\t\t}\n\n\t\t// Turn off display of all non-default items.\n\t\tconst resetMenuItems = generateMenuItems( {\n\t\t\tpanelItems,\n\t\t\tshouldReset: true,\n\t\t} );\n\t\tsetMenuItems( resetMenuItems );\n\t}, [\n\t\tgenerateMenuItems,\n\t\tisResetting.current,\n\t\tpanelItems,\n\t\tresetAll,\n\t\tsetMenuItems,\n\t] );\n\n\t// Assist ItemGroup styling when there are potentially hidden placeholder\n\t// items by identifying first & last items that are toggled on for display.\n\tconst getFirstVisibleItemLabel = ( items: ToolsPanelItem[] ) => {\n\t\tconst optionalItems = menuItems.optional || {};\n\t\tconst firstItem = items.find(\n\t\t\t( item ) => item.isShownByDefault || !! optionalItems[ item.label ]\n\t\t);\n\n\t\treturn firstItem?.label;\n\t};\n\n\tconst firstDisplayedItem = getFirstVisibleItemLabel( panelItems );\n\tconst lastDisplayedItem = getFirstVisibleItemLabel(\n\t\t[ ...panelItems ].reverse()\n\t);\n\n\tconst panelContext = useMemo(\n\t\t() => ( {\n\t\t\tareAllOptionalControlsHidden,\n\t\t\tderegisterPanelItem,\n\t\t\tfirstDisplayedItem,\n\t\t\tflagItemCustomization,\n\t\t\thasMenuItems: !! panelItems.length,\n\t\t\tisResetting: isResetting.current,\n\t\t\tlastDisplayedItem,\n\t\t\tmenuItems,\n\t\t\tpanelId,\n\t\t\tregisterPanelItem,\n\t\t\tshouldRenderPlaceholderItems,\n\t\t\t__experimentalFirstVisibleItemClass,\n\t\t\t__experimentalLastVisibleItemClass,\n\t\t} ),\n\t\t[\n\t\t\tareAllOptionalControlsHidden,\n\t\t\tderegisterPanelItem,\n\t\t\tfirstDisplayedItem,\n\t\t\tflagItemCustomization,\n\t\t\tisResetting.current,\n\t\t\tlastDisplayedItem,\n\t\t\tmenuItems,\n\t\t\tpanelId,\n\t\t\tpanelItems,\n\t\t\tregisterPanelItem,\n\t\t\tshouldRenderPlaceholderItems,\n\t\t\t__experimentalFirstVisibleItemClass,\n\t\t\t__experimentalLastVisibleItemClass,\n\t\t]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\tclassName: classes,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel/hook.ts"],"names":["DEFAULT_COLUMNS","generateMenuItems","panelItems","shouldReset","currentMenuItems","menuItems","default","optional","forEach","hasValue","isShownByDefault","label","group","existingItemValue","value","undefined","isMenuItemTypeEmpty","obj","Object","keys","length","useToolsPanel","props","className","resetAll","panelId","hasInnerWrapper","shouldRenderPlaceholderItems","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","otherProps","isResetting","wasResetting","current","setPanelItems","registerPanelItem","item","items","newItems","existingIndex","findIndex","oldItem","splice","deregisterPanelItem","index","setMenuItems","prevState","flagItemCustomization","newState","areAllOptionalControlsHidden","setAreAllOptionalControlsHidden","allControlsHidden","entries","some","isSelected","cx","classes","wrapperStyle","styles","ToolsPanelWithInnerWrapper","emptyStyle","ToolsPanelHiddenInnerWrapper","ToolsPanel","toggleItem","currentItem","find","menuGroup","newMenuItems","resetAllItems","filters","resetAllFilter","push","resetMenuItems","getFirstVisibleItemLabel","optionalItems","firstItem","firstDisplayedItem","lastDisplayedItem","reverse","panelContext","hasMenuItems"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type {\n\tToolsPanelItem,\n\tToolsPanelMenuItemKey,\n\tToolsPanelMenuItems,\n\tToolsPanelMenuItemsConfig,\n\tToolsPanelProps,\n} from '../types';\n\nconst DEFAULT_COLUMNS = 2;\n\nconst generateMenuItems = ( {\n\tpanelItems,\n\tshouldReset,\n\tcurrentMenuItems,\n}: ToolsPanelMenuItemsConfig ) => {\n\tconst menuItems: ToolsPanelMenuItems = { default: {}, optional: {} };\n\n\tpanelItems.forEach( ( { hasValue, isShownByDefault, label } ) => {\n\t\tconst group = isShownByDefault ? 'default' : 'optional';\n\n\t\t// If a menu item for this label already exists, do not overwrite its value.\n\t\t// This can cause default controls that have been flagged as customized to\n\t\t// lose their value.\n\t\tconst existingItemValue = currentMenuItems?.[ group ]?.[ label ];\n\t\tconst value =\n\t\t\texistingItemValue !== undefined ? existingItemValue : hasValue();\n\n\t\tmenuItems[ group ][ label ] = shouldReset ? false : value;\n\t} );\n\n\treturn menuItems;\n};\n\nconst isMenuItemTypeEmpty = (\n\tobj?: ToolsPanelMenuItems[ ToolsPanelMenuItemKey ]\n) => obj && Object.keys( obj ).length === 0;\n\nexport function useToolsPanel(\n\tprops: WordPressComponentProps< ToolsPanelProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tresetAll,\n\t\tpanelId,\n\t\thasInnerWrapper,\n\t\tshouldRenderPlaceholderItems,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanel' );\n\n\tconst isResetting = useRef( false );\n\tconst wasResetting = isResetting.current;\n\n\t// `isResetting` is cleared via this hook to effectively batch together\n\t// the resetAll task. Without this, the flag is cleared after the first\n\t// control updates and forces a rerender with subsequent controls then\n\t// believing they need to reset, unfortunately using stale data.\n\tuseEffect( () => {\n\t\tif ( wasResetting ) {\n\t\t\tisResetting.current = false;\n\t\t}\n\t}, [ wasResetting ] );\n\n\t// Allow panel items to register themselves.\n\tconst [ panelItems, setPanelItems ] = useState< ToolsPanelItem[] >( [] );\n\n\tconst registerPanelItem = useCallback(\n\t\t( item: ToolsPanelItem ) => {\n\t\t\tsetPanelItems( ( items ) => {\n\t\t\t\tconst newItems = [ ...items ];\n\t\t\t\t// If an item with this label has already been registered, remove it\n\t\t\t\t// first. This can happen when an item is moved between the default\n\t\t\t\t// and optional groups.\n\t\t\t\tconst existingIndex = newItems.findIndex(\n\t\t\t\t\t( oldItem ) => oldItem.label === item.label\n\t\t\t\t);\n\t\t\t\tif ( existingIndex !== -1 ) {\n\t\t\t\t\tnewItems.splice( existingIndex, 1 );\n\t\t\t\t}\n\t\t\t\treturn [ ...newItems, item ];\n\t\t\t} );\n\t\t},\n\t\t[ setPanelItems ]\n\t);\n\n\t// Panels need to deregister on unmount to avoid orphans in menu state.\n\t// This is an issue when panel items are being injected via SlotFills.\n\tconst deregisterPanelItem = useCallback(\n\t\t( label: string ) => {\n\t\t\t// When switching selections between components injecting matching\n\t\t\t// controls, e.g. both panels have a \"padding\" control, the\n\t\t\t// deregistration of the first panel doesn't occur until after the\n\t\t\t// registration of the next.\n\t\t\tsetPanelItems( ( items ) => {\n\t\t\t\tconst newItems = [ ...items ];\n\t\t\t\tconst index = newItems.findIndex(\n\t\t\t\t\t( item ) => item.label === label\n\t\t\t\t);\n\t\t\t\tif ( index !== -1 ) {\n\t\t\t\t\tnewItems.splice( index, 1 );\n\t\t\t\t}\n\t\t\t\treturn newItems;\n\t\t\t} );\n\t\t},\n\t\t[ setPanelItems ]\n\t);\n\n\t// Manage and share display state of menu items representing child controls.\n\tconst [ menuItems, setMenuItems ] = useState< ToolsPanelMenuItems >( {\n\t\tdefault: {},\n\t\toptional: {},\n\t} );\n\n\t// Setup menuItems state as panel items register themselves.\n\tuseEffect( () => {\n\t\tsetMenuItems( ( prevState ) => {\n\t\t\tconst items = generateMenuItems( {\n\t\t\t\tpanelItems,\n\t\t\t\tshouldReset: false,\n\t\t\t\tcurrentMenuItems: prevState,\n\t\t\t} );\n\t\t\treturn items;\n\t\t} );\n\t}, [ generateMenuItems, panelItems, setMenuItems ] );\n\n\t// Force a menu item to be checked.\n\t// This is intended for use with default panel items. They are displayed\n\t// separately to optional items and have different display states,\n\t// we need to update that when their value is customized.\n\tconst flagItemCustomization = useCallback(\n\t\t( label: string, group: ToolsPanelMenuItemKey = 'default' ) => {\n\t\t\tsetMenuItems( ( items ) => {\n\t\t\t\tconst newState = {\n\t\t\t\t\t...items,\n\t\t\t\t\t[ group ]: {\n\t\t\t\t\t\t...items[ group ],\n\t\t\t\t\t\t[ label ]: true,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t\treturn newState;\n\t\t\t} );\n\t\t},\n\t\t[ setMenuItems ]\n\t);\n\n\t// Whether all optional menu items are hidden or not must be tracked\n\t// in order to later determine if the panel display is empty and handle\n\t// conditional display of a plus icon to indicate the presence of further\n\t// menu items.\n\tconst [\n\t\tareAllOptionalControlsHidden,\n\t\tsetAreAllOptionalControlsHidden,\n\t] = useState( false );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\tisMenuItemTypeEmpty( menuItems?.default ) &&\n\t\t\t! isMenuItemTypeEmpty( menuItems?.optional )\n\t\t) {\n\t\t\tconst allControlsHidden = ! Object.entries(\n\t\t\t\tmenuItems.optional\n\t\t\t).some( ( [ , isSelected ] ) => isSelected );\n\t\t\tsetAreAllOptionalControlsHidden( allControlsHidden );\n\t\t}\n\t}, [ menuItems, setAreAllOptionalControlsHidden ] );\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\tconst wrapperStyle =\n\t\t\thasInnerWrapper &&\n\t\t\tstyles.ToolsPanelWithInnerWrapper( DEFAULT_COLUMNS );\n\t\tconst emptyStyle =\n\t\t\tisMenuItemTypeEmpty( menuItems?.default ) &&\n\t\t\tareAllOptionalControlsHidden &&\n\t\t\tstyles.ToolsPanelHiddenInnerWrapper;\n\n\t\treturn cx( styles.ToolsPanel, wrapperStyle, emptyStyle, className );\n\t}, [\n\t\tareAllOptionalControlsHidden,\n\t\tclassName,\n\t\tcx,\n\t\thasInnerWrapper,\n\t\tmenuItems,\n\t] );\n\n\t// Toggle the checked state of a menu item which is then used to determine\n\t// display of the item within the panel.\n\tconst toggleItem = useCallback(\n\t\t( label: string ) => {\n\t\t\tconst currentItem = panelItems.find(\n\t\t\t\t( item ) => item.label === label\n\t\t\t);\n\n\t\t\tif ( ! currentItem ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst menuGroup = currentItem.isShownByDefault\n\t\t\t\t? 'default'\n\t\t\t\t: 'optional';\n\n\t\t\tconst newMenuItems = {\n\t\t\t\t...menuItems,\n\t\t\t\t[ menuGroup ]: {\n\t\t\t\t\t...menuItems[ menuGroup ],\n\t\t\t\t\t[ label ]: ! menuItems[ menuGroup ][ label ],\n\t\t\t\t},\n\t\t\t};\n\n\t\t\tsetMenuItems( newMenuItems );\n\t\t},\n\t\t[ menuItems, panelItems, setMenuItems ]\n\t);\n\n\t// Resets display of children and executes resetAll callback if available.\n\tconst resetAllItems = useCallback( () => {\n\t\tif ( typeof resetAll === 'function' ) {\n\t\t\tisResetting.current = true;\n\n\t\t\t// Collect available reset filters from panel items.\n\t\t\tconst filters: Array< () => void > = [];\n\t\t\tpanelItems.forEach( ( item ) => {\n\t\t\t\tif ( item.resetAllFilter ) {\n\t\t\t\t\tfilters.push( item.resetAllFilter );\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tresetAll( filters );\n\t\t}\n\n\t\t// Turn off display of all non-default items.\n\t\tconst resetMenuItems = generateMenuItems( {\n\t\t\tpanelItems,\n\t\t\tshouldReset: true,\n\t\t} );\n\t\tsetMenuItems( resetMenuItems );\n\t}, [\n\t\tgenerateMenuItems,\n\t\tisResetting.current,\n\t\tpanelItems,\n\t\tresetAll,\n\t\tsetMenuItems,\n\t] );\n\n\t// Assist ItemGroup styling when there are potentially hidden placeholder\n\t// items by identifying first & last items that are toggled on for display.\n\tconst getFirstVisibleItemLabel = ( items: ToolsPanelItem[] ) => {\n\t\tconst optionalItems = menuItems.optional || {};\n\t\tconst firstItem = items.find(\n\t\t\t( item ) => item.isShownByDefault || !! optionalItems[ item.label ]\n\t\t);\n\n\t\treturn firstItem?.label;\n\t};\n\n\tconst firstDisplayedItem = getFirstVisibleItemLabel( panelItems );\n\tconst lastDisplayedItem = getFirstVisibleItemLabel(\n\t\t[ ...panelItems ].reverse()\n\t);\n\n\tconst panelContext = useMemo(\n\t\t() => ( {\n\t\t\tareAllOptionalControlsHidden,\n\t\t\tderegisterPanelItem,\n\t\t\tfirstDisplayedItem,\n\t\t\tflagItemCustomization,\n\t\t\thasMenuItems: !! panelItems.length,\n\t\t\tisResetting: isResetting.current,\n\t\t\tlastDisplayedItem,\n\t\t\tmenuItems,\n\t\t\tpanelId,\n\t\t\tregisterPanelItem,\n\t\t\tshouldRenderPlaceholderItems,\n\t\t\t__experimentalFirstVisibleItemClass,\n\t\t\t__experimentalLastVisibleItemClass,\n\t\t} ),\n\t\t[\n\t\t\tareAllOptionalControlsHidden,\n\t\t\tderegisterPanelItem,\n\t\t\tfirstDisplayedItem,\n\t\t\tflagItemCustomization,\n\t\t\tisResetting.current,\n\t\t\tlastDisplayedItem,\n\t\t\tmenuItems,\n\t\t\tpanelId,\n\t\t\tpanelItems,\n\t\t\tregisterPanelItem,\n\t\t\tshouldRenderPlaceholderItems,\n\t\t\t__experimentalFirstVisibleItemClass,\n\t\t\t__experimentalLastVisibleItemClass,\n\t\t]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\tclassName: classes,\n\t};\n}\n"]}

package/build/tools-panel/tools-panel-header/hook.js

@@ -34,13 +34,13 @@ function useToolsPanelHeader(props) {
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => {
     return cx(styles.ToolsPanelHeader, className);
-  }, [className]);
+  }, [className, cx]);
   const dropdownMenuClassName = (0, _element.useMemo)(() => {
     return cx(styles.DropdownMenu);
-  }, []);
+  }, [cx]);
   const headingClassName = (0, _element.useMemo)(() => {
     return cx(styles.ToolsPanelHeading);
-  }, []);
+  }, [cx]);
   const {
     menuItems,
     hasMenuItems,

package/build/tools-panel/tools-panel-header/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/hook.ts"],"names":["useToolsPanelHeader","props","className","otherProps","cx","classes","styles","ToolsPanelHeader","dropdownMenuClassName","DropdownMenu","headingClassName","ToolsPanelHeading","menuItems","hasMenuItems","areAllOptionalControlsHidden"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAXA;AACA;AACA;;AAGA;AACA;AACA;AAOO,SAASA,mBAAT,CACNC,KADM,EAEL;AACD,QAAM;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,MAA+B,gCACpCF,KADoC,EAEpC,kBAFoC,CAArC;AAKA,QAAMG,EAAE,GAAG,mBAAX;AACA,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAOD,EAAE,CAAEE,MAAM,CAACC,gBAAT,EAA2BL,SAA3B,CAAT;AACA,GAFe,EAEb,CAAEA,SAAF,CAFa,CAAhB;AAIA,QAAMM,qBAAqB,GAAG,sBAAS,MAAM;AAC5C,WAAOJ,EAAE,CAAEE,MAAM,CAACG,YAAT,CAAT;AACA,GAF6B,EAE3B,EAF2B,CAA9B;AAIA,QAAMC,gBAAgB,GAAG,sBAAS,MAAM;AACvC,WAAON,EAAE,CAAEE,MAAM,CAACK,iBAAT,CAAT;AACA,GAFwB,EAEtB,EAFsB,CAAzB;AAIA,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,YAFK;AAGLC,IAAAA;AAHK,MAIF,oCAJJ;AAMA,SAAO,EACN,GAAGX,UADG;AAENW,IAAAA,4BAFM;AAGNN,IAAAA,qBAHM;AAINK,IAAAA,YAJM;AAKNH,IAAAA,gBALM;AAMNE,IAAAA,SANM;AAONV,IAAAA,SAAS,EAAEG;AAPL,GAAP;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelHeaderProps } from '../types';\n\nexport function useToolsPanelHeader(\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >\n) {\n\tconst { className, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'ToolsPanelHeader'\n\t);\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.ToolsPanelHeader, className );\n\t}, [ className ] );\n\n\tconst dropdownMenuClassName = useMemo( () => {\n\t\treturn cx( styles.DropdownMenu );\n\t}, [] );\n\n\tconst headingClassName = useMemo( () => {\n\t\treturn cx( styles.ToolsPanelHeading );\n\t}, [] );\n\n\tconst {\n\t\tmenuItems,\n\t\thasMenuItems,\n\t\tareAllOptionalControlsHidden,\n\t} = useToolsPanelContext();\n\n\treturn {\n\t\t...otherProps,\n\t\tareAllOptionalControlsHidden,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\tmenuItems,\n\t\tclassName: classes,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/hook.ts"],"names":["useToolsPanelHeader","props","className","otherProps","cx","classes","styles","ToolsPanelHeader","dropdownMenuClassName","DropdownMenu","headingClassName","ToolsPanelHeading","menuItems","hasMenuItems","areAllOptionalControlsHidden"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAXA;AACA;AACA;;AAGA;AACA;AACA;AAOO,SAASA,mBAAT,CACNC,KADM,EAEL;AACD,QAAM;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,MAA+B,gCACpCF,KADoC,EAEpC,kBAFoC,CAArC;AAKA,QAAMG,EAAE,GAAG,mBAAX;AACA,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAOD,EAAE,CAAEE,MAAM,CAACC,gBAAT,EAA2BL,SAA3B,CAAT;AACA,GAFe,EAEb,CAAEA,SAAF,EAAaE,EAAb,CAFa,CAAhB;AAIA,QAAMI,qBAAqB,GAAG,sBAAS,MAAM;AAC5C,WAAOJ,EAAE,CAAEE,MAAM,CAACG,YAAT,CAAT;AACA,GAF6B,EAE3B,CAAEL,EAAF,CAF2B,CAA9B;AAIA,QAAMM,gBAAgB,GAAG,sBAAS,MAAM;AACvC,WAAON,EAAE,CAAEE,MAAM,CAACK,iBAAT,CAAT;AACA,GAFwB,EAEtB,CAAEP,EAAF,CAFsB,CAAzB;AAIA,QAAM;AACLQ,IAAAA,SADK;AAELC,IAAAA,YAFK;AAGLC,IAAAA;AAHK,MAIF,oCAJJ;AAMA,SAAO,EACN,GAAGX,UADG;AAENW,IAAAA,4BAFM;AAGNN,IAAAA,qBAHM;AAINK,IAAAA,YAJM;AAKNH,IAAAA,gBALM;AAMNE,IAAAA,SANM;AAONV,IAAAA,SAAS,EAAEG;AAPL,GAAP;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelHeaderProps } from '../types';\n\nexport function useToolsPanelHeader(\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >\n) {\n\tconst { className, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'ToolsPanelHeader'\n\t);\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.ToolsPanelHeader, className );\n\t}, [ className, cx ] );\n\n\tconst dropdownMenuClassName = useMemo( () => {\n\t\treturn cx( styles.DropdownMenu );\n\t}, [ cx ] );\n\n\tconst headingClassName = useMemo( () => {\n\t\treturn cx( styles.ToolsPanelHeading );\n\t}, [ cx ] );\n\n\tconst {\n\t\tmenuItems,\n\t\thasMenuItems,\n\t\tareAllOptionalControlsHidden,\n\t} = useToolsPanelContext();\n\n\treturn {\n\t\t...otherProps,\n\t\tareAllOptionalControlsHidden,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\tmenuItems,\n\t\tclassName: classes,\n\t};\n}\n"]}

package/build/tools-panel/tools-panel-item/hook.js

@@ -117,7 +117,7 @@ function useToolsPanelItem(props) {
     const firstItemStyle = firstDisplayedItem === label && __experimentalFirstVisibleItemClass;
     const lastItemStyle = lastDisplayedItem === label && __experimentalLastVisibleItemClass;
     return cx(styles.ToolsPanelItem, placeholderStyle, className, firstItemStyle, lastItemStyle);
-  }, [isShown, shouldRenderPlaceholder, className, firstDisplayedItem, lastDisplayedItem, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]);
+  }, [isShown, shouldRenderPlaceholder, className, cx, firstDisplayedItem, lastDisplayedItem, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]);
   return { ...otherProps,
     isShown,
     shouldRenderPlaceholder,

package/build/tools-panel/tools-panel-item/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-item/hook.ts"],"names":["useToolsPanelItem","props","className","hasValue","isShownByDefault","label","panelId","resetAllFilter","onDeselect","onSelect","otherProps","currentPanelId","menuItems","registerPanelItem","deregisterPanelItem","flagItemCustomization","isResetting","shouldRenderPlaceholderItems","shouldRenderPlaceholder","firstDisplayedItem","lastDisplayedItem","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","isValueSet","wasValueSet","menuGroup","isMenuItemChecked","wasMenuItemChecked","isShown","undefined","cx","classes","placeholderStyle","styles","ToolsPanelItemPlaceholder","firstItemStyle","lastItemStyle","ToolsPanelItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious } from '@wordpress/compose';\nimport { useCallback, useEffect, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelItemProps } from '../types';\n\nexport function useToolsPanelItem(\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\thasValue,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\tpanelId,\n\t\tresetAllFilter,\n\t\tonDeselect,\n\t\tonSelect,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanelItem' );\n\n\tconst {\n\t\tpanelId: currentPanelId,\n\t\tmenuItems,\n\t\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t\tflagItemCustomization,\n\t\tisResetting,\n\t\tshouldRenderPlaceholderItems: shouldRenderPlaceholder,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t} = useToolsPanelContext();\n\n\tconst hasValueCallback = useCallback( hasValue, [ panelId ] );\n\tconst resetAllFilterCallback = useCallback( resetAllFilter, [ panelId ] );\n\tconst previousPanelId = usePrevious( currentPanelId );\n\n\tconst hasMatchingPanel =\n\t\tcurrentPanelId === panelId || currentPanelId === null;\n\n\t// Registering the panel item allows the panel to include it in its\n\t// automatically generated menu and determine its initial checked status.\n\tuseEffect( () => {\n\t\tif ( hasMatchingPanel && previousPanelId !== null ) {\n\t\t\tregisterPanelItem( {\n\t\t\t\thasValue: hasValueCallback,\n\t\t\t\tisShownByDefault,\n\t\t\t\tlabel,\n\t\t\t\tresetAllFilter: resetAllFilterCallback,\n\t\t\t\tpanelId,\n\t\t\t} );\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (\n\t\t\t\t( previousPanelId === null && !! currentPanelId ) ||\n\t\t\t\tcurrentPanelId === panelId\n\t\t\t) {\n\t\t\t\tderegisterPanelItem( label );\n\t\t\t}\n\t\t};\n\t}, [\n\t\tcurrentPanelId,\n\t\thasMatchingPanel,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\thasValueCallback,\n\t\tpanelId,\n\t\tpreviousPanelId,\n\t\tresetAllFilterCallback,\n\t] );\n\n\tconst isValueSet = hasValue();\n\tconst wasValueSet = usePrevious( isValueSet );\n\n\t// If this item represents a default control it will need to notify the\n\t// panel when a custom value has been set.\n\tuseEffect( () => {\n\t\tif ( isShownByDefault && isValueSet && ! wasValueSet ) {\n\t\t\tflagItemCustomization( label );\n\t\t}\n\t}, [ isValueSet, wasValueSet, isShownByDefault, label ] );\n\n\t// Note: `label` is used as a key when building menu item state in\n\t// `ToolsPanel`.\n\tconst menuGroup = isShownByDefault ? 'default' : 'optional';\n\tconst isMenuItemChecked = menuItems?.[ menuGroup ]?.[ label ];\n\tconst wasMenuItemChecked = usePrevious( isMenuItemChecked );\n\n\t// Determine if the panel item's corresponding menu is being toggled and\n\t// trigger appropriate callback if it is.\n\tuseEffect( () => {\n\t\tif ( isResetting || ! hasMatchingPanel ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isMenuItemChecked && ! isValueSet && ! wasMenuItemChecked ) {\n\t\t\tonSelect?.();\n\t\t}\n\n\t\tif ( ! isMenuItemChecked && wasMenuItemChecked ) {\n\t\t\tonDeselect?.();\n\t\t}\n\t}, [\n\t\thasMatchingPanel,\n\t\tisMenuItemChecked,\n\t\tisResetting,\n\t\tisValueSet,\n\t\twasMenuItemChecked,\n\t] );\n\n\t// The item is shown if it is a default control regardless of whether it\n\t// has a value. Optional items are shown when they are checked or have\n\t// a value.\n\tconst isShown = isShownByDefault\n\t\t? menuItems?.[ menuGroup ]?.[ label ] !== undefined\n\t\t: isMenuItemChecked;\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\tconst placeholderStyle =\n\t\t\tshouldRenderPlaceholder &&\n\t\t\t! isShown &&\n\t\t\tstyles.ToolsPanelItemPlaceholder;\n\t\tconst firstItemStyle =\n\t\t\tfirstDisplayedItem === label && __experimentalFirstVisibleItemClass;\n\t\tconst lastItemStyle =\n\t\t\tlastDisplayedItem === label && __experimentalLastVisibleItemClass;\n\t\treturn cx(\n\t\t\tstyles.ToolsPanelItem,\n\t\t\tplaceholderStyle,\n\t\t\tclassName,\n\t\t\tfirstItemStyle,\n\t\t\tlastItemStyle\n\t\t);\n\t}, [\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t] );\n\n\treturn {\n\t\t...otherProps,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName: classes,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-item/hook.ts"],"names":["useToolsPanelItem","props","className","hasValue","isShownByDefault","label","panelId","resetAllFilter","onDeselect","onSelect","otherProps","currentPanelId","menuItems","registerPanelItem","deregisterPanelItem","flagItemCustomization","isResetting","shouldRenderPlaceholderItems","shouldRenderPlaceholder","firstDisplayedItem","lastDisplayedItem","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","isValueSet","wasValueSet","menuGroup","isMenuItemChecked","wasMenuItemChecked","isShown","undefined","cx","classes","placeholderStyle","styles","ToolsPanelItemPlaceholder","firstItemStyle","lastItemStyle","ToolsPanelItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious } from '@wordpress/compose';\nimport { useCallback, useEffect, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelItemProps } from '../types';\n\nexport function useToolsPanelItem(\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\thasValue,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\tpanelId,\n\t\tresetAllFilter,\n\t\tonDeselect,\n\t\tonSelect,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanelItem' );\n\n\tconst {\n\t\tpanelId: currentPanelId,\n\t\tmenuItems,\n\t\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t\tflagItemCustomization,\n\t\tisResetting,\n\t\tshouldRenderPlaceholderItems: shouldRenderPlaceholder,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t} = useToolsPanelContext();\n\n\tconst hasValueCallback = useCallback( hasValue, [ panelId ] );\n\tconst resetAllFilterCallback = useCallback( resetAllFilter, [ panelId ] );\n\tconst previousPanelId = usePrevious( currentPanelId );\n\n\tconst hasMatchingPanel =\n\t\tcurrentPanelId === panelId || currentPanelId === null;\n\n\t// Registering the panel item allows the panel to include it in its\n\t// automatically generated menu and determine its initial checked status.\n\tuseEffect( () => {\n\t\tif ( hasMatchingPanel && previousPanelId !== null ) {\n\t\t\tregisterPanelItem( {\n\t\t\t\thasValue: hasValueCallback,\n\t\t\t\tisShownByDefault,\n\t\t\t\tlabel,\n\t\t\t\tresetAllFilter: resetAllFilterCallback,\n\t\t\t\tpanelId,\n\t\t\t} );\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (\n\t\t\t\t( previousPanelId === null && !! currentPanelId ) ||\n\t\t\t\tcurrentPanelId === panelId\n\t\t\t) {\n\t\t\t\tderegisterPanelItem( label );\n\t\t\t}\n\t\t};\n\t}, [\n\t\tcurrentPanelId,\n\t\thasMatchingPanel,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\thasValueCallback,\n\t\tpanelId,\n\t\tpreviousPanelId,\n\t\tresetAllFilterCallback,\n\t] );\n\n\tconst isValueSet = hasValue();\n\tconst wasValueSet = usePrevious( isValueSet );\n\n\t// If this item represents a default control it will need to notify the\n\t// panel when a custom value has been set.\n\tuseEffect( () => {\n\t\tif ( isShownByDefault && isValueSet && ! wasValueSet ) {\n\t\t\tflagItemCustomization( label );\n\t\t}\n\t}, [ isValueSet, wasValueSet, isShownByDefault, label ] );\n\n\t// Note: `label` is used as a key when building menu item state in\n\t// `ToolsPanel`.\n\tconst menuGroup = isShownByDefault ? 'default' : 'optional';\n\tconst isMenuItemChecked = menuItems?.[ menuGroup ]?.[ label ];\n\tconst wasMenuItemChecked = usePrevious( isMenuItemChecked );\n\n\t// Determine if the panel item's corresponding menu is being toggled and\n\t// trigger appropriate callback if it is.\n\tuseEffect( () => {\n\t\tif ( isResetting || ! hasMatchingPanel ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isMenuItemChecked && ! isValueSet && ! wasMenuItemChecked ) {\n\t\t\tonSelect?.();\n\t\t}\n\n\t\tif ( ! isMenuItemChecked && wasMenuItemChecked ) {\n\t\t\tonDeselect?.();\n\t\t}\n\t}, [\n\t\thasMatchingPanel,\n\t\tisMenuItemChecked,\n\t\tisResetting,\n\t\tisValueSet,\n\t\twasMenuItemChecked,\n\t] );\n\n\t// The item is shown if it is a default control regardless of whether it\n\t// has a value. Optional items are shown when they are checked or have\n\t// a value.\n\tconst isShown = isShownByDefault\n\t\t? menuItems?.[ menuGroup ]?.[ label ] !== undefined\n\t\t: isMenuItemChecked;\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\tconst placeholderStyle =\n\t\t\tshouldRenderPlaceholder &&\n\t\t\t! isShown &&\n\t\t\tstyles.ToolsPanelItemPlaceholder;\n\t\tconst firstItemStyle =\n\t\t\tfirstDisplayedItem === label && __experimentalFirstVisibleItemClass;\n\t\tconst lastItemStyle =\n\t\t\tlastDisplayedItem === label && __experimentalLastVisibleItemClass;\n\t\treturn cx(\n\t\t\tstyles.ToolsPanelItem,\n\t\t\tplaceholderStyle,\n\t\t\tclassName,\n\t\t\tfirstItemStyle,\n\t\t\tlastItemStyle\n\t\t);\n\t}, [\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName,\n\t\tcx,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t] );\n\n\treturn {\n\t\t...otherProps,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName: classes,\n\t};\n}\n"]}

package/build/tree-grid/index.js

@@ -126,6 +126,9 @@ function TreeGrid(_ref, ref) {
     const activeRow = activeElement.closest('[role="row"]');
     const focusablesInRow = getRowFocusables(activeRow);
     const currentColumnIndex = focusablesInRow.indexOf(activeElement);
+    const canExpandCollapse = 0 === currentColumnIndex;
+
+    const cannotFocusNextColumn = canExpandCollapse && activeRow.getAttribute('aria-expanded') === 'false' && keyCode === _keycodes.RIGHT;
 
     if ((0, _lodash.includes)([_keycodes.LEFT, _keycodes.RIGHT], keyCode)) {
       // Calculate to the next element.
@@ -135,12 +138,12 @@ function TreeGrid(_ref, ref) {
         nextIndex = Math.max(0, currentColumnIndex - 1);
       } else {
         nextIndex = Math.min(currentColumnIndex + 1, focusablesInRow.length - 1);
-      } // Focus is either at the left or right edge of the grid.
+      } // Focus is at the left most column.
 
 
-      if (nextIndex === currentColumnIndex) {
+      if (canExpandCollapse) {
         if (keyCode === _keycodes.LEFT) {
-          var _activeRow$ariaLevel, _getRowFocusables, _getRowFocusables$;
+          var _activeRow$getAttribu, _getRowFocusables, _getRowFocusables$;
 
           // Left:
           // If a row is focused, and it is expanded, collapses the current row.
@@ -151,13 +154,13 @@ function TreeGrid(_ref, ref) {
           } // If a row is focused, and it is collapsed, moves to the parent row (if there is one).
 
 
-          const level = Math.max(parseInt((_activeRow$ariaLevel = activeRow === null || activeRow === void 0 ? void 0 : activeRow.ariaLevel) !== null && _activeRow$ariaLevel !== void 0 ? _activeRow$ariaLevel : 1, 10) - 1, 1);
+          const level = Math.max(parseInt((_activeRow$getAttribu = activeRow === null || activeRow === void 0 ? void 0 : activeRow.getAttribute('aria-level')) !== null && _activeRow$getAttribu !== void 0 ? _activeRow$getAttribu : 1, 10) - 1, 1);
           const rows = Array.from(treeGridElement.querySelectorAll('[role="row"]'));
           let parentRow = activeRow;
           const currentRowIndex = rows.indexOf(activeRow);
 
           for (let i = currentRowIndex; i >= 0; i--) {
-            if (parseInt(rows[i].ariaLevel, 10) === level) {
+            if (parseInt(rows[i].getAttribute('aria-level'), 10) === level) {
               parentRow = rows[i];
               break;
             }
@@ -190,8 +193,12 @@ function TreeGrid(_ref, ref) {
 
         event.preventDefault();
         return;
-      } // Focus the next element.
+      } // Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.
+
 
+      if (cannotFocusNextColumn) {
+        return;
+      }
 
       focusablesInRow[nextIndex].focus(); // Prevent key use for anything else. This ensures Voiceover
       // doesn't try to handle key navigation.

package/build/tree-grid/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["getRowFocusables","rowElement","focusablesInRow","focus","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","shiftKey","hasModifierKeyPressed","UP","DOWN","LEFT","RIGHT","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","nextIndex","Math","max","min","getAttribute","preventDefault","level","parseInt","ariaLevel","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { includes } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {?Array} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object}    props               Component props.\n * @param {WPElement} props.children      Children to be rendered.\n * @param {Function}  props.onExpandRow   Callback to fire when row is expanded.\n * @param {Function}  props.onCollapseRow Callback to fire when row is collapsed.\n * @param {Object}    ref                 A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{ children, onExpandRow = () => {}, onCollapseRow = () => {}, ...props },\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey, shiftKey } = event;\n\n\t\t\tconst hasModifierKeyPressed =\n\t\t\t\tmetaKey || ctrlKey || altKey || shiftKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! includes( [ UP, DOWN, LEFT, RIGHT ], keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\n\t\t\tif ( includes( [ LEFT, RIGHT ], keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the left or right edge of the grid.\n\t\t\t\tif ( nextIndex === currentColumnIndex ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt( activeRow?.ariaLevel ?? 1, 10 ) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt( rows[ i ].ariaLevel, 10 ) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the rightmost cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[\n\t\t\t\t\t\t\t\tfocusableItems.length - 1\n\t\t\t\t\t\t\t]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element.\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( includes( [ UP, DOWN ], keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t<table\n\t\t\t\t{ ...props }\n\t\t\t\trole=\"treegrid\"\n\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\tref={ ref }\n\t\t\t>\n\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t</table>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["getRowFocusables","rowElement","focusablesInRow","focus","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","shiftKey","hasModifierKeyPressed","UP","DOWN","LEFT","RIGHT","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { includes } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {?Array} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object}    props               Component props.\n * @param {WPElement} props.children      Children to be rendered.\n * @param {Function}  props.onExpandRow   Callback to fire when row is expanded.\n * @param {Function}  props.onCollapseRow Callback to fire when row is collapsed.\n * @param {Object}    ref                 A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{ children, onExpandRow = () => {}, onCollapseRow = () => {}, ...props },\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey, shiftKey } = event;\n\n\t\t\tconst hasModifierKeyPressed =\n\t\t\t\tmetaKey || ctrlKey || altKey || shiftKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! includes( [ UP, DOWN, LEFT, RIGHT ], keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( includes( [ LEFT, RIGHT ], keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? 1,\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' ),\n\t\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t\t) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the rightmost cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[\n\t\t\t\t\t\t\t\tfocusableItems.length - 1\n\t\t\t\t\t\t\t]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( includes( [ UP, DOWN ], keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t<table\n\t\t\t\t{ ...props }\n\t\t\t\trole=\"treegrid\"\n\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\tref={ ref }\n\t\t\t>\n\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t</table>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}

package/build/truncate/hook.js

@@ -58,9 +58,9 @@ function useTruncate(props) {
   const shouldTruncate = ellipsizeMode === _utils.TRUNCATE_TYPE.auto;
   const classes = (0, _element.useMemo)(() => {
     const sx = {};
-    sx.numberOfLines = /*#__PURE__*/(0, _react.css)("-webkit-box-orient:vertical;-webkit-line-clamp:", numberOfLines, ";display:-webkit-box;overflow:hidden;" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-numberOfLines;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdHJ1bmNhdGUvaG9vay5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpRHdCIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdHJ1bmNhdGUvaG9vay5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBXb3JkUHJlc3MgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZU1lbW8gfSBmcm9tICdAd29yZHByZXNzL2VsZW1lbnQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyB1c2VDb250ZXh0U3lzdGVtIH0gZnJvbSAnLi4vdWkvY29udGV4dCc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi9zdHlsZXMnO1xuaW1wb3J0IHsgVFJVTkNBVEVfRUxMSVBTSVMsIFRSVU5DQVRFX1RZUEUsIHRydW5jYXRlQ29udGVudCB9IGZyb20gJy4vdXRpbHMnO1xuaW1wb3J0IHsgdXNlQ3ggfSBmcm9tICcuLi91dGlscy9ob29rcy91c2UtY3gnO1xuXG4vKipcbiAqIEBwYXJhbSB7aW1wb3J0KCcuLi91aS9jb250ZXh0JykuV29yZFByZXNzQ29tcG9uZW50UHJvcHM8aW1wb3J0KCcuL3R5cGVzJykuUHJvcHMsICdzcGFuJz59IHByb3BzXG4gKi9cbmV4cG9ydCBkZWZhdWx0IGZ1bmN0aW9uIHVzZVRydW5jYXRlKCBwcm9wcyApIHtcblx0Y29uc3Qge1xuXHRcdGNsYXNzTmFtZSxcblx0XHRjaGlsZHJlbixcblx0XHRlbGxpcHNpcyA9IFRSVU5DQVRFX0VMTElQU0lTLFxuXHRcdGVsbGlwc2l6ZU1vZGUgPSBUUlVOQ0FURV9UWVBFLmF1dG8sXG5cdFx0bGltaXQgPSAwLFxuXHRcdG51bWJlck9mTGluZXMgPSAwLFxuXHRcdC4uLm90aGVyUHJvcHNcblx0fSA9IHVzZUNvbnRleHRTeXN0ZW0oIHByb3BzLCAnVHJ1bmNhdGUnICk7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXG5cdGNvbnN0IHRydW5jYXRlZENvbnRlbnQgPSB0cnVuY2F0ZUNvbnRlbnQoXG5cdFx0dHlwZW9mIGNoaWxkcmVuID09PSAnc3RyaW5nJyA/IC8qKiBAdHlwZSB7c3RyaW5nfSAqLyAoIGNoaWxkcmVuICkgOiAnJyxcblx0XHR7XG5cdFx0XHRlbGxpcHNpcyxcblx0XHRcdGVsbGlwc2l6ZU1vZGUsXG5cdFx0XHRsaW1pdCxcblx0XHRcdG51bWJlck9mTGluZXMsXG5cdFx0fVxuXHQpO1xuXG5cdGNvbnN0IHNob3VsZFRydW5jYXRlID0gZWxsaXBzaXplTW9kZSA9PT0gVFJVTkNBVEVfVFlQRS5hdXRvO1xuXG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKCAoKSA9PiB7XG5cdFx0Y29uc3Qgc3ggPSB7fTtcblxuXHRcdHN4Lm51bWJlck9mTGluZXMgPSBjc3NgXG5cdFx0XHQtd2Via2l0LWJveC1vcmllbnQ6IHZlcnRpY2FsO1xuXHRcdFx0LXdlYmtpdC1saW5lLWNsYW1wOiAkeyBudW1iZXJPZkxpbmVzIH07XG5cdFx0XHRkaXNwbGF5OiAtd2Via2l0LWJveDtcblx0XHRcdG92ZXJmbG93OiBoaWRkZW47XG5cdFx0YDtcblxuXHRcdHJldHVybiBjeChcblx0XHRcdHNob3VsZFRydW5jYXRlICYmICEgbnVtYmVyT2ZMaW5lcyAmJiBzdHlsZXMuVHJ1bmNhdGUsXG5cdFx0XHRzaG91bGRUcnVuY2F0ZSAmJiAhISBudW1iZXJPZkxpbmVzICYmIHN4Lm51bWJlck9mTGluZXMsXG5cdFx0XHRjbGFzc05hbWVcblx0XHQpO1xuXHR9LCBbIGNsYXNzTmFtZSwgbnVtYmVyT2ZMaW5lcywgc2hvdWxkVHJ1bmNhdGUgXSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgY2hpbGRyZW46IHRydW5jYXRlZENvbnRlbnQgfTtcbn1cbiJdfQ== */");
+    sx.numberOfLines = /*#__PURE__*/(0, _react.css)("-webkit-box-orient:vertical;-webkit-line-clamp:", numberOfLines, ";display:-webkit-box;overflow:hidden;" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-numberOfLines;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdHJ1bmNhdGUvaG9vay5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpRHdCIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdHJ1bmNhdGUvaG9vay5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBXb3JkUHJlc3MgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZU1lbW8gfSBmcm9tICdAd29yZHByZXNzL2VsZW1lbnQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyB1c2VDb250ZXh0U3lzdGVtIH0gZnJvbSAnLi4vdWkvY29udGV4dCc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi9zdHlsZXMnO1xuaW1wb3J0IHsgVFJVTkNBVEVfRUxMSVBTSVMsIFRSVU5DQVRFX1RZUEUsIHRydW5jYXRlQ29udGVudCB9IGZyb20gJy4vdXRpbHMnO1xuaW1wb3J0IHsgdXNlQ3ggfSBmcm9tICcuLi91dGlscy9ob29rcy91c2UtY3gnO1xuXG4vKipcbiAqIEBwYXJhbSB7aW1wb3J0KCcuLi91aS9jb250ZXh0JykuV29yZFByZXNzQ29tcG9uZW50UHJvcHM8aW1wb3J0KCcuL3R5cGVzJykuUHJvcHMsICdzcGFuJz59IHByb3BzXG4gKi9cbmV4cG9ydCBkZWZhdWx0IGZ1bmN0aW9uIHVzZVRydW5jYXRlKCBwcm9wcyApIHtcblx0Y29uc3Qge1xuXHRcdGNsYXNzTmFtZSxcblx0XHRjaGlsZHJlbixcblx0XHRlbGxpcHNpcyA9IFRSVU5DQVRFX0VMTElQU0lTLFxuXHRcdGVsbGlwc2l6ZU1vZGUgPSBUUlVOQ0FURV9UWVBFLmF1dG8sXG5cdFx0bGltaXQgPSAwLFxuXHRcdG51bWJlck9mTGluZXMgPSAwLFxuXHRcdC4uLm90aGVyUHJvcHNcblx0fSA9IHVzZUNvbnRleHRTeXN0ZW0oIHByb3BzLCAnVHJ1bmNhdGUnICk7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXG5cdGNvbnN0IHRydW5jYXRlZENvbnRlbnQgPSB0cnVuY2F0ZUNvbnRlbnQoXG5cdFx0dHlwZW9mIGNoaWxkcmVuID09PSAnc3RyaW5nJyA/IC8qKiBAdHlwZSB7c3RyaW5nfSAqLyAoIGNoaWxkcmVuICkgOiAnJyxcblx0XHR7XG5cdFx0XHRlbGxpcHNpcyxcblx0XHRcdGVsbGlwc2l6ZU1vZGUsXG5cdFx0XHRsaW1pdCxcblx0XHRcdG51bWJlck9mTGluZXMsXG5cdFx0fVxuXHQpO1xuXG5cdGNvbnN0IHNob3VsZFRydW5jYXRlID0gZWxsaXBzaXplTW9kZSA9PT0gVFJVTkNBVEVfVFlQRS5hdXRvO1xuXG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKCAoKSA9PiB7XG5cdFx0Y29uc3Qgc3ggPSB7fTtcblxuXHRcdHN4Lm51bWJlck9mTGluZXMgPSBjc3NgXG5cdFx0XHQtd2Via2l0LWJveC1vcmllbnQ6IHZlcnRpY2FsO1xuXHRcdFx0LXdlYmtpdC1saW5lLWNsYW1wOiAkeyBudW1iZXJPZkxpbmVzIH07XG5cdFx0XHRkaXNwbGF5OiAtd2Via2l0LWJveDtcblx0XHRcdG92ZXJmbG93OiBoaWRkZW47XG5cdFx0YDtcblxuXHRcdHJldHVybiBjeChcblx0XHRcdHNob3VsZFRydW5jYXRlICYmICEgbnVtYmVyT2ZMaW5lcyAmJiBzdHlsZXMuVHJ1bmNhdGUsXG5cdFx0XHRzaG91bGRUcnVuY2F0ZSAmJiAhISBudW1iZXJPZkxpbmVzICYmIHN4Lm51bWJlck9mTGluZXMsXG5cdFx0XHRjbGFzc05hbWVcblx0XHQpO1xuXHR9LCBbIGNsYXNzTmFtZSwgY3gsIG51bWJlck9mTGluZXMsIHNob3VsZFRydW5jYXRlIF0gKTtcblxuXHRyZXR1cm4geyAuLi5vdGhlclByb3BzLCBjbGFzc05hbWU6IGNsYXNzZXMsIGNoaWxkcmVuOiB0cnVuY2F0ZWRDb250ZW50IH07XG59XG4iXX0= */");
     return cx(shouldTruncate && !numberOfLines && styles.Truncate, shouldTruncate && !!numberOfLines && sx.numberOfLines, className);
-  }, [className, numberOfLines, shouldTruncate]);
+  }, [className, cx, numberOfLines, shouldTruncate]);
   return { ...otherProps,
     className: classes,
     children: truncatedContent

package/build/truncate/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/truncate/hook.js"],"names":["useTruncate","props","className","children","ellipsis","TRUNCATE_ELLIPSIS","ellipsizeMode","TRUNCATE_TYPE","auto","limit","numberOfLines","otherProps","cx","truncatedContent","shouldTruncate","classes","sx","css","styles","Truncate"],"mappings":";;;;;;;AAGA;;AAKA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACe,SAASA,WAAT,CAAsBC,KAAtB,EAA8B;AAC5C,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,QAAQ,GAAGC,wBAHN;AAILC,IAAAA,aAAa,GAAGC,qBAAcC,IAJzB;AAKLC,IAAAA,KAAK,GAAG,CALH;AAMLC,IAAAA,aAAa,GAAG,CANX;AAOL,OAAGC;AAPE,MAQF,+BAAkBV,KAAlB,EAAyB,UAAzB,CARJ;AAUA,QAAMW,EAAE,GAAG,mBAAX;AAEA,QAAMC,gBAAgB,GAAG,4BACxB,OAAOV,QAAP,KAAoB,QAApB;AAA+B;AAAwBA,EAAAA,QAAvD,GAAoE,EAD5C,EAExB;AACCC,IAAAA,QADD;AAECE,IAAAA,aAFD;AAGCG,IAAAA,KAHD;AAICC,IAAAA;AAJD,GAFwB,CAAzB;AAUA,QAAMI,cAAc,GAAGR,aAAa,KAAKC,qBAAcC,IAAvD;AAEA,QAAMO,OAAO,GAAG,sBAAS,MAAM;AAC9B,UAAMC,EAAE,GAAG,EAAX;AAEAA,IAAAA,EAAE,CAACN,aAAH,oBAAmBO,UAAnB,qDAEwBP,aAFxB;AAOA,WAAOE,EAAE,CACRE,cAAc,IAAI,CAAEJ,aAApB,IAAqCQ,MAAM,CAACC,QADpC,EAERL,cAAc,IAAI,CAAC,CAAEJ,aAArB,IAAsCM,EAAE,CAACN,aAFjC,EAGRR,SAHQ,CAAT;AAKA,GAfe,EAeb,CAAEA,SAAF,EAAaQ,aAAb,EAA4BI,cAA5B,CAfa,CAAhB;AAiBA,SAAO,EAAE,GAAGH,UAAL;AAAiBT,IAAAA,SAAS,EAAEa,OAA5B;AAAqCZ,IAAAA,QAAQ,EAAEU;AAA/C,GAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../ui/context';\nimport * as styles from './styles';\nimport { TRUNCATE_ELLIPSIS, TRUNCATE_TYPE, truncateContent } from './utils';\nimport { useCx } from '../utils/hooks/use-cx';\n\n/**\n * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'span'>} props\n */\nexport default function useTruncate( props ) {\n\tconst {\n\t\tclassName,\n\t\tchildren,\n\t\tellipsis = TRUNCATE_ELLIPSIS,\n\t\tellipsizeMode = TRUNCATE_TYPE.auto,\n\t\tlimit = 0,\n\t\tnumberOfLines = 0,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Truncate' );\n\n\tconst cx = useCx();\n\n\tconst truncatedContent = truncateContent(\n\t\ttypeof children === 'string' ? /** @type {string} */ ( children ) : '',\n\t\t{\n\t\t\tellipsis,\n\t\t\tellipsizeMode,\n\t\t\tlimit,\n\t\t\tnumberOfLines,\n\t\t}\n\t);\n\n\tconst shouldTruncate = ellipsizeMode === TRUNCATE_TYPE.auto;\n\n\tconst classes = useMemo( () => {\n\t\tconst sx = {};\n\n\t\tsx.numberOfLines = css`\n\t\t\t-webkit-box-orient: vertical;\n\t\t\t-webkit-line-clamp: ${ numberOfLines };\n\t\t\tdisplay: -webkit-box;\n\t\t\toverflow: hidden;\n\t\t`;\n\n\t\treturn cx(\n\t\t\tshouldTruncate && ! numberOfLines && styles.Truncate,\n\t\t\tshouldTruncate && !! numberOfLines && sx.numberOfLines,\n\t\t\tclassName\n\t\t);\n\t}, [ className, numberOfLines, shouldTruncate ] );\n\n\treturn { ...otherProps, className: classes, children: truncatedContent };\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/truncate/hook.js"],"names":["useTruncate","props","className","children","ellipsis","TRUNCATE_ELLIPSIS","ellipsizeMode","TRUNCATE_TYPE","auto","limit","numberOfLines","otherProps","cx","truncatedContent","shouldTruncate","classes","sx","css","styles","Truncate"],"mappings":";;;;;;;AAGA;;AAKA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACe,SAASA,WAAT,CAAsBC,KAAtB,EAA8B;AAC5C,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,QAAQ,GAAGC,wBAHN;AAILC,IAAAA,aAAa,GAAGC,qBAAcC,IAJzB;AAKLC,IAAAA,KAAK,GAAG,CALH;AAMLC,IAAAA,aAAa,GAAG,CANX;AAOL,OAAGC;AAPE,MAQF,+BAAkBV,KAAlB,EAAyB,UAAzB,CARJ;AAUA,QAAMW,EAAE,GAAG,mBAAX;AAEA,QAAMC,gBAAgB,GAAG,4BACxB,OAAOV,QAAP,KAAoB,QAApB;AAA+B;AAAwBA,EAAAA,QAAvD,GAAoE,EAD5C,EAExB;AACCC,IAAAA,QADD;AAECE,IAAAA,aAFD;AAGCG,IAAAA,KAHD;AAICC,IAAAA;AAJD,GAFwB,CAAzB;AAUA,QAAMI,cAAc,GAAGR,aAAa,KAAKC,qBAAcC,IAAvD;AAEA,QAAMO,OAAO,GAAG,sBAAS,MAAM;AAC9B,UAAMC,EAAE,GAAG,EAAX;AAEAA,IAAAA,EAAE,CAACN,aAAH,oBAAmBO,UAAnB,qDAEwBP,aAFxB;AAOA,WAAOE,EAAE,CACRE,cAAc,IAAI,CAAEJ,aAApB,IAAqCQ,MAAM,CAACC,QADpC,EAERL,cAAc,IAAI,CAAC,CAAEJ,aAArB,IAAsCM,EAAE,CAACN,aAFjC,EAGRR,SAHQ,CAAT;AAKA,GAfe,EAeb,CAAEA,SAAF,EAAaU,EAAb,EAAiBF,aAAjB,EAAgCI,cAAhC,CAfa,CAAhB;AAiBA,SAAO,EAAE,GAAGH,UAAL;AAAiBT,IAAAA,SAAS,EAAEa,OAA5B;AAAqCZ,IAAAA,QAAQ,EAAEU;AAA/C,GAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../ui/context';\nimport * as styles from './styles';\nimport { TRUNCATE_ELLIPSIS, TRUNCATE_TYPE, truncateContent } from './utils';\nimport { useCx } from '../utils/hooks/use-cx';\n\n/**\n * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'span'>} props\n */\nexport default function useTruncate( props ) {\n\tconst {\n\t\tclassName,\n\t\tchildren,\n\t\tellipsis = TRUNCATE_ELLIPSIS,\n\t\tellipsizeMode = TRUNCATE_TYPE.auto,\n\t\tlimit = 0,\n\t\tnumberOfLines = 0,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Truncate' );\n\n\tconst cx = useCx();\n\n\tconst truncatedContent = truncateContent(\n\t\ttypeof children === 'string' ? /** @type {string} */ ( children ) : '',\n\t\t{\n\t\t\tellipsis,\n\t\t\tellipsizeMode,\n\t\t\tlimit,\n\t\t\tnumberOfLines,\n\t\t}\n\t);\n\n\tconst shouldTruncate = ellipsizeMode === TRUNCATE_TYPE.auto;\n\n\tconst classes = useMemo( () => {\n\t\tconst sx = {};\n\n\t\tsx.numberOfLines = css`\n\t\t\t-webkit-box-orient: vertical;\n\t\t\t-webkit-line-clamp: ${ numberOfLines };\n\t\t\tdisplay: -webkit-box;\n\t\t\toverflow: hidden;\n\t\t`;\n\n\t\treturn cx(\n\t\t\tshouldTruncate && ! numberOfLines && styles.Truncate,\n\t\t\tshouldTruncate && !! numberOfLines && sx.numberOfLines,\n\t\t\tclassName\n\t\t);\n\t}, [ className, cx, numberOfLines, shouldTruncate ] );\n\n\treturn { ...otherProps, className: classes, children: truncatedContent };\n}\n"]}

package/build/utils/config-values.js

@@ -49,7 +49,7 @@ var _default = { ...CONTROL_PROPS,
   borderWidth: '1px',
   borderWidthFocus: '1.5px',
   borderWidthTab: '4px',
-  spinnerSize: '18px',
+  spinnerSize: 16,
   fontSize: '13px',
   fontSizeH1: 'calc(2.44 * 13px)',
   fontSizeH2: 'calc(1.95 * 13px)',

package/build/utils/config-values.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/utils/config-values.js"],"names":["CONTROL_HEIGHT","CONTROL_PADDING_X","CONTROL_PROPS","controlSurfaceColor","COLORS","white","controlTextActiveColor","ui","theme","controlPaddingX","controlPaddingXLarge","controlPaddingXSmall","controlBackgroundColor","controlBorderRadius","controlBorderColor","gray","controlBoxShadow","controlBorderColorHover","controlBoxShadowFocus","admin","controlDestructiveBorderColor","alert","red","controlHeight","controlHeightXSmall","controlHeightSmall","controlHeightLarge","controlHeightXLarge","TOGGLE_GROUP_CONTROL_PROPS","toggleGroupControlBackgroundColor","toggleGroupControlBorderColor","border","toggleGroupControlButtonColorActive","colorDivider","colorScrollbarThumb","colorScrollbarThumbHover","colorScrollbarTrack","elevationIntensity","radiusBlockUi","borderWidth","borderWidthFocus","borderWidthTab","spinnerSize","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeH5","fontSizeH6","fontSizeInputMobile","fontSizeMobile","fontSizeSmall","fontSizeXSmall","fontLineHeightBase","fontWeight","fontWeightHeading","gridBase","cardBorderRadius","cardPaddingXSmall","cardPaddingSmall","cardPaddingMedium","cardPaddingLarge","surfaceBackgroundColor","surfaceBackgroundSubtleColor","surfaceBackgroundTintColor","surfaceBorderColor","surfaceBorderBoldColor","surfaceBorderSubtleColor","surfaceBackgroundTertiaryColor","surfaceColor","transitionDuration","transitionDurationFast","transitionDurationFaster","transitionDurationFastest","transitionTimingFunction","transitionTimingFunctionControl"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { COLORS } from './colors-values';\n\nconst CONTROL_HEIGHT = '36px';\nconst CONTROL_PADDING_X = '12px';\n\nconst CONTROL_PROPS = {\n\tcontrolSurfaceColor: COLORS.white,\n\tcontrolTextActiveColor: COLORS.ui.theme,\n\tcontrolPaddingX: CONTROL_PADDING_X,\n\tcontrolPaddingXLarge: `calc(${ CONTROL_PADDING_X } * 1.3334)`,\n\tcontrolPaddingXSmall: `calc(${ CONTROL_PADDING_X } / 1.3334)`,\n\tcontrolBackgroundColor: COLORS.white,\n\tcontrolBorderRadius: '2px',\n\tcontrolBorderColor: COLORS.gray[ 700 ],\n\tcontrolBoxShadow: 'transparent',\n\tcontrolBorderColorHover: COLORS.gray[ 700 ],\n\tcontrolBoxShadowFocus: `0 0 0 0.5px ${ COLORS.admin.theme }`,\n\tcontrolDestructiveBorderColor: COLORS.alert.red,\n\tcontrolHeight: CONTROL_HEIGHT,\n\tcontrolHeightXSmall: `calc( ${ CONTROL_HEIGHT } * 0.6 )`,\n\tcontrolHeightSmall: `calc( ${ CONTROL_HEIGHT } * 0.8 )`,\n\tcontrolHeightLarge: `calc( ${ CONTROL_HEIGHT } * 1.2 )`,\n\tcontrolHeightXLarge: `calc( ${ CONTROL_HEIGHT } * 1.4 )`,\n};\nconst TOGGLE_GROUP_CONTROL_PROPS = {\n\ttoggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,\n\ttoggleGroupControlBorderColor: COLORS.ui.border,\n\ttoggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor,\n};\n\nexport default {\n\t...CONTROL_PROPS,\n\t...TOGGLE_GROUP_CONTROL_PROPS,\n\tcolorDivider: 'rgba(0, 0, 0, 0.1)',\n\tcolorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',\n\tcolorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',\n\tcolorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',\n\televationIntensity: 1,\n\tradiusBlockUi: '2px',\n\tborderWidth: '1px',\n\tborderWidthFocus: '1.5px',\n\tborderWidthTab: '4px',\n\tspinnerSize: '18px',\n\tfontSize: '13px',\n\tfontSizeH1: 'calc(2.44 * 13px)',\n\tfontSizeH2: 'calc(1.95 * 13px)',\n\tfontSizeH3: 'calc(1.56 * 13px)',\n\tfontSizeH4: 'calc(1.25 * 13px)',\n\tfontSizeH5: '13px',\n\tfontSizeH6: 'calc(0.8 * 13px)',\n\tfontSizeInputMobile: '16px',\n\tfontSizeMobile: '15px',\n\tfontSizeSmall: 'calc(0.92 * 13px)',\n\tfontSizeXSmall: 'calc(0.75 * 13px)',\n\tfontLineHeightBase: '1.2',\n\tfontWeight: 'normal',\n\tfontWeightHeading: '600',\n\tgridBase: '4px',\n\tcardBorderRadius: '2px',\n\tcardPaddingXSmall: `${ space( 2 ) }`,\n\tcardPaddingSmall: `${ space( 4 ) }`,\n\tcardPaddingMedium: `${ space( 4 ) } ${ space( 6 ) }`,\n\tcardPaddingLarge: `${ space( 6 ) } ${ space( 8 ) }`,\n\tsurfaceBackgroundColor: COLORS.white,\n\tsurfaceBackgroundSubtleColor: '#F3F3F3',\n\tsurfaceBackgroundTintColor: '#F5F5F5',\n\tsurfaceBorderColor: 'rgba(0, 0, 0, 0.1)',\n\tsurfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',\n\tsurfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',\n\tsurfaceBackgroundTertiaryColor: COLORS.white,\n\tsurfaceColor: COLORS.white,\n\ttransitionDuration: '200ms',\n\ttransitionDurationFast: '160ms',\n\ttransitionDurationFaster: '120ms',\n\ttransitionDurationFastest: '100ms',\n\ttransitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',\n\ttransitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)',\n};\n"]}
+{"version":3,"sources":["@wordpress/components/src/utils/config-values.js"],"names":["CONTROL_HEIGHT","CONTROL_PADDING_X","CONTROL_PROPS","controlSurfaceColor","COLORS","white","controlTextActiveColor","ui","theme","controlPaddingX","controlPaddingXLarge","controlPaddingXSmall","controlBackgroundColor","controlBorderRadius","controlBorderColor","gray","controlBoxShadow","controlBorderColorHover","controlBoxShadowFocus","admin","controlDestructiveBorderColor","alert","red","controlHeight","controlHeightXSmall","controlHeightSmall","controlHeightLarge","controlHeightXLarge","TOGGLE_GROUP_CONTROL_PROPS","toggleGroupControlBackgroundColor","toggleGroupControlBorderColor","border","toggleGroupControlButtonColorActive","colorDivider","colorScrollbarThumb","colorScrollbarThumbHover","colorScrollbarTrack","elevationIntensity","radiusBlockUi","borderWidth","borderWidthFocus","borderWidthTab","spinnerSize","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeH5","fontSizeH6","fontSizeInputMobile","fontSizeMobile","fontSizeSmall","fontSizeXSmall","fontLineHeightBase","fontWeight","fontWeightHeading","gridBase","cardBorderRadius","cardPaddingXSmall","cardPaddingSmall","cardPaddingMedium","cardPaddingLarge","surfaceBackgroundColor","surfaceBackgroundSubtleColor","surfaceBackgroundTintColor","surfaceBorderColor","surfaceBorderBoldColor","surfaceBorderSubtleColor","surfaceBackgroundTertiaryColor","surfaceColor","transitionDuration","transitionDurationFast","transitionDurationFaster","transitionDurationFastest","transitionTimingFunction","transitionTimingFunctionControl"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { COLORS } from './colors-values';\n\nconst CONTROL_HEIGHT = '36px';\nconst CONTROL_PADDING_X = '12px';\n\nconst CONTROL_PROPS = {\n\tcontrolSurfaceColor: COLORS.white,\n\tcontrolTextActiveColor: COLORS.ui.theme,\n\tcontrolPaddingX: CONTROL_PADDING_X,\n\tcontrolPaddingXLarge: `calc(${ CONTROL_PADDING_X } * 1.3334)`,\n\tcontrolPaddingXSmall: `calc(${ CONTROL_PADDING_X } / 1.3334)`,\n\tcontrolBackgroundColor: COLORS.white,\n\tcontrolBorderRadius: '2px',\n\tcontrolBorderColor: COLORS.gray[ 700 ],\n\tcontrolBoxShadow: 'transparent',\n\tcontrolBorderColorHover: COLORS.gray[ 700 ],\n\tcontrolBoxShadowFocus: `0 0 0 0.5px ${ COLORS.admin.theme }`,\n\tcontrolDestructiveBorderColor: COLORS.alert.red,\n\tcontrolHeight: CONTROL_HEIGHT,\n\tcontrolHeightXSmall: `calc( ${ CONTROL_HEIGHT } * 0.6 )`,\n\tcontrolHeightSmall: `calc( ${ CONTROL_HEIGHT } * 0.8 )`,\n\tcontrolHeightLarge: `calc( ${ CONTROL_HEIGHT } * 1.2 )`,\n\tcontrolHeightXLarge: `calc( ${ CONTROL_HEIGHT } * 1.4 )`,\n};\nconst TOGGLE_GROUP_CONTROL_PROPS = {\n\ttoggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,\n\ttoggleGroupControlBorderColor: COLORS.ui.border,\n\ttoggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor,\n};\n\nexport default {\n\t...CONTROL_PROPS,\n\t...TOGGLE_GROUP_CONTROL_PROPS,\n\tcolorDivider: 'rgba(0, 0, 0, 0.1)',\n\tcolorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',\n\tcolorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',\n\tcolorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',\n\televationIntensity: 1,\n\tradiusBlockUi: '2px',\n\tborderWidth: '1px',\n\tborderWidthFocus: '1.5px',\n\tborderWidthTab: '4px',\n\tspinnerSize: 16,\n\tfontSize: '13px',\n\tfontSizeH1: 'calc(2.44 * 13px)',\n\tfontSizeH2: 'calc(1.95 * 13px)',\n\tfontSizeH3: 'calc(1.56 * 13px)',\n\tfontSizeH4: 'calc(1.25 * 13px)',\n\tfontSizeH5: '13px',\n\tfontSizeH6: 'calc(0.8 * 13px)',\n\tfontSizeInputMobile: '16px',\n\tfontSizeMobile: '15px',\n\tfontSizeSmall: 'calc(0.92 * 13px)',\n\tfontSizeXSmall: 'calc(0.75 * 13px)',\n\tfontLineHeightBase: '1.2',\n\tfontWeight: 'normal',\n\tfontWeightHeading: '600',\n\tgridBase: '4px',\n\tcardBorderRadius: '2px',\n\tcardPaddingXSmall: `${ space( 2 ) }`,\n\tcardPaddingSmall: `${ space( 4 ) }`,\n\tcardPaddingMedium: `${ space( 4 ) } ${ space( 6 ) }`,\n\tcardPaddingLarge: `${ space( 6 ) } ${ space( 8 ) }`,\n\tsurfaceBackgroundColor: COLORS.white,\n\tsurfaceBackgroundSubtleColor: '#F3F3F3',\n\tsurfaceBackgroundTintColor: '#F5F5F5',\n\tsurfaceBorderColor: 'rgba(0, 0, 0, 0.1)',\n\tsurfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',\n\tsurfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',\n\tsurfaceBackgroundTertiaryColor: COLORS.white,\n\tsurfaceColor: COLORS.white,\n\ttransitionDuration: '200ms',\n\ttransitionDurationFast: '160ms',\n\ttransitionDurationFaster: '120ms',\n\ttransitionDurationFastest: '100ms',\n\ttransitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',\n\ttransitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)',\n};\n"]}

package/build-module/base-field/hook.js

@@ -40,7 +40,7 @@ export function useBaseField(props) {
     styles: controlGroupStyles
   } = useControlGroupContext();
   const cx = useCx();
-  const classes = useMemo(() => cx(styles.BaseField, controlGroupStyles, isSubtle && styles.subtle, hasError && styles.error, isInline && styles.inline, className), [className, controlGroupStyles, hasError, isInline, isSubtle]);
+  const classes = useMemo(() => cx(styles.BaseField, controlGroupStyles, isSubtle && styles.subtle, hasError && styles.error, isInline && styles.inline, className), [className, controlGroupStyles, cx, hasError, isInline, isSubtle]);
   return { ...useFlex({ ...flexProps,
       className: classes
     }),

package/build-module/base-field/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/base-field/hook.js"],"names":["useMemo","useContextSystem","useControlGroupContext","useFlex","styles","useCx","useBaseField","props","className","hasError","isInline","isSubtle","defaultValue","disabled","flexProps","controlGroupStyles","cx","classes","BaseField","subtle","error","inline"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;;AACA,SAASC,gBAAT,QAAiC,eAAjC;AACA,SAASC,sBAAT,QAAuC,qBAAvC;AACA,SAASC,OAAT,QAAwB,SAAxB;AACA,OAAO,KAAKC,MAAZ,MAAwB,UAAxB;AACA,SAASC,KAAT,QAAsB,uBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AACA,OAAO,SAASC,YAAT,CAAuBC,KAAvB,EAA+B;AACrC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,QAAQ,GAAG,KAFN;AAGLC,IAAAA,QAAQ,GAAG,KAHN;AAILC,IAAAA,QAAQ,GAAG,KAJN;AAKL;AACAC,IAAAA,YANK;AAOLC,IAAAA,QAPK;AAQL,OAAGC;AARE,MASFb,gBAAgB,CAAEM,KAAF,EAAS,WAAT,CATpB;AAWA,QAAM;AAAEH,IAAAA,MAAM,EAAEW;AAAV,MAAiCb,sBAAsB,EAA7D;AACA,QAAMc,EAAE,GAAGX,KAAK,EAAhB;AAEA,QAAMY,OAAO,GAAGjB,OAAO,CACtB,MACCgB,EAAE,CACDZ,MAAM,CAACc,SADN,EAEDH,kBAFC,EAGDJ,QAAQ,IAAIP,MAAM,CAACe,MAHlB,EAIDV,QAAQ,IAAIL,MAAM,CAACgB,KAJlB,EAKDV,QAAQ,IAAIN,MAAM,CAACiB,MALlB,EAMDb,SANC,CAFmB,EAUtB,CAAEA,SAAF,EAAaO,kBAAb,EAAiCN,QAAjC,EAA2CC,QAA3C,EAAqDC,QAArD,CAVsB,CAAvB;AAaA,SAAO,EACN,GAAGR,OAAO,CAAE,EAAE,GAAGW,SAAL;AAAgBN,MAAAA,SAAS,EAAES;AAA3B,KAAF,CADJ;AAENJ,IAAAA,QAFM;AAGND,IAAAA;AAHM,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../ui/context';\nimport { useControlGroupContext } from '../ui/control-group';\nimport { useFlex } from '../flex';\nimport * as styles from './styles';\nimport { useCx } from '../utils/hooks/use-cx';\n\n/**\n * @typedef OwnProps\n * @property {boolean} [hasError=false] Renders an error.\n * @property {boolean} [disabled]       Whether the field is disabled.\n * @property {boolean} [isInline=false] Renders as an inline element (layout).\n * @property {boolean} [isSubtle=false] Renders a subtle variant.\n */\n\n/** @typedef {import('../flex/types').FlexProps & OwnProps} Props */\n\n/**\n * @param {import('../ui/context').WordPressComponentProps<Props, 'div'>} props\n */\nexport function useBaseField( props ) {\n\tconst {\n\t\tclassName,\n\t\thasError = false,\n\t\tisInline = false,\n\t\tisSubtle = false,\n\t\t// extract these because useFlex doesn't accept it\n\t\tdefaultValue,\n\t\tdisabled,\n\t\t...flexProps\n\t} = useContextSystem( props, 'BaseField' );\n\n\tconst { styles: controlGroupStyles } = useControlGroupContext();\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.BaseField,\n\t\t\t\tcontrolGroupStyles,\n\t\t\t\tisSubtle && styles.subtle,\n\t\t\t\thasError && styles.error,\n\t\t\t\tisInline && styles.inline,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, controlGroupStyles, hasError, isInline, isSubtle ]\n\t);\n\n\treturn {\n\t\t...useFlex( { ...flexProps, className: classes } ),\n\t\tdisabled,\n\t\tdefaultValue,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/base-field/hook.js"],"names":["useMemo","useContextSystem","useControlGroupContext","useFlex","styles","useCx","useBaseField","props","className","hasError","isInline","isSubtle","defaultValue","disabled","flexProps","controlGroupStyles","cx","classes","BaseField","subtle","error","inline"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;;AACA,SAASC,gBAAT,QAAiC,eAAjC;AACA,SAASC,sBAAT,QAAuC,qBAAvC;AACA,SAASC,OAAT,QAAwB,SAAxB;AACA,OAAO,KAAKC,MAAZ,MAAwB,UAAxB;AACA,SAASC,KAAT,QAAsB,uBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AACA,OAAO,SAASC,YAAT,CAAuBC,KAAvB,EAA+B;AACrC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,QAAQ,GAAG,KAFN;AAGLC,IAAAA,QAAQ,GAAG,KAHN;AAILC,IAAAA,QAAQ,GAAG,KAJN;AAKL;AACAC,IAAAA,YANK;AAOLC,IAAAA,QAPK;AAQL,OAAGC;AARE,MASFb,gBAAgB,CAAEM,KAAF,EAAS,WAAT,CATpB;AAWA,QAAM;AAAEH,IAAAA,MAAM,EAAEW;AAAV,MAAiCb,sBAAsB,EAA7D;AACA,QAAMc,EAAE,GAAGX,KAAK,EAAhB;AAEA,QAAMY,OAAO,GAAGjB,OAAO,CACtB,MACCgB,EAAE,CACDZ,MAAM,CAACc,SADN,EAEDH,kBAFC,EAGDJ,QAAQ,IAAIP,MAAM,CAACe,MAHlB,EAIDV,QAAQ,IAAIL,MAAM,CAACgB,KAJlB,EAKDV,QAAQ,IAAIN,MAAM,CAACiB,MALlB,EAMDb,SANC,CAFmB,EAUtB,CAAEA,SAAF,EAAaO,kBAAb,EAAiCC,EAAjC,EAAqCP,QAArC,EAA+CC,QAA/C,EAAyDC,QAAzD,CAVsB,CAAvB;AAaA,SAAO,EACN,GAAGR,OAAO,CAAE,EAAE,GAAGW,SAAL;AAAgBN,MAAAA,SAAS,EAAES;AAA3B,KAAF,CADJ;AAENJ,IAAAA,QAFM;AAGND,IAAAA;AAHM,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../ui/context';\nimport { useControlGroupContext } from '../ui/control-group';\nimport { useFlex } from '../flex';\nimport * as styles from './styles';\nimport { useCx } from '../utils/hooks/use-cx';\n\n/**\n * @typedef OwnProps\n * @property {boolean} [hasError=false] Renders an error.\n * @property {boolean} [disabled]       Whether the field is disabled.\n * @property {boolean} [isInline=false] Renders as an inline element (layout).\n * @property {boolean} [isSubtle=false] Renders a subtle variant.\n */\n\n/** @typedef {import('../flex/types').FlexProps & OwnProps} Props */\n\n/**\n * @param {import('../ui/context').WordPressComponentProps<Props, 'div'>} props\n */\nexport function useBaseField( props ) {\n\tconst {\n\t\tclassName,\n\t\thasError = false,\n\t\tisInline = false,\n\t\tisSubtle = false,\n\t\t// extract these because useFlex doesn't accept it\n\t\tdefaultValue,\n\t\tdisabled,\n\t\t...flexProps\n\t} = useContextSystem( props, 'BaseField' );\n\n\tconst { styles: controlGroupStyles } = useControlGroupContext();\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.BaseField,\n\t\t\t\tcontrolGroupStyles,\n\t\t\t\tisSubtle && styles.subtle,\n\t\t\t\thasError && styles.error,\n\t\t\t\tisInline && styles.inline,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, controlGroupStyles, cx, hasError, isInline, isSubtle ]\n\t);\n\n\treturn {\n\t\t...useFlex( { ...flexProps, className: classes } ),\n\t\tdisabled,\n\t\tdefaultValue,\n\t};\n}\n"]}

package/build-module/button/deprecated.js

@@ -23,7 +23,8 @@ function IconButton(_ref, ref) {
   } = _ref;
   deprecated('wp.components.IconButton', {
     since: '5.4',
-    alternative: 'wp.components.Button'
+    alternative: 'wp.components.Button',
+    version: '6.2'
   });
   return createElement(Button, _extends({}, props, {
     ref: ref,

package/build-module/button/deprecated.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/button/deprecated.js"],"names":["deprecated","forwardRef","Button","IconButton","ref","labelPosition","size","tooltip","label","props","since","alternative","undefined"],"mappings":";;AAAA;;AACA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,uBAAvB;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,WAAnB;;AAEA,SAASC,UAAT,OAAwEC,GAAxE,EAA8E;AAAA,MAAzD;AAAEC,IAAAA,aAAF;AAAiBC,IAAAA,IAAjB;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA,KAAhC;AAAuC,OAAGC;AAA1C,GAAyD;AAC7ET,EAAAA,UAAU,CAAE,0BAAF,EAA8B;AACvCU,IAAAA,KAAK,EAAE,KADgC;AAEvCC,IAAAA,WAAW,EAAE;AAF0B,GAA9B,CAAV;AAKA,SACC,cAAC,MAAD,eACMF,KADN;AAEC,IAAA,GAAG,EAAGL,GAFP;AAGC,IAAA,eAAe,EAAGC,aAHnB;AAIC,IAAA,QAAQ,EAAGC,IAJZ;AAKC,IAAA,WAAW,EAAGC,OAAO,KAAKK,SAAZ,GAAwB,CAAC,CAAEL,OAA3B,GAAqCK,SALpD;AAMC,IAAA,KAAK,EAAGL,OAAO,IAAIC;AANpB,KADD;AAUA;;AAED,eAAeP,UAAU,CAAEE,UAAF,CAAzB","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction IconButton( { labelPosition, size, tooltip, label, ...props }, ref ) {\n\tdeprecated( 'wp.components.IconButton', {\n\t\tsince: '5.4',\n\t\talternative: 'wp.components.Button',\n\t} );\n\n\treturn (\n\t\t<Button\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\ttooltipPosition={ labelPosition }\n\t\t\ticonSize={ size }\n\t\t\tshowTooltip={ tooltip !== undefined ? !! tooltip : undefined }\n\t\t\tlabel={ tooltip || label }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( IconButton );\n"]}
+{"version":3,"sources":["@wordpress/components/src/button/deprecated.js"],"names":["deprecated","forwardRef","Button","IconButton","ref","labelPosition","size","tooltip","label","props","since","alternative","version","undefined"],"mappings":";;AAAA;;AACA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,uBAAvB;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,WAAnB;;AAEA,SAASC,UAAT,OAAwEC,GAAxE,EAA8E;AAAA,MAAzD;AAAEC,IAAAA,aAAF;AAAiBC,IAAAA,IAAjB;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA,KAAhC;AAAuC,OAAGC;AAA1C,GAAyD;AAC7ET,EAAAA,UAAU,CAAE,0BAAF,EAA8B;AACvCU,IAAAA,KAAK,EAAE,KADgC;AAEvCC,IAAAA,WAAW,EAAE,sBAF0B;AAGvCC,IAAAA,OAAO,EAAE;AAH8B,GAA9B,CAAV;AAMA,SACC,cAAC,MAAD,eACMH,KADN;AAEC,IAAA,GAAG,EAAGL,GAFP;AAGC,IAAA,eAAe,EAAGC,aAHnB;AAIC,IAAA,QAAQ,EAAGC,IAJZ;AAKC,IAAA,WAAW,EAAGC,OAAO,KAAKM,SAAZ,GAAwB,CAAC,CAAEN,OAA3B,GAAqCM,SALpD;AAMC,IAAA,KAAK,EAAGN,OAAO,IAAIC;AANpB,KADD;AAUA;;AAED,eAAeP,UAAU,CAAEE,UAAF,CAAzB","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction IconButton( { labelPosition, size, tooltip, label, ...props }, ref ) {\n\tdeprecated( 'wp.components.IconButton', {\n\t\tsince: '5.4',\n\t\talternative: 'wp.components.Button',\n\t\tversion: '6.2',\n\t} );\n\n\treturn (\n\t\t<Button\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\ttooltipPosition={ labelPosition }\n\t\t\ticonSize={ size }\n\t\t\tshowTooltip={ tooltip !== undefined ? !! tooltip : undefined }\n\t\t\tlabel={ tooltip || label }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( IconButton );\n"]}

package/build-module/button/index.js

@@ -58,7 +58,8 @@ function useDeprecatedProps(_ref) {
 
     deprecated('Button isDefault prop', {
       since: '5.4',
-      alternative: 'variant="secondary"'
+      alternative: 'variant="secondary"',
+      version: '6.2'
     });
     (_computedVariant4 = computedVariant) !== null && _computedVariant4 !== void 0 ? _computedVariant4 : computedVariant = 'secondary';
   }