# KPI Tile

A headline number with its label, an optional change and a caption.

## Add it to an app

1. Open the app builder and find **KPI Tile** in the component palette.
2. Insert it into the intended region or container.
3. Set its properties in the inspector. Use a literal for a fixed value or a binding for a value supplied by the app.
4. Connect its events where the app should respond to a user gesture.
5. Preview with representative data and save after resolving validation problems.

The type name in the builder’s code view is `kpi_tile`.

## Settings

| Setting | Accepted value | Required | Default | What it controls |
| --- | --- | --- | --- | --- |
| caption (`caption`) | string | No | "" | — |
| delta (`delta`) | string | No | "" | — |
| label (`label`) | string | No | "Metric" | — |
| value (`value`) | string | No | "—" | — |

## Values available to bindings

This component declares no published values. Use its settings and any events to configure its behaviour.

## Example: A starting configuration

| Setting | Example value |
| --- | --- |
| `caption` | "Across all queues" |
| `delta` | "+12 this week" |
| `label` | "Open tickets" |
| `value` | "128" |

## If it is empty or unavailable

Check the source binding, the selected item, and the app’s access. A hosted document, table, review, or storage component needs the corresponding app capability; an offline preview cannot supply live private data. A source running with no results is different from an invalid binding. Inspect the app’s workflow and data source before changing the presentation.