Hotreloading of for/if/body, formatted strings, literals, component props, nested rsx, light CLI rewrite, cli TUI (#2258)

Hotreload the contents of for loops, if chains, component bodies, props, attributes, and any literals discovered in rsx!
Add a TUI renderer to the CLI.
Improve the CLI build system to be async and parallel.
Refactor RSX to allow partial expansion of expressions.
Merge autofmt implementations for consistency.
Merge the representation of elements and components under the hood.
Add a diagnostics system for rsx for improved error messages.
Drop interprocess and move to websockets for communication between the CLI and the server.
Assign IDs to nodes and attributes in a stable way to be used in non compiler contexts.
Add hotreloading to any body of component/for loop/if chain/etc.

---------

Co-authored-by: Evan Almloff <evanalmloff@gmail.com>
Co-authored-by: Liam Mitchell <liamkarlmitchell@gmail.com>

packages/core/tests/diff_component.rs

@@ -39,7 +39,12 @@ fn component_swap() {
 
     fn nav_bar() -> Element {
         rsx! {
-            h1 { "NavBar", {(0..3).map(|_| rsx!(nav_link {}))} }
+            h1 {
+                "NavBar"
+                for _ in 0..3 {
+                    nav_link {}
+                }
+            }
         }
     }
 

packages/core/tests/hotreload.rs

@@ -0,0 +1,38 @@
+use dioxus::prelude::*;
+use dioxus_core::ElementId;
+use dioxus_core::Mutation::{AppendChildren, LoadTemplate};
+
+/// Swap out the template and get it back via the mutation
+#[test]
+fn hotreloads_template() {
+    let old_rsx = rsx! { "A" };
+    let name = old_rsx.as_ref().unwrap().template.get().name;
+
+    let mut dom = VirtualDom::new_with_props(move |_| old_rsx.clone(), ());
+
+    let new_template = Template {
+        name,
+        roots: &[TemplateNode::Text { text: "B" }],
+        node_paths: &[],
+        attr_paths: &[],
+    };
+
+    dom.replace_template(new_template);
+
+    let muts = dom.rebuild_to_vec();
+
+    // New template comes out
+    assert_eq!(muts.templates.len(), 1);
+
+    assert_eq!(
+        muts.edits,
+        [
+            LoadTemplate {
+                name: "packages/core/tests/hotreload.rs:8:19:0",
+                index: 0,
+                id: ElementId(1,),
+            },
+            AppendChildren { id: ElementId(0,), m: 1 },
+        ]
+    )
+}

packages/core/tests/kitchen_sink.rs

@@ -6,11 +6,13 @@ fn basic_syntax_is_a_template() -> Element {
     let var = 123;
 
     rsx! {
-        div { key: "{asd}", class: "asd", class: "{asd}", class: if true {
-                "{asd}"
-            }, class: if false {
-                "{asd}"
-            }, onclick: move |_| {},
+        div {
+            key: "{asd}",
+            class: "asd",
+            class: "{asd}",
+            class: if true { "{asd}" },
+            class: if false { "{asd}" },
+            onclick: move |_| {},
             div { "{var}" }
             div {
                 h1 { "var" }
@@ -40,7 +42,7 @@ fn dual_stream() {
             HydrateText { path: &[0, 0], value: "123".to_string(), id: ElementId(2) },
             SetAttribute {
                 name: "class",
-                value: "asd 123 123".into_value(),
+                value: "asd 123 123 ".into_value(),
                 id: ElementId(1),
                 ns: None,
             },