@tokis/tokens 1.0.1 → 1.1.0

package/dist/css/generate-css-vars.d.ts

@@ -1,2 +1,47 @@
-export declare function generateCssVariables(scope?: string): string;
+/**
+ * Tokis CSS variable generator.
+ *
+ * Converts TypeScript primitive token objects into valid CSS custom property
+ * declarations. This module serves two purposes:
+ *
+ *  1. **Build time** — `scripts/generate-tokens-css.ts` calls
+ *     `generateAllCssVars()` and writes the output to
+ *     `packages/theme/src/base/variables.css`, keeping CSS and TypeScript
+ *     in perfect sync. Run with: `pnpm tokens:generate`.
+ *
+ *  2. **Runtime injection** (escape hatch for CSS-in-JS contexts) — call
+ *     `generateAllCssVars()` and inject via a `<style>` tag. Not recommended
+ *     for production; prefer the precompiled static CSS.
+ *
+ * Generated variable names exactly match those referenced in
+ * `packages/theme/src/base/variables.css` and all component CSS files.
+ *
+ * Zero dependencies — plain TypeScript, no React, no DOM.
+ */
+export declare function generateLightCssVars(): string;
+/**
+ * Returns only the CSS custom properties that change in dark mode.
+ * Spacing, typography, radius, motion, and z-index are theme-invariant.
+ */
+export declare function generateDarkCssVars(): string;
+/**
+ * Returns the complete CSS variable stylesheet:
+ * the light `:root` block followed by dark `[data-theme="dark"]` overrides.
+ *
+ * **Build-time usage** (`scripts/generate-tokens-css.ts`):
+ * ```ts
+ * import { generateAllCssVars } from '@tokis/tokens';
+ * import { writeFileSync } from 'node:fs';
+ * writeFileSync(
+ *   'packages/theme/src/base/variables.css',
+ *   generateAllCssVars(),
+ * );
+ * ```
+ */
+export declare function generateAllCssVars(): string;
+/**
+ * @deprecated Use `generateLightCssVars()` or `generateAllCssVars()` instead.
+ * The `scope` parameter is ignored; the selector is always `:root`.
+ */
+export declare function generateCssVariables(_scope?: string): string;
 //# sourceMappingURL=generate-css-vars.d.ts.map

