@wordpress/components 27.5.0 → 28.0.0

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

@@ -1,4 +1,3 @@
-import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */
@@ -19,6 +18,9 @@ import { SVG, Circle } from '@wordpress/primitives';
 import { useContextSystem, contextConnect } from '../context';
 import Icon from '../icon';
 import * as Styled from './styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 export const DropdownMenuContext = createContext(undefined);
 export const DropdownMenuItem = forwardRef(function DropdownMenuItem({
   prefix,
@@ -28,13 +30,22 @@ export const DropdownMenuItem = forwardRef(function DropdownMenuItem({
   ...props
 }, ref) {
   const dropdownMenuContext = useContext(DropdownMenuContext);
-  return createElement(Styled.DropdownMenuItem, {
+  return /*#__PURE__*/_jsxs(Styled.DropdownMenuItem, {
     ref: ref,
     ...props,
     accessibleWhenDisabled: true,
     hideOnClick: hideOnClick,
-    store: dropdownMenuContext?.store
-  }, createElement(Styled.ItemPrefixWrapper, null, prefix), createElement(Styled.DropdownMenuItemContentWrapper, null, createElement(Styled.DropdownMenuItemChildrenWrapper, null, children), suffix && createElement(Styled.ItemSuffixWrapper, null, suffix)));
+    store: dropdownMenuContext?.store,
+    children: [/*#__PURE__*/_jsx(Styled.ItemPrefixWrapper, {
+      children: prefix
+    }), /*#__PURE__*/_jsxs(Styled.DropdownMenuItemContentWrapper, {
+      children: [/*#__PURE__*/_jsx(Styled.DropdownMenuItemChildrenWrapper, {
+        children: children
+      }), suffix && /*#__PURE__*/_jsx(Styled.ItemSuffixWrapper, {
+        children: suffix
+      })]
+    })]
+  });
 });
 export const DropdownMenuCheckboxItem = forwardRef(function DropdownMenuCheckboxItem({
   suffix,
@@ -43,34 +54,43 @@ export const DropdownMenuCheckboxItem = forwardRef(function DropdownMenuCheckbox
   ...props
 }, ref) {
   const dropdownMenuContext = useContext(DropdownMenuContext);
-  return createElement(Styled.DropdownMenuCheckboxItem, {
+  return /*#__PURE__*/_jsxs(Styled.DropdownMenuCheckboxItem, {
     ref: ref,
     ...props,
     accessibleWhenDisabled: true,
     hideOnClick: hideOnClick,
-    store: dropdownMenuContext?.store
-  }, createElement(Ariakit.MenuItemCheck, {
     store: dropdownMenuContext?.store,
-    render: createElement(Styled.ItemPrefixWrapper, null)
-    // Override some ariakit inline styles
-    ,
-    style: {
-      width: 'auto',
-      height: 'auto'
-    }
-  }, createElement(Icon, {
-    icon: check,
-    size: 24
-  })), createElement(Styled.DropdownMenuItemContentWrapper, null, createElement(Styled.DropdownMenuItemChildrenWrapper, null, children), suffix && createElement(Styled.ItemSuffixWrapper, null, suffix)));
+    children: [/*#__PURE__*/_jsx(Ariakit.MenuItemCheck, {
+      store: dropdownMenuContext?.store,
+      render: /*#__PURE__*/_jsx(Styled.ItemPrefixWrapper, {})
+      // Override some ariakit inline styles
+      ,
+      style: {
+        width: 'auto',
+        height: 'auto'
+      },
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: check,
+        size: 24
+      })
+    }), /*#__PURE__*/_jsxs(Styled.DropdownMenuItemContentWrapper, {
+      children: [/*#__PURE__*/_jsx(Styled.DropdownMenuItemChildrenWrapper, {
+        children: children
+      }), suffix && /*#__PURE__*/_jsx(Styled.ItemSuffixWrapper, {
+        children: suffix
+      })]
+    })]
+  });
 });
-const radioCheck = createElement(SVG, {
+const radioCheck = /*#__PURE__*/_jsx(SVG, {
   xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24"
-}, createElement(Circle, {
-  cx: 12,
-  cy: 12,
-  r: 3
-}));
+  viewBox: "0 0 24 24",
+  children: /*#__PURE__*/_jsx(Circle, {
+    cx: 12,
+    cy: 12,
+    r: 3
+  })
+});
 export const DropdownMenuRadioItem = forwardRef(function DropdownMenuRadioItem({
   suffix,
   children,
@@ -78,29 +98,37 @@ export const DropdownMenuRadioItem = forwardRef(function DropdownMenuRadioItem({
   ...props
 }, ref) {
   const dropdownMenuContext = useContext(DropdownMenuContext);
-  return createElement(Styled.DropdownMenuRadioItem, {
+  return /*#__PURE__*/_jsxs(Styled.DropdownMenuRadioItem, {
     ref: ref,
     ...props,
     accessibleWhenDisabled: true,
     hideOnClick: hideOnClick,
-    store: dropdownMenuContext?.store
-  }, createElement(Ariakit.MenuItemCheck, {
     store: dropdownMenuContext?.store,
-    render: createElement(Styled.ItemPrefixWrapper, null)
-    // Override some ariakit inline styles
-    ,
-    style: {
-      width: 'auto',
-      height: 'auto'
-    }
-  }, createElement(Icon, {
-    icon: radioCheck,
-    size: 24
-  })), createElement(Styled.DropdownMenuItemContentWrapper, null, createElement(Styled.DropdownMenuItemChildrenWrapper, null, children), suffix && createElement(Styled.ItemSuffixWrapper, null, suffix)));
+    children: [/*#__PURE__*/_jsx(Ariakit.MenuItemCheck, {
+      store: dropdownMenuContext?.store,
+      render: /*#__PURE__*/_jsx(Styled.ItemPrefixWrapper, {})
+      // Override some ariakit inline styles
+      ,
+      style: {
+        width: 'auto',
+        height: 'auto'
+      },
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: radioCheck,
+        size: 24
+      })
+    }), /*#__PURE__*/_jsxs(Styled.DropdownMenuItemContentWrapper, {
+      children: [/*#__PURE__*/_jsx(Styled.DropdownMenuItemChildrenWrapper, {
+        children: children
+      }), suffix && /*#__PURE__*/_jsx(Styled.ItemSuffixWrapper, {
+        children: suffix
+      })]
+    })]
+  });
 });
 export const DropdownMenuGroup = forwardRef(function DropdownMenuGroup(props, ref) {
   const dropdownMenuContext = useContext(DropdownMenuContext);
-  return createElement(Styled.DropdownMenuGroup, {
+  return /*#__PURE__*/_jsx(Styled.DropdownMenuGroup, {
     ref: ref,
     ...props,
     store: dropdownMenuContext?.store
@@ -176,44 +204,50 @@ const UnconnectedDropdownMenu = (props, ref) => {
       direction: computedDirection
     }
   }), [computedDirection]);
-  return createElement(Fragment, null, createElement(Ariakit.MenuButton, {
-    ref: ref,
-    store: dropdownMenuStore,
-    render: dropdownMenuStore.parent ? cloneElement(trigger, {
-      // Add submenu arrow, unless a `suffix` is explicitly specified
-      suffix: createElement(Fragment, null, trigger.props.suffix, createElement(Styled.SubmenuChevronIcon, {
-        "aria-hidden": "true",
-        icon: chevronRightSmall,
-        size: 24,
-        preserveAspectRatio: "xMidYMid slice"
-      }))
-    }) : trigger
-  }), createElement(Styled.DropdownMenu, {
-    ...otherProps,
-    modal: modal,
-    store: dropdownMenuStore
-    // Root menu has an 8px distance from its trigger,
-    // otherwise 0 (which causes the submenu to slightly overlap)
-    ,
-    gutter: gutter !== null && gutter !== void 0 ? gutter : dropdownMenuStore.parent ? 0 : 8
-    // Align nested menu by the same (but opposite) amount
-    // as the menu container's padding.
-    ,
-    shift: shift !== null && shift !== void 0 ? shift : dropdownMenuStore.parent ? -4 : 0,
-    hideOnHoverOutside: false,
-    "data-side": appliedPlacementSide,
-    variant: variant,
-    wrapperProps: wrapperProps,
-    hideOnEscape: hideOnEscape,
-    unmountOnHide: true
-  }, createElement(DropdownMenuContext.Provider, {
-    value: contextValue
-  }, children)));
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Ariakit.MenuButton, {
+      ref: ref,
+      store: dropdownMenuStore,
+      render: dropdownMenuStore.parent ? cloneElement(trigger, {
+        // Add submenu arrow, unless a `suffix` is explicitly specified
+        suffix: /*#__PURE__*/_jsxs(_Fragment, {
+          children: [trigger.props.suffix, /*#__PURE__*/_jsx(Styled.SubmenuChevronIcon, {
+            "aria-hidden": "true",
+            icon: chevronRightSmall,
+            size: 24,
+            preserveAspectRatio: "xMidYMid slice"
+          })]
+        })
+      }) : trigger
+    }), /*#__PURE__*/_jsx(Styled.DropdownMenu, {
+      ...otherProps,
+      modal: modal,
+      store: dropdownMenuStore
+      // Root menu has an 8px distance from its trigger,
+      // otherwise 0 (which causes the submenu to slightly overlap)
+      ,
+      gutter: gutter !== null && gutter !== void 0 ? gutter : dropdownMenuStore.parent ? 0 : 8
+      // Align nested menu by the same (but opposite) amount
+      // as the menu container's padding.
+      ,
+      shift: shift !== null && shift !== void 0 ? shift : dropdownMenuStore.parent ? -4 : 0,
+      hideOnHoverOutside: false,
+      "data-side": appliedPlacementSide,
+      variant: variant,
+      wrapperProps: wrapperProps,
+      hideOnEscape: hideOnEscape,
+      unmountOnHide: true,
+      children: /*#__PURE__*/_jsx(DropdownMenuContext.Provider, {
+        value: contextValue,
+        children: children
+      })
+    })]
+  });
 };
 export const DropdownMenu = contextConnect(UnconnectedDropdownMenu, 'DropdownMenu');
 export const DropdownMenuSeparator = forwardRef(function DropdownMenuSeparator(props, ref) {
   const dropdownMenuContext = useContext(DropdownMenuContext);
-  return createElement(Styled.DropdownMenuSeparator, {
+  return /*#__PURE__*/_jsx(Styled.DropdownMenuSeparator, {
     ref: ref,
     ...props,
     store: dropdownMenuContext?.store,
@@ -221,14 +255,14 @@ export const DropdownMenuSeparator = forwardRef(function DropdownMenuSeparator(p
   });
 });
 export const DropdownMenuItemLabel = forwardRef(function DropdownMenuItemLabel(props, ref) {
-  return createElement(Styled.DropdownMenuItemLabel, {
+  return /*#__PURE__*/_jsx(Styled.DropdownMenuItemLabel, {
     numberOfLines: 1,
     ref: ref,
     ...props
   });
 });
 export const DropdownMenuItemHelpText = forwardRef(function DropdownMenuItemHelpText(props, ref) {
-  return createElement(Styled.DropdownMenuItemHelpText, {
+  return /*#__PURE__*/_jsx(Styled.DropdownMenuItemHelpText, {
     numberOfLines: 2,
     ref: ref,
     ...props

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

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","forwardRef","createContext","useContext","useMemo","cloneElement","isValidElement","useCallback","isRTL","check","chevronRightSmall","SVG","Circle","useContextSystem","contextConnect","Icon","Styled","DropdownMenuContext","undefined","DropdownMenuItem","prefix","suffix","children","hideOnClick","props","ref","dropdownMenuContext","createElement","accessibleWhenDisabled","store","ItemPrefixWrapper","DropdownMenuItemContentWrapper","DropdownMenuItemChildrenWrapper","ItemSuffixWrapper","DropdownMenuCheckboxItem","MenuItemCheck","render","style","width","height","icon","size","radioCheck","xmlns","viewBox","cx","cy","r","DropdownMenuRadioItem","DropdownMenuGroup","UnconnectedDropdownMenu","_props$placement","open","defaultOpen","onOpenChange","placement","trigger","gutter","shift","modal","variant","otherProps","parentContext","computedDirection","computedPlacement","test","replace","dropdownMenuStore","useMenuStore","parent","focusLoop","setOpen","willBeOpen","rtl","contextValue","appliedPlacementSide","useState","split","type","console","warn","hideOnEscape","event","preventDefault","wrapperProps","dir","direction","Fragment","MenuButton","SubmenuChevronIcon","preserveAspectRatio","DropdownMenu","hideOnHoverOutside","unmountOnHide","Provider","value","DropdownMenuSeparator","DropdownMenuItemLabel","numberOfLines","DropdownMenuItemHelpText"],"sources":["@wordpress/components/src/dropdown-menu-v2/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tcloneElement,\n\tisValidElement,\n\tuseCallback,\n} from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\nimport { check, chevronRightSmall } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnect } from '../context';\nimport type { WordPressComponentProps } from '../context';\nimport Icon from '../icon';\nimport type {\n\tDropdownMenuContext as DropdownMenuContextType,\n\tDropdownMenuProps,\n\tDropdownMenuGroupProps,\n\tDropdownMenuItemProps,\n\tDropdownMenuCheckboxItemProps,\n\tDropdownMenuRadioItemProps,\n\tDropdownMenuSeparatorProps,\n} from './types';\nimport * as Styled from './styles';\n\nexport const DropdownMenuContext = createContext<\n\tDropdownMenuContextType | undefined\n>( undefined );\n\nexport const DropdownMenuItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuItemProps, 'div', false >\n>( function DropdownMenuItem(\n\t{ prefix, suffix, children, hideOnClick = true, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Styled.ItemPrefixWrapper>{ prefix }</Styled.ItemPrefixWrapper>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuItem>\n\t);\n} );\n\nexport const DropdownMenuCheckboxItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuCheckboxItemProps, 'div', false >\n>( function DropdownMenuCheckboxItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuCheckboxItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ check } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuCheckboxItem>\n\t);\n} );\n\nconst radioCheck = (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 }></Circle>\n\t</SVG>\n);\n\nexport const DropdownMenuRadioItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuRadioItemProps, 'div', false >\n>( function DropdownMenuRadioItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuRadioItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ radioCheck } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuRadioItem>\n\t);\n} );\n\nexport const DropdownMenuGroup = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuGroupProps, 'div', false >\n>( function DropdownMenuGroup( props, ref ) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\treturn (\n\t\t<Styled.DropdownMenuGroup\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t/>\n\t);\n} );\n\nconst UnconnectedDropdownMenu = (\n\tprops: WordPressComponentProps< DropdownMenuProps, 'div', false >,\n\tref: React.ForwardedRef< HTMLDivElement >\n) => {\n\tconst {\n\t\t// Store props\n\t\topen,\n\t\tdefaultOpen = false,\n\t\tonOpenChange,\n\t\tplacement,\n\n\t\t// Menu trigger props\n\t\ttrigger,\n\n\t\t// Menu props\n\t\tgutter,\n\t\tchildren,\n\t\tshift,\n\t\tmodal = true,\n\n\t\t// From internal components context\n\t\tvariant,\n\n\t\t// Rest\n\t\t...otherProps\n\t} = useContextSystem<\n\t\ttypeof props & Pick< DropdownMenuContextType, 'variant' >\n\t>( props, 'DropdownMenu' );\n\n\tconst parentContext = useContext( DropdownMenuContext );\n\n\tconst computedDirection = isRTL() ? 'rtl' : 'ltr';\n\n\t// If an explicit value for the `placement` prop is not passed,\n\t// apply a default placement of `bottom-start` for the root dropdown,\n\t// and of `right-start` for nested dropdowns.\n\tlet computedPlacement =\n\t\tprops.placement ??\n\t\t( parentContext?.store ? 'right-start' : 'bottom-start' );\n\t// Swap left/right in case of RTL direction\n\tif ( computedDirection === 'rtl' ) {\n\t\tif ( /right/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'right',\n\t\t\t\t'left'\n\t\t\t) as typeof computedPlacement;\n\t\t} else if ( /left/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'left',\n\t\t\t\t'right'\n\t\t\t) as typeof computedPlacement;\n\t\t}\n\t}\n\n\tconst dropdownMenuStore = Ariakit.useMenuStore( {\n\t\tparent: parentContext?.store,\n\t\topen,\n\t\tdefaultOpen,\n\t\tplacement: computedPlacement,\n\t\tfocusLoop: true,\n\t\tsetOpen( willBeOpen ) {\n\t\t\tonOpenChange?.( willBeOpen );\n\t\t},\n\t\trtl: computedDirection === 'rtl',\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( { store: dropdownMenuStore, variant } ),\n\t\t[ dropdownMenuStore, variant ]\n\t);\n\n\t// Extract the side from the applied placement — useful for animations.\n\tconst appliedPlacementSide = dropdownMenuStore\n\t\t.useState( 'placement' )\n\t\t.split( '-' )[ 0 ];\n\n\tif (\n\t\tdropdownMenuStore.parent &&\n\t\t! ( isValidElement( trigger ) && DropdownMenuItem === trigger.type )\n\t) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t'For nested DropdownMenus, the `trigger` should always be a `DropdownMenuItem`.'\n\t\t);\n\t}\n\n\tconst hideOnEscape = useCallback(\n\t\t( event: React.KeyboardEvent< Element > ) => {\n\t\t\t// Pressing Escape can cause unexpected consequences (ie. exiting\n\t\t\t// full screen mode on MacOs, close parent modals...).\n\t\t\tevent.preventDefault();\n\t\t\t// Returning `true` causes the menu to hide.\n\t\t\treturn true;\n\t\t},\n\t\t[]\n\t);\n\n\tconst wrapperProps = useMemo(\n\t\t() => ( {\n\t\t\tdir: computedDirection,\n\t\t\tstyle: {\n\t\t\t\tdirection:\n\t\t\t\t\tcomputedDirection as React.CSSProperties[ 'direction' ],\n\t\t\t},\n\t\t} ),\n\t\t[ computedDirection ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ /* Menu trigger */ }\n\t\t\t<Ariakit.MenuButton\n\t\t\t\tref={ ref }\n\t\t\t\tstore={ dropdownMenuStore }\n\t\t\t\trender={\n\t\t\t\t\tdropdownMenuStore.parent\n\t\t\t\t\t\t? cloneElement( trigger, {\n\t\t\t\t\t\t\t\t// Add submenu arrow, unless a `suffix` is explicitly specified\n\t\t\t\t\t\t\t\tsuffix: (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t{ trigger.props.suffix }\n\t\t\t\t\t\t\t\t\t\t<Styled.SubmenuChevronIcon\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t  } )\n\t\t\t\t\t\t: trigger\n\t\t\t\t}\n\t\t\t/>\n\n\t\t\t{ /* Menu popover */ }\n\t\t\t<Styled.DropdownMenu\n\t\t\t\t{ ...otherProps }\n\t\t\t\tmodal={ modal }\n\t\t\t\tstore={ dropdownMenuStore }\n\t\t\t\t// Root menu has an 8px distance from its trigger,\n\t\t\t\t// otherwise 0 (which causes the submenu to slightly overlap)\n\t\t\t\tgutter={ gutter ?? ( dropdownMenuStore.parent ? 0 : 8 ) }\n\t\t\t\t// Align nested menu by the same (but opposite) amount\n\t\t\t\t// as the menu container's padding.\n\t\t\t\tshift={ shift ?? ( dropdownMenuStore.parent ? -4 : 0 ) }\n\t\t\t\thideOnHoverOutside={ false }\n\t\t\t\tdata-side={ appliedPlacementSide }\n\t\t\t\tvariant={ variant }\n\t\t\t\twrapperProps={ wrapperProps }\n\t\t\t\thideOnEscape={ hideOnEscape }\n\t\t\t\tunmountOnHide\n\t\t\t>\n\t\t\t\t<DropdownMenuContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownMenuContext.Provider>\n\t\t\t</Styled.DropdownMenu>\n\t\t</>\n\t);\n};\nexport const DropdownMenu = contextConnect(\n\tUnconnectedDropdownMenu,\n\t'DropdownMenu'\n);\n\nexport const DropdownMenuSeparator = forwardRef<\n\tHTMLHRElement,\n\tWordPressComponentProps< DropdownMenuSeparatorProps, 'hr', false >\n>( function DropdownMenuSeparator( props, ref ) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\treturn (\n\t\t<Styled.DropdownMenuSeparator\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\tvariant={ dropdownMenuContext?.variant }\n\t\t/>\n\t);\n} );\n\nexport const DropdownMenuItemLabel = forwardRef<\n\tHTMLSpanElement,\n\tWordPressComponentProps< { children: React.ReactNode }, 'span', true >\n>( function DropdownMenuItemLabel( props, ref ) {\n\treturn (\n\t\t<Styled.DropdownMenuItemLabel\n\t\t\tnumberOfLines={ 1 }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n} );\n\nexport const DropdownMenuItemHelpText = forwardRef<\n\tHTMLSpanElement,\n\tWordPressComponentProps< { children: React.ReactNode }, 'span', true >\n>( function DropdownMenuItemHelpText( props, ref ) {\n\treturn (\n\t\t<Styled.DropdownMenuItemHelpText\n\t\t\tnumberOfLines={ 2 }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n} );\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Ariakit","forwardRef","createContext","useContext","useMemo","cloneElement","isValidElement","useCallback","isRTL","check","chevronRightSmall","SVG","Circle","useContextSystem","contextConnect","Icon","Styled","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","DropdownMenuContext","undefined","DropdownMenuItem","prefix","suffix","children","hideOnClick","props","ref","dropdownMenuContext","accessibleWhenDisabled","store","ItemPrefixWrapper","DropdownMenuItemContentWrapper","DropdownMenuItemChildrenWrapper","ItemSuffixWrapper","DropdownMenuCheckboxItem","MenuItemCheck","render","style","width","height","icon","size","radioCheck","xmlns","viewBox","cx","cy","r","DropdownMenuRadioItem","DropdownMenuGroup","UnconnectedDropdownMenu","_props$placement","open","defaultOpen","onOpenChange","placement","trigger","gutter","shift","modal","variant","otherProps","parentContext","computedDirection","computedPlacement","test","replace","dropdownMenuStore","useMenuStore","parent","focusLoop","setOpen","willBeOpen","rtl","contextValue","appliedPlacementSide","useState","split","type","console","warn","hideOnEscape","event","preventDefault","wrapperProps","dir","direction","MenuButton","SubmenuChevronIcon","preserveAspectRatio","DropdownMenu","hideOnHoverOutside","unmountOnHide","Provider","value","DropdownMenuSeparator","DropdownMenuItemLabel","numberOfLines","DropdownMenuItemHelpText"],"sources":["@wordpress/components/src/dropdown-menu-v2/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tcloneElement,\n\tisValidElement,\n\tuseCallback,\n} from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\nimport { check, chevronRightSmall } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnect } from '../context';\nimport type { WordPressComponentProps } from '../context';\nimport Icon from '../icon';\nimport type {\n\tDropdownMenuContext as DropdownMenuContextType,\n\tDropdownMenuProps,\n\tDropdownMenuGroupProps,\n\tDropdownMenuItemProps,\n\tDropdownMenuCheckboxItemProps,\n\tDropdownMenuRadioItemProps,\n\tDropdownMenuSeparatorProps,\n} from './types';\nimport * as Styled from './styles';\n\nexport const DropdownMenuContext = createContext<\n\tDropdownMenuContextType | undefined\n>( undefined );\n\nexport const DropdownMenuItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuItemProps, 'div', false >\n>( function DropdownMenuItem(\n\t{ prefix, suffix, children, hideOnClick = true, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Styled.ItemPrefixWrapper>{ prefix }</Styled.ItemPrefixWrapper>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuItem>\n\t);\n} );\n\nexport const DropdownMenuCheckboxItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuCheckboxItemProps, 'div', false >\n>( function DropdownMenuCheckboxItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuCheckboxItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ check } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuCheckboxItem>\n\t);\n} );\n\nconst radioCheck = (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 }></Circle>\n\t</SVG>\n);\n\nexport const DropdownMenuRadioItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuRadioItemProps, 'div', false >\n>( function DropdownMenuRadioItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuRadioItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ radioCheck } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuRadioItem>\n\t);\n} );\n\nexport const DropdownMenuGroup = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuGroupProps, 'div', false >\n>( function DropdownMenuGroup( props, ref ) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\treturn (\n\t\t<Styled.DropdownMenuGroup\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t/>\n\t);\n} );\n\nconst UnconnectedDropdownMenu = (\n\tprops: WordPressComponentProps< DropdownMenuProps, 'div', false >,\n\tref: React.ForwardedRef< HTMLDivElement >\n) => {\n\tconst {\n\t\t// Store props\n\t\topen,\n\t\tdefaultOpen = false,\n\t\tonOpenChange,\n\t\tplacement,\n\n\t\t// Menu trigger props\n\t\ttrigger,\n\n\t\t// Menu props\n\t\tgutter,\n\t\tchildren,\n\t\tshift,\n\t\tmodal = true,\n\n\t\t// From internal components context\n\t\tvariant,\n\n\t\t// Rest\n\t\t...otherProps\n\t} = useContextSystem<\n\t\ttypeof props & Pick< DropdownMenuContextType, 'variant' >\n\t>( props, 'DropdownMenu' );\n\n\tconst parentContext = useContext( DropdownMenuContext );\n\n\tconst computedDirection = isRTL() ? 'rtl' : 'ltr';\n\n\t// If an explicit value for the `placement` prop is not passed,\n\t// apply a default placement of `bottom-start` for the root dropdown,\n\t// and of `right-start` for nested dropdowns.\n\tlet computedPlacement =\n\t\tprops.placement ??\n\t\t( parentContext?.store ? 'right-start' : 'bottom-start' );\n\t// Swap left/right in case of RTL direction\n\tif ( computedDirection === 'rtl' ) {\n\t\tif ( /right/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'right',\n\t\t\t\t'left'\n\t\t\t) as typeof computedPlacement;\n\t\t} else if ( /left/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'left',\n\t\t\t\t'right'\n\t\t\t) as typeof computedPlacement;\n\t\t}\n\t}\n\n\tconst dropdownMenuStore = Ariakit.useMenuStore( {\n\t\tparent: parentContext?.store,\n\t\topen,\n\t\tdefaultOpen,\n\t\tplacement: computedPlacement,\n\t\tfocusLoop: true,\n\t\tsetOpen( willBeOpen ) {\n\t\t\tonOpenChange?.( willBeOpen );\n\t\t},\n\t\trtl: computedDirection === 'rtl',\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( { store: dropdownMenuStore, variant } ),\n\t\t[ dropdownMenuStore, variant ]\n\t);\n\n\t// Extract the side from the applied placement — useful for animations.\n\tconst appliedPlacementSide = dropdownMenuStore\n\t\t.useState( 'placement' )\n\t\t.split( '-' )[ 0 ];\n\n\tif (\n\t\tdropdownMenuStore.parent &&\n\t\t! ( isValidElement( trigger ) && DropdownMenuItem === trigger.type )\n\t) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t'For nested DropdownMenus, the `trigger` should always be a `DropdownMenuItem`.'\n\t\t);\n\t}\n\n\tconst hideOnEscape = useCallback(\n\t\t( event: React.KeyboardEvent< Element > ) => {\n\t\t\t// Pressing Escape can cause unexpected consequences (ie. exiting\n\t\t\t// full screen mode on MacOs, close parent modals...).\n\t\t\tevent.preventDefault();\n\t\t\t// Returning `true` causes the menu to hide.\n\t\t\treturn true;\n\t\t},\n\t\t[]\n\t);\n\n\tconst wrapperProps = useMemo(\n\t\t() => ( {\n\t\t\tdir: computedDirection,\n\t\t\tstyle: {\n\t\t\t\tdirection:\n\t\t\t\t\tcomputedDirection as React.CSSProperties[ 'direction' ],\n\t\t\t},\n\t\t} ),\n\t\t[ computedDirection ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ /* Menu trigger */ }\n\t\t\t<Ariakit.MenuButton\n\t\t\t\tref={ ref }\n\t\t\t\tstore={ dropdownMenuStore }\n\t\t\t\trender={\n\t\t\t\t\tdropdownMenuStore.parent\n\t\t\t\t\t\t? cloneElement( trigger, {\n\t\t\t\t\t\t\t\t// Add submenu arrow, unless a `suffix` is explicitly specified\n\t\t\t\t\t\t\t\tsuffix: (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t{ trigger.props.suffix }\n\t\t\t\t\t\t\t\t\t\t<Styled.SubmenuChevronIcon\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t  } )\n\t\t\t\t\t\t: trigger\n\t\t\t\t}\n\t\t\t/>\n\n\t\t\t{ /* Menu popover */ }\n\t\t\t<Styled.DropdownMenu\n\t\t\t\t{ ...otherProps }\n\t\t\t\tmodal={ modal }\n\t\t\t\tstore={ dropdownMenuStore }\n\t\t\t\t// Root menu has an 8px distance from its trigger,\n\t\t\t\t// otherwise 0 (which causes the submenu to slightly overlap)\n\t\t\t\tgutter={ gutter ?? ( dropdownMenuStore.parent ? 0 : 8 ) }\n\t\t\t\t// Align nested menu by the same (but opposite) amount\n\t\t\t\t// as the menu container's padding.\n\t\t\t\tshift={ shift ?? ( dropdownMenuStore.parent ? -4 : 0 ) }\n\t\t\t\thideOnHoverOutside={ false }\n\t\t\t\tdata-side={ appliedPlacementSide }\n\t\t\t\tvariant={ variant }\n\t\t\t\twrapperProps={ wrapperProps }\n\t\t\t\thideOnEscape={ hideOnEscape }\n\t\t\t\tunmountOnHide\n\t\t\t>\n\t\t\t\t<DropdownMenuContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownMenuContext.Provider>\n\t\t\t</Styled.DropdownMenu>\n\t\t</>\n\t);\n};\nexport const DropdownMenu = contextConnect(\n\tUnconnectedDropdownMenu,\n\t'DropdownMenu'\n);\n\nexport const DropdownMenuSeparator = forwardRef<\n\tHTMLHRElement,\n\tWordPressComponentProps< DropdownMenuSeparatorProps, 'hr', false >\n>( function DropdownMenuSeparator( props, ref ) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\treturn (\n\t\t<Styled.DropdownMenuSeparator\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\tvariant={ dropdownMenuContext?.variant }\n\t\t/>\n\t);\n} );\n\nexport const DropdownMenuItemLabel = forwardRef<\n\tHTMLSpanElement,\n\tWordPressComponentProps< { children: React.ReactNode }, 'span', true >\n>( function DropdownMenuItemLabel( props, ref ) {\n\treturn (\n\t\t<Styled.DropdownMenuItemLabel\n\t\t\tnumberOfLines={ 1 }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n} );\n\nexport const DropdownMenuItemHelpText = forwardRef<\n\tHTMLSpanElement,\n\tWordPressComponentProps< { children: React.ReactNode }, 'span', true >\n>( function DropdownMenuItemHelpText( props, ref ) {\n\treturn (\n\t\t<Styled.DropdownMenuItemHelpText\n\t\t\tnumberOfLines={ 2 }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n} );\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,4 +1,3 @@
-import { createElement, Fragment } from "react";
 /**
  * WordPress dependencies
  */
@@ -15,6 +14,9 @@ import ColorIndicator from '../../color-indicator';
 import Icon from '../../icon';
 import { HStack } from '../../h-stack';
 import { useInstanceId } from '@wordpress/compose';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 function ColorOption({
   label,
   value,
@@ -27,36 +29,42 @@ function ColorOption({
   const idRoot = useInstanceId(ColorOption, 'color-list-picker-option');
   const labelId = `${idRoot}__label`;
   const contentId = `${idRoot}__content`;
-  return createElement(Fragment, null, createElement(Button, {
-    className: "components-color-list-picker__swatch-button",
-    onClick: () => setIsOpen(prev => !prev),
-    "aria-expanded": isOpen,
-    "aria-controls": contentId
-  }, createElement(HStack, {
-    justify: "flex-start",
-    spacing: 2
-  }, value ? createElement(ColorIndicator, {
-    colorValue: value,
-    className: "components-color-list-picker__swatch-color"
-  }) : createElement(Icon, {
-    icon: swatch
-  }), createElement("span", {
-    id: labelId
-  }, label))), createElement("div", {
-    role: "group",
-    id: contentId,
-    "aria-labelledby": labelId,
-    "aria-hidden": !isOpen
-  }, isOpen && createElement(ColorPalette, {
-    "aria-label": __('Color options'),
-    className: "components-color-list-picker__color-picker",
-    colors: colors,
-    value: value,
-    clearable: false,
-    onChange: onChange,
-    disableCustomColors: disableCustomColors,
-    enableAlpha: enableAlpha
-  })));
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Button, {
+      className: "components-color-list-picker__swatch-button",
+      onClick: () => setIsOpen(prev => !prev),
+      "aria-expanded": isOpen,
+      "aria-controls": contentId,
+      children: /*#__PURE__*/_jsxs(HStack, {
+        justify: "flex-start",
+        spacing: 2,
+        children: [value ? /*#__PURE__*/_jsx(ColorIndicator, {
+          colorValue: value,
+          className: "components-color-list-picker__swatch-color"
+        }) : /*#__PURE__*/_jsx(Icon, {
+          icon: swatch
+        }), /*#__PURE__*/_jsx("span", {
+          id: labelId,
+          children: label
+        })]
+      })
+    }), /*#__PURE__*/_jsx("div", {
+      role: "group",
+      id: contentId,
+      "aria-labelledby": labelId,
+      "aria-hidden": !isOpen,
+      children: isOpen && /*#__PURE__*/_jsx(ColorPalette, {
+        "aria-label": __('Color options'),
+        className: "components-color-list-picker__color-picker",
+        colors: colors,
+        value: value,
+        clearable: false,
+        onChange: onChange,
+        disableCustomColors: disableCustomColors,
+        enableAlpha: enableAlpha
+      })
+    })]
+  });
 }
 function ColorListPicker({
   colors,
@@ -66,21 +74,21 @@ function ColorListPicker({
   enableAlpha,
   onChange
 }) {
-  return createElement("div", {
-    className: "components-color-list-picker"
-  }, labels.map((label, index) => createElement(ColorOption, {
-    key: index,
-    label: label,
-    value: value[index],
-    colors: colors,
-    disableCustomColors: disableCustomColors,
-    enableAlpha: enableAlpha,
-    onChange: newColor => {
-      const newColors = value.slice();
-      newColors[index] = newColor;
-      onChange(newColors);
-    }
-  })));
+  return /*#__PURE__*/_jsx("div", {
+    className: "components-color-list-picker",
+    children: labels.map((label, index) => /*#__PURE__*/_jsx(ColorOption, {
+      label: label,
+      value: value[index],
+      colors: colors,
+      disableCustomColors: disableCustomColors,
+      enableAlpha: enableAlpha,
+      onChange: newColor => {
+        const newColors = value.slice();
+        newColors[index] = newColor;
+        onChange(newColors);
+      }
+    }, index))
+  });
 }
 export default ColorListPicker;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["useState","swatch","__","Button","ColorPalette","ColorIndicator","Icon","HStack","useInstanceId","ColorOption","label","value","colors","disableCustomColors","enableAlpha","onChange","isOpen","setIsOpen","idRoot","labelId","contentId","createElement","Fragment","className","onClick","prev","justify","spacing","colorValue","icon","id","role","clearable","ColorListPicker","labels","map","index","key","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 { HStack } from '../../h-stack';\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\tclassName=\"components-color-list-picker__swatch-button\"\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>\n\t\t\t\t<HStack justify=\"flex-start\" spacing={ 2 }>\n\t\t\t\t\t{ value ? (\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\t<span id={ labelId }>{ label }</span>\n\t\t\t\t</HStack>\n\t\t\t</Button>\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":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,YAAY,MAAM,qBAAqB;AAC9C,OAAOC,cAAc,MAAM,uBAAuB;AAClD,OAAOC,IAAI,MAAM,YAAY;AAC7B,SAASC,MAAM,QAAQ,eAAe;AAEtC,SAASC,aAAa,QAAQ,oBAAoB;AAElD,SAASC,WAAWA,CAAE;EACrBC,KAAK;EACLC,KAAK;EACLC,MAAM;EACNC,mBAAmB;EACnBC,WAAW;EACXC;AACiB,CAAC,EAAG;EACrB,MAAM,CAAEC,MAAM,EAAEC,SAAS,CAAE,GAAGjB,QAAQ,CAAE,KAAM,CAAC;EAC/C,MAAMkB,MAAM,GAAGV,aAAa,CAAEC,WAAW,EAAE,0BAA2B,CAAC;EACvE,MAAMU,OAAO,GAAI,GAAGD,MAAQ,SAAQ;EACpC,MAAME,SAAS,GAAI,GAAGF,MAAQ,WAAU;EAExC,OACCG,aAAA,CAAAC,QAAA,QACCD,aAAA,CAAClB,MAAM;IACNoB,SAAS,EAAC,6CAA6C;IACvDC,OAAO,EAAGA,CAAA,KAAMP,SAAS,CAAIQ,IAAI,IAAM,CAAEA,IAAK,CAAG;IACjD,iBAAgBT,MAAQ;IACxB,iBAAgBI;EAAW,GAE3BC,aAAA,CAACd,MAAM;IAACmB,OAAO,EAAC,YAAY;IAACC,OAAO,EAAG;EAAG,GACvChB,KAAK,GACNU,aAAA,CAAChB,cAAc;IACduB,UAAU,EAAGjB,KAAO;IACpBY,SAAS,EAAC;EAA4C,CACtD,CAAC,GAEFF,aAAA,CAACf,IAAI;IAACuB,IAAI,EAAG5B;EAAQ,CAAE,CACvB,EACDoB,aAAA;IAAMS,EAAE,EAAGX;EAAS,GAAGT,KAAa,CAC7B,CACD,CAAC,EACTW,aAAA;IACCU,IAAI,EAAC,OAAO;IACZD,EAAE,EAAGV,SAAW;IAChB,mBAAkBD,OAAS;IAC3B,eAAc,CAAEH;EAAQ,GAEtBA,MAAM,IACPK,aAAA,CAACjB,YAAY;IACZ,cAAaF,EAAE,CAAE,eAAgB,CAAG;IACpCqB,SAAS,EAAC,4CAA4C;IACtDX,MAAM,EAAGA,MAAQ;IACjBD,KAAK,EAAGA,KAAO;IACfqB,SAAS,EAAG,KAAO;IACnBjB,QAAQ,EAAGA,QAAU;IACrBF,mBAAmB,EAAGA,mBAAqB;IAC3CC,WAAW,EAAGA;EAAa,CAC3B,CAEE,CACJ,CAAC;AAEL;AAEA,SAASmB,eAAeA,CAAE;EACzBrB,MAAM;EACNsB,MAAM;EACNvB,KAAK,GAAG,EAAE;EACVE,mBAAmB;EACnBC,WAAW;EACXC;AACqB,CAAC,EAAG;EACzB,OACCM,aAAA;IAAKE,SAAS,EAAC;EAA8B,GAC1CW,MAAM,CAACC,GAAG,CAAE,CAAEzB,KAAK,EAAE0B,KAAK,KAC3Bf,aAAA,CAACZ,WAAW;IACX4B,GAAG,EAAGD,KAAO;IACb1B,KAAK,EAAGA,KAAO;IACfC,KAAK,EAAGA,KAAK,CAAEyB,KAAK,CAAI;IACxBxB,MAAM,EAAGA,MAAQ;IACjBC,mBAAmB,EAAGA,mBAAqB;IAC3CC,WAAW,EAAGA,WAAa;IAC3BC,QAAQ,EAAKuB,QAAQ,IAAM;MAC1B,MAAMC,SAAmC,GACxC5B,KAAK,CAAC6B,KAAK,CAAC,CAAC;MACdD,SAAS,CAAEH,KAAK,CAAE,GAAGE,QAAQ;MAC7BvB,QAAQ,CAAEwB,SAAU,CAAC;IACtB;EAAG,CACH,CACA,CACE,CAAC;AAER;AAEA,eAAeN,eAAe","ignoreList":[]}
+{"version":3,"names":["useState","swatch","__","Button","ColorPalette","ColorIndicator","Icon","HStack","useInstanceId","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ColorOption","label","value","colors","disableCustomColors","enableAlpha","onChange","isOpen","setIsOpen","idRoot","labelId","contentId","children","className","onClick","prev","justify","spacing","colorValue","icon","id","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 { HStack } from '../../h-stack';\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\tclassName=\"components-color-list-picker__swatch-button\"\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>\n\t\t\t\t<HStack justify=\"flex-start\" spacing={ 2 }>\n\t\t\t\t\t{ value ? (\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\t<span id={ labelId }>{ label }</span>\n\t\t\t\t</HStack>\n\t\t\t</Button>\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":[]}

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

@@ -1,9 +1,9 @@
-import { createElement } from "react";
 /**
  * Internal dependencies
  */
 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({
   value,
@@ -13,7 +13,7 @@ export default function CustomDuotoneBar({
   const values = hasGradient ? value : PLACEHOLDER_VALUES;
   const background = getGradientFromCSSColors(values);
   const controlPoints = getColorStopsFromColors(values);
-  return createElement(CustomGradientBar, {
+  return /*#__PURE__*/_jsx(CustomGradientBar, {
     disableInserter: true,
     background: background,
     hasGradient: hasGradient,

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

@@ -1 +1 @@
-{"version":3,"names":["CustomGradientBar","getColorStopsFromColors","getGradientFromCSSColors","getColorsFromColorStops","PLACEHOLDER_VALUES","CustomDuotoneBar","value","onChange","hasGradient","values","background","controlPoints","createElement","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;AAEhB,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,GAAGR,wBAAwB,CAAEO,MAAO,CAAC;EACrD,MAAME,aAAa,GAAGV,uBAAuB,CAAEQ,MAAO,CAAC;EACvD,OACCG,aAAA,CAACZ,iBAAiB;IACjBa,eAAe;IACfH,UAAU,EAAGA,UAAY;IACzBF,WAAW,EAAGA,WAAa;IAC3BF,KAAK,EAAGK,aAAe;IACvBJ,QAAQ,EAAKO,aAAa,IAAM;MAC/B,MAAMC,QAAQ,GAAGZ,uBAAuB,CAAEW,aAAc,CAAC;MACzDP,QAAQ,CAAEQ,QAAS,CAAC;IACrB;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}
+{"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":[]}