AvatarGroup displays multiple avatars in an overlapping row with an optional overflow indicator. Uses a compositional API: pass Avatar children directly so each avatar can carry its own props (status dots, click handlers, etc.).
tsimport {AvatarGroup} from '@astryxdesign/core/AvatarGroup'
| Guidance | Practices |
|---|---|
| Do | Set max to limit visible avatars when the list is long; 3-5 is typical. |
| Do | Use AvatarGroupOverflow for custom overflow content like a popover trigger or "add member" button. |
| Do | Pass status dots, click handlers, or tooltips directly on each Avatar child. |
| Don't | Don't nest AvatarGroups; use a single group with all avatars. |
Overlap multiple avatars in a row to represent a group of people. Use for team lists, PR reviewers, or participant counts where you want to show faces without taking up much space.