pmx-canvas 0.7.1 → 0.7.2

package/.github/extensions/pmx-canvas/extension.mjs

@@ -251,7 +251,19 @@ async function resolvePmxServer(ctxOrInput, options = {}) {
 
 async function resolvePanelTarget(ctx, options = {}) {
     const selected = panelTargets.get(ctx?.instanceId);
-    if (!selected) return await resolvePmxServer(ctx, options);
+    if (!selected) {
+        const panel = panelServers.get(ctx?.instanceId);
+        if (!panel) return await resolvePmxServer(ctx, options);
+        // A fallback panel still owns its original target. Action inputs may
+        // contain neither that URL nor its workspace, so never rediscover from them.
+        const resolved = await resolvePmxServer({
+            input: { ...panel.entry.input, ...(options.autoStart === true ? { autoStart: true } : {}) },
+            session: { workingDirectory: panel.entry.workspaceRoot },
+        }, options);
+        panel.entry.pmx = resolved;
+        rememberPanelTarget(ctx, resolved);
+        return resolved;
+    }
 
     const probe = await probeServer(selected.baseUrl, selected.workspaceRoot, {
         timeoutMs: options.timeoutMs ?? 2_000,
@@ -280,15 +292,9 @@ function escapeHtml(value) {
         .replaceAll('"', """);
 }
 
-function renderShell(instanceId, entry) {
-    const status = entry.pmx?.ok ? "Connected" : "Not connected";
-    // theme=light is a client-local session default matching the Copilot app's
-    // light chrome — it never changes the server-global theme other clients
-    // see, and the in-panel theme picker still overrides it.
-    const frameSrc = entry.pmx?.baseUrl ? `${entry.pmx.baseUrl}/workbench?theme=light` : "about:blank";
-    const error = entry.pmx?.error ? `<p class="error">${escapeHtml(entry.pmx.error)}</p>` : "";
+function renderShell(entry) {
     return `<!doctype html>
-<html>
+<html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -301,70 +307,83 @@ function renderShell(instanceId, entry) {
         font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
       }
       .shell {
-        display: grid;
-        grid-template-rows: auto 1fr;
-        height: 100vh;
+        max-width: 560px;
+        margin: 12vh auto;
+        padding: 24px;
       }
-      header {
+      .actions {
         display: flex;
-        align-items: center;
+        flex-wrap: wrap;
         gap: 12px;
-        padding: 10px 12px;
-        border-bottom: 1px solid var(--border-color-default, #30363d);
-        background: var(--background-color-muted, rgba(22, 27, 34, 0.95));
+        margin-top: 24px;
       }
-      strong { font-weight: var(--font-weight-semibold, 600); }
-      .status {
+      p { line-height: 1.6; overflow-wrap: anywhere; }
+      .workspace {
         color: var(--text-color-muted, #8b949e);
-        font-size: var(--text-body-small, 12px);
+        font-size: 13px;
       }
       .error {
-        margin: 0;
         color: var(--true-color-red, #ff7b72);
-        font-size: var(--text-body-small, 12px);
+        min-height: 24px;
       }
       button {
-        border: 1px solid var(--border-color-default, #30363d);
+        border: 1px solid var(--border-color-default, #6e7681);
         border-radius: 8px;
-        background: var(--background-color-default, #0d1117);
+        background: var(--background-color-muted, #21262d);
         color: inherit;
+        font: inherit;
         cursor: pointer;
-        padding: 6px 10px;
+        min-height: 40px;
+        padding: 8px 16px;
       }
-      button:hover {
+      button:hover, button:focus-visible {
         border-color: var(--color-focus-outline, #2f81f7);
       }
-      iframe {
-        width: 100%;
-        height: 100%;
-        border: 0;
-        background: #0d1117;
-      }
-      .spacer { flex: 1; }
+      button:disabled { opacity: 0.6; cursor: wait; }
     </style>
   </head>
   <body>
-    <div class="shell">
-      <header>
-        <strong>PMX Canvas</strong>
-        <span class="status">${escapeHtml(status)}${entry.pmx?.baseUrl ? ` · ${escapeHtml(entry.pmx.baseUrl)}` : ""}</span>
-        ${error}
-        <span class="spacer"></span>
-        <button type="button" onclick="refreshContext()">Refresh AX</button>
-        <button type="button" onclick="startServer()">Start server</button>
-      </header>
-      <iframe title="PMX Canvas workbench" src="${escapeHtml(frameSrc)}"></iframe>
-    </div>
+    <main class="shell">
+      <h1>Connect to PMX Canvas</h1>
+      <p>The workbench is not connected yet. Home and recent boards will appear when the server is available.</p>
+      <p class="workspace">Workspace: ${escapeHtml(entry.workspaceRoot)}</p>
+      <p class="workspace">Server: ${escapeHtml(candidateBaseUrls(entry.input)[0].baseUrl)}</p>
+      <p id="connection-status" class="error" role="status">${escapeHtml(entry.pmx?.error ?? "Checking connection…")}</p>
+      <div class="actions">
+        <button type="button" onclick="connect(false)">Check connection</button>
+        <button type="button" onclick="connect(true)">Start server</button>
+      </div>
+      <p class="workspace">This page checks for the server automatically. Start server launches a local server for this workspace.</p>
+    </main>
     <script>
-      async function startServer() {
-        await fetch('/start', { method: 'POST' });
-        window.location.reload();
-      }
-      async function refreshContext() {
-        const response = await fetch('/context');
-        const context = await response.json();
-        window.parent.postMessage({ type: 'pmx-canvas-ax-context', instanceId: ${JSON.stringify(instanceId)}, context }, '*');
+      let busy = false;
+      let timer;
+      async function connect(start) {
+        if (busy) return;
+        busy = true;
+        clearTimeout(timer);
+        const buttons = document.querySelectorAll('button');
+        buttons.forEach(button => button.disabled = true);
+        const status = document.getElementById('connection-status');
+        status.textContent = start ? 'Starting server…' : 'Checking connection…';
+        try {
+          const response = await fetch(start ? '/start' : '/status', { method: start ? 'POST' : 'GET', cache: 'no-store' });
+          const target = await response.json();
+          if (response.ok && target.ok && target.baseUrl) {
+            // Load the real workbench at its own origin, including its token,
+            // Home, boards, and relative API paths. The shell is not a proxy.
+            window.location.replace(target.baseUrl + '/workbench?theme=light');
+            return;
+          }
+          status.textContent = target.error || 'No matching PMX Canvas server is running.';
+        } catch (error) {
+          status.textContent = 'Connection check failed. Reopen the canvas if the adapter has stopped.';
+        }
+        busy = false;
+        buttons.forEach(button => button.disabled = false);
+        timer = setTimeout(() => connect(false), 2000);
       }
+      connect(false);
     </script>
   </body>
 </html>`;
@@ -378,7 +397,7 @@ async function readRequestJson(req) {
 }
 
 async function verifiedEntryTarget(entry) {
-    if (!entry.pmx?.baseUrl) return { ok: false, baseUrl: null, error: "PMX Canvas server is unavailable." };
+    if (!entry.pmx?.ok || !entry.pmx.baseUrl) return { ok: false, baseUrl: null, error: "PMX Canvas server is unavailable." };
     const probe = await probeServer(entry.pmx.baseUrl, entry.pmx.health.workspace, {
         timeoutMs: 2_000,
     });
@@ -401,18 +420,17 @@ async function startPanelServer(instanceId, ctx, pmx) {
         try {
             const url = new URL(req.url ?? "/", "http://127.0.0.1");
             if (req.method === "GET" && url.pathname === "/") {
-                res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
-                res.end(renderShell(instanceId, entry));
+                res.writeHead(200, { "Content-Type": "text/html; charset=utf-8", "Cache-Control": "no-store" });
+                res.end(renderShell(entry));
                 return;
             }
             if (req.method === "POST" && url.pathname === "/start") {
-                entry.pmx = await resolvePmxServer({ input: entry.input, session: { workingDirectory: entry.workspaceRoot } });
-                jsonResponse(res, 200, entry.pmx);
+                const latest = await resolvePanelTarget({ instanceId }, { autoStart: true });
+                jsonResponse(res, 200, latest);
                 return;
             }
             if (req.method === "GET" && url.pathname === "/status") {
-                const latest = await resolvePmxServer({ input: entry.input, session: { workingDirectory: entry.workspaceRoot } }, { autoStart: false });
-                entry.pmx = latest.ok ? latest : entry.pmx;
+                const latest = await resolvePanelTarget({ instanceId }, { autoStart: false });
                 jsonResponse(res, 200, latest);
                 return;
             }
@@ -545,7 +563,7 @@ async function recordInjectedContext(baseUrl, context, injected) {
 async function getAxStatus(ctx) {
     const resolved = await resolvePanelTarget(ctx, { autoStart: false });
     if (!resolved.ok || !resolved.baseUrl) return { ok: false, server: resolved };
-    const state = await fetchJson(resolved.baseUrl, "/api/canvas/ax", { timeoutMs: 2_000 });
+    const state = await fetchJson(resolved.baseUrl, "/api/canvas/ax?includeContext=false", { timeoutMs: 2_000 });
     return { ok: true, server: resolved, ax: state };
 }
 
@@ -718,7 +736,7 @@ const pmxCanvas = createCanvas({
     actions: [
         {
             name: "status",
-            description: "Return PMX Canvas server and AX state status for this workspace.",
+            description: "Return PMX Canvas server and AX state without serialized node context. Use get_ax_context for full pinned/focused context.",
             handler: async (ctx) => await getAxStatus(ctx),
         },
         {

package/CHANGELOG.md

@@ -3,7 +3,22 @@
 All notable changes to `pmx-canvas` are documented here. This project follows
 [Semantic Versioning](https://semver.org/).
 
-## [Unreleased]
+## [0.7.2] - 2026-09-30
+
+### Added
+
+- Agents can explicitly open a board before writing through MCP, CLI, HTTP, and SDK; board deletion remains human-only.
+
+### Fixed
+
+- Main-agent transport attaches reuse the attached host session, avoiding duplicate Copilot agents while keeping identified subagents separate.
+- HTML exports have clearer Markdown typography and tables, readable CSV/TSV previews, complete status and context text, and scrollable cards with keyboard-accessible reading views.
+- Original document attachments now avoid existing cards and each other without moving existing content.
+- Backup and restore commands reject unknown flags instead of silently ignoring them.
+- Amp setup instructions distinguish native MCP configuration from the browser portal.
+- Copilot's fallback panel reconnects to the full workbench and keeps adapter actions on the recovered server.
+- Copilot status omits serialized node context; full context remains available through `get_ax_context`.
+- Attachment, board-menu, card, and panel controls use consistently sized SVG icons instead of small font symbols.
 
 ## [0.7.1] - 2026-09-30
 

package/Readme.md

@@ -44,9 +44,11 @@ communication — proximity means relatedness, pinning means *focus here*.
 The database holds many named boards. **Home is the library view, not a board**:
 it lists recent boards and nested category paths (up to eight 60-character
 segments). Empty folders are not independent objects; they exist only while a
-board is filed beneath them. Only a human opens/switches or deletes a board.
-Agents may list, read, create, rename, categorize, search, and create an inactive
-board from selected reusable cards without disturbing the board in view. Home
+board is filed beneath them. Agents can explicitly open/switch boards; deletion
+remains human-only. Creating a board or a copy from reusable cards leaves it
+inactive. Agents open its returned ID before writing; this also switches the
+shared workbench the human sees. Agents may list, read, rename, categorize, and
+search boards without switching. Home
 provides a copy-preview dialog; an open board's command palette offers a
 board-link picker. Neither depends on native browser prompts.
 
@@ -387,9 +389,32 @@ the full workflow and live-test checklist.
 
 ### Use inside AMPCode orbs and the Amp portal
 
-Amp needs no adapter either. Run `pmx-canvas` as an orb service (the orb sets
+The portal and the agent's MCP connection are separate. For native Canvas tools,
+merge this into the workspace's `.amp/settings.json` (not `.mcp.json`):
+
+```json
+{
+  "amp.mcpServers": {
+    "canvas": {
+      "command": "bunx",
+      "args": ["pmx-canvas@0.7.2", "--mcp"]
+    }
+  }
+}
+```
+
+In the PMX product checkout, use `"command": "bun"` and
+`"args": ["run", "src/mcp/server.ts"]` to test the checked-out source instead.
+Reload MCP connections and complete any host trust prompt. Confirm Canvas tools
+are discoverable and the target `/health.workspace` and version match before
+mutating a board. If discovery is empty, inspect Amp's MCP connection status;
+an open portal or a successful standalone MCP handshake does not prove a native
+connection, skill activation, or steering delivery. See
+[Amp MCP configuration](https://ampcode.com/docs/customize/mcp).
+
+For the visible workbench, run `pmx-canvas` as an orb service (the orb sets
 `AMP_ORB` in the environment automatically) and open the workbench through the
-thread's portal URL. The zero-config recipe for the repo the orb runs in:
+thread's portal URL. A consumer-workspace service recipe:
 
 ```yaml
 # .amp/services.yaml — supervised portal service
@@ -403,7 +428,7 @@ services:
 ```bash
 # .agents/setup — install the CLI (pin the exact version: a fresh orb running
 # @latest can silently pick up a newer release than the one you validated)
-npm install -g pmx-canvas@0.7.1
+npm install -g pmx-canvas@0.7.2
 ```
 
 The server binds the portal-assigned `$PORT` automatically (gated on the

package/dist/canvas/global.css

@@ -760,6 +760,11 @@ body,
   border-radius: calc(3px * var(--node-chrome-scale, 1));
 }
 
+.canvas-node .node-controls button svg {
+  width: 1em;
+  height: 1em;
+}
+
 .canvas-node .node-controls button:hover {
   background: var(--c-surface-hover);
   color: var(--c-text);
@@ -1466,6 +1471,10 @@ body,
   animation: presence-pulse 1.4s ease-in-out infinite;
 }
 .session-collapse {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
   width: 26px;
   height: 26px;
   border: 1px solid transparent;
@@ -1682,8 +1691,9 @@ body,
   }
 }
 .session-section-chevron {
+  display: inline-flex;
+  flex-shrink: 0;
   color: var(--c-muted);
-  font-size: 13px;
   transition: transform 0.15s ease;
 }
 .session-section-chevron.is-open {
@@ -1966,8 +1976,13 @@ body,
   white-space: nowrap;
 }
 .command-bar-chip-unpin {
-  width: 14px;
-  height: 14px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  padding: 0;
+  width: 20px;
+  height: 20px;
   border: none;
   border-radius: 50%;
   background: none;
@@ -6896,7 +6911,7 @@ html.is-node-dragging .intent-line-layer {
   align-items: center;
   gap: 6px;
   max-width: 280px;
-  padding: 4px 8px;
+  padding: 6px 8px;
   margin-left: -8px;
   background: none;
   border: 1px solid transparent;
@@ -6914,7 +6929,8 @@ html.is-node-dragging .intent-line-layer {
   white-space: nowrap;
 }
 .board-switcher-caret {
-  font-size: 10px;
+  display: inline-flex;
+  flex-shrink: 0;
   color: var(--c-text-soft);
 }
 .board-switcher-menu {