Textarea

v0.5.0
Stable

A bare multi-line text input — the native `<textarea>` is this component's own root element. It has no built-in label/hint/error; wrap it in `FormField` for that chrome. Works standalone too — not every textarea needs the full form suite.

pnpm add @behivetech/atoms.textarea

You are viewing Textarea v0.5.0, snapshotted 2026-11-09. The latest is v0.5.1. Go to the latest →

Examples of v0.5.0 are shown as code; only the latest version runs live. Open the live examples →

Basic Textarea
1const BasicTextarea = () => (
2  <Textarea placeholder="Type your message..." />
3);
4

5render(<BasicTextarea />);
Textarea With Form Field
1const TextareaWithFormField = () => (
2  <FormField label="Bio" htmlFor="bio" hint="Max 200 characters.">
3    <Textarea id="bio" rows={3} />
4  </FormField>
5);
6

7render(<TextareaWithFormField />);
Textarea With Error
1const TextareaWithError = () => (
2  <FormField
3    label="Description"
4    htmlFor="description"
5    error="Description is required."
6  >
7    <Textarea id="description" invalid />
8  </FormField>
9);
10

11render(<TextareaWithError />);
Disabled Textarea
1const DisabledTextarea = () => (
2  <Textarea disabled value="Cannot edit this" onChange={() => {}} />
3);
4

5render(<DisabledTextarea />);