@netless/telebox-insider 0.3.1-beta.0 → 0.3.2-beta.0

package/dist/index.d.ts

@@ -483,7 +483,7 @@ interface TeleTitleBar {
     setTitle(title: string): void;
     setState(state: TeleBoxState): void;
     setReadonly(readonly: boolean): void;
-    setForceMaximized(forceMaximized: boolean): void;
+    setForceMaximized?(forceMaximized: boolean): void;
     render(): HTMLElement;
     destroy(): void;
     setBoxStatus(boxStatus?: TeleBoxState): void;
@@ -949,6 +949,7 @@ declare class TeleBoxManager {
     get darkMode(): boolean;
     _state$: Val<TeleBoxState, boolean>;
     get state(): TeleBoxState;
+    setUseBoxesStatus(useBoxesStatus: boolean): void;
     /** @deprecated use setMaximized and setMinimized instead */
     setState(state: TeleBoxState, skipUpdate?: boolean): this;
     setBoxStatus(boxId: string, boxStatus?: TeleBoxState, skipUpdate?: boolean): void;
@@ -994,7 +995,13 @@ declare class TeleBoxManager {
     removeAll(skipUpdate?: boolean): ReadonlyTeleBox[];
     destroy(skipUpdate?: boolean): void;
     wrapClassName(className: string): string;
+    private lazyFocusRequestHandler?;
+    private closeRequestHandler?;
+    private committedFocusDepth;
+    setLazyFocusRequestHandler(handler?: (boxId: string) => boolean): void;
+    setCloseRequestHandler(handler?: (boxId: string) => boolean): void;
     focusBox(boxOrID: string | TeleBox, skipUpdate?: boolean): void;
+    focusBoxCommitted(boxOrID: string | TeleBox, skipUpdate?: boolean): void;
     focusTopBox(): void;
     blurBox(boxOrID: string | TeleBox, skipUpdate?: boolean): void;
     blurAll(skipUpdate?: boolean): void;

package/dist/telebox-insider.cjs.js

@@ -1674,7 +1674,10 @@ class TeleBox {
         this.events.emit(TELE_BOX_EVENT.Minimized, minimized2);
       }
     });
-    const maximized$ = createVal(maximized);
+    const maximized$ = createVal(
+      maximized || forceMaximized,
+      (next, previous) => next === previous || forceMaximized$.value && !next
+    );
     maximized$.reaction((maximized2, _, skipUpdate) => {
       if (!skipUpdate) {
         this.events.emit(TELE_BOX_EVENT.Maximized, maximized2);
@@ -1852,7 +1855,10 @@ class TeleBox {
       this.titleBar.setReadonly(readonly2);
     });
     forceMaximized$.reaction((forceMaximized2) => {
-      this.titleBar.setForceMaximized(forceMaximized2);
+      var _a, _b;
+      if (forceMaximized2)
+        maximized$.setValue(true);
+      (_b = (_a = this.titleBar).setForceMaximized) == null ? void 0 : _b.call(_a, forceMaximized2);
     });
     boxStatus$.reaction((boxStatus2) => {
       this.titleBar.setBoxStatus(boxStatus2);
@@ -3052,6 +3058,7 @@ class TeleBoxManager {
     useBoxesStatus = false
   } = {}) {
     this.events = new EventEmitter();
+    this.committedFocusDepth = 0;
     this._sideEffect = new o();
     this.useBoxesStatus = useBoxesStatus;
     const { combine, createVal } = c(this._sideEffect);
@@ -3119,14 +3126,19 @@ class TeleBoxManager {
       this.boxes.forEach((box) => box.setReadonly(readonly2, skipUpdate));
     });
     const minimized$ = createVal(minimized);
-    const maximized$ = createVal(maximized);
     const forceMaximized$ = createVal(forceMaximized);
+    const maximized$ = createVal(
+      maximized || forceMaximized,
+      (next, previous) => next === previous || forceMaximized$.value && !next
+    );
     forceMaximized$.reaction((forceMaximized2, _, skipUpdate) => {
-      var _a;
+      var _a, _b;
+      if (forceMaximized2)
+        maximized$.setValue(true, skipUpdate);
       this.boxes.forEach(
         (box) => box.setForceMaximized(forceMaximized2, skipUpdate)
       );
-      (_a = this.maxTitleBar) == null ? void 0 : _a.setForceMaximized(forceMaximized2);
+      (_b = (_a = this.maxTitleBar) == null ? void 0 : _a.setForceMaximized) == null ? void 0 : _b.call(_a, forceMaximized2);
     });
     maximized$.reaction((maximized2, _, skipUpdate) => {
       this.boxes.forEach(
@@ -3242,7 +3254,7 @@ class TeleBoxManager {
     });
     const closeBtnClassName = this.wrapClassName("titlebar-icon-close");
     const checkFocusBox = (ev) => {
-      var _a;
+      var _a, _b;
       if (readonly$.value) {
         return;
       }
@@ -3258,6 +3270,8 @@ class TeleBoxManager {
         if (id) {
           const box = this.getBox(id);
           if (box) {
+            if ((_b = this.lazyFocusRequestHandler) == null ? void 0 : _b.call(this, box.id))
+              return;
             if (!this.useBoxesStatus) {
               this.makeBoxTop(box);
             } else {
@@ -3286,7 +3300,7 @@ class TeleBoxManager {
                 this.makeMaximizedTopBoxFocus();
               }
             }
-            this.focusBox(box);
+            this.focusBoxCommitted(box);
             return;
           }
         }
@@ -3316,6 +3330,7 @@ class TeleBoxManager {
         return this.boxesStatus$;
       },
       onEvent: (event) => {
+        var _a;
         switch (event.type) {
           case TELE_BOX_DELEGATE_EVENT.Maximize: {
             if (forceMaximized$.value && this.state === TELE_BOX_STATE.Maximized) {
@@ -3382,13 +3397,16 @@ class TeleBoxManager {
             break;
           }
           case TELE_BOX_EVENT.Close: {
+            const targetBox = this.hasBoxesStatus() ? this.maxTitleBar.focusedBox || this.getMaximizedTopBox() : this.topBox;
+            if (targetBox && ((_a = this.closeRequestHandler) == null ? void 0 : _a.call(this, targetBox.id)))
+              break;
             if (this.hasBoxesStatus()) {
-              let targetBox = this.maxTitleBar.focusedBox;
-              if (!targetBox) {
-                targetBox = this.getMaximizedTopBox();
+              let targetBox2 = this.maxTitleBar.focusedBox;
+              if (!targetBox2) {
+                targetBox2 = this.getMaximizedTopBox();
               }
-              if (targetBox == null ? void 0 : targetBox.id) {
-                const box = this.getBox(targetBox.id);
+              if (targetBox2 == null ? void 0 : targetBox2.id) {
+                const box = this.getBox(targetBox2.id);
                 if (box) {
                   let isFocusChanged = false;
                   if (box.focus) {
@@ -3466,6 +3484,23 @@ class TeleBoxManager {
   get state() {
     return this._state$.value;
   }
+  setUseBoxesStatus(useBoxesStatus) {
+    var _a, _b;
+    if (this.useBoxesStatus === useBoxesStatus)
+      return;
+    this.useBoxesStatus = useBoxesStatus;
+    this.boxes.forEach(
+      (box) => box.setBoxStatus(useBoxesStatus ? this.boxesStatus$.get(box.id) : void 0, true)
+    );
+    this.boxes$.setValue([...this.boxes]);
+    if (useBoxesStatus) {
+      this.appMenu || (this.appMenu = this.createMinimizedAppMenu());
+      this.effectBoxStatusChange();
+    } else {
+      (_a = this.appMenu) == null ? void 0 : _a.render(/* @__PURE__ */ new Map());
+      (_b = this.collector) == null ? void 0 : _b.setVisible(false);
+    }
+  }
   setState(state, skipUpdate = false) {
     if (state === TELE_BOX_STATE.Normal && this.forceMaximized) {
       return this;
@@ -3807,6 +3842,7 @@ class TeleBoxManager {
     const box = new TeleBox({
       zIndex: config.forceTop ? this.getMaxForceTopBoxZIndex() + 1 : this.getMaxNormalBoxZIndex() + 1,
       ...smartPosition ? this.smartPosition(config) : config,
+      ...!this.useBoxesStatus ? { boxStatus: void 0, lastNotMinimizedBoxStatus: void 0 } : {},
       darkMode: this.darkMode,
       prefersColorScheme: this.prefersColorScheme,
       maximized: this.maximized,
@@ -3897,6 +3933,9 @@ class TeleBoxManager {
       }
     });
     box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Close, () => {
+      var _a;
+      if ((_a = this.closeRequestHandler) == null ? void 0 : _a.call(this, box.id))
+        return;
       if (this.useBoxesStatus && box.focus) {
         this.blurBox(box);
       }
@@ -4060,9 +4099,18 @@ class TeleBoxManager {
   wrapClassName(className) {
     return `${this.namespace}-${className}`;
   }
+  setLazyFocusRequestHandler(handler) {
+    this.lazyFocusRequestHandler = handler;
+  }
+  setCloseRequestHandler(handler) {
+    this.closeRequestHandler = handler;
+  }
   focusBox(boxOrID, skipUpdate = false) {
+    var _a;
     const targetBox = this.getBox(boxOrID);
     if (targetBox) {
+      if (!skipUpdate && !this.committedFocusDepth && ((_a = this.lazyFocusRequestHandler) == null ? void 0 : _a.call(this, targetBox.id)))
+        return;
       this.boxes.forEach((box) => {
         if (targetBox === box) {
           let focusChanged = false;
@@ -4087,6 +4135,15 @@ class TeleBoxManager {
       }
     }
   }
+  focusBoxCommitted(boxOrID, skipUpdate = false) {
+    var _a;
+    this.committedFocusDepth = ((_a = this.committedFocusDepth) != null ? _a : 0) + 1;
+    try {
+      this.focusBox(boxOrID, skipUpdate);
+    } finally {
+      this.committedFocusDepth -= 1;
+    }
+  }
   focusTopBox() {
     if (this.topBox && !this.topBox.focus) {
       return this.focusBox(this.topBox);