carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.87k stars 1.82k forks source link

[ComboBox]: can I allow an onBlur to trigger the onChange event of a Combobox for a new item entry? #6999

Open scottdickerson opened 4 years ago

scottdickerson commented 4 years ago

Summary

As I user, I expect ComboBox to work like a TextInput for newly Items, blurring the field should trigger the onChange event. Could we add a property to the ComboBox control to allow them to work like that? Similar to this bug: https://github.com/carbon-design-system/carbon/issues/6613

image

Justification

For our usecases, we mostly want to use ComboBox to enter new items, but occasionally to select an existing item.

Desired UX and success metrics

As a user I am able to submit new items to the ComboBox simply by entering new text, and then leaving the field

tay1orjones commented 4 years ago

This is supported by the wai-aria guidance:

The nature of the suggested values and the way the suggestions are presented is called the autocomplete behavior. Comboboxes can have one of four forms of autocomplete:

  1. No autocomplete: When the popup is triggered, the suggested values it contains are the same regardless of the characters typed in the textbox. For example, the popup suggests a set of recently entered values, and the suggestions do not change as the user types.
  2. List autocomplete with manual selection: When the popup is triggered, it presents suggested values that complete or logically correspond to the characters typed in the textbox. The character string the user has typed will become the value of the textbox unless the user selects a value in the popup.
  3. List autocomplete with automatic selection: When the popup is triggered, it presents suggested values that complete or logically correspond to the characters typed in the textbox, and the first suggestion is automatically highlighted as selected. The automatically selected suggestion becomes the value of the textbox when the combobox loses focus unless the user chooses a different suggestion or changes the character string in the textbox.
  4. List with inline autocomplete: This is the same as list with automatic selection with one additional feature. The portion of the selected suggestion that has not been typed by the user, a completion string, appears inline after the input cursor in the textbox. The inline completion string is visually highlighted and has a selected state.

The current implementation doesn't follow any of these specifically, more of a blend of #2 and #3. This request would firmly plant the implementation in #3.

grahamharper commented 3 years ago

@tay1orjones Firstly I would give +1 for #3.

But also those 4 patterns you quoted deal with the selection behaviour, I think the original issue description deals more with the other expected behaviour of combobox, that it also behaves like a text input and allow input of arbitrary text, text that does not match an option in the list.

I believe this is what's asked for in #6102 and #6818