fix(deps): update all non-major dependencies (minor)

[renovate]

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
@gouvfr/dsfr	1.3.1 -> 1.11.0
got	12.1.0 -> 12.6.1

---

Release Notes

GouvernementFR/dsfr (@​gouvfr/dsfr)

v1.11.0

Compare Source

✨ feat(range): version optimisée en accessibilité (#​841)

• redesign du composant en ajoutant une bordure à la track pour être plus visible
• changement de la structure html pour être accessible
• lint

🐛 fix(core): erreur js classname (#​837)

• régression sur la fonction getClassname du core

🐛 fix(core): classname IE (#​828)

• correction d'une erreur js sur IE lors de la récupération du classname dans l'instance

🐛 fix(header): augmente le z-index du header (#​830)

• ajout d'un niveau d'élévation raised-over
• le header passe en z-index raised-over pour passer par dessus les cartes avec ombre

🐛 fix(examples): met a jour les pages d'exemple (#​831)

• mise en forme d'exemples

🐛 fix(password): placement checkbox & icon info (#​832)

• met a jour l'icône de message d'information
• met a jour le placement de la checkbox

🐛 fix(*): corrections diverses (#​833)

• Ajout de la balise meta format detection pour désactiver le style automatique des url, date, email, et tél sur IOS
• Passage des tag/badge en taille md sur les cartes md
• augmentation de la marge au dessus du message d'erreur sur checkbox, input, select (16px)
• correction d'une régression de la couleur de bordure des checkbox en erreur/succès
• augmentation de la marge droite de l'image du composant citation
• alignement de la valeur sur le curseur double quand tout à gauche
• augmentation de l'épaisseur du stepper à 8px
• passage du token de couleur des liens du menu latéral en $text-action-high-grey
• passage en bleu du bouton d'ouverture du sélecteur de langue en mobile
• alignement des chevrons du fil d'arianne
• correction du token des tags cliquables désactivés

🐛 fix(input): fieldset error/valid (#​827)

• correction de la couleur de la bordure des champs en fieldset-error/valid

🐛 fix(doc): lien page d'exemple (#​826)

• mise à jour du lien vers le site de documentation dans la page d'exemple icone de favori

🐛 fix(legacy): bugs IE divers (#​825)

• Retrait du soulignement sur les bouton et tags en a sur IE
• Retrait de la marge top des paragraphes p sur IE
• Changement du placement du '+' de franceConnect+
• Correction du ratio d'image sur les cartes de téléchargement sur IE
• Réglage de l'alignement de l'icône des liens en target blank sur IE
• Correction de l'alignement de la case des cases à cocher sur IE
• Correction des min/max/valeur du curseur sur IE
• Retrait du focus autour de l'icône des controles segmentés sur IE
• Correction de la hauteur du composant fil d'arianne sur IE
• Ajout des modifiers de bouton pour les accès rapide du header sur IE
• Correction des icones prev/next de la pagination sur IE
• Correction des couleurs du tag désactivé sur IE
• Retrait du soulignement dans le reset des liens a

🐛 fix(range): dépendance à scheme (#​823)

• ajout de la dépendance à scheme dans la configuration du package range

✨ feat(follow,share): icône twitter-x par défaut (#​824)

• mise en place de l'icône X pour Twitter, avec changement du title pour "X (anciennement Twitter)" sur les composants follow et share

🐛 fix(link, card, tile): espacement entre libellé et icone (#​818)

• retrait du saut de ligne entre la balise a et son libellé pour corriger l'écart entre le libellé du lien et l'icone
• ajout d'un exemple "lien externe" dans les exemples de lien
• correction de la taille de l'icone sur les tuiles sans lien étendu
• retrait de l'icone arrow-right sur les tuiles sans lien étendu, pour être iso avec les cartes

🐛 fix(doc): met a jour les liens des pages d'exemple (#​822)

• mise à jour des liens vers le site de documentation dans les pages d'exemple

✨ feat(segmented): ajout du composant contrôle segmenté (#​805)

• le composant "contrôle segmenté" incite l'utilisateur à choisir entre plusieurs options d'affichage disponibles (vues), mutuellement exclusives avec une valeur sélectionnée par défaut.

🐛 fix(build): liens doc sur core & utility (#​821)

• correction des liens de la documentation qui ne s'affichent plus dans les exemples

🐛 fix(toggle): largeur max du label & libellé (#​819)

• augmentation de la largeur max du libellé du label, la marge de 10v passe à 8v
• changement du libellé du label et du texte additionnel

📈 feat(analytics): gestion des actions (#​812)

• ajout de la propriété isActionEnabled dans la configuration et sur l'objet window.dsfr.analytics permettant d'activer l'envoi des données d'actions si nécessaire.
• ajout de l'attribut data-fr-action permettant d'activer l'envoi d'action sur un élément particulier et de spécifier la partie title de l'actionName envoyé
• correctif sur les sélecteurs des card, title pour traquer des boutons

📝 doc(contributing): typos et formattage de la doc de contribution (#​810)

• ajout du formattage shell pour les snippets de code
• correction de fautes d'ortographe

🐛 fix(core): correctif garbage collection hash (#​816)

• correction de la fonction dispose sur Instance pour enlever les écouteurs sur la modification du hash de l'url

✨ feat(range): ajout du composant curseur (#​817)

• Les curseurs sont des entrées numériques qui permettent de voir graphiquement la sélection d'une plage entre une valeur minimale et une valeur maximale. Ils servent à montrer en temps réelle les options choisies et éclairer la prise de décision.

🐛 feat(css-print): ajoute la feuille de style impression (#​802)

• génere une feuille de style "dist/dsfr.print.css" à charger pour appliquer les règles d'impression du DSFR
• ajoute la classe utilitaire .fr-no-print pour retirer un élement de l'impression

⬆️ chore(dependencies): met a jour les dependances Node (#​815)

• mise à jour de :
  • modules babel
  • nanoid
  • postCss
  • word-wrap

🐛 fix(header): ajustements header (#​791)

• change la couleur du menu burger en $action-high-bleu-france en mobile
• passe l'écart entre bloc marque et logo opérateur à 32px et l'écart entre logo opérateur et nom du site à 32px
• réduit la taille de la barre de recherche à 96v (24rem) au lieu de 25rem
• bloque la taille du logo opérateur à 8rem max (144px)
• passe la taille du texte de la tagline en sm (14px) au lieu de md
• passe le bouton burger en tertiaire avec border

🐛 fix(radio, radio-rich, toggle, checkbox): tokens de couleur (#​760)

• mise à jour des tokens de couleurs sur checkbox, radio, radio-rich, toggle

📝 doc(readme): mise en forme et précision du README.md (#​774)

• correction d'espacements et de fautes de frappe
• précise l'interdiction d'utilisation "pour des sites web ou des applications", sans interdire d'utiliser le DSFR pour
  créer, par exemple, un système de design entièrement différent (d'où l'intérêt de la licence libre).

🐛 fix(connect): taille de la fonte adapatable (#​813)

• Le bouton FranceConnect doit répondre aux critères d’accessibilité qui redéfinissent le letter-spacing et la taille de fonte.
  • Passage des valeurs de tailles et d'espacements en 'em' pour les rendre relatives à la taille de fonte du bouton
  • Retrait du '+' de 'FranceConnect+' dans l'intitulé de fr-connect__brand. Celui-ci est désormais placé en contenu du pseudo-élément after du bouton

📝 doc(readme): correction du lien de la documentation des icônes (#​804)

• corrige le lien vers la documentation des icones dans le readme

📝 doc(cgu): correction URL du système de design (#​799)

• ajout de "www" dans l'url du site de documentation des CGU

🐛 fix(icon): correction de l'icone user-setting-line (#​797)

• correction du contenu du svg de l'icone user-setting-line qui ne correspondait pas à la bonne icone

🐛 fix(card, scheme): alignement du détail carte & erreur js sur safari <14 (#​796)

• Sur les anciennes version de safari macOS (inférieure à 14.0)
  • corrige l'alignement du détail de la carte dans une grille de carte
  • corrige une erreur de javascript liée au dark mode sur scheme.js

🐛 fix(sidemenu): correction marge interne (#​793)

• retire 1v de padding gauche et droite sur fr-sidemenu__inner en desktop

🐛 fix(footer): ajustements (#​792)

• corrige le niveau de titre des partenaires
• le texte filler de footer__content-desc doit faire maximum 3 lignes en desktop
• passe les liens .fr-footer__content-link en $text-default-grey
• passe le padding top de .fr-footer__bottom-list à 4v
• correction des espacements autour de fr-footer-body : en mobile et en desktop (32px en haut et 24px en bas)
• titre “nos partenaire“ → fr-footer__partners-title passe en graisse régular, couleur text-default-grey
• ecart de 12px sous “Nos partenaire” en mobile/desktop
• enleve le padding sur .fr-footer__partners .fr-footer__logo, ajoute une border 1px en $border-default-grey + un background en background-default-grey
• en desktop l’ecart entre logo et bloc mark passe à 32px
• passe le logo opérateur en 16x9
• ajoute un margin bottom négatif de 8px sur le groupe de lien pour garder 24px en dessous
• retire le padding sur les images des logos partenaire
• passe à 16px entre les logos partenaires secondaires
• rend les partenaires secondaires facultatifs
• corrige alignement des liens en bas du footer

🐛 fix(download): icon-size bug compilation (#​788)

• correctif taille de l'icone du composant download (déprécié)

♻️ refactor(*): selecteur not combiné (#​786)

• remplacement des selecteurs :not(.selecteurA, .selecteurB) par :not(.selecteurA):not(.selecteurB) dans le js des composants : accordion, navigation, sidemenu, translate, transcription

🐛 fix(highlight): met à jour les espacements (#​777)

• passe le padding à 5v en mobile et 9v en desktop

🐛 fix(navigation): correctifs de style mega-menu (#​785)

• ajoute un margin-top: -1.25rem (-20px) sur le fr-mega-menu__leader
• passe le texte de description et le lien du fr-mega-menu__leader en taille sm
• supprime la classe fr-mb-4v de la colonne entourant le fr-mega-menu__leader
• le texte du bouton de navigation passe en $text-action-high-blue-france à l'ouverture

🐛 fix(unavailable): couleur de fond et image décorative (#​787)

• change la couleur de fond de page pour du $background-alt-blue-france
• remplace l'image décorative par un SVG

🐛 fix(close-btn): retire le margin-left négatif (#​784)

• retire la marge négative sur le modifier .fr-btn--close et corrige l'impact sur les composants 'alert', 'navigation', et 'notice'

🐛 fix(form): token de couleur de la légende (#​783)

• la légende du fieldset passe en $text-label-grey à la place de $text-title-grey

🐛 fix(skiplink): espacements des liens d'évitement (#​782)

• l'ecart entre les liens d'évitement passe à 16px (4v)
• en desktop la marge en haut et en bas du composant passe à 12px (3v)

🐛 fix(follow): corrige affichage (#​781)

• inverse l'ordre des boutons "Instagram" et "LinkedIn"
• supprime les margin left et right du groupe de boutons
• place le bouton d'action dans un groupe de bouton fr-btns-group--inline-md sur les exemples "Lettre d'info seule" et "Réseaux sociaux et Lettre d'info mise en avant" pour que le bouton prenne l’ensemble de la largeur en vue mobile.

🐛 fix(tag): token de couleur du tag selectionnable (#​780)

• utilisation du token $text-inverted-blue-france sur la couleur du texte des tag selectionnable et supprimable à la place de $text-inverted-grey
• remplacement du token de couleur de fond des tag selectionnable par $background-active-blue-france au lieu de $background-action-high-blue-france

🐛 fix(summary): alignement du titre du sommaire (#​779)

• ajout d'un padding-left de 8px pour aligner le titre avec le premier élément de la liste

🐛 fix(share): token couleur texte cookies désactivés (#​778)

• Le token de couleur du texte lorsque les cookies sont désactivés passe en $text-mention-grey

🐛 fix(core): mise à jour lien vers la doc typographie (#​775)

met à jour le lien vers la page "Typographie" du site de documentation.

🐛 fix(name): bouton ajout et suppression en secondaire (#​773)

• dans le pattern de nom prénom, les boutons d'ajout et de suppression de prénom passent en secondaire à la place de tertiaire

🐛 fix(input): combo champ + button en erreur (#​772)

• lorsque le champ newsletter de la lettre d'information est en erreur le champs doit être souligné en rouge et non en bleu

🐛 fix(toggle): couleur label & espacements (#​771)

• utilisation du token de couleur $text-label-grey sur le label de l'interrupteur
• ajout de 4px de marge entre la coche et le texte activer/desactiver

🐛 fix(consent): correction espacement des radios accepter (#​768)

• ajustement de la marge droite des radios "accepter"

🐛 fix(consent): token de couleur des titres de finalité (#​767)

• passe la couleur des titres de finalité en $text-title-grey

🐛 fix(form, input): met a jour les espacements des icônes (#​766)

• place l’icône à 16px du bord droit des champs de saisie
• ajuste le padding-right à 44px sur les champs de saisie avec icône
• corrige la largeur des class fr-fieldset__content pour la version dépréciée

🐛 fix(checkbox): met a jour le token de la coche (#​762)

• passe la couleur de la coche en $text-inverted-blue-france

🐛 fix(login): correction espacements (#​759)

• corrige l'espace en trop entre le lien "Mot de passe oublié ?" et la checkbox "Se souvenir de moi",
• ajoute une marge supplémentaire sous l’alerte d’erreur

🐛 fix(consent): correction lien & cookies obligatoires (#​754)

• coche les cookies obligatoires par defaut
• étend le lien voir plus de detail

🐛 fix(password): couleur du texte de la checkbox "afficher" (#​750)

• utilisation du token de couleur : text-label-grey

🐛 fix(skiplink): visible avec elastic scrolling (#​749)

• cache le skiplink lors du rebond du scroll sur ios

✨ feat(core): description list dl dt dd (#​748)

• ajout du style par défaut des listes de description dl dt dd

🐛 fix(*): selecteur aria-current (#​747)

• correction sur breadcrumb, navigation, pagination, sidemenu, et translate de l'attribut [aria-current] lorsqu'il est à "false"

♻️ refactor(highlight, callout): background image à la place de box shadow (#​746)

• refactorisation de la bordure en background-image à la place de box-shadow

🐛 fix(header): token titre service (#​745)

• le token de couleur du texte de service passe en text-title-grey à la place de text-default-grey

🐛 fix(alert): remplacement des box-shadow en background-image (#​742)

• les bordures sont dessinées en background image à la place de box shadow

🐛 fix(link): rel noopener external & title target blank (#​737)

• ajout d'attribut title et rel noopener external sur les liens en target blank
• modification des exemple de card, tile, link, footer, quote, notice

🐛 fix(search, input, select): color token & cancel button (#​740)

• corrige le token de couleur de l'intitulé et des icones dans les champs de saisie et du select.
• customisation de l'icone de suppression du champs de recherche : close-circle-fill

🐛 fix(logo): intitulé et motto en noir absolu (#​738)

• intitulé et moto en noir absolu
• ajout token absolute black

🐛 fix(select): correctifs flèche et intitulé (#​736)

• réduit la taille de l'icone et ajuste sa position
• corrige l'intitulé du placeholder

✨ feat(select): ajout exemple <optgroup> (#​734)

• ajout d'un example de select avec groupe d'options

🐛 fix(header): mise à jour des exemples (#​727)

• ajout exemple utilisateur connecté
• ajoute des exemples avec un seul raccourcis (sans liste)
• ajoute les modifier de bouton account briefcase et team

🐛 fix(register): alignement boutons (#​726)

• corrige l'alignement des boutons :
  • en mobile, aligné l’un au dessus de l’autre, bouton primaire en premier
  • en desktop, les 2 alignés à droite, bouton primaire à droite

🐛 fix(stepper): mise à jour de la structure (#​724)

• inverse le stepper step et le title dans la pile html

🐛 fix(page-unexpected): textes (#​723)

• inverse le texte principal et le texte de description du model de page

🐛 fix(quote): ajoute un exemple avec un seul detail (#​721)

• il n'est plus obligatoire d'avoir une liste dans le figcaption de la citation

🐛 fix(modal): a11y retire la liste dans la zone d'actions (#​720)

• le groupe de bouton peut désormais être une div à la place d'un ul``li
• retrait de la liste non ordonnée dans le footer de la modale

fix(consent): ajoute un niveau de titre sur la banniere de consentement (#​719)

• le titre de la baniière devient un <h4> à la place d'un <p> dans la structure HTML du composant

✨ feat(prng): ajoute la librairie js pure-rand (#​718)

• implémente une lib js de PRNG dans le rendu EJS pour pouvoir mettre une seed sur chaque contenu.

🐛 fix(consent): coche les cookies obligatoires par defaut (#​735)

• Les cookies obligatoires doivent être systématiquement cochés

v1.10.2

Compare Source

🐛 fix(analytics): réduction d'envoi des données (#​806)

• suppression du taux d'interaction global
• ajout de l'attribut data-fr-analytics-rating qui permet de mesurer le taux d'interaction sur un élément particulier
• suppression de l'impression des composants sans interactions
• limitation de l'envoi de donnée à la première interaction
• bouton associé à l'accordéon, l'onglet et la transcription rendu muet
• recensement des composants de la page dans une nouvelle donnée de page page_components

v1.10.1

Compare Source

🐛 fix(radio): correctif couleur manquante (#​757)

• Erreur dans le build du CSS suite au manque d'une couleur

🐛 fix(link): correction des liens de téléchargement sur firefox et des groupes de liens sur safari (#​755)

✨ feat(share, follow, utility): icone personalisée, et ajout twitter-x et threads (#​752)

• ajoute la possibilité de mettre une icone de réseau social personalisée dans "follow"
• ajouts d'exemples d'icone personalisée dans "share" et "follow"
• ajouts des icones dans utility :
  • twitter-x-fill
  • twitter-x-line
  • threads-fill
  • threads-line

🐛 fix(tile): correction de l'icone des tuiles avec lien externe (#​753)

v1.10.0

Compare Source

🐛 fix(analytics): réduction d'envoi des données (#​807)

• suppression du taux d'interaction global
• ajout de l'attribut data-fr-analytics-rating qui permet de mesurer le taux d'interaction sur un élément particulier
• suppression de l'impression des composants sans interactions
• limitation de l'envoi de donnée à la première interaction
• bouton associé à l'accordéon, l'onglet et la transcription rendu muet
• recensement des composants de la page dans une nouvelle donnée de page page_components

🐛 fix(form): correctif barre état iOS (#​712)

• Sur iOS, la barre d'état d'erreur ou validation est discontinue
• corrige le problème de manière générique

🐛 fix(modal): retour de focus fermeture clavier (#​716)

• Mise en place du retour du focus à la fermeture en pressant la touche ESC

🐛 fix(form): correctif focus des radios riches dépréciés (#​715)

• corrige le décalage du focus sur les boutons radio en version dépréciée

🐛 fix(follow): orthographe message de confirmation (#​714)

✨ feat(core, password): boutons spéciaux input Safari (#​711)

• Dans les champs de type password, sur safari Mac, il y a une icône apportant des outils supplémentaire qui se superpose à l’icône des signalant la hauteur de casse
• Déplacement des icônes natives pour qu'elles ne se superposent pas
• Retrait de l'icône capslock native, privilégiant la nôtre

🐛 fix(core): stabilisation disclosure (#​713)

• L'ouverture des paramètres d'affichage est par moment non réactive
• L'élément est fermé avant même d'être ouvert à cause de boucle de déclenchement
• Ajout de condition permettant de limiter les boucles

📝 doc(tooltip): retrait exemple texte (#​710)

• l'utilisation d'un tooltip sur un texte pose des problèmes de restitution
• cet usage est déconseillé
• retrait de l'exemple

🐛 fix(tile): correctif espacements version dépreciée (#​704)

• L'icône et le contenu se retrouvent superposés dans la version dépréciée, ce correctif rétablit l'espacement nécessaire

🐛 fix(tile, card): A11Y liens désactivés (#​709)

• Ajout des attributs role="link" et aria-disabled=true sur les version désactivées

🐛 fix(transcription, content): correctif title et label bouton Agrandir (#​708)

• Retrait du title sur le bouton agrandir
• Ajout label agrandir dans les exemples de content

✨ feat(*): Ajout d'un meta tag iOS (#​707)

• Sur iOS, les numéros de téléphone sont automatiquement transformés en lien
• Entraîne un mauvais rendu dans le bloc fonctionnel de numéro de téléphone
• Correction par l'ajout général du meta tag <meta name="format-detection" content="telephone=no">

🐛 fix(card, tile): correctif IE 11 (#​705)

• correctif sur les tuiles et card sur la version legacy pour éviter les bugs de dépassement de texte et placement des icônes

🐛 fix(toggle): retrait tap-highlight-color iOS (#​703)

• Au clic sur le toggle sur iOS, l'effet de highlight est présent
• Retrait de cet effet avec la propriété -webkit-tap-highlight-color

🐛 fix(link): correctif téléchargement multiligne (#​702)

• les liens de téléchargement étaient limités à une seul ligne avec une ellipse sur le text dépassant
• correctif prenant en compte le retour à la ligne

🐛 fix(download): graisse du titre des liens (#​701)

• Passage des liens dépréciés en graisse regular

🐛 fix(*): mise à jour des liens du readme (#​700)

• Mise à jour des liens vers https://www.systeme-de-design.gouv.fr dans le readme

🐛 fix(modal): préviens décalage mobile (#​699)

• l'ajout d'un padding à l'ouverture permet de se substituer au décalage créé potentiellement par la disparition de la scrollbar en desktop
• En mobile, la modale occupe 100% de la largeur, ce padding créé un espacement incorrect
• ajout d'une media query sur le breakpoint MD pour corriger le problème

🐛 fix(header): correctif régression scroll horizontal (#​697)

• La navigation du header créée un scroll horizontal dans la page
• l'ajout d'un max-width prévient le problème

🐛 fix(password): correctif accessibilité des messages (#​694)

• ajout sur les messages de validation et d'erreur de la composition du mot de passe d'un statut en after uniquement pour les lecteurs d'écrans
• BREAKING CHANGE : il est nécessaire d'ajouter les attributs data-fr-validet data-fr-error avec les textes correspondants à l'état (respectivement, en français, "validé" et "en erreur"

🐛 fix(sidemenu): correction de la couleur des liens du sidemenu (#​698)

• Effet de bord du passage du bouton mobile en bleu, l'ensemble des boutons du sidemenu est passé en bleu.
• Ce correctif amène la spécificité nécessaire pour avoir les boutons et lien en text default grey

🐛 fix(core): correctif sur KeyAction (#​696)

• Corrige la régression sur l'écoute des interactions avec le clavier dû à l'évolution de la structure de la constante KeyCodes, non répercutée dans KeyAction

✨ feat(colors): ajout des utilitaires de couleur flat (#​693)

• Ajout des classes utilitaires pour le token background flat avec les variations de couleur d'accent

🐛 fix(tooltip,modal): interaction globale et focus iOS (#​691)

• Correctif à la pression de la touche Escape sur la modale : si l'élément actif (focus) est un élément de formulaire ou un média, la modale n'est pas refermée pas pour permettre l'interaction native de l'élément actif
• Correctif iOS de la prise de focus au clic
• Fermeture des tooltips dés au clic sur n'importe quel endroit
• Fermeture des tooltip à la pression sur la touche escape, où que soit le focus

🐛 fix(tooltip) : a11y tooltip hover (#​686)

• autorise le survol sur l'information contextuelle
• ajoute un tabindex="0" sur l'example dans un texte
• arrondi la valeur de placements de la flèche verticale à 2 décimales
• retire le aria-hidden="true" et ajoute display="none"

🐛 fix(transcription): a11y retour audit (#​684)

• place le bouton d’agrandissement avant la modale et inverse les élements via css
• ajoute aria-label=”Agrandir la transcription” sur le bouton d’agrandissement
• remplace la balise dialog par une balise div
• système d'activation / désactivation de la modale avec ajout / retrait dynamique de role="dialog" à l'ouverture / fermeture de la modale
• système de vérification et de correction pour l'accessible name de la modale, avec warning explicatifs

✨ feat(tile): ajouts de variations de tuiles (#​685)

Ajouts des mêmes variations que la carte :

• .fr-tile--no-border sans le bordure encadrant la tuile (mais la barre épaisse basse reste)
• .fr-tile--shadow avec élévation
• .fr-tile--grey en gris contrast
• .fr-tile--no-background couleur de fond transparente

🐛 fix(card,tile): corrige erreur de syntaxe ejs + lint (#​687)

🐛 fix(card, tile): correctif lien externe et désactivé (#​683)

• sur les exemples avec lien externe, ajout de title="[Intitulé] - nouvelle fenêtre"
• sur les exemples avec liens désactivés, ajout de role="link" et aria-disabled="true"

🐛 fix(card, tile): correctif token title (#​682)

• le titre des cartes et tuiles doivent utiliser le token de couleur text-title-grey

✨ feat(navigation, header, sidemenu): homogénéisation des espacements et indentation (#​678)

• Uniformisation du menu latéral, navigation, et accordéon
  • ajout d'un fond open-blue-france et du texte en blue-france sur les boutons d'ouverture en état ouvert
  • ajout de marge pour indenter les sous menus
  • ajustement des espacements
• Ajustement de la navigation du header en mobile
• Ajustement de la taille max de la navigation dans le header en desktop

🐛 fix(input): ajustement champs particuliers (#​679)

• Ajuste la largeur des champs de code postal, année et nombre à des multiples de 8v

🐛 fix(civility): correctif taille des boutons radio (#​676)

• Corrige la taille des boutons radio du titre d'appel en sm au lieu de md

🐛 fix(follow): ajoute d'exemple (#​675)

• Ajout de l'exemple de succès à l'abonnement à la lettre d'information

🐛 fix(analytics): correctif page.date (#​681)

• la collecte de donnée page.date génére une erreur -> correctif
• mise en conformité avec le standard de date calendaire ISO 8601 [YYYY-MM-DD]

🐛 fix(transcription): déplacement bouton modale (#​680)

• Pour déterminer le bouton primaire qui sert à l’ouverture, un disclosure filtre parmi les boutons qui lui sont reliés et retire ceux qui se trouve à l’intérieur du contenu du disclosure (ce sont les boutons de fermeture)
• Actuellement, la transcription a le bouton d'ouverture de modale à l'intérieur de son contenu, ce qui bloque le fonctionnement, le bouton n'étant pas reconnu comme primaire.
• Le correctif déplace le bouton après la dialog de la modal et restitue le fonctionnement de la transcription

🐛 fix(form): met a jour les libelles des indications (#​674)

• retrait de la capitalisation des mentions d'indication

🐛 fix(date): ajustement exemples (#​671)

• mise en place de date cohérentes avec les erreurs affichées dans les exemples

🐛 fix(form): correctif alignement icône des messages (#​670)

• l'icône à gauche des messages d'erreur/succès sur plusieurs lignes doit être accrochée en haut et non pas centrée

🐛 fix(password): retrait du bouton natif sur edge (#​669)

• Sur edge une icône oeil apparaît au focus d'un champ de type "password"
• Retrait de l'icone native

🐛 fix(name): a11y - gestion du focus (#​664)

Ajoute dans la page d’exemple le déplacement du focus :

• au click sur la checkbox de désactivation pour activer, le premier champ ou bouton prend le focus
• au click sur l’ajout d’un prénom, le champs ajouté prend le focus
• au click sur la suppression, le champ ou bouton suivant prend le focus

🐛 fix(footer): retrait de CSS obsolète (#​668)

• retrait de CSS résiduel de précédentes versions dans le footer-bottom__list

🐛 fix(password): correctif états de la case à cocher (#​667)

• force l'état de la checkbox à l'état par défaut, pour éviter qu'elle ne passe en erreur/succès si elle hérite de cet état sur le composant.

🐛 fix(tooltip): mise a jour exemple (#​666)

• Dans l'exemple "Information contextuelle dans un tableau", remplacement de l'information contextuelle par une infobulle (interaction au clic plutôt qu'au survol)

🐛 fix(input): fix groupe attributes & multiple hint text (#​665)

• Correction attribut en trop sur les input-group
• multiple texte additionnel sur le modèle de champs d'adresse électronique
• Correction des textes additionnels

🐛 fix(modal): suppression exemple des liens dans la zone d'action (#​663)

• Ce cas n'est pas recommandé, la zone d'action étant plutôt prévue pour des boutons

🐛 fix(consent): correctif espacement et couleur (#​662)

• Corrige description d'une finalité de 3v à 2v en margin-bottom
• Homogénéité avec accordion, nav et sidemenu sur le bouton de la modale de consentement “voir plus de détails” :
  • enlever le soulignement
  • mettre en bleu le lien “voir plus de détail”

🐛 fix(card, tile): ajout version sans liens, target blank, et mise à jour des exemples (#​657)

• Ajout de version carte et tuile sans lien (en noir)
• Ajout de l'icone target blank sur les cartes avec lien non élargi en target="_blank"
• Ajout d'exemples de carte et tuile de téléchargement avec remplissage automatique des détails (en Octet ou en Bytes)
• Ajout d'exemple de carte et tuile de téléchargement avec fichier en langue étrangère
• Séparation des exemples de tuile de téléchargement
• Changement des pictogrammes des tuiles de téléchargement
• Ajustement de la grille dans les exemples de tuiles

🐛 fix(pagination): correctif régression href des exemples (#​661)

• Corrige la régression qui a supprimé les liens des éléments de pagination

🐛 fix(sidemenu): suppression variante et correctif style bouton mobile (#​660)

• Suppression de la variante avec bordure
• Corrige le style du bouton mobile en action-high-blue-france (cohérence navigation/accordion)

🐛 fix(company): retrait des pluriels (#​659)

• Correction du langage dans la demande d'un représentant moral, suppression des pluriels optionnels

🐛 fix(link): corrige graisse lien de téléchargement (#​658)

• retire le font-weight bold sur le lien de téléchargement

🐛 fix(password): bug icône (#​648)

• conditionne l'ajout de la classe utile fr-icon à l'utilisation d'une string en paramètre icon

🐛 feat(company): accessibilité lien externe (#​656)

• corrige l'accessibilité du lien en target="_blank" par l'ajout d'un attribut title : "Annuaire des entreprises – nouvelle fenêtre"

🐛 fix(unexpected): corrige groupe de bouton vide (#​655)

• ajoute une condition sur l'ajout du wrapper .fr-btns-group dans la template ejs

🐛 fix(*): accessibilité aria-live (#​654)

• remplace la valeur aria-live assertive par polite

🐛 fix(account): accessibilité champs obligatoires (#​652)

• La mention de "champs obligatoires" doit être mise dans un élément <p> sur les pages de connexion et création de compte

🐛 fix(pattern): dénomination des blocs fonctionnels (#​649)

• Mise à jour et harmonisation de la dénomination des blocs fonctionnels

🐛 fix(core): correctif padding négatif (#​650)

• ajoute une condition pour éviter le padding négatif actuellement présent dans les classes utiles

⬆️ chore(*): montée de version NodeJS 18 (#​644)

• Monte la version minimale de NodeJS en 18.16.1

🐛 fix(core): correctif bug proxy Toggle (#​646)

• Dans la class Toggle, le proxy appelle la fonction toggle qui a été remplacée par la fonction générique handleClick :
• Ce correctif restaure la fonction toggle et implémente son appel dans handleClick

📝 docs(analytics): correction doc analytics & readme (#​643)

• mise à jour du readme
• corrections diverses documentation analytics

🐛 fix(analytics): correctif hiérarchie (#​647)

• l'analyse de hiérarchie ignorait les headings présents dans un composant.
• ce correctif permet de les inclure dans l'analyse.

🐛 fix(changelog): correctif inclusion des html (#​642)

• inclusion des caractères spéciaux html pour que les snippets soient affichés correctement

⬆️ chore(dependencies): met a jour les dépendances Node (#​638)

• Mise à jour de sécurité

🐛 fix(core): apparence du champ de recherche iOS (#​639)

• En utilisant des librairies tierces (telles que normalize.css), le champ de recherche reprend son aspect natif arrondi en mobile IOS.
• Spécificité renforcée sur le sélecteur afin de conserver le appearance: none

🐛 fix(header): duplication des id généralisée pour les quick access (#​637)

• L'ensemble des id présents dans les accès rapides du header doivent être suffixés par -mobile à la duplication

🐛 fix(analytics): correctifs divers et ajouts de propriétés de page (#​612)

• liens cassés de la documentation
• retrait du patch js des pages d'exemple
• correctif du collect manuel au changement d'url
• correctif du taux de clic désactivé sur certains composants
• ajustements pages d'exemple
• retrait des limitation de valeurs sur la propriétéuser.profile
• ajouts de propriétés dans la configuration de page
  • page_id
  • page_author
  • page_tags
  • page_date

🐛 fix(search): hauteur du champ trop grande de 1px sur ios (#​632)

Sur ios le champ dépasse de 1px par rapport au bouton.

-> Correction du max-height

✨ feat(select, input): ajout de la bordure en état erreur / succés / info (#​635)

Actuellement la bordure gauche montrant l'état d'erreur/succès/info n'est appliqué que dans le cas d'un groupe de champ en erreur via les modificateur .fr-fieldset--error, .fr-fieldset--valid, .fr-fieldset--info

Afin d'être ISO avec l'UI nous rajoutons cet élément visuel sur :

• les champs seuls (.fr-input-group) :
  • .fr-input-group--error
  • .fr-input-group--valid
  • .fr-input-group--info
• les selects (.fr-select-group)
  • .fr-select-group--error
  • .fr-select-group--valid
  • .fr-select-group--info

🐛 fix(tab): correction onglets imbriqués en legacy (#​628)

• correction des marges sur les tabs imbriqués sur IE
• correction disclosure et disclosureGroup IE
• correction syntax error selecteur Collapse

🐛 fix(example): retire les attributs file des (#​631)

• l'attribut file n'est pas un attribut possible pour les éléments

🐛 fix(link, button, tag, badge): retrait du z-index (#​630)

• retrait du z-index: 1 qui pose problème dans une modale avec footer.

🎉 feat(tooltip): ajout de la fonctionnalité Tooltip (#​486)

Le composant Infobulle (ou bulle d’aide, aide contextuelle) permet d’afficher du contenu dans le contexte de navigation (non modal), à propos et lors de l’interaction avec un élément précis de l’interface. Il est caché par défaut, et s’affiche au survol ou au clic de l’élément associé, par-dessus le reste de la page.

🐛 fix(share): correction copie url dans presse papier (#​629)

• Gestion de la Promise retournée par navigator.clipboard.writeText()

✨ feat(address): met a jour les message d'aide des champs de formulaire (#​624)

• ajout d'indication et de description du format attendu

🐛 fix(account): met a jour la hiérarchie html des modèles de page (#​618)

• Mise en place d'une hiérarchie sans saut de niveau de titre, plus cohérente
• Correctif typo sur la classe fr-grid-row--gutters

🐛 fix(accordion, transcription, translate, sidemenu): Ajustement sur l'état défaut et actif (#​564)

Harmonisation avec la navigation sur Accordion, Sidemenu, Translate et Transcription :

• Passage icône et intitulé en action-high-blue-france
• Ajout background-open-blue-france sur le bouton lorsque l'élément est ouvert
• Icône “arrow-down-s-ligne” (la même que sur navigation)
• Accordion, Translate : Retrait changement de graisse (normal -> bold) à l'ouverture et graisse constante en medium

🐛 fix(tab, core): correctif tab legacy & margin top des headings (#​621)

• Corrige la taille de l'icône
• Corrige l'alignement du contenu du tab_panel
• Ajustement du padding de la tab__list
• Retire les margin-top des headings (h1 -> h6)

📝 doc(core): ajoute des exemples liens bruts et resets (#​613)

Par défaut, le dsfr stylise les liens natifs, ce qui peut poser problème dans l'utilisation de librairie tierce.
2 classes utilitaires sont mise à disposition pour contrecarrer le style fort du lien :

• .fr-raw-link retire toute stylisation sur les liens natifs
• .fr-reset-link remet le soulignement natif du navigateur (text-decoration: underline;)
  Des pages d'exemples en illustrant l'utilisation ont été ajoutées dans les pages d'exemples des fondamentaux.

✨ feat(radio): radio rich sans images & pictogram à la place d'img (#​540)

Les radios riches doivent utiliser des pictogrammes et non des images :

• Retrait des images
• Ajout de pictogramme

Le snippet :

<div class="fr-radio-group fr-radio-rich">
  <input value="1" type="radio" id="radio-rich-1" name="radio-rich">
  <label class="fr-label" for="radio-rich-1">
      Libellé bouton radio
  </label>
  <div class="fr-radio-rich__img">
      <img src="../../../example/img/placeholder.1x1.png" alt="[À MODIFIER - vide ou texte alternatif de l’image]" />
  </div>
</div>

DEVIENT :

<div class="fr-radio-group fr-radio-rich">
  <input value="1" type="radio" id="radio-rich-1" name="radio-rich">
  <label class="fr-label" for="radio-rich-1">
      Libellé bouton radio
  </label>
  <div class="fr-radio-rich__pictogram">
      <svg aria-hidden="true" class="fr-artwork" viewBox="0 0 80 80" width="80px" height="80px">
          <use class="fr-artwork-decorative" href="../../../dist/artwork/pictograms/buildings/city-hall.svg#artwork-decorative"></use>
          <use class="fr-artwork-minor" href="../../../dist/artwork/pictograms/buildings/city-hall.svg#artwork-minor"></use>
          <use class="fr-artwork-major" href="../../../dist/artwork/pictograms/buildings/city-hall.svg#artwork-major"></use>
      </svg>
  </div>
</div>

Remplacer buildings/city-hall par la catégorie et le nom du pictogramme désiré

BREAKING CHANGE : fr-radio-rich__img devient fr-radio-rich__pictogram

📝 doc(core): corrige les liens vers les pages de documentation des fondamentaux (#​623)

• Mise à jour des liens vers les fondamentaux sur le site de documentation

⬆️ chore(dependencies): met a jour les dépendances Node (#​622)

• Mise à jour de sécurité

✨ feat(card): image des cartes de téléchargement format a4 (#​620)

• Ajout d'une image de placeholder au format a4 (21x29.7)

🐛 fix(core): corrige liens pour retro-compat sur firefox (#​615)

• La fonction css max(), mise en place pour corriger le bug d'affichage d'un soulignement d'une épaisseur inférieure à 1px, est supportée à partir de la version 78 de firefox, ce qui est insuffisant.
• Le précédent bug est maintenant corrigé avec un léger épaississement du trait sur firefox (0.25px)

🐛 fix(header, navigation): focus des nav-items mobile & ajustements (#​609)

• L'outline de focus est maintenant entièrement visible sur les liens des sous menu en mobile
• Ajustement de l'alignement du bouton fermé en desktop
• Retrait du mega-menu__leader vide dans les examples

✨ feat(pagination): évolution taille et écart des boutons (#​549)

Harmonisation de l'espacement entre les boutons de pagination :

• L'espacement passe à 16px entre tous les boutons
• Les boutons passent en taille SM

🐛 fix(core, modal): décalage scrollbar à l'ouverture/fermeture modale & fix scroll behavior (#​519)

Lorsque la page est scrollable, un décalage se produit à l'ouverture d'une modal (la page étant figé elle n'est plus scrollable).

Une marge est donc appliquée à l'ouverture de la modale pour simuler la barre de scroll et ainsi éviter le mouvement du contenu en arrière plan.

♻️ refactor(radio,checkbox,toggle): passage input en bleu et refactorisation (#​502)

Uniformisation des champs à cocher toggle/radio/checkbox

toggle:

• Ajout des variants toggle error/valid
• Retrait du css sur input appearance:none
• bordure en background svg
• le toggle est maintenant placé dans un fieldset

radio:

• Le contour devient bleu
• retrait du fond blanc du radio bouton (transparence)
• input déssiné en background image

radio-rich:

• L'outline au focus englobe tout le radio-riche, plus l'input

checkbox:

• Le contour devient bleu
• correction changement d'état au mouse-down (:active), maintenant au mouse up

Form:

• les hint-text des champs désactivés passent en couleur --text-disabled-grey

✨ feat(core): ouverture des disclosures à partir des ancres, état disabled désactive disclosure (#​532)

• Correctif de l'état disabled sur les boutons associés à une modale, un onglet ou un accordéon. La fonctionnalité d'ouverture est désactivée si les boutons primaires sont désactivés.
• Ajout de la fonctionnalité d'ouverture d'une modale, d'un onglet ou d'un accordéon si la partie ancre de l'url correspond à l'id de l'élément -> les liens d'évitements peuvent ouvrir le menu et la recherche en mobile.

🐛 fix(tab): écoute des événements de clavier déplacé sur la liste d'onglets (#​531)

L'écoute des événements de clavier se faisant sur le composant, il est impossible d'interagir avec des éléments de formulaire dans le contenu de l'onglet -> l'écoute est déplacée au niveau de la liste des onglets, ce qui en exclut le contenu

✨ feat(name): ajout bouton de suppression de prénom (#​493)

Dans le modèle de de bloc nom/prénom, un bouton permet d'ajouter des champs de saisie pour les prénoms secondaires -> ajout d'un bouton permettant de supprimer ces champs ajoutés

✨ feat(tile): Ajout icône flèche, état désactivé, icone lien externe, tuile de téléchargement (#​602)

Les tuiles peuvent maintenant être de type téléchargement (comme les cartes)

• Les tuiles de téléchargement sont par défaut horizontales
• Le détail de la tuile de téléchargement est obligatoire et il peut être rempli automatiquement en fonction du fichier à télécharger en plaçant à l'attribut "data-fr-assess-file" sur le lien (comme pour carte)

Les tuiles ont maintenant par défaut une icone.

• arrow-right (par défaut)
• external-link (en target="_blank")
• download (avec la classe fr-tile--download)

Les tuiles désactivées (a sans href) ont à présent:

• la bordure bottom en grise
• l'icone et le titre en gris

Ajout des classes "fr-tile--vertical@md" et "fr-tile--vertical@lg" pour passer une tuile horizontale, ou download, en vertical à partir des breakpoints md et lg

🎉 feat(tile): évolution des tuiles (#​534)

Evolution majeur du composant Tuile :
Nous souhaitons revoir la structure html de la tuile pour étendre les variations de contenu (avec détails, badge, etc), et uniformiser avec les comportements de la Carte (card).

Changements apportés :

• Ajout d'un niveau d'encapsulation dans la structure html
  • Ajout d'un wrapper "fr-tile__content" pour englober le contenu
  • Ajout d'un wrapper "fr-tile__header" pour englober l'image
• L'image des tuiles est remplacée par un pictogramme
  • La classe "fr-tile__img" devient "fr-tile__pictogram"
  • Son contenu est maintenant un svg "fr-artwork"
• Ajout de la possibilité de placer un badge, un tag, un texte de détail, dans le contenu de la tuile
• Ajout d'une taille de tuile SM : "fr-tile--sm"

⚠️ Breaking Change
Le snippet de code d'une tuile :

<div class="fr-tile fr-enlarge-link">
    <div class="fr-tile__body">
        <h4 class="fr-tile__title">
            <a class="fr-tile__link" href>Titre M bold</a>
        </h4>
        <p class="fr-tile__desc">Texte M regular 2 lignes max</p>
   </div>
   <div class="fr-tile__img">
       <img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
       <!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
    </div>
</div>

Devient :

<div class="fr-tile fr-enlarge-link" id="tile-6584">
    <div class="fr-tile__body">
        <div class="fr-tile__content">
            <h3 class="fr-tile__title">
                <a href="#">Intitulé de la tuile</a>
            </h3>
            <p class="fr-tile__desc">Lorem [...] elit ut.</p>
        </div>
    </div>
    <div class="fr-tile__header">
        <div class="fr-tile__pictogram">
            <svg aria-hidden="true" class="fr-artwork" viewBox="0 0 80 80" width="80px" height="80px">
                <use class="fr-artwork-decorative" href="../../../dist/artwork/pictograms/buildings/city-hall.svg#artwork-decorative"></use>
                <use class="fr-artwork-minor" href="../../../d

</details>

---

### Configuration

📅 **Schedule**: Branch creation - "before 4am on the first day of the month" in timezone Europe/Paris, Automerge - At any time (no schedule defined).

🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

👻 **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://togithub.com/renovatebot/renovate/discussions) if that's undesired.

---

 - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box

---

This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/SocialGouv/mon-psy-sante).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzMi4xMTcuMSIsInVwZGF0ZWRJblZlciI6IjM3Ljg3LjIiLCJ0YXJnZXRCcmFuY2giOiJtYWluIn0=-->

[rap2hpoutre]

Cette PR casse les icones :/

[rap2hpoutre]

Should not update @gouvfr/dsfr

[github-actions]

🎉 Deployment for commit 79006ac :

Ingresses

• 🚀 mon-psy-sante-renovate-all-dependencies-min-5erbu9.dev.fabrique.social.gouv.fr
• 🚀 keycloak-mon-psy-sante-renovate-all-dependencies-min-5erbu9.dev.fabrique.social.gouv.fr

Docker images

• 📦 docker pull ghcr.io/socialgouv/mon-psy-sante/app:sha-79006ac22effc35e29365a03f6560407471b03cb

Debug

• 📕 Loki logs for namespace mon-psy-sante-renovate-all-dependencies-minor-patch-1en13t
• 📈 Pods monitoring for namespace mon-psy-sante-renovate-all-dependencies-minor-patch-1en13t
• 📈 Workloads monitoring for namespace mon-psy-sante-renovate-all-dependencies-minor-patch-1en13t
• 👮‍♂️ Project rancher mon-psy-sante-renovate-all-dependencies-minor-patch-1en13t

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[socket-security]

Updated dependencies detected. Learn more about Socket for GitHub ↗︎

Packages	Version	New capabilities	Transitives	Size	Publisher
@gouvfr/dsfr	1.3.1...1.11.0	None	+0/-0	82.4 MB
got	12.1.0...12.6.1	None	+9/-16	516 kB	sindresorhus

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication