pmx-canvas 0.1.28 → 0.1.29

package/dist/types/server/index.d.ts

@@ -21,6 +21,12 @@ export declare class PmxCanvas extends EventEmitter {
     start(options?: {
         open?: boolean;
         automationWebView?: boolean | CanvasAutomationWebViewOptions;
+        /**
+         * Bind a nearby free port when the preferred one is taken instead of
+         * failing. Default false (an explicit SDK port is honored exactly); the
+         * MCP auto-start opts in so a daemon already on the port can't crash it.
+         */
+        allowPortFallback?: boolean;
     }): Promise<void>;
     stop(): void;
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pmx-canvas",
-  "version": "0.1.28",
+  "version": "0.1.29",
   "description": "Spatial canvas workbench for coding agents — infinite 2D canvas with agent-native CLI, MCP integration, nodes, edges, file watching, and snapshots",
   "type": "module",
   "main": "./src/server/index.ts",

package/src/cli/agent.ts

@@ -1082,11 +1082,24 @@ const RESOURCE_COMMAND_ALIASES: Record<string, Record<string, string>> = {
     delete: 'remove',
     rm: 'remove',
   },
+  ax: {
+    // Single-subcommand AX groups: the bare verb maps to its only action so
+    // `ax event` / `ax evidence` suggest the full command instead of erroring.
+    event: 'event add',
+    evidence: 'evidence add',
+  },
 };
 const RESOURCE_SUBCOMMAND_HINTS: Record<string, Record<string, string>> = {
   node: {
     pin: 'Use the top-level pin command instead: pmx-canvas pin <node-id>',
   },
+  ax: {
+    // Multi-subcommand AX groups: point at the available actions.
+    host: 'Pick an action: pmx-canvas ax host report | pmx-canvas ax host status',
+    work: 'Pick an action: pmx-canvas ax work add | update | list',
+    approval: 'Pick an action: pmx-canvas ax approval request | resolve | list',
+    review: 'Pick an action: pmx-canvas ax review add | list',
+  },
 };
 
 function cmd(

package/src/client/nodes/LedgerNode.tsx

@@ -1,12 +1,25 @@
 import type { CanvasNodeState } from '../types';
 
+// Layout/internal metadata that lives in node.data but is not ledger content.
+const HIDDEN_LEDGER_KEYS = new Set(['title', '__type', 'content', 'strictSize', 'arrangeLocked']);
+
 export function LedgerNode({ node }: { node: CanvasNodeState }) {
   const data = node.data as Record<string, unknown>;
 
-  // Render key-value pairs from ledger summary
-  const entries = Object.entries(data).filter(([key]) => key !== 'title' && key !== '__type');
+  // Body text renders as a log: one line per entry. CLI flags frequently deliver
+  // a literal "\n" (backslash-n, the shell does not expand it inside quotes)
+  // rather than a real newline, so split on both — plus CR/CRLF — instead of
+  // dropping the whole string on one wrapped line.
+  const rawContent = typeof data.content === 'string' ? data.content : '';
+  const lines = rawContent
+    .split(/\r\n|\r|\n|\\n/)
+    .map((line) => line.trimEnd())
+    .filter((line) => line.length > 0);
+
+  // Any remaining non-internal keys render as structured key/value rows.
+  const entries = Object.entries(data).filter(([key]) => !HIDDEN_LEDGER_KEYS.has(key));
 
-  if (entries.length === 0) {
+  if (lines.length === 0 && entries.length === 0) {
     return (
       <div style={{ color: 'var(--c-dim)', fontSize: '12px', fontStyle: 'italic' }}>No ledger data</div>
     );
@@ -14,20 +27,41 @@ export function LedgerNode({ node }: { node: CanvasNodeState }) {
 
   return (
     <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', fontSize: '12px' }}>
+      {lines.length > 0 && (
+        <div style={{ display: 'flex', flexDirection: 'column' }}>
+          {lines.map((line, i) => (
+            <div
+              key={i}
+              style={{
+                padding: '3px 0',
+                borderBottom: i < lines.length - 1 ? '1px solid rgba(45,55,90,0.3)' : 'none',
+                color: 'var(--c-text)',
+                fontFamily: 'var(--mono)',
+                fontSize: '11px',
+                whiteSpace: 'pre-wrap',
+                wordBreak: 'break-word',
+              }}
+            >
+              {line}
+            </div>
+          ))}
+        </div>
+      )}
       {entries.map(([key, value]) => (
         <div
           key={key}
           style={{
             display: 'flex',
             justifyContent: 'space-between',
+            gap: '8px',
             padding: '3px 0',
             borderBottom: '1px solid rgba(45,55,90,0.3)',
           }}
         >
-          <span style={{ color: 'var(--c-muted)', fontSize: '11px' }}>
+          <span style={{ color: 'var(--c-muted)', fontSize: '11px', flexShrink: 0 }}>
             {key.replace(/([A-Z])/g, ' $1').replace(/^./, (s) => s.toUpperCase())}
           </span>
-          <span style={{ color: 'var(--c-text)', fontFamily: 'var(--mono)', fontSize: '11px' }}>
+          <span style={{ color: 'var(--c-text)', fontFamily: 'var(--mono)', fontSize: '11px', textAlign: 'right', wordBreak: 'break-word' }}>
             {typeof value === 'object' ? JSON.stringify(value) : String(value ?? '—')}
           </span>
         </div>

package/src/json-render/server.ts

@@ -563,6 +563,20 @@ function collectDataKeys(data: Array<Record<string, unknown>>): Set<string> {
   return keys;
 }
 
+/**
+ * Pick the first candidate key that actually exists in the data. Lets a chart
+ * accept a conventional synonym (e.g. a bullet chart's "actual" measure as well
+ * as "value") without an explicit valueKey, instead of failing the data-key
+ * check on a reasonable guess.
+ */
+function firstPresentDataKey(
+  data: Array<Record<string, unknown>>,
+  candidates: string[],
+): string | undefined {
+  const keys = collectDataKeys(data);
+  return candidates.find((key) => keys.has(key));
+}
+
 function assertGraphDataKeys(
   data: Array<Record<string, unknown>>,
   chartType: GraphChartType,
@@ -729,7 +743,10 @@ export function buildGraphSpec(input: GraphNodeInput): JsonRenderSpec {
     }
     case 'BulletChart': {
       chartProps.labelKey = input.labelKey ?? input.xKey ?? null;
-      chartProps.valueKey = input.valueKey ?? input.yKey ?? 'value';
+      // The measure column is conventionally "value", but bullet charts also
+      // call it "actual" — accept either when no valueKey is given.
+      chartProps.valueKey =
+        input.valueKey ?? input.yKey ?? firstPresentDataKey(input.data, ['value', 'actual']) ?? 'value';
       chartProps.targetKey = input.targetKey ?? null;
       chartProps.rangesKey = input.rangesKey ?? null;
       chartProps.color = input.color ?? null;

package/src/mcp/canvas-access.ts

@@ -1063,7 +1063,23 @@ export async function createCanvasAccess(): Promise<CanvasAccess> {
   const remoteBaseUrl = await findExistingCanvasServer(workspaceRoot, port);
   if (remoteBaseUrl) return new RemoteCanvasAccess(remoteBaseUrl);
 
+  // No same-workspace server to attach to. Allow a port fallback so a daemon
+  // already holding the preferred port (e.g. one serving a *different*
+  // workspace) doesn't crash this MCP/SDK session with EADDRINUSE — start our
+  // own canvas on a free port instead, and explain how to share one if intended.
   const canvas = createCanvas({ port });
-  await canvas.start({ open: true });
+  await canvas.start({ open: true, allowPortFallback: true });
+  const boundPort = canvas.port;
+  if (boundPort !== port) {
+    const occupant = await readHealth(`http://127.0.0.1:${port}`);
+    const occupantWorkspace =
+      typeof occupant?.workspace === 'string' ? ` (serving ${occupant.workspace})` : '';
+    // stderr only — stdout is the MCP stdio JSON-RPC channel.
+    process.stderr.write(
+      `[pmx-canvas] preferred port ${port} was in use${occupantWorkspace}; ` +
+        `started this canvas on port ${boundPort} instead. To share one canvas, run the daemon ` +
+        `from this workspace or set PMX_CANVAS_URL / PMX_CANVAS_PORT to point at it.\n`,
+    );
+  }
   return new LocalCanvasAccess(canvas, workspaceRoot, port);
 }

package/src/mcp/server.ts

@@ -263,13 +263,16 @@ function compactBatchResult(result: { ok: boolean; results: Array<Record<string,
 }
 
 async function createdNodePayload(c: CanvasAccess, id: string, options: { full?: boolean; verbose?: boolean; includeData?: boolean } = {}): Promise<Record<string, unknown>> {
+  // Expose both `id` and a `nodeId` alias on every node-create response so
+  // agents using either key (or a cached schema) work — matching the
+  // external-app / web-artifact responses that already return both.
   const node = await c.getNode(id);
-  if (!node) return { ok: true, id };
+  if (!node) return { ok: true, id, nodeId: id };
   if (!wantsFullPayload(options)) {
-    return { ok: true, node: compactNodePayload(node), id };
+    return { ok: true, node: compactNodePayload(node), id, nodeId: id };
   }
   const serialized = serializeCanvasNodeForAgent(node);
-  return { ok: true, node: serialized, ...serialized };
+  return { ok: true, node: serialized, ...serialized, nodeId: node.id };
 }
 
 function buildSummaryFromLayout(layout: Awaited<ReturnType<CanvasAccess['getLayout']>>, pinnedIds: string[]): Record<string, unknown> {

package/src/server/index.ts

@@ -130,8 +130,14 @@ export class PmxCanvas extends EventEmitter {
   async start(options?: {
     open?: boolean;
     automationWebView?: boolean | CanvasAutomationWebViewOptions;
+    /**
+     * Bind a nearby free port when the preferred one is taken instead of
+     * failing. Default false (an explicit SDK port is honored exactly); the
+     * MCP auto-start opts in so a daemon already on the port can't crash it.
+     */
+    allowPortFallback?: boolean;
   }): Promise<void> {
-    const base = startCanvasServer({ port: this._port, allowPortFallback: false });
+    const base = startCanvasServer({ port: this._port, allowPortFallback: options?.allowPortFallback ?? false });
     if (!base) {
       throw new Error(`Failed to start canvas server on port ${this._port}`);
     }