@contentful/experiences-visual-editor-react 3.2.1-dev-20250818T1739-df3d95e.0 → 3.2.1-dev-20250820T1011-7f01669.0

package/dist/index.js

@@ -131,7 +131,6 @@ const CF_STYLE_ATTRIBUTES = [
     'cfTextUnderline',
 ];
 const EMPTY_CONTAINER_SIZE$1 = '80px';
-const DEFAULT_IMAGE_WIDTH = '500px';
 var PostMessageMethods$3;
 (function (PostMessageMethods) {
     PostMessageMethods["REQUEST_ENTITIES"] = "REQUEST_ENTITIES";
@@ -353,9 +352,9 @@ const optionalBuiltInStyles = {
         type: 'Object',
         group: 'style',
         defaultValue: {
-            width: DEFAULT_IMAGE_WIDTH,
+            width: '100%',
             height: '100%',
-            targetSize: DEFAULT_IMAGE_WIDTH,
+            targetSize: 'unset',
         },
     },
     cfBackgroundColor: {
@@ -4895,7 +4894,7 @@ const sendCanvasGeometryUpdatedMessage = async (tree, sourceEvent) => {
     const rootRect = document.documentElement.getBoundingClientRect();
     const bodyRect = document.body.getBoundingClientRect();
     const width = Math.max(document.documentElement.offsetWidth, rootRect.width, bodyRect.width);
-    const height = Math.max(document.documentElement.offsetHeight, rootRect.height, bodyRect.height);
+    const height = Math.max(document.documentElement.offsetHeight, rootRect.height, bodyRect.height, measureBodyContentHeight());
     sendMessage(OUTGOING_EVENTS.CanvasGeometryUpdated, {
         size: {
             width,
@@ -4943,6 +4942,31 @@ function waitForImageToBeLoaded(imageNode) {
         imageNode.addEventListener('error', handleImageLoad);
     });
 }
+// calculates the content height by finding the deepest node in the first 2 levels of the body
+function measureBodyContentHeight(depth = 2, node = document.body) {
+    if (depth <= 0)
+        return 0;
+    let height = 0;
+    for (const element of node.children) {
+        const rect = element.getBoundingClientRect();
+        const style = window.getComputedStyle(element);
+        const isHidden = (rect.width === 0 && rect.height === 0) ||
+            style.display === 'none' ||
+            style.visibility === 'hidden';
+        // ignore relative positioned elements that are anchored to the bottom,
+        // as this can cause infinite height
+        const isBottomAnchored = (style.position === 'fixed' ||
+            style.position === 'absolute' ||
+            style.position === 'relative' ||
+            style.position === 'sticky') &&
+            parseFloat(style.bottom) < 0;
+        if (isHidden || isBottomAnchored) {
+            continue;
+        }
+        height = Math.max(height, Math.ceil(rect.bottom), measureBodyContentHeight(depth - 1, element));
+    }
+    return height;
+}
 
 const useCanvasGeometryUpdates = ({ tree, canvasMode }) => {
     const debouncedUpdateGeometry = useMemo(() => debounce((tree, sourceEvent) => {