1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
// IMPORTS ---------------------------------------------------------------------
import gleam/javascript/promise.{Promise}
import gleam/string
import lustre
import lustre/cmd.{Cmd}
import lustre/element.{Element}
import lustre/event
// MAIN ------------------------------------------------------------------------
pub fn main() -> Promise(fn(Msg) -> Nil) {
let selector = "[data-lustre-container]"
let program = lustre.application(init(), update, render)
use _ <- promise.tap(lustre.start(program, selector))
Nil
}
// MODEL -----------------------------------------------------------------------
type Model =
Int
fn init() -> #(Model, Cmd(Msg)) {
#(0, cmd.none())
}
// UPDATE ----------------------------------------------------------------------
pub opaque type Msg {
SetCount(Int)
}
fn update(_: Model, msg: Msg) -> #(Model, Cmd(Msg)) {
case msg {
SetCount(n) -> #(n, cmd.none())
}
}
// RENDER ----------------------------------------------------------------------
fn render(model: Model) -> Element(Msg) {
element.div(
[],
[
element.map(
fn() {
element.button([event.on_click(model + 1)], [element.text("+")])
},
SetCount,
),
element.text(string.inspect(model)),
],
)
}
|
