@xenition/ui 0.1.0

package/dist/theme/compile.js

@@ -0,0 +1,174 @@
+"use strict";
+/**
+ * The theme compiler: `compileTheme(seed)` — a deterministic, pure function
+ * that turns a ~5-value {@link ThemeSeed} into a full {@link CompiledTheme}.
+ *
+ * Guarantees:
+ * - Deterministic: the same seed always deep-equals the same output.
+ * - Validated: malformed seeds throw descriptive errors, never "best-effort".
+ * - Readable: every semantic `onX`/`X` pair passes WCAG AA (≥ 4.5:1) in both
+ *   light and dark mode — enforced by `ensureContrast`, which cannot fail.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MIN_CONTRAST = void 0;
+exports.compileTheme = compileTheme;
+const color_1 = require("./color");
+const types_1 = require("./types");
+/** Minimum WCAG contrast enforced for every semantic on-pair. */
+exports.MIN_CONTRAST = 4.5;
+/** Hue rotation applied to `primary` when no `accent` seed is given. */
+const ACCENT_HUE_ROTATION = 40;
+/** Target lightness per ramp step (light-mode orientation). */
+const RAMP_LIGHTNESS = {
+    50: 97,
+    100: 93,
+    200: 85,
+    300: 75,
+    400: 64,
+    500: 54,
+    600: 46,
+    700: 38,
+    800: 30,
+    900: 22,
+    950: 13,
+};
+/** Small hue + saturation bias that tints the gray ramp per temperature. */
+const NEUTRAL_BASE = {
+    warm: { h: 35, s: 6 },
+    cool: { h: 220, s: 8 },
+    pure: { h: 0, s: 0 },
+};
+/** Fixed status hues (light-mode lightness; dark mode inverts lightness). */
+const STATUS = {
+    success: { h: 152, s: 60, l: 36 },
+    warn: { h: 42, s: 92, l: 44 },
+    danger: { h: 4, s: 72, l: 44 },
+};
+const RADIUS = {
+    sharp: { sm: 0, md: 0, lg: 0, full: 0 },
+    rounded: { sm: 4, md: 8, lg: 16, full: 9999 },
+    pill: { sm: 8, md: 16, lg: 24, full: 9999 },
+};
+const SPACING = { xs: 4, sm: 8, md: 16, lg: 24, xl: 32, '2xl': 48 };
+const TYPE_SCALE = { xs: 12, sm: 14, base: 16, lg: 18, xl: 20, '2xl': 24, '3xl': 30 };
+const NEUTRALS = ['warm', 'cool', 'pure'];
+const SHAPES = ['sharp', 'rounded', 'pill'];
+const MODES = ['light', 'dark', 'both'];
+function validateSeed(seed) {
+    if (typeof seed !== 'object' || seed === null) {
+        throw new Error('compileTheme: seed must be an object (see ThemeSeed).');
+    }
+    if (!(0, color_1.isValidHex)(seed.primary)) {
+        throw new Error(`compileTheme: seed.primary must be a hex color like "#7C3AED", got ${JSON.stringify(seed.primary)}.`);
+    }
+    if (seed.accent !== undefined && !(0, color_1.isValidHex)(seed.accent)) {
+        throw new Error(`compileTheme: seed.accent must be a hex color like "#F59E0B" (or omitted), got ${JSON.stringify(seed.accent)}.`);
+    }
+    if (!NEUTRALS.includes(seed.neutral)) {
+        throw new Error(`compileTheme: seed.neutral must be one of ${NEUTRALS.join(' | ')}, got ${JSON.stringify(seed.neutral)}.`);
+    }
+    if (!SHAPES.includes(seed.shape)) {
+        throw new Error(`compileTheme: seed.shape must be one of ${SHAPES.join(' | ')}, got ${JSON.stringify(seed.shape)}.`);
+    }
+    if (!MODES.includes(seed.mode)) {
+        throw new Error(`compileTheme: seed.mode must be one of ${MODES.join(' | ')}, got ${JSON.stringify(seed.mode)}.`);
+    }
+    if (typeof seed.font !== 'object' ||
+        seed.font === null ||
+        typeof seed.font.heading !== 'string' ||
+        seed.font.heading.trim() === '' ||
+        typeof seed.font.body !== 'string' ||
+        seed.font.body.trim() === '') {
+        throw new Error('compileTheme: seed.font must be { heading: string, body: string } with non-empty names.');
+    }
+}
+/**
+ * Build an 11-step ramp from a hue + saturation. Lightness follows the fixed
+ * ladder; saturation is eased down at the very light end so tints stay soft.
+ */
+function buildRamp(h, s) {
+    const ramp = {};
+    for (const step of types_1.RAMP_STEPS) {
+        const sat = step <= 100 ? s * 0.5 : step <= 200 ? s * 0.75 : s;
+        ramp[step] = (0, color_1.hslToHex)({ h, s: sat, l: RAMP_LIGHTNESS[step] });
+    }
+    return ramp;
+}
+/** Mirror a ramp end-for-end (50 ↔ 950, 100 ↔ 900, …) — the dark-mode ramp. */
+function invertRamp(ramp) {
+    const inverted = {};
+    types_1.RAMP_STEPS.forEach((step, i) => {
+        const mirror = types_1.RAMP_STEPS[types_1.RAMP_STEPS.length - 1 - i];
+        inverted[step] = ramp[mirror];
+    });
+    return inverted;
+}
+/**
+ * Derive the semantic slots from a ramp set. The same formula produces both
+ * modes: dark mode passes inverted ramps (and inverted status lightness), so
+ * "step 50" is always "closest to the surface" and "900" is "highest ink".
+ */
+function deriveSemantics(ramps, mode) {
+    const statusLightness = (l) => (mode === 'light' ? l : 100 - l);
+    const surface = ramps.neutral[50];
+    const primary = ramps.primary[600];
+    const accent = ramps.accent[600];
+    const success = (0, color_1.hslToHex)({ ...STATUS.success, l: statusLightness(STATUS.success.l) });
+    const warn = (0, color_1.hslToHex)({ ...STATUS.warn, l: statusLightness(STATUS.warn.l) });
+    const danger = (0, color_1.hslToHex)({ ...STATUS.danger, l: statusLightness(STATUS.danger.l) });
+    return {
+        surface,
+        onSurface: (0, color_1.ensureContrast)(ramps.neutral[900], surface, exports.MIN_CONTRAST),
+        primary,
+        onPrimary: (0, color_1.ensureContrast)('#ffffff', primary, exports.MIN_CONTRAST),
+        accent,
+        onAccent: (0, color_1.ensureContrast)('#ffffff', accent, exports.MIN_CONTRAST),
+        muted: ramps.neutral[600],
+        border: ramps.neutral[200],
+        success,
+        onSuccess: (0, color_1.ensureContrast)('#ffffff', success, exports.MIN_CONTRAST),
+        warn,
+        onWarn: (0, color_1.ensureContrast)('#ffffff', warn, exports.MIN_CONTRAST),
+        danger,
+        onDanger: (0, color_1.ensureContrast)('#ffffff', danger, exports.MIN_CONTRAST),
+    };
+}
+/**
+ * Compile a {@link ThemeSeed} into a full {@link CompiledTheme}.
+ *
+ * Pure and deterministic — safe to run at build time, on the server, or in
+ * the browser; the same seed always produces a deep-equal theme.
+ *
+ * @throws {Error} with a descriptive message if the seed is malformed.
+ */
+function compileTheme(seed) {
+    validateSeed(seed);
+    const primaryHsl = (0, color_1.hexToHsl)(seed.primary);
+    const accentHsl = seed.accent !== undefined
+        ? (0, color_1.hexToHsl)(seed.accent)
+        : { ...primaryHsl, h: (primaryHsl.h + ACCENT_HUE_ROTATION) % 360 };
+    const ramps = {
+        primary: buildRamp(primaryHsl.h, primaryHsl.s),
+        accent: buildRamp(accentHsl.h, accentHsl.s),
+        neutral: buildRamp(NEUTRAL_BASE[seed.neutral].h, NEUTRAL_BASE[seed.neutral].s),
+    };
+    const darkRamps = {
+        primary: invertRamp(ramps.primary),
+        accent: invertRamp(ramps.accent),
+        neutral: invertRamp(ramps.neutral),
+    };
+    return {
+        seed: { ...seed, font: { ...seed.font } },
+        ramps,
+        light: deriveSemantics(ramps, 'light'),
+        dark: deriveSemantics(darkRamps, 'dark'),
+        radius: { ...RADIUS[seed.shape] },
+        spacing: { ...SPACING },
+        typography: {
+            fontHeading: seed.font.heading,
+            fontBody: seed.font.body,
+            scale: { ...TYPE_SCALE },
+        },
+    };
+}
+//# sourceMappingURL=compile.js.map

