feat 🥁: implement special ordering for fontFace APIs

- Ensure 'src' property always appears first
- Sort remaining properties alphabetically
- Handle both APIs correctly despite different argument structures
- Handles font faces ordering the same in all 3 available CSS rules
- Update documentation with fontFace ordering details
This commit is contained in:
Ante Budimir 2025-03-08 23:05:23 +02:00
parent 8916be7d16
commit 3e9bad1b02
12 changed files with 175 additions and 47 deletions

View file

@ -13,37 +13,37 @@ import { recipe } from '@vanilla-extract/recipes';
export const theFont = fontFace({
// Comment to test that the linter doesn't remove it
src: ['url("/fonts/MyFont.woff2") format("woff2")', 'url("/fonts/MyFont.woff") format("woff")'],
fontWeight: '400 700',
fontStyle: 'normal',
fontStretch: 'normal',
fontDisplay: 'swap',
unicodeRange:
'U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD',
ascentOverride: '90%',
descentOverride: '10%',
fontDisplay: 'swap',
fontFeatureSettings: '"liga" 1',
fontStretch: 'normal',
fontStyle: 'normal',
fontVariant: 'normal',
fontVariationSettings: '"wght" 400',
fontWeight: '400 700',
lineGapOverride: '10%',
sizeAdjust: '90%',
fontVariant: 'normal',
fontFeatureSettings: '"liga" 1',
fontVariationSettings: '"wght" 400',
unicodeRange:
'U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD',
});
globalFontFace('GlobalFont', {
// Comment to test that the linter doesn't remove it
src: ['url("/fonts/MyFont.woff2") format("woff2")', 'url("/fonts/MyFont.woff") format("woff")'],
fontWeight: '400 700',
fontStyle: 'normal',
fontStretch: 'normal',
fontDisplay: 'swap',
unicodeRange:
'U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD',
ascentOverride: '90%',
descentOverride: '10%',
fontDisplay: 'swap',
fontFeatureSettings: '"liga" 1',
fontStretch: 'normal',
fontStyle: 'normal',
fontVariant: 'normal',
fontVariationSettings: '"wght" 400',
fontWeight: '400 700',
lineGapOverride: '10%',
sizeAdjust: '90%',
fontVariant: 'normal',
fontFeatureSettings: '"liga" 1',
fontVariationSettings: '"wght" 400',
unicodeRange:
'U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD',
});
// keyframes