Select
Displays a list of options for the user to select from, with a dropdown trigger button.
When To Use
Use the Select component when you need to:
- Allow users to choose a single option from a list of predefined choices
- Conserve space in forms where dropdown selection is more appropriate than radio buttons
- Display a list of options that might be too long for radio buttons
- Provide a familiar selection pattern for form elements
- Create a hierarchical selection interface with option groups
Select is best used when there's a predefined list of options and users need to select exactly one item from that list.
Examples
Select your local timezone for accurate scheduling.
Disabled Select
Select with Disabled Options
Props
Prop | Type | Default |
---|---|---|
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |
Prop | Type | Default |
---|---|---|
$$typeof | symbol | - |
displayName? | string | - |
propTypes? | any | - |