OddApp Design

Accordion (Complex)

@oddapp/ui · Tier 2

Multi-level nested accordion supporting arbitrary rich content inside panels.

Nested

import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from '@oddapp/ui'

<Accordion type="single" collapsible>
  <AccordionItem value="section-1">
    <AccordionTrigger>Billing</AccordionTrigger>
    <AccordionContent>
      <Accordion type="single" collapsible>
        <AccordionItem value="invoices">
          <AccordionTrigger>Invoices</AccordionTrigger>
          <AccordionContent>Invoice list goes here.</AccordionContent>
        </AccordionItem>
      </Accordion>
    </AccordionContent>
  </AccordionItem>
</Accordion>