Accordion
Expand and collapse related sections with keyboard-accessible triggers.
Preview
Import
import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from "@sigil-ui/components";Usage
<Accordion type="single" collapsible>
<AccordionItem value="item-1">
<AccordionTrigger>What is Sigil UI?</AccordionTrigger>
<AccordionContent>A token-driven design system where one file updates everything.</AccordionContent>
</AccordionItem>
</Accordion>Sub-components
This component includes the following parts:
<AccordionItem><AccordionTrigger><AccordionContent>
Token integration
| CSS Variable | Purpose |
|---|---|
--s-border | Border |
--s-text | Text |
--s-duration-fast | Duration fast |
--s-ring | Ring |
--s-primary | Primary |
--s-text-muted | Text muted |