@wordpress/block-editor 7.0.4 → 8.0.0

package/build-module/hooks/text-transform.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/text-transform.js"],"names":["hasBlockSupport","TextTransformControl","useSetting","cleanEmptyObject","TEXT_TRANSFORM_SUPPORT_KEY","TextTransformEdit","props","attributes","style","setAttributes","isDisabled","useIsTextTransformDisabled","onChange","newTransform","typography","textTransform","name","blockName","notSupported","hasTextTransforms"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,eAAT,QAAgC,mBAAhC;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,sCAAjC;AACA,OAAOC,UAAP,MAAuB,2BAAvB;AACA,SAASC,gBAAT,QAAiC,SAAjC;AAEA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,0BAA0B,GACtC,wCADM;AAGP;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,iBAAT,CAA4BC,KAA5B,EAAoC;AAAA;;AAC1C,QAAM;AACLC,IAAAA,UAAU,EAAE;AAAEC,MAAAA;AAAF,KADP;AAELC,IAAAA;AAFK,MAGFH,KAHJ;AAIA,QAAMI,UAAU,GAAGC,0BAA0B,CAAEL,KAAF,CAA7C;;AAEA,MAAKI,UAAL,EAAkB;AACjB,WAAO,IAAP;AACA;;AAED,WAASE,QAAT,CAAmBC,YAAnB,EAAkC;AACjCJ,IAAAA,aAAa,CAAE;AACdD,MAAAA,KAAK,EAAEL,gBAAgB,CAAE,EACxB,GAAGK,KADqB;AAExBM,QAAAA,UAAU,EAAE,EACX,IAAGN,KAAH,aAAGA,KAAH,uBAAGA,KAAK,CAAEM,UAAV,CADW;AAEXC,UAAAA,aAAa,EAAEF;AAFJ;AAFY,OAAF;AADT,KAAF,CAAb;AASA;;AAED,SACC,cAAC,oBAAD;AACC,IAAA,KAAK,EAAGL,KAAH,aAAGA,KAAH,4CAAGA,KAAK,CAAEM,UAAV,sDAAG,kBAAmBC,aAD5B;AAEC,IAAA,QAAQ,EAAGH;AAFZ,IADD;AAMA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASD,0BAAT,CAAqC;AAAEK,EAAAA,IAAI,EAAEC;AAAR,IAAsB,EAA3D,EAAgE;AACtE,QAAMC,YAAY,GAAG,CAAElB,eAAe,CACrCiB,SADqC,EAErCb,0BAFqC,CAAtC;AAIA,QAAMe,iBAAiB,GAAGjB,UAAU,CAAE,iCAAF,CAApC;AACA,SAAOgB,YAAY,IAAI,CAAEC,iBAAzB;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { hasBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport TextTransformControl from '../components/text-transform-control';\nimport useSetting from '../components/use-setting';\nimport { cleanEmptyObject } from './utils';\n\n/**\n * Key within block settings' supports array indicating support for text\n * transforms e.g. settings found in `block.json`.\n */\nexport const TEXT_TRANSFORM_SUPPORT_KEY =\n\t'typography.__experimentalTextTransform';\n\n/**\n * Inspector control panel containing the text transform options.\n *\n * @param {Object} props Block properties.\n *\n * @return {WPElement} Text transform edit element.\n */\nexport function TextTransformEdit( props ) {\n\tconst {\n\t\tattributes: { style },\n\t\tsetAttributes,\n\t} = props;\n\tconst isDisabled = useIsTextTransformDisabled( props );\n\n\tif ( isDisabled ) {\n\t\treturn null;\n\t}\n\n\tfunction onChange( newTransform ) {\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\ttextTransform: newTransform,\n\t\t\t\t},\n\t\t\t} ),\n\t\t} );\n\t}\n\n\treturn (\n\t\t<TextTransformControl\n\t\t\tvalue={ style?.typography?.textTransform }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n\n/**\n * Checks if text-transform settings have been disabled.\n *\n * @param {string} name Name of the block.\n *\n * @return {boolean} Whether or not the setting is disabled.\n */\nexport function useIsTextTransformDisabled( { name: blockName } = {} ) {\n\tconst notSupported = ! hasBlockSupport(\n\t\tblockName,\n\t\tTEXT_TRANSFORM_SUPPORT_KEY\n\t);\n\tconst hasTextTransforms = useSetting( 'typography.customTextTransforms' );\n\treturn notSupported || ! hasTextTransforms;\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/hooks/text-transform.js"],"names":["hasBlockSupport","TextTransformControl","useSetting","cleanEmptyObject","TEXT_TRANSFORM_SUPPORT_KEY","TextTransformEdit","props","attributes","style","setAttributes","onChange","newTransform","typography","textTransform","useIsTextTransformDisabled","name","blockName","notSupported","hasTextTransforms","hasTextTransformValue","resetTextTransform","undefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,eAAT,QAAgC,mBAAhC;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,sCAAjC;AACA,OAAOC,UAAP,MAAuB,2BAAvB;AACA,SAASC,gBAAT,QAAiC,SAAjC;AAEA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,0BAA0B,GACtC,wCADM;AAGP;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,iBAAT,CAA4BC,KAA5B,EAAoC;AAAA;;AAC1C,QAAM;AACLC,IAAAA,UAAU,EAAE;AAAEC,MAAAA;AAAF,KADP;AAELC,IAAAA;AAFK,MAGFH,KAHJ;;AAKA,WAASI,QAAT,CAAmBC,YAAnB,EAAkC;AACjCF,IAAAA,aAAa,CAAE;AACdD,MAAAA,KAAK,EAAEL,gBAAgB,CAAE,EACxB,GAAGK,KADqB;AAExBI,QAAAA,UAAU,EAAE,EACX,IAAGJ,KAAH,aAAGA,KAAH,uBAAGA,KAAK,CAAEI,UAAV,CADW;AAEXC,UAAAA,aAAa,EAAEF;AAFJ;AAFY,OAAF;AADT,KAAF,CAAb;AASA;;AAED,SACC,cAAC,oBAAD;AACC,IAAA,KAAK,EAAGH,KAAH,aAAGA,KAAH,4CAAGA,KAAK,CAAEI,UAAV,sDAAG,kBAAmBC,aAD5B;AAEC,IAAA,QAAQ,EAAGH;AAFZ,IADD;AAMA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASI,0BAAT,CAAqC;AAAEC,EAAAA,IAAI,EAAEC;AAAR,IAAsB,EAA3D,EAAgE;AACtE,QAAMC,YAAY,GAAG,CAAEjB,eAAe,CACrCgB,SADqC,EAErCZ,0BAFqC,CAAtC;AAIA,QAAMc,iBAAiB,GAAGhB,UAAU,CAAE,0BAAF,CAApC;AACA,SAAOe,YAAY,IAAI,CAAEC,iBAAzB;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,qBAAT,CAAgCb,KAAhC,EAAwC;AAAA;;AAC9C,SAAO,CAAC,2BAAEA,KAAK,CAACC,UAAN,CAAiBC,KAAnB,4EAAE,sBAAwBI,UAA1B,mDAAE,uBAAoCC,aAAtC,CAAR;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASO,kBAAT,CAA6B;AAAEb,EAAAA,UAAU,GAAG,EAAf;AAAmBE,EAAAA;AAAnB,CAA7B,EAAkE;AACxE,QAAM;AAAED,IAAAA;AAAF,MAAYD,UAAlB;AAEAE,EAAAA,aAAa,CAAE;AACdD,IAAAA,KAAK,EAAEL,gBAAgB,CAAE,EACxB,GAAGK,KADqB;AAExBI,MAAAA,UAAU,EAAE,EACX,IAAGJ,KAAH,aAAGA,KAAH,uBAAGA,KAAK,CAAEI,UAAV,CADW;AAEXC,QAAAA,aAAa,EAAEQ;AAFJ;AAFY,KAAF;AADT,GAAF,CAAb;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { hasBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport TextTransformControl from '../components/text-transform-control';\nimport useSetting from '../components/use-setting';\nimport { cleanEmptyObject } from './utils';\n\n/**\n * Key within block settings' supports array indicating support for text\n * transforms e.g. settings found in `block.json`.\n */\nexport const TEXT_TRANSFORM_SUPPORT_KEY =\n\t'typography.__experimentalTextTransform';\n\n/**\n * Inspector control panel containing the text transform options.\n *\n * @param {Object} props Block properties.\n *\n * @return {WPElement} Text transform edit element.\n */\nexport function TextTransformEdit( props ) {\n\tconst {\n\t\tattributes: { style },\n\t\tsetAttributes,\n\t} = props;\n\n\tfunction onChange( newTransform ) {\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\ttextTransform: newTransform,\n\t\t\t\t},\n\t\t\t} ),\n\t\t} );\n\t}\n\n\treturn (\n\t\t<TextTransformControl\n\t\t\tvalue={ style?.typography?.textTransform }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n\n/**\n * Checks if text-transform settings have been disabled.\n *\n * @param {string} name Name of the block.\n *\n * @return {boolean} Whether or not the setting is disabled.\n */\nexport function useIsTextTransformDisabled( { name: blockName } = {} ) {\n\tconst notSupported = ! hasBlockSupport(\n\t\tblockName,\n\t\tTEXT_TRANSFORM_SUPPORT_KEY\n\t);\n\tconst hasTextTransforms = useSetting( 'typography.textTransform' );\n\treturn notSupported || ! hasTextTransforms;\n}\n\n/**\n * Checks if there is a current value set for the text transform block support.\n *\n * @param {Object} props Block props.\n * @return {boolean}     Whether or not the block has a text transform set.\n */\nexport function hasTextTransformValue( props ) {\n\treturn !! props.attributes.style?.typography?.textTransform;\n}\n\n/**\n * Resets the text transform block support attribute. This can be used when\n * disabling the text transform support controls for a block via a progressive\n * discovery panel.\n *\n * @param {Object} props               Block props.\n * @param {Object} props.attributes    Block's attributes.\n * @param {Object} props.setAttributes Function to set block's attributes.\n */\nexport function resetTextTransform( { attributes = {}, setAttributes } ) {\n\tconst { style } = attributes;\n\n\tsetAttributes( {\n\t\tstyle: cleanEmptyObject( {\n\t\t\t...style,\n\t\t\ttypography: {\n\t\t\t\t...style?.typography,\n\t\t\t\ttextTransform: undefined,\n\t\t\t},\n\t\t} ),\n\t} );\n}\n"]}

