RAC ComboBox option to select on item focus

[frontsideair]

Provide a general summary of the feature here

I'm building a search autocomplete and I want it ti behave similarly to Google/Amazon where highlighting an item to select it automatically.

I see that there's a SearchAutocomplete component in the works but it doesn't seem public yet. (And I assume it's Spectrum only so I have to wait for it to land to RAC.) The second easiest would be to have a prop that allows selection by focus. The third would be to expose an event handler that's called with highlighted key.

I'd go lower level with the hooks path but highlighted item doesn't seem to be exposed there either.

🤔 Expected Behavior?

There should be some way to use listbox highlighted item.

😯 Current Behavior

I couldn't find any way to access highlighted item.

💁 Possible Solution

No response

🔦 Context

Building a search autocomplete component.

💻 Examples

google.com
amazon.com

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[reidbarber]

I think you could probably do this with the hooks right now. You would need to make it fully controlled and update the input value whenever the selection changes.

Search autocomplete is similar to a combobox, but it uses a search field and no trigger button. Those hooks are currently in alpha, but the docs can be previewed here. We should have a RAC SearchAutocomplete component once the hooks get a GA release.

[frontsideair]

Thanks for sharing the preview docs for the useSearchAutocomplete hook, I'm willing to give it a try!

About using fully controlled combobox, if I'm not mistaken the selection state is when the user picks an item from the listbox, but I want to customize it to populate the text field when it's focused with keyboard. I checked Google and Amazon for prior art and they both work this way, and it felt natural to me. (Amazon example doesn't seem accessible but Google is, AFAICT.)

[reidbarber]

Ahh yeah, you need the focus state. You would need to listen to focus events on the listbox (or items) to tell what is focused. Not ideal, but that is the only way I can think of.