Status Indicators
Indicateurs d'état opérationnel pour les services et APIs. Dot coloré + label.
Démo — 4 états
API ProductionOpérationnel
Service de scoringLatence élevée
Service KYBIndisponible
Environnement betaNon déployé
Usage
html
<BcStatusDot tone="success" label="API Production — Opérationnel" />
<BcStatusDot tone="warn" label="Service de scoring — Latence élevée" />
<BcStatusDot tone="danger" label="Service KYB — Indisponible" />
<BcStatusDot tone="idle" label="Environnement beta — Non déployé" />
<!-- Avec pulse animé -->
<BcStatusDot tone="success" label="En ligne" :pulse="true" />
<!-- Taille petite -->
<BcStatusDot tone="warn" size="sm" label="Dégradé" />Props
| Prop | Type | Défaut | Description |
|---|---|---|---|
| tone | 'default' | 'success' | 'warn' | 'danger' | 'info' | 'online' | 'warning' | 'offline' | 'idle' | 'default' | Couleur sémantique |
| label | String | '' | Texte affiché à droite du dot |
| size | 'sm' | 'md' | 'md' | Taille du dot |
| pulse | Boolean | false | Animation pulse (statut actif) |
Mapping tone → visuel
| Tone | Dot | Couleur |
|---|---|---|
| success / online | ● vert | #22c55e |
| warn / warning | ● orange | #f97316 |
| danger / offline | ● rouge | #dc2626 |
| info | ● bleu | var(--bc-blue) |
| default / idle | ● gris | #d1d5db |