@wordpress/block-editor 7.0.1-next.5df0cd52b7.0 → 7.0.4

package/build-module/layouts/flex.js

@@ -4,27 +4,72 @@ import { createElement } from "@wordpress/element";
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
+import { justifyLeft, justifyCenter, justifyRight, justifySpaceBetween } from '@wordpress/icons';
+import { Button } from '@wordpress/components';
 /**
  * Internal dependencies
  */
 
 import { appendSelectors } from './utils';
+import useSetting from '../components/use-setting';
+import { BlockControls, JustifyContentControl } from '../components';
+const justifyContentMap = {
+  left: 'flex-start',
+  right: 'flex-end',
+  center: 'center',
+  'space-between': 'space-between'
+};
 export default {
   name: 'flex',
   label: __('Flex'),
-
-  edit() {
-    return null;
+  inspectorControls: function FlexLayoutInspectorControls({
+    layout = {},
+    onChange
+  }) {
+    return createElement(FlexLayoutJustifyContentControl, {
+      layout: layout,
+      onChange: onChange
+    });
   },
+  toolBarControls: function FlexLayoutToolbarControls({
+    layout = {},
+    onChange,
+    layoutBlockSupport
+  }) {
+    if (layoutBlockSupport !== null && layoutBlockSupport !== void 0 && layoutBlockSupport.allowSwitching) {
+      return null;
+    }
 
+    return createElement(BlockControls, {
+      group: "block",
+      __experimentalShareWithChildBlocks: true
+    }, createElement(FlexLayoutJustifyContentControl, {
+      layout: layout,
+      onChange: onChange,
+      isToolbar: true
+    }));
+  },
   save: function FlexLayoutStyle({
-    selector
+    selector,
+    layout
   }) {
-    return createElement("style", null, `${appendSelectors(selector)} {
-            display: flex;
-            column-gap: 0.5em;
-            align-items: center;
-        }`);
+    const blockGapSupport = useSetting('spacing.blockGap');
+    const hasBlockGapStylesSupport = blockGapSupport !== null;
+    const justifyContent = justifyContentMap[layout.justifyContent] || 'flex-start';
+    return createElement("style", null, `
+				${appendSelectors(selector)} {
+					display: flex;
+					gap: ${hasBlockGapStylesSupport ? 'var( --wp--style--block-gap, 0.5em )' : '0.5em'};
+					flex-wrap: wrap;
+					align-items: center;
+					flex-direction: row;
+					justify-content: ${justifyContent};
+				}
+
+				${appendSelectors(selector, '> *')} {
+					margin: 0;
+				}
+			`);
   },
 
   getOrientation() {
@@ -36,4 +81,65 @@ export default {
   }
 
 };
+const justificationOptions = [{
+  value: 'left',
+  icon: justifyLeft,
+  label: __('Justify items left')
+}, {
+  value: 'center',
+  icon: justifyCenter,
+  label: __('Justify items center')
+}, {
+  value: 'right',
+  icon: justifyRight,
+  label: __('Justify items right')
+}, {
+  value: 'space-between',
+  icon: justifySpaceBetween,
+  label: __('Space between items')
+}];
+
+function FlexLayoutJustifyContentControl({
+  layout,
+  onChange,
+  isToolbar = false
+}) {
+  const {
+    justifyContent = 'left'
+  } = layout;
+
+  const onJustificationChange = value => {
+    onChange({ ...layout,
+      justifyContent: value
+    });
+  };
+
+  if (isToolbar) {
+    return createElement(JustifyContentControl, {
+      allowedControls: ['left', 'center', 'right', 'space-between'],
+      value: justifyContent,
+      onChange: onJustificationChange,
+      popoverProps: {
+        position: 'bottom right',
+        isAlternate: true
+      }
+    });
+  }
+
+  return createElement("fieldset", {
+    className: "block-editor-hooks__flex-layout-justification-controls"
+  }, createElement("legend", null, __('Justification')), createElement("div", null, justificationOptions.map(({
+    value,
+    icon,
+    label
+  }) => {
+    return createElement(Button, {
+      key: value,
+      label: label,
+      icon: icon,
+      isPressed: justifyContent === value,
+      onClick: () => onJustificationChange(value)
+    });
+  })));
+}
 //# sourceMappingURL=flex.js.map

package/build-module/layouts/flex.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/layouts/flex.js"],"names":["__","appendSelectors","name","label","edit","save","FlexLayoutStyle","selector","getOrientation","getAlignments"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,eAAT,QAAgC,SAAhC;AAEA,eAAe;AACdC,EAAAA,IAAI,EAAE,MADQ;AAGdC,EAAAA,KAAK,EAAEH,EAAE,CAAE,MAAF,CAHK;;AAKdI,EAAAA,IAAI,GAAG;AACN,WAAO,IAAP;AACA,GAPa;;AASdC,EAAAA,IAAI,EAAE,SAASC,eAAT,CAA0B;AAAEC,IAAAA;AAAF,GAA1B,EAAyC;AAC9C,WACC,6BAAU,GAAGN,eAAe,CAAEM,QAAF,CAAc;AAC7C;AACA;AACA;AACA,UAJG,CADD;AAOA,GAjBa;;AAmBdC,EAAAA,cAAc,GAAG;AAChB,WAAO,YAAP;AACA,GArBa;;AAuBdC,EAAAA,aAAa,GAAG;AACf,WAAO,EAAP;AACA;;AAzBa,CAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { appendSelectors } from './utils';\n\nexport default {\n\tname: 'flex',\n\n\tlabel: __( 'Flex' ),\n\n\tedit() {\n\t\treturn null;\n\t},\n\n\tsave: function FlexLayoutStyle( { selector } ) {\n\t\treturn (\n\t\t\t<style>{ `${ appendSelectors( selector ) } {\n            display: flex;\n            column-gap: 0.5em;\n            align-items: center;\n        }` }</style>\n\t\t);\n\t},\n\n\tgetOrientation() {\n\t\treturn 'horizontal';\n\t},\n\n\tgetAlignments() {\n\t\treturn [];\n\t},\n};\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/layouts/flex.js"],"names":["__","justifyLeft","justifyCenter","justifyRight","justifySpaceBetween","Button","appendSelectors","useSetting","BlockControls","JustifyContentControl","justifyContentMap","left","right","center","name","label","inspectorControls","FlexLayoutInspectorControls","layout","onChange","toolBarControls","FlexLayoutToolbarControls","layoutBlockSupport","allowSwitching","save","FlexLayoutStyle","selector","blockGapSupport","hasBlockGapStylesSupport","justifyContent","getOrientation","getAlignments","justificationOptions","value","icon","FlexLayoutJustifyContentControl","isToolbar","onJustificationChange","position","isAlternate","map"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tjustifyLeft,\n\tjustifyCenter,\n\tjustifyRight,\n\tjustifySpaceBetween,\n} from '@wordpress/icons';\nimport { Button } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { appendSelectors } from './utils';\nimport useSetting from '../components/use-setting';\nimport { BlockControls, JustifyContentControl } from '../components';\n\nconst justifyContentMap = {\n\tleft: 'flex-start',\n\tright: 'flex-end',\n\tcenter: 'center',\n\t'space-between': 'space-between',\n};\n\nexport default {\n\tname: 'flex',\n\tlabel: __( 'Flex' ),\n\tinspectorControls: function FlexLayoutInspectorControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t} ) {\n\t\treturn (\n\t\t\t<FlexLayoutJustifyContentControl\n\t\t\t\tlayout={ layout }\n\t\t\t\tonChange={ onChange }\n\t\t\t/>\n\t\t);\n\t},\n\ttoolBarControls: function FlexLayoutToolbarControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t\tlayoutBlockSupport,\n\t} ) {\n\t\tif ( layoutBlockSupport?.allowSwitching ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<BlockControls group=\"block\" __experimentalShareWithChildBlocks>\n\t\t\t\t<FlexLayoutJustifyContentControl\n\t\t\t\t\tlayout={ layout }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tisToolbar\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t);\n\t},\n\tsave: function FlexLayoutStyle( { selector, layout } ) {\n\t\tconst blockGapSupport = useSetting( 'spacing.blockGap' );\n\t\tconst hasBlockGapStylesSupport = blockGapSupport !== null;\n\t\tconst justifyContent =\n\t\t\tjustifyContentMap[ layout.justifyContent ] || 'flex-start';\n\t\treturn (\n\t\t\t<style>{ `\n\t\t\t\t${ appendSelectors( selector ) } {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\tgap: ${\n\t\t\t\t\t\thasBlockGapStylesSupport\n\t\t\t\t\t\t\t? 'var( --wp--style--block-gap, 0.5em )'\n\t\t\t\t\t\t\t: '0.5em'\n\t\t\t\t\t};\n\t\t\t\t\tflex-wrap: wrap;\n\t\t\t\t\talign-items: center;\n\t\t\t\t\tflex-direction: row;\n\t\t\t\t\tjustify-content: ${ justifyContent };\n\t\t\t\t}\n\n\t\t\t\t${ appendSelectors( selector, '> *' ) } {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t}\n\t\t\t` }</style>\n\t\t);\n\t},\n\tgetOrientation() {\n\t\treturn 'horizontal';\n\t},\n\tgetAlignments() {\n\t\treturn [];\n\t},\n};\n\nconst justificationOptions = [\n\t{\n\t\tvalue: 'left',\n\t\ticon: justifyLeft,\n\t\tlabel: __( 'Justify items left' ),\n\t},\n\t{\n\t\tvalue: 'center',\n\t\ticon: justifyCenter,\n\t\tlabel: __( 'Justify items center' ),\n\t},\n\t{\n\t\tvalue: 'right',\n\t\ticon: justifyRight,\n\t\tlabel: __( 'Justify items right' ),\n\t},\n\t{\n\t\tvalue: 'space-between',\n\t\ticon: justifySpaceBetween,\n\t\tlabel: __( 'Space between items' ),\n\t},\n];\nfunction FlexLayoutJustifyContentControl( {\n\tlayout,\n\tonChange,\n\tisToolbar = false,\n} ) {\n\tconst { justifyContent = 'left' } = layout;\n\tconst onJustificationChange = ( value ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tjustifyContent: value,\n\t\t} );\n\t};\n\tif ( isToolbar ) {\n\t\treturn (\n\t\t\t<JustifyContentControl\n\t\t\t\tallowedControls={ [\n\t\t\t\t\t'left',\n\t\t\t\t\t'center',\n\t\t\t\t\t'right',\n\t\t\t\t\t'space-between',\n\t\t\t\t] }\n\t\t\t\tvalue={ justifyContent }\n\t\t\t\tonChange={ onJustificationChange }\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tposition: 'bottom right',\n\t\t\t\t\tisAlternate: true,\n\t\t\t\t} }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__flex-layout-justification-controls\">\n\t\t\t<legend>{ __( 'Justification' ) }</legend>\n\t\t\t<div>\n\t\t\t\t{ justificationOptions.map( ( { value, icon, label } ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\tisPressed={ justifyContent === value }\n\t\t\t\t\t\t\tonClick={ () => onJustificationChange( value ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</div>\n\t\t</fieldset>\n\t);\n}\n"]}

