Badge
L'étiquette qui qualifie un élément : un statut, une catégorie. Elle affiche, elle ne se clique pas.
Utilisation
import { Badge } from "@monstera/ui"PayéEn coursÀ vérifierRejetéClôturéNouveau
Tons
Six tons, du succès à l'accent. Le ton pilote à la fois le fond, le texte et la puce, qui reprend la couleur du texte.
FilledGhostFilledGhost
Variantes
Filled pose un fond teinté, ghost garde la seule couleur du texte et se fond dans son support.
Small
Tailles
Medium (24 px) par défaut, c'est la taille de lecture confortable. Small (16 px) est un format contraint, pour une cellule de tableau ou un badge glissé dans un paragraphe : la maquette ne lui donne pas d'emplacement d'icône, il ne porte que la puce et le libellé.
ActifActif
Puce et libellé
La puce et le libellé sont indépendants. Un badge réduit à sa puce reste valide et sert de simple témoin d'état.
API
Prop
Type