{"name":"sheet","type":"registry:ui","files":[{"path":"sheet.tsx","type":"registry:ui","content":"\"use client\"\n\nimport { Dialog as SheetPrimitive } from \"@base-ui-components/react/dialog\"\nimport { X as XIcon } from \"honestui/icons\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction Sheet(props: SheetPrimitive.Root.Props) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />\n}\n\nfunction SheetTrigger(props: SheetPrimitive.Trigger.Props) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\nfunction SheetPortal(props: SheetPrimitive.Portal.Props) {\n  return <SheetPrimitive.Portal {...props} />\n}\n\nfunction SheetClose(props: SheetPrimitive.Close.Props) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />\n}\n\nfunction SheetBackdrop({ className, ...props }: SheetPrimitive.Backdrop.Props) {\n  return (\n    <SheetPrimitive.Backdrop\n      data-slot=\"sheet-backdrop\"\n      className={cn(\n        \"fixed inset-0 z-50 bg-black/32 backdrop-blur-sm transition-all duration-200 data-ending-style:opacity-0 data-starting-style:opacity-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetPopup({\n  className,\n  children,\n  showCloseButton = true,\n  side = \"right\",\n  ...props\n}: SheetPrimitive.Popup.Props & {\n  showCloseButton?: boolean\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n}) {\n  return (\n    <SheetPortal>\n      <SheetBackdrop />\n      <SheetPrimitive.Popup\n        data-slot=\"sheet-popup\"\n        className={cn(\n          \"fixed z-50 flex h-[100dvh] flex-col gap-4 bg-popover text-popover-foreground shadow-lg transition-[opacity,translate] duration-300 ease-in-out will-change-transform\",\n          side === \"right\" &&\n            \"inset-y-0 right-0 h-full w-[calc(100%-(--spacing(12)))] max-w-sm data-ending-style:translate-x-full data-starting-style:translate-x-full\",\n          side === \"left\" &&\n            \"inset-y-0 left-0 h-full w-[calc(100%-(--spacing(12)))] max-w-sm data-ending-style:-translate-x-full data-starting-style:-translate-x-full\",\n          side === \"top\" &&\n            \"inset-x-0 top-0 h-auto data-ending-style:-translate-y-full data-starting-style:-translate-y-full\",\n          side === \"bottom\" &&\n            \"inset-x-0 bottom-0 h-auto data-ending-style:translate-y-full data-starting-style:translate-y-full\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <SheetPrimitive.Close className=\"absolute end-2 top-2 inline-flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md border border-transparent opacity-72 transition-[color,background-color,box-shadow,opacity] outline-none hover:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background pointer-coarse:after:absolute pointer-coarse:after:size-full pointer-coarse:after:min-h-11 pointer-coarse:after:min-w-11 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\">\n            <XIcon />\n            <span className=\"sr-only\">Close</span>\n          </SheetPrimitive.Close>\n        )}\n      </SheetPrimitive.Popup>\n    </SheetPortal>\n  )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn(\"flex flex-col gap-1.5 p-4\", 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        \"mt-auto flex flex-col gap-2 p-4 *:w-full sm:flex-row sm:justify-end sm:*:w-auto\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetTitle({ className, ...props }: SheetPrimitive.Title.Props) {\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn(\"font-semibold\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: SheetPrimitive.Description.Props) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetPortal,\n  SheetClose,\n  SheetBackdrop,\n  SheetBackdrop as SheetOverlay,\n  SheetPopup,\n  SheetPopup as SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n}\n","target":"components/ui/sheet.tsx"}],"dependencies":["@base-ui-components/react","honestui"]}