Quick nav

Textarea

The textarea component defines a multi-line text input control.

Version 0.6.0

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.