Combobox
Text input that filters a list of options as the user types.
Usage
import { Combobox } from '@smartui/react';
import '@smartui/react/styles.css';When to use
- Long lists where the user knows what they want.
When not to use
- Fewer than ten options. Use Select.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | { key, label }[] | required | |
label | string | - | Always visible above the control. |
helperText | string | - | Help text below the control. |
errorMessage | string | - | Shown when isInvalid; replaces the helper text. |
variant | 'raised' | 'flat' | 'raised' | Raised on the canvas, flat inside a white card. |
size | 'sm' | 'md' | 'lg' | 'md' | md on desktop, lg on touch. |
isInvalid, isDisabled, isRequired | boolean | false | |
allowsCustomValue | boolean | false |
Accessibility
- The number of results is announced as the list changes.