@wordpress/block-editor 12.7.0 → 12.8.0

package/build-module/components/global-styles/effects-panel.js

@@ -1,32 +1,29 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-
 import { __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, __experimentalItemGroup as ItemGroup, __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalGrid as Grid, __experimentalHeading as Heading, FlexItem, Dropdown, __experimentalDropdownContentWrapper as DropdownContentWrapper, Button } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useCallback } from '@wordpress/element';
 import { shadow as shadowIcon, Icon, check } from '@wordpress/icons';
+
 /**
  * Internal dependencies
  */
-
 import { getValueFromVariable } from './utils';
 import { setImmutably } from '../../utils/object';
 export function useHasEffectsPanel(settings) {
   const hasShadowControl = useHasShadowControl(settings);
   return hasShadowControl;
 }
-
 function useHasShadowControl(settings) {
   return !!settings?.shadow;
 }
-
 function EffectsToolsPanel({
   resetAllFilter,
   onChange,
@@ -38,14 +35,12 @@ function EffectsToolsPanel({
     const updatedValue = resetAllFilter(value);
     onChange(updatedValue);
   };
-
   return createElement(ToolsPanel, {
     label: __('Effects'),
     resetAll: resetAll,
     panelId: panelId
   }, children);
 }
-
 const DEFAULT_CONTROLS = {
   shadow: true
 };
@@ -60,22 +55,19 @@ export default function EffectsPanel({
 }) {
   const decodeValue = rawValue => getValueFromVariable({
     settings
-  }, '', rawValue); // Shadow
-
+  }, '', rawValue);
 
+  // Shadow
   const hasShadowEnabled = useHasShadowControl(settings);
   const shadow = decodeValue(inheritedValue?.shadow);
-
   const setShadow = newValue => {
     onChange(setImmutably(value, ['shadow'], newValue));
   };
-
   const hasShadow = () => !!value?.shadow;
-
   const resetShadow = () => setShadow(undefined);
-
   const resetAllFilter = useCallback(previousValue => {
-    return { ...previousValue,
+    return {
+      ...previousValue,
       shadow: undefined
     };
   }, []);
@@ -99,7 +91,6 @@ export default function EffectsPanel({
     settings: settings
   }))));
 }
-
 const ShadowPopover = ({
   shadow,
   onShadowChange,
@@ -123,7 +114,6 @@ const ShadowPopover = ({
     }))
   });
 };
-
 function renderShadowToggle() {
   return ({
     onToggle,
@@ -136,7 +126,8 @@ function renderShadowToggle() {
       }),
       'aria-expanded': isOpen
     };
-    return createElement(Button, { ...toggleProps
+    return createElement(Button, {
+      ...toggleProps
     }, createElement(HStack, {
       justify: "flex-start"
     }, createElement(Icon, {
@@ -146,7 +137,6 @@ function renderShadowToggle() {
     }), createElement(FlexItem, null, __('Shadow'))));
   };
 }
-
 function ShadowPopoverContainer({
   shadow,
   onShadowChange,
@@ -168,7 +158,6 @@ function ShadowPopoverContainer({
     onSelect: onShadowChange
   })));
 }
-
 function ShadowPresets({
   presets,
   activeShadow,
@@ -191,7 +180,6 @@ function ShadowPresets({
     shadow: shadow
   })));
 }
