@wordpress/edit-site 3.0.1-next.253d9b6e21.0 → 3.0.3

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

@@ -0,0 +1,41 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalItemGroup as ItemGroup } from '@wordpress/components';
+import { typography, color, layout } from '@wordpress/icons';
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import { useHasBorderPanel } from './border-panel';
+import { useHasColorPanel } from './color-panel';
+import { useHasDimensionsPanel } from './dimensions-panel';
+import { useHasTypographyPanel } from './typography-panel';
+import NavigationButton from './navigation-button';
+
+function ContextMenu({
+  context,
+  parentMenu = ''
+}) {
+  const hasTypographyPanel = useHasTypographyPanel(context);
+  const hasColorPanel = useHasColorPanel(context);
+  const hasBorderPanel = useHasBorderPanel(context);
+  const hasDimensionsPanel = useHasDimensionsPanel(context);
+  const hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;
+  return createElement(ItemGroup, null, hasTypographyPanel && createElement(NavigationButton, {
+    icon: typography,
+    path: parentMenu + '/typography'
+  }, __('Typography')), hasColorPanel && createElement(NavigationButton, {
+    icon: color,
+    path: parentMenu + '/colors'
+  }, __('Colors')), hasLayoutPanel && createElement(NavigationButton, {
+    icon: layout,
+    path: parentMenu + '/layout'
+  }, __('Layout')));
+}
+
+export default ContextMenu;
+//# sourceMappingURL=context-menu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/context-menu.js"],"names":["__experimentalItemGroup","ItemGroup","typography","color","layout","__","useHasBorderPanel","useHasColorPanel","useHasDimensionsPanel","useHasTypographyPanel","NavigationButton","ContextMenu","context","parentMenu","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasDimensionsPanel","hasLayoutPanel"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,uBAAuB,IAAIC,SAApC,QAAqD,uBAArD;AACA,SAASC,UAAT,EAAqBC,KAArB,EAA4BC,MAA5B,QAA0C,kBAA1C;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,iBAAT,QAAkC,gBAAlC;AACA,SAASC,gBAAT,QAAiC,eAAjC;AACA,SAASC,qBAAT,QAAsC,oBAAtC;AACA,SAASC,qBAAT,QAAsC,oBAAtC;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;;AAEA,SAASC,WAAT,CAAsB;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,UAAU,GAAG;AAAxB,CAAtB,EAAqD;AACpD,QAAMC,kBAAkB,GAAGL,qBAAqB,CAAEG,OAAF,CAAhD;AACA,QAAMG,aAAa,GAAGR,gBAAgB,CAAEK,OAAF,CAAtC;AACA,QAAMI,cAAc,GAAGV,iBAAiB,CAAEM,OAAF,CAAxC;AACA,QAAMK,kBAAkB,GAAGT,qBAAqB,CAAEI,OAAF,CAAhD;AACA,QAAMM,cAAc,GAAGF,cAAc,IAAIC,kBAAzC;AAEA,SACC,cAAC,SAAD,QACGH,kBAAkB,IACnB,cAAC,gBAAD;AACC,IAAA,IAAI,EAAGZ,UADR;AAEC,IAAA,IAAI,EAAGW,UAAU,GAAG;AAFrB,KAIGR,EAAE,CAAE,YAAF,CAJL,CAFF,EASGU,aAAa,IACd,cAAC,gBAAD;AACC,IAAA,IAAI,EAAGZ,KADR;AAEC,IAAA,IAAI,EAAGU,UAAU,GAAG;AAFrB,KAIGR,EAAE,CAAE,QAAF,CAJL,CAVF,EAiBGa,cAAc,IACf,cAAC,gBAAD;AACC,IAAA,IAAI,EAAGd,MADR;AAEC,IAAA,IAAI,EAAGS,UAAU,GAAG;AAFrB,KAIGR,EAAE,CAAE,QAAF,CAJL,CAlBF,CADD;AA4BA;;AAED,eAAeM,WAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalItemGroup as ItemGroup } from '@wordpress/components';\nimport { typography, color, layout } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useHasBorderPanel } from './border-panel';\nimport { useHasColorPanel } from './color-panel';\nimport { useHasDimensionsPanel } from './dimensions-panel';\nimport { useHasTypographyPanel } from './typography-panel';\nimport NavigationButton from './navigation-button';\n\nfunction ContextMenu( { context, parentMenu = '' } ) {\n\tconst hasTypographyPanel = useHasTypographyPanel( context );\n\tconst hasColorPanel = useHasColorPanel( context );\n\tconst hasBorderPanel = useHasBorderPanel( context );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( context );\n\tconst hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;\n\n\treturn (\n\t\t<ItemGroup>\n\t\t\t{ hasTypographyPanel && (\n\t\t\t\t<NavigationButton\n\t\t\t\t\ticon={ typography }\n\t\t\t\t\tpath={ parentMenu + '/typography' }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t</NavigationButton>\n\t\t\t) }\n\t\t\t{ hasColorPanel && (\n\t\t\t\t<NavigationButton\n\t\t\t\t\ticon={ color }\n\t\t\t\t\tpath={ parentMenu + '/colors' }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t</NavigationButton>\n\t\t\t) }\n\t\t\t{ hasLayoutPanel && (\n\t\t\t\t<NavigationButton\n\t\t\t\t\ticon={ layout }\n\t\t\t\t\tpath={ parentMenu + '/layout' }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t</NavigationButton>\n\t\t\t) }\n\t\t</ItemGroup>\n\t);\n}\n\nexport default ContextMenu;\n"]}

package/build-module/components/{sidebar → global-styles}/dimensions-panel.js

@@ -4,17 +4,19 @@ import { createElement } from "@wordpress/element";
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, __experimentalBoxControl as BoxControl, __experimentalUseCustomUnits as useCustomUnits } from '@wordpress/components';
+import { __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, __experimentalBoxControl as BoxControl, __experimentalUnitControl as UnitControl, __experimentalUseCustomUnits as useCustomUnits } from '@wordpress/components';
 import { __experimentalUseCustomSides as useCustomSides } from '@wordpress/block-editor';
 /**
  * Internal dependencies
  */
 
 import { useSetting } from '../editor/utils';
