ComponentsDisplay
Progress
Linear progress bar accepting a 0 to 1 value or null for indeterminate state, with semantic tone tokens and configurable height.
Progress is a horizontal progress track. Pass a normalised value between 0 and 1 for determinate progress, or omit the value (or pass null) for an indeterminate placeholder. Values outside the range are clamped automatically.
Import
import { Progress } from '@mindees/ui';
Usage
<Progress value={0.42} tone="primary" />
<Progress value={null} />
<Progress value={1} tone="success" height={4} />
Props
| Prop | Type | Default | Description |
|---|---|---|---|
value | number | null | — | Progress in the range 0 to 1. Clamped to [0, 1]. Pass null or omit to render an indeterminate 30%-wide fill. |
tone | 'primary' | 'success' | 'warning' | 'danger' | 'primary' | Fill colour pulled from semantic tokens. |
height | number | 8 | Track height in dp. The border radius is automatically half the height. |
Accessibility
The track uses accessibilityRole="progressbar". Determinate values are reported via accessibilityValue as { now, min: 0, max: 100 } (rounded percent). Indeterminate progress reports { text: 'Loading' }.