Merge branch 'main' into feat/memoized-focused-node

marc2332 · Feb 6, 2024 · ebfa82e · ebfa82e
2 parents 6cb222f + 2136277
commit ebfa82e
Show file tree

Hide file tree

Showing 90 changed files with 1,581 additions and 1,391 deletions.
diff --git a/.github/workflows/rust.yml b/.github/workflows/rust.yml
@@ -25,7 +25,7 @@ jobs:
     - name: Set up cargo cache
       uses: Swatinem/rust-cache@v2
       with:
-        prefix-key: "5"
+        prefix-key: "6"
     - name: Install linux dependencies
       if: runner.os == 'Linux'
       run: |
@@ -51,7 +51,7 @@ jobs:
         rustup component add llvm-tools-preview 
         curl -L https://github.com/mozilla/grcov/releases/latest/download/grcov-x86_64-unknown-linux-gnu.tar.bz2 | tar jxf -
         ./grcov . --binary-path ./target/debug/deps -s . -t lcov --branch --ignore-not-existing --ignore "../*" --ignore "/*" -o cov.lcov
-    - uses: codecov/codecov-action@v3
+    - uses: codecov/codecov-action@v4
       if: runner.os == 'Linux'
       with:
         token: ${{ secrets.CODECOV_TOKEN }}

diff --git a/Cargo.toml b/Cargo.toml
@@ -26,27 +26,27 @@ freya-testing = { path = "crates/testing", version = "0.1" }
 freya-engine = { path = "crates/engine", version = "0.1" }
 torin = { path = "crates/torin", version = "0.1" }
 
-dioxus = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be", default-features = false, features = ["macro", "signals", "hooks", "hot-reload", "html"]}
-dioxus-native-core-macro = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be" }
-dioxus-rsx = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be", features = ["hot_reload"] }
-dioxus-native-core = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be", features = ["dioxus"] }
-dioxus-core-macro = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be" }
-dioxus-hooks = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be" }
-dioxus-signals = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be" }
-dioxus-core = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be" }
-dioxus-hot-reload = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be", features = ["file_watcher"], default-features = false }
-dioxus-router = { git = "https://github.com/DioxusLabs/dioxus", rev = "53380c9956c7dda54d9251d3bc48eaa0ec4e89be", default-features = false }
+dioxus = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892", default-features = false, features = ["macro", "signals", "hooks", "hot-reload", "html"]}
+dioxus-native-core-macro = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892" }
+dioxus-rsx = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892", features = ["hot_reload"] }
+dioxus-native-core = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892", features = ["dioxus"] }
+dioxus-core-macro = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892" }
+dioxus-hooks = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892" }
+dioxus-signals = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892" }
+dioxus-core = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892" }
+dioxus-hot-reload = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892", features = ["file_watcher"], default-features = false }
+dioxus-router = { git = "https://github.com/DioxusLabs/dioxus", rev = "ef101dd876ee8ecdd702a7e22addfd47f2ebd892", default-features = false }
 
 skia-safe = { version = "0.67.0", features = ["gl", "textlayout", "svg"] }
 
 gl = "0.14.0"
-glutin = "0.30.10"
-glutin-winit = "0.3.0"
-raw-window-handle = "0.5.1"
-winit = "0.28.7"
+glutin = "0.31.2"
+glutin-winit = "0.4.2"
+raw-window-handle = "0.5.2"
+winit = "0.29.9"
 tokio = { version = "1.33.0", features = ["sync", "rt-multi-thread", "time", "macros"] }
-accesskit = { version = "0.11.0", features = ["serde"]}
-accesskit_winit = "0.14.1"
+accesskit = { version = "0.12.2", features = ["serde"]}
+accesskit_winit = "0.18.0"
 zbus = "3.14.1"
 
 euclid = "0.22.9"

