Pathou DS

Le design system de Pathou : les composants React de l’application, les tokens de src/styles.css, et les règles pour s’en servir. Chaque page montre le vrai composant, pas une copie.

Ce que contient la doc

  • Composants : une fiche par composant de src/components/, avec l’aperçu, l’anatomie, les états, les guidelines, le clavier et les props. L’index les range par famille.
  • Fondations : tous les tokens, en clair et en sombre, avec leur usage et les composants qui s’en servent (couleurs, mouvement, ombres et effets, typographie).
  • Pour les agents : les mêmes fiches en fichiers bruts, à lire par un outil (voir).

D’où vient chaque information

Ce qui se déduit du code est calculé à chaque construction du site, jamais recopié : les props, les valeurs des tokens, la liste « Utilisé par », le code des exemples. Quand un calcul n’est pas sûr, la page dit « non déterminé » plutôt que de deviner.

Le reste (description, anatomie, guidelines) est écrit dans des fiches au format DSDS 0.23.0, une spécification encore en brouillon. Le site ne fait qu’afficher ces fiches.

Lire une guideline

  • MUST et MUST NOT : règles à respecter.
  • SHOULD et SHOULD NOT : recommandations, à suivre sauf bonne raison.
  • Le badge À valider signale un premier jet qui n’a pas encore été relu. Il disparaît une fois la fiche validée.