Tabindex not working

[imtaxu]

Hi there,

When using react-select components with react-hook-form inside a Radix UI Sheet or Modal, the tabindex does not work.

Would you please see CodeSandbox Demo

The expected behavior is that after selecting a color, pressing the tab key should move the focus to the size input, but instead, it selects the sheet component. The tab key does not move the focus to the size input or button at all.

[ches4117]

According to https://html.spec.whatwg.org/multipage/interactive-elements.html#dialog-focusing-steps, we should not set tabindex in dialog element

I found that Radix UI Sheet using tabindex={-1}, if we delete this, we can correctly use tab key.

[imtaxu]

Using it this way works, thanks.

<SheetContent tabIndex={false}>