package/dist/css/generate-css-vars.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generate-css-vars.d.ts","sourceRoot":"","sources":["../../src/css/generate-css-vars.ts"],"names":[],"mappings":"AAaA,wBAAgB,oBAAoB,CAAC,KAAK,SAAU,GAAG,MAAM,CAgD5D"}
+{"version":3,"file":"generate-css-vars.d.ts","sourceRoot":"","sources":["../../src/css/generate-css-vars.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AA6BH,wBAAgB,oBAAoB,IAAI,MAAM,CAwG7C;AAID;;;GAGG;AACH,wBAAgB,mBAAmB,IAAI,MAAM,CAqE5C;AAID;;;;;;;;;;;;;GAaG;AACH,wBAAgB,kBAAkB,IAAI,MAAM,CAc3C;AAID;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,SAAU,GAAG,MAAM,CAE7D"}

package/dist/css/generate-css-vars.js

@@ -1,48 +1,248 @@
+/**
+ * Tokis CSS variable generator.
+ *
+ * Converts TypeScript primitive token objects into valid CSS custom property
+ * declarations. This module serves two purposes:
+ *
+ *  1. **Build time** — `scripts/generate-tokens-css.ts` calls
+ *     `generateAllCssVars()` and writes the output to
+ *     `packages/theme/src/base/variables.css`, keeping CSS and TypeScript
+ *     in perfect sync. Run with: `pnpm tokens:generate`.
+ *
+ *  2. **Runtime injection** (escape hatch for CSS-in-JS contexts) — call
+ *     `generateAllCssVars()` and inject via a `<style>` tag. Not recommended
+ *     for production; prefer the precompiled static CSS.
+ *
+ * Generated variable names exactly match those referenced in
+ * `packages/theme/src/base/variables.css` and all component CSS files.
+ *
+ * Zero dependencies — plain TypeScript, no React, no DOM.
+ */
 import { colors } from '../primitives/colors.js';
 import { spacing } from '../primitives/spacing.js';
-import { radius } from '../primitives/radius.js';
 import { typography } from '../primitives/typography.js';
+import { radius } from '../primitives/radius.js';
 import { shadows } from '../primitives/shadows.js';
 import { motion } from '../primitives/motion.js';
 import { zIndex } from '../primitives/zIndex.js';
 import { breakpoints } from '../primitives/breakpoints.js';
-import { semanticColors } from '../semantic/color.js';
-import { surface } from '../semantic/surface.js';
-import { text } from '../semantic/text.js';
-import { border } from '../semantic/border.js';
-export function generateCssVariables(scope = ':root') {
-    const vars = [];
-    const prefix = '--tokis-';
-    const add = (name, value) => {
-        vars.push(`  ${prefix}${name}: ${String(value)};`);
-    };
-    // Primitive: Colors
-    Object.entries(colors).forEach(([key, value]) => add(`color-${key}`, value));
-    // Primitive: Spacing
-    Object.entries(spacing).forEach(([key, value]) => add(`spacing-${key}`, value));
-    // Primitive: Radius
-    Object.entries(radius).forEach(([key, value]) => add(`radius-${key}`, value));
-    // Primitive: Typography
-    Object.entries(typography.fontSize).forEach(([key, value]) => add(`font-size-${key}`, value));
-    Object.entries(typography.fontWeight).forEach(([key, value]) => add(`font-weight-${key}`, String(value)));
-    add('font-family', typography.fontFamily);
-    // Primitive: Shadows
-    Object.entries(shadows).forEach(([key, value]) => add(`shadow-${key}`, value));
-    // Primitive: Motion
-    Object.entries(motion.duration).forEach(([key, value]) => add(`motion-duration-${key}`, value));
-    Object.entries(motion.easing).forEach(([key, value]) => add(`motion-easing-${key}`, value));
-    // Primitive: Z-Index
-    Object.entries(zIndex).forEach(([key, value]) => add(`z-index-${key}`, String(value)));
-    // Primitive: Breakpoints
-    Object.entries(breakpoints).forEach(([key, value]) => add(`breakpoint-${key}`, value));
-    // Semantic: Colors
-    Object.entries(semanticColors).forEach(([key, value]) => add(`semantic-color-${key}`, value));
-    // Semantic: Surface
-    Object.entries(surface).forEach(([key, value]) => add(`surface-${key}`, value));
-    // Semantic: Text
-    Object.entries(text).forEach(([key, value]) => add(`text-${key}`, value));
-    // Semantic: Border
-    Object.entries(border).forEach(([key, value]) => add(`border-${key}`, value));
-    return `${scope} {\n${vars.join('\n')}\n}`;
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+/** camelCase → kebab-case: `primaryHover` → `primary-hover` */
+function kebab(str) {
+    return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+}
+/** Indent every line of a multi-line string. */
+function indent(str, spaces = 2) {
+    const pad = ' '.repeat(spaces);
+    return str
+        .split('\n')
+        .map((l) => (l.trim() ? `${pad}${l}` : ''))
+        .join('\n');
+}
+// ─── Light / :root block ─────────────────────────────────────────────────────
+export function generateLightCssVars() {
+    const lines = [];
+    const v = (name, value) => `--tokis-${name}: ${String(value)};`;
+    // ── Primitive colors ──────────────────────────────────────────────────
+    lines.push('/* Primitive Colors */');
+    for (const [key, value] of Object.entries(colors)) {
+        lines.push(v(`color-${kebab(key)}`, value));
+    }
+    // Legacy flat text-* aliases that component CSS files reference directly
+    // (e.g. `--tokis-text-primary`) — kept for backward compat with theme CSS.
+    lines.push('');
+    lines.push('/* Text — legacy flat aliases */');
+    lines.push(v('text-primary', colors.textPrimary));
+    lines.push(v('text-secondary', colors.textSecondary));
+    lines.push(v('text-tertiary', colors.textTertiary));
+    lines.push(v('text-disabled', colors.textDisabled));
+    lines.push(v('text-inverse', colors.textInverse));
+    lines.push(v('text-on-primary', colors.textOnPrimary));
+    lines.push(v('text-link', colors.textLink));
+    lines.push(v('text-error', colors.textError));
+    lines.push(v('text-success', colors.textSuccess));
+    lines.push(v('text-warning', colors.textWarning));
+    // ── Spacing ───────────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Spacing */');
+    for (const [key, value] of Object.entries(spacing)) {
+        if (!isNaN(Number(key))) {
+            lines.push(v(`spacing-${key}`, value));
+        }
+    }
+    // ── Typography ────────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Typography */');
+    lines.push(v('font-family', typography.fontFamily.sans));
+    lines.push(v('font-family-mono', typography.fontFamily.mono));
+    for (const [key, value] of Object.entries(typography.fontSize)) {
+        lines.push(v(`font-size-${key}`, value));
+    }
+    for (const [key, value] of Object.entries(typography.fontWeight)) {
+        if (key !== 'normal')
+            lines.push(v(`font-weight-${key}`, value));
+    }
+    for (const [key, value] of Object.entries(typography.lineHeight)) {
+        lines.push(v(`line-height-${key}`, value));
+    }
+    for (const [key, value] of Object.entries(typography.letterSpacing)) {
+        lines.push(v(`letter-spacing-${kebab(key)}`, value));
+    }
+    // ── Border Radius ─────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Border Radius */');
+    for (const [key, value] of Object.entries(radius)) {
+        lines.push(v(`radius-${key}`, value));
+    }
+    // ── Shadows ───────────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Shadows */');
+    for (const [key, value] of Object.entries(shadows)) {
+        lines.push(v(`shadow-${key}`, value));
+    }
+    // ── Focus ─────────────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Focus */');
+    lines.push(v('color-focus-ring', colors.focusRing));
+    lines.push(v('color-focus-ring-error', colors.focusRingError));
+    // ── Surface interaction states ────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Surface interaction states */');
+    lines.push(v('color-surface-hover', colors.surfaceHover));
+    lines.push(v('color-surface-active', colors.surfaceActive));
+    // ── Motion ────────────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Motion */');
+    for (const [key, value] of Object.entries(motion.duration)) {
+        lines.push(v(`duration-${key}`, value));
+    }
+    for (const [key, value] of Object.entries(motion.easing)) {
+        lines.push(v(`ease-${kebab(key)}`, value));
+    }
+    // ── Z-index ───────────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Z-index */');
+    for (const [key, value] of Object.entries(zIndex)) {
+        lines.push(v(`z-${key}`, value));
+    }
+    // ── Breakpoints ───────────────────────────────────────────────────────
+    lines.push('');
+    lines.push('/* Breakpoints (JS reference — not usable in @media queries) */');
+    for (const [key, value] of Object.entries(breakpoints)) {
+        lines.push(v(`breakpoint-${key}`, value));
+    }
+    return `:root {\n${indent(lines.join('\n'))}\n}`;
+}
+// ─── Dark theme overrides ────────────────────────────────────────────────────
+/**
+ * Returns only the CSS custom properties that change in dark mode.
+ * Spacing, typography, radius, motion, and z-index are theme-invariant.
+ */
+export function generateDarkCssVars() {
+    const dark = `\
+/* Brand */
+--tokis-color-primary:          #3b82f6;
+--tokis-color-primary-hover:    #60a5fa;
+--tokis-color-primary-active:   #93c5fd;
+--tokis-color-primary-subtle:   #1e3a5f;
+--tokis-color-secondary:        #a78bfa;
+--tokis-color-secondary-hover:  #c4b5fd;
+--tokis-color-secondary-subtle: #2e1065;
+
+/* Backgrounds & Surfaces */
+--tokis-color-background:       #0f172a;
+--tokis-color-surface:          #1e293b;
+--tokis-color-surface-raised:   #293548;
+--tokis-color-surface-overlay:  #1e293b;
+--tokis-color-surface-hover:    #334155;
+--tokis-color-surface-active:   #475569;
+
+/* Borders */
+--tokis-color-border:        #334155;
+--tokis-color-border-strong: #475569;
+
+/* Status */
+--tokis-color-error:           #f87171;
+--tokis-color-error-subtle:    #450a0a;
+--tokis-color-warning:         #fbbf24;
+--tokis-color-warning-subtle:  #451a03;
+--tokis-color-success:         #4ade80;
+--tokis-color-success-subtle:  #052e16;
+--tokis-color-info:            #38bdf8;
+--tokis-color-info-subtle:     #082f49;
+
+/* Text */
+--tokis-text-primary:          #f1f5f9;
+--tokis-text-secondary:        #94a3b8;
+--tokis-text-tertiary:         #64748b;
+--tokis-text-disabled:         #475569;
+--tokis-text-inverse:          #0f172a;
+--tokis-text-on-primary:       #ffffff;
+--tokis-text-link:             #60a5fa;
+--tokis-text-error:            #f87171;
+--tokis-text-success:          #4ade80;
+--tokis-text-warning:          #fbbf24;
+
+/* Neutral scale (inverted for dark) */
+--tokis-color-neutral-50:  #0f172a;
+--tokis-color-neutral-100: #1e293b;
+--tokis-color-neutral-200: #334155;
+--tokis-color-neutral-300: #475569;
+--tokis-color-neutral-400: #64748b;
+--tokis-color-neutral-500: #94a3b8;
+--tokis-color-neutral-600: #cbd5e1;
+--tokis-color-neutral-700: #e2e8f0;
+--tokis-color-neutral-800: #f1f5f9;
+--tokis-color-neutral-900: #f8fafc;
+
+/* Shadows (higher opacity for dark backgrounds) */
+--tokis-shadow-xs:  0 1px 2px 0 rgb(0 0 0 / 0.30);
+--tokis-shadow-sm:  0 1px 3px 0 rgb(0 0 0 / 0.40), 0 1px 2px -1px rgb(0 0 0 / 0.40);
+--tokis-shadow-md:  0 4px 6px -1px rgb(0 0 0 / 0.40), 0 2px 4px -2px rgb(0 0 0 / 0.40);
+--tokis-shadow-lg:  0 10px 15px -3px rgb(0 0 0 / 0.40), 0 4px 6px -4px rgb(0 0 0 / 0.40);
+--tokis-shadow-xl:  0 20px 25px -5px rgb(0 0 0 / 0.40), 0 8px 10px -6px rgb(0 0 0 / 0.40);
+
+/* Focus rings */
+--tokis-color-focus-ring:       rgb(59 130 246 / 0.20);
+--tokis-color-focus-ring-error: rgb(248 113 113 / 0.20);`;
+    return `[data-theme="dark"] {\n${indent(dark)}\n}`;
+}
+// ─── Full stylesheet ──────────────────────────────────────────────────────────
+/**
+ * Returns the complete CSS variable stylesheet:
+ * the light `:root` block followed by dark `[data-theme="dark"]` overrides.
+ *
+ * **Build-time usage** (`scripts/generate-tokens-css.ts`):
+ * ```ts
+ * import { generateAllCssVars } from '@tokis/tokens';
+ * import { writeFileSync } from 'node:fs';
+ * writeFileSync(
+ *   'packages/theme/src/base/variables.css',
+ *   generateAllCssVars(),
+ * );
+ * ```
+ */
+export function generateAllCssVars() {
+    return [
+        '/* ============================================================',
+        '   Tokis — Design Token CSS Variables',
+        '   Auto-generated by @tokis/tokens — generate-css-vars.ts',
+        '   Run `pnpm tokens:generate` to regenerate after editing tokens.',
+        '   ============================================================ */',
+        '',
+        generateLightCssVars(),
+        '',
+        '/* ── Dark Theme ──────────────────────────────────────────── */',
+        generateDarkCssVars(),
+        '',
+    ].join('\n');
+}
+// ─── Backward-compat export ───────────────────────────────────────────────────
+/**
+ * @deprecated Use `generateLightCssVars()` or `generateAllCssVars()` instead.
+ * The `scope` parameter is ignored; the selector is always `:root`.
+ */
+export function generateCssVariables(_scope = ':root') {
+    return generateLightCssVars();
 }
 //# sourceMappingURL=generate-css-vars.js.map

package/dist/css/generate-css-vars.js.map

@@ -1 +1 @@
-{"version":3,"file":"generate-css-vars.js","sourceRoot":"","sources":["../../src/css/generate-css-vars.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"generate-css-vars.js","sourceRoot":"","sources":["../../src/css/generate-css-vars.ts"],"names":[],"mappings":"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"}

package/dist/primitives/breakpoints.d.ts

@@ -1,7 +1,17 @@
+/**
+ * Tokis responsive breakpoints.
+ * These map to `--tokis-breakpoint-{key}` CSS custom properties (for JS reference)
+ * and should be used with `@media (min-width: ...)` in CSS files.
+ *
+ * Note: CSS custom properties cannot be used inside media query conditions,
+ * so the values here serve as the canonical reference — CSS files hardcode
+ * the same pixel values directly in `@media` rules.
+ */
 export declare const breakpoints: {
     readonly sm: "640px";
     readonly md: "768px";
     readonly lg: "1024px";
     readonly xl: "1280px";
+    readonly '2xl': "1536px";
 };
 //# sourceMappingURL=breakpoints.d.ts.map

package/dist/primitives/breakpoints.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../src/primitives/breakpoints.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW;;;;;CAKd,CAAC"}
+{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../src/primitives/breakpoints.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW;;;;;;CAMd,CAAC"}

package/dist/primitives/breakpoints.js

@@ -1,7 +1,17 @@
+/**
+ * Tokis responsive breakpoints.
+ * These map to `--tokis-breakpoint-{key}` CSS custom properties (for JS reference)
+ * and should be used with `@media (min-width: ...)` in CSS files.
+ *
+ * Note: CSS custom properties cannot be used inside media query conditions,
+ * so the values here serve as the canonical reference — CSS files hardcode
+ * the same pixel values directly in `@media` rules.
+ */
 export const breakpoints = {
     sm: '640px',
     md: '768px',
     lg: '1024px',
     xl: '1280px',
+    '2xl': '1536px',
 };
 //# sourceMappingURL=breakpoints.js.map

package/dist/primitives/breakpoints.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoints.js","sourceRoot":"","sources":["../../src/primitives/breakpoints.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,EAAE,EAAE,OAAO;IACX,EAAE,EAAE,OAAO;IACX,EAAE,EAAE,QAAQ;IACZ,EAAE,EAAE,QAAQ;CACJ,CAAC"}
+{"version":3,"file":"breakpoints.js","sourceRoot":"","sources":["../../src/primitives/breakpoints.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,EAAE,EAAI,OAAO;IACb,EAAE,EAAI,OAAO;IACb,EAAE,EAAI,QAAQ;IACd,EAAE,EAAI,QAAQ;IACd,KAAK,EAAE,QAAQ;CACP,CAAC"}

package/dist/primitives/colors.d.ts

@@ -1,24 +1,60 @@
+/**
+ * Tokis primitive color tokens — canonical source of truth.
+ * The CSS variable file `theme/src/base/variables.css` is generated from
+ * these definitions via `scripts/generate-tokens-css.ts`.
+ *
+ * All values are plain strings so the object is JSON-serializable.
+ */
 export declare const colors: {
     readonly primary: "#0066ff";
-    readonly secondary: "#ff6600";
+    readonly primaryHover: "#0052cc";
+    readonly primaryActive: "#003d99";
+    readonly primarySubtle: "#e6f0ff";
+    readonly secondary: "#7c3aed";
+    readonly secondaryHover: "#6d28d9";
+    readonly secondarySubtle: "#ede9fe";
     readonly background: "#ffffff";
-    readonly surface: "#f5f5f5";
-    readonly error: "#d32f2f";
-    readonly warning: "#f57c00";
-    readonly success: "#388e3c";
-    readonly neutral100: "#f5f5f5";
-    readonly neutral200: "#eeeeee";
-    readonly neutral300: "#e0e0e0";
-    readonly neutral400: "#bdbdbd";
-    readonly neutral500: "#9e9e9e";
-    readonly neutral600: "#757575";
-    readonly neutral700: "#616161";
-    readonly neutral800: "#424242";
-    readonly neutral900: "#212121";
+    readonly surface: "#f8f9fa";
+    readonly surfaceRaised: "#ffffff";
+    readonly surfaceOverlay: "#ffffff";
+    readonly surfaceHover: "#f1f5f9";
+    readonly surfaceActive: "#e2e8f0";
+    readonly border: "#e2e8f0";
+    readonly borderStrong: "#cbd5e1";
+    readonly error: "#dc2626";
+    readonly errorSubtle: "#fef2f2";
+    readonly warning: "#d97706";
+    readonly warningSubtle: "#fffbeb";
+    readonly success: "#16a34a";
+    readonly successSubtle: "#f0fdf4";
+    readonly info: "#0284c7";
+    readonly infoSubtle: "#f0f9ff";
+    readonly textPrimary: "#0f172a";
+    readonly textSecondary: "#475569";
+    readonly textTertiary: "#94a3b8";
+    readonly textDisabled: "#cbd5e1";
+    readonly textInverse: "#ffffff";
+    readonly textOnPrimary: "#ffffff";
+    readonly textLink: "#0066ff";
+    readonly textError: "#dc2626";
+    readonly textSuccess: "#16a34a";
+    readonly textWarning: "#d97706";
+    readonly neutral50: "#f8fafc";
+    readonly neutral100: "#f1f5f9";
+    readonly neutral200: "#e2e8f0";
+    readonly neutral300: "#cbd5e1";
+    readonly neutral400: "#94a3b8";
+    readonly neutral500: "#64748b";
+    readonly neutral600: "#475569";
+    readonly neutral700: "#334155";
+    readonly neutral800: "#1e293b";
+    readonly neutral900: "#0f172a";
     readonly onPrimary: "#ffffff";
     readonly onSecondary: "#ffffff";
-    readonly onBackground: "#212121";
-    readonly onSurface: "#424242";
+    readonly onBackground: "#0f172a";
+    readonly onSurface: "#475569";
     readonly onError: "#ffffff";
+    readonly focusRing: "rgb(0 102 255 / 0.15)";
+    readonly focusRingError: "rgb(220 38 38 / 0.15)";
 };
 //# sourceMappingURL=colors.d.ts.map

package/dist/primitives/colors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/primitives/colors.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;CAsBT,CAAC"}
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/primitives/colors.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ET,CAAC"}

package/dist/primitives/colors.js

@@ -1,24 +1,72 @@
+/**
+ * Tokis primitive color tokens — canonical source of truth.
+ * The CSS variable file `theme/src/base/variables.css` is generated from
+ * these definitions via `scripts/generate-tokens-css.ts`.
+ *
+ * All values are plain strings so the object is JSON-serializable.
+ */
 export const colors = {
+    // ── Brand: Primary ────────────────────────────────────────────────────
     primary: '#0066ff',
-    secondary: '#ff6600',
+    primaryHover: '#0052cc',
+    primaryActive: '#003d99',
+    primarySubtle: '#e6f0ff',
+    // ── Brand: Secondary ──────────────────────────────────────────────────
+    secondary: '#7c3aed',
+    secondaryHover: '#6d28d9',
+    secondarySubtle: '#ede9fe',
+    // ── Backgrounds & Surfaces ────────────────────────────────────────────
     background: '#ffffff',
-    surface: '#f5f5f5',
-    error: '#d32f2f',
-    warning: '#f57c00',
-    success: '#388e3c',
-    neutral100: '#f5f5f5',
-    neutral200: '#eeeeee',
-    neutral300: '#e0e0e0',
-    neutral400: '#bdbdbd',
-    neutral500: '#9e9e9e',
-    neutral600: '#757575',
-    neutral700: '#616161',
-    neutral800: '#424242',
-    neutral900: '#212121',
+    surface: '#f8f9fa',
+    surfaceRaised: '#ffffff',
+    surfaceOverlay: '#ffffff',
+    surfaceHover: '#f1f5f9',
+    surfaceActive: '#e2e8f0',
+    // ── Borders ───────────────────────────────────────────────────────────
+    border: '#e2e8f0',
+    borderStrong: '#cbd5e1',
+    // ── Status: Error ─────────────────────────────────────────────────────
+    error: '#dc2626',
+    errorSubtle: '#fef2f2',
+    // ── Status: Warning ───────────────────────────────────────────────────
+    warning: '#d97706',
+    warningSubtle: '#fffbeb',
+    // ── Status: Success ───────────────────────────────────────────────────
+    success: '#16a34a',
+    successSubtle: '#f0fdf4',
+    // ── Status: Info ──────────────────────────────────────────────────────
+    info: '#0284c7',
+    infoSubtle: '#f0f9ff',
+    // ── Text ──────────────────────────────────────────────────────────────
+    textPrimary: '#0f172a',
+    textSecondary: '#475569',
+    textTertiary: '#94a3b8',
+    textDisabled: '#cbd5e1',
+    textInverse: '#ffffff',
+    textOnPrimary: '#ffffff',
+    textLink: '#0066ff',
+    textError: '#dc2626',
+    textSuccess: '#16a34a',
+    textWarning: '#d97706',
+    // ── Neutral scale (Slate) ─────────────────────────────────────────────
+    neutral50: '#f8fafc',
+    neutral100: '#f1f5f9',
+    neutral200: '#e2e8f0',
+    neutral300: '#cbd5e1',
+    neutral400: '#94a3b8',
+    neutral500: '#64748b',
+    neutral600: '#475569',
+    neutral700: '#334155',
+    neutral800: '#1e293b',
+    neutral900: '#0f172a',
+    // ── On-color ──────────────────────────────────────────────────────────
     onPrimary: '#ffffff',
     onSecondary: '#ffffff',
-    onBackground: '#212121',
-    onSurface: '#424242',
+    onBackground: '#0f172a',
+    onSurface: '#475569',
     onError: '#ffffff',
+    // ── Focus ─────────────────────────────────────────────────────────────
+    focusRing: 'rgb(0 102 255 / 0.15)',
+    focusRingError: 'rgb(220 38 38 / 0.15)',
 };
 //# sourceMappingURL=colors.js.map

package/dist/primitives/colors.js.map

@@ -1 +1 @@
-{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../src/primitives/colors.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,SAAS;IACpB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,SAAS;IAChB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,SAAS,EAAE,SAAS;IACpB,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,SAAS;IACvB,SAAS,EAAE,SAAS;IACpB,OAAO,EAAE,SAAS;CACV,CAAC"}
+{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../src/primitives/colors.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,yEAAyE;IACzE,OAAO,EAAW,SAAS;IAC3B,YAAY,EAAM,SAAS;IAC3B,aAAa,EAAK,SAAS;IAC3B,aAAa,EAAK,SAAS;IAE3B,yEAAyE;IACzE,SAAS,EAAS,SAAS;IAC3B,cAAc,EAAI,SAAS;IAC3B,eAAe,EAAG,SAAS;IAE3B,yEAAyE;IACzE,UAAU,EAAQ,SAAS;IAC3B,OAAO,EAAW,SAAS;IAC3B,aAAa,EAAK,SAAS;IAC3B,cAAc,EAAI,SAAS;IAC3B,YAAY,EAAM,SAAS;IAC3B,aAAa,EAAK,SAAS;IAE3B,yEAAyE;IACzE,MAAM,EAAY,SAAS;IAC3B,YAAY,EAAM,SAAS;IAE3B,yEAAyE;IACzE,KAAK,EAAa,SAAS;IAC3B,WAAW,EAAO,SAAS;IAE3B,yEAAyE;IACzE,OAAO,EAAW,SAAS;IAC3B,aAAa,EAAK,SAAS;IAE3B,yEAAyE;IACzE,OAAO,EAAW,SAAS;IAC3B,aAAa,EAAK,SAAS;IAE3B,yEAAyE;IACzE,IAAI,EAAc,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAE3B,yEAAyE;IACzE,WAAW,EAAO,SAAS;IAC3B,aAAa,EAAK,SAAS;IAC3B,YAAY,EAAM,SAAS;IAC3B,YAAY,EAAM,SAAS;IAC3B,WAAW,EAAO,SAAS;IAC3B,aAAa,EAAK,SAAS;IAC3B,QAAQ,EAAU,SAAS;IAC3B,SAAS,EAAS,SAAS;IAC3B,WAAW,EAAO,SAAS;IAC3B,WAAW,EAAO,SAAS;IAE3B,yEAAyE;IACzE,SAAS,EAAS,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAC3B,UAAU,EAAQ,SAAS;IAE3B,yEAAyE;IACzE,SAAS,EAAS,SAAS;IAC3B,WAAW,EAAO,SAAS;IAC3B,YAAY,EAAM,SAAS;IAC3B,SAAS,EAAS,SAAS;IAC3B,OAAO,EAAW,SAAS;IAE3B,yEAAyE;IACzE,SAAS,EAAS,uBAAuB;IACzC,cAAc,EAAI,uBAAuB;CACjC,CAAC"}

package/dist/primitives/motion.d.ts

@@ -1,11 +1,22 @@
+/**
+ * Tokis motion tokens — durations and easing functions.
+ * These map to `--tokis-duration-{key}` and `--tokis-ease-{key}` CSS variables.
+ *
+ * Always reference via CSS variables rather than importing at runtime to
+ * preserve zero-runtime guarantee.
+ */
 export declare const motion: {
     readonly duration: {
-        readonly fast: "150ms";
-        readonly normal: "300ms";
-        readonly slow: "500ms";
+        readonly fast: "100ms";
+        readonly normal: "200ms";
+        readonly slow: "300ms";
+        readonly slower: "500ms";
     };
     readonly easing: {
+        readonly easeIn: "cubic-bezier(0.4, 0, 1, 1)";
+        readonly easeOut: "cubic-bezier(0, 0, 0.2, 1)";
         readonly easeInOut: "cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly spring: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
     };
 };
 //# sourceMappingURL=motion.d.ts.map