{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "accordion",
  "title": "Accordion",
  "description": "Polaris-styled Accordion component.",
  "dependencies": [
    "@radix-ui/react-accordion"
  ],
  "devDependencies": [
    "@shopify/polaris-types"
  ],
  "registryDependencies": [
    "@polaris-shadcn/theme",
    "@polaris-shadcn/utils"
  ],
  "files": [
    {
      "path": "registry/templates/components/ui/accordion.tsx",
      "content": "import * as React from \"react\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { cn } from \"../../lib/utils\";\n\nexport type AccordionProps = React.ComponentPropsWithoutRef<\n  typeof AccordionPrimitive.Root\n>;\n\nexport type AccordionItemProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>;\n\nexport type AccordionTriggerProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>;\n\nexport type AccordionContentProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>;\n\nconst Accordion = AccordionPrimitive.Root;\n\nconst AccordionItem = React.forwardRef<HTMLDivElement, AccordionItemProps>(\n  ({ className, ...props }, ref) => (\n    <AccordionPrimitive.Item\n      ref={ref}\n      className={cn(\"rounded-lg border border-border bg-card\", className)}\n      {...props}\n    />\n  ),\n);\nAccordionItem.displayName = \"AccordionItem\";\n\nconst AccordionTrigger = React.forwardRef<\n  HTMLButtonElement,\n  AccordionTriggerProps\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Header className=\"flex\">\n    <AccordionPrimitive.Trigger\n      ref={ref}\n      className={cn(\n        \"polaris-shadcn-accordion-trigger flex flex-1 items-center justify-between px-4 py-3 text-sm font-medium transition\",\n        \"hover:bg-surface-subdued\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <span className=\"ml-2 inline-flex items-center text-muted-foreground\">\n        <span className=\"polaris-shadcn-accordion-icon polaris-shadcn-accordion-icon--closed\">\n          <s-icon type=\"chevron-right\" size=\"small\" tone=\"auto\" />\n        </span>\n        <span className=\"polaris-shadcn-accordion-icon polaris-shadcn-accordion-icon--open\">\n          <s-icon type=\"chevron-down\" size=\"small\" tone=\"auto\" />\n        </span>\n      </span>\n    </AccordionPrimitive.Trigger>\n  </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = \"AccordionTrigger\";\n\nconst AccordionContent = React.forwardRef<\n  HTMLDivElement,\n  AccordionContentProps\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className={cn(\"overflow-hidden text-sm text-muted-foreground\", className)}\n    {...props}\n  >\n    <div className=\"px-4 pt-1 pb-4\">{children}</div>\n  </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = \"AccordionContent\";\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}