@wordpress/edit-site 6.33.3-next.36001005c.0 → 6.34.0

package/src/hooks/use-theme-style-variations/test/use-theme-style-variations-by-property.js

@@ -1,271 +0,0 @@
-/**
- * Internal dependencies
- */
-import {
-	filterObjectByProperties,
-	removePropertiesFromObject,
-} from '../use-theme-style-variations-by-property';
-
-describe( 'filterObjectByProperties', () => {
-	const noop = () => {};
-	test.each( [
-		{
-			object: {
-				foo: 'bar',
-				array: [ 1, 3, 4 ],
-			},
-			properties: [ 'array' ],
-			expected: { array: [ 1, 3, 4 ] },
-		},
-		{
-			object: {
-				foo: 'bar',
-			},
-			properties: [ 'does-not-exist' ],
-			expected: {},
-		},
-		{
-			object: {
-				foo: 'bar',
-			},
-			properties: false,
-			expected: {},
-		},
-		{
-			object: {
-				dig: {
-					deeper: {
-						null: null,
-					},
-				},
-			},
-			properties: [ 'null' ],
-			expected: {
-				dig: {
-					deeper: {
-						null: null,
-					},
-				},
-			},
-		},
-		{
-			object: {
-				function: noop,
-			},
-			properties: [ 'function' ],
-			expected: {
-				function: noop,
-			},
-		},
-		{
-			object: [],
-			properties: [ 'something' ],
-			expected: {},
-		},
-		{
-			object: {},
-			properties: undefined,
-			expected: {},
-		},
-		{
-			object: {
-				'nested-object': {
-					'nested-object-foo': 'bar',
-					array: [ 1, 3, 4 ],
-				},
-			},
-			properties: [ 'nested-object-foo' ],
-			expected: {
-				'nested-object': {
-					'nested-object-foo': 'bar',
-				},
-			},
-		},
-	] )(
-		'should filter object by $properties',
-		( { expected, object, properties } ) => {
-			const result = filterObjectByProperties( object, properties );
-			expect( result ).toEqual( expected );
-		}
-	);
-} );
-
-describe( 'removePropertiesFromObject', () => {
-	const mockBaseVariation = {
-		settings: {
-			typography: {
-				fontFamilies: {
-					custom: [
-						{
-							name: 'ADLaM Display',
-							fontFamily: 'ADLaM Display, system-ui',
-							slug: 'adlam-display',
-							fontFace: [
-								{
-									src: 'adlam.woff2',
-									fontWeight: '400',
-									fontStyle: 'normal',
-									fontFamily: 'ADLaM Display',
-								},
-							],
-						},
-					],
-				},
-				fontSizes: [
-					{
-						name: 'Base small',
-						slug: 'base-small',
-						size: '1px',
-					},
-					{
-						name: 'Base medium',
-						slug: 'base-medium',
-						size: '2px',
-					},
-					{
-						name: 'Base large',
-						slug: 'base-large',
-						size: '3px',
-					},
-				],
-			},
-			color: {
-				palette: {
-					custom: [
-						{
-							color: '#c42727',
-							name: 'Color 1',
-							slug: 'custom-color-1',
-						},
-						{
-							color: '#3b0f0f',
-							name: 'Color 2',
-							slug: 'custom-color-2',
-						},
-					],
-				},
-			},
-			layout: {
-				wideSize: '1137px',
-				contentSize: '400px',
-			},
-		},
-		styles: {
-			typography: {
-				fontSize: '12px',
-				lineHeight: '1.5',
-			},
-			color: {
-				backgroundColor: 'cheese',
-				color: 'lettuce',
-			},
-			elements: {
-				cite: {
-					color: {
-						text: 'white',
-					},
-					typography: {
-						letterSpacing: 'white',
-					},
-				},
-			},
-			blocks: {
-				'core/quote': {
-					color: {
-						text: 'hello',
-						background: 'dolly',
-					},
-					typography: {
-						fontSize: '111111px',
-					},
-				},
-				'core/group': {
-					typography: {
-						fontFamily: 'var:preset|font-family|system-sans-serif',
-					},
-				},
-			},
-		},
-	};
-
-	it( 'should return with no properties', () => {
-		const object = { test: 'me' };
-		expect( removePropertiesFromObject( object, undefined ) ).toEqual(
-			object
-		);
-	} );
-
-	it( 'should return with non-string properties', () => {
-		const object = { test: 'you' };
-		expect( removePropertiesFromObject( object, true ) ).toEqual( object );
-	} );
-
-	it( 'should return with empty object', () => {
-		const object = {};
-		expect( removePropertiesFromObject( object, [ 'color' ] ) ).toEqual(
-			object
-		);
-	} );
-
-	it( 'should return with null', () => {
-		expect( removePropertiesFromObject( null, [ 'color' ] ) ).toEqual(
-			null
-		);
-	} );
-
-	it( 'should remove the specified properties from the object', () => {
-		expect(
-			removePropertiesFromObject(
-				{
-					...mockBaseVariation,
-				},
-				[ 'typography' ]
-			)
-		).toEqual( {
-			settings: {
-				color: {
-					palette: {
-						custom: [
-							{
-								color: '#c42727',
-								name: 'Color 1',
-								slug: 'custom-color-1',
-							},
-							{
-								color: '#3b0f0f',
-								name: 'Color 2',
-								slug: 'custom-color-2',
-							},
-						],
-					},
-				},
-				layout: {
-					wideSize: '1137px',
-					contentSize: '400px',
-				},
-			},
-			styles: {
-				color: {
-					backgroundColor: 'cheese',
-					color: 'lettuce',
-				},
-				elements: {
-					cite: {
-						color: {
-							text: 'white',
-						},
-					},
-				},
-				blocks: {
-					'core/quote': {
-						color: {
-							text: 'hello',
-							background: 'dolly',
-						},
-					},
-					'core/group': {},
-				},
-			},
-		} );
-	} );
-} );

