@wordpress/block-library 11.0.2-next.v.202609171837.0 → 11.2.0

package/build-module/columns/edit.mjs

@@ -2,12 +2,9 @@
 import clsx from "clsx";
 import { __ } from "@wordpress/i18n";
 import {
-  Notice,
-  RangeControl,
   ToggleControl,
   __experimentalToolsPanel as ToolsPanel,
-  __experimentalToolsPanelItem as ToolsPanelItem,
-  __experimentalVStack as VStack
+  __experimentalToolsPanelItem as ToolsPanelItem
 } from "@wordpress/components";
 import {
   InspectorControls,
@@ -20,96 +17,17 @@ import {
 } from "@wordpress/block-editor";
 import { useDispatch, useSelect, useRegistry } from "@wordpress/data";
 import {
-  createBlock,
   createBlocksFromInnerBlocksTemplate,
   store as blocksStore
 } from "@wordpress/blocks";
-import {
-  hasExplicitPercentColumnWidths,
-  getMappedColumnWidths,
-  getRedistributedColumnWidths,
-  toWidthPrecision
-} from "./utils.mjs";
 import { useToolsPanelDropdownMenuProps } from "../utils/hooks.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var DEFAULT_BLOCK = {
   name: "core/column"
 };
-function ColumnInspectorControls({
-  clientId,
-  setAttributes,
-  isStackedOnMobile
-}) {
-  const { count, canInsertColumnBlock, minCount } = useSelect(
-    (select) => {
-      const { canInsertBlockType, canRemoveBlock, getBlockOrder } = select(blockEditorStore);
-      const blockOrder = getBlockOrder(clientId);
-      const preventRemovalBlockIndexes = blockOrder.reduce(
-        (acc, blockId, index) => {
-          if (!canRemoveBlock(blockId)) {
-            acc.push(index);
-          }
-          return acc;
-        },
-        []
-      );
-      return {
-        count: blockOrder.length,
-        canInsertColumnBlock: canInsertBlockType(
-          "core/column",
-          clientId
-        ),
-        minCount: Math.max(...preventRemovalBlockIndexes) + 1
-      };
-    },
-    [clientId]
-  );
-  const { getBlocks } = useSelect(blockEditorStore);
-  const { replaceInnerBlocks } = useDispatch(blockEditorStore);
-  function updateColumns(previousColumns, newColumns) {
-    let innerBlocks = getBlocks(clientId);
-    const hasExplicitWidths = hasExplicitPercentColumnWidths(innerBlocks);
-    const isAddingColumn = newColumns > previousColumns;
-    if (isAddingColumn && hasExplicitWidths) {
-      const newColumnWidth = toWidthPrecision(100 / newColumns);
-      const newlyAddedColumns = newColumns - previousColumns;
-      const widths = getRedistributedColumnWidths(
-        innerBlocks,
-        100 - newColumnWidth * newlyAddedColumns
-      );
-      innerBlocks = [
-        ...getMappedColumnWidths(innerBlocks, widths),
-        ...Array.from({
-          length: newlyAddedColumns
-        }).map(() => {
-          return createBlock("core/column", {
-            width: `${newColumnWidth}%`
-          });
-        })
-      ];
-    } else if (isAddingColumn) {
-      innerBlocks = [
-        ...innerBlocks,
-        ...Array.from({
-          length: newColumns - previousColumns
-        }).map(() => {
-          return createBlock("core/column");
-        })
-      ];
-    } else if (newColumns < previousColumns) {
-      innerBlocks = innerBlocks.slice(
-        0,
-        -(previousColumns - newColumns)
-      );
-      if (hasExplicitWidths) {
-        const widths = getRedistributedColumnWidths(innerBlocks, 100);
-        innerBlocks = getMappedColumnWidths(innerBlocks, widths);
-      }
-    }
-    replaceInnerBlocks(clientId, innerBlocks);
-  }
+function ColumnInspectorControls({ setAttributes, isStackedOnMobile }) {
   const dropdownMenuProps = useToolsPanelDropdownMenuProps();
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     ToolsPanel,
     {
       label: __("Settings"),
@@ -119,44 +37,27 @@ function ColumnInspectorControls({
         });
       },
       dropdownMenuProps,
-      children: [
-        canInsertColumnBlock && /* @__PURE__ */ jsxs(VStack, { spacing: 4, style: { gridColumn: "1 / -1" }, children: [
-          /* @__PURE__ */ jsx(
-            RangeControl,
+      children: /* @__PURE__ */ jsx(
+        ToolsPanelItem,
+        {
+          label: __("Stack on mobile"),
+          isShownByDefault: true,
+          hasValue: () => isStackedOnMobile !== true,
+          onDeselect: () => setAttributes({
+            isStackedOnMobile: true
+          }),
+          children: /* @__PURE__ */ jsx(
+            ToggleControl,
             {
-              label: __("Columns"),
-              value: count,
-              onChange: (value) => updateColumns(count, Math.max(minCount, value)),
-              min: Math.max(1, minCount),
-              max: Math.max(6, count)
+              label: __("Stack on mobile"),
+              checked: isStackedOnMobile,
+              onChange: () => setAttributes({
+                isStackedOnMobile: !isStackedOnMobile
+              })
             }
-          ),
-          count > 6 && /* @__PURE__ */ jsx(Notice, { status: "warning", isDismissible: false, children: __(
-            "This column count exceeds the recommended amount and may cause visual breakage."
-          ) })
-        ] }),
-        /* @__PURE__ */ jsx(
-          ToolsPanelItem,
-          {
-            label: __("Stack on mobile"),
-            isShownByDefault: true,
-            hasValue: () => isStackedOnMobile !== true,
-            onDeselect: () => setAttributes({
-              isStackedOnMobile: true
-            }),
-            children: /* @__PURE__ */ jsx(
-              ToggleControl,
-              {
-                label: __("Stack on mobile"),
-                checked: isStackedOnMobile,
-                onChange: () => setAttributes({
-                  isStackedOnMobile: !isStackedOnMobile
-                })
-              }
-            )
-          }
-        )
-      ]
+          )
+        }
+      )
     }
   );
 }
