@mindexec/cli 0.2.72 → 0.2.74

package/package.json

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

package/scripts/remote-fleet-render-smoke.mjs

@@ -715,6 +715,10 @@ try {
     assert.ok(bodyChildOrder.endsWith('remoteFleetStatusRail'), bodyChildOrder);
     assert.ok(statusFooter.style.cssText.includes('flex-direction: row'));
     assert.ok(statusFooter.style.cssText.includes('justify-content: flex-end'));
+    const sizeControls = statusFooter.querySelector('[data-remote-fleet-size-controls="true"]');
+    assert.ok(sizeControls);
+    assert.equal(sizeControls.querySelector('[data-remote-fleet-action="monitor-size-down"]')?.textContent, '-');
+    assert.equal(sizeControls.querySelector('[data-remote-fleet-action="monitor-size-up"]')?.textContent, '+');
     assert.match(statusFooter.style.cssText, /box-sizing:\s*border-box;/);
     assert.equal(statusFooter.querySelectorAll('[data-remote-fleet-status-item]').length, 5);
     assert.ok(statusFooter.querySelector('[data-remote-fleet-status-item="route"]'));
@@ -733,6 +737,14 @@ try {
     assert.ok(initialDetailPanel?.textContent.includes('Load'));
     assert.ok(cards[0]?.querySelector('[data-remote-fleet-device-preview="tile"]'));
     assert.equal(/\b(Seen|Uptime|Mem|Load)\b/.test(cards[0]?.textContent || ''), false);
+    assert.match(deviceGrid.style.cssText, /minmax\(132px,\s*1fr\)/);
+    sizeControls.querySelector('[data-remote-fleet-action="monitor-size-up"]').dispatchEvent({ type: 'click' });
+    assert.equal(bodyView.dataset.remoteFleetDensity, 'large');
+    assert.match(bodyView.querySelector('[data-remote-fleet-device-grid="true"]')?.style.cssText || '', /minmax\(168px,\s*1fr\)/);
+    bodyView.querySelector('[data-remote-fleet-action="monitor-size-down"]').dispatchEvent({ type: 'click' });
+    assert.equal(bodyView.dataset.remoteFleetDensity, 'cards');
+    assert.match(bodyView.querySelector('[data-remote-fleet-device-grid="true"]')?.style.cssText || '', /minmax\(132px,\s*1fr\)/);
+    cards = bodyView.querySelectorAll('article[data-device-id]');
     const patchTarget = devices.find(device => device.ThumbnailEnabled === true && device.LiveStreamActive !== true);
     assert.ok(patchTarget);
     const patchCard = Array.from(cards).find(card => card.dataset.deviceId === patchTarget.DeviceId);
@@ -793,17 +805,7 @@ try {
     assert.equal(bodyView.textContent.includes('Host: Active'), false);
     assert.equal(nodeShell.querySelector('[data-remote-fleet-host-indicator="true"]')?.dataset.remoteFleetHostActive, 'true');
     assert.equal(nodeShell.querySelector('[data-remote-fleet-action="set-host"]')?.textContent, 'Set Host');
-    const stopHostButton = nodeShell.querySelector('[data-remote-fleet-action="stop-host"]');
-    assert.ok(stopHostButton);
-    const stopHostStart = dotNetCalls.length;
-    stopHostButton.dispatchEvent({ type: 'click' });
-    await wait();
-    const stopHostCall = dotNetCalls
-        .slice(stopHostStart)
-        .find(call => call.methodName === 'SetRemoteFleetHostFromJs');
-    assert.ok(stopHostCall);
-    assert.equal(stopHostCall.args[0], 'remote-fleet-render-smoke');
-    assert.equal(stopHostCall.args[1], false);
+    assert.equal(nodeShell.querySelector('[data-remote-fleet-action="stop-host"]'), null);
     hub.setHostTarget({
         nodeId: 'remote-fleet-render-smoke',
         enabled: false

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

@@ -3429,6 +3429,12 @@
     const REMOTE_FLEET_MONITOR_TILE_GAP_PX = 8;
     const REMOTE_FLEET_EMPTY_SCREEN_MIN_WIDTH = 132;
     const REMOTE_FLEET_EMPTY_SCREEN_MIN_HEIGHT = 72;
+    const REMOTE_FLEET_MONITOR_SIZE_LEVELS = Object.freeze(['dense', 'cards', 'large']);
+    const REMOTE_FLEET_MONITOR_TILE_METRICS = Object.freeze({
+        dense: Object.freeze({ tileMinWidth: 104, tileMinHeight: 66, emptyMinWidth: 104, emptyMinHeight: 58 }),
+        cards: Object.freeze({ tileMinWidth: 132, tileMinHeight: 84, emptyMinWidth: 132, emptyMinHeight: 72 }),
+        large: Object.freeze({ tileMinWidth: 168, tileMinHeight: 106, emptyMinWidth: 168, emptyMinHeight: 94 })
+    });
     const AUTOMATION_NODE_KIND_METADATA_KEY = 'AutomationNodeKind';
     const AUTOMATION_NODE_LABEL_METADATA_KEY = 'AutomationNodeLabel';
     const AUTOMATION_NODE_DESCRIPTION_METADATA_KEY = 'AutomationNodeDescription';
@@ -12504,7 +12510,72 @@
         return item;
     }
 
-    function createRemoteFleetStatusRail(items, errorMessage = '') {
+    function normalizeRemoteFleetMonitorSize(value) {
+        const normalized = String(value || '').trim().toLowerCase();
+        return REMOTE_FLEET_MONITOR_SIZE_LEVELS.includes(normalized)
+            ? normalized
+            : 'cards';
+    }
+
+    function getRemoteFleetMonitorSizeIndex(value) {
+        return Math.max(0, REMOTE_FLEET_MONITOR_SIZE_LEVELS.indexOf(normalizeRemoteFleetMonitorSize(value)));
+    }
+
+    function getRemoteFleetTileMetrics(value) {
+        const size = normalizeRemoteFleetMonitorSize(value);
+        return REMOTE_FLEET_MONITOR_TILE_METRICS[size] || REMOTE_FLEET_MONITOR_TILE_METRICS.cards;
+    }
+
+    function createRemoteFleetMonitorSizeControls(sizeState) {
+        const sizeIndex = getRemoteFleetMonitorSizeIndex(sizeState);
+        const controls = document.createElement('div');
+        controls.dataset.remoteFleetSizeControls = 'true';
+        controls.style.cssText = `
+            flex: 0 0 auto;
+            display: inline-flex;
+            align-items: center;
+            gap: 4px;
+            margin-right: auto;
+            min-width: 0;
+            pointer-events: auto;
+        `;
+
+        const createButton = (label, title, action, disabled) => {
+            const button = document.createElement('button');
+            button.type = 'button';
+            button.dataset.remoteFleetAction = action;
+            button.textContent = label;
+            button.title = title;
+            button.setAttribute('aria-label', title);
+            button.disabled = disabled === true;
+            button.style.cssText = `
+                flex: 0 0 24px;
+                width: 24px;
+                height: 22px;
+                display: inline-flex;
+                align-items: center;
+                justify-content: center;
+                padding: 0;
+                border-radius: 999px;
+                border: 1px solid rgba(148, 163, 184, 0.24);
+                background: ${disabled ? 'rgba(241, 245, 249, 0.70)' : 'rgba(255, 255, 255, 0.92)'};
+                color: ${disabled ? '#94a3b8' : '#0f172a'};
+                font-size: 13px;
+                font-weight: 950;
+                line-height: 1;
+                letter-spacing: 0;
+                cursor: ${disabled ? 'default' : 'pointer'};
+                pointer-events: ${disabled ? 'none' : 'auto'};
+            `;
+            return button;
+        };
+
+        controls.appendChild(createButton('-', 'Smaller screens', 'monitor-size-down', sizeIndex <= 0));
+        controls.appendChild(createButton('+', 'Larger screens', 'monitor-size-up', sizeIndex >= REMOTE_FLEET_MONITOR_SIZE_LEVELS.length - 1));
+        return controls;
+    }
+
+    function createRemoteFleetStatusRail(items, errorMessage = '', leadingControl = null) {
         const rail = document.createElement('aside');
         rail.dataset.remoteFleetStatusRail = 'true';
         rail.style.cssText = `
@@ -12527,6 +12598,10 @@
             background: rgba(255, 255, 255, 0.70);
         `;
 
+        if (leadingControl) {
+            rail.appendChild(leadingControl);
+        }
+
         const normalizedError = String(errorMessage || '').trim();
         if (normalizedError) {
             const error = document.createElement('div');
@@ -12735,7 +12810,7 @@
         return button;
     }
 
-    function attachRemoteFleetTitleActions(bodyView, hostButton, stopHostButton, hostState) {
+    function attachRemoteFleetTitleActions(bodyView, hostButton, hostState) {
         const container = bodyView?.closest?.('.map-node-remote-fleet');
         const header = container?.querySelector?.('.template-card__header')
             || container?.querySelector?.('.map-node-memo__header')
@@ -12771,9 +12846,6 @@
 
         titleActions.appendChild(indicator);
         titleActions.appendChild(hostButton);
-        if (stopHostButton) {
-            titleActions.appendChild(stopHostButton);
-        }
 
         if (header) {
             header.style.gridTemplateColumns = header.classList?.contains?.('template-card__header')
@@ -12788,17 +12860,19 @@
         return titleActions;
     }
 
-    function getRemoteFleetEmptyScreenCount(nodeModel) {
+    function getRemoteFleetEmptyScreenCount(nodeModel, sizeState = 'cards') {
+        const metrics = getRemoteFleetTileMetrics(sizeState);
         const width = Number(nodeModel?.width ?? nodeModel?.Width ?? 960);
         const height = Number(nodeModel?.height ?? nodeModel?.Height ?? 620);
         const usableWidth = Number.isFinite(width) ? Math.max(360, width - 44) : 916;
         const usableHeight = Number.isFinite(height) ? Math.max(260, height - 128) : 492;
-        const columns = Math.max(3, Math.floor((usableWidth + REMOTE_FLEET_MONITOR_TILE_GAP_PX) / (REMOTE_FLEET_EMPTY_SCREEN_MIN_WIDTH + REMOTE_FLEET_MONITOR_TILE_GAP_PX)));
-        const rows = Math.max(3, Math.ceil((usableHeight + REMOTE_FLEET_MONITOR_TILE_GAP_PX) / (REMOTE_FLEET_EMPTY_SCREEN_MIN_HEIGHT + REMOTE_FLEET_MONITOR_TILE_GAP_PX)));
+        const columns = Math.max(3, Math.floor((usableWidth + REMOTE_FLEET_MONITOR_TILE_GAP_PX) / (metrics.emptyMinWidth + REMOTE_FLEET_MONITOR_TILE_GAP_PX)));
+        const rows = Math.max(3, Math.ceil((usableHeight + REMOTE_FLEET_MONITOR_TILE_GAP_PX) / (metrics.emptyMinHeight + REMOTE_FLEET_MONITOR_TILE_GAP_PX)));
         return Math.max(12, Math.min(80, columns * rows));
     }
 
-    function createRemoteFleetEmptyScreens(nodeModel) {
+    function createRemoteFleetEmptyScreens(nodeModel, sizeState = 'cards') {
+        const metrics = getRemoteFleetTileMetrics(sizeState);
         const shell = document.createElement('section');
         shell.dataset.remoteFleetEmptyScreens = 'true';
         shell.style.cssText = `
@@ -12807,7 +12881,7 @@
             overflow-y: auto;
             overflow-x: hidden;
             display: grid;
-            grid-template-columns: repeat(auto-fill, minmax(${REMOTE_FLEET_EMPTY_SCREEN_MIN_WIDTH}px, 1fr));
+            grid-template-columns: repeat(auto-fill, minmax(${metrics.emptyMinWidth}px, 1fr));
             grid-auto-rows: max-content;
             align-content: start;
             align-items: start;
@@ -12822,7 +12896,7 @@
             padding: 2px 4px 6px 4px;
         `;
 
-        const screenCount = getRemoteFleetEmptyScreenCount(nodeModel);
+        const screenCount = getRemoteFleetEmptyScreenCount(nodeModel, sizeState);
         for (let index = 0; index < screenCount; index += 1) {
             const screen = document.createElement('div');
             screen.dataset.remoteFleetEmptyScreen = 'true';
@@ -12830,7 +12904,7 @@
                 width: 100%;
                 height: auto;
                 aspect-ratio: 16 / 9;
-                min-height: ${REMOTE_FLEET_EMPTY_SCREEN_MIN_HEIGHT}px;
+                min-height: ${metrics.emptyMinHeight}px;
                 box-sizing: border-box;
                 border-radius: 8px;
                 border: 1px solid rgba(203, 213, 225, 0.72);
@@ -14924,7 +14998,7 @@
         const filterState = bodyView.dataset.remoteFleetFilter || 'all';
         const sortState = bodyView.dataset.remoteFleetSort || 'status';
         const groupState = bodyView.dataset.remoteFleetGroup || 'none';
-        const densityState = bodyView.dataset.remoteFleetDensity || 'cards';
+        const densityState = normalizeRemoteFleetMonitorSize(bodyView.dataset.remoteFleetDensity || 'cards');
         const aiAssistState = bodyView.dataset.remoteFleetAiAssist === 'true';
         const autoMonitorState = bodyView.dataset.remoteFleetAutoMonitor !== 'false';
         const focusState = bodyView.dataset.remoteFleetFocusDeviceId || '';
@@ -14985,6 +15059,7 @@
 
         bodyView.dataset.src = `remote-fleet:${refreshedAt}:${devices.length}:${connected}`;
         bodyView.dataset.remoteFleetHostState = hostTargetState;
+        bodyView.dataset.remoteFleetDensity = densityState;
         bodyView.classList.add('map-node-remote-fleet__body');
         bodyView.innerHTML = '';
         bodyView.style.cssText = `
@@ -15011,15 +15086,7 @@
         hostButton.style.borderColor = isHostingTarget ? 'rgba(37, 99, 235, 0.44)' : 'rgba(37, 99, 235, 0.32)';
         hostButton.style.background = isHostingTarget ? 'rgba(239, 246, 255, 0.98)' : '#ffffff';
         hostButton.style.color = '#1d4ed8';
-        let stopHostButton = null;
-        if (isHostingTarget) {
-            stopHostButton = createRemoteFleetButton('Stop', 'Stop using this monitor as the host target.', 'stop-host');
-            stopHostButton.style.height = '30px';
-            stopHostButton.style.borderColor = 'rgba(239, 68, 68, 0.30)';
-            stopHostButton.style.color = '#b91c1c';
-            stopHostButton.style.background = 'rgba(254, 242, 242, 0.94)';
-        }
-        attachRemoteFleetTitleActions(bodyView, hostButton, stopHostButton, hostTargetState);
+        attachRemoteFleetTitleActions(bodyView, hostButton, hostTargetState);
 
         const statusRail = createRemoteFleetStatusRail([
             {
@@ -15053,7 +15120,7 @@
                 tone: routeInfo.tone,
                 title: routeInfo.title
             }
-        ], lastError);
+        ], lastError, createRemoteFleetMonitorSizeControls(densityState));
 
         const filterRow = document.createElement('div');
         filterRow.style.cssText = `
@@ -15115,8 +15182,9 @@
         ], groupState, 'Device grouping');
 
         const densitySelect = createRemoteFleetSelect([
+            { value: 'dense', label: 'Dense' },
             { value: 'cards', label: 'Cards' },
-            { value: 'dense', label: 'Dense' }
+            { value: 'large', label: 'Large' }
         ], densityState, 'Device density');
 
         const matchCount = document.createElement('div');
@@ -15826,8 +15894,9 @@
             return panel;
         };
 
-        const tileMinWidth = densityState === 'dense' ? 104 : 132;
-        const tileMinHeight = densityState === 'dense' ? 66 : 84;
+        const tileMetrics = getRemoteFleetTileMetrics(densityState);
+        const tileMinWidth = tileMetrics.tileMinWidth;
+        const tileMinHeight = tileMetrics.tileMinHeight;
         const tileGap = REMOTE_FLEET_MONITOR_TILE_GAP_PX;
 
         const monitorWorkspace = document.createElement('div');
@@ -16022,7 +16091,7 @@
         if (devices.length === 0) {
             monitorWorkspace.style.display = 'flex';
             monitorWorkspace.style.flexDirection = 'column';
-            monitorWorkspace.appendChild(createRemoteFleetEmptyScreens(nodeModel));
+            monitorWorkspace.appendChild(createRemoteFleetEmptyScreens(nodeModel, densityState));
         } else {
             monitorWorkspace.appendChild(grid);
             monitorWorkspace.appendChild(createSelectedDevicePanel(selectedDevice));
@@ -16274,7 +16343,7 @@
                 control.addEventListener(eventName, event => event.stopPropagation());
             });
         });
-        [hostButton, stopHostButton].forEach(control => {
+        [hostButton].forEach(control => {
             if (!control) return;
             ['mousedown', 'mouseup', 'click', 'dblclick', 'keydown'].forEach(eventName => {
                 control.addEventListener(eventName, event => event.stopPropagation());
@@ -16384,7 +16453,7 @@
         const setRemoteFleetHostTarget = async (enabled, options = {}) => {
             const quiet = options?.quiet === true;
             const renew = options?.renew === true || quiet;
-            const activeButton = enabled ? hostButton : stopHostButton;
+            const activeButton = enabled ? hostButton : null;
             if (!quiet && activeButton) {
                 activeButton.disabled = true;
             }
@@ -16434,13 +16503,33 @@
             await setRemoteFleetHostTarget(true);
         });
 
-        if (stopHostButton) {
-            stopHostButton.addEventListener('click', async event => {
+        const setRemoteFleetMonitorSize = direction => {
+            const currentIndex = getRemoteFleetMonitorSizeIndex(bodyView.dataset.remoteFleetDensity || densityState);
+            const nextIndex = Math.max(
+                0,
+                Math.min(REMOTE_FLEET_MONITOR_SIZE_LEVELS.length - 1, currentIndex + direction));
+            if (nextIndex === currentIndex) {
+                return;
+            }
+
+            bodyView.dataset.remoteFleetDensity = REMOTE_FLEET_MONITOR_SIZE_LEVELS[nextIndex];
+            renderRemoteFleetMonitor(bodyView, nodeModel);
+        };
+
+        bodyView.querySelectorAll('[data-remote-fleet-action]').forEach(button => {
+            const action = String(button.dataset.remoteFleetAction || '');
+            if (action !== 'monitor-size-down' && action !== 'monitor-size-up') {
+                return;
+            }
+            ['mousedown', 'mouseup', 'click', 'dblclick', 'keydown'].forEach(eventName => {
+                button.addEventListener(eventName, event => event.stopPropagation());
+            });
+            button.addEventListener('click', event => {
                 event.preventDefault();
                 event.stopPropagation();
-                await setRemoteFleetHostTarget(false);
+                setRemoteFleetMonitorSize(action === 'monitor-size-up' ? 1 : -1);
             });
-        }
+        });
 
         bodyView.querySelectorAll('[data-remote-fleet-action="pin-device"]').forEach(button => {
             button.addEventListener('click', async event => {

package/wwwroot/index.html

@@ -7,8 +7,8 @@
     <title>MindExec | Run your ideas as AI task graphs</title>
     <meta name="description" content="MindExec is an AI execution canvas for solo builders, researchers, developers, and creators. Start with free browser tools, then move serious work into saved MindCanvas projects." />
     <base href="/" />
-    <link rel="stylesheet" href="_content/MindExecution.Shared/css/app.css?v=20260614-remote-monitor-selection-v527" />
-    <link rel="stylesheet" href="_content/MindExecution.Shared/css/mind-map-overrides.css?v=20260614-remote-monitor-selection-v527" />
+    <link rel="stylesheet" href="_content/MindExecution.Shared/css/app.css?v=20260614-remote-monitor-size-controls-v529" />
+    <link rel="stylesheet" href="_content/MindExecution.Shared/css/mind-map-overrides.css?v=20260614-remote-monitor-size-controls-v529" />
     <!-- ?쇄뼹??Font Awesome (local) ?쇄뼹??-->
     <link rel="stylesheet" href="_content/MindExecution.Shared/lib/font-awesome/css/all.min.css" />
     <!-- ?꿎뼯??-->
@@ -579,7 +579,7 @@
             }
 
             const base = '_content/MindExecution.Shared/js/';
-        const scriptVersion = '20260614-remote-monitor-selection-v527';
+        const scriptVersion = '20260614-remote-monitor-size-controls-v529';
             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":  "2Z4LSqbS",
+    "version":  "D4Pf0guw",
     "assets":  [
                    {
                        "hash":  "sha256-+CSYMcqLNTsq3VnH11jgYyOCCdxvHzL74CBmo4sCmMU=",
@@ -86,7 +86,7 @@
                        "url":  "_content/MindExecution.Shared/js/mind-map-core.js.backup"
                    },
                    {
-                       "hash":  "sha256-ITFlIgAsq32TTITY+WwaAhQNq4JSQg6EPr8ZeyYbI+A=",
+                       "hash":  "sha256-hzl6gNvjb9faAA2tUeCfriNvdohhGaDtasnYOCMum7E=",
                        "url":  "_content/MindExecution.Shared/js/mind-map-css3d-manager.js"
                    },
                    {
@@ -834,7 +834,7 @@
                        "url":  "image-manifest.json"
                    },
                    {
-                       "hash":  "sha256-p6etmqWjxJ5G7ogEIiXjjgKIu8t4hAJGYYSvtWyJuGk=",
+                       "hash":  "sha256-6okf9Y0Fpz1uWtjB0xMwIlfltrQLSgbPn8PBj3QW/5Y=",
                        "url":  "index.html"
                    },
                    {

package/wwwroot/service-worker.js

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