@wordpress/components 30.5.1-next.f56bd8138.0 → 30.6.1-next.b8c8708f3.0

package/build-module/dropdown-menu/index.js

@@ -1,20 +1,9 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
-/**
- * WordPress dependencies
- */
-import { menu } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import { contextConnectWithoutRef, useContextSystem } from '../context';
-import Button from '../button';
-import Dropdown from '../dropdown';
-import { NavigableMenu } from '../navigable-container';
+import clsx from "clsx";
+import { menu } from "@wordpress/icons";
+import { contextConnectWithoutRef, useContextSystem } from "../context";
+import Button from "../button";
+import Dropdown from "../dropdown";
+import { NavigableMenu } from "../navigable-container";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function mergeProps(defaultProps = {}, props = {}) {
   const mergedProps = {
@@ -27,7 +16,7 @@ function mergeProps(defaultProps = {}, props = {}) {
   return mergedProps;
 }
 function isFunction(maybeFunc) {
-  return typeof maybeFunc === 'function';
+  return typeof maybeFunc === "function";
 }
 function UnconnectedDropdownMenu(dropdownMenuProps) {
   const {
@@ -47,40 +36,34 @@ function UnconnectedDropdownMenu(dropdownMenuProps) {
     onToggle: onToggleProp,
     // Context
     variant
-  } = useContextSystem(dropdownMenuProps, 'DropdownMenu');
+  } = useContextSystem(dropdownMenuProps, "DropdownMenu");
   if (!controls?.length && !isFunction(children)) {
     return null;
   }
-
-  // Normalize controls to nested array of objects (sets of controls)
   let controlSets;
   if (controls?.length) {
-    // @ts-expect-error The check below is needed because `DropdownMenus`
-    // rendered by `ToolBarGroup` receive controls as a nested array.
     controlSets = controls;
     if (!Array.isArray(controlSets[0])) {
-      // This is not ideal, but at this point we know that `controls` is
-      // not a nested array, even if TypeScript doesn't.
       controlSets = [controls];
     }
   }
   const mergedPopoverProps = mergeProps({
-    className: 'components-dropdown-menu__popover',
+    className: "components-dropdown-menu__popover",
     variant
   }, popoverProps);
-  return /*#__PURE__*/_jsx(Dropdown, {
-    className: className,
+  return /* @__PURE__ */ _jsx(Dropdown, {
+    className,
     popoverProps: mergedPopoverProps,
     renderToggle: ({
       isOpen,
       onToggle
     }) => {
       var _toggleProps$showTool;
-      const openOnArrowDown = event => {
+      const openOnArrowDown = (event) => {
         if (disableOpenOnArrowDown) {
           return;
         }
-        if (!isOpen && event.code === 'ArrowDown') {
+        if (!isOpen && event.code === "ArrowDown") {
           event.preventDefault();
           onToggle();
         }
@@ -90,20 +73,20 @@ function UnconnectedDropdownMenu(dropdownMenuProps) {
         ...restToggleProps
       } = toggleProps !== null && toggleProps !== void 0 ? toggleProps : {};
       const mergedToggleProps = mergeProps({
-        className: clsx('components-dropdown-menu__toggle', {
-          'is-opened': isOpen
+        className: clsx("components-dropdown-menu__toggle", {
+          "is-opened": isOpen
         })
       }, restToggleProps);
-      return /*#__PURE__*/_jsx(Toggle, {
+      return /* @__PURE__ */ _jsx(Toggle, {
         ...mergedToggleProps,
-        icon: icon,
-        onClick: event => {
+        icon,
+        onClick: (event) => {
           onToggle();
           if (mergedToggleProps.onClick) {
             mergedToggleProps.onClick(event);
           }
         },
-        onKeyDown: event => {
+        onKeyDown: (event) => {
           openOnArrowDown(event);
           if (mergedToggleProps.onKeyDown) {
             mergedToggleProps.onKeyDown(event);
@@ -111,132 +94,55 @@ function UnconnectedDropdownMenu(dropdownMenuProps) {
         },
         "aria-haspopup": "true",
         "aria-expanded": isOpen,
-        label: label,
-        text: text,
+        label,
+        text,
         showTooltip: (_toggleProps$showTool = toggleProps?.showTooltip) !== null && _toggleProps$showTool !== void 0 ? _toggleProps$showTool : true,
         children: mergedToggleProps.children
       });
     },
-    renderContent: props => {
+    renderContent: (props) => {
       const mergedMenuProps = mergeProps({
-        'aria-label': label,
-        className: clsx('components-dropdown-menu__menu', {
-          'no-icons': noIcons
+        "aria-label": label,
+        className: clsx("components-dropdown-menu__menu", {
+          "no-icons": noIcons
         })
       }, menuProps);
-      return /*#__PURE__*/_jsxs(NavigableMenu, {
+      return /* @__PURE__ */ _jsxs(NavigableMenu, {
         ...mergedMenuProps,
         role: "menu",
-        children: [isFunction(children) ? children(props) : null, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/_jsx(Button, {
+        children: [isFunction(children) ? children(props) : null, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /* @__PURE__ */ _jsx(Button, {
           __next40pxDefaultSize: true,
-          onClick: event => {
+          onClick: (event) => {
             event.stopPropagation();
             props.onClose();
             if (control.onClick) {
               control.onClick();
             }
           },
-          className: clsx('components-dropdown-menu__menu-item', {
-            'has-separator': indexOfSet > 0 && indexOfControl === 0,
-            'is-active': control.isActive,
-            'is-icon-only': !control.title
+          className: clsx("components-dropdown-menu__menu-item", {
+            "has-separator": indexOfSet > 0 && indexOfControl === 0,
+            "is-active": control.isActive,
+            "is-icon-only": !control.title
           }),
           icon: control.icon,
           label: control.label,
-          "aria-checked": control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.isActive : undefined,
-          role: control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.role : 'menuitem',
+          "aria-checked": control.role === "menuitemcheckbox" || control.role === "menuitemradio" ? control.isActive : void 0,
+          role: control.role === "menuitemcheckbox" || control.role === "menuitemradio" ? control.role : "menuitem",
           accessibleWhenDisabled: true,
           disabled: control.isDisabled,
           children: control.title
         }, [indexOfSet, indexOfControl].join())))]
       });
     },
-    open: open,
-    defaultOpen: defaultOpen,
+    open,
+    defaultOpen,
     onToggle: onToggleProp
   });
 }
-
-/**
- *
- * The DropdownMenu displays a list of actions (each contained in a MenuItem,
- * MenuItemsChoice, or MenuGroup) in a compact way. It appears in a Popover
- * after the user has interacted with an element (a button or icon) or when
- * they perform a specific action.
- *
- * Render a Dropdown Menu with a set of controls:
- *
- * ```jsx
- * import { DropdownMenu } from '@wordpress/components';
- * import {
- * 	more,
- * 	arrowLeft,
- * 	arrowRight,
- * 	arrowUp,
- * 	arrowDown,
- * } from '@wordpress/icons';
- *
- * const MyDropdownMenu = () => (
- * 	<DropdownMenu
- * 		icon={ more }
- * 		label="Select a direction"
- * 		controls={ [
- * 			{
- * 				title: 'Up',
- * 				icon: arrowUp,
- * 				onClick: () => console.log( 'up' ),
- * 			},
- * 			{
- * 				title: 'Right',
- * 				icon: arrowRight,
- * 				onClick: () => console.log( 'right' ),
- * 			},
- * 			{
- * 				title: 'Down',
- * 				icon: arrowDown,
- * 				onClick: () => console.log( 'down' ),
- * 			},
- * 			{
- * 				title: 'Left',
- * 				icon: arrowLeft,
- * 				onClick: () => console.log( 'left' ),
- * 			},
- * 		] }
- * 	/>
- * );
- * ```
- *
- * Alternatively, specify a `children` function which returns elements valid for
- * use in a DropdownMenu: `MenuItem`, `MenuItemsChoice`, or `MenuGroup`.
- *
- * ```jsx
- * import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';
- * import { more, arrowUp, arrowDown, trash } from '@wordpress/icons';
- *
- * const MyDropdownMenu = () => (
- * 	<DropdownMenu icon={ more } label="Select a direction">
- * 		{ ( { onClose } ) => (
- * 			<>
- * 				<MenuGroup>
- * 					<MenuItem icon={ arrowUp } onClick={ onClose }>
- * 						Move Up
- * 					</MenuItem>
- * 					<MenuItem icon={ arrowDown } onClick={ onClose }>
- * 						Move Down
- * 					</MenuItem>
- * 				</MenuGroup>
- * 				<MenuGroup>
- * 					<MenuItem icon={ trash } onClick={ onClose }>
- * 						Remove
- * 					</MenuItem>
- * 				</MenuGroup>
- * 			</>
- * 		) }
- * 	</DropdownMenu>
- * );
- * ```
- *
- */
-export const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu');
-export default DropdownMenu;
-//# sourceMappingURL=index.js.map
+const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, "DropdownMenu");
+var dropdown_menu_default = DropdownMenu;
+export {
+  DropdownMenu,
+  dropdown_menu_default as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/dropdown-menu/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["clsx","menu","contextConnectWithoutRef","useContextSystem","Button","Dropdown","NavigableMenu","jsx","_jsx","jsxs","_jsxs","mergeProps","defaultProps","props","mergedProps","className","isFunction","maybeFunc","UnconnectedDropdownMenu","dropdownMenuProps","children","controls","icon","label","popoverProps","toggleProps","menuProps","disableOpenOnArrowDown","text","noIcons","open","defaultOpen","onToggle","onToggleProp","variant","length","controlSets","Array","isArray","mergedPopoverProps","renderToggle","isOpen","_toggleProps$showTool","openOnArrowDown","event","code","preventDefault","as","Toggle","restToggleProps","mergedToggleProps","onClick","onKeyDown","showTooltip","renderContent","mergedMenuProps","role","flatMap","controlSet","indexOfSet","map","control","indexOfControl","__next40pxDefaultSize","stopPropagation","onClose","isActive","title","undefined","accessibleWhenDisabled","disabled","isDisabled","join","DropdownMenu"],"sources":["@wordpress/components/src/dropdown-menu/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\nimport type {\n\tDropdownMenuProps,\n\tDropdownOption,\n\tDropdownMenuInternalContext,\n} from './types';\n\nfunction mergeProps<\n\tT extends { className?: string; [ key: string ]: unknown },\n>( defaultProps: Partial< T > = {}, props: T = {} as T ) {\n\tconst mergedProps: T = {\n\t\t...defaultProps,\n\t\t...props,\n\t};\n\n\tif ( props.className && defaultProps.className ) {\n\t\tmergedProps.className = clsx( props.className, defaultProps.className );\n\t}\n\n\treturn mergedProps;\n}\n\nfunction isFunction( maybeFunc: unknown ): maybeFunc is () => void {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction UnconnectedDropdownMenu( dropdownMenuProps: DropdownMenuProps ) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tcontrols,\n\t\ticon = menu,\n\t\tlabel,\n\t\tpopoverProps,\n\t\ttoggleProps,\n\t\tmenuProps,\n\t\tdisableOpenOnArrowDown = false,\n\t\ttext,\n\t\tnoIcons,\n\n\t\topen,\n\t\tdefaultOpen,\n\t\tonToggle: onToggleProp,\n\n\t\t// Context\n\t\tvariant,\n\t} = useContextSystem< DropdownMenuProps & DropdownMenuInternalContext >(\n\t\tdropdownMenuProps,\n\t\t'DropdownMenu'\n\t);\n\n\tif ( ! controls?.length && ! isFunction( children ) ) {\n\t\treturn null;\n\t}\n\n\t// Normalize controls to nested array of objects (sets of controls)\n\tlet controlSets: DropdownOption[][];\n\tif ( controls?.length ) {\n\t\t// @ts-expect-error The check below is needed because `DropdownMenus`\n\t\t// rendered by `ToolBarGroup` receive controls as a nested array.\n\t\tcontrolSets = controls;\n\t\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\t\t// This is not ideal, but at this point we know that `controls` is\n\t\t\t// not a nested array, even if TypeScript doesn't.\n\t\t\tcontrolSets = [ controls as DropdownOption[] ];\n\t\t}\n\t}\n\n\tconst mergedPopoverProps = mergeProps(\n\t\t{\n\t\t\tclassName: 'components-dropdown-menu__popover',\n\t\t\tvariant,\n\t\t},\n\t\tpopoverProps\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ className }\n\t\t\tpopoverProps={ mergedPopoverProps }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event: React.KeyboardEvent ) => {\n\t\t\t\t\tif ( disableOpenOnArrowDown ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( ! isOpen && event.code === 'ArrowDown' ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\tconst { as: Toggle = Button, ...restToggleProps } =\n\t\t\t\t\ttoggleProps ?? {};\n\n\t\t\t\tconst mergedToggleProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\tclassName: clsx( 'components-dropdown-menu__toggle', {\n\t\t\t\t\t\t\t'is-opened': isOpen,\n\t\t\t\t\t\t} ),\n\t\t\t\t\t},\n\t\t\t\t\trestToggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Toggle\n\t\t\t\t\t\t{ ...mergedToggleProps }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tonClick={\n\t\t\t\t\t\t\t( ( event ) => {\n\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\tif ( mergedToggleProps.onClick ) {\n\t\t\t\t\t\t\t\t\tmergedToggleProps.onClick( event );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} ) as React.MouseEventHandler< HTMLButtonElement >\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonKeyDown={\n\t\t\t\t\t\t\t( ( event ) => {\n\t\t\t\t\t\t\t\topenOnArrowDown( event );\n\t\t\t\t\t\t\t\tif ( mergedToggleProps.onKeyDown ) {\n\t\t\t\t\t\t\t\t\tmergedToggleProps.onKeyDown( event );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} ) as React.KeyboardEventHandler< HTMLButtonElement >\n\t\t\t\t\t\t}\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\ttext={ text }\n\t\t\t\t\t\tshowTooltip={ toggleProps?.showTooltip ?? true }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ mergedToggleProps.children }\n\t\t\t\t\t</Toggle>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ ( props ) => {\n\t\t\t\tconst mergedMenuProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\tclassName: clsx( 'components-dropdown-menu__menu', {\n\t\t\t\t\t\t\t'no-icons': noIcons,\n\t\t\t\t\t\t} ),\n\t\t\t\t\t},\n\t\t\t\t\tmenuProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<NavigableMenu { ...mergedMenuProps } role=\"menu\">\n\t\t\t\t\t\t{ isFunction( children ) ? children( props ) : null }\n\t\t\t\t\t\t{ controlSets?.flatMap( ( controlSet, indexOfSet ) =>\n\t\t\t\t\t\t\tcontrolSet.map( ( control, indexOfControl ) => (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tkey={ [\n\t\t\t\t\t\t\t\t\t\tindexOfSet,\n\t\t\t\t\t\t\t\t\t\tindexOfControl,\n\t\t\t\t\t\t\t\t\t].join() }\n\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tprops.onClose();\n\t\t\t\t\t\t\t\t\t\tif ( control.onClick ) {\n\t\t\t\t\t\t\t\t\t\t\tcontrol.onClick();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'components-dropdown-menu__menu-item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'has-separator':\n\t\t\t\t\t\t\t\t\t\t\t\tindexOfSet > 0 &&\n\t\t\t\t\t\t\t\t\t\t\t\tindexOfControl === 0,\n\t\t\t\t\t\t\t\t\t\t\t'is-active': control.isActive,\n\t\t\t\t\t\t\t\t\t\t\t'is-icon-only': ! control.title,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\ticon={ control.icon }\n\t\t\t\t\t\t\t\t\tlabel={ control.label }\n\t\t\t\t\t\t\t\t\taria-checked={\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemcheckbox' ||\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemradio'\n\t\t\t\t\t\t\t\t\t\t\t? control.isActive\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\trole={\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemcheckbox' ||\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemradio'\n\t\t\t\t\t\t\t\t\t\t\t? control.role\n\t\t\t\t\t\t\t\t\t\t\t: 'menuitem'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\tdisabled={ control.isDisabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ control.title }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) )\n\t\t\t\t\t\t) }\n\t\t\t\t\t</NavigableMenu>\n\t\t\t\t);\n\t\t\t} }\n\t\t\topen={ open }\n\t\t\tdefaultOpen={ defaultOpen }\n\t\t\tonToggle={ onToggleProp }\n\t\t/>\n\t);\n}\n\n/**\n *\n * The DropdownMenu displays a list of actions (each contained in a MenuItem,\n * MenuItemsChoice, or MenuGroup) in a compact way. It appears in a Popover\n * after the user has interacted with an element (a button or icon) or when\n * they perform a specific action.\n *\n * Render a Dropdown Menu with a set of controls:\n *\n * ```jsx\n * import { DropdownMenu } from '@wordpress/components';\n * import {\n * \tmore,\n * \tarrowLeft,\n * \tarrowRight,\n * \tarrowUp,\n * \tarrowDown,\n * } from '@wordpress/icons';\n *\n * const MyDropdownMenu = () => (\n * \t<DropdownMenu\n * \t\ticon={ more }\n * \t\tlabel=\"Select a direction\"\n * \t\tcontrols={ [\n * \t\t\t{\n * \t\t\t\ttitle: 'Up',\n * \t\t\t\ticon: arrowUp,\n * \t\t\t\tonClick: () => console.log( 'up' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Right',\n * \t\t\t\ticon: arrowRight,\n * \t\t\t\tonClick: () => console.log( 'right' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Down',\n * \t\t\t\ticon: arrowDown,\n * \t\t\t\tonClick: () => console.log( 'down' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Left',\n * \t\t\t\ticon: arrowLeft,\n * \t\t\t\tonClick: () => console.log( 'left' ),\n * \t\t\t},\n * \t\t] }\n * \t/>\n * );\n * ```\n *\n * Alternatively, specify a `children` function which returns elements valid for\n * use in a DropdownMenu: `MenuItem`, `MenuItemsChoice`, or `MenuGroup`.\n *\n * ```jsx\n * import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\n * import { more, arrowUp, arrowDown, trash } from '@wordpress/icons';\n *\n * const MyDropdownMenu = () => (\n * \t<DropdownMenu icon={ more } label=\"Select a direction\">\n * \t\t{ ( { onClose } ) => (\n * \t\t\t<>\n * \t\t\t\t<MenuGroup>\n * \t\t\t\t\t<MenuItem icon={ arrowUp } onClick={ onClose }>\n * \t\t\t\t\t\tMove Up\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t\t<MenuItem icon={ arrowDown } onClick={ onClose }>\n * \t\t\t\t\t\tMove Down\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t</MenuGroup>\n * \t\t\t\t<MenuGroup>\n * \t\t\t\t\t<MenuItem icon={ trash } onClick={ onClose }>\n * \t\t\t\t\t\tRemove\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t</MenuGroup>\n * \t\t\t</>\n * \t\t) }\n * \t</DropdownMenu>\n * );\n * ```\n *\n */\nexport const DropdownMenu = contextConnectWithoutRef(\n\tUnconnectedDropdownMenu,\n\t'DropdownMenu'\n);\n\nexport default DropdownMenu;\n"],"mappings":"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AI,KAAK,eAAe,GAC7BK,OAAO,CAACL,IAAI,GACZ,UACH;UACDa,sBAAsB;UACtBC,QAAQ,EAAGT,OAAO,CAACU,UAAY;UAAAnD,QAAA,EAE7ByC,OAAO,CAACM;QAAK,GAxCT,CACLR,UAAU,EACVG,cAAc,CACd,CAACU,IAAI,CAAC,CAsCA,CACP,CACH,CAAC;MAAA,CACa,CAAC;IAElB,CAAG;IACH1C,IAAI,EAAGA,IAAM;IACbC,WAAW,EAAGA,WAAa;IAC3BC,QAAQ,EAAGC;EAAc,CACzB,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMwC,YAAY,GAAGvE,wBAAwB,CACnDgB,uBAAuB,EACvB,cACD,CAAC;AAED,eAAeuD,YAAY","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/dropdown-menu/index.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction mergeProps(defaultProps = {}, props = {}) {\n  const mergedProps = {\n    ...defaultProps,\n    ...props\n  };\n  if (props.className && defaultProps.className) {\n    mergedProps.className = clsx(props.className, defaultProps.className);\n  }\n  return mergedProps;\n}\nfunction isFunction(maybeFunc) {\n  return typeof maybeFunc === 'function';\n}\nfunction UnconnectedDropdownMenu(dropdownMenuProps) {\n  const {\n    children,\n    className,\n    controls,\n    icon = menu,\n    label,\n    popoverProps,\n    toggleProps,\n    menuProps,\n    disableOpenOnArrowDown = false,\n    text,\n    noIcons,\n    open,\n    defaultOpen,\n    onToggle: onToggleProp,\n    // Context\n    variant\n  } = useContextSystem(dropdownMenuProps, 'DropdownMenu');\n  if (!controls?.length && !isFunction(children)) {\n    return null;\n  }\n\n  // Normalize controls to nested array of objects (sets of controls)\n  let controlSets;\n  if (controls?.length) {\n    // @ts-expect-error The check below is needed because `DropdownMenus`\n    // rendered by `ToolBarGroup` receive controls as a nested array.\n    controlSets = controls;\n    if (!Array.isArray(controlSets[0])) {\n      // This is not ideal, but at this point we know that `controls` is\n      // not a nested array, even if TypeScript doesn't.\n      controlSets = [controls];\n    }\n  }\n  const mergedPopoverProps = mergeProps({\n    className: 'components-dropdown-menu__popover',\n    variant\n  }, popoverProps);\n  return /*#__PURE__*/_jsx(Dropdown, {\n    className: className,\n    popoverProps: mergedPopoverProps,\n    renderToggle: ({\n      isOpen,\n      onToggle\n    }) => {\n      var _toggleProps$showTool;\n      const openOnArrowDown = event => {\n        if (disableOpenOnArrowDown) {\n          return;\n        }\n        if (!isOpen && event.code === 'ArrowDown') {\n          event.preventDefault();\n          onToggle();\n        }\n      };\n      const {\n        as: Toggle = Button,\n        ...restToggleProps\n      } = toggleProps !== null && toggleProps !== void 0 ? toggleProps : {};\n      const mergedToggleProps = mergeProps({\n        className: clsx('components-dropdown-menu__toggle', {\n          'is-opened': isOpen\n        })\n      }, restToggleProps);\n      return /*#__PURE__*/_jsx(Toggle, {\n        ...mergedToggleProps,\n        icon: icon,\n        onClick: event => {\n          onToggle();\n          if (mergedToggleProps.onClick) {\n            mergedToggleProps.onClick(event);\n          }\n        },\n        onKeyDown: event => {\n          openOnArrowDown(event);\n          if (mergedToggleProps.onKeyDown) {\n            mergedToggleProps.onKeyDown(event);\n          }\n        },\n        \"aria-haspopup\": \"true\",\n        \"aria-expanded\": isOpen,\n        label: label,\n        text: text,\n        showTooltip: (_toggleProps$showTool = toggleProps?.showTooltip) !== null && _toggleProps$showTool !== void 0 ? _toggleProps$showTool : true,\n        children: mergedToggleProps.children\n      });\n    },\n    renderContent: props => {\n      const mergedMenuProps = mergeProps({\n        'aria-label': label,\n        className: clsx('components-dropdown-menu__menu', {\n          'no-icons': noIcons\n        })\n      }, menuProps);\n      return /*#__PURE__*/_jsxs(NavigableMenu, {\n        ...mergedMenuProps,\n        role: \"menu\",\n        children: [isFunction(children) ? children(props) : null, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/_jsx(Button, {\n          __next40pxDefaultSize: true,\n          onClick: event => {\n            event.stopPropagation();\n            props.onClose();\n            if (control.onClick) {\n              control.onClick();\n            }\n          },\n          className: clsx('components-dropdown-menu__menu-item', {\n            'has-separator': indexOfSet > 0 && indexOfControl === 0,\n            'is-active': control.isActive,\n            'is-icon-only': !control.title\n          }),\n          icon: control.icon,\n          label: control.label,\n          \"aria-checked\": control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.isActive : undefined,\n          role: control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.role : 'menuitem',\n          accessibleWhenDisabled: true,\n          disabled: control.isDisabled,\n          children: control.title\n        }, [indexOfSet, indexOfControl].join())))]\n      });\n    },\n    open: open,\n    defaultOpen: defaultOpen,\n    onToggle: onToggleProp\n  });\n}\n\n/**\n *\n * The DropdownMenu displays a list of actions (each contained in a MenuItem,\n * MenuItemsChoice, or MenuGroup) in a compact way. It appears in a Popover\n * after the user has interacted with an element (a button or icon) or when\n * they perform a specific action.\n *\n * Render a Dropdown Menu with a set of controls:\n *\n * ```jsx\n * import { DropdownMenu } from '@wordpress/components';\n * import {\n * \tmore,\n * \tarrowLeft,\n * \tarrowRight,\n * \tarrowUp,\n * \tarrowDown,\n * } from '@wordpress/icons';\n *\n * const MyDropdownMenu = () => (\n * \t<DropdownMenu\n * \t\ticon={ more }\n * \t\tlabel=\"Select a direction\"\n * \t\tcontrols={ [\n * \t\t\t{\n * \t\t\t\ttitle: 'Up',\n * \t\t\t\ticon: arrowUp,\n * \t\t\t\tonClick: () => console.log( 'up' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Right',\n * \t\t\t\ticon: arrowRight,\n * \t\t\t\tonClick: () => console.log( 'right' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Down',\n * \t\t\t\ticon: arrowDown,\n * \t\t\t\tonClick: () => console.log( 'down' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Left',\n * \t\t\t\ticon: arrowLeft,\n * \t\t\t\tonClick: () => console.log( 'left' ),\n * \t\t\t},\n * \t\t] }\n * \t/>\n * );\n * ```\n *\n * Alternatively, specify a `children` function which returns elements valid for\n * use in a DropdownMenu: `MenuItem`, `MenuItemsChoice`, or `MenuGroup`.\n *\n * ```jsx\n * import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\n * import { more, arrowUp, arrowDown, trash } from '@wordpress/icons';\n *\n * const MyDropdownMenu = () => (\n * \t<DropdownMenu icon={ more } label=\"Select a direction\">\n * \t\t{ ( { onClose } ) => (\n * \t\t\t<>\n * \t\t\t\t<MenuGroup>\n * \t\t\t\t\t<MenuItem icon={ arrowUp } onClick={ onClose }>\n * \t\t\t\t\t\tMove Up\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t\t<MenuItem icon={ arrowDown } onClick={ onClose }>\n * \t\t\t\t\t\tMove Down\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t</MenuGroup>\n * \t\t\t\t<MenuGroup>\n * \t\t\t\t\t<MenuItem icon={ trash } onClick={ onClose }>\n * \t\t\t\t\t\tRemove\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t</MenuGroup>\n * \t\t\t</>\n * \t\t) }\n * \t</DropdownMenu>\n * );\n * ```\n *\n */\nexport const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu');\nexport default DropdownMenu;"],
+  "mappings": "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",
+  "names": []
+}

package/build-module/dropdown-menu/types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=types.js.map
+//# sourceMappingURL=types.js.map

package/build-module/dropdown-menu/types.js.map

@@ -1 +1,7 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/dropdown-menu/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { HTMLAttributes, ReactNode } from 'react';\n/**\n * Internal dependencies\n */\nimport type { ButtonAsButtonProps } from '../button/types';\nimport type { WordPressComponentProps } from '../context';\nimport type { DropdownProps } from '../dropdown/types';\nimport type { Props as IconProps } from '../icon';\nimport type { NavigableMenuProps } from '../navigable-container/types';\n\nexport type DropdownOption = {\n\t/**\n\t * The icon to be shown for the option.\n\t */\n\ticon?: IconProps[ 'icon' ];\n\t/**\n\t * A human-readable title to display for the option.\n\t */\n\ttitle: string;\n\t/**\n\t * Whether or not the option is disabled.\n\t *\n\t * @default false\n\t */\n\tisDisabled?: boolean;\n\t/**\n\t * A callback function to invoke when the option is selected.\n\t */\n\tonClick?: ( event?: React.MouseEvent ) => void;\n\t/**\n\t * Whether or not the control is currently active.\n\t */\n\tisActive?: boolean;\n\t/**\n\t * Text to use for the internal `Button` component's tooltip.\n\t */\n\tlabel?: string;\n\t/**\n\t * The role to apply to the option's HTML element\n\t */\n\trole?: HTMLAttributes< HTMLElement >[ 'role' ];\n};\n\ntype DropdownCallbackProps = {\n\tisOpen: boolean;\n\tonToggle: () => void;\n\tonClose: () => void;\n};\n\n// Manually including `as` prop because `WordPressComponentProps` polymorphism\n// creates a union that is too large for TypeScript to handle.\ntype ToggleProps = Partial<\n\tOmit<\n\t\tWordPressComponentProps< ButtonAsButtonProps, 'button', false >,\n\t\t'label' | 'text'\n\t>\n> & {\n\tas?: React.ElementType | keyof JSX.IntrinsicElements;\n\t'data-toolbar-item'?: boolean;\n};\n\nexport type DropdownMenuProps = {\n\t/**\n\t * The icon to be shown in the collapsed menu button.\n\t *\n\t * @default \"menu\"\n\t */\n\ticon?: IconProps[ 'icon' ] | null;\n\t/**\n\t * A human-readable label to present as accessibility text on the focused\n\t * collapsed menu button.\n\t */\n\tlabel: string;\n\t/**\n\t * A class name to apply to the dropdown menu's toggle element wrapper.\n\t */\n\tclassName?: string;\n\t/**\n\t * Properties of `popoverProps` object will be passed as props to the nested\n\t * `Popover` component.\n\t * Use this object to modify props available for the `Popover` component that\n\t * are not already exposed in the `DropdownMenu` component, e.g.: the\n\t * direction in which the popover should open relative to its parent node\n\t * set with `position` prop.\n\t */\n\tpopoverProps?: DropdownProps[ 'popoverProps' ];\n\t/**\n\t * Properties of `toggleProps` object will be passed as props to the nested\n\t * `Button` component in the `renderToggle` implementation of the `Dropdown`\n\t * component used internally.\n\t * Use this object to modify props available for the `Button` component that\n\t * are not already exposed in the `DropdownMenu` component, e.g.: the tooltip\n\t * text displayed on hover set with `tooltip` prop.\n\t */\n\ttoggleProps?: ToggleProps;\n\t/**\n\t * Properties of `menuProps` object will be passed as props to the nested\n\t * `NavigableMenu` component in the `renderContent` implementation of the\n\t * `Dropdown` component used internally.\n\t * Use this object to modify props available for the `NavigableMenu`\n\t * component that are not already exposed in the `DropdownMenu` component,\n\t * e.g.: the orientation of the menu set with `orientation` prop.\n\t */\n\tmenuProps?: Omit< Partial< NavigableMenuProps >, 'children' >;\n\t/**\n\t * In some contexts, the arrow down key used to open the dropdown menu might\n\t * need to be disabled—for example when that key is used to perform another\n\t * action.\n\t *\n\t * @default false\n\t */\n\tdisableOpenOnArrowDown?: boolean;\n\t/**\n\t * Text to display on the nested `Button` component in the `renderToggle`\n\t * implementation of the `Dropdown` component used internally.\n\t */\n\ttext?: string;\n\t/**\n\t * Whether or not `no-icons` should be added to the menu's `className`.\n\t */\n\tnoIcons?: boolean;\n\t/**\n\t * A [function render prop](https://reactjs.org/docs/render-props.html#using-props-other-than-render)\n\t * which should return an element or elements valid for use in a DropdownMenu:\n\t * `MenuItem`, `MenuItemsChoice`, or `MenuGroup`. Its first argument is a\n\t * props object including the same values as given to a `Dropdown`'s\n\t * `renderContent` (`isOpen`, `onToggle`, `onClose`).\n\t *\n\t * A valid DropdownMenu must specify a `controls` or `children` prop, or both.\n\t */\n\tchildren?: ( callbackProps: DropdownCallbackProps ) => ReactNode;\n\t/**\n\t * An array or nested array of objects describing the options to be shown in\n\t * the expanded menu. Each object should include an `icon` Dashicon slug\n\t * string, a human-readable `title` string, `isDisabled` boolean flag, and\n\t * an `onClick` function callback to invoke when the option is selected.\n\t *\n\t * A valid DropdownMenu must specify a `controls` or `children` prop, or both.\n\t */\n\tcontrols?: DropdownOption[] | DropdownOption[][];\n\t/**\n\t * The controlled open state of the dropdown menu.\n\t * Must be used in conjunction with `onToggle`.\n\t */\n\topen?: boolean;\n\t/**\n\t * The open state of the dropdown menu when initially rendered.\n\t * Use when you do not need to control its open state. It will be overridden\n\t * by the `open` prop if it is specified on the component's first render.\n\t */\n\tdefaultOpen?: boolean;\n\t/**\n\t * A callback invoked when the state of the dropdown menu changes\n\t * from open to closed and vice versa.\n\t */\n\tonToggle?: ( willOpen: boolean ) => void;\n};\n\nexport type DropdownMenuInternalContext = {\n\t/**\n\t * This variant can be used to change the appearance of the component in\n\t * specific contexts, ie. when rendered inside the `Toolbar` component.\n\t */\n\tvariant?: 'toolbar';\n};\n"],"mappings":"","ignoreList":[]}
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/duotone-picker/color-list-picker/index.js

@@ -1,18 +1,11 @@
-/**
- * WordPress dependencies
- */
-import { useState } from '@wordpress/element';
-import { swatch } from '@wordpress/icons';
-import { __ } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import Button from '../../button';
-import ColorPalette from '../../color-palette';
-import ColorIndicator from '../../color-indicator';
-import Icon from '../../icon';
-import { useInstanceId } from '@wordpress/compose';
+import { useState } from "@wordpress/element";
+import { swatch } from "@wordpress/icons";
+import { __ } from "@wordpress/i18n";
+import Button from "../../button";
+import ColorPalette from "../../color-palette";
+import ColorIndicator from "../../color-indicator";
+import Icon from "../../icon";
+import { useInstanceId } from "@wordpress/compose";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 function ColorOption({
   label,
@@ -23,38 +16,38 @@ function ColorOption({
   onChange
 }) {
   const [isOpen, setIsOpen] = useState(false);
-  const idRoot = useInstanceId(ColorOption, 'color-list-picker-option');
+  const idRoot = useInstanceId(ColorOption, "color-list-picker-option");
   const labelId = `${idRoot}__label`;
   const contentId = `${idRoot}__content`;
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Button, {
+  return /* @__PURE__ */ _jsxs(_Fragment, {
+    children: [/* @__PURE__ */ _jsx(Button, {
       __next40pxDefaultSize: true,
       className: "components-color-list-picker__swatch-button",
       id: labelId,
-      onClick: () => setIsOpen(prev => !prev),
+      onClick: () => setIsOpen((prev) => !prev),
       "aria-expanded": isOpen,
       "aria-controls": contentId,
-      icon: value ? /*#__PURE__*/_jsx(ColorIndicator, {
+      icon: value ? /* @__PURE__ */ _jsx(ColorIndicator, {
         colorValue: value,
         className: "components-color-list-picker__swatch-color"
-      }) : /*#__PURE__*/_jsx(Icon, {
+      }) : /* @__PURE__ */ _jsx(Icon, {
         icon: swatch
       }),
       text: label
-    }), /*#__PURE__*/_jsx("div", {
+    }), /* @__PURE__ */ _jsx("div", {
       role: "group",
       id: contentId,
       "aria-labelledby": labelId,
       "aria-hidden": !isOpen,
-      children: isOpen && /*#__PURE__*/_jsx(ColorPalette, {
-        "aria-label": __('Color options'),
+      children: isOpen && /* @__PURE__ */ _jsx(ColorPalette, {
+        "aria-label": __("Color options"),
         className: "components-color-list-picker__color-picker",
-        colors: colors,
-        value: value,
+        colors,
+        value,
         clearable: false,
-        onChange: onChange,
-        disableCustomColors: disableCustomColors,
-        enableAlpha: enableAlpha
+        onChange,
+        disableCustomColors,
+        enableAlpha
       })
     })]
   });
@@ -67,15 +60,15 @@ function ColorListPicker({
   enableAlpha,
   onChange
 }) {
-  return /*#__PURE__*/_jsx("div", {
+  return /* @__PURE__ */ _jsx("div", {
     className: "components-color-list-picker",
-    children: labels.map((label, index) => /*#__PURE__*/_jsx(ColorOption, {
-      label: label,
+    children: labels.map((label, index) => /* @__PURE__ */ _jsx(ColorOption, {
+      label,
       value: value[index],
-      colors: colors,
-      disableCustomColors: disableCustomColors,
-      enableAlpha: enableAlpha,
-      onChange: newColor => {
+      colors,
+      disableCustomColors,
+      enableAlpha,
+      onChange: (newColor) => {
         const newColors = value.slice();
         newColors[index] = newColor;
         onChange(newColors);
@@ -83,5 +76,8 @@ function ColorListPicker({
     }, index))
   });
 }
-export default ColorListPicker;
-//# sourceMappingURL=index.js.map
+var color_list_picker_default = ColorListPicker;
+export {
+  color_list_picker_default as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/duotone-picker/color-list-picker/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["useState","swatch","__","Button","ColorPalette","ColorIndicator","Icon","useInstanceId","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ColorOption","label","value","colors","disableCustomColors","enableAlpha","onChange","isOpen","setIsOpen","idRoot","labelId","contentId","children","__next40pxDefaultSize","className","id","onClick","prev","icon","colorValue","text","role","clearable","ColorListPicker","labels","map","index","newColor","newColors","slice"],"sources":["@wordpress/components/src/duotone-picker/color-list-picker/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { swatch } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ColorPalette from '../../color-palette';\nimport ColorIndicator from '../../color-indicator';\nimport Icon from '../../icon';\nimport type { ColorListPickerProps, ColorOptionProps } from './types';\nimport { useInstanceId } from '@wordpress/compose';\n\nfunction ColorOption( {\n\tlabel,\n\tvalue,\n\tcolors,\n\tdisableCustomColors,\n\tenableAlpha,\n\tonChange,\n}: ColorOptionProps ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\tconst idRoot = useInstanceId( ColorOption, 'color-list-picker-option' );\n\tconst labelId = `${ idRoot }__label`;\n\tconst contentId = `${ idRoot }__content`;\n\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\tclassName=\"components-color-list-picker__swatch-button\"\n\t\t\t\tid={ labelId }\n\t\t\t\tonClick={ () => setIsOpen( ( prev ) => ! prev ) }\n\t\t\t\taria-expanded={ isOpen }\n\t\t\t\taria-controls={ contentId }\n\t\t\t\ticon={\n\t\t\t\t\tvalue ? (\n\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\tcolorValue={ value }\n\t\t\t\t\t\t\tclassName=\"components-color-list-picker__swatch-color\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Icon icon={ swatch } />\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t\ttext={ label }\n\t\t\t/>\n\t\t\t<div\n\t\t\t\trole=\"group\"\n\t\t\t\tid={ contentId }\n\t\t\t\taria-labelledby={ labelId }\n\t\t\t\taria-hidden={ ! isOpen }\n\t\t\t>\n\t\t\t\t{ isOpen && (\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\taria-label={ __( 'Color options' ) }\n\t\t\t\t\t\tclassName=\"components-color-list-picker__color-picker\"\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nfunction ColorListPicker( {\n\tcolors,\n\tlabels,\n\tvalue = [],\n\tdisableCustomColors,\n\tenableAlpha,\n\tonChange,\n}: ColorListPickerProps ) {\n\treturn (\n\t\t<div className=\"components-color-list-picker\">\n\t\t\t{ labels.map( ( label, index ) => (\n\t\t\t\t<ColorOption\n\t\t\t\t\tkey={ index }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tvalue={ value[ index ] }\n\t\t\t\t\tcolors={ colors }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\tonChange={ ( newColor ) => {\n\t\t\t\t\t\tconst newColors: ( string | undefined )[] =\n\t\t\t\t\t\t\tvalue.slice();\n\t\t\t\t\t\tnewColors[ index ] = newColor;\n\t\t\t\t\t\tonChange( newColors );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</div>\n\t);\n}\n\nexport default ColorListPicker;\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/duotone-picker/color-list-picker/index.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { swatch } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ColorPalette from '../../color-palette';\nimport ColorIndicator from '../../color-indicator';\nimport Icon from '../../icon';\nimport { useInstanceId } from '@wordpress/compose';\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction ColorOption({\n  label,\n  value,\n  colors,\n  disableCustomColors,\n  enableAlpha,\n  onChange\n}) {\n  const [isOpen, setIsOpen] = useState(false);\n  const idRoot = useInstanceId(ColorOption, 'color-list-picker-option');\n  const labelId = `${idRoot}__label`;\n  const contentId = `${idRoot}__content`;\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [/*#__PURE__*/_jsx(Button, {\n      __next40pxDefaultSize: true,\n      className: \"components-color-list-picker__swatch-button\",\n      id: labelId,\n      onClick: () => setIsOpen(prev => !prev),\n      \"aria-expanded\": isOpen,\n      \"aria-controls\": contentId,\n      icon: value ? /*#__PURE__*/_jsx(ColorIndicator, {\n        colorValue: value,\n        className: \"components-color-list-picker__swatch-color\"\n      }) : /*#__PURE__*/_jsx(Icon, {\n        icon: swatch\n      }),\n      text: label\n    }), /*#__PURE__*/_jsx(\"div\", {\n      role: \"group\",\n      id: contentId,\n      \"aria-labelledby\": labelId,\n      \"aria-hidden\": !isOpen,\n      children: isOpen && /*#__PURE__*/_jsx(ColorPalette, {\n        \"aria-label\": __('Color options'),\n        className: \"components-color-list-picker__color-picker\",\n        colors: colors,\n        value: value,\n        clearable: false,\n        onChange: onChange,\n        disableCustomColors: disableCustomColors,\n        enableAlpha: enableAlpha\n      })\n    })]\n  });\n}\nfunction ColorListPicker({\n  colors,\n  labels,\n  value = [],\n  disableCustomColors,\n  enableAlpha,\n  onChange\n}) {\n  return /*#__PURE__*/_jsx(\"div\", {\n    className: \"components-color-list-picker\",\n    children: labels.map((label, index) => /*#__PURE__*/_jsx(ColorOption, {\n      label: label,\n      value: value[index],\n      colors: colors,\n      disableCustomColors: disableCustomColors,\n      enableAlpha: enableAlpha,\n      onChange: newColor => {\n        const newColors = value.slice();\n        newColors[index] = newColor;\n        onChange(newColors);\n      }\n    }, index))\n  });\n}\nexport default ColorListPicker;"],
+  "mappings": "AAGA,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB,SAAS,UAAU;AAKnB,OAAO,YAAY;AACnB,OAAO,kBAAkB;AACzB,OAAO,oBAAoB;AAC3B,OAAO,UAAU;AACjB,SAAS,qBAAqB;AAC9B,SAAS,OAAO,MAAM,YAAY,WAAW,QAAQ,aAAa;AAClE,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,SAAS,cAAc,aAAa,0BAA0B;AACpE,QAAM,UAAU,GAAG,MAAM;AACzB,QAAM,YAAY,GAAG,MAAM;AAC3B,SAAoB,sBAAM,WAAW;AAAA,IACnC,UAAU,CAAc,qBAAK,QAAQ;AAAA,MACnC,uBAAuB;AAAA,MACvB,WAAW;AAAA,MACX,IAAI;AAAA,MACJ,SAAS,MAAM,UAAU,UAAQ,CAAC,IAAI;AAAA,MACtC,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,MAAM,QAAqB,qBAAK,gBAAgB;AAAA,QAC9C,YAAY;AAAA,QACZ,WAAW;AAAA,MACb,CAAC,IAAiB,qBAAK,MAAM;AAAA,QAC3B,MAAM;AAAA,MACR,CAAC;AAAA,MACD,MAAM;AAAA,IACR,CAAC,GAAgB,qBAAK,OAAO;AAAA,MAC3B,MAAM;AAAA,MACN,IAAI;AAAA,MACJ,mBAAmB;AAAA,MACnB,eAAe,CAAC;AAAA,MAChB,UAAU,UAAuB,qBAAK,cAAc;AAAA,QAClD,cAAc,GAAG,eAAe;AAAA,QAChC,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,SAAoB,qBAAK,OAAO;AAAA,IAC9B,WAAW;AAAA,IACX,UAAU,OAAO,IAAI,CAAC,OAAO,UAAuB,qBAAK,aAAa;AAAA,MACpE;AAAA,MACA,OAAO,MAAM,KAAK;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU,cAAY;AACpB,cAAM,YAAY,MAAM,MAAM;AAC9B,kBAAU,KAAK,IAAI;AACnB,iBAAS,SAAS;AAAA,MACpB;AAAA,IACF,GAAG,KAAK,CAAC;AAAA,EACX,CAAC;AACH;AACA,IAAO,4BAAQ;",
+  "names": []
+}

package/build-module/duotone-picker/color-list-picker/types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=types.js.map
+//# sourceMappingURL=types.js.map

package/build-module/duotone-picker/color-list-picker/types.js.map

@@ -1 +1,7 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/duotone-picker/color-list-picker/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\nexport type ColorListPickerProps = {\n\t/**\n\t * A list of predefined colors. Each color is an object with a `name` and a\n\t * `color` value.\n\t * The `name` is a string used to identify the color in the UI.\n\t * The `color` is a valid CSS color string.\n\t */\n\tcolors: Array< {\n\t\tname: string;\n\t\tcolor: NonNullable< CSSProperties[ 'color' ] >;\n\t} >;\n\t/**\n\t * A list of labels for each of the options displayed in the UI.\n\t */\n\tlabels: Array< string >;\n\t/**\n\t * An array containing the currently selected colors.\n\t */\n\tvalue?: Array< string >;\n\t/**\n\t * Controls whether the custom color picker is displayed.\n\t */\n\tdisableCustomColors?: boolean;\n\t/**\n\t * Controls whether the ColorPalette should show an alpha channel control.\n\t */\n\tenableAlpha?: boolean;\n\t/**\n\t * A function that receives the updated color value.\n\t */\n\tonChange: ( newValue: Array< string | undefined > ) => void;\n};\n\nexport type ColorOptionProps = Pick<\n\tColorListPickerProps,\n\t'colors' | 'disableCustomColors' | 'enableAlpha'\n> & {\n\tlabel: ColorListPickerProps[ 'labels' ][ number ];\n\tvalue: string | undefined;\n\tonChange: ( newValue: string | undefined ) => void;\n};\n"],"mappings":"","ignoreList":[]}
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/duotone-picker/custom-duotone-bar.js

@@ -1,11 +1,8 @@
-/**
- * Internal dependencies
- */
-import CustomGradientBar from '../custom-gradient-picker/gradient-bar';
-import { getColorStopsFromColors, getGradientFromCSSColors, getColorsFromColorStops } from './utils';
+import CustomGradientBar from "../custom-gradient-picker/gradient-bar";
+import { getColorStopsFromColors, getGradientFromCSSColors, getColorsFromColorStops } from "./utils";
 import { jsx as _jsx } from "react/jsx-runtime";
-const PLACEHOLDER_VALUES = ['#333', '#CCC'];
-export default function CustomDuotoneBar({
+const PLACEHOLDER_VALUES = ["#333", "#CCC"];
+function CustomDuotoneBar({
   value,
   onChange
 }) {
@@ -13,15 +10,18 @@ export default function CustomDuotoneBar({
   const values = hasGradient ? value : PLACEHOLDER_VALUES;
   const background = getGradientFromCSSColors(values);
   const controlPoints = getColorStopsFromColors(values);
-  return /*#__PURE__*/_jsx(CustomGradientBar, {
+  return /* @__PURE__ */ _jsx(CustomGradientBar, {
     disableInserter: true,
-    background: background,
-    hasGradient: hasGradient,
+    background,
+    hasGradient,
     value: controlPoints,
-    onChange: newColorStops => {
+    onChange: (newColorStops) => {
       const newValue = getColorsFromColorStops(newColorStops);
       onChange(newValue);
     }
   });
 }
-//# sourceMappingURL=custom-duotone-bar.js.map
+export {
+  CustomDuotoneBar as default
+};
+//# sourceMappingURL=custom-duotone-bar.js.map

package/build-module/duotone-picker/custom-duotone-bar.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["CustomGradientBar","getColorStopsFromColors","getGradientFromCSSColors","getColorsFromColorStops","jsx","_jsx","PLACEHOLDER_VALUES","CustomDuotoneBar","value","onChange","hasGradient","values","background","controlPoints","disableInserter","newColorStops","newValue"],"sources":["@wordpress/components/src/duotone-picker/custom-duotone-bar.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport CustomGradientBar from '../custom-gradient-picker/gradient-bar';\n\nimport {\n\tgetColorStopsFromColors,\n\tgetGradientFromCSSColors,\n\tgetColorsFromColorStops,\n} from './utils';\n\nconst PLACEHOLDER_VALUES = [ '#333', '#CCC' ];\n\nexport default function CustomDuotoneBar( {\n\tvalue,\n\tonChange,\n}: {\n\tvalue?: string[];\n\tonChange: ( value?: string[] ) => void;\n} ) {\n\tconst hasGradient = !! value;\n\tconst values = hasGradient ? value : PLACEHOLDER_VALUES;\n\tconst background = getGradientFromCSSColors( values );\n\tconst controlPoints = getColorStopsFromColors( values );\n\treturn (\n\t\t<CustomGradientBar\n\t\t\tdisableInserter\n\t\t\tbackground={ background }\n\t\t\thasGradient={ hasGradient }\n\t\t\tvalue={ controlPoints }\n\t\t\tonChange={ ( newColorStops ) => {\n\t\t\t\tconst newValue = getColorsFromColorStops( newColorStops );\n\t\t\t\tonChange( newValue );\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,iBAAiB,MAAM,wCAAwC;AAEtE,SACCC,uBAAuB,EACvBC,wBAAwB,EACxBC,uBAAuB,QACjB,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEjB,MAAMC,kBAAkB,GAAG,CAAE,MAAM,EAAE,MAAM,CAAE;AAE7C,eAAe,SAASC,gBAAgBA,CAAE;EACzCC,KAAK;EACLC;AAID,CAAC,EAAG;EACH,MAAMC,WAAW,GAAG,CAAC,CAAEF,KAAK;EAC5B,MAAMG,MAAM,GAAGD,WAAW,GAAGF,KAAK,GAAGF,kBAAkB;EACvD,MAAMM,UAAU,GAAGV,wBAAwB,CAAES,MAAO,CAAC;EACrD,MAAME,aAAa,GAAGZ,uBAAuB,CAAEU,MAAO,CAAC;EACvD,oBACCN,IAAA,CAACL,iBAAiB;IACjBc,eAAe;IACfF,UAAU,EAAGA,UAAY;IACzBF,WAAW,EAAGA,WAAa;IAC3BF,KAAK,EAAGK,aAAe;IACvBJ,QAAQ,EAAKM,aAAa,IAAM;MAC/B,MAAMC,QAAQ,GAAGb,uBAAuB,CAAEY,aAAc,CAAC;MACzDN,QAAQ,CAAEO,QAAS,CAAC;IACrB;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/duotone-picker/custom-duotone-bar.tsx"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport CustomGradientBar from '../custom-gradient-picker/gradient-bar';\nimport { getColorStopsFromColors, getGradientFromCSSColors, getColorsFromColorStops } from './utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst PLACEHOLDER_VALUES = ['#333', '#CCC'];\nexport default function CustomDuotoneBar({\n  value,\n  onChange\n}) {\n  const hasGradient = !!value;\n  const values = hasGradient ? value : PLACEHOLDER_VALUES;\n  const background = getGradientFromCSSColors(values);\n  const controlPoints = getColorStopsFromColors(values);\n  return /*#__PURE__*/_jsx(CustomGradientBar, {\n    disableInserter: true,\n    background: background,\n    hasGradient: hasGradient,\n    value: controlPoints,\n    onChange: newColorStops => {\n      const newValue = getColorsFromColorStops(newColorStops);\n      onChange(newValue);\n    }\n  });\n}"],
+  "mappings": "AAGA,OAAO,uBAAuB;AAC9B,SAAS,yBAAyB,0BAA0B,+BAA+B;AAC3F,SAAS,OAAO,YAAY;AAC5B,MAAM,qBAAqB,CAAC,QAAQ,MAAM;AAC3B,SAAR,iBAAkC;AAAA,EACvC;AAAA,EACA;AACF,GAAG;AACD,QAAM,cAAc,CAAC,CAAC;AACtB,QAAM,SAAS,cAAc,QAAQ;AACrC,QAAM,aAAa,yBAAyB,MAAM;AAClD,QAAM,gBAAgB,wBAAwB,MAAM;AACpD,SAAoB,qBAAK,mBAAmB;AAAA,IAC1C,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,UAAU,mBAAiB;AACzB,YAAM,WAAW,wBAAwB,aAAa;AACtD,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,CAAC;AACH;",
+  "names": []
+}