sonner.tsx 869 B

1234567891011121314151617181920212223242526272829303132
  1. "use client"
  2. import { Toaster as Sonner } from "sonner"
  3. import { useThemeContext } from "@/contexts/themeProvider"
  4. type ToasterProps = React.ComponentProps<typeof Sonner>
  5. const Toaster = ({ ...props }: ToasterProps) => {
  6. const { theme } = useThemeContext()
  7. return (
  8. <Sonner
  9. theme={theme as ToasterProps["theme"]}
  10. position="bottom-right"
  11. className="toaster group"
  12. toastOptions={{
  13. classNames: {
  14. toast:
  15. "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
  16. description: "group-[.toast]:text-muted-foreground",
  17. actionButton:
  18. "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
  19. cancelButton:
  20. "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
  21. },
  22. }}
  23. {...props}
  24. />
  25. )
  26. }
  27. export { Toaster }