@wordpress/components 19.2.3 → 19.4.1-next.f435e9e01b.0

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","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","getResetAllFilters","filters","resetAllFilter","push","resetAllItems","resetMenuItems","panelContext","hasMenuItems"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } 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...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 = ( item: ToolsPanelItem ) => {\n\t\tsetPanelItems( ( items ) => {\n\t\t\tconst newItems = [ ...items ];\n\t\t\t// If an item with this label is already registered, remove it first.\n\t\t\t// This can happen when an item is moved between the default and optional\n\t\t\t// groups.\n\t\t\tconst existingIndex = newItems.findIndex(\n\t\t\t\t( oldItem ) => oldItem.label === item.label\n\t\t\t);\n\t\t\tif ( existingIndex !== -1 ) {\n\t\t\t\tnewItems.splice( existingIndex, 1 );\n\t\t\t}\n\t\t\treturn [ ...newItems, item ];\n\t\t} );\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 = ( label: string ) => {\n\t\t// When switching selections between components injecting matching\n\t\t// controls, e.g. both panels have a \"padding\" control, the\n\t\t// deregistration of the first panel doesn't occur until after the\n\t\t// registration of the next.\n\t\tsetPanelItems( ( items ) => {\n\t\t\tconst newItems = [ ...items ];\n\t\t\tconst index = newItems.findIndex(\n\t\t\t\t( item ) => item.label === label\n\t\t\t);\n\t\t\tif ( index !== -1 ) {\n\t\t\t\tnewItems.splice( index, 1 );\n\t\t\t}\n\t\t\treturn newItems;\n\t\t} );\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}, [ panelItems ] );\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 = (\n\t\tlabel: string,\n\t\tgroup: ToolsPanelMenuItemKey = 'default'\n\t) => {\n\t\tsetMenuItems( ( items ) => {\n\t\t\tconst newState = {\n\t\t\t\t...items,\n\t\t\t\t[ group ]: {\n\t\t\t\t\t...items[ group ],\n\t\t\t\t\t[ label ]: true,\n\t\t\t\t},\n\t\t\t};\n\t\t\treturn newState;\n\t\t} );\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 ] );\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\tclassName,\n\t\thasInnerWrapper,\n\t\tmenuItems,\n\t\tareAllOptionalControlsHidden,\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 = ( label: string ) => {\n\t\tconst currentItem = panelItems.find( ( item ) => item.label === label );\n\n\t\tif ( ! currentItem ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst menuGroup = currentItem.isShownByDefault ? 'default' : 'optional';\n\n\t\tconst newMenuItems = {\n\t\t\t...menuItems,\n\t\t\t[ menuGroup ]: {\n\t\t\t\t...menuItems[ menuGroup ],\n\t\t\t\t[ label ]: ! menuItems[ menuGroup ][ label ],\n\t\t\t},\n\t\t};\n\n\t\tsetMenuItems( newMenuItems );\n\t};\n\n\tconst getResetAllFilters = () => {\n\t\tconst filters: Array< () => void > = [];\n\n\t\tpanelItems.forEach( ( item ) => {\n\t\t\tif ( item.resetAllFilter ) {\n\t\t\t\tfilters.push( item.resetAllFilter );\n\t\t\t}\n\t\t} );\n\t\treturn filters;\n\t};\n\n\t// Resets display of children and executes resetAll callback if available.\n\tconst resetAllItems = () => {\n\t\tif ( typeof resetAll === 'function' ) {\n\t\t\tisResetting.current = true;\n\t\t\tresetAll( getResetAllFilters() );\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\n\tconst panelContext = {\n\t\tpanelId,\n\t\tmenuItems,\n\t\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t\tflagItemCustomization,\n\t\tareAllOptionalControlsHidden,\n\t\thasMenuItems: !! panelItems.length,\n\t\tisResetting: isResetting.current,\n\t\tshouldRenderPlaceholderItems,\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/component.js

