{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-primitives-radix-accordion",
  "title": "Radix Accordion Demo",
  "description": "Demo showing an animated radix accordion.",
  "registryDependencies": [
    "@animate-ui/primitives-radix-accordion"
  ],
  "files": [
    {
      "path": "registry/demo/primitives/radix/accordion/index.tsx",
      "content": "import {\n  Accordion,\n  AccordionItem,\n  AccordionTrigger,\n  AccordionContent,\n  AccordionHeader,\n} from '@/components/animate-ui/primitives/radix/accordion';\n\nconst ITEMS = [\n  {\n    title: 'What is Animate UI?',\n    content:\n      'Animate UI is an open-source distribution of React components built with TypeScript, Tailwind CSS, and Motion.',\n  },\n  {\n    title: 'How is it different from other libraries?',\n    content:\n      'Instead of installing via NPM, you copy and paste the components directly. This gives you full control to modify or customize them as needed.',\n  },\n  {\n    title: 'Is Animate UI free to use?',\n    content:\n      'Absolutely! Animate UI is fully open-source. You can use, modify, and adapt it to fit your needs.',\n  },\n];\n\ntype RadixAccordionDemoProps = {\n  multiple?: boolean;\n  collapsible?: boolean;\n  keepRendered?: boolean;\n};\n\nexport const RadixAccordionDemo = ({\n  multiple = false,\n  collapsible = true,\n  keepRendered = false,\n}: RadixAccordionDemoProps) => {\n  return (\n    <Accordion\n      type={multiple ? 'multiple' : 'single'}\n      collapsible={collapsible}\n      className=\"max-w-[400px] w-full\"\n    >\n      {ITEMS.map((item, index) => (\n        <AccordionItem key={index} value={`item-${index + 1}`}>\n          <AccordionHeader>\n            <AccordionTrigger className=\"border-b py-2 w-full text-start\">\n              {item.title}\n            </AccordionTrigger>\n          </AccordionHeader>\n          <AccordionContent keepRendered={keepRendered}>\n            <div className=\"py-2 text-sm text-muted-foreground\">\n              {item.content}\n            </div>\n          </AccordionContent>\n        </AccordionItem>\n      ))}\n    </Accordion>\n  );\n};\n",
      "type": "registry:ui",
      "target": "components/animate-ui/demo/primitives/radix/accordion.tsx"
    }
  ],
  "meta": {
    "demoProps": {
      "Accordion": {
        "multiple": {
          "value": false
        },
        "collapsible": {
          "value": true
        }
      },
      "AccordionContent": {
        "keepRendered": {
          "value": false
        }
      }
    }
  },
  "type": "registry:ui"
}