Closes a dialog component (modal, sheet).

Parameters

• id - The ID of the dialog element to close.

Example

<.button phx-click={Fluxon.close_dialog("my-modal")}>Close modal</.button>
<.modal id="my-modal"></.modal>

Closes a dialog via push event.

Parameters

• socket - The Phoenix.LiveView.Socket struct.
• id - The ID of the dialog element to close.

Example

def handle_event("close_dialog", _, socket) do
  {:noreply, Fluxon.close_dialog(socket, "my-dialog")}
end

Closes a popover component.

Parameters

• id - The ID of the popover element to close.

Example

<.button phx-click={Fluxon.close_popover("my-popover")}>Close popover</.button>
<.popover id="my-popover"></.popover>

Programmatically dismisses a toast by ID.

Example

socket = Fluxon.dismiss_toast(socket, toast_id)

Opens a dialog component (modal, sheet).

Example

<.button phx-click={Fluxon.open_dialog("my-modal")}>Open modal</.button>
<.modal id="my-modal"></.modal>

Opens a dialog via push event.

Parameters

• socket - The Phoenix.LiveView.Socket struct.
• id - The ID of the dialog element to open.

Example

def handle_event("open_dialog", _, socket) do
  {:noreply, Fluxon.open_dialog(socket, "my-dialog")}
end

Opens a popover component.

Example

<.button phx-click={Fluxon.open_popover("my-popover")}>Open popover</.button>
<.popover id="my-popover"></.popover>

Shows a toast notification.

Works with both Phoenix.LiveView.Socket (via push_event) and Plug.Conn (via response cookie). When using Plug.Conn, the :content option is silently dropped since cookies cannot safely transport HTML.

Options

• :color - :info | :success | :warning | :error or nil for neutral (default nil)

• :description - secondary text below title
• :content - custom HEEx (~H"...") or HTML string (LiveView only)
• :icon - false to hide icon, or custom HEEx/HTML (LiveView only). Default uses color-based icon.
• :duration - auto-dismiss ms (default 4000, nil for persistent)
• :dismissible - boolean (default true)
• :action - single action map (shorthand for :actions with one item)
• :actions - list of action maps. Each map supports:
  • label (required) - button/link text
  • event - LiveView event name (makes it a button)
  • href - URL (makes it a link)
  • value - map payload sent with the event (default %{})

  • variant - "outline" | "solid" | "soft" | "surface" | "ghost" | "link" (default "outline")

• :id - custom ID (auto-generated if omitted)

Examples

# From a LiveView handler
Fluxon.put_toast(socket, "Changes saved!")
Fluxon.put_toast(socket, "User created", color: :success, description: "Email sent.")

# Single action (shorthand)
Fluxon.put_toast(socket, "Deleted", action: %{label: "Undo", event: "undo"})

# Multiple actions
Fluxon.put_toast(socket, "Deploy failed",
  color: :error,
  actions: [
    %{label: "Retry", event: "retry_deploy"},
    %{label: "View Logs", href: "/logs/123", variant: "link"}
  ])

# From a controller
Fluxon.put_toast(conn, "Welcome back!", color: :info)

# With custom content (LiveView only)
Fluxon.put_toast(socket, "New follower",
  content: ~H"""
  <div class="flex items-center gap-2">
    <img src={@user.avatar} class="size-6 rounded-full" />
    <span>{@user.name} started following you</span>
  </div>
  """)

Shows a loading toast and returns the socket and toast ID for later resolution.

Example

{socket, toast_id} = Fluxon.put_toast_loading(socket, "Uploading...")
# Later, in another handler:
socket = Fluxon.resolve_toast(socket, toast_id, :success, "Upload complete!")

Resolves a loading toast with a new color and title.

Example

socket = Fluxon.resolve_toast(socket, toast_id, :success, "Upload complete!")
socket = Fluxon.resolve_toast(socket, toast_id, :error, "Upload failed!", description: "Try again.")