@wordpress/edit-site 6.32.0 → 6.32.1-next.b8c8708f3.0

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

@@ -1 +1,7 @@
-{"version":3,"names":["_components","require","_i18n","_icons","_jsxRuntime","ScreenHeader","title","description","onBack","jsxs","__experimentalVStack","spacing","children","jsx","__experimentalView","__experimentalSpacer","marginBottom","paddingX","paddingY","__experimentalHStack","Navigator","BackButton","icon","isRTL","chevronRight","chevronLeft","size","label","__","onClick","__experimentalHeading","className","level","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/header.js"],"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\tNavigator,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description, onBack } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<Navigator.BackButton\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tlabel={ __( 'Back' ) }\n\t\t\t\t\t\t\tonClick={ onBack }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\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"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAQA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAA6D,IAAAG,WAAA,GAAAH,OAAA;AAZ7D;AACA;AACA;;AAYA,SAASI,YAAYA,CAAE;EAAEC,KAAK;EAAEC,WAAW;EAAEC;AAAO,CAAC,EAAG;EACvD,oBACC,IAAAJ,WAAA,CAAAK,IAAA,EAACT,WAAA,CAAAU,oBAAM;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,gBACpB,IAAAR,WAAA,CAAAS,GAAA,EAACb,WAAA,CAAAc,kBAAI;MAAAF,QAAA,eACJ,IAAAR,WAAA,CAAAS,GAAA,EAACb,WAAA,CAAAe,oBAAM;QAACC,YAAY,EAAG,CAAG;QAACC,QAAQ,EAAG,CAAG;QAACC,QAAQ,EAAG,CAAG;QAAAN,QAAA,eACvD,IAAAR,WAAA,CAAAK,IAAA,EAACT,WAAA,CAAAmB,oBAAM;UAACR,OAAO,EAAG,CAAG;UAAAC,QAAA,gBACpB,IAAAR,WAAA,CAAAS,GAAA,EAACb,WAAA,CAAAoB,SAAS,CAACC,UAAU;YACpBC,IAAI,EAAG,IAAAC,WAAK,EAAC,CAAC,GAAGC,mBAAY,GAAGC,kBAAa;YAC7CC,IAAI,EAAC,OAAO;YACZC,KAAK,EAAG,IAAAC,QAAE,EAAE,MAAO,CAAG;YACtBC,OAAO,EAAGrB;UAAQ,CAClB,CAAC,eACF,IAAAJ,WAAA,CAAAS,GAAA,EAACb,WAAA,CAAAe,oBAAM;YAAAH,QAAA,eACN,IAAAR,WAAA,CAAAS,GAAA,EAACb,WAAA,CAAA8B,qBAAO;cACPC,SAAS,EAAC,gCAAgC;cAC1CC,KAAK,EAAG,CAAG;cACXN,IAAI,EAAG,EAAI;cAAAd,QAAA,EAETN;YAAK,CACC;UAAC,CACH,CAAC;QAAA,CACF;MAAC,CACF;IAAC,CACJ,CAAC,EACLC,WAAW,iBACZ,IAAAH,WAAA,CAAAS,GAAA;MAAGkB,SAAS,EAAC,6CAA6C;MAAAnB,QAAA,EACvDL;IAAW,CACX,CACH;EAAA,CACM,CAAC;AAEX;AAAC,IAAA0B,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc9B,YAAY","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/header.js"],
+  "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\tNavigator,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description, onBack } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<Navigator.BackButton\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tlabel={ __( 'Back' ) }\n\t\t\t\t\t\t\tonClick={ onBack }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\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"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBK;AAhBL,wBAOO;AACP,kBAA0B;AAC1B,mBAA0C;AAE1C,SAAS,aAAc,EAAE,OAAO,aAAa,OAAO,GAAI;AACvD,SACC,6CAAC,kBAAAA,sBAAA,EAAO,SAAU,GACjB;AAAA,gDAAC,kBAAAC,oBAAA,EACA,sDAAC,kBAAAC,sBAAA,EAAO,cAAe,GAAI,UAAW,GAAI,UAAW,GACpD,uDAAC,kBAAAC,sBAAA,EAAO,SAAU,GACjB;AAAA;AAAA,QAAC,4BAAU;AAAA,QAAV;AAAA,UACA,UAAO,mBAAM,IAAI,4BAAe;AAAA,UAChC,MAAK;AAAA,UACL,WAAQ,gBAAI,MAAO;AAAA,UACnB,SAAU;AAAA;AAAA,MACX;AAAA,MACA,4CAAC,kBAAAD,sBAAA,EACA;AAAA,QAAC,kBAAAE;AAAA,QAAA;AAAA,UACA,WAAU;AAAA,UACV,OAAQ;AAAA,UACR,MAAO;AAAA,UAEL;AAAA;AAAA,MACH,GACD;AAAA,OACD,GACD,GACD;AAAA,IACE,eACD,4CAAC,OAAE,WAAU,+CACV,uBACH;AAAA,KAEF;AAEF;AAEA,IAAO,iBAAQ;",
+  "names": ["VStack", "View", "Spacer", "HStack", "Heading"]
+}

