Home > @uniformdev/design-system > AvatarGroupProps

AvatarGroupProps interface

Signature:

Extends: React.HTMLAttributes<HTMLDivElement>

Properties

Property

Modifiers

Type

Description

children

React.ReactNode

The children to render. This component works best when the component are direct children. *

getTruncatedLabel?

(numberOfTruncatedItems: number) => string

(Optional) A function that return the label to use on the truncated value. (n) => and ${n} others

max?

number

(Optional) The maximum number of avatars to show. This must be 2 or more. If this value is smaller than the number of children, the other avatars will be truncated and shows as "+N" Note that when truncation occurs, the truncation "+N" avatar _counts as one_ towards the max. For example with avatars A B C D, and max 3, the rendered avatars will be (A) (B) (+2). 5

truncatedProps?

Pick<AvatarProps, 'size' | 'as'>

(Optional) Props to apply to the truncation avatar if it is shown. Needed if the group's avatars are not the default size.