DSFR v1.15.0

🎉 AJOUT, ✨ ÉVOLUTION, 🐛 CORRECTIF, 🚫 SUPPRESSION
💥 BREAKING CHANGE : les changements de la structure HTML sont indiqués par cette icône, en gras, et souligné

Note

Le code du DSFR compilé n'est plus disponible en téléchargement direct via les releases GitHub. Les utilisateurs devront importer le package via NPM dans leur projet ou cloner le dépôt GitHub et compiler les sources. Les instructions d'installation sont disponibles dans la documentation du projet. Cette mesure vise à s'assurer que tous les utilisateurs acceptent les conditions d'utilisation avant d'utiliser le DSFR, conformément aux exigences légales et de gouvernance du projet.

Global

• 🎉 Ajout de conditions générales d’utilisation au build du projet #1346
• 🎉 Ajout de l’icône arrow-right-down-circle qui avait été retirée par erreur #1383

Core

• 🐛 Retrait du red-marianne des classes utilitaires de couleur, de background, et de bordure, leur utilisation n’étant pas autorisée. #1385
• 🐛 Correction de sécurité — Injection inline des pictogramme sur IE11 #1422
  • Le chargement de SVG inline a été sécurisé : les SVG sont désormais sanitizés avant insertion dans le DOM et le chargement est restreint à la même origine.
  • Impact : si vos pictogrammes SVG sont hébergés sur un domaine ou CDN tiers, ils ne seront plus chargés sur IE11. Rapatriez-les sur la même origine que votre application.
• 🐛 Corrige les espaces dans le CSS généré par la fonction Sass space dans les modules Sass #1444

🧩 Composants

• 🐛 Passe le type du bouton de la recherche à "submit" dans les exemples, la doc, et storybook puisque la barre de recherche est généralement intégrée au sein d'un formulaire #1432

Boutons FranceConnect et ProConnect - connect

• 🎉 Ajout du bouton ProConnect #1338

Case à cocher - checkbox

• 🎉 Ajout de l’état indéterminé #1361
• 🐛 Correction du style de la checkbox lorsque l’input n’est pas directement suivi du label (spring) #1380

Champ de saisie - input

• 🐛 Amélioration du texte d’aide des champs de type email et téléphone #1364

Curseur - range

• ✨ utilisation de la liaison for/id sur le curseur simple #1407

En-tête - header

• 🐛 Ajustement de l’alignement des liens de navigation en mobile #1367

Infobulle - tooltip

• 🐛 Corrige la fermeture au clic sur l’infobulle, permet maintenant de sélectionner le texte #1382
• 🐛 Corrige la fermeture sur IOS, la fermeture au tab, et changements de comportement : #1447
  • Une information contextuelle ne reste plus ouverte après un clic, uniquement au survol
  • Cliquer une seconde fois sur une infobulle la referme

Lien d'évitement - skiplink

• 🐛 Retrait des skiplinks en version print #1468

Menu latéral - sidemenu

• 🐛 Corrige l'affichage mobile lors d'une utilisation sans accordéon #1403

Modal - modal

• 🐛 Il n’est plus possible de focus un élément caché sous la zone d’action sticky de la modal, le scroll se fait automatiquement #1387
• 🐛 Correction du décalage de la navigation principale de la taille de la scrollbar à l'ouverture d'une modal #1429

Onglet - tab

• 🐛 Corrige le scroll horizontal de la variante viewport-width sur windows #1341
• 🐛 Corrige le focus lors du changement d’onglet via les flèches du clavier #1389

Paramètre d'affichage - display

• 🐛 Désactive le composant quand l'attribut HTML data-fr-scheme est absent et corrige la marge en bas de la modale de sélection du thème #1434

Pied de page - footer

• 🐛 Par défaut, le titre des catégories du menu du footer sont maintenant en h2 #1393

📖 Storybook

• Sommaire - Ajout de la valeur 'p' sur la propriété markup #1390

🔌 Analytics

• 🎉 Ajout de l'attribut data-fr-analytics-action="reduce" qui permet de désactiver l'envoi d'actions sur un élément, en empêchant l'initialisation de l'instance de tracking associée à cet élément. #1386

Documentation

• Mise à jour des Conditions Générales d’Utilisation #1372
• Mise en place d’une modale de consentement aux CGU sur les pages de documentation
• Ajout des librairies design en téléchargement sur le site de documentation
• Amélioration des pages de documentation des couleurs, des icônes, et des pictogrammes, en intégrant un moteur de recherche et de prévisualisation #1384
• Ajout des fichiers des librairies Figma et Sketch en téléchargement direct sur les pages “Premiers pas - vous êtes designer”
• Ajout de sites d’exemples sur la page “Exemples de site”
• Mot de passe : Mise à jour du lien du guide des règles de sécurisation de mot de passe de l’ANSSI #1366
• Correction du snippet de code du sélecteur de langue : retrait de la balise et role "nav" #1431
• Amélioration de la recherche des composants en anglais #1430
• Modèle de page : Correction de la valeur aria-live des messages de formulaire (polite au lieu de assertive) #1438
• Corrige les liens vers la documentation des composants dans les fichiers package.yml #1440
• Liste déroulante : retrait du 'hidden' sur les exemples de code #1424
• Ajout des extensions limesurvey DSFR et penpot DSFR