Usage Meter

Default

Under 30 units each pip is exactly one unit, so 9 of 24 is literally 9 lit pips. label names the count — it is appended to the readout, never a replacement for it.

Sizes

sm tightens the pip height and the gutter together, so the two measurements cannot disagree.

Tones

The tone lands on the root as a text colour and every lit pip paints from currentColor. The caption keeps its own foreground colours in every tone.

Over quota

Past the allowance every pip fills, the row turns destructive whatever tone was asked for, and the percentage appears — the caption row is drawn even without a label.

Large quotas and no quota

Above 30 units each pip becomes a bucket of max / 30 and the readout carries the exact figure. A quota of zero is treated as no quota: the row stays dark and the meter degrades to role="img" so nothing announces a fake percentage.

Pips only

With no label and an unspent allowance the caption row is omitted entirely; give the meter an srLabel so it still has a name.

Ticks

variant="ticks" draws fixed-width ticks with the readout inline after them, for a seat count in a dialog footer. The readout follows the pips rule — shown with a label or when over quota — and wraps under the strip in a narrow column.

Bar

variant="bar" is one line broken by an inline caption, for a quota tile that already shows the figures. label is the suffix after the percentage and defaults to "used". With no quota the caption states the count instead.

Props