Field
Notes
A form field with validation support.
Props
- children
node
*Text or element(s) used as children of the field's
label
element. - className
string
- containerProps
object
Props applied to the field's outer container.
- 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. - defaultValue
string
- 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
[false]
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. - floatLabelActiveText
string
Optional text used as field's
label
element when the the field is in an active state. - floatLabelAriaHidden
bool
[false]
Set to true to hide float label text from screen readers
- floatLabelId
string
Optional id to be set on the associated label, can be useful for creating accessibility relationships between elements
- floatLabelVisible
bool
[true]
Set to false to only show the label when the field does not have a value
- id
string
* - inputAddon
node
An additional element rendered within the field after the
input
element. Used to apply extra buttons and labels on the edges of fields. - hintText
node
Optional hint text to be displayed.
- name
string
- onChange
func
- onBlur
func
- onFocus
func
- required
bool
- type
string
['text']
- value
string