Flash

Info Flash

Use kind=info for success messages, confirmations, and general information.

<.flash kind={:info}>
  Your changes have been saved successfully.
</.flash>

Error Flash

Use kind=error for error messages and validation failures.

<.flash kind={:error}>
  There was a problem processing your request.
</.flash>

With Title

Add a title for additional context using the title prop.

<.flash kind={:info} title="Success">
  Your profile has been updated.
</.flash>

<.flash kind={:error} title="Connection Error">
  Unable to reach the server.
</.flash>

With Formatting

The inner block supports HTML for rich content.

<.flash kind={:info} title="File Uploaded">
  Your file <strong>report.pdf</strong> has been uploaded.
</.flash>

Usage with LiveView

In LiveView, use put_flash/3 to set flash messages that will be displayed automatically.

def handle_event("save", params, socket) do
  case save_data(params) do
    {:ok, _} ->
      {:noreply, put_flash(socket, :info, "Changes saved!")}
    {:error, _} ->
      {:noreply, put_flash(socket, :error, "Failed to save")}
  end
end