Komponents
Components

Components

TextArea

Multiline labeled field with description and validation messaging.

newfree
pnpm add @komponents/uiCanonical TypeScript source · tree-shakeable subpaths

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

Snippet
import { TextArea } from "@komponents/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

On this page