Changelog

Consultez les nouveautés et changements liés aux webcomposants sur la page dédiée

Design System

[1.41.0] - 2026-03-30

Fixed

  • Header générique : corrige le nom de la classe is-rotating du collapse dans le header agent en mobile

[1.40.0] - 2026-03-27

Added

  • Header générique : ajoute 4 layouts (ds-header.njk, ds-header-responsive.njk, ds-header-web.njk, ds-header-agent.njk)

Changed

  • Checkbox : ajoute le paramètre with-checked-bg par défaut

Fixed

  • Alert : met à jour le style des liens avec le Figma
  • Autocomplete : supprime le bouton Réinitialiser en doublon
  • Dialog : applique une taille maximale pour empêcher l'apparition d'une scrollbar en mobile uniquement sur la modale centrée
  • Input : améliore la restitution au lecteur d'écran du format dans le texte d'aide des variantes Date et Heure
  • Styles : corrige la gestion de l'affichage des webcomposants suivant leur état de chargement (.loading)

[1.39.0] - 2026-03-16

Added

  • Breadcrumb : ajoute une macro breadcrumbDark pour la version sombre
  • Modalside : ajoute un paramètre size pour gérer la taille du composant
  • Pagination : ajoute une macro paginationDark pour la version sombre

Changed

  • Link : renomme le composant @link--ghost en @link--dark

Removed

  • Link : supprime le composant @link--ext et la macro linkExternal() au profit du paramètre external: true
  • Modal : supprime les variantes de taille (xs, sm, lg) au profit du paramètre size
  • Modalside :
    • supprime la variante À gauche
    • supprime les variantes de taille (sm, lg, xl) au profit du paramètre size
  • Spinner : supprime les variantes de taille (xs, sm, lg) au profit du paramètre size

[1.38.0] - 2026-03-12

Added

  • Autocomplete : ajoute le webcomposant à la macro inputAutocomplete
  • Input : ajoute la variante Heure

Changed

  • Collapse : ajoute une transition sur le border-radius
  • Footer : supprime le lien "Mode d'emploi, le mag qui vous simplifie le travail"
  • Header : (version HTML) ajoute les pages "Jeunes" et le lien "Voir tous les métiers"
  • Input : positionne le texte d'aide en valeur par défaut plutôt que forcée pour la variante Date

Fixed

  • Select : retire un chevron superflu des option au sein d'un optgroup
  • Status : corrige la hauteur pour correspondre au DS Figma
  • Stepper : corrige la couleur de l'étape en sortie d'état hover et focus (version mobile)
  • Toaster : corrige le comportement avec un contenu vide

[1.37.0] - 2026-02-26

Added

  • Blockquote : ajoute le composant
  • Code : ajoute le composant
  • Picture : ajoute une macro pour générer une image disposant de plusieurs sources
  • Prose : ajoute le composant
  • Stepper : ajoute le composant en mode édition

Changed

  • Card news : ajoute une balise picture autour de l'image
  • Datepicker : réaligne le rendu des dates indisponibles avec le Figma
  • Header : (version HTML) modifie les items du blocs "les métiers" côté candidat
  • Modal side : fusionne les paramètres buttonsHeader et buttonsFooter en un unique paramètre buttons

Fixed

  • Card data : améliore la restitution du compteur au lecteur d'écran
  • Card news :
    • ajoute un h6 par défaut au titre
    • corrige la couleur du tag nouveau
    • précise le type "vidéo" au lecteur d'écran

Removed

  • Footer : (version HTML) supprime un lien côté candidat et pro
  • Header générique : masque le composant
  • Stepper : supprime le paramètre followScroll

[1.36.0] - 2026-02-18

Added

  • Icônes : ajoute les icônes sparkle et image

Changed

  • Refactor : homogénéise le modèle des macros de variantes avec celui des macros de base
  • Stepper : adapte le CSS pour simplifier les sélecteurs utilisés

