@innovastudio/contentbuilder 1.5.159 → 1.5.160

package/package.json

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

package/public/contentbuilder/contentbuilder.esm.js

@@ -51513,20 +51513,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 = '';
@@ -80816,6 +80818,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 +81226,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 +81253,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 +81267,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 +81280,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 +81295,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 +81307,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 +81317,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;