# Collab Presence Avatars

Real-time view of collaborators editing documents in SaaS platforms.

- id: `collab-presence-avatars`
- Page: https://agentic-ui-kit.com/components/collab-presence-avatars
- Live preview: https://agentic-ui-kit.com/live/component/collab-presence-avatars

## Install

```bash
agentic-ui add collab-presence-avatars
npx shadcn@4.17.0 add @agentic-ui/collab-presence-avatars
```

## Metadata

- **Level:** block
- **Category:** block
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** avatar-stack, live-presence, status-indicator, overflow-popover, follow-collaborator, status-filter, self-status-toggle, keyboard-navigation, responsive-layout, empty-and-error-states
- **Intents:** monitor-live, track-status, communicate
- **Suits domains:** saas, project-management, notes, knowledge
- **Interaction:** avatar-hover-popover, overflow-popover, status-filter, self-status-toggle, follow-action, keyboard-navigation
- **Screen role:** overview
- **Density:** compact
- **Dark mode:** yes
- **Use it for:** real-time view of collaborators editing documents in SaaS platforms, presence indicators and cursor tracking in design and project management tools, conflict detection and concurrent editing in wikis and knowledge bases, monitoring of active viewers in spreadsheets and technical specifications
- **Avoid when:** static or single-user views with no concurrency or collaboration, contact lists or corporate directories with no real-time session status
- **Preserve when adapting:** presence-aggregation-model, overflow-partitioning-logic, status-badge-conventions, keyboard-interaction-contracts
- **Replace when adapting:** realtime-transport-provider, user-identity-source, domain-copy, document-context-bindings
- **Adaptation effort:** low
- **Coupling:** low
- **Quality score:** 9.2/10
- **Quality breakdown:** visual 9/10, responsive 9/10, accessibility 9/10, code 9/10
- **Uses primitives:** avatar, button, badge, popover, tooltip, separator, dropdown-menu
- **npm dependencies (registry):** lucide-react@0.577.0
