@wordpress/edit-site 3.0.2 → 3.0.3

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"]}

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

@@ -0,0 +1,35 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import ColorPalettePanel from './color-palette-panel';
+import ScreenHeader from './header';
+
+function ScreenColorPalette({
+  name
+}) {
+  const {
+    getSetting,
+    setSetting
+  } = useGlobalStylesContext();
+  const parentMenu = name === undefined ? '' : '/blocks/' + name;
+  return createElement(Fragment, null, createElement(ScreenHeader, {
+    back: parentMenu + '/colors',
+    title: __('Color Palette'),
+    description: __('Edit the color palette.')
+  }), createElement(ColorPalettePanel, {
+    contextName: name,
+    getSetting: getSetting,
+    setSetting: setSetting
+  }));
+}
+
+export default ScreenColorPalette;
+//# sourceMappingURL=screen-color-palette.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-color-palette.js"],"names":["__","useGlobalStylesContext","ColorPalettePanel","ScreenHeader","ScreenColorPalette","name","getSetting","setSetting","parentMenu","undefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,iBAAP,MAA8B,uBAA9B;AACA,OAAOC,YAAP,MAAyB,UAAzB;;AAEA,SAASC,kBAAT,CAA6B;AAAEC,EAAAA;AAAF,CAA7B,EAAwC;AACvC,QAAM;AAAEC,IAAAA,UAAF;AAAcC,IAAAA;AAAd,MAA6BN,sBAAsB,EAAzD;AACA,QAAMO,UAAU,GAAGH,IAAI,KAAKI,SAAT,GAAqB,EAArB,GAA0B,aAAaJ,IAA1D;AAEA,SACC,8BACC,cAAC,YAAD;AACC,IAAA,IAAI,EAAGG,UAAU,GAAG,SADrB;AAEC,IAAA,KAAK,EAAGR,EAAE,CAAE,eAAF,CAFX;AAGC,IAAA,WAAW,EAAGA,EAAE,CAAE,yBAAF;AAHjB,IADD,EAMC,cAAC,iBAAD;AACC,IAAA,WAAW,EAAGK,IADf;AAEC,IAAA,UAAU,EAAGC,UAFd;AAGC,IAAA,UAAU,EAAGC;AAHd,IAND,CADD;AAcA;;AAED,eAAeH,kBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport ColorPalettePanel from './color-palette-panel';\nimport ScreenHeader from './header';\n\nfunction ScreenColorPalette( { name } ) {\n\tconst { getSetting, setSetting } = useGlobalStylesContext();\n\tconst parentMenu = name === undefined ? '' : '/blocks/' + name;\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\tback={ parentMenu + '/colors' }\n\t\t\t\ttitle={ __( 'Color Palette' ) }\n\t\t\t\tdescription={ __( 'Edit the color palette.' ) }\n\t\t\t/>\n\t\t\t<ColorPalettePanel\n\t\t\t\tcontextName={ name }\n\t\t\t\tgetSetting={ getSetting }\n\t\t\t\tsetSetting={ setSetting }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenColorPalette;\n"]}

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