Fixed

  • Alert : corrige l'alignement de l'icône, du titre et du bouton quand il n'y a pas de description
  • Captcha : corrige la couleur de fond, la typographie du label et la largeur max
  • Checkbox / Radio card : ajoute un paramètre clickIsExpanded afin de pouvoir étendre la zone de clic, et la limiter à la zone de gauche par défaut
  • Datepicker : affiche un tooltip au focus du champ lorsque le label est masqué
  • Dialog : ajoute une taille maximale pour empêcher l'apparition d'une scrollbar en mobile
  • Stepper :
    • ajoute une variante en mode "Édition (HTML)"
    • ajoute un exemple en mode "Édition version mobile (HTML)"
  • Tabs : corrige la couleur de texte des onglets (#2E2E31 au lieu de #5B5D65)

Removed

  • Tabs : supprime le padding spécifique sur l'onglet actif

[1.35.0] - 2026-02-12

Added

  • Button : ajoute des classes utilitaires pour transformer un bouton avec icône en bouton icône seule en responsive
  • Checkbox / Radio card : aligne verticalement le contenu de droite lorsqu'il ne contient qu'une ligne

Changed

  • Pagination : modifie la couleur de fond de l'item actif
  • Stepper : fixe la numérotation à gauche comme version par défaut

Fixed

  • Autocomplete : corrige l'accessibilité du composant
  • Card link : corrige le contraste du texte à l'état désactivé
  • Checkbox / Radio card :
    • applique la custom property appropriée pour changer la couleur de fond entre "Web" et "Outils agent"
    • supprime le facteur de rétrécissement de la zone gauche
  • Collapse : corrige les marges du contenu qui peut être ajouté avant et après le contenu principal
  • Label : applique la même couleur que celle du texte par défaut
  • Modal : corrige la taille de la version xl
  • Modal / modal side : réaligne les espacements des zones du header / body / footer avec le Figma

[1.34.0] - 2026-01-30

Added

  • Card link :
    • ajoute une macro et les variantes small et large
    • ajoute une macro legacy

Changed

  • Card data : modifie la couleur de fond au survol et à l'état désactivé, et celle du compteur de la variante Information
  • Card link : réaligne le rendu avec le Figma

Fixed

  • Checkbox / Radio : retire la mention (obligatoire) des groupes de champs en doublon avec l'astérisque au lecteur d'écran

[1.33.0] - 2026-01-28

Added

  • Button : ajoute une macro buttonViewMore
  • Collapse :
    • ajoute les exemples Défaut, Avec un fond gris, Petit, Accordéon et Filtre
    • réimplémente les exemples Avec un paragraphe semi-masqué et Avec une liste semi-masquée
  • Form : ajoute une macro requiredNote pour générer la mention en haut d'un formulaire

Fixed

  • Header : corrige le nom d'utilisateur connecté tronqué sur la hauteur
  • Tabs : change la taille de police des icones de 24px à 16px

[1.32.0] - 2026-01-22

Fixed

  • Badge : corrige une erreur de syntaxe pour les valeurs de fallback des custom properties

[1.31.0] - 2026-01-22

Added

  • Button :
    • ajoute le bloc rightContent
    • ajoute le bloc afterContent
    • complète la liste des paramètres avec afterContent, beforeContent, leftContentet rightContent
  • Icon :
    • ajoute les icônes par statut (information, avertissement, erreur, succès)
    • ajoute les couleurs dédiées pour chaque statut d'icône (ex: .icon.text-success)
  • Header : (version HTML) ajoute l'utilisateur connecté en mode maintenance
  • Tabs : ajoute la possibilité d'inclure un paramètre Badge dans les onglets

Fixed

  • Tabs : corrige la gestion de la couleur du composant Badge dans les onglets
  • Toaster : corrige le z-index pour afficher le composant par-dessus le header

[1.30.0] - 2026-01-16

Added

  • Accessibility center : ajoute une macro pour l'appel du webcomposant
  • Header : (version HTML) ajoute les thématiques au menu

Changed

  • Badge :
    • crée une macro et les macros des variantes
    • ajoute les classes badge-neutral et badge-notification
    • supprime la variante Défaut

Fixed

  • Bouton : corrige l'affichage du soulignement de la variante Bouton lien sur Firefox
  • Card data : corrige l'alignement du contenu lorsque plusieurs card-data sont côte à côte
  • Checkbox / Radio : corrige le chevauchement des fonds quand le texte passe sur plusieurs lignes
  • Collapse : corrige l'affichage de l'outline de la variante Avec un bouton lien lors du collapse
  • Tabs : ajoute { preventScroll: true } à l'appel de la fonction focus() dans tabs-init.js pour supprimer les scrolls indésirables via navigation clavier.

[1.29.0] - 2025-12-17

Fixed

  • Accessibility center : corrige le nom d'import absent dans _modal-accessibility.njk

[1.28.0] - 2025-12-16

Added

  • Fieldset : ajoute un astérisque aux groupes de champs obligatoires

[1.27.0] - 2025-12-16

Fixed

  • Toaster : supporte les toasters en version HTML statique et webcomposant

[1.26.0] - 2025-12-12

Added

  • Checkbox card : ajoute le composant
  • Form :
    • ajoute la macro fieldset
    • ajoute un astérisque aux champs obligatoires
  • Radio-card : ajoute le composant

Changed

  • Autocomplete : supprime la macro
  • Input : ajoute la gestion de l'autocomplétion JS à travers une variante de macro
  • Toaster : utilise le web component ft-alert

Fixed

  • Accessibility center : corrige plusieurs bugs graphiques remontés suite à l'intégration du web component
  • Button : corrige les couleurs entre l'icône et le texte dans la version désactivée
  • Checkbox : applique un name identique aux groupes de champs
  • Link : supprime un espace en trop entre le texte d'un lien externe et son icone associée
  • Pagination :
    • corrige la version désactivée du variant minimaliste
    • corrige le comportement responsive du variant minimaliste dans le composant modale side en lecture seule
  • Status : corrige la valeur de la couleur de fond par défaut

Removed

  • Datepicker : supprime la macro legacy
  • Formulaire : supprime la mention (facultatif)

[1.25.0] - 2025-12-02

Added

  • Icônes : ajoute les icônes suivantes
    • cable
    • legend-full
    • no-file
    • sidebar-collapse
    • sidebar-expand

Changed

  • Header : change la disposition des boutons dans le menu mobile

Fixed

  • Checkbox: corrige la couleur de fond dans l'état décoché et la couleur de la check dans l'état coché pour le variant Désactivé
  • Header : réaligne les exemples html avec le webco et l'UI kit
  • Tabs : corrige l'accessibilité dans les onglets par lien

Removed

  • Textarea : retire le paramètre counter au profit de maxlength pour activer le compteur de caractères

[1.24.0] - 2025-11-25

Added

  • Layout : ajoute le namespace ds
  • Paquet NPM :
    • ajoute un filtre assign
    • exporte tous les chemins des dossiers du paquet dans une propriété paths
  • Utils : ajoute la macro callOrRender qui appelle une macro via {% call macro() %} si un caller est fourni, sinon via {{ macro() }}

Fixed

  • Card data : permet de passer un caller aux macros de variantes (cardDataError, cardDataInformation, etc.)

[1.23.0] - 2025-11-19

Added

  • Card data : autorise le HTML passé au paramètre content

[1.22.0] - 2025-11-19

Added

  • Card data : ajoute une hauteur minimale sur le composant notamment pour le cas sans compteur

[1.21.0] - 2025-11-18

Added

  • Accessibility center : ajoute le composant
  • Card data : ajoute le composant

Fixed

  • Autocomplete : corrige l'affichage du bouton de suppression si la liste est au-dessus de l'input
  • Alert : supprime la balise strong dans le titre de l'alerte
  • Form : force un espace avant les messages requires / facultatifs s'ils sont affichés
  • Textarea : ajoute le nombre de caractères maximum dans le label

[1.20.0] - 2025-11-06

Added

  • Autocomplete : ajoute le paramètre tooltip
  • Input : ajoute le paramètre tooltip
  • Select : ajoute le paramètre tooltip
  • Textarea : ajoute le paramètre tooltip

[1.19.0] - 2025-11-05

Added

  • Table: ajoute un paramètre id sur les en-têtes de colonne

Changed

  • Layout : inclut le tag h1 dans le block title pour permettre la personnalisation complète de la zone
  • Tooltip : supprime la transition et le délai sur l'afficher/masquer

[1.18.0] - 2025-10-31

Added

  • Composants : ajoute un paramètre slot (nécessaire pour certains webcomposants)
  • Tag : ajoute les exemples rouge et jaune

Changed

  • Checkbox : améliore le "look and feel" de checkbox-mixed-controler dans le variant Indéterminé
  • Refactor : homogénéise l'organisation des macros (tri, nommage, nettoyage, etc.)

Fixed

  • Autocomplete : modifie la couleur au hover et rajoute une bordure au focus
  • Badge :
    • met à jour la version Désactivé
    • ajoute des custom properties dans styles.css
    • gère l'affichage automatique dans le composant Tabs en fonction de l'onglet actif
  • Icônes : met à jour les icônes info et info-full
  • Pagination : corrige le tag et role incorrects de la variante minimaliste
  • Toaster : masque complètement un toaster fermé

Removed

  • Hero : supprime le composant

[1.17.1] - 2025-10-15

Fixed

  • Autocomplete : corrige la valeur de l'attribut disabled
  • Select : corrige la valeur de l'attribut disabled
  • Switch : corrige la valeur de l'attribut disabled
  • Textarea : corrige la valeur de l'attribut disabled

[1.17.0] - 2025-10-14

Added

  • Dropdown : met à disposition le nécessaire pour que la directive dropdown fonctionne correctement en mode popover
  • Icon : ajoute la possibilité de renseigner un tooltip au survol d’une icône seule

Changed

  • Checkbox :
    • généralise l'ajout de la classe with-checked-bg dans les variants et exemples
    • ajoute un exemple personnalisable pour le multi-inline
  • Table : passe le border-radius à 12px pour s'aligner avec le DS Figma

Fixed

  • Footer : (version HTML) met à jour le libellé france-travail.io suite à la demande de la communication
  • Tabs : corrige le passage du paramètre class aux boutons/liens

[1.16.0] - 2025-09-24

Added

  • Select : permet d'ajouter un préfixe / suffixe (équivalent à ce qui est fait pour l'input)
  • Tag :
    • ajoute les classes utilitaire pour les couleurs :
      • Rose > tag-pink,
      • Violet > tag-purple,
      • Bleu > tag-blue,
      • Sable > tag-sand,
      • Gris > tag-gray,
    • ajoute des classes utlitaires pour les fonctions :
      • Déjà vu > tag-seen
      • Déjà contacté > tag-contact
      • Activités connues > tag-known-full-defaultt
      • Activités incomplètes > tag-known-uncomplete-default
    • surcharge les classes du profil de compétences avec les nouvelles classes :
      • tag-blanc > tag-commun,
      • tag-bleu-savoir > tag-savoir,
      • tag-bleu-savoir-complementaires > tag-savoir-complementaire,
      • tag-vert-savoir-etre-pro > tag-savoir-etre-professionnel,
      • tag-rose-langue > tag-langue,
      • tag-mauve-permis > tag-permis,
      • tag-marron-locomotion > tag-moyen-locomotion

