@mindexec/cli 0.2.27 → 0.2.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindexec/cli",
-  "version": "0.2.27",
+  "version": "0.2.29",
   "description": "MindExec local runtime and bridge CLI",
   "main": "server.js",
   "type": "module",

package/wwwroot/_content/MindExecution.Shared/js/mind-map-core.js

@@ -5,7 +5,7 @@
     const DEBUG = false;
     const FPS_DEBUG = false;
     const FRAME_PERF_DEBUG = false;
-    const MINDMAP_CORE_BUILD_ID = '20260613-cursor-blink-v206';
+    const MINDMAP_CORE_BUILD_ID = '20260613-dom-cursor-v207';
     const CanvasPhase = Object.freeze({
         Booting: 'booting',
         BoardFileLoading: 'board-file-loading',
@@ -83,7 +83,7 @@
     const PASSIVE_OVERLAY_INTERACTIVE_DENSE_VISIBLE_THRESHOLD = 40;
     const PASSIVE_OVERLAY_IDLE_DELAY_MS = 500;
     const PASSIVE_OVERLAY_PAN_IDLE_DELAY_MS = 500;
-    const CURSOR_BLINK_INTERVAL_MS = 500;
+    const CURSOR_DOM_BLINK_DURATION_MS = 1000;
     const HOME_CAMERA_NORMAL_MID_Z = 8250;
     const HOME_DENSE_CLUSTER_MIN_CELL_SIZE = 1200;
     const HOME_DENSE_CLUSTER_MAX_CELL_SIZE = 3600;
@@ -235,6 +235,111 @@
         });
     }
 
