@netless/window-manager 0.4.30-canary.0 → 0.4.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/window-manager",
-  "version": "0.4.30-canary.0",
+  "version": "0.4.31",
   "description": "",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -45,6 +45,7 @@
     "@types/uuid": "^8.3.1",
     "@typescript-eslint/eslint-plugin": "^4.30.0",
     "@typescript-eslint/parser": "^4.30.0",
+    "@vitest/ui": "^0.14.1",
     "cypress": "^8.7.0",
     "dotenv": "^10.0.0",
     "eslint": "^7.32.0",
@@ -59,7 +60,7 @@
     "svelte": "^3.42.4",
     "typescript": "^4.5.5",
     "vite": "^2.5.3",
-    "vitest": "^0.12.4",
+    "vitest": "^0.14.1",
     "white-web-sdk": "2.16.10"
   }
 }

package/pnpm-lock.yaml

@@ -16,6 +16,7 @@ specifiers:
   '@types/uuid': ^8.3.1
   '@typescript-eslint/eslint-plugin': ^4.30.0
   '@typescript-eslint/parser': ^4.30.0
+  '@vitest/ui': ^0.14.1
   cypress: ^8.7.0
   dotenv: ^10.0.0
   emittery: ^0.9.2
@@ -36,7 +37,7 @@ specifiers:
   uuid: ^7.0.3
   video.js: '>=7'
   vite: ^2.5.3
-  vitest: ^0.12.4
+  vitest: ^0.14.1
   white-web-sdk: 2.16.10
 
 dependencies:
@@ -63,6 +64,7 @@ devDependencies:
   '@types/uuid': registry.npmmirror.com/@types/uuid/8.3.4
   '@typescript-eslint/eslint-plugin': registry.npmmirror.com/@typescript-eslint/eslint-plugin/4.33.0_bre6cjtjfaculj7kh43nxjxlbi
   '@typescript-eslint/parser': registry.npmmirror.com/@typescript-eslint/parser/4.33.0_hrkuebk64jiu2ut2d2sm4oylnu
+  '@vitest/ui': 0.14.1
   cypress: registry.npmmirror.com/cypress/8.7.0
   dotenv: registry.npmmirror.com/dotenv/10.0.0
   eslint: registry.npmmirror.com/eslint/7.32.0
@@ -77,7 +79,7 @@ devDependencies:
   svelte: registry.npmmirror.com/svelte/3.46.4
   typescript: registry.npmmirror.com/typescript/4.6.3
   vite: registry.npmmirror.com/vite/2.8.6_less@4.1.2
-  vitest: 0.12.4_jsdom@19.0.0+less@4.1.2
+  vitest: 0.14.1_nmqrau6oupbkt73pq2ukep6chi
   white-web-sdk: registry.npmmirror.com/white-web-sdk/2.16.10
 
 packages:
@@ -94,6 +96,10 @@ packages:
       vanilla-lazyload: 17.6.1
     dev: true
 
+  /@polka/url/1.0.0-next.21:
+    resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==}
+    dev: true
+
   /@tootallnate/once/2.0.0:
     resolution: {integrity: sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==}
     engines: {node: '>= 10'}
@@ -113,14 +119,20 @@ packages:
     resolution: {integrity: sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==}
     dev: true
 
-  /@types/yauzl/2.9.2:
-    resolution: {integrity: sha512-8uALY5LTvSuHgloDVUvWP3pIauILm+8/0pDMokuDYIoNsOkSwd5AiHBTSEJjKTDcZr5z8UpgOWZkxBF4iJftoA==}
+  /@types/yauzl/2.10.0:
+    resolution: {integrity: sha512-Cn6WYCm0tXv8p6k+A8PvbDG763EDpBoTzHdA+Q/MF6H3sapGjCm9NzoaJncJS9tUKSuCoDs9XHxYYsQDgxR6kw==}
     requiresBuild: true
     dependencies:
       '@types/node': registry.npmmirror.com/@types/node/17.0.23
     dev: true
     optional: true
 
+  /@vitest/ui/0.14.1:
+    resolution: {integrity: sha512-rWhltzClVxTT9ktnS9DBQUe3RdRweP+XF1LspK5i3e+P66gn3rc2LChol3EYPYHJghL2Xsm91lvQO1pgE4vgHA==}
+    dependencies:
+      sirv: 2.0.2
+    dev: true
+
   /abab/2.0.5:
     resolution: {integrity: sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q==}
     dev: true
