Code

API

This component extends the native <div> API.

Props	Type	Required
children	ReactElement	✅
visibleUsers	number	❌
overcountText	string	❌

children

You can pass multiple Avatar components as children. Keep in mind that only the first 10 will be rendered.

You can use the AvatarGroup.Avatar subcomponent so you don't need to install it or import it.

visibleUsers

Controls how many avatars you want to show, the rest will appear as a tooltip. The maximum amount of avatars that will be shown is 10.

overCountText

String shown when the visibleUsers amount is surpassed.

Example

Live Demo

Code Sandbox

https://codesandbox.io/p/sandbox/avatargroup-xxr5ms?file=/src/App.tsx:1,1codesandbox.io