@atlaskit/tokens 1.15.0 → 1.15.1

package/dist/es2019/artifacts/tokens-raw/atlassian-typography.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::bae3fa2256b534cd5a8fad9a180e3fa8>>
+ * @codegen <<SignedSource::bf6a6956c0f05008a38d080067ade3fb>>
  * @codegenCommand yarn build tokens
  */
 const tokens = [{
@@ -47,7 +47,7 @@ const tokens = [{
     "description": "Smaller body font."
   },
   "value": {
-    "fontSize": 11,
+    "fontSize": 12,
     "fontStyle": "normal",
     "fontWeight": "400",
     "lineHeight": 20,
@@ -65,7 +65,7 @@ const tokens = [{
     },
     "value": {
       "fontWeight": "FontWeight400",
-      "fontSize": "FontSize11",
+      "fontSize": "FontSize12",
       "lineHeight": "LineHeight200",
       "fontFamily": "FontFamilyWebSans",
       "fontStyle": "normal",
@@ -318,7 +318,7 @@ const tokens = [{
     "value": {
       "fontWeight": "FontWeight700",
       "fontSize": "FontSize36",
-      "lineHeight": "LineHeight600",
+      "lineHeight": "LineHeight700",
       "fontFamily": "FontFamilyWebSans",
       "fontStyle": "normal",
       "letterSpacing": "LetterSpacing0"
@@ -371,7 +371,7 @@ const tokens = [{
     "description": "Helpful guidance goes here"
   },
   "value": "0",
-  "filePath": "src/tokens/atlassian-typography/utils.tsx",
+  "filePath": "src/tokens/atlassian-typography/letter-spacing.tsx",
   "isSource": true,
   "original": {
     "attributes": {
@@ -393,7 +393,7 @@ const tokens = [{
     "description": "Helpful guidance goes here"
   },
   "value": "0",
-  "filePath": "src/tokens/atlassian-typography/utils.tsx",
+  "filePath": "src/tokens/atlassian-typography/letter-spacing.tsx",
   "isSource": true,
   "original": {
     "attributes": {
@@ -415,7 +415,7 @@ const tokens = [{
     "description": "Helpful guidance goes here"
   },
   "value": "0",
-  "filePath": "src/tokens/atlassian-typography/utils.tsx",
+  "filePath": "src/tokens/atlassian-typography/letter-spacing.tsx",
   "isSource": true,
   "original": {
     "attributes": {
@@ -437,7 +437,7 @@ const tokens = [{
     "description": "Helpful guidance goes here"
   },
   "value": "0",
-  "filePath": "src/tokens/atlassian-typography/utils.tsx",
+  "filePath": "src/tokens/atlassian-typography/letter-spacing.tsx",
   "isSource": true,
   "original": {
     "attributes": {
@@ -459,7 +459,7 @@ const tokens = [{
     "description": "Helpful guidance goes here"
   },
   "value": "0",
-  "filePath": "src/tokens/atlassian-typography/utils.tsx",
+  "filePath": "src/tokens/atlassian-typography/letter-spacing.tsx",
   "isSource": true,
   "original": {
     "attributes": {
@@ -517,7 +517,7 @@ const tokens = [{
     "description": "Single-line non-wrapping supporting text like that in a smaller label."
   },
   "value": {
-    "fontSize": 11,
+    "fontSize": 12,
     "fontStyle": "normal",
     "fontWeight": "400",
     "lineHeight": "1",
@@ -535,7 +535,7 @@ const tokens = [{
     },
     "value": {
       "fontWeight": "FontWeight400",
-      "fontSize": "FontSize11",
+      "fontSize": "FontSize12",
       "lineHeight": "LineHeight1",
       "fontFamily": "FontFamilyWebSans",
       "fontStyle": "normal",

package/dist/es2019/get-token-value.js

@@ -1,7 +1,7 @@
 import warnOnce from '@atlaskit/ds-lib/warn-once';
 import tokens from './artifacts/token-names';
 const name = "@atlaskit/tokens";
-const version = "1.15.0";
+const version = "1.15.1";
 /**
  * Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
  * resulting CSS Custom Property.

package/dist/es2019/get-token.js

@@ -2,7 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
 import tokens from './artifacts/token-names';
 import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
 const name = "@atlaskit/tokens";
-const version = "1.15.0";
+const version = "1.15.1";
 /**
  * Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
  * This should be used to implement design decisions throughout your application.

package/dist/es2019/palettes/typography-palette.js

@@ -71,6 +71,12 @@ const lineHeightScale = {
       }
     },
     LineHeight600: {
+      value: 36,
+      attributes: {
+        group: 'typography'
+      }
+    },
+    LineHeight700: {
       value: 40,
       attributes: {
         group: 'typography'
@@ -171,7 +177,7 @@ const fontSizeScale = {
         group: 'typography'
       }
     },
-    FontSize11: {
+    LegacyFontSize11: {
       value: 11,
       attributes: {
         group: 'typography'
@@ -219,6 +225,12 @@ const fontSizeScale = {
         group: 'typography'
       }
     },
+    FontSize32: {
+      value: 32,
+      attributes: {
+        group: 'typography'
+      }
+    },
     LegacyFontSize35: {
       value: 35,
       attributes: {

package/dist/es2019/theme-config.js

@@ -34,7 +34,7 @@ export const themeColorModes = ['light', 'dark', 'auto'];
  *
  * These ids must be kebab case
  */
-export const themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typography', 'shape', 'typography-adg3'];
+export const themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typography', 'shape', 'typography-adg3', 'typography-minor3'];
 /**
  * Theme override ids: the equivalent of themeIds for theme overrides.
  * Theme overrides are temporary and there may not be any defined at times.
@@ -142,7 +142,15 @@ const themeConfig = {
   },
   'atlassian-typography': {
     id: 'typography',
-    displayName: 'Atlassian Typography',
+    displayName: 'Atlassian Typography (Minor Second)',
+    palette: 'typographyPalette',
+    attributes: {
+      type: 'typography'
+    }
+  },
+  'atlassian-typography-minor3': {
+    id: 'typography-minor3',
+    displayName: 'Atlassian Typography (Minor Third)',
     palette: 'typographyPalette',
     attributes: {
       type: 'typography'

package/dist/es2019/tokens/atlassian-typography/letter-spacing.js

@@ -0,0 +1,22 @@
+const font = {
+  font: {
+    letterSpacing: {
+      '0': {
+        value: 'LetterSpacing0'
+      },
+      '100': {
+        value: 'LetterSpacing0'
+      },
+      '200': {
+        value: 'LetterSpacing0'
+      },
+      '300': {
+        value: 'LetterSpacing0'
+      },
+      '400': {
+        value: 'LetterSpacing0'
+      }
+    }
+  }
+};
+export default font;

package/dist/es2019/tokens/atlassian-typography/theme.js

@@ -5,7 +5,7 @@ const typography = {
         value: {
           fontWeight: 'FontWeight700',
           fontSize: 'FontSize36',
-          lineHeight: 'LineHeight600',
+          lineHeight: 'LineHeight700',
           fontFamily: 'FontFamilyWebSans',
           fontStyle: 'normal',
           letterSpacing: 'LetterSpacing0'
@@ -98,7 +98,7 @@ const typography = {
       sm: {
         value: {
           fontWeight: 'FontWeight400',
-          fontSize: 'FontSize11',
+          fontSize: 'FontSize12',
           lineHeight: 'LineHeight200',
           fontFamily: 'FontFamilyWebSans',
           fontStyle: 'normal',
@@ -120,7 +120,7 @@ const typography = {
       sm: {
         value: {
           fontWeight: 'FontWeight400',
-          fontSize: 'FontSize11',
+          fontSize: 'FontSize12',
           lineHeight: 'LineHeight1',
           fontFamily: 'FontFamilyWebSans',
           fontStyle: 'normal',

package/dist/es2019/tokens/atlassian-typography-adg3/font-size.js

@@ -2,7 +2,7 @@ const font = {
   font: {
     size: {
       '050': {
-        value: 'FontSize11'
+        value: 'LegacyFontSize11'
       },
       '075': {
         value: 'FontSize12'

package/dist/es2019/tokens/atlassian-typography-adg3/line-height.js

@@ -20,7 +20,7 @@ const font = {
         value: 'LineHeight500'
       },
       '600': {
-        value: 'LineHeight600'
+        value: 'LineHeight700'
       }
     }
   }

package/dist/es2019/tokens/atlassian-typography-adg3/theme.js

@@ -5,7 +5,7 @@ const typography = {
         value: {
           fontWeight: 'FontWeight500',
           fontSize: 'LegacyFontSize35',
-          lineHeight: 'LineHeight600',
+          lineHeight: 'LineHeight700',
           fontFamily: 'FontFamilyWebSans',
           fontStyle: 'normal',
           letterSpacing: 'LetterSpacing400'
@@ -98,7 +98,7 @@ const typography = {
       sm: {
         value: {
           fontWeight: 'FontWeight400',
-          fontSize: 'FontSize11',
+          fontSize: 'LegacyFontSize11',
           lineHeight: 'LineHeight200',
           fontFamily: 'FontFamilyWebSans',
           fontStyle: 'normal',
@@ -120,7 +120,7 @@ const typography = {
       sm: {
         value: {
           fontWeight: 'FontWeight400',
-          fontSize: 'FontSize11',
+          fontSize: 'LegacyFontSize11',
           lineHeight: 'LineHeight100',
           fontFamily: 'FontFamilyWebSans',
           fontStyle: 'normal',

package/dist/es2019/tokens/atlassian-typography-minor3/font-family.js

@@ -0,0 +1,22 @@
+const font = {
+  font: {
+    family: {
+      sans: {
+        value: 'FontFamilyWebSans'
+      },
+      monospace: {
+        value: 'FontFamilyWebMono'
+      },
+      product: {
+        value: 'FontFamilyWebSans'
+      },
+      brand: {
+        value: 'FontFamilyCharlie'
+      },
+      code: {
+        value: 'FontFamilyWebMono'
+      }
+    }
+  }
+};
+export default font;

package/dist/es2019/tokens/atlassian-typography-minor3/theme.js

@@ -0,0 +1,133 @@
+const typography = {
+  font: {
+    heading: {
+      xxl: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize32',
+          lineHeight: 'LineHeight600',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      xl: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize28',
+          lineHeight: 'LineHeight500',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      lg: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize24',
+          lineHeight: 'LineHeight400',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      md: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize20',
+          lineHeight: 'LineHeight300',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      sm: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize16',
+          lineHeight: 'LineHeight200',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      xs: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize14',
+          lineHeight: 'LineHeight100',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      xxs: {
+        value: {
+          fontWeight: 'FontWeight700',
+          fontSize: 'FontSize12',
+          lineHeight: 'LineHeight100',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      }
+    },
+    code: {
+      '[default]': {
+        value: {
+          fontWeight: 'FontWeight400',
+          fontSize: 'FontSizeCode',
+          lineHeight: 'LineHeight1',
+          fontFamily: 'FontFamilyWebMono',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      }
+    },
+    body: {
+      '[default]': {
+        value: {
+          fontWeight: 'FontWeight400',
+          fontSize: 'FontSize14',
+          lineHeight: 'LineHeight200',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      sm: {
+        value: {
+          fontWeight: 'FontWeight400',
+          fontSize: 'FontSize12',
+          lineHeight: 'LineHeight200',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      }
+    },
+    ui: {
+      '[default]': {
+        value: {
+          fontWeight: 'FontWeight400',
+          fontSize: 'FontSize14',
+          lineHeight: 'LineHeight1',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      },
+      sm: {
+        value: {
+          fontWeight: 'FontWeight400',
+          fontSize: 'FontSize12',
+          lineHeight: 'LineHeight1',
+          fontFamily: 'FontFamilyWebSans',
+          fontStyle: 'normal',
+          letterSpacing: 'LetterSpacing0'
+        }
+      }
+    }
+  }
+};
+export default typography;

package/dist/esm/artifacts/palettes-raw/typography-palette.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::89e4530c84e484a163c9df048290ecf5>>
+ * @codegen <<SignedSource::c5a499034468ced262952ef968c2fd67>>
  * @codegenCommand yarn build tokens
  */
 var tokens = [{
@@ -123,21 +123,6 @@ var tokens = [{
   },
   "name": "typography.fontFamily.LegacyFontFamilyWebSans",
   "path": ["typography", "fontFamily", "LegacyFontFamilyWebSans"]
-}, {
-  "value": "11px",
-  "attributes": {
-    "group": "typography"
-  },
-  "filePath": "src/palettes/typography-palette.tsx",
-  "isSource": true,
-  "original": {
-    "value": 11,
-    "attributes": {
-      "group": "typography"
-    }
-  },
-  "name": "typography.fontSize.FontSize11",
-  "path": ["typography", "fontSize", "FontSize11"]
 }, {
   "value": "12px",
   "attributes": {
@@ -228,6 +213,21 @@ var tokens = [{
   },
   "name": "typography.fontSize.FontSize28",
   "path": ["typography", "fontSize", "FontSize28"]
+}, {
+  "value": "32px",
+  "attributes": {
+    "group": "typography"
+  },
+  "filePath": "src/palettes/typography-palette.tsx",
+  "isSource": true,
+  "original": {
+    "value": 32,
+    "attributes": {
+      "group": "typography"
+    }
+  },
+  "name": "typography.fontSize.FontSize32",
+  "path": ["typography", "fontSize", "FontSize32"]
 }, {
   "value": "36px",
   "attributes": {
@@ -273,6 +273,21 @@ var tokens = [{
   },
   "name": "typography.fontSize.FontSizeCode",
   "path": ["typography", "fontSize", "FontSizeCode"]
+}, {
+  "value": "11px",
+  "attributes": {
+    "group": "typography"
+  },
+  "filePath": "src/palettes/typography-palette.tsx",
+  "isSource": true,
+  "original": {
+    "value": 11,
+    "attributes": {
+      "group": "typography"
+    }
+  },
+  "name": "typography.fontSize.LegacyFontSize11",
+  "path": ["typography", "fontSize", "LegacyFontSize11"]
 }, {
   "value": "29px",
   "attributes": {
@@ -529,19 +544,34 @@ var tokens = [{
   "name": "typography.lineHeight.LineHeight500",
   "path": ["typography", "lineHeight", "LineHeight500"]
 }, {
-  "value": "40px",
+  "value": "36px",
   "attributes": {
     "group": "typography"
   },
   "filePath": "src/palettes/typography-palette.tsx",
   "isSource": true,
   "original": {
-    "value": 40,
+    "value": 36,
     "attributes": {
       "group": "typography"
     }
   },
   "name": "typography.lineHeight.LineHeight600",
   "path": ["typography", "lineHeight", "LineHeight600"]
+}, {
+  "value": "40px",
+  "attributes": {
+    "group": "typography"
+  },
+  "filePath": "src/palettes/typography-palette.tsx",
+  "isSource": true,
+  "original": {
+    "value": 40,
+    "attributes": {
+      "group": "typography"
+    }
+  },
+  "name": "typography.lineHeight.LineHeight700",
+  "path": ["typography", "lineHeight", "LineHeight700"]
 }];
 export default tokens;

package/dist/esm/artifacts/theme-import-map.js

@@ -6,7 +6,7 @@
  * This allows users to compose their themes and only use the tokens that are requested.
  * When a new theme is created, the import should automatically be added to the map
  *
- * @codegen <<SignedSource::82c355c08254a28b0727a63e17ee7698>>
+ * @codegen <<SignedSource::1e1c80a5700235c55449aa23948418be>>
  * @codegenCommand yarn build tokens
  */
 
@@ -50,6 +50,10 @@ var themeImportsMap = {
   'typography': function typography() {
     return import( /* webpackChunkName: "@atlaskit-internal_atlassian-typography" */
     './themes/atlassian-typography');
+  },
+  'typography-minor3': function typographyMinor3() {
+    return import( /* webpackChunkName: "@atlaskit-internal_atlassian-typography-minor3" */
+    './themes/atlassian-typography-minor3');
   }
 };
 export default themeImportsMap;

package/dist/esm/artifacts/themes/atlassian-typography-minor3.js

@@ -0,0 +1,6 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::88719508da65fd1b7ad398cc0681c4c5>>
+ * @codegenCommand yarn build tokens
+ */
+export default "\nhtml[data-theme~=\"typography:typography-minor3\"] {\n  --ds-font-body: normal 400 0.875rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-body-sm: normal 400 0.75rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-code: normal 400 0.875em/1 var(--ds-font-family-monospace);\n  --ds-font-heading-lg: normal 700 1.5rem/1.75rem var(--ds-font-family-sans);\n  --ds-font-heading-md: normal 700 1.25rem/1.5rem var(--ds-font-family-sans);\n  --ds-font-heading-sm: normal 700 1rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-heading-xl: normal 700 1.75rem/2rem var(--ds-font-family-sans);\n  --ds-font-heading-xs: normal 700 0.875rem/1rem var(--ds-font-family-sans);\n  --ds-font-heading-xxl: normal 700 2rem/2.25rem var(--ds-font-family-sans);\n  --ds-font-heading-xxs: normal 700 0.75rem/1rem var(--ds-font-family-sans);\n  --ds-font-letterSpacing-0: 0;\n  --ds-font-letterSpacing-100: 0;\n  --ds-font-letterSpacing-200: 0;\n  --ds-font-letterSpacing-300: 0;\n  --ds-font-letterSpacing-400: 0;\n  --ds-font-ui: normal 400 0.875rem/1 var(--ds-font-family-sans);\n  --ds-font-ui-sm: normal 400 0.75rem/1 var(--ds-font-family-sans);\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-monospace: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-product: ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-sans: ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand: Charlie Sans;\n}\n";

package/dist/esm/artifacts/themes/atlassian-typography.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::8a2c4f8f66783e1940d1aab250cf35a9>>
+ * @codegen <<SignedSource::ce2e1e115aa9ff0027981ef8ba658c64>>
  * @codegenCommand yarn build tokens
  */
-export default "\nhtml[data-theme~=\"typography:typography\"] {\n  --ds-font-body: normal 400 0.875rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-body-sm: normal 400 0.6875rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-code: normal 400 0.875em/1 var(--ds-font-family-monospace);\n  --ds-font-heading-lg: normal 700 1.5rem/1.75rem var(--ds-font-family-sans);\n  --ds-font-heading-md: normal 700 1.25rem/1.5rem var(--ds-font-family-sans);\n  --ds-font-heading-sm: normal 700 1rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-heading-xl: normal 700 1.75rem/2rem var(--ds-font-family-sans);\n  --ds-font-heading-xs: normal 700 0.875rem/1rem var(--ds-font-family-sans);\n  --ds-font-heading-xxl: normal 700 2.25rem/2.5rem var(--ds-font-family-sans);\n  --ds-font-heading-xxs: normal 700 0.75rem/1rem var(--ds-font-family-sans);\n  --ds-font-letterSpacing-0: 0;\n  --ds-font-letterSpacing-100: 0;\n  --ds-font-letterSpacing-200: 0;\n  --ds-font-letterSpacing-300: 0;\n  --ds-font-letterSpacing-400: 0;\n  --ds-font-ui: normal 400 0.875rem/1 var(--ds-font-family-sans);\n  --ds-font-ui-sm: normal 400 0.6875rem/1 var(--ds-font-family-sans);\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-monospace: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-product: ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-sans: ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand: Charlie Sans;\n}\n";
+export default "\nhtml[data-theme~=\"typography:typography\"] {\n  --ds-font-body: normal 400 0.875rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-body-sm: normal 400 0.75rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-code: normal 400 0.875em/1 var(--ds-font-family-monospace);\n  --ds-font-heading-lg: normal 700 1.5rem/1.75rem var(--ds-font-family-sans);\n  --ds-font-heading-md: normal 700 1.25rem/1.5rem var(--ds-font-family-sans);\n  --ds-font-heading-sm: normal 700 1rem/1.25rem var(--ds-font-family-sans);\n  --ds-font-heading-xl: normal 700 1.75rem/2rem var(--ds-font-family-sans);\n  --ds-font-heading-xs: normal 700 0.875rem/1rem var(--ds-font-family-sans);\n  --ds-font-heading-xxl: normal 700 2.25rem/2.5rem var(--ds-font-family-sans);\n  --ds-font-heading-xxs: normal 700 0.75rem/1rem var(--ds-font-family-sans);\n  --ds-font-letterSpacing-0: 0;\n  --ds-font-letterSpacing-100: 0;\n  --ds-font-letterSpacing-200: 0;\n  --ds-font-letterSpacing-300: 0;\n  --ds-font-letterSpacing-400: 0;\n  --ds-font-ui: normal 400 0.875rem/1 var(--ds-font-family-sans);\n  --ds-font-ui-sm: normal 400 0.75rem/1 var(--ds-font-family-sans);\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-monospace: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-product: ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-sans: ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand: Charlie Sans;\n}\n";