package/dist/theme/compile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compile.js","sourceRoot":"","sources":["../../src/theme/compile.ts"],"names":[],"mappings":";AAAA;;;;;;;;;GASG;;;AAoLH,oCAkCC;AApND,mCAAyE;AACzE,mCAaiB;AAEjB,iEAAiE;AACpD,QAAA,YAAY,GAAG,GAAG,CAAC;AAEhC,wEAAwE;AACxE,MAAM,mBAAmB,GAAG,EAAE,CAAC;AAE/B,+DAA+D;AAC/D,MAAM,cAAc,GAA6B;IAC/C,EAAE,EAAE,EAAE;IACN,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;CACR,CAAC;AAEF,4EAA4E;AAC5E,MAAM,YAAY,GAAyD;IACzE,IAAI,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE;IACrB,IAAI,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE;IACtB,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;CACrB,CAAC;AAEF,6EAA6E;AAC7E,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE;IACjC,IAAI,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE;IAC7B,MAAM,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE;CACtB,CAAC;AAEX,MAAM,MAAM,GAAoC;IAC9C,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE;IACvC,OAAO,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE;IAC7C,IAAI,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE;CAC5C,CAAC;AAEF,MAAM,OAAO,GAAiB,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC;AAElF,MAAM,UAAU,GAAc,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC;AAEjG,MAAM,QAAQ,GAAkC,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AACzE,MAAM,MAAM,GAA0B,CAAC,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC;AACnE,MAAM,KAAK,GAAyB,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAE9D,SAAS,YAAY,CAAC,IAAe;IACnC,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;QAC9C,MAAM,IAAI,KAAK,CAAC,uDAAuD,CAAC,CAAC;IAC3E,CAAC;IACD,IAAI,CAAC,IAAA,kBAAU,EAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;QAC9B,MAAM,IAAI,KAAK,CACb,sEAAsE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CACtG,CAAC;IACJ,CAAC;IACD,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,CAAC,IAAA,kBAAU,EAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;QAC1D,MAAM,IAAI,KAAK,CACb,kFAAkF,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CACjH,CAAC;IACJ,CAAC;IACD,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;QACrC,MAAM,IAAI,KAAK,CACb,6CAA6C,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAC1G,CAAC;IACJ,CAAC;IACD,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;QACjC,MAAM,IAAI,KAAK,CACb,2CAA2C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CACpG,CAAC;IACJ,CAAC;IACD,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;QAC/B,MAAM,IAAI,KAAK,CACb,0CAA0C,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CACjG,CAAC;IACJ,CAAC;IACD,IACE,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ;QAC7B,IAAI,CAAC,IAAI,KAAK,IAAI;QAClB,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,KAAK,QAAQ;QACrC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE;QAC/B,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ;QAClC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAC5B,CAAC;QACD,MAAM,IAAI,KAAK,CACb,yFAAyF,CAC1F,CAAC;IACJ,CAAC;AACH,CAAC;AAED;;;GAGG;AACH,SAAS,SAAS,CAAC,CAAS,EAAE,CAAS;IACrC,MAAM,IAAI,GAAG,EAAe,CAAC;IAC7B,KAAK,MAAM,IAAI,IAAI,kBAAU,EAAE,CAAC;QAC9B,MAAM,GAAG,GAAG,IAAI,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;QAC/D,IAAI,CAAC,IAAI,CAAC,GAAG,IAAA,gBAAQ,EAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChE,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,+EAA+E;AAC/E,SAAS,UAAU,CAAC,IAAe;IACjC,MAAM,QAAQ,GAAG,EAAe,CAAC;IACjC,kBAAU,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;QAC7B,MAAM,MAAM,GAAG,kBAAU,CAAC,kBAAU,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAa,CAAC;QACjE,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,CAAC,CAAC,CAAC;IACH,OAAO,QAAQ,CAAC;AAClB,CAAC;AAQD;;;;GAIG;AACH,SAAS,eAAe,CAAC,KAAc,EAAE,IAAsB;IAC7D,MAAM,eAAe,GAAG,CAAC,CAAS,EAAU,EAAE,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;IAEhF,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;IAClC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACnC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;IACjC,MAAM,OAAO,GAAG,IAAA,gBAAQ,EAAC,EAAE,GAAG,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IACtF,MAAM,IAAI,GAAG,IAAA,gBAAQ,EAAC,EAAE,GAAG,MAAM,CAAC,IAAI,EAAE,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC7E,MAAM,MAAM,GAAG,IAAA,gBAAQ,EAAC,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAEnF,OAAO;QACL,OAAO;QACP,SAAS,EAAE,IAAA,sBAAc,EAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,OAAO,EAAE,oBAAY,CAAC;QACpE,OAAO;QACP,SAAS,EAAE,IAAA,sBAAc,EAAC,SAAS,EAAE,OAAO,EAAE,oBAAY,CAAC;QAC3D,MAAM;QACN,QAAQ,EAAE,IAAA,sBAAc,EAAC,SAAS,EAAE,MAAM,EAAE,oBAAY,CAAC;QACzD,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;QACzB,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;QAC1B,OAAO;QACP,SAAS,EAAE,IAAA,sBAAc,EAAC,SAAS,EAAE,OAAO,EAAE,oBAAY,CAAC;QAC3D,IAAI;QACJ,MAAM,EAAE,IAAA,sBAAc,EAAC,SAAS,EAAE,IAAI,EAAE,oBAAY,CAAC;QACrD,MAAM;QACN,QAAQ,EAAE,IAAA,sBAAc,EAAC,SAAS,EAAE,MAAM,EAAE,oBAAY,CAAC;KAC1D,CAAC;AACJ,CAAC;AAED;;;;;;;GAOG;AACH,SAAgB,YAAY,CAAC,IAAe;IAC1C,YAAY,CAAC,IAAI,CAAC,CAAC;IAEnB,MAAM,UAAU,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC1C,MAAM,SAAS,GACb,IAAI,CAAC,MAAM,KAAK,SAAS;QACvB,CAAC,CAAC,IAAA,gBAAQ,EAAC,IAAI,CAAC,MAAM,CAAC;QACvB,CAAC,CAAC,EAAE,GAAG,UAAU,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,GAAG,mBAAmB,CAAC,GAAG,GAAG,EAAE,CAAC;IAEvE,MAAM,KAAK,GAAY;QACrB,OAAO,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC;QAC9C,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC;QAC3C,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;KAC/E,CAAC;IAEF,MAAM,SAAS,GAAY;QACzB,OAAO,EAAE,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC;QAClC,MAAM,EAAE,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC;QAChC,OAAO,EAAE,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC;KACnC,CAAC;IAEF,OAAO;QACL,IAAI,EAAE,EAAE,GAAG,IAAI,EAAE,IAAI,EAAE,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE;QACzC,KAAK;QACL,KAAK,EAAE,eAAe,CAAC,KAAK,EAAE,OAAO,CAAC;QACtC,IAAI,EAAE,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC;QACxC,MAAM,EAAE,EAAE,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;QACjC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE;QACvB,UAAU,EAAE;YACV,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,OAAO;YAC9B,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI;YACxB,KAAK,EAAE,EAAE,GAAG,UAAU,EAAE;SACzB;KACF,CAAC;AACJ,CAAC"}

