Avatar group

@summonware/ui · avatar-group · P3 · Core UI
No reference page demonstrates this component — it was inferred from the screens that use one, so there is no variant matrix behind it.

Usage

Overlapping avatars for a set of people attached to one thing — assignees on a task, members of a workspace. Past `max` it collapses to a "+n" counter, so the control has a fixed maximum width no matter how many people are in the set.
import { Avatargroup } from '@summonware/ui';

Best practices

DoOrder the list meaningfully — most recently active, or owner first. The truncated tail is invisible.
DoKeep `max` at four or five. The point is a glanceable summary, not a roster.
Don'tUse it where individual identification matters. Overlap hides most of each face; use a list instead.

Examples

Common configurations, variations and states.

Overflow

JDSLAKMC+1
Five names against the default max of four, so the last becomes a "+1" counter.

Sizes and limits

JDSLAK+1JDSLJDSLAKMCTR+1
A tighter `max` in dense rows, a larger size where the group is the focus.