@innovastudio/contentbuilder 1.4.96 → 1.4.98

package/package.json

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

package/public/contentbuilder/contentbuilder.esm.js

@@ -14404,9 +14404,9 @@ class HtmlUtil {
             </div>
 
             <div class="is-modal viewhtmlmonaco" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                <div class="is-modal-content" style="max-width: 55vw;padding:0">
+                <div class="is-modal-content" style="width:${this.builder.blockCodeEditorWidth};max-width:${this.builder.blockCodeEditorMaxWidth};padding:0">
                     <textarea style="position:absolute;display:none;"></textarea>
-                    <div class="input-code-editor" style="width:100%;height:65vh;"></div>
+                    <div class="input-code-editor" style="width:100%;height:${this.builder.blockCodeEditorHeight};"></div>
                     <div class="is-modal-footer" style="display:flex;justify-content:flex-end;border-top:1px solid ${this.builder.styleSeparatorColor};">
                         <button title="${util.out('Cancel')}" class="input-cancel classic-secondary">${util.out('Cancel')}</button>
                         <button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>
@@ -14415,8 +14415,8 @@ class HtmlUtil {
             </div>
 
             <div class="is-modal viewhtmlexternal" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                <div class="is-modal-content" style="max-width: 55vw;padding:0">
-                    <div class="input-code-editor" style="width:100%;height:65vh;"></div>
+                <div class="is-modal-content" style="width:${this.builder.codeEditorWidth};max-width:${this.builder.codeEditorMaxWidth};padding:0">
+                    <div class="input-code-editor" style="width:100%;height:${this.builder.codeEditorHeight};"></div>
                     <div class="is-modal-footer" style="display:flex;justify-content:flex-end;border-top:1px solid ${this.builder.styleSeparatorColor};">
                         <button title="${util.out('Cancel')}" class="input-cancel classic-secondary">${util.out('Cancel')}</button>
                         <button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>
@@ -14783,6 +14783,16 @@ class HtmlUtil {
     this.builder.codeEditorArea = area;
     let codeEditor = viewhtml.querySelector('.input-code-editor');
     codeEditor.style.opacity = '';
+    let modelContent = viewhtml.querySelector('.is-modal-content');
+    if (mode === 'full') {
+      modelContent.style.width = this.builder.codeEditorWidth;
+      modelContent.style.maxWidth = this.builder.codeEditorMaxWidth;
+      codeEditor.style.height = this.builder.codeEditorHeight;
+    } else {
+      modelContent.style.width = this.builder.blockCodeEditorWidth;
+      modelContent.style.maxWidth = this.builder.blockCodeEditorMaxWidth;
+      codeEditor.style.height = this.builder.blockCodeEditorHeight;
+    }
   }
   fromViewToActual(html) {
     for (var key in hash$1) {
@@ -49652,13 +49662,13 @@ class Image$1 {
                 </div>
 
                 <div class="is-modal imageselect" style="z-index:10005" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                    <div style="max-width:${this.builder.imageSelectWidth};height:${this.builder.imageSelectHeight};padding:0;">
+                    <div style="width:${this.builder.imageSelectWidth};max-width:${this.builder.imageSelectMaxWidth};height:${this.builder.imageSelectHeight};padding:0;">
                         <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
                     </div>
                 </div>
 
                 <div class="is-modal mediaselect" style="z-index:10005" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                    <div style="max-width:${this.builder.mediaSelectWidth};height:${this.builder.mediaSelectHeight};padding:0;">
+                    <div style="width:${this.builder.mediaSelectWidth};max-width:${this.builder.mediaSelectMaxWidth};height:${this.builder.mediaSelectHeight};padding:0;">
                         <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
                     </div>
                 </div>
@@ -52733,12 +52743,12 @@ class Hyperlink {
             </div>
             
             <div class="is-modal fileselect" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                <div class="is-modal-content" style="max-width:${this.builder.fileSelectWidth};height:${this.builder.fileSelectHeight};padding:0;">
+                <div class="is-modal-content" style="width:${this.builder.fileSelectWidth};max-width:${this.builder.fileSelectMaxWidth};height:${this.builder.fileSelectHeight};padding:0;">
                     <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
                 </div>
             </div>
             <div class="is-modal otherselect" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                <div class="is-modal-content" style="max-width:${this.builder.otherSelectWidth};height:${this.builder.otherSelectHeight};padding:0;">
+                <div class="is-modal-content" style="width:${this.builder.otherSelectWidth};max-width:${this.builder.otherSelectMaxWidth};height:${this.builder.otherSelectHeight};padding:0;">
                     <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
                 </div>
             </div>
@@ -54851,7 +54861,7 @@ class Video {
             </div>
 
             <div class="is-modal videoselect" style="z-index:10005" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                <div style="max-width:${this.builder.videoSelectWidth};height:${this.builder.videoSelectHeight};padding:0;">
+                <div style="width:${this.builder.videoSelectWidth};max-width:${this.builder.videoSelectMaxWidth};height:${this.builder.videoSelectHeight};padding:0;">
                     <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
                 </div>
             </div>
@@ -55062,7 +55072,7 @@ class Audio {
             </div>
 
             <div class="is-modal audioselect" style="z-index:10005" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
-                <div style="max-width:${this.builder.audioSelectWidth};height:${this.builder.audioSelectHeight};padding:0;">
+                <div style="width:${this.builder.audioSelectWidth};max-width:${this.builder.audioSelectMaxWidth};height:${this.builder.audioSelectHeight};padding:0;">
                     <iframe tabindex="0" style="width:100%;height:100%;border: none;display: block;" src="about:blank"></iframe>
                 </div>
             </div>
@@ -77581,7 +77591,7 @@ class Dictation {
         <style>
             #_cbhtml .is-modal.page-command {
                 width: 25vw;
-                min-width: 393px;
+                min-width: 500px;
                 max-width: 600px;
                 height: 230px; 
                 top: auto; 
@@ -78974,18 +78984,30 @@ class ContentBuilder {
       otherSelectCaption: 'Select Document',
       // otherSelectIcon: '<svg class="is-icon-flex"><use xlink:href="#ion-ios-folder-outline"></use></svg>',
       otherSelectIcon: '<svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-list-search"></use></svg>',
-      imageSelectWidth: '1024px',
+      imageSelectWidth: '80vw',
       imageSelectHeight: '80vh',
-      fileSelectWidth: '1024px',
+      fileSelectWidth: '80vw',
       fileSelectHeight: '80vh',
-      videoSelectWidth: '1024px',
+      videoSelectWidth: '80vw',
       videoSelectHeight: '80vh',
-      audioSelectWidth: '1024px',
+      audioSelectWidth: '80vw',
       audioSelectHeight: '80vh',
-      mediaSelectWidth: '1024px',
+      mediaSelectWidth: '80vw',
       mediaSelectHeight: '80vh',
-      otherSelectWidth: '1024px',
+      otherSelectWidth: '80vw',
       otherSelectHeight: '80vh',
+      imageSelectMaxWidth: '1600px',
+      fileSelectMaxWidth: '1600px',
+      videoSelectMaxWidth: '1600px',
+      audioSelectMaxWidth: '1600px',
+      mediaSelectMaxWidth: '1600px',
+      otherSelectMaxWidth: '1600px',
+      codeEditorWidth: '80vw',
+      codeEditorHeight: '80vh',
+      codeEditorMaxWidth: '1600px',
+      blockCodeEditorWidth: '80vw',
+      blockCodeEditorHeight: '45vh',
+      blockCodeEditorMaxWidth: '960px',
       assetRefresh: false,
       // asset manager specified in imageSelect, fileSelect & videoSelect will always refreshed on click/open
       customTags: [],