KQ-537 · PRESENCE/ROW
Presence Row
A presence stack that makes room. A face arriving scales from 0.6 into a snap while its neighbours slide over on the same spring through layout, so the row squeezes open instead of reflowing in one frame; a face leaving fades on the exit ease and popLayout closes the row behind it. Hover or focus fans the stack apart so every face is legible — the row itself is focusable, and Escape closes the fan — and the overflow chip rolls its count.
KQ-537 · PRESENCE/ROW
3 on the brief
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/presence-row
Props
- people
- PresencePerson[]
- default —
- Who is present, in stacking order; each needs an id, a name and a tint (pass a theme token so both themes read).
- max
- number
- default 4
- Faces shown before the overflow chip takes over.
- onOverflowClick
- () => void
- default —
- Fires when the +N chip is pressed, from the click itself — the component keeps no list of its own to open.
- context
- string
- default "this document"
- What the presence is for; it completes the spoken sentence, as in "Ana and 2 others are on the Fernworks brief".
| Prop | Type | Default | Description |
|---|---|---|---|
| people | PresencePerson[] | — | Who is present, in stacking order; each needs an id, a name and a tint (pass a theme token so both themes read). |
| max | number | 4 | Faces shown before the overflow chip takes over. |
| onOverflowClick | () => void | — | Fires when the +N chip is pressed, from the click itself — the component keeps no list of its own to open. |
| context | string | "this document" | What the presence is for; it completes the spoken sentence, as in "Ana and 2 others are on the Fernworks brief". |