diff --git a/docs/pages/resources/changelog.md b/docs/pages/resources/changelog.md index df0c4b84b..bb92ac153 100644 --- a/docs/pages/resources/changelog.md +++ b/docs/pages/resources/changelog.md @@ -15,6 +15,7 @@ New versions of Shoelace are released as-needed and generally occur when a criti ## Next - Added tests for `` [#1416] +- Added support for pressing [[Space]] to select/toggle selected `` elements [#1429] - Fixed a bug in `` where the `background` attribute was never passed to the QR code [#1416] - Fixed a bug in `` where aria attributes were incorrectly applied to the default `` causing Lighthouse errors [#1417] - Fixed a bug in `` that caused navigation to work incorrectly in some case [#1420] diff --git a/src/components/menu/menu.ts b/src/components/menu/menu.ts index 8fecda056..3091f834f 100644 --- a/src/components/menu/menu.ts +++ b/src/components/menu/menu.ts @@ -45,8 +45,8 @@ export default class SlMenu extends ShoelaceElement { } private handleKeyDown(event: KeyboardEvent) { - // Make a selection when pressing enter - if (event.key === 'Enter') { + // Make a selection when pressing enter or space + if (event.key === 'Enter' || event.key === ' ') { const item = this.getCurrentItem(); event.preventDefault(); @@ -54,11 +54,6 @@ export default class SlMenu extends ShoelaceElement { item?.click(); } - // Prevent scrolling when space is pressed - if (event.key === ' ') { - event.preventDefault(); - } - // Move the selection when pressing down or up if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) { const items = this.getAllItems();