Accordion
Stacked sections that expand and collapse, for FAQs, rules and settings groups, built on Base UI.
Preview
Click Sign up in the top bar, fill in your email and pick a password. A confirmation link lands in your inbox within a minute.
Usage
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from '@vitnode/core/components/ui/accordion'<Accordion defaultValue={['register']}>
<AccordionItem value="register">
<AccordionTrigger>How do I create an account?</AccordionTrigger>
<AccordionContent>
<p>Click Sign up in the top bar and fill in your email.</p>
</AccordionContent>
</AccordionItem>
</Accordion>defaultValue and value are arrays of item values, even when only one item
can be open.
Multiple
Disagree with ideas, not people. Personal attacks get removed.
Someone may have asked already. Bumping an old topic beats a duplicate.
By default, opening an item closes the others. multiple lets several stay
open.
<Accordion defaultValue={['kind', 'search']} multiple>Find in page
With hiddenUntilFound, closed panels stay in the DOM and the browser's
Ctrl + F can find and open them. Great for long FAQs.
<Accordion hiddenUntilFound>