# Celonis Product Documentation

##### KPI List
###### Overview
 Placement Create a new VieworProfile View Required KM objects KPI
###### Introduction to KPI List

The KPI list component should be used to display key performance indicators (KPIs) within your view. These can give users a quick overview of how they are tracking based on business-critical metrics. This KPI list can be used for only display purposes (non-interactive) or used interactively to set variables and dynamically update your other components in your view.

###### Basic KPI List configuration

To configure a basic KPI list, you must have at least the following features defined.

Attribute

Required

Type

Description

kpi

true

list of buttons

References a KPI(s) from the Knowledge Model that the user wants to include in their KPI List.

show

true

Boolean

Defines if a KPI should be hidden or not. It gets auto-generated as "true" if not defined. The lowest number is displayed on the left side.

id

true

String

Defines a unique identifier for the field. It gets auto-generated if not defined. It is important in the context of Base and Extension.

order

true

Integer

Defines the order of the KPI list. Gets auto-generated if not defined. It is important in the context of Base and Extension.

### Info

optimized for component editor

View

id: kpi-list-6c831052-b9f2-47b3-be43-6344c88cbb89
type: kpi-list
settings:
data:
kpis:
- kpi: TOTAL_NUMBER_OF_INVOICES
show: true
id: id100

Since the KPI List contains many different configuration options, we have broken this section down into:

### Info

optimised for component editor

View

id: kpi-list-b3c3f7c4-d440-49b8-9735-c9174e469b76
type: kpi-list
settings:
options:
size: sm
showSettings: true
showBenchmark: true
showTarget: true
showPriority: true
sortBy: order
sortDirection: ASC
styles:
overflow: line-break
position:
horizontal: center
vertical: center
data:
selectedKpi: TOTAL_NUMBER_OF_INVOICES
kpis:
- kpi: TOTAL_NUMBER_OF_INVOICES
show: true
displayContentRule: KPI_DISPLAY_RULE
id: 5d17010a-1818-48cd-9242-27f63c4d04a5
order: 200
- kpi: TOTAL_NUMBER_OF_INVOICES_2
show: true
displayContentRule: KPI_DISPLAY_RULE
id: 989ce3d4-fa5f-4fb8-8912-234a4e727bcc
order: 100
- kpi: TOTAL_INVOICE_VALUE
show: true
id: 5d17010a-1818-48cd-9242-27f63c4d04a5
order: 300
kpiParams:
- id: TOTAL_INVOICE_VALUE
value: ${currency} onClick: update: variables: id: BOARD_INPUT_FOR_ID name: BOARD_INPUT_FOR_NAME "Options" configuration options The options sections contain all general settings which apply to the entire KPI List. Please find below an overview of the different configuration options: ### Info optimized for component editor id: kpi-list-b3c3f7c4-d440-49b8-9735-c9174e469b76 type: kpi-list settings: options: size: sm showSettings: true showBenchmark: true showTarget: true showPriority: true sortBy: order sortDirection: ASC data: selectedKpi: TOTAL_NUMBER_OF_INVOICES kpis: - kpi: TOTAL_NUMBER_OF_INVOICES show: true id: 5d17010a-1818-48cd-9242-27f63c4d04a5 order: 200 - kpi: TOTAL_NUMBER_OF_INVOICES_2 show: true id: 989ce3d4-fa5f-4fb8-8912-234a4e727bcc order: 100 Attribute Required Type Possible values Default Value Description size false Boolean sm lg non-interactive: small interactive: large Defines the font size of the KPIs. View with large KPIs: View with small KPIs: showSettings false Boolean true false false Defines if a setting modal will be displayed for the KPI List in the user interface of the view. From this setting's modal, users can specify target values, re-order the KPIs, and hide/show KPIs in their view. ### Note The target is set and stored for the KPI itself, it will be reflected in all components where the KPI is used in. KPI List with setting's modal enabled: KPI setting's modal: showTarget false Boolean true false true Defines if target information is displayed. Target information will only be displayed if the data is available. A red/green icon will display next to this target based on how you are currently tracking towards your target. ### Note Target values can only be set in the settings modal from the component user interface. To enable the interface set showSettings: true and click on the gear icon. The target is set and stored for the KPI itself, it will be reflected in all components that the KPI is used in. showBenchmark false Boolean true false true Defines if benchmark information is displayed. Benchmark information will only be displayed if the data is available. Benchmarking details can be specified for each individual KPI in the Knowledge Model. shorwPriority false Boolean true false true Defines if priority information is displayed. Priority information will only be displayed in the data is available. ### Note Priority selection can only be set using the priority switcher tool and must be first added to your view to use it. Details on how to set this up can be found here. KPI List with priority enabled: sortBy false Boolean value name order order Defines what method the KPI list should be sorted based on. Sorting options include: • Order: KPIs are listed by the order in which they are listed in the editor • Name: KPIs are listed in alphabetical order based on the KPI name • Value: KPIs are listed in order numerically based on the KPI value sortDirection false Boolean DESC ASC ASC Defines the sorting direction of the KPIs based sorting method defined above. ###### "Data" configuration options The field sections contain all KPI-specific settings. Please find below an overview of the different configuration options: ### Info optimised for component editor id: kpi-list-b3c3f7c4-d440-49b8-9735-c9174e469b76 type: kpi-list settings: data: selectedKpi: TOTAL_NUMBER_OF_INVOICES kpis: - kpi: TOTAL_NUMBER_OF_INVOICES show: true displayContentRule: KPI_DISPLAY_RULE id: 5d17010a-1818-48cd-9242-27f63c4d04a5 order: 200 - kpi: TOTAL_NUMBER_OF_INVOICES_2 show: true displayContentRule: KPI_DISPLAY_RULE id: 989ce3d4-fa5f-4fb8-8912-234a4e727bcc order: 100 - kpi: TOTAL_INVOICE_VALUE show: true id: 5d17010a-1818-48cd-9242-27f63c4d04a5 order: 300 kpiParams: - id: TOTAL_INVOICE_VALUE value:${currency}

