@wordpress/components 23.2.0 → 23.3.0

package/CHANGELOG.md

@@ -2,10 +2,40 @@
 
 ## Unreleased
 
-## 23.2.0 (2023-01-11)
+## 23.3.0 (2023-02-01)
+
+### Deprecations
+
+-   `NumberControl`: Clarify deprecation message about `hideHTMLArrows` prop ([#47370](https://github.com/WordPress/gutenberg/pull/47370)).
+
+### Enhancements
+
+-   `Dropdown`: deprecate `position`  prop, use `popoverProps` instead ([46865](https://github.com/WordPress/gutenberg/pull/46865)).
+-   `Button`: improve padding for buttons with icon and text. ([46764](https://github.com/WordPress/gutenberg/pull/46764)).
+-   `ColorPalette`: Use computed color when css variable is passed to `ColorPicker` ([47181](https://github.com/WordPress/gutenberg/pull/47181)).
 
 ### Internal
 
+-   `Toolbar`: unify Storybook examples under one file, migrate from knobs to controls ([47117](https://github.com/WordPress/gutenberg/pull/47117)).
+-   `DropdownMenu`: migrate Storybook to controls ([47149](https://github.com/WordPress/gutenberg/pull/47149)).
+-   Removed deprecated `@storybook/addon-knobs` dependency from the package ([47152](https://github.com/WordPress/gutenberg/pull/47152)).
+-   `ColorListPicker`: Convert to TypeScript ([#46358](https://github.com/WordPress/gutenberg/pull/46358)).
+-   `KeyboardShortcuts`: Convert to TypeScript ([#47429](https://github.com/WordPress/gutenberg/pull/47429)).
+-   `ColorPalette`, `BorderControl`, `GradientPicker`: refine types and logic around single vs multiple palettes
+ ([#47384](https://github.com/WordPress/gutenberg/pull/47384)).
+-   `Button`: Convert to TypeScript ([#46997](https://github.com/WordPress/gutenberg/pull/46997)).
+-   `QueryControls`: Convert to TypeScript ([#46721](https://github.com/WordPress/gutenberg/pull/46721)).
+-   `Notice`: refactor to TypeScript ([47118](https://github.com/WordPress/gutenberg/pull/47118)).
+
+### Bug Fix
+
+-   `TabPanel`: Fix initial tab selection when the tab declaration is lazily added to the `tabs` array ([47100](https://github.com/WordPress/gutenberg/pull/47100)).
+-   `InputControl`: Avoid the "controlled to uncontrolled" warning by forcing the internal `<input />` element to be always in controlled mode ([47250](https://github.com/WordPress/gutenberg/pull/47250)).
+
+## 23.2.0 (2023-01-11)
+
+### Internal
+-   `AlignmentMatrixControl`: Update center cell label to 'Center' instead of 'Center Center' ([#46852](https://github.com/WordPress/gutenberg/pull/46852)).
 -   `Toolbar`: move all subcomponents under the same folder ([46951](https://github.com/WordPress/gutenberg/pull/46951)).
 -   `Dashicon`: remove unnecessary type for `className` prop ([46849](https://github.com/WordPress/gutenberg/pull/46849)).
 -   `ColorPicker` & `QueryControls`: Replace bottom margin overrides with `__nextHasNoMarginBottom` ([#46448](https://github.com/WordPress/gutenberg/pull/46448)).
@@ -20,6 +50,10 @@
 
 ## 23.1.0 (2023-01-02)
 
+### Breaking Changes
+
+-   `ColorPalette`: The experimental `__experimentalHasMultipleOrigins` prop has been removed ([#46315](https://github.com/WordPress/gutenberg/pull/46315)).
+
 ## 23.0.0 (2022-12-14)
 
 ### Breaking Changes

package/CONTRIBUTING.md

@@ -361,7 +361,7 @@ Primary.args = {
 };
 ```
 
-A great tool to use when writing stories is the [Storybook Controls addon](https://storybook.js.org/addons/@storybook/addon-controls). Ideally props should be exposed by using this addon, which provides a graphical UI to interact dynamically with the component without needing to write code. Avoid using [Knobs](https://storybook.js.org/addons/@storybook/addon-knobs) for new stories, as this addon is deprecated.
+A great tool to use when writing stories is the [Storybook Controls addon](https://storybook.js.org/addons/@storybook/addon-controls). Ideally props should be exposed by using this addon, which provides a graphical UI to interact dynamically with the component without needing to write code. Historically, we used [Knobs](https://storybook.js.org/addons/@storybook/addon-knobs), but it was deprecated and later removed in [#47152](https://github.com/WordPress/gutenberg/pull/47152).
 
 The default value of each control should coincide with the default value of the props (i.e. it should be `undefined` if a prop is not required). A story should, therefore, also explicitly show how values from the Context System are applied to (sub)components. A good example of how this may look like is the [`Card` story](https://wordpress.github.io/gutenberg/?path=/story/components-card--default) (code [here](/packages/components/src/card/stories/index.tsx)).
 

package/build/alignment-matrix-control/utils.js

@@ -21,8 +21,8 @@ const ALIGNMENT_LABEL = {
   'top center': (0, _i18n.__)('Top Center'),
   'top right': (0, _i18n.__)('Top Right'),
   'center left': (0, _i18n.__)('Center Left'),
-  'center center': (0, _i18n.__)('Center Center'),
-  center: (0, _i18n.__)('Center Center'),
+  'center center': (0, _i18n.__)('Center'),
+  center: (0, _i18n.__)('Center'),
   'center right': (0, _i18n.__)('Center Right'),
   'bottom left': (0, _i18n.__)('Bottom Left'),
   'bottom center': (0, _i18n.__)('Bottom Center'),

package/build/alignment-matrix-control/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/utils.tsx"],"names":["GRID","ALIGNMENT_LABEL","center","ALIGNMENTS","flat","transformValue","value","nextValue","replace","getItemId","prefixId","valueId","getAlignmentIndex","alignment","item","index","indexOf","undefined"],"mappings":";;;;;;;;;;AAGA;;AAHA;AACA;AACA;AAOO,MAAMA,IAAqC,GAAG,CACpD,CAAE,UAAF,EAAc,YAAd,EAA4B,WAA5B,CADoD,EAEpD,CAAE,aAAF,EAAiB,eAAjB,EAAkC,cAAlC,CAFoD,EAGpD,CAAE,aAAF,EAAiB,eAAjB,EAAkC,cAAlC,CAHoD,CAA9C,C,CAMP;;;AACO,MAAMC,eAA8D,GAAG;AAC7E,cAAY,cAAI,UAAJ,CADiE;AAE7E,gBAAc,cAAI,YAAJ,CAF+D;AAG7E,eAAa,cAAI,WAAJ,CAHgE;AAI7E,iBAAe,cAAI,aAAJ,CAJ8D;AAK7E,mBAAiB,cAAI,eAAJ,CAL4D;AAM7EC,EAAAA,MAAM,EAAE,cAAI,eAAJ,CANqE;AAO7E,kBAAgB,cAAI,cAAJ,CAP6D;AAQ7E,iBAAe,cAAI,aAAJ,CAR8D;AAS7E,mBAAiB,cAAI,eAAJ,CAT4D;AAU7E,kBAAgB,cAAI,cAAJ;AAV6D,CAAvE,C,CAaP;;;AACO,MAAMC,UAAU,GAAGH,IAAI,CAACI,IAAL,EAAnB;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;;;AACO,SAASC,cAAT,CAAyBC,KAAzB,EAA8D;AACpE,QAAMC,SAAS,GAAGD,KAAK,KAAK,QAAV,GAAqB,eAArB,GAAuCA,KAAzD;AAEA,SAAOC,SAAS,CAACC,OAAV,CAAmB,GAAnB,EAAwB,GAAxB,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,SAAT,CACNC,QADM,EAENJ,KAFM,EAGL;AACD,QAAMK,OAAO,GAAGN,cAAc,CAAEC,KAAF,CAAd,CAAwBE,OAAxB,CAAiC,GAAjC,EAAsC,GAAtC,CAAhB;AAEA,SAAQ,GAAGE,QAAU,IAAIC,OAAS,EAAlC;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,iBAAT,GAEL;AAAA,MADDC,SACC,uEADwC,QACxC;AACD,QAAMC,IAAI,GAAGT,cAAc,CAAEQ,SAAF,CAA3B;AACA,QAAME,KAAK,GAAGZ,UAAU,CAACa,OAAX,CAAoBF,IAApB,CAAd;AAEA,SAAOC,KAAK,GAAG,CAAC,CAAT,GAAaA,KAAb,GAAqBE,SAA5B;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n/**\n * Internal dependencies\n */\nimport type { AlignmentMatrixControlValue } from './types';\n\nexport const GRID: AlignmentMatrixControlValue[][] = [\n\t[ 'top left', 'top center', 'top right' ],\n\t[ 'center left', 'center center', 'center right' ],\n\t[ 'bottom left', 'bottom center', 'bottom right' ],\n];\n\n// Stored as map as i18n __() only accepts strings (not variables)\nexport const ALIGNMENT_LABEL: Record< AlignmentMatrixControlValue, string > = {\n\t'top left': __( 'Top Left' ),\n\t'top center': __( 'Top Center' ),\n\t'top right': __( 'Top Right' ),\n\t'center left': __( 'Center Left' ),\n\t'center center': __( 'Center Center' ),\n\tcenter: __( 'Center Center' ),\n\t'center right': __( 'Center Right' ),\n\t'bottom left': __( 'Bottom Left' ),\n\t'bottom center': __( 'Bottom Center' ),\n\t'bottom right': __( 'Bottom Right' ),\n};\n\n// Transforms GRID into a flat Array of values.\nexport const ALIGNMENTS = GRID.flat();\n\n/**\n * Parses and transforms an incoming value to better match the alignment values\n *\n * @param  value An alignment value to parse.\n *\n * @return The parsed value.\n */\nexport function transformValue( value: AlignmentMatrixControlValue ) {\n\tconst nextValue = value === 'center' ? 'center center' : value;\n\n\treturn nextValue.replace( '-', ' ' ) as AlignmentMatrixControlValue;\n}\n\n/**\n * Creates an item ID based on a prefix ID and an alignment value.\n *\n * @param  prefixId An ID to prefix.\n * @param  value    An alignment value.\n *\n * @return The item id.\n */\nexport function getItemId(\n\tprefixId: string,\n\tvalue: AlignmentMatrixControlValue\n) {\n\tconst valueId = transformValue( value ).replace( ' ', '-' );\n\n\treturn `${ prefixId }-${ valueId }`;\n}\n\n/**\n * Retrieves the alignment index from a value.\n *\n * @param  alignment Value to check.\n *\n * @return The index of a matching alignment.\n */\nexport function getAlignmentIndex(\n\talignment: AlignmentMatrixControlValue = 'center'\n) {\n\tconst item = transformValue( alignment );\n\tconst index = ALIGNMENTS.indexOf( item );\n\n\treturn index > -1 ? index : undefined;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/utils.tsx"],"names":["GRID","ALIGNMENT_LABEL","center","ALIGNMENTS","flat","transformValue","value","nextValue","replace","getItemId","prefixId","valueId","getAlignmentIndex","alignment","item","index","indexOf","undefined"],"mappings":";;;;;;;;;;AAGA;;AAHA;AACA;AACA;AAOO,MAAMA,IAAqC,GAAG,CACpD,CAAE,UAAF,EAAc,YAAd,EAA4B,WAA5B,CADoD,EAEpD,CAAE,aAAF,EAAiB,eAAjB,EAAkC,cAAlC,CAFoD,EAGpD,CAAE,aAAF,EAAiB,eAAjB,EAAkC,cAAlC,CAHoD,CAA9C,C,CAMP;;;AACO,MAAMC,eAA8D,GAAG;AAC7E,cAAY,cAAI,UAAJ,CADiE;AAE7E,gBAAc,cAAI,YAAJ,CAF+D;AAG7E,eAAa,cAAI,WAAJ,CAHgE;AAI7E,iBAAe,cAAI,aAAJ,CAJ8D;AAK7E,mBAAiB,cAAI,QAAJ,CAL4D;AAM7EC,EAAAA,MAAM,EAAE,cAAI,QAAJ,CANqE;AAO7E,kBAAgB,cAAI,cAAJ,CAP6D;AAQ7E,iBAAe,cAAI,aAAJ,CAR8D;AAS7E,mBAAiB,cAAI,eAAJ,CAT4D;AAU7E,kBAAgB,cAAI,cAAJ;AAV6D,CAAvE,C,CAaP;;;AACO,MAAMC,UAAU,GAAGH,IAAI,CAACI,IAAL,EAAnB;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;;;AACO,SAASC,cAAT,CAAyBC,KAAzB,EAA8D;AACpE,QAAMC,SAAS,GAAGD,KAAK,KAAK,QAAV,GAAqB,eAArB,GAAuCA,KAAzD;AAEA,SAAOC,SAAS,CAACC,OAAV,CAAmB,GAAnB,EAAwB,GAAxB,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,SAAT,CACNC,QADM,EAENJ,KAFM,EAGL;AACD,QAAMK,OAAO,GAAGN,cAAc,CAAEC,KAAF,CAAd,CAAwBE,OAAxB,CAAiC,GAAjC,EAAsC,GAAtC,CAAhB;AAEA,SAAQ,GAAGE,QAAU,IAAIC,OAAS,EAAlC;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,iBAAT,GAEL;AAAA,MADDC,SACC,uEADwC,QACxC;AACD,QAAMC,IAAI,GAAGT,cAAc,CAAEQ,SAAF,CAA3B;AACA,QAAME,KAAK,GAAGZ,UAAU,CAACa,OAAX,CAAoBF,IAApB,CAAd;AAEA,SAAOC,KAAK,GAAG,CAAC,CAAT,GAAaA,KAAb,GAAqBE,SAA5B;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n/**\n * Internal dependencies\n */\nimport type { AlignmentMatrixControlValue } from './types';\n\nexport const GRID: AlignmentMatrixControlValue[][] = [\n\t[ 'top left', 'top center', 'top right' ],\n\t[ 'center left', 'center center', 'center right' ],\n\t[ 'bottom left', 'bottom center', 'bottom right' ],\n];\n\n// Stored as map as i18n __() only accepts strings (not variables)\nexport const ALIGNMENT_LABEL: Record< AlignmentMatrixControlValue, string > = {\n\t'top left': __( 'Top Left' ),\n\t'top center': __( 'Top Center' ),\n\t'top right': __( 'Top Right' ),\n\t'center left': __( 'Center Left' ),\n\t'center center': __( 'Center' ),\n\tcenter: __( 'Center' ),\n\t'center right': __( 'Center Right' ),\n\t'bottom left': __( 'Bottom Left' ),\n\t'bottom center': __( 'Bottom Center' ),\n\t'bottom right': __( 'Bottom Right' ),\n};\n\n// Transforms GRID into a flat Array of values.\nexport const ALIGNMENTS = GRID.flat();\n\n/**\n * Parses and transforms an incoming value to better match the alignment values\n *\n * @param  value An alignment value to parse.\n *\n * @return The parsed value.\n */\nexport function transformValue( value: AlignmentMatrixControlValue ) {\n\tconst nextValue = value === 'center' ? 'center center' : value;\n\n\treturn nextValue.replace( '-', ' ' ) as AlignmentMatrixControlValue;\n}\n\n/**\n * Creates an item ID based on a prefix ID and an alignment value.\n *\n * @param  prefixId An ID to prefix.\n * @param  value    An alignment value.\n *\n * @return The item id.\n */\nexport function getItemId(\n\tprefixId: string,\n\tvalue: AlignmentMatrixControlValue\n) {\n\tconst valueId = transformValue( value ).replace( ' ', '-' );\n\n\treturn `${ prefixId }-${ valueId }`;\n}\n\n/**\n * Retrieves the alignment index from a value.\n *\n * @param  alignment Value to check.\n *\n * @return The index of a matching alignment.\n */\nexport function getAlignmentIndex(\n\talignment: AlignmentMatrixControlValue = 'center'\n) {\n\tconst item = transformValue( alignment );\n\tconst index = ALIGNMENTS.indexOf( item );\n\n\treturn index > -1 ? index : undefined;\n}\n"]}

package/build/autocomplete/autocompleter-ui.js

@@ -11,8 +11,6 @@ var _element = require("@wordpress/element");
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _lodash = require("lodash");
-
 var _richText = require("@wordpress/rich-text");
 
 var _getDefaultUseItems = _interopRequireDefault(require("./get-default-use-items"));
@@ -77,7 +75,7 @@ function getAutoCompleterUI(autocompleter) {
       id: listBoxId,
       role: "listbox",
       className: "components-autocomplete__results"
-    }, (0, _lodash.map)(items, (option, index) => (0, _element.createElement)(_button.default, {
+    }, items.map((option, index) => (0, _element.createElement)(_button.default, {
       key: option.key,
       id: `components-autocomplete-item-${instanceId}-${option.key}`,
       role: "option",

package/build/autocomplete/autocompleter-ui.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.js"],"names":["getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","instanceId","listBoxId","className","selectedIndex","onChangeOptions","onSelect","onReset","reset","value","contentRef","items","popoverAnchor","editableContentElement","current","popoverRef","useOnClickOutside","length","option","index","key","isDisabled","label","ref","handler","listener","event","contains","target","document","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { map } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useLayoutEffect, useRef, useEffect } from '@wordpress/element';\nimport { useAnchor } from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport getDefaultUseItems from './get-default-use-items';\nimport Button from '../button';\nimport Popover from '../popover';\n\nexport function getAutoCompleterUI( autocompleter ) {\n\tconst useItems = autocompleter.useItems\n\t\t? autocompleter.useItems\n\t\t: getDefaultUseItems( autocompleter );\n\n\tfunction AutocompleterUI( {\n\t\tfilterValue,\n\t\tinstanceId,\n\t\tlistBoxId,\n\t\tclassName,\n\t\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tonReset,\n\t\treset,\n\t\tvalue,\n\t\tcontentRef,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst popoverAnchor = useAnchor( {\n\t\t\teditableContentElement: contentRef.current,\n\t\t\tvalue,\n\t\t} );\n\n\t\tconst popoverRef = useRef();\n\n\t\tuseOnClickOutside( popoverRef, reset );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t}, [ items ] );\n\n\t\tif ( ! items.length > 0 ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tonClose={ onReset }\n\t\t\t\tplacement=\"top-start\"\n\t\t\t\tclassName=\"components-autocomplete__popover\"\n\t\t\t\tanchor={ popoverAnchor }\n\t\t\t\tref={ popoverRef }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tid={ listBoxId }\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tclassName=\"components-autocomplete__results\"\n\t\t\t\t>\n\t\t\t\t\t{ map( items, ( option, index ) => (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\t\tid={ `components-autocomplete-item-${ instanceId }-${ option.key }` }\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t\t\tdisabled={ option.isDisabled }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'components-autocomplete__result',\n\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => onSelect( option ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) ) }\n\t\t\t\t</div>\n\t\t\t</Popover>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nfunction useOnClickOutside( ref, handler ) {\n\tuseEffect( () => {\n\t\tconst listener = ( event ) => {\n\t\t\t// Do nothing if clicking ref's element or descendent elements, or if the ref is not referencing an element\n\t\t\tif ( ! ref.current || ref.current.contains( event.target ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\thandler( event );\n\t\t};\n\t\tdocument.addEventListener( 'mousedown', listener );\n\t\tdocument.addEventListener( 'touchstart', listener );\n\t\treturn () => {\n\t\t\tdocument.removeEventListener( 'mousedown', listener );\n\t\t\tdocument.removeEventListener( 'touchstart', listener );\n\t\t};\n\t\t// Disable reason: `ref` is a ref object and should not be included in a\n\t\t// hook's dependency list.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ handler ] );\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.js"],"names":["getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","instanceId","listBoxId","className","selectedIndex","onChangeOptions","onSelect","onReset","reset","value","contentRef","items","popoverAnchor","editableContentElement","current","popoverRef","useOnClickOutside","length","map","option","index","key","isDisabled","label","ref","handler","listener","event","contains","target","document","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useLayoutEffect, useRef, useEffect } from '@wordpress/element';\nimport { useAnchor } from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport getDefaultUseItems from './get-default-use-items';\nimport Button from '../button';\nimport Popover from '../popover';\n\nexport function getAutoCompleterUI( autocompleter ) {\n\tconst useItems = autocompleter.useItems\n\t\t? autocompleter.useItems\n\t\t: getDefaultUseItems( autocompleter );\n\n\tfunction AutocompleterUI( {\n\t\tfilterValue,\n\t\tinstanceId,\n\t\tlistBoxId,\n\t\tclassName,\n\t\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tonReset,\n\t\treset,\n\t\tvalue,\n\t\tcontentRef,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst popoverAnchor = useAnchor( {\n\t\t\teditableContentElement: contentRef.current,\n\t\t\tvalue,\n\t\t} );\n\n\t\tconst popoverRef = useRef();\n\n\t\tuseOnClickOutside( popoverRef, reset );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t}, [ items ] );\n\n\t\tif ( ! items.length > 0 ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tonClose={ onReset }\n\t\t\t\tplacement=\"top-start\"\n\t\t\t\tclassName=\"components-autocomplete__popover\"\n\t\t\t\tanchor={ popoverAnchor }\n\t\t\t\tref={ popoverRef }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tid={ listBoxId }\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tclassName=\"components-autocomplete__results\"\n\t\t\t\t>\n\t\t\t\t\t{ items.map( ( option, index ) => (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\t\tid={ `components-autocomplete-item-${ instanceId }-${ option.key }` }\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t\t\tdisabled={ option.isDisabled }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'components-autocomplete__result',\n\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => onSelect( option ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) ) }\n\t\t\t\t</div>\n\t\t\t</Popover>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nfunction useOnClickOutside( ref, handler ) {\n\tuseEffect( () => {\n\t\tconst listener = ( event ) => {\n\t\t\t// Do nothing if clicking ref's element or descendent elements, or if the ref is not referencing an element\n\t\t\tif ( ! ref.current || ref.current.contains( event.target ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\thandler( event );\n\t\t};\n\t\tdocument.addEventListener( 'mousedown', listener );\n\t\tdocument.addEventListener( 'touchstart', listener );\n\t\treturn () => {\n\t\t\tdocument.removeEventListener( 'mousedown', listener );\n\t\t\tdocument.removeEventListener( 'touchstart', listener );\n\t\t};\n\t\t// Disable reason: `ref` is a ref object and should not be included in a\n\t\t// hook's dependency list.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ handler ] );\n}\n"]}

package/build/border-box-control/border-box-control-linked-button/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/component.tsx"],"names":["BorderBoxControlLinkedButton","props","forwardedRef","className","isLinked","buttonProps","label","link","linkOff","ConnectedBorderBoxControlLinkedButton"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAbA;AACA;AACA;;AAIA;AACA;AACA;AASA,MAAMA,4BAA4B,GAAG,CACpCC,KADoC,EAEpCC,YAFoC,KAGhC;AACJ,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,QAAb;AAAuB,OAAGC;AAA1B,MACL,2CAAiCJ,KAAjC,CADD;AAEA,QAAMK,KAAK,GAAGF,QAAQ,GAAG,cAAI,cAAJ,CAAH,GAA0B,cAAI,YAAJ,CAAhD;AAEA,SACC,4BAAC,gBAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC,4BAAC,UAAD;AAAM,IAAA,SAAS,EAAGH;AAAlB,KACC,4BAAC,eAAD,6BACME,WADN;AAEC,IAAA,OAAO,MAFR;AAGC,IAAA,IAAI,EAAGD,QAAQ,GAAGG,WAAH,GAAUC,cAH1B;AAIC,IAAA,QAAQ,EAAG,EAJZ;AAKC,kBAAaF,KALd;AAMC,IAAA,GAAG,EAAGJ;AANP,KADD,CADD,CADD;AAcA,CAtBD;;AAwBA,MAAMO,qCAAqC,GAAG,6BAC7CT,4BAD6C,EAE7C,8BAF6C,CAA9C;eAIeS,qC","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport Tooltip from '../../tooltip';\nimport { View } from '../../view';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderBoxControlLinkedButton } from './hook';\n\nimport type { LinkedButtonProps } from '../types';\n\nconst BorderBoxControlLinkedButton = (\n\tprops: WordPressComponentProps< LinkedButtonProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { className, isLinked, ...buttonProps } =\n\t\tuseBorderBoxControlLinkedButton( props );\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<View className={ className }>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t\tisSmall\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</Tooltip>\n\t);\n};\n\nconst ConnectedBorderBoxControlLinkedButton = contextConnect(\n\tBorderBoxControlLinkedButton,\n\t'BorderBoxControlLinkedButton'\n);\nexport default ConnectedBorderBoxControlLinkedButton;\n"]}
+{"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/component.tsx"],"names":["BorderBoxControlLinkedButton","props","forwardedRef","className","isLinked","buttonProps","label","link","linkOff","ConnectedBorderBoxControlLinkedButton"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAbA;AACA;AACA;;AAIA;AACA;AACA;AASA,MAAMA,4BAA4B,GAAG,CACpCC,KADoC,EAEpCC,YAFoC,KAGhC;AACJ,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,QAAb;AAAuB,OAAGC;AAA1B,MACL,2CAAiCJ,KAAjC,CADD;AAEA,QAAMK,KAAK,GAAGF,QAAQ,GAAG,cAAI,cAAJ,CAAH,GAA0B,cAAI,YAAJ,CAAhD;AAEA,SACC,4BAAC,gBAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC,4BAAC,UAAD;AAAM,IAAA,SAAS,EAAGH;AAAlB,KACC,4BAAC,eAAD,6BACME,WADN;AAEC,IAAA,OAAO,MAFR;AAGC,IAAA,IAAI,EAAGD,QAAQ,GAAGG,WAAH,GAAUC,cAH1B;AAIC,IAAA,QAAQ,EAAG,EAJZ;AAKC,kBAAaF,KALd;AAMC,IAAA,GAAG,EAAGJ;AANP,KADD,CADD,CADD;AAcA,CAtBD;;AAwBA,MAAMO,qCAAqC,GAAG,6BAC7CT,4BAD6C,EAE7C,8BAF6C,CAA9C;eAIeS,qC","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport Tooltip from '../../tooltip';\nimport { View } from '../../view';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderBoxControlLinkedButton } from './hook';\n\nimport type { LinkedButtonProps } from '../types';\n\nconst BorderBoxControlLinkedButton = (\n\tprops: WordPressComponentProps< LinkedButtonProps, 'button' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { className, isLinked, ...buttonProps } =\n\t\tuseBorderBoxControlLinkedButton( props );\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<View className={ className }>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t\tisSmall\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</Tooltip>\n\t);\n};\n\nconst ConnectedBorderBoxControlLinkedButton = contextConnect(\n\tBorderBoxControlLinkedButton,\n\t'BorderBoxControlLinkedButton'\n);\nexport default ConnectedBorderBoxControlLinkedButton;\n"]}

package/build/border-box-control/border-box-control-linked-button/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/hook.ts"],"names":["useBorderBoxControlLinkedButton","props","className","size","otherProps","cx","classes","styles","borderBoxControlLinkedButton"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAOO,SAASA,+BAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,IAAI,GAAG,SAFF;AAGL,OAAGC;AAHE,MAIF,+BAAkBH,KAAlB,EAAyB,8BAAzB,CAJJ,CADC,CAOD;;AACA,QAAMI,EAAE,GAAG,mBAAX;AACA,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAOD,EAAE,CAAEE,MAAM,CAACC,4BAAP,CAAqCL,IAArC,CAAF,EAA+CD,SAA/C,CAAT;AACA,GAFe,EAEb,CAAEA,SAAF,EAAaG,EAAb,EAAiBF,IAAjB,CAFa,CAAhB;AAIA,SAAO,EAAE,GAAGC,UAAL;AAAiBF,IAAAA,SAAS,EAAEI;AAA5B,GAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nimport type { LinkedButtonProps } from '../types';\n\nexport function useBorderBoxControlLinkedButton(\n\tprops: WordPressComponentProps< LinkedButtonProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tsize = 'default',\n\t\t...otherProps\n\t} = useContextSystem( props, 'BorderBoxControlLinkedButton' );\n\n\t// Generate class names.\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.borderBoxControlLinkedButton( size ), className );\n\t}, [ className, cx, size ] );\n\n\treturn { ...otherProps, className: classes };\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/hook.ts"],"names":["useBorderBoxControlLinkedButton","props","className","size","otherProps","cx","classes","styles","borderBoxControlLinkedButton"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAOO,SAASA,+BAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,IAAI,GAAG,SAFF;AAGL,OAAGC;AAHE,MAIF,+BAAkBH,KAAlB,EAAyB,8BAAzB,CAJJ,CADC,CAOD;;AACA,QAAMI,EAAE,GAAG,mBAAX;AACA,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAOD,EAAE,CAAEE,MAAM,CAACC,4BAAP,CAAqCL,IAArC,CAAF,EAA+CD,SAA/C,CAAT;AACA,GAFe,EAEb,CAAEA,SAAF,EAAaG,EAAb,EAAiBF,IAAjB,CAFa,CAAhB;AAIA,SAAO,EAAE,GAAGC,UAAL;AAAiBF,IAAAA,SAAS,EAAEI;AAA5B,GAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nimport type { LinkedButtonProps } from '../types';\n\nexport function useBorderBoxControlLinkedButton(\n\tprops: WordPressComponentProps< LinkedButtonProps, 'button' >\n) {\n\tconst {\n\t\tclassName,\n\t\tsize = 'default',\n\t\t...otherProps\n\t} = useContextSystem( props, 'BorderBoxControlLinkedButton' );\n\n\t// Generate class names.\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.borderBoxControlLinkedButton( size ), className );\n\t}, [ className, cx, size ] );\n\n\treturn { ...otherProps, className: classes };\n}\n"]}

package/build/border-control/border-control-dropdown/component.js

@@ -37,6 +37,8 @@ var _baseControlStyles = require("../../base-control/styles/base-control-styles"
 
 var _dropdownContentWrapper = _interopRequireDefault(require("../../dropdown/dropdown-content-wrapper"));
 
+var _utils = require("../../color-palette/utils");
+
 /**
  * External dependencies
  */
@@ -49,11 +51,12 @@ var _dropdownContentWrapper = _interopRequireDefault(require("../../dropdown/dro
  * Internal dependencies
  */
 const getColorObject = (colorValue, colors) => {
-  if (!colorValue || !colors || colors.length === 0) {
+  if (!colorValue || !colors) {
     return;
   }
 
-  if (colors[0].colors !== undefined) {
+  if ((0, _utils.isMultiplePaletteArray)(colors)) {
+    // Multiple origins
     let matchedColor;
     colors.some(origin => origin.colors.some(color => {
       if (color.color === colorValue) {
@@ -64,7 +67,8 @@ const getColorObject = (colorValue, colors) => {
       return false;
     }));
     return matchedColor;
-  }
+  } // Single origin
+
 
   return colors.find(color => color.color === colorValue);
 };
@@ -136,7 +140,7 @@ const BorderControlDropdown = (props, forwardedRef) => {
       onClick: onToggle,
       variant: "tertiary",
       "aria-label": toggleAriaLabel,
-      position: dropdownPosition,
+      tooltipPosition: dropdownPosition,
       label: (0, _i18n.__)('Border color and style picker'),
       showTooltip: true
     }, (0, _element.createElement)("span", {

package/build/border-control/border-control-dropdown/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"names":["getColorObject","colorValue","colors","length","undefined","matchedColor","some","origin","color","find","getToggleAriaLabel","colorObject","style","isStyleEnabled","name","BorderControlDropdown","props","forwardedRef","__experimentalIsRenderedInSidebar","border","disableCustomColors","enableAlpha","enableStyle","indicatorClassName","indicatorWrapperClassName","onReset","onColorChange","onStyleChange","popoverContentClassName","popoverControlsClassName","resetButtonClassName","showDropdownHeader","__unstablePopoverProps","otherProps","toggleAriaLabel","showResetButton","dropdownPosition","renderToggle","onToggle","renderContent","onClose","closeSmall","ConnectedBorderControlDropdown"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { HStack } from '../../h-stack';\nimport { VStack } from '../../v-stack';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderControlDropdown } from './hook';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nimport type { ColorObject, PaletteObject } from '../../color-palette/types';\nimport type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';\nimport type { ColorProps, DropdownProps } from '../types';\n\nconst getColorObject = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolors: ColorProps[ 'colors' ] | undefined\n) => {\n\tif ( ! colorValue || ! colors || colors.length === 0 ) {\n\t\treturn;\n\t}\n\n\tif ( ( colors as PaletteObject[] )[ 0 ].colors !== undefined ) {\n\t\tlet matchedColor;\n\n\t\t( colors as PaletteObject[] ).some( ( origin ) =>\n\t\t\torigin.colors.some( ( color ) => {\n\t\t\t\tif ( color.color === colorValue ) {\n\t\t\t\t\tmatchedColor = color;\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\treturn false;\n\t\t\t} )\n\t\t);\n\n\t\treturn matchedColor;\n\t}\n\n\treturn ( colors as ColorObject[] ).find(\n\t\t( color ) => color.color === colorValue\n\t);\n};\n\nconst getToggleAriaLabel = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolorObject: ColorObject | undefined,\n\tstyle: CSSProperties[ 'borderStyle' ],\n\tisStyleEnabled: boolean\n) => {\n\tif ( isStyleEnabled ) {\n\t\tif ( colorObject ) {\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tcolorObject.color,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tcolorObject.color\n\t\t\t\t  );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tcolorValue\n\t\t\t\t  );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tcolorObject.color\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tcolorValue\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tshowDropdownHeader,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\tposition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip={ true }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t{ showDropdownHeader ? (\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<StyledLabel>{ __( 'Border color' ) }</StyledLabel>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\tlabel={ __( 'Close border color' ) }\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t) : undefined }\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset to default' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"]}
+{"version":3,"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"names":["getColorObject","colorValue","colors","matchedColor","some","origin","color","find","getToggleAriaLabel","colorObject","style","isStyleEnabled","name","BorderControlDropdown","props","forwardedRef","__experimentalIsRenderedInSidebar","border","disableCustomColors","enableAlpha","enableStyle","indicatorClassName","indicatorWrapperClassName","onReset","onColorChange","onStyleChange","popoverContentClassName","popoverControlsClassName","resetButtonClassName","showDropdownHeader","__unstablePopoverProps","otherProps","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","renderContent","onClose","closeSmall","ConnectedBorderControlDropdown"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { HStack } from '../../h-stack';\nimport { VStack } from '../../v-stack';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderControlDropdown } from './hook';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nimport type { ColorObject } from '../../color-palette/types';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';\nimport type { ColorProps, DropdownProps } from '../types';\n\nconst getColorObject = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolors: ColorProps[ 'colors' ] | undefined\n) => {\n\tif ( ! colorValue || ! colors ) {\n\t\treturn;\n\t}\n\n\tif ( isMultiplePaletteArray( colors ) ) {\n\t\t// Multiple origins\n\t\tlet matchedColor;\n\n\t\tcolors.some( ( origin ) =>\n\t\t\torigin.colors.some( ( color ) => {\n\t\t\t\tif ( color.color === colorValue ) {\n\t\t\t\t\tmatchedColor = color;\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\treturn false;\n\t\t\t} )\n\t\t);\n\n\t\treturn matchedColor;\n\t}\n\n\t// Single origin\n\treturn colors.find( ( color ) => color.color === colorValue );\n};\n\nconst getToggleAriaLabel = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolorObject: ColorObject | undefined,\n\tstyle: CSSProperties[ 'borderStyle' ],\n\tisStyleEnabled: boolean\n) => {\n\tif ( isStyleEnabled ) {\n\t\tif ( colorObject ) {\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tcolorObject.color,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tcolorObject.color\n\t\t\t\t  );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tcolorValue\n\t\t\t\t  );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tcolorObject.color\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tcolorValue\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tshowDropdownHeader,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip={ true }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t{ showDropdownHeader ? (\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<StyledLabel>{ __( 'Border color' ) }</StyledLabel>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\tlabel={ __( 'Close border color' ) }\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t) : undefined }\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset to default' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"]}

package/build/button/deprecated.js

@@ -13,9 +13,11 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _deprecated = _interopRequireDefault(require("@wordpress/deprecated"));
 
-var _button = _interopRequireDefault(require("../button"));
+var _ = _interopRequireDefault(require("."));
 
-// @ts-nocheck
+/**
+ * External dependencies
+ */
 
 /**
  * WordPress dependencies
@@ -24,12 +26,12 @@ var _button = _interopRequireDefault(require("../button"));
 /**
  * Internal dependencies
  */
-function IconButton(_ref, ref) {
+function UnforwardedIconButton(_ref, ref) {
   let {
+    label,
     labelPosition,
     size,
     tooltip,
-    label,
     ...props
   } = _ref;
   (0, _deprecated.default)('wp.components.IconButton', {
@@ -37,7 +39,7 @@ function IconButton(_ref, ref) {
     alternative: 'wp.components.Button',
     version: '6.2'
   });
-  return (0, _element.createElement)(_button.default, (0, _extends2.default)({}, props, {
+  return (0, _element.createElement)(_.default, (0, _extends2.default)({}, props, {
     ref: ref,
     tooltipPosition: labelPosition,
     iconSize: size,
@@ -46,7 +48,7 @@ function IconButton(_ref, ref) {
   }));
 }
 
-var _default = (0, _element.forwardRef)(IconButton);
+var _default = (0, _element.forwardRef)(UnforwardedIconButton);
 
 exports.default = _default;
 //# sourceMappingURL=deprecated.js.map

package/build/button/deprecated.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/button/deprecated.js"],"names":["IconButton","ref","labelPosition","size","tooltip","label","props","since","alternative","version","undefined"],"mappings":";;;;;;;;;AAKA;;;;AADA;;AAMA;;AAVA;;AACA;AACA;AACA;;AAIA;AACA;AACA;AAGA,SAASA,UAAT,OAAwEC,GAAxE,EAA8E;AAAA,MAAzD;AAAEC,IAAAA,aAAF;AAAiBC,IAAAA,IAAjB;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA,KAAhC;AAAuC,OAAGC;AAA1C,GAAyD;AAC7E,2BAAY,0BAAZ,EAAwC;AACvCC,IAAAA,KAAK,EAAE,KADgC;AAEvCC,IAAAA,WAAW,EAAE,sBAF0B;AAGvCC,IAAAA,OAAO,EAAE;AAH8B,GAAxC;AAMA,SACC,4BAAC,eAAD,6BACMH,KADN;AAEC,IAAA,GAAG,EAAGL,GAFP;AAGC,IAAA,eAAe,EAAGC,aAHnB;AAIC,IAAA,QAAQ,EAAGC,IAJZ;AAKC,IAAA,WAAW,EAAGC,OAAO,KAAKM,SAAZ,GAAwB,CAAC,CAAEN,OAA3B,GAAqCM,SALpD;AAMC,IAAA,KAAK,EAAGN,OAAO,IAAIC;AANpB,KADD;AAUA;;eAEc,yBAAYL,UAAZ,C","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction IconButton( { labelPosition, size, tooltip, label, ...props }, ref ) {\n\tdeprecated( 'wp.components.IconButton', {\n\t\tsince: '5.4',\n\t\talternative: 'wp.components.Button',\n\t\tversion: '6.2',\n\t} );\n\n\treturn (\n\t\t<Button\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\ttooltipPosition={ labelPosition }\n\t\t\ticonSize={ size }\n\t\t\tshowTooltip={ tooltip !== undefined ? !! tooltip : undefined }\n\t\t\tlabel={ tooltip || label }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( IconButton );\n"]}
+{"version":3,"sources":["@wordpress/components/src/button/deprecated.tsx"],"names":["UnforwardedIconButton","ref","label","labelPosition","size","tooltip","props","since","alternative","version","undefined"],"mappings":";;;;;;;;;AASA;;;;AADA;;AAMA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAIA,SAASA,qBAAT,OASCC,GATD,EAUE;AAAA,MATD;AACCC,IAAAA,KADD;AAECC,IAAAA,aAFD;AAGCC,IAAAA,IAHD;AAICC,IAAAA,OAJD;AAKC,OAAGC;AALJ,GASC;AACD,2BAAY,0BAAZ,EAAwC;AACvCC,IAAAA,KAAK,EAAE,KADgC;AAEvCC,IAAAA,WAAW,EAAE,sBAF0B;AAGvCC,IAAAA,OAAO,EAAE;AAH8B,GAAxC;AAMA,SACC,4BAAC,SAAD,6BACMH,KADN;AAEC,IAAA,GAAG,EAAGL,GAFP;AAGC,IAAA,eAAe,EAAGE,aAHnB;AAIC,IAAA,QAAQ,EAAGC,IAJZ;AAKC,IAAA,WAAW,EAAGC,OAAO,KAAKK,SAAZ,GAAwB,CAAC,CAAEL,OAA3B,GAAqCK,SALpD;AAMC,IAAA,KAAK,EAAGL,OAAO,IAAIH;AANpB,KADD;AAUA;;eAEc,yBAAYF,qBAAZ,C","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '.';\nimport type { DeprecatedIconButtonProps } from './types';\n\nfunction UnforwardedIconButton(\n\t{\n\t\tlabel,\n\t\tlabelPosition,\n\t\tsize,\n\t\ttooltip,\n\t\t...props\n\t}: React.ComponentPropsWithoutRef< typeof Button > &\n\t\tDeprecatedIconButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tdeprecated( 'wp.components.IconButton', {\n\t\tsince: '5.4',\n\t\talternative: 'wp.components.Button',\n\t\tversion: '6.2',\n\t} );\n\n\treturn (\n\t\t<Button\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\ttooltipPosition={ labelPosition }\n\t\t\ticonSize={ size }\n\t\t\tshowTooltip={ tooltip !== undefined ? !! tooltip : undefined }\n\t\t\tlabel={ tooltip || label }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( UnforwardedIconButton );\n"]}

package/build/button/index.js

@@ -5,7 +5,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Button = Button;
+exports.Button = void 0;
+exports.UnforwardedButton = UnforwardedButton;
 exports.default = void 0;
 
 var _element = require("@wordpress/element");
@@ -24,8 +25,6 @@ var _icon = _interopRequireDefault(require("../icon"));
 
 var _visuallyHidden = require("../visually-hidden");
 
-// @ts-nocheck
-
 /**
  * External dependencies
  */
@@ -91,12 +90,10 @@ function useDeprecatedProps(_ref) {
   };
 }
 
-function Button(props, ref) {
+function UnforwardedButton(props, ref) {
   var _children$, _children$$props;
 
   const {
-    href,
-    target,
     isSmall,
     isPressed,
     isBusy,
@@ -115,10 +112,19 @@ function Button(props, ref) {
     variant,
     __experimentalIsFocusable: isFocusable,
     describedBy,
-    ...additionalProps
+    ...buttonOrAnchorProps
   } = useDeprecatedProps(props);
+  const {
+    href,
+    target,
+    ...additionalProps
+  } = 'href' in buttonOrAnchorProps ? buttonOrAnchorProps : {
+    href: undefined,
+    target: undefined,
+    ...buttonOrAnchorProps
+  };
   const instanceId = (0, _compose.useInstanceId)(Button, 'components-button__description');
-  const hasChildren = (children === null || children === void 0 ? void 0 : children[0]) && children[0] !== null && // Tooltip should not considered as a child
+  const hasChildren = 'string' === typeof children && !!children || Array.isArray(children) && (children === null || children === void 0 ? void 0 : children[0]) && children[0] !== null && // Tooltip should not considered as a child
   (children === null || children === void 0 ? void 0 : (_children$ = children[0]) === null || _children$ === void 0 ? void 0 : (_children$$props = _children$.props) === null || _children$$props === void 0 ? void 0 : _children$$props.className) !== 'components-tooltip';
   const classes = (0, _classnames.default)('components-button', className, {
     'is-secondary': variant === 'secondary',
@@ -134,24 +140,28 @@ function Button(props, ref) {
   });
   const trulyDisabled = disabled && !isFocusable;
   const Tag = href !== undefined && !trulyDisabled ? 'a' : 'button';
-  const tagProps = Tag === 'a' ? {
-    href,
-    target
-  } : {
+  const buttonProps = Tag === 'button' ? {
     type: 'button',
     disabled: trulyDisabled,
     'aria-pressed': isPressed
-  };
+  } : {};
+  const anchorProps = Tag === 'a' ? {
+    href,
+    target
+  } : {};
 
   if (disabled && isFocusable) {
     // In this case, the button will be disabled, but still focusable and
     // perceivable by screen reader users.
-    tagProps['aria-disabled'] = true;
+    buttonProps['aria-disabled'] = true;
+    anchorProps['aria-disabled'] = true;
 
     for (const disabledEvent of disabledEventsOnDisabledButton) {
       additionalProps[disabledEvent] = event => {
-        event.stopPropagation();
-        event.preventDefault();
+        if (event) {
+          event.stopPropagation();
+          event.preventDefault();
+        }
       };
     }
   } // Should show the tooltip if...
@@ -163,20 +173,22 @@ function Button(props, ref) {
   !!label && // The children are empty and...
   !(children !== null && children !== void 0 && children.length) && // The tooltip is not explicitly disabled.
   false !== showTooltip);
-  const descriptionId = describedBy ? instanceId : null;
+  const descriptionId = describedBy ? instanceId : undefined;
   const describedById = additionalProps['aria-describedby'] || descriptionId;
-  const element = (0, _element.createElement)(Tag, (0, _extends2.default)({}, tagProps, additionalProps, {
+  const commonProps = {
     className: classes,
-    "aria-label": additionalProps['aria-label'] || label,
-    "aria-describedby": describedById,
-    ref: ref
-  }), icon && iconPosition === 'left' && (0, _element.createElement)(_icon.default, {
+    'aria-label': additionalProps['aria-label'] || label,
+    'aria-describedby': describedById,
+    ref
+  };
+  const elementChildren = (0, _element.createElement)(_element.Fragment, null, icon && iconPosition === 'left' && (0, _element.createElement)(_icon.default, {
     icon: icon,
     size: iconSize
   }), text && (0, _element.createElement)(_element.Fragment, null, text), icon && iconPosition === 'right' && (0, _element.createElement)(_icon.default, {
     icon: icon,
     size: iconSize
   }), children);
+  const element = Tag === 'a' ? (0, _element.createElement)("a", (0, _extends2.default)({}, anchorProps, additionalProps, commonProps), elementChildren) : (0, _element.createElement)("button", (0, _extends2.default)({}, buttonProps, additionalProps, commonProps), elementChildren);
 
   if (!shouldShowTooltip) {
     return (0, _element.createElement)(_element.Fragment, null, element, describedBy && (0, _element.createElement)(_visuallyHidden.VisuallyHidden, null, (0, _element.createElement)("span", {
@@ -192,8 +204,25 @@ function Button(props, ref) {
     id: descriptionId
   }, describedBy)));
 }
+/**
+ * Lets users take actions and make choices with a single click or tap.
+ *
+ * ```jsx
+ * import { Button } from '@wordpress/components';
+ * const Mybutton = () => (
+ *   <Button
+ *     variant="primary"
+ *     onClick={ handleClick }
+ *   >
+ *     Click here
+ *   </Button>
+ * );
+ * ```
+ */
 
-var _default = (0, _element.forwardRef)(Button);
 
+const Button = (0, _element.forwardRef)(UnforwardedButton);
+exports.Button = Button;
+var _default = Button;
 exports.default = _default;
 //# sourceMappingURL=index.js.map

package/build/button/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/button/index.js"],"names":["disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","variant","otherProps","computedVariant","since","alternative","version","Button","props","ref","href","target","isSmall","isPressed","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","additionalProps","instanceId","hasChildren","classes","trulyDisabled","Tag","undefined","tagProps","type","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","element"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ];\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tvariant,\n\t...otherProps\n} ) {\n\tlet computedVariant = variant;\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'Button isDefault prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t\tversion: '6.2',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...otherProps,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function Button( props, ref ) {\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\tisSmall,\n\t\tisPressed,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...additionalProps\n\t} = useDeprecatedProps( props );\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\tchildren?.[ 0 ] &&\n\t\tchildren[ 0 ] !== null &&\n\t\t// Tooltip should not considered as a child\n\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip';\n\n\tconst classes = classnames( 'components-button', className, {\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': isSmall,\n\t\t'is-tertiary': variant === 'tertiary',\n\t\t'is-pressed': isPressed,\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && hasChildren,\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst tagProps =\n\t\tTag === 'a'\n\t\t\t? { href, target }\n\t\t\t: {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-pressed': isPressed,\n\t\t\t  };\n\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\ttagProps[ 'aria-disabled' ] = true;\n\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tadditionalProps[ disabledEvent ] = ( event ) => {\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tevent.preventDefault();\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\tshortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! children?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : null;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst element = (\n\t\t<Tag\n\t\t\t{ ...tagProps }\n\t\t\t{ ...additionalProps }\n\t\t\tclassName={ classes }\n\t\t\taria-label={ additionalProps[ 'aria-label' ] || label }\n\t\t\taria-describedby={ describedById }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ children }\n\t\t</Tag>\n\t);\n\n\tif ( ! shouldShowTooltip ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ element }\n\t\t\t\t{ describedBy && (\n\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip\n\t\t\t\ttext={ children?.length && describedBy ? describedBy : label }\n\t\t\t\tshortcut={ shortcut }\n\t\t\t\tposition={ tooltipPosition }\n\t\t\t>\n\t\t\t\t{ element }\n\t\t\t</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default forwardRef( Button );\n"]}
+{"version":3,"sources":["@wordpress/components/src/button/index.tsx"],"names":["disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","variant","otherProps","computedVariant","since","alternative","version","UnforwardedButton","props","ref","isSmall","isPressed","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","buttonOrAnchorProps","href","target","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","classes","trulyDisabled","Tag","buttonProps","type","anchorProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","element"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedVariant = variant;\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'Button isDefault prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t\tversion: '6.2',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...otherProps,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\tisSmall,\n\t\tisPressed,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst { href, target, ...additionalProps } =\n\t\t'href' in buttonOrAnchorProps\n\t\t\t? buttonOrAnchorProps\n\t\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst classes = classnames( 'components-button', className, {\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': isSmall,\n\t\t'is-tertiary': variant === 'tertiary',\n\t\t'is-pressed': isPressed,\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && hasChildren,\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-pressed': isPressed,\n\t\t\t  }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tadditionalProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\tshortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ children }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\tif ( ! shouldShowTooltip ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ element }\n\t\t\t\t{ describedBy && (\n\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip\n\t\t\t\ttext={\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label\n\t\t\t\t}\n\t\t\t\tshortcut={ shortcut }\n\t\t\t\tposition={ tooltipPosition }\n\t\t\t>\n\t\t\t\t{ element }\n\t\t\t</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n *   <Button\n *     variant=\"primary\"\n *     onClick={ handleClick }\n *   >\n *     Click here\n *   </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"]}

package/build/button/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/build/button/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-list-picker/index.js"],"names":["ColorOption","label","value","colors","disableCustomColors","enableAlpha","onChange","isOpen","setIsOpen","prev","swatch","ColorListPicker","labels","map","index","newColor","newColors","slice"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAbA;AACA;AACA;;AAIA;AACA;AACA;AAOA,SAASA,WAAT,OAOI;AAAA,MAPkB;AACrBC,IAAAA,KADqB;AAErBC,IAAAA,KAFqB;AAGrBC,IAAAA,MAHqB;AAIrBC,IAAAA,mBAJqB;AAKrBC,IAAAA,WALqB;AAMrBC,IAAAA;AANqB,GAOlB;AACH,QAAM,CAAEC,MAAF,EAAUC,SAAV,IAAwB,uBAAU,KAAV,CAA9B;AACA,SACC,qDACC,4BAAC,eAAD;AACC,IAAA,SAAS,EAAC,6CADX;AAEC,IAAA,OAAO,EAAG,MAAMA,SAAS,CAAIC,IAAF,IAAY,CAAEA,IAAhB;AAF1B,KAIC,4BAAC,cAAD;AAAQ,IAAA,OAAO,EAAC,YAAhB;AAA6B,IAAA,OAAO,EAAG;AAAvC,KACGP,KAAK,GACN,4BAAC,uBAAD;AACC,IAAA,UAAU,EAAGA,KADd;AAEC,IAAA,SAAS,EAAC;AAFX,IADM,GAMN,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGQ;AAAb,IAPF,EASC,0CAAQT,KAAR,CATD,CAJD,CADD,EAiBGM,MAAM,IACP,4BAAC,qBAAD;AACC,IAAA,SAAS,EAAC,4CADX;AAEC,IAAA,MAAM,EAAGJ,MAFV;AAGC,IAAA,KAAK,EAAGD,KAHT;AAIC,IAAA,SAAS,EAAG,KAJb;AAKC,IAAA,QAAQ,EAAGI,QALZ;AAMC,IAAA,mBAAmB,EAAGF,mBANvB;AAOC,IAAA,WAAW,EAAGC;AAPf,IAlBF,CADD;AA+BA;;AAED,SAASM,eAAT,QAOI;AAAA,MAPsB;AACzBR,IAAAA,MADyB;AAEzBS,IAAAA,MAFyB;AAGzBV,IAAAA,KAAK,GAAG,EAHiB;AAIzBE,IAAAA,mBAJyB;AAKzBC,IAAAA,WALyB;AAMzBC,IAAAA;AANyB,GAOtB;AACH,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGM,MAAM,CAACC,GAAP,CAAY,CAAEZ,KAAF,EAASa,KAAT,KACb,4BAAC,WAAD;AACC,IAAA,GAAG,EAAGA,KADP;AAEC,IAAA,KAAK,EAAGb,KAFT;AAGC,IAAA,KAAK,EAAGC,KAAK,CAAEY,KAAF,CAHd;AAIC,IAAA,MAAM,EAAGX,MAJV;AAKC,IAAA,mBAAmB,EAAGC,mBALvB;AAMC,IAAA,WAAW,EAAGC,WANf;AAOC,IAAA,QAAQ,EAAKU,QAAF,IAAgB;AAC1B,YAAMC,SAAS,GAAGd,KAAK,CAACe,KAAN,EAAlB;AACAD,MAAAA,SAAS,CAAEF,KAAF,CAAT,GAAqBC,QAArB;AACAT,MAAAA,QAAQ,CAAEU,SAAF,CAAR;AACA;AAXF,IADC,CADH,CADD;AAmBA;;eAEcL,e","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { swatch } from '@wordpress/icons';\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';\n\nfunction ColorOption( {\n\tlabel,\n\tvalue,\n\tcolors,\n\tdisableCustomColors,\n\tenableAlpha,\n\tonChange,\n} ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\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>\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>{ label }</span>\n\t\t\t\t</HStack>\n\t\t\t</Button>\n\t\t\t{ isOpen && (\n\t\t\t\t<ColorPalette\n\t\t\t\t\tclassName=\"components-color-list-picker__color-picker\"\n\t\t\t\t\tcolors={ colors }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tclearable={ false }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nfunction ColorListPicker( {\n\tcolors,\n\tlabels,\n\tvalue = [],\n\tdisableCustomColors,\n\tenableAlpha,\n\tonChange,\n} ) {\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 = value.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"]}
+{"version":3,"sources":["@wordpress/components/src/color-list-picker/index.tsx"],"names":["ColorOption","label","value","colors","disableCustomColors","enableAlpha","onChange","isOpen","setIsOpen","prev","swatch","ColorListPicker","labels","map","index","newColor","newColors","slice"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAbA;AACA;AACA;;AAIA;AACA;AACA;AAQA,SAASA,WAAT,OAOsB;AAAA,MAPA;AACrBC,IAAAA,KADqB;AAErBC,IAAAA,KAFqB;AAGrBC,IAAAA,MAHqB;AAIrBC,IAAAA,mBAJqB;AAKrBC,IAAAA,WALqB;AAMrBC,IAAAA;AANqB,GAOA;AACrB,QAAM,CAAEC,MAAF,EAAUC,SAAV,IAAwB,uBAAU,KAAV,CAA9B;AACA,SACC,qDACC,4BAAC,eAAD;AACC,IAAA,SAAS,EAAC,6CADX;AAEC,IAAA,OAAO,EAAG,MAAMA,SAAS,CAAIC,IAAF,IAAY,CAAEA,IAAhB;AAF1B,KAIC,4BAAC,cAAD;AAAQ,IAAA,OAAO,EAAC,YAAhB;AAA6B,IAAA,OAAO,EAAG;AAAvC,KACGP,KAAK,GACN,4BAAC,uBAAD;AACC,IAAA,UAAU,EAAGA,KADd;AAEC,IAAA,SAAS,EAAC;AAFX,IADM,GAMN,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGQ;AAAb,IAPF,EASC,0CAAQT,KAAR,CATD,CAJD,CADD,EAiBGM,MAAM,IACP,4BAAC,qBAAD;AACC,IAAA,SAAS,EAAC,4CADX;AAEC,IAAA,MAAM,EAAGJ,MAFV;AAGC,IAAA,KAAK,EAAGD,KAHT;AAIC,IAAA,SAAS,EAAG,KAJb;AAKC,IAAA,QAAQ,EAAGI,QALZ;AAMC,IAAA,mBAAmB,EAAGF,mBANvB;AAOC,IAAA,WAAW,EAAGC;AAPf,IAlBF,CADD;AA+BA;;AAED,SAASM,eAAT,QAO0B;AAAA,MAPA;AACzBR,IAAAA,MADyB;AAEzBS,IAAAA,MAFyB;AAGzBV,IAAAA,KAAK,GAAG,EAHiB;AAIzBE,IAAAA,mBAJyB;AAKzBC,IAAAA,WALyB;AAMzBC,IAAAA;AANyB,GAOA;AACzB,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGM,MAAM,CAACC,GAAP,CAAY,CAAEZ,KAAF,EAASa,KAAT,KACb,4BAAC,WAAD;AACC,IAAA,GAAG,EAAGA,KADP;AAEC,IAAA,KAAK,EAAGb,KAFT;AAGC,IAAA,KAAK,EAAGC,KAAK,CAAEY,KAAF,CAHd;AAIC,IAAA,MAAM,EAAGX,MAJV;AAKC,IAAA,mBAAmB,EAAGC,mBALvB;AAMC,IAAA,WAAW,EAAGC,WANf;AAOC,IAAA,QAAQ,EAAKU,QAAF,IAAgB;AAC1B,YAAMC,SAAS,GAAGd,KAAK,CAACe,KAAN,EAAlB;AACAD,MAAAA,SAAS,CAAEF,KAAF,CAAT,GAAqBC,QAArB;AACAT,MAAAA,QAAQ,CAAEU,SAAF,CAAR;AACA;AAXF,IADC,CADH,CADD;AAmBA;;eAEcL,e","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { swatch } from '@wordpress/icons';\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';\n\nfunction ColorOption( {\n\tlabel,\n\tvalue,\n\tcolors,\n\tdisableCustomColors,\n\tenableAlpha,\n\tonChange,\n}: ColorOptionProps ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\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>\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>{ label }</span>\n\t\t\t\t</HStack>\n\t\t\t</Button>\n\t\t\t{ isOpen && (\n\t\t\t\t<ColorPalette\n\t\t\t\t\tclassName=\"components-color-list-picker__color-picker\"\n\t\t\t\t\tcolors={ colors }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tclearable={ false }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t/>\n\t\t\t) }\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 = value.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"]}

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

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}