@oxyhq/bloom 0.7.7 → 0.8.0

package/lib/typescript/module/theme/color-presets.d.ts

@@ -5,17 +5,17 @@ export type AppColorName = 'teal' | 'blue' | 'green' | 'amber' | 'yellow' | 'red
  * Keys carry a leading `--` for historical reasons (shadcn-style CSS variable
  * names) — keep in mind the values are platform-agnostic **raw HSL triples**
  * (e.g. `'185 100% 20%'` or `'185 100% 20% / 0.5'`), not CSS-resolved colors.
- * The same map drives both:
- *   - the web layer: the base `--x` tokens are wrapped to full `hsl(...)` colors
- *     (via `toWebColorValue`) before being written to `document.documentElement`
- *     / a `BloomColorScope` element, so `var(--x)` — the form Tailwind v4
- *     `@theme inline` compiles its color utilities to — resolves to a valid
- *     color directly; the resolved `--color-*` companions are written as
- *     `rgb(...)`, and
+ * The single canonical resolver `getResolvedTokens` (in `token-registry.ts`)
+ * converts this raw map to sRGB `rgb(...)` for every runtime write — the same
+ * values drive BOTH layers:
+ *   - the web layer: `getResolvedTokens`'s `rgb(...)` strings are written to
+ *     `document.documentElement` / a `BloomColorScope` element, so `var(--x)` —
+ *     the form Tailwind v4 `@theme inline` compiles its color utilities to —
+ *     resolves to a valid color directly, and
  *   - the native layer (`buildTheme` resolves the raw triples into `hsl(...)`
  *     strings consumable by React Native styles; `native-root-vars.native.ts`
- *     writes the raw triples through bloom's `hsl(var(--x))` `global.css`
- *     indirection).
+ *     writes the same canonical `rgb(...)` values into react-native-css's
+ *     `rootVariables` family).
  *
  * The `--` prefix is an implementation detail we will drop in a future major.
  */

