Textarea

A native <textarea> element for a longer piece of text, such as a message, a comment, or a description.

Import

import { Textarea } from "@aizvi/ui";

Basic example

<Textarea placeholder="Write your message" />

Live preview

Like Input, Textarea is often used inside a FormField.

<FormField label="Message">
  <Textarea placeholder="Write your message" />
</FormField>

Invalid state

<Textarea invalid defaultValue="Too short" />

Live preview

Disabled

<Textarea disabled defaultValue="Cannot be changed" />

Live preview

A disabled Textarea can no longer be resized by the user.

Props

Textarea accepts every normal <textarea> attribute, plus this one.

• invalid, a boolean. Styles the textarea as an error and sets aria-invalid. The default is false.

Accessibility

• Textarea renders a real <textarea>, so it can be resized, and read by a screen reader, with no extra code.
• Always give a Textarea a label, either with FormField, or with your own <label htmlFor>.
• When invalid is true, aria-invalid="true" is set automatically.