cut out a number of changes from the hr PR (#2580)

examples/file_explorer.rs

@@ -28,7 +28,7 @@ fn app() -> Element {
             link { href:"https://fonts.googleapis.com/icon?family=Material+Icons", rel:"stylesheet" }
             header {
                 i { class: "material-icons icon-menu", "menu" }
-                h1 { "Files: ", {files.read().current()} }
+                h1 { "Files: " {files.read().current()} }
                 span { }
                 i { class: "material-icons", onclick: move |_| files.write().go_up(), "logout" }
             }

examples/file_upload.rs

@@ -54,7 +54,7 @@ fn app() -> Element {
                 id: "directory-upload",
                 checked: enable_directory_upload,
                 oninput: move |evt| enable_directory_upload.set(evt.checked()),
-            },
+            }
         }
 
         div {

examples/global.rs

@@ -41,8 +41,8 @@ fn Decrement() -> Element {
 #[component]
 fn Display() -> Element {
     rsx! {
-        p { "Count: ", "{COUNT}" }
-        p { "Doubled: ", "{DOUBLED_COUNT}" }
+        p { "Count: {COUNT}" }
+        p { "Doubled: {DOUBLED_COUNT}" }
     }
 }
 

examples/reducer.rs

@@ -20,7 +20,7 @@ fn app() -> Element {
 
         // Add some cute animations if the radio is playing!
         div { class: if state.read().is_playing { "bounce" },
-            "The radio is... ", {state.read().is_playing()}, "!"
+            "The radio is... " {state.read().is_playing()} "!"
         }
 
         button { id: "play", onclick: move |_| state.write().reduce(PlayerAction::Pause), "Pause" }

examples/rsx_usage.rs

@@ -79,7 +79,7 @@ fn app() -> Element {
             }
             div {
                 // pass simple rust expressions in
-                class: lazy_fmt,
+                class: "{lazy_fmt}",
                 id: format_args!("attributes can be passed lazily with std::fmt::Arguments"),
                 class: "asd",
                 class: "{asd}",
@@ -97,7 +97,7 @@ fn app() -> Element {
             {rsx!(p { "More templating!" })},
 
             // Iterators
-            {(0..10).map(|i| rsx!(li { "{i}" }))},
+            {(0..10).map(|i| rsx!(li { "{i}" }))}
 
             // Iterators within expressions
             {
@@ -117,7 +117,7 @@ fn app() -> Element {
             // Conditional rendering
             // Dioxus conditional rendering is based around None/Some. We have no special syntax for conditionals.
             // You can convert a bool condition to rsx! with .then and .or
-            {true.then(|| rsx!(div {}))},
+            {true.then(|| rsx!(div {}))}
 
             // Alternatively, you can use the "if" syntax - but both branches must be resolve to Element
             if false {
@@ -135,7 +135,7 @@ fn app() -> Element {
             }}
 
             // returning "None" without a diverging branch is a bit noisy... but rare in practice
-            {None as Option<()>},
+            {None as Option<()>}
 
             // can also just use empty fragments
             Fragment {}
@@ -176,8 +176,8 @@ fn app() -> Element {
 
             // Spreading can also be overridden manually
             Taller {
-                ..TallerProps { a: "ballin!", children: VNode::empty() },
-                a: "not ballin!"
+                a: "not ballin!",
+                ..TallerProps { a: "ballin!", children: VNode::empty() }
             }
 
             // Can take children too!

examples/simple_list.rs

@@ -12,17 +12,17 @@ fn app() -> Element {
     rsx!(
         div {
             // Use Map directly to lazily pull elements
-            {(0..10).map(|f| rsx! { "{f}" })},
+            {(0..10).map(|f| rsx! { "{f}" })}
 
             // Collect into an intermediate collection if necessary, and call into_iter
             {["a", "b", "c", "d", "e", "f"]
                 .into_iter()
                 .map(|f| rsx! { "{f}" })
                 .collect::<Vec<_>>()
-                .into_iter()},
+                .into_iter()}
 
             // Use optionals
-            {Some(rsx! { "Some" })},
+            {Some(rsx! { "Some" })}
 
             // use a for loop where the body itself is RSX
             for name in 0..10 {

examples/todomvc.rs

@@ -225,7 +225,7 @@ fn ListFooter(
                         match active_todo_count() {
                             1 => "item",
                             _ => "items",
-                        },
+                        }
                         " left"
                     }
                 }

packages/autofmt/tests/samples.rs

@@ -4,8 +4,8 @@ macro_rules! twoway {
 
             // doc attrs
             $( #[doc = $doc:expr] )*
-            $name:ident,
-        )*
+            $name:ident
+        ),*
     ) => {
         $(
             $( #[doc = $doc] )*
@@ -51,4 +51,6 @@ twoway![
     letsome,
     fat_exprs,
     nested,
+    staged,
+    misplaced
 ];

packages/autofmt/tests/samples/commentshard.rsx

@@ -38,5 +38,9 @@ rsx! {
             // todo some work in here
             class: "hello world"
         }
+
+        div {
+            div {}
+        }
     }
 }

packages/autofmt/tests/samples/docsite.rsx

@@ -12,7 +12,11 @@ pub(crate) fn Nav() -> Element {
                         let mut sidebar = SHOW_SIDEBAR.write();
                         *sidebar = !*sidebar;
                     },
-                    MaterialIcon { name: "menu", size: 24, color: MaterialIconColor::Dark }
+                    MaterialIcon {
+                        name: "menu",
+                        size: 24,
+                        color: MaterialIconColor::Dark
+                    }
                 }
                 div { class: "flex z-50 md:flex-1 px-2", LinkList {} }
 

packages/autofmt/tests/samples/misplaced.rsx

@@ -0,0 +1,35 @@
+pub(crate) fn Nav() -> Element {
+    rsx! {
+        SearchModal {}
+        header {
+            class: "sticky top-0 z-30 bg-white dark:text-gray-200 dark:bg-ideblack border-b dark:border-stone-700 h-16 bg-opacity-80 backdrop-blur-sm",
+            class: if HIGHLIGHT_NAV_LAYOUT() { "border border-orange-600 rounded-md" },
+            div { class: "lg:py-2 px-2 max-w-screen-2xl mx-auto flex items-center justify-between text-sm leading-6 h-16",
+                button {
+                    class: "bg-gray-100 rounded-lg p-2 mr-4 lg:hidden my-3 h-10 flex items-center text-lg z-[100]",
+                    class: if !SHOW_DOCS_NAV() { "hidden" },
+                    onclick: move |_| {
+                        let mut sidebar = SHOW_SIDEBAR.write();
+                        *sidebar = !*sidebar;
+                    },
+                    MaterialIcon {
+                        name: "menu",
+                        size: 24,
+                        color: MaterialIconColor::Dark
+                    }
+                }
+                div { class: "flex z-50 md:flex-1 px-2", LinkList {} }
+            }
+        }
+    }
+}
+
+#[component]
+fn SidebarSection(chapter: &'static SummaryItem<BookRoute>) -> Element {
+    let link = chapter.maybe_link()?;
+    let sections = link.nested_items.iter().map(|chapter| {
+        rsx! {
+            SidebarChapter { chapter }
+        }
+    });
+}

packages/autofmt/tests/samples/staged.rsx

@@ -0,0 +1,26 @@
+rsx! {
+    div {}
+
+    div { "hi" }
+
+    div { class: "helo", "hi" }
+
+    div { class: "helo", glass: "123", "hi" }
+
+    div { {some_expr} }
+    div {
+        {
+            POSTS.iter().enumerate().map(|(id, post)| rsx! {
+                BlogPostItem { post, id }
+            })
+        }
+    }
+
+    div { class: "123123123123123123123123123123123123",
+        {some_really_long_expr_some_really_long_expr_some_really_long_expr_some_really_long_expr_}
+    }
+
+    div { class: "-my-8 divide-y-2 divide-gray-100",
+        {POSTS.iter().enumerate().map(|(id, post)| rsx! { BlogPostItem { post: post, id: id } })}
+    }
+}