@netless/window-manager 0.3.16-canary.2 → 0.3.17-canary.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/window-manager",
-  "version": "0.3.16-canary.2",
+  "version": "0.3.17-canary.1",
   "description": "",
   "main": "dist/index.es.js",
   "module": "dist/index.es.js",
@@ -22,9 +22,9 @@
   },
   "dependencies": {
     "@juggle/resize-observer": "^3.3.1",
-    "@netless/app-docs-viewer": "0.1.24",
+    "@netless/app-docs-viewer": "0.1.26",
     "@netless/app-media-player": "0.1.0-beta.5",
-    "@netless/telebox-insider": "0.2.10",
+    "@netless/telebox-insider": "^0.2.16",
     "emittery": "^0.9.2",
     "lodash": "^4.17.21",
     "p-retry": "^4.6.1",

package/src/AppManager.ts

@@ -100,7 +100,7 @@ export class AppManager {
                 if (this.boxManager.minimized !== minimized) {
                     if (minimized === true && this.store.focus !== undefined) {
                         this.store.cleanFocus();
-                        this.boxManager.blurFocusBox();
+                        this.boxManager.blurAllBox();
                     }
                     this.boxManager.setMinimized(Boolean(minimized));
                 }
@@ -208,6 +208,7 @@ export class AppManager {
                 x: box?.intrinsicX,
                 y: box?.intrinsicY,
             });
+            this.store.updateAppState(appProxy.id, AppAttributes.ZIndex, box.zIndex);
         }
         if (this.boxManager.minimized) {
             this.boxManager.setMinimized(false, false);

package/src/AppProxy.ts

@@ -172,6 +172,7 @@ export class AppProxy extends Base {
                 app,
                 options,
                 canOperate: this.manager.canOperate,
+                smartPosition: this.isAddApp,
             });
         } catch (error: any) {
             console.error(error);
@@ -247,7 +248,8 @@ export class AppProxy extends Base {
         const sceneIndex = attrs?.[AppAttributes.SceneIndex];
         const maximized = this.attributes?.["maximized"];
         const minimized = this.attributes?.["minimized"];
-        let payload = { maximized, minimized } as AppInitState;
+        const zIndex = attrs?.zIndex;
+        let payload = { maximized, minimized, zIndex } as AppInitState;
         if (position) {
             payload = { ...payload, id: id, x: position.x, y: position.y };
         }

package/src/AttributesDelegate.ts

@@ -74,8 +74,8 @@ export class AttributesDelegate {
         this.manager.safeUpdateAttributes([Fields.Apps, id, Fields.State], {
             [AppAttributes.Size]: {},
             [AppAttributes.Position]: {},
-            [AppAttributes.SnapshotRect]: {},
             [AppAttributes.SceneIndex]: 0,
+            [AppAttributes.ZIndex]: 100,
         });
     }
 

package/src/Base/Context.ts

@@ -31,7 +31,7 @@ export class Context {
     }
 
     public blurFocusBox() {
-        this.manager.boxManager.blurFocusBox();
+        this.manager.boxManager.blurAllBox();
     }
 
     public switchAppToWriter(id: string) {

package/src/BoxManager.ts

@@ -1,6 +1,6 @@
 import { callbacks, emitter, WindowManager } from "./index";
 import { debounce, maxBy } from "lodash";
-import { DEFAULT_COLLECTOR_STYLE, Events, MIN_HEIGHT, MIN_WIDTH } from "./constants";
+import { AppAttributes, DEFAULT_COLLECTOR_STYLE, Events, MIN_HEIGHT, MIN_WIDTH } from "./constants";
 import {
     TELE_BOX_MANAGER_EVENT,
     TELE_BOX_STATE,
@@ -29,6 +29,7 @@ export type CreateBoxParams = {
     emitter?: Emittery;
     options?: AddAppOptions;
     canOperate?: boolean;
+    smartPosition?: boolean;
 };
 
 type AppId = { appId: string };
@@ -95,10 +96,8 @@ export class BoxManager {
                 if (this.manager.canOperate) {
                     emitter.emit("focus", { appId: box.id });
                 } else {
-                    this.teleBoxManager.update(box.id, { focus: false });
+                    this.teleBoxManager.blurBox(box.id);
                 }
-            } else {
-                this.blurFocusBox();
             }
         });
         this.teleBoxManager.events.on("dark_mode", darkMode => {
@@ -107,6 +106,9 @@ export class BoxManager {
         this.teleBoxManager.events.on("prefers_color_scheme", colorScheme => {
             callbacks.emit("prefersColorSchemeChange", colorScheme);
         });
+        this.teleBoxManager.events.on("z_index", box => {
+            this.manager.store.updateAppState(box.id, AppAttributes.ZIndex, box.zIndex);
+        });
     }
 
     public get boxState() {
@@ -152,7 +154,7 @@ export class BoxManager {
             height,
             id: params.appId,
         };
-        this.teleBoxManager.create(createBoxConfig);
+        this.teleBoxManager.create(createBoxConfig, params.smartPosition);
         emitter.emit(`${params.appId}${Events.WindowCreated}` as any);
     }
 
@@ -239,6 +241,7 @@ export class BoxManager {
                     y: state.y,
                     width: state.width || 0.5,
                     height: state.height || 0.5,
+                    zIndex: state.zIndex,
                 },
                 true
             );
@@ -248,7 +251,7 @@ export class BoxManager {
             }
             setTimeout(() => {
                 if (state.focus) {
-                    this.teleBoxManager.update(box.id, { focus: true }, true);
+                    this.teleBoxManager.focusBox(box.id, true)
                 }
             }, 50);
             callbacks.emit("boxStateChange", this.teleBoxManager.state);
@@ -268,8 +271,8 @@ export class BoxManager {
         this.teleBoxManager.update(appId, { x, y }, true);
     }
 
-    public focusBox({ appId }: AppId): void {
-        this.teleBoxManager.update(appId, { focus: true }, true);
+    public focusBox({ appId }: AppId, skipUpdate = true): void {
+        this.teleBoxManager.focusBox(appId, skipUpdate);
     }
 
     public resizeBox({ appId, width, height, skipUpdate }: ResizeBoxParams): void {
@@ -292,15 +295,7 @@ export class BoxManager {
     }
 
     public blurAllBox(): void {
-        this.teleBoxManager.updateAll({ focus: false });
-    }
-
-    public blurFocusBox(): void {
-        const focusBoxes = this.teleBoxManager.query({ focus: true });
-        if (focusBoxes.length) {
-            const box = focusBoxes[0];
-            this.teleBoxManager.update(box.id, { focus: false });
-        }
+        this.teleBoxManager.blurAll();
     }
 
     public updateAll(config: TeleBoxManagerUpdateConfig): void {
@@ -315,6 +310,16 @@ export class BoxManager {
         this.teleBoxManager.setMinimized(minimized, skipUpdate);
     }
 
+    public focusTopBox(): void {
+        const boxes = this.teleBoxManager.query();
+        if (boxes.length >= 1) {
+            const box = this.getTopBox();
+            if (box) {
+                this.focusBox({ appId: box.id }, false);
+            }
+        }
+    }
+
     public setReadonly(readonly: boolean) {
         this.teleBoxManager.setReadonly(readonly);
     }

package/src/constants.ts

@@ -17,8 +17,8 @@ export const MagixEventName = "__WindowManger";
 export enum AppAttributes {
     Size = "size",
     Position = "position",
-    SnapshotRect = "SnapshotRect",
     SceneIndex = "SceneIndex",
+    ZIndex = "zIndex",
 }
 
 export enum AppEvents {

package/src/index.ts

@@ -121,6 +121,7 @@ export type AppInitState = {
     minimized?: boolean;
     sceneIndex?: number;
     boxState?: TeleBoxState; // 兼容旧版 telebox
+    zIndex?: number;
 };
 
 export type EmitterEvent = {
@@ -176,7 +177,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
     public static containerSizeRatio = DEFAULT_CONTAINER_RATIO;
     private static isCreated = false;
 
-    public version = "0.3.16-canary.2";
+    public version = "0.3.17-canary.1";
 
     public appListeners?: AppListeners;