Composants Rails ViewComponent pour le Système de Design de lʼÉtat
Modal
La modale permet de concentrer l’attention de l’utilisateur exclusivement sur une tâche ou un élément d’information, sans perdre le contexte de la page en cours. Ce composant nécessite une action de l’utilisateur afin d’être clôturée ou ouverte.
La modale par défaut permet de mettre en évidence une information qui ne nécessite pas d’action de l’utilisateur.
Les modales s’affichent suite à un clic sur un bouton qui possède l’attribut aria-controls correspondant à l’identifiant de la modale ET l’attribut data-fr-opened à false.
La modale peut s’afficher ouverte dès le chargement de la page grace à l’option opened: true.
Cela permet notamment de rendre compatible cette modale avec un système comme Turbo Drive et de développer une application progressive, qui marchera avec ou sans JS.
Il faut pour cela bien penser que les boutons de fermetures natifs des modales ne fonctionneront pas dans ce cas (sans JS).
On peut donc par exemple utiliser des liens de navigation dsfr_link_to plutôt que des boutons.
De la même manière, il faut aussi bien penser à modifier le bouton du header par un lien en utilisant le slot header.