@hilum/ui 2.1.2 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -15,9 +15,10 @@ In your app's `globals.css`:
15
15
  ```css
16
16
  @import "tailwindcss";
17
17
  @import "@hilum/ui/tokens.css";
18
+ @import "@hilum/ui/fonts.css";
18
19
  ```
19
20
 
20
- That's the whole setup — palette, typography, fonts, light/dark theming, and Tailwind class scanning are all handled by those two lines.
21
+ That's the whole setup — palette, typography, fonts, light/dark theming, and Tailwind class scanning are handled by these imports.
21
22
 
22
23
  ## Usage
23
24
 
@@ -184,16 +184,16 @@ var tokens = {
184
184
  * ============================================================== */
185
185
  fontFamily: {
186
186
  sans: 'Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
187
- serif: '"Instrument Serif", ui-serif, Georgia, serif',
187
+ display: 'Gabarito, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
188
188
  mono: 'ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace'
189
189
  },
190
190
  /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */
191
191
  typeScale: {
192
- "display-xl": { family: "serif", size: "3rem", weight: 400, lineHeight: "1.15" },
193
- display: { family: "serif", size: "2.25rem", weight: 400, lineHeight: "1.15" },
194
- "heading-xl": { family: "serif", size: "1.875rem", weight: 400, lineHeight: "1.2" },
195
- heading: { family: "serif", size: "1.5rem", weight: 400, lineHeight: "1.2" },
196
- subheading: { family: "serif", size: "1.25rem", weight: 400, lineHeight: "1.4" },
192
+ "display-xl": { family: "display", size: "3rem", weight: 400, lineHeight: "1.15" },
193
+ display: { family: "display", size: "2.25rem", weight: 400, lineHeight: "1.15" },
194
+ "heading-xl": { family: "display", size: "1.875rem", weight: 400, lineHeight: "1.2" },
195
+ heading: { family: "display", size: "1.5rem", weight: 400, lineHeight: "1.2" },
196
+ subheading: { family: "display", size: "1.25rem", weight: 400, lineHeight: "1.4" },
197
197
  "body-lg": { family: "sans", size: "1rem", weight: 400, lineHeight: "1.625" },
198
198
  body: { family: "sans", size: "0.875rem", weight: 400, lineHeight: "1.625" },
199
199
  "body-sm": { family: "sans", size: "0.75rem", weight: 500, lineHeight: "1.625" },
@@ -283,5 +283,5 @@ var tokens = {
283
283
  };
284
284
 
285
285
  export { tokens };
286
- //# sourceMappingURL=chunk-H6JZQWX3.js.map
287
- //# sourceMappingURL=chunk-H6JZQWX3.js.map
286
+ //# sourceMappingURL=chunk-5JX2YKJM.js.map
287
+ //# sourceMappingURL=chunk-5JX2YKJM.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/tokens/tokens.ts"],"names":[],"mappings":"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","file":"chunk-H6JZQWX3.js","sourcesContent":["// @hilum/ui/tokens — JS-first design tokens (D6).\n//\n// This module is the single source of truth for the Hilum visual identity.\n// A build step (scripts/build-tokens.mjs) reads the compiled output of this\n// file and emits dist/tokens.css for consumers to `@import`.\n//\n// Brand model: D8 — base palette is fixed here. Per-product overrides are\n// applied at runtime via createTheme() in @hilum/ui/create-theme.\n// Color modes: D7 — light + dark, both auto (`prefers-color-scheme`) and\n// explicit via `[data-theme]`.\n//\n// Core brand colors:\n// brand.primary #C100F1 — vivid purple — purple-500 on the scale below\n// brand.secondary #FFF5BF — pale lemon — butter-200 on the scale below\n//\n// ground — neutral spine for text, borders, and structure (values: Tailwind neutral)\n\nexport const tokens = {\n /* ============================================================== *\n * PALETTE — concrete colors *\n * ============================================================== */\n\n ground: {\n 50: \"#fafafa\",\n 100: \"#f5f5f5\",\n 200: \"#e5e5e5\",\n 300: \"#d4d4d4\",\n 400: \"#a3a3a3\",\n 500: \"#737373\",\n 600: \"#525252\",\n 700: \"#404040\",\n 800: \"#262626\",\n 900: \"#171717\",\n 950: \"#0a0a0a\",\n },\n\n // Pale lemon — anchor: butter-200 = #FFF5BF\n butter: {\n 50: \"#ffffe8\",\n 100: \"#fffad0\",\n 200: \"#fff5bf\",\n 300: \"#fde870\",\n 400: \"#f6d42a\",\n 500: \"#dab010\",\n 600: \"#a88008\",\n 700: \"#7c5c04\",\n 800: \"#543e02\",\n 900: \"#382801\",\n 950: \"#221600\",\n },\n\n // Vivid purple — anchor: purple-500 = #C100F1 (brand.primary)\n purple: {\n 50: \"#fdf0ff\",\n 100: \"#f5d6ff\",\n 200: \"#e8a8ff\",\n 300: \"#d870f9\",\n 400: \"#c840f6\",\n 500: \"#c100f1\",\n 600: \"#9c00c0\",\n 700: \"#740092\",\n 800: \"#4e0062\",\n 900: \"#330040\",\n 950: \"#200028\",\n },\n\n // Legacy functional colors — used by components not yet migrated to the new palette.\n brand: {\n primary: \"#C100F1\", // purple-500\n secondary: \"#FFF5BF\", // butter-200\n },\n\n destructive: \"#dc2626\", // red-600\n\n /* ============================================================== *\n * SEMANTIC — what components reference *\n * ============================================================== */\n\n semantic: {\n light: {\n background: \"#ffffff\",\n foreground: \"#171717\", // ground-900\n card: \"#ffffff\",\n cardForeground: \"#171717\",\n surface: \"#fafafa\", // ground-50\n surfaceForeground: \"#262626\", // ground-800\n border: \"#f5f5f5\", // ground-100\n input: \"#f5f5f5\",\n muted: \"#fafafa\",\n mutedForeground: \"#737373\", // ground-500\n accent: \"#fdf0ff\", // purple-50\n accentForeground: \"#740092\", // purple-700\n primary: \"#c100f1\", // purple-500 = brand.primary\n primaryForeground: \"#ffffff\",\n secondary: \"#fafafa\", // ground-50\n secondaryForeground: \"#404040\", // ground-700\n destructive: \"#dc2626\",\n destructiveForeground: \"#ffffff\",\n success: \"#CDEA19\", // lime — functional semantic only\n successForeground: \"#171717\",\n warning: \"#fff5bf\", // butter-200 = brand.secondary\n warningForeground: \"#171717\", // ground-900\n ring: \"#c100f1\", // purple-500 = brand.primary\n },\n // Mid — a neutral medium-gray theme (from the Pappery designer \"mid\" palette,\n // mapped onto the ground scale). Sits between light and dark.\n mid: {\n background: \"#737373\", // ground-500 — main surface (designer panel)\n foreground: \"#fafafa\", // ground-50\n card: \"#525252\", // ground-600 — elevated items (designer item-bg)\n cardForeground: \"#fafafa\",\n surface: \"#525252\", // ground-600 (designer canvas/pane)\n surfaceForeground: \"#fafafa\",\n border: \"#a3a3a3\", // ground-400 (designer border — lighter so it reads on the gray)\n input: \"#404040\", // ground-700 (designer input-bg)\n muted: \"#525252\", // ground-600\n mutedForeground: \"#e5e5e5\", // ground-200 (designer text-secondary)\n accent: \"#404040\", // ground-700 (designer item-hover-bg)\n accentForeground: \"#fafafa\",\n primary: \"#c100f1\", // brand stays consistent across themes\n primaryForeground: \"#ffffff\",\n secondary: \"#525252\", // ground-600\n secondaryForeground: \"#fafafa\",\n destructive: \"#ef4444\", // red-500\n destructiveForeground: \"#ffffff\",\n success: \"#CDEA19\", // lime — functional semantic only\n successForeground: \"#171717\",\n warning: \"#fff5bf\", // butter-200\n warningForeground: \"#171717\",\n ring: \"#c100f1\",\n },\n dark: {\n background: \"#171717\", // ground-900 — designer canvas (deepest)\n foreground: \"#fafafa\", // ground-50\n card: \"#262626\", // ground-800 — designer panel-bg (elevated over bg)\n cardForeground: \"#fafafa\",\n surface: \"#1a1a1a\", // designer item-hover depth\n surfaceForeground: \"#f5f5f5\",\n border: \"#404040\", // ground-700 — designer border (reads on the dark)\n input: \"#262626\", // ground-800\n muted: \"#262626\", // ground-800\n mutedForeground: \"#a3a3a3\", // ground-400\n accent: \"#404040\", // ground-700 — neutral elevated/hover (designer item-hover)\n accentForeground: \"#fafafa\",\n primary: \"#c100f1\", // purple-500 — brand stays consistent (D8)\n primaryForeground: \"#ffffff\",\n secondary: \"#262626\", // ground-800\n secondaryForeground: \"#f5f5f5\",\n destructive: \"#ef4444\", // red-500 (slightly lighter for dark)\n destructiveForeground: \"#ffffff\",\n success: \"#CDEA19\", // lime — functional semantic only\n successForeground: \"#0a0a0a\",\n warning: \"#221600\", // butter-950 surface\n warningForeground: \"#fffad0\", // butter-100\n ring: \"#c100f1\", // purple-500 = brand.primary\n },\n },\n\n /* ============================================================== *\n * TYPOGRAPHY *\n * ============================================================== */\n\n fontFamily: {\n sans: 'Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n serif: '\"Instrument Serif\", ui-serif, Georgia, serif',\n mono: 'ui-monospace, \"SFMono-Regular\", \"Menlo\", \"Consolas\", monospace',\n },\n\n /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */\n typeScale: {\n \"display-xl\": { family: \"serif\", size: \"3rem\", weight: 400, lineHeight: \"1.15\" },\n display: { family: \"serif\", size: \"2.25rem\", weight: 400, lineHeight: \"1.15\" },\n \"heading-xl\": { family: \"serif\", size: \"1.875rem\", weight: 400, lineHeight: \"1.2\" },\n heading: { family: \"serif\", size: \"1.5rem\", weight: 400, lineHeight: \"1.2\" },\n subheading: { family: \"serif\", size: \"1.25rem\", weight: 400, lineHeight: \"1.4\" },\n \"body-lg\": { family: \"sans\", size: \"1rem\", weight: 400, lineHeight: \"1.625\" },\n body: { family: \"sans\", size: \"0.875rem\", weight: 400, lineHeight: \"1.625\" },\n \"body-sm\": { family: \"sans\", size: \"0.75rem\", weight: 500, lineHeight: \"1.625\" },\n caption: { family: \"sans\", size: \"0.75rem\", weight: 400, lineHeight: \"1.625\" },\n \"caption-xs\": { family: \"sans\", size: \"0.625rem\", weight: 400, lineHeight: \"1.625\" },\n\n /* --- \"Eyebrow\" family — uppercase tracked label used above headlines, --- *\n * on badges, and on section markers. `eyebrow` is the canonical name; *\n * `overline` (Material parlance), `kicker` (editorial parlance) and *\n * `label` (legacy) are aliases of the same scale so consumers can pick *\n * whichever vocabulary reads best in their context. `eyebrow-sm` is *\n * the compact variant for badge-sized chips and tiny status pills. */\n eyebrow: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n \"eyebrow-sm\": {\n family: \"sans\",\n size: \"0.625rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n overline: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n kicker: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n label: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n },\n\n /* ============================================================== *\n * GEOMETRY *\n * ============================================================== */\n\n radius: {\n base: \"0.5rem\",\n sm: \"calc(0.5rem - 4px)\",\n md: \"calc(0.5rem - 2px)\",\n lg: \"calc(0.5rem + 2px)\",\n xl: \"calc(0.5rem + 4px)\",\n full: \"9999px\",\n },\n\n /* ============================================================== *\n * Z-INDEX — semantic layering scale *\n * ============================================================== */\n\n zIndex: {\n dropdown: 40,\n sticky: 50,\n fixed: 60,\n modal: 100,\n popover: 110,\n tooltip: 120,\n },\n\n shadow: {\n natural:\n \"0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06)\",\n elevated:\n \"0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06), 0 6px 6px -3px rgba(0, 0, 0, 0.06), 0 12px 12px -6px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04), 0 24px 24px 2px rgba(0, 0, 0, 0.1)\",\n },\n\n /* ============================================================== *\n * ANIMATION *\n * ============================================================== */\n\n animation: {\n \"accordion-down\": \"accordion-down 0.2s ease-out\",\n \"accordion-up\": \"accordion-up 0.2s ease-out\",\n \"caret-blink\": \"caret-blink 1.25s ease-out infinite\",\n },\n} as const;\n\nexport type Tokens = typeof tokens;\nexport type SemanticTokens = typeof tokens.semantic.light;\n"]}
1
+ {"version":3,"sources":["../src/tokens/tokens.ts"],"names":[],"mappings":"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","file":"chunk-5JX2YKJM.js","sourcesContent":["// @hilum/ui/tokens — JS-first design tokens (D6).\n//\n// This module is the single source of truth for the Hilum visual identity.\n// A build step (scripts/build-tokens.mjs) reads the compiled output of this\n// file and emits dist/tokens.css for consumers to `@import`.\n//\n// Brand model: D8 — base palette is fixed here. Per-product overrides are\n// applied at runtime via createTheme() in @hilum/ui/create-theme.\n// Color modes: D7 — light + dark, both auto (`prefers-color-scheme`) and\n// explicit via `[data-theme]`.\n//\n// Core brand colors:\n// brand.primary #C100F1 — vivid purple — purple-500 on the scale below\n// brand.secondary #FFF5BF — pale lemon — butter-200 on the scale below\n//\n// ground — neutral spine for text, borders, and structure (values: Tailwind neutral)\n\nexport const tokens = {\n /* ============================================================== *\n * PALETTE — concrete colors *\n * ============================================================== */\n\n ground: {\n 50: \"#fafafa\",\n 100: \"#f5f5f5\",\n 200: \"#e5e5e5\",\n 300: \"#d4d4d4\",\n 400: \"#a3a3a3\",\n 500: \"#737373\",\n 600: \"#525252\",\n 700: \"#404040\",\n 800: \"#262626\",\n 900: \"#171717\",\n 950: \"#0a0a0a\",\n },\n\n // Pale lemon — anchor: butter-200 = #FFF5BF\n butter: {\n 50: \"#ffffe8\",\n 100: \"#fffad0\",\n 200: \"#fff5bf\",\n 300: \"#fde870\",\n 400: \"#f6d42a\",\n 500: \"#dab010\",\n 600: \"#a88008\",\n 700: \"#7c5c04\",\n 800: \"#543e02\",\n 900: \"#382801\",\n 950: \"#221600\",\n },\n\n // Vivid purple — anchor: purple-500 = #C100F1 (brand.primary)\n purple: {\n 50: \"#fdf0ff\",\n 100: \"#f5d6ff\",\n 200: \"#e8a8ff\",\n 300: \"#d870f9\",\n 400: \"#c840f6\",\n 500: \"#c100f1\",\n 600: \"#9c00c0\",\n 700: \"#740092\",\n 800: \"#4e0062\",\n 900: \"#330040\",\n 950: \"#200028\",\n },\n\n // Legacy functional colors — used by components not yet migrated to the new palette.\n brand: {\n primary: \"#C100F1\", // purple-500\n secondary: \"#FFF5BF\", // butter-200\n },\n\n destructive: \"#dc2626\", // red-600\n\n /* ============================================================== *\n * SEMANTIC — what components reference *\n * ============================================================== */\n\n semantic: {\n light: {\n background: \"#ffffff\",\n foreground: \"#171717\", // ground-900\n card: \"#ffffff\",\n cardForeground: \"#171717\",\n surface: \"#fafafa\", // ground-50\n surfaceForeground: \"#262626\", // ground-800\n border: \"#f5f5f5\", // ground-100\n input: \"#f5f5f5\",\n muted: \"#fafafa\",\n mutedForeground: \"#737373\", // ground-500\n accent: \"#fdf0ff\", // purple-50\n accentForeground: \"#740092\", // purple-700\n primary: \"#c100f1\", // purple-500 = brand.primary\n primaryForeground: \"#ffffff\",\n secondary: \"#fafafa\", // ground-50\n secondaryForeground: \"#404040\", // ground-700\n destructive: \"#dc2626\",\n destructiveForeground: \"#ffffff\",\n success: \"#CDEA19\", // lime — functional semantic only\n successForeground: \"#171717\",\n warning: \"#fff5bf\", // butter-200 = brand.secondary\n warningForeground: \"#171717\", // ground-900\n ring: \"#c100f1\", // purple-500 = brand.primary\n },\n // Mid — a neutral medium-gray theme (from the Pappery designer \"mid\" palette,\n // mapped onto the ground scale). Sits between light and dark.\n mid: {\n background: \"#737373\", // ground-500 — main surface (designer panel)\n foreground: \"#fafafa\", // ground-50\n card: \"#525252\", // ground-600 — elevated items (designer item-bg)\n cardForeground: \"#fafafa\",\n surface: \"#525252\", // ground-600 (designer canvas/pane)\n surfaceForeground: \"#fafafa\",\n border: \"#a3a3a3\", // ground-400 (designer border — lighter so it reads on the gray)\n input: \"#404040\", // ground-700 (designer input-bg)\n muted: \"#525252\", // ground-600\n mutedForeground: \"#e5e5e5\", // ground-200 (designer text-secondary)\n accent: \"#404040\", // ground-700 (designer item-hover-bg)\n accentForeground: \"#fafafa\",\n primary: \"#c100f1\", // brand stays consistent across themes\n primaryForeground: \"#ffffff\",\n secondary: \"#525252\", // ground-600\n secondaryForeground: \"#fafafa\",\n destructive: \"#ef4444\", // red-500\n destructiveForeground: \"#ffffff\",\n success: \"#CDEA19\", // lime — functional semantic only\n successForeground: \"#171717\",\n warning: \"#fff5bf\", // butter-200\n warningForeground: \"#171717\",\n ring: \"#c100f1\",\n },\n dark: {\n background: \"#171717\", // ground-900 — designer canvas (deepest)\n foreground: \"#fafafa\", // ground-50\n card: \"#262626\", // ground-800 — designer panel-bg (elevated over bg)\n cardForeground: \"#fafafa\",\n surface: \"#1a1a1a\", // designer item-hover depth\n surfaceForeground: \"#f5f5f5\",\n border: \"#404040\", // ground-700 — designer border (reads on the dark)\n input: \"#262626\", // ground-800\n muted: \"#262626\", // ground-800\n mutedForeground: \"#a3a3a3\", // ground-400\n accent: \"#404040\", // ground-700 — neutral elevated/hover (designer item-hover)\n accentForeground: \"#fafafa\",\n primary: \"#c100f1\", // purple-500 — brand stays consistent (D8)\n primaryForeground: \"#ffffff\",\n secondary: \"#262626\", // ground-800\n secondaryForeground: \"#f5f5f5\",\n destructive: \"#ef4444\", // red-500 (slightly lighter for dark)\n destructiveForeground: \"#ffffff\",\n success: \"#CDEA19\", // lime — functional semantic only\n successForeground: \"#0a0a0a\",\n warning: \"#221600\", // butter-950 surface\n warningForeground: \"#fffad0\", // butter-100\n ring: \"#c100f1\", // purple-500 = brand.primary\n },\n },\n\n /* ============================================================== *\n * TYPOGRAPHY *\n * ============================================================== */\n\n fontFamily: {\n sans: 'Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n display: 'Gabarito, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n mono: 'ui-monospace, \"SFMono-Regular\", \"Menlo\", \"Consolas\", monospace',\n },\n\n /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */\n typeScale: {\n \"display-xl\": { family: \"display\", size: \"3rem\", weight: 400, lineHeight: \"1.15\" },\n display: { family: \"display\", size: \"2.25rem\", weight: 400, lineHeight: \"1.15\" },\n \"heading-xl\": { family: \"display\", size: \"1.875rem\", weight: 400, lineHeight: \"1.2\" },\n heading: { family: \"display\", size: \"1.5rem\", weight: 400, lineHeight: \"1.2\" },\n subheading: { family: \"display\", size: \"1.25rem\", weight: 400, lineHeight: \"1.4\" },\n \"body-lg\": { family: \"sans\", size: \"1rem\", weight: 400, lineHeight: \"1.625\" },\n body: { family: \"sans\", size: \"0.875rem\", weight: 400, lineHeight: \"1.625\" },\n \"body-sm\": { family: \"sans\", size: \"0.75rem\", weight: 500, lineHeight: \"1.625\" },\n caption: { family: \"sans\", size: \"0.75rem\", weight: 400, lineHeight: \"1.625\" },\n \"caption-xs\": { family: \"sans\", size: \"0.625rem\", weight: 400, lineHeight: \"1.625\" },\n\n /* --- \"Eyebrow\" family — uppercase tracked label used above headlines, --- *\n * on badges, and on section markers. `eyebrow` is the canonical name; *\n * `overline` (Material parlance), `kicker` (editorial parlance) and *\n * `label` (legacy) are aliases of the same scale so consumers can pick *\n * whichever vocabulary reads best in their context. `eyebrow-sm` is *\n * the compact variant for badge-sized chips and tiny status pills. */\n eyebrow: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n \"eyebrow-sm\": {\n family: \"sans\",\n size: \"0.625rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n overline: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n kicker: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n label: {\n family: \"sans\",\n size: \"0.75rem\",\n weight: 600,\n lineHeight: \"1\",\n letterSpacing: \"0.1em\",\n textTransform: \"uppercase\" as const,\n },\n },\n\n /* ============================================================== *\n * GEOMETRY *\n * ============================================================== */\n\n radius: {\n base: \"0.5rem\",\n sm: \"calc(0.5rem - 4px)\",\n md: \"calc(0.5rem - 2px)\",\n lg: \"calc(0.5rem + 2px)\",\n xl: \"calc(0.5rem + 4px)\",\n full: \"9999px\",\n },\n\n /* ============================================================== *\n * Z-INDEX — semantic layering scale *\n * ============================================================== */\n\n zIndex: {\n dropdown: 40,\n sticky: 50,\n fixed: 60,\n modal: 100,\n popover: 110,\n tooltip: 120,\n },\n\n shadow: {\n natural:\n \"0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06)\",\n elevated:\n \"0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 3px 3px -1.5px rgba(0, 0, 0, 0.06), 0 6px 6px -3px rgba(0, 0, 0, 0.06), 0 12px 12px -6px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04), 0 24px 24px 2px rgba(0, 0, 0, 0.1)\",\n },\n\n /* ============================================================== *\n * ANIMATION *\n * ============================================================== */\n\n animation: {\n \"accordion-down\": \"accordion-down 0.2s ease-out\",\n \"accordion-up\": \"accordion-up 0.2s ease-out\",\n \"caret-blink\": \"caret-blink 1.25s ease-out infinite\",\n },\n} as const;\n\nexport type Tokens = typeof tokens;\nexport type SemanticTokens = typeof tokens.semantic.light;\n"]}
package/dist/fonts.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /* Hilum UI fonts — generated by scripts/build-fonts.mjs. Do not edit by hand. */
2
- /* Inter (variable, 100-900) + Instrument Serif (400 + italic), latin + latin-ext subsets. */
2
+ /* Inter (variable, 100-900) + Gabarito (400-900), latin + latin-ext subsets. */
3
3
 
4
4
  @font-face {
5
5
  font-family: 'Inter';
@@ -38,37 +38,110 @@
38
38
  }
39
39
 
40
40
  @font-face {
41
- font-family: 'Instrument Serif';
41
+ font-family: 'Gabarito';
42
42
  font-style: normal;
43
43
  font-display: swap;
44
44
  font-weight: 400;
45
- src: url('./fonts/instrument-serif-latin-400-normal.woff2') format('woff2');
45
+ src: url('./fonts/gabarito-latin-400-normal.woff2') format('woff2');
46
46
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
47
47
  }
48
48
 
49
49
  @font-face {
50
- font-family: 'Instrument Serif';
51
- font-style: italic;
50
+ font-family: 'Gabarito';
51
+ font-style: normal;
52
52
  font-display: swap;
53
53
  font-weight: 400;
54
- src: url('./fonts/instrument-serif-latin-400-italic.woff2') format('woff2');
54
+ src: url('./fonts/gabarito-latin-ext-400-normal.woff2') format('woff2');
55
+ unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
56
+ }
57
+
58
+ @font-face {
59
+ font-family: 'Gabarito';
60
+ font-style: normal;
61
+ font-display: swap;
62
+ font-weight: 500;
63
+ src: url('./fonts/gabarito-latin-500-normal.woff2') format('woff2');
55
64
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
56
65
  }
57
66
 
58
67
  @font-face {
59
- font-family: 'Instrument Serif';
68
+ font-family: 'Gabarito';
60
69
  font-style: normal;
61
70
  font-display: swap;
62
- font-weight: 400;
63
- src: url('./fonts/instrument-serif-latin-ext-400-normal.woff2') format('woff2');
71
+ font-weight: 500;
72
+ src: url('./fonts/gabarito-latin-ext-500-normal.woff2') format('woff2');
64
73
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
65
74
  }
66
75
 
67
76
  @font-face {
68
- font-family: 'Instrument Serif';
69
- font-style: italic;
77
+ font-family: 'Gabarito';
78
+ font-style: normal;
70
79
  font-display: swap;
71
- font-weight: 400;
72
- src: url('./fonts/instrument-serif-latin-ext-400-italic.woff2') format('woff2');
80
+ font-weight: 600;
81
+ src: url('./fonts/gabarito-latin-600-normal.woff2') format('woff2');
82
+ unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
83
+ }
84
+
85
+ @font-face {
86
+ font-family: 'Gabarito';
87
+ font-style: normal;
88
+ font-display: swap;
89
+ font-weight: 600;
90
+ src: url('./fonts/gabarito-latin-ext-600-normal.woff2') format('woff2');
73
91
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
74
92
  }
93
+
94
+ @font-face {
95
+ font-family: 'Gabarito';
96
+ font-style: normal;
97
+ font-display: swap;
98
+ font-weight: 700;
99
+ src: url('./fonts/gabarito-latin-700-normal.woff2') format('woff2');
100
+ unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
101
+ }
102
+
103
+ @font-face {
104
+ font-family: 'Gabarito';
105
+ font-style: normal;
106
+ font-display: swap;
107
+ font-weight: 700;
108
+ src: url('./fonts/gabarito-latin-ext-700-normal.woff2') format('woff2');
109
+ unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
110
+ }
111
+
112
+ @font-face {
113
+ font-family: 'Gabarito';
114
+ font-style: normal;
115
+ font-display: swap;
116
+ font-weight: 800;
117
+ src: url('./fonts/gabarito-latin-800-normal.woff2') format('woff2');
118
+ unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
119
+ }
120
+
121
+ @font-face {
122
+ font-family: 'Gabarito';
123
+ font-style: normal;
124
+ font-display: swap;
125
+ font-weight: 800;
126
+ src: url('./fonts/gabarito-latin-ext-800-normal.woff2') format('woff2');
127
+ unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
128
+ }
129
+
130
+ @font-face {
131
+ font-family: 'Gabarito';
132
+ font-style: normal;
133
+ font-display: swap;
134
+ font-weight: 900;
135
+ src: url('./fonts/gabarito-latin-900-normal.woff2') format('woff2');
136
+ unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
137
+ }
138
+
139
+ @font-face {
140
+ font-family: 'Gabarito';
141
+ font-style: normal;
142
+ font-display: swap;
143
+ font-weight: 900;
144
+ src: url('./fonts/gabarito-latin-ext-900-normal.woff2') format('woff2');
145
+ unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
146
+ }
147
+
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { tokens } from './chunk-H6JZQWX3.js';
1
+ import { tokens } from './chunk-5JX2YKJM.js';
2
2
  import { clsx } from 'clsx';
3
3
  import { twMerge } from 'tailwind-merge';
4
4
  import * as React17 from 'react';
package/dist/tokens.css CHANGED
@@ -41,7 +41,7 @@
41
41
  --color-destructive: #dc2626;
42
42
 
43
43
  --font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
44
- --font-serif: "Instrument Serif", ui-serif, Georgia, serif;
44
+ --font-display: Gabarito, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
45
45
  --font-mono: ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace;
46
46
 
47
47
  --radius-base: 0.5rem;
@@ -201,35 +201,35 @@
201
201
  @custom-variant dark (&:where([data-theme="dark"], [data-theme="dark"] *, .dark, .dark *));
202
202
 
203
203
  @utility display-xl {
204
- font-family: var(--font-serif);
204
+ font-family: var(--font-display);
205
205
  font-size: 3rem;
206
206
  font-weight: 400;
207
207
  line-height: 1.15;
208
208
  }
209
209
 
210
210
  @utility display {
211
- font-family: var(--font-serif);
211
+ font-family: var(--font-display);
212
212
  font-size: 2.25rem;
213
213
  font-weight: 400;
214
214
  line-height: 1.15;
215
215
  }
216
216
 
217
217
  @utility heading-xl {
218
- font-family: var(--font-serif);
218
+ font-family: var(--font-display);
219
219
  font-size: 1.875rem;
220
220
  font-weight: 400;
221
221
  line-height: 1.2;
222
222
  }
223
223
 
224
224
  @utility heading {
225
- font-family: var(--font-serif);
225
+ font-family: var(--font-display);
226
226
  font-size: 1.5rem;
227
227
  font-weight: 400;
228
228
  line-height: 1.2;
229
229
  }
230
230
 
231
231
  @utility subheading {
232
- font-family: var(--font-serif);
232
+ font-family: var(--font-display);
233
233
  font-size: 1.25rem;
234
234
  font-weight: 400;
235
235
  line-height: 1.4;
package/dist/tokens.d.ts CHANGED
@@ -122,37 +122,37 @@ declare const tokens: {
122
122
  };
123
123
  readonly fontFamily: {
124
124
  readonly sans: "Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif";
125
- readonly serif: "\"Instrument Serif\", ui-serif, Georgia, serif";
125
+ readonly display: "Gabarito, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif";
126
126
  readonly mono: "ui-monospace, \"SFMono-Regular\", \"Menlo\", \"Consolas\", monospace";
127
127
  };
128
128
  /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */
129
129
  readonly typeScale: {
130
130
  readonly "display-xl": {
131
- readonly family: "serif";
131
+ readonly family: "display";
132
132
  readonly size: "3rem";
133
133
  readonly weight: 400;
134
134
  readonly lineHeight: "1.15";
135
135
  };
136
136
  readonly display: {
137
- readonly family: "serif";
137
+ readonly family: "display";
138
138
  readonly size: "2.25rem";
139
139
  readonly weight: 400;
140
140
  readonly lineHeight: "1.15";
141
141
  };
142
142
  readonly "heading-xl": {
143
- readonly family: "serif";
143
+ readonly family: "display";
144
144
  readonly size: "1.875rem";
145
145
  readonly weight: 400;
146
146
  readonly lineHeight: "1.2";
147
147
  };
148
148
  readonly heading: {
149
- readonly family: "serif";
149
+ readonly family: "display";
150
150
  readonly size: "1.5rem";
151
151
  readonly weight: 400;
152
152
  readonly lineHeight: "1.2";
153
153
  };
154
154
  readonly subheading: {
155
- readonly family: "serif";
155
+ readonly family: "display";
156
156
  readonly size: "1.25rem";
157
157
  readonly weight: 400;
158
158
  readonly lineHeight: "1.4";
package/dist/tokens.js CHANGED
@@ -1,3 +1,3 @@
1
- export { tokens } from './chunk-H6JZQWX3.js';
1
+ export { tokens } from './chunk-5JX2YKJM.js';
2
2
  //# sourceMappingURL=tokens.js.map
3
3
  //# sourceMappingURL=tokens.js.map
package/llms.txt CHANGED
@@ -17,9 +17,10 @@ Peer dependencies: `react@^19`, `react-dom@^19`, `tailwindcss@^4`
17
17
  /* globals.css */
18
18
  @import "tailwindcss";
19
19
  @import "@hilum/ui/tokens.css";
20
+ @import "@hilum/ui/fonts.css";
20
21
  ```
21
22
 
22
- That single import registers all design tokens as CSS custom properties and Tailwind v4 utilities (`bg-brand-primary`, `text-ground-900`, `shadow-natural`, etc.).
23
+ The token import registers all design tokens as CSS custom properties and Tailwind v4 utilities (`bg-brand-primary`, `text-ground-900`, `shadow-natural`, etc.). The font import loads Hilum's self-hosted Inter and Gabarito font files.
23
24
 
24
25
  ---
25
26
 
@@ -103,11 +104,11 @@ Use as Tailwind utilities (e.g. `className="display"`):
103
104
 
104
105
  | Class | Font | Size | Weight | Usage |
105
106
  |---|---|---|---|---|
106
- | `display-xl` | Instrument Serif | 3rem | 400 | Hero H1 |
107
- | `display` | Instrument Serif | 2.25rem | 400 | Page H1 |
108
- | `heading-xl` | Instrument Serif | 1.875rem | 400 | Section headings |
109
- | `heading` | Instrument Serif | 1.5rem | 400 | Card titles |
110
- | `subheading` | Inter | 1.25rem | 400 | Subheadings |
107
+ | `display-xl` | Gabarito | 3rem | 400 | Hero H1 |
108
+ | `display` | Gabarito | 2.25rem | 400 | Page H1 |
109
+ | `heading-xl` | Gabarito | 1.875rem | 400 | Section headings |
110
+ | `heading` | Gabarito | 1.5rem | 400 | Card titles |
111
+ | `subheading` | Gabarito | 1.25rem | 400 | Subheadings |
111
112
  | `body-lg` | Inter | 1rem | 400 | Large body text |
112
113
  | `body` | Inter | 0.875rem | 400 | Default body |
113
114
  | `caption` | Inter | 0.75rem | 400 | Metadata, helper text |
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hilum/ui",
3
- "version": "2.1.2",
3
+ "version": "3.0.0",
4
4
  "private": false,
5
5
  "description": "Hilum UI — design system primitives (Button, Input, Dialog, Combobox, …) + tokens + fonts + icons",
6
6
  "license": "MIT",
@@ -71,7 +71,7 @@
71
71
  },
72
72
  "devDependencies": {
73
73
  "@fontsource-variable/inter": "^5.2.8",
74
- "@fontsource/instrument-serif": "^5.2.8",
74
+ "@fontsource/gabarito": "^5.2.8",
75
75
  "@types/react": "^19.0.0",
76
76
  "@types/react-dom": "^19.0.0",
77
77
  "tailwindcss": "^4.2.0",
@@ -162,17 +162,17 @@ export const tokens = {
162
162
 
163
163
  fontFamily: {
164
164
  sans: 'Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
165
- serif: '"Instrument Serif", ui-serif, Georgia, serif',
165
+ display: 'Gabarito, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
166
166
  mono: 'ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace',
167
167
  },
168
168
 
169
169
  /** Type scale utilities — emitted as Tailwind v4 `@utility` blocks. */
170
170
  typeScale: {
171
- "display-xl": { family: "serif", size: "3rem", weight: 400, lineHeight: "1.15" },
172
- display: { family: "serif", size: "2.25rem", weight: 400, lineHeight: "1.15" },
173
- "heading-xl": { family: "serif", size: "1.875rem", weight: 400, lineHeight: "1.2" },
174
- heading: { family: "serif", size: "1.5rem", weight: 400, lineHeight: "1.2" },
175
- subheading: { family: "serif", size: "1.25rem", weight: 400, lineHeight: "1.4" },
171
+ "display-xl": { family: "display", size: "3rem", weight: 400, lineHeight: "1.15" },
172
+ display: { family: "display", size: "2.25rem", weight: 400, lineHeight: "1.15" },
173
+ "heading-xl": { family: "display", size: "1.875rem", weight: 400, lineHeight: "1.2" },
174
+ heading: { family: "display", size: "1.5rem", weight: 400, lineHeight: "1.2" },
175
+ subheading: { family: "display", size: "1.25rem", weight: 400, lineHeight: "1.4" },
176
176
  "body-lg": { family: "sans", size: "1rem", weight: 400, lineHeight: "1.625" },
177
177
  body: { family: "sans", size: "0.875rem", weight: 400, lineHeight: "1.625" },
178
178
  "body-sm": { family: "sans", size: "0.75rem", weight: 500, lineHeight: "1.625" },