Guide d'utilisation

Bien utiliser la documentation du Design System de l'Autonomie

Rechercher un composant ou une information

Bouton de recherche

Utilisez le bouton de recherche en haut à droite de la page pour trouver rapidement un composant ou une notion précise (ex : “Input“, “Interrupteur”, “dsa-select“, “maxOptionsVisible”…).

Menu latéral

Sur la gauche de l’écran, vous pouvez trouver la liste des composants et groupes de composants sous la forme {{Nom en anglais}} - {{Nom en français}}, triés par ordre alphabétique.

 

Structure de la documentation

Pour chaque composant, notre documentation est organisée en plusieurs sections pour vous aider à trouver rapidement l'information dont vous avez besoin :

  • Usage : Quand utiliser le composant, exemple d’usages corrects et incorrects.
  • Style : Anatomie du composant, et différentes variantes.
  • Web : Utilisation du custom element
    • Exemple de code prêt à l’emploi
    • API : attributs/propriétés, méthodes, slots, événements (plus d’information sur l’utilisation des web-components ici)
  • Accessibilité : Pour comprendre comment l’utilisation de ce composant peut impacter l’accessibilité de vos utilisateurs
    • Rôle et attributs du composant ayant un impact sur l’accessibilité
    • Navigation au clavier, gestion du focus
    • Bonnes pratiques, et pièges à éviter
    • Liens vers des ressources externes
  • Exemples : Différents états et cas d’utilisation du composant, tirés de notre Storybook.