Hewn
Components

Components

TextArea

Multiline labeled field with description and validation messaging.

newfree

Install

@hewnui/ui · hewnui

Terminal
npm install @hewnui/ui
Terminal
pnpm add @hewnui/ui
Terminal
yarn add @hewnui/ui
Terminal
bun add @hewnui/ui
Terminal
npx hewnui@latest add text-area

Built on React Aria TextField with a TextArea control. Labels sit above the control with optional helper and error text below.

Shown on the changelog and email digests.
Keep this under 500 characters.

Usage

TSX
import { TextArea } from "@hewnui/ui";

<TextArea label="Notes" placeholder="Add context" rows={4} />

Variants

outline (default), filled, flushed, and glass.

Sizes

sm, md (default), and lg.

States

  • Description helper text
  • Invalid + errorMessage
  • Disabled

Accessibility

  • Label association through React Aria
  • Error text connected via field semantics
  • Keyboard focus ring on the textarea

API reference

Props for TextArea from @hewnui/ui/text-area. Generated from component types — not hand-written.

Prop

Type

On this page