bytelyst/learning_ai_notes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(ui): record platform core migration verification

Browse Source
This commit is contained in:
Saravana Achu Mac 2026-05-06 11:13:34 -07:00
parent b73c969d14
commit 4e01733f31
1 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/UI_UX_PLATFORM_CORE_ROADMAP.md
View File

@ -20,7 +20,7 @@ Common platform currently provides:
- `@bytelyst/design-tokens`: product token packages, including NoteLett `--nl-*` - `@bytelyst/design-tokens`: product token packages, including NoteLett `--nl-*`
- `@bytelyst/dashboard-components`: app-level `ErrorPage`, `NotFoundPage`, `LoadingSpinner`, `LoadingSkeleton`, `PageHeader`, `EmptyState` - `@bytelyst/dashboard-components`: app-level `ErrorPage`, `NotFoundPage`, `LoadingSpinner`, `LoadingSkeleton`, `PageHeader`, `EmptyState`
NoteLett currently has a thin local wrapper at `web/src/components/ui/Primitives.tsx`, but it only exposes `Button`, `Badge`, and `Card`. NoteLett currently has a thin local wrapper at `web/src/components/ui/Primitives.tsx`. It now exposes the first platform-core migration set: `Button`, `Badge`, `Card`, `Panel`, `IconButton`, `ListItemButton`, `StatusBadge`, `Input`, `Textarea`, `Select`, `Label`, `Timeline`, and `DiffCard`.
Large product surfaces still use raw markup and inline styles: Large product surfaces still use raw markup and inline styles:
@ -112,10 +112,11 @@ Principles:
### Phase UI0 — Baseline Audit And Rules ### Phase UI0 — Baseline Audit And Rules
- [ ] Add UI migration audit commands for raw controls, global surface classes, hardcoded inline styles, and direct `@bytelyst/ui` imports. - [x] Add UI migration audit commands for raw controls, global surface classes, hardcoded color literals, and direct `@bytelyst/ui` imports. Commit: `b73c969d142728fb854fc3ac1e527272a0ad66f0`. Verified with `pnpm run audit:ui`; strict mode remains intentionally gated until legacy raw controls and surface classes are migrated.
- [ ] Document the allowed component layers in `AGENTS.md`: common-platform core UI first, NoteLett wrapper second, product-domain components third. - [x] Document the allowed component layers in `AGENTS.md`: common-platform core UI first, NoteLett wrapper second, product-domain components third. Commit: `5009a22`.
- [ ] Add a short UI ownership section to `README.md`. - [x] Add a short UI ownership section to `README.md`. Commit: `5009a22`.
- [ ] Verify: `rg` audits, `pnpm --filter @notelett/web run typecheck`, `git diff --check`. - [ ] Add CI guard for `pnpm run audit:ui:strict` after UI8 removes legacy matches.
- [x] Verify: `pnpm run audit:ui`, `pnpm --filter @notelett/web run typecheck`, `pnpm run install:common-plat --frozen-lockfile`, `git diff --check`. Verification: passed on May 6, 2026; `audit:ui` reports remaining legacy matches for migration tracking, with no hardcoded color literals or direct `@bytelyst/ui` imports outside the adapter.
### Phase UI1 — Harden Common-Platform Core UI ### Phase UI1 — Harden Common-Platform Core UI
@ -123,7 +124,8 @@ Repo: `../learning_ai/learning_ai_common_plat`
- [ ] Replace raw color literals in `@bytelyst/ui` status components with semantic `--bl-*` tokens and fallbacks owned by design tokens. - [ ] Replace raw color literals in `@bytelyst/ui` status components with semantic `--bl-*` tokens and fallbacks owned by design tokens.
- [ ] Add product-safe variants to existing `Button`, `Badge`, `Card`, `Input`, `Textarea`, and `Select`. - [ ] Add product-safe variants to existing `Button`, `Badge`, `Card`, `Input`, `Textarea`, and `Select`.
- [ ] Add `IconButton`, `Panel`, `PanelHeader`, `PanelBody`, `Surface`, `SurfaceList`, `ListItemButton`, `StatusBadge`, and `StatusDot`. - [x] Add first migration primitives: `IconButton`, `Panel`, `PanelHeader`, `PanelBody`, `PanelTitle`, `PanelDescription`, `ListItemButton`, `StatusBadge`, `StatusDot`, `Timeline`, and `DiffCard`. Common-platform commit: `23e1400`.
- [ ] Add remaining surface primitives: `Surface`, `SurfaceList`, and any table/list layout variants needed by search/workspaces/dashboard.
- [ ] Add `Tabs`, `SegmentedControl`, `Tooltip`, `DropdownMenu`, `Checkbox`, `RadioGroup`, and `Switch` using Radix where appropriate. - [ ] Add `Tabs`, `SegmentedControl`, `Tooltip`, `DropdownMenu`, `Checkbox`, `RadioGroup`, and `Switch` using Radix where appropriate.
- [ ] Add `DataList`/`DataTable`, `Timeline`, and `DiffCard` for operational workflows. - [ ] Add `DataList`/`DataTable`, `Timeline`, and `DiffCard` for operational workflows.
- [ ] Add Storybook stories and basic rendering/a11y tests for every new primitive. - [ ] Add Storybook stories and basic rendering/a11y tests for every new primitive.
@ -133,7 +135,7 @@ Repo: `../learning_ai/learning_ai_common_plat`
Repo: `learning_ai_notes` Repo: `learning_ai_notes`
- [ ] Expand `web/src/components/ui/Primitives.tsx` to re-export or wrap all approved common primitives. - [x] Expand `web/src/components/ui/Primitives.tsx` to re-export or wrap the first approved common primitive set. Commit: `b73c969d142728fb854fc3ac1e527272a0ad66f0`. Verified by `pnpm --filter @notelett/web run typecheck`.
- [ ] Ensure wrappers map `--bl-*` to `--nl-*` through global token aliases, not per-component hardcoding. - [ ] Ensure wrappers map `--bl-*` to `--nl-*` through global token aliases, not per-component hardcoding.
- [ ] Add NoteLett defaults for radius, density, focus ring, status mapping, and operational list rows. - [ ] Add NoteLett defaults for radius, density, focus ring, status mapping, and operational list rows.
- [ ] Remove direct product code dependence on `surface-card`, `surface-muted`, `badge`, and `input-shell` for new or migrated screens. - [ ] Remove direct product code dependence on `surface-card`, `surface-muted`, `badge`, and `input-shell` for new or migrated screens.