Skip to content

Commit

Permalink
Try ignoring how overrides are handled in the dropdown
Browse files Browse the repository at this point in the history
  • Loading branch information
ajlende committed Dec 7, 2023
1 parent fd7da57 commit 7ea8c73
Showing 1 changed file with 35 additions and 10 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -175,17 +175,42 @@ export default function TypographyPanel( {
// Font Size
const hasFontSizeEnabled = useHasFontSizeControl( settings );
const disableCustomFontSizes = ! settings?.typography?.customFontSize;
const mergedFontSizes = uniqByProperty(
mergeOrigins( {
default:
settings?.typography?.defaultFontSizes !== false
? settings?.typography?.fontSizes?.default
: undefined,
theme: settings?.typography?.fontSizes?.theme,
custom: settings?.typography?.fontSizes?.custom,
} ),

/**
* TODO: Doing some hacky things here so the global styles CSS matches what
* is shown in the dropdown.
*
* Global styles PRESETS_METADATA includes a `prevent_override` option
* that's supposed to handle this. But it isn't working as expected.
*
* Ideally, global styles would be fixed to handle overrides and duplicates
* better. But at least with these hacks, the thing you select matches the
* styles that get applied.
*/

// The font size presets are merged in reverse order so that the duplicates
// that may defined later in the array have higher priority to match the CSS.
const mergedFontSizesAll = uniqByProperty(
[
settings?.typography?.fontSizes?.custom,
settings?.typography?.fontSizes?.theme,
settings?.typography?.fontSizes?.default,
].flatMap( ( presets ) => presets?.toReversed() ?? [] ),
'slug'
);
).toReversed();

// Default presets exist in the global styles CSS no matter the setting, so
// filtering them out in the UI has to be done after merging.
const mergedFontSizes =
settings?.typography?.defaultFontSizes === false
? mergedFontSizesAll.filter(
( { slug } ) =>
! [ 'small', 'medium', 'large', 'x-large' ].includes(
slug
)
)
: mergedFontSizesAll;

const fontSize = decodeValue( inheritedValue?.typography?.fontSize );
const setFontSize = ( newValue, metadata ) => {
const actualValue = !! metadata?.slug
Expand Down

0 comments on commit 7ea8c73

Please sign in to comment.