Components

Toast

Transient, non-blocking feedback after an action. Based on Sonner. Yuno convention: success messages include 'successfully' + period.

Updated Jul 8, 2026 by Leonardo Posada

Trigger

import { toast } from "sonner";

toast.success("Rule created successfully.");
toast.error("Something went wrong.");

When to use

  • Confirm a successful action ('Rule created successfully.').
  • Show a non-blocking error the user can dismiss.
  • Offer undo affordance for reversible actions.

When not to use

  • Requires acknowledgment — use Dialog.
  • Persistent status — use inline Alert or Badge.

Usage

Do
  • Follow the Yuno copy convention: 'X successfully.' with a period.
  • Keep message under 60 characters.
  • Include an Undo action for reversible operations.
Don't
  • Don't fire multiple toasts for the same event.
  • Don't put required actions inside a toast — it can auto-dismiss.
  • Don't rely on toast for error states that block progress.