@innovastudio/contentbuilder 1.4.139 → 1.4.141

package/package.json

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

package/public/contentbuilder/contentbuilder.css

@@ -207,6 +207,12 @@ button:focus-visible {
   display: none !important;
 }
 
+#_cbhtml {
+  height: 0px;
+  float: left;
+  margin-top: -100px;
+}
+
 #_cbhtml,
 .is-ui {
   /*
@@ -219,7 +225,7 @@ button:focus-visible {
   font-family: sans-serif;
   font-size: 13px;
   letter-spacing: 1px;
-  font-weight: 300px;
+  font-weight: 300;
   /*  general use */
   /*
   .rte-align-options,
@@ -4994,6 +5000,7 @@ button:focus-visible {
   border-radius: 0px;
   color: #fefefe;
   z-index: 100005;
+  -webkit-font-smoothing: auto;
 }
 
 /*!

package/public/contentbuilder/contentbuilder.esm.js

@@ -18276,12 +18276,16 @@ const renderSnippetPanel = (builder, snippetOpen) => {
       }
 
       // destroy
-      if (builder.sortableOnCanvas) builder.sortableOnCanvas.forEach(obj => {
-        if (obj) {
-          obj.destroy();
-        }
-      });
-      if (builder.sortableOnPage) builder.sortableOnPage.destroy();
+      if (builder.sortableOnCanvas) {
+        builder.sortableOnCanvas.forEach(obj => {
+          if (obj) {
+            obj.destroy();
+          }
+        });
+        if (builder.sortableOnPage) builder.sortableOnPage.destroy();
+      }
+      let dummies = builder.doc.querySelectorAll('.block-dummy');
+      dummies.forEach(elm => elm.parentNode.removeChild(elm));
     }
   });
   if (builder.opts.snippetList === '#divSnippetList') {
@@ -50186,7 +50190,7 @@ class Module {
       iframe.srcdoc = result;
       setTimeout(() => {
         iframe.style.opacity = '';
-      }, 300);
+      }, 1);
     }
   }
   click(col) {
@@ -70885,7 +70889,7 @@ class Resizeable {
     let scale = this.getScale(container);
     if (!scale) {
       const wrapper = container.closest('.is-wrapper');
-      scale = this.getScale(wrapper);
+      if (wrapper) scale = this.getScale(wrapper);else scale = 1;
     }
 
     // Minimum resize
@@ -77329,11 +77333,17 @@ class ContentBuilder {
 
             // Hide element tool
             this.elmTool.hide();
-            if (this.sortableOnCanvas) this.sortableOnCanvas.forEach(obj => {
-              if (obj) {
-                obj.destroy();
-              }
-            });
+
+            // destroy
+            if (this.sortableOnCanvas) {
+              this.sortableOnCanvas.forEach(obj => {
+                if (obj) {
+                  obj.destroy();
+                }
+              });
+              let dummies = this.doc.querySelectorAll('.block-dummy');
+              dummies.forEach(elm => elm.parentNode.removeChild(elm));
+            }
 
             // if(this.sortableOnPage) this.sortableOnPage.destroy();
           }
@@ -79977,13 +79987,14 @@ class ContentBuilder {
   }
 
   sectionDropSetup() {
-    if (this.page) {
-      if (this.page !== '.is-wrapper') return; // only for ContentBox
-      const wrapper = this.doc.querySelector(this.page);
+    if (this.blockContainer) {
       this.sortableOnCanvas = [];
-      const sections = wrapper.querySelectorAll('.is-box.box-canvas');
-      sections.forEach(section => {
-        const obj = new Sortable(section, {
+      const boxes = this.doc.querySelectorAll(this.blockContainer);
+      boxes.forEach(box => {
+        box.insertAdjacentHTML('afterbegin', `
+                <div class="is-block block-dummy" style="top: calc(97.2707% - 149.797px); left: calc(50% - 222px); width: 444px; height: 154px;z-index:-1000;visibility:hidden">
+                </div>`);
+        const obj = new Sortable(box, {
           scroll: true,
           group: 'shared',
           direction: 'horizontal',
@@ -79996,7 +80007,7 @@ class ContentBuilder {
 
               let snippetid = itemEl.getAttribute('data-id');
               let lastBlock;
-              let elements = Array.from(section.querySelectorAll('.is-block')).filter(elm => !elm.parentNode.classList.contains('is-block')); // exclude child blocks
+              let elements = Array.from(box.querySelectorAll('.is-block')).filter(elm => !elm.parentNode.classList.contains('is-block')); // exclude child blocks
               if (elements.length > 0) {
                 lastBlock = elements[elements.length - 1];
               }
@@ -80061,7 +80072,7 @@ class ContentBuilder {
                 itemEl.removeAttribute('draggable');
                 this.dom.removeClass(itemEl, 'snippet-item');
                 const blockTemplate = `
-                                <div class="is-block block-fixed" style="top: 20%; left: 20%; width: 800px;">
+                                <div class="is-block block-steady height-auto" style="top: 20%; left: 20%; width: 800px;">
                                     <div class="is-container container-new leading-12 size-17">
                                     [%CONTENT%]
                                     </div>
@@ -80099,7 +80110,7 @@ class ContentBuilder {
                 range.setStart(itemEl, 0);
                 itemEl.appendChild(range.createContextualFragment(html));
                 const blockTemplate = `
-                                <div class="is-block block-fixed" style="top: 20%; left: 20%; width: 800px;">
+                                <div class="is-block block-steady height-auto" style="top: 20%; left: 20%; width: 800px;">
                                     <div class="is-container container-new leading-12 size-17">
                                     [%CONTENT%]
                                     </div>
@@ -80108,14 +80119,14 @@ class ContentBuilder {
                 itemEl.outerHTML = blockTemplate.replace('[%CONTENT%]', itemEl.innerHTML);
               }
               this.activeCol = null;
-              const builders = section.querySelectorAll('.is-container.container-new');
+              const builders = box.querySelectorAll('.is-container.container-new');
               builders.forEach(builder => {
                 const block = builder.parentNode;
                 if (lastBlock) {
                   lastBlock.insertAdjacentElement('afterend', block);
                 } else {
-                  const ovarlay = section.querySelector('.is-overlay');
-                  ovarlay.insertAdjacentElement('afterend', block);
+                  const ovarlay = box.querySelector('.is-overlay');
+                  if (ovarlay) ovarlay.insertAdjacentElement('afterend', block);else box.insertAdjacentElement('afterbegin', block);
                 }
 
                 // After snippet has been added, re-apply behavior on builder areas
@@ -80128,16 +80139,24 @@ class ContentBuilder {
             }
 
             // destroy
-            if (this.sortableOnCanvas) this.sortableOnCanvas.forEach(obj => {
-              if (obj) {
-                obj.destroy();
-              }
-            });
+            if (this.sortableOnCanvas) {
+              this.sortableOnCanvas.forEach(obj => {
+                if (obj) {
+                  obj.destroy();
+                }
+              });
+              let dummies = this.doc.querySelectorAll('.block-dummy');
+              dummies.forEach(elm => elm.parentNode.removeChild(elm));
+            }
             if (this.sortableOnPage) this.sortableOnPage.destroy();
           }
         });
         this.sortableOnCanvas.push(obj);
       });
+    }
+    if (this.page) {
+      if (this.page !== '.is-wrapper') return; // only for ContentBox
+      const wrapper = this.doc.querySelector(this.page);
       this.sortableOnPage = new Sortable(wrapper, {
         scroll: true,
         group: 'shared',
@@ -80337,11 +80356,15 @@ class ContentBuilder {
           // this.sortableOnPage.option('draggable', '.dummy');
 
           // destroy
-          if (this.sortableOnCanvas) this.sortableOnCanvas.forEach(obj => {
-            if (obj) {
-              obj.destroy();
-            }
-          });
+          if (this.sortableOnCanvas) {
+            this.sortableOnCanvas.forEach(obj => {
+              if (obj) {
+                obj.destroy();
+              }
+            });
+            let dummies = this.doc.querySelectorAll('.block-dummy');
+            dummies.forEach(elm => elm.parentNode.removeChild(elm));
+          }
           if (this.sortableOnPage) this.sortableOnPage.destroy();
         }
       });