ns-ui
Streaming LLM text where the newest tokens arrive light and translucent, then dry to full opacity a beat behind the stream head — width-stable, so committed text never reflows.
Use when the daily-driver container for a live token stream (chat replies, generation UIs) where weight/opacity/blur encode a real 'not yet settled' state and keep running for the life of the stream — reach for text-decrypt instead for a one-shot scramble-to-decode entrance on static text, or text-variable-weight for a cursor-driven decorative weight effect with no state behind it.
Install
npx shadcn add https://design.helpmarq.comns-ui / streaming-ink-dry
hover the panel to pause the stream
| Prop | Type | Default | Description |
|---|---|---|---|
| tokens | string[] | — | Every token received so far, oldest first, append-only. Include whatever whitespace the model actually emitted with each token — this component never inserts its own spacing between them. Shrinking the array (a fresh stream) resets both the ink and the live-region state. |
| dryMs? | number | — | Ms for one token to fully dry. Default 600. |
| idleFlushMs? | number | — | Ms of arrival silence before an unfinished (no sentence-ending punctuation yet) tail is flushed to the live region anyway. Default 900. |
| className? | string | — | — |