Changed

  • Tag :
    • modifie la couleur du tag Nouveau (passe du vert au rose pastel)
    • modifie la couleur du tag par défaut pour n'avoir que des couleurs pastels (à part les exceptions Activités connues et Activités incomplètes)

Fixed

  • Tooltip : retire l'espace suite au changement du tag de l'élément p.tooltip-inner

Removed

  • Tag : supprime le CSS des versions high-contrast des couleurs de fond, qui ne correspondaient plus aux couleurs pastels
  • Tooltip : retire les styles dédiés à la gestion de la flèche

[1.15.0] - 2025-09-19

Added

  • Tag : permet d'ajouter du texte caché avant ou après le label du tooltip associé à l'icône
  • Font-icon : ajoute les icônes zoom-in et zoom-out

Fixed

  • Autocomplete : corrige la position du bouton Supprimer quand on fixe la max-width de l'input

[1.14.0] - 2025-09-15

Added

  • Button group : ajoute la macro du composant et de ses variantes
  • Button : ajoute la gestion d'un paramètre slot (besoin pour le bouton d'aide dans le ft-datepicker)
  • Datepicker : ajoute un param btnHelp au composant pour faciliter l'ajout de ce bouton commun à tous les éléments de formulaire dans le DS.
  • Input : ajoute les macros de variantes (date, email, mot de passe, numérique, téléphone)
  • Link : le contenu du param text est maintenant nettoyé de toutes balises HTML avant usage dans l'attribut title.

Changed

  • Input : fusionne les composants @input-group et @input-type avec @input
  • Progressbar :
    • Par défaut, le composant génère maintenant le webcomposant FTProgressbar
    • Migration maquettes existantes : le composant intègre maintenant la gestion d'un paramètre legacy { self: true } qui permet de basculer en mode composant statique.

Fixed

  • Button : corrige la fusion des classes passées en paramètre des variantes

Removed

  • Button group : supprime la variante Primaire pour s'aligner avec le Figma
  • Input group : supprime le composant au profit du composant @input
  • Input type : supprime le composant au profit du composant @input

[1.13.0] - 2025-09-08

Changed

  • Card form : renomme le composant @carte-formulaire en @card-form
  • Card intro : renomme le composant @block-indispo en @card-intro
  • Card news : renomme le composant @block-news en @card-news
  • Dashboard link : renomme le composant @service-link en @dashboard-link
  • Stepper : le composant automatiquement l'ID etape-1-stepper-vertical, ce n'est plus le cas, et il n'ajoute plus d'ID par défaut.

