@wordpress/block-editor 12.25.0 → 13.0.0

package/build/hooks/use-bindings-attributes.js

@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.canBindAttribute = canBindAttribute;
 exports.canBindBlock = canBindBlock;
 exports.withBlockBindingSupport = void 0;
-var _react = require("react");
 var _blocks = require("@wordpress/blocks");
 var _compose = require("@wordpress/compose");
 var _data = require("@wordpress/data");
 var _element = require("@wordpress/element");
 var _hooks = require("@wordpress/hooks");
 var _lockUnlock = require("../lock-unlock");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
  */
@@ -29,14 +29,42 @@ var _lockUnlock = require("../lock-unlock");
  * overrides its `attributes` and `setAttributes` props to sync any changes needed.
  *
  * @return {WPHigherOrderComponent} Higher-order component.
- */
-
-const BLOCK_BINDINGS_ALLOWED_BLOCKS = {
+ */const BLOCK_BINDINGS_ALLOWED_BLOCKS = {
   'core/paragraph': ['content'],
   'core/heading': ['content'],
-  'core/image': ['url', 'title', 'alt'],
-  'core/button': ['url', 'text', 'linkTarget']
+  'core/image': ['id', 'url', 'title', 'alt'],
+  'core/button': ['url', 'text', 'linkTarget', 'rel']
 };
+const DEFAULT_ATTRIBUTE = '__default';
+
+/**
+ * Returns the bindings with the `__default` binding for pattern overrides
+ * replaced with the full-set of supported attributes. e.g.:
+ *
+ * bindings passed in: `{ __default: { source: 'core/pattern-overrides' } }`
+ * bindings returned: `{ content: { source: 'core/pattern-overrides' } }`
+ *
+ * @param {string} blockName The block name (e.g. 'core/paragraph').
+ * @param {Object} bindings  A block's bindings from the metadata attribute.
+ *
+ * @return {Object} The bindings with default replaced for pattern overrides.
+ */
+function replacePatternOverrideDefaultBindings(blockName, bindings) {
+  // The `__default` binding currently only works for pattern overrides.
+  if (bindings?.[DEFAULT_ATTRIBUTE]?.source === 'core/pattern-overrides') {
+    const supportedAttributes = BLOCK_BINDINGS_ALLOWED_BLOCKS[blockName];
+    const bindingsWithDefaults = {};
+    for (const attributeName of supportedAttributes) {
+      // If the block has mixed binding sources, retain any non pattern override bindings.
+      const bindingSource = bindings[attributeName] ? bindings[attributeName] : {
+        source: 'core/pattern-overrides'
+      };
+      bindingsWithDefaults[attributeName] = bindingSource;
+    }
+    return bindingsWithDefaults;
+  }
+  return bindings;
+}
 
 /**
  * Based on the given block name,
@@ -63,12 +91,12 @@ function canBindAttribute(blockName, attributeName) {
 const withBlockBindingSupport = exports.withBlockBindingSupport = (0, _compose.createHigherOrderComponent)(BlockEdit => props => {
   const registry = (0, _data.useRegistry)();
   const sources = (0, _data.useSelect)(select => (0, _lockUnlock.unlock)(select(_blocks.store)).getAllBlockBindingsSources());
-  const bindings = props.attributes.metadata?.bindings;
   const {
     name,
     clientId,
     context
   } = props;
+  const bindings = (0, _element.useMemo)(() => replacePatternOverrideDefaultBindings(name, props.attributes.metadata?.bindings), [props.attributes.metadata?.bindings, name]);
   const boundAttributes = (0, _data.useSelect)(() => {
     if (!bindings) {
       return;
@@ -103,39 +131,69 @@ const withBlockBindingSupport = exports.withBlockBindingSupport = (0, _compose.c
   const _setAttributes = (0, _element.useCallback)(nextAttributes => {
     registry.batch(() => {
       if (!bindings) {
-        return setAttributes(nextAttributes);
+        setAttributes(nextAttributes);
+        return;
       }
       const keptAttributes = {
         ...nextAttributes
       };
-      for (const [attributeName, boundAttribute] of Object.entries(bindings)) {
-        const source = sources[boundAttribute.source];
-        if (!source?.setValue || !canBindAttribute(name, attributeName)) {
+      const updatesBySource = new Map();
+
+      // Loop only over the updated attributes to avoid modifying the bound ones that haven't changed.
+      for (const [attributeName, newValue] of Object.entries(keptAttributes)) {
+        if (!bindings[attributeName] || !canBindAttribute(name, attributeName)) {
           continue;
         }
-        source.setValue({
-          registry,
-          context,
-          clientId,
-          attributeName,
-          args: boundAttribute.args,
-          value: nextAttributes[attributeName]
+        const binding = bindings[attributeName];
+        const source = sources[binding?.source];
+        if (!source?.setValue && !source?.setValues) {
+          continue;
+        }
+        updatesBySource.set(source, {
+          ...updatesBySource.get(source),
+          [attributeName]: newValue
         });
         delete keptAttributes[attributeName];
       }
+      if (updatesBySource.size) {
+        for (const [source, attributes] of updatesBySource) {
+          if (source.setValues) {
+            source.setValues({
+              registry,
+              context,
+              clientId,
+              attributes
+            });
+          } else {
+            for (const [attributeName, value] of Object.entries(attributes)) {
+              const binding = bindings[attributeName];
+              source.setValue({
+                registry,
+                context,
+                clientId,
+                attributeName,
+                args: binding.args,
+                value
+              });
+            }
+          }
+        }
+      }
       if (Object.keys(keptAttributes).length) {
         setAttributes(keptAttributes);
       }
     });
   }, [registry, bindings, name, clientId, context, setAttributes, sources]);
-  return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(BlockEdit, {
-    ...props,
-    attributes: {
-      ...props.attributes,
-      ...boundAttributes
-    },
-    setAttributes: _setAttributes
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockEdit, {
+      ...props,
+      attributes: {
+        ...props.attributes,
+        ...boundAttributes
+      },
+      setAttributes: _setAttributes
+    })
+  });
 }, 'withBlockBindingSupport');
 
 /**

package/build/hooks/use-bindings-attributes.js.map

@@ -1 +1 @@
-{"version":3,"names":["_blocks","require","_compose","_data","_element","_hooks","_lockUnlock","BLOCK_BINDINGS_ALLOWED_BLOCKS","canBindBlock","blockName","canBindAttribute","attributeName","includes","withBlockBindingSupport","exports","createHigherOrderComponent","BlockEdit","props","registry","useRegistry","sources","useSelect","select","unlock","blocksStore","getAllBlockBindingsSources","bindings","attributes","metadata","name","clientId","context","boundAttributes","boundAttribute","Object","entries","source","getValue","args","undefined","getPlaceholder","setAttributes","_setAttributes","useCallback","nextAttributes","batch","keptAttributes","setValue","value","keys","length","_react","createElement","Fragment","shimAttributeSource","settings","edit","addFilter"],"sources":["@wordpress/block-editor/src/hooks/use-bindings-attributes.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { useRegistry, useSelect } from '@wordpress/data';\nimport { useCallback } from '@wordpress/element';\nimport { addFilter } from '@wordpress/hooks';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../lock-unlock';\n\n/** @typedef {import('@wordpress/compose').WPHigherOrderComponent} WPHigherOrderComponent */\n/** @typedef {import('@wordpress/blocks').WPBlockSettings} WPBlockSettings */\n\n/**\n * Given a binding of block attributes, returns a higher order component that\n * overrides its `attributes` and `setAttributes` props to sync any changes needed.\n *\n * @return {WPHigherOrderComponent} Higher-order component.\n */\n\nconst BLOCK_BINDINGS_ALLOWED_BLOCKS = {\n\t'core/paragraph': [ 'content' ],\n\t'core/heading': [ 'content' ],\n\t'core/image': [ 'url', 'title', 'alt' ],\n\t'core/button': [ 'url', 'text', 'linkTarget' ],\n};\n\n/**\n * Based on the given block name,\n * check if it is possible to bind the block.\n *\n * @param {string} blockName - The block name.\n * @return {boolean} Whether it is possible to bind the block to sources.\n */\nexport function canBindBlock( blockName ) {\n\treturn blockName in BLOCK_BINDINGS_ALLOWED_BLOCKS;\n}\n\n/**\n * Based on the given block name and attribute name,\n * check if it is possible to bind the block attribute.\n *\n * @param {string} blockName     - The block name.\n * @param {string} attributeName - The attribute name.\n * @return {boolean} Whether it is possible to bind the block attribute.\n */\nexport function canBindAttribute( blockName, attributeName ) {\n\treturn (\n\t\tcanBindBlock( blockName ) &&\n\t\tBLOCK_BINDINGS_ALLOWED_BLOCKS[ blockName ].includes( attributeName )\n\t);\n}\n\nexport const withBlockBindingSupport = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) => {\n\t\tconst registry = useRegistry();\n\t\tconst sources = useSelect( ( select ) =>\n\t\t\tunlock( select( blocksStore ) ).getAllBlockBindingsSources()\n\t\t);\n\t\tconst bindings = props.attributes.metadata?.bindings;\n\t\tconst { name, clientId, context } = props;\n\t\tconst boundAttributes = useSelect( () => {\n\t\t\tif ( ! bindings ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst attributes = {};\n\n\t\t\tfor ( const [ attributeName, boundAttribute ] of Object.entries(\n\t\t\t\tbindings\n\t\t\t) ) {\n\t\t\t\tconst source = sources[ boundAttribute.source ];\n\t\t\t\tif (\n\t\t\t\t\t! source?.getValue ||\n\t\t\t\t\t! canBindAttribute( name, attributeName )\n\t\t\t\t) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tconst args = {\n\t\t\t\t\tregistry,\n\t\t\t\t\tcontext,\n\t\t\t\t\tclientId,\n\t\t\t\t\tattributeName,\n\t\t\t\t\targs: boundAttribute.args,\n\t\t\t\t};\n\n\t\t\t\tattributes[ attributeName ] = source.getValue( args );\n\n\t\t\t\tif ( attributes[ attributeName ] === undefined ) {\n\t\t\t\t\tif ( attributeName === 'url' ) {\n\t\t\t\t\t\tattributes[ attributeName ] = null;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tattributes[ attributeName ] =\n\t\t\t\t\t\t\tsource.getPlaceholder?.( args );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn attributes;\n\t\t}, [ bindings, name, clientId, context, registry, sources ] );\n\n\t\tconst { setAttributes } = props;\n\n\t\tconst _setAttributes = useCallback(\n\t\t\t( nextAttributes ) => {\n\t\t\t\tregistry.batch( () => {\n\t\t\t\t\tif ( ! bindings ) {\n\t\t\t\t\t\treturn setAttributes( nextAttributes );\n\t\t\t\t\t}\n\n\t\t\t\t\tconst keptAttributes = { ...nextAttributes };\n\n\t\t\t\t\tfor ( const [\n\t\t\t\t\t\tattributeName,\n\t\t\t\t\t\tboundAttribute,\n\t\t\t\t\t] of Object.entries( bindings ) ) {\n\t\t\t\t\t\tconst source = sources[ boundAttribute.source ];\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! source?.setValue ||\n\t\t\t\t\t\t\t! canBindAttribute( name, attributeName )\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcontinue;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tsource.setValue( {\n\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\tcontext,\n\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\tattributeName,\n\t\t\t\t\t\t\targs: boundAttribute.args,\n\t\t\t\t\t\t\tvalue: nextAttributes[ attributeName ],\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tdelete keptAttributes[ attributeName ];\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( Object.keys( keptAttributes ).length ) {\n\t\t\t\t\t\tsetAttributes( keptAttributes );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\n\t\t\t[\n\t\t\t\tregistry,\n\t\t\t\tbindings,\n\t\t\t\tname,\n\t\t\t\tclientId,\n\t\t\t\tcontext,\n\t\t\t\tsetAttributes,\n\t\t\t\tsources,\n\t\t\t]\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<BlockEdit\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tattributes={ { ...props.attributes, ...boundAttributes } }\n\t\t\t\t\tsetAttributes={ _setAttributes }\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t},\n\t'withBlockBindingSupport'\n);\n\n/**\n * Filters a registered block's settings to enhance a block's `edit` component\n * to upgrade bound attributes.\n *\n * @param {WPBlockSettings} settings - Registered block settings.\n * @param {string}          name     - Block name.\n * @return {WPBlockSettings} Filtered block settings.\n */\nfunction shimAttributeSource( settings, name ) {\n\tif ( ! canBindBlock( name ) ) {\n\t\treturn settings;\n\t}\n\n\treturn {\n\t\t...settings,\n\t\tedit: withBlockBindingSupport( settings.edit ),\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/editor/custom-sources-backwards-compatibility/shim-attribute-source',\n\tshimAttributeSource\n);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_blocks","require","_compose","_data","_element","_hooks","_lockUnlock","_jsxRuntime","BLOCK_BINDINGS_ALLOWED_BLOCKS","DEFAULT_ATTRIBUTE","replacePatternOverrideDefaultBindings","blockName","bindings","source","supportedAttributes","bindingsWithDefaults","attributeName","bindingSource","canBindBlock","canBindAttribute","includes","withBlockBindingSupport","exports","createHigherOrderComponent","BlockEdit","props","registry","useRegistry","sources","useSelect","select","unlock","blocksStore","getAllBlockBindingsSources","name","clientId","context","useMemo","attributes","metadata","boundAttributes","boundAttribute","Object","entries","getValue","args","undefined","getPlaceholder","setAttributes","_setAttributes","useCallback","nextAttributes","batch","keptAttributes","updatesBySource","Map","newValue","binding","setValue","setValues","set","get","size","value","keys","length","jsx","Fragment","children","shimAttributeSource","settings","edit","addFilter"],"sources":["@wordpress/block-editor/src/hooks/use-bindings-attributes.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { useRegistry, useSelect } from '@wordpress/data';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { addFilter } from '@wordpress/hooks';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../lock-unlock';\n\n/** @typedef {import('@wordpress/compose').WPHigherOrderComponent} WPHigherOrderComponent */\n/** @typedef {import('@wordpress/blocks').WPBlockSettings} WPBlockSettings */\n\n/**\n * Given a binding of block attributes, returns a higher order component that\n * overrides its `attributes` and `setAttributes` props to sync any changes needed.\n *\n * @return {WPHigherOrderComponent} Higher-order component.\n */\n\nconst BLOCK_BINDINGS_ALLOWED_BLOCKS = {\n\t'core/paragraph': [ 'content' ],\n\t'core/heading': [ 'content' ],\n\t'core/image': [ 'id', 'url', 'title', 'alt' ],\n\t'core/button': [ 'url', 'text', 'linkTarget', 'rel' ],\n};\n\nconst DEFAULT_ATTRIBUTE = '__default';\n\n/**\n * Returns the bindings with the `__default` binding for pattern overrides\n * replaced with the full-set of supported attributes. e.g.:\n *\n * bindings passed in: `{ __default: { source: 'core/pattern-overrides' } }`\n * bindings returned: `{ content: { source: 'core/pattern-overrides' } }`\n *\n * @param {string} blockName The block name (e.g. 'core/paragraph').\n * @param {Object} bindings  A block's bindings from the metadata attribute.\n *\n * @return {Object} The bindings with default replaced for pattern overrides.\n */\nfunction replacePatternOverrideDefaultBindings( blockName, bindings ) {\n\t// The `__default` binding currently only works for pattern overrides.\n\tif (\n\t\tbindings?.[ DEFAULT_ATTRIBUTE ]?.source === 'core/pattern-overrides'\n\t) {\n\t\tconst supportedAttributes = BLOCK_BINDINGS_ALLOWED_BLOCKS[ blockName ];\n\t\tconst bindingsWithDefaults = {};\n\t\tfor ( const attributeName of supportedAttributes ) {\n\t\t\t// If the block has mixed binding sources, retain any non pattern override bindings.\n\t\t\tconst bindingSource = bindings[ attributeName ]\n\t\t\t\t? bindings[ attributeName ]\n\t\t\t\t: { source: 'core/pattern-overrides' };\n\t\t\tbindingsWithDefaults[ attributeName ] = bindingSource;\n\t\t}\n\n\t\treturn bindingsWithDefaults;\n\t}\n\n\treturn bindings;\n}\n\n/**\n * Based on the given block name,\n * check if it is possible to bind the block.\n *\n * @param {string} blockName - The block name.\n * @return {boolean} Whether it is possible to bind the block to sources.\n */\nexport function canBindBlock( blockName ) {\n\treturn blockName in BLOCK_BINDINGS_ALLOWED_BLOCKS;\n}\n\n/**\n * Based on the given block name and attribute name,\n * check if it is possible to bind the block attribute.\n *\n * @param {string} blockName     - The block name.\n * @param {string} attributeName - The attribute name.\n * @return {boolean} Whether it is possible to bind the block attribute.\n */\nexport function canBindAttribute( blockName, attributeName ) {\n\treturn (\n\t\tcanBindBlock( blockName ) &&\n\t\tBLOCK_BINDINGS_ALLOWED_BLOCKS[ blockName ].includes( attributeName )\n\t);\n}\n\nexport const withBlockBindingSupport = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) => {\n\t\tconst registry = useRegistry();\n\t\tconst sources = useSelect( ( select ) =>\n\t\t\tunlock( select( blocksStore ) ).getAllBlockBindingsSources()\n\t\t);\n\t\tconst { name, clientId, context } = props;\n\t\tconst bindings = useMemo(\n\t\t\t() =>\n\t\t\t\treplacePatternOverrideDefaultBindings(\n\t\t\t\t\tname,\n\t\t\t\t\tprops.attributes.metadata?.bindings\n\t\t\t\t),\n\t\t\t[ props.attributes.metadata?.bindings, name ]\n\t\t);\n\t\tconst boundAttributes = useSelect( () => {\n\t\t\tif ( ! bindings ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst attributes = {};\n\n\t\t\tfor ( const [ attributeName, boundAttribute ] of Object.entries(\n\t\t\t\tbindings\n\t\t\t) ) {\n\t\t\t\tconst source = sources[ boundAttribute.source ];\n\t\t\t\tif (\n\t\t\t\t\t! source?.getValue ||\n\t\t\t\t\t! canBindAttribute( name, attributeName )\n\t\t\t\t) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tconst args = {\n\t\t\t\t\tregistry,\n\t\t\t\t\tcontext,\n\t\t\t\t\tclientId,\n\t\t\t\t\tattributeName,\n\t\t\t\t\targs: boundAttribute.args,\n\t\t\t\t};\n\n\t\t\t\tattributes[ attributeName ] = source.getValue( args );\n\n\t\t\t\tif ( attributes[ attributeName ] === undefined ) {\n\t\t\t\t\tif ( attributeName === 'url' ) {\n\t\t\t\t\t\tattributes[ attributeName ] = null;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tattributes[ attributeName ] =\n\t\t\t\t\t\t\tsource.getPlaceholder?.( args );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn attributes;\n\t\t}, [ bindings, name, clientId, context, registry, sources ] );\n\n\t\tconst { setAttributes } = props;\n\n\t\tconst _setAttributes = useCallback(\n\t\t\t( nextAttributes ) => {\n\t\t\t\tregistry.batch( () => {\n\t\t\t\t\tif ( ! bindings ) {\n\t\t\t\t\t\tsetAttributes( nextAttributes );\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst keptAttributes = { ...nextAttributes };\n\t\t\t\t\tconst updatesBySource = new Map();\n\n\t\t\t\t\t// Loop only over the updated attributes to avoid modifying the bound ones that haven't changed.\n\t\t\t\t\tfor ( const [ attributeName, newValue ] of Object.entries(\n\t\t\t\t\t\tkeptAttributes\n\t\t\t\t\t) ) {\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! bindings[ attributeName ] ||\n\t\t\t\t\t\t\t! canBindAttribute( name, attributeName )\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcontinue;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst binding = bindings[ attributeName ];\n\t\t\t\t\t\tconst source = sources[ binding?.source ];\n\t\t\t\t\t\tif ( ! source?.setValue && ! source?.setValues ) {\n\t\t\t\t\t\t\tcontinue;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tupdatesBySource.set( source, {\n\t\t\t\t\t\t\t...updatesBySource.get( source ),\n\t\t\t\t\t\t\t[ attributeName ]: newValue,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tdelete keptAttributes[ attributeName ];\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( updatesBySource.size ) {\n\t\t\t\t\t\tfor ( const [\n\t\t\t\t\t\t\tsource,\n\t\t\t\t\t\t\tattributes,\n\t\t\t\t\t\t] of updatesBySource ) {\n\t\t\t\t\t\t\tif ( source.setValues ) {\n\t\t\t\t\t\t\t\tsource.setValues( {\n\t\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\t\t\tcontext,\n\t\t\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\t\t\tattributes,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tfor ( const [\n\t\t\t\t\t\t\t\t\tattributeName,\n\t\t\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\t\t] of Object.entries( attributes ) ) {\n\t\t\t\t\t\t\t\t\tconst binding = bindings[ attributeName ];\n\t\t\t\t\t\t\t\t\tsource.setValue( {\n\t\t\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\t\t\t\tcontext,\n\t\t\t\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\t\t\t\tattributeName,\n\t\t\t\t\t\t\t\t\t\targs: binding.args,\n\t\t\t\t\t\t\t\t\t\tvalue,\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}\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( Object.keys( keptAttributes ).length ) {\n\t\t\t\t\t\tsetAttributes( keptAttributes );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\n\t\t\t[\n\t\t\t\tregistry,\n\t\t\t\tbindings,\n\t\t\t\tname,\n\t\t\t\tclientId,\n\t\t\t\tcontext,\n\t\t\t\tsetAttributes,\n\t\t\t\tsources,\n\t\t\t]\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<BlockEdit\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tattributes={ { ...props.attributes, ...boundAttributes } }\n\t\t\t\t\tsetAttributes={ _setAttributes }\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t},\n\t'withBlockBindingSupport'\n);\n\n/**\n * Filters a registered block's settings to enhance a block's `edit` component\n * to upgrade bound attributes.\n *\n * @param {WPBlockSettings} settings - Registered block settings.\n * @param {string}          name     - Block name.\n * @return {WPBlockSettings} Filtered block settings.\n */\nfunction shimAttributeSource( settings, name ) {\n\tif ( ! canBindBlock( name ) ) {\n\t\treturn settings;\n\t}\n\n\treturn {\n\t\t...settings,\n\t\tedit: withBlockBindingSupport( settings.edit ),\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/editor/custom-sources-backwards-compatibility/shim-attribute-source',\n\tshimAttributeSource\n);\n"],"mappings":";;;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAKA,IAAAK,WAAA,GAAAL,OAAA;AAAwC,IAAAM,WAAA,GAAAN,OAAA;AAZxC;AACA;AACA;;AAOA;AACA;AACA;;AAGA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,GAEA,MAAMO,6BAA6B,GAAG;EACrC,gBAAgB,EAAE,CAAE,SAAS,CAAE;EAC/B,cAAc,EAAE,CAAE,SAAS,CAAE;EAC7B,YAAY,EAAE,CAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,CAAE;EAC7C,aAAa,EAAE,CAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK;AACpD,CAAC;AAED,MAAMC,iBAAiB,GAAG,WAAW;;AAErC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,qCAAqCA,CAAEC,SAAS,EAAEC,QAAQ,EAAG;EACrE;EACA,IACCA,QAAQ,GAAIH,iBAAiB,CAAE,EAAEI,MAAM,KAAK,wBAAwB,EACnE;IACD,MAAMC,mBAAmB,GAAGN,6BAA6B,CAAEG,SAAS,CAAE;IACtE,MAAMI,oBAAoB,GAAG,CAAC,CAAC;IAC/B,KAAM,MAAMC,aAAa,IAAIF,mBAAmB,EAAG;MAClD;MACA,MAAMG,aAAa,GAAGL,QAAQ,CAAEI,aAAa,CAAE,GAC5CJ,QAAQ,CAAEI,aAAa,CAAE,GACzB;QAAEH,MAAM,EAAE;MAAyB,CAAC;MACvCE,oBAAoB,CAAEC,aAAa,CAAE,GAAGC,aAAa;IACtD;IAEA,OAAOF,oBAAoB;EAC5B;EAEA,OAAOH,QAAQ;AAChB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASM,YAAYA,CAAEP,SAAS,EAAG;EACzC,OAAOA,SAAS,IAAIH,6BAA6B;AAClD;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASW,gBAAgBA,CAAER,SAAS,EAAEK,aAAa,EAAG;EAC5D,OACCE,YAAY,CAAEP,SAAU,CAAC,IACzBH,6BAA6B,CAAEG,SAAS,CAAE,CAACS,QAAQ,CAAEJ,aAAc,CAAC;AAEtE;AAEO,MAAMK,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAG,IAAAE,mCAA0B,EAC9DC,SAAS,IAAQC,KAAK,IAAM;EAC7B,MAAMC,QAAQ,GAAG,IAAAC,iBAAW,EAAC,CAAC;EAC9B,MAAMC,OAAO,GAAG,IAAAC,eAAS,EAAIC,MAAM,IAClC,IAAAC,kBAAM,EAAED,MAAM,CAAEE,aAAY,CAAE,CAAC,CAACC,0BAA0B,CAAC,CAC5D,CAAC;EACD,MAAM;IAAEC,IAAI;IAAEC,QAAQ;IAAEC;EAAQ,CAAC,GAAGX,KAAK;EACzC,MAAMb,QAAQ,GAAG,IAAAyB,gBAAO,EACvB,MACC3B,qCAAqC,CACpCwB,IAAI,EACJT,KAAK,CAACa,UAAU,CAACC,QAAQ,EAAE3B,QAC5B,CAAC,EACF,CAAEa,KAAK,CAACa,UAAU,CAACC,QAAQ,EAAE3B,QAAQ,EAAEsB,IAAI,CAC5C,CAAC;EACD,MAAMM,eAAe,GAAG,IAAAX,eAAS,EAAE,MAAM;IACxC,IAAK,CAAEjB,QAAQ,EAAG;MACjB;IACD;IAEA,MAAM0B,UAAU,GAAG,CAAC,CAAC;IAErB,KAAM,MAAM,CAAEtB,aAAa,EAAEyB,cAAc,CAAE,IAAIC,MAAM,CAACC,OAAO,CAC9D/B,QACD,CAAC,EAAG;MACH,MAAMC,MAAM,GAAGe,OAAO,CAAEa,cAAc,CAAC5B,MAAM,CAAE;MAC/C,IACC,CAAEA,MAAM,EAAE+B,QAAQ,IAClB,CAAEzB,gBAAgB,CAAEe,IAAI,EAAElB,aAAc,CAAC,EACxC;QACD;MACD;MAEA,MAAM6B,IAAI,GAAG;QACZnB,QAAQ;QACRU,OAAO;QACPD,QAAQ;QACRnB,aAAa;QACb6B,IAAI,EAAEJ,cAAc,CAACI;MACtB,CAAC;MAEDP,UAAU,CAAEtB,aAAa,CAAE,GAAGH,MAAM,CAAC+B,QAAQ,CAAEC,IAAK,CAAC;MAErD,IAAKP,UAAU,CAAEtB,aAAa,CAAE,KAAK8B,SAAS,EAAG;QAChD,IAAK9B,aAAa,KAAK,KAAK,EAAG;UAC9BsB,UAAU,CAAEtB,aAAa,CAAE,GAAG,IAAI;QACnC,CAAC,MAAM;UACNsB,UAAU,CAAEtB,aAAa,CAAE,GAC1BH,MAAM,CAACkC,cAAc,GAAIF,IAAK,CAAC;QACjC;MACD;IACD;IAEA,OAAOP,UAAU;EAClB,CAAC,EAAE,CAAE1B,QAAQ,EAAEsB,IAAI,EAAEC,QAAQ,EAAEC,OAAO,EAAEV,QAAQ,EAAEE,OAAO,CAAG,CAAC;EAE7D,MAAM;IAAEoB;EAAc,CAAC,GAAGvB,KAAK;EAE/B,MAAMwB,cAAc,GAAG,IAAAC,oBAAW,EAC/BC,cAAc,IAAM;IACrBzB,QAAQ,CAAC0B,KAAK,CAAE,MAAM;MACrB,IAAK,CAAExC,QAAQ,EAAG;QACjBoC,aAAa,CAAEG,cAAe,CAAC;QAC/B;MACD;MAEA,MAAME,cAAc,GAAG;QAAE,GAAGF;MAAe,CAAC;MAC5C,MAAMG,eAAe,GAAG,IAAIC,GAAG,CAAC,CAAC;;MAEjC;MACA,KAAM,MAAM,CAAEvC,aAAa,EAAEwC,QAAQ,CAAE,IAAId,MAAM,CAACC,OAAO,CACxDU,cACD,CAAC,EAAG;QACH,IACC,CAAEzC,QAAQ,CAAEI,aAAa,CAAE,IAC3B,CAAEG,gBAAgB,CAAEe,IAAI,EAAElB,aAAc,CAAC,EACxC;UACD;QACD;QAEA,MAAMyC,OAAO,GAAG7C,QAAQ,CAAEI,aAAa,CAAE;QACzC,MAAMH,MAAM,GAAGe,OAAO,CAAE6B,OAAO,EAAE5C,MAAM,CAAE;QACzC,IAAK,CAAEA,MAAM,EAAE6C,QAAQ,IAAI,CAAE7C,MAAM,EAAE8C,SAAS,EAAG;UAChD;QACD;QACAL,eAAe,CAACM,GAAG,CAAE/C,MAAM,EAAE;UAC5B,GAAGyC,eAAe,CAACO,GAAG,CAAEhD,MAAO,CAAC;UAChC,CAAEG,aAAa,GAAIwC;QACpB,CAAE,CAAC;QACH,OAAOH,cAAc,CAAErC,aAAa,CAAE;MACvC;MAEA,IAAKsC,eAAe,CAACQ,IAAI,EAAG;QAC3B,KAAM,MAAM,CACXjD,MAAM,EACNyB,UAAU,CACV,IAAIgB,eAAe,EAAG;UACtB,IAAKzC,MAAM,CAAC8C,SAAS,EAAG;YACvB9C,MAAM,CAAC8C,SAAS,CAAE;cACjBjC,QAAQ;cACRU,OAAO;cACPD,QAAQ;cACRG;YACD,CAAE,CAAC;UACJ,CAAC,MAAM;YACN,KAAM,MAAM,CACXtB,aAAa,EACb+C,KAAK,CACL,IAAIrB,MAAM,CAACC,OAAO,CAAEL,UAAW,CAAC,EAAG;cACnC,MAAMmB,OAAO,GAAG7C,QAAQ,CAAEI,aAAa,CAAE;cACzCH,MAAM,CAAC6C,QAAQ,CAAE;gBAChBhC,QAAQ;gBACRU,OAAO;gBACPD,QAAQ;gBACRnB,aAAa;gBACb6B,IAAI,EAAEY,OAAO,CAACZ,IAAI;gBAClBkB;cACD,CAAE,CAAC;YACJ;UACD;QACD;MACD;MAEA,IAAKrB,MAAM,CAACsB,IAAI,CAAEX,cAAe,CAAC,CAACY,MAAM,EAAG;QAC3CjB,aAAa,CAAEK,cAAe,CAAC;MAChC;IACD,CAAE,CAAC;EACJ,CAAC,EACD,CACC3B,QAAQ,EACRd,QAAQ,EACRsB,IAAI,EACJC,QAAQ,EACRC,OAAO,EACPY,aAAa,EACbpB,OAAO,CAET,CAAC;EAED,oBACC,IAAArB,WAAA,CAAA2D,GAAA,EAAA3D,WAAA,CAAA4D,QAAA;IAAAC,QAAA,eACC,IAAA7D,WAAA,CAAA2D,GAAA,EAAC1C,SAAS;MAAA,GACJC,KAAK;MACVa,UAAU,EAAG;QAAE,GAAGb,KAAK,CAACa,UAAU;QAAE,GAAGE;MAAgB,CAAG;MAC1DQ,aAAa,EAAGC;IAAgB,CAChC;EAAC,CACD,CAAC;AAEL,CAAC,EACD,yBACD,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASoB,mBAAmBA,CAAEC,QAAQ,EAAEpC,IAAI,EAAG;EAC9C,IAAK,CAAEhB,YAAY,CAAEgB,IAAK,CAAC,EAAG;IAC7B,OAAOoC,QAAQ;EAChB;EAEA,OAAO;IACN,GAAGA,QAAQ;IACXC,IAAI,EAAElD,uBAAuB,CAAEiD,QAAQ,CAACC,IAAK;EAC9C,CAAC;AACF;AAEA,IAAAC,gBAAS,EACR,0BAA0B,EAC1B,0EAA0E,EAC1EH,mBACD,CAAC","ignoreList":[]}

package/build/hooks/use-color-props.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getColorClassesAndStyles = getColorClassesAndStyles;
 exports.useColorProps = useColorProps;
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _element = require("@wordpress/element");
 var _style = require("./style");
 var _colors = require("../components/colors");
@@ -54,7 +54,7 @@ function getColorClassesAndStyles(attributes) {
   const hasGradient = gradientClass || style?.color?.gradient;
 
   // Determine color CSS class name list.
-  const className = (0, _classnames.default)(textClass, gradientClass, {
+  const className = (0, _clsx.default)(textClass, gradientClass, {
     // Don't apply the background class if there's a gradient.
     [backgroundClass]: !hasGradient && !!backgroundClass,
     'has-text-color': textColor || style?.color?.text,

package/build/hooks/use-color-props.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_style","_colors","_gradients","_useSettings","getColorClassesAndStyles","attributes","backgroundColor","textColor","gradient","style","backgroundClass","getColorClassName","textClass","gradientClass","__experimentalGetGradientClass","hasGradient","color","className","classnames","text","background","elements","link","colorStyles","styleProp","getInlineStyles","undefined","useColorProps","userPalette","themePalette","defaultPalette","userGradients","themeGradients","defaultGradients","useSettings","colors","useMemo","gradients","colorProps","backgroundColorObject","getColorObjectByAttributeValues","getGradientValueBySlug","textColorObject"],"sources":["@wordpress/block-editor/src/hooks/use-color-props.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getInlineStyles } from './style';\nimport {\n\tgetColorClassName,\n\tgetColorObjectByAttributeValues,\n} from '../components/colors';\nimport {\n\t__experimentalGetGradientClass,\n\tgetGradientValueBySlug,\n} from '../components/gradients';\nimport { useSettings } from '../components/use-settings';\n\n// The code in this file has largely been lifted from the color block support\n// hook.\n//\n// This utility is intended to assist where the serialization of the colors\n// block support is being skipped for a block but the color related CSS classes\n// & styles still need to be generated so they can be applied to inner elements.\n\n/**\n * Provides the CSS class names and inline styles for a block's color support\n * attributes.\n *\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Color block support derived CSS classes & styles.\n */\nexport function getColorClassesAndStyles( attributes ) {\n\tconst { backgroundColor, textColor, gradient, style } = attributes;\n\n\t// Collect color CSS classes.\n\tconst backgroundClass = getColorClassName(\n\t\t'background-color',\n\t\tbackgroundColor\n\t);\n\tconst textClass = getColorClassName( 'color', textColor );\n\n\tconst gradientClass = __experimentalGetGradientClass( gradient );\n\tconst hasGradient = gradientClass || style?.color?.gradient;\n\n\t// Determine color CSS class name list.\n\tconst className = classnames( textClass, gradientClass, {\n\t\t// Don't apply the background class if there's a gradient.\n\t\t[ backgroundClass ]: ! hasGradient && !! backgroundClass,\n\t\t'has-text-color': textColor || style?.color?.text,\n\t\t'has-background':\n\t\t\tbackgroundColor ||\n\t\t\tstyle?.color?.background ||\n\t\t\tgradient ||\n\t\t\tstyle?.color?.gradient,\n\t\t'has-link-color': style?.elements?.link?.color,\n\t} );\n\n\t// Collect inline styles for colors.\n\tconst colorStyles = style?.color || {};\n\tconst styleProp = getInlineStyles( { color: colorStyles } );\n\n\treturn {\n\t\tclassName: className || undefined,\n\t\tstyle: styleProp,\n\t};\n}\n\n/**\n * Determines the color related props for a block derived from its color block\n * support attributes.\n *\n * Inline styles are forced for named colors to ensure these selections are\n * reflected when themes do not load their color stylesheets in the editor.\n *\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} ClassName & style props from colors block support.\n */\nexport function useColorProps( attributes ) {\n\tconst { backgroundColor, textColor, gradient } = attributes;\n\n\tconst [\n\t\tuserPalette,\n\t\tthemePalette,\n\t\tdefaultPalette,\n\t\tuserGradients,\n\t\tthemeGradients,\n\t\tdefaultGradients,\n\t] = useSettings(\n\t\t'color.palette.custom',\n\t\t'color.palette.theme',\n\t\t'color.palette.default',\n\t\t'color.gradients.custom',\n\t\t'color.gradients.theme',\n\t\t'color.gradients.default'\n\t);\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( userPalette || [] ),\n\t\t\t...( themePalette || [] ),\n\t\t\t...( defaultPalette || [] ),\n\t\t],\n\t\t[ userPalette, themePalette, defaultPalette ]\n\t);\n\tconst gradients = useMemo(\n\t\t() => [\n\t\t\t...( userGradients || [] ),\n\t\t\t...( themeGradients || [] ),\n\t\t\t...( defaultGradients || [] ),\n\t\t],\n\t\t[ userGradients, themeGradients, defaultGradients ]\n\t);\n\n\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t// Force inline styles to apply colors when themes do not load their color\n\t// stylesheets in the editor.\n\tif ( backgroundColor ) {\n\t\tconst backgroundColorObject = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\tbackgroundColor\n\t\t);\n\n\t\tcolorProps.style.backgroundColor = backgroundColorObject.color;\n\t}\n\n\tif ( gradient ) {\n\t\tcolorProps.style.background = getGradientValueBySlug(\n\t\t\tgradients,\n\t\t\tgradient\n\t\t);\n\t}\n\n\tif ( textColor ) {\n\t\tconst textColorObject = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\ttextColor\n\t\t);\n\n\t\tcolorProps.style.color = textColorObject.color;\n\t}\n\n\treturn colorProps;\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_style","_colors","_gradients","_useSettings","getColorClassesAndStyles","attributes","backgroundColor","textColor","gradient","style","backgroundClass","getColorClassName","textClass","gradientClass","__experimentalGetGradientClass","hasGradient","color","className","clsx","text","background","elements","link","colorStyles","styleProp","getInlineStyles","undefined","useColorProps","userPalette","themePalette","defaultPalette","userGradients","themeGradients","defaultGradients","useSettings","colors","useMemo","gradients","colorProps","backgroundColorObject","getColorObjectByAttributeValues","getGradientValueBySlug","textColorObject"],"sources":["@wordpress/block-editor/src/hooks/use-color-props.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getInlineStyles } from './style';\nimport {\n\tgetColorClassName,\n\tgetColorObjectByAttributeValues,\n} from '../components/colors';\nimport {\n\t__experimentalGetGradientClass,\n\tgetGradientValueBySlug,\n} from '../components/gradients';\nimport { useSettings } from '../components/use-settings';\n\n// The code in this file has largely been lifted from the color block support\n// hook.\n//\n// This utility is intended to assist where the serialization of the colors\n// block support is being skipped for a block but the color related CSS classes\n// & styles still need to be generated so they can be applied to inner elements.\n\n/**\n * Provides the CSS class names and inline styles for a block's color support\n * attributes.\n *\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Color block support derived CSS classes & styles.\n */\nexport function getColorClassesAndStyles( attributes ) {\n\tconst { backgroundColor, textColor, gradient, style } = attributes;\n\n\t// Collect color CSS classes.\n\tconst backgroundClass = getColorClassName(\n\t\t'background-color',\n\t\tbackgroundColor\n\t);\n\tconst textClass = getColorClassName( 'color', textColor );\n\n\tconst gradientClass = __experimentalGetGradientClass( gradient );\n\tconst hasGradient = gradientClass || style?.color?.gradient;\n\n\t// Determine color CSS class name list.\n\tconst className = clsx( textClass, gradientClass, {\n\t\t// Don't apply the background class if there's a gradient.\n\t\t[ backgroundClass ]: ! hasGradient && !! backgroundClass,\n\t\t'has-text-color': textColor || style?.color?.text,\n\t\t'has-background':\n\t\t\tbackgroundColor ||\n\t\t\tstyle?.color?.background ||\n\t\t\tgradient ||\n\t\t\tstyle?.color?.gradient,\n\t\t'has-link-color': style?.elements?.link?.color,\n\t} );\n\n\t// Collect inline styles for colors.\n\tconst colorStyles = style?.color || {};\n\tconst styleProp = getInlineStyles( { color: colorStyles } );\n\n\treturn {\n\t\tclassName: className || undefined,\n\t\tstyle: styleProp,\n\t};\n}\n\n/**\n * Determines the color related props for a block derived from its color block\n * support attributes.\n *\n * Inline styles are forced for named colors to ensure these selections are\n * reflected when themes do not load their color stylesheets in the editor.\n *\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} ClassName & style props from colors block support.\n */\nexport function useColorProps( attributes ) {\n\tconst { backgroundColor, textColor, gradient } = attributes;\n\n\tconst [\n\t\tuserPalette,\n\t\tthemePalette,\n\t\tdefaultPalette,\n\t\tuserGradients,\n\t\tthemeGradients,\n\t\tdefaultGradients,\n\t] = useSettings(\n\t\t'color.palette.custom',\n\t\t'color.palette.theme',\n\t\t'color.palette.default',\n\t\t'color.gradients.custom',\n\t\t'color.gradients.theme',\n\t\t'color.gradients.default'\n\t);\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( userPalette || [] ),\n\t\t\t...( themePalette || [] ),\n\t\t\t...( defaultPalette || [] ),\n\t\t],\n\t\t[ userPalette, themePalette, defaultPalette ]\n\t);\n\tconst gradients = useMemo(\n\t\t() => [\n\t\t\t...( userGradients || [] ),\n\t\t\t...( themeGradients || [] ),\n\t\t\t...( defaultGradients || [] ),\n\t\t],\n\t\t[ userGradients, themeGradients, defaultGradients ]\n\t);\n\n\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t// Force inline styles to apply colors when themes do not load their color\n\t// stylesheets in the editor.\n\tif ( backgroundColor ) {\n\t\tconst backgroundColorObject = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\tbackgroundColor\n\t\t);\n\n\t\tcolorProps.style.backgroundColor = backgroundColorObject.color;\n\t}\n\n\tif ( gradient ) {\n\t\tcolorProps.style.background = getGradientValueBySlug(\n\t\t\tgradients,\n\t\t\tgradient\n\t\t);\n\t}\n\n\tif ( textColor ) {\n\t\tconst textColorObject = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\ttextColor\n\t\t);\n\n\t\tcolorProps.style.color = textColorObject.color;\n\t}\n\n\treturn colorProps;\n}\n"],"mappings":"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","ignoreList":[]}

package/build/hooks/use-typography-props.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getTypographyClassesAndStyles = getTypographyClassesAndStyles;
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _components = require("@wordpress/components");
 var _style = require("./style");
 var _fontSizes = require("../components/font-sizes");
@@ -23,6 +23,10 @@ var _lockUnlock = require("../lock-unlock");
  * Internal dependencies
  */
 
+const {
+  kebabCase
+} = (0, _lockUnlock.unlock)(_components.privateApis);
+
 /*
  * This utility is intended to assist where the serialization of the typography
  * block support is being skipped for a block but the typography related CSS
@@ -38,9 +42,6 @@ var _lockUnlock = require("../lock-unlock");
  * @return {Object} Typography block support derived CSS classes & styles.
  */
 function getTypographyClassesAndStyles(attributes, settings) {
-  const {
-    kebabCase
-  } = (0, _lockUnlock.unlock)(_components.privateApis);
   let typographyStyles = attributes?.style?.typography || {};
   typographyStyles = {
     ...typographyStyles,
@@ -53,7 +54,7 @@ function getTypographyClassesAndStyles(attributes, settings) {
   });
   const fontFamilyClassName = !!attributes?.fontFamily ? `has-${kebabCase(attributes.fontFamily)}-font-family` : '';
   const textAlignClassName = !!attributes?.style?.typography?.textAlign ? `has-text-align-${attributes?.style?.typography?.textAlign}` : '';
-  const className = (0, _classnames.default)(fontFamilyClassName, textAlignClassName, (0, _fontSizes.getFontSizeClass)(attributes?.fontSize));
+  const className = (0, _clsx.default)(fontFamilyClassName, textAlignClassName, (0, _fontSizes.getFontSizeClass)(attributes?.fontSize));
   return {
     className,
     style

package/build/hooks/use-typography-props.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_style","_fontSizes","_typographyUtils","_lockUnlock","getTypographyClassesAndStyles","attributes","settings","kebabCase","unlock","componentsPrivateApis","typographyStyles","style","typography","fontSize","getTypographyFontSizeValue","size","getInlineStyles","fontFamilyClassName","fontFamily","textAlignClassName","textAlign","className","classnames","getFontSizeClass"],"sources":["@wordpress/block-editor/src/hooks/use-typography-props.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { getInlineStyles } from './style';\nimport { getFontSizeClass } from '../components/font-sizes';\nimport { getTypographyFontSizeValue } from '../components/global-styles/typography-utils';\nimport { unlock } from '../lock-unlock';\n\n/*\n * This utility is intended to assist where the serialization of the typography\n * block support is being skipped for a block but the typography related CSS\n * styles still need to be generated so they can be applied to inner elements.\n */\n/**\n * Provides the CSS class names and inline styles for a block's typography support\n * attributes.\n *\n * @param {Object}         attributes Block attributes.\n * @param {Object|boolean} settings   Merged theme.json settings\n *\n * @return {Object} Typography block support derived CSS classes & styles.\n */\nexport function getTypographyClassesAndStyles( attributes, settings ) {\n\tconst { kebabCase } = unlock( componentsPrivateApis );\n\tlet typographyStyles = attributes?.style?.typography || {};\n\ttypographyStyles = {\n\t\t...typographyStyles,\n\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t{ size: attributes?.style?.typography?.fontSize },\n\t\t\tsettings\n\t\t),\n\t};\n\n\tconst style = getInlineStyles( { typography: typographyStyles } );\n\tconst fontFamilyClassName = !! attributes?.fontFamily\n\t\t? `has-${ kebabCase( attributes.fontFamily ) }-font-family`\n\t\t: '';\n\tconst textAlignClassName = !! attributes?.style?.typography?.textAlign\n\t\t? `has-text-align-${ attributes?.style?.typography?.textAlign }`\n\t\t: '';\n\tconst className = classnames(\n\t\tfontFamilyClassName,\n\t\ttextAlignClassName,\n\t\tgetFontSizeClass( attributes?.fontSize )\n\t);\n\n\treturn {\n\t\tclassName,\n\t\tstyle,\n\t};\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,WAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AACA,IAAAI,gBAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASM,6BAA6BA,CAAEC,UAAU,EAAEC,QAAQ,EAAG;EACrE,MAAM;IAAEC;EAAU,CAAC,GAAG,IAAAC,kBAAM,EAAEC,uBAAsB,CAAC;EACrD,IAAIC,gBAAgB,GAAGL,UAAU,EAAEM,KAAK,EAAEC,UAAU,IAAI,CAAC,CAAC;EAC1DF,gBAAgB,GAAG;IAClB,GAAGA,gBAAgB;IACnBG,QAAQ,EAAE,IAAAC,2CAA0B,EACnC;MAAEC,IAAI,EAAEV,UAAU,EAAEM,KAAK,EAAEC,UAAU,EAAEC;IAAS,CAAC,EACjDP,QACD;EACD,CAAC;EAED,MAAMK,KAAK,GAAG,IAAAK,sBAAe,EAAE;IAAEJ,UAAU,EAAEF;EAAiB,CAAE,CAAC;EACjE,MAAMO,mBAAmB,GAAG,CAAC,CAAEZ,UAAU,EAAEa,UAAU,GACjD,OAAOX,SAAS,CAAEF,UAAU,CAACa,UAAW,CAAG,cAAa,GACzD,EAAE;EACL,MAAMC,kBAAkB,GAAG,CAAC,CAAEd,UAAU,EAAEM,KAAK,EAAEC,UAAU,EAAEQ,SAAS,GAClE,kBAAkBf,UAAU,EAAEM,KAAK,EAAEC,UAAU,EAAEQ,SAAW,EAAC,GAC9D,EAAE;EACL,MAAMC,SAAS,GAAG,IAAAC,mBAAU,EAC3BL,mBAAmB,EACnBE,kBAAkB,EAClB,IAAAI,2BAAgB,EAAElB,UAAU,EAAEQ,QAAS,CACxC,CAAC;EAED,OAAO;IACNQ,SAAS;IACTV;EACD,CAAC;AACF","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_style","_fontSizes","_typographyUtils","_lockUnlock","kebabCase","unlock","componentsPrivateApis","getTypographyClassesAndStyles","attributes","settings","typographyStyles","style","typography","fontSize","getTypographyFontSizeValue","size","getInlineStyles","fontFamilyClassName","fontFamily","textAlignClassName","textAlign","className","clsx","getFontSizeClass"],"sources":["@wordpress/block-editor/src/hooks/use-typography-props.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { getInlineStyles } from './style';\nimport { getFontSizeClass } from '../components/font-sizes';\nimport { getTypographyFontSizeValue } from '../components/global-styles/typography-utils';\nimport { unlock } from '../lock-unlock';\n\nconst { kebabCase } = unlock( componentsPrivateApis );\n\n/*\n * This utility is intended to assist where the serialization of the typography\n * block support is being skipped for a block but the typography related CSS\n * styles still need to be generated so they can be applied to inner elements.\n */\n/**\n * Provides the CSS class names and inline styles for a block's typography support\n * attributes.\n *\n * @param {Object}         attributes Block attributes.\n * @param {Object|boolean} settings   Merged theme.json settings\n *\n * @return {Object} Typography block support derived CSS classes & styles.\n */\nexport function getTypographyClassesAndStyles( attributes, settings ) {\n\tlet typographyStyles = attributes?.style?.typography || {};\n\ttypographyStyles = {\n\t\t...typographyStyles,\n\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t{ size: attributes?.style?.typography?.fontSize },\n\t\t\tsettings\n\t\t),\n\t};\n\n\tconst style = getInlineStyles( { typography: typographyStyles } );\n\tconst fontFamilyClassName = !! attributes?.fontFamily\n\t\t? `has-${ kebabCase( attributes.fontFamily ) }-font-family`\n\t\t: '';\n\tconst textAlignClassName = !! attributes?.style?.typography?.textAlign\n\t\t? `has-text-align-${ attributes?.style?.typography?.textAlign }`\n\t\t: '';\n\tconst className = clsx(\n\t\tfontFamilyClassName,\n\t\ttextAlignClassName,\n\t\tgetFontSizeClass( attributes?.fontSize )\n\t);\n\n\treturn {\n\t\tclassName,\n\t\tstyle,\n\t};\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,WAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AACA,IAAAI,gBAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA,MAAM;EAAEM;AAAU,CAAC,GAAG,IAAAC,kBAAM,EAAEC,uBAAsB,CAAC;;AAErD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,6BAA6BA,CAAEC,UAAU,EAAEC,QAAQ,EAAG;EACrE,IAAIC,gBAAgB,GAAGF,UAAU,EAAEG,KAAK,EAAEC,UAAU,IAAI,CAAC,CAAC;EAC1DF,gBAAgB,GAAG;IAClB,GAAGA,gBAAgB;IACnBG,QAAQ,EAAE,IAAAC,2CAA0B,EACnC;MAAEC,IAAI,EAAEP,UAAU,EAAEG,KAAK,EAAEC,UAAU,EAAEC;IAAS,CAAC,EACjDJ,QACD;EACD,CAAC;EAED,MAAME,KAAK,GAAG,IAAAK,sBAAe,EAAE;IAAEJ,UAAU,EAAEF;EAAiB,CAAE,CAAC;EACjE,MAAMO,mBAAmB,GAAG,CAAC,CAAET,UAAU,EAAEU,UAAU,GACjD,OAAOd,SAAS,CAAEI,UAAU,CAACU,UAAW,CAAG,cAAa,GACzD,EAAE;EACL,MAAMC,kBAAkB,GAAG,CAAC,CAAEX,UAAU,EAAEG,KAAK,EAAEC,UAAU,EAAEQ,SAAS,GAClE,kBAAkBZ,UAAU,EAAEG,KAAK,EAAEC,UAAU,EAAEQ,SAAW,EAAC,GAC9D,EAAE;EACL,MAAMC,SAAS,GAAG,IAAAC,aAAI,EACrBL,mBAAmB,EACnBE,kBAAkB,EAClB,IAAAI,2BAAgB,EAAEf,UAAU,EAAEK,QAAS,CACxC,CAAC;EAED,OAAO;IACNQ,SAAS;IACTV;EACD,CAAC;AACF","ignoreList":[]}

package/build/hooks/use-zoom-out.js

@@ -36,7 +36,7 @@ function useZoomOut(zoomOut = true) {
     }
     return () => {
       // We need to use  __unstableGetEditorMode() here and not `mode`, as mode may not update on unmount
-      if (__unstableGetEditorMode() !== originalEditingMode.current) {
+      if (__unstableGetEditorMode() === 'zoom-out' && __unstableGetEditorMode() !== originalEditingMode.current) {
         __unstableSetEditorMode(originalEditingMode.current);
       }
     };
@@ -46,7 +46,7 @@ function useZoomOut(zoomOut = true) {
   (0, _element.useEffect)(() => {
     if (zoomOut && mode !== 'zoom-out') {
       __unstableSetEditorMode('zoom-out');
-    } else if (!zoomOut && originalEditingMode.current !== mode) {
+    } else if (!zoomOut && __unstableGetEditorMode() === 'zoom-out' && originalEditingMode.current !== mode) {
       __unstableSetEditorMode(originalEditingMode.current);
     }
   }, [__unstableSetEditorMode, zoomOut, mode]);

package/build/hooks/use-zoom-out.js.map

@@ -1 +1 @@
-{"version":3,"names":["_data","require","_element","_store","useZoomOut","zoomOut","__unstableSetEditorMode","useDispatch","blockEditorStore","__unstableGetEditorMode","useSelect","originalEditingMode","useRef","mode","useEffect","current"],"sources":["@wordpress/block-editor/src/hooks/use-zoom-out.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\n\n/**\n * A hook used to set the editor mode to zoomed out mode, invoking the hook sets the mode.\n *\n * @param {boolean} zoomOut If we should enter into zoomOut mode or not\n */\nexport function useZoomOut( zoomOut = true ) {\n\tconst { __unstableSetEditorMode } = useDispatch( blockEditorStore );\n\tconst { __unstableGetEditorMode } = useSelect( blockEditorStore );\n\n\tconst originalEditingMode = useRef( null );\n\tconst mode = __unstableGetEditorMode();\n\n\tuseEffect( () => {\n\t\t// Only set this on mount so we know what to return to when we unmount.\n\t\tif ( ! originalEditingMode.current ) {\n\t\t\toriginalEditingMode.current = mode;\n\t\t}\n\n\t\treturn () => {\n\t\t\t// We need to use  __unstableGetEditorMode() here and not `mode`, as mode may not update on unmount\n\t\t\tif ( __unstableGetEditorMode() !== originalEditingMode.current ) {\n\t\t\t\t__unstableSetEditorMode( originalEditingMode.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\t// The effect opens the zoom-out view if we want it open and it's not currently in zoom-out mode.\n\tuseEffect( () => {\n\t\tif ( zoomOut && mode !== 'zoom-out' ) {\n\t\t\t__unstableSetEditorMode( 'zoom-out' );\n\t\t} else if ( ! zoomOut && originalEditingMode.current !== mode ) {\n\t\t\t__unstableSetEditorMode( originalEditingMode.current );\n\t\t}\n\t}, [ __unstableSetEditorMode, zoomOut, mode ] );\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACO,SAASG,UAAUA,CAAEC,OAAO,GAAG,IAAI,EAAG;EAC5C,MAAM;IAAEC;EAAwB,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EACnE,MAAM;IAAEC;EAAwB,CAAC,GAAG,IAAAC,eAAS,EAAEF,YAAiB,CAAC;EAEjE,MAAMG,mBAAmB,GAAG,IAAAC,eAAM,EAAE,IAAK,CAAC;EAC1C,MAAMC,IAAI,GAAGJ,uBAAuB,CAAC,CAAC;EAEtC,IAAAK,kBAAS,EAAE,MAAM;IAChB;IACA,IAAK,CAAEH,mBAAmB,CAACI,OAAO,EAAG;MACpCJ,mBAAmB,CAACI,OAAO,GAAGF,IAAI;IACnC;IAEA,OAAO,MAAM;MACZ;MACA,IAAKJ,uBAAuB,CAAC,CAAC,KAAKE,mBAAmB,CAACI,OAAO,EAAG;QAChET,uBAAuB,CAAEK,mBAAmB,CAACI,OAAQ,CAAC;MACvD;IACD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;;EAEP;EACA,IAAAD,kBAAS,EAAE,MAAM;IAChB,IAAKT,OAAO,IAAIQ,IAAI,KAAK,UAAU,EAAG;MACrCP,uBAAuB,CAAE,UAAW,CAAC;IACtC,CAAC,MAAM,IAAK,CAAED,OAAO,IAAIM,mBAAmB,CAACI,OAAO,KAAKF,IAAI,EAAG;MAC/DP,uBAAuB,CAAEK,mBAAmB,CAACI,OAAQ,CAAC;IACvD;EACD,CAAC,EAAE,CAAET,uBAAuB,EAAED,OAAO,EAAEQ,IAAI,CAAG,CAAC;AAChD","ignoreList":[]}
+{"version":3,"names":["_data","require","_element","_store","useZoomOut","zoomOut","__unstableSetEditorMode","useDispatch","blockEditorStore","__unstableGetEditorMode","useSelect","originalEditingMode","useRef","mode","useEffect","current"],"sources":["@wordpress/block-editor/src/hooks/use-zoom-out.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\n\n/**\n * A hook used to set the editor mode to zoomed out mode, invoking the hook sets the mode.\n *\n * @param {boolean} zoomOut If we should enter into zoomOut mode or not\n */\nexport function useZoomOut( zoomOut = true ) {\n\tconst { __unstableSetEditorMode } = useDispatch( blockEditorStore );\n\tconst { __unstableGetEditorMode } = useSelect( blockEditorStore );\n\n\tconst originalEditingMode = useRef( null );\n\tconst mode = __unstableGetEditorMode();\n\n\tuseEffect( () => {\n\t\t// Only set this on mount so we know what to return to when we unmount.\n\t\tif ( ! originalEditingMode.current ) {\n\t\t\toriginalEditingMode.current = mode;\n\t\t}\n\n\t\treturn () => {\n\t\t\t// We need to use  __unstableGetEditorMode() here and not `mode`, as mode may not update on unmount\n\t\t\tif (\n\t\t\t\t__unstableGetEditorMode() === 'zoom-out' &&\n\t\t\t\t__unstableGetEditorMode() !== originalEditingMode.current\n\t\t\t) {\n\t\t\t\t__unstableSetEditorMode( originalEditingMode.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\t// The effect opens the zoom-out view if we want it open and it's not currently in zoom-out mode.\n\tuseEffect( () => {\n\t\tif ( zoomOut && mode !== 'zoom-out' ) {\n\t\t\t__unstableSetEditorMode( 'zoom-out' );\n\t\t} else if (\n\t\t\t! zoomOut &&\n\t\t\t__unstableGetEditorMode() === 'zoom-out' &&\n\t\t\toriginalEditingMode.current !== mode\n\t\t) {\n\t\t\t__unstableSetEditorMode( originalEditingMode.current );\n\t\t}\n\t}, [ __unstableSetEditorMode, zoomOut, mode ] );\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACO,SAASG,UAAUA,CAAEC,OAAO,GAAG,IAAI,EAAG;EAC5C,MAAM;IAAEC;EAAwB,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EACnE,MAAM;IAAEC;EAAwB,CAAC,GAAG,IAAAC,eAAS,EAAEF,YAAiB,CAAC;EAEjE,MAAMG,mBAAmB,GAAG,IAAAC,eAAM,EAAE,IAAK,CAAC;EAC1C,MAAMC,IAAI,GAAGJ,uBAAuB,CAAC,CAAC;EAEtC,IAAAK,kBAAS,EAAE,MAAM;IAChB;IACA,IAAK,CAAEH,mBAAmB,CAACI,OAAO,EAAG;MACpCJ,mBAAmB,CAACI,OAAO,GAAGF,IAAI;IACnC;IAEA,OAAO,MAAM;MACZ;MACA,IACCJ,uBAAuB,CAAC,CAAC,KAAK,UAAU,IACxCA,uBAAuB,CAAC,CAAC,KAAKE,mBAAmB,CAACI,OAAO,EACxD;QACDT,uBAAuB,CAAEK,mBAAmB,CAACI,OAAQ,CAAC;MACvD;IACD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;;EAEP;EACA,IAAAD,kBAAS,EAAE,MAAM;IAChB,IAAKT,OAAO,IAAIQ,IAAI,KAAK,UAAU,EAAG;MACrCP,uBAAuB,CAAE,UAAW,CAAC;IACtC,CAAC,MAAM,IACN,CAAED,OAAO,IACTI,uBAAuB,CAAC,CAAC,KAAK,UAAU,IACxCE,mBAAmB,CAACI,OAAO,KAAKF,IAAI,EACnC;MACDP,uBAAuB,CAAEK,mBAAmB,CAACI,OAAQ,CAAC;IACvD;EACD,CAAC,EAAE,CAAET,uBAAuB,EAAED,OAAO,EAAEQ,IAAI,CAAG,CAAC;AAChD","ignoreList":[]}

package/build/hooks/utils.js

@@ -12,7 +12,6 @@ exports.shouldSkipSerialization = shouldSkipSerialization;
 exports.transformStyles = transformStyles;
 exports.useBlockSettings = useBlockSettings;
 exports.useStyleOverride = useStyleOverride;
-var _react = require("react");
 var _blocks = require("@wordpress/blocks");
 var _element = require("@wordpress/element");
 var _data = require("@wordpress/data");
@@ -24,7 +23,8 @@ var _hooks2 = require("../components/global-styles/hooks");
 var _object = require("../utils/object");
 var _store = require("../store");
 var _lockUnlock = require("../lock-unlock");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
  */
@@ -176,7 +176,7 @@ function useStyleOverride({
  * @return {Object} Settings object.
  */
 function useBlockSettings(name, parentLayout) {
-  const [backgroundImage, backgroundSize, customFontFamilies, defaultFontFamilies, themeFontFamilies, defaultFontSizesEnabled, customFontSizes, defaultFontSizes, themeFontSizes, customFontSize, fontStyle, fontWeight, lineHeight, textAlign, textColumns, textDecoration, writingMode, textTransform, letterSpacing, padding, margin, blockGap, spacingSizes, units, aspectRatio, minHeight, layout, borderColor, borderRadius, borderStyle, borderWidth, customColorsEnabled, customColors, customDuotone, themeColors, defaultColors, defaultPalette, defaultDuotone, userDuotonePalette, themeDuotonePalette, defaultDuotonePalette, userGradientPalette, themeGradientPalette, defaultGradientPalette, defaultGradients, areCustomGradientsEnabled, isBackgroundEnabled, isLinkEnabled, isTextEnabled, isHeadingEnabled, isButtonEnabled, shadow] = (0, _components.useSettings)('background.backgroundImage', 'background.backgroundSize', 'typography.fontFamilies.custom', 'typography.fontFamilies.default', 'typography.fontFamilies.theme', 'typography.defaultFontSizes', 'typography.fontSizes.custom', 'typography.fontSizes.default', 'typography.fontSizes.theme', 'typography.customFontSize', 'typography.fontStyle', 'typography.fontWeight', 'typography.lineHeight', 'typography.textAlign', 'typography.textColumns', 'typography.textDecoration', 'typography.writingMode', 'typography.textTransform', 'typography.letterSpacing', 'spacing.padding', 'spacing.margin', 'spacing.blockGap', 'spacing.spacingSizes', 'spacing.units', 'dimensions.aspectRatio', 'dimensions.minHeight', 'layout', 'border.color', 'border.radius', 'border.style', 'border.width', 'color.custom', 'color.palette.custom', 'color.customDuotone', 'color.palette.theme', 'color.palette.default', 'color.defaultPalette', 'color.defaultDuotone', 'color.duotone.custom', 'color.duotone.theme', 'color.duotone.default', 'color.gradients.custom', 'color.gradients.theme', 'color.gradients.default', 'color.defaultGradients', 'color.customGradient', 'color.background', 'color.link', 'color.text', 'color.heading', 'color.button', 'shadow');
+  const [backgroundImage, backgroundSize, customFontFamilies, defaultFontFamilies, themeFontFamilies, defaultFontSizesEnabled, customFontSizes, defaultFontSizes, themeFontSizes, customFontSize, fontStyle, fontWeight, lineHeight, textAlign, textColumns, textDecoration, writingMode, textTransform, letterSpacing, padding, margin, blockGap, defaultSpacingSizesEnabled, customSpacingSize, userSpacingSizes, defaultSpacingSizes, themeSpacingSizes, units, aspectRatio, minHeight, layout, borderColor, borderRadius, borderStyle, borderWidth, customColorsEnabled, customColors, customDuotone, themeColors, defaultColors, defaultPalette, defaultDuotone, userDuotonePalette, themeDuotonePalette, defaultDuotonePalette, userGradientPalette, themeGradientPalette, defaultGradientPalette, defaultGradients, areCustomGradientsEnabled, isBackgroundEnabled, isLinkEnabled, isTextEnabled, isHeadingEnabled, isButtonEnabled, shadow] = (0, _components.useSettings)('background.backgroundImage', 'background.backgroundSize', 'typography.fontFamilies.custom', 'typography.fontFamilies.default', 'typography.fontFamilies.theme', 'typography.defaultFontSizes', 'typography.fontSizes.custom', 'typography.fontSizes.default', 'typography.fontSizes.theme', 'typography.customFontSize', 'typography.fontStyle', 'typography.fontWeight', 'typography.lineHeight', 'typography.textAlign', 'typography.textColumns', 'typography.textDecoration', 'typography.writingMode', 'typography.textTransform', 'typography.letterSpacing', 'spacing.padding', 'spacing.margin', 'spacing.blockGap', 'spacing.defaultSpacingSizes', 'spacing.customSpacingSize', 'spacing.spacingSizes.custom', 'spacing.spacingSizes.default', 'spacing.spacingSizes.theme', 'spacing.units', 'dimensions.aspectRatio', 'dimensions.minHeight', 'layout', 'border.color', 'border.radius', 'border.style', 'border.width', 'color.custom', 'color.palette.custom', 'color.customDuotone', 'color.palette.theme', 'color.palette.default', 'color.defaultPalette', 'color.defaultDuotone', 'color.duotone.custom', 'color.duotone.theme', 'color.duotone.default', 'color.gradients.custom', 'color.gradients.theme', 'color.gradients.default', 'color.defaultGradients', 'color.customGradient', 'color.background', 'color.link', 'color.text', 'color.heading', 'color.button', 'shadow');
   const rawSettings = (0, _element.useMemo)(() => {
     return {
       background: {
@@ -236,8 +236,12 @@ function useBlockSettings(name, parentLayout) {
       },
       spacing: {
         spacingSizes: {
-          custom: spacingSizes
+          custom: userSpacingSizes,
+          default: defaultSpacingSizes,
+          theme: themeSpacingSizes
         },
+        customSpacingSize,
+        defaultSpacingSizes: defaultSpacingSizesEnabled,
         padding,
         margin,
         blockGap,
@@ -257,7 +261,7 @@ function useBlockSettings(name, parentLayout) {
       parentLayout,
       shadow
     };
-  }, [backgroundImage, backgroundSize, customFontFamilies, defaultFontFamilies, themeFontFamilies, defaultFontSizesEnabled, customFontSizes, defaultFontSizes, themeFontSizes, customFontSize, fontStyle, fontWeight, lineHeight, textAlign, textColumns, textDecoration, textTransform, letterSpacing, writingMode, padding, margin, blockGap, spacingSizes, units, aspectRatio, minHeight, layout, parentLayout, borderColor, borderRadius, borderStyle, borderWidth, customColorsEnabled, customColors, customDuotone, themeColors, defaultColors, defaultPalette, defaultDuotone, userDuotonePalette, themeDuotonePalette, defaultDuotonePalette, userGradientPalette, themeGradientPalette, defaultGradientPalette, defaultGradients, areCustomGradientsEnabled, isBackgroundEnabled, isLinkEnabled, isTextEnabled, isHeadingEnabled, isButtonEnabled, shadow]);
+  }, [backgroundImage, backgroundSize, customFontFamilies, defaultFontFamilies, themeFontFamilies, defaultFontSizesEnabled, customFontSizes, defaultFontSizes, themeFontSizes, customFontSize, fontStyle, fontWeight, lineHeight, textAlign, textColumns, textDecoration, textTransform, letterSpacing, writingMode, padding, margin, blockGap, defaultSpacingSizesEnabled, customSpacingSize, userSpacingSizes, defaultSpacingSizes, themeSpacingSizes, units, aspectRatio, minHeight, layout, parentLayout, borderColor, borderRadius, borderStyle, borderWidth, customColorsEnabled, customColors, customDuotone, themeColors, defaultColors, defaultPalette, defaultDuotone, userDuotonePalette, themeDuotonePalette, defaultDuotonePalette, userGradientPalette, themeGradientPalette, defaultGradientPalette, defaultGradients, areCustomGradientsEnabled, isBackgroundEnabled, isLinkEnabled, isTextEnabled, isHeadingEnabled, isButtonEnabled, shadow]);
   return (0, _hooks2.useSettingsForBlockElement)(rawSettings, name);
 }
 function createBlockEditFilter(features) {
@@ -293,11 +297,10 @@ function createBlockEditFilter(features) {
           neededProps[key] = props.attributes[key];
         }
       }
-      return (0, _react.createElement)(Edit
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(Edit
       // We can use the index because the array length
       // is fixed per page load right now.
       , {
-        key: i,
         name: props.name,
         isSelected: props.isSelected,
         clientId: props.clientId,
@@ -307,11 +310,10 @@ function createBlockEditFilter(features) {
         // props!!!
         ,
         ...neededProps
-      });
-    }), (0, _react.createElement)(OriginalBlockEdit, {
-      key: "edit",
+      }, i);
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(OriginalBlockEdit, {
       ...props
-    })];
+    }, "edit")];
   }, 'withBlockEditHooks');
   (0, _hooks.addFilter)('editor.BlockEdit', 'core/editor/hooks', withBlockEditHooks);
 }
@@ -361,38 +363,37 @@ function createBlockListBlockFilter(features) {
       !Object.keys(neededProps).length || !hasSupport(props.name)) {
         return null;
       }
-      return (0, _react.createElement)(BlockPropsPure
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockPropsPure
       // We can use the index because the array length
       // is fixed per page load right now.
       , {
-        key: i,
         index: i,
         useBlockProps: useBlockProps
         // This component is pure, so we must pass a stable
         // function reference.
         ,
         setAllWrapperProps: setAllWrapperProps,
-        name: props.name
+        name: props.name,
+        clientId: props.clientId
         // This component is pure, so only pass needed
         // props!!!
         ,
         ...neededProps
-      });
-    }), (0, _react.createElement)(BlockListBlock, {
-      key: "edit",
+      }, i);
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockListBlock, {
       ...props,
       wrapperProps: allWrapperProps.filter(Boolean).reduce((acc, wrapperProps) => {
         return {
           ...acc,
           ...wrapperProps,
-          className: (0, _classnames.default)(acc.className, wrapperProps.className),
+          className: (0, _clsx.default)(acc.className, wrapperProps.className),
           style: {
             ...acc.style,
             ...wrapperProps.style
           }
         };
       }, props.wrapperProps || {})
-    })];
+    }, "edit")];
   }, 'withBlockListBlockHooks');
   (0, _hooks.addFilter)('editor.BlockListBlock', 'core/editor/hooks', withBlockListBlockHooks);
 }