@innovastudio/contentbuilder 1.5.29 → 1.5.31

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@innovastudio/contentbuilder",
   "type": "module",
-  "version": "1.5.29",
+  "version": "1.5.31",
   "description": "",
   "main": "public/contentbuilder/contentbuilder.esm.js",
   "files": [

package/public/contentbuilder/contentbuilder.esm.js

@@ -17314,19 +17314,27 @@ const renderSnippetPanel = (builder, snippetOpen) => {
       if (activeBuilderArea) {
         dom.addClass(activeBuilderArea, 'builder-active');
       }
-
-      // destroy
-      if (builder.sortableOnCanvas) {
-        builder.sortableOnCanvas.forEach(obj => {
-          if (obj) {
-            obj.destroy();
-          }
-        });
-        builder.sortableOnCanvas = [];
-      }
-      if (builder.sortableOnPage) builder.sortableOnPage.destroy();
-      let dummies = builder.doc.querySelectorAll('.block-dummy');
-      dummies.forEach(elm => elm.parentNode.removeChild(elm));
+    },
+    onUnchoose: () => {
+      setTimeout(() => {
+        // Give time for onAdd to finish
+        // Destroy placed in onUnchoose in case a snippet is just clicked (no drag/drop) so that onAdd is not triggered.
+        // destroy
+        if (builder.sortableOnCanvas) {
+          builder.sortableOnCanvas.forEach(obj => {
+            if (obj) {
+              obj.destroy();
+            }
+          });
+          builder.sortableOnCanvas = [];
+        }
+        if (builder.sortableOnPage) {
+          builder.sortableOnPage.destroy();
+          builder.sortableOnPage = null;
+        }
+        let dummies = builder.doc.querySelectorAll('.block-dummy');
+        dummies.forEach(elm => elm.parentNode.removeChild(elm));
+      }, 10);
     }
   });
   if (builder.opts.snippetList === '#divSnippetList') {
@@ -83403,6 +83411,37 @@ class Draggable {
     }
   }
   updateBlockStyle(target) {
+    // Block placement should must not 50% outside the container
+    const container = target.closest('.box-canvas');
+    let containerHeight = container.offsetHeight;
+    let containerWidth = container.offsetWidth;
+    /*
+    if(target.offsetTop + target.offsetHeight>=containerHeight) {
+        target.style.top = containerHeight-target.offsetHeight +'px';
+    }
+    if(target.offsetTop<=0) {
+        target.style.top = '0px';
+    }
+    if(target.offsetLeft + target.offsetWidth>=åcontainerWidth) {
+        target.style.left = (containerWidth-target.offsetWidth) +'px';
+    }
+    if(target.offsetLeft<=0) {
+        target.style.left = '0px';
+    }
+    */
+    if (target.offsetTop + target.offsetHeight <= target.offsetHeight / 2) {
+      target.style.top = '0px';
+    }
+    if (containerHeight - target.offsetTop <= target.offsetHeight / 2) {
+      target.style.top = containerHeight - target.offsetHeight + 'px';
+    }
+    if (target.offsetLeft + target.offsetWidth <= target.offsetWidth / 2) {
+      target.style.left = '0px';
+    }
+    if (containerWidth - target.offsetLeft <= target.offsetWidth / 2) {
+      target.style.left = containerWidth - target.offsetWidth + 'px';
+    }
+
     // Replace with ruler's alignment
     if (this.ruler.rulerTop !== null) target.style.top = this.ruler.rulerTop + 'px';
     if (this.ruler.rulerBottom !== null) target.style.top = this.ruler.rulerBottom - target.offsetHeight + 'px'; //new
@@ -89159,7 +89198,10 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
               dummies.forEach(elm => elm.parentNode.removeChild(elm));
               this.sortableOnCanvas = [];
             }
-            if (this.sortableOnPage) this.sortableOnPage.destroy();
+            if (this.sortableOnPage) {
+              this.sortableOnPage.destroy();
+              this.sortableOnPage = null;
+            }
           }
         }
       });
@@ -92417,7 +92459,10 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
               dummies.forEach(elm => elm.parentNode.removeChild(elm));
               this.sortableOnCanvas = [];
             }
-            if (this.sortableOnPage) this.sortableOnPage.destroy();
+            if (this.sortableOnPage) {
+              this.sortableOnPage.destroy();
+              this.sortableOnPage = null;
+            }
           }
         });
         this.sortableOnCanvas.push(obj);
@@ -92493,7 +92538,10 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
               dummies.forEach(elm => elm.parentNode.removeChild(elm));
               this.sortableOnCanvas = [];
             }
-            if (this.sortableOnPage) this.sortableOnPage.destroy();
+            if (this.sortableOnPage) {
+              this.sortableOnPage.destroy();
+              this.sortableOnPage = null;
+            }
             return;
           }
           if (itemEl.getAttribute('data-id')) {
@@ -92647,7 +92695,10 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
             dummies.forEach(elm => elm.parentNode.removeChild(elm));
             this.sortableOnCanvas = [];
           }
-          if (this.sortableOnPage) this.sortableOnPage.destroy();
+          if (this.sortableOnPage) {
+            this.sortableOnPage.destroy();
+            this.sortableOnPage = null;
+          }
         }
       });
     }