refactor(ui): migrate Tooltip from HeroUI to shadcn/Radix UI#13563
Open
refactor(ui): migrate Tooltip from HeroUI to shadcn/Radix UI#13563
Conversation
Replace the HeroUI Tooltip wrapper with a Radix UI implementation matching the Figma design specs. The flat API (content, placement, delay, closeDelay, showArrow, classNames, isOpen, onClick) is fully preserved so 100+ consumer files require zero changes. - Rewrite tooltip.tsx with @radix-ui/react-tooltip primitives - Add placement mapping (HeroUI placement -> Radix side+align) - Add controlled mode support (isOpen, onOpenChange, closeDelay) - Export compound components (TooltipProvider, TooltipRoot, etc.) - Delete redundant tooltip_new.tsx (consolidated into tooltip.tsx) - Remove @heroui/react from packages/ui peerDeps and devDeps - Remove @heroui/react and @heroui/theme from tsdown externals - Add 14 unit tests for tooltip component Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Signed-off-by: suyao <sy20010504@gmail.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Signed-off-by: suyao <sy20010504@gmail.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this PR does
Before this PR:
Tooltip component in
@cherrystudio/uiwas a wrapper around@heroui/reactTooltip, making it the last HeroUI dependency in the UI package.After this PR:
Tooltip is fully implemented with
@radix-ui/react-tooltip, matching the Figma design specs (background, border, rounded corners, shadow, arrow). The flat API (content,placement,delay,closeDelay,showArrow,classNames,isOpen,onClick) is preserved — zero changes needed in 100+ consumer files.Why we need it and why it was done in this way
The v2 refactoring requires removing HeroUI from
@cherrystudio/ui. Tooltip was the last remaining HeroUI component. A backward-compatible wrapper approach was chosen to avoid touching 100+ consumer files while still fully replacing the underlying implementation.The following tradeoffs were made:
closeDelay > 0is handled via controlled state withsetTimeout(only 1 consumer uses non-zero closeDelay)The following alternatives were considered:
tooltip_new.tsxwith compound API was consolidated into the maintooltip.tsxBreaking changes
None. The exported
TooltipPropsinterface is narrower than the previous HeroUI-derived type, but all props actually used by consumers are preserved. New compound component exports (TooltipProvider,TooltipRoot,TooltipTrigger,TooltipContent,NormalTooltip) are added for advanced usage.Special notes for your reviewer
@heroui/reactfully removed frompackages/ui(peerDeps, devDeps, tsdown externals, source imports)bg-background border-border rounded-lg px-4 py-3 shadow-[0px_6px_12px_0px_rgba(0,0,0,0.2)]parsePlacement()maps all HeroUI placement values to Radixside+alignChecklist
Release note