{
  "name": "accordion",
  "type": "registry:ui",
  "title": "Accordion",
  "description": "Accordion organizes several short, scannable disclosure panels that can open independently or as a controlled group.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0",
    "lucide-react@1.18.0"
  ],
  "files": [
    {
      "path": "src/components/ui/accordion.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport function Accordion(\n  props: AccordionPrimitive.Root.Props,\n): React.ReactElement {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />;\n}\n\nexport function AccordionItem({\n  className,\n  ...props\n}: AccordionPrimitive.Item.Props): React.ReactElement {\n  return (\n    <AccordionPrimitive.Item\n      className={cn(\"border-b last:border-b-0\", className)}\n      data-slot=\"accordion-item\"\n      {...props}\n    />\n  );\n}\n\nexport function AccordionTrigger({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Trigger.Props): React.ReactElement {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        className={cn(\n          \"siteplane-accordion-motion group flex flex-1 cursor-pointer items-start justify-between gap-4 rounded-md py-4 text-left font-medium text-sm outline-none transition-[scale,box-shadow] duration-(--motion-duration-slow) ease-(--motion-ease-apple-out) active:scale-[0.99] focus-visible:ring-[3px] focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-64 data-disabled:cursor-not-allowed data-disabled:opacity-64 data-panel-open:*:data-[slot=accordion-indicator]:rotate-180 motion-reduce:transition-none\",\n          className,\n        )}\n        data-slot=\"accordion-trigger\"\n        {...props}\n      >\n        <span className=\"siteplane-accordion-motion min-w-0 translate-x-0 text-muted-foreground transition-[color,translate] duration-(--motion-duration-slow) ease-(--motion-ease-apple-out) group-hover:translate-x-0.5 group-hover:text-foreground group-disabled:translate-x-0 group-disabled:text-muted-foreground group-data-disabled:translate-x-0 group-data-disabled:text-muted-foreground group-data-panel-open:text-foreground motion-reduce:transition-none\">\n          {children}\n        </span>\n        <ChevronDownIcon\n          className=\"siteplane-accordion-motion pointer-events-none size-4 shrink-0 translate-y-0.5 opacity-80 transition-transform duration-(--motion-duration-expand) ease-(--motion-ease-expand) motion-reduce:transition-none\"\n          data-slot=\"accordion-indicator\"\n        />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  );\n}\n\nexport function AccordionPanel({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Panel.Props): React.ReactElement {\n  return (\n    <AccordionPrimitive.Panel\n      className=\"siteplane-accordion-motion h-(--accordion-panel-height) overflow-hidden text-muted-foreground text-sm transition-[height] duration-(--motion-duration-expand) ease-(--motion-ease-expand) data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none\"\n      data-slot=\"accordion-panel\"\n      {...props}\n    >\n      <div className={cn(\"pt-0 pb-4\", className)}>{children}</div>\n    </AccordionPrimitive.Panel>\n  );\n}\n\nexport { AccordionPrimitive, AccordionPanel as AccordionContent };\n"
    }
  ],
  "categories": [
    "navigation"
  ],
  "docs": "# Accordion\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nAccordion organizes several short, scannable disclosure panels. Use it for\nFAQs, compact settings, or supporting information that does not need to remain\nvisible. Use Collapsible when there is only one panel.\n\n## Import\n\n`import { Accordion, AccordionContent, AccordionItem, AccordionPanel, AccordionTrigger } from \"@/components/ui/accordion\";`\n\n## Public API\n\n- `AccordionItem` owns a value and may be disabled independently.\n- `defaultValue`, `value`, and `onValueChange` use arrays, including\n  single-open accordions. Add `multiple` only when several panels may remain\n  open.\n- `AccordionContent` is a compatibility alias for `AccordionPanel`; new code\n  uses `AccordionPanel`.\n- Keep `AccordionTrigger` and `AccordionPanel` inside the matching\n  `AccordionItem`.\n\n## Public Motion\n\n- `AccordionPanel` animates height through `--accordion-panel-height` and the\n  shared expand duration and easing tokens.\n- Chevron rotation, trigger hover and press states, and reduced-motion behavior\n  are built into the primitive. System and provider reduced-motion modes remove\n  transition interpolation. Do not recreate them in feature code.\n\n## Public Accessibility\n\n- `AccordionTrigger` renders a button and keeps Base UI keyboard, focus, and\n  expanded-state semantics.\n- Set disabled state on `AccordionItem` so its trigger, panel, and state remain\n  synchronized.\n- Allow multiple open panels only when comparing their content is useful.\n- Do not hide critical decisions, long forms, or primary workflows in an\n  accordion.\n\n## Public Agent Guidance\n\n- Use Accordion for a related group of disclosures and Collapsible for one\n  disclosure.\n- Preserve the primitive indicator, panel, focus, disabled, and motion classes.\n- Use the canonical `AccordionPanel` name in new code.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/navigation/accordion)\n\n- [Registry source](https://ui.siteplane.io/r/accordion.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/navigation/accordion",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}