@tmagic/stage 1.5.21 → 1.5.22

package/dist/tmagic-stage.js

@@ -2211,6 +2211,10 @@ class StageMask extends Rule {
         const { clientHeight, clientWidth } = entry.target;
         this.wrapperHeight = clientHeight;
         this.wrapperWidth = clientWidth;
+        if (this.mode === Mode.FIXED) {
+          this.content.style.width = `${this.wrapperWidth}px`;
+          this.content.style.height = `${this.wrapperHeight}px`;
+        }
         this.setMaxScrollLeft();
         this.setMaxScrollTop();
       });
@@ -2250,7 +2254,9 @@ class StageMask extends Rule {
   setHeight(height) {
     this.height = height;
     this.setMaxScrollTop();
-    this.content.style.height = `${height}px`;
+    if (this.mode !== Mode.FIXED) {
+      this.content.style.height = `${height}px`;
+    }
   }
   /**
    * 设置蒙层宽度
@@ -2259,7 +2265,9 @@ class StageMask extends Rule {
   setWidth(width) {
     this.width = width;
     this.setMaxScrollLeft();
-    this.content.style.width = `${width}px`;
+    if (this.mode !== Mode.FIXED) {
+      this.content.style.width = `${width}px`;
+    }
   }
   /**
    * 计算并设置最大滚动宽度
@@ -2324,7 +2332,10 @@ class StageRender extends EventEmitter$1 {
     }
   }
   getMagicApi = () => ({
-    onPageElUpdate: (el) => this.emit("page-el-update", el),
+    id: guid(),
+    onPageElUpdate: (el) => {
+      this.emit("page-el-update", el);
+    },
     onRuntimeReady: (runtime) => {
       if (this.runtime) {
         return;

package/dist/tmagic-stage.umd.cjs

@@ -4684,6 +4684,10 @@
           const { clientHeight, clientWidth } = entry.target;
           this.wrapperHeight = clientHeight;
           this.wrapperWidth = clientWidth;
+          if (this.mode === Mode.FIXED) {
+            this.content.style.width = `${this.wrapperWidth}px`;
+            this.content.style.height = `${this.wrapperHeight}px`;
+          }
           this.setMaxScrollLeft();
           this.setMaxScrollTop();
         });
@@ -4723,7 +4727,9 @@
     setHeight(height) {
       this.height = height;
       this.setMaxScrollTop();
-      this.content.style.height = `${height}px`;
+      if (this.mode !== Mode.FIXED) {
+        this.content.style.height = `${height}px`;
+      }
     }
     /**
      * 设置蒙层宽度
@@ -4732,7 +4738,9 @@
     setWidth(width) {
       this.width = width;
       this.setMaxScrollLeft();
-      this.content.style.width = `${width}px`;
+      if (this.mode !== Mode.FIXED) {
+        this.content.style.width = `${width}px`;
+      }
     }
     /**
      * 计算并设置最大滚动宽度
@@ -4797,7 +4805,10 @@
       }
     }
     getMagicApi = () => ({
-      onPageElUpdate: (el) => this.emit("page-el-update", el),
+      id: core.guid(),
+      onPageElUpdate: (el) => {
+        this.emit("page-el-update", el);
+      },
       onRuntimeReady: (runtime) => {
         if (this.runtime) {
           return;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.21",
+  "version": "1.5.22",
   "name": "@tmagic/stage",
   "type": "module",
   "main": "dist/tmagic-stage.umd.cjs",
@@ -42,7 +42,7 @@
   },
   "peerDependencies": {
     "typescript": "*",
-    "@tmagic/core": "1.5.21"
+    "@tmagic/core": "1.5.22"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/src/StageMask.ts

@@ -236,6 +236,12 @@ export default class StageMask extends Rule {
         const { clientHeight, clientWidth } = entry.target;
         this.wrapperHeight = clientHeight;
         this.wrapperWidth = clientWidth;
+
+        if (this.mode === Mode.FIXED) {
+          this.content.style.width = `${this.wrapperWidth}px`;
+          this.content.style.height = `${this.wrapperHeight}px`;
+        }
+
         this.setMaxScrollLeft();
         this.setMaxScrollTop();
       });
@@ -286,7 +292,9 @@ export default class StageMask extends Rule {
   private setHeight(height: number): void {
     this.height = height;
     this.setMaxScrollTop();
-    this.content.style.height = `${height}px`;
+    if (this.mode !== Mode.FIXED) {
+      this.content.style.height = `${height}px`;
+    }
   }
 
   /**
@@ -296,7 +304,9 @@ export default class StageMask extends Rule {
   private setWidth(width: number): void {
     this.width = width;
     this.setMaxScrollLeft();
-    this.content.style.width = `${width}px`;
+    if (this.mode !== Mode.FIXED) {
+      this.content.style.width = `${width}px`;
+    }
   }
 
   /**

package/src/StageRender.ts

@@ -19,7 +19,7 @@
 import { EventEmitter } from 'events';
 
 import type { Id } from '@tmagic/core';
-import { getElById, getHost, injectStyle, isSameDomain } from '@tmagic/core';
+import { getElById, getHost, guid, injectStyle, isSameDomain } from '@tmagic/core';
 
 import { DEFAULT_ZOOM, RenderType } from './const';
 import style from './style.css?raw';
@@ -54,7 +54,10 @@ export default class StageRender extends EventEmitter {
   }
 
   public getMagicApi = () => ({
-    onPageElUpdate: (el: HTMLElement) => this.emit('page-el-update', el),
+    id: guid(),
+    onPageElUpdate: (el: HTMLElement) => {
+      this.emit('page-el-update', el);
+    },
     onRuntimeReady: (runtime: Runtime) => {
       if (this.runtime) {
         return;

package/src/types.ts

@@ -214,6 +214,7 @@ export interface Runtime {
 }
 
 export interface Magic {
+  id: string;
   /** 当前页面的根节点变化时调用该方法，编辑器会同步该el和stage的大小，该方法由stage注入到iframe.contentWindow中 */
   onPageElUpdate: (el: HTMLElement) => void;
 

package/types/index.d.ts

@@ -317,6 +317,7 @@ interface Runtime {
     [key: string]: any;
 }
 interface Magic {
+    id: string;
     /** 当前页面的根节点变化时调用该方法，编辑器会同步该el和stage的大小，该方法由stage注入到iframe.contentWindow中 */
     onPageElUpdate: (el: HTMLElement) => void;
     onRuntimeReady: (runtime: Runtime) => void;
@@ -680,7 +681,8 @@ declare class StageRender extends EventEmitter$1 {
     private customizedRender?;
     constructor({ runtimeUrl, zoom, customizedRender, renderType }: StageRenderConfig);
     getMagicApi: () => {
-        onPageElUpdate: (el: HTMLElement) => boolean;
+        id: string;
+        onPageElUpdate: (el: HTMLElement) => void;
         onRuntimeReady: (runtime: Runtime) => void;
     };
     add(data: UpdateData): Promise<void>;