Accordion

Please refer to MUI's official docs for more details on component's usage guide and API documentation.

Basic Accordion

Use Accordion, AccordionSummary and AccordionDetails components to make a simple accordion.

Accordion 1

Wafer sesame snaps chocolate bar candy canes halvah. Cupcake sesame snaps sweet tart dessert biscuit. Topping soufflé tart sweet croissant.

Accordion 2

Sugar plum sesame snaps caramels. Cake pie tart fruitcake sesame snaps donut cupcake macaroon. Gingerbread pudding cheesecake pie ice cream.

Accordion 3

Gingerbread lemon drops bear claw gummi bears bonbon wafer jujubes tiramisu. Jelly pie cake. Sweet roll dessert sweet pastry powder.

---

Controlled Accordion

Manage expanded prop with the help of a state.

Accordion 1

Wafer sesame snaps chocolate bar candy canes halvah. Cupcake sesame snaps sweet tart dessert biscuit. Topping soufflé tart sweet croissant.

Accordion 2

Sugar plum sesame snaps caramels. Cake pie tart fruitcake sesame snaps donut cupcake macaroon. Gingerbread pudding cheesecake pie ice cream.

Accordion 3

Gingerbread lemon drops bear claw gummi bears bonbon wafer jujubes tiramisu. Jelly pie cake. Sweet roll dessert sweet pastry powder.

---

Customized Accordion

Use styled hook to customize the component the way you want it.

Accordion 1

Wafer sesame snaps chocolate bar candy canes halvah. Cupcake sesame snaps sweet tart dessert biscuit. Topping soufflé tart sweet croissant.

Accordion 2

Sugar plum sesame snaps caramels. Cake pie tart fruitcake sesame snaps donut cupcake macaroon. Gingerbread pudding cheesecake pie ice cream.

Accordion 3

Gingerbread lemon drops bear claw gummi bears bonbon wafer jujubes tiramisu. Jelly pie cake. Sweet roll dessert sweet pastry powder.

---

Additional Actions

In order to put an action such as a Checkbox or a button inside AccordionSummary, you need to stop the propagation of the focus and click events to prevent the accordion from expanding/collapsing when using the action.

Accordion 1

Wafer sesame snaps chocolate bar candy canes halvah. Cupcake sesame snaps sweet tart dessert biscuit. Topping soufflé tart sweet croissant.

Accordion 2

Sugar plum sesame snaps caramels. Cake pie tart fruitcake sesame snaps donut cupcake macaroon. Gingerbread pudding cheesecake pie ice cream.

Accordion 3

Gingerbread lemon drops bear claw gummi bears bonbon wafer jujubes tiramisu. Jelly pie cake. Sweet roll dessert sweet pastry powder.

---