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

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

@@ -1,31 +1,35 @@
 "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 preview_wrapper_exports = {};
+__export(preview_wrapper_exports, {
+  default: () => PreviewWrapper
 });
-exports.default = PreviewWrapper;
-var _blockEditor = require("@wordpress/block-editor");
-var _components = require("@wordpress/components");
-var _compose = require("@wordpress/compose");
-var _element = require("@wordpress/element");
-var _lockUnlock = require("../../lock-unlock");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const {
-  useGlobalStyle
-} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+module.exports = __toCommonJS(preview_wrapper_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_block_editor = require("@wordpress/block-editor");
+var import_components = require("@wordpress/components");
+var import_compose = require("@wordpress/compose");
+var import_element = require("@wordpress/element");
+var import_lock_unlock = require("../../lock-unlock");
+const { useGlobalStyle } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
 const normalizedWidth = 248;
 const normalizedHeight = 152;
-
-// Throttle options for useThrottle. Must be defined outside of the component,
-// so that the object reference is the same on each render.
 const THROTTLE_OPTIONS = {
   leading: true,
   trailing: true
@@ -36,81 +40,62 @@ function PreviewWrapper({
   isFocused,
   withHoverView
 }) {
-  const [backgroundColor = 'white'] = useGlobalStyle('color.background');
-  const [gradientValue] = useGlobalStyle('color.gradient');
-  const disableMotion = (0, _compose.useReducedMotion)();
-  const [isHovered, setIsHovered] = (0, _element.useState)(false);
-  const [containerResizeListener, {
-    width
-  }] = (0, _compose.useResizeObserver)();
-  const [throttledWidth, setThrottledWidthState] = (0, _element.useState)(width);
-  const [ratioState, setRatioState] = (0, _element.useState)();
-  const setThrottledWidth = (0, _compose.useThrottle)(setThrottledWidthState, 250, THROTTLE_OPTIONS);
-
-  // Must use useLayoutEffect to avoid a flash of the container  at the wrong
-  // size before the width is set.
-  (0, _element.useLayoutEffect)(() => {
+  const [backgroundColor = "white"] = useGlobalStyle("color.background");
+  const [gradientValue] = useGlobalStyle("color.gradient");
+  const disableMotion = (0, import_compose.useReducedMotion)();
+  const [isHovered, setIsHovered] = (0, import_element.useState)(false);
+  const [containerResizeListener, { width }] = (0, import_compose.useResizeObserver)();
+  const [throttledWidth, setThrottledWidthState] = (0, import_element.useState)(width);
+  const [ratioState, setRatioState] = (0, import_element.useState)();
+  const setThrottledWidth = (0, import_compose.useThrottle)(
+    setThrottledWidthState,
+    250,
+    THROTTLE_OPTIONS
+  );
+  (0, import_element.useLayoutEffect)(() => {
     if (width) {
       setThrottledWidth(width);
     }
   }, [width, setThrottledWidth]);
-
-  // Must use useLayoutEffect to avoid a flash of the container at the wrong
-  // size before the width is set.
-  (0, _element.useLayoutEffect)(() => {
+  (0, import_element.useLayoutEffect)(() => {
     const newRatio = throttledWidth ? throttledWidth / normalizedWidth : 1;
     const ratioDiff = newRatio - (ratioState || 0);
-
-    // Only update the ratio state if the difference is big enough
-    // or if the ratio state is not yet set. This is to avoid an
-    // endless loop of updates at particular viewport heights when the
-    // presence of a scrollbar causes the width to change slightly.
     const isRatioDiffBigEnough = Math.abs(ratioDiff) > 0.1;
     if (isRatioDiffBigEnough || !ratioState) {
       setRatioState(newRatio);
     }
   }, [throttledWidth, ratioState]);
-
-  // Set a fallbackRatio to use before the throttled ratio has been set.
   const fallbackRatio = width ? width / normalizedWidth : 1;
-  /*
-   * Use the throttled ratio if it has been calculated, otherwise
-   * use the fallback ratio. The throttled ratio is used to avoid
-   * an endless loop of updates at particular viewport heights.
-   * See: https://github.com/WordPress/gutenberg/issues/55112
-   */
   const ratio = ratioState ? ratioState : fallbackRatio;
   const isReady = !!width;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      style: {
-        position: 'relative'
-      },
-      children: containerResizeListener
-    }), isReady && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "edit-site-global-styles-preview__wrapper",
-      style: {
-        height: normalizedHeight * ratio
-      },
-      onMouseEnter: () => setIsHovered(true),
-      onMouseLeave: () => setIsHovered(false),
-      tabIndex: -1,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__unstableMotion.div, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "relative" }, children: containerResizeListener }),
+    isReady && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        className: "edit-site-global-styles-preview__wrapper",
         style: {
-          height: normalizedHeight * ratio,
-          width: '100%',
-          background: gradientValue !== null && gradientValue !== void 0 ? gradientValue : backgroundColor,
-          cursor: withHoverView ? 'pointer' : undefined
+          height: normalizedHeight * ratio
         },
-        initial: "start",
-        animate: (isHovered || isFocused) && !disableMotion && label ? 'hover' : 'start',
-        children: [].concat(children) // This makes sure children is always an array.
-        .map((child, key) => child({
-          ratio,
-          key
-        }))
-      })
-    })]
-  });
+        onMouseEnter: () => setIsHovered(true),
+        onMouseLeave: () => setIsHovered(false),
+        tabIndex: -1,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.__unstableMotion.div,
+          {
+            style: {
+              height: normalizedHeight * ratio,
+              width: "100%",
+              background: gradientValue ?? backgroundColor,
+              cursor: withHoverView ? "pointer" : void 0
+            },
+            initial: "start",
+            animate: (isHovered || isFocused) && !disableMotion && label ? "hover" : "start",
+            children: [].concat(children).map((child, key) => child({ ratio, key }))
+          }
+        )
+      }
+    )
+  ] });
 }
