@wordpress/editor 14.33.3 → 14.34.0

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

@@ -0,0 +1,41 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  __experimentalHStack as HStack,
+  __experimentalVStack as VStack,
+  __experimentalSpacer as Spacer,
+  __experimentalHeading as Heading,
+  __experimentalView as View,
+  Navigator
+} from "@wordpress/components";
+import { isRTL, __ } from "@wordpress/i18n";
+import { chevronRight, chevronLeft } from "@wordpress/icons";
+function ScreenHeader({ title, description, onBack }) {
+  return /* @__PURE__ */ jsxs(VStack, { spacing: 0, children: [
+    /* @__PURE__ */ jsx(View, { children: /* @__PURE__ */ jsx(Spacer, { marginBottom: 0, paddingX: 4, paddingY: 3, children: /* @__PURE__ */ jsxs(HStack, { spacing: 2, children: [
+      /* @__PURE__ */ jsx(
+        Navigator.BackButton,
+        {
+          icon: isRTL() ? chevronRight : chevronLeft,
+          size: "small",
+          label: __("Back"),
+          onClick: onBack
+        }
+      ),
+      /* @__PURE__ */ jsx(Spacer, { children: /* @__PURE__ */ jsx(
+        Heading,
+        {
+          className: "editor-global-styles-header",
+          level: 2,
+          size: 13,
+          children: title
+        }
+      ) })
+    ] }) }) }),
+    description && /* @__PURE__ */ jsx("p", { className: "editor-global-styles-header__description", children: description })
+  ] });
+}
+var header_default = ScreenHeader;
+export {
+  header_default as default
+};
+//# sourceMappingURL=header.js.map

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

@@ -0,0 +1,7 @@
+{
+  "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=\"editor-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=\"editor-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": "AAmBK,SACC,KADD;AAhBL;AAAA,EACC,wBAAwB;AAAA,EACxB,wBAAwB;AAAA,EACxB,wBAAwB;AAAA,EACxB,yBAAyB;AAAA,EACzB,sBAAsB;AAAA,EACtB;AAAA,OACM;AACP,SAAS,OAAO,UAAU;AAC1B,SAAS,cAAc,mBAAmB;AAE1C,SAAS,aAAc,EAAE,OAAO,aAAa,OAAO,GAAI;AACvD,SACC,qBAAC,UAAO,SAAU,GACjB;AAAA,wBAAC,QACA,8BAAC,UAAO,cAAe,GAAI,UAAW,GAAI,UAAW,GACpD,+BAAC,UAAO,SAAU,GACjB;AAAA;AAAA,QAAC,UAAU;AAAA,QAAV;AAAA,UACA,MAAO,MAAM,IAAI,eAAe;AAAA,UAChC,MAAK;AAAA,UACL,OAAQ,GAAI,MAAO;AAAA,UACnB,SAAU;AAAA;AAAA,MACX;AAAA,MACA,oBAAC,UACA;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,OAAQ;AAAA,UACR,MAAO;AAAA,UAEL;AAAA;AAAA,MACH,GACD;AAAA,OACD,GACD,GACD;AAAA,IACE,eACD,oBAAC,OAAE,WAAU,4CACV,uBACH;AAAA,KAEF;AAEF;AAEA,IAAO,iBAAQ;",
+  "names": []
+}

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

