@innovastudio/contentbuilder 1.4.14 → 1.4.15

package/package.json

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

package/public/contentbuilder/contentbuilder.esm.js

@@ -61716,15 +61716,49 @@ class ElementGeneralStyles {
       }
     }
 
-    this.realtimeVisibility(elm);
+    this.realtimeVisibility(elm, true);
   }
 
-  realtimeVisibility(row) {
+  realtimeVisibility(row, initialOpen) {
+    if (initialOpen) {
+      const builderStuff = this.builder.builderStuff;
+      const modal = builderStuff.querySelector('.is-modal.content-preview.active');
+
+      if (modal) {
+        let elms = this.panelStuff.querySelectorAll('.input-device');
+        elms.forEach(elm => {
+          elm.classList.remove('on');
+        });
+
+        if (modal.classList.contains('is-screen-1920')) {
+          this.panelStuff.querySelector('.input-device[data-value=""]').classList.add('on');
+        } else if (modal.classList.contains('is-screen-1440')) {
+          this.panelStuff.querySelector('.input-device[data-value=""]').classList.add('on');
+        } else if (modal.classList.contains('is-screen-1024')) {
+          this.panelStuff.querySelector('.input-device[data-value="md"]').classList.add('on');
+        } else if (modal.classList.contains('is-screen-768')) {
+          this.panelStuff.querySelector('.input-device[data-value="sm"]').classList.add('on');
+        } else if (modal.classList.contains('is-screen-375')) {
+          this.panelStuff.querySelector('.input-device[data-value="xs"]').classList.add('on');
+        }
+      }
+    }
+
     let divTarget = this.panelStuff.querySelector('.div-target');
     let divVisibility = this.panelStuff.querySelector('.div-visibility');
     let target = this.builder.responsive.readTarget(divTarget);
     let valVisibility = this.builder.responsive.getVisibility(row, target);
-    this.builder.responsive.showVisibility(divVisibility, valVisibility);
+    this.builder.responsive.showVisibility(divVisibility, valVisibility); // Live Preview Sync
+
+    if (target === 'xs') {
+      if (!initialOpen) this.builder.livePreview.resizePreview(375);
+    } else if (target === 'sm') {
+      if (!initialOpen) this.builder.livePreview.resizePreview(768);
+    } else if (target === 'md') {
+      if (!initialOpen) this.builder.livePreview.resizePreview(1024);
+    } else {
+      if (!initialOpen) this.builder.livePreview.resizePreview(1920);
+    }
   }
 
 }