npm - @wordpress/block-editor - Versions diffs - 9.1.0 → 9.4.0 - Mend

@wordpress/block-editor 9.1.0 → 9.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (640) hide show

package/build/components/block-variation-transforms/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/components/block-variation-transforms/index.js"],"names":["VariationsButtons","className","onSelectVariation","selectedValue","variations","map","variation","name","icon","title","VariationsDropdown","selectOptions","description","value","label","info","position","chevronDown","iconPosition","__experimentalBlockVariationTransforms","blockClientId","updateBlockAttributes","blockEditorStore","activeBlockVariation","select","getActiveBlockVariation","getBlockVariations","blocksStore","getBlockName","getBlockAttributes","hasUniqueIcons","variationIcons","Set","forEach","add","size","length","variationName","find","attributes","baseClass","Component"],"mappings":"~~;;;;;;;~~AAaA;;AAVA;;AACA;;AACA;;AAOA;;AAEA;;AAKA;;~~AAnBA~~;AACA;AACA;;AAcA;AACA;AACA;~~AAGA~~,SAASA,iBAAT,OAKI;AAAA,MALwB;AAC3BC,IAAAA,SAD2B;AAE3BC,IAAAA,iBAF2B;AAG3BC,IAAAA,aAH2B;AAI3BC,IAAAA;AAJ2B,GAKxB;AACH,SACC;AAAU,IAAA,SAAS,EAAGH;AAAtB,KACC,4BAAC,0BAAD;AAAgB,IAAA,EAAE,EAAC;AAAnB,KACG,cAAI,wBAAJ,CADH,CADD,EAIGG,UAAU,CAACC,GAAX,CAAkBC,SAAF,IACjB,4BAAC,kBAAD;AACC,IAAA,GAAG,EAAGA,SAAS,CAACC,IADjB;AAEC,IAAA,IAAI,EAAGD,SAAS,CAACE,~~IAFlB~~;AAGC,IAAA,SAAS,EAAGL,aAAa,KAAKG,SAAS,CAACC,IAHzC;AAIC,IAAA,KAAK,EACJJ,aAAa,KAAKG,SAAS,CAACC,IAA5B,GACGD,SAAS,CAACG,KADb,GAEG;AACA;AACA,kBAAI,iBAAJ,CAFA,EAGAH,SAAS,CAACG,KAHV,CAPL;AAaC,IAAA,OAAO,EAAG,MAAMP,iBAAiB,CAAEI,SAAS,CAACC,IAAZ,CAblC;AAcC,kBAAaD,SAAS,CAACG,KAdxB;AAeC,IAAA,WAAW;AAfZ,IADC,CAJH,CADD;AA0BA;;AAED,SAASC,kBAAT,QAKI;AAAA,MALyB;AAC5BT,IAAAA,SAD4B;AAE5BC,IAAAA,iBAF4B;AAG5BC,IAAAA,aAH4B;AAI5BC,IAAAA;AAJ4B,GAKzB;AACH,QAAMO,aAAa,GAAGP,UAAU,CAACC,GAAX,CACrB;AAAA,QAAE;AAAEE,MAAAA,IAAF;AAAQE,MAAAA,KAAR;AAAeG,MAAAA;AAAf,KAAF;AAAA,WAAsC;AACrCC,MAAAA,KAAK,EAAEN,IAD8B;AAErCO,MAAAA,KAAK,EAAEL,KAF8B;AAGrCM,MAAAA,IAAI,EAAEH;AAH+B,KAAtC;AAAA,GADqB,CAAtB;AAQA,SACC,4BAAC,wBAAD;AACC,IAAA,SAAS,EAAGX,SADb;AAEC,IAAA,KAAK,EAAG,cAAI,wBAAJ,CAFT;AAGC,IAAA,IAAI,EAAG,cAAI,wBAAJ,CAHR;AAIC,IAAA,YAAY,EAAG;AACde,MAAAA,QAAQ,EAAE,eADI;AAEdf,MAAAA,SAAS,EAAG,GAAGA,SAAW;AAFZ,KAJhB;AAQC,IAAA,IAAI,EAAGgB,kBARR;AASC,IAAA,WAAW,EAAG;AAAEC,MAAAA,YAAY,EAAE;AAAhB;AATf,KAWG,MACD;AAAK,IAAA,SAAS,EAAI,GAAGjB,SAAW;AAAhC,KACC,4BAAC,qBAAD,QACC,4BAAC,2BAAD;AACC,IAAA,OAAO,EAAGU,aADX;AAEC,IAAA,KAAK,EAAGR,aAFT;AAGC,IAAA,QAAQ,EAAGD;AAHZ,IADD,CADD,CAZF,CADD;AAyBA;;AAED,SAASiB,sCAAT,QAAqE;AAAA,MAApB;AAAEC,IAAAA;AAAF,GAAoB;AACpE,QAAM;AAAEC,IAAAA;AAAF,MAA4B,uBAAaC,YAAb,CAAlC;AACA,QAAM;AAAEC,IAAAA,oBAAF;AAAwBnB,IAAAA;AAAxB,MAAuC,qBAC1CoB,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA,uBAAF;AAA2BC,MAAAA;AAA3B,~~QAAkDF~~,MAAM,~~CAC7DG~~,~~aAD6D~~,~~CAA9D~~;~~AAGA~~,UAAM;AAAEC,MAAAA,YAAF;AAAgBC,MAAAA;AAAhB,~~QAAuCL~~,MAAM,~~CAClDF~~,~~YADkD~~,~~CAAnD~~;~~AAGA~~,UAAMf,IAAI,GAAGa,aAAa,IAAIQ,YAAY,CAAER,aAAF,CAA1C;AACA,WAAO;AACNG,MAAAA,oBAAoB,EAAEE,uBAAuB,CAC5ClB,IAD4C,EAE5CsB,kBAAkB,CAAET,aAAF,CAF0B,CADvC;AAKNhB,MAAAA,UAAU,EAAEG,IAAI,IAAImB,kBAAkB,CAAEnB,IAAF,EAAQ,WAAR;AALhC,KAAP;AAOA,~~GAhB2C~~,~~EAiB5C~~,CAAEa,aAAF,~~CAjB4C~~,CAA7C;~~AAoBA~~,QAAMjB,aAAa,GAAGoB,oBAAH,aAAGA,oBAAH,uBAAGA,oBAAoB,CAAEhB,IAA5C,~~CAtBoE~~,~~CAwBpE~~;;AACA,QAAMuB,cAAc,GAAG,sBAAS,MAAM;AACrC,UAAMC,cAAc,GAAG,IAAIC,GAAJ,EAAvB;~~AACA5B~~,IAAAA,UAAU,CAAC6B,OAAX,CAAsB3B,SAAF,IAAiB;AACpC,UAAKA,SAAS,CAACE,IAAf,EAAsB;AACrBuB,QAAAA,cAAc,CAACG,GAAf,~~CAAoB5B~~,SAAS,CAACE,~~IAA9B~~;AACA;AACD,KAJD;AAKA,WAAOuB,cAAc,~~CAACI~~,IAAf,~~KAAwB/B~~,UAAU,~~CAACgC~~,MAA1C;AACA,~~GARsB~~,~~EAQpB~~,~~CAAEhC~~,UAAF,~~CARoB~~,CAAvB;;~~AAUA~~,QAAMF,iBAAiB,~~GAAKmC~~,aAAF,IAAqB;~~AAC9ChB~~,IAAAA,qBAAqB,CAAED,aAAF,EAAiB,EACrC,GAAGhB,UAAU,~~CAACkC~~,IAAX,CAAiB;AAAA,YAAE;~~AAAE/B~~,UAAAA;AAAF,SAAF;AAAA,eAAgBA,IAAI,~~KAAK8B~~,aAAzB;AAAA,OAAjB,EACDE;AAFmC,KAAjB,CAArB;AAIA,GALD;;AAOA,QAAMC,SAAS,GAAG,yCAAlB,~~CA1CoE~~,~~CA4CpE~~;;AACA,MAAK,~~EAAEpC~~,UAAF,aAAEA,UAAF,eAAEA,UAAU,~~CAAEgC~~,MAAd,CAAL,EAA4B,OAAO,IAAP;AAE5B,QAAMK,SAAS,~~GAAGX~~,cAAc,GAAG9B,iBAAH,GAAuBU,kBAAvD;AAEA,SACC,4BAAC,SAAD;AACC,IAAA,SAAS,~~EAAG8B~~,SADb;AAEC,IAAA,iBAAiB,~~EAAGtC~~,iBAFrB;AAGC,IAAA,aAAa,EAAGC,aAHjB;AAIC,IAAA,UAAU,EAAGC;AAJd,IADD;AAQA;;eAEce,sC","sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tButton,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItemsChoice,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useMemo } from '@wordpress/element';\nimport { chevronDown } from '@wordpress/icons';\n\n/\n Internal dependencies\n /\nimport { store as blockEditorStore } from '../../store';\n\nfunction VariationsButtons( {\n\tclassName,\n\tonSelectVariation,\n\tselectedValue,\n\tvariations,\n} ) {\n\treturn (\n\t\t<fieldset className={ className }>\n\t\t\t<VisuallyHidden as=\"legend\">\n\t\t\t\t{ __( 'Transform to variation' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t{ variations.map( ( variation ) => (\n\t\t\t\t<Button\n\t\t\t\t\tkey={ variation.name }\n\t\t\t\t\ticon={ variation.icon }\n\t\t\t\t\tisPressed={ selectedValue === variation.name }\n\t\t\t\t\tlabel={\n\t\t\t\t\t\tselectedValue === variation.name\n\t\t\t\t\t\t\t? variation.title\n\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t/ translators: %s: Name of the block variation */\n\t\t\t\t\t\t\t\t\t__( 'Transform to %s' ),\n\t\t\t\t\t\t\t\t\tvariation.title\n\t\t\t\t\t\t\t )\n\t\t\t\t\t}\n\t\t\t\t\tonClick={ () => onSelectVariation( variation.name ) }\n\t\t\t\t\taria-label={ variation.title }\n\t\t\t\t\tshowTooltip\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</fieldset>\n\t);\n}\n\nfunction VariationsDropdown( {\n\tclassName,\n\tonSelectVariation,\n\tselectedValue,\n\tvariations,\n} ) {\n\tconst selectOptions = variations.map(\n\t\t( { name, title, description } ) => ( {\n\t\t\tvalue: name,\n\t\t\tlabel: title,\n\t\t\tinfo: description,\n\t\t} )\n\t);\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\tclassName={ className }\n\t\t\tlabel={ __( 'Transform to variation' ) }\n\t\t\ttext={ __( 'Transform to variation' ) }\n\t\t\tpopoverProps={ {\n\t\t\t\tposition: 'bottom center',\n\t\t\t\tclassName: `${ className }__popover`,\n\t\t\t} }\n\t\t\ticon={ chevronDown }\n\t\t\ttoggleProps={ { iconPosition: 'right' } }\n\t\t>\n\t\t\t{ () => (\n\t\t\t\t<div className={ `${ className }__container` }>\n\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t<MenuItemsChoice\n\t\t\t\t\t\t\tchoices={ selectOptions }\n\t\t\t\t\t\t\tvalue={ selectedValue }\n\t\t\t\t\t\t\tonSelect={ onSelectVariation }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MenuGroup>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction __experimentalBlockVariationTransforms( { blockClientId } ) {\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst { activeBlockVariation, variations } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getActiveBlockVariation, getBlockVariations } ~~= select(\~~n\t\t\t\~~tblocksStore\n\t\t\t~~);\n\t\t\tconst { getBlockName, getBlockAttributes } ~~= select(\~~n\t\t\t\~~tblockEditorStore\n\t\t\t~~);\n\t\t\tconst name = blockClientId && getBlockName( blockClientId );\n\t\t\treturn {\n\t\t\t\tactiveBlockVariation: getActiveBlockVariation(\n\t\t\t\t\tname,\n\t\t\t\t\tgetBlockAttributes( blockClientId )\n\t\t\t\t),\n\t\t\t\tvariations: name && getBlockVariations( name, 'transform' ),\n\t\t\t};\n\t\t},\n\t\t[ blockClientId ]\n\t);\n\n\tconst selectedValue = activeBlockVariation?.name;\n\n\t// Check if each variation has a unique icon.\n\tconst hasUniqueIcons = useMemo( () => {\n\t\tconst variationIcons = new Set();\n\t\tvariations.forEach( ( variation ) => {\n\t\t\tif ( variation.icon ) {\n\t\t\t\tvariationIcons.add( variation.icon );\n\t\t\t}\n\t\t} );\n\t\treturn variationIcons.size === variations.length;\n\t}, [ variations ] );\n\n\tconst onSelectVariation = ( variationName ) => {\n\t\tupdateBlockAttributes( blockClientId, {\n\t\t\t...variations.find( ( { name } ) => name === variationName )\n\t\t\t\t.attributes,\n\t\t} );\n\t};\n\n\tconst baseClass = 'block-editor-block-variation-transforms';\n\n\t// Skip rendering if there are no variations\n\tif ( ! variations?.length ) return null;\n\n\tconst Component = hasUniqueIcons ? VariationsButtons : VariationsDropdown;\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={ baseClass }\n\t\t\tonSelectVariation={ onSelectVariation }\n\t\t\tselectedValue={ selectedValue }\n\t\t\tvariations={ variations }\n\t\t/>\n\t);\n}\n\nexport default __experimentalBlockVariationTransforms;\n"]}
1	+ {"version":3,"sources":["@wordpress/block-editor/src/components/block-variation-transforms/index.js"],"names":["VariationsButtons","className","onSelectVariation","selectedValue","variations","map","variation","name","icon","title","VariationsDropdown","selectOptions","description","value","label","info","position","chevronDown","iconPosition","__experimentalBlockVariationTransforms","blockClientId","updateBlockAttributes","blockEditorStore","activeBlockVariation","select","getActiveBlockVariation","getBlockVariations","blocksStore","getBlockName","getBlockAttributes","hasUniqueIcons","variationIcons","Set","forEach","add","src","size","length","variationName","find","attributes","baseClass","Component"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tButton,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItemsChoice,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useMemo } from '@wordpress/element';\nimport { chevronDown } from '@wordpress/icons';\n\n/\n Internal dependencies\n /\nimport BlockIcon from '../block-icon';\nimport { store as blockEditorStore } from '../../store';\n\nfunction VariationsButtons( {\n\tclassName,\n\tonSelectVariation,\n\tselectedValue,\n\tvariations,\n} ) {\n\treturn (\n\t\t<fieldset className={ className }>\n\t\t\t<VisuallyHidden as=\"legend\">\n\t\t\t\t{ __( 'Transform to variation' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t{ variations.map( ( variation ) => (\n\t\t\t\t<Button\n\t\t\t\t\tkey={ variation.name }\n\t\t\t\t\ticon={ <BlockIcon icon={ variation.icon } showColors /> }\n\t\t\t\t\tisPressed={ selectedValue === variation.name }\n\t\t\t\t\tlabel={\n\t\t\t\t\t\tselectedValue === variation.name\n\t\t\t\t\t\t\t? variation.title\n\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t/ translators: %s: Name of the block variation */\n\t\t\t\t\t\t\t\t\t__( 'Transform to %s' ),\n\t\t\t\t\t\t\t\t\tvariation.title\n\t\t\t\t\t\t\t )\n\t\t\t\t\t}\n\t\t\t\t\tonClick={ () => onSelectVariation( variation.name ) }\n\t\t\t\t\taria-label={ variation.title }\n\t\t\t\t\tshowTooltip\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</fieldset>\n\t);\n}\n\nfunction VariationsDropdown( {\n\tclassName,\n\tonSelectVariation,\n\tselectedValue,\n\tvariations,\n} ) {\n\tconst selectOptions = variations.map(\n\t\t( { name, title, description } ) => ( {\n\t\t\tvalue: name,\n\t\t\tlabel: title,\n\t\t\tinfo: description,\n\t\t} )\n\t);\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\tclassName={ className }\n\t\t\tlabel={ __( 'Transform to variation' ) }\n\t\t\ttext={ __( 'Transform to variation' ) }\n\t\t\tpopoverProps={ {\n\t\t\t\tposition: 'bottom center',\n\t\t\t\tclassName: `${ className }__popover`,\n\t\t\t} }\n\t\t\ticon={ chevronDown }\n\t\t\ttoggleProps={ { iconPosition: 'right' } }\n\t\t>\n\t\t\t{ () => (\n\t\t\t\t<div className={ `${ className }__container` }>\n\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t<MenuItemsChoice\n\t\t\t\t\t\t\tchoices={ selectOptions }\n\t\t\t\t\t\t\tvalue={ selectedValue }\n\t\t\t\t\t\t\tonSelect={ onSelectVariation }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MenuGroup>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction __experimentalBlockVariationTransforms( { blockClientId } ) {\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst { activeBlockVariation, variations } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getActiveBlockVariation, getBlockVariations } =\n\t\t\t\tselect( blocksStore );\n\t\t\tconst { getBlockName, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst name = blockClientId && getBlockName( blockClientId );\n\t\t\treturn {\n\t\t\t\tactiveBlockVariation: getActiveBlockVariation(\n\t\t\t\t\tname,\n\t\t\t\t\tgetBlockAttributes( blockClientId )\n\t\t\t\t),\n\t\t\t\tvariations: name && getBlockVariations( name, 'transform' ),\n\t\t\t};\n\t\t},\n\t\t[ blockClientId ]\n\t);\n\n\tconst selectedValue = activeBlockVariation?.name;\n\n\t// Check if each variation has a unique icon.\n\tconst hasUniqueIcons = useMemo( () => {\n\t\tconst variationIcons = new Set();\n\t\tif ( ! variations ) {\n\t\t\treturn false;\n\t\t}\n\t\tvariations.forEach( ( variation ) => {\n\t\t\tif ( variation.icon ) {\n\t\t\t\tvariationIcons.add( variation.icon?.src \|\| variation.icon );\n\t\t\t}\n\t\t} );\n\t\treturn variationIcons.size === variations.length;\n\t}, [ variations ] );\n\n\tconst onSelectVariation = ( variationName ) => {\n\t\tupdateBlockAttributes( blockClientId, {\n\t\t\t...variations.find( ( { name } ) => name === variationName )\n\t\t\t\t.attributes,\n\t\t} );\n\t};\n\n\tconst baseClass = 'block-editor-block-variation-transforms';\n\n\t// Skip rendering if there are no variations\n\tif ( ! variations?.length ) return null;\n\n\tconst Component = hasUniqueIcons ? VariationsButtons : VariationsDropdown;\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={ baseClass }\n\t\t\tonSelectVariation={ onSelectVariation }\n\t\t\tselectedValue={ selectedValue }\n\t\t\tvariations={ variations }\n\t\t/>\n\t);\n}\n\nexport default __experimentalBlockVariationTransforms;\n"]}

package/build/components/color-style-selector/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/components/color-style-selector/index.js"],"names":["ColorSelectorSVGIcon","ColorSelectorIcon","style","className","renderToggleComponent","TextColor","BackgroundColor","onToggle","isOpen","openOnArrowDown","event","keyCode","DOWN","preventDefault","BlockColorsStyleSelector","children","other","alternative","since","version"],"mappings":";;;;;;;;;;;AAGA;;AAOA;;AACA;;AACA;;AAZA;AACA;AACA;AAYA,MAAMA,oBAAoB,GAAG,MAC5B,4BAAC,eAAD;AAAK,EAAA,KAAK,EAAC,6BAAX;AAAyC,EAAA,OAAO,EAAC;AAAjD,GACC,4BAAC,gBAAD;AAAM,EAAA,CAAC,EAAC;AAAR,EADD,CADD;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMC,iBAAiB,GAAG,QAA4B;AAAA,MAA1B;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAA0B;AACrD,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AACC,IAAA,SAAS,EAAI,GAAGA,SAAW,iDAD5B;AAEC,IAAA,KAAK,EAAGD;AAFT,KAIC,4BAAC,oBAAD,OAJD,CADD,CADD;AAUA,CAXD;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,qBAAqB,~~GAAG~~;AAAA,MAAE;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,GAAF;AAAA,~~SAAsC~~,~~SAG7D~~;AAAA,~~QAH+D~~;~~AACrEC~~,MAAAA,~~QADqE~~;~~AAErEC~~,MAAAA;~~AAFqE~~,~~KAG/D~~;;~~AACN~~,UAAMC,eAAe,GAAKC,KAAF,IAAa;AACpC,UAAK,CAAEF,MAAF,IAAYE,KAAK,CAACC,OAAN,KAAkBC,cAAnC,EAA0C;AACzCF,QAAAA,KAAK,CAACG,cAAN;AACAN,QAAAA,QAAQ;AACR;AACD,KALD;;AAOA,WACC,4BAAC,wBAAD,QACC,4BAAC,yBAAD;AACC,MAAA,SAAS,EAAC,mEADX;AAEC,MAAA,KAAK,EAAG,cAAI,sBAAJ,CAFT;AAGC,MAAA,OAAO,EAAGA,QAHX;AAIC,MAAA,SAAS,EAAGE,eAJb;AAKC,MAAA,IAAI,EACH,4BAAC,eAAD,QACC,4BAAC,SAAD,QACC,4BAAC,iBAAD,OADD,CADD;AANF,MADD,CADD;AAiBA,~~GA5B6B~~;AAAA,~~CAA9B~~;;~~AA8BA~~,MAAMK,wBAAwB,GAAG,SAA8B;AAAA,MAA5B;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAA4B;AAC9D,2BAAa,yCAAb,EAAuD;AACtDC,IAAAA,WAAW,EAAE,oBADyC;AAEtDC,IAAAA,KAAK,EAAE,KAF+C;AAGtDC,IAAAA,OAAO,EAAE;AAH6C,GAAvD;AAMA,SACC,4BAAC,oBAAD;AACC,IAAA,QAAQ,EAAC,cADV;AAEC,IAAA,SAAS,EAAC,+BAFX;AAGC,IAAA,gBAAgB,EAAC,wCAHlB;AAIC,IAAA,YAAY,EAAGf,qBAAqB,CAAEY,KAAF,CAJrC;AAKC,IAAA,aAAa,EAAG,MAAMD;AALvB,IADD;AASA,CAhBD;;eAkBeD,wB","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\tToolbarButton,\n\tDropdown,\n\tToolbarGroup,\n\tSVG,\n\tPath,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport deprecated from '@wordpress/deprecated';\n\nconst ColorSelectorSVGIcon = () => (\n\t<SVG xmlns=\"https://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n\t\t<Path d=\"M7.434 5l3.18 9.16H8.538l-.692-2.184H4.628l-.705 2.184H2L5.18 5h2.254zm-1.13 1.904h-.115l-1.148 3.593H7.44L6.304 6.904zM14.348 7.006c1.853 0 2.9.876 2.9 2.374v4.78h-1.79v-.914h-.114c-.362.64-1.123 1.022-2.031 1.022-1.346 0-2.292-.826-2.292-2.108 0-1.27.972-2.006 2.71-2.107l1.696-.102V9.38c0-.584-.42-.914-1.18-.914-.667 0-1.112.228-1.264.647h-1.701c.12-1.295 1.307-2.107 3.066-2.107zm1.079 4.1l-1.416.09c-.793.056-1.18.342-1.18.844 0 .52.45.837 1.091.837.857 0 1.505-.545 1.505-1.256v-.515z\" />\n\t</SVG>\n);\n\n/\n Color Selector Icon component.\n \n @param {Object} props Component properties.\n * @param {Object} props.style Style object.\n * @param {string} props.className Class name for component.\n \n @return {} React Icon component.\n /\nconst ColorSelectorIcon = ( { style, className } ) => {\n\treturn (\n\t\t<div className=\"block-library-colors-selector__icon-container\">\n\t\t\t<div\n\t\t\t\tclassName={ `${ className } block-library-colors-selector__state-selection` }\n\t\t\t\tstyle={ style }\n\t\t\t>\n\t\t\t\t<ColorSelectorSVGIcon />\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\n/*\n Renders the Colors Selector Toolbar with the icon button.\n \n @param {Object} props Component properties.\n * @param {Object} props.TextColor Text color component that wraps icon.\n * @param {Object} props.BackgroundColor Background color component that wraps icon.\n \n @return {} React toggle button component.\n /\nconst renderToggleComponent = ( { TextColor, BackgroundColor } ) => ( {~~\n\tonToggle,\n\tisOpen,\n~~} ) => {\n\tconst openOnArrowDown = ( event ) => {\n\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\tevent.preventDefault();\n\t\t\tonToggle();\n\t\t}\n\t};\n\n\treturn (\n\t\t<ToolbarGroup>\n\t\t\t<ToolbarButton\n\t\t\t\tclassName=\"components-toolbar__control block-library-colors-selector__toggle\"\n\t\t\t\tlabel={ __( 'Open Colors Selector' ) }\n\t\t\t\tonClick={ onToggle }\n\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\ticon={\n\t\t\t\t\t<BackgroundColor>\n\t\t\t\t\t\t<TextColor>\n\t\t\t\t\t\t\t<ColorSelectorIcon />\n\t\t\t\t\t\t</TextColor>\n\t\t\t\t\t</BackgroundColor>\n\t\t\t\t}\n\t\t\t/>\n\t\t</ToolbarGroup>\n\t);\n};\n\nconst BlockColorsStyleSelector = ( { children, ...other } ) => {\n\tdeprecated( `wp.blockEditor.BlockColorsStyleSelector`, {\n\t\talternative: 'block supports API',\n\t\tsince: '6.1',\n\t\tversion: '6.3',\n\t} );\n\n\treturn (\n\t\t<Dropdown\n\t\t\tposition=\"bottom right\"\n\t\t\tclassName=\"block-library-colors-selector\"\n\t\t\tcontentClassName=\"block-library-colors-selector__popover\"\n\t\t\trenderToggle={ renderToggleComponent( other ) }\n\t\t\trenderContent={ () => children }\n\t\t/>\n\t);\n};\n\nexport default BlockColorsStyleSelector;\n"]}
1	+ {"version":3,"sources":["@wordpress/block-editor/src/components/color-style-selector/index.js"],"names":["ColorSelectorSVGIcon","ColorSelectorIcon","style","className","renderToggleComponent","TextColor","BackgroundColor","onToggle","isOpen","openOnArrowDown","event","keyCode","DOWN","preventDefault","BlockColorsStyleSelector","children","other","alternative","since","version"],"mappings":";;;;;;;;;;;AAGA;;AAOA;;AACA;;AACA;;AAZA;AACA;AACA;AAYA,MAAMA,oBAAoB,GAAG,MAC5B,4BAAC,eAAD;AAAK,EAAA,KAAK,EAAC,6BAAX;AAAyC,EAAA,OAAO,EAAC;AAAjD,GACC,4BAAC,gBAAD;AAAM,EAAA,CAAC,EAAC;AAAR,EADD,CADD;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMC,iBAAiB,GAAG,QAA4B;AAAA,MAA1B;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAA0B;AACrD,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AACC,IAAA,SAAS,EAAI,GAAGA,SAAW,iDAD5B;AAEC,IAAA,KAAK,EAAGD;AAFT,KAIC,4BAAC,oBAAD,OAJD,CADD,CADD;AAUA,CAXD;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,qBAAqB,GAC1B;AAAA,MAAE;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,GAAF;AAAA,SACA,SAA4B;AAAA,QAA1B;AAAEC,MAAAA,QAAF;AAAYC,MAAAA;AAAZ,KAA0B;;AAC3B,UAAMC,eAAe,GAAKC,KAAF,IAAa;AACpC,UAAK,CAAEF,MAAF,IAAYE,KAAK,CAACC,OAAN,KAAkBC,cAAnC,EAA0C;AACzCF,QAAAA,KAAK,CAACG,cAAN;AACAN,QAAAA,QAAQ;AACR;AACD,KALD;;AAOA,WACC,4BAAC,wBAAD,QACC,4BAAC,yBAAD;AACC,MAAA,SAAS,EAAC,mEADX;AAEC,MAAA,KAAK,EAAG,cAAI,sBAAJ,CAFT;AAGC,MAAA,OAAO,EAAGA,QAHX;AAIC,MAAA,SAAS,EAAGE,eAJb;AAKC,MAAA,IAAI,EACH,4BAAC,eAAD,QACC,4BAAC,SAAD,QACC,4BAAC,iBAAD,OADD,CADD;AANF,MADD,CADD;AAiBA,GA1BD;AAAA,CADD;;AA6BA,MAAMK,wBAAwB,GAAG,SAA8B;AAAA,MAA5B;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAA4B;AAC9D,2BAAa,yCAAb,EAAuD;AACtDC,IAAAA,WAAW,EAAE,oBADyC;AAEtDC,IAAAA,KAAK,EAAE,KAF+C;AAGtDC,IAAAA,OAAO,EAAE;AAH6C,GAAvD;AAMA,SACC,4BAAC,oBAAD;AACC,IAAA,QAAQ,EAAC,cADV;AAEC,IAAA,SAAS,EAAC,+BAFX;AAGC,IAAA,gBAAgB,EAAC,wCAHlB;AAIC,IAAA,YAAY,EAAGf,qBAAqB,CAAEY,KAAF,CAJrC;AAKC,IAAA,aAAa,EAAG,MAAMD;AALvB,IADD;AASA,CAhBD;;eAkBeD,wB","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\tToolbarButton,\n\tDropdown,\n\tToolbarGroup,\n\tSVG,\n\tPath,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport deprecated from '@wordpress/deprecated';\n\nconst ColorSelectorSVGIcon = () => (\n\t<SVG xmlns=\"https://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n\t\t<Path d=\"M7.434 5l3.18 9.16H8.538l-.692-2.184H4.628l-.705 2.184H2L5.18 5h2.254zm-1.13 1.904h-.115l-1.148 3.593H7.44L6.304 6.904zM14.348 7.006c1.853 0 2.9.876 2.9 2.374v4.78h-1.79v-.914h-.114c-.362.64-1.123 1.022-2.031 1.022-1.346 0-2.292-.826-2.292-2.108 0-1.27.972-2.006 2.71-2.107l1.696-.102V9.38c0-.584-.42-.914-1.18-.914-.667 0-1.112.228-1.264.647h-1.701c.12-1.295 1.307-2.107 3.066-2.107zm1.079 4.1l-1.416.09c-.793.056-1.18.342-1.18.844 0 .52.45.837 1.091.837.857 0 1.505-.545 1.505-1.256v-.515z\" />\n\t</SVG>\n);\n\n/\n Color Selector Icon component.\n \n @param {Object} props Component properties.\n * @param {Object} props.style Style object.\n * @param {string} props.className Class name for component.\n \n @return {} React Icon component.\n /\nconst ColorSelectorIcon = ( { style, className } ) => {\n\treturn (\n\t\t<div className=\"block-library-colors-selector__icon-container\">\n\t\t\t<div\n\t\t\t\tclassName={ `${ className } block-library-colors-selector__state-selection` }\n\t\t\t\tstyle={ style }\n\t\t\t>\n\t\t\t\t<ColorSelectorSVGIcon />\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\n/*\n Renders the Colors Selector Toolbar with the icon button.\n \n @param {Object} props Component properties.\n * @param {Object} props.TextColor Text color component that wraps icon.\n * @param {Object} props.BackgroundColor Background color component that wraps icon.\n \n @return {} React toggle button component.\n /\nconst renderToggleComponent =\n\t( { TextColor, BackgroundColor } ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst openOnArrowDown = ( event ) => {\n\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonToggle();\n\t\t\t}\n\t\t};\n\n\t\treturn (\n\t\t\t<ToolbarGroup>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tclassName=\"components-toolbar__control block-library-colors-selector__toggle\"\n\t\t\t\t\tlabel={ __( 'Open Colors Selector' ) }\n\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\ticon={\n\t\t\t\t\t\t<BackgroundColor>\n\t\t\t\t\t\t\t<TextColor>\n\t\t\t\t\t\t\t\t<ColorSelectorIcon />\n\t\t\t\t\t\t\t</TextColor>\n\t\t\t\t\t\t</BackgroundColor>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</ToolbarGroup>\n\t\t);\n\t};\n\nconst BlockColorsStyleSelector = ( { children, ...other } ) => {\n\tdeprecated( `wp.blockEditor.BlockColorsStyleSelector`, {\n\t\talternative: 'block supports API',\n\t\tsince: '6.1',\n\t\tversion: '6.3',\n\t} );\n\n\treturn (\n\t\t<Dropdown\n\t\t\tposition=\"bottom right\"\n\t\t\tclassName=\"block-library-colors-selector\"\n\t\t\tcontentClassName=\"block-library-colors-selector__popover\"\n\t\t\trenderToggle={ renderToggleComponent( other ) }\n\t\t\trenderContent={ () => children }\n\t\t/>\n\t);\n};\n\nexport default BlockColorsStyleSelector;\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/components/colors/with-colors.js"],"names":["withCustomColorPalette","colorsArray","WrappedComponent","props","withEditorColorPalette","userPalette","themePalette","defaultPalette","allColors","createColorHOC","colorTypes","withColorPalette","colorMap","colorObject","colorType","Component","constructor","setters","createSetters","colorUtils","getMostReadableColor","bind","state","colorValue","colors","settersAccumulator","colorContext","colorAttributeName","upperFirstColorAttributeName","customColorAttributeName","createSetColor","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","newState","previousColorObject","previousColor","color","class","render","createCustomColorsHOC","withColors"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport { isString, kebabCase, reduce, upperFirst } 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 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),\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 = reduce(\n\t\tcolorTypes,\n\t\t( colorObject, colorType ) => {\n\t\t\treturn {\n\t\t\t\t...colorObject,\n\t\t\t\t...( isString( colorType )\n\t\t\t\t\t? { [ colorType ]: kebabCase( colorType ) }\n\t\t\t\t\t: colorType ),\n\t\t\t};\n\t\t},\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: this.getMostReadableColor.bind(\n\t\t\t\t\t\t\tthis\n\t\t\t\t\t\t),\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 reduce(\n\t\t\t\t\t\tcolorMap,\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\tcolorContext,\n\t\t\t\t\t\t\tcolorAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tconst upperFirstColorAttributeName = upperFirst(\n\t\t\t\t\t\t\t\tcolorAttributeName\n\t\t\t\t\t\t\t);\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 reduce(\n\t\t\t\t\t\tcolorMap,\n\t\t\t\t\t\t( newState, colorContext, colorAttributeName ) => {\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[\n\t\t\t\t\t\t\t\t\tcolorAttributeName\n\t\t\t\t\t\t\t\t] = previousColorObject;\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"]}
1	+ {"version":3,"sources":["@wordpress/block-editor/src/components/colors/with-colors.js"],"names":["withCustomColorPalette","colorsArray","WrappedComponent","props","withEditorColorPalette","userPalette","themePalette","defaultPalette","allColors","createColorHOC","colorTypes","withColorPalette","colorMap","colorObject","colorType","Component","constructor","setters","createSetters","colorUtils","getMostReadableColor","bind","state","colorValue","colors","settersAccumulator","colorContext","colorAttributeName","upperFirstColorAttributeName","customColorAttributeName","createSetColor","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","newState","previousColorObject","previousColor","color","class","render","createCustomColorsHOC","withColors"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport { isString, kebabCase, reduce, upperFirst } 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 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 = reduce(\n\t\tcolorTypes,\n\t\t( colorObject, colorType ) => {\n\t\t\treturn {\n\t\t\t\t...colorObject,\n\t\t\t\t...( isString( colorType )\n\t\t\t\t\t? { [ colorType ]: kebabCase( colorType ) }\n\t\t\t\t\t: colorType ),\n\t\t\t};\n\t\t},\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 reduce(\n\t\t\t\t\t\tcolorMap,\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\tcolorContext,\n\t\t\t\t\t\t\tcolorAttributeName\n\t\t\t\t\t\t) => {\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 reduce(\n\t\t\t\t\t\tcolorMap,\n\t\t\t\t\t\t( newState, colorContext, colorAttributeName ) => {\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/dropdown.js CHANGED Viewed

@@ -28,56 +28,45 @@ var _control = _interopRequireDefault(require("./control"));
 /**
  * Internal dependencies
  */
-// Conditionally wraps the `ColorGradientSettingsDropdown` color controls in an
-// `ItemGroup` allowing for a standalone group of controls to be
-// rendered semantically.
-const WithItemGroup = _ref => {
-  let {
-    __experimentalIsItemGroup,
-    children
-  } = _ref;
-  if (!__experimentalIsItemGroup) {
-    return children;
-  }
-  return (0, _element.createElement)(_components.__experimentalItemGroup, {
-    isBordered: true,
-    isSeparated: true,
-    className: "block-editor-panel-color-gradient-settings__item-group"
-  }, children);
-}; // When the `ColorGradientSettingsDropdown` controls are being rendered to a
+// When the `ColorGradientSettingsDropdown` controls are being rendered to a
 // `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.
-const WithToolsPanelItem = _ref2 => {
+const WithToolsPanelItem = _ref => {
   let {
-    __experimentalIsItemGroup,
-    settings,
+    setting,
     children,
+    panelId,
     ...props
-  } = _ref2;
+  } = _ref;
-  if (__experimentalIsItemGroup) {
-    return children;
-  }
+  const clearValue = () => {
+    if (setting.colorValue) {
+      setting.onColorChange();
+    } else if (setting.gradientValue) {
+      setting.onGradientChange();
+    }
+  };
   return (0, _element.createElement)(_components.__experimentalToolsPanelItem, (0, _extends2.default)({
-    hasValue: settings.hasValue,
-    label: settings.label,
-    onDeselect: settings.onDeselect,
-    isShownByDefault: settings.isShownByDefault,
-    resetAllFilter: settings.resetAllFilter
+    hasValue: () => {
+      return !!setting.colorValue || !!setting.gradientValue;
+    },
+    label: setting.label,
+    onDeselect: clearValue,
+    isShownByDefault: setting.isShownByDefault !== undefined ? setting.isShownByDefault : true
   }, props, {
-    className: "block-editor-tools-panel-color-gradient-settings__item"
+    className: "block-editor-tools-panel-color-gradient-settings__item",
+    panelId: panelId // Pass resetAllFilter if supplied due to rendering via SlotFill
+    // into parent ToolsPanel.
+    ,
+    resetAllFilter: setting.resetAllFilter
   }), children);
 };
-const LabeledColorIndicator = _ref3 => {
+const LabeledColorIndicator = _ref2 => {
   let {
     colorValue,
     label
-  } = _ref3;
+  } = _ref2;
   return (0, _element.createElement)(_components.__experimentalHStack, {
     justify: "flex-start"
   }, (0, _element.createElement)(_components.ColorIndicator, {
@@ -89,27 +78,23 @@ const LabeledColorIndicator = _ref3 => {
 // a `ToolsPanel`.
-const renderToggle = settings => _ref4 => {
+const renderToggle = settings => _ref3 => {
   let {
     onToggle,
     isOpen
-  } = _ref4;
+  } = _ref3;
   const {
-    __experimentalIsItemGroup,
     colorValue,
     label
-  } = settings; // Determine component, `Item` or `Button`, to wrap color indicator with.
-  const ToggleComponent = __experimentalIsItemGroup ? _components.__experimentalItem : _components.Button;
-  const toggleClassName = __experimentalIsItemGroup ? 'block-editor-panel-color-gradient-settings__item' : 'block-editor-panel-color-gradient-settings__dropdown';
+  } = settings;
   const toggleProps = {
     onClick: onToggle,
-    className: (0, _classnames.default)(toggleClassName, {
+    className: (0, _classnames.default)('block-editor-panel-color-gradient-settings__dropdown', {
       'is-open': isOpen
     }),
-    'aria-expanded': __experimentalIsItemGroup ? undefined : isOpen
+    'aria-expanded': isOpen
   };
-  return (0, _element.createElement)(ToggleComponent, toggleProps, (0, _element.createElement)(LabeledColorIndicator, {
+  return (0, _element.createElement)(_components.Button, toggleProps, (0, _element.createElement)(LabeledColorIndicator, {
     colorValue: colorValue,
     label: label
   }));
@@ -122,72 +107,64 @@ const renderToggle = settings => _ref4 => {
 // For more context see: https://github.com/WordPress/gutenberg/pull/40084
-function ColorGradientSettingsDropdown(_ref5) {
+function ColorGradientSettingsDropdown(_ref4) {
   let {
     colors,
     disableCustomColors,
     disableCustomGradients,
     enableAlpha,
     gradients,
-    __experimentalIsItemGroup = true,
     settings,
     __experimentalHasMultipleOrigins,
     __experimentalIsRenderedInSidebar,
     ...props
-  } = _ref5;
-  const dropdownClassName = __experimentalIsItemGroup ? 'block-editor-panel-color-gradient-settings__dropdown' : 'block-editor-tools-panel-color-gradient-settings__dropdown';
+  } = _ref4;
   let popoverProps;
   if (__experimentalIsRenderedInSidebar) {
     popoverProps = {
       placement: 'left-start',
-      offset: 36
+      offset: 36,
+      __unstableShift: true
     };
   }
-  return (// Only wrap with `ItemGroup` if these controls are being rendered
-    // semantically.
-    (0, _element.createElement)(WithItemGroup, {
-      __experimentalIsItemGroup: __experimentalIsItemGroup
-    }, settings.map((setting, index) => {
-      var _setting$gradientValu;
-      const controlProps = {
-        clearable: __experimentalIsItemGroup ? undefined : false,
-        colorValue: setting.colorValue,
-        colors,
-        disableCustomColors,
-        disableCustomGradients,
-        enableAlpha,
-        gradientValue: setting.gradientValue,
-        gradients,
-        label: setting.label,
-        onColorChange: setting.onColorChange,
-        onGradientChange: setting.onGradientChange,
-        showTitle: false,
-        __experimentalHasMultipleOrigins,
-        __experimentalIsRenderedInSidebar,
-        ...setting
-      };
-      const toggleSettings = {
-        colorValue: (_setting$gradientValu = setting.gradientValue) !== null && _setting$gradientValu !== void 0 ? _setting$gradientValu : setting.colorValue,
-        __experimentalIsItemGroup,
-        label: setting.label
-      };
-      return setting && // If not in an `ItemGroup` wrap the dropdown in a
-      // `ToolsPanelItem`
-      (0, _element.createElement)(WithToolsPanelItem, (0, _extends2.default)({
-        key: index,
-        __experimentalIsItemGroup: __experimentalIsItemGroup,
-        settings: setting
-      }, props), (0, _element.createElement)(_components.Dropdown, {
-        popoverProps: popoverProps,
-        className: dropdownClassName,
-        contentClassName: "block-editor-panel-color-gradient-settings__dropdown-content",
-        renderToggle: renderToggle(toggleSettings),
-        renderContent: () => (0, _element.createElement)(_control.default, controlProps)
-      }));
-    }))
-  );
+  return (0, _element.createElement)(_element.Fragment, null, settings.map((setting, index) => {
+    var _setting$gradientValu;
+    const controlProps = {
+      clearable: false,
+      colorValue: setting.colorValue,
+      colors,
+      disableCustomColors,
+      disableCustomGradients,
+      enableAlpha,
+      gradientValue: setting.gradientValue,
+      gradients,
+      label: setting.label,
+      onColorChange: setting.onColorChange,
+      onGradientChange: setting.onGradientChange,
+      showTitle: false,
+      __experimentalHasMultipleOrigins,
+      __experimentalIsRenderedInSidebar,
+      ...setting
+    };
+    const toggleSettings = {
+      colorValue: (_setting$gradientValu = setting.gradientValue) !== null && _setting$gradientValu !== void 0 ? _setting$gradientValu : setting.colorValue,
+      label: setting.label
+    };
+    return setting && // If not in an `ItemGroup` wrap the dropdown in a
+    // `ToolsPanelItem`
+    (0, _element.createElement)(WithToolsPanelItem, (0, _extends2.default)({
+      key: index,
+      setting: setting
+    }, props), (0, _element.createElement)(_components.Dropdown, {
+      popoverProps: popoverProps,
+      className: "block-editor-tools-panel-color-gradient-settings__dropdown",
+      contentClassName: "block-editor-panel-color-gradient-settings__dropdown-content",
+      renderToggle: renderToggle(toggleSettings),
+      renderContent: () => (0, _element.createElement)(_control.default, controlProps)
+    }));
+  }));
 }
 //# sourceMappingURL=dropdown.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"names":["WithItemGroup","__experimentalIsItemGroup","children","WithToolsPanelItem","settings","props","hasValue","label","onDeselect","isShownByDefault","resetAllFilter","LabeledColorIndicator","colorValue","renderToggle","onToggle","isOpen","ToggleComponent","Item","Button","toggleClassName","toggleProps","onClick","className","undefined","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","dropdownClassName","popoverProps","placement","offset","map","setting","index","controlProps","clearable","gradientValue","onColorChange","onGradientChange","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__experimentalHStack as HStack,\n\t__experimentalItem as Item,\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// Conditionally wraps the `ColorGradientSettingsDropdown` color controls in an\n// `ItemGroup` allowing for a standalone group of controls to be\n// rendered semantically.\nconst WithItemGroup = ( { __experimentalIsItemGroup, children } ) => {\n\tif ( ! __experimentalIsItemGroup ) {\n\t\treturn children;\n\t}\n\n\treturn (\n\t\t<ItemGroup\n\t\t\tisBordered\n\t\t\tisSeparated\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__item-group\"\n\t\t>\n\t\t\t{ children }\n\t\t</ItemGroup>\n\t);\n};\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( {\n\t__experimentalIsItemGroup,\n\tsettings,\n\tchildren,\n\t...props\n} ) => {\n\tif ( __experimentalIsItemGroup ) {\n\t\treturn children;\n\t}\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ settings.hasValue }\n\t\t\tlabel={ settings.label }\n\t\t\tonDeselect={ settings.onDeselect }\n\t\t\tisShownByDefault={ settings.isShownByDefault }\n\t\t\tresetAllFilter={ settings.resetAllFilter }\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\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>{ label }</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 = ( settings ) => ( { onToggle, isOpen } ) => {\n\tconst { __experimentalIsItemGroup, colorValue, label } = settings;\n\n\t// Determine component, `Item` or `Button`, to wrap color indicator with.\n\tconst ToggleComponent = __experimentalIsItemGroup ? Item : Button;\n\tconst toggleClassName = __experimentalIsItemGroup\n\t\t? 'block-editor-panel-color-gradient-settings__item'\n\t\t: 'block-editor-panel-color-gradient-settings__dropdown';\n\tconst toggleProps = {\n\t\tonClick: onToggle,\n\t\tclassName: classnames( toggleClassName, { 'is-open': isOpen } ),\n\t\t'aria-expanded': __experimentalIsItemGroup ? undefined : isOpen,\n\t};\n\n\treturn (\n\t\t<ToggleComponent { ...toggleProps }>\n\t\t\t<LabeledColorIndicator colorValue={ colorValue } label={ label } />\n\t\t</ToggleComponent>\n\t);\n};\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\t__experimentalIsItemGroup = true,\n\tsettings,\n\t__experimentalHasMultipleOrigins,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tconst dropdownClassName = __experimentalIsItemGroup\n\t\t? 'block-editor-panel-color-gradient-settings__dropdown'\n\t\t: 'block-editor-tools-panel-color-gradient-settings__dropdown';\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t};\n\t}\n\n\treturn (\n\t\t// Only wrap with `ItemGroup` if these controls are being rendered\n\t\t// semantically.\n\t\t<WithItemGroup __experimentalIsItemGroup={ __experimentalIsItemGroup }>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: __experimentalIsItemGroup ? undefined : 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__experimentalHasMultipleOrigins,\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\t__experimentalIsItemGroup,\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\t__experimentalIsItemGroup={\n\t\t\t\t\t\t\t\t__experimentalIsItemGroup\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsettings={ 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={ dropdownClassName }\n\t\t\t\t\t\t\t\tcontentClassName=\"block-editor-panel-color-gradient-settings__dropdown-content\"\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<ColorGradientControl { ...controlProps } />\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</WithItemGroup>\n\t);\n}\n"]}
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","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","__unstableShift","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__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>{ label }</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__experimentalHasMultipleOrigins,\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\t__unstableShift: 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__experimentalHasMultipleOrigins,\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\tcontentClassName=\"block-editor-panel-color-gradient-settings__dropdown-content\"\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<ColorGradientControl { ...controlProps } />\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 CHANGED Viewed

@@ -17,13 +17,11 @@ var _lodash = require("lodash");
 var _components = require("@wordpress/components");
-var _i18n = require("@wordpress/i18n");
+var _data = require("@wordpress/data");
-var _dropdown = _interopRequireDefault(require("./dropdown"));
-var _colors = require("../colors");
+var _compose = require("@wordpress/compose");
-var _gradients = require("../gradients");
+var _dropdown = _interopRequireDefault(require("./dropdown"));
 var _useSetting = _interopRequireDefault(require("../use-setting"));
@@ -42,50 +40,9 @@ var _useMultipleOriginColorsAndGradients = _interopRequireDefault(require("./use
 /**
  * Internal dependencies
  */
-// translators: first %s: The type of color or gradient (e.g. background, overlay...), second %s: the color name or value (e.g. red or #ff0000)
-const colorIndicatorAriaLabel = (0, _i18n.__)('(%s: color %s)'); // translators: first %s: The type of color or gradient (e.g. background, overlay...), second %s: the color name or value (e.g. red or #ff0000)
-const gradientIndicatorAriaLabel = (0, _i18n.__)('(%s: gradient %s)');
 const colorsAndGradientKeys = ['colors', 'disableCustomColors', 'gradients', 'disableCustomGradients'];
-const Indicators = _ref => {
-  let {
-    colors,
-    gradients,
-    settings
-  } = _ref;
-  return settings.map((_ref2, index) => {
-    let {
-      colorValue,
-      gradientValue,
-      label,
-      colors: availableColors,
-      gradients: availableGradients
-    } = _ref2;
-    if (!colorValue && !gradientValue) {
-      return null;
-    }
-    let ariaLabel;
-    if (colorValue) {
-      const colorObject = (0, _colors.getColorObjectByColorValue)(availableColors || colors, colorValue);
-      ariaLabel = (0, _i18n.sprintf)(colorIndicatorAriaLabel, label.toLowerCase(), colorObject && colorObject.name || colorValue);
-    } else {
-      const gradientObject = (0, _gradients.__experimentalGetGradientObjectByGradientValue)(availableGradients || gradients, colorValue);
-      ariaLabel = (0, _i18n.sprintf)(gradientIndicatorAriaLabel, label.toLowerCase(), gradientObject && gradientObject.name || gradientValue);
-    }
-    return (0, _element.createElement)(_components.ColorIndicator, {
-      key: index,
-      colorValue: colorValue || gradientValue,
-      "aria-label": ariaLabel
-    });
-  });
-};
-const PanelColorGradientSettingsInner = _ref3 => {
+const PanelColorGradientSettingsInner = _ref => {
   let {
     className,
     colors,
@@ -98,26 +55,44 @@ const PanelColorGradientSettingsInner = _ref3 => {
     showTitle = true,
     __experimentalHasMultipleOrigins,
     __experimentalIsRenderedInSidebar,
-    enableAlpha,
-    ...props
-  } = _ref3;
+    enableAlpha
+  } = _ref;
+  const panelId = (0, _compose.useInstanceId)(PanelColorGradientSettingsInner);
+  const {
+    batch
+  } = (0, _data.useRegistry)();
   if ((0, _lodash.isEmpty)(colors) && (0, _lodash.isEmpty)(gradients) && disableCustomColors && disableCustomGradients && (0, _lodash.every)(settings, setting => (0, _lodash.isEmpty)(setting.colors) && (0, _lodash.isEmpty)(setting.gradients) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) {
     return null;
   }
-  const titleElement = (0, _element.createElement)("span", {
-    className: "block-editor-panel-color-gradient-settings__panel-title"
-  }, title, (0, _element.createElement)(Indicators, {
-    colors: colors,
-    gradients: gradients,
-    settings: settings
-  }));
-  return (0, _element.createElement)(_components.PanelBody, (0, _extends2.default)({
+  return (0, _element.createElement)(_components.__experimentalToolsPanel, {
     className: (0, _classnames.default)('block-editor-panel-color-gradient-settings', className),
-    title: showTitle ? titleElement : undefined
-  }, props), (0, _element.createElement)(_dropdown.default, {
+    label: showTitle ? title : undefined,
+    resetAll: () => {
+      batch(() => {
+        settings.forEach(_ref2 => {
+          let {
+            colorValue,
+            gradientValue,
+            onColorChange,
+            onGradientChange
+          } = _ref2;
+          if (colorValue) {
+            onColorChange();
+          } else if (gradientValue) {
+            onGradientChange();
+          }
+        });
+      });
+    },
+    panelId: panelId,
+    __experimentalFirstVisibleItemClass: "first",
+    __experimentalLastVisibleItemClass: "last"
+  }, (0, _element.createElement)(_dropdown.default, {
     settings: settings,
+    panelId: panelId,
     colors,
     gradients,
     disableCustomColors,

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"names":["~~colorIndicatorAriaLabel~~","~~gradientIndicatorAriaLabel~~","~~colorsAndGradientKeys~~","~~Indicators","~~colors","gradients","~~settings~~","~~map~~","~~index~~","~~colorValue~~","~~gradientValue~~","~~label~~","~~availableColors~~","~~availableGradients~~","~~ariaLabel~~","~~colorObject~~","~~toLowerCase~~","~~name~~","~~gradientObject~~","~~PanelColorGradientSettingsInner~~","~~className~~","~~disableCustomColors~~","~~disableCustomGradients~~","~~children~~","~~title~~","~~showTitle","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","enableAlpha","~~props","~~setting","undefined","titleElement","PanelColorGradientSettingsSingleSelect","~~colorGradientSettings","PanelColorGradientSettingsMultipleSelect","PanelColorGradientSettings","key","hasOwnProperty"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;~~AAKA~~;;~~AAKA;;~~AACA;;~~AACA~~;;AACA;;AACA;;AACA;;~~AAxBA~~;AACA;AACA;;AAIA;AACA;AACA;;AAQA;AACA;AACA;~~AAQA;AACA~~,MAAMA,~~uBAAuB,GAAG,cAAI,gBAAJ,CAAhC,C,CAEA;;AACA,MAAMC,0BAA0B,GAAG,cAAI,mBAAJ,CAAnC;AAEA,MAAMC,~~qBAAqB,GAAG,CAC7B,QAD6B,EAE7B,qBAF6B,EAG7B,WAH6B,EAI7B,wBAJ6B,CAA9B;;~~AAOA~~,MAAMC,UAAU,GAAG,QAAuC;AAAA,MAArC;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,SAAV;AAAqBC,IAAAA;AAArB,GAAqC;AACzD,SAAOA,QAAQ,CAACC,GAAT,CACN,QAQCC,KARD,KASK;AAAA,QARJ;AACCC,MAAAA,UADD;AAECC,MAAAA,aAFD;AAGCC,MAAAA,KAHD;AAICP,MAAAA,MAAM,EAAEQ,eAJT;AAKCP,MAAAA,SAAS,EAAEQ;AALZ,KAQI;;AACJ,QAAK,CAAEJ,UAAF,IAAgB,CAAEC,aAAvB,EAAuC;AACtC,aAAO,IAAP;AACA;;AACD,QAAII,SAAJ;;AACA,QAAKL,UAAL,EAAkB;AACjB,YAAMM,WAAW,GAAG,wCACnBH,eAAe,IAAIR,MADA,EAEnBK,UAFmB,CAApB;AAIAK,MAAAA,SAAS,GAAG,mBACXd,uBADW,EAEXW,KAAK,CAACK,WAAN,EAFW,EAGTD,WAAW,IAAIA,WAAW,CAACE,IAA7B,IAAuCR,UAH5B,CAAZ;AAKA,KAVD,MAUO;AACN,YAAMS,cAAc,GAAG,+DACtBL,kBAAkB,IAAIR,SADA,EAEtBI,UAFsB,CAAvB;AAIAK,MAAAA,SAAS,GAAG,mBACXb,0BADW,EAEXU,KAAK,CAACK,WAAN,EAFW,EAGTE,cAAc,IAAIA,cAAc,CAACD,IAAnC,IAA6CP,aAHlC,CAAZ;AAKA;;AAED,WACC,4BAAC,0BAAD;AACC,MAAA,GAAG,EAAGF,KADP;AAEC,MAAA,UAAU,EAAGC,UAAU,IAAIC,aAF5B;AAGC,oBAAaI;AAHd,MADD;AAOA,GA5CK,CAAP;AA8CA,CA/CD;;AAiDO,MAAMK,+BAA+B,GAAG,~~SAcxC~~;AAAA,~~MAd0C~~;AAChDC,IAAAA,SADgD;~~AAEhDhB~~,IAAAA,MAFgD;AAGhDC,IAAAA,SAHgD;~~AAIhDgB~~,IAAAA,mBAJgD;AAKhDC,IAAAA,sBALgD;AAMhDC,IAAAA,QANgD;~~AAOhDjB~~,IAAAA,QAPgD;~~AAQhDkB~~,IAAAA,KARgD;AAShDC,IAAAA,SAAS,GAAG,IAToC;AAUhDC,IAAAA,gCAVgD;AAWhDC,IAAAA,iCAXgD;AAYhDC,IAAAA,~~WAZgD~~;~~AAahD~~,~~OAAGC~~;~~AAb6C~~,~~GAc1C~~;;~~AACN~~,MACC,~~qBAASzB~~,MAAT,KACA,qBAASC,SAAT,CADA,~~IAEAgB~~,mBAFA,IAGAC,sBAHA,IAIA,~~mBACChB~~,QADD,~~EAEGwB~~,OAAF,IACC,qBAASA,OAAO,~~CAAC1B~~,MAAjB,KACA,~~qBAAS0B~~,OAAO,~~CAACzB~~,SAAjB,CADA,~~KAEEyB~~,OAAO,~~CAACT~~,mBAAR,~~KAAgCU~~,SAAhC,IACDD,OAAO,~~CAACT~~,mBAHT,~~MAIES~~,OAAO,~~CAACR~~,sBAAR,~~KAAmCS~~,SAAnC,IACDD,OAAO,~~CAACR~~,sBALT,CAHF,CALD,EAeE;AACD,WAAO,IAAP;AACA;;AAED,~~QAAMU~~,~~YAAY~~,~~GACjB~~;~~AAAM~~,IAAA,SAAS,~~EAAC;AAAhB~~,~~KACGR~~,~~KADH~~,~~EAEC~~,~~4BAAC~~,~~UAAD~~;~~AACC~~,IAAA,~~MAAM~~,~~EAAGpB~~,~~MADV~~;~~AAEC~~,IAAA,~~SAAS~~,~~EAAGC~~,~~SAFb~~;~~AAGC~~,~~IAAA~~,QAAQ,~~EAAGC~~;~~AAHZ~~,~~IAFD~~,~~CADD~~;~~AAWA~~,~~SACC~~,~~4BAAC~~,~~qBAAD~~;~~AACC~~,~~IAAA~~,~~SAAS~~,~~EAAG~~,~~yBACX~~,~~4CADW~~,~~EAEXc~~,~~SAFW~~,~~CADb~~;~~AAKC~~,IAAA,~~KAAK~~,~~EAAGK~~,~~SAAS~~,~~GAAGO~~,~~YAAH~~,~~GAAkBD~~;~~AALpC~~,~~KAMMF~~,~~KANN~~,~~GAQC~~,4BAAC,iBAAD;AACC,IAAA,QAAQ,~~EAAGvB~~,QADZ;~~AAGEF~~,~~IAAAA~~,~~MAHF~~;~~AAIEC~~,IAAAA,~~SAJF~~;~~AAKEgB~~,IAAAA,~~mBALF~~;AAMEC,IAAAA,~~sBANF~~;~~AAOEI~~,IAAAA,~~gCAPF~~;~~AAQEC~~,IAAAA,~~iCARF~~;AASEC,IAAAA;~~AATF~~,~~IARD~~,~~EAoBG~~,CAAC,~~CAAEL~~,QAAH,IACD,qDACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,IADD,OAC4BA,QAD5B,~~CArBF~~,CADD;~~AA4BA~~,~~CAzEM~~;;;;~~AA2EP~~,~~MAAMU~~,sCAAsC,~~GAAKJ~~,KAAF,IAAa;AAC3D,~~QAAMK~~,qBAAqB,GAAG,8CAA9B;AACAA,EAAAA,qBAAqB,~~CAAC9B~~,MAAtB,GAA+B,yBAAY,eAAZ,CAA/B;~~AACA8B~~,EAAAA,qBAAqB,~~CAAC7B~~,SAAtB,GAAkC,yBAAY,iBAAZ,CAAlC;AACA,SACC,4BAAC,+BAAD,~~6BACW6B~~,qBADX,~~EACqCL~~,KADrC,EADD;AAKA,CATD;;AAWA,~~MAAMM~~,wCAAwC,~~GAAKN~~,KAAF,IAAa;AAC7D,~~QAAMK~~,qBAAqB,GAAG,mDAA9B;AACA,SACC,4BAAC,+BAAD,6BACWA,qBADX,~~EACqCL~~,KADrC,EADD;AAKA,CAPD;;AASA,~~MAAMO~~,0BAA0B,~~GAAKP~~,KAAF,IAAa;AAC/C,MACC,~~mBAAO3B~~,qBAAP,~~EAAgCmC~~,GAAF,~~IAAWR~~,KAAK,~~CAACS~~,cAAN,CAAsBD,GAAtB,CAAzC,CADD,EAEE;AACD,WAAO,4BAAC,+BAAD,~~EAAsCR~~,KAAtC,CAAP;AACA;;AACD,MAAKA,KAAK,~~CAACH~~,gCAAX,EAA8C;AAC7C,WAAO,4BAAC,wCAAD,EAA+CG,KAA/C,CAAP;AACA;;AACD,SAAO,4BAAC,sCAAD,EAA6CA,KAA7C,CAAP;AACA,CAVD;;~~eAYeO~~,0B","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport { every, isEmpty } from 'lodash';\n\n/\n WordPress dependencies\n /\nimport {\n\t__experimentalSpacer as Spacer,\n\~~tColorIndicator~~,\n~~\tPanelBody,\n~~} from '@wordpress/components';\nimport { ~~sprintf,~~ __ } from '@wordpress/~~i18n~~';\n\n/\n Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport ~~{ getColorObjectByColorValue } from '../colors';\nimport { __experimentalGetGradientObjectByGradientValue } from '../gradients';\nimport~~ useSetting from '../use-setting';\nimport useCommonSingleMultipleSelects from './use-common-single-multiple-selects';\nimport useMultipleOriginColorsAndGradients from './use-multiple-origin-colors-and-gradients';\n\~~n// translators: first %s: The type of color or gradient (e.g. background, overlay...), second %s: the color name or value (e.g. red or #ff0000)\~~nconst colorIndicatorAriaLabel = __( '(%s: color %s)' );\n\n// translators: first %s: The type of color or gradient (e.g. background, overlay...), second %s: the color name or value (e.g. red or #ff0000)\nconst gradientIndicatorAriaLabel = __( '(%s: gradient %s)' );\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\~~nconst~~ ~~Indicators~~ = ( { ~~colors, gradients, settings } ) => {~~\n\~~treturn settings.map(~~\n\t\~~t(\~~n\~~t\t\t{\~~n\~~t\t\t\tcolorValue~~,\n\~~t\t\t\tgradientValue~~,\n\~~t\t\t\tlabel~~,\n\~~t\t\t\tcolors:~~ ~~availableColors~~,\n\~~t\t\t\tgradients: availableGradients~~,\n\~~t\t\t}~~,\n\~~t\t\tindex\~~n~~\t\t~~) => {\n\~~t\t\tif~~ ( ! ~~colorValue~~ && ! ~~gradientValue~~ ) {\n\~~t\t\t\treturn~~ ~~null;\n~~\~~t\t\t}\~~n\t\~~t\tlet~~ ~~ariaLabel;\~~n\t\~~t\tif~~ ( ~~colorValue~~ ) {\n\t\t\t\~~tconst~~ ~~colorObject = getColorObjectByColorValue(\~~n\t\t\t\t\~~tavailableColors \|\| colors~~,\n\t\t\t~~\t\tcolorValue\~~n\t\t\t\t);\n\t\t\t\~~tariaLabel~~ = ~~sprintf(\~~n\t\t\t\t~~\tcolorIndicatorAriaLabel,\~~n\t\t\t\t\~~tlabel~~.~~toLowerCase(~~),\n\t\t\t\t\t( ~~colorObject && colorObject~~.~~name~~ ) \|\| ~~colorValue\~~n\t\t\t\t);\n\t\t\t} ~~else~~ {\n\t\~~t\t\tconst~~ ~~gradientObject = __experimentalGetGradientObjectByGradientValue(\~~n\t\t\t\~~t\tavailableGradients~~ ~~\|\| gradients,\n~~\~~t\t\t\t\tcolorValue\~~n\t\t\~~t\t);\~~n\t\t\~~t\tariaLabel~~ = ~~sprintf~~(\n\t\t\t\t~~\tgradientIndicatorAriaLabel~~,\n\t\t\t\t\~~tlabel.toLowerCase(),\~~n\t\t\t\t\t( ~~gradientObject~~ && ~~gradientObject.name~~ ) \|\| ~~gradientValue~~\n\t\t\t\~~t);\~~n\t\t\t}\~~n\n\t\t\treturn~~ (\n\t\t\t\t~~<ColorIndicator~~\n\t\t\t\t\~~tkey=~~{ ~~index }~~\n\t\t\t\t\tcolorValue~~={ colorValue \|\| gradientValue }\~~n\t\t\t\t\~~taria-label={ ariaLabel }\n\~~t\t\~~t\t/>\~~n\t\t\t~~);\n~~\t\t}\n\t~~);\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__experimentalHasMultipleOrigins,\n~~\~~t__experimentalIsRenderedInSidebar,\n~~\~~tenableAlpha,\n~~\t~~...props~~\n} ) => {\n\~~tif (~~\n\t\~~tisEmpty( colors ) &&\n~~\t\~~tisEmpty~~( ~~gradients~~ ) ~~&&\~~n\t\~~tdisableCustomColors &&\n\~~t\~~tdisableCustomGradients &&\n\~~t\~~tevery(\n\~~t\t\~~tsettings,\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\tconst titleElement = (\n\~~t\t~~<span className=\"block-editor-panel-color-gradient-settings__panel-title~~\~~">\n\~~t\t\t~~{ title }\~~n\t\t\t~~<Indicators~~\n\t~~\t\t\tcolors={~~ ~~colors }\~~n\t\t\t~~\tgradients={~~ ~~gradients~~ }\n\t\t\~~t\tsettings~~={ ~~settings~~ }\n\t\t\~~t/>\n~~\t\~~t</span>\~~n\t~~);\n~~\~~n\treturn (\n\~~t\~~t<PanelBody~~\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\ttitle~~={ ~~showTitle~~ ~~? titleElement : undefined~~ }\n\t\t\t~~{ ...props }~~\~~n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings~~={ ~~settings~~ }\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__experimentalHasMultipleOrigins,\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</~~PanelBody~~>\n\t);\n};\n\nconst PanelColorGradientSettingsSingleSelect = ( props ) => {\n\tconst colorGradientSettings = useCommonSingleMultipleSelects();\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettingsMultipleSelect = ( props ) => {\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\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\tevery( colorsAndGradientKeys, ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\tif ( props.__experimentalHasMultipleOrigins ) {\n\t\treturn <PanelColorGradientSettingsMultipleSelect { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSingleSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"]}
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","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","setting","undefined","forEach","colorValue","gradientValue","onColorChange","onGradientChange","PanelColorGradientSettingsSingleSelect","props","colorGradientSettings","PanelColorGradientSettingsMultipleSelect","PanelColorGradientSettings","key","hasOwnProperty"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport { every, 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 useSetting from '../use-setting';\nimport useCommonSingleMultipleSelects from './use-common-single-multiple-selects';\nimport useMultipleOriginColorsAndGradients 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__experimentalHasMultipleOrigins,\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\tevery(\n\t\t\tsettings,\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__experimentalHasMultipleOrigins,\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 PanelColorGradientSettingsSingleSelect = ( props ) => {\n\tconst colorGradientSettings = useCommonSingleMultipleSelects();\n\tcolorGradientSettings.colors = useSetting( 'color.palette' );\n\tcolorGradientSettings.gradients = useSetting( 'color.gradients' );\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettingsMultipleSelect = ( props ) => {\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\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\tevery( colorsAndGradientKeys, ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\tif ( props.__experimentalHasMultipleOrigins ) {\n\t\treturn <PanelColorGradientSettingsMultipleSelect { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSingleSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"]}