Skip to main content
TermRock
GitHub
ComponentsInputs

Component · Inputs

Token Field

An editable token/chip collection with free-text draft, completion hooks, and single-surface focus.

Kind
widget
Input
interactive
Canvas
120×40

Live preview

Loading terminal preview.

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

Ghosttytoken-field/basic
Loading terminal poster…
○ loading posterNo input — rendered state only
Token Field · exact mounted Rust story
01 · Purpose
What it is for
An editable token/chip collection with free-text draft, completion hooks, and single-surface focus.
Best fit: Inputs · input · widget
02 · Behavior
What the mounted story proves
  1. 01
    TokenField
    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 token-field/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
TokenFieldOpen 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. Recipients, filters, tags, file mentions, command arguments — an
owned token collection with a draft input. Hosts own async completion menus.


vs TokenStrip


TokenStripTokenField
Databorrowed projectionowned tokens + draft
Inputnonefree-text commit
Focusroving on chipsdraft ↔ tokens one surface


Focus model


One host Tab stop for the field. Inside:


    

  • Draft — type; Left at caret start moves to last token
    • 

  • Token — Left/Right; optional remove part without Tab
    • 

  • Empty draft Backspace removes previous token
    • 

  • Alt+Left/Right reorders focused token
    • 

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.
Theme Picker
A live theme preset list; selection changes drive caller re-render.
Token Strip
TokenStrip is the exact public paint owner for input terminal UI.