Skip to content

refactor(ui): shared UI foundation (tokens, theming, Inter, primitives)#389

Open
patschmittdev wants to merge 1 commit into
masterfrom
refactor/ui-foundation
Open

refactor(ui): shared UI foundation (tokens, theming, Inter, primitives)#389
patschmittdev wants to merge 1 commit into
masterfrom
refactor/ui-foundation

Conversation

@patschmittdev

Copy link
Copy Markdown
Collaborator

What

Extracts the shared UI foundation off master as a clean, standalone base so the UX verticals (voice, ambient, chatroom sessions, settings, agent profile, chat polish) can each branch off it instead of one 50-commit kitchen-sink branch.

This is commit bb8b482, already validated as the base of the voice PR #387. Promoting it to its own PR lets the rest of the work stack cleanly off a small, reviewable base.

Contents (19 files, +1021)

Design system / tokens (index.css)

  • Light-default + .dark palette (monochrome with one reserved genesis accent), elevation shadows, lit surfaces (.surface-panel / .surface-card), restyled scrollbars, day/night crossfade, prefers-reduced-motion, entry animations.

Theming

  • useTheme.ts -- day/night state, persistence, and setTheme bridge.
  • env.d.ts -- @fontsource-variable/inter module decl + setTheme on window.desktop.

Typography

  • Inter (@fontsource-variable/inter) wired in renderer.tsx; optical legibility + tabular figures.

Primitives

  • New: ui/skeleton.tsx, ui/tabs.tsx. Token adoption: ui/dialog.tsx, ui/tooltip.tsx.

Foundation hooks

  • useResizableWidth, useResponsiveLayout, useCopyToClipboard, useDelayedFlag (+ lib/utils).

Stack

master
 └─ refactor/ui-foundation   <- this PR (base)
     |- #387 voice           re-points base here (bb8b482 is its first commit; no force-push)
     |- #386 ambient         rebases here (resolves the .app-ambient / env.d.ts overlap)
     `- chatroom / settings / agent-profile / chat-polish (stack on top)

Validation

  • npm run lint -- green: tsc --noEmit, eslint, dependency-cruiser (520 modules, 0 violations), yaml, md.
  • Foundation unit tests -- 27 passed (useResizableWidth, useResponsiveLayout, utils).

No behavior beyond the shared base; each vertical adopts these tokens in its own PR.

Isolated foundation layer split out of feat/webgl-ambient-background so the
verticals can branch off a clean base instead of one 50-commit branch:

- index.css design-token system (light/dark palettes, single reserved accent,
  global reduced-motion kill-switch) plus the Inter variable font
- shared UI primitives: ui/tabs, ui/skeleton; tooltip/dialog token fixes
- generic hooks: useTheme, useResponsiveLayout, useDelayedFlag,
  useCopyToClipboard, useResizableWidth (+ barrel exports)
- lib/utils: relative-time, ISO-date display, skill-context parsing

Fold in the P1 accessibility fix: the resizable-panel grip is now keyboard
operable (focusable, Arrow Left/Right resize by 16px, aria-value*), matching
the hand-rolled separator in MindSidebar, covered by a focused test.

Scope notes: test/helpers.ts and the shared declaration files are intentionally
left for the verticals (their final shapes depend on per-vertical types). No
upstream push.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant