Textarea
The textarea component defines a multi-line text input control.
Version 0.5.2
Installation
To install @igloo-ui/textarea
in your project, you will need to run the following command using npm:
npm install @igloo-ui/textarea
If you prefer Yarn, use the following command instead:
yarn add @igloo-ui/textarea
Usage
Then to use the component in your code just import it!
import Textarea from '@igloo-ui/textarea';
<Textarea
placeholder="The character count will count down to show how many characters are left. MaxLength is required"
maxLength={1000}
showCharactersIndicator
/>;
API
Prop | Type | Default | Description |
---|---|---|---|
allowNewline | boolean | True if the textarea should allow new lines with Enter. | |
autoFocus | boolean | If the textarea should be automatically focused. | |
className | string | - | Add class names to the surrounding DOM container. |
dataTest | string | - | Add a data-test tag for automated tests. |
disabled | boolean | True if the textarea should be disabled. | |
error | boolean | True if the textarea has an error. | |
isAutoResize | boolean | True if the textarea should resize automatically when a multiline value is set. | |
maxLength | number | - | The maximum number of characters allowed. Required if "showCharactersIndicator" is enabled. |
onChange | (e: ChangeEvent<HTMLTextAreaElement>) => void | - | Function called when the value changes. |
showCharactersIndicator | boolean | True to display the number of remaining allowed characters in the bottom right of the text area. Requires a valid value in the "maxLength" prop. | |
value | string | - | Specifies the value inside the input. |