Header with Actions
It helps users orient themselves within the platform and provides an introduction to the current page. Replaces the Header component.
Properties
Title string
Add the value of the title item. This can be a variable or a fixed value.
Divider boolean
Select to show divider of the page header.
Avatar Image string
Add the variable where your image is stored
See also Avatar
Avatar Initials string
This component will take the initial letters of a variable or an expression (up to three initials). If you add a single string, it will take only the first letter of each word. This will be a fallback if the image is not.
Avatar Icon enum
Select an icon to be added to the item. This will be a fallback if the image is not found and no initials have been added.
Back Button boolean
Add a back button on top of the header. This button will go to the URL defined in the field Back Button URL.
Avatar Initials string
This component will take the initial letters of a variable or an expression (up to three initials). If you add a single string, it will take only the first letter of each word. This will be a fallback if the image is not.
Avatar Icon enum
Select an icon to be added to the item. This will be a fallback if the image is not found and no initials have been added.
Back Button boolean
Add a back button on top of the header. This button will go to the URL defined in the field Back Button URL.
Back Button URL string
URL where the back button will lead the user to.
Go Back Button Label string
Label for the Back Button.
Primary Label string
Label for the Back Button.
Secondary Label string
Add the value of the secondary label, shown in regular font below the value of the component.
Link Value string
Add the text you will see in the link to be shown below the title. This can be a variable or a fixed value.
See also Link
Link URL string
Add the URL for Link Value.
Link Icon enum
Select the icon to be shown in the left-hand side of the link value.
Chip Value string
Add the value of the chip item. This can be a variable or a fixed value.
See also: Chip
Status Mapping table
Map the variables with the expected chip style.
| Name | Type | Description |
|---|---|---|
| Status value | "string", "variable", "expression" | Value to match with the component status value. |
| Label | "string" | multilanguage | Label for the value. |
| Status variant | "ENUM ("success", “info”, “warning”, “danger”, “neutral”, “grey blue”, “vermilion”, “orange”, “grass”, “brownie”, “sky”, “purple”)" | Variant for the value. |
Header Action Value string
Add the expression for the header actions. This will change according to the selected action.
Actions string
Add a JSON with the array of actions of a page. The component will handle how to show them (button or modal) according to the elements quantity.
Updated 16 days ago