@wordpress/editor 13.35.0 → 14.0.0

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

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
@@ -8,15 +7,18 @@ import { isPlainObject } from 'is-plain-object';
 /**
  * WordPress dependencies
  */
+import { registerBlockStyle, store as blocksStore } from '@wordpress/blocks';
 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 { useEffect, useMemo, useCallback } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { unlock } from '../../lock-unlock';
+import setNestedValue from '../../utils/set-nested-value';
+import { jsx as _jsx } from "react/jsx-runtime";
 const {
   GlobalStylesContext,
   cleanEmptyObject
@@ -29,12 +31,69 @@ export function mergeBaseAndUserConfigs(base, user) {
     isMergeableObject: isPlainObject
   });
 }
+
+/**
+ * Resolves shared block style variation definitions from the user origin
+ * under their respective block types and registers the block style if required.
+ *
+ * @param {Object} userConfig Current user origin global styles data.
+ * @return {Object} Updated global styles data.
+ */
+function useResolvedBlockStyleVariationsConfig(userConfig) {
+  const {
+    getBlockStyles
+  } = useSelect(blocksStore);
+  const sharedVariations = userConfig?.styles?.blocks?.variations;
+
+  // Collect block style variation definitions to merge and unregistered
+  // block styles for automatic registration.
+  const [userConfigToMerge, unregisteredStyles] = useMemo(() => {
+    if (!sharedVariations) {
+      return [];
+    }
+    const variationsConfigToMerge = {};
+    const unregisteredBlockStyles = [];
+    Object.entries(sharedVariations).forEach(([variationName, variation]) => {
+      if (!variation?.blockTypes?.length) {
+        return;
+      }
+      variation.blockTypes.forEach(blockName => {
+        const blockStyles = getBlockStyles(blockName);
+        const registeredBlockStyle = blockStyles.find(({
+          name
+        }) => name === variationName);
+        if (!registeredBlockStyle) {
+          unregisteredBlockStyles.push([blockName, {
+            name: variationName,
+            label: variationName
+          }]);
+        }
+        const path = ['styles', 'blocks', blockName, 'variations', variationName];
+        setNestedValue(variationsConfigToMerge, path, variation);
+      });
+    });
+    return [variationsConfigToMerge, unregisteredBlockStyles];
+  }, [sharedVariations, getBlockStyles]);
+
+  // Automatically register missing block styles from variations.
+  useEffect(() => unregisteredStyles?.forEach(unregisteredStyle => registerBlockStyle(...unregisteredStyle)), [unregisteredStyles]);
+
+  // Merge shared block style variation definitions into overall user config.
+  const updatedConfig = useMemo(() => {
+    if (!userConfigToMerge) {
+      return userConfig;
+    }
+    return deepmerge(userConfigToMerge, userConfig);
+  }, [userConfigToMerge, userConfig]);
+  return updatedConfig;
+}
 function useGlobalStylesUserConfig() {
   const {
     globalStylesId,
     isReady,
     settings,
-    styles
+    styles,
+    _links
   } = useSelect(select => {
     const {
       getEditedEntityRecord,
@@ -50,7 +109,8 @@ function useGlobalStylesUserConfig() {
       globalStylesId: _globalStylesId,
       isReady: hasResolved,
       settings: record?.settings,
-      styles: record?.styles
+      styles: record?.styles,
+      _links: record?._links
     };
   }, []);
   const {
@@ -62,20 +122,23 @@ function useGlobalStylesUserConfig() {
   const config = useMemo(() => {
     return {
       settings: settings !== null && settings !== void 0 ? settings : {},
-      styles: styles !== null && styles !== void 0 ? styles : {}
+      styles: styles !== null && styles !== void 0 ? styles : {},
+      _links: _links !== null && _links !== void 0 ? _links : {}
     };
-  }, [settings, styles]);
+  }, [settings, styles, _links]);
   const setConfig = useCallback((callback, options = {}) => {
-    var _record$styles, _record$settings;
+    var _record$styles, _record$settings, _record$_links;
     const record = getEditedEntityRecord('root', 'globalStyles', globalStylesId);
     const currentConfig = {
       styles: (_record$styles = record?.styles) !== null && _record$styles !== void 0 ? _record$styles : {},
-      settings: (_record$settings = record?.settings) !== null && _record$settings !== void 0 ? _record$settings : {}
+      settings: (_record$settings = record?.settings) !== null && _record$settings !== void 0 ? _record$settings : {},
+      _links: (_record$_links = record?._links) !== null && _record$_links !== void 0 ? _record$_links : {}
     };
     const updatedConfig = callback(currentConfig);
     editEntityRecord('root', 'globalStyles', globalStylesId, {
       styles: cleanEmptyObject(updatedConfig.styles) || {},
-      settings: cleanEmptyObject(updatedConfig.settings) || {}
+      settings: cleanEmptyObject(updatedConfig.settings) || {},
+      _links: cleanEmptyObject(updatedConfig._links) || {}
     }, options);
   }, [globalStylesId]);
   return [isReady, config, setConfig];
@@ -89,21 +152,22 @@ function useGlobalStylesBaseConfig() {
 export function useGlobalStylesContext() {
   const [isUserConfigReady, userConfig, setUserConfig] = useGlobalStylesUserConfig();
   const [isBaseConfigReady, baseConfig] = useGlobalStylesBaseConfig();
+  const userConfigWithVariations = useResolvedBlockStyleVariationsConfig(userConfig);
   const mergedConfig = useMemo(() => {
-    if (!baseConfig || !userConfig) {
+    if (!baseConfig || !userConfigWithVariations) {
       return {};
     }
-    return mergeBaseAndUserConfigs(baseConfig, userConfig);
-  }, [userConfig, baseConfig]);
+    return mergeBaseAndUserConfigs(baseConfig, userConfigWithVariations);
+  }, [userConfigWithVariations, baseConfig]);
   const context = useMemo(() => {
     return {
       isReady: isUserConfigReady && isBaseConfigReady,
-      user: userConfig,
+      user: userConfigWithVariations,
       base: baseConfig,
       merged: mergedConfig,
       setUserConfig
     };
-  }, [mergedConfig, userConfig, baseConfig, setUserConfig, isUserConfigReady, isBaseConfigReady]);
+  }, [mergedConfig, userConfigWithVariations, baseConfig, setUserConfig, isUserConfigReady, isBaseConfigReady]);
   return context;
 }
 export function GlobalStylesProvider({
@@ -113,8 +177,9 @@ export function GlobalStylesProvider({
   if (!context.isReady) {
     return null;
   }
-  return createElement(GlobalStylesContext.Provider, {
-    value: context
-  }, children);
+  return /*#__PURE__*/_jsx(GlobalStylesContext.Provider, {
+    value: context,
+    children: children
+  });
 }
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["deepmerge","isPlainObject","privateApis","blockEditorPrivateApis","store","coreStore","useSelect","useDispatch","useMemo","useCallback","unlock","GlobalStylesContext","cleanEmptyObject","mergeBaseAndUserConfigs","base","user","isMergeableObject","useGlobalStylesUserConfig","globalStylesId","isReady","settings","styles","select","getEditedEntityRecord","hasFinishedResolution","_globalStylesId","__experimentalGetCurrentGlobalStylesId","record","undefined","hasResolved","editEntityRecord","config","setConfig","callback","options","_record$styles","_record$settings","currentConfig","updatedConfig","useGlobalStylesBaseConfig","baseConfig","__experimentalGetCurrentThemeBaseGlobalStyles","useGlobalStylesContext","isUserConfigReady","userConfig","setUserConfig","isBaseConfigReady","mergedConfig","context","merged","GlobalStylesProvider","children","createElement","Provider","value"],"sources":["@wordpress/editor/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// 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\tisMergeableObject: isPlainObject,\n\t} );\n}\n\nfunction useGlobalStylesUserConfig() {\n\tconst { globalStylesId, isReady, settings, styles } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEditedEntityRecord, hasFinishedResolution } =\n\t\t\t\tselect( coreStore );\n\t\t\tconst _globalStylesId =\n\t\t\t\tselect( coreStore ).__experimentalGetCurrentGlobalStylesId();\n\t\t\tconst record = _globalStylesId\n\t\t\t\t? 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  )\n\t\t\t\t: undefined;\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\thasResolved = _globalStylesId\n\t\t\t\t\t? hasFinishedResolution( 'getEditedEntityRecord', [\n\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t  ] )\n\t\t\t\t\t: true;\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};\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};\n\t}, [ settings, styles ] );\n\n\tconst setConfig = useCallback(\n\t\t( callback, 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\t\t\tconst currentConfig = {\n\t\t\t\tstyles: record?.styles ?? {},\n\t\t\t\tsettings: record?.settings ?? {},\n\t\t\t};\n\t\t\tconst updatedConfig = callback( currentConfig );\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},\n\t\t\t\toptions\n\t\t\t);\n\t\t},\n\t\t[ globalStylesId ]\n\t);\n\n\treturn [ isReady, config, setConfig ];\n}\n\nfunction useGlobalStylesBaseConfig() {\n\tconst baseConfig = useSelect( ( select ) => {\n\t\treturn select(\n\t\t\tcoreStore\n\t\t).__experimentalGetCurrentThemeBaseGlobalStyles();\n\t}, [] );\n\n\treturn [ !! baseConfig, baseConfig ];\n}\n\nexport function useGlobalStylesContext() {\n\tconst [ isUserConfigReady, userConfig, setUserConfig ] =\n\t\tuseGlobalStylesUserConfig();\n\tconst [ isBaseConfigReady, baseConfig ] = useGlobalStylesBaseConfig();\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! baseConfig || ! userConfig ) {\n\t\t\treturn {};\n\t\t}\n\t\treturn mergeBaseAndUserConfigs( baseConfig, userConfig );\n\t}, [ userConfig, baseConfig ] );\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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","ignoreList":[]}
+{"version":3,"names":["deepmerge","isPlainObject","registerBlockStyle","store","blocksStore","privateApis","blockEditorPrivateApis","coreStore","useSelect","useDispatch","useEffect","useMemo","useCallback","unlock","setNestedValue","jsx","_jsx","GlobalStylesContext","cleanEmptyObject","mergeBaseAndUserConfigs","base","user","isMergeableObject","useResolvedBlockStyleVariationsConfig","userConfig","getBlockStyles","sharedVariations","styles","blocks","variations","userConfigToMerge","unregisteredStyles","variationsConfigToMerge","unregisteredBlockStyles","Object","entries","forEach","variationName","variation","blockTypes","length","blockName","blockStyles","registeredBlockStyle","find","name","push","label","path","unregisteredStyle","updatedConfig","useGlobalStylesUserConfig","globalStylesId","isReady","settings","_links","select","getEditedEntityRecord","hasFinishedResolution","_globalStylesId","__experimentalGetCurrentGlobalStylesId","record","undefined","hasResolved","editEntityRecord","config","setConfig","callback","options","_record$styles","_record$settings","_record$_links","currentConfig","useGlobalStylesBaseConfig","baseConfig","__experimentalGetCurrentThemeBaseGlobalStyles","useGlobalStylesContext","isUserConfigReady","setUserConfig","isBaseConfigReady","userConfigWithVariations","mergedConfig","context","merged","GlobalStylesProvider","children","Provider","value"],"sources":["@wordpress/editor/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 { registerBlockStyle, store as blocksStore } from '@wordpress/blocks';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useMemo, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport setNestedValue from '../../utils/set-nested-value';\n\nconst { GlobalStylesContext, cleanEmptyObject } = unlock(\n\tblockEditorPrivateApis\n);\n\nexport function mergeBaseAndUserConfigs( base, user ) {\n\treturn deepmerge( base, user, {\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\tisMergeableObject: isPlainObject,\n\t} );\n}\n\n/**\n * Resolves shared block style variation definitions from the user origin\n * under their respective block types and registers the block style if required.\n *\n * @param {Object} userConfig Current user origin global styles data.\n * @return {Object} Updated global styles data.\n */\nfunction useResolvedBlockStyleVariationsConfig( userConfig ) {\n\tconst { getBlockStyles } = useSelect( blocksStore );\n\tconst sharedVariations = userConfig?.styles?.blocks?.variations;\n\n\t// Collect block style variation definitions to merge and unregistered\n\t// block styles for automatic registration.\n\tconst [ userConfigToMerge, unregisteredStyles ] = useMemo( () => {\n\t\tif ( ! sharedVariations ) {\n\t\t\treturn [];\n\t\t}\n\n\t\tconst variationsConfigToMerge = {};\n\t\tconst unregisteredBlockStyles = [];\n\n\t\tObject.entries( sharedVariations ).forEach(\n\t\t\t( [ variationName, variation ] ) => {\n\t\t\t\tif ( ! variation?.blockTypes?.length ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tvariation.blockTypes.forEach( ( blockName ) => {\n\t\t\t\t\tconst blockStyles = getBlockStyles( blockName );\n\t\t\t\t\tconst registeredBlockStyle = blockStyles.find(\n\t\t\t\t\t\t( { name } ) => name === variationName\n\t\t\t\t\t);\n\n\t\t\t\t\tif ( ! registeredBlockStyle ) {\n\t\t\t\t\t\tunregisteredBlockStyles.push( [\n\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tname: variationName,\n\t\t\t\t\t\t\t\tlabel: variationName,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t] );\n\t\t\t\t\t}\n\n\t\t\t\t\tconst path = [\n\t\t\t\t\t\t'styles',\n\t\t\t\t\t\t'blocks',\n\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t'variations',\n\t\t\t\t\t\tvariationName,\n\t\t\t\t\t];\n\t\t\t\t\tsetNestedValue( variationsConfigToMerge, path, variation );\n\t\t\t\t} );\n\t\t\t}\n\t\t);\n\n\t\treturn [ variationsConfigToMerge, unregisteredBlockStyles ];\n\t}, [ sharedVariations, getBlockStyles ] );\n\n\t// Automatically register missing block styles from variations.\n\tuseEffect(\n\t\t() =>\n\t\t\tunregisteredStyles?.forEach( ( unregisteredStyle ) =>\n\t\t\t\tregisterBlockStyle( ...unregisteredStyle )\n\t\t\t),\n\t\t[ unregisteredStyles ]\n\t);\n\n\t// Merge shared block style variation definitions into overall user config.\n\tconst updatedConfig = useMemo( () => {\n\t\tif ( ! userConfigToMerge ) {\n\t\t\treturn userConfig;\n\t\t}\n\n\t\treturn deepmerge( userConfigToMerge, userConfig );\n\t}, [ userConfigToMerge, userConfig ] );\n\n\treturn updatedConfig;\n}\n\nfunction useGlobalStylesUserConfig() {\n\tconst { globalStylesId, isReady, settings, styles, _links } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEditedEntityRecord, hasFinishedResolution } =\n\t\t\t\tselect( coreStore );\n\t\t\tconst _globalStylesId =\n\t\t\t\tselect( coreStore ).__experimentalGetCurrentGlobalStylesId();\n\t\t\tconst record = _globalStylesId\n\t\t\t\t? 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  )\n\t\t\t\t: undefined;\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\thasResolved = _globalStylesId\n\t\t\t\t\t? hasFinishedResolution( 'getEditedEntityRecord', [\n\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t  ] )\n\t\t\t\t\t: true;\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( callback, 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\t\t\tconst updatedConfig = callback( currentConfig );\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 ]\n\t);\n\n\treturn [ isReady, config, setConfig ];\n}\n\nfunction useGlobalStylesBaseConfig() {\n\tconst baseConfig = useSelect( ( select ) => {\n\t\treturn select(\n\t\t\tcoreStore\n\t\t).__experimentalGetCurrentThemeBaseGlobalStyles();\n\t}, [] );\n\n\treturn [ !! baseConfig, baseConfig ];\n}\n\nexport function useGlobalStylesContext() {\n\tconst [ isUserConfigReady, userConfig, setUserConfig ] =\n\t\tuseGlobalStylesUserConfig();\n\tconst [ isBaseConfigReady, baseConfig ] = useGlobalStylesBaseConfig();\n\tconst userConfigWithVariations =\n\t\tuseResolvedBlockStyleVariationsConfig( userConfig );\n\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! baseConfig || ! userConfigWithVariations ) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn mergeBaseAndUserConfigs( baseConfig, userConfigWithVariations );\n\t}, [ userConfigWithVariations, baseConfig ] );\n\n\tconst context = useMemo( () => {\n\t\treturn {\n\t\t\tisReady: isUserConfigReady && isBaseConfigReady,\n\t\t\tuser: userConfigWithVariations,\n\t\t\tbase: baseConfig,\n\t\t\tmerged: mergedConfig,\n\t\t\tsetUserConfig,\n\t\t};\n\t}, [\n\t\tmergedConfig,\n\t\tuserConfigWithVariations,\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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","ignoreList":[]}

package/build-module/components/header/back-button.js

@@ -0,0 +1,28 @@
+/**
+ * WordPress dependencies
+ */
+import { __experimentalUseSlotFills as useSlotFills, createSlotFill } from '@wordpress/components';
+
+// Keeping an old name for backward compatibility.
+import { jsx as _jsx } from "react/jsx-runtime";
+const slotName = '__experimentalMainDashboardButton';
+const {
+  Fill,
+  Slot
+} = createSlotFill(slotName);
+const BackButton = Fill;
+const BackButtonSlot = ({
+  children
+}) => {
+  const fills = useSlotFills(slotName);
+  const hasFills = Boolean(fills && fills.length);
+  if (!hasFills) {
+    return children;
+  }
+  return /*#__PURE__*/_jsx(Slot, {
+    bubblesVirtually: true
+  });
+};
+BackButton.Slot = BackButtonSlot;
+export default BackButton;
+//# sourceMappingURL=back-button.js.map

package/build-module/components/header/back-button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__experimentalUseSlotFills","useSlotFills","createSlotFill","jsx","_jsx","slotName","Fill","Slot","BackButton","BackButtonSlot","children","fills","hasFills","Boolean","length","bubblesVirtually"],"sources":["@wordpress/editor/src/components/header/back-button.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalUseSlotFills as useSlotFills,\n\tcreateSlotFill,\n} from '@wordpress/components';\n\n// Keeping an old name for backward compatibility.\nconst slotName = '__experimentalMainDashboardButton';\n\nconst { Fill, Slot } = createSlotFill( slotName );\n\nconst BackButton = Fill;\nconst BackButtonSlot = ( { children } ) => {\n\tconst fills = useSlotFills( slotName );\n\tconst hasFills = Boolean( fills && fills.length );\n\n\tif ( ! hasFills ) {\n\t\treturn children;\n\t}\n\n\treturn <Slot bubblesVirtually />;\n};\nBackButton.Slot = BackButtonSlot;\n\nexport default BackButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,SACCA,0BAA0B,IAAIC,YAAY,EAC1CC,cAAc,QACR,uBAAuB;;AAE9B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AACA,MAAMC,QAAQ,GAAG,mCAAmC;AAEpD,MAAM;EAAEC,IAAI;EAAEC;AAAK,CAAC,GAAGL,cAAc,CAAEG,QAAS,CAAC;AAEjD,MAAMG,UAAU,GAAGF,IAAI;AACvB,MAAMG,cAAc,GAAGA,CAAE;EAAEC;AAAS,CAAC,KAAM;EAC1C,MAAMC,KAAK,GAAGV,YAAY,CAAEI,QAAS,CAAC;EACtC,MAAMO,QAAQ,GAAGC,OAAO,CAAEF,KAAK,IAAIA,KAAK,CAACG,MAAO,CAAC;EAEjD,IAAK,CAAEF,QAAQ,EAAG;IACjB,OAAOF,QAAQ;EAChB;EAEA,oBAAON,IAAA,CAACG,IAAI;IAACQ,gBAAgB;EAAA,CAAE,CAAC;AACjC,CAAC;AACDP,UAAU,CAACD,IAAI,GAAGE,cAAc;AAEhC,eAAeD,UAAU","ignoreList":[]}

package/build-module/components/header/index.js

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
@@ -18,6 +17,7 @@ import { store as blockEditorStore } from '@wordpress/block-editor';
 /**
  * Internal dependencies
  */
+import BackButton from './back-button';
 import CollapsableBlockToolbar from '../collapsible-block-toolbar';
 import DocumentBar from '../document-bar';
 import DocumentTools from '../document-tools';
@@ -29,19 +29,40 @@ import PostTypeSupportCheck from '../post-type-support-check';
 import PostViewLink from '../post-view-link';
 import PreviewDropdown from '../preview-dropdown';
 import { store as editorStore } from '../../store';
-const slideY = {
-  hidden: {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const toolbarVariations = {
+  distractionFreeDisabled: {
     y: '-50px'
   },
-  distractionFreeInactive: {
+  distractionFreeHover: {
+    y: 0
+  },
+  distractionFreeHidden: {
+    y: '-50px'
+  },
+  visible: {
+    y: 0
+  },
+  hidden: {
     y: 0
+  }
+};
+const backButtonVariations = {
+  distractionFreeDisabled: {
+    x: '-100%'
+  },
+  distractionFreeHover: {
+    x: 0
   },
-  hover: {
-    y: 0,
-    transition: {
-      type: 'tween',
-      delay: 0.2
-    }
+  distractionFreeHidden: {
+    x: '-100%'
+  },
+  visible: {
+    x: 0
+  },
+  hidden: {
+    x: 0
   }
 };
 function Header({
@@ -49,8 +70,7 @@ function Header({
   forceIsDirty,
   forceDisableBlockTools,
   setEntitiesSavedStatesCallback,
-  title,
-  children
+  title
 }) {
   const isWideViewport = useViewportMatch('large');
   const isLargeViewport = useViewportMatch('medium');
@@ -87,53 +107,63 @@ function Header({
 
   // The edit-post-header classname is only kept for backward compatibilty
   // as some plugins might be relying on its presence.
-  return createElement("div", {
-    className: "editor-header edit-post-header"
-  }, children, createElement(motion.div, {
-    variants: slideY,
-    transition: {
-      type: 'tween',
-      delay: 0.8
-    },
-    className: "editor-header__toolbar"
-  }, createElement(DocumentTools, {
-    disableBlockTools: forceDisableBlockTools || isTextEditor
-  }), hasTopToolbar && createElement(CollapsableBlockToolbar, {
-    isCollapsed: isBlockToolsCollapsed,
-    onToggle: setIsBlockToolsCollapsed
-  }), createElement("div", {
-    className: clsx('editor-header__center', {
-      'is-collapsed': !isBlockToolsCollapsed && hasTopToolbar
-    })
-  }, !title ? createElement(PostTypeSupportCheck, {
-    supportKeys: "title"
-  }, createElement(DocumentBar, null)) : title)), createElement(motion.div, {
-    variants: slideY,
-    transition: {
-      type: 'tween',
-      delay: 0.8
-    },
-    className: "editor-header__settings"
-  }, !customSaveButton && !isPublishSidebarOpened &&
-  // This button isn't completely hidden by the publish sidebar.
-  // We can't hide the whole toolbar when the publish sidebar is open because
-  // we want to prevent mounting/unmounting the PostPublishButtonOrToggle DOM node.
-  // We track that DOM node to return focus to the PostPublishButtonOrToggle
-  // when the publish sidebar has been closed.
-  createElement(PostSavedState, {
-    forceIsDirty: forceIsDirty
-  }), createElement(PreviewDropdown, {
-    forceIsAutosaveable: forceIsDirty,
-    disabled: isNestedEntity || isZoomedOutView
-  }), createElement(PostPreviewButton, {
-    className: "editor-header__post-preview-button",
-    forceIsAutosaveable: forceIsDirty
-  }), createElement(PostViewLink, null), !customSaveButton && createElement(PostPublishButtonOrToggle, {
-    forceIsDirty: forceIsDirty,
-    setEntitiesSavedStatesCallback: setEntitiesSavedStatesCallback
-  }), customSaveButton, (isWideViewport || !showIconLabels) && createElement(PinnedItems.Slot, {
-    scope: "core"
-  }), createElement(MoreMenu, null)));
+  return /*#__PURE__*/_jsxs("div", {
+    className: "editor-header edit-post-header",
+    children: [/*#__PURE__*/_jsx(motion.div, {
+      variants: backButtonVariations,
+      transition: {
+        type: 'tween'
+      },
+      children: /*#__PURE__*/_jsx(BackButton.Slot, {})
+    }), /*#__PURE__*/_jsxs(motion.div, {
+      variants: toolbarVariations,
+      className: "editor-header__toolbar",
+      transition: {
+        type: 'tween'
+      },
+      children: [/*#__PURE__*/_jsx(DocumentTools, {
+        disableBlockTools: forceDisableBlockTools || isTextEditor
+      }), hasTopToolbar && /*#__PURE__*/_jsx(CollapsableBlockToolbar, {
+        isCollapsed: isBlockToolsCollapsed,
+        onToggle: setIsBlockToolsCollapsed
+      }), /*#__PURE__*/_jsx("div", {
+        className: clsx('editor-header__center', {
+          'is-collapsed': !isBlockToolsCollapsed && hasTopToolbar
+        }),
+        children: !title ? /*#__PURE__*/_jsx(PostTypeSupportCheck, {
+          supportKeys: "title",
+          children: /*#__PURE__*/_jsx(DocumentBar, {})
+        }) : title
+      })]
+    }), /*#__PURE__*/_jsxs(motion.div, {
+      variants: toolbarVariations,
+      transition: {
+        type: 'tween'
+      },
+      className: "editor-header__settings",
+      children: [!customSaveButton && !isPublishSidebarOpened &&
+      /*#__PURE__*/
+      // This button isn't completely hidden by the publish sidebar.
+      // We can't hide the whole toolbar when the publish sidebar is open because
+      // we want to prevent mounting/unmounting the PostPublishButtonOrToggle DOM node.
+      // We track that DOM node to return focus to the PostPublishButtonOrToggle
+      // when the publish sidebar has been closed.
+      _jsx(PostSavedState, {
+        forceIsDirty: forceIsDirty
+      }), /*#__PURE__*/_jsx(PreviewDropdown, {
+        forceIsAutosaveable: forceIsDirty,
+        disabled: isNestedEntity || isZoomedOutView
+      }), /*#__PURE__*/_jsx(PostPreviewButton, {
+        className: "editor-header__post-preview-button",
+        forceIsAutosaveable: forceIsDirty
+      }), /*#__PURE__*/_jsx(PostViewLink, {}), !customSaveButton && /*#__PURE__*/_jsx(PostPublishButtonOrToggle, {
+        forceIsDirty: forceIsDirty,
+        setEntitiesSavedStatesCallback: setEntitiesSavedStatesCallback
+      }), customSaveButton, (isWideViewport || !showIconLabels) && /*#__PURE__*/_jsx(PinnedItems.Slot, {
+        scope: "core"
+      }), /*#__PURE__*/_jsx(MoreMenu, {})]
+    })]
+  });
 }
 export default Header;
 //# sourceMappingURL=index.js.map

package/build-module/components/header/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","useSelect","useViewportMatch","__unstableMotion","motion","store","preferencesStore","useState","PinnedItems","blockEditorStore","CollapsableBlockToolbar","DocumentBar","DocumentTools","MoreMenu","PostPreviewButton","PostPublishButtonOrToggle","PostSavedState","PostTypeSupportCheck","PostViewLink","PreviewDropdown","editorStore","slideY","hidden","y","distractionFreeInactive","hover","transition","type","delay","Header","customSaveButton","forceIsDirty","forceDisableBlockTools","setEntitiesSavedStatesCallback","title","children","isWideViewport","isLargeViewport","isTextEditor","isPublishSidebarOpened","showIconLabels","hasFixedToolbar","isNestedEntity","isZoomedOutView","select","get","getPreference","getEditorMode","getEditorSettings","_isPublishSidebarOpened","__unstableGetEditorMode","onNavigateToPreviousEntityRecord","hasTopToolbar","isBlockToolsCollapsed","setIsBlockToolsCollapsed","createElement","className","div","variants","disableBlockTools","isCollapsed","onToggle","supportKeys","forceIsAutosaveable","disabled","Slot","scope"],"sources":["@wordpress/editor/src/components/header/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { __unstableMotion as motion } from '@wordpress/components';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { useState } from '@wordpress/element';\nimport { PinnedItems } from '@wordpress/interface';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport CollapsableBlockToolbar from '../collapsible-block-toolbar';\nimport DocumentBar from '../document-bar';\nimport DocumentTools from '../document-tools';\nimport MoreMenu from '../more-menu';\nimport PostPreviewButton from '../post-preview-button';\nimport PostPublishButtonOrToggle from '../post-publish-button/post-publish-button-or-toggle';\nimport PostSavedState from '../post-saved-state';\nimport PostTypeSupportCheck from '../post-type-support-check';\nimport PostViewLink from '../post-view-link';\nimport PreviewDropdown from '../preview-dropdown';\nimport { store as editorStore } from '../../store';\n\nconst slideY = {\n\thidden: { y: '-50px' },\n\tdistractionFreeInactive: { y: 0 },\n\thover: { y: 0, transition: { type: 'tween', delay: 0.2 } },\n};\n\nfunction Header( {\n\tcustomSaveButton,\n\tforceIsDirty,\n\tforceDisableBlockTools,\n\tsetEntitiesSavedStatesCallback,\n\ttitle,\n\tchildren,\n} ) {\n\tconst isWideViewport = useViewportMatch( 'large' );\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst {\n\t\tisTextEditor,\n\t\tisPublishSidebarOpened,\n\t\tshowIconLabels,\n\t\thasFixedToolbar,\n\t\tisNestedEntity,\n\t\tisZoomedOutView,\n\t} = useSelect( ( select ) => {\n\t\tconst { get: getPreference } = select( preferencesStore );\n\t\tconst {\n\t\t\tgetEditorMode,\n\t\t\tgetEditorSettings,\n\t\t\tisPublishSidebarOpened: _isPublishSidebarOpened,\n\t\t} = select( editorStore );\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\n\t\treturn {\n\t\t\tisTextEditor: getEditorMode() === 'text',\n\t\t\tisPublishSidebarOpened: _isPublishSidebarOpened(),\n\t\t\tshowIconLabels: getPreference( 'core', 'showIconLabels' ),\n\t\t\thasFixedToolbar: getPreference( 'core', 'fixedToolbar' ),\n\t\t\tisNestedEntity:\n\t\t\t\t!! getEditorSettings().onNavigateToPreviousEntityRecord,\n\t\t\tisZoomedOutView: __unstableGetEditorMode() === 'zoom-out',\n\t\t};\n\t}, [] );\n\n\tconst hasTopToolbar = isLargeViewport && hasFixedToolbar;\n\n\tconst [ isBlockToolsCollapsed, setIsBlockToolsCollapsed ] =\n\t\tuseState( true );\n\n\t// The edit-post-header classname is only kept for backward compatibilty\n\t// as some plugins might be relying on its presence.\n\treturn (\n\t\t<div className=\"editor-header edit-post-header\">\n\t\t\t{ children }\n\t\t\t<motion.div\n\t\t\t\tvariants={ slideY }\n\t\t\t\ttransition={ { type: 'tween', delay: 0.8 } }\n\t\t\t\tclassName=\"editor-header__toolbar\"\n\t\t\t>\n\t\t\t\t<DocumentTools\n\t\t\t\t\tdisableBlockTools={ forceDisableBlockTools || isTextEditor }\n\t\t\t\t/>\n\t\t\t\t{ hasTopToolbar && (\n\t\t\t\t\t<CollapsableBlockToolbar\n\t\t\t\t\t\tisCollapsed={ isBlockToolsCollapsed }\n\t\t\t\t\t\tonToggle={ setIsBlockToolsCollapsed }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( 'editor-header__center', {\n\t\t\t\t\t\t'is-collapsed':\n\t\t\t\t\t\t\t! isBlockToolsCollapsed && hasTopToolbar,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ ! title ? (\n\t\t\t\t\t\t<PostTypeSupportCheck supportKeys=\"title\">\n\t\t\t\t\t\t\t<DocumentBar />\n\t\t\t\t\t\t</PostTypeSupportCheck>\n\t\t\t\t\t) : (\n\t\t\t\t\t\ttitle\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</motion.div>\n\t\t\t<motion.div\n\t\t\t\tvariants={ slideY }\n\t\t\t\ttransition={ { type: 'tween', delay: 0.8 } }\n\t\t\t\tclassName=\"editor-header__settings\"\n\t\t\t>\n\t\t\t\t{ ! customSaveButton && ! isPublishSidebarOpened && (\n\t\t\t\t\t// This button isn't completely hidden by the publish sidebar.\n\t\t\t\t\t// We can't hide the whole toolbar when the publish sidebar is open because\n\t\t\t\t\t// we want to prevent mounting/unmounting the PostPublishButtonOrToggle DOM node.\n\t\t\t\t\t// We track that DOM node to return focus to the PostPublishButtonOrToggle\n\t\t\t\t\t// when the publish sidebar has been closed.\n\t\t\t\t\t<PostSavedState forceIsDirty={ forceIsDirty } />\n\t\t\t\t) }\n\t\t\t\t<PreviewDropdown\n\t\t\t\t\tforceIsAutosaveable={ forceIsDirty }\n\t\t\t\t\tdisabled={ isNestedEntity || isZoomedOutView }\n\t\t\t\t/>\n\t\t\t\t<PostPreviewButton\n\t\t\t\t\tclassName=\"editor-header__post-preview-button\"\n\t\t\t\t\tforceIsAutosaveable={ forceIsDirty }\n\t\t\t\t/>\n\t\t\t\t<PostViewLink />\n\t\t\t\t{ ! customSaveButton && (\n\t\t\t\t\t<PostPublishButtonOrToggle\n\t\t\t\t\t\tforceIsDirty={ forceIsDirty }\n\t\t\t\t\t\tsetEntitiesSavedStatesCallback={\n\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ customSaveButton }\n\t\t\t\t{ ( isWideViewport || ! showIconLabels ) && (\n\t\t\t\t\t<PinnedItems.Slot scope=\"core\" />\n\t\t\t\t) }\n\t\t\t\t<MoreMenu />\n\t\t\t</motion.div>\n\t\t</div>\n\t);\n}\n\nexport default Header;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","useSelect","useViewportMatch","__unstableMotion","motion","store","preferencesStore","useState","PinnedItems","blockEditorStore","BackButton","CollapsableBlockToolbar","DocumentBar","DocumentTools","MoreMenu","PostPreviewButton","PostPublishButtonOrToggle","PostSavedState","PostTypeSupportCheck","PostViewLink","PreviewDropdown","editorStore","jsx","_jsx","jsxs","_jsxs","toolbarVariations","distractionFreeDisabled","y","distractionFreeHover","distractionFreeHidden","visible","hidden","backButtonVariations","x","Header","customSaveButton","forceIsDirty","forceDisableBlockTools","setEntitiesSavedStatesCallback","title","isWideViewport","isLargeViewport","isTextEditor","isPublishSidebarOpened","showIconLabels","hasFixedToolbar","isNestedEntity","isZoomedOutView","select","get","getPreference","getEditorMode","getEditorSettings","_isPublishSidebarOpened","__unstableGetEditorMode","onNavigateToPreviousEntityRecord","hasTopToolbar","isBlockToolsCollapsed","setIsBlockToolsCollapsed","className","children","div","variants","transition","type","Slot","disableBlockTools","isCollapsed","onToggle","supportKeys","forceIsAutosaveable","disabled","scope"],"sources":["@wordpress/editor/src/components/header/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { __unstableMotion as motion } from '@wordpress/components';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { useState } from '@wordpress/element';\nimport { PinnedItems } from '@wordpress/interface';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport BackButton from './back-button';\nimport CollapsableBlockToolbar from '../collapsible-block-toolbar';\nimport DocumentBar from '../document-bar';\nimport DocumentTools from '../document-tools';\nimport MoreMenu from '../more-menu';\nimport PostPreviewButton from '../post-preview-button';\nimport PostPublishButtonOrToggle from '../post-publish-button/post-publish-button-or-toggle';\nimport PostSavedState from '../post-saved-state';\nimport PostTypeSupportCheck from '../post-type-support-check';\nimport PostViewLink from '../post-view-link';\nimport PreviewDropdown from '../preview-dropdown';\nimport { store as editorStore } from '../../store';\n\nconst toolbarVariations = {\n\tdistractionFreeDisabled: { y: '-50px' },\n\tdistractionFreeHover: { y: 0 },\n\tdistractionFreeHidden: { y: '-50px' },\n\tvisible: { y: 0 },\n\thidden: { y: 0 },\n};\n\nconst backButtonVariations = {\n\tdistractionFreeDisabled: { x: '-100%' },\n\tdistractionFreeHover: { x: 0 },\n\tdistractionFreeHidden: { x: '-100%' },\n\tvisible: { x: 0 },\n\thidden: { x: 0 },\n};\n\nfunction Header( {\n\tcustomSaveButton,\n\tforceIsDirty,\n\tforceDisableBlockTools,\n\tsetEntitiesSavedStatesCallback,\n\ttitle,\n} ) {\n\tconst isWideViewport = useViewportMatch( 'large' );\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst {\n\t\tisTextEditor,\n\t\tisPublishSidebarOpened,\n\t\tshowIconLabels,\n\t\thasFixedToolbar,\n\t\tisNestedEntity,\n\t\tisZoomedOutView,\n\t} = useSelect( ( select ) => {\n\t\tconst { get: getPreference } = select( preferencesStore );\n\t\tconst {\n\t\t\tgetEditorMode,\n\t\t\tgetEditorSettings,\n\t\t\tisPublishSidebarOpened: _isPublishSidebarOpened,\n\t\t} = select( editorStore );\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\n\t\treturn {\n\t\t\tisTextEditor: getEditorMode() === 'text',\n\t\t\tisPublishSidebarOpened: _isPublishSidebarOpened(),\n\t\t\tshowIconLabels: getPreference( 'core', 'showIconLabels' ),\n\t\t\thasFixedToolbar: getPreference( 'core', 'fixedToolbar' ),\n\t\t\tisNestedEntity:\n\t\t\t\t!! getEditorSettings().onNavigateToPreviousEntityRecord,\n\t\t\tisZoomedOutView: __unstableGetEditorMode() === 'zoom-out',\n\t\t};\n\t}, [] );\n\n\tconst hasTopToolbar = isLargeViewport && hasFixedToolbar;\n\n\tconst [ isBlockToolsCollapsed, setIsBlockToolsCollapsed ] =\n\t\tuseState( true );\n\n\t// The edit-post-header classname is only kept for backward compatibilty\n\t// as some plugins might be relying on its presence.\n\treturn (\n\t\t<div className=\"editor-header edit-post-header\">\n\t\t\t<motion.div\n\t\t\t\tvariants={ backButtonVariations }\n\t\t\t\ttransition={ { type: 'tween' } }\n\t\t\t>\n\t\t\t\t<BackButton.Slot />\n\t\t\t</motion.div>\n\t\t\t<motion.div\n\t\t\t\tvariants={ toolbarVariations }\n\t\t\t\tclassName=\"editor-header__toolbar\"\n\t\t\t\ttransition={ { type: 'tween' } }\n\t\t\t>\n\t\t\t\t<DocumentTools\n\t\t\t\t\tdisableBlockTools={ forceDisableBlockTools || isTextEditor }\n\t\t\t\t/>\n\t\t\t\t{ hasTopToolbar && (\n\t\t\t\t\t<CollapsableBlockToolbar\n\t\t\t\t\t\tisCollapsed={ isBlockToolsCollapsed }\n\t\t\t\t\t\tonToggle={ setIsBlockToolsCollapsed }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( 'editor-header__center', {\n\t\t\t\t\t\t'is-collapsed':\n\t\t\t\t\t\t\t! isBlockToolsCollapsed && hasTopToolbar,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ ! title ? (\n\t\t\t\t\t\t<PostTypeSupportCheck supportKeys=\"title\">\n\t\t\t\t\t\t\t<DocumentBar />\n\t\t\t\t\t\t</PostTypeSupportCheck>\n\t\t\t\t\t) : (\n\t\t\t\t\t\ttitle\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</motion.div>\n\t\t\t<motion.div\n\t\t\t\tvariants={ toolbarVariations }\n\t\t\t\ttransition={ { type: 'tween' } }\n\t\t\t\tclassName=\"editor-header__settings\"\n\t\t\t>\n\t\t\t\t{ ! customSaveButton && ! isPublishSidebarOpened && (\n\t\t\t\t\t// This button isn't completely hidden by the publish sidebar.\n\t\t\t\t\t// We can't hide the whole toolbar when the publish sidebar is open because\n\t\t\t\t\t// we want to prevent mounting/unmounting the PostPublishButtonOrToggle DOM node.\n\t\t\t\t\t// We track that DOM node to return focus to the PostPublishButtonOrToggle\n\t\t\t\t\t// when the publish sidebar has been closed.\n\t\t\t\t\t<PostSavedState forceIsDirty={ forceIsDirty } />\n\t\t\t\t) }\n\t\t\t\t<PreviewDropdown\n\t\t\t\t\tforceIsAutosaveable={ forceIsDirty }\n\t\t\t\t\tdisabled={ isNestedEntity || isZoomedOutView }\n\t\t\t\t/>\n\t\t\t\t<PostPreviewButton\n\t\t\t\t\tclassName=\"editor-header__post-preview-button\"\n\t\t\t\t\tforceIsAutosaveable={ forceIsDirty }\n\t\t\t\t/>\n\t\t\t\t<PostViewLink />\n\t\t\t\t{ ! customSaveButton && (\n\t\t\t\t\t<PostPublishButtonOrToggle\n\t\t\t\t\t\tforceIsDirty={ forceIsDirty }\n\t\t\t\t\t\tsetEntitiesSavedStatesCallback={\n\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ customSaveButton }\n\t\t\t\t{ ( isWideViewport || ! showIconLabels ) && (\n\t\t\t\t\t<PinnedItems.Slot scope=\"core\" />\n\t\t\t\t) }\n\t\t\t\t<MoreMenu />\n\t\t\t</motion.div>\n\t\t</div>\n\t);\n}\n\nexport default Header;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/inserter-sidebar/index.js

@@ -1,32 +1,35 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
 import { useDispatch, useSelect } from '@wordpress/data';
-import { __experimentalLibrary as Library, store as blockEditorStore } from '@wordpress/block-editor';
-import { useViewportMatch } from '@wordpress/compose';
+import { store as blockEditorStore, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
+import { useViewportMatch, __experimentalUseDialog as useDialog } from '@wordpress/compose';
 import { useCallback, useRef } from '@wordpress/element';
 import { store as preferencesStore } from '@wordpress/preferences';
 import { ESCAPE } from '@wordpress/keycodes';
+import { store as interfaceStore } from '@wordpress/interface';
 
 /**
  * Internal dependencies
  */
 import { unlock } from '../../lock-unlock';
 import { store as editorStore } from '../../store';
-export default function InserterSidebar({
-  closeGeneralSidebar,
-  isRightSidebarOpen
-}) {
+import { jsx as _jsx } from "react/jsx-runtime";
+const {
+  PrivateInserterLibrary
+} = unlock(blockEditorPrivateApis);
+export default function InserterSidebar() {
   const {
     blockSectionRootClientId,
     inserterSidebarToggleRef,
     insertionPoint,
-    showMostUsedBlocks
+    showMostUsedBlocks,
+    sidebarIsOpened
   } = useSelect(select => {
     const {
       getInserterSidebarToggleRef,
-      getInsertionPoint
+      getInsertionPoint,
+      isPublishSidebarOpened
     } = unlock(select(editorStore));
     const {
       getBlockRootClientId,
@@ -36,6 +39,9 @@ export default function InserterSidebar({
     const {
       get
     } = select(preferencesStore);
+    const {
+      getActiveComplementaryArea
+    } = select(interfaceStore);
     const getBlockSectionRootClientId = () => {
       if (__unstableGetEditorMode() === 'zoom-out') {
         const {
@@ -51,13 +57,21 @@ export default function InserterSidebar({
       inserterSidebarToggleRef: getInserterSidebarToggleRef(),
       insertionPoint: getInsertionPoint(),
       showMostUsedBlocks: get('core', 'mostUsedBlocks'),
-      blockSectionRootClientId: getBlockSectionRootClientId()
+      blockSectionRootClientId: getBlockSectionRootClientId(),
+      sidebarIsOpened: !!(getActiveComplementaryArea('core') || isPublishSidebarOpened())
     };
   }, []);
   const {
     setIsInserterOpened
   } = useDispatch(editorStore);
+  const {
+    disableComplementaryArea
+  } = useDispatch(interfaceStore);
   const isMobileViewport = useViewportMatch('medium', '<');
+  const [inserterDialogRef, inserterDialogProps] = useDialog({
+    onClose: () => setIsInserterOpened(false),
+    focusOnMount: true
+  });
   const libraryRef = useRef();
 
   // When closing the inserter, focus should return to the toggle button.
@@ -71,14 +85,9 @@ export default function InserterSidebar({
       closeInserterSidebar();
     }
   }, [closeInserterSidebar]);
-  return (
-    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    createElement("div", {
-      onKeyDown: closeOnEscape,
-      className: "editor-inserter-sidebar"
-    }, createElement("div", {
-      className: "editor-inserter-sidebar__content"
-    }, createElement(Library, {
+  const inserterContents = /*#__PURE__*/_jsx("div", {
+    className: "editor-inserter-sidebar__content",
+    children: /*#__PURE__*/_jsx(PrivateInserterLibrary, {
       showMostUsedBlocks: showMostUsedBlocks,
       showInserterHelpPanel: true,
       shouldFocusBlock: isMobileViewport,
@@ -87,10 +96,27 @@ export default function InserterSidebar({
       __experimentalInitialTab: insertionPoint.tab,
       __experimentalInitialCategory: insertionPoint.category,
       __experimentalFilterValue: insertionPoint.filterValue,
-      __experimentalOnPatternCategorySelection: isRightSidebarOpen ? closeGeneralSidebar : undefined,
+      onPatternCategorySelection: sidebarIsOpened ? () => disableComplementaryArea('core') : undefined,
       ref: libraryRef,
       onClose: closeInserterSidebar
-    })))
-  );
+    })
+  });
+  if (window.__experimentalEnableZoomedOutPatternsTab) {
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+      _jsx("div", {
+        onKeyDown: closeOnEscape,
+        className: "editor-inserter-sidebar",
+        children: inserterContents
+      })
+    );
+  }
+  return /*#__PURE__*/_jsx("div", {
+    ref: inserterDialogRef,
+    ...inserterDialogProps,
+    className: "editor-inserter-sidebar",
+    children: inserterContents
+  });
 }
 //# sourceMappingURL=index.js.map