package/src/hooks/use-theme-style-variations/use-theme-style-variations-by-property.js

@@ -1,175 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { useSelect } from '@wordpress/data';
-import { store as coreStore } from '@wordpress/core-data';
-import { useContext, useMemo } from '@wordpress/element';
-import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
-import { privateApis as editorPrivateApis } from '@wordpress/editor';
-import { __ } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../lock-unlock';
-
-const EMPTY_ARRAY = [];
-const { GlobalStylesContext, areGlobalStyleConfigsEqual } = unlock(
-	blockEditorPrivateApis
-);
-const { mergeBaseAndUserConfigs } = unlock( editorPrivateApis );
-
-/**
- * Removes all instances of properties from an object.
- *
- * @param {Object}   object     The object to remove the properties from.
- * @param {string[]} properties The properties to remove.
- * @return {Object} The modified object.
- */
-export function removePropertiesFromObject( object, properties ) {
-	if ( ! properties?.length ) {
-		return object;
-	}
-
-	if (
-		typeof object !== 'object' ||
-		! object ||
-		! Object.keys( object ).length
-	) {
-		return object;
-	}
-
-	for ( const key in object ) {
-		if ( properties.includes( key ) ) {
-			delete object[ key ];
-		} else if ( typeof object[ key ] === 'object' ) {
-			removePropertiesFromObject( object[ key ], properties );
-		}
-	}
-	return object;
-}
-
-/**
- * Checks whether a style variation is empty.
- *
- * @param {Object} variation          A style variation object.
- * @param {string} variation.title    The title of the variation.
- * @param {Object} variation.settings The settings of the variation.
- * @param {Object} variation.styles   The styles of the variation.
- * @return {boolean} Whether the variation is empty.
- */
-function hasThemeVariation( { title, settings, styles } ) {
-	return (
-		title === __( 'Default' ) || // Always preserve the default variation.
-		Object.keys( settings ).length > 0 ||
-		Object.keys( styles ).length > 0
-	);
-}
-
-/**
- * Fetches the current theme style variations that contain only the specified properties
- * and merges them with the user config.
- *
- * @param {string[]} properties The properties to filter by.
- * @return {Object[]|*} The merged object.
- */
-export function useCurrentMergeThemeStyleVariationsWithUserConfig(
-	properties = []
-) {
-	const { variationsFromTheme } = useSelect( ( select ) => {
-		const _variationsFromTheme =
-			select(
-				coreStore
-			).__experimentalGetCurrentThemeGlobalStylesVariations();
-
-		return {
-			variationsFromTheme: _variationsFromTheme || EMPTY_ARRAY,
-		};
-	}, [] );
-	const { user: userVariation } = useContext( GlobalStylesContext );
-
-	const propertiesAsString = properties.toString();
-
-	return useMemo( () => {
-		const clonedUserVariation = structuredClone( userVariation );
-
-		// Get user variation and remove the settings for the given property.
-		const userVariationWithoutProperties = removePropertiesFromObject(
-			clonedUserVariation,
-			properties
-		);
-		userVariationWithoutProperties.title = __( 'Default' );
-
-		const variationsWithPropertiesAndBase = variationsFromTheme
-			.filter( ( variation ) => {
-				return isVariationWithProperties( variation, properties );
-			} )
-			.map( ( variation ) => {
-				return mergeBaseAndUserConfigs(
-					userVariationWithoutProperties,
-					variation
-				);
-			} );
-
-		const variationsByProperties = [
-			userVariationWithoutProperties,
-			...variationsWithPropertiesAndBase,
-		];
-
-		/*
-		 * Filter out variations with no settings or styles.
-		 */
-		return variationsByProperties?.length
-			? variationsByProperties.filter( hasThemeVariation )
-			: [];
-	}, [ propertiesAsString, userVariation, variationsFromTheme ] );
-}
-
-/**
- * Returns a new object, with properties specified in `properties` array.,
- * maintain the original object tree structure.
- * The function is recursive, so it will perform a deep search for the given properties.
- * E.g., the function will return `{ a: { b: { c: { test: 1 } } } }` if the properties are  `[ 'test' ]`.
- *
- * @param {Object}   object     The object to filter
- * @param {string[]} properties The properties to filter by
- * @return {Object} The merged object.
- */
-export const filterObjectByProperties = ( object, properties ) => {
-	if ( ! object || ! properties?.length ) {
-		return {};
-	}
-
-	const newObject = {};
-	Object.keys( object ).forEach( ( key ) => {
-		if ( properties.includes( key ) ) {
-			newObject[ key ] = object[ key ];
-		} else if ( typeof object[ key ] === 'object' ) {
-			const newFilter = filterObjectByProperties(
-				object[ key ],
-				properties
-			);
-			if ( Object.keys( newFilter ).length ) {
-				newObject[ key ] = newFilter;
-			}
-		}
-	} );
-	return newObject;
-};
-
-/**
- * Compares a style variation to the same variation filtered by the specified properties.
- * Returns true if the variation contains only the properties specified.
- *
- * @param {Object}   variation  The variation to compare.
- * @param {string[]} properties The properties to compare.
- * @return {boolean} Whether the variation contains only the specified properties.
- */
-export function isVariationWithProperties( variation, properties ) {
-	const variationWithProperties = filterObjectByProperties(
-		structuredClone( variation ),
-		properties
-	);
-
-	return areGlobalStyleConfigsEqual( variationWithProperties, variation );
-}

package/src/utils/set-nested-value.js

@@ -1,39 +0,0 @@
-/**
- * Sets the value at path of object.
- * If a portion of path doesn’t exist, it’s created.
- * Arrays are created for missing index properties while objects are created
- * for all other missing properties.
- *
- * This function intentionally mutates the input object.
- *
- * Inspired by _.set().
- *
- * @see https://lodash.com/docs/4.17.15#set
- *
- * @todo Needs to be deduplicated with its copy in `@wordpress/core-data`.
- *
- * @param {Object} object Object to modify
- * @param {Array}  path   Path of the property to set.
- * @param {*}      value  Value to set.
- */
-export default function setNestedValue( object, path, value ) {
-	if ( ! object || typeof object !== 'object' ) {
-		return object;
-	}
-
-	path.reduce( ( acc, key, idx ) => {
-		if ( acc[ key ] === undefined ) {
-			if ( Number.isInteger( path[ idx + 1 ] ) ) {
-				acc[ key ] = [];
-			} else {
-				acc[ key ] = {};
-			}
-		}
-		if ( idx === path.length - 1 ) {
-			acc[ key ] = value;
-		}
-		return acc[ key ];
-	}, object );
-
-	return object;
-}