{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sheet",
  "title": "Sheet",
  "type": "registry:ui",
  "files": [
    {
      "path": "packages/registry-react/components/sheet/sheet.tsx",
      "content": "'use client'\n\nimport * as React from 'react'\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\nimport { X } from 'lucide-react'\nimport { cn } from '@/lib/utils'\n\nconst Sheet = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>\n>((props, ref) => <DialogPrimitive.Root {...props} ref={ref} data-uipkge=\"\" data-slot=\"sheet\" />)\nSheet.displayName = DialogPrimitive.Root.displayName\n\nconst SheetTrigger = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>\n>(({ ...props }, ref) => <DialogPrimitive.Trigger ref={ref} data-uipkge=\"\" data-slot=\"sheet-trigger\" {...props} />)\nSheetTrigger.displayName = DialogPrimitive.Trigger.displayName\n\nconst SheetClose = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Close>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>\n>(({ ...props }, ref) => <DialogPrimitive.Close ref={ref} data-uipkge=\"\" data-slot=\"sheet-close\" {...props} />)\nSheetClose.displayName = DialogPrimitive.Close.displayName\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Overlay\n    ref={ref}\n    data-uipkge=\"\"\n    data-slot=\"sheet-overlay\"\n    className={cn(\n      'motion-safe:data-[state=open]:animate-in motion-safe:data-[state=closed]:animate-out motion-safe:data-[state=closed]:fade-out-0 motion-safe:data-[state=open]:fade-in-0 bg-foreground/50 fixed inset-0 z-50',\n      className,\n    )}\n    {...props}\n  />\n))\nSheetOverlay.displayName = DialogPrimitive.Overlay.displayName\n\ninterface SheetContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {\n  side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nconst SheetContent = React.forwardRef<React.ElementRef<typeof DialogPrimitive.Content>, SheetContentProps>(\n  ({ side = 'right', className, children, ...props }, ref) => (\n    <DialogPrimitive.Portal>\n      <SheetOverlay />\n      <DialogPrimitive.Content\n        ref={ref}\n        data-uipkge=\"\"\n        data-slot=\"sheet-content\"\n        className={cn(\n          'bg-background motion-safe:data-[state=open]:animate-in motion-safe:data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out motion-safe:data-[state=closed]:duration-200 motion-safe:data-[state=open]:duration-300',\n          side === 'right' &&\n            'motion-safe:data-[state=closed]:slide-out-to-right motion-safe:data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',\n          side === 'left' &&\n            'motion-safe:data-[state=closed]:slide-out-to-left motion-safe:data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',\n          side === 'top' &&\n            'motion-safe:data-[state=closed]:slide-out-to-top motion-safe:data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b',\n          side === 'bottom' &&\n            'motion-safe:data-[state=closed]:slide-out-to-bottom motion-safe:data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n\n        <DialogPrimitive.Close className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none\">\n          <X className=\"size-4\" aria-hidden=\"true\" />\n          <span className=\"sr-only\">Close</span>\n        </DialogPrimitive.Close>\n      </DialogPrimitive.Content>\n    </DialogPrimitive.Portal>\n  ),\n)\nSheetContent.displayName = DialogPrimitive.Content.displayName\n\nconst SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div data-uipkge=\"\" data-slot=\"sheet-header\" className={cn('flex flex-col gap-1.5 p-4', className)} {...props} />\n)\nSheetHeader.displayName = 'SheetHeader'\n\nconst SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div data-uipkge=\"\" data-slot=\"sheet-footer\" className={cn('mt-auto flex flex-col gap-2 p-4', className)} {...props} />\n)\nSheetFooter.displayName = 'SheetFooter'\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    data-uipkge=\"\"\n    data-slot=\"sheet-title\"\n    className={cn('text-foreground font-semibold', className)}\n    {...props}\n  />\n))\nSheetTitle.displayName = DialogPrimitive.Title.displayName\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    data-uipkge=\"\"\n    data-slot=\"sheet-description\"\n    className={cn('text-muted-foreground text-sm', className)}\n    {...props}\n  />\n))\nSheetDescription.displayName = DialogPrimitive.Description.displayName\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetClose,\n  SheetOverlay,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n}\n",
      "type": "registry:ui",
      "target": "~/components/ui/sheet/sheet.tsx"
    },
    {
      "path": "packages/registry-react/components/sheet/index.ts",
      "content": "export {\n  Sheet,\n  SheetTrigger,\n  SheetClose,\n  SheetOverlay,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n} from './sheet'\n",
      "type": "registry:ui",
      "target": "~/components/ui/sheet/index.ts"
    }
  ],
  "dependencies": [
    "@radix-ui/react-dialog",
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [],
  "description": "Side-mounted modal that slides in from the top, right, bottom, or left edge. Use for filter panels, edit drawers, and mobile menus.",
  "categories": [
    "overlay"
  ]
}