Seal
Sépare ce qu'une IA a proposé de ce qu'une personne a validé
Exemples
Validé et en attente
Validé par vous
Signé par C. Martin
En attente de votre validation
<twig:ui:Seal text="Validé par vous" by="guillaume" at="2026-10-12" atLabel="12 oct." />Sceau fraîchement posé
Validé à l'instant
<twig:ui:Seal text="Validé à l'instant" by="guillaume" fresh />Liste de propositions
Critère de jugement principal
Validé par vous
Critère secondaire
En attente
Population de l'étude
En attente
<twig:ui:Seal text="En attente" by="guillaume" state="pending" />Props
| Prop | Défaut | Rôle |
|---|---|---|
text | requis | Mention fournie par l'application |
by | requis | Qui signe ; la rosette en dérive |
at | null | Date ISO, rendue en `<time datetime>` |
atLabel | null | Texte lisible de la date |
label | null | Nom accessible complet |
state | validated | `validated` ou `pending` |
fresh | false | L'animation se produit une fois par session pour ce signataire et cet événement (`at`) |
size | 20 | Taille du sceau en pixels, typiquement 16 ou 20 |
path | null | Chemin SVG du signataire calculé côté PHP, présent dès le HTML initial (JS facultatif) |
Accessibilité
- Le sceau est role="img" avec un aria-label complet.
- L'état est porté par le texte, pas seulement par le filet pointillé.
- prefers-reduced-motion supprime le tracé d'apparition.