@vectoriox/iox-builder 1.0.8 → 1.0.9

package/fesm2022/vectoriox-iox-builder.mjs

@@ -929,13 +929,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
             type: Injectable
         }] });
 
+const STORAGE_KEY = 'iox_builder_viewport';
 class ViewportService {
     constructor() {
-        this.state = {
-            device: DeviceMode.Desktop,
-            width: DEVICE_OPTIONS[0].width,
-            scale: 0.75,
-        };
+        this.state = this.loadFromStorage();
         this.stateSubject = new BehaviorSubject(this.state);
         this.state$ = this.stateSubject.asObservable();
     }
@@ -949,16 +946,13 @@ class ViewportService {
         const option = DEVICE_OPTIONS.find(d => d.mode === device);
         if (!option)
             return;
-        this.state = { ...this.state, device, width: option.width };
-        this.stateSubject.next(this.state);
+        this.update({ device, width: option.width });
     }
     setScale(scale) {
-        this.state = { ...this.state, scale: Math.max(0.1, Math.min(2, scale)) };
-        this.stateSubject.next(this.state);
+        this.update({ scale: Math.max(0.1, Math.min(2, scale)) });
     }
     setWidth(width) {
-        this.state = { ...this.state, width };
-        this.stateSubject.next(this.state);
+        this.update({ width });
     }
     /**
      * Calculate the scale that makes the canvas fit inside the available editor width.
@@ -982,6 +976,42 @@ class ViewportService {
             y: (screenY - canvasRect.top) / this.state.scale,
         };
     }
+    update(partial) {
+        this.state = { ...this.state, ...partial };
+        this.stateSubject.next(this.state);
+        this.saveToStorage();
+    }
+    saveToStorage() {
+        try {
+            localStorage.setItem(STORAGE_KEY, JSON.stringify(this.state));
+        }
+        catch { }
+    }
+    loadFromStorage() {
+        const defaults = {
+            device: DeviceMode.Desktop,
+            width: DEVICE_OPTIONS[0].width,
+            scale: 0.75,
+        };
+        try {
+            const raw = localStorage.getItem(STORAGE_KEY);
+            if (!raw)
+                return defaults;
+            const saved = JSON.parse(raw);
+            const device = Object.values(DeviceMode).includes(saved.device)
+                ? saved.device
+                : defaults.device;
+            const option = DEVICE_OPTIONS.find(d => d.mode === device) ?? DEVICE_OPTIONS[0];
+            return {
+                device,
+                width: typeof saved.width === 'number' && saved.width > 0 ? saved.width : option.width,
+                scale: typeof saved.scale === 'number' ? Math.max(0.1, Math.min(2, saved.scale)) : defaults.scale,
+            };
+        }
+        catch {
+            return defaults;
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ViewportService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ViewportService }); }
 }