@wordpress/block-editor 12.18.1 → 12.19.0

package/build/hooks/effects.js

@@ -1,66 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EFFECTS_SUPPORT_KEYS = void 0;
-exports.EffectsPanel = EffectsPanel;
-exports.SHADOW_SUPPORT_KEY = void 0;
-exports.hasEffectsSupport = hasEffectsSupport;
-var _react = require("react");
-var _blocks = require("@wordpress/blocks");
-var _data = require("@wordpress/data");
-var _effectsPanel = _interopRequireWildcard(require("../components/global-styles/effects-panel"));
-var _components = require("../components");
-var _store = require("../store");
-var _utils = require("./utils");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const SHADOW_SUPPORT_KEY = 'shadow';
-exports.SHADOW_SUPPORT_KEY = SHADOW_SUPPORT_KEY;
-const EFFECTS_SUPPORT_KEYS = [SHADOW_SUPPORT_KEY];
-exports.EFFECTS_SUPPORT_KEYS = EFFECTS_SUPPORT_KEYS;
-function hasEffectsSupport(blockName) {
-  return EFFECTS_SUPPORT_KEYS.some(key => (0, _blocks.hasBlockSupport)(blockName, key));
-}
-function EffectsInspectorControl({
-  children,
-  resetAllFilter
-}) {
-  return (0, _react.createElement)(_components.InspectorControls, {
-    group: "effects",
-    resetAllFilter: resetAllFilter
-  }, children);
-}
-function EffectsPanel({
-  clientId,
-  setAttributes,
-  settings
-}) {
-  const isEnabled = (0, _effectsPanel.useHasEffectsPanel)(settings);
-  const value = (0, _data.useSelect)(select => select(_store.store).getBlockAttributes(clientId)?.style, [clientId]);
-  const onChange = newStyle => {
-    setAttributes({
-      style: (0, _utils.cleanEmptyObject)(newStyle)
-    });
-  };
-  if (!isEnabled) {
-    return null;
-  }
-  return (0, _react.createElement)(_effectsPanel.default, {
-    as: EffectsInspectorControl,
-    panelId: clientId,
-    settings: settings,
-    value: value,
-    onChange: onChange
-  });
-}
-//# sourceMappingURL=effects.js.map

package/build/hooks/effects.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_blocks","require","_data","_effectsPanel","_interopRequireWildcard","_components","_store","_utils","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","SHADOW_SUPPORT_KEY","exports","EFFECTS_SUPPORT_KEYS","hasEffectsSupport","blockName","some","hasBlockSupport","EffectsInspectorControl","children","resetAllFilter","_react","createElement","InspectorControls","group","EffectsPanel","clientId","setAttributes","settings","isEnabled","useHasEffectsPanel","value","useSelect","select","blockEditorStore","getBlockAttributes","style","onChange","newStyle","cleanEmptyObject","as","panelId"],"sources":["@wordpress/block-editor/src/hooks/effects.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\n/**\n * Internal dependencies\n */\nimport StylesEffectsPanel, {\n\tuseHasEffectsPanel,\n} from '../components/global-styles/effects-panel';\nimport { InspectorControls } from '../components';\nimport { store as blockEditorStore } from '../store';\nimport { cleanEmptyObject } from './utils';\n\nexport const SHADOW_SUPPORT_KEY = 'shadow';\nexport const EFFECTS_SUPPORT_KEYS = [ SHADOW_SUPPORT_KEY ];\n\nexport function hasEffectsSupport( blockName ) {\n\treturn EFFECTS_SUPPORT_KEYS.some( ( key ) =>\n\t\thasBlockSupport( blockName, key )\n\t);\n}\n\nfunction EffectsInspectorControl( { children, resetAllFilter } ) {\n\treturn (\n\t\t<InspectorControls group=\"effects\" resetAllFilter={ resetAllFilter }>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\nexport function EffectsPanel( { clientId, setAttributes, settings } ) {\n\tconst isEnabled = useHasEffectsPanel( settings );\n\tconst value = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId )?.style,\n\t\t[ clientId ]\n\t);\n\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( { style: cleanEmptyObject( newStyle ) } );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StylesEffectsPanel\n\t\t\tas={ EffectsInspectorControl }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n"],"mappings":"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"}

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

