@wordpress/block-editor 12.7.0 → 12.8.1

package/build/components/global-styles/color-panel.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/global-styles/color-panel.native.js"],"names":["ColorPanel","value","inheritedValue","onChange","settings","colors","gradients","globalStyles","detectedBackgroundColor","setDetectedBackgroundColor","detectedTextColor","setDetectedTextColor","baseGlobalStyles","select","getSettings","blockEditorStore","__experimentalGlobalStylesBaseStyles","color","decodeValue","rawValue","encodeColorValue","colorValue","allColors","flatMap","originColors","colorObject","find","slug","encodeGradientValue","gradientValue","allGradients","originGradients","gradientObject","gradient","showTextPanel","textColor","text","setTextColor","newColor","resetTextColor","undefined","showBackgroundPanel","backgroundColor","background","setBackgroundColor","newValue","setGradient","newGradient","resetBackground","currentGradients","withoutGradientsSupport","Array","isArray","length","items","label","onColorChange","onColorCleared","onGradientChange","filter","Boolean","currentDetectedTextColor","currentDetectedBackgroundColor"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useEffect, useState, useMemo, useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useGlobalStyles } from '@wordpress/components';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport PanelColorGradientSettings from '../colors-gradients/panel-color-gradient-settings';\nimport { useColorsPerOrigin, useGradientsPerOrigin } from './hooks';\nimport { getValueFromVariable } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport ContrastChecker from '../contrast-checker';\nimport InspectorControls from '../inspector-controls';\nimport {\n\tuseHasColorPanel,\n\tuseHasTextPanel,\n\tuseHasBackgroundPanel,\n} from './color-panel.js';\n\nconst ColorPanel = ( {\n\tvalue,\n\tinheritedValue = value,\n\tonChange,\n\tsettings,\n} ) => {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\tconst globalStyles = useGlobalStyles();\n\n\tconst [ detectedBackgroundColor, setDetectedBackgroundColor ] = useState();\n\tconst [ detectedTextColor, setDetectedTextColor ] = useState();\n\n\tconst { baseGlobalStyles } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\treturn {\n\t\t\tbaseGlobalStyles:\n\t\t\t\tgetSettings()?.__experimentalGlobalStylesBaseStyles?.color,\n\t\t};\n\t} );\n\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\tconst encodeColorValue = useCallback(\n\t\t( colorValue ) => {\n\t\t\tconst allColors = colors.flatMap(\n\t\t\t\t( { colors: originColors } ) => originColors\n\t\t\t);\n\t\t\tconst colorObject = allColors.find(\n\t\t\t\t( { color } ) => color === colorValue\n\t\t\t);\n\t\t\treturn colorObject\n\t\t\t\t? 'var:preset|color|' + colorObject.slug\n\t\t\t\t: colorValue;\n\t\t},\n\t\t[ colors ]\n\t);\n\tconst encodeGradientValue = useCallback(\n\t\t( gradientValue ) => {\n\t\t\tconst allGradients = gradients.flatMap(\n\t\t\t\t( { gradients: originGradients } ) => originGradients\n\t\t\t);\n\t\t\tconst gradientObject = allGradients.find(\n\t\t\t\t( { gradient } ) => gradient === gradientValue\n\t\t\t);\n\t\t\treturn gradientObject\n\t\t\t\t? 'var:preset|gradient|' + gradientObject.slug\n\t\t\t\t: gradientValue;\n\t\t},\n\t\t[ gradients ]\n\t);\n\n\t// Text Color\n\tconst showTextPanel = useHasTextPanel( settings );\n\tconst textColor = decodeValue( inheritedValue?.color?.text );\n\tconst setTextColor = useCallback(\n\t\t( newColor ) => {\n\t\t\tonChange(\n\t\t\t\tsetImmutably(\n\t\t\t\t\tvalue,\n\t\t\t\t\t[ 'color', 'text' ],\n\t\t\t\t\tencodeColorValue( newColor )\n\t\t\t\t)\n\t\t\t);\n\t\t},\n\t\t[ encodeColorValue, onChange, value ]\n\t);\n\tconst resetTextColor = useCallback(\n\t\t() => setTextColor( undefined ),\n\t\t[ setTextColor ]\n\t);\n\n\t// BackgroundColor\n\tconst showBackgroundPanel = useHasBackgroundPanel( settings );\n\tconst backgroundColor = decodeValue( inheritedValue?.color?.background );\n\tconst gradient = decodeValue( inheritedValue?.color?.gradient );\n\tconst setBackgroundColor = useCallback(\n\t\t( newColor ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'color', 'background' ],\n\t\t\t\tencodeColorValue( newColor )\n\t\t\t);\n\t\t\tnewValue.color.gradient = undefined;\n\t\t\tonChange( newValue );\n\t\t},\n\t\t[ encodeColorValue, onChange, value ]\n\t);\n\tconst setGradient = useCallback(\n\t\t( newGradient ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'color', 'gradient' ],\n\t\t\t\tencodeGradientValue( newGradient )\n\t\t\t);\n\t\t\tnewValue.color.background = undefined;\n\t\t\tonChange( newValue );\n\t\t},\n\t\t[ encodeGradientValue, onChange, value ]\n\t);\n\tconst resetBackground = useCallback( () => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'background' ],\n\t\t\tundefined\n\t\t);\n\t\tnewValue.color.gradient = undefined;\n\t\tonChange( newValue );\n\t}, [ onChange, value ] );\n\tconst currentGradients = settings?.color?.gradients;\n\tconst withoutGradientsSupport =\n\t\tArray.isArray( currentGradients ) && currentGradients.length === 0;\n\n\tconst items = useMemo(\n\t\t() =>\n\t\t\t[\n\t\t\t\tshowTextPanel && {\n\t\t\t\t\tlabel: __( 'Text' ),\n\t\t\t\t\tcolorValue: textColor,\n\t\t\t\t\tonColorChange: setTextColor,\n\t\t\t\t\tonColorCleared: resetTextColor,\n\t\t\t\t},\n\t\t\t\tshowBackgroundPanel && {\n\t\t\t\t\tlabel: __( 'Background' ),\n\t\t\t\t\tcolorValue: backgroundColor,\n\t\t\t\t\tonColorChange: setBackgroundColor,\n\t\t\t\t\tonColorCleared: resetBackground,\n\t\t\t\t\tonGradientChange: ! withoutGradientsSupport\n\t\t\t\t\t\t? setGradient\n\t\t\t\t\t\t: undefined,\n\t\t\t\t\tgradientValue: gradient,\n\t\t\t\t},\n\t\t\t].filter( Boolean ),\n\t\t[\n\t\t\tbackgroundColor,\n\t\t\tgradient,\n\t\t\tresetBackground,\n\t\t\tresetTextColor,\n\t\t\tsetBackgroundColor,\n\t\t\tsetGradient,\n\t\t\tsetTextColor,\n\t\t\tshowBackgroundPanel,\n\t\t\tshowTextPanel,\n\t\t\ttextColor,\n\t\t\twithoutGradientsSupport,\n\t\t]\n\t);\n\n\tuseEffect( () => {\n\t\t// The following logic is used to determine current text/background colors:\n\t\t// 1. The globalStyles object is queried to determine whether a color has been\n\t\t// set via a block's settings.\n\t\t// 2. If a block-based theme is in use and no globalStyles exist, the theme's\n\t\t// default/base colors are used.\n\t\t// 3. If no globalStyles exist and a theme isn't block-based, there is no way\n\t\t// to determine the default text/background color and the checker won't run.\n\t\tconst currentDetectedTextColor =\n\t\t\tglobalStyles?.color || baseGlobalStyles?.text;\n\t\tconst currentDetectedBackgroundColor =\n\t\t\tglobalStyles?.backgroundColor || baseGlobalStyles?.background;\n\n\t\tsetDetectedTextColor( currentDetectedTextColor );\n\t\tsetDetectedBackgroundColor( currentDetectedBackgroundColor );\n\t}, [ globalStyles, baseGlobalStyles ] );\n\n\treturn (\n\t\t<InspectorControls>\n\t\t\t<PanelColorGradientSettings\n\t\t\t\ttitle={ __( 'Color' ) }\n\t\t\t\tinitialOpen={ false }\n\t\t\t\tsettings={ items }\n\t\t\t>\n\t\t\t\t<ContrastChecker\n\t\t\t\t\tbackgroundColor={ detectedBackgroundColor }\n\t\t\t\t\ttextColor={ detectedTextColor }\n\t\t\t\t/>\n\t\t\t</PanelColorGradientSettings>\n\t\t</InspectorControls>\n\t);\n};\n\nexport { useHasColorPanel };\nexport default ColorPanel;\n"]}
+{"version":3,"names":["_element","require","_data","_i18n","_components","_blockEditor","_panelColorGradientSettings","_interopRequireDefault","_hooks","_utils","_object","_contrastChecker","_inspectorControls","_colorPanel","ColorPanel","value","inheritedValue","onChange","settings","colors","useColorsPerOrigin","gradients","useGradientsPerOrigin","globalStyles","useGlobalStyles","detectedBackgroundColor","setDetectedBackgroundColor","useState","detectedTextColor","setDetectedTextColor","baseGlobalStyles","useSelect","select","getSettings","blockEditorStore","__experimentalGlobalStylesBaseStyles","color","decodeValue","rawValue","getValueFromVariable","encodeColorValue","useCallback","colorValue","allColors","flatMap","originColors","colorObject","find","slug","encodeGradientValue","gradientValue","allGradients","originGradients","gradientObject","gradient","showTextPanel","useHasTextPanel","textColor","text","setTextColor","newColor","setImmutably","resetTextColor","undefined","showBackgroundPanel","useHasBackgroundPanel","backgroundColor","background","setBackgroundColor","newValue","setGradient","newGradient","resetBackground","currentGradients","withoutGradientsSupport","Array","isArray","length","items","useMemo","label","__","onColorChange","onColorCleared","onGradientChange","filter","Boolean","useEffect","currentDetectedTextColor","currentDetectedBackgroundColor","createElement","default","title","initialOpen","_default","exports"],"sources":["@wordpress/block-editor/src/components/global-styles/color-panel.native.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useEffect, useState, useMemo, useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useGlobalStyles } from '@wordpress/components';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport PanelColorGradientSettings from '../colors-gradients/panel-color-gradient-settings';\nimport { useColorsPerOrigin, useGradientsPerOrigin } from './hooks';\nimport { getValueFromVariable } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport ContrastChecker from '../contrast-checker';\nimport InspectorControls from '../inspector-controls';\nimport {\n\tuseHasColorPanel,\n\tuseHasTextPanel,\n\tuseHasBackgroundPanel,\n} from './color-panel.js';\n\nconst ColorPanel = ( {\n\tvalue,\n\tinheritedValue = value,\n\tonChange,\n\tsettings,\n} ) => {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\tconst globalStyles = useGlobalStyles();\n\n\tconst [ detectedBackgroundColor, setDetectedBackgroundColor ] = useState();\n\tconst [ detectedTextColor, setDetectedTextColor ] = useState();\n\n\tconst { baseGlobalStyles } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\treturn {\n\t\t\tbaseGlobalStyles:\n\t\t\t\tgetSettings()?.__experimentalGlobalStylesBaseStyles?.color,\n\t\t};\n\t} );\n\n\tconst decodeValue = ( rawValue ) =>\n\t\tgetValueFromVariable( { settings }, '', rawValue );\n\tconst encodeColorValue = useCallback(\n\t\t( colorValue ) => {\n\t\t\tconst allColors = colors.flatMap(\n\t\t\t\t( { colors: originColors } ) => originColors\n\t\t\t);\n\t\t\tconst colorObject = allColors.find(\n\t\t\t\t( { color } ) => color === colorValue\n\t\t\t);\n\t\t\treturn colorObject\n\t\t\t\t? 'var:preset|color|' + colorObject.slug\n\t\t\t\t: colorValue;\n\t\t},\n\t\t[ colors ]\n\t);\n\tconst encodeGradientValue = useCallback(\n\t\t( gradientValue ) => {\n\t\t\tconst allGradients = gradients.flatMap(\n\t\t\t\t( { gradients: originGradients } ) => originGradients\n\t\t\t);\n\t\t\tconst gradientObject = allGradients.find(\n\t\t\t\t( { gradient } ) => gradient === gradientValue\n\t\t\t);\n\t\t\treturn gradientObject\n\t\t\t\t? 'var:preset|gradient|' + gradientObject.slug\n\t\t\t\t: gradientValue;\n\t\t},\n\t\t[ gradients ]\n\t);\n\n\t// Text Color\n\tconst showTextPanel = useHasTextPanel( settings );\n\tconst textColor = decodeValue( inheritedValue?.color?.text );\n\tconst setTextColor = useCallback(\n\t\t( newColor ) => {\n\t\t\tonChange(\n\t\t\t\tsetImmutably(\n\t\t\t\t\tvalue,\n\t\t\t\t\t[ 'color', 'text' ],\n\t\t\t\t\tencodeColorValue( newColor )\n\t\t\t\t)\n\t\t\t);\n\t\t},\n\t\t[ encodeColorValue, onChange, value ]\n\t);\n\tconst resetTextColor = useCallback(\n\t\t() => setTextColor( undefined ),\n\t\t[ setTextColor ]\n\t);\n\n\t// BackgroundColor\n\tconst showBackgroundPanel = useHasBackgroundPanel( settings );\n\tconst backgroundColor = decodeValue( inheritedValue?.color?.background );\n\tconst gradient = decodeValue( inheritedValue?.color?.gradient );\n\tconst setBackgroundColor = useCallback(\n\t\t( newColor ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'color', 'background' ],\n\t\t\t\tencodeColorValue( newColor )\n\t\t\t);\n\t\t\tnewValue.color.gradient = undefined;\n\t\t\tonChange( newValue );\n\t\t},\n\t\t[ encodeColorValue, onChange, value ]\n\t);\n\tconst setGradient = useCallback(\n\t\t( newGradient ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'color', 'gradient' ],\n\t\t\t\tencodeGradientValue( newGradient )\n\t\t\t);\n\t\t\tnewValue.color.background = undefined;\n\t\t\tonChange( newValue );\n\t\t},\n\t\t[ encodeGradientValue, onChange, value ]\n\t);\n\tconst resetBackground = useCallback( () => {\n\t\tconst newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'color', 'background' ],\n\t\t\tundefined\n\t\t);\n\t\tnewValue.color.gradient = undefined;\n\t\tonChange( newValue );\n\t}, [ onChange, value ] );\n\tconst currentGradients = settings?.color?.gradients;\n\tconst withoutGradientsSupport =\n\t\tArray.isArray( currentGradients ) && currentGradients.length === 0;\n\n\tconst items = useMemo(\n\t\t() =>\n\t\t\t[\n\t\t\t\tshowTextPanel && {\n\t\t\t\t\tlabel: __( 'Text' ),\n\t\t\t\t\tcolorValue: textColor,\n\t\t\t\t\tonColorChange: setTextColor,\n\t\t\t\t\tonColorCleared: resetTextColor,\n\t\t\t\t},\n\t\t\t\tshowBackgroundPanel && {\n\t\t\t\t\tlabel: __( 'Background' ),\n\t\t\t\t\tcolorValue: backgroundColor,\n\t\t\t\t\tonColorChange: setBackgroundColor,\n\t\t\t\t\tonColorCleared: resetBackground,\n\t\t\t\t\tonGradientChange: ! withoutGradientsSupport\n\t\t\t\t\t\t? setGradient\n\t\t\t\t\t\t: undefined,\n\t\t\t\t\tgradientValue: gradient,\n\t\t\t\t},\n\t\t\t].filter( Boolean ),\n\t\t[\n\t\t\tbackgroundColor,\n\t\t\tgradient,\n\t\t\tresetBackground,\n\t\t\tresetTextColor,\n\t\t\tsetBackgroundColor,\n\t\t\tsetGradient,\n\t\t\tsetTextColor,\n\t\t\tshowBackgroundPanel,\n\t\t\tshowTextPanel,\n\t\t\ttextColor,\n\t\t\twithoutGradientsSupport,\n\t\t]\n\t);\n\n\tuseEffect( () => {\n\t\t// The following logic is used to determine current text/background colors:\n\t\t// 1. The globalStyles object is queried to determine whether a color has been\n\t\t// set via a block's settings.\n\t\t// 2. If a block-based theme is in use and no globalStyles exist, the theme's\n\t\t// default/base colors are used.\n\t\t// 3. If no globalStyles exist and a theme isn't block-based, there is no way\n\t\t// to determine the default text/background color and the checker won't run.\n\t\tconst currentDetectedTextColor =\n\t\t\tglobalStyles?.color || baseGlobalStyles?.text;\n\t\tconst currentDetectedBackgroundColor =\n\t\t\tglobalStyles?.backgroundColor || baseGlobalStyles?.background;\n\n\t\tsetDetectedTextColor( currentDetectedTextColor );\n\t\tsetDetectedBackgroundColor( currentDetectedBackgroundColor );\n\t}, [ globalStyles, baseGlobalStyles ] );\n\n\treturn (\n\t\t<InspectorControls>\n\t\t\t<PanelColorGradientSettings\n\t\t\t\ttitle={ __( 'Color' ) }\n\t\t\t\tinitialOpen={ false }\n\t\t\t\tsettings={ items }\n\t\t\t>\n\t\t\t\t<ContrastChecker\n\t\t\t\t\tbackgroundColor={ detectedBackgroundColor }\n\t\t\t\t\ttextColor={ detectedTextColor }\n\t\t\t\t/>\n\t\t\t</PanelColorGradientSettings>\n\t\t</InspectorControls>\n\t);\n};\n\nexport { useHasColorPanel };\nexport default ColorPanel;\n"],"mappings":"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"}

