-
Notifications
You must be signed in to change notification settings - Fork 46.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[react-interactions] Add TabFocusContainer and TabbableScope UI components #16732
Conversation
FWIW I still don't like the "tab" nomenclature given that these nodes can be reached by means other than pressing the Tab key on a keyboard. |
@necolas Maybe it should be better named as |
so this component wouldn't work with e.g. a directional pad on a remote control? |
@necolas that’s right, it would not work with those with this component. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We might want to revisit that limitation in the future but this lgtm for now
This PR adds two experimental components to be used for internal focus management handling. Furthermore, this PR fixes a bug with scope component refs correctly detaching.
TabFocusContainer
contains tabbable keyboard focus to within its children, where tabbing gets wrapped to the beginning.TabbableScope
collects host components that are keyboard tabbable so thatTabFocusContainer
can handle the tab navigation through said components.