KQ-536 · QUOTA/METER
Quota Meter
A segmented quota meter whose bars fill left to right in a cascade() on glide, because a quantity settles rather than switches. Crossing warnAt tints the track warn and flashes the leading segment once, and usage past the limit opens a danger lane beyond the track's end while the track glides aside to make room. It is a role=meter carrying the overage in aria-valuetext, so the reading is spoken even though the rolling digits are decorative.
KQ-536 · QUOTA/METER
Gaugeworks storage / 250 GB
Within quota
Using 120 of 250 GB
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/quota-meter
Props
- used
- number
- default —
- Current usage in unit. May exceed limit — the overage is drawn past the track's end.
- limit
- number
- default —
- The quota the track represents.
- warnAt
- number
- default 0.8
- Fraction of the limit at which the meter turns warn and flashes its leading segment.
- unit
- string
- default "GB"
- Unit label printed after both numbers and spoken in the value text.
- label
- string
- default —
- What is being measured; names the meter for assistive technology.
- segments
- number
- default 16
- Bars in the track; the cascade tightens automatically as the count grows.
| Prop | Type | Default | Description |
|---|---|---|---|
| used | number | — | Current usage in unit. May exceed limit — the overage is drawn past the track's end. |
| limit | number | — | The quota the track represents. |
| warnAt | number | 0.8 | Fraction of the limit at which the meter turns warn and flashes its leading segment. |
| unit | string | "GB" | Unit label printed after both numbers and spoken in the value text. |
| label | string | — | What is being measured; names the meter for assistive technology. |
| segments | number | 16 | Bars in the track; the cascade tightens automatically as the count grows. |