Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Field

Attributes

Description

Record Object

This represents the object for which the configuration is created. The object is already selected for record page type, as it was chosen during the initial configuration.

info

Note: This field is disabled if the user selects 'Non-

Record

Page' in the configuration.

Record to Preview

This feature allows users to select an object record to see how the progress bar Visual Picker will appear in the preview section after making changes.

info

Note: This field is not available if the user selects 'Non-Record Page' in the configuration.

  • This allows you to choose a

specific
  • picklist and multi picklist field from the selected

object in the Record
  • object

option
  • . The chosen field value will be used to map the Visual Picker items.

info
Note:
  • Users can only select fields with the following data types: picklist, multi-picklist, and checkbox.

Item

This option allows you to create different types of visuals for each value of the selected picklist field from the Field optionvalue. You can create items as images, text, or icons.

Info

Label

  • This option allows you to assign a title to the Visual Picker.

  • You can select the title from various sources, includingrecord field values, custom settings, and custom metadata.

Info

Reference: Label Value Source

Size

This option allows you to select the size of the Visual Picker component, such as Large, Medium, or Small.

Is Coverable

"The 'Is Coverable' checkbox allows the Visual Picker item to be covered with a check mark."user to cover the entire element with a checkmark after clicking on it.

Hide Footer

The 'Hide Footer' checkbox allows the user to hide the footer of the Visual Picker item.

Padding Location

  • It is used to create space around an element's content.

  • You can set the padding location for Visual Picker Group as:
    Around, Top, Bottom, Left, Right, Horizontal, Vertical.

Padding Size

You can set the padding Size for Visual Picker Group as:
XXX Small, XX Small, X Small, Small, Medium , Large, X Large.

Margin Location

  • It is used to create space from outer edge of an element's content.

  • You can set the Margin location for Visual Picker Group as:
    Around, Top, Bottom, Left, Right, Horizontal, Vertical.

Margin Size

You can set the Margin Size for Visual Picker Group as:
XXX Small, XX Small, X Small, Small, Medium , Large, X large.

Label Value Sources:

...

You can add conditions with values based on various sources, such as:

Label Attributes

Description

Value Source

It provides list of various value sources for assigning the value for label.

Info

Note: By default the value source is selected as static.

Description

Custom Metadata

Use custom metadata records to assign values.

Custom Settings

Use custom setting records to assign the values.

Record Field

Use a record value from a selected Record Object.

info

Reference: Record Object.

Static

You can provide a static fixed value.

Value Type

This field is read-only and diplays the type of fields as text.

Image Configuration:

...

Attributes

Description

Value

This option allows you to bind the icon with field value.

info

Note: This contains the values from the field selected while configuring the component.

Type

Select type of item such as

  • Image

  • Text

  • Icon

Image URL

Provide the URL of the image that should be accessed directly, which will display the image for the selected value.

Footer Header

This option allows you to show content in the item header.

Footer Content

This option allows you to show content in the item footer.

Visible

This option allows you to control the visibility of the item.

Disable

This option allows you to control the disability of the item.

Text Configuration

...

Attributes

Description

Value

This option allows you to bind the icon with field value.

info

Note: This contains the values from the field selected while configuring the component.

Type

Select type of item such as

  • Image

  • Text

  • Icon

Text

This option allows you to design the text for the selected value using the Rich Text Editor.

Footer Header

This option allows you to show content in the item header.

Footer Content

This option allows you to show content in the item footer.

Visible

This option allows you to control the visibility of the item.

Disable

This option allows you to control the disability of the item.

Icon Configuration

...

Attributes

Description

Value

This option allows you to bind the icon with field value.

info

Note: This contains the values from the field selected while configuring the component.

Type

Select type of item such as

  • Image

  • Text

  • Icon

Icon

This option allows you to select a value from the dropdown.

Footer Header

This option allows you to show content in the item header.

Footer Content

This option allows you to show content in the item footer.

Visible

This option allows you to control the visibility of the item.

Disable

This option allows you to control the disability of the item.

Visibility

In this section, you can control the visibility of items (e.g., image, text, icon) by choosing one of the following options:

...

Panel
panelIconId1f5e8
panelIcon:speech_left:
panelIconText🗨️
bgColor#F4F5F7

For example, You can add conditions to make an image item visible whenever the account type is 'Prospect.' You can also add multiple conditions with custom logic such as 1 OR 2 AND 3:

  • AND: Execute if all specified conditions are true.

  • OR: Execute if at least one of the specified conditions is true.

...

Disability

In this section, you can control the disability of items (e.g., image, text, icon) by choosing one of the following options:

...

Panel
panelIconId1f5e8
panelIcon:speech_left:
panelIconText🗨️
bgColor#F4F5F7

For example, You can add conditions to make an image item disable whenever the account type is 'Prospect.' You can also add multiple conditions with custom logic such as 1 OR 2 AND 3:

  • AND: Execute if all specified conditions are true.

  • OR: Execute if at least one of the specified conditions is true.

...

...

Note: You can add conditions with values based on various sources. Check the Value Sources section for more information

...

bgColor#FFF0B3

...

.