@wordpress/components 27.6.0 → 28.0.1

package/build/custom-select-control/index.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.StableCustomSelectControl = StableCustomSelectControl;
 exports.default = CustomSelectControl;
-var _react = require("react");
 var _downshift = require("downshift");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _icons = require("@wordpress/icons");
@@ -18,6 +17,7 @@ var _chevronDown = _interopRequireDefault(require("../select-control/chevron-dow
 var _baseControlStyles = require("../base-control/styles/base-control-styles");
 var _useDeprecatedProps = require("../utils/use-deprecated-props");
 var _inputBase = _interopRequireDefault(require("../input-control/input-base"));
+var _jsxRuntime = require("react/jsx-runtime");
 // @ts-nocheck
 /**
  * External dependencies
@@ -110,7 +110,7 @@ function CustomSelectControl(props) {
     // translators: %s: The selected option.
     return (0, _i18n.sprintf)((0, _i18n.__)('Currently selected: %s'), selectedItem.name);
   }
-  const menuProps = getMenuProps({
+  let menuProps = getMenuProps({
     className: 'components-custom-select-control__menu',
     'aria-hidden': !isOpen
   });
@@ -121,67 +121,80 @@ function CustomSelectControl(props) {
 
   // We need this here, because the null active descendant is not fully ARIA compliant.
   if (menuProps['aria-activedescendant']?.startsWith('downshift-null')) {
-    delete menuProps['aria-activedescendant'];
+    const {
+      'aria-activedescendant': ariaActivedescendant,
+      ...restMenuProps
+    } = menuProps;
+    menuProps = restMenuProps;
   }
-  return (0, _react.createElement)("div", {
-    className: (0, _clsx.default)('components-custom-select-control', className)
-  }, hideLabelFromVision ? (0, _react.createElement)(_visuallyHidden.VisuallyHidden, {
-    as: "label",
-    ...getLabelProps()
-  }, label) : /* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */
-  (0, _react.createElement)(_baseControlStyles.StyledLabel, {
-    ...getLabelProps({
-      className: 'components-custom-select-control__label'
-    })
-  }, label), (0, _react.createElement)(_inputBase.default, {
-    __next40pxDefaultSize: __next40pxDefaultSize,
-    size: size,
-    suffix: (0, _react.createElement)(_chevronDown.default, null)
-  }, (0, _react.createElement)(_selectControlStyles.Select, {
-    onMouseOver: onMouseOver,
-    onMouseOut: onMouseOut,
-    as: "button",
-    onFocus: onFocus,
-    onBlur: onBlur,
-    selectSize: size,
-    __next40pxDefaultSize: __next40pxDefaultSize,
-    ...getToggleButtonProps({
-      // This is needed because some speech recognition software don't support `aria-labelledby`.
-      'aria-label': label,
-      'aria-labelledby': undefined,
-      className: 'components-custom-select-control__button',
-      describedBy: getDescribedBy()
-    })
-  }, itemToString(selectedItem), __experimentalShowSelectedHint && selectedItem.__experimentalHint && (0, _react.createElement)("span", {
-    className: "components-custom-select-control__hint"
-  }, selectedItem.__experimentalHint)), (0, _react.createElement)("div", {
-    className: "components-custom-select-control__menu-wrapper"
-  }, (0, _react.createElement)("ul", {
-    ...menuProps,
-    onKeyDown: onKeyDownHandler
-  }, isOpen && items.map((item, index) =>
-  // eslint-disable-next-line react/jsx-key
-  (0, _react.createElement)("li", {
-    ...getItemProps({
-      item,
-      index,
-      key: item.key,
-      className: (0, _clsx.default)(item.className, 'components-custom-select-control__item', {
-        'is-highlighted': index === highlightedIndex,
-        'has-hint': !!item.__experimentalHint,
-        'is-next-40px-default-size': __next40pxDefaultSize
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _clsx.default)('components-custom-select-control', className),
+    children: [hideLabelFromVision ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_visuallyHidden.VisuallyHidden, {
+      as: "label",
+      ...getLabelProps(),
+      children: label
+    }) :
+    /*#__PURE__*/
+    /* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */
+    (0, _jsxRuntime.jsx)(_baseControlStyles.StyledLabel, {
+      ...getLabelProps({
+        className: 'components-custom-select-control__label'
       }),
-      style: item.style
-    })
-  }, item.name, item.__experimentalHint && (0, _react.createElement)("span", {
-    className: "components-custom-select-control__item-hint"
-  }, item.__experimentalHint), item === selectedItem && (0, _react.createElement)(_icons.Icon, {
-    icon: _icons.check,
-    className: "components-custom-select-control__item-icon"
-  })))))));
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_inputBase.default, {
+      __next40pxDefaultSize: __next40pxDefaultSize,
+      size: size,
+      suffix: /*#__PURE__*/(0, _jsxRuntime.jsx)(_chevronDown.default, {}),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_selectControlStyles.Select, {
+        onMouseOver: onMouseOver,
+        onMouseOut: onMouseOut,
+        as: "button",
+        onFocus: onFocus,
+        onBlur: onBlur,
+        selectSize: size,
+        __next40pxDefaultSize: __next40pxDefaultSize,
+        ...getToggleButtonProps({
+          // This is needed because some speech recognition software don't support `aria-labelledby`.
+          'aria-label': label,
+          'aria-labelledby': undefined,
+          className: 'components-custom-select-control__button',
+          describedBy: getDescribedBy()
+        }),
+        children: [itemToString(selectedItem), __experimentalShowSelectedHint && selectedItem.__experimentalHint && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "components-custom-select-control__hint",
+          children: selectedItem.__experimentalHint
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "components-custom-select-control__menu-wrapper",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
+          ...menuProps,
+          onKeyDown: onKeyDownHandler,
+          children: isOpen && items.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("li", {
+            ...getItemProps({
+              item,
+              index,
+              className: (0, _clsx.default)(item.className, 'components-custom-select-control__item', {
+                'is-highlighted': index === highlightedIndex,
+                'has-hint': !!item.__experimentalHint,
+                'is-next-40px-default-size': __next40pxDefaultSize
+              }),
+              style: item.style
+            }),
+            children: [item.name, item.__experimentalHint && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              className: "components-custom-select-control__item-hint",
+              children: item.__experimentalHint
+            }), item === selectedItem && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
+              icon: _icons.check,
+              className: "components-custom-select-control__item-icon"
+            })]
+          }, item.key))
+        })
+      })]
+    })]
+  });
 }
 function StableCustomSelectControl(props) {
-  return (0, _react.createElement)(CustomSelectControl, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomSelectControl, {
     ...props,
     __experimentalShowSelectedHint: false
   });

package/build/custom-select-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_downshift","require","_clsx","_interopRequireDefault","_icons","_i18n","_element","_visuallyHidden","_selectControlStyles","_chevronDown","_baseControlStyles","_useDeprecatedProps","_inputBase","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","useSelect","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next40pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","size","value","_selectedItem","onMouseOver","onMouseOut","onFocus","onBlur","__experimentalShowSelectedHint","useDeprecated36pxDefaultSizeProp","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","__","sprintf","menuProps","onKeyDownHandler","useCallback","e","stopPropagation","onKeyDown","startsWith","_react","createElement","clsx","VisuallyHidden","as","StyledLabel","default","suffix","Select","selectSize","__experimentalHint","map","index","key","style","Icon","icon","check","StableCustomSelectControl"],"sources":["@wordpress/components/src/custom-select-control/index.js"],"sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { useSelect } from 'downshift';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport InputBase from '../input-control/input-base';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\n\nexport default function CustomSelectControl( props ) {\n\tconst {\n\t\t/** Start opting into the larger default height that will become the default size in a future version. */\n\t\t__next40pxDefaultSize = false,\n\t\tclassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tdescribedBy,\n\t\toptions: items,\n\t\tonChange: onSelectedItemChange,\n\t\t/** @type {import('../select-control/types').SelectControlProps.size} */\n\t\tsize = 'default',\n\t\tvalue: _selectedItem,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\tonFocus,\n\t\tonBlur,\n\t\t__experimentalShowSelectedHint = false,\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'components-custom-select-control', className ) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */\n\t\t\t\t<StyledLabel\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</StyledLabel>\n\t\t\t) }\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<SelectControlSelect\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tas=\"button\"\n\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t\t{ __experimentalShowSelectedHint &&\n\t\t\t\t\t\tselectedItem.__experimentalHint && (\n\t\t\t\t\t\t\t<span className=\"components-custom-select-control__hint\">\n\t\t\t\t\t\t\t\t{ selectedItem.__experimentalHint }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t</SelectControlSelect>\n\t\t\t\t<div className=\"components-custom-select-control__menu-wrapper\">\n\t\t\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t\t\t{ isOpen &&\n\t\t\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\t\t\tclassName: clsx(\n\t\t\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t\t\t'has-hint':\n\t\t\t\t\t\t\t\t\t\t\t\t\t!! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t\t\t'is-next-40px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize,\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\tstyle: item.style,\n\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\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</li>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t</InputBase>\n\t\t</div>\n\t);\n}\n\nexport function StableCustomSelectControl( props ) {\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t{ ...props }\n\t\t\t__experimentalShowSelectedHint={ false }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_downshift","require","_clsx","_interopRequireDefault","_icons","_i18n","_element","_visuallyHidden","_selectControlStyles","_chevronDown","_baseControlStyles","_useDeprecatedProps","_inputBase","_jsxRuntime","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","useSelect","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next40pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","size","value","_selectedItem","onMouseOver","onMouseOut","onFocus","onBlur","__experimentalShowSelectedHint","useDeprecated36pxDefaultSizeProp","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","__","sprintf","menuProps","onKeyDownHandler","useCallback","e","stopPropagation","onKeyDown","startsWith","ariaActivedescendant","restMenuProps","jsxs","clsx","children","jsx","VisuallyHidden","as","StyledLabel","default","suffix","Select","selectSize","__experimentalHint","map","index","style","Icon","icon","check","key","StableCustomSelectControl"],"sources":["@wordpress/components/src/custom-select-control/index.js"],"sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { useSelect } from 'downshift';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport InputBase from '../input-control/input-base';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\n\nexport default function CustomSelectControl( props ) {\n\tconst {\n\t\t/** Start opting into the larger default height that will become the default size in a future version. */\n\t\t__next40pxDefaultSize = false,\n\t\tclassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tdescribedBy,\n\t\toptions: items,\n\t\tonChange: onSelectedItemChange,\n\t\t/** @type {import('../select-control/types').SelectControlProps.size} */\n\t\tsize = 'default',\n\t\tvalue: _selectedItem,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\tonFocus,\n\t\tonBlur,\n\t\t__experimentalShowSelectedHint = false,\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tlet menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tconst {\n\t\t\t'aria-activedescendant': ariaActivedescendant,\n\t\t\t...restMenuProps\n\t\t} = menuProps;\n\t\tmenuProps = restMenuProps;\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'components-custom-select-control', className ) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */\n\t\t\t\t<StyledLabel\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</StyledLabel>\n\t\t\t) }\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<SelectControlSelect\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tas=\"button\"\n\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t\t{ __experimentalShowSelectedHint &&\n\t\t\t\t\t\tselectedItem.__experimentalHint && (\n\t\t\t\t\t\t\t<span className=\"components-custom-select-control__hint\">\n\t\t\t\t\t\t\t\t{ selectedItem.__experimentalHint }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t</SelectControlSelect>\n\t\t\t\t<div className=\"components-custom-select-control__menu-wrapper\">\n\t\t\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t\t\t{ isOpen &&\n\t\t\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\tkey={ item.key }\n\t\t\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\tclassName: clsx(\n\t\t\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t\t\t'has-hint':\n\t\t\t\t\t\t\t\t\t\t\t\t\t!! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t\t\t'is-next-40px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize,\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\tstyle: item.style,\n\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\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</li>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t</InputBase>\n\t\t</div>\n\t);\n}\n\nexport function StableCustomSelectControl( props ) {\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t{ ...props }\n\t\t\t__experimentalShowSelectedHint={ false }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/custom-select-control-v2/custom-select.js

