Overview

For design guidance, see the page on text fields .

Props

Name Description Type Default Required
label
Label for the text field
string — true
value
Value of the text field
string|number null —
invalid
Whether or not the current value is invalid
boolean false —
invalidText
Text conditionally displayed based on values of invalid and showInvalidText
string null —
showInvalidText
Show the invalidText even if the user has not focused or change the input. invalid must also be true for this to take effect.
boolean false —
disabled
Whether or not the field is disabled
boolean false —
autofocus
Whether or not to autofocus
boolean false —
maxlength
Maximum number of characters for value
number null —
autocomplete
HTML5 autocomplete attribute (off, on, name, username, current-password, etc)
string null —
autocapitalize
HTML5 autocapitalize attribute. Used for touch-input enabled UI (off, on, words, etc)
string null —
type
HTML5 type of input (text, password, number, etc.)
string 'text' —
min
Minimum value (when value type is number)
number null —
max
Maximum value (when value type is number)
number null —
textArea
Whether to display as a multi-line text area
boolean false —

Events

Name Description
input
Emitted on each change with new value
keydown
Emitted with keydown events
blur —
focus —

Methods

Name Description
focus
Puts keyboard focus in the text field