{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "gummy-dialog",
  "type": "registry:ui",
  "title": "Gummy Dialog",
  "description": "Base UI modal Dialog with labelled surface, focus containment and restoration, Escape dismissal, backdrop, viewport, and responsive layout.",
  "registryDependencies": [
    "https://gummyui.dev/r/gummy-core-styles.json"
  ],
  "dependencies": [
    "@base-ui/react"
  ],
  "files": [
    {
      "path": "components/ui/GummyDialog.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Dialog } from \"@base-ui/react/dialog\";\nimport * as React from \"react\";\n\nfunction joinClassNames(...values: Array<string | false | null | undefined>) {\n  return values.filter(Boolean).join(\" \");\n}\n\nexport const GummyDialog = Dialog.Root;\nexport const GummyDialogPortal = Dialog.Portal;\n\nexport const GummyDialogTrigger = React.forwardRef<\n  HTMLButtonElement,\n  Dialog.Trigger.Props\n>(function GummyDialogTrigger({ className, children, ...props }, ref) {\n  return (\n    <Dialog.Trigger {...props} ref={ref} className={joinClassNames(\"gummy-dialog__trigger\", className as string)}>\n      <span className=\"gummy-dialog__trigger-copy\">{children}</span>\n      <span className=\"gummy-dialog__trigger-pool\" aria-hidden=\"true\" />\n    </Dialog.Trigger>\n  );\n});\n\nexport const GummyDialogBackdrop = React.forwardRef<\n  HTMLDivElement,\n  Dialog.Backdrop.Props\n>(function GummyDialogBackdrop({ className, ...props }, ref) {\n  return <Dialog.Backdrop {...props} ref={ref} className={joinClassNames(\"gummy-dialog__backdrop\", className as string)} />;\n});\n\nexport const GummyDialogViewport = React.forwardRef<\n  HTMLDivElement,\n  Dialog.Viewport.Props\n>(function GummyDialogViewport({ className, ...props }, ref) {\n  return <Dialog.Viewport {...props} ref={ref} className={joinClassNames(\"gummy-dialog__viewport\", className as string)} />;\n});\n\nexport const GummyDialogPopup = React.forwardRef<\n  HTMLDivElement,\n  Dialog.Popup.Props\n>(function GummyDialogPopup({ className, children, ...props }, ref) {\n  return (\n    <Dialog.Popup {...props} ref={ref} className={joinClassNames(\"gummy-dialog__popup\", className as string)}>\n      <span className=\"gummy-dialog__reservoir gummy-dialog__reservoir--start\" aria-hidden=\"true\" />\n      <span className=\"gummy-dialog__reservoir gummy-dialog__reservoir--end\" aria-hidden=\"true\" />\n      <div className=\"gummy-dialog__plane\">{children}</div>\n    </Dialog.Popup>\n  );\n});\n\nexport const GummyDialogTitle = React.forwardRef<\n  HTMLHeadingElement,\n  Dialog.Title.Props\n>(function GummyDialogTitle({ className, ...props }, ref) {\n  return <Dialog.Title {...props} ref={ref} className={joinClassNames(\"gummy-dialog__title\", className as string)} />;\n});\n\nexport const GummyDialogDescription = React.forwardRef<\n  HTMLParagraphElement,\n  Dialog.Description.Props\n>(function GummyDialogDescription({ className, ...props }, ref) {\n  return <Dialog.Description {...props} ref={ref} className={joinClassNames(\"gummy-dialog__description\", className as string)} />;\n});\n\nexport const GummyDialogClose = React.forwardRef<\n  HTMLButtonElement,\n  Dialog.Close.Props\n>(function GummyDialogClose({ className, ...props }, ref) {\n  return <Dialog.Close {...props} ref={ref} className={joinClassNames(\"gummy-dialog__close\", className as string)} />;\n});\n\nexport function GummyDialogSurface({ children, className }: React.PropsWithChildren<{ className?: string }>) {\n  return (\n    <div aria-hidden=\"true\" className={joinClassNames(\"gummy-dialog__popup\", \"gummy-dialog__popup--preview\", className)}>\n      <span className=\"gummy-dialog__reservoir gummy-dialog__reservoir--start\" aria-hidden=\"true\" />\n      <span className=\"gummy-dialog__reservoir gummy-dialog__reservoir--end\" aria-hidden=\"true\" />\n      <div className=\"gummy-dialog__plane\">{children}</div>\n    </div>\n  );\n}\n\nGummyDialogTrigger.displayName = \"GummyDialogTrigger\";\nGummyDialogBackdrop.displayName = \"GummyDialogBackdrop\";\nGummyDialogViewport.displayName = \"GummyDialogViewport\";\nGummyDialogPopup.displayName = \"GummyDialogPopup\";\nGummyDialogTitle.displayName = \"GummyDialogTitle\";\nGummyDialogDescription.displayName = \"GummyDialogDescription\";\nGummyDialogClose.displayName = \"GummyDialogClose\";\n"
    }
  ]
}