Open
Conversation
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
robluton
reviewed
Apr 3, 2026
Co-authored-by: Rob Luton <rob.luton@gmail.com>
robluton
reviewed
Apr 3, 2026
| element.addEventListener('mouseleave', onLeaveTooltip); | ||
| } | ||
| } | ||
| const SIDES = ['top', 'bottom', 'left', 'right'] as const; |
Contributor
There was a problem hiding this comment.
This is also defined in the composable. Let's import the type from the composable so we have a single source of truth.
robluton
reviewed
Apr 3, 2026
| export function createEnterHandler(element: HTMLElement, binding: DirectiveBinding) { | ||
| return (): void => { | ||
| const tooltip = getTooltip(); | ||
| const ALIGNS = ['start', 'center', 'end'] as const; |
Contributor
There was a problem hiding this comment.
Same as above. Let's import this type from the composable so we have a single source of truth.
Co-authored-by: formfcw <dev@formfcw.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
4 participants
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.
Scope
What's changed:
v-tooltipdirective with one with Reka-UI's tooltip primitivesuseGlobalTooltipcomposable that manages a single shared reactive tooltip state (open/closed, content, position, delay)AppTooltipsingleton component mounted at the app root, which renders the single Reka-UITooltipContentdriven by the composablev-tooltipdirective as a thin bridge that callsopenTooltip/closeTooltipon mouse and keyboard focus eventsfocus/blurevent listeners trigger the tooltip for keyboard usersforce-mountonTooltipContentso#app-tooltip-contentis always present in the DOM for screen readersdata-stateattributes; remove manual animation classes and all custom arrow CSSPotential Risks / Drawbacks
force-mountkeepsTooltipContentin the DOM at all times; the content reflects the last-hovered element when closed, which is read by screen readers viaaria-describedbyon focusTested Scenarios
v-tooltipand confirm the tooltip appears after the 500ms delayv-tooltip.instantand confirm the tooltip appears immediately without a fade-in transitionv-tooltip.bottom,.left,.right,.start,.endmodifiers and confirm correct placementv-tooltipand confirm the tooltip opens and the correct description is announcedv-tooltipwhile its tooltip is visible and confirm the tooltip closes cleanlyv-tooltip.invertedandv-tooltip.monospaceand confirm the correct CSS classes are appliedReview Notes / Questions
leftoffsets for RTL; Reka-UI should handle this via floating-uiforce-mount+aria-describedbyaccessibility approach — the tradeoff is that screen readers always find the element in the DOM, but its content reflects the last-opened tooltip rather than being empty when closedChecklist
Fixes #25519