Callout components

A Callout component provides user interaction and collects user data.

The UI components are grouped into categories, based on their functionality, as follows:

Form Component Category	Description	Form Component
Basic	Contains the most used callout fields.	Text Field Text Area Number Checkbox Select Boxes Label/Header Drop-down List Radio Button
Advanced	Contains personal or period data.	HTML Element Content Url Date / Time Day Time Currency
Layout	Contains elements that alter the layout of the form.	Columns Panel Table

To create a custom callout, drag the desired UI components, drop them to the right side panel, and arrange them to the logic of your use-case.

Customizing Callout Components

Once you drop a callout component, a configuration wizard opens in the Callout Designer. The configuration wizard displays tabs that allow further customization for various functionalities. Check the progress in the preview pane of the wizard.

When you are satisfied with a component design, click Save.

The table below describes the settings available for the common configuration wizard tabs.

Wizard Tab	Description	Special Mentions
Display	In this tab, you configure the way the callout component is displayed.	The name you set in the mandatory Label field is passed as the PropertyName in the Field Key tab.
Data	In this tab, you configure a default value that end users see in the text field.	For components that can hold multiple items (e.g., Selectboxes, Tab), you define them in this tab.
Validation	In this tab, you configure validation requirements to enable other callout components.
Field Key	In this tab, you configure the component name you want to use further in the workflow.	By default, this value is passed from the Label field of the Display tab.
Conditional	In this tab, you configure conditions for the component.	You can set advanced conditions, such as Javascript or JSONLogic.
Logic	In this tab, you configure the logic that triggers the conditions.

Note:

• Not all callout components have all the configuration wizard tabs available.
• The Content Component is not available offline, because it needs to make a CDN call over the internet to load the Rich Text Editor.
• To add an image in the HTML Element component, convert the image to Base64 format.

Some callout components have specific tabs, for example:

Component	Wizard Tab	Description
Date / Time	Date	In this tab, you configure the minimum and maximum date available for selection.
	Time	In this tab, you configure the incremental step for hours and minutes.
Day	Day	In this tab, you configure the way the business user selects the day (incremental or from a drop-down list).
	Month	In this tab, you configure the way the business user selects the month (incremental or from a drop-down list).
	Year	In this tab, you configure the way the business user selects the year (incremental or from a drop-down list), and also the minimum and maximum year available for selection.

Managing Callout Components

To reopen the configuration wizard, hover over the callout component and click Edit.

To rearrange the callout components, click Move and drag the callout component to another location inside your callout.

To edit the callout component using its JSON settings, click Edit JSON. This opens the component JSON, that displays all the available settings.

To copy and paste a component inside the callout, click Copy and then click Paste below on the same component or on another one.

To remove a component from your callout, click Remove.