@wordpress/components 25.9.1 → 25.10.0

package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","motion","useReducedMotion","useInstanceId","useMemo","contextConnect","useContextSystem","useToggleGroupControlContext","styles","useCx","Tooltip","ButtonContentView","LabelView","REDUCED_MOTION_TRANSITION_CONFIG","duration","LAYOUT_ID","WithToolTip","showTooltip","text","children","createElement","placement","Fragment","ToggleGroupControlOptionBase","props","forwardedRef","shouldReduceMotion","toggleGroupControlContext","id","baseId","buttonProps","isBlock","isDeselectable","size","className","isIcon","value","onFocus","onFocusProp","otherButtonProps","isPressed","cx","labelViewClasses","labelBlock","itemClasses","buttonView","backdropClasses","backdropView","buttonOnClick","setValue","undefined","commonProps","ref","type","onClick","Radio","render","event","defaultPrevented","div","transition","role","layoutId","ConnectedToggleGroupControlOptionBase"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-base/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n// eslint-disable-next-line no-restricted-imports\nimport { motion, useReducedMotion } from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport type {\n\tToggleGroupControlOptionBaseProps,\n\tWithToolTipProps,\n} from '../types';\nimport { useToggleGroupControlContext } from '../context';\nimport * as styles from './styles';\nimport { useCx } from '../../utils/hooks';\nimport Tooltip from '../../tooltip';\n\nconst { ButtonContentView, LabelView } = styles;\n\nconst REDUCED_MOTION_TRANSITION_CONFIG = {\n\tduration: 0,\n};\n\nconst LAYOUT_ID = 'toggle-group-backdrop-shared-layout-id';\n\nconst WithToolTip = ( { showTooltip, text, children }: WithToolTipProps ) => {\n\tif ( showTooltip && text ) {\n\t\treturn (\n\t\t\t<Tooltip text={ text } placement=\"top\">\n\t\t\t\t{ children }\n\t\t\t</Tooltip>\n\t\t);\n\t}\n\treturn <>{ children }</>;\n};\n\nfunction ToggleGroupControlOptionBase(\n\tprops: Omit<\n\t\tWordPressComponentProps<\n\t\t\tToggleGroupControlOptionBaseProps,\n\t\t\t'button',\n\t\t\tfalse\n\t\t>,\n\t\t// the element's id is generated internally\n\t\t'id'\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst shouldReduceMotion = useReducedMotion();\n\tconst toggleGroupControlContext = useToggleGroupControlContext();\n\n\tconst id = useInstanceId(\n\t\tToggleGroupControlOptionBase,\n\t\ttoggleGroupControlContext.baseId || 'toggle-group-control-option-base'\n\t);\n\n\tconst buttonProps = useContextSystem(\n\t\t{ ...props, id },\n\t\t'ToggleGroupControlOptionBase'\n\t);\n\n\tconst {\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tsize = 'default',\n\t} = toggleGroupControlContext;\n\n\tconst {\n\t\tclassName,\n\t\tisIcon = false,\n\t\tvalue,\n\t\tchildren,\n\t\tshowTooltip = false,\n\t\tonFocus: onFocusProp,\n\t\t...otherButtonProps\n\t} = buttonProps;\n\n\tconst isPressed = toggleGroupControlContext.value === value;\n\tconst cx = useCx();\n\tconst labelViewClasses = useMemo(\n\t\t() => cx( isBlock && styles.labelBlock ),\n\t\t[ cx, isBlock ]\n\t);\n\tconst itemClasses = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.buttonView( {\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tisIcon,\n\t\t\t\t\tisPressed,\n\t\t\t\t\tsize,\n\t\t\t\t} ),\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ cx, isDeselectable, isIcon, isPressed, size, className ]\n\t);\n\tconst backdropClasses = useMemo( () => cx( styles.backdropView ), [ cx ] );\n\n\tconst buttonOnClick = () => {\n\t\tif ( isDeselectable && isPressed ) {\n\t\t\ttoggleGroupControlContext.setValue( undefined );\n\t\t} else {\n\t\t\ttoggleGroupControlContext.setValue( value );\n\t\t}\n\t};\n\n\tconst commonProps = {\n\t\t...otherButtonProps,\n\t\tclassName: itemClasses,\n\t\t'data-value': value,\n\t\tref: forwardedRef,\n\t};\n\n\treturn (\n\t\t<LabelView className={ labelViewClasses }>\n\t\t\t<WithToolTip\n\t\t\t\tshowTooltip={ showTooltip }\n\t\t\t\ttext={ otherButtonProps[ 'aria-label' ] }\n\t\t\t>\n\t\t\t\t{ isDeselectable ? (\n\t\t\t\t\t<button\n\t\t\t\t\t\t{ ...commonProps }\n\t\t\t\t\t\tonFocus={ onFocusProp }\n\t\t\t\t\t\taria-pressed={ isPressed }\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tonClick={ buttonOnClick }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ButtonContentView>{ children }</ButtonContentView>\n\t\t\t\t\t</button>\n\t\t\t\t) : (\n\t\t\t\t\t<Ariakit.Radio\n\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t{ ...commonProps }\n\t\t\t\t\t\t\t\tonFocus={ ( event ) => {\n\t\t\t\t\t\t\t\t\tonFocusProp?.( event );\n\t\t\t\t\t\t\t\t\tif ( event.defaultPrevented ) return;\n\t\t\t\t\t\t\t\t\ttoggleGroupControlContext.setValue( value );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ButtonContentView>{ children }</ButtonContentView>\n\t\t\t\t\t</Ariakit.Radio>\n\t\t\t\t) }\n\t\t\t</WithToolTip>\n\t\t\t{ /* Animated backdrop using framer motion's shared layout animation */ }\n\t\t\t{ isPressed ? (\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName={ backdropClasses }\n\t\t\t\t\ttransition={\n\t\t\t\t\t\tshouldReduceMotion\n\t\t\t\t\t\t\t? REDUCED_MOTION_TRANSITION_CONFIG\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\tlayoutId={ LAYOUT_ID }\n\t\t\t\t/>\n\t\t\t) : null }\n\t\t</LabelView>\n\t);\n}\n\n/**\n * `ToggleGroupControlOptionBase` is a form component and is meant to be used as an internal,\n * generic component for any children of `ToggleGroupControl`.\n *\n * @example\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOptionBase as ToggleGroupControlOptionBase,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nconst ConnectedToggleGroupControlOptionBase = contextConnect(\n\tToggleGroupControlOptionBase,\n\t'ToggleGroupControlOptionBase'\n);\n\nexport default ConnectedToggleGroupControlOptionBase;\n"],"mappings":"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"}
+{"version":3,"names":["Ariakit","motion","useReducedMotion","useInstanceId","useMemo","contextConnect","useContextSystem","useToggleGroupControlContext","styles","useCx","Tooltip","ButtonContentView","LabelView","REDUCED_MOTION_TRANSITION_CONFIG","duration","LAYOUT_ID","WithToolTip","showTooltip","text","children","createElement","placement","Fragment","ToggleGroupControlOptionBase","props","forwardedRef","shouldReduceMotion","toggleGroupControlContext","id","baseId","buttonProps","isBlock","isDeselectable","size","className","isIcon","value","onFocus","onFocusProp","otherButtonProps","isPressed","cx","labelViewClasses","labelBlock","itemClasses","buttonView","backdropClasses","backdropView","buttonOnClick","setValue","undefined","commonProps","ref","type","onClick","Radio","render","event","defaultPrevented","div","transition","role","layoutId","ConnectedToggleGroupControlOptionBase"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-base/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n// eslint-disable-next-line no-restricted-imports\nimport { motion, useReducedMotion } from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport type {\n\tToggleGroupControlOptionBaseProps,\n\tWithToolTipProps,\n} from '../types';\nimport { useToggleGroupControlContext } from '../context';\nimport * as styles from './styles';\nimport { useCx } from '../../utils/hooks';\nimport Tooltip from '../../tooltip';\n\nconst { ButtonContentView, LabelView } = styles;\n\nconst REDUCED_MOTION_TRANSITION_CONFIG = {\n\tduration: 0,\n};\n\nconst LAYOUT_ID = 'toggle-group-backdrop-shared-layout-id';\n\nconst WithToolTip = ( { showTooltip, text, children }: WithToolTipProps ) => {\n\tif ( showTooltip && text ) {\n\t\treturn (\n\t\t\t<Tooltip text={ text } placement=\"top\">\n\t\t\t\t{ children }\n\t\t\t</Tooltip>\n\t\t);\n\t}\n\treturn <>{ children }</>;\n};\n\nfunction ToggleGroupControlOptionBase(\n\tprops: Omit<\n\t\tWordPressComponentProps<\n\t\t\tToggleGroupControlOptionBaseProps,\n\t\t\t'button',\n\t\t\tfalse\n\t\t>,\n\t\t// the element's id is generated internally\n\t\t'id'\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst shouldReduceMotion = useReducedMotion();\n\tconst toggleGroupControlContext = useToggleGroupControlContext();\n\n\tconst id = useInstanceId(\n\t\tToggleGroupControlOptionBase,\n\t\ttoggleGroupControlContext.baseId || 'toggle-group-control-option-base'\n\t);\n\n\tconst buttonProps = useContextSystem(\n\t\t{ ...props, id },\n\t\t'ToggleGroupControlOptionBase'\n\t);\n\n\tconst {\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tsize = 'default',\n\t} = toggleGroupControlContext;\n\n\tconst {\n\t\tclassName,\n\t\tisIcon = false,\n\t\tvalue,\n\t\tchildren,\n\t\tshowTooltip = false,\n\t\tonFocus: onFocusProp,\n\t\t...otherButtonProps\n\t} = buttonProps;\n\n\tconst isPressed = toggleGroupControlContext.value === value;\n\tconst cx = useCx();\n\tconst labelViewClasses = useMemo(\n\t\t() => cx( isBlock && styles.labelBlock ),\n\t\t[ cx, isBlock ]\n\t);\n\tconst itemClasses = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.buttonView( {\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tisIcon,\n\t\t\t\t\tisPressed,\n\t\t\t\t\tsize,\n\t\t\t\t} ),\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ cx, isDeselectable, isIcon, isPressed, size, className ]\n\t);\n\tconst backdropClasses = useMemo( () => cx( styles.backdropView ), [ cx ] );\n\n\tconst buttonOnClick = () => {\n\t\tif ( isDeselectable && isPressed ) {\n\t\t\ttoggleGroupControlContext.setValue( undefined );\n\t\t} else {\n\t\t\ttoggleGroupControlContext.setValue( value );\n\t\t}\n\t};\n\n\tconst commonProps = {\n\t\t...otherButtonProps,\n\t\tclassName: itemClasses,\n\t\t'data-value': value,\n\t\tref: forwardedRef,\n\t};\n\n\treturn (\n\t\t<LabelView className={ labelViewClasses }>\n\t\t\t<WithToolTip\n\t\t\t\tshowTooltip={ showTooltip }\n\t\t\t\ttext={ otherButtonProps[ 'aria-label' ] }\n\t\t\t>\n\t\t\t\t{ isDeselectable ? (\n\t\t\t\t\t<button\n\t\t\t\t\t\t{ ...commonProps }\n\t\t\t\t\t\tonFocus={ onFocusProp }\n\t\t\t\t\t\taria-pressed={ isPressed }\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tonClick={ buttonOnClick }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ButtonContentView>{ children }</ButtonContentView>\n\t\t\t\t\t</button>\n\t\t\t\t) : (\n\t\t\t\t\t<Ariakit.Radio\n\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t{ ...commonProps }\n\t\t\t\t\t\t\t\tonFocus={ ( event ) => {\n\t\t\t\t\t\t\t\t\tonFocusProp?.( event );\n\t\t\t\t\t\t\t\t\tif ( event.defaultPrevented ) return;\n\t\t\t\t\t\t\t\t\ttoggleGroupControlContext.setValue( value );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ButtonContentView>{ children }</ButtonContentView>\n\t\t\t\t\t</Ariakit.Radio>\n\t\t\t\t) }\n\t\t\t</WithToolTip>\n\t\t\t{ /* Animated backdrop using framer motion's shared layout animation */ }\n\t\t\t{ isPressed ? (\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName={ backdropClasses }\n\t\t\t\t\ttransition={\n\t\t\t\t\t\tshouldReduceMotion\n\t\t\t\t\t\t\t? REDUCED_MOTION_TRANSITION_CONFIG\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\tlayoutId={ LAYOUT_ID }\n\t\t\t\t/>\n\t\t\t) : null }\n\t\t</LabelView>\n\t);\n}\n\n/**\n * `ToggleGroupControlOptionBase` is a form component and is meant to be used as an internal,\n * generic component for any children of `ToggleGroupControl`.\n *\n * @example\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOptionBase as ToggleGroupControlOptionBase,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nconst ConnectedToggleGroupControlOptionBase = contextConnect(\n\tToggleGroupControlOptionBase,\n\t'ToggleGroupControlOptionBase'\n);\n\nexport default ConnectedToggleGroupControlOptionBase;\n"],"mappings":"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"}

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

@@ -6,7 +6,7 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { forwardRef } from '@wordpress/element';
+import { forwardRef, useMemo } from '@wordpress/element';
 import deprecated from '@wordpress/deprecated';
 
 /**
@@ -15,19 +15,26 @@ import deprecated from '@wordpress/deprecated';
 import ToolbarGroup from '../toolbar-group';
 import ToolbarContainer from './toolbar-container';
 import { ContextSystemProvider } from '../../context';
-const CONTEXT_SYSTEM_VALUE = {
-  DropdownMenu: {
-    variant: 'toolbar'
-  },
-  Dropdown: {
-    variant: 'toolbar'
-  }
-};
 function UnforwardedToolbar({
   className,
   label,
+  variant,
   ...props
 }, ref) {
+  const isVariantDefined = variant !== undefined;
+  const contextSystemValue = useMemo(() => {
+    if (isVariantDefined) {
+      return {};
+    }
+    return {
+      DropdownMenu: {
+        variant: 'toolbar'
+      },
+      Dropdown: {
+        variant: 'toolbar'
+      }
+    };
+  }, [isVariantDefined]);
   if (!label) {
     deprecated('Using Toolbar without label prop', {
       since: '5.6',
@@ -46,9 +53,9 @@ function UnforwardedToolbar({
     });
   }
   // `ToolbarGroup` already uses components-toolbar for compatibility reasons.
-  const finalClassName = classnames('components-accessible-toolbar', className);
+  const finalClassName = classnames('components-accessible-toolbar', className, variant && `is-${variant}`);
   return createElement(ContextSystemProvider, {
-    value: CONTEXT_SYSTEM_VALUE
+    value: contextSystemValue
   }, createElement(ToolbarContainer, {
     className: finalClassName,
     label: label,

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

@@ -1 +1 @@
-{"version":3,"names":["classnames","forwardRef","deprecated","ToolbarGroup","ToolbarContainer","ContextSystemProvider","CONTEXT_SYSTEM_VALUE","DropdownMenu","variant","Dropdown","UnforwardedToolbar","className","label","props","ref","since","alternative","link","title","_title","restProps","createElement","isCollapsed","finalClassName","value","Toolbar"],"sources":["@wordpress/components/src/toolbar/toolbar/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport ToolbarGroup from '../toolbar-group';\nimport ToolbarContainer from './toolbar-container';\nimport type { ToolbarProps } from './types';\nimport type { WordPressComponentProps } from '../../context';\nimport { ContextSystemProvider } from '../../context';\n\nconst CONTEXT_SYSTEM_VALUE = {\n\tDropdownMenu: {\n\t\tvariant: 'toolbar',\n\t},\n\tDropdown: {\n\t\tvariant: 'toolbar',\n\t},\n};\n\nfunction UnforwardedToolbar(\n\t{\n\t\tclassName,\n\t\tlabel,\n\t\t...props\n\t}: WordPressComponentProps< ToolbarProps, 'div', false >,\n\tref: ForwardedRef< any >\n) {\n\tif ( ! label ) {\n\t\tdeprecated( 'Using Toolbar without label prop', {\n\t\t\tsince: '5.6',\n\t\t\talternative: 'ToolbarGroup component',\n\t\t\tlink: 'https://developer.wordpress.org/block-editor/components/toolbar/',\n\t\t} );\n\t\t// Extracting title from `props` because `ToolbarGroup` doesn't accept it.\n\t\tconst { title: _title, ...restProps } = props;\n\t\treturn (\n\t\t\t<ToolbarGroup\n\t\t\t\tisCollapsed={ false }\n\t\t\t\t{ ...restProps }\n\t\t\t\tclassName={ className }\n\t\t\t/>\n\t\t);\n\t}\n\t// `ToolbarGroup` already uses components-toolbar for compatibility reasons.\n\tconst finalClassName = classnames(\n\t\t'components-accessible-toolbar',\n\t\tclassName\n\t);\n\treturn (\n\t\t<ContextSystemProvider value={ CONTEXT_SYSTEM_VALUE }>\n\t\t\t<ToolbarContainer\n\t\t\t\tclassName={ finalClassName }\n\t\t\t\tlabel={ label }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t</ContextSystemProvider>\n\t);\n}\n\n/**\n * Renders a toolbar.\n *\n * To add controls, simply pass `ToolbarButton` components as children.\n *\n * ```jsx\n * import { Toolbar, ToolbarButton } from '@wordpress/components';\n * import { formatBold, formatItalic, link } from '@wordpress/icons';\n *\n * function MyToolbar() {\n *   return (\n *     <Toolbar label=\"Options\">\n *       <ToolbarButton icon={ formatBold } label=\"Bold\" />\n *       <ToolbarButton icon={ formatItalic } label=\"Italic\" />\n *       <ToolbarButton icon={ link } label=\"Link\" />\n *     </Toolbar>\n *   );\n * }\n * ```\n */\nexport const Toolbar = forwardRef( UnforwardedToolbar );\nexport default Toolbar;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;AAGnC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;AAC/C,OAAOC,UAAU,MAAM,uBAAuB;;AAE9C;AACA;AACA;AACA,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,gBAAgB,MAAM,qBAAqB;AAGlD,SAASC,qBAAqB,QAAQ,eAAe;AAErD,MAAMC,oBAAoB,GAAG;EAC5BC,YAAY,EAAE;IACbC,OAAO,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACTD,OAAO,EAAE;EACV;AACD,CAAC;AAED,SAASE,kBAAkBA,CAC1B;EACCC,SAAS;EACTC,KAAK;EACL,GAAGC;AACmD,CAAC,EACxDC,GAAwB,EACvB;EACD,IAAK,CAAEF,KAAK,EAAG;IACdV,UAAU,CAAE,kCAAkC,EAAE;MAC/Ca,KAAK,EAAE,KAAK;MACZC,WAAW,EAAE,wBAAwB;MACrCC,IAAI,EAAE;IACP,CAAE,CAAC;IACH;IACA,MAAM;MAAEC,KAAK,EAAEC,MAAM;MAAE,GAAGC;IAAU,CAAC,GAAGP,KAAK;IAC7C,OACCQ,aAAA,CAAClB,YAAY;MACZmB,WAAW,EAAG,KAAO;MAAA,GAChBF,SAAS;MACdT,SAAS,EAAGA;IAAW,CACvB,CAAC;EAEJ;EACA;EACA,MAAMY,cAAc,GAAGvB,UAAU,CAChC,+BAA+B,EAC/BW,SACD,CAAC;EACD,OACCU,aAAA,CAAChB,qBAAqB;IAACmB,KAAK,EAAGlB;EAAsB,GACpDe,aAAA,CAACjB,gBAAgB;IAChBO,SAAS,EAAGY,cAAgB;IAC5BX,KAAK,EAAGA,KAAO;IACfE,GAAG,EAAGA,GAAK;IAAA,GACND;EAAK,CACV,CACqB,CAAC;AAE1B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMY,OAAO,GAAGxB,UAAU,CAAES,kBAAmB,CAAC;AACvD,eAAee,OAAO"}
+{"version":3,"names":["classnames","forwardRef","useMemo","deprecated","ToolbarGroup","ToolbarContainer","ContextSystemProvider","UnforwardedToolbar","className","label","variant","props","ref","isVariantDefined","undefined","contextSystemValue","DropdownMenu","Dropdown","since","alternative","link","title","_title","restProps","createElement","isCollapsed","finalClassName","value","Toolbar"],"sources":["@wordpress/components/src/toolbar/toolbar/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport ToolbarGroup from '../toolbar-group';\nimport ToolbarContainer from './toolbar-container';\nimport type { ToolbarProps } from './types';\nimport type { WordPressComponentProps } from '../../context';\nimport { ContextSystemProvider } from '../../context';\n\nfunction UnforwardedToolbar(\n\t{\n\t\tclassName,\n\t\tlabel,\n\t\tvariant,\n\t\t...props\n\t}: WordPressComponentProps< ToolbarProps, 'div', false >,\n\tref: ForwardedRef< any >\n) {\n\tconst isVariantDefined = variant !== undefined;\n\tconst contextSystemValue = useMemo( () => {\n\t\tif ( isVariantDefined ) {\n\t\t\treturn {};\n\t\t}\n\t\treturn {\n\t\t\tDropdownMenu: {\n\t\t\t\tvariant: 'toolbar',\n\t\t\t},\n\t\t\tDropdown: {\n\t\t\t\tvariant: 'toolbar',\n\t\t\t},\n\t\t};\n\t}, [ isVariantDefined ] );\n\n\tif ( ! label ) {\n\t\tdeprecated( 'Using Toolbar without label prop', {\n\t\t\tsince: '5.6',\n\t\t\talternative: 'ToolbarGroup component',\n\t\t\tlink: 'https://developer.wordpress.org/block-editor/components/toolbar/',\n\t\t} );\n\t\t// Extracting title from `props` because `ToolbarGroup` doesn't accept it.\n\t\tconst { title: _title, ...restProps } = props;\n\t\treturn (\n\t\t\t<ToolbarGroup\n\t\t\t\tisCollapsed={ false }\n\t\t\t\t{ ...restProps }\n\t\t\t\tclassName={ className }\n\t\t\t/>\n\t\t);\n\t}\n\t// `ToolbarGroup` already uses components-toolbar for compatibility reasons.\n\tconst finalClassName = classnames(\n\t\t'components-accessible-toolbar',\n\t\tclassName,\n\t\tvariant && `is-${ variant }`\n\t);\n\n\treturn (\n\t\t<ContextSystemProvider value={ contextSystemValue }>\n\t\t\t<ToolbarContainer\n\t\t\t\tclassName={ finalClassName }\n\t\t\t\tlabel={ label }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t</ContextSystemProvider>\n\t);\n}\n\n/**\n * Renders a toolbar.\n *\n * To add controls, simply pass `ToolbarButton` components as children.\n *\n * ```jsx\n * import { Toolbar, ToolbarButton } from '@wordpress/components';\n * import { formatBold, formatItalic, link } from '@wordpress/icons';\n *\n * function MyToolbar() {\n *   return (\n *     <Toolbar label=\"Options\">\n *       <ToolbarButton icon={ formatBold } label=\"Bold\" />\n *       <ToolbarButton icon={ formatItalic } label=\"Italic\" />\n *       <ToolbarButton icon={ link } label=\"Link\" />\n *     </Toolbar>\n *   );\n * }\n * ```\n */\nexport const Toolbar = forwardRef( UnforwardedToolbar );\nexport default Toolbar;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;AAGnC;AACA;AACA;AACA,SAASC,UAAU,EAAEC,OAAO,QAAQ,oBAAoB;AACxD,OAAOC,UAAU,MAAM,uBAAuB;;AAE9C;AACA;AACA;AACA,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,gBAAgB,MAAM,qBAAqB;AAGlD,SAASC,qBAAqB,QAAQ,eAAe;AAErD,SAASC,kBAAkBA,CAC1B;EACCC,SAAS;EACTC,KAAK;EACLC,OAAO;EACP,GAAGC;AACmD,CAAC,EACxDC,GAAwB,EACvB;EACD,MAAMC,gBAAgB,GAAGH,OAAO,KAAKI,SAAS;EAC9C,MAAMC,kBAAkB,GAAGb,OAAO,CAAE,MAAM;IACzC,IAAKW,gBAAgB,EAAG;MACvB,OAAO,CAAC,CAAC;IACV;IACA,OAAO;MACNG,YAAY,EAAE;QACbN,OAAO,EAAE;MACV,CAAC;MACDO,QAAQ,EAAE;QACTP,OAAO,EAAE;MACV;IACD,CAAC;EACF,CAAC,EAAE,CAAEG,gBAAgB,CAAG,CAAC;EAEzB,IAAK,CAAEJ,KAAK,EAAG;IACdN,UAAU,CAAE,kCAAkC,EAAE;MAC/Ce,KAAK,EAAE,KAAK;MACZC,WAAW,EAAE,wBAAwB;MACrCC,IAAI,EAAE;IACP,CAAE,CAAC;IACH;IACA,MAAM;MAAEC,KAAK,EAAEC,MAAM;MAAE,GAAGC;IAAU,CAAC,GAAGZ,KAAK;IAC7C,OACCa,aAAA,CAACpB,YAAY;MACZqB,WAAW,EAAG,KAAO;MAAA,GAChBF,SAAS;MACdf,SAAS,EAAGA;IAAW,CACvB,CAAC;EAEJ;EACA;EACA,MAAMkB,cAAc,GAAG1B,UAAU,CAChC,+BAA+B,EAC/BQ,SAAS,EACTE,OAAO,IAAK,MAAMA,OAAS,EAC5B,CAAC;EAED,OACCc,aAAA,CAAClB,qBAAqB;IAACqB,KAAK,EAAGZ;EAAoB,GAClDS,aAAA,CAACnB,gBAAgB;IAChBG,SAAS,EAAGkB,cAAgB;IAC5BjB,KAAK,EAAGA,KAAO;IACfG,GAAG,EAAGA,GAAK;IAAA,GACND;EAAK,CACV,CACqB,CAAC;AAE1B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMiB,OAAO,GAAG3B,UAAU,CAAEM,kBAAmB,CAAC;AACvD,eAAeqB,OAAO"}

package/build-module/toolbar/toolbar/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/toolbar/toolbar/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\nexport type ToolbarProps = {\n\t/**\n\t * Children to be rendered inside the toolbar.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * An accessible label for the toolbar.\n\t */\n\tlabel: string;\n};\n"],"mappings":""}
+{"version":3,"names":[],"sources":["@wordpress/components/src/toolbar/toolbar/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\nexport type ToolbarProps = {\n\t/**\n\t * Children to be rendered inside the toolbar.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * An accessible label for the toolbar.\n\t */\n\tlabel: string;\n\t/**\n\t * Specifies the toolbar's style.\n\t *\n\t * Leave undefined for the default style. Or `'unstyled'` which\n\t * removes the border from the toolbar, but keeps the default\n\t * popover style.\n\t *\n\t * @default undefined\n\t */\n\tvariant?: 'unstyled' | undefined;\n};\n"],"mappings":""}

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

@@ -120,10 +120,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 '../../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\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","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 { 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 '../../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\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 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';\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 * 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 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":""}

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

@@ -99,6 +99,114 @@ const allUnits = {
     label: isWeb ? 'pt' : __('Points (pt)'),
     a11yLabel: __('Points (pt)'),
     step: 1
+  },
+  svw: {
+    value: 'svw',
+    label: isWeb ? 'svw' : __('Small viewport width (svw)'),
+    a11yLabel: __('Small viewport width (svw)'),
+    step: 0.1
+  },
+  svh: {
+    value: 'svh',
+    label: isWeb ? 'svh' : __('Small viewport height (svh)'),
+    a11yLabel: __('Small viewport height (svh)'),
+    step: 0.1
+  },
+  svi: {
+    value: 'svi',
+    label: isWeb ? 'svi' : __('Viewport smallest size in the inline direction (svi)'),
+    a11yLabel: __('Small viewport width or height (svi)'),
+    step: 0.1
+  },
+  svb: {
+    value: 'svb',
+    label: isWeb ? 'svb' : __('Viewport smallest size in the block direction (svb)'),
+    a11yLabel: __('Small viewport width or height (svb)'),
+    step: 0.1
+  },
+  svmin: {
+    value: 'svmin',
+    label: isWeb ? 'svmin' : __('Small viewport smallest dimension (svmin)'),
+    a11yLabel: __('Small viewport smallest dimension (svmin)'),
+    step: 0.1
+  },
+  lvw: {
+    value: 'lvw',
+    label: isWeb ? 'lvw' : __('Large viewport width (lvw)'),
+    a11yLabel: __('Large viewport width (lvw)'),
+    step: 0.1
+  },
+  lvh: {
+    value: 'lvh',
+    label: isWeb ? 'lvh' : __('Large viewport height (lvh)'),
+    a11yLabel: __('Large viewport height (lvh)'),
+    step: 0.1
+  },
+  lvi: {
+    value: 'lvi',
+    label: isWeb ? 'lvi' : __('Large viewport width or height (lvi)'),
+    a11yLabel: __('Large viewport width or height (lvi)'),
+    step: 0.1
+  },
+  lvb: {
+    value: 'lvb',
+    label: isWeb ? 'lvb' : __('Large viewport width or height (lvb)'),
+    a11yLabel: __('Large viewport width or height (lvb)'),
+    step: 0.1
+  },
+  lvmin: {
+    value: 'lvmin',
+    label: isWeb ? 'lvmin' : __('Large viewport smallest dimension (lvmin)'),
+    a11yLabel: __('Large viewport smallest dimension (lvmin)'),
+    step: 0.1
+  },
+  dvw: {
+    value: 'dvw',
+    label: isWeb ? 'dvw' : __('Dynamic viewport width (dvw)'),
+    a11yLabel: __('Dynamic viewport width (dvw)'),
+    step: 0.1
+  },
+  dvh: {
+    value: 'dvh',
+    label: isWeb ? 'dvh' : __('Dynamic viewport height (dvh)'),
+    a11yLabel: __('Dynamic viewport height (dvh)'),
+    step: 0.1
+  },
+  dvi: {
+    value: 'dvi',
+    label: isWeb ? 'dvi' : __('Dynamic viewport width or height (dvi)'),
+    a11yLabel: __('Dynamic viewport width or height (dvi)'),
+    step: 0.1
+  },
+  dvb: {
+    value: 'dvb',
+    label: isWeb ? 'dvb' : __('Dynamic viewport width or height (dvb)'),
+    a11yLabel: __('Dynamic viewport width or height (dvb)'),
+    step: 0.1
+  },
+  dvmin: {
+    value: 'dvmin',
+    label: isWeb ? 'dvmin' : __('Dynamic viewport smallest dimension (dvmin)'),
+    a11yLabel: __('Dynamic viewport smallest dimension (dvmin)'),
+    step: 0.1
+  },
+  dvmax: {
+    value: 'dvmax',
+    label: isWeb ? 'dvmax' : __('Dynamic viewport largest dimension (dvmax)'),
+    a11yLabel: __('Dynamic viewport largest dimension (dvmax)'),
+    step: 0.1
+  },
+  svmax: {
+    value: 'svmax',
+    label: isWeb ? 'svmax' : __('Small viewport largest dimension (svmax)'),
+    a11yLabel: __('Small viewport largest dimension (svmax)'),
+    step: 0.1
+  },
+  lvmax: {
+    value: 'lvmax',
+    label: isWeb ? 'lvmax' : __('Large viewport largest dimension (lvmax)'),
+    a11yLabel: __('Large viewport largest dimension (lvmax)'),
+    step: 0.1
   }
 };
 

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

@@ -1 +1 @@
-{"version":3,"names":["__","_x","Platform","isWeb","OS","allUnits","px","value","label","a11yLabel","step","em","rem","vw","vh","vmin","vmax","ch","ex","cm","mm","in","pc","pt","ALL_CSS_UNITS","Object","values","CSS_UNITS","DEFAULT_UNIT","getParsedQuantityAndUnit","rawValue","fallbackUnit","allowedUnits","initialValue","parseQuantityAndUnitFromRawValue","hasUnits","units","Array","isArray","length","trimmedValue","quantityToReturn","trim","parsedQuantity","parseFloat","isFinite","undefined","unitMatch","match","matchedUnit","toLowerCase","unitToReturn","find","item","getValidParsedQuantityAndUnit","fallbackQuantity","parsedUnit","getAccessibleLabelForUnit","unit","filterUnitsWithSettings","allowedUnitValues","availableUnits","filter","includes","useCustomUnits","defaultValues","customUnitsToReturn","forEach","i","parsedDefaultValue","default","getUnitsWithCurrentUnit","legacyUnit","unitsToReturn","currentUnit","some","unshift"],"sources":["@wordpress/components/src/unit-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, _x } from '@wordpress/i18n';\nimport { Platform } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WPUnitControlUnit } from './types';\n\nconst isWeb = Platform.OS === 'web';\n\nconst allUnits: Record< string, WPUnitControlUnit > = {\n\tpx: {\n\t\tvalue: 'px',\n\t\tlabel: isWeb ? 'px' : __( 'Pixels (px)' ),\n\t\ta11yLabel: __( 'Pixels (px)' ),\n\t\tstep: 1,\n\t},\n\t'%': {\n\t\tvalue: '%',\n\t\tlabel: isWeb ? '%' : __( 'Percentage (%)' ),\n\t\ta11yLabel: __( 'Percent (%)' ),\n\t\tstep: 0.1,\n\t},\n\tem: {\n\t\tvalue: 'em',\n\t\tlabel: isWeb ? 'em' : __( 'Relative to parent font size (em)' ),\n\t\ta11yLabel: _x( 'ems', 'Relative to parent font size (em)' ),\n\t\tstep: 0.01,\n\t},\n\trem: {\n\t\tvalue: 'rem',\n\t\tlabel: isWeb ? 'rem' : __( 'Relative to root font size (rem)' ),\n\t\ta11yLabel: _x( 'rems', 'Relative to root font size (rem)' ),\n\t\tstep: 0.01,\n\t},\n\tvw: {\n\t\tvalue: 'vw',\n\t\tlabel: isWeb ? 'vw' : __( 'Viewport width (vw)' ),\n\t\ta11yLabel: __( 'Viewport width (vw)' ),\n\t\tstep: 0.1,\n\t},\n\tvh: {\n\t\tvalue: 'vh',\n\t\tlabel: isWeb ? 'vh' : __( 'Viewport height (vh)' ),\n\t\ta11yLabel: __( 'Viewport height (vh)' ),\n\t\tstep: 0.1,\n\t},\n\tvmin: {\n\t\tvalue: 'vmin',\n\t\tlabel: isWeb ? 'vmin' : __( 'Viewport smallest dimension (vmin)' ),\n\t\ta11yLabel: __( 'Viewport smallest dimension (vmin)' ),\n\t\tstep: 0.1,\n\t},\n\tvmax: {\n\t\tvalue: 'vmax',\n\t\tlabel: isWeb ? 'vmax' : __( 'Viewport largest dimension (vmax)' ),\n\t\ta11yLabel: __( 'Viewport largest dimension (vmax)' ),\n\t\tstep: 0.1,\n\t},\n\tch: {\n\t\tvalue: 'ch',\n\t\tlabel: isWeb ? 'ch' : __( 'Width of the zero (0) character (ch)' ),\n\t\ta11yLabel: __( 'Width of the zero (0) character (ch)' ),\n\t\tstep: 0.01,\n\t},\n\tex: {\n\t\tvalue: 'ex',\n\t\tlabel: isWeb ? 'ex' : __( 'x-height of the font (ex)' ),\n\t\ta11yLabel: __( 'x-height of the font (ex)' ),\n\t\tstep: 0.01,\n\t},\n\tcm: {\n\t\tvalue: 'cm',\n\t\tlabel: isWeb ? 'cm' : __( 'Centimeters (cm)' ),\n\t\ta11yLabel: __( 'Centimeters (cm)' ),\n\t\tstep: 0.001,\n\t},\n\tmm: {\n\t\tvalue: 'mm',\n\t\tlabel: isWeb ? 'mm' : __( 'Millimeters (mm)' ),\n\t\ta11yLabel: __( 'Millimeters (mm)' ),\n\t\tstep: 0.1,\n\t},\n\tin: {\n\t\tvalue: 'in',\n\t\tlabel: isWeb ? 'in' : __( 'Inches (in)' ),\n\t\ta11yLabel: __( 'Inches (in)' ),\n\t\tstep: 0.001,\n\t},\n\tpc: {\n\t\tvalue: 'pc',\n\t\tlabel: isWeb ? 'pc' : __( 'Picas (pc)' ),\n\t\ta11yLabel: __( 'Picas (pc)' ),\n\t\tstep: 1,\n\t},\n\tpt: {\n\t\tvalue: 'pt',\n\t\tlabel: isWeb ? 'pt' : __( 'Points (pt)' ),\n\t\ta11yLabel: __( 'Points (pt)' ),\n\t\tstep: 1,\n\t},\n};\n\n/**\n * An array of all available CSS length units.\n */\nexport const ALL_CSS_UNITS = Object.values( allUnits );\n\n/**\n * Units of measurements. `a11yLabel` is used by screenreaders.\n */\nexport const CSS_UNITS = [\n\tallUnits.px,\n\tallUnits[ '%' ],\n\tallUnits.em,\n\tallUnits.rem,\n\tallUnits.vw,\n\tallUnits.vh,\n];\n\nexport const DEFAULT_UNIT = allUnits.px;\n\n/**\n * Handles legacy value + unit handling.\n * This component use to manage both incoming value and units separately.\n *\n * Moving forward, ideally the value should be a string that contains both\n * the value and unit, example: '10px'\n *\n * @param rawValue     The raw value as a string (may or may not contain the unit)\n * @param fallbackUnit The unit used as a fallback, if not unit is detected in the `value`\n * @param allowedUnits Units to derive from.\n * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value\n * could not be parsed to a number correctly. The unit can be `undefined` in case the unit parse\n * from the raw value could not be matched against the list of allowed units.\n */\nexport function getParsedQuantityAndUnit(\n\trawValue?: string | number,\n\tfallbackUnit?: string,\n\tallowedUnits?: WPUnitControlUnit[]\n): [ number | undefined, string | undefined ] {\n\tconst initialValue = fallbackUnit\n\t\t? `${ rawValue ?? '' }${ fallbackUnit }`\n\t\t: rawValue;\n\n\treturn parseQuantityAndUnitFromRawValue( initialValue, allowedUnits );\n}\n\n/**\n * Checks if units are defined.\n *\n * @param units List of units.\n * @return Whether the list actually contains any units.\n */\nexport function hasUnits(\n\tunits?: WPUnitControlUnit[]\n): units is WPUnitControlUnit[] {\n\t// Although the `isArray` check shouldn't be necessary (given the signature of\n\t// this typed function), it's better to stay on the side of caution, since\n\t// this function may be called from un-typed environments.\n\treturn Array.isArray( units ) && !! units.length;\n}\n\n/**\n * Parses a quantity and unit from a raw string value, given a list of allowed\n * units and otherwise falling back to the default unit.\n *\n * @param rawValue     The raw value as a string (may or may not contain the unit)\n * @param allowedUnits Units to derive from.\n * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value\n * could not be parsed to a number correctly. The unit can be `undefined` in case the unit parsed\n * from the raw value could not be matched against the list of allowed units.\n */\nexport function parseQuantityAndUnitFromRawValue(\n\trawValue?: string | number,\n\tallowedUnits: WPUnitControlUnit[] = ALL_CSS_UNITS\n): [ number | undefined, string | undefined ] {\n\tlet trimmedValue;\n\tlet quantityToReturn;\n\n\tif ( typeof rawValue !== 'undefined' || rawValue === null ) {\n\t\ttrimmedValue = `${ rawValue }`.trim();\n\t\tconst parsedQuantity = parseFloat( trimmedValue );\n\t\tquantityToReturn = ! isFinite( parsedQuantity )\n\t\t\t? undefined\n\t\t\t: parsedQuantity;\n\t}\n\n\tconst unitMatch = trimmedValue?.match( /[\\d.\\-\\+]*\\s*(.*)/ );\n\tconst matchedUnit = unitMatch?.[ 1 ]?.toLowerCase();\n\tlet unitToReturn: string | undefined;\n\tif ( hasUnits( allowedUnits ) ) {\n\t\tconst match = allowedUnits.find(\n\t\t\t( item ) => item.value === matchedUnit\n\t\t);\n\t\tunitToReturn = match?.value;\n\t} else {\n\t\tunitToReturn = DEFAULT_UNIT.value;\n\t}\n\n\treturn [ quantityToReturn, unitToReturn ];\n}\n\n/**\n * Parses quantity and unit from a raw value. Validates parsed value, using fallback\n * value if invalid.\n *\n * @param rawValue         The next value.\n * @param allowedUnits     Units to derive from.\n * @param fallbackQuantity The fallback quantity, used in case it's not possible to parse a valid quantity from the raw value.\n * @param fallbackUnit     The fallback unit, used in case it's not possible to parse a valid unit from the raw value.\n * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value\n * could not be parsed to a number correctly, and the `fallbackQuantity` was also `undefined`. The\n * unit can be `undefined` only if the unit parsed from the raw value could not be matched against\n * the list of allowed units, the `fallbackQuantity` is also `undefined` and the list of\n * `allowedUnits` is passed empty.\n */\nexport function getValidParsedQuantityAndUnit(\n\trawValue: string | number,\n\tallowedUnits?: WPUnitControlUnit[],\n\tfallbackQuantity?: number,\n\tfallbackUnit?: string\n): [ number | undefined, string | undefined ] {\n\tconst [ parsedQuantity, parsedUnit ] = parseQuantityAndUnitFromRawValue(\n\t\trawValue,\n\t\tallowedUnits\n\t);\n\n\t// The parsed value from `parseQuantityAndUnitFromRawValue` should now be\n\t// either a real number or undefined. If undefined, use the fallback value.\n\tconst quantityToReturn = parsedQuantity ?? fallbackQuantity;\n\n\t// If no unit is parsed from the raw value, or if the fallback unit is not\n\t// defined, use the first value from the list of allowed units as fallback.\n\tlet unitToReturn = parsedUnit || fallbackUnit;\n\n\tif ( ! unitToReturn && hasUnits( allowedUnits ) ) {\n\t\tunitToReturn = allowedUnits[ 0 ].value;\n\t}\n\n\treturn [ quantityToReturn, unitToReturn ];\n}\n\n/**\n * Takes a unit value and finds the matching accessibility label for the\n * unit abbreviation.\n *\n * @param unit Unit value (example: `px`)\n * @return a11y label for the unit abbreviation\n */\nexport function getAccessibleLabelForUnit( unit: string ): string | undefined {\n\tconst match = ALL_CSS_UNITS.find( ( item ) => item.value === unit );\n\treturn match?.a11yLabel ? match?.a11yLabel : match?.value;\n}\n\n/**\n * Filters available units based on values defined a list of allowed unit values.\n *\n * @param allowedUnitValues Collection of allowed unit value strings.\n * @param availableUnits    Collection of available unit objects.\n * @return Filtered units.\n */\nexport function filterUnitsWithSettings(\n\tallowedUnitValues: string[] = [],\n\tavailableUnits: WPUnitControlUnit[]\n): WPUnitControlUnit[] {\n\t// Although the `isArray` check shouldn't be necessary (given the signature of\n\t// this typed function), it's better to stay on the side of caution, since\n\t// this function may be called from un-typed environments.\n\treturn Array.isArray( availableUnits )\n\t\t? availableUnits.filter( ( unit ) =>\n\t\t\t\tallowedUnitValues.includes( unit.value )\n\t\t  )\n\t\t: [];\n}\n\n/**\n * Custom hook to retrieve and consolidate units setting from add_theme_support().\n * TODO: ideally this hook shouldn't be needed\n * https://github.com/WordPress/gutenberg/pull/31822#discussion_r633280823\n *\n * @param args                An object containing units, settingPath & defaultUnits.\n * @param args.units          Collection of all potentially available units.\n * @param args.availableUnits Collection of unit value strings for filtering available units.\n * @param args.defaultValues  Collection of default values for defined units. Example: `{ px: 350, em: 15 }`.\n *\n * @return Filtered list of units, with their default values updated following the `defaultValues`\n * argument's property.\n */\nexport const useCustomUnits = ( {\n\tunits = ALL_CSS_UNITS,\n\tavailableUnits = [],\n\tdefaultValues,\n}: {\n\tunits?: WPUnitControlUnit[];\n\tavailableUnits?: string[];\n\tdefaultValues?: Record< string, number >;\n} ): WPUnitControlUnit[] => {\n\tconst customUnitsToReturn = filterUnitsWithSettings(\n\t\tavailableUnits,\n\t\tunits\n\t);\n\n\tif ( defaultValues ) {\n\t\tcustomUnitsToReturn.forEach( ( unit, i ) => {\n\t\t\tif ( defaultValues[ unit.value ] ) {\n\t\t\t\tconst [ parsedDefaultValue ] = parseQuantityAndUnitFromRawValue(\n\t\t\t\t\tdefaultValues[ unit.value ]\n\t\t\t\t);\n\n\t\t\t\tcustomUnitsToReturn[ i ].default = parsedDefaultValue;\n\t\t\t}\n\t\t} );\n\t}\n\n\treturn customUnitsToReturn;\n};\n\n/**\n * Get available units with the unit for the currently selected value\n * prepended if it is not available in the list of units.\n *\n * This is useful to ensure that the current value's unit is always\n * accurately displayed in the UI, even if the intention is to hide\n * the availability of that unit.\n *\n * @param rawValue   Selected value to parse.\n * @param legacyUnit Legacy unit value, if rawValue needs it appended.\n * @param units      List of available units.\n *\n * @return A collection of units containing the unit for the current value.\n */\nexport function getUnitsWithCurrentUnit(\n\trawValue?: string | number,\n\tlegacyUnit?: string,\n\tunits: WPUnitControlUnit[] = ALL_CSS_UNITS\n): WPUnitControlUnit[] {\n\tconst unitsToReturn = Array.isArray( units ) ? [ ...units ] : [];\n\tconst [ , currentUnit ] = getParsedQuantityAndUnit(\n\t\trawValue,\n\t\tlegacyUnit,\n\t\tALL_CSS_UNITS\n\t);\n\n\tif (\n\t\tcurrentUnit &&\n\t\t! unitsToReturn.some( ( unit ) => unit.value === currentUnit )\n\t) {\n\t\tif ( allUnits[ currentUnit ] ) {\n\t\t\tunitsToReturn.unshift( allUnits[ currentUnit ] );\n\t\t}\n\t}\n\n\treturn unitsToReturn;\n}\n"],"mappings":"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"}
+{"version":3,"names":["__","_x","Platform","isWeb","OS","allUnits","px","value","label","a11yLabel","step","em","rem","vw","vh","vmin","vmax","ch","ex","cm","mm","in","pc","pt","svw","svh","svi","svb","svmin","lvw","lvh","lvi","lvb","lvmin","dvw","dvh","dvi","dvb","dvmin","dvmax","svmax","lvmax","ALL_CSS_UNITS","Object","values","CSS_UNITS","DEFAULT_UNIT","getParsedQuantityAndUnit","rawValue","fallbackUnit","allowedUnits","initialValue","parseQuantityAndUnitFromRawValue","hasUnits","units","Array","isArray","length","trimmedValue","quantityToReturn","trim","parsedQuantity","parseFloat","isFinite","undefined","unitMatch","match","matchedUnit","toLowerCase","unitToReturn","find","item","getValidParsedQuantityAndUnit","fallbackQuantity","parsedUnit","getAccessibleLabelForUnit","unit","filterUnitsWithSettings","allowedUnitValues","availableUnits","filter","includes","useCustomUnits","defaultValues","customUnitsToReturn","forEach","i","parsedDefaultValue","default","getUnitsWithCurrentUnit","legacyUnit","unitsToReturn","currentUnit","some","unshift"],"sources":["@wordpress/components/src/unit-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, _x } from '@wordpress/i18n';\nimport { Platform } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WPUnitControlUnit } from './types';\n\nconst isWeb = Platform.OS === 'web';\n\nconst allUnits: Record< string, WPUnitControlUnit > = {\n\tpx: {\n\t\tvalue: 'px',\n\t\tlabel: isWeb ? 'px' : __( 'Pixels (px)' ),\n\t\ta11yLabel: __( 'Pixels (px)' ),\n\t\tstep: 1,\n\t},\n\t'%': {\n\t\tvalue: '%',\n\t\tlabel: isWeb ? '%' : __( 'Percentage (%)' ),\n\t\ta11yLabel: __( 'Percent (%)' ),\n\t\tstep: 0.1,\n\t},\n\tem: {\n\t\tvalue: 'em',\n\t\tlabel: isWeb ? 'em' : __( 'Relative to parent font size (em)' ),\n\t\ta11yLabel: _x( 'ems', 'Relative to parent font size (em)' ),\n\t\tstep: 0.01,\n\t},\n\trem: {\n\t\tvalue: 'rem',\n\t\tlabel: isWeb ? 'rem' : __( 'Relative to root font size (rem)' ),\n\t\ta11yLabel: _x( 'rems', 'Relative to root font size (rem)' ),\n\t\tstep: 0.01,\n\t},\n\tvw: {\n\t\tvalue: 'vw',\n\t\tlabel: isWeb ? 'vw' : __( 'Viewport width (vw)' ),\n\t\ta11yLabel: __( 'Viewport width (vw)' ),\n\t\tstep: 0.1,\n\t},\n\tvh: {\n\t\tvalue: 'vh',\n\t\tlabel: isWeb ? 'vh' : __( 'Viewport height (vh)' ),\n\t\ta11yLabel: __( 'Viewport height (vh)' ),\n\t\tstep: 0.1,\n\t},\n\tvmin: {\n\t\tvalue: 'vmin',\n\t\tlabel: isWeb ? 'vmin' : __( 'Viewport smallest dimension (vmin)' ),\n\t\ta11yLabel: __( 'Viewport smallest dimension (vmin)' ),\n\t\tstep: 0.1,\n\t},\n\tvmax: {\n\t\tvalue: 'vmax',\n\t\tlabel: isWeb ? 'vmax' : __( 'Viewport largest dimension (vmax)' ),\n\t\ta11yLabel: __( 'Viewport largest dimension (vmax)' ),\n\t\tstep: 0.1,\n\t},\n\tch: {\n\t\tvalue: 'ch',\n\t\tlabel: isWeb ? 'ch' : __( 'Width of the zero (0) character (ch)' ),\n\t\ta11yLabel: __( 'Width of the zero (0) character (ch)' ),\n\t\tstep: 0.01,\n\t},\n\tex: {\n\t\tvalue: 'ex',\n\t\tlabel: isWeb ? 'ex' : __( 'x-height of the font (ex)' ),\n\t\ta11yLabel: __( 'x-height of the font (ex)' ),\n\t\tstep: 0.01,\n\t},\n\tcm: {\n\t\tvalue: 'cm',\n\t\tlabel: isWeb ? 'cm' : __( 'Centimeters (cm)' ),\n\t\ta11yLabel: __( 'Centimeters (cm)' ),\n\t\tstep: 0.001,\n\t},\n\tmm: {\n\t\tvalue: 'mm',\n\t\tlabel: isWeb ? 'mm' : __( 'Millimeters (mm)' ),\n\t\ta11yLabel: __( 'Millimeters (mm)' ),\n\t\tstep: 0.1,\n\t},\n\tin: {\n\t\tvalue: 'in',\n\t\tlabel: isWeb ? 'in' : __( 'Inches (in)' ),\n\t\ta11yLabel: __( 'Inches (in)' ),\n\t\tstep: 0.001,\n\t},\n\tpc: {\n\t\tvalue: 'pc',\n\t\tlabel: isWeb ? 'pc' : __( 'Picas (pc)' ),\n\t\ta11yLabel: __( 'Picas (pc)' ),\n\t\tstep: 1,\n\t},\n\tpt: {\n\t\tvalue: 'pt',\n\t\tlabel: isWeb ? 'pt' : __( 'Points (pt)' ),\n\t\ta11yLabel: __( 'Points (pt)' ),\n\t\tstep: 1,\n\t},\n\tsvw: {\n\t\tvalue: 'svw',\n\t\tlabel: isWeb ? 'svw' : __( 'Small viewport width (svw)' ),\n\t\ta11yLabel: __( 'Small viewport width (svw)' ),\n\t\tstep: 0.1,\n\t},\n\tsvh: {\n\t\tvalue: 'svh',\n\t\tlabel: isWeb ? 'svh' : __( 'Small viewport height (svh)' ),\n\t\ta11yLabel: __( 'Small viewport height (svh)' ),\n\t\tstep: 0.1,\n\t},\n\tsvi: {\n\t\tvalue: 'svi',\n\t\tlabel: isWeb\n\t\t\t? 'svi'\n\t\t\t: __( 'Viewport smallest size in the inline direction (svi)' ),\n\t\ta11yLabel: __( 'Small viewport width or height (svi)' ),\n\t\tstep: 0.1,\n\t},\n\tsvb: {\n\t\tvalue: 'svb',\n\t\tlabel: isWeb\n\t\t\t? 'svb'\n\t\t\t: __( 'Viewport smallest size in the block direction (svb)' ),\n\t\ta11yLabel: __( 'Small viewport width or height (svb)' ),\n\t\tstep: 0.1,\n\t},\n\tsvmin: {\n\t\tvalue: 'svmin',\n\t\tlabel: isWeb\n\t\t\t? 'svmin'\n\t\t\t: __( 'Small viewport smallest dimension (svmin)' ),\n\t\ta11yLabel: __( 'Small viewport smallest dimension (svmin)' ),\n\t\tstep: 0.1,\n\t},\n\tlvw: {\n\t\tvalue: 'lvw',\n\t\tlabel: isWeb ? 'lvw' : __( 'Large viewport width (lvw)' ),\n\t\ta11yLabel: __( 'Large viewport width (lvw)' ),\n\t\tstep: 0.1,\n\t},\n\tlvh: {\n\t\tvalue: 'lvh',\n\t\tlabel: isWeb ? 'lvh' : __( 'Large viewport height (lvh)' ),\n\t\ta11yLabel: __( 'Large viewport height (lvh)' ),\n\t\tstep: 0.1,\n\t},\n\tlvi: {\n\t\tvalue: 'lvi',\n\t\tlabel: isWeb ? 'lvi' : __( 'Large viewport width or height (lvi)' ),\n\t\ta11yLabel: __( 'Large viewport width or height (lvi)' ),\n\t\tstep: 0.1,\n\t},\n\tlvb: {\n\t\tvalue: 'lvb',\n\t\tlabel: isWeb ? 'lvb' : __( 'Large viewport width or height (lvb)' ),\n\t\ta11yLabel: __( 'Large viewport width or height (lvb)' ),\n\t\tstep: 0.1,\n\t},\n\tlvmin: {\n\t\tvalue: 'lvmin',\n\t\tlabel: isWeb\n\t\t\t? 'lvmin'\n\t\t\t: __( 'Large viewport smallest dimension (lvmin)' ),\n\t\ta11yLabel: __( 'Large viewport smallest dimension (lvmin)' ),\n\t\tstep: 0.1,\n\t},\n\tdvw: {\n\t\tvalue: 'dvw',\n\t\tlabel: isWeb ? 'dvw' : __( 'Dynamic viewport width (dvw)' ),\n\t\ta11yLabel: __( 'Dynamic viewport width (dvw)' ),\n\t\tstep: 0.1,\n\t},\n\tdvh: {\n\t\tvalue: 'dvh',\n\t\tlabel: isWeb ? 'dvh' : __( 'Dynamic viewport height (dvh)' ),\n\t\ta11yLabel: __( 'Dynamic viewport height (dvh)' ),\n\t\tstep: 0.1,\n\t},\n\tdvi: {\n\t\tvalue: 'dvi',\n\t\tlabel: isWeb ? 'dvi' : __( 'Dynamic viewport width or height (dvi)' ),\n\t\ta11yLabel: __( 'Dynamic viewport width or height (dvi)' ),\n\t\tstep: 0.1,\n\t},\n\tdvb: {\n\t\tvalue: 'dvb',\n\t\tlabel: isWeb ? 'dvb' : __( 'Dynamic viewport width or height (dvb)' ),\n\t\ta11yLabel: __( 'Dynamic viewport width or height (dvb)' ),\n\t\tstep: 0.1,\n\t},\n\tdvmin: {\n\t\tvalue: 'dvmin',\n\t\tlabel: isWeb\n\t\t\t? 'dvmin'\n\t\t\t: __( 'Dynamic viewport smallest dimension (dvmin)' ),\n\t\ta11yLabel: __( 'Dynamic viewport smallest dimension (dvmin)' ),\n\t\tstep: 0.1,\n\t},\n\tdvmax: {\n\t\tvalue: 'dvmax',\n\t\tlabel: isWeb\n\t\t\t? 'dvmax'\n\t\t\t: __( 'Dynamic viewport largest dimension (dvmax)' ),\n\t\ta11yLabel: __( 'Dynamic viewport largest dimension (dvmax)' ),\n\t\tstep: 0.1,\n\t},\n\tsvmax: {\n\t\tvalue: 'svmax',\n\t\tlabel: isWeb\n\t\t\t? 'svmax'\n\t\t\t: __( 'Small viewport largest dimension (svmax)' ),\n\t\ta11yLabel: __( 'Small viewport largest dimension (svmax)' ),\n\t\tstep: 0.1,\n\t},\n\tlvmax: {\n\t\tvalue: 'lvmax',\n\t\tlabel: isWeb\n\t\t\t? 'lvmax'\n\t\t\t: __( 'Large viewport largest dimension (lvmax)' ),\n\t\ta11yLabel: __( 'Large viewport largest dimension (lvmax)' ),\n\t\tstep: 0.1,\n\t},\n};\n\n/**\n * An array of all available CSS length units.\n */\nexport const ALL_CSS_UNITS = Object.values( allUnits );\n\n/**\n * Units of measurements. `a11yLabel` is used by screenreaders.\n */\nexport const CSS_UNITS = [\n\tallUnits.px,\n\tallUnits[ '%' ],\n\tallUnits.em,\n\tallUnits.rem,\n\tallUnits.vw,\n\tallUnits.vh,\n];\n\nexport const DEFAULT_UNIT = allUnits.px;\n\n/**\n * Handles legacy value + unit handling.\n * This component use to manage both incoming value and units separately.\n *\n * Moving forward, ideally the value should be a string that contains both\n * the value and unit, example: '10px'\n *\n * @param rawValue     The raw value as a string (may or may not contain the unit)\n * @param fallbackUnit The unit used as a fallback, if not unit is detected in the `value`\n * @param allowedUnits Units to derive from.\n * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value\n * could not be parsed to a number correctly. The unit can be `undefined` in case the unit parse\n * from the raw value could not be matched against the list of allowed units.\n */\nexport function getParsedQuantityAndUnit(\n\trawValue?: string | number,\n\tfallbackUnit?: string,\n\tallowedUnits?: WPUnitControlUnit[]\n): [ number | undefined, string | undefined ] {\n\tconst initialValue = fallbackUnit\n\t\t? `${ rawValue ?? '' }${ fallbackUnit }`\n\t\t: rawValue;\n\n\treturn parseQuantityAndUnitFromRawValue( initialValue, allowedUnits );\n}\n\n/**\n * Checks if units are defined.\n *\n * @param units List of units.\n * @return Whether the list actually contains any units.\n */\nexport function hasUnits(\n\tunits?: WPUnitControlUnit[]\n): units is WPUnitControlUnit[] {\n\t// Although the `isArray` check shouldn't be necessary (given the signature of\n\t// this typed function), it's better to stay on the side of caution, since\n\t// this function may be called from un-typed environments.\n\treturn Array.isArray( units ) && !! units.length;\n}\n\n/**\n * Parses a quantity and unit from a raw string value, given a list of allowed\n * units and otherwise falling back to the default unit.\n *\n * @param rawValue     The raw value as a string (may or may not contain the unit)\n * @param allowedUnits Units to derive from.\n * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value\n * could not be parsed to a number correctly. The unit can be `undefined` in case the unit parsed\n * from the raw value could not be matched against the list of allowed units.\n */\nexport function parseQuantityAndUnitFromRawValue(\n\trawValue?: string | number,\n\tallowedUnits: WPUnitControlUnit[] = ALL_CSS_UNITS\n): [ number | undefined, string | undefined ] {\n\tlet trimmedValue;\n\tlet quantityToReturn;\n\n\tif ( typeof rawValue !== 'undefined' || rawValue === null ) {\n\t\ttrimmedValue = `${ rawValue }`.trim();\n\t\tconst parsedQuantity = parseFloat( trimmedValue );\n\t\tquantityToReturn = ! isFinite( parsedQuantity )\n\t\t\t? undefined\n\t\t\t: parsedQuantity;\n\t}\n\n\tconst unitMatch = trimmedValue?.match( /[\\d.\\-\\+]*\\s*(.*)/ );\n\tconst matchedUnit = unitMatch?.[ 1 ]?.toLowerCase();\n\tlet unitToReturn: string | undefined;\n\tif ( hasUnits( allowedUnits ) ) {\n\t\tconst match = allowedUnits.find(\n\t\t\t( item ) => item.value === matchedUnit\n\t\t);\n\t\tunitToReturn = match?.value;\n\t} else {\n\t\tunitToReturn = DEFAULT_UNIT.value;\n\t}\n\n\treturn [ quantityToReturn, unitToReturn ];\n}\n\n/**\n * Parses quantity and unit from a raw value. Validates parsed value, using fallback\n * value if invalid.\n *\n * @param rawValue         The next value.\n * @param allowedUnits     Units to derive from.\n * @param fallbackQuantity The fallback quantity, used in case it's not possible to parse a valid quantity from the raw value.\n * @param fallbackUnit     The fallback unit, used in case it's not possible to parse a valid unit from the raw value.\n * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value\n * could not be parsed to a number correctly, and the `fallbackQuantity` was also `undefined`. The\n * unit can be `undefined` only if the unit parsed from the raw value could not be matched against\n * the list of allowed units, the `fallbackQuantity` is also `undefined` and the list of\n * `allowedUnits` is passed empty.\n */\nexport function getValidParsedQuantityAndUnit(\n\trawValue: string | number,\n\tallowedUnits?: WPUnitControlUnit[],\n\tfallbackQuantity?: number,\n\tfallbackUnit?: string\n): [ number | undefined, string | undefined ] {\n\tconst [ parsedQuantity, parsedUnit ] = parseQuantityAndUnitFromRawValue(\n\t\trawValue,\n\t\tallowedUnits\n\t);\n\n\t// The parsed value from `parseQuantityAndUnitFromRawValue` should now be\n\t// either a real number or undefined. If undefined, use the fallback value.\n\tconst quantityToReturn = parsedQuantity ?? fallbackQuantity;\n\n\t// If no unit is parsed from the raw value, or if the fallback unit is not\n\t// defined, use the first value from the list of allowed units as fallback.\n\tlet unitToReturn = parsedUnit || fallbackUnit;\n\n\tif ( ! unitToReturn && hasUnits( allowedUnits ) ) {\n\t\tunitToReturn = allowedUnits[ 0 ].value;\n\t}\n\n\treturn [ quantityToReturn, unitToReturn ];\n}\n\n/**\n * Takes a unit value and finds the matching accessibility label for the\n * unit abbreviation.\n *\n * @param unit Unit value (example: `px`)\n * @return a11y label for the unit abbreviation\n */\nexport function getAccessibleLabelForUnit( unit: string ): string | undefined {\n\tconst match = ALL_CSS_UNITS.find( ( item ) => item.value === unit );\n\treturn match?.a11yLabel ? match?.a11yLabel : match?.value;\n}\n\n/**\n * Filters available units based on values defined a list of allowed unit values.\n *\n * @param allowedUnitValues Collection of allowed unit value strings.\n * @param availableUnits    Collection of available unit objects.\n * @return Filtered units.\n */\nexport function filterUnitsWithSettings(\n\tallowedUnitValues: string[] = [],\n\tavailableUnits: WPUnitControlUnit[]\n): WPUnitControlUnit[] {\n\t// Although the `isArray` check shouldn't be necessary (given the signature of\n\t// this typed function), it's better to stay on the side of caution, since\n\t// this function may be called from un-typed environments.\n\treturn Array.isArray( availableUnits )\n\t\t? availableUnits.filter( ( unit ) =>\n\t\t\t\tallowedUnitValues.includes( unit.value )\n\t\t  )\n\t\t: [];\n}\n\n/**\n * Custom hook to retrieve and consolidate units setting from add_theme_support().\n * TODO: ideally this hook shouldn't be needed\n * https://github.com/WordPress/gutenberg/pull/31822#discussion_r633280823\n *\n * @param args                An object containing units, settingPath & defaultUnits.\n * @param args.units          Collection of all potentially available units.\n * @param args.availableUnits Collection of unit value strings for filtering available units.\n * @param args.defaultValues  Collection of default values for defined units. Example: `{ px: 350, em: 15 }`.\n *\n * @return Filtered list of units, with their default values updated following the `defaultValues`\n * argument's property.\n */\nexport const useCustomUnits = ( {\n\tunits = ALL_CSS_UNITS,\n\tavailableUnits = [],\n\tdefaultValues,\n}: {\n\tunits?: WPUnitControlUnit[];\n\tavailableUnits?: string[];\n\tdefaultValues?: Record< string, number >;\n} ): WPUnitControlUnit[] => {\n\tconst customUnitsToReturn = filterUnitsWithSettings(\n\t\tavailableUnits,\n\t\tunits\n\t);\n\n\tif ( defaultValues ) {\n\t\tcustomUnitsToReturn.forEach( ( unit, i ) => {\n\t\t\tif ( defaultValues[ unit.value ] ) {\n\t\t\t\tconst [ parsedDefaultValue ] = parseQuantityAndUnitFromRawValue(\n\t\t\t\t\tdefaultValues[ unit.value ]\n\t\t\t\t);\n\n\t\t\t\tcustomUnitsToReturn[ i ].default = parsedDefaultValue;\n\t\t\t}\n\t\t} );\n\t}\n\n\treturn customUnitsToReturn;\n};\n\n/**\n * Get available units with the unit for the currently selected value\n * prepended if it is not available in the list of units.\n *\n * This is useful to ensure that the current value's unit is always\n * accurately displayed in the UI, even if the intention is to hide\n * the availability of that unit.\n *\n * @param rawValue   Selected value to parse.\n * @param legacyUnit Legacy unit value, if rawValue needs it appended.\n * @param units      List of available units.\n *\n * @return A collection of units containing the unit for the current value.\n */\nexport function getUnitsWithCurrentUnit(\n\trawValue?: string | number,\n\tlegacyUnit?: string,\n\tunits: WPUnitControlUnit[] = ALL_CSS_UNITS\n): WPUnitControlUnit[] {\n\tconst unitsToReturn = Array.isArray( units ) ? [ ...units ] : [];\n\tconst [ , currentUnit ] = getParsedQuantityAndUnit(\n\t\trawValue,\n\t\tlegacyUnit,\n\t\tALL_CSS_UNITS\n\t);\n\n\tif (\n\t\tcurrentUnit &&\n\t\t! unitsToReturn.some( ( unit ) => unit.value === currentUnit )\n\t) {\n\t\tif ( allUnits[ currentUnit ] ) {\n\t\t\tunitsToReturn.unshift( allUnits[ currentUnit ] );\n\t\t}\n\t}\n\n\treturn unitsToReturn;\n}\n"],"mappings":"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"}

package/build-module/utils/unit-values.js

@@ -1,4 +1,4 @@
-const UNITED_VALUE_REGEX = /^([\d.\-+]*)\s*(fr|cm|mm|Q|in|pc|pt|px|em|ex|ch|rem|lh|vw|vh|vmin|vmax|%|cap|ic|rlh|vi|vb|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?$/;
+const UNITED_VALUE_REGEX = /^([\d.\-+]*)\s*(fr|cm|mm|Q|in|pc|pt|px|em|ex|ch|rem|lh|vw|vh|vmin|vmax|%|cap|ic|rlh|vi|vb|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx|svw|lvw|dvw|svh|lvh|dvh|svi|lvi|dvi|svb|lvb|dvb|svmin|lvmin|dvmin|svmax|lvmax|dvmax)?$/;
 
 /**
  * Parses a number and unit from a value.

package/build-module/utils/unit-values.js.map

@@ -1 +1 @@
-{"version":3,"names":["UNITED_VALUE_REGEX","parseCSSUnitValue","toParse","value","trim","matched","match","undefined","num","unit","numParsed","parseFloat","Number","isNaN","createCSSUnitValue"],"sources":["@wordpress/components/src/utils/unit-values.ts"],"sourcesContent":["const UNITED_VALUE_REGEX =\n\t/^([\\d.\\-+]*)\\s*(fr|cm|mm|Q|in|pc|pt|px|em|ex|ch|rem|lh|vw|vh|vmin|vmax|%|cap|ic|rlh|vi|vb|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?$/;\n\n/**\n * Parses a number and unit from a value.\n *\n * @param toParse Value to parse\n *\n * @return  The extracted number and unit.\n */\nexport function parseCSSUnitValue(\n\ttoParse: string\n): [ number | undefined, string | undefined ] {\n\tconst value = toParse.trim();\n\n\tconst matched = value.match( UNITED_VALUE_REGEX );\n\tif ( ! matched ) {\n\t\treturn [ undefined, undefined ];\n\t}\n\tconst [ , num, unit ] = matched;\n\tlet numParsed: number | undefined = parseFloat( num );\n\tnumParsed = Number.isNaN( numParsed ) ? undefined : numParsed;\n\n\treturn [ numParsed, unit ];\n}\n\n/**\n * Combines a value and a unit into a unit value.\n *\n * @param value\n * @param unit\n *\n * @return The unit value.\n */\nexport function createCSSUnitValue(\n\tvalue: string | number,\n\tunit: string\n): string {\n\treturn `${ value }${ unit }`;\n}\n"],"mappings":"AAAA,MAAMA,kBAAkB,GACvB,0IAA0I;;AAE3I;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,iBAAiBA,CAChCC,OAAe,EAC8B;EAC7C,MAAMC,KAAK,GAAGD,OAAO,CAACE,IAAI,CAAC,CAAC;EAE5B,MAAMC,OAAO,GAAGF,KAAK,CAACG,KAAK,CAAEN,kBAAmB,CAAC;EACjD,IAAK,CAAEK,OAAO,EAAG;IAChB,OAAO,CAAEE,SAAS,EAAEA,SAAS,CAAE;EAChC;EACA,MAAM,GAAIC,GAAG,EAAEC,IAAI,CAAE,GAAGJ,OAAO;EAC/B,IAAIK,SAA6B,GAAGC,UAAU,CAAEH,GAAI,CAAC;EACrDE,SAAS,GAAGE,MAAM,CAACC,KAAK,CAAEH,SAAU,CAAC,GAAGH,SAAS,GAAGG,SAAS;EAE7D,OAAO,CAAEA,SAAS,EAAED,IAAI,CAAE;AAC3B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASK,kBAAkBA,CACjCX,KAAsB,EACtBM,IAAY,EACH;EACT,OAAQ,GAAGN,KAAO,GAAGM,IAAM,EAAC;AAC7B"}
+{"version":3,"names":["UNITED_VALUE_REGEX","parseCSSUnitValue","toParse","value","trim","matched","match","undefined","num","unit","numParsed","parseFloat","Number","isNaN","createCSSUnitValue"],"sources":["@wordpress/components/src/utils/unit-values.ts"],"sourcesContent":["const UNITED_VALUE_REGEX =\n\t/^([\\d.\\-+]*)\\s*(fr|cm|mm|Q|in|pc|pt|px|em|ex|ch|rem|lh|vw|vh|vmin|vmax|%|cap|ic|rlh|vi|vb|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx|svw|lvw|dvw|svh|lvh|dvh|svi|lvi|dvi|svb|lvb|dvb|svmin|lvmin|dvmin|svmax|lvmax|dvmax)?$/;\n\n/**\n * Parses a number and unit from a value.\n *\n * @param toParse Value to parse\n *\n * @return  The extracted number and unit.\n */\nexport function parseCSSUnitValue(\n\ttoParse: string\n): [ number | undefined, string | undefined ] {\n\tconst value = toParse.trim();\n\n\tconst matched = value.match( UNITED_VALUE_REGEX );\n\tif ( ! matched ) {\n\t\treturn [ undefined, undefined ];\n\t}\n\tconst [ , num, unit ] = matched;\n\tlet numParsed: number | undefined = parseFloat( num );\n\tnumParsed = Number.isNaN( numParsed ) ? undefined : numParsed;\n\n\treturn [ numParsed, unit ];\n}\n\n/**\n * Combines a value and a unit into a unit value.\n *\n * @param value\n * @param unit\n *\n * @return The unit value.\n */\nexport function createCSSUnitValue(\n\tvalue: string | number,\n\tunit: string\n): string {\n\treturn `${ value }${ unit }`;\n}\n"],"mappings":"AAAA,MAAMA,kBAAkB,GACvB,8NAA8N;;AAE/N;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,iBAAiBA,CAChCC,OAAe,EAC8B;EAC7C,MAAMC,KAAK,GAAGD,OAAO,CAACE,IAAI,CAAC,CAAC;EAE5B,MAAMC,OAAO,GAAGF,KAAK,CAACG,KAAK,CAAEN,kBAAmB,CAAC;EACjD,IAAK,CAAEK,OAAO,EAAG;IAChB,OAAO,CAAEE,SAAS,EAAEA,SAAS,CAAE;EAChC;EACA,MAAM,GAAIC,GAAG,EAAEC,IAAI,CAAE,GAAGJ,OAAO;EAC/B,IAAIK,SAA6B,GAAGC,UAAU,CAAEH,GAAI,CAAC;EACrDE,SAAS,GAAGE,MAAM,CAACC,KAAK,CAAEH,SAAU,CAAC,GAAGH,SAAS,GAAGG,SAAS;EAE7D,OAAO,CAAEA,SAAS,EAAED,IAAI,CAAE;AAC3B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASK,kBAAkBA,CACjCX,KAAsB,EACtBM,IAAY,EACH;EACT,OAAQ,GAAGN,KAAO,GAAGM,IAAM,EAAC;AAC7B"}

package/build-style/style-rtl.css

@@ -441,15 +441,15 @@ p + .components-button.is-tertiary {
   padding-right: 8px;
   gap: 4px;
 }
-.components-button[aria-pressed=true], .components-button[aria-pressed=mixed] {
+.components-button.is-pressed {
   color: var(--wp-components-color-foreground-inverted, #fff);
   background: var(--wp-components-color-foreground, #1e1e1e);
 }
-.components-button[aria-pressed=true]:focus:not(:disabled), .components-button[aria-pressed=mixed]:focus:not(:disabled) {
+.components-button.is-pressed:focus:not(:disabled) {
   box-shadow: inset 0 0 0 1px var(--wp-components-color-background, #fff), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
   outline: 2px solid transparent;
 }
-.components-button[aria-pressed=true]:hover:not(:disabled), .components-button[aria-pressed=mixed]:hover:not(:disabled) {
+.components-button.is-pressed:hover:not(:disabled) {
   color: var(--wp-components-color-foreground-inverted, #fff);
   background: var(--wp-components-color-foreground, #1e1e1e);
 }
@@ -1974,7 +1974,6 @@ body.is-dragging-components-draggable {
   font-size: 13px;
   background-color: #fff;
   border-right: 4px solid var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
-  margin: 5px 15px 2px;
   padding: 8px 12px;
   align-items: center;
 }
@@ -2546,6 +2545,13 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   stroke: #1e1e1e;
 }
 
+.components-popover-pointer-events-trap {
+  z-index: 1000000;
+  position: fixed;
+  inset: 0;
+  background-color: transparent;
+}
+
 .components-radio-control__input[type=radio] {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
@@ -3233,6 +3239,12 @@ body.lockscroll {
 .components-accessible-toolbar > .components-toolbar-group:last-child {
   border-left: none;
 }
+.components-accessible-toolbar.is-unstyled {
+  border: none;
+}
+.components-accessible-toolbar.is-unstyled > .components-toolbar-group {
+  border-left: none;
+}
 
 .components-accessible-toolbar .components-button,
 .components-toolbar .components-button {

package/build-style/style.css

@@ -441,15 +441,15 @@ p + .components-button.is-tertiary {
   padding-left: 8px;
   gap: 4px;
 }
-.components-button[aria-pressed=true], .components-button[aria-pressed=mixed] {
+.components-button.is-pressed {
   color: var(--wp-components-color-foreground-inverted, #fff);
   background: var(--wp-components-color-foreground, #1e1e1e);
 }
-.components-button[aria-pressed=true]:focus:not(:disabled), .components-button[aria-pressed=mixed]:focus:not(:disabled) {
+.components-button.is-pressed:focus:not(:disabled) {
   box-shadow: inset 0 0 0 1px var(--wp-components-color-background, #fff), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
   outline: 2px solid transparent;
 }
-.components-button[aria-pressed=true]:hover:not(:disabled), .components-button[aria-pressed=mixed]:hover:not(:disabled) {
+.components-button.is-pressed:hover:not(:disabled) {
   color: var(--wp-components-color-foreground-inverted, #fff);
   background: var(--wp-components-color-foreground, #1e1e1e);
 }
@@ -1979,7 +1979,6 @@ body.is-dragging-components-draggable {
   font-size: 13px;
   background-color: #fff;
   border-left: 4px solid var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
-  margin: 5px 15px 2px;
   padding: 8px 12px;
   align-items: center;
 }
@@ -2555,6 +2554,13 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   stroke: #1e1e1e;
 }
 
+.components-popover-pointer-events-trap {
+  z-index: 1000000;
+  position: fixed;
+  inset: 0;
+  background-color: transparent;
+}
+
 .components-radio-control__input[type=radio] {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
@@ -3245,6 +3251,12 @@ body.lockscroll {
 .components-accessible-toolbar > .components-toolbar-group:last-child {
   border-right: none;
 }
+.components-accessible-toolbar.is-unstyled {
+  border: none;
+}
+.components-accessible-toolbar.is-unstyled > .components-toolbar-group {
+  border-right: none;
+}
 
 .components-accessible-toolbar .components-button,
 .components-toolbar .components-button {

package/build-types/alignment-matrix-control/cell.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import type { AlignmentMatrixControlCellProps } from './types';
 import type { WordPressComponentProps } from '../context';
-export default function Cell({ isActive, value, ...props }: WordPressComponentProps<AlignmentMatrixControlCellProps, 'span', false>): JSX.Element;
+export default function Cell({ id, isActive, value, ...props }: WordPressComponentProps<AlignmentMatrixControlCellProps, 'span', false>): JSX.Element;
 //# sourceMappingURL=cell.d.ts.map