KQ-850 · BUBBLE/TAIL

Bubble Tail

Only the last message of a run wears the tail. Consecutive messages from one sender form a run, and the tail is one element per run with a shared layoutId, so when a new message extends the run it hands off, travelling from the old last bubble to the new one on snap while its path morphs from a tucked curve to the full point and the old bubble's corner rounds back on glide. A new sender starts a new run with its own tail, and nothing inside is focusable.

KQ-850 · BUBBLE/TAIL
Basinworks slot
  1. Marta, 09:10. Slot's yours if you want it.
  2. Marta, 09:10. Tuesday, first thing.
Marta: Tuesday, first thing.

Marta · run of 2 · tail on 2

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/bubble-tail

Props

messages
TailMessage[]
default
The thread in order: id, author, text, at as HH:mm, optional mine.
label
string
default "Thread"
Names the thread for assistive technology.