@wordpress/components 26.0.1-next.5a1d1283.0 → 26.0.1

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

@@ -1 +1 @@
-{"version":3,"names":["css","StyledField","BaseControlField","StyledHelp","BaseControlHelp","Wrapper","BaseControlWrapper","LabelWrapper","COLORS","CONFIG","rtl","space","toolsPanelGrid","columns","process","env","NODE_ENV","spacing","item","fullWidth","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","ToolsPanel","borderWidth","gray","ToolsPanelWithInnerWrapper","ToolsPanelHiddenInnerWrapper","ToolsPanelHeader","ToolsPanelHeading","ToolsPanelItem","ToolsPanelItemPlaceholder","DropdownMenu","ResetLabel","_styled","target","label","theme","accentDarker10","marginLeft","DefaultControlsItem"],"sources":["@wordpress/components/src/tools-panel/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tStyledField as BaseControlField,\n\tStyledHelp as BaseControlHelp,\n\tWrapper as BaseControlWrapper,\n} from '../base-control/styles/base-control-styles';\nimport { LabelWrapper } from '../input-control/styles/input-control-styles';\nimport { COLORS, CONFIG, rtl } from '../utils';\nimport { space } from '../ui/utils/space';\n\nconst toolsPanelGrid = {\n\tcolumns: ( columns: number ) => css`\n\t\tgrid-template-columns: ${ `repeat( ${ columns }, minmax(0, 1fr) )` };\n\t`,\n\tspacing: css`\n\t\tcolumn-gap: ${ space( 2 ) };\n\t\trow-gap: ${ space( 4 ) };\n\t`,\n\titem: {\n\t\tfullWidth: css`\n\t\t\tgrid-column: 1 / -1;\n\t\t`,\n\t},\n};\n\nexport const ToolsPanel = ( columns: number ) => css`\n\t${ toolsPanelGrid.columns( columns ) }\n\t${ toolsPanelGrid.spacing }\n\n\tborder-top: ${ CONFIG.borderWidth } solid ${ COLORS.gray[ 300 ] };\n\tmargin-top: -1px;\n\tpadding: ${ space( 4 ) };\n`;\n\n/**\n * Items injected into a ToolsPanel via a virtual bubbling slot will require\n * an inner dom element to be injected. The following rule allows for the\n * CSS grid display to be re-established.\n */\n\nexport const ToolsPanelWithInnerWrapper = ( columns: number ) => {\n\treturn css`\n\t\t> div:not( :first-of-type ) {\n\t\t\tdisplay: grid;\n\t\t\t${ toolsPanelGrid.columns( columns ) }\n\t\t\t${ toolsPanelGrid.spacing }\n\t\t\t${ toolsPanelGrid.item.fullWidth }\n\t\t}\n\t`;\n};\n\nexport const ToolsPanelHiddenInnerWrapper = css`\n\t> div:not( :first-of-type ) {\n\t\tdisplay: none;\n\t}\n`;\n\nexport const ToolsPanelHeader = css`\n\t${ toolsPanelGrid.item.fullWidth }\n\tgap: ${ space( 2 ) };\n\n\t/**\n\t * The targeting of dropdown menu component classes here is a temporary\n\t * measure only.\n\t *\n\t * The following styles should be replaced once the DropdownMenu has been\n\t * refactored and can be targeted via component interpolation.\n\t */\n\t.components-dropdown-menu {\n\t\tmargin: ${ space( -1 ) } 0;\n\t\tline-height: 0;\n\t}\n\t&&&& .components-dropdown-menu__toggle {\n\t\tpadding: 0;\n\t\tmin-width: ${ space( 6 ) };\n\t}\n`;\n\nexport const ToolsPanelHeading = css`\n\tfont-size: inherit;\n\tfont-weight: 500;\n\tline-height: normal;\n\n\t/* Required to meet specificity requirements to ensure zero margin */\n\t&& {\n\t\tmargin: 0;\n\t}\n`;\n\nexport const ToolsPanelItem = css`\n\t${ toolsPanelGrid.item.fullWidth }\n\n\t/* Clear spacing in and around controls added as panel items. */\n\t/* Remove when they can be addressed via context system. */\n\t& > div,\n\t& > fieldset {\n\t\tpadding-bottom: 0;\n\t\tmargin-bottom: 0;\n\t\tmax-width: 100%;\n\t}\n\n\t/* Remove BaseControl components margins and leave spacing to grid layout */\n\t&& ${ BaseControlWrapper } {\n\t\tmargin-bottom: 0;\n\n\t\t/**\n\t\t * To maintain proper spacing within a base control, the field's bottom\n\t\t * margin should only be removed when there is no help text included and\n\t\t * it is therefore the last-child.\n\t\t */\n\t\t${ BaseControlField }:last-child {\n\t\t\tmargin-bottom: 0;\n\t\t}\n\t}\n\n\t${ BaseControlHelp } {\n\t\tmargin-bottom: 0;\n\t}\n\n\t/**\n\t * Standardize InputControl and BaseControl labels with other labels when\n\t * inside ToolsPanel.\n\t *\n\t * This is a temporary fix until the different control components have their\n\t * labels normalized.\n\t */\n\t&& ${ LabelWrapper } {\n\t\tlabel {\n\t\t\tline-height: 1.4em;\n\t\t}\n\t}\n`;\n\nexport const ToolsPanelItemPlaceholder = css`\n\tdisplay: none;\n`;\n\nexport const DropdownMenu = css`\n\tmin-width: 200px;\n`;\n\nexport const ResetLabel = styled.span`\n\tcolor: ${ COLORS.theme.accentDarker10 };\n\tfont-size: 11px;\n\tfont-weight: 500;\n\tline-height: 1.4;\n\t${ rtl( { marginLeft: space( 3 ) } ) }\n\ttext-transform: uppercase;\n`;\n\nexport const DefaultControlsItem = css`\n\tcolor: ${ COLORS.gray[ 900 ] };\n\n\t&&[aria-disabled='true'] {\n\t\tcolor: ${ COLORS.gray[ 700 ] };\n\t\topacity: 1;\n\n\t\t&:hover {\n\t\t\tcolor: ${ COLORS.gray[ 700 ] };\n\t\t}\n\n\t\t${ ResetLabel } {\n\t\t\topacity: 0.3;\n\t\t}\n\t}\n`;\n"],"mappings":"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"}
+{"version":3,"names":["css","StyledField","BaseControlField","StyledHelp","BaseControlHelp","Wrapper","BaseControlWrapper","LabelWrapper","COLORS","CONFIG","rtl","space","toolsPanelGrid","columns","process","env","NODE_ENV","spacing","item","fullWidth","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","ToolsPanel","borderWidth","gray","ToolsPanelWithInnerWrapper","ToolsPanelHiddenInnerWrapper","ToolsPanelHeader","ToolsPanelHeading","ToolsPanelItem","ToolsPanelItemPlaceholder","DropdownMenu","ResetLabel","_styled","target","label","theme","accentDarker10","marginLeft","DefaultControlsItem"],"sources":["@wordpress/components/src/tools-panel/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tStyledField as BaseControlField,\n\tStyledHelp as BaseControlHelp,\n\tWrapper as BaseControlWrapper,\n} from '../base-control/styles/base-control-styles';\nimport { LabelWrapper } from '../input-control/styles/input-control-styles';\nimport { COLORS, CONFIG, rtl } from '../utils';\nimport { space } from '../utils/space';\n\nconst toolsPanelGrid = {\n\tcolumns: ( columns: number ) => css`\n\t\tgrid-template-columns: ${ `repeat( ${ columns }, minmax(0, 1fr) )` };\n\t`,\n\tspacing: css`\n\t\tcolumn-gap: ${ space( 2 ) };\n\t\trow-gap: ${ space( 4 ) };\n\t`,\n\titem: {\n\t\tfullWidth: css`\n\t\t\tgrid-column: 1 / -1;\n\t\t`,\n\t},\n};\n\nexport const ToolsPanel = ( columns: number ) => css`\n\t${ toolsPanelGrid.columns( columns ) }\n\t${ toolsPanelGrid.spacing }\n\n\tborder-top: ${ CONFIG.borderWidth } solid ${ COLORS.gray[ 300 ] };\n\tmargin-top: -1px;\n\tpadding: ${ space( 4 ) };\n`;\n\n/**\n * Items injected into a ToolsPanel via a virtual bubbling slot will require\n * an inner dom element to be injected. The following rule allows for the\n * CSS grid display to be re-established.\n */\n\nexport const ToolsPanelWithInnerWrapper = ( columns: number ) => {\n\treturn css`\n\t\t> div:not( :first-of-type ) {\n\t\t\tdisplay: grid;\n\t\t\t${ toolsPanelGrid.columns( columns ) }\n\t\t\t${ toolsPanelGrid.spacing }\n\t\t\t${ toolsPanelGrid.item.fullWidth }\n\t\t}\n\t`;\n};\n\nexport const ToolsPanelHiddenInnerWrapper = css`\n\t> div:not( :first-of-type ) {\n\t\tdisplay: none;\n\t}\n`;\n\nexport const ToolsPanelHeader = css`\n\t${ toolsPanelGrid.item.fullWidth }\n\tgap: ${ space( 2 ) };\n\n\t/**\n\t * The targeting of dropdown menu component classes here is a temporary\n\t * measure only.\n\t *\n\t * The following styles should be replaced once the DropdownMenu has been\n\t * refactored and can be targeted via component interpolation.\n\t */\n\t.components-dropdown-menu {\n\t\tmargin: ${ space( -1 ) } 0;\n\t\tline-height: 0;\n\t}\n\t&&&& .components-dropdown-menu__toggle {\n\t\tpadding: 0;\n\t\tmin-width: ${ space( 6 ) };\n\t}\n`;\n\nexport const ToolsPanelHeading = css`\n\tfont-size: inherit;\n\tfont-weight: 500;\n\tline-height: normal;\n\n\t/* Required to meet specificity requirements to ensure zero margin */\n\t&& {\n\t\tmargin: 0;\n\t}\n`;\n\nexport const ToolsPanelItem = css`\n\t${ toolsPanelGrid.item.fullWidth }\n\n\t/* Clear spacing in and around controls added as panel items. */\n\t/* Remove when they can be addressed via context system. */\n\t& > div,\n\t& > fieldset {\n\t\tpadding-bottom: 0;\n\t\tmargin-bottom: 0;\n\t\tmax-width: 100%;\n\t}\n\n\t/* Remove BaseControl components margins and leave spacing to grid layout */\n\t&& ${ BaseControlWrapper } {\n\t\tmargin-bottom: 0;\n\n\t\t/**\n\t\t * To maintain proper spacing within a base control, the field's bottom\n\t\t * margin should only be removed when there is no help text included and\n\t\t * it is therefore the last-child.\n\t\t */\n\t\t${ BaseControlField }:last-child {\n\t\t\tmargin-bottom: 0;\n\t\t}\n\t}\n\n\t${ BaseControlHelp } {\n\t\tmargin-bottom: 0;\n\t}\n\n\t/**\n\t * Standardize InputControl and BaseControl labels with other labels when\n\t * inside ToolsPanel.\n\t *\n\t * This is a temporary fix until the different control components have their\n\t * labels normalized.\n\t */\n\t&& ${ LabelWrapper } {\n\t\tlabel {\n\t\t\tline-height: 1.4em;\n\t\t}\n\t}\n`;\n\nexport const ToolsPanelItemPlaceholder = css`\n\tdisplay: none;\n`;\n\nexport const DropdownMenu = css`\n\tmin-width: 200px;\n`;\n\nexport const ResetLabel = styled.span`\n\tcolor: ${ COLORS.theme.accentDarker10 };\n\tfont-size: 11px;\n\tfont-weight: 500;\n\tline-height: 1.4;\n\t${ rtl( { marginLeft: space( 3 ) } ) }\n\ttext-transform: uppercase;\n`;\n\nexport const DefaultControlsItem = css`\n\tcolor: ${ COLORS.gray[ 900 ] };\n\n\t&&[aria-disabled='true'] {\n\t\tcolor: ${ COLORS.gray[ 700 ] };\n\t\topacity: 1;\n\n\t\t&:hover {\n\t\t\tcolor: ${ COLORS.gray[ 700 ] };\n\t\t}\n\n\t\t${ ResetLabel } {\n\t\t\topacity: 0.3;\n\t\t}\n\t}\n`;\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * External dependencies
  */
@@ -10,7 +10,7 @@ import ToolsPanelHeader from '../tools-panel-header';
 import { ToolsPanelContext } from '../context';
 import { useToolsPanel } from './hook';
 import { Grid } from '../../grid';
-import { contextConnect } from '../../ui/context';
+import { contextConnect } from '../../context';
 const UnconnectedToolsPanel = (props, forwardedRef) => {
   const {
     children,
@@ -19,6 +19,7 @@ const UnconnectedToolsPanel = (props, forwardedRef) => {
     resetAllItems,
     toggleItem,
     headingLevel,
+    dropdownMenuProps,
     ...toolsPanelProps
   } = useToolsPanel(props);
   return createElement(Grid, {
@@ -31,7 +32,8 @@ const UnconnectedToolsPanel = (props, forwardedRef) => {
     label: label,
     resetAll: resetAllItems,
     toggleItem: toggleItem,
-    headingLevel: headingLevel
+    headingLevel: headingLevel,
+    dropdownMenuProps: dropdownMenuProps
   }), children));
 };
 

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

@@ -1 +1 @@
-{"version":3,"names":["ToolsPanelHeader","ToolsPanelContext","useToolsPanel","Grid","contextConnect","UnconnectedToolsPanel","props","forwardedRef","children","label","panelContext","resetAllItems","toggleItem","headingLevel","toolsPanelProps","createElement","columns","ref","Provider","value","resetAll","ToolsPanel"],"sources":["@wordpress/components/src/tools-panel/tools-panel/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ToolsPanelHeader from '../tools-panel-header';\nimport { ToolsPanelContext } from '../context';\nimport { useToolsPanel } from './hook';\nimport { Grid } from '../../grid';\nimport type { WordPressComponentProps } from '../../ui/context';\nimport { contextConnect } from '../../ui/context';\nimport type { ToolsPanelProps } from '../types';\n\nconst UnconnectedToolsPanel = (\n\tprops: WordPressComponentProps< ToolsPanelProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tchildren,\n\t\tlabel,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\theadingLevel,\n\t\t...toolsPanelProps\n\t} = useToolsPanel( props );\n\n\treturn (\n\t\t<Grid { ...toolsPanelProps } columns={ 2 } ref={ forwardedRef }>\n\t\t\t<ToolsPanelContext.Provider value={ panelContext }>\n\t\t\t\t<ToolsPanelHeader\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tresetAll={ resetAllItems }\n\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t/>\n\t\t\t\t{ children }\n\t\t\t</ToolsPanelContext.Provider>\n\t\t</Grid>\n\t);\n};\n\n/**\n * The `ToolsPanel` is a container component that displays its children preceded\n * by a header. The header includes a dropdown menu which is automatically\n * generated from the panel's inner `ToolsPanelItems`.\n *\n * ```jsx\n * import { __ } from '@wordpress/i18n';\n * import {\n *   __experimentalToolsPanel as ToolsPanel,\n *   __experimentalToolsPanelItem as ToolsPanelItem,\n *   __experimentalUnitControl as UnitControl\n * } from '@wordpress/components';\n *\n * function Example() {\n *   const [ height, setHeight ] = useState();\n *   const [ width, setWidth ] = useState();\n *\n *   const resetAll = () => {\n *     setHeight();\n *     setWidth();\n *   }\n *\n *   return (\n *     <ToolsPanel label={ __( 'Dimensions' ) } resetAll={ resetAll }>\n *       <ToolsPanelItem\n *         hasValue={ () => !! height }\n *         label={ __( 'Height' ) }\n *         onDeselect={ () => setHeight() }\n *       >\n *         <UnitControl\n *           label={ __( 'Height' ) }\n *           onChange={ setHeight }\n *           value={ height }\n *         />\n *       </ToolsPanelItem>\n *       <ToolsPanelItem\n *         hasValue={ () => !! width }\n *         label={ __( 'Width' ) }\n *         onDeselect={ () => setWidth() }\n *       >\n *         <UnitControl\n *           label={ __( 'Width' ) }\n *           onChange={ setWidth }\n *           value={ width }\n *         />\n *       </ToolsPanelItem>\n *     </ToolsPanel>\n *   );\n * }\n * ```\n */\nexport const ToolsPanel = contextConnect( UnconnectedToolsPanel, 'ToolsPanel' );\n\nexport default ToolsPanel;\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,gBAAgB,MAAM,uBAAuB;AACpD,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,aAAa,QAAQ,QAAQ;AACtC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,kBAAkB;AAGjD,MAAMC,qBAAqB,GAAGA,CAC7BC,KAAwD,EACxDC,YAAiC,KAC7B;EACJ,MAAM;IACLC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZC,aAAa;IACbC,UAAU;IACVC,YAAY;IACZ,GAAGC;EACJ,CAAC,GAAGZ,aAAa,CAAEI,KAAM,CAAC;EAE1B,OACCS,aAAA,CAACZ,IAAI;IAAA,GAAMW,eAAe;IAAGE,OAAO,EAAG,CAAG;IAACC,GAAG,EAAGV;EAAc,GAC9DQ,aAAA,CAACd,iBAAiB,CAACiB,QAAQ;IAACC,KAAK,EAAGT;EAAc,GACjDK,aAAA,CAACf,gBAAgB;IAChBS,KAAK,EAAGA,KAAO;IACfW,QAAQ,EAAGT,aAAe;IAC1BC,UAAU,EAAGA,UAAY;IACzBC,YAAY,EAAGA;EAAc,CAC7B,CAAC,EACAL,QACyB,CACvB,CAAC;AAET,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMa,UAAU,GAAGjB,cAAc,CAAEC,qBAAqB,EAAE,YAAa,CAAC;AAE/E,eAAegB,UAAU"}
+{"version":3,"names":["ToolsPanelHeader","ToolsPanelContext","useToolsPanel","Grid","contextConnect","UnconnectedToolsPanel","props","forwardedRef","children","label","panelContext","resetAllItems","toggleItem","headingLevel","dropdownMenuProps","toolsPanelProps","createElement","columns","ref","Provider","value","resetAll","ToolsPanel"],"sources":["@wordpress/components/src/tools-panel/tools-panel/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ToolsPanelHeader from '../tools-panel-header';\nimport { ToolsPanelContext } from '../context';\nimport { useToolsPanel } from './hook';\nimport { Grid } from '../../grid';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport type { ToolsPanelProps } from '../types';\n\nconst UnconnectedToolsPanel = (\n\tprops: WordPressComponentProps< ToolsPanelProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tchildren,\n\t\tlabel,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\theadingLevel,\n\t\tdropdownMenuProps,\n\t\t...toolsPanelProps\n\t} = useToolsPanel( props );\n\n\treturn (\n\t\t<Grid { ...toolsPanelProps } columns={ 2 } ref={ forwardedRef }>\n\t\t\t<ToolsPanelContext.Provider value={ panelContext }>\n\t\t\t\t<ToolsPanelHeader\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tresetAll={ resetAllItems }\n\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t/>\n\t\t\t\t{ children }\n\t\t\t</ToolsPanelContext.Provider>\n\t\t</Grid>\n\t);\n};\n\n/**\n * The `ToolsPanel` is a container component that displays its children preceded\n * by a header. The header includes a dropdown menu which is automatically\n * generated from the panel's inner `ToolsPanelItems`.\n *\n * ```jsx\n * import { __ } from '@wordpress/i18n';\n * import {\n *   __experimentalToolsPanel as ToolsPanel,\n *   __experimentalToolsPanelItem as ToolsPanelItem,\n *   __experimentalUnitControl as UnitControl\n * } from '@wordpress/components';\n *\n * function Example() {\n *   const [ height, setHeight ] = useState();\n *   const [ width, setWidth ] = useState();\n *\n *   const resetAll = () => {\n *     setHeight();\n *     setWidth();\n *   }\n *\n *   return (\n *     <ToolsPanel label={ __( 'Dimensions' ) } resetAll={ resetAll }>\n *       <ToolsPanelItem\n *         hasValue={ () => !! height }\n *         label={ __( 'Height' ) }\n *         onDeselect={ () => setHeight() }\n *       >\n *         <UnitControl\n *           label={ __( 'Height' ) }\n *           onChange={ setHeight }\n *           value={ height }\n *         />\n *       </ToolsPanelItem>\n *       <ToolsPanelItem\n *         hasValue={ () => !! width }\n *         label={ __( 'Width' ) }\n *         onDeselect={ () => setWidth() }\n *       >\n *         <UnitControl\n *           label={ __( 'Width' ) }\n *           onChange={ setWidth }\n *           value={ width }\n *         />\n *       </ToolsPanelItem>\n *     </ToolsPanel>\n *   );\n * }\n * ```\n */\nexport const ToolsPanel = contextConnect( UnconnectedToolsPanel, 'ToolsPanel' );\n\nexport default ToolsPanel;\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,gBAAgB,MAAM,uBAAuB;AACpD,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,aAAa,QAAQ,QAAQ;AACtC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAG9C,MAAMC,qBAAqB,GAAGA,CAC7BC,KAAwD,EACxDC,YAAiC,KAC7B;EACJ,MAAM;IACLC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZC,aAAa;IACbC,UAAU;IACVC,YAAY;IACZC,iBAAiB;IACjB,GAAGC;EACJ,CAAC,GAAGb,aAAa,CAAEI,KAAM,CAAC;EAE1B,OACCU,aAAA,CAACb,IAAI;IAAA,GAAMY,eAAe;IAAGE,OAAO,EAAG,CAAG;IAACC,GAAG,EAAGX;EAAc,GAC9DS,aAAA,CAACf,iBAAiB,CAACkB,QAAQ;IAACC,KAAK,EAAGV;EAAc,GACjDM,aAAA,CAAChB,gBAAgB;IAChBS,KAAK,EAAGA,KAAO;IACfY,QAAQ,EAAGV,aAAe;IAC1BC,UAAU,EAAGA,UAAY;IACzBC,YAAY,EAAGA,YAAc;IAC7BC,iBAAiB,EAAGA;EAAmB,CACvC,CAAC,EACAN,QACyB,CACvB,CAAC;AAET,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMc,UAAU,GAAGlB,cAAc,CAAEC,qBAAqB,EAAE,YAAa,CAAC;AAE/E,eAAeiB,UAAU"}

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

@@ -7,7 +7,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from '@wordpress/el
  * Internal dependencies
  */
 import * as styles from '../styles';
-import { useContextSystem } from '../../ui/context';
+import { useContextSystem } from '../../context';
 import { useCx } from '../../utils/hooks/use-cx';
 const DEFAULT_COLUMNS = 2;
 const generateMenuItems = ({

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

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useEffect","useMemo","useRef","useState","styles","useContextSystem","useCx","DEFAULT_COLUMNS","generateMenuItems","panelItems","shouldReset","currentMenuItems","menuItemOrder","newMenuItems","default","optional","menuItems","forEach","hasValue","isShownByDefault","label","group","existingItemValue","value","key","hasOwnProperty","Object","keys","isMenuItemTypeEmpty","obj","length","useToolsPanel","props","className","headingLevel","resetAll","panelId","hasInnerWrapper","shouldRenderPlaceholderItems","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","otherProps","isResetting","wasResetting","current","setPanelItems","setMenuItemOrder","resetAllFilters","setResetAllFilters","registerPanelItem","item","items","newItems","existingIndex","findIndex","oldItem","splice","includes","deregisterPanelItem","index","registerResetAllFilter","newFilter","filters","deregisterResetAllFilter","filterToRemove","filter","setMenuItems","prevState","flagItemCustomization","newState","areAllOptionalControlsHidden","setAreAllOptionalControlsHidden","allControlsHidden","entries","some","isSelected","cx","classes","wrapperStyle","ToolsPanelWithInnerWrapper","emptyStyle","ToolsPanelHiddenInnerWrapper","ToolsPanel","toggleItem","currentItem","find","menuGroup","resetAllItems","resetMenuItems","getFirstVisibleItemLabel","optionalItems","firstItem","firstDisplayedItem","lastDisplayedItem","reverse","panelContext","hasMenuItems"],"sources":["@wordpress/components/src/tools-panel/tools-panel/hook.ts"],"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 type { WordPressComponentProps } from '../../ui/context';\nimport { useContextSystem } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type {\n\tToolsPanelItem,\n\tToolsPanelMenuItemKey,\n\tToolsPanelMenuItems,\n\tToolsPanelMenuItemsConfig,\n\tToolsPanelProps,\n\tResetAllFilter,\n} from '../types';\n\nconst DEFAULT_COLUMNS = 2;\n\nconst generateMenuItems = ( {\n\tpanelItems,\n\tshouldReset,\n\tcurrentMenuItems,\n\tmenuItemOrder,\n}: ToolsPanelMenuItemsConfig ) => {\n\tconst newMenuItems: ToolsPanelMenuItems = { default: {}, optional: {} };\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 has already been flagged as customized\n\t\t// (for default controls), or toggled on (for optional controls), do not\n\t\t// overwrite its value as those controls would lose that state.\n\t\tconst existingItemValue = currentMenuItems?.[ group ]?.[ label ];\n\t\tconst value = existingItemValue ? existingItemValue : hasValue();\n\n\t\tnewMenuItems[ group ][ label ] = shouldReset ? false : value;\n\t} );\n\n\t// Loop the known, previously registered items first to maintain menu order.\n\tmenuItemOrder.forEach( ( key ) => {\n\t\tif ( newMenuItems.default.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.default[ key ] = newMenuItems.default[ key ];\n\t\t}\n\n\t\tif ( newMenuItems.optional.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.optional[ key ] = newMenuItems.optional[ key ];\n\t\t}\n\t} );\n\n\t// Loop newMenuItems object adding any that aren't in the known items order.\n\tObject.keys( newMenuItems.default ).forEach( ( key ) => {\n\t\tif ( ! menuItems.default.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.default[ key ] = newMenuItems.default[ key ];\n\t\t}\n\t} );\n\n\tObject.keys( newMenuItems.optional ).forEach( ( key ) => {\n\t\tif ( ! menuItems.optional.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.optional[ key ] = newMenuItems.optional[ key ];\n\t\t}\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\theadingLevel = 2,\n\t\tresetAll,\n\t\tpanelId,\n\t\thasInnerWrapper = false,\n\t\tshouldRenderPlaceholderItems = false,\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\tconst [ menuItemOrder, setMenuItemOrder ] = useState< string[] >( [] );\n\tconst [ resetAllFilters, setResetAllFilters ] = useState<\n\t\tResetAllFilter[]\n\t>( [] );\n\n\tconst registerPanelItem = useCallback(\n\t\t( item: ToolsPanelItem ) => {\n\t\t\t// Add item to panel items.\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\n\t\t\t// Track the initial order of item registration. This is used for\n\t\t\t// maintaining menu item order later.\n\t\t\tsetMenuItemOrder( ( items ) => {\n\t\t\t\tif ( items.includes( item.label ) ) {\n\t\t\t\t\treturn items;\n\t\t\t\t}\n\n\t\t\t\treturn [ ...items, item.label ];\n\t\t\t} );\n\t\t},\n\t\t[ setPanelItems, setMenuItemOrder ]\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\tconst registerResetAllFilter = useCallback(\n\t\t( newFilter: ResetAllFilter ) => {\n\t\t\tsetResetAllFilters( ( filters ) => {\n\t\t\t\treturn [ ...filters, newFilter ];\n\t\t\t} );\n\t\t},\n\t\t[ setResetAllFilters ]\n\t);\n\n\tconst deregisterResetAllFilter = useCallback(\n\t\t( filterToRemove: ResetAllFilter ) => {\n\t\t\tsetResetAllFilters( ( filters ) => {\n\t\t\t\treturn filters.filter(\n\t\t\t\t\t( filter ) => filter !== filterToRemove\n\t\t\t\t);\n\t\t\t} );\n\t\t},\n\t\t[ setResetAllFilters ]\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\tmenuItemOrder,\n\t\t\t} );\n\t\t\treturn items;\n\t\t} );\n\t}, [ panelItems, setMenuItems, menuItemOrder ] );\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 [ areAllOptionalControlsHidden, setAreAllOptionalControlsHidden ] =\n\t\tuseState( 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(\n\t\t\tstyles.ToolsPanel( DEFAULT_COLUMNS ),\n\t\t\twrapperStyle,\n\t\t\temptyStyle,\n\t\t\tclassName\n\t\t);\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\t\t\tresetAll( resetAllFilters );\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\tmenuItemOrder,\n\t\t\tshouldReset: true,\n\t\t} );\n\t\tsetMenuItems( resetMenuItems );\n\t}, [ panelItems, resetAllFilters, resetAll, setMenuItems, menuItemOrder ] );\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\tderegisterResetAllFilter,\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\tregisterResetAllFilter,\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\tderegisterResetAllFilter,\n\t\t\tfirstDisplayedItem,\n\t\t\tflagItemCustomization,\n\t\t\tlastDisplayedItem,\n\t\t\tmenuItems,\n\t\t\tpanelId,\n\t\t\tpanelItems,\n\t\t\tregisterResetAllFilter,\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\theadingLevel,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\tclassName: classes,\n\t};\n}\n"],"mappings":"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"}
+{"version":3,"names":["useCallback","useEffect","useMemo","useRef","useState","styles","useContextSystem","useCx","DEFAULT_COLUMNS","generateMenuItems","panelItems","shouldReset","currentMenuItems","menuItemOrder","newMenuItems","default","optional","menuItems","forEach","hasValue","isShownByDefault","label","group","existingItemValue","value","key","hasOwnProperty","Object","keys","isMenuItemTypeEmpty","obj","length","useToolsPanel","props","className","headingLevel","resetAll","panelId","hasInnerWrapper","shouldRenderPlaceholderItems","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","otherProps","isResetting","wasResetting","current","setPanelItems","setMenuItemOrder","resetAllFilters","setResetAllFilters","registerPanelItem","item","items","newItems","existingIndex","findIndex","oldItem","splice","includes","deregisterPanelItem","index","registerResetAllFilter","newFilter","filters","deregisterResetAllFilter","filterToRemove","filter","setMenuItems","prevState","flagItemCustomization","newState","areAllOptionalControlsHidden","setAreAllOptionalControlsHidden","allControlsHidden","entries","some","isSelected","cx","classes","wrapperStyle","ToolsPanelWithInnerWrapper","emptyStyle","ToolsPanelHiddenInnerWrapper","ToolsPanel","toggleItem","currentItem","find","menuGroup","resetAllItems","resetMenuItems","getFirstVisibleItemLabel","optionalItems","firstItem","firstDisplayedItem","lastDisplayedItem","reverse","panelContext","hasMenuItems"],"sources":["@wordpress/components/src/tools-panel/tools-panel/hook.ts"],"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 type { WordPressComponentProps } from '../../context';\nimport { useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type {\n\tToolsPanelItem,\n\tToolsPanelMenuItemKey,\n\tToolsPanelMenuItems,\n\tToolsPanelMenuItemsConfig,\n\tToolsPanelProps,\n\tResetAllFilter,\n} from '../types';\n\nconst DEFAULT_COLUMNS = 2;\n\nconst generateMenuItems = ( {\n\tpanelItems,\n\tshouldReset,\n\tcurrentMenuItems,\n\tmenuItemOrder,\n}: ToolsPanelMenuItemsConfig ) => {\n\tconst newMenuItems: ToolsPanelMenuItems = { default: {}, optional: {} };\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 has already been flagged as customized\n\t\t// (for default controls), or toggled on (for optional controls), do not\n\t\t// overwrite its value as those controls would lose that state.\n\t\tconst existingItemValue = currentMenuItems?.[ group ]?.[ label ];\n\t\tconst value = existingItemValue ? existingItemValue : hasValue();\n\n\t\tnewMenuItems[ group ][ label ] = shouldReset ? false : value;\n\t} );\n\n\t// Loop the known, previously registered items first to maintain menu order.\n\tmenuItemOrder.forEach( ( key ) => {\n\t\tif ( newMenuItems.default.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.default[ key ] = newMenuItems.default[ key ];\n\t\t}\n\n\t\tif ( newMenuItems.optional.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.optional[ key ] = newMenuItems.optional[ key ];\n\t\t}\n\t} );\n\n\t// Loop newMenuItems object adding any that aren't in the known items order.\n\tObject.keys( newMenuItems.default ).forEach( ( key ) => {\n\t\tif ( ! menuItems.default.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.default[ key ] = newMenuItems.default[ key ];\n\t\t}\n\t} );\n\n\tObject.keys( newMenuItems.optional ).forEach( ( key ) => {\n\t\tif ( ! menuItems.optional.hasOwnProperty( key ) ) {\n\t\t\tmenuItems.optional[ key ] = newMenuItems.optional[ key ];\n\t\t}\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\theadingLevel = 2,\n\t\tresetAll,\n\t\tpanelId,\n\t\thasInnerWrapper = false,\n\t\tshouldRenderPlaceholderItems = false,\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\tconst [ menuItemOrder, setMenuItemOrder ] = useState< string[] >( [] );\n\tconst [ resetAllFilters, setResetAllFilters ] = useState<\n\t\tResetAllFilter[]\n\t>( [] );\n\n\tconst registerPanelItem = useCallback(\n\t\t( item: ToolsPanelItem ) => {\n\t\t\t// Add item to panel items.\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\n\t\t\t// Track the initial order of item registration. This is used for\n\t\t\t// maintaining menu item order later.\n\t\t\tsetMenuItemOrder( ( items ) => {\n\t\t\t\tif ( items.includes( item.label ) ) {\n\t\t\t\t\treturn items;\n\t\t\t\t}\n\n\t\t\t\treturn [ ...items, item.label ];\n\t\t\t} );\n\t\t},\n\t\t[ setPanelItems, setMenuItemOrder ]\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\tconst registerResetAllFilter = useCallback(\n\t\t( newFilter: ResetAllFilter ) => {\n\t\t\tsetResetAllFilters( ( filters ) => {\n\t\t\t\treturn [ ...filters, newFilter ];\n\t\t\t} );\n\t\t},\n\t\t[ setResetAllFilters ]\n\t);\n\n\tconst deregisterResetAllFilter = useCallback(\n\t\t( filterToRemove: ResetAllFilter ) => {\n\t\t\tsetResetAllFilters( ( filters ) => {\n\t\t\t\treturn filters.filter(\n\t\t\t\t\t( filter ) => filter !== filterToRemove\n\t\t\t\t);\n\t\t\t} );\n\t\t},\n\t\t[ setResetAllFilters ]\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\tmenuItemOrder,\n\t\t\t} );\n\t\t\treturn items;\n\t\t} );\n\t}, [ panelItems, setMenuItems, menuItemOrder ] );\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 [ areAllOptionalControlsHidden, setAreAllOptionalControlsHidden ] =\n\t\tuseState( 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(\n\t\t\tstyles.ToolsPanel( DEFAULT_COLUMNS ),\n\t\t\twrapperStyle,\n\t\t\temptyStyle,\n\t\t\tclassName\n\t\t);\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\t\t\tresetAll( resetAllFilters );\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\tmenuItemOrder,\n\t\t\tshouldReset: true,\n\t\t} );\n\t\tsetMenuItems( resetMenuItems );\n\t}, [ panelItems, resetAllFilters, resetAll, setMenuItems, menuItemOrder ] );\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\tderegisterResetAllFilter,\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\tregisterResetAllFilter,\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\tderegisterResetAllFilter,\n\t\t\tfirstDisplayedItem,\n\t\t\tflagItemCustomization,\n\t\t\tlastDisplayedItem,\n\t\t\tmenuItems,\n\t\t\tpanelId,\n\t\t\tpanelItems,\n\t\t\tregisterResetAllFilter,\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\theadingLevel,\n\t\tpanelContext,\n\t\tresetAllItems,\n\t\ttoggleItem,\n\t\tclassName: classes,\n\t};\n}\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */
@@ -19,7 +19,7 @@ import MenuItem from '../../menu-item';
 import { HStack } from '../../h-stack';
 import { Heading } from '../../heading';
 import { useToolsPanelHeader } from './hook';
-import { contextConnect } from '../../ui/context';
+import { contextConnect } from '../../context';
 import { ResetLabel } from '../styles';
 const DefaultControlsGroup = ({
   itemClassName,
@@ -32,9 +32,7 @@ const DefaultControlsGroup = ({
   const resetSuffix = createElement(ResetLabel, {
     "aria-hidden": true
   }, __('Reset'));
-  return createElement(MenuGroup, {
-    label: __('Defaults')
-  }, items.map(([label, hasValue]) => {
+  return createElement(Fragment, null, items.map(([label, hasValue]) => {
     if (hasValue) {
       return createElement(MenuItem, {
         key: label,
@@ -54,6 +52,7 @@ const DefaultControlsGroup = ({
     }
     return createElement(MenuItem, {
       key: label,
+      icon: check,
       className: itemClassName,
       role: "menuitemcheckbox",
       isSelected: true,
@@ -68,9 +67,7 @@ const OptionalControlsGroup = ({
   if (!items.length) {
     return null;
   }
-  return createElement(MenuGroup, {
-    label: __('Tools')
-  }, items.map(([label, isSelected]) => {
+  return createElement(Fragment, null, items.map(([label, isSelected]) => {
     const itemLabel = isSelected ? sprintf(
     // translators: %s: The name of the control being hidden and reset e.g. "Padding".
     __('Hide and reset %s'), label) : sprintf(
@@ -109,6 +106,7 @@ const ToolsPanelHeader = (props, forwardedRef) => {
     menuItems,
     resetAll,
     toggleItem,
+    dropdownMenuProps,
     ...headerProps
   } = useToolsPanelHeader(props);
   if (!labelText) {
@@ -129,6 +127,7 @@ const ToolsPanelHeader = (props, forwardedRef) => {
     level: headingLevel,
     className: headingClassName
   }, labelText), hasMenuItems && createElement(DropdownMenu, {
+    ...dropdownMenuProps,
     icon: dropDownMenuIcon,
     label: dropDownMenuLabelText,
     menuProps: {
@@ -138,14 +137,16 @@ const ToolsPanelHeader = (props, forwardedRef) => {
       isSmall: true,
       describedBy: dropdownMenuDescriptionText
     }
-  }, () => createElement(Fragment, null, createElement(DefaultControlsGroup, {
+  }, () => createElement(Fragment, null, createElement(MenuGroup, {
+    label: labelText
+  }, createElement(DefaultControlsGroup, {
     items: defaultItems,
     toggleItem: toggleItem,
     itemClassName: defaultControlsItemClassName
   }), createElement(OptionalControlsGroup, {
     items: optionalItems,
     toggleItem: toggleItem
-  }), createElement(MenuGroup, null, createElement(MenuItem, {
+  })), createElement(MenuGroup, null, createElement(MenuItem, {
     "aria-disabled": !canResetAll
     // @ts-expect-error - TODO: If this "tertiary" style is something we really want to allow on MenuItem,
     // we should rename it and explicitly allow it as an official API. All the other Button variants

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

@@ -1 +1 @@
-{"version":3,"names":["speak","check","moreVertical","plus","__","_x","sprintf","DropdownMenu","MenuGroup","MenuItem","HStack","Heading","useToolsPanelHeader","contextConnect","ResetLabel","DefaultControlsGroup","itemClassName","items","toggleItem","length","resetSuffix","createElement","label","map","hasValue","key","className","role","onClick","suffix","isSelected","OptionalControlsGroup","itemLabel","icon","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","defaultControlsItemClassName","dropdownMenuClassName","hasMenuItems","headingClassName","headingLevel","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","dropDownMenuLabelText","dropdownMenuDescriptionText","undefined","canResetAll","some","ref","level","menuProps","toggleProps","isSmall","describedBy","Fragment","variant","ConnectedToolsPanelHeader"],"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { check, 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 type { WordPressComponentProps } from '../../ui/context';\nimport { contextConnect } from '../../ui/context';\nimport { ResetLabel } from '../styles';\nimport type {\n\tToolsPanelControlsGroupProps,\n\tToolsPanelHeaderProps,\n} from '../types';\n\nconst DefaultControlsGroup = ( {\n\titemClassName,\n\titems,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\tconst resetSuffix = <ResetLabel aria-hidden>{ __( 'Reset' ) }</ResetLabel>;\n\n\treturn (\n\t\t<MenuGroup label={ __( 'Defaults' ) }>\n\t\t\t{ items.map( ( [ label, hasValue ] ) => {\n\t\t\t\tif ( hasValue ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\t\tclassName={ itemClassName }\n\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\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\t__( 'Reset %s' ),\n\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\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\t\t\t__( '%s reset to default' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsuffix={ resetSuffix }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t);\n\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\tclassName={ itemClassName }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\taria-disabled\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\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup label={ __( 'Tools' ) }>\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 : null }\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\tif ( isSelected ) {\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\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\t\t\t__( '%s hidden and reset to default' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\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\t\t\t__( '%s is now visible' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ttoggleItem( label );\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: ForwardedRef< any >\n) => {\n\tconst {\n\t\tareAllOptionalControlsHidden,\n\t\tdefaultControlsItemClassName,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\theadingLevel = 2,\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 = sprintf(\n\t\t// translators: %s: The name of the tool e.g. \"Color\" or \"Typography\".\n\t\t_x( '%s options', 'Button label to reveal tool panel options' ),\n\t\tlabelText\n\t);\n\tconst dropdownMenuDescriptionText = areAllOptionalControlsHidden\n\t\t? __( 'All options are currently hidden' )\n\t\t: undefined;\n\n\tconst canResetAll = [ ...defaultItems, ...optionalItems ].some(\n\t\t( [ , isSelected ] ) => isSelected\n\t);\n\n\treturn (\n\t\t<HStack { ...headerProps } ref={ forwardedRef }>\n\t\t\t<Heading level={ headingLevel } 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={ {\n\t\t\t\t\t\tisSmall: true,\n\t\t\t\t\t\tdescribedBy: dropdownMenuDescriptionText,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ () => (\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\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t\titemClassName={ defaultControlsItemClassName }\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\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\taria-disabled={ ! canResetAll }\n\t\t\t\t\t\t\t\t\t// @ts-expect-error - TODO: If this \"tertiary\" style is something we really want to allow on MenuItem,\n\t\t\t\t\t\t\t\t\t// we should rename it and explicitly allow it as an official API. All the other Button variants\n\t\t\t\t\t\t\t\t\t// don't make sense in a MenuItem context, and should be disallowed.\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\tif ( canResetAll ) {\n\t\t\t\t\t\t\t\t\t\t\tresetAll();\n\t\t\t\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'All options reset' ),\n\t\t\t\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\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"],"mappings":"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"}
+{"version":3,"names":["speak","check","moreVertical","plus","__","_x","sprintf","DropdownMenu","MenuGroup","MenuItem","HStack","Heading","useToolsPanelHeader","contextConnect","ResetLabel","DefaultControlsGroup","itemClassName","items","toggleItem","length","resetSuffix","createElement","Fragment","map","label","hasValue","key","className","role","onClick","suffix","icon","isSelected","OptionalControlsGroup","itemLabel","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","defaultControlsItemClassName","dropdownMenuClassName","hasMenuItems","headingClassName","headingLevel","labelText","menuItems","resetAll","dropdownMenuProps","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","dropDownMenuLabelText","dropdownMenuDescriptionText","undefined","canResetAll","some","ref","level","menuProps","toggleProps","isSmall","describedBy","variant","ConnectedToolsPanelHeader"],"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { check, 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 type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { ResetLabel } from '../styles';\nimport type {\n\tToolsPanelControlsGroupProps,\n\tToolsPanelHeaderProps,\n} from '../types';\n\nconst DefaultControlsGroup = ( {\n\titemClassName,\n\titems,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\tconst resetSuffix = <ResetLabel aria-hidden>{ __( 'Reset' ) }</ResetLabel>;\n\n\treturn (\n\t\t<>\n\t\t\t{ items.map( ( [ label, hasValue ] ) => {\n\t\t\t\tif ( hasValue ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\t\tclassName={ itemClassName }\n\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\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\t__( 'Reset %s' ),\n\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\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\t\t\t__( '%s reset to default' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsuffix={ resetSuffix }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t);\n\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={ check }\n\t\t\t\t\t\tclassName={ itemClassName }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\taria-disabled\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</>\n\t);\n};\n\nconst OptionalControlsGroup = ( {\n\titems,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\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 : null }\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\tif ( isSelected ) {\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\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\t\t\t__( '%s hidden and reset to default' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\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\t\t\t__( '%s is now visible' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ttoggleItem( label );\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</>\n\t);\n};\n\nconst ToolsPanelHeader = (\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tareAllOptionalControlsHidden,\n\t\tdefaultControlsItemClassName,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\theadingLevel = 2,\n\t\tlabel: labelText,\n\t\tmenuItems,\n\t\tresetAll,\n\t\ttoggleItem,\n\t\tdropdownMenuProps,\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 = sprintf(\n\t\t// translators: %s: The name of the tool e.g. \"Color\" or \"Typography\".\n\t\t_x( '%s options', 'Button label to reveal tool panel options' ),\n\t\tlabelText\n\t);\n\tconst dropdownMenuDescriptionText = areAllOptionalControlsHidden\n\t\t? __( 'All options are currently hidden' )\n\t\t: undefined;\n\n\tconst canResetAll = [ ...defaultItems, ...optionalItems ].some(\n\t\t( [ , isSelected ] ) => isSelected\n\t);\n\n\treturn (\n\t\t<HStack { ...headerProps } ref={ forwardedRef }>\n\t\t\t<Heading level={ headingLevel } 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\t{ ...dropdownMenuProps }\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={ {\n\t\t\t\t\t\tisSmall: true,\n\t\t\t\t\t\tdescribedBy: dropdownMenuDescriptionText,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ () => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<MenuGroup label={ labelText }>\n\t\t\t\t\t\t\t\t<DefaultControlsGroup\n\t\t\t\t\t\t\t\t\titems={ defaultItems }\n\t\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t\t\titemClassName={\n\t\t\t\t\t\t\t\t\t\tdefaultControlsItemClassName\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<OptionalControlsGroup\n\t\t\t\t\t\t\t\t\titems={ optionalItems }\n\t\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</MenuGroup>\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\taria-disabled={ ! canResetAll }\n\t\t\t\t\t\t\t\t\t// @ts-expect-error - TODO: If this \"tertiary\" style is something we really want to allow on MenuItem,\n\t\t\t\t\t\t\t\t\t// we should rename it and explicitly allow it as an official API. All the other Button variants\n\t\t\t\t\t\t\t\t\t// don't make sense in a MenuItem context, and should be disallowed.\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\tif ( canResetAll ) {\n\t\t\t\t\t\t\t\t\t\t\tresetAll();\n\t\t\t\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'All options reset' ),\n\t\t\t\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\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"],"mappings":"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"}

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

@@ -8,7 +8,7 @@ import { useMemo } from '@wordpress/element';
  */
 import * as styles from '../styles';
 import { useToolsPanelContext } from '../context';
-import { useContextSystem } from '../../ui/context';
+import { useContextSystem } from '../../context';
 import { useCx } from '../../utils/hooks/use-cx';
 export function useToolsPanelHeader(props) {
   const {

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

@@ -1 +1 @@
-{"version":3,"names":["useMemo","styles","useToolsPanelContext","useContextSystem","useCx","useToolsPanelHeader","props","className","headingLevel","otherProps","cx","classes","ToolsPanelHeader","dropdownMenuClassName","DropdownMenu","headingClassName","ToolsPanelHeading","defaultControlsItemClassName","DefaultControlsItem","menuItems","hasMenuItems","areAllOptionalControlsHidden"],"sources":["@wordpress/components/src/tools-panel/tools-panel-header/hook.ts"],"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 type { WordPressComponentProps } from '../../ui/context';\nimport { useContextSystem } 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 {\n\t\tclassName,\n\t\theadingLevel = 2,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanelHeader' );\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 defaultControlsItemClassName = useMemo( () => {\n\t\treturn cx( styles.DefaultControlsItem );\n\t}, [ cx ] );\n\n\tconst { menuItems, hasMenuItems, areAllOptionalControlsHidden } =\n\t\tuseToolsPanelContext();\n\n\treturn {\n\t\t...otherProps,\n\t\tareAllOptionalControlsHidden,\n\t\tdefaultControlsItemClassName,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\theadingLevel,\n\t\tmenuItems,\n\t\tclassName: classes,\n\t};\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,oBAAoB;;AAE5C;AACA;AACA;AACA,OAAO,KAAKC,MAAM,MAAM,WAAW;AACnC,SAASC,oBAAoB,QAAQ,YAAY;AAEjD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SAASC,KAAK,QAAQ,0BAA0B;AAGhD,OAAO,SAASC,mBAAmBA,CAClCC,KAA6D,EAC5D;EACD,MAAM;IACLC,SAAS;IACTC,YAAY,GAAG,CAAC;IAChB,GAAGC;EACJ,CAAC,GAAGN,gBAAgB,CAAEG,KAAK,EAAE,kBAAmB,CAAC;EAEjD,MAAMI,EAAE,GAAGN,KAAK,CAAC,CAAC;EAClB,MAAMO,OAAO,GAAGX,OAAO,CAAE,MAAM;IAC9B,OAAOU,EAAE,CAAET,MAAM,CAACW,gBAAgB,EAAEL,SAAU,CAAC;EAChD,CAAC,EAAE,CAAEA,SAAS,EAAEG,EAAE,CAAG,CAAC;EAEtB,MAAMG,qBAAqB,GAAGb,OAAO,CAAE,MAAM;IAC5C,OAAOU,EAAE,CAAET,MAAM,CAACa,YAAa,CAAC;EACjC,CAAC,EAAE,CAAEJ,EAAE,CAAG,CAAC;EAEX,MAAMK,gBAAgB,GAAGf,OAAO,CAAE,MAAM;IACvC,OAAOU,EAAE,CAAET,MAAM,CAACe,iBAAkB,CAAC;EACtC,CAAC,EAAE,CAAEN,EAAE,CAAG,CAAC;EAEX,MAAMO,4BAA4B,GAAGjB,OAAO,CAAE,MAAM;IACnD,OAAOU,EAAE,CAAET,MAAM,CAACiB,mBAAoB,CAAC;EACxC,CAAC,EAAE,CAAER,EAAE,CAAG,CAAC;EAEX,MAAM;IAAES,SAAS;IAAEC,YAAY;IAAEC;EAA6B,CAAC,GAC9DnB,oBAAoB,CAAC,CAAC;EAEvB,OAAO;IACN,GAAGO,UAAU;IACbY,4BAA4B;IAC5BJ,4BAA4B;IAC5BJ,qBAAqB;IACrBO,YAAY;IACZL,gBAAgB;IAChBP,YAAY;IACZW,SAAS;IACTZ,SAAS,EAAEI;EACZ,CAAC;AACF"}
+{"version":3,"names":["useMemo","styles","useToolsPanelContext","useContextSystem","useCx","useToolsPanelHeader","props","className","headingLevel","otherProps","cx","classes","ToolsPanelHeader","dropdownMenuClassName","DropdownMenu","headingClassName","ToolsPanelHeading","defaultControlsItemClassName","DefaultControlsItem","menuItems","hasMenuItems","areAllOptionalControlsHidden"],"sources":["@wordpress/components/src/tools-panel/tools-panel-header/hook.ts"],"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 type { WordPressComponentProps } from '../../context';\nimport { useContextSystem } from '../../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 {\n\t\tclassName,\n\t\theadingLevel = 2,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanelHeader' );\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 defaultControlsItemClassName = useMemo( () => {\n\t\treturn cx( styles.DefaultControlsItem );\n\t}, [ cx ] );\n\n\tconst { menuItems, hasMenuItems, areAllOptionalControlsHidden } =\n\t\tuseToolsPanelContext();\n\n\treturn {\n\t\t...otherProps,\n\t\tareAllOptionalControlsHidden,\n\t\tdefaultControlsItemClassName,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\theadingLevel,\n\t\tmenuItems,\n\t\tclassName: classes,\n\t};\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,oBAAoB;;AAE5C;AACA;AACA;AACA,OAAO,KAAKC,MAAM,MAAM,WAAW;AACnC,SAASC,oBAAoB,QAAQ,YAAY;AAEjD,SAASC,gBAAgB,QAAQ,eAAe;AAChD,SAASC,KAAK,QAAQ,0BAA0B;AAGhD,OAAO,SAASC,mBAAmBA,CAClCC,KAA6D,EAC5D;EACD,MAAM;IACLC,SAAS;IACTC,YAAY,GAAG,CAAC;IAChB,GAAGC;EACJ,CAAC,GAAGN,gBAAgB,CAAEG,KAAK,EAAE,kBAAmB,CAAC;EAEjD,MAAMI,EAAE,GAAGN,KAAK,CAAC,CAAC;EAClB,MAAMO,OAAO,GAAGX,OAAO,CAAE,MAAM;IAC9B,OAAOU,EAAE,CAAET,MAAM,CAACW,gBAAgB,EAAEL,SAAU,CAAC;EAChD,CAAC,EAAE,CAAEA,SAAS,EAAEG,EAAE,CAAG,CAAC;EAEtB,MAAMG,qBAAqB,GAAGb,OAAO,CAAE,MAAM;IAC5C,OAAOU,EAAE,CAAET,MAAM,CAACa,YAAa,CAAC;EACjC,CAAC,EAAE,CAAEJ,EAAE,CAAG,CAAC;EAEX,MAAMK,gBAAgB,GAAGf,OAAO,CAAE,MAAM;IACvC,OAAOU,EAAE,CAAET,MAAM,CAACe,iBAAkB,CAAC;EACtC,CAAC,EAAE,CAAEN,EAAE,CAAG,CAAC;EAEX,MAAMO,4BAA4B,GAAGjB,OAAO,CAAE,MAAM;IACnD,OAAOU,EAAE,CAAET,MAAM,CAACiB,mBAAoB,CAAC;EACxC,CAAC,EAAE,CAAER,EAAE,CAAG,CAAC;EAEX,MAAM;IAAES,SAAS;IAAEC,YAAY;IAAEC;EAA6B,CAAC,GAC9DnB,oBAAoB,CAAC,CAAC;EAEvB,OAAO;IACN,GAAGO,UAAU;IACbY,4BAA4B;IAC5BJ,4BAA4B;IAC5BJ,qBAAqB;IACrBO,YAAY;IACZL,gBAAgB;IAChBP,YAAY;IACZW,SAAS;IACTZ,SAAS,EAAEI;EACZ,CAAC;AACF"}

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

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * External dependencies
  */
@@ -8,7 +8,7 @@ import { createElement } from "@wordpress/element";
  */
 import { useToolsPanelItem } from './hook';
 import { View } from '../../view';
-import { contextConnect } from '../../ui/context';
+import { contextConnect } from '../../context';
 // This wraps controls to be conditionally displayed within a tools panel. It
 // prevents props being applied to HTML elements that would make them invalid.
 const UnconnectedToolsPanelItem = (props, forwardedRef) => {

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

@@ -1 +1 @@
-{"version":3,"names":["useToolsPanelItem","View","contextConnect","UnconnectedToolsPanelItem","props","forwardedRef","children","isShown","shouldRenderPlaceholder","toolsPanelItemProps","createElement","ref","ToolsPanelItem"],"sources":["@wordpress/components/src/tools-panel/tools-panel-item/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelItem } from './hook';\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../ui/context';\nimport { contextConnect } 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 UnconnectedToolsPanelItem = (\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >,\n\tforwardedRef: ForwardedRef< 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\nexport const ToolsPanelItem = contextConnect(\n\tUnconnectedToolsPanelItem,\n\t'ToolsPanelItem'\n);\n\nexport default ToolsPanelItem;\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,iBAAiB,QAAQ,QAAQ;AAC1C,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,kBAAkB;AAGjD;AACA;AACA,MAAMC,yBAAyB,GAAGA,CACjCC,KAA4D,EAC5DC,YAAiC,KAC7B;EACJ,MAAM;IACLC,QAAQ;IACRC,OAAO;IACPC,uBAAuB;IACvB,GAAGC;EACJ,CAAC,GAAGT,iBAAiB,CAAEI,KAAM,CAAC;EAE9B,IAAK,CAAEG,OAAO,EAAG;IAChB,OAAOC,uBAAuB,GAC7BE,aAAA,CAACT,IAAI;MAAA,GAAMQ,mBAAmB;MAAGE,GAAG,EAAGN;IAAc,CAAE,CAAC,GACrD,IAAI;EACT;EAEA,OACCK,aAAA,CAACT,IAAI;IAAA,GAAMQ,mBAAmB;IAAGE,GAAG,EAAGN;EAAc,GAClDC,QACG,CAAC;AAET,CAAC;AAED,OAAO,MAAMM,cAAc,GAAGV,cAAc,CAC3CC,yBAAyB,EACzB,gBACD,CAAC;AAED,eAAeS,cAAc"}
+{"version":3,"names":["useToolsPanelItem","View","contextConnect","UnconnectedToolsPanelItem","props","forwardedRef","children","isShown","shouldRenderPlaceholder","toolsPanelItemProps","createElement","ref","ToolsPanelItem"],"sources":["@wordpress/components/src/tools-panel/tools-panel-item/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelItem } from './hook';\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../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 UnconnectedToolsPanelItem = (\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >,\n\tforwardedRef: ForwardedRef< 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\nexport const ToolsPanelItem = contextConnect(\n\tUnconnectedToolsPanelItem,\n\t'ToolsPanelItem'\n);\n\nexport default ToolsPanelItem;\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,iBAAiB,QAAQ,QAAQ;AAC1C,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAG9C;AACA;AACA,MAAMC,yBAAyB,GAAGA,CACjCC,KAA4D,EAC5DC,YAAiC,KAC7B;EACJ,MAAM;IACLC,QAAQ;IACRC,OAAO;IACPC,uBAAuB;IACvB,GAAGC;EACJ,CAAC,GAAGT,iBAAiB,CAAEI,KAAM,CAAC;EAE9B,IAAK,CAAEG,OAAO,EAAG;IAChB,OAAOC,uBAAuB,GAC7BE,aAAA,CAACT,IAAI;MAAA,GAAMQ,mBAAmB;MAAGE,GAAG,EAAGN;IAAc,CAAE,CAAC,GACrD,IAAI;EACT;EAEA,OACCK,aAAA,CAACT,IAAI;IAAA,GAAMQ,mBAAmB;IAAGE,GAAG,EAAGN;EAAc,GAClDC,QACG,CAAC;AAET,CAAC;AAED,OAAO,MAAMM,cAAc,GAAGV,cAAc,CAC3CC,yBAAyB,EACzB,gBACD,CAAC;AAED,eAAeS,cAAc"}

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

@@ -2,14 +2,14 @@
  * WordPress dependencies
  */
 import { usePrevious } from '@wordpress/compose';
-import { useCallback, useEffect, useMemo } from '@wordpress/element';
+import { useCallback, useEffect, useLayoutEffect, useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import * as styles from '../styles';
 import { useToolsPanelContext } from '../context';
-import { useContextSystem } from '../../ui/context';
+import { useContextSystem } from '../../context';
 import { useCx } from '../../utils/hooks/use-cx';
 const noop = () => {};
 export function useToolsPanelItem(props) {
@@ -39,14 +39,25 @@ export function useToolsPanelItem(props) {
     __experimentalFirstVisibleItemClass,
     __experimentalLastVisibleItemClass
   } = useToolsPanelContext();
-  const hasValueCallback = useCallback(hasValue, [panelId, hasValue]);
-  const resetAllFilterCallback = useCallback(resetAllFilter, [panelId, resetAllFilter]);
+
+  // hasValue is a new function on every render, so do not add it as a
+  // dependency to the useCallback hook! If needed, we should use a ref.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const hasValueCallback = useCallback(hasValue, [panelId]);
+  // resetAllFilter is a new function on every render, so do not add it as a
+  // dependency to the useCallback hook! If needed, we should use a ref.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const resetAllFilterCallback = useCallback(resetAllFilter, [panelId]);
   const previousPanelId = usePrevious(currentPanelId);
   const hasMatchingPanel = currentPanelId === panelId || currentPanelId === null;
 
   // Registering the panel item allows the panel to include it in its
   // automatically generated menu and determine its initial checked status.
-  useEffect(() => {
+  //
+  // This is performed in a layout effect to ensure that the panel item
+  // is registered before it is rendered preventing a rendering glitch.
+  // See: https://github.com/WordPress/gutenberg/issues/56470
+  useLayoutEffect(() => {
     if (hasMatchingPanel && previousPanelId !== null) {
       registerPanelItem({
         hasValue: hasValueCallback,
@@ -83,19 +94,12 @@ export function useToolsPanelItem(props) {
   const newValueSet = isValueSet && !wasValueSet;
 
   // Notify the panel when an item's value has been set.
-  //
-  // 1. For default controls, this is so "reset" appears beside its menu item.
-  // 2. For optional controls, when the panel ID is `null`, it allows the
-  // panel to ensure the item is toggled on for display in the menu, given the
-  // value has been set external to the control.
   useEffect(() => {
     if (!newValueSet) {
       return;
     }
-    if (isShownByDefault || currentPanelId === null) {
-      flagItemCustomization(label, menuGroup);
-    }
-  }, [currentPanelId, newValueSet, isShownByDefault, menuGroup, label, flagItemCustomization]);
+    flagItemCustomization(label, menuGroup);
+  }, [newValueSet, menuGroup, label, flagItemCustomization]);
 
   // Determine if the panel item's corresponding menu is being toggled and
   // trigger appropriate callback if it is.
@@ -120,10 +124,10 @@ export function useToolsPanelItem(props) {
   const isShown = isShownByDefault ? menuItems?.[menuGroup]?.[label] !== undefined : isMenuItemChecked;
   const cx = useCx();
   const classes = useMemo(() => {
-    const placeholderStyle = shouldRenderPlaceholder && !isShown && styles.ToolsPanelItemPlaceholder;
+    const shouldApplyPlaceholderStyles = shouldRenderPlaceholder && !isShown;
     const firstItemStyle = firstDisplayedItem === label && __experimentalFirstVisibleItemClass;
     const lastItemStyle = lastDisplayedItem === label && __experimentalLastVisibleItemClass;
-    return cx(styles.ToolsPanelItem, placeholderStyle, className, firstItemStyle, lastItemStyle);
+    return cx(styles.ToolsPanelItem, shouldApplyPlaceholderStyles && styles.ToolsPanelItemPlaceholder, !shouldApplyPlaceholderStyles && className, firstItemStyle, lastItemStyle);
   }, [isShown, shouldRenderPlaceholder, className, cx, firstDisplayedItem, lastDisplayedItem, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass, label]);
   return {
     ...otherProps,

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

@@ -1 +1 @@
-{"version":3,"names":["usePrevious","useCallback","useEffect","useMemo","styles","useToolsPanelContext","useContextSystem","useCx","noop","useToolsPanelItem","props","className","hasValue","isShownByDefault","label","panelId","resetAllFilter","onDeselect","onSelect","otherProps","currentPanelId","menuItems","registerResetAllFilter","deregisterResetAllFilter","registerPanelItem","deregisterPanelItem","flagItemCustomization","isResetting","shouldRenderPlaceholderItems","shouldRenderPlaceholder","firstDisplayedItem","lastDisplayedItem","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","menuGroup","isMenuItemChecked","wasMenuItemChecked","isRegistered","undefined","isValueSet","wasValueSet","newValueSet","isShown","cx","classes","placeholderStyle","ToolsPanelItemPlaceholder","firstItemStyle","lastItemStyle","ToolsPanelItem"],"sources":["@wordpress/components/src/tools-panel/tools-panel-item/hook.ts"],"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 type { WordPressComponentProps } from '../../ui/context';\nimport { useContextSystem } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelItemProps } from '../types';\n\nconst noop = () => {};\n\nexport function useToolsPanelItem(\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\thasValue,\n\t\tisShownByDefault = false,\n\t\tlabel,\n\t\tpanelId,\n\t\tresetAllFilter = noop,\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\tregisterResetAllFilter,\n\t\tderegisterResetAllFilter,\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, hasValue ] );\n\tconst resetAllFilterCallback = useCallback( resetAllFilter, [\n\t\tpanelId,\n\t\tresetAllFilter,\n\t] );\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\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\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t] );\n\n\tuseEffect( () => {\n\t\tif ( hasMatchingPanel ) {\n\t\t\tregisterResetAllFilter( resetAllFilterCallback );\n\t\t}\n\t\treturn () => {\n\t\t\tif ( hasMatchingPanel ) {\n\t\t\t\tderegisterResetAllFilter( resetAllFilterCallback );\n\t\t\t}\n\t\t};\n\t}, [\n\t\tregisterResetAllFilter,\n\t\tderegisterResetAllFilter,\n\t\tresetAllFilterCallback,\n\t\thasMatchingPanel,\n\t] );\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\tconst isRegistered = menuItems?.[ menuGroup ]?.[ label ] !== undefined;\n\n\tconst isValueSet = hasValue();\n\tconst wasValueSet = usePrevious( isValueSet );\n\tconst newValueSet = isValueSet && ! wasValueSet;\n\n\t// Notify the panel when an item's value has been set.\n\t//\n\t// 1. For default controls, this is so \"reset\" appears beside its menu item.\n\t// 2. For optional controls, when the panel ID is `null`, it allows the\n\t// panel to ensure the item is toggled on for display in the menu, given the\n\t// value has been set external to the control.\n\tuseEffect( () => {\n\t\tif ( ! newValueSet ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isShownByDefault || currentPanelId === null ) {\n\t\t\tflagItemCustomization( label, menuGroup );\n\t\t}\n\t}, [\n\t\tcurrentPanelId,\n\t\tnewValueSet,\n\t\tisShownByDefault,\n\t\tmenuGroup,\n\t\tlabel,\n\t\tflagItemCustomization,\n\t] );\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\t// We check whether this item is currently registered as items rendered\n\t\t// via fills can persist through the parent panel being remounted.\n\t\t// See: https://github.com/WordPress/gutenberg/pull/45673\n\t\tif ( ! isRegistered || 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\tisRegistered,\n\t\tisResetting,\n\t\tisValueSet,\n\t\twasMenuItemChecked,\n\t\tonSelect,\n\t\tonDeselect,\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\tlabel,\n\t] );\n\n\treturn {\n\t\t...otherProps,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName: classes,\n\t};\n}\n"],"mappings":"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"}
+{"version":3,"names":["usePrevious","useCallback","useEffect","useLayoutEffect","useMemo","styles","useToolsPanelContext","useContextSystem","useCx","noop","useToolsPanelItem","props","className","hasValue","isShownByDefault","label","panelId","resetAllFilter","onDeselect","onSelect","otherProps","currentPanelId","menuItems","registerResetAllFilter","deregisterResetAllFilter","registerPanelItem","deregisterPanelItem","flagItemCustomization","isResetting","shouldRenderPlaceholderItems","shouldRenderPlaceholder","firstDisplayedItem","lastDisplayedItem","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","menuGroup","isMenuItemChecked","wasMenuItemChecked","isRegistered","undefined","isValueSet","wasValueSet","newValueSet","isShown","cx","classes","shouldApplyPlaceholderStyles","firstItemStyle","lastItemStyle","ToolsPanelItem","ToolsPanelItemPlaceholder"],"sources":["@wordpress/components/src/tools-panel/tools-panel-item/hook.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious } from '@wordpress/compose';\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseMemo,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport type { WordPressComponentProps } from '../../context';\nimport { useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelItemProps } from '../types';\n\nconst noop = () => {};\n\nexport function useToolsPanelItem(\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\thasValue,\n\t\tisShownByDefault = false,\n\t\tlabel,\n\t\tpanelId,\n\t\tresetAllFilter = noop,\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\tregisterResetAllFilter,\n\t\tderegisterResetAllFilter,\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\t// hasValue is a new function on every render, so do not add it as a\n\t// dependency to the useCallback hook! If needed, we should use a ref.\n\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\tconst hasValueCallback = useCallback( hasValue, [ panelId ] );\n\t// resetAllFilter is a new function on every render, so do not add it as a\n\t// dependency to the useCallback hook! If needed, we should use a ref.\n\t// eslint-disable-next-line react-hooks/exhaustive-deps\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\t//\n\t// This is performed in a layout effect to ensure that the panel item\n\t// is registered before it is rendered preventing a rendering glitch.\n\t// See: https://github.com/WordPress/gutenberg/issues/56470\n\tuseLayoutEffect( () => {\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\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\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t] );\n\n\tuseEffect( () => {\n\t\tif ( hasMatchingPanel ) {\n\t\t\tregisterResetAllFilter( resetAllFilterCallback );\n\t\t}\n\t\treturn () => {\n\t\t\tif ( hasMatchingPanel ) {\n\t\t\t\tderegisterResetAllFilter( resetAllFilterCallback );\n\t\t\t}\n\t\t};\n\t}, [\n\t\tregisterResetAllFilter,\n\t\tderegisterResetAllFilter,\n\t\tresetAllFilterCallback,\n\t\thasMatchingPanel,\n\t] );\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\tconst isRegistered = menuItems?.[ menuGroup ]?.[ label ] !== undefined;\n\n\tconst isValueSet = hasValue();\n\tconst wasValueSet = usePrevious( isValueSet );\n\tconst newValueSet = isValueSet && ! wasValueSet;\n\n\t// Notify the panel when an item's value has been set.\n\tuseEffect( () => {\n\t\tif ( ! newValueSet ) {\n\t\t\treturn;\n\t\t}\n\n\t\tflagItemCustomization( label, menuGroup );\n\t}, [ newValueSet, menuGroup, label, flagItemCustomization ] );\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\t// We check whether this item is currently registered as items rendered\n\t\t// via fills can persist through the parent panel being remounted.\n\t\t// See: https://github.com/WordPress/gutenberg/pull/45673\n\t\tif ( ! isRegistered || 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\tisRegistered,\n\t\tisResetting,\n\t\tisValueSet,\n\t\twasMenuItemChecked,\n\t\tonSelect,\n\t\tonDeselect,\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 shouldApplyPlaceholderStyles =\n\t\t\tshouldRenderPlaceholder && ! isShown;\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\tshouldApplyPlaceholderStyles && styles.ToolsPanelItemPlaceholder,\n\t\t\t! shouldApplyPlaceholderStyles && className,\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\tlabel,\n\t] );\n\n\treturn {\n\t\t...otherProps,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName: classes,\n\t};\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/tools-panel/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { HeadingSize } from '../heading/types';\n\nexport type ResetAllFilter = ( attributes?: any ) => any;\ntype ResetAll = ( filters?: ResetAllFilter[] ) => void;\n\nexport type ToolsPanelProps = {\n\t/**\n\t * The child elements.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Flags that the items in this ToolsPanel will be contained within an inner\n\t * wrapper element allowing the panel to lay them out accordingly.\n\t *\n\t * @default false\n\t */\n\thasInnerWrapper?: boolean;\n\t/**\n\t * The heading level of the panel's header.\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Text to be displayed within the panel's header and as the `aria-label`\n\t * for the panel's dropdown menu.\n\t */\n\tlabel: string;\n\t/**\n\t * If a `panelId` is set, it is passed through the `ToolsPanelContext` and\n\t * used to restrict panel items. When a `panelId` is set, items can only\n\t * register themselves if the `panelId` is explicitly `null` or the item's\n\t * `panelId` matches exactly.\n\t */\n\tpanelId?: string | null;\n\t/**\n\t * A function to call when the `Reset all` menu option is selected. As an\n\t * argument, it receives an array containing the `resetAllFilter` callbacks\n\t * of all the valid registered `ToolsPanelItems`.\n\t */\n\tresetAll: ResetAll;\n\t/**\n\t * Advises the `ToolsPanel` that its child `ToolsPanelItem`s should render\n\t * placeholder content instead of null when they are toggled off and hidden.\n\t *\n\t * @default false\n\t */\n\tshouldRenderPlaceholderItems?: boolean;\n\t/**\n\t * Experimental prop allowing for a custom CSS class to be applied to the\n\t * first visible `ToolsPanelItem` within the `ToolsPanel`.\n\t */\n\t__experimentalFirstVisibleItemClass?: string;\n\t/**\n\t * Experimental prop allowing for a custom CSS class to be applied to the\n\t * last visible `ToolsPanelItem` within the `ToolsPanel`.\n\t */\n\t__experimentalLastVisibleItemClass?: string;\n};\n\nexport type ToolsPanelHeaderProps = {\n\t/**\n\t * The heading level of the panel's header.\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Text to be displayed within the panel header. It is also passed along as\n\t * the `label` for the panel header's `DropdownMenu`.\n\t */\n\tlabel: string;\n\t/**\n\t * The `resetAll` prop provides the callback to execute when the \"Reset all\"\n\t * menu item is selected. Its purpose is to facilitate resetting any control\n\t * values for items contained within this header's panel.\n\t */\n\tresetAll: ResetAll;\n\t/**\n\t * This is executed when an individual control's menu item is toggled. It\n\t * will update the panel's menu item state and call the panel item's\n\t * `onSelect` or `onDeselect` callbacks as appropriate.\n\t */\n\ttoggleItem: ( label: string ) => void;\n};\n\nexport type ToolsPanelItem = {\n\t/**\n\t * This is called when building the `ToolsPanel` menu to determine the\n\t * item's initial checked state.\n\t */\n\thasValue: () => boolean;\n\t/**\n\t * This prop identifies the current item as being displayed by default. This\n\t * means it will show regardless of whether it has a value set or is toggled\n\t * on in the panel's menu.\n\t *\n\t * @default false\n\t */\n\tisShownByDefault?: boolean;\n\t/**\n\t * The supplied label is dual purpose. It is used as:\n\t * 1. the human-readable label for the panel's dropdown menu\n\t * 2. a key to locate the corresponding item in the panel's menu context to\n\t * determine if the panel item should be displayed.\n\t * A panel item's `label` should be unique among all items within a single\n\t * panel.\n\t */\n\tlabel: string;\n\t/**\n\t * Panel items will ensure they are only registering with their intended panel\n\t * by comparing the `panelId` props set on both the item and the panel itself,\n\t * or if the `panelId` is explicitly `null`. This allows items to be injected\n\t * from a shared source.\n\t */\n\tpanelId?: string | null;\n};\n\nexport type ToolsPanelItemProps = ToolsPanelItem & {\n\t/**\n\t * The child elements.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * Called when this item is deselected in the `ToolsPanel` menu. This is\n\t * normally used to reset the panel item control's value.\n\t */\n\tonDeselect?: () => void;\n\t/**\n\t * A callback to take action when this item is selected in the `ToolsPanel`\n\t * menu.\n\t */\n\tonSelect?: () => void;\n\n\t/**\n\t * A `ToolsPanel` will collect each item's `resetAllFilter` and pass an\n\t * array of these functions through to the panel's `resetAll` callback. They\n\t * can then be iterated over to perform additional tasks.\n\t *\n\t * @default noop\n\t */\n\tresetAllFilter?: ResetAllFilter;\n};\n\nexport type ToolsPanelMenuItemKey = 'default' | 'optional';\n\nexport type ToolsPanelMenuItems = {\n\t[ menuItemKey in ToolsPanelMenuItemKey ]: { [ key: string ]: boolean };\n};\n\nexport type ToolsPanelContext = {\n\tpanelId?: string | null;\n\tmenuItems: ToolsPanelMenuItems;\n\thasMenuItems: boolean;\n\tregisterPanelItem: ( item: ToolsPanelItem ) => void;\n\tderegisterPanelItem: ( label: string ) => void;\n\tregisterResetAllFilter: ( filter: ResetAllFilter ) => void;\n\tderegisterResetAllFilter: ( filter: ResetAllFilter ) => void;\n\tflagItemCustomization: (\n\t\tlabel: string,\n\t\tgroup?: ToolsPanelMenuItemKey\n\t) => void;\n\tisResetting: boolean;\n\tshouldRenderPlaceholderItems: boolean;\n\tareAllOptionalControlsHidden: boolean;\n\tfirstDisplayedItem?: string;\n\tlastDisplayedItem?: string;\n\t__experimentalFirstVisibleItemClass?: string;\n\t__experimentalLastVisibleItemClass?: string;\n};\n\nexport type ToolsPanelControlsGroupProps = {\n\titemClassName?: string;\n\titems: [ string, boolean ][];\n\ttoggleItem: ( label: string ) => void;\n};\n\nexport type ToolsPanelMenuItemsConfig = {\n\tpanelItems: ToolsPanelItem[];\n\tshouldReset: boolean;\n\tcurrentMenuItems?: ToolsPanelMenuItems;\n\tmenuItemOrder: string[];\n};\n"],"mappings":""}
+{"version":3,"names":[],"sources":["@wordpress/components/src/tools-panel/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { HeadingSize } from '../heading/types';\nimport type { DropdownMenu } from '../dropdown-menu';\n\nexport type ResetAllFilter = ( attributes?: any ) => any;\ntype ResetAll = ( filters?: ResetAllFilter[] ) => void;\n\nexport type ToolsPanelProps = {\n\t/**\n\t * The child elements.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * The dropdown menu props to configure the panel's `DropdownMenu`.\n\t */\n\tdropdownMenuProps?: React.ComponentProps< typeof DropdownMenu >;\n\t/**\n\t * Flags that the items in this ToolsPanel will be contained within an inner\n\t * wrapper element allowing the panel to lay them out accordingly.\n\t *\n\t * @default false\n\t */\n\thasInnerWrapper?: boolean;\n\t/**\n\t * The heading level of the panel's header.\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Text to be displayed within the panel's header and as the `aria-label`\n\t * for the panel's dropdown menu.\n\t */\n\tlabel: string;\n\t/**\n\t * If a `panelId` is set, it is passed through the `ToolsPanelContext` and\n\t * used to restrict panel items. When a `panelId` is set, items can only\n\t * register themselves if the `panelId` is explicitly `null` or the item's\n\t * `panelId` matches exactly.\n\t */\n\tpanelId?: string | null;\n\t/**\n\t * A function to call when the `Reset all` menu option is selected. As an\n\t * argument, it receives an array containing the `resetAllFilter` callbacks\n\t * of all the valid registered `ToolsPanelItems`.\n\t */\n\tresetAll: ResetAll;\n\t/**\n\t * Advises the `ToolsPanel` that its child `ToolsPanelItem`s should render\n\t * placeholder content instead of null when they are toggled off and hidden.\n\t * Note that placeholder items won't apply the `className` that would be\n\t * normally applied to a visible `ToolsPanelItem` via the `className` prop.\n\t *\n\t * @default false\n\t */\n\tshouldRenderPlaceholderItems?: boolean;\n\t/**\n\t * Experimental prop allowing for a custom CSS class to be applied to the\n\t * first visible `ToolsPanelItem` within the `ToolsPanel`.\n\t */\n\t__experimentalFirstVisibleItemClass?: string;\n\t/**\n\t * Experimental prop allowing for a custom CSS class to be applied to the\n\t * last visible `ToolsPanelItem` within the `ToolsPanel`.\n\t */\n\t__experimentalLastVisibleItemClass?: string;\n};\n\nexport type ToolsPanelHeaderProps = {\n\t/**\n\t * The dropdown menu props to configure the panel's `DropdownMenu`.\n\t */\n\tdropdownMenuProps?: React.ComponentProps< typeof DropdownMenu >;\n\t/**\n\t * The heading level of the panel's header.\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Text to be displayed within the panel header. It is also passed along as\n\t * the `label` for the panel header's `DropdownMenu`.\n\t */\n\tlabel: string;\n\t/**\n\t * The `resetAll` prop provides the callback to execute when the \"Reset all\"\n\t * menu item is selected. Its purpose is to facilitate resetting any control\n\t * values for items contained within this header's panel.\n\t */\n\tresetAll: ResetAll;\n\t/**\n\t * This is executed when an individual control's menu item is toggled. It\n\t * will update the panel's menu item state and call the panel item's\n\t * `onSelect` or `onDeselect` callbacks as appropriate.\n\t */\n\ttoggleItem: ( label: string ) => void;\n};\n\nexport type ToolsPanelItem = {\n\t/**\n\t * This is called when building the `ToolsPanel` menu to determine the\n\t * item's initial checked state.\n\t */\n\thasValue: () => boolean;\n\t/**\n\t * This prop identifies the current item as being displayed by default. This\n\t * means it will show regardless of whether it has a value set or is toggled\n\t * on in the panel's menu.\n\t *\n\t * @default false\n\t */\n\tisShownByDefault?: boolean;\n\t/**\n\t * The supplied label is dual purpose. It is used as:\n\t * 1. the human-readable label for the panel's dropdown menu\n\t * 2. a key to locate the corresponding item in the panel's menu context to\n\t * determine if the panel item should be displayed.\n\t * A panel item's `label` should be unique among all items within a single\n\t * panel.\n\t */\n\tlabel: string;\n\t/**\n\t * Panel items will ensure they are only registering with their intended panel\n\t * by comparing the `panelId` props set on both the item and the panel itself,\n\t * or if the `panelId` is explicitly `null`. This allows items to be injected\n\t * from a shared source.\n\t */\n\tpanelId?: string | null;\n};\n\nexport type ToolsPanelItemProps = ToolsPanelItem & {\n\t/**\n\t * The child elements.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * Called when this item is deselected in the `ToolsPanel` menu. This is\n\t * normally used to reset the panel item control's value.\n\t */\n\tonDeselect?: () => void;\n\t/**\n\t * A callback to take action when this item is selected in the `ToolsPanel`\n\t * menu.\n\t */\n\tonSelect?: () => void;\n\n\t/**\n\t * A `ToolsPanel` will collect each item's `resetAllFilter` and pass an\n\t * array of these functions through to the panel's `resetAll` callback. They\n\t * can then be iterated over to perform additional tasks.\n\t *\n\t * @default noop\n\t */\n\tresetAllFilter?: ResetAllFilter;\n};\n\nexport type ToolsPanelMenuItemKey = 'default' | 'optional';\n\nexport type ToolsPanelMenuItems = {\n\t[ menuItemKey in ToolsPanelMenuItemKey ]: { [ key: string ]: boolean };\n};\n\nexport type ToolsPanelContext = {\n\tpanelId?: string | null;\n\tmenuItems: ToolsPanelMenuItems;\n\thasMenuItems: boolean;\n\tregisterPanelItem: ( item: ToolsPanelItem ) => void;\n\tderegisterPanelItem: ( label: string ) => void;\n\tregisterResetAllFilter: ( filter: ResetAllFilter ) => void;\n\tderegisterResetAllFilter: ( filter: ResetAllFilter ) => void;\n\tflagItemCustomization: (\n\t\tlabel: string,\n\t\tgroup?: ToolsPanelMenuItemKey\n\t) => void;\n\tisResetting: boolean;\n\tshouldRenderPlaceholderItems: boolean;\n\tareAllOptionalControlsHidden: boolean;\n\tfirstDisplayedItem?: string;\n\tlastDisplayedItem?: string;\n\t__experimentalFirstVisibleItemClass?: string;\n\t__experimentalLastVisibleItemClass?: string;\n};\n\nexport type ToolsPanelControlsGroupProps = {\n\titemClassName?: string;\n\titems: [ string, boolean ][];\n\ttoggleItem: ( label: string ) => void;\n};\n\nexport type ToolsPanelMenuItemsConfig = {\n\tpanelItems: ToolsPanelItem[];\n\tshouldReset: boolean;\n\tcurrentMenuItems?: ToolsPanelMenuItems;\n\tmenuItemOrder: string[];\n};\n"],"mappings":""}