@innovastudio/contentbox 1.6.151 → 1.6.152

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@innovastudio/contentbox",
   "type": "module",
-  "version": "1.6.151",
+  "version": "1.6.152",
   "description": "",
   "main": "public/contentbox/contentbox.esm.js",
   "types": "index.d.ts",
@@ -59,7 +59,7 @@
     "ws": "^8.13.0"
   },
   "dependencies": {
-    "@innovastudio/contentbuilder": "^1.5.149",
+    "@innovastudio/contentbuilder": "^1.5.150",
     "js-beautify": "^1.14.0",
     "sortablejs": "^1.15.2"
   }

package/public/contentbox/contentbox.esm.js

@@ -31241,6 +31241,7 @@ class Util$1 {
   showRtePop(pop, onShow, btn) {
     const dom = this.dom;
     pop.style.display = 'flex';
+    pop.setAttribute('aria-hidden', 'false');
     if (onShow) onShow();
     dom.removeClass(pop, 'deactive');
     dom.addClass(pop, 'active');
@@ -31305,6 +31306,7 @@ class Util$1 {
     pop.style.display = '';
     dom.removeClass(pop, 'active');
     dom.addClass(pop, 'deactive');
+    pop.setAttribute('aria-hidden', 'true');
   }
   showPopOverlay(pop, cancelCallback, btn) {
     const builderStuff = this.builder.builderStuff;
@@ -31978,12 +31980,27 @@ class Util$1 {
       if (mode === 'cell' || mode === 'cell-right') {
         dom.moveAfter(cellElement, cell);
       }
+      let element;
+      if (cellElement.childNodes && cellElement.childNodes[0]) {
+        element = cellElement.childNodes[0];
+      }
       let builderActive = this.builder.doc.querySelector('.builder-active');
       if (builderActive) this.builder.applyBehaviorOn(builderActive);
       this.fixLayout(row);
-      cellElement.click(); //change active block to the newly created
-    }
 
+      // cellElement.click(); //change active block to the newly created
+      if (element && element.tagName.toLowerCase() === 'img') {
+        element.onload = () => {
+          element.click();
+          element.onload = null;
+          setTimeout(() => {
+            this.builder.element.image.repositionImageTool();
+          }, 100);
+        };
+      } else if (element) {
+        element.click();
+      }
+    }
     if (mode === 'row') {
       this.builder.uo.saveForUndo();
       let rowElement, cellElement;
@@ -32021,11 +32038,26 @@ class Util$1 {
       }
       row.parentNode.insertBefore(rowElement, row);
       dom.moveAfter(rowElement, row);
+      let element;
+      if (rowElement.childNodes && rowElement.childNodes[0].childNodes && rowElement.childNodes[0].childNodes) {
+        element = rowElement.childNodes[0].childNodes[0];
+      }
       let builderActive = this.builder.doc.querySelector('.builder-active');
       if (builderActive) this.builder.applyBehaviorOn(builderActive);
-      cellElement.click(); //change active block to the newly created
-    }
 
+      // cellElement.click(); //change active block to the newly created
+      if (element && element.tagName.toLowerCase() === 'img') {
+        element.onload = () => {
+          element.click();
+          element.onload = null;
+          setTimeout(() => {
+            this.builder.element.image.repositionImageTool();
+          }, 100);
+        };
+      } else if (element) {
+        element.click();
+      }
+    }
     if (mode === 'elm') {
       let elm = this.builder.activeElement; // See elementtool.js line 195-196. // document.querySelector('.elm-active');
       if (!elm) return;
@@ -32056,6 +32088,9 @@ class Util$1 {
         let checkLoad = setInterval(() => {
           if (newelement.complete) {
             newelement.click();
+            setTimeout(() => {
+              this.builder.element.image.repositionImageTool();
+            }, 100);
             clearInterval(checkLoad);
           }
         }, 30);
@@ -94225,6 +94260,7 @@ class Rte {
         const top = btn.getBoundingClientRect().top;
         const left = btn.getBoundingClientRect().left;
         pop.style.display = 'flex';
+        pop.setAttribute('aria-hidden', 'false');
         const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
         const h = pop.offsetHeight;
         if (!dom.hasClass(pop, 'active')) {
@@ -94259,6 +94295,7 @@ class Rte {
         const top = btn.getBoundingClientRect().top;
         const left = btn.getBoundingClientRect().left;
         pop.style.display = 'flex';
+        pop.setAttribute('aria-hidden', 'false');
         const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
         const h = pop.offsetHeight;
         if (!dom.hasClass(pop, 'active')) {
@@ -95095,6 +95132,7 @@ class Rte {
         const top = btn.getBoundingClientRect().top;
         const left = btn.getBoundingClientRect().left;
         pop.style.display = 'flex';
+        pop.setAttribute('aria-hidden', 'false');
         const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
         const h = pop.offsetHeight;
         if (!dom.hasClass(pop, 'active')) {
@@ -95421,6 +95459,7 @@ class Rte {
         const top = btn.getBoundingClientRect().top;
         const left = btn.getBoundingClientRect().left;
         pop.style.display = 'flex';
+        pop.setAttribute('aria-hidden', 'false');
         const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
         const h = pop.offsetHeight;
         if (!dom.hasClass(pop, 'active')) {
@@ -96938,6 +96977,7 @@ class Rte {
     const top = btnRteIcons.getBoundingClientRect().top;
     const left = btnRteIcons.getBoundingClientRect().left;
     pop.style.display = 'flex';
+    pop.setAttribute('aria-hidden', 'false');
     const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
     const h = pop.offsetHeight;
     if (!dom.hasClass(pop, 'active')) {
@@ -97025,6 +97065,7 @@ class Rte {
     });
     const pop = this.rteMoreOptions;
     pop.style.display = 'flex';
+    pop.setAttribute('aria-hidden', 'false');
     const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
     const h = pop.offsetHeight;
     if (this.builder.opts.toolbar === 'left') {
@@ -97101,6 +97142,7 @@ class Rte {
     const top = btnElementRteMore.getBoundingClientRect().top;
     const left = btnElementRteMore.getBoundingClientRect().left;
     pop.style.display = 'flex';
+    pop.setAttribute('aria-hidden', 'false');
     const w = pop.offsetWidth; //to get value, element must not hidden (display:none). So set display:flex before this.
     const h = pop.offsetHeight;
     if (this.builder.opts.toolbar === 'left') {
@@ -110890,6 +110932,7 @@ class Dictation {
       return;
     }
     this.modalCommand.classList.add('active');
+    this.modalCommand.setAttribute('aria-hidden', 'false');
     inpCommand.focus();
     localStorage.setItem('_dictation', '1');
     const chkAutoSend = this.builderStuff.querySelector('#chkAutoSendCommand');
@@ -119536,6 +119579,7 @@ class ContentBuilder {
       mediaSelect: '',
       // NEW: for image & video
 
+      filePickerSize: 'medium',
       // selectIcon: '<svg class="is-icon-flex"><use xlink:href="#ion-more"></use></svg>',
       selectIcon: '<svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-folder"></use></svg>',
       // NEW: for any other file select. Will be visible on hyperlink dialog, image dialog (image link), and Column Settings dialog (on Click tab)
@@ -120598,7 +120642,7 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
       this.settings.fileselect = this.settings.filePicker;
       this.settings.videoselect = this.settings.filePicker;
     }
-    if (this.assetPanelFullScreen) {
+    if (this.assetPanelFullScreen || this.filePickerSize === 'fullscreen') {
       this.imageSelectWidth = '100vw';
       this.imageSelectHeight = '100vh';
       this.fileSelectWidth = '100vw';
@@ -120618,6 +120662,26 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
       this.mediaSelectMaxWidth = '100vw';
       this.otherSelectMaxWidth = '100vw';
     }
+    if (this.filePickerSize === 'large') {
+      this.imageSelectWidth = '100%';
+      this.imageSelectHeight = '90vh';
+      this.fileSelectWidth = '100%';
+      this.fileSelectHeight = '90vh';
+      this.videoSelectWidth = '100%';
+      this.videoSelectHeight = '90vh';
+      this.audioSelectWidth = '100%';
+      this.audioSelectHeight = '90vh';
+      this.mediaSelectWidth = '100%';
+      this.mediaSelectHeight = '90vh';
+      this.otherSelectWidth = '100%';
+      this.otherSelectHeight = '90vh';
+      this.imageSelectMaxWidth = '92vw';
+      this.fileSelectMaxWidth = '92vw';
+      this.videoSelectMaxWidth = '92vw';
+      this.audioSelectMaxWidth = '92vw';
+      this.mediaSelectMaxWidth = '92vw';
+      this.otherSelectMaxWidth = '92vw';
+    }
 
     // if(this.opts.largerImageHandler!=='') {
     //     this.opts.mediaHandler = this.opts.largerImageHandler;