Components / Metrics
Meter
How much of a quota or budget is used.
@fabrials/ui
Weekly quota
Resets Friday at 09:00
Session
Resets in 2 h 10 min
Monthly credits
Top up or wait for the reset
Installation
Import the control from
@fabrials/ui, after setting the app up.TypeScript import { Meter } from "@fabrials/ui";
API reference
| Prop / export | Type | Description |
|---|---|---|
value / min / max | number | The measurement. |
label / hint | ReactNode | What it measures and when it resets. |
warnAt / dangerAt | number | Percent thresholds for the warning and danger inks. |
Behavior
Use Progress for a task that finishes; Meter for a level that stays.
Accessibility
Keyboard and contrast
Keep visible labels, keyboard focus and status announcements when customizing. These components inherit your theme; maintain sufficient contrast in both color modes. The preview is keyboard operable.