@1agh/maude 1.2.0 → 1.3.1

package/apps/studio/bin/annotate.mjs

@@ -1242,7 +1242,9 @@ async function main() {
         const res = await fetch(`${base}/_api/annotations`, {
           method: 'PUT',
           headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ file: `${designRel}/${relPath}`, svg: merged }),
+          // `base` — the SVG this edit was merged onto, so a peer's strokes
+          // that landed meanwhile are merged, not replaced (DDR-241).
+          body: JSON.stringify({ file: `${designRel}/${relPath}`, svg: merged, base: svg }),
           signal: AbortSignal.timeout(3000),
         });
         if (res.ok) via = 'server';

package/apps/studio/bin/server-up.sh

@@ -145,9 +145,24 @@ NEEDS_START=1
 if [ -f "$STATE" ]; then
   PID=$(read_pid)
   PORT=$(read_port)
+  # Sandboxed agents may reach Studio while kill -0 returns EPERM. Verify the
+  # server's identity over HTTP instead of mistaking denied signalling for death.
+  HEALTH=""
+  if [ -n "$PORT" ]; then
+    HEALTH=$(curl -fs --max-time 2 "http://localhost:$PORT/_health" 2>/dev/null || true)
+  fi
   if [ -n "$PID" ] && [ -n "$PORT" ] \
-     && kill -0 "$PID" 2>/dev/null \
-     && curl -fs "http://localhost:$PORT/_health" >/dev/null 2>&1; then
+     && printf '%s' "$HEALTH" | node -e '
+       try {
+         const fs = require("node:fs");
+         const h = JSON.parse(fs.readFileSync(0, "utf8"));
+         const root = fs.realpathSync(process.argv[2]);
+         const id = require("node:crypto").createHash("sha256").update(root).digest("hex").slice(0, 12);
+         process.exit(h.ok === true && h.app === "design" &&
+           Number(h.pid) === Number(process.argv[1]) &&
+           (h.rootId === undefined || h.rootId === id) ? 0 : 1);
+       } catch { process.exit(1); }
+     ' "$PID" "$REPO"; then
     echo "✓ server alive pid=$PID port=$PORT" >&2
     echo "$PORT"
     exit 0

package/apps/studio/canvas-build.ts

@@ -22,7 +22,7 @@
 // serves the resulting JS at /<designRel>/ui/<slug>.tsx with Content-Type
 // `application/javascript`.
 
-import { existsSync } from 'node:fs';
+import { existsSync, realpathSync } from 'node:fs';
 import path from 'node:path';
 
 import { canvasLibPath, canvasLibResolver } from './canvas-lib-resolver.ts';
@@ -129,6 +129,10 @@ export async function buildCanvasModule(
   // needed; RUNTIME_PACKAGES already lists every specifier the importmap covers.
   const externalSpecifiers = new Set<string>(RUNTIME_PACKAGES);
   const denials: Array<{ specifier: string; reason: string }> = [];
+  // Every stylesheet the canvas pulls in by relative import — they are inlined
+  // (below), so the open canvas has no <link> to swap when one changes; the
+  // injector records them for the iframe's HMR client (see buildCssInjector).
+  const cssSources = new Set<string>();
 
   const built = await Bun.build({
     entrypoints: [canvasAbsPath],
@@ -151,6 +155,17 @@ export async function buildCanvasModule(
       'process.env.NODE_ENV': '"production"',
     },
     plugins: [
+      {
+        name: 'css-sources',
+        setup(builder) {
+          builder.onResolve({ filter: /\.css$/ }, (args: { path: string; importer: string }) => {
+            if (args.path.startsWith('.') && args.importer) {
+              cssSources.add(path.resolve(path.dirname(args.importer), args.path));
+            }
+            return null; // record only — resolution continues as before
+          });
+        },
+      },
       // Resolve `@maude/canvas-lib` BEFORE exact-externals — we want the bare
       // specifier to map to the dev-server-bundled lib, not get marked external.
       canvasLibResolver(),
@@ -217,7 +232,26 @@ export async function buildCanvasModule(
     for (const a of cssAssets) css += await a.text();
     if (css.trim().length > 0) {
       const slug = canvasAbsPath.split('/').pop() ?? 'canvas';
-      js = buildCssInjector(slug, css) + js;
+      const root = options.designRoot ?? options.restrictImportsTo;
+      // Real paths on both sides: the bundler reports importers by their REAL
+      // path, and a design root reached through a symlink (macOS `/var` →
+      // `/private/var`, where every temp dir lives) made each source look like
+      // `../../private/…` — filtered out, so nothing was ever named and the
+      // open canvas never restyled.
+      const real = (p: string) => {
+        try {
+          return realpathSync(p);
+        } catch {
+          return p;
+        }
+      };
+      const realRoot = root ? real(root) : null;
+      const sources = realRoot
+        ? [...cssSources]
+            .map((abs) => path.relative(realRoot, real(abs)).split(path.sep).join('/'))
+            .filter((rel) => rel && !rel.startsWith('..'))
+        : [];
+      js = buildCssInjector(slug, css, sources) + js;
     }
   }
 
@@ -227,16 +261,23 @@ export async function buildCanvasModule(
 
 /**
  * Synthesize a module-init prologue that creates a `<style data-canvas-css>`
- * tag with the bundled CSS text. Idempotent per-slug — duplicate mounts of
- * the same canvas don't re-inject. Run at top-level so it executes before
- * the React component does its first render.
+ * tag with the bundled CSS text. One tag per slug — a duplicate mount reuses
+ * it, and a RE-IMPORT (the iframe's soft reload after a stylesheet changed)
+ * replaces its text, so a changed import actually reaches the page. Run at
+ * top-level so it executes before the React component does its first render.
+ *
+ * `sources` — the design-root-relative stylesheets inlined here — lands on the
+ * tag as `data-canvas-css-sources` (`|`-separated): the iframe's HMR client
+ * reloads when one of them changes, since there is no <link> to swap (plan
+ * T31/L16: a canvas importing `../system/<ds>/tokens.css` never restyled).
  */
-function buildCssInjector(slug: string, css: string): string {
+function buildCssInjector(slug: string, css: string, sources: readonly string[] = []): string {
   // JSON-encode the CSS text so we don't need to worry about backticks,
   // backslashes, or embedded `</style>` (which would break a raw template).
   const enc = JSON.stringify(css);
-  const id = `canvas-css-${slug.replace(/[^a-zA-Z0-9-]/g, '_')}`;
-  return `// canvas-build: inject bundled sibling CSS so the canvas is self-contained.\n(function(){if(typeof document==="undefined")return;if(document.getElementById(${JSON.stringify(id)}))return;var s=document.createElement("style");s.id=${JSON.stringify(id)};s.dataset.canvasCss="bundled";s.textContent=${enc};document.head.appendChild(s);})();\n`;
+  const id = JSON.stringify(`canvas-css-${slug.replace(/[^a-zA-Z0-9-]/g, '_')}`);
+  const src = JSON.stringify(sources.join('|'));
+  return `// canvas-build: inject bundled sibling CSS so the canvas is self-contained.\n(function(){if(typeof document==="undefined")return;var s=document.getElementById(${id});if(!s){s=document.createElement("style");s.id=${id};s.dataset.canvasCss="bundled";document.head.appendChild(s);}s.dataset.canvasCssSources=${src};if(s.textContent!==${enc})s.textContent=${enc};})();\n`;
 }
 
 /**