package/dist/theme/index.d.ts

@@ -0,0 +1,23 @@
+/**
+ * `@xenition/ui/theme` — seed-token theme compiler.
+ *
+ * ```ts
+ * import { compileTheme, toCssVars } from '@xenition/ui/theme';
+ *
+ * const theme = compileTheme({
+ *   primary: '#7C3AED',
+ *   neutral: 'warm',
+ *   font: { heading: 'Inter', body: 'Inter' },
+ *   shape: 'rounded',
+ *   mode: 'both',
+ * });
+ * const css = toCssVars(theme);
+ * ```
+ */
+export * from './types';
+export { isValidHex, hexToRgb, rgbToHex, rgbToHsl, hslToRgb, hexToHsl, hslToHex, relativeLuminance, contrastRatio, ensureContrast, } from './color';
+export type { RGB, HSL } from './color';
+export { compileTheme, MIN_CONTRAST } from './compile';
+export { toCssVars, toTailwindPreset, toNativeTokens } from './outputs';
+export type { TailwindPreset, NativeThemeTokens } from './outputs';
+//# sourceMappingURL=index.d.ts.map

package/dist/theme/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,cAAc,SAAS,CAAC;AACxB,OAAO,EACL,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,cAAc,GACf,MAAM,SAAS,CAAC;AACjB,YAAY,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AACxE,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC"}

package/dist/theme/index.js

@@ -0,0 +1,53 @@
+"use strict";
+/**
+ * `@xenition/ui/theme` — seed-token theme compiler.
+ *
+ * ```ts
+ * import { compileTheme, toCssVars } from '@xenition/ui/theme';
+ *
+ * const theme = compileTheme({
+ *   primary: '#7C3AED',
+ *   neutral: 'warm',
+ *   font: { heading: 'Inter', body: 'Inter' },
+ *   shape: 'rounded',
+ *   mode: 'both',
+ * });
+ * const css = toCssVars(theme);
+ * ```
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toNativeTokens = exports.toTailwindPreset = exports.toCssVars = exports.MIN_CONTRAST = exports.compileTheme = exports.ensureContrast = exports.contrastRatio = exports.relativeLuminance = exports.hslToHex = exports.hexToHsl = exports.hslToRgb = exports.rgbToHsl = exports.rgbToHex = exports.hexToRgb = exports.isValidHex = void 0;
+__exportStar(require("./types"), exports);
+var color_1 = require("./color");
+Object.defineProperty(exports, "isValidHex", { enumerable: true, get: function () { return color_1.isValidHex; } });
+Object.defineProperty(exports, "hexToRgb", { enumerable: true, get: function () { return color_1.hexToRgb; } });
+Object.defineProperty(exports, "rgbToHex", { enumerable: true, get: function () { return color_1.rgbToHex; } });
+Object.defineProperty(exports, "rgbToHsl", { enumerable: true, get: function () { return color_1.rgbToHsl; } });
+Object.defineProperty(exports, "hslToRgb", { enumerable: true, get: function () { return color_1.hslToRgb; } });
+Object.defineProperty(exports, "hexToHsl", { enumerable: true, get: function () { return color_1.hexToHsl; } });
+Object.defineProperty(exports, "hslToHex", { enumerable: true, get: function () { return color_1.hslToHex; } });
+Object.defineProperty(exports, "relativeLuminance", { enumerable: true, get: function () { return color_1.relativeLuminance; } });
+Object.defineProperty(exports, "contrastRatio", { enumerable: true, get: function () { return color_1.contrastRatio; } });
+Object.defineProperty(exports, "ensureContrast", { enumerable: true, get: function () { return color_1.ensureContrast; } });
+var compile_1 = require("./compile");
+Object.defineProperty(exports, "compileTheme", { enumerable: true, get: function () { return compile_1.compileTheme; } });
+Object.defineProperty(exports, "MIN_CONTRAST", { enumerable: true, get: function () { return compile_1.MIN_CONTRAST; } });
+var outputs_1 = require("./outputs");
+Object.defineProperty(exports, "toCssVars", { enumerable: true, get: function () { return outputs_1.toCssVars; } });
+Object.defineProperty(exports, "toTailwindPreset", { enumerable: true, get: function () { return outputs_1.toTailwindPreset; } });
+Object.defineProperty(exports, "toNativeTokens", { enumerable: true, get: function () { return outputs_1.toNativeTokens; } });
+//# sourceMappingURL=index.js.map

package/dist/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;AAEH,0CAAwB;AACxB,iCAWiB;AAVf,mGAAA,UAAU,OAAA;AACV,iGAAA,QAAQ,OAAA;AACR,iGAAA,QAAQ,OAAA;AACR,iGAAA,QAAQ,OAAA;AACR,iGAAA,QAAQ,OAAA;AACR,iGAAA,QAAQ,OAAA;AACR,iGAAA,QAAQ,OAAA;AACR,0GAAA,iBAAiB,OAAA;AACjB,sGAAA,aAAa,OAAA;AACb,uGAAA,cAAc,OAAA;AAGhB,qCAAuD;AAA9C,uGAAA,YAAY,OAAA;AAAE,uGAAA,YAAY,OAAA;AACnC,qCAAwE;AAA/D,oGAAA,SAAS,OAAA;AAAE,2GAAA,gBAAgB,OAAA;AAAE,yGAAA,cAAc,OAAA"}

package/dist/theme/outputs.d.ts

@@ -0,0 +1,62 @@
+/**
+ * The three output targets of a compiled theme:
+ *
+ * 1. `toCssVars(theme)`      → CSS custom properties (web runtime).
+ * 2. `toTailwindPreset(theme)` → a Tailwind preset whose values reference the
+ *    CSS vars, so `bg-primary` / `text-on-surface` restyle live when the vars
+ *    change — no rebuild.
+ * 3. `toNativeTokens(theme)` → a plain nested object with **resolved** hex /
+ *    numeric values for React Native (RN cannot read CSS vars).
+ */
+import { CompiledTheme, SemanticColors } from './types';
+/**
+ * Render the theme as CSS custom properties.
+ *
+ * `:root` carries the base mode (dark when `seed.mode === 'dark'`, light
+ * otherwise) plus ramps and scales. When `seed.mode === 'both'`, a
+ * `[data-theme="dark"]` block overrides the semantic slots.
+ *
+ * Ramps are emitted in the scheme's orientation: light schemes use the ramps
+ * as compiled, dark schemes emit the inverted ramps (`neutral-50` → the darkest
+ * step, `neutral-900` → a light step) — matching how the dark semantic slots
+ * are derived, so utility classes like `bg-neutral-50` track the dark surface.
+ */
+export declare function toCssVars(theme: CompiledTheme): string;
+/** Shape of the object returned by {@link toTailwindPreset}. */
+export interface TailwindPreset {
+    theme: {
+        extend: {
+            colors: Record<string, string | Record<string, string>>;
+            borderRadius: Record<string, string>;
+            spacing: Record<string, string>;
+            fontSize: Record<string, string>;
+            fontFamily: Record<string, string[]>;
+        };
+    };
+}
+/**
+ * Build a Tailwind preset bound to the theme's CSS variables. Because every
+ * value is a `var(--xen-*)` reference, the preset itself is theme-agnostic at
+ * build time — swapping the injected vars restyles the app without a rebuild.
+ *
+ * Usage in a generated app's `tailwind.config.js`:
+ * `presets: [require('@xenition/ui/tailwind-preset').toTailwindPreset(theme)]`
+ */
+export declare function toTailwindPreset(_theme: CompiledTheme): TailwindPreset;
+/** Token object consumed by React Native — everything resolved, no CSS vars. */
+export interface NativeThemeTokens {
+    colors: {
+        light: SemanticColors;
+        dark: SemanticColors;
+    };
+    ramps: CompiledTheme['ramps'];
+    radius: CompiledTheme['radius'];
+    spacing: CompiledTheme['spacing'];
+    typography: CompiledTheme['typography'];
+}
+/**
+ * Flatten a compiled theme into plain resolved values (hex strings and px
+ * numbers) for React Native `StyleSheet` consumption.
+ */
+export declare function toNativeTokens(theme: CompiledTheme): NativeThemeTokens;
+//# sourceMappingURL=outputs.d.ts.map

package/dist/theme/outputs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"outputs.d.ts","sourceRoot":"","sources":["../../src/theme/outputs.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAa,aAAa,EAAwB,cAAc,EAAE,MAAM,SAAS,CAAC;AA0DzF;;;;;;;;;;;GAWG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,MAAM,CA+BtD;AAED,gEAAgE;AAChE,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE;QACL,MAAM,EAAE;YACN,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;YACxD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;YACrC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;YAChC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;YACjC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;SACtC,CAAC;KACH,CAAC;CACH;AAUD;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,aAAa,GAAG,cAAc,CA2DtE;AAED,gFAAgF;AAChF,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE;QACN,KAAK,EAAE,cAAc,CAAC;QACtB,IAAI,EAAE,cAAc,CAAC;KACtB,CAAC;IACF,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9B,MAAM,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IAChC,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;CACzC;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,aAAa,GAAG,iBAAiB,CAetE"}

package/dist/theme/outputs.js

@@ -0,0 +1,198 @@
+"use strict";
+/**
+ * The three output targets of a compiled theme:
+ *
+ * 1. `toCssVars(theme)`      → CSS custom properties (web runtime).
+ * 2. `toTailwindPreset(theme)` → a Tailwind preset whose values reference the
+ *    CSS vars, so `bg-primary` / `text-on-surface` restyle live when the vars
+ *    change — no rebuild.
+ * 3. `toNativeTokens(theme)` → a plain nested object with **resolved** hex /
+ *    numeric values for React Native (RN cannot read CSS vars).
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toCssVars = toCssVars;
+exports.toTailwindPreset = toTailwindPreset;
+exports.toNativeTokens = toNativeTokens;
+const types_1 = require("./types");
+const camelToKebab = (key) => key.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+const SEMANTIC_KEYS = [
+    'surface',
+    'onSurface',
+    'primary',
+    'onPrimary',
+    'accent',
+    'onAccent',
+    'muted',
+    'border',
+    'success',
+    'onSuccess',
+    'warn',
+    'onWarn',
+    'danger',
+    'onDanger',
+];
+function semanticVarLines(colors) {
+    return SEMANTIC_KEYS.map((key) => `--xen-${camelToKebab(key)}: ${colors[key]};`);
+}
+function rampVarLines(name, ramp) {
+    return types_1.RAMP_STEPS.map((step) => `--xen-${name}-${step}: ${ramp[step]};`);
+}
+/**
+ * Mirror a ramp end-for-end (50 ↔ 950, 100 ↔ 900, …) — the dark-scheme
+ * orientation. This is the same inversion the compiler applies before deriving
+ * the dark semantic slots, so emitting inverted ramps keeps utility classes
+ * (`bg-neutral-50`, `text-neutral-900`, …) in step with `surface`/`on-surface`
+ * under `[data-theme="dark"]` instead of leaving them at their light values.
+ */
+function invertRamp(ramp) {
+    const inverted = {};
+    types_1.RAMP_STEPS.forEach((step, i) => {
+        const mirror = types_1.RAMP_STEPS[types_1.RAMP_STEPS.length - 1 - i];
+        inverted[step] = ramp[mirror];
+    });
+    return inverted;
+}
+/** The full ramp set in dark-scheme orientation (every ramp mirrored). */
+function invertRamps(ramps) {
+    return {
+        primary: invertRamp(ramps.primary),
+        accent: invertRamp(ramps.accent),
+        neutral: invertRamp(ramps.neutral),
+    };
+}
+const fontStack = (family) => `"${family}", ui-sans-serif, system-ui, sans-serif`;
+/**
+ * Render the theme as CSS custom properties.
+ *
+ * `:root` carries the base mode (dark when `seed.mode === 'dark'`, light
+ * otherwise) plus ramps and scales. When `seed.mode === 'both'`, a
+ * `[data-theme="dark"]` block overrides the semantic slots.
+ *
+ * Ramps are emitted in the scheme's orientation: light schemes use the ramps
+ * as compiled, dark schemes emit the inverted ramps (`neutral-50` → the darkest
+ * step, `neutral-900` → a light step) — matching how the dark semantic slots
+ * are derived, so utility classes like `bg-neutral-50` track the dark surface.
+ */
+function toCssVars(theme) {
+    const darkRoot = theme.seed.mode === 'dark';
+    const rootColors = darkRoot ? theme.dark : theme.light;
+    const rootRamps = darkRoot ? invertRamps(theme.ramps) : theme.ramps;
+    const rootLines = [
+        ...semanticVarLines(rootColors),
+        ...rampVarLines('primary', rootRamps.primary),
+        ...rampVarLines('accent', rootRamps.accent),
+        ...rampVarLines('neutral', rootRamps.neutral),
+        ...Object.entries(theme.radius).map(([key, px]) => `--xen-radius-${key}: ${px}px;`),
+        ...Object.entries(theme.spacing).map(([key, px]) => `--xen-space-${key}: ${px}px;`),
+        ...Object.entries(theme.typography.scale).map(([key, px]) => `--xen-text-${key}: ${px}px;`),
+        `--xen-font-heading: ${fontStack(theme.typography.fontHeading)};`,
+        `--xen-font-body: ${fontStack(theme.typography.fontBody)};`,
+    ];
+    let css = `:root {\n  ${rootLines.join('\n  ')}\n}`;
+    if (theme.seed.mode === 'both') {
+        const darkRamps = invertRamps(theme.ramps);
+        const darkLines = [
+            ...semanticVarLines(theme.dark),
+            ...rampVarLines('primary', darkRamps.primary),
+            ...rampVarLines('accent', darkRamps.accent),
+            ...rampVarLines('neutral', darkRamps.neutral),
+        ];
+        css += `\n[data-theme="dark"] {\n  ${darkLines.join('\n  ')}\n}`;
+    }
+    return css;
+}
+function rampVarObject(name) {
+    const out = {};
+    for (const step of types_1.RAMP_STEPS) {
+        out[String(step)] = `var(--xen-${name}-${step})`;
+    }
+    return out;
+}
+/**
+ * Build a Tailwind preset bound to the theme's CSS variables. Because every
+ * value is a `var(--xen-*)` reference, the preset itself is theme-agnostic at
+ * build time — swapping the injected vars restyles the app without a rebuild.
+ *
+ * Usage in a generated app's `tailwind.config.js`:
+ * `presets: [require('@xenition/ui/tailwind-preset').toTailwindPreset(theme)]`
+ */
+function toTailwindPreset(_theme) {
+    const colors = {
+        primary: { DEFAULT: 'var(--xen-primary)', ...rampVarObject('primary') },
+        'on-primary': 'var(--xen-on-primary)',
+        accent: { DEFAULT: 'var(--xen-accent)', ...rampVarObject('accent') },
+        'on-accent': 'var(--xen-on-accent)',
+        neutral: rampVarObject('neutral'),
+        surface: 'var(--xen-surface)',
+        'on-surface': 'var(--xen-on-surface)',
+        // Aliases for the most common Tailwind naming (shadcn-style). Generated code and hand authors
+        // reach for `bg-background`/`text-foreground`; map them to the kit's surface/on-surface so those
+        // classes resolve instead of rendering unstyled.
+        background: 'var(--xen-surface)',
+        foreground: 'var(--xen-on-surface)',
+        muted: 'var(--xen-muted)',
+        border: 'var(--xen-border)',
+        success: 'var(--xen-success)',
+        'on-success': 'var(--xen-on-success)',
+        warn: 'var(--xen-warn)',
+        'on-warn': 'var(--xen-on-warn)',
+        danger: 'var(--xen-danger)',
+        'on-danger': 'var(--xen-on-danger)',
+    };
+    return {
+        theme: {
+            extend: {
+                colors,
+                borderRadius: {
+                    sm: 'var(--xen-radius-sm)',
+                    DEFAULT: 'var(--xen-radius-md)',
+                    md: 'var(--xen-radius-md)',
+                    lg: 'var(--xen-radius-lg)',
+                    full: 'var(--xen-radius-full)',
+                },
+                spacing: {
+                    xs: 'var(--xen-space-xs)',
+                    sm: 'var(--xen-space-sm)',
+                    md: 'var(--xen-space-md)',
+                    lg: 'var(--xen-space-lg)',
+                    xl: 'var(--xen-space-xl)',
+                    '2xl': 'var(--xen-space-2xl)',
+                },
+                fontSize: {
+                    xs: 'var(--xen-text-xs)',
+                    sm: 'var(--xen-text-sm)',
+                    base: 'var(--xen-text-base)',
+                    lg: 'var(--xen-text-lg)',
+                    xl: 'var(--xen-text-xl)',
+                    '2xl': 'var(--xen-text-2xl)',
+                    '3xl': 'var(--xen-text-3xl)',
+                },
+                fontFamily: {
+                    heading: ['var(--xen-font-heading)'],
+                    body: ['var(--xen-font-body)'],
+                },
+            },
+        },
+    };
+}
+/**
+ * Flatten a compiled theme into plain resolved values (hex strings and px
+ * numbers) for React Native `StyleSheet` consumption.
+ */
+function toNativeTokens(theme) {
+    return {
+        colors: {
+            light: { ...theme.light },
+            dark: { ...theme.dark },
+        },
+        ramps: {
+            primary: { ...theme.ramps.primary },
+            accent: { ...theme.ramps.accent },
+            neutral: { ...theme.ramps.neutral },
+        },
+        radius: { ...theme.radius },
+        spacing: { ...theme.spacing },
+        typography: { ...theme.typography, scale: { ...theme.typography.scale } },
+    };
+}
+//# sourceMappingURL=outputs.js.map