+const AXIAL_SIDES = ['horizontal', 'vertical'];
 export function useHasDimensionsPanel(context) {
   const hasPadding = useHasPadding(context);
   const hasMargin = useHasMargin(context);
-  return hasPadding || hasMargin;
+  const hasGap = useHasGap(context);
+  return hasPadding || hasMargin || hasGap;
 }
 
 function useHasPadding({
@@ -33,6 +35,14 @@ function useHasMargin({
   return settings && supports.includes('margin');
 }
 
+function useHasGap({
+  name,
+  supports
+}) {
+  const settings = useSetting('spacing.blockGap', name);
+  return settings && supports.includes('--wp--style--block-gap');
+}
+
 function filterValuesBySides(values, sides) {
   if (!sides) {
     // If no custom side configuration all sides are opted into by default.
@@ -41,7 +51,19 @@ function filterValuesBySides(values, sides) {
 
 
   const filteredValues = {};
-  sides.forEach(side => filteredValues[side] = values[side]);
+  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;
 }
 
@@ -70,11 +92,13 @@ export default function DimensionsPanel({
   } = context;
   const showPaddingControl = useHasPadding(context);
   const showMarginControl = useHasMargin(context);
+  const showGapControl = useHasGap(context);
   const units = useCustomUnits({
     availableUnits: useSetting('spacing.units', name) || ['%', 'px', 'em', 'rem', 'vw']
   });
   const paddingValues = splitStyleValue(getStyle(name, 'padding'));
   const paddingSides = useCustomSides(name, 'padding');
+  const isAxialPadding = paddingSides && paddingSides.some(side => AXIAL_SIDES.includes(side));
 
   const setPaddingValues = newPaddingValues => {
     const padding = filterValuesBySides(newPaddingValues, paddingSides);
@@ -83,10 +107,11 @@ export default function DimensionsPanel({
 
   const resetPaddingValue = () => setPaddingValues({});
 
-  const hasPaddingValue = () => paddingValues && Object.keys(paddingValues).length;
+  const hasPaddingValue = () => !!paddingValues && Object.keys(paddingValues).length;
 
   const marginValues = splitStyleValue(getStyle(name, 'margin'));
   const marginSides = useCustomSides(name, 'margin');
+  const isAxialMargin = marginSides && marginSides.some(side => AXIAL_SIDES.includes(side));
 
   const setMarginValues = newMarginValues => {
     const margin = filterValuesBySides(newMarginValues, marginSides);
@@ -95,16 +120,26 @@ export default function DimensionsPanel({
 
   const resetMarginValue = () => setMarginValues({});
 
-  const hasMarginValue = () => marginValues && Object.keys(marginValues).length;
+  const hasMarginValue = () => !!marginValues && Object.keys(marginValues).length;
+
+  const gapValue = getStyle(name, '--wp--style--block-gap');
+
+  const setGapValue = newGapValue => {
+    setStyle(name, '--wp--style--block-gap', newGapValue);
+  };
+
+  const resetGapValue = () => setGapValue(undefined);
+
+  const hasGapValue = () => !!gapValue;
 
   const resetAll = () => {
     resetPaddingValue();
     resetMarginValue();
+    resetGapValue();
   };
 
   return createElement(ToolsPanel, {
-    label: __('Dimensions options'),
-    header: __('Dimensions'),
+    label: __('Dimensions'),
     resetAll: resetAll
   }, showPaddingControl && createElement(ToolsPanelItem, {
     hasValue: hasPaddingValue,
@@ -117,7 +152,8 @@ export default function DimensionsPanel({
     label: __('Padding'),
     sides: paddingSides,
     units: units,
-    allowReset: false
+    allowReset: false,
+    splitOnAxis: isAxialPadding
   })), showMarginControl && createElement(ToolsPanelItem, {
     hasValue: hasMarginValue,
     label: __('Margin'),
@@ -129,7 +165,20 @@ export default function DimensionsPanel({
     label: __('Margin'),
     sides: marginSides,
     units: units,
-    allowReset: false
+    allowReset: false,
+    splitOnAxis: isAxialMargin
+  })), showGapControl && createElement(ToolsPanelItem, {
+    hasValue: hasGapValue,
+    label: __('Block spacing'),
+    onDeselect: resetGapValue,
+    isShownByDefault: true
+  }, createElement(UnitControl, {
+    label: __('Block spacing'),
+    __unstableInputWidth: "80px",
+    min: 0,
+    onChange: setGapValue,
+    units: units,
+    value: gapValue
   })));
 }
 //# sourceMappingURL=dimensions-panel.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/dimensions-panel.js"],"names":["__","__experimentalToolsPanel","ToolsPanel","__experimentalToolsPanelItem","ToolsPanelItem","__experimentalBoxControl","BoxControl","__experimentalUnitControl","UnitControl","__experimentalUseCustomUnits","useCustomUnits","__experimentalUseCustomSides","useCustomSides","useSetting","AXIAL_SIDES","useHasDimensionsPanel","context","hasPadding","useHasPadding","hasMargin","useHasMargin","hasGap","useHasGap","name","supports","settings","includes","filterValuesBySides","values","sides","filteredValues","forEach","side","top","bottom","left","right","splitStyleValue","value","DimensionsPanel","getStyle","setStyle","showPaddingControl","showMarginControl","showGapControl","units","availableUnits","paddingValues","paddingSides","isAxialPadding","some","setPaddingValues","newPaddingValues","padding","resetPaddingValue","hasPaddingValue","Object","keys","length","marginValues","marginSides","isAxialMargin","setMarginValues","newMarginValues","margin","resetMarginValue","hasMarginValue","gapValue","setGapValue","newGapValue","resetGapValue","undefined","hasGapValue","resetAll"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalBoxControl as BoxControl,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n} from '@wordpress/components';\nimport { __experimentalUseCustomSides as useCustomSides } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { useSetting } from '../editor/utils';\n\nconst AXIAL_SIDES = [ 'horizontal', 'vertical' ];\n\nexport function useHasDimensionsPanel( context ) {\n\tconst hasPadding = useHasPadding( context );\n\tconst hasMargin = useHasMargin( context );\n\tconst hasGap = useHasGap( context );\n\n\treturn hasPadding || hasMargin || hasGap;\n}\n\nfunction useHasPadding( { name, supports } ) {\n\tconst settings = useSetting( 'spacing.customPadding', name );\n\n\treturn settings && supports.includes( 'padding' );\n}\n\nfunction useHasMargin( { name, supports } ) {\n\tconst settings = useSetting( 'spacing.customMargin', name );\n\n\treturn settings && supports.includes( 'margin' );\n}\n\nfunction useHasGap( { name, supports } ) {\n\tconst settings = useSetting( 'spacing.blockGap', name );\n\n\treturn settings && supports.includes( '--wp--style--block-gap' );\n}\n\nfunction filterValuesBySides( values, sides ) {\n\tif ( ! sides ) {\n\t\t// If no custom side configuration all sides are opted into by default.\n\t\treturn values;\n\t}\n\n\t// Only include sides opted into within filtered values.\n\tconst filteredValues = {};\n\tsides.forEach( ( side ) => {\n\t\tif ( side === 'vertical' ) {\n\t\t\tfilteredValues.top = values.top;\n\t\t\tfilteredValues.bottom = values.bottom;\n\t\t}\n\t\tif ( side === 'horizontal' ) {\n\t\t\tfilteredValues.left = values.left;\n\t\t\tfilteredValues.right = values.right;\n\t\t}\n\t\tfilteredValues[ side ] = values[ side ];\n\t} );\n\n\treturn filteredValues;\n}\n\nfunction splitStyleValue( value ) {\n\t// Check for shorthand value ( a string value ).\n\tif ( value && typeof value === 'string' ) {\n\t\t// Convert to value for individual sides for BoxControl.\n\t\treturn {\n\t\t\ttop: value,\n\t\t\tright: value,\n\t\t\tbottom: value,\n\t\t\tleft: value,\n\t\t};\n\t}\n\n\treturn value;\n}\n\nexport default function DimensionsPanel( { context, getStyle, setStyle } ) {\n\tconst { name } = context;\n\tconst showPaddingControl = useHasPadding( context );\n\tconst showMarginControl = useHasMargin( context );\n\tconst showGapControl = useHasGap( context );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units', name ) || [\n\t\t\t'%',\n\t\t\t'px',\n\t\t\t'em',\n\t\t\t'rem',\n\t\t\t'vw',\n\t\t],\n\t} );\n\n\tconst paddingValues = splitStyleValue( getStyle( name, 'padding' ) );\n\tconst paddingSides = useCustomSides( name, 'padding' );\n\tconst isAxialPadding =\n\t\tpaddingSides &&\n\t\tpaddingSides.some( ( side ) => AXIAL_SIDES.includes( side ) );\n\n\tconst setPaddingValues = ( newPaddingValues ) => {\n\t\tconst padding = filterValuesBySides( newPaddingValues, paddingSides );\n\t\tsetStyle( name, 'padding', padding );\n\t};\n\tconst resetPaddingValue = () => setPaddingValues( {} );\n\tconst hasPaddingValue = () =>\n\t\t!! paddingValues && Object.keys( paddingValues ).length;\n\n\tconst marginValues = splitStyleValue( getStyle( name, 'margin' ) );\n\tconst marginSides = useCustomSides( name, 'margin' );\n\tconst isAxialMargin =\n\t\tmarginSides &&\n\t\tmarginSides.some( ( side ) => AXIAL_SIDES.includes( side ) );\n\n\tconst setMarginValues = ( newMarginValues ) => {\n\t\tconst margin = filterValuesBySides( newMarginValues, marginSides );\n\t\tsetStyle( name, 'margin', margin );\n\t};\n\tconst resetMarginValue = () => setMarginValues( {} );\n\tconst hasMarginValue = () =>\n\t\t!! marginValues && Object.keys( marginValues ).length;\n\n\tconst gapValue = getStyle( name, '--wp--style--block-gap' );\n\n\tconst setGapValue = ( newGapValue ) => {\n\t\tsetStyle( name, '--wp--style--block-gap', newGapValue );\n\t};\n\tconst resetGapValue = () => setGapValue( undefined );\n\tconst hasGapValue = () => !! gapValue;\n\n\tconst resetAll = () => {\n\t\tresetPaddingValue();\n\t\tresetMarginValue();\n\t\tresetGapValue();\n\t};\n\n\treturn (\n\t\t<ToolsPanel label={ __( 'Dimensions' ) } resetAll={ resetAll }>\n\t\t\t{ showPaddingControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ hasPaddingValue }\n\t\t\t\t\tlabel={ __( 'Padding' ) }\n\t\t\t\t\tonDeselect={ resetPaddingValue }\n\t\t\t\t\tisShownByDefault={ true }\n\t\t\t\t>\n\t\t\t\t\t<BoxControl\n\t\t\t\t\t\tvalues={ paddingValues }\n\t\t\t\t\t\tonChange={ setPaddingValues }\n\t\t\t\t\t\tlabel={ __( 'Padding' ) }\n\t\t\t\t\t\tsides={ paddingSides }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tallowReset={ false }\n\t\t\t\t\t\tsplitOnAxis={ isAxialPadding }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showMarginControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ hasMarginValue }\n\t\t\t\t\tlabel={ __( 'Margin' ) }\n\t\t\t\t\tonDeselect={ resetMarginValue }\n\t\t\t\t\tisShownByDefault={ true }\n\t\t\t\t>\n\t\t\t\t\t<BoxControl\n\t\t\t\t\t\tvalues={ marginValues }\n\t\t\t\t\t\tonChange={ setMarginValues }\n\t\t\t\t\t\tlabel={ __( 'Margin' ) }\n\t\t\t\t\t\tsides={ marginSides }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tallowReset={ false }\n\t\t\t\t\t\tsplitOnAxis={ isAxialMargin }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showGapControl && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ hasGapValue }\n\t\t\t\t\tlabel={ __( 'Block spacing' ) }\n\t\t\t\t\tonDeselect={ resetGapValue }\n\t\t\t\t\tisShownByDefault={ true }\n\t\t\t\t>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tlabel={ __( 'Block spacing' ) }\n\t\t\t\t\t\t__unstableInputWidth=\"80px\"\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ setGapValue }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tvalue={ gapValue }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n}\n"]}

package/build-module/components/global-styles/header.js

@@ -0,0 +1,41 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalSpacer as Spacer, __experimentalHeading as Heading, __experimentalView as View } from '@wordpress/components';
+import { isRTL, __ } from '@wordpress/i18n';
+import { chevronRight, chevronLeft, Icon } from '@wordpress/icons';
+/**
+ * Internal dependencies
+ */
+
+import NavigationButton from './navigation-button';
+
+function ScreenHeader({
+  back,
+  title,
+  description
+}) {
+  return createElement(VStack, {
+    spacing: 2
+  }, createElement(HStack, {
+    spacing: 2
+  }, createElement(View, null, createElement(NavigationButton, {
+    path: back,
+    icon: createElement(Icon, {
+      icon: isRTL() ? chevronRight : chevronLeft,
+      variant: "muted"
+    }),
+    size: "small",
+    isBack: true,
+    "aria-label": __('Navigate to the previous view')
+  })), createElement(Spacer, null, createElement(Heading, {
+    level: 5
+  }, title))), description && createElement("p", {
+    className: "edit-site-global-styles-header__description"
+  }, description));
+}
+
+export default ScreenHeader;
+//# sourceMappingURL=header.js.map

package/build-module/components/global-styles/header.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/header.js"],"names":["__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalSpacer","Spacer","__experimentalHeading","Heading","__experimentalView","View","isRTL","__","chevronRight","chevronLeft","Icon","NavigationButton","ScreenHeader","back","title","description"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,oBAAoB,IAAIC,MADzB,EAECC,oBAAoB,IAAIC,MAFzB,EAGCC,oBAAoB,IAAIC,MAHzB,EAICC,qBAAqB,IAAIC,OAJ1B,EAKCC,kBAAkB,IAAIC,IALvB,QAMO,uBANP;AAOA,SAASC,KAAT,EAAgBC,EAAhB,QAA0B,iBAA1B;AACA,SAASC,YAAT,EAAuBC,WAAvB,EAAoCC,IAApC,QAAgD,kBAAhD;AAEA;AACA;AACA;;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;;AAEA,SAASC,YAAT,CAAuB;AAAEC,EAAAA,IAAF;AAAQC,EAAAA,KAAR;AAAeC,EAAAA;AAAf,CAAvB,EAAsD;AACrD,SACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,IAAD,QACC,cAAC,gBAAD;AACC,IAAA,IAAI,EAAGF,IADR;AAEC,IAAA,IAAI,EACH,cAAC,IAAD;AACC,MAAA,IAAI,EAAGP,KAAK,KAAKE,YAAL,GAAoBC,WADjC;AAEC,MAAA,OAAO,EAAC;AAFT,MAHF;AAQC,IAAA,IAAI,EAAC,OARN;AASC,IAAA,MAAM,MATP;AAUC,kBAAaF,EAAE,CAAE,+BAAF;AAVhB,IADD,CADD,EAeC,cAAC,MAAD,QACC,cAAC,OAAD;AAAS,IAAA,KAAK,EAAG;AAAjB,KAAuBO,KAAvB,CADD,CAfD,CADD,EAoBGC,WAAW,IACZ;AAAG,IAAA,SAAS,EAAC;AAAb,KACGA,WADH,CArBF,CADD;AA4BA;;AAED,eAAeH,YAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalHeading as Heading,\n\t__experimentalView as View,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft, Icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport NavigationButton from './navigation-button';\n\nfunction ScreenHeader( { back, title, description } ) {\n\treturn (\n\t\t<VStack spacing={ 2 }>\n\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t<View>\n\t\t\t\t\t<NavigationButton\n\t\t\t\t\t\tpath={ back }\n\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tisBack\n\t\t\t\t\t\taria-label={ __( 'Navigate to the previous view' ) }\n\t\t\t\t\t/>\n\t\t\t\t</View>\n\t\t\t\t<Spacer>\n\t\t\t\t\t<Heading level={ 5 }>{ title }</Heading>\n\t\t\t\t</Spacer>\n\t\t\t</HStack>\n\t\t\t{ description && (\n\t\t\t\t<p className=\"edit-site-global-styles-header__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default ScreenHeader;\n"]}

package/build-module/components/global-styles/index.js

@@ -0,0 +1,70 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * External dependencies
+ */
+import { map } from 'lodash';
+/**
+ * WordPress dependencies
+ */
+
+import { __experimentalNavigatorProvider as NavigatorProvider, __experimentalNavigatorScreen as NavigatorScreen } from '@wordpress/components';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import ScreenRoot from './screen-root';
+import ScreenBlockList from './screen-block-list';
+import ScreenBlock from './screen-block';
+import ScreenTypography from './screen-typography';
+import ScreenColors from './screen-colors';
+import ScreenColorPalette from './screen-color-palette';
+import ScreenLayout from './screen-layout';
+
+function ContextScreens({
+  name
+}) {
+  const parentMenu = name === undefined ? '' : '/blocks/' + name;
+  return createElement(Fragment, null, createElement(NavigatorScreen, {
+    path: parentMenu + '/typography'
+  }, createElement(ScreenTypography, {
+    name: name
+  })), createElement(NavigatorScreen, {
+    path: parentMenu + '/colors'
+  }, createElement(ScreenColors, {
+    name: name
+  })), createElement(NavigatorScreen, {
+    path: parentMenu + '/colors/palette'
+  }, createElement(ScreenColorPalette, {
+    name: name
+  })), createElement(NavigatorScreen, {
+    path: parentMenu + '/layout'
+  }, createElement(ScreenLayout, {
+    name: name
+  })));
+}
+
+function GlobalStyles() {
+  const {
+    blocks
+  } = useGlobalStylesContext();
+  return createElement(NavigatorProvider, {
+    initialPath: "/"
+  }, createElement(NavigatorScreen, {
+    path: "/"
+  }, createElement(ScreenRoot, null)), createElement(NavigatorScreen, {
+    path: "/blocks"
+  }, createElement(ScreenBlockList, null)), map(blocks, (block, name) => createElement(NavigatorScreen, {
+    key: 'menu-block-' + name,
+    path: '/blocks/' + name
+  }, createElement(ScreenBlock, {
+    name: name
+  }))), createElement(ContextScreens, null), map(blocks, (_, name) => createElement(ContextScreens, {
+    key: 'screens-block-' + name,
+    name: name
+  })));
+}
+
+export default GlobalStyles;
+//# sourceMappingURL=index.js.map

package/build-module/components/global-styles/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/index.js"],"names":["map","__experimentalNavigatorProvider","NavigatorProvider","__experimentalNavigatorScreen","NavigatorScreen","useGlobalStylesContext","ScreenRoot","ScreenBlockList","ScreenBlock","ScreenTypography","ScreenColors","ScreenColorPalette","ScreenLayout","ContextScreens","name","parentMenu","undefined","GlobalStyles","blocks","block","_"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,QAApB;AAEA;AACA;AACA;;AACA,SACCC,+BAA+B,IAAIC,iBADpC,EAECC,6BAA6B,IAAIC,eAFlC,QAGO,uBAHP;AAKA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AACA,OAAOC,WAAP,MAAwB,gBAAxB;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;AACA,OAAOC,YAAP,MAAyB,iBAAzB;AACA,OAAOC,kBAAP,MAA+B,wBAA/B;AACA,OAAOC,YAAP,MAAyB,iBAAzB;;AAEA,SAASC,cAAT,CAAyB;AAAEC,EAAAA;AAAF,CAAzB,EAAoC;AACnC,QAAMC,UAAU,GAAGD,IAAI,KAAKE,SAAT,GAAqB,EAArB,GAA0B,aAAaF,IAA1D;AAEA,SACC,8BACC,cAAC,eAAD;AAAiB,IAAA,IAAI,EAAGC,UAAU,GAAG;AAArC,KACC,cAAC,gBAAD;AAAkB,IAAA,IAAI,EAAGD;AAAzB,IADD,CADD,EAKC,cAAC,eAAD;AAAiB,IAAA,IAAI,EAAGC,UAAU,GAAG;AAArC,KACC,cAAC,YAAD;AAAc,IAAA,IAAI,EAAGD;AAArB,IADD,CALD,EASC,cAAC,eAAD;AAAiB,IAAA,IAAI,EAAGC,UAAU,GAAG;AAArC,KACC,cAAC,kBAAD;AAAoB,IAAA,IAAI,EAAGD;AAA3B,IADD,CATD,EAaC,cAAC,eAAD;AAAiB,IAAA,IAAI,EAAGC,UAAU,GAAG;AAArC,KACC,cAAC,YAAD;AAAc,IAAA,IAAI,EAAGD;AAArB,IADD,CAbD,CADD;AAmBA;;AAED,SAASG,YAAT,GAAwB;AACvB,QAAM;AAAEC,IAAAA;AAAF,MAAab,sBAAsB,EAAzC;AAEA,SACC,cAAC,iBAAD;AAAmB,IAAA,WAAW,EAAC;AAA/B,KACC,cAAC,eAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,cAAC,UAAD,OADD,CADD,EAKC,cAAC,eAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,cAAC,eAAD,OADD,CALD,EASGL,GAAG,CAAEkB,MAAF,EAAU,CAAEC,KAAF,EAASL,IAAT,KACd,cAAC,eAAD;AACC,IAAA,GAAG,EAAG,gBAAgBA,IADvB;AAEC,IAAA,IAAI,EAAG,aAAaA;AAFrB,KAIC,cAAC,WAAD;AAAa,IAAA,IAAI,EAAGA;AAApB,IAJD,CADI,CATN,EAkBC,cAAC,cAAD,OAlBD,EAoBGd,GAAG,CAAEkB,MAAF,EAAU,CAAEE,CAAF,EAAKN,IAAL,KACd,cAAC,cAAD;AAAgB,IAAA,GAAG,EAAG,mBAAmBA,IAAzC;AAAgD,IAAA,IAAI,EAAGA;AAAvD,IADI,CApBN,CADD;AA0BA;;AAED,eAAeG,YAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { map } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalNavigatorProvider as NavigatorProvider,\n\t__experimentalNavigatorScreen as NavigatorScreen,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport ScreenRoot from './screen-root';\nimport ScreenBlockList from './screen-block-list';\nimport ScreenBlock from './screen-block';\nimport ScreenTypography from './screen-typography';\nimport ScreenColors from './screen-colors';\nimport ScreenColorPalette from './screen-color-palette';\nimport ScreenLayout from './screen-layout';\n\nfunction ContextScreens( { name } ) {\n\tconst parentMenu = name === undefined ? '' : '/blocks/' + name;\n\n\treturn (\n\t\t<>\n\t\t\t<NavigatorScreen path={ parentMenu + '/typography' }>\n\t\t\t\t<ScreenTypography name={ name } />\n\t\t\t</NavigatorScreen>\n\n\t\t\t<NavigatorScreen path={ parentMenu + '/colors' }>\n\t\t\t\t<ScreenColors name={ name } />\n\t\t\t</NavigatorScreen>\n\n\t\t\t<NavigatorScreen path={ parentMenu + '/colors/palette' }>\n\t\t\t\t<ScreenColorPalette name={ name } />\n\t\t\t</NavigatorScreen>\n\n\t\t\t<NavigatorScreen path={ parentMenu + '/layout' }>\n\t\t\t\t<ScreenLayout name={ name } />\n\t\t\t</NavigatorScreen>\n\t\t</>\n\t);\n}\n\nfunction GlobalStyles() {\n\tconst { blocks } = useGlobalStylesContext();\n\n\treturn (\n\t\t<NavigatorProvider initialPath=\"/\">\n\t\t\t<NavigatorScreen path=\"/\">\n\t\t\t\t<ScreenRoot />\n\t\t\t</NavigatorScreen>\n\n\t\t\t<NavigatorScreen path=\"/blocks\">\n\t\t\t\t<ScreenBlockList />\n\t\t\t</NavigatorScreen>\n\n\t\t\t{ map( blocks, ( block, name ) => (\n\t\t\t\t<NavigatorScreen\n\t\t\t\t\tkey={ 'menu-block-' + name }\n\t\t\t\t\tpath={ '/blocks/' + name }\n\t\t\t\t>\n\t\t\t\t\t<ScreenBlock name={ name } />\n\t\t\t\t</NavigatorScreen>\n\t\t\t) ) }\n\n\t\t\t<ContextScreens />\n\n\t\t\t{ map( blocks, ( _, name ) => (\n\t\t\t\t<ContextScreens key={ 'screens-block-' + name } name={ name } />\n\t\t\t) ) }\n\t\t</NavigatorProvider>\n\t);\n}\n\nexport default GlobalStyles;\n"]}

package/build-module/components/global-styles/navigation-button.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalUseNavigator as useNavigator, __experimentalItem as Item, FlexItem, __experimentalHStack as HStack } from '@wordpress/components';
+import { Icon } from '@wordpress/icons';
+
+function NavigationButton({
+  path,
+  icon,
+  children,
+  isBack = false,
+  ...props
+}) {
+  const navigator = useNavigator();
+  return createElement(Item, _extends({
+    onClick: () => navigator.push(path, {
+      isBack
+    })
+  }, props), icon && createElement(HStack, {
+    justify: "flex-start"
+  }, createElement(FlexItem, null, createElement(Icon, {
+    icon: icon,
+    size: 24
+  })), createElement(FlexItem, null, children)), !icon && children);
+}
+
+export default NavigationButton;
+//# sourceMappingURL=navigation-button.js.map

package/build-module/components/global-styles/navigation-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/navigation-button.js"],"names":["__experimentalUseNavigator","useNavigator","__experimentalItem","Item","FlexItem","__experimentalHStack","HStack","Icon","NavigationButton","path","icon","children","isBack","props","navigator","push"],"mappings":";;;AAAA;AACA;AACA;AACA,SACCA,0BAA0B,IAAIC,YAD/B,EAECC,kBAAkB,IAAIC,IAFvB,EAGCC,QAHD,EAICC,oBAAoB,IAAIC,MAJzB,QAKO,uBALP;AAMA,SAASC,IAAT,QAAqB,kBAArB;;AAEA,SAASC,gBAAT,CAA2B;AAC1BC,EAAAA,IAD0B;AAE1BC,EAAAA,IAF0B;AAG1BC,EAAAA,QAH0B;AAI1BC,EAAAA,MAAM,GAAG,KAJiB;AAK1B,KAAGC;AALuB,CAA3B,EAMI;AACH,QAAMC,SAAS,GAAGb,YAAY,EAA9B;AACA,SACC,cAAC,IAAD;AAAM,IAAA,OAAO,EAAG,MAAMa,SAAS,CAACC,IAAV,CAAgBN,IAAhB,EAAsB;AAAEG,MAAAA;AAAF,KAAtB;AAAtB,KAAgEC,KAAhE,GACGH,IAAI,IACL,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,cAAC,QAAD,QACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGA,IAAb;AAAoB,IAAA,IAAI,EAAG;AAA3B,IADD,CADD,EAIC,cAAC,QAAD,QAAYC,QAAZ,CAJD,CAFF,EASG,CAAED,IAAF,IAAUC,QATb,CADD;AAaA;;AAED,eAAeH,gBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalUseNavigator as useNavigator,\n\t__experimentalItem as Item,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { Icon } from '@wordpress/icons';\n\nfunction NavigationButton( {\n\tpath,\n\ticon,\n\tchildren,\n\tisBack = false,\n\t...props\n} ) {\n\tconst navigator = useNavigator();\n\treturn (\n\t\t<Item onClick={ () => navigator.push( path, { isBack } ) } { ...props }>\n\t\t\t{ icon && (\n\t\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Icon icon={ icon } size={ 24 } />\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>{ children }</FlexItem>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ ! icon && children }\n\t\t</Item>\n\t);\n}\n\nexport default NavigationButton;\n"]}

package/build-module/components/global-styles/palette.js

@@ -0,0 +1,43 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalItemGroup as ItemGroup, FlexItem, __experimentalHStack as HStack, __experimentalZStack as ZStack, __experimentalVStack as VStack, FlexBlock, ColorIndicator } from '@wordpress/components';
+import { __, _n, sprintf } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import Subtitle from './subtitle';
+import { useSetting } from '../editor/utils';
+import NavigationButton from './navigation-button';
+
+function Palette({
+  contextName
+}) {
+  const colors = useSetting('color.palette', contextName);
+  const screenPath = contextName === 'root' ? '/colors/palette' : '/blocks/' + contextName + '/colors/palette';
+  return createElement("div", {
+    className: "edit-site-global-style-palette"
+  }, createElement(VStack, {
+    spacing: 1
+  }, createElement(Subtitle, null, __('Palette')), createElement(ItemGroup, {
+    isBordered: true,
+    isSeparated: true
+  }, createElement(NavigationButton, {
+    path: screenPath
+  }, createElement(HStack, null, createElement(FlexBlock, null, createElement(ZStack, {
+    isLayered: false,
+    offset: -8
+  }, colors.slice(0, 5).map(({
+    color
+  }) => createElement(ColorIndicator, {
+    key: color,
+    colorValue: color
+  })))), createElement(FlexItem, null, sprintf( // Translators: %d: Number of palette colors.
+  _n('%d color', '%d colors', colors.length), colors.length)))))));
+}
+
+export default Palette;
+//# sourceMappingURL=palette.js.map

package/build-module/components/global-styles/palette.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/palette.js"],"names":["__experimentalItemGroup","ItemGroup","FlexItem","__experimentalHStack","HStack","__experimentalZStack","ZStack","__experimentalVStack","VStack","FlexBlock","ColorIndicator","__","_n","sprintf","Subtitle","useSetting","NavigationButton","Palette","contextName","colors","screenPath","slice","map","color","length"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,uBAAuB,IAAIC,SAD5B,EAECC,QAFD,EAGCC,oBAAoB,IAAIC,MAHzB,EAICC,oBAAoB,IAAIC,MAJzB,EAKCC,oBAAoB,IAAIC,MALzB,EAMCC,SAND,EAOCC,cAPD,QAQO,uBARP;AASA,SAASC,EAAT,EAAaC,EAAb,EAAiBC,OAAjB,QAAgC,iBAAhC;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAASC,UAAT,QAA2B,iBAA3B;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;;AAEA,SAASC,OAAT,CAAkB;AAAEC,EAAAA;AAAF,CAAlB,EAAoC;AACnC,QAAMC,MAAM,GAAGJ,UAAU,CAAE,eAAF,EAAmBG,WAAnB,CAAzB;AACA,QAAME,UAAU,GACfF,WAAW,KAAK,MAAhB,GACG,iBADH,GAEG,aAAaA,WAAb,GAA2B,iBAH/B;AAKA,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,QAAD,QAAYP,EAAE,CAAE,SAAF,CAAd,CADD,EAEC,cAAC,SAAD;AAAW,IAAA,UAAU,MAArB;AAAsB,IAAA,WAAW;AAAjC,KACC,cAAC,gBAAD;AAAkB,IAAA,IAAI,EAAGS;AAAzB,KACC,cAAC,MAAD,QACC,cAAC,SAAD,QACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAG,KAApB;AAA4B,IAAA,MAAM,EAAG,CAAC;AAAtC,KACGD,MAAM,CACNE,KADA,CACO,CADP,EACU,CADV,EAEAC,GAFA,CAEK,CAAE;AAAEC,IAAAA;AAAF,GAAF,KACL,cAAC,cAAD;AACC,IAAA,GAAG,EAAGA,KADP;AAEC,IAAA,UAAU,EAAGA;AAFd,IAHA,CADH,CADD,CADD,EAaC,cAAC,QAAD,QACGV,OAAO,EACR;AACAD,EAAAA,EAAE,CACD,UADC,EAED,WAFC,EAGDO,MAAM,CAACK,MAHN,CAFM,EAORL,MAAM,CAACK,MAPC,CADV,CAbD,CADD,CADD,CAFD,CADD,CADD;AAoCA;;AAED,eAAeP,OAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n\t__experimentalZStack as ZStack,\n\t__experimentalVStack as VStack,\n\tFlexBlock,\n\tColorIndicator,\n} from '@wordpress/components';\nimport { __, _n, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Subtitle from './subtitle';\nimport { useSetting } from '../editor/utils';\nimport NavigationButton from './navigation-button';\n\nfunction Palette( { contextName } ) {\n\tconst colors = useSetting( 'color.palette', contextName );\n\tconst screenPath =\n\t\tcontextName === 'root'\n\t\t\t? '/colors/palette'\n\t\t\t: '/blocks/' + contextName + '/colors/palette';\n\n\treturn (\n\t\t<div className=\"edit-site-global-style-palette\">\n\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t<Subtitle>{ __( 'Palette' ) }</Subtitle>\n\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t<NavigationButton path={ screenPath }>\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t\t\t\t\t{ colors\n\t\t\t\t\t\t\t\t\t\t.slice( 0, 5 )\n\t\t\t\t\t\t\t\t\t\t.map( ( { color } ) => (\n\t\t\t\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ color }\n\t\t\t\t\t\t\t\t\t\t\t\tcolorValue={ color }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</ZStack>\n\t\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t\t\t// Translators: %d: Number of palette colors.\n\t\t\t\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t\t\t\t'%d color',\n\t\t\t\t\t\t\t\t\t\t'%d colors',\n\t\t\t\t\t\t\t\t\t\tcolors.length\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\tcolors.length\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</NavigationButton>\n\t\t\t\t</ItemGroup>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n\nexport default Palette;\n"]}

package/build-module/components/global-styles/preview.js

@@ -0,0 +1,50 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalHStack as HStack, __experimentalVStack as VStack, Card, ColorIndicator } from '@wordpress/components';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+
+const StylesPreview = () => {
+  var _getStyle, _getStyle2, _getStyle3, _getStyle4;
+
+  const {
+    getStyle
+  } = useGlobalStylesContext();
+  const fontFamily = (_getStyle = getStyle('root', 'fontFamily')) !== null && _getStyle !== void 0 ? _getStyle : 'serif';
+  const textColor = (_getStyle2 = getStyle('root', 'color')) !== null && _getStyle2 !== void 0 ? _getStyle2 : 'black';
+  const linkColor = (_getStyle3 = getStyle('root', 'linkColor')) !== null && _getStyle3 !== void 0 ? _getStyle3 : 'blue';
+  const backgroundColor = (_getStyle4 = getStyle('root', 'backgroundColor')) !== null && _getStyle4 !== void 0 ? _getStyle4 : 'white';
+  return createElement(Card, {
+    className: "edit-site-global-styles-preview",
+    style: {
+      background: backgroundColor
+    }
+  }, createElement(HStack, {
+    spacing: 5
+  }, createElement("div", null, createElement("span", {
+    style: {
+      fontFamily,
+      fontSize: '80px'
+    }
+  }, "A"), createElement("span", {
+    style: {
+      fontFamily,
+      fontSize: '80px'
+    }
+  }, "a")), createElement(VStack, {
+    spacing: 2
+  }, createElement(ColorIndicator, {
+    colorValue: textColor
+  }), createElement(ColorIndicator, {
+    colorValue: linkColor
+  }))));
+};
+
+export default StylesPreview;
+//# sourceMappingURL=preview.js.map

package/build-module/components/global-styles/preview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["__experimentalHStack","HStack","__experimentalVStack","VStack","Card","ColorIndicator","useGlobalStylesContext","StylesPreview","getStyle","fontFamily","textColor","linkColor","backgroundColor","background","fontSize"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,oBAAoB,IAAIC,MADzB,EAECC,oBAAoB,IAAIC,MAFzB,EAGCC,IAHD,EAICC,cAJD,QAKO,uBALP;AAOA;AACA;AACA;;AAAI,SAASC,sBAAT,QAAuC,kCAAvC;;AAEJ,MAAMC,aAAa,GAAG,MAAM;AAAA;;AAC3B,QAAM;AAAEC,IAAAA;AAAF,MAAeF,sBAAsB,EAA3C;AACA,QAAMG,UAAU,gBAAGD,QAAQ,CAAE,MAAF,EAAU,YAAV,CAAX,iDAAuC,OAAvD;AACA,QAAME,SAAS,iBAAGF,QAAQ,CAAE,MAAF,EAAU,OAAV,CAAX,mDAAkC,OAAjD;AACA,QAAMG,SAAS,iBAAGH,QAAQ,CAAE,MAAF,EAAU,WAAV,CAAX,mDAAsC,MAArD;AACA,QAAMI,eAAe,iBAAGJ,QAAQ,CAAE,MAAF,EAAU,iBAAV,CAAX,mDAA4C,OAAjE;AAEA,SACC,cAAC,IAAD;AACC,IAAA,SAAS,EAAC,iCADX;AAEC,IAAA,KAAK,EAAG;AAAEK,MAAAA,UAAU,EAAED;AAAd;AAFT,KAIC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,2BACC;AAAM,IAAA,KAAK,EAAG;AAAEH,MAAAA,UAAF;AAAcK,MAAAA,QAAQ,EAAE;AAAxB;AAAd,SADD,EAEC;AAAM,IAAA,KAAK,EAAG;AAAEL,MAAAA,UAAF;AAAcK,MAAAA,QAAQ,EAAE;AAAxB;AAAd,SAFD,CADD,EAKC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGJ;AAA7B,IADD,EAEC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGC;AAA7B,IAFD,CALD,CAJD,CADD;AAiBA,CAxBD;;AA0BA,eAAeJ,aAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tCard,\n\tColorIndicator,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */ import { useGlobalStylesContext } from '../editor/global-styles-provider';\n\nconst StylesPreview = () => {\n\tconst { getStyle } = useGlobalStylesContext();\n\tconst fontFamily = getStyle( 'root', 'fontFamily' ) ?? 'serif';\n\tconst textColor = getStyle( 'root', 'color' ) ?? 'black';\n\tconst linkColor = getStyle( 'root', 'linkColor' ) ?? 'blue';\n\tconst backgroundColor = getStyle( 'root', 'backgroundColor' ) ?? 'white';\n\n\treturn (\n\t\t<Card\n\t\t\tclassName=\"edit-site-global-styles-preview\"\n\t\t\tstyle={ { background: backgroundColor } }\n\t\t>\n\t\t\t<HStack spacing={ 5 }>\n\t\t\t\t<div>\n\t\t\t\t\t<span style={ { fontFamily, fontSize: '80px' } }>A</span>\n\t\t\t\t\t<span style={ { fontFamily, fontSize: '80px' } }>a</span>\n\t\t\t\t</div>\n\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t<ColorIndicator colorValue={ textColor } />\n\t\t\t\t\t<ColorIndicator colorValue={ linkColor } />\n\t\t\t\t</VStack>\n\t\t\t</HStack>\n\t\t</Card>\n\t);\n};\n\nexport default StylesPreview;\n"]}

package/build-module/components/global-styles/screen-block-list.js

@@ -0,0 +1,58 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { getBlockType } from '@wordpress/blocks';
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import { useHasBorderPanel } from './border-panel';
+import { useHasColorPanel } from './color-panel';
+import { useHasDimensionsPanel } from './dimensions-panel';
+import { useHasTypographyPanel } from './typography-panel';
+import ScreenHeader from './header';
+import NavigationButton from './navigation-button';
+
+function BlockMenuItem({
+  block
+}) {
+  const {
+    blocks
+  } = useGlobalStylesContext();
+  const context = blocks[block.name];
+  const hasTypographyPanel = useHasTypographyPanel(context);
+  const hasColorPanel = useHasColorPanel(context);
+  const hasBorderPanel = useHasBorderPanel(context);
+  const hasDimensionsPanel = useHasDimensionsPanel(context);
+  const hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;
+  const hasBlockMenuItem = hasTypographyPanel || hasColorPanel || hasLayoutPanel;
+
+  if (!hasBlockMenuItem) {
+    return null;
+  }
+
+  return createElement(NavigationButton, {
+    path: '/blocks/' + block.name
+  }, block.title);
+}
+
+function ScreenBlockList() {
+  const {
+    blocks
+  } = useGlobalStylesContext();
+  const visibleBlocks = Object.keys(blocks).map(name => getBlockType(name)).filter(blockType => !!blockType);
+  return createElement(Fragment, null, createElement(ScreenHeader, {
+    back: "/",
+    title: __('Blocks')
+  }), visibleBlocks.map(block => createElement(BlockMenuItem, {
+    block: block,
+    key: 'menu-itemblock-' + block.name
+  })));
+}
+
+export default ScreenBlockList;
+//# sourceMappingURL=screen-block-list.js.map

package/build-module/components/global-styles/screen-block-list.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-block-list.js"],"names":["getBlockType","__","useGlobalStylesContext","useHasBorderPanel","useHasColorPanel","useHasDimensionsPanel","useHasTypographyPanel","ScreenHeader","NavigationButton","BlockMenuItem","block","blocks","context","name","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasDimensionsPanel","hasLayoutPanel","hasBlockMenuItem","title","ScreenBlockList","visibleBlocks","Object","keys","map","filter","blockType"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,YAAT,QAA6B,mBAA7B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,SAASC,iBAAT,QAAkC,gBAAlC;AACA,SAASC,gBAAT,QAAiC,eAAjC;AACA,SAASC,qBAAT,QAAsC,oBAAtC;AACA,SAASC,qBAAT,QAAsC,oBAAtC;AACA,OAAOC,YAAP,MAAyB,UAAzB;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;;AAEA,SAASC,aAAT,CAAwB;AAAEC,EAAAA;AAAF,CAAxB,EAAoC;AACnC,QAAM;AAAEC,IAAAA;AAAF,MAAaT,sBAAsB,EAAzC;AACA,QAAMU,OAAO,GAAGD,MAAM,CAAED,KAAK,CAACG,IAAR,CAAtB;AACA,QAAMC,kBAAkB,GAAGR,qBAAqB,CAAEM,OAAF,CAAhD;AACA,QAAMG,aAAa,GAAGX,gBAAgB,CAAEQ,OAAF,CAAtC;AACA,QAAMI,cAAc,GAAGb,iBAAiB,CAAES,OAAF,CAAxC;AACA,QAAMK,kBAAkB,GAAGZ,qBAAqB,CAAEO,OAAF,CAAhD;AACA,QAAMM,cAAc,GAAGF,cAAc,IAAIC,kBAAzC;AACA,QAAME,gBAAgB,GACrBL,kBAAkB,IAAIC,aAAtB,IAAuCG,cADxC;;AAGA,MAAK,CAAEC,gBAAP,EAA0B;AACzB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,gBAAD;AAAkB,IAAA,IAAI,EAAG,aAAaT,KAAK,CAACG;AAA5C,KACGH,KAAK,CAACU,KADT,CADD;AAKA;;AAED,SAASC,eAAT,GAA2B;AAC1B,QAAM;AAAEV,IAAAA;AAAF,MAAaT,sBAAsB,EAAzC;AACA,QAAMoB,aAAa,GAAGC,MAAM,CAACC,IAAP,CAAab,MAAb,EACpBc,GADoB,CACbZ,IAAF,IAAYb,YAAY,CAAEa,IAAF,CADT,EAEpBa,MAFoB,CAEVC,SAAF,IAAiB,CAAC,CAAEA,SAFR,CAAtB;AAIA,SACC,8BACC,cAAC,YAAD;AAAc,IAAA,IAAI,EAAC,GAAnB;AAAuB,IAAA,KAAK,EAAG1B,EAAE,CAAE,QAAF;AAAjC,IADD,EAEGqB,aAAa,CAACG,GAAd,CAAqBf,KAAF,IACpB,cAAC,aAAD;AACC,IAAA,KAAK,EAAGA,KADT;AAEC,IAAA,GAAG,EAAG,oBAAoBA,KAAK,CAACG;AAFjC,IADC,CAFH,CADD;AAWA;;AAED,eAAeQ,eAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport { useHasBorderPanel } from './border-panel';\nimport { useHasColorPanel } from './color-panel';\nimport { useHasDimensionsPanel } from './dimensions-panel';\nimport { useHasTypographyPanel } from './typography-panel';\nimport ScreenHeader from './header';\nimport NavigationButton from './navigation-button';\n\nfunction BlockMenuItem( { block } ) {\n\tconst { blocks } = useGlobalStylesContext();\n\tconst context = blocks[ block.name ];\n\tconst hasTypographyPanel = useHasTypographyPanel( context );\n\tconst hasColorPanel = useHasColorPanel( context );\n\tconst hasBorderPanel = useHasBorderPanel( context );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( context );\n\tconst hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;\n\tconst hasBlockMenuItem =\n\t\thasTypographyPanel || hasColorPanel || hasLayoutPanel;\n\n\tif ( ! hasBlockMenuItem ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButton path={ '/blocks/' + block.name }>\n\t\t\t{ block.title }\n\t\t</NavigationButton>\n\t);\n}\n\nfunction ScreenBlockList() {\n\tconst { blocks } = useGlobalStylesContext();\n\tconst visibleBlocks = Object.keys( blocks )\n\t\t.map( ( name ) => getBlockType( name ) )\n\t\t.filter( ( blockType ) => !! blockType );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader back=\"/\" title={ __( 'Blocks' ) } />\n\t\t\t{ visibleBlocks.map( ( block ) => (\n\t\t\t\t<BlockMenuItem\n\t\t\t\t\tblock={ block }\n\t\t\t\t\tkey={ 'menu-itemblock-' + block.name }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</>\n\t);\n}\n\nexport default ScreenBlockList;\n"]}

package/build-module/components/global-styles/screen-block.js

@@ -0,0 +1,32 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { getBlockType } from '@wordpress/blocks';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import ContextMenu from './context-menu';
+import ScreenHeader from './header';
+
+function ScreenBlock({
+  name
+}) {
+  const blockType = getBlockType(name);
+  const {
+    blocks
+  } = useGlobalStylesContext();
+  return createElement(Fragment, null, createElement(ScreenHeader, {
+    back: "/blocks",
+    title: blockType.title
+  }), createElement(ContextMenu, {
+    parentMenu: '/blocks/' + name,
+    context: blocks[name]
+  }));
+}
+
+export default ScreenBlock;
+//# sourceMappingURL=screen-block.js.map

package/build-module/components/global-styles/screen-block.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-block.js"],"names":["getBlockType","useGlobalStylesContext","ContextMenu","ScreenHeader","ScreenBlock","name","blockType","blocks","title"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,YAAT,QAA6B,mBAA7B;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,WAAP,MAAwB,gBAAxB;AACA,OAAOC,YAAP,MAAyB,UAAzB;;AAEA,SAASC,WAAT,CAAsB;AAAEC,EAAAA;AAAF,CAAtB,EAAiC;AAChC,QAAMC,SAAS,GAAGN,YAAY,CAAEK,IAAF,CAA9B;AACA,QAAM;AAAEE,IAAAA;AAAF,MAAaN,sBAAsB,EAAzC;AAEA,SACC,8BACC,cAAC,YAAD;AAAc,IAAA,IAAI,EAAC,SAAnB;AAA6B,IAAA,KAAK,EAAGK,SAAS,CAACE;AAA/C,IADD,EAEC,cAAC,WAAD;AACC,IAAA,UAAU,EAAG,aAAaH,IAD3B;AAEC,IAAA,OAAO,EAAGE,MAAM,CAAEF,IAAF;AAFjB,IAFD,CADD;AASA;;AAED,eAAeD,WAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport ContextMenu from './context-menu';\nimport ScreenHeader from './header';\n\nfunction ScreenBlock( { name } ) {\n\tconst blockType = getBlockType( name );\n\tconst { blocks } = useGlobalStylesContext();\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader back=\"/blocks\" title={ blockType.title } />\n\t\t\t<ContextMenu\n\t\t\t\tparentMenu={ '/blocks/' + name }\n\t\t\t\tcontext={ blocks[ name ] }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenBlock;\n"]}