Téléchargement de fichier (Download)

Utilisez le téléchargement pour proposer un fichier avec son format et son poids.

attention

Ce composant nécessite une licence Pro valide en production.

Information	Valeur
Niveau	Pro
Composants Twig	dsfr:download

Usage

• Renseignez le détail du fichier.
• Le lien doit pointer directement vers la ressource téléchargeable.

Modes d'utilisation

Exemple principal

Téléchargement de fichier · exemple principal

<twig:dsfr:download
  title="Télécharger le récapitulatif"
  href="/files/recapitulatif.pdf"
  detail="PDF - 240 Ko"
/>

Attributs HTML

Ajoutez vos attributs applicatifs directement sur le composant quand ils concernent le nœud racine rendu par le template.

Attributs pass-through

<twig:dsfr:download
  id="telechargement-de-fichier-example"
  class="fr-mt-2w"
  data-controller="telechargement-de-fichier"
/>

API publique

Composant	Rôle
dsfr:download	Composant principal de cette page.

Configuration

Option	Type	Défaut / requis	Valeurs et usage
title	string	Requis ou défaut selon composant	Titre visible du composant.
href	string|null	Selon composant	URL de destination. Les URL sont normalisées.
description	string|null	null	Description du document.
detail	string|null	null	Format et poids, par exemple PDF - 240 Ko.
lang	string|null	null	Langue du document.

Guide d'intégration

Question	Réponse
Famille DSFR	Interaction
Quand l'utiliser	Quand l’usager déclenche une action, ouvre une ressource, filtre une vue ou manipule une interaction ponctuelle.
Quand éviter	Pour structurer une page complète ou afficher un statut durable : utilisez plutôt un composant de contenu ou de feedback.
API publique	Utilisez uniquement les composants Twig listés sur cette page : dsfr:download.
Documentation DSFR	Consultez aussi la bibliothèque officielle : Système de Design de l'État.

Téléchargement de fichier : options, accessibilité et rendu DSFR

Variantes de téléchargement de fichier

• téléchargement de fichier avec attributs HTML pass-through pour id, class, data-* et aria-* quand le template le permet.

Points de contrôle propres à ce composant

• Renseignez le détail du fichier.
• Le lien doit pointer directement vers la ressource téléchargeable.
• Contrôlez le rendu lien/action selon la présence de href et le libellé annoncé au clavier.

Accessibilité interaction

• Le libellé d’action doit rester compréhensible hors contexte.
• Les icônes seules nécessitent un libellé accessible.
• Les actions indisponibles doivent utiliser disabled ou un état équivalent documenté.

Intégration Symfony/Twig pour dsfr:download

• Ajoutez vos attributs applicatifs (data-controller, data-action, aria-*, class) sur dsfr:download quand ils concernent son nœud racine.

Checklist de recette

• focus clavier visible
• libellé accessible vérifié
• état hover/focus/disabled cohérent
• rendu vérifié en thème clair et sombre ;
• rendu vérifié sur mobile, tablette et desktop ;
• aucune erreur dans le profiler DSFR ni dans l'inspecteur d'accessibilité du navigateur.

Erreurs fréquentes

Symptôme	Correction
Les classes DSFR semblent incomplètes	Utilisez les props du composant plutôt que des classes ajoutées à la main.
Le composant rend en local mais pas en production	Vérifiez la licence avec php bin/console dsfr:license:validate.