-//# sourceMappingURL=preview-wrapper.js.map
+//# sourceMappingURL=preview-wrapper.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["_blockEditor","require","_components","_compose","_element","_lockUnlock","_jsxRuntime","useGlobalStyle","unlock","blockEditorPrivateApis","normalizedWidth","normalizedHeight","THROTTLE_OPTIONS","leading","trailing","PreviewWrapper","children","label","isFocused","withHoverView","backgroundColor","gradientValue","disableMotion","useReducedMotion","isHovered","setIsHovered","useState","containerResizeListener","width","useResizeObserver","throttledWidth","setThrottledWidthState","ratioState","setRatioState","setThrottledWidth","useThrottle","useLayoutEffect","newRatio","ratioDiff","isRatioDiffBigEnough","Math","abs","fallbackRatio","ratio","isReady","jsxs","Fragment","jsx","style","position","className","height","onMouseEnter","onMouseLeave","tabIndex","__unstableMotion","div","background","cursor","undefined","initial","animate","concat","map","child","key"],"sources":["@wordpress/edit-site/src/components/global-styles/preview-wrapper.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { __unstableMotion as motion } from '@wordpress/components';\nimport {\n\tuseThrottle,\n\tuseReducedMotion,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { useLayoutEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\n// Throttle options for useThrottle. Must be defined outside of the component,\n// so that the object reference is the same on each render.\nconst THROTTLE_OPTIONS = {\n\tleading: true,\n\ttrailing: true,\n};\n\nexport default function PreviewWrapper( {\n\tchildren,\n\tlabel,\n\tisFocused,\n\twithHoverView,\n} ) {\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst disableMotion = useReducedMotion();\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst [ throttledWidth, setThrottledWidthState ] = useState( width );\n\tconst [ ratioState, setRatioState ] = useState();\n\n\tconst setThrottledWidth = useThrottle(\n\t\tsetThrottledWidthState,\n\t\t250,\n\t\tTHROTTLE_OPTIONS\n\t);\n\n\t// Must use useLayoutEffect to avoid a flash of the container  at the wrong\n\t// size before the width is set.\n\tuseLayoutEffect( () => {\n\t\tif ( width ) {\n\t\t\tsetThrottledWidth( width );\n\t\t}\n\t}, [ width, setThrottledWidth ] );\n\n\t// Must use useLayoutEffect to avoid a flash of the container at the wrong\n\t// size before the width is set.\n\tuseLayoutEffect( () => {\n\t\tconst newRatio = throttledWidth ? throttledWidth / normalizedWidth : 1;\n\t\tconst ratioDiff = newRatio - ( ratioState || 0 );\n\n\t\t// Only update the ratio state if the difference is big enough\n\t\t// or if the ratio state is not yet set. This is to avoid an\n\t\t// endless loop of updates at particular viewport heights when the\n\t\t// presence of a scrollbar causes the width to change slightly.\n\t\tconst isRatioDiffBigEnough = Math.abs( ratioDiff ) > 0.1;\n\n\t\tif ( isRatioDiffBigEnough || ! ratioState ) {\n\t\t\tsetRatioState( newRatio );\n\t\t}\n\t}, [ throttledWidth, ratioState ] );\n\n\t// Set a fallbackRatio to use before the throttled ratio has been set.\n\tconst fallbackRatio = width ? width / normalizedWidth : 1;\n\t/*\n\t * Use the throttled ratio if it has been calculated, otherwise\n\t * use the fallback ratio. The throttled ratio is used to avoid\n\t * an endless loop of updates at particular viewport heights.\n\t * See: https://github.com/WordPress/gutenberg/issues/55112\n\t */\n\tconst ratio = ratioState ? ratioState : fallbackRatio;\n\n\tconst isReady = !! width;\n\n\treturn (\n\t\t<>\n\t\t\t<div style={ { position: 'relative' } }>\n\t\t\t\t{ containerResizeListener }\n\t\t\t</div>\n\t\t\t{ isReady && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"edit-site-global-styles-preview__wrapper\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t} }\n\t\t\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\t\t\tcursor: withHoverView ? 'pointer' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitial=\"start\"\n\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t( isHovered || isFocused ) &&\n\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t\t\t: 'start'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ []\n\t\t\t\t\t\t\t.concat( children ) // This makes sure children is always an array.\n\t\t\t\t\t\t\t.map( ( child, key ) => child( { ratio, key } ) ) }\n\t\t\t\t\t</motion.div>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,QAAA,GAAAH,OAAA;AAKA,IAAAI,WAAA,GAAAJ,OAAA;AAA2C,IAAAK,WAAA,GAAAL,OAAA;AAf3C;AACA;AACA;;AAUA;AACA;AACA;;AAGA,MAAM;EAAEM;AAAe,CAAC,GAAG,IAAAC,kBAAM,EAAEC,wBAAuB,CAAC;AAE3D,MAAMC,eAAe,GAAG,GAAG;AAC3B,MAAMC,gBAAgB,GAAG,GAAG;;AAE5B;AACA;AACA,MAAMC,gBAAgB,GAAG;EACxBC,OAAO,EAAE,IAAI;EACbC,QAAQ,EAAE;AACX,CAAC;AAEc,SAASC,cAAcA,CAAE;EACvCC,QAAQ;EACRC,KAAK;EACLC,SAAS;EACTC;AACD,CAAC,EAAG;EACH,MAAM,CAAEC,eAAe,GAAG,OAAO,CAAE,GAAGb,cAAc,CAAE,kBAAmB,CAAC;EAC1E,MAAM,CAAEc,aAAa,CAAE,GAAGd,cAAc,CAAE,gBAAiB,CAAC;EAC5D,MAAMe,aAAa,GAAG,IAAAC,yBAAgB,EAAC,CAAC;EACxC,MAAM,CAAEC,SAAS,EAAEC,YAAY,CAAE,GAAG,IAAAC,iBAAQ,EAAE,KAAM,CAAC;EACrD,MAAM,CAAEC,uBAAuB,EAAE;IAAEC;EAAM,CAAC,CAAE,GAAG,IAAAC,0BAAiB,EAAC,CAAC;EAClE,MAAM,CAAEC,cAAc,EAAEC,sBAAsB,CAAE,GAAG,IAAAL,iBAAQ,EAAEE,KAAM,CAAC;EACpE,MAAM,CAAEI,UAAU,EAAEC,aAAa,CAAE,GAAG,IAAAP,iBAAQ,EAAC,CAAC;EAEhD,MAAMQ,iBAAiB,GAAG,IAAAC,oBAAW,EACpCJ,sBAAsB,EACtB,GAAG,EACHnB,gBACD,CAAC;;EAED;EACA;EACA,IAAAwB,wBAAe,EAAE,MAAM;IACtB,IAAKR,KAAK,EAAG;MACZM,iBAAiB,CAAEN,KAAM,CAAC;IAC3B;EACD,CAAC,EAAE,CAAEA,KAAK,EAAEM,iBAAiB,CAAG,CAAC;;EAEjC;EACA;EACA,IAAAE,wBAAe,EAAE,MAAM;IACtB,MAAMC,QAAQ,GAAGP,cAAc,GAAGA,cAAc,GAAGpB,eAAe,GAAG,CAAC;IACtE,MAAM4B,SAAS,GAAGD,QAAQ,IAAKL,UAAU,IAAI,CAAC,CAAE;;IAEhD;IACA;IACA;IACA;IACA,MAAMO,oBAAoB,GAAGC,IAAI,CAACC,GAAG,CAAEH,SAAU,CAAC,GAAG,GAAG;IAExD,IAAKC,oBAAoB,IAAI,CAAEP,UAAU,EAAG;MAC3CC,aAAa,CAAEI,QAAS,CAAC;IAC1B;EACD,CAAC,EAAE,CAAEP,cAAc,EAAEE,UAAU,CAAG,CAAC;;EAEnC;EACA,MAAMU,aAAa,GAAGd,KAAK,GAAGA,KAAK,GAAGlB,eAAe,GAAG,CAAC;EACzD;AACD;AACA;AACA;AACA;AACA;EACC,MAAMiC,KAAK,GAAGX,UAAU,GAAGA,UAAU,GAAGU,aAAa;EAErD,MAAME,OAAO,GAAG,CAAC,CAAEhB,KAAK;EAExB,oBACC,IAAAtB,WAAA,CAAAuC,IAAA,EAAAvC,WAAA,CAAAwC,QAAA;IAAA9B,QAAA,gBACC,IAAAV,WAAA,CAAAyC,GAAA;MAAKC,KAAK,EAAG;QAAEC,QAAQ,EAAE;MAAW,CAAG;MAAAjC,QAAA,EACpCW;IAAuB,CACrB,CAAC,EACJiB,OAAO,iBACR,IAAAtC,WAAA,CAAAyC,GAAA;MACCG,SAAS,EAAC,0CAA0C;MACpDF,KAAK,EAAG;QACPG,MAAM,EAAExC,gBAAgB,GAAGgC;MAC5B,CAAG;MACHS,YAAY,EAAGA,CAAA,KAAM3B,YAAY,CAAE,IAAK,CAAG;MAC3C4B,YAAY,EAAGA,CAAA,KAAM5B,YAAY,CAAE,KAAM,CAAG;MAC5C6B,QAAQ,EAAG,CAAC,CAAG;MAAAtC,QAAA,eAEf,IAAAV,WAAA,CAAAyC,GAAA,EAAC7C,WAAA,CAAAqD,gBAAM,CAACC,GAAG;QACVR,KAAK,EAAG;UACPG,MAAM,EAAExC,gBAAgB,GAAGgC,KAAK;UAChCf,KAAK,EAAE,MAAM;UACb6B,UAAU,EAAEpC,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAID,eAAe;UAC5CsC,MAAM,EAAEvC,aAAa,GAAG,SAAS,GAAGwC;QACrC,CAAG;QACHC,OAAO,EAAC,OAAO;QACfC,OAAO,EACN,CAAErC,SAAS,IAAIN,SAAS,KACxB,CAAEI,aAAa,IACfL,KAAK,GACF,OAAO,GACP,OACH;QAAAD,QAAA,EAEC,EAAE,CACF8C,MAAM,CAAE9C,QAAS,CAAC,CAAC;QAAA,CACnB+C,GAAG,CAAE,CAAEC,KAAK,EAAEC,GAAG,KAAMD,KAAK,CAAE;UAAErB,KAAK;UAAEsB;QAAI,CAAE,CAAE;MAAC,CACvC;IAAC,CACT,CACL;EAAA,CACA,CAAC;AAEL","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/preview-wrapper.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { __unstableMotion as motion } from '@wordpress/components';\nimport {\n\tuseThrottle,\n\tuseReducedMotion,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { useLayoutEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\n// Throttle options for useThrottle. Must be defined outside of the component,\n// so that the object reference is the same on each render.\nconst THROTTLE_OPTIONS = {\n\tleading: true,\n\ttrailing: true,\n};\n\nexport default function PreviewWrapper( {\n\tchildren,\n\tlabel,\n\tisFocused,\n\twithHoverView,\n} ) {\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst disableMotion = useReducedMotion();\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst [ throttledWidth, setThrottledWidthState ] = useState( width );\n\tconst [ ratioState, setRatioState ] = useState();\n\n\tconst setThrottledWidth = useThrottle(\n\t\tsetThrottledWidthState,\n\t\t250,\n\t\tTHROTTLE_OPTIONS\n\t);\n\n\t// Must use useLayoutEffect to avoid a flash of the container  at the wrong\n\t// size before the width is set.\n\tuseLayoutEffect( () => {\n\t\tif ( width ) {\n\t\t\tsetThrottledWidth( width );\n\t\t}\n\t}, [ width, setThrottledWidth ] );\n\n\t// Must use useLayoutEffect to avoid a flash of the container at the wrong\n\t// size before the width is set.\n\tuseLayoutEffect( () => {\n\t\tconst newRatio = throttledWidth ? throttledWidth / normalizedWidth : 1;\n\t\tconst ratioDiff = newRatio - ( ratioState || 0 );\n\n\t\t// Only update the ratio state if the difference is big enough\n\t\t// or if the ratio state is not yet set. This is to avoid an\n\t\t// endless loop of updates at particular viewport heights when the\n\t\t// presence of a scrollbar causes the width to change slightly.\n\t\tconst isRatioDiffBigEnough = Math.abs( ratioDiff ) > 0.1;\n\n\t\tif ( isRatioDiffBigEnough || ! ratioState ) {\n\t\t\tsetRatioState( newRatio );\n\t\t}\n\t}, [ throttledWidth, ratioState ] );\n\n\t// Set a fallbackRatio to use before the throttled ratio has been set.\n\tconst fallbackRatio = width ? width / normalizedWidth : 1;\n\t/*\n\t * Use the throttled ratio if it has been calculated, otherwise\n\t * use the fallback ratio. The throttled ratio is used to avoid\n\t * an endless loop of updates at particular viewport heights.\n\t * See: https://github.com/WordPress/gutenberg/issues/55112\n\t */\n\tconst ratio = ratioState ? ratioState : fallbackRatio;\n\n\tconst isReady = !! width;\n\n\treturn (\n\t\t<>\n\t\t\t<div style={ { position: 'relative' } }>\n\t\t\t\t{ containerResizeListener }\n\t\t\t</div>\n\t\t\t{ isReady && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"edit-site-global-styles-preview__wrapper\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t} }\n\t\t\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\t\t\tcursor: withHoverView ? 'pointer' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitial=\"start\"\n\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t( isHovered || isFocused ) &&\n\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t\t\t: 'start'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ []\n\t\t\t\t\t\t\t.concat( children ) // This makes sure children is always an array.\n\t\t\t\t\t\t\t.map( ( child, key ) => child( { ratio, key } ) ) }\n\t\t\t\t\t</motion.div>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuFE;AApFF,0BAAsD;AACtD,wBAA2C;AAC3C,qBAIO;AACP,qBAA0C;AAK1C,yBAAuB;AAEvB,MAAM,EAAE,eAAe,QAAI,2BAAQ,oBAAAA,WAAuB;AAE1D,MAAM,kBAAkB;AACxB,MAAM,mBAAmB;AAIzB,MAAM,mBAAmB;AAAA,EACxB,SAAS;AAAA,EACT,UAAU;AACX;AAEe,SAAR,eAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,kBAAkB,OAAQ,IAAI,eAAgB,kBAAmB;AACzE,QAAM,CAAE,aAAc,IAAI,eAAgB,gBAAiB;AAC3D,QAAM,oBAAgB,iCAAiB;AACvC,QAAM,CAAE,WAAW,YAAa,QAAI,yBAAU,KAAM;AACpD,QAAM,CAAE,yBAAyB,EAAE,MAAM,CAAE,QAAI,kCAAkB;AACjE,QAAM,CAAE,gBAAgB,sBAAuB,QAAI,yBAAU,KAAM;AACnE,QAAM,CAAE,YAAY,aAAc,QAAI,yBAAS;AAE/C,QAAM,wBAAoB;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAIA,sCAAiB,MAAM;AACtB,QAAK,OAAQ;AACZ,wBAAmB,KAAM;AAAA,IAC1B;AAAA,EACD,GAAG,CAAE,OAAO,iBAAkB,CAAE;AAIhC,sCAAiB,MAAM;AACtB,UAAM,WAAW,iBAAiB,iBAAiB,kBAAkB;AACrE,UAAM,YAAY,YAAa,cAAc;AAM7C,UAAM,uBAAuB,KAAK,IAAK,SAAU,IAAI;AAErD,QAAK,wBAAwB,CAAE,YAAa;AAC3C,oBAAe,QAAS;AAAA,IACzB;AAAA,EACD,GAAG,CAAE,gBAAgB,UAAW,CAAE;AAGlC,QAAM,gBAAgB,QAAQ,QAAQ,kBAAkB;AAOxD,QAAM,QAAQ,aAAa,aAAa;AAExC,QAAM,UAAU,CAAC,CAAE;AAEnB,SACC,4EACC;AAAA,gDAAC,SAAI,OAAQ,EAAE,UAAU,WAAW,GACjC,mCACH;AAAA,IACE,WACD;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAQ;AAAA,UACP,QAAQ,mBAAmB;AAAA,QAC5B;AAAA,QACA,cAAe,MAAM,aAAc,IAAK;AAAA,QACxC,cAAe,MAAM,aAAc,KAAM;AAAA,QACzC,UAAW;AAAA,QAEX;AAAA,UAAC,kBAAAC,iBAAO;AAAA,UAAP;AAAA,YACA,OAAQ;AAAA,cACP,QAAQ,mBAAmB;AAAA,cAC3B,OAAO;AAAA,cACP,YAAY,iBAAiB;AAAA,cAC7B,QAAQ,gBAAgB,YAAY;AAAA,YACrC;AAAA,YACA,SAAQ;AAAA,YACR,UACG,aAAa,cACf,CAAE,iBACF,QACG,UACA;AAAA,YAGF,WAAC,EACD,OAAQ,QAAS,EACjB,IAAK,CAAE,OAAO,QAAS,MAAO,EAAE,OAAO,IAAI,CAAE,CAAE;AAAA;AAAA,QAClD;AAAA;AAAA,IACD;AAAA,KAEF;AAEF;",
+  "names": ["blockEditorPrivateApis", "motion"]
+}

