27 lines
2.0 KiB
JSON
27 lines
2.0 KiB
JSON
{
|
|
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
|
"name": "base-accordion-demo",
|
|
"type": "registry:ui",
|
|
"title": "Base Accordion Demo",
|
|
"description": "Demo showing a base accordion.",
|
|
"registryDependencies": [
|
|
"https://animate-ui.com/r/base-accordion"
|
|
],
|
|
"files": [
|
|
{
|
|
"path": "registry/demo/base/accordion/index.tsx",
|
|
"content": "import {\n Accordion,\n AccordionItem,\n AccordionTrigger,\n AccordionPanel,\n} from '@/components/animate-ui/base/accordion';\n\ninterface BaseAccordionDemoProps {\n multiple: boolean;\n}\n\nexport const BaseAccordionDemo = ({ multiple }: BaseAccordionDemoProps) => {\n return (\n <Accordion\n defaultValue={['item-1']}\n openMultiple={multiple}\n className=\"max-w-[400px] w-full\"\n >\n <AccordionItem value=\"item-1\">\n <AccordionTrigger>What is Animate UI?</AccordionTrigger>\n <AccordionPanel>\n Animate UI is an open-source distribution of React components built\n with TypeScript, Tailwind CSS, and Motion.\n </AccordionPanel>\n </AccordionItem>\n\n <AccordionItem value=\"item-2\">\n <AccordionTrigger>\n How is it different from other libraries?\n </AccordionTrigger>\n <AccordionPanel>\n Instead of installing via NPM, you copy and paste the components\n directly. This gives you full control to modify or customize them as\n needed.\n </AccordionPanel>\n </AccordionItem>\n\n <AccordionItem value=\"item-3\">\n <AccordionTrigger>Is Animate UI free to use?</AccordionTrigger>\n <AccordionPanel>\n Absolutely! Animate UI is fully open-source. You can use, modify, and\n adapt it to fit your needs.\n </AccordionPanel>\n </AccordionItem>\n </Accordion>\n );\n};\n",
|
|
"type": "registry:ui",
|
|
"target": "components/animate-ui/demo/base/accordion.tsx"
|
|
}
|
|
],
|
|
"meta": {
|
|
"demoProps": {
|
|
"Accordion": {
|
|
"multiple": {
|
|
"value": false
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} |