Skip to main content
TermRock
GitHub
ComponentsInputs

Component · Inputs

Text Area

A multi-line grapheme-safe editor with selection, undo/redo, soft wrap, line numbers, and host clipboard/external-editor hooks.

Kind
widget
Input
interactive
Canvas
120×40

Live preview

Loading terminal preview.

Static terminal poster. Choose Run live to start the Rust demo.

Ghosttytext-area/basic
Loading terminal poster…
○ loading posterNo input — rendered state only
Text Area · exact mounted Rust story
01 · Purpose
What it is for
A multi-line grapheme-safe editor with selection, undo/redo, soft wrap, line numbers, and host clipboard/external-editor hooks.
Best fit: Inputs · input · widget
02 · Behavior
What the mounted story proves
  1. 01
    TextArea
    Representative 120×40 terminal state.
  2. 02
    Passive paint
    No keyboard or pointer action is claimed by this representative story.
  3. 03
    Evidence stays explicit
    3 covered · 8 partial · 5 missing axes.
03 · Implement
Install, then start from exact code
Install
cargo add termrock --git https://github.com/tailrocks/termrock.git --rev 5283c2acf9154d0cfcd37b1ffe821c00faf90ea2
Add TermRock once. Keep domain effects in the host application.
Minimal implementation
Exact Rust setup used by text-area/basic.
Open to load code.
04 · Adapt
Variants and composition
Variants
Use the preview Variant menu when alternate registered stories exist. Each selection mounts a fresh configuration.
Composition
Inputs · input · widget
05 · Reference
API, tokens, accessibility
API
TextAreaOpen source ↗
Tokens
DesignSystemInspect exact story code for roles and capability projection.
Accessibility
Input contract mountedNo input claim in the representative story.
Contract
Evidence in progress3/23 axes covered
06 · Go deeper
Advanced guidance
Authored implementation guidance
Purpose. Multi-line editing for forms, notes, prompts, and comments:
grapheme-safe cursor ops, selection, undo/redo, word/indent motion, optional
soft wrap, line numbers, ScrollArea dual-axis viewport, and host-owned side
effects (clipboard, external editor, fullscreen).


When to use / when not


Use TextAreaPrefer
Multi-line notes, code snippets, forms—
Agent draft with queue/chipsPromptComposer
Single lineTextInput


Focus law


ConcernOwner
Input gateHost set_accepts_input
Caret / selectionTextAreaState (local)
Panel chromeaccepts_input → Focused border
Read-onlyset_read_only (scroll ok, no edit)
Review chromeTextArea::review() / TextAreaVariant::Review


Outcomes


    

  • Ignored
    • 

  • Changed — text, caret, or selection
    • 

  • Scrolled — viewport only (wheel)
    • 

  • Cancelled — Esc (after clearing selection)
    • 

  • ClipboardCopy { text } / ClipboardCut { text } / ClipboardPasteRequest
    • 

  • ExternalEditorRequested / FullscreenRequested
    • 



Intents


default_text_area_intent — Home/End, Page, Left/Right, Esc.
Up/Down line motion, word chords, indent, undo, and character insert stay on
handle_key.


Non-color


    

  • Caret: Focus role or TextStrong when colorless
    • 

  • Selection: reversed Focus
    • 

  • Scroll track: ░ / | (ascii)
    • 

  • Placeholder: muted text
    • 

  • Line numbers: muted gutter digits
    • 



Responsive


ConstraintBehavior
Soft wrapVisual rows; no horizontal scroll
Wrap NoneHorizontal scroll for wide lines
Resize / reflowCaret absolute; reveal re-centers viewport
Line numbersGutter width scales with line count (capped)
Ownership boundary
TermRock owns reusable terminal rendering and interaction state. The host owns domain data, policy, persistence, authorization, and side effects.
Evidence status
3 covered, 8 partial, and 5 missing contract axes. Missing evidence is not a behavior claim.
Slider
Horizontal volume-style slider with value text.
Text Input
A single-line, grapheme-safe input with validation and semantic outcomes.