package/lib/typescript/module/theme/color-scope/index.web.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../../src/theme/color-scope/index.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsE,MAAM,OAAO,CAAC;AAI3F,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAwBrD,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,WAAW,EAAE,YAAY,GAAG,SAAS,CAAC;IACtC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yGAAyG;IACzG,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAuBD,wBAAgB,eAAe,CAAC,EAC9B,WAAW,EACX,OAAe,EACf,KAAK,EACL,QAAQ,GACT,EAAE,oBAAoB,2CA4CtB;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,aAAa,CAUjF"}
+{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../../src/theme/color-scope/index.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsE,MAAM,OAAO,CAAC;AAI3F,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAiBrD,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,WAAW,EAAE,YAAY,GAAG,SAAS,CAAC;IACtC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yGAAyG;IACzG,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAuBD,wBAAgB,eAAe,CAAC,EAC9B,WAAW,EACX,OAAe,EACf,KAAK,EACL,QAAQ,GACT,EAAE,oBAAoB,2CA4CtB;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,aAAa,CAUjF"}

package/lib/typescript/module/theme/color-scope/style-builder.d.ts

@@ -13,8 +13,11 @@ export type VariableContextProviderComponent = React.ComponentType<{
 }>;
 /**
  * Build the CSS custom-property map for a preset, ready to be applied to a
- * subtree. Always includes the resolved `--color-*` vars so Tailwind v4
- * `@theme` utilities (e.g. `bg-background`) honour the scope.
+ * subtree. Every token is resolved to an sRGB `rgb(...)` string via
+ * `getResolvedTokens` — the single canonical token pipeline shared by web and
+ * native — so Tailwind v4 `@theme` utilities (e.g. `bg-background`) and
+ * `color-mix`-based alpha utilities (`bg-primary/10`) both resolve against the
+ * same color values. Keys retain the leading `--`.
  */
 export declare function buildScopeVars(colorPreset: AppColorName, mode: 'light' | 'dark'): Record<string, string>;
 /**

package/lib/typescript/module/theme/color-scope/style-builder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"style-builder.d.ts","sourceRoot":"","sources":["../../../../../src/theme/color-scope/style-builder.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGrD;;;;;GAKG;AACH,MAAM,MAAM,gCAAgC,GAAG,KAAK,CAAC,aAAa,CAAC;IACjE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC,CAAC;AASH;;;;GAIG;AACH,wBAAgB,cAAc,CAC5B,WAAW,EAAE,YAAY,EACzB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAExB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,0BAA0B,IAAI,gCAAgC,GAAG,IAAI,CAKpF;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CACpC,WAAW,EAAE,YAAY,EACzB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,SAAS,CAAC,SAAS,CAAC,CAKtB"}
+{"version":3,"file":"style-builder.d.ts","sourceRoot":"","sources":["../../../../../src/theme/color-scope/style-builder.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGrD;;;;;GAKG;AACH,MAAM,MAAM,gCAAgC,GAAG,KAAK,CAAC,aAAa,CAAC;IACjE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC,CAAC;AASH;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAC5B,WAAW,EAAE,YAAY,EACzB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAExB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,0BAA0B,IAAI,gCAAgC,GAAG,IAAI,CAKpF;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CACpC,WAAW,EAAE,YAAY,EACzB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,SAAS,CAAC,SAAS,CAAC,CAKtB"}

package/lib/typescript/module/theme/color-space.d.ts

@@ -0,0 +1,28 @@
+export interface Oklch {
+    l: number;
+    c: number;
+    h: number;
+}
+export interface Rgb {
+    r: number;
+    g: number;
+    b: number;
+}
+/** OKLCH → linear OKLab → linear sRGB → gamma sRGB → 0..255. Pure. */
+export declare function oklchToSrgb({ l, c, h }: Oklch): Rgb;
+export declare function srgbToRgbString({ r, g, b }: Rgb, alpha?: number): string;
+/**
+ * Parse an `rgb(...)` / `rgba(...)` string into an {@link Rgb}.
+ *
+ * Contract: input MUST be an `rgb(...)` / `rgba(...)` string (e.g. a resolved
+ * token from `getResolvedTokens`). Both modern (`rgb(r g b)`) and legacy
+ * (`rgb(r, g, b)`) syntaxes are accepted. Anything else throws — this is a
+ * canonical-pipeline primitive and a non-rgb input signals a real bug at the
+ * call site, never a value to silently coerce to black.
+ *
+ * @throws {Error} if `s` is not an `rgb()` / `rgba()` string.
+ */
+export declare function parseRgbString(s: string): Rgb;
+/** Cheap perceptual-ish distance in sRGB (sufficient for a ≤1 rounding gate). */
+export declare function deltaE(a: Rgb, b: Rgb): number;
+//# sourceMappingURL=color-space.d.ts.map

package/lib/typescript/module/theme/color-space.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-space.d.ts","sourceRoot":"","sources":["../../../../src/theme/color-space.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,KAAK;IAAG,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE;AAC1D,MAAM,WAAW,GAAG;IAAG,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE;AAMxD,sEAAsE;AACtE,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,GAAG,GAAG,CAgBnD;AAED,wBAAgB,eAAe,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAIxE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAO7C;AAED,iFAAiF;AACjF,wBAAgB,MAAM,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,GAAG,MAAM,CAE7C"}

package/lib/typescript/module/theme/index.d.ts

@@ -7,8 +7,7 @@ export { useTheme, useThemeColor, useBloomTheme } from './use-theme';
 export type { Theme, ThemeColors, ThemeMode } from './types';
 export type { AppColorName, AppColorPreset, PresetTokens } from './color-presets';
 export { APP_COLOR_NAMES, PREMIUM_COLOR_NAMES, APP_COLOR_PRESETS, HEX_TO_APP_COLOR, hexToAppColorName, } from './color-presets';
-export { getPresetVars, applyPresetVarsToDocument, toWebColorValue, } from './preset-vars';
-export type { PresetVarsOptions } from './preset-vars';
+export { getPresetVars, applyPresetVarsToDocument } from './preset-vars';
 export { applyDarkClass } from './apply-dark-class';
 export { setColorSchemeSafe } from './set-color-scheme-safe';
 export { initCssInteropDarkMode } from './init-css-interop';

package/lib/typescript/module/theme/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EACV,uBAAuB,EACvB,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AACpE,YAAY,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACrE,YAAY,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAC7D,YAAY,EAAE,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAClF,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,aAAa,EACb,yBAAyB,EACzB,eAAe,GAChB,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,YAAY,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAC5E,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EACV,uBAAuB,EACvB,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AACpE,YAAY,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACrE,YAAY,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAC7D,YAAY,EAAE,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAClF,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,YAAY,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAC5E,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC"}

package/lib/typescript/module/theme/native-root-vars.native.d.ts

@@ -21,18 +21,28 @@ import { type AppColorName } from './color-presets';
  * `BloomThemeProvider`'s `VariableContextProvider` only feeds path #1, so the navigator
  * host and every portal/modal — which render outside that subtree — never see the
  * preset vars and fall through to `rootVariables`/`universalVariables`. By default those
- * families hold only react-native-css's own `__rn-css-rem`/`__rn-css-color` entries
- * (Bloom's `global.css` defines the `hsl(var(--primary))` indirection but not the HSL
- * triples themselves — those are injected at runtime), so the whole tree below the
- * navigator renders monochrome. Writing the vars into `rootVariables` here is the
- * exact same mechanism react-native-css uses for compiled `:root {}` / `@theme` vars
- * (`StyleCollection.inject` does `rootVariables(name).set(valueArray)`), so portaled
- * content resolves the palette identically regardless of React-tree position.
+ * families hold only react-native-css's own `__rn-css-rem`/`__rn-css-color` entries, so
+ * the whole tree below the navigator renders monochrome until the palette is injected at
+ * runtime. Writing the vars into `rootVariables` here is the exact same mechanism
+ * react-native-css uses for compiled `:root {}` / `@theme` vars (`StyleCollection.inject`
+ * does `rootVariables(name).set(valueArray)`), so portaled content resolves the palette
+ * identically regardless of React-tree position.
  *
- * The raw tokens are written as HSL triples (`primary: '205 87% 53%'`) and the
- * resolved Tailwind v4 `--color-*` vars as sRGB `rgb(...)` (`color-primary:
- * 'rgb(31 153 239)'`) — the latter so `color-mix`-based alpha utilities resolve
- * on native (see `getPresetVars` / `hslTripletToRgb`).
+ * Consumer contract (CRITICAL — single canonical color pipeline)
+ * -------------------------------------------------------------
+ * Each base `--x` token is now written as a FULL `rgb(...)` color (not a raw HSL
+ * triple). A consuming app's Tailwind `@theme` must therefore reference these
+ * base tokens DIRECTLY (its Tailwind color var equals `var(--x)`) and must NOT
+ * wrap them in `hsl(...)`. The legacy `hsl(var(--x))` indirection (which assumed
+ * a raw triple) would produce the invalid `hsl(rgb(...))` and must be removed in
+ * every consumer. Web and native now share this one contract.
+ *
+ * Every token is written as an sRGB `rgb(...)` string from the single canonical
+ * token pipeline (`getResolvedTokens`) — `primary: 'rgb(31 153 239)'` — the SAME
+ * values web writes to `document.documentElement`. sRGB is the space
+ * react-native-css's `color-mix` resolver registers, so `color-mix`-based alpha
+ * utilities (`bg-primary/10`) resolve on native; full (non-alpha) utilities
+ * resolve directly through bloom's `global.css` `var(--x)` indirection.
  *
  * Why a STATIC `import`, not a runtime `require` (critical)
  * ---------------------------------------------------------
@@ -62,15 +72,15 @@ import { type AppColorName } from './color-presets';
  * `shared.rootVariables[name]`, and `@property --x` goes through
  * `name.startsWith("--") ? name.slice(2) : name`. The lookup side matches: a `var(--x)`
  * reference compiles to `[{}, "var", ident.slice(2)]`, so `varResolver` looks up the
- * bare name. `buildScopeVars` returns keys WITH the `--` prefix, so we strip it before
- * writing each entry.
+ * bare name. `getResolvedTokens` returns keys WITH the `--` prefix, so we strip it
+ * before writing each entry.
  *
  * Value shape
  * -----------
  * Each entry is a `VariableValue[]` — an array of `[value, mediaCondition?]` tuples.
  * Bloom's preset vars are unconditional, so each is a single-element `[[value]]`, e.g.
- * `rootVariables('primary').set([['205 87% 53%']])`. This is the same shape the compiler
- * emits for unconditional `:root` vars.
+ * `rootVariables('primary').set([['rgb(31 153 239)']])`. This is the same shape the
+ * compiler emits for unconditional `:root` vars.
  *
  * This is native-only and additive: the `VariableContextProvider` wrapper stays (it is
  * the correct, scoped mechanism for `BloomColorScope` subtree overrides and harmlessly

package/lib/typescript/module/theme/native-root-vars.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"native-root-vars.native.d.ts","sourceRoot":"","sources":["../../../../src/theme/native-root-vars.native.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6EG;AAEH;;;;;;;;;;;;GAYG;AACH,wBAAgB,mBAAmB,CAAC,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAS3F"}
+{"version":3,"file":"native-root-vars.native.d.ts","sourceRoot":"","sources":["../../../../src/theme/native-root-vars.native.ts"],"names":[],"mappings":"AAkBA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAGpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuFG;AAEH;;;;;;;;;;;;GAYG;AACH,wBAAgB,mBAAmB,CAAC,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAS3F"}

package/lib/typescript/module/theme/preset-vars.d.ts

@@ -1,72 +1,4 @@
 import { type AppColorName, type PresetTokens } from './color-presets';
-/**
- * Convert a shadcn-style HSL triple (`'H S% L%'`, optionally with an alpha tail
- * `'H S% L% / A'`) into an sRGB `rgb(...)` string.
- *
- * Why rgb and not hsl (the native alpha-utility bug this fixes)
- * -------------------------------------------------------------
- * Tailwind v4 compiles an alpha-on-theme-color utility (`bg-primary/10`) into a
- * `color-mix(... var(--color-primary) 10%, transparent)` declaration. On native,
- * react-native-css resolves that `color-mix` at runtime via `colorjs.io/fn`, but
- * its `color-mix` implementation registers ONLY the `sRGB`, `P3`, and `OKLab`
- * color spaces — never `HSL`. So if `--color-primary` resolves to an `hsl(...)`
- * string, `parse('hsl(...)')` throws, the mix is swallowed, and the utility
- * silently produces no color. Emitting the resolved var as `rgb(...)` (a space
- * colorjs.io always has registered) makes the alpha utilities resolve on native,
- * matching web. Full (non-alpha) utilities already worked because React Native's
- * native color parser handles `hsl()` directly; only `color-mix` was affected.
- *
- * Output is space-separated channels (`rgb(31 153 239)`), the modern CSS syntax
- * parsed by both `colorjs.io/fn` (with only sRGB/P3/OKLab registered) and
- * react-native-web / browsers. An alpha tail emits `rgb(r g b / a)`, likewise
- * parsed by both.
- *
- * Pure function — standard HSL→sRGB conversion, channels rounded to integers.
- * Tolerates a `deg` suffix on the hue and `%` suffixes on saturation/lightness.
- */
-export declare function hslTripletToRgb(triplet: string): string;
-/**
- * Transform a single preset var into the value to write to a WEB element
- * (`document.documentElement` or a `BloomColorScope` subtree element).
- *
- * The web apps (Vite + Tailwind v4 + shadcn) compile their `@theme inline`
- * block so the color utilities reference the BASE token directly — e.g.
- * `.bg-background { background-color: var(--background) }`. So on web the base
- * `--x` tokens MUST resolve to a COMPLETE CSS color; a bare HSL triple
- * (`185 50% 5%`) is invalid as a `background-color` value and renders
- * transparent (the production incident this fixes). We therefore wrap raw
- * triples in `hsl(...)`, preserving the exact preset color math (and any `/ A`
- * alpha tail, valid in modern `hsl(H S% L% / A)` syntax) with zero rounding
- * drift.
- *
- * Values that are already full colors pass through unchanged:
- *   - `--color-*` resolved vars (already `rgb(...)` from `getPresetVars`),
- *   - any value not shaped like a raw HSL triple (`--radius: 0.5rem`,
- *     pre-resolved `rgb(...)`/`hsl(...)`, etc.).
- *
- * NATIVE never calls this — `getPresetVars` returns raw triples verbatim and
- * `native-root-vars.native.ts` writes them through bloom's `hsl(var(--x))`
- * native `global.css` indirection. Pure function — no side effects — so it is
- * unit-testable in isolation.
- */
-export declare function toWebColorValue(key: string, value: string): string;
-export interface PresetVarsOptions {
-    /**
-     * Also emit Tailwind v4 resolved `--color-*` vars (as sRGB `rgb(...)` strings)
-     * alongside the raw HSL triples. Needed when scoping a subtree where
-     * Tailwind's `@theme` block has already precomputed `--color-*` at `:root`,
-     * so overriding `--background` alone wouldn't cascade to `bg-background`.
-     *
-     * The resolved vars are emitted as `rgb(...)` rather than `hsl(...)` so the
-     * alpha-on-theme-color utilities (`bg-primary/10`, `text-foreground/50`)
-     * resolve on native: Tailwind compiles those to a runtime `color-mix(...)` that
-     * react-native-css evaluates via `colorjs.io/fn`, which only registers the
-     * sRGB/P3/OKLab spaces (not HSL) — so an `hsl(...)` var would throw and the
-     * utility would silently render no color. See `hslTripletToRgb`. Default
-     * `false`.
-     */
-    includeResolvedColorVars?: boolean;
-}
 /**
  * Bloom's base preset tokens extended with the surface/card/chart/sidebar
  * tokens that apps layer on top of the core shadcn palette. Synthesized from
@@ -74,18 +6,23 @@ export interface PresetVarsOptions {
  *
  * This is the single source of truth for extended theming vars — consumer apps
  * must not redefine these per-app.
+ *
+ * Values are platform-agnostic **raw HSL triples** (`'185 100% 20%'`, optionally
+ * with a `/ A` alpha tail). The single canonical resolver `getResolvedTokens`
+ * (in `token-registry.ts`) converts these to sRGB `rgb(...)` for BOTH web and
+ * native runtime writes — this function only produces the raw triple map.
  */
-export declare function getPresetVars(colorName: AppColorName, mode: 'light' | 'dark', options?: PresetVarsOptions): PresetTokens;
+export declare function getPresetVars(colorName: AppColorName, mode: 'light' | 'dark'): PresetTokens;
 /**
  * Apply a preset's extended vars to `document.documentElement`. Web-only no-op
  * on native. `BloomThemeProvider` already writes the base preset vars on web;
  * call this only when an app needs the extended (card/chart/sidebar) tokens on
  * the document root.
  *
- * The base raw-HSL-triple tokens are wrapped to full `hsl(...)` colors via
- * `toWebColorValue` so `var(--x)` (the form Tailwind v4 `@theme inline`
- * compiles to) resolves directly on web; `--color-*` rgb vars pass through. See
- * `toWebColorValue` for the web var contract.
+ * Tokens are resolved to sRGB `rgb(...)` via the single canonical
+ * `getResolvedTokens` pipeline, so `var(--x)` — the form Tailwind v4
+ * `@theme inline` compiles its color utilities to — resolves directly to a
+ * valid color on web.
  */
-export declare function applyPresetVarsToDocument(colorName: AppColorName, mode: 'light' | 'dark', options?: PresetVarsOptions): void;
+export declare function applyPresetVarsToDocument(colorName: AppColorName, mode: 'light' | 'dark'): void;
 //# sourceMappingURL=preset-vars.d.ts.map

package/lib/typescript/module/theme/preset-vars.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preset-vars.d.ts","sourceRoot":"","sources":["../../../../src/theme/preset-vars.ts"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,YAAY,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAU1F;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CA+CvD;AAmBD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAIlE;AAyBD,MAAM,WAAW,iBAAiB;IAChC;;;;;;;;;;;;;OAaG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED;;;;;;;GAOG;AACH,wBAAgB,aAAa,CAC3B,SAAS,EAAE,YAAY,EACvB,IAAI,EAAE,OAAO,GAAG,MAAM,EACtB,OAAO,GAAE,iBAAsB,GAC9B,YAAY,CAwCd;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,YAAY,EACvB,IAAI,EAAE,OAAO,GAAG,MAAM,EACtB,OAAO,CAAC,EAAE,iBAAiB,GAC1B,IAAI,CAQN"}
+{"version":3,"file":"preset-vars.d.ts","sourceRoot":"","sources":["../../../../src/theme/preset-vars.ts"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,YAAY,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAe1F;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAC3B,SAAS,EAAE,YAAY,EACvB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,YAAY,CAiCd;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,YAAY,EACvB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,IAAI,CAQN"}

package/lib/typescript/module/theme/token-registry.d.ts

@@ -0,0 +1,53 @@
+import { APP_COLOR_NAMES, type AppColorName } from './color-presets';
+/**
+ * The canonical set of Bloom theme token names — WITHOUT the leading `--`.
+ *
+ * This is the single source of truth for which tokens a preset produces. It
+ * covers exactly the keys returned by `getPresetVars(name, mode)` (the base
+ * shadcn palette plus the synthesized extended tokens: card/chart/content-area/
+ * sidebar-*). The list is intentionally hand-maintained and verified by
+ * `token-registry.test.ts` against the live `getPresetVars('oxy', 'light')`
+ * output, so any drift in the preset shape fails CI.
+ *
+ * Order mirrors `getPresetVars`'s insertion order: base tokens first (in the
+ * order they appear in the preset data), then the synthesized extended tokens.
+ */
+export declare const CANONICAL_TOKENS: readonly ["background", "foreground", "surface", "surface-foreground", "popover", "popover-foreground", "primary", "primary-foreground", "secondary", "secondary-foreground", "muted", "muted-foreground", "accent", "accent-foreground", "destructive", "border", "input", "ring", "sidebar", "card", "card-foreground", "chart-1", "chart-2", "chart-3", "chart-4", "chart-5", "content-area", "sidebar-foreground", "sidebar-primary", "sidebar-primary-foreground", "sidebar-accent", "sidebar-accent-foreground", "sidebar-border", "sidebar-ring"];
+/** A canonical token name (no leading `--`). */
+export type CanonicalToken = (typeof CANONICAL_TOKENS)[number];
+/**
+ * Convert a shadcn-style HSL triple (`'H S% L%'`, optionally with an alpha tail
+ * `'H S% L% / A'`) into an sRGB `rgb(...)` string.
+ *
+ * Standard HSL→sRGB math with integer-rounded channels and modern
+ * space-separated output (`rgb(r g b)` / `rgb(r g b / a)`). This is the SINGLE
+ * conversion the whole library uses — web document writes, web scope vars, and
+ * native `rootVariables` all flow through `getResolvedTokens`, which calls this.
+ * The byte-for-byte output is frozen by the golden parity fixture
+ * (`__fixtures__/golden-resolved-tokens.json`), so the visible palette cannot
+ * drift.
+ *
+ * Task 2's `oklchToSrgb` (in `color-space.ts`) stays available for a FUTURE
+ * OKLCH re-authoring of the seed palette; it is intentionally NOT used here —
+ * routing through OKLCH would shift the rounded channels off the frozen palette.
+ *
+ * Pure function — no side effects.
+ */
+export declare function hslToSrgb(triple: string): string;
+/**
+ * Resolve a preset's canonical runtime color tokens to sRGB `rgb(...)` strings.
+ *
+ * THE single source of runtime color tokens for the whole library, on BOTH web
+ * and native. Takes the raw triple map from `getPresetVars(preset, mode)` (base
+ * + extended) and converts every value that looks like an HSL triple via
+ * `hslToSrgb`. Non-triple values (already-resolved colors, length/radius tokens)
+ * pass through unchanged. Keys retain the `--` prefix, so each `--x` token IS a
+ * full CSS color — no resolved-color companion universe, no per-platform wrapping.
+ *
+ * The result is frozen by the golden parity fixture
+ * (`__fixtures__/golden-resolved-tokens.json`), guaranteeing the visible palette
+ * matches the previous resolved-color pipeline byte-for-byte.
+ */
+export declare function getResolvedTokens(preset: AppColorName, mode: 'light' | 'dark'): Record<string, string>;
+export { APP_COLOR_NAMES };
+//# sourceMappingURL=token-registry.d.ts.map

package/lib/typescript/module/theme/token-registry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"token-registry.d.ts","sourceRoot":"","sources":["../../../../src/theme/token-registry.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAGrE;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,gBAAgB,0hBAmCnB,CAAC;AAEX,gDAAgD;AAChD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;AAW/D;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CA+ChD;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,YAAY,EACpB,IAAI,EAAE,OAAO,GAAG,MAAM,GACrB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAOxB;AAED,OAAO,EAAE,eAAe,EAAE,CAAC"}

package/lib/typescript/module/theme/types.d.ts

@@ -10,8 +10,11 @@ export interface ThemeColors {
     borderLight: string;
     primary: string;
     primaryForeground: string;
+    /** Preset accent tint (`--accent`) — a soft brand-tinted surface, NOT the page surface. */
     primaryLight: string;
+    /** Focus-ring shade (`--ring`) — the preset's emphasized ring/border color, NOT the page background. */
     primaryDark: string;
+    /** Preset secondary surface (`--secondary`) — a muted companion surface, NOT a mirror of `primary`. */
     secondary: string;
     tint: string;
     icon: string;

package/lib/typescript/module/theme/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/theme/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEjE,MAAM,WAAW,WAAW;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,kBAAkB,EAAE,MAAM,CAAC;IAE3B,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IAErB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IAEpB,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IAEpB,SAAS,EAAE,MAAM,CAAC;IAElB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IAEnB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IAEb,aAAa,EAAE,MAAM,CAAC;IACtB,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,wBAAwB,EAAE,MAAM,CAAC;IACjC,UAAU,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;CAClB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/theme/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEjE,MAAM,WAAW,WAAW;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,kBAAkB,EAAE,MAAM,CAAC;IAE3B,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IAErB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IAEpB,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,2FAA2F;IAC3F,YAAY,EAAE,MAAM,CAAC;IACrB,wGAAwG;IACxG,WAAW,EAAE,MAAM,CAAC;IAEpB,uGAAuG;IACvG,SAAS,EAAE,MAAM,CAAC;IAElB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IAEnB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IAEb,aAAa,EAAE,MAAM,CAAC;IACtB,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,wBAAwB,EAAE,MAAM,CAAC;IACjC,UAAU,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;CAClB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oxyhq/bloom",
-  "version": "0.7.7",
+  "version": "0.8.0",
   "description": "Bloom UI — Oxy ecosystem component library for React Native + Expo + Web",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",

package/src/__tests__/BloomColorScope.test.tsx

@@ -153,17 +153,17 @@ describe('BloomColorScope', () => {
       );
 
       // Web var contract: the scoped base tokens (`--background`, `--primary`)
-      // must be full `hsl(...)` colors — never bare HSL triples — so the web
-      // apps' `var(--x)` color utilities resolve. (The production incident was a
-      // bare triple here too.)
+      // must be full `rgb(...)` colors from the single canonical pipeline —
+      // never bare HSL triples — so the web apps' `var(--x)` color utilities
+      // resolve. (The production incident was a bare triple here too.)
       const vars = Object.assign(
         {},
         ...flat.filter((entry) => '--background' in entry || '--primary' in entry),
       ) as Record<string, unknown>;
       const background = String(vars['--background'] ?? '');
       const primary = String(vars['--primary'] ?? '');
-      expect(background.startsWith('hsl(')).toBe(true);
-      expect(primary.startsWith('hsl(')).toBe(true);
+      expect(background.startsWith('rgb(')).toBe(true);
+      expect(primary.startsWith('rgb(')).toBe(true);
       expect(/^-?\d[\d.]*\s+[\d.]+%/.test(background)).toBe(false);
     });
   });

package/src/__tests__/BloomThemeProvider.test.tsx

@@ -72,8 +72,8 @@ describe('BloomThemeProvider', () => {
         <ThemeDisplay />
       </BloomThemeProvider>,
     );
-    // Blue preset primary is HSL(205, 87%, 53%) derived from --primary CSS var
-    expect(getByTestId('primary').props.children).toBe('hsl(205, 87%, 53%)');
+    // Blue preset primary is HSL(205, 87%, 53%) → canonical sRGB rgb(31 153 239)
+    expect(getByTestId('primary').props.children).toBe('rgb(31 153 239)');
   });
 
   it('generates different background colors for light and dark modes', () => {
@@ -135,7 +135,8 @@ describe('useThemeColor', () => {
         <ColorDisplay colorKey="primary" />
       </BloomThemeProvider>,
     );
-    expect(getByTestId('color').props.children).toBe('hsl(185, 100%, 20%)');
+    // teal preset primary HSL(185, 100%, 20%) → canonical sRGB rgb(0 94 102)
+    expect(getByTestId('color').props.children).toBe('rgb(0 94 102)');
   });
 });
 

