{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "accordion",
  "title": "Accordion",
  "description": "A collapsible accordion component.",
  "dependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "src/components/ui/accordion.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\n// import * as AccordionPrimitive from \"@radix-ui/react-accordion\"\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { ChevronDown } from \"lucide-react\";\n\nimport { cn } from \"@/stories/lib/utils\";\nimport { createContext, useContext } from \"react\";\n\ntype AccordionVariant = \"white\" | \"inset\" | undefined;\n\nconst AccordionVariantContext = createContext<AccordionVariant>(undefined);\n\nconst useAccordionVariant = () => useContext(AccordionVariantContext);\n\ntype AccordionProps = React.ComponentPropsWithoutRef<\n  typeof AccordionPrimitive.Root\n> & {\n  variant?: AccordionVariant;\n};\n\nconst Accordion = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Root>,\n  AccordionProps\n>(({ className, variant, ...props }, ref) => {\n  return (\n    <AccordionVariantContext.Provider value={variant}>\n      <AccordionPrimitive.Root\n        ref={ref}\n        className={cn(\"rounded-lg\", className)}\n        {...props}\n      />\n    </AccordionVariantContext.Provider>\n  );\n});\nAccordion.displayName = \"Accordion\";\n\nconst AccordionItem = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => {\n  const variant = useAccordionVariant();\n\n  return (\n    <AccordionPrimitive.Item\n      ref={ref}\n      className={cn(\n        \"rounded-lg\",\n        variant === \"white\" ? \"bg-white border\" : \"bg-gray-100\",\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nAccordionItem.displayName = \"AccordionItem\";\n\nconst AccordionTrigger = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Header className=\"flex\">\n    <AccordionPrimitive.Trigger\n      ref={ref}\n      className={cn(\n        \" text-base flex flex-1 items-center justify-between  p-4 font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronDown className=\"h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200\" />\n    </AccordionPrimitive.Trigger>\n  </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className=\"py-4 mx-4 border-t border-t-[#B7C2E1] overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down\"\n    {...props}\n  >\n    <div className={cn(\"pb-4 pt-0\", className)}>{children}</div>\n  </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent };\n",
      "type": "registry:ui",
      "target": "components/ui/accordion.tsx"
    }
  ],
  "type": "registry:ui"
}