Autocomplete Comboboxes should show the entire available list of options when opened after selecting an item.

[Felttrip]

The current behaviour of Autocomplete combo boxes is that when an item is selected and the combo box is reopened the list only shows the item that is selected due to the recommendation for how to filter down the list of options.

https://paste.twilio.design/components/combobox#autocomplete-combobox

This has caused users to be confused as the where the rest of their options are because they don't realize they need to delete the input to show the rest of the options.

Were currently working around this by using onIsOpenChange set the list back to the original set of items like so

              <Combobox
                autocomplete={true}
                itemToString={item => (item ? item.name : '')}
                initialSelectedItem={selectedEventEmitter}
                selectedItem={selectedEventEmitter}
                onSelectedItemChange={changes => {
                  if (changes.selectedItem != null) {
                    setSelectedEventEmitter(changes.selectedItem)
                    setEventEmitterId(changes.selectedItem.id)
                  }
                }}
                onInputValueChange={({ inputValue }) => {
                  if (inputValue !== undefined) {
                    setEmitterInputItems(
                      emittersForCombo.filter(item => item.name.toLowerCase().includes(inputValue.toLowerCase()))
                    )
                  }
                }}
                onIsOpenChange={() => {
                  setEmitterInputItems(emittersForCombo)
                }}
                items={emitterInputItems}
                labelText="Linked audience event"
                optionTemplate={input => {
                  return (
                    <Text overflowWrap="anywhere" padding="space30" as="span">
                      {input.name}
                    </Text>
                  )
                }}
                disabled={selectedAudience?.id === 'all' || selectedAudience?.engineType !== AudienceEngineType.Retl}
              />

it would be nice if the default behaviour of the combobox using autocomplete was to reset the list back to what it was pre autocomplete filtering.

[TwilioPasteBot]

Disclaimer: This is a very experimental bot using OpenAI's GPT-4. The answers may not be correct, a human will review the answer and update it if necessary.

---

Sorry, I don't know how to help with that.

I did do a search though, and I managed to find these other Discussions that might be similar or related to your question. Give them a read to see if they answer your question. If they do, head back here and update this discussion and mark it as answered, pointing others to the related discussion:

• Combobox not able to clear value when used as controlled component (updated: 08/10/2022, similarity score: 89%)
• changing the combobox with pre selected item. (updated: 12/29/2022, similarity score: 88%)
• Combobox component strange behaviour (updated: 10/10/2022, similarity score: 87%)

[serifluous]

Hey @Felttrip ! Thanks for the suggestion. Sorry it took a bit of time to get back to you—we're still discussing the desired behavior in the team.

Some background: We've kept Combobox at its most straightforward implementation so far. The detailed interaction and list behavior can be so specific to the use case in each product feature that the thought was that it's better to let teams control how the states and filtering work.

But! We've received a lot of feedback about Combobox over the years (like #982), and especially since it's one of our most used components, we're planning on making some improvements to both the component and documentation this year.

Something that could help us out with prioritizing this: When you say, "This has caused users to be confused...", can you provide some more detail? Is this customers or folks internally? Thanks!

[Felttrip]

Customers and internal folks, before we added the change to reset the list of options on isOpenChange there was confusion on where their options went. Couple of clips showing the behaviour that could be nice as a default and how the box currently behaves.

Current behavior
https://github.com/user-attachments/assets/270d7846-51e0-4d13-8f74-f051b91ff966

What could be nice (and is doable with onIsOpenChange)
https://github.com/user-attachments/assets/87d0fcdc-c48b-48eb-8299-1d761f63b97a

I agree with #982 when someone clicks to open a combo box they are probably looking to change the selection so filtering things down still seems superfluous. I can see the argument for leaving things as straightforward as possible though and just adding to the documentation that the onIsOpenChange stuff is the easiest way to get that behavior.

[serifluous]

Thank you! I just moved a ticket up in our backlog to add the example at least.

We have some upcoming work to iterate on Combobox, so at that point, we should definitely do an RFC with the feature teams to determine if this should just be the default behavior implemented in Combobox.