*TAB* should focus the next input when tabSelectsValue is true

[KrupaPanchal2527]

Title:

[Help] TAB should focus the next input when tabSelectsValue: true

Version: 5.6.0

Description:

I am looking for a way to focus the next input automatically when TAB is pressed and tabSelectsValue option is set to true

Steps to Reproduce:

Here's a simple codesandbox on which you can try out the below steps.

• Focus the first select input, navigate through different option using arrow keys
• Press TAB on any option (this will select that option and close the menu)

Current Behaviour - When I press TAB, it closes the menu, and I again have to press TAB to go to the next input

Behaviour needed - When I press TAB, it should close the menu and automatically should focus the next input (without me pressing the tab twice, first time to select option and second time to focus the next input)

Approaches I have tried:

1. We can store the ref of the next input and invoke the focus method when TAB is pressed, but this doesn't seem very reliable solution to me if we have lots of inputs lined up (I do not want to store ref for everything).
2. I tried accessing nextElementSibling property but that didn't work. We can access this property on onKeyPress event but react-select is only exposing onKeyDown and not onKeyPress
3. I tried accessing the nextElementSibling by passing ref to the <Select> itself, but in that also I couldn't find a field which would help me grab the next sibling.

Thank you for your attention to this issue. I look forward to any insights, suggestions, or possible solutions from the maintainers or the community.