data/@mihcm/ui·v0.21.0·stable
AvatarGroup
Stacked, overlapping row of Avatar components with an overflow "+N" count. The size prop forwards to children. max controls the visible limit.
Props
The full prop API for AvatarGroup. Same surface in web and React Native — bundlers pick the right variant via the react-native export condition.
| Prop | Type | Default | Description | Since |
|---|---|---|---|---|
max | number | 4 | Maximum avatars to show before the "+N" counter. | 0.5.0 |
size | 'sm' | 'md' | 'lg' | 'md' | Size forwarded to children and the overflow badge. | 0.5.0 |
direction | 'row' | 'row-reverse' | 'row' | Direction of the visible avatar stack. | 0.10.1 |
overlap | 'none' | 'sm' | 'md' | 'lg' | 'md' | Visual overlap density. | 0.10.1 |
stackOrder | 'first-on-top' | 'last-on-top' | 'last-on-top' | Controls which avatar visually sits on top. | 0.10.1 |
label | string | — | Accessible label for the group. | 0.10.1 |
renderOverflow | (count: number) => ReactNode | — | Custom overflow badge renderer. | 0.10.1 |
className | string | — | Additional Tailwind classes. | 0.5.0 |
Import
import { AvatarGroup } from '@mihcm/ui/AvatarGroup';