chore(dashboard): sync the vendored CI UI Kit to 0.0.89

changelog.d/maintenance/0000-ui-kit-0-0-89.md

@@ -0,0 +1 @@
+- **chore(dashboard):** the vendored Keak CI UI Kit moves to 0.0.89 (`packages/ui-kit`, upstream `7fb92ac`).

packages/ui-kit/UPSTREAM.md

@@ -1,8 +1,8 @@
 # Upstream snapshot — @keak/cheaper-inference-ui-kit
 
 - repo: https://github.com/keak-ai/cheaper-inference-ui-kit
-- commit: 681cdb1915979f87b0d952f3ccedbbe10d9daacc
-- version: 0.0.87
+- commit: 7fb92ac7b66ef018132ebf65f052444ad8aa102a
+- version: 0.0.89
 - upstream-date: 2026-11-04
 - synced: 2026-11-04
 - license-authorization: Diego Souza (Keak, dono do repositório), 2026-10-19, por escrito na sessão de planejamento: "a licença está ok e da nossa empresa e livre para esse uso" — kit da própria empresa, autorizado para redistribuição neste repositório MIT.

packages/ui-kit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omniroute/ui-kit",
-  "version": "0.0.87",
+  "version": "0.0.89",
   "private": true,
   "license": "UNLICENSED",
   "description": "Vendored snapshot of @keak/cheaper-inference-ui-kit (see UPSTREAM.md). Source is consumed directly; no build.",

packages/ui-kit/src/ci-editions.css

@@ -65,7 +65,8 @@
   --ci-color-live: #477665;
   --ci-color-success: #3c735b;
   --ci-color-success-bg: #e4ece3;
-  --ci-color-warning: #99631f;
+  /* Warning is also small text (badges, alerts): 4.5:1 on warning-bg and every content surface. */
+  --ci-color-warning: #8a591c;
   --ci-color-warning-bg: #f3e6cf;
   --ci-color-danger: #ae4340;
   --ci-color-danger-bg: #f5e2dc;

packages/ui-kit/src/ci-tokens.css

@@ -96,7 +96,7 @@
   --ci-color-live: #cff331;
   --ci-color-success: #087a4f;
   --ci-color-success-bg: #e8f7f0;
-  --ci-color-warning: #a75a00;
+  --ci-color-warning: #a05600;
   --ci-color-warning-bg: #fff3df;
   --ci-color-danger: #bf3636;
   --ci-color-danger-bg: #ffeded;

packages/ui-kit/src/tokens.ts

