sheengemologic ui
All components

AvatarGroup

Presents a labeled bounded set of identities and a localized overflow count.@gemologic/sheen · data

Playground

<AvatarGroup label="Reviewers" avatars={reviewers}  size="md"/>

Variant matrix

Reviewers
size: sm
size: md
size: lg

Anatomy

Package
@gemologic/sheen
Source
packages/ui/src/primitives/Avatar.tsx
Tokens
  • --sheen-space-inline-xs
  • --sheen-color-bg-inset
  • --sheen-color-border-control

Accessibility

Role: groupKeyboard: No component-owned keys

Do

  • Keep input order meaningful and IDs stable.

Do not

  • Do not use the overflow badge as an unlabeled action.

Generated props

NameTypeDefaultDescription
label *string—Accessible name for the identity group.
avatars *readonly AvatarItem[]—Ordered identities with stable unique IDs.
maxnumber5Maximum visible identities before the overflow count.
sizeAvatarSizemdShared token size.
Native Solid/HTML attributes remain available and are omitted from this authored-prop view.