{
  "$schema": "https://blode.co/ui/schema/registry-item.json",
  "name": "collapsible",
  "title": "Collapsible",
  "author": "Matthew Blode",
  "description": "An interactive component that expands and collapses a panel of content.",
  "dependencies": ["@base-ui/react"],
  "files": [
    {
      "path": "ui/collapsible.tsx",
      "content": "\"use client\";\n\nimport { Collapsible as CollapsiblePrimitive } from \"@base-ui/react/collapsible\";\nimport * as React from \"react\";\n\nconst Collapsible = ({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>) => (\n  <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />\n);\n\nconst CollapsibleTrigger = ({\n  asChild = false,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Trigger> & {\n  asChild?: boolean;\n}) => {\n  const render =\n    asChild && React.isValidElement(children) ? (children as React.ReactElement) : undefined;\n\n  return (\n    <CollapsiblePrimitive.Trigger data-slot=\"collapsible-trigger\" render={render} {...props}>\n      {asChild ? null : children}\n    </CollapsiblePrimitive.Trigger>\n  );\n};\n\nconst CollapsibleContent = ({\n  forceMount,\n  keepMounted,\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Panel> & {\n  forceMount?: boolean;\n}) => (\n  <CollapsiblePrimitive.Panel\n    data-slot=\"collapsible-content\"\n    keepMounted={forceMount ?? keepMounted}\n    {...props}\n  />\n);\n\nexport { Collapsible, CollapsibleTrigger, CollapsibleContent };\n",
      "type": "registry:ui",
      "target": ""
    }
  ],
  "type": "registry:ui"
}