package/build/components/global-styles/context.js

@@ -4,12 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.GlobalStylesContext = exports.DEFAULT_GLOBAL_STYLES_CONTEXT = void 0;
-
 var _element = require("@wordpress/element");
-
 /**
  * WordPress dependencies
  */
+
 const DEFAULT_GLOBAL_STYLES_CONTEXT = {
   user: {},
   base: {},

package/build/components/global-styles/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/global-styles/context.js"],"names":["DEFAULT_GLOBAL_STYLES_CONTEXT","user","base","merged","setUserConfig","GlobalStylesContext"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAGO,MAAMA,6BAA6B,GAAG;AAC5CC,EAAAA,IAAI,EAAE,EADsC;AAE5CC,EAAAA,IAAI,EAAE,EAFsC;AAG5CC,EAAAA,MAAM,EAAE,EAHoC;AAI5CC,EAAAA,aAAa,EAAE,MAAM,CAAE;AAJqB,CAAtC;;AAOA,MAAMC,mBAAmB,GAAG,4BAClCL,6BADkC,CAA5B","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const DEFAULT_GLOBAL_STYLES_CONTEXT = {\n\tuser: {},\n\tbase: {},\n\tmerged: {},\n\tsetUserConfig: () => {},\n};\n\nexport const GlobalStylesContext = createContext(\n\tDEFAULT_GLOBAL_STYLES_CONTEXT\n);\n"]}
+{"version":3,"names":["_element","require","DEFAULT_GLOBAL_STYLES_CONTEXT","user","base","merged","setUserConfig","exports","GlobalStylesContext","createContext"],"sources":["@wordpress/block-editor/src/components/global-styles/context.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const DEFAULT_GLOBAL_STYLES_CONTEXT = {\n\tuser: {},\n\tbase: {},\n\tmerged: {},\n\tsetUserConfig: () => {},\n};\n\nexport const GlobalStylesContext = createContext(\n\tDEFAULT_GLOBAL_STYLES_CONTEXT\n);\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGO,MAAMC,6BAA6B,GAAG;EAC5CC,IAAI,EAAE,CAAC,CAAC;EACRC,IAAI,EAAE,CAAC,CAAC;EACRC,MAAM,EAAE,CAAC,CAAC;EACVC,aAAa,EAAEA,CAAA,KAAM,CAAC;AACvB,CAAC;AAACC,OAAA,CAAAL,6BAAA,GAAAA,6BAAA;AAEK,MAAMM,mBAAmB,GAAG,IAAAC,sBAAa,EAC/CP,6BACD,CAAC;AAACK,OAAA,CAAAC,mBAAA,GAAAA,mBAAA"}

package/build/components/global-styles/dimensions-panel.js

@@ -1,35 +1,22 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = DimensionsPanel;
 exports.useHasDimensionsPanel = useHasDimensionsPanel;
-
 var _element = require("@wordpress/element");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _i18n = require("@wordpress/i18n");
-
 var _components = require("@wordpress/components");
-
 var _icons = require("@wordpress/icons");
-
 var _utils = require("./utils");
-
 var _spacingSizesControl = _interopRequireDefault(require("../spacing-sizes-control"));
-
 var _heightControl = _interopRequireDefault(require("../height-control"));
-
 var _childLayoutControl = _interopRequireDefault(require("../child-layout-control"));
-
 var _utils2 = require("../../hooks/utils");
-
 var _object = require("../../utils/object");
-
 /**
  * External dependencies
  */
@@ -41,8 +28,8 @@ var _object = require("../../utils/object");
 /**
  * Internal dependencies
  */
-const AXIAL_SIDES = ['horizontal', 'vertical'];
 
+const AXIAL_SIDES = ['horizontal', 'vertical'];
 function useHasDimensionsPanel(settings) {
   const hasContentSize = useHasContentSize(settings);
   const hasWideSize = useHasWideSize(settings);
@@ -53,34 +40,26 @@ function useHasDimensionsPanel(settings) {
   const hasChildLayout = useHasChildLayout(settings);
   return _element.Platform.OS === 'web' && (hasContentSize || hasWideSize || hasPadding || hasMargin || hasGap || hasMinHeight || hasChildLayout);
 }
-
 function useHasContentSize(settings) {
   return settings?.layout?.contentSize;
 }
-
 function useHasWideSize(settings) {
   return settings?.layout?.wideSize;
 }
-
 function useHasPadding(settings) {
   return settings?.spacing?.padding;
 }
-
 function useHasMargin(settings) {
   return settings?.spacing?.margin;
 }
-
 function useHasGap(settings) {
   return settings?.spacing?.blockGap;
 }
-
 function useHasMinHeight(settings) {
   return settings?.dimensions?.minHeight;
 }
-
 function useHasChildLayout(settings) {
   var _settings$parentLayou;
-
   const {
     type: parentLayoutType = 'default',
     default: {
@@ -91,10 +70,8 @@ function useHasChildLayout(settings) {
   const support = (defaultParentLayoutType === 'flex' || parentLayoutType === 'flex') && allowSizingOnChildren;
   return !!settings?.layout && support;
 }
-
 function useHasSpacingPresets(settings) {
   var _ref, _ref2;
-
   const {
     custom,
     theme,
@@ -103,32 +80,28 @@ function useHasSpacingPresets(settings) {
   const presets = (_ref = (_ref2 = custom !== null && custom !== void 0 ? custom : theme) !== null && _ref2 !== void 0 ? _ref2 : defaultPresets) !== null && _ref !== void 0 ? _ref : [];
   return presets.length > 0;
 }
-
 function filterValuesBySides(values, sides) {
   // If no custom side configuration, all sides are opted into by default.
   // Without any values, we have nothing to filter either.
   if (!sides || !values) {
     return values;
-  } // Only include sides opted into within filtered values.
-
+  }
 
+  // Only include sides opted into within filtered values.
   const filteredValues = {};
   sides.forEach(side => {
     if (side === 'vertical') {
       filteredValues.top = values.top;
       filteredValues.bottom = values.bottom;
     }
-
     if (side === 'horizontal') {
       filteredValues.left = values.left;
       filteredValues.right = values.right;
     }
-
     filteredValues[side] = values?.[side];
   });
   return filteredValues;
 }
-
 function splitStyleValue(value) {
   // Check for shorthand value (a string value).
   if (value && typeof value === 'string') {
@@ -140,10 +113,8 @@ function splitStyleValue(value) {
       left: value
     };
   }
-
   return value;
 }
-
 function splitGapValue(value) {
   // Check for shorthand value (a string value).
   if (value && typeof value === 'string') {
@@ -152,17 +123,15 @@ function splitGapValue(value) {
       top: value
     };
   }
-
   if (value) {
-    return { ...value,
+    return {
+      ...value,
       right: value?.left,
       bottom: value?.top
     };
   }
-
   return value;
 }
-
 function DimensionsToolsPanel({
   resetAllFilter,
   onChange,
@@ -174,14 +143,12 @@ function DimensionsToolsPanel({
     const updatedValue = resetAllFilter(value);
     onChange(updatedValue);
   };
-
   return (0, _element.createElement)(_components.__experimentalToolsPanel, {
     label: (0, _i18n.__)('Dimensions'),
     resetAll: resetAll,
     panelId: panelId
   }, children);
 }
-
 const DEFAULT_CONTROLS = {
   contentSize: true,
   wideSize: true,
@@ -191,7 +158,6 @@ const DEFAULT_CONTROLS = {
   minHeight: true,
   childLayout: true
 };
-
 function DimensionsPanel({
   as: Wrapper = DimensionsToolsPanel,
   value,
@@ -206,12 +172,10 @@ function DimensionsPanel({
   includeLayoutControls = false
 }) {
   var _settings$parentLayou2, _defaultControls$cont, _defaultControls$wide, _defaultControls$padd, _defaultControls$marg, _defaultControls$bloc, _defaultControls$minH, _defaultControls$chil;
-
   const {
     dimensions,
     spacing
   } = settings;
-
   const decodeValue = rawValue => {
     if (rawValue && typeof rawValue === 'object') {
       return Object.keys(rawValue).reduce((acc, key) => {
@@ -224,7 +188,6 @@ function DimensionsPanel({
         return acc;
       }, {});
     }
-
     return (0, _utils.getValueFromVariable)({
       settings: {
         dimensions,
@@ -232,88 +195,71 @@ function DimensionsPanel({
       }
     }, '', rawValue);
   };
-
   const showSpacingPresetsControl = useHasSpacingPresets(settings);
   const units = (0, _components.__experimentalUseCustomUnits)({
     availableUnits: settings?.spacing?.units || ['%', 'px', 'em', 'rem', 'vw']
-  }); // Content Size
+  });
 
+  // Content Size
   const showContentSizeControl = useHasContentSize(settings) && includeLayoutControls;
   const contentSizeValue = decodeValue(inheritedValue?.layout?.contentSize);
-
   const setContentSizeValue = newValue => {
     onChange((0, _object.setImmutably)(value, ['layout', 'contentSize'], newValue || undefined));
   };
-
   const hasUserSetContentSizeValue = () => !!value?.layout?.contentSize;
+  const resetContentSizeValue = () => setContentSizeValue(undefined);
 
-  const resetContentSizeValue = () => setContentSizeValue(undefined); // Wide Size
-
-
+  // Wide Size
   const showWideSizeControl = useHasWideSize(settings) && includeLayoutControls;
   const wideSizeValue = decodeValue(inheritedValue?.layout?.wideSize);
-
   const setWideSizeValue = newValue => {
     onChange((0, _object.setImmutably)(value, ['layout', 'wideSize'], newValue || undefined));
   };
-
   const hasUserSetWideSizeValue = () => !!value?.layout?.wideSize;
+  const resetWideSizeValue = () => setWideSizeValue(undefined);
 
-  const resetWideSizeValue = () => setWideSizeValue(undefined); // Padding
-
-
+  // Padding
   const showPaddingControl = useHasPadding(settings);
   const rawPadding = decodeValue(inheritedValue?.spacing?.padding);
   const paddingValues = splitStyleValue(rawPadding);
   const paddingSides = Array.isArray(settings?.spacing?.padding) ? settings?.spacing?.padding : settings?.spacing?.padding?.sides;
   const isAxialPadding = paddingSides && paddingSides.some(side => AXIAL_SIDES.includes(side));
-
   const setPaddingValues = newPaddingValues => {
     const padding = filterValuesBySides(newPaddingValues, paddingSides);
     onChange((0, _object.setImmutably)(value, ['spacing', 'padding'], padding));
   };
-
   const hasPaddingValue = () => !!value?.spacing?.padding && Object.keys(value?.spacing?.padding).length;
-
   const resetPaddingValue = () => setPaddingValues(undefined);
+  const onMouseOverPadding = () => onVisualize('padding');
 
-  const onMouseOverPadding = () => onVisualize('padding'); // Margin
-
-
+  // Margin
   const showMarginControl = useHasMargin(settings);
   const rawMargin = decodeValue(inheritedValue?.spacing?.margin);
   const marginValues = splitStyleValue(rawMargin);
   const marginSides = Array.isArray(settings?.spacing?.margin) ? settings?.spacing?.margin : settings?.spacing?.margin?.sides;
   const isAxialMargin = marginSides && marginSides.some(side => AXIAL_SIDES.includes(side));
-
   const setMarginValues = newMarginValues => {
     const margin = filterValuesBySides(newMarginValues, marginSides);
     onChange((0, _object.setImmutably)(value, ['spacing', 'margin'], margin));
   };
-
   const hasMarginValue = () => !!value?.spacing?.margin && Object.keys(value?.spacing?.margin).length;
-
   const resetMarginValue = () => setMarginValues(undefined);
+  const onMouseOverMargin = () => onVisualize('margin');
 
-  const onMouseOverMargin = () => onVisualize('margin'); // Block Gap
-
-
+  // Block Gap
   const showGapControl = useHasGap(settings);
   const gapValue = decodeValue(inheritedValue?.spacing?.blockGap);
   const gapValues = splitGapValue(gapValue);
   const gapSides = Array.isArray(settings?.spacing?.blockGap) ? settings?.spacing?.blockGap : settings?.spacing?.blockGap?.sides;
   const isAxialGap = gapSides && gapSides.some(side => AXIAL_SIDES.includes(side));
-
   const setGapValue = newGapValue => {
     onChange((0, _object.setImmutably)(value, ['spacing', 'blockGap'], newGapValue));
   };
-
   const setGapValues = nextBoxGapValue => {
     if (!nextBoxGapValue) {
       setGapValue(null);
-    } // If axial gap is not enabled, treat the 'top' value as the shorthand gap value.
-
-
+    }
+    // If axial gap is not enabled, treat the 'top' value as the shorthand gap value.
     if (!isAxialGap && nextBoxGapValue?.hasOwnProperty('top')) {
       setGapValue(nextBoxGapValue.top);
     } else {
@@ -323,71 +269,66 @@ function DimensionsPanel({
       });
     }
   };
-
   const resetGapValue = () => setGapValue(undefined);
+  const hasGapValue = () => !!value?.spacing?.blockGap;
 
-  const hasGapValue = () => !!value?.spacing?.blockGap; // Min Height
-
-
+  // Min Height
   const showMinHeightControl = useHasMinHeight(settings);
   const minHeightValue = decodeValue(inheritedValue?.dimensions?.minHeight);
-
   const setMinHeightValue = newValue => {
     onChange((0, _object.setImmutably)(value, ['dimensions', 'minHeight'], newValue));
   };
-
   const resetMinHeightValue = () => {
     setMinHeightValue(undefined);
   };
+  const hasMinHeightValue = () => !!value?.dimensions?.minHeight;
 
-  const hasMinHeightValue = () => !!value?.dimensions?.minHeight; // Child Layout
-
-
+  // Child Layout
   const showChildLayoutControl = useHasChildLayout(settings);
   const childLayout = inheritedValue?.layout;
   const {
     orientation = 'horizontal'
   } = (_settings$parentLayou2 = settings?.parentLayout) !== null && _settings$parentLayou2 !== void 0 ? _settings$parentLayou2 : {};
   const childLayoutOrientationLabel = orientation === 'horizontal' ? (0, _i18n.__)('Width') : (0, _i18n.__)('Height');
-
   const setChildLayout = newChildLayout => {
-    onChange({ ...value,
-      layout: { ...value?.layout,
+    onChange({
+      ...value,
+      layout: {
+        ...value?.layout,
         ...newChildLayout
       }
     });
   };
-
   const resetChildLayoutValue = () => {
     setChildLayout({
       selfStretch: undefined,
       flexSize: undefined
     });
   };
-
   const hasChildLayoutValue = () => !!value?.layout;
-
   const resetAllFilter = (0, _element.useCallback)(previousValue => {
-    return { ...previousValue,
-      layout: (0, _utils2.cleanEmptyObject)({ ...previousValue?.layout,
+    return {
+      ...previousValue,
+      layout: (0, _utils2.cleanEmptyObject)({
+        ...previousValue?.layout,
         contentSize: undefined,
         wideSize: undefined,
         selfStretch: undefined,
         flexSize: undefined
       }),
-      spacing: { ...previousValue?.spacing,
+      spacing: {
+        ...previousValue?.spacing,
         padding: undefined,
         margin: undefined,
         blockGap: undefined
       },
-      dimensions: { ...previousValue?.dimensions,
+      dimensions: {
+        ...previousValue?.dimensions,
         minHeight: undefined
       }
     };
   }, []);
-
   const onMouseLeaveControls = () => onVisualize(false);
-
   return (0, _element.createElement)(Wrapper, {
     resetAllFilter: resetAllFilter,
     value: value,