@@ -1,16 +1,17 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.CustomSelectContext = void 0;
-var _react = require("react");
 var _element = require("@wordpress/element");
 var _i18n = require("@wordpress/i18n");
-var _icons = require("@wordpress/icons");
 var _ = require("..");
 var Styled = _interopRequireWildcard(require("./styles"));
-var _context = require("../context");
+var _inputBase = _interopRequireDefault(require("../input-control/input-base"));
+var _chevronDown = _interopRequireDefault(require("../select-control/chevron-down"));
+var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -34,18 +35,17 @@ function defaultRenderSelectedValue(value) {
   }
   return value;
 }
-const UnconnectedCustomSelectButton = props => {
-  const {
-    renderSelectedValue,
-    size = 'default',
-    store,
-    ...restProps
-  } = (0, _context.useContextSystem)(props, 'CustomSelectControlButton');
+const CustomSelectButton = ({
+  renderSelectedValue,
+  size = 'default',
+  store,
+  ...restProps
+}) => {
   const {
     value: currentValue
   } = store.useState();
   const computedRenderSelectedValue = (0, _element.useMemo)(() => renderSelectedValue !== null && renderSelectedValue !== void 0 ? renderSelectedValue : defaultRenderSelectedValue, [renderSelectedValue]);
-  return (0, _react.createElement)(Styled.Select, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Styled.Select, {
     ...restProps,
     size: size,
     hasCustomRenderProp: !!renderSelectedValue,
@@ -53,39 +53,52 @@ const UnconnectedCustomSelectButton = props => {
     // to match legacy behavior where using arrow keys
     // move selection rather than open the popover
     ,
-    showOnKeyDown: false
-  }, (0, _react.createElement)("div", null, computedRenderSelectedValue(currentValue)), (0, _react.createElement)(_icons.Icon, {
-    icon: _icons.chevronDown,
-    size: 18
-  }));
+    showOnKeyDown: false,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: computedRenderSelectedValue(currentValue)
+    })
+  });
 };
