@nine-lab/nine-mu 0.1.41 → 0.1.43

package/package.json

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

package/src/components/NineChat.js

@@ -141,8 +141,16 @@ export class NineChat extends HTMLElement {
         this.#diffPopup = this.shadowRoot.querySelector('nine-diff-popup');
     }
 
-    showDiff = (data) => {
-        this.#diffPopup.popup(data);
+    /**
+     * 소스 비교 팝업을 띄우고 사용자의 최종 확정 본을 반환합니다.
+     * @param {Object} params - { asis, tobe, lang }
+     * @returns {Promise<string|null>} - 확정 시 소스코드, 취소 시 null
+     */
+    showDiff = async ({ asis, tobe, lang }) => {
+        // NineDiffPopup에 만들어둔 .wait() 또는 .open()을 연동
+        return await this.#diffPopup.popup()
+            .data(asis, tobe, lang)
+            .wait(); // 사용자가 버튼을 누를 때까지 여기서 await 걸림
     }
 }
 

package/src/components/NineDiff.js

@@ -238,6 +238,17 @@ export class NineDiff extends HTMLElement {
 	};
 
 	#initCodeMirror = () => {
+
+		let asisReady = false;
+		let tobeReady = false;
+
+		const checkAllReady = () => {
+			if (asisReady && tobeReady) {
+				// 진짜로 둘 다 화면에 그려졌을 때 신호를 보냄
+				this.dispatchEvent(new CustomEvent('ready', { bubbles: true, composed: true }));
+			}
+		};
+
 		this.#asisEditorEl = this.shadowRoot.querySelector('.panel.asis');
 		this.#tobeEditorEl = this.shadowRoot.querySelector('.panel.tobe');
 
@@ -285,6 +296,8 @@ export class NineDiff extends HTMLElement {
 						if (update.view.contentDOM.firstChild && !update.view._initialAsisContentLoaded) {
 							update.view._initialAsisContentLoaded = true;
 							trace.log("CodeMirror ASIS view is ready for initial content.");
+							asisReady = true;
+							checkAllReady(); // ASIS 준비 완료
 						}
 					})
 				]
@@ -305,6 +318,8 @@ export class NineDiff extends HTMLElement {
 						if (update.view.contentDOM.firstChild && !update.view._initialTobeContentLoaded) {
 							update.view._initialTobeContentLoaded = true;
 							trace.log("CodeMirror TOBE view is ready for initial content.");
+							tobeReady = true;
+							checkAllReady(); // ASIS 준비 완료
 						}
 					})
 				]

package/src/components/NineDiffPopup.js

@@ -44,11 +44,13 @@ export class NineDiffPopup extends HTMLElement {
         this.shadowRoot.querySelector('.btn-cancel').onclick = () => this.#handleCancel();
     }
 
-    async popup(data) {
+    /**
+    async popup1(data) {
         return new Promise((resolve) => {
             this.#resolve = resolve;
             this.#asisBackup = data?.asis || "";
 
+
             // 💡 에디터가 준비되었다는 신호를 받으면 데이터 주입
             this.#diffView.addEventListener('ready', () => {
                 trace.log("NineDiff is Ready! Injecting data...");
@@ -63,8 +65,49 @@ export class NineDiffPopup extends HTMLElement {
 
             this.#dialog.showModal();
         });
+    } */
+
+    popup() {
+        // 초기화
+        this.#dialog.showModal();
+
+        return this;
     }
 
+    async data(asis, tobe, lang = "javascript") {
+        let finalAsis = asis;
+
+        // 1. 약속된 접두어 감지 (url: 또는 file:)
+        const isRemote = typeof asis === 'string' && (asis.startsWith('url:') || asis.startsWith('file:'));
+
+        if (isRemote) {
+            // 접두어를 제거하고 실제 경로만 추출
+            const targetUrl = asis.replace(/^(url:|file:)/, '');
+
+            try {
+                trace.log(`📡 원격 소스 로드 시도: ${targetUrl}`);
+                const res = await fetch(targetUrl);
+                if (!res.ok) throw new Error(`HTTP error! status: ${res.status}`);
+                finalAsis = await res.text();
+            } catch (e) {
+                trace.error(`파일 로드 실패 [${targetUrl}]:`, e);
+                finalAsis = `// 파일을 불러오는데 실패했습니다.\n// 경로: ${targetUrl}`;
+            }
+        }
+
+        // 2. 에디터 준비 대기 및 초기화
+        this.#asisBackup = finalAsis;
+        this.#diffView.addEventListener('ready', () => {
+            const asisStr = typeof finalAsis === 'object' ? JSON.stringify(finalAsis, null, 2) : finalAsis;
+            const tobeStr = typeof tobe === 'object' ? JSON.stringify(tobe, null, 2) : tobe;
+
+            this.#diffView.initialize(asisStr, tobeStr, lang);
+        }, { once: true });
+
+        return this;
+    }
+
+
     #handleConfirm() {
         // 에디터에서 직접 콘텐츠 추출
         const finalContent = this.#diffView ? this.#diffView.getContents() : this.#asisBackup;