Composants du DSFR

Cette gem fournit des composants pour le Design Système de l'État (DSFR) en s'appuyant sur le framework ViewComponent.

C'est un fork de govuk-components qui propose l'équivalent pour le GOV.UK Design System.

Développement en cours ⚠️

Cette gem est en cours de développement et n'est pas encore recommandée pour un usage en production.

N'hésitez pas à contribuer pour nous aider à avancer, un générateur de composant est même fourni pour vous faciliter la tâche :

bin/rails g dsfr_component FancyButton --params title:String count:Integer

Documentation

Un guide complet est disponible. Il contient des instructions pour l'installation et l'usage de cette gem. Les exemples présents éxecutent le code et seront donc toujours à jour.

Installation

Pour utiliser cette gem dans votre application Rails, il faut ajouter cette ligne dans config/application.rb:

require "dsfr/components"

Composants disponibles

Cette gem a pour but de supporter tous les composants proposés par le Design Système de l'État hormis ceux concernant les formulaires. Ceux-ci seront fournis dans une gem indépendante dans le futur.

11/36 composants sont disponibles :

• [x] Accordéon - Accordion
• [x] Alertes - Alert
• [x] Badge
• [ ] Bandeau d'information importante
• [ ] Barre de recherche - Search bar
• [x] Boutons - Buttons
• [ ] Groupe de bouton
• [ ] Bouton FranceConnect
• [ ] Cartes - Cards
• [ ] Citation - Quote
• [ ] Contenu médias - Responsive médias
• [x] En-tête - Header
• [ ] Fil d'Ariane - Breadcrumb
• [ ] Gestionnaire de consentement - Consent banner
• [ ] Icônes de favoris - Favicons
• [x] Indicateur d'étape - Stepper
• [ ] Interrupteur - Toggle switch
• [ ] Lettre d'information et réseaux sociaux - Newsletter & Follow us
• [x] Liens - Links
• [ ] Liens d'évitement - Skiplinks
• [ ] Menu latéral - Side menu
• [ ] Mise en avant - Call out
• [ ] Mise en exergue - Highlight
• [x] Modale - Modal
• [ ] Navigation principale - Main navigation
• [x] Onglets - Tabs
• [ ] Pagination
• [ ] Paramètres d'affichage - Display
• [ ] Partage - Share
• [ ] Pied de page - Footer
• [ ] Sélecteur de langue
• [ ] Sommaire - Summary
• [ ] Tableau - Table
• [x] Tag
• [ ] Téléchargement de fichier
• [x] Tuile - Tile

Services utilisant cette gem

• Collectif Objets - code source

Contribuer

Nous conseillons d'utiliser rbenv pour gérer vos versions de ruby :

rbenv local 3.1.2
rbenv install

Lancer les tests :

bundle install
bundle exec rspec spec

Pour développer avec les tests en continu :

bundle exec guard

Lancer le guide de documentation :

make watch-guide

Lancer la dummy app pour itérer sur les composants :

cd spec/dummy
bundle install && npm install
bundle exec rails server

Déployer une nouvelle version de la gem :

VERSION=1.3.2 make deploy_gem

Licence

Le code source et la gem sont ouverts sous la licence MIT.