package/build-module/layouts/flow.js

@@ -4,7 +4,7 @@ import { createElement, Fragment } from "@wordpress/element";
  * WordPress dependencies
  */
 import { Button, __experimentalUseCustomUnits as useCustomUnits, __experimentalUnitControl as UnitControl } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { Icon, positionCenter, stretchWide } from '@wordpress/icons';
 /**
  * Internal dependencies
@@ -15,7 +15,7 @@ import { appendSelectors } from './utils';
 export default {
   name: 'default',
   label: __('Flow'),
-  edit: function LayoutDefaultEdit({
+  inspectorControls: function DefaultLayoutInspectorControls({
     layout,
     onChange
   }) {
@@ -75,6 +75,9 @@ export default {
       className: "block-editor-hooks__layout-controls-helptext"
     }, __('Customize the width for all elements that are assigned to the center or wide columns.')));
   },
+  toolBarControls: function DefaultLayoutToolbarControls() {
+    return null;
+  },
   save: function DefaultLayoutStyle({
     selector,
     layout = {}
@@ -83,17 +86,19 @@ export default {
       contentSize,
       wideSize
     } = layout;
+    const blockGapSupport = useSetting('spacing.blockGap');
+    const hasBlockGapStylesSupport = blockGapSupport !== null;
     let style = !!contentSize || !!wideSize ? `
 					${appendSelectors(selector, '> *')} {
 						max-width: ${contentSize !== null && contentSize !== void 0 ? contentSize : wideSize};
 						margin-left: auto !important;
 						margin-right: auto !important;
 					}
-	
+
 					${appendSelectors(selector, '> [data-align="wide"]')}  {
 						max-width: ${wideSize !== null && wideSize !== void 0 ? wideSize : contentSize};
 					}
-	
+
 					${appendSelectors(selector, '> [data-align="full"]')} {
 						max-width: none;
 					}
@@ -103,12 +108,26 @@ export default {
 				float: left;
 				margin-right: 2em;
 			}
-	
+
 			${appendSelectors(selector, '> [data-align="right"]')} {
 				float: right;
 				margin-left: 2em;
 			}
+
 		`;
+
+    if (hasBlockGapStylesSupport) {
+      style += `
+				${appendSelectors(selector, '> *')} {
+					margin-top: 0;
+					margin-bottom: 0;
+				}
+				${appendSelectors(selector, '> * + *')} {
+					margin-top: var( --wp--style--block-gap );
+				}
+			`;
+    }
+
     return createElement("style", null, style);
   },
 
@@ -117,12 +136,85 @@ export default {
   },
 
   getAlignments(layout) {
+    const alignmentInfo = getAlignmentsInfo(layout);
+
     if (layout.alignments !== undefined) {
-      return layout.alignments;
+      if (!layout.alignments.includes('none')) {
+        layout.alignments.unshift('none');
+      }
+
+      return layout.alignments.map(alignment => ({
+        name: alignment,
+        info: alignmentInfo[alignment]
+      }));
+    }
+
+    const {
+      contentSize,
+      wideSize
+    } = layout;
+    const alignments = [{
+      name: 'left'
+    }, {
+      name: 'center'
+    }, {
+      name: 'right'
+    }];
+
+    if (contentSize) {
+      alignments.unshift({
+        name: 'full'
+      });
     }
 
-    return layout.contentSize || layout.wideSize ? ['wide', 'full', 'left', 'center', 'right'] : ['left', 'center', 'right'];
+    if (wideSize) {
+      alignments.unshift({
+        name: 'wide',
+        info: alignmentInfo.wide
+      });
+    }
+
+    alignments.unshift({
+      name: 'none',
+      info: alignmentInfo.none
+    });
+    return alignments;
   }
 
 };
+/**
+ * Helper method to assign contextual info to clarify
+ * alignment settings.
+ *
+ * Besides checking if `contentSize` and `wideSize` have a
+ * value, we now show this information only if their values
+ * are not a `css var`. This needs to change when parsing
+ * css variables land.
+ *
+ * @see https://github.com/WordPress/gutenberg/pull/34710#issuecomment-918000752
+ *
+ * @param {Object} layout The layout object.
+ * @return {Object} An object with contextual info per alignment.
+ */
+
+function getAlignmentsInfo(layout) {
+  const {
+    contentSize,
+    wideSize
+  } = layout;
+  const alignmentInfo = {};
+  const sizeRegex = /^(?!0)\d+(px|em|rem|vw|vh|%)?$/i;
+
+  if (sizeRegex.test(contentSize)) {
+    // translators: %s: container size (i.e. 600px etc)
+    alignmentInfo.none = sprintf(__('Max %s wide'), contentSize);
+  }
+
+  if (sizeRegex.test(wideSize)) {
+    // translators: %s: container size (i.e. 600px etc)
+    alignmentInfo.wide = sprintf(__('Max %s wide'), wideSize);
+  }
+
+  return alignmentInfo;
+}
 //# sourceMappingURL=flow.js.map

