@netless/window-manager 1.0.0-canary.40 → 1.0.0-canary.43

package/dist/index.es.js

@@ -5181,7 +5181,7 @@ class TeleBoxManager {
     stageStyle = "",
     defaultBoxBodyStyle = null,
     defaultBoxStageStyle = null,
-    theme = {}
+    theme = null
   } = {}) {
     this.events = new Emittery();
     this._sideEffect = new SideEffectManager();
@@ -5260,6 +5260,9 @@ class TeleBoxManager {
     }));
     const darkMode$ = combine$1([prefersDark$, prefersColorScheme$], ([prefersDark, prefersColorScheme2]) => prefersColorScheme2 === "auto" ? prefersDark : prefersColorScheme2 === "dark");
     const state$ = combine$1([minimized$, maximized$], ([minimized2, maximized2]) => minimized2 ? TELE_BOX_STATE.Minimized : maximized2 ? TELE_BOX_STATE.Maximized : TELE_BOX_STATE.Normal);
+    const theme$ = new Val$1(theme, {
+      compare: shallowequal
+    });
     const readonlyValConfig = {
       darkMode: darkMode$,
       state: state$,
@@ -5279,7 +5282,8 @@ class TeleBoxManager {
       containerStyle: containerStyle$,
       stageStyle: stageStyle$,
       defaultBoxBodyStyle: defaultBoxBodyStyle$,
-      defaultBoxStageStyle: defaultBoxStageStyle$
+      defaultBoxStageStyle: defaultBoxStageStyle$,
+      theme: theme$
     };
     withValueEnhancer$1(this, valConfig, valManager);
     const closeBtnClassName = this.wrapClassName("titlebar-icon-close");
@@ -5331,8 +5335,14 @@ class TeleBoxManager {
       minimized$.subscribe((minimized2) => {
         this.$container.classList.toggle(this.wrapClassName("is-minimized"), minimized2);
       }),
-      containerStyle$.subscribe((containerStyle2) => {
+      combine$1([containerStyle$, theme$]).subscribe(([containerStyle2, theme2]) => {
         this.$container.style.cssText = containerStyle2;
+        if (theme2) {
+          Object.keys(theme2).forEach((key) => {
+            var _a;
+            this.$container.style.setProperty(`--tele-${key}`, (_a = theme2[key]) != null ? _a : null);
+          });
+        }
       }),
       stageStyle$.subscribe((stageStyle2) => {
         this.$stage.style.cssText = stageStyle2;
@@ -5548,12 +5558,6 @@ class TeleBoxManager {
     }
     return deletedBoxes;
   }
-  setTheme(theme) {
-    Object.keys(theme).forEach((key) => {
-      var _a;
-      this.$container.style.setProperty(`--tele-${key}`, (_a = theme[key]) != null ? _a : null);
-    });
-  }
   mount(root) {
     this._root$.setValue(root);
   }
@@ -12908,14 +12912,15 @@ const reconnectRefresher = new ReconnectRefresher({ emitter });
 const _WindowManager = class extends InvisiblePlugin {
   constructor(context) {
     super(context);
-    this.version = "1.0.0-canary.40";
-    this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "1.0.0-alpha.34", "emittery": "^0.11.0", "lodash": "^4.17.21", "p-retry": "^4.6.2", "side-effect-manager": "^1.1.1", "uuid": "^7.0.3", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "^0.3.0", "@netless/app-plyr": "0.2.0", "@playwright/test": "^1.23.2", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-url": "^6.1.0", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.49", "@tsconfig/svelte": "^2.0.1", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.6", "@types/node": "^18.0.3", "@types/uuid": "^8.3.4", "@typescript-eslint/eslint-plugin": "^4.30.0", "@typescript-eslint/parser": "^4.30.0", "@vitest/ui": "^0.14.2", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^3.2.0", "jsdom": "^19.0.0", "less": "^4.1.3", "prettier": "^2.3.2", "prettier-plugin-svelte": "^2.4.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^3.14.1", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.5.3", "vite-plugin-dts": "^1.2.1", "vitest": "^0.18.0", "white-web-sdk": "2.16.26" } };
+    this.version = "1.0.0-canary.43";
+    this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "1.0.0-alpha.35", "emittery": "^0.11.0", "lodash": "^4.17.21", "p-retry": "^4.6.2", "side-effect-manager": "^1.1.1", "uuid": "^7.0.3", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "^0.3.0", "@netless/app-plyr": "0.2.0", "@playwright/test": "^1.23.2", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-url": "^6.1.0", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.49", "@tsconfig/svelte": "^2.0.1", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.6", "@types/node": "^18.0.3", "@types/uuid": "^8.3.4", "@typescript-eslint/eslint-plugin": "^4.30.0", "@typescript-eslint/parser": "^4.30.0", "@vitest/ui": "^0.14.2", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^3.2.0", "jsdom": "^19.0.0", "less": "^4.1.3", "prettier": "^2.3.2", "prettier-plugin-svelte": "^2.4.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^3.14.1", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.5.3", "vite-plugin-dts": "^1.2.1", "vitest": "^0.18.0", "white-web-sdk": "2.16.26" } };
     this.emitter = callbacks;
     this.viewMode = ViewMode.Broadcaster;
     this.viewMode$ = new Val$1(ViewMode.Broadcaster);
     this.isReplay = isPlayer(this.displayer);
+    this.cameraUpdating = 0;
     this.containerSizeRatio = _WindowManager.containerSizeRatio;
-    this.moveCamera = debounce((camera) => {
+    this.moveCamera = (camera) => {
       var _a;
       const mainViewCamera = __spreadValues({}, this.mainView.camera);
       const nextCamera = __spreadValues(__spreadValues({}, mainViewCamera), camera);
@@ -12942,17 +12947,27 @@ const _WindowManager = class extends InvisiblePlugin {
           this.mainView.moveCamera(camera);
         }
         this.appManager.dispatchInternalEvent(Events.MoveCamera, camera);
-        setTimeout(() => {
-          if (!this.appManager)
-            return;
-          this.appManager.mainViewProxy.storeCamera(__spreadValues({
-            id: this.appManager.uid
-          }, nextCamera));
-        }, 200);
+        const onCameraUpdated = () => {
+          if (this.cameraUpdating) {
+            clearTimeout(this.cameraUpdating);
+          }
+          this.cameraUpdating = setTimeout(() => {
+            this.mainView.callbacks.off("onCameraUpdated", onCameraUpdated);
+            clearTimeout(this.cameraUpdating);
+            this.cameraUpdating = 0;
+            if (!this.appManager)
+              return;
+            this.appManager.mainViewProxy.storeCamera(__spreadValues({
+              id: this.appManager.uid
+            }, nextCamera));
+          }, 50);
+        };
+        this.mainView.callbacks.off("onCameraUpdated", onCameraUpdated);
+        this.mainView.callbacks.on("onCameraUpdated", onCameraUpdated);
       }
-    }, 200);
+    };
     _WindowManager.displayer = context.displayer;
-    window.NETLESS_DEPS = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "1.0.0-alpha.34", "emittery": "^0.11.0", "lodash": "^4.17.21", "p-retry": "^4.6.2", "side-effect-manager": "^1.1.1", "uuid": "^7.0.3", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "^0.3.0", "@netless/app-plyr": "0.2.0", "@playwright/test": "^1.23.2", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-url": "^6.1.0", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.49", "@tsconfig/svelte": "^2.0.1", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.6", "@types/node": "^18.0.3", "@types/uuid": "^8.3.4", "@typescript-eslint/eslint-plugin": "^4.30.0", "@typescript-eslint/parser": "^4.30.0", "@vitest/ui": "^0.14.2", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^3.2.0", "jsdom": "^19.0.0", "less": "^4.1.3", "prettier": "^2.3.2", "prettier-plugin-svelte": "^2.4.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^3.14.1", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.5.3", "vite-plugin-dts": "^1.2.1", "vitest": "^0.18.0", "white-web-sdk": "2.16.26" } };
+    window.NETLESS_DEPS = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "1.0.0-alpha.35", "emittery": "^0.11.0", "lodash": "^4.17.21", "p-retry": "^4.6.2", "side-effect-manager": "^1.1.1", "uuid": "^7.0.3", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "^0.3.0", "@netless/app-plyr": "0.2.0", "@playwright/test": "^1.23.2", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-url": "^6.1.0", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.49", "@tsconfig/svelte": "^2.0.1", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.6", "@types/node": "^18.0.3", "@types/uuid": "^8.3.4", "@typescript-eslint/eslint-plugin": "^4.30.0", "@typescript-eslint/parser": "^4.30.0", "@vitest/ui": "^0.14.2", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^3.2.0", "jsdom": "^19.0.0", "less": "^4.1.3", "prettier": "^2.3.2", "prettier-plugin-svelte": "^2.4.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^3.14.1", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.5.3", "vite-plugin-dts": "^1.2.1", "vitest": "^0.18.0", "white-web-sdk": "2.16.26" } };
   }
   static async mount(params) {
     var _a;