ns-ui / streaming-markdown-caret
How do I keep the input responsive while a big list re-renders?
arrived text never re-animates — only the trailing edge carries the caret and settles when a bold or code span closes
ns-ui
Streaming-text renderer where already-arrived content never re-animates — only the trailing, unterminated edge carries a muted caret and settles when its markdown span closes.
Use when free-form model output arriving as an ever-growing string where already-settled text must never re-render or shimmer, only the trailing unterminated edge carrying a caret until its markdown span closes; pick streaming-retraction instead when the model can take words back and the revision should stay inspectable, or skeleton-schema when the output is a structured object whose shape is known up front.
Install
npx shadcn add https://design.helpmarq.comns-ui / streaming-markdown-caret
arrived text never re-animates — only the trailing edge carries the caret and settles when a bold or code span closes
| Prop | Type | Default | Description |
|---|---|---|---|
| text | string | — | Full text accumulated so far. Append new characters as they arrive — never mutate or replace earlier characters, or the offset-based keys that keep the stable prefix from re-animating no longer hold. |
| streaming? | boolean | — | true while more content may still arrive. Controls the trailing caret and the sr-only status. |
| className? | string | — | — |