@@ -32,7 +32,6 @@ var _context = require("../../ui/context");
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * WordPress dependencies

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"names":["noop","DefaultControlsGroup","items","onClose","toggleItem","length","map","label","hasValue","icon","reset","check","itemLabel","undefined","OptionalControlsGroup","isSelected","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","dropdownMenuClassName","hasMenuItems","headingClassName","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","plus","moreVertical","dropDownMenuLabelText","className","isSmall","ConnectedToolsPanelHeader"],"mappings":";;;;;;;;;;;;;AASA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AArBA;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAaA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,MAAMC,oBAAoB,GAAG,QAIQ;AAAA,MAJN;AAC9BC,IAAAA,KAD8B;AAE9BC,IAAAA,OAF8B;AAG9BC,IAAAA;AAH8B,GAIM;;AACpC,MAAK,CAAEF,KAAK,CAACG,MAAb,EAAsB;AACrB,WAAO,IAAP;AACA;;AAED,SACC,4BAAC,kBAAD,QACGH,KAAK,CAACI,GAAN,CAAW,SAA2B;AAAA,QAAzB,CAAEC,KAAF,EAASC,QAAT,CAAyB;AACvC,UAAMC,IAAI,GAAGD,QAAQ,GAAGE,YAAH,GAAWC,YAAhC;AACA,UAAMC,SAAS,GAAGJ,QAAQ,GACvB,oBACA;AACA,kBAAI,UAAJ,CAFA,EAGAD,KAHA,CADuB,GAMvBM,SANH;AAQA,WACC,4BAAC,iBAAD;AACC,MAAA,GAAG,EAAGN,KADP;AAEC,MAAA,IAAI,EAAGE,IAFR;AAGC,MAAA,UAAU,EAAG,IAHd;AAIC,MAAA,QAAQ,EAAG,CAAED,QAJd;AAKC,MAAA,KAAK,EAAGI,SALT;AAMC,MAAA,OAAO,EAAG,MAAM;AACfR,QAAAA,UAAU,CAAEG,KAAF,CAAV;AACAJ,QAAAA,OAAO;AACP,OATF;AAUC,MAAA,IAAI,EAAC;AAVN,OAYGI,KAZH,CADD;AAgBA,GA1BC,CADH,CADD;AA+BA,CAxCD;;AA0CA,MAAMO,qBAAqB,GAAG,SAIO;AAAA,MAJL;AAC/BZ,IAAAA,KAD+B;AAE/BC,IAAAA,OAF+B;AAG/BC,IAAAA;AAH+B,GAIK;;AACpC,MAAK,CAAEF,KAAK,CAACG,MAAb,EAAsB;AACrB,WAAO,IAAP;AACA;;AAED,SACC,4BAAC,kBAAD,QACGH,KAAK,CAACI,GAAN,CAAW,SAA6B;AAAA,QAA3B,CAAEC,KAAF,EAASQ,UAAT,CAA2B;AACzC,UAAMH,SAAS,GAAGG,UAAU,GACzB,oBACA;AACA,kBAAI,mBAAJ,CAFA,EAGAR,KAHA,CADyB,GAMzB,oBACA;AACA,kBAAI,SAAJ,CAFA,EAGAA,KAHA,CANH;AAYA,WACC,4BAAC,iBAAD;AACC,MAAA,GAAG,EAAGA,KADP;AAEC,MAAA,IAAI,EAAGQ,UAAU,IAAIJ,YAFtB;AAGC,MAAA,UAAU,EAAGI,UAHd;AAIC,MAAA,KAAK,EAAGH,SAJT;AAKC,MAAA,OAAO,EAAG,MAAM;AACfR,QAAAA,UAAU,CAAEG,KAAF,CAAV;AACAJ,QAAAA,OAAO;AACP,OARF;AASC,MAAA,IAAI,EAAC;AATN,OAWGI,KAXH,CADD;AAeA,GA5BC,CADH,CADD;AAiCA,CA1CD;;AA4CA,MAAMS,gBAAgB,GAAG,CACxBC,KADwB,EAExBC,YAFwB,KAGpB;AACJ,QAAM;AACLC,IAAAA,4BADK;AAELC,IAAAA,qBAFK;AAGLC,IAAAA,YAHK;AAILC,IAAAA,gBAJK;AAKLf,IAAAA,KAAK,EAAEgB,SALF;AAMLC,IAAAA,SANK;AAOLC,IAAAA,QAPK;AAQLrB,IAAAA,UARK;AASL,OAAGsB;AATE,MAUF,+BAAqBT,KAArB,CAVJ;;AAYA,MAAK,CAAEM,SAAP,EAAmB;AAClB,WAAO,IAAP;AACA;;AAED,QAAMI,YAAY,GAAGC,MAAM,CAACC,OAAP,CAAgB,CAAAL,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS,CAAEM,OAAX,KAAsB,EAAtC,CAArB;AACA,QAAMC,aAAa,GAAGH,MAAM,CAACC,OAAP,CAAgB,CAAAL,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS,CAAEQ,QAAX,KAAuB,EAAvC,CAAtB;AACA,QAAMC,gBAAgB,GAAGd,4BAA4B,GAAGe,WAAH,GAAUC,mBAA/D;AACA,QAAMC,qBAAqB,GAAGjB,4BAA4B,GACvD,cACA,sBADA,EAEA,2CAFA,CADuD,GAKvD,cAAI,cAAJ,EAAoB,2CAApB,CALH;AAOA,SACC,4BAAC,cAAD,6BAAaO,WAAb;AAA2B,IAAA,GAAG,EAAGR;AAAjC,MACC,4BAAC,gBAAD;AAAS,IAAA,KAAK,EAAG,CAAjB;AAAqB,IAAA,SAAS,EAAGI;AAAjC,KACGC,SADH,CADD,EAIGF,YAAY,IACb,4BAAC,qBAAD;AACC,IAAA,IAAI,EAAGY,gBADR;AAEC,IAAA,KAAK,EAAGG,qBAFT;AAGC,IAAA,SAAS,EAAG;AAAEC,MAAAA,SAAS,EAAEjB;AAAb,KAHb;AAIC,IAAA,WAAW,EAAG;AAAEkB,MAAAA,OAAO,EAAE;AAAX;AAJf,KAMG;AAAA,QAAE;AAAEnC,MAAAA,OAAO,GAAGH;AAAZ,KAAF;AAAA,WACD,qDACC,4BAAC,oBAAD;AACC,MAAA,KAAK,EAAG2B,YADT;AAEC,MAAA,OAAO,EAAGxB,OAFX;AAGC,MAAA,UAAU,EAAGC;AAHd,MADD,EAMC,4BAAC,qBAAD;AACC,MAAA,KAAK,EAAG2B,aADT;AAEC,MAAA,OAAO,EAAG5B,OAFX;AAGC,MAAA,UAAU,EAAGC;AAHd,MAND,EAWC,4BAAC,kBAAD,QACC,4BAAC,iBAAD;AACC,MAAA,OAAO,EAAG,UADX;AAEC,MAAA,OAAO,EAAG,MAAM;AACfqB,QAAAA,QAAQ;AACRtB,QAAAA,OAAO;AACP;AALF,OAOG,cAAI,WAAJ,CAPH,CADD,CAXD,CADC;AAAA,GANH,CALF,CADD;AAyCA,CAvED;;AAyEA,MAAMoC,yBAAyB,GAAG,6BACjCvB,gBADiC,EAEjC,kBAFiC,CAAlC;eAKeuB,yB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type { Ref } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { check, reset, moreVertical, plus } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DropdownMenu from '../../dropdown-menu';\nimport MenuGroup from '../../menu-group';\nimport MenuItem from '../../menu-item';\nimport { HStack } from '../../h-stack';\nimport { Heading } from '../../heading';\nimport { useToolsPanelHeader } from './hook';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport type {\n\tToolsPanelControlsGroupProps,\n\tToolsPanelHeaderProps,\n} from '../types';\n\nconst noop = () => {};\n\nconst DefaultControlsGroup = ( {\n\titems,\n\tonClose,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, hasValue ] ) => {\n\t\t\t\tconst icon = hasValue ? reset : check;\n\t\t\t\tconst itemLabel = hasValue\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t  )\n\t\t\t\t\t: undefined;\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tisSelected={ true }\n\t\t\t\t\t\tdisabled={ ! hasValue }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst OptionalControlsGroup = ( {\n\titems,\n\tonClose,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, isSelected ] ) => {\n\t\t\t\tconst itemLabel = isSelected\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being hidden and reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Hide and reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t  )\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control to display e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Show %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t  );\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst ToolsPanelHeader = (\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >,\n\tforwardedRef: Ref< any >\n) => {\n\tconst {\n\t\tareAllOptionalControlsHidden,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\tlabel: labelText,\n\t\tmenuItems,\n\t\tresetAll,\n\t\ttoggleItem,\n\t\t...headerProps\n\t} = useToolsPanelHeader( props );\n\n\tif ( ! labelText ) {\n\t\treturn null;\n\t}\n\n\tconst defaultItems = Object.entries( menuItems?.default || {} );\n\tconst optionalItems = Object.entries( menuItems?.optional || {} );\n\tconst dropDownMenuIcon = areAllOptionalControlsHidden ? plus : moreVertical;\n\tconst dropDownMenuLabelText = areAllOptionalControlsHidden\n\t\t? _x(\n\t\t\t\t'View and add options',\n\t\t\t\t'Button label to reveal tool panel options'\n\t\t  )\n\t\t: _x( 'View options', 'Button label to reveal tool panel options' );\n\n\treturn (\n\t\t<HStack { ...headerProps } ref={ forwardedRef }>\n\t\t\t<Heading level={ 2 } className={ headingClassName }>\n\t\t\t\t{ labelText }\n\t\t\t</Heading>\n\t\t\t{ hasMenuItems && (\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ticon={ dropDownMenuIcon }\n\t\t\t\t\tlabel={ dropDownMenuLabelText }\n\t\t\t\t\tmenuProps={ { className: dropdownMenuClassName } }\n\t\t\t\t\ttoggleProps={ { isSmall: true } }\n\t\t\t\t>\n\t\t\t\t\t{ ( { onClose = noop } ) => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<DefaultControlsGroup\n\t\t\t\t\t\t\t\titems={ defaultItems }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<OptionalControlsGroup\n\t\t\t\t\t\t\t\titems={ optionalItems }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\tvariant={ 'tertiary' }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tresetAll();\n\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Reset all' ) }\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenu>\n\t\t\t) }\n\t\t</HStack>\n\t);\n};\n\nconst ConnectedToolsPanelHeader = contextConnect(\n\tToolsPanelHeader,\n\t'ToolsPanelHeader'\n);\n\nexport default ConnectedToolsPanelHeader;\n"]}
+{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"names":["noop","DefaultControlsGroup","items","onClose","toggleItem","length","map","label","hasValue","icon","reset","check","itemLabel","undefined","OptionalControlsGroup","isSelected","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","dropdownMenuClassName","hasMenuItems","headingClassName","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","plus","moreVertical","dropDownMenuLabelText","className","isSmall","ConnectedToolsPanelHeader"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { Ref } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { check, reset, moreVertical, plus } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DropdownMenu from '../../dropdown-menu';\nimport MenuGroup from '../../menu-group';\nimport MenuItem from '../../menu-item';\nimport { HStack } from '../../h-stack';\nimport { Heading } from '../../heading';\nimport { useToolsPanelHeader } from './hook';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport type {\n\tToolsPanelControlsGroupProps,\n\tToolsPanelHeaderProps,\n} from '../types';\n\nconst noop = () => {};\n\nconst DefaultControlsGroup = ( {\n\titems,\n\tonClose,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, hasValue ] ) => {\n\t\t\t\tconst icon = hasValue ? reset : check;\n\t\t\t\tconst itemLabel = hasValue\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t  )\n\t\t\t\t\t: undefined;\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tisSelected={ true }\n\t\t\t\t\t\tdisabled={ ! hasValue }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst OptionalControlsGroup = ( {\n\titems,\n\tonClose,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, isSelected ] ) => {\n\t\t\t\tconst itemLabel = isSelected\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being hidden and reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Hide and reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t  )\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control to display e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Show %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t  );\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst ToolsPanelHeader = (\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >,\n\tforwardedRef: Ref< any >\n) => {\n\tconst {\n\t\tareAllOptionalControlsHidden,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\tlabel: labelText,\n\t\tmenuItems,\n\t\tresetAll,\n\t\ttoggleItem,\n\t\t...headerProps\n\t} = useToolsPanelHeader( props );\n\n\tif ( ! labelText ) {\n\t\treturn null;\n\t}\n\n\tconst defaultItems = Object.entries( menuItems?.default || {} );\n\tconst optionalItems = Object.entries( menuItems?.optional || {} );\n\tconst dropDownMenuIcon = areAllOptionalControlsHidden ? plus : moreVertical;\n\tconst dropDownMenuLabelText = areAllOptionalControlsHidden\n\t\t? _x(\n\t\t\t\t'View and add options',\n\t\t\t\t'Button label to reveal tool panel options'\n\t\t  )\n\t\t: _x( 'View options', 'Button label to reveal tool panel options' );\n\n\treturn (\n\t\t<HStack { ...headerProps } ref={ forwardedRef }>\n\t\t\t<Heading level={ 2 } className={ headingClassName }>\n\t\t\t\t{ labelText }\n\t\t\t</Heading>\n\t\t\t{ hasMenuItems && (\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ticon={ dropDownMenuIcon }\n\t\t\t\t\tlabel={ dropDownMenuLabelText }\n\t\t\t\t\tmenuProps={ { className: dropdownMenuClassName } }\n\t\t\t\t\ttoggleProps={ { isSmall: true } }\n\t\t\t\t>\n\t\t\t\t\t{ ( { onClose = noop } ) => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<DefaultControlsGroup\n\t\t\t\t\t\t\t\titems={ defaultItems }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<OptionalControlsGroup\n\t\t\t\t\t\t\t\titems={ optionalItems }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\tvariant={ 'tertiary' }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tresetAll();\n\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Reset all' ) }\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenu>\n\t\t\t) }\n\t\t</HStack>\n\t);\n};\n\nconst ConnectedToolsPanelHeader = contextConnect(\n\tToolsPanelHeader,\n\t'ToolsPanelHeader'\n);\n\nexport default ConnectedToolsPanelHeader;\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/component.js

@@ -20,7 +20,6 @@ var _context = require("../../ui/context");
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * Internal dependencies

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-item/component.tsx"],"names":["ToolsPanelItem","props","forwardedRef","children","isShown","shouldRenderPlaceholder","toolsPanelItemProps","ConnectedToolsPanelItem"],"mappings":";;;;;;;;;;;;;AASA;;AACA;;AACA;;AAXA;AACA;AACA;AACA;;AAGA;AACA;AACA;AAMA;AACA;AACA,MAAMA,cAAc,GAAG,CACtBC,KADsB,EAEtBC,YAFsB,KAGlB;AACJ,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,OAFK;AAGLC,IAAAA,uBAHK;AAIL,OAAGC;AAJE,MAKF,6BAAmBL,KAAnB,CALJ;;AAOA,MAAK,CAAEG,OAAP,EAAiB;AAChB,WAAOC,uBAAuB,GAC7B,4BAAC,UAAD,6BAAWC,mBAAX;AAAiC,MAAA,GAAG,EAAGJ;AAAvC,OAD6B,GAE1B,IAFJ;AAGA;;AAED,SACC,4BAAC,UAAD,6BAAWI,mBAAX;AAAiC,IAAA,GAAG,EAAGJ;AAAvC,MACGC,QADH,CADD;AAKA,CAtBD;;AAwBA,MAAMI,uBAAuB,GAAG,6BAC/BP,cAD+B,EAE/B,gBAF+B,CAAhC;eAKeO,uB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type { Ref } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelItem } from './hook';\nimport { View } from '../../view';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport type { ToolsPanelItemProps } from '../types';\n\n// This wraps controls to be conditionally displayed within a tools panel. It\n// prevents props being applied to HTML elements that would make them invalid.\nconst ToolsPanelItem = (\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >,\n\tforwardedRef: Ref< any >\n) => {\n\tconst {\n\t\tchildren,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\t...toolsPanelItemProps\n\t} = useToolsPanelItem( props );\n\n\tif ( ! isShown ) {\n\t\treturn shouldRenderPlaceholder ? (\n\t\t\t<View { ...toolsPanelItemProps } ref={ forwardedRef } />\n\t\t) : null;\n\t}\n\n\treturn (\n\t\t<View { ...toolsPanelItemProps } ref={ forwardedRef }>\n\t\t\t{ children }\n\t\t</View>\n\t);\n};\n\nconst ConnectedToolsPanelItem = contextConnect(\n\tToolsPanelItem,\n\t'ToolsPanelItem'\n);\n\nexport default ConnectedToolsPanelItem;\n"]}
+{"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-item/component.tsx"],"names":["ToolsPanelItem","props","forwardedRef","children","isShown","shouldRenderPlaceholder","toolsPanelItemProps","ConnectedToolsPanelItem"],"mappings":";;;;;;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA;AACA;AACA,MAAMA,cAAc,GAAG,CACtBC,KADsB,EAEtBC,YAFsB,KAGlB;AACJ,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,OAFK;AAGLC,IAAAA,uBAHK;AAIL,OAAGC;AAJE,MAKF,6BAAmBL,KAAnB,CALJ;;AAOA,MAAK,CAAEG,OAAP,EAAiB;AAChB,WAAOC,uBAAuB,GAC7B,4BAAC,UAAD,6BAAWC,mBAAX;AAAiC,MAAA,GAAG,EAAGJ;AAAvC,OAD6B,GAE1B,IAFJ;AAGA;;AAED,SACC,4BAAC,UAAD,6BAAWI,mBAAX;AAAiC,IAAA,GAAG,EAAGJ;AAAvC,MACGC,QADH,CADD;AAKA,CAtBD;;AAwBA,MAAMI,uBAAuB,GAAG,6BAC/BP,cAD+B,EAE/B,gBAF+B,CAAhC;eAKeO,uB","sourcesContent":["/**\n * External dependencies\n */\nimport type { Ref } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelItem } from './hook';\nimport { View } from '../../view';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport type { ToolsPanelItemProps } from '../types';\n\n// This wraps controls to be conditionally displayed within a tools panel. It\n// prevents props being applied to HTML elements that would make them invalid.\nconst ToolsPanelItem = (\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >,\n\tforwardedRef: Ref< any >\n) => {\n\tconst {\n\t\tchildren,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\t...toolsPanelItemProps\n\t} = useToolsPanelItem( props );\n\n\tif ( ! isShown ) {\n\t\treturn shouldRenderPlaceholder ? (\n\t\t\t<View { ...toolsPanelItemProps } ref={ forwardedRef } />\n\t\t) : null;\n\t}\n\n\treturn (\n\t\t<View { ...toolsPanelItemProps } ref={ forwardedRef }>\n\t\t\t{ children }\n\t\t</View>\n\t);\n};\n\nconst ConnectedToolsPanelItem = contextConnect(\n\tToolsPanelItem,\n\t'ToolsPanelItem'\n);\n\nexport default ConnectedToolsPanelItem;\n"]}

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

@@ -49,7 +49,11 @@ function useToolsPanelItem(props) {
     deregisterPanelItem,
     flagItemCustomization,
     isResetting,
-    shouldRenderPlaceholderItems: shouldRenderPlaceholder
+    shouldRenderPlaceholderItems: shouldRenderPlaceholder,
+    firstDisplayedItem,
+    lastDisplayedItem,
+    __experimentalFirstVisibleItemClass,
+    __experimentalLastVisibleItemClass
   } = (0, _context.useToolsPanelContext)();
   const hasValueCallback = (0, _element.useCallback)(hasValue, [panelId]);
   const resetAllFilterCallback = (0, _element.useCallback)(resetAllFilter, [panelId]);
@@ -110,8 +114,10 @@ function useToolsPanelItem(props) {
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => {
     const placeholderStyle = shouldRenderPlaceholder && !isShown && styles.ToolsPanelItemPlaceholder;
-    return cx(styles.ToolsPanelItem, placeholderStyle, className);
-  }, [isShown, shouldRenderPlaceholder, className]);
+    const firstItemStyle = firstDisplayedItem === label && __experimentalFirstVisibleItemClass;
+    const lastItemStyle = lastDisplayedItem === label && __experimentalLastVisibleItemClass;
+    return cx(styles.ToolsPanelItem, placeholderStyle, className, firstItemStyle, lastItemStyle);
+  }, [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","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","isValueSet","wasValueSet","menuGroup","isMenuItemChecked","wasMenuItemChecked","isShown","undefined","cx","classes","placeholderStyle","styles","ToolsPanelItemPlaceholder","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} = 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\treturn cx( styles.ToolsPanelItem, placeholderStyle, className );\n\t}, [ isShown, shouldRenderPlaceholder, className ] );\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/ui/shortcut/component.js

@@ -18,7 +18,6 @@ var _view = require("../../view");
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * Internal dependencies

package/build/ui/shortcut/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/shortcut/component.tsx"],"names":["Shortcut","props","forwardedRef","as","asProp","shortcut","className","otherProps","displayText","ariaLabel","display","ConnectedShortcut"],"mappings":";;;;;;;;;;;;;AASA;;AAKA;;AAdA;AACA;AACA;AACA;;AAGA;AACA;AACA;AAkBA,SAASA,QAAT,CACCC,KADD,EAECC,YAFD,EAGsB;AACrB,QAAM;AACLC,IAAAA,EAAE,EAAEC,MAAM,GAAG,MADR;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAIL,OAAGC;AAJE,MAKF,+BAAkBN,KAAlB,EAAyB,UAAzB,CALJ;;AAMA,MAAK,CAAEI,QAAP,EAAkB;AACjB,WAAO,IAAP;AACA;;AAED,MAAIG,WAAJ;AACA,MAAIC,SAAJ;;AAEA,MAAK,OAAOJ,QAAP,KAAoB,QAAzB,EAAoC;AACnCG,IAAAA,WAAW,GAAGH,QAAd;AACA,GAFD,MAEO;AACNG,IAAAA,WAAW,GAAGH,QAAQ,CAACK,OAAvB;AACAD,IAAAA,SAAS,GAAGJ,QAAQ,CAACI,SAArB;AACA;;AAED,SACC,4BAAC,UAAD;AACC,IAAA,EAAE,EAAGL,MADN;AAEC,IAAA,SAAS,EAAGE,SAFb;AAGC,kBAAaG,SAHd;AAIC,IAAA,GAAG,EAAGP;AAJP,KAKMK,UALN,GAOGC,WAPH,CADD;AAWA;;AAED,MAAMG,iBAAiB,GAAG,6BAAgBX,QAAhB,EAA0B,UAA1B,CAA1B;eAEeW,iB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type { Ref } from 'react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../context';\nimport { View } from '../../view';\n\nexport interface ShortcutDescription {\n\tdisplay: string;\n\tariaLabel: string;\n}\n\nexport interface Props {\n\tshortcut?: ShortcutDescription | string;\n\tclassName?: string;\n}\n\nfunction Shortcut(\n\tprops: WordPressComponentProps< Props, 'span' >,\n\tforwardedRef: Ref< any >\n): JSX.Element | null {\n\tconst {\n\t\tas: asProp = 'span',\n\t\tshortcut,\n\t\tclassName,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Shortcut' );\n\tif ( ! shortcut ) {\n\t\treturn null;\n\t}\n\n\tlet displayText: string;\n\tlet ariaLabel: string | undefined;\n\n\tif ( typeof shortcut === 'string' ) {\n\t\tdisplayText = shortcut;\n\t} else {\n\t\tdisplayText = shortcut.display;\n\t\tariaLabel = shortcut.ariaLabel;\n\t}\n\n\treturn (\n\t\t<View\n\t\t\tas={ asProp }\n\t\t\tclassName={ className }\n\t\t\taria-label={ ariaLabel }\n\t\t\tref={ forwardedRef }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t{ displayText }\n\t\t</View>\n\t);\n}\n\nconst ConnectedShortcut = contextConnect( Shortcut, 'Shortcut' );\n\nexport default ConnectedShortcut;\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/shortcut/component.tsx"],"names":["Shortcut","props","forwardedRef","as","asProp","shortcut","className","otherProps","displayText","ariaLabel","display","ConnectedShortcut"],"mappings":";;;;;;;;;;;;;AAQA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;AAkBA,SAASA,QAAT,CACCC,KADD,EAECC,YAFD,EAGsB;AACrB,QAAM;AACLC,IAAAA,EAAE,EAAEC,MAAM,GAAG,MADR;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAIL,OAAGC;AAJE,MAKF,+BAAkBN,KAAlB,EAAyB,UAAzB,CALJ;;AAMA,MAAK,CAAEI,QAAP,EAAkB;AACjB,WAAO,IAAP;AACA;;AAED,MAAIG,WAAJ;AACA,MAAIC,SAAJ;;AAEA,MAAK,OAAOJ,QAAP,KAAoB,QAAzB,EAAoC;AACnCG,IAAAA,WAAW,GAAGH,QAAd;AACA,GAFD,MAEO;AACNG,IAAAA,WAAW,GAAGH,QAAQ,CAACK,OAAvB;AACAD,IAAAA,SAAS,GAAGJ,QAAQ,CAACI,SAArB;AACA;;AAED,SACC,4BAAC,UAAD;AACC,IAAA,EAAE,EAAGL,MADN;AAEC,IAAA,SAAS,EAAGE,SAFb;AAGC,kBAAaG,SAHd;AAIC,IAAA,GAAG,EAAGP;AAJP,KAKMK,UALN,GAOGC,WAPH,CADD;AAWA;;AAED,MAAMG,iBAAiB,GAAG,6BAAgBX,QAAhB,EAA0B,UAA1B,CAA1B;eAEeW,iB","sourcesContent":["/**\n * External dependencies\n */\nimport type { Ref } from 'react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../context';\nimport { View } from '../../view';\n\nexport interface ShortcutDescription {\n\tdisplay: string;\n\tariaLabel: string;\n}\n\nexport interface Props {\n\tshortcut?: ShortcutDescription | string;\n\tclassName?: string;\n}\n\nfunction Shortcut(\n\tprops: WordPressComponentProps< Props, 'span' >,\n\tforwardedRef: Ref< any >\n): JSX.Element | null {\n\tconst {\n\t\tas: asProp = 'span',\n\t\tshortcut,\n\t\tclassName,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Shortcut' );\n\tif ( ! shortcut ) {\n\t\treturn null;\n\t}\n\n\tlet displayText: string;\n\tlet ariaLabel: string | undefined;\n\n\tif ( typeof shortcut === 'string' ) {\n\t\tdisplayText = shortcut;\n\t} else {\n\t\tdisplayText = shortcut.display;\n\t\tariaLabel = shortcut.ariaLabel;\n\t}\n\n\treturn (\n\t\t<View\n\t\t\tas={ asProp }\n\t\t\tclassName={ className }\n\t\t\taria-label={ ariaLabel }\n\t\t\tref={ forwardedRef }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t{ displayText }\n\t\t</View>\n\t);\n}\n\nconst ConnectedShortcut = contextConnect( Shortcut, 'Shortcut' );\n\nexport default ConnectedShortcut;\n"]}

package/build/ui/utils/font-size.js

@@ -14,7 +14,6 @@ var _configValues = _interopRequireDefault(require("../../utils/config-values"))
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * Internal dependencies

package/build/ui/utils/font-size.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/font-size.ts"],"names":["BASE_FONT_SIZE","PRESET_FONT_SIZES","body","caption","footnote","largeTitle","subheadline","title","HEADING_FONT_SIZES","flatMap","n","toString","getFontSize","size","parsed","parseFloat","Number","isNaN","ratio","CONFIG","fontSize","getHeadingFontSize","includes","headingSize"],"mappings":";;;;;;;;;;;AASA;;AATA;AACA;AACA;AACA;;AAGA;AACA;AACA;AAiBO,MAAMA,cAAc,GAAG,EAAvB;;AAEA,MAAMC,iBAAiB,GAAG;AAChCC,EAAAA,IAAI,EAAEF,cAD0B;AAEhCG,EAAAA,OAAO,EAAE,EAFuB;AAGhCC,EAAAA,QAAQ,EAAE,EAHsB;AAIhCC,EAAAA,UAAU,EAAE,EAJoB;AAKhCC,EAAAA,WAAW,EAAE,EALmB;AAMhCC,EAAAA,KAAK,EAAE;AANyB,CAA1B;;AASA,MAAMC,kBAAkB,GAAG,CAAE,CAAF,EAAK,CAAL,EAAQ,CAAR,EAAW,CAAX,EAAc,CAAd,EAAiB,CAAjB,EAAqBC,OAArB,CAAgCC,CAAF,IAAS,CACxEA,CADwE,EAExEA,CAAC,CAACC,QAAF,EAFwE,CAAvC,CAA3B;;;AAKA,SAASC,WAAT,GAIG;AAAA,MAHTC,IAGS,uEAD2Bb,cAC3B;;AACT,MAAKa,IAAI,IAAIZ,iBAAb,EAAiC;AAChC,WAAOW,WAAW,CACjBX,iBAAiB,CAAEY,IAAF,CADA,CAAlB;AAGA;;AAED,MAAK,OAAOA,IAAP,KAAgB,QAArB,EAAgC;AAC/B,UAAMC,MAAM,GAAGC,UAAU,CAAEF,IAAF,CAAzB;AACA,QAAKG,MAAM,CAACC,KAAP,CAAcH,MAAd,CAAL,EAA8B,OAAOD,IAAP;AAC9BA,IAAAA,IAAI,GAAGC,MAAP;AACA;;AAED,QAAMI,KAAK,GAAI,IAAIL,IAAM,MAAMb,cAAgB,GAA/C;AACA,SAAQ,QAAQkB,KAAO,MAAMC,sBAAOC,QAAU,GAA9C;AACA;;AAEM,SAASC,kBAAT,GAA2D;AAAA,MAA9BR,IAA8B,uEAAZ,CAAY;;AACjE,MAAK,CAAEL,kBAAkB,CAACc,QAAnB,CAA6BT,IAA7B,CAAP,EAA4D;AAC3D,WAAOD,WAAW,CAAEC,IAAF,CAAlB;AACA;;AAED,QAAMU,WAAW,GAAI,YAAYV,IAAM,EAAvC;AACA,SAAOM,sBAAQI,WAAR,CAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type { CSSProperties, ReactText } from 'react';\n\n/**\n * Internal dependencies\n */\nimport CONFIG from '../../utils/config-values';\n\nexport type HeadingSize =\n\t| 1\n\t| 2\n\t| 3\n\t| 4\n\t| 5\n\t| 6\n\t| '1'\n\t| '2'\n\t| '3'\n\t| '4'\n\t| '5'\n\t| '6';\n\nexport const BASE_FONT_SIZE = 13;\n\nexport const PRESET_FONT_SIZES = {\n\tbody: BASE_FONT_SIZE,\n\tcaption: 10,\n\tfootnote: 11,\n\tlargeTitle: 28,\n\tsubheadline: 12,\n\ttitle: 20,\n};\n\nexport const HEADING_FONT_SIZES = [ 1, 2, 3, 4, 5, 6 ].flatMap( ( n ) => [\n\tn as HeadingSize,\n\tn.toString() as HeadingSize,\n] );\n\nexport function getFontSize(\n\tsize:\n\t\t| CSSProperties[ 'fontSize' ]\n\t\t| keyof typeof PRESET_FONT_SIZES = BASE_FONT_SIZE\n): string {\n\tif ( size in PRESET_FONT_SIZES ) {\n\t\treturn getFontSize(\n\t\t\tPRESET_FONT_SIZES[ size as keyof typeof PRESET_FONT_SIZES ]\n\t\t);\n\t}\n\n\tif ( typeof size !== 'number' ) {\n\t\tconst parsed = parseFloat( size );\n\t\tif ( Number.isNaN( parsed ) ) return size;\n\t\tsize = parsed;\n\t}\n\n\tconst ratio = `(${ size } / ${ BASE_FONT_SIZE })`;\n\treturn `calc(${ ratio } * ${ CONFIG.fontSize })`;\n}\n\nexport function getHeadingFontSize( size: ReactText = 3 ): string {\n\tif ( ! HEADING_FONT_SIZES.includes( size as HeadingSize ) ) {\n\t\treturn getFontSize( size );\n\t}\n\n\tconst headingSize = `fontSizeH${ size }` as `fontSizeH${ HeadingSize }`;\n\treturn CONFIG[ headingSize ];\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/font-size.ts"],"names":["BASE_FONT_SIZE","PRESET_FONT_SIZES","body","caption","footnote","largeTitle","subheadline","title","HEADING_FONT_SIZES","flatMap","n","toString","getFontSize","size","parsed","parseFloat","Number","isNaN","ratio","CONFIG","fontSize","getHeadingFontSize","includes","headingSize"],"mappings":";;;;;;;;;;;AAQA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAiBO,MAAMA,cAAc,GAAG,EAAvB;;AAEA,MAAMC,iBAAiB,GAAG;AAChCC,EAAAA,IAAI,EAAEF,cAD0B;AAEhCG,EAAAA,OAAO,EAAE,EAFuB;AAGhCC,EAAAA,QAAQ,EAAE,EAHsB;AAIhCC,EAAAA,UAAU,EAAE,EAJoB;AAKhCC,EAAAA,WAAW,EAAE,EALmB;AAMhCC,EAAAA,KAAK,EAAE;AANyB,CAA1B;;AASA,MAAMC,kBAAkB,GAAG,CAAE,CAAF,EAAK,CAAL,EAAQ,CAAR,EAAW,CAAX,EAAc,CAAd,EAAiB,CAAjB,EAAqBC,OAArB,CAAgCC,CAAF,IAAS,CACxEA,CADwE,EAExEA,CAAC,CAACC,QAAF,EAFwE,CAAvC,CAA3B;;;AAKA,SAASC,WAAT,GAIG;AAAA,MAHTC,IAGS,uEAD2Bb,cAC3B;;AACT,MAAKa,IAAI,IAAIZ,iBAAb,EAAiC;AAChC,WAAOW,WAAW,CACjBX,iBAAiB,CAAEY,IAAF,CADA,CAAlB;AAGA;;AAED,MAAK,OAAOA,IAAP,KAAgB,QAArB,EAAgC;AAC/B,UAAMC,MAAM,GAAGC,UAAU,CAAEF,IAAF,CAAzB;AACA,QAAKG,MAAM,CAACC,KAAP,CAAcH,MAAd,CAAL,EAA8B,OAAOD,IAAP;AAC9BA,IAAAA,IAAI,GAAGC,MAAP;AACA;;AAED,QAAMI,KAAK,GAAI,IAAIL,IAAM,MAAMb,cAAgB,GAA/C;AACA,SAAQ,QAAQkB,KAAO,MAAMC,sBAAOC,QAAU,GAA9C;AACA;;AAEM,SAASC,kBAAT,GAA2D;AAAA,MAA9BR,IAA8B,uEAAZ,CAAY;;AACjE,MAAK,CAAEL,kBAAkB,CAACc,QAAnB,CAA6BT,IAA7B,CAAP,EAA4D;AAC3D,WAAOD,WAAW,CAAEC,IAAF,CAAlB;AACA;;AAED,QAAMU,WAAW,GAAI,YAAYV,IAAM,EAAvC;AACA,SAAOM,sBAAQI,WAAR,CAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties, ReactText } from 'react';\n\n/**\n * Internal dependencies\n */\nimport CONFIG from '../../utils/config-values';\n\nexport type HeadingSize =\n\t| 1\n\t| 2\n\t| 3\n\t| 4\n\t| 5\n\t| 6\n\t| '1'\n\t| '2'\n\t| '3'\n\t| '4'\n\t| '5'\n\t| '6';\n\nexport const BASE_FONT_SIZE = 13;\n\nexport const PRESET_FONT_SIZES = {\n\tbody: BASE_FONT_SIZE,\n\tcaption: 10,\n\tfootnote: 11,\n\tlargeTitle: 28,\n\tsubheadline: 12,\n\ttitle: 20,\n};\n\nexport const HEADING_FONT_SIZES = [ 1, 2, 3, 4, 5, 6 ].flatMap( ( n ) => [\n\tn as HeadingSize,\n\tn.toString() as HeadingSize,\n] );\n\nexport function getFontSize(\n\tsize:\n\t\t| CSSProperties[ 'fontSize' ]\n\t\t| keyof typeof PRESET_FONT_SIZES = BASE_FONT_SIZE\n): string {\n\tif ( size in PRESET_FONT_SIZES ) {\n\t\treturn getFontSize(\n\t\t\tPRESET_FONT_SIZES[ size as keyof typeof PRESET_FONT_SIZES ]\n\t\t);\n\t}\n\n\tif ( typeof size !== 'number' ) {\n\t\tconst parsed = parseFloat( size );\n\t\tif ( Number.isNaN( parsed ) ) return size;\n\t\tsize = parsed;\n\t}\n\n\tconst ratio = `(${ size } / ${ BASE_FONT_SIZE })`;\n\treturn `calc(${ ratio } * ${ CONFIG.fontSize })`;\n}\n\nexport function getHeadingFontSize( size: ReactText = 3 ): string {\n\tif ( ! HEADING_FONT_SIZES.includes( size as HeadingSize ) ) {\n\t\treturn getFontSize( size );\n\t}\n\n\tconst headingSize = `fontSizeH${ size }` as `fontSizeH${ HeadingSize }`;\n\treturn CONFIG[ headingSize ];\n}\n"]}

package/build/ui/utils/get-valid-children.js

@@ -10,7 +10,6 @@ var _element = require("@wordpress/element");
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * WordPress dependencies

package/build/ui/utils/get-valid-children.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/utils/get-valid-children.ts"],"names":["getValidChildren","children","Children","toArray","filter","child"],"mappings":";;;;;;;AASA;;AATA;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,gBAAT,CAA2BC,QAA3B,EAAiE;AACvE,MAAK,OAAOA,QAAP,KAAoB,QAAzB,EAAoC,OAAO,CAAEA,QAAF,CAAP;AAEpC,SAAOC,kBAASC,OAAT,CAAkBF,QAAlB,EAA6BG,MAA7B,CAAuCC,KAAF,IAC3C,6BAAgBA,KAAhB,CADM,CAAP;AAGA","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type { ReactNode, ReactNodeArray } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Children, isValidElement } from '@wordpress/element';\n\n/**\n * Gets a collection of available children elements from a React component's children prop.\n *\n * @param  children\n *\n * @return An array of available children.\n */\nexport function getValidChildren( children: ReactNode ): ReactNodeArray {\n\tif ( typeof children === 'string' ) return [ children ];\n\n\treturn Children.toArray( children ).filter( ( child ) =>\n\t\tisValidElement( child )\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/utils/get-valid-children.ts"],"names":["getValidChildren","children","Children","toArray","filter","child"],"mappings":";;;;;;;AAQA;;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,gBAAT,CAA2BC,QAA3B,EAAiE;AACvE,MAAK,OAAOA,QAAP,KAAoB,QAAzB,EAAoC,OAAO,CAAEA,QAAF,CAAP;AAEpC,SAAOC,kBAASC,OAAT,CAAkBF,QAAlB,EAA6BG,MAA7B,CAAuCC,KAAF,IAC3C,6BAAgBA,KAAhB,CADM,CAAP;AAGA","sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, ReactNodeArray } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Children, isValidElement } from '@wordpress/element';\n\n/**\n * Gets a collection of available children elements from a React component's children prop.\n *\n * @param  children\n *\n * @return An array of available children.\n */\nexport function getValidChildren( children: ReactNode ): ReactNodeArray {\n\tif ( typeof children === 'string' ) return [ children ];\n\n\treturn Children.toArray( children ).filter( ( child ) =>\n\t\tisValidElement( child )\n\t);\n}\n"]}

