Moon Liveview Library

Dialog

Default Open in playground
Content
 
<.button phx-click={show_dialog("dialog-single-default")} data-testid="dialog-default-open-button">
    Open Dialog
  </.button>
  <.dialog id="dialog-single-default">
    <div class="w-full flex items-center justify-center h-40 bg-brand-subtle text-brand">Content</div>
  </.dialog>
With header Open in playground
Dialog
Content
 
<.button phx-click={show_dialog("dialog-single-with-header")} data-testid="dialog-default-open-button">
    Open Dialog
  </.button>
  <.dialog id="dialog-single-with-header">
    <:header>
      Dialog
      <.dialog_close />
    </:header>
    <div class="flex items-center justify-center h-40 bg-brand-subtle text-brand">Content</div>
  </.dialog>