docs(dashboard): UI kit migration — docs, ratchets and final report (KEA-7886, Task 42)

changelog.d/features/0000-dashboard-keak-ci-ui-kit.md

@@ -0,0 +1 @@
+- **feat(dashboard):** the dashboard and the standalone pages (login, status, error, legal, docs) run on the Keak CI UI Kit (KEA-7886), vendored as the `packages/ui-kit` workspace at a pinned upstream commit (`packages/ui-kit/UPSTREAM.md`, byte-identity guarded by `npm run check:ui-kit-snapshot`). The Keak identity replaces the old one — lime accent, self-hosted Inter / Instrument Serif / IBM Plex Mono, kit radius and surfaces, no background grid — and the theme follows the system by default with light and dark from the kit; the accent color presets in Settings › Appearance are retired (an old saved preset is ignored). The shell is the kit's sidebar and header with a Keak product switcher, and the command palette is a kit dialog. `@/shared/components` keeps its public API as adapters over the kit, so screens kept their imports, and every icon is a Lucide glyph through `<Icon>` / `ICON_MAP`. See `docs/architecture/DESIGN_SYSTEM.md`.

changelog.d/maintenance/0000-dashboard-legacy-ui-removal.md

@@ -0,0 +1 @@
+- **refactor(dashboard):** the pre-kit UI is gone — the legacy dashboard shell and its `UI_KIT_SHELL` cutover flag (the catalog is back to 111 flags), the Material Symbols font and npm package (an icon name missing from `ICON_MAP` now draws a neutral placeholder glyph and warns outside production), the shared `Footer` that nothing rendered, and the token aliases with no consumer (`--grad-brand`, `--color-accent-hover`, `--color-traffic-*`, `--table-row-*`, `--table-cell-border`) (KEA-7886).

config/quality/dashboard-typecheck-baseline.json

@@ -18,22 +18,9 @@
     "TS2503": 3
   },
   "src/app/(dashboard)/dashboard/cache/__tests__/CachePage.test.tsx": {
-    "TS2305": 4,
     "TS1117": 2
   },