-
 function ShadowIndicator({
   label,
   isActive,

package/build-module/components/global-styles/effects-panel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/global-styles/effects-panel.js"],"names":["classnames","__experimentalToolsPanel","ToolsPanel","__experimentalToolsPanelItem","ToolsPanelItem","__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalGrid","Grid","__experimentalHeading","Heading","FlexItem","Dropdown","__experimentalDropdownContentWrapper","DropdownContentWrapper","Button","__","useCallback","shadow","shadowIcon","Icon","check","getValueFromVariable","setImmutably","useHasEffectsPanel","settings","hasShadowControl","useHasShadowControl","EffectsToolsPanel","resetAllFilter","onChange","value","panelId","children","resetAll","updatedValue","DEFAULT_CONTROLS","EffectsPanel","as","Wrapper","inheritedValue","defaultControls","decodeValue","rawValue","hasShadowEnabled","setShadow","newValue","hasShadow","resetShadow","undefined","previousValue","ShadowPopover","onShadowChange","popoverProps","placement","offset","shift","renderShadowToggle","onToggle","isOpen","toggleProps","onClick","className","ShadowPopoverContainer","defaultShadows","presets","default","themeShadows","theme","defaultPresetsEnabled","defaultPresets","shadows","ShadowPresets","activeShadow","onSelect","map","name","slug","ShadowIndicator","label","isActive","boxShadow"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalGrid as Grid,\n\t__experimentalHeading as Heading,\n\tFlexItem,\n\tDropdown,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\nimport { shadow as shadowIcon, Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { getValueFromVariable } from './utils';\nimport { setImmutably } from '../../utils/object';\n\nexport function useHasEffectsPanel( settings ) {\n\tconst hasShadowControl = useHasShadowControl( settings );\n\treturn hasShadowControl;\n}\n\nfunction useHasShadowControl( settings ) {\n\treturn !! settings?.shadow;\n}\n\nfunction EffectsToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Effects' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tshadow: true,\n};\n\nexport default function EffectsPanel( {\n\tas: Wrapper = EffectsToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n} ) {\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\n\t// Shadow\n\tconst hasShadowEnabled = useHasShadowControl( settings );\n\tconst shadow = decodeValue( inheritedValue?.shadow );\n\tconst setShadow = ( newValue ) => {\n\t\tonChange( setImmutably( value, [ 'shadow' ], newValue ) );\n\t};\n\tconst hasShadow = () => !! value?.shadow;\n\tconst resetShadow = () => setShadow( undefined );\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\tshadow: undefined,\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasShadowEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Shadow' ) }\n\t\t\t\t\thasValue={ hasShadow }\n\t\t\t\t\tonDeselect={ resetShadow }\n\t\t\t\t\tisShownByDefault={ defaultControls.shadow }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t\t<ShadowPopover\n\t\t\t\t\t\t\tshadow={ shadow }\n\t\t\t\t\t\t\tonShadowChange={ setShadow }\n\t\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ItemGroup>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n\nconst ShadowPopover = ( { shadow, onShadowChange, settings } ) => {\n\tconst popoverProps = {\n\t\tplacement: 'left-start',\n\t\toffset: 36,\n\t\tshift: true,\n\t};\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ popoverProps }\n\t\t\tclassName=\"block-editor-global-styles-effects-panel__shadow-dropdown\"\n\t\t\trenderToggle={ renderShadowToggle() }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t\t<ShadowPopoverContainer\n\t\t\t\t\t\tshadow={ shadow }\n\t\t\t\t\t\tonShadowChange={ onShadowChange }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t/>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n};\n\nfunction renderShadowToggle() {\n\treturn ( { onToggle, isOpen } ) => {\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames( { 'is-open': isOpen } ),\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<HStack justify=\"flex-start\">\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-effects-panel__toggle-icon\"\n\t\t\t\t\t\ticon={ shadowIcon }\n\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t/>\n\t\t\t\t\t<FlexItem>{ __( 'Shadow' ) }</FlexItem>\n\t\t\t\t</HStack>\n\t\t\t</Button>\n\t\t);\n\t};\n}\n\nfunction ShadowPopoverContainer( { shadow, onShadowChange, settings } ) {\n\tconst defaultShadows = settings?.shadow?.presets?.default;\n\tconst themeShadows = settings?.shadow?.presets?.theme;\n\tconst defaultPresetsEnabled = settings?.shadow?.defaultPresets;\n\n\tconst shadows = [\n\t\t...( defaultPresetsEnabled ? defaultShadows : [] ),\n\t\t...( themeShadows || [] ),\n\t];\n\n\treturn (\n\t\t<div className=\"block-editor-global-styles-effects-panel__shadow-popover-container\">\n\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t<Heading level={ 5 }>{ __( 'Shadow' ) }</Heading>\n\t\t\t\t<ShadowPresets\n\t\t\t\t\tpresets={ shadows }\n\t\t\t\t\tactiveShadow={ shadow }\n\t\t\t\t\tonSelect={ onShadowChange }\n\t\t\t\t/>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n\nfunction ShadowPresets( { presets, activeShadow, onSelect } ) {\n\treturn ! presets ? null : (\n\t\t<Grid columns={ 6 } gap={ 0 } align=\"center\" justify=\"center\">\n\t\t\t{ presets.map( ( { name, slug, shadow } ) => (\n\t\t\t\t<ShadowIndicator\n\t\t\t\t\tkey={ slug }\n\t\t\t\t\tlabel={ name }\n\t\t\t\t\tisActive={ shadow === activeShadow }\n\t\t\t\t\tonSelect={ () =>\n\t\t\t\t\t\tonSelect( shadow === activeShadow ? undefined : shadow )\n\t\t\t\t\t}\n\t\t\t\t\tshadow={ shadow }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Grid>\n\t);\n}\n\nfunction ShadowIndicator( { label, isActive, onSelect, shadow } ) {\n\treturn (\n\t\t<div className=\"block-editor-global-styles-effects-panel__shadow-indicator-wrapper\">\n\t\t\t<Button\n\t\t\t\tclassName=\"block-editor-global-styles-effects-panel__shadow-indicator\"\n\t\t\t\tonClick={ onSelect }\n\t\t\t\tlabel={ label }\n\t\t\t\tstyle={ { boxShadow: shadow } }\n\t\t\t\tshowTooltip\n\t\t\t>\n\t\t\t\t{ isActive && <Icon icon={ check } /> }\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"names":["classnames","__experimentalToolsPanel","ToolsPanel","__experimentalToolsPanelItem","ToolsPanelItem","__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalGrid","Grid","__experimentalHeading","Heading","FlexItem","Dropdown","__experimentalDropdownContentWrapper","DropdownContentWrapper","Button","__","useCallback","shadow","shadowIcon","Icon","check","getValueFromVariable","setImmutably","useHasEffectsPanel","settings","hasShadowControl","useHasShadowControl","EffectsToolsPanel","resetAllFilter","onChange","value","panelId","children","resetAll","updatedValue","createElement","label","DEFAULT_CONTROLS","EffectsPanel","as","Wrapper","inheritedValue","defaultControls","decodeValue","rawValue","hasShadowEnabled","setShadow","newValue","hasShadow","resetShadow","undefined","previousValue","hasValue","onDeselect","isShownByDefault","isBordered","isSeparated","ShadowPopover","onShadowChange","popoverProps","placement","offset","shift","className","renderToggle","renderShadowToggle","renderContent","paddingSize","ShadowPopoverContainer","onToggle","isOpen","toggleProps","onClick","justify","icon","size","defaultShadows","presets","default","themeShadows","theme","defaultPresetsEnabled","defaultPresets","shadows","spacing","level","ShadowPresets","activeShadow","onSelect","columns","gap","align","map","name","slug","ShadowIndicator","key","isActive","style","boxShadow","showTooltip"],"sources":["@wordpress/block-editor/src/components/global-styles/effects-panel.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalGrid as Grid,\n\t__experimentalHeading as Heading,\n\tFlexItem,\n\tDropdown,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\nimport { shadow as shadowIcon, Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { getValueFromVariable } from './utils';\nimport { setImmutably } from '../../utils/object';\n\nexport function useHasEffectsPanel( settings ) {\n\tconst hasShadowControl = useHasShadowControl( settings );\n\treturn hasShadowControl;\n}\n\nfunction useHasShadowControl( settings ) {\n\treturn !! settings?.shadow;\n}\n\nfunction EffectsToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Effects' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tshadow: true,\n};\n\nexport default function EffectsPanel( {\n\tas: Wrapper = EffectsToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n} ) {\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\n\t// Shadow\n\tconst hasShadowEnabled = useHasShadowControl( settings );\n\tconst shadow = decodeValue( inheritedValue?.shadow );\n\tconst setShadow = ( newValue ) => {\n\t\tonChange( setImmutably( value, [ 'shadow' ], newValue ) );\n\t};\n\tconst hasShadow = () => !! value?.shadow;\n\tconst resetShadow = () => setShadow( undefined );\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\tshadow: undefined,\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasShadowEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Shadow' ) }\n\t\t\t\t\thasValue={ hasShadow }\n\t\t\t\t\tonDeselect={ resetShadow }\n\t\t\t\t\tisShownByDefault={ defaultControls.shadow }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t\t<ShadowPopover\n\t\t\t\t\t\t\tshadow={ shadow }\n\t\t\t\t\t\t\tonShadowChange={ setShadow }\n\t\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ItemGroup>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n\nconst ShadowPopover = ( { shadow, onShadowChange, settings } ) => {\n\tconst popoverProps = {\n\t\tplacement: 'left-start',\n\t\toffset: 36,\n\t\tshift: true,\n\t};\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ popoverProps }\n\t\t\tclassName=\"block-editor-global-styles-effects-panel__shadow-dropdown\"\n\t\t\trenderToggle={ renderShadowToggle() }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t\t<ShadowPopoverContainer\n\t\t\t\t\t\tshadow={ shadow }\n\t\t\t\t\t\tonShadowChange={ onShadowChange }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t/>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n};\n\nfunction renderShadowToggle() {\n\treturn ( { onToggle, isOpen } ) => {\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames( { 'is-open': isOpen } ),\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<HStack justify=\"flex-start\">\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-effects-panel__toggle-icon\"\n\t\t\t\t\t\ticon={ shadowIcon }\n\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t/>\n\t\t\t\t\t<FlexItem>{ __( 'Shadow' ) }</FlexItem>\n\t\t\t\t</HStack>\n\t\t\t</Button>\n\t\t);\n\t};\n}\n\nfunction ShadowPopoverContainer( { shadow, onShadowChange, settings } ) {\n\tconst defaultShadows = settings?.shadow?.presets?.default;\n\tconst themeShadows = settings?.shadow?.presets?.theme;\n\tconst defaultPresetsEnabled = settings?.shadow?.defaultPresets;\n\n\tconst shadows = [\n\t\t...( defaultPresetsEnabled ? defaultShadows : [] ),\n\t\t...( themeShadows || [] ),\n\t];\n\n\treturn (\n\t\t<div className=\"block-editor-global-styles-effects-panel__shadow-popover-container\">\n\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t<Heading level={ 5 }>{ __( 'Shadow' ) }</Heading>\n\t\t\t\t<ShadowPresets\n\t\t\t\t\tpresets={ shadows }\n\t\t\t\t\tactiveShadow={ shadow }\n\t\t\t\t\tonSelect={ onShadowChange }\n\t\t\t\t/>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n\nfunction ShadowPresets( { presets, activeShadow, onSelect } ) {\n\treturn ! presets ? null : (\n\t\t<Grid columns={ 6 } gap={ 0 } align=\"center\" justify=\"center\">\n\t\t\t{ presets.map( ( { name, slug, shadow } ) => (\n\t\t\t\t<ShadowIndicator\n\t\t\t\t\tkey={ slug }\n\t\t\t\t\tlabel={ name }\n\t\t\t\t\tisActive={ shadow === activeShadow }\n\t\t\t\t\tonSelect={ () =>\n\t\t\t\t\t\tonSelect( shadow === activeShadow ? undefined : shadow )\n\t\t\t\t\t}\n\t\t\t\t\tshadow={ shadow }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Grid>\n\t);\n}\n\nfunction ShadowIndicator( { label, isActive, onSelect, shadow } ) {\n\treturn (\n\t\t<div className=\"block-editor-global-styles-effects-panel__shadow-indicator-wrapper\">\n\t\t\t<Button\n\t\t\t\tclassName=\"block-editor-global-styles-effects-panel__shadow-indicator\"\n\t\t\t\tonClick={ onSelect }\n\t\t\t\tlabel={ label }\n\t\t\t\tstyle={ { boxShadow: shadow } }\n\t\t\t\tshowTooltip\n\t\t\t>\n\t\t\t\t{ isActive && <Icon icon={ check } /> }\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/global-styles/filters-panel.js

@@ -1,24 +1,22 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-
 import { __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, __experimentalItemGroup as ItemGroup, __experimentalHStack as HStack, __experimentalZStack as ZStack, __experimentalVStack as VStack, __experimentalDropdownContentWrapper as DropdownContentWrapper, Button, ColorIndicator, DuotonePicker, DuotoneSwatch, Dropdown, Flex, FlexItem } from '@wordpress/components';
 import { __, _x } from '@wordpress/i18n';
 import { useCallback, useMemo } from '@wordpress/element';
+
 /**
  * Internal dependencies
  */
-
 import { getValueFromVariable } from './utils';
 import { setImmutably } from '../../utils/object';
 const EMPTY_ARRAY = [];
-
 function useMultiOriginColorPresets(settings, {
   presetSetting,
   defaultSetting
@@ -29,16 +27,13 @@ function useMultiOriginColorPresets(settings, {
   const defaultPresets = settings?.color?.[presetSetting]?.default || EMPTY_ARRAY;
   return useMemo(() => [...userPresets, ...themePresets, ...(disableDefault ? EMPTY_ARRAY : defaultPresets)], [disableDefault, userPresets, themePresets, defaultPresets]);
 }
-
 export function useHasFiltersPanel(settings) {
   const hasDuotone = useHasDuotoneControl(settings);
   return hasDuotone;
 }
-
 function useHasDuotoneControl(settings) {
   return settings.color.customDuotone || settings.color.defaultDuotone;
 }
-
 function FiltersToolsPanel({
   resetAllFilter,
   onChange,
@@ -50,14 +45,12 @@ function FiltersToolsPanel({
     const updatedValue = resetAllFilter(value);
     onChange(updatedValue);
   };
-
   return createElement(ToolsPanel, {
     label: _x('Filters', 'Name for applying graphical effects'),
     resetAll: resetAll,
     panelId: panelId
   }, children);
 }
-
 const DEFAULT_CONTROLS = {
   duotone: true
 };
@@ -68,7 +61,6 @@ const popoverProps = {
   className: 'block-editor-duotone-control__popover',
   headerTitle: __('Duotone')
 };
-
 const LabeledColorIndicator = ({
   indicator,
   label
@@ -86,7 +78,6 @@ const LabeledColorIndicator = ({
 }))), createElement(FlexItem, {
   title: label
 }, label));
-
 export default function FiltersPanel({
   as: Wrapper = FiltersToolsPanel,
   value,
@@ -98,9 +89,9 @@ export default function FiltersPanel({
 }) {
   const decodeValue = rawValue => getValueFromVariable({
     settings
-  }, '', rawValue); // Duotone
-
+  }, '', rawValue);
 
+  // Duotone
   const hasDuotoneEnabled = useHasDuotoneControl(settings);
   const duotonePalette = useMultiOriginColorPresets(settings, {
     presetSetting: 'duotone',
@@ -111,7 +102,6 @@ export default function FiltersPanel({
     defaultSetting: 'defaultPalette'
   });
   const duotone = decodeValue(inheritedValue?.filter?.duotone);
-
   const setDuotone = newValue => {
     const duotonePreset = duotonePalette.find(({
       colors
@@ -121,16 +111,15 @@ export default function FiltersPanel({
     const settedValue = duotonePreset ? `var:preset|duotone|${duotonePreset.slug}` : newValue;
     onChange(setImmutably(value, ['filter', 'duotone'], settedValue));
   };
-
   const hasDuotone = () => !!value?.filter?.duotone;
-
   const resetDuotone = () => setDuotone(undefined);
-
   const disableCustomColors = !settings?.color?.custom;
   const disableCustomDuotone = !settings?.color?.customDuotone || colorPalette?.length === 0 && disableCustomColors;
   const resetAllFilter = useCallback(previousValue => {
-    return { ...previousValue,
-      filter: { ...previousValue.filter,
+    return {
+      ...previousValue,
+      filter: {
+        ...previousValue.filter,
         duotone: undefined
       }
     };
@@ -163,7 +152,8 @@ export default function FiltersPanel({
       return createElement(ItemGroup, {
         isBordered: true,
         isSeparated: true
-      }, createElement(Button, { ...toggleProps
+      }, createElement(Button, {
+        ...toggleProps
       }, createElement(LabeledColorIndicator, {
         indicator: duotone,
         label: __('Duotone')

package/build-module/components/global-styles/filters-panel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/global-styles/filters-panel.js"],"names":["classnames","__experimentalToolsPanel","ToolsPanel","__experimentalToolsPanelItem","ToolsPanelItem","__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalZStack","ZStack","__experimentalVStack","VStack","__experimentalDropdownContentWrapper","DropdownContentWrapper","Button","ColorIndicator","DuotonePicker","DuotoneSwatch","Dropdown","Flex","FlexItem","__","_x","useCallback","useMemo","getValueFromVariable","setImmutably","EMPTY_ARRAY","useMultiOriginColorPresets","settings","presetSetting","defaultSetting","disableDefault","color","userPresets","custom","themePresets","theme","defaultPresets","default","useHasFiltersPanel","hasDuotone","useHasDuotoneControl","customDuotone","defaultDuotone","FiltersToolsPanel","resetAllFilter","onChange","value","panelId","children","resetAll","updatedValue","DEFAULT_CONTROLS","duotone","popoverProps","placement","offset","shift","className","headerTitle","LabeledColorIndicator","indicator","label","FiltersPanel","as","Wrapper","inheritedValue","defaultControls","decodeValue","rawValue","hasDuotoneEnabled","duotonePalette","colorPalette","filter","setDuotone","newValue","duotonePreset","find","colors","settedValue","slug","resetDuotone","undefined","disableCustomColors","disableCustomDuotone","length","previousValue","onToggle","isOpen","toggleProps","onClick"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalZStack as ZStack,\n\t__experimentalVStack as VStack,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n\tColorIndicator,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tDropdown,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getValueFromVariable } from './utils';\nimport { setImmutably } from '../../utils/object';\n\nconst EMPTY_ARRAY = [];\nfunction useMultiOriginColorPresets(\n\tsettings,\n\t{ presetSetting, defaultSetting }\n) {\n\tconst disableDefault = ! settings?.color?.[ defaultSetting ];\n\tconst userPresets =\n\t\tsettings?.color?.[ presetSetting ]?.custom || EMPTY_ARRAY;\n\tconst themePresets =\n\t\tsettings?.color?.[ presetSetting ]?.theme || EMPTY_ARRAY;\n\tconst defaultPresets =\n\t\tsettings?.color?.[ presetSetting ]?.default || EMPTY_ARRAY;\n\treturn useMemo(\n\t\t() => [\n\t\t\t...userPresets,\n\t\t\t...themePresets,\n\t\t\t...( disableDefault ? EMPTY_ARRAY : defaultPresets ),\n\t\t],\n\t\t[ disableDefault, userPresets, themePresets, defaultPresets ]\n\t);\n}\n\nexport function useHasFiltersPanel( settings ) {\n\tconst hasDuotone = useHasDuotoneControl( settings );\n\n\treturn hasDuotone;\n}\n\nfunction useHasDuotoneControl( settings ) {\n\treturn settings.color.customDuotone || settings.color.defaultDuotone;\n}\n\nfunction FiltersToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ _x( 'Filters', 'Name for applying graphical effects' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tduotone: true,\n};\n\nconst popoverProps = {\n\tplacement: 'left-start',\n\toffset: 36,\n\tshift: true,\n\tclassName: 'block-editor-duotone-control__popover',\n\theaderTitle: __( 'Duotone' ),\n};\n\nconst LabeledColorIndicator = ( { indicator, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t<Flex expanded={ false }>\n\t\t\t\t{ indicator === 'unset' || ! indicator ? (\n\t\t\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t\t\t) : (\n\t\t\t\t\t<DuotoneSwatch values={ indicator } />\n\t\t\t\t) }\n\t\t\t</Flex>\n\t\t</ZStack>\n\t\t<FlexItem title={ label }>{ label }</FlexItem>\n\t</HStack>\n);\n\nexport default function FiltersPanel( {\n\tas: Wrapper = FiltersToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n} ) {\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\n\t// Duotone\n\tconst hasDuotoneEnabled = useHasDuotoneControl( settings );\n\tconst duotonePalette = useMultiOriginColorPresets( settings, {\n\t\tpresetSetting: 'duotone',\n\t\tdefaultSetting: 'defaultDuotone',\n\t} );\n\tconst colorPalette = useMultiOriginColorPresets( settings, {\n\t\tpresetSetting: 'palette',\n\t\tdefaultSetting: 'defaultPalette',\n\t} );\n\tconst duotone = decodeValue( inheritedValue?.filter?.duotone );\n\tconst setDuotone = ( newValue ) => {\n\t\tconst duotonePreset = duotonePalette.find( ( { colors } ) => {\n\t\t\treturn colors === newValue;\n\t\t} );\n\t\tconst settedValue = duotonePreset\n\t\t\t? `var:preset|duotone|${ duotonePreset.slug }`\n\t\t\t: newValue;\n\t\tonChange( setImmutably( value, [ 'filter', 'duotone' ], settedValue ) );\n\t};\n\tconst hasDuotone = () => !! value?.filter?.duotone;\n\tconst resetDuotone = () => setDuotone( undefined );\n\n\tconst disableCustomColors = ! settings?.color?.custom;\n\tconst disableCustomDuotone =\n\t\t! settings?.color?.customDuotone ||\n\t\t( colorPalette?.length === 0 && disableCustomColors );\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\tfilter: {\n\t\t\t\t...previousValue.filter,\n\t\t\t\tduotone: undefined,\n\t\t\t},\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasDuotoneEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Duotone' ) }\n\t\t\t\t\thasValue={ hasDuotone }\n\t\t\t\t\tonDeselect={ resetDuotone }\n\t\t\t\t\tisShownByDefault={ defaultControls.duotone }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<Dropdown\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-filters-panel__dropdown\"\n\t\t\t\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\t\t\t\tconst toggleProps = {\n\t\t\t\t\t\t\t\tonClick: onToggle,\n\t\t\t\t\t\t\t\tclassName: classnames( { 'is-open': isOpen } ),\n\t\t\t\t\t\t\t\t'aria-expanded': isOpen,\n\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t\t\t\t\t<Button { ...toggleProps }>\n\t\t\t\t\t\t\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\t\t\t\t\t\t\tindicator={ duotone }\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Duotone' ) }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t\t\t\t\t<VStack>\n\t\t\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\t\t\t\t\tdisableCustomColors={\n\t\t\t\t\t\t\t\t\t\t\tdisableCustomColors\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tdisableCustomDuotone={\n\t\t\t\t\t\t\t\t\t\t\tdisableCustomDuotone\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tvalue={ duotone }\n\t\t\t\t\t\t\t\t\t\tonChange={ setDuotone }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"]}
+{"version":3,"names":["classnames","__experimentalToolsPanel","ToolsPanel","__experimentalToolsPanelItem","ToolsPanelItem","__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalZStack","ZStack","__experimentalVStack","VStack","__experimentalDropdownContentWrapper","DropdownContentWrapper","Button","ColorIndicator","DuotonePicker","DuotoneSwatch","Dropdown","Flex","FlexItem","__","_x","useCallback","useMemo","getValueFromVariable","setImmutably","EMPTY_ARRAY","useMultiOriginColorPresets","settings","presetSetting","defaultSetting","disableDefault","color","userPresets","custom","themePresets","theme","defaultPresets","default","useHasFiltersPanel","hasDuotone","useHasDuotoneControl","customDuotone","defaultDuotone","FiltersToolsPanel","resetAllFilter","onChange","value","panelId","children","resetAll","updatedValue","createElement","label","DEFAULT_CONTROLS","duotone","popoverProps","placement","offset","shift","className","headerTitle","LabeledColorIndicator","indicator","justify","isLayered","expanded","values","title","FiltersPanel","as","Wrapper","inheritedValue","defaultControls","decodeValue","rawValue","hasDuotoneEnabled","duotonePalette","colorPalette","filter","setDuotone","newValue","duotonePreset","find","colors","settedValue","slug","resetDuotone","undefined","disableCustomColors","disableCustomDuotone","length","previousValue","hasValue","onDeselect","isShownByDefault","renderToggle","onToggle","isOpen","toggleProps","onClick","isBordered","isSeparated","renderContent","paddingSize"],"sources":["@wordpress/block-editor/src/components/global-styles/filters-panel.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalZStack as ZStack,\n\t__experimentalVStack as VStack,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n\tColorIndicator,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tDropdown,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getValueFromVariable } from './utils';\nimport { setImmutably } from '../../utils/object';\n\nconst EMPTY_ARRAY = [];\nfunction useMultiOriginColorPresets(\n\tsettings,\n\t{ presetSetting, defaultSetting }\n) {\n\tconst disableDefault = ! settings?.color?.[ defaultSetting ];\n\tconst userPresets =\n\t\tsettings?.color?.[ presetSetting ]?.custom || EMPTY_ARRAY;\n\tconst themePresets =\n\t\tsettings?.color?.[ presetSetting ]?.theme || EMPTY_ARRAY;\n\tconst defaultPresets =\n\t\tsettings?.color?.[ presetSetting ]?.default || EMPTY_ARRAY;\n\treturn useMemo(\n\t\t() => [\n\t\t\t...userPresets,\n\t\t\t...themePresets,\n\t\t\t...( disableDefault ? EMPTY_ARRAY : defaultPresets ),\n\t\t],\n\t\t[ disableDefault, userPresets, themePresets, defaultPresets ]\n\t);\n}\n\nexport function useHasFiltersPanel( settings ) {\n\tconst hasDuotone = useHasDuotoneControl( settings );\n\n\treturn hasDuotone;\n}\n\nfunction useHasDuotoneControl( settings ) {\n\treturn settings.color.customDuotone || settings.color.defaultDuotone;\n}\n\nfunction FiltersToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ _x( 'Filters', 'Name for applying graphical effects' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tduotone: true,\n};\n\nconst popoverProps = {\n\tplacement: 'left-start',\n\toffset: 36,\n\tshift: true,\n\tclassName: 'block-editor-duotone-control__popover',\n\theaderTitle: __( 'Duotone' ),\n};\n\nconst LabeledColorIndicator = ( { indicator, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t<Flex expanded={ false }>\n\t\t\t\t{ indicator === 'unset' || ! indicator ? (\n\t\t\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t\t\t) : (\n\t\t\t\t\t<DuotoneSwatch values={ indicator } />\n\t\t\t\t) }\n\t\t\t</Flex>\n\t\t</ZStack>\n\t\t<FlexItem title={ label }>{ label }</FlexItem>\n\t</HStack>\n);\n\nexport default function FiltersPanel( {\n\tas: Wrapper = FiltersToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n} ) {\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\n\t// Duotone\n\tconst hasDuotoneEnabled = useHasDuotoneControl( settings );\n\tconst duotonePalette = useMultiOriginColorPresets( settings, {\n\t\tpresetSetting: 'duotone',\n\t\tdefaultSetting: 'defaultDuotone',\n\t} );\n\tconst colorPalette = useMultiOriginColorPresets( settings, {\n\t\tpresetSetting: 'palette',\n\t\tdefaultSetting: 'defaultPalette',\n\t} );\n\tconst duotone = decodeValue( inheritedValue?.filter?.duotone );\n\tconst setDuotone = ( newValue ) => {\n\t\tconst duotonePreset = duotonePalette.find( ( { colors } ) => {\n\t\t\treturn colors === newValue;\n\t\t} );\n\t\tconst settedValue = duotonePreset\n\t\t\t? `var:preset|duotone|${ duotonePreset.slug }`\n\t\t\t: newValue;\n\t\tonChange( setImmutably( value, [ 'filter', 'duotone' ], settedValue ) );\n\t};\n\tconst hasDuotone = () => !! value?.filter?.duotone;\n\tconst resetDuotone = () => setDuotone( undefined );\n\n\tconst disableCustomColors = ! settings?.color?.custom;\n\tconst disableCustomDuotone =\n\t\t! settings?.color?.customDuotone ||\n\t\t( colorPalette?.length === 0 && disableCustomColors );\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\tfilter: {\n\t\t\t\t...previousValue.filter,\n\t\t\t\tduotone: undefined,\n\t\t\t},\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasDuotoneEnabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Duotone' ) }\n\t\t\t\t\thasValue={ hasDuotone }\n\t\t\t\t\tonDeselect={ resetDuotone }\n\t\t\t\t\tisShownByDefault={ defaultControls.duotone }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<Dropdown\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-filters-panel__dropdown\"\n\t\t\t\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\t\t\t\tconst toggleProps = {\n\t\t\t\t\t\t\t\tonClick: onToggle,\n\t\t\t\t\t\t\t\tclassName: classnames( { 'is-open': isOpen } ),\n\t\t\t\t\t\t\t\t'aria-expanded': isOpen,\n\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t\t\t\t\t<Button { ...toggleProps }>\n\t\t\t\t\t\t\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\t\t\t\t\t\t\tindicator={ duotone }\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Duotone' ) }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t\t\t\t\t<VStack>\n\t\t\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\t\t\t\t\tdisableCustomColors={\n\t\t\t\t\t\t\t\t\t\t\tdisableCustomColors\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tdisableCustomDuotone={\n\t\t\t\t\t\t\t\t\t\t\tdisableCustomDuotone\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tvalue={ duotone }\n\t\t\t\t\t\t\t\t\t\tonChange={ setDuotone }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/global-styles/get-block-css-selector.js

@@ -3,6 +3,7 @@
  */
 import { scopeSelector } from './utils';
 import { getValueFromObjectPath } from '../../utils/object';
+
 /**
  * Determine the CSS selector for the block type and target provided, returning
  * it if available.
@@ -14,12 +15,10 @@ import { getValueFromObjectPath } from '../../utils/object';
  *
  * @return {?string} The CSS selector or `null` if no selector available.
  */
-
 export function getBlockCSSSelector(blockType, target = 'root', options = {}) {
   if (!target) {
     return null;
   }
-
   const {
     fallback = false
   } = options;
@@ -29,12 +28,13 @@ export function getBlockCSSSelector(blockType, target = 'root', options = {}) {
     supports
   } = blockType;
   const hasSelectors = selectors && Object.keys(selectors).length > 0;
-  const path = Array.isArray(target) ? target.join('.') : target; // Root selector.
+  const path = Array.isArray(target) ? target.join('.') : target;
+
+  // Root selector.
+
   // Calculated before returning as it can be used as a fallback for feature
   // selectors later on.
-
   let rootSelector = null;
-
   if (hasSelectors && selectors.root) {
     // Use the selectors API if available.
     rootSelector = selectors?.root;
@@ -44,59 +44,64 @@ export function getBlockCSSSelector(blockType, target = 'root', options = {}) {
   } else {
     // If no root selector found, generate default block class selector.
     rootSelector = '.wp-block-' + name.replace('core/', '').replace('/', '-');
-  } // Return selector if it's the root target we are looking for.
-
+  }
 
+  // Return selector if it's the root target we are looking for.
   if (path === 'root') {
     return rootSelector;
-  } // If target is not `root` or `duotone` we have a feature or subfeature
-  // as the target. If the target is a string convert to an array.
-
+  }
 
-  const pathArray = Array.isArray(target) ? target : target.split('.'); // Feature selectors ( may fallback to root selector );
+  // If target is not `root` or `duotone` we have a feature or subfeature
+  // as the target. If the target is a string convert to an array.
+  const pathArray = Array.isArray(target) ? target : target.split('.');
 
+  // Feature selectors ( may fallback to root selector );
   if (pathArray.length === 1) {
-    const fallbackSelector = fallback ? rootSelector : null; // Prefer the selectors API if available.
+    const fallbackSelector = fallback ? rootSelector : null;
 
+    // Prefer the selectors API if available.
     if (hasSelectors) {
       // Get selector from either `feature.root` or shorthand path.
-      const featureSelector = getValueFromObjectPath(selectors, `${path}.root`, null) || getValueFromObjectPath(selectors, path, null); // Return feature selector if found or any available fallback.
+      const featureSelector = getValueFromObjectPath(selectors, `${path}.root`, null) || getValueFromObjectPath(selectors, path, null);
 
+      // Return feature selector if found or any available fallback.
       return featureSelector || fallbackSelector;
-    } // Try getting old experimental supports selector value.
-
+    }
 
-    const featureSelector = getValueFromObjectPath(supports, `${path}.__experimentalSelector`, null); // If nothing to work with, provide fallback selector if available.
+    // Try getting old experimental supports selector value.
+    const featureSelector = getValueFromObjectPath(supports, `${path}.__experimentalSelector`, null);
 
+    // If nothing to work with, provide fallback selector if available.
     if (!featureSelector) {
       return fallbackSelector;
-    } // Scope the feature selector by the block's root selector.
-
+    }
 
+    // Scope the feature selector by the block's root selector.
     return scopeSelector(rootSelector, featureSelector);
-  } // Subfeature selector.
-  // This may fallback either to parent feature or root selector.
-
+  }
 
-  let subfeatureSelector; // Use selectors API if available.
+  // Subfeature selector.
+  // This may fallback either to parent feature or root selector.
+  let subfeatureSelector;
 
+  // Use selectors API if available.
   if (hasSelectors) {
     subfeatureSelector = getValueFromObjectPath(selectors, path, null);
-  } // Only return if we have a subfeature selector.
-
+  }
 
+  // Only return if we have a subfeature selector.
   if (subfeatureSelector) {
     return subfeatureSelector;
-  } // To this point we don't have a subfeature selector. If a fallback has been
+  }
+
+  // To this point we don't have a subfeature selector. If a fallback has been
   // requested, remove subfeature from target path and return results of a
   // call for the parent feature's selector.
-
-
   if (fallback) {
     return getBlockCSSSelector(blockType, pathArray[0], options);
-  } // We tried.
-
+  }
 
+  // We tried.
   return null;
 }
 //# sourceMappingURL=get-block-css-selector.js.map

package/build-module/components/global-styles/get-block-css-selector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/global-styles/get-block-css-selector.js"],"names":["scopeSelector","getValueFromObjectPath","getBlockCSSSelector","blockType","target","options","fallback","name","selectors","supports","hasSelectors","Object","keys","length","path","Array","isArray","join","rootSelector","root","__experimentalSelector","replace","pathArray","split","fallbackSelector","featureSelector","subfeatureSelector"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { scopeSelector } from './utils';\nimport { getValueFromObjectPath } from '../../utils/object';\n\n/**\n * Determine the CSS selector for the block type and target provided, returning\n * it if available.\n *\n * @param {import('@wordpress/blocks').Block} blockType        The block's type.\n * @param {string|string[]}                   target           The desired selector's target e.g. `root`, delimited string, or array path.\n * @param {Object}                            options          Options object.\n * @param {boolean}                           options.fallback Whether or not to fallback to broader selector.\n *\n * @return {?string} The CSS selector or `null` if no selector available.\n */\nexport function getBlockCSSSelector(\n\tblockType,\n\ttarget = 'root',\n\toptions = {}\n) {\n\tif ( ! target ) {\n\t\treturn null;\n\t}\n\n\tconst { fallback = false } = options;\n\tconst { name, selectors, supports } = blockType;\n\n\tconst hasSelectors = selectors && Object.keys( selectors ).length > 0;\n\tconst path = Array.isArray( target ) ? target.join( '.' ) : target;\n\n\t// Root selector.\n\n\t// Calculated before returning as it can be used as a fallback for feature\n\t// selectors later on.\n\tlet rootSelector = null;\n\n\tif ( hasSelectors && selectors.root ) {\n\t\t// Use the selectors API if available.\n\t\trootSelector = selectors?.root;\n\t} else if ( supports?.__experimentalSelector ) {\n\t\t// Use the old experimental selector supports property if set.\n\t\trootSelector = supports.__experimentalSelector;\n\t} else {\n\t\t// If no root selector found, generate default block class selector.\n\t\trootSelector =\n\t\t\t'.wp-block-' + name.replace( 'core/', '' ).replace( '/', '-' );\n\t}\n\n\t// Return selector if it's the root target we are looking for.\n\tif ( path === 'root' ) {\n\t\treturn rootSelector;\n\t}\n\n\t// If target is not `root` or `duotone` we have a feature or subfeature\n\t// as the target. If the target is a string convert to an array.\n\tconst pathArray = Array.isArray( target ) ? target : target.split( '.' );\n\n\t// Feature selectors ( may fallback to root selector );\n\tif ( pathArray.length === 1 ) {\n\t\tconst fallbackSelector = fallback ? rootSelector : null;\n\n\t\t// Prefer the selectors API if available.\n\t\tif ( hasSelectors ) {\n\t\t\t// Get selector from either `feature.root` or shorthand path.\n\t\t\tconst featureSelector =\n\t\t\t\tgetValueFromObjectPath( selectors, `${ path }.root`, null ) ||\n\t\t\t\tgetValueFromObjectPath( selectors, path, null );\n\n\t\t\t// Return feature selector if found or any available fallback.\n\t\t\treturn featureSelector || fallbackSelector;\n\t\t}\n\n\t\t// Try getting old experimental supports selector value.\n\t\tconst featureSelector = getValueFromObjectPath(\n\t\t\tsupports,\n\t\t\t`${ path }.__experimentalSelector`,\n\t\t\tnull\n\t\t);\n\n\t\t// If nothing to work with, provide fallback selector if available.\n\t\tif ( ! featureSelector ) {\n\t\t\treturn fallbackSelector;\n\t\t}\n\n\t\t// Scope the feature selector by the block's root selector.\n\t\treturn scopeSelector( rootSelector, featureSelector );\n\t}\n\n\t// Subfeature selector.\n\t// This may fallback either to parent feature or root selector.\n\tlet subfeatureSelector;\n\n\t// Use selectors API if available.\n\tif ( hasSelectors ) {\n\t\tsubfeatureSelector = getValueFromObjectPath( selectors, path, null );\n\t}\n\n\t// Only return if we have a subfeature selector.\n\tif ( subfeatureSelector ) {\n\t\treturn subfeatureSelector;\n\t}\n\n\t// To this point we don't have a subfeature selector. If a fallback has been\n\t// requested, remove subfeature from target path and return results of a\n\t// call for the parent feature's selector.\n\tif ( fallback ) {\n\t\treturn getBlockCSSSelector( blockType, pathArray[ 0 ], options );\n\t}\n\n\t// We tried.\n\treturn null;\n}\n"]}
+{"version":3,"names":["scopeSelector","getValueFromObjectPath","getBlockCSSSelector","blockType","target","options","fallback","name","selectors","supports","hasSelectors","Object","keys","length","path","Array","isArray","join","rootSelector","root","__experimentalSelector","replace","pathArray","split","fallbackSelector","featureSelector","subfeatureSelector"],"sources":["@wordpress/block-editor/src/components/global-styles/get-block-css-selector.js"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { scopeSelector } from './utils';\nimport { getValueFromObjectPath } from '../../utils/object';\n\n/**\n * Determine the CSS selector for the block type and target provided, returning\n * it if available.\n *\n * @param {import('@wordpress/blocks').Block} blockType        The block's type.\n * @param {string|string[]}                   target           The desired selector's target e.g. `root`, delimited string, or array path.\n * @param {Object}                            options          Options object.\n * @param {boolean}                           options.fallback Whether or not to fallback to broader selector.\n *\n * @return {?string} The CSS selector or `null` if no selector available.\n */\nexport function getBlockCSSSelector(\n\tblockType,\n\ttarget = 'root',\n\toptions = {}\n) {\n\tif ( ! target ) {\n\t\treturn null;\n\t}\n\n\tconst { fallback = false } = options;\n\tconst { name, selectors, supports } = blockType;\n\n\tconst hasSelectors = selectors && Object.keys( selectors ).length > 0;\n\tconst path = Array.isArray( target ) ? target.join( '.' ) : target;\n\n\t// Root selector.\n\n\t// Calculated before returning as it can be used as a fallback for feature\n\t// selectors later on.\n\tlet rootSelector = null;\n\n\tif ( hasSelectors && selectors.root ) {\n\t\t// Use the selectors API if available.\n\t\trootSelector = selectors?.root;\n\t} else if ( supports?.__experimentalSelector ) {\n\t\t// Use the old experimental selector supports property if set.\n\t\trootSelector = supports.__experimentalSelector;\n\t} else {\n\t\t// If no root selector found, generate default block class selector.\n\t\trootSelector =\n\t\t\t'.wp-block-' + name.replace( 'core/', '' ).replace( '/', '-' );\n\t}\n\n\t// Return selector if it's the root target we are looking for.\n\tif ( path === 'root' ) {\n\t\treturn rootSelector;\n\t}\n\n\t// If target is not `root` or `duotone` we have a feature or subfeature\n\t// as the target. If the target is a string convert to an array.\n\tconst pathArray = Array.isArray( target ) ? target : target.split( '.' );\n\n\t// Feature selectors ( may fallback to root selector );\n\tif ( pathArray.length === 1 ) {\n\t\tconst fallbackSelector = fallback ? rootSelector : null;\n\n\t\t// Prefer the selectors API if available.\n\t\tif ( hasSelectors ) {\n\t\t\t// Get selector from either `feature.root` or shorthand path.\n\t\t\tconst featureSelector =\n\t\t\t\tgetValueFromObjectPath( selectors, `${ path }.root`, null ) ||\n\t\t\t\tgetValueFromObjectPath( selectors, path, null );\n\n\t\t\t// Return feature selector if found or any available fallback.\n\t\t\treturn featureSelector || fallbackSelector;\n\t\t}\n\n\t\t// Try getting old experimental supports selector value.\n\t\tconst featureSelector = getValueFromObjectPath(\n\t\t\tsupports,\n\t\t\t`${ path }.__experimentalSelector`,\n\t\t\tnull\n\t\t);\n\n\t\t// If nothing to work with, provide fallback selector if available.\n\t\tif ( ! featureSelector ) {\n\t\t\treturn fallbackSelector;\n\t\t}\n\n\t\t// Scope the feature selector by the block's root selector.\n\t\treturn scopeSelector( rootSelector, featureSelector );\n\t}\n\n\t// Subfeature selector.\n\t// This may fallback either to parent feature or root selector.\n\tlet subfeatureSelector;\n\n\t// Use selectors API if available.\n\tif ( hasSelectors ) {\n\t\tsubfeatureSelector = getValueFromObjectPath( selectors, path, null );\n\t}\n\n\t// Only return if we have a subfeature selector.\n\tif ( subfeatureSelector ) {\n\t\treturn subfeatureSelector;\n\t}\n\n\t// To this point we don't have a subfeature selector. If a fallback has been\n\t// requested, remove subfeature from target path and return results of a\n\t// call for the parent feature's selector.\n\tif ( fallback ) {\n\t\treturn getBlockCSSSelector( blockType, pathArray[ 0 ], options );\n\t}\n\n\t// We tried.\n\treturn null;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,SAAS;AACvC,SAASC,sBAAsB,QAAQ,oBAAoB;;AAE3D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,mBAAmBA,CAClCC,SAAS,EACTC,MAAM,GAAG,MAAM,EACfC,OAAO,GAAG,CAAC,CAAC,EACX;EACD,IAAK,CAAED,MAAM,EAAG;IACf,OAAO,IAAI;EACZ;EAEA,MAAM;IAAEE,QAAQ,GAAG;EAAM,CAAC,GAAGD,OAAO;EACpC,MAAM;IAAEE,IAAI;IAAEC,SAAS;IAAEC;EAAS,CAAC,GAAGN,SAAS;EAE/C,MAAMO,YAAY,GAAGF,SAAS,IAAIG,MAAM,CAACC,IAAI,CAAEJ,SAAU,CAAC,CAACK,MAAM,GAAG,CAAC;EACrE,MAAMC,IAAI,GAAGC,KAAK,CAACC,OAAO,CAAEZ,MAAO,CAAC,GAAGA,MAAM,CAACa,IAAI,CAAE,GAAI,CAAC,GAAGb,MAAM;;EAElE;;EAEA;EACA;EACA,IAAIc,YAAY,GAAG,IAAI;EAEvB,IAAKR,YAAY,IAAIF,SAAS,CAACW,IAAI,EAAG;IACrC;IACAD,YAAY,GAAGV,SAAS,EAAEW,IAAI;EAC/B,CAAC,MAAM,IAAKV,QAAQ,EAAEW,sBAAsB,EAAG;IAC9C;IACAF,YAAY,GAAGT,QAAQ,CAACW,sBAAsB;EAC/C,CAAC,MAAM;IACN;IACAF,YAAY,GACX,YAAY,GAAGX,IAAI,CAACc,OAAO,CAAE,OAAO,EAAE,EAAG,CAAC,CAACA,OAAO,CAAE,GAAG,EAAE,GAAI,CAAC;EAChE;;EAEA;EACA,IAAKP,IAAI,KAAK,MAAM,EAAG;IACtB,OAAOI,YAAY;EACpB;;EAEA;EACA;EACA,MAAMI,SAAS,GAAGP,KAAK,CAACC,OAAO,CAAEZ,MAAO,CAAC,GAAGA,MAAM,GAAGA,MAAM,CAACmB,KAAK,CAAE,GAAI,CAAC;;EAExE;EACA,IAAKD,SAAS,CAACT,MAAM,KAAK,CAAC,EAAG;IAC7B,MAAMW,gBAAgB,GAAGlB,QAAQ,GAAGY,YAAY,GAAG,IAAI;;IAEvD;IACA,IAAKR,YAAY,EAAG;MACnB;MACA,MAAMe,eAAe,GACpBxB,sBAAsB,CAAEO,SAAS,EAAG,GAAGM,IAAM,OAAM,EAAE,IAAK,CAAC,IAC3Db,sBAAsB,CAAEO,SAAS,EAAEM,IAAI,EAAE,IAAK,CAAC;;MAEhD;MACA,OAAOW,eAAe,IAAID,gBAAgB;IAC3C;;IAEA;IACA,MAAMC,eAAe,GAAGxB,sBAAsB,CAC7CQ,QAAQ,EACP,GAAGK,IAAM,yBAAwB,EAClC,IACD,CAAC;;IAED;IACA,IAAK,CAAEW,eAAe,EAAG;MACxB,OAAOD,gBAAgB;IACxB;;IAEA;IACA,OAAOxB,aAAa,CAAEkB,YAAY,EAAEO,eAAgB,CAAC;EACtD;;EAEA;EACA;EACA,IAAIC,kBAAkB;;EAEtB;EACA,IAAKhB,YAAY,EAAG;IACnBgB,kBAAkB,GAAGzB,sBAAsB,CAAEO,SAAS,EAAEM,IAAI,EAAE,IAAK,CAAC;EACrE;;EAEA;EACA,IAAKY,kBAAkB,EAAG;IACzB,OAAOA,kBAAkB;EAC1B;;EAEA;EACA;EACA;EACA,IAAKpB,QAAQ,EAAG;IACf,OAAOJ,mBAAmB,CAAEC,SAAS,EAAEmB,SAAS,CAAE,CAAC,CAAE,EAAEjB,OAAQ,CAAC;EACjE;;EAEA;EACA,OAAO,IAAI;AACZ"}