fix: only flow exprs with indent in mind

packages/autofmt/src/element.rs

@@ -2,6 +2,7 @@ use crate::Writer;
 use dioxus_rsx::*;
 use proc_macro2::Span;
 use std::{
+    borrow::Borrow,
     fmt::Result,
     fmt::{self, Write},
 };
@@ -67,7 +68,8 @@ impl Writer {
         // check if we have a lot of attributes
         let attr_len = self.is_short_attrs(attributes);
         let is_short_attr_list = attr_len < 80;
-        let is_small_children = self.is_short_children(children).is_some();
+        let children_len = self.is_short_children(children);
+        let is_small_children = children_len.is_some();
 
         // if we have few attributes and a lot of children, place the attrs on top
         if is_short_attr_list && !is_small_children {
@@ -85,7 +87,11 @@ impl Writer {
 
         // if we have few children and few attributes, make it a one-liner
         if is_short_attr_list && is_small_children {
-            opt_level = ShortOptimization::Oneliner;
+            if children_len.unwrap() + attr_len + self.out.indent * 4 < 100 {
+                opt_level = ShortOptimization::Oneliner;
+            } else {
+                opt_level = ShortOptimization::PropsOnTop;
+            }
         }
 
         // If there's nothing at all, empty optimization

packages/autofmt/tests/samples.rs

@@ -33,5 +33,6 @@ twoway![
     multirsx,
     commentshard,
     emoji,
-    messy_indent
+    messy_indent,
+    long_exprs
 ];

packages/autofmt/tests/samples/long_exprs.rsx

@@ -0,0 +1,17 @@
+rsx! {
+    div {
+        div {
+            div {
+                div {
+                    section { class: "body-font overflow-hidden dark:bg-ideblack",
+                        div { class: "container px-6 mx-auto",
+                            div { class: "-my-8 divide-y-2 divide-gray-100",
+                                POSTS.iter().enumerate().map(|(id, post)| rsx! { BlogPostItem { post: post, id: id } })
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

packages/autofmt/tests/samples/simple.rsx

@@ -37,7 +37,9 @@ rsx! {
 
     // One level compression
     div {
-        a { class: "py-2 px-3 bg-indigo-500 hover:bg-indigo-600 rounded text-xs text-white", href: "#", "Send invitation" }
+        a { class: "py-2 px-3 bg-indigo-500 hover:bg-indigo-600 rounded text-xs text-white", href: "#",
+            "Send invitation"
+        }
     }
 
     // Components