Sonner

Toast notifications. Mount the toaster once, then call send_toast/2.

<.toast message="Your changes were saved." title="Saved"></.toast>

Examples

Trigger toasts

Buttons fire send_toast/2; the toaster lives in the page layout.

<div class="flex flex-wrap gap-2">
  <.button variant="outline" phx-click="demo_toast" phx-value-variant="success">Success</.button>
  <.button variant="outline" phx-click="demo_toast" phx-value-variant="error">Error</.button>
  <.button variant="outline" phx-click="demo_toast" phx-value-variant="default">Default</.button>
</div>

Props

Name	Type	Default	Values
class	:string
id	:string
message	:string
rest	:global
title	:string
variant	:string	"default"	default \| success \| info \| warning \| error
inner_block (slot)	:slot