ns-ui

Typing Indicator Trace

Multi-user typing/presence as a live seismograph strip — one hairline trace per participant, scrolling leftward and spiking with their real keystroke cadence, never a looping three-dot bubble.

Use when multi-user presence for chat, comments, or a collaborative editor where you want hesitation and activity texture to be readable, not faked — each participant gets one hairline row, live-driven by real per-keystroke pulse() calls and presence status you feed it. Distinct from text-ekg-baseline (a single EKG-styled text baseline on an internal bpm timer, not multi-user, not event-driven) and from status-glyph-cadence (one glyph signaling an agent's own work state via cadence, not who-is-doing-what across several people). Not a fit if you only need to show who's present, not what they're doing right now — a roster list is cheaper and more honest for that.

Install

npx shadcn add https://design.helpmarq.com/r/typing-indicator-trace.json
  • presence
  • typing-indicator
  • collaboration
  • chat
  • svg
  • aria-live
  • cadence
  • multiplayer

Release thread

Who's typing, who's idle, who left — read from real cadence.

You
Ana
Ben
Cy

ns-ui / typing-indicator-trace — cadence, not a canned pulse

Props

PropTypeDefaultDescription
usersTremorUser[]
className?string