feat: Keyboard shortcut handler

[snowystinger]

Closes

I'm ready for some initial reviews before I finish off converting the repo.

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 shortcuts in useKeyboard. 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:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

🧢 Your Project:

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[snowystinger]

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

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

## API Changes

react-aria-components

/react-aria-components:MenuSection

 MenuSection <T extends {}> {
   aria-label?: string
   children?: ReactNode | ({}) => ReactElement
   className?: string = 'react-aria-MenuSection'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
+  disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   id?: Key
   items?: Iterable<{}>
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   shouldCloseOnSelect?: boolean
   style?: CSSProperties
   value?: {}
 }

/react-aria-components:MenuSectionProps

 MenuSectionProps <T> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
   className?: string = 'react-aria-MenuSection'
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
+  disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   id?: Key
   items?: Iterable<T>
   onSelectionChange?: (Selection) => void
   selectedKeys?: 'all' | Iterable<Key>
   selectionMode?: SelectionMode
   shouldCloseOnSelect?: boolean
   style?: CSSProperties
   value?: T
 }

---

@react-aria/interactions

/@react-aria/interactions:KeyboardProps

 KeyboardProps {
+  ignorePortalRef?: RefObject<Element | null> | null
   isDisabled?: boolean
   onKeyDown?: (KeyboardEvent) => void
   onKeyUp?: (KeyboardEvent) => void
+  shortcuts?: KeyboardShortcutBindings
 }

---

@react-spectrum/s2

/@react-spectrum/s2:MenuSection

 MenuSection <T extends {}> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
+  disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   id?: Key
   items?: Iterable<T>
   onSelectionChange?: (Selection) => void
   selectionMode?: SelectionMode
   shouldCloseOnSelect?: boolean
   value?: T
 }

/@react-spectrum/s2:MenuSectionProps

 MenuSectionProps <T extends {}> {
   aria-label?: string
   children?: ReactNode | (T) => ReactElement
   defaultSelectedKeys?: 'all' | Iterable<Key>
   dependencies?: ReadonlyArray<any>
+  disabledKeys?: Iterable<Key>
   disallowEmptySelection?: boolean
   id?: Key
   items?: Iterable<T>
   onSelectionChange?: (Selection) => void
   selectionMode?: SelectionMode
   shouldCloseOnSelect?: boolean
   value?: T
 }

---