@@ -1,210 +0,0 @@
-import { createElement } from "react";
-/**
- * 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 { mergeOrigins } from '../use-settings';
-import { getValueFromVariable, TOOLSPANEL_DROPDOWNMENU_PROPS } 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,
-  value,
-  panelId,
-  children
-}) {
-  const resetAll = () => {
-    const updatedValue = resetAllFilter(value);
-    onChange(updatedValue);
-  };
-  return createElement(ToolsPanel, {
-    label: __('Effects'),
-    resetAll: resetAll,
-    panelId: panelId,
-    dropdownMenuProps: TOOLSPANEL_DROPDOWNMENU_PROPS
-  }, children);
-}
-const DEFAULT_CONTROLS = {
-  shadow: true
-};
-export default function EffectsPanel({
-  as: Wrapper = EffectsToolsPanel,
-  value,
-  onChange,
-  inheritedValue = value,
-  settings,
-  panelId,
-  defaultControls = DEFAULT_CONTROLS
-}) {
-  const decodeValue = rawValue => getValueFromVariable({
-    settings
-  }, '', rawValue);
-
-  // Shadow
-  const hasShadowEnabled = useHasShadowControl(settings);
-  const shadow = decodeValue(inheritedValue?.shadow);
-  const shadowPresets = settings?.shadow?.presets;
-  const mergedShadowPresets = shadowPresets ? mergeOrigins(shadowPresets) : [];
-  const setShadow = newValue => {
-    const slug = mergedShadowPresets?.find(({
-      shadow: shadowName
-    }) => shadowName === newValue)?.slug;
-    onChange(setImmutably(value, ['shadow'], slug ? `var:preset|shadow|${slug}` : newValue || undefined));
-  };
-  const hasShadow = () => !!value?.shadow;
-  const resetShadow = () => setShadow(undefined);
-  const resetAllFilter = useCallback(previousValue => {
-    return {
-      ...previousValue,
-      shadow: undefined
-    };
-  }, []);
-  return createElement(Wrapper, {
-    resetAllFilter: resetAllFilter,
-    value: value,
-    onChange: onChange,
-    panelId: panelId
-  }, hasShadowEnabled && createElement(ToolsPanelItem, {
-    label: __('Shadow'),
-    hasValue: hasShadow,
-    onDeselect: resetShadow,
-    isShownByDefault: defaultControls.shadow,
-    panelId: panelId
-  }, createElement(ItemGroup, {
-    isBordered: true,
-    isSeparated: true
-  }, createElement(ShadowPopover, {
-    shadow: shadow,
-    onShadowChange: setShadow,
-    settings: settings
-  }))));
-}
-const ShadowPopover = ({
-  shadow,
-  onShadowChange,
-  settings
-}) => {
-  const popoverProps = {
-    placement: 'left-start',
-    offset: 36,
-    shift: true
-  };
-  return createElement(Dropdown, {
-    popoverProps: popoverProps,
-    className: "block-editor-global-styles-effects-panel__shadow-dropdown",
-    renderToggle: renderShadowToggle(),
-    renderContent: () => createElement(DropdownContentWrapper, {
-      paddingSize: "medium"
-    }, createElement(ShadowPopoverContainer, {
-      shadow: shadow,
-      onShadowChange: onShadowChange,
-      settings: settings
-    }))
-  });
-};
-function renderShadowToggle() {
-  return ({
-    onToggle,
-    isOpen
-  }) => {
-    const toggleProps = {
-      onClick: onToggle,
-      className: classnames({
-        'is-open': isOpen
-      }),
-      'aria-expanded': isOpen
-    };
-    return createElement(Button, {
-      ...toggleProps
-    }, createElement(HStack, {
-      justify: "flex-start"
-    }, createElement(Icon, {
-      className: "block-editor-global-styles-effects-panel__toggle-icon",
-      icon: shadowIcon,
-      size: 24
-    }), createElement(FlexItem, null, __('Shadow'))));
-  };
-}
-function ShadowPopoverContainer({
-  shadow,
-  onShadowChange,
-  settings
-}) {
-  const defaultShadows = settings?.shadow?.presets?.default;
-  const themeShadows = settings?.shadow?.presets?.theme;
-  const defaultPresetsEnabled = settings?.shadow?.defaultPresets;
-  const shadows = [...(defaultPresetsEnabled ? defaultShadows : []), ...(themeShadows || [])];
-  return createElement("div", {
-    className: "block-editor-global-styles-effects-panel__shadow-popover-container"
-  }, createElement(VStack, {
-    spacing: 4
-  }, createElement(Heading, {
-    level: 5
-  }, __('Shadow')), createElement(ShadowPresets, {
-    presets: shadows,
-    activeShadow: shadow,
-    onSelect: onShadowChange
-  })));
-}
-function ShadowPresets({
-  presets,
-  activeShadow,
-  onSelect
-}) {
-  return !presets ? null : createElement(Grid, {
-    columns: 6,
-    gap: 0,
-    align: "center",
-    justify: "center"
-  }, presets.map(({
-    name,
-    slug,
-    shadow
-  }) => createElement(ShadowIndicator, {
-    key: slug,
-    label: name,
-    isActive: shadow === activeShadow,
-    onSelect: () => onSelect(shadow === activeShadow ? undefined : shadow),
-    shadow: shadow
-  })));
-}
-function ShadowIndicator({
-  label,
-  isActive,
-  onSelect,
-  shadow
-}) {
-  return createElement("div", {
-    className: "block-editor-global-styles-effects-panel__shadow-indicator-wrapper"
-  }, createElement(Button, {
-    className: "block-editor-global-styles-effects-panel__shadow-indicator",
-    onClick: onSelect,
-    label: label,
-    style: {
-      boxShadow: shadow
-    },
-    showTooltip: true
-  }, isActive && createElement(Icon, {
-    icon: check
-  })));
-}
-//# sourceMappingURL=effects-panel.js.map

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

@@ -1 +0,0 @@
-{"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","mergeOrigins","getValueFromVariable","TOOLSPANEL_DROPDOWNMENU_PROPS","setImmutably","useHasEffectsPanel","settings","hasShadowControl","useHasShadowControl","EffectsToolsPanel","resetAllFilter","onChange","value","panelId","children","resetAll","updatedValue","createElement","label","dropdownMenuProps","DEFAULT_CONTROLS","EffectsPanel","as","Wrapper","inheritedValue","defaultControls","decodeValue","rawValue","hasShadowEnabled","shadowPresets","presets","mergedShadowPresets","setShadow","newValue","slug","find","shadowName","undefined","hasShadow","resetShadow","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","default","themeShadows","theme","defaultPresetsEnabled","defaultPresets","shadows","spacing","level","ShadowPresets","activeShadow","onSelect","columns","gap","align","map","name","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 { mergeOrigins } from '../use-settings';\nimport { getValueFromVariable, TOOLSPANEL_DROPDOWNMENU_PROPS } 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\tdropdownMenuProps={ TOOLSPANEL_DROPDOWNMENU_PROPS }\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 shadowPresets = settings?.shadow?.presets;\n\tconst mergedShadowPresets = shadowPresets\n\t\t? mergeOrigins( shadowPresets )\n\t\t: [];\n\tconst setShadow = ( newValue ) => {\n\t\tconst slug = mergedShadowPresets?.find(\n\t\t\t( { shadow: shadowName } ) => shadowName === newValue\n\t\t)?.slug;\n\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'shadow' ],\n\t\t\t\tslug ? `var:preset|shadow|${ slug }` : newValue || undefined\n\t\t\t)\n\t\t);\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/hooks/effects.js

@@ -1,51 +0,0 @@
-import { createElement } from "react";
-/**
- * WordPress dependencies
- */
-import { hasBlockSupport } from '@wordpress/blocks';
-import { useSelect } from '@wordpress/data';
-/**
- * Internal dependencies
- */
-import StylesEffectsPanel, { useHasEffectsPanel } from '../components/global-styles/effects-panel';
-import { InspectorControls } from '../components';
-import { store as blockEditorStore } from '../store';
-import { cleanEmptyObject } from './utils';
-export const SHADOW_SUPPORT_KEY = 'shadow';
-export const EFFECTS_SUPPORT_KEYS = [SHADOW_SUPPORT_KEY];
-export function hasEffectsSupport(blockName) {
-  return EFFECTS_SUPPORT_KEYS.some(key => hasBlockSupport(blockName, key));
-}
-function EffectsInspectorControl({
-  children,
-  resetAllFilter
-}) {
-  return createElement(InspectorControls, {
-    group: "effects",
-    resetAllFilter: resetAllFilter
-  }, children);
-}
-export function EffectsPanel({
-  clientId,
-  setAttributes,
-  settings
-}) {
-  const isEnabled = useHasEffectsPanel(settings);
-  const value = useSelect(select => select(blockEditorStore).getBlockAttributes(clientId)?.style, [clientId]);
-  const onChange = newStyle => {
-    setAttributes({
-      style: cleanEmptyObject(newStyle)
-    });
-  };
-  if (!isEnabled) {
-    return null;
-  }
-  return createElement(StylesEffectsPanel, {
-    as: EffectsInspectorControl,
-    panelId: clientId,
-    settings: settings,
-    value: value,
-    onChange: onChange
-  });
-}
-//# sourceMappingURL=effects.js.map

package/build-module/hooks/effects.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["hasBlockSupport","useSelect","StylesEffectsPanel","useHasEffectsPanel","InspectorControls","store","blockEditorStore","cleanEmptyObject","SHADOW_SUPPORT_KEY","EFFECTS_SUPPORT_KEYS","hasEffectsSupport","blockName","some","key","EffectsInspectorControl","children","resetAllFilter","createElement","group","EffectsPanel","clientId","setAttributes","settings","isEnabled","value","select","getBlockAttributes","style","onChange","newStyle","as","panelId"],"sources":["@wordpress/block-editor/src/hooks/effects.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\n/**\n * Internal dependencies\n */\nimport StylesEffectsPanel, {\n\tuseHasEffectsPanel,\n} from '../components/global-styles/effects-panel';\nimport { InspectorControls } from '../components';\nimport { store as blockEditorStore } from '../store';\nimport { cleanEmptyObject } from './utils';\n\nexport const SHADOW_SUPPORT_KEY = 'shadow';\nexport const EFFECTS_SUPPORT_KEYS = [ SHADOW_SUPPORT_KEY ];\n\nexport function hasEffectsSupport( blockName ) {\n\treturn EFFECTS_SUPPORT_KEYS.some( ( key ) =>\n\t\thasBlockSupport( blockName, key )\n\t);\n}\n\nfunction EffectsInspectorControl( { children, resetAllFilter } ) {\n\treturn (\n\t\t<InspectorControls group=\"effects\" resetAllFilter={ resetAllFilter }>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\nexport function EffectsPanel( { clientId, setAttributes, settings } ) {\n\tconst isEnabled = useHasEffectsPanel( settings );\n\tconst value = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId )?.style,\n\t\t[ clientId ]\n\t);\n\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( { style: cleanEmptyObject( newStyle ) } );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StylesEffectsPanel\n\t\t\tas={ EffectsInspectorControl }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,eAAe,QAAQ,mBAAmB;AACnD,SAASC,SAAS,QAAQ,iBAAiB;AAC3C;AACA;AACA;AACA,OAAOC,kBAAkB,IACxBC,kBAAkB,QACZ,2CAA2C;AAClD,SAASC,iBAAiB,QAAQ,eAAe;AACjD,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,UAAU;AACpD,SAASC,gBAAgB,QAAQ,SAAS;AAE1C,OAAO,MAAMC,kBAAkB,GAAG,QAAQ;AAC1C,OAAO,MAAMC,oBAAoB,GAAG,CAAED,kBAAkB,CAAE;AAE1D,OAAO,SAASE,iBAAiBA,CAAEC,SAAS,EAAG;EAC9C,OAAOF,oBAAoB,CAACG,IAAI,CAAIC,GAAG,IACtCb,eAAe,CAAEW,SAAS,EAAEE,GAAI,CACjC,CAAC;AACF;AAEA,SAASC,uBAAuBA,CAAE;EAAEC,QAAQ;EAAEC;AAAe,CAAC,EAAG;EAChE,OACCC,aAAA,CAACb,iBAAiB;IAACc,KAAK,EAAC,SAAS;IAACF,cAAc,EAAGA;EAAgB,GACjED,QACgB,CAAC;AAEtB;AACA,OAAO,SAASI,YAAYA,CAAE;EAAEC,QAAQ;EAAEC,aAAa;EAAEC;AAAS,CAAC,EAAG;EACrE,MAAMC,SAAS,GAAGpB,kBAAkB,CAAEmB,QAAS,CAAC;EAChD,MAAME,KAAK,GAAGvB,SAAS,CACpBwB,MAAM,IACPA,MAAM,CAAEnB,gBAAiB,CAAC,CAACoB,kBAAkB,CAAEN,QAAS,CAAC,EAAEO,KAAK,EACjE,CAAEP,QAAQ,CACX,CAAC;EAED,MAAMQ,QAAQ,GAAKC,QAAQ,IAAM;IAChCR,aAAa,CAAE;MAAEM,KAAK,EAAEpB,gBAAgB,CAAEsB,QAAS;IAAE,CAAE,CAAC;EACzD,CAAC;EAED,IAAK,CAAEN,SAAS,EAAG;IAClB,OAAO,IAAI;EACZ;EAEA,OACCN,aAAA,CAACf,kBAAkB;IAClB4B,EAAE,EAAGhB,uBAAyB;IAC9BiB,OAAO,EAAGX,QAAU;IACpBE,QAAQ,EAAGA,QAAU;IACrBE,KAAK,EAAGA,KAAO;IACfI,QAAQ,EAAGA;EAAU,CACrB,CAAC;AAEJ"}

