{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sheet",
  "title": "Sheet",
  "description": "An edge-anchored modal panel with four placement options, managed focus, independent body scrolling, and explicit dismissal.",
  "dependencies": [
    "@base-ui/react",
    "lucide-react"
  ],
  "files": [
    {
      "path": "registry/rivetui/components/sheet/sheet.tsx",
      "content": "\"use client\";\n\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\";\nimport { X } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype SheetSide = \"bottom\" | \"left\" | \"right\" | \"top\";\n\nconst sheetSideClasses = {\n  right:\n    \"inset-y-0 right-0 h-dvh w-[min(28rem,calc(100vw-2rem))] border-l data-ending-style:translate-x-full data-starting-style:translate-x-full\",\n  left: \"inset-y-0 left-0 h-dvh w-[min(28rem,calc(100vw-2rem))] border-r data-ending-style:-translate-x-full data-starting-style:-translate-x-full\",\n  top: \"inset-x-0 top-0 max-h-[calc(100dvh-1rem)] w-full border-b data-ending-style:-translate-y-full data-starting-style:-translate-y-full\",\n  bottom:\n    \"inset-x-0 bottom-0 max-h-[calc(100dvh-1rem)] w-full border-t data-ending-style:translate-y-full data-starting-style:translate-y-full\",\n} satisfies Record<SheetSide, string>;\n\nfunction Sheet<Payload>(props: DialogPrimitive.Root.Props<Payload>) {\n  return <DialogPrimitive.Root {...props} />;\n}\n\nfunction SheetTrigger<Payload>(props: DialogPrimitive.Trigger.Props<Payload>) {\n  return <DialogPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\nfunction SheetClose(props: DialogPrimitive.Close.Props) {\n  return <DialogPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\ntype SheetContentProps = DialogPrimitive.Popup.Props & {\n  closeLabel?: string;\n  showCloseButton?: boolean;\n  side?: SheetSide;\n};\n\nfunction SheetContent({\n  className,\n  children,\n  closeLabel = \"Close sheet\",\n  showCloseButton = true,\n  side = \"right\",\n  ...props\n}: SheetContentProps) {\n  return (\n    <DialogPrimitive.Portal>\n      <DialogPrimitive.Backdrop\n        data-slot=\"sheet-backdrop\"\n        className=\"fixed inset-0 z-50 min-h-dvh bg-black/55 transition-opacity duration-200 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-[-webkit-touch-callout:none]:absolute motion-reduce:transition-none dark:bg-black/70\"\n      />\n      <DialogPrimitive.Viewport\n        data-slot=\"sheet-viewport\"\n        className=\"pointer-events-none fixed inset-0 z-50 min-h-dvh data-ending-style:pointer-events-none\"\n      >\n        <DialogPrimitive.Popup\n          data-slot=\"sheet-content\"\n          data-side={side}\n          className={cn(\n            \"pointer-events-auto fixed flex max-w-full flex-col overflow-hidden border-border bg-background text-foreground outline-none transition-transform duration-200 ease-out focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/40 motion-reduce:transition-none\",\n            sheetSideClasses[side],\n            className,\n          )}\n          {...props}\n        >\n          {children}\n          {showCloseButton ? (\n            <DialogPrimitive.Close\n              data-slot=\"sheet-close\"\n              aria-label={closeLabel}\n              className=\"absolute top-4 right-4 inline-flex size-8 cursor-pointer items-center justify-center border border-transparent text-muted-foreground outline-none transition-[background-color,border-color,color] duration-100 hover:border-border hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-40 motion-reduce:transition-none\"\n            >\n              <X className=\"size-4\" aria-hidden=\"true\" />\n            </DialogPrimitive.Close>\n          ) : null}\n        </DialogPrimitive.Popup>\n      </DialogPrimitive.Viewport>\n    </DialogPrimitive.Portal>\n  );\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn(\"grid shrink-0 gap-1.5 border-b border-border p-5 pr-14 text-left\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetTitle({ className, ...props }: DialogPrimitive.Title.Props) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn(\"text-lg font-semibold leading-none tracking-tight\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetDescription({ className, ...props }: DialogPrimitive.Description.Props) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn(\"text-sm leading-relaxed text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetBody({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sheet-body\"\n      className={cn(\"min-h-0 flex-1 overflow-y-auto p-5\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn(\n        \"flex shrink-0 flex-col gap-2 border-t border-border p-5 sm:flex-row sm:flex-wrap sm:justify-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport type { SheetContentProps, SheetSide };\nexport {\n  Sheet,\n  SheetBody,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}