kpis

One to eight figures side by side, each with a label, such as open tickets, agents working and median first reply.

Each of tiles reads one source of the screen and computes one figure: count (the rows), sum or avg of a number column, value (the first row's cell) or text (the first row's cell, as written). format writes it: number, usd ($6,140), percent (22%), duration (seconds as 4m 12s) or bytes. caption is a line under the figure, badge a short word beside it, and tone (neutral, ok, warn, bad, info) says whether the figure is good news. Every column but a count is required.

When to use

Use it when

The few figures a person checks first on a screen, such as the queue's open tickets and who needs a person.
A month's totals, such as metered results and cost per closed ticket.
Counts of rows a screen already reads, such as tickets waiting for approval.

Use another block when

One figure against a limit, such as the yearly cap used.
Use progress
A figure over time, such as tickets closed per hour.
Use chart
The rows behind the figures.
Use grid

The queue right now

Open

214

Agents working

131

Need a person

Median first reply

4m 12s

kpis:
  tiles:
    - { label: Open, source: summary, figure: value, column: open }
    - { label: Agents working, source: summary, figure: value, column: agents_working }
    - { label: Need a person, source: summary, figure: value, column: needs_person, tone: warn }
    - { label: Median first reply, source: summary, figure: value, column: first_reply_s, format: duration }

<a id="kpis-1"></a>

- Open: 214
- Agents working: 131
- Need a person: 27
- Median first reply: 4m 12s

This month's cost

Metered results

$6,140

so far this month

Cost per closed ticket

$1.28

all-in

Closed without a person

61%

kpis:
  tiles:
    - { label: Metered results, source: month, figure: value, column: metered_usd, format: usd, caption: so far this month }
    - { label: Cost per closed ticket, source: month, figure: value, column: cost_per_ticket_usd, format: usd, caption: all-in }
    - { label: Closed without a person, source: month, figure: value, column: no_person_pct, format: percent, tone: ok }

<a id="kpis-1"></a>

- Metered results: $6,140 (so far this month)
- Cost per closed ticket: $1.28 (all-in)
- Closed without a person: 61%

Orders waiting for approval

Waiting for approval

today

Value waiting

$1,770

kpis:
  tiles:
    - { label: Waiting for approval, source: pending, badge: today }
    - { label: Value waiting, source: pending, figure: sum, column: amount_usd, format: usd, tone: info }

<a id="kpis-1"></a>

- Waiting for approval: 2 [today]
- Value waiting: $1,770

States

ready
the source's rows, drawn
empty
the source has no rows: an Empty part saying so
error
the source failed: the block shows the source's sentence; the page still answers 200

This block offers no actions; it only shows.

JSON Schema