Select
Notes
A select
component that leverages the browser's built in select
, layering
on a styled label and presentation for the currently selected option.
Props
- children
node
*option
elements associated with theselect
element. - className
string
- customFieldStatus
bool
A flag indicating that the field uses a custom element to display field status and should not wrap error messages in a
FieldStatus
component. - displayStatus
bool
A flag indicating that the field should display its error message irrespective of the field's error status. If set to
true
, the error message will display no matter what. If set tofalse
, it will never display. - error
bool
A flag indicating that the field is in an error state.
- errorMessage
node
A message to display when the field is in an error state. Wrapped in a
FieldStatus
component by default. - floatLabelAriaHidden
bool
Set to true to hide float label text from screen readers
- id
string
- useInactiveStyle
bool
Set to true to display select as greyed out and recessed
- label
string
* - modified
bool
For use cases where a select has a default option pre-selected, use this prop to visually indicate that the user chose something else
- name
string
- onChange
func
- selectedOptionFormatter
func
A function allowing the select component's getSelectedOption to pass a custom text for the selected option. Returns custom text.
- value
string