Allow to set tabIndex -1 to implement Roving tabindex pattern

[steida]

Is your feature request related to a problem? Please describe.
Roving tabindex is the basic accessiblity pattern for grouped focusable items.

Describe a solution you'd like
RNfW should provide API for that so users don't have to hack it with setNativeProps in useEffect which can be too late.

Describe alternatives you've considered
There is no alternative for that.

Additional context
Here is an example https://codesandbox.io/s/gallant-germain-ujqnm?file=/src/App.js

[necolas]

Show me how you can't already do this.

[necolas]

This still works https://codesandbox.io/s/snowy-morning-fwke7

You only need tabIndex -1 if the element would otherwise natively receive focus.

[steida]

1. Try to click on any item. Nothing will happen because there is no tabIndex.
2. More importantly, we have to track the current focus via onFocus which requires tabIndex -1

No, we can not set tabIndex 0 on all items. Then it would not be grouped.

[necolas]

Try to click on any item

Add a press handler: https://codesandbox.io/s/snowy-morning-fwke7?file=/src/App.js

[necolas]

We can make focusable=false explicitly set tabIndex=-1 though. I don't see the harm in that

[steida]

Add a press handler

"Don't assume that all focus changes will come via key and mouse events."

From this document "https://developer.mozilla.org/en-US/docs/Web/Accessibility/Keyboard-navigable_JavaScript_widgets"

[steida]

We can make focusable=false explicitly set tabIndex=-1 though. I don't see the harm in that

I agree. No focusable, no tabindex. Focusable true, tabindex 0. Focusable false, tabindex -1.
And for all elements, because everything can be focusable, as I described #2042

[steida]

Thank you. After all those years (three), I can finally use The roving tabIndex pattern in RNfW without hacks.

#1099