gbr_ui - v1.0.1

gbr/ui/admin/button

⚉ Gleam UI button super element.

Supose button text and svg at left side:

import gbr/ui/button

import gbr/ui/svg
import gbr/ui/svg/icons

import gbr/ui/core/model.{type UIRender, uilabel}

fn render(id: String) -> UIRender(a) {
  label = uilabel("Button w/ icon back!", [])
  let inner = [
    svg.new("id-svg", 20, 20)
      |> icons.back()
      |> svg.render()
    ]
  ]
  button.new(id)
    |> button.label(label)
    |> button.at_left(inner)
    |> button.on_click(onclick)
    |> button.render()
}

Roadmap

🚧 Work in progress

Types

UIButton

opaque </>

Button super element.

pub opaque type UIButton

UIButtonRender

</>

Button render type.

pub type UIButtonRender(a) {
  UIButtonRender(
    in: UIButton,
    inner: List(element.Element(a)),
    onclick: option.Option(a),
  )
}

Constructors

Values

app_nav

</> 
pub fn app_nav(
  id: String,
  open: Bool,
  onclick: option.Option(a),
) -> element.Element(a)

Render app nav mobile toggle button.

at

</> 
pub fn at(in: UIButton) -> UIButtonRender(a)

New button render at default.

at_left

</> 
pub fn at_left(
  in: UIButton,
  inner: List(element.Element(a)),
) -> UIButtonRender(a)

New button render at left inner and onclick event.

at_right

</> 
pub fn at_right(
  in: UIButton,
  inner: List(element.Element(a)),
) -> UIButtonRender(a)

New button render at right inner and onclick event.

back

</> 
pub fn back(
  id: String,
  text: String,
  onclick: a,
) -> element.Element(a)

Render back history button.

class

</> 
pub fn class(in: UIButton, class: String) -> UIButton

Set button class.

classes

</> 
pub fn classes(
  in: UIButton,
  classes: List(#(String, Bool)),
) -> UIButton

Set button classes.

dark_mode

</> 
pub fn dark_mode(
  id: String,
  onclick: option.Option(a),
) -> element.Element(a)

Render dark mode toggle button.

disabled

</> 
pub fn disabled(in: UIButton, disabled: Bool) -> UIButton

Set button disabled.

label

</> 
pub fn label(in: UIButton, text: String) -> UIButton

Set button label.

new

</> 
pub fn new(id: String) -> UIButton

New button super element.

on_click

</> 
pub fn on_click(
  in: UIButtonRender(a),
  onclick: a,
) -> UIButtonRender(a)

on_click_opt

</> 
pub fn on_click_opt(
  in: UIButtonRender(a),
  onclick: option.Option(a),
) -> UIButtonRender(a)

Set button render onclick event.

primary

</> 
pub fn primary(in: UIButton) -> UIButton

Set button disabled.

render

</> 
pub fn render(at: UIButtonRender(a)) -> element.Element(a)

Render button super element to lustre/element.{type Element}.

</> 
pub fn sidebar(
  id: String,
  open: Bool,
  onclick: option.Option(a),
) -> element.Element(a)

Render sidebar toggle button.

✨ Search Document