package/src/__tests__/apply-dark-class.test.ts

@@ -4,14 +4,13 @@
 
 import { Platform } from 'react-native';
 
-import { applyColorPresetVars, toWebColorValue } from '../theme/apply-dark-class';
+import { applyColorPresetVars } from '../theme/apply-dark-class';
 
-// `applyColorPresetVars` is the WEB write path that feeds the live document. It
-// regressed by writing the base `--x` tokens as bare HSL triples (`185 50% 5%`),
-// which the shadcn/Tailwind-v4 web apps consume directly as
-// `background-color: var(--background)` → invalid CSS → transparent → unstyled
-// app. These tests pin the corrected contract: base tokens are full `hsl(...)`
-// colors, `--color-*` companions stay `rgb(...)`.
+// `applyColorPresetVars` is the WEB write path that feeds the live document. The
+// single canonical token pipeline (`getResolvedTokens`) resolves every base
+// token to a full `rgb(...)` color, so the shadcn/Tailwind-v4 web apps that
+// consume `background-color: var(--background)` directly get a valid color (the
+// production incident was a bare HSL triple here). These tests pin that contract.
 
 describe('applyColorPresetVars — web document var contract', () => {
   const originalOS = Platform.OS;
@@ -26,11 +25,7 @@ describe('applyColorPresetVars — web document var contract', () => {
     document.documentElement.removeAttribute('style');
   });
 
-  it('re-exports toWebColorValue (helper is consumed by the web write paths)', () => {
-    expect(toWebColorValue('--background', '185 50% 5%')).toBe('hsl(185 50% 5%)');
-  });
-
-  it('writes base tokens to the document as full hsl() colors, not bare triples', () => {
+  it('writes base tokens to the document as full rgb() colors, not bare triples', () => {
     applyColorPresetVars('oxy', 'dark');
 
     const style = document.documentElement.style;
@@ -39,22 +34,32 @@ describe('applyColorPresetVars — web document var contract', () => {
     const foreground = style.getPropertyValue('--foreground').trim();
 
     expect(background).not.toBe('');
-    // The exact bug: a bare `H S% L%` triple. Must be a wrapped color now.
-    expect(background.startsWith('hsl(')).toBe(true);
+    // The exact bug: a bare `H S% L%` triple. Must be a resolved color now.
+    expect(background.startsWith('rgb(')).toBe(true);
     expect(background.endsWith(')')).toBe(true);
     expect(/^-?\d[\d.]*\s+[\d.]+%/.test(background)).toBe(false);
 
-    expect(primary.startsWith('hsl(')).toBe(true);
-    expect(foreground.startsWith('hsl(')).toBe(true);
+    expect(primary.startsWith('rgb(')).toBe(true);
+    expect(foreground.startsWith('rgb(')).toBe(true);
   });
 
-  it('keeps the resolved --color-* vars as rgb() full colors', () => {
+  it('writes the extended tokens (card/chart/sidebar) as rgb() colors too', () => {
     applyColorPresetVars('oxy', 'dark');
 
-    const colorPrimary = document.documentElement.style
-      .getPropertyValue('--color-primary')
-      .trim();
-    expect(colorPrimary.startsWith('rgb(')).toBe(true);
+    const style = document.documentElement.style;
+    expect(style.getPropertyValue('--card').trim().startsWith('rgb(')).toBe(true);
+    expect(style.getPropertyValue('--sidebar-primary').trim().startsWith('rgb(')).toBe(true);
+  });
+
+  it('does NOT emit any legacy resolved-color companion vars', () => {
+    applyColorPresetVars('oxy', 'dark');
+    const style = document.documentElement.style;
+    // The base `--x` token IS the color now; no resolved-color companion universe
+    // should be written. Scan every property that was set rather than referencing
+    // the legacy name literally.
+    const prefix = `--${'color'}-`;
+    const written = Array.from({ length: style.length }, (_, i) => style.item(i));
+    expect(written.some((name) => name.startsWith(prefix))).toBe(false);
   });
 
   it('no-ops on native (does not touch the document)', () => {

package/src/__tests__/native-root-vars.test.ts

@@ -52,16 +52,17 @@ describe('applyNativeRootVars (native variant)', () => {
       applyNativeRootVars('blue', 'light');
     });
 
-    // Keys are bare (no `--`), and the raw HSL triple is present unwrapped.
+    // Keys are bare (no `--`), and the value is the single canonical sRGB
+    // `rgb(...)` color from `getResolvedTokens` (`205 87% 53%` → `rgb(31 153 239)`).
+    // sRGB is the space react-native-css's `color-mix` resolver registers, so
+    // alpha utilities (`bg-primary/10`) resolve on native.
     expect(sets).toHaveProperty('primary');
     expect(sets).not.toHaveProperty('--primary');
-    expect(sets.primary).toEqual([['205 87% 53%']]);
+    expect(sets.primary).toEqual([['rgb(31 153 239)']]);
 
-    // Resolved Tailwind v4 `--color-*` vars are written too, also bare-keyed,
-    // and as sRGB `rgb(...)` (not `hsl(...)`) so native `color-mix` alpha
-    // utilities resolve — `205 87% 53%` → `rgb(31 153 239)`.
-    expect(sets).toHaveProperty('color-primary');
-    expect(sets['color-primary']).toEqual([['rgb(31 153 239)']]);
+    // The legacy resolved-color companion universe is gone — the base token IS
+    // rgb, so no `color-primary` companion is written.
+    expect(sets).not.toHaveProperty('color-primary');
 
     // Every value is a single-element value-array `[[value]]` of strings.
     for (const value of Object.values(sets)) {