diff options
author | Jacob Scearcy <jacobscearcy@gmail.com> | 2024-04-19 19:46:34 +1000 |
---|---|---|
committer | GitHub <noreply@github.com> | 2024-04-19 10:46:34 +0100 |
commit | 48b04d9dc06f3f6190c8aafcb85ca12737634234 (patch) | |
tree | 63484354a21b3207b43c830730a46467ea64040c /test/apps | |
parent | 825c52c431b3768e563b2b595f3fb703e37ebdf4 (diff) | |
download | lustre-48b04d9dc06f3f6190c8aafcb85ca12737634234.tar.gz lustre-48b04d9dc06f3f6190c8aafcb85ca12737634234.zip |
🔀 Add support for element fragments. (#99)
* #16 add fragment POC
* WIP
* 16 add fragment support to morph
* add keys for fragments
* ensure proper fragment order, refactor to handle fragment/element more similarly
* fix comment typo, incorrect child typo, simplify key check
* fix comment typo
* add snapshot tests
* flatten fragment using fold right, appending elements
* doc update
---------
Co-authored-by: Hayleigh Thompson <me@hayleigh.dev>
Diffstat (limited to 'test/apps')
-rw-r--r-- | test/apps/fragment.gleam | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/test/apps/fragment.gleam b/test/apps/fragment.gleam new file mode 100644 index 0000000..d20400e --- /dev/null +++ b/test/apps/fragment.gleam @@ -0,0 +1,45 @@ +// Similar to count app, with fragments and edge cases + +// IMPORTS --------------------------------------------------------------------- + +import gleam/int +import lustre/element.{text} +import lustre/element/html.{button, p} +import lustre/event + +// MODEL ----------------------------------------------------------------------- + +pub type Model = + Int + +pub fn init(count) { + count +} + +// UPDATE ---------------------------------------------------------------------- + +pub type Msg { + Increment + Decrement +} + +pub fn update(model, msg) { + case msg { + Increment -> model + 1 + Decrement -> model - 1 + } +} + +// VIEW ------------------------------------------------------------------------ + +pub fn view(model) { + let count = int.to_string(model) + element.fragment([ + element.fragment([p([], [element.text("start fragment")])]), + element.fragment([p([], [element.text("middle fragment")])]), + element.fragment([p([], [element.text(count)])]), + button([event.on_click(Decrement)], [text("-")]), + button([event.on_click(Increment)], [text("+")]), + p([], [element.text("order check, last element")]), + ]) +} |