Components/Sonner

Sonner

Imperative toast API. Call toast() from anywhere — Sonner-style, no providers passed around.

Installation

npx ajaxui add sonner

Usage

// Mount once in your root
<Toaster>
  <ToasterBridge />
  {children}
</Toaster>

// Call from anywhere
import { toast } from "@/components/ui/sonner"
toast("Event has been created")

Anatomy

// Place a single <Toaster> at your app root:
<Toaster richColors position="bottom-right" />

// Then call from anywhere - no context required:
import { toast } from "@/components/ui/sonner"
toast.success("Saved")
toast.error("Could not save")
toast("Loading...", { id: "x" })