@wordpress/components 19.13.0 → 19.16.0

package/build-module/color-picker/use-deprecated-props.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-picker/use-deprecated-props.ts"],"names":["colord","memoize","useCallback","useMemo","isLegacyProps","props","onChangeComplete","disableAlpha","color","hex","getColorFromLegacyProps","undefined","transformColorStringToLegacyColor","colordColor","toHex","rgb","toRgb","hsv","toHsv","hsl","toHsl","source","oldHue","h","useDeprecatedProps","onChange","enableAlpha"],"mappings":"AAAA;AACA;AACA;AACA,SACCA,MADD,QAQO,QARP;AAUA,OAAOC,OAAP,MAAoB,QAApB;AAEA;AACA;AACA;;AACA,SAASC,WAAT,EAAsBC,OAAtB,QAAqC,oBAArC;AAEA;AACA;AACA;;AA6CA,SAASC,aAAT,CAAwBC,KAAxB,EAA2D;AAAA;;AAC1D,SACC,OAAOA,KAAK,CAACC,gBAAb,KAAkC,WAAlC,IACA,OAAOD,KAAK,CAACE,YAAb,KAA8B,WAD9B,IAEA,wBAAOF,KAAK,CAACG,KAAb,iDAAO,aAAaC,GAApB,MAA4B,QAH7B;AAKA;;AAED,SAASC,uBAAT,CAAkCL,KAAlC,EAA2E;AAC1E,MAAK,QAAOA,KAAP,aAAOA,KAAP,uBAAOA,KAAK,CAAEG,KAAd,MAAwB,WAA7B,EAA2C;AAC1C,WAAOG,SAAP;AACA;;AACD,MAAK,OAAON,KAAK,CAACG,KAAb,KAAuB,QAA5B,EAAuC;AACtC,WAAOH,KAAK,CAACG,KAAb;AACA;;AACD,MAAKH,KAAK,CAACG,KAAN,CAAYC,GAAjB,EAAuB;AACtB,WAAOJ,KAAK,CAACG,KAAN,CAAYC,GAAnB;AACA;;AAED,SAAOE,SAAP;AACA;;AAED,MAAMC,iCAAiC,GAAGX,OAAO,CAC9CO,KAAF,IAAkC;AACjC,QAAMK,WAAW,GAAGb,MAAM,CAAEQ,KAAF,CAA1B;AACA,QAAMC,GAAG,GAAGI,WAAW,CAACC,KAAZ,EAAZ;AACA,QAAMC,GAAG,GAAGF,WAAW,CAACG,KAAZ,EAAZ;AACA,QAAMC,GAAG,GAAGJ,WAAW,CAACK,KAAZ,EAAZ;AACA,QAAMC,GAAG,GAAGN,WAAW,CAACO,KAAZ,EAAZ;AAEA,SAAO;AACNX,IAAAA,GADM;AAENM,IAAAA,GAFM;AAGNE,IAAAA,GAHM;AAINE,IAAAA,GAJM;AAKNE,IAAAA,MAAM,EAAE,KALF;AAMNC,IAAAA,MAAM,EAAEH,GAAG,CAACI;AANN,GAAP;AAQA,CAhB+C,CAAjD;AAmBA,OAAO,SAASC,kBAAT,CACNnB,KADM,EAEa;AACnB,QAAMoB,QAAQ,GAAGvB,WAAW,CACzBM,KAAF,IAAqB;AAAA;;AACpB,QAAKJ,aAAa,CAAEC,KAAF,CAAlB,EAA8B;AAC7B,aAAOA,KAAK,CAACC,gBAAN,CACNM,iCAAiC,CAAEJ,KAAF,CAD3B,CAAP;AAGA;;AAED,8BAAOH,KAAK,CAACoB,QAAb,oDAAO,qBAAApB,KAAK,EAAaG,KAAb,CAAZ;AACA,GAT0B,EAU3B,CACGH,KAAF,CAAyBC,gBAD1B,EAEGD,KAAF,CAA8BoB,QAF/B,CAV2B,CAA5B;AAgBA,QAAMjB,KAAK,GAAGL,OAAO,CAAE,MAAM;AAC5B,WAAOC,aAAa,CAAEC,KAAF,CAAb,GACJK,uBAAuB,CAAEL,KAAF,CADnB,GAEJA,KAAK,CAACG,KAFT;AAGA,GAJoB,EAIlB,CAAEH,KAAK,CAACG,KAAR,CAJkB,CAArB;AAMA,QAAMkB,WAAW,GAAGvB,OAAO,CAAE,MAAM;AAClC,WAAOC,aAAa,CAAEC,KAAF,CAAb,GACJ,CAAEA,KAAK,CAACE,YADJ,GAEJF,KAAK,CAACqB,WAFT;AAGA,GAJ0B,EAIxB,CACArB,KAAF,CAAyBE,YADvB,EAEAF,KAAF,CAA8BqB,WAF5B,CAJwB,CAA3B;AASA,SAAO,EACN,IAAKtB,aAAa,CAAEC,KAAF,CAAb,GAAyB,EAAzB,GAA8BA,KAAnC,CADM;AAENoB,IAAAA,QAFM;AAGNjB,IAAAA,KAHM;AAINkB,IAAAA;AAJM,GAAP;AAMA","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tcolord,\n\tHslColor,\n\tHslaColor,\n\tHsvColor,\n\tHsvaColor,\n\tRgbColor,\n\tRgbaColor,\n} from 'colord';\nimport type { ComponentProps } from 'react';\nimport memoize from 'memize';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type ColorPicker from './component';\n\ntype ColorPickerProps = ComponentProps< typeof ColorPicker >;\n\n/**\n * @deprecated\n */\ntype LegacyColor =\n\t| string\n\t| {\n\t\t\thex: string;\n\t\t\thsl: HslColor | HslaColor;\n\t\t\thsv: HsvColor | HsvaColor;\n\t\t\trgb: RgbColor | RgbaColor;\n\t\t\t/**\n\t\t\t * @deprecated\n\t\t\t */\n\t\t\toldHue: number;\n\t\t\t/**\n\t\t\t * @deprecated\n\t\t\t */\n\t\t\tsource: 'hex';\n\t  };\n\n/**\n * @deprecated\n */\nexport interface LegacyProps {\n\tcolor?: LegacyColor;\n\t/**\n\t * @deprecated\n\t */\n\tonChangeComplete: ( colors: LegacyColor ) => void;\n\t/**\n\t * @deprecated\n\t */\n\toldHue: string;\n\tclassName: string;\n\t/**\n\t * @deprecated\n\t */\n\tdisableAlpha: boolean;\n}\n\nfunction isLegacyProps( props: any ): props is LegacyProps {\n\treturn (\n\t\ttypeof props.onChangeComplete !== 'undefined' ||\n\t\ttypeof props.disableAlpha !== 'undefined' ||\n\t\ttypeof props.color?.hex === 'string'\n\t);\n}\n\nfunction getColorFromLegacyProps( props: LegacyProps ): string | undefined {\n\tif ( typeof props?.color === 'undefined' ) {\n\t\treturn undefined;\n\t}\n\tif ( typeof props.color === 'string' ) {\n\t\treturn props.color;\n\t}\n\tif ( props.color.hex ) {\n\t\treturn props.color.hex;\n\t}\n\n\treturn undefined;\n}\n\nconst transformColorStringToLegacyColor = memoize(\n\t( color: string ): LegacyColor => {\n\t\tconst colordColor = colord( color );\n\t\tconst hex = colordColor.toHex();\n\t\tconst rgb = colordColor.toRgb();\n\t\tconst hsv = colordColor.toHsv();\n\t\tconst hsl = colordColor.toHsl();\n\n\t\treturn {\n\t\t\thex,\n\t\t\trgb,\n\t\t\thsv,\n\t\t\thsl,\n\t\t\tsource: 'hex',\n\t\t\toldHue: hsl.h,\n\t\t};\n\t}\n);\n\nexport function useDeprecatedProps(\n\tprops: LegacyProps | ColorPickerProps\n): ColorPickerProps {\n\tconst onChange = useCallback(\n\t\t( color: string ) => {\n\t\t\tif ( isLegacyProps( props ) ) {\n\t\t\t\treturn props.onChangeComplete(\n\t\t\t\t\ttransformColorStringToLegacyColor( color )\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn props.onChange?.( color );\n\t\t},\n\t\t[\n\t\t\t( props as LegacyProps ).onChangeComplete,\n\t\t\t( props as ColorPickerProps ).onChange,\n\t\t]\n\t);\n\n\tconst color = useMemo( () => {\n\t\treturn isLegacyProps( props )\n\t\t\t? getColorFromLegacyProps( props )\n\t\t\t: props.color;\n\t}, [ props.color ] );\n\n\tconst enableAlpha = useMemo( () => {\n\t\treturn isLegacyProps( props )\n\t\t\t? ! props.disableAlpha\n\t\t\t: props.enableAlpha;\n\t}, [\n\t\t( props as LegacyProps ).disableAlpha,\n\t\t( props as ColorPickerProps ).enableAlpha,\n\t] );\n\n\treturn {\n\t\t...( isLegacyProps( props ) ? {} : props ),\n\t\tonChange,\n\t\tcolor,\n\t\tenableAlpha,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/color-picker/use-deprecated-props.ts"],"names":["colord","memoize","useCallback","isLegacyProps","props","onChangeComplete","disableAlpha","color","hex","getColorFromLegacyProps","undefined","transformColorStringToLegacyColor","colordColor","toHex","rgb","toRgb","hsv","toHsv","hsl","toHsl","source","oldHue","h","useDeprecatedProps","legacyChangeHandler","enableAlpha","onChange"],"mappings":"AAAA;AACA;AACA;AACA,SACCA,MADD,QAQO,QARP;AAUA,OAAOC,OAAP,MAAoB,QAApB;AAEA;AACA;AACA;;AACA,SAASC,WAAT,QAA4B,oBAA5B;AAEA;AACA;AACA;;AA6CA,SAASC,aAAT,CAAwBC,KAAxB,EAA2D;AAAA;;AAC1D,SACC,OAAOA,KAAK,CAACC,gBAAb,KAAkC,WAAlC,IACA,OAAOD,KAAK,CAACE,YAAb,KAA8B,WAD9B,IAEA,wBAAOF,KAAK,CAACG,KAAb,iDAAO,aAAaC,GAApB,MAA4B,QAH7B;AAKA;;AAED,SAASC,uBAAT,CACCF,KADD,EAEsB;AACrB,MAAKA,KAAK,KAAKG,SAAf,EAA2B;AAE3B,MAAK,OAAOH,KAAP,KAAiB,QAAtB,EAAiC,OAAOA,KAAP;AAEjC,MAAKA,KAAK,CAACC,GAAX,EAAiB,OAAOD,KAAK,CAACC,GAAb;AAEjB,SAAOE,SAAP;AACA;;AAED,MAAMC,iCAAiC,GAAGV,OAAO,CAC9CM,KAAF,IAAkC;AACjC,QAAMK,WAAW,GAAGZ,MAAM,CAAEO,KAAF,CAA1B;AACA,QAAMC,GAAG,GAAGI,WAAW,CAACC,KAAZ,EAAZ;AACA,QAAMC,GAAG,GAAGF,WAAW,CAACG,KAAZ,EAAZ;AACA,QAAMC,GAAG,GAAGJ,WAAW,CAACK,KAAZ,EAAZ;AACA,QAAMC,GAAG,GAAGN,WAAW,CAACO,KAAZ,EAAZ;AAEA,SAAO;AACNX,IAAAA,GADM;AAENM,IAAAA,GAFM;AAGNE,IAAAA,GAHM;AAINE,IAAAA,GAJM;AAKNE,IAAAA,MAAM,EAAE,KALF;AAMNC,IAAAA,MAAM,EAAEH,GAAG,CAACI;AANN,GAAP;AAQA,CAhB+C,CAAjD;AAmBA,OAAO,SAASC,kBAAT,CACNnB,KADM,EAEa;AACnB,QAAM;AAAEC,IAAAA;AAAF,MAAuBD,KAA7B;AACA,QAAMoB,mBAAmB,GAAGtB,WAAW,CACpCK,KAAF,IAAqB;AACpBF,IAAAA,gBAAgB,CAAEM,iCAAiC,CAAEJ,KAAF,CAAnC,CAAhB;AACA,GAHqC,EAItC,CAAEF,gBAAF,CAJsC,CAAvC;;AAMA,MAAKF,aAAa,CAAEC,KAAF,CAAlB,EAA8B;AAC7B,WAAO;AACNG,MAAAA,KAAK,EAAEE,uBAAuB,CAAEL,KAAK,CAACG,KAAR,CADxB;AAENkB,MAAAA,WAAW,EAAE,CAAErB,KAAK,CAACE,YAFf;AAGNoB,MAAAA,QAAQ,EAAEF;AAHJ,KAAP;AAKA;;AACD,SAAO,EACN,GAAGpB,KADG;AAENG,IAAAA,KAAK,EAAEH,KAAK,CAACG,KAFP;AAGNkB,IAAAA,WAAW,EAAIrB,KAAF,CAA8BqB,WAHrC;AAINC,IAAAA,QAAQ,EAAItB,KAAF,CAA8BsB;AAJlC,GAAP;AAMA","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tcolord,\n\tHslColor,\n\tHslaColor,\n\tHsvColor,\n\tHsvaColor,\n\tRgbColor,\n\tRgbaColor,\n} from 'colord';\nimport type { ComponentProps } from 'react';\nimport memoize from 'memize';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type ColorPicker from './component';\n\ntype ColorPickerProps = ComponentProps< typeof ColorPicker >;\n\n/**\n * @deprecated\n */\ntype LegacyColor =\n\t| string\n\t| {\n\t\t\thex: string;\n\t\t\thsl: HslColor | HslaColor;\n\t\t\thsv: HsvColor | HsvaColor;\n\t\t\trgb: RgbColor | RgbaColor;\n\t\t\t/**\n\t\t\t * @deprecated\n\t\t\t */\n\t\t\toldHue: number;\n\t\t\t/**\n\t\t\t * @deprecated\n\t\t\t */\n\t\t\tsource: 'hex';\n\t  };\n\n/**\n * @deprecated\n */\nexport interface LegacyProps {\n\tcolor?: LegacyColor;\n\t/**\n\t * @deprecated\n\t */\n\tonChangeComplete: ( colors: LegacyColor ) => void;\n\t/**\n\t * @deprecated\n\t */\n\toldHue: string;\n\tclassName: string;\n\t/**\n\t * @deprecated\n\t */\n\tdisableAlpha: boolean;\n}\n\nfunction isLegacyProps( props: any ): props is LegacyProps {\n\treturn (\n\t\ttypeof props.onChangeComplete !== 'undefined' ||\n\t\ttypeof props.disableAlpha !== 'undefined' ||\n\t\ttypeof props.color?.hex === 'string'\n\t);\n}\n\nfunction getColorFromLegacyProps(\n\tcolor: LegacyProps[ 'color' ]\n): string | undefined {\n\tif ( color === undefined ) return;\n\n\tif ( typeof color === 'string' ) return color;\n\n\tif ( color.hex ) return color.hex;\n\n\treturn undefined;\n}\n\nconst transformColorStringToLegacyColor = memoize(\n\t( color: string ): LegacyColor => {\n\t\tconst colordColor = colord( color );\n\t\tconst hex = colordColor.toHex();\n\t\tconst rgb = colordColor.toRgb();\n\t\tconst hsv = colordColor.toHsv();\n\t\tconst hsl = colordColor.toHsl();\n\n\t\treturn {\n\t\t\thex,\n\t\t\trgb,\n\t\t\thsv,\n\t\t\thsl,\n\t\t\tsource: 'hex',\n\t\t\toldHue: hsl.h,\n\t\t};\n\t}\n);\n\nexport function useDeprecatedProps(\n\tprops: LegacyProps | ColorPickerProps\n): ColorPickerProps {\n\tconst { onChangeComplete } = props as LegacyProps;\n\tconst legacyChangeHandler = useCallback(\n\t\t( color: string ) => {\n\t\t\tonChangeComplete( transformColorStringToLegacyColor( color ) );\n\t\t},\n\t\t[ onChangeComplete ]\n\t);\n\tif ( isLegacyProps( props ) ) {\n\t\treturn {\n\t\t\tcolor: getColorFromLegacyProps( props.color ),\n\t\t\tenableAlpha: ! props.disableAlpha,\n\t\t\tonChange: legacyChangeHandler,\n\t\t};\n\t}\n\treturn {\n\t\t...props,\n\t\tcolor: props.color as ColorPickerProps[ 'color' ],\n\t\tenableAlpha: ( props as ColorPickerProps ).enableAlpha,\n\t\tonChange: ( props as ColorPickerProps ).onChange,\n\t};\n}\n"]}

package/build-module/combobox-control/index.js

@@ -4,7 +4,7 @@ import { createElement } from "@wordpress/element";
  * External dependencies
  */
 import classnames from 'classnames';
-import { deburr } from 'lodash';
+import removeAccents from 'remove-accents';
 /**
  * WordPress dependencies
  */
@@ -12,18 +12,18 @@ import { deburr } from 'lodash';
 import { __, _n, sprintf } from '@wordpress/i18n';
 import { Component, useState, useMemo, useRef, useEffect } from '@wordpress/element';
 import { useInstanceId } from '@wordpress/compose';
-import { ENTER, UP, DOWN, ESCAPE } from '@wordpress/keycodes';
 import { speak } from '@wordpress/a11y';
 import { closeSmall } from '@wordpress/icons';
 /**
  * Internal dependencies
  */
 
+import { InputWrapperFlex } from './styles';
 import TokenInput from '../form-token-field/token-input';
 import SuggestionsList from '../form-token-field/suggestions-list';
 import BaseControl from '../base-control';
 import Button from '../button';
-import { Flex, FlexBlock, FlexItem } from '../flex';
+import { FlexBlock, FlexItem } from '../flex';
 import withFocusOutside from '../higher-order/with-focus-outside';
 
 const noop = () => {};
@@ -43,6 +43,7 @@ function ComboboxControl(_ref) {
   var _currentOption$label;
 
   let {
+    __next36pxDefaultSize,
     value,
     label,
     options,
@@ -57,8 +58,11 @@ function ComboboxControl(_ref) {
     }
   } = _ref;
   const currentOption = options.find(option => option.value === value);
-  const currentLabel = (_currentOption$label = currentOption === null || currentOption === void 0 ? void 0 : currentOption.label) !== null && _currentOption$label !== void 0 ? _currentOption$label : '';
-  const instanceId = useInstanceId(ComboboxControl);
+  const currentLabel = (_currentOption$label = currentOption === null || currentOption === void 0 ? void 0 : currentOption.label) !== null && _currentOption$label !== void 0 ? _currentOption$label : ''; // Use a custom prefix when generating the `instanceId` to avoid having
+  // duplicate input IDs when rendering this component and `FormTokenField`
+  // in the same page (see https://github.com/WordPress/gutenberg/issues/42112).
+
+  const instanceId = useInstanceId(ComboboxControl, 'combobox-control');
   const [selectedSuggestion, setSelectedSuggestion] = useState(currentOption || null);
   const [isExpanded, setIsExpanded] = useState(false);
   const [inputHasFocus, setInputHasFocus] = useState(false);
@@ -67,9 +71,9 @@ function ComboboxControl(_ref) {
   const matchingSuggestions = useMemo(() => {
     const startsWithMatch = [];
     const containsMatch = [];
-    const match = deburr(inputValue.toLocaleLowerCase());
+    const match = removeAccents(inputValue.toLocaleLowerCase());
     options.forEach(option => {
-      const index = deburr(option.label).toLocaleLowerCase().indexOf(match);
+      const index = removeAccents(option.label).toLocaleLowerCase().indexOf(match);
 
       if (index === 0) {
         startsWithMatch.push(option);
@@ -110,8 +114,8 @@ function ComboboxControl(_ref) {
       return;
     }
 
-    switch (event.keyCode) {
-      case ENTER:
+    switch (event.code) {
+      case 'Enter':
         if (selectedSuggestion) {
           onSuggestionSelected(selectedSuggestion);
           preventDefault = true;
@@ -119,17 +123,17 @@ function ComboboxControl(_ref) {
 
         break;
 
-      case UP:
+      case 'ArrowUp':
         handleArrowNavigation(-1);
         preventDefault = true;
         break;
 
-      case DOWN:
+      case 'ArrowDown':
         handleArrowNavigation(1);
         preventDefault = true;
         break;
 
-      case ESCAPE:
+      case 'Escape':
         setIsExpanded(false);
         setSelectedSuggestion(null);
         preventDefault = true;
@@ -213,7 +217,9 @@ function ComboboxControl(_ref) {
     className: "components-combobox-control__suggestions-container",
     tabIndex: "-1",
     onKeyDown: onKeyDown
-  }, createElement(Flex, null, createElement(FlexBlock, null, createElement(TokenInput, {
+  }, createElement(InputWrapperFlex, {
+    __next36pxDefaultSize: __next36pxDefaultSize
+  }, createElement(FlexBlock, null, createElement(TokenInput, {
     className: "components-combobox-control__input",
     instanceId: instanceId,
     ref: inputContainer,

package/build-module/combobox-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/combobox-control/index.js"],"names":["classnames","deburr","__","_n","sprintf","Component","useState","useMemo","useRef","useEffect","useInstanceId","ENTER","UP","DOWN","ESCAPE","speak","closeSmall","TokenInput","SuggestionsList","BaseControl","Button","Flex","FlexBlock","FlexItem","withFocusOutside","noop","DetectOutside","handleFocusOutside","event","props","onFocusOutside","render","children","ComboboxControl","value","label","options","onChange","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","currentOption","find","option","currentLabel","instanceId","selectedSuggestion","setSelectedSuggestion","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","matchingSuggestions","startsWithMatch","containsMatch","match","toLocaleLowerCase","forEach","index","indexOf","push","concat","onSuggestionSelected","newSelectedSuggestion","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","keyCode","onBlur","onFocus","onInputChange","text","handleOnReset","current","focus","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","suggestion"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { deburr } from 'lodash';\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { ENTER, UP, DOWN, ESCAPE } from '@wordpress/keycodes';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { Flex, FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\n\nconst noop = () => {};\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component {\n\t\thandleFocusOutside( event ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nfunction ComboboxControl( {\n\tvalue,\n\tlabel,\n\toptions,\n\tonChange,\n\tonFilterValueChange = noop,\n\thideLabelFromVision,\n\thelp,\n\tallowReset = true,\n\tclassName,\n\tmessages = {\n\t\tselected: __( 'Item selected.' ),\n\t},\n} ) {\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\tconst instanceId = useInstanceId( ComboboxControl );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef();\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch = [];\n\t\tconst containsMatch = [];\n\t\tconst match = deburr( inputValue.toLocaleLowerCase() );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = deburr( option.label )\n\t\t\t\t.toLocaleLowerCase()\n\t\t\t\t.indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options, value ] );\n\n\tconst onSuggestionSelected = ( newSelectedSuggestion ) => {\n\t\tonChange( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = matchingSuggestions.indexOf( selectedSuggestion );\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown = ( event ) => {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.keyCode ) {\n\t\t\tcase ENTER:\n\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase UP:\n\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase DOWN:\n\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase ESCAPE:\n\t\t\t\tsetIsExpanded( false );\n\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tsetIsExpanded( true );\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tonChange( null );\n\t\tinputContainer.current.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tmatchingSuggestions.indexOf( selectedSuggestion ) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t  )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-combobox-control'\n\t\t\t\t) }\n\t\t\t\ttabIndex=\"-1\"\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\n\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<Flex>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\tcurrentLabel\n\t\t\t\t\t\t\t\t\t\t? `${ currentLabel }, ${ label }`\n\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Flex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\tmatch={ { label: inputValue } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"]}
+{"version":3,"sources":["@wordpress/components/src/combobox-control/index.js"],"names":["classnames","removeAccents","__","_n","sprintf","Component","useState","useMemo","useRef","useEffect","useInstanceId","speak","closeSmall","InputWrapperFlex","TokenInput","SuggestionsList","BaseControl","Button","FlexBlock","FlexItem","withFocusOutside","noop","DetectOutside","handleFocusOutside","event","props","onFocusOutside","render","children","ComboboxControl","__next36pxDefaultSize","value","label","options","onChange","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","currentOption","find","option","currentLabel","instanceId","selectedSuggestion","setSelectedSuggestion","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","matchingSuggestions","startsWithMatch","containsMatch","match","toLocaleLowerCase","forEach","index","indexOf","push","concat","onSuggestionSelected","newSelectedSuggestion","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","code","onBlur","onFocus","onInputChange","text","handleOnReset","current","focus","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","suggestion"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\n\nconst noop = () => {};\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component {\n\t\thandleFocusOutside( event ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nfunction ComboboxControl( {\n\t__next36pxDefaultSize,\n\tvalue,\n\tlabel,\n\toptions,\n\tonChange,\n\tonFilterValueChange = noop,\n\thideLabelFromVision,\n\thelp,\n\tallowReset = true,\n\tclassName,\n\tmessages = {\n\t\tselected: __( 'Item selected.' ),\n\t},\n} ) {\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef();\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch = [];\n\t\tconst containsMatch = [];\n\t\tconst match = removeAccents( inputValue.toLocaleLowerCase() );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = removeAccents( option.label )\n\t\t\t\t.toLocaleLowerCase()\n\t\t\t\t.indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options, value ] );\n\n\tconst onSuggestionSelected = ( newSelectedSuggestion ) => {\n\t\tonChange( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = matchingSuggestions.indexOf( selectedSuggestion );\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown = ( event ) => {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.code ) {\n\t\t\tcase 'Enter':\n\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tsetIsExpanded( false );\n\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tsetIsExpanded( true );\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tonChange( null );\n\t\tinputContainer.current.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tmatchingSuggestions.indexOf( selectedSuggestion ) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t  )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-combobox-control'\n\t\t\t\t) }\n\t\t\t\ttabIndex=\"-1\"\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\n\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<InputWrapperFlex\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\tcurrentLabel\n\t\t\t\t\t\t\t\t\t\t? `${ currentLabel }, ${ label }`\n\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\tmatch={ { label: inputValue } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"]}

package/build-module/combobox-control/styles.js

@@ -0,0 +1,27 @@
+import _styled from "@emotion/styled/base";
+
+/**
+ * External dependencies
+ */
+import { css } from '@emotion/react';
+/**
+ * Internal dependencies
+ */
+
+import { Flex } from '../flex';
+import { space } from '../ui/utils/space';
+
+const deprecatedDefaultSize = _ref => {
+  let {
+    __next36pxDefaultSize
+  } = _ref;
+  return !__next36pxDefaultSize && /*#__PURE__*/css("height:28px;padding-left:", space(1), ";padding-right:", space(1), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:deprecatedDefaultSize;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY29tYm9ib3gtY29udHJvbC9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY0kiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9jb21ib2JveC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uL2ZsZXgnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91aS91dGlscy9zcGFjZSc7XG5cbmNvbnN0IGRlcHJlY2F0ZWREZWZhdWx0U2l6ZSA9ICggeyBfX25leHQzNnB4RGVmYXVsdFNpemUgfSApID0+XG5cdCEgX19uZXh0MzZweERlZmF1bHRTaXplICYmXG5cdGNzc2Bcblx0XHRoZWlnaHQ6IDI4cHg7IC8vIDMwcHggLSAycHggdmVydGljYWwgYm9yZGVycyBvbiBwYXJlbnQgY29udGFpbmVyXG5cdFx0cGFkZGluZy1sZWZ0OiAkeyBzcGFjZSggMSApIH07XG5cdFx0cGFkZGluZy1yaWdodDogJHsgc3BhY2UoIDEgKSB9O1xuXHRgO1xuXG5leHBvcnQgY29uc3QgSW5wdXRXcmFwcGVyRmxleCA9IHN0eWxlZCggRmxleCApYFxuXHRoZWlnaHQ6IDM0cHg7IC8vIDM2cHggLSAycHggdmVydGljYWwgYm9yZGVycyBvbiBwYXJlbnQgY29udGFpbmVyXG5cdHBhZGRpbmctbGVmdDogJHsgc3BhY2UoIDIgKSB9O1xuXHRwYWRkaW5nLXJpZ2h0OiAkeyBzcGFjZSggMiApIH07XG5cblx0JHsgZGVwcmVjYXRlZERlZmF1bHRTaXplIH1cbmA7XG4iXX0= */");
+};
+
+export const InputWrapperFlex = /*#__PURE__*/_styled(Flex, process.env.NODE_ENV === "production" ? {
+  target: "evuatpg0"
+} : {
+  target: "evuatpg0",
+  label: "InputWrapperFlex"
+})("height:34px;padding-left:", space(2), ";padding-right:", space(2), ";", deprecatedDefaultSize, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY29tYm9ib3gtY29udHJvbC9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0I4QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2NvbWJvYm94LWNvbnRyb2wvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vZmxleCc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3VpL3V0aWxzL3NwYWNlJztcblxuY29uc3QgZGVwcmVjYXRlZERlZmF1bHRTaXplID0gKCB7IF9fbmV4dDM2cHhEZWZhdWx0U2l6ZSB9ICkgPT5cblx0ISBfX25leHQzNnB4RGVmYXVsdFNpemUgJiZcblx0Y3NzYFxuXHRcdGhlaWdodDogMjhweDsgLy8gMzBweCAtIDJweCB2ZXJ0aWNhbCBib3JkZXJzIG9uIHBhcmVudCBjb250YWluZXJcblx0XHRwYWRkaW5nLWxlZnQ6ICR7IHNwYWNlKCAxICkgfTtcblx0XHRwYWRkaW5nLXJpZ2h0OiAkeyBzcGFjZSggMSApIH07XG5cdGA7XG5cbmV4cG9ydCBjb25zdCBJbnB1dFdyYXBwZXJGbGV4ID0gc3R5bGVkKCBGbGV4IClgXG5cdGhlaWdodDogMzRweDsgLy8gMzZweCAtIDJweCB2ZXJ0aWNhbCBib3JkZXJzIG9uIHBhcmVudCBjb250YWluZXJcblx0cGFkZGluZy1sZWZ0OiAkeyBzcGFjZSggMiApIH07XG5cdHBhZGRpbmctcmlnaHQ6ICR7IHNwYWNlKCAyICkgfTtcblxuXHQkeyBkZXByZWNhdGVkRGVmYXVsdFNpemUgfVxuYDtcbiJdfQ== */"));
+//# sourceMappingURL=styles.js.map

package/build-module/combobox-control/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/components/src/combobox-control/styles.ts"],"names":["css","Flex","space","deprecatedDefaultSize","__next36pxDefaultSize","InputWrapperFlex"],"mappings":";;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,KAAT,QAAsB,mBAAtB;;AAEA,MAAMC,qBAAqB,GAAG;AAAA,MAAE;AAAEC,IAAAA;AAAF,GAAF;AAAA,SAC7B,CAAEA,qBAAF,iBACAJ,GADA,8BAGkBE,KAAK,CAAE,CAAF,CAHvB,qBAImBA,KAAK,CAAE,CAAF,CAJxB,23CAD6B;AAAA,CAA9B;;AAQA,OAAO,MAAMG,gBAAgB,GAAG,qBAAQJ,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,8BAEXC,KAAK,CAAE,CAAF,CAFM,qBAGVA,KAAK,CAAE,CAAF,CAHK,OAKzBC,qBALyB,izCAAtB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { Flex } from '../flex';\nimport { space } from '../ui/utils/space';\n\nconst deprecatedDefaultSize = ( { __next36pxDefaultSize } ) =>\n\t! __next36pxDefaultSize &&\n\tcss`\n\t\theight: 28px; // 30px - 2px vertical borders on parent container\n\t\tpadding-left: ${ space( 1 ) };\n\t\tpadding-right: ${ space( 1 ) };\n\t`;\n\nexport const InputWrapperFlex = styled( Flex )`\n\theight: 34px; // 36px - 2px vertical borders on parent container\n\tpadding-left: ${ space( 2 ) };\n\tpadding-right: ${ space( 2 ) };\n\n\t${ deprecatedDefaultSize }\n`;\n"]}

package/build-module/custom-gradient-picker/index.js

@@ -1,13 +1,8 @@
 import { createElement } from "@wordpress/element";
 
-/**
- * External dependencies
- */
-import { get, omit } from 'lodash';
 /**
  * WordPress dependencies
  */
-
 import { __ } from '@wordpress/i18n';
 /**
  * Internal dependencies
@@ -23,12 +18,14 @@ import { DEFAULT_LINEAR_GRADIENT_ANGLE, HORIZONTAL_GRADIENT_ORIENTATION, GRADIEN
 import { AccessoryWrapper, SelectWrapper } from './styles/custom-gradient-picker-styles';
 
 const GradientAnglePicker = _ref => {
+  var _gradientAST$orientat, _gradientAST$orientat2;
+
   let {
     gradientAST,
     hasGradient,
     onChange
   } = _ref;
-  const angle = get(gradientAST, ['orientation', 'value'], DEFAULT_LINEAR_GRADIENT_ANGLE);
+  const angle = (_gradientAST$orientat = gradientAST === null || gradientAST === void 0 ? void 0 : (_gradientAST$orientat2 = gradientAST.orientation) === null || _gradientAST$orientat2 === void 0 ? void 0 : _gradientAST$orientat2.value) !== null && _gradientAST$orientat !== void 0 ? _gradientAST$orientat : DEFAULT_LINEAR_GRADIENT_ANGLE;
 
   const onAngleChange = newAngle => {
     onChange(serializeGradient({ ...gradientAST,
@@ -66,7 +63,11 @@ const GradientTypePicker = _ref2 => {
   };
 
   const onSetRadialGradient = () => {
-    onChange(serializeGradient({ ...omit(gradientAST, ['orientation']),
+    const {
+      orientation,
+      ...restGradientAST
+    } = gradientAST;
+    onChange(serializeGradient({ ...restGradientAST,
       type: 'radial-gradient'
     }));
   };

package/build-module/custom-gradient-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/index.js"],"names":["get","omit","__","AnglePickerControl","CustomGradientBar","Flex","SelectControl","getGradientAstWithDefault","getLinearGradientRepresentation","getGradientAstWithControlPoints","getStopCssColor","serializeGradient","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","GRADIENT_OPTIONS","DEFAULT_GRADIENT","AccessoryWrapper","SelectWrapper","GradientAnglePicker","gradientAST","hasGradient","onChange","angle","onAngleChange","newAngle","orientation","type","value","GradientTypePicker","onSetLinearGradient","onSetRadialGradient","handleOnChange","next","CustomGradientPicker","__experimentalIsRenderedInSidebar","background","controlPoints","colorStops","map","colorStop","color","position","parseInt","length","newControlPoints"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { get, omit } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport AnglePickerControl from '../angle-picker-control';\nimport CustomGradientBar from '../custom-gradient-bar';\nimport { Flex } from '../flex';\nimport SelectControl from '../select-control';\nimport {\n\tgetGradientAstWithDefault,\n\tgetLinearGradientRepresentation,\n\tgetGradientAstWithControlPoints,\n\tgetStopCssColor,\n} from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tGRADIENT_OPTIONS,\n\tDEFAULT_GRADIENT,\n} from './constants';\nimport {\n\tAccessoryWrapper,\n\tSelectWrapper,\n} from './styles/custom-gradient-picker-styles';\n\nconst GradientAnglePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst angle = get(\n\t\tgradientAST,\n\t\t[ 'orientation', 'value' ],\n\t\tDEFAULT_LINEAR_GRADIENT_ANGLE\n\t);\n\tconst onAngleChange = ( newAngle ) => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: {\n\t\t\t\t\ttype: 'angular',\n\t\t\t\t\tvalue: newAngle,\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\treturn (\n\t\t<AnglePickerControl\n\t\t\tonChange={ onAngleChange }\n\t\t\tlabelPosition=\"top\"\n\t\t\tvalue={ hasGradient ? angle : '' }\n\t\t/>\n\t);\n};\n\nconst GradientTypePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst { type } = gradientAST;\n\tconst onSetLinearGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t? {}\n\t\t\t\t\t: { orientation: HORIZONTAL_GRADIENT_ORIENTATION } ),\n\t\t\t\ttype: 'linear-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst onSetRadialGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...omit( gradientAST, [ 'orientation' ] ),\n\t\t\t\ttype: 'radial-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst handleOnChange = ( next ) => {\n\t\tif ( next === 'linear-gradient' ) {\n\t\t\tonSetLinearGradient();\n\t\t}\n\t\tif ( next === 'radial-gradient' ) {\n\t\t\tonSetRadialGradient();\n\t\t}\n\t};\n\n\treturn (\n\t\t<SelectControl\n\t\t\tclassName=\"components-custom-gradient-picker__type-picker\"\n\t\t\tlabel={ __( 'Type' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\tonChange={ handleOnChange }\n\t\t\toptions={ GRADIENT_OPTIONS }\n\t\t\tsize=\"__unstable-large\"\n\t\t\tvalue={ hasGradient && type }\n\t\t/>\n\t);\n};\n\nexport default function CustomGradientPicker( {\n\tvalue,\n\tonChange,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst gradientAST = getGradientAstWithDefault( value );\n\t// On radial gradients the bar should display a linear gradient.\n\t// On radial gradients the bar represents a slice of the gradient from the center until the outside.\n\t// On liner gradients the bar represents the color stops from left to right independently of the angle.\n\tconst background = getLinearGradientRepresentation( gradientAST );\n\tconst hasGradient = gradientAST.value !== DEFAULT_GRADIENT;\n\t// Control points color option may be hex from presets, custom colors will be rgb.\n\t// The position should always be a percentage.\n\tconst controlPoints = gradientAST.colorStops.map( ( colorStop ) => ( {\n\t\tcolor: getStopCssColor( colorStop ),\n\t\tposition: parseInt( colorStop.length.value ),\n\t} ) );\n\n\treturn (\n\t\t<div className=\"components-custom-gradient-picker\">\n\t\t\t<CustomGradientBar\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tbackground={ background }\n\t\t\t\thasGradient={ hasGradient }\n\t\t\t\tvalue={ controlPoints }\n\t\t\t\tonChange={ ( newControlPoints ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tserializeGradient(\n\t\t\t\t\t\t\tgetGradientAstWithControlPoints(\n\t\t\t\t\t\t\t\tgradientAST,\n\t\t\t\t\t\t\t\tnewControlPoints\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Flex\n\t\t\t\tgap={ 3 }\n\t\t\t\tclassName=\"components-custom-gradient-picker__ui-line\"\n\t\t\t>\n\t\t\t\t<SelectWrapper>\n\t\t\t\t\t<GradientTypePicker\n\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</SelectWrapper>\n\t\t\t\t<AccessoryWrapper>\n\t\t\t\t\t{ gradientAST.type === 'linear-gradient' && (\n\t\t\t\t\t\t<GradientAnglePicker\n\t\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</AccessoryWrapper>\n\t\t\t</Flex>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/index.js"],"names":["__","AnglePickerControl","CustomGradientBar","Flex","SelectControl","getGradientAstWithDefault","getLinearGradientRepresentation","getGradientAstWithControlPoints","getStopCssColor","serializeGradient","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","GRADIENT_OPTIONS","DEFAULT_GRADIENT","AccessoryWrapper","SelectWrapper","GradientAnglePicker","gradientAST","hasGradient","onChange","angle","orientation","value","onAngleChange","newAngle","type","GradientTypePicker","onSetLinearGradient","onSetRadialGradient","restGradientAST","handleOnChange","next","CustomGradientPicker","__experimentalIsRenderedInSidebar","background","controlPoints","colorStops","map","colorStop","color","position","parseInt","length","newControlPoints"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport AnglePickerControl from '../angle-picker-control';\nimport CustomGradientBar from '../custom-gradient-bar';\nimport { Flex } from '../flex';\nimport SelectControl from '../select-control';\nimport {\n\tgetGradientAstWithDefault,\n\tgetLinearGradientRepresentation,\n\tgetGradientAstWithControlPoints,\n\tgetStopCssColor,\n} from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tGRADIENT_OPTIONS,\n\tDEFAULT_GRADIENT,\n} from './constants';\nimport {\n\tAccessoryWrapper,\n\tSelectWrapper,\n} from './styles/custom-gradient-picker-styles';\n\nconst GradientAnglePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst angle =\n\t\tgradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\tconst onAngleChange = ( newAngle ) => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: {\n\t\t\t\t\ttype: 'angular',\n\t\t\t\t\tvalue: newAngle,\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\treturn (\n\t\t<AnglePickerControl\n\t\t\tonChange={ onAngleChange }\n\t\t\tlabelPosition=\"top\"\n\t\t\tvalue={ hasGradient ? angle : '' }\n\t\t/>\n\t);\n};\n\nconst GradientTypePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst { type } = gradientAST;\n\tconst onSetLinearGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t? {}\n\t\t\t\t\t: { orientation: HORIZONTAL_GRADIENT_ORIENTATION } ),\n\t\t\t\ttype: 'linear-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst onSetRadialGradient = () => {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...restGradientAST,\n\t\t\t\ttype: 'radial-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst handleOnChange = ( next ) => {\n\t\tif ( next === 'linear-gradient' ) {\n\t\t\tonSetLinearGradient();\n\t\t}\n\t\tif ( next === 'radial-gradient' ) {\n\t\t\tonSetRadialGradient();\n\t\t}\n\t};\n\n\treturn (\n\t\t<SelectControl\n\t\t\tclassName=\"components-custom-gradient-picker__type-picker\"\n\t\t\tlabel={ __( 'Type' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\tonChange={ handleOnChange }\n\t\t\toptions={ GRADIENT_OPTIONS }\n\t\t\tsize=\"__unstable-large\"\n\t\t\tvalue={ hasGradient && type }\n\t\t/>\n\t);\n};\n\nexport default function CustomGradientPicker( {\n\tvalue,\n\tonChange,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst gradientAST = getGradientAstWithDefault( value );\n\t// On radial gradients the bar should display a linear gradient.\n\t// On radial gradients the bar represents a slice of the gradient from the center until the outside.\n\t// On liner gradients the bar represents the color stops from left to right independently of the angle.\n\tconst background = getLinearGradientRepresentation( gradientAST );\n\tconst hasGradient = gradientAST.value !== DEFAULT_GRADIENT;\n\t// Control points color option may be hex from presets, custom colors will be rgb.\n\t// The position should always be a percentage.\n\tconst controlPoints = gradientAST.colorStops.map( ( colorStop ) => ( {\n\t\tcolor: getStopCssColor( colorStop ),\n\t\tposition: parseInt( colorStop.length.value ),\n\t} ) );\n\n\treturn (\n\t\t<div className=\"components-custom-gradient-picker\">\n\t\t\t<CustomGradientBar\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tbackground={ background }\n\t\t\t\thasGradient={ hasGradient }\n\t\t\t\tvalue={ controlPoints }\n\t\t\t\tonChange={ ( newControlPoints ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tserializeGradient(\n\t\t\t\t\t\t\tgetGradientAstWithControlPoints(\n\t\t\t\t\t\t\t\tgradientAST,\n\t\t\t\t\t\t\t\tnewControlPoints\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Flex\n\t\t\t\tgap={ 3 }\n\t\t\t\tclassName=\"components-custom-gradient-picker__ui-line\"\n\t\t\t>\n\t\t\t\t<SelectWrapper>\n\t\t\t\t\t<GradientTypePicker\n\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</SelectWrapper>\n\t\t\t\t<AccessoryWrapper>\n\t\t\t\t\t{ gradientAST.type === 'linear-gradient' && (\n\t\t\t\t\t\t<GradientAnglePicker\n\t\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</AccessoryWrapper>\n\t\t\t</Flex>\n\t\t</div>\n\t);\n}\n"]}

package/build-module/custom-gradient-picker/index.native.js

@@ -1,13 +1,8 @@
 import { createElement, Fragment } from "@wordpress/element";
 
-/**
- * External dependencies
- */
-import { get, omit } from 'lodash';
 /**
  * WordPress dependencies
  */
-
 import { PanelBody, RadioControl, RangeControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useState } from '@wordpress/element';
@@ -42,7 +37,10 @@ function CustomGradientPicker(_ref) {
   }
 
   function getGradientColor(type) {
-    const orientation = get(gradientAST, ['orientation']);
+    const {
+      orientation,
+      ...restGradientAST
+    } = gradientAST;
 
     if (orientation) {
       setGradientOrientation(orientation);
@@ -53,7 +51,7 @@ function CustomGradientPicker(_ref) {
         orientation: gradientOrientation
       }),
       type
-    } : { ...omit(gradientAST, ['orientation']),
+    } : { ...restGradientAST,
       type
     });
   }
@@ -79,7 +77,9 @@ function CustomGradientPicker(_ref) {
   }
 
   function getGradientAngle() {
-    return get(gradientAST, ['orientation', 'value'], DEFAULT_LINEAR_GRADIENT_ANGLE);
+    var _gradientAST$orientat, _gradientAST$orientat2;
+
+    return (_gradientAST$orientat = gradientAST === null || gradientAST === void 0 ? void 0 : (_gradientAST$orientat2 = gradientAST.orientation) === null || _gradientAST$orientat2 === void 0 ? void 0 : _gradientAST$orientat2.value) !== null && _gradientAST$orientat !== void 0 ? _gradientAST$orientat : DEFAULT_LINEAR_GRADIENT_ANGLE;
   }
 
   return createElement(Fragment, null, createElement(PanelBody, {

package/build-module/custom-gradient-picker/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/index.native.js"],"names":["get","omit","PanelBody","RadioControl","RangeControl","__","useState","colorsUtils","getGradientAstWithDefault","serializeGradient","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","styles","CustomGradientPicker","setColor","currentValue","isGradientColor","gradientOrientation","setGradientOrientation","currentColor","setCurrentColor","getGradientType","gradients","gradientOptions","gradientAST","gradientType","isLinearGradient","type","linear","getGradientColor","orientation","onGradientTypeChange","gradientColor","setGradientAngle","value","getGradientAngle","angleControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { get, omit } from 'lodash';\n/**\n * WordPress dependencies\n */\nimport { PanelBody, RadioControl, RangeControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { colorsUtils } from '../mobile/color-settings/utils';\nimport { getGradientAstWithDefault } from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n} from './constants';\nimport styles from './style.scss';\n\nfunction CustomGradientPicker( { setColor, currentValue, isGradientColor } ) {\n\tconst [ gradientOrientation, setGradientOrientation ] = useState(\n\t\tHORIZONTAL_GRADIENT_ORIENTATION\n\t);\n\n\tconst [ currentColor, setCurrentColor ] = useState( currentValue );\n\n\tconst { getGradientType, gradients, gradientOptions } = colorsUtils;\n\tconst gradientAST = getGradientAstWithDefault( currentColor );\n\tconst gradientType = getGradientType( currentColor );\n\n\tfunction isLinearGradient( type ) {\n\t\treturn type === gradients.linear;\n\t}\n\n\tfunction getGradientColor( type ) {\n\t\tconst orientation = get( gradientAST, [ 'orientation' ] );\n\n\t\tif ( orientation ) {\n\t\t\tsetGradientOrientation( orientation );\n\t\t}\n\n\t\treturn serializeGradient(\n\t\t\tisLinearGradient( type )\n\t\t\t\t? {\n\t\t\t\t\t\t...gradientAST,\n\t\t\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t\t\t? {}\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\torientation: gradientOrientation,\n\t\t\t\t\t\t\t  } ),\n\t\t\t\t\t\ttype,\n\t\t\t\t  }\n\t\t\t\t: {\n\t\t\t\t\t\t...omit( gradientAST, [ 'orientation' ] ),\n\t\t\t\t\t\ttype,\n\t\t\t\t  }\n\t\t);\n\t}\n\n\tfunction onGradientTypeChange( type ) {\n\t\tconst gradientColor = getGradientColor( type );\n\t\tsetCurrentColor( gradientColor );\n\t\tsetColor( gradientColor );\n\t}\n\n\tfunction setGradientAngle( value ) {\n\t\tconst gradientColor = serializeGradient( {\n\t\t\t...gradientAST,\n\t\t\torientation: {\n\t\t\t\ttype: 'angular',\n\t\t\t\tvalue,\n\t\t\t},\n\t\t} );\n\n\t\tif ( isGradientColor && gradientColor !== currentColor ) {\n\t\t\tsetCurrentColor( gradientColor );\n\t\t\tsetColor( gradientColor );\n\t\t}\n\t}\n\n\tfunction getGradientAngle() {\n\t\treturn get(\n\t\t\tgradientAST,\n\t\t\t[ 'orientation', 'value' ],\n\t\t\tDEFAULT_LINEAR_GRADIENT_ANGLE\n\t\t);\n\t}\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ __( 'Gradient Type' ) }>\n\t\t\t\t<RadioControl\n\t\t\t\t\tselected={ gradientType }\n\t\t\t\t\toptions={ gradientOptions }\n\t\t\t\t\tonChange={ onGradientTypeChange }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t\t{ isLinearGradient( gradientType ) && (\n\t\t\t\t<PanelBody style={ styles.angleControl }>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Angle' ) }\n\t\t\t\t\t\tminimumValue={ 0 }\n\t\t\t\t\t\tmaximumValue={ 360 }\n\t\t\t\t\t\tvalue={ getGradientAngle() }\n\t\t\t\t\t\tonChange={ setGradientAngle }\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default CustomGradientPicker;\n"]}
+{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/index.native.js"],"names":["PanelBody","RadioControl","RangeControl","__","useState","colorsUtils","getGradientAstWithDefault","serializeGradient","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","styles","CustomGradientPicker","setColor","currentValue","isGradientColor","gradientOrientation","setGradientOrientation","currentColor","setCurrentColor","getGradientType","gradients","gradientOptions","gradientAST","gradientType","isLinearGradient","type","linear","getGradientColor","orientation","restGradientAST","onGradientTypeChange","gradientColor","setGradientAngle","value","getGradientAngle","angleControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { PanelBody, RadioControl, RangeControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { colorsUtils } from '../mobile/color-settings/utils';\nimport { getGradientAstWithDefault } from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n} from './constants';\nimport styles from './style.scss';\n\nfunction CustomGradientPicker( { setColor, currentValue, isGradientColor } ) {\n\tconst [ gradientOrientation, setGradientOrientation ] = useState(\n\t\tHORIZONTAL_GRADIENT_ORIENTATION\n\t);\n\n\tconst [ currentColor, setCurrentColor ] = useState( currentValue );\n\n\tconst { getGradientType, gradients, gradientOptions } = colorsUtils;\n\tconst gradientAST = getGradientAstWithDefault( currentColor );\n\tconst gradientType = getGradientType( currentColor );\n\n\tfunction isLinearGradient( type ) {\n\t\treturn type === gradients.linear;\n\t}\n\n\tfunction getGradientColor( type ) {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\n\t\tif ( orientation ) {\n\t\t\tsetGradientOrientation( orientation );\n\t\t}\n\n\t\treturn serializeGradient(\n\t\t\tisLinearGradient( type )\n\t\t\t\t? {\n\t\t\t\t\t\t...gradientAST,\n\t\t\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t\t\t? {}\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\torientation: gradientOrientation,\n\t\t\t\t\t\t\t  } ),\n\t\t\t\t\t\ttype,\n\t\t\t\t  }\n\t\t\t\t: {\n\t\t\t\t\t\t...restGradientAST,\n\t\t\t\t\t\ttype,\n\t\t\t\t  }\n\t\t);\n\t}\n\n\tfunction onGradientTypeChange( type ) {\n\t\tconst gradientColor = getGradientColor( type );\n\t\tsetCurrentColor( gradientColor );\n\t\tsetColor( gradientColor );\n\t}\n\n\tfunction setGradientAngle( value ) {\n\t\tconst gradientColor = serializeGradient( {\n\t\t\t...gradientAST,\n\t\t\torientation: {\n\t\t\t\ttype: 'angular',\n\t\t\t\tvalue,\n\t\t\t},\n\t\t} );\n\n\t\tif ( isGradientColor && gradientColor !== currentColor ) {\n\t\t\tsetCurrentColor( gradientColor );\n\t\t\tsetColor( gradientColor );\n\t\t}\n\t}\n\n\tfunction getGradientAngle() {\n\t\treturn gradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ __( 'Gradient Type' ) }>\n\t\t\t\t<RadioControl\n\t\t\t\t\tselected={ gradientType }\n\t\t\t\t\toptions={ gradientOptions }\n\t\t\t\t\tonChange={ onGradientTypeChange }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t\t{ isLinearGradient( gradientType ) && (\n\t\t\t\t<PanelBody style={ styles.angleControl }>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Angle' ) }\n\t\t\t\t\t\tminimumValue={ 0 }\n\t\t\t\t\t\tmaximumValue={ 360 }\n\t\t\t\t\t\tvalue={ getGradientAngle() }\n\t\t\t\t\t\tonChange={ setGradientAngle }\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default CustomGradientPicker;\n"]}

package/build-module/custom-gradient-picker/serializer.js

@@ -1,7 +1,3 @@
-/**
- * External dependencies
- */
-import { compact, get } from 'lodash';
 export function serializeGradientColor(_ref) {
   let {
     type,
@@ -55,8 +51,10 @@ export function serializeGradient(_ref3) {
   } = _ref3;
   const serializedOrientation = serializeGradientOrientation(orientation);
   const serializedColorStops = colorStops.sort((colorStop1, colorStop2) => {
-    return get(colorStop1, ['length', 'value'], 0) - get(colorStop2, ['length', 'value'], 0);
+    var _colorStop1$length$va, _colorStop1$length, _colorStop2$length$va, _colorStop2$length;
+
+    return ((_colorStop1$length$va = colorStop1 === null || colorStop1 === void 0 ? void 0 : (_colorStop1$length = colorStop1.length) === null || _colorStop1$length === void 0 ? void 0 : _colorStop1$length.value) !== null && _colorStop1$length$va !== void 0 ? _colorStop1$length$va : 0) - ((_colorStop2$length$va = colorStop2 === null || colorStop2 === void 0 ? void 0 : (_colorStop2$length = colorStop2.length) === null || _colorStop2$length === void 0 ? void 0 : _colorStop2$length.value) !== null && _colorStop2$length$va !== void 0 ? _colorStop2$length$va : 0);
   }).map(serializeGradientColorStop);
-  return `${type}(${compact([serializedOrientation, ...serializedColorStops]).join(',')})`;
+  return `${type}(${[serializedOrientation, ...serializedColorStops].filter(Boolean).join(',')})`;
 }
 //# sourceMappingURL=serializer.js.map

package/build-module/custom-gradient-picker/serializer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/serializer.js"],"names":["compact","get","serializeGradientColor","type","value","join","serializeGradientPosition","position","serializeGradientColorStop","length","serializeGradientOrientation","orientation","serializeGradient","colorStops","serializedOrientation","serializedColorStops","sort","colorStop1","colorStop2","map"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,GAAlB,QAA6B,QAA7B;AAEA,OAAO,SAASC,sBAAT,OAAmD;AAAA,MAAlB;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAkB;;AACzD,MAAKD,IAAI,KAAK,SAAd,EAA0B;AACzB,WAAOC,KAAP;AACA;;AACD,MAAKD,IAAI,KAAK,KAAd,EAAsB;AACrB,WAAQ,IAAIC,KAAO,EAAnB;AACA;;AACD,SAAQ,GAAGD,IAAM,IAAIC,KAAK,CAACC,IAAN,CAAY,GAAZ,CAAmB,GAAxC;AACA;AAED,OAAO,SAASC,yBAAT,CAAoCC,QAApC,EAA+C;AACrD,MAAK,CAAEA,QAAP,EAAkB;AACjB,WAAO,EAAP;AACA;;AACD,QAAM;AAAEH,IAAAA,KAAF;AAASD,IAAAA;AAAT,MAAkBI,QAAxB;AACA,SAAQ,GAAGH,KAAO,GAAGD,IAAM,EAA3B;AACA;AAED,OAAO,SAASK,0BAAT,QAA+D;AAAA,MAA1B;AAAEL,IAAAA,IAAF;AAAQC,IAAAA,KAAR;AAAeK,IAAAA;AAAf,GAA0B;AACrE,SAAQ,GAAGP,sBAAsB,CAAE;AAClCC,IAAAA,IADkC;AAElCC,IAAAA;AAFkC,GAAF,CAG5B,IAAIE,yBAAyB,CAAEG,MAAF,CAAY,EAH9C;AAIA;AAED,OAAO,SAASC,4BAAT,CAAuCC,WAAvC,EAAqD;AAC3D,MAAK,CAAEA,WAAF,IAAiBA,WAAW,CAACR,IAAZ,KAAqB,SAA3C,EAAuD;AACtD;AACA;;AACD,SAAQ,GAAGQ,WAAW,CAACP,KAAO,KAA9B;AACA;AAED,OAAO,SAASQ,iBAAT,QAAgE;AAAA,MAApC;AAAET,IAAAA,IAAF;AAAQQ,IAAAA,WAAR;AAAqBE,IAAAA;AAArB,GAAoC;AACtE,QAAMC,qBAAqB,GAAGJ,4BAA4B,CAAEC,WAAF,CAA1D;AACA,QAAMI,oBAAoB,GAAGF,UAAU,CACrCG,IAD2B,CACrB,CAAEC,UAAF,EAAcC,UAAd,KAA8B;AACpC,WACCjB,GAAG,CAAEgB,UAAF,EAAc,CAAE,QAAF,EAAY,OAAZ,CAAd,EAAqC,CAArC,CAAH,GACAhB,GAAG,CAAEiB,UAAF,EAAc,CAAE,QAAF,EAAY,OAAZ,CAAd,EAAqC,CAArC,CAFJ;AAIA,GAN2B,EAO3BC,GAP2B,CAOtBX,0BAPsB,CAA7B;AAQA,SAAQ,GAAGL,IAAM,IAAIH,OAAO,CAAE,CAC7Bc,qBAD6B,EAE7B,GAAGC,oBAF0B,CAAF,CAAP,CAGjBV,IAHiB,CAGX,GAHW,CAGJ,GAHjB;AAIA","sourcesContent":["/**\n * External dependencies\n */\nimport { compact, get } from 'lodash';\n\nexport function serializeGradientColor( { type, value } ) {\n\tif ( type === 'literal' ) {\n\t\treturn value;\n\t}\n\tif ( type === 'hex' ) {\n\t\treturn `#${ value }`;\n\t}\n\treturn `${ type }(${ value.join( ',' ) })`;\n}\n\nexport function serializeGradientPosition( position ) {\n\tif ( ! position ) {\n\t\treturn '';\n\t}\n\tconst { value, type } = position;\n\treturn `${ value }${ type }`;\n}\n\nexport function serializeGradientColorStop( { type, value, length } ) {\n\treturn `${ serializeGradientColor( {\n\t\ttype,\n\t\tvalue,\n\t} ) } ${ serializeGradientPosition( length ) }`;\n}\n\nexport function serializeGradientOrientation( orientation ) {\n\tif ( ! orientation || orientation.type !== 'angular' ) {\n\t\treturn;\n\t}\n\treturn `${ orientation.value }deg`;\n}\n\nexport function serializeGradient( { type, orientation, colorStops } ) {\n\tconst serializedOrientation = serializeGradientOrientation( orientation );\n\tconst serializedColorStops = colorStops\n\t\t.sort( ( colorStop1, colorStop2 ) => {\n\t\t\treturn (\n\t\t\t\tget( colorStop1, [ 'length', 'value' ], 0 ) -\n\t\t\t\tget( colorStop2, [ 'length', 'value' ], 0 )\n\t\t\t);\n\t\t} )\n\t\t.map( serializeGradientColorStop );\n\treturn `${ type }(${ compact( [\n\t\tserializedOrientation,\n\t\t...serializedColorStops,\n\t] ).join( ',' ) })`;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/serializer.js"],"names":["serializeGradientColor","type","value","join","serializeGradientPosition","position","serializeGradientColorStop","length","serializeGradientOrientation","orientation","serializeGradient","colorStops","serializedOrientation","serializedColorStops","sort","colorStop1","colorStop2","map","filter","Boolean"],"mappings":"AAAA,OAAO,SAASA,sBAAT,OAAmD;AAAA,MAAlB;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAkB;;AACzD,MAAKD,IAAI,KAAK,SAAd,EAA0B;AACzB,WAAOC,KAAP;AACA;;AACD,MAAKD,IAAI,KAAK,KAAd,EAAsB;AACrB,WAAQ,IAAIC,KAAO,EAAnB;AACA;;AACD,SAAQ,GAAGD,IAAM,IAAIC,KAAK,CAACC,IAAN,CAAY,GAAZ,CAAmB,GAAxC;AACA;AAED,OAAO,SAASC,yBAAT,CAAoCC,QAApC,EAA+C;AACrD,MAAK,CAAEA,QAAP,EAAkB;AACjB,WAAO,EAAP;AACA;;AACD,QAAM;AAAEH,IAAAA,KAAF;AAASD,IAAAA;AAAT,MAAkBI,QAAxB;AACA,SAAQ,GAAGH,KAAO,GAAGD,IAAM,EAA3B;AACA;AAED,OAAO,SAASK,0BAAT,QAA+D;AAAA,MAA1B;AAAEL,IAAAA,IAAF;AAAQC,IAAAA,KAAR;AAAeK,IAAAA;AAAf,GAA0B;AACrE,SAAQ,GAAGP,sBAAsB,CAAE;AAClCC,IAAAA,IADkC;AAElCC,IAAAA;AAFkC,GAAF,CAG5B,IAAIE,yBAAyB,CAAEG,MAAF,CAAY,EAH9C;AAIA;AAED,OAAO,SAASC,4BAAT,CAAuCC,WAAvC,EAAqD;AAC3D,MAAK,CAAEA,WAAF,IAAiBA,WAAW,CAACR,IAAZ,KAAqB,SAA3C,EAAuD;AACtD;AACA;;AACD,SAAQ,GAAGQ,WAAW,CAACP,KAAO,KAA9B;AACA;AAED,OAAO,SAASQ,iBAAT,QAAgE;AAAA,MAApC;AAAET,IAAAA,IAAF;AAAQQ,IAAAA,WAAR;AAAqBE,IAAAA;AAArB,GAAoC;AACtE,QAAMC,qBAAqB,GAAGJ,4BAA4B,CAAEC,WAAF,CAA1D;AACA,QAAMI,oBAAoB,GAAGF,UAAU,CACrCG,IAD2B,CACrB,CAAEC,UAAF,EAAcC,UAAd,KAA8B;AAAA;;AACpC,WACC,0BAAED,UAAF,aAAEA,UAAF,6CAAEA,UAAU,CAAER,MAAd,uDAAE,mBAAoBL,KAAtB,yEAA+B,CAA/B,8BACEc,UADF,aACEA,UADF,6CACEA,UAAU,CAAET,MADd,uDACE,mBAAoBL,KADtB,yEAC+B,CAD/B,CADD;AAIA,GAN2B,EAO3Be,GAP2B,CAOtBX,0BAPsB,CAA7B;AAQA,SAAQ,GAAGL,IAAM,IAAI,CAAEW,qBAAF,EAAyB,GAAGC,oBAA5B,EACnBK,MADmB,CACXC,OADW,EAEnBhB,IAFmB,CAEb,GAFa,CAEN,GAFf;AAGA","sourcesContent":["export function serializeGradientColor( { type, value } ) {\n\tif ( type === 'literal' ) {\n\t\treturn value;\n\t}\n\tif ( type === 'hex' ) {\n\t\treturn `#${ value }`;\n\t}\n\treturn `${ type }(${ value.join( ',' ) })`;\n}\n\nexport function serializeGradientPosition( position ) {\n\tif ( ! position ) {\n\t\treturn '';\n\t}\n\tconst { value, type } = position;\n\treturn `${ value }${ type }`;\n}\n\nexport function serializeGradientColorStop( { type, value, length } ) {\n\treturn `${ serializeGradientColor( {\n\t\ttype,\n\t\tvalue,\n\t} ) } ${ serializeGradientPosition( length ) }`;\n}\n\nexport function serializeGradientOrientation( orientation ) {\n\tif ( ! orientation || orientation.type !== 'angular' ) {\n\t\treturn;\n\t}\n\treturn `${ orientation.value }deg`;\n}\n\nexport function serializeGradient( { type, orientation, colorStops } ) {\n\tconst serializedOrientation = serializeGradientOrientation( orientation );\n\tconst serializedColorStops = colorStops\n\t\t.sort( ( colorStop1, colorStop2 ) => {\n\t\t\treturn (\n\t\t\t\t( colorStop1?.length?.value ?? 0 ) -\n\t\t\t\t( colorStop2?.length?.value ?? 0 )\n\t\t\t);\n\t\t} )\n\t\t.map( serializeGradientColorStop );\n\treturn `${ type }(${ [ serializedOrientation, ...serializedColorStops ]\n\t\t.filter( Boolean )\n\t\t.join( ',' ) })`;\n}\n"]}

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

@@ -12,12 +12,14 @@ import classnames from 'classnames';
 
 import { Icon, check, chevronDown } from '@wordpress/icons';
 import { __, sprintf } from '@wordpress/i18n';
-import { useCallback } from '@wordpress/element';
+import { useCallback, useState } from '@wordpress/element';
 /**
  * Internal dependencies
  */
 
-import { Button, VisuallyHidden } from '../';
+import { VisuallyHidden } from '../';
+import { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';
+import InputBase from '../input-control/input-base';
 
 const itemToString = item => item === null || item === void 0 ? void 0 : item.name; // This is needed so that in Windows, where
 // the menu does not necessarily open on
@@ -63,12 +65,18 @@ export default function CustomSelectControl(_ref3) {
   let {
     /** Start opting into the larger default height that will become the default size in a future version. */
     __next36pxDefaultSize = false,
+
+    /** Start opting into the unconstrained width that will become the default in a future version. */
+    __nextUnconstrainedWidth = false,
     className,
     hideLabelFromVision,
     label,
     describedBy,
     options: items,
     onChange: onSelectedItemChange,
+
+    /** @type {import('../select-control/types').SelectControlProps.size} */
+    size = 'default',
     value: _selectedItem
   } = _ref3;
   const {
@@ -89,6 +97,7 @@ export default function CustomSelectControl(_ref3) {
     } : undefined),
     stateReducer
   });
+  const [isFocused, setIsFocused] = useState(false);
 
   function getDescribedBy() {
     if (describedBy) {
@@ -126,22 +135,29 @@ export default function CustomSelectControl(_ref3) {
   /* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */
   createElement("label", getLabelProps({
     className: 'components-custom-select-control__label'
-  }), label), createElement(Button, getToggleButtonProps({
+  }), label), createElement(InputBase, {
+    isFocused: isOpen || isFocused,
+    __unstableInputWidth: __nextUnconstrainedWidth ? undefined : 'auto',
+    labelPosition: __nextUnconstrainedWidth ? undefined : 'top'
+  }, createElement(SelectControlSelect, _extends({
+    as: "button",
+    onFocus: () => setIsFocused(true),
+    onBlur: () => setIsFocused(false),
+    selectSize: size,
+    __next36pxDefaultSize: __next36pxDefaultSize
+  }, getToggleButtonProps({
     // This is needed because some speech recognition software don't support `aria-labelledby`.
     'aria-label': label,
     'aria-labelledby': undefined,
     className: classnames('components-custom-select-control__button', {
-      'is-next-36px-default-size': __next36pxDefaultSize
+      'is-next-unconstrained-width': __nextUnconstrainedWidth
     }),
-    isSmall: !__next36pxDefaultSize,
     describedBy: getDescribedBy()
-  }), itemToString(selectedItem), createElement(Icon, {
+  })), itemToString(selectedItem), createElement(Icon, {
     icon: chevronDown,
-    className: classnames('components-custom-select-control__button-icon', {
-      'is-next-36px-default-size': __next36pxDefaultSize
-    }),
+    className: "components-custom-select-control__button-icon",
     size: 18
-  })), createElement("ul", _extends({}, menuProps, {
+  }))), createElement("ul", _extends({}, menuProps, {
     onKeyDown: onKeyDownHandler
   }), isOpen && items.map((item, index) => // eslint-disable-next-line react/jsx-key
   createElement("li", getItemProps({