Expose openCombobox and closeCombobox from Combobox

[moritzkalwa]

This is a solution to the problems described in #1236.

It exposes both closeCombobox and openCombobox. This allows more control over the behaviour of the combobox component, for example opening the combobox on focusing the combobox input.

[vercel]

Someone is attempting to deploy a commit to the Tailwind Labs Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
headlessui-react	✅ Ready (Inspect)	Visit Preview	Nov 21, 2022 at 9:10AM (UTC)

[RobinMalfait]

Hey! Thank you for your PR!
Much appreciated! 🙏

I'm going to say no to this PR for now, because it includes some accessibility concerns we have to think about. For example exposing openCombobox and attaching it to a button doesn't connect them via aria-* attributes so I don't think we want to do it this way, but maybe we do if we document it well enough. We're also not sure about the API we want to use yet, we can expose functions or a prop that enables this functionality, but then the question is "Where do we put that prop?".

Going to close it for now just so that we can think about the correct API if we want to expose this behaviour at all, and if we want to implement this functionality than we can definitely start from your PR so that you are still a contributor 👍

Either way, thanks for your work!

[AkshayPathak]

Hi @RobinMalfait. Can you please share any updates on the implementation of this?

[moritzkalwa]

Hey @RobinMalfait 👋 I am thinking about reopening this Pull Request. As far as I am aware there has not been a good solution for this issue yet and the behaviour of the Combobox has recently gotten even worse for people that are not wrapping the ComboboxInput in the ComboboxButton as per #2272.

I still think exposing openCombobox and closeCombobox to the developers and letting them handle the implications of that is a far better solution than leaving developers to find hacky workarounds to achieve the desired behaviour. I totally agree with your concerns about accesability but devs are obviously using the Combobox in a way that is not accessible already and with this PR there would at least be a native solution to this issue.

I think there should also be an option to disable #2272 as that was something that made our implementation of the Combobox even more complicated.

I hope you have a nice day and are maybe willing to take another look at this 👍

[hadson172]

@RobinMalfait any updates on the topic?

[meotimdihia]

We need to open the dropdown when the user clicks on the input.

[WickyNilliams]

I'm going to say no to this PR for now, because it includes some accessibility concerns we have to think about.

I think it's fine to say "if you use this, you may need to handle some accessibility concerns yourself". Of course you can add examples to show how to join the dots. But for the desired (and as yet unsolved) use-case here of "open on focus" i don't think there are any accessbility concerns.

If it makes you feel more comfortable, would a more limited openOnFocus prop be OK?

[mattoni]

I would like to bring attention back to this issue - it's pretty desirable to have the menu appear when the input is focused, and right now all we have are hacks around it. Can we please reconsider getting this or a similar PR merged? Thanks.