@@ -0,0 +1,38 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import ColorPanel from './color-panel';
+import ScreenHeader from './header';
+
+function ScreenColors({
+  name
+}) {
+  const {
+    root,
+    blocks,
+    getStyle,
+    setStyle
+  } = useGlobalStylesContext();
+  const context = name === undefined ? root : blocks[name];
+  const parentMenu = name === undefined ? '' : '/blocks/' + name;
+  return createElement(Fragment, null, createElement(ScreenHeader, {
+    back: parentMenu ? parentMenu : '/',
+    title: __('Colors'),
+    description: __('Manage color palettes and how they affect the different elements of the site.')
+  }), createElement(ColorPanel, {
+    context: context,
+    getStyle: getStyle,
+    setStyle: setStyle
+  }));
+}
+
+export default ScreenColors;
+//# sourceMappingURL=screen-colors.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-colors.js"],"names":["__","useGlobalStylesContext","ColorPanel","ScreenHeader","ScreenColors","name","root","blocks","getStyle","setStyle","context","undefined","parentMenu"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,OAAOC,YAAP,MAAyB,UAAzB;;AAEA,SAASC,YAAT,CAAuB;AAAEC,EAAAA;AAAF,CAAvB,EAAkC;AACjC,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,MAAR;AAAgBC,IAAAA,QAAhB;AAA0BC,IAAAA;AAA1B,MAAuCR,sBAAsB,EAAnE;AACA,QAAMS,OAAO,GAAGL,IAAI,KAAKM,SAAT,GAAqBL,IAArB,GAA4BC,MAAM,CAAEF,IAAF,CAAlD;AACA,QAAMO,UAAU,GAAGP,IAAI,KAAKM,SAAT,GAAqB,EAArB,GAA0B,aAAaN,IAA1D;AAEA,SACC,8BACC,cAAC,YAAD;AACC,IAAA,IAAI,EAAGO,UAAU,GAAGA,UAAH,GAAgB,GADlC;AAEC,IAAA,KAAK,EAAGZ,EAAE,CAAE,QAAF,CAFX;AAGC,IAAA,WAAW,EAAGA,EAAE,CACf,+EADe;AAHjB,IADD,EAQC,cAAC,UAAD;AACC,IAAA,OAAO,EAAGU,OADX;AAEC,IAAA,QAAQ,EAAGF,QAFZ;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IARD,CADD;AAgBA;;AAED,eAAeL,YAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport ColorPanel from './color-panel';\nimport ScreenHeader from './header';\n\nfunction ScreenColors( { name } ) {\n\tconst { root, blocks, getStyle, setStyle } = useGlobalStylesContext();\n\tconst context = name === undefined ? root : blocks[ name ];\n\tconst parentMenu = name === undefined ? '' : '/blocks/' + name;\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\tback={ parentMenu ? parentMenu : '/' }\n\t\t\t\ttitle={ __( 'Colors' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Manage color palettes and how they affect the different elements of the site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<ColorPanel\n\t\t\t\tcontext={ context }\n\t\t\t\tgetStyle={ getStyle }\n\t\t\t\tsetStyle={ setStyle }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenColors;\n"]}

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

@@ -0,0 +1,44 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import BorderPanel, { useHasBorderPanel } from './border-panel';
+import DimensionsPanel, { useHasDimensionsPanel } from './dimensions-panel';
+import ScreenHeader from './header';
+
+function ScreenLayout({
+  name
+}) {
+  const {
+    root,
+    blocks,
+    getStyle,
+    setStyle
+  } = useGlobalStylesContext();
+  const context = name === undefined ? root : blocks[name];
+  const parentMenu = name === undefined ? '' : '/blocks/' + name;
+  const hasBorderPanel = useHasBorderPanel(context);
+  const hasDimensionsPanel = useHasDimensionsPanel(context);
+  return createElement(Fragment, null, createElement(ScreenHeader, {
+    back: parentMenu ? parentMenu : '/',
+    title: __('Layout')
+  }), hasDimensionsPanel && createElement(DimensionsPanel, {
+    context: context,
+    getStyle: getStyle,
+    setStyle: setStyle
+  }), hasBorderPanel && createElement(BorderPanel, {
+    context: context,
+    getStyle: getStyle,
+    setStyle: setStyle
+  }));
+}
+
+export default ScreenLayout;
+//# sourceMappingURL=screen-layout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-layout.js"],"names":["__","useGlobalStylesContext","BorderPanel","useHasBorderPanel","DimensionsPanel","useHasDimensionsPanel","ScreenHeader","ScreenLayout","name","root","blocks","getStyle","setStyle","context","undefined","parentMenu","hasBorderPanel","hasDimensionsPanel"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,WAAP,IAAsBC,iBAAtB,QAA+C,gBAA/C;AACA,OAAOC,eAAP,IAA0BC,qBAA1B,QAAuD,oBAAvD;AACA,OAAOC,YAAP,MAAyB,UAAzB;;AAEA,SAASC,YAAT,CAAuB;AAAEC,EAAAA;AAAF,CAAvB,EAAkC;AACjC,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,MAAR;AAAgBC,IAAAA,QAAhB;AAA0BC,IAAAA;AAA1B,MAAuCX,sBAAsB,EAAnE;AACA,QAAMY,OAAO,GAAGL,IAAI,KAAKM,SAAT,GAAqBL,IAArB,GAA4BC,MAAM,CAAEF,IAAF,CAAlD;AACA,QAAMO,UAAU,GAAGP,IAAI,KAAKM,SAAT,GAAqB,EAArB,GAA0B,aAAaN,IAA1D;AACA,QAAMQ,cAAc,GAAGb,iBAAiB,CAAEU,OAAF,CAAxC;AACA,QAAMI,kBAAkB,GAAGZ,qBAAqB,CAAEQ,OAAF,CAAhD;AAEA,SACC,8BACC,cAAC,YAAD;AACC,IAAA,IAAI,EAAGE,UAAU,GAAGA,UAAH,GAAgB,GADlC;AAEC,IAAA,KAAK,EAAGf,EAAE,CAAE,QAAF;AAFX,IADD,EAKGiB,kBAAkB,IACnB,cAAC,eAAD;AACC,IAAA,OAAO,EAAGJ,OADX;AAEC,IAAA,QAAQ,EAAGF,QAFZ;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IANF,EAYGI,cAAc,IACf,cAAC,WAAD;AACC,IAAA,OAAO,EAAGH,OADX;AAEC,IAAA,QAAQ,EAAGF,QAFZ;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IAbF,CADD;AAsBA;;AAED,eAAeL,YAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport BorderPanel, { useHasBorderPanel } from './border-panel';\nimport DimensionsPanel, { useHasDimensionsPanel } from './dimensions-panel';\nimport ScreenHeader from './header';\n\nfunction ScreenLayout( { name } ) {\n\tconst { root, blocks, getStyle, setStyle } = useGlobalStylesContext();\n\tconst context = name === undefined ? root : blocks[ name ];\n\tconst parentMenu = name === undefined ? '' : '/blocks/' + name;\n\tconst hasBorderPanel = useHasBorderPanel( context );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( context );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\tback={ parentMenu ? parentMenu : '/' }\n\t\t\t\ttitle={ __( 'Layout' ) }\n\t\t\t/>\n\t\t\t{ hasDimensionsPanel && (\n\t\t\t\t<DimensionsPanel\n\t\t\t\t\tcontext={ context }\n\t\t\t\t\tgetStyle={ getStyle }\n\t\t\t\t\tsetStyle={ setStyle }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ hasBorderPanel && (\n\t\t\t\t<BorderPanel\n\t\t\t\t\tcontext={ context }\n\t\t\t\t\tgetStyle={ getStyle }\n\t\t\t\t\tsetStyle={ setStyle }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default ScreenLayout;\n"]}

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

