Form

Textarea

Multi-line text input with three sizes, invalid state and an optional auto-resize mode that grows with its content.

Import

import { Textarea } from "@zephora/react";

<Textarea placeholder="Write a message…" rows={3} />

`autoResize` grows the textarea to fit its content as you type.

<Textarea autoResize placeholder="Type several lines — I grow with you." />

<Textarea invalid defaultValue="Too short" />

Prop	Type	Default	Description
`size`	`"sm" \| "md" \| "lg"`	`"md"`	Typography / padding scale.
`invalid`	`boolean`	`false`	Marks the field invalid: sets aria-invalid and error styling.
`autoResize`	`boolean`	`false`	Automatically grows the textarea to fit its content.
`rows`	`number`	`3`	Initial number of visible text rows.
`unstyled`	`boolean`	`false`	Headless mode — drops Zephora classes so your own CSS can style it.
`…rest`	`TextareaHTMLAttributes<HTMLTextAreaElement>`	—	All native textarea props (value, onChange, placeholder…) are forwarded.