diff --git a/README.md b/README.md
@@ -20,10 +20,10 @@
 <td style="border:hidden;">
 
 ```rust, no_run
-fn app() -> Element {
-    let mut count = use_signal(|| 0);
+fn app(cx: Scope) -> Element {
+    let mut count = use_state(cx, || 0);
 
-    rsx!(
+    render!(
         rect {
             height: "20%",
             width: "100%",
@@ -59,10 +59,12 @@ fn app() -> Element {
 
 Thanks to my sponsors for supporting this project! 😄
 
-<!-- sponsors --><a href="https://github.com/piny4man"><img src="https://github.com/piny4man.png" width="60px" alt="Alberto Mendez" /></a><a href="https://github.com/stephenandary"><img src="https://github.com/stephenandary.png" width="60px" alt="Stephen Andary" /></a><!-- sponsors -->
+<!-- sponsors --><a href="https://github.com/piny4man"><img src="https://github.com/piny4man.png" width="60px" alt="Alberto Mendez" /></a><a href="https://github.com/andar1an"><img src="https://github.com/andar1an.png" width="60px" alt="Andar1an" /></a><!-- sponsors -->
 
 ### Want to try it? 🤔
 
+Note: `main` branch currently depends on Dioxus 0.5.
+
 ⚠️ First, see [Environment setup](https://book.freyaui.dev/setup.html).
 
 Clone this repo and run:

diff --git a/book/src/guides/animating.md b/book/src/guides/animating.md
@@ -18,16 +18,16 @@ fn main() {
     launch(app);
 }
 
- fn app() -> Element {
-    let mut animation = use_animation(|| 0.0);
+ fn app(cx: Scope) -> Element {
+    let animation = use_animation(cx, || 0.0);
 
     let progress = animation.value();
 
-    use_hook(move || {
+    use_memo(cx, (), move |_| {
         animation.start(Animation::new_linear(0.0..=100.0, 50));
-    })
+    });
 
-    rsx!(rect {
+    render!(rect {
         width: "{progress}",
     })
 }
@@ -53,8 +53,8 @@ fn main() {
 
 const TARGET: f64 = 500.0;
 
-fn app() -> Element {
-    let mut animation = use_animation_transition(TransitionAnimation::new_sine_in_out(200), (), || {
+fn app(cx: Scope) -> Element {
+    let animation = use_animation_transition(cx, TransitionAnimation::new_sine_in_out(200), (), || {
         vec![
             Animate::new_size(0.0, TARGET),
             Animate::new_color("rgb(33, 158, 188)", "white"),
@@ -72,7 +72,7 @@ fn app() -> Element {
         }
     };
 
-    rsx!(
+    render!(
         rect {
             overflow: "clip",
             background: "black",
@@ -83,7 +83,7 @@ fn app() -> Element {
                 height: "100%",
                 width: "200",
                 background: "{background}",
-                onclick,
+                onclick: onclick,
             }
         }
     )

diff --git a/book/src/guides/effects.md b/book/src/guides/effects.md
@@ -11,8 +11,8 @@ The `rotate` attribute let's you rotate an element.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             rotate: "180deg",
             "Hello, World!"

diff --git a/book/src/guides/elements.md b/book/src/guides/elements.md
@@ -16,8 +16,8 @@ You can specify things like [`width`](/guides/layout.html#width), [`paddings`](/
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         rect {
             direction: "vertical",
             label { "Hi!" }
@@ -34,8 +34,8 @@ The `label` element simply shows some text.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             "Hello World"
         }
@@ -53,9 +53,9 @@ Example:
 
 static FERRIS: &[u8] = include_bytes!("./ferris.svg");
 
-fn app() -> Element {
-    let ferris = bytes_to_data(FERRIS);
-    rsx!(
+fn app(cx: Scope) -> Element {
+    let ferris = bytes_to_data(cx, FERRIS);
+    render!(
         svg {
             svg_data: ferris,
         }
@@ -70,9 +70,9 @@ The `image` element, just like `svg` element, require you to pass the image byte
 ```rust, no_run
 static RUST_LOGO: &[u8] = include_bytes!("./rust_logo.png");
 
-fn app() -> Element {
-    let image_data = bytes_to_data(RUST_LOGO);
-    rsx!(
+fn app(cx: Scope) -> Element {
+    let image_data = bytes_to_data(cx, RUST_LOGO);
+    render!(
         image {
             image_data: image_data,
             width: "{size}",
@@ -87,8 +87,8 @@ fn app() -> Element {
 Both `paragraph` and `text` elements are used together. They will let you build texts with different styles.
 
 ``` rust
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         paragraph {
             text {
                 font_size: "15",

diff --git a/book/src/guides/font_style.md b/book/src/guides/font_style.md
@@ -29,8 +29,8 @@ You can learn about the syntax of this attribute in [`Color Syntax`](/guides/sty
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             color: "green",
             "Hello, World!"
@@ -42,8 +42,8 @@ fn app() -> Element {
 Another example showing [inheritance](#inheritance):
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         rect {
             color: "blue",
             label {
@@ -66,8 +66,8 @@ Limitation: Only fonts installed in the system are supported for now.
 Example: 
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             font_family: "Inter",
             "Hello, World!"
@@ -85,8 +85,8 @@ You can specify the size of the text using `font_size`.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             font_size: "50",
             "Hellooooo!"
@@ -106,8 +106,8 @@ Accepted values: `center`, `end`, `justify`, `left`, `right`, `start`
 Example
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             align: "right",
             "Hello, World!"
@@ -127,8 +127,8 @@ Accepted values: `upright` (default), `italic` and `oblique`.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             font_style: "italic",
             "Hello, World!"
@@ -170,8 +170,8 @@ Accepted values:
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             font_weight: "bold",
             "Hello, World!"
@@ -199,8 +199,8 @@ Accepted values:
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             font_weight: "bold",
             "Hello, World!"
@@ -220,8 +220,8 @@ Specify the height of the lines of the text.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             lines_height: "3",
             "Hello, World! \n Hello, again!"
@@ -237,8 +237,8 @@ Determines the amount of lines that the text can have. It has unlimited lines by
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             "Hello, World! \n Hello, World! \n Hello, world!" // Will show all three lines
         }
@@ -259,8 +259,8 @@ Specify the spacing between characters of the text.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             letter_spacing: "10",
             "Hello, World!"
@@ -278,8 +278,8 @@ Specify the spacing between words of the text.
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             word_spacing: "10",
             "Hello, World!"
@@ -302,8 +302,8 @@ Accpted values:
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             decoration: "line-through",
             "Hello, World!"
@@ -328,8 +328,8 @@ Accpted values:
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             decoration: "line-through",
             decoration_style: "dotted",
@@ -350,8 +350,8 @@ You can learn about the syntax of this attribute in [`Color Syntax`](/guides/sty
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             decoration: "line-through",
             decoration_color: "orange",
@@ -372,8 +372,8 @@ Syntax: `<x> <y> <size> <color>`
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             text_shadow: "0 18 12 rgb(0, 0, 0)",
             "Hello, World!"
@@ -395,8 +395,8 @@ Accepted values:
 Example:
 
 ```rust, no_run
-fn app() -> Element {
-    rsx!(
+fn app(cx: Scope) -> Element {
+    render!(
         label {
             max_lines: "3",
             text_overflow: "ellipsis",