@innovastudio/contentbuilder 1.5.159 → 1.5.161

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@innovastudio/contentbuilder",
   "type": "module",
-  "version": "1.5.159",
+  "version": "1.5.161",
   "description": "",
   "main": "public/contentbuilder/contentbuilder.esm.js",
   "types": "index.d.ts",

package/public/contentbuilder/contentbuilder.esm.js

@@ -6159,15 +6159,16 @@ class Util {
         rtepop.style.display = '';
         dom.removeClass(rtepop, 'active');
         dom.removeClass(rtepop, 'deactive');
-        // dom.addClass(rtepop, 'deactive');
       });
     }
-
     let pops = builderStuff.querySelectorAll('.is-pop');
     Array.prototype.forEach.call(pops, pop => {
       pop.style.display = '';
       dom.removeClass(pop, 'active');
-      pop.setAttribute('aria-hidden', true);
+      this.builder.doc.body.focus();
+      setTimeout(() => {
+        pop.setAttribute('aria-hidden', true);
+      }, 0);
     });
     this.builder.colTool.lockIndicator.style.display = '';
     if (this.builder.resize) {
@@ -15040,7 +15041,6 @@ class HtmlUtil {
 
         // Remove runtime-added attributes
         element.removeAttribute('data-cb-original-content');
-        element.removeAttribute('data-cb-loaded');
 
         // element.removeAttribute('data-cb-logo-loop-initialized');
 
@@ -15051,12 +15051,12 @@ class HtmlUtil {
             element.removeAttribute(name);
           }
         });
-        element.removeAttribute('data-cb-editmode');
 
         // Remove runtime-added classes
         const type = element.getAttribute('data-cb-type');
         element.classList.remove(`cb-${type}`);
       }
+      element.removeAttribute('data-cb-loaded');
     });
     html = '';
     if (multiple) {
@@ -16398,6 +16398,9 @@ class Grid {
       cell.click(); //refresh active cell/row
     }, 30);
     this.builder.opts.onChange();
+
+    // Re-init plugins
+    if (this.builder.win.builderRuntime) this.builder.win.builderRuntime.reinitialize(cellElement);
   }
   removeColumn() {
     let util = this.util;
@@ -17171,6 +17174,9 @@ class Grid {
     builder.applyBehaviorOn(builderActive);
     this.rowTool.position(rowElement);
     this.builder.opts.onChange();
+
+    // Re-init plugins
+    if (this.builder.win.builderRuntime) this.builder.win.builderRuntime.reinitialize(rowElement);
   }
 }
 class RowTool$1 {
@@ -51513,20 +51519,22 @@ class Plugin {
     const plugin = e.target.closest('[data-cb-type]');
     if (plugin) {
       this.builder.activePlugin = plugin;
-      this.renderTool();
-      this.pluginTool.style.display = 'flex';
-      let _toolwidth = this.pluginTool.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
+      if (!this.builder.isContentBox) {
+        this.renderTool();
+        this.pluginTool.style.display = 'flex';
+        let _toolwidth = this.pluginTool.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
 
-      let w = plugin.offsetWidth * this.builder.opts.zoom;
-      let top = plugin.getBoundingClientRect().top + this.builder.win.pageYOffset;
-      let left = plugin.getBoundingClientRect().left - 2;
-      left = left + (w - _toolwidth);
+        let w = plugin.offsetWidth * this.builder.opts.zoom;
+        let top = plugin.getBoundingClientRect().top + this.builder.win.pageYOffset;
+        let left = plugin.getBoundingClientRect().left - 2;
+        left = left + (w - _toolwidth);
 
-      //Adjust left in case an element is outside the screen
-      const _screenwidth = window.innerWidth;
-      if (_toolwidth + left > _screenwidth) left = plugin.getBoundingClientRect().left;
-      this.pluginTool.style.top = top + 'px';
-      this.pluginTool.style.left = left + 'px';
+        //Adjust left in case an element is outside the screen
+        const _screenwidth = window.innerWidth;
+        if (_toolwidth + left > _screenwidth) left = plugin.getBoundingClientRect().left;
+        this.pluginTool.style.top = top + 'px';
+        this.pluginTool.style.left = left + 'px';
+      }
     } else {
       this.builder.activePlugin = null;
       if (this.pluginTool) this.pluginTool.style.display = '';
@@ -62878,6 +62886,9 @@ class ElementTool {
 
         //Trigger Change event
         this.builder.opts.onChange();
+
+        // Re-init plugins
+        if (this.builder.win.builderRuntime) this.builder.win.builderRuntime.reinitialize(newelm.parentNode);
       }, 100); //Timeout needed by Safari
     });
 