package/build/components/global-styles/root-menu.js

@@ -1,24 +1,33 @@
 "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 root_menu_exports = {};
+__export(root_menu_exports, {
+  default: () => root_menu_default
 });
-exports.default = void 0;
-var _components = require("@wordpress/components");
-var _icons = require("@wordpress/icons");
-var _i18n = require("@wordpress/i18n");
-var _blockEditor = require("@wordpress/block-editor");
-var _navigationButton = require("./navigation-button");
-var _lockUnlock = require("../../lock-unlock");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
+module.exports = __toCommonJS(root_menu_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_icons = require("@wordpress/icons");
+var import_i18n = require("@wordpress/i18n");
+var import_block_editor = require("@wordpress/block-editor");
+var import_navigation_button = require("./navigation-button");
+var import_lock_unlock = require("../../lock-unlock");
 const {
   useHasDimensionsPanel,
   useHasTypographyPanel,
@@ -26,46 +35,38 @@ const {
   useGlobalSetting,
   useSettingsForBlockElement,
   useHasBackgroundPanel
-} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+} = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
 function RootMenu() {
-  const [rawSettings] = useGlobalSetting('');
+  const [rawSettings] = useGlobalSetting("");
   const settings = useSettingsForBlockElement(rawSettings);
-  /*
-   * Use the raw settings to determine if the background panel should be displayed,
-   * as the background panel is not dependent on the block element settings.
-   */
   const hasBackgroundPanel = useHasBackgroundPanel(rawSettings);
   const hasTypographyPanel = useHasTypographyPanel(settings);
   const hasColorPanel = useHasColorPanel(settings);
-  const hasShadowPanel = true; // useHasShadowPanel( settings );
+  const hasShadowPanel = true;
   const hasDimensionsPanel = useHasDimensionsPanel(settings);
   const hasLayoutPanel = hasDimensionsPanel;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalItemGroup, {
-      children: [hasTypographyPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_navigationButton.NavigationButtonAsItem, {
-        icon: _icons.typography,
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalItemGroup, { children: [
+    hasTypographyPanel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_navigation_button.NavigationButtonAsItem,
+      {
+        icon: import_icons.typography,
         path: "/typography",
-        children: (0, _i18n.__)('Typography')
-      }), hasColorPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_navigationButton.NavigationButtonAsItem, {
-        icon: _icons.color,
-        path: "/colors",
-        children: (0, _i18n.__)('Colors')
-      }), hasBackgroundPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_navigationButton.NavigationButtonAsItem, {
-        icon: _icons.background,
+        children: (0, import_i18n.__)("Typography")
+      }
+    ),
+    hasColorPanel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_navigation_button.NavigationButtonAsItem, { icon: import_icons.color, path: "/colors", children: (0, import_i18n.__)("Colors") }),
+    hasBackgroundPanel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_navigation_button.NavigationButtonAsItem,
+      {
+        icon: import_icons.background,
         path: "/background",
-        "aria-label": (0, _i18n.__)('Background styles'),
-        children: (0, _i18n.__)('Background')
-      }), hasShadowPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_navigationButton.NavigationButtonAsItem, {
-        icon: _icons.shadow,
-        path: "/shadows",
-        children: (0, _i18n.__)('Shadows')
-      }), hasLayoutPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_navigationButton.NavigationButtonAsItem, {
-        icon: _icons.layout,
-        path: "/layout",
-        children: (0, _i18n.__)('Layout')
-      })]
-    })
-  });
+        "aria-label": (0, import_i18n.__)("Background styles"),
+        children: (0, import_i18n.__)("Background")
+      }
+    ),
+    hasShadowPanel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_navigation_button.NavigationButtonAsItem, { icon: import_icons.shadow, path: "/shadows", children: (0, import_i18n.__)("Shadows") }),
+    hasLayoutPanel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_navigation_button.NavigationButtonAsItem, { icon: import_icons.layout, path: "/layout", children: (0, import_i18n.__)("Layout") })
+  ] }) });
 }
