Select component
Properties
| Name | Description | Default |
|---|---|---|
| autoGrow | If set, the input will auto grow in height to match the input value. You can limit the max line count by setting the prop as a number. | - |
| autoWidth | If set, the input width will match with the visual width of the input value | - |
| busy | Input busy state | - |
| description | Input description | - |
| error | Input error state | - |
| hotkey | Optional hotkey | - |
| iconLeft | Input left positioned icon | - |
| iconRight | Input right positioned icon | - |
| iconRightLabel | Input right icon label | - |
| iconRightSecondary | Input right positioned icon | - |
0-10 of 27
Searchable
By defining the `searchable` the Select component's input accepts user input and the select items are filtered
Custom Label
The `selectedLabelFn` can be used to define a custom label for the current selected value
With Custom Item Component
`renderItem` and `renderSelection` properties can be used to define custom styled content for the selection items or the selected item
As Input
Select component can behave as a regular Input by providing optional items without auto complete or search functionallity
Busy
When an input field is a part of a form that is currently busy (e.g. data is asynchronous validated or saved) the input field should be marked with the `busy` attribute. The component will be set as disabled, but will be visually different from `disabled` state.
Disabled
A component that is unavailable and should be ignored on form submissions, has to be marked with the `disabled` property.
Read Only
A component that is unavailable for user input changes, but should be focusable and included on form submissions, has to be marked with the `readOnly` property.