Iryx UIData display
IAvatarGroup
A row of avatars overlapped into a stack: who is on a thread, who is assigned to an issue.
+2DOCWBLAR
max closes the stack with a "+n" chip. Without it, every avatar renders.
Sizes
The overlap scales with the avatar.
+2DOCWBLAR
+2DOCWBLAR
+2DOCWBLAR
+2DOCWBLAR
Tooltips
tooltip names each person on hover or focus, lifting their avatar out of the stack. The "+n" chip lists everyone it hides.
+2DOCWBLAR
Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | AvatarGroupItem[] | [] | Each takes IAvatar's own props |
max | number | — | Cap the stack, counting the rest in a chip |
size | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'md' | Applied to every avatar |
shape | 'circle' | 'square' | 'circle' | |
tooltip | boolean | false | Name each avatar in a tooltip and lift it on hover or focus; the chip lists the hidden names |
unstyled | boolean | — | Skip built-in classes |
ui | { root?, trigger?, item?, overflow? } | — | Per-element class overrides |
Slots
| Slot | Props | Description |
|---|---|---|
overflow | { count } | Replaces the "+n" chip |
Accessibility
Each avatar rings itself in the page background so the overlap reads as depth, and earlier avatars paint over later ones. The visible order is the order of items.