feat(TabPanel): Added tabStop boolean prop to TabPanel

[elliooo]

In the new Field Picker experience, a keyboard user has to tab from the Tab to the TabPanel to the first Tree in order to focus on the Tree items and begin field keyboard traversal. Ideally, I think it'd be cleaner to just tab from the Tab directly to the TreeCollection since it is the only element in the TabPanel.

Adding tabIndex as a prop allows devs to pass a non-zero value to TabPanel's tabIndex prop and thus remove it from the tab flow.

Developer Checklist ℹ️

• ♿️ Accessibility addressed
• 🌏 Localization & Internationalization addressed
• 🖼 Image Snapshot coverage
• 📚 Documentation updated
• 🧳 Bundle size impact addressed
• 🏁 Performance impacts addressed
• 👾 Browsers tested
  • Chrome
  • Firefox
  • Safari
  • IE11

[elliooo]

There's an argument to add CompatibleHTMLProps<HTMLDivElement> to Tab but I wasn't sure if that was excluded here purposefully.

[ghost]

I'd prefer not to ask developers to understand tabIndex and instead offer a more semantic prop. See proposed change.

[ghost]

Assuming @jhardy's research supports this I'm happy with it :)

[jhardy]

I dug in a bit more and this seems to align closely with some updated guidance from the w3c aria best practices. This is not published on their official docs just yet, but the new guidance is for the tab key is

• When focus moves into the tab list, places focus on the active tab element.
• When the tab list contains the focus, moves focus to the next element in the page tab sequence outside the tablist, which is the tabpanel unless the first element containing meaningful content inside the tabpanel is focusable.

I am wondering about the prop name tabStop, that feels a bit too generic as first glance. I don't dislike it enough to block the PR. I am wondering if a more descriptive prop name but could be something we reuse elsewhere if we need to give the option to programmatically add focus.

<TabPanel makeFocusable>
<TabPanel includeInTabSequence>
<TabPanel addAsTabStop>
<TabPanel canReceiveFocus>

Not sure if those are any better or too verbose, but just a few early morning thoughts.

[ghost]

Great point on naming... what about isTabStop? (fits with our other isX conventions)

[jhardy]

that works for me!

[ghost]

LGTM!