@@ -44,7 +44,7 @@ export const ciTokens = {
     status: {
       live: "#cff331",
       success: "#087a4f",
-      warning: "#a75a00",
+      warning: "#a05600",
       danger: "#bf3636",
       info: "#2869d8",
     },

scripts/docs/readme-diagram-theme.mjs

@@ -47,10 +47,9 @@
 // rgb(242 240 232 / .22), pinned by the test); `grid` is the one value that is not a kit token —
 // a lighter tint of the border for the canvas pattern.
 //
-// One measured exception: light `warn` is the kit's Editions --ci-color-warning (#99631f) scaled
-// to 90 % per channel (same hue), #8a591c. The kit value is 4.46:1 on the canvas and 4.09:1 on
-// warnBg, below WCAG AA for the warn text the diagrams draw; #8a591c is ≥ 4.5:1 on every light
-// background (bg, surface, warnBg, surfaceSubtle, surfaceMuted). The test pins the derivation.
+// Light `warn` is the kit's Editions --ci-color-warning as is: since kit 0.0.89 it is #8a591c,
+// ≥ 4.5:1 on every light background the diagrams draw on (bg, surface, warnBg, surfaceSubtle,
+// surfaceMuted), so the diagrams no longer carry an override. The test pins it to the kit file.
 //
 // extraCss naming: diagram-local classes and custom properties passed through svgOpen's
 // `extraCss` carry the diagram's abbreviation as a prefix (`rl-…`, `cmp-…`, `--inv-*`…), never a

src/app/globals.css

@@ -171,23 +171,12 @@ html:root[data-ci-appearance="editions"] {
   --color-primary-ink: var(--ci-color-accent-active);
 }
 
-/* Warning text. The kit's light Editions warning #99631f reads only ≈ 4.1:1 on its own
-   --ci-color-warning-bg and ≈ 4.5:1 on the canvas, short of AA for small badge/button text, so
-   light Editions uses the same hue darkened (≈ 4.7:1 on the tinted background). Classic and both
-   dark palettes keep the kit value. Upstream fix requested; drop this when the kit ships it. */
+/* Warning text. Badges, warning buttons and `text-warning` read the warning ink through this alias.
+   Since kit 0.0.88 (upstream #155) the kit's own light Editions warning (#8c5a1b) reaches AA on its
+   tinted background, the canvas and the surface, so the alias is just the kit value. */
 :root {
   --color-warning-ink: var(--ci-color-warning);
 }
-html:root[data-ci-appearance="editions"]:not([data-theme="dark"]) {
-  --color-warning-ink: #8c5a1b;
-}
-/* Before the boot script runs (or without JS) <html> has no data-theme, and the kit then follows
-   the system preference: keep the kit's own (dark) warning ink there, as ci-editions.css does. */
-@media (prefers-color-scheme: dark) {
-  html:root[data-ci-appearance="editions"]:not([data-theme]) {
-    --color-warning-ink: var(--ci-color-warning);
-  }
-}
 
 /* Dark: the kit flips every --ci-* value on `data-theme="dark"` (themeStore sets it with the
    class). Only what the kit does not own stays here. */

tests/unit/docs/readme-diagram-theme.test.ts

@@ -83,16 +83,6 @@ const STATUS_AND_SURFACE_TOKENS: Record<string, string> = {
   accentSoft: "--ci-color-accent-surface-range",
 };
 
-// The one measured exception (readme-diagram-theme.mjs header): light warn is the kit's warning
-// scaled to 90 % per channel, because the kit value is below AA for text on the light canvas.
-const WARN_SCALE = 0.9;
-const scaleHex = (hex: string, k: number) =>
-  "#" +
-  [1, 3, 5]
-    .map((i) => Math.round(parseInt(hex.slice(i, i + 2), 16) * k))
-    .map((c) => c.toString(16).padStart(2, "0"))
-    .join("");
-
 // WCAG 2.x contrast; a translucent colour is composited over the background first.
 const rgbOf = (c: string, over?: number[]): number[] => {
   const hex = /^#([0-9a-f]{6})$/i.exec(c);
@@ -173,11 +163,13 @@ test("every KIT value equals what its Editions token resolves to (light warn exc
   }
 });
 
