svelte-dsfr vise un portage en Sveltekit du Système de Design Français (ou DSFR) sous forme de bibliothèque de composants.
La démarche est très inspirée de vue-dsfr par @laruiss (merci!), dont la qualité de la construction nous permet une reproduction à 90% par simple portage des composants de Vue en Svelte.
- articulation maximale au dsfr
- modularité (possiblité de ne pas tout importer)
- tests unitaires
- test ui
- tests visuels de composants (pour ux/ui)
- build: sveltekit + vite
- langage: typescript
- icônes: remix-icon via @iconify/svelte
- css & fontes: inclusion via postcss (éviter le css hardcodé)
- tests unitaires : jest
- component explorer: Storybook
- tests ui: playwright
- tests accessibilité: axe-playwright ou pa11y ?
-
Porter les composants coeurs: Buttons, Inputs, Header, Forms, Footer
En cours ! N'offre aucune pérennité dans les interfaces à ce stade. L'objectif est de faire une mini demo Cette première étape est une "recopie" des composants
vue-dsfr
avec un portage minimaliste.
Indispensables :
- Les icônes (@iconify/svelte)
- Le scaffolding css doit être ajouté en plus à cette étape
- La publication npm doit être initiée
Non pris en compte:
- versionning
- bon fonctionnement (menus, etc)
- accessibilité (codé mais non testé)
- tests CI/CD
- Tester la réutilisabilité pour une application tierce
- MVP: portage judilibre-stats
- POC: portage deces-ui (beaucoup plus d'impact)
- Généraliser la réutilisation
- étendre à l'ensemble des composants de la lib dsfr
- ajouter les tests unitaires
- ajouter l'exploration des composants
- ajouter les tests ui
- doc pour contributeurs et ré-utilisateurs
- versionning
- github ci
A ce stade c'est limité (car pas assez documenté), mais toute contrib est la bienvenue. Je ne suis pas un guru des libs Svelte. Nous sommes à l'étape 1, j'imagine que la possiblité de contrib sera documentée à l'étape 3, avant il vous vaudra de l'huile de coude.