@@ -0,0 +1,154 @@
+import { useMemo, useCallback } from "@wordpress/element";
+import {
+  mergeGlobalStyles,
+  getStyle,
+  getSetting
+} from "@wordpress/global-styles-engine";
+import { store as coreStore } from "@wordpress/core-data";
+import { useSelect, useDispatch } from "@wordpress/data";
+import { privateApis as blockEditorPrivateApis } from "@wordpress/block-editor";
+import { unlock } from "../../lock-unlock";
+const { cleanEmptyObject } = unlock(blockEditorPrivateApis);
+function useGlobalStylesUserConfig() {
+  const { globalStylesId, isReady, settings, styles, _links } = useSelect(
+    (select) => {
+      const {
+        getEntityRecord,
+        getEditedEntityRecord: getEditedEntityRecord2,
+        hasFinishedResolution,
+        canUser
+      } = select(coreStore);
+      const _globalStylesId = select(coreStore).__experimentalGetCurrentGlobalStylesId();
+      let record;
+      const userCanEditGlobalStyles = _globalStylesId ? canUser("update", {
+        kind: "root",
+        name: "globalStyles",
+        id: _globalStylesId
+      }) : null;
+      if (_globalStylesId && typeof userCanEditGlobalStyles === "boolean") {
+        if (userCanEditGlobalStyles) {
+          record = getEditedEntityRecord2(
+            "root",
+            "globalStyles",
+            _globalStylesId
+          );
+        } else {
+          record = getEntityRecord(
+            "root",
+            "globalStyles",
+            _globalStylesId,
+            { context: "view" }
+          );
+        }
+      }
+      let hasResolved = false;
+      if (hasFinishedResolution(
+        "__experimentalGetCurrentGlobalStylesId"
+      )) {
+        if (_globalStylesId) {
+          hasResolved = userCanEditGlobalStyles ? hasFinishedResolution("getEditedEntityRecord", [
+            "root",
+            "globalStyles",
+            _globalStylesId
+          ]) : hasFinishedResolution("getEntityRecord", [
+            "root",
+            "globalStyles",
+            _globalStylesId,
+            { context: "view" }
+          ]);
+        } else {
+          hasResolved = true;
+        }
+      }
+      return {
+        globalStylesId: _globalStylesId,
+        isReady: hasResolved,
+        settings: record?.settings,
+        styles: record?.styles,
+        _links: record?._links
+      };
+    },
+    []
+  );
+  const { getEditedEntityRecord } = useSelect(coreStore);
+  const { editEntityRecord } = useDispatch(coreStore);
+  const config = useMemo(() => {
+    return {
+      settings: settings ?? {},
+      styles: styles ?? {},
+      _links: _links ?? {}
+    };
+  }, [settings, styles, _links]);
+  const setConfig = useCallback(
+    (callbackOrObject, options = {}) => {
+      const record = getEditedEntityRecord(
+        "root",
+        "globalStyles",
+        globalStylesId
+      );
+      const currentConfig = {
+        styles: record?.styles ?? {},
+        settings: record?.settings ?? {},
+        _links: record?._links ?? {}
+      };
+      const updatedConfig = typeof callbackOrObject === "function" ? callbackOrObject(currentConfig) : callbackOrObject;
+      editEntityRecord(
+        "root",
+        "globalStyles",
+        globalStylesId,
+        {
+          styles: cleanEmptyObject(updatedConfig.styles) || {},
+          settings: cleanEmptyObject(updatedConfig.settings) || {},
+          _links: cleanEmptyObject(updatedConfig._links) || {}
+        },
+        options
+      );
+    },
+    [globalStylesId, editEntityRecord, getEditedEntityRecord]
+  );
+  return [isReady, config, setConfig];
+}
+function useGlobalStylesBaseConfig() {
+  const baseConfig = useSelect(
+    (select) => select(coreStore).__experimentalGetCurrentThemeBaseGlobalStyles(),
+    []
+  );
+  return [!!baseConfig, baseConfig];
+}
+function useGlobalStyles() {
+  const [isUserConfigReady, userConfig, setUserConfig] = useGlobalStylesUserConfig();
+  const [isBaseConfigReady, baseConfig] = useGlobalStylesBaseConfig();
+  const merged = useMemo(() => {
+    if (!isUserConfigReady || !isBaseConfigReady) {
+      return {};
+    }
+    return mergeGlobalStyles(baseConfig || {}, userConfig);
+  }, [isUserConfigReady, isBaseConfigReady, baseConfig, userConfig]);
+  return {
+    merged,
+    base: baseConfig || {},
+    user: userConfig,
+    setUser: setUserConfig,
+    isReady: isUserConfigReady && isBaseConfigReady
+  };
+}
+function useStyle(path, blockName) {
+  const { merged } = useGlobalStyles();
+  return useMemo(
+    () => getStyle(merged, path, blockName),
+    [merged, path, blockName]
+  );
+}
+function useSetting(path, blockName) {
+  const { merged } = useGlobalStyles();
+  return useMemo(
+    () => getSetting(merged, path, blockName),
+    [merged, path, blockName]
+  );
+}
+export {
+  useGlobalStyles,
+  useSetting,
+  useStyle
+};
+//# sourceMappingURL=hooks.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/hooks.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo, useCallback } from '@wordpress/element';\nimport {\n\tmergeGlobalStyles,\n\tgetStyle,\n\tgetSetting,\n} from '@wordpress/global-styles-engine';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { cleanEmptyObject } = unlock( blockEditorPrivateApis );\n\n/**\n * Hook to fetch and manage user global styles config\n */\nfunction useGlobalStylesUserConfig() {\n\tconst { globalStylesId, isReady, settings, styles, _links } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetEntityRecord,\n\t\t\t\tgetEditedEntityRecord,\n\t\t\t\thasFinishedResolution,\n\t\t\t\tcanUser,\n\t\t\t} = select( coreStore );\n\t\t\tconst _globalStylesId =\n\t\t\t\tselect( coreStore ).__experimentalGetCurrentGlobalStylesId();\n\n\t\t\tlet record;\n\n\t\t\tconst userCanEditGlobalStyles = _globalStylesId\n\t\t\t\t? canUser( 'update', {\n\t\t\t\t\t\tkind: 'root',\n\t\t\t\t\t\tname: 'globalStyles',\n\t\t\t\t\t\tid: _globalStylesId,\n\t\t\t\t  } )\n\t\t\t\t: null;\n\n\t\t\tif (\n\t\t\t\t_globalStylesId &&\n\t\t\t\ttypeof userCanEditGlobalStyles === 'boolean'\n\t\t\t) {\n\t\t\t\tif ( userCanEditGlobalStyles ) {\n\t\t\t\t\trecord = getEditedEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\trecord = getEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t{ context: 'view' }\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tlet hasResolved = false;\n\t\t\tif (\n\t\t\t\thasFinishedResolution(\n\t\t\t\t\t'__experimentalGetCurrentGlobalStylesId'\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tif ( _globalStylesId ) {\n\t\t\t\t\thasResolved = userCanEditGlobalStyles\n\t\t\t\t\t\t? hasFinishedResolution( 'getEditedEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t  ] )\n\t\t\t\t\t\t: hasFinishedResolution( 'getEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t\t\t{ context: 'view' },\n\t\t\t\t\t\t  ] );\n\t\t\t\t} else {\n\t\t\t\t\thasResolved = true;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tglobalStylesId: _globalStylesId,\n\t\t\t\tisReady: hasResolved,\n\t\t\t\tsettings: record?.settings,\n\t\t\t\tstyles: record?.styles,\n\t\t\t\t_links: record?._links,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst { getEditedEntityRecord } = useSelect( coreStore );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\n\tconst config = useMemo( () => {\n\t\treturn {\n\t\t\tsettings: settings ?? {},\n\t\t\tstyles: styles ?? {},\n\t\t\t_links: _links ?? {},\n\t\t};\n\t}, [ settings, styles, _links ] );\n\n\tconst setConfig = useCallback(\n\t\t( callbackOrObject, options = {} ) => {\n\t\t\tconst record = getEditedEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId\n\t\t\t);\n\n\t\t\tconst currentConfig = {\n\t\t\t\tstyles: record?.styles ?? {},\n\t\t\t\tsettings: record?.settings ?? {},\n\t\t\t\t_links: record?._links ?? {},\n\t\t\t};\n\n\t\t\tconst updatedConfig =\n\t\t\t\ttypeof callbackOrObject === 'function'\n\t\t\t\t\t? callbackOrObject( currentConfig )\n\t\t\t\t\t: callbackOrObject;\n\n\t\t\teditEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId,\n\t\t\t\t{\n\t\t\t\t\tstyles: cleanEmptyObject( updatedConfig.styles ) || {},\n\t\t\t\t\tsettings: cleanEmptyObject( updatedConfig.settings ) || {},\n\t\t\t\t\t_links: cleanEmptyObject( updatedConfig._links ) || {},\n\t\t\t\t},\n\t\t\t\toptions\n\t\t\t);\n\t\t},\n\t\t[ globalStylesId, editEntityRecord, getEditedEntityRecord ]\n\t);\n\n\treturn [ isReady, config, setConfig ];\n}\n\n/**\n * Hook to fetch base/theme global styles config\n */\nfunction useGlobalStylesBaseConfig() {\n\tconst baseConfig = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).__experimentalGetCurrentThemeBaseGlobalStyles(),\n\t\t[]\n\t);\n\treturn [ !! baseConfig, baseConfig ];\n}\n\n/**\n * Hook to get merged global styles configuration\n *\n * @return {Object} Object containing merged, base, user configs and setUser function\n *                  { merged, base, user, setUser }\n */\nexport function useGlobalStyles() {\n\tconst [ isUserConfigReady, userConfig, setUserConfig ] =\n\t\tuseGlobalStylesUserConfig();\n\tconst [ isBaseConfigReady, baseConfig ] = useGlobalStylesBaseConfig();\n\n\tconst merged = useMemo( () => {\n\t\tif ( ! isUserConfigReady || ! isBaseConfigReady ) {\n\t\t\treturn {};\n\t\t}\n\t\treturn mergeGlobalStyles( baseConfig || {}, userConfig );\n\t}, [ isUserConfigReady, isBaseConfigReady, baseConfig, userConfig ] );\n\n\treturn {\n\t\tmerged,\n\t\tbase: baseConfig || {},\n\t\tuser: userConfig,\n\t\tsetUser: setUserConfig,\n\t\tisReady: isUserConfigReady && isBaseConfigReady,\n\t};\n}\n\n/**\n * Hook to get a style value from global styles\n *\n * @param {string} path      Style path (e.g., 'color.background')\n * @param {string} blockName Optional block name\n * @return {*} Style value\n */\nexport function useStyle( path, blockName ) {\n\tconst { merged } = useGlobalStyles();\n\treturn useMemo(\n\t\t() => getStyle( merged, path, blockName ),\n\t\t[ merged, path, blockName ]\n\t);\n}\n\n/**\n * Hook to get a setting value from global styles\n *\n * @param {string} path      Setting path (e.g., 'spacing.blockGap')\n * @param {string} blockName Optional block name\n * @return {*} Setting value\n */\nexport function useSetting( path, blockName ) {\n\tconst { merged } = useGlobalStyles();\n\treturn useMemo(\n\t\t() => getSetting( merged, path, blockName ),\n\t\t[ merged, path, blockName ]\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["getEditedEntityRecord"]
+}

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