@@ -188,7 +200,7 @@ packages:
     dev: true
 
   /check-error/1.0.2:
-    resolution: {integrity: sha1-V00xLt2Iu13YkS6Sht1sCu1KrII=}
+    resolution: {integrity: sha512-BrgHpW9NURQgzoNyjfq0Wu6VFO6D7IZEmJNdtgNqpzGG8RuNFHt2jQxWlAs4HMe119chBnv+34syEZtc6IhLtA==}
     dev: true
 
   /colors/1.4.0:
@@ -236,6 +248,18 @@ packages:
       mimic-fn: 4.0.0
     dev: true
 
+  /debug/3.2.7:
+    resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+    dependencies:
+      ms: 2.1.3
+    dev: true
+    optional: true
+
   /debug/4.3.4:
     resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
     engines: {node: '>=6.0'}
@@ -547,11 +571,11 @@ packages:
     dev: true
 
   /get-func-name/2.0.0:
-    resolution: {integrity: sha1-6td0q+5y4gQJQzoGY2YCPdaIekE=}
+    resolution: {integrity: sha512-Hm0ixYtaSZ/V7C8FJrtZIuBBI+iSgL+1Aq82zSu8VQNB4S3Gk8e7Qs3VwBDJAhmRZcFqkl3tQu36g/Foh5I5ig==}
     dev: true
 
-  /graceful-fs/4.2.9:
-    resolution: {integrity: sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==}
+  /graceful-fs/4.2.10:
+    resolution: {integrity: sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==}
     dev: true
     optional: true
 
@@ -598,7 +622,7 @@ packages:
     dev: true
 
   /image-size/0.5.5:
-    resolution: {integrity: sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=}
+    resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
     engines: {node: '>=0.10.0'}
     hasBin: true
     requiresBuild: true
@@ -711,10 +735,19 @@ packages:
     engines: {node: '>=12'}
     dev: true
 
+  /mrmime/1.0.1:
+    resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
+    engines: {node: '>=10'}
+    dev: true
+
   /ms/2.1.2:
     resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
     dev: true
 
+  /ms/2.1.3:
+    resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
+    dev: true
+
   /nanoid/3.3.4:
     resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
@@ -727,7 +760,7 @@ packages:
     hasBin: true
     requiresBuild: true
     dependencies:
-      debug: registry.npmmirror.com/debug/3.2.7
+      debug: 3.2.7
       iconv-lite: registry.npmmirror.com/iconv-lite/0.4.24
       sax: registry.npmmirror.com/sax/1.2.4
     transitivePeerDependencies:
@@ -818,6 +851,15 @@ packages:
       xmlchars: 2.2.0
     dev: true
 
+  /sirv/2.0.2:
+    resolution: {integrity: sha512-4Qog6aE29nIjAOKe/wowFTxOdmbEZKb+3tsLljaBRzJwtqto0BChD2zzH0LhgCSXiI+V7X+Y45v14wBZQ1TK3w==}
+    engines: {node: '>= 10'}
+    dependencies:
+      '@polka/url': 1.0.0-next.21
+      mrmime: 1.0.1
+      totalist: 3.0.0
+    dev: true
+
   /source-map-js/1.0.2:
     resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==}
     engines: {node: '>=0.10.0'}
@@ -847,6 +889,11 @@ packages:
     engines: {node: '>=14.0.0'}
     dev: true
 
+  /totalist/3.0.0:
+    resolution: {integrity: sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw==}
+    engines: {node: '>=6'}
+    dev: true
+
   /tough-cookie/4.0.0:
     resolution: {integrity: sha512-tHdtEpQCMrc1YLrMaqXXcj6AxhYi/xgit6mZu1+EDWUn+qhUf8wMQoFIy9NXuq23zAwtcB0t/MjACGR18pcRbg==}
     engines: {node: '>=6'}
@@ -909,8 +956,8 @@ packages:
       fsevents: 2.3.2
     dev: true
 
-  /vitest/0.12.4_jsdom@19.0.0+less@4.1.2:
-    resolution: {integrity: sha512-EDxdhlAt6vcu6y4VouAI60z78iCAVFnfBL4VlSQVQnGmOk5altOtIKvp3xfZ+cfo4iVHgqq1QNyf5qOFiL4leg==}
+  /vitest/0.14.1_nmqrau6oupbkt73pq2ukep6chi:
+    resolution: {integrity: sha512-2UUm6jYgkwh7Y3VKSRR8OuaNCm+iA5LPDnal7jyITN39maZK9L+JVxqjtQ39PSFo5Fl3/BgaJvER6GGHX9JLxg==}
     engines: {node: '>=v14.16.0'}
     hasBin: true
     peerDependencies:
