EEnterUI
DocsComponentsThemesDonation
Get Started
      • Input
      • PasswordInput
      • NumberInput
      • Stepper
      • TextArea
EnterUIDocsInputsForm ControlsText InputsTextArea
InputsUpdated 6 May 2026

TextArea

A multi-line text input with controlled resize behavior.

TextArea defines how EnterUI handles a multi-line text input with controlled resize behavior, including default structure, accessible states, and token-driven styling.

#Default usage

Default textarea

Vertical resize is enabled by default.

Code
<TextArea aria-label="Release notes" defaultValue="Refined docs, component coverage, and product surface examples." rows={5} />

#Import

Code
import { TextArea } from "@froggdesign/enter-ui-react";

#Patterns

Invalid state

Invalid state stays clear without becoming visually brutal.

#Accessibility

TextArea renders a native textarea. Pair it with Label or Field and use FieldError for semantic error text.

#API

  • invalid toggles invalid styling and aria state.
  • resize: vertical, horizontal, both, or none.
  • All native textarea props are supported.

#Styling

Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.

PreviousStepper
NextLabel

On this page

  1. Default usage
  2. Import
  3. Patterns
  4. Accessibility
  5. API
  6. Styling