4 files changed, 94 insertions, 0 deletions
diff --git a/examples/pure/counter/Cargo.toml b/examples/pure/counter/Cargo.toml
new file mode 100644
index 00000000..1363bfd5
--- /dev/null
+++ b/examples/pure/counter/Cargo.toml
@@ -0,0 +1,10 @@
+[package]
+name = "pure_counter"
+version = "0.1.0"
+authors = ["Héctor Ramón Jiménez <hector0193@gmail.com>"]
+edition = "2021"
+publish = false
+
+[dependencies]
+iced = { path = "../../.." }
+iced_pure = { path = "../../../pure" }
diff --git a/examples/pure/counter/README.md b/examples/pure/counter/README.md
new file mode 100644
index 00000000..4d9fc5b9
--- /dev/null
+++ b/examples/pure/counter/README.md
@@ -0,0 +1,18 @@
+## Counter
+
+The classic counter example explained in the [`README`](../../README.md).
+
+The __[`main`]__ file contains all the code of the example.
+
+<div align="center">
+  <a href="https://gfycat.com/fairdeadcatbird">
+    <img src="https://thumbs.gfycat.com/FairDeadCatbird-small.gif">
+  </a>
+</div>
+
+You can run it with `cargo run`:
+```
+cargo run --package counter
+```
+
+[`main`]: src/main.rs
diff --git a/examples/pure/counter/index.html b/examples/pure/counter/index.html
new file mode 100644
index 00000000..d2e368e4
--- /dev/null
+++ b/examples/pure/counter/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8" content="text/html; charset=utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Counter - Iced</title>
+    <base data-trunk-public-url />
+</head>
+<body>
+<link data-trunk rel="rust" href="Cargo.toml" data-wasm-opt="z" data-bin="counter" />
+</body>
+</html>
diff --git a/examples/pure/counter/src/main.rs b/examples/pure/counter/src/main.rs
new file mode 100644
index 00000000..e2746d40
--- /dev/null
+++ b/examples/pure/counter/src/main.rs
@@ -0,0 +1,54 @@
+use iced::{Alignment, Element, Sandbox, Settings};
+use iced_pure::{Button, Column, Pure, State, Text};
+
+pub fn main() -> iced::Result {
+    Counter::run(Settings::default())
+}
+
+struct Counter {
+    value: i32,
+    state: State<Message, iced::Renderer>,
+}
+
+#[derive(Debug, Clone, Copy)]
+enum Message {
+    IncrementPressed,
+    DecrementPressed,
+}
+
+impl Sandbox for Counter {
+    type Message = Message;
+
+    fn new() -> Self {
+        Self {
+            value: 0,
+            state: State::new(),
+        }
+    }
+
+    fn title(&self) -> String {
+        String::from("Counter - Iced")
+    }
+
+    fn update(&mut self, message: Message) {
+        match message {
+            Message::IncrementPressed => {
+                self.value += 1;
+            }
+            Message::DecrementPressed => {
+                self.value -= 1;
+            }
+        }
+    }
+
+    fn view(&mut self) -> Element<'_, Message> {
+        let content = Column::new()
+            .padding(20)
+            .align_items(Alignment::Center)
+            .push(Button::new("Increment").on_press(Message::IncrementPressed))
+            .push(Text::new(self.value.to_string()).size(50))
+            .push(Button::new("Decrement").on_press(Message::DecrementPressed));
+
+        Pure::new(&mut self.state, content).into()
+    }
+}