@@ -930,7 +977,9 @@ packages:
     dependencies:
       '@types/chai': 4.3.1
       '@types/chai-subset': 1.3.3
+      '@vitest/ui': 0.14.1
       chai: 4.3.6
+      debug: 4.3.4
       jsdom: 19.0.0
       local-pkg: 0.4.1
       tinypool: 0.1.3
@@ -940,6 +989,7 @@ packages:
       - less
       - sass
       - stylus
+      - supports-color
     dev: true
 
   /w3c-hr-time/1.0.2:
@@ -2477,20 +2527,6 @@ packages:
     version: 1.11.0
     dev: true
 
-  registry.npmmirror.com/debug/3.2.7:
-    resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/debug/-/debug-3.2.7.tgz}
-    name: debug
-    version: 3.2.7
-    peerDependencies:
-      supports-color: '*'
-    peerDependenciesMeta:
-      supports-color:
-        optional: true
-    dependencies:
-      ms: registry.npmmirror.com/ms/2.1.3
-    dev: true
-    optional: true
-
   registry.npmmirror.com/debug/3.2.7_supports-color@8.1.1:
     resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/debug/-/debug-3.2.7.tgz}
     id: registry.npmmirror.com/debug/3.2.7
@@ -2502,7 +2538,7 @@ packages:
       supports-color:
         optional: true
     dependencies:
-      ms: registry.npmmirror.com/ms/2.1.3
+      ms: 2.1.3
       supports-color: registry.npmmirror.com/supports-color/8.1.1
     dev: true
 
@@ -3086,7 +3122,7 @@ packages:
       get-stream: registry.npmmirror.com/get-stream/5.2.0
       yauzl: registry.npmmirror.com/yauzl/2.10.0
     optionalDependencies:
-      '@types/yauzl': 2.9.2
+      '@types/yauzl': 2.10.0
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -3915,7 +3951,7 @@ packages:
     dependencies:
       universalify: registry.npmmirror.com/universalify/2.0.0
     optionalDependencies:
-      graceful-fs: 4.2.9
+      graceful-fs: 4.2.10
     dev: true
 
   registry.npmmirror.com/jsprim/2.0.2:
@@ -3962,7 +3998,7 @@ packages:
       tslib: registry.npmmirror.com/tslib/2.3.1
     optionalDependencies:
       errno: 0.1.8
-      graceful-fs: 4.2.9
+      graceful-fs: 4.2.10
       image-size: 0.5.5
       make-dir: 2.1.0
       mime: 1.6.0
@@ -4309,12 +4345,6 @@ packages:
     version: 2.1.2
     dev: true
 
-  registry.npmmirror.com/ms/2.1.3:
-    resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz}
-    name: ms
-    version: 2.1.3
-    dev: true
-
   registry.npmmirror.com/mux.js/6.0.1:
     resolution: {integrity: sha512-22CHb59rH8pWGcPGW5Og7JngJ9s+z4XuSlYvnxhLuc58cA1WqGDQPzuG8I+sPm1/p0CdgpzVTaKW408k5DNn8w==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/mux.js/-/mux.js-6.0.1.tgz}
     name: mux.js

package/src/App/AppProxy.ts

@@ -29,6 +29,7 @@ import type { NetlessApp } from "../typings";
 import type { ReadonlyTeleBox } from "@netless/telebox-insider";
 import type { PageRemoveService, PageState } from "../Page";
 import { calculateNextIndex } from "../Page";
+import { boxEmitter } from "../BoxEmitter";
 
 export type AppEmitter = Emittery<AppEmitterEvent>;
 
