Form tab navigation in Dialog

[nicolasthy]

Hello 👋

I'm having some issues navigating inside a form using the Tab key, could anyone explain how it works?

I have the following form:

• Radix Select
• Radix Button
• React-select
• Lexical editor

The navigation was working properly before adding the React-select but now when I hit Tab inside the React-select the focus is moved to the dialog. I even tried removing the tabindex="0" from the react-select since I noticed my other components didn't have it but still the same.

Let me know if a codesandbox is needed, but I'm more looking for some explanations of how it works 🙏
Here's a CodeSandbox that I forked and added some inputs around the select to show the issue. When hitting tab to navigate the last input is not accessible: https://codesandbox.io/s/react-select-inside-radix-dialog-forked-w73z3w