npm - @duckmind/dm-windows-x64 - Versions diffs - 0.63.4 → 0.63.9 - Mend

@duckmind/dm-windows-x64 0.63.4 → 0.63.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (121) hide show

package/extensions/dm-mcp-adapter/host-html-template.js ADDED Viewed

@@ -0,0 +1,464 @@
+const DEFAULT_APP_BRIDGE_MODULE_URL = "/app-bridge.bundle.js";
+const APP_SANDBOX = "allow-scripts allow-forms allow-modals allow-popups allow-downloads";
+const APP_PROXY_SANDBOX = `${APP_SANDBOX} allow-same-origin`;
+const APP_INNER_SANDBOX = APP_PROXY_SANDBOX;
+export function buildHostHtmlTemplate(input) {
+  const hostContext = input.hostContext ?? {};
+  const sessionToken = safeInlineJSON(input.sessionToken);
+  const uiResourceToken = safeInlineJSON(input.uiResourceToken);
+  const toolArgs = safeInlineJSON(input.toolArgs);
+  const serverName = safeInlineJSON(input.serverName);
+  const toolName = safeInlineJSON(input.toolName);
+  const hostContextJson = safeInlineJSON(hostContext);
+  const allowAttribute = safeInlineJSON(input.allowAttribute);
+  const requireToolConsent = safeInlineJSON(input.requireToolConsent);
+  const cacheToolConsent = safeInlineJSON(input.cacheToolConsent);
+  const moduleUrl = safeInlineJSON(input.appBridgeModuleUrl ?? DEFAULT_APP_BRIDGE_MODULE_URL);
+  const sandboxProxyUrl = safeInlineJSON(input.sandboxProxyUrl);
+  const resourceCsp = safeInlineJSON(input.resource.meta.csp);
+  const resourcePermissions = safeInlineJSON(input.resource.meta.permissions);
+  return `<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>MCP UI - ${escapeHtml(input.serverName)} / ${escapeHtml(input.toolName)}</title>
+  <style>
+    :root {
+      color-scheme: light dark;
+      --bg: #0f1115;
+      --surface: #181c22;
+      --text: #ecf0f5;
+      --muted: #a9b2bf;
+      --accent: #43c0ff;
+      --border: rgba(255, 255, 255, 0.12);
+      --good: #34d399;
+      --warn: #fbbf24;
+      --bad: #f87171;
+    }
+    @media (prefers-color-scheme: light) {
+      :root {
+        --bg: #f6f7fb;
+        --surface: #ffffff;
+        --text: #1d2939;
+        --muted: #667085;
+        --accent: #0ea5e9;
+        --border: rgba(15, 23, 42, 0.14);
+        --good: #059669;
+        --warn: #b45309;
+        --bad: #b91c1c;
+      }
+    }
+    * { box-sizing: border-box; }
+    html, body { margin: 0; padding: 0; height: 100%; font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); }
+    body { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
+    header { background: var(--surface); border-bottom: 1px solid var(--border); padding: calc(10px + env(safe-area-inset-top, 0px)) calc(14px + env(safe-area-inset-right, 0px)) 10px calc(14px + env(safe-area-inset-left, 0px)); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
+    .title { display: flex; gap: 8px; align-items: baseline; min-width: 0; }
+    .server { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; white-space: nowrap; }
+    .tool { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    .badge { border: 1px solid var(--border); border-radius: 999px; padding: 2px 8px; font-size: 11px; color: var(--muted); white-space: nowrap; }
+    .controls { display: flex; gap: 8px; align-items: center; }
+    .status { font-size: 12px; color: var(--muted); white-space: nowrap; }
+    button { border: 1px solid var(--border); background: transparent; color: var(--text); border-radius: 8px; padding: 6px 10px; cursor: pointer; font-size: 12px; }
+    button.primary { border-color: color-mix(in srgb, var(--good) 40%, var(--border) 60%); color: var(--good); }
+    button.danger { border-color: color-mix(in srgb, var(--bad) 40%, var(--border) 60%); color: var(--bad); }
+    button:hover { background: color-mix(in srgb, var(--surface) 75%, var(--accent) 25%); }
+    main { flex: 1; min-height: 0; padding: 10px; padding-inline: calc(10px + env(safe-area-inset-left, 0px)) calc(10px + env(safe-area-inset-right, 0px)); padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); display: flex; }
+    iframe { width: 100%; height: 100%; border: 1px solid var(--border); border-radius: 10px; background: white; }
+    .overlay { position: fixed; inset: 0; background: color-mix(in srgb, var(--bg) 90%, black 10%); display: none; align-items: center; justify-content: center; z-index: 2; padding: 16px; }
+    .overlay.visible { display: flex; }
+    .panel { width: min(680px, calc(100vw - 40px)); background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
+    .panel h2 { margin: 0 0 8px; font-size: 16px; }
+    .panel p { margin: 0; color: var(--muted); line-height: 1.4; font-size: 14px; white-space: pre-wrap; }
+    @media (max-width: 640px) {
+      header { align-items: stretch; flex-direction: column; gap: 8px; }
+      .title { flex-wrap: wrap; row-gap: 4px; }
+      .server { flex-basis: 100%; }
+      .controls { width: 100%; }
+      .status { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
+      button { min-height: 44px; padding: 10px 14px; }
+      main { padding: 6px; padding-inline: calc(6px + env(safe-area-inset-left, 0px)) calc(6px + env(safe-area-inset-right, 0px)); padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px)); }
+      iframe { border-radius: 6px; }
+      .panel { width: 100%; }
+    }
+  </style>
+</head>
+<body>
+  <header>
+    <div class="title">
+      <span class="server">MCP · <span id="server-name"></span></span>
+      <span class="tool" id="tool-name"></span>
+      <span class="badge">Sandboxed</span>
+    </div>
+    <div class="controls">
+      <span class="status" id="status">Loading UI...</span>
+      <button class="primary" id="done-btn" title="Cmd/Ctrl+Enter">Done</button>
+      <button class="danger" id="cancel-btn" title="Escape">Cancel</button>
+    </div>
+  </header>
+  <main>
+    <iframe id="mcp-app" sandbox="${APP_PROXY_SANDBOX}" referrerpolicy="no-referrer"></iframe>
+  </main>
+  <div class="overlay" id="error-overlay">
+    <div class="panel">
+      <h2>UI Error</h2>
+      <p id="error-message"></p>
+    </div>
+  </div>
+  <div class="overlay" id="completion-overlay">
+    <div class="panel">
+      <h2>Done</h2>
+      <p>MCP UI session finished. You can close this page and return to DM.</p>
+    </div>
+  </div>
+  <script type="module">
+    import { AppBridge, PostMessageTransport } from ${moduleUrl};
+    const SESSION_TOKEN = ${sessionToken};
+    const UI_RESOURCE_TOKEN = ${uiResourceToken};
+    const SERVER_NAME = ${serverName};
+    const TOOL_NAME = ${toolName};
+    const TOOL_ARGS = ${toolArgs};
+    const HOST_CONTEXT = ${hostContextJson};
+    const ALLOW_ATTRIBUTE = ${allowAttribute};
+    const REQUIRE_TOOL_CONSENT = ${requireToolConsent};
+    const CACHE_TOOL_CONSENT = ${cacheToolConsent};
+    const SANDBOX_PROXY_URL = ${sandboxProxyUrl};
+    const RESOURCE_CSP = ${resourceCsp};
+    const RESOURCE_PERMISSIONS = ${resourcePermissions};
+    const INNER_SANDBOX = ${safeInlineJSON(APP_INNER_SANDBOX)};
+    const STREAM_CONTEXT_KEY = "dm-mcp-adapter/stream";
+    const STREAM_PATCH_METHOD = "notifications/dm-mcp-adapter/ui-result-patch";
+    const iframe = document.getElementById("mcp-app");
+    const statusNode = document.getElementById("status");
+    const doneBtn = document.getElementById("done-btn");
+    const cancelBtn = document.getElementById("cancel-btn");
+    const errorOverlay = document.getElementById("error-overlay");
+    const completionOverlay = document.getElementById("completion-overlay");
+    const errorMessage = document.getElementById("error-message");
+    const sandboxProxyOrigin = new URL(SANDBOX_PROXY_URL).origin;
+    document.getElementById("server-name").textContent = SERVER_NAME;
+    document.getElementById("tool-name").textContent = TOOL_NAME;
+    const setStatus = (text, isError = false) => {
+      statusNode.textContent = text;
+      statusNode.style.color = isError ? "var(--bad)" : "var(--muted)";
+    };
+    const showError = (message) => {
+      errorMessage.textContent = message;
+      errorOverlay.classList.add("visible");
+      setStatus("Error", true);
+    };
+    let completionPending = false;
+    const showCompletion = () => {
+      completionOverlay.classList.add("visible");
+      setStatus("Complete");
+    };
+    const closeOrShowDone = () => {
+      completionPending = true;
+      window.close();
+      setTimeout(() => {
+        if (!document.hidden) {
+          showCompletion();
+        }
+      }, 1000);
+    };
+    document.addEventListener("visibilitychange", () => {
+      if (completionPending && !document.hidden) {
+        showCompletion();
+      }
+    });
+    const post = async (endpoint, params) => {
+      const response = await fetch(endpoint, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ token: SESSION_TOKEN, params }),
+      });
+      const body = await response.json().catch(() => ({ ok: false, error: "Invalid JSON response" }));
+      if (!response.ok || !body.ok) {
+        const message = body.error || ("HTTP " + response.status);
+        throw new Error(message);
+      }
+      return body.result ?? {};
+    };
+    let consentGranted = !REQUIRE_TOOL_CONSENT;
+    const initialStreamContext = HOST_CONTEXT?.[STREAM_CONTEXT_KEY];
+    const streamMode = initialStreamContext?.mode === "stream-first" ? "stream-first" : "eager";
+    const bridge = new AppBridge(
+      null,
+      { name: "pi", version: "1.0.0" },
+      {
+        serverTools: {},
+        openLinks: {},
+        logging: {},
+        updateModelContext: {},
+        message: {},
+        sandbox: {
+          ...(RESOURCE_CSP ? { csp: RESOURCE_CSP } : {}),
+          ...(RESOURCE_PERMISSIONS ? { permissions: RESOURCE_PERMISSIONS } : {}),
+        },
+      },
+      { hostContext: HOST_CONTEXT }
+    );
+    let sandboxResourceSent = false;
+    bridge.onsandboxready = async () => {
+      if (sandboxResourceSent) return;
+      sandboxResourceSent = true;
+      try {
+        const response = await fetch("/ui-app?resource=" + encodeURIComponent(UI_RESOURCE_TOKEN), {
+          headers: { Accept: "text/html" },
+        });
+        if (!response.ok) throw new Error("UI resource request failed: HTTP " + response.status);
+        const html = await response.text();
+        await bridge.sendSandboxResourceReady({
+          html,
+          sandbox: INNER_SANDBOX,
+          ...(RESOURCE_CSP ? { csp: RESOURCE_CSP } : {}),
+          ...(RESOURCE_PERMISSIONS ? { permissions: RESOURCE_PERMISSIONS } : {}),
+        });
+      } catch (error) {
+        showError("Failed to load MCP App resource: " + String(error));
+      }
+    };
+    bridge.oncalltool = async (params) => {
+      if (!consentGranted) {
+        const accepted = window.confirm("Allow this UI to call server tools for this session?");
+        if (!accepted) {
+          await post("/proxy/ui/consent", { approved: false }).catch(() => {});
+          return {
+            isError: true,
+            content: [{ type: "text", text: "Tool call denied by user." }],
+          };
+        }
+        await post("/proxy/ui/consent", { approved: true });
+        if (CACHE_TOOL_CONSENT) {
+          consentGranted = true;
+        }
+      }
+      const result = await post("/proxy/tools/call", params);
+      // Notify agent about the tool call
+      await post("/proxy/ui/generated-tool-call-intent", {
+        tool: params.name,
+        arguments: params.arguments,
+        isError: result.isError
+      }).catch(() => {});
+      return result;
+    };
+    bridge.onmessage = async (params) => post("/proxy/ui/message", params);
+    bridge.onupdatemodelcontext = async (params) => post("/proxy/ui/context", params);
+    // Also listen for raw postMessage events with custom types (notify, prompt, intent, etc.)
+    // These bypass the AppBridge protocol but are used by some MCP UI implementations
+    window.addEventListener("message", async (event) => {
+      if (event.source !== iframe.contentWindow || event.origin !== sandboxProxyOrigin) return;
+      const data = event.data;
+      if (!data || typeof data !== "object") return;
+      // Skip AppBridge protocol messages (handled by bridge)
+      if (data.jsonrpc || (typeof data.method === "string" && (data.method.startsWith("app/") || data.method.startsWith("host/")))) return;
+      // Handle raw UI action messages
+      const msgType = data.type;
+      if (typeof msgType !== "string") return;
+      if (msgType === "notify" || msgType === "prompt" || msgType === "intent" || msgType === "message") {
+        // Standard MCP-UI types - preserve their semantics
+        // Support both { type, payload: {...} } and { type, field: value } formats
+        const { type: _, payload, ...directFields } = data;
+        await post("/proxy/ui/message", { type: msgType, ...directFields, ...(payload || {}) }).catch(() => {});
+      } else if (!msgType.startsWith("ui-lifecycle-") && !msgType.startsWith("ui-message-")) {
+        // Any other custom type - forward as intent with type as intent name
+        // (Skip internal lifecycle/ack messages)
+        const payload = data.payload || {};
+        await post("/proxy/ui/message", {
+          type: "intent",
+          intent: msgType,
+          params: payload,
+        }).catch(() => {});
+      }
+    });
+    bridge.ondownloadfile = async (params) => post("/proxy/ui/download-file", params);
+    bridge.onrequestdisplaymode = async (params) => post("/proxy/ui/request-display-mode", params);
+    bridge.onopenlink = async (params) => {
+      const result = await post("/proxy/ui/open-link", params);
+      if (!result.isError) {
+        window.open(params.url, "_blank", "noopener,noreferrer");
+        // Notify agent about the link open
+        await post("/proxy/ui/message", {
+          type: "intent",
+          intent: "open_link",
+          params: { url: params.url }
+        }).catch(() => {});
+      }
+      return result;
+    };
+    bridge.oninitialized = () => {
+      if (streamMode !== "stream-first") {
+        bridge.sendToolInput({ arguments: TOOL_ARGS });
+      }
+      setStatus(streamMode === "stream-first" ? "Streaming…" : "Connected");
+    };
+    bridge.onsizechange = ({ width, height }) => {
+      if (typeof width === "number" && width > 0) {
+        iframe.style.minWidth = Math.min(width, window.innerWidth - 24) + "px";
+      }
+      if (typeof height === "number" && height > 0) {
+        iframe.style.height = Math.max(height, 320) + "px";
+      }
+    };
+    if (ALLOW_ATTRIBUTE) {
+      iframe.setAttribute("allow", ALLOW_ATTRIBUTE);
+    }
+    // Connect bridge BEFORE loading iframe to ensure we're listening when the app sends ui/initialize
+    const sandboxMessageGuard = (event) => {
+      if (event.source === iframe.contentWindow && event.origin !== sandboxProxyOrigin) {
+        event.stopImmediatePropagation();
+      }
+    };
+    window.addEventListener("message", sandboxMessageGuard, true);
+    try {
+      const transport = new PostMessageTransport(iframe.contentWindow, iframe.contentWindow);
+      await bridge.connect(transport);
+    } catch (error) {
+      console.error("[host] Bridge connection failed:", error);
+      showError("Failed to initialize AppBridge: " + String(error));
+    }
+    const iframeLoaded = new Promise((resolve) => {
+      iframe.onload = resolve;
+    });
+    iframe.src = SANDBOX_PROXY_URL;
+    await iframeLoaded;
+    const eventSource = new EventSource("/events?session=" + encodeURIComponent(SESSION_TOKEN));
+    eventSource.addEventListener("tool-input", (event) => {
+      try {
+        bridge.sendToolInput(JSON.parse(event.data));
+      } catch (error) {
+        showError("Failed to forward tool input: " + String(error));
+      }
+    });
+    eventSource.addEventListener("tool-result", (event) => {
+      try {
+        bridge.sendToolResult(JSON.parse(event.data));
+      } catch (error) {
+        showError("Failed to forward tool result: " + String(error));
+      }
+    });
+    eventSource.addEventListener("tool-cancelled", (event) => {
+      try {
+        bridge.sendToolCancelled(JSON.parse(event.data));
+      } catch (error) {
+        showError("Failed to forward cancellation: " + String(error));
+      }
+    });
+    eventSource.addEventListener("resource-updated", () => {
+      setStatus("Resource updated on the server. Reopen this UI to load the latest version.");
+    });
+    eventSource.addEventListener("result-patch", async (event) => {
+      try {
+        await bridge.notification({
+          method: STREAM_PATCH_METHOD,
+          params: JSON.parse(event.data),
+        });
+      } catch (error) {
+        showError("Failed to forward stream patch: " + String(error));
+      }
+    });
+    eventSource.addEventListener("host-context", (event) => {
+      try {
+        bridge.setHostContext(JSON.parse(event.data));
+      } catch {}
+    });
+    eventSource.addEventListener("session-complete", async () => {
+      await bridge.teardownResource({}).catch(() => {});
+      eventSource.close();
+      closeOrShowDone();
+    });
+    eventSource.onerror = () => {
+      setStatus("Connection lost", true);
+    };
+    const heartbeat = setInterval(() => {
+      post("/proxy/ui/heartbeat", {}).catch(() => {});
+    }, 10000);
+    const complete = async (reason) => {
+      try {
+        await post("/proxy/ui/complete", { reason });
+      } catch {}
+      try {
+        await bridge.teardownResource({});
+      } catch {}
+      clearInterval(heartbeat);
+      eventSource.close();
+      closeOrShowDone();
+    };
+    doneBtn.addEventListener("click", () => complete("done"));
+    cancelBtn.addEventListener("click", () => complete("cancel"));
+    window.addEventListener("keydown", (event) => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        complete("cancel");
+      } else if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
+        event.preventDefault();
+        complete("done");
+      }
+    });
+  </script>
+</body>
+</html>`;
+}
+export function buildCspMetaContent(csp) {
+  const resourceDomains = sanitizeCspDomains(csp?.resourceDomains);
+  const connectDomains = sanitizeCspDomains(csp?.connectDomains);
+  const frameDomains = sanitizeCspDomains(csp?.frameDomains);
+  const baseUriDomains = sanitizeCspDomains(csp?.baseUriDomains);
+  return [
+    "default-src 'none'",
+    `sandbox ${APP_SANDBOX}`,
+    toDirective("script-src", ["'self'", "'unsafe-inline'"], resourceDomains),
+    toDirective("style-src", ["'self'", "'unsafe-inline'"], resourceDomains),
+    toDirective("font-src", ["'self'"], resourceDomains),
+    toDirective("img-src", ["'self'", "data:"], resourceDomains),
+    toDirective("media-src", ["'self'", "data:"], resourceDomains),
+    connectDomains.length > 0 ? `connect-src ${connectDomains.join(" ")}` : "connect-src 'none'",
+    frameDomains.length > 0 ? `frame-src ${frameDomains.join(" ")}` : "frame-src 'none'",
+    "worker-src 'none'",
+    "object-src 'none'",
+    baseUriDomains.length > 0 ? `base-uri ${baseUriDomains.join(" ")}` : "base-uri 'self'"
+  ].join("; ");
+}
+function toDirective(name, trustedSources, domains) {
+  return `${name} ${[...new Set([...trustedSources, ...domains])].join(" ")}`;
+}
+function sanitizeCspDomains(domains) {
+  if (!Array.isArray(domains))
+    return [];
+  return [...new Set(domains.filter((domain) => typeof domain === "string" && domain.length > 0 && /^[\x21-\x7E]+$/.test(domain) && !/[;'"]/.test(domain)))];
+}
+function safeInlineJSON(value) {
+  const json = JSON.stringify(value);
+  if (json === undefined)
+    return "undefined";
+  return json.replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
+function escapeHtml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}