@1agh/maude 1.4.4 → 1.4.5

package/apps/studio/api.ts

@@ -4234,6 +4234,10 @@ export function createApi(ctx: Context, hooks: ApiHooks): Api {
       }
       const after = await Bun.file(abs).text();
       const seq = after !== before ? logUndo(abs, before, after) : undefined;
+      // This API write is complete: accepted sync need not wait for an
+      // external editor's quiet window. It is still only a proposal, not an
+      // acknowledgement; the normal hub validation/acceptance path owns that.
+      if (after !== before) ctx.bus.emit('source-written', { rel, content: after });
       return { ok: true, delta: res.delta, seq, ...previous };
     } catch (err) {
       ctx.bus.emit('activity:unsuppress', rel);

package/apps/studio/canvas-comment-mount.tsx

@@ -636,7 +636,19 @@ function CanvasHmrRuntime({
     lastGood.current = canvasRef.current;
     // The new canvas rendered clean → drop any holding state.
     setHoldingState((h) => (h.on ? { on: false } : h));
-  }, []);
+    // A soft replacement keeps the iframe document, so inspect.ts does not
+    // repeat its initial loaded handshake. Re-announce only AFTER the new
+    // subtree commits: the shell then reselects the current element and reads
+    // fresh attributes/styles instead of retaining the pre-restore inspector.
+    // Failed renders keep the last good tree and must not claim a new load.
+    if (attempt > 0 && file) {
+      try {
+        window.parent.postMessage({ dgn: 'loaded', file }, '*');
+      } catch {
+        // The parent can detach while an imported canvas is committing.
+      }
+    }
+  }, [attempt, file]);
 
   const handleError = useCallback(() => {
     setHoldingState({ on: true, message: 'render error' });

package/apps/studio/canvas-shell.tsx

@@ -2422,6 +2422,38 @@ function isLockedElement(el: Element | null, cdId: string | null): boolean {
 // ─────────────────────────────────────────────────────────────────────────────
 // Router wire-up
 
+// The shell writes an inspector edit, THEN posts `record-edit` for it. The
+// write reaches disk before the shell has its response, so a Cmd+Z pressed in
+// that window found the stack one entry short and inverted the edit BELOW the
+// one on screen — refused as "changed by someone else", or worse, applied.
+// Before undo/redo, ask the shell to answer once its recordable writes have
+// settled. Messages between two windows arrive in order, so every
+// `record-edit` those writes produce is delivered before the answer. Bounded:
+// a shell that never answers costs a short wait, not the undo.
+export function afterShellRecords(timeoutMs = 3000): Promise<void> {
+  if (typeof window === 'undefined' || window.parent === window) return Promise.resolve();
+  const requestId = `ub-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
+  return new Promise<void>((resolve) => {
+    const done = () => {
+      clearTimeout(timer);
+      window.removeEventListener('message', onReply);
+      resolve();
+    };
+    const onReply = (e: MessageEvent) => {
+      const d = e.data as { dgn?: string; requestId?: string } | null;
+      if (e.source === window.parent && d?.dgn === 'undo-barrier-ok' && d.requestId === requestId)
+        done();
+    };
+    const timer = setTimeout(done, timeoutMs);
+    window.addEventListener('message', onReply);
+    try {
+      window.parent.postMessage({ dgn: 'undo-barrier', requestId }, '*');
+    } catch {
+      done();
+    }
+  });
+}
+
 function CanvasRouter({
   hostRef,
   children,
@@ -2443,6 +2475,11 @@ function CanvasRouter({
   // without making them a hook dependency — avoids re-binding on every undo op.
   const undoStackRef = useRef(undoStack);
   undoStackRef.current = undoStack;
+  // Selection readback can refresh while the user is typing (e.g. the shell's
+  // post-HMR halo restore). Keep the editor's lifetime tied to its host, not
+  // the changing selection snapshot, or effect cleanup silently ends typing.
+  const textSelectionRef = useRef(selSet);
+  textSelectionRef.current = selSet;
 
   // Phase: inline-edit undo (DDR-103/104 follow-up). Wire the `editSourceApplyFn`
   // sink so an `edit-source` command's do()/undo() reaches the main-origin-only
@@ -2454,10 +2491,17 @@ function CanvasRouter({
   // or any failed write) rejects, the stack keeps the entry instead of moving
   // its cursor, and the user is told why.
   useEffect(() => {
+    // HMR replaces this React subtree, not the iframe or the parent write.
+    // Drain already-sent requests after cleanup instead of losing their ACK
+    // (and, on conflict, their user-facing refusal). Timers remain bounded.
+    let disposed = false;
     const pending = new Map<
       string,
       { resolve: () => void; reject: (err: Error) => void; timer: ReturnType<typeof setTimeout> }
     >();
+    const detachIfIdle = () => {
+      if (disposed && pending.size === 0) window.removeEventListener('message', onResult);
+    };
     const onResult = (event: MessageEvent) => {
       if (event.source !== window.parent) return;
       const data = event.data as
@@ -2468,6 +2512,7 @@ function CanvasRouter({
       if (!entry) return;
       pending.delete(data.requestId);
       clearTimeout(entry.timer);
+      detachIfIdle();
       if (data.ok === true) {
         entry.resolve();
         return;
@@ -2482,11 +2527,16 @@ function CanvasRouter({
     let sequence = 0;
     const applyFn: EditSourceApplyFn = (apply) =>
       new Promise<void>((resolve, reject) => {
+        if (disposed) {
+          reject(new Error('the canvas closed'));
+          return;
+        }
         sequence += 1;
         const requestId = `${Date.now().toString(36)}-${sequence}-${Math.random().toString(36).slice(2, 8)}`;
         // Generous: the shell serializes these writes behind any in-flight one.
         const timer = setTimeout(() => {
           pending.delete(requestId);
+          detachIfIdle();
           reject(new Error('the edit was not confirmed'));
         }, 30_000);
         pending.set(requestId, { resolve, reject, timer });
@@ -2496,17 +2546,14 @@ function CanvasRouter({
           /* detached / cross-origin teardown — nothing to apply */
           pending.delete(requestId);
           clearTimeout(timer);
+          detachIfIdle();
           reject(new Error('the canvas is detached'));
         }
       });
     undoSinks.setSink('editSourceApplyFn', applyFn);
     return () => {
-      window.removeEventListener('message', onResult);
-      for (const entry of pending.values()) {
-        clearTimeout(entry.timer);
-        entry.reject(new Error('the canvas closed'));
-      }
-      pending.clear();
+      disposed = true;
+      detachIfIdle();
       undoSinks.setSink('editSourceApplyFn', undefined);
     };
   }, [undoSinks]);
@@ -2734,11 +2781,11 @@ function CanvasRouter({
       }
       // Plan C — Edit menu (shell) bridges to the in-canvas undo stack.
       if (m.dgn === 'undo') {
-        void undoStack.undo();
+        void afterShellRecords().then(() => undoStackRef.current.undo());
         return;
       }
       if (m.dgn === 'redo') {
-        void undoStack.redo();
+        void afterShellRecords().then(() => undoStackRef.current.redo());
         return;
       }
       // Phase 12 Task 4 (DDR-103) — Layers-tree round-trip. select-by-id resolves
@@ -3144,7 +3191,7 @@ function CanvasRouter({
       // selected (the drill has reached it). Previously a dblclick on leaf
       // text jumped straight to the editor from any depth, so the drill ladder
       // never ran on text-bearing targets.
-      const sel0 = selSet.selected;
+      const sel0 = textSelectionRef.current.selected;
       const currentId = sel0.length === 1 ? sel0[0]?.id : undefined;
       const leafReached = isLeafText && currentId === stamped.getAttribute('data-cd-id');
       if (!leafReached) {
@@ -3167,7 +3214,9 @@ function CanvasRouter({
               (next.closest('[data-dc-screen]') as HTMLElement | null)?.getAttribute(
                 'data-dc-screen'
               ) ?? null;
-            selSet.replace(hoverTargetToSelection({ el: next, cdId, artboardId } as HoverTarget));
+            textSelectionRef.current.replace(
+              hoverTargetToSelection({ el: next, cdId, artboardId } as HoverTarget)
+            );
           }
         }
         return;
@@ -3228,7 +3277,7 @@ function CanvasRouter({
       document.removeEventListener('maude:enter-text-edit', onEnterTextEdit);
       if (editing) teardown(editing);
     };
-  }, [hostRef, selSet]);
+  }, [hostRef]);
 
   // Cleanup any pending rAF on unmount.
   useEffect(
@@ -3314,10 +3363,10 @@ function CanvasRouter({
       },
       onTool: ({ tool: t }) => setTool(t),
       onUndo: () => {
-        void undoStack.undo();
+        void afterShellRecords().then(() => undoStackRef.current.undo());
       },
       onRedo: () => {
-        void undoStack.redo();
+        void afterShellRecords().then(() => undoStackRef.current.redo());
       },
       onEscape: () => {
         // T21 — abort any mid-stroke draw FIRST. The annotations layer

package/apps/studio/canvas-source-memo.ts

@@ -0,0 +1,39 @@
+// The last canvas source this server BUILT, with the locator that build
+// produced, per file (F4).
+//
+// The HMR broadcaster diffs a changed canvas against it to find a text-only
+// edit it can hand straight to the open iframe (`HmrMessage.patches`). Seeded
+// by the module route after each build — so the memo is exactly the source the
+// iframe renders, and its locator names that render's `data-cd-id`s — and
+// advanced by every broadcast that carried patches. Bounded: a memo miss only
+// means the remount renders the change without the head start.
+
+import type { LocatorMap } from './locator.ts';
+
+const MAX_FILES = 256;
+const MAX_BYTES = 512 * 1024;
+
+export interface BuiltCanvas {
+  source: string;
+  locator: LocatorMap;
+}
+
+const memo = new Map<string, BuiltCanvas>();
+
+export function rememberCanvasBuild(absPath: string, built: BuiltCanvas): void {
+  memo.delete(absPath);
+  if (built.source.length > MAX_BYTES) return;
+  memo.set(absPath, built);
+  if (memo.size > MAX_FILES) {
+    const oldest = memo.keys().next().value;
+    if (oldest !== undefined) memo.delete(oldest);
+  }
+}
+
+export function recallCanvasBuild(absPath: string): BuiltCanvas | undefined {
+  return memo.get(absPath);
+}
+
+export function forgetCanvasBuilds(): void {
+  memo.clear();
+}

package/apps/studio/canvas-text-patch.ts

@@ -0,0 +1,117 @@
+// Text-only change detection for the F4 peer-render fast path.
+//
+// A teammate's text edit reaches this disk ~100 ms after they commit it, but
+// re-importing and remounting the canvas module takes several hundred more.
+// When the ONLY difference between the source the iframe renders and the new
+// source is the text between an element's opening and closing tag, the iframe
+// can show the new string at once and let the remount confirm it.
+//
+// DELIBERATELY PARSER-FREE. In a cell this runs in the process that holds the
+// tenant's credentials, where canvas source is never parsed or built (DDR-209:
+// that happens in the sandbox). So this is bounded string scanning over one
+// changed region, and the element's identity comes from the LOCATOR the
+// sandboxed build already produced for the rendered source — never from
+// parsing tenant bytes here. Anything it cannot prove is a plain text run —
+// markup, attributes, expressions, entities, several regions — returns null,
+// and the remount alone renders the change, exactly as before.
+
+import type { LocatorMap } from './locator.ts';
+
+export interface TextPatch {
+  /** The element's `data-cd-id` in the rendered (before) build. */
+  id: string;
+  /** The string React renders for the element's text child. */
+  text: string;
+}
+
+const STRUCTURAL = /[<>{}&]/;
+
+/** Babel's JSX text whitespace rule (cleanJSXElementLiteralChild). */
+export function renderedJsxText(raw: string): string {
+  const lines = raw.split(/\r\n|\n|\r/);
+  let lastNonEmpty = 0;
+  for (let i = 0; i < lines.length; i++) if (/[^ \t]/.test(lines[i] as string)) lastNonEmpty = i;
+  let out = '';
+  for (let i = 0; i < lines.length; i++) {
+    let line = (lines[i] as string).replace(/\t/g, ' ');
+    if (i !== 0) line = line.replace(/^[ ]+/, '');
+    if (i !== lines.length - 1) line = line.replace(/[ ]+$/, '');
+    if (line) {
+      if (i !== lastNonEmpty) line += ' ';
+      out += line;
+    }
+  }
+  return out;
+}
+
+/** 1-based line / 0-based column, counted the way the build's locator counts. */
+function lineCol(source: string, at: number): { line: number; col: number } {
+  let line = 1;
+  let col = 0;
+  for (let i = 0; i < at; i++) {
+    if (source.charCodeAt(i) === 10) {
+      line += 1;
+      col = 0;
+    } else col += 1;
+  }
+  return { line, col };
+}
+
+const TAG_NAME = /^[A-Za-z][\w.:-]*/;
+
+/**
+ * The single text patch that turns `before`'s render into `after`'s, [] when
+ * they are identical, or null when the change is anything but the text run of
+ * one element that `locator` (the build of `before`) names.
+ */
+export function textOnlyPatches(
+  before: string,
+  after: string,
+  locator: LocatorMap
+): TextPatch[] | null {
+  if (before === after) return [];
+  const limit = Math.min(before.length, after.length);
+  let p = 0;
+  while (p < limit && before.charCodeAt(p) === after.charCodeAt(p)) p++;
+  let s = 0;
+  while (
+    s < limit - p &&
+    before.charCodeAt(before.length - 1 - s) === after.charCodeAt(after.length - 1 - s)
+  )
+    s++;
+  if (STRUCTURAL.test(before.slice(p, before.length - s))) return null;
+  if (STRUCTURAL.test(after.slice(p, after.length - s))) return null;
+
+  // The text run around the change: from the `>` ending an opening tag to the
+  // `</` of a closing tag, with nothing structural in between (both sides).
+  let open = p - 1;
+  while (open >= 0 && !STRUCTURAL.test(before[open] as string)) open--;
+  if (open < 0 || before[open] !== '>' || before[open - 1] === '/') return null;
+  let close = before.length - s;
+  while (close < before.length && !STRUCTURAL.test(before[close] as string)) close++;
+  if (before[close] !== '<' || before[close + 1] !== '/') return null;
+  const closeAfter = close + (after.length - before.length);
+
+  // The opening tag this `>` ends: its `<`, a tag name, and a closing tag that
+  // names the same element.
+  const start = before.lastIndexOf('<', open);
+  if (start < 0) return null;
+  const name = TAG_NAME.exec(before.slice(start + 1))?.[0];
+  if (!name || before.slice(close + 2, close + 2 + name.length + 1) !== `${name}>`) return null;
+
+  const at = lineCol(before, start);
+  // The locator is the sandboxed build's output: trust its shape, not its size.
+  const ids = Object.entries(locator ?? {}).filter(
+    ([id, e]) =>
+      /^[0-9a-f]{8}$/.test(id) &&
+      e?.line === at.line &&
+      e?.col === at.col &&
+      Array.isArray(e?.jsxPath) &&
+      e.jsxPath.at(-1) === name
+  );
+  if (ids.length !== 1) return null;
+
+  const text = renderedJsxText(after.slice(open + 1, closeAfter));
+  if (!text) return null;
+  return [{ id: (ids[0] as [string, unknown])[0], text }];
+}