oneslash-design-system 2.1.0 → 2.2.0

package/README.md

@@ -15,6 +15,13 @@ The package ships Tailwind class names, CSS variables and untranspiled `.jsx`. E
 3. **Tailwind v4:** import `oneslash-design-system/theme.css` (toggle) or `theme-auto.css` (OS), plus `typography.css` if you want the type scale.
 4. **Next.js:** `transpilePackages: ["oneslash-design-system"]` in `next.config`.
 5. **Scan the components:** v3 `content` gets `./node_modules/oneslash-design-system/dist/**/*.{js,jsx}`; v4 CSS gets `@source "../node_modules/oneslash-design-system/dist/**/*.jsx";`.
+6. **Load the fonts:** the package names Inter (`font-inter`) and JetBrains Mono (`font-mono`, for code, identifiers and type names) but does not ship them. Load both under their real family names, for example with one Google Fonts link in `<head>`:
+
+```html
+<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400&family=JetBrains+Mono:wght@400&display=swap">
+```
+
+   `next/font/google` registers a hashed family name instead, so with it apply `mono.className` to the code element rather than relying on `font-mono`.
 
 ```css
 /* Tailwind v4, OS-driven dark mode */

package/dist/designTokens.d.ts

@@ -1539,6 +1539,7 @@ export declare namespace spacing {
 }
 export declare namespace typography {
     let family: string;
+    let monoFamily: string;
     namespace h1 {
         let weight: string;
         let size: string;

package/dist/designTokens.js

@@ -189,6 +189,7 @@ var base = {
     },
     typography: {
         family: 'Inter, sans-serif',
+        monoFamily: "'JetBrains Mono', ui-monospace, monospace",
         h1: {
             weight: '400',
             size: '96px',

package/dist/tailwind-preset-auto.js

@@ -359,7 +359,8 @@ module.exports = {
         ]
       },
       "fontFamily": {
-        "inter": "Inter, sans-serif"
+        "inter": "Inter, sans-serif",
+        "mono": "'JetBrains Mono', ui-monospace, monospace"
       },
       "fontWeight": {
         "h1": "400",

package/dist/tailwind-preset.js

@@ -353,7 +353,8 @@ module.exports = {
         ]
       },
       "fontFamily": {
-        "inter": "Inter, sans-serif"
+        "inter": "Inter, sans-serif",
+        "mono": "'JetBrains Mono', ui-monospace, monospace"
       },
       "fontWeight": {
         "h1": "400",

package/dist/typography.css

@@ -1,6 +1,7 @@
 /* Generated from designTokens.js by scripts/build-tokens.js. Do not edit. */
 @theme inline {
   --font-inter: Inter, sans-serif;
+  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
   --text-h1: 96px;
   --text-h1--line-height: 115px;
   --text-h1--letter-spacing: -1.5px;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "oneslash-design-system",
   "description": "A design system for the Oneslash projects",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "private": false,
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",