aboutsummaryrefslogtreecommitdiff
path: root/examples/nested
diff options
context:
space:
mode:
Diffstat (limited to 'examples/nested')
-rw-r--r--examples/nested/gleam.toml7
-rw-r--r--examples/nested/manifest.toml11
-rw-r--r--examples/nested/src/nested.gleam57
3 files changed, 75 insertions, 0 deletions
diff --git a/examples/nested/gleam.toml b/examples/nested/gleam.toml
new file mode 100644
index 0000000..dd00c99
--- /dev/null
+++ b/examples/nested/gleam.toml
@@ -0,0 +1,7 @@
+name = "nested"
+version = "1.0.0"
+target = "javascript"
+
+[dependencies]
+gleam_stdlib = "~> 0.34"
+lustre = { path = "../../" } \ No newline at end of file
diff --git a/examples/nested/manifest.toml b/examples/nested/manifest.toml
new file mode 100644
index 0000000..715dadc
--- /dev/null
+++ b/examples/nested/manifest.toml
@@ -0,0 +1,11 @@
+# This file was generated by Gleam
+# You typically do not need to edit this file
+
+packages = [
+ { name = "gleam_stdlib", version = "0.34.0", build_tools = ["gleam"], requirements = [], otp_app = "gleam_stdlib", source = "hex", outer_checksum = "1FB8454D2991E9B4C0C804544D8A9AD0F6184725E20D63C3155F0AEB4230B016" },
+ { name = "lustre", version = "3.0.12", build_tools = ["gleam"], requirements = ["gleam_stdlib"], source = "local", path = "../.." },
+]
+
+[requirements]
+gleam_stdlib = { version = "~> 0.34" }
+lustre = { path = "../../" }
diff --git a/examples/nested/src/nested.gleam b/examples/nested/src/nested.gleam
new file mode 100644
index 0000000..89e68f0
--- /dev/null
+++ b/examples/nested/src/nested.gleam
@@ -0,0 +1,57 @@
+// IMPORTS ---------------------------------------------------------------------
+
+import examples/counter
+import gleam/list
+import gleam/map.{type Map}
+import gleam/pair
+import lustre
+import lustre/element.{type Element}
+import lustre/element/html.{div}
+
+// MAIN ------------------------------------------------------------------------
+
+pub fn main() {
+ // A `simple` lustre application doesn't produce `Effect`s. These are best to
+ // start with if you're just getting started with lustre or you know you don't
+ // need the runtime to manage any side effects.
+ let app = lustre.simple(init, update, view)
+ let assert Ok(_) = lustre.start(app, "[data-lustre-app]", Nil)
+
+ Nil
+}
+
+// MODEL -----------------------------------------------------------------------
+
+type Model =
+ Map(Int, counter.Model)
+
+fn init(_) -> Model {
+ use counters, id <- list.fold(list.range(1, 10), map.new())
+
+ map.insert(counters, id, counter.init(Nil))
+}
+
+// UPDATE ----------------------------------------------------------------------
+
+type Msg =
+ #(Int, counter.Msg)
+
+fn update(model: Model, msg: Msg) -> Model {
+ let #(id, counter_msg) = msg
+ let assert Ok(counter) = map.get(model, id)
+
+ map.insert(model, id, counter.update(counter, counter_msg))
+}
+
+// RENDER ----------------------------------------------------------------------
+
+fn view(model: Model) -> Element(Msg) {
+ let counters = {
+ use rest, id, counter <- map.fold(model, [])
+ let el = element.map(counter.view(counter), pair.new(id, _))
+
+ [el, ..rest]
+ }
+
+ div([], counters)
+}