ProgressBar

Stable

Barre de progression linéaire props-driven. Statut ok / near / over / neutral via tokens --color-envelope-*. A11y role=progressbar, prefers-reduced-motion.

import { ProgressBar } from "@lyra/tokens/components";

Playground

status="ok" — 62 %

62 %OK

status="near" — 88 %

88 %Proche limite

status="over" — 112 %

112 %Dépassé

status="neutral" — 45 % (sans label statut)

Démo interactive — réglages du playground (props ajustables en direct) à venir.

<ProgressBar
  value={0.62}
  status="ok"
  label="CELI utilisé"
  showStatus
/>

Documentation

ok (62%)
62 %OK
near (88%)
88 %Proche limite
over (112%)
112 %Dépassé
neutral (45%)

value, status, label, showStatus, height, animationDuration

<ProgressBar
  value={0.62}
  status="ok"
  label="CELI utilisé"
  showStatus
/>