Content
Le bloc centré d'un écran d'état : une icône, un titre, une description, puis de quoi rebondir. Tous ses morceaux sont des emplacements où l'on glisse d'autres composants du kit.
Utilisation
import { Content } from "@monstera/ui"Gérez vos comptes d'un seul endroit
Retrouvez tous vos crédits et vos paiements sur le même écran.
Bloc complet
Le badge se pose au-dessus du titre, pas à côté. Le bouton passé en action est étiré sur toute la largeur du bloc, le lien reste à sa taille.
Une erreur est survenue
Votre demande n'a pas pu aboutir. Reprenez dans quelques instants.
Variante danger
La variante danger passe le titre en rouge et resserre l'écart sous l'icône. Elle ne touche pas à l'icône, qui garde la couleur qu'on lui donne.
Aucun document
Vos justificatifs apparaîtront ici une fois déposés.
Sans action
Sans bouton ni lien, la zone d'actions n'est pas rendue du tout : le bloc s'arrête à sa description, sans vide en dessous.
Accessibilité
Le titre est un vrai titre, de niveau 2 par défaut, réglable par headingLevel.
API
Prop
Type
ClickableList
Une rangée cliquable qui mène ailleurs : une tête facultative, un libellé, un chevron. C'est un bouton, pas un lien, et il s'étire sur toute la largeur qu'on lui laisse.
Divider
Le trait de séparation : 1 px de haut, la largeur de son conteneur. Statique, sans interaction, annoncé comme separator.