From e13b192c7e637db7d64f226318f9b77c5e901f40 Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Tue, 26 Mar 2024 18:00:09 +0000 Subject: [PATCH 1/2] Global Styles: Filter out color and typography variations Update packages/edit-site/src/components/global-styles/style-variations-container.js Co-authored-by: Andrei Draganescu Update packages/edit-site/src/components/global-styles/style-variations-container.js Co-authored-by: Andrei Draganescu update function name remove variations which are empty once the property has been filtered out move to a reduce function remove duplicate values Global Styles: Don't filter out variations where the heading and body fonts are the sane --- .../src/components/global-styles/hooks.js | 46 ++++--------------- 1 file changed, 10 insertions(+), 36 deletions(-) diff --git a/packages/edit-site/src/components/global-styles/hooks.js b/packages/edit-site/src/components/global-styles/hooks.js index 50032786e39942..f8893eeba1f19d 100644 --- a/packages/edit-site/src/components/global-styles/hooks.js +++ b/packages/edit-site/src/components/global-styles/hooks.js @@ -10,21 +10,16 @@ import a11yPlugin from 'colord/plugins/a11y'; import { store as blocksStore } from '@wordpress/blocks'; import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; import { privateApis as editorPrivateApis } from '@wordpress/editor'; -import { useContext } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** * Internal dependencies */ import { useCurrentMergeThemeStyleVariationsWithUserConfig } from '../../hooks/use-theme-style-variations/use-theme-style-variations-by-property'; -import { getFontFamilies } from './utils'; import { unlock } from '../../lock-unlock'; import { useSelect } from '@wordpress/data'; -const { mergeBaseAndUserConfigs } = unlock( editorPrivateApis ); -const { useGlobalSetting, useGlobalStyle, GlobalStylesContext } = unlock( - blockEditorPrivateApis -); +const { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis ); // Enable colord's a11y plugin. extend( [ a11yPlugin ] ); @@ -142,38 +137,17 @@ export function useTypographyVariations() { useCurrentMergeThemeStyleVariationsWithUserConfig( { property: 'typography', } ); - - const { base } = useContext( GlobalStylesContext ); /* - * Filter duplicate variations based on whether the variaitons - * have different heading and body font families. + * Filter out variations with no settings or styles. */ return typographyVariations?.length - ? Object.values( - typographyVariations.reduce( ( acc, variation ) => { - const [ bodyFontFamily, headingFontFamily ] = - getFontFamilies( - mergeBaseAndUserConfigs( base, variation ) - ); - - // Always preseve the default variation. - if ( variation?.title === 'Default' ) { - acc[ - `${ headingFontFamily?.name }:${ bodyFontFamily?.name }` - ] = variation; - } else if ( - headingFontFamily?.name && - bodyFontFamily?.name && - ! acc[ - `${ headingFontFamily?.name }:${ bodyFontFamily?.name }` - ] - ) { - acc[ - `${ headingFontFamily?.name }:${ bodyFontFamily?.name }` - ] = variation; - } - return acc; - }, {} ) - ) + ? typographyVariations.filter( ( variation ) => { + const { settings, styles, title } = variation; + return ( + title === __( 'Default' ) || // Always preseve the default variation. + Object.keys( settings ).length > 0 || + Object.keys( styles ).length > 0 + ); + } ) : []; } From f8ce6a67c86a6e3d7cf2b8f99c710a048d688c13 Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Wed, 22 May 2024 13:45:40 +0100 Subject: [PATCH 2/2] remover unused consty --- packages/edit-site/src/components/global-styles/hooks.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/edit-site/src/components/global-styles/hooks.js b/packages/edit-site/src/components/global-styles/hooks.js index f8893eeba1f19d..5bc823a81dbf7a 100644 --- a/packages/edit-site/src/components/global-styles/hooks.js +++ b/packages/edit-site/src/components/global-styles/hooks.js @@ -9,7 +9,6 @@ import a11yPlugin from 'colord/plugins/a11y'; */ import { store as blocksStore } from '@wordpress/blocks'; import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; -import { privateApis as editorPrivateApis } from '@wordpress/editor'; import { __ } from '@wordpress/i18n'; /**