@@ -0,0 +1,112 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { store as coreStore } from "@wordpress/core-data";
+import { useSelect } from "@wordpress/data";
+import { useMemo } from "@wordpress/element";
+import { GlobalStylesUI } from "@wordpress/global-styles-ui";
+import { uploadMedia } from "@wordpress/media-utils";
+import { store as editorStore } from "../../store";
+import { GlobalStylesBlockLink } from "./block-link";
+import { useGlobalStyles } from "./hooks";
+function useServerData() {
+  const {
+    styles,
+    __unstableResolvedAssets,
+    colors,
+    gradients,
+    __experimentalDiscussionSettings,
+    mediaUploadHandler,
+    fontLibraryEnabled
+  } = useSelect((select) => {
+    const { getEditorSettings } = select(editorStore);
+    const { canUser } = select(coreStore);
+    const editorSettings = getEditorSettings();
+    const canUserUploadMedia = canUser("create", {
+      kind: "root",
+      name: "media"
+    });
+    return {
+      styles: editorSettings?.styles || [],
+      __unstableResolvedAssets: editorSettings?.__unstableResolvedAssets || {},
+      colors: editorSettings?.colors || [],
+      gradients: editorSettings?.gradients || [],
+      __experimentalDiscussionSettings: editorSettings?.__experimentalDiscussionSettings,
+      mediaUploadHandler: canUserUploadMedia ? uploadMedia : void 0,
+      fontLibraryEnabled: editorSettings?.fontLibraryEnabled ?? true
+    };
+  }, []);
+  const serverCSS = useMemo(() => {
+    if (!styles) {
+      return [];
+    }
+    return styles.filter((style) => !style.isGlobalStyles);
+  }, [styles]);
+  const serverSettings = useMemo(() => {
+    return {
+      __unstableResolvedAssets,
+      settings: {
+        color: {
+          palette: {
+            theme: colors
+          },
+          gradients: {
+            theme: gradients
+          },
+          duotone: {
+            theme: []
+          }
+        }
+      },
+      __experimentalDiscussionSettings,
+      mediaUpload: mediaUploadHandler
+    };
+  }, [
+    __unstableResolvedAssets,
+    colors,
+    gradients,
+    __experimentalDiscussionSettings,
+    mediaUploadHandler
+  ]);
+  return { serverCSS, serverSettings, fontLibraryEnabled };
+}
+function GlobalStylesUIWrapper({ path, onPathChange }) {
+  const {
+    user: userConfig,
+    base: baseConfig,
+    setUser: setUserConfig,
+    isReady
+  } = useGlobalStyles();
+  const { serverCSS, serverSettings, fontLibraryEnabled } = useServerData();
+  if (!isReady) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      GlobalStylesUI,
+      {
+        value: userConfig,
+        baseValue: baseConfig || {},
+        onChange: setUserConfig,
+        path,
+        onPathChange,
+        fontLibraryEnabled,
+        serverCSS,
+        serverSettings
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      GlobalStylesBlockLink,
+      {
+        path,
+        onPathChange
+      }
+    )
+  ] });
+}
+import { useGlobalStyles as useGlobalStyles2, useStyle, useSetting } from "./hooks";
+export {
+  GlobalStylesUIWrapper as default,
+  useGlobalStyles2 as useGlobalStyles,
+  useSetting,
+  useStyle
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/index.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { useMemo } from '@wordpress/element';\nimport { GlobalStylesUI } from '@wordpress/global-styles-ui';\nimport { uploadMedia } from '@wordpress/media-utils';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { GlobalStylesBlockLink } from './block-link';\nimport { useGlobalStyles } from './hooks';\n\n/**\n * Hook to fetch server CSS and settings for BlockEditorProvider that are not Global Styles.\n */\nfunction useServerData() {\n\tconst {\n\t\tstyles,\n\t\t__unstableResolvedAssets,\n\t\tcolors,\n\t\tgradients,\n\t\t__experimentalDiscussionSettings,\n\t\tmediaUploadHandler,\n\t\tfontLibraryEnabled,\n\t} = useSelect( ( select ) => {\n\t\tconst { getEditorSettings } = select( editorStore );\n\t\tconst { canUser } = select( coreStore );\n\t\tconst editorSettings = getEditorSettings();\n\n\t\tconst canUserUploadMedia = canUser( 'create', {\n\t\t\tkind: 'root',\n\t\t\tname: 'media',\n\t\t} );\n\n\t\treturn {\n\t\t\tstyles: editorSettings?.styles || [],\n\t\t\t__unstableResolvedAssets:\n\t\t\t\teditorSettings?.__unstableResolvedAssets || {},\n\t\t\tcolors: editorSettings?.colors || [],\n\t\t\tgradients: editorSettings?.gradients || [],\n\t\t\t__experimentalDiscussionSettings:\n\t\t\t\teditorSettings?.__experimentalDiscussionSettings,\n\t\t\tmediaUploadHandler: canUserUploadMedia ? uploadMedia : undefined,\n\t\t\tfontLibraryEnabled: editorSettings?.fontLibraryEnabled ?? true,\n\t\t};\n\t}, [] );\n\n\t// Filter out global styles to get only server-provided styles\n\tconst serverCSS = useMemo( () => {\n\t\tif ( ! styles ) {\n\t\t\treturn [];\n\t\t}\n\t\treturn styles.filter( ( style ) => ! style.isGlobalStyles );\n\t}, [ styles ] );\n\n\t// Create server settings object\n\tconst serverSettings = useMemo( () => {\n\t\treturn {\n\t\t\t__unstableResolvedAssets,\n\t\t\tsettings: {\n\t\t\t\tcolor: {\n\t\t\t\t\tpalette: {\n\t\t\t\t\t\ttheme: colors,\n\t\t\t\t\t},\n\t\t\t\t\tgradients: {\n\t\t\t\t\t\ttheme: gradients,\n\t\t\t\t\t},\n\t\t\t\t\tduotone: {\n\t\t\t\t\t\ttheme: [],\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t\t__experimentalDiscussionSettings,\n\t\t\tmediaUpload: mediaUploadHandler,\n\t\t};\n\t}, [\n\t\t__unstableResolvedAssets,\n\t\tcolors,\n\t\tgradients,\n\t\t__experimentalDiscussionSettings,\n\t\tmediaUploadHandler,\n\t] );\n\n\treturn { serverCSS, serverSettings, fontLibraryEnabled };\n}\n\nexport default function GlobalStylesUIWrapper( { path, onPathChange } ) {\n\tconst {\n\t\tuser: userConfig,\n\t\tbase: baseConfig,\n\t\tsetUser: setUserConfig,\n\t\tisReady,\n\t} = useGlobalStyles();\n\tconst { serverCSS, serverSettings, fontLibraryEnabled } = useServerData();\n\n\t// Show loading state while data is being fetched\n\tif ( ! isReady ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<GlobalStylesUI\n\t\t\t\tvalue={ userConfig }\n\t\t\t\tbaseValue={ baseConfig || {} }\n\t\t\t\tonChange={ setUserConfig }\n\t\t\t\tpath={ path }\n\t\t\t\tonPathChange={ onPathChange }\n\t\t\t\tfontLibraryEnabled={ fontLibraryEnabled }\n\t\t\t\tserverCSS={ serverCSS }\n\t\t\t\tserverSettings={ serverSettings }\n\t\t\t/>\n\t\t\t<GlobalStylesBlockLink\n\t\t\t\tpath={ path }\n\t\t\t\tonPathChange={ onPathChange }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport { useGlobalStyles, useStyle, useSetting } from './hooks';\n"],
+  "mappings": "AAyGE,mBACC,KADD;AAtGF,SAAS,SAAS,iBAAiB;AACnC,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AACxB,SAAS,sBAAsB;AAC/B,SAAS,mBAAmB;AAK5B,SAAS,SAAS,mBAAmB;AACrC,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAKhC,SAAS,gBAAgB;AACxB,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI,UAAW,CAAE,WAAY;AAC5B,UAAM,EAAE,kBAAkB,IAAI,OAAQ,WAAY;AAClD,UAAM,EAAE,QAAQ,IAAI,OAAQ,SAAU;AACtC,UAAM,iBAAiB,kBAAkB;AAEzC,UAAM,qBAAqB,QAAS,UAAU;AAAA,MAC7C,MAAM;AAAA,MACN,MAAM;AAAA,IACP,CAAE;AAEF,WAAO;AAAA,MACN,QAAQ,gBAAgB,UAAU,CAAC;AAAA,MACnC,0BACC,gBAAgB,4BAA4B,CAAC;AAAA,MAC9C,QAAQ,gBAAgB,UAAU,CAAC;AAAA,MACnC,WAAW,gBAAgB,aAAa,CAAC;AAAA,MACzC,kCACC,gBAAgB;AAAA,MACjB,oBAAoB,qBAAqB,cAAc;AAAA,MACvD,oBAAoB,gBAAgB,sBAAsB;AAAA,IAC3D;AAAA,EACD,GAAG,CAAC,CAAE;AAGN,QAAM,YAAY,QAAS,MAAM;AAChC,QAAK,CAAE,QAAS;AACf,aAAO,CAAC;AAAA,IACT;AACA,WAAO,OAAO,OAAQ,CAAE,UAAW,CAAE,MAAM,cAAe;AAAA,EAC3D,GAAG,CAAE,MAAO,CAAE;AAGd,QAAM,iBAAiB,QAAS,MAAM;AACrC,WAAO;AAAA,MACN;AAAA,MACA,UAAU;AAAA,QACT,OAAO;AAAA,UACN,SAAS;AAAA,YACR,OAAO;AAAA,UACR;AAAA,UACA,WAAW;AAAA,YACV,OAAO;AAAA,UACR;AAAA,UACA,SAAS;AAAA,YACR,OAAO,CAAC;AAAA,UACT;AAAA,QACD;AAAA,MACD;AAAA,MACA;AAAA,MACA,aAAa;AAAA,IACd;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,SAAO,EAAE,WAAW,gBAAgB,mBAAmB;AACxD;AAEe,SAAR,sBAAwC,EAAE,MAAM,aAAa,GAAI;AACvE,QAAM;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA,IACT;AAAA,EACD,IAAI,gBAAgB;AACpB,QAAM,EAAE,WAAW,gBAAgB,mBAAmB,IAAI,cAAc;AAGxE,MAAK,CAAE,SAAU;AAChB,WAAO;AAAA,EACR;AAEA,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ;AAAA,QACR,WAAY,cAAc,CAAC;AAAA,QAC3B,UAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,KACD;AAEF;AAEA,SAAS,mBAAAA,kBAAiB,UAAU,kBAAkB;",
+  "names": ["useGlobalStyles"]
+}

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

@@ -0,0 +1,71 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { DropdownMenu, MenuGroup, MenuItem } from "@wordpress/components";
+import { useSelect, useDispatch } from "@wordpress/data";
+import { __ } from "@wordpress/i18n";
+import { store as preferencesStore } from "@wordpress/preferences";
+import { moreVertical } from "@wordpress/icons";
+import { store as coreStore } from "@wordpress/core-data";
+import { useGlobalStyles } from "./hooks";
+function GlobalStylesActionMenu({
+  hideWelcomeGuide = false,
+  onChangePath
+}) {
+  const { user, setUser } = useGlobalStyles();
+  const canReset = !!user && (Object.keys(user?.styles ?? {}).length > 0 || Object.keys(user?.settings ?? {}).length > 0);
+  const onReset = () => {
+    setUser({ styles: {}, settings: {} });
+  };
+  const { toggle } = useDispatch(preferencesStore);
+  const { canEditCSS } = useSelect((select) => {
+    const { getEntityRecord, __experimentalGetCurrentGlobalStylesId } = select(coreStore);
+    const globalStylesId = __experimentalGetCurrentGlobalStylesId();
+    const globalStyles = globalStylesId ? getEntityRecord("root", "globalStyles", globalStylesId) : void 0;
+    return {
+      canEditCSS: !!globalStyles?._links?.["wp:action-edit-css"]
+    };
+  }, []);
+  const loadCustomCSS = () => {
+    onChangePath("/css");
+  };
+  return /* @__PURE__ */ jsx(
+    DropdownMenu,
+    {
+      icon: moreVertical,
+      label: __("More"),
+      toggleProps: { size: "compact" },
+      children: ({ onClose }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(MenuGroup, { children: [
+          canEditCSS && /* @__PURE__ */ jsx(MenuItem, { onClick: loadCustomCSS, children: __("Additional CSS") }),
+          !hideWelcomeGuide && /* @__PURE__ */ jsx(
+            MenuItem,
+            {
+              onClick: () => {
+                toggle(
+                  "core/edit-site",
+                  "welcomeGuideStyles"
+                );
+                onClose();
+              },
+              children: __("Welcome Guide")
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(MenuGroup, { children: /* @__PURE__ */ jsx(
+          MenuItem,
+          {
+            onClick: () => {
+              onReset();
+              onClose();
+            },
+            disabled: !canReset,
+            children: __("Reset styles")
+          }
+        ) })
+      ] })
+    }
+  );
+}
+export {
+  GlobalStylesActionMenu
+};
+//# sourceMappingURL=menu.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/menu.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { moreVertical } from '@wordpress/icons';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { useGlobalStyles } from './hooks';\n\n/**\n * Action menu with Reset, Welcome Guide, and Additional CSS.\n *\n * @param {Object}   props                  Component props.\n * @param {boolean}  props.hideWelcomeGuide Whether to hide the Welcome Guide option.\n * @param {Function} props.onChangePath     Callback for navigation to different paths (e.g., '/css').\n * @return {JSX.Element} The Global Styles Action Menu component.\n */\nexport function GlobalStylesActionMenu( {\n\thideWelcomeGuide = false,\n\tonChangePath,\n} ) {\n\tconst { user, setUser } = useGlobalStyles();\n\n\t// Check if there are user customizations that can be reset\n\tconst canReset =\n\t\t!! user &&\n\t\t( Object.keys( user?.styles ?? {} ).length > 0 ||\n\t\t\tObject.keys( user?.settings ?? {} ).length > 0 );\n\n\t// Reset function to clear all user customizations\n\tconst onReset = () => {\n\t\tsetUser( { styles: {}, settings: {} } );\n\t};\n\tconst { toggle } = useDispatch( preferencesStore );\n\tconst { canEditCSS } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord, __experimentalGetCurrentGlobalStylesId } =\n\t\t\tselect( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\tcanEditCSS: !! globalStyles?._links?.[ 'wp:action-edit-css' ],\n\t\t};\n\t}, [] );\n\tconst loadCustomCSS = () => {\n\t\tonChangePath( '/css' );\n\t};\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ticon={ moreVertical }\n\t\t\tlabel={ __( 'More' ) }\n\t\t\ttoggleProps={ { size: 'compact' } }\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t{ canEditCSS && (\n\t\t\t\t\t\t\t<MenuItem onClick={ loadCustomCSS }>\n\t\t\t\t\t\t\t\t{ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ! hideWelcomeGuide && (\n\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\ttoggle(\n\t\t\t\t\t\t\t\t\t\t'core/edit-site',\n\t\t\t\t\t\t\t\t\t\t'welcomeGuideStyles'\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Welcome Guide' ) }\n\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tdisabled={ ! canReset }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Reset styles' ) }\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t</MenuGroup>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n"],
+  "mappings": "AAgEI,mBAGG,KAFF,YADD;AA7DJ,SAAS,cAAc,WAAW,gBAAgB;AAClD,SAAS,WAAW,mBAAmB;AACvC,SAAS,UAAU;AACnB,SAAS,SAAS,wBAAwB;AAC1C,SAAS,oBAAoB;AAC7B,SAAS,SAAS,iBAAiB;AAKnC,SAAS,uBAAuB;AAUzB,SAAS,uBAAwB;AAAA,EACvC,mBAAmB;AAAA,EACnB;AACD,GAAI;AACH,QAAM,EAAE,MAAM,QAAQ,IAAI,gBAAgB;AAG1C,QAAM,WACL,CAAC,CAAE,SACD,OAAO,KAAM,MAAM,UAAU,CAAC,CAAE,EAAE,SAAS,KAC5C,OAAO,KAAM,MAAM,YAAY,CAAC,CAAE,EAAE,SAAS;AAG/C,QAAM,UAAU,MAAM;AACrB,YAAS,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,EAAE,CAAE;AAAA,EACvC;AACA,QAAM,EAAE,OAAO,IAAI,YAAa,gBAAiB;AACjD,QAAM,EAAE,WAAW,IAAI,UAAW,CAAE,WAAY;AAC/C,UAAM,EAAE,iBAAiB,uCAAuC,IAC/D,OAAQ,SAAU;AAEnB,UAAM,iBAAiB,uCAAuC;AAC9D,UAAM,eAAe,iBAClB,gBAAiB,QAAQ,gBAAgB,cAAe,IACxD;AAEH,WAAO;AAAA,MACN,YAAY,CAAC,CAAE,cAAc,SAAU,oBAAqB;AAAA,IAC7D;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,gBAAgB,MAAM;AAC3B,iBAAc,MAAO;AAAA,EACtB;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,MAAO;AAAA,MACP,OAAQ,GAAI,MAAO;AAAA,MACnB,aAAc,EAAE,MAAM,UAAU;AAAA,MAE9B,WAAE,EAAE,QAAQ,MACb,iCACC;AAAA,6BAAC,aACE;AAAA,wBACD,oBAAC,YAAS,SAAU,eACjB,aAAI,gBAAiB,GACxB;AAAA,UAEC,CAAE,oBACH;AAAA,YAAC;AAAA;AAAA,cACA,SAAU,MAAM;AACf;AAAA,kBACC;AAAA,kBACA;AAAA,gBACD;AACA,wBAAQ;AAAA,cACT;AAAA,cAEE,aAAI,eAAgB;AAAA;AAAA,UACvB;AAAA,WAEF;AAAA,QACA,oBAAC,aACA;AAAA,UAAC;AAAA;AAAA,YACA,SAAU,MAAM;AACf,sBAAQ;AACR,sBAAQ;AAAA,YACT;AAAA,YACA,UAAW,CAAE;AAAA,YAEX,aAAI,cAAe;AAAA;AAAA,QACtB,GACD;AAAA,SACD;AAAA;AAAA,EAEF;AAEF;",
+  "names": []
+}

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

@@ -1,35 +1,10 @@
-import { jsx } from "react/jsx-runtime";
-import deepmerge from "deepmerge";
-import { isPlainObject } from "is-plain-object";
 import { privateApis as blockEditorPrivateApis } from "@wordpress/block-editor";
 import { store as coreStore } from "@wordpress/core-data";
 import { useSelect, useDispatch } from "@wordpress/data";
 import { useMemo, useCallback } from "@wordpress/element";
+import { mergeGlobalStyles } from "@wordpress/global-styles-engine";
 import { unlock } from "../../lock-unlock";
-const { GlobalStylesContext, cleanEmptyObject } = unlock(
-  blockEditorPrivateApis
-);
-function mergeBaseAndUserConfigs(base, user) {
-  return deepmerge(base, user, {
-    /*
-     * We only pass as arrays the presets,
-     * in which case we want the new array of values
-     * to override the old array (no merging).
-     */
-    isMergeableObject: isPlainObject,
-    /*
-     * Exceptions to the above rule.
-     * Background images should be replaced, not merged,
-     * as they themselves are specific object definitions for the style.
-     */
-    customMerge: (key) => {
-      if (key === "backgroundImage") {
-        return (baseConfig, userConfig) => userConfig;
-      }
-      return void 0;
-    }
-  });
-}
+const { cleanEmptyObject } = unlock(blockEditorPrivateApis);
 function useGlobalStylesUserConfig() {
   const { globalStylesId, isReady, settings, styles, _links } = useSelect(
     (select) => {
@@ -154,7 +129,7 @@ function useGlobalStylesContext() {
     if (!baseConfig || !userConfig) {
       return {};
     }
-    return mergeBaseAndUserConfigs(baseConfig, userConfig);
+    return mergeGlobalStyles(baseConfig, userConfig);
   }, [userConfig, baseConfig]);
   const context = useMemo(() => {
     return {
@@ -174,16 +149,7 @@ function useGlobalStylesContext() {
   ]);
   return context;
 }
-function GlobalStylesProvider({ children }) {
-  const context = useGlobalStylesContext();
-  if (!context.isReady) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(GlobalStylesContext.Provider, { value: context, children });
-}
 export {
-  GlobalStylesProvider,
-  mergeBaseAndUserConfigs,
   useGlobalStylesContext
 };
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/global-styles-provider/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport deepmerge from 'deepmerge';\nimport { isPlainObject } from 'is-plain-object';\n\n/**\n * WordPress dependencies\n */\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useMemo, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { GlobalStylesContext, cleanEmptyObject } = unlock(\n\tblockEditorPrivateApis\n);\n\nexport function mergeBaseAndUserConfigs( base, user ) {\n\treturn deepmerge( base, user, {\n\t\t/*\n\t\t * We only pass as arrays the presets,\n\t\t * in which case we want the new array of values\n\t\t * to override the old array (no merging).\n\t\t */\n\t\tisMergeableObject: isPlainObject,\n\t\t/*\n\t\t * Exceptions to the above rule.\n\t\t * Background images should be replaced, not merged,\n\t\t * as they themselves are specific object definitions for the style.\n\t\t */\n\t\tcustomMerge: ( key ) => {\n\t\t\tif ( key === 'backgroundImage' ) {\n\t\t\t\treturn ( baseConfig, userConfig ) => userConfig;\n\t\t\t}\n\t\t\treturn undefined;\n\t\t},\n\t} );\n}\n\nfunction useGlobalStylesUserConfig() {\n\tconst { globalStylesId, isReady, settings, styles, _links } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetEntityRecord,\n\t\t\t\tgetEditedEntityRecord,\n\t\t\t\thasFinishedResolution,\n\t\t\t\tcanUser,\n\t\t\t} = select( coreStore );\n\t\t\tconst _globalStylesId =\n\t\t\t\tselect( coreStore ).__experimentalGetCurrentGlobalStylesId();\n\n\t\t\tlet record;\n\n\t\t\t/*\n\t\t\t * Ensure that the global styles ID request is complete by testing `_globalStylesId`,\n\t\t\t * before firing off the `canUser` OPTIONS request for user capabilities, otherwise it will\n\t\t\t * fetch `/wp/v2/global-styles` instead of `/wp/v2/global-styles/{id}`.\n\t\t\t * NOTE: Please keep in sync any preload paths sent to `block_editor_rest_api_preload()`,\n\t\t\t * or set using the `block_editor_rest_api_preload_paths` filter, if this changes.\n\t\t\t */\n\t\t\tconst userCanEditGlobalStyles = _globalStylesId\n\t\t\t\t? canUser( 'update', {\n\t\t\t\t\t\tkind: 'root',\n\t\t\t\t\t\tname: 'globalStyles',\n\t\t\t\t\t\tid: _globalStylesId,\n\t\t\t\t  } )\n\t\t\t\t: null;\n\n\t\t\tif (\n\t\t\t\t_globalStylesId &&\n\t\t\t\t/*\n\t\t\t\t * Test that the OPTIONS request for user capabilities is complete\n\t\t\t\t * before fetching the global styles entity record.\n\t\t\t\t * This is to avoid fetching the global styles entity unnecessarily.\n\t\t\t\t */\n\t\t\t\ttypeof userCanEditGlobalStyles === 'boolean'\n\t\t\t) {\n\t\t\t\t/*\n\t\t\t\t * Fetch the global styles entity record based on the user's capabilities.\n\t\t\t\t * The default context is `edit` for users who can edit global styles.\n\t\t\t\t * Otherwise, the context is `view`.\n\t\t\t\t * NOTE: There is an equivalent conditional check using `current_user_can()` in the backend\n\t\t\t\t * to preload the global styles entity. Please keep in sync any preload paths sent to `block_editor_rest_api_preload()`,\n\t\t\t\t * or set using `block_editor_rest_api_preload_paths` filter, if this changes.\n\t\t\t\t */\n\t\t\t\tif ( userCanEditGlobalStyles ) {\n\t\t\t\t\trecord = getEditedEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\trecord = getEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t{ context: 'view' }\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tlet hasResolved = false;\n\t\t\tif (\n\t\t\t\thasFinishedResolution(\n\t\t\t\t\t'__experimentalGetCurrentGlobalStylesId'\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tif ( _globalStylesId ) {\n\t\t\t\t\thasResolved = userCanEditGlobalStyles\n\t\t\t\t\t\t? hasFinishedResolution( 'getEditedEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t  ] )\n\t\t\t\t\t\t: hasFinishedResolution( 'getEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t\t\t{ context: 'view' },\n\t\t\t\t\t\t  ] );\n\t\t\t\t} else {\n\t\t\t\t\thasResolved = true;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tglobalStylesId: _globalStylesId,\n\t\t\t\tisReady: hasResolved,\n\t\t\t\tsettings: record?.settings,\n\t\t\t\tstyles: record?.styles,\n\t\t\t\t_links: record?._links,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst { getEditedEntityRecord } = useSelect( coreStore );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\tconst config = useMemo( () => {\n\t\treturn {\n\t\t\tsettings: settings ?? {},\n\t\t\tstyles: styles ?? {},\n\t\t\t_links: _links ?? {},\n\t\t};\n\t}, [ settings, styles, _links ] );\n\n\tconst setConfig = useCallback(\n\t\t/**\n\t\t * Set the global styles config.\n\t\t * @param {Function|Object} callbackOrObject If the callbackOrObject is a function, pass the current config to the callback so the consumer can merge values.\n\t\t *                                           Otherwise, overwrite the current config with the incoming object.\n\t\t * @param {Object}          options          Options for editEntityRecord Core selector.\n\t\t */\n\t\t( callbackOrObject, options = {} ) => {\n\t\t\tconst record = getEditedEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId\n\t\t\t);\n\n\t\t\tconst currentConfig = {\n\t\t\t\tstyles: record?.styles ?? {},\n\t\t\t\tsettings: record?.settings ?? {},\n\t\t\t\t_links: record?._links ?? {},\n\t\t\t};\n\n\t\t\tconst updatedConfig =\n\t\t\t\ttypeof callbackOrObject === 'function'\n\t\t\t\t\t? callbackOrObject( currentConfig )\n\t\t\t\t\t: callbackOrObject;\n\n\t\t\teditEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId,\n\t\t\t\t{\n\t\t\t\t\tstyles: cleanEmptyObject( updatedConfig.styles ) || {},\n\t\t\t\t\tsettings: cleanEmptyObject( updatedConfig.settings ) || {},\n\t\t\t\t\t_links: cleanEmptyObject( updatedConfig._links ) || {},\n\t\t\t\t},\n\t\t\t\toptions\n\t\t\t);\n\t\t},\n\t\t[ globalStylesId, editEntityRecord, getEditedEntityRecord ]\n\t);\n\n\treturn [ isReady, config, setConfig ];\n}\n\nfunction useGlobalStylesBaseConfig() {\n\tconst baseConfig = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).__experimentalGetCurrentThemeBaseGlobalStyles(),\n\t\t[]\n\t);\n\treturn [ !! baseConfig, baseConfig ];\n}\n\nexport function useGlobalStylesContext() {\n\tconst [ isUserConfigReady, userConfig, setUserConfig ] =\n\t\tuseGlobalStylesUserConfig();\n\tconst [ isBaseConfigReady, baseConfig ] = useGlobalStylesBaseConfig();\n\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! baseConfig || ! userConfig ) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn mergeBaseAndUserConfigs( baseConfig, userConfig );\n\t}, [ userConfig, baseConfig ] );\n\n\tconst context = useMemo( () => {\n\t\treturn {\n\t\t\tisReady: isUserConfigReady && isBaseConfigReady,\n\t\t\tuser: userConfig,\n\t\t\tbase: baseConfig,\n\t\t\tmerged: mergedConfig,\n\t\t\tsetUserConfig,\n\t\t};\n\t}, [\n\t\tmergedConfig,\n\t\tuserConfig,\n\t\tbaseConfig,\n\t\tsetUserConfig,\n\t\tisUserConfigReady,\n\t\tisBaseConfigReady,\n\t] );\n\n\treturn context;\n}\n\nexport function GlobalStylesProvider( { children } ) {\n\tconst context = useGlobalStylesContext();\n\tif ( ! context.isReady ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<GlobalStylesContext.Provider value={ context }>\n\t\t\t{ children }\n\t\t</GlobalStylesContext.Provider>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useMemo, useCallback } from '@wordpress/element';\nimport { mergeGlobalStyles } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { cleanEmptyObject } = unlock( blockEditorPrivateApis );\n\nfunction useGlobalStylesUserConfig() {\n\tconst { globalStylesId, isReady, settings, styles, _links } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetEntityRecord,\n\t\t\t\tgetEditedEntityRecord,\n\t\t\t\thasFinishedResolution,\n\t\t\t\tcanUser,\n\t\t\t} = select( coreStore );\n\t\t\tconst _globalStylesId =\n\t\t\t\tselect( coreStore ).__experimentalGetCurrentGlobalStylesId();\n\n\t\t\tlet record;\n\n\t\t\t/*\n\t\t\t * Ensure that the global styles ID request is complete by testing `_globalStylesId`,\n\t\t\t * before firing off the `canUser` OPTIONS request for user capabilities, otherwise it will\n\t\t\t * fetch `/wp/v2/global-styles` instead of `/wp/v2/global-styles/{id}`.\n\t\t\t * NOTE: Please keep in sync any preload paths sent to `block_editor_rest_api_preload()`,\n\t\t\t * or set using the `block_editor_rest_api_preload_paths` filter, if this changes.\n\t\t\t */\n\t\t\tconst userCanEditGlobalStyles = _globalStylesId\n\t\t\t\t? canUser( 'update', {\n\t\t\t\t\t\tkind: 'root',\n\t\t\t\t\t\tname: 'globalStyles',\n\t\t\t\t\t\tid: _globalStylesId,\n\t\t\t\t  } )\n\t\t\t\t: null;\n\n\t\t\tif (\n\t\t\t\t_globalStylesId &&\n\t\t\t\t/*\n\t\t\t\t * Test that the OPTIONS request for user capabilities is complete\n\t\t\t\t * before fetching the global styles entity record.\n\t\t\t\t * This is to avoid fetching the global styles entity unnecessarily.\n\t\t\t\t */\n\t\t\t\ttypeof userCanEditGlobalStyles === 'boolean'\n\t\t\t) {\n\t\t\t\t/*\n\t\t\t\t * Fetch the global styles entity record based on the user's capabilities.\n\t\t\t\t * The default context is `edit` for users who can edit global styles.\n\t\t\t\t * Otherwise, the context is `view`.\n\t\t\t\t * NOTE: There is an equivalent conditional check using `current_user_can()` in the backend\n\t\t\t\t * to preload the global styles entity. Please keep in sync any preload paths sent to `block_editor_rest_api_preload()`,\n\t\t\t\t * or set using `block_editor_rest_api_preload_paths` filter, if this changes.\n\t\t\t\t */\n\t\t\t\tif ( userCanEditGlobalStyles ) {\n\t\t\t\t\trecord = getEditedEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\trecord = getEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t{ context: 'view' }\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tlet hasResolved = false;\n\t\t\tif (\n\t\t\t\thasFinishedResolution(\n\t\t\t\t\t'__experimentalGetCurrentGlobalStylesId'\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tif ( _globalStylesId ) {\n\t\t\t\t\thasResolved = userCanEditGlobalStyles\n\t\t\t\t\t\t? hasFinishedResolution( 'getEditedEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t  ] )\n\t\t\t\t\t\t: hasFinishedResolution( 'getEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t\t\t{ context: 'view' },\n\t\t\t\t\t\t  ] );\n\t\t\t\t} else {\n\t\t\t\t\thasResolved = true;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tglobalStylesId: _globalStylesId,\n\t\t\t\tisReady: hasResolved,\n\t\t\t\tsettings: record?.settings,\n\t\t\t\tstyles: record?.styles,\n\t\t\t\t_links: record?._links,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst { getEditedEntityRecord } = useSelect( coreStore );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\tconst config = useMemo( () => {\n\t\treturn {\n\t\t\tsettings: settings ?? {},\n\t\t\tstyles: styles ?? {},\n\t\t\t_links: _links ?? {},\n\t\t};\n\t}, [ settings, styles, _links ] );\n\n\tconst setConfig = useCallback(\n\t\t/**\n\t\t * Set the global styles config.\n\t\t * @param {Function|Object} callbackOrObject If the callbackOrObject is a function, pass the current config to the callback so the consumer can merge values.\n\t\t *                                           Otherwise, overwrite the current config with the incoming object.\n\t\t * @param {Object}          options          Options for editEntityRecord Core selector.\n\t\t */\n\t\t( callbackOrObject, options = {} ) => {\n\t\t\tconst record = getEditedEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId\n\t\t\t);\n\n\t\t\tconst currentConfig = {\n\t\t\t\tstyles: record?.styles ?? {},\n\t\t\t\tsettings: record?.settings ?? {},\n\t\t\t\t_links: record?._links ?? {},\n\t\t\t};\n\n\t\t\tconst updatedConfig =\n\t\t\t\ttypeof callbackOrObject === 'function'\n\t\t\t\t\t? callbackOrObject( currentConfig )\n\t\t\t\t\t: callbackOrObject;\n\n\t\t\teditEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId,\n\t\t\t\t{\n\t\t\t\t\tstyles: cleanEmptyObject( updatedConfig.styles ) || {},\n\t\t\t\t\tsettings: cleanEmptyObject( updatedConfig.settings ) || {},\n\t\t\t\t\t_links: cleanEmptyObject( updatedConfig._links ) || {},\n\t\t\t\t},\n\t\t\t\toptions\n\t\t\t);\n\t\t},\n\t\t[ globalStylesId, editEntityRecord, getEditedEntityRecord ]\n\t);\n\n\treturn [ isReady, config, setConfig ];\n}\n\nfunction useGlobalStylesBaseConfig() {\n\tconst baseConfig = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).__experimentalGetCurrentThemeBaseGlobalStyles(),\n\t\t[]\n\t);\n\treturn [ !! baseConfig, baseConfig ];\n}\n\nexport function useGlobalStylesContext() {\n\tconst [ isUserConfigReady, userConfig, setUserConfig ] =\n\t\tuseGlobalStylesUserConfig();\n\tconst [ isBaseConfigReady, baseConfig ] = useGlobalStylesBaseConfig();\n\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! baseConfig || ! userConfig ) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn mergeGlobalStyles( baseConfig, userConfig );\n\t}, [ userConfig, baseConfig ] );\n\n\tconst context = useMemo( () => {\n\t\treturn {\n\t\t\tisReady: isUserConfigReady && isBaseConfigReady,\n\t\t\tuser: userConfig,\n\t\t\tbase: baseConfig,\n\t\t\tmerged: mergedConfig,\n\t\t\tsetUserConfig,\n\t\t};\n\t}, [\n\t\tmergedConfig,\n\t\tuserConfig,\n\t\tbaseConfig,\n\t\tsetUserConfig,\n\t\tisUserConfigReady,\n\t\tisBaseConfigReady,\n\t] );\n\n\treturn context;\n}\n"],
+  "mappings": "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",
   "names": ["getEditedEntityRecord"]
 }

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

