Expandable
Expandable crée un simple bouton d'affichage/masquage pour du contenu que les lecteurs peuvent vouloir voir mais qui n'est pas essentiel au flux principal.
Utilisez Expandable pour dissimuler des réponses API détaillées, des étapes de dépannage ou des détails supplémentaires qui interrompraient autrement le flux de lecture. Il s'affiche comme un simple élément cliquable et repliable. Il est plus léger qu'Accordion, conçu pour des sections groupées et navigables.
Utilisez Expandable lorsque :
- Des détails supplémentaires interrompraient le récit principal
- Des informations optionnelles profitent à certains lecteurs mais pas à tous
- Un contenu long (comme une réponse API complète) doit être replié par défaut
Utilisation de base
<Expandable title="Show more details">
These details are hidden by default and revealed when clicked.
</Expandable>Ouvert par défaut
Démarrer déplié :
This section starts visible.
<Expandable title="Expanded by default" defaultOpen>
This section starts visible.
</Expandable>Cas d'usage courants
Détails de réponse API
Repliez les réponses détaillées qui interrompraient autrement le flux de la documentation :
Étapes de dépannage
Props
Texte d'en-tête de la section.
Démarrer déplié.
Expandable vs Accordion
| Fonctionnalité | Expandable | Accordion |
|---|---|---|
| Objectif | Masquer du contenu supplémentaire | Organiser des sections d'importance égale |
| Icônes | Non | Oui |
| Descriptions | Non | Oui (sous-titre pris en charge) |
| Regroupement | Autonome | Peut être regroupé avec AccordionGroup |
| Idéal pour | Détails optionnels, exemples longs | FAQ, listes de fonctionnalités, navigation |
Règle empirique : Si le contenu est « agréable à avoir », utilisez Expandable. Si les utilisateurs doivent choisir entre des sections, utilisez Accordion.