Celonis Product Documentation

buttons

Yes

List of buttons

-

-

Requires a list of buttons the user would like to include. Each button should have at least the label or icon defined to correctly show in view. Details on these and the other object configurations can be found below.

label

No

String

-

-

Defines the description text that will be shown on the button. Try to keep the button's label short and precise. In the example below, the buttons are defined with the labels "Open Invoice", "Past Due", and "High Priority"

icon

No

String

-

Defines the icon that will show on the button. This visual element can help users to understand the underlying action of the button.

size

No

Enum

small

large

large

Defines what size you would like your buttons to show in the view.

variant

No

Enum

neutral

primary

info

danger

neutral

Defines the button's visual appearance. It is recommended to use a fitting variant to the use case, e.g. buttons that lead to deletions should be of variant danger to make sure that your business users receive visual cues on the underlying action.

onClick

No

Defines the underlying action of a button

onClick: 

navigateTo: 

url: 

assetkey:

No

String

-

Defines if a link should be added to the button. Can be another Celonis View or any external URL. 

YAML example:

id: button-external-link
type: button-list
settings:
  buttons:
    - label: Celonis Website
      id: f825e378-e2bd-43eb-8c10-e6857fa33d34
      order: 100
      onClick:
        navigateTo:
          url: https://www.celonis.com/
          openInNewTab: true
          assetkey: automatically_generated

When Linking to another Celonis view, you can simply copy and paste the View URL. Additionally, 

Assetkey: This is generated automatically whenever you link to another Celonis View, ensuring that the correct internal references are used in your configuration. If you're linking to an external URL, this key is not generated and should not be manually added.

openInNewTab

No

Boolean

true

false

Defines if the linked URL should be opened in a new tab or not. 

placeholders

No

List of fields

-

Defines the required placeholders in the external URL link

YAML example:

id: button-external-link
type: button-list
settings:
  name: Celonis Website
  buttons:
    - label: Celonis Website
      onClick:
        navigateTo: 
          url: https://www.celonis.com/de/{0}/{1} 
          openInNewTab: true
          assetkey: automatically_generated
          placeholders: #Defines the required placeholders
            - field: NUMBER_OF_SOLD_PRODUCTS_EX
            - field: INVOICE.PRODUCT_NAME

update

variable:

- name: variable1

- name: variable2

No

-

You can use a button to update a variable when clicking the button.

executeSkill

skillKey: button

variables:

- name: value1

- value: ${value1}

No

Defines if clicking the button should trigger a defined skill.

YAML example:

id: button-skill
type: button-list
settings:
  name: Trigger Skill
  buttons:
    - icon: product-workflows
      label: Trigger
      onClick:
        executeSkill:
          skillKey: button-test
          inputs:
            - name: value1
              value: ${value1}

routerLink

No

String

-

Defines if clicking the button should open another asset using a router link. router links allow you to navigate to different views without reloading the current view.

To open a router link, copy the portion of the asset's URL display after "package-manager/" and paste into the routerLink configuration. To define if you want the user to be directed to the view in the Studio or Apps, you can edit the first part of the link shown below:

Studio Link: /ui/studio/ui/...

Views Link: /ui/views/ui/..

YAML example:

id: button-router-link
type: button-list
settings:
  name: Navigate through router link
  buttons:
    - icon: kpi
      label: Check KPI Bowler
      onClick:
        routerLink: /ui/studio/ui/package/6f104d9f-3661-4962-bbc7-26b1abf60d0f/workbench-assets/ce4e3a7d-2373-409d-bf03-9d40fcf92c83
        assetkey: automatically_generated

openView

No

-

Defines the view that will open onClick. You can link a Profile View (using the knowledgeObjectID) or any other view (using the viewKey)

KnowledgeObjectID

No

Defines the Profile View the user wants to link to the button using the Knowledge Object ID / Record ID for which the registered default profile view is then opened. Click here to learn how to create a Profile View. Click here to learn more about View Variables.

The record must have an identifier defined in the Knowledge Model to use properly.

YAML example:

id: button
type: button-list
settings:
  name: Open a Profile View (of type Activity)
  buttons:
    - icon: product-workflows
      label: Activity View
      onClick:
        openView:
          viewKey: VIEW_KEY #Reference the key of the Profile View
          assetkey: automatically_generated
          variables: #Below some optional settings to carry variables to the view key
                - name: Variable name
                  value: 20
          carryFilters: false
          carrySelections: false

viewKey

No

String

Defines the view the user wants to link to the button using the View's Key.

YAML example:

- id: "kpi-button-list"
  type: "button-list"
  settings:
    type: "default"
    buttons:
    - label: "Detailed Risk Overview"
      variant: "primary"
      size: "large"
      icon: "info"
      block: true
      onClick:
        openView:
          viewKey: "Risk-Overlay"
          assetkey: automatically_generated
          openInSideOverlay: true
          carryFilters: true
          carrySelections: true

openInSideOverlay

No

Boolean

true

false

syncFilters

No

String

forward-only (default)

backward-only

disable

both-ways

Defines if filters should be carried from the current view to the linked view. This will apply to all filters applied to the view (i.e. applied from dropdowns, quick-filters, table, charts, etc.)

Forward: Filters set on the main View and filters set on the component that is opening the linked View, will be immediately applied to the linked View.

Backward:Filters set in the linked view will be immediately applied back to the main view. 

Both-ways: Filters set on the linked View are immediately applied to the main View and filters set on the main View are immediately applied on the linked View.

Note that filters set on the component that is opening the linked View, will only be applied forward.

Disabled: No filters are carried to or from linked views. 

carrySelections

false

Boolean

true

false

Defines if table selections should be carried from the current view to the linked view. This should only be enabled if both your current and linked view contain table components.

variables

- name: value1

- value: ${value1}

false

-

-

Defines a list of variables from your base view that you like to utilize in your linked view.

size

No

Enum

small

large

large

Defines what size you would like your buttons to show in the view.

orientation

No

Enum

vertical

horizontal

false

Defines whether the list of buttons should be displayed in a vertical or horizontal format.

Vertical:

Horizontal:

type

No

Enum

group

default

default

Buttons can be of type group or default. Using type: group allows to place different buttons next to each other.

Grouped Buttons: 

styles

No

Defines the different styles you can apply to the component.

overflow

No

Enum

full-width

line-break

scroll

full-width

Defines the overflow behavior that happens when the button list size is larger than the defined component size in the layout.

position

No

Defines that the position of the component within the given layout.

horizontal

No

Enum

full

left

center

right

full

Defines the horizontal alignment position within the given layout.

vertical

No

Enum

top

center

bottom

bottom

Defines the vertical alignment position with the given layout.