-test("light warn is the kit warning darkened 10 % — and only because the kit value misses AA", () => {
+test("warn is the kit's own Editions warning, which clears AA on every light diagram surface", () => {
+  // Kit 0.0.89 brought the light Editions warning to AA on every surface, so the diagrams read
+  // the kit value as is, in both schemes.
   const kitWarn = resolve("--ci-color-warning", lightBlock);
-  assert.equal(kitWarn, "#99631f");
-  assert.equal(KIT.light.warn, scaleHex(kitWarn, WARN_SCALE));
-  assert.ok(contrast(kitWarn, KIT.light.bg) < 4.5, "the kit warning is below AA on the canvas");
+  assert.equal(kitWarn, "#8a591c");
+  assert.equal(KIT.light.warn, kitWarn);
+  assert.equal(KIT.dark.warn, resolve("--ci-color-warning", darkBlock));
   for (const bg of ["bg", "surface", "warnBg", "surfaceSubtle", "surfaceMuted"]) {
     const ratio = contrast(KIT.light.warn, KIT.light[bg]);
     assert.ok(ratio >= 4.5, `light warn on ${bg}: ${ratio.toFixed(2)}:1`);

tests/unit/editions-warning-ink-contrast.test.ts

@@ -5,8 +5,8 @@ import test from "node:test";
 import { fileURLToPath } from "node:url";
 
 // Warning text (badge, warning button, `text-warning`) must reach WCAG AA (4.5:1) in the default
-// light Editions palette. The kit's light Editions warning #99631f does not on its own tinted
-// background, so globals.css swaps in --color-warning-ink. Colours are read from the CSS files,
+// light Editions palette. globals.css reads it through --color-warning-ink, an alias of the kit's
+// --ci-color-warning (AA since kit 0.0.88, upstream #155). Colours are read from the CSS files,
 // so a kit sync or a palette edit that breaks contrast fails here.
 
 const root = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "../..");
@@ -31,17 +31,17 @@ function editionsLight(token: string): string {
   return m[1].toLowerCase();
 }
 
-function lightEditionsInk(): string {
-  const m =
-    /html:root\[data-ci-appearance="editions"\]:not\(\[data-theme="dark"\]\)\s*\{[^}]*--color-warning-ink:\s*(#[0-9a-fA-F]{6})/.exec(
-      globals
-    );
-  assert.ok(m, "globals.css sets --color-warning-ink for light Editions");
-  return m[1].toLowerCase();
+function warningInkIsTheKitToken(): boolean {
+  return /:root\s*\{[^}]*--color-warning-ink:\s*var\(--ci-color-warning\);/.test(globals);
 }
 
 test("light Editions warning ink reaches AA on every surface it is drawn on", () => {
-  const ink = lightEditionsInk();
+  // The alias is the kit token, so the kit's light Editions value is what renders.
+  assert.ok(
+    warningInkIsTheKitToken(),
+    "globals.css maps --color-warning-ink to --ci-color-warning"
+  );
+  const ink = editionsLight("ci-color-warning");
   const surfaces = {
     "warning background": editionsLight("ci-color-warning-bg"),
     canvas: editionsLight("ci-color-background"),
@@ -53,10 +53,9 @@ test("light Editions warning ink reaches AA on every surface it is drawn on", ()
   }
 });
 
-test("the kit's own light Editions warning still needs the override", () => {
-  // If upstream fixes its warning colour, this fails: drop the override in globals.css then.
-  const kit = editionsLight("ci-color-warning");
-  assert.ok(contrast(kit, editionsLight("ci-color-warning-bg")) < 4.5);
+test("globals.css no longer overrides the kit's warning colour", () => {
+  // Kit 0.0.88 (upstream #155) ships the AA value, so a hard-coded override would only drift.
+  assert.doesNotMatch(globals, /--color-warning-ink:\s*#[0-9a-fA-F]{3,8}/);
 });
 
 test("warning badge, warning button and text-warning read the warning ink", () => {
@@ -71,13 +70,11 @@ test("warning badge, warning button and text-warning read the warning ink", () =
 
 test("without data-theme, a dark system preference keeps the kit's dark warning ink", () => {
   // The kit picks dark Editions from prefers-color-scheme when <html> has no data-theme (before
-  // the boot script, or without JS); the light override must not paint #8c5a1b on that.
+  // the boot script, or without JS). The alias follows the kit token, so no palette- or
+  // theme-specific override of --color-warning-ink may exist in globals.css.
   assert.match(
     editions,
     /@media \(prefers-color-scheme: dark\)\s*\{\s*:is\(html:root:not\(\[data-theme\]\)/
   );
-  assert.match(
-    globals,
-    /@media \(prefers-color-scheme: dark\)\s*\{\s*html:root\[data-ci-appearance="editions"\]:not\(\[data-theme\]\)\s*\{\s*--color-warning-ink:\s*var\(--ci-color-warning\);/
-  );
+  assert.equal(globals.match(/--color-warning-ink:/g)?.length, 1);
 });