Fluxon (Fluxon v1.1.0)

To use Fluxon components in your LiveView or View modules, add the following to your module:

use Fluxon

This will import all available components. You can customize which components to import using the following options:

  • :only - List of components to import. Only the specified components will be imported.

    use Fluxon, only: [:button, :input, :modal]
  • :except - List of components to exclude. All components except the specified ones will be imported.

    use Fluxon, except: [:table, :tabs]

Summary

Functions

Closes a dialog component (modal, sheet).

Closes a dialog via push event.

Opens a dialog component (modal, sheet).

Opens a dialog via push event.

Functions

close_dialog(id)

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>

close_dialog(socket, id)

Closes a dialog via push event.

Parameters

Example

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

open_dialog(id)

Opens a dialog component (modal, sheet).

Example

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

open_dialog(socket, id)

Opens a dialog via push event.

Parameters

Example

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