@@ -199,7 +100,6 @@ function ColumnsEditContainer({ attributes, setAttributes, clientId }) {
     /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsx(
       ColumnInspectorControls,
       {
-        clientId,
         setAttributes,
         isStackedOnMobile
       }

package/build-module/columns/edit.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/columns/edit.jsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tNotice,\n\tRangeControl,\n\tToggleControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport {\n\tInspectorControls,\n\tuseInnerBlocksProps,\n\tBlockControls,\n\tBlockVerticalAlignmentToolbar,\n\t__experimentalBlockVariationPicker,\n\tuseBlockProps,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect, useRegistry } from '@wordpress/data';\nimport {\n\tcreateBlock,\n\tcreateBlocksFromInnerBlocksTemplate,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport {\n\thasExplicitPercentColumnWidths,\n\tgetMappedColumnWidths,\n\tgetRedistributedColumnWidths,\n\ttoWidthPrecision,\n} from './utils';\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\nconst DEFAULT_BLOCK = {\n\tname: 'core/column',\n};\n\nfunction ColumnInspectorControls( {\n\tclientId,\n\tsetAttributes,\n\tisStackedOnMobile,\n} ) {\n\tconst { count, canInsertColumnBlock, minCount } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { canInsertBlockType, canRemoveBlock, getBlockOrder } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst blockOrder = getBlockOrder( clientId );\n\n\t\t\t// Get the indexes of columns for which removal is prevented.\n\t\t\t// The highest index will be used to determine the minimum column count.\n\t\t\tconst preventRemovalBlockIndexes = blockOrder.reduce(\n\t\t\t\t( acc, blockId, index ) => {\n\t\t\t\t\tif ( ! canRemoveBlock( blockId ) ) {\n\t\t\t\t\t\tacc.push( index );\n\t\t\t\t\t}\n\t\t\t\t\treturn acc;\n\t\t\t\t},\n\t\t\t\t[]\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tcount: blockOrder.length,\n\t\t\t\tcanInsertColumnBlock: canInsertBlockType(\n\t\t\t\t\t'core/column',\n\t\t\t\t\tclientId\n\t\t\t\t),\n\t\t\t\tminCount: Math.max( ...preventRemovalBlockIndexes ) + 1,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst { getBlocks } = useSelect( blockEditorStore );\n\tconst { replaceInnerBlocks } = useDispatch( blockEditorStore );\n\n\t/**\n\t * Updates the column count, including necessary revisions to child Column\n\t * blocks to grant required or redistribute available space.\n\t *\n\t * @param {number} previousColumns Previous column count.\n\t * @param {number} newColumns      New column count.\n\t */\n\tfunction updateColumns( previousColumns, newColumns ) {\n\t\tlet innerBlocks = getBlocks( clientId );\n\t\tconst hasExplicitWidths = hasExplicitPercentColumnWidths( innerBlocks );\n\n\t\t// Redistribute available width for existing inner blocks.\n\t\tconst isAddingColumn = newColumns > previousColumns;\n\n\t\tif ( isAddingColumn && hasExplicitWidths ) {\n\t\t\t// If adding a new column, assign width to the new column equal to\n\t\t\t// as if it were `1 / columns` of the total available space.\n\t\t\tconst newColumnWidth = toWidthPrecision( 100 / newColumns );\n\t\t\tconst newlyAddedColumns = newColumns - previousColumns;\n\n\t\t\t// Redistribute in consideration of pending block insertion as\n\t\t\t// constraining the available working width.\n\t\t\tconst widths = getRedistributedColumnWidths(\n\t\t\t\tinnerBlocks,\n\t\t\t\t100 - newColumnWidth * newlyAddedColumns\n\t\t\t);\n\n\t\t\tinnerBlocks = [\n\t\t\t\t...getMappedColumnWidths( innerBlocks, widths ),\n\t\t\t\t...Array.from( {\n\t\t\t\t\tlength: newlyAddedColumns,\n\t\t\t\t} ).map( () => {\n\t\t\t\t\treturn createBlock( 'core/column', {\n\t\t\t\t\t\twidth: `${ newColumnWidth }%`,\n\t\t\t\t\t} );\n\t\t\t\t} ),\n\t\t\t];\n\t\t} else if ( isAddingColumn ) {\n\t\t\tinnerBlocks = [\n\t\t\t\t...innerBlocks,\n\t\t\t\t...Array.from( {\n\t\t\t\t\tlength: newColumns - previousColumns,\n\t\t\t\t} ).map( () => {\n\t\t\t\t\treturn createBlock( 'core/column' );\n\t\t\t\t} ),\n\t\t\t];\n\t\t} else if ( newColumns < previousColumns ) {\n\t\t\t// The removed column will be the last of the inner blocks.\n\t\t\tinnerBlocks = innerBlocks.slice(\n\t\t\t\t0,\n\t\t\t\t-( previousColumns - newColumns )\n\t\t\t);\n\t\t\tif ( hasExplicitWidths ) {\n\t\t\t\t// Redistribute as if block is already removed.\n\t\t\t\tconst widths = getRedistributedColumnWidths( innerBlocks, 100 );\n\n\t\t\t\tinnerBlocks = getMappedColumnWidths( innerBlocks, widths );\n\t\t\t}\n\t\t}\n\n\t\treplaceInnerBlocks( clientId, innerBlocks );\n\t}\n\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Settings' ) }\n\t\t\tresetAll={ () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tisStackedOnMobile: true,\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t{ canInsertColumnBlock && (\n\t\t\t\t<VStack spacing={ 4 } style={ { gridColumn: '1 / -1' } }>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\tvalue={ count }\n\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\tupdateColumns( count, Math.max( minCount, value ) )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tmin={ Math.max( 1, minCount ) }\n\t\t\t\t\t\tmax={ Math.max( 6, count ) }\n\t\t\t\t\t/>\n\t\t\t\t\t{ count > 6 && (\n\t\t\t\t\t\t<Notice status=\"warning\" isDismissible={ false }>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'This column count exceeds the recommended amount and may cause visual breakage.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Notice>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t<ToolsPanelItem\n\t\t\t\tlabel={ __( 'Stack on mobile' ) }\n\t\t\t\tisShownByDefault\n\t\t\t\thasValue={ () => isStackedOnMobile !== true }\n\t\t\t\tonDeselect={ () =>\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\tisStackedOnMobile: true,\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Stack on mobile' ) }\n\t\t\t\t\tchecked={ isStackedOnMobile }\n\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tisStackedOnMobile: ! isStackedOnMobile,\n\t\t\t\t\t\t} )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</ToolsPanel>\n\t);\n}\n\nfunction ColumnsEditContainer( { attributes, setAttributes, clientId } ) {\n\tconst { isStackedOnMobile, verticalAlignment, templateLock } = attributes;\n\tconst registry = useRegistry();\n\tconst { getBlockOrder } = useSelect( blockEditorStore );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst classes = clsx( {\n\t\t[ `are-vertically-aligned-${ verticalAlignment }` ]: verticalAlignment,\n\t\t[ `is-not-stacked-on-mobile` ]: ! isStackedOnMobile,\n\t} );\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classes,\n\t} );\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\tdefaultBlock: DEFAULT_BLOCK,\n\t\tdirectInsert: true,\n\t\torientation: 'horizontal',\n\t\trenderAppender: false,\n\t\ttemplateLock,\n\t} );\n\n\t/**\n\t * Update all child Column blocks with a new vertical alignment setting\n\t * based on whatever alignment is passed in. This allows change to parent\n\t * to override anything set on a individual column basis.\n\t *\n\t * @param {string} newVerticalAlignment The vertical alignment setting.\n\t */\n\tfunction updateAlignment( newVerticalAlignment ) {\n\t\tconst innerBlockClientIds = getBlockOrder( clientId );\n\n\t\t// Update own and child Column block vertical alignments.\n\t\t// This is a single action; the batching prevents creating multiple history records.\n\t\tregistry.batch( () => {\n\t\t\tsetAttributes( { verticalAlignment: newVerticalAlignment } );\n\t\t\tupdateBlockAttributes( innerBlockClientIds, {\n\t\t\t\tverticalAlignment: newVerticalAlignment,\n\t\t\t} );\n\t\t} );\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls>\n\t\t\t\t<BlockVerticalAlignmentToolbar\n\t\t\t\t\tonChange={ updateAlignment }\n\t\t\t\t\tvalue={ verticalAlignment }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t\t<InspectorControls>\n\t\t\t\t<ColumnInspectorControls\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\tisStackedOnMobile={ isStackedOnMobile }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t\t<div { ...innerBlocksProps } />\n\t\t</>\n\t);\n}\n\nfunction Placeholder( { clientId, name, setAttributes } ) {\n\tconst { blockType, variations } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockVariations, getBlockType } = select( blocksStore );\n\n\t\t\treturn {\n\t\t\t\tblockType: getBlockType( name ),\n\t\t\t\tvariations: getBlockVariations( name, 'block' ),\n\t\t\t};\n\t\t},\n\t\t[ name ]\n\t);\n\tconst { replaceInnerBlocks } = useDispatch( blockEditorStore );\n\tconst blockProps = useBlockProps();\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t<__experimentalBlockVariationPicker\n\t\t\t\ticon={ blockType?.icon?.src }\n\t\t\t\tlabel={ blockType?.title }\n\t\t\t\tvariations={ variations }\n\t\t\t\tinstructions={ __( 'Divide into columns. Select a layout:' ) }\n\t\t\t\tonSelect={ ( nextVariation ) => {\n\t\t\t\t\tif ( nextVariation.attributes ) {\n\t\t\t\t\t\tsetAttributes( nextVariation.attributes );\n\t\t\t\t\t}\n\t\t\t\t\tif ( nextVariation.innerBlocks ) {\n\t\t\t\t\t\treplaceInnerBlocks(\n\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\tcreateBlocksFromInnerBlocksTemplate(\n\t\t\t\t\t\t\t\tnextVariation.innerBlocks\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\n/**\n * Renders the `core/columns` block in the editor.\n *\n * Until the block has inner blocks it renders a variation picker; afterwards it\n * renders the columns container. Every prop is forwarded to whichever of the two\n * is rendered.\n *\n * @param {Object}         props                                Component props.\n * @param {string}         props.clientId                       Client ID of the block.\n * @param {string}         props.name                           Block name, used to look up the variations offered by the picker.\n * @param {Object}         props.attributes                     Block attributes.\n * @param {string}         [props.attributes.verticalAlignment] Vertical alignment applied to the block and to every child Column block.\n * @param {boolean}        [props.attributes.isStackedOnMobile] Whether the columns stack on small viewports. Defaults to `true`.\n * @param {string|boolean} [props.attributes.templateLock]      Template lock applied to the inner blocks, one of `all`, `insert`, `contentOnly` or `false`.\n * @param {Function}       props.setAttributes                  Callback for updating block attributes.\n *\n * @return {React.JSX.Element} React element.\n */\nconst ColumnsEdit = ( props ) => {\n\tconst { clientId } = props;\n\tconst hasInnerBlocks = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getBlocks( clientId ).length > 0,\n\t\t[ clientId ]\n\t);\n\tconst Component = hasInnerBlocks ? ColumnsEditContainer : Placeholder;\n\n\treturn <Component { ...props } />;\n};\n\nexport default ColumnsEdit;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tToggleControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport {\n\tInspectorControls,\n\tuseInnerBlocksProps,\n\tBlockControls,\n\tBlockVerticalAlignmentToolbar,\n\t__experimentalBlockVariationPicker,\n\tuseBlockProps,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect, useRegistry } from '@wordpress/data';\nimport {\n\tcreateBlocksFromInnerBlocksTemplate,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\nconst DEFAULT_BLOCK = {\n\tname: 'core/column',\n};\n\nfunction ColumnInspectorControls( { setAttributes, isStackedOnMobile } ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Settings' ) }\n\t\t\tresetAll={ () => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tisStackedOnMobile: true,\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t<ToolsPanelItem\n\t\t\t\tlabel={ __( 'Stack on mobile' ) }\n\t\t\t\tisShownByDefault\n\t\t\t\thasValue={ () => isStackedOnMobile !== true }\n\t\t\t\tonDeselect={ () =>\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\tisStackedOnMobile: true,\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Stack on mobile' ) }\n\t\t\t\t\tchecked={ isStackedOnMobile }\n\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tisStackedOnMobile: ! isStackedOnMobile,\n\t\t\t\t\t\t} )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</ToolsPanel>\n\t);\n}\n\nfunction ColumnsEditContainer( { attributes, setAttributes, clientId } ) {\n\tconst { isStackedOnMobile, verticalAlignment, templateLock } = attributes;\n\tconst registry = useRegistry();\n\tconst { getBlockOrder } = useSelect( blockEditorStore );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst classes = clsx( {\n\t\t[ `are-vertically-aligned-${ verticalAlignment }` ]: verticalAlignment,\n\t\t[ `is-not-stacked-on-mobile` ]: ! isStackedOnMobile,\n\t} );\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classes,\n\t} );\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\tdefaultBlock: DEFAULT_BLOCK,\n\t\tdirectInsert: true,\n\t\torientation: 'horizontal',\n\t\trenderAppender: false,\n\t\ttemplateLock,\n\t} );\n\n\t/**\n\t * Update all child Column blocks with a new vertical alignment setting\n\t * based on whatever alignment is passed in. This allows change to parent\n\t * to override anything set on a individual column basis.\n\t *\n\t * @param {string} newVerticalAlignment The vertical alignment setting.\n\t */\n\tfunction updateAlignment( newVerticalAlignment ) {\n\t\tconst innerBlockClientIds = getBlockOrder( clientId );\n\n\t\t// Update own and child Column block vertical alignments.\n\t\t// This is a single action; the batching prevents creating multiple history records.\n\t\tregistry.batch( () => {\n\t\t\tsetAttributes( { verticalAlignment: newVerticalAlignment } );\n\t\t\tupdateBlockAttributes( innerBlockClientIds, {\n\t\t\t\tverticalAlignment: newVerticalAlignment,\n\t\t\t} );\n\t\t} );\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls>\n\t\t\t\t<BlockVerticalAlignmentToolbar\n\t\t\t\t\tonChange={ updateAlignment }\n\t\t\t\t\tvalue={ verticalAlignment }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t\t<InspectorControls>\n\t\t\t\t<ColumnInspectorControls\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\tisStackedOnMobile={ isStackedOnMobile }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t\t<div { ...innerBlocksProps } />\n\t\t</>\n\t);\n}\n\nfunction Placeholder( { clientId, name, setAttributes } ) {\n\tconst { blockType, variations } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockVariations, getBlockType } = select( blocksStore );\n\n\t\t\treturn {\n\t\t\t\tblockType: getBlockType( name ),\n\t\t\t\tvariations: getBlockVariations( name, 'block' ),\n\t\t\t};\n\t\t},\n\t\t[ name ]\n\t);\n\tconst { replaceInnerBlocks } = useDispatch( blockEditorStore );\n\tconst blockProps = useBlockProps();\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t<__experimentalBlockVariationPicker\n\t\t\t\ticon={ blockType?.icon?.src }\n\t\t\t\tlabel={ blockType?.title }\n\t\t\t\tvariations={ variations }\n\t\t\t\tinstructions={ __( 'Divide into columns. Select a layout:' ) }\n\t\t\t\tonSelect={ ( nextVariation ) => {\n\t\t\t\t\tif ( nextVariation.attributes ) {\n\t\t\t\t\t\tsetAttributes( nextVariation.attributes );\n\t\t\t\t\t}\n\t\t\t\t\tif ( nextVariation.innerBlocks ) {\n\t\t\t\t\t\treplaceInnerBlocks(\n\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\tcreateBlocksFromInnerBlocksTemplate(\n\t\t\t\t\t\t\t\tnextVariation.innerBlocks\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\n/**\n * Renders the `core/columns` block in the editor.\n *\n * Until the block has inner blocks it renders a variation picker; afterwards it\n * renders the columns container. Every prop is forwarded to whichever of the two\n * is rendered.\n *\n * @param {Object}         props                                Component props.\n * @param {string}         props.clientId                       Client ID of the block.\n * @param {string}         props.name                           Block name, used to look up the variations offered by the picker.\n * @param {Object}         props.attributes                     Block attributes.\n * @param {string}         [props.attributes.verticalAlignment] Vertical alignment applied to the block and to every child Column block.\n * @param {boolean}        [props.attributes.isStackedOnMobile] Whether the columns stack on small viewports. Defaults to `true`.\n * @param {string|boolean} [props.attributes.templateLock]      Template lock applied to the inner blocks, one of `all`, `insert`, `contentOnly` or `false`.\n * @param {Function}       props.setAttributes                  Callback for updating block attributes.\n *\n * @return {React.JSX.Element} React element.\n */\nconst ColumnsEdit = ( props ) => {\n\tconst { clientId } = props;\n\tconst hasInnerBlocks = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getBlocks( clientId ).length > 0,\n\t\t[ clientId ]\n\t);\n\tconst Component = hasInnerBlocks ? ColumnsEditContainer : Placeholder;\n\n\treturn <Component { ...props } />;\n};\n\nexport default ColumnsEdit;\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/comment-author-name/block.json

@@ -21,6 +21,9 @@
 	"supports": {
 		"anchor": true,
 		"html": false,
+		"background": {
+			"gradient": true
+		},
 		"spacing": {
 			"margin": true,
 			"padding": true

package/build-module/comment-content/block.json

@@ -10,8 +10,13 @@
 	"usesContext": [ "commentId" ],
 	"supports": {
 		"anchor": true,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
+			"heading": true,
+			"button": true,
 			"link": true,
 			"__experimentalDefaultControls": {
 				"background": true,

package/build-module/comment-date/block.json

@@ -20,6 +20,9 @@
 	"supports": {
 		"anchor": true,
 		"html": false,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
 			"link": true,

package/build-module/comment-edit-link/block.json

@@ -17,6 +17,9 @@
 	"supports": {
 		"anchor": true,
 		"html": false,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"link": true,
 			"gradients": true,

package/build-module/comment-reply-link/block.json

@@ -10,6 +10,9 @@
 	"usesContext": [ "commentId" ],
 	"supports": {
 		"anchor": true,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
 			"link": true,

package/build-module/comments/block.json

@@ -20,8 +20,18 @@
 		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true,
+			"__experimentalDefaultControls": {
+				"backgroundImage": true,
+				"gradient": true
+			}
+		},
 		"color": {
 			"gradients": true,
+			"button": true,
 			"heading": true,
 			"link": true,
 			"__experimentalDefaultControls": {

package/build-module/comments/edit/placeholder.mjs

@@ -4,6 +4,7 @@ import { __, _x, sprintf } from "@wordpress/i18n";
 import { useSelect } from "@wordpress/data";
 import { useEntityProp } from "@wordpress/core-data";
 import { createInterpolateElement } from "@wordpress/element";
+import { inertValue } from "@wordpress/react-inert-value";
 import CommentsForm from "../../post-comments-form/form.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 function PostCommentsPlaceholder({ postType, postId }) {
@@ -13,99 +14,106 @@ function PostCommentsPlaceholder({ postType, postId }) {
     (select) => select(blockEditorStore).getSettings().__experimentalDiscussionSettings?.avatarURL,
     []
   );
-  return /* @__PURE__ */ jsxs("div", { className: "wp-block-comments__legacy-placeholder", inert: "true", children: [
-    /* @__PURE__ */ jsx("h3", {
-      /* translators: %s: Post title. */
-      children: sprintf(__("One response to %s"), postTitle)
-    }),
-    /* @__PURE__ */ jsxs("div", { className: "navigation", children: [
-      /* @__PURE__ */ jsx("div", { className: "alignleft", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
-        "« ",
-        __("Older Comments")
-      ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "alignright", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
-        __("Newer Comments"),
-        " »"
-      ] }) })
-    ] }),
-    /* @__PURE__ */ jsx("ol", { className: "commentlist", children: /* @__PURE__ */ jsx("li", { className: "comment even thread-even depth-1", children: /* @__PURE__ */ jsxs("article", { className: "comment-body", children: [
-      /* @__PURE__ */ jsxs("footer", { className: "comment-meta", children: [
-        /* @__PURE__ */ jsxs("div", { className: "comment-author vcard", children: [
-          /* @__PURE__ */ jsx(
-            "img",
-            {
-              alt: __("Commenter Avatar"),
-              src: avatarURL,
-              className: "avatar avatar-32 photo",
-              height: "32",
-              width: "32",
-              loading: "lazy"
-            }
-          ),
-          /* @__PURE__ */ jsx("b", { className: "fn", children: /* @__PURE__ */ jsx("a", { href: "#top", className: "url", children: __("A WordPress Commenter") }) }),
-          " ",
-          /* @__PURE__ */ jsxs("span", { className: "says", children: [
-            __("says"),
-            ":"
-          ] })
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "wp-block-comments__legacy-placeholder",
+      inert: inertValue(true),
+      children: [
+        /* @__PURE__ */ jsx("h3", {
+          /* translators: %s: Post title. */
+          children: sprintf(__("One response to %s"), postTitle)
+        }),
+        /* @__PURE__ */ jsxs("div", { className: "navigation", children: [
+          /* @__PURE__ */ jsx("div", { className: "alignleft", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
+            "« ",
+            __("Older Comments")
+          ] }) }),
+          /* @__PURE__ */ jsx("div", { className: "alignright", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
+            __("Newer Comments"),
+            " »"
+          ] }) })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "comment-metadata", children: [
-          /* @__PURE__ */ jsx("a", { href: "#top", children: /* @__PURE__ */ jsx("time", { dateTime: "2000-01-01T00:00:00+00:00", children: __("January 1, 2000 at 00:00 am") }) }),
-          " ",
-          /* @__PURE__ */ jsx("span", { className: "edit-link", children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("ol", { className: "commentlist", children: /* @__PURE__ */ jsx("li", { className: "comment even thread-even depth-1", children: /* @__PURE__ */ jsxs("article", { className: "comment-body", children: [
+          /* @__PURE__ */ jsxs("footer", { className: "comment-meta", children: [
+            /* @__PURE__ */ jsxs("div", { className: "comment-author vcard", children: [
+              /* @__PURE__ */ jsx(
+                "img",
+                {
+                  alt: __("Commenter Avatar"),
+                  src: avatarURL,
+                  className: "avatar avatar-32 photo",
+                  height: "32",
+                  width: "32",
+                  loading: "lazy"
+                }
+              ),
+              /* @__PURE__ */ jsx("b", { className: "fn", children: /* @__PURE__ */ jsx("a", { href: "#top", className: "url", children: __("A WordPress Commenter") }) }),
+              " ",
+              /* @__PURE__ */ jsxs("span", { className: "says", children: [
+                __("says"),
+                ":"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "comment-metadata", children: [
+              /* @__PURE__ */ jsx("a", { href: "#top", children: /* @__PURE__ */ jsx("time", { dateTime: "2000-01-01T00:00:00+00:00", children: __("January 1, 2000 at 00:00 am") }) }),
+              " ",
+              /* @__PURE__ */ jsx("span", { className: "edit-link", children: /* @__PURE__ */ jsx(
+                "a",
+                {
+                  className: "comment-edit-link",
+                  href: "#top",
+                  children: __("Edit")
+                }
+              ) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "comment-content", children: /* @__PURE__ */ jsxs("p", { children: [
+            __("Hi, this is a comment."),
+            /* @__PURE__ */ jsx("br", {}),
+            __(
+              "To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard."
+            ),
+            /* @__PURE__ */ jsx("br", {}),
+            createInterpolateElement(
+              __(
+                "Commenter avatars come from <a>Gravatar</a>."
+              ),
+              {
+                a: (
+                  // eslint-disable-next-line jsx-a11y/anchor-has-content
+                  /* @__PURE__ */ jsx("a", { href: "https://gravatar.com/" })
+                )
+              }
+            )
+          ] }) }),
+          /* @__PURE__ */ jsx("div", { className: "reply", children: /* @__PURE__ */ jsx(
             "a",
             {
-              className: "comment-edit-link",
+              className: "comment-reply-link",
               href: "#top",
-              children: __("Edit")
+              "aria-label": __(
+                "Reply to A WordPress Commenter"
+              ),
+              /* translators: Comment reply button text. */
+              children: _x("Reply", "verb")
             }
           ) })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: "comment-content", children: /* @__PURE__ */ jsxs("p", { children: [
-        __("Hi, this is a comment."),
-        /* @__PURE__ */ jsx("br", {}),
-        __(
-          "To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard."
-        ),
-        /* @__PURE__ */ jsx("br", {}),
-        createInterpolateElement(
-          __(
-            "Commenter avatars come from <a>Gravatar</a>."
-          ),
-          {
-            a: (
-              // eslint-disable-next-line jsx-a11y/anchor-has-content
-              /* @__PURE__ */ jsx("a", { href: "https://gravatar.com/" })
-            )
-          }
-        )
-      ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "reply", children: /* @__PURE__ */ jsx(
-        "a",
-        {
-          className: "comment-reply-link",
-          href: "#top",
-          "aria-label": __(
-            "Reply to A WordPress Commenter"
-          ),
-          /* translators: Comment reply button text. */
-          children: _x("Reply", "verb")
-        }
-      ) })
-    ] }) }) }),
-    /* @__PURE__ */ jsxs("div", { className: "navigation", children: [
-      /* @__PURE__ */ jsx("div", { className: "alignleft", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
-        "« ",
-        __("Older Comments")
-      ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "alignright", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
-        __("Newer Comments"),
-        " »"
-      ] }) })
-    ] }),
-    /* @__PURE__ */ jsx(CommentsForm, { postId, postType })
-  ] });
+        ] }) }) }),
+        /* @__PURE__ */ jsxs("div", { className: "navigation", children: [
+          /* @__PURE__ */ jsx("div", { className: "alignleft", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
+            "« ",
+            __("Older Comments")
+          ] }) }),
+          /* @__PURE__ */ jsx("div", { className: "alignright", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
+            __("Newer Comments"),
+            " »"
+          ] }) })
+        ] }),
+        /* @__PURE__ */ jsx(CommentsForm, { postId, postType })
+      ]
+    }
+  );
 }
 export {
   PostCommentsPlaceholder as default

package/build-module/comments/edit/placeholder.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/comments/edit/placeholder.jsx"],
-  "sourcesContent": ["import { store as blockEditorStore } from '@wordpress/block-editor';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { useEntityProp } from '@wordpress/core-data';\nimport { createInterpolateElement } from '@wordpress/element';\nimport CommentsForm from '../../post-comments-form/form';\n\nexport default function PostCommentsPlaceholder( { postType, postId } ) {\n\tlet [ postTitle ] = useEntityProp( 'postType', postType, 'title', postId );\n\tpostTitle = postTitle || __( 'Post Title' );\n\n\tconst avatarURL = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings()\n\t\t\t\t.__experimentalDiscussionSettings?.avatarURL,\n\t\t[]\n\t);\n\n\treturn (\n\t\t<div className=\"wp-block-comments__legacy-placeholder\" inert=\"true\">\n\t\t\t<h3>\n\t\t\t\t{\n\t\t\t\t\t/* translators: %s: Post title. */\n\t\t\t\t\tsprintf( __( 'One response to %s' ), postTitle )\n\t\t\t\t}\n\t\t\t</h3>\n\n\t\t\t<div className=\"navigation\">\n\t\t\t\t<div className=\"alignleft\">\n\t\t\t\t\t<a href=\"#top\">« { __( 'Older Comments' ) }</a>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"alignright\">\n\t\t\t\t\t<a href=\"#top\">{ __( 'Newer Comments' ) } »</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<ol className=\"commentlist\">\n\t\t\t\t<li className=\"comment even thread-even depth-1\">\n\t\t\t\t\t<article className=\"comment-body\">\n\t\t\t\t\t\t<footer className=\"comment-meta\">\n\t\t\t\t\t\t\t<div className=\"comment-author vcard\">\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\talt={ __( 'Commenter Avatar' ) }\n\t\t\t\t\t\t\t\t\tsrc={ avatarURL }\n\t\t\t\t\t\t\t\t\tclassName=\"avatar avatar-32 photo\"\n\t\t\t\t\t\t\t\t\theight=\"32\"\n\t\t\t\t\t\t\t\t\twidth=\"32\"\n\t\t\t\t\t\t\t\t\tloading=\"lazy\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<b className=\"fn\">\n\t\t\t\t\t\t\t\t\t<a href=\"#top\" className=\"url\">\n\t\t\t\t\t\t\t\t\t\t{ __( 'A WordPress Commenter' ) }\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</b>{ ' ' }\n\t\t\t\t\t\t\t\t<span className=\"says\">{ __( 'says' ) }:</span>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<div className=\"comment-metadata\">\n\t\t\t\t\t\t\t\t<a href=\"#top\">\n\t\t\t\t\t\t\t\t\t<time dateTime=\"2000-01-01T00:00:00+00:00\">\n\t\t\t\t\t\t\t\t\t\t{ __( 'January 1, 2000 at 00:00 am' ) }\n\t\t\t\t\t\t\t\t\t</time>\n\t\t\t\t\t\t\t\t</a>{ ' ' }\n\t\t\t\t\t\t\t\t<span className=\"edit-link\">\n\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\tclassName=\"comment-edit-link\"\n\t\t\t\t\t\t\t\t\t\thref=\"#top\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</footer>\n\n\t\t\t\t\t\t<div className=\"comment-content\">\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t{ __( 'Hi, this is a comment.' ) }\n\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard.'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t'Commenter avatars come from <a>Gravatar</a>.'\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\ta: (\n\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/anchor-has-content\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"https://gravatar.com/\" />\n\t\t\t\t\t\t\t\t\t\t),\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</p>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className=\"reply\">\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\tclassName=\"comment-reply-link\"\n\t\t\t\t\t\t\t\thref=\"#top\"\n\t\t\t\t\t\t\t\taria-label={ __(\n\t\t\t\t\t\t\t\t\t'Reply to A WordPress Commenter'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t/* translators: Comment reply button text. */\n\t\t\t\t\t\t\t\t\t_x( 'Reply', 'verb' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</article>\n\t\t\t\t</li>\n\t\t\t</ol>\n\n\t\t\t<div className=\"navigation\">\n\t\t\t\t<div className=\"alignleft\">\n\t\t\t\t\t<a href=\"#top\">« { __( 'Older Comments' ) }</a>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"alignright\">\n\t\t\t\t\t<a href=\"#top\">{ __( 'Newer Comments' ) } »</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<CommentsForm postId={ postId } postType={ postType } />\n\t\t</div>\n\t);\n}\n"],
-  "mappings": ";AAAA,SAAS,SAAS,wBAAwB;AAC1C,SAAS,IAAI,IAAI,eAAe;AAChC,SAAS,iBAAiB;AAC1B,SAAS,qBAAqB;AAC9B,SAAS,gCAAgC;AACzC,OAAO,kBAAkB;AAetB,cASE,YATF;AAbY,SAAR,wBAA0C,EAAE,UAAU,OAAO,GAAI;AACvE,MAAI,CAAE,SAAU,IAAI,cAAe,YAAY,UAAU,SAAS,MAAO;AACzE,cAAY,aAAa,GAAI,YAAa;AAE1C,QAAM,YAAY;AAAA,IACjB,CAAE,WACD,OAAQ,gBAAiB,EAAE,YAAY,EACrC,kCAAkC;AAAA,IACrC,CAAC;AAAA,EACF;AAEA,SACC,qBAAC,SAAI,WAAU,yCAAwC,OAAM,QAC5D;AAAA,wBAAC;AAAA;AAAA,MAGC,kBAAS,GAAI,oBAAqB,GAAG,SAAU;AAAA,KAEjD;AAAA,IAEA,qBAAC,SAAI,WAAU,cACd;AAAA,0BAAC,SAAI,WAAU,aACd,+BAAC,OAAE,MAAK,QAAO;AAAA;AAAA,QAAI,GAAI,gBAAiB;AAAA,SAAG,GAC5C;AAAA,MACA,oBAAC,SAAI,WAAU,cACd,+BAAC,OAAE,MAAK,QAAS;AAAA,WAAI,gBAAiB;AAAA,QAAG;AAAA,SAAE,GAC5C;AAAA,OACD;AAAA,IAEA,oBAAC,QAAG,WAAU,eACb,8BAAC,QAAG,WAAU,oCACb,+BAAC,aAAQ,WAAU,gBAClB;AAAA,2BAAC,YAAO,WAAU,gBACjB;AAAA,6BAAC,SAAI,WAAU,wBACd;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,KAAM,GAAI,kBAAmB;AAAA,cAC7B,KAAM;AAAA,cACN,WAAU;AAAA,cACV,QAAO;AAAA,cACP,OAAM;AAAA,cACN,SAAQ;AAAA;AAAA,UACT;AAAA,UACA,oBAAC,OAAE,WAAU,MACZ,8BAAC,OAAE,MAAK,QAAO,WAAU,OACtB,aAAI,uBAAwB,GAC/B,GACD;AAAA,UAAM;AAAA,UACN,qBAAC,UAAK,WAAU,QAAS;AAAA,eAAI,MAAO;AAAA,YAAG;AAAA,aAAC;AAAA,WACzC;AAAA,QAEA,qBAAC,SAAI,WAAU,oBACd;AAAA,8BAAC,OAAE,MAAK,QACP,8BAAC,UAAK,UAAS,6BACZ,aAAI,6BAA8B,GACrC,GACD;AAAA,UAAM;AAAA,UACN,oBAAC,UAAK,WAAU,aACf;AAAA,YAAC;AAAA;AAAA,cACA,WAAU;AAAA,cACV,MAAK;AAAA,cAEH,aAAI,MAAO;AAAA;AAAA,UACd,GACD;AAAA,WACD;AAAA,SACD;AAAA,MAEA,oBAAC,SAAI,WAAU,mBACd,+BAAC,OACE;AAAA,WAAI,wBAAyB;AAAA,QAC/B,oBAAC,QAAG;AAAA,QACF;AAAA,UACD;AAAA,QACD;AAAA,QACA,oBAAC,QAAG;AAAA,QACF;AAAA,UACD;AAAA,YACC;AAAA,UACD;AAAA,UACA;AAAA,YACC;AAAA;AAAA,cAEC,oBAAC,OAAE,MAAK,yBAAwB;AAAA;AAAA,UAElC;AAAA,QACD;AAAA,SACD,GACD;AAAA,MAEA,oBAAC,SAAI,WAAU,SACd;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,MAAK;AAAA,UACL,cAAa;AAAA,YACZ;AAAA,UACD;AAAA;AAAA,UAIC,aAAI,SAAS,MAAO;AAAA;AAAA,MAEtB,GACD;AAAA,OACD,GACD,GACD;AAAA,IAEA,qBAAC,SAAI,WAAU,cACd;AAAA,0BAAC,SAAI,WAAU,aACd,+BAAC,OAAE,MAAK,QAAO;AAAA;AAAA,QAAI,GAAI,gBAAiB;AAAA,SAAG,GAC5C;AAAA,MACA,oBAAC,SAAI,WAAU,cACd,+BAAC,OAAE,MAAK,QAAS;AAAA,WAAI,gBAAiB;AAAA,QAAG;AAAA,SAAE,GAC5C;AAAA,OACD;AAAA,IAEA,oBAAC,gBAAa,QAAkB,UAAsB;AAAA,KACvD;AAEF;",
+  "sourcesContent": ["import { store as blockEditorStore } from '@wordpress/block-editor';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { useEntityProp } from '@wordpress/core-data';\nimport { createInterpolateElement } from '@wordpress/element';\nimport { inertValue } from '@wordpress/react-inert-value';\nimport CommentsForm from '../../post-comments-form/form';\n\nexport default function PostCommentsPlaceholder( { postType, postId } ) {\n\tlet [ postTitle ] = useEntityProp( 'postType', postType, 'title', postId );\n\tpostTitle = postTitle || __( 'Post Title' );\n\n\tconst avatarURL = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings()\n\t\t\t\t.__experimentalDiscussionSettings?.avatarURL,\n\t\t[]\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"wp-block-comments__legacy-placeholder\"\n\t\t\tinert={ inertValue( true ) }\n\t\t>\n\t\t\t<h3>\n\t\t\t\t{\n\t\t\t\t\t/* translators: %s: Post title. */\n\t\t\t\t\tsprintf( __( 'One response to %s' ), postTitle )\n\t\t\t\t}\n\t\t\t</h3>\n\n\t\t\t<div className=\"navigation\">\n\t\t\t\t<div className=\"alignleft\">\n\t\t\t\t\t<a href=\"#top\">« { __( 'Older Comments' ) }</a>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"alignright\">\n\t\t\t\t\t<a href=\"#top\">{ __( 'Newer Comments' ) } »</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<ol className=\"commentlist\">\n\t\t\t\t<li className=\"comment even thread-even depth-1\">\n\t\t\t\t\t<article className=\"comment-body\">\n\t\t\t\t\t\t<footer className=\"comment-meta\">\n\t\t\t\t\t\t\t<div className=\"comment-author vcard\">\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\talt={ __( 'Commenter Avatar' ) }\n\t\t\t\t\t\t\t\t\tsrc={ avatarURL }\n\t\t\t\t\t\t\t\t\tclassName=\"avatar avatar-32 photo\"\n\t\t\t\t\t\t\t\t\theight=\"32\"\n\t\t\t\t\t\t\t\t\twidth=\"32\"\n\t\t\t\t\t\t\t\t\tloading=\"lazy\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<b className=\"fn\">\n\t\t\t\t\t\t\t\t\t<a href=\"#top\" className=\"url\">\n\t\t\t\t\t\t\t\t\t\t{ __( 'A WordPress Commenter' ) }\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</b>{ ' ' }\n\t\t\t\t\t\t\t\t<span className=\"says\">{ __( 'says' ) }:</span>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<div className=\"comment-metadata\">\n\t\t\t\t\t\t\t\t<a href=\"#top\">\n\t\t\t\t\t\t\t\t\t<time dateTime=\"2000-01-01T00:00:00+00:00\">\n\t\t\t\t\t\t\t\t\t\t{ __( 'January 1, 2000 at 00:00 am' ) }\n\t\t\t\t\t\t\t\t\t</time>\n\t\t\t\t\t\t\t\t</a>{ ' ' }\n\t\t\t\t\t\t\t\t<span className=\"edit-link\">\n\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\tclassName=\"comment-edit-link\"\n\t\t\t\t\t\t\t\t\t\thref=\"#top\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</footer>\n\n\t\t\t\t\t\t<div className=\"comment-content\">\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t{ __( 'Hi, this is a comment.' ) }\n\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard.'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t'Commenter avatars come from <a>Gravatar</a>.'\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\ta: (\n\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/anchor-has-content\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"https://gravatar.com/\" />\n\t\t\t\t\t\t\t\t\t\t),\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</p>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className=\"reply\">\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\tclassName=\"comment-reply-link\"\n\t\t\t\t\t\t\t\thref=\"#top\"\n\t\t\t\t\t\t\t\taria-label={ __(\n\t\t\t\t\t\t\t\t\t'Reply to A WordPress Commenter'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t/* translators: Comment reply button text. */\n\t\t\t\t\t\t\t\t\t_x( 'Reply', 'verb' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</article>\n\t\t\t\t</li>\n\t\t\t</ol>\n\n\t\t\t<div className=\"navigation\">\n\t\t\t\t<div className=\"alignleft\">\n\t\t\t\t\t<a href=\"#top\">« { __( 'Older Comments' ) }</a>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"alignright\">\n\t\t\t\t\t<a href=\"#top\">{ __( 'Newer Comments' ) } »</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<CommentsForm postId={ postId } postType={ postType } />\n\t\t</div>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/comments-pagination/block.json

@@ -31,6 +31,9 @@
 		"align": true,
 		"reusable": false,
 		"html": false,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
 			"link": true,
@@ -47,6 +50,11 @@
 				"type": "flex"
 			}
 		},
+		"spacing": {
+			"padding": true,
+			"margin": true,
+			"blockGap": true
+		},
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,
@@ -60,6 +68,12 @@
 				"fontSize": true
 			}
 		},
+		"__experimentalBorder": {
+			"color": true,
+			"radius": true,
+			"style": true,
+			"width": true
+		},
 		"interactivity": {
 			"clientNavigation": true
 		}

package/build-module/comments-pagination-next/block.json

@@ -17,6 +17,9 @@
 		"anchor": true,
 		"reusable": false,
 		"html": false,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
 			"text": false,

package/build-module/comments-pagination-numbers/block.json

@@ -12,6 +12,9 @@
 		"anchor": true,
 		"reusable": false,
 		"html": false,
+		"background": {
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
 			"text": false,