@@ -80816,6 +80827,9 @@ class ContentStuff {
         <div class="is-tool is-iframe-tool">
             <button title="${util.out('Settings')}" data-title="${util.out('Settings')}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>
         </div>
+        <div class="is-tool is-plugin-tool">
+            <button title="${util.out('Settings')}" data-title="${util.out('Settings')}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>
+        </div>
         <div class="is-tool is-module-tool">
         <button class="btn-module-refresh" title="${util.out('Refresh')}" data-title="${util.out('Refresh')}" style="width:40px;height:40px;"><svg class="is-icon-flex"><use xlink:href="#icon-reload"></use></svg></button>
                 <button class="btn-module-settings" title="${util.out('Settings')}" data-title="${util.out('Settings')}" style="width:40px;height:40px;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>
@@ -81221,20 +81235,24 @@ class ContentStuff {
         /*
         .is-tool.is-video-tool,
         .is-tool.is-audio-tool,
+        .is-tool.is-plugin-tool,
         .is-tool.is-iframe-tool {
             background: rgba(0, 0, 0, 0.15);
             border: transparent 1px solid;
         }
         .is-tool.is-video-tool > div,
         .is-tool.is-audio-tool > div,
+        .is-tool.is-plugin-tool > div,
         .is-tool.is-iframe-tool > div,
         .is-tool.is-video-tool > button,
         .is-tool.is-audio-tool > button,
+        .is-tool.is-plugin-tool > button,
         .is-tool.is-iframe-tool > button {
             background: transparent;
         }
         .is-tool.is-video-tool svg,
         .is-tool.is-audio-tool svg,
+        .is-tool.is-plugin-tool svg,
         .is-tool.is-iframe-tool svg {
             fill: #fff;
         }
@@ -81244,6 +81262,7 @@ class ContentStuff {
         .is-tool.is-table-tool,
         .is-tool.is-code-tool,
         .is-tool.is-module-tool,
+        .is-tool.is-plugin-tool,
         .is-tool#divLinkTool,
         .is-tool#divButtonTool,
         .is-tool.is-svg-tool { 
@@ -81257,6 +81276,7 @@ class ContentStuff {
         .is-tool.is-table-tool > button,
         .is-tool.is-code-tool > button,
         .is-tool.is-module-tool > button,
+        .is-tool.is-plugin-tool > button,
         .is-tool#divLinkTool > button,
         .is-tool#divButtonTool > button,
         .is-tool.is-svg-tool > button { 
@@ -81269,6 +81289,7 @@ class ContentStuff {
         .is-tool.is-table-tool > button svg,
         .is-tool.is-code-tool > button svg,
         .is-tool.is-module-tool > button svg,
+        .is-tool.is-plugin-tool > button svg,
         .is-tool#divLinkTool > button svg,
         .is-tool#divButtonTool > button svg,
         .is-tool.is-svg-tool > button svg {
@@ -81283,6 +81304,7 @@ class ContentStuff {
 
         .is-tool.is-video-tool, 
         .is-tool.is-audio-tool,
+        .is-tool.is-plugin-tool,
         .is-tool.is-iframe-tool {
             background: rgba(255, 255, 255, 0.97) !important;
             border: transparent 1px solid;
@@ -81294,6 +81316,7 @@ class ContentStuff {
         .is-tool.is-video-tool > button, 
         .is-tool.is-audio-tool > div, 
         .is-tool.is-audio-tool > button, 
+        .is-tool.is-plugin-tool > div, 
         .is-tool.is-iframe-tool > div, 
         .is-tool.is-iframe-tool > button {
             width: 35px !important;
@@ -81303,6 +81326,7 @@ class ContentStuff {
 
         .is-tool.is-video-tool svg, 
         .is-tool.is-audio-tool svg, 
+        .is-tool.is-plugin-tool svg, 
         .is-tool.is-iframe-tool svg {
             width: 17px;
             height: 17px;
@@ -97924,6 +97948,9 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
 
     // Zoom
     this.setZoomOnControl(builder);
+
+    // Re-init plugins
+    if (this.win.builderRuntime) this.win.builderRuntime.reinitialize(builder);
   }
   applySortableGrid() {
     if (this.iframe) {