Igloo branding

Textarea

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

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

PropTypeDescription
allowNewlinebooleanTrue if the textarea should allow new lines with Enter.
autoFocusbooleanIf the textarea should be automatically focused.
classNamestringAdd class names to the surrounding DOM container.
dataTeststringAdd a data-test tag for automated tests.
disabledbooleanTrue if the textarea should be disabled.
errorbooleanTrue if the textarea has an error.
isAutoResizebooleanTrue if the textarea should resize automatically when a multiline value is set.
maxLengthnumberThe maximum number of characters allowed. Required if "showCharactersIndicator" is enabled.
onChange(e: ChangeEvent<HTMLTextAreaElement>) => voidFunction called when the value changes.
showCharactersIndicatorbooleanTrue to display the number of remaining allowed characters in the bottom right of the text area. Requires a valid value in the "maxLength" prop.
valuestringSpecifies the value inside the input.