-const CustomSelectButton = (0, _context.contextConnectWithoutRef)(UnconnectedCustomSelectButton, 'CustomSelectControlButton');
 function _CustomSelect(props) {
   const {
     children,
     hideLabelFromVision = false,
     label,
+    size,
     store,
     ...restProps
   } = props;
-  return (0, _react.createElement)(_react.Fragment, null, hideLabelFromVision ?
-  // TODO: Replace with BaseControl
-  (0, _react.createElement)(_.VisuallyHidden, {
-    as: "label"
-  }, label) : (0, _react.createElement)(Styled.SelectLabel, {
-    store: store
-  }, label), (0, _react.createElement)(CustomSelectButton, {
-    ...restProps,
-    store: store
-  }), (0, _react.createElement)(Styled.SelectPopover, {
-    gutter: 12,
-    store: store,
-    sameWidth: true
-  }, (0, _react.createElement)(CustomSelectContext.Provider, {
-    value: {
-      store
-    }
-  }, children)));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [hideLabelFromVision ?
+    /*#__PURE__*/
+    // TODO: Replace with BaseControl
+    (0, _jsxRuntime.jsx)(_.VisuallyHidden, {
+      as: "label",
+      children: label
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Styled.SelectLabel, {
+      store: store,
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_inputBase.default, {
+      __next40pxDefaultSize: true,
+      size: size,
+      suffix: /*#__PURE__*/(0, _jsxRuntime.jsx)(_chevronDown.default, {}),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomSelectButton, {
+        ...restProps,
+        size: size,
+        store: store
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Styled.SelectPopover, {
+        gutter: 12,
+        store: store,
+        sameWidth: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomSelectContext.Provider, {
+          value: {
+            store
+          },
+          children: children
+        })
+      })]
+    })]
+  });
 }
 var _default = exports.default = _CustomSelect;
 //# sourceMappingURL=custom-select.js.map

