mirror of
https://github.com/shadcn-ui/ui.git
synced 2026-02-09 02:49:29 +08:00
33 lines
1012 B
TypeScript
33 lines
1012 B
TypeScript
import {
|
|
Accordion,
|
|
AccordionContent,
|
|
AccordionItem,
|
|
AccordionTrigger,
|
|
} from "@/components/ui/accordion"
|
|
|
|
export function AccordionDemo() {
|
|
return (
|
|
<Accordion type="single" collapsible className="w-[450px]">
|
|
<AccordionItem value="item-1">
|
|
<AccordionTrigger>Is it accessible?</AccordionTrigger>
|
|
<AccordionContent>
|
|
Yes. It adheres to the WAI-ARIA design pattern.
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="item-2">
|
|
<AccordionTrigger>Is it styled?</AccordionTrigger>
|
|
<AccordionContent>
|
|
Yes. It comes with default styles that matches the other components'
|
|
aesthetic.
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="item-3">
|
|
<AccordionTrigger>Is it animated?</AccordionTrigger>
|
|
<AccordionContent>
|
|
Yes. It's animated by default, but you can disable it if you prefer.
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</Accordion>
|
|
)
|
|
}
|