Avonni Components for Flows
Components for Experience CloudGet It on the AppExchange
Search
⌃K
Links
Comment on page

Formatted Name

Overview

The Avonni Formatted Name Component is designed to facilitate entering and displaying personal names in a standardized format. This component guides users through a structured input sequence, allowing them to provide various name components such as title, first name, middle name, last name, and suffix. As users enter information, the component validates and formats the data in real-time, ensuring a consistent and accurate name representation.

Changing the properties

Configuring the Avonni Formatted Name Flow Screen Component is a straightforward process that involves mapping Salesforce field values to the corresponding attributes of the component. Follow these steps to set up the component:
  1. 1.
    Label: Assign a custom label to the component above the formatted name fields.
  2. 2.
    First Name: Map the Salesforce field value for the first name to this attribute to pre-populate and store the user's first name.
  3. 3.
    Formal Name: If applicable, map the Salesforce field value for the formal name to this attribute to display the full name, including title and suffix.
  4. 4.
    Informal Name: Map the Salesforce field value for the informal name to this attribute to display the first and last names without title or suffix.
  5. 5.
    Last Name: Map the Salesforce field value for the last name to this attribute to pre-populate and store the user's last name.
  6. 6.
    Middle Name: Map the Salesforce field value for the middle name to this attribute to pre-populate and store the user's middle name, if applicable.
  7. 7.
    Salutation: Map the Salesforce field value for the greeting (e.g., Mr., Ms., Dr.) to this attribute to pre-populate and store the user's title.
  8. 8.
    Suffix: Map the Salesforce field value for the suffix (e.g., Jr., Sr., PhD) to this attribute to pre-populate and store the user's suffix, if applicable.

Adding interactions

Interactions define what will happen when users click on an action. You can find a list of interactions that are available here.
Here are the available Actions for the Formatted Name Component:
  • On Click

Specifications

Attributes

Name
Type
Description
Label
String
The Label for the Name
First Name
String
The Value for the first name
Format
Boolean
The format to display the name
Informal Name
String
The value of the informal name
Last Name
String
The value for the last name
Middle Name
Boolean
The value for the middle name
Salutation
Boolean
The value of the Salutation
Suffix
Boolean
The Value for the suffix

Avatar

Attribute
Type
Description
Variant
String
To change the shape of the Avatar
Initials
String
If the record name contains two words, like first and last name, use the first capitalized letter of each. For records with only a single word name, use the first two letters of that word using one capital and one lowercase letter.
Icon Name
​
The path to the image.
Size
String
The size of the avatar.
Image
String
The path to the image.
Presence Type
String
Presence of the user to display. Valid values include online, busy, focus, offline, blocked, and away.
Presence Position
String
The presence title will be shown as a tooltip hovering over the presence icon.

Events

No events are available

Styling Hooks

Container

Name
Description
Background Color
Define a text color for the title
Border Color
Define a font size for the title
Border Size
Define a font style for the title
Font Weight
Define a font weight for the title
Line Height
Define a line height for the title
Text Shadow
Define a text shadow for the title
Horizontal Alignment
Define a horizontal alignement for the title

Name

Name
Description
Text Color
Define a text color for the title
Font Size
Define a font size for the title
Font Style
Define a font style for the title
Font Weight
Define a font weight for the title
Line Height
Define a line height for the title
Text Shadow
Define a text shadow for the title
Horizontal Alignment
Define a horizontal alignement for the title

Label

Name
Description
Text Color
Define a text color for the title
Font Size
Define a font size for the title
Font Style
Define a font style for the title
Font Weight
Define a font weight for the title
Line Height
Define a line height for the title
Text Shadow
Define a text shadow for the title
Horizontal Alignment
Define a horizontal alignement for the title

Avatar

Name
Description
Text Color
Define a text color for the title
Font Size
Define a font size for the title
Font Style
Define a font style for the title
Font Weight
Define a font weight for the title
Line Height
Define a line height for the title
Text Shadow
Define a text shadow for the title
Horizontal Alignment
Define a horizontal alignement for the title
Last modified 4mo ago