package/build-module/layouts/flow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/layouts/flow.js"],"names":["Button","__experimentalUseCustomUnits","useCustomUnits","__experimentalUnitControl","UnitControl","__","Icon","positionCenter","stretchWide","useSetting","appendSelectors","name","label","edit","LayoutDefaultEdit","layout","onChange","wideSize","contentSize","units","availableUnits","nextWidth","parseFloat","undefined","inherit","save","DefaultLayoutStyle","selector","style","getOrientation","getAlignments","alignments"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { Icon, positionCenter, stretchWide } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../components/use-setting';\nimport { appendSelectors } from './utils';\n\nexport default {\n\tname: 'default',\n\n\tlabel: __( 'Flow' ),\n\n\tedit: function LayoutDefaultEdit( { layout, onChange } ) {\n\t\tconst { wideSize, contentSize } = layout;\n\t\tconst units = useCustomUnits( {\n\t\t\tavailableUnits: useSetting( 'spacing.units' ) || [\n\t\t\t\t'%',\n\t\t\t\t'px',\n\t\t\t\t'em',\n\t\t\t\t'rem',\n\t\t\t\t'vw',\n\t\t\t],\n\t\t} );\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<div className=\"block-editor-hooks__layout-controls\">\n\t\t\t\t\t<div className=\"block-editor-hooks__layout-controls-unit\">\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Content' ) }\n\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\t\tvalue={ contentSize || wideSize || '' }\n\t\t\t\t\t\t\tonChange={ ( nextWidth ) => {\n\t\t\t\t\t\t\t\tnextWidth =\n\t\t\t\t\t\t\t\t\t0 > parseFloat( nextWidth )\n\t\t\t\t\t\t\t\t\t\t? '0'\n\t\t\t\t\t\t\t\t\t\t: nextWidth;\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\tcontentSize: nextWidth,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Icon icon={ positionCenter } />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className=\"block-editor-hooks__layout-controls-unit\">\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Wide' ) }\n\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\t\tvalue={ wideSize || contentSize || '' }\n\t\t\t\t\t\t\tonChange={ ( nextWidth ) => {\n\t\t\t\t\t\t\t\tnextWidth =\n\t\t\t\t\t\t\t\t\t0 > parseFloat( nextWidth )\n\t\t\t\t\t\t\t\t\t\t? '0'\n\t\t\t\t\t\t\t\t\t\t: nextWidth;\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\twideSize: nextWidth,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Icon icon={ stretchWide } />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-hooks__layout-controls-reset\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\tisSmall\n\t\t\t\t\t\tdisabled={ ! contentSize && ! wideSize }\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tcontentSize: undefined,\n\t\t\t\t\t\t\t\twideSize: undefined,\n\t\t\t\t\t\t\t\tinherit: false,\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\n\t\t\t\t<p className=\"block-editor-hooks__layout-controls-helptext\">\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Customize the width for all elements that are assigned to the center or wide columns.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t</>\n\t\t);\n\t},\n\n\tsave: function DefaultLayoutStyle( { selector, layout = {} } ) {\n\t\tconst { contentSize, wideSize } = layout;\n\n\t\tlet style =\n\t\t\t!! contentSize || !! wideSize\n\t\t\t\t? `\n\t\t\t\t\t${ appendSelectors( selector, '> *' ) } {\n\t\t\t\t\t\tmax-width: ${ contentSize ?? wideSize };\n\t\t\t\t\t\tmargin-left: auto !important;\n\t\t\t\t\t\tmargin-right: auto !important;\n\t\t\t\t\t}\n\t\n\t\t\t\t\t${ appendSelectors( selector, '> [data-align=\"wide\"]' ) }  {\n\t\t\t\t\t\tmax-width: ${ wideSize ?? contentSize };\n\t\t\t\t\t}\n\t\n\t\t\t\t\t${ appendSelectors( selector, '> [data-align=\"full\"]' ) } {\n\t\t\t\t\t\tmax-width: none;\n\t\t\t\t\t}\n\t\t\t\t`\n\t\t\t\t: '';\n\n\t\tstyle += `\n\t\t\t${ appendSelectors( selector, '> [data-align=\"left\"]' ) } {\n\t\t\t\tfloat: left;\n\t\t\t\tmargin-right: 2em;\n\t\t\t}\n\t\n\t\t\t${ appendSelectors( selector, '> [data-align=\"right\"]' ) } {\n\t\t\t\tfloat: right;\n\t\t\t\tmargin-left: 2em;\n\t\t\t}\n\t\t`;\n\n\t\treturn <style>{ style }</style>;\n\t},\n\n\tgetOrientation() {\n\t\treturn 'vertical';\n\t},\n\n\tgetAlignments( layout ) {\n\t\tif ( layout.alignments !== undefined ) {\n\t\t\treturn layout.alignments;\n\t\t}\n\n\t\treturn layout.contentSize || layout.wideSize\n\t\t\t? [ 'wide', 'full', 'left', 'center', 'right' ]\n\t\t\t: [ 'left', 'center', 'right' ];\n\t},\n};\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/layouts/flow.js"],"names":["Button","__experimentalUseCustomUnits","useCustomUnits","__experimentalUnitControl","UnitControl","__","sprintf","Icon","positionCenter","stretchWide","useSetting","appendSelectors","name","label","inspectorControls","DefaultLayoutInspectorControls","layout","onChange","wideSize","contentSize","units","availableUnits","nextWidth","parseFloat","undefined","inherit","toolBarControls","DefaultLayoutToolbarControls","save","DefaultLayoutStyle","selector","blockGapSupport","hasBlockGapStylesSupport","style","getOrientation","getAlignments","alignmentInfo","getAlignmentsInfo","alignments","includes","unshift","map","alignment","info","wide","none","sizeRegex","test"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,MADD,EAECC,4BAA4B,IAAIC,cAFjC,EAGCC,yBAAyB,IAAIC,WAH9B,QAIO,uBAJP;AAKA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,IAAT,EAAeC,cAAf,EAA+BC,WAA/B,QAAkD,kBAAlD;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,2BAAvB;AACA,SAASC,eAAT,QAAgC,SAAhC;AAEA,eAAe;AACdC,EAAAA,IAAI,EAAE,SADQ;AAEdC,EAAAA,KAAK,EAAER,EAAE,CAAE,MAAF,CAFK;AAGdS,EAAAA,iBAAiB,EAAE,SAASC,8BAAT,CAAyC;AAC3DC,IAAAA,MAD2D;AAE3DC,IAAAA;AAF2D,GAAzC,EAGf;AACH,UAAM;AAAEC,MAAAA,QAAF;AAAYC,MAAAA;AAAZ,QAA4BH,MAAlC;AACA,UAAMI,KAAK,GAAGlB,cAAc,CAAE;AAC7BmB,MAAAA,cAAc,EAAEX,UAAU,CAAE,eAAF,CAAV,IAAiC,CAChD,GADgD,EAEhD,IAFgD,EAGhD,IAHgD,EAIhD,KAJgD,EAKhD,IALgD;AADpB,KAAF,CAA5B;AAUA,WACC,8BACC;AAAK,MAAA,SAAS,EAAC;AAAf,OACC;AAAK,MAAA,SAAS,EAAC;AAAf,OACC,cAAC,WAAD;AACC,MAAA,KAAK,EAAGL,EAAE,CAAE,SAAF,CADX;AAEC,MAAA,aAAa,EAAC,KAFf;AAGC,MAAA,oBAAoB,EAAC,MAHtB;AAIC,MAAA,KAAK,EAAGc,WAAW,IAAID,QAAf,IAA2B,EAJpC;AAKC,MAAA,QAAQ,EAAKI,SAAF,IAAiB;AAC3BA,QAAAA,SAAS,GACR,IAAIC,UAAU,CAAED,SAAF,CAAd,GACG,GADH,GAEGA,SAHJ;AAIAL,QAAAA,QAAQ,CAAE,EACT,GAAGD,MADM;AAETG,UAAAA,WAAW,EAAEG;AAFJ,SAAF,CAAR;AAIA,OAdF;AAeC,MAAA,KAAK,EAAGF;AAfT,MADD,EAkBC,cAAC,IAAD;AAAM,MAAA,IAAI,EAAGZ;AAAb,MAlBD,CADD,EAqBC;AAAK,MAAA,SAAS,EAAC;AAAf,OACC,cAAC,WAAD;AACC,MAAA,KAAK,EAAGH,EAAE,CAAE,MAAF,CADX;AAEC,MAAA,aAAa,EAAC,KAFf;AAGC,MAAA,oBAAoB,EAAC,MAHtB;AAIC,MAAA,KAAK,EAAGa,QAAQ,IAAIC,WAAZ,IAA2B,EAJpC;AAKC,MAAA,QAAQ,EAAKG,SAAF,IAAiB;AAC3BA,QAAAA,SAAS,GACR,IAAIC,UAAU,CAAED,SAAF,CAAd,GACG,GADH,GAEGA,SAHJ;AAIAL,QAAAA,QAAQ,CAAE,EACT,GAAGD,MADM;AAETE,UAAAA,QAAQ,EAAEI;AAFD,SAAF,CAAR;AAIA,OAdF;AAeC,MAAA,KAAK,EAAGF;AAfT,MADD,EAkBC,cAAC,IAAD;AAAM,MAAA,IAAI,EAAGX;AAAb,MAlBD,CArBD,CADD,EA2CC;AAAK,MAAA,SAAS,EAAC;AAAf,OACC,cAAC,MAAD;AACC,MAAA,OAAO,EAAC,WADT;AAEC,MAAA,OAAO,MAFR;AAGC,MAAA,QAAQ,EAAG,CAAEU,WAAF,IAAiB,CAAED,QAH/B;AAIC,MAAA,OAAO,EAAG,MACTD,QAAQ,CAAE;AACTE,QAAAA,WAAW,EAAEK,SADJ;AAETN,QAAAA,QAAQ,EAAEM,SAFD;AAGTC,QAAAA,OAAO,EAAE;AAHA,OAAF;AALV,OAYGpB,EAAE,CAAE,OAAF,CAZL,CADD,CA3CD,EA4DC;AAAG,MAAA,SAAS,EAAC;AAAb,OACGA,EAAE,CACH,uFADG,CADL,CA5DD,CADD;AAoEA,GAtFa;AAuFdqB,EAAAA,eAAe,EAAE,SAASC,4BAAT,GAAwC;AACxD,WAAO,IAAP;AACA,GAzFa;AA0FdC,EAAAA,IAAI,EAAE,SAASC,kBAAT,CAA6B;AAAEC,IAAAA,QAAF;AAAYd,IAAAA,MAAM,GAAG;AAArB,GAA7B,EAAyD;AAC9D,UAAM;AAAEG,MAAAA,WAAF;AAAeD,MAAAA;AAAf,QAA4BF,MAAlC;AACA,UAAMe,eAAe,GAAGrB,UAAU,CAAE,kBAAF,CAAlC;AACA,UAAMsB,wBAAwB,GAAGD,eAAe,KAAK,IAArD;AAEA,QAAIE,KAAK,GACR,CAAC,CAAEd,WAAH,IAAkB,CAAC,CAAED,QAArB,GACI;AACP,OAAQP,eAAe,CAAEmB,QAAF,EAAY,KAAZ,CAAqB;AAC5C,mBAAoBX,WAFd,aAEcA,WAFd,cAEcA,WAFd,GAE6BD,QAAU;AAC7C;AACA;AACA;AACA;AACA,OAAQP,eAAe,CAAEmB,QAAF,EAAY,uBAAZ,CAAuC;AAC9D,mBAAoBZ,QARd,aAQcA,QARd,cAQcA,QARd,GAQ0BC,WAAa;AAC7C;AACA;AACA,OAAQR,eAAe,CAAEmB,QAAF,EAAY,uBAAZ,CAAuC;AAC9D;AACA;AACA,KAfG,GAgBG,EAjBJ;AAmBAG,IAAAA,KAAK,IAAK;AACZ,KAAMtB,eAAe,CAAEmB,QAAF,EAAY,uBAAZ,CAAuC;AAC5D;AACA;AACA;AACA;AACA,KAAMnB,eAAe,CAAEmB,QAAF,EAAY,wBAAZ,CAAwC;AAC7D;AACA;AACA;AACA;AACA,GAXE;;AAaA,QAAKE,wBAAL,EAAgC;AAC/BC,MAAAA,KAAK,IAAK;AACb,MAAOtB,eAAe,CAAEmB,QAAF,EAAY,KAAZ,CAAqB;AAC3C;AACA;AACA;AACA,MAAOnB,eAAe,CAAEmB,QAAF,EAAY,SAAZ,CAAyB;AAC/C;AACA;AACA,IARG;AASA;;AAED,WAAO,6BAASG,KAAT,CAAP;AACA,GA5Ia;;AA6IdC,EAAAA,cAAc,GAAG;AAChB,WAAO,UAAP;AACA,GA/Ia;;AAgJdC,EAAAA,aAAa,CAAEnB,MAAF,EAAW;AACvB,UAAMoB,aAAa,GAAGC,iBAAiB,CAAErB,MAAF,CAAvC;;AACA,QAAKA,MAAM,CAACsB,UAAP,KAAsBd,SAA3B,EAAuC;AACtC,UAAK,CAAER,MAAM,CAACsB,UAAP,CAAkBC,QAAlB,CAA4B,MAA5B,CAAP,EAA8C;AAC7CvB,QAAAA,MAAM,CAACsB,UAAP,CAAkBE,OAAlB,CAA2B,MAA3B;AACA;;AACD,aAAOxB,MAAM,CAACsB,UAAP,CAAkBG,GAAlB,CAAyBC,SAAF,KAAmB;AAChD9B,QAAAA,IAAI,EAAE8B,SAD0C;AAEhDC,QAAAA,IAAI,EAAEP,aAAa,CAAEM,SAAF;AAF6B,OAAnB,CAAvB,CAAP;AAIA;;AACD,UAAM;AAAEvB,MAAAA,WAAF;AAAeD,MAAAA;AAAf,QAA4BF,MAAlC;AAEA,UAAMsB,UAAU,GAAG,CAClB;AAAE1B,MAAAA,IAAI,EAAE;AAAR,KADkB,EAElB;AAAEA,MAAAA,IAAI,EAAE;AAAR,KAFkB,EAGlB;AAAEA,MAAAA,IAAI,EAAE;AAAR,KAHkB,CAAnB;;AAMA,QAAKO,WAAL,EAAmB;AAClBmB,MAAAA,UAAU,CAACE,OAAX,CAAoB;AAAE5B,QAAAA,IAAI,EAAE;AAAR,OAApB;AACA;;AAED,QAAKM,QAAL,EAAgB;AACfoB,MAAAA,UAAU,CAACE,OAAX,CAAoB;AAAE5B,QAAAA,IAAI,EAAE,MAAR;AAAgB+B,QAAAA,IAAI,EAAEP,aAAa,CAACQ;AAApC,OAApB;AACA;;AAEDN,IAAAA,UAAU,CAACE,OAAX,CAAoB;AAAE5B,MAAAA,IAAI,EAAE,MAAR;AAAgB+B,MAAAA,IAAI,EAAEP,aAAa,CAACS;AAApC,KAApB;AAEA,WAAOP,UAAP;AACA;;AA9Ka,CAAf;AAiLA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASD,iBAAT,CAA4BrB,MAA5B,EAAqC;AACpC,QAAM;AAAEG,IAAAA,WAAF;AAAeD,IAAAA;AAAf,MAA4BF,MAAlC;AACA,QAAMoB,aAAa,GAAG,EAAtB;AACA,QAAMU,SAAS,GAAG,iCAAlB;;AACA,MAAKA,SAAS,CAACC,IAAV,CAAgB5B,WAAhB,CAAL,EAAqC;AACpC;AACAiB,IAAAA,aAAa,CAACS,IAAd,GAAqBvC,OAAO,CAAED,EAAE,CAAE,aAAF,CAAJ,EAAuBc,WAAvB,CAA5B;AACA;;AACD,MAAK2B,SAAS,CAACC,IAAV,CAAgB7B,QAAhB,CAAL,EAAkC;AACjC;AACAkB,IAAAA,aAAa,CAACQ,IAAd,GAAqBtC,OAAO,CAAED,EAAE,CAAE,aAAF,CAAJ,EAAuBa,QAAvB,CAA5B;AACA;;AACD,SAAOkB,aAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Icon, positionCenter, stretchWide } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../components/use-setting';\nimport { appendSelectors } from './utils';\n\nexport default {\n\tname: 'default',\n\tlabel: __( 'Flow' ),\n\tinspectorControls: function DefaultLayoutInspectorControls( {\n\t\tlayout,\n\t\tonChange,\n\t} ) {\n\t\tconst { wideSize, contentSize } = layout;\n\t\tconst units = useCustomUnits( {\n\t\t\tavailableUnits: useSetting( 'spacing.units' ) || [\n\t\t\t\t'%',\n\t\t\t\t'px',\n\t\t\t\t'em',\n\t\t\t\t'rem',\n\t\t\t\t'vw',\n\t\t\t],\n\t\t} );\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<div className=\"block-editor-hooks__layout-controls\">\n\t\t\t\t\t<div className=\"block-editor-hooks__layout-controls-unit\">\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Content' ) }\n\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\t\tvalue={ contentSize || wideSize || '' }\n\t\t\t\t\t\t\tonChange={ ( nextWidth ) => {\n\t\t\t\t\t\t\t\tnextWidth =\n\t\t\t\t\t\t\t\t\t0 > parseFloat( nextWidth )\n\t\t\t\t\t\t\t\t\t\t? '0'\n\t\t\t\t\t\t\t\t\t\t: nextWidth;\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\tcontentSize: nextWidth,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Icon icon={ positionCenter } />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className=\"block-editor-hooks__layout-controls-unit\">\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Wide' ) }\n\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\t\tvalue={ wideSize || contentSize || '' }\n\t\t\t\t\t\t\tonChange={ ( nextWidth ) => {\n\t\t\t\t\t\t\t\tnextWidth =\n\t\t\t\t\t\t\t\t\t0 > parseFloat( nextWidth )\n\t\t\t\t\t\t\t\t\t\t? '0'\n\t\t\t\t\t\t\t\t\t\t: nextWidth;\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\twideSize: nextWidth,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Icon icon={ stretchWide } />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-hooks__layout-controls-reset\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\tisSmall\n\t\t\t\t\t\tdisabled={ ! contentSize && ! wideSize }\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tcontentSize: undefined,\n\t\t\t\t\t\t\t\twideSize: undefined,\n\t\t\t\t\t\t\t\tinherit: false,\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\n\t\t\t\t<p className=\"block-editor-hooks__layout-controls-helptext\">\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Customize the width for all elements that are assigned to the center or wide columns.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t</>\n\t\t);\n\t},\n\ttoolBarControls: function DefaultLayoutToolbarControls() {\n\t\treturn null;\n\t},\n\tsave: function DefaultLayoutStyle( { selector, layout = {} } ) {\n\t\tconst { contentSize, wideSize } = layout;\n\t\tconst blockGapSupport = useSetting( 'spacing.blockGap' );\n\t\tconst hasBlockGapStylesSupport = blockGapSupport !== null;\n\n\t\tlet style =\n\t\t\t!! contentSize || !! wideSize\n\t\t\t\t? `\n\t\t\t\t\t${ appendSelectors( selector, '> *' ) } {\n\t\t\t\t\t\tmax-width: ${ contentSize ?? wideSize };\n\t\t\t\t\t\tmargin-left: auto !important;\n\t\t\t\t\t\tmargin-right: auto !important;\n\t\t\t\t\t}\n\n\t\t\t\t\t${ appendSelectors( selector, '> [data-align=\"wide\"]' ) }  {\n\t\t\t\t\t\tmax-width: ${ wideSize ?? contentSize };\n\t\t\t\t\t}\n\n\t\t\t\t\t${ appendSelectors( selector, '> [data-align=\"full\"]' ) } {\n\t\t\t\t\t\tmax-width: none;\n\t\t\t\t\t}\n\t\t\t\t`\n\t\t\t\t: '';\n\n\t\tstyle += `\n\t\t\t${ appendSelectors( selector, '> [data-align=\"left\"]' ) } {\n\t\t\t\tfloat: left;\n\t\t\t\tmargin-right: 2em;\n\t\t\t}\n\n\t\t\t${ appendSelectors( selector, '> [data-align=\"right\"]' ) } {\n\t\t\t\tfloat: right;\n\t\t\t\tmargin-left: 2em;\n\t\t\t}\n\n\t\t`;\n\n\t\tif ( hasBlockGapStylesSupport ) {\n\t\t\tstyle += `\n\t\t\t\t${ appendSelectors( selector, '> *' ) } {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\tmargin-bottom: 0;\n\t\t\t\t}\n\t\t\t\t${ appendSelectors( selector, '> * + *' ) } {\n\t\t\t\t\tmargin-top: var( --wp--style--block-gap );\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\treturn <style>{ style }</style>;\n\t},\n\tgetOrientation() {\n\t\treturn 'vertical';\n\t},\n\tgetAlignments( layout ) {\n\t\tconst alignmentInfo = getAlignmentsInfo( layout );\n\t\tif ( layout.alignments !== undefined ) {\n\t\t\tif ( ! layout.alignments.includes( 'none' ) ) {\n\t\t\t\tlayout.alignments.unshift( 'none' );\n\t\t\t}\n\t\t\treturn layout.alignments.map( ( alignment ) => ( {\n\t\t\t\tname: alignment,\n\t\t\t\tinfo: alignmentInfo[ alignment ],\n\t\t\t} ) );\n\t\t}\n\t\tconst { contentSize, wideSize } = layout;\n\n\t\tconst alignments = [\n\t\t\t{ name: 'left' },\n\t\t\t{ name: 'center' },\n\t\t\t{ name: 'right' },\n\t\t];\n\n\t\tif ( contentSize ) {\n\t\t\talignments.unshift( { name: 'full' } );\n\t\t}\n\n\t\tif ( wideSize ) {\n\t\t\talignments.unshift( { name: 'wide', info: alignmentInfo.wide } );\n\t\t}\n\n\t\talignments.unshift( { name: 'none', info: alignmentInfo.none } );\n\n\t\treturn alignments;\n\t},\n};\n\n/**\n * Helper method to assign contextual info to clarify\n * alignment settings.\n *\n * Besides checking if `contentSize` and `wideSize` have a\n * value, we now show this information only if their values\n * are not a `css var`. This needs to change when parsing\n * css variables land.\n *\n * @see https://github.com/WordPress/gutenberg/pull/34710#issuecomment-918000752\n *\n * @param {Object} layout The layout object.\n * @return {Object} An object with contextual info per alignment.\n */\nfunction getAlignmentsInfo( layout ) {\n\tconst { contentSize, wideSize } = layout;\n\tconst alignmentInfo = {};\n\tconst sizeRegex = /^(?!0)\\d+(px|em|rem|vw|vh|%)?$/i;\n\tif ( sizeRegex.test( contentSize ) ) {\n\t\t// translators: %s: container size (i.e. 600px etc)\n\t\talignmentInfo.none = sprintf( __( 'Max %s wide' ), contentSize );\n\t}\n\tif ( sizeRegex.test( wideSize ) ) {\n\t\t// translators: %s: container size (i.e. 600px etc)\n\t\talignmentInfo.wide = sprintf( __( 'Max %s wide' ), wideSize );\n\t}\n\treturn alignmentInfo;\n}\n"]}

