{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "alert",
  "title": "Alert",
  "description": "An alert dialog that grows out of a droplet in its own middle.",
  "dependencies": [
    "@base-ui/react@^1.8.0"
  ],
  "registryDependencies": [
    "https://liquikit.dev/r/button.json",
    "https://liquikit.dev/r/core.json",
    "https://liquikit.dev/r/glass.json",
    "https://liquikit.dev/r/popup.json"
  ],
  "files": [
    {
      "path": "src/alert.tsx",
      "content": "\"use client\";\n\nimport { AlertDialog } from \"@base-ui/react/alert-dialog\";\nimport {\n\ttype ComponentProps,\n\ttype ReactNode,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport { Button, type ButtonProps } from \"./button\";\nimport type { GlassRefraction, GlassTheme } from \"./glass\";\nimport { useGlassTheme } from \"./glass\";\nimport { MorphPane, PopupState } from \"./popup\";\nimport { cx } from \"./types\";\nimport \"./liquikit.css\";\n\nconst ALERT_RADIUS = 30;\n\nexport type AlertRootProps = Omit<AlertDialog.Root.Props, \"open\"> & {\n\topen?: boolean;\n};\n\nfunction Root({\n\topen: openProp,\n\tdefaultOpen = false,\n\tonOpenChange,\n\t...rootProps\n}: AlertRootProps) {\n\tconst [uncontrolled, setUncontrolled] = useState(defaultOpen);\n\tconst open = openProp ?? uncontrolled;\n\tconst trigger = useRef<HTMLElement | null>(null);\n\tconst state = useMemo(() => ({ open, trigger }), [open]);\n\n\treturn (\n\t\t<PopupState.Provider value={state}>\n\t\t\t<AlertDialog.Root\n\t\t\t\t{...rootProps}\n\t\t\t\topen={open}\n\t\t\t\tonOpenChange={(next, eventDetails) => {\n\t\t\t\t\tif (openProp === undefined) setUncontrolled(next);\n\t\t\t\t\tonOpenChange?.(next, eventDetails);\n\t\t\t\t}}\n\t\t\t/>\n\t\t</PopupState.Provider>\n\t);\n}\n\nfunction Trigger(props: ButtonProps) {\n\treturn <AlertDialog.Trigger render={<Button {...props} />} />;\n}\n\nexport type AlertPopupProps = Omit<\n\tAlertDialog.Popup.Props,\n\t\"className\" | \"render\"\n> & {\n\ttheme?: GlassTheme;\n\trefraction?: GlassRefraction;\n\tclassName?: string;\n\tchildren?: ReactNode;\n};\n\nfunction Popup({\n\ttheme,\n\trefraction,\n\tclassName,\n\tchildren,\n\t...popupProps\n}: AlertPopupProps) {\n\tconst backdropTheme = useGlassTheme(theme);\n\treturn (\n\t\t<AlertDialog.Portal>\n\t\t\t<AlertDialog.Backdrop\n\t\t\t\tclassName=\"glass-ui-alert__backdrop\"\n\t\t\t\tdata-glass-theme={backdropTheme}\n\t\t\t/>\n\t\t\t<AlertDialog.Viewport className=\"glass-ui-alert__viewport\">\n\t\t\t\t<AlertDialog.Popup\n\t\t\t\t\t{...popupProps}\n\t\t\t\t\tclassName={cx(\"glass-ui-popup glass-ui-alert\", className)}\n\t\t\t\t\trender={(props) => (\n\t\t\t\t\t\t<MorphPane\n\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\torigin=\"centre\"\n\t\t\t\t\t\t\tpanelRadius={ALERT_RADIUS}\n\t\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t\t\trefraction={refraction}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<div className=\"glass-ui-alert__body\">{children}</div>\n\t\t\t\t</AlertDialog.Popup>\n\t\t\t</AlertDialog.Viewport>\n\t\t</AlertDialog.Portal>\n\t);\n}\n\nfunction Title({\n\tclassName,\n\t...titleProps\n}: Omit<AlertDialog.Title.Props, \"className\"> & { className?: string }) {\n\treturn (\n\t\t<AlertDialog.Title\n\t\t\t{...titleProps}\n\t\t\tclassName={cx(\"glass-ui-alert__title\", className)}\n\t\t/>\n\t);\n}\n\nfunction Description({\n\tclassName,\n\t...descriptionProps\n}: Omit<AlertDialog.Description.Props, \"className\"> & { className?: string }) {\n\treturn (\n\t\t<AlertDialog.Description\n\t\t\t{...descriptionProps}\n\t\t\tclassName={cx(\"glass-ui-alert__description\", className)}\n\t\t/>\n\t);\n}\n\nfunction Actions({ className, ...props }: ComponentProps<\"div\">) {\n\treturn (\n\t\t<div {...props} className={cx(\"glass-ui-alert__actions\", className)} />\n\t);\n}\n\nfunction Close({ block = true, ...props }: ButtonProps) {\n\treturn <AlertDialog.Close render={<Button block={block} {...props} />} />;\n}\n\nexport const Alert = {\n\tRoot,\n\tTrigger,\n\tPopup,\n\tTitle,\n\tDescription,\n\tActions,\n\tClose,\n};\n\nexport const AlertRoot = Alert.Root;\nexport const AlertTrigger = Alert.Trigger;\nexport const AlertPopup = Alert.Popup;\nexport const AlertTitle = Alert.Title;\nexport const AlertDescription = Alert.Description;\nexport const AlertActions = Alert.Actions;\nexport const AlertClose = Alert.Close;\n",
      "type": "registry:ui",
      "target": "@components/liquikit/alert.tsx"
    }
  ],
  "type": "registry:ui"
}