SYSTEM

Textarea

The field’s grammar for long text, on one rule the reader can drag taller.

Forms shadcn: Textarea

A sentence or two is plenty.

States

  • Project

    Rest

    nothing set

    Four modules of paper over one ink rule.

  • Project

    Focused

    :focus

    The rule develops in --state from the press.

  • Project

    Check thisSay a little about the project.

    Invalid

    aria-invalid="true"

    The rule stays --state; the message says what to do.

  • Project

    Disabled

    disabled

    A --border hairline and muted text.

Anatomy

Height at least 4 modules (96px); the reader can drag it taller
Line one 1px --ink rule under the text; no box
Text Basier Square 16/24, half a module of air above and below
Focus a 4px --state rule develops from the press in 140ms
Invalid the rule stays --state, the message leads with “Check this”
Resize vertical only, from the native handle

The dot and timings are read from the engine at build time (rule.ts).

Decisions

  • One rule, any height

    Long text keeps the field’s one line: the rule stays under the last line however tall the reader drags it, so a textarea reads as the same control as an input.

  • The rule is the focus

    As in every field, focus is the rule developing in --state from where you pressed, not an outline round a box.

  • Taller, never wider

    It resizes vertically only, so it keeps the column’s edges.