-  "src/app/(dashboard)/dashboard/cache/__tests__/CachePerformance.test.tsx": {
-    "TS2305": 2,
-    "TS2322": 3
-  },
-  "src/app/(dashboard)/dashboard/cache/__tests__/CacheTrends.test.tsx": {
-    "TS2305": 2,
-    "TS2322": 8
-  },
-  "src/app/(dashboard)/dashboard/cache/__tests__/IdempotencyLayer.test.tsx": {
-    "TS2305": 2
-  },
   "src/app/(dashboard)/dashboard/cache/__tests__/MemoryCards.test.tsx": {
-    "TS2305": 2,
     "TS2322": 2
   },
   "src/app/(dashboard)/dashboard/cache/components/CachePerformance.tsx": {
@@ -55,7 +42,7 @@
     "TS2339": 5,
     "TS2345": 6,
     "TS2698": 2,
-    "TS2322": 16
+    "TS2322": 15
   },
   "src/app/(dashboard)/dashboard/compression/studio/EncoderComparisonTable.tsx": {
     "TS2322": 2
@@ -72,15 +59,9 @@
   "src/app/(dashboard)/dashboard/costs/quota-share/components/UsageLogCard.tsx": {
     "TS2869": 3
   },
-  "src/app/(dashboard)/dashboard/discovery/__tests__/DiscoveryPageClient.test.tsx": {
-    "TS2305": 3
-  },
   "src/app/(dashboard)/dashboard/endpoint/EndpointPageClient.tsx": {
     "TS2322": 22
   },
-  "src/app/(dashboard)/dashboard/memory/components/tabs/MemoriesTab.tsx": {
-    "TS2322": 2
-  },
   "src/app/(dashboard)/dashboard/omni-skills/OmniSkillsPageClient.tsx": {
     "TS2503": 2
   },
@@ -114,9 +95,6 @@
   "src/app/(dashboard)/dashboard/providers/[id]/__tests__/phase1e.test.tsx": {
     "TS2741": 3
   },
-  "src/app/(dashboard)/dashboard/providers/[id]/components/CompatibleModelsSection.tsx": {
-    "TS2741": 2
-  },
   "src/app/(dashboard)/dashboard/providers/[id]/components/ConnectionsListPanel.tsx": {
     "TS2322": 3
   },
@@ -147,15 +125,9 @@
   "src/app/(dashboard)/dashboard/quota/page.tsx": {
     "TS2339": 5
   },
-  "src/app/(dashboard)/dashboard/runtime/RuntimePageClient.tsx": {
-    "TS2304": 2
-  },
   "src/app/(dashboard)/dashboard/settings/components/AppearanceTab.tsx": {
     "TS2339": 5
   },
-  "src/app/(dashboard)/dashboard/settings/components/RedisLauncherPanel.tsx": {
-    "TS2345": 14
-  },
   "src/app/(dashboard)/dashboard/tools/traffic-inspector/components/CustomHostsManager.tsx": {
     "TS2339": 2
   },
@@ -171,21 +143,15 @@
   "src/app/(dashboard)/dashboard/usage/components/ProviderLimits/index.tsx": {
     "TS2339": 3
   },
-  "src/app/(dashboard)/dashboard/usage/components/ProviderLimits/parts/QuotaEnvGroup.tsx": {
-    "TS2739": 2
-  },
   "src/lib/combos/builderDraft.ts": {
     "TS2741": 2
   },
   "src/lib/services/htmlRewriter.ts": {
     "TS2322": 3,
     "TS2345": 3
   },
-  "src/mitm/inspector/sseMerger.ts": {
-    "TS2352": 2
-  },
   "src/shared/components/OAuthModal.tsx": {
-    "TS2769": 4,
+    "TS2769": 3,
     "TS2345": 4
   },
   "src/shared/components/SkillsConceptCard.tsx": {
@@ -203,5 +169,6 @@
   "src/shared/schemas/cliCatalog.ts": {
     "TS2554": 3
   },
-  "_relax_velocity_2026_08_30": "per-file TS diagnostic counts raised by 20% (229 → 324); velocity phase, see quality-baseline.json _policy."
+  "_relax_velocity_2026_08_30": "per-file TS diagnostic counts raised by 20% (229 \u2192 324); velocity phase, see quality-baseline.json _policy.",
+  "_ratchet_2026_10_22_kea7886": "Surgical ratchet-down after the UI kit migration (KEA-7886, Task 42): (file, code) pairs now at 0 removed; the others set to min(baseline, ceil(live * 1.2)) so the velocity-phase 20% headroom is kept. Live 194; sum of counts 322 -> 270 (16 pairs)."
 }

config/quality/quality-baseline.json

@@ -379,10 +379,11 @@
       "dedicatedGate": true
     },
     "rtlPhysicalClasses": {
-      "value": 1214,
+      "value": 843,
       "direction": "down",
       "eps": 0,
-      "_seeded_2026_07_28": "Measured by scripts/check/check-rtl-ratchet.mjs. tests/unit/ui/rtl-logical-classes.test.tsx pins four components and states it is partial (#3541); this bounds the remainder."
+      "_seeded_2026_07_28": "Measured by scripts/check/check-rtl-ratchet.mjs. tests/unit/ui/rtl-logical-classes.test.tsx pins four components and states it is partial (#3541); this bounds the remainder.",
+      "_tighten_2026_10_22_kea7886": "1214 -> 843. Measured rtlPhysicalClasses=702 by scripts/check/check-rtl-ratchet.mjs on feat/new-uikit-task42 (feat/new-uikit af385849 + docs): the UI kit migration (KEA-7886) replaced physical left/right utilities across the dashboard. 843 = ceil(702 * 1.2), keeping the velocity-phase 20% headroom (_policy) instead of freezing at the live count."
     }
   },
   "_coverage_note": "Pisos anti-flake ~2pt abaixo do real do CI mergeado MEDIDO COM os 135 testes religados (run 27247237268: statements 78.4 / lines 78.4 / functions 83.84 / branches 75.73). O religamento da 6A.1 HONESTIFICOU a regua: os ~82.5 anteriores eram inflados porque modulos nunca importados ficavam fora do denominador do c8. Apertar via --require-tighten na Fase 6A (2026-06-16).",

docs/architecture/ARCHITECTURE.md

