Consider excluding Tabs scroll buttons from keyboard navigation

[damyanpetev]

The scroll buttons in the Tabs currently use Icon Buttons which are normally focusable. Those are also disabled when there's no more items to show in the respective direction. This creates some likely undesired behaviors:

• When navigating the normal tab sequence the buttons before or after the tab list (or both) can be present - that creates inconsistent structure as buttons pop in and out of the sequence, besides just adding extra steps to jump between the tab and the panel content for example.
• More critically, I think, if you do focus a button and start toggling it to scroll, eventually it'll disable and loose focus which I think is not great for UX or accessibility. We could focus the last tab automatically when you reach the end, but that also has activation implications depending on the config. Not to mention the button doesn't have an accessible name or any way to indicate the progress state as you scroll along.

For the most part, I'm of the opinion that scroll buttons don't add anything to keyboard navigation as you can already navigate between the tabs with arrows and Home/End. If anything they pollute the tab sequence and my suggestion is to make those non-focusable visual-only elements. Either exclude them w/ tabindex & aria-hidden or forgo the icon button entirely and go for a simple icon instead.

PS: Some interesting read here https://css-tricks.com/making-disabled-buttons-more-inclusive/