@multiplatform.one/theme 7.4.1 → 7.6.0

package/src/theme/sizeRecipes.spec.ts

@@ -7,6 +7,7 @@ import {
   SIZE_RECIPE_COMPACT_RATIOS,
   SIZE_RECIPE_HEIGHTS,
   SIZE_RECIPE_HEIGHTS_TOUCH,
+  SIZE_RECIPE_RADII,
   SIZE_RECIPE_RATIOS,
   applyTouchFloor,
   defaultRecipeInputs,
@@ -22,6 +23,7 @@ import {
   sizeRecipeIconVariants,
   sizeRecipes,
   sizeRecipeTypeVariants,
+  textFieldInset,
   type SizeRecipe,
 } from "./sizeRecipes";
 
@@ -75,10 +77,9 @@ describe("size recipes", () => {
     }
   });
 
-  it("static variants match sizeRecipeFromHeight for every token", () => {
+  it("static variants match the generated table for every token", () => {
     for (const token of RECIPE_KEYS) {
-      const recipe = sizeRecipeFromHeight(SIZE_RECIPE_HEIGHTS[token]);
-      expect(sizeRecipes[token]).toEqual(recipe);
+      const recipe = sizeRecipes[token];
       expect(sizeRecipeBoxVariants[token]).toEqual({
         height: recipe.height,
         paddingHorizontal: recipe.paddingHorizontal,
@@ -90,6 +91,7 @@ describe("size recipes", () => {
         height: recipe.iconSize,
       });
     }
+    expect(sizeRecipeFromHeight(44)).toEqual(sizeRecipes.$4);
   });
 
   it("sizeRecipeForToken falls back to $4", () => {
@@ -230,7 +232,7 @@ describe("generateSizeRecipes (LC-70)", () => {
     expect(generated.families.control.recipes.$4.height).toBe(44);
     expect(generated.families.controlCompact.recipes.$4.height).toBe(44);
     expect(generated.families.control.recipes.$4.paddingHorizontal).toBe(18);
-    expect(generated.families.controlCompact.recipes.$4.paddingHorizontal).toBe(13);
+    expect(generated.families.controlCompact.recipes.$4.paddingHorizontal).toBe(16);
     expect(generated.families.controlCompact.recipes.$4.paddingHorizontal).toBeLessThan(
       generated.families.control.recipes.$4.paddingHorizontal,
     );
@@ -260,12 +262,23 @@ describe("generateSizeRecipes (LC-70)", () => {
     expect(sizeRecipeTypeVariants).toBe(recipeFamilies.control.typeVariants);
     expect(sizeRecipeIconVariants).toBe(recipeFamilies.control.iconVariants);
     expect(SIZE_RECIPE_HEIGHTS).toBe(recipeFamilies.control.heights);
+    expect(SIZE_RECIPE_RADII).toBe(recipeFamilies.control.radii);
   });
 
   it("sizeRecipeEscape is identity", () => {
     expect(sizeRecipeEscape(32)).toBe(32);
     expect(sizeRecipeEscape("keep")).toBe("keep");
   });
+
+  it("textFieldInset is min(padX, floor((height-fontSize)/2)) — $4 → 15 (LC-84)", () => {
+    expect(textFieldInset(sizeRecipes.$4)).toBe(15);
+    expect(textFieldInset({ height: 44, paddingHorizontal: 18, fontSize: 14 })).toBe(15);
+    expect(textFieldInset({ height: 32, paddingHorizontal: 12, fontSize: 14 })).toBe(9);
+    expect(textFieldInset({ height: 48, paddingHorizontal: 8, fontSize: 14 })).toBe(8);
+    expect(textFieldInset(sizeRecipes.$4)).toBeLessThanOrEqual(
+      Math.floor((sizeRecipes.$4.height - sizeRecipes.$4.fontSize) / 2),
+    );
+  });
 });
 
 describe("size recipe families", () => {
@@ -291,8 +304,8 @@ describe("size recipe families", () => {
     expect(compact.boxVariants.$4.paddingHorizontal).toBeLessThan(
       control.boxVariants.$4.paddingHorizontal,
     );
-    expect(compact.boxVariants.$4.paddingHorizontal).toBe(13);
-    expect(compact.boxVariants.$4.gap).toBe(7);
+    expect(compact.boxVariants.$4.paddingHorizontal).toBe(16);
+    expect(compact.boxVariants.$4.gap).toBe(9);
     expect(sizeRecipeForToken("$4", { family: "controlCompact" })).toEqual(compact.recipes.$4);
   });
 });

package/src/theme/sizeRecipes.ts

@@ -1,9 +1,11 @@
 /**
- * Coordinated control-size recipes (LC-65 SIZE-RECIPE, LC-70 RECIPE-INPUTS).
+ * Coordinated control-size recipes (LC-75 SIZE-RECIPE, LC-80 RECIPE-INPUTS).
  *
- * A flat size ramp cannot encode relationships: padding, font, and icon
- * must stay in ratio with height. Radius is excluded — it stays on the
- * borderRadius knob and must never scale with size.
+ * The default ladder is the measured Tamagui v5 table in recipeInputs
+ * (padX / font / icon / radius per size token). Gap equals radius at
+ * every size and at every borderRadius knob stop (`applyRadiusStop`).
+ * A linear ratio is only the `{ baseHeight }` fallback — not a
+ * documented divergence (MPO-46 / R6).
  *
  * Tables are GENERATED from `defaultRecipeInputs` at module eval (Tamagui
  * 2.0.0-rc.41 flattens `styled(View, { variants: { size: tables } })` when
@@ -13,25 +15,30 @@
  * reserve it for non-enumerable values only. Do NOT put recipe tables on a
  * `createStyledContext` primitive (`neverFlatten`).
  *
- * Reference md ($4 / $true): height 44, padX 18, font 14, icon 16, gap 9
- * (the measured tamagui.dev $4 control — MPO-13).
+ * Reference md ($4 / $true): height 44, padX 18, font 14, icon 16, radius 9,
+ * gap 9 (the measured tamagui.dev $4 control — MPO-13 / MPO-19 X1/X2).
  * `sizeToken` remains the recipe KEY (string "$4") so styled() variants
  * can switch; it is not a height scalar.
  *
- * Families: `control` uses `inputs.ratios`. `controlCompact` uses
- * `compactRatios` at the SAME heights (tighter pad/font/icon/gap).
+ * Families: `control` reads `inputs.tokenTable`. `controlCompact` reads
+ * `compactTokenTable` at the SAME heights (Input padX, tighter type).
  *
- * On touch (LC-67), `applyTouchFloor` / `sizeRecipeForToken(token, { touch: true })`
- * lift painted height to ≥ 44 while pad/font/icon stay in ratio. Static
- * `sizeRecipe*Variants` stay on the desktop table — runtime fragments
- * carry the floor; consumers spread `knobProps.control` after `size`.
+ * On touch (LC-77), `applyTouchFloor` / `sizeRecipeForToken(token, { touch: true })`
+ * lift painted height to ≥ 44. Static `sizeRecipe*Variants` stay on the
+ * desktop table — runtime fragments carry the floor; consumers spread
+ * `knobProps.control` after `size`.
  */
 
 export {
   DEFAULT_SIZE_RECIPE_INPUTS,
+  SIZE_RECIPE_RADIUS_STOPS,
   SIZE_RECIPE_TOKENS,
   SIZE_TOKEN_EXPONENTS,
+  TAMAGUI_COMPACT_SIZE_TABLE,
+  TAMAGUI_CONTROL_SIZE_TABLE,
+  TAMAGUI_INPUT_PADX,
   TOUCH_HEIGHT_FLOOR,
+  applyRadiusStop,
   cloneSizeRecipeInputs,
   createRecipeFamilies,
   defaultRecipeInputs,
@@ -39,6 +46,7 @@ export {
   generateSizeRecipeTables,
   generateSizeRecipes,
   mergeRecipeInputs,
+  recipeFromTokenChannels,
   resolveSizeRecipeInputs,
 } from "./recipeInputs";
 export type {
@@ -52,13 +60,17 @@ export type {
   SizeRecipeFamilyName,
   SizeRecipeIconVariant,
   SizeRecipeInputs,
+  SizeRecipeRadiusStop,
   SizeRecipeRatios,
   SizeRecipeTables,
   SizeRecipeToken,
+  SizeRecipeTokenChannels,
+  SizeRecipeTokenTable,
   SizeRecipeTypeVariant,
 } from "./recipeInputs";
 
 import {
+  cloneSizeRecipeInputs,
   defaultRecipeInputs,
   generateSizeRecipes,
   sizeRecipeFromHeight as recipeFromHeight,
@@ -88,6 +100,7 @@ function adoptFamily(target: SizeRecipeFamily, source: SizeRecipeFamily): void {
   replaceRecord(target.typeVariants, source.typeVariants);
   replaceRecord(target.iconVariants, source.iconVariants);
   replaceRecord(target.heightVariants, source.heightVariants);
+  replaceRecord(target.radii, source.radii);
 }
 
 const initial = generateSizeRecipes(defaultRecipeInputs);
@@ -106,6 +119,7 @@ export const sizeRecipeTypeVariants = recipeFamilies.control.typeVariants;
 export const sizeRecipeIconVariants = recipeFamilies.control.iconVariants;
 export const SIZE_RECIPE_HEIGHTS = recipeFamilies.control.heights;
 export const SIZE_RECIPE_HEIGHTS_TOUCH = recipeFamilies.control.touchHeights;
+export const SIZE_RECIPE_RADII = recipeFamilies.control.radii;
 export const SIZE_RECIPE_RATIOS = recipeFamilies.control.ratios;
 export const SIZE_RECIPE_COMPACT_RATIOS = recipeFamilies.controlCompact.ratios;
 
@@ -139,6 +153,7 @@ function adoptGenerated(next: GeneratedSizeRecipes): GeneratedSizeRecipes {
     boxVariants: sizeRecipeBoxVariants,
     typeVariants: sizeRecipeTypeVariants,
     iconVariants: sizeRecipeIconVariants,
+    radii: SIZE_RECIPE_RADII,
     families: recipeFamilies,
   };
   return current;
@@ -150,7 +165,7 @@ export function setSizeRecipeInputs(partial: Partial<RecipeInputs> = {}): Genera
 }
 
 export function getSizeRecipeInputs(): RecipeInputs {
-  return { ...current.inputs, ratios: { ...current.inputs.ratios } };
+  return cloneSizeRecipeInputs(current.inputs);
 }
 
 export function getGeneratedSizeRecipes(): GeneratedSizeRecipes {
@@ -210,3 +225,18 @@ export function sizeRecipeForToken(
 export function sizeRecipeEscape<T>(value: T): T {
   return value;
 }
+
+/**
+ * LC-84 TEXT-INSET — optical vertical inset of a text field, never larger
+ * than the recipe padX. Extra horizontal space is legal only when an icon
+ * well occupies that side, not as empty-field padX.
+ *
+ *   min(paddingHorizontal, floor((height − fontSize) / 2))
+ *
+ * `$4` (44 / 18 / 14) → 15. Button ladders keep recipe.paddingHorizontal (18).
+ */
+export function textFieldInset(
+  recipe: Pick<SizeRecipe, "height" | "paddingHorizontal" | "fontSize">,
+): number {
+  return Math.min(recipe.paddingHorizontal, Math.floor((recipe.height - recipe.fontSize) / 2));
+}

package/src/theme/theme.native.tsx

@@ -2,6 +2,7 @@ import { ToastProvider } from "@tamagui/toast";
 import { useContext, useMemo } from "react";
 import { type CreateTamaguiProps, TamaguiProvider, type TamaguiProviderProps } from "tamagui";
 import type { PropsWithChildren } from "react";
+import { CornerSmoothingStyles } from "./cornerSmoothing";
 import { FontKnobStyles } from "./FontKnobStyles";
 import { PresetContext, type PresetContextValue } from "./PresetContext";
 import { defaultPreset } from "./presets";
@@ -61,6 +62,7 @@ function KnobBridge({ children }: PropsWithChildren) {
   const tree = (
     <>
       <FontKnobStyles />
+      <CornerSmoothingStyles />
       {children}
     </>
   );

package/src/theme/theme.provider.spec.ts

@@ -15,6 +15,15 @@ describe("ThemeProvider knob injectors", () => {
     expect(bridge).toContain("<FontKnobStyles");
   });
 
+  it("mounts CornerSmoothingStyles inside KnobBridge so the squircle sheet is not tree-shaken", () => {
+    const src = readFileSync(join(here, "theme.tsx"), "utf8");
+    expect(src).toMatch(/import \{ CornerSmoothingStyles \} from "\.\/cornerSmoothing"/);
+    const bridge = src.slice(src.indexOf("function KnobBridge"));
+    expect(bridge).toContain("<CornerSmoothingStyles");
+    const native = readFileSync(join(here, "theme.native.tsx"), "utf8");
+    expect(native).toContain("<CornerSmoothingStyles");
+  });
+
   it("does not invent a second knob store — cookies still feed PresetContext", () => {
     const src = readFileSync(join(here, "theme.tsx"), "utf8");
     expect(src).toContain("readPresetCookie");

package/src/theme/theme.tsx

@@ -5,6 +5,7 @@ import { type CreateTamaguiProps, TamaguiProvider, type TamaguiProviderProps } f
 import type { PropsWithChildren } from "react";
 import { animationDurations } from "./animations/css";
 import { getCookieWatchList, readOverridesCookie, readPresetCookie } from "./cookies";
+import { CornerSmoothingStyles } from "./cornerSmoothing";
 import { FontKnobStyles } from "./FontKnobStyles";
 import { PresetContext, type PresetContextValue } from "./PresetContext";
 import { defaultPreset } from "./presets";
@@ -157,9 +158,10 @@ export function ThemeProvider<T extends CreateTamaguiProps>({
  * If an ancestor PresetContext already exists (e.g. from a Storybook decorator),
  * the bridge is a pass-through to avoid overriding it.
  *
- * FontKnobStyles mounts here (not only in Storybook CreatePreview) so
- * headingFont/bodyFont restyle every shipped app that uses ThemeProvider.
- * Hairline and corner-smoothing already self-mount on module load.
+ * FontKnobStyles and CornerSmoothingStyles mount here (not only in
+ * Storybook CreatePreview) so heading/body fonts and the corner-shape
+ * stylesheet restyle every shipped app that uses ThemeProvider. Hairline
+ * still self-mounts on module load.
  */
 function KnobBridge({ children }: PropsWithChildren) {
   const existingCtx = useContext(PresetContext);
@@ -192,6 +194,7 @@ function KnobBridge({ children }: PropsWithChildren) {
   const tree = (
     <>
       <FontKnobStyles />
+      <CornerSmoothingStyles />
       {children}
     </>
   );

package/src/theme/tint.spec.tsx

@@ -13,12 +13,16 @@ import type { ThemeName } from "@tamagui/web";
 import { PresetContext, type PresetContextValue } from "./PresetContext";
 import type { Preset } from "./preset.types";
 import { defaultKnobs } from "./knobs";
+import { defaultPreset } from "./presets";
 import { Tint, useTintDepth } from "./Tint";
 
 // ---------------------------------------------------------------------------
 // Helpers
 // ---------------------------------------------------------------------------
 
+/** Decorative nest family (R12) — the same four names as `defaultPreset.tints`. */
+const FAMILY: ThemeName[] = ["orange", "blue", "purple", "pink"];
+
 function makePreset(tints: ThemeName[]): Preset {
   return {
     theme: "light" as ThemeName,
@@ -42,71 +46,70 @@ function collectThemes(html: string): string[] {
   return Array.from(html.matchAll(/data-tamagui-theme="([^"]+)"/g), (m) => m[1]);
 }
 
+function nestTints(
+  count: number,
+  innermost: ReactNode = createElement("span", null, "inner"),
+): ReactNode {
+  let node: ReactNode = innermost;
+  for (let i = 0; i < count; i++) {
+    node = createElement(Tint, null, node);
+  }
+  return node;
+}
+
 // ---------------------------------------------------------------------------
 // Tests
 // ---------------------------------------------------------------------------
 
 describe("Tint", () => {
-  it("selects tints[1 % length] for a single <Tint>", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
+  it("defaultPreset.tints is the four-name decorative family", () => {
+    expect(defaultPreset.tints).toEqual(FAMILY);
+  });
+
+  it("selects tints[0] for a single <Tint> (depth 1)", () => {
     const tree = wrapWithPreset(
-      tints,
+      FAMILY,
       createElement(Tint, null, createElement("span", null, "hello")),
     );
     const html = renderToHtml(tree);
     const themes = collectThemes(html);
-    // depth = 0 (parent) + 1 = 1 → tints[1 % 3] = "green"
-    expect(themes).toEqual(["green"]);
+    // depth = 0 (parent) + 1 = 1 → tints[(1 - 1) % 4] = "orange"
+    expect(themes).toEqual(["orange"]);
   });
 
   it("increments depth correctly with nested <Tint>", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
     const tree = wrapWithPreset(
-      tints,
+      FAMILY,
       createElement(Tint, null, createElement(Tint, null, createElement("span", null, "inner"))),
     );
     const html = renderToHtml(tree);
     const themes = collectThemes(html);
-    // outer: depth=1 → tints[1%3]="green", inner: depth=2 → tints[2%3]="blue"
-    expect(themes).toEqual(["green", "blue"]);
+    // outer: depth=1 → tints[0]="orange", inner: depth=2 → tints[1]="blue"
+    expect(themes).toEqual(["orange", "blue"]);
   });
 
   it("wraps via modulo when depth exceeds tints.length", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
-    // 4 nested Tints: depths 1,2,3,4 → indices 1,2,0,1 → green,blue,red,green
-    const tree = wrapWithPreset(
-      tints,
-      createElement(
-        Tint,
-        null,
-        createElement(
-          Tint,
-          null,
-          createElement(Tint, null, createElement(Tint, null, createElement("span", null, "deep"))),
-        ),
-      ),
-    );
+    // 5 nested Tints: depths 1..5 → indices 0,1,2,3,0 → orange,blue,purple,pink,orange
+    const tree = wrapWithPreset(FAMILY, nestTints(5, createElement("span", null, "deep")));
     const html = renderToHtml(tree);
     const themes = collectThemes(html);
-    expect(themes).toEqual(["green", "blue", "red", "green"]);
+    expect(themes).toEqual(["orange", "blue", "purple", "pink", "orange"]);
   });
 
   it("applies alt prop offset", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
-    // alt=2 at top level: depth = 0 + 1 + 2 = 3 → tints[3%3] = "red"
+    // alt=2 at top level: depth = 0 + 1 + 2 = 3 → tints[(3 - 1) % 4] = "purple"
     const tree = wrapWithPreset(
-      tints,
+      FAMILY,
       createElement(Tint, { alt: 2 }, createElement("span", null, "alt")),
     );
     const html = renderToHtml(tree);
     const themes = collectThemes(html);
-    expect(themes).toEqual(["red"]);
+    expect(themes).toEqual(["purple"]);
   });
 
   it("skips Theme wrapper when disable is true", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
     const tree = wrapWithPreset(
-      tints,
+      FAMILY,
       createElement(Tint, { disable: true }, createElement("span", null, "no theme")),
     );
     const html = renderToHtml(tree);
@@ -115,10 +118,9 @@ describe("Tint", () => {
   });
 
   it("still increments depth when disabled (so children see correct depth)", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
-    // disabled outer (depth=1, no theme wrap), inner (depth=2, wraps with tints[2%3]="blue")
+    // disabled outer (depth=1, no theme wrap), inner (depth=2, wraps with tints[1]="blue")
     const tree = wrapWithPreset(
-      tints,
+      FAMILY,
       createElement(
         Tint,
         { disable: true },
@@ -163,14 +165,13 @@ describe("useTintDepth", () => {
   });
 
   it("returns current depth inside nested <Tint> components", () => {
-    const tints: ThemeName[] = ["red", "green", "blue"];
     let capturedDepth = -1;
     const Probe = () => {
       capturedDepth = useTintDepth();
       return createElement("span", null, "probe");
     };
     const tree = wrapWithPreset(
-      tints,
+      FAMILY,
       createElement(Tint, null, createElement(Tint, null, createElement(Probe))),
     );
     renderToHtml(tree);

package/src/theme/useResolvedKnobs.ts

@@ -1,5 +1,5 @@
 import { createContext, useContext, useEffect, useMemo, useState } from "react";
-import type { SizeTokens } from "tamagui";
+import { type SizeTokens, useThemeName } from "tamagui";
 import { defaultKnobs, type Knobs } from "./knobs";
 import type { IntentOverride } from "./preset.types";
 import type { KnobPropsOverride, ResolvedKnobs } from "./recipes";
@@ -111,12 +111,14 @@ export const solidButtonIntents = new Set(["error", "warning", "success"]);
  *   6. Apply density (space only; compact option wins when provided)
  *   7. Re-clamp to Surface ceiling (compact option cannot exceed parent)
  *   8. OS reduced-motion forces animation="none"
- *   9. Call resolveKnobs(mergedKnobs, override) — override merges last
+ *   9. Call resolveKnobs(mergedKnobs, override, scheme) — override merges last
  */
 export function useResolvedKnobs(options?: UseResolvedKnobsOptions): ResolvedKnobs {
   const presetCtx = usePresetContext();
   const contextIntent = useIntentContext();
   const prefersReducedMotion = usePrefersReducedMotion();
+  const themeName = useThemeName() as string | undefined;
+  const scheme = themeName?.startsWith("dark") ? "dark" : "light";
   const surfaceCtx = SurfaceContext.useStyledContext();
   const surfaceSize = surfaceCtx?.size ?? "unset";
   const surfaceDensity = surfaceCtx?.density ?? "unset";
@@ -186,7 +188,7 @@ export function useResolvedKnobs(options?: UseResolvedKnobsOptions): ResolvedKno
       merged = { ...merged, animation: "none" };
     }
 
-    const resolved = resolveKnobs(merged, override);
+    const resolved = resolveKnobs(merged, override, scheme);
 
     if (intent && component === "Button" && solidButtonIntents.has(intent)) {
       const labelColor = merged.fillStyle === "filled" ? "$color" : "$color11";
@@ -210,5 +212,6 @@ export function useResolvedKnobs(options?: UseResolvedKnobsOptions): ResolvedKno
     prefersReducedMotion,
     surfaceSize,
     surfaceDensity,
+    scheme,
   ]);
 }

package/types/audit/index.d.ts

@@ -2,4 +2,6 @@ export type { AuditReport, AuditSummary, ElementAudit, PropertyAudit, TextProper
 export { runConstraintAudit } from "./constraintAudit";
 export type { AuditDiff, ElementDiff, PropertyDiff } from "./diffReport";
 export { diffAuditReports, formatAuditReport } from "./diffReport";
+export type { GeometryDiff, GeometryMove, MatrixElementGeometry, MatrixRect, MatrixSnapshot, MatrixTextSample, NoBreakageInput, NoBreakageResult, TextContrastResult, TextContrastViolation, } from "./themeMatrix";
+export { auditSignatures, captureMatrixSnapshot, diffGeometry, evaluateNoBreakage, evaluateTextContrast, } from "./themeMatrix";
 //# sourceMappingURL=index.d.ts.map

package/types/audit/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/audit/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,iBAAiB,GAClB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACvD,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/audit/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,iBAAiB,GAClB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACvD,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACnE,YAAY,EACV,YAAY,EACZ,YAAY,EACZ,qBAAqB,EACrB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,GACtB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,eAAe,EACf,qBAAqB,EACrB,YAAY,EACZ,kBAAkB,EAClB,oBAAoB,GACrB,MAAM,eAAe,CAAC"}

package/types/audit/themeMatrix.d.ts

@@ -0,0 +1,172 @@
+/**
+ * Theme-matrix invariance + no-breakage assertions (MPO-18).
+ *
+ * The theme matrix sweeps every story cell across the globals axes
+ * (scheme × theme colour × preset) and holds TWO separate assertions,
+ * never one:
+ *
+ *  1. GEOMETRY INVARIANCE across the THEME axis — switching the theme
+ *     colour may repaint ink, never move a box. Colour is the one axis
+ *     whose whole contract is "paint only" (LC-80 RECIPE-INPUTS: size
+ *     recipes are generated from inputs at config time; Tamagui colour
+ *     themes stay the colour path). Any geometry delta across colours
+ *     means a recipe consumed a theme option.
+ *
+ *  2. NO-BREAKAGE across the PRESET axis — presets are EXPECTED to move
+ *     pixels (boldPreset flips radius/border/weight/space; heroPreset
+ *     moves the page title scale), so geometry equality is deliberately
+ *     NOT asserted there. What must hold in every preset cell: the story
+ *     renders, structural values stay on the knob scales
+ *     (runConstraintAudit off-scale count vs the default cell), and text
+ *     ink keeps the WCAG floor (evaluateTextContrast).
+ *
+ * MEASURING RULE: every text assertion here measures TEXT NODES — the
+ * computed style of the element that DIRECTLY contains the text, and the
+ * Range-measured rect of the text itself — never the story frame. The
+ * frame's font-family is always Inter and its colour is not the ink
+ * (that trap shipped three wrong tickets: MPO-40/44/48).
+ *
+ * `captureMatrixSnapshot` is completely self-contained (no imports, no
+ * closures) so it can be passed straight to Playwright's
+ * `page.evaluate(captureMatrixSnapshot)`, exactly like
+ * `runConstraintAudit`. The comparators are pure Node-side functions so
+ * vitest can hold them to the tripwire tests without a browser.
+ */
+export interface MatrixRect {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export interface MatrixElementGeometry {
+    /** Stable structural path from the story root (tag:index-among-same-tag). */
+    key: string;
+    tag: string;
+    rect: MatrixRect;
+    /**
+     * Geometry-bearing computed properties. The theme axis must never move
+     * any of these; colour properties are deliberately absent.
+     */
+    props: Record<string, string>;
+    /** Range-measured rect of the element's DIRECT text nodes, when any. */
+    textRect?: MatrixRect;
+}
+export interface MatrixTextSample {
+    /** Structural key of the element that DIRECTLY contains the text node. */
+    key: string;
+    /** First characters of the text node (identification only). */
+    text: string;
+    /** Composited ink colour as #rrggbb (alpha already blended over background). */
+    color: string;
+    /** Composited effective background as #rrggbb. */
+    background: string;
+    /** False when no opaque backdrop could be resolved (gradient/image/alpha chain). */
+    backgroundResolved: boolean;
+    /** True when a background-image/gradient sits between text and backdrop. */
+    overImage: boolean;
+    fontSizePx: number;
+    fontWeightNum: number;
+    rect: MatrixRect;
+}
+export interface MatrixSnapshot {
+    /** False when the story root is missing or empty — always a failure. */
+    storyRendered: boolean;
+    geometry: MatrixElementGeometry[];
+    textSamples: MatrixTextSample[];
+}
+export interface GeometryMove {
+    key: string;
+    property: string;
+    before: string;
+    after: string;
+}
+export interface GeometryDiff {
+    identical: boolean;
+    /** Elements present in `before` but missing in `after`. */
+    removedKeys: string[];
+    /** Elements present in `after` but missing in `before`. */
+    addedKeys: string[];
+    moves: GeometryMove[];
+}
+export interface TextContrastViolation {
+    key: string;
+    text: string;
+    color: string;
+    background: string;
+    ratio: number;
+    required: number;
+}
+export interface TextContrastResult {
+    measured: number;
+    unmeasurable: number;
+    violations: TextContrastViolation[];
+}
+/**
+ * Captures the geometry + text-ink snapshot of the rendered story.
+ *
+ * Self-contained by construction — pass directly to
+ * `page.evaluate(captureMatrixSnapshot)`.
+ */
+export declare function captureMatrixSnapshot(): MatrixSnapshot;
+/**
+ * Geometry invariance diff for the THEME axis: every element must keep its
+ * rect, its text rect, and every geometry-bearing computed property.
+ * `epsilonPx` absorbs sub-pixel raster jitter in rect measurements only —
+ * computed properties compare exactly.
+ */
+export declare function diffGeometry(before: MatrixSnapshot, after: MatrixSnapshot, options?: {
+    epsilonPx?: number;
+}): GeometryDiff;
+/**
+ * The contrast assertion for the matrix (and for downstream repos — call
+ * this instead of keeping a local contrast spec): WCAG AA floors from
+ * `colorRules`, large text (≥24px, or ≥18.66px at ≥700) takes the 3:1
+ * floor, everything else 4.5:1. Samples whose backdrop could not be
+ * resolved (gradient/image/never-opaque chain) are counted, never
+ * silently dropped.
+ */
+export declare function evaluateTextContrast(samples: MatrixTextSample[]): TextContrastResult;
+/** One matrix cell's no-breakage inputs (preset axis). */
+export interface NoBreakageInput {
+    storyRendered: boolean;
+    /** Off-scale violation count from `runConstraintAudit` in this cell. */
+    offScaleViolations: number;
+    /** Off-scale count in the same story+scheme at the DEFAULT preset. */
+    baselineOffScaleViolations: number;
+    /**
+     * Per-violation signatures in this cell — see {@link auditSignatures}. A
+     * gate that reports "32 violations where the default cell had 31" names
+     * nothing a person can go and fix; with these it names the elements.
+     */
+    offScaleSignatures?: string[];
+    /** The same signatures in the DEFAULT-preset cell. */
+    baselineOffScaleSignatures?: string[];
+    /** Contrast result of this cell. */
+    contrast: TextContrastResult;
+    /** Contrast violation count in the same story+scheme at the DEFAULT preset. */
+    baselineContrastViolations: number;
+    /** The DEFAULT-preset cell's contrast result, for naming the new misses. */
+    baselineContrast?: TextContrastResult;
+}
+/**
+ * Flattens a `runConstraintAudit` report into one signature per violation,
+ * `"<element label> :: <violation>"`, so two cells can be compared by what
+ * broke rather than by how many things broke.
+ */
+export declare function auditSignatures(violations: Array<{
+    label: string;
+    violations: string[];
+}>): string[];
+export interface NoBreakageResult {
+    ok: boolean;
+    failures: string[];
+}
+/**
+ * NO-BREAKAGE evaluation for the preset axis. Geometry equality is
+ * deliberately NOT part of this: presets are expected to move pixels.
+ * Breakage means: the story failed to render, structural values fell off
+ * the knob scales beyond the default cell's standing debt, or text ink
+ * lost contrast the default cell still had.
+ */
+export declare function evaluateNoBreakage(input: NoBreakageInput): NoBreakageResult;
+//# sourceMappingURL=themeMatrix.d.ts.map

package/types/audit/themeMatrix.d.ts.map

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

package/types/figma/figmaTokens.d.ts

@@ -65,7 +65,7 @@ export interface FigmaRadiusMode {
     /** `Sizing` collection variable to alias (e.g. `radius-4`). */
     figmaName: string;
     px: number;
-    /** Outer/nested radius fragment (`knobProps.borderRadiusOuter`). */
+    /** Outer/nested radius fragment (`knobProps.borderRadiusNested`). */
     outerToken: string;
     outerFigmaName: string;
     outerPx: number;