codecaine-cli 0.1.2 → 0.1.3

package/README.md

@@ -1,6 +1,6 @@
 # codecaine-cli
 
-Connects the [Codecaine](https://editor.codecainehq.com) web editor to your
+Connects the [Codecaine](https://web.codecainehq.com) web editor to your
 machine.
 
 ```bash
@@ -43,7 +43,7 @@ companion prints.
 
 | | |
 | --- | --- |
-| `--editor <url>` | The editor's address (default `https://editor.codecainehq.com`) |
+| `--editor <url>` | The editor's address (default `https://web.codecainehq.com`) |
 | `--origin <a,b>` | More origins allowed to connect |
 | `--port <n>` | Default 4317 |
 | `--no-open` | Don't open the browser |

package/dist/cli.mjs

@@ -3718,7 +3718,7 @@ var require_websocket_server = __commonJS({
 
 // src/cli.ts
 import crypto4 from "node:crypto";
-import { spawn as spawn2, spawnSync } from "node:child_process";
+import { spawn as spawn2, spawnSync as spawnSync2 } from "node:child_process";
 import fs21 from "node:fs";
 import path20 from "node:path";
 import readline from "node:readline";
@@ -6494,6 +6494,17 @@ import os3 from "node:os";
 import path11 from "node:path";
 
 // ../editor/resources/bb-plugin/src/tools.ts
+var VECTOR_STYLE_SCHEMA = {
+  type: "object",
+  properties: {
+    stroke: { type: ["string", "null"], description: "A CSS colour, or null for none." },
+    fill: { type: ["string", "null"], description: "A CSS colour, or null for none." },
+    strokeWidth: { type: "number" },
+    cap: { type: "string", enum: ["butt", "round", "square"] },
+    join: { type: "string", enum: ["miter", "round", "bevel"] },
+    dashes: { type: "string", description: 'Dash and gap lengths, e.g. "4 2"; empty is solid.' }
+  }
+};
 var TARGET_SCHEMA = {
   type: "object",
   description: "Layer handle: id (preferred \u2014 returned by listLayers/createLayer) or a CSS-shaped selector over the design.",
@@ -6949,6 +6960,84 @@ var CANVAS_TOOLS = [
       }
     }
   },
+  {
+    name: "getVector",
+    description: "A drawing (made with the pen or drawVector) or a pasted <svg> icon, as the pen sees it: { id, viewBox, paths: [{ index, shape, closed, style, points: [{ x, y, in, out, mirror }] }] }. Points are in the drawing's own units (its viewBox); `in`/`out` are handles RELATIVE to their point (null = a corner); `mirror` is Figma's Mirroring: none, angle, or mirror (angle and length). Paths of one compound shape (a ring and its hole) share `shape`. Read this before drawVector operations, which name paths and points by these indices.",
+    inputSchema: {
+      type: "object",
+      properties: { target: TARGET_SCHEMA },
+      required: ["target"]
+    }
+  },
+  {
+    name: "drawVector",
+    description: "Draw with the pen: icons, logos, illustrations, arrows, isometric shapes \u2014 anything that is lines and curves rather than boxes. Without `target` it makes a new drawing on the board (or inside `parent`) from `paths`; with `target` it changes that drawing or pasted <svg> with `operations` (and adds any `paths`), all or nothing, in one undo step. A path is SVG path data `d`, or `points` [{ x, y, in?, out? }] with handles relative to each point (out: {x: 30, y: 0} pulls the curve 30px forward from the point) and `closed`. Units are px; the drawing's own 0,0 lands at `at` (clear space by default) and its box fits the paths. Operations, each the pen tool of the same name \u2014 segment i runs from point i to point i+1: move {path, point, to:{x,y}}; handles {path, point, in, out}; mirror {path, point, mode: none|angle|mirror}; bend {path, segment, t?, through:{x,y}} (bend the curve through a point); smooth / corner {path, point}; insert {path, segment, t?} (add a point); cut {path, point | segment, t?}; erase {path, segment}; delete {path, point?}; close / open {path}; paint {path, fill} (the paint bucket; fill null empties it); style {path?, style}; translate {path?, by:{x,y}}; add {path}. Answers the drawing read back, as getVector does \u2014 check it, and screenshot it with canvasScreenshot before saying it is done.",
+    inputSchema: {
+      type: "object",
+      properties: {
+        target: TARGET_SCHEMA,
+        paths: {
+          type: "array",
+          description: "Paths to draw (or to add to `target`).",
+          items: {
+            type: "object",
+            properties: {
+              d: { type: "string", description: 'SVG path data, e.g. "M0 0 L40 0 L20 30 Z".' },
+              points: {
+                type: "array",
+                items: {
+                  type: "object",
+                  properties: {
+                    x: { type: "number" },
+                    y: { type: "number" },
+                    in: { type: "object", description: "Incoming handle, relative to the point.", properties: { x: { type: "number" }, y: { type: "number" } } },
+                    out: { type: "object", description: "Outgoing handle, relative to the point.", properties: { x: { type: "number" }, y: { type: "number" } } }
+                  },
+                  required: ["x", "y"]
+                }
+              },
+              closed: { type: "boolean" },
+              style: VECTOR_STYLE_SCHEMA
+            }
+          }
+        },
+        style: { ...VECTOR_STYLE_SCHEMA, description: "Paint for every path that does not set its own. Defaults: stroke #1c1917, strokeWidth 2, no fill, round cap and join." },
+        operations: {
+          type: "array",
+          description: "Pen operations, applied in order after `paths` are added.",
+          items: {
+            type: "object",
+            properties: {
+              op: {
+                type: "string",
+                enum: ["add", "move", "handles", "mirror", "bend", "smooth", "corner", "insert", "cut", "erase", "delete", "close", "open", "paint", "style", "translate"]
+              },
+              path: { description: "A path index from getVector \u2014 or, for add, a path object like those in `paths`." },
+              point: { type: "number" },
+              segment: { type: "number" },
+              t: { type: "number", description: "Where along the segment, 0\u20131 (0.5 by default)." },
+              to: { type: "object", properties: { x: { type: "number" }, y: { type: "number" } } },
+              through: { type: "object", properties: { x: { type: "number" }, y: { type: "number" } } },
+              by: { type: "object", properties: { x: { type: "number" }, y: { type: "number" } } },
+              in: { type: ["object", "null"], properties: { x: { type: "number" }, y: { type: "number" } } },
+              out: { type: ["object", "null"], properties: { x: { type: "number" }, y: { type: "number" } } },
+              mode: { type: "string", enum: ["none", "angle", "mirror"] },
+              fill: { type: ["string", "null"] },
+              style: VECTOR_STYLE_SCHEMA
+            },
+            required: ["op"]
+          }
+        },
+        parent: { type: "string", description: "Id of the layer to draw a new drawing inside. Omit for the board." },
+        at: {
+          type: "object",
+          description: "Where a new drawing's 0,0 lands, in the parent's coordinates (the board's without one).",
+          properties: { x: { type: "number" }, y: { type: "number" } }
+        },
+        name: { type: "string", description: "The new drawing's layer name." }
+      }
+    }
+  },
   {
     name: "exportHtml",
     description: "The design as markup \u2014 the whole page, or one layer with `target`. This is the fastest way to read a document you are about to change. `responsive` and `states` emit the media queries and the :hover rules the design carries. Pictures are named `asset:media/images/<hash>.<ext>` (getLayer's `files` gives the path on disk); pass the name back in markup and it is the same picture. Anything still inline comes back as a short `media:\u2026` reference that works the same way. A `target` inside a running project answers that element as its page has it \u2014 its own classes and attributes, its computed look inline \u2014 which is what to copy when moving a block from one project to another.",
@@ -7205,13 +7294,13 @@ var SHOT_DIR = join2(tmpdir(), "canvas-agent-shots");
 var CANVAS_TOOL_GUIDE = [
   "THE DESIGN ON THE BOARD IS REACHED THROUGH THESE TOOLS, BY THESE NAMES:",
   CANVAS_TOOLS.map((tool) => tool.name).join(", ") + ".",
-  "Your provider may show them prefixed \u2014 `mcp__bb-bridge__listLayers` \u2014 as bb hands them over as a session MCP server named `bb-bridge`. Prefixed or not, they are the editor's own, already connected: there is nothing to start, connect, configure or open first.",
+  "Your provider may show them prefixed \u2014 `mcp__bb-bridge__listLayers` \u2014 as bb hands them over as a session MCP server named `bb-bridge`. Prefixed or not, they are the editor's own, already connected: nothing to start, connect, configure or open first.",
   "It is the NAME that makes a tool this design's, never the prefix. A tool not listed above does not touch this design, however it sounds. Never use one for work on this board, or to explain a failure on it.",
   "THE BOARD SHOWS WHAT YOU ARE DOING. Every write you make already puts a band of colour round the layer for a few seconds. holdLayer is the longer claim: it keeps a layer for a whole job, says what you are doing to it, and refuses the person's edits meanwhile. Take one before your first change when you are REWRITING it \u2014 redesigning, restyling, replacing its insides \u2014 so nobody edits under a half-applied change. Reading takes nothing; nor do variants BESIDE one, which are new layers.",
   "Release before your turn ends even when you are giving up, a tool failed, or you are handing the question back \u2014 say so. askAboutLayer keeps the hold and puts your question on the board; holdLayer picks it back up. The person can take a layer back with the button beside its name, and a hold whose assistant goes quiet frees itself; getLayer reports the run on a layer, and an edit to one no longer held still lands.",
   "If a tool reports it cannot reach the editor, the tool has already retried: report its message as it stands \u2014 do not assume more than it says \u2014 and stop. If the tools are missing from this session altogether, say THAT, plainly, first. In neither case substitute another application's tools or edit the design's files: the editor overwrites them.",
   "WRITE ORDINARY WEB MARKUP. replaceLayer and insertHtml take any HTML \u2014 sections, tables, svg, canvas, forms with real inputs. Lay it out with flexbox and grid, which the inspector edits; absolute positioning only on the outermost element the board places. Linked stylesheets are ignored. Behaviour goes on a layer in a webpage (updateLayer's `script`, or script tags in markup) and runs in Interact and Preview with `element` as that layer, never on the canvas.",
-  "TO SEE AN EFFECT WORK: setPageView (in-view, motion playing), then observePage to read it or canvasPointer to use it with a real mouse. Restructure as a drag would with moveLayer, groupLayers and duplicateLayers.",
+  "TO SEE AN EFFECT WORK: setPageView (in-view, motion playing), then observePage to read it or canvasPointer to use it with a real mouse. Restructure like a drag with moveLayer, groupLayers and duplicateLayers.",
   "A LIVE PROJECT ON THIS MACHINE (localhost, LAN): a change asked for there is done only once SAVED in its source \u2014 a layer-tool edit is discarded at the next rebuild. Write it as the project's own code: the component or stylesheet that renders it, its Tailwind classes and theme variables, no inline styles or hard-coded colours. Then check LIGHT AND DARK MODE: every colour from a token with a value for each (listVariables; a new one gets both), and look at the page in each (setPageView theme light, then dark, then system) before saying done. A page served from the web has no source here: say so.",
   "COPYING BETWEEN LIVE PROJECTS: a copy is the original, never a redesign. Read it in its source project first; keep its markup, words, data and look. Each colour, size, radius, shadow and font becomes var(--name) holding that same value: the target's own (listVariables) only if equal, else a new one (setVariable).",
   'Start by looking: getSelection is what the person is pointing at when they say "this"; listLayers gives bearings; listVariables gives the design system behind it \u2014 change a shared colour there, not on every layer.'
@@ -10504,7 +10593,7 @@ function assistantStartingPage() {
 </head>
 <body>
   <h1 id="title">Starting the assistant\u2026</h1>
-  <p id="what">The first time, it downloads (about 240 MB) \u2014 after that it starts in seconds.</p>
+  <p id="what">The first time, it downloads the assistant \u2014 after that it starts in seconds.</p>
   <div class="bar unknown" id="bar"><div class="fill" id="fill"></div></div>
   <p class="note" id="note"></p>
   <p class="error" id="error" hidden></p>
@@ -10540,7 +10629,7 @@ function assistantStartingPage() {
 }
 
 // src/bb.ts
-import { spawn } from "node:child_process";
+import { spawn, spawnSync } from "node:child_process";
 import fs19 from "node:fs";
 import path18 from "node:path";
 
@@ -11252,6 +11341,55 @@ var BbClient = class {
   }
 };
 
+// ../editor/electron/process-tree.ts
+import { execFileSync } from "node:child_process";
+function descendantsOf(table, root) {
+  const children = /* @__PURE__ */ new Map();
+  for (const [pid, ppid] of table) {
+    if (pid === ppid) continue;
+    const list = children.get(ppid) ?? [];
+    list.push(pid);
+    children.set(ppid, list);
+  }
+  const out = [];
+  const seen = /* @__PURE__ */ new Set([root]);
+  const queue = [root];
+  while (queue.length) {
+    const next = queue.shift();
+    for (const child of children.get(next) ?? []) {
+      if (seen.has(child)) continue;
+      seen.add(child);
+      out.push(child);
+      queue.push(child);
+    }
+  }
+  return out;
+}
+function readProcessTable() {
+  try {
+    const text3 = execFileSync("ps", ["-A", "-o", "pid=,ppid="], { encoding: "utf8", timeout: 2e3 });
+    const rows = [];
+    for (const line of text3.split("\n")) {
+      const [pid, ppid] = line.trim().split(/\s+/).map(Number);
+      if (Number.isInteger(pid) && Number.isInteger(ppid)) rows.push([pid, ppid]);
+    }
+    return rows;
+  } catch {
+    return [];
+  }
+}
+function killProcessTree(root, deps = {}) {
+  const kill = deps.kill ?? ((pid, signal) => process.kill(pid, signal));
+  const pids = [root, ...descendantsOf((deps.table ?? readProcessTable)(), root)];
+  for (const pid of pids) {
+    try {
+      kill(pid, "SIGKILL");
+    } catch {
+    }
+  }
+  return pids;
+}
+
 // ../editor/electron/bb/supervisor.ts
 var BB_APP_VERSION = "0.42.1";
 var BB_DEFAULT_SERVER_PORT = 38886;
@@ -11512,6 +11650,31 @@ ${stderr.trim()}` : "";
   deps.log(`[bb] server ready on :${serverPort} (host ${host.id})`);
   return handle;
 }
+var STOP_GRACE_MS = 13e3;
+async function stopBbServer(options = {}) {
+  adopted = null;
+  const targets = [owned, launching].filter((t) => t !== null);
+  owned = null;
+  launching = null;
+  await Promise.all(targets.map((t) => stopLauncher(t.child, t.exited, options)));
+}
+async function stopLauncher(child, exited, options) {
+  if (childExited.has(child)) return;
+  try {
+    child.kill("SIGTERM");
+  } catch {
+  }
+  let timer;
+  const stopped = await Promise.race([
+    exited.then(() => true),
+    new Promise((resolve3) => {
+      timer = setTimeout(() => resolve3(false), options.graceMs ?? STOP_GRACE_MS);
+    })
+  ]);
+  clearTimeout(timer);
+  if (stopped || child.pid === void 0) return;
+  (options.killTree ?? ((pid) => void killProcessTree(pid)))(child.pid);
+}
 
 // ../editor/electron/bb/canvas-tools.ts
 import fs16 from "node:fs";
@@ -11863,6 +12026,13 @@ async function canvasToolsConnection(send2, args2 = {}, deps = {}) {
     return { connected: false, projects: [] };
   }
 }
+async function stopCanvasTools() {
+  pending2 = null;
+  lastError = null;
+  const current = server;
+  server = null;
+  if (current) await current.stop();
+}
 function canvasToolsStatus() {
   return { connected: server !== null, url: server?.url ?? null, error: lastError };
 }
@@ -11960,6 +12130,8 @@ var CANVAS_TOOL_STEPS = {
   listElementTypes: "Reading the elements",
   getCanvasScene: "Reading a 3D scene",
   setCanvasScene: "Building a 3D scene",
+  getVector: "Reading a drawing",
+  drawVector: "Drawing with the pen",
   exportHtml: "Reading the markup",
   listVariables: "Reading the variables",
   setVariable: "Setting a variable",
@@ -12584,6 +12756,18 @@ function installBb(onProgress) {
     });
   });
 }
+function stopWhateverIsOnOurPorts() {
+  if (process.platform === "win32") return;
+  for (const port of [BB_SERVER_PORT, BB_DAEMON_PORT]) {
+    const found = spawnSync("lsof", ["-ti", `tcp:${port}`, "-sTCP:LISTEN"], { encoding: "utf8" });
+    for (const pid of String(found.stdout ?? "").split(/\s+/).filter(Boolean)) {
+      try {
+        process.kill(Number(pid), "SIGTERM");
+      } catch {
+      }
+    }
+  }
+}
 function createAssistant(ipc, onState = () => {
 }) {
   isolate();
@@ -12798,7 +12982,17 @@ function createAssistant(ipc, onState = () => {
       return fail(error);
     }
   });
-  return { state: () => state, ready };
+  async function stop() {
+    await pending3?.catch(() => {
+    });
+    await stopCanvasTools().catch(() => {
+    });
+    await stopBbServer().catch(() => {
+    });
+    stopWhateverIsOnOurPorts();
+    set({ phase: "idle", percent: null, message: "Stopped", error: null });
+  }
+  return { state: () => state, ready, stop };
 }
 async function assistantTarget(cwd, threadId, home) {
   const target = await bbWorkspaceUrl(cwd, {}, threadId, home);
@@ -12878,7 +13072,7 @@ function decode(text3) {
 }
 
 // src/server.ts
-var VERSION = "0.1.2";
+var VERSION = "0.1.3";
 var LOOPBACK = /* @__PURE__ */ new Set(["localhost", "127.0.0.1", "[::1]", "::1"]);
 var MAX_BODY_BYTES2 = 8 * 1024 * 1024;
 function hostIsLocal(host) {
@@ -12939,7 +13133,12 @@ async function startCompanion(options) {
     ["bb:new-thread", "bb:send", "bb:send-thread", "bb:workspace-url"].map((channel) => [channel, ipc.get(channel)])
   );
   const useAssistant = options.assistant !== false;
-  const assistant = useAssistant ? createAssistant(ipc) : { state: () => ({ phase: "failed", percent: null, message: "Off", error: "The assistant is off (--no-assistant)." }), ready: () => Promise.reject(new Error("The assistant is off (--no-assistant).")) };
+  const assistant = useAssistant ? createAssistant(ipc) : {
+    state: () => ({ phase: "failed", percent: null, message: "Off", error: "The assistant is off (--no-assistant)." }),
+    ready: () => Promise.reject(new Error("The assistant is off (--no-assistant).")),
+    stop: async () => {
+    }
+  };
   for (const [channel, inboxHandler] of Object.entries(viaInbox)) {
     if (channel === "bb:workspace-url") continue;
     const bbHandler = ipc.get(channel);
@@ -12948,6 +13147,25 @@ async function startCompanion(options) {
       return answer?.ok === false && assistant.state().phase === "failed" ? inboxHandler(...args2) : answer;
     });
   }
+  const status = () => ({
+    version: VERSION,
+    assistant: useAssistant ? assistant.state() : null,
+    agent: agent.inbox.connected()
+  });
+  const stopEverything = async () => {
+    await assistant.stop().catch(() => {
+    });
+    options.onStopRequested?.();
+  };
+  ipc.handle("companion:status", async () => status());
+  ipc.handle("companion:stop-assistant", async () => {
+    await assistant.stop();
+    return status();
+  });
+  ipc.handle("companion:stop", async () => {
+    setTimeout(() => void stopEverything(), 200);
+    return { ok: true };
+  });
   const startingUrl = (cwd, threadId, home) => `http://127.0.0.1:${port}/agent/${pageKey}/starting?` + new URLSearchParams({ cwd, ...threadId ? { thread: threadId } : {}, ...home ? { home: "1" } : {} }).toString();
   ipc.handle("bb:workspace-url", async (args2) => {
     if (!useAssistant) return viaInbox["bb:workspace-url"](args2);
@@ -13043,6 +13261,12 @@ async function startCompanion(options) {
       });
       return json(response, 200, assistant.state());
     }
+    if (url.pathname === "/companion/stop" && request.method === "POST") {
+      if (!agentAllowed(request, response)) return;
+      json(response, 200, { ok: true, version: VERSION });
+      setTimeout(() => void stopEverything(), 200);
+      return;
+    }
     if (url.pathname === "/assistant/state") {
       if (!agentAllowed(request, response)) return;
       return json(response, 200, assistant.state());
@@ -13244,8 +13468,12 @@ function guestCandidates(here2) {
 
 // src/cli.ts
 var DEFAULT_PORT = 4317;
-var DEFAULT_EDITOR = "https://celebrated-souffle-e3f7bf.netlify.app";
-var PUBLISHED_ORIGINS = ["https://editor.codecainehq.com", "https://celebrated-souffle-e3f7bf.netlify.app"];
+var DEFAULT_EDITOR = "https://web.codecainehq.com";
+var PUBLISHED_ORIGINS = [
+  "https://web.codecainehq.com",
+  "https://editor.codecainehq.com",
+  "https://celebrated-souffle-e3f7bf.netlify.app"
+];
 var here = path20.dirname(fileURLToPath3(import.meta.url));
 function flag(args2, name) {
   const at = args2.indexOf(name);
@@ -13295,6 +13523,10 @@ async function serve(args2) {
   }
   restoreOpenFolders();
   const token = mcpToken();
+  let closing = null;
+  const stop = () => {
+    closing ??= companion.close().then(() => process.exit(0));
+  };
   const companion = await startCompanion({
     port,
     editorUrl,
@@ -13302,7 +13534,8 @@ async function serve(args2) {
     guestFile,
     mcpToken: token,
     openBrowser,
-    assistant: !args2.includes("--no-assistant") && process.env.CODECAINE_NO_ASSISTANT !== "1"
+    assistant: !args2.includes("--no-assistant") && process.env.CODECAINE_NO_ASSISTANT !== "1",
+    onStopRequested: () => stop()
   });
   writeState({ pid: process.pid, port: companion.port, mcpPort: companion.port, mcpToken: token, version: VERSION });
   if (folder) {
@@ -13327,7 +13560,6 @@ async function serve(args2) {
     ].join("\n")
   );
   if (!quiet) openBrowser(editorUrl);
-  const stop = () => void companion.close().then(() => process.exit(0));
   process.on("SIGINT", stop);
   process.on("SIGTERM", stop);
 }
@@ -13450,13 +13682,29 @@ async function setup(args2) {
   say(`codecaine ${VERSION} \u2014 setting up this machine for Codecaine
 `);
   say("1/3  Starting the companion\u2026");
+  const running = readState();
+  if (running && running.version !== VERSION && await health(running.port)) {
+    say(`     Replacing the running companion (${running.version}) with ${VERSION}\u2026`);
+    await fetch(`http://127.0.0.1:${running.port}/companion/stop`, {
+      method: "POST",
+      headers: { authorization: `Bearer ${running.mcpToken}` }
+    }).catch(() => {
+    });
+    const until = Date.now() + 1e4;
+    while (Date.now() < until && await health(running.port)) await new Promise((r) => setTimeout(r, 300));
+    if (await health(running.port)) {
+      say(`     The running companion (${running.version}) did not stop by itself.`);
+      say("     Stop it \u2014 Ctrl+C in the terminal it is running in \u2014 then run this again.");
+      process.exit(1);
+    }
+  }
   const state = await ensureCompanion();
   if (!state) {
     say("     It did not start. Run `npx codecaine-cli` to see why.");
     process.exit(1);
   }
   say(`     Running on http://127.0.0.1:${state.port}`);
-  say("2/3  Getting the assistant ready (the first time it downloads about 240 MB)\u2026");
+  say("2/3  Getting the assistant ready (the first time it downloads it)\u2026");
   const headers = { authorization: `Bearer ${state.mcpToken}` };
   const base = `http://127.0.0.1:${state.port}`;
   let assistant = await (await fetch(`${base}/assistant/start`, { method: "POST", headers })).json();
@@ -13486,14 +13734,14 @@ async function setup(args2) {
     say("     Ready \u2014 it is the Agent panel in the editor.");
   }
   say("3/3  Connecting your coding agent over MCP\u2026");
-  const has = (command) => spawnSync(process.platform === "win32" ? "where" : "which", [command], { stdio: "ignore" }).status === 0;
+  const has = (command) => spawnSync2(process.platform === "win32" ? "where" : "which", [command], { stdio: "ignore" }).status === 0;
   if (args2.includes("--no-mcp")) {
     say("     Skipped (--no-mcp). Add the command `npx -y codecaine-cli mcp` as an MCP server whenever you want.");
   } else if (has("claude")) {
-    if (spawnSync("claude", ["mcp", "get", "codecaine"], { stdio: "ignore" }).status === 0) {
+    if (spawnSync2("claude", ["mcp", "get", "codecaine"], { stdio: "ignore" }).status === 0) {
       say("     Claude Code already has it.");
     } else {
-      const added = spawnSync("claude", ["mcp", "add", "codecaine", "-s", "user", "--", "npx", "-y", "codecaine-cli", "mcp"], { stdio: "ignore" });
+      const added = spawnSync2("claude", ["mcp", "add", "codecaine", "-s", "user", "--", "npx", "-y", "codecaine-cli", "mcp"], { stdio: "ignore" });
       say(added.status === 0 ? "     Added to Claude Code. Restart Claude Code to load it." : "     Could not add it to Claude Code; run: claude mcp add codecaine -- npx -y codecaine-cli mcp");
     }
   } else {

package/dist/resources/bb-plugin/src/server.ts

@@ -237,7 +237,7 @@ export const CANVAS_TOOL_GUIDE = [
   CANVAS_TOOLS.map((tool) => tool.name).join(", ") + ".",
   "Your provider may show them prefixed — `mcp__bb-bridge__listLayers` — as bb hands them " +
     "over as a session MCP server named `bb-bridge`. Prefixed or not, they are the editor's own, " +
-    "already connected: there is nothing to start, connect, configure or open first.",
+    "already connected: nothing to start, connect, configure or open first.",
   "It is the NAME that makes a tool this design's, never the prefix. A tool not listed above " +
     "does not touch this design, however it sounds. " +
     "Never use one for work on this board, or to explain a failure on it.",
@@ -262,7 +262,7 @@ export const CANVAS_TOOL_GUIDE = [
     "Behaviour goes on a layer in a webpage (updateLayer's `script`, or script tags in markup) " +
     "and runs in Interact and Preview with `element` as that layer, never on the canvas.",
   "TO SEE AN EFFECT WORK: setPageView (in-view, motion playing), then observePage to read it or " +
-    "canvasPointer to use it with a real mouse. Restructure as a drag would with moveLayer, " +
+    "canvasPointer to use it with a real mouse. Restructure like a drag with moveLayer, " +
     "groupLayers and duplicateLayers.",
   "A LIVE PROJECT ON THIS MACHINE (localhost, LAN): a change asked for there is done only once " +
     "SAVED in its source — a layer-tool edit is discarded at the next rebuild. Write it as the " +

package/dist/resources/bb-plugin/src/tools.ts

@@ -17,6 +17,19 @@
 /** Which layer a tool is about. An id is exact; a selector is the fallback for
  *  an agent that has only read the markup — see docs/canvas-api.md for the
  *  grammar it accepts. */
+/** A path's paint, as the pen's Vector panel sets it. */
+const VECTOR_STYLE_SCHEMA = {
+  type: "object",
+  properties: {
+    stroke: { type: ["string", "null"], description: "A CSS colour, or null for none." },
+    fill: { type: ["string", "null"], description: "A CSS colour, or null for none." },
+    strokeWidth: { type: "number" },
+    cap: { type: "string", enum: ["butt", "round", "square"] },
+    join: { type: "string", enum: ["miter", "round", "bevel"] },
+    dashes: { type: "string", description: "Dash and gap lengths, e.g. \"4 2\"; empty is solid." },
+  },
+} as const;
+
 export const TARGET_SCHEMA = {
   type: "object",
   description:
@@ -541,6 +554,89 @@ export const CANVAS_TOOLS = [
       },
     },
   },
+  {
+    name: "getVector",
+    description:
+      "A drawing (made with the pen or drawVector) or a pasted <svg> icon, as the pen sees it: { id, viewBox, paths: [{ index, shape, closed, style, points: [{ x, y, in, out, mirror }] }] }. Points are in the drawing's own units (its viewBox); `in`/`out` are handles RELATIVE to their point (null = a corner); `mirror` is Figma's Mirroring: none, angle, or mirror (angle and length). Paths of one compound shape (a ring and its hole) share `shape`. Read this before drawVector operations, which name paths and points by these indices.",
+    inputSchema: {
+      type: "object",
+      properties: { target: TARGET_SCHEMA },
+      required: ["target"],
+    },
+  },
+  {
+    name: "drawVector",
+    description:
+      "Draw with the pen: icons, logos, illustrations, arrows, isometric shapes — anything that is lines and curves rather than boxes. Without `target` it makes a new drawing on the board (or inside `parent`) from `paths`; with `target` it changes that drawing or pasted <svg> with `operations` (and adds any `paths`), all or nothing, in one undo step. " +
+      "A path is SVG path data `d`, or `points` [{ x, y, in?, out? }] with handles relative to each point (out: {x: 30, y: 0} pulls the curve 30px forward from the point) and `closed`. Units are px; the drawing's own 0,0 lands at `at` (clear space by default) and its box fits the paths. " +
+      "Operations, each the pen tool of the same name — segment i runs from point i to point i+1: move {path, point, to:{x,y}}; handles {path, point, in, out}; mirror {path, point, mode: none|angle|mirror}; bend {path, segment, t?, through:{x,y}} (bend the curve through a point); smooth / corner {path, point}; insert {path, segment, t?} (add a point); cut {path, point | segment, t?}; erase {path, segment}; delete {path, point?}; close / open {path}; paint {path, fill} (the paint bucket; fill null empties it); style {path?, style}; translate {path?, by:{x,y}}; add {path}. " +
+      "Answers the drawing read back, as getVector does — check it, and screenshot it with canvasScreenshot before saying it is done.",
+    inputSchema: {
+      type: "object",
+      properties: {
+        target: TARGET_SCHEMA,
+        paths: {
+          type: "array",
+          description: "Paths to draw (or to add to `target`).",
+          items: {
+            type: "object",
+            properties: {
+              d: { type: "string", description: "SVG path data, e.g. \"M0 0 L40 0 L20 30 Z\"." },
+              points: {
+                type: "array",
+                items: {
+                  type: "object",
+                  properties: {
+                    x: { type: "number" },
+                    y: { type: "number" },
+                    in: { type: "object", description: "Incoming handle, relative to the point.", properties: { x: { type: "number" }, y: { type: "number" } } },
+                    out: { type: "object", description: "Outgoing handle, relative to the point.", properties: { x: { type: "number" }, y: { type: "number" } } },
+                  },
+                  required: ["x", "y"],
+                },
+              },
+              closed: { type: "boolean" },
+              style: VECTOR_STYLE_SCHEMA,
+            },
+          },
+        },
+        style: { ...VECTOR_STYLE_SCHEMA, description: "Paint for every path that does not set its own. Defaults: stroke #1c1917, strokeWidth 2, no fill, round cap and join." },
+        operations: {
+          type: "array",
+          description: "Pen operations, applied in order after `paths` are added.",
+          items: {
+            type: "object",
+            properties: {
+              op: {
+                type: "string",
+                enum: ["add", "move", "handles", "mirror", "bend", "smooth", "corner", "insert", "cut", "erase", "delete", "close", "open", "paint", "style", "translate"],
+              },
+              path: { description: "A path index from getVector — or, for add, a path object like those in `paths`." },
+              point: { type: "number" },
+              segment: { type: "number" },
+              t: { type: "number", description: "Where along the segment, 0–1 (0.5 by default)." },
+              to: { type: "object", properties: { x: { type: "number" }, y: { type: "number" } } },
+              through: { type: "object", properties: { x: { type: "number" }, y: { type: "number" } } },
+              by: { type: "object", properties: { x: { type: "number" }, y: { type: "number" } } },
+              in: { type: ["object", "null"], properties: { x: { type: "number" }, y: { type: "number" } } },
+              out: { type: ["object", "null"], properties: { x: { type: "number" }, y: { type: "number" } } },
+              mode: { type: "string", enum: ["none", "angle", "mirror"] },
+              fill: { type: ["string", "null"] },
+              style: VECTOR_STYLE_SCHEMA,
+            },
+            required: ["op"],
+          },
+        },
+        parent: { type: "string", description: "Id of the layer to draw a new drawing inside. Omit for the board." },
+        at: {
+          type: "object",
+          description: "Where a new drawing's 0,0 lands, in the parent's coordinates (the board's without one).",
+          properties: { x: { type: "number" }, y: { type: "number" } },
+        },
+        name: { type: "string", description: "The new drawing's layer name." },
+      },
+    },
+  },
   {
     name: "exportHtml",
     description:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codecaine-cli",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Connects the Codecaine web editor to this machine: project folders, live projects, and an MCP server for your coding agent.",
   "type": "module",
   "bin": {