feat: Keyboard shortcut handler#9929
Open
snowystinger wants to merge 20 commits into
Open
Conversation
snowystinger
changed the title
# Conflicts: # packages/react-aria/src/selection/useSelectableCollection.ts
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
snowystinger
commented
May 4, 2026
|
|
||
| const isSelected = selectedKey === key; | ||
|
|
||
| let onKeyDown = (event) => { |
Member
Author
There was a problem hiding this comment.
This seems just designed to skip arrow down and up, i think it'd be better to do this in the keyboard delegate or just allow it, i'm not sure why we wouldn't, there could be vertical steplists and it's a nice non-rtl dependent set of keys.
Just removing it for now as it'd make debugging difficult anyways
|
Build successful! 🎉 |
snowystinger
changed the title
# Conflicts: # packages/react-aria-components/test/Calendar.test.js # packages/react-aria-components/test/RangeCalendar.test.tsx # packages/react-aria/src/actiongroup/useActionGroup.ts # packages/react-aria/src/calendar/useCalendarGrid.ts # packages/react-aria/src/color/useColorArea.ts # packages/react-aria/src/combobox/useComboBox.ts # packages/react-aria/src/datepicker/useDateField.ts # packages/react-aria/src/datepicker/useDateSegment.ts # packages/react-aria/src/interactions/useKeyboard.ts # packages/react-aria/src/menu/useMenuItem.ts # packages/react-aria/src/menu/useMenuTrigger.ts # packages/react-aria/src/menu/useSubmenuTrigger.ts # packages/react-aria/src/numberfield/useNumberField.ts # packages/react-aria/src/overlays/useOverlay.ts # packages/react-aria/src/radio/useRadioGroup.ts # packages/react-aria/src/searchfield/useSearchField.ts # packages/react-aria/src/select/useSelect.ts # packages/react-aria/src/selection/useSelectableCollection.ts # packages/react-aria/src/spinbutton/useSpinButton.ts # packages/react-aria/src/steplist/useStepListItem.ts # packages/react-aria/src/table/useTableColumnResize.ts # packages/react-aria/test/combobox/useComboBox.test.js
|
Build successful! 🎉 |
## API Changes
@react-aria/interactions/@react-aria/interactions:KeyboardProps KeyboardProps {
+ ignorePortalRef?: RefObject<Element | null> | null
isDisabled?: boolean
onKeyDown?: (KeyboardEvent) => void
onKeyUp?: (KeyboardEvent) => void
+ shortcuts?: KeyboardShortcutBindings
} |
snowystinger
commented
May 14, 2026
| 'control', | ||
| 'meta', | ||
| 'mod', // OS dependent - Cmd on Mac, Ctrl on Windows/Linux | ||
| 'sel' // OS dependent - Alt on Mac, Ctrl on Windows/Linux |
Member
Author
There was a problem hiding this comment.
use expansion instead, don't build in a shortcut
| 'ctrl', | ||
| 'control', | ||
| 'meta', | ||
| 'mod', // OS dependent - Cmd on Mac, Ctrl on Windows/Linux |
Member
Author
There was a problem hiding this comment.
different name? just CMD?
| return; | ||
| } | ||
| shortcutHandler(e); | ||
| props.onKeyDown?.(e); |
Member
Author
There was a problem hiding this comment.
call first and allow users to cancel our behaviour?
| let action = map.get(canonical); | ||
| let result = action?.(e); | ||
| if (typeof result === 'boolean') { | ||
| result = {shouldContinuePropagation: !result, shouldPreventDefault: result}; |
Member
Author
There was a problem hiding this comment.
allow return type of void to behave like return true?
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
2 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.
Closes
Aiming to help us solve the issue of event leaks, this will allow us more fine grained control of what useKeyboard blocks/prevents default on in a more declarative way.
New behaviour is opt in through
shortcutsinuseKeyboard. This will preventDefault and stopPropagation if the associated function in the map returns true. Or it will let the event pass without altering it if false is returned. In addition, an object can be returned to alter that behaviour in whatever way necessary. Given that all key combinations are exclusive matches, this should make it more obvious what events are continuing or not.✅ Pull Request Checklist:
📝 Test Instructions:
🧢 Your Project: