Merge remote-tracking branch 'origin/jump-to' into magic-pen

# Conflicts:
#	canvas/src/ChatPanel.tsx
#	canvas/src/canvasAttach.tsx
#	canvas/src/canvasChrome.tsx
#	canvas/src/canvasClicks.ts

Author: Jing-yilin

AGENTS.md

@@ -103,7 +103,11 @@ Rules inside a canvas folder:
   behind the tokens.
 - Commit `assets.json` where a folder has one (three do). It is a
   `name → data URI` map of pre-encoded images the generator inlines, not
-  evidence.
+  evidence. The canvas's inspector names a board's images by content, from
+  `assets/` first and `assets.json` second, so a re-encoded image that
+  matches neither falls back to its `alt`. It names an inline `<svg>` the
+  same way from `assets/icons/`, by its geometry rather than its bytes, and
+  hands it back as a vector asset.
 - Never commit `ref-*.html` or `assets/refs/`. They hold third-party
   captures, the root `.gitignore` already excludes them, and the
   sp-clone-prototype skill rebuilds them. `spotify-ios` is the exception: its

CONTRIBUTING.md

@@ -157,4 +157,7 @@ through private vulnerability reporting; see `SECURITY.md`.
 ## License
 
 By contributing you agree that your contribution is licensed under the
-Apache License 2.0, the same as the rest of the repository.
+Apache License 2.0, the same as the rest of the repository, and you grant
+ReScience Lab Inc. a perpetual, worldwide, royalty-free, irrevocable license to
+use, modify, sublicense and relicense it under any terms, including in its
+commercial editions. You confirm the contribution is yours to give.

LICENSE

@@ -186,7 +186,7 @@
       same "printed page" as the copyright notice for easier
       identification within third-party archives.
 
-   Copyright 2026 ReScience Lab
+   Copyright 2026 ReScience Lab Inc.
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.

README.md

@@ -263,12 +263,32 @@ version's section in `RELEASE-NOTES.md`, then merge: the tag
 The whole procedure, including what to do when a step fails, is under "Cutting a
 release" in `CONTRIBUTING.md`.
 
+## Commercial edition
+
+This repo is the open-source edition, free to use. A commercial edition is
+packaged and supported for studios and teams, from ReScience Lab Inc.
+Pricing is by conversation: write to
+[yilin.jing@rescience.com](mailto:yilin.jing@rescience.com) with your team size
+and what you want to use it for.
+
 ## Licence
 
