Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Ensure focus trap, Tabs and Dialog play well together (#1231)
* add internal FocusSentinel component This component will allow you to catch the focus and forward it to a new element. The catch is that it will retry to do that because sometimes components won't be available yet. E.g.: We want to focus the first Tab component if it is rendered inside the Dialog. However, a Tab will register itself in the next tick, triggering a re-render and only then will it be `selected`. This is a bit too late for the FocusTrap component. The FocusSentinel should fix this by catching the focus, and forwarding it to the correct component. Once that is done, it will remove itself from the DOM tree so that you can't ever focus that element anymore. This should fix potential `<tab>` and `<shift+tab>` behaviour. * find the selectedIndex asap * use the FocusSentinel and forward it to the correct Tab * add example Tab in Dialog example * suppress console warnings Because we are firing `setState` calls within the component, React is yelling at us for not using `act(() => { ... })`. Welp, not going to add those calls inside the component just for tests... * update changelog
- Loading branch information