package/build-module/store/actions.js

@@ -93,6 +93,8 @@ export function* validateBlocksToTemplate(blocks) {
  *                                 text value. See `wp.richText.create`.
  */
 
+/* eslint-disable jsdoc/valid-types */
+
 /**
  * Returns an action object used in signalling that selection state should be
  * reset to the specified selection.
@@ -105,6 +107,7 @@ export function* validateBlocksToTemplate(blocks) {
  */
 
 export function resetSelection(selectionStart, selectionEnd, initialPosition) {
+  /* eslint-enable jsdoc/valid-types */
   return {
     type: 'RESET_SELECTION',
     selectionStart,
@@ -117,12 +120,18 @@ export function resetSelection(selectionStart, selectionEnd, initialPosition) {
  * Unlike resetBlocks, these should be appended to the existing known set, not
  * replacing.
  *
+ * @deprecated
+ *
  * @param {Object[]} blocks Array of block objects.
  *
  * @return {Object} Action object.
  */
 
 export function receiveBlocks(blocks) {
+  deprecated('wp.data.dispatch( "core/block-editor" ).receiveBlocks', {
+    since: '5.9',
+    alternative: 'resetBlocks or insertBlocks'
+  });
   return {
     type: 'RECEIVE_BLOCKS',
     blocks
@@ -164,6 +173,8 @@ export function updateBlock(clientId, updates) {
     updates
   };
 }
+/* eslint-disable jsdoc/valid-types */
+
 /**
  * Returns an action object used in signalling that the block with the
  * specified client ID has been selected, optionally accepting a position
@@ -178,6 +189,7 @@ export function updateBlock(clientId, updates) {
  */
 
 export function selectBlock(clientId, initialPosition = 0) {
+  /* eslint-enable jsdoc/valid-types */
   return {
     type: 'SELECT_BLOCK',
     initialPosition,
@@ -322,6 +334,8 @@ function getBlocksWithDefaultStylesApplied(blocks, blockEditorSettings) {
     };
   });
 }
+/* eslint-disable jsdoc/valid-types */
+
 /**
  * Returns an action object signalling that a blocks should be replaced with
  * one or more replacement blocks.
@@ -337,6 +351,7 @@ function getBlocksWithDefaultStylesApplied(blocks, blockEditorSettings) {
 
 
 export function* replaceBlocks(clientIds, blocks, indexToSelect, initialPosition = 0, meta) {
+  /* eslint-enable jsdoc/valid-types */
   clientIds = castArray(clientIds);
   blocks = getBlocksWithDefaultStylesApplied(castArray(blocks), yield controls.select(blockEditorStoreName, 'getSettings'));
   const rootClientId = yield controls.select(blockEditorStoreName, 'getBlockRootClientId', first(clientIds)); // Replace is valid if the new blocks can be inserted in the root block.
@@ -384,8 +399,14 @@ export function replaceBlock(clientId, block) {
  */
 
 function createOnMove(type) {
-  return (clientIds, rootClientId) => {
-    return {
+  return function* (clientIds, rootClientId) {
+    const canMoveBlocks = yield controls.select(blockEditorStoreName, 'canMoveBlocks', clientIds, rootClientId); // If one of the blocks is locked or the parent is locked, we cannot move any block.
+
+    if (!canMoveBlocks) {
+      return;
+    }
+
+    yield {
       clientIds: castArray(clientIds),
       type,
       rootClientId
@@ -408,10 +429,10 @@ export const moveBlocksUp = createOnMove('MOVE_BLOCKS_UP');
  */
 
 export function* moveBlocksToPosition(clientIds, fromRootClientId = '', toRootClientId = '', index) {
-  const templateLock = yield controls.select(blockEditorStoreName, 'getTemplateLock', fromRootClientId); // If locking is equal to all on the original clientId (fromRootClientId),
-  // it is not possible to move the block to any other position.
+  const canMoveBlocks = yield controls.select(blockEditorStoreName, 'canMoveBlocks', clientIds, fromRootClientId);
+  const canRemoveBlocks = yield controls.select(blockEditorStoreName, 'canRemoveBlocks', clientIds, fromRootClientId); // If one of the blocks is locked or the parent is locked, we cannot move any block.
 
-  if (templateLock === 'all') {
+  if (!canMoveBlocks) {
     return;
   }
 
@@ -426,12 +447,11 @@ export function* moveBlocksToPosition(clientIds, fromRootClientId = '', toRootCl
   if (fromRootClientId === toRootClientId) {
     yield action;
     return;
-  } // If templateLock is insert we can not remove the block from the parent.
-  // Given that here we know that we are moving the block to a different
-  // parent, the move should not be possible if the condition is true.
+  } // If we're moving to another block, it means we're deleting blocks from
+  // the original block, so we need to check if removing is possible.
 
 
-  if (templateLock === 'insert') {
+  if (!canRemoveBlocks) {
     return;
   }
 
@@ -472,6 +492,8 @@ export function* moveBlockToPosition(clientId, fromRootClientId = '', toRootClie
 export function insertBlock(block, index, rootClientId, updateSelection = true, meta) {
   return insertBlocks([block], index, rootClientId, updateSelection, 0, meta);
 }
+/* eslint-disable jsdoc/valid-types */
+
 /**
  * Returns an action object used in signalling that an array of blocks should
  * be inserted, optionally at a specific index respective a root block list.
@@ -486,6 +508,7 @@ export function insertBlock(block, index, rootClientId, updateSelection = true,
  */
 
 export function* insertBlocks(blocks, index, rootClientId, updateSelection = true, initialPosition = 0, meta) {
+  /* eslint-enable jsdoc/valid-types */
   if (isObject(initialPosition)) {
     meta = initialPosition;
     initialPosition = 0;
@@ -600,7 +623,7 @@ export function* mergeBlocks(firstBlockClientId, secondBlockClientId) {
   const blockA = yield controls.select(blockEditorStoreName, 'getBlock', clientIdA);
   const blockAType = getBlockType(blockA.name); // Only focus the previous block if it's not mergeable
 
-  if (!blockAType.merge) {
+  if (blockAType && !blockAType.merge) {
     yield selectBlock(blockA.clientId);
     return;
   }
@@ -696,7 +719,8 @@ export function* mergeBlocks(firstBlockClientId, secondBlockClientId) {
     attributes: { ...blockA.attributes,
       ...updatedAttributes
     }
-  }, ...blocksWithTheSameType.slice(1)]);
+  }, ...blocksWithTheSameType.slice(1)], 0 // If we don't pass the `indexToSelect` it will default to the last block.
+  );
 }
 /**
  * Yields action objects used in signalling that the blocks corresponding to
@@ -714,9 +738,9 @@ export function* removeBlocks(clientIds, selectPrevious = true) {
 
   clientIds = castArray(clientIds);
   const rootClientId = yield controls.select(blockEditorStoreName, 'getBlockRootClientId', clientIds[0]);
-  const isLocked = yield controls.select(blockEditorStoreName, 'getTemplateLock', rootClientId);
+  const canRemoveBlocks = yield controls.select(blockEditorStoreName, 'canRemoveBlocks', clientIds, rootClientId);
 
-  if (isLocked) {
+  if (!canRemoveBlocks) {
     return;
   }
 
@@ -751,6 +775,8 @@ export function* removeBlocks(clientIds, selectPrevious = true) {
 export function removeBlock(clientId, selectPrevious) {
   return removeBlocks([clientId], selectPrevious);
 }
+/* eslint-disable jsdoc/valid-types */
+
 /**
  * Returns an action object used in signalling that the inner blocks with the
  * specified client ID should be replaced.
@@ -763,6 +789,7 @@ export function removeBlock(clientId, selectPrevious) {
  */
 
 export function replaceInnerBlocks(rootClientId, blocks, updateSelection = false, initialPosition = 0) {
+  /* eslint-enable jsdoc/valid-types */
   return {
     type: 'REPLACE_INNER_BLOCKS',
     rootClientId,