[HOMEASSIST-2] Shared Tailwind v4 theme in packages/ui #2

Merged

chris merged 6 commits from feature/HOMEASSIST-2 into main

2026-09-30 09:39:24 -06:00

chris commented

2026-09-30 07:48:49 -06:00

Owner

Ticket

HOMEASSIST-2 Dashboards: shared Tailwind v4 setup and theme in packages/ui

Summary

Shared theme.css in packages/ui: semantic tokens, dark by default, light opt-in via data-theme='light'.
dashboardPlugins() Vite factory exported from packages/ui. Map needs --configLoader runner and Vite >= 6.1.
Map consumes the shared theme with no dark-mode drift, verified via a compiled CSS diff and compile()-based tests.
CSS delivery decision (shadow-root injection) documented in packages/ui/README.md.

Notes

The light palette is derived (the mock is dark-only) and was not verified in a browser.
The dev server and harness were not checked in a browser. Port 5173 was occupied on the host, so the dev server was verified on 5199.
Known non-fixes: the toast-in keyframe hard-codes translate(-50%); token role naming (bg-border/25); map's tsconfig has bun types.
Out of scope, pre-existing: personIcon in Card.tsx interpolates name/avatarUrl into divIcon HTML (HTML-injection sink). Suggest a follow-up ticket.

🤖 Generated with Claude Code

## Ticket [HOMEASSIST-2](http://192.168.2.100:7123/home/browse/HOMEASSIST-2/) Dashboards: shared Tailwind v4 setup and theme in packages/ui ## Summary - Shared `theme.css` in `packages/ui`: semantic tokens, dark by default, light opt-in via `data-theme='light'`. - `dashboardPlugins()` Vite factory exported from `packages/ui`. Map needs `--configLoader runner` and Vite >= 6.1. - Map consumes the shared theme with no dark-mode drift, verified via a compiled CSS diff and `compile()`-based tests. - CSS delivery decision (shadow-root injection) documented in `packages/ui/README.md`. ## Notes - The light palette is derived (the mock is dark-only) and was not verified in a browser. - The dev server and harness were not checked in a browser. Port 5173 was occupied on the host, so the dev server was verified on 5199. - Known non-fixes: the `toast-in` keyframe hard-codes `translate(-50%)`; token role naming (`bg-border/25`); map's tsconfig has bun types. - Out of scope, pre-existing: `personIcon` in `Card.tsx` interpolates name/avatarUrl into divIcon HTML (HTML-injection sink). Suggest a follow-up ticket. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

chris added 6 commits

2026-09-30 07:48:49 -06:00

[HOMEASSIST-2] Add shared light/dark theme tokens to packages/ui. dcfb91dee6

[HOMEASSIST-2] Share Vite plugin config via packages/ui. 50efab5936

[HOMEASSIST-2] Consume the shared theme in the map dashboard. 7e75e24170

[HOMEASSIST-2] Document shared theme and CSS delivery decision. 2decde5a0c

[HOMEASSIST-2] Address review findings e46695a2f1

[HOMEASSIST-2] Tighten theme guards

ticket-done / done (pull_request) Failing after 1s

Details

00caad4bde

chris merged commit 9b9ab26cb6 into main