@@ -0,0 +1,31 @@
+import { useEffect } from "@wordpress/element";
+import { useSelect, useDispatch } from "@wordpress/data";
+import { store as editorStore } from "../../store";
+import { useGlobalStylesOutput } from "../../hooks/use-global-styles-output";
+function useGlobalStylesRenderer(disableRootPadding) {
+  const [styles, settings] = useGlobalStylesOutput(disableRootPadding);
+  const { getEditorSettings } = useSelect(editorStore);
+  const { updateEditorSettings } = useDispatch(editorStore);
+  useEffect(() => {
+    if (!styles || !settings) {
+      return;
+    }
+    const currentStoreSettings = getEditorSettings();
+    const nonGlobalStyles = Object.values(
+      currentStoreSettings.styles ?? []
+    ).filter((style) => !style.isGlobalStyles);
+    updateEditorSettings({
+      ...currentStoreSettings,
+      styles: [...nonGlobalStyles, ...styles],
+      __experimentalFeatures: settings
+    });
+  }, [styles, settings, updateEditorSettings, getEditorSettings]);
+}
+function GlobalStylesRenderer({ disableRootPadding }) {
+  useGlobalStylesRenderer(disableRootPadding);
+  return null;
+}
+export {
+  GlobalStylesRenderer
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles-renderer/index.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { useGlobalStylesOutput } from '../../hooks/use-global-styles-output';\n\nfunction useGlobalStylesRenderer( disableRootPadding ) {\n\tconst [ styles, settings ] = useGlobalStylesOutput( disableRootPadding );\n\tconst { getEditorSettings } = useSelect( editorStore );\n\tconst { updateEditorSettings } = useDispatch( editorStore );\n\n\tuseEffect( () => {\n\t\tif ( ! styles || ! settings ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentStoreSettings = getEditorSettings();\n\t\tconst nonGlobalStyles = Object.values(\n\t\t\tcurrentStoreSettings.styles ?? []\n\t\t).filter( ( style ) => ! style.isGlobalStyles );\n\t\tupdateEditorSettings( {\n\t\t\t...currentStoreSettings,\n\t\t\tstyles: [ ...nonGlobalStyles, ...styles ],\n\t\t\t__experimentalFeatures: settings,\n\t\t} );\n\t}, [ styles, settings, updateEditorSettings, getEditorSettings ] );\n}\n\nexport function GlobalStylesRenderer( { disableRootPadding } ) {\n\tuseGlobalStylesRenderer( disableRootPadding );\n\n\treturn null;\n}\n"],
+  "mappings": "AAGA,SAAS,iBAAiB;AAC1B,SAAS,WAAW,mBAAmB;AAKvC,SAAS,SAAS,mBAAmB;AACrC,SAAS,6BAA6B;AAEtC,SAAS,wBAAyB,oBAAqB;AACtD,QAAM,CAAE,QAAQ,QAAS,IAAI,sBAAuB,kBAAmB;AACvE,QAAM,EAAE,kBAAkB,IAAI,UAAW,WAAY;AACrD,QAAM,EAAE,qBAAqB,IAAI,YAAa,WAAY;AAE1D,YAAW,MAAM;AAChB,QAAK,CAAE,UAAU,CAAE,UAAW;AAC7B;AAAA,IACD;AAEA,UAAM,uBAAuB,kBAAkB;AAC/C,UAAM,kBAAkB,OAAO;AAAA,MAC9B,qBAAqB,UAAU,CAAC;AAAA,IACjC,EAAE,OAAQ,CAAE,UAAW,CAAE,MAAM,cAAe;AAC9C,yBAAsB;AAAA,MACrB,GAAG;AAAA,MACH,QAAQ,CAAE,GAAG,iBAAiB,GAAG,MAAO;AAAA,MACxC,wBAAwB;AAAA,IACzB,CAAE;AAAA,EACH,GAAG,CAAE,QAAQ,UAAU,sBAAsB,iBAAkB,CAAE;AAClE;AAEO,SAAS,qBAAsB,EAAE,mBAAmB,GAAI;AAC9D,0BAAyB,kBAAmB;AAE5C,SAAO;AACR;",
+  "names": []
+}