[Combobox] Option to disable focus after a selection

[knoefel]

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

2.1.3

What browser are you using?

Chrome

Reproduction URL

https://codesandbox.io/p/sandbox/kind-mclaren-wqx2mk

Describe your issue

It should be possible to optionally disable focusing the Combobox Input element after selecting an option. Right now you have to use a setTimeout hack to accomplish this. See this discussion for more infos: #2795

More Context:

@RobinMalfait I opened an issue regarding this last year but it got closed before i had a chance to add a codesandbox. Perhaps to clarify my use case a bit more: I have two fields. The first is a <Combobox /> component, and the second is an input field that should be focused as soon as the user makes a selection in the combobox.

My initial idea was to handle this in the onChange handler of the combobox, but unfortunately, this didn’t work. Even your suggestion to use the onClose handler didn’t change anything. It was only when I wrapped the focus call in a setTimeout that the second input field got focused, but this worked only in Chrome. In Safari, this approach also doesn’t work. I’ve created a small minimal reproduction repo via CodeSandbox to illustrate the issue. The first set of fields doesn’t work (red background), while the second set (green background) works at least in Chrome. However, if you open it in Safari, neither version works.