-var _default = exports.default = RootMenu;
-//# sourceMappingURL=root-menu.js.map
+var root_menu_default = RootMenu;
+//# sourceMappingURL=root-menu.js.map

package/build/components/global-styles/root-menu.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_components","require","_icons","_i18n","_blockEditor","_navigationButton","_lockUnlock","_jsxRuntime","useHasDimensionsPanel","useHasTypographyPanel","useHasColorPanel","useGlobalSetting","useSettingsForBlockElement","useHasBackgroundPanel","unlock","blockEditorPrivateApis","RootMenu","rawSettings","settings","hasBackgroundPanel","hasTypographyPanel","hasColorPanel","hasShadowPanel","hasDimensionsPanel","hasLayoutPanel","jsx","Fragment","children","jsxs","__experimentalItemGroup","NavigationButtonAsItem","icon","typography","path","__","color","background","shadowIcon","layout","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/root-menu.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalItemGroup as ItemGroup } from '@wordpress/components';\nimport {\n\tbackground,\n\ttypography,\n\tcolor,\n\tlayout,\n\tshadow as shadowIcon,\n} from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasColorPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasBackgroundPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction RootMenu() {\n\tconst [ rawSettings ] = useGlobalSetting( '' );\n\tconst settings = useSettingsForBlockElement( rawSettings );\n\t/*\n\t * Use the raw settings to determine if the background panel should be displayed,\n\t * as the background panel is not dependent on the block element settings.\n\t */\n\tconst hasBackgroundPanel = useHasBackgroundPanel( rawSettings );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasShadowPanel = true; // useHasShadowPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasDimensionsPanel;\n\n\treturn (\n\t\t<>\n\t\t\t<ItemGroup>\n\t\t\t\t{ hasTypographyPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ typography }\n\t\t\t\t\t\tpath=\"/typography\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasColorPanel && (\n\t\t\t\t\t<NavigationButtonAsItem icon={ color } path=\"/colors\">\n\t\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasBackgroundPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ background }\n\t\t\t\t\t\tpath=\"/background\"\n\t\t\t\t\t\taria-label={ __( 'Background styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Background' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasShadowPanel && (\n\t\t\t\t\t<NavigationButtonAsItem icon={ shadowIcon } path=\"/shadows\">\n\t\t\t\t\t\t{ __( 'Shadows' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasLayoutPanel && (\n\t\t\t\t\t<NavigationButtonAsItem icon={ layout } path=\"/layout\">\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default RootMenu;\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAOA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,YAAA,GAAAH,OAAA;AAKA,IAAAI,iBAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AAA2C,IAAAM,WAAA,GAAAN,OAAA;AAlB3C;AACA;AACA;;AAYA;AACA;AACA;;AAIA,MAAM;EACLO,qBAAqB;EACrBC,qBAAqB;EACrBC,gBAAgB;EAChBC,gBAAgB;EAChBC,0BAA0B;EAC1BC;AACD,CAAC,GAAG,IAAAC,kBAAM,EAAEC,wBAAuB,CAAC;AAEpC,SAASC,QAAQA,CAAA,EAAG;EACnB,MAAM,CAAEC,WAAW,CAAE,GAAGN,gBAAgB,CAAE,EAAG,CAAC;EAC9C,MAAMO,QAAQ,GAAGN,0BAA0B,CAAEK,WAAY,CAAC;EAC1D;AACD;AACA;AACA;EACC,MAAME,kBAAkB,GAAGN,qBAAqB,CAAEI,WAAY,CAAC;EAC/D,MAAMG,kBAAkB,GAAGX,qBAAqB,CAAES,QAAS,CAAC;EAC5D,MAAMG,aAAa,GAAGX,gBAAgB,CAAEQ,QAAS,CAAC;EAClD,MAAMI,cAAc,GAAG,IAAI,CAAC,CAAC;EAC7B,MAAMC,kBAAkB,GAAGf,qBAAqB,CAAEU,QAAS,CAAC;EAC5D,MAAMM,cAAc,GAAGD,kBAAkB;EAEzC,oBACC,IAAAhB,WAAA,CAAAkB,GAAA,EAAAlB,WAAA,CAAAmB,QAAA;IAAAC,QAAA,eACC,IAAApB,WAAA,CAAAqB,IAAA,EAAC5B,WAAA,CAAA6B,uBAAS;MAAAF,QAAA,GACPP,kBAAkB,iBACnB,IAAAb,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAyB,sBAAsB;QACtBC,IAAI,EAAGC,iBAAY;QACnBC,IAAI,EAAC,aAAa;QAAAN,QAAA,EAEhB,IAAAO,QAAE,EAAE,YAAa;MAAC,CACG,CACxB,EACCb,aAAa,iBACd,IAAAd,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAyB,sBAAsB;QAACC,IAAI,EAAGI,YAAO;QAACF,IAAI,EAAC,SAAS;QAAAN,QAAA,EAClD,IAAAO,QAAE,EAAE,QAAS;MAAC,CACO,CACxB,EACCf,kBAAkB,iBACnB,IAAAZ,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAyB,sBAAsB;QACtBC,IAAI,EAAGK,iBAAY;QACnBH,IAAI,EAAC,aAAa;QAClB,cAAa,IAAAC,QAAE,EAAE,mBAAoB,CAAG;QAAAP,QAAA,EAEtC,IAAAO,QAAE,EAAE,YAAa;MAAC,CACG,CACxB,EACCZ,cAAc,iBACf,IAAAf,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAyB,sBAAsB;QAACC,IAAI,EAAGM,aAAY;QAACJ,IAAI,EAAC,UAAU;QAAAN,QAAA,EACxD,IAAAO,QAAE,EAAE,SAAU;MAAC,CACM,CACxB,EACCV,cAAc,iBACf,IAAAjB,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAyB,sBAAsB;QAACC,IAAI,EAAGO,aAAQ;QAACL,IAAI,EAAC,SAAS;QAAAN,QAAA,EACnD,IAAAO,QAAE,EAAE,QAAS;MAAC,CACO,CACxB;IAAA,CACS;EAAC,CACX,CAAC;AAEL;AAAC,IAAAK,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEczB,QAAQ","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/root-menu.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalItemGroup as ItemGroup } from '@wordpress/components';\nimport {\n\tbackground,\n\ttypography,\n\tcolor,\n\tlayout,\n\tshadow as shadowIcon,\n} from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasColorPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasBackgroundPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction RootMenu() {\n\tconst [ rawSettings ] = useGlobalSetting( '' );\n\tconst settings = useSettingsForBlockElement( rawSettings );\n\t/*\n\t * Use the raw settings to determine if the background panel should be displayed,\n\t * as the background panel is not dependent on the block element settings.\n\t */\n\tconst hasBackgroundPanel = useHasBackgroundPanel( rawSettings );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasShadowPanel = true; // useHasShadowPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasDimensionsPanel;\n\n\treturn (\n\t\t<>\n\t\t\t<ItemGroup>\n\t\t\t\t{ hasTypographyPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ typography }\n\t\t\t\t\t\tpath=\"/typography\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasColorPanel && (\n\t\t\t\t\t<NavigationButtonAsItem icon={ color } path=\"/colors\">\n\t\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasBackgroundPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ background }\n\t\t\t\t\t\tpath=\"/background\"\n\t\t\t\t\t\taria-label={ __( 'Background styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Background' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasShadowPanel && (\n\t\t\t\t\t<NavigationButtonAsItem icon={ shadowIcon } path=\"/shadows\">\n\t\t\t\t\t\t{ __( 'Shadows' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasLayoutPanel && (\n\t\t\t\t\t<NavigationButtonAsItem icon={ layout } path=\"/layout\">\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default RootMenu;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CE;AAzCF,wBAAqD;AACrD,mBAMO;AACP,kBAAmB;AACnB,0BAAsD;AAKtD,+BAAuC;AACvC,yBAAuB;AAEvB,MAAM;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,QAAI,2BAAQ,oBAAAA,WAAuB;AAEnC,SAAS,WAAW;AACnB,QAAM,CAAE,WAAY,IAAI,iBAAkB,EAAG;AAC7C,QAAM,WAAW,2BAA4B,WAAY;AAKzD,QAAM,qBAAqB,sBAAuB,WAAY;AAC9D,QAAM,qBAAqB,sBAAuB,QAAS;AAC3D,QAAM,gBAAgB,iBAAkB,QAAS;AACjD,QAAM,iBAAiB;AACvB,QAAM,qBAAqB,sBAAuB,QAAS;AAC3D,QAAM,iBAAiB;AAEvB,SACC,2EACC,uDAAC,kBAAAC,yBAAA,EACE;AAAA,0BACD;AAAA,MAAC;AAAA;AAAA,QACA,MAAO;AAAA,QACP,MAAK;AAAA,QAEH,8BAAI,YAAa;AAAA;AAAA,IACpB;AAAA,IAEC,iBACD,4CAAC,mDAAuB,MAAO,oBAAQ,MAAK,WACzC,8BAAI,QAAS,GAChB;AAAA,IAEC,sBACD;AAAA,MAAC;AAAA;AAAA,QACA,MAAO;AAAA,QACP,MAAK;AAAA,QACL,kBAAa,gBAAI,mBAAoB;AAAA,QAEnC,8BAAI,YAAa;AAAA;AAAA,IACpB;AAAA,IAEC,kBACD,4CAAC,mDAAuB,MAAO,aAAAC,QAAa,MAAK,YAC9C,8BAAI,SAAU,GACjB;AAAA,IAEC,kBACD,4CAAC,mDAAuB,MAAO,qBAAS,MAAK,WAC1C,8BAAI,QAAS,GAChB;AAAA,KAEF,GACD;AAEF;AAEA,IAAO,oBAAQ;",
+  "names": ["blockEditorPrivateApis", "ItemGroup", "shadowIcon"]
+}

