Sonner

An opinionated toast component for React.

Example

Code

Example

import { toast } from "sonner"
import { Button } from "cephalopod-design-system"
import { Toaster } from "cephalopod-design-system"

<Button
  variant="outline"
  onClick={() =>
    toast("Event has been created", {
      description: "Sunday, December 03, 2023 at 9:00 AM",
      action: {
        label: "Undo",
        onClick: () => console.log("Undo"),
      },
    })
  }
>
  Show Toast
</Button>
<Toaster />