@@ -154,6 +154,14 @@ Main pages under `src/app/(dashboard)/dashboard/`:
 - `/dashboard/compression` — compression analytics, statistics, and pipeline assignment
 - `/dashboard/api-manager` — API key lifecycle and model permissions
 
+UI layer: every page renders inside one shell — `src/app/(dashboard)/layout.tsx` →
+`src/shared/components/layouts/DashboardLayout.tsx` → `DashboardShell.tsx` (the kit's
+`SidebarProvider`/`SidebarInset`, OmniRoute's `Sidebar.tsx` and `Header.tsx`). Pages import their
+building blocks from `@/shared/components` (adapters over the vendored Keak CI UI Kit in
+`packages/ui-kit`) or from kit component subpaths (`@omniroute/ui-kit/table`, `…/page-header`), and
+icons through `<Icon>` (`ICON_MAP` → Lucide). Theme (`system` by default, light/dark) and tokens come
+from the kit via the bridge in `src/app/globals.css`. Details: `docs/architecture/DESIGN_SYSTEM.md`.
+
 ## High-Level System Context
 
 ```mermaid

docs/architecture/CODEBASE_DOCUMENTATION.md

@@ -34,13 +34,15 @@ without inventing new modules.
 | Build         | Next.js standalone via `scripts/build/build-next-isolated.mjs`                                                           |
 | Lint/format   | ESLint flat config + Prettier (`lint-staged` via Husky pre-commit)                                                       |
 | Module system | ESM everywhere (`"type": "module"`)                                                                                      |
-| Workspaces    | npm workspace — `open-sse` is the only sub-workspace                                                                     |
+| Dashboard UI  | **Tailwind CSS 4** + the vendored **Keak CI UI Kit** (`packages/ui-kit`), Lucide icons — see `DESIGN_SYSTEM.md`          |
+| Workspaces    | npm workspaces — `open-sse`, `packages/browser-pool`, `packages/ui-kit`                                                  |
 
 Path aliases (`tsconfig.json`):
 
 - `@/*` → `src/*`
 - `@omniroute/open-sse` → `open-sse/index.ts`
 - `@omniroute/open-sse/*` → `open-sse/*`
+- `@omniroute/ui-kit` → `packages/ui-kit/src`, `@omniroute/ui-kit/*` → `packages/ui-kit/src/*`
 
 Default HTTP port: **`20128`** (API and dashboard share the same process). Data
 directory is `DATA_DIR` env var, defaulting to `~/.omniroute/`.
@@ -53,6 +55,7 @@ directory is `DATA_DIR` env var, defaulting to `~/.omniroute/`.
 OmniRoute/
 ├── src/                  Next.js application (App Router, libs, domain, server, shared)
 ├── open-sse/             Streaming engine workspace (@omniroute/open-sse)
+├── packages/             Workspaces: ui-kit (vendored Keak CI UI Kit), browser-pool
 ├── electron/             Desktop wrapper (Electron 41 main + preload)
 ├── bin/                  CLI entry points (omniroute, reset-password)
 ├── tests/                Unit, integration, e2e, protocols-e2e, translator, security, fixtures
@@ -433,6 +436,13 @@ Split into focused subdirectories:
   `providerModelAliases.ts`, `rateLimiter.ts`, `releaseNotes.ts`,
   `a11yAudit.ts`, plus dashboard hooks/components under `services/`, `network/`,
   `middleware/`, `schemas/`, `hooks/`, `components/`.
+- `components/` — the dashboard component API (`index.tsx` barrel: `Button`, `Input`,
+  `Select`, `Modal`, `Card`, `DataTable`, …). The primitives are adapters over the
+  vendored kit (`packages/ui-kit`, imported by component subpath such as
+  `@omniroute/ui-kit/button`), so screens keep their imports while the markup is the
+  kit's. The shell is `layouts/DashboardLayout.tsx` → `layouts/DashboardShell.tsx`
+  (kit `SidebarProvider`/`SidebarInset`) with `Sidebar.tsx` and `Header.tsx`; icons go
+  through `Icon.tsx` and `constants/iconMap.ts`. See `docs/architecture/DESIGN_SYSTEM.md`.
 
 ---