ns-ui

Streaming Token Settle

Streaming text where provisional tokens sit off-baseline and a hair rotated like loose letterpress type, then snap into the chase with a stiff spring the instant they're confirmed — a correction slides the old word out sideways as its replacement slides in.

Use when any stream (LLM output, ASR transcription, collaborative edits) where the position/tilt/color of a token IS the provisional-vs-committed signal and a correction needs to read as a physical swap, not a flash — reach for streaming-ink-dry instead when you want elapsed-time freshness (a token drying from thin/translucent to full weight) with no revision model behind it, or text-decrypt for a one-shot scramble-to-reveal entrance on a fixed string with no streaming state at all.

Install

npx shadcn add https://design.helpmarq.com/r/streaming-token-settle.json
  • text
  • streaming
  • transcription
  • state-machine
  • accessibility

ns-ui / streaming-token-settle

transcripttranscribing

hover the panel to pause · loose type is provisional, locked type is committed

Props

PropTypeDefaultDescription
tokensLooseTypeToken[]Full ordered snapshot of the line's tokens, every render.
className?string