Problem/Motivation
The DSFR dropped its "Téléchargement de fichier" component in 1.10.0 (19 July 2023). The doc says: "Ce composant est déprécié. Son code n'étant plus maintenu à date, nous vous encourageons à cesser de l'utiliser."
A download is now an option of three components:
- link: class fr-link--download, download attribute, and the file detail in a span with the class fr-link__detail
- card: class fr-card--download
- tile: class fr-tile--download
Our theme still ships download_block, download_link and download_link_group, and they all use the old markup (fr-download, fr-download--card, fr-downloads-group). Our link, card and tile have no download option at all.
The old CSS classes are still in the library in 1.15.2, so nothing is broken today. But new sites get old markup, and there is no way to build a download card or a download tile.
Proposed resolution
1. link: add a "download" boolean prop (adds fr-link--download and the download attribute), a "detail" slot (a span with the class fr-link__detail, inside the link), and a "hreflang" prop for a file in another language.
2. card: add a "download" boolean prop (adds fr-card--download). The DSFR says the click must cover the whole card, so enlarge_link is turned on when it is not set. Setting it to false still works, for the fr-enlarge-button case.
3. tile: add a "download" boolean prop (adds fr-tile--download), with the same enlarge_link rule.
4. download_block, download_link and download_link_group keep their name, their props and their slots, but their twig now calls card, link and link_group. Old displays keep working and get the new markup for free. The group uses fr-links-group--download and fr-links-group--bordered, which are both in the library.
link_group needs a "title" slot and a "title_tag" prop for this, because download_link_group has them.
The three old components also get "status: deprecated" and a line in their description. New work should use card, link and tile.
Remaining tasks
- A story for each new download variant.
- Check the rules in css/overrides.css that target fr-download__detail.
- Report two mistakes in the DSFR doc: the tile page says fr-card--download and fr-card__details while its own example uses fr-tile--download and fr-tile__detail.
User interface changes
API changes
Additions only. Three new props, one new slot on link, one new slot and one new prop on link_group. Nothing is removed and nothing is renamed.
Issue fork ui_suite_dsfr-3620116
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #3
just_like_good_vibesComment #5
just_like_good_vibes