package/src/components/global-styles/effects-panel.js

@@ -1,244 +0,0 @@
-/**
- * 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 { mergeOrigins } from '../use-settings';
-import { getValueFromVariable, TOOLSPANEL_DROPDOWNMENU_PROPS } 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,
-	value,
-	panelId,
-	children,
-} ) {
-	const resetAll = () => {
-		const updatedValue = resetAllFilter( value );
-		onChange( updatedValue );
-	};
-
-	return (
-		<ToolsPanel
-			label={ __( 'Effects' ) }
-			resetAll={ resetAll }
-			panelId={ panelId }
-			dropdownMenuProps={ TOOLSPANEL_DROPDOWNMENU_PROPS }
-		>
-			{ children }
-		</ToolsPanel>
-	);
-}
-
-const DEFAULT_CONTROLS = {
-	shadow: true,
-};
-
-export default function EffectsPanel( {
-	as: Wrapper = EffectsToolsPanel,
-	value,
-	onChange,
-	inheritedValue = value,
-	settings,
-	panelId,
-	defaultControls = DEFAULT_CONTROLS,
-} ) {
-	const decodeValue = ( rawValue ) =>
-		getValueFromVariable( { settings }, '', rawValue );
-
-	// Shadow
-	const hasShadowEnabled = useHasShadowControl( settings );
-	const shadow = decodeValue( inheritedValue?.shadow );
-	const shadowPresets = settings?.shadow?.presets;
-	const mergedShadowPresets = shadowPresets
-		? mergeOrigins( shadowPresets )
-		: [];
-	const setShadow = ( newValue ) => {
-		const slug = mergedShadowPresets?.find(
-			( { shadow: shadowName } ) => shadowName === newValue
-		)?.slug;
-
-		onChange(
-			setImmutably(
-				value,
-				[ 'shadow' ],
-				slug ? `var:preset|shadow|${ slug }` : newValue || undefined
-			)
-		);
-	};
-	const hasShadow = () => !! value?.shadow;
-	const resetShadow = () => setShadow( undefined );
-
-	const resetAllFilter = useCallback( ( previousValue ) => {
-		return {
-			...previousValue,
-			shadow: undefined,
-		};
-	}, [] );
-
-	return (
-		<Wrapper
-			resetAllFilter={ resetAllFilter }
-			value={ value }
-			onChange={ onChange }
-			panelId={ panelId }
-		>
-			{ hasShadowEnabled && (
-				<ToolsPanelItem
-					label={ __( 'Shadow' ) }
-					hasValue={ hasShadow }
-					onDeselect={ resetShadow }
-					isShownByDefault={ defaultControls.shadow }
-					panelId={ panelId }
-				>
-					<ItemGroup isBordered isSeparated>
-						<ShadowPopover
-							shadow={ shadow }
-							onShadowChange={ setShadow }
-							settings={ settings }
-						/>
-					</ItemGroup>
-				</ToolsPanelItem>
-			) }
-		</Wrapper>
-	);
-}
-
-const ShadowPopover = ( { shadow, onShadowChange, settings } ) => {
-	const popoverProps = {
-		placement: 'left-start',
-		offset: 36,
-		shift: true,
-	};
-
-	return (
-		<Dropdown
-			popoverProps={ popoverProps }
-			className="block-editor-global-styles-effects-panel__shadow-dropdown"
-			renderToggle={ renderShadowToggle() }
-			renderContent={ () => (
-				<DropdownContentWrapper paddingSize="medium">
-					<ShadowPopoverContainer
-						shadow={ shadow }
-						onShadowChange={ onShadowChange }
-						settings={ settings }
-					/>
-				</DropdownContentWrapper>
-			) }
-		/>
-	);
-};
-
-function renderShadowToggle() {
-	return ( { onToggle, isOpen } ) => {
-		const toggleProps = {
-			onClick: onToggle,
-			className: classnames( { 'is-open': isOpen } ),
-			'aria-expanded': isOpen,
-		};
-
-		return (
-			<Button { ...toggleProps }>
-				<HStack justify="flex-start">
-					<Icon
-						className="block-editor-global-styles-effects-panel__toggle-icon"
-						icon={ shadowIcon }
-						size={ 24 }
-					/>
-					<FlexItem>{ __( 'Shadow' ) }</FlexItem>
-				</HStack>
-			</Button>
-		);
-	};
-}
-
-function ShadowPopoverContainer( { shadow, onShadowChange, settings } ) {
-	const defaultShadows = settings?.shadow?.presets?.default;
-	const themeShadows = settings?.shadow?.presets?.theme;
-	const defaultPresetsEnabled = settings?.shadow?.defaultPresets;
-
-	const shadows = [
-		...( defaultPresetsEnabled ? defaultShadows : [] ),
-		...( themeShadows || [] ),
-	];
-
-	return (
-		<div className="block-editor-global-styles-effects-panel__shadow-popover-container">
-			<VStack spacing={ 4 }>
-				<Heading level={ 5 }>{ __( 'Shadow' ) }</Heading>
-				<ShadowPresets
-					presets={ shadows }
-					activeShadow={ shadow }
-					onSelect={ onShadowChange }
-				/>
-			</VStack>
-		</div>
-	);
-}
-
-function ShadowPresets( { presets, activeShadow, onSelect } ) {
-	return ! presets ? null : (
-		<Grid columns={ 6 } gap={ 0 } align="center" justify="center">
-			{ presets.map( ( { name, slug, shadow } ) => (
-				<ShadowIndicator
-					key={ slug }
-					label={ name }
-					isActive={ shadow === activeShadow }
-					onSelect={ () =>
-						onSelect( shadow === activeShadow ? undefined : shadow )
-					}
-					shadow={ shadow }
-				/>
-			) ) }
-		</Grid>
-	);
-}
-
-function ShadowIndicator( { label, isActive, onSelect, shadow } ) {
-	return (
-		<div className="block-editor-global-styles-effects-panel__shadow-indicator-wrapper">
-			<Button
-				className="block-editor-global-styles-effects-panel__shadow-indicator"
-				onClick={ onSelect }
-				label={ label }
-				style={ { boxShadow: shadow } }
-				showTooltip
-			>
-				{ isActive && <Icon icon={ check } /> }
-			</Button>
-		</div>
-	);
-}