[Autocomplete] New API to control the highlighted option

• I have searched the issues of this repository and believe that this is not a duplicate.

Summary 💡

Typing into the auto-complete and pressing enter should select something, such as the suggested option. The suggested option to select should be highlighted.

Examples 🌈

For example type in Good into the playground and press enter, nothing gets selected.

Lets say I have a text matching score when searching for Good as following: The Good, the Bad and the Ugly = 0.3 Goodfellas = 0.8

I would want Goodfellas to be highlighted and selected when enter is pressed.

Motivation 🔦

The current auto-complete logic makes suggesting an option difficult.

Passing in a highlightedValue/suggestedValue would make the above possible. Set the first value in the list to be highlighted if one is not provided.

[jatin-rao]

Ok @oliviertassinari so my use case is as Follows:

My Autocomplete should work like a time picker. Like the user will be shown suggestions of time from 12:00 am to 12:00 pm with 15 minutes interval like (12:00AM, 12:15AM, 12:30AM and so on till 11:45PM) and when an user edits the time in text field like he writes 10:40AM so the autocomplete should automatically highlight the closest option like 10:45AM in popup menu. Even if it can’t highlight the closest option, it should be able to move the scrollbar in popup to 10:45AM.

I have searched a lot about how to change focus inside popup programmatically but was not able to find anything. Do you have any suggestion on how to achieve this?

[KamalAman]

@oliviertassinari Yeah, it seems like that api would work for us. Yes keeping the highlight state inside a ref if not controlled makes perfect sense. We don’t want to pull the highlighted value to the top of the list since the list is sorted/grouped.