package/build/components/global-styles/highlighted-colors.js

@@ -1,49 +1,57 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var highlighted_colors_exports = {};
+__export(highlighted_colors_exports, {
+  default: () => HighlightedColors
 });
-exports.default = HighlightedColors;
-var _components = require("@wordpress/components");
-var _hooks = require("./hooks");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
+module.exports = __toCommonJS(highlighted_colors_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_hooks = require("./hooks");
 function HighlightedColors({
   normalizedColorSwatchSize,
   ratio
 }) {
-  const {
-    highlightedColors
-  } = (0, _hooks.useStylesPreviewColors)();
+  const { highlightedColors } = (0, import_hooks.useStylesPreviewColors)();
   const scaledSwatchSize = normalizedColorSwatchSize * ratio;
-  return highlightedColors.map(({
-    slug,
-    color
-  }, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__unstableMotion.div, {
-    style: {
-      height: scaledSwatchSize,
-      width: scaledSwatchSize,
-      background: color,
-      borderRadius: scaledSwatchSize / 2
+  return highlightedColors.map(({ slug, color }, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.__unstableMotion.div,
+    {
+      style: {
+        height: scaledSwatchSize,
+        width: scaledSwatchSize,
+        background: color,
+        borderRadius: scaledSwatchSize / 2
+      },
+      animate: {
+        scale: 1,
+        opacity: 1
+      },
+      initial: {
+        scale: 0.1,
+        opacity: 0
+      },
+      transition: {
+        delay: index === 1 ? 0.2 : 0.1
+      }
     },
-    animate: {
-      scale: 1,
-      opacity: 1
-    },
-    initial: {
-      scale: 0.1,
-      opacity: 0
-    },
-    transition: {
-      delay: index === 1 ? 0.2 : 0.1
-    }
-  }, `${slug}-${index}`));
+    `${slug}-${index}`
+  ));
 }
-//# sourceMappingURL=highlighted-colors.js.map
+//# sourceMappingURL=highlighted-colors.js.map

package/build/components/global-styles/highlighted-colors.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_components","require","_hooks","_jsxRuntime","HighlightedColors","normalizedColorSwatchSize","ratio","highlightedColors","useStylesPreviewColors","scaledSwatchSize","map","slug","color","index","jsx","__unstableMotion","div","style","height","width","background","borderRadius","animate","scale","opacity","initial","transition","delay"],"sources":["@wordpress/edit-site/src/components/global-styles/highlighted-colors.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __unstableMotion as motion } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useStylesPreviewColors } from './hooks';\n\nexport default function HighlightedColors( {\n\tnormalizedColorSwatchSize,\n\tratio,\n} ) {\n\tconst { highlightedColors } = useStylesPreviewColors();\n\tconst scaledSwatchSize = normalizedColorSwatchSize * ratio;\n\treturn highlightedColors.map( ( { slug, color }, index ) => (\n\t\t<motion.div\n\t\t\tkey={ `${ slug }-${ index }` }\n\t\t\tstyle={ {\n\t\t\t\theight: scaledSwatchSize,\n\t\t\t\twidth: scaledSwatchSize,\n\t\t\t\tbackground: color,\n\t\t\t\tborderRadius: scaledSwatchSize / 2,\n\t\t\t} }\n\t\t\tanimate={ {\n\t\t\t\tscale: 1,\n\t\t\t\topacity: 1,\n\t\t\t} }\n\t\t\tinitial={ {\n\t\t\t\tscale: 0.1,\n\t\t\t\topacity: 0,\n\t\t\t} }\n\t\t\ttransition={ {\n\t\t\t\tdelay: index === 1 ? 0.2 : 0.1,\n\t\t\t} }\n\t\t/>\n\t) );\n}\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAD,OAAA;AAAiD,IAAAE,WAAA,GAAAF,OAAA;AARjD;AACA;AACA;;AAGA;AACA;AACA;;AAGe,SAASG,iBAAiBA,CAAE;EAC1CC,yBAAyB;EACzBC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC;EAAkB,CAAC,GAAG,IAAAC,6BAAsB,EAAC,CAAC;EACtD,MAAMC,gBAAgB,GAAGJ,yBAAyB,GAAGC,KAAK;EAC1D,OAAOC,iBAAiB,CAACG,GAAG,CAAE,CAAE;IAAEC,IAAI;IAAEC;EAAM,CAAC,EAAEC,KAAK,kBACrD,IAAAV,WAAA,CAAAW,GAAA,EAACd,WAAA,CAAAe,gBAAM,CAACC,GAAG;IAEVC,KAAK,EAAG;MACPC,MAAM,EAAET,gBAAgB;MACxBU,KAAK,EAAEV,gBAAgB;MACvBW,UAAU,EAAER,KAAK;MACjBS,YAAY,EAAEZ,gBAAgB,GAAG;IAClC,CAAG;IACHa,OAAO,EAAG;MACTC,KAAK,EAAE,CAAC;MACRC,OAAO,EAAE;IACV,CAAG;IACHC,OAAO,EAAG;MACTF,KAAK,EAAE,GAAG;MACVC,OAAO,EAAE;IACV,CAAG;IACHE,UAAU,EAAG;MACZC,KAAK,EAAEd,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG;IAC5B;EAAG,GAjBG,GAAIF,IAAI,IAAME,KAAK,EAkBzB,CACA,CAAC;AACJ","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/highlighted-colors.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __unstableMotion as motion } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useStylesPreviewColors } from './hooks';\n\nexport default function HighlightedColors( {\n\tnormalizedColorSwatchSize,\n\tratio,\n} ) {\n\tconst { highlightedColors } = useStylesPreviewColors();\n\tconst scaledSwatchSize = normalizedColorSwatchSize * ratio;\n\treturn highlightedColors.map( ( { slug, color }, index ) => (\n\t\t<motion.div\n\t\t\tkey={ `${ slug }-${ index }` }\n\t\t\tstyle={ {\n\t\t\t\theight: scaledSwatchSize,\n\t\t\t\twidth: scaledSwatchSize,\n\t\t\t\tbackground: color,\n\t\t\t\tborderRadius: scaledSwatchSize / 2,\n\t\t\t} }\n\t\t\tanimate={ {\n\t\t\t\tscale: 1,\n\t\t\t\topacity: 1,\n\t\t\t} }\n\t\t\tinitial={ {\n\t\t\t\tscale: 0.1,\n\t\t\t\topacity: 0,\n\t\t\t} }\n\t\t\ttransition={ {\n\t\t\t\tdelay: index === 1 ? 0.2 : 0.1,\n\t\t\t} }\n\t\t/>\n\t) );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBE;AAdF,wBAA2C;AAK3C,mBAAuC;AAExB,SAAR,kBAAoC;AAAA,EAC1C;AAAA,EACA;AACD,GAAI;AACH,QAAM,EAAE,kBAAkB,QAAI,qCAAuB;AACrD,QAAM,mBAAmB,4BAA4B;AACrD,SAAO,kBAAkB,IAAK,CAAE,EAAE,MAAM,MAAM,GAAG,UAChD;AAAA,IAAC,kBAAAA,iBAAO;AAAA,IAAP;AAAA,MAEA,OAAQ;AAAA,QACP,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,YAAY;AAAA,QACZ,cAAc,mBAAmB;AAAA,MAClC;AAAA,MACA,SAAU;AAAA,QACT,OAAO;AAAA,QACP,SAAS;AAAA,MACV;AAAA,MACA,SAAU;AAAA,QACT,OAAO;AAAA,QACP,SAAS;AAAA,MACV;AAAA,MACA,YAAa;AAAA,QACZ,OAAO,UAAU,IAAI,MAAM;AAAA,MAC5B;AAAA;AAAA,IAjBM,GAAI,IAAK,IAAK,KAAM;AAAA,EAkB3B,CACC;AACH;",
+  "names": ["motion"]
+}

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

