Components Notifications

Notifications

Toasts appear bottom-right, auto-dismiss after 5 seconds, and can be closed manually. Driven from the server via TempData — rendered by the layout's _Notification partial.

<koala-notification>

Canonical

Quote created successfully.

// In a PageModel OnPost handler, after a successful action:
TempData.SetSuccessNotification("Quote created.");
return RedirectToPage("./Index");

Server-driven via TempData.SetSuccessNotification(...). The layout's _Notification partial sits in an x-sync region so AJAX responses repaint it.

Variants

3 variants

Quote created successfully.

Success

SetSuccessNotification

Quote email was sent recently — try again in a few minutes.

Info

SetInfoNotification

Something went wrong. Please try again.

Error

SetErrorNotification

Info — neutral outcome, action didn't proceed.

TempData.SetInfoNotification("Quote email was sent recently — try again in a few minutes.");

Error — failed action.

TempData.SetErrorNotification("Something went wrong. Please try again.");

States

3 states

Entering

Idle

Leaving

Props

4 helpers

TempData helper	Notes
TempData.SetSuccessNotification(...)	Green check toast. For create / update / accept.
TempData.SetInfoNotification(...)	Blue info toast. For neutral outcomes — no failure, but the user's action didn't proceed (rate-limited, no-op, etc.).
TempData.SetErrorNotification(...)	Red X toast. For failed actions.
_Notification partial	Sits in the layout inside an `x-sync` region so AJAX responses repaint it.

Do & don't

Quote created.

Do Use one short sentence. Confirm the outcome — "Quote created." not "Your quote has been created successfully and saved to the database."

Please confirm before continuing

This will cancel the active transaction.

Don't Don't use a toast for confirmations or destructive actions. They auto-dismiss — the user can miss them. Use a modal.