-This repo is Apache-2.0 (see `LICENSE`).
+This repo is Apache-2.0 (see `LICENSE`), © ReScience Lab Inc.
+
+**Third-party material is not.** The community projects in `canvases/` carry
+screenshots, logos, app-store images and other brand assets of the products
+they study. Those belong to their owners, are not licensed under Apache-2.0
+here, and are included only to research and demonstrate the method. ReScience
+Lab Inc. is not affiliated with or endorsed by any of those companies. None of
+this material ships in the desktop app, which has bundled only
+`canvases/templates` since 1.7.0, or in the commercial edition. The one
+third-party image that does ship is the iPhone shell in `canvases/templates`,
+from a Figma Community mockup and under that file's own terms. To have
+something taken down, write to
+[yilin.jing@rescience.com](mailto:yilin.jing@rescience.com).
 
 **The tldraw SDK it depends on is not.** tldraw ships under the
 [tldraw licence](https://github.com/tldraw/tldraw/blob/main/LICENSE.md): free
-to use with the tldraw watermark visible, paid business licence to remove it.
-Apache-2.0 here covers this repo's own code only. Anyone running the canvas
-is bound by tldraw's terms, and the watermark must stay.
+in development, but any production deployment, the hosted canvas included,
+needs a licence key from tldraw. Apache-2.0 here covers this repo's own code
+only. Anyone running the canvas is bound by tldraw's terms.

RELEASE-NOTES.md

@@ -19,6 +19,11 @@ The app, its skills and the toolkit carry one version.
 
 Everything below is on `main` and reaches no install until a version is cut.
 
+- **Only pictures go to the agent as pictures.** The **+** on a board, a
+  video or a note still shows a picture of it in the chat, but the agent is
+  handed the file behind it rather than that picture, since the file is what
+  it can read and change.
+
 ## v1.7.0
 
 2026-09-26. The community projects open in the app, and the app no longer

canvas/server/agent.ts

@@ -17,7 +17,7 @@ import path from "node:path";
 import { CANVASES, hashBoards } from "./boards.ts";
 import { command, stop } from "./command.ts";
 import { AGENT_SKILLS, installSkills } from "./skills.ts";
-import { folderOf, sameOrigin } from "./sp.ts";
+import { canvasFile, folderOf, sameOrigin } from "./sp.ts";
 import { SAFE_NAME } from "../src/layoutEdit.ts";
 import {
   attach,
@@ -45,12 +45,16 @@ export function createAgentServer(options: {
   examplesDir: string;
   /** Every project by the name its address carries, `/p/<name>/`. */
   projects: () => Map<string, string>;
+  /** Moves a project the agent has just named into a folder of that name (projects.ts). */
+  named: (dir: string) => string | undefined;
+  /** A project by name, or by the name it had before `named` moved it. */
+  project: (name: string) => string | undefined;
   /** This plugin's checkout, whose skills the sessions are given. */
   repoRoot: string;
   /** `<projects dir>/.workspaces`: a folder per session, a record beside each, and the skills. */
   workspaces: string;
 }) {
-  const { examplesDir, projects, repoRoot, workspaces } = options;
+  const { examplesDir, named, project: projectDir, projects, repoRoot, workspaces } = options;
   // One process per message — Claude Code or Codex, by the panel's choice, looked up in
   // agents.ts — its output kept here and streamed to the page. The runs are held in memory, the
   // newest twenty, for the panel to follow and for the history to say which session is running,
@@ -68,6 +72,8 @@ export function createAgentServer(options: {
       child: ChildProcess;
       /** The Stop button was pressed. Windows ends a run by exit code 1, which says nothing. */
       stopped: boolean;
+      /** The project it works on, if any. */
+      dir: string | undefined;
     }
   >();
 
@@ -327,6 +333,16 @@ export function createAgentServer(options: {
               !/^[A-Za-z0-9+/]*={0,2}$/.test(i.data)
             )
               return send(400, "bad image data");
+            if (
+              i.reference !== undefined &&
+              (typeof i.reference !== "object" ||
+                !["project", "community"].every(
+                  (k) =>
+                    i.reference[k] === undefined ||
+                    typeof i.reference[k] === "string",
+                ))
+            )
+              return send(400, "bad image reference");
           }
           // The body cap above is the panel's limit in base64; a client that is not the
           // panel meets the limit itself here, in the bytes the files come out as.
@@ -375,7 +391,7 @@ export function createAgentServer(options: {
           // The project it was sent from, by the name its address carries. None from the home page
           // or an example, and then the agent has no project to write to.
           const dir =
-            project === undefined ? undefined : projects().get(project);
+            project === undefined ? undefined : projectDir(project);
           if (project !== undefined && dir === undefined)
             return send(404, "no such project");
           // The session the panel is in, or a new one. Its id names a folder and a file, so it has
@@ -511,15 +527,44 @@ export function createAgentServer(options: {
           fs.mkdirSync(keptOf(id), { recursive: true });
           const imagesDir = images.length ? keptOf(id) : "";
           const held: AgentImage[] = images.map(
-            (i: { n: number; name: string; type: string; data: string }) => ({
-              ...i,
-              path: picture(
-                id,
-                `image-${i.n}`,
-                i.type,
-                Buffer.from(i.data, "base64"),
-              ),
-            }),
+            (i: {
+              n: number;
+              name: string;
+              type: string;
+              data: string;
+              reference?: { project?: string; community?: string };
+            }) => {
+              // Anything but a picture (a board, a video, a note) keeps its picture for the
+              // panel, and the agent is pointed at its file, in the canvases of the project it
+              // was attached from, which need not be the one it is sent from. A community
+              // project's is not on this machine, so it keeps the name `sp fetch` finds it by.
+              const ref = i.reference;
+              const from = ref?.project && projects().get(ref.project);
+              const file =
+                ref?.community === undefined &&
+                (ref?.project === undefined || from)
+                  ? canvasFile(
+                      from ? path.join(from, CANVASES) : examplesDir,
+                      examplesDir,
+                      i.name,
+                    )
+                  : undefined;
+              return {
+                ...i,
+                path: picture(
+                  id,
+                  `image-${i.n}`,
+                  i.type,
+                  Buffer.from(i.data, "base64"),
+                ),
+                reference:
+                  ref &&
+                  (file ??
+                    (ref.community
+                      ? `${i.name} of the community project ${ref.community}`
+                      : i.name)),
+              };
+            },
           );
           const hashes = hashBoards(boards);
           const c = command(
@@ -541,11 +586,12 @@ export function createAgentServer(options: {
               // server's port.
               env: {
                 ...process.env,
-                SP_PROJECT: project,
+                SP_PROJECT: dir && path.basename(dir),
                 SP_CANVAS_PORT: String(req.socket.localPort),
               },
             }),
             stopped: false,
+            dir,
           });
           runs.set(run.id, run);
           boardsBefore.set(run.id, { dir: boards, hashes });
@@ -656,6 +702,24 @@ export function createAgentServer(options: {
             finish(error.code === "ENOENT" ? def.missing : String(error));
           });
           run.child.on("close", (code, signal) => {
+            // The turn that named an unnamed project is over, so its folder can take the name.
+            // Not when another turn has already started on it: that one moves it when it ends.
+            if (
+              dir !== undefined &&
+              code === 0 &&
+              ![...runs.values()].some((r) => r !== run && r.dir === dir && !ended(r))
+            ) {
+              // Never in the way of the run ending: a throw here would leave it running for good.
+              try {
+                const moved = named(dir);
+                if (moved)
+                  record.projects = record.projects.map((had) =>
+                    had === dir ? moved : had,
+                  );
+              } catch (error) {
+                console.error(`[agent] ${dir} could not be named: ${error}`);
+              }
+            }
             settle();
             if (ended(run)) return;
             const tail = stderr.trim().split("\n").slice(-5).join("\n");

canvas/server/boards.ts

@@ -6,6 +6,7 @@
 import { createHash } from "node:crypto";
 import fs from "node:fs";
 import path from "node:path";
+import { svgSignature } from "../src/svgSignature.ts";
 
 export const boardHash = (file: string) =>
   createHash("sha1").update(fs.readFileSync(file)).digest("hex");
@@ -75,6 +76,126 @@ export const IMAGE_MIME: Record<string, string> = {
  */
 export const THUMB_EDGE = 880;
 
+/**
+ * FNV-1a 32 over a string's code units, base 36. The inspector's agent runs the same function
+ * over the base64 payload of each data: URI inside the board, and joins on `length:hash`. A
+ * plain hash rather than SHA because the agent runs in a sandboxed frame with no `crypto.subtle`
+ * in every deployment, and this does 3 MB in about 12 ms.
+ */
+function fnv1a(s: string) {
+  let h = 0x811c9dc5;
+  for (let i = 0; i < s.length; i++)
+    h = Math.imul(h ^ s.charCodeAt(i), 0x01000193) >>> 0;
+  return h.toString(36);
+}
+
+interface AssetName {
+  /** Path inside the board folder, `assets/art/hero.png`, or `assets.json#key`. */
+  name: string;
+  /** Decoded size, i.e. the file's own byte count. */
+  bytes: number;
+}
+
+/**
+ * What one asset file, or one assets.json, contributes to the index, remembered by the file's
+ * size and mtime. The index is built on every request for it, and this repo's own boards hold
+ * 300 MB of assets: hashing them once is a second, a stat each is nothing.
+ */
+const hashed = new Map<
+  string,
+  { stamp: string; keys: [string, AssetName][] }
+>();
+function keysOf(file: string, read: (buf: Buffer) => [string, AssetName][]) {
+  const stat = fs.statSync(file);
+  const stamp = `${stat.size}:${stat.mtimeMs}`;
+  let entry = hashed.get(file);
+  if (entry?.stamp !== stamp) {
+    entry = { stamp, keys: read(fs.readFileSync(file)) };
+    hashed.set(file, entry);
+  }
+  return entry.keys;
+}
+
+/**
+ * `length:hash` of the base64 payload -> the source file, for every image a folder's generator
+ * could have inlined: `assets/**`, `assets-dark/**` and the values of `assets.json`. `refs/` is
+ * skipped because it holds third-party captures that are never committed. A generator that
+ * re-encodes on the way (a PIL resize) produces bytes that match nothing here, and the
+ * inspector then falls back to the image's alt text. An `.svg` file is indexed twice: by its
+ * bytes like any image, and as `svg:hash` of its geometry, which is how an inline `<svg>` on a
+ * board is keyed, since the generator rewrote its root tag on the way in.
+ */
+function assetIndex(folder: string): Record<string, AssetName> {
+  const out: Record<string, AssetName> = {};
+  const add = ([key, name]: [string, AssetName]) => {
+    if (!(key in out)) out[key] = name;
+  };
+  const walk = (dir: string, rel: string) => {
+    let entries: fs.Dirent[];
+    try {
+      entries = fs.readdirSync(dir, { withFileTypes: true });
+    } catch {
+      return;
+    }
+    for (const e of entries) {
+      if (e.name.startsWith(".")) continue;
+      const p = path.join(dir, e.name);
+      if (e.isDirectory()) {
+        if (e.name !== "refs") walk(p, `${rel}${e.name}/`);
+        continue;
+      }
+      if (!(path.extname(e.name).toLowerCase() in IMAGE_MIME)) continue;
+      const name = { name: rel + e.name, bytes: 0 };
+      keysOf(p, (buf) => {
+        const payload = buf.toString("base64");
+        const named = { ...name, bytes: buf.length };
+        const keys: [string, AssetName][] = [
+          [`${payload.length}:${fnv1a(payload)}`, named],
+        ];
+        if (e.name.toLowerCase().endsWith(".svg"))
+          keys.push([
+            `svg:${fnv1a(svgSignature(buf.toString("utf8")))}`,
+            named,
+          ]);
+        return keys;
+      }).forEach(add);
+    }
+  };
+  for (const sub of ["assets", "assets-dark"])
+    walk(path.join(folder, sub), `${sub}/`);
+  const json = path.join(folder, "assets.json");
+  if (fs.existsSync(json)) {
+    keysOf(json, (buf) => {
+      const keys: [string, AssetName][] = [];
+      try {
+        const map: unknown = JSON.parse(buf.toString("utf8"));
+        if (map && typeof map === "object") {
+          for (const [key, v] of Object.entries(map)) {
+            if (typeof v !== "string" || !v.startsWith("data:")) continue;
+            const payload = v.slice(v.indexOf(",") + 1);
+            const pad = payload.endsWith("==")
+              ? 2
+              : payload.endsWith("=")
+                ? 1
+                : 0;
+            keys.push([
+              `${payload.length}:${fnv1a(payload)}`,
+              {
+                name: `assets.json#${key}`,
+                bytes: Math.floor((payload.length * 3) / 4) - pad,
+              },
+            ]);
+          }
+        }
+      } catch {
+        // a malformed assets.json names nothing; the boards still render
+      }
+      return keys;
+    }).forEach(add);
+  }
+  return out;
+}
+
 /**
  * `#` and `?` are legal in a filename but are a fragment and a query in a URL, and no encoding
  * survives the round trip (the request path is decoded with decodeURI, which leaves both alone).
@@ -209,6 +330,7 @@ export function boardIndex(
             thumbnail: fs.existsSync(path.join(folder, "thumbnail.png")),
             brand: brandImages(folder),
             thumbs: [] as string[],
+            assets: assetIndex(folder),
             comments: readJson(path.join(folder, "comments.json")),
             // null for a canvas.json that is there but will not parse, after a merge left half
             // done, say. The page must not take that for no file and write over it