Textarea Field
Textarea allows users to provide multiple lines of text.
Overview
Textareas allow for multiple lines of text and function very similarly to Text Fields with the addition of the rows property, which determines how tall the input will be.
Usage
Content
Textarea is not resizeable by default. Make the height of the textarea proportional to the amount of text expected and provide a scroll if the input exceeds the set height.
Variations
Custom row amount
Set a custom amount of rows to show if the default is not right for the content users are expected to enter.
Resizable
In some cases it can be useful to set the textarea to be resizable if it is not clear how much text will be entered.
Properties
Name | Values | Default |
---|---|---|
id (required) | String | |
label (required) | String | |
optional | Boolean | false |
hint | ReactNode | |
error | ReactNode | |
characters | Number | 25 |
fullWidth | alwaysneversmall | small |
rows | Number | 3 |
resizable | Boolean | false |
... | JSX.IntrinsicElements["textarea"] |