@nine-lab/nine-mu 0.1.45 → 0.1.47

package/package.json

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

package/src/components/NineDiffPopup.js

@@ -24,49 +24,26 @@ export class NineDiffPopup extends HTMLElement {
                 ${customImport}
             </style>
             
-            <nx-dialog>
+            <nine-dialog>
                 <div class="main-layout">
                     <div class="diff-area">
-                        <nine-diff id="editor"></nine-diff>
+                        <nine-diff></nine-diff>
                     </div>
                     <div class="footer">
                         <button class="btn btn-cancel">취소</button>
                         <button class="btn btn-confirm">최종 확정 및 저장</button>
                     </div>
                 </div>
-            </nx-dialog>
+            </nine-dialog>
         `;
 
-        this.#dialog = this.shadowRoot.querySelector('nx-dialog');
-        this.#diffView = this.shadowRoot.querySelector('#editor');
+        this.#dialog = this.shadowRoot.querySelector('nine-dialog');
+        this.#diffView = this.shadowRoot.querySelector('nine-diff');
 
         this.shadowRoot.querySelector('.btn-confirm').onclick = () => this.#handleConfirm();
         this.shadowRoot.querySelector('.btn-cancel').onclick = () => this.#handleCancel();
     }
 
-    /**
-    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...");
-
-                const asisStr = typeof data.asis === 'object' ? JSON.stringify(data.asis, null, 2) : data.asis;
-                const tobeStr = typeof data.tobe === 'object' ? JSON.stringify(data.tobe, null, 2) : data.tobe;
-
-                trace.log(asisStr, tobeStr);
-
-                this.#diffView.initialize(asisStr, tobeStr, data.lang);
-            }, { once: true }); // 딱 한 번만 실행
-
-            this.#dialog.showModal();
-        });
-    } */
-
     popup() {
         // 초기화
         this.#dialog.showModal();
@@ -74,32 +51,41 @@ export class NineDiffPopup extends HTMLElement {
         return this;
     }
 
+    /**
+     * @param {string|object} asis - 소스 텍스트 또는 url:/file: 경로
+     * @param {string|object} tobe - 소스 텍스트 또는 url:/file: 경로
+     * @param {string} lang - 언어 설정
+     */
     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}`;
+        // 1. 데이터를 읽어오는 공통 로직 (내부 헬퍼)
+        const loadSource = async (src) => {
+            if (typeof src === 'string' && (src.startsWith('url:') || src.startsWith('file:'))) {
+                const targetUrl = src.replace(/^(url:|file:)/, '');
+                try {
+                    trace.log(`📡 리모트 로드: ${targetUrl}`);
+                    const res = await fetch(targetUrl);
+                    if (!res.ok) throw new Error(`Status: ${res.status}`);
+                    return await res.text();
+                } catch (e) {
+                    trace.error(`로드 실패 [${targetUrl}]:`, e);
+                    return `// 로드 실패: ${targetUrl}\n${e.message}`;
+                }
             }
-        }
+            return src;
+        };
+
+        // 2. asis, tobe 둘 다 비동기로 병렬 로드
+        const [finalAsis, finalTobe] = await Promise.all([
+            loadSource(asis),
+            loadSource(tobe)
+        ]);
 
-        // 2. 에디터 준비 대기 및 초기화
         this.#asisBackup = finalAsis;
+
+        // 3. 에디터 준비 시 데이터 주입
         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;
+            const tobeStr = typeof finalTobe === 'object' ? JSON.stringify(finalTobe, null, 2) : finalTobe;
 
             this.#diffView.initialize(asisStr, tobeStr, lang);
         }, { once: true });