feat(DropdownMenu): opt-in openOnHover (hover-to-open, mouse-only, click-coexisting)#316
Merged
Conversation
…ing) Layer hover open/close on top of the existing click toggle via the same openMenu/closeMenu helpers. Pointer handlers attach to the outer container so trigger->menu travel stays inside it; a 150ms private close-grace timer bridges the gap and is cleared by every closer (select/Escape/Tab/outside-click) plus unmount. Mouse-only: touch/pen early-return and keep tap-to-toggle. Keyboard, focus, and roles unchanged; add aria-haspopup/expanded/controls to the trigger. openOnHover defaults to false, so existing call sites render byte-for-byte as before (both handlers undefined). Patch bump 0.5.12 -> 0.5.13 per pre-1.0 kit convention (needs the release label on the PR). New Storybook OpenOnHover story + 7 hover tests added. COUPLING NOTE: depends on the menu rendering inline (no portal); a future portal move would require mirroring the hover handlers onto the menu element. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Contributor
|
Storybook Preview: https://mirrorstack-ai.github.io/web-ui-kit/pr/316/ |
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
Adds an opt-in
openOnHover?: boolean(defaultfalse) toDropdownMenuso a desktop trigger can open on mouse hover in addition to click.openMenu/closeMenuhelpers.aria-haspopup/aria-expanded/aria-controlsadded to the trigger.Backward compatibility
100% —
openOnHoverdefaults tofalse, both pointer handlers are thenundefined(React drops them) and every existing click-only call site renders byte-for-byte as before. No prop changed/removed.Tests + verification
DropdownMenu.test.tsx: 12/12 (5 baseline + 7 new hover: open on mouse pointer-enter, stays open within grace on re-enter, closes after grace, touch no-op, Escape still closes, item click still selects+closes, click toggles a hover-opened menu closed).tsc --noEmitclean.OpenOnHoverStorybook story (desktop overflow menu).Release
Patch bump 0.5.12 → 0.5.13 per the pre-1.0 patch-only convention (paired with the
releaselabel, per kit release mechanics).Coupling note
Hover-leave detection relies on the menu rendering inline (no portal); a future portal move would require mirroring the hover handlers onto the menu element.
Follow-up (separate PR)
web-landing
header.tsxadopts it by addingopenOnHoverto only the hamburger/overflow-menuDropdownMenu(not any touch/bottom-nav menu) after bumping to 0.5.13.🤖 Generated with Claude Code