From 013bcf9ae9e5a03ff148a2eb3997862645e97c81 Mon Sep 17 00:00:00 2001
From: xiange <xiangetg@msn.cn>
Date: Sun, 17 Mar 2024 20:25:00 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20fix:=20flyout=20can=20not=20disp?=
 =?UTF-8?q?lay?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/chili-ui/src/viewport/viewport.ts | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/chili-ui/src/viewport/viewport.ts b/packages/chili-ui/src/viewport/viewport.ts
index 23c95430..06f21b03 100644
--- a/packages/chili-ui/src/viewport/viewport.ts
+++ b/packages/chili-ui/src/viewport/viewport.ts
@@ -1,28 +1,28 @@
 // Copyright 2022-2023 the Chili authors. All rights reserved. AGPL-3.0 license.
 
-import { IView } from "chili-core";
+import { IView, PubSub } from "chili-core";
 import { Flyout } from "../components";
 
 export class Viewport extends HTMLElement {
-    private _flyout?: Flyout;
+    private _flyout: Flyout;
     private readonly _eventCaches: [keyof HTMLElementEventMap, (e: any) => void][] = [];
 
     constructor(readonly view: IView) {
         super();
         this.initEvent();
+        this._flyout = new Flyout();
         view.onPropertyChanged(this._onViewClosed);
         this.addEventListener("mousemove", this._handleFlyoutMove);
+        PubSub.default.sub("activeViewChanged", this._onActiveViewChanged);
     }
 
-    setActive(actived: boolean) {
-        this._flyout?.remove();
-        this._flyout = undefined;
-
-        if (actived) {
-            this._flyout = new Flyout();
+    private _onActiveViewChanged = (view: IView | undefined) => {
+        if (view === this.view) {
             document.body.appendChild(this._flyout);
+        } else {
+            this._flyout.remove();
         }
-    }
+    };
 
     private _handleFlyoutMove(e: MouseEvent) {
         if (this._flyout) {
@@ -40,6 +40,8 @@ export class Viewport extends HTMLElement {
 
     dispose() {
         this.removeEvents();
+        this.removeEventListener("mousemove", this._handleFlyoutMove);
+        PubSub.default.remove("activeViewChanged", this._onActiveViewChanged);
     }
 
     private initEvent() {