Skip to content
Merged
Changes from 1 commit
Commits
Show all changes
48 commits
Select commit Hold shift + click to select a range
3366eca
Add colors and typography to the styles tab
scruffian Nov 29, 2023
9532adf
refactor
scruffian Nov 29, 2023
ddf005d
refactor
scruffian Nov 29, 2023
f075c7f
Add font family names
scruffian Nov 29, 2023
92167fd
add heading and body previews
scruffian Nov 30, 2023
379f62d
use palettes
scruffian Nov 30, 2023
c62be75
make typograpgy a grid
scruffian Nov 30, 2023
1a3dd8a
make the styles look nicer
scruffian Nov 30, 2023
5f50937
move component to its own file
scruffian Dec 6, 2023
de565ad
move color and type variations to different locations in the UI
scruffian Dec 6, 2023
db8fc25
revert
scruffian Dec 6, 2023
76f9a9b
revert
scruffian Dec 6, 2023
8663e68
revert
scruffian Dec 6, 2023
e2c18ec
revert
scruffian Dec 6, 2023
32723f1
code dedupe
scruffian Dec 6, 2023
baab507
Add typesets
scruffian Dec 6, 2023
d8ec720
reorg typogrpahy
scruffian Dec 7, 2023
0e94cbe
tidy up
scruffian Dec 7, 2023
e6d2392
tidy up code
scruffian Dec 7, 2023
dcf7f89
restyle color palettes
scruffian Dec 7, 2023
e8033c5
restyle color palettes
scruffian Dec 7, 2023
b4b0f80
remove typesets
scruffian Dec 7, 2023
f156dd5
add padding back
scruffian Dec 7, 2023
00726ba
refactor
scruffian Dec 7, 2023
f401473
Show theme_name + style where there is no typography font family info.
ramonjd Feb 5, 2024
c0be163
Consolidating logic into a hook phase 1
ramonjd Feb 6, 2024
1e15d41
2022 borks getFamilyPreviewStyle because `face.fontStyle` doesn't exist
ramonjd Feb 6, 2024
a23a6ca
comments
ramonjd Feb 6, 2024
13bea45
Filtering results
ramonjd Feb 8, 2024
63b85db
Create new convenience hook `useCurrentMergeThemeStyleVariationsWithU…
ramonjd Feb 14, 2024
c17157a
add a todo
ramonjd Feb 16, 2024
3af2f95
A bit of clean up. Remove comments, adjust margins.
ramonjd Feb 19, 2024
f12bb72
move variation to a new component
scruffian Feb 23, 2024
da353ae
make variation a composible component
scruffian Feb 23, 2024
88c8a3f
use the variation component for typography
scruffian Feb 24, 2024
993a98e
Update typography preview
scruffian Feb 24, 2024
ecffb64
Add animation
scruffian Feb 24, 2024
9493d20
move variation to a component
scruffian Feb 24, 2024
d368393
move preset to the higher level
scruffian Feb 24, 2024
7bea0bf
Remove unneeded CSS
scruffian Feb 24, 2024
6fbd619
updawte the design
scruffian Feb 24, 2024
949f199
remove unsed css
scruffian Feb 24, 2024
993c4af
Ensuring the cursor for the color previews is a pointer, which is the…
ramonjd Feb 26, 2024
e4eedf0
Reinstate removing property from user config before merging with vari…
ramonjd Feb 26, 2024
c642d19
i18n for letters
ramonjd Feb 27, 2024
e51b44f
Refactor unique font calculation
ramonjd Feb 27, 2024
b23d64c
move color and type variations higher
scruffian Feb 27, 2024
f7b735e
Use same box shadow as ColorIndicator so that there's a border around…
ramonjd Feb 28, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Refactor unique font calculation
  • Loading branch information
ramonjd authored and scruffian committed Feb 27, 2024
commit e51b44fe7d359499bc3bbc203dbecd17de5220cc
Original file line number Diff line number Diff line change
Expand Up @@ -58,10 +58,6 @@ const getFontFamilies = ( themeJson ) => {

return [ bodyFontFamily, headingFontFamily ];
};
const getFontFamilyNames = ( themeJson ) => {
const [ bodyFontFamily, headingFontFamily ] = getFontFamilies( themeJson );
return [ bodyFontFamily?.name, headingFontFamily?.name ];
};

const TypePreview = ( { variation } ) => {
const { base } = useContext( GlobalStylesContext );
Expand Down Expand Up @@ -111,32 +107,33 @@ export default function TypographyVariations() {
} );

const { base } = useContext( GlobalStylesContext );
const uniqueTypographyVariations = [];
const uniqueTypographyNames = [];
const isDup = ( x, y ) => {
return uniqueTypographyNames.find( ( it ) => {
return JSON.stringify( it ) === JSON.stringify( [ x, y ] );
} );
};

/*
@TODO: not convinced about this yet. Originally, it skipped variations that didn't have
any heading/body fonts, and therefore names.
If we want to pull all "variations", then probably the first iteration is to name the variations according to their titles.
* Filter duplicate variations based on the font families used in the variation.
*/
typographyVariations?.forEach( ( variation ) => {
const [ bodyFontFamilyName, headingFontFamilyName ] =
getFontFamilyNames( mergeBaseAndUserConfigs( base, variation ) );
if ( ! isDup( bodyFontFamilyName, headingFontFamilyName ) ) {
uniqueTypographyVariations.push( variation );
if ( bodyFontFamilyName && headingFontFamilyName ) {
uniqueTypographyNames.push( [
bodyFontFamilyName,
headingFontFamilyName,
] );
}
}
} );
const uniqueTypographyVariations = typographyVariations?.length
? Object.values(
typographyVariations.reduce( ( acc, variation ) => {
const [ bodyFontFamily, headingFontFamily ] =
getFontFamilies(
mergeBaseAndUserConfigs( base, variation )
);
if (
headingFontFamily?.name &&
bodyFontFamily?.name &&
! acc[
`${ headingFontFamily?.name }:${ bodyFontFamily?.name }`
]
) {
acc[
`${ headingFontFamily?.name }:${ bodyFontFamily?.name }`
] = variation;
}

return acc;
}, {} )
)
: [];

return (
<VStack spacing={ 3 }>
Expand Down