Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProUse this when several people are chosen from a row: a free-scroll shelf of avatar toggles with initials, a polite count of who is chosen, a Clear button and a last Invite card for anyone not listed.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it in share, assign and invite dialogs where the likely people fit in a row and you also need a way to add someone else.
Do not use it for hundreds of people. Use a searchable list. It is for the top few suggestions.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
people | Person[] | - | Each has an id, name and optional role and image URL. |
label | string | - | Accessible name of the shelf. |
onChange | (ids: string[]) => void | - | Called with the chosen ids whenever one changes. |
onInvite | () => void | - | Called by the final Invite card. |
The pattern ships with a Testing Library test (avatar-picker-shelf.test.tsx). Embla needs layout to count snaps, and jsdom has none, so the repo's mockCarouselLayout helper gives the viewport and slides real sizes.