DS

Progress

Barre de progression construite sur Radix UI Progress. Affiche visuellement l'avancement d'une tache ou d'un objectif. La barre utilise une animation translateX pour un rendu fluide.

Valeurs fixes

Barres de progression a differents niveaux de remplissage. Utile pour afficher le pourcentage d'algorithmes maitrises ou la progression dans un apprentissage.

0%
25%
50%
75%
100%

Animation

En controlant la valeur via un state, la barre s'anime grace a la transition CSS. Utile pour un chargement ou un upload en cours.

Progression0%

Props

PropTypeDefaultDescription
valuenumber | null0Valeur de progression entre 0 et 100. Si null, la barre est en etat indetermine.
maxnumber100Valeur maximale de la progression.
classNamestringClasses CSS additionnelles sur le conteneur. Par defaut : h-4, w-full, rounded-full, bg-secondary.