From 816d06f5c85ae19223968880c39c4ed60a521ca7 Mon Sep 17 00:00:00 2001
From: istarkov <istarkov@gmail.com>
Date: Sun, 1 Dec 2024 15:30:31 +0000
Subject: [PATCH 1/2] fix: Collapsed in some cases calculated wrong

---
 apps/builder/app/canvas/collapsed.ts | 41 ++++++++++++++++++++++------
 1 file changed, 33 insertions(+), 8 deletions(-)

diff --git a/apps/builder/app/canvas/collapsed.ts b/apps/builder/app/canvas/collapsed.ts
index a1c452e422d2..6ba29827ac36 100644
--- a/apps/builder/app/canvas/collapsed.ts
+++ b/apps/builder/app/canvas/collapsed.ts
@@ -120,6 +120,28 @@ const getInstanceSize = (instanceId: string, tagName: HtmlTags | undefined) => {
 
 const MAX_SIZE_TO_USE_OPTIMIZATION = 50;
 
+const findFirstNonContentsParent = (element: Element) => {
+  // Start with the element's parent
+  let parent = element.parentElement;
+
+  // Continue traversing up until we find a non-contents parent or reach the top
+  while (parent) {
+    // Get the computed style of the parent
+    const computedStyle = window.getComputedStyle(parent);
+
+    // Check if the display is not 'contents'
+    if (computedStyle.display !== "contents") {
+      return parent;
+    }
+
+    // Move up to the next parent
+    parent = parent.parentElement;
+  }
+
+  // Return null if no non-contents parent is found
+  return null;
+};
+
 const recalculate = () => {
   const rootInstanceId = $selectedPage.get()?.rootInstanceId;
 
@@ -180,20 +202,23 @@ const recalculate = () => {
       elementsToRecalculate.push(element);
     }
 
-    const elementPosition = window.getComputedStyle(element).position;
+    const elementStyle = window.getComputedStyle(element);
+    // const elementPosition = window.getComputedStyle(element).position;
+
+    const parentElement = findFirstNonContentsParent(element);
 
-    if (element.parentElement) {
+    if (parentElement) {
       if (
-        elementPosition === "absolute" ||
-        elementPosition === "fixed" ||
-        element.offsetParent == null
+        elementStyle.position === "absolute" ||
+        elementStyle.position === "fixed" ||
+        element.offsetParent == null // collapsed or none
       ) {
         parentsWithAbsoluteChildren.set(
-          element.parentElement,
-          parentsWithAbsoluteChildren.get(element.parentElement) ?? 0
+          parentElement,
+          parentsWithAbsoluteChildren.get(parentElement) ?? 0
         );
       } else {
-        parentsWithAbsoluteChildren.set(element.parentElement, 1);
+        parentsWithAbsoluteChildren.set(parentElement, 1);
       }
     }
   }

From 23a40d765fc6a94e69c978cca7607e35b5723357 Mon Sep 17 00:00:00 2001
From: istarkov <istarkov@gmail.com>
Date: Sun, 1 Dec 2024 15:45:31 +0000
Subject: [PATCH 2/2] Fix block template

---
 .../app/canvas/features/build-mode/block-template.tsx  | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/apps/builder/app/canvas/features/build-mode/block-template.tsx b/apps/builder/app/canvas/features/build-mode/block-template.tsx
index 24c4d496d6af..ea14245aafc6 100644
--- a/apps/builder/app/canvas/features/build-mode/block-template.tsx
+++ b/apps/builder/app/canvas/features/build-mode/block-template.tsx
@@ -34,5 +34,13 @@ export const BlockTemplate = React.forwardRef<
     return;
   }
 
-  return <div style={{ display: "contents" }} ref={ref} {...props} />;
+  const childrenCount = React.Children.count(props.children);
+
+  return (
+    <div
+      style={{ display: childrenCount === 0 ? "block" : "contents" }}
+      ref={ref}
+      {...props}
+    />
+  );
 }) as AnyComponent;