@wordpress/block-editor 8.5.5 → 8.5.8

package/build-module/hooks/dimensions.js

@@ -107,7 +107,7 @@ const useIsDimensionsDisabled = function () {
   return gapDisabled && paddingDisabled && marginDisabled;
 };
 /**
- * Custom hook to retrieve which padding/margin is supported
+ * Custom hook to retrieve which padding/margin/blockGap is supported
  * e.g. top, right, bottom or left.
  *
  * Sides are opted into by default. It is only if a specific side is set to
@@ -116,18 +116,28 @@ const useIsDimensionsDisabled = function () {
  * @param {string} blockName Block name.
  * @param {string} feature   The feature custom sides relate to e.g. padding or margins.
  *
- * @return {Object} Sides supporting custom margin.
+ * @return {?string[]} Strings representing the custom sides available.
  */
 
 
 export function useCustomSides(blockName, feature) {
+  var _support$feature;
+
   const support = getBlockSupport(blockName, SPACING_SUPPORT_KEY); // Skip when setting is boolean as theme isn't setting arbitrary sides.
 
   if (!support || typeof support[feature] === 'boolean') {
     return;
-  }
+  } // Return if the setting is an array of sides (e.g. `[ 'top', 'bottom' ]`).
+
 
-  return support[feature];
+  if (Array.isArray(support[feature])) {
+    return support[feature];
+  } // Finally, attempt to return `.sides` if the setting is an object.
+
+
+  if ((_support$feature = support[feature]) !== null && _support$feature !== void 0 && _support$feature.sides) {
+    return support[feature].sides;
+  }
 }
 /**
  * Custom hook to determine whether the sides configured in the

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/dimensions.js"],"names":["__experimentalToolsPanelItem","ToolsPanelItem","Platform","__","getBlockSupport","InspectorControls","GapEdit","hasGapSupport","hasGapValue","resetGap","useIsGapDisabled","MarginEdit","hasMarginSupport","hasMarginValue","resetMargin","useIsMarginDisabled","PaddingEdit","hasPaddingSupport","hasPaddingValue","resetPadding","useIsPaddingDisabled","SPACING_SUPPORT_KEY","ALL_SIDES","AXIAL_SIDES","DimensionsPanel","props","isGapDisabled","isPaddingDisabled","isMarginDisabled","isDisabled","useIsDimensionsDisabled","isSupported","hasDimensionsSupport","name","defaultSpacingControls","createResetAllFilter","attribute","newAttributes","style","spacing","undefined","padding","clientId","margin","blockGap","blockName","OS","gapDisabled","paddingDisabled","marginDisabled","useCustomSides","feature","support","useIsDimensionsSupportValid","sides","some","side","includes","console","warn"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components';\nimport { Platform } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tGapEdit,\n\thasGapSupport,\n\thasGapValue,\n\tresetGap,\n\tuseIsGapDisabled,\n} from './gap';\nimport {\n\tMarginEdit,\n\thasMarginSupport,\n\thasMarginValue,\n\tresetMargin,\n\tuseIsMarginDisabled,\n} from './margin';\nimport {\n\tPaddingEdit,\n\thasPaddingSupport,\n\thasPaddingValue,\n\tresetPadding,\n\tuseIsPaddingDisabled,\n} from './padding';\n\nexport const SPACING_SUPPORT_KEY = 'spacing';\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\nexport const AXIAL_SIDES = [ 'vertical', 'horizontal' ];\n\n/**\n * Inspector controls for dimensions support.\n *\n * @param {Object} props Block props.\n *\n * @return {WPElement} Inspector controls for spacing support features.\n */\nexport function DimensionsPanel( props ) {\n\tconst isGapDisabled = useIsGapDisabled( props );\n\tconst isPaddingDisabled = useIsPaddingDisabled( props );\n\tconst isMarginDisabled = useIsMarginDisabled( props );\n\tconst isDisabled = useIsDimensionsDisabled( props );\n\tconst isSupported = hasDimensionsSupport( props.name );\n\n\tif ( isDisabled || ! isSupported ) {\n\t\treturn null;\n\t}\n\n\tconst defaultSpacingControls = getBlockSupport( props.name, [\n\t\tSPACING_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\n\tconst createResetAllFilter = ( attribute ) => ( newAttributes ) => ( {\n\t\t...newAttributes,\n\t\tstyle: {\n\t\t\t...newAttributes.style,\n\t\t\tspacing: {\n\t\t\t\t...newAttributes.style?.spacing,\n\t\t\t\t[ attribute ]: undefined,\n\t\t\t},\n\t\t},\n\t} );\n\n\treturn (\n\t\t<InspectorControls __experimentalGroup=\"dimensions\">\n\t\t\t{ ! isPaddingDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasPaddingValue( props ) }\n\t\t\t\t\tlabel={ __( 'Padding' ) }\n\t\t\t\t\tonDeselect={ () => resetPadding( props ) }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'padding' ) }\n\t\t\t\t\tisShownByDefault={ defaultSpacingControls?.padding }\n\t\t\t\t\tpanelId={ props.clientId }\n\t\t\t\t>\n\t\t\t\t\t<PaddingEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isMarginDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasMarginValue( props ) }\n\t\t\t\t\tlabel={ __( 'Margin' ) }\n\t\t\t\t\tonDeselect={ () => resetMargin( props ) }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'margin' ) }\n\t\t\t\t\tisShownByDefault={ defaultSpacingControls?.margin }\n\t\t\t\t\tpanelId={ props.clientId }\n\t\t\t\t>\n\t\t\t\t\t<MarginEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isGapDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasGapValue( props ) }\n\t\t\t\t\tlabel={ __( 'Block spacing' ) }\n\t\t\t\t\tonDeselect={ () => resetGap( props ) }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'blockGap' ) }\n\t\t\t\t\tisShownByDefault={ defaultSpacingControls?.blockGap }\n\t\t\t\t\tpanelId={ props.clientId }\n\t\t\t\t>\n\t\t\t\t\t<GapEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Determine whether there is dimensions related block support.\n *\n * @param {string} blockName Block name.\n *\n * @return {boolean} Whether there is support.\n */\nexport function hasDimensionsSupport( blockName ) {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\treturn (\n\t\thasGapSupport( blockName ) ||\n\t\thasPaddingSupport( blockName ) ||\n\t\thasMarginSupport( blockName )\n\t);\n}\n\n/**\n * Determines whether dimensions support has been disabled.\n *\n * @param {Object} props Block properties.\n *\n * @return {boolean} If spacing support is completely disabled.\n */\nconst useIsDimensionsDisabled = ( props = {} ) => {\n\tconst gapDisabled = useIsGapDisabled( props );\n\tconst paddingDisabled = useIsPaddingDisabled( props );\n\tconst marginDisabled = useIsMarginDisabled( props );\n\n\treturn gapDisabled && paddingDisabled && marginDisabled;\n};\n\n/**\n * Custom hook to retrieve which padding/margin is supported\n * e.g. top, right, bottom or left.\n *\n * Sides are opted into by default. It is only if a specific side is set to\n * false that it is omitted.\n *\n * @param {string} blockName Block name.\n * @param {string} feature   The feature custom sides relate to e.g. padding or margins.\n *\n * @return {Object} Sides supporting custom margin.\n */\nexport function useCustomSides( blockName, feature ) {\n\tconst support = getBlockSupport( blockName, SPACING_SUPPORT_KEY );\n\n\t// Skip when setting is boolean as theme isn't setting arbitrary sides.\n\tif ( ! support || typeof support[ feature ] === 'boolean' ) {\n\t\treturn;\n\t}\n\n\treturn support[ feature ];\n}\n\n/**\n * Custom hook to determine whether the sides configured in the\n * block support are valid. A dimension property cannot declare\n * support for a mix of axial and individual sides.\n *\n * @param {string} blockName Block name.\n * @param {string} feature   The feature custom sides relate to e.g. padding or margins.\n *\n * @return {boolean} If the feature has a valid configuration of sides.\n */\nexport function useIsDimensionsSupportValid( blockName, feature ) {\n\tconst sides = useCustomSides( blockName, feature );\n\n\tif (\n\t\tsides &&\n\t\tsides.some( ( side ) => ALL_SIDES.includes( side ) ) &&\n\t\tsides.some( ( side ) => AXIAL_SIDES.includes( side ) )\n\t) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t`The ${ feature } support for the \"${ blockName }\" block can not be configured to support both axial and arbitrary sides.`\n\t\t);\n\t\treturn false;\n\t}\n\n\treturn true;\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/hooks/dimensions.js"],"names":["__experimentalToolsPanelItem","ToolsPanelItem","Platform","__","getBlockSupport","InspectorControls","GapEdit","hasGapSupport","hasGapValue","resetGap","useIsGapDisabled","MarginEdit","hasMarginSupport","hasMarginValue","resetMargin","useIsMarginDisabled","PaddingEdit","hasPaddingSupport","hasPaddingValue","resetPadding","useIsPaddingDisabled","SPACING_SUPPORT_KEY","ALL_SIDES","AXIAL_SIDES","DimensionsPanel","props","isGapDisabled","isPaddingDisabled","isMarginDisabled","isDisabled","useIsDimensionsDisabled","isSupported","hasDimensionsSupport","name","defaultSpacingControls","createResetAllFilter","attribute","newAttributes","style","spacing","undefined","padding","clientId","margin","blockGap","blockName","OS","gapDisabled","paddingDisabled","marginDisabled","useCustomSides","feature","support","Array","isArray","sides","useIsDimensionsSupportValid","some","side","includes","console","warn"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components';\nimport { Platform } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tGapEdit,\n\thasGapSupport,\n\thasGapValue,\n\tresetGap,\n\tuseIsGapDisabled,\n} from './gap';\nimport {\n\tMarginEdit,\n\thasMarginSupport,\n\thasMarginValue,\n\tresetMargin,\n\tuseIsMarginDisabled,\n} from './margin';\nimport {\n\tPaddingEdit,\n\thasPaddingSupport,\n\thasPaddingValue,\n\tresetPadding,\n\tuseIsPaddingDisabled,\n} from './padding';\n\nexport const SPACING_SUPPORT_KEY = 'spacing';\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\nexport const AXIAL_SIDES = [ 'vertical', 'horizontal' ];\n\n/**\n * Inspector controls for dimensions support.\n *\n * @param {Object} props Block props.\n *\n * @return {WPElement} Inspector controls for spacing support features.\n */\nexport function DimensionsPanel( props ) {\n\tconst isGapDisabled = useIsGapDisabled( props );\n\tconst isPaddingDisabled = useIsPaddingDisabled( props );\n\tconst isMarginDisabled = useIsMarginDisabled( props );\n\tconst isDisabled = useIsDimensionsDisabled( props );\n\tconst isSupported = hasDimensionsSupport( props.name );\n\n\tif ( isDisabled || ! isSupported ) {\n\t\treturn null;\n\t}\n\n\tconst defaultSpacingControls = getBlockSupport( props.name, [\n\t\tSPACING_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\n\tconst createResetAllFilter = ( attribute ) => ( newAttributes ) => ( {\n\t\t...newAttributes,\n\t\tstyle: {\n\t\t\t...newAttributes.style,\n\t\t\tspacing: {\n\t\t\t\t...newAttributes.style?.spacing,\n\t\t\t\t[ attribute ]: undefined,\n\t\t\t},\n\t\t},\n\t} );\n\n\treturn (\n\t\t<InspectorControls __experimentalGroup=\"dimensions\">\n\t\t\t{ ! isPaddingDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasPaddingValue( props ) }\n\t\t\t\t\tlabel={ __( 'Padding' ) }\n\t\t\t\t\tonDeselect={ () => resetPadding( props ) }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'padding' ) }\n\t\t\t\t\tisShownByDefault={ defaultSpacingControls?.padding }\n\t\t\t\t\tpanelId={ props.clientId }\n\t\t\t\t>\n\t\t\t\t\t<PaddingEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isMarginDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasMarginValue( props ) }\n\t\t\t\t\tlabel={ __( 'Margin' ) }\n\t\t\t\t\tonDeselect={ () => resetMargin( props ) }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'margin' ) }\n\t\t\t\t\tisShownByDefault={ defaultSpacingControls?.margin }\n\t\t\t\t\tpanelId={ props.clientId }\n\t\t\t\t>\n\t\t\t\t\t<MarginEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isGapDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasGapValue( props ) }\n\t\t\t\t\tlabel={ __( 'Block spacing' ) }\n\t\t\t\t\tonDeselect={ () => resetGap( props ) }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'blockGap' ) }\n\t\t\t\t\tisShownByDefault={ defaultSpacingControls?.blockGap }\n\t\t\t\t\tpanelId={ props.clientId }\n\t\t\t\t>\n\t\t\t\t\t<GapEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Determine whether there is dimensions related block support.\n *\n * @param {string} blockName Block name.\n *\n * @return {boolean} Whether there is support.\n */\nexport function hasDimensionsSupport( blockName ) {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\treturn (\n\t\thasGapSupport( blockName ) ||\n\t\thasPaddingSupport( blockName ) ||\n\t\thasMarginSupport( blockName )\n\t);\n}\n\n/**\n * Determines whether dimensions support has been disabled.\n *\n * @param {Object} props Block properties.\n *\n * @return {boolean} If spacing support is completely disabled.\n */\nconst useIsDimensionsDisabled = ( props = {} ) => {\n\tconst gapDisabled = useIsGapDisabled( props );\n\tconst paddingDisabled = useIsPaddingDisabled( props );\n\tconst marginDisabled = useIsMarginDisabled( props );\n\n\treturn gapDisabled && paddingDisabled && marginDisabled;\n};\n\n/**\n * Custom hook to retrieve which padding/margin/blockGap is supported\n * e.g. top, right, bottom or left.\n *\n * Sides are opted into by default. It is only if a specific side is set to\n * false that it is omitted.\n *\n * @param {string} blockName Block name.\n * @param {string} feature   The feature custom sides relate to e.g. padding or margins.\n *\n * @return {?string[]} Strings representing the custom sides available.\n */\nexport function useCustomSides( blockName, feature ) {\n\tconst support = getBlockSupport( blockName, SPACING_SUPPORT_KEY );\n\n\t// Skip when setting is boolean as theme isn't setting arbitrary sides.\n\tif ( ! support || typeof support[ feature ] === 'boolean' ) {\n\t\treturn;\n\t}\n\n\t// Return if the setting is an array of sides (e.g. `[ 'top', 'bottom' ]`).\n\tif ( Array.isArray( support[ feature ] ) ) {\n\t\treturn support[ feature ];\n\t}\n\n\t// Finally, attempt to return `.sides` if the setting is an object.\n\tif ( support[ feature ]?.sides ) {\n\t\treturn support[ feature ].sides;\n\t}\n}\n\n/**\n * Custom hook to determine whether the sides configured in the\n * block support are valid. A dimension property cannot declare\n * support for a mix of axial and individual sides.\n *\n * @param {string} blockName Block name.\n * @param {string} feature   The feature custom sides relate to e.g. padding or margins.\n *\n * @return {boolean} If the feature has a valid configuration of sides.\n */\nexport function useIsDimensionsSupportValid( blockName, feature ) {\n\tconst sides = useCustomSides( blockName, feature );\n\n\tif (\n\t\tsides &&\n\t\tsides.some( ( side ) => ALL_SIDES.includes( side ) ) &&\n\t\tsides.some( ( side ) => AXIAL_SIDES.includes( side ) )\n\t) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t`The ${ feature } support for the \"${ blockName }\" block can not be configured to support both axial and arbitrary sides.`\n\t\t);\n\t\treturn false;\n\t}\n\n\treturn true;\n}\n"]}

package/build-module/layouts/flex.js

@@ -6,6 +6,7 @@ import { createElement, Fragment } from "@wordpress/element";
 import { __ } from '@wordpress/i18n';
 import { justifyLeft, justifyCenter, justifyRight, justifySpaceBetween, arrowRight, arrowDown } from '@wordpress/icons';
 import { Button, ToggleControl, Flex, FlexItem } from '@wordpress/components';
+import { getBlockSupport } from '@wordpress/blocks';
 /**
  * Internal dependencies
  */
@@ -97,10 +98,11 @@ export default {
       orientation = 'horizontal'
     } = layout;
     const blockGapSupport = useSetting('spacing.blockGap');
+    const fallbackValue = getBlockSupport(blockName, ['spacing', 'blockGap', '__experimentalDefault']) || '0.5em';
     const hasBlockGapStylesSupport = blockGapSupport !== null; // If a block's block.json skips serialization for spacing or spacing.blockGap,
     // don't apply the user-defined value to the styles.
 
-    const blockGapValue = style !== null && style !== void 0 && (_style$spacing = style.spacing) !== null && _style$spacing !== void 0 && _style$spacing.blockGap && !shouldSkipSerialization(blockName, 'spacing', 'blockGap') ? getGapCSSValue(style === null || style === void 0 ? void 0 : (_style$spacing2 = style.spacing) === null || _style$spacing2 === void 0 ? void 0 : _style$spacing2.blockGap, '0.5em') : 'var( --wp--style--block-gap, 0.5em )';
+    const blockGapValue = style !== null && style !== void 0 && (_style$spacing = style.spacing) !== null && _style$spacing !== void 0 && _style$spacing.blockGap && !shouldSkipSerialization(blockName, 'spacing', 'blockGap') ? getGapCSSValue(style === null || style === void 0 ? void 0 : (_style$spacing2 = style.spacing) === null || _style$spacing2 === void 0 ? void 0 : _style$spacing2.blockGap, fallbackValue) : `var( --wp--style--block-gap, ${fallbackValue} )`;
     const justifyContent = justifyContentMap[layout.justifyContent] || justifyContentMap.left;
     const flexWrap = flexWrapOptions.includes(layout.flexWrap) ? layout.flexWrap : 'wrap';
     const verticalAlignment = verticalAlignmentMap[layout.verticalAlignment] || verticalAlignmentMap.center;
@@ -118,7 +120,7 @@ export default {
 				${appendSelectors(selector)} {
 					display: flex;
 					flex-wrap: ${flexWrap};
-					gap: ${hasBlockGapStylesSupport ? blockGapValue : '0.5em'};
+					gap: ${hasBlockGapStylesSupport ? blockGapValue : fallbackValue};
 					${orientation === 'horizontal' ? rowOrientation : columnOrientation}
 				}
 

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/layouts/flex.js"],"names":["__","justifyLeft","justifyCenter","justifyRight","justifySpaceBetween","arrowRight","arrowDown","Button","ToggleControl","Flex","FlexItem","appendSelectors","getGapCSSValue","useSetting","BlockControls","JustifyContentControl","BlockVerticalAlignmentControl","shouldSkipSerialization","justifyContentMap","left","right","center","alignItemsMap","verticalAlignmentMap","top","bottom","flexWrapOptions","name","label","inspectorControls","FlexLayoutInspectorControls","layout","onChange","layoutBlockSupport","allowOrientation","toolBarControls","FlexLayoutToolbarControls","allowSwitching","allowVerticalAlignment","orientation","save","FlexLayoutStyle","selector","style","blockName","blockGapSupport","hasBlockGapStylesSupport","blockGapValue","spacing","blockGap","justifyContent","flexWrap","includes","verticalAlignment","rowOrientation","alignItems","columnOrientation","getOrientation","getAlignments","FlexLayoutVerticalAlignmentControl","isToolbar","onVerticalAlignmentChange","value","verticalAlignmentOptions","map","icon","FlexLayoutJustifyContentControl","onJustificationChange","allowedControls","push","position","isAlternate","justificationOptions","FlexWrapControl","OrientationControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tjustifyLeft,\n\tjustifyCenter,\n\tjustifyRight,\n\tjustifySpaceBetween,\n\tarrowRight,\n\tarrowDown,\n} from '@wordpress/icons';\nimport { Button, ToggleControl, Flex, FlexItem } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { appendSelectors } from './utils';\nimport { getGapCSSValue } from '../hooks/gap';\nimport useSetting from '../components/use-setting';\nimport {\n\tBlockControls,\n\tJustifyContentControl,\n\tBlockVerticalAlignmentControl,\n} from '../components';\nimport { shouldSkipSerialization } from '../hooks/utils';\n\n// Used with the default, horizontal flex orientation.\nconst justifyContentMap = {\n\tleft: 'flex-start',\n\tright: 'flex-end',\n\tcenter: 'center',\n\t'space-between': 'space-between',\n};\n\n// Used with the vertical (column) flex orientation.\nconst alignItemsMap = {\n\tleft: 'flex-start',\n\tright: 'flex-end',\n\tcenter: 'center',\n};\n\nconst verticalAlignmentMap = {\n\ttop: 'flex-start',\n\tcenter: 'center',\n\tbottom: 'flex-end',\n};\n\nconst flexWrapOptions = [ 'wrap', 'nowrap' ];\n\nexport default {\n\tname: 'flex',\n\tlabel: __( 'Flex' ),\n\tinspectorControls: function FlexLayoutInspectorControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t\tlayoutBlockSupport = {},\n\t} ) {\n\t\tconst { allowOrientation = true } = layoutBlockSupport;\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Flex>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<FlexLayoutJustifyContentControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t{ allowOrientation && (\n\t\t\t\t\t\t\t<OrientationControl\n\t\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t\t<FlexWrapControl layout={ layout } onChange={ 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\tconst { allowVerticalAlignment = true } = layoutBlockSupport;\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\t{ allowVerticalAlignment &&\n\t\t\t\t\tlayout?.orientation !== 'vertical' && (\n\t\t\t\t\t\t<FlexLayoutVerticalAlignmentControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tisToolbar\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t</BlockControls>\n\t\t);\n\t},\n\tsave: function FlexLayoutStyle( { selector, layout, style, blockName } ) {\n\t\tconst { orientation = 'horizontal' } = layout;\n\t\tconst blockGapSupport = useSetting( 'spacing.blockGap' );\n\t\tconst hasBlockGapStylesSupport = blockGapSupport !== null;\n\t\t// If a block's block.json skips serialization for spacing or spacing.blockGap,\n\t\t// don't apply the user-defined value to the styles.\n\t\tconst blockGapValue =\n\t\t\tstyle?.spacing?.blockGap &&\n\t\t\t! shouldSkipSerialization( blockName, 'spacing', 'blockGap' )\n\t\t\t\t? getGapCSSValue( style?.spacing?.blockGap, '0.5em' )\n\t\t\t\t: 'var( --wp--style--block-gap, 0.5em )';\n\t\tconst justifyContent =\n\t\t\tjustifyContentMap[ layout.justifyContent ] ||\n\t\t\tjustifyContentMap.left;\n\t\tconst flexWrap = flexWrapOptions.includes( layout.flexWrap )\n\t\t\t? layout.flexWrap\n\t\t\t: 'wrap';\n\t\tconst verticalAlignment =\n\t\t\tverticalAlignmentMap[ layout.verticalAlignment ] ||\n\t\t\tverticalAlignmentMap.center;\n\t\tconst rowOrientation = `\n\t\tflex-direction: row;\n\t\talign-items: ${ verticalAlignment };\n\t\tjustify-content: ${ justifyContent };\n\t\t`;\n\t\tconst alignItems =\n\t\t\talignItemsMap[ layout.justifyContent ] || alignItemsMap.left;\n\t\tconst columnOrientation = `\n\t\tflex-direction: column;\n\t\talign-items: ${ alignItems };\n\t\t`;\n\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\tflex-wrap: ${ flexWrap };\n\t\t\t\t\tgap: ${ hasBlockGapStylesSupport ? blockGapValue : '0.5em' };\n\t\t\t\t\t${ orientation === 'horizontal' ? rowOrientation : columnOrientation }\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( layout ) {\n\t\tconst { orientation = 'horizontal' } = layout;\n\t\treturn orientation;\n\t},\n\tgetAlignments() {\n\t\treturn [];\n\t},\n};\n\nfunction FlexLayoutVerticalAlignmentControl( {\n\tlayout,\n\tonChange,\n\tisToolbar = false,\n} ) {\n\tconst { verticalAlignment = verticalAlignmentMap.center } = layout;\n\n\tconst onVerticalAlignmentChange = ( value ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tverticalAlignment: value,\n\t\t} );\n\t};\n\tif ( isToolbar ) {\n\t\treturn (\n\t\t\t<BlockVerticalAlignmentControl\n\t\t\t\tonChange={ onVerticalAlignmentChange }\n\t\t\t\tvalue={ verticalAlignment }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst verticalAlignmentOptions = [\n\t\t{\n\t\t\tvalue: 'flex-start',\n\t\t\tlabel: __( 'Align items top' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'center',\n\t\t\tlabel: __( 'Align items center' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'flex-end',\n\t\t\tlabel: __( 'Align items bottom' ),\n\t\t},\n\t];\n\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__flex-layout-vertical-alignment-control\">\n\t\t\t<legend>{ __( 'Vertical alignment' ) }</legend>\n\t\t\t<div>\n\t\t\t\t{ verticalAlignmentOptions.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={ verticalAlignment === value }\n\t\t\t\t\t\t\tonClick={ () => onVerticalAlignmentChange( 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\nfunction FlexLayoutJustifyContentControl( {\n\tlayout,\n\tonChange,\n\tisToolbar = false,\n} ) {\n\tconst { justifyContent = 'left', orientation = 'horizontal' } = layout;\n\tconst onJustificationChange = ( value ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tjustifyContent: value,\n\t\t} );\n\t};\n\tconst allowedControls = [ 'left', 'center', 'right' ];\n\tif ( orientation === 'horizontal' ) {\n\t\tallowedControls.push( 'space-between' );\n\t}\n\tif ( isToolbar ) {\n\t\treturn (\n\t\t\t<JustifyContentControl\n\t\t\t\tallowedControls={ allowedControls }\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\tconst justificationOptions = [\n\t\t{\n\t\t\tvalue: 'left',\n\t\t\ticon: justifyLeft,\n\t\t\tlabel: __( 'Justify items left' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'center',\n\t\t\ticon: justifyCenter,\n\t\t\tlabel: __( 'Justify items center' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'right',\n\t\t\ticon: justifyRight,\n\t\t\tlabel: __( 'Justify items right' ),\n\t\t},\n\t];\n\tif ( orientation === 'horizontal' ) {\n\t\tjustificationOptions.push( {\n\t\t\tvalue: 'space-between',\n\t\t\ticon: justifySpaceBetween,\n\t\t\tlabel: __( 'Space between items' ),\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\nfunction FlexWrapControl( { layout, onChange } ) {\n\tconst { flexWrap = 'wrap' } = layout;\n\treturn (\n\t\t<ToggleControl\n\t\t\tlabel={ __( 'Allow to wrap to multiple lines' ) }\n\t\t\tonChange={ ( value ) => {\n\t\t\t\tonChange( {\n\t\t\t\t\t...layout,\n\t\t\t\t\tflexWrap: value ? 'wrap' : 'nowrap',\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tchecked={ flexWrap === 'wrap' }\n\t\t/>\n\t);\n}\n\nfunction OrientationControl( { layout, onChange } ) {\n\tconst { orientation = 'horizontal' } = layout;\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__flex-layout-orientation-controls\">\n\t\t\t<legend>{ __( 'Orientation' ) }</legend>\n\t\t\t<Button\n\t\t\t\tlabel={ 'horizontal' }\n\t\t\t\ticon={ arrowRight }\n\t\t\t\tisPressed={ orientation === 'horizontal' }\n\t\t\t\tonClick={ () =>\n\t\t\t\t\tonChange( {\n\t\t\t\t\t\t...layout,\n\t\t\t\t\t\torientation: 'horizontal',\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\tlabel={ 'vertical' }\n\t\t\t\ticon={ arrowDown }\n\t\t\t\tisPressed={ orientation === 'vertical' }\n\t\t\t\tonClick={ () =>\n\t\t\t\t\tonChange( {\n\t\t\t\t\t\t...layout,\n\t\t\t\t\t\torientation: 'vertical',\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t/>\n\t\t</fieldset>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/layouts/flex.js"],"names":["__","justifyLeft","justifyCenter","justifyRight","justifySpaceBetween","arrowRight","arrowDown","Button","ToggleControl","Flex","FlexItem","getBlockSupport","appendSelectors","getGapCSSValue","useSetting","BlockControls","JustifyContentControl","BlockVerticalAlignmentControl","shouldSkipSerialization","justifyContentMap","left","right","center","alignItemsMap","verticalAlignmentMap","top","bottom","flexWrapOptions","name","label","inspectorControls","FlexLayoutInspectorControls","layout","onChange","layoutBlockSupport","allowOrientation","toolBarControls","FlexLayoutToolbarControls","allowSwitching","allowVerticalAlignment","orientation","save","FlexLayoutStyle","selector","style","blockName","blockGapSupport","fallbackValue","hasBlockGapStylesSupport","blockGapValue","spacing","blockGap","justifyContent","flexWrap","includes","verticalAlignment","rowOrientation","alignItems","columnOrientation","getOrientation","getAlignments","FlexLayoutVerticalAlignmentControl","isToolbar","onVerticalAlignmentChange","value","verticalAlignmentOptions","map","icon","FlexLayoutJustifyContentControl","onJustificationChange","allowedControls","push","position","isAlternate","justificationOptions","FlexWrapControl","OrientationControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tjustifyLeft,\n\tjustifyCenter,\n\tjustifyRight,\n\tjustifySpaceBetween,\n\tarrowRight,\n\tarrowDown,\n} from '@wordpress/icons';\nimport { Button, ToggleControl, Flex, FlexItem } from '@wordpress/components';\nimport { getBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { appendSelectors } from './utils';\nimport { getGapCSSValue } from '../hooks/gap';\nimport useSetting from '../components/use-setting';\nimport {\n\tBlockControls,\n\tJustifyContentControl,\n\tBlockVerticalAlignmentControl,\n} from '../components';\nimport { shouldSkipSerialization } from '../hooks/utils';\n\n// Used with the default, horizontal flex orientation.\nconst justifyContentMap = {\n\tleft: 'flex-start',\n\tright: 'flex-end',\n\tcenter: 'center',\n\t'space-between': 'space-between',\n};\n\n// Used with the vertical (column) flex orientation.\nconst alignItemsMap = {\n\tleft: 'flex-start',\n\tright: 'flex-end',\n\tcenter: 'center',\n};\n\nconst verticalAlignmentMap = {\n\ttop: 'flex-start',\n\tcenter: 'center',\n\tbottom: 'flex-end',\n};\n\nconst flexWrapOptions = [ 'wrap', 'nowrap' ];\n\nexport default {\n\tname: 'flex',\n\tlabel: __( 'Flex' ),\n\tinspectorControls: function FlexLayoutInspectorControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t\tlayoutBlockSupport = {},\n\t} ) {\n\t\tconst { allowOrientation = true } = layoutBlockSupport;\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Flex>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<FlexLayoutJustifyContentControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t{ allowOrientation && (\n\t\t\t\t\t\t\t<OrientationControl\n\t\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t\t<FlexWrapControl layout={ layout } onChange={ 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\tconst { allowVerticalAlignment = true } = layoutBlockSupport;\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\t{ allowVerticalAlignment &&\n\t\t\t\t\tlayout?.orientation !== 'vertical' && (\n\t\t\t\t\t\t<FlexLayoutVerticalAlignmentControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tisToolbar\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t</BlockControls>\n\t\t);\n\t},\n\tsave: function FlexLayoutStyle( { selector, layout, style, blockName } ) {\n\t\tconst { orientation = 'horizontal' } = layout;\n\t\tconst blockGapSupport = useSetting( 'spacing.blockGap' );\n\t\tconst fallbackValue =\n\t\t\tgetBlockSupport( blockName, [\n\t\t\t\t'spacing',\n\t\t\t\t'blockGap',\n\t\t\t\t'__experimentalDefault',\n\t\t\t] ) || '0.5em';\n\n\t\tconst hasBlockGapStylesSupport = blockGapSupport !== null;\n\t\t// If a block's block.json skips serialization for spacing or spacing.blockGap,\n\t\t// don't apply the user-defined value to the styles.\n\t\tconst blockGapValue =\n\t\t\tstyle?.spacing?.blockGap &&\n\t\t\t! shouldSkipSerialization( blockName, 'spacing', 'blockGap' )\n\t\t\t\t? getGapCSSValue( style?.spacing?.blockGap, fallbackValue )\n\t\t\t\t: `var( --wp--style--block-gap, ${ fallbackValue } )`;\n\t\tconst justifyContent =\n\t\t\tjustifyContentMap[ layout.justifyContent ] ||\n\t\t\tjustifyContentMap.left;\n\t\tconst flexWrap = flexWrapOptions.includes( layout.flexWrap )\n\t\t\t? layout.flexWrap\n\t\t\t: 'wrap';\n\t\tconst verticalAlignment =\n\t\t\tverticalAlignmentMap[ layout.verticalAlignment ] ||\n\t\t\tverticalAlignmentMap.center;\n\t\tconst rowOrientation = `\n\t\tflex-direction: row;\n\t\talign-items: ${ verticalAlignment };\n\t\tjustify-content: ${ justifyContent };\n\t\t`;\n\t\tconst alignItems =\n\t\t\talignItemsMap[ layout.justifyContent ] || alignItemsMap.left;\n\t\tconst columnOrientation = `\n\t\tflex-direction: column;\n\t\talign-items: ${ alignItems };\n\t\t`;\n\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\tflex-wrap: ${ flexWrap };\n\t\t\t\t\tgap: ${ hasBlockGapStylesSupport ? blockGapValue : fallbackValue };\n\t\t\t\t\t${ orientation === 'horizontal' ? rowOrientation : columnOrientation }\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( layout ) {\n\t\tconst { orientation = 'horizontal' } = layout;\n\t\treturn orientation;\n\t},\n\tgetAlignments() {\n\t\treturn [];\n\t},\n};\n\nfunction FlexLayoutVerticalAlignmentControl( {\n\tlayout,\n\tonChange,\n\tisToolbar = false,\n} ) {\n\tconst { verticalAlignment = verticalAlignmentMap.center } = layout;\n\n\tconst onVerticalAlignmentChange = ( value ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tverticalAlignment: value,\n\t\t} );\n\t};\n\tif ( isToolbar ) {\n\t\treturn (\n\t\t\t<BlockVerticalAlignmentControl\n\t\t\t\tonChange={ onVerticalAlignmentChange }\n\t\t\t\tvalue={ verticalAlignment }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst verticalAlignmentOptions = [\n\t\t{\n\t\t\tvalue: 'flex-start',\n\t\t\tlabel: __( 'Align items top' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'center',\n\t\t\tlabel: __( 'Align items center' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'flex-end',\n\t\t\tlabel: __( 'Align items bottom' ),\n\t\t},\n\t];\n\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__flex-layout-vertical-alignment-control\">\n\t\t\t<legend>{ __( 'Vertical alignment' ) }</legend>\n\t\t\t<div>\n\t\t\t\t{ verticalAlignmentOptions.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={ verticalAlignment === value }\n\t\t\t\t\t\t\tonClick={ () => onVerticalAlignmentChange( 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\nfunction FlexLayoutJustifyContentControl( {\n\tlayout,\n\tonChange,\n\tisToolbar = false,\n} ) {\n\tconst { justifyContent = 'left', orientation = 'horizontal' } = layout;\n\tconst onJustificationChange = ( value ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tjustifyContent: value,\n\t\t} );\n\t};\n\tconst allowedControls = [ 'left', 'center', 'right' ];\n\tif ( orientation === 'horizontal' ) {\n\t\tallowedControls.push( 'space-between' );\n\t}\n\tif ( isToolbar ) {\n\t\treturn (\n\t\t\t<JustifyContentControl\n\t\t\t\tallowedControls={ allowedControls }\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\tconst justificationOptions = [\n\t\t{\n\t\t\tvalue: 'left',\n\t\t\ticon: justifyLeft,\n\t\t\tlabel: __( 'Justify items left' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'center',\n\t\t\ticon: justifyCenter,\n\t\t\tlabel: __( 'Justify items center' ),\n\t\t},\n\t\t{\n\t\t\tvalue: 'right',\n\t\t\ticon: justifyRight,\n\t\t\tlabel: __( 'Justify items right' ),\n\t\t},\n\t];\n\tif ( orientation === 'horizontal' ) {\n\t\tjustificationOptions.push( {\n\t\t\tvalue: 'space-between',\n\t\t\ticon: justifySpaceBetween,\n\t\t\tlabel: __( 'Space between items' ),\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\nfunction FlexWrapControl( { layout, onChange } ) {\n\tconst { flexWrap = 'wrap' } = layout;\n\treturn (\n\t\t<ToggleControl\n\t\t\tlabel={ __( 'Allow to wrap to multiple lines' ) }\n\t\t\tonChange={ ( value ) => {\n\t\t\t\tonChange( {\n\t\t\t\t\t...layout,\n\t\t\t\t\tflexWrap: value ? 'wrap' : 'nowrap',\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tchecked={ flexWrap === 'wrap' }\n\t\t/>\n\t);\n}\n\nfunction OrientationControl( { layout, onChange } ) {\n\tconst { orientation = 'horizontal' } = layout;\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__flex-layout-orientation-controls\">\n\t\t\t<legend>{ __( 'Orientation' ) }</legend>\n\t\t\t<Button\n\t\t\t\tlabel={ 'horizontal' }\n\t\t\t\ticon={ arrowRight }\n\t\t\t\tisPressed={ orientation === 'horizontal' }\n\t\t\t\tonClick={ () =>\n\t\t\t\t\tonChange( {\n\t\t\t\t\t\t...layout,\n\t\t\t\t\t\torientation: 'horizontal',\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\tlabel={ 'vertical' }\n\t\t\t\ticon={ arrowDown }\n\t\t\t\tisPressed={ orientation === 'vertical' }\n\t\t\t\tonClick={ () =>\n\t\t\t\t\tonChange( {\n\t\t\t\t\t\t...layout,\n\t\t\t\t\t\torientation: 'vertical',\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t/>\n\t\t</fieldset>\n\t);\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "8.5.5",
+	"version": "8.5.8",
 	"description": "Generic block editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -77,5 +77,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "b97f41a0716be45abd8bf897c7f135b86dc0760c"
+	"gitHead": "988fb5256118af4ed0546345c26a690ac9b7316b"
 }

package/src/components/iframe/index.js

@@ -10,7 +10,6 @@ import {
 	useState,
 	createPortal,
 	forwardRef,
-	useEffect,
 	useMemo,
 	useReducer,
 } from '@wordpress/element';
@@ -34,61 +33,66 @@ const BLOCK_PREFIX = 'wp-block';
  *
  * Ideally, this hook should be removed in the future and styles should be added
  * explicitly as editor styles.
- *
- * @param {Document} doc The document to append cloned stylesheets to.
  */
-function styleSheetsCompat( doc ) {
-	// Search the document for stylesheets targetting the editor canvas.
-	Array.from( document.styleSheets ).forEach( ( styleSheet ) => {
-		try {
-			// May fail for external styles.
-			// eslint-disable-next-line no-unused-expressions
-			styleSheet.cssRules;
-		} catch ( e ) {
-			return;
-		}
-
-		const { ownerNode, cssRules } = styleSheet;
-
-		if ( ! cssRules ) {
-			return;
-		}
+function useStylesCompatibility() {
+	return useRefEffect( ( node ) => {
+		// Search the document for stylesheets targetting the editor canvas.
+		Array.from( document.styleSheets ).forEach( ( styleSheet ) => {
+			try {
+				// May fail for external styles.
+				// eslint-disable-next-line no-unused-expressions
+				styleSheet.cssRules;
+			} catch ( e ) {
+				return;
+			}
 
-		// Generally, ignore inline styles. We add inline styles belonging to a
-		// stylesheet later, which may or may not match the selectors.
-		if ( ownerNode.tagName !== 'LINK' ) {
-			return;
-		}
+			const { ownerNode, cssRules } = styleSheet;
 
-		// Don't try to add the reset styles, which were removed as a dependency
-		// from `edit-blocks` for the iframe since we don't need to reset admin
-		// styles.
-		if ( ownerNode.id === 'wp-reset-editor-styles-css' ) {
-			return;
-		}
-
-		const isMatch = Array.from( cssRules ).find(
-			( { selectorText } ) =>
-				selectorText &&
-				( selectorText.includes( `.${ BODY_CLASS_NAME }` ) ||
-					selectorText.includes( `.${ BLOCK_PREFIX }` ) )
-		);
+			if ( ! cssRules ) {
+				return;
+			}
 
-		if ( isMatch && ! doc.getElementById( ownerNode.id ) ) {
-			// Display warning once we have a way to add style dependencies to the editor.
-			// See: https://github.com/WordPress/gutenberg/pull/37466.
+			// Generally, ignore inline styles. We add inline styles belonging to a
+			// stylesheet later, which may or may not match the selectors.
+			if ( ownerNode.tagName !== 'LINK' ) {
+				return;
+			}
 
-			doc.head.appendChild( ownerNode.cloneNode( true ) );
+			// Don't try to add the reset styles, which were removed as a dependency
+			// from `edit-blocks` for the iframe since we don't need to reset admin
+			// styles.
+			if ( ownerNode.id === 'wp-reset-editor-styles-css' ) {
+				return;
+			}
 
-			// Add inline styles belonging to the stylesheet.
-			const inlineCssId = ownerNode.id.replace( '-css', '-inline-css' );
-			const inlineCssElement = document.getElementById( inlineCssId );
+			const isMatch = Array.from( cssRules ).find(
+				( { selectorText } ) =>
+					selectorText &&
+					( selectorText.includes( `.${ BODY_CLASS_NAME }` ) ||
+						selectorText.includes( `.${ BLOCK_PREFIX }` ) )
+			);
 
-			if ( inlineCssElement ) {
-				doc.head.appendChild( inlineCssElement.cloneNode( true ) );
+			if (
+				isMatch &&
+				! node.ownerDocument.getElementById( ownerNode.id )
+			) {
+				// Display warning once we have a way to add style dependencies to the editor.
+				// See: https://github.com/WordPress/gutenberg/pull/37466.
+				node.appendChild( ownerNode.cloneNode( true ) );
+
+				// Add inline styles belonging to the stylesheet.
+				const inlineCssId = ownerNode.id.replace(
+					'-css',
+					'-inline-css'
+				);
+				const inlineCssElement = document.getElementById( inlineCssId );
+
+				if ( inlineCssElement ) {
+					node.appendChild( inlineCssElement.cloneNode( true ) );
+				}
 			}
-		}
-	} );
+		} );
+	}, [] );
 }
 
 /**
@@ -222,12 +226,7 @@ function Iframe(
 			} );
 	}, [] );
 	const bodyRef = useMergeRefs( [ contentRef, clearerRef, writingFlowRef ] );
-
-	useEffect( () => {
-		if ( iframeDocument ) {
-			styleSheetsCompat( iframeDocument );
-		}
-	}, [ iframeDocument ] );
+	const styleCompatibilityRef = useStylesCompatibility();
 
 	head = (
 		<>
@@ -275,6 +274,15 @@ function Iframe(
 									...bodyClasses
 								) }
 							>
+								{ /*
+								 * This is a wrapper for the extra styles and scripts
+								 * rendered imperatively by cloning the parent,
+								 * it's important that this div's content remains uncontrolled.
+								 */ }
+								<div
+									style={ { display: 'none' } }
+									ref={ styleCompatibilityRef }
+								/>
 								<StyleProvider document={ iframeDocument }>
 									{ children }
 								</StyleProvider>

package/src/components/media-placeholder/index.js

@@ -73,7 +73,6 @@ export function MediaPlaceholder( {
 	onDoubleClick,
 	onFilesPreUpload = noop,
 	onHTMLDrop = noop,
-	onClose = noop,
 	children,
 	mediaLibraryButton,
 	placeholder,
@@ -327,7 +326,6 @@ export function MediaPlaceholder( {
 				gallery={ multiple && onlyAllowsImages() }
 				multiple={ multiple }
 				onSelect={ onSelect }
-				onClose={ onClose }
 				allowedTypes={ allowedTypes }
 				value={
 					Array.isArray( value )

package/src/components/media-replace-flow/index.js

@@ -42,7 +42,6 @@ const MediaReplaceFlow = ( {
 	onSelect,
 	onSelectURL,
 	onFilesUpload = noop,
-	onCloseModal = noop,
 	name = __( 'Replace' ),
 	createNotice,
 	removeNotice,
@@ -158,7 +157,6 @@ const MediaReplaceFlow = ( {
 								selectMedia( media, onClose )
 							}
 							allowedTypes={ allowedTypes }
-							onClose={ onCloseModal }
 							render={ ( { open } ) => (
 								<MenuItem icon={ mediaIcon } onClick={ open }>
 									{ __( 'Open Media Library' ) }

package/src/components/warning/index.js

@@ -13,50 +13,55 @@ import { moreHorizontal } from '@wordpress/icons';
 
 function Warning( { className, actions, children, secondaryActions } ) {
 	return (
-		<div className={ classnames( className, 'block-editor-warning' ) }>
-			<div className="block-editor-warning__contents">
-				<p className="block-editor-warning__message">{ children }</p>
+		<div style={ { display: 'contents', all: 'initial' } }>
+			<div className={ classnames( className, 'block-editor-warning' ) }>
+				<div className="block-editor-warning__contents">
+					<p className="block-editor-warning__message">
+						{ children }
+					</p>
 
-				{ ( Children.count( actions ) > 0 || secondaryActions ) && (
-					<div className="block-editor-warning__actions">
-						{ Children.count( actions ) > 0 &&
-							Children.map( actions, ( action, i ) => (
-								<span
-									key={ i }
-									className="block-editor-warning__action"
+					{ ( Children.count( actions ) > 0 || secondaryActions ) && (
+						<div className="block-editor-warning__actions">
+							{ Children.count( actions ) > 0 &&
+								Children.map( actions, ( action, i ) => (
+									<span
+										key={ i }
+										className="block-editor-warning__action"
+									>
+										{ action }
+									</span>
+								) ) }
+							{ secondaryActions && (
+								<DropdownMenu
+									className="block-editor-warning__secondary"
+									icon={ moreHorizontal }
+									label={ __( 'More options' ) }
+									popoverProps={ {
+										position: 'bottom left',
+										className:
+											'block-editor-warning__dropdown',
+									} }
+									noIcons
 								>
-									{ action }
-								</span>
-							) ) }
-						{ secondaryActions && (
-							<DropdownMenu
-								className="block-editor-warning__secondary"
-								icon={ moreHorizontal }
-								label={ __( 'More options' ) }
-								popoverProps={ {
-									position: 'bottom left',
-									className: 'block-editor-warning__dropdown',
-								} }
-								noIcons
-							>
-								{ () => (
-									<MenuGroup>
-										{ secondaryActions.map(
-											( item, pos ) => (
-												<MenuItem
-													onClick={ item.onClick }
-													key={ pos }
-												>
-													{ item.title }
-												</MenuItem>
-											)
-										) }
-									</MenuGroup>
-								) }
-							</DropdownMenu>
-						) }
-					</div>
-				) }
+									{ () => (
+										<MenuGroup>
+											{ secondaryActions.map(
+												( item, pos ) => (
+													<MenuItem
+														onClick={ item.onClick }
+														key={ pos }
+													>
+														{ item.title }
+													</MenuItem>
+												)
+											) }
+										</MenuGroup>
+									) }
+								</DropdownMenu>
+							) }
+						</div>
+					) }
+				</div>
 			</div>
 		</div>
 	);

package/src/components/warning/test/__snapshots__/index.js.snap

@@ -2,16 +2,25 @@
 
 exports[`Warning should match snapshot 1`] = `
 <div
-  className="block-editor-warning"
+  style={
+    Object {
+      "all": "initial",
+      "display": "contents",
+    }
+  }
 >
   <div
-    className="block-editor-warning__contents"
+    className="block-editor-warning"
   >
-    <p
-      className="block-editor-warning__message"
+    <div
+      className="block-editor-warning__contents"
     >
-      error
-    </p>
+      <p
+        className="block-editor-warning__message"
+      >
+        error
+      </p>
+    </div>
   </div>
 </div>
 `;

package/src/components/warning/test/index.js

@@ -18,7 +18,7 @@ describe( 'Warning', () => {
 	it( 'should have valid class', () => {
 		const wrapper = shallow( <Warning /> );
 
-		expect( wrapper.hasClass( 'block-editor-warning' ) ).toBe( true );
+		expect( wrapper.find( '.block-editor-warning' ) ).toHaveLength( 1 );
 		expect( wrapper.find( '.block-editor-warning__actions' ) ).toHaveLength(
 			0
 		);

package/src/hooks/dimensions.js

@@ -147,7 +147,7 @@ const useIsDimensionsDisabled = ( props = {} ) => {
 };
 
 /**
- * Custom hook to retrieve which padding/margin is supported
+ * Custom hook to retrieve which padding/margin/blockGap is supported
  * e.g. top, right, bottom or left.
  *
  * Sides are opted into by default. It is only if a specific side is set to
@@ -156,7 +156,7 @@ const useIsDimensionsDisabled = ( props = {} ) => {
  * @param {string} blockName Block name.
  * @param {string} feature   The feature custom sides relate to e.g. padding or margins.
  *
- * @return {Object} Sides supporting custom margin.
+ * @return {?string[]} Strings representing the custom sides available.
  */
 export function useCustomSides( blockName, feature ) {
 	const support = getBlockSupport( blockName, SPACING_SUPPORT_KEY );
@@ -166,7 +166,15 @@ export function useCustomSides( blockName, feature ) {
 		return;
 	}
 
-	return support[ feature ];
+	// Return if the setting is an array of sides (e.g. `[ 'top', 'bottom' ]`).
+	if ( Array.isArray( support[ feature ] ) ) {
+		return support[ feature ];
+	}
+
+	// Finally, attempt to return `.sides` if the setting is an object.
+	if ( support[ feature ]?.sides ) {
+		return support[ feature ].sides;
+	}
 }
 
 /**

package/src/layouts/flex.js

@@ -11,6 +11,7 @@ import {
 	arrowDown,
 } from '@wordpress/icons';
 import { Button, ToggleControl, Flex, FlexItem } from '@wordpress/components';
+import { getBlockSupport } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -109,14 +110,21 @@ export default {
 	save: function FlexLayoutStyle( { selector, layout, style, blockName } ) {
 		const { orientation = 'horizontal' } = layout;
 		const blockGapSupport = useSetting( 'spacing.blockGap' );
+		const fallbackValue =
+			getBlockSupport( blockName, [
+				'spacing',
+				'blockGap',
+				'__experimentalDefault',
+			] ) || '0.5em';
+
 		const hasBlockGapStylesSupport = blockGapSupport !== null;
 		// If a block's block.json skips serialization for spacing or spacing.blockGap,
 		// don't apply the user-defined value to the styles.
 		const blockGapValue =
 			style?.spacing?.blockGap &&
 			! shouldSkipSerialization( blockName, 'spacing', 'blockGap' )
-				? getGapCSSValue( style?.spacing?.blockGap, '0.5em' )
-				: 'var( --wp--style--block-gap, 0.5em )';
+				? getGapCSSValue( style?.spacing?.blockGap, fallbackValue )
+				: `var( --wp--style--block-gap, ${ fallbackValue } )`;
 		const justifyContent =
 			justifyContentMap[ layout.justifyContent ] ||
 			justifyContentMap.left;
@@ -143,7 +151,7 @@ export default {
 				${ appendSelectors( selector ) } {
 					display: flex;
 					flex-wrap: ${ flexWrap };
-					gap: ${ hasBlockGapStylesSupport ? blockGapValue : '0.5em' };
+					gap: ${ hasBlockGapStylesSupport ? blockGapValue : fallbackValue };
 					${ orientation === 'horizontal' ? rowOrientation : columnOrientation }
 				}