package/dist/theme/outputs.js.map

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

package/dist/theme/types.d.ts

@@ -0,0 +1,111 @@
+/**
+ * Theme-layer types for `@xenition/ui`.
+ *
+ * A theme is authored as a tiny {@link ThemeSeed} (~5 values — the only thing
+ * the LLM or a settings form ever writes) and compiled by `compileTheme()`
+ * into a full {@link CompiledTheme}: 11-step color ramps, WCAG-AA-checked
+ * semantic slots for light + dark, and radius/spacing/typography scales.
+ */
+/** The 11 ramp steps, lightest (50) to darkest (950). */
+export declare const RAMP_STEPS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
+export type RampStep = (typeof RAMP_STEPS)[number];
+/** An 11-step color ramp; every value is a `#rrggbb` hex string. */
+export type ColorRamp = Record<RampStep, string>;
+export type NeutralTemperature = 'warm' | 'cool' | 'pure';
+export type ThemeShape = 'sharp' | 'rounded' | 'pill';
+export type ThemeMode = 'light' | 'dark' | 'both';
+/**
+ * `theme.seed.json` — the only theme input an app (or the builder LLM)
+ * provides. Everything else is derived deterministically.
+ */
+export interface ThemeSeed {
+    /** Brand color as `#rgb` or `#rrggbb` hex. */
+    primary: string;
+    /** Optional secondary color; defaults to `primary` with hue rotated +40°. */
+    accent?: string;
+    /** Gray-ramp temperature. */
+    neutral: NeutralTemperature;
+    /** Font family names (from the curated whitelist). */
+    font: {
+        heading: string;
+        body: string;
+    };
+    /** Corner style → radius scale. */
+    shape: ThemeShape;
+    /** Which color schemes the app ships. */
+    mode: ThemeMode;
+}
+/**
+ * Semantic color slots for one mode. Every `onX`/`X` pair is guaranteed by
+ * the compiler to have a WCAG 2.1 contrast ratio of at least 4.5:1.
+ */
+export interface SemanticColors {
+    surface: string;
+    onSurface: string;
+    primary: string;
+    onPrimary: string;
+    accent: string;
+    onAccent: string;
+    /** De-emphasized text/icon color (not part of a contrast-guaranteed pair). */
+    muted: string;
+    border: string;
+    success: string;
+    onSuccess: string;
+    warn: string;
+    onWarn: string;
+    danger: string;
+    onDanger: string;
+}
+/** Border-radius scale in px (numbers so React Native can consume directly). */
+export interface RadiusScale {
+    sm: number;
+    md: number;
+    lg: number;
+    full: number;
+}
+/** Spacing scale in px. */
+export interface SpacingScale {
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+    '2xl': number;
+}
+/** Font-size scale in px. */
+export interface TypeScale {
+    xs: number;
+    sm: number;
+    base: number;
+    lg: number;
+    xl: number;
+    '2xl': number;
+    '3xl': number;
+}
+export interface Typography {
+    fontHeading: string;
+    fontBody: string;
+    scale: TypeScale;
+}
+/**
+ * The compiler output. Never hand-written, never LLM-written — always the
+ * result of `compileTheme(seed)`.
+ */
+export interface CompiledTheme {
+    /** The seed this theme was compiled from (echoed back for provenance). */
+    seed: ThemeSeed;
+    /** Full 11-step ramps (light-mode orientation; dark mode inverts them). */
+    ramps: {
+        primary: ColorRamp;
+        accent: ColorRamp;
+        neutral: ColorRamp;
+    };
+    /** Semantic slots for light mode. */
+    light: SemanticColors;
+    /** Semantic slots for dark mode (derived by ramp inversion). */
+    dark: SemanticColors;
+    radius: RadiusScale;
+    spacing: SpacingScale;
+    typography: Typography;
+}
+//# sourceMappingURL=types.d.ts.map