@@ -241,6 +242,11 @@ export class AppProxy implements PageRemoveService {
     }
 
     public async onReconnected() {
+        const isExist = Boolean(this.manager.attributes.apps[this.id]);
+        if (!isExist) {
+            await this.destroy(true, false, true);
+            return;
+        }
         this.appEmitter.emit("reconnected", undefined);
         const currentAppState = this.getAppInitState(this.id);
         await this.destroy(true, false, true);
@@ -337,7 +343,7 @@ export class AppProxy implements PageRemoveService {
                 }
                 case "focus": {
                     this.boxManager?.focusBox({ appId: this.id });
-                    emitter.emit("focus", { appId: this.id });
+                    boxEmitter.emit("focus", { appId: this.id });
                     break;
                 }
                 default: {

package/src/AppManager.ts

@@ -4,6 +4,8 @@ import { AppListeners } from "./AppListener";
 import { AppProxy } from "./App";
 import { appRegister } from "./Register";
 import { autorun, isPlayer, isRoom, ScenePathType } from "white-web-sdk";
+import { boxEmitter } from "./BoxEmitter";
+import { calculateNextIndex } from "./Page";
 import { callbacks } from "./callback";
 import { debounce, get, isInteger, orderBy } from "lodash";
 import { emitter } from "./InternalEmitter";
@@ -16,7 +18,7 @@ import { RedoUndo } from "./RedoUndo";
 import { SideEffectManager } from "side-effect-manager";
 import { ViewManager } from "./View/ViewManager";
 import type { SyncRegisterAppPayload } from "./Register";
-import type { EmitterEvent , RemoveSceneParams } from "./InternalEmitter";
+import type { RemoveSceneParams } from "./InternalEmitter";
 import {
     entireScenes,
     genAppId,
@@ -37,7 +39,14 @@ import type {
     SceneState,
 } from "white-web-sdk";
 import type { AddAppParams, BaseInsertParams, TeleBoxRect } from "./index";
-import { calculateNextIndex } from "./Page";
+import type {
+    BoxClosePayload,
+    BoxFocusPayload,
+    BoxMovePayload,
+    BoxResizePayload,
+    BoxStateChangePayload,
+} from "./BoxEmitter";
+
 
 export class AppManager {
     public displayer: Displayer;
@@ -202,27 +211,30 @@ export class AppManager {
         const scene = this.callbacksNode?.scenes[index];
         setTimeout(() => {
             if (scene) {
-                removeScenes(this.room, `${ROOT_DIR}${scene}`, index)
+                removeScenes(this.room, `${ROOT_DIR}${scene}`, index);
             }
         }, 100);
         return new Promise<boolean>((resolve, reject) => {
-            emitter.once("rootDirSceneRemoved").then(name => {
-                if (name === scene) {
-                    resolve(true);
-                }
-            }).catch(e => {
-                console.log(`[WindowManager]: removePage error: ${e}`);
-                reject(false);
-            });
+            emitter
+                .once("rootDirSceneRemoved")
+                .then(name => {
+                    if (name === scene) {
+                        resolve(true);
+                    }
+                })
+                .catch(e => {
+                    console.log(`[WindowManager]: removePage error: ${e}`);
+                    reject(false);
+                });
         });
-    }
+    };
 
     public setSceneIndexWithoutSync = (index: number) => {
         const sceneName = this.callbacksNode?.scenes[index];
         if (sceneName) {
             this.mainViewProxy.setFocusScenePath(`${ROOT_DIR}${sceneName}`);
         }
-    }
+    };
 
     private onSceneChange = (node: ScenesCallbacksNode) => {
         this.mainViewScenesLength = node.scenes.length;
@@ -299,7 +311,11 @@ export class AppManager {
     private async onCreated() {
         await this.attributesUpdateCallback(this.attributes.apps);
         emitter.emit("updateManagerRect");
-        emitter.onAny(this.boxEventListener);
+        boxEmitter.on("move", this.onBoxMove);
+        boxEmitter.on("resize", this.onBoxResize);
+        boxEmitter.on("focus", this.onBoxFocus);
+        boxEmitter.on("close", this.onBoxClose);
+        boxEmitter.on("boxStateChange", this.onBoxStateChange);
 
         this.addAppsChangeListener();
         this.addAppCloseListener();
@@ -352,6 +368,39 @@ export class AppManager {
         });
     }
 
+    private onBoxMove = (payload: BoxMovePayload) => {
+        this.dispatchInternalEvent(Events.AppMove, payload);
+        this.store.updateAppState(payload.appId, AppAttributes.Position, {
+            x: payload.x,
+            y: payload.y,
+        });
+    };
+
+    private onBoxResize = (payload: BoxResizePayload) => {
+        if (payload.width && payload.height) {
+            this.dispatchInternalEvent(Events.AppResize, payload);
+            this.store.updateAppState(payload.appId, AppAttributes.Size, {
+                width: payload.width,
+                height: payload.height,
+            });
+        }
+    };
+
+    private onBoxFocus = (payload: BoxFocusPayload) => {
+        this.windowManger.safeSetAttributes({ focus: payload.appId });
+    };
+
+    private onBoxClose = (payload: BoxClosePayload) => {
+        const appProxy = this.appProxies.get(payload.appId);
+        if (appProxy) {
+            appProxy.destroy(false, true, true, payload.error);
+        }
+    };
+
+    private onBoxStateChange = (payload: BoxStateChangePayload) => {
+        this.dispatchInternalEvent(Events.AppBoxStateChange, payload);
+    };
+
     public addAppsChangeListener = () => {
         this.refresher?.add("apps", () => {
             return safeListenPropsUpdated(
@@ -371,7 +420,6 @@ export class AppManager {
         });
     };
 
-    
     private onMainViewIndexChange = (index: number) => {
         if (index !== undefined && this._prevSceneIndex !== index) {
             callbacks.emit("mainViewSceneIndexChange", index);
@@ -432,7 +480,7 @@ export class AppManager {
                         if (!appAttributes) {
                             throw new Error("appAttributes is undefined");
                         }
-                        this.appCreateQueue.push(() => {
+                        this.appCreateQueue.push<AppProxy>(() => {
                             this.appStatus.set(id, AppStatus.StartCreate);
                             return this.baseInsertApp(
                                 {
@@ -558,7 +606,7 @@ export class AppManager {
     private afterAddApp(appProxy: AppProxy | undefined) {
         if (appProxy && appProxy.box) {
             const box = appProxy.box;
-            emitter.emit("move", {
+            boxEmitter.emit("move", {
                 appId: appProxy.id,
                 x: box?.intrinsicX,
                 y: box?.intrinsicY,
@@ -694,7 +742,7 @@ export class AppManager {
         if (this.room) {
             if (this.store.getMainViewSceneIndex() === index) return;
             const sceneName = this.callbacksNode?.scenes[index];
-            const scenePath =`${ROOT_DIR}${sceneName}`;
+            const scenePath = `${ROOT_DIR}${sceneName}`;
             if (sceneName) {
                 const success = this.setMainViewFocusPath(scenePath);
                 if (success) {
@@ -727,46 +775,6 @@ export class AppManager {
         }
     }
 
-    private boxEventListener = (eventName: keyof EmitterEvent, payload: any) => {
-        switch (eventName) {
-            case "move": {
-                this.dispatchInternalEvent(Events.AppMove, payload);
-                this.store.updateAppState(payload.appId, AppAttributes.Position, {
-                    x: payload.x,
-                    y: payload.y,
-                });
-                break;
-            }
-            case "focus": {
-                this.windowManger.safeSetAttributes({ focus: payload.appId });
-                break;
-            }
-            case "resize": {
-                if (payload.width && payload.height) {
-                    this.dispatchInternalEvent(Events.AppResize, payload);
-                    this.store.updateAppState(payload.appId, AppAttributes.Size, {
-                        width: payload.width,
-                        height: payload.height,
-                    });
-                }
-                break;
-            }
-            case "close": {
-                const appProxy = this.appProxies.get(payload.appId);
-                if (appProxy) {
-                    appProxy.destroy(false, true, payload.error);
-                }
-                break;
-            }
-            case "boxStateChange": {
-                this.dispatchInternalEvent(Events.AppBoxStateChange, payload);
-                break;
-            }
-            default:
-                break;
-        }
-    };
-
     public focusByAttributes(apps: any) {
         if (apps && Object.keys(apps).length === this.boxManager?.boxSize) {
             const focusAppId = this.store.focus;
@@ -806,7 +814,7 @@ export class AppManager {
         this.displayer.callbacks.off(this.eventName, this.displayerStateListener);
         this.displayer.callbacks.off("onEnableWriteNowChanged", this.displayerWritableListener);
         this.appListeners.removeListeners();
-        emitter.offAny(this.boxEventListener);
+        boxEmitter.clearListeners();
         emitter.clearListeners();
         if (this.appProxies.size) {
             this.appProxies.forEach(appProxy => {

package/src/BoxEmitter.ts

@@ -0,0 +1,19 @@
+import type { TELE_BOX_STATE } from "@netless/telebox-insider";
+import Emittery from "emittery";
+
+export type BoxMovePayload = { appId: string, x: number; y: number };
+export type BoxFocusPayload = { appId: string };
+export type BoxResizePayload = { appId: string, width: number; height: number, x?: number, y?: number };
+export type BoxClosePayload = { appId: string, error?: Error };
+export type BoxStateChangePayload = { appId: string, state: TELE_BOX_STATE };
+
+export type BoxEvent = {
+    move: BoxMovePayload;
+    focus: BoxFocusPayload;
+    resize: BoxResizePayload;
+    close: BoxClosePayload;
+    boxStateChange: BoxStateChangePayload
+}
+
+export type BoxEmitterType = Emittery<BoxEvent>;
+export const boxEmitter: BoxEmitterType = new Emittery();

package/src/BoxManager.ts

@@ -2,6 +2,7 @@ import { AppAttributes, Events, MIN_HEIGHT, MIN_WIDTH } from "./constants";
 import { debounce } from "lodash";
 import { TELE_BOX_STATE, TeleBoxCollector, TeleBoxManager } from "@netless/telebox-insider";
 import { WindowManager } from "./index";
+import type { BoxEmitterType } from "./BoxEmitter";
 import type { AddAppOptions, AppInitState } from "./index";
 import type {
     TeleBoxManagerUpdateConfig,
@@ -51,6 +52,7 @@ export type BoxManagerContext = {
     getMainView: () => View;
     updateAppState: (appId: string, field: AppAttributes, value: any) => void;
     emitter: EmitterType;
+    boxEmitter: BoxEmitterType;
     callbacks: CallbacksType;
     canOperate: () => boolean;
     notifyContainerRectUpdate: (rect: TeleBoxRect) => void;
@@ -62,6 +64,7 @@ export const createBoxManager = (
     manager: WindowManager,
     callbacks: CallbacksType,
     emitter: EmitterType,
+    boxEmitter: BoxEmitterType,
     options: CreateTeleBoxManagerConfig
 ) => {
     return new BoxManager(
@@ -76,6 +79,7 @@ export const createBoxManager = (
             setAppFocus: (appId: string) => manager.appManager?.store.setAppFocus(appId, true),
             callbacks,
             emitter,
+            boxEmitter
         },
         options
     );
@@ -88,7 +92,7 @@ export class BoxManager {
         private context: BoxManagerContext,
         private createTeleBoxManagerConfig?: CreateTeleBoxManagerConfig
     ) {
-        const { emitter, callbacks } = context;
+        const { emitter, callbacks, boxEmitter } = context;
         this.teleBoxManager = this.setupBoxManager(createTeleBoxManagerConfig);
 
         // 使用 _xxx$.reaction 订阅修改的值, 不管有没有 skipUpdate, 修改值都会触发回调
@@ -123,19 +127,19 @@ export class BoxManager {
         });
         this.teleBoxManager.events.on("removed", boxes => {
             boxes.forEach(box => {
-                emitter.emit("close", { appId: box.id });
+                boxEmitter.emit("close", { appId: box.id });
             });
         });
         this.teleBoxManager.events.on(
             "intrinsic_move",
             debounce((box: ReadonlyTeleBox): void => {
-                emitter.emit("move", { appId: box.id, x: box.intrinsicX, y: box.intrinsicY });
+                boxEmitter.emit("move", { appId: box.id, x: box.intrinsicX, y: box.intrinsicY });
             }, 50)
         );
         this.teleBoxManager.events.on(
             "intrinsic_resize",
             debounce((box: ReadonlyTeleBox): void => {
-                emitter.emit("resize", {
+                boxEmitter.emit("resize", {
                     appId: box.id,
                     width: box.intrinsicWidth,
                     height: box.intrinsicHeight,
@@ -145,7 +149,7 @@ export class BoxManager {
         this.teleBoxManager.events.on("focused", box => {
             if (box) {
                 if (this.canOperate) {
-                    emitter.emit("focus", { appId: box.id });
+                    boxEmitter.emit("focus", { appId: box.id });
                 } else {
                     this.teleBoxManager.blurBox(box.id);
                 }
@@ -221,7 +225,7 @@ export class BoxManager {
         const box = this.teleBoxManager.queryOne({ id: appId });
         if (box) {
             if (box.state === TELE_BOX_STATE.Maximized) {
-                this.context.emitter.emit("resize", {
+                this.context.boxEmitter.emit("resize", {
                     appId: appId,
                     x: box.x,
                     y: box.y,

package/src/InternalEmitter.ts

@@ -8,10 +8,6 @@ export type RemoveSceneParams = {
 export type EmitterEvent = {
     onCreated: undefined;
     InitReplay: AppInitState;
-    move: { appId: string; x: number; y: number };
-    focus: { appId: string };
-    close: { appId: string };
-    resize: { appId: string; width: number; height: number; x?: number; y?: number };
     error: Error;
     seekStart: undefined;
     seek: number;