package/build-module/hooks/typography.js

@@ -3,35 +3,135 @@ import { createElement } from "@wordpress/element";
 /**
  * WordPress dependencies
  */
-import { hasBlockSupport } from '@wordpress/blocks';
-/**
- * External dependencies
- */
-
-import { PanelBody } from '@wordpress/components';
+import { getBlockSupport, hasBlockSupport } from '@wordpress/blocks';
+import { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
 
 import InspectorControls from '../components/inspector-controls';
-import TextDecorationAndTransformEdit from '../components/text-decoration-and-transform';
-import { LINE_HEIGHT_SUPPORT_KEY, LineHeightEdit, useIsLineHeightDisabled } from './line-height';
-import { FONT_STYLE_SUPPORT_KEY, FONT_WEIGHT_SUPPORT_KEY, FontAppearanceEdit, useIsFontAppearanceDisabled } from './font-appearance';
-import { FONT_FAMILY_SUPPORT_KEY, FontFamilyEdit, useIsFontFamilyDisabled } from './font-family';
-import { FONT_SIZE_SUPPORT_KEY, FontSizeEdit, useIsFontSizeDisabled } from './font-size';
-import { TEXT_DECORATION_SUPPORT_KEY, useIsTextDecorationDisabled } from './text-decoration';
-import { TEXT_TRANSFORM_SUPPORT_KEY, useIsTextTransformDisabled } from './text-transform';
-import { LETTER_SPACING_SUPPORT_KEY, LetterSpacingEdit, useIsLetterSpacingDisabled } from './letter-spacing';
+import { getFontAppearanceLabel } from '../components/font-appearance-control';
+import { LINE_HEIGHT_SUPPORT_KEY, LineHeightEdit, hasLineHeightValue, resetLineHeight, useIsLineHeightDisabled } from './line-height';
+import { FONT_STYLE_SUPPORT_KEY, FONT_WEIGHT_SUPPORT_KEY, FontAppearanceEdit, hasFontAppearanceValue, resetFontAppearance, useIsFontAppearanceDisabled, useIsFontStyleDisabled, useIsFontWeightDisabled } from './font-appearance';
+import { FONT_FAMILY_SUPPORT_KEY, FontFamilyEdit, hasFontFamilyValue, resetFontFamily, useIsFontFamilyDisabled } from './font-family';
+import { FONT_SIZE_SUPPORT_KEY, FontSizeEdit, hasFontSizeValue, resetFontSize, useIsFontSizeDisabled } from './font-size';
+import { TEXT_DECORATION_SUPPORT_KEY, TextDecorationEdit, hasTextDecorationValue, resetTextDecoration, useIsTextDecorationDisabled } from './text-decoration';
+import { TEXT_TRANSFORM_SUPPORT_KEY, TextTransformEdit, hasTextTransformValue, resetTextTransform, useIsTextTransformDisabled } from './text-transform';
+import { LETTER_SPACING_SUPPORT_KEY, LetterSpacingEdit, hasLetterSpacingValue, resetLetterSpacing, useIsLetterSpacingDisabled } from './letter-spacing';
 export const TYPOGRAPHY_SUPPORT_KEY = 'typography';
 export const TYPOGRAPHY_SUPPORT_KEYS = [LINE_HEIGHT_SUPPORT_KEY, FONT_SIZE_SUPPORT_KEY, FONT_STYLE_SUPPORT_KEY, FONT_WEIGHT_SUPPORT_KEY, FONT_FAMILY_SUPPORT_KEY, TEXT_DECORATION_SUPPORT_KEY, TEXT_TRANSFORM_SUPPORT_KEY, LETTER_SPACING_SUPPORT_KEY];
 export function TypographyPanel(props) {
+  const {
+    clientId
+  } = props;
+  const isFontFamilyDisabled = useIsFontFamilyDisabled(props);
+  const isFontSizeDisabled = useIsFontSizeDisabled(props);
+  const isFontAppearanceDisabled = useIsFontAppearanceDisabled(props);
+  const isLineHeightDisabled = useIsLineHeightDisabled(props);
+  const isTextDecorationDisabled = useIsTextDecorationDisabled(props);
+  const isTextTransformDisabled = useIsTextTransformDisabled(props);
+  const isLetterSpacingDisabled = useIsLetterSpacingDisabled(props);
+  const hasFontStyles = !useIsFontStyleDisabled(props);
+  const hasFontWeights = !useIsFontWeightDisabled(props);
   const isDisabled = useIsTypographyDisabled(props);
   const isSupported = hasTypographySupport(props.name);
   if (isDisabled || !isSupported) return null;
-  return createElement(InspectorControls, null, createElement(PanelBody, {
-    title: __('Typography')
-  }, createElement(FontFamilyEdit, props), createElement(FontSizeEdit, props), createElement(FontAppearanceEdit, props), createElement(LineHeightEdit, props), createElement(TextDecorationAndTransformEdit, props), createElement(LetterSpacingEdit, props)));
+  const defaultControls = getBlockSupport(props.name, [TYPOGRAPHY_SUPPORT_KEY, '__experimentalDefaultControls']);
+
+  const createResetAllFilter = attribute => newAttributes => {
+    var _newAttributes$style;
+
+    return { ...newAttributes,
+      style: { ...newAttributes.style,
+        typography: { ...((_newAttributes$style = newAttributes.style) === null || _newAttributes$style === void 0 ? void 0 : _newAttributes$style.typography),
+          [attribute]: undefined
+        }
+      }
+    };
+  };
+
+  return createElement(InspectorControls, {
+    __experimentalGroup: "typography"
+  }, !isFontFamilyDisabled && createElement(ToolsPanelItem, {
+    hasValue: () => hasFontFamilyValue(props),
+    label: __('Font family'),
+    onDeselect: () => resetFontFamily(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.fontFamily,
+    resetAllFilter: newAttributes => ({ ...newAttributes,
+      fontFamily: undefined
+    }),
+    panelId: clientId
+  }, createElement(FontFamilyEdit, props)), !isFontSizeDisabled && createElement(ToolsPanelItem, {
+    hasValue: () => hasFontSizeValue(props),
+    label: __('Font size'),
+    onDeselect: () => resetFontSize(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.fontSize,
+    resetAllFilter: newAttributes => {
+      var _newAttributes$style2;
+
+      return { ...newAttributes,
+        fontSize: undefined,
+        style: { ...newAttributes.style,
+          typography: { ...((_newAttributes$style2 = newAttributes.style) === null || _newAttributes$style2 === void 0 ? void 0 : _newAttributes$style2.typography),
+            fontSize: undefined
+          }
+        }
+      };
+    },
+    panelId: clientId
+  }, createElement(FontSizeEdit, props)), !isFontAppearanceDisabled && createElement(ToolsPanelItem, {
+    className: "single-column",
+    hasValue: () => hasFontAppearanceValue(props),
+    label: getFontAppearanceLabel(hasFontStyles, hasFontWeights),
+    onDeselect: () => resetFontAppearance(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.fontAppearance,
+    resetAllFilter: newAttributes => {
+      var _newAttributes$style3;
+
+      return { ...newAttributes,
+        style: { ...newAttributes.style,
+          typography: { ...((_newAttributes$style3 = newAttributes.style) === null || _newAttributes$style3 === void 0 ? void 0 : _newAttributes$style3.typography),
+            fontStyle: undefined,
+            fontWeight: undefined
+          }
+        }
+      };
+    },
+    panelId: clientId
+  }, createElement(FontAppearanceEdit, props)), !isLineHeightDisabled && createElement(ToolsPanelItem, {
+    className: "single-column",
+    hasValue: () => hasLineHeightValue(props),
+    label: __('Line height'),
+    onDeselect: () => resetLineHeight(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.lineHeight,
+    resetAllFilter: createResetAllFilter('lineHeight'),
+    panelId: clientId
+  }, createElement(LineHeightEdit, props)), !isTextDecorationDisabled && createElement(ToolsPanelItem, {
+    className: "single-column",
+    hasValue: () => hasTextDecorationValue(props),
+    label: __('Decoration'),
+    onDeselect: () => resetTextDecoration(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.textDecoration,
+    resetAllFilter: createResetAllFilter('textDecoration'),
+    panelId: clientId
+  }, createElement(TextDecorationEdit, props)), !isTextTransformDisabled && createElement(ToolsPanelItem, {
+    className: "single-column",
+    hasValue: () => hasTextTransformValue(props),
+    label: __('Letter case'),
+    onDeselect: () => resetTextTransform(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.textTransform,
+    resetAllFilter: createResetAllFilter('textTransform'),
+    panelId: clientId
+  }, createElement(TextTransformEdit, props)), !isLetterSpacingDisabled && createElement(ToolsPanelItem, {
+    className: "single-column",
+    hasValue: () => hasLetterSpacingValue(props),
+    label: __('Letter-spacing'),
+    onDeselect: () => resetLetterSpacing(props),
+    isShownByDefault: defaultControls === null || defaultControls === void 0 ? void 0 : defaultControls.letterSpacing,
+    resetAllFilter: createResetAllFilter('letterSpacing'),
+    panelId: clientId
+  }, createElement(LetterSpacingEdit, props)));
 }
 
 const hasTypographySupport = blockName => {

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/typography.js"],"names":["hasBlockSupport","PanelBody","__","InspectorControls","TextDecorationAndTransformEdit","LINE_HEIGHT_SUPPORT_KEY","LineHeightEdit","useIsLineHeightDisabled","FONT_STYLE_SUPPORT_KEY","FONT_WEIGHT_SUPPORT_KEY","FontAppearanceEdit","useIsFontAppearanceDisabled","FONT_FAMILY_SUPPORT_KEY","FontFamilyEdit","useIsFontFamilyDisabled","FONT_SIZE_SUPPORT_KEY","FontSizeEdit","useIsFontSizeDisabled","TEXT_DECORATION_SUPPORT_KEY","useIsTextDecorationDisabled","TEXT_TRANSFORM_SUPPORT_KEY","useIsTextTransformDisabled","LETTER_SPACING_SUPPORT_KEY","LetterSpacingEdit","useIsLetterSpacingDisabled","TYPOGRAPHY_SUPPORT_KEY","TYPOGRAPHY_SUPPORT_KEYS","TypographyPanel","props","isDisabled","useIsTypographyDisabled","isSupported","hasTypographySupport","name","blockName","some","key","configs","filter","Boolean","length"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,eAAT,QAAgC,mBAAhC;AACA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,uBAA1B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,iBAAP,MAA8B,kCAA9B;AACA,OAAOC,8BAAP,MAA2C,6CAA3C;AAEA,SACCC,uBADD,EAECC,cAFD,EAGCC,uBAHD,QAIO,eAJP;AAKA,SACCC,sBADD,EAECC,uBAFD,EAGCC,kBAHD,EAICC,2BAJD,QAKO,mBALP;AAMA,SACCC,uBADD,EAECC,cAFD,EAGCC,uBAHD,QAIO,eAJP;AAKA,SACCC,qBADD,EAECC,YAFD,EAGCC,qBAHD,QAIO,aAJP;AAKA,SACCC,2BADD,EAECC,2BAFD,QAGO,mBAHP;AAIA,SACCC,0BADD,EAECC,0BAFD,QAGO,kBAHP;AAIA,SACCC,0BADD,EAECC,iBAFD,EAGCC,0BAHD,QAIO,kBAJP;AAMA,OAAO,MAAMC,sBAAsB,GAAG,YAA/B;AACP,OAAO,MAAMC,uBAAuB,GAAG,CACtCrB,uBADsC,EAEtCU,qBAFsC,EAGtCP,sBAHsC,EAItCC,uBAJsC,EAKtCG,uBALsC,EAMtCM,2BANsC,EAOtCE,0BAPsC,EAQtCE,0BARsC,CAAhC;AAWP,OAAO,SAASK,eAAT,CAA0BC,KAA1B,EAAkC;AACxC,QAAMC,UAAU,GAAGC,uBAAuB,CAAEF,KAAF,CAA1C;AACA,QAAMG,WAAW,GAAGC,oBAAoB,CAAEJ,KAAK,CAACK,IAAR,CAAxC;AAEA,MAAKJ,UAAU,IAAI,CAAEE,WAArB,EAAmC,OAAO,IAAP;AAEnC,SACC,cAAC,iBAAD,QACC,cAAC,SAAD;AAAW,IAAA,KAAK,EAAG7B,EAAE,CAAE,YAAF;AAArB,KACC,cAAC,cAAD,EAAqB0B,KAArB,CADD,EAEC,cAAC,YAAD,EAAmBA,KAAnB,CAFD,EAGC,cAAC,kBAAD,EAAyBA,KAAzB,CAHD,EAIC,cAAC,cAAD,EAAqBA,KAArB,CAJD,EAKC,cAAC,8BAAD,EAAqCA,KAArC,CALD,EAMC,cAAC,iBAAD,EAAwBA,KAAxB,CAND,CADD,CADD;AAYA;;AAED,MAAMI,oBAAoB,GAAKE,SAAF,IAAiB;AAC7C,SAAOR,uBAAuB,CAACS,IAAxB,CAAgCC,GAAF,IACpCpC,eAAe,CAAEkC,SAAF,EAAaE,GAAb,CADT,CAAP;AAGA,CAJD;;AAMA,SAASN,uBAAT,CAAkCF,KAAK,GAAG,EAA1C,EAA+C;AAC9C,QAAMS,OAAO,GAAG,CACf1B,2BAA2B,CAAEiB,KAAF,CADZ,EAEfX,qBAAqB,CAAEW,KAAF,CAFN,EAGfrB,uBAAuB,CAAEqB,KAAF,CAHR,EAIfd,uBAAuB,CAAEc,KAAF,CAJR,EAKfT,2BAA2B,CAAES,KAAF,CALZ,EAMfP,0BAA0B,CAAEO,KAAF,CANX,EAOfJ,0BAA0B,CAAEI,KAAF,CAPX,CAAhB;AAUA,SAAOS,OAAO,CAACC,MAAR,CAAgBC,OAAhB,EAA0BC,MAA1B,KAAqCH,OAAO,CAACG,MAApD;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { hasBlockSupport } from '@wordpress/blocks';\n/**\n * External dependencies\n */\nimport { PanelBody } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport TextDecorationAndTransformEdit from '../components/text-decoration-and-transform';\n\nimport {\n\tLINE_HEIGHT_SUPPORT_KEY,\n\tLineHeightEdit,\n\tuseIsLineHeightDisabled,\n} from './line-height';\nimport {\n\tFONT_STYLE_SUPPORT_KEY,\n\tFONT_WEIGHT_SUPPORT_KEY,\n\tFontAppearanceEdit,\n\tuseIsFontAppearanceDisabled,\n} from './font-appearance';\nimport {\n\tFONT_FAMILY_SUPPORT_KEY,\n\tFontFamilyEdit,\n\tuseIsFontFamilyDisabled,\n} from './font-family';\nimport {\n\tFONT_SIZE_SUPPORT_KEY,\n\tFontSizeEdit,\n\tuseIsFontSizeDisabled,\n} from './font-size';\nimport {\n\tTEXT_DECORATION_SUPPORT_KEY,\n\tuseIsTextDecorationDisabled,\n} from './text-decoration';\nimport {\n\tTEXT_TRANSFORM_SUPPORT_KEY,\n\tuseIsTextTransformDisabled,\n} from './text-transform';\nimport {\n\tLETTER_SPACING_SUPPORT_KEY,\n\tLetterSpacingEdit,\n\tuseIsLetterSpacingDisabled,\n} from './letter-spacing';\n\nexport const TYPOGRAPHY_SUPPORT_KEY = 'typography';\nexport const TYPOGRAPHY_SUPPORT_KEYS = [\n\tLINE_HEIGHT_SUPPORT_KEY,\n\tFONT_SIZE_SUPPORT_KEY,\n\tFONT_STYLE_SUPPORT_KEY,\n\tFONT_WEIGHT_SUPPORT_KEY,\n\tFONT_FAMILY_SUPPORT_KEY,\n\tTEXT_DECORATION_SUPPORT_KEY,\n\tTEXT_TRANSFORM_SUPPORT_KEY,\n\tLETTER_SPACING_SUPPORT_KEY,\n];\n\nexport function TypographyPanel( props ) {\n\tconst isDisabled = useIsTypographyDisabled( props );\n\tconst isSupported = hasTypographySupport( props.name );\n\n\tif ( isDisabled || ! isSupported ) return null;\n\n\treturn (\n\t\t<InspectorControls>\n\t\t\t<PanelBody title={ __( 'Typography' ) }>\n\t\t\t\t<FontFamilyEdit { ...props } />\n\t\t\t\t<FontSizeEdit { ...props } />\n\t\t\t\t<FontAppearanceEdit { ...props } />\n\t\t\t\t<LineHeightEdit { ...props } />\n\t\t\t\t<TextDecorationAndTransformEdit { ...props } />\n\t\t\t\t<LetterSpacingEdit { ...props } />\n\t\t\t</PanelBody>\n\t\t</InspectorControls>\n\t);\n}\n\nconst hasTypographySupport = ( blockName ) => {\n\treturn TYPOGRAPHY_SUPPORT_KEYS.some( ( key ) =>\n\t\thasBlockSupport( blockName, key )\n\t);\n};\n\nfunction useIsTypographyDisabled( props = {} ) {\n\tconst configs = [\n\t\tuseIsFontAppearanceDisabled( props ),\n\t\tuseIsFontSizeDisabled( props ),\n\t\tuseIsLineHeightDisabled( props ),\n\t\tuseIsFontFamilyDisabled( props ),\n\t\tuseIsTextDecorationDisabled( props ),\n\t\tuseIsTextTransformDisabled( props ),\n\t\tuseIsLetterSpacingDisabled( props ),\n\t];\n\n\treturn configs.filter( Boolean ).length === configs.length;\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/hooks/typography.js"],"names":["getBlockSupport","hasBlockSupport","__experimentalToolsPanelItem","ToolsPanelItem","__","InspectorControls","getFontAppearanceLabel","LINE_HEIGHT_SUPPORT_KEY","LineHeightEdit","hasLineHeightValue","resetLineHeight","useIsLineHeightDisabled","FONT_STYLE_SUPPORT_KEY","FONT_WEIGHT_SUPPORT_KEY","FontAppearanceEdit","hasFontAppearanceValue","resetFontAppearance","useIsFontAppearanceDisabled","useIsFontStyleDisabled","useIsFontWeightDisabled","FONT_FAMILY_SUPPORT_KEY","FontFamilyEdit","hasFontFamilyValue","resetFontFamily","useIsFontFamilyDisabled","FONT_SIZE_SUPPORT_KEY","FontSizeEdit","hasFontSizeValue","resetFontSize","useIsFontSizeDisabled","TEXT_DECORATION_SUPPORT_KEY","TextDecorationEdit","hasTextDecorationValue","resetTextDecoration","useIsTextDecorationDisabled","TEXT_TRANSFORM_SUPPORT_KEY","TextTransformEdit","hasTextTransformValue","resetTextTransform","useIsTextTransformDisabled","LETTER_SPACING_SUPPORT_KEY","LetterSpacingEdit","hasLetterSpacingValue","resetLetterSpacing","useIsLetterSpacingDisabled","TYPOGRAPHY_SUPPORT_KEY","TYPOGRAPHY_SUPPORT_KEYS","TypographyPanel","props","clientId","isFontFamilyDisabled","isFontSizeDisabled","isFontAppearanceDisabled","isLineHeightDisabled","isTextDecorationDisabled","isTextTransformDisabled","isLetterSpacingDisabled","hasFontStyles","hasFontWeights","isDisabled","useIsTypographyDisabled","isSupported","hasTypographySupport","name","defaultControls","createResetAllFilter","attribute","newAttributes","style","typography","undefined","fontFamily","fontSize","fontAppearance","fontStyle","fontWeight","lineHeight","textDecoration","textTransform","letterSpacing","blockName","some","key","configs","filter","Boolean","length"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockSupport, hasBlockSupport } from '@wordpress/blocks';\nimport { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport { getFontAppearanceLabel } from '../components/font-appearance-control';\n\nimport {\n\tLINE_HEIGHT_SUPPORT_KEY,\n\tLineHeightEdit,\n\thasLineHeightValue,\n\tresetLineHeight,\n\tuseIsLineHeightDisabled,\n} from './line-height';\nimport {\n\tFONT_STYLE_SUPPORT_KEY,\n\tFONT_WEIGHT_SUPPORT_KEY,\n\tFontAppearanceEdit,\n\thasFontAppearanceValue,\n\tresetFontAppearance,\n\tuseIsFontAppearanceDisabled,\n\tuseIsFontStyleDisabled,\n\tuseIsFontWeightDisabled,\n} from './font-appearance';\nimport {\n\tFONT_FAMILY_SUPPORT_KEY,\n\tFontFamilyEdit,\n\thasFontFamilyValue,\n\tresetFontFamily,\n\tuseIsFontFamilyDisabled,\n} from './font-family';\nimport {\n\tFONT_SIZE_SUPPORT_KEY,\n\tFontSizeEdit,\n\thasFontSizeValue,\n\tresetFontSize,\n\tuseIsFontSizeDisabled,\n} from './font-size';\nimport {\n\tTEXT_DECORATION_SUPPORT_KEY,\n\tTextDecorationEdit,\n\thasTextDecorationValue,\n\tresetTextDecoration,\n\tuseIsTextDecorationDisabled,\n} from './text-decoration';\nimport {\n\tTEXT_TRANSFORM_SUPPORT_KEY,\n\tTextTransformEdit,\n\thasTextTransformValue,\n\tresetTextTransform,\n\tuseIsTextTransformDisabled,\n} from './text-transform';\nimport {\n\tLETTER_SPACING_SUPPORT_KEY,\n\tLetterSpacingEdit,\n\thasLetterSpacingValue,\n\tresetLetterSpacing,\n\tuseIsLetterSpacingDisabled,\n} from './letter-spacing';\n\nexport const TYPOGRAPHY_SUPPORT_KEY = 'typography';\nexport const TYPOGRAPHY_SUPPORT_KEYS = [\n\tLINE_HEIGHT_SUPPORT_KEY,\n\tFONT_SIZE_SUPPORT_KEY,\n\tFONT_STYLE_SUPPORT_KEY,\n\tFONT_WEIGHT_SUPPORT_KEY,\n\tFONT_FAMILY_SUPPORT_KEY,\n\tTEXT_DECORATION_SUPPORT_KEY,\n\tTEXT_TRANSFORM_SUPPORT_KEY,\n\tLETTER_SPACING_SUPPORT_KEY,\n];\n\nexport function TypographyPanel( props ) {\n\tconst { clientId } = props;\n\tconst isFontFamilyDisabled = useIsFontFamilyDisabled( props );\n\tconst isFontSizeDisabled = useIsFontSizeDisabled( props );\n\tconst isFontAppearanceDisabled = useIsFontAppearanceDisabled( props );\n\tconst isLineHeightDisabled = useIsLineHeightDisabled( props );\n\tconst isTextDecorationDisabled = useIsTextDecorationDisabled( props );\n\tconst isTextTransformDisabled = useIsTextTransformDisabled( props );\n\tconst isLetterSpacingDisabled = useIsLetterSpacingDisabled( props );\n\n\tconst hasFontStyles = ! useIsFontStyleDisabled( props );\n\tconst hasFontWeights = ! useIsFontWeightDisabled( props );\n\n\tconst isDisabled = useIsTypographyDisabled( props );\n\tconst isSupported = hasTypographySupport( props.name );\n\n\tif ( isDisabled || ! isSupported ) return null;\n\n\tconst defaultControls = getBlockSupport( props.name, [\n\t\tTYPOGRAPHY_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\ttypography: {\n\t\t\t\t...newAttributes.style?.typography,\n\t\t\t\t[ attribute ]: undefined,\n\t\t\t},\n\t\t},\n\t} );\n\n\treturn (\n\t\t<InspectorControls __experimentalGroup=\"typography\">\n\t\t\t{ ! isFontFamilyDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasFontFamilyValue( props ) }\n\t\t\t\t\tlabel={ __( 'Font family' ) }\n\t\t\t\t\tonDeselect={ () => resetFontFamily( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.fontFamily }\n\t\t\t\t\tresetAllFilter={ ( newAttributes ) => ( {\n\t\t\t\t\t\t...newAttributes,\n\t\t\t\t\t\tfontFamily: undefined,\n\t\t\t\t\t} ) }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<FontFamilyEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isFontSizeDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => hasFontSizeValue( props ) }\n\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\tonDeselect={ () => resetFontSize( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.fontSize }\n\t\t\t\t\tresetAllFilter={ ( newAttributes ) => ( {\n\t\t\t\t\t\t...newAttributes,\n\t\t\t\t\t\tfontSize: undefined,\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...newAttributes.style,\n\t\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\t\t...newAttributes.style?.typography,\n\t\t\t\t\t\t\t\tfontSize: undefined,\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\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<FontSizeEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isFontAppearanceDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => hasFontAppearanceValue( props ) }\n\t\t\t\t\tlabel={ getFontAppearanceLabel(\n\t\t\t\t\t\thasFontStyles,\n\t\t\t\t\t\thasFontWeights\n\t\t\t\t\t) }\n\t\t\t\t\tonDeselect={ () => resetFontAppearance( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.fontAppearance }\n\t\t\t\t\tresetAllFilter={ ( newAttributes ) => ( {\n\t\t\t\t\t\t...newAttributes,\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...newAttributes.style,\n\t\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\t\t...newAttributes.style?.typography,\n\t\t\t\t\t\t\t\tfontStyle: undefined,\n\t\t\t\t\t\t\t\tfontWeight: undefined,\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\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<FontAppearanceEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isLineHeightDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => hasLineHeightValue( props ) }\n\t\t\t\t\tlabel={ __( 'Line height' ) }\n\t\t\t\t\tonDeselect={ () => resetLineHeight( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.lineHeight }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'lineHeight' ) }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<LineHeightEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isTextDecorationDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => hasTextDecorationValue( props ) }\n\t\t\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\t\t\tonDeselect={ () => resetTextDecoration( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.textDecoration }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'textDecoration' ) }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<TextDecorationEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isTextTransformDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => hasTextTransformValue( props ) }\n\t\t\t\t\tlabel={ __( 'Letter case' ) }\n\t\t\t\t\tonDeselect={ () => resetTextTransform( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.textTransform }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'textTransform' ) }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<TextTransformEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ ! isLetterSpacingDisabled && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => hasLetterSpacingValue( props ) }\n\t\t\t\t\tlabel={ __( 'Letter-spacing' ) }\n\t\t\t\t\tonDeselect={ () => resetLetterSpacing( props ) }\n\t\t\t\t\tisShownByDefault={ defaultControls?.letterSpacing }\n\t\t\t\t\tresetAllFilter={ createResetAllFilter( 'letterSpacing' ) }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<LetterSpacingEdit { ...props } />\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</InspectorControls>\n\t);\n}\n\nconst hasTypographySupport = ( blockName ) => {\n\treturn TYPOGRAPHY_SUPPORT_KEYS.some( ( key ) =>\n\t\thasBlockSupport( blockName, key )\n\t);\n};\n\nfunction useIsTypographyDisabled( props = {} ) {\n\tconst configs = [\n\t\tuseIsFontAppearanceDisabled( props ),\n\t\tuseIsFontSizeDisabled( props ),\n\t\tuseIsLineHeightDisabled( props ),\n\t\tuseIsFontFamilyDisabled( props ),\n\t\tuseIsTextDecorationDisabled( props ),\n\t\tuseIsTextTransformDisabled( props ),\n\t\tuseIsLetterSpacingDisabled( props ),\n\t];\n\n\treturn configs.filter( Boolean ).length === configs.length;\n}\n"]}

package/build-module/hooks/use-cached-truthy.js

@@ -0,0 +1,21 @@
+/**
+ * WordPress dependencies
+ */
+import { useState, useEffect } from '@wordpress/element';
+/**
+ * Keeps an up-to-date copy of the passed value and returns it. If value becomes falsy, it will return the last truthy copy.
+ *
+ * @param {any} value
+ * @return {any} value
+ */
+
+export function useCachedTruthy(value) {
+  const [cachedValue, setCachedValue] = useState(value);
+  useEffect(() => {
+    if (value) {
+      setCachedValue(value);
+    }
+  }, [value]);
+  return cachedValue;
+}
+//# sourceMappingURL=use-cached-truthy.js.map

package/build-module/hooks/use-cached-truthy.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/hooks/use-cached-truthy.js"],"names":["useState","useEffect","useCachedTruthy","value","cachedValue","setCachedValue"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,SAAnB,QAAoC,oBAApC;AAEA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,eAAT,CAA0BC,KAA1B,EAAkC;AACxC,QAAM,CAAEC,WAAF,EAAeC,cAAf,IAAkCL,QAAQ,CAAEG,KAAF,CAAhD;AACAF,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKE,KAAL,EAAa;AACZE,MAAAA,cAAc,CAAEF,KAAF,CAAd;AACA;AACD,GAJQ,EAIN,CAAEA,KAAF,CAJM,CAAT;AAKA,SAAOC,WAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useEffect } from '@wordpress/element';\n\n/**\n * Keeps an up-to-date copy of the passed value and returns it. If value becomes falsy, it will return the last truthy copy.\n *\n * @param {any} value\n * @return {any} value\n */\nexport function useCachedTruthy( value ) {\n\tconst [ cachedValue, setCachedValue ] = useState( value );\n\tuseEffect( () => {\n\t\tif ( value ) {\n\t\t\tsetCachedValue( value );\n\t\t}\n\t}, [ value ] );\n\treturn cachedValue;\n}\n"]}

package/build-module/index.js

@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import './hooks';
-export { getBorderClassesAndStyles as __experimentalGetBorderClassesAndStyles, useBorderProps as __experimentalUseBorderProps, getColorClassesAndStyles as __experimentalGetColorClassesAndStyles, useColorProps as __experimentalUseColorProps, useCustomSides as __experimentalUseCustomSides, getSpacingClassesAndStyles as __experimentalGetSpacingClassesAndStyles } from './hooks';
+export { getBorderClassesAndStyles as __experimentalGetBorderClassesAndStyles, useBorderProps as __experimentalUseBorderProps, getColorClassesAndStyles as __experimentalGetColorClassesAndStyles, useColorProps as __experimentalUseColorProps, useCustomSides as __experimentalUseCustomSides, getSpacingClassesAndStyles as __experimentalGetSpacingClassesAndStyles, useCachedTruthy } from './hooks';
 export * from './components';
 export * from './utils';
 export { storeConfig, store } from './store';

package/build-module/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/index.js"],"names":["getBorderClassesAndStyles","__experimentalGetBorderClassesAndStyles","useBorderProps","__experimentalUseBorderProps","getColorClassesAndStyles","__experimentalGetColorClassesAndStyles","useColorProps","__experimentalUseColorProps","useCustomSides","__experimentalUseCustomSides","getSpacingClassesAndStyles","__experimentalGetSpacingClassesAndStyles","storeConfig","store","SETTINGS_DEFAULTS"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,SAAP;AACA,SACCA,yBAAyB,IAAIC,uCAD9B,EAECC,cAAc,IAAIC,4BAFnB,EAGCC,wBAAwB,IAAIC,sCAH7B,EAICC,aAAa,IAAIC,2BAJlB,EAKCC,cAAc,IAAIC,4BALnB,EAMCC,0BAA0B,IAAIC,wCAN/B,QAOO,SAPP;AAQA,cAAc,cAAd;AACA,cAAc,SAAd;AACA,SAASC,WAAT,EAAsBC,KAAtB,QAAmC,SAAnC;AACA,SAASC,iBAAT,QAAkC,kBAAlC","sourcesContent":["/**\n * Internal dependencies\n */\nimport './hooks';\nexport {\n\tgetBorderClassesAndStyles as __experimentalGetBorderClassesAndStyles,\n\tuseBorderProps as __experimentalUseBorderProps,\n\tgetColorClassesAndStyles as __experimentalGetColorClassesAndStyles,\n\tuseColorProps as __experimentalUseColorProps,\n\tuseCustomSides as __experimentalUseCustomSides,\n\tgetSpacingClassesAndStyles as __experimentalGetSpacingClassesAndStyles,\n} from './hooks';\nexport * from './components';\nexport * from './utils';\nexport { storeConfig, store } from './store';\nexport { SETTINGS_DEFAULTS } from './store/defaults';\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/index.js"],"names":["getBorderClassesAndStyles","__experimentalGetBorderClassesAndStyles","useBorderProps","__experimentalUseBorderProps","getColorClassesAndStyles","__experimentalGetColorClassesAndStyles","useColorProps","__experimentalUseColorProps","useCustomSides","__experimentalUseCustomSides","getSpacingClassesAndStyles","__experimentalGetSpacingClassesAndStyles","useCachedTruthy","storeConfig","store","SETTINGS_DEFAULTS"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,SAAP;AACA,SACCA,yBAAyB,IAAIC,uCAD9B,EAECC,cAAc,IAAIC,4BAFnB,EAGCC,wBAAwB,IAAIC,sCAH7B,EAICC,aAAa,IAAIC,2BAJlB,EAKCC,cAAc,IAAIC,4BALnB,EAMCC,0BAA0B,IAAIC,wCAN/B,EAOCC,eAPD,QAQO,SARP;AASA,cAAc,cAAd;AACA,cAAc,SAAd;AACA,SAASC,WAAT,EAAsBC,KAAtB,QAAmC,SAAnC;AACA,SAASC,iBAAT,QAAkC,kBAAlC","sourcesContent":["/**\n * Internal dependencies\n */\nimport './hooks';\nexport {\n\tgetBorderClassesAndStyles as __experimentalGetBorderClassesAndStyles,\n\tuseBorderProps as __experimentalUseBorderProps,\n\tgetColorClassesAndStyles as __experimentalGetColorClassesAndStyles,\n\tuseColorProps as __experimentalUseColorProps,\n\tuseCustomSides as __experimentalUseCustomSides,\n\tgetSpacingClassesAndStyles as __experimentalGetSpacingClassesAndStyles,\n\tuseCachedTruthy,\n} from './hooks';\nexport * from './components';\nexport * from './utils';\nexport { storeConfig, store } from './store';\nexport { SETTINGS_DEFAULTS } from './store/defaults';\n"]}

package/build-module/layouts/flex.js

@@ -1,24 +1,32 @@
-import { createElement } from "@wordpress/element";
+import { createElement, Fragment } from "@wordpress/element";
 
 /**
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { justifyLeft, justifyCenter, justifyRight, justifySpaceBetween } from '@wordpress/icons';
-import { Button } from '@wordpress/components';
+import { justifyLeft, justifyCenter, justifyRight, justifySpaceBetween, arrowRight, arrowDown } from '@wordpress/icons';
+import { Button, ToggleControl, Flex, FlexItem } from '@wordpress/components';
 /**
  * Internal dependencies
  */
 
 import { appendSelectors } from './utils';
 import useSetting from '../components/use-setting';
-import { BlockControls, JustifyContentControl } from '../components';
+import { BlockControls, JustifyContentControl } from '../components'; // Used with the default, horizontal flex orientation.
+
 const justifyContentMap = {
   left: 'flex-start',
   right: 'flex-end',
   center: 'center',
   'space-between': 'space-between'
+}; // Used with the vertical (column) flex orientation.
+
+const alignItemsMap = {
+  left: 'flex-start',
+  right: 'flex-end',
+  center: 'center'
 };
+const flexWrapOptions = ['wrap', 'nowrap'];
 export default {
   name: 'flex',
   label: __('Flex'),
@@ -26,10 +34,19 @@ export default {
     layout = {},
     onChange
   }) {
-    return createElement(FlexLayoutJustifyContentControl, {
+    const {
+      allowOrientation = true
+    } = layout;
+    return createElement(Fragment, null, createElement(Flex, null, createElement(FlexItem, null, createElement(FlexLayoutJustifyContentControl, {
       layout: layout,
       onChange: onChange
-    });
+    })), createElement(FlexItem, null, allowOrientation && createElement(OrientationControl, {
+      layout: layout,
+      onChange: onChange
+    }))), createElement(FlexWrapControl, {
+      layout: layout,
+      onChange: onChange
+    }));
   },
   toolBarControls: function FlexLayoutToolbarControls({
     layout = {},
@@ -53,17 +70,33 @@ export default {
     selector,
     layout
   }) {
+    const {
+      orientation = 'horizontal'
+    } = layout;
     const blockGapSupport = useSetting('spacing.blockGap');
     const hasBlockGapStylesSupport = blockGapSupport !== null;
-    const justifyContent = justifyContentMap[layout.justifyContent] || 'flex-start';
+    const justifyContent = justifyContentMap[layout.justifyContent] || justifyContentMap.left;
+    const flexWrap = flexWrapOptions.includes(layout.flexWrap) ? layout.flexWrap : 'wrap'; // --justification-setting allows children to inherit the value
+    // regardless or row or column direction.
+
+    const rowOrientation = `
+		flex-direction: row;
+		align-items: center;
+		justify-content: ${justifyContent};
+		--justification-setting: ${justifyContent};
+		`;
+    const alignItems = alignItemsMap[layout.justifyContent] || alignItemsMap.left;
+    const columnOrientation = `
+		flex-direction: column;
+		align-items: ${alignItems};
+		--justification-setting: ${alignItems};
+		`;
     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};
+					flex-wrap: ${flexWrap};
+					${orientation === 'horizontal' ? rowOrientation : columnOrientation}
 				}
 
 				${appendSelectors(selector, '> *')} {
@@ -72,8 +105,11 @@ export default {
 			`);
   },
 
-  getOrientation() {
-    return 'horizontal';
+  getOrientation(layout) {
+    const {
+      orientation = 'horizontal'
+    } = layout;
+    return orientation;
   },
 
   getAlignments() {
@@ -81,23 +117,6 @@ 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,
@@ -105,7 +124,8 @@ function FlexLayoutJustifyContentControl({
   isToolbar = false
 }) {
   const {
-    justifyContent = 'left'
+    justifyContent = 'left',
+    orientation = 'horizontal'
   } = layout;
 
   const onJustificationChange = value => {
@@ -114,9 +134,15 @@ function FlexLayoutJustifyContentControl({
     });
   };
 
+  const allowedControls = ['left', 'center', 'right'];
+
+  if (orientation === 'horizontal') {
+    allowedControls.push('space-between');
+  }
+
   if (isToolbar) {
     return createElement(JustifyContentControl, {
-      allowedControls: ['left', 'center', 'right', 'space-between'],
+      allowedControls: allowedControls,
       value: justifyContent,
       onChange: onJustificationChange,
       popoverProps: {
@@ -126,6 +152,28 @@ function FlexLayoutJustifyContentControl({
     });
   }
 
+  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')
+  }];
+
+  if (orientation === 'horizontal') {
+    justificationOptions.push({
+      value: 'space-between',
+      icon: justifySpaceBetween,
+      label: __('Space between items')
+    });
+  }
+
   return createElement("fieldset", {
     className: "block-editor-hooks__flex-layout-justification-controls"
   }, createElement("legend", null, __('Justification')), createElement("div", null, justificationOptions.map(({
@@ -142,4 +190,48 @@ function FlexLayoutJustifyContentControl({
     });
   })));
 }
+
+function FlexWrapControl({
+  layout,
+  onChange
+}) {
+  const {
+    flexWrap = 'wrap'
+  } = layout;
+  return createElement(ToggleControl, {
+    label: __('Allow to wrap to multiple lines'),
+    onChange: value => {
+      onChange({ ...layout,
+        flexWrap: value ? 'wrap' : 'nowrap'
+      });
+    },
+    checked: flexWrap === 'wrap'
+  });
+}
+
+function OrientationControl({
+  layout,
+  onChange
+}) {
+  const {
+    orientation = 'horizontal'
+  } = layout;
+  return createElement("fieldset", {
+    className: "block-editor-hooks__flex-layout-orientation-controls"
+  }, createElement("legend", null, __('Orientation')), createElement(Button, {
+    label: 'horizontal',
+    icon: arrowRight,
+    isPressed: orientation === 'horizontal',
+    onClick: () => onChange({ ...layout,
+      orientation: 'horizontal'
+    })
+  }), createElement(Button, {
+    label: 'vertical',
+    icon: arrowDown,
+    isPressed: orientation === 'vertical',
+    onClick: () => onChange({ ...layout,
+      orientation: 'vertical'
+    })
+  }));
+}
 //# sourceMappingURL=flex.js.map

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

@@ -1 +1 @@
-{"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":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SACCC,WADD,EAECC,aAFD,EAGCC,YAHD,EAICC,mBAJD,QAKO,kBALP;AAMA,SAASC,MAAT,QAAuB,uBAAvB;AAEA;AACA;AACA;;AACA,SAASC,eAAT,QAAgC,SAAhC;AACA,OAAOC,UAAP,MAAuB,2BAAvB;AACA,SAASC,aAAT,EAAwBC,qBAAxB,QAAqD,eAArD;AAEA,MAAMC,iBAAiB,GAAG;AACzBC,EAAAA,IAAI,EAAE,YADmB;AAEzBC,EAAAA,KAAK,EAAE,UAFkB;AAGzBC,EAAAA,MAAM,EAAE,QAHiB;AAIzB,mBAAiB;AAJQ,CAA1B;AAOA,eAAe;AACdC,EAAAA,IAAI,EAAE,MADQ;AAEdC,EAAAA,KAAK,EAAEf,EAAE,CAAE,MAAF,CAFK;AAGdgB,EAAAA,iBAAiB,EAAE,SAASC,2BAAT,CAAsC;AACxDC,IAAAA,MAAM,GAAG,EAD+C;AAExDC,IAAAA;AAFwD,GAAtC,EAGf;AACH,WACC,cAAC,+BAAD;AACC,MAAA,MAAM,EAAGD,MADV;AAEC,MAAA,QAAQ,EAAGC;AAFZ,MADD;AAMA,GAba;AAcdC,EAAAA,eAAe,EAAE,SAASC,yBAAT,CAAoC;AACpDH,IAAAA,MAAM,GAAG,EAD2C;AAEpDC,IAAAA,QAFoD;AAGpDG,IAAAA;AAHoD,GAApC,EAIb;AACH,QAAKA,kBAAL,aAAKA,kBAAL,eAAKA,kBAAkB,CAAEC,cAAzB,EAA0C;AACzC,aAAO,IAAP;AACA;;AACD,WACC,cAAC,aAAD;AAAe,MAAA,KAAK,EAAC,OAArB;AAA6B,MAAA,kCAAkC;AAA/D,OACC,cAAC,+BAAD;AACC,MAAA,MAAM,EAAGL,MADV;AAEC,MAAA,QAAQ,EAAGC,QAFZ;AAGC,MAAA,SAAS;AAHV,MADD,CADD;AASA,GA/Ba;AAgCdK,EAAAA,IAAI,EAAE,SAASC,eAAT,CAA0B;AAAEC,IAAAA,QAAF;AAAYR,IAAAA;AAAZ,GAA1B,EAAiD;AACtD,UAAMS,eAAe,GAAGpB,UAAU,CAAE,kBAAF,CAAlC;AACA,UAAMqB,wBAAwB,GAAGD,eAAe,KAAK,IAArD;AACA,UAAME,cAAc,GACnBnB,iBAAiB,CAAEQ,MAAM,CAACW,cAAT,CAAjB,IAA8C,YAD/C;AAEA,WACC,6BAAU;AACb,MAAOvB,eAAe,CAAEoB,QAAF,CAAc;AACpC;AACA,YACME,wBAAwB,GACrB,sCADqB,GAErB,OACH;AACN;AACA;AACA;AACA,wBAAyBC,cAAgB;AACzC;AACA;AACA,MAAOvB,eAAe,CAAEoB,QAAF,EAAY,KAAZ,CAAqB;AAC3C;AACA;AACA,IAjBG,CADD;AAoBA,GAzDa;;AA0DdI,EAAAA,cAAc,GAAG;AAChB,WAAO,YAAP;AACA,GA5Da;;AA6DdC,EAAAA,aAAa,GAAG;AACf,WAAO,EAAP;AACA;;AA/Da,CAAf;AAkEA,MAAMC,oBAAoB,GAAG,CAC5B;AACCC,EAAAA,KAAK,EAAE,MADR;AAECC,EAAAA,IAAI,EAAEjC,WAFP;AAGCc,EAAAA,KAAK,EAAEf,EAAE,CAAE,oBAAF;AAHV,CAD4B,EAM5B;AACCiC,EAAAA,KAAK,EAAE,QADR;AAECC,EAAAA,IAAI,EAAEhC,aAFP;AAGCa,EAAAA,KAAK,EAAEf,EAAE,CAAE,sBAAF;AAHV,CAN4B,EAW5B;AACCiC,EAAAA,KAAK,EAAE,OADR;AAECC,EAAAA,IAAI,EAAE/B,YAFP;AAGCY,EAAAA,KAAK,EAAEf,EAAE,CAAE,qBAAF;AAHV,CAX4B,EAgB5B;AACCiC,EAAAA,KAAK,EAAE,eADR;AAECC,EAAAA,IAAI,EAAE9B,mBAFP;AAGCW,EAAAA,KAAK,EAAEf,EAAE,CAAE,qBAAF;AAHV,CAhB4B,CAA7B;;AAsBA,SAASmC,+BAAT,CAA0C;AACzCjB,EAAAA,MADyC;AAEzCC,EAAAA,QAFyC;AAGzCiB,EAAAA,SAAS,GAAG;AAH6B,CAA1C,EAII;AACH,QAAM;AAAEP,IAAAA,cAAc,GAAG;AAAnB,MAA8BX,MAApC;;AACA,QAAMmB,qBAAqB,GAAKJ,KAAF,IAAa;AAC1Cd,IAAAA,QAAQ,CAAE,EACT,GAAGD,MADM;AAETW,MAAAA,cAAc,EAAEI;AAFP,KAAF,CAAR;AAIA,GALD;;AAMA,MAAKG,SAAL,EAAiB;AAChB,WACC,cAAC,qBAAD;AACC,MAAA,eAAe,EAAG,CACjB,MADiB,EAEjB,QAFiB,EAGjB,OAHiB,EAIjB,eAJiB,CADnB;AAOC,MAAA,KAAK,EAAGP,cAPT;AAQC,MAAA,QAAQ,EAAGQ,qBARZ;AASC,MAAA,YAAY,EAAG;AACdC,QAAAA,QAAQ,EAAE,cADI;AAEdC,QAAAA,WAAW,EAAE;AAFC;AAThB,MADD;AAgBA;;AAED,SACC;AAAU,IAAA,SAAS,EAAC;AAApB,KACC,8BAAUvC,EAAE,CAAE,eAAF,CAAZ,CADD,EAEC,2BACGgC,oBAAoB,CAACQ,GAArB,CAA0B,CAAE;AAAEP,IAAAA,KAAF;AAASC,IAAAA,IAAT;AAAenB,IAAAA;AAAf,GAAF,KAA8B;AACzD,WACC,cAAC,MAAD;AACC,MAAA,GAAG,EAAGkB,KADP;AAEC,MAAA,KAAK,EAAGlB,KAFT;AAGC,MAAA,IAAI,EAAGmB,IAHR;AAIC,MAAA,SAAS,EAAGL,cAAc,KAAKI,KAJhC;AAKC,MAAA,OAAO,EAAG,MAAMI,qBAAqB,CAAEJ,KAAF;AALtC,MADD;AASA,GAVC,CADH,CAFD,CADD;AAkBA","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"]}
+{"version":3,"sources":["@wordpress/block-editor/src/layouts/flex.js"],"names":["__","justifyLeft","justifyCenter","justifyRight","justifySpaceBetween","arrowRight","arrowDown","Button","ToggleControl","Flex","FlexItem","appendSelectors","useSetting","BlockControls","JustifyContentControl","justifyContentMap","left","right","center","alignItemsMap","flexWrapOptions","name","label","inspectorControls","FlexLayoutInspectorControls","layout","onChange","allowOrientation","toolBarControls","FlexLayoutToolbarControls","layoutBlockSupport","allowSwitching","save","FlexLayoutStyle","selector","orientation","blockGapSupport","hasBlockGapStylesSupport","justifyContent","flexWrap","includes","rowOrientation","alignItems","columnOrientation","getOrientation","getAlignments","FlexLayoutJustifyContentControl","isToolbar","onJustificationChange","value","allowedControls","push","position","isAlternate","justificationOptions","icon","map","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 useSetting from '../components/use-setting';\nimport { BlockControls, JustifyContentControl } from '../components';\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 flexWrapOptions = [ 'wrap', 'nowrap' ];\n\nexport default {\n\tname: 'flex',\n\tlabel: __( 'Flex' ),\n\tinspectorControls: function FlexLayoutInspectorControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t} ) {\n\t\tconst { allowOrientation = true } = layout;\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\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 { orientation = 'horizontal' } = layout;\n\t\tconst blockGapSupport = useSetting( 'spacing.blockGap' );\n\t\tconst hasBlockGapStylesSupport = blockGapSupport !== null;\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\t// --justification-setting allows children to inherit the value\n\t\t// regardless or row or column direction.\n\t\tconst rowOrientation = `\n\t\tflex-direction: row;\n\t\talign-items: center;\n\t\tjustify-content: ${ justifyContent };\n\t\t--justification-setting: ${ 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--justification-setting: ${ alignItems };\n\t\t`;\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: ${ flexWrap };\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 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"]}