package/build/custom-select-control-v2/custom-select.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_i18n","_icons","_","Styled","_interopRequireWildcard","_context","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectContext","exports","createContext","undefined","defaultRenderSelectedValue","value","isValueEmpty","Array","isArray","length","__","sprintf","UnconnectedCustomSelectButton","props","renderSelectedValue","size","store","restProps","useContextSystem","currentValue","useState","computedRenderSelectedValue","useMemo","_react","createElement","Select","hasCustomRenderProp","showOnKeyDown","Icon","icon","chevronDown","CustomSelectButton","contextConnectWithoutRef","_CustomSelect","children","hideLabelFromVision","label","Fragment","VisuallyHidden","as","SelectLabel","SelectPopover","gutter","sameWidth","Provider","_default"],"sources":["@wordpress/components/src/custom-select-control-v2/custom-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Icon, chevronDown } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '..';\nimport * as Styled from './styles';\nimport type {\n\tCustomSelectContext as CustomSelectContextType,\n\tCustomSelectStore,\n\tCustomSelectButtonProps,\n\t_CustomSelectProps,\n} from './types';\nimport {\n\tcontextConnectWithoutRef,\n\tuseContextSystem,\n\ttype WordPressComponentProps,\n} from '../context';\n\nexport const CustomSelectContext =\n\tcreateContext< CustomSelectContextType >( undefined );\n\nfunction defaultRenderSelectedValue(\n\tvalue: CustomSelectButtonProps[ 'value' ]\n) {\n\tconst isValueEmpty = Array.isArray( value )\n\t\t? value.length === 0\n\t\t: value === undefined || value === null;\n\n\tif ( isValueEmpty ) {\n\t\treturn __( 'Select an item' );\n\t}\n\n\tif ( Array.isArray( value ) ) {\n\t\treturn value.length === 1\n\t\t\t? value[ 0 ]\n\t\t\t: // translators: %s: number of items selected (it will always be 2 or more items)\n\t\t\t  sprintf( __( '%s items selected' ), value.length );\n\t}\n\n\treturn value;\n}\n\nconst UnconnectedCustomSelectButton = (\n\tprops: Omit<\n\t\tWordPressComponentProps<\n\t\t\tCustomSelectButtonProps & CustomSelectStore,\n\t\t\t'button',\n\t\t\tfalse\n\t\t>,\n\t\t'onChange'\n\t>\n) => {\n\tconst {\n\t\trenderSelectedValue,\n\t\tsize = 'default',\n\t\tstore,\n\t\t...restProps\n\t} = useContextSystem( props, 'CustomSelectControlButton' );\n\n\tconst { value: currentValue } = store.useState();\n\n\tconst computedRenderSelectedValue = useMemo(\n\t\t() => renderSelectedValue ?? defaultRenderSelectedValue,\n\t\t[ renderSelectedValue ]\n\t);\n\n\treturn (\n\t\t<Styled.Select\n\t\t\t{ ...restProps }\n\t\t\tsize={ size }\n\t\t\thasCustomRenderProp={ !! renderSelectedValue }\n\t\t\tstore={ store }\n\t\t\t// to match legacy behavior where using arrow keys\n\t\t\t// move selection rather than open the popover\n\t\t\tshowOnKeyDown={ false }\n\t\t>\n\t\t\t<div>{ computedRenderSelectedValue( currentValue ) }</div>\n\t\t\t<Icon icon={ chevronDown } size={ 18 } />\n\t\t</Styled.Select>\n\t);\n};\n\nconst CustomSelectButton = contextConnectWithoutRef(\n\tUnconnectedCustomSelectButton,\n\t'CustomSelectControlButton'\n);\n\nfunction _CustomSelect( props: _CustomSelectProps & CustomSelectStore ) {\n\tconst {\n\t\tchildren,\n\t\thideLabelFromVision = false,\n\t\tlabel,\n\t\tstore,\n\t\t...restProps\n\t} = props;\n\n\treturn (\n\t\t<>\n\t\t\t{ hideLabelFromVision ? ( // TODO: Replace with BaseControl\n\t\t\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t<Styled.SelectLabel store={ store }>\n\t\t\t\t\t{ label }\n\t\t\t\t</Styled.SelectLabel>\n\t\t\t) }\n\t\t\t<CustomSelectButton { ...restProps } store={ store } />\n\t\t\t<Styled.SelectPopover gutter={ 12 } store={ store } sameWidth>\n\t\t\t\t<CustomSelectContext.Provider value={ { store } }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CustomSelectContext.Provider>\n\t\t\t</Styled.SelectPopover>\n\t\t</>\n\t);\n}\n\nexport default _CustomSelect;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAKA,IAAAG,CAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAC,uBAAA,CAAAL,OAAA;AAOA,IAAAM,QAAA,GAAAN,OAAA;AAIoB,SAAAO,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAtBpB;AACA;AACA;;AAKA;AACA;AACA;;AAeO,MAAMW,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAC/B,IAAAE,sBAAa,EAA6BC,SAAU,CAAC;AAEtD,SAASC,0BAA0BA,CAClCC,KAAyC,EACxC;EACD,MAAMC,YAAY,GAAGC,KAAK,CAACC,OAAO,CAAEH,KAAM,CAAC,GACxCA,KAAK,CAACI,MAAM,KAAK,CAAC,GAClBJ,KAAK,KAAKF,SAAS,IAAIE,KAAK,KAAK,IAAI;EAExC,IAAKC,YAAY,EAAG;IACnB,OAAO,IAAAI,QAAE,EAAE,gBAAiB,CAAC;EAC9B;EAEA,IAAKH,KAAK,CAACC,OAAO,CAAEH,KAAM,CAAC,EAAG;IAC7B,OAAOA,KAAK,CAACI,MAAM,KAAK,CAAC,GACtBJ,KAAK,CAAE,CAAC,CAAE;IACV;IACA,IAAAM,aAAO,EAAE,IAAAD,QAAE,EAAE,mBAAoB,CAAC,EAAEL,KAAK,CAACI,MAAO,CAAC;EACtD;EAEA,OAAOJ,KAAK;AACb;AAEA,MAAMO,6BAA6B,GAClCC,KAOC,IACG;EACJ,MAAM;IACLC,mBAAmB;IACnBC,IAAI,GAAG,SAAS;IAChBC,KAAK;IACL,GAAGC;EACJ,CAAC,GAAG,IAAAC,yBAAgB,EAAEL,KAAK,EAAE,2BAA4B,CAAC;EAE1D,MAAM;IAAER,KAAK,EAAEc;EAAa,CAAC,GAAGH,KAAK,CAACI,QAAQ,CAAC,CAAC;EAEhD,MAAMC,2BAA2B,GAAG,IAAAC,gBAAO,EAC1C,MAAMR,mBAAmB,aAAnBA,mBAAmB,cAAnBA,mBAAmB,GAAIV,0BAA0B,EACvD,CAAEU,mBAAmB,CACtB,CAAC;EAED,OACC,IAAAS,MAAA,CAAAC,aAAA,EAAC/C,MAAM,CAACgD,MAAM;IAAA,GACRR,SAAS;IACdF,IAAI,EAAGA,IAAM;IACbW,mBAAmB,EAAG,CAAC,CAAEZ,mBAAqB;IAC9CE,KAAK,EAAGA;IACR;IACA;IAAA;IACAW,aAAa,EAAG;EAAO,GAEvB,IAAAJ,MAAA,CAAAC,aAAA,eAAOH,2BAA2B,CAAEF,YAAa,CAAQ,CAAC,EAC1D,IAAAI,MAAA,CAAAC,aAAA,EAACjD,MAAA,CAAAqD,IAAI;IAACC,IAAI,EAAGC,kBAAa;IAACf,IAAI,EAAG;EAAI,CAAE,CAC1B,CAAC;AAElB,CAAC;AAED,MAAMgB,kBAAkB,GAAG,IAAAC,iCAAwB,EAClDpB,6BAA6B,EAC7B,2BACD,CAAC;AAED,SAASqB,aAAaA,CAAEpB,KAA6C,EAAG;EACvE,MAAM;IACLqB,QAAQ;IACRC,mBAAmB,GAAG,KAAK;IAC3BC,KAAK;IACLpB,KAAK;IACL,GAAGC;EACJ,CAAC,GAAGJ,KAAK;EAET,OACC,IAAAU,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAc,QAAA,QACGF,mBAAmB;EAAK;EACzB,IAAAZ,MAAA,CAAAC,aAAA,EAAChD,CAAA,CAAA8D,cAAc;IAACC,EAAE,EAAC;EAAO,GAAGH,KAAuB,CAAC,GAErD,IAAAb,MAAA,CAAAC,aAAA,EAAC/C,MAAM,CAAC+D,WAAW;IAACxB,KAAK,EAAGA;EAAO,GAChCoB,KACiB,CACpB,EACD,IAAAb,MAAA,CAAAC,aAAA,EAACO,kBAAkB;IAAA,GAAMd,SAAS;IAAGD,KAAK,EAAGA;EAAO,CAAE,CAAC,EACvD,IAAAO,MAAA,CAAAC,aAAA,EAAC/C,MAAM,CAACgE,aAAa;IAACC,MAAM,EAAG,EAAI;IAAC1B,KAAK,EAAGA,KAAO;IAAC2B,SAAS;EAAA,GAC5D,IAAApB,MAAA,CAAAC,aAAA,EAACxB,mBAAmB,CAAC4C,QAAQ;IAACvC,KAAK,EAAG;MAAEW;IAAM;EAAG,GAC9CkB,QAC2B,CACT,CACrB,CAAC;AAEL;AAAC,IAAAW,QAAA,GAAA5C,OAAA,CAAAf,OAAA,GAEc+C,aAAa","ignoreList":[]}
+{"version":3,"names":["_element","require","_i18n","_","Styled","_interopRequireWildcard","_inputBase","_interopRequireDefault","_chevronDown","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectContext","exports","createContext","undefined","defaultRenderSelectedValue","value","isValueEmpty","Array","isArray","length","__","sprintf","CustomSelectButton","renderSelectedValue","size","store","restProps","currentValue","useState","computedRenderSelectedValue","useMemo","jsx","Select","hasCustomRenderProp","showOnKeyDown","children","_CustomSelect","props","hideLabelFromVision","label","jsxs","Fragment","VisuallyHidden","as","SelectLabel","__next40pxDefaultSize","suffix","SelectPopover","gutter","sameWidth","Provider","_default"],"sources":["@wordpress/components/src/custom-select-control-v2/custom-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '..';\nimport * as Styled from './styles';\nimport type {\n\tCustomSelectContext as CustomSelectContextType,\n\tCustomSelectStore,\n\tCustomSelectButtonProps,\n\tCustomSelectButtonSize,\n\t_CustomSelectProps,\n} from './types';\nimport type { WordPressComponentProps } from '../context';\nimport InputBase from '../input-control/input-base';\nimport SelectControlChevronDown from '../select-control/chevron-down';\n\nexport const CustomSelectContext =\n\tcreateContext< CustomSelectContextType >( undefined );\n\nfunction defaultRenderSelectedValue(\n\tvalue: CustomSelectButtonProps[ 'value' ]\n) {\n\tconst isValueEmpty = Array.isArray( value )\n\t\t? value.length === 0\n\t\t: value === undefined || value === null;\n\n\tif ( isValueEmpty ) {\n\t\treturn __( 'Select an item' );\n\t}\n\n\tif ( Array.isArray( value ) ) {\n\t\treturn value.length === 1\n\t\t\t? value[ 0 ]\n\t\t\t: // translators: %s: number of items selected (it will always be 2 or more items)\n\t\t\t  sprintf( __( '%s items selected' ), value.length );\n\t}\n\n\treturn value;\n}\n\nconst CustomSelectButton = ( {\n\trenderSelectedValue,\n\tsize = 'default',\n\tstore,\n\t...restProps\n}: Omit<\n\tWordPressComponentProps<\n\t\tCustomSelectButtonProps & CustomSelectButtonSize & CustomSelectStore,\n\t\t'button',\n\t\tfalse\n\t>,\n\t'onChange'\n> ) => {\n\tconst { value: currentValue } = store.useState();\n\n\tconst computedRenderSelectedValue = useMemo(\n\t\t() => renderSelectedValue ?? defaultRenderSelectedValue,\n\t\t[ renderSelectedValue ]\n\t);\n\n\treturn (\n\t\t<Styled.Select\n\t\t\t{ ...restProps }\n\t\t\tsize={ size }\n\t\t\thasCustomRenderProp={ !! renderSelectedValue }\n\t\t\tstore={ store }\n\t\t\t// to match legacy behavior where using arrow keys\n\t\t\t// move selection rather than open the popover\n\t\t\tshowOnKeyDown={ false }\n\t\t>\n\t\t\t<div>{ computedRenderSelectedValue( currentValue ) }</div>\n\t\t</Styled.Select>\n\t);\n};\n\nfunction _CustomSelect(\n\tprops: _CustomSelectProps & CustomSelectStore & CustomSelectButtonSize\n) {\n\tconst {\n\t\tchildren,\n\t\thideLabelFromVision = false,\n\t\tlabel,\n\t\tsize,\n\t\tstore,\n\t\t...restProps\n\t} = props;\n\n\treturn (\n\t\t<>\n\t\t\t{ hideLabelFromVision ? ( // TODO: Replace with BaseControl\n\t\t\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t<Styled.SelectLabel store={ store }>\n\t\t\t\t\t{ label }\n\t\t\t\t</Styled.SelectLabel>\n\t\t\t) }\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<CustomSelectButton\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\tsize={ size }\n\t\t\t\t\tstore={ store }\n\t\t\t\t/>\n\t\t\t\t<Styled.SelectPopover gutter={ 12 } store={ store } sameWidth>\n\t\t\t\t\t<CustomSelectContext.Provider value={ { store } }>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</CustomSelectContext.Provider>\n\t\t\t\t</Styled.SelectPopover>\n\t\t\t</InputBase>\n\t\t</>\n\t);\n}\n\nexport default _CustomSelect;\n"],"mappings":"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","ignoreList":[]}

package/build/custom-select-control-v2/default-component/index.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("react");
 var Ariakit = _interopRequireWildcard(require("@ariakit/react"));
 var _customSelect = _interopRequireDefault(require("../custom-select"));
 var _item = _interopRequireDefault(require("../item"));
+var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -33,7 +33,7 @@ function CustomSelectControlV2(props) {
     defaultValue,
     value
   });
-  return (0, _react.createElement)(_customSelect.default, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_customSelect.default, {
     ...restProps,
     store: store
   });

package/build/custom-select-control-v2/default-component/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_customSelect","_interopRequireDefault","_item","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectControlV2","props","defaultValue","onChange","value","restProps","store","useSelectStore","setValue","nextValue","_react","createElement","Item","_default","exports"],"sources":["@wordpress/components/src/custom-select-control-v2/default-component/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n/**\n * Internal dependencies\n */\nimport _CustomSelect from '../custom-select';\nimport type { CustomSelectProps } from '../types';\nimport type { WordPressComponentProps } from '../../context';\nimport Item from '../item';\n\nfunction CustomSelectControlV2(\n\tprops: WordPressComponentProps< CustomSelectProps, 'button', false >\n) {\n\tconst { defaultValue, onChange, value, ...restProps } = props;\n\t// Forward props + store from v2 implementation\n\tconst store = Ariakit.useSelectStore( {\n\t\tsetValue: ( nextValue ) => onChange?.( nextValue ),\n\t\tdefaultValue,\n\t\tvalue,\n\t} );\n\n\treturn <_CustomSelect { ...restProps } store={ store } />;\n}\n\nCustomSelectControlV2.Item = Item;\n\nexport default CustomSelectControlV2;\n"],"mappings":";;;;;;;;AAIA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAIA,IAAAC,aAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,KAAA,GAAAD,sBAAA,CAAAF,OAAA;AAA2B,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAX3B;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAMA,SAASW,qBAAqBA,CAC7BC,KAAoE,EACnE;EACD,MAAM;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,KAAK;IAAE,GAAGC;EAAU,CAAC,GAAGJ,KAAK;EAC7D;EACA,MAAMK,KAAK,GAAGhC,OAAO,CAACiC,cAAc,CAAE;IACrCC,QAAQ,EAAIC,SAAS,IAAMN,QAAQ,GAAIM,SAAU,CAAC;IAClDP,YAAY;IACZE;EACD,CAAE,CAAC;EAEH,OAAO,IAAAM,MAAA,CAAAC,aAAA,EAAClC,aAAA,CAAAS,OAAa;IAAA,GAAMmB,SAAS;IAAGC,KAAK,EAAGA;EAAO,CAAE,CAAC;AAC1D;AAEAN,qBAAqB,CAACY,IAAI,GAAGA,aAAI;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA5B,OAAA,GAEnBc,qBAAqB","ignoreList":[]}
+{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_customSelect","_interopRequireDefault","_item","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectControlV2","props","defaultValue","onChange","value","restProps","store","useSelectStore","setValue","nextValue","jsx","Item","_default","exports"],"sources":["@wordpress/components/src/custom-select-control-v2/default-component/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n/**\n * Internal dependencies\n */\nimport _CustomSelect from '../custom-select';\nimport type { CustomSelectProps } from '../types';\nimport type { WordPressComponentProps } from '../../context';\nimport Item from '../item';\n\nfunction CustomSelectControlV2(\n\tprops: WordPressComponentProps< CustomSelectProps, 'button', false >\n) {\n\tconst { defaultValue, onChange, value, ...restProps } = props;\n\t// Forward props + store from v2 implementation\n\tconst store = Ariakit.useSelectStore( {\n\t\tsetValue: ( nextValue ) => onChange?.( nextValue ),\n\t\tdefaultValue,\n\t\tvalue,\n\t} );\n\n\treturn <_CustomSelect { ...restProps } store={ store } />;\n}\n\nCustomSelectControlV2.Item = Item;\n\nexport default CustomSelectControlV2;\n"],"mappings":";;;;;;;AAIA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAIA,IAAAC,aAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,KAAA,GAAAD,sBAAA,CAAAF,OAAA;AAA2B,IAAAI,WAAA,GAAAJ,OAAA;AAAA,SAAAK,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAP,wBAAAO,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAX3B;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAMA,SAASW,qBAAqBA,CAC7BC,KAAoE,EACnE;EACD,MAAM;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,KAAK;IAAE,GAAGC;EAAU,CAAC,GAAGJ,KAAK;EAC7D;EACA,MAAMK,KAAK,GAAGjC,OAAO,CAACkC,cAAc,CAAE;IACrCC,QAAQ,EAAIC,SAAS,IAAMN,QAAQ,GAAIM,SAAU,CAAC;IAClDP,YAAY;IACZE;EACD,CAAE,CAAC;EAEH,oBAAO,IAAAzB,WAAA,CAAA+B,GAAA,EAAClC,aAAA,CAAAU,OAAa;IAAA,GAAMmB,SAAS;IAAGC,KAAK,EAAGA;EAAO,CAAE,CAAC;AAC1D;AAEAN,qBAAqB,CAACW,IAAI,GAAGA,aAAI;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA3B,OAAA,GAEnBc,qBAAqB","ignoreList":[]}

package/build/custom-select-control-v2/item.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CustomSelectItem = CustomSelectItem;
 exports.default = void 0;
-var _react = require("react");
 var _element = require("@wordpress/element");
 var _icons = require("@wordpress/icons");
 var Styled = _interopRequireWildcard(require("./styles"));
 var _customSelect = require("./custom-select");
+var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -25,12 +25,15 @@ function CustomSelectItem({
   ...props
 }) {
   const customSelectContext = (0, _element.useContext)(_customSelect.CustomSelectContext);
-  return (0, _react.createElement)(Styled.SelectItem, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Styled.SelectItem, {
     store: customSelectContext?.store,
-    ...props
-  }, children !== null && children !== void 0 ? children : props.value, (0, _react.createElement)(Styled.SelectedItemCheck, null, (0, _react.createElement)(_icons.Icon, {
-    icon: _icons.check
-  })));
+    ...props,
+    children: [children !== null && children !== void 0 ? children : props.value, /*#__PURE__*/(0, _jsxRuntime.jsx)(Styled.SelectedItemCheck, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
+        icon: _icons.check
+      })
+    })]
+  });
 }
 CustomSelectItem.displayName = 'CustomSelectControlV2.Item';
 var _default = exports.default = CustomSelectItem;