+    let cursorDomStyleInstalled = false;
+
+    function ensureCursorDomStyle() {
+        if (cursorDomStyleInstalled || typeof document === 'undefined') {
+            return;
+        }
+
+        if (document.getElementById('mind-map-cursor-dom-style')) {
+            cursorDomStyleInstalled = true;
+            return;
+        }
+
+        const style = document.createElement('style');
+        style.id = 'mind-map-cursor-dom-style';
+        style.textContent = `
+@keyframes mindMapCursorDomBlink {
+    0%, 49% { opacity: 1; }
+    50%, 100% { opacity: 0; }
+}
+.mind-map-cursor-dom {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 20px;
+    height: 20px;
+    box-sizing: border-box;
+    border-top: 4px solid #000;
+    border-left: 4px solid #000;
+    pointer-events: none;
+    z-index: 2147483000;
+    animation: mindMapCursorDomBlink ${CURSOR_DOM_BLINK_DURATION_MS}ms steps(1, end) infinite;
+    will-change: transform;
+    contain: layout style paint;
+}
+`;
+        document.head?.appendChild(style);
+        cursorDomStyleInstalled = true;
+    }
+
+    function ensureCursorDomElement(module) {
+        if (!module?.container || typeof document === 'undefined') {
+            return null;
+        }
+
+        ensureCursorDomStyle();
+
+        if (module.cursorDomElement?.isConnected) {
+            return module.cursorDomElement;
+        }
+
+        const element = document.createElement('div');
+        element.className = 'mind-map-cursor-dom';
+        element.setAttribute('aria-hidden', 'true');
+        module.container.appendChild(element);
+        module.cursorDomElement = element;
+        module._lastCursorDomPositionKey = '';
+        return element;
+    }
+
+    function updateCursorDomElement(module) {
+        if (!module?.container || !module.camera || !module.cursorPosition) {
+            return false;
+        }
+
+        const element = ensureCursorDomElement(module);
+        if (!element) {
+            return false;
+        }
+
+        const width = Math.max(1, Number(module.container.clientWidth || 0));
+        const height = Math.max(1, Number(module.container.clientHeight || 0));
+        const camera = module.camera;
+        const cursor = module.cursorPosition;
+        const vfov = (camera.fov * Math.PI) / 180;
+        const viewHeight = 2 * Math.tan(vfov / 2) * camera.position.z;
+        const viewWidth = viewHeight * camera.aspect;
+        const ndcX = ((cursor.x - camera.position.x) * 2) / viewWidth;
+        const ndcY = ((cursor.y - camera.position.y) * 2) / viewHeight;
+        const x = ((ndcX + 1) / 2) * width;
+        const y = ((1 - ndcY) / 2) * height;
+        const visible = ndcX >= -1.1 && ndcX <= 1.1 && ndcY >= -1.1 && ndcY <= 1.1;
+        const positionKey = `${visible ? 1 : 0}|${Math.round(x)}|${Math.round(y)}|${width}|${height}`;
+
+        if (positionKey === module._lastCursorDomPositionKey) {
+            return false;
+        }
+
+        module._lastCursorDomPositionKey = positionKey;
+        element.style.display = visible ? 'block' : 'none';
+        if (visible) {
+            element.style.transform = `translate3d(${x.toFixed(2)}px, ${y.toFixed(2)}px, 0)`;
+        }
+        return true;
+    }
+
+    function removeCursorDomElement(module) {
+        if (module?.cursorDomElement) {
+            module.cursorDomElement.remove();
+            module.cursorDomElement = null;
+        }
+        if (module) {
+            module._lastCursorDomPositionKey = '';
+        }
+    }
+
     function shouldYieldWorkSlice(sliceStartedAt, processedCount, budgetMs, minItems, maxItems) {
         if (processedCount < minItems) {
             return false;
@@ -2498,8 +2603,8 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
             this.cursorMesh = null;
             this.cursorMaterial = null;
             this.cursorLineMaterial = null;
-            this._cursorBlinkVisible = true;
-            this._lastCursorBlinkAt = 0;
+            this.cursorDomElement = null;
+            this._lastCursorDomPositionKey = '';
             this._viewStatePersistTimer = null;
             this._pendingViewStateSnapshot = null;
             this._pendingViewStateKey = null;
@@ -3006,6 +3111,8 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
                     this.container = target;
                     this.dotNetHelper = helper;
                     window.dotNetHelper = helper; // Expose globally for NativeDropHandler access
+                    ensureCursorDomElement(this);
+                    updateCursorDomElement(this);
                     if (this.useTextOverlayV2 && window.MindMapTextOverlayV2?.init) {
                         window.MindMapTextOverlayV2.init(this);
                     }
@@ -3081,19 +3188,19 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
             const thickness = 4;   // Cursor thickness
 
             // Mesh material (background / thickness)
-            this.cursorMaterial = new THREE.MeshBasicMaterial({
-                color: 0xffffff,
-                transparent: true,
-                opacity: 1.0,
-                depthTest: false
-            });
-
-            // Line material (centerline)
-            this.cursorLineMaterial = new THREE.LineBasicMaterial({
-                color: 0xffffff,
-                transparent: false,
-                opacity: 1,
-                depthTest: false
+            this.cursorMaterial = new THREE.MeshBasicMaterial({
+                color: 0x000000,
+                transparent: true,
+                opacity: 1.0,
+                depthTest: false
+            });
+
+            // Line material (centerline)
+            this.cursorLineMaterial = new THREE.LineBasicMaterial({
+                color: 0x000000,
+                transparent: false,
+                opacity: 1,
+                depthTest: false
             });
 
             // Mesh geometry (vertical/horizontal bars)
@@ -3120,9 +3227,10 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
             line.position.z = 0; // [Fix] Z=0 for parallax elimination
             line.renderOrder = 9999;
             this.cursorMesh.add(line);
-
-            this.cursorMesh.position.set(0, 0, 0); // [Fix] Z=0 for parallax elimination
-            this.cursorMesh.renderOrder = 9999;
+
+            this.cursorMesh.position.set(0, 0, 0); // [Fix] Z=0 for parallax elimination
+            this.cursorMesh.renderOrder = 9999;
+            this.cursorMesh.visible = false;
             this.scene.add(this.cursorMesh);
 
             if (this.updateCursorPosition) {
@@ -3229,7 +3337,10 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
             }
 
             // 4. [중요] 강제 리사이즈 호출 (초기화 시점의 0x0 사이즈 보정)
-            setTimeout(() => {
+            ensureCursorDomElement(this);
+            updateCursorDomElement(this);
+
+            setTimeout(() => {
                 if (this && this.onWindowResize) {
                     console.log("[Init] Forcing resize to fix 0 height issue");
                     this.onWindowResize();
@@ -5062,41 +5173,9 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
                     allowAnimation: shouldAnimateImageStatusTextures
                 });
 
-                // 5. Cursor Animation
+                // 5. Cursor DOM position
                 // ----------------------------------------------------------------
-                let cursorAnimatedThisFrame = false;
-                let cursorBlinkWakeDelayMs = Number.POSITIVE_INFINITY;
-                const hasCursorBlinkTarget = !!(this.cursorMesh && this.cursorMaterial);
-                if (hasCursorBlinkTarget) {
-                    if (this.cursorMesh.visible !== (this._cursorBlinkVisible === true)) {
-                        this.cursorMesh.visible = this._cursorBlinkVisible === true;
-                        cursorAnimatedThisFrame = true;
-                    }
-
-                    const previousBlinkAt = Number(this._lastCursorBlinkAt || 0);
-                    if (!Number.isFinite(previousBlinkAt) || previousBlinkAt <= 0) {
-                        this._lastCursorBlinkAt = frameStart;
-                        this._cursorBlinkVisible = true;
-                        if (this.cursorMesh.visible !== true) {
-                            this.cursorMesh.visible = true;
-                            cursorAnimatedThisFrame = true;
-                        }
-                    } else {
-                        const elapsedBlinkMs = Math.max(0, frameStart - previousBlinkAt);
-                        if (elapsedBlinkMs >= CURSOR_BLINK_INTERVAL_MS) {
-                            const elapsedBlinkSteps = Math.max(1, Math.floor(elapsedBlinkMs / CURSOR_BLINK_INTERVAL_MS));
-                            if ((elapsedBlinkSteps % 2) === 1) {
-                                this._cursorBlinkVisible = this._cursorBlinkVisible !== true;
-                            }
-                            this._lastCursorBlinkAt = previousBlinkAt + (elapsedBlinkSteps * CURSOR_BLINK_INTERVAL_MS);
-                            this.cursorMesh.visible = this._cursorBlinkVisible === true;
-                            cursorAnimatedThisFrame = true;
-                        }
-                    }
-
-                    const nextBlinkInMs = CURSOR_BLINK_INTERVAL_MS - Math.max(0, frameStart - Number(this._lastCursorBlinkAt || frameStart));
-                    cursorBlinkWakeDelayMs = Math.max(1, Math.min(CURSOR_BLINK_INTERVAL_MS, Math.ceil(nextBlinkInMs)));
-                }
+                updateCursorDomElement(this);
 
                 // 6. Theme Animation
                 // ----------------------------------------------------------------
@@ -5145,21 +5224,13 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
                 // 7. Render
                 // ----------------------------------------------------------------
                 _profileSection('css3dSync');
-                const hasContinuousThemeAnimationFrame =
-                    allowContinuousThemeAnimationThisFrame === true &&
-                    (
-                        shouldForceGpuParticleAnimation === true ||
-                        (isThemeAnimationEnabled === true && isContinuousTheme === true)
-                    );
                 const shouldRenderWebglFrame =
                     isWebglRenderEnabled &&
                     (
                         isBoardLoading === true ||
                         shouldUpdate === true ||
                         isInteractiveFrame === true ||
-                        themeAnimatedThisFrame === true ||
-                        cursorAnimatedThisFrame === true ||
-                        hasContinuousThemeAnimationFrame === true
+                        themeAnimatedThisFrame === true
                     );
                 if (shouldRenderWebglFrame) {
                     this.renderer.render(this.scene, this.camera);
@@ -5488,38 +5559,17 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
                     isInteractiveFrame !== true &&
                     shouldUpdate !== true &&
                     themeAnimatedThisFrame !== true &&
-                    cursorAnimatedThisFrame !== true &&
                     shouldRenderWebglFrame !== true &&
                     shouldRenderCss3dFrame !== true &&
                     shouldSyncTextOverlays !== true &&
                     hasPendingAnimationWakeWork !== true;
                 if (shouldParkIdleAnimationLoop) {
-                    if (hasCursorBlinkTarget) {
-                        nextAnimationLoopDelayMs = cursorBlinkWakeDelayMs;
-                        this._lastAnimationLoopDelayMs = nextAnimationLoopDelayMs;
-                        this._animationLoopExecuting = false;
-                        this._scheduleAnimationLoop(loop, nextAnimationLoopDelayMs);
-                        return;
-                    }
-
                     this._lastAnimationLoopDelayMs = -1;
                     this._animationLoopExecuting = false;
                     return;
                 }
 
-                const shouldDelayAfterCursorOnlyFrame =
-                    cursorAnimatedThisFrame === true &&
-                    shouldCaptureFramePerf !== true &&
-                    isBoardLoading !== true &&
-                    isInteractiveFrame !== true &&
-                    shouldUpdate !== true &&
-                    themeAnimatedThisFrame !== true &&
-                    hasContinuousThemeAnimationFrame !== true &&
-                    shouldRenderCss3dFrame !== true &&
-                    shouldSyncTextOverlays !== true &&
-                    hasPendingAnimationWakeWork !== true &&
-                    hasCursorBlinkTarget === true;
-                nextAnimationLoopDelayMs = shouldDelayAfterCursorOnlyFrame ? cursorBlinkWakeDelayMs : 0;
+                nextAnimationLoopDelayMs = 0;
                 this._lastAnimationLoopDelayMs = nextAnimationLoopDelayMs;
                 this._animationLoopExecuting = false;
                 this._scheduleAnimationLoop(loop, nextAnimationLoopDelayMs);
@@ -5658,8 +5708,9 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
 
             this.cursorPosition.set(snappedX, snappedY, 0);
             if (this.cursorMesh) {
-                this.cursorMesh.position.set(snappedX, snappedY, 0); // [Fix] Z=0 for parallax elimination
-            }
+                this.cursorMesh.position.set(snappedX, snappedY, 0); // [Fix] Z=0 for parallax elimination
+            }
+            updateCursorDomElement(this);
 
             if (moveCamera) {
                 let targetCenterX = snappedX;
@@ -5788,6 +5839,7 @@ ${summaryLines.map(line => `<div>${escapeNodeFrameDebugHtml(line)}</div>`).join(
         cleanupAndDispose() {
             if (!this.container) return;
             this.pauseAnimationLoop();
+            removeCursorDomElement(this);
             if (this._viewStatePersistTimer) {
                 clearTimeout(this._viewStatePersistTimer);
                 this._viewStatePersistTimer = null;

package/wwwroot/_content/MindExecution.Shared/js/mind-map-css3d-manager.js

@@ -12208,6 +12208,83 @@
         return item;
     }
 
+    function createRemoteFleetStatusRail(items) {
+        const rail = document.createElement('aside');
+        rail.dataset.remoteFleetStatusRail = 'true';
+        rail.style.cssText = `
+            flex: 0 0 auto;
+            align-self: flex-start;
+            display: flex;
+            flex-direction: column;
+            gap: 3px;
+            min-width: 132px;
+            max-width: min(100%, 176px);
+            padding: 5px 6px;
+            border-radius: 7px;
+            border: 1px solid rgba(148, 163, 184, 0.22);
+            background: rgba(255, 255, 255, 0.70);
+        `;
+
+        (items || []).forEach(item => {
+            const tone = String(item?.tone || 'default');
+            const row = document.createElement('div');
+            row.dataset.remoteFleetStatusItem = item?.key || '';
+            row.style.cssText = `
+                display: grid;
+                grid-template-columns: 7px minmax(0, 1fr) auto;
+                align-items: center;
+                gap: 5px;
+                min-height: 16px;
+                min-width: 0;
+            `;
+
+            const dot = document.createElement('span');
+            dot.style.cssText = `
+                width: 7px;
+                height: 7px;
+                border-radius: 999px;
+                background: ${tone === 'online' ? '#10b981' : tone === 'warn' ? '#f59e0b' : '#94a3b8'};
+                box-shadow: ${tone === 'online' ? '0 0 0 3px rgba(16, 185, 129, 0.12)' : 'none'};
+            `;
+
+            const labelEl = document.createElement('span');
+            labelEl.textContent = item?.label || '';
+            labelEl.style.cssText = `
+                color: #64748b;
+                font-size: 9px;
+                font-weight: 850;
+                line-height: 1;
+                letter-spacing: 0;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                text-transform: uppercase;
+            `;
+
+            const valueEl = document.createElement('strong');
+            valueEl.textContent = item?.value || '';
+            valueEl.title = `${labelEl.textContent} ${valueEl.textContent}`.trim();
+            valueEl.style.cssText = `
+                color: ${tone === 'online' ? '#047857' : '#0f172a'};
+                font-size: 10px;
+                font-weight: 950;
+                line-height: 1;
+                letter-spacing: 0;
+                max-width: 76px;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            `;
+
+            row.appendChild(dot);
+            row.appendChild(labelEl);
+            row.appendChild(valueEl);
+            rail.appendChild(row);
+        });
+
+        return rail;
+    }
+
     function createRemoteFleetButton(label, title, action) {
         const button = document.createElement('button');
         button.type = 'button';
@@ -13306,18 +13383,32 @@
         }
         attachRemoteFleetTitleActions(bodyView, hostButton, stopHostButton, hostTargetState);
 
-        const top = document.createElement('div');
-        top.style.cssText = `
-            display: grid;
-            grid-template-columns: repeat(4, minmax(0, 1fr));
-            gap: 8px;
-            flex: 0 0 auto;
-        `;
-        top.appendChild(createRemoteFleetStat('Hub', hubStatus === 'online' ? 'Online' : 'Offline', hubStatus === 'online' ? 'online' : 'default'));
-        top.appendChild(createRemoteFleetStat('Connected', `${Number.isFinite(connected) ? connected : 0}/${Number.isFinite(total) ? total : devices.length}`, connected > 0 ? 'online' : 'default'));
-        top.appendChild(createRemoteFleetStat('Task', String(taskCapableCount), taskCapableCount > 0 ? 'online' : 'default'));
-        top.appendChild(createRemoteFleetStat('AI', String(aiCapableCount), aiCapableCount > 0 ? 'online' : 'default'));
-        bodyView.appendChild(top);
+        const statusRail = createRemoteFleetStatusRail([
+            {
+                key: 'hub',
+                label: 'Hub',
+                value: hubStatus === 'online' ? 'Online' : 'Offline',
+                tone: hubStatus === 'online' ? 'online' : 'default'
+            },
+            {
+                key: 'connected',
+                label: 'Connected',
+                value: `${Number.isFinite(connected) ? connected : 0}/${Number.isFinite(total) ? total : devices.length}`,
+                tone: connected > 0 ? 'online' : 'default'
+            },
+            {
+                key: 'task',
+                label: 'Task',
+                value: String(taskCapableCount),
+                tone: taskCapableCount > 0 ? 'online' : 'default'
+            },
+            {
+                key: 'ai',
+                label: 'AI',
+                value: String(aiCapableCount),
+                tone: aiCapableCount > 0 ? 'online' : 'default'
+            }
+        ]);
 
         const filterRow = document.createElement('div');
         filterRow.style.cssText = `
@@ -14238,6 +14329,7 @@
             monitorWorkspace.appendChild(createSelectedDevicePanel(selectedDevice));
         }
         bodyView.appendChild(monitorWorkspace);
+        bodyView.appendChild(statusRail);
 
         const setTaskFeedback = (message, tone = 'info') => {
             taskFeedback.textContent = message || '';

package/wwwroot/index.html

@@ -558,7 +558,7 @@
             }
 
             const base = '_content/MindExecution.Shared/js/';
-            const scriptVersion = '20260613-cursor-blink-remote-icon-v493';
+            const scriptVersion = '20260613-remote-status-rail-v495';
             const scriptUrl = (script) => `${base}${script}?v=${scriptVersion}`;
             console.log(`[Script Loader] Shared JS version: ${scriptVersion}`);
             const criticalScripts = [

package/wwwroot/service-worker-assets.js

@@ -1,5 +1,5 @@
 self.assetsManifest = {
-    "version":  "dzmlSBJx",
+    "version":  "RMyUd5ec",
     "assets":  [
                    {
                        "hash":  "sha256-+CSYMcqLNTsq3VnH11jgYyOCCdxvHzL74CBmo4sCmMU=",
@@ -78,7 +78,7 @@
                        "url":  "_content/MindExecution.Shared/js/marked.min.js"
                    },
                    {
-                       "hash":  "sha256-LtkB8IRvIm+FJDH5Kx4zNth2hyesdL4YqTPJylSkcHY=",
+                       "hash":  "sha256-UeeqiZXN9Iv1e/DRq1gyWRCbQUwzduNrpf5aSQido00=",
                        "url":  "_content/MindExecution.Shared/js/mind-map-core.js"
                    },
                    {
@@ -86,7 +86,7 @@
                        "url":  "_content/MindExecution.Shared/js/mind-map-core.js.backup"
                    },
                    {
-                       "hash":  "sha256-wZrUQUYTsiH7hkHaZPeEBdqG+r+e2UDR9vqZmyARSFg=",
+                       "hash":  "sha256-S8H0KuKhx8Fhbt07w1LBGxnBjT4km99JHDxzrHVFVho=",
                        "url":  "_content/MindExecution.Shared/js/mind-map-css3d-manager.js"
                    },
                    {
@@ -834,7 +834,7 @@
                        "url":  "image-manifest.json"
                    },
                    {
-                       "hash":  "sha256-6JYaZ2X3Gg9XoAZomsa4QjcmaQDb7YpKcGVGvxLSXTg=",
+                       "hash":  "sha256-t14gn/m71KgCPH/qD7JKdV9e5WD4DsQVpId/vGYdorE=",
                        "url":  "index.html"
                    },
                    {

package/wwwroot/service-worker.js

@@ -1,4 +1,4 @@
-/* Manifest version: dzmlSBJx */
+/* Manifest version: RMyUd5ec */
 // Hosted deployments should prefer the network over stale offline caches.
 // This service worker immediately clears old Blazor offline caches and unregisters itself.