@1agh/maude 0.52.2 → 0.53.1

package/apps/studio/bin/_import-asset.mjs

@@ -360,12 +360,7 @@ export function sanitizeSvgAllowlist(svgText) {
   const window = new Window();
   const doc = new window.DOMParser().parseFromString(svgText, 'image/svg+xml');
   const root = doc.documentElement;
-  if (
-    !root ||
-    root.tagName !== 'svg' ||
-    root.namespaceURI !== SVG_NS ||
-    doc.querySelector('parsererror')
-  ) {
+  if (root?.tagName !== 'svg' || root.namespaceURI !== SVG_NS || doc.querySelector('parsererror')) {
     throw new ImportAssetError(3, 'SVG failed to parse');
   }
   walkAllowlist(root);

package/apps/studio/bin/_import-brand.mjs

@@ -355,7 +355,7 @@ export function hardenBrandLogoSvg(sanitizedSvgText) {
   const window = new Window();
   const doc = new window.DOMParser().parseFromString(sanitizedSvgText, 'image/svg+xml');
   const root = doc.documentElement;
-  if (!root || root.tagName !== 'svg' || root.namespaceURI !== SVG_NS) {
+  if (root?.tagName !== 'svg' || root.namespaceURI !== SVG_NS) {
     throw new ImportBrandError(3, 'input is not a valid sanitized SVG document');
   }
 

package/apps/studio/bin/_video-playwright.mjs

@@ -354,7 +354,11 @@ async function frameStepCapture({
     });
   }
 
-  const dump = dumpDir ? (mkdirSync(dumpDir, { recursive: true }), dumpDir) : null;
+  // A comma operator hid the side effect here; the directory has to exist
+  // before anything writes a frame into it, so the effect is the point and
+  // deserves its own line.
+  if (dumpDir) mkdirSync(dumpDir, { recursive: true });
+  const dump = dumpDir ?? null;
   const framePaths = [];
   const t0 = Date.now();
 

package/apps/studio/canvas-build.ts

@@ -79,6 +79,19 @@ export interface BuildCanvasOptions {
    * detected.
    */
   designRoot?: string;
+  /**
+   * Cloud Phase 25 A1 — the SANDBOX's import allowlist.
+   *
+   * On a laptop an unrestricted resolver is correct and harmless: your code,
+   * your machine, your files. In a CELL the same resolver is a build-time read
+   * primitive pointed at a container that holds this tenant's credentials, so
+   * a tenant's own source may reach ONLY the runtime packages,
+   * `@maude/canvas-lib`, and relative paths that resolve INSIDE the design
+   * root. Anything else is a legible build error, never a silent read.
+   *
+   * Set to the absolute design root to arm it. Absent (desktop) ⇒ unchanged.
+   */
+  restrictImportsTo?: string;
 }
 
 /**
@@ -115,6 +128,7 @@ export async function buildCanvasModule(
   // in the bundle). The flatMap legacy alias for `react-dom` is no longer
   // needed; RUNTIME_PACKAGES already lists every specifier the importmap covers.
   const externalSpecifiers = new Set<string>(RUNTIME_PACKAGES);
+  const denials: Array<{ specifier: string; reason: string }> = [];
 
   const built = await Bun.build({
     entrypoints: [canvasAbsPath],
@@ -122,6 +136,12 @@ export async function buildCanvasModule(
     format: 'esm',
     minify: false,
     splitting: false,
+    // Bun.build THROWS by default (an AggregateError whose message is the
+    // useless string "Bundle failed"), which made the `built.success` branch
+    // below dead code and hid every real diagnostic — including, once the
+    // sandbox arrived, the allowlist's own explanation of what it refused.
+    // Take the result, report it ourselves.
+    throw: false,
     define: {
       // Match runtime-bundle.ts: production React. Without this the canvas's
       // `import { jsxDEV } from "react/jsx-dev-runtime"` resolves against a
@@ -154,10 +174,20 @@ export async function buildCanvasModule(
           });
         },
       },
+      // LAST on purpose: by the time a specifier reaches this plugin, the
+      // runtime packages are external and `@maude/canvas-lib` is resolved, so
+      // what is left is exactly "everything else" — which, from a tenant's
+      // own file, must stay inside the design root.
+      ...(options.restrictImportsTo ? [importAllowlist(options.restrictImportsTo, denials)] : []),
     ],
   });
 
   if (!built.success) {
+    // A DENIED IMPORT IS THE MESSAGE. Bun collapses a plugin throw into a bare
+    // "Bundle failed" log, so the allowlist records its own reasons and they
+    // win here — the person who wrote the canvas has to be able to act on it,
+    // and "Bundle failed" tells them nothing.
+    if (denials.length > 0) throw new Error(denials.map((d) => d.reason).join('\n'));
     const msg = built.logs.map((l) => l.message).join('\n');
     throw new Error(`Bun.build failed on ${canvasAbsPath}:\n${msg}`);
   }
@@ -201,6 +231,67 @@ function buildCssInjector(slug: string, css: string): string {
   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`;
 }
 
+/**
+ * The sandbox's import allowlist (Cloud Phase 25 A1).
+ *
+ * The rule is stated by IMPORTER, not by target, because the two trees have
+ * different rights: canvas-lib and its siblings are OUR code and import each
+ * other freely; a tenant's canvas may only reach inside the design root. A
+ * target-only rule would let a tenant's `../../../app/...` traversal land in
+ * the maude install and be waved through as "our" file.
+ *
+ * Denials THROW with the specifier and the reason — a rejected import must
+ * reach the person as a legible build error, never a 500 and never a silent
+ * read of something they should not have.
+ */
+function importAllowlist(
+  designRoot: string,
+  denials: Array<{ specifier: string; reason: string }>
+): {
+  name: string;
+  setup: (builder: {
+    onResolve: (
+      opts: { filter: RegExp },
+      cb: (args: { path: string; importer: string }) => unknown
+    ) => void;
+  }) => void;
+} {
+  const root = path.resolve(designRoot);
+  const inRoot = (p: string) => p === root || p.startsWith(root + path.sep);
+  const deny = (specifier: string, reason: string): never => {
+    denials.push({ specifier, reason });
+    throw new Error(reason);
+  };
+  return {
+    name: 'maude-import-allowlist',
+    setup(builder) {
+      builder.onResolve({ filter: /.*/ }, (args: { path: string; importer: string }) => {
+        const importer = args.importer ? path.resolve(args.importer) : '';
+        // Our own modules (canvas-lib and its graph) resolve normally.
+        if (importer && !inRoot(importer)) return null;
+        if (!args.path.startsWith('.') && !path.isAbsolute(args.path)) {
+          deny(
+            args.path,
+            `This canvas imports "${args.path}", which is not available when it renders in a browser. ` +
+              `A canvas here can use the Maude runtime (react, motion, @maude/canvas-lib) and its own ` +
+              `project files — npm packages are not installed. Open the project in Maude Desktop if you ` +
+              `need one.`
+          );
+        }
+        const resolved = path.resolve(path.dirname(importer || root), args.path);
+        if (!inRoot(resolved)) {
+          deny(
+            args.path,
+            `This canvas imports "${args.path}", which is outside the project (${path.relative(root, resolved)}). ` +
+              `A canvas may only import files inside its own design.`
+          );
+        }
+        return null; // inside the root — let Bun's resolver finish the job
+      });
+    },
+  };
+}
+
 function filterForExactPath(absPath: string): RegExp {
   // Bun.build hands onLoad the resolved on-disk path. On macOS /tmp is a
   // symlink to /private/tmp, so an entrypoint of "/tmp/foo.tsx" arrives in

package/apps/studio/canvas-lib.tsx

@@ -128,6 +128,7 @@ import { scopedCdSelector, selectorIndex, shortText } from './dom-selection.ts';
 // (photo/pipeline.ts, which imports pixi.js) is loaded via a DYNAMIC import
 // inside <PhotoLayer> only when an edited photo actually mounts — see there.
 import { isDefaultEdit, type PhotoEdit } from './photo/schema.ts';
+import { isReadOnlyCanvas } from './read-only-mode.ts';
 import { AgentPresenceProvider, useAgentPresence } from './use-agent-presence.tsx';
 import { type DragState, useArtboardDrag } from './use-artboard-drag.tsx';
 import {
@@ -757,6 +758,14 @@ function patchCanvasMeta(patch: {
   layout?: { artboards: ArtboardRect[] };
 }): void {
   if (typeof window === 'undefined' || typeof fetch === 'undefined') return;
+  // Cloud Phase 25 C2 — a read-only session persists its CAMERA (per-user
+  // `_canvas-state/` view, DDR-115) but never the LAYOUT lane (versioned
+  // `.meta.json`). The dev-server refuses the layout lane too (http.ts);
+  // dropping it here keeps the UI from even trying.
+  if (patch.layout && isReadOnlyCanvas()) {
+    if (!patch.viewport) return;
+    patch = { viewport: patch.viewport };
+  }
   const file = readCanvasMetaFile();
   if (!file) return;
   const sanitized: {
@@ -2096,7 +2105,9 @@ export function DCArtboard({
     rectFor: (rid) => (ctx ? ctx.rectFor(rid) : null),
     allRects: ctx?.artboards ?? [],
     viewport: ctx?.viewport ?? null,
-    enabled: !!ctx && (toolMode?.tool ?? 'move') === 'move',
+    // Cloud Phase 25 C2 — a read-only canvas keeps the Move tool for
+    // selection, but artboards don't drag (editing is absent, not hidden).
+    enabled: !!ctx && (toolMode?.tool ?? 'move') === 'move' && !isReadOnlyCanvas(),
     onCommit: (moved) => {
       if (dragBus) dragBus.commitPositions(moved);
     },

package/apps/studio/canvas-shell.tsx

@@ -89,6 +89,7 @@ import {
 import { ElementMarqueeOverlay } from './marquee-overlay.tsx';
 import { MeasureOverlay } from './measure-overlay.tsx';
 import { ParticipantsChrome } from './participants-chrome.tsx';
+import { isReadOnlyCanvas } from './read-only-mode.ts';
 import { mountCaret, placeCaretAt } from './text-caret.ts';
 import { ToolPalette } from './tool-palette.tsx';
 import { UndoHud } from './undo-hud.tsx';
@@ -1872,7 +1873,7 @@ function buildRegistry(deps: {
     window as unknown as { __maudeConvertArtboard?: typeof postConvertArtboardToAbsolute }
   ).__maudeConvertArtboard = postConvertArtboardToAbsolute;
 
-  return {
+  const registry: ContextRegistry = {
     element: [
       [
         {
@@ -2280,6 +2281,43 @@ function buildRegistry(deps: {
     ],
     overlay: [],
   };
+  return filterRegistryForReadOnly(registry);
+}
+
+/**
+ * Cloud Phase 25 C2 — a read-only canvas keeps only the context-menu items
+ * that READ the project (navigate, inspect, copy, export). Everything else is
+ * ABSENT, not disabled. Deliberately an ALLOWLIST: a future item defaults to
+ * absent for viewers (the C1 posture), rather than leaking in by omission.
+ * `add-comment` joins when Phase 25 C3 lands comments on the cell's read-only
+ * allowlist.
+ */
+const READ_ONLY_MENU_IDS = new Set([
+  'fit-view',
+  'reset-view',
+  'fit-one',
+  'open-timeline',
+  'copy-css',
+  'copy-id',
+  'copy-style',
+  'inspect',
+  'select-layer',
+  'deselect',
+  'export-selection',
+  'export-artboard',
+  'export-canvas',
+  'export-project',
+]);
+
+function filterRegistryForReadOnly(registry: ContextRegistry): ContextRegistry {
+  if (!isReadOnlyCanvas()) return registry;
+  const out = {} as ContextRegistry;
+  for (const key of Object.keys(registry) as (keyof ContextRegistry)[]) {
+    out[key] = registry[key]
+      .map((section) => section.filter((item) => READ_ONLY_MENU_IDS.has(item.id)))
+      .filter((section) => section.length > 0);
+  }
+  return out;
 }
 
 function boundsOf(el: HTMLElement) {
@@ -3003,6 +3041,10 @@ function CanvasRouter({
       opts?: { selectAll?: boolean }
     ): void {
       if (editing) return;
+      // Cloud Phase 25 C2 — inline text edit is a source write; a read-only
+      // canvas never enters edit mode (one gate for BOTH entry points: the
+      // dblclick drill and the annotation Text-tool click-through).
+      if (isReadOnlyCanvas()) return;
       editing = stamped;
       original = stamped.textContent ?? '';
       stamped.setAttribute('contenteditable', 'plaintext-only');
@@ -3248,6 +3290,11 @@ function CanvasRouter({
     },
   });
 
+  // Cloud Phase 25 C2 — a read-only canvas mounts no EDIT chrome (resize /
+  // spacing / grid handles, reorder drag, contextual + multi-artboard
+  // toolbars). Editing is absent, not disabled. Selection, halos, measure,
+  // annotations DISPLAY, cursors and presence all stay — they read.
+  const readOnly = isReadOnlyCanvas();
   return (
     <>
       {children}
@@ -3259,19 +3306,21 @@ function CanvasRouter({
       <ElementMarqueeOverlay />
       <HoverHalo el={hoverEl} />
       <SelectionHalos />
-      <ElementResizeOverlay />
-      <SpacingHandlesOverlay />
-      <GridTrackHandlesOverlay />
-      <ReorderDrag />
+      {!readOnly && <ElementResizeOverlay />}
+      {!readOnly && <SpacingHandlesOverlay />}
+      {!readOnly && <GridTrackHandlesOverlay />}
+      {!readOnly && <ReorderDrag />}
       <LayersLiveSync />
       <GroupBbox />
-      <EqualSpacingHandles />
+      {!readOnly && <EqualSpacingHandles />}
       <MeasureOverlay />
-      <ContextualToolbar />
-      <MultiArtboardToolbar
-        distributeArtboards={distributeArtboards}
-        alignArtboards={alignArtboards}
-      />
+      {!readOnly && <ContextualToolbar />}
+      {!readOnly && (
+        <MultiArtboardToolbar
+          distributeArtboards={distributeArtboards}
+          alignArtboards={alignArtboards}
+        />
+      )}
       <SnapGuideOverlay />
       <PhotoPreviewBridge />
       <UndoHud />