glaze_basecoat - v1.0.0

glaze/basecoat/dialog

Basecoat documentation: https://basecoatui.com/components/dialog/

The dialog helpers build native HTML dialog flows for confirmations, forms, and focused tasks.

Anatomy

A dialog flow usually includes a dialog container and a trigger that opens it.

Recipe

import glaze/basecoat/dialog
import lustre/attribute
import lustre/element/html

fn edit_profile_dialog() {
  dialog.dialog_with_description(
    "edit-profile",
    "Edit profile",
    "Make changes to your profile here.",
    [dialog.max_width("425px")],
    [
    dialog.content([], [html.text("Dialog content here.")]),
    dialog.footer([], [
      button.button([], [html.text("Save")]),
    ]),
    ],
  )
}

References

Values

close_button

</> 
pub fn close_button(
  attrs: List(attribute.Attribute(msg)),
) -> element.Element(msg)

close_on_backdrop

</> 
pub fn close_on_backdrop() -> attribute.Attribute(msg)

close_script

</> 
pub fn close_script(dialog_id: String) -> String

content

</> 
pub fn content(
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)

dialog

</> 
pub fn dialog(
  id: String,
  title: String,
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)

dialog_with_description

</> 
pub fn dialog_with_description(
  id: String,
  title: String,
  description: String,
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)
</> 
pub fn footer(
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)

full_width

</> 
pub fn full_width() -> attribute.Attribute(msg)
</> 
pub fn header(
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)

max_height

</> 
pub fn max_height(height: String) -> attribute.Attribute(msg)

max_width

</> 
pub fn max_width(width: String) -> attribute.Attribute(msg)

open_script

</> 
pub fn open_script(dialog_id: String) -> String

responsive_width

</> 
pub fn responsive_width(
  width: String,
) -> attribute.Attribute(msg)

scrollable_content

</> 
pub fn scrollable_content(
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)

trigger_button

</> 
pub fn trigger_button(
  dialog_id: String,
  attrs: List(attribute.Attribute(msg)),
  children: List(element.Element(msg)),
) -> element.Element(msg)
✨ Search Document