Repository navigation
refactor: Share listbox option props, mouse handlers and keyboard navigation - #5249
Merged
Merged
Conversation
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #5249 +/- ##
==========================================
+ Coverage 97.82% 97.83% +0.01%
==========================================
Files 1005 1007 +2
Lines 32553 32568 +15
Branches 12092 12090 -2
==========================================
+ Hits 31845 31863 +18
- Misses 666 699 +33
+ Partials 42 6 -36 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
amanabiy
requested review from
a team and
vvaliyev
and
a balanced review from Copilot
and removed request for
a team and
georgylobko
November 5, 2026 10:54
Contributor
There was a problem hiding this comment.
🟢 Approval recommended
There are no active review issues blocking the shared listbox helper extraction.
No open issues 🎉
What changed in this PR
Extracts shared listbox logic from useSelect into internal helpers, preserving existing Select and Multiselect behavior while making the logic reusable.
Changes:
- Moves option props, selection announcements, mouse handlers, and arrow-key navigation into shared helpers.
- Centralizes list prop types in the listbox module.
- Adds unit tests for the extracted helpers.
| File | Description |
|---|---|
src/select/utils/use-select.ts |
Delegates existing logic to shared listbox helpers. |
src/internal/components/listbox/utils/option-props.ts |
Provides option props, selection checks, and mouse handlers. |
src/internal/components/listbox/utils/navigation.ts |
Extracts arrow-key movement and wraparound handlers. |
src/internal/components/listbox/parts/plain-list.tsx |
Imports prop types from the listbox module. |
src/internal/components/listbox/interfaces.ts |
Defines shared list and option prop types. |
src/internal/components/listbox/__tests__/option-props.test.ts |
Tests option state, selection checks, and mouse handling. |
src/internal/components/listbox/__tests__/navigation.test.ts |
Tests keyboard movement and wraparound behavior. |
Review effort: Balanced
Adds isHighlightable, getListboxOptionProps, isAnnouncedSelected, getSelectableOption and getListMouseHandlers in listbox/utils/option-props.ts and uses them in useSelect. No behavior change.
Move Select's arrow key wrap logic (goUp/goDown) into a shared helper, getListboxNavigation, in src/internal/components/listbox/utils/navigation.ts, and use it in useSelect. The helper keeps Select's current behavior exactly, including wrapping at the first and last rows. Home/End handling stays in useMenuKeyboard unchanged. No behavior change for Select or Multiselect.
ListElementProps (formerly MenuProps) and GetOptionProps now live in src/internal/components/listbox/interfaces.ts. PlainList imports them from there, so the shared list no longer depends on Select's hook module. No behavior change.
amanabiy
force-pushed
the
refactor/share-listbox-helpers
branch
from
November 6, 2026 08:37
e468024 to
a5aa797
Compare
vvaliyev
approved these changes
Nov 6, 2026
| const isSelectAll = option.type === 'select-all'; | ||
| const groupState = isSelectAll || isGroup(option.option) ? selection.getGroupState(option) : undefined; | ||
| const selected = isSelectAll ? !!groupState?.selected : selectedSet.has(option) || !!groupState?.selected; | ||
| const optionProps: any = { |
Member
There was a problem hiding this comment.
non-blocking: could we avoid using any here?
Member
Author
There was a problem hiding this comment.
Yes, I will address this in a follow up PR.
github-merge-queue
Bot
removed this pull request from the merge queue due to failed status checks
Nov 6, 2026
This branch was successfully deployed
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
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.
Description
Moves the option props, mouse handlers and arrow-key navigation from
useSelectinto pure helpers insrc/internal/components/listbox/utils/, and the list prop types intolistbox/interfaces.ts, with no behavior change for Select or Multiselect.Related links, issue #, if available: n/a
How has this been tested?
option-props.test.ts,navigation.test.ts).Review checklist
The following items are to be evaluated by the author(s) and the reviewer(s).
Correctness
CONTRIBUTING.md.CONTRIBUTING.md.Security
checkSafeUrlfunction.Testing
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.