Merge branch 'master' into jk/templates-v3

docs/guide/src/en/getting_started/mobile.md

@@ -5,12 +5,13 @@ Build a mobile app with Dioxus!
 Example: [Todo App](https://github.com/DioxusLabs/example-projects/blob/master/ios_demo)
 
 ## Support
-Mobile is currently the least-supported renderer target for Dioxus. Mobile apps are rendered with the platform's WebView, meaning that animations, transparency, and native widgets are not currently achievable.
+Mobile is currently the least-supported renderer target for Dioxus. Mobile apps are rendered with either the platform's WebView or experimentally through WGPU. WebView doesn't support animations, transparency, and native widgets.
 
-In addition, iOS is the only supported Mobile Platform. It is possible to get Dioxus running on Android and rendered with WebView, but the Rust windowing library that Dioxus uses – tao – does not currently support Android.
 
 Mobile support is currently best suited for CRUD-style apps, ideally for internal teams who need to develop quickly but don't care much about animations or native widgets.
 
+This guide is primarily targetted for iOS apps, however, you can follow it while using the `android` guide in `cargo-mobile`.
+
 ## Getting Set up
 
 Getting set up with mobile can be quite challenging. The tooling here isn't great (yet) and might take some hacking around to get things working. macOS M1 is broadly unexplored and might not work for you.

examples/README.md

@@ -134,31 +134,33 @@ cargo run --example hello_world
 
 ## Terminal UI
 
-[tui_border](./tui_border.rs)
+[tui_all_events](../packages/tui/examples/tui_all_events.rs) - All of the terminal events
 
-[tui_buttons](./tui_buttons.rs)
+[tui_border](../packages/tui/examples/tui_border.rs) - Different styles of borders and corners
 
-[tui_color_test](./tui_color_test.rs)
+[tui_buttons](../packages/tui/examples/tui_buttons.rs) - A grid of buttons that work demonstrate the focus system
 
-[tui_components](./tui_components.rs)
+[tui_color_test](../packages/tui/examples/tui_color_test.rs) - Grid of colors to demonstrate compatablility with different terminal color rendering modes
 
-[tui_frame](./tui_frame.rs)
+[tui_colorpicker](../packages/tui/examples/tui_colorpicker.rs) - A colorpicker
 
-[tui_hover](./tui_hover.rs)
+[tui_components](../packages/tui/examples/tui_components.rs) - Simple component example
 
-[tui_keys](./tui_keys.rs)
+[tui_flex](../packages/tui/examples/tui_flex.rs) - Flexbox support
 
-[tui_list](./tui_list.rs)
+[tui_hover](../packages/tui/examples/tui_hover.rs) - Detect hover and mouse events
 
-[tui_margin](./tui_margin.rs)
+[tui_list](../packages/tui/examples/tui_list.rs) - Renders a list of items
 
-[tui_quadrants](./tui_quadrants.rs)
+[tui_margin](../packages/tui/examples/tui_margin.rs) - Margins around flexboxes
 
-[tui_readme](./tui_readme.rs)
+[tui_quadrants](../packages/tui/examples/tui_quadrants.rs) - Four quadrants
 
-[tui_task](./tui_task.rs)
+[tui_readme](../packages/tui/examples/tui_readme.rs) - The readme example
 
-[tui_text](./tui_text.rs)
+[tui_task](../packages/tui/examples/tui_task.rs) - Background tasks
+
+[tui_text](../packages/tui/examples/tui_text.rs) - Simple text example
 
 # TODO
 Missing Features

examples/simple_list.rs

@@ -19,6 +19,16 @@ fn app(cx: Scope) -> Element {
 
             // Use optionals
             Some(rsx! { "Some" }),
+
+            div {
+                for name in 0..10 {
+                    rsx! { "{name}" }
+                }
+
+                if true {
+                    rsx!{ "hello world!" }
+                }
+            }
         }
     ))
 }

packages/desktop/Cargo.toml

@@ -28,7 +28,7 @@ tokio = { version = "1.16.1", features = [
     "rt",
     "time",
 ], optional = true, default-features = false }
