Skip to content

Global Styles: Remove unused duplicate font family preview utilities #81194

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ramonjd merged 1 commit into from
Aug 6, 2026
Merged

Global Styles: Remove unused duplicate font family preview utilities #81194

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
110 changes: 0 additions & 110 deletions packages/global-styles-ui/src/utils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -254,116 +254,6 @@ export function getFontFamilies( themeJson: any ): [ any, any ] {
return [ bodyFontFamily, headingFontFamily ];
}

function findNearest( input: number, numbers: number[] ): number | null {
// If the numbers array is empty, return null
if ( numbers.length === 0 ) {
return null;
}
// Sort the array based on the absolute difference with the input
numbers.sort( ( a, b ) => Math.abs( input - a ) - Math.abs( input - b ) );
// Return the first element (which will be the nearest) from the sorted array
return numbers[ 0 ];
}

function extractFontWeights( fontFaces: any[] ): number[] {
const result: number[] = [];

fontFaces.forEach( ( face ) => {
const weights = String( face.fontWeight ).split( ' ' );

if ( weights.length === 2 ) {
const start = parseInt( weights[ 0 ] );
const end = parseInt( weights[ 1 ] );

for ( let i = start; i <= end; i += 100 ) {
result.push( i );
}
} else if ( weights.length === 1 ) {
result.push( parseInt( weights[ 0 ] ) );
}
} );

return result;
}

/*
* Format the font family to use in the CSS font-family property of a CSS rule.
*
* The input can be a string with the font family name or a string with multiple font family names separated by commas.
* It follows the recommendations from the CSS Fonts Module Level 4.
* https://www.w3.org/TR/css-fonts-4/#font-family-prop
*
* @param input - The font family.
* @return The formatted font family.
*/
export function formatFontFamily( input: string ): string {
// Matches strings that are not exclusively alphabetic characters or hyphens, and do not exactly follow the pattern generic(alphabetic characters or hyphens).
const regex = /^(?!generic\([ a-zA-Z\-]+\)$)(?!^[a-zA-Z\-]+$).+/;
const output = input.trim();

const formatItem = ( item: string ) => {
item = item.trim();
if ( item.match( regex ) ) {
// removes leading and trailing quotes.
item = item.replace( /^["']|["']$/g, '' );
return `"${ item }"`;
}
return item;
};

if ( output.includes( ',' ) ) {
return output
.split( ',' )
.map( formatItem )
.filter( ( item ) => item !== '' )
.join( ', ' );
}

return formatItem( output );
}

/**
* Gets the preview style for a font family.
*
* @param family The font family object
* @return CSS style object for the font family
*/
export function getFamilyPreviewStyle( family: any ): React.CSSProperties {
const style: React.CSSProperties = {
fontFamily: formatFontFamily( family.fontFamily ),
};

if ( ! Array.isArray( family.fontFace ) ) {
style.fontWeight = '400';
style.fontStyle = 'normal';
return style;
}

if ( family.fontFace ) {
//get all the font faces with normal style
const normalFaces = family.fontFace.filter(
( face: any ) =>
face?.fontStyle && face.fontStyle.toLowerCase() === 'normal'
);
if ( normalFaces.length > 0 ) {
style.fontStyle = 'normal';
const normalWeights = extractFontWeights( normalFaces );
const nearestWeight = findNearest( 400, normalWeights );
style.fontWeight = String( nearestWeight ) || '400';
} else {
style.fontStyle =
( family.fontFace.length && family.fontFace[ 0 ].fontStyle ) ||
'normal';
style.fontWeight =
( family.fontFace.length &&
String( family.fontFace[ 0 ].fontWeight ) ) ||
'400';
}
}

return style;
}

/**
* Iterates through the presets array and searches for slugs that start with the specified
* slugPrefix followed by a numerical suffix. It identifies the highest numerical suffix found
Expand Down
Loading