button

Button component for lustre_prefab.

Modeled after the Clarity Design System’s button component. See: https://clarity.design/documentation/button

Types

opaque </>

pub opaque type Button(msg)

</>

Button size options

pub type Size {
  Normal
  Small
  Large
  Block
}

</>

Button style options (color scheme)

pub type Style {
  Primary
  Secondary
  Success
  Danger
  Warning
  Info
}

</>

Button variant options (visual style)

pub type Variant {
  Solid
  Outline
  Flat
}

</>

pub fn new(
  label: String,
  on_click: option.Option(msg),
) -> Button(msg)

Create a new button with a label and optional onClick message

button.new("Submit", Some(Submit))
  |> button.with_style(button.Primary)
  |> button.view([])

</>

pub fn view(
  btn: Button(msg),
  extra_attrs: List(@internal Attribute(@internal Aligned, msg)),
) -> stylish.Element(msg)

Render the button

button.new("Click me", Some(ButtonClicked))
  |> button.with_style(button.Primary)
  |> button.view([])

</>

pub fn with_disabled(btn: Button(msg)) -> Button(msg)

Disable the button

</>

pub fn with_label_hidden(btn: Button(msg)) -> Button(msg)

Hide the button label (useful for icon-only buttons)

</>

pub fn with_size(btn: Button(msg), size: Size) -> Button(msg)

Set the button size

</>

pub fn with_style(btn: Button(msg), style: Style) -> Button(msg)

Set the button style (color scheme)

</>

pub fn with_variant(
  btn: Button(msg),
  variant: Variant,
) -> Button(msg)

Set the button variant (visual style)

</>

pub fn without_caps(btn: Button(msg)) -> Button(msg)

Remove all-caps transformation