@wordpress/block-editor 12.2.0 → 12.3.0

package/build/components/colors/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors/utils.js"],"names":["namesPlugin","a11yPlugin","getColorObjectByAttributeValues","colors","definedColor","customColor","colorObj","find","color","slug","getColorObjectByColorValue","colorValue","getColorClassName","colorContextName","colorSlug","undefined","getMostReadableColor","colordColor","getColorContrast","contrast","maxContrast","Math","max","map"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AANA;AACA;AACA;AAMA,oBAAQ,CAAEA,cAAF,EAAeC,aAAf,CAAR;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,MAAMC,+BAA+B,GAAG,CAC9CC,MAD8C,EAE9CC,YAF8C,EAG9CC,WAH8C,KAI1C;AACJ,MAAKD,YAAL,EAAoB;AACnB,UAAME,QAAQ,GAAGH,MAAH,aAAGA,MAAH,uBAAGA,MAAM,CAAEI,IAAR,CACdC,KAAF,IAAaA,KAAK,CAACC,IAAN,KAAeL,YADZ,CAAjB;;AAIA,QAAKE,QAAL,EAAgB;AACf,aAAOA,QAAP;AACA;AACD;;AACD,SAAO;AACNE,IAAAA,KAAK,EAAEH;AADD,GAAP;AAGA,CAjBM;AAmBP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,MAAMK,0BAA0B,GAAG,CAAEP,MAAF,EAAUQ,UAAV,KAA0B;AACnE,SAAOR,MAAP,aAAOA,MAAP,uBAAOA,MAAM,CAAEI,IAAR,CAAgBC,KAAF,IAAaA,KAAK,CAACA,KAAN,KAAgBG,UAA3C,CAAP;AACA,CAFM;AAIP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,SAASC,iBAAT,CAA4BC,gBAA5B,EAA8CC,SAA9C,EAA0D;AAChE,MAAK,CAAED,gBAAF,IAAsB,CAAEC,SAA7B,EAAyC;AACxC,WAAOC,SAAP;AACA;;AAED,SAAQ,OAAO,uBAAWD,SAAX,CAAwB,IAAID,gBAAkB,EAA7D;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASG,oBAAT,CAA+Bb,MAA/B,EAAuCQ,UAAvC,EAAoD;AAC1D,QAAMM,WAAW,GAAG,oBAAQN,UAAR,CAApB;;AACA,QAAMO,gBAAgB,GAAG;AAAA,QAAE;AAAEV,MAAAA;AAAF,KAAF;AAAA,WAAiBS,WAAW,CAACE,QAAZ,CAAsBX,KAAtB,CAAjB;AAAA,GAAzB;;AAEA,QAAMY,WAAW,GAAGC,IAAI,CAACC,GAAL,CAAU,GAAGnB,MAAM,CAACoB,GAAP,CAAYL,gBAAZ,CAAb,CAApB;AACA,SAAOf,MAAM,CAACI,IAAP,CAAeC,KAAF,IAAaU,gBAAgB,CAAEV,KAAF,CAAhB,KAA8BY,WAAxD,EACLZ,KADF;AAEA","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\n/**\n * Provided an array of color objects as set by the theme or by the editor defaults,\n * and the values of the defined color or custom color returns a color object describing the color.\n *\n * @param {Array}   colors       Array of color objects as set by the theme or by the editor defaults.\n * @param {?string} definedColor A string containing the color slug.\n * @param {?string} customColor  A string containing the customColor value.\n *\n * @return {?Object} If definedColor is passed and the name is found in colors,\n *                   the color object exactly as set by the theme or editor defaults is returned.\n *                   Otherwise, an object that just sets the color is defined.\n */\nexport const getColorObjectByAttributeValues = (\n\tcolors,\n\tdefinedColor,\n\tcustomColor\n) => {\n\tif ( definedColor ) {\n\t\tconst colorObj = colors?.find(\n\t\t\t( color ) => color.slug === definedColor\n\t\t);\n\n\t\tif ( colorObj ) {\n\t\t\treturn colorObj;\n\t\t}\n\t}\n\treturn {\n\t\tcolor: customColor,\n\t};\n};\n\n/**\n * Provided an array of color objects as set by the theme or by the editor defaults, and a color value returns the color object matching that value or undefined.\n *\n * @param {Array}   colors     Array of color objects as set by the theme or by the editor defaults.\n * @param {?string} colorValue A string containing the color value.\n *\n * @return {?Object} Color object included in the colors array whose color property equals colorValue.\n *                   Returns undefined if no color object matches this requirement.\n */\nexport const getColorObjectByColorValue = ( colors, colorValue ) => {\n\treturn colors?.find( ( color ) => color.color === colorValue );\n};\n\n/**\n * Returns a class based on the context a color is being used and its slug.\n *\n * @param {string} colorContextName Context/place where color is being used e.g: background, text etc...\n * @param {string} colorSlug        Slug of the color.\n *\n * @return {?string} String with the class corresponding to the color in the provided context.\n *                   Returns undefined if either colorContextName or colorSlug are not provided.\n */\nexport function getColorClassName( colorContextName, colorSlug ) {\n\tif ( ! colorContextName || ! colorSlug ) {\n\t\treturn undefined;\n\t}\n\n\treturn `has-${ kebabCase( colorSlug ) }-${ colorContextName }`;\n}\n\n/**\n * Given an array of color objects and a color value returns the color value of the most readable color in the array.\n *\n * @param {Array}   colors     Array of color objects as set by the theme or by the editor defaults.\n * @param {?string} colorValue A string containing the color value.\n *\n * @return {string} String with the color value of the most readable color.\n */\nexport function getMostReadableColor( colors, colorValue ) {\n\tconst colordColor = colord( colorValue );\n\tconst getColorContrast = ( { color } ) => colordColor.contrast( color );\n\n\tconst maxContrast = Math.max( ...colors.map( getColorContrast ) );\n\treturn colors.find( ( color ) => getColorContrast( color ) === maxContrast )\n\t\t.color;\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors/utils.js"],"names":["namesPlugin","a11yPlugin","getColorObjectByAttributeValues","colors","definedColor","customColor","colorObj","find","color","slug","getColorObjectByColorValue","colorValue","getColorClassName","colorContextName","colorSlug","undefined","getMostReadableColor","colordColor","getColorContrast","contrast","maxContrast","Math","max","map"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AANA;AACA;AACA;AAMA,oBAAQ,CAAEA,cAAF,EAAeC,aAAf,CAAR;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,MAAMC,+BAA+B,GAAG,CAC9CC,MAD8C,EAE9CC,YAF8C,EAG9CC,WAH8C,KAI1C;AACJ,MAAKD,YAAL,EAAoB;AACnB,UAAME,QAAQ,GAAGH,MAAM,EAAEI,IAAR,CACdC,KAAF,IAAaA,KAAK,CAACC,IAAN,KAAeL,YADZ,CAAjB;;AAIA,QAAKE,QAAL,EAAgB;AACf,aAAOA,QAAP;AACA;AACD;;AACD,SAAO;AACNE,IAAAA,KAAK,EAAEH;AADD,GAAP;AAGA,CAjBM;AAmBP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,MAAMK,0BAA0B,GAAG,CAAEP,MAAF,EAAUQ,UAAV,KAA0B;AACnE,SAAOR,MAAM,EAAEI,IAAR,CAAgBC,KAAF,IAAaA,KAAK,CAACA,KAAN,KAAgBG,UAA3C,CAAP;AACA,CAFM;AAIP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,SAASC,iBAAT,CAA4BC,gBAA5B,EAA8CC,SAA9C,EAA0D;AAChE,MAAK,CAAED,gBAAF,IAAsB,CAAEC,SAA7B,EAAyC;AACxC,WAAOC,SAAP;AACA;;AAED,SAAQ,OAAO,uBAAWD,SAAX,CAAwB,IAAID,gBAAkB,EAA7D;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASG,oBAAT,CAA+Bb,MAA/B,EAAuCQ,UAAvC,EAAoD;AAC1D,QAAMM,WAAW,GAAG,oBAAQN,UAAR,CAApB;;AACA,QAAMO,gBAAgB,GAAG,CAAE;AAAEV,IAAAA;AAAF,GAAF,KAAiBS,WAAW,CAACE,QAAZ,CAAsBX,KAAtB,CAA1C;;AAEA,QAAMY,WAAW,GAAGC,IAAI,CAACC,GAAL,CAAU,GAAGnB,MAAM,CAACoB,GAAP,CAAYL,gBAAZ,CAAb,CAApB;AACA,SAAOf,MAAM,CAACI,IAAP,CAAeC,KAAF,IAAaU,gBAAgB,CAAEV,KAAF,CAAhB,KAA8BY,WAAxD,EACLZ,KADF;AAEA","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\n/**\n * Provided an array of color objects as set by the theme or by the editor defaults,\n * and the values of the defined color or custom color returns a color object describing the color.\n *\n * @param {Array}   colors       Array of color objects as set by the theme or by the editor defaults.\n * @param {?string} definedColor A string containing the color slug.\n * @param {?string} customColor  A string containing the customColor value.\n *\n * @return {?Object} If definedColor is passed and the name is found in colors,\n *                   the color object exactly as set by the theme or editor defaults is returned.\n *                   Otherwise, an object that just sets the color is defined.\n */\nexport const getColorObjectByAttributeValues = (\n\tcolors,\n\tdefinedColor,\n\tcustomColor\n) => {\n\tif ( definedColor ) {\n\t\tconst colorObj = colors?.find(\n\t\t\t( color ) => color.slug === definedColor\n\t\t);\n\n\t\tif ( colorObj ) {\n\t\t\treturn colorObj;\n\t\t}\n\t}\n\treturn {\n\t\tcolor: customColor,\n\t};\n};\n\n/**\n * Provided an array of color objects as set by the theme or by the editor defaults, and a color value returns the color object matching that value or undefined.\n *\n * @param {Array}   colors     Array of color objects as set by the theme or by the editor defaults.\n * @param {?string} colorValue A string containing the color value.\n *\n * @return {?Object} Color object included in the colors array whose color property equals colorValue.\n *                   Returns undefined if no color object matches this requirement.\n */\nexport const getColorObjectByColorValue = ( colors, colorValue ) => {\n\treturn colors?.find( ( color ) => color.color === colorValue );\n};\n\n/**\n * Returns a class based on the context a color is being used and its slug.\n *\n * @param {string} colorContextName Context/place where color is being used e.g: background, text etc...\n * @param {string} colorSlug        Slug of the color.\n *\n * @return {?string} String with the class corresponding to the color in the provided context.\n *                   Returns undefined if either colorContextName or colorSlug are not provided.\n */\nexport function getColorClassName( colorContextName, colorSlug ) {\n\tif ( ! colorContextName || ! colorSlug ) {\n\t\treturn undefined;\n\t}\n\n\treturn `has-${ kebabCase( colorSlug ) }-${ colorContextName }`;\n}\n\n/**\n * Given an array of color objects and a color value returns the color value of the most readable color in the array.\n *\n * @param {Array}   colors     Array of color objects as set by the theme or by the editor defaults.\n * @param {?string} colorValue A string containing the color value.\n *\n * @return {string} String with the color value of the most readable color.\n */\nexport function getMostReadableColor( colors, colorValue ) {\n\tconst colordColor = colord( colorValue );\n\tconst getColorContrast = ( { color } ) => colordColor.contrast( color );\n\n\tconst maxContrast = Math.max( ...colors.map( getColorContrast ) );\n\treturn colors.find( ( color ) => getColorContrast( color ) === maxContrast )\n\t\t.color;\n}\n"]}

package/build/components/colors/with-colors.js

@@ -39,10 +39,7 @@ var _useSetting = _interopRequireDefault(require("../use-setting"));
  *
  * @return {string} Capitalized string.
  */
-const upperFirst = _ref => {
-  let [firstLetter, ...rest] = _ref;
-  return firstLetter.toUpperCase() + rest.join('');
-};
+const upperFirst = ([firstLetter, ...rest]) => firstLetter.toUpperCase() + rest.join('');
 /**
  * Higher order component factory for injecting the `colorsArray` argument as
  * the colors prop in the `withCustomColors` HOC.
@@ -132,16 +129,14 @@ function createColorHOC(colorTypes, withColorPalette) {
         };
       }
 
-      static getDerivedStateFromProps(_ref2, previousState) {
-        let {
-          attributes,
-          colors
-        } = _ref2;
-        return Object.entries(colorMap).reduce((newState, _ref3) => {
-          let [colorAttributeName, colorContext] = _ref3;
+      static getDerivedStateFromProps({
+        attributes,
+        colors
+      }, previousState) {
+        return Object.entries(colorMap).reduce((newState, [colorAttributeName, colorContext]) => {
           const colorObject = (0, _utils.getColorObjectByAttributeValues)(colors, attributes[colorAttributeName], attributes[`custom${upperFirst(colorAttributeName)}`]);
           const previousColorObject = previousState[colorAttributeName];
-          const previousColor = previousColorObject === null || previousColorObject === void 0 ? void 0 : previousColorObject.color;
+          const previousColor = previousColorObject?.color;
           /**
            * The "and previousColorObject" condition checks that a previous color object was already computed.
            * At the start previousColorObject and colorValue are both equal to undefined
@@ -196,13 +191,8 @@ function createColorHOC(colorTypes, withColorPalette) {
 
 
 function createCustomColorsHOC(colorsArray) {
-  return function () {
+  return (...colorTypes) => {
     const withColorPalette = withCustomColorPalette(colorsArray);
-
-    for (var _len = arguments.length, colorTypes = new Array(_len), _key = 0; _key < _len; _key++) {
-      colorTypes[_key] = arguments[_key];
-    }
-
     return (0, _compose.createHigherOrderComponent)(createColorHOC(colorTypes, withColorPalette), 'withCustomColors');
   };
 }
@@ -232,13 +222,8 @@ function createCustomColorsHOC(colorsArray) {
  */
 
 
-function withColors() {
+function withColors(...colorTypes) {
   const withColorPalette = withEditorColorPalette();
-
-  for (var _len2 = arguments.length, colorTypes = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-    colorTypes[_key2] = arguments[_key2];
-  }
-
   return (0, _compose.createHigherOrderComponent)(createColorHOC(colorTypes, withColorPalette), 'withColors');
 }
 //# sourceMappingURL=with-colors.js.map

package/build/components/colors/with-colors.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors/with-colors.js"],"names":["upperFirst","firstLetter","rest","toUpperCase","join","withCustomColorPalette","colorsArray","WrappedComponent","props","withEditorColorPalette","userPalette","themePalette","defaultPalette","allColors","createColorHOC","colorTypes","withColorPalette","colorMap","reduce","colorObject","colorType","Component","constructor","setters","createSetters","colorUtils","getMostReadableColor","bind","state","colorValue","colors","Object","keys","settersAccumulator","colorAttributeName","upperFirstColorAttributeName","customColorAttributeName","createSetColor","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","entries","newState","colorContext","previousColorObject","previousColor","color","class","render","createCustomColorsHOC","withColors"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, Component } from '@wordpress/element';\nimport { compose, createHigherOrderComponent } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetColorClassName,\n\tgetColorObjectByColorValue,\n\tgetColorObjectByAttributeValues,\n\tgetMostReadableColor,\n} from './utils';\nimport useSetting from '../use-setting';\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param {string} str The string whose first letter the function will capitalize.\n *\n * @return {string} Capitalized string.\n */\nconst upperFirst = ( [ firstLetter, ...rest ] ) =>\n\tfirstLetter.toUpperCase() + rest.join( '' );\n\n/**\n * Higher order component factory for injecting the `colorsArray` argument as\n * the colors prop in the `withCustomColors` HOC.\n *\n * @param {Array} colorsArray An array of color objects.\n *\n * @return {Function} The higher order component.\n */\nconst withCustomColorPalette = ( colorsArray ) =>\n\tcreateHigherOrderComponent(\n\t\t( WrappedComponent ) => ( props ) =>\n\t\t\t<WrappedComponent { ...props } colors={ colorsArray } />,\n\t\t'withCustomColorPalette'\n\t);\n\n/**\n * Higher order component factory for injecting the editor colors as the\n * `colors` prop in the `withColors` HOC.\n *\n * @return {Function} The higher order component.\n */\nconst withEditorColorPalette = () =>\n\tcreateHigherOrderComponent(\n\t\t( WrappedComponent ) => ( props ) => {\n\t\t\t// Some color settings have a special handling for deprecated flags in `useSetting`,\n\t\t\t// so we can't unwrap them by doing const { ... } = useSetting('color')\n\t\t\t// until https://github.com/WordPress/gutenberg/issues/37094 is fixed.\n\t\t\tconst userPalette = useSetting( 'color.palette.custom' );\n\t\t\tconst themePalette = useSetting( 'color.palette.theme' );\n\t\t\tconst defaultPalette = useSetting( 'color.palette.default' );\n\t\t\tconst allColors = useMemo(\n\t\t\t\t() => [\n\t\t\t\t\t...( userPalette || [] ),\n\t\t\t\t\t...( themePalette || [] ),\n\t\t\t\t\t...( defaultPalette || [] ),\n\t\t\t\t],\n\t\t\t\t[ userPalette, themePalette, defaultPalette ]\n\t\t\t);\n\t\t\treturn <WrappedComponent { ...props } colors={ allColors } />;\n\t\t},\n\t\t'withEditorColorPalette'\n\t);\n\n/**\n * Helper function used with `createHigherOrderComponent` to create\n * higher order components for managing color logic.\n *\n * @param {Array}    colorTypes       An array of color types (e.g. 'backgroundColor, borderColor).\n * @param {Function} withColorPalette A HOC for injecting the 'colors' prop into the WrappedComponent.\n *\n * @return {WPComponent} The component that can be used as a HOC.\n */\nfunction createColorHOC( colorTypes, withColorPalette ) {\n\tconst colorMap = colorTypes.reduce( ( colorObject, colorType ) => {\n\t\treturn {\n\t\t\t...colorObject,\n\t\t\t...( typeof colorType === 'string'\n\t\t\t\t? { [ colorType ]: kebabCase( colorType ) }\n\t\t\t\t: colorType ),\n\t\t};\n\t}, {} );\n\n\treturn compose( [\n\t\twithColorPalette,\n\t\t( WrappedComponent ) => {\n\t\t\treturn class extends Component {\n\t\t\t\tconstructor( props ) {\n\t\t\t\t\tsuper( props );\n\n\t\t\t\t\tthis.setters = this.createSetters();\n\t\t\t\t\tthis.colorUtils = {\n\t\t\t\t\t\tgetMostReadableColor:\n\t\t\t\t\t\t\tthis.getMostReadableColor.bind( this ),\n\t\t\t\t\t};\n\n\t\t\t\t\tthis.state = {};\n\t\t\t\t}\n\n\t\t\t\tgetMostReadableColor( colorValue ) {\n\t\t\t\t\tconst { colors } = this.props;\n\t\t\t\t\treturn getMostReadableColor( colors, colorValue );\n\t\t\t\t}\n\n\t\t\t\tcreateSetters() {\n\t\t\t\t\treturn Object.keys( colorMap ).reduce(\n\t\t\t\t\t\t( settersAccumulator, colorAttributeName ) => {\n\t\t\t\t\t\t\tconst upperFirstColorAttributeName =\n\t\t\t\t\t\t\t\tupperFirst( colorAttributeName );\n\t\t\t\t\t\t\tconst customColorAttributeName = `custom${ upperFirstColorAttributeName }`;\n\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t`set${ upperFirstColorAttributeName }`\n\t\t\t\t\t\t\t] = this.createSetColor(\n\t\t\t\t\t\t\t\tcolorAttributeName,\n\t\t\t\t\t\t\t\tcustomColorAttributeName\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\treturn settersAccumulator;\n\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\n\t\t\t\tcreateSetColor( colorAttributeName, customColorAttributeName ) {\n\t\t\t\t\treturn ( colorValue ) => {\n\t\t\t\t\t\tconst colorObject = getColorObjectByColorValue(\n\t\t\t\t\t\t\tthis.props.colors,\n\t\t\t\t\t\t\tcolorValue\n\t\t\t\t\t\t);\n\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t[ colorAttributeName ]:\n\t\t\t\t\t\t\t\tcolorObject && colorObject.slug\n\t\t\t\t\t\t\t\t\t? colorObject.slug\n\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t[ customColorAttributeName ]:\n\t\t\t\t\t\t\t\tcolorObject && colorObject.slug\n\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t: colorValue,\n\t\t\t\t\t\t} );\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tstatic getDerivedStateFromProps(\n\t\t\t\t\t{ attributes, colors },\n\t\t\t\t\tpreviousState\n\t\t\t\t) {\n\t\t\t\t\treturn Object.entries( colorMap ).reduce(\n\t\t\t\t\t\t( newState, [ colorAttributeName, colorContext ] ) => {\n\t\t\t\t\t\t\tconst colorObject = getColorObjectByAttributeValues(\n\t\t\t\t\t\t\t\tcolors,\n\t\t\t\t\t\t\t\tattributes[ colorAttributeName ],\n\t\t\t\t\t\t\t\tattributes[\n\t\t\t\t\t\t\t\t\t`custom${ upperFirst(\n\t\t\t\t\t\t\t\t\t\tcolorAttributeName\n\t\t\t\t\t\t\t\t\t) }`\n\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tconst previousColorObject =\n\t\t\t\t\t\t\t\tpreviousState[ colorAttributeName ];\n\t\t\t\t\t\t\tconst previousColor = previousColorObject?.color;\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * The \"and previousColorObject\" condition checks that a previous color object was already computed.\n\t\t\t\t\t\t\t * At the start previousColorObject and colorValue are both equal to undefined\n\t\t\t\t\t\t\t * bus as previousColorObject does not exist we should compute the object.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tpreviousColor === colorObject.color &&\n\t\t\t\t\t\t\t\tpreviousColorObject\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tnewState[ colorAttributeName ] =\n\t\t\t\t\t\t\t\t\tpreviousColorObject;\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tnewState[ colorAttributeName ] = {\n\t\t\t\t\t\t\t\t\t...colorObject,\n\t\t\t\t\t\t\t\t\tclass: getColorClassName(\n\t\t\t\t\t\t\t\t\t\tcolorContext,\n\t\t\t\t\t\t\t\t\t\tcolorObject.slug\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn newState;\n\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\n\t\t\t\trender() {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\tcolors: undefined,\n\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t...this.setters,\n\t\t\t\t\t\t\t\tcolorUtils: this.colorUtils,\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},\n\t] );\n}\n\n/**\n * A higher-order component factory for creating a 'withCustomColors' HOC, which handles color logic\n * for class generation color value, retrieval and color attribute setting.\n *\n * Use this higher-order component to work with a custom set of colors.\n *\n * @example\n *\n * ```jsx\n * const CUSTOM_COLORS = [ { name: 'Red', slug: 'red', color: '#ff0000' }, { name: 'Blue', slug: 'blue', color: '#0000ff' } ];\n * const withCustomColors = createCustomColorsHOC( CUSTOM_COLORS );\n * // ...\n * export default compose(\n *     withCustomColors( 'backgroundColor', 'borderColor' ),\n *     MyColorfulComponent,\n * );\n * ```\n *\n * @param {Array} colorsArray The array of color objects (name, slug, color, etc... ).\n *\n * @return {Function} Higher-order component.\n */\nexport function createCustomColorsHOC( colorsArray ) {\n\treturn ( ...colorTypes ) => {\n\t\tconst withColorPalette = withCustomColorPalette( colorsArray );\n\t\treturn createHigherOrderComponent(\n\t\t\tcreateColorHOC( colorTypes, withColorPalette ),\n\t\t\t'withCustomColors'\n\t\t);\n\t};\n}\n\n/**\n * A higher-order component, which handles color logic for class generation color value, retrieval and color attribute setting.\n *\n * For use with the default editor/theme color palette.\n *\n * @example\n *\n * ```jsx\n * export default compose(\n *     withColors( 'backgroundColor', { textColor: 'color' } ),\n *     MyColorfulComponent,\n * );\n * ```\n *\n * @param {...(Object|string)} colorTypes The arguments can be strings or objects. If the argument is an object,\n *                                        it should contain the color attribute name as key and the color context as value.\n *                                        If the argument is a string the value should be the color attribute name,\n *                                        the color context is computed by applying a kebab case transform to the value.\n *                                        Color context represents the context/place where the color is going to be used.\n *                                        The class name of the color is generated using 'has' followed by the color name\n *                                        and ending with the color context all in kebab case e.g: has-green-background-color.\n *\n * @return {Function} Higher-order component.\n */\nexport default function withColors( ...colorTypes ) {\n\tconst withColorPalette = withEditorColorPalette();\n\treturn createHigherOrderComponent(\n\t\tcreateColorHOC( colorTypes, withColorPalette ),\n\t\t'withColors'\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors/with-colors.js"],"names":["upperFirst","firstLetter","rest","toUpperCase","join","withCustomColorPalette","colorsArray","WrappedComponent","props","withEditorColorPalette","userPalette","themePalette","defaultPalette","allColors","createColorHOC","colorTypes","withColorPalette","colorMap","reduce","colorObject","colorType","Component","constructor","setters","createSetters","colorUtils","getMostReadableColor","bind","state","colorValue","colors","Object","keys","settersAccumulator","colorAttributeName","upperFirstColorAttributeName","customColorAttributeName","createSetColor","setAttributes","slug","undefined","getDerivedStateFromProps","attributes","previousState","entries","newState","colorContext","previousColorObject","previousColor","color","class","render","createCustomColorsHOC","withColors"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, Component } from '@wordpress/element';\nimport { compose, createHigherOrderComponent } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetColorClassName,\n\tgetColorObjectByColorValue,\n\tgetColorObjectByAttributeValues,\n\tgetMostReadableColor,\n} from './utils';\nimport useSetting from '../use-setting';\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param {string} str The string whose first letter the function will capitalize.\n *\n * @return {string} Capitalized string.\n */\nconst upperFirst = ( [ firstLetter, ...rest ] ) =>\n\tfirstLetter.toUpperCase() + rest.join( '' );\n\n/**\n * Higher order component factory for injecting the `colorsArray` argument as\n * the colors prop in the `withCustomColors` HOC.\n *\n * @param {Array} colorsArray An array of color objects.\n *\n * @return {Function} The higher order component.\n */\nconst withCustomColorPalette = ( colorsArray ) =>\n\tcreateHigherOrderComponent(\n\t\t( WrappedComponent ) => ( props ) =>\n\t\t\t<WrappedComponent { ...props } colors={ colorsArray } />,\n\t\t'withCustomColorPalette'\n\t);\n\n/**\n * Higher order component factory for injecting the editor colors as the\n * `colors` prop in the `withColors` HOC.\n *\n * @return {Function} The higher order component.\n */\nconst withEditorColorPalette = () =>\n\tcreateHigherOrderComponent(\n\t\t( WrappedComponent ) => ( props ) => {\n\t\t\t// Some color settings have a special handling for deprecated flags in `useSetting`,\n\t\t\t// so we can't unwrap them by doing const { ... } = useSetting('color')\n\t\t\t// until https://github.com/WordPress/gutenberg/issues/37094 is fixed.\n\t\t\tconst userPalette = useSetting( 'color.palette.custom' );\n\t\t\tconst themePalette = useSetting( 'color.palette.theme' );\n\t\t\tconst defaultPalette = useSetting( 'color.palette.default' );\n\t\t\tconst allColors = useMemo(\n\t\t\t\t() => [\n\t\t\t\t\t...( userPalette || [] ),\n\t\t\t\t\t...( themePalette || [] ),\n\t\t\t\t\t...( defaultPalette || [] ),\n\t\t\t\t],\n\t\t\t\t[ userPalette, themePalette, defaultPalette ]\n\t\t\t);\n\t\t\treturn <WrappedComponent { ...props } colors={ allColors } />;\n\t\t},\n\t\t'withEditorColorPalette'\n\t);\n\n/**\n * Helper function used with `createHigherOrderComponent` to create\n * higher order components for managing color logic.\n *\n * @param {Array}    colorTypes       An array of color types (e.g. 'backgroundColor, borderColor).\n * @param {Function} withColorPalette A HOC for injecting the 'colors' prop into the WrappedComponent.\n *\n * @return {WPComponent} The component that can be used as a HOC.\n */\nfunction createColorHOC( colorTypes, withColorPalette ) {\n\tconst colorMap = colorTypes.reduce( ( colorObject, colorType ) => {\n\t\treturn {\n\t\t\t...colorObject,\n\t\t\t...( typeof colorType === 'string'\n\t\t\t\t? { [ colorType ]: kebabCase( colorType ) }\n\t\t\t\t: colorType ),\n\t\t};\n\t}, {} );\n\n\treturn compose( [\n\t\twithColorPalette,\n\t\t( WrappedComponent ) => {\n\t\t\treturn class extends Component {\n\t\t\t\tconstructor( props ) {\n\t\t\t\t\tsuper( props );\n\n\t\t\t\t\tthis.setters = this.createSetters();\n\t\t\t\t\tthis.colorUtils = {\n\t\t\t\t\t\tgetMostReadableColor:\n\t\t\t\t\t\t\tthis.getMostReadableColor.bind( this ),\n\t\t\t\t\t};\n\n\t\t\t\t\tthis.state = {};\n\t\t\t\t}\n\n\t\t\t\tgetMostReadableColor( colorValue ) {\n\t\t\t\t\tconst { colors } = this.props;\n\t\t\t\t\treturn getMostReadableColor( colors, colorValue );\n\t\t\t\t}\n\n\t\t\t\tcreateSetters() {\n\t\t\t\t\treturn Object.keys( colorMap ).reduce(\n\t\t\t\t\t\t( settersAccumulator, colorAttributeName ) => {\n\t\t\t\t\t\t\tconst upperFirstColorAttributeName =\n\t\t\t\t\t\t\t\tupperFirst( colorAttributeName );\n\t\t\t\t\t\t\tconst customColorAttributeName = `custom${ upperFirstColorAttributeName }`;\n\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t`set${ upperFirstColorAttributeName }`\n\t\t\t\t\t\t\t] = this.createSetColor(\n\t\t\t\t\t\t\t\tcolorAttributeName,\n\t\t\t\t\t\t\t\tcustomColorAttributeName\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\treturn settersAccumulator;\n\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\n\t\t\t\tcreateSetColor( colorAttributeName, customColorAttributeName ) {\n\t\t\t\t\treturn ( colorValue ) => {\n\t\t\t\t\t\tconst colorObject = getColorObjectByColorValue(\n\t\t\t\t\t\t\tthis.props.colors,\n\t\t\t\t\t\t\tcolorValue\n\t\t\t\t\t\t);\n\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t[ colorAttributeName ]:\n\t\t\t\t\t\t\t\tcolorObject && colorObject.slug\n\t\t\t\t\t\t\t\t\t? colorObject.slug\n\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t[ customColorAttributeName ]:\n\t\t\t\t\t\t\t\tcolorObject && colorObject.slug\n\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t: colorValue,\n\t\t\t\t\t\t} );\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tstatic getDerivedStateFromProps(\n\t\t\t\t\t{ attributes, colors },\n\t\t\t\t\tpreviousState\n\t\t\t\t) {\n\t\t\t\t\treturn Object.entries( colorMap ).reduce(\n\t\t\t\t\t\t( newState, [ colorAttributeName, colorContext ] ) => {\n\t\t\t\t\t\t\tconst colorObject = getColorObjectByAttributeValues(\n\t\t\t\t\t\t\t\tcolors,\n\t\t\t\t\t\t\t\tattributes[ colorAttributeName ],\n\t\t\t\t\t\t\t\tattributes[\n\t\t\t\t\t\t\t\t\t`custom${ upperFirst(\n\t\t\t\t\t\t\t\t\t\tcolorAttributeName\n\t\t\t\t\t\t\t\t\t) }`\n\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tconst previousColorObject =\n\t\t\t\t\t\t\t\tpreviousState[ colorAttributeName ];\n\t\t\t\t\t\t\tconst previousColor = previousColorObject?.color;\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * The \"and previousColorObject\" condition checks that a previous color object was already computed.\n\t\t\t\t\t\t\t * At the start previousColorObject and colorValue are both equal to undefined\n\t\t\t\t\t\t\t * bus as previousColorObject does not exist we should compute the object.\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tpreviousColor === colorObject.color &&\n\t\t\t\t\t\t\t\tpreviousColorObject\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tnewState[ colorAttributeName ] =\n\t\t\t\t\t\t\t\t\tpreviousColorObject;\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tnewState[ colorAttributeName ] = {\n\t\t\t\t\t\t\t\t\t...colorObject,\n\t\t\t\t\t\t\t\t\tclass: getColorClassName(\n\t\t\t\t\t\t\t\t\t\tcolorContext,\n\t\t\t\t\t\t\t\t\t\tcolorObject.slug\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn newState;\n\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\n\t\t\t\trender() {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\tcolors: undefined,\n\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t...this.setters,\n\t\t\t\t\t\t\t\tcolorUtils: this.colorUtils,\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},\n\t] );\n}\n\n/**\n * A higher-order component factory for creating a 'withCustomColors' HOC, which handles color logic\n * for class generation color value, retrieval and color attribute setting.\n *\n * Use this higher-order component to work with a custom set of colors.\n *\n * @example\n *\n * ```jsx\n * const CUSTOM_COLORS = [ { name: 'Red', slug: 'red', color: '#ff0000' }, { name: 'Blue', slug: 'blue', color: '#0000ff' } ];\n * const withCustomColors = createCustomColorsHOC( CUSTOM_COLORS );\n * // ...\n * export default compose(\n *     withCustomColors( 'backgroundColor', 'borderColor' ),\n *     MyColorfulComponent,\n * );\n * ```\n *\n * @param {Array} colorsArray The array of color objects (name, slug, color, etc... ).\n *\n * @return {Function} Higher-order component.\n */\nexport function createCustomColorsHOC( colorsArray ) {\n\treturn ( ...colorTypes ) => {\n\t\tconst withColorPalette = withCustomColorPalette( colorsArray );\n\t\treturn createHigherOrderComponent(\n\t\t\tcreateColorHOC( colorTypes, withColorPalette ),\n\t\t\t'withCustomColors'\n\t\t);\n\t};\n}\n\n/**\n * A higher-order component, which handles color logic for class generation color value, retrieval and color attribute setting.\n *\n * For use with the default editor/theme color palette.\n *\n * @example\n *\n * ```jsx\n * export default compose(\n *     withColors( 'backgroundColor', { textColor: 'color' } ),\n *     MyColorfulComponent,\n * );\n * ```\n *\n * @param {...(Object|string)} colorTypes The arguments can be strings or objects. If the argument is an object,\n *                                        it should contain the color attribute name as key and the color context as value.\n *                                        If the argument is a string the value should be the color attribute name,\n *                                        the color context is computed by applying a kebab case transform to the value.\n *                                        Color context represents the context/place where the color is going to be used.\n *                                        The class name of the color is generated using 'has' followed by the color name\n *                                        and ending with the color context all in kebab case e.g: has-green-background-color.\n *\n * @return {Function} Higher-order component.\n */\nexport default function withColors( ...colorTypes ) {\n\tconst withColorPalette = withEditorColorPalette();\n\treturn createHigherOrderComponent(\n\t\tcreateColorHOC( colorTypes, withColorPalette ),\n\t\t'withColors'\n\t);\n}\n"]}

package/build/components/colors-gradients/control.js

@@ -13,8 +13,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _lodash = require("lodash");
-
 var _components = require("@wordpress/components");
 
 var _useSetting = _interopRequireDefault(require("../use-setting"));
@@ -43,26 +41,25 @@ const TAB_GRADIENT = {
 };
 const TABS_SETTINGS = [TAB_COLOR, TAB_GRADIENT];
 
-function ColorGradientControlInner(_ref) {
-  let {
-    colors,
-    gradients,
-    disableCustomColors,
-    disableCustomGradients,
-    __experimentalIsRenderedInSidebar,
-    className,
-    label,
-    onColorChange,
-    onGradientChange,
-    colorValue,
-    gradientValue,
-    clearable,
-    showTitle = true,
-    enableAlpha,
-    headingLevel
-  } = _ref;
-  const canChooseAColor = onColorChange && (!(0, _lodash.isEmpty)(colors) || !disableCustomColors);
-  const canChooseAGradient = onGradientChange && (!(0, _lodash.isEmpty)(gradients) || !disableCustomGradients);
+function ColorGradientControlInner({
+  colors,
+  gradients,
+  disableCustomColors,
+  disableCustomGradients,
+  __experimentalIsRenderedInSidebar,
+  className,
+  label,
+  onColorChange,
+  onGradientChange,
+  colorValue,
+  gradientValue,
+  clearable,
+  showTitle = true,
+  enableAlpha,
+  headingLevel
+}) {
+  const canChooseAColor = onColorChange && (colors && colors.length > 0 || !disableCustomColors);
+  const canChooseAGradient = onGradientChange && (gradients && gradients.length > 0 || !disableCustomGradients);
 
   if (!canChooseAColor && !canChooseAGradient) {
     return null;

package/build/components/colors-gradients/control.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/control.js"],"names":["colorsAndGradientKeys","TAB_COLOR","name","title","value","TAB_GRADIENT","TABS_SETTINGS","ColorGradientControlInner","colors","gradients","disableCustomColors","disableCustomGradients","__experimentalIsRenderedInSidebar","className","label","onColorChange","onGradientChange","colorValue","gradientValue","clearable","showTitle","enableAlpha","headingLevel","canChooseAColor","canChooseAGradient","tabPanels","newColor","newGradient","renderPanelType","type","tab","ColorGradientControlSelect","props","colorGradientSettings","ColorGradientControl","every","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tTabPanel,\n\tColorPalette,\n\tGradientPicker,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_COLOR = {\n\tname: 'color',\n\ttitle: 'Solid',\n\tvalue: 'color',\n};\nconst TAB_GRADIENT = {\n\tname: 'gradient',\n\ttitle: 'Gradient',\n\tvalue: 'gradient',\n};\n\nconst TABS_SETTINGS = [ TAB_COLOR, TAB_GRADIENT ];\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n\theadingLevel,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange && ( ! isEmpty( colors ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ! isEmpty( gradients ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_COLOR.value ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_GRADIENT.value ]: (\n\t\t\t<GradientPicker\n\t\t\t\t__nextHasNoMargin\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<TabPanel\n\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__tabs\"\n\t\t\t\t\t\t\ttabs={ TABS_SETTINGS }\n\t\t\t\t\t\t\tinitialTabName={\n\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t? TAB_GRADIENT.value\n\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_COLOR.value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( tab ) => renderPanelType( tab.value ) }\n\t\t\t\t\t\t</TabPanel>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canChooseAGradient &&\n\t\t\t\t\t\trenderPanelType( TAB_COLOR.value ) }\n\t\t\t\t\t{ ! canChooseAColor &&\n\t\t\t\t\t\trenderPanelType( TAB_GRADIENT.value ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst colorGradientSettings = {};\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\tcolorGradientSettings.disableCustomColors = ! useSetting( 'color.custom' );\n\tcolorGradientSettings.disableCustomGradients = ! useSetting(\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/control.js"],"names":["colorsAndGradientKeys","TAB_COLOR","name","title","value","TAB_GRADIENT","TABS_SETTINGS","ColorGradientControlInner","colors","gradients","disableCustomColors","disableCustomGradients","__experimentalIsRenderedInSidebar","className","label","onColorChange","onGradientChange","colorValue","gradientValue","clearable","showTitle","enableAlpha","headingLevel","canChooseAColor","length","canChooseAGradient","tabPanels","newColor","newGradient","renderPanelType","type","tab","ColorGradientControlSelect","props","colorGradientSettings","ColorGradientControl","every","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tTabPanel,\n\tColorPalette,\n\tGradientPicker,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_COLOR = {\n\tname: 'color',\n\ttitle: 'Solid',\n\tvalue: 'color',\n};\nconst TAB_GRADIENT = {\n\tname: 'gradient',\n\ttitle: 'Gradient',\n\tvalue: 'gradient',\n};\n\nconst TABS_SETTINGS = [ TAB_COLOR, TAB_GRADIENT ];\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n\theadingLevel,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange &&\n\t\t( ( colors && colors.length > 0 ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ( gradients && gradients.length > 0 ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_COLOR.value ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_GRADIENT.value ]: (\n\t\t\t<GradientPicker\n\t\t\t\t__nextHasNoMargin\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<TabPanel\n\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__tabs\"\n\t\t\t\t\t\t\ttabs={ TABS_SETTINGS }\n\t\t\t\t\t\t\tinitialTabName={\n\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t? TAB_GRADIENT.value\n\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_COLOR.value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( tab ) => renderPanelType( tab.value ) }\n\t\t\t\t\t\t</TabPanel>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canChooseAGradient &&\n\t\t\t\t\t\trenderPanelType( TAB_COLOR.value ) }\n\t\t\t\t\t{ ! canChooseAColor &&\n\t\t\t\t\t\trenderPanelType( TAB_GRADIENT.value ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst colorGradientSettings = {};\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\tcolorGradientSettings.disableCustomColors = ! useSetting( 'color.custom' );\n\tcolorGradientSettings.disableCustomGradients = ! useSetting(\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"]}

package/build/components/colors-gradients/dropdown.js

@@ -30,14 +30,12 @@ var _control = _interopRequireDefault(require("./control"));
  */
 // When the `ColorGradientSettingsDropdown` controls are being rendered to a
 // `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.
-const WithToolsPanelItem = _ref => {
-  let {
-    setting,
-    children,
-    panelId,
-    ...props
-  } = _ref;
-
+const WithToolsPanelItem = ({
+  setting,
+  children,
+  panelId,
+  ...props
+}) => {
   const clearValue = () => {
     if (setting.colorValue) {
       setting.onColorChange();
@@ -62,30 +60,26 @@ const WithToolsPanelItem = _ref => {
   }), children);
 };
 
-const LabeledColorIndicator = _ref2 => {
-  let {
-    colorValue,
-    label
-  } = _ref2;
-  return (0, _element.createElement)(_components.__experimentalHStack, {
-    justify: "flex-start"
-  }, (0, _element.createElement)(_components.ColorIndicator, {
-    className: "block-editor-panel-color-gradient-settings__color-indicator",
-    colorValue: colorValue
-  }), (0, _element.createElement)(_components.FlexItem, {
-    className: "block-editor-panel-color-gradient-settings__color-name",
-    title: label
-  }, label));
-}; // Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`
+const LabeledColorIndicator = ({
+  colorValue,
+  label
+}) => (0, _element.createElement)(_components.__experimentalHStack, {
+  justify: "flex-start"
+}, (0, _element.createElement)(_components.ColorIndicator, {
+  className: "block-editor-panel-color-gradient-settings__color-indicator",
+  colorValue: colorValue
+}), (0, _element.createElement)(_components.FlexItem, {
+  className: "block-editor-panel-color-gradient-settings__color-name",
+  title: label
+}, label)); // Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`
 // or as a `Button` if it isn't e.g. the controls are being rendered in
 // a `ToolsPanel`.
 
 
-const renderToggle = settings => _ref3 => {
-  let {
-    onToggle,
-    isOpen
-  } = _ref3;
+const renderToggle = settings => ({
+  onToggle,
+  isOpen
+}) => {
   const {
     colorValue,
     label
@@ -110,17 +104,16 @@ const renderToggle = settings => _ref3 => {
 // For more context see: https://github.com/WordPress/gutenberg/pull/40084
 
 
-function ColorGradientSettingsDropdown(_ref4) {
-  let {
-    colors,
-    disableCustomColors,
-    disableCustomGradients,
-    enableAlpha,
-    gradients,
-    settings,
-    __experimentalIsRenderedInSidebar,
-    ...props
-  } = _ref4;
+function ColorGradientSettingsDropdown({
+  colors,
+  disableCustomColors,
+  disableCustomGradients,
+  enableAlpha,
+  gradients,
+  settings,
+  __experimentalIsRenderedInSidebar,
+  ...props
+}) {
   let popoverProps;
 
   if (__experimentalIsRenderedInSidebar) {

package/build/components/colors-gradients/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"names":["WithToolsPanelItem","setting","children","panelId","props","clearValue","colorValue","onColorChange","gradientValue","onGradientChange","label","isShownByDefault","undefined","resetAllFilter","LabeledColorIndicator","renderToggle","settings","onToggle","isOpen","toggleProps","onClick","className","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","shift","map","index","controlProps","clearable","showTitle","toggleSettings"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tDropdown,\n\tFlexItem,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\t__experimentalHStack as HStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( { setting, children, panelId, ...props } ) => {\n\tconst clearValue = () => {\n\t\tif ( setting.colorValue ) {\n\t\t\tsetting.onColorChange();\n\t\t} else if ( setting.gradientValue ) {\n\t\t\tsetting.onGradientChange();\n\t\t}\n\t};\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => {\n\t\t\t\treturn !! setting.colorValue || !! setting.gradientValue;\n\t\t\t} }\n\t\t\tlabel={ setting.label }\n\t\t\tonDeselect={ clearValue }\n\t\t\tisShownByDefault={\n\t\t\t\tsetting.isShownByDefault !== undefined\n\t\t\t\t\t? setting.isShownByDefault\n\t\t\t\t\t: true\n\t\t\t}\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\n\t\t\tpanelId={ panelId }\n\t\t\t// Pass resetAllFilter if supplied due to rendering via SlotFill\n\t\t\t// into parent ToolsPanel.\n\t\t\tresetAllFilter={ setting.resetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanelItem>\n\t);\n};\n\nconst LabeledColorIndicator = ( { colorValue, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ColorIndicator\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-indicator\"\n\t\t\tcolorValue={ colorValue }\n\t\t/>\n\t\t<FlexItem\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-name\"\n\t\t\ttitle={ label }\n\t\t>\n\t\t\t{ label }\n\t\t</FlexItem>\n\t</HStack>\n);\n\n// Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`\n// or as a `Button` if it isn't e.g. the controls are being rendered in\n// a `ToolsPanel`.\nconst renderToggle =\n\t( settings ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst { colorValue, label } = settings;\n\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings__dropdown',\n\t\t\t\t{ 'is-open': isOpen }\n\t\t\t),\n\t\t\t'aria-expanded': isOpen,\n\t\t};\n\n\t\treturn (\n\t\t\t<Button { ...toggleProps }>\n\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\tcolorValue={ colorValue }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t);\n\t};\n\n// Renders a collection of color controls as dropdowns. Depending upon the\n// context in which these dropdowns are being rendered, they may be wrapped\n// in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively,\n// the may be individually wrapped in a `ToolsPanelItem` with the toggle as\n// a regular `Button`.\n//\n// For more context see: https://github.com/WordPress/gutenberg/pull/40084\nexport default function ColorGradientSettingsDropdown( {\n\tcolors,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tenableAlpha,\n\tgradients,\n\tsettings,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t\tshift: true,\n\t\t};\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tcolorValue: setting.colorValue,\n\t\t\t\t\tcolors,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t\tgradientValue: setting.gradientValue,\n\t\t\t\t\tgradients,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t\tonColorChange: setting.onColorChange,\n\t\t\t\t\tonGradientChange: setting.onGradientChange,\n\t\t\t\t\tshowTitle: false,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\t...setting,\n\t\t\t\t};\n\t\t\t\tconst toggleSettings = {\n\t\t\t\t\tcolorValue: setting.gradientValue ?? setting.colorValue,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\tsetting && (\n\t\t\t\t\t\t// If not in an `ItemGroup` wrap the dropdown in a\n\t\t\t\t\t\t// `ToolsPanelItem`\n\t\t\t\t\t\t<WithToolsPanelItem\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tsetting={ setting }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__dropdown\"\n\t\t\t\t\t\t\t\trenderToggle={ renderToggle( toggleSettings ) }\n\t\t\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-panel-color-gradient-settings__dropdown-content\">\n\t\t\t\t\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</WithToolsPanelItem>\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"names":["WithToolsPanelItem","setting","children","panelId","props","clearValue","colorValue","onColorChange","gradientValue","onGradientChange","label","isShownByDefault","undefined","resetAllFilter","LabeledColorIndicator","renderToggle","settings","onToggle","isOpen","toggleProps","onClick","className","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","shift","map","index","controlProps","clearable","showTitle","toggleSettings"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAaA;;AArBA;AACA;AACA;;AAGA;AACA;AACA;;AAWA;AACA;AACA;AAGA;AACA;AACA,MAAMA,kBAAkB,GAAG,CAAE;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,QAAX;AAAqBC,EAAAA,OAArB;AAA8B,KAAGC;AAAjC,CAAF,KAAgD;AAC1E,QAAMC,UAAU,GAAG,MAAM;AACxB,QAAKJ,OAAO,CAACK,UAAb,EAA0B;AACzBL,MAAAA,OAAO,CAACM,aAAR;AACA,KAFD,MAEO,IAAKN,OAAO,CAACO,aAAb,EAA6B;AACnCP,MAAAA,OAAO,CAACQ,gBAAR;AACA;AACD,GAND;;AAOA,SACC,4BAAC,wCAAD;AACC,IAAA,QAAQ,EAAG,MAAM;AAChB,aAAO,CAAC,CAAER,OAAO,CAACK,UAAX,IAAyB,CAAC,CAAEL,OAAO,CAACO,aAA3C;AACA,KAHF;AAIC,IAAA,KAAK,EAAGP,OAAO,CAACS,KAJjB;AAKC,IAAA,UAAU,EAAGL,UALd;AAMC,IAAA,gBAAgB,EACfJ,OAAO,CAACU,gBAAR,KAA6BC,SAA7B,GACGX,OAAO,CAACU,gBADX,GAEG;AATL,KAWMP,KAXN;AAYC,IAAA,SAAS,EAAC,wDAZX;AAaC,IAAA,OAAO,EAAGD,OAbX,CAcC;AACA;AAfD;AAgBC,IAAA,cAAc,EAAGF,OAAO,CAACY;AAhB1B,MAkBGX,QAlBH,CADD;AAsBA,CA9BD;;AAgCA,MAAMY,qBAAqB,GAAG,CAAE;AAAER,EAAAA,UAAF;AAAcI,EAAAA;AAAd,CAAF,KAC7B,4BAAC,gCAAD;AAAQ,EAAA,OAAO,EAAC;AAAhB,GACC,4BAAC,0BAAD;AACC,EAAA,SAAS,EAAC,6DADX;AAEC,EAAA,UAAU,EAAGJ;AAFd,EADD,EAKC,4BAAC,oBAAD;AACC,EAAA,SAAS,EAAC,wDADX;AAEC,EAAA,KAAK,EAAGI;AAFT,GAIGA,KAJH,CALD,CADD,C,CAeA;AACA;AACA;;;AACA,MAAMK,YAAY,GACfC,QAAF,IACA,CAAE;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAF,KAA4B;AAC3B,QAAM;AAAEZ,IAAAA,UAAF;AAAcI,IAAAA;AAAd,MAAwBM,QAA9B;AAEA,QAAMG,WAAW,GAAG;AACnBC,IAAAA,OAAO,EAAEH,QADU;AAEnBI,IAAAA,SAAS,EAAE,yBACV,sDADU,EAEV;AAAE,iBAAWH;AAAb,KAFU,CAFQ;AAMnB,qBAAiBA;AANE,GAApB;AASA,SACC,4BAAC,kBAAD,EAAaC,WAAb,EACC,4BAAC,qBAAD;AACC,IAAA,UAAU,EAAGb,UADd;AAEC,IAAA,KAAK,EAAGI;AAFT,IADD,CADD;AAQA,CAtBF,C,CAwBA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACe,SAASY,6BAAT,CAAwC;AACtDC,EAAAA,MADsD;AAEtDC,EAAAA,mBAFsD;AAGtDC,EAAAA,sBAHsD;AAItDC,EAAAA,WAJsD;AAKtDC,EAAAA,SALsD;AAMtDX,EAAAA,QANsD;AAOtDY,EAAAA,iCAPsD;AAQtD,KAAGxB;AARmD,CAAxC,EASX;AACH,MAAIyB,YAAJ;;AACA,MAAKD,iCAAL,EAAyC;AACxCC,IAAAA,YAAY,GAAG;AACdC,MAAAA,SAAS,EAAE,YADG;AAEdC,MAAAA,MAAM,EAAE,EAFM;AAGdC,MAAAA,KAAK,EAAE;AAHO,KAAf;AAKA;;AAED,SACC,qDACGhB,QAAQ,CAACiB,GAAT,CAAc,CAAEhC,OAAF,EAAWiC,KAAX,KAAsB;AAAA;;AACrC,UAAMC,YAAY,GAAG;AACpBC,MAAAA,SAAS,EAAE,KADS;AAEpB9B,MAAAA,UAAU,EAAEL,OAAO,CAACK,UAFA;AAGpBiB,MAAAA,MAHoB;AAIpBC,MAAAA,mBAJoB;AAKpBC,MAAAA,sBALoB;AAMpBC,MAAAA,WANoB;AAOpBlB,MAAAA,aAAa,EAAEP,OAAO,CAACO,aAPH;AAQpBmB,MAAAA,SARoB;AASpBjB,MAAAA,KAAK,EAAET,OAAO,CAACS,KATK;AAUpBH,MAAAA,aAAa,EAAEN,OAAO,CAACM,aAVH;AAWpBE,MAAAA,gBAAgB,EAAER,OAAO,CAACQ,gBAXN;AAYpB4B,MAAAA,SAAS,EAAE,KAZS;AAapBT,MAAAA,iCAboB;AAcpB,SAAG3B;AAdiB,KAArB;AAgBA,UAAMqC,cAAc,GAAG;AACtBhC,MAAAA,UAAU,2BAAEL,OAAO,CAACO,aAAV,yEAA2BP,OAAO,CAACK,UADvB;AAEtBI,MAAAA,KAAK,EAAET,OAAO,CAACS;AAFO,KAAvB;AAKA,WACCT,OAAO,IACN;AACA;AACA,gCAAC,kBAAD;AACC,MAAA,GAAG,EAAGiC,KADP;AAEC,MAAA,OAAO,EAAGjC;AAFX,OAGMG,KAHN,GAKC,4BAAC,oBAAD;AACC,MAAA,YAAY,EAAGyB,YADhB;AAEC,MAAA,SAAS,EAAC,4DAFX;AAGC,MAAA,YAAY,EAAGd,YAAY,CAAEuB,cAAF,CAH5B;AAIC,MAAA,aAAa,EAAG,MACf,4BAAC,gDAAD;AAAwB,QAAA,WAAW,EAAC;AAApC,SACC;AAAK,QAAA,SAAS,EAAC;AAAf,SACC,4BAAC,gBAAD,EACMH,YADN,CADD,CADD;AALF,MALD,CAJF;AA0BA,GAhDC,CADH,CADD;AAqDA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tDropdown,\n\tFlexItem,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\t__experimentalHStack as HStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( { setting, children, panelId, ...props } ) => {\n\tconst clearValue = () => {\n\t\tif ( setting.colorValue ) {\n\t\t\tsetting.onColorChange();\n\t\t} else if ( setting.gradientValue ) {\n\t\t\tsetting.onGradientChange();\n\t\t}\n\t};\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => {\n\t\t\t\treturn !! setting.colorValue || !! setting.gradientValue;\n\t\t\t} }\n\t\t\tlabel={ setting.label }\n\t\t\tonDeselect={ clearValue }\n\t\t\tisShownByDefault={\n\t\t\t\tsetting.isShownByDefault !== undefined\n\t\t\t\t\t? setting.isShownByDefault\n\t\t\t\t\t: true\n\t\t\t}\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\n\t\t\tpanelId={ panelId }\n\t\t\t// Pass resetAllFilter if supplied due to rendering via SlotFill\n\t\t\t// into parent ToolsPanel.\n\t\t\tresetAllFilter={ setting.resetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanelItem>\n\t);\n};\n\nconst LabeledColorIndicator = ( { colorValue, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ColorIndicator\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-indicator\"\n\t\t\tcolorValue={ colorValue }\n\t\t/>\n\t\t<FlexItem\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-name\"\n\t\t\ttitle={ label }\n\t\t>\n\t\t\t{ label }\n\t\t</FlexItem>\n\t</HStack>\n);\n\n// Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`\n// or as a `Button` if it isn't e.g. the controls are being rendered in\n// a `ToolsPanel`.\nconst renderToggle =\n\t( settings ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst { colorValue, label } = settings;\n\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings__dropdown',\n\t\t\t\t{ 'is-open': isOpen }\n\t\t\t),\n\t\t\t'aria-expanded': isOpen,\n\t\t};\n\n\t\treturn (\n\t\t\t<Button { ...toggleProps }>\n\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\tcolorValue={ colorValue }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t);\n\t};\n\n// Renders a collection of color controls as dropdowns. Depending upon the\n// context in which these dropdowns are being rendered, they may be wrapped\n// in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively,\n// the may be individually wrapped in a `ToolsPanelItem` with the toggle as\n// a regular `Button`.\n//\n// For more context see: https://github.com/WordPress/gutenberg/pull/40084\nexport default function ColorGradientSettingsDropdown( {\n\tcolors,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tenableAlpha,\n\tgradients,\n\tsettings,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t\tshift: true,\n\t\t};\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tcolorValue: setting.colorValue,\n\t\t\t\t\tcolors,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t\tgradientValue: setting.gradientValue,\n\t\t\t\t\tgradients,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t\tonColorChange: setting.onColorChange,\n\t\t\t\t\tonGradientChange: setting.onGradientChange,\n\t\t\t\t\tshowTitle: false,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\t...setting,\n\t\t\t\t};\n\t\t\t\tconst toggleSettings = {\n\t\t\t\t\tcolorValue: setting.gradientValue ?? setting.colorValue,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\tsetting && (\n\t\t\t\t\t\t// If not in an `ItemGroup` wrap the dropdown in a\n\t\t\t\t\t\t// `ToolsPanelItem`\n\t\t\t\t\t\t<WithToolsPanelItem\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tsetting={ setting }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__dropdown\"\n\t\t\t\t\t\t\t\trenderToggle={ renderToggle( toggleSettings ) }\n\t\t\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-panel-color-gradient-settings__dropdown-content\">\n\t\t\t\t\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</WithToolsPanelItem>\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"]}

package/build/components/colors-gradients/panel-color-gradient-settings.js

@@ -13,8 +13,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _lodash = require("lodash");
-
 var _components = require("@wordpress/components");
 
 var _data = require("@wordpress/data");
@@ -38,26 +36,25 @@ var _useMultipleOriginColorsAndGradients = _interopRequireDefault(require("./use
  */
 const colorsAndGradientKeys = ['colors', 'disableCustomColors', 'gradients', 'disableCustomGradients'];
 
-const PanelColorGradientSettingsInner = _ref => {
-  let {
-    className,
-    colors,
-    gradients,
-    disableCustomColors,
-    disableCustomGradients,
-    children,
-    settings,
-    title,
-    showTitle = true,
-    __experimentalIsRenderedInSidebar,
-    enableAlpha
-  } = _ref;
+const PanelColorGradientSettingsInner = ({
+  className,
+  colors,
+  gradients,
+  disableCustomColors,
+  disableCustomGradients,
+  children,
+  settings,
+  title,
+  showTitle = true,
+  __experimentalIsRenderedInSidebar,
+  enableAlpha
+}) => {
   const panelId = (0, _compose.useInstanceId)(PanelColorGradientSettingsInner);
   const {
     batch
   } = (0, _data.useRegistry)();
 
-  if ((0, _lodash.isEmpty)(colors) && (0, _lodash.isEmpty)(gradients) && disableCustomColors && disableCustomGradients && settings !== null && settings !== void 0 && settings.every(setting => (0, _lodash.isEmpty)(setting.colors) && (0, _lodash.isEmpty)(setting.gradients) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) {
+  if ((!colors || colors.length === 0) && (!gradients || gradients.length === 0) && disableCustomColors && disableCustomGradients && settings?.every(setting => (!setting.colors || setting.colors.length === 0) && (!setting.gradients || setting.gradients.length === 0) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) {
     return null;
   }
 
@@ -66,14 +63,12 @@ const PanelColorGradientSettingsInner = _ref => {
     label: showTitle ? title : undefined,
     resetAll: () => {
       batch(() => {
-        settings.forEach(_ref2 => {
-          let {
-            colorValue,
-            gradientValue,
-            onColorChange,
-            onGradientChange
-          } = _ref2;
-
+        settings.forEach(({
+          colorValue,
+          gradientValue,
+          onColorChange,
+          onGradientChange
+        }) => {
           if (colorValue) {
             onColorChange();
           } else if (gradientValue) {

package/build/components/colors-gradients/panel-color-gradient-settings.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"names":["colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","every","setting","undefined","forEach","colorValue","gradientValue","onColorChange","onGradientChange","PanelColorGradientSettingsSelect","props","colorGradientSettings","PanelColorGradientSettings","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport useColorsAndGradientsPalettes from './use-multiple-origin-colors-and-gradients';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nexport const PanelColorGradientSettingsInner = ( {\n\tclassName,\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tchildren,\n\tsettings,\n\ttitle,\n\tshowTitle = true,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\tisEmpty( colors ) &&\n\t\tisEmpty( gradients ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\tisEmpty( setting.colors ) &&\n\t\t\t\tisEmpty( setting.gradients ) &&\n\t\t\t\t( setting.disableCustomColors === undefined ||\n\t\t\t\t\tsetting.disableCustomColors ) &&\n\t\t\t\t( setting.disableCustomGradients === undefined ||\n\t\t\t\t\tsetting.disableCustomGradients )\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tlabel={ showTitle ? title : undefined }\n\t\t\tresetAll={ () => {\n\t\t\t\tbatch( () => {\n\t\t\t\t\tsettings.forEach(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\tif ( colorValue ) {\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t\t} else if ( gradientValue ) {\n\t\t\t\t\t\t\t\tonGradientChange();\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\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings={ settings }\n\t\t\t\tpanelId={ panelId }\n\t\t\t\t{ ...{\n\t\t\t\t\tcolors,\n\t\t\t\t\tgradients,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ !! children && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer marginY={ 4 } /> { children }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n};\n\nconst PanelColorGradientSettingsSelect = ( props ) => {\n\tconst colorGradientSettings = useColorsAndGradientsPalettes();\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettings = ( props ) => {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"names":["colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","length","every","setting","undefined","forEach","colorValue","gradientValue","onColorChange","onGradientChange","PanelColorGradientSettingsSelect","props","colorGradientSettings","PanelColorGradientSettings","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport useColorsAndGradientsPalettes from './use-multiple-origin-colors-and-gradients';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nexport const PanelColorGradientSettingsInner = ( {\n\tclassName,\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tchildren,\n\tsettings,\n\ttitle,\n\tshowTitle = true,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\t( ! colors || colors.length === 0 ) &&\n\t\t( ! gradients || gradients.length === 0 ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\t( ! setting.colors || setting.colors.length === 0 ) &&\n\t\t\t\t( ! setting.gradients || setting.gradients.length === 0 ) &&\n\t\t\t\t( setting.disableCustomColors === undefined ||\n\t\t\t\t\tsetting.disableCustomColors ) &&\n\t\t\t\t( setting.disableCustomGradients === undefined ||\n\t\t\t\t\tsetting.disableCustomGradients )\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tlabel={ showTitle ? title : undefined }\n\t\t\tresetAll={ () => {\n\t\t\t\tbatch( () => {\n\t\t\t\t\tsettings.forEach(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\tif ( colorValue ) {\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t\t} else if ( gradientValue ) {\n\t\t\t\t\t\t\t\tonGradientChange();\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\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings={ settings }\n\t\t\t\tpanelId={ panelId }\n\t\t\t\t{ ...{\n\t\t\t\t\tcolors,\n\t\t\t\t\tgradients,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ !! children && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer marginY={ 4 } /> { children }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n};\n\nconst PanelColorGradientSettingsSelect = ( props ) => {\n\tconst colorGradientSettings = useColorsAndGradientsPalettes();\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettings = ( props ) => {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"]}

package/build/components/colors-gradients/panel-color-gradient-settings.native.js

@@ -24,39 +24,35 @@ var _blockSettings = require("../block-settings");
 /**
  * Internal dependencies
  */
-function PanelColorGradientSettings(_ref) {
-  let {
-    settings,
-    title,
-    children
-  } = _ref;
+function PanelColorGradientSettings({
+  settings,
+  title,
+  children
+}) {
   const navigation = (0, _native.useNavigation)();
   const mappedSettings = (0, _element.useMemo)(() => {
-    return settings.map(_ref2 => {
-      let {
-        onColorChange,
-        onColorCleared,
-        colorValue,
-        onGradientChange,
-        gradientValue,
-        label
-      } = _ref2;
-      return (0, _element.createElement)(_components.ColorControl, {
-        onPress: () => {
-          navigation.navigate(_blockSettings.blockSettingsScreens.color, {
-            onColorChange,
-            colorValue: gradientValue || colorValue,
-            gradientValue,
-            onGradientChange,
-            onColorCleared,
-            label
-          });
-        },
-        key: `color-setting-${label}`,
-        label: label,
-        color: gradientValue || colorValue
-      });
-    });
+    return settings.map(({
+      onColorChange,
+      onColorCleared,
+      colorValue,
+      onGradientChange,
+      gradientValue,
+      label
+    }) => (0, _element.createElement)(_components.ColorControl, {
+      onPress: () => {
+        navigation.navigate(_blockSettings.blockSettingsScreens.color, {
+          onColorChange,
+          colorValue: gradientValue || colorValue,
+          gradientValue,
+          onGradientChange,
+          onColorCleared,
+          label
+        });
+      },
+      key: `color-setting-${label}`,
+      label: label,
+      color: gradientValue || colorValue
+    }));
   }, [settings]);
   return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.PanelBody, {
     title: title

package/build/components/colors-gradients/panel-color-gradient-settings.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.native.js"],"names":["PanelColorGradientSettings","settings","title","children","navigation","mappedSettings","map","onColorChange","onColorCleared","colorValue","onGradientChange","gradientValue","label","navigate","blockSettingsScreens","color"],"mappings":";;;;;;;AASA;;AANA;;AAKA;;AAMA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAGe,SAASA,0BAAT,OAIX;AAAA,MAJgD;AACnDC,IAAAA,QADmD;AAEnDC,IAAAA,KAFmD;AAGnDC,IAAAA;AAHmD,GAIhD;AACH,QAAMC,UAAU,GAAG,4BAAnB;AAEA,QAAMC,cAAc,GAAG,sBAAS,MAAM;AACrC,WAAOJ,QAAQ,CAACK,GAAT,CACN;AAAA,UAAE;AACDC,QAAAA,aADC;AAEDC,QAAAA,cAFC;AAGDC,QAAAA,UAHC;AAIDC,QAAAA,gBAJC;AAKDC,QAAAA,aALC;AAMDC,QAAAA;AANC,OAAF;AAAA,aAQC,4BAAC,wBAAD;AACC,QAAA,OAAO,EAAG,MAAM;AACfR,UAAAA,UAAU,CAACS,QAAX,CAAqBC,oCAAqBC,KAA1C,EAAiD;AAChDR,YAAAA,aADgD;AAEhDE,YAAAA,UAAU,EAAEE,aAAa,IAAIF,UAFmB;AAGhDE,YAAAA,aAHgD;AAIhDD,YAAAA,gBAJgD;AAKhDF,YAAAA,cALgD;AAMhDI,YAAAA;AANgD,WAAjD;AAQA,SAVF;AAWC,QAAA,GAAG,EAAI,iBAAiBA,KAAO,EAXhC;AAYC,QAAA,KAAK,EAAGA,KAZT;AAaC,QAAA,KAAK,EAAGD,aAAa,IAAIF;AAb1B,QARD;AAAA,KADM,CAAP;AA0BA,GA3BsB,EA2BpB,CAAER,QAAF,CA3BoB,CAAvB;AA6BA,SACC,qDACC,4BAAC,qBAAD;AAAW,IAAA,KAAK,EAAGC;AAAnB,KAA6BG,cAA7B,CADD,EAEC,4BAAC,qBAAD,QAAaF,QAAb,CAFD,CADD;AAMA","sourcesContent":["/**\n * External dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\n\n/**\n * WordPress dependencies\n */\nimport { ColorControl, PanelBody } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { blockSettingsScreens } from '../block-settings';\n\nexport default function PanelColorGradientSettings( {\n\tsettings,\n\ttitle,\n\tchildren,\n} ) {\n\tconst navigation = useNavigation();\n\n\tconst mappedSettings = useMemo( () => {\n\t\treturn settings.map(\n\t\t\t( {\n\t\t\t\tonColorChange,\n\t\t\t\tonColorCleared,\n\t\t\t\tcolorValue,\n\t\t\t\tonGradientChange,\n\t\t\t\tgradientValue,\n\t\t\t\tlabel,\n\t\t\t} ) => (\n\t\t\t\t<ColorControl\n\t\t\t\t\tonPress={ () => {\n\t\t\t\t\t\tnavigation.navigate( blockSettingsScreens.color, {\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tcolorValue: gradientValue || colorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t\tonColorCleared,\n\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tkey={ `color-setting-${ label }` }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tcolor={ gradientValue || colorValue }\n\t\t\t\t/>\n\t\t\t)\n\t\t);\n\t}, [ settings ] );\n\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ title }>{ mappedSettings }</PanelBody>\n\t\t\t<PanelBody>{ children }</PanelBody>\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.native.js"],"names":["PanelColorGradientSettings","settings","title","children","navigation","mappedSettings","map","onColorChange","onColorCleared","colorValue","onGradientChange","gradientValue","label","navigate","blockSettingsScreens","color"],"mappings":";;;;;;;AASA;;AANA;;AAKA;;AAMA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAGe,SAASA,0BAAT,CAAqC;AACnDC,EAAAA,QADmD;AAEnDC,EAAAA,KAFmD;AAGnDC,EAAAA;AAHmD,CAArC,EAIX;AACH,QAAMC,UAAU,GAAG,4BAAnB;AAEA,QAAMC,cAAc,GAAG,sBAAS,MAAM;AACrC,WAAOJ,QAAQ,CAACK,GAAT,CACN,CAAE;AACDC,MAAAA,aADC;AAEDC,MAAAA,cAFC;AAGDC,MAAAA,UAHC;AAIDC,MAAAA,gBAJC;AAKDC,MAAAA,aALC;AAMDC,MAAAA;AANC,KAAF,KAQC,4BAAC,wBAAD;AACC,MAAA,OAAO,EAAG,MAAM;AACfR,QAAAA,UAAU,CAACS,QAAX,CAAqBC,oCAAqBC,KAA1C,EAAiD;AAChDR,UAAAA,aADgD;AAEhDE,UAAAA,UAAU,EAAEE,aAAa,IAAIF,UAFmB;AAGhDE,UAAAA,aAHgD;AAIhDD,UAAAA,gBAJgD;AAKhDF,UAAAA,cALgD;AAMhDI,UAAAA;AANgD,SAAjD;AAQA,OAVF;AAWC,MAAA,GAAG,EAAI,iBAAiBA,KAAO,EAXhC;AAYC,MAAA,KAAK,EAAGA,KAZT;AAaC,MAAA,KAAK,EAAGD,aAAa,IAAIF;AAb1B,MATK,CAAP;AA0BA,GA3BsB,EA2BpB,CAAER,QAAF,CA3BoB,CAAvB;AA6BA,SACC,qDACC,4BAAC,qBAAD;AAAW,IAAA,KAAK,EAAGC;AAAnB,KAA6BG,cAA7B,CADD,EAEC,4BAAC,qBAAD,QAAaF,QAAb,CAFD,CADD;AAMA","sourcesContent":["/**\n * External dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\n\n/**\n * WordPress dependencies\n */\nimport { ColorControl, PanelBody } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { blockSettingsScreens } from '../block-settings';\n\nexport default function PanelColorGradientSettings( {\n\tsettings,\n\ttitle,\n\tchildren,\n} ) {\n\tconst navigation = useNavigation();\n\n\tconst mappedSettings = useMemo( () => {\n\t\treturn settings.map(\n\t\t\t( {\n\t\t\t\tonColorChange,\n\t\t\t\tonColorCleared,\n\t\t\t\tcolorValue,\n\t\t\t\tonGradientChange,\n\t\t\t\tgradientValue,\n\t\t\t\tlabel,\n\t\t\t} ) => (\n\t\t\t\t<ColorControl\n\t\t\t\t\tonPress={ () => {\n\t\t\t\t\t\tnavigation.navigate( blockSettingsScreens.color, {\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tcolorValue: gradientValue || colorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t\tonColorCleared,\n\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tkey={ `color-setting-${ label }` }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tcolor={ gradientValue || colorValue }\n\t\t\t\t/>\n\t\t\t)\n\t\t);\n\t}, [ settings ] );\n\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ title }>{ mappedSettings }</PanelBody>\n\t\t\t<PanelBody>{ children }</PanelBody>\n\t\t</>\n\t);\n}\n"]}