Indicateur visuel de statut avec couleur et icône associées. Utilisé pour communiquer l'état d'un système, service ou entité. Supporte 4 états prédéfinis avec possibilité de personnaliser le libellé.
Aperçu
les 4 statuts — labels par défaut
status="active"Active
status="inactive"Inactive
status="pending"Pending
status="error"Error
labels personnalisés
active — label personnaliséService opérationnel
inactive — label personnaliséHors ligne
pending — label personnaliséDéploiement en cours
error — label personnaliséÉchec de build
Props
Prop
Type
Défaut
Requis
Description
status
"active" | "inactive" | "pending" | "error"
—
✓
Statut à afficher. Détermine la couleur et l'icône associée au label.
label
string
—
—
Texte personnalisé du label. Si omis, le composant utilise le libellé par défaut associé au statut.
Utilisation
tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
import { StatusLabel } from "@brickslab/ui-web";
// Les 4 statuts avec labels par défaut
<StatusLabel status="active" />
<StatusLabel status="inactive" />
<StatusLabel status="pending" />
<StatusLabel status="error" />
// Labels personnalisés
<StatusLabel status="active" label="En ligne" />
<StatusLabel status="inactive" label="Hors ligne" />
<StatusLabel status="pending" label="En attente de validation" />
<StatusLabel status="error" label="Échec de connexion" />
