L'accordéon contient le flux de création et permet la modification légère de ses éléments.
[Un accordéonn](https://material.io/archive/guidelines/components/expansion-panels.html) est un conteneur léger pouvant être autonome ou connecté à une surface plus grande, telle qu'une carte. > **Note:** Le panneau d'expansion n'est plus documenté dans le [Material Design guidelines](https://material.io/), mais Material-UI continue le support. Il était précédemment connus sous le nom de panneau d'expansion. ## Accordéon simple {{"demo": "pages/components/accordion/SimpleAccordion.js", "bg": true}} ## Accordéon contrôlé Étendez le comportement du panneau par défaut pour créer un accordéon avec le composant `Accordion`. {{"demo": "pages/components/accordion/ControlledAccordions.js", "bg": true}} ## Customiser l'accordéon Voici un exemple de personnalisation du composant. Vous pouvez en savoir plus dans la [page de documentation des overrides](/customization/components/). {{"demo": "pages/components/accordion/CustomizedAccordions.js"}} ## Actions supplémentaires Pour pouvoir exécuter une action comme une `Checkbox` ou un bouton à l'intérieur du `AccordionSummary`, vous aurez besoin d'arrêter la propagation du focus et de l'évènement de clique sur l'accordéon à partir de l'expansion/réduction au moment de son utilisation. Vous devriez également fournir un `aria-label` pour l'action, autrement le label de l'action imbriquer sera inclus dans le label du bouton parent qui contrôle l'expansion de l'accordéon. {{"demo": "pages/components/accordion/ActionsInAccordionSummary.js", "bg": true}} ## Performances Le contenu de l'accordéon est monter par défaut et se même si l'accordéon n'est pas ouvert. Se comportement à le "server-side rendrering" et le SEO comme objectif. Si vous devez rendre un lourd composant au niveau des détails de l'accordéon ou simplement rendre plusieurs accordéons, il serait une bonne idée de changer le comportement par défaut en activant le `unmountOnExit` dans le prop `TransitionProps`: ```jsx