Illuminate option closest match to input

[isaiahscheel]

Is your feature request related to a problem? Please describe.

When I am typing in the combobox, I am frustrated when my results is far down and I need to arrow key down to it when in ascom I am used to it changing my tab/focus location to the closest match

Describe the solution you'd like

If you search for a city in ascom today there is a grey highlight indicating what will be selected when you hit enter.

Say I am searching for 'San Diego' which is SAN

I start typing 'SA' and this is what I get

So if I was going to San Fransisco, this would be super nice because I could just hot enter and move on, but it is also nice because then I type 'SAN' and get

So it bounced the focus down to San Diego because SAN perfectly match the IATA code SAN

Currently there is only the bolding of typed characters which is very useful like so:

and 'SAN' here

But there is no hover/selection of the most matched one like there is in current ascom. This will be nice so the user does not need to arrow key all the way down.

Describe alternatives you've considered

If this is a very specific problem to city searching then we are down to implement something on our side that checks for the most closely matched option and going to that location, but I am unsure if that is even possible with the current combobox? But if there is a way to pass a prop to an option as the 'selected' or 'hovered' item then we could do something on our side!

Additional context

Ping me for a lower env of the flight search site if you want to give the city search combobox a try!

[braven112]

Likely feature would be to add an "Activate by value" property

[blackfalcon]

Working solution spec

This was discussed with the team and there are potential issues with how the Auro team sees this logically working out and how other teams may want this to work out.

Recomendation

@jason-capsule42 @blackfalcon are to schedule a meeting with @isaiahscheel to determine what is the expected outcome and what is the responsibility of Auro and what is the responsibility of the consuming team.

[jason-capsule42]

I played with this auto-highlighting some more on alaskaair.com. There is nothing smart going on here.

The combobox is simply highlighting the first open that contains the matching string.

During initial development of combobox discussion with design team was had specifically around if we should auto-highlight the first available option or not. The decision was made to not do that.

Given the current behavior in production for the old search combobox and that our existing behavior matches the design specification, I believe this feature request should be kicked over to @leeejune and the design team for consideration.

[jason-capsule42]

Given further in-person discussion:

Auro team can expose an easy to use API method to allow for highlighting any given menuoption. This would work much like setting the value (auro-combobox.value = 'new value'). Something probably like auro-combobox.active = 'new active value'.

The component will not incorporate any additional logic to self determine which menuoption is active beyond the existing keyboard and mouse navigation.

[blackfalcon]

Rescheduled team refinement whereas the expected outcome is to create a new feature issue moving forward given the information provided and the information collected in subsequent meetings. Steps to follow:

1. Create a new issue with feature specification and exit criteria
2. Link back to this originating issue
3. Close the originating issue

[blackfalcon]

Placing this issue in the backlog and as inactive. The following issues will resolve this request.

• Document how-to highlight option #112
• Document how-to highlight option auro-menu#169

[blackfalcon]

This issue has been labeled as the original parent issue that sparked a body of work. No work will be addressed specifically with this issue, but see the linked issues that will be delivered on.

[Patrick-Daly-AA]

Auro team has decided that this functionality is not something we will support. Highlighting results in a combo box is supported, but the logic for which item should be highlighted is to be owned by the implementing team.