@@ -0,0 +1,29 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalItemGroup as ItemGroup, __experimentalItem as Item } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import StylesPreview from './preview';
+import NavigationButton from './navigation-button';
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import ContextMenu from './context-menu';
+
+function ScreenRoot() {
+  const {
+    root
+  } = useGlobalStylesContext();
+  return createElement(Fragment, null, createElement(StylesPreview, null), createElement(ContextMenu, {
+    context: root
+  }), createElement(ItemGroup, null, createElement(Item, null, createElement("p", null, __('Customize the appearance of specific blocks for the whole site.'))), createElement(NavigationButton, {
+    path: "/blocks"
+  }, __('Blocks'))));
+}
+
+export default ScreenRoot;
+//# sourceMappingURL=screen-root.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-root.js"],"names":["__experimentalItemGroup","ItemGroup","__experimentalItem","Item","__","StylesPreview","NavigationButton","useGlobalStylesContext","ContextMenu","ScreenRoot","root"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,uBAAuB,IAAIC,SAD5B,EAECC,kBAAkB,IAAIC,IAFvB,QAGO,uBAHP;AAIA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,aAAP,MAA0B,WAA1B;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,WAAP,MAAwB,gBAAxB;;AAEA,SAASC,UAAT,GAAsB;AACrB,QAAM;AAAEC,IAAAA;AAAF,MAAWH,sBAAsB,EAAvC;AAEA,SACC,8BACC,cAAC,aAAD,OADD,EAGC,cAAC,WAAD;AAAa,IAAA,OAAO,EAAGG;AAAvB,IAHD,EAKC,cAAC,SAAD,QACC,cAAC,IAAD,QACC,yBACGN,EAAE,CACH,iEADG,CADL,CADD,CADD,EAQC,cAAC,gBAAD;AAAkB,IAAA,IAAI,EAAC;AAAvB,KACGA,EAAE,CAAE,QAAF,CADL,CARD,CALD,CADD;AAoBA;;AAED,eAAeK,UAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport StylesPreview from './preview';\nimport NavigationButton from './navigation-button';\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport ContextMenu from './context-menu';\n\nfunction ScreenRoot() {\n\tconst { root } = useGlobalStylesContext();\n\n\treturn (\n\t\t<>\n\t\t\t<StylesPreview />\n\n\t\t\t<ContextMenu context={ root } />\n\n\t\t\t<ItemGroup>\n\t\t\t\t<Item>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Customize the appearance of specific blocks for the whole site.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t</Item>\n\t\t\t\t<NavigationButton path=\"/blocks\">\n\t\t\t\t\t{ __( 'Blocks' ) }\n\t\t\t\t</NavigationButton>\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default ScreenRoot;\n"]}

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

