Skip to content

Migrate shared app components to shadcn tokens (v2.13.4) - #75

Open
NathanHealea wants to merge 9 commits into
epic/ui-refactorfrom
refactor/shared-app-components
Open

Migrate shared app components to shadcn tokens (v2.13.4)#75
NathanHealea wants to merge 9 commits into
epic/ui-refactorfrom
refactor/shared-app-components

Conversation

@NathanHealea

Copy link
Copy Markdown
Owner

Summary

Doc 03 of the UI Refactor epic (DaisyUI → shadcn/ui). Migrates the reusable app-level components in src/components/ off DaisyUI onto the doc-02 primitives and per-component token stylesheets. Headless UI stays the interaction layer for all dropdowns (not swapped to Radix), @heroicons/react is kept, and daisyui remains installed (removed only in the final epic doc).

  • actions-menu — the shared row-action dropdown (used by all 6 *-actions.tsx wrappers) moved onto a new menu.css dropdown layer (menu-dropdown, menu-dropdown-body, menu-item, menu-item-danger); rounded-box/rounded-btn/bg-base-* gone.
  • navbar + mobile-nav — new navbar.css for the nav shell/brand; menu.css extended with the DaisyUI menu list layer (menu, menu-horizontal, menu-title, divider). Replaced base-100/200/300, base-content, error, and primary-content tokens.
  • user-menu + admin-menu — restyled onto the shared menu-dropdown/menu-item classes; Headless UI Menu interaction and auto-close unchanged.
  • avatar — rebuilt on the doc-02 Avatar/AvatarImage/AvatarFallback primitive; placeholder styling now comes from avatar.css (dropped bg-neutral/text-neutral-content).
  • image-uploadring-offset-base-100ring-offset-background, text-errortext-destructive; btn variants use the token-based primitives.
  • tooltip / scroll-banner — confirmed already token-aligned; no changes needed.

New stylesheets: src/styles/components/menu.css, src/styles/components/navbar.css (both imported into globals.css under layer(components)).

Version

2.13.3 -> 2.13.4 (patch)

Test plan

  • npm run build passes
  • npm run lint passes (0 errors; 6 pre-existing warnings, none in changed files)
  • Smoke-test navbar/menus authenticated + anonymous and at the mobile breakpoint; confirm menus auto-close on item click and keyboard nav/focus is intact

Replace DaisyUI btn/rounded-box/rounded-btn/bg-base-* classes with a new
menu.css dropdown layer (menu-dropdown, menu-dropdown-body, menu-item,
menu-item-danger) built on shadcn tokens. Headless UI Menu interaction is
unchanged. Covers every *-actions.tsx wrapper without further edits.
Add navbar.css (nav shell + brand) and extend menu.css with the DaisyUI
menu list layer (menu, menu-horizontal, menu-title, divider). Replace
base-100/200/300, base-content, error, and primary-content tokens with
shadcn tokens. Headless UI Dialog interaction in mobile-nav is unchanged.
Restyle both Headless UI Menu dropdowns onto the shared menu-dropdown /
menu-item token classes, dropping rounded-box/rounded-btn/bg-base-* and the
btn-ghost/btn-error item styling. Menu interaction and auto-close unchanged.
Rebuild avatar.tsx on the doc-02 Avatar/AvatarImage/AvatarFallback primitive,
dropping the hand-rolled markup and the bg-neutral/text-neutral-content tokens
(placeholder styling now comes from avatar.css). Swap ring-offset-base-100 and
text-error in image-upload for the background and destructive tokens.
@vercel

vercel Bot commented Jul 18, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
grimdark-nathanhealea-com Ready Ready Preview, Comment Jul 18, 2026 9:29pm

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