openstatus.dev
Openstatus
www.openstatus.dev
1"use client";
2
3import { useTheme } from "next-themes";
4import { Toaster as Sonner } from "sonner";
5
6type ToasterProps = React.ComponentProps<typeof Sonner>;
7
8const Toaster = ({ ...props }: ToasterProps) => {
9 const { theme = "system" } = useTheme();
10
11 return (
12 <Sonner
13 theme={theme as ToasterProps["theme"]}
14 className="toaster group"
15 toastOptions={{
16 classNames: {
17 toast:
18 "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
19 description: "group-[.toast]:text-muted-foreground",
20 actionButton:
21 "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
22 cancelButton:
23 "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
24 closeButton: "group-[.toast]:text-muted-foreground",
25 },
26 }}
27 {...props}
28 />
29 );
30};
31
32export { Toaster };