Fixed

  • Stepper / Stepper Template : Si un ID est fourni dans la configuration, la version mobile est automatiquement suffixée avec -mobile pour éviter les erreurs W3C du fait d'ID identiques.

[1.12.1] - 2025-09-04

Fixed

  • Tag : retire l'attribut role si l'icône n'a pas de tooltip

[1.12.0] - 2025-09-01

Added

  • Button : ajoute la possibilité de générer les attributs "legacy" (Bootstrap, data-toggle, etc.) ou webcomposant (data-ft-modal-toggle) pour une modale (notamment pour le bouton d'aide)

Changed

  • Card form :
    • diminue le padding du container principal sur mobile
    • sur le footer, supprime la classe utilitaire p-3
    • gérer le padding directement en CSS spécifique (16px haut/bas + 24px gauche/droite)
    • agrandi l'espacement entre les boutons à 12px
    • synchronise le aria-label avec l'intitulé du bouton (variant Activité connue incomplète)
  • Datepicker : corrige un bug critique d'affichage du dialog sur FF 142
  • Status :
    • modifie l'icône du statut information (info-full)
    • ajoute les macros de variantes
    • renomme la variante @status--info en @status--information
    • supprime les variantes "lg"
  • Tag : améliore la restitution du tooltip aux lecteurs d'écran
  • Progressbar : migre le composant vers la version webco

Fixed

  • Card form : ajoute une gestion dynamique des marges entre les blocs du composant via flex + gap

Removed

  • Browserslist : retire la gestion de FF52 pour le CSS

[1.11.0] - 2025-08-13

Added

  • Pagination mini : ajoute un paramètre itemType pour configurer le type d'élément paginé (Page par défaut);

Changed

  • Button : retire la valeur par défaut du paramètre version permettant la personnalisation complète des classes
  • Gabarit modal side et Modal side : ajoute la gestion d'un nouveau paramètre pagination à l'objet modal pour customiser les title et label de la @pagination mini
  • Table : refactor la macro table pour simplifier la configuration des tableaux (homogénéisation de l'API, caller, en-têtes personnalisables, état en chargement, etc.)

Fixed

  • Tabs : ajoute une sécurité pour que le script d'init soit plus résilient et informatif

[1.10.1] - 2025-08-06

Fixed

  • Styles :
    • Tags: allège le poids de la règle introduite en v1.9.0 pour corriger des régressions dans des projets existants.

[1.10.0] - 2025-08-04

Added

  • Card error : ajoute un composant Card error utilisant le webcomposant FTCardError pour les messages d'erreurs HTTP 403, 404 et 503
  • Skip link : ajoute la macro du composant
  • Table : ajoute le webcomposant ft-tablesort sur les en-têtes de colonnes triables

Fixed

  • Booking et Header–pro-auth: fige les dates qui étaient jusqu'à alors générées à chaque release et créaient des faux diff.
  • Table :
    • l'en-tête d'une colonne contenant un bouton de tri s'agrandit suivant son contenu
    • retire l'espace superflu entre les boutons d'action contenus dans un tableau

Removed

  • Card intro : BREAKING CHANGE - supprime les variantes @block-indispo--404 et @block-indispo--service (utiliser @block-indispo pour personnaliser les contenus ou @card-error)

[1.9.0] - 2025-07-28

Added

  • Alert : ajoute les macros de variantes
  • Label : ajoute la macro du composant
  • Layout main : ajoute un script qui va automatiquement mettre la classe outil-agent sur les webco de la page si les classes conseiller ou outil-agent sont détéctées sur le <body>

Fixed

  • Card news : corrige le chemin de l'image
  • Styles :
    • Links : la taille de l'icône de liens externes s'adapte maintenant à la taille de police du lien en fonction de l'environnement web ou outil-agent
    • Tag :
      • Sur les classes de tag existantes : Force la couleur --ft--color-text-color par défaut, la graisse à 400 et le text-shadow à none pour éviter des impacts des éléments ou ils sont intégrés.

[1.8.0] - 2025-07-22

Added

  • Button :
    • ajoute une transition sur le changement de couleur de .prefix à l'intérieur de .btn-sort
    • ajoute les macros par variante (buttonAllFilters, buttonClose, etc.)
  • Link : ajoute la macro du composant et ses variantes

Fixed

  • Alert : préserve la largeur du bouton de fermeture, peu importe le volume de contenu dans le body
  • Styles :
    • FTHeader: ajoute un display block sur le ft-header:defined pour que le sticky fonctionne mieux sur Firefox
    • Font-icônes: corrige l'icône Folder qui ne s'affichait pas correctement au niveau du label de l'intercalaire
  • Dropdown :
    • adapte le CSS pour la mise à jour du variant dropdown--checkbox (Avec des cases à cocher)
    • corrige la structure du variant dropdown--checkbox (Avec des cases à cocher)
  • Icônes :
    • Corrige et optimise le SVG pour l'icône Folder qui ne s'affichait pas correctement au niveau du label de l'intercalaire

[1.7.0] - 2025-07-09

Added

  • Datepicker : ajoute la gestion du popover et du fallback pour les navigateurs qui ne supporte pas l'attribut

Fixed

  • Styles :
    • les animations étaient minifiées, ce n'est plus le cas.
    • applique un nouveau padding top + bottom uniquement sur les textarea et input pour corriger une régression des <select> sur l'univers conseiller / outils-agent
    • corrige et complète la liste des webcomposants pour gérer leur FOUCE

[1.6.0] - 2025-07-04

Added

  • Header :
    • (version HTML) ajoute la modale de connexion par profil en version mobile
    • (version HTML) utilise les directives dropdown et modal à la place des composants JS Bootstrap
  • Styles : ajoute le CSS nécessaire pour avoir le collapse en mobile et pas en desktop
  • Button :
    • ajoute une macro de variante du bouton d'aide
    • ajoute un paramètre modal pour utiliser la directive (sur le même modèle que les paramètres dropdown et tooltip)
  • Modal :
    • ajoute une macro d'attributs (modalAttr)
    • ajoute un paramètre staticBackdrop qui permet de fermer la modale via un clic sur le backdrop
  • Progressbar : ajoute une custom property --ft--progressbar-bg-color pour permettre de gérer la couleur de la progressbar

Changed

  • Styles :
    • passe le padding y des textareas et input de 6 à 9px pour s'aligner avec le Figma
    • ajuste les gaps entre les différents éléments des sections en mobile et desktop
  • Dropdown : renomme la macro d'attributs (dropdown => dropdownAttr)
  • Tooltip : renomme la macro d'attributs (tooltip => tooltipAttr)
  • Progressbar : supprime toutes les variantes conformément au Figma. (Conserve dans le paquet la variante "infinite" actuellement utilisée sur 2 maquettes le temps de déterminer si on fait la migration.)

Fixed

  • Header :
    • (version HTML) modifie le niveau de titre sur "Actualités thématiques" en h2
    • (version HTML) englobe le menu mobile dans un <nav role="navigation"> (et retire les nav imbriqués à ce menu mobile)
    • (version HTML) masque aux lecteurs d'écran le titre "Menu de navigation" en mobile
    • modifie la couleur de fond du bloc de connexion entreprise pour améliorer le contraste
    • corrige l'affichage tronqué du dropdown menu mobile sur Safari
    • prévoit un moyen de mettre le body en overflow hidden lorsque le dropdown menu est ouvert
  • Select, Textarea, Autocomplete : ajoute le formRequireHelper aux composants
  • Radio et checkbox :
    • propose un correctif pour que le navigateur "ignore" les interactions avec le pseudo element :before qui fait le background gris
    • corrige la règle qui réserve de l'espace à droite du label pour les btn-help
    • améliore le contraste sur les versions avec background
    • améliore le focus sur les versions sans background en reprenant le modèle de la version AVEC background
  • Textarea, Autocomplete, checkbox, input-group, input, radio, select : reprend le texte du label dans les tooltips des boutons d'aide
  • Textarea : améliore la concaténation des attributs
  • Spinner : corrige la couleur dans un bouton primary

[1.5.0] - 2025-06-18

Fixed

  • Paquet NPM : empêche le contexte global injecté à un composant de surcharger l'objet params du composant
  • Modal : corrige la configuration des boutons en ajoutant la gestion des paramètres hide de la FTmodal

Removed

  • Checkbox : supprime la variante @checkbox--required (astérisque)
  • Radio : supprime la variante @radio--required (astérisque)

[1.4.0] - 2025-06-17

Added

  • Button : définit le paramètre vocalize à false par défaut pour l'infobulle d'un bouton avec icône seule
  • Header : corrige l'alignement du titre avec le bouton de fermeture des modalside

Fixed

  • Toaster : retire l'utilisation d'une variable roleAttr inutile qui pouvait faire planter la compilation dans certais cas.
  • Paquet NPM : corrige enfin la visibilité du contexte globale dans l'exécution du composant, notamment pour ceux qui ont en paramètre une URL d'include (ext tabs, ou carte-formulaire)
  • Radio et checkbox : corrige un soucis de z-index pour les cas avec background gris pour les composants dans les contenus imbriqués qui pouvaient "déborder" de la zone (ex Datepicker ou Dropdown).

[1.3.0] - 2025-06-11

Added

  • Select : ajoute la possibilité d'avoir un attribut title

Changed

  • Stepper : modifie la variante @stepper--left avec la classe pré-définie pour aligner la numérotation à gauche

Fixed

  • Stepper : modifie le display du webcomposant en block permettant notamment d'y appliquer des marges
  • Checkbox multi : Ajoute une classe utilitaire "elevate-zindex" à appliquer sur les items "with-checked-bg.form-check" pour permettre d'augmenter le z-index d'un item qui doit être au dessus des autres, notamment quand il contient une dropdown ou un datepicker.
  • Select : déplace l'attribut autocomplete sur l'élément select

[1.2.0] - 2025-06-06

Added

  • Alert : aligne l'apparence du bouton de fermeture (.btn-tertiary) avec le design
  • Stepper :
    • utilise le webcomposant dans la macro au lieu de la version html statique
    • modifie la configuration pour la version mobile dans les layouts gabarit-train-etapes et gabarit-stepper

[1.1.0] - 2025-05-26

Added

  • Booking : ajoute le CSS du skeleton pour ce nouveau composant

Fixed

  • Datepicker : supprime le message d'alerte sur le legacy
  • Stepper Template : supprime un titre en doublon
  • Spinner : corrige le contraste de la couleur du composant

[1.0.0] - 2025-05-15

  • Release initiale

CDN

[1.9.0] - 2026-04-01

Added

  • Logos : ajoute les fichiers
    • logos/applications/Portail-du-developpement.svg
    • logos/applications/MAP-Document.svg
    • logos/applications/MAP-Formation.svg

Changed

  • CSS : met à jour design-system/css/styles.css@1.41.0
  • Illustrations : met à jour les fichiers
    • design-system/illustrations/spots/calendar.svg
  • Logos : met à jour les fichiers
    • logos/applications/Supervision-3949.svg
    • logos/applications/Supervision-3995.svg

[1.8.0] - 2026-03-04

Added

  • Logos : ajoute les fichiers
    • logos/applications/SOPHIE.svg
    • logos/applications/Enquete-Barometre-Operationnel-Agence.svg
    • logos/applications/Mobise.svg
    • logos/applications/NOAS.svg

Changed

  • CSS : met à jour
    • design-system/css/styles.css@1.37.0
    • legacy/css/map-base.css
  • Fonts : met à jour design-system/fonts/ft-icons.woff2
  • Logos : met à jour logos/applications/Snow.svg
  • Mailing : ajoute mailing/header-mon-portail-pro.png

[1.7.0] - 2026-02-04

Added

  • Mailing : ajoute les fichiers
    • mailing/spots/smartphone.png
    • mailing/icon-calendar.png
    • mailing/icon-clock.png
    • mailing/icon-pinmap.png
  • Logos : ajoute les fichiers
    • logos/applications/Aegis.svg
    • logos/applications/favicons/PCM/android-chrome-192x192.png
    • logos/applications/favicons/PCM/android-chrome-512x512.png
    • logos/applications/favicons/PCM/apple-touch-icon.png
    • logos/applications/favicons/PCM/favicon.ico
    • logos/applications/favicons/PCM/favicon.svg
    • logos/applications/favicons/PCM/manifest.json
    • logos/applications/PDP.svg
    • logos/applications/SOS.svg
  • Illustrations : ajoute les fichiers
    • design-system/illustrations/spots/door.svg
    • design-system/illustrations/spots/gear.svg
    • design-system/illustrations/spots/info-point.svg
    • design-system/illustrations/spots/senior.svg

Changed

  • CSS : met à jour design-system/css/styles.css@1.34.0
  • Logos : met à jour logos/applications/URSSAF.svg

[1.6.0] - 2025-12-17

Added

  • Fonts : livre ft-icons.woff2 avec de nouvelles icônes
    • cable
    • legend-full
    • no-file
    • sidebar-collapse
    • sidebar-expand
  • Illustrations : ajoute design-system/illustrations/spots/no-files.svg
  • Logos : ajoute les fichiers
    • logos/applications/ADEDA.svg
    • logos/applications/AudioConf.svg
    • logos/applications/GXX.svg
  • Mailing : ajoute les fichiers
    • mailing/illo-id.png
    • mailing/warning-full.png

Changed

  • CSS : met à jour design-system/css/styles.css@1.28.0
  • Logos : renomme Cap-visibilite.svg en Opportunites-agence.svg

[1.5.0] - 2025-11-19

Added

  • Fonts : ajoute les polices pour les dyslexiques dans design-system/fonts/opendyslexic/
  • Illustrations : ajoute design-system/illustrations/spots/shield.svg

Changed

  • CSS : met à jour les fichiers
    • design-system/css/styles.css@1.23.0
    • legacy/css/map-base.css (met à jour les couleurs de tags)
  • Fonts : met à jour les icônes info et info-full dans design-system/fonts/ft-icons.woff2
  • Illustrations : met à jour design-system/illustrations/spots/theater.svg

[1.4.0] - 2025-09-25

Added

  • Illustrations : ajoute les fichiers
    • design-system/illustrations/spots/app-mobile-mon-espace.svg
    • design-system/illustrations/spots/desktop.svg
    • design-system/illustrations/spots/dock.svg
  • Mailing : ajoute mailing/spots/folder-time.svg

Changed

  • CSS : met à jour les fichiers
    • legacy/css/map-base.css
    • design-system/css/styles.css@1.16.0
  • Fonts : met à jour les fichiers
    • design-system/fonts/ft-icons.woff2
    • design-system/fonts/ft-icons-cms.json

[1.3.0] - 2025-09-04

Added

  • Autres : ajoute logos/autres/handimatch.svg
  • Illustrations : ajoute les fichiers
    • design-system/illustrations/spots/box.svg
    • design-system/illustrations/spots/delivery.svg
    • design-system/illustrations/spots/keyboard.svg
    • design-system/illustrations/spots/print.svg
    • design-system/illustrations/spots/profil-valid.svg
    • design-system/illustrations/spots/question.svg (remplacera à terme question-woman.svg)
    • design-system/illustrations/spots/scanner.svg
    • design-system/illustrations/spots/screen.svg
    • design-system/illustrations/spots/search-profil.svg
  • Logos : ajoute les fichiers
    • logos/applications/MAP-Secours.svg
    • logos/applications/Opportunite.svg

Changed

  • Illustrations : met à jour les fichiers
    • design-system/illustrations/spots/assistance.svg
    • design-system/illustrations/spots/empty.svg
    • design-system/illustrations/spots/okay.svg
    • design-system/illustrations/spots/question-woman.svg
  • Logos : met à jour les fichiers
    • logos/applications/Lmair.svg
    • logos/applications/Omere.svg
    • logos/applications/Osiris.svg
    • logos/applications/Selection-de-population.svg

[1.2.0] - 2025-08-07

Added

  • Illustrations : ajoute les fichiers
    • design-system/illustrations/spots/celebration.svg
    • design-system/illustrations/spots/saving-money.svg
    • design-system/illustrations/spots/sign-file.svg
    • design-system/illustrations/spots/users-group.svg
  • Logos : ajoute les fichiers
    • logos/applications/ABC-DSI.svg
    • logos/applications/C-Zam.svg
    • logos/applications/SelfService.svg
    • logos/applications/Trajectoire-Bas-Carbone.svg

Changed

  • CSS : met à jour design-system/css/styles.css@1.10.1
  • Illustrations : met à jour design-system/illustrations/spots/advisor-woman.svg
  • Logos : met à jour les fichiers
    • logos/applications/Activ-IT.svg
    • logos/applications/Agenda.svg
    • logos/applications/Explor-metiers.svg
    • logos/applications/Facility.svg
    • logos/applications/Snow.svg
    • logos/applications/Time-IT.svg

Fixed

  • CSS : corrige le positionnement sticky du header sur Firefox dans legacy/css/theme-france-travail.css
  • Fonts : corrige l’icône folder dans design-system/fonts/ft-icons.woff2

[1.1.0] - 2025-07-10

Added

  • Logos : ajoute les fichiers
    • logos/applications/Explor-metiers.svg
    • logos/applications/FNIG.svg
    • logos/applications/Suivi-des-usagers.svg

Changed

  • Logos : met à jour les fichiers
    • logos/applications/3949.svg
    • logos/applications/3995.svg
    • logos/applications/Agenda.svg
    • logos/applications/favicons/Agenda
    • logos/applications/Supervision-3949.svg
    • logos/applications/Supervision-3995.svg

Fixed

  • Général : optimise les images
    • design-system/illustrations/spots/at.svg
    • design-system/illustrations/spots/atom.svg
    • design-system/illustrations/spots/book-hp.svg
    • design-system/illustrations/spots/car.svg
    • design-system/illustrations/spots/civi.svg
    • design-system/illustrations/spots/development.svg
    • design-system/illustrations/spots/file-download.svg
    • design-system/illustrations/spots/handicap.svg
    • design-system/illustrations/spots/key-illu.svg
    • design-system/illustrations/spots/knowledge.svg
    • design-system/illustrations/spots/palette.svg
    • design-system/illustrations/spots/payment-hp.svg
    • design-system/illustrations/spots/profil.svg
    • design-system/illustrations/spots/restauration.svg
    • design-system/illustrations/spots/roadsign-hp.svg
    • design-system/illustrations/spots/search-hp.svg
    • design-system/illustrations/spots/theater.svg
    • legacy/css/gfx/background-dashboard.svg
    • legacy/css/gfx/external-link.svg
    • legacy/css/gfx/home-hover-yellow.svg
    • legacy/css/gfx/home-hover.svg
    • legacy/css/gfx/home.svg
    • legacy/css/gfx/icn-dropdown-menu-up.svg
    • legacy/css/gfx/icn-dropdown-menu-vue-de.svg
    • legacy/css/gfx/icn-dropdown-menu.svg
    • legacy/css/gfx/user-bottom-arrow.svg
    • logos/applications/Accueil-sur-site-France-Travail.svg
    • logos/applications/Activ-it.svg
    • logos/applications/AENA.svg
    • logos/applications/Astec.svg
    • logos/applications/board.svg
    • logos/applications/Budi.svg
    • logos/applications/Cap-emploi.svg
    • logos/applications/CAROe-CG.svg
    • logos/applications/CEJ-BO.svg
    • logos/applications/Chorus.svg
    • logos/applications/Czam.svg
    • logos/applications/Diane.svg
    • logos/applications/Digiparcours.svg
    • logos/applications/Emploi-2024.svg
    • logos/applications/Facility.svg
    • logos/applications/favicons/Agenda/android-chrome-192x192.png
    • logos/applications/favicons/Agenda/android-chrome-512x512.png
    • logos/applications/favicons/Agenda/apple-touch-icon.png
    • logos/applications/favicons/Aide-ROME/android-chrome-192x192.png
    • logos/applications/favicons/Aide-ROME/android-chrome-512x512.png
    • logos/applications/favicons/Aide-ROME/apple-touch-icon.png
    • logos/applications/favicons/Aide-ROME/favicon.svg
    • logos/applications/favicons/oscar/android-chrome-192x192.png
    • logos/applications/favicons/oscar/android-chrome-512x512.png
    • logos/applications/favicons/oscar/apple-touch-icon.png
    • logos/applications/favicons/oscar/favicon.svg
    • logos/applications/favicons/Recherche-de-profils/android-chrome-192x192.png
    • logos/applications/favicons/Recherche-de-profils/android-chrome-512x512.png
    • logos/applications/favicons/Recherche-de-profils/apple-touch-icon.png
    • logos/applications/favicons/Recherche-de-profils/favicon.svg
    • logos/applications/France-Travail-negatif.svg
    • logos/applications/France-Travail.svg
    • logos/applications/FT-simulateurs.svg
    • logos/applications/FT.fr-actualisation.svg
    • logos/applications/FT.fr-espace-perso.svg
    • logos/applications/FT.fr-metier-scope.svg
    • logos/applications/FT.fr.svg
    • logos/applications/FT.org.svg
    • logos/applications/Gate.svg
    • logos/applications/GEC-DG.svg
    • logos/applications/Grand-compte.svg
    • logos/applications/GraphInvest.svg
    • logos/applications/Horoquartz-formation.svg
    • logos/applications/Identification-Utilisateurs-AFT.svg
    • logos/applications/Intranet.svg
    • logos/applications/Juris-appui.svg
    • logos/applications/MAP-Activite-evenements-client.svg
    • logos/applications/MAP-Attestation-de-paiement.svg
    • logos/applications/MAP-Changer-de-metier.svg
    • logos/applications/MAP-Entretiens.svg
    • logos/applications/MAP-Liste-des-dossiers-de-suivi.svg
    • logos/applications/MAP-Prestations-financieres.svg
    • logos/applications/MAP-Rendez-vous.svg
    • logos/applications/Microsoft-Dynamics.svg
    • logos/applications/MRS.svg
    • logos/applications/ODSPEP.svg
    • logos/applications/Phebus-Fichier.svg
    • logos/applications/Phebus-Message.svg
    • logos/applications/Portefeuille-DAC.svg
    • logos/applications/Recherche-de-profils.svg
    • logos/applications/Recherche-offres.svg
    • logos/applications/Reglement-appui.svg
    • logos/applications/Salesforce.svg
    • logos/applications/Securisation-des-listes-de-contacts.svg
    • logos/applications/Simulation-de-la-masse-salariale.svg
    • logos/applications/Simulation-reprise-demploi.svg
    • logos/applications/Sirhus.svg
    • logos/applications/STMT.svg
    • logos/applications/Supervision-3995.svg
    • logos/applications/Time-it.svg
    • logos/applications/Weplan.svg
    • logos/autres/employeur-handi-engage.svg
    • logos/marque/favicon/favicon-180x180.png
    • logos/marque/favicon/favicon.svg
    • logos/marque/Logo_France_Travail_Pro_RVB_Horizontal_Coul_Negatif.svg
    • logos/marque/Logo_France_Travail_Pro_RVB_Horizontal_Coul_Positif.svg
    • logos/marque/Logo_France_Travail_Pro_RVB_Horizontal_Gris_Negatif.svg
    • logos/marque/Logo_France_Travail_Pro_RVB_Horizontal_Gris_Positif.svg
    • logos/marque/logo-ft-inte.svg
    • logos/marque/logo-ft-preprod.svg
    • logos/marque/logo-ft-pro-inte.svg
    • logos/marque/logo-ft-pro-preprod.svg
    • logos/marque/logo-ft-pro-recette.svg
    • logos/marque/logo-ft-recette.svg
    • logos/marque/Symbole_France_Travail_RVB_Coul_Negatif.svg
    • logos/mobile/app-store-link-white.png
    • logos/mobile/app-store-link-white.svg
    • logos/mobile/app-store-link.svg
    • logos/mobile/google-play-link-white.png
    • logos/mobile/google-play-link-white.svg
    • logos/mobile/google-play-link.svg
    • logos/mobile/je-recrute/je-recrute-app.svg
    • logos/mobile/ma-formation/ma-formation-app.svg
    • logos/mobile/mes-offres/mes-offres-app.svg
    • logos/mobile/mon-espace/mon-espace-app.png
    • logos/mobile/mon-espace/mon-espace-app.svg
    • logos/mobile/parcours-emploi/parcours-emploi-app.png
    • logos/mobile/parcours-emploi/parcours-emploi-app.svg
    • logos/partenaires/cap-emploi/CAP-EMPLOI_LOGO-BLOC-BASELINE-2-rvb.svg
    • logos/partenaires/cap-emploi/CAP-EMPLOI_LOGO-BLOC-rvb.svg
    • logos/partenaires/missions-locales/ML_logo_court_rvb.svg
    • logos/partenaires/missions-locales/ML_logo_long_rvb.svg
    • logos/partenaires/reseau-pour-emploi/RPE-blanc.svg
    • logos/partenaires/reseau-pour-emploi/RPE.svg
    • logos/services-digitaux/academie-ft/academie-ft.svg
    • logos/services-digitaux/actu-formation/actu-formation-app.svg
    • logos/services-digitaux/actu-formation/actu-formation.svg
    • logos/services-digitaux/anotea/anotea-app.svg
    • logos/services-digitaux/anotea/anotea.svg
    • logos/services-digitaux/data-emploi/data-emploi-app.svg
    • logos/services-digitaux/data-emploi/data-emploi.svg
    • logos/services-digitaux/emploi-store/emploi-store-app.svg
    • logos/services-digitaux/emploi-store/emploi-store.svg
    • logos/services-digitaux/emploi-store/favicon/favicon.svg
    • logos/services-digitaux/espace-personnel/espace-personnel-app.svg
    • logos/services-digitaux/guso/favicon/favicon.svg
    • logos/services-digitaux/guso/guso-app.svg
    • logos/services-digitaux/guso/guso.svg
    • logos/services-digitaux/io/io-app.svg
    • logos/services-digitaux/io/io.svg
    • logos/services-digitaux/kairos/favicon/favicon.svg
    • logos/services-digitaux/kairos/kairos-app.svg
    • logos/services-digitaux/kairos/kairos.svg
    • logos/services-digitaux/la-bonne-boite/la-bonne-boite-app.svg
    • logos/services-digitaux/la-bonne-boite/la-bonne-boite.svg
    • logos/services-digitaux/mes-aides/mes-aides-app.svg
    • logos/services-digitaux/mes-aides/mes-aides.svg
    • logos/services-digitaux/mes-evenements/mes-evenements-app.svg
    • logos/services-digitaux/mes-evenements/mes-evenements.svg
    • logos/services-digitaux/metierscope/metierscope-app.svg
    • logos/services-digitaux/mon-portail-pro/favicon/favicon.svg
    • logos/services-digitaux/mon-portail-pro/mon-portail-pro-app.svg
    • logos/services-digitaux/mon-portail-pro/mon-portail-pro.svg
    • logos/services-digitaux/salon-en-ligne/salon-en-ligne-app.svg
    • logos/services-digitaux/salon-en-ligne/salon-en-ligne.svg
    • logos/services-digitaux/sphere-emploi/sphere-emploi-app.svg
    • logos/services-digitaux/sphere-emploi/sphere-emploi.svg
    • mailing/app-store-white-badge.svg
    • mailing/header_FT-graphic.png
    • mailing/header_FTPro-bloc-marque.png
    • mailing/header_FTPro-graphic.png
    • mailing/header-FT-Pro.png
    • mailing/header-FT.png
    • mailing/header-mon-portail-pro.png
    • mailing/icon-file-content-grey-lg.png
    • mailing/icon-file-content.png
    • mailing/icon-handout.png
    • mailing/icon-lock.png
    • mailing/icon-shield.png
    • mailing/info-full.png
    • mailing/inscription-illustration.png

[1.0.0] - 2025-06-12

Added

  • Logos : ajoute les fichiers
    • logos/applications/Brevo.svg
    • logos/applications/Cap-emploi.svg
    • logos/applications/Facility.svg
    • logos/applications/favicons/Agenda
    • logos/applications/Microsoft-Dynamics.svg

Changed

  • Logos : met à jour logos/applications/Salesforce.svg

[DS25-S21] - 2025-05-22

Added

  • Illustrations : ajoute les fichiers
    • design-system/illustrations/spots/car.svg
    • design-system/illustrations/spots/empty.svg
    • design-system/illustrations/spots/handicap.svg
    • design-system/illustrations/spots/magic.svg
    • design-system/illustrations/spots/profil.svg
    • design-system/illustrations/spots/restauration.svg
    • design-system/illustrations/spots/roadsign-hp.svg (version couleur de roadsign.svg spécifique pour la HP)

Changed

  • Illustrations : met à jour les fichiers
    • design-system/illustrations/spots/at.svg
    • design-system/illustrations/spots/atom.svg
    • design-system/illustrations/spots/book-hp.svg
    • design-system/illustrations/spots/development.svg
    • design-system/illustrations/spots/key-illu.svg
    • design-system/illustrations/spots/knowledge-full.svg
    • design-system/illustrations/spots/knowledge.svg
    • design-system/illustrations/spots/palette.svg
    • design-system/illustrations/spots/payment-hp.svg
    • design-system/illustrations/spots/search-hp.svg

Fixed

  • Fonts : corrige l’icône status-clock-full, par erreur l’icône avait été importée en tant que Status-icon-clock-full et utilisée dans des maquettes, on ajoute donc la classe icon-clock-full en plus