Shadcn UI — Accordion

Instructions

Use ShadAccordion for a vertically stacked set of headings that each reveal content. Each item is a ShadAccordionItem with value, title, and child.

Single (one open at a time)

final details = [
  (title: 'Is it acceptable?', content: 'Yes. It adheres to the WAI-ARIA design pattern.'),
  (title: 'Is it styled?', content: "Yes. It comes with default styles that matches the other components' aesthetic."),
  (title: 'Is it animated?', content: "Yes. It's animated by default, but you can disable it if you prefer."),
];