Textarea

A multiline text input field.

Label

import { Textarea } from "@nulogy/components";

<Textarea labelText="Label" id="textarea" />

Use when

Label

<Textarea id="custom-size" labelText="Label" rows={2} />

Label

<Textarea id="disabled" labelText="Label" disabled />

Label

Please fill this out

<Textarea id="error" labelText="Label" errorMessage="Please fill this out" />

Label(Optional)

Additional help text

<Textarea
  id="all-labels"
  labelText="Label"
  helpText="Additional help text"
  requirementText="(Optional)"
  placeholder="Placeholder"
/>

Name	Type	Default	Description
rows	Number	3	A custom number of rows to show by default.
value	String	undefined	Value of input, used when controlling the component
defaultValue	String		Default value of input
id	String	null	A unique ID for this input
name	String	undefined	A unique name for this input
disabled	Boolean	false	Marks the field as disabled and disallows user input
helpText	Node	null	Placed below the label to provide assistance on how to fill out a field or the expected format. It can also provide an explanation of why the information is needed and how it will be used.
labelText	String	null	Informs users what the corresponding input field is for.
placeholder	String	null	A hint to the expected format for the field. Not a replacement for a label.
required	Boolean	false	Makes the field require selection before the form will submit.
requirementText	String	null	(Optional) or (Required).
className	String	undefined	className passed to the wrapper element.
onChange	Function	undefined	Change event handler that will be run whenever the value of the input is updated.
onBlur	Function	undefined	Change event handler that will be run whenever the input loses focus.
errorMessage	String	null	Displays list of error messages and applies red style
errorList	Array of Strings	null	Displays list of error messages and applies red style