{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sheet",
  "title": "Sheet",
  "description": "A side panel you can swipe away, for detail that shouldn't leave the page.",
  "dependencies": [
    "@base-ui/react"
  ],
  "registryDependencies": [
    "https://spotcheckui.com/r/spotcheck-base.json"
  ],
  "files": [
    {
      "path": "registry/spotcheck/components/spotcheck/sheet.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Drawer } from \"@base-ui/react/drawer\"\n\nimport { cn } from \"@/lib/utils\"\n\nexport const Sheet = Drawer.Root\nexport const SheetTrigger = Drawer.Trigger\nexport const SheetClose = Drawer.Close\n\ntype SheetContentProps = {\n  title: string\n  description?: string\n  children?: React.ReactNode\n  className?: string\n}\n\nexport function SheetContent({ title, description, className, children }: SheetContentProps) {\n  return (\n    <Drawer.Portal>\n      <Drawer.Backdrop className=\"fixed inset-0 z-50 bg-[color-mix(in_srgb,var(--ink)_30%,transparent)] opacity-[calc(1-var(--drawer-swipe-progress,0))] transition-opacity duration-300 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none\" />\n      <Drawer.Viewport className=\"fixed inset-0 z-50 flex justify-end\">\n        <Drawer.Popup\n          className={cn(\n            \"border-ink bg-paper text-ink h-full w-[min(24rem,calc(100vw-3rem))] touch-pan-y overflow-y-auto border-l-(length:--rule) p-5 font-(family-name:--f-body) [transform:translateX(var(--drawer-swipe-movement-x,0))] transition-transform duration-300 outline-none data-ending-style:[transform:translateX(100%)] data-starting-style:[transform:translateX(100%)] data-swiping:duration-0 motion-reduce:transition-none\",\n            className,\n          )}\n        >\n          <Drawer.Content>\n            <Drawer.Title className=\"spotcheck-heading text-2xl leading-none\">{title}</Drawer.Title>\n            {description && <Drawer.Description className=\"text-mute mt-2 text-sm\">{description}</Drawer.Description>}\n            {children && <div className=\"mt-4\">{children}</div>}\n          </Drawer.Content>\n        </Drawer.Popup>\n      </Drawer.Viewport>\n    </Drawer.Portal>\n  )\n}\n",
      "type": "registry:component"
    }
  ],
  "categories": [
    "core"
  ],
  "type": "registry:component"
}