diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md index 083f904ff..1ab113c0b 100644 --- a/docs/resources/changelog.md +++ b/docs/resources/changelog.md @@ -13,7 +13,8 @@ _During the beta period, these restrictions may be relaxed in the event of a mis - Fixed a bug that prevented `setCustomValidity()` from working with `` - Fixed a bug where the right border of a checked `` was the wrong color - Fixed a bug that prevented a number of properties, methods, etc. from being documented in `` and `` -- Once again removed path aliasing because it doesn't work with Web Test Runner's esbuild plugin +- Updated `` and `` to cycle through tabs and menu items instead of stopping at the first/last when using the keyboard +- Removed path aliasing (again) because it doesn't work with Web Test Runner's esbuild plugin ## 2.0.0-beta.72 diff --git a/src/components/menu/menu.ts b/src/components/menu/menu.ts index 1fa95b670..7e40c4052 100644 --- a/src/components/menu/menu.ts +++ b/src/components/menu/menu.ts @@ -162,10 +162,10 @@ export default class SlMenu extends LitElement { } if (index < 0) { - index = 0; + index = items.length - 1; } if (index > items.length - 1) { - index = items.length - 1; + index = 0; } this.setCurrentItem(items[index]); diff --git a/src/components/tab-group/tab-group.ts b/src/components/tab-group/tab-group.ts index 5c55e2bb1..7bec05864 100644 --- a/src/components/tab-group/tab-group.ts +++ b/src/components/tab-group/tab-group.ts @@ -187,12 +187,20 @@ export default class SlTabGroup extends LitElement { (['top', 'bottom'].includes(this.placement) && event.key === 'ArrowLeft') || (['start', 'end'].includes(this.placement) && event.key === 'ArrowUp') ) { - index = Math.max(0, index - 1); + index--; } else if ( (['top', 'bottom'].includes(this.placement) && event.key === 'ArrowRight') || (['start', 'end'].includes(this.placement) && event.key === 'ArrowDown') ) { - index = Math.min(this.tabs.length - 1, index + 1); + index++; + } + + if (index < 0) { + index = this.tabs.length - 1; + } + + if (index > this.tabs.length - 1) { + index = 0; } this.tabs[index].focus({ preventScroll: true });