Attribute

Required

Type

Possible values

Default Value

Description

selectedKpi

false

KPI

-

-

References a KPI which should be selected up-on page load.

onClick

update:

variables:

id:

false

-

-

You can use a KPI list to update a variable when clicking the KPI. After your KPI has an onClick event enabled, it will be displayed as an interactive tile.

kpis

false

List of KPIs

-

-

Requires a list of KPIs you would like to configure.

displayContentRule

false

String

-

References a Display Rulein the Knowledge Model

### Note

This configuration option is currently only currently available for interactive KPI List.

kpiParams

false

-

-

-

Allows defining Parameters that are also used in the Knowledge Model. More details on how to set a KPI parameter in the KPI can be found here .

id

false

String

-

-

Define the ID value of the parameter defined

### Note

The KPI Parameter ID value record in the view must match KPI parameter ID defined in KM to work correctly.

value

false

Views Variables

-

-

Defines the value of the parameter that will be passed from the knowledge model.

### Note

This value should be defined using a variable with the input coming from e.g. a dropdown component.

trend: timedimension: range:

Defines if a general trend marker should be displayed on the KPI List component. The general trend marker displays the percentage of change in the KPI value (also known as slope). You must define the time dimension (i.e. invoice date, closing date, etc.) and range (daily, weekly, monthly, or yearly) that the trend is calculated over. Once these are defined, a badge will be added to show the average increase or decrease per time period defined.

###### "Styles" configuration options

The styles sections contain all settings you can use to style the KPI List component. Please find below an overview of the different configuration options:

### Info

optimized for component editor

id: kpi-list-b3c3f7c4-d440-49b8-9735-c9174e469b76
type: kpi-list
settings:
styles:
overflow: line-break
position:
horizontal: center
vertical: center
data:
kpis:
- kpi: TOTAL_NUMBER_OF_INVOICES
show: true
id: 5d17010a-1818-48cd-9242-27f63c4d04a5
order: 200
- kpi: TOTAL_NUMBER_OF_INVOICES_2
show: true
id: 989ce3d4-fa5f-4fb8-8912-234a4e727bcc
order: 100
- kpi: TOTAL_INVOICE_VALUE
show: true
id: 5d17010a-1818-48cd-9242-27f63c4d04a5
order: 300



Attribute

Required

Type

Possible values

Default Value

Description

styles

false

overflow

false

Boolean

line-break

scroll

full-width

full-width

Defines the orientation of the KPI list component when the width of the selected KPIs exceeds the given component container size.

• full-width: KPIs will be condensed to fit component width

• line-break: KPIs will be broken across separate lines vertically to fit within the given component container size.

• scroll: KPIs will be displayed

position

false

Defines the position of the KPI list

horizontal

false

Boolean

center

full

left

right

full

Defines the horizontal position of the component within its layout

Left aligned:

Center aligned:

Right aligned:

vertical

false

Boolean

top

bottom

center

bottom

Defines the vertical position of the component within its layout