package/build/custom-select-control-v2/item.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_icons","Styled","_interopRequireWildcard","_customSelect","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectItem","children","props","customSelectContext","useContext","CustomSelectContext","_react","createElement","SelectItem","store","value","SelectedItemCheck","Icon","icon","check","displayName","_default","exports"],"sources":["@wordpress/components/src/custom-select-control-v2/item.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport type { CustomSelectItemProps } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport * as Styled from './styles';\nimport { CustomSelectContext } from './custom-select';\n\nexport function CustomSelectItem( {\n\tchildren,\n\t...props\n}: WordPressComponentProps< CustomSelectItemProps, 'div', false > ) {\n\tconst customSelectContext = useContext( CustomSelectContext );\n\treturn (\n\t\t<Styled.SelectItem store={ customSelectContext?.store } { ...props }>\n\t\t\t{ children ?? props.value }\n\t\t\t<Styled.SelectedItemCheck>\n\t\t\t\t<Icon icon={ check } />\n\t\t\t</Styled.SelectedItemCheck>\n\t\t</Styled.SelectItem>\n\t);\n}\n\nCustomSelectItem.displayName = 'CustomSelectControlV2.Item';\n\nexport default CustomSelectItem;\n"],"mappings":";;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAMA,IAAAE,MAAA,GAAAC,uBAAA,CAAAH,OAAA;AACA,IAAAI,aAAA,GAAAJ,OAAA;AAAsD,SAAAK,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAXtD;AACA;AACA;;AAGA;AACA;AACA;;AAMO,SAASW,gBAAgBA,CAAE;EACjCC,QAAQ;EACR,GAAGC;AAC4D,CAAC,EAAG;EACnE,MAAMC,mBAAmB,GAAG,IAAAC,mBAAU,EAAEC,iCAAoB,CAAC;EAC7D,OACC,IAAAC,MAAA,CAAAC,aAAA,EAAC9B,MAAM,CAAC+B,UAAU;IAACC,KAAK,EAAGN,mBAAmB,EAAEM,KAAO;IAAA,GAAMP;EAAK,GAC/DD,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIC,KAAK,CAACQ,KAAK,EACzB,IAAAJ,MAAA,CAAAC,aAAA,EAAC9B,MAAM,CAACkC,iBAAiB,QACxB,IAAAL,MAAA,CAAAC,aAAA,EAAC/B,MAAA,CAAAoC,IAAI;IAACC,IAAI,EAAGC;EAAO,CAAE,CACG,CACR,CAAC;AAEtB;AAEAd,gBAAgB,CAACe,WAAW,GAAG,4BAA4B;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GAE7Cc,gBAAgB","ignoreList":[]}
+{"version":3,"names":["_element","require","_icons","Styled","_interopRequireWildcard","_customSelect","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectItem","children","props","customSelectContext","useContext","CustomSelectContext","jsxs","SelectItem","store","value","jsx","SelectedItemCheck","Icon","icon","check","displayName","_default","exports"],"sources":["@wordpress/components/src/custom-select-control-v2/item.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport type { CustomSelectItemProps } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport * as Styled from './styles';\nimport { CustomSelectContext } from './custom-select';\n\nexport function CustomSelectItem( {\n\tchildren,\n\t...props\n}: WordPressComponentProps< CustomSelectItemProps, 'div', false > ) {\n\tconst customSelectContext = useContext( CustomSelectContext );\n\treturn (\n\t\t<Styled.SelectItem store={ customSelectContext?.store } { ...props }>\n\t\t\t{ children ?? props.value }\n\t\t\t<Styled.SelectedItemCheck>\n\t\t\t\t<Icon icon={ check } />\n\t\t\t</Styled.SelectedItemCheck>\n\t\t</Styled.SelectItem>\n\t);\n}\n\nCustomSelectItem.displayName = 'CustomSelectControlV2.Item';\n\nexport default CustomSelectItem;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAMA,IAAAE,MAAA,GAAAC,uBAAA,CAAAH,OAAA;AACA,IAAAI,aAAA,GAAAJ,OAAA;AAAsD,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAM,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAJ,wBAAAI,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAXtD;AACA;AACA;;AAGA;AACA;AACA;;AAMO,SAASW,gBAAgBA,CAAE;EACjCC,QAAQ;EACR,GAAGC;AAC4D,CAAC,EAAG;EACnE,MAAMC,mBAAmB,GAAG,IAAAC,mBAAU,EAAEC,iCAAoB,CAAC;EAC7D,oBACC,IAAA1B,WAAA,CAAA2B,IAAA,EAAC9B,MAAM,CAAC+B,UAAU;IAACC,KAAK,EAAGL,mBAAmB,EAAEK,KAAO;IAAA,GAAMN,KAAK;IAAAD,QAAA,GAC/DA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIC,KAAK,CAACO,KAAK,eACzB,IAAA9B,WAAA,CAAA+B,GAAA,EAAClC,MAAM,CAACmC,iBAAiB;MAAAV,QAAA,eACxB,IAAAtB,WAAA,CAAA+B,GAAA,EAACnC,MAAA,CAAAqC,IAAI;QAACC,IAAI,EAAGC;MAAO,CAAE;IAAC,CACE,CAAC;EAAA,CACT,CAAC;AAEtB;AAEAd,gBAAgB,CAACe,WAAW,GAAG,4BAA4B;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GAE7Cc,gBAAgB","ignoreList":[]}

package/build/custom-select-control-v2/legacy-component/index.js

@@ -5,13 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("react");
 var Ariakit = _interopRequireWildcard(require("@ariakit/react"));
-var _element = require("@wordpress/element");
 var _customSelect = _interopRequireDefault(require("../custom-select"));
 var _item = _interopRequireDefault(require("../item"));
 var Styled = _interopRequireWildcard(require("../styles"));
-var _context = require("../../context");
+var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -19,10 +17,6 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  */
 // eslint-disable-next-line no-restricted-imports
 
-/**
- * WordPress dependencies
- */
-
 /**
  * Internal dependencies
  */
@@ -31,6 +25,7 @@ function CustomSelectControl(props) {
   const {
     __experimentalShowSelectedHint,
     __next40pxDefaultSize = false,
+    describedBy,
     options,
     onChange,
     size = 'default',
@@ -68,15 +63,19 @@ function CustomSelectControl(props) {
     __experimentalHint,
     ...rest
   }) => {
-    const withHint = (0, _react.createElement)(Styled.WithHintWrapper, null, (0, _react.createElement)("span", null, name), (0, _react.createElement)(Styled.ExperimentalHintItem, {
-      className: "components-custom-select-control__item-hint"
-    }, __experimentalHint));
-    return (0, _react.createElement)(_item.default, {
-      key: key,
+    const withHint = /*#__PURE__*/(0, _jsxRuntime.jsxs)(Styled.WithHintWrapper, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: name
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Styled.ExperimentalHintItem, {
+        className: "components-custom-select-control__item-hint",
+        children: __experimentalHint
+      })]
+    });
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_item.default, {
       value: name,
       children: __experimentalHint ? withHint : name,
       ...rest
-    });
+    }, key);
   });
   const renderSelectedValueHint = () => {
     const {
@@ -85,41 +84,30 @@ function CustomSelectControl(props) {
     const currentHint = options?.find(({
       name
     }) => currentValue === name);
-    return (0, _react.createElement)(_react.Fragment, null, currentValue, (0, _react.createElement)(Styled.SelectedExperimentalHintItem, {
-      className: "components-custom-select-control__hint"
-    }, currentHint?.__experimentalHint));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [currentValue, /*#__PURE__*/(0, _jsxRuntime.jsx)(Styled.SelectedExperimentalHintItem, {
+        className: "components-custom-select-control__hint",
+        children: currentHint?.__experimentalHint
+      })]
+    });
   };
