{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "toast",
"title": "Ninaero toast",
"dependencies": [
"@base-ui/react@^1.9.0",
"cn@^0.4.0"
],
"registryDependencies": [
"https://ninaero.pages.dev/r/theme.json",
"https://ninaero.pages.dev/r/button.json",
"https://ninaero.pages.dev/r/icons.json",
"https://ninaero.pages.dev/r/sound-provider.json"
],
"files": [
{
"path": "registry/ninaero/ui/toast.tsx",
"content": "\"use client\";\n\nimport { Toast as ToastPrimitive } from \"@base-ui/react/toast\";\nimport { cn } from \"cn\";\nimport * as React from \"react\";\n\nimport {\n CircleCheckIcon,\n InfoIcon,\n Loader2Icon,\n OctagonXIcon,\n TriangleAlertIcon,\n XIcon,\n} from \"@/lib/icons\";\nimport { Button } from \"@/registry/ninaero/ui/button\";\n\nimport { useControlSound, HoverSound } from \"./sound-feedback\";\nimport type { SoundCue } from \"./sound-provider\";\n\nconst toast = ToastPrimitive.createToastManager();\n\nconst ToastSoundContext = React.createContext(true);\n\nfunction ToastProvider({\n sound = true,\n ...props\n}: ToastPrimitive.Provider.Props & { sound?: boolean }) {\n const inherited = React.useContext(ToastSoundContext);\n return (\n \n \n \n );\n}\n\nfunction ToastPortal({ ...props }: ToastPrimitive.Portal.Props) {\n return ;\n}\n\nfunction ToastViewport({ className, ...props }: ToastPrimitive.Viewport.Props) {\n return (\n \n );\n}\n\nconst toastSounds: Partial> = {\n info: \"ping\",\n success: \"success\",\n error: \"error\",\n warning: \"warning\",\n loading: \"loading\",\n};\n\nfunction Toast({\n className,\n toast,\n sound = true,\n ...props\n}: ToastPrimitive.Root.Props & { sound?: boolean }) {\n const toastSound = React.useContext(ToastSoundContext);\n const { play } = useControlSound(sound && toastSound);\n const previous = React.useRef<{ id: string; type: string | undefined } | null>(null);\n React.useEffect(() => {\n const changed = previous.current?.id !== toast.id || previous.current?.type !== toast.type;\n previous.current = { id: toast.id, type: toast.type };\n if (changed && !toast.limited && toast.transitionStatus !== \"ending\") {\n play(toastSounds[toast.type ?? \"info\"] ?? \"ping\");\n }\n }, [toast.id, toast.type, toast.limited, toast.transitionStatus, play]);\n return (\n \n );\n}\n\nfunction ToastContent({ className, ...props }: ToastPrimitive.Content.Props) {\n return (\n \n );\n}\n\nfunction ToastTitle({ className, ...props }: ToastPrimitive.Title.Props) {\n return (\n \n );\n}\n\nfunction ToastDescription({ className, ...props }: ToastPrimitive.Description.Props) {\n return (\n \n );\n}\n\nfunction ToastAction({\n className,\n render = ,\n ...props\n}: ToastPrimitive.Action.Props) {\n return (\n \n );\n}\n\nfunction ToastClose({\n className,\n children,\n render = ,\n sound = true,\n ...props\n}: ToastPrimitive.Close.Props & { sound?: boolean }) {\n return (\n \n \n {children ?? }\n \n \n );\n}\n\nfunction ToastIcon({ type }: { type: string | undefined }) {\n let icon: React.ReactNode = null;\n\n if (type === \"success\") {\n icon = ;\n }\n\n if (type === \"info\") {\n icon = ;\n }\n\n if (type === \"warning\") {\n icon = ;\n }\n\n if (type === \"error\") {\n icon = ;\n }\n\n if (type === \"loading\") {\n icon = ;\n }\n\n if (!icon) {\n return null;\n }\n\n return (\n \n {icon}\n \n );\n}\n\nfunction ToastList() {\n const { toasts } = ToastPrimitive.useToastManager();\n\n return toasts.map((toastItem) => (\n \n \n \n \n \n \n
\n \n \n \n \n ));\n}\n\nfunction Toaster({\n children,\n toastManager = toast,\n ...props\n}: React.ComponentProps) {\n return (\n \n {children}\n \n \n \n \n \n \n );\n}\n\nconst createToastManager = ToastPrimitive.createToastManager;\nconst useToastManager = ToastPrimitive.useToastManager;\n\nexport {\n Toaster,\n Toast,\n ToastAction,\n ToastClose,\n ToastContent,\n ToastDescription,\n ToastPortal,\n ToastProvider,\n ToastTitle,\n ToastViewport,\n createToastManager,\n toast,\n useToastManager,\n};\n",
"type": "registry:ui"
}
],
"type": "registry:ui"
}