package/build/components/global-styles/screen-background.js

@@ -1,40 +1,59 @@
 "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 screen_background_exports = {};
+__export(screen_background_exports, {
+  default: () => screen_background_default
 });
-exports.default = void 0;
-var _i18n = require("@wordpress/i18n");
-var _blockEditor = require("@wordpress/block-editor");
-var _components = require("@wordpress/components");
-var _backgroundPanel = _interopRequireDefault(require("./background-panel"));
-var _header = _interopRequireDefault(require("./header"));
-var _lockUnlock = require("../../lock-unlock");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const {
-  useHasBackgroundPanel,
-  useGlobalSetting
-} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+module.exports = __toCommonJS(screen_background_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_i18n = require("@wordpress/i18n");
+var import_block_editor = require("@wordpress/block-editor");
+var import_components = require("@wordpress/components");
+var import_background_panel = __toESM(require("./background-panel"));
+var import_header = __toESM(require("./header"));
+var import_lock_unlock = require("../../lock-unlock");
+const { useHasBackgroundPanel, useGlobalSetting } = (0, import_lock_unlock.unlock)(
+  import_block_editor.privateApis
+);
 function ScreenBackground() {
-  const [settings] = useGlobalSetting('');
+  const [settings] = useGlobalSetting("");
   const hasBackgroundPanel = useHasBackgroundPanel(settings);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_header.default, {
-      title: (0, _i18n.__)('Background'),
-      description: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalText, {
-        children: (0, _i18n.__)('Set styles for the site’s background.')
-      })
-    }), hasBackgroundPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_backgroundPanel.default, {})]
-  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_header.default,
+      {
+        title: (0, import_i18n.__)("Background"),
+        description: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalText, { children: (0, import_i18n.__)("Set styles for the site\u2019s background.") })
+      }
+    ),
+    hasBackgroundPanel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_background_panel.default, {})
+  ] });
 }
