{
  "name": "collapsible",
  "type": "registry:ui",
  "title": "Collapsible",
  "description": "Collapsible controls one expandable section, such as a disclosure, show-more block, or sidebar group.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0"
  ],
  "files": [
    {
      "path": "src/components/ui/collapsible.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Collapsible as CollapsiblePrimitive } from \"@base-ui/react/collapsible\";\nimport type React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport function Collapsible({\n  ...props\n}: CollapsiblePrimitive.Root.Props): React.ReactElement {\n  return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />;\n}\n\nexport function CollapsibleTrigger({\n  className,\n  ...props\n}: CollapsiblePrimitive.Trigger.Props): React.ReactElement {\n  return (\n    <CollapsiblePrimitive.Trigger\n      className={cn(\n        // Default chevron animation: any child marked data-slot=\"collapsible-chevron\"\n        // smoothly rotates 180deg while the panel is open - no per-trigger wiring\n        // needed. Triggers that want a different motion (e.g. the sidebar's 90deg\n        // ChevronRight) use their own data-slot and stay untouched.\n        \"siteplane-collapsible-motion *:data-[slot=collapsible-chevron]:transition-transform *:data-[slot=collapsible-chevron]:duration-(--motion-duration-expand) *:data-[slot=collapsible-chevron]:ease-(--motion-ease-expand) data-panel-open:*:data-[slot=collapsible-chevron]:rotate-180\",\n        className,\n      )}\n      data-slot=\"collapsible-trigger\"\n      {...props}\n    />\n  );\n}\n\nexport function CollapsiblePanel({\n  className,\n  ...props\n}: CollapsiblePrimitive.Panel.Props): React.ReactElement {\n  return (\n    <CollapsiblePrimitive.Panel\n      className={cn(\n        \"siteplane-collapsible-motion h-(--collapsible-panel-height) overflow-hidden 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        className,\n      )}\n      data-slot=\"collapsible-panel\"\n      {...props}\n    />\n  );\n}\n\nexport { CollapsiblePrimitive, CollapsiblePanel as CollapsibleContent };\n"
    }
  ],
  "categories": [
    "navigation"
  ],
  "docs": "# Collapsible\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nCollapsible controls one expandable section such as a disclosure, show-more\nblock, or sidebar group. Use Accordion for a related collection of panels.\n\n## Import\n\n`import { Collapsible, CollapsiblePanel, CollapsibleTrigger } from \"@/components/ui/collapsible\";`\n\n## Public API\n\n- Use `defaultOpen` for uncontrolled initial state.\n- Use `open` with `onOpenChange` when another control or application state\n  owns the disclosure state.\n- Set `disabled` on `Collapsible` to disable the trigger and state together.\n- `CollapsiblePanel hiddenUntilFound` keeps collapsed content available to\n  browser find-in-page and lets the browser reveal a matching panel.\n- Keep trigger and panel inside the same root.\n\n## Public Motion\n\n- Panel height uses `--collapsible-panel-height` with native starting and\n  ending styles.\n- Keep the preview or product composition top-anchored so opening expands\n  downward instead of recentering the entire control.\n- Chevron rotation and pointer states are additive composition behavior; do not\n  nest a second height or opacity animation around the panel.\n- System and provider reduced-motion modes remove panel and chevron transition\n  interpolation through the primitive and global contract.\n\n## Public Accessibility\n\n- Give every trigger visible text or an accessible label.\n- Keep trigger and panel connected through the Base UI context.\n- Disabled state remains recognizable and cannot activate the panel.\n- Use `hiddenUntilFound` when collapsed documentation must remain searchable.\n\n## Public Agent Guidance\n\n- Do not create toggle divs in place of `CollapsibleTrigger` and\n  `CollapsiblePanel`.\n- Keep one state owner; do not mix controlled and uncontrolled props.\n- Avoid nested layout animations around the native panel transition.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/navigation/collapsible)\n\n- [Registry source](https://ui.siteplane.io/r/collapsible.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/navigation/collapsible",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}