Inputs & Textarea
Pull to Refresh
React Grid Layout
Inputs allow users to enter text or numbers.
There are three variations of Input — standard, leading content and trailing content. To include a leading or trailing icon within the input use Input Icon.
Input can have no label, a top label or an inline label.
Supportive text helps to instructs the user on what the field requires.
Placeholder text is shown in the initial enabled state and guides the user on what type of entry or formatting the field requires.
Input has seven states — enabled, hover, focus, active, filled, disabled and read only.
Input has four types of status available that should be used for form validation — success, warning, error, and loading.
Input fields can be optionally made to be immediately clearable with one click.
Password fields can be built to show and hide text by using the Input Group component with an icon only button.
Inputs can be displayed in large, medium and small sizes.