-var _default = exports.default = ScreenBackground;
-//# sourceMappingURL=screen-background.js.map
+var screen_background_default = ScreenBackground;
+//# sourceMappingURL=screen-background.js.map

package/build/components/global-styles/screen-background.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_i18n","require","_blockEditor","_components","_backgroundPanel","_interopRequireDefault","_header","_lockUnlock","_jsxRuntime","useHasBackgroundPanel","useGlobalSetting","unlock","blockEditorPrivateApis","ScreenBackground","settings","hasBackgroundPanel","jsxs","Fragment","children","jsx","default","title","__","description","__experimentalText","_default","exports"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-background.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { __experimentalText as Text } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BackgroundPanel from './background-panel';\nimport ScreenHeader from './header';\nimport { unlock } from '../../lock-unlock';\n\nconst { useHasBackgroundPanel, useGlobalSetting } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction ScreenBackground() {\n\tconst [ settings ] = useGlobalSetting( '' );\n\tconst hasBackgroundPanel = useHasBackgroundPanel( settings );\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Background' ) }\n\t\t\t\tdescription={\n\t\t\t\t\t<Text>\n\t\t\t\t\t\t{ __( 'Set styles for the site’s background.' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ hasBackgroundPanel && <BackgroundPanel /> }\n\t\t</>\n\t);\n}\n\nexport default ScreenBackground;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAKA,IAAAG,gBAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAD,sBAAA,CAAAJ,OAAA;AACA,IAAAM,WAAA,GAAAN,OAAA;AAA2C,IAAAO,WAAA,GAAAP,OAAA;AAZ3C;AACA;AACA;;AAKA;AACA;AACA;;AAKA,MAAM;EAAEQ,qBAAqB;EAAEC;AAAiB,CAAC,GAAG,IAAAC,kBAAM,EACzDC,wBACD,CAAC;AAED,SAASC,gBAAgBA,CAAA,EAAG;EAC3B,MAAM,CAAEC,QAAQ,CAAE,GAAGJ,gBAAgB,CAAE,EAAG,CAAC;EAC3C,MAAMK,kBAAkB,GAAGN,qBAAqB,CAAEK,QAAS,CAAC;EAC5D,oBACC,IAAAN,WAAA,CAAAQ,IAAA,EAAAR,WAAA,CAAAS,QAAA;IAAAC,QAAA,gBACC,IAAAV,WAAA,CAAAW,GAAA,EAACb,OAAA,CAAAc,OAAY;MACZC,KAAK,EAAG,IAAAC,QAAE,EAAE,YAAa,CAAG;MAC5BC,WAAW,eACV,IAAAf,WAAA,CAAAW,GAAA,EAAChB,WAAA,CAAAqB,kBAAI;QAAAN,QAAA,EACF,IAAAI,QAAE,EAAE,uCAAwC;MAAC,CAC1C;IACN,CACD,CAAC,EACAP,kBAAkB,iBAAI,IAAAP,WAAA,CAAAW,GAAA,EAACf,gBAAA,CAAAgB,OAAe,IAAE,CAAC;EAAA,CAC1C,CAAC;AAEL;AAAC,IAAAK,QAAA,GAAAC,OAAA,CAAAN,OAAA,GAEcP,gBAAgB","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/screen-background.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { __experimentalText as Text } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BackgroundPanel from './background-panel';\nimport ScreenHeader from './header';\nimport { unlock } from '../../lock-unlock';\n\nconst { useHasBackgroundPanel, useGlobalSetting } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction ScreenBackground() {\n\tconst [ settings ] = useGlobalSetting( '' );\n\tconst hasBackgroundPanel = useHasBackgroundPanel( settings );\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Background' ) }\n\t\t\t\tdescription={\n\t\t\t\t\t<Text>\n\t\t\t\t\t\t{ __( 'Set styles for the site\u2019s background.' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ hasBackgroundPanel && <BackgroundPanel /> }\n\t\t</>\n\t);\n}\n\nexport default ScreenBackground;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBE;AAnBF,kBAAmB;AACnB,0BAAsD;AACtD,wBAA2C;AAK3C,8BAA4B;AAC5B,oBAAyB;AACzB,yBAAuB;AAEvB,MAAM,EAAE,uBAAuB,iBAAiB,QAAI;AAAA,EACnD,oBAAAA;AACD;AAEA,SAAS,mBAAmB;AAC3B,QAAM,CAAE,QAAS,IAAI,iBAAkB,EAAG;AAC1C,QAAM,qBAAqB,sBAAuB,QAAS;AAC3D,SACC,4EACC;AAAA;AAAA,MAAC,cAAAC;AAAA,MAAA;AAAA,QACA,WAAQ,gBAAI,YAAa;AAAA,QACzB,aACC,4CAAC,kBAAAC,oBAAA,EACE,8BAAI,4CAAwC,GAC/C;AAAA;AAAA,IAEF;AAAA,IACE,sBAAsB,4CAAC,wBAAAC,SAAA,EAAgB;AAAA,KAC1C;AAEF;AAEA,IAAO,4BAAQ;",
+  "names": ["blockEditorPrivateApis", "ScreenHeader", "Text", "BackgroundPanel"]
+}