VisuallyHiddenNon officiel
Le texte lu par les technologies d'assistance et jamais peint : l'outil des messages de statut invisibles, et ce qui porte le sens des composants dont le visuel est fragmenté.
Utilisation
import { VisuallyHidden } from "@monstera/ui"Rien n'est encore annoncé.
Message de statut
Rien ne s'affiche quand on copie : un lecteur d'écran annonce « Numéro copié ». Le texte vit dans un élément en role=status, et c'est son changement qui déclenche l'annonce.
Accessibilité
Le texte est retiré de l'affichage sans être retiré de l'arbre d'accessibilité (boîte d'un pixel, rognée, hors du flux). Le kit s'en sert pour lire d'un seul tenant ce qu'il dessine en morceaux (CreditDetails, CreditChart) et pour dire « Rédaction en cours » sous les points du chat.
Dans une app, il sert aux messages de statut : poser un <VisuallyHidden role="status"> une fois, vide, puis y écrire le message quand l'action aboutit (« Copié », « Carte déverrouillée »). Un lecteur d'écran l'annonce sans déplacer le focus. Un message qui a aussi une forme visible passe par Toast ou Alert, qui portent déjà leur rôle.
À ne pas faire : cacher un élément interactif (il resterait atteignable au clavier sans être visible), ou remplacer un libellé visible par un texte masqué.
API
Prop
Type