@@ -0,0 +1,37 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import { useGlobalStylesContext } from '../editor/global-styles-provider';
+import TypographyPanel from './typography-panel';
+import ScreenHeader from './header';
+
+function ScreenTypography({
+  name
+}) {
+  const {
+    root,
+    blocks,
+    getStyle,
+    setStyle
+  } = useGlobalStylesContext();
+  const context = name === undefined ? root : blocks[name];
+  const parentMenu = name === undefined ? '' : '/blocks/' + name;
+  return createElement(Fragment, null, createElement(ScreenHeader, {
+    back: parentMenu ? parentMenu : '/',
+    title: __('Typography')
+  }), createElement(TypographyPanel, {
+    context: context,
+    getStyle: getStyle,
+    setStyle: setStyle
+  }));
+}
+
+export default ScreenTypography;
+//# sourceMappingURL=screen-typography.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-typography.js"],"names":["__","useGlobalStylesContext","TypographyPanel","ScreenHeader","ScreenTypography","name","root","blocks","getStyle","setStyle","context","undefined","parentMenu"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,kCAAvC;AACA,OAAOC,eAAP,MAA4B,oBAA5B;AACA,OAAOC,YAAP,MAAyB,UAAzB;;AAEA,SAASC,gBAAT,CAA2B;AAAEC,EAAAA;AAAF,CAA3B,EAAsC;AACrC,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,MAAR;AAAgBC,IAAAA,QAAhB;AAA0BC,IAAAA;AAA1B,MAAuCR,sBAAsB,EAAnE;AACA,QAAMS,OAAO,GAAGL,IAAI,KAAKM,SAAT,GAAqBL,IAArB,GAA4BC,MAAM,CAAEF,IAAF,CAAlD;AACA,QAAMO,UAAU,GAAGP,IAAI,KAAKM,SAAT,GAAqB,EAArB,GAA0B,aAAaN,IAA1D;AAEA,SACC,8BACC,cAAC,YAAD;AACC,IAAA,IAAI,EAAGO,UAAU,GAAGA,UAAH,GAAgB,GADlC;AAEC,IAAA,KAAK,EAAGZ,EAAE,CAAE,YAAF;AAFX,IADD,EAKC,cAAC,eAAD;AACC,IAAA,OAAO,EAAGU,OADX;AAEC,IAAA,QAAQ,EAAGF,QAFZ;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IALD,CADD;AAaA;;AAED,eAAeL,gBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStylesContext } from '../editor/global-styles-provider';\nimport TypographyPanel from './typography-panel';\nimport ScreenHeader from './header';\n\nfunction ScreenTypography( { name } ) {\n\tconst { root, blocks, getStyle, setStyle } = useGlobalStylesContext();\n\tconst context = name === undefined ? root : blocks[ name ];\n\tconst parentMenu = name === undefined ? '' : '/blocks/' + name;\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\tback={ parentMenu ? parentMenu : '/' }\n\t\t\t\ttitle={ __( 'Typography' ) }\n\t\t\t/>\n\t\t\t<TypographyPanel\n\t\t\t\tcontext={ context }\n\t\t\t\tgetStyle={ getStyle }\n\t\t\t\tsetStyle={ setStyle }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenTypography;\n"]}

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

@@ -0,0 +1,17 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalHeading as Heading } from '@wordpress/components';
+
+function Subtitle({
+  children
+}) {
+  return createElement(Heading, {
+    level: 2
+  }, children);
+}
+
+export default Subtitle;
+//# sourceMappingURL=subtitle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/subtitle.js"],"names":["__experimentalHeading","Heading","Subtitle","children"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,qBAAqB,IAAIC,OAAlC,QAAiD,uBAAjD;;AAEA,SAASC,QAAT,CAAmB;AAAEC,EAAAA;AAAF,CAAnB,EAAkC;AACjC,SAAO,cAAC,OAAD;AAAS,IAAA,KAAK,EAAG;AAAjB,KAAuBA,QAAvB,CAAP;AACA;;AAED,eAAeD,QAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalHeading as Heading } from '@wordpress/components';\n\nfunction Subtitle( { children } ) {\n\treturn <Heading level={ 2 }>{ children }</Heading>;\n}\n\nexport default Subtitle;\n"]}