JumarWeb.ModalComponents (Jumar v0.1.0)

View Source

You'll still get emails from people who accidentally deleted their account, but at least you tried.

Summary

Functions

hide_modal(js \\ %JS{}, id)

Hides an alert dialog with the given id.

modal(assigns)

Modal dialog component with customizable size and styles.

show_modal(js \\ %JS{}, id)

Shows an alert dialog with the given id.

Functions

hide_modal(js \\ %JS{}, id)

Hides an alert dialog with the given id.

modal(assigns)

Modal dialog component with customizable size and styles.

Examples

<.modal id="confirm-modal">
  Are you sure?
</.modal>

JS commands may be passed to the :on_cancel and on_confirm attributes for the caller to react to each button press, for example:

<.modal id="confirmation" on_cancel={JS.navigate(~p"/posts")} on_confirm={JS.push("confirm")}>
  Are you sure you?
  <:confirm>Ok</:confirm>
  <:cancel>Cancel</:concel>
</.modal>

Attributes

  • id (:string) (required)
  • show (:boolean) - Defaults to false.
  • size (:string) - Size of the modal dialog. Defaults to "md". Must be one of "2xl", "3xl", "4xl", "5xl", "lg", "md", "sm", "xl", or "xs".
  • on_cancel (Phoenix.LiveView.JS) - Defaults to %Phoenix.LiveView.JS{ops: []}.
  • on_confirm (Phoenix.LiveView.JS) - Defaults to %Phoenix.LiveView.JS{ops: []}.

Slots

  • inner_block (required)
  • title
  • subtitle
  • confirm
  • cancel

show_modal(js \\ %JS{}, id)

Shows an alert dialog with the given id.