-
-  // translate legacy button sizing
-  const contextSystemValue = (0, _element.useMemo)(() => {
-    let selectedSize;
+  const translatedSize = (() => {
     if (__next40pxDefaultSize && size === 'default' || size === '__unstable-large') {
-      selectedSize = 'default';
-    } else if (!__next40pxDefaultSize && size === 'default') {
-      selectedSize = 'compact';
-    } else {
-      selectedSize = size;
+      return 'default';
     }
-    return {
-      CustomSelectControlButton: {
-        _overrides: {
-          size: selectedSize
-        }
-      }
-    };
-  }, [__next40pxDefaultSize, size]);
-  const translatedProps = {
-    'aria-describedby': props.describedBy,
-    children,
+    if (!__next40pxDefaultSize && size === 'default') {
+      return 'compact';
+    }
+    return size;
+  })();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_customSelect.default, {
+    "aria-describedby": describedBy,
     renderSelectedValue: __experimentalShowSelectedHint ? renderSelectedValueHint : undefined,
-    ...restProps
-  };
-  return (0, _react.createElement)(_context.ContextSystemProvider, {
-    value: contextSystemValue
-  }, (0, _react.createElement)(_customSelect.default, {
-    ...translatedProps,
-    store: store
-  }));
+    size: translatedSize,
+    store: store,
+    ...restProps,
+    children: children
+  });
 }
 var _default = exports.default = CustomSelectControl;
 //# sourceMappingURL=index.js.map