package/build/unit-control/index.js

@@ -50,7 +50,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * WordPress dependencies

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["UnitControl","forwardedRef","__unstableStateReducer","stateReducer","state","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","noop","onUnitChange","size","style","unit","unitProp","units","unitsProp","CSS_UNITS","value","valueProp","props","initialUnit","setUnit","initial","fallback","refParsedValue","classes","handleOnChange","next","changeProps","join","handleOnUnitChange","data","nextValue","default","undefined","mayUpdateUnit","event","isNaN","Number","currentTarget","current","parsedValue","parsedUnit","toString","Array","isArray","find","option","handleOnBlur","handleOnKeyDown","keyCode","ENTER","unitControlStateReducer","action","type","inputControlActionTypes","COMMIT","inputSuffix","step","activeUnit","ForwardedUnitControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type {\n\tFocusEventHandler,\n\tKeyboardEvent,\n\tRef,\n\tSyntheticEvent,\n} from 'react';\nimport { noop, omit } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useMemo, useRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { ENTER } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { composeStateReducers } from '../input-control/reducer/reducer';\nimport { Root, ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedValue,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport type { StateReducer } from '../input-control/reducer/state';\n\nfunction UnitControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\tautoComplete = 'off',\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange = noop,\n\t\tonUnitChange = noop,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\t...props\n\t}: WordPressComponentProps< UnitControlProps, 'input', false >,\n\tforwardedRef: Ref< any >\n) {\n\tconst units = useMemo(\n\t\t() => getUnitsWithCurrentUnit( valueProp, unitProp, unitsProp ),\n\t\t[ valueProp, unitProp, unitsProp ]\n\t);\n\tconst [ value, initialUnit ] = getParsedValue( valueProp, unitProp, units );\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunitProp,\n\t\t{\n\t\t\tinitial: initialUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\t// Stores parsed value for hand-off in state reducer\n\tconst refParsedValue = useRef< string | null >( null );\n\n\tconst classes = classnames( 'components-unit-control', className );\n\n\tconst handleOnChange: UnitControlOnChangeCallback = (\n\t\tnext,\n\t\tchangeProps\n\t) => {\n\t\tif ( next === '' ) {\n\t\t\tonChange( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tnext = getValidParsedUnit( next, units, value, unit ).join( '' );\n\n\t\tonChange( next, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnext,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ value }${ next }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ next }`;\n\t\t}\n\n\t\tonChange( nextValue, changeProps );\n\t\tonUnitChange( next, changeProps );\n\n\t\tsetUnit( next );\n\t};\n\n\tconst mayUpdateUnit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tif ( ! isNaN( Number( event.currentTarget.value ) ) ) {\n\t\t\trefParsedValue.current = null;\n\t\t\treturn;\n\t\t}\n\t\tconst [ parsedValue, parsedUnit ] = getValidParsedUnit(\n\t\t\tevent.currentTarget.value,\n\t\t\tunits,\n\t\t\tvalue,\n\t\t\tunit\n\t\t);\n\n\t\trefParsedValue.current = parsedValue.toString();\n\n\t\tif ( isPressEnterToChange && parsedUnit !== unit ) {\n\t\t\tconst data = Array.isArray( units )\n\t\t\t\t? units.find( ( option ) => option.value === parsedUnit )\n\t\t\t\t: undefined;\n\t\t\tconst changeProps = { event, data };\n\n\t\t\tonChange( `${ parsedValue }${ parsedUnit }`, changeProps );\n\t\t\tonUnitChange( parsedUnit, changeProps );\n\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t};\n\n\tconst handleOnBlur: FocusEventHandler< HTMLInputElement > = mayUpdateUnit;\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { keyCode } = event;\n\t\tif ( keyCode === ENTER ) {\n\t\t\tmayUpdateUnit( event );\n\t\t}\n\t};\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param  state  State from InputControl\n\t * @param  action Action triggering state change\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst unitControlStateReducer: StateReducer = ( state, action ) => {\n\t\t/*\n\t\t * On commits (when pressing ENTER and on blur if\n\t\t * isPressEnterToChange is true), if a parse has been performed\n\t\t * then use that result to update the state.\n\t\t */\n\t\tif ( action.type === inputControlActionTypes.COMMIT ) {\n\t\t\tif ( refParsedValue.current !== null ) {\n\t\t\t\tstate.value = refParsedValue.current;\n\t\t\t\trefParsedValue.current = null;\n\t\t\t}\n\t\t}\n\n\t\treturn state;\n\t};\n\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<Root className=\"components-unit-control-wrapper\" style={ style }>\n\t\t\t<ValueInput\n\t\t\t\taria-label={ label }\n\t\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...omit( props, [ 'children' ] ) }\n\t\t\t\tautoComplete={ autoComplete }\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tlabel={ label }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\t\tonChange={ handleOnChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ inputSuffix }\n\t\t\t\tvalue={ value }\n\t\t\t\tstep={ step }\n\t\t\t\t__unstableStateReducer={ composeStateReducers(\n\t\t\t\t\tunitControlStateReducer,\n\t\t\t\t\tstateReducer\n\t\t\t\t) }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a value as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '10px' );\n *\n *   return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nconst ForwardedUnitControl = forwardRef( UnitControl );\n\nexport { parseUnit, useCustomUnits } from './utils';\nexport default ForwardedUnitControl;\n"]}
+{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["UnitControl","forwardedRef","__unstableStateReducer","stateReducer","state","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","noop","onUnitChange","size","style","unit","unitProp","units","unitsProp","CSS_UNITS","value","valueProp","props","initialUnit","setUnit","initial","fallback","refParsedValue","classes","handleOnChange","next","changeProps","join","handleOnUnitChange","data","nextValue","default","undefined","mayUpdateUnit","event","isNaN","Number","currentTarget","current","parsedValue","parsedUnit","toString","Array","isArray","find","option","handleOnBlur","handleOnKeyDown","keyCode","ENTER","unitControlStateReducer","action","type","inputControlActionTypes","COMMIT","inputSuffix","step","activeUnit","ForwardedUnitControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tKeyboardEvent,\n\tRef,\n\tSyntheticEvent,\n} from 'react';\nimport { noop, omit } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useMemo, useRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { ENTER } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { composeStateReducers } from '../input-control/reducer/reducer';\nimport { Root, ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedValue,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport type { StateReducer } from '../input-control/reducer/state';\n\nfunction UnitControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\tautoComplete = 'off',\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange = noop,\n\t\tonUnitChange = noop,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\t...props\n\t}: WordPressComponentProps< UnitControlProps, 'input', false >,\n\tforwardedRef: Ref< any >\n) {\n\tconst units = useMemo(\n\t\t() => getUnitsWithCurrentUnit( valueProp, unitProp, unitsProp ),\n\t\t[ valueProp, unitProp, unitsProp ]\n\t);\n\tconst [ value, initialUnit ] = getParsedValue( valueProp, unitProp, units );\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunitProp,\n\t\t{\n\t\t\tinitial: initialUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\t// Stores parsed value for hand-off in state reducer\n\tconst refParsedValue = useRef< string | null >( null );\n\n\tconst classes = classnames( 'components-unit-control', className );\n\n\tconst handleOnChange: UnitControlOnChangeCallback = (\n\t\tnext,\n\t\tchangeProps\n\t) => {\n\t\tif ( next === '' ) {\n\t\t\tonChange( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tnext = getValidParsedUnit( next, units, value, unit ).join( '' );\n\n\t\tonChange( next, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnext,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ value }${ next }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ next }`;\n\t\t}\n\n\t\tonChange( nextValue, changeProps );\n\t\tonUnitChange( next, changeProps );\n\n\t\tsetUnit( next );\n\t};\n\n\tconst mayUpdateUnit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tif ( ! isNaN( Number( event.currentTarget.value ) ) ) {\n\t\t\trefParsedValue.current = null;\n\t\t\treturn;\n\t\t}\n\t\tconst [ parsedValue, parsedUnit ] = getValidParsedUnit(\n\t\t\tevent.currentTarget.value,\n\t\t\tunits,\n\t\t\tvalue,\n\t\t\tunit\n\t\t);\n\n\t\trefParsedValue.current = parsedValue.toString();\n\n\t\tif ( isPressEnterToChange && parsedUnit !== unit ) {\n\t\t\tconst data = Array.isArray( units )\n\t\t\t\t? units.find( ( option ) => option.value === parsedUnit )\n\t\t\t\t: undefined;\n\t\t\tconst changeProps = { event, data };\n\n\t\t\tonChange( `${ parsedValue }${ parsedUnit }`, changeProps );\n\t\t\tonUnitChange( parsedUnit, changeProps );\n\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t};\n\n\tconst handleOnBlur: FocusEventHandler< HTMLInputElement > = mayUpdateUnit;\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { keyCode } = event;\n\t\tif ( keyCode === ENTER ) {\n\t\t\tmayUpdateUnit( event );\n\t\t}\n\t};\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param  state  State from InputControl\n\t * @param  action Action triggering state change\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst unitControlStateReducer: StateReducer = ( state, action ) => {\n\t\t/*\n\t\t * On commits (when pressing ENTER and on blur if\n\t\t * isPressEnterToChange is true), if a parse has been performed\n\t\t * then use that result to update the state.\n\t\t */\n\t\tif ( action.type === inputControlActionTypes.COMMIT ) {\n\t\t\tif ( refParsedValue.current !== null ) {\n\t\t\t\tstate.value = refParsedValue.current;\n\t\t\t\trefParsedValue.current = null;\n\t\t\t}\n\t\t}\n\n\t\treturn state;\n\t};\n\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<Root className=\"components-unit-control-wrapper\" style={ style }>\n\t\t\t<ValueInput\n\t\t\t\taria-label={ label }\n\t\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...omit( props, [ 'children' ] ) }\n\t\t\t\tautoComplete={ autoComplete }\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tlabel={ label }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\t\tonChange={ handleOnChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ inputSuffix }\n\t\t\t\tvalue={ value }\n\t\t\t\tstep={ step }\n\t\t\t\t__unstableStateReducer={ composeStateReducers(\n\t\t\t\t\tunitControlStateReducer,\n\t\t\t\t\tstateReducer\n\t\t\t\t) }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a value as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '10px' );\n *\n *   return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nconst ForwardedUnitControl = forwardRef( UnitControl );\n\nexport { parseUnit, useCustomUnits } from './utils';\nexport default ForwardedUnitControl;\n"]}