@@ -1,49 +1,56 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var hooks_exports = {};
+__export(hooks_exports, {
+  useColorRandomizer: () => useColorRandomizer,
+  useStylesPreviewColors: () => useStylesPreviewColors,
+  useSupportedStyles: () => useSupportedStyles
 });
-exports.useColorRandomizer = useColorRandomizer;
-exports.useStylesPreviewColors = useStylesPreviewColors;
-exports.useSupportedStyles = useSupportedStyles;
-var _colord = require("colord");
-var _a11y = _interopRequireDefault(require("colord/plugins/a11y"));
-var _blocks = require("@wordpress/blocks");
-var _blockEditor = require("@wordpress/block-editor");
-var _lockUnlock = require("../../lock-unlock");
-var _data = require("@wordpress/data");
-/**
- * External dependencies
- */
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const {
-  useGlobalSetting,
-  useGlobalStyle
-} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
-
-// Enable colord's a11y plugin.
-(0, _colord.extend)([_a11y.default]);
+module.exports = __toCommonJS(hooks_exports);
+var import_colord = require("colord");
+var import_a11y = __toESM(require("colord/plugins/a11y"));
+var import_blocks = require("@wordpress/blocks");
+var import_block_editor = require("@wordpress/block-editor");
+var import_lock_unlock = require("../../lock-unlock");
+var import_data = require("@wordpress/data");
+const { useGlobalSetting, useGlobalStyle } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
+(0, import_colord.extend)([import_a11y.default]);
 function useColorRandomizer(name) {
-  const [themeColors, setThemeColors] = useGlobalSetting('color.palette.theme', name);
+  const [themeColors, setThemeColors] = useGlobalSetting(
+    "color.palette.theme",
+    name
+  );
   function randomizeColors() {
-    /* eslint-disable no-restricted-syntax */
     const randomRotationValue = Math.floor(Math.random() * 225);
-    /* eslint-enable no-restricted-syntax */
-
-    const newColors = themeColors.map(colorObject => {
-      const {
-        color
-      } = colorObject;
-      const newColor = (0, _colord.colord)(color).rotate(randomRotationValue).toHex();
+    const newColors = themeColors.map((colorObject) => {
+      const { color } = colorObject;
+      const newColor = (0, import_colord.colord)(color).rotate(randomRotationValue).toHex();
       return {
         ...colorObject,
         color: newColor
@@ -54,39 +61,53 @@ function useColorRandomizer(name) {
   return window.__experimentalEnableColorRandomizer ? [randomizeColors] : [];
 }
 function useStylesPreviewColors() {
-  const [textColor = 'black'] = useGlobalStyle('color.text');
-  const [backgroundColor = 'white'] = useGlobalStyle('color.background');
-  const [headingColor = textColor] = useGlobalStyle('elements.h1.color.text');
-  const [linkColor = headingColor] = useGlobalStyle('elements.link.color.text');
-  const [buttonBackgroundColor = linkColor] = useGlobalStyle('elements.button.color.background');
-  const [coreColors] = useGlobalSetting('color.palette.core');
-  const [themeColors] = useGlobalSetting('color.palette.theme');
-  const [customColors] = useGlobalSetting('color.palette.custom');
-  const paletteColors = (themeColors !== null && themeColors !== void 0 ? themeColors : []).concat(customColors !== null && customColors !== void 0 ? customColors : []).concat(coreColors !== null && coreColors !== void 0 ? coreColors : []);
-  const textColorObject = paletteColors.filter(({
-    color
-  }) => color === textColor);
-  const buttonBackgroundColorObject = paletteColors.filter(({
-    color
-  }) => color === buttonBackgroundColor);
+  const [textColor = "black"] = useGlobalStyle("color.text");
+  const [backgroundColor = "white"] = useGlobalStyle("color.background");
+  const [headingColor = textColor] = useGlobalStyle(
+    "elements.h1.color.text"
+  );
+  const [linkColor = headingColor] = useGlobalStyle(
+    "elements.link.color.text"
+  );
+  const [buttonBackgroundColor = linkColor] = useGlobalStyle(
+    "elements.button.color.background"
+  );
+  const [coreColors] = useGlobalSetting("color.palette.core");
+  const [themeColors] = useGlobalSetting("color.palette.theme");
+  const [customColors] = useGlobalSetting("color.palette.custom");
+  const paletteColors = (themeColors ?? []).concat(customColors ?? []).concat(coreColors ?? []);
+  const textColorObject = paletteColors.filter(
+    ({ color }) => color === textColor
+  );
+  const buttonBackgroundColorObject = paletteColors.filter(
+    ({ color }) => color === buttonBackgroundColor
+  );
   const highlightedColors = textColorObject.concat(buttonBackgroundColorObject).concat(paletteColors).filter(
-  // we exclude these background color because it is already visible in the preview.
-  ({
-    color
-  }) => color !== backgroundColor).slice(0, 2);
+    // we exclude these background color because it is already visible in the preview.
+    ({ color }) => color !== backgroundColor
+  ).slice(0, 2);
   return {
     paletteColors,
     highlightedColors
   };
 }
 function useSupportedStyles(name, element) {
-  const {
-    supportedPanels
-  } = (0, _data.useSelect)(select => {
-    return {
-      supportedPanels: (0, _lockUnlock.unlock)(select(_blocks.store)).getSupportedStyles(name, element)
-    };
-  }, [name, element]);
+  const { supportedPanels } = (0, import_data.useSelect)(
+    (select) => {
+      return {
+        supportedPanels: (0, import_lock_unlock.unlock)(
+          select(import_blocks.store)
+        ).getSupportedStyles(name, element)
+      };
+    },
+    [name, element]
+  );
   return supportedPanels;
 }
-//# sourceMappingURL=hooks.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useColorRandomizer,
+  useStylesPreviewColors,
+  useSupportedStyles
+});
+//# sourceMappingURL=hooks.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["_colord","require","_a11y","_interopRequireDefault","_blocks","_blockEditor","_lockUnlock","_data","useGlobalSetting","useGlobalStyle","unlock","blockEditorPrivateApis","extend","a11yPlugin","useColorRandomizer","name","themeColors","setThemeColors","randomizeColors","randomRotationValue","Math","floor","random","newColors","map","colorObject","color","newColor","colord","rotate","toHex","window","__experimentalEnableColorRandomizer","useStylesPreviewColors","textColor","backgroundColor","headingColor","linkColor","buttonBackgroundColor","coreColors","customColors","paletteColors","concat","textColorObject","filter","buttonBackgroundColorObject","highlightedColors","slice","useSupportedStyles","element","supportedPanels","useSelect","select","blocksStore","getSupportedStyles"],"sources":["@wordpress/edit-site/src/components/global-styles/hooks.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/**\n * WordPress dependencies\n */\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { useSelect } from '@wordpress/data';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\n// Enable colord's a11y plugin.\nextend( [ a11yPlugin ] );\n\nexport function useColorRandomizer( name ) {\n\tconst [ themeColors, setThemeColors ] = useGlobalSetting(\n\t\t'color.palette.theme',\n\t\tname\n\t);\n\n\tfunction randomizeColors() {\n\t\t/* eslint-disable no-restricted-syntax */\n\t\tconst randomRotationValue = Math.floor( Math.random() * 225 );\n\t\t/* eslint-enable no-restricted-syntax */\n\n\t\tconst newColors = themeColors.map( ( colorObject ) => {\n\t\t\tconst { color } = colorObject;\n\t\t\tconst newColor = colord( color )\n\t\t\t\t.rotate( randomRotationValue )\n\t\t\t\t.toHex();\n\n\t\t\treturn {\n\t\t\t\t...colorObject,\n\t\t\t\tcolor: newColor,\n\t\t\t};\n\t\t} );\n\n\t\tsetThemeColors( newColors );\n\t}\n\n\treturn window.__experimentalEnableColorRandomizer\n\t\t? [ randomizeColors ]\n\t\t: [];\n}\n\nexport function useStylesPreviewColors() {\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ linkColor = headingColor ] = useGlobalStyle(\n\t\t'elements.link.color.text'\n\t);\n\n\tconst [ buttonBackgroundColor = linkColor ] = useGlobalStyle(\n\t\t'elements.button.color.background'\n\t);\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\n\tconst textColorObject = paletteColors.filter(\n\t\t( { color } ) => color === textColor\n\t);\n\tconst buttonBackgroundColorObject = paletteColors.filter(\n\t\t( { color } ) => color === buttonBackgroundColor\n\t);\n\n\tconst highlightedColors = textColorObject\n\t\t.concat( buttonBackgroundColorObject )\n\t\t.concat( paletteColors )\n\t\t.filter(\n\t\t\t// we exclude these background color because it is already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\treturn {\n\t\tpaletteColors,\n\t\thighlightedColors,\n\t};\n}\n\nexport function useSupportedStyles( name, element ) {\n\tconst { supportedPanels } = useSelect(\n\t\t( select ) => {\n\t\t\treturn {\n\t\t\t\tsupportedPanels: unlock(\n\t\t\t\t\tselect( blocksStore )\n\t\t\t\t).getSupportedStyles( name, element ),\n\t\t\t};\n\t\t},\n\t\t[ name, element ]\n\t);\n\n\treturn supportedPanels;\n}\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/hooks.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/**\n * WordPress dependencies\n */\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { useSelect } from '@wordpress/data';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\n// Enable colord's a11y plugin.\nextend( [ a11yPlugin ] );\n\nexport function useColorRandomizer( name ) {\n\tconst [ themeColors, setThemeColors ] = useGlobalSetting(\n\t\t'color.palette.theme',\n\t\tname\n\t);\n\n\tfunction randomizeColors() {\n\t\t/* eslint-disable no-restricted-syntax */\n\t\tconst randomRotationValue = Math.floor( Math.random() * 225 );\n\t\t/* eslint-enable no-restricted-syntax */\n\n\t\tconst newColors = themeColors.map( ( colorObject ) => {\n\t\t\tconst { color } = colorObject;\n\t\t\tconst newColor = colord( color )\n\t\t\t\t.rotate( randomRotationValue )\n\t\t\t\t.toHex();\n\n\t\t\treturn {\n\t\t\t\t...colorObject,\n\t\t\t\tcolor: newColor,\n\t\t\t};\n\t\t} );\n\n\t\tsetThemeColors( newColors );\n\t}\n\n\treturn window.__experimentalEnableColorRandomizer\n\t\t? [ randomizeColors ]\n\t\t: [];\n}\n\nexport function useStylesPreviewColors() {\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ linkColor = headingColor ] = useGlobalStyle(\n\t\t'elements.link.color.text'\n\t);\n\n\tconst [ buttonBackgroundColor = linkColor ] = useGlobalStyle(\n\t\t'elements.button.color.background'\n\t);\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\n\tconst textColorObject = paletteColors.filter(\n\t\t( { color } ) => color === textColor\n\t);\n\tconst buttonBackgroundColorObject = paletteColors.filter(\n\t\t( { color } ) => color === buttonBackgroundColor\n\t);\n\n\tconst highlightedColors = textColorObject\n\t\t.concat( buttonBackgroundColorObject )\n\t\t.concat( paletteColors )\n\t\t.filter(\n\t\t\t// we exclude these background color because it is already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\treturn {\n\t\tpaletteColors,\n\t\thighlightedColors,\n\t};\n}\n\nexport function useSupportedStyles( name, element ) {\n\tconst { supportedPanels } = useSelect(\n\t\t( select ) => {\n\t\t\treturn {\n\t\t\t\tsupportedPanels: unlock(\n\t\t\t\t\tselect( blocksStore )\n\t\t\t\t).getSupportedStyles( name, element ),\n\t\t\t};\n\t\t},\n\t\t[ name, element ]\n\t);\n\n\treturn supportedPanels;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAA+B;AAC/B,kBAAuB;AAKvB,oBAAqC;AACrC,0BAAsD;AAKtD,yBAAuB;AACvB,kBAA0B;AAE1B,MAAM,EAAE,kBAAkB,eAAe,QAAI,2BAAQ,oBAAAA,WAAuB;AAAA,IAG5E,sBAAQ,CAAE,YAAAC,OAAW,CAAE;AAEhB,SAAS,mBAAoB,MAAO;AAC1C,QAAM,CAAE,aAAa,cAAe,IAAI;AAAA,IACvC;AAAA,IACA;AAAA,EACD;AAEA,WAAS,kBAAkB;AAE1B,UAAM,sBAAsB,KAAK,MAAO,KAAK,OAAO,IAAI,GAAI;AAG5D,UAAM,YAAY,YAAY,IAAK,CAAE,gBAAiB;AACrD,YAAM,EAAE,MAAM,IAAI;AAClB,YAAM,eAAW,sBAAQ,KAAM,EAC7B,OAAQ,mBAAoB,EAC5B,MAAM;AAER,aAAO;AAAA,QACN,GAAG;AAAA,QACH,OAAO;AAAA,MACR;AAAA,IACD,CAAE;AAEF,mBAAgB,SAAU;AAAA,EAC3B;AAEA,SAAO,OAAO,sCACX,CAAE,eAAgB,IAClB,CAAC;AACL;AAEO,SAAS,yBAAyB;AACxC,QAAM,CAAE,YAAY,OAAQ,IAAI,eAAgB,YAAa;AAC7D,QAAM,CAAE,kBAAkB,OAAQ,IAAI,eAAgB,kBAAmB;AACzE,QAAM,CAAE,eAAe,SAAU,IAAI;AAAA,IACpC;AAAA,EACD;AACA,QAAM,CAAE,YAAY,YAAa,IAAI;AAAA,IACpC;AAAA,EACD;AAEA,QAAM,CAAE,wBAAwB,SAAU,IAAI;AAAA,IAC7C;AAAA,EACD;AACA,QAAM,CAAE,UAAW,IAAI,iBAAkB,oBAAqB;AAC9D,QAAM,CAAE,WAAY,IAAI,iBAAkB,qBAAsB;AAChE,QAAM,CAAE,YAAa,IAAI,iBAAkB,sBAAuB;AAElE,QAAM,iBAAkB,eAAe,CAAC,GACtC,OAAQ,gBAAgB,CAAC,CAAE,EAC3B,OAAQ,cAAc,CAAC,CAAE;AAE3B,QAAM,kBAAkB,cAAc;AAAA,IACrC,CAAE,EAAE,MAAM,MAAO,UAAU;AAAA,EAC5B;AACA,QAAM,8BAA8B,cAAc;AAAA,IACjD,CAAE,EAAE,MAAM,MAAO,UAAU;AAAA,EAC5B;AAEA,QAAM,oBAAoB,gBACxB,OAAQ,2BAA4B,EACpC,OAAQ,aAAc,EACtB;AAAA;AAAA,IAEA,CAAE,EAAE,MAAM,MAAO,UAAU;AAAA,EAC5B,EACC,MAAO,GAAG,CAAE;AAEd,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;AAEO,SAAS,mBAAoB,MAAM,SAAU;AACnD,QAAM,EAAE,gBAAgB,QAAI;AAAA,IAC3B,CAAE,WAAY;AACb,aAAO;AAAA,QACN,qBAAiB;AAAA,UAChB,OAAQ,cAAAC,KAAY;AAAA,QACrB,EAAE,mBAAoB,MAAM,OAAQ;AAAA,MACrC;AAAA,IACD;AAAA,IACA,CAAE,MAAM,OAAQ;AAAA,EACjB;AAEA,SAAO;AACR;",
+  "names": ["blockEditorPrivateApis", "a11yPlugin", "blocksStore"]
+}

package/build/components/global-styles/icon-with-current-color.js

@@ -1,28 +1,53 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var icon_with_current_color_exports = {};
+__export(icon_with_current_color_exports, {
+  IconWithCurrentColor: () => IconWithCurrentColor
 });
-exports.IconWithCurrentColor = IconWithCurrentColor;
-var _clsx = _interopRequireDefault(require("clsx"));
-var _components = require("@wordpress/components");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * External dependencies
- */
-
-/**
- * WordPress dependencies
- */
-
-function IconWithCurrentColor({
-  className,
-  ...props
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Icon, {
-    className: (0, _clsx.default)(className, 'edit-site-global-styles-icon-with-current-color'),
-    ...props
-  });
+module.exports = __toCommonJS(icon_with_current_color_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_clsx = __toESM(require("clsx"));
+var import_components = require("@wordpress/components");
+function IconWithCurrentColor({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.Icon,
+    {
+      className: (0, import_clsx.default)(
+        className,
+        "edit-site-global-styles-icon-with-current-color"
+      ),
+      ...props
+    }
+  );
 }
-//# sourceMappingURL=icon-with-current-color.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  IconWithCurrentColor
+});
+//# sourceMappingURL=icon-with-current-color.js.map

package/build/components/global-styles/icon-with-current-color.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_jsxRuntime","IconWithCurrentColor","className","props","jsx","Icon","clsx"],"sources":["@wordpress/edit-site/src/components/global-styles/icon-with-current-color.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Icon } from '@wordpress/components';\n\nexport function IconWithCurrentColor( { className, ...props } ) {\n\treturn (\n\t\t<Icon\n\t\t\tclassName={ clsx(\n\t\t\t\tclassName,\n\t\t\t\t'edit-site-global-styles-icon-with-current-color'\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,WAAA,GAAAD,OAAA;AAA6C,IAAAE,WAAA,GAAAF,OAAA;AAR7C;AACA;AACA;;AAGA;AACA;AACA;;AAGO,SAASG,oBAAoBA,CAAE;EAAEC,SAAS;EAAE,GAAGC;AAAM,CAAC,EAAG;EAC/D,oBACC,IAAAH,WAAA,CAAAI,GAAA,EAACL,WAAA,CAAAM,IAAI;IACJH,SAAS,EAAG,IAAAI,aAAI,EACfJ,SAAS,EACT,iDACD,CAAG;IAAA,GACEC;EAAK,CACV,CAAC;AAEJ","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/icon-with-current-color.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Icon } from '@wordpress/components';\n\nexport function IconWithCurrentColor( { className, ...props } ) {\n\treturn (\n\t\t<Icon\n\t\t\tclassName={ clsx(\n\t\t\t\tclassName,\n\t\t\t\t'edit-site-global-styles-icon-with-current-color'\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAYE;AATF,kBAAiB;AAKjB,wBAAqB;AAEd,SAAS,qBAAsB,EAAE,WAAW,GAAG,MAAM,GAAI;AAC/D,SACC;AAAA,IAAC;AAAA;AAAA,MACA,eAAY,YAAAA;AAAA,QACX;AAAA,QACA;AAAA,MACD;AAAA,MACE,GAAG;AAAA;AAAA,EACN;AAEF;",
+  "names": ["clsx"]
+}

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

@@ -1,14 +1,39 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "GlobalStylesUI", {
-  enumerable: true,
-  get: function () {
-    return _ui.default;
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var global_styles_exports = {};
+__export(global_styles_exports, {
+  GlobalStylesUI: () => import_ui.default
+});
+module.exports = __toCommonJS(global_styles_exports);
+var import_ui = __toESM(require("./ui"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GlobalStylesUI
 });
-var _ui = _interopRequireDefault(require("./ui"));
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["_ui","_interopRequireDefault","require"],"sources":["@wordpress/edit-site/src/components/global-styles/index.js"],"sourcesContent":["export { default as GlobalStylesUI } from './ui';\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,GAAA,GAAAC,sBAAA,CAAAC,OAAA","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/index.js"],
+  "sourcesContent": ["export { default as GlobalStylesUI } from './ui';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAA0C;",
+  "names": []
+}

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

@@ -1,49 +1,48 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var navigation_button_exports = {};
+__export(navigation_button_exports, {
+  NavigationBackButtonAsItem: () => NavigationBackButtonAsItem,
+  NavigationButtonAsItem: () => NavigationButtonAsItem
 });
-exports.NavigationBackButtonAsItem = NavigationBackButtonAsItem;
-exports.NavigationButtonAsItem = NavigationButtonAsItem;
-var _components = require("@wordpress/components");
-var _iconWithCurrentColor = require("./icon-with-current-color");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-function GenericNavigationButton({
-  icon,
-  children,
-  ...props
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalItem, {
-    ...props,
-    children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
-      justify: "flex-start",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_iconWithCurrentColor.IconWithCurrentColor, {
-        icon: icon,
-        size: 24
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-        children: children
-      })]
-    }), !icon && children]
-  });
+module.exports = __toCommonJS(navigation_button_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_icon_with_current_color = require("./icon-with-current-color");
+function GenericNavigationButton({ icon, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalItem, { ...props, children: [
+    icon && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalHStack, { justify: "flex-start", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon_with_current_color.IconWithCurrentColor, { icon, size: 24 }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.FlexItem, { children })
+    ] }),
+    !icon && children
+  ] });
 }
 function NavigationButtonAsItem(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Navigator.Button, {
-    as: GenericNavigationButton,
-    ...props
-  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Navigator.Button, { as: GenericNavigationButton, ...props });
 }
 function NavigationBackButtonAsItem(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Navigator.BackButton, {
-    as: GenericNavigationButton,
-    ...props
-  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Navigator.BackButton, { as: GenericNavigationButton, ...props });
 }
-//# sourceMappingURL=navigation-button.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NavigationBackButtonAsItem,
+  NavigationButtonAsItem
+});
+//# sourceMappingURL=navigation-button.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["_components","require","_iconWithCurrentColor","_jsxRuntime","GenericNavigationButton","icon","children","props","jsxs","__experimentalItem","__experimentalHStack","justify","jsx","IconWithCurrentColor","size","FlexItem","NavigationButtonAsItem","Navigator","Button","as","NavigationBackButtonAsItem","BackButton"],"sources":["@wordpress/edit-site/src/components/global-styles/navigation-button.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tNavigator,\n\t__experimentalItem as Item,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { IconWithCurrentColor } from './icon-with-current-color';\n\nfunction GenericNavigationButton( { icon, children, ...props } ) {\n\treturn (\n\t\t<Item { ...props }>\n\t\t\t{ icon && (\n\t\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t\t<IconWithCurrentColor icon={ icon } size={ 24 } />\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\nfunction NavigationButtonAsItem( props ) {\n\treturn <Navigator.Button as={ GenericNavigationButton } { ...props } />;\n}\n\nfunction NavigationBackButtonAsItem( props ) {\n\treturn <Navigator.BackButton as={ GenericNavigationButton } { ...props } />;\n}\n\nexport { NavigationButtonAsItem, NavigationBackButtonAsItem };\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAUA,IAAAC,qBAAA,GAAAD,OAAA;AAAiE,IAAAE,WAAA,GAAAF,OAAA;AAbjE;AACA;AACA;;AAQA;AACA;AACA;;AAGA,SAASG,uBAAuBA,CAAE;EAAEC,IAAI;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAAG;EAChE,oBACC,IAAAJ,WAAA,CAAAK,IAAA,EAACR,WAAA,CAAAS,kBAAI;IAAA,GAAMF,KAAK;IAAAD,QAAA,GACbD,IAAI,iBACL,IAAAF,WAAA,CAAAK,IAAA,EAACR,WAAA,CAAAU,oBAAM;MAACC,OAAO,EAAC,YAAY;MAAAL,QAAA,gBAC3B,IAAAH,WAAA,CAAAS,GAAA,EAACV,qBAAA,CAAAW,oBAAoB;QAACR,IAAI,EAAGA,IAAM;QAACS,IAAI,EAAG;MAAI,CAAE,CAAC,eAClD,IAAAX,WAAA,CAAAS,GAAA,EAACZ,WAAA,CAAAe,QAAQ;QAAAT,QAAA,EAAGA;MAAQ,CAAY,CAAC;IAAA,CAC1B,CACR,EACC,CAAED,IAAI,IAAIC,QAAQ;EAAA,CACf,CAAC;AAET;AAEA,SAASU,sBAAsBA,CAAET,KAAK,EAAG;EACxC,oBAAO,IAAAJ,WAAA,CAAAS,GAAA,EAACZ,WAAA,CAAAiB,SAAS,CAACC,MAAM;IAACC,EAAE,EAAGf,uBAAyB;IAAA,GAAMG;EAAK,CAAI,CAAC;AACxE;AAEA,SAASa,0BAA0BA,CAAEb,KAAK,EAAG;EAC5C,oBAAO,IAAAJ,WAAA,CAAAS,GAAA,EAACZ,WAAA,CAAAiB,SAAS,CAACI,UAAU;IAACF,EAAE,EAAGf,uBAAyB;IAAA,GAAMG;EAAK,CAAI,CAAC;AAC5E","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/navigation-button.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tNavigator,\n\t__experimentalItem as Item,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { IconWithCurrentColor } from './icon-with-current-color';\n\nfunction GenericNavigationButton( { icon, children, ...props } ) {\n\treturn (\n\t\t<Item { ...props }>\n\t\t\t{ icon && (\n\t\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t\t<IconWithCurrentColor icon={ icon } size={ 24 } />\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\nfunction NavigationButtonAsItem( props ) {\n\treturn <Navigator.Button as={ GenericNavigationButton } { ...props } />;\n}\n\nfunction NavigationBackButtonAsItem( props ) {\n\treturn <Navigator.BackButton as={ GenericNavigationButton } { ...props } />;\n}\n\nexport { NavigationButtonAsItem, NavigationBackButtonAsItem };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBI;AAhBJ,wBAKO;AAKP,qCAAqC;AAErC,SAAS,wBAAyB,EAAE,MAAM,UAAU,GAAG,MAAM,GAAI;AAChE,SACC,6CAAC,kBAAAA,oBAAA,EAAO,GAAG,OACR;AAAA,YACD,6CAAC,kBAAAC,sBAAA,EAAO,SAAQ,cACf;AAAA,kDAAC,uDAAqB,MAAc,MAAO,IAAK;AAAA,MAChD,4CAAC,8BAAW,UAAU;AAAA,OACvB;AAAA,IAEC,CAAE,QAAQ;AAAA,KACb;AAEF;AAEA,SAAS,uBAAwB,OAAQ;AACxC,SAAO,4CAAC,4BAAU,QAAV,EAAiB,IAAK,yBAA4B,GAAG,OAAQ;AACtE;AAEA,SAAS,2BAA4B,OAAQ;AAC5C,SAAO,4CAAC,4BAAU,YAAV,EAAqB,IAAK,yBAA4B,GAAG,OAAQ;AAC1E;",
+  "names": ["Item", "HStack"]
+}