@nine-lab/nine-mu 0.1.227 → 0.1.228

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nine-lab/nine-mu",
-  "version": "0.1.227",
+  "version": "0.1.228",
   "description": "AI-Driven Full-Stack Code Fabrication Engine",
   "type": "module",
   "main": "./dist/nine-mu.umd.js",

package/src/components/NineChat.js

@@ -8,7 +8,6 @@ import { WebSocketClientTransport } from "@modelcontextprotocol/sdk/client/webso
 export class NineChat extends HTMLElement {
     #service = null;
     #routes = [];
-    #diffPopup;
     #packageName;
     #routesPath;
     #connectorUrl;
@@ -185,10 +184,9 @@ export class NineChat extends HTMLElement {
                 </div>
             </div>
             <div class="expand-icon"></div>
-            <nine-diff-popup></nine-diff-popup>
         `;
 
-        this.#diffPopup = this.shadowRoot.querySelector('nine-diff-popup');
+        //this.#diffPopup = this.shadowRoot.querySelector('nine-diff-popup');
 
         this.#$nineChatMessage = this.shadowRoot.querySelector("nine-chat-message");
     }
@@ -241,7 +239,22 @@ export class NineChat extends HTMLElement {
     }
 
     #showDiff = (asis, tobe, lang) => {
-        this.#diffPopup.popup().data(asis, tobe, lang);
+        // 1. 혹시 잔상이 남아있을지 모르니 기존에 생성된 팝업이 있다면 강제 제거
+        const oldPopup = this.shadowRoot.querySelector('nine-diff-popup');
+        if (oldPopup) {
+            oldPopup.remove();
+        }
+
+        // 2. 동적으로 커스텀 엘리먼트 생성
+        const $diffPopup = document.createElement('nine-diff-popup');
+
+        // 3. 래퍼(wrapper) 안이나 shadowRoot 제일 밑바닥에 부착
+        const container = this.shadowRoot.querySelector('.wrapper') || this.shadowRoot;
+        container.appendChild($diffPopup);
+
+        // 4. 데이터 주입 및 팝업 실행
+        // 💡 팝업이 네이티브 <dialog> 기반이라면 .popup() 내부에서 showModal()이 실행될 겁니다.
+        $diffPopup.popup().data(asis, tobe, lang);
     }
 }
 

package/src/components/NineChatManager.js

@@ -41,7 +41,7 @@ export class NineChatManager {
             }
         });
 
-        trace.log(this.#mcpClient);
+        //trace.log(this.#mcpClient);
 
         this.#mcpClient.connect(transport, {timeout: 300000})
             .then( async () => {