Screen Reader
Value to describe the component can either be provided via label tag combined with inputId prop or using aria-labelledby, aria-label props. Chip list uses listbox role with aria-orientation set to
horizontal whereas each chip has the option role with aria-label set to the label of the chip.
Input Field Keyboard Support
| Key |
Function |
| tab |
Moves focus to the input element |
| enter |
Adds a new chips using the input field value. |
| backspace |
Deletes the previous chip if the input field is empty. |
| left arrow |
Moves focus to the previous chip if available and input field is empty. |
Chip Keyboard Support
| Key |
Function |
| left arrow |
Moves focus to the previous chip if available. |
| right arrow |
Moves focus to the next chip, if there is none then input field receives the focus. |
| backspace |
Deletes the chips and adds focus to the input field. |