-webbrowser = "0.7.1"
+webbrowser = "0.8.0"
 infer = "0.9.0"
 dunce = "1.0.2"
 

packages/desktop/src/desktop_context.rs

@@ -182,7 +182,13 @@ pub(super) fn handler(
 ) {
     // currently dioxus-desktop supports a single window only,
     // so we can grab the only webview from the map;
-    let webview = desktop.webviews.values().next().unwrap();
+    // on wayland it is possible that a user event is emitted
+    // before the webview is initialized. ignore the event.
+    let webview = if let Some(webview) = desktop.webviews.values().next() {
+        webview
+    } else {
+        return;
+    };
     let window = webview.window();
 
     println!("user_event: {:?}", user_event);

packages/desktop/src/protocol.rs

@@ -18,8 +18,6 @@ pub(super) fn desktop_handler(
     custom_head: Option<String>,
     custom_index: Option<String>,
 ) -> Result<Response<Vec<u8>>> {
-    println!("loading request: {:?}", request.uri());
-
     // Any content that uses the `dioxus://` scheme will be shuttled through this handler as a "special case".
     // For now, we only serve two pieces of content which get included as bytes into the final binary.
     let path = request.uri().to_string().replace("dioxus://", "");

packages/rsx/src/node.rs

@@ -88,7 +88,6 @@ impl Parse for BodyNode {
             // crate::Input::<InputProps<'_, i32> {}
             if body_stream.peek(token::Brace) {
                 Component::validate_component_path(&path)?;
-
                 return Ok(BodyNode::Component(stream.parse()?));
             }
         }

packages/tui/examples/tui_keys.rs

@@ -1,66 +0,0 @@
-use dioxus::events::WheelEvent;
-use dioxus::prelude::*;
-use dioxus_html::geometry::ScreenPoint;
-use dioxus_html::input_data::keyboard_types::Code;
-use dioxus_html::input_data::MouseButtonSet;
-use dioxus_html::on::{KeyboardEvent, MouseEvent};
-
-fn main() {
-    dioxus_tui::launch(app);
-}
-
-fn app(cx: Scope) -> Element {
-    let key = use_state(&cx, || "".to_string());
-    let mouse = use_state(&cx, ScreenPoint::zero);
-    let count = use_state(&cx, || 0);
-    let buttons = use_state(&cx, MouseButtonSet::empty);
-    let mouse_clicked = use_state(&cx, || false);
-
-    let key_down_handler = move |evt: KeyboardEvent| {
-        match evt.data.code() {
-            Code::ArrowLeft => count.set(count + 1),
-            Code::ArrowRight => count.set(count - 1),
-            Code::ArrowUp => count.set(count + 10),
-            Code::ArrowDown => count.set(count - 10),
-            _ => {}
-        }
-        key.set(format!(
-            "{:?} repeating: {:?}",
-            evt.key(),
-            evt.is_auto_repeating()
-        ));
-    };
-
-    cx.render(rsx! {
-        div {
-            width: "100%",
-            height: "10px",
-            background_color: "red",
-            justify_content: "center",
-            align_items: "center",
-            flex_direction: "column",
-            onkeydown: key_down_handler,
-            onwheel: move |evt: WheelEvent| {
-                count.set(count + evt.data.delta().strip_units().y as i64);
-            },
-            ondrag: move |evt: MouseEvent| {
-                mouse.set(evt.data.screen_coordinates());
-            },
-            onmousedown: move |evt: MouseEvent| {
-                mouse.set(evt.data.screen_coordinates());
-                buttons.set(evt.data.held_buttons());
-                mouse_clicked.set(true);
-            },
-            onmouseup: move |evt: MouseEvent| {
-                buttons.set(evt.data.held_buttons());
-                mouse_clicked.set(false);
-            },
-
-            "count: {count:?}",
-            "key: {key}",
-            "mouse buttons: {buttons:?}",
-            "mouse pos: {mouse:?}",
-            "mouse button pressed: {mouse_clicked}"
-        }
-    })
-}