Consolidate UI primitives onto base-ui (drop radix-ui)#179
Conversation
Migrates the 5 remaining radix-ui components (button, dropdown-menu, popover, tooltip, hover-card) to their @base-ui/react equivalents, so the app uses a single UI primitive library (base-ui, matching the configured base-lyra shadcn style). Removes the radix-ui dependency and its ~30 @radix-ui/* transitive packages. Component mapping: - button: radix Slot/asChild -> plain <button>; the one asChild consumer (not-found) now applies buttonVariants to its <Link> directly. - dropdown-menu -> base-ui Menu (item highlight via data-highlighted; Label and Separator rendered as styled divs, since base-ui Menu has no such parts). - popover -> base-ui Popover; tooltip -> base-ui Tooltip; hover-card -> base-ui PreviewCard (Portal -> Positioner -> Popup structure). Behavioral translations (consumer API preserved): - asChild is shimmed to base-ui's `render` prop inside each Trigger wrapper, so the existing `<XTrigger asChild>` call sites are unchanged. - onCloseAutoFocus(preventDefault) -> base-ui `finalFocus` callback (returns false to hold focus, or the textarea element to redirect it). - radix data-[state=open/closed] animations -> base-ui data-starting-style / data-ending-style; --radix-* CSS vars -> base-ui --transform-origin / --available-height / --anchor-width. - hover-card open/close delays moved from Root to Trigger (base-ui's API). Verified: typecheck, lint, format, 234 unit tests, production build, and the 8-case mock authenticated-chat smoke all pass. https://claude.ai/code/session_01SoqKN492M4vHKaZE1vD7oq
|
You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard. |
|
Warning Review limit reached
More reviews will be available in 31 seconds. Learn how PR review limits work. Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file). ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (12)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
2 participants
What & why
Consolidates the app onto a single UI primitive library. The 5 remaining
radix-uicomponents (button, dropdown-menu, popover, tooltip, hover-card) are migrated to their@base-ui/reactequivalents — matching the configuredbase-lyrashadcn style the other 7 UI components already use. Removes theradix-uidependency (and its ~30@radix-ui/*transitive packages — the lockfile shrinks ~2,400 lines).Component mapping
Slot/asChildbutton<button>(the oneasChildconsumer,not-found, appliesbuttonVariantsto its<Link>)DropdownMenuMenu— item highlight viadata-highlighted;Label/Separatorare styled<div>s (base-uiMenuhas no such parts)PopoverPopoverTooltipTooltipHoverCardPreviewCardOverlays use base-ui's
Root → Trigger → Portal → Positioner → Popupstructure.Behavioral translations (consumer API preserved)
asChildis shimmed to base-ui'srenderprop inside eachTriggerwrapper, so the existing<XTrigger asChild>call sites are unchanged.onCloseAutoFocus(preventDefault)→ base-uifinalFocuscallback (returnsfalseto hold focus, or the textarea element to redirect it — preserving the model-selector / tools-popover focus behavior).data-[state=open/closed]→ base-uidata-starting-style/data-ending-style;--radix-*CSS vars →--transform-origin/--available-height/--anchor-width.RoottoTrigger(base-ui's API).Verification
pnpm typecheck✓ ·pnpm lint(zero warnings) ✓ ·pnpm format:check✓ ·pnpm test— 234 passing ✓ ·pnpm build✓ · mock smoke — 8/8 ✓ (exercises the model-selector popover, tooltips, sidebar).Automated tests can't verify the visual/interaction correctness of overlays. Worth a manual pass on a preview deploy:
--anchor-width), destructive item styling.⌘.-style shortcut chips, mobile hidden (md:flex).This is the last item from the post-#177/#178 cleanup audit; opening for review rather than auto-merging given the above.
https://claude.ai/code/session_01SoqKN492M4vHKaZE1vD7oq
Generated by Claude Code