Avatar Group
An avatar group is an element that communicates to the user that there is more than 1 person or entity associated with an item.
Last updated
An avatar group is an element that communicates to the user that there is more than 1 person or entity associated with an item.
Last updated
The Avonni Avatar Group component clearly and organizedly represents groups of users within your application, enhancing the user experience and making information easily accessible.
To configure the avatar group, customize the look and feel by setting up Variant, Size, Layout and Max Count.
Data Source is where the avatar group will come to life.
Manual data source allows you to create your avatars manually without any link to Salesforce data.
Variable gives you the ability to create avatars dynamically by assigning any source collection available in your flow. By selecting a source collection, you can define a data mapping for each attribute of the avatar group.
For example, the primary text attribute can be linked to the full name field to display the record's full name next to the avatar.
From the interactions tab, define if you would like to define an action when a user click on an avatar. For example, on avatar click navigate the user to the appropriate record id. The interaction would be something like this:
| Setting | Value |
|---|---|
Type | Navigate |
Page Refecence type | Record Page |
Object API Name | The desired object |
Record ID | Item: Name |
Action Name | View |
The following examples demonstrate some of the available functionality for Avatar Group.
| Property | Value |
|---|---|
Variant | Circle |
Size | Large |
Layout | Stack |
Max Count | 5 |
| Property | Value |
|---|---|
Variant | Square |
Size | Large |
Layout | Grid |
Max Count | 5 |
Data Source | Variable |
Data Mapping / Fallback icon | avatar |
Status Position | Top Right |
Presence Type | Online |
Presence Position | Top Right |
| Property | Value |
|---|---|
Variant | Square |
Size | Large |
Layout | List |
Max Count | 5 |
Data Source | Variable |
Data Source / Fallback icon | Contact |
Primary Text | Full Name |
Secondary Text | Title |
Tags / Label | Mailing City |
Tags / Variant | Default |
