@titan-design/react-ui 0.2.6 → 0.3.0

package/dist/theme/tokens-css.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/theme/tokens/primitives.ts","../../src/theme/tokens/semantic.ts","../../src/theme/config.ts","../../src/theme/tokens-css.ts"],"names":[],"mappings":"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","file":"tokens-css.js","sourcesContent":["/**\n * Primitive Design Tokens\n *\n * Raw values with no semantic meaning. These are the foundation of the design system\n * and should rarely be used directly in components. Use semantic tokens instead.\n */\n\nexport const primitiveColors = {\n  // Blue scale (primary brand)\n  blue: {\n    50: '#EFF6FF',\n    100: '#DBEAFE',\n    200: '#BFDBFE',\n    300: '#93C5FD',\n    400: '#60A5FA',\n    500: '#3B82F6',\n    600: '#5048E5', // Primary main\n    700: '#3832A0', // Primary dark\n    800: '#1E40AF',\n    900: '#1E3A8A',\n  },\n\n  // Green scale (secondary brand)\n  green: {\n    50: '#ECFDF5',\n    100: '#D1FAE5',\n    200: '#A7F3D0',\n    300: '#6EE7B7',\n    400: '#3FC79A', // Secondary light\n    500: '#10B981', // Secondary main\n    600: '#059669',\n    700: '#0B815A', // Secondary dark\n    800: '#065F46',\n    900: '#064E3B',\n  },\n\n  // Teal scale (success)\n  teal: {\n    50: '#F0FDFA',\n    100: '#CCFBF1',\n    200: '#99F6E4',\n    300: '#5EEAD4',\n    400: '#43C6B7', // Success light\n    500: '#14B8A6', // Success main\n    600: '#0D9488',\n    700: '#0E8074', // Success dark\n    800: '#115E59',\n    900: '#134E4A',\n  },\n\n  // Red scale (error)\n  red: {\n    50: '#FEF2F2',\n    100: '#FEE2E2',\n    200: '#FECACA',\n    300: '#FCA5A5',\n    400: '#DA6868', // Error light\n    500: '#EF4444',\n    600: '#D14343', // Error main\n    700: '#922E2E', // Error dark\n    800: '#991B1B',\n    900: '#7F1D1D',\n  },\n\n  // Amber scale (warning)\n  amber: {\n    50: '#FFFBEB',\n    100: '#FEF3C7',\n    200: '#FDE68A',\n    300: '#FCD34D',\n    400: '#FFBF4C', // Warning light\n    500: '#FFB020', // Warning main\n    600: '#B27B16', // Warning dark\n    700: '#B45309',\n    800: '#92400E',\n    900: '#78350F',\n  },\n\n  // Sky/Blue scale (info)\n  sky: {\n    50: '#F0F9FF',\n    100: '#E0F2FE',\n    200: '#BAE6FD',\n    300: '#7DD3FC',\n    400: '#64B6F7', // Info light\n    500: '#2196F3', // Info main\n    600: '#0284C7',\n    700: '#0B79D0', // Info dark\n    800: '#075985',\n    900: '#0C4A6E',\n  },\n\n  // Neutral/Gray scale\n  neutral: {\n    50: '#FAFAFA',\n    100: '#F3F4F6',\n    200: '#E5E7EB',\n    300: '#D1D5DB',\n    400: '#9CA3AF',\n    500: '#6B7280',\n    600: '#4B5563',\n    700: '#374151',\n    800: '#1F2937',\n    900: '#111827',\n    950: '#030712',\n  },\n\n  // Orange scale (accent/brand color)\n  accent: {\n    100: '#FFA860',\n    200: '#FF9630',\n    300: '#FF8500',\n    400: '#FF7900',\n    500: '#F56C00',\n    600: '#E06D10',\n    700: '#D0620C',\n    800: '#B75500',\n    900: '#A34900',\n  },\n\n  // Charcoal scale (dark backgrounds)\n  charcoal: {\n    0: '#6E6E6E',\n    50: '#5D5D5D',\n    100: '#4C4C4C',\n    200: '#3C3C3C',\n    300: '#2C2C2C',\n    400: '#1F1F1F',\n    500: '#1C1C1C',\n    600: '#191919',\n    700: '#161616',\n    800: '#131313',\n    900: '#101010',\n  },\n\n  // Steel scale (cool accent)\n  steel: {\n    100: '#8AA4B8',\n    200: '#7894A8',\n    300: '#678498',\n    400: '#557488',\n    500: '#406D87',\n    600: '#39617A',\n    700: '#32556D',\n    800: '#243D53',\n    900: '#1D3146',\n  },\n\n  // Pure colors\n  white: '#FFFFFF',\n  black: '#000000',\n  transparent: 'transparent',\n} as const\n\n/**\n * Discrete rainbow palette for data visualization\n * Based on Paul Tol's color schemes: https://personal.sron.nl/~pault/#fig:scheme_rainbow_discrete\n */\nexport const discreteRainbow = [\n  '#E8ECFB',\n  '#D9CCE3',\n  '#D1BBD7',\n  '#CAACCB',\n  '#BA8DB4',\n  '#AE76A3',\n  '#AA6F9E',\n  '#994F88',\n  '#882E72',\n  '#1965B0',\n  '#437DBF',\n  '#5289C7',\n  '#6195CF',\n  '#7BAFDE',\n  '#4EB265',\n  '#90C987',\n  '#CAE0AB',\n  '#F7F056',\n  '#F7CB45',\n  '#F6C141',\n  '#F4A736',\n  '#F1932D',\n  '#EE8026',\n  '#E8601C',\n  '#E65518',\n  '#DC050C',\n  '#A5170E',\n  '#72190E',\n  '#42150A',\n] as const\n\n/**\n * Palette indices for discrete rainbow colors at different palette sizes.\n * For a given palette size (index + 1), returns the indices of colors to use.\n */\nconst discreteRainbowPalettes: number[][] = [\n  [10],\n  [10, 26],\n  [10, 18, 26],\n  [10, 15, 18, 26],\n  [10, 14, 15, 18, 26],\n  [10, 14, 15, 17, 18, 26],\n  [9, 10, 14, 15, 17, 18, 26],\n  [9, 10, 14, 15, 17, 18, 23, 26],\n  [9, 10, 14, 15, 17, 18, 23, 26, 28],\n  [9, 10, 14, 15, 17, 18, 21, 24, 26, 28],\n  [9, 10, 12, 14, 15, 17, 18, 21, 24, 26, 28],\n  [3, 6, 9, 10, 12, 14, 15, 17, 18, 21, 24, 26],\n  [3, 6, 9, 10, 12, 14, 15, 16, 17, 18, 21, 24, 26],\n  [3, 6, 9, 10, 12, 14, 15, 16, 17, 18, 20, 22, 24, 26],\n  [3, 6, 9, 10, 12, 14, 15, 16, 17, 18, 20, 22, 24, 26, 28],\n  [3, 5, 7, 9, 10, 12, 14, 15, 16, 17, 18, 20, 22, 24, 26, 28],\n  [3, 5, 7, 8, 9, 10, 12, 14, 15, 16, 17, 18, 20, 22, 24, 26, 28],\n  [3, 5, 7, 8, 9, 10, 12, 14, 15, 16, 17, 18, 20, 22, 24, 26, 27, 28],\n  [2, 4, 5, 7, 8, 9, 10, 12, 14, 15, 16, 17, 18, 20, 22, 24, 26, 27, 28],\n  [2, 4, 5, 7, 8, 9, 10, 11, 13, 14, 15, 16, 17, 18, 20, 22, 24, 26, 27, 28],\n  [2, 4, 5, 7, 8, 9, 10, 11, 13, 14, 15, 16, 17, 18, 19, 21, 23, 25, 26, 27, 28],\n  [2, 4, 5, 7, 8, 9, 10, 11, 13, 14, 15, 16, 17, 18, 19, 21, 23, 25, 26, 27, 28, 29],\n  [1, 2, 4, 5, 7, 8, 9, 10, 11, 13, 14, 15, 16, 17, 18, 19, 21, 23, 25, 26, 27, 28, 29],\n]\n\n/**\n * Get a color from the discrete rainbow palette for a given index and palette size.\n * Colors are optimized for visual distinction at each palette size.\n *\n * @param index - The index of the color in the series (0-based)\n * @param size - The total number of colors needed (1-23)\n * @returns The hex color string\n */\nexport function getDiscreteRainbowColor(index: number, size: number): string {\n  index = Math.max(0, index)\n  size = Math.min(Math.max(1, size), discreteRainbowPalettes.length)\n\n  const palette = discreteRainbowPalettes[size - 1]\n  if (index >= palette.length) index = index % palette.length\n\n  return discreteRainbow[palette[index] - 1]\n}\n\nexport const primitiveTypography = {\n  fontFamilies: {\n    sans: ['Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Helvetica', 'Arial', 'sans-serif'],\n    body: ['Nunito Sans', 'sans-serif'],\n    heading: ['Space Grotesk', 'sans-serif'],\n    mono: ['SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', 'Droid Sans Mono', 'Source Code Pro', 'monospace'],\n  },\n  fontSizes: {\n    xs: '0.75rem',    // 12px\n    sm: '0.875rem',   // 14px\n    base: '1rem',     // 16px\n    lg: '1.125rem',   // 18px\n    xl: '1.5rem',     // 24px\n    '2xl': '2rem',    // 32px\n    '3xl': '2.25rem', // 36px\n    '4xl': '3rem',    // 48px\n    '5xl': '3.5rem',  // 56px\n  },\n  fontWeights: {\n    normal: 400,\n    medium: 500,\n    semibold: 600,\n    bold: 700,\n  },\n  lineHeights: {\n    none: 1,\n    tight: 1.375,\n    snug: 1.5,\n    normal: 1.57,\n    relaxed: 1.66,\n    loose: 1.75,\n  },\n  letterSpacing: {\n    tighter: '-0.05em',\n    tight: '-0.025em',\n    normal: '0em',\n    wide: '0.025em',\n    wider: '0.05em',\n    widest: '0.5px',\n  },\n} as const\n\nexport const primitiveSpacing = {\n  0: '0',\n  px: '1px',\n  0.5: '0.125rem',  // 2px\n  1: '0.25rem',     // 4px\n  1.5: '0.375rem',  // 6px\n  2: '0.5rem',      // 8px\n  2.5: '0.625rem',  // 10px\n  3: '0.75rem',     // 12px\n  3.5: '0.875rem',  // 14px\n  4: '1rem',        // 16px\n  5: '1.25rem',     // 20px\n  6: '1.5rem',      // 24px\n  7: '1.75rem',     // 28px\n  8: '2rem',        // 32px\n  9: '2.25rem',     // 36px\n  10: '2.5rem',     // 40px\n  11: '2.75rem',    // 44px\n  12: '3rem',       // 48px\n  14: '3.5rem',     // 56px\n  16: '4rem',       // 64px\n  20: '5rem',       // 80px\n  24: '6rem',       // 96px\n  28: '7rem',       // 112px\n  32: '8rem',       // 128px\n} as const\n\nexport const primitiveBorderRadius = {\n  none: '0',\n  sm: '4px',\n  DEFAULT: '8px',\n  md: '8px',\n  lg: '12px',\n  xl: '16px',\n  '2xl': '24px',\n  full: '9999px',\n} as const\n\nexport const primitiveShadows = {\n  none: 'none',\n  sm: '0px 1px 2px rgba(100, 116, 139, 0.12)',\n  DEFAULT: '0px 1px 3px rgba(100, 116, 139, 0.12), 0px 1px 2px rgba(100, 116, 139, 0.24)',\n  md: '0px 4px 6px rgba(100, 116, 139, 0.12)',\n  lg: '0px 10px 15px rgba(100, 116, 139, 0.12)',\n  xl: '0px 20px 25px rgba(100, 116, 139, 0.12)',\n  '2xl': '0px 25px 50px rgba(100, 116, 139, 0.25)',\n  inner: 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)',\n} as const\n\nexport const primitiveBreakpoints = {\n  xs: 0,\n  sm: 600,\n  md: 1000,\n  lg: 1200,\n  xl: 1920,\n} as const\n\nexport const primitiveZIndex = {\n  hide: -1,\n  auto: 'auto',\n  base: 0,\n  docked: 10,\n  dropdown: 1000,\n  sticky: 1100,\n  drawer: 1100,\n  banner: 1200,\n  appBar: 1200,\n  overlay: 1300,\n  modal: 1400,\n  popover: 1500,\n  skipLink: 1600,\n  toast: 1700,\n  tooltip: 1800,\n} as const\n","/**\n * Semantic Design Tokens\n *\n * Meaningful tokens following DTCG (Design Tokens Community Group) naming conventions.\n * Pattern: {category}-{intent}-{variant?}-{state?}\n *\n * Categories:\n * - brand-* : Brand colors (primary, secondary, accent)\n * - status-* : Feedback colors (success, error, warning, info)\n * - result-* : Outcome indicators (improve, degrade, inconclusive, neutral)\n * - data-* : Data visualization colors (chart series)\n * - on-* : Text on colored backgrounds\n * - surface-* : Elevated containers (NOT \"paper\")\n * - background-* : Page backgrounds\n * - text-* : Text colors\n * - border-* : Border colors\n * - interactive-* : Hover/focus/active/disabled states\n */\n\nimport { primitiveColors as p, discreteRainbow } from './primitives'\n\n// Light mode semantic colors (default)\nexport const semanticColorsLight = {\n  // Brand colors (brand-*)\n  'brand-primary': p.accent[400],              // #FF7900\n  'brand-primary-light': p.accent[200],        // #FF9630\n  'brand-primary-dark': p.accent[700],         // #D0620C\n  'brand-primary-subtle': 'rgba(255, 121, 0, 0.08)',\n  'brand-primary-hover': p.accent[500],\n  'brand-primary-active': p.accent[600],\n\n  'brand-secondary': p.steel[500],           // #406D87\n  'brand-secondary-light': p.steel[300],     // #678498\n  'brand-secondary-dark': p.steel[700],      // #32556D\n  'brand-secondary-subtle': 'rgba(64, 109, 135, 0.08)',\n  'brand-secondary-hover': p.steel[600],\n  'brand-secondary-active': p.steel[700],\n\n  // Text on brand backgrounds (on-*)\n  'on-brand-primary': p.white,\n  'on-brand-secondary': p.white,\n\n  // Status colors (status-*)\n  'status-success': p.teal[500],             // #14B8A6\n  'status-success-light': p.teal[400],       // #43C6B7\n  'status-success-dark': p.teal[700],        // #0E8074\n  'status-success-subtle': p.teal[50],\n\n  'status-error': p.red[600],                // #D14343\n  'status-error-light': p.red[400],          // #DA6868\n  'status-error-dark': p.red[700],           // #922E2E\n  'status-error-subtle': p.red[50],\n\n  'status-warning': p.amber[500],            // #FFB020\n  'status-warning-light': p.amber[400],      // #FFBF4C\n  'status-warning-dark': p.amber[600],       // #B27B16\n  'status-warning-subtle': p.amber[50],\n\n  'status-info': p.sky[500],                 // #2196F3\n  'status-info-light': p.sky[400],           // #64B6F7\n  'status-info-dark': p.sky[700],            // #0B79D0\n  'status-info-subtle': p.sky[50],\n\n  // Text on status backgrounds (on-status-*)\n  'on-status-success': p.white,\n  'on-status-error': p.white,\n  'on-status-warning': p.white,\n  'on-status-info': p.white,\n\n  // Result/outcome indicators (result-*)\n  'result-improve': '#4caf50',                // Green - positive outcome\n  'result-improve-light': 'rgba(76, 175, 80, 0.12)',\n  'result-improve-dark': '#248a24',\n  'result-degrade': '#ef5350',                // Red - negative outcome\n  'result-degrade-light': 'rgba(239, 83, 80, 0.12)',\n  'result-degrade-dark': '#b30000',\n  'result-inconclusive': '#9E9A97',           // Gray - no clear result\n  'result-inconclusive-light': 'rgba(158, 154, 151, 0.12)',\n  'result-neutral': p.neutral[500],           // Neutral baseline\n\n  // Text on result backgrounds (on-result-*)\n  'on-result-improve': p.white,\n  'on-result-degrade': p.white,\n  'on-result-inconclusive': p.white,\n\n  // Data visualization colors (data-*)\n  // First 10 colors from discrete rainbow optimized for charts\n  'data-1': discreteRainbow[9],               // #1965B0 - Blue\n  'data-2': discreteRainbow[14],              // #4EB265 - Green\n  'data-3': discreteRainbow[17],              // #F7F056 - Yellow\n  'data-4': discreteRainbow[25],              // #DC050C - Red\n  'data-5': discreteRainbow[8],               // #882E72 - Purple\n  'data-6': discreteRainbow[20],              // #F4A736 - Orange\n  'data-7': discreteRainbow[13],              // #7BAFDE - Light Blue\n  'data-8': discreteRainbow[15],              // #90C987 - Light Green\n  'data-9': discreteRainbow[3],               // #CAACCB - Lavender\n  'data-10': discreteRainbow[22],             // #EE8026 - Dark Orange\n\n  // Text colors (text-*)\n  'text-primary': '#121828',\n  'text-secondary': '#65748B',\n  'text-tertiary': p.neutral[400],\n  'text-disabled': 'rgba(55, 65, 81, 0.48)',\n  'text-inverse': p.white,\n  'text-link': p.blue[600],\n  'text-link-hover': p.blue[700],\n\n  // Surface colors (surface-*) - for elevated containers\n  'surface-base': p.white,\n  'surface-elevated': p.neutral[50],          // #FAFAFA - slightly off-white for elevated cards\n  'surface-raised': p.neutral[100],           // #F3F4F6 - light gray for raised cards\n  'surface-overlay': p.white,\n  'surface-input': p.neutral[50],             // Input field background (filled variant)\n\n  // Background colors (background-*)\n  'background-base': '#EBEBEB',\n  'background-default': p.white,\n  'background-subtle': p.neutral[50],\n\n  // Border colors (border-*)\n  'border-default': '#E8E9EB',\n  'border-subtle': p.neutral[100],\n  'border-strong': p.neutral[300],\n  'border-focus': p.blue[600],\n  'border-input': p.neutral[300],             // Input field border\n  'border-input-hover': p.neutral[400],       // Input field border on hover\n  'border-input-focus': p.blue[600],          // Input field border on focus\n  'border-input-error': p.red[600],           // Input field border on error\n\n  // Interactive states (interactive-*)\n  'interactive-hover': 'rgba(55, 65, 81, 0.04)',\n  'interactive-focus': 'rgba(55, 65, 81, 0.12)',\n  'interactive-active': 'rgba(55, 65, 81, 0.16)',\n  'interactive-selected': 'rgba(55, 65, 81, 0.08)',\n  'interactive-disabled': 'rgba(55, 65, 81, 0.12)',\n  'interactive-disabled-text': 'rgba(55, 65, 81, 0.26)',\n\n  // Divider\n  'divider': '#E8E9EB',\n\n  // Avatar default\n  'avatar-background': p.neutral[500],\n  'avatar-text': p.white,\n} as const\n\n// Dark mode semantic colors\nexport const semanticColorsDark = {\n  // Brand colors stay the same in dark mode\n  'brand-primary': p.accent[400],\n  'brand-primary-light': p.accent[200],\n  'brand-primary-dark': p.accent[700],\n  'brand-primary-subtle': 'rgba(255, 121, 0, 0.12)',\n  'brand-primary-hover': p.accent[300],\n  'brand-primary-active': p.accent[200],\n\n  'brand-secondary': p.steel[500],\n  'brand-secondary-light': p.steel[300],\n  'brand-secondary-dark': p.steel[700],\n  'brand-secondary-subtle': 'rgba(64, 109, 135, 0.12)',\n  'brand-secondary-hover': p.steel[400],\n  'brand-secondary-active': p.steel[300],\n\n  // Text on brand backgrounds\n  'on-brand-primary': p.white,\n  'on-brand-secondary': p.white,\n\n  // Status colors\n  'status-success': p.teal[500],\n  'status-success-light': p.teal[400],\n  'status-success-dark': p.teal[700],\n  'status-success-subtle': 'rgba(20, 184, 166, 0.12)',\n\n  'status-error': p.red[600],\n  'status-error-light': p.red[400],\n  'status-error-dark': p.red[700],\n  'status-error-subtle': 'rgba(209, 67, 67, 0.12)',\n\n  'status-warning': p.amber[500],\n  'status-warning-light': p.amber[400],\n  'status-warning-dark': p.amber[600],\n  'status-warning-subtle': 'rgba(255, 176, 32, 0.12)',\n\n  'status-info': p.sky[500],\n  'status-info-light': p.sky[400],\n  'status-info-dark': p.sky[700],\n  'status-info-subtle': 'rgba(33, 150, 243, 0.12)',\n\n  // Text on status backgrounds\n  'on-status-success': p.white,\n  'on-status-error': p.white,\n  'on-status-warning': p.white,\n  'on-status-info': p.white,\n\n  // Result/outcome indicators (result-*)\n  'result-improve': '#4caf50',\n  'result-improve-light': 'rgba(76, 175, 80, 0.16)',\n  'result-improve-dark': '#248a24',\n  'result-degrade': '#ef5350',\n  'result-degrade-light': 'rgba(239, 83, 80, 0.16)',\n  'result-degrade-dark': '#b30000',\n  'result-inconclusive': '#9E9A97',\n  'result-inconclusive-light': 'rgba(158, 154, 151, 0.16)',\n  'result-neutral': p.neutral[400],\n\n  // Text on result backgrounds\n  'on-result-improve': p.white,\n  'on-result-degrade': p.white,\n  'on-result-inconclusive': p.white,\n\n  // Data visualization colors (same in dark mode for consistency)\n  'data-1': discreteRainbow[9],\n  'data-2': discreteRainbow[14],\n  'data-3': discreteRainbow[17],\n  'data-4': discreteRainbow[25],\n  'data-5': discreteRainbow[8],\n  'data-6': discreteRainbow[20],\n  'data-7': discreteRainbow[13],\n  'data-8': discreteRainbow[15],\n  'data-9': discreteRainbow[3],\n  'data-10': discreteRainbow[22],\n\n  // Text colors - inverted for dark mode\n  'text-primary': p.neutral[100],\n  'text-secondary': p.neutral[400],\n  'text-tertiary': p.neutral[500],\n  'text-disabled': 'rgba(255, 255, 255, 0.38)',\n  'text-inverse': p.neutral[900],\n  'text-link': '#828DF8',\n  'text-link-hover': p.blue[400],\n\n  // Surface colors - dark backgrounds\n  'surface-base': p.charcoal[700],         // #161616 - main surface\n  'surface-elevated': p.charcoal[600],     // #191919 - elevated surface\n  'surface-raised': p.charcoal[500],       // #1C1C1C - raised surface\n  'surface-overlay': p.charcoal[600],      // #191919 - overlay surface\n  'surface-input': p.charcoal[600],        // #191919 - input surface\n\n  // Background colors\n  'background-base': p.charcoal[900],      // #101010 - darkest charcoal\n  'background-default': p.charcoal[700],    // #161616 - main background\n  'background-subtle': p.charcoal[500],     // #1C1C1C - subtle background\n\n  // Border colors\n  'border-default': p.charcoal[400],       // #1F1F1F - default border\n  'border-subtle': p.charcoal[500],        // #1C1C1C - subtle border\n  'border-strong': p.charcoal[300],        // #2C2C2C - strong border\n  'border-focus': '#828DF8',\n  'border-input': p.neutral[600],\n  'border-input-hover': p.neutral[500],\n  'border-input-focus': '#828DF8',\n  'border-input-error': p.red[500],\n\n  // Interactive states\n  'interactive-hover': 'rgba(255, 255, 255, 0.04)',\n  'interactive-focus': 'rgba(255, 255, 255, 0.12)',\n  'interactive-active': 'rgba(255, 255, 255, 0.16)',\n  'interactive-selected': 'rgba(255, 255, 255, 0.08)',\n  'interactive-disabled': 'rgba(255, 255, 255, 0.12)',\n  'interactive-disabled-text': 'rgba(255, 255, 255, 0.26)',\n\n  // Divider\n  'divider': p.charcoal[400],              // #1F1F1F - divider color\n\n  // Avatar default\n  'avatar-background': p.neutral[600],\n  'avatar-text': p.white,\n} as const\n\n// Typography tokens matching existing app\nexport const semanticTypography = {\n  // Headings (Space Grotesk)\n  h1: {\n    fontFamily: 'heading',\n    fontSize: '3.5rem',\n    fontWeight: 700,\n    lineHeight: 1.375,\n  },\n  h2: {\n    fontFamily: 'heading',\n    fontSize: '3rem',\n    fontWeight: 700,\n    lineHeight: 1.375,\n  },\n  h3: {\n    fontFamily: 'heading',\n    fontSize: '2.25rem',\n    fontWeight: 700,\n    lineHeight: 1.375,\n  },\n  h4: {\n    fontFamily: 'heading',\n    fontSize: '2rem',\n    fontWeight: 700,\n    lineHeight: 1.375,\n  },\n  h5: {\n    fontFamily: 'heading',\n    fontSize: '1.5rem',\n    fontWeight: 600,\n    lineHeight: 1.375,\n  },\n  h6: {\n    fontFamily: 'heading',\n    fontSize: '1.125rem',\n    fontWeight: 600,\n    lineHeight: 1.375,\n  },\n\n  // Body text (Nunito Sans)\n  body1: {\n    fontFamily: 'body',\n    fontSize: '1rem',\n    fontWeight: 400,\n    lineHeight: 1.5,\n  },\n  body2: {\n    fontFamily: 'body',\n    fontSize: '0.875rem',\n    fontWeight: 400,\n    lineHeight: 1.57,\n  },\n  subtitle1: {\n    fontFamily: 'body',\n    fontSize: '1rem',\n    fontWeight: 500,\n    lineHeight: 1.75,\n  },\n  subtitle2: {\n    fontFamily: 'body',\n    fontSize: '0.875rem',\n    fontWeight: 500,\n    lineHeight: 1.57,\n  },\n  caption: {\n    fontFamily: 'body',\n    fontSize: '0.75rem',\n    fontWeight: 400,\n    lineHeight: 1.66,\n  },\n  overline: {\n    fontFamily: 'body',\n    fontSize: '0.75rem',\n    fontWeight: 600,\n    lineHeight: 2.5,\n    letterSpacing: '0.5px',\n    textTransform: 'uppercase' as const,\n  },\n  button: {\n    fontFamily: 'sans',\n    fontSize: '0.875rem',\n    fontWeight: 600,\n    lineHeight: 1.75,\n  },\n} as const\n\n// Button size tokens\nexport const buttonSizes = {\n  sm: {\n    paddingX: '16px',\n    paddingY: '6px',\n    fontSize: '0.875rem',\n  },\n  md: {\n    paddingX: '20px',\n    paddingY: '8px',\n    fontSize: '0.875rem',\n  },\n  lg: {\n    paddingX: '24px',\n    paddingY: '11px',\n    fontSize: '1rem',\n  },\n} as const\n\n// Export type for theme mode\nexport type ThemeMode = 'light' | 'dark'\n\n// Helper to get semantic colors based on mode\nexport function getSemanticColors(mode: ThemeMode) {\n  return mode === 'dark' ? semanticColorsDark : semanticColorsLight\n}\n","/**\n * Theme Configuration\n *\n * Maps semantic tokens to CSS custom properties for runtime theming.\n * Dark mode is the default theme.\n */\n\nimport { semanticColorsLight, semanticColorsDark, type ThemeMode } from './tokens/semantic'\n\n// Theme-independent custom properties: identical in light and dark in\n// global.css (RGB glow decompositions, font families, animation tokens). Kept\n// as literals since they are not part of the semantic COLOR maps, and spread\n// into both theme maps so codegen mirrors global.css exactly.\nconst themeIndependentCSSVars = {\n  // RGB decomposed values for glow shadows\n  '--color-brand-primary-rgb': '255, 121, 0',\n  '--color-brand-secondary-rgb': '64, 109, 135',\n  '--color-status-success-rgb': '20, 184, 166',\n  '--color-status-error-rgb': '209, 67, 67',\n  '--color-status-warning-rgb': '255, 176, 32',\n  '--color-status-info-rgb': '33, 150, 243',\n  '--color-background-base-rgb': '16, 16, 16',\n\n  // Font families\n  '--font-family-sans': \"'Inter'\",\n  '--font-family-body': \"'Nunito Sans'\",\n  '--font-family-heading': \"'Space Grotesk'\",\n  '--font-family-mono': \"'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace\",\n\n  // Animation tokens\n  '--ease-out': 'cubic-bezier(0.22, 1, 0.36, 1)',\n  '--ease-in-out': 'cubic-bezier(0.65, 0, 0.35, 1)',\n  '--ease-spring': 'cubic-bezier(0.34, 1.56, 0.64, 1)',\n  '--duration-fast': '150ms',\n  '--duration-normal': '250ms',\n  '--duration-slow': '400ms',\n} as const\n\n// CSS custom properties for light mode\nexport const lightThemeCSSVars = {\n  '--color-brand-primary': semanticColorsLight['brand-primary'],\n  '--color-brand-primary-light': semanticColorsLight['brand-primary-light'],\n  '--color-brand-primary-dark': semanticColorsLight['brand-primary-dark'],\n  '--color-brand-primary-subtle': semanticColorsLight['brand-primary-subtle'],\n  '--color-brand-secondary': semanticColorsLight['brand-secondary'],\n  '--color-brand-secondary-light': semanticColorsLight['brand-secondary-light'],\n  '--color-brand-secondary-dark': semanticColorsLight['brand-secondary-dark'],\n  '--color-brand-secondary-subtle': semanticColorsLight['brand-secondary-subtle'],\n\n  '--color-on-brand-primary': semanticColorsLight['on-brand-primary'],\n  '--color-on-brand-secondary': semanticColorsLight['on-brand-secondary'],\n\n  '--color-status-success': semanticColorsLight['status-success'],\n  '--color-status-success-subtle': semanticColorsLight['status-success-subtle'],\n  '--color-status-error': semanticColorsLight['status-error'],\n  '--color-status-error-subtle': semanticColorsLight['status-error-subtle'],\n  '--color-status-warning': semanticColorsLight['status-warning'],\n  '--color-status-warning-subtle': semanticColorsLight['status-warning-subtle'],\n  '--color-status-info': semanticColorsLight['status-info'],\n  '--color-status-info-subtle': semanticColorsLight['status-info-subtle'],\n\n  '--color-text-primary': semanticColorsLight['text-primary'],\n  '--color-text-secondary': semanticColorsLight['text-secondary'],\n  '--color-text-tertiary': semanticColorsLight['text-tertiary'],\n  '--color-text-disabled': semanticColorsLight['text-disabled'],\n  '--color-text-inverse': semanticColorsLight['text-inverse'],\n  '--color-text-link': semanticColorsLight['text-link'],\n\n  '--color-surface-base': semanticColorsLight['surface-base'],\n  '--color-surface-elevated': semanticColorsLight['surface-elevated'],\n  '--color-surface-raised': semanticColorsLight['surface-raised'],\n\n  '--color-background-base': semanticColorsLight['background-base'],\n  '--color-background-default': semanticColorsLight['background-default'],\n  '--color-background-subtle': semanticColorsLight['background-subtle'],\n\n  '--color-border-default': semanticColorsLight['border-default'],\n  '--color-border-subtle': semanticColorsLight['border-subtle'],\n  '--color-border-strong': semanticColorsLight['border-strong'],\n  '--color-border-focus': semanticColorsLight['border-focus'],\n\n  '--color-interactive-hover': semanticColorsLight['interactive-hover'],\n  '--color-interactive-focus': semanticColorsLight['interactive-focus'],\n  '--color-interactive-active': semanticColorsLight['interactive-active'],\n  '--color-interactive-selected': semanticColorsLight['interactive-selected'],\n  '--color-interactive-disabled': semanticColorsLight['interactive-disabled'],\n\n  '--color-divider': semanticColorsLight['divider'],\n\n  '--color-brand-primary-hover': semanticColorsLight['brand-primary-hover'],\n  '--color-brand-primary-active': semanticColorsLight['brand-primary-active'],\n  '--color-brand-secondary-hover': semanticColorsLight['brand-secondary-hover'],\n  '--color-brand-secondary-active': semanticColorsLight['brand-secondary-active'],\n\n  '--color-status-success-light': semanticColorsLight['status-success-light'],\n  '--color-status-success-dark': semanticColorsLight['status-success-dark'],\n  '--color-status-error-light': semanticColorsLight['status-error-light'],\n  '--color-status-error-dark': semanticColorsLight['status-error-dark'],\n  '--color-status-warning-light': semanticColorsLight['status-warning-light'],\n  '--color-status-warning-dark': semanticColorsLight['status-warning-dark'],\n  '--color-status-info-light': semanticColorsLight['status-info-light'],\n  '--color-status-info-dark': semanticColorsLight['status-info-dark'],\n\n  '--color-on-status-success': semanticColorsLight['on-status-success'],\n  '--color-on-status-error': semanticColorsLight['on-status-error'],\n  '--color-on-status-warning': semanticColorsLight['on-status-warning'],\n  '--color-on-status-info': semanticColorsLight['on-status-info'],\n\n  '--color-result-improve': semanticColorsLight['result-improve'],\n  '--color-result-improve-light': semanticColorsLight['result-improve-light'],\n  '--color-result-improve-dark': semanticColorsLight['result-improve-dark'],\n  '--color-result-degrade': semanticColorsLight['result-degrade'],\n  '--color-result-degrade-light': semanticColorsLight['result-degrade-light'],\n  '--color-result-degrade-dark': semanticColorsLight['result-degrade-dark'],\n  '--color-result-inconclusive': semanticColorsLight['result-inconclusive'],\n  '--color-result-inconclusive-light': semanticColorsLight['result-inconclusive-light'],\n  '--color-result-neutral': semanticColorsLight['result-neutral'],\n\n  '--color-on-result-improve': semanticColorsLight['on-result-improve'],\n  '--color-on-result-degrade': semanticColorsLight['on-result-degrade'],\n  '--color-on-result-inconclusive': semanticColorsLight['on-result-inconclusive'],\n\n  '--color-data-1': semanticColorsLight['data-1'],\n  '--color-data-2': semanticColorsLight['data-2'],\n  '--color-data-3': semanticColorsLight['data-3'],\n  '--color-data-4': semanticColorsLight['data-4'],\n  '--color-data-5': semanticColorsLight['data-5'],\n  '--color-data-6': semanticColorsLight['data-6'],\n  '--color-data-7': semanticColorsLight['data-7'],\n  '--color-data-8': semanticColorsLight['data-8'],\n  '--color-data-9': semanticColorsLight['data-9'],\n  '--color-data-10': semanticColorsLight['data-10'],\n\n  '--color-text-link-hover': semanticColorsLight['text-link-hover'],\n\n  '--color-surface-overlay': semanticColorsLight['surface-overlay'],\n  '--color-surface-input': semanticColorsLight['surface-input'],\n\n  '--color-border-input': semanticColorsLight['border-input'],\n  '--color-border-input-hover': semanticColorsLight['border-input-hover'],\n  '--color-border-input-focus': semanticColorsLight['border-input-focus'],\n  '--color-border-input-error': semanticColorsLight['border-input-error'],\n\n  '--color-interactive-disabled-text': semanticColorsLight['interactive-disabled-text'],\n\n  '--color-avatar-background': semanticColorsLight['avatar-background'],\n  '--color-avatar-text': semanticColorsLight['avatar-text'],\n\n  ...themeIndependentCSSVars,\n} as const\n\n// CSS custom properties for dark mode (default)\nexport const darkThemeCSSVars = {\n  '--color-brand-primary': semanticColorsDark['brand-primary'],\n  '--color-brand-primary-light': semanticColorsDark['brand-primary-light'],\n  '--color-brand-primary-dark': semanticColorsDark['brand-primary-dark'],\n  '--color-brand-primary-subtle': semanticColorsDark['brand-primary-subtle'],\n  '--color-brand-secondary': semanticColorsDark['brand-secondary'],\n  '--color-brand-secondary-light': semanticColorsDark['brand-secondary-light'],\n  '--color-brand-secondary-dark': semanticColorsDark['brand-secondary-dark'],\n  '--color-brand-secondary-subtle': semanticColorsDark['brand-secondary-subtle'],\n\n  '--color-on-brand-primary': semanticColorsDark['on-brand-primary'],\n  '--color-on-brand-secondary': semanticColorsDark['on-brand-secondary'],\n\n  '--color-status-success': semanticColorsDark['status-success'],\n  '--color-status-success-subtle': semanticColorsDark['status-success-subtle'],\n  '--color-status-error': semanticColorsDark['status-error'],\n  '--color-status-error-subtle': semanticColorsDark['status-error-subtle'],\n  '--color-status-warning': semanticColorsDark['status-warning'],\n  '--color-status-warning-subtle': semanticColorsDark['status-warning-subtle'],\n  '--color-status-info': semanticColorsDark['status-info'],\n  '--color-status-info-subtle': semanticColorsDark['status-info-subtle'],\n\n  '--color-text-primary': semanticColorsDark['text-primary'],\n  '--color-text-secondary': semanticColorsDark['text-secondary'],\n  '--color-text-tertiary': semanticColorsDark['text-tertiary'],\n  '--color-text-disabled': semanticColorsDark['text-disabled'],\n  '--color-text-inverse': semanticColorsDark['text-inverse'],\n  '--color-text-link': semanticColorsDark['text-link'],\n\n  '--color-surface-base': semanticColorsDark['surface-base'],\n  '--color-surface-elevated': semanticColorsDark['surface-elevated'],\n  '--color-surface-raised': semanticColorsDark['surface-raised'],\n\n  '--color-background-base': semanticColorsDark['background-base'],\n  '--color-background-default': semanticColorsDark['background-default'],\n  '--color-background-subtle': semanticColorsDark['background-subtle'],\n\n  '--color-border-default': semanticColorsDark['border-default'],\n  '--color-border-subtle': semanticColorsDark['border-subtle'],\n  '--color-border-strong': semanticColorsDark['border-strong'],\n  '--color-border-focus': semanticColorsDark['border-focus'],\n\n  '--color-interactive-hover': semanticColorsDark['interactive-hover'],\n  '--color-interactive-focus': semanticColorsDark['interactive-focus'],\n  '--color-interactive-active': semanticColorsDark['interactive-active'],\n  '--color-interactive-selected': semanticColorsDark['interactive-selected'],\n  '--color-interactive-disabled': semanticColorsDark['interactive-disabled'],\n\n  '--color-divider': semanticColorsDark['divider'],\n\n  '--color-brand-primary-hover': semanticColorsDark['brand-primary-hover'],\n  '--color-brand-primary-active': semanticColorsDark['brand-primary-active'],\n  '--color-brand-secondary-hover': semanticColorsDark['brand-secondary-hover'],\n  '--color-brand-secondary-active': semanticColorsDark['brand-secondary-active'],\n\n  '--color-status-success-light': semanticColorsDark['status-success-light'],\n  '--color-status-success-dark': semanticColorsDark['status-success-dark'],\n  '--color-status-error-light': semanticColorsDark['status-error-light'],\n  '--color-status-error-dark': semanticColorsDark['status-error-dark'],\n  '--color-status-warning-light': semanticColorsDark['status-warning-light'],\n  '--color-status-warning-dark': semanticColorsDark['status-warning-dark'],\n  '--color-status-info-light': semanticColorsDark['status-info-light'],\n  '--color-status-info-dark': semanticColorsDark['status-info-dark'],\n\n  '--color-on-status-success': semanticColorsDark['on-status-success'],\n  '--color-on-status-error': semanticColorsDark['on-status-error'],\n  '--color-on-status-warning': semanticColorsDark['on-status-warning'],\n  '--color-on-status-info': semanticColorsDark['on-status-info'],\n\n  '--color-result-improve': semanticColorsDark['result-improve'],\n  '--color-result-improve-light': semanticColorsDark['result-improve-light'],\n  '--color-result-improve-dark': semanticColorsDark['result-improve-dark'],\n  '--color-result-degrade': semanticColorsDark['result-degrade'],\n  '--color-result-degrade-light': semanticColorsDark['result-degrade-light'],\n  '--color-result-degrade-dark': semanticColorsDark['result-degrade-dark'],\n  '--color-result-inconclusive': semanticColorsDark['result-inconclusive'],\n  '--color-result-inconclusive-light': semanticColorsDark['result-inconclusive-light'],\n  '--color-result-neutral': semanticColorsDark['result-neutral'],\n\n  '--color-on-result-improve': semanticColorsDark['on-result-improve'],\n  '--color-on-result-degrade': semanticColorsDark['on-result-degrade'],\n  '--color-on-result-inconclusive': semanticColorsDark['on-result-inconclusive'],\n\n  '--color-data-1': semanticColorsDark['data-1'],\n  '--color-data-2': semanticColorsDark['data-2'],\n  '--color-data-3': semanticColorsDark['data-3'],\n  '--color-data-4': semanticColorsDark['data-4'],\n  '--color-data-5': semanticColorsDark['data-5'],\n  '--color-data-6': semanticColorsDark['data-6'],\n  '--color-data-7': semanticColorsDark['data-7'],\n  '--color-data-8': semanticColorsDark['data-8'],\n  '--color-data-9': semanticColorsDark['data-9'],\n  '--color-data-10': semanticColorsDark['data-10'],\n\n  '--color-text-link-hover': semanticColorsDark['text-link-hover'],\n\n  '--color-surface-overlay': semanticColorsDark['surface-overlay'],\n  '--color-surface-input': semanticColorsDark['surface-input'],\n\n  '--color-border-input': semanticColorsDark['border-input'],\n  '--color-border-input-hover': semanticColorsDark['border-input-hover'],\n  '--color-border-input-focus': semanticColorsDark['border-input-focus'],\n  '--color-border-input-error': semanticColorsDark['border-input-error'],\n\n  '--color-interactive-disabled-text': semanticColorsDark['interactive-disabled-text'],\n\n  '--color-avatar-background': semanticColorsDark['avatar-background'],\n  '--color-avatar-text': semanticColorsDark['avatar-text'],\n\n  ...themeIndependentCSSVars,\n} as const\n\n// Helper to get CSS vars for a theme mode\nexport function getThemeCSSVars(mode: ThemeMode) {\n  return mode === 'dark' ? darkThemeCSSVars : lightThemeCSSVars\n}\n\n// Gluestack UI theme configuration\nexport const gluestackConfig = {\n  tokens: {\n    colors: {\n      // Map to our semantic colors via CSS vars\n      primary500: 'var(--color-brand-primary)',\n      primary600: 'var(--color-brand-primary-dark)',\n      primary400: 'var(--color-brand-primary-light)',\n\n      secondary500: 'var(--color-brand-secondary)',\n      secondary600: 'var(--color-brand-secondary-dark)',\n      secondary400: 'var(--color-brand-secondary-light)',\n\n      success500: 'var(--color-status-success)',\n      error500: 'var(--color-status-error)',\n      warning500: 'var(--color-status-warning)',\n      info500: 'var(--color-status-info)',\n\n      textLight: 'var(--color-text-primary)',\n      textDark: 'var(--color-text-inverse)',\n\n      backgroundLight: 'var(--color-background-default)',\n      backgroundDark: 'var(--color-surface-base)',\n    },\n    space: {\n      '0': 0,\n      '1': 4,\n      '2': 8,\n      '3': 12,\n      '4': 16,\n      '5': 20,\n      '6': 24,\n      '8': 32,\n      '10': 40,\n      '12': 48,\n      '16': 64,\n      '20': 80,\n      '24': 96,\n    },\n    radii: {\n      none: 0,\n      sm: 4,\n      md: 8,\n      lg: 12,\n      xl: 16,\n      '2xl': 24,\n      full: 9999,\n    },\n    fontSizes: {\n      xs: 12,\n      sm: 14,\n      md: 16,\n      lg: 18,\n      xl: 20,\n      '2xl': 24,\n      '3xl': 30,\n      '4xl': 36,\n      '5xl': 48,\n    },\n  },\n  aliases: {\n    bg: 'backgroundColor',\n    p: 'padding',\n    px: 'paddingHorizontal',\n    py: 'paddingVertical',\n    m: 'margin',\n    mx: 'marginHorizontal',\n    my: 'marginVertical',\n    h: 'height',\n    w: 'width',\n    rounded: 'borderRadius',\n  },\n} as const\n\nexport type ThemeConfig = typeof gluestackConfig\n","/**\n * Token CSS Generator\n *\n * Emits a static `:root {}` CSS block from the canonical theme token maps\n * (`darkThemeCSSVars` / `lightThemeCSSVars`). Those maps mirror every `:root`\n * custom property in `theme/global.css` — completeness and value parity are\n * enforced by `config.completeness.test.ts`, so HTML prototypes that import the\n * generated stylesheet resolve to the exact same values as the design system.\n * Pure codegen: deterministic and diffable against source.\n *\n * Dark mode is the default (`:root`); light mode is activated with `.light`,\n * matching the convention in `theme/global.css`.\n */\n\nimport { darkThemeCSSVars, lightThemeCSSVars } from './config'\n\ntype CSSVarMap = Record<string, string>\n\nconst GENERATED_HEADER = '/* Generated from theme token maps. Do not edit by hand. */'\n\nfunction formatBlock(selector: string, vars: CSSVarMap): string {\n  const declarations = Object.entries(vars)\n    .map(([name, value]) => `  ${name}: ${value};`)\n    .join('\\n')\n  return `${selector} {\\n${declarations}\\n}`\n}\n\n/**\n * Build the full `tokens.css` contents: a default (dark) `:root` block plus a\n * `.light` override block, driven entirely by the exported token maps.\n */\nexport function generateTokensCss(): string {\n  const root = formatBlock(':root', darkThemeCSSVars)\n  const light = formatBlock('.light, :root.light', lightThemeCSSVars)\n  return `${GENERATED_HEADER}\\n\\n${root}\\n\\n${light}\\n`\n}\n"]}

package/dist/theme/tokens-css.mjs

@@ -0,0 +1,24 @@
+import { darkThemeCSSVars, lightThemeCSSVars } from '../chunk-7XPB4NAO.mjs';
+
+// src/theme/tokens-css.ts
+var GENERATED_HEADER = "/* Generated from theme token maps. Do not edit by hand. */";
+function formatBlock(selector, vars) {
+  const declarations = Object.entries(vars).map(([name, value]) => `  ${name}: ${value};`).join("\n");
+  return `${selector} {
+${declarations}
+}`;
+}
+function generateTokensCss() {
+  const root = formatBlock(":root", darkThemeCSSVars);
+  const light = formatBlock(".light, :root.light", lightThemeCSSVars);
+  return `${GENERATED_HEADER}
+
+${root}
+
+${light}
+`;
+}
+
+export { generateTokensCss };
+//# sourceMappingURL=tokens-css.mjs.map
+//# sourceMappingURL=tokens-css.mjs.map

package/dist/theme/tokens-css.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/theme/tokens-css.ts"],"names":[],"mappings":";;;AAkBA,IAAM,gBAAA,GAAmB,6DAAA;AAEzB,SAAS,WAAA,CAAY,UAAkB,IAAA,EAAyB;AAC9D,EAAA,MAAM,eAAe,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAA,CACrC,GAAA,CAAI,CAAC,CAAC,IAAA,EAAM,KAAK,CAAA,KAAM,KAAK,IAAI,CAAA,EAAA,EAAK,KAAK,CAAA,CAAA,CAAG,CAAA,CAC7C,KAAK,IAAI,CAAA;AACZ,EAAA,OAAO,GAAG,QAAQ,CAAA;AAAA,EAAO,YAAY;AAAA,CAAA,CAAA;AACvC;AAMO,SAAS,iBAAA,GAA4B;AAC1C,EAAA,MAAM,IAAA,GAAO,WAAA,CAAY,OAAA,EAAS,gBAAgB,CAAA;AAClD,EAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,qBAAA,EAAuB,iBAAiB,CAAA;AAClE,EAAA,OAAO,GAAG,gBAAgB;;AAAA,EAAO,IAAI;;AAAA,EAAO,KAAK;AAAA,CAAA;AACnD","file":"tokens-css.mjs","sourcesContent":["/**\n * Token CSS Generator\n *\n * Emits a static `:root {}` CSS block from the canonical theme token maps\n * (`darkThemeCSSVars` / `lightThemeCSSVars`). Those maps mirror every `:root`\n * custom property in `theme/global.css` — completeness and value parity are\n * enforced by `config.completeness.test.ts`, so HTML prototypes that import the\n * generated stylesheet resolve to the exact same values as the design system.\n * Pure codegen: deterministic and diffable against source.\n *\n * Dark mode is the default (`:root`); light mode is activated with `.light`,\n * matching the convention in `theme/global.css`.\n */\n\nimport { darkThemeCSSVars, lightThemeCSSVars } from './config'\n\ntype CSSVarMap = Record<string, string>\n\nconst GENERATED_HEADER = '/* Generated from theme token maps. Do not edit by hand. */'\n\nfunction formatBlock(selector: string, vars: CSSVarMap): string {\n  const declarations = Object.entries(vars)\n    .map(([name, value]) => `  ${name}: ${value};`)\n    .join('\\n')\n  return `${selector} {\\n${declarations}\\n}`\n}\n\n/**\n * Build the full `tokens.css` contents: a default (dark) `:root` block plus a\n * `.light` override block, driven entirely by the exported token maps.\n */\nexport function generateTokensCss(): string {\n  const root = formatBlock(':root', darkThemeCSSVars)\n  const light = formatBlock('.light, :root.light', lightThemeCSSVars)\n  return `${GENERATED_HEADER}\\n\\n${root}\\n\\n${light}\\n`\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@titan-design/react-ui",
-  "version": "0.2.6",
+  "version": "0.3.0",
   "description": "Cross-platform design system built on Gluestack UI",
   "author": "Henry Jewkes",
   "license": "MIT",
@@ -25,6 +25,12 @@
       "import": "./dist/index.mjs",
       "require": "./dist/index.js"
     },
+    "./bodymap": {
+      "react-native": "./src/bodymap.ts",
+      "types": "./dist/bodymap.d.ts",
+      "import": "./dist/bodymap.mjs",
+      "require": "./dist/bodymap.js"
+    },
     "./theme": {
       "react-native": "./src/theme/index.ts",
       "types": "./dist/theme/index.d.ts",
@@ -38,7 +44,7 @@
     "node": ">=20.0.0"
   },
   "scripts": {
-    "build": "tsup",
+    "build": "tsup && node scripts/generate-tokens-css.mjs",
     "dev": "tsup --watch",
     "lint": "eslint src/",
     "lint:borders": "bash scripts/check-border-classes.sh",
@@ -50,9 +56,12 @@
     "build-storybook": "storybook build",
     "test:visual": "playwright test",
     "test:visual:update": "playwright test --update-snapshots",
+    "extract-css": "node scripts/extract-css-properties.mjs",
+    "design-freeze": "node scripts/design-freeze.mjs",
     "specimen": "vite --config specimen/vite.config.ts",
     "specimen:compare": "vite --config specimen/vite.config.ts --open /comparison.html",
     "test:visual:compare": "playwright test --config playwright.comparison.config.ts",
+    "test:visual:tokens": "playwright test --config playwright.tokens.config.ts",
     "prepublishOnly": "tsup && vitest --run"
   },
   "peerDependencies": {
@@ -62,19 +71,27 @@
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
     "react-native": ">=0.72.0",
+    "react-native-body-highlighter": ">=3.0.0",
+    "react-native-svg": ">=15.0.0",
     "react-native-web": ">=0.19.0"
   },
   "peerDependenciesMeta": {
+    "lucide-react-native": {
+      "optional": true
+    },
     "nativewind": {
       "optional": true
     },
     "react-native": {
       "optional": true
     },
-    "react-native-web": {
+    "react-native-body-highlighter": {
       "optional": true
     },
-    "lucide-react-native": {
+    "react-native-svg": {
+      "optional": true
+    },
+    "react-native-web": {
       "optional": true
     }
   },
@@ -85,7 +102,6 @@
     "tailwind-merge": "^2.6.0"
   },
   "devDependencies": {
-    "nativewind": "^4.2.1",
     "@eslint/js": "^10.0.1",
     "@playwright/test": "^1.58.2",
     "@storybook/addon-a11y": "^10.2.0",
@@ -108,9 +124,13 @@
     "jest-axe": "^9.0.0",
     "jsdom": "^25.0.0",
     "lucide-react": "^0.469.0",
+    "nativewind": "^4.2.1",
     "prettier": "^3.8.1",
     "react": "^18.3.0",
     "react-dom": "^18.3.0",
+    "react-hook-form": "^7.54.2",
+    "react-native-body-highlighter": "^3.2.0",
+    "react-native-svg": "^15.15.5",
     "react-native-web": "^0.19.0",
     "storybook": "^10.2.0",
     "tailwindcss": "^3.4.0",

package/src/bodymap.ts

@@ -0,0 +1,37 @@
+// Subpath entry: @titan-design/react-ui/bodymap
+//
+// Isolates the runtime surface that depends on `react-native-body-highlighter`
+// (imported at module top-level by BodyMap.tsx and muscleTaxonomy.ts) so the
+// main barrel can stay body-highlighter-free and tree-shakeable. Everything
+// re-exported here transitively pulls that native SVG dependency; consumers who
+// render the muscle map import from this subpath instead of the root barrel.
+export { BodyMap, type BodyMapProps, type BodyMapData } from './components/custom/Workout/BodyMap'
+export {
+  BodyMapDetailPanel,
+  type BodyMapDetailPanelProps,
+  type ContributingExercise,
+  type UpcomingExercise,
+} from './components/custom/Workout/BodyMapDetailPanel'
+export {
+  TrainingStatusPage,
+  deriveTrainingSummary,
+  toBodyMapData,
+  type TrainingStatusPageProps,
+  type TrainingStatusMuscle,
+  type TrainingStatusSummary,
+} from './components/custom/Workout/TrainingStatusPage'
+export {
+  MuscleGroup,
+  SimpleMuscleGroup,
+  SIMPLE_TO_DETAILED,
+  DETAILED_TO_SIMPLE,
+  MUSCLE_TO_SVG_SLUGS,
+  MUSCLE_TO_CATEGORY,
+  MUSCLE_DISPLAY_NAMES,
+  SIMPLE_DISPLAY_NAMES,
+  DEFAULT_VOLUME_LANDMARKS,
+  VOLUME_STATUS_LABELS,
+  getHeatmapColor,
+  type MovementCategory,
+  type VolumeLandmarks,
+} from './components/custom/Workout/muscleTaxonomy'

package/src/components/custom/DateTime/DateTime.stories.tsx

@@ -169,7 +169,7 @@ export const UsageExample: Story = {
       <View className="gap-2 p-4 bg-surface-elevated rounded-lg max-w-md">
         <Text className="text-lg font-semibold text-text-primary mb-2">Upcoming Events</Text>
         {items.map((item, index) => (
-          <View key={index} className="flex-row justify-between items-center py-2 border-b border-border-default">
+          <View key={index} className="flex-row justify-between items-center py-2 border-b border-border">
             <Text className="text-text-primary">{item.title}</Text>
             <DateTime value={item.date} format="relative" color="secondary" className="text-sm" />
           </View>

package/src/components/custom/Gauge/Gauge.stories.tsx

@@ -0,0 +1,45 @@
+import type { Meta, StoryObj } from '@storybook/react-vite'
+import { Gauge } from './Gauge'
+
+const meta: Meta<typeof Gauge> = {
+  title: 'Custom/Gauge',
+  component: Gauge,
+  tags: ['autodocs'],
+  argTypes: {
+    value: { control: { type: 'range', min: 0, max: 100, step: 1 } },
+    size: { control: { type: 'range', min: 100, max: 320, step: 10 } },
+  },
+}
+export default meta
+type Story = StoryObj<typeof Gauge>
+
+export const Healthy: Story = {
+  args: { value: 88, unit: '%', label: 'Health', size: 180 },
+}
+
+export const Warning: Story = {
+  args: { value: 68, unit: '%', label: 'Health', size: 180 },
+}
+
+export const Critical: Story = {
+  args: { value: 34, unit: '%', label: 'Health', size: 180 },
+}
+
+/** A codewatch-style status readout — arbitrary domain, no unit. */
+export const ArbitraryDomain: Story = {
+  args: { value: 7.4, min: 0, max: 10, label: 'Maintainability', size: 200 },
+}
+
+/** Single-color override ignores the threshold bands. */
+export const OverrideColor: Story = {
+  args: { value: 55, unit: '%', label: 'Coverage', color: '#5B9BD5', size: 180 },
+}
+
+/** Value above max is clamped for the fill but shown verbatim. */
+export const OverMax: Story = {
+  args: { value: 120, unit: '%', label: 'Load', size: 180 },
+}
+
+export const Zero: Story = {
+  args: { value: 0, unit: '%', label: 'Health', size: 180 },
+}

package/src/components/custom/Gauge/Gauge.test.tsx

@@ -0,0 +1,71 @@
+import { describe, it, expect } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import { axe } from 'jest-axe'
+import { Gauge } from './Gauge'
+
+describe('Gauge', () => {
+  it('renders the arc as a fixed set of segments', () => {
+    render(<Gauge value={50} />)
+    expect(screen.getAllByTestId('gauge-segment')).toHaveLength(40)
+  })
+
+  it('renders the value, unit, and label', () => {
+    render(<Gauge value={82} unit="%" label="Health" />)
+    expect(screen.getByTestId('gauge-value')).toHaveTextContent('82')
+    expect(screen.getByTestId('gauge-label')).toHaveTextContent('Health')
+    expect(screen.getByText('%')).toBeInTheDocument()
+  })
+
+  it('colors the value by the active status band', () => {
+    const { rerender } = render(<Gauge value={30} />)
+    expect(screen.getByTestId('gauge-value')).toHaveStyle({ color: '#D14343' })
+    rerender(<Gauge value={70} />)
+    expect(screen.getByTestId('gauge-value')).toHaveStyle({ color: '#FFB020' })
+    rerender(<Gauge value={90} />)
+    expect(screen.getByTestId('gauge-value')).toHaveStyle({ color: '#14B8A6' })
+  })
+
+  it('honors a single-color override over thresholds', () => {
+    render(<Gauge value={10} color="#5B9BD5" />)
+    expect(screen.getByTestId('gauge-value')).toHaveStyle({ color: '#5B9BD5' })
+  })
+
+  it('clamps an out-of-range value without crashing', () => {
+    render(<Gauge value={150} unit="%" />)
+    // Displayed value is verbatim; only the fill is clamped.
+    expect(screen.getByTestId('gauge-value')).toHaveTextContent('150')
+    expect(screen.getAllByTestId('gauge-segment')).toHaveLength(40)
+  })
+
+  it('supports an arbitrary min/max domain', () => {
+    render(<Gauge value={5} min={0} max={10} label="Score" />)
+    expect(screen.getByTestId('gauge-value')).toHaveTextContent('5')
+  })
+
+  it('respects custom thresholds', () => {
+    render(
+      <Gauge
+        value={45}
+        thresholds={[
+          { value: 0, color: '#14B8A6' },
+          { value: 50, color: '#D14343' },
+        ]}
+      />,
+    )
+    expect(screen.getByTestId('gauge-value')).toHaveStyle({ color: '#14B8A6' })
+  })
+
+  describe('accessibility', () => {
+    it('exposes an image role with a descriptive label', () => {
+      render(<Gauge value={82} unit="%" label="Health" />)
+      const gauge = screen.getByTestId('gauge')
+      expect(gauge).toHaveAttribute('role', 'img')
+      expect(gauge.getAttribute('aria-label')).toContain('Health: 82% of 100')
+    })
+
+    it('has no accessibility violations', async () => {
+      const { container } = render(<Gauge value={82} unit="%" label="Health" />)
+      expect(await axe(container)).toHaveNoViolations()
+    })
+  })
+})

package/src/components/custom/Gauge/Gauge.tsx

@@ -0,0 +1,167 @@
+import { View, Text, type ViewProps } from 'react-native'
+import { cn } from '../../../utils/cn'
+
+export interface GaugeThreshold {
+  /** Band start, in the gauge's value units. */
+  value: number
+  /** Color applied to filled segments at or above this band. */
+  color: string
+}
+
+export interface GaugeProps extends Omit<ViewProps, 'children'> {
+  /** Current value. Clamped to [min, max]. */
+  value: number
+  min?: number
+  max?: number
+  /** Diameter in px. */
+  size?: number
+  /** Caption under the big number. */
+  label?: string
+  /** Unit suffix beside the big number (e.g. "%"). */
+  unit?: string
+  /**
+   * Band coloring, ascending by `value`. A filled segment takes the color of
+   * the highest band whose `value` it reaches. Defaults to Titan status tokens
+   * (red < 60, amber < 80, green ≥ 80 on a 0–100 scale).
+   */
+  thresholds?: GaugeThreshold[]
+  /** Single-color override for filled segments (ignores `thresholds`). */
+  color?: string
+  className?: string
+}
+
+const STATUS_SUCCESS = '#14B8A6'
+const STATUS_WARNING = '#FFB020'
+const STATUS_ERROR = '#D14343'
+const TRACK = 'rgba(255,255,255,0.08)'
+
+/** Titan status-token bands for a 0–100 score. */
+const DEFAULT_THRESHOLDS: GaugeThreshold[] = [
+  { value: 0, color: STATUS_ERROR },
+  { value: 60, color: STATUS_WARNING },
+  { value: 80, color: STATUS_SUCCESS },
+]
+
+const ARC_START = 135
+const ARC_SWEEP = 270
+const SEGMENTS = 40
+
+function clamp01(n: number): number {
+  if (Number.isNaN(n)) return 0
+  return Math.max(0, Math.min(1, n))
+}
+
+function formatValue(v: number): string {
+  return Number.isInteger(v) ? `${v}` : v.toFixed(1)
+}
+
+/** Color of the highest band whose start value the fraction reaches. */
+function bandColor(fraction: number, bands: GaugeThreshold[], min: number, max: number): string {
+  const value = min + fraction * (max - min)
+  const sorted = [...bands].sort((a, b) => a.value - b.value)
+  let color = sorted[0]?.color ?? STATUS_SUCCESS
+  for (const band of sorted) {
+    if (value >= band.value) color = band.color
+  }
+  return color
+}
+
+interface Tick {
+  key: number
+  left: number
+  top: number
+  rotate: string
+  color: string
+}
+
+/** Position + color each radial segment of the arc. */
+function buildTicks(fill: number, size: number, activeColor: (f: number) => string): Tick[] {
+  const center = size / 2
+  const radius = center - size * 0.08
+  return Array.from({ length: SEGMENTS }, (_, i) => {
+    const fraction = (i + 0.5) / SEGMENTS
+    const deg = ARC_START + fraction * ARC_SWEEP
+    const rad = (deg * Math.PI) / 180
+    return {
+      key: i,
+      left: center + radius * Math.cos(rad),
+      top: center + radius * Math.sin(rad),
+      rotate: `${deg - 90}deg`,
+      color: fraction <= fill ? activeColor(fraction) : TRACK,
+    }
+  })
+}
+
+/**
+ * SVG-free radial gauge (absolutely-positioned segment Views), matching the
+ * codebase's chart convention so it renders identically on web and native. The
+ * 270° arc fills with band colors as the value rises; the center reuses the
+ * Metric visual language (large bold value + unit + caption). Ideal for a 0–100
+ * health / quality score.
+ */
+export function Gauge({
+  value,
+  min = 0,
+  max = 100,
+  size = 160,
+  label,
+  unit,
+  thresholds = DEFAULT_THRESHOLDS,
+  color,
+  className,
+  ...props
+}: GaugeProps) {
+  const span = max - min || 1
+  const fill = clamp01((value - min) / span)
+  const activeColor = (f: number) => color ?? bandColor(f, thresholds, min, max)
+  const ticks = buildTicks(fill, size, activeColor)
+  const displayColor = color ?? bandColor(fill, thresholds, min, max)
+  const tickLength = size * 0.11
+  const tickThickness = Math.max(2, (size * 0.9) / SEGMENTS)
+
+  const ariaLabel = `${label ? `${label}: ` : ''}${formatValue(value)}${unit ?? ''} of ${formatValue(max)}`
+
+  return (
+    <View
+      className={cn('relative', className)}
+      style={{ width: size, height: size }}
+      accessibilityRole="image"
+      accessibilityLabel={ariaLabel}
+      testID="gauge"
+      {...props}
+    >
+      {ticks.map((t) => (
+        <View
+          key={t.key}
+          accessibilityElementsHidden
+          testID="gauge-segment"
+          style={{
+            position: 'absolute',
+            left: t.left - tickThickness / 2,
+            top: t.top - tickLength / 2,
+            width: tickThickness,
+            height: tickLength,
+            borderRadius: tickThickness / 2,
+            backgroundColor: t.color,
+            transform: [{ rotate: t.rotate }],
+          }}
+        />
+      ))}
+
+      {/* Center readout — Metric visual language. */}
+      <View style={{ position: 'absolute', top: 0, left: 0, width: size, height: size }} className="items-center justify-center">
+        <View className="flex-row items-baseline gap-0.5">
+          <Text testID="gauge-value" className="text-3xl font-bold" style={{ color: displayColor }}>
+            {formatValue(value)}
+          </Text>
+          {unit && <Text className="text-sm text-text-tertiary">{unit}</Text>}
+        </View>
+        {label && (
+          <Text testID="gauge-label" className="text-xs text-text-secondary mt-1">
+            {label}
+          </Text>
+        )}
+      </View>
+    </View>
+  )
+}

package/src/components/custom/Gauge/index.ts

@@ -0,0 +1,2 @@
+export { Gauge } from './Gauge'
+export type { GaugeProps, GaugeThreshold } from './Gauge'