@netless/window-manager 1.0.0-canary.76 → 1.0.0-canary.78

package/dist/index.js

@@ -14,6 +14,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -615,9 +619,14 @@ class AppListeners {
     this.moveCameraHandler = (payload) => {
       const size$ = this.manager.mainViewProxy.size$;
       if (size$.value) {
-        const size = this.manager.mainView.size;
-        const diff = Math.max(size.height / size$.value.height, size.width / size$.value.width);
-        const nextCamera = { ...payload, scale: payload.scale * diff };
+        const nextCamera = { ...payload };
+        if (nextCamera.scale) {
+          const size = this.manager.mainView.size;
+          const diff = Math.max(size.height / size$.value.height, size.width / size$.value.width);
+          nextCamera.scale *= diff;
+        } else {
+          delete nextCamera.scale;
+        }
         this.manager.mainView.moveCamera(nextCamera);
       }
     };
@@ -794,11 +803,17 @@ const checkVersion = () => {
   }
 };
 const findMemberByUid = (room, uid) => {
-  const roomMembers = room == null ? void 0 : room.state.roomMembers;
-  return roomMembers == null ? void 0 : roomMembers.find((member) => {
-    var _a;
-    return ((_a = member.payload) == null ? void 0 : _a.uid) === uid;
-  });
+  var _a;
+  const roomMembers = (room == null ? void 0 : room.state.roomMembers) || [];
+  let maxMemberId = -1;
+  let result = void 0;
+  for (const member of roomMembers) {
+    if (((_a = member.payload) == null ? void 0 : _a.uid) === uid && maxMemberId < member.memberId) {
+      maxMemberId = member.memberId;
+      result = member;
+    }
+  }
+  return result;
 };
 const serializeRoomMembers = (members) => {
   return members.map((member) => {
@@ -987,9 +1002,11 @@ class AppContext {
       return this.displayer.calibrationTimestamp;
     }
   }
+  /** Get App writable status. */
   get isWritable() {
     return this.appProxy.isWritable && !this.destroyed;
   }
+  /** Get the App Window UI box. */
   get box() {
     const box = this.appProxy.box$.value;
     if (box) {
@@ -1004,6 +1021,7 @@ class AppContext {
   get members() {
     return this.manager.members$.value;
   }
+  //** currentMember is undefined in read-only and replay mode. */
   get currentMember() {
     const self = findMemberByUid(this.room, this.manager.uid);
     if (!self) {
@@ -1289,9 +1307,15 @@ class AttributesDelegate {
     this.context = context;
     this.setAppFocus = (appId, focus) => {
       if (focus) {
-        this.context.safeSetAttributes({ ["focus"]: appId });
+        this.context.safeSetAttributes({ [
+          "focus"
+          /* Focus */
+        ]: appId });
       } else {
-        this.context.safeSetAttributes({ ["focus"]: void 0 });
+        this.context.safeSetAttributes({ [
+          "focus"
+          /* Focus */
+        ]: void 0 });
       }
     };
   }
@@ -1302,16 +1326,26 @@ class AttributesDelegate {
     return this.context.getAttributes();
   }
   apps() {
-    return lodash.get(this.attributes, ["apps"]);
+    return lodash.get(this.attributes, [
+      "apps"
+      /* Apps */
+    ]);
   }
   get focus() {
-    return lodash.get(this.attributes, ["focus"]);
+    return lodash.get(this.attributes, [
+      "focus"
+      /* Focus */
+    ]);
   }
   getAppAttributes(id) {
     return lodash.get(this.apps(), [id]);
   }
   getAppState(id) {
-    return lodash.get(this.apps(), [id, "state"]);
+    return lodash.get(this.apps(), [
+      id,
+      "state"
+      /* State */
+    ]);
   }
   getMaximized() {
     return lodash.get(this.attributes, ["maximized"]);
@@ -1335,14 +1369,24 @@ class AttributesDelegate {
     }
     attrs.createdAt = Date.now();
     this.context.safeUpdateAttributes(["apps", id], attrs);
-    this.context.safeUpdateAttributes(["apps", id, "state"], {
+    this.context.safeUpdateAttributes([
+      "apps",
+      id,
+      "state"
+      /* State */
+    ], {
       [AppAttributes.Size]: {},
       [AppAttributes.Position]: {},
       [AppAttributes.SceneIndex]: 0
     });
   }
   updateAppState(appId, stateName, state) {
-    if (lodash.get(this.attributes, ["apps", appId, "state"])) {
+    if (lodash.get(this.attributes, [
+      "apps",
+      appId,
+      "state"
+      /* State */
+    ])) {
       this.context.safeUpdateAttributes(["apps", appId, "state", stateName], state);
     }
   }
@@ -1352,13 +1396,19 @@ class AttributesDelegate {
   cleanAppAttributes(id) {
     this.context.safeUpdateAttributes(["apps", id], void 0);
     this.context.safeSetAttributes({ [id]: void 0 });
-    const focus = this.attributes["focus"];
+    const focus = this.attributes[
+      "focus"
+      /* Focus */
+    ];
     if (focus === id) {
       this.cleanFocus();
     }
   }
   cleanFocus() {
-    this.context.safeSetAttributes({ ["focus"]: void 0 });
+    this.context.safeSetAttributes({ [
+      "focus"
+      /* Focus */
+    ]: void 0 });
   }
   getAppSceneIndex(id) {
     var _a;
@@ -1375,7 +1425,10 @@ class AttributesDelegate {
     return this.attributes["_mainSceneIndex"];
   }
   getBoxState() {
-    return this.attributes["boxState"];
+    return this.attributes[
+      "boxState"
+      /* BoxState */
+    ];
   }
   setMainViewScenePath(scenePath) {
     this.context.safeSetAttributes({ _mainScenePath: scenePath });
@@ -1384,44 +1437,84 @@ class AttributesDelegate {
     this.context.safeSetAttributes({ _mainSceneIndex: index2 });
   }
   getMainViewCamera() {
-    return lodash.get(this.attributes, ["mainViewCamera"]);
+    return lodash.get(this.attributes, [
+      "mainViewCamera"
+      /* MainViewCamera */
+    ]);
   }
   getMainViewSize() {
-    return lodash.get(this.attributes, ["mainViewSize"]);
+    return lodash.get(this.attributes, [
+      "mainViewSize"
+      /* MainViewSize */
+    ]);
   }
   setMainViewCamera(camera) {
-    this.context.safeSetAttributes({ ["mainViewCamera"]: { ...camera } });
+    this.context.safeSetAttributes({ [
+      "mainViewCamera"
+      /* MainViewCamera */
+    ]: { ...camera } });
   }
   setMainViewSize(size) {
-    this.context.safeSetAttributes({ ["mainViewSize"]: { ...size } });
+    this.context.safeSetAttributes({ [
+      "mainViewSize"
+      /* MainViewSize */
+    ]: { ...size } });
   }
   setMainViewCameraAndSize(camera, size) {
     this.context.safeSetAttributes({
-      ["mainViewCamera"]: { ...camera },
-      ["mainViewSize"]: { ...size }
+      [
+        "mainViewCamera"
+        /* MainViewCamera */
+      ]: { ...camera },
+      [
+        "mainViewSize"
+        /* MainViewSize */
+      ]: { ...size }
     });
   }
   updateCursor(uid, position) {
-    if (!lodash.get(this.attributes, ["cursors"])) {
-      this.context.safeUpdateAttributes(["cursors"], {});
+    if (!lodash.get(this.attributes, [
+      "cursors"
+      /* Cursors */
+    ])) {
+      this.context.safeUpdateAttributes([
+        "cursors"
+        /* Cursors */
+      ], {});
     }
     if (!lodash.get(this.attributes, ["cursors", uid])) {
       this.context.safeUpdateAttributes(["cursors", uid], {});
     }
-    this.context.safeUpdateAttributes(["cursors", uid, "position"], position);
+    this.context.safeUpdateAttributes([
+      "cursors",
+      uid,
+      "position"
+      /* Position */
+    ], position);
   }
   updateCursorState(uid, cursorState) {
     if (!lodash.get(this.attributes, ["cursors", uid])) {
       this.context.safeUpdateAttributes(["cursors", uid], {});
     }
-    this.context.safeUpdateAttributes(["cursors", uid, "cursorState"], cursorState);
+    this.context.safeUpdateAttributes([
+      "cursors",
+      uid,
+      "cursorState"
+      /* CursorState */
+    ], cursorState);
   }
   getCursorState(uid) {
-    return lodash.get(this.attributes, ["cursors", uid, "cursorState"]);
+    return lodash.get(this.attributes, [
+      "cursors",
+      uid,
+      "cursorState"
+      /* CursorState */
+    ]);
   }
   cleanCursor(uid) {
     this.context.safeUpdateAttributes(["cursors", uid], void 0);
   }
+  // TODO 状态中保存一个 SceneName 优化性能
   setMainViewFocusPath(mainView) {
     const scenePath = this.getMainViewScenePath();
     if (scenePath) {
@@ -1869,6 +1962,7 @@ class AppProxy {
       throw new Error(`[WindowManager]: app setup error: ${error.message}`);
     }
   }
+  // 兼容移动端创建时会出现 PPT 不适配的问题
   fixMobileSize() {
     var _a, _b;
     const box = (_a = this.boxManager) == null ? void 0 : _a.getBox(this.id);
@@ -1999,6 +2093,7 @@ class AppProxy {
   get pageState() {
     return this._pageState.toObject();
   }
+  // PageRemoveService
   async removeSceneByIndex(index2) {
     const scenePath = this._pageState.getFullPath(index2);
     if (scenePath && this.pageState) {
@@ -2022,6 +2117,7 @@ class AppProxy {
       this.view.focusSceneIndex = index2;
     }
   }
+  // PageRemoveService end
   setSceneIndex(index2) {
     if (this.view) {
       this.view.focusSceneIndex = index2;
@@ -2533,8 +2629,8 @@ const createScrollStorage = (manager) => {
     defaultState: { scrollTop: 0 }
   });
 };
-function clamp$2(x2, min, max) {
-  return x2 < min ? min : x2 > max ? max : x2;
+function clamp$2(x, min, max) {
+  return x < min ? min : x > max ? max : x;
 }
 class ScrollMode {
   constructor(manager) {
@@ -3093,6 +3189,10 @@ class AppManager {
       });
     });
   }
+  /**
+   * 根目录被删除时所有的 scene 都会被删除.
+   * 所以需要关掉所有开启了 view 的 app
+   */
   async onRootDirRemoved(needClose = true) {
     await this.setMainViewScenePath(INIT_DIR);
     this.createRootDirScenesCallback();
@@ -3197,6 +3297,12 @@ class AppManager {
       return () => redoUndo.destroy();
     });
   }
+  /**
+   * 插件更新 apps 时的回调
+   *
+   * @param {*} apps
+   * @memberof WindowManager
+   */
   async _attributesUpdateCallback(apps) {
     if (apps && WindowManager.container) {
       const appIds = Object.keys(apps);
@@ -3463,6 +3569,20 @@ class AppManager {
     (_a = this.scrollMode) == null ? void 0 : _a.dispose();
   }
 }
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
 var __assign = function() {
   __assign = Object.assign || function __assign2(t) {
     for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -4271,6 +4391,9 @@ function index(nodeOrSelector, props) {
   var node = typeof nodeOrSelector === "string" ? document.querySelector(nodeOrSelector) : nodeOrSelector;
   return getStyler(node, props);
 }
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+}
 var shallowequal = function shallowEqual(objA, objB, compare, compareContext) {
   var ret = compare ? compare.call(compareContext, objA, objB) : void 0;
   if (ret !== void 0) {
@@ -4302,6 +4425,7 @@ var shallowequal = function shallowEqual(objA, objB, compare, compareContext) {
   }
   return true;
 };
+const shallowequal$1 = /* @__PURE__ */ getDefaultExportFromCjs(shallowequal);
 var shadowStyles = /* @__PURE__ */ (() => '.tele-fancy-scrollbar {\n  overscroll-behavior: contain;\n  overflow: auto;\n  overflow-y: scroll;\n  overflow-y: overlay;\n  -webkit-overflow-scrolling: touch;\n  -ms-overflow-style: -ms-autohiding-scrollbar;\n  scrollbar-width: auto;\n}\n.tele-fancy-scrollbar::-webkit-scrollbar {\n  height: 8px;\n  width: 8px;\n}\n.tele-fancy-scrollbar::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n.tele-fancy-scrollbar::-webkit-scrollbar-thumb {\n  background-color: rgba(68, 78, 96, 0.1);\n  background-color: transparent;\n  border-radius: 4px;\n  transition: background-color 0.4s;\n}\n.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb {\n  background-color: rgba(68, 78, 96, 0.1);\n}\n.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: rgba(68, 78, 96, 0.2);\n}\n.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active {\n  background-color: rgba(68, 78, 96, 0.2);\n}\n.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical {\n  min-height: 50px;\n}\n.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal {\n  min-width: 50px;\n}\n.telebox-quarantine {\n  all: initial;\n  position: relative;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n}\n.telebox-body-wrap {\n  color: #191919;\n  color: var(--tele-boxColor, #191919);\n  flex: 1;\n  width: 100%;\n  overflow: hidden;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n}\n.telebox-content {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  background-color: #f9f9f9;\n  background-color: var(--tele-boxContainerBackground, #f9f9f9);\n}\n.telebox-box-stage {\n  position: absolute;\n  z-index: 1;\n  overflow: hidden;\n  background-color: #fff;\n  background-color: var(--tele-boxStageBackground, #fff);\n  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08);\n  box-shadow: var(--tele-boxStageShadow, 0px 0px 16px rgba(0, 0, 0, 0.08));\n}\n.telebox-footer-wrap {\n  flex-shrink: 0;\n  display: flex;\n  flex-direction: column;\n  color: #191919;\n  color: var(--tele-boxFooterColor, #191919);\n  background-color: #fff;\n  background-color: var(--tele-boxFooterBackground, #fff);\n}\n.telebox-footer-wrap::before {\n  content: "";\n  display: block;\n  flex: 1;\n}\n.telebox-color-scheme-dark {\n  color-scheme: dark;\n}\n.telebox-color-scheme-dark .telebox-body-wrap {\n  color: #e9e9e9;\n  color: var(--tele-boxColor, #e9e9e9);\n}\n.telebox-color-scheme-dark .telebox-content {\n  background-color: #25282e;\n  background-color: var(--tele-boxContainerBackground, #25282e);\n}\n.telebox-color-scheme-dark .telebox-box-stage {\n  background-color: #272a30;\n  background-color: var(--tele-boxStageBackground, #272a30);\n  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.24);\n  box-shadow: var(--tele-boxStageShadow, 0px 0px 16px rgba(0, 0, 0, 0.24));\n}\n.telebox-color-scheme-dark .telebox-footer-wrap {\n  color: #e9e9e9;\n  color: var(--tele-boxFooterColor, #e9e9e9);\n  background-color: #383b42;\n  background-color: var(--tele-boxFooterBackground, #383b42);\n}')();
 var TELE_BOX_COLOR_SCHEME = /* @__PURE__ */ ((TELE_BOX_COLOR_SCHEME2) => {
   TELE_BOX_COLOR_SCHEME2["Light"] = "light";
@@ -4541,7 +4665,7 @@ class TeleBox {
     height = 0.5,
     minWidth = 0,
     minHeight = 0,
-    x: x2 = 0.1,
+    x = 0.1,
     y = 0.1,
     resizable = true,
     draggable = true,
@@ -4600,36 +4724,36 @@ class TeleBox {
     const minSize$ = new valueEnhancer.Val({
       width: clamp(minWidth, 0, 1),
       height: clamp(minHeight, 0, 1)
-    }, { compare: shallowequal });
+    }, { compare: shallowequal$1 });
     const pxMinSize$ = valueEnhancer.combine([minSize$, managerStageRect$], ([minSize, managerStageRect]) => ({
       width: minSize.width * managerStageRect.width,
       height: minSize.height * managerStageRect.height
-    }), { compare: shallowequal });
-    const intrinsicSize$ = new valueEnhancer.Val({ width, height }, { compare: shallowequal });
+    }), { compare: shallowequal$1 });
+    const intrinsicSize$ = new valueEnhancer.Val({ width, height }, { compare: shallowequal$1 });
     this._sideEffect.addDisposer(minSize$.reaction((minSize, skipUpdate) => {
       intrinsicSize$.setValue({
         width: Math.max(width, minSize.width),
         height: Math.max(height, minSize.height)
       }, skipUpdate);
     }));
-    const intrinsicCoord$ = new valueEnhancer.Val({ x: x2, y }, { compare: shallowequal });
+    const intrinsicCoord$ = new valueEnhancer.Val({ x, y }, { compare: shallowequal$1 });
     const pxIntrinsicSize$ = valueEnhancer.combine([intrinsicSize$, managerStageRect$], ([size, managerStageRect]) => ({
       width: managerStageRect.width * size.width,
       height: managerStageRect.height * size.height
-    }), { compare: shallowequal });
+    }), { compare: shallowequal$1 });
     const pxIntrinsicCoord$ = valueEnhancer.combine([intrinsicCoord$, managerStageRect$], ([intrinsicCoord, managerStageRect]) => ({
       x: intrinsicCoord.x * managerStageRect.width,
       y: intrinsicCoord.y * managerStageRect.height
-    }), { compare: shallowequal });
+    }), { compare: shallowequal$1 });
     const bodyStyle$ = new valueEnhancer.Val(bodyStyle);
     const stageStyle$ = new valueEnhancer.Val(stageStyle);
     const contentRoot$ = new valueEnhancer.Val(null);
     const bodyRect$ = new valueEnhancer.Val(managerStageRect$.value, {
-      compare: shallowequal
+      compare: shallowequal$1
     });
     const stageRatio$ = new valueEnhancer.Val(stageRatio);
     const finalStageRatio$ = valueEnhancer.combine([stageRatio$, managerStageRatio$], ([stageRatio2, managerStageRatio]) => stageRatio2 != null ? stageRatio2 : managerStageRatio);
-    const stageRect$ = valueEnhancer.combine([bodyRect$, finalStageRatio$], calcStageRect, { compare: shallowequal });
+    const stageRect$ = valueEnhancer.combine([bodyRect$, finalStageRatio$], calcStageRect, { compare: shallowequal$1 });
     const propsValConfig = {
       darkMode: darkMode$,
       fence: fence$,
@@ -4762,16 +4886,16 @@ class TeleBox {
   get intrinsicHeight() {
     return this._intrinsicSize$.value.height;
   }
-  move(x2, y, skipUpdate = false) {
+  move(x, y, skipUpdate = false) {
     let safeX;
     let safeY;
     const managerStageRect = this.managerStageRect;
     const pxIntrinsicSize = this.pxIntrinsicSize;
     if (this.fence) {
-      safeX = clamp(x2, 0, managerStageRect.width - pxIntrinsicSize.width);
+      safeX = clamp(x, 0, managerStageRect.width - pxIntrinsicSize.width);
       safeY = clamp(y, 0, managerStageRect.height - pxIntrinsicSize.height);
     } else {
-      safeX = clamp(x2, -(pxIntrinsicSize.width - 120), 0 + managerStageRect.width - 20);
+      safeX = clamp(x, -(pxIntrinsicSize.width - 120), 0 + managerStageRect.width - 20);
       safeY = clamp(y, 0, 0 + managerStageRect.height - 20);
     }
     this._intrinsicCoord$.setValue({
@@ -4779,7 +4903,7 @@ class TeleBox {
       y: safeY / managerStageRect.height
     }, skipUpdate);
   }
-  transform(x2, y, width, height, skipUpdate = false) {
+  transform(x, y, width, height, skipUpdate = false) {
     const managerStageRect = this.managerStageRect;
     width = Math.max(width, this.pxMinSize.width);
     height = Math.max(height, this.pxMinSize.height);
@@ -4794,7 +4918,7 @@ class TeleBox {
       y = 0;
       height = this.pxIntrinsicSize.height;
     }
-    this.move(x2, y, skipUpdate);
+    this.move(x, y, skipUpdate);
     this._intrinsicSize$.setValue({
       width: width / managerStageRect.width,
       height: height / managerStageRect.height
@@ -4939,7 +5063,7 @@ class TeleBox {
         styles.scaleY = collectorRect.height / boxHeight;
       }
       return styles;
-    }, { compare: shallowequal });
+    }, { compare: shallowequal$1 });
     const boxStyles = boxStyles$.value;
     this.$box.style.width = boxStyles.width + "px";
     this.$box.style.height = boxStyles.height + "px";
@@ -5253,10 +5377,10 @@ class TeleBoxCollector {
         }),
         minimized$.subscribe((minimized) => {
           if (minimized) {
-            const { x: x2, y, width, height } = $collector.getBoundingClientRect();
+            const { x, y, width, height } = $collector.getBoundingClientRect();
             const rootRect = root.getBoundingClientRect();
             rect$.setValue({
-              x: x2 - rootRect.x,
+              x: x - rootRect.x,
               y: y - rootRect.y,
               width,
               height
@@ -5423,7 +5547,7 @@ class TeleBoxManager {
       y: 0,
       width: window.innerWidth,
       height: window.innerHeight
-    }, { compare: shallowequal });
+    }, { compare: shallowequal$1 });
     this._sideEffect.addDisposer(root$.subscribe((root2) => {
       this._sideEffect.add(() => {
         if (!root2) {
@@ -5443,7 +5567,7 @@ class TeleBoxManager {
       }, "calc-root-rect");
     }));
     const stageRect$ = valueEnhancer.combine([rootRect$, stageRatio$], calcStageRect, {
-      compare: shallowequal
+      compare: shallowequal$1
     });
     this.boxes$ = new valueEnhancer.Val([]);
     this.topBox$ = new valueEnhancer.Val(void 0);
@@ -5481,7 +5605,7 @@ class TeleBoxManager {
     const darkMode$ = valueEnhancer.combine([prefersDark$, prefersColorScheme$], ([prefersDark, prefersColorScheme2]) => prefersColorScheme2 === "auto" ? prefersDark : prefersColorScheme2 === "dark");
     const state$ = valueEnhancer.combine([minimized$, maximized$], ([minimized2, maximized2]) => minimized2 ? TELE_BOX_STATE.Minimized : maximized2 ? TELE_BOX_STATE.Maximized : TELE_BOX_STATE.Normal);
     const theme$ = new valueEnhancer.Val(theme, {
-      compare: shallowequal
+      compare: shallowequal$1
     });
     const readonlyValConfig = {
       darkMode: darkMode$,
@@ -5900,11 +6024,11 @@ class TeleBoxManager {
     }
   }
   smartPosition(rect) {
-    let { x: x2, y } = rect;
+    let { x, y } = rect;
     const { width = 0.5, height = 0.5 } = rect;
     const stageRect = this.stageRect;
     const topBox = this.topBox;
-    if (x2 == null) {
+    if (x == null) {
       let pxX = 20;
       if (topBox) {
         const pxPreferredX = topBox.pxIntrinsicCoord.x + 20;
@@ -5913,7 +6037,7 @@ class TeleBoxManager {
           pxX = pxPreferredX;
         }
       }
-      x2 = pxX / stageRect.width;
+      x = pxX / stageRect.width;
     }
     if (y == null) {
       let pxY = 20;
@@ -5926,7 +6050,7 @@ class TeleBoxManager {
       }
       y = pxY / stageRect.height;
     }
-    return { x: x2, y, width, height };
+    return { x, y, width, height };
   }
   makeBoxTop(box, skipUpdate = false) {
     if (this.topBox) {
@@ -5977,6 +6101,10 @@ class BoxManager {
     const { emitter: emitter2, callbacks: callbacks2, boxEmitter: boxEmitter2 } = context;
     this.teleBoxManager = this.setupBoxManager(createTeleBoxManagerConfig);
     this.sideEffectManager.add(() => [
+      this.teleBoxManager.onValChanged("rootRect", (rect) => {
+        emitter2.emit("playgroundSizeChange", rect);
+      }),
+      // 使用 _xxx$.reaction 订阅修改的值, 不管有没有 skipUpdate, 修改值都会触发回调
       this.teleBoxManager.onValChanged("state", (state) => {
         callbacks2.emit("boxStateChange", state);
         emitter2.emit("boxStateChange", state);
@@ -6193,10 +6321,10 @@ class BoxManager {
       this.context.callbacks.emit("boxStateChange", this.teleBoxManager.state);
     }
   }
-  moveBox({ appId, x: x2, y }) {
+  moveBox({ appId, x, y }) {
     const box = this.getBox(appId);
     if (box) {
-      box._intrinsicCoord$.setValue({ x: x2, y }, true);
+      box._intrinsicCoord$.setValue({ x, y }, true);
     }
   }
   focusBox({ appId }, skipUpdate = true) {
@@ -6295,6 +6423,9 @@ function src_url_equal(element_src, url) {
 function is_empty(obj) {
   return Object.keys(obj).length === 0;
 }
+/* @__PURE__ */ new Set();
+const globals = typeof window !== "undefined" ? window : typeof globalThis !== "undefined" ? globalThis : global;
+"WeakMap" in globals ? /* @__PURE__ */ new WeakMap() : void 0;
 function append(target, node) {
   target.appendChild(node);
 }
@@ -6326,25 +6457,27 @@ function children(element2) {
 }
 function set_data(text2, data) {
   data = "" + data;
-  if (text2.wholeText !== data)
-    text2.data = data;
+  if (text2.data === data)
+    return;
+  text2.data = data;
 }
 function set_style(node, key, value, important) {
-  if (value === null) {
+  if (value == null) {
     node.style.removeProperty(key);
   } else {
     node.style.setProperty(key, value, important ? "important" : "");
   }
 }
+/* @__PURE__ */ new Map();
 let current_component;
 function set_current_component(component) {
   current_component = component;
 }
 const dirty_components = [];
 const binding_callbacks = [];
-const render_callbacks = [];
+let render_callbacks = [];
 const flush_callbacks = [];
-const resolved_promise = Promise.resolve();
+const resolved_promise = /* @__PURE__ */ Promise.resolve();
 let update_scheduled = false;
 function schedule_update() {
   if (!update_scheduled) {
@@ -6358,13 +6491,22 @@ function add_render_callback(fn) {
 const seen_callbacks = /* @__PURE__ */ new Set();
 let flushidx = 0;
 function flush() {
+  if (flushidx !== 0) {
+    return;
+  }
   const saved_component = current_component;
   do {
-    while (flushidx < dirty_components.length) {
-      const component = dirty_components[flushidx];
-      flushidx++;
-      set_current_component(component);
-      update(component.$$);
+    try {
+      while (flushidx < dirty_components.length) {
+        const component = dirty_components[flushidx];
+        flushidx++;
+        set_current_component(component);
+        update(component.$$);
+      }
+    } catch (e) {
+      dirty_components.length = 0;
+      flushidx = 0;
+      throw e;
     }
     set_current_component(null);
     dirty_components.length = 0;
@@ -6397,6 +6539,13 @@ function update($$) {
     $$.after_update.forEach(add_render_callback);
   }
 }
+function flush_render_callbacks(fns) {
+  const filtered = [];
+  const targets = [];
+  render_callbacks.forEach((c) => fns.indexOf(c) === -1 ? filtered.push(c) : targets.push(c));
+  targets.forEach((c) => c());
+  render_callbacks = filtered;
+}
 const outroing = /* @__PURE__ */ new Set();
 function transition_in(block, local) {
   if (block && block.i) {
@@ -6404,6 +6553,34 @@ function transition_in(block, local) {
     block.i(local);
   }
 }
+const _boolean_attributes = [
+  "allowfullscreen",
+  "allowpaymentrequest",
+  "async",
+  "autofocus",
+  "autoplay",
+  "checked",
+  "controls",
+  "default",
+  "defer",
+  "disabled",
+  "formnovalidate",
+  "hidden",
+  "inert",
+  "ismap",
+  "loop",
+  "multiple",
+  "muted",
+  "nomodule",
+  "novalidate",
+  "open",
+  "playsinline",
+  "readonly",
+  "required",
+  "reversed",
+  "selected"
+];
+/* @__PURE__ */ new Set([..._boolean_attributes]);
 function mount_component(component, target, anchor, customElement) {
   const { fragment, after_update } = component.$$;
   fragment && fragment.m(target, anchor);
@@ -6423,6 +6600,7 @@ function mount_component(component, target, anchor, customElement) {
 function destroy_component(component, detaching) {
   const $$ = component.$$;
   if ($$.fragment !== null) {
+    flush_render_callbacks($$.after_update);
     run_all($$.on_destroy);
     $$.fragment && $$.fragment.d(detaching);
     $$.on_destroy = $$.fragment = null;
@@ -6443,16 +6621,19 @@ function init(component, options, instance2, create_fragment2, not_equal, props,
   const $$ = component.$$ = {
     fragment: null,
     ctx: [],
+    // state
     props,
     update: noop,
     not_equal,
     bound: blank_object(),
+    // lifecycle
     on_mount: [],
     on_destroy: [],
     on_disconnect: [],
     before_update: [],
     after_update: [],
     context: new Map(options.context || (parent_component ? parent_component.$$.context : [])),
+    // everything else
     callbacks: blank_object(),
     dirty,
     skip_bound: false,
@@ -6522,8 +6703,14 @@ function create_if_block(ctx) {
   let t1;
   let t2;
   let div1_class_value;
-  let if_block0 = ctx[16] && create_if_block_2(ctx);
-  let if_block1 = ctx[17] && create_if_block_1(ctx);
+  let if_block0 = (
+    /*hasAvatar*/
+    ctx[16] && create_if_block_2(ctx)
+  );
+  let if_block1 = (
+    /*hasTagName*/
+    ctx[17] && create_if_block_1(ctx)
+  );
   return {
     c() {
       div1 = element("div");
@@ -6532,7 +6719,10 @@ function create_if_block(ctx) {
         if_block0.c();
       t0 = space();
       span = element("span");
-      t1 = text$1(ctx[0]);
+      t1 = text$1(
+        /*cursorName*/
+        ctx[0]
+      );
       t2 = space();
       if (if_block1)
         if_block1.c();
@@ -6540,11 +6730,33 @@ function create_if_block(ctx) {
       set_style(span, "white-space", "nowrap");
       set_style(span, "text-overflow", "ellipsis");
       set_style(span, "max-width", "80px");
-      attr(div0, "class", ctx[8]);
-      set_style(div0, "background-color", ctx[2]);
-      set_style(div0, "color", ctx[9]);
-      set_style(div0, "opacity", ctx[11]);
-      attr(div1, "class", div1_class_value = "netless-window-manager-cursor-name " + ctx[14] + " " + ctx[13]);
+      attr(
+        div0,
+        "class",
+        /*theme*/
+        ctx[8]
+      );
+      set_style(
+        div0,
+        "background-color",
+        /*backgroundColor*/
+        ctx[2]
+      );
+      set_style(
+        div0,
+        "color",
+        /*color*/
+        ctx[9]
+      );
+      set_style(
+        div0,
+        "opacity",
+        /*opacity*/
+        ctx[11]
+      );
+      attr(div1, "class", div1_class_value = "netless-window-manager-cursor-name " + /*offset*/
+      ctx[14] + " " + /*pencilEraserSize3ImageOffset*/
+      ctx[13]);
     },
     m(target, anchor) {
       insert(target, div1, anchor);
@@ -6559,7 +6771,10 @@ function create_if_block(ctx) {
         if_block1.m(div0, null);
     },
     p(ctx2, dirty) {
-      if (ctx2[16]) {
+      if (
+        /*hasAvatar*/
+        ctx2[16]
+      ) {
         if (if_block0) {
           if_block0.p(ctx2, dirty);
         } else {
@@ -6571,9 +6786,17 @@ function create_if_block(ctx) {
         if_block0.d(1);
         if_block0 = null;
       }
-      if (dirty & 1)
-        set_data(t1, ctx2[0]);
-      if (ctx2[17]) {
+      if (dirty & /*cursorName*/
+      1)
+        set_data(
+          t1,
+          /*cursorName*/
+          ctx2[0]
+        );
+      if (
+        /*hasTagName*/
+        ctx2[17]
+      ) {
         if (if_block1) {
           if_block1.p(ctx2, dirty);
         } else {
@@ -6585,19 +6808,46 @@ function create_if_block(ctx) {
         if_block1.d(1);
         if_block1 = null;
       }
-      if (dirty & 256) {
-        attr(div0, "class", ctx2[8]);
+      if (dirty & /*theme*/
+      256) {
+        attr(
+          div0,
+          "class",
+          /*theme*/
+          ctx2[8]
+        );
       }
-      if (dirty & 4) {
-        set_style(div0, "background-color", ctx2[2]);
+      if (dirty & /*backgroundColor*/
+      4) {
+        set_style(
+          div0,
+          "background-color",
+          /*backgroundColor*/
+          ctx2[2]
+        );
       }
-      if (dirty & 512) {
-        set_style(div0, "color", ctx2[9]);
+      if (dirty & /*color*/
+      512) {
+        set_style(
+          div0,
+          "color",
+          /*color*/
+          ctx2[9]
+        );
       }
-      if (dirty & 2048) {
-        set_style(div0, "opacity", ctx2[11]);
+      if (dirty & /*opacity*/
+      2048) {
+        set_style(
+          div0,
+          "opacity",
+          /*opacity*/
+          ctx2[11]
+        );
       }
-      if (dirty & 24576 && div1_class_value !== (div1_class_value = "netless-window-manager-cursor-name " + ctx2[14] + " " + ctx2[13])) {
+      if (dirty & /*offset, pencilEraserSize3ImageOffset*/
+      24576 && div1_class_value !== (div1_class_value = "netless-window-manager-cursor-name " + /*offset*/
+      ctx2[14] + " " + /*pencilEraserSize3ImageOffset*/
+      ctx2[13])) {
         attr(div1, "class", div1_class_value);
       }
     },
@@ -6618,8 +6868,14 @@ function create_if_block_2(ctx) {
     c() {
       img = element("img");
       attr(img, "class", "netless-window-manager-cursor-selector-avatar");
-      attr(img, "style", ctx[18]());
-      if (!src_url_equal(img.src, img_src_value = ctx[7]))
+      attr(
+        img,
+        "style",
+        /*computedAvatarStyle*/
+        ctx[18]()
+      );
+      if (!src_url_equal(img.src, img_src_value = /*avatar*/
+      ctx[7]))
         attr(img, "src", img_src_value);
       attr(img, "alt", "avatar");
     },
@@ -6627,7 +6883,9 @@ function create_if_block_2(ctx) {
       insert(target, img, anchor);
     },
     p(ctx2, dirty) {
-      if (dirty & 128 && !src_url_equal(img.src, img_src_value = ctx2[7])) {
+      if (dirty & /*avatar*/
+      128 && !src_url_equal(img.src, img_src_value = /*avatar*/
+      ctx2[7])) {
         attr(img, "src", img_src_value);
       }
     },
@@ -6643,19 +6901,38 @@ function create_if_block_1(ctx) {
   return {
     c() {
       span = element("span");
-      t = text$1(ctx[1]);
+      t = text$1(
+        /*tagName*/
+        ctx[1]
+      );
       attr(span, "class", "netless-window-manager-cursor-tag-name");
-      set_style(span, "background-color", ctx[10]);
+      set_style(
+        span,
+        "background-color",
+        /*cursorTagBackgroundColor*/
+        ctx[10]
+      );
     },
     m(target, anchor) {
       insert(target, span, anchor);
       append(span, t);
     },
     p(ctx2, dirty) {
-      if (dirty & 2)
-        set_data(t, ctx2[1]);
-      if (dirty & 1024) {
-        set_style(span, "background-color", ctx2[10]);
+      if (dirty & /*tagName*/
+      2)
+        set_data(
+          t,
+          /*tagName*/
+          ctx2[1]
+        );
+      if (dirty & /*cursorTagBackgroundColor*/
+      1024) {
+        set_style(
+          span,
+          "background-color",
+          /*cursorTagBackgroundColor*/
+          ctx2[10]
+        );
       }
     },
     d(detaching) {
@@ -6671,7 +6948,8 @@ function create_fragment(ctx) {
   let img;
   let img_class_value;
   let img_src_value;
-  let if_block = !ctx[12] && create_if_block(ctx);
+  let if_block = !/*isLaserPointer*/
+  ctx[12] && create_if_block(ctx);
   return {
     c() {
       div1 = element("div");
@@ -6680,14 +6958,29 @@ function create_fragment(ctx) {
       t = space();
       div0 = element("div");
       img = element("img");
-      attr(img, "class", img_class_value = "netless-window-manager-cursor-" + ctx[3] + "-image " + ctx[13]);
-      if (!src_url_equal(img.src, img_src_value = ctx[6]))
+      attr(img, "class", img_class_value = "netless-window-manager-cursor-" + /*appliance*/
+      ctx[3] + "-image " + /*pencilEraserSize3ImageOffset*/
+      ctx[13]);
+      if (!src_url_equal(img.src, img_src_value = /*src*/
+      ctx[6]))
         attr(img, "src", img_src_value);
-      attr(img, "alt", ctx[3]);
+      attr(
+        img,
+        "alt",
+        /*appliance*/
+        ctx[3]
+      );
       attr(div0, "class", "cursor-image-wrapper");
       attr(div1, "class", "netless-window-manager-cursor-mid");
-      set_style(div1, "transform", "translateX(" + ctx[4] + "px) translateY(" + ctx[5] + "px)");
-      set_style(div1, "display", ctx[15]);
+      set_style(div1, "transform", "translateX(" + /*x*/
+      ctx[4] + "px) translateY(" + /*y*/
+      ctx[5] + "px)");
+      set_style(
+        div1,
+        "display",
+        /*display*/
+        ctx[15]
+      );
     },
     m(target, anchor) {
       insert(target, div1, anchor);
@@ -6698,7 +6991,8 @@ function create_fragment(ctx) {
       append(div0, img);
     },
     p(ctx2, [dirty]) {
-      if (!ctx2[12]) {
+      if (!/*isLaserPointer*/
+      ctx2[12]) {
         if (if_block) {
           if_block.p(ctx2, dirty);
         } else {
@@ -6710,20 +7004,40 @@ function create_fragment(ctx) {
         if_block.d(1);
         if_block = null;
       }
-      if (dirty & 8200 && img_class_value !== (img_class_value = "netless-window-manager-cursor-" + ctx2[3] + "-image " + ctx2[13])) {
+      if (dirty & /*appliance, pencilEraserSize3ImageOffset*/
+      8200 && img_class_value !== (img_class_value = "netless-window-manager-cursor-" + /*appliance*/
+      ctx2[3] + "-image " + /*pencilEraserSize3ImageOffset*/
+      ctx2[13])) {
         attr(img, "class", img_class_value);
       }
-      if (dirty & 64 && !src_url_equal(img.src, img_src_value = ctx2[6])) {
+      if (dirty & /*src*/
+      64 && !src_url_equal(img.src, img_src_value = /*src*/
+      ctx2[6])) {
         attr(img, "src", img_src_value);
       }
-      if (dirty & 8) {
-        attr(img, "alt", ctx2[3]);
-      }
-      if (dirty & 48) {
-        set_style(div1, "transform", "translateX(" + ctx2[4] + "px) translateY(" + ctx2[5] + "px)");
+      if (dirty & /*appliance*/
+      8) {
+        attr(
+          img,
+          "alt",
+          /*appliance*/
+          ctx2[3]
+        );
       }
-      if (dirty & 32768) {
-        set_style(div1, "display", ctx2[15]);
+      if (dirty & /*x, y*/
+      48) {
+        set_style(div1, "transform", "translateX(" + /*x*/
+        ctx2[4] + "px) translateY(" + /*y*/
+        ctx2[5] + "px)");
+      }
+      if (dirty & /*display*/
+      32768) {
+        set_style(
+          div1,
+          "display",
+          /*display*/
+          ctx2[15]
+        );
       }
     },
     i: noop,
@@ -6749,7 +7063,7 @@ function instance($$self, $$props, $$invalidate) {
   let { tagName } = $$props;
   let { backgroundColor } = $$props;
   let { appliance } = $$props;
-  let { x: x2 } = $$props;
+  let { x } = $$props;
   let { y } = $$props;
   let { src } = $$props;
   let { visible } = $$props;
@@ -6778,7 +7092,7 @@ function instance($$self, $$props, $$invalidate) {
     if ("appliance" in $$props2)
       $$invalidate(3, appliance = $$props2.appliance);
     if ("x" in $$props2)
-      $$invalidate(4, x2 = $$props2.x);
+      $$invalidate(4, x = $$props2.x);
     if ("y" in $$props2)
       $$invalidate(5, y = $$props2.y);
     if ("src" in $$props2)
@@ -6799,28 +7113,36 @@ function instance($$self, $$props, $$invalidate) {
       $$invalidate(20, pencilEraserSize = $$props2.pencilEraserSize);
   };
   $$self.$$.update = () => {
-    if ($$self.$$.dirty & 1) {
+    if ($$self.$$.dirty & /*cursorName*/
+    1) {
       hasName = !lodash.isEmpty(cursorName);
     }
-    if ($$self.$$.dirty & 2) {
+    if ($$self.$$.dirty & /*tagName*/
+    2) {
       $$invalidate(17, hasTagName = !lodash.isEmpty(tagName));
     }
-    if ($$self.$$.dirty & 128) {
+    if ($$self.$$.dirty & /*avatar*/
+    128) {
       $$invalidate(16, hasAvatar = !lodash.isEmpty(avatar));
     }
-    if ($$self.$$.dirty & 524288) {
+    if ($$self.$$.dirty & /*visible*/
+    524288) {
       $$invalidate(15, display = visible ? "initial" : "none");
     }
-    if ($$self.$$.dirty & 8) {
+    if ($$self.$$.dirty & /*appliance*/
+    8) {
       $$invalidate(12, isLaserPointer = appliance === whiteWebSdk.ApplianceNames.laserPointer);
     }
-    if ($$self.$$.dirty & 4104) {
+    if ($$self.$$.dirty & /*isLaserPointer, appliance*/
+    4104) {
       $$invalidate(21, isLaserPointerPencilEraser = isLaserPointer || appliance === whiteWebSdk.ApplianceNames.pencilEraser);
     }
-    if ($$self.$$.dirty & 2097152) {
+    if ($$self.$$.dirty & /*isLaserPointerPencilEraser*/
+    2097152) {
       $$invalidate(14, offset = isLaserPointerPencilEraser ? "netless-window-manager-laserPointer-pencilEraser-offset" : "");
     }
-    if ($$self.$$.dirty & 1048576) {
+    if ($$self.$$.dirty & /*pencilEraserSize*/
+    1048576) {
       $$invalidate(13, pencilEraserSize3ImageOffset = pencilEraserSize === 3 ? "netless-window-manager-pencilEraser-3-offset" : "");
     }
   };
@@ -6829,7 +7151,7 @@ function instance($$self, $$props, $$invalidate) {
     tagName,
     backgroundColor,
     appliance,
-    x2,
+    x,
     y,
     src,
     avatar,
@@ -6903,8 +7225,8 @@ class Cursor2 {
   }
   moveCursor(cursor, rect, view) {
     var _a, _b;
-    const { x: x2, y, type } = cursor;
-    const point = view == null ? void 0 : view.screen.convertPointToScreen(x2, y);
+    const { x, y, type } = cursor;
+    const point = view == null ? void 0 : view.screen.convertPointToScreen(x, y);
     if (point) {
       let translateX = point.x - 2;
       let translateY = point.y - 18;
@@ -8228,11 +8550,11 @@ let Y$1 = class Y {
     sideEffect: s,
     readonly$: i,
     events: r,
-    wrapClassName: o2,
+    wrapClassName: n,
     root: l,
     pagesIndex$: p
   }) {
-    this.showPreview$ = new valueEnhancer.Val(false), this.namespace = e, this.pages$ = t, this.sideEffect = s, this.readonly$ = i, this.events = r, this.wrapClassName = o2, this.sideEffect.addDisposer(
+    this.showPreview$ = new valueEnhancer.Val(false), this.namespace = e, this.pages$ = t, this.sideEffect = s, this.readonly$ = i, this.events = r, this.wrapClassName = n, this.sideEffect.addDisposer(
       this.events.on("togglePreview", () => {
         this.showPreview$.setValue(!this.showPreview$.value);
       })
@@ -8242,11 +8564,11 @@ let Y$1 = class Y {
           const c = this.renderPreview(), u = this.renderPreviewMask();
           if (a) {
             l.appendChild(c), l.appendChild(u), c.scrollTop;
-            const n = c.querySelector(
+            const o2 = c.querySelector(
               "." + this.wrapClassName(`preview-page-${p.value}`)
             );
-            return n && c.scrollTo({
-              top: n.offsetTop - 16
+            return o2 && c.scrollTo({
+              top: o2.offsetTop - 16
             }), c.classList.toggle(this.wrapClassName("preview-active"), true), this.previewLazyLoad = new LazyLoad({
               container: this.$preview,
               elements_selector: "." + this.wrapClassName("preview-page>img")
@@ -8280,14 +8602,14 @@ let Y$1 = class Y {
       this.pages$.subscribe((t) => {
         var s;
         this.sideEffect.add(() => {
-          const i = t.map((r, o2) => {
+          const i = t.map((r, n) => {
             const l = r.thumbnail ?? (r.src.startsWith("ppt") ? void 0 : r.src);
             if (!l)
               return;
-            const p = String(o2), a = document.createElement("a");
-            a.className = this.wrapClassName("preview-page") + " " + this.wrapClassName(`preview-page-${o2}`), a.setAttribute("href", "#"), a.dataset.pageIndex = p;
+            const p = String(n), a = document.createElement("a");
+            a.className = this.wrapClassName("preview-page") + " " + this.wrapClassName(`preview-page-${n}`), a.setAttribute("href", "#"), a.dataset.pageIndex = p;
             const c = document.createElement("span");
-            c.className = this.wrapClassName("preview-page-name"), c.textContent = String(o2 + 1), c.dataset.pageIndex = p;
+            c.className = this.wrapClassName("preview-page-name"), c.textContent = String(n + 1), c.dataset.pageIndex = p;
             const u = document.createElement("img");
             return u.width = r.width, u.height = r.height, u.dataset.src = l, u.dataset.pageIndex = p, a.appendChild(u), a.appendChild(c), e.appendChild(a), a;
           });
@@ -8356,7 +8678,7 @@ function q$1(h2) {
     "M312.491 78.261c0-6.159 4.893-11.213 11.04-11.213 6.158 0 11.211 5.054 11.211 11.213v343.478c0 6.159-5.053 11.213-11.211 11.213-6.147 0-11.04-5.054-11.04-11.213V78.261zM165.257 78.261c0-6.159 4.893-11.213 11.04-11.213 6.158 0 11.211 5.054 11.211 11.213v343.478c0 6.159-5.053 11.213-11.211 11.213-6.147 0-11.04-5.054-11.04-11.213V78.261z"
   ), t.appendChild(s), t;
 }
-function J$1(h2) {
+function X$1(h2) {
   const e = "http://www.w3.org/2000/svg", t = document.createElementNS(e, "svg");
   t.setAttribute("class", `${h2}-footer-icon-save`), t.setAttribute("viewBox", "0 0 448 512");
   const s = document.createElementNS(e, "path");
@@ -8365,7 +8687,7 @@ function J$1(h2) {
     "M224 256c-35.2 0-64 28.8-64 64c0 35.2 28.8 64 64 64c35.2 0 64-28.8 64-64C288 284.8 259.2 256 224 256zM433.1 129.1l-83.9-83.9C341.1 37.06 328.8 32 316.1 32H64C28.65 32 0 60.65 0 96v320c0 35.35 28.65 64 64 64h320c35.35 0 64-28.65 64-64V163.9C448 151.2 442.9 138.9 433.1 129.1zM128 80h144V160H128V80zM400 416c0 8.836-7.164 16-16 16H64c-8.836 0-16-7.164-16-16V96c0-8.838 7.164-16 16-16h16v104c0 13.25 10.75 24 24 24h192C309.3 208 320 197.3 320 184V83.88l78.25 78.25C399.4 163.2 400 164.8 400 166.3V416z"
   ), t.appendChild(s), t;
 }
-function X$1(h2) {
+function J$1(h2) {
   const e = "http://www.w3.org/2000/svg", t = document.createElementNS(e, "svg");
   t.setAttribute("class", `${h2}-footer-icon-spinner`), t.setAttribute("viewBox", "0 0 512 512");
   const s = document.createElementNS(e, "path");
@@ -8385,12 +8707,12 @@ let K$1 = class K {
     sideEffect: s,
     readonly$: i,
     events: r,
-    playable: o2,
+    playable: n,
     wrapClassName: l,
     pagesIndex$: p,
     root: a
   }) {
-    this.namespace = e, this.pages$ = t, this.sideEffect = s, this.readonly$ = i, this.events = r, this.wrapClassName = l, this.pagesIndex$ = p, this.playable = o2, this.$footer = this.render(), a.appendChild(this.$footer);
+    this.namespace = e, this.pages$ = t, this.sideEffect = s, this.readonly$ = i, this.events = r, this.wrapClassName = l, this.pagesIndex$ = p, this.playable = n, this.$footer = this.render(), a.appendChild(this.$footer);
   }
   destroy() {
     this.$footer.remove();
@@ -8399,15 +8721,15 @@ let K$1 = class K {
     const e = document.createElement("div");
     e.className = this.wrapClassName("footer"), this.sideEffect.addDisposer(
       this.readonly$.subscribe(
-        (n) => e.classList.toggle(this.wrapClassName("readonly"), n)
+        (o2) => e.classList.toggle(this.wrapClassName("readonly"), o2)
       )
     );
     const t = this.renderFooterBtn("btn-sidebar", W$1(this.namespace));
     this.sideEffect.addEventListener(t, "click", () => {
       this.readonly$.value || this.events.emit("togglePreview");
     }), e.appendChild(t), this.sideEffect.addDisposer(
-      this.pages$.subscribe((n) => {
-        const d = n.some((g2) => g2.thumbnail || !g2.src.startsWith("ppt"));
+      this.pages$.subscribe((o2) => {
+        const d = o2.some((g2) => g2.thumbnail || !g2.src.startsWith("ppt"));
         t.style.display = d ? "" : "none";
       })
     );
@@ -8417,54 +8739,54 @@ let K$1 = class K {
     if (this.sideEffect.addEventListener(i, "click", () => {
       this.readonly$.value || this.events.emit("back");
     }), s.appendChild(i), this.playable) {
-      const n = this.renderFooterBtn(
+      const o2 = this.renderFooterBtn(
         "btn-page-play",
         G$1(this.namespace),
         q$1(this.namespace)
       );
-      this.sideEffect.addEventListener(n, "click", () => {
-        this.readonly$.value || (n.classList.toggle(this.wrapClassName("footer-btn-playing"), true), this.events.emit("play"), this.sideEffect.setTimeout(
-          () => n.classList.toggle(this.wrapClassName("footer-btn-playing"), false),
+      this.sideEffect.addEventListener(o2, "click", () => {
+        this.readonly$.value || (o2.classList.toggle(this.wrapClassName("footer-btn-playing"), true), this.events.emit("play"), this.sideEffect.setTimeout(
+          () => o2.classList.toggle(this.wrapClassName("footer-btn-playing"), false),
           500,
           "returnPlay"
         ));
-      }), s.appendChild(n);
+      }), s.appendChild(o2);
     }
     const r = this.renderFooterBtn("btn-page-next", O$1(this.namespace));
     this.sideEffect.addEventListener(r, "click", () => {
       this.readonly$.value || this.events.emit("next");
     }), s.appendChild(r);
-    const o2 = document.createElement("div");
-    o2.className = this.wrapClassName("page-number");
+    const n = document.createElement("div");
+    n.className = this.wrapClassName("page-number");
     const l = document.createElement("input");
     l.className = this.wrapClassName("page-number-input"), this.sideEffect.addDisposer(
-      this.readonly$.subscribe((n) => l.disabled = n)
+      this.readonly$.subscribe((o2) => l.disabled = o2)
     ), this.sideEffect.addDisposer(
-      this.pagesIndex$.subscribe((n) => l.value = String(n + 1))
+      this.pagesIndex$.subscribe((o2) => l.value = String(o2 + 1))
     ), this.sideEffect.addEventListener(l, "blur", () => {
       l.value = String(this.pagesIndex$.value + 1);
     }), this.sideEffect.addEventListener(l, "change", () => {
       if (this.readonly$.value)
         return;
-      const n = l.value ? Number(l.value) - 1 : NaN;
-      n >= 0 ? this.events.emit("jumpPage", n) : l.value = String(this.pagesIndex$.value + 1);
+      const o2 = l.value ? Number(l.value) - 1 : NaN;
+      o2 >= 0 ? this.events.emit("jumpPage", o2) : l.value = String(this.pagesIndex$.value + 1);
     });
     const p = document.createElement("span");
     this.sideEffect.addDisposer(
-      this.pages$.subscribe((n) => {
-        p.textContent = " / " + n.length;
+      this.pages$.subscribe((o2) => {
+        p.textContent = " / " + o2.length;
       })
-    ), o2.appendChild(l), o2.appendChild(p), e.appendChild(s), e.appendChild(o2);
-    const a = J$1(this.namespace), c = X$1(this.namespace);
+    ), n.appendChild(l), n.appendChild(p), e.appendChild(s), e.appendChild(n);
+    const a = X$1(this.namespace), c = J$1(this.namespace);
     c.style.display = "none";
     const u = document.createElement("button");
     return u.className = this.wrapClassName("footer-btn"), u.appendChild(a), u.appendChild(c), this.sideEffect.addEventListener(u, "click", () => {
       this.events.emit("save");
-    }), this.events.on("saveProgress", (n) => {
-      if (n < 99) {
+    }), this.events.on("saveProgress", (o2) => {
+      if (o2 < 99) {
         c.style.display = "block", a.style.display = "none";
         const d = c.querySelector("[data-id]");
-        d && (d.textContent = n.toString().padStart(2, "0"));
+        d && (d.textContent = o2.toString().padStart(2, "0"));
       } else
         c.style.display = "none", a.style.display = "block";
     }), e;
@@ -8481,7 +8803,7 @@ class T {
     previewRoot: s,
     footerRoot: i,
     pages$: r,
-    playable: o2
+    playable: n
   }) {
     this.wrapClassName = (l) => `${this.namespace}-${l}`, this.namespace = "netless-app-docs-viewer", this.sideEffect = new sideEffectManager.SideEffectManager(), this.events = new Remitter(), this.preview = new Y$1({
       pages$: r,
@@ -8495,7 +8817,7 @@ class T {
     }), this.footer = new K$1({
       pages$: r,
       readonly$: e,
-      playable: o2,
+      playable: n,
       pagesIndex$: t,
       root: i,
       namespace: this.namespace,
@@ -8508,7 +8830,7 @@ class T {
     this.preview.destroy(), this.footer.destroy(), this.sideEffect.flushAll(), this.events.destroy();
   }
 }
-function x(h2, e, t) {
+function E$1(h2, e, t) {
   return Math.min(Math.max(h2, e), t);
 }
 function A$1(h2) {
@@ -8551,27 +8873,27 @@ let Q$1 = class Q {
   }
 };
 let Z$1 = class Z {
-  constructor(e, t, s, i, r, o2) {
+  constructor(e, t, s, i, r, n) {
     this.index = e, this.lastVisit = Date.now(), this.sideEffect = new sideEffectManager.SideEffectManager();
-    const l = valueEnhancer.derive(t, (n) => n[e] || { width: 0, height: 0 }), p = valueEnhancer.combine(
+    const l = valueEnhancer.derive(t, (o2) => o2[e] || { width: 0, height: 0 }), p = valueEnhancer.combine(
       [l, s],
-      ([n, d]) => (d.width - n.width) / 2
+      ([o2, d]) => (d.width - o2.width) / 2
     ), a = valueEnhancer.combine(
-      [r, o2],
-      ([n, d]) => (n[e] || 0) - d
+      [r, n],
+      ([o2, d]) => (o2[e] || 0) - d
     ), c = document.createElement("div");
     c.className = "page-renderer-page", c.dataset.index = `${e}`;
     const u = document.createElement("img");
     u.className = "page-renderer-page-img", c.appendChild(u), this.sideEffect.addDisposer([
-      valueEnhancer.combine([l, i]).subscribe(([n, d]) => {
-        c.style.width = `${n.width * d}px`, c.style.height = `${n.height * d}px`;
+      valueEnhancer.combine([l, i]).subscribe(([o2, d]) => {
+        c.style.width = `${o2.width * d}px`, c.style.height = `${o2.height * d}px`;
       }),
-      l.subscribe((n) => {
-        n.thumbnail && (c.style.backgroundImage = `url("${n.thumbnail}")`), u.width = n.width, u.height = n.height, u.src = n.src;
+      l.subscribe((o2) => {
+        o2.thumbnail && (c.style.backgroundImage = `url("${o2.thumbnail}")`), u.width = o2.width, u.height = o2.height, u.src = o2.src;
       }),
       valueEnhancer.combine([p, a, i]).subscribe(
-        ([n, d, g2]) => {
-          c.style.transform = `translate(${n * g2}px, ${d * g2}px)`;
+        ([o2, d, g2]) => {
+          c.style.transform = `translate(${o2 * g2}px, ${d * g2}px)`;
         }
       )
     ]), this.$page = c;
@@ -8583,13 +8905,13 @@ let Z$1 = class Z {
 let ee$1 = class ee {
   constructor(e, t, s, i, r) {
     this.pages$ = e, this.pagesSize$ = t, this.scale$ = s, this.pagesYs$ = i, this.pagesScrollTop$ = r, this.els = /* @__PURE__ */ new Map(), this.maxElCount = 200, this.gcTimer = null, this.gc = () => {
-      var o2;
+      var n;
       if (this.gcTimer = null, this.els.size > this.maxElCount) {
         const l = [...this.els.values()].sort((p, a) => a.lastVisit - p.lastVisit);
         for (let p = Math.floor(this.maxElCount / 4); p < l.length; p++)
-          (o2 = this.els.get(l[p].index)) == null || o2.destroy(), this.els.delete(l[p].index);
+          (n = this.els.get(l[p].index)) == null || n.destroy(), this.els.delete(l[p].index);
       }
-    }, this.schedule = window.requestIdleCallback || ((o2) => window.setTimeout(o2, 5e3)), this.cancelSchedule = window.cancelIdleCallback || window.clearTimeout;
+    }, this.schedule = window.requestIdleCallback || ((n) => window.setTimeout(n, 5e3)), this.cancelSchedule = window.cancelIdleCallback || window.clearTimeout;
   }
   getEl(e) {
     let t = this.els.get(e);
@@ -8626,7 +8948,7 @@ let te$1 = class te {
       for (let w2 = 0; w2 < d.length; w2++)
         g2[w2] = w2 > 0 ? g2[w2 - 1] + d[w2 - 1].height : 0;
       return g2;
-    }), o2 = valueEnhancer.derive(s, (d) => {
+    }), n = valueEnhancer.derive(s, (d) => {
       let g2 = 1 / 0;
       for (let w2 = d.length - 1; w2 >= 0; w2--)
         d[w2].height <= g2 && (g2 = d[w2].height);
@@ -8645,8 +8967,8 @@ let te$1 = class te {
       [t, i],
       ([d, g2]) => d.width / g2.width || 1
     ), a = valueEnhancer.combine(
-      [s, t, o2, p],
-      ([d, g2, w2, f2]) => x(Math.ceil(g2.height / f2 / w2 / 2), 1, d.length)
+      [s, t, n, p],
+      ([d, g2, w2, f2]) => E$1(Math.ceil(g2.height / f2 / w2 / 2), 1, d.length)
     );
     valueEnhancer.withReadonlyValueEnhancer(this, {
       pagesScrollTop: e,
@@ -8655,19 +8977,19 @@ let te$1 = class te {
       pagesSize: i,
       pagesIndex: l,
       pagesYs: r,
-      pagesMinHeight: o2,
+      pagesMinHeight: n,
       scale: p
     }), this.pageElManager = new ee$1(s, i, p, r, e), this.$pages = this.renderPages();
     const c = new valueEnhancer.Val(false);
     this.sideEffect.addDisposer(
       c.subscribe((d) => this.$pages.classList.toggle("is-hwa", d))
     );
-    const u = () => c.setValue(false), n = () => {
+    const u = () => c.setValue(false), o2 = () => {
       this.sideEffect.setTimeout(u, 1e3, "turn-off-hwa"), c.setValue(true);
     };
     this.sideEffect.addDisposer(
       valueEnhancer.combine([l, a, s]).subscribe(([d, g2, w2]) => {
-        n();
+        o2();
         const f2 = Math.max(d - g2, 0), N = Math.min(d + g2, w2.length - 1);
         for (let m = 0; m < this.$pages.children.length; m++) {
           const S2 = this.$pages.children[m], k2 = Number(S2.dataset.index);
@@ -8701,23 +9023,23 @@ let ie$1 = class ie {
     stageRect$: s,
     pagesSize$: i,
     readonly$: r,
-    scrollbarMinHeight: o2 = se,
+    scrollbarMinHeight: n = se,
     wrapClassName: l,
     onDragScroll: p
   }) {
-    this.sideEffect = new sideEffectManager.SideEffectManager(), this.scrolling$ = new valueEnhancer.Val(false), this.pagesScrollTop$ = e, this.containerRect$ = t, this.stageRect$ = s, this.pagesSize$ = i, this.scrollbarMinHeight = o2, this.readonly$ = r, this.wrapClassName = l, this.onDragScroll = p, this.scrollbarHeight$ = valueEnhancer.combine(
+    this.sideEffect = new sideEffectManager.SideEffectManager(), this.scrolling$ = new valueEnhancer.Val(false), this.pagesScrollTop$ = e, this.containerRect$ = t, this.stageRect$ = s, this.pagesSize$ = i, this.scrollbarMinHeight = n, this.readonly$ = r, this.wrapClassName = l, this.onDragScroll = p, this.scrollbarHeight$ = valueEnhancer.combine(
       [t, s, i],
-      ([a, c, u]) => x(
+      ([a, c, u]) => E$1(
         c.height / (c.width / u.width * u.height) * a.height,
-        o2,
+        n,
         a.height
       )
     ), this.scrollTop$ = valueEnhancer.combine(
       [t, s, i, this.scrollbarHeight$, this.pagesScrollTop$],
-      ([a, c, u, n, d]) => x(
-        d / (u.height - u.width / c.width * c.height) * (a.height - n),
+      ([a, c, u, o2, d]) => E$1(
+        d / (u.height - u.width / c.width * c.height) * (a.height - o2),
         0,
-        a.height - n
+        a.height - o2
       )
     ), this.$scrollbar = this.renderScrollbar();
   }
@@ -8748,15 +9070,15 @@ let ie$1 = class ie {
       D(s);
       const i = this.wrapClassName("scrollbar-dragging");
       e.classList.toggle(i, true);
-      const r = this.pagesScrollTop$.value, { clientY: o2 } = A$1(s), l = (a) => {
+      const r = this.pagesScrollTop$.value, { clientY: n } = A$1(s), l = (a) => {
         if (!a.isPrimary || this.readonly$.value)
           return;
-        const { clientY: c } = A$1(a), u = c - o2;
+        const { clientY: c } = A$1(a), u = c - n;
         Math.abs(u) > 0 && this.onDragScroll && this.onDragScroll(
           r + u / this.containerRect$.value.height * this.pagesSize$.value.height
         );
       }, p = (a) => {
-        !a.isPrimary || (e.classList.toggle(i, false), window.removeEventListener("pointermove", l, true), window.removeEventListener("pointerup", p, true), window.removeEventListener("pointercancel", p, true));
+        a.isPrimary && (e.classList.toggle(i, false), window.removeEventListener("pointermove", l, true), window.removeEventListener("pointerup", p, true), window.removeEventListener("pointercancel", p, true));
       };
       window.addEventListener("pointermove", l, true), window.addEventListener("pointerup", p, true), window.addEventListener("pointercancel", p, true);
     };
@@ -8770,36 +9092,36 @@ class re {
     box: s,
     pages: i,
     pagesScrollTop: r = 0,
-    onUserScroll: o2
+    onUserScroll: n
   }) {
     this.sideEffect = new sideEffectManager.SideEffectManager(), this.userScrolling = false, this.toPdf = async () => {
       const a = document.createElement("canvas"), c = a.getContext("2d");
       if (!c)
         return null;
-      const u = this.whiteboard.pageState.pages[0], n = this.pages[0], { jsPDF: d } = await import("jspdf"), g2 = new d({
-        format: [n.width, n.height],
-        orientation: n.width > n.height ? "l" : "p",
+      const u = this.whiteboard.pageState.pages[0], o2 = this.pages[0], { jsPDF: d } = await import("jspdf"), g2 = new d({
+        format: [o2.width, o2.height],
+        orientation: o2.width > o2.height ? "l" : "p",
         compress: true
       });
       for (const [S2, k2] of this.pages.entries()) {
-        const { width: y, height: v, src: M2 } = k2;
+        const { width: y, height: v, src: L } = k2;
         a.width = y, a.height = v;
-        const L = y > v ? "l" : "p";
-        S2 > 0 && g2.addPage([y, v], L);
-        const V = await this.getBase64FromUrl(M2), P2 = document.createElement("img");
-        P2.src = V, await new Promise((_2) => P2.onload = _2), c.drawImage(P2, 0, 0);
-        const R2 = a.toDataURL("image/jpeg", 0.6);
+        const M2 = y > v ? "l" : "p";
+        S2 > 0 && g2.addPage([y, v], M2);
+        const R2 = await this.getBase64FromUrl(L), P2 = document.createElement("img");
+        P2.src = R2, await new Promise((_2) => P2.onload = _2), c.drawImage(P2, 0, 0);
+        const V = a.toDataURL("image/jpeg", 0.6);
         c.clearRect(0, 0, y, v), this.whiteboard.view.screenshotToCanvas(c, u, y, v, {
           centerX: y / 2,
           centerY: v / 2 + S2 * v,
           scale: 1
         });
         const I2 = a.toDataURL("image/png");
-        g2.addImage(R2, "JPEG", 0, 0, y, v, "", "FAST"), g2.addImage(I2, "PNG", 0, 0, y, v, "", "FAST"), c.clearRect(0, 0, y, v), this.viewer.events.emit("saveProgress", Math.ceil((S2 + 1) / this.pages.length * 100));
+        g2.addImage(V, "JPEG", 0, 0, y, v, "", "FAST"), g2.addImage(I2, "PNG", 0, 0, y, v, "", "FAST"), c.clearRect(0, 0, y, v), this.viewer.events.emit("saveProgress", Math.ceil((S2 + 1) / this.pages.length * 100));
       }
       const w2 = g2.output("arraybuffer"), f2 = new Blob([w2]), N = URL.createObjectURL(f2), m = document.createElement("a");
       m.setAttribute("href", N), m.setAttribute("download", `${this.box.title}.pdf`), m.style.display = "none", document.body.appendChild(m), m.click(), document.body.removeChild(m), window.postMessage({ type: "@app-slide/_download_pdf_", buf: w2 });
-    }, this.whiteboard = e, this.readonly$ = t, this.box = s, this.pages = i, this.onUserScroll = o2;
+    }, this.whiteboard = e, this.readonly$ = t, this.box = s, this.pages = i, this.onUserScroll = n;
     const l = () => {
       var a;
       this.userScrolling = false, (a = this.onUserScroll) == null || a.call(this, this.pagesScrollTop$.value);
@@ -8812,8 +9134,8 @@ class re {
       p,
       (a) => {
         let c = 0, u = 0;
-        for (let n = a.length - 1; n >= 0; n--) {
-          const d = a[n];
+        for (let o2 = a.length - 1; o2 >= 0; o2--) {
+          const d = a[o2];
           d.width > c && (c = d.width), u += d.height;
         }
         return { width: Math.max(1, c), height: Math.max(1, u) };
@@ -8873,8 +9195,8 @@ class re {
     return new Promise((i) => {
       const r = new FileReader();
       r.readAsDataURL(s), r.onloadend = () => {
-        const o2 = r.result;
-        i(o2);
+        const n = r.result;
+        i(n);
       };
     });
   }
@@ -8884,7 +9206,7 @@ class re {
   pageScrollTo(e) {
     const t = this.whiteboard.view.size.height / 2 / this.pageRenderer.scale;
     this.whiteboard.view.moveCamera({
-      centerY: x(
+      centerY: E$1(
         e + t,
         t,
         this.pagesSize$.value.height - t
@@ -8894,7 +9216,7 @@ class re {
   }
   userScrollToPageIndex(e) {
     var t;
-    if (e = x(e, 0, this.pages.length - 1), !this.readonly$.value && !Number.isNaN(e)) {
+    if (e = E$1(e, 0, this.pages.length - 1), !this.readonly$.value && !Number.isNaN(e)) {
       const s = this.pageRenderer.pagesYs[e];
       s >= 0 && ((t = this.onUserScroll) == null || t.call(this, s + 5 / this.pageRenderer.scale));
     }
@@ -8903,8 +9225,8 @@ class re {
     var t;
     this.readonly$.value || (t = this.onUserScroll) == null || t.call(
       this,
-      x(
-        this.pageRenderer.pagesScrollTop + this.pageRenderer.containerRect.height / this.pageRenderer.scale * x(e, -1, 1),
+      E$1(
+        this.pageRenderer.pagesScrollTop + this.pageRenderer.containerRect.height / this.pageRenderer.scale * E$1(e, -1, 1),
         0,
         this.pageRenderer.pagesSize.height - this.pageRenderer.containerRect.height / this.pageRenderer.scale
       )
@@ -8914,52 +9236,59 @@ class re {
     this.sideEffect.addEventListener(
       this.box.$main,
       "wheel",
-      (e) => {
-        D(e), !this.readonly$.value && this.pageScrollStepper.paused && (this.pageScrollTo(this.pagesScrollTop + e.deltaY), this.debounceOnUserScroll());
+      (t) => {
+        D(t), !this.readonly$.value && this.pageScrollStepper.paused && (this.pageScrollTo(this.pagesScrollTop + t.deltaY), this.debounceOnUserScroll());
       },
       { passive: false }
     ), this.sideEffect.addEventListener(
       this.box.$main,
       "touchmove",
-      (e) => {
-        !this.readonly$.value && e.touches.length > 1 && this.debounceOnUserScroll();
+      (t) => {
+        !this.readonly$.value && t.touches.length > 1 && this.debounceOnUserScroll();
       },
       { passive: true, capture: true }
     ), this.sideEffect.add(() => {
-      const e = (t) => {
-        const { width: s, height: i } = this.whiteboard.view.size;
-        if (s <= 0 || i <= 0)
+      const t = (s) => {
+        const { width: i, height: r } = this.whiteboard.view.size;
+        if (i <= 0 || r <= 0)
           return;
-        const r = t.centerY - this.pageRenderer.containerRect.height / this.pageRenderer.scale / 2;
-        this.pagesScrollTop$.setValue(Math.max(0, r));
+        const n = s.centerY - this.pageRenderer.containerRect.height / this.pageRenderer.scale / 2;
+        this.pagesScrollTop$.setValue(Math.max(0, n));
       };
-      return this.whiteboard.view.callbacks.on("onCameraUpdated", e), () => this.whiteboard.view.callbacks.off("onCameraUpdated", e);
+      return this.whiteboard.view.callbacks.on("onCameraUpdated", t), () => this.whiteboard.view.callbacks.off("onCameraUpdated", t);
     }), this.sideEffect.addDisposer(
-      this.box._stageRect$.subscribe((e) => {
-        const { width: t, height: s } = this.pagesSize$.value;
+      this.box._stageRect$.subscribe((t) => {
+        const { width: s, height: i } = this.pagesSize$.value;
         this.whiteboard.view.moveCameraToContain({
           originX: 0,
           originY: this.pageRenderer.pagesScrollTop,
-          width: t,
-          height: e.height / this.pageRenderer.scale,
+          width: s,
+          height: t.height / this.pageRenderer.scale,
           animationMode: "immediately"
         }), this.whiteboard.view.setCameraBound({
           damping: 1,
           maxContentMode: () => this.pageRenderer.scale,
           minContentMode: () => this.pageRenderer.scale,
-          centerX: t / 2,
-          centerY: s / 2,
-          width: t,
-          height: s
+          centerX: s / 2,
+          centerY: i / 2,
+          width: s,
+          height: i
         });
       }),
       "whiteboard-size-update"
-    ), this.sideEffect.addEventListener(
+    );
+    const e = (t) => {
+      if (!t)
+        return false;
+      const s = t.tagName;
+      return s === "INPUT" || s === "TEXTAREA" || s === "SELECT";
+    };
+    this.sideEffect.addEventListener(
       window,
       "keyup",
-      (e) => {
-        if (!(this.readonly$.value || !this.box.focus || this.box.minimized))
-          switch (e.key) {
+      (t) => {
+        if (!(this.readonly$.value || !this.box.focus || this.box.minimized || e(t.target)))
+          switch (t.key) {
             case "PageDown": {
               this.userScrollByPercent(0.8);
               break;
@@ -8996,15 +9325,15 @@ class re {
 let ae$1 = class ae {
   constructor({ readonly$: e, context: t, whiteboard: s, box: i, pages: r }) {
     this.sideEffect = new sideEffectManager.SideEffectManager(), this.context = t, this.whiteboard = s, this.box = i, this.pages = r;
-    const o2 = new valueEnhancer.Val(t.displayer.state.sceneState.index || 0);
-    this.pagesIndex$ = o2, this.sideEffect.add(() => {
+    const n = new valueEnhancer.Val(t.displayer.state.sceneState.index || 0);
+    this.pagesIndex$ = n, this.sideEffect.add(() => {
       const l = (p) => {
         this.jumpToPage(p.index);
       };
       return this.context.emitter.on("sceneStateChange", l), () => this.context.emitter.off("sceneStateChange", l);
     }), this.viewer = new T({
       readonly$: e,
-      pagesIndex$: o2,
+      pagesIndex$: n,
       previewRoot: i.$body,
       footerRoot: i.$footer,
       pages$: new valueEnhancer.Val(r),
@@ -9018,11 +9347,11 @@ let ae$1 = class ae {
       this.viewer.events.on("back", () => this.prevPage()),
       this.viewer.events.on("next", () => this.nextPage())
     ]), this.render(), this.sideEffect.addDisposer(
-      o2.subscribe((l, p) => {
-        var u, n;
+      n.subscribe((l, p) => {
+        var u, o2;
         if (e.value)
           return;
-        const a = this.context.getInitScenePath(), c = (n = (u = this.context.getScenes()) == null ? void 0 : u[l]) == null ? void 0 : n.name;
+        const a = this.context.getInitScenePath(), c = (o2 = (u = this.context.getScenes()) == null ? void 0 : u[l]) == null ? void 0 : o2.name;
         if (a && c && this.context.setScenePath(`${a}/${c}`), p) {
           const d = this.context.room;
           if (d) {
@@ -9049,7 +9378,7 @@ let ae$1 = class ae {
     this.jumpToPage(this.pagesIndex$.value - 1, true);
   }
   jumpToPage(e, t = false) {
-    this.pagesIndex$.setValue(x(e, 0, this.pages.length - 1), t);
+    this.pagesIndex$.setValue(E$1(e, 0, this.pages.length - 1), t);
   }
   render() {
     var t;
@@ -9074,8 +9403,8 @@ let ae$1 = class ae {
       var r;
       const i = this.context.room;
       if (i && i.state.memberState.currentApplianceName === "clicker") {
-        for (let o2 = s.target; o2; o2 = o2.parentElement)
-          if ((r = o2.classList) != null && r.contains("ppt-event-source"))
+        for (let n = s.target; n; n = n.parentElement)
+          if ((r = n.classList) != null && r.contains("ppt-event-source"))
             return;
         i.pptNextStep();
       }
@@ -9092,20 +9421,20 @@ const ne$1 = "DocsViewer", ue = {
     if (!t)
       throw new Error("[Docs Viewer]: scenes not found.");
     const s = new sideEffectManager.SideEffectManager(), i = t.map(
-      ({ ppt: o2 }) => o2 ? {
-        width: o2.width,
-        height: o2.height,
-        src: o2.src,
-        thumbnail: o2.previewURL
+      ({ ppt: n }) => n ? {
+        width: n.width,
+        height: n.height,
+        src: n.src,
+        thumbnail: n.previewURL
       } : null
-    ).filter((o2) => Boolean(o2));
+    ).filter((n) => Boolean(n));
     if (i.length <= 0)
       throw new Error("[Docs Viewer]: empty scenes.");
     e.mountStyles(F);
     const r = new valueEnhancer.Val(!h2.isWritable);
     s.addDisposer(
-      h2.emitter.on("writableChange", (o2) => {
-        r.setValue(!o2);
+      h2.emitter.on("writableChange", (n) => {
+        r.setValue(!n);
       })
     ), i[0].src.startsWith("ppt") ? le$1(
       s,
@@ -9133,18 +9462,18 @@ function oe$1(h2, e, t, s, i) {
       r.view.disableCameraTransform = p;
     })
   );
-  const o2 = e.createStorage("static-docs-viewer", { pagesScrollTop: 0 }), l = new re({
+  const n = e.createStorage("static-docs-viewer", { pagesScrollTop: 0 }), l = new re({
     whiteboard: r,
     readonly$: i,
     box: t,
     pages: s,
-    pagesScrollTop: o2.state.pagesScrollTop,
+    pagesScrollTop: n.state.pagesScrollTop,
     onUserScroll: (p) => {
-      e.isWritable && o2.setState({ pagesScrollTop: p });
+      e.isWritable && n.setState({ pagesScrollTop: p });
     }
   });
   h2.addDisposer(() => l.destroy()), h2.addDisposer(
-    o2.on("stateChanged", (p) => {
+    n.on("stateChanged", (p) => {
       p.pagesScrollTop && l.syncPageScrollTop(p.pagesScrollTop.newValue || 0);
     })
   ), h2.addDisposer(
@@ -9156,8 +9485,8 @@ function oe$1(h2, e, t, s, i) {
         l.pagesSize$,
         l.pageRenderer._pagesMinHeight$
       ],
-      ([p, a, c, u, n]) => p ? Math.max(
-        n / u.width * (2 / 5),
+      ([p, a, c, u, o2]) => p ? Math.max(
+        o2 / u.width * (2 / 5),
         a.height / a.width
       ) : c.height / c.width * (a.height / a.width)
     ).subscribe((p) => {
@@ -9168,20 +9497,20 @@ function oe$1(h2, e, t, s, i) {
 function le$1(h2, e, t, s, i) {
   const r = e.createWhiteBoardView();
   r.view.disableCameraTransform = true;
-  const o2 = new ae$1({
+  const n = new ae$1({
     context: e,
     whiteboard: r,
     box: t,
     pages: s,
     readonly$: i
   });
-  h2.addDisposer(() => o2.destroy());
+  h2.addDisposer(() => n.destroy());
   const l = new valueEnhancer.Val(
     { width: s[0].width, height: s[0].height },
     { compare: z$1 }
   );
   if (h2.addDisposer(
-    o2.pagesIndex$.subscribe((p) => {
+    n.pagesIndex$.subscribe((p) => {
       const a = s[p];
       a && l.setValue({ width: a.width, height: a.height });
     })
@@ -9193,7 +9522,7 @@ function le$1(h2, e, t, s, i) {
     const p = h2.add(() => {
       const a = ({ width: c, height: u }) => {
         if (s.length > 0 && t.state !== "maximized") {
-          const { width: n, height: d } = s[0], w2 = d / n * c - u;
+          const { width: o2, height: d } = s[0], w2 = d / o2 * c - u;
           w2 !== 0 && e.isWritable && e.emitter.emit("setBoxSize", {
             width: t.intrinsicWidth,
             height: t.intrinsicHeight + w2 / t.rootRect.height
@@ -9561,13 +9890,13 @@ function Ni(e) {
   return Array.isArray(e) ? e[0] : e;
 }
 function Li(e) {
-  let i, t, r, s, n, a, l, d, c, u, m, p, v, b, T2, N, x2, y, C, L, $, D2, V, re2, F2, ce, Ve, de, qe, pe, De, ue2, Re, he, Fe, se2, Be, Ue;
+  let i, t, r, s, n, a, l, d, c, u, m, p, v, b, T2, N, x, y, C, L, $, D2, V, re2, F2, ce, Ve, de, qe, pe, De, ue2, Re, he, Fe, se2, Be, Ue;
   return {
     c() {
-      i = S("svg"), t = S("symbol"), r = S("path"), s = S("path"), n = S("symbol"), a = S("path"), l = S("symbol"), d = S("path"), c = S("symbol"), u = S("path"), m = S("symbol"), p = S("path"), v = S("symbol"), b = S("path"), T2 = S("symbol"), N = S("path"), x2 = S("symbol"), y = S("path"), C = S("symbol"), L = S("path"), $ = S("symbol"), D2 = S("path"), V = S("symbol"), re2 = S("path"), F2 = S("symbol"), ce = S("path"), Ve = S("path"), de = S("symbol"), qe = S("path"), pe = S("symbol"), De = S("path"), ue2 = S("symbol"), Re = S("path"), he = S("symbol"), Fe = S("path"), se2 = S("symbol"), Be = S("path"), Ue = S("path"), g(r, "d", "M16 1H2a1 1 0 00-1 1v10a1 1 0 001 1h3v-2H3V3h12v8h-2v2h3a1 1 0 001-1V2a1 1 0 00-1-1z"), g(s, "d", "M4 17h10l-5-6z"), g(t, "id", "plyr-airplay"), g(t, "viewBox", "0 0 18 18"), g(a, "d", "M1 1c-.6 0-1 .4-1 1v11c0 .6.4 1 1 1h4.6l2.7 2.7c.2.2.4.3.7.3.3 0 .5-.1.7-.3l2.7-2.7H17c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1H1zm4.52 10.15c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41C8.47 4.96 7.46 3.76 5.5 3.76c-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69zm7.57 0c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41c-.28-1.15-1.29-2.35-3.25-2.35-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69z"), g(a, "fill-rule", "evenodd"), g(a, "fill-opacity", ".5"), g(n, "id", "plyr-captions-off"), g(n, "viewBox", "0 0 18 18"), g(d, "d", "M1 1c-.6 0-1 .4-1 1v11c0 .6.4 1 1 1h4.6l2.7 2.7c.2.2.4.3.7.3.3 0 .5-.1.7-.3l2.7-2.7H17c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1H1zm4.52 10.15c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41C8.47 4.96 7.46 3.76 5.5 3.76c-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69zm7.57 0c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41c-.28-1.15-1.29-2.35-3.25-2.35-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69z"), g(d, "fill-rule", "evenodd"), g(l, "id", "plyr-captions-on"), g(l, "viewBox", "0 0 18 18"), g(u, "d", "M9 13c.3 0 .5-.1.7-.3L15.4 7 14 5.6l-4 4V1H8v8.6l-4-4L2.6 7l5.7 5.7c.2.2.4.3.7.3zm-7 2h14v2H2z"), g(c, "id", "plyr-download"), g(c, "viewBox", "0 0 18 18"), g(p, "d", "M10 3h3.6l-4 4L11 8.4l4-4V8h2V1h-7zM7 9.6l-4 4V10H1v7h7v-2H4.4l4-4z"), g(m, "id", "plyr-enter-fullscreen"), g(m, "viewBox", "0 0 18 18"), g(b, "d", "M1 12h3.6l-4 4L2 17.4l4-4V17h2v-7H1zM16 .6l-4 4V1h-2v7h7V6h-3.6l4-4z"), g(v, "id", "plyr-exit-fullscreen"), g(v, "viewBox", "0 0 18 18"), g(N, "d", "M7.875 7.171L0 1v16l7.875-6.171V17L18 9 7.875 1z"), g(T2, "id", "plyr-fast-forward"), g(T2, "viewBox", "0 0 18 18"), g(y, "d", "M17 5.3c-.1 1.6-1.2 3.7-3.3 6.4-2.2 2.8-4 4.2-5.5 4.2-.9 0-1.7-.9-2.4-2.6C5 10.9 4.4 6 3 6c-.1 0-.5.3-1.2.8l-.8-1c.8-.7 3.5-3.4 4.7-3.5 1.2-.1 2 .7 2.3 2.5.3 2 .8 6.1 1.8 6.1.9 0 2.5-3.4 2.6-4 .1-.9-.3-1.9-2.3-1.1.8-2.6 2.3-3.8 4.5-3.8 1.7.1 2.5 1.2 2.4 3.3z"), g(x2, "id", "plyr-logo-vimeo"), g(x2, "viewBox", "0 0 18 18"), g(L, "d", "M16.8 5.8c-.2-1.3-.8-2.2-2.2-2.4C12.4 3 9 3 9 3s-3.4 0-5.6.4C2 3.6 1.3 4.5 1.2 5.8 1 7.1 1 9 1 9s0 1.9.2 3.2c.2 1.3.8 2.2 2.2 2.4C5.6 15 9 15 9 15s3.4 0 5.6-.4c1.4-.3 2-1.1 2.2-2.4.2-1.3.2-3.2.2-3.2s0-1.9-.2-3.2zM7 12V6l5 3-5 3z"), g(C, "id", "plyr-logo-youtube"), g(C, "viewBox", "0 0 18 18"), g(D2, "d", "M12.4 12.5l2.1-2.1 2.1 2.1 1.4-1.4L15.9 9 18 6.9l-1.4-1.4-2.1 2.1-2.1-2.1L11 6.9 13.1 9 11 11.1zM3.786 6.008H.714C.286 6.008 0 6.31 0 6.76v4.512c0 .452.286.752.714.752h3.072l4.071 3.858c.5.3 1.143 0 1.143-.602V2.752c0-.601-.643-.977-1.143-.601L3.786 6.008z"), g($, "id", "plyr-muted"), g($, "viewBox", "0 0 18 18"), g(re2, "d", "M6 1H3c-.6 0-1 .4-1 1v14c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zm6 0c-.6 0-1 .4-1 1v14c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1h-3z"), g(V, "id", "plyr-pause"), g(V, "viewBox", "0 0 18 18"), g(ce, "d", "M13.293 3.293L7.022 9.564l1.414 1.414 6.271-6.271L17 7V1h-6z"), g(Ve, "d", "M13 15H3V5h5V3H2a1 1 0 00-1 1v12a1 1 0 001 1h12a1 1 0 001-1v-6h-2v5z"), g(F2, "id", "plyr-pip"), g(F2, "viewBox", "0 0 18 18"), g(qe, "d", "M15.562 8.1L3.87.225c-.818-.562-1.87 0-1.87.9v15.75c0 .9 1.052 1.462 1.87.9L15.563 9.9c.584-.45.584-1.35 0-1.8z"), g(de, "id", "plyr-play"), g(de, "viewBox", "0 0 18 18"), g(De, "d", "M9.7 1.2l.7 6.4 2.1-2.1c1.9 1.9 1.9 5.1 0 7-.9 1-2.2 1.5-3.5 1.5-1.3 0-2.6-.5-3.5-1.5-1.9-1.9-1.9-5.1 0-7 .6-.6 1.4-1.1 2.3-1.3l-.6-1.9C6 2.6 4.9 3.2 4 4.1 1.3 6.8 1.3 11.2 4 14c1.3 1.3 3.1 2 4.9 2 1.9 0 3.6-.7 4.9-2 2.7-2.7 2.7-7.1 0-9.9L16 1.9l-6.3-.7z"), g(pe, "id", "plyr-restart"), g(pe, "viewBox", "0 0 18 18"), g(Re, "d", "M10.125 1L0 9l10.125 8v-6.171L18 17V1l-7.875 6.171z"), g(ue2, "id", "plyr-rewind"), g(ue2, "viewBox", "0 0 18 18"), g(Fe, "d", "M16.135 7.784a2 2 0 01-1.23-2.969c.322-.536.225-.998-.094-1.316l-.31-.31c-.318-.318-.78-.415-1.316-.094a2 2 0 01-2.969-1.23C10.065 1.258 9.669 1 9.219 1h-.438c-.45 0-.845.258-.997.865a2 2 0 01-2.969 1.23c-.536-.322-.999-.225-1.317.093l-.31.31c-.318.318-.415.781-.093 1.317a2 2 0 01-1.23 2.969C1.26 7.935 1 8.33 1 8.781v.438c0 .45.258.845.865.997a2 2 0 011.23 2.969c-.322.536-.225.998.094 1.316l.31.31c.319.319.782.415 1.316.094a2 2 0 012.969 1.23c.151.607.547.865.997.865h.438c.45 0 .845-.258.997-.865a2 2 0 012.969-1.23c.535.321.997.225 1.316-.094l.31-.31c.318-.318.415-.781.094-1.316a2 2 0 011.23-2.969c.607-.151.865-.547.865-.997v-.438c0-.451-.26-.846-.865-.997zM9 12a3 3 0 110-6 3 3 0 010 6z"), g(he, "id", "plyr-settings"), g(he, "viewBox", "0 0 18 18"), g(Be, "d", "M15.6 3.3c-.4-.4-1-.4-1.4 0-.4.4-.4 1 0 1.4C15.4 5.9 16 7.4 16 9c0 1.6-.6 3.1-1.8 4.3-.4.4-.4 1 0 1.4.2.2.5.3.7.3.3 0 .5-.1.7-.3C17.1 13.2 18 11.2 18 9s-.9-4.2-2.4-5.7z"), g(Ue, "d", "M11.282 5.282a.909.909 0 000 1.316c.735.735.995 1.458.995 2.402 0 .936-.425 1.917-.995 2.487a.909.909 0 000 1.316c.145.145.636.262 1.018.156a.725.725 0 00.298-.156C13.773 11.733 14.13 10.16 14.13 9c0-.17-.002-.34-.011-.51-.053-.992-.319-2.005-1.522-3.208a.909.909 0 00-1.316 0zm-7.496.726H.714C.286 6.008 0 6.31 0 6.76v4.512c0 .452.286.752.714.752h3.072l4.071 3.858c.5.3 1.143 0 1.143-.602V2.752c0-.601-.643-.977-1.143-.601L3.786 6.008z"), g(se2, "id", "plyr-volume"), g(se2, "viewBox", "0 0 18 18"), g(i, "xmlns", "http://www.w3.org/2000/svg"), g(i, "xmlns:xlink", "http://www.w3.org/1999/xlink");
+      i = S("svg"), t = S("symbol"), r = S("path"), s = S("path"), n = S("symbol"), a = S("path"), l = S("symbol"), d = S("path"), c = S("symbol"), u = S("path"), m = S("symbol"), p = S("path"), v = S("symbol"), b = S("path"), T2 = S("symbol"), N = S("path"), x = S("symbol"), y = S("path"), C = S("symbol"), L = S("path"), $ = S("symbol"), D2 = S("path"), V = S("symbol"), re2 = S("path"), F2 = S("symbol"), ce = S("path"), Ve = S("path"), de = S("symbol"), qe = S("path"), pe = S("symbol"), De = S("path"), ue2 = S("symbol"), Re = S("path"), he = S("symbol"), Fe = S("path"), se2 = S("symbol"), Be = S("path"), Ue = S("path"), g(r, "d", "M16 1H2a1 1 0 00-1 1v10a1 1 0 001 1h3v-2H3V3h12v8h-2v2h3a1 1 0 001-1V2a1 1 0 00-1-1z"), g(s, "d", "M4 17h10l-5-6z"), g(t, "id", "plyr-airplay"), g(t, "viewBox", "0 0 18 18"), g(a, "d", "M1 1c-.6 0-1 .4-1 1v11c0 .6.4 1 1 1h4.6l2.7 2.7c.2.2.4.3.7.3.3 0 .5-.1.7-.3l2.7-2.7H17c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1H1zm4.52 10.15c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41C8.47 4.96 7.46 3.76 5.5 3.76c-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69zm7.57 0c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41c-.28-1.15-1.29-2.35-3.25-2.35-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69z"), g(a, "fill-rule", "evenodd"), g(a, "fill-opacity", ".5"), g(n, "id", "plyr-captions-off"), g(n, "viewBox", "0 0 18 18"), g(d, "d", "M1 1c-.6 0-1 .4-1 1v11c0 .6.4 1 1 1h4.6l2.7 2.7c.2.2.4.3.7.3.3 0 .5-.1.7-.3l2.7-2.7H17c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1H1zm4.52 10.15c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41C8.47 4.96 7.46 3.76 5.5 3.76c-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69zm7.57 0c1.99 0 3.01-1.32 3.28-2.41l-1.29-.39c-.19.66-.78 1.45-1.99 1.45-1.14 0-2.2-.83-2.2-2.34 0-1.61 1.12-2.37 2.18-2.37 1.23 0 1.78.75 1.95 1.43l1.3-.41c-.28-1.15-1.29-2.35-3.25-2.35-1.9 0-3.61 1.44-3.61 3.7 0 2.26 1.65 3.69 3.63 3.69z"), g(d, "fill-rule", "evenodd"), g(l, "id", "plyr-captions-on"), g(l, "viewBox", "0 0 18 18"), g(u, "d", "M9 13c.3 0 .5-.1.7-.3L15.4 7 14 5.6l-4 4V1H8v8.6l-4-4L2.6 7l5.7 5.7c.2.2.4.3.7.3zm-7 2h14v2H2z"), g(c, "id", "plyr-download"), g(c, "viewBox", "0 0 18 18"), g(p, "d", "M10 3h3.6l-4 4L11 8.4l4-4V8h2V1h-7zM7 9.6l-4 4V10H1v7h7v-2H4.4l4-4z"), g(m, "id", "plyr-enter-fullscreen"), g(m, "viewBox", "0 0 18 18"), g(b, "d", "M1 12h3.6l-4 4L2 17.4l4-4V17h2v-7H1zM16 .6l-4 4V1h-2v7h7V6h-3.6l4-4z"), g(v, "id", "plyr-exit-fullscreen"), g(v, "viewBox", "0 0 18 18"), g(N, "d", "M7.875 7.171L0 1v16l7.875-6.171V17L18 9 7.875 1z"), g(T2, "id", "plyr-fast-forward"), g(T2, "viewBox", "0 0 18 18"), g(y, "d", "M17 5.3c-.1 1.6-1.2 3.7-3.3 6.4-2.2 2.8-4 4.2-5.5 4.2-.9 0-1.7-.9-2.4-2.6C5 10.9 4.4 6 3 6c-.1 0-.5.3-1.2.8l-.8-1c.8-.7 3.5-3.4 4.7-3.5 1.2-.1 2 .7 2.3 2.5.3 2 .8 6.1 1.8 6.1.9 0 2.5-3.4 2.6-4 .1-.9-.3-1.9-2.3-1.1.8-2.6 2.3-3.8 4.5-3.8 1.7.1 2.5 1.2 2.4 3.3z"), g(x, "id", "plyr-logo-vimeo"), g(x, "viewBox", "0 0 18 18"), g(L, "d", "M16.8 5.8c-.2-1.3-.8-2.2-2.2-2.4C12.4 3 9 3 9 3s-3.4 0-5.6.4C2 3.6 1.3 4.5 1.2 5.8 1 7.1 1 9 1 9s0 1.9.2 3.2c.2 1.3.8 2.2 2.2 2.4C5.6 15 9 15 9 15s3.4 0 5.6-.4c1.4-.3 2-1.1 2.2-2.4.2-1.3.2-3.2.2-3.2s0-1.9-.2-3.2zM7 12V6l5 3-5 3z"), g(C, "id", "plyr-logo-youtube"), g(C, "viewBox", "0 0 18 18"), g(D2, "d", "M12.4 12.5l2.1-2.1 2.1 2.1 1.4-1.4L15.9 9 18 6.9l-1.4-1.4-2.1 2.1-2.1-2.1L11 6.9 13.1 9 11 11.1zM3.786 6.008H.714C.286 6.008 0 6.31 0 6.76v4.512c0 .452.286.752.714.752h3.072l4.071 3.858c.5.3 1.143 0 1.143-.602V2.752c0-.601-.643-.977-1.143-.601L3.786 6.008z"), g($, "id", "plyr-muted"), g($, "viewBox", "0 0 18 18"), g(re2, "d", "M6 1H3c-.6 0-1 .4-1 1v14c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zm6 0c-.6 0-1 .4-1 1v14c0 .6.4 1 1 1h3c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1h-3z"), g(V, "id", "plyr-pause"), g(V, "viewBox", "0 0 18 18"), g(ce, "d", "M13.293 3.293L7.022 9.564l1.414 1.414 6.271-6.271L17 7V1h-6z"), g(Ve, "d", "M13 15H3V5h5V3H2a1 1 0 00-1 1v12a1 1 0 001 1h12a1 1 0 001-1v-6h-2v5z"), g(F2, "id", "plyr-pip"), g(F2, "viewBox", "0 0 18 18"), g(qe, "d", "M15.562 8.1L3.87.225c-.818-.562-1.87 0-1.87.9v15.75c0 .9 1.052 1.462 1.87.9L15.563 9.9c.584-.45.584-1.35 0-1.8z"), g(de, "id", "plyr-play"), g(de, "viewBox", "0 0 18 18"), g(De, "d", "M9.7 1.2l.7 6.4 2.1-2.1c1.9 1.9 1.9 5.1 0 7-.9 1-2.2 1.5-3.5 1.5-1.3 0-2.6-.5-3.5-1.5-1.9-1.9-1.9-5.1 0-7 .6-.6 1.4-1.1 2.3-1.3l-.6-1.9C6 2.6 4.9 3.2 4 4.1 1.3 6.8 1.3 11.2 4 14c1.3 1.3 3.1 2 4.9 2 1.9 0 3.6-.7 4.9-2 2.7-2.7 2.7-7.1 0-9.9L16 1.9l-6.3-.7z"), g(pe, "id", "plyr-restart"), g(pe, "viewBox", "0 0 18 18"), g(Re, "d", "M10.125 1L0 9l10.125 8v-6.171L18 17V1l-7.875 6.171z"), g(ue2, "id", "plyr-rewind"), g(ue2, "viewBox", "0 0 18 18"), g(Fe, "d", "M16.135 7.784a2 2 0 01-1.23-2.969c.322-.536.225-.998-.094-1.316l-.31-.31c-.318-.318-.78-.415-1.316-.094a2 2 0 01-2.969-1.23C10.065 1.258 9.669 1 9.219 1h-.438c-.45 0-.845.258-.997.865a2 2 0 01-2.969 1.23c-.536-.322-.999-.225-1.317.093l-.31.31c-.318.318-.415.781-.093 1.317a2 2 0 01-1.23 2.969C1.26 7.935 1 8.33 1 8.781v.438c0 .45.258.845.865.997a2 2 0 011.23 2.969c-.322.536-.225.998.094 1.316l.31.31c.319.319.782.415 1.316.094a2 2 0 012.969 1.23c.151.607.547.865.997.865h.438c.45 0 .845-.258.997-.865a2 2 0 012.969-1.23c.535.321.997.225 1.316-.094l.31-.31c.318-.318.415-.781.094-1.316a2 2 0 011.23-2.969c.607-.151.865-.547.865-.997v-.438c0-.451-.26-.846-.865-.997zM9 12a3 3 0 110-6 3 3 0 010 6z"), g(he, "id", "plyr-settings"), g(he, "viewBox", "0 0 18 18"), g(Be, "d", "M15.6 3.3c-.4-.4-1-.4-1.4 0-.4.4-.4 1 0 1.4C15.4 5.9 16 7.4 16 9c0 1.6-.6 3.1-1.8 4.3-.4.4-.4 1 0 1.4.2.2.5.3.7.3.3 0 .5-.1.7-.3C17.1 13.2 18 11.2 18 9s-.9-4.2-2.4-5.7z"), g(Ue, "d", "M11.282 5.282a.909.909 0 000 1.316c.735.735.995 1.458.995 2.402 0 .936-.425 1.917-.995 2.487a.909.909 0 000 1.316c.145.145.636.262 1.018.156a.725.725 0 00.298-.156C13.773 11.733 14.13 10.16 14.13 9c0-.17-.002-.34-.011-.51-.053-.992-.319-2.005-1.522-3.208a.909.909 0 00-1.316 0zm-7.496.726H.714C.286 6.008 0 6.31 0 6.76v4.512c0 .452.286.752.714.752h3.072l4.071 3.858c.5.3 1.143 0 1.143-.602V2.752c0-.601-.643-.977-1.143-.601L3.786 6.008z"), g(se2, "id", "plyr-volume"), g(se2, "viewBox", "0 0 18 18"), g(i, "xmlns", "http://www.w3.org/2000/svg"), g(i, "xmlns:xlink", "http://www.w3.org/1999/xlink");
     },
     m(We, ni) {
-      te2(We, i, ni), k(i, t), k(t, r), k(t, s), k(i, n), k(n, a), k(i, l), k(l, d), k(i, c), k(c, u), k(i, m), k(m, p), k(i, v), k(v, b), k(i, T2), k(T2, N), k(i, x2), k(x2, y), k(i, C), k(C, L), k(i, $), k($, D2), k(i, V), k(V, re2), k(i, F2), k(F2, ce), k(F2, Ve), k(i, de), k(de, qe), k(i, pe), k(pe, De), k(i, ue2), k(ue2, Re), k(i, he), k(he, Fe), k(i, se2), k(se2, Be), k(se2, Ue);
+      te2(We, i, ni), k(i, t), k(t, r), k(t, s), k(i, n), k(n, a), k(i, l), k(l, d), k(i, c), k(c, u), k(i, m), k(m, p), k(i, v), k(v, b), k(i, T2), k(T2, N), k(i, x), k(x, y), k(i, C), k(C, L), k(i, $), k($, D2), k(i, V), k(V, re2), k(i, F2), k(F2, ce), k(F2, Ve), k(i, de), k(de, qe), k(i, pe), k(pe, De), k(i, ue2), k(ue2, Re), k(i, he), k(he, Fe), k(i, se2), k(se2, Be), k(se2, Ue);
     },
     p: X,
     i: X,
@@ -10451,19 +10780,19 @@ const h = { getIconUrl() {
       const p = _("div", z({}, u, { class: `${u.class} plyr__menu`.trim(), hidden: "" }));
       p.appendChild(t.call(this, "settings", { "aria-haspopup": true, "aria-controls": `plyr-settings-${e.id}`, "aria-expanded": false }));
       const v = _("div", { class: "plyr__menu__container", id: `plyr-settings-${e.id}`, hidden: "" }), b = _("div"), T2 = _("div", { id: `plyr-settings-${e.id}-home` }), N = _("div", { role: "menu" });
-      T2.appendChild(N), b.appendChild(T2), this.elements.settings.panels.home = T2, this.config.settings.forEach((x2) => {
+      T2.appendChild(N), b.appendChild(T2), this.elements.settings.panels.home = T2, this.config.settings.forEach((x) => {
         const y = _("button", z(B(this.config.selectors.buttons.settings), { type: "button", class: `${this.config.classNames.control} ${this.config.classNames.control}--forward`, role: "menuitem", "aria-haspopup": true, hidden: "" }));
-        i.call(this, y, x2), E.call(this, y, "click", () => {
-          d.call(this, x2, false);
+        i.call(this, y, x), E.call(this, y, "click", () => {
+          d.call(this, x, false);
         });
-        const C = _("span", null, j.get(x2, this.config)), L = _("span", { class: this.config.classNames.menu.value });
-        L.innerHTML = e[x2], C.appendChild(L), y.appendChild(C), N.appendChild(y);
-        const $ = _("div", { id: `plyr-settings-${e.id}-${x2}`, hidden: "" }), D2 = _("button", { type: "button", class: `${this.config.classNames.control} ${this.config.classNames.control}--back` });
-        D2.appendChild(_("span", { "aria-hidden": true }, j.get(x2, this.config))), D2.appendChild(_("span", { class: this.config.classNames.hidden }, j.get("menuBack", this.config))), E.call(this, $, "keydown", (V) => {
+        const C = _("span", null, j.get(x, this.config)), L = _("span", { class: this.config.classNames.menu.value });
+        L.innerHTML = e[x], C.appendChild(L), y.appendChild(C), N.appendChild(y);
+        const $ = _("div", { id: `plyr-settings-${e.id}-${x}`, hidden: "" }), D2 = _("button", { type: "button", class: `${this.config.classNames.control} ${this.config.classNames.control}--back` });
+        D2.appendChild(_("span", { "aria-hidden": true }, j.get(x, this.config))), D2.appendChild(_("span", { class: this.config.classNames.hidden }, j.get("menuBack", this.config))), E.call(this, $, "keydown", (V) => {
           V.key === "ArrowLeft" && (V.preventDefault(), V.stopPropagation(), d.call(this, "home", true));
         }, false), E.call(this, D2, "click", () => {
           d.call(this, "home", false);
-        }), $.appendChild(D2), $.appendChild(_("div", { role: "menu" })), b.appendChild($), this.elements.settings.buttons[x2] = y, this.elements.settings.panels[x2] = $;
+        }), $.appendChild(D2), $.appendChild(_("div", { role: "menu" })), b.appendChild($), this.elements.settings.buttons[x] = y, this.elements.settings.panels[x] = $;
       }), v.appendChild(b), p.appendChild(v), c.appendChild(p), this.elements.settings.popup = v, this.elements.settings.menu = p;
     }
     if (m === "pip" && I.pip && c.appendChild(t.call(this, "pip", u)), m === "airplay" && I.airplay && c.appendChild(t.call(this, "airplay", u)), m === "download") {
@@ -11047,9 +11376,9 @@ var kr = xr(function(e, i) {
     }, r = {}, s = {}, n = {};
     function a(p, v) {
       p = p.push ? p : [p];
-      var b, T2, N, x2 = [], y = p.length, C = y;
+      var b, T2, N, x = [], y = p.length, C = y;
       for (b = function(L, $) {
-        $.length && x2.push(L), --C || v(x2);
+        $.length && x.push(L), --C || v(x);
       }; y--; )
         T2 = p[y], (N = s[T2]) ? b(T2, N) : (n[T2] = n[T2] || []).push(b);
     }
@@ -11065,32 +11394,32 @@ var kr = xr(function(e, i) {
       p.call && (p = { success: p }), v.length ? (p.error || t)(v) : (p.success || t)(p);
     }
     function c(p, v, b, T2) {
-      var N, x2, y = document, C = b.async, L = (b.numRetries || 0) + 1, $ = b.before || t, D2 = p.replace(/[\?|#].*$/, ""), V = p.replace(/^(css|img)!/, "");
-      T2 = T2 || 0, /(^css!|\.css$)/.test(D2) ? ((x2 = y.createElement("link")).rel = "stylesheet", x2.href = V, (N = "hideFocus" in x2) && x2.relList && (N = 0, x2.rel = "preload", x2.as = "style")) : /(^img!|\.(png|gif|jpg|svg|webp)$)/.test(D2) ? (x2 = y.createElement("img")).src = V : ((x2 = y.createElement("script")).src = p, x2.async = C === void 0 || C), x2.onload = x2.onerror = x2.onbeforeload = function(re2) {
+      var N, x, y = document, C = b.async, L = (b.numRetries || 0) + 1, $ = b.before || t, D2 = p.replace(/[\?|#].*$/, ""), V = p.replace(/^(css|img)!/, "");
+      T2 = T2 || 0, /(^css!|\.css$)/.test(D2) ? ((x = y.createElement("link")).rel = "stylesheet", x.href = V, (N = "hideFocus" in x) && x.relList && (N = 0, x.rel = "preload", x.as = "style")) : /(^img!|\.(png|gif|jpg|svg|webp)$)/.test(D2) ? (x = y.createElement("img")).src = V : ((x = y.createElement("script")).src = p, x.async = C === void 0 || C), x.onload = x.onerror = x.onbeforeload = function(re2) {
         var F2 = re2.type[0];
         if (N)
           try {
-            x2.sheet.cssText.length || (F2 = "e");
+            x.sheet.cssText.length || (F2 = "e");
           } catch (ce) {
             ce.code != 18 && (F2 = "e");
           }
         if (F2 == "e") {
           if ((T2 += 1) < L)
             return c(p, v, b, T2);
-        } else if (x2.rel == "preload" && x2.as == "style")
-          return x2.rel = "stylesheet";
+        } else if (x.rel == "preload" && x.as == "style")
+          return x.rel = "stylesheet";
         v(p, F2, re2.defaultPrevented);
-      }, $(p, x2) !== false && y.head.appendChild(x2);
+      }, $(p, x) !== false && y.head.appendChild(x);
     }
     function u(p, v, b) {
-      var T2, N, x2 = (p = p.push ? p : [p]).length, y = x2, C = [];
+      var T2, N, x = (p = p.push ? p : [p]).length, y = x, C = [];
       for (T2 = function(L, $, D2) {
         if ($ == "e" && C.push(L), $ == "b") {
           if (!D2)
             return;
           C.push(L);
         }
-        --x2 || v(C);
+        --x || v(C);
       }, N = 0; N < y; N++)
         c(p[N], T2, b);
     }
@@ -11101,14 +11430,14 @@ var kr = xr(function(e, i) {
           throw "LoadJS";
         r[T2] = true;
       }
-      function x2(y, C) {
+      function x(y, C) {
         u(p, function(L) {
           d(N, L), y && d({ success: y, error: C }, L), l(T2, L);
         }, N);
       }
       if (N.returnPromise)
-        return new Promise(x2);
-      x2();
+        return new Promise(x);
+      x();
     }
     return m.ready = function(p, v) {
       return a(p, function(b) {
@@ -11191,11 +11520,11 @@ const nt = { setup() {
       T2 = C, w.call(e, e.media, "volumechange");
     });
   } });
-  let N, { loop: x2 } = e.config;
-  Object.defineProperty(e.media, "loop", { get: () => x2, set(y) {
+  let N, { loop: x } = e.config;
+  Object.defineProperty(e.media, "loop", { get: () => x, set(y) {
     const C = o.boolean(y) ? y : e.config.loop.active;
     e.embed.setLoop(C).then(() => {
-      x2 = C;
+      x = C;
     });
   } }), e.embed.getVideoUrl().then((y) => {
     N = y, h.setDownloadUrl.call(e);
@@ -12322,8 +12651,8 @@ const reconnectRefresher = new ReconnectRefresher({ emitter });
 const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
   constructor(context) {
     super(context);
-    this.version = "1.0.0-canary.76";
-    this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.4.0", "@netless/synced-store": "^2.0.7", "@netless/telebox-insider": "1.0.0-alpha.37", "emittery": "^0.11.0", "jspdf": "^2.5.1", "lodash": "^4.17.21", "p-retry": "^5.1.2", "side-effect-manager": "^1.2.1", "uuid": "^9.0.0", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "1.0.0-canary.5", "@netless/app-plyr": "^0.2.4", "@playwright/test": "^1.28.1", "@rollup/plugin-commonjs": "^23.0.4", "@rollup/plugin-node-resolve": "^15.0.1", "@rollup/plugin-url": "^8.0.1", "@sveltejs/vite-plugin-svelte": "^2.0.2", "@tsconfig/svelte": "^3.0.0", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.6", "@types/node": "^18.0.3", "@types/uuid": "^9.0.0", "@typescript-eslint/eslint-plugin": "^5.46.1", "@typescript-eslint/parser": "^5.46.1", "@vitest/ui": "^0.25.7", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^8.29.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^4.0.0", "jsdom": "^19.0.0", "less": "^4.1.3", "prettier": "^2.8.1", "prettier-plugin-svelte": "^2.9.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^4.0.0", "svelte": "^3.54.0", "typescript": "^4.9.4", "vite": "^4.0.3", "vite-plugin-dts": "^1.7.1", "vitest": "^0.25.7", "white-web-sdk": "^2.16.40" } };
+    this.version = "1.0.0-canary.78";
+    this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.4.0", "@netless/synced-store": "^2.0.7", "@netless/telebox-insider": "1.0.0-alpha.37", "emittery": "^0.11.0", "jspdf": "^2.5.1", "lodash": "^4.17.21", "p-retry": "^5.1.2", "side-effect-manager": "^1.2.1", "uuid": "^9.0.0", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "1.0.0-canary.6", "@netless/app-plyr": "^0.2.4", "@playwright/test": "^1.33.0", "@rollup/plugin-commonjs": "^24.1.0", "@rollup/plugin-node-resolve": "^15.0.2", "@rollup/plugin-url": "^8.0.1", "@sveltejs/vite-plugin-svelte": "^2.2.0", "@tsconfig/svelte": "^4.0.1", "@types/debug": "^4.1.7", "@types/node": "^18.0.3", "@types/lodash": "^4.14.194", "@types/lodash-es": "^4.17.7", "@types/uuid": "^9.0.1", "@typescript-eslint/eslint-plugin": "^5.59.5", "@typescript-eslint/parser": "^5.59.5", "@vitest/ui": "^0.31.0", "cypress": "^12.12.0", "dotenv": "^16.0.3", "eslint": "^8.40.0", "eslint-config-prettier": "^8.8.0", "eslint-plugin-svelte3": "^4.0.0", "jsdom": "^22.0.0", "less": "^4.1.3", "prettier": "^2.8.8", "prettier-plugin-svelte": "^2.10.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^4.0.0", "svelte": "^3.59.1", "typescript": "^5.0.4", "vite": "^4.3.5", "vite-plugin-dts": "^2.3.0", "vitest": "^0.31.0", "white-web-sdk": "^2.16.42" } };
     this.emitter = callbacks;
     this.viewMode$ = new valueEnhancer.Val(whiteWebSdk.ViewMode.Broadcaster);
     this.playground$ = new valueEnhancer.Val(void 0);
@@ -12339,7 +12668,7 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
       (_b = this.appManager) == null ? void 0 : _b.dispatchInternalEvent(Events.MoveCamera, camera);
     };
     _WindowManager.displayer = context.displayer;
-    window.NETLESS_DEPS = { "dependencies": { "@juggle/resize-observer": "^3.4.0", "@netless/synced-store": "^2.0.7", "@netless/telebox-insider": "1.0.0-alpha.37", "emittery": "^0.11.0", "jspdf": "^2.5.1", "lodash": "^4.17.21", "p-retry": "^5.1.2", "side-effect-manager": "^1.2.1", "uuid": "^9.0.0", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "1.0.0-canary.5", "@netless/app-plyr": "^0.2.4", "@playwright/test": "^1.28.1", "@rollup/plugin-commonjs": "^23.0.4", "@rollup/plugin-node-resolve": "^15.0.1", "@rollup/plugin-url": "^8.0.1", "@sveltejs/vite-plugin-svelte": "^2.0.2", "@tsconfig/svelte": "^3.0.0", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.6", "@types/node": "^18.0.3", "@types/uuid": "^9.0.0", "@typescript-eslint/eslint-plugin": "^5.46.1", "@typescript-eslint/parser": "^5.46.1", "@vitest/ui": "^0.25.7", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^8.29.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^4.0.0", "jsdom": "^19.0.0", "less": "^4.1.3", "prettier": "^2.8.1", "prettier-plugin-svelte": "^2.9.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^4.0.0", "svelte": "^3.54.0", "typescript": "^4.9.4", "vite": "^4.0.3", "vite-plugin-dts": "^1.7.1", "vitest": "^0.25.7", "white-web-sdk": "^2.16.40" } };
+    window.NETLESS_DEPS = { "dependencies": { "@juggle/resize-observer": "^3.4.0", "@netless/synced-store": "^2.0.7", "@netless/telebox-insider": "1.0.0-alpha.37", "emittery": "^0.11.0", "jspdf": "^2.5.1", "lodash": "^4.17.21", "p-retry": "^5.1.2", "side-effect-manager": "^1.2.1", "uuid": "^9.0.0", "value-enhancer": "^1.3.2" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "1.0.0-canary.6", "@netless/app-plyr": "^0.2.4", "@playwright/test": "^1.33.0", "@rollup/plugin-commonjs": "^24.1.0", "@rollup/plugin-node-resolve": "^15.0.2", "@rollup/plugin-url": "^8.0.1", "@sveltejs/vite-plugin-svelte": "^2.2.0", "@tsconfig/svelte": "^4.0.1", "@types/debug": "^4.1.7", "@types/node": "^18.0.3", "@types/lodash": "^4.14.194", "@types/lodash-es": "^4.17.7", "@types/uuid": "^9.0.1", "@typescript-eslint/eslint-plugin": "^5.59.5", "@typescript-eslint/parser": "^5.59.5", "@vitest/ui": "^0.31.0", "cypress": "^12.12.0", "dotenv": "^16.0.3", "eslint": "^8.40.0", "eslint-config-prettier": "^8.8.0", "eslint-plugin-svelte3": "^4.0.0", "jsdom": "^22.0.0", "less": "^4.1.3", "prettier": "^2.8.8", "prettier-plugin-svelte": "^2.10.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^4.0.0", "svelte": "^3.59.1", "typescript": "^5.0.4", "vite": "^4.3.5", "vite-plugin-dts": "^2.3.0", "vitest": "^0.31.0", "white-web-sdk": "^2.16.42" } };
   }
   static async mount(params) {
     var _a;
@@ -12504,12 +12833,21 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
       }
     }
   }
+  /**
+   * 注册插件
+   */
   static register(params) {
     return appRegister.register(params);
   }
+  /**
+   * 注销插件
+   */
   static unregister(kind) {
     return appRegister.unregister(kind);
   }
+  /**
+   * 创建一个 app 至白板
+   */
   async addApp(params) {
     if (this.appManager) {
       if (this.appManager.rootDirRemoving) {
@@ -12596,11 +12934,17 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
     }
     return isDynamicPPT;
   }
+  /**
+   * 设置 mainView 的 ScenePath, 并且切换白板为可写状态
+   */
   async setMainViewScenePath(scenePath) {
     if (this.appManager) {
       await this.appManager.setMainViewScenePath(scenePath);
     }
   }
+  /**
+   * 设置 mainView 的 SceneIndex, 并且切换白板为可写状态
+   */
   async setMainViewSceneIndex(index2) {
     if (this.appManager) {
       await this.appManager.setMainViewSceneIndex(index2);
@@ -12656,6 +13000,11 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
       }
     }
   }
+  /**
+   * 删除一页
+   * 默认删除当前页, 可以删除指定 index 页
+   * 最低保留一页
+   */
   async removePage(index2) {
     if (this.appManager) {
       const needRemoveIndex = index2 === void 0 ? this.pageState.index : index2;
@@ -12672,27 +13021,45 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
       return false;
     }
   }
+  /**
+   * 返回 mainView 的 ScenePath
+   */
   getMainViewScenePath() {
     var _a;
     return (_a = this.appManager) == null ? void 0 : _a.store.getMainViewScenePath();
   }
+  /**
+   * 返回 mainView 的 SceneIndex
+   */
   getMainViewSceneIndex() {
     var _a;
     return (_a = this.appManager) == null ? void 0 : _a.store.getMainViewSceneIndex();
   }
+  /**
+   * 设置所有 app 的 readonly 模式
+   */
   setReadonly(readonly) {
     var _a;
     this.readonly = readonly;
     (_a = this.boxManager) == null ? void 0 : _a.setReadonly(readonly);
     emitter.emit("setReadonly", readonly);
   }
+  /**
+   * 切换 mainView 为可写
+   */
   switchMainViewToWriter() {
     var _a;
     return (_a = this.appManager) == null ? void 0 : _a.mainViewProxy.mainViewClickHandler();
   }
+  /**
+   * app destroy 回调
+   */
   onAppDestroy(kind, listener) {
     addEmitterOnceListener(`destroy-${kind}`, listener);
   }
+  /**
+   * 设置 ViewMode
+   */
   setViewMode(mode) {
     var _a;
     log("setViewMode", mode);
@@ -12870,14 +13237,23 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
     }
     return this.boxManager.teleBoxManager;
   }
+  /**
+   * 查询所有的 App
+   */
   queryAll() {
     var _a;
     return Array.from(((_a = this.appManager) == null ? void 0 : _a.appProxies.values()) || []);
   }
+  /**
+   * 查询单个 App
+   */
   queryOne(appId) {
     var _a;
     return (_a = this.appManager) == null ? void 0 : _a.appProxies.get(appId);
   }
+  /**
+   * 关闭 APP
+   */
   async closeApp(appId) {
     var _a;
     return (_a = this.appManager) == null ? void 0 : _a.closeApp(appId);
@@ -12974,9 +13350,9 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
     var _a;
     (_a = this.focusedView) == null ? void 0 : _a.duplicate();
   }
-  insertText(x2, y, text2) {
+  insertText(x, y, text2) {
     var _a;
-    return ((_a = this.focusedView) == null ? void 0 : _a.insertText(x2, y, text2)) || "";
+    return ((_a = this.focusedView) == null ? void 0 : _a.insertText(x, y, text2)) || "";
   }
   insertImage(info) {
     var _a;
@@ -12999,6 +13375,7 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
     this._refresh();
     (_a = this.appManager) == null ? void 0 : _a.dispatchInternalEvent(Events.Refresh);
   }
+  /** @inner */
   _refresh() {
     var _a, _b;
     (_a = this.appManager) == null ? void 0 : _a.mainViewProxy.rebind();
@@ -13036,6 +13413,9 @@ const _WindowManager = class extends whiteWebSdk.InvisiblePlugin {
       });
     }, 500);
   }
+  /**
+   * 切换 focus 到指定的 app, 并且把这个 app 放到最前面
+   */
   focusApp(appId) {
     var _a, _b, _c;
     const box = (_a = this.boxManager) == null ? void 0 : _a.getBox(appId);