@wordpress/block-editor 15.6.1-next.36001005c.0 → 15.7.0

package/build-module/components/global-styles/get-global-styles-changes.js

@@ -1,182 +0,0 @@
-import memoize from "memize";
-import { __, _n, sprintf } from "@wordpress/i18n";
-import { getBlockTypes } from "@wordpress/blocks";
-const globalStylesChangesCache = /* @__PURE__ */ new Map();
-const EMPTY_ARRAY = [];
-const translationMap = {
-  caption: __("Caption"),
-  link: __("Link"),
-  button: __("Button"),
-  heading: __("Heading"),
-  h1: __("H1"),
-  h2: __("H2"),
-  h3: __("H3"),
-  h4: __("H4"),
-  h5: __("H5"),
-  h6: __("H6"),
-  "settings.color": __("Color"),
-  "settings.typography": __("Typography"),
-  "settings.shadow": __("Shadow"),
-  "settings.layout": __("Layout"),
-  "styles.color": __("Colors"),
-  "styles.spacing": __("Spacing"),
-  "styles.background": __("Background"),
-  "styles.typography": __("Typography")
-};
-const getBlockNames = memoize(
-  () => getBlockTypes().reduce((accumulator, { name, title }) => {
-    accumulator[name] = title;
-    return accumulator;
-  }, {})
-);
-const isObject = (obj) => obj !== null && typeof obj === "object";
-function getTranslation(key) {
-  if (translationMap[key]) {
-    return translationMap[key];
-  }
-  const keyArray = key.split(".");
-  if (keyArray?.[0] === "blocks") {
-    const blockName = getBlockNames()?.[keyArray[1]];
-    return blockName || keyArray[1];
-  }
-  if (keyArray?.[0] === "elements") {
-    return translationMap[keyArray[1]] || keyArray[1];
-  }
-  return void 0;
-}
-function deepCompare(changedObject, originalObject, parentPath = "") {
-  if (!isObject(changedObject) && !isObject(originalObject)) {
-    return changedObject !== originalObject ? parentPath.split(".").slice(0, 2).join(".") : void 0;
-  }
-  changedObject = isObject(changedObject) ? changedObject : {};
-  originalObject = isObject(originalObject) ? originalObject : {};
-  const allKeys = /* @__PURE__ */ new Set([
-    ...Object.keys(changedObject),
-    ...Object.keys(originalObject)
-  ]);
-  let diffs = [];
-  for (const key of allKeys) {
-    const path = parentPath ? parentPath + "." + key : key;
-    const changedPath = deepCompare(
-      changedObject[key],
-      originalObject[key],
-      path
-    );
-    if (changedPath) {
-      diffs = diffs.concat(changedPath);
-    }
-  }
-  return diffs;
-}
-function getGlobalStylesChangelist(next, previous) {
-  const cacheKey = JSON.stringify({ next, previous });
-  if (globalStylesChangesCache.has(cacheKey)) {
-    return globalStylesChangesCache.get(cacheKey);
-  }
-  const changedValueTree = deepCompare(
-    {
-      styles: {
-        background: next?.styles?.background,
-        color: next?.styles?.color,
-        typography: next?.styles?.typography,
-        spacing: next?.styles?.spacing
-      },
-      blocks: next?.styles?.blocks,
-      elements: next?.styles?.elements,
-      settings: next?.settings
-    },
-    {
-      styles: {
-        background: previous?.styles?.background,
-        color: previous?.styles?.color,
-        typography: previous?.styles?.typography,
-        spacing: previous?.styles?.spacing
-      },
-      blocks: previous?.styles?.blocks,
-      elements: previous?.styles?.elements,
-      settings: previous?.settings
-    }
-  );
-  if (!changedValueTree.length) {
-    globalStylesChangesCache.set(cacheKey, EMPTY_ARRAY);
-    return EMPTY_ARRAY;
-  }
-  const result = [...new Set(changedValueTree)].reduce((acc, curr) => {
-    const translation = getTranslation(curr);
-    if (translation) {
-      acc.push([curr.split(".")[0], translation]);
-    }
-    return acc;
-  }, []);
-  globalStylesChangesCache.set(cacheKey, result);
-  return result;
-}
-function getGlobalStylesChanges(next, previous, options = {}) {
-  let changeList = getGlobalStylesChangelist(next, previous);
-  const changesLength = changeList.length;
-  const { maxResults } = options;
-  if (changesLength) {
-    if (!!maxResults && changesLength > maxResults) {
-      changeList = changeList.slice(0, maxResults);
-    }
-    return Object.entries(
-      changeList.reduce((acc, curr) => {
-        const group = acc[curr[0]] || [];
-        if (!group.includes(curr[1])) {
-          acc[curr[0]] = [...group, curr[1]];
-        }
-        return acc;
-      }, {})
-    ).map(([key, changeValues]) => {
-      const changeValuesLength = changeValues.length;
-      const joinedChangesValue = changeValues.join(
-        /* translators: Used between list items, there is a space after the comma. */
-        __(", ")
-        // eslint-disable-line @wordpress/i18n-no-flanking-whitespace
-      );
-      switch (key) {
-        case "blocks": {
-          return sprintf(
-            // translators: %s: a list of block names separated by a comma.
-            _n("%s block.", "%s blocks.", changeValuesLength),
-            joinedChangesValue
-          );
-        }
-        case "elements": {
-          return sprintf(
-            // translators: %s: a list of element names separated by a comma.
-            _n("%s element.", "%s elements.", changeValuesLength),
-            joinedChangesValue
-          );
-        }
-        case "settings": {
-          return sprintf(
-            // translators: %s: a list of theme.json setting labels separated by a comma.
-            __("%s settings."),
-            joinedChangesValue
-          );
-        }
-        case "styles": {
-          return sprintf(
-            // translators: %s: a list of theme.json top-level styles labels separated by a comma.
-            __("%s styles."),
-            joinedChangesValue
-          );
-        }
-        default: {
-          return sprintf(
-            // translators: %s: a list of global styles changes separated by a comma.
-            __("%s."),
-            joinedChangesValue
-          );
-        }
-      }
-    });
-  }
-  return EMPTY_ARRAY;
-}
-export {
-  getGlobalStylesChanges as default,
-  getGlobalStylesChangelist
-};
-//# sourceMappingURL=get-global-styles-changes.js.map

package/build-module/components/global-styles/get-global-styles-changes.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/components/global-styles/get-global-styles-changes.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport memoize from 'memize';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { getBlockTypes } from '@wordpress/blocks';\n\nconst globalStylesChangesCache = new Map();\nconst EMPTY_ARRAY = [];\nconst translationMap = {\n\tcaption: __( 'Caption' ),\n\tlink: __( 'Link' ),\n\tbutton: __( 'Button' ),\n\theading: __( 'Heading' ),\n\th1: __( 'H1' ),\n\th2: __( 'H2' ),\n\th3: __( 'H3' ),\n\th4: __( 'H4' ),\n\th5: __( 'H5' ),\n\th6: __( 'H6' ),\n\t'settings.color': __( 'Color' ),\n\t'settings.typography': __( 'Typography' ),\n\t'settings.shadow': __( 'Shadow' ),\n\t'settings.layout': __( 'Layout' ),\n\t'styles.color': __( 'Colors' ),\n\t'styles.spacing': __( 'Spacing' ),\n\t'styles.background': __( 'Background' ),\n\t'styles.typography': __( 'Typography' ),\n};\nconst getBlockNames = memoize( () =>\n\tgetBlockTypes().reduce( ( accumulator, { name, title } ) => {\n\t\taccumulator[ name ] = title;\n\t\treturn accumulator;\n\t}, {} )\n);\nconst isObject = ( obj ) => obj !== null && typeof obj === 'object';\n\n/**\n * Get the translation for a given global styles key.\n * @param {string} key A key representing a path to a global style property or setting.\n * @return {string|undefined}                A translated key or undefined if no translation exists.\n */\nfunction getTranslation( key ) {\n\tif ( translationMap[ key ] ) {\n\t\treturn translationMap[ key ];\n\t}\n\n\tconst keyArray = key.split( '.' );\n\n\tif ( keyArray?.[ 0 ] === 'blocks' ) {\n\t\tconst blockName = getBlockNames()?.[ keyArray[ 1 ] ];\n\t\treturn blockName || keyArray[ 1 ];\n\t}\n\n\tif ( keyArray?.[ 0 ] === 'elements' ) {\n\t\treturn translationMap[ keyArray[ 1 ] ] || keyArray[ 1 ];\n\t}\n\n\treturn undefined;\n}\n\n/**\n * A deep comparison of two objects, optimized for comparing global styles.\n * @param {Object} changedObject  The changed object to compare.\n * @param {Object} originalObject The original object to compare against.\n * @param {string} parentPath     A key/value pair object of block names and their rendered titles.\n * @return {string[]}             An array of paths whose values have changed.\n */\nfunction deepCompare( changedObject, originalObject, parentPath = '' ) {\n\t// We have two non-object values to compare.\n\tif ( ! isObject( changedObject ) && ! isObject( originalObject ) ) {\n\t\t/*\n\t\t * Only return a path if the value has changed.\n\t\t * And then only the path name up to 2 levels deep.\n\t\t */\n\t\treturn changedObject !== originalObject\n\t\t\t? parentPath.split( '.' ).slice( 0, 2 ).join( '.' )\n\t\t\t: undefined;\n\t}\n\n\t// Enable comparison when an object doesn't have a corresponding property to compare.\n\tchangedObject = isObject( changedObject ) ? changedObject : {};\n\toriginalObject = isObject( originalObject ) ? originalObject : {};\n\n\tconst allKeys = new Set( [\n\t\t...Object.keys( changedObject ),\n\t\t...Object.keys( originalObject ),\n\t] );\n\n\tlet diffs = [];\n\tfor ( const key of allKeys ) {\n\t\tconst path = parentPath ? parentPath + '.' + key : key;\n\t\tconst changedPath = deepCompare(\n\t\t\tchangedObject[ key ],\n\t\t\toriginalObject[ key ],\n\t\t\tpath\n\t\t);\n\t\tif ( changedPath ) {\n\t\t\tdiffs = diffs.concat( changedPath );\n\t\t}\n\t}\n\treturn diffs;\n}\n\n/**\n * Returns an array of translated summarized global styles changes.\n * Results are cached using a Map() key of `JSON.stringify( { next, previous } )`.\n *\n * @param {Object} next     The changed object to compare.\n * @param {Object} previous The original object to compare against.\n * @return {Array[]}        A 2-dimensional array of tuples: [ \"group\", \"translated change\" ].\n */\nexport function getGlobalStylesChangelist( next, previous ) {\n\tconst cacheKey = JSON.stringify( { next, previous } );\n\n\tif ( globalStylesChangesCache.has( cacheKey ) ) {\n\t\treturn globalStylesChangesCache.get( cacheKey );\n\t}\n\n\t/*\n\t * Compare the two changesets with normalized keys.\n\t * The order of these keys determines the order in which\n\t * they'll appear in the results.\n\t */\n\tconst changedValueTree = deepCompare(\n\t\t{\n\t\t\tstyles: {\n\t\t\t\tbackground: next?.styles?.background,\n\t\t\t\tcolor: next?.styles?.color,\n\t\t\t\ttypography: next?.styles?.typography,\n\t\t\t\tspacing: next?.styles?.spacing,\n\t\t\t},\n\t\t\tblocks: next?.styles?.blocks,\n\t\t\telements: next?.styles?.elements,\n\t\t\tsettings: next?.settings,\n\t\t},\n\t\t{\n\t\t\tstyles: {\n\t\t\t\tbackground: previous?.styles?.background,\n\t\t\t\tcolor: previous?.styles?.color,\n\t\t\t\ttypography: previous?.styles?.typography,\n\t\t\t\tspacing: previous?.styles?.spacing,\n\t\t\t},\n\t\t\tblocks: previous?.styles?.blocks,\n\t\t\telements: previous?.styles?.elements,\n\t\t\tsettings: previous?.settings,\n\t\t}\n\t);\n\n\tif ( ! changedValueTree.length ) {\n\t\tglobalStylesChangesCache.set( cacheKey, EMPTY_ARRAY );\n\t\treturn EMPTY_ARRAY;\n\t}\n\n\t// Remove duplicate results.\n\tconst result = [ ...new Set( changedValueTree ) ]\n\t\t/*\n\t\t * Translate the keys.\n\t\t * Remove empty translations.\n\t\t */\n\t\t.reduce( ( acc, curr ) => {\n\t\t\tconst translation = getTranslation( curr );\n\t\t\tif ( translation ) {\n\t\t\t\tacc.push( [ curr.split( '.' )[ 0 ], translation ] );\n\t\t\t}\n\t\t\treturn acc;\n\t\t}, [] );\n\n\tglobalStylesChangesCache.set( cacheKey, result );\n\n\treturn result;\n}\n\n/**\n * From a getGlobalStylesChangelist() result, returns an array of translated global styles changes, grouped by type.\n * The types are 'blocks', 'elements', 'settings', and 'styles'.\n *\n * @param {Object}              next     The changed object to compare.\n * @param {Object}              previous The original object to compare against.\n * @param {{maxResults:number}} options  Options. maxResults: results to return before truncating.\n * @return {string[]}                    An array of translated changes.\n */\nexport default function getGlobalStylesChanges( next, previous, options = {} ) {\n\tlet changeList = getGlobalStylesChangelist( next, previous );\n\tconst changesLength = changeList.length;\n\tconst { maxResults } = options;\n\n\tif ( changesLength ) {\n\t\t// Truncate to `n` results if necessary.\n\t\tif ( !! maxResults && changesLength > maxResults ) {\n\t\t\tchangeList = changeList.slice( 0, maxResults );\n\t\t}\n\t\treturn Object.entries(\n\t\t\tchangeList.reduce( ( acc, curr ) => {\n\t\t\t\tconst group = acc[ curr[ 0 ] ] || [];\n\t\t\t\tif ( ! group.includes( curr[ 1 ] ) ) {\n\t\t\t\t\tacc[ curr[ 0 ] ] = [ ...group, curr[ 1 ] ];\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t}, {} )\n\t\t).map( ( [ key, changeValues ] ) => {\n\t\t\tconst changeValuesLength = changeValues.length;\n\t\t\tconst joinedChangesValue = changeValues.join(\n\t\t\t\t/* translators: Used between list items, there is a space after the comma. */\n\t\t\t\t__( ', ' ) // eslint-disable-line @wordpress/i18n-no-flanking-whitespace\n\t\t\t);\n\t\t\tswitch ( key ) {\n\t\t\t\tcase 'blocks': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of block names separated by a comma.\n\t\t\t\t\t\t_n( '%s block.', '%s blocks.', changeValuesLength ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tcase 'elements': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of element names separated by a comma.\n\t\t\t\t\t\t_n( '%s element.', '%s elements.', changeValuesLength ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tcase 'settings': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of theme.json setting labels separated by a comma.\n\t\t\t\t\t\t__( '%s settings.' ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tcase 'styles': {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of theme.json top-level styles labels separated by a comma.\n\t\t\t\t\t\t__( '%s styles.' ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tdefault: {\n\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t// translators: %s: a list of global styles changes separated by a comma.\n\t\t\t\t\t\t__( '%s.' ),\n\t\t\t\t\t\tjoinedChangesValue\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t}\n\n\treturn EMPTY_ARRAY;\n}\n"],
-  "mappings": "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",
-  "names": []
-}

package/src/components/global-styles/README.md

@@ -1,190 +0,0 @@
-# Global Styles
-
-This folder contains all the necessary APIs to manipulate the global styles data. It can be potentially extracted to its own package.
-
-# Available public APIs
-
-## useGlobalStylesReset
-
-A React hook used to retrieve whether the Global Styles have been edited and a callback to reset to the default theme values.
-
-```js
-import { useGlobalStylesReset } from '@wordpress/block-editor';
-
-function MyComponent() {
-	const [ canReset, reset ] = useGlobalStylesReset();
-
-	return canReset ? <Button onClick={ () => reset() }>Reset</Button> : null;
-}
-```
-
-## useGlobalStylesOutput
-
-A React hook used to retrieve the styles array and settings to provide for block editor instances based on the current global styles.
-
-```js
-import {
-	useGlobalStylesOutput,
-	BlockEditorProvider,
-	BlockList,
-} from '@wordpress/block-editor';
-
-function MyComponent() {
-	const [ styles, settings ] = useGlobalStylesOutput();
-
-	return (
-		<BlockEditorProvider
-			settings={ {
-				styles,
-				__experimentalFeatures: settings,
-			} }
-		>
-			<BlockList />
-		</BlockEditorProvider>
-	);
-}
-```
-
-## useGlobalStyle
-
-A react hook used to retrieve the style applied to a given context.
-
-```js
-import { useGlobalStyle } from '@wordpress/block-editor';
-
-function MyComponent() {
-	// Text color for the site root.
-	const [ color, setColor ] = useGlobalStyle( 'color.text' );
-
-	// The user modified color for the core paragraph block.
-	const [ pColor, setPColor ] = useGlobalStyle(
-		'color.text',
-		'core/paragraph',
-		'user'
-	);
-
-	return 'Something';
-}
-```
-
-## useGlobalSetting
-
-A react hook used to retrieve the setting applied to a given context.
-
-```js
-import { useGlobalSetting } from '@wordpress/block-editor';
-
-function MyComponent() {
-	// The theme color palette.
-	const [ colorPalette, setColorPalette ] = useGlobalSetting(
-		'color.palette.theme'
-	);
-
-	// The theme color palette for the paragraph block, ignoring user changes.
-	// If the palette is not defined for the paragraph block, the root one is returned.
-	const [ pColor, setPColor ] = useGlobalSetting(
-		'color.palette.theme',
-		'core/paragraph',
-		'base'
-	);
-
-	return 'Something';
-}
-```
-
-## UI Components
-
-The global styles folder also offers a set of reusable UI components. These components follow a strict set of guidelines:
-
--   They are independent of any context or any store dependency. They only rely on the props passed to them.
--   They receive a similar set of props:
-
-    -   `value`: The value is a style object that maps closely the format used in `theme.json` and is also very close to the format of the `style` attributes for blocks. There are some differences with the block attributes due to the iteration process and the fact that we need to maintain compatibility with the existing blocks even if they predate the introduction of Global Styles and these UI components. An example value for a style object is:
-
-```js
-{
-	color: {
-		text: 'var:preset|color|blue',
-		background: '#FF0000',
-	},
-	typography: {
-		fontFamily: 'var:preset|font-family|base',
-		fontSize: '10px',
-		lineHeight: 1.5,
-	},
-	spacing: {
-		padding: 'var:preset|spacing|medium',
-	},
-	elements: {
-		link: {
-			color: {
-			text: 'var:preset|color|green',
-			},
-		},
-	},
-}
-```
-
--   `onChange`: A callback that receives the new value and is called when the user changes the value of the UI component.
--   `inheritedValue`: The inherited value is a style object that represents the combined value of the style inherited from the parent context in addition to the style applied to the current context. The format is the same as the `value` prop.
--   `settings`: The settings are the theme.json settings. They are used to provide the UI components with the necessary information to render the UI. An example value for the settings is:
-
-```js
-{
-	color: {
-		palette: {
-			custom: [
-				{
-					slug: 'black',
-					color: '#000000',
-				},
-				{
-					slug: 'white',
-					color: '#FFFFFF',
-				},
-				{
-					slug: 'blue',
-					color: '#0000FF',
-				},
-			]
-		},
-		gradients: {
-			custom: [
-				{
-					slug: 'gradient-1',
-					gradient: 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)',
-				},
-				{
-					slug: 'gradient-2',
-					gradient: 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)',
-				},
-			]
-		},
-	},
-	typography: {
-		fontSizes: [
-			{
-				slug: 'small',
-				size: '12px',
-			},
-			{
-				slug: 'medium',
-				size: '16px',
-			},
-			{
-				slug: 'large',
-				size: '24px',
-			},
-		],
-	}
-}
-```
--   `defaultControls`: The default controls are the controls that are used by default to render the UI. They are used to provide the UI components with the necessary information to render the UI. An example value for the default controls for the `ColorPanel` component is:
-
-```js
-{
-	background: true,
-	text: true,
-	link: true,
-},
-```

package/src/components/global-styles/context.js

@@ -1,16 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { createContext } from '@wordpress/element';
-
-export const DEFAULT_GLOBAL_STYLES_CONTEXT = {
-	user: {},
-	base: {},
-	merged: {},
-	setUserConfig: () => {},
-};
-
-export const GlobalStylesContext = createContext(
-	DEFAULT_GLOBAL_STYLES_CONTEXT
-);
-GlobalStylesContext.displayName = 'GlobalStylesContext';

package/src/components/global-styles/get-global-styles-changes.js

@@ -1,252 +0,0 @@
-/**
- * External dependencies
- */
-import memoize from 'memize';
-
-/**
- * WordPress dependencies
- */
-import { __, _n, sprintf } from '@wordpress/i18n';
-import { getBlockTypes } from '@wordpress/blocks';
-
-const globalStylesChangesCache = new Map();
-const EMPTY_ARRAY = [];
-const translationMap = {
-	caption: __( 'Caption' ),
-	link: __( 'Link' ),
-	button: __( 'Button' ),
-	heading: __( 'Heading' ),
-	h1: __( 'H1' ),
-	h2: __( 'H2' ),
-	h3: __( 'H3' ),
-	h4: __( 'H4' ),
-	h5: __( 'H5' ),
-	h6: __( 'H6' ),
-	'settings.color': __( 'Color' ),
-	'settings.typography': __( 'Typography' ),
-	'settings.shadow': __( 'Shadow' ),
-	'settings.layout': __( 'Layout' ),
-	'styles.color': __( 'Colors' ),
-	'styles.spacing': __( 'Spacing' ),
-	'styles.background': __( 'Background' ),
-	'styles.typography': __( 'Typography' ),
-};
-const getBlockNames = memoize( () =>
-	getBlockTypes().reduce( ( accumulator, { name, title } ) => {
-		accumulator[ name ] = title;
-		return accumulator;
-	}, {} )
-);
-const isObject = ( obj ) => obj !== null && typeof obj === 'object';
-
-/**
- * Get the translation for a given global styles key.
- * @param {string} key A key representing a path to a global style property or setting.
- * @return {string|undefined}                A translated key or undefined if no translation exists.
- */
-function getTranslation( key ) {
-	if ( translationMap[ key ] ) {
-		return translationMap[ key ];
-	}
-
-	const keyArray = key.split( '.' );
-
-	if ( keyArray?.[ 0 ] === 'blocks' ) {
-		const blockName = getBlockNames()?.[ keyArray[ 1 ] ];
-		return blockName || keyArray[ 1 ];
-	}
-
-	if ( keyArray?.[ 0 ] === 'elements' ) {
-		return translationMap[ keyArray[ 1 ] ] || keyArray[ 1 ];
-	}
-
-	return undefined;
-}
-
-/**
- * A deep comparison of two objects, optimized for comparing global styles.
- * @param {Object} changedObject  The changed object to compare.
- * @param {Object} originalObject The original object to compare against.
- * @param {string} parentPath     A key/value pair object of block names and their rendered titles.
- * @return {string[]}             An array of paths whose values have changed.
- */
-function deepCompare( changedObject, originalObject, parentPath = '' ) {
-	// We have two non-object values to compare.
-	if ( ! isObject( changedObject ) && ! isObject( originalObject ) ) {
-		/*
-		 * Only return a path if the value has changed.
-		 * And then only the path name up to 2 levels deep.
-		 */
-		return changedObject !== originalObject
-			? parentPath.split( '.' ).slice( 0, 2 ).join( '.' )
-			: undefined;
-	}
-
-	// Enable comparison when an object doesn't have a corresponding property to compare.
-	changedObject = isObject( changedObject ) ? changedObject : {};
-	originalObject = isObject( originalObject ) ? originalObject : {};
-
-	const allKeys = new Set( [
-		...Object.keys( changedObject ),
-		...Object.keys( originalObject ),
-	] );
-
-	let diffs = [];
-	for ( const key of allKeys ) {
-		const path = parentPath ? parentPath + '.' + key : key;
-		const changedPath = deepCompare(
-			changedObject[ key ],
-			originalObject[ key ],
-			path
-		);
-		if ( changedPath ) {
-			diffs = diffs.concat( changedPath );
-		}
-	}
-	return diffs;
-}
-
-/**
- * Returns an array of translated summarized global styles changes.
- * Results are cached using a Map() key of `JSON.stringify( { next, previous } )`.
- *
- * @param {Object} next     The changed object to compare.
- * @param {Object} previous The original object to compare against.
- * @return {Array[]}        A 2-dimensional array of tuples: [ "group", "translated change" ].
- */
-export function getGlobalStylesChangelist( next, previous ) {
-	const cacheKey = JSON.stringify( { next, previous } );
-
-	if ( globalStylesChangesCache.has( cacheKey ) ) {
-		return globalStylesChangesCache.get( cacheKey );
-	}
-
-	/*
-	 * Compare the two changesets with normalized keys.
-	 * The order of these keys determines the order in which
-	 * they'll appear in the results.
-	 */
-	const changedValueTree = deepCompare(
-		{
-			styles: {
-				background: next?.styles?.background,
-				color: next?.styles?.color,
-				typography: next?.styles?.typography,
-				spacing: next?.styles?.spacing,
-			},
-			blocks: next?.styles?.blocks,
-			elements: next?.styles?.elements,
-			settings: next?.settings,
-		},
-		{
-			styles: {
-				background: previous?.styles?.background,
-				color: previous?.styles?.color,
-				typography: previous?.styles?.typography,
-				spacing: previous?.styles?.spacing,
-			},
-			blocks: previous?.styles?.blocks,
-			elements: previous?.styles?.elements,
-			settings: previous?.settings,
-		}
-	);
-
-	if ( ! changedValueTree.length ) {
-		globalStylesChangesCache.set( cacheKey, EMPTY_ARRAY );
-		return EMPTY_ARRAY;
-	}
-
-	// Remove duplicate results.
-	const result = [ ...new Set( changedValueTree ) ]
-		/*
-		 * Translate the keys.
-		 * Remove empty translations.
-		 */
-		.reduce( ( acc, curr ) => {
-			const translation = getTranslation( curr );
-			if ( translation ) {
-				acc.push( [ curr.split( '.' )[ 0 ], translation ] );
-			}
-			return acc;
-		}, [] );
-
-	globalStylesChangesCache.set( cacheKey, result );
-
-	return result;
-}
-
-/**
- * From a getGlobalStylesChangelist() result, returns an array of translated global styles changes, grouped by type.
- * The types are 'blocks', 'elements', 'settings', and 'styles'.
- *
- * @param {Object}              next     The changed object to compare.
- * @param {Object}              previous The original object to compare against.
- * @param {{maxResults:number}} options  Options. maxResults: results to return before truncating.
- * @return {string[]}                    An array of translated changes.
- */
-export default function getGlobalStylesChanges( next, previous, options = {} ) {
-	let changeList = getGlobalStylesChangelist( next, previous );
-	const changesLength = changeList.length;
-	const { maxResults } = options;
-
-	if ( changesLength ) {
-		// Truncate to `n` results if necessary.
-		if ( !! maxResults && changesLength > maxResults ) {
-			changeList = changeList.slice( 0, maxResults );
-		}
-		return Object.entries(
-			changeList.reduce( ( acc, curr ) => {
-				const group = acc[ curr[ 0 ] ] || [];
-				if ( ! group.includes( curr[ 1 ] ) ) {
-					acc[ curr[ 0 ] ] = [ ...group, curr[ 1 ] ];
-				}
-				return acc;
-			}, {} )
-		).map( ( [ key, changeValues ] ) => {
-			const changeValuesLength = changeValues.length;
-			const joinedChangesValue = changeValues.join(
-				/* translators: Used between list items, there is a space after the comma. */
-				__( ', ' ) // eslint-disable-line @wordpress/i18n-no-flanking-whitespace
-			);
-			switch ( key ) {
-				case 'blocks': {
-					return sprintf(
-						// translators: %s: a list of block names separated by a comma.
-						_n( '%s block.', '%s blocks.', changeValuesLength ),
-						joinedChangesValue
-					);
-				}
-				case 'elements': {
-					return sprintf(
-						// translators: %s: a list of element names separated by a comma.
-						_n( '%s element.', '%s elements.', changeValuesLength ),
-						joinedChangesValue
-					);
-				}
-				case 'settings': {
-					return sprintf(
-						// translators: %s: a list of theme.json setting labels separated by a comma.
-						__( '%s settings.' ),
-						joinedChangesValue
-					);
-				}
-				case 'styles': {
-					return sprintf(
-						// translators: %s: a list of theme.json top-level styles labels separated by a comma.
-						__( '%s styles.' ),
-						joinedChangesValue
-					);
-				}
-				default: {
-					return sprintf(
-						// translators: %s: a list of global styles changes separated by a comma.
-						__( '%s.' ),
-						joinedChangesValue
-					);
-				}
-			}
-		} );
-	}
-
-	return EMPTY_ARRAY;
-}