@agimon-ai/po-author 0.0.0-alpha.34 → 0.0.0-alpha.35

package/dist/extensions/web.mjs

@@ -1,9 +1,9 @@
 import { apiResponse, createApiClient, defineApiRoutes, defineChannelFile, defineDockFace, defineFileLinks, defineFill, defineGlobalStore, defineLeaderBinding, defineMinorModeFile, defineSessionStore, defineSlotFile, defineToolRenderer, defineWebLifecycle, defineWebPlugin, sessionApiAddress, toolResultTextLines } from "@agimon-ai/po-core/web";
 import { Store } from "@tanstack/store";
 import { useStore } from "@tanstack/react-store";
-import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Button, CodeEditor, Dot, FileIcon, Markdown, MediaPreview, MessageItem, MessageItemBody, MessageItemHeader, MessageItemStatus, MessageLines, SparklesIcon, StatusBadge, TrashIcon, collapseLines, toolTone } from "@agimon-ai/po-web-components";
+import { Button, CodeEditor, Dot, FileIcon, Markdown, MediaPreview, MessageItem, MessageItemBody, MessageItemHeader, MessageItemStatus, MessageLines, SparklesIcon, StatusBadge, TrashIcon, collapseLines, drawableImageUrl, markdownMediaReview, markdownMediaReviewSlot, svgImageUrl, toolTone } from "@agimon-ai/po-web-components";
 import { sealedTransport } from "@agimon-ai/po-web-security/browser";
 //#region src/types/webAuthor.ts
 const authorChannelType = "author_webmcp";
@@ -1219,6 +1219,8 @@ var author_webmcp_web_default = defineChannelFile({
 //#endregion
 //#region src/constants/author.ts
 const AUTHOR_FILE_TAB_PREFIX = "author-file-";
+/** Names a file in the session's artifact folder rather than the working tree. Artifacts open read-only. */
+const AUTHOR_ARTIFACT_PREFIX = "artifact:";
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/_components/AuthorGridOverlay.tsx
 function autonomousVoiceGridVisible(statuses) {
@@ -1396,7 +1398,8 @@ function createAuthorCapturePacket(captureId, capturedAt, document, regions, ali
 			revision: document.version,
 			...document.sourceSha256 === void 0 ? {} : { sourceSha256: document.sourceSha256 },
 			...document.storyPreview === void 0 ? {} : { storyPreview: structuredClone(document.storyPreview) },
-			...document.imageArtifact === void 0 ? {} : { imageArtifact: { ...document.imageArtifact } }
+			...document.imageArtifact === void 0 ? {} : { imageArtifact: { ...document.imageArtifact } },
+			...document.markdownMedia === void 0 ? {} : { markdownMedia: { ...document.markdownMedia } }
 		},
 		regions: regions.map((region, index) => {
 			if (region.documentPath !== document.path || region.revision !== document.version || region.sourceSha256 !== document.sourceSha256) throw new Error(`Region ${String(index + 1)} is stale for the focused document.`);
@@ -1462,12 +1465,25 @@ function storyPreviewProvenance(packet) {
 		"After editing the underlying story or component source, rebuild the preview before treating it as visually verified."
 	].join("\n");
 }
+function filePath(path) {
+	return path.startsWith("artifact:") ? `${path} (relative to the session artifact folder)` : path;
+}
+function markdownMediaProvenance(packet) {
+	const media = packet.document.markdownMedia;
+	if (media === void 0) return void 0;
+	const lines = [media.kind === "mermaid" ? "Reviewed a mermaid diagram rendered from Markdown. Change the diagram by editing its source." : "Reviewed an image shown in rendered Markdown. Change it by editing or regenerating its source file."];
+	if (media.sourcePath !== void 0) lines.push(`Source image: ${filePath(media.sourcePath)}`);
+	if (media.documentPath !== void 0) lines.push(`Embedded in document: ${filePath(media.documentPath)}`);
+	if (media.documentPath === void 0 && media.sourcePath === void 0) lines.push("Embedded in a conversation message, not a file.");
+	if (media.mermaidSource !== void 0) lines.push("Mermaid source:", "```mermaid", media.mermaidSource, "```");
+	return lines.join("\n");
+}
 function authorCaptureContext(packet) {
 	const metadata = JSON.stringify(packet);
 	if (bytes(metadata) > 65536) throw new Error("Author capture packet exceeds 64 KiB.");
 	const annotations = packet.regions.map((region) => `(${String(region.ordinal)}) ${region.comment} [${anchorLocation(region.anchor)}]\nregionId: ${JSON.stringify(region.id)}${region.quote ? `\nQuoted text: ${region.quote}` : ""}`).join("\n\n");
 	const artifact = packet.document.imageArtifact;
-	const provenance = artifact === void 0 ? storyPreviewProvenance(packet) : [
+	const provenance = artifact === void 0 ? markdownMediaProvenance(packet) ?? storyPreviewProvenance(packet) : [
 		"Generated image feedback: preserve the original image; generate a new refinement only when requested.",
 		`Original artifact: ${artifact.id} (session ${artifact.sessionId})`,
 		`Original canonical path: ${artifact.originalPath}`,
@@ -1493,7 +1509,7 @@ function canvasBlob(canvas, type, quality) {
 		canvas.toBlob((blob) => blob === null ? reject(/* @__PURE__ */ new Error("Unable to capture viewport")) : resolve(blob), type, quality);
 	});
 }
-async function base64(blob) {
+async function base64$1(blob) {
 	const bytes = new Uint8Array(await blob.arrayBuffer());
 	let binary = "";
 	for (let offset = 0; offset < bytes.length; offset += 32768) binary += String.fromCharCode(...bytes.subarray(offset, offset + 32768));
@@ -1518,7 +1534,7 @@ async function boundedCanvasCapture(canvas) {
 	}
 	if (blob.size > 2097152) throw new Error("Viewport capture exceeds 2 MiB");
 	return {
-		data: await base64(blob),
+		data: await base64$1(blob),
 		mimeType
 	};
 }
@@ -2047,222 +2063,6 @@ function AuthorRequestLog({ requests }) {
 	});
 }
 //#endregion
-//#region src/extensions/workspaces/sessions/(frontend)/dock/_components/AuthorToolPalette.tsx
-/** One tool tile. An active annotation tool is the person's mark (rose); an active view tool is Po's jade. */
-function authorToolClassName(active, annotates) {
-	return `h-auto min-h-11 min-w-11 flex-col gap-1 rounded-md px-1 py-2 text-base [@media(pointer:fine)]:min-h-8 ${!active ? "border-po-border-soft bg-po-panel text-po-dim" : annotates ? "border-po-edge-magenta bg-po-tint-magenta font-semibold text-po-magenta hover:text-po-magenta" : "border-po-edge-green bg-po-tint-green font-semibold text-po-green hover:text-po-green"}`;
-}
-function AuthorToolPalette({ sessionId, path, kind, activeTool }) {
-	const [error, setError] = useState();
-	const format = (style) => {
-		const selected = authorDocumentAnnotations(sessionId, path).candidate;
-		const document = selected && authorDocument(sessionId, selected.documentPath);
-		if (!selected || !document || selected.anchor.kind !== "text-range" || selected.revision !== document.version || selected.sourceSha256 !== document.sourceSha256) {
-			setError("Select text in the document first.");
-			return;
-		}
-		const { startOffset, endOffset } = selected.anchor;
-		const content = document.content ?? "";
-		const text = content.slice(startOffset, endOffset);
-		const replacement = style === "Bold" ? `**${text}**` : style === "Link" ? `[${text}](https://)` : text.split("\n").map((line) => `${style === "Heading" ? "## " : "- "}${line}`).join("\n");
-		reviseAuthorDocument(sessionId, document.path, content.slice(0, startOffset) + replacement + content.slice(endOffset));
-		setAuthorRegionCandidate(sessionId, path, void 0);
-		setError(void 0);
-	};
-	const tools = [
-		...[
-			"image",
-			"pdf",
-			"video",
-			"story-preview"
-		].includes(kind) ? [{
-			label: "Pan",
-			glyph: "✋",
-			action: () => setAuthorToolMode(sessionId, path, activeTool === "pan" ? "select" : "pan"),
-			active: activeTool === "pan",
-			annotates: false
-		}, {
-			label: "Draw",
-			glyph: "✎",
-			action: () => setAuthorToolMode(sessionId, path, activeTool === "draw" ? "select" : "draw"),
-			active: activeTool === "draw",
-			annotates: true
-		}] : [],
-		{
-			label: "Region",
-			glyph: "⌗",
-			action: () => setAuthorToolMode(sessionId, path, activeTool === "mark" ? "select" : "mark"),
-			active: activeTool === "mark",
-			annotates: true
-		},
-		...kind === "markdown" ? [
-			{
-				label: "Bold",
-				glyph: "B",
-				action: () => format("Bold")
-			},
-			{
-				label: "Heading",
-				glyph: "H",
-				action: () => format("Heading")
-			},
-			{
-				label: "Link",
-				glyph: "↗",
-				action: () => format("Link")
-			},
-			{
-				label: "List",
-				glyph: "≡",
-				action: () => format("List")
-			}
-		] : [],
-		{
-			label: "Comment",
-			glyph: "●",
-			action: () => setAuthorToolMode(sessionId, path, activeTool === "comment" ? "select" : "comment"),
-			active: activeTool === "comment",
-			annotates: true
-		}
-	];
-	return /* @__PURE__ */ jsxs("section", {
-		"data-testid": "author-tool-palette",
-		className: "space-y-2",
-		children: [
-			/* @__PURE__ */ jsx("h3", {
-				className: "sr-only",
-				children: "Tools"
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "grid grid-cols-4 gap-1.5",
-				children: tools.map((tool) => /* @__PURE__ */ jsxs(Button, {
-					size: "md",
-					variant: "outline",
-					"aria-label": tool.label === "Region" ? "mark region" : tool.label,
-					"aria-pressed": tool.active,
-					onClick: tool.action,
-					className: authorToolClassName(tool.active === true, tool.annotates === true),
-					children: [/* @__PURE__ */ jsx("span", {
-						"aria-hidden": "true",
-						className: "text-lg leading-none",
-						children: tool.glyph
-					}), /* @__PURE__ */ jsx("span", {
-						className: "text-sm",
-						children: tool.label
-					})]
-				}, tool.label))
-			}),
-			/* @__PURE__ */ jsx("p", {
-				className: "text-base leading-normal text-po-dim sm:text-sm",
-				children: activeTool === "draw" ? "Draw a location mark, then enter feedback text. Marks never edit the source." : activeTool === "pan" ? "Drag to pan; pinch to zoom. Use Fit to reset the view." : activeTool === "mark" ? "Drag over the document to mark a region." : activeTool === "comment" ? "Click the document to place a comment pin." : "Choose Region to drag an area, or Comment to place a point."
-			}),
-			error ? /* @__PURE__ */ jsx("output", {
-				className: "block text-base text-po-red",
-				children: error
-			}) : null
-		]
-	});
-}
-//#endregion
-//#region src/extensions/workspaces/sessions/(frontend)/dock/_components/AuthorPanel.tsx
-function AuthorPanel({ sessionId, submitCapture, statuses, renderSlot, renderSessionActivity }) {
-	const documents = useStore(authorWorkspace.store, (state) => {
-		if (sessionId === null) return [];
-		const prefix = `${sessionId}\n`;
-		return Object.entries(state.documents).filter(([key]) => key.startsWith(prefix)).map(([, document]) => document);
-	});
-	const workspace = useStore(authorWorkspace.store, (state) => sessionId === null ? void 0 : state.sessions[sessionId]);
-	const grid = useStore(authorGrid.store, (state) => sessionId === null ? void 0 : state.sessions[sessionId]);
-	const focused = documents.find((document) => document.path === workspace?.focusedDocument?.path);
-	const focusedPath = workspace?.focusedDocument?.path;
-	const requests = (workspace?.requests ?? []).filter((request) => focusedPath === void 0 || request.documentPath === focusedPath);
-	const drafts = useStore(authorWorkspace.store, (state) => authorDocumentAnnotations(sessionId, focusedPath ?? "", state));
-	const activity = sessionId !== null && focusedPath !== void 0 && requests.some((request) => request.status === "REQUESTED" || request.status === "CHANGING") ? renderSessionActivity?.() ?? null : null;
-	return /* @__PURE__ */ jsxs("section", {
-		"data-testid": "author-panel",
-		className: "flex min-h-0 flex-1 flex-col overflow-hidden",
-		children: [/* @__PURE__ */ jsx("div", {
-			className: "min-h-0 flex-1 overflow-y-auto p-3",
-			children: /* @__PURE__ */ jsxs("div", {
-				className: "flex flex-col gap-3",
-				children: [
-					/* @__PURE__ */ jsx("div", {
-						"data-testid": "author-preview-providers",
-						className: "empty:hidden",
-						children: renderSlot("author.preview-provider")
-					}),
-					sessionId !== null && workspace !== void 0 && focused !== void 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-						/* @__PURE__ */ jsx(AuthorToolPalette, {
-							sessionId,
-							path: focused.path,
-							kind: focused.kind,
-							activeTool: workspace.toolsByDocument[normalizeAuthorPath(focused.path)] ?? "select"
-						}),
-						/* @__PURE__ */ jsx("h2", {
-							className: "border-t border-po-border-soft pt-3 text-lg font-semibold text-po-hi",
-							children: "Annotations"
-						}),
-						/* @__PURE__ */ jsx("p", {
-							className: "text-base leading-normal text-po-dim sm:text-sm",
-							children: "Drag a region or place a point, add feedback, then submit here. Requests queue while the agent is working."
-						}),
-						focused.kind === "video" ? /* @__PURE__ */ jsx("p", {
-							className: "text-base text-po-dim sm:text-sm",
-							children: "Annotations reference video frames. They do not save changes to the source video."
-						}) : null,
-						autonomousVoiceGridVisible(statuses) && grid !== void 0 ? /* @__PURE__ */ jsxs("div", {
-							"data-testid": "author-grid-snapshot",
-							className: "rounded border border-po-red/40 bg-po-red/5 p-2 text-base text-po-dim",
-							children: [/* @__PURE__ */ jsx("strong", {
-								className: "text-po-red",
-								children: "VOICE GRID A1–H8"
-							}), /* @__PURE__ */ jsxs("p", {
-								className: "mt-1 truncate",
-								children: ["token ", grid.geometryToken]
-							})]
-						}) : null,
-						/* @__PURE__ */ jsx("div", {
-							className: "max-sm:hidden",
-							children: /* @__PURE__ */ jsx(AuthorFeedbackControls, {
-								sessionId,
-								document: focused,
-								drafts,
-								submitCapture
-							}, focused.path)
-						})
-					] }) : null,
-					/* @__PURE__ */ jsx("div", {
-						className: focused === void 0 ? void 0 : "border-t border-po-border-soft pt-3",
-						children: /* @__PURE__ */ jsx(AuthorRequestLog, { requests })
-					})
-				]
-			})
-		}), activity === null ? null : /* @__PURE__ */ jsx("footer", {
-			"data-testid": "author-session-activity",
-			className: "shrink-0 border-t border-po-border bg-po-rail p-3",
-			children: activity
-		})]
-	});
-}
-//#endregion
-//#region src/extensions/workspaces/sessions/(frontend)/dock/authoring.web.tsx
-var authoring_web_default = defineDockFace({
-	id: "authoring",
-	label: "Author",
-	order: 30,
-	autoSelect: ({ tabId }) => tabId?.startsWith(AUTHOR_FILE_TAB_PREFIX) === true,
-	panel: AuthorPanel,
-	visibility: {
-		subscribe(listener) {
-			const subscription = authorWorkspace.store.subscribe(listener);
-			return () => subscription.unsubscribe();
-		},
-		isVisible(sessionId) {
-			return sessionId !== null && authorWorkspace.store.state.sessions[sessionId]?.focusedDocument !== void 0;
-		}
-	}
-});
-//#endregion
 //#region src/types/apiRoutes.ts
 /**
 * This package's routes, as data.
@@ -2373,27 +2173,6 @@ const api = createApiClient(apiRoutes_default, {
 	sessionAddress: sessionApiAddress
 });
 //#endregion
-//#region src/types/authorPreview.ts
-function parseAuthorOpenSourceAction(input) {
-	if (typeof input !== "object" || input === null) return null;
-	const candidate = input;
-	return candidate.version === 1 && typeof candidate.createTab === "function" ? candidate : null;
-}
-function parseAuthorPreviewAction(input) {
-	if (typeof input !== "object" || input === null) return null;
-	const candidate = input;
-	if (candidate.version !== 1 || typeof candidate.label !== "string" || candidate.label.trim() === "") return null;
-	if (candidate.detail !== void 0 && typeof candidate.detail !== "string") return null;
-	if (typeof candidate.createTab !== "function") return null;
-	if (candidate.supportsSource !== void 0 && typeof candidate.supportsSource !== "function") return null;
-	if (candidate.embeddedPanel !== void 0 && typeof candidate.embeddedPanel !== "function") return null;
-	return candidate;
-}
-const authorPreviewActionSlot = {
-	slot: "author.preview-action",
-	parse: parseAuthorPreviewAction
-};
-//#endregion
 //#region src/types/authorApi.ts
 /** Query parameter naming the session a document request belongs to. */
 const SESSION_QUERY_PARAM = "session";
@@ -2422,6 +2201,10 @@ function structuredFormat(path) {
 	if (lower.endsWith(".pptx")) return "pptx";
 	if (lower.endsWith(".xlsx")) return "xlsx";
 }
+/** A Mermaid source file: edited as text, previewed as the diagram it draws. */
+function isMermaidPath(path) {
+	return /\.(?:mmd|mermaid)$/iu.test(path);
+}
 function authorKindForPath(path) {
 	const lower = path.toLowerCase();
 	if (/\.stories\.(?:js|jsx|ts|tsx)$/u.test(lower)) return "story-preview";
@@ -2429,7 +2212,7 @@ function authorKindForPath(path) {
 	if (format === "markdown-slides") return "slides";
 	if (format !== void 0) return format;
 	const extension = lower.split(".").at(-1) ?? "";
-	if (extension === "md") return "markdown";
+	if (extension === "md" || isMermaidPath(lower)) return "markdown";
 	if (IMAGE_EXTENSIONS.has(extension)) return "image";
 	if (VIDEO_EXTENSIONS.has(extension)) return "video";
 	if (extension === "pdf") return "pdf";
@@ -2460,6 +2243,27 @@ function authorSessionFileUrl(sessionId, path) {
 	if (path.startsWith("artifact:")) return artifactApi.session(sessionId).content.url({ query: { path: path.slice(9) } });
 	return api.session(sessionId).file.url({ query: { path } });
 }
+/**
+* A Markdown image path read against the document's own folder, as GitHub reads
+* it, keeping the `artifact:` scheme. Artifact paths are normalised here because
+* the artifact route refuses `..`; it still owns containment.
+*/
+function authorMarkdownImagePath(documentPath, imagePath) {
+	const artifact = documentPath.startsWith(AUTHOR_ARTIFACT_PREFIX);
+	const local = artifact ? documentPath.slice(9) : documentPath;
+	if (imagePath.startsWith("/")) {
+		if (artifact) throw new Error("Artifact images must use a relative path.");
+		return imagePath;
+	}
+	const segments = local.split("/").slice(0, -1);
+	for (const segment of imagePath.split("/")) {
+		if (segment === "" || segment === ".") continue;
+		if (segment !== "..") segments.push(segment);
+		else if (segments.length === 0 || segments.at(-1) === "") throw new Error("The image is outside this folder.");
+		else segments.pop();
+	}
+	return `${artifact ? AUTHOR_ARTIFACT_PREFIX : ""}${segments.join("/")}`;
+}
 /** The file name a person sees: the last path segment, without the `artifact:` scheme. */
 function authorFileName(path) {
 	const local = path.startsWith("artifact:") ? path.slice(9) : path;
@@ -2575,55 +2379,292 @@ async function croppedImageBytes(documentInput, signal) {
 		bitmap.close();
 	}
 }
-async function bytesToSave(sessionId, document, signal) {
-	if (document.kind === "text" || document.kind === "markdown" || document.kind === "story-preview") return document.content ?? "";
-	if (document.kind === "image" && document.crop !== void 0) return await croppedImageBytes(document, signal);
-	if (document.structuredFormat === void 0) throw new Error("This Author view cannot be saved.");
-	const operations = operationsFor(document);
-	const request = {
-		path: document.path,
-		format: document.structuredFormat,
-		operations,
-		...document.csvDialect === void 0 ? {} : { csvDialect: document.csvDialect }
-	};
-	const preflight = await documentRequest(api.session(sessionId).documentsPreflight, sessionId, request, signal);
-	if (preflight.sourceDigest !== void 0 && preflight.sourceDigest !== document.sourceSha256) throw new Error("Document source changed before saving. Reopen the document.");
-	if (!preflight.accepted) throw new Error(preflight.issues.map((issue) => issue.message).join("\n") || "Author preflight rejected the edit.");
-	const serialized = await documentRequest(api.session(sessionId).documentsSerialize, sessionId, {
-		...request,
-		preflightDigest: preflight.digest
-	}, signal);
-	if (serialized.encoding !== "base64") throw new Error("Author serialize returned an unsupported encoding.");
-	const bytes = decodeBase64(serialized.bytes);
-	return bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
+async function bytesToSave(sessionId, document, signal) {
+	if (document.kind === "text" || document.kind === "markdown" || document.kind === "story-preview") return document.content ?? "";
+	if (document.kind === "image" && document.crop !== void 0) return await croppedImageBytes(document, signal);
+	if (document.structuredFormat === void 0) throw new Error("This Author view cannot be saved.");
+	const operations = operationsFor(document);
+	const request = {
+		path: document.path,
+		format: document.structuredFormat,
+		operations,
+		...document.csvDialect === void 0 ? {} : { csvDialect: document.csvDialect }
+	};
+	const preflight = await documentRequest(api.session(sessionId).documentsPreflight, sessionId, request, signal);
+	if (preflight.sourceDigest !== void 0 && preflight.sourceDigest !== document.sourceSha256) throw new Error("Document source changed before saving. Reopen the document.");
+	if (!preflight.accepted) throw new Error(preflight.issues.map((issue) => issue.message).join("\n") || "Author preflight rejected the edit.");
+	const serialized = await documentRequest(api.session(sessionId).documentsSerialize, sessionId, {
+		...request,
+		preflightDigest: preflight.digest
+	}, signal);
+	if (serialized.encoding !== "base64") throw new Error("Author serialize returned an unsupported encoding.");
+	const bytes = decodeBase64(serialized.bytes);
+	return bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
+}
+async function saveAuthorDocument(sessionId, document, signal) {
+	if (document.path.startsWith("artifact:")) throw new Error("Artifacts are read-only.");
+	if (document.sourceSha256 === void 0) throw new Error("This Author view has no source digest.");
+	const response = await sealedTransport.fetch(authorSessionFileUrl(sessionId, document.path), {
+		method: "PUT",
+		headers: {
+			"Content-Type": "application/octet-stream",
+			"X-Expected-SHA256": document.sourceSha256
+		},
+		body: await bytesToSave(sessionId, document, signal),
+		signal
+	});
+	if (!response.ok) throw new Error(`Author save failed (${response.status})`);
+	const sha256 = response.headers.get("X-File-SHA256");
+	if (sha256 === null || !/^[a-f0-9]{64}$/.test(sha256)) throw new Error("Author save returned an invalid digest.");
+	return sha256;
+}
+function csvDialectFromMetadata(metadata) {
+	if (metadata === void 0) return void 0;
+	const { delimiter, quote, recordDelimiter } = metadata;
+	if (delimiter !== "," && delimiter !== ";" && delimiter !== "	" && delimiter !== "|" || quote !== "\"" && quote !== "'" || recordDelimiter !== "\n" && recordDelimiter !== "\r\n") throw new Error("Author document API returned an invalid CSV dialect.");
+	return {
+		delimiter,
+		quote,
+		recordDelimiter
+	};
+}
+//#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/dock/_components/AuthorToolPalette.tsx
+/** One tool tile. An active annotation tool is the person's mark (rose); an active view tool is Po's jade. */
+function authorToolClassName(active, annotates) {
+	return `h-auto min-h-11 min-w-11 flex-col gap-1 rounded-md px-1 py-2 text-base [@media(pointer:fine)]:min-h-8 ${!active ? "border-po-border-soft bg-po-panel text-po-dim" : annotates ? "border-po-edge-magenta bg-po-tint-magenta font-semibold text-po-magenta hover:text-po-magenta" : "border-po-edge-green bg-po-tint-green font-semibold text-po-green hover:text-po-green"}`;
+}
+function AuthorToolPalette({ sessionId, path, kind, activeTool }) {
+	const [error, setError] = useState();
+	const format = (style) => {
+		const selected = authorDocumentAnnotations(sessionId, path).candidate;
+		const document = selected && authorDocument(sessionId, selected.documentPath);
+		if (!selected || !document || selected.anchor.kind !== "text-range" || selected.revision !== document.version || selected.sourceSha256 !== document.sourceSha256) {
+			setError("Select text in the document first.");
+			return;
+		}
+		const { startOffset, endOffset } = selected.anchor;
+		const content = document.content ?? "";
+		const text = content.slice(startOffset, endOffset);
+		const replacement = style === "Bold" ? `**${text}**` : style === "Link" ? `[${text}](https://)` : text.split("\n").map((line) => `${style === "Heading" ? "## " : "- "}${line}`).join("\n");
+		reviseAuthorDocument(sessionId, document.path, content.slice(0, startOffset) + replacement + content.slice(endOffset));
+		setAuthorRegionCandidate(sessionId, path, void 0);
+		setError(void 0);
+	};
+	const tools = [
+		...[
+			"image",
+			"pdf",
+			"video",
+			"story-preview"
+		].includes(kind) ? [{
+			label: "Pan",
+			glyph: "✋",
+			action: () => setAuthorToolMode(sessionId, path, activeTool === "pan" ? "select" : "pan"),
+			active: activeTool === "pan",
+			annotates: false
+		}, {
+			label: "Draw",
+			glyph: "✎",
+			action: () => setAuthorToolMode(sessionId, path, activeTool === "draw" ? "select" : "draw"),
+			active: activeTool === "draw",
+			annotates: true
+		}] : [],
+		{
+			label: "Region",
+			glyph: "⌗",
+			action: () => setAuthorToolMode(sessionId, path, activeTool === "mark" ? "select" : "mark"),
+			active: activeTool === "mark",
+			annotates: true
+		},
+		...kind === "markdown" && !isMermaidPath(path) ? [
+			{
+				label: "Bold",
+				glyph: "B",
+				action: () => format("Bold")
+			},
+			{
+				label: "Heading",
+				glyph: "H",
+				action: () => format("Heading")
+			},
+			{
+				label: "Link",
+				glyph: "↗",
+				action: () => format("Link")
+			},
+			{
+				label: "List",
+				glyph: "≡",
+				action: () => format("List")
+			}
+		] : [],
+		{
+			label: "Comment",
+			glyph: "●",
+			action: () => setAuthorToolMode(sessionId, path, activeTool === "comment" ? "select" : "comment"),
+			active: activeTool === "comment",
+			annotates: true
+		}
+	];
+	return /* @__PURE__ */ jsxs("section", {
+		"data-testid": "author-tool-palette",
+		className: "space-y-2",
+		children: [
+			/* @__PURE__ */ jsx("h3", {
+				className: "sr-only",
+				children: "Tools"
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "grid grid-cols-4 gap-1.5",
+				children: tools.map((tool) => /* @__PURE__ */ jsxs(Button, {
+					size: "md",
+					variant: "outline",
+					"aria-label": tool.label === "Region" ? "mark region" : tool.label,
+					"aria-pressed": tool.active,
+					onClick: tool.action,
+					className: authorToolClassName(tool.active === true, tool.annotates === true),
+					children: [/* @__PURE__ */ jsx("span", {
+						"aria-hidden": "true",
+						className: "text-lg leading-none",
+						children: tool.glyph
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-sm",
+						children: tool.label
+					})]
+				}, tool.label))
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "text-base leading-normal text-po-dim sm:text-sm",
+				children: activeTool === "draw" ? "Draw a location mark, then enter feedback text. Marks never edit the source." : activeTool === "pan" ? "Drag to pan; pinch to zoom. Use Fit to reset the view." : activeTool === "mark" ? "Drag over the document to mark a region." : activeTool === "comment" ? "Click the document to place a comment pin." : "Choose Region to drag an area, or Comment to place a point."
+			}),
+			error ? /* @__PURE__ */ jsx("output", {
+				className: "block text-base text-po-red",
+				children: error
+			}) : null
+		]
+	});
+}
+//#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/dock/_components/AuthorPanel.tsx
+function AuthorPanel({ sessionId, submitCapture, statuses, renderSlot, renderSessionActivity }) {
+	const documents = useStore(authorWorkspace.store, (state) => {
+		if (sessionId === null) return [];
+		const prefix = `${sessionId}\n`;
+		return Object.entries(state.documents).filter(([key]) => key.startsWith(prefix)).map(([, document]) => document);
+	});
+	const workspace = useStore(authorWorkspace.store, (state) => sessionId === null ? void 0 : state.sessions[sessionId]);
+	const grid = useStore(authorGrid.store, (state) => sessionId === null ? void 0 : state.sessions[sessionId]);
+	const focused = documents.find((document) => document.path === workspace?.focusedDocument?.path);
+	const focusedPath = workspace?.focusedDocument?.path;
+	const requests = (workspace?.requests ?? []).filter((request) => focusedPath === void 0 || request.documentPath === focusedPath);
+	const drafts = useStore(authorWorkspace.store, (state) => authorDocumentAnnotations(sessionId, focusedPath ?? "", state));
+	const activity = sessionId !== null && focusedPath !== void 0 && requests.some((request) => request.status === "REQUESTED" || request.status === "CHANGING") ? renderSessionActivity?.() ?? null : null;
+	return /* @__PURE__ */ jsxs("section", {
+		"data-testid": "author-panel",
+		className: "flex min-h-0 flex-1 flex-col overflow-hidden",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "min-h-0 flex-1 overflow-y-auto p-3",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-3",
+				children: [
+					/* @__PURE__ */ jsx("div", {
+						"data-testid": "author-preview-providers",
+						className: "empty:hidden",
+						children: renderSlot("author.preview-provider")
+					}),
+					sessionId !== null && workspace !== void 0 && focused !== void 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+						/* @__PURE__ */ jsx(AuthorToolPalette, {
+							sessionId,
+							path: focused.path,
+							kind: focused.kind,
+							activeTool: workspace.toolsByDocument[normalizeAuthorPath(focused.path)] ?? "select"
+						}),
+						/* @__PURE__ */ jsx("h2", {
+							className: "border-t border-po-border-soft pt-3 text-lg font-semibold text-po-hi",
+							children: "Annotations"
+						}),
+						/* @__PURE__ */ jsx("p", {
+							className: "text-base leading-normal text-po-dim sm:text-sm",
+							children: "Drag a region or place a point, add feedback, then submit here. Requests queue while the agent is working."
+						}),
+						focused.kind === "video" ? /* @__PURE__ */ jsx("p", {
+							className: "text-base text-po-dim sm:text-sm",
+							children: "Annotations reference video frames. They do not save changes to the source video."
+						}) : null,
+						autonomousVoiceGridVisible(statuses) && grid !== void 0 ? /* @__PURE__ */ jsxs("div", {
+							"data-testid": "author-grid-snapshot",
+							className: "rounded border border-po-red/40 bg-po-red/5 p-2 text-base text-po-dim",
+							children: [/* @__PURE__ */ jsx("strong", {
+								className: "text-po-red",
+								children: "VOICE GRID A1–H8"
+							}), /* @__PURE__ */ jsxs("p", {
+								className: "mt-1 truncate",
+								children: ["token ", grid.geometryToken]
+							})]
+						}) : null,
+						/* @__PURE__ */ jsx("div", {
+							className: "max-sm:hidden",
+							children: /* @__PURE__ */ jsx(AuthorFeedbackControls, {
+								sessionId,
+								document: focused,
+								drafts,
+								submitCapture
+							}, focused.path)
+						})
+					] }) : null,
+					/* @__PURE__ */ jsx("div", {
+						className: focused === void 0 ? void 0 : "border-t border-po-border-soft pt-3",
+						children: /* @__PURE__ */ jsx(AuthorRequestLog, { requests })
+					})
+				]
+			})
+		}), activity === null ? null : /* @__PURE__ */ jsx("footer", {
+			"data-testid": "author-session-activity",
+			className: "shrink-0 border-t border-po-border bg-po-rail p-3",
+			children: activity
+		})]
+	});
 }
-async function saveAuthorDocument(sessionId, document, signal) {
-	if (document.path.startsWith("artifact:")) throw new Error("Artifacts are read-only.");
-	if (document.sourceSha256 === void 0) throw new Error("This Author view has no source digest.");
-	const response = await sealedTransport.fetch(authorSessionFileUrl(sessionId, document.path), {
-		method: "PUT",
-		headers: {
-			"Content-Type": "application/octet-stream",
-			"X-Expected-SHA256": document.sourceSha256
+//#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/dock/authoring.web.tsx
+var authoring_web_default = defineDockFace({
+	id: "authoring",
+	label: "Author",
+	order: 30,
+	autoSelect: ({ tabId }) => tabId?.startsWith(AUTHOR_FILE_TAB_PREFIX) === true,
+	panel: AuthorPanel,
+	visibility: {
+		subscribe(listener) {
+			const subscription = authorWorkspace.store.subscribe(listener);
+			return () => subscription.unsubscribe();
 		},
-		body: await bytesToSave(sessionId, document, signal),
-		signal
-	});
-	if (!response.ok) throw new Error(`Author save failed (${response.status})`);
-	const sha256 = response.headers.get("X-File-SHA256");
-	if (sha256 === null || !/^[a-f0-9]{64}$/.test(sha256)) throw new Error("Author save returned an invalid digest.");
-	return sha256;
+		isVisible(sessionId) {
+			return sessionId !== null && authorWorkspace.store.state.sessions[sessionId]?.focusedDocument !== void 0;
+		}
+	}
+});
+//#endregion
+//#region src/types/authorPreview.ts
+function parseAuthorOpenSourceAction(input) {
+	if (typeof input !== "object" || input === null) return null;
+	const candidate = input;
+	return candidate.version === 1 && typeof candidate.createTab === "function" ? candidate : null;
 }
-function csvDialectFromMetadata(metadata) {
-	if (metadata === void 0) return void 0;
-	const { delimiter, quote, recordDelimiter } = metadata;
-	if (delimiter !== "," && delimiter !== ";" && delimiter !== "	" && delimiter !== "|" || quote !== "\"" && quote !== "'" || recordDelimiter !== "\n" && recordDelimiter !== "\r\n") throw new Error("Author document API returned an invalid CSV dialect.");
-	return {
-		delimiter,
-		quote,
-		recordDelimiter
-	};
+function parseAuthorPreviewAction(input) {
+	if (typeof input !== "object" || input === null) return null;
+	const candidate = input;
+	if (candidate.version !== 1 || typeof candidate.label !== "string" || candidate.label.trim() === "") return null;
+	if (candidate.detail !== void 0 && typeof candidate.detail !== "string") return null;
+	if (typeof candidate.createTab !== "function") return null;
+	if (candidate.supportsSource !== void 0 && typeof candidate.supportsSource !== "function") return null;
+	if (candidate.embeddedPanel !== void 0 && typeof candidate.embeddedPanel !== "function") return null;
+	return candidate;
 }
+const authorPreviewActionSlot = {
+	slot: "author.preview-action",
+	parse: parseAuthorPreviewAction
+};
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/_lib/authorGridTools.ts
 const stringProperty = {
@@ -3036,6 +3077,9 @@ function authorProfilesForDocument(sessionId, path, kind) {
 * declares as `file` with `host: true`; this package serves no bytes of its
 * own. The transport stays raw because what comes back is a blob, and a call
 * through the generated client reads the body as JSON to report a refusal.
+*
+* An SVG comes back as a sized data URL (see `svgImageUrl`), so it has an
+* intrinsic size and a region capture can still draw it to a canvas.
 */
 async function loadAuthorMedia(source, signal, imageData) {
 	let blob;
@@ -3047,6 +3091,14 @@ async function loadAuthorMedia(source, signal, imageData) {
 		});
 		if (!response.ok) throw new Error(`Author media could not be loaded (${response.status}).`);
 		blob = await response.blob();
+		if (blob.type.startsWith("image/svg+xml")) {
+			const url = svgImageUrl(await blob.text());
+			signal.throwIfAborted();
+			return {
+				url,
+				dispose() {}
+			};
+		}
 	}
 	signal.throwIfAborted();
 	const url = URL.createObjectURL(blob);
@@ -3954,7 +4006,7 @@ function AuthorStructuredView({ sessionId, document, displayedRegions }) {
 }
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/_components/AuthorTextView.tsx
-function AuthorTextView({ sessionId, document, preview, displayedRegions }) {
+function AuthorTextView({ sessionId, document, preview, displayedRegions, renderMediaReview }) {
 	const host = useRef(null);
 	const editor = useRef(null);
 	useEffect(() => registerAuthorGridResolver(sessionId, (cell, geometry) => {
@@ -3986,6 +4038,13 @@ function AuthorTextView({ sessionId, document, preview, displayedRegions }) {
 		}] : []));
 	}, [displayedRegions]);
 	const lines = (document.content ?? "").split("\n").length;
+	const loadImage = useCallback(async (imagePath) => {
+		const path = authorMarkdownImagePath(document.path, imagePath);
+		return {
+			...await loadAuthorMedia(authorSessionFileUrl(sessionId, path), new AbortController().signal),
+			path
+		};
+	}, [sessionId, document.path]);
 	return /* @__PURE__ */ jsxs("div", {
 		ref: host,
 		className: "flex min-h-0 flex-1 flex-col",
@@ -3994,7 +4053,12 @@ function AuthorTextView({ sessionId, document, preview, displayedRegions }) {
 			className: "min-h-0 flex-1 overflow-auto bg-po-deep/50 p-6",
 			children: /* @__PURE__ */ jsx("article", {
 				className: "mx-auto min-h-full max-w-3xl rounded-md bg-po-panel px-6 py-8 sm:px-10 text-lg leading-relaxed text-po-text shadow-sm ring-1 ring-po-border-soft",
-				children: /* @__PURE__ */ jsx(Markdown, { text: document.content ?? "" })
+				children: /* @__PURE__ */ jsx(Markdown, {
+					text: isMermaidPath(document.path) ? `\`\`\`\`mermaid\n${document.content ?? ""}\n\`\`\`\`` : document.content ?? "",
+					loadImage,
+					documentPath: document.path,
+					renderMediaReview
+				})
 			})
 		}) : /* @__PURE__ */ jsx(CodeEditor, {
 			value: document.content ?? "",
@@ -4160,7 +4224,8 @@ function AuthorDocumentPanel(props) {
 		sessionId,
 		document,
 		preview: document.kind === "markdown" && markdownPreview && activeTool === "select" && !gridVisible,
-		displayedRegions
+		displayedRegions,
+		renderMediaReview: markdownMediaReview(props)
 	});
 	const sourcePanel = document.kind === "text" || document.kind === "markdown" || document.kind === "story-preview" ? textPanel : document.structuredFormat !== void 0 ? /* @__PURE__ */ jsx(AuthorStructuredView, {
 		sessionId,
@@ -4617,6 +4682,147 @@ var ImageFeedback_author_image_feedback_web_default = defineFill({
 	}
 });
 //#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/_lib/authorMarkdownMedia.ts
+const MAX_DIMENSION = 4096;
+const MERMAID_SOURCE_MAX_CHARACTERS = 8192;
+function base64(bytes) {
+	let binary = "";
+	for (let index = 0; index < bytes.length; index += 32768) binary += String.fromCharCode(...bytes.subarray(index, index + 32768));
+	return btoa(binary);
+}
+/**
+* A picture opened from rendered Markdown, as an in-memory Author image.
+*
+* Every picture becomes PNG bytes held in the document, so annotation and
+* capture work the same for a raster image, an SVG and a mermaid diagram, and
+* nothing is written back. The path is synthetic and keyed by content, so the
+* same picture reopens with its unsent drafts.
+*/
+async function authorMarkdownMediaDocument(media, signal) {
+	const image = new Image();
+	image.src = await drawableImageUrl(media.url, signal);
+	await image.decode();
+	signal.throwIfAborted();
+	if (image.naturalWidth === 0 || image.naturalHeight === 0) throw new Error("This picture has no size to annotate.");
+	const scale = Math.min(1, MAX_DIMENSION / Math.max(image.naturalWidth, image.naturalHeight));
+	const canvas = document.createElement("canvas");
+	canvas.width = Math.max(1, Math.round(image.naturalWidth * scale));
+	canvas.height = Math.max(1, Math.round(image.naturalHeight * scale));
+	const context = canvas.getContext("2d");
+	if (context === null) throw new Error("Canvas is unavailable.");
+	context.drawImage(image, 0, 0, canvas.width, canvas.height);
+	let png;
+	try {
+		png = await new Promise((resolve) => canvas.toBlob(resolve, "image/png"));
+	} catch {
+		throw new Error("This picture comes from another site and cannot be annotated.");
+	}
+	if (png === null) throw new Error("This picture could not be prepared for annotation.");
+	const bytes = new Uint8Array(await png.arrayBuffer());
+	const digest = new Uint8Array(await crypto.subtle.digest("SHA-256", bytes));
+	signal.throwIfAborted();
+	const sha256 = Array.from(digest, (byte) => byte.toString(16).padStart(2, "0")).join("");
+	return {
+		path: `markdown-media/${sha256}.png`,
+		kind: "image",
+		title: media.title,
+		sourceSha256: sha256,
+		imageData: base64(bytes),
+		mediaUrl: `markdown-media:${sha256}`,
+		markdownMedia: {
+			kind: media.kind,
+			...media.sourcePath === void 0 ? {} : { sourcePath: media.sourcePath },
+			...media.documentPath === void 0 ? {} : { documentPath: media.documentPath },
+			...media.mermaidSource === void 0 ? {} : { mermaidSource: media.mermaidSource.slice(0, MERMAID_SOURCE_MAX_CHARACTERS) }
+		}
+	};
+}
+//#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/_components/AuthorMediaReviewPanel.tsx
+/**
+* Pan, annotate and send feedback on a picture opened from rendered Markdown.
+*
+* It fills the full-screen viewer, which covers the Author rail, so the tools
+* and the submit button live beside the canvas here rather than in the rail.
+*/
+function AuthorMediaReviewPanel({ media, sessionId, submitCapture }) {
+	const [document, setDocument] = useState();
+	const [error, setError] = useState();
+	useEffect(() => {
+		setDocument(void 0);
+		setError(void 0);
+		if (sessionId === null) return;
+		const controller = new AbortController();
+		let generation;
+		authorMarkdownMediaDocument(media, controller.signal).then((input) => {
+			if (controller.signal.aborted) return;
+			setDocument(putAuthorDocument(sessionId, input));
+			generation = focusAuthorDocument(sessionId, input.path);
+		}).catch((reason) => {
+			if (!controller.signal.aborted) setError(reason instanceof Error ? reason.message : String(reason));
+		});
+		return () => {
+			controller.abort();
+			if (generation !== void 0) releaseAuthorDocumentFocus(sessionId, generation);
+		};
+	}, [media, sessionId]);
+	const drafts = useStore(authorWorkspace.store, (state) => authorDocumentAnnotations(sessionId, document?.path ?? "", state));
+	const tool = useStore(authorWorkspace.store, (state) => sessionId === null ? "select" : state.sessions[sessionId]?.toolsByDocument[document?.path ?? ""] ?? "select");
+	if (sessionId === null) return /* @__PURE__ */ jsx("output", {
+		className: "p-4 text-po-dim",
+		children: "Open a session to review this picture."
+	});
+	if (error) return /* @__PURE__ */ jsx("output", {
+		className: "p-4 text-po-red",
+		children: error
+	});
+	if (!document) return /* @__PURE__ */ jsx("output", {
+		className: "p-4 text-po-dim",
+		children: "Preparing the picture for review…"
+	});
+	const displayedRegions = drafts.annotations.map((region, index) => ({
+		ordinal: index + 1,
+		region
+	}));
+	return /* @__PURE__ */ jsxs("section", {
+		"data-testid": "author-media-review",
+		className: "flex min-h-0 flex-1 flex-col sm:flex-row",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "flex min-h-0 flex-1 flex-col",
+			children: /* @__PURE__ */ jsx(AuthorMediaView, {
+				sessionId,
+				document,
+				activeTool: tool,
+				displayedRegions,
+				pendingCandidate: drafts.candidate !== void 0
+			})
+		}), /* @__PURE__ */ jsxs("aside", {
+			className: "flex max-h-[45dvh] shrink-0 flex-col gap-4 overflow-y-auto border-t border-po-border bg-po-bg p-4 sm:max-h-none sm:w-80 sm:border-t-0 sm:border-l",
+			children: [/* @__PURE__ */ jsx(AuthorToolPalette, {
+				sessionId,
+				path: document.path,
+				kind: "image",
+				activeTool: tool
+			}), /* @__PURE__ */ jsx(AuthorFeedbackControls, {
+				sessionId,
+				document,
+				drafts,
+				submitCapture
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/fill/MediaReview.author.media-review.web.ts
+var MediaReview_author_media_review_web_default = defineFill({
+	slot: "author.media-review",
+	id: "media-review",
+	data: {
+		version: 1,
+		panel: AuthorMediaReviewPanel
+	}
+});
+//#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/leader/author-toggle.web.ts
 var author_toggle_web_default = defineLeaderBinding({
 	id: "author.toggle",
@@ -4890,6 +5096,13 @@ var image_feedback_web_default = defineSlotFile({
 	parse: parseAuthorImageFeedbackContribution
 });
 //#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/slot/media-review.web.ts
+/** Any Markdown host reads this through `markdownMediaReview` to annotate an opened picture. */
+var media_review_web_default = defineSlotFile({
+	slot: "author.media-review",
+	parse: markdownMediaReviewSlot.parse
+});
+//#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/slot/open-source.web.ts
 var open_source_web_default = defineSlotFile({
 	slot: "author.open-source",
@@ -5132,13 +5345,20 @@ const webPlugin = defineWebPlugin({
 			return author_document_web_default;
 		},
 		get fills() {
-			return [via({
-				slot: "author.open-source",
-				id: "author"
-			}, Author_author_open_source_web_default), via({
-				slot: "author.image-feedback",
-				id: "image-feedback"
-			}, ImageFeedback_author_image_feedback_web_default)];
+			return [
+				via({
+					slot: "author.open-source",
+					id: "author"
+				}, Author_author_open_source_web_default),
+				via({
+					slot: "author.image-feedback",
+					id: "image-feedback"
+				}, ImageFeedback_author_image_feedback_web_default),
+				via({
+					slot: "author.media-review",
+					id: "media-review"
+				}, MediaReview_author_media_review_web_default)
+			];
 		},
 		get leaderBindings() {
 			return [via({ id: "author.author-toggle" }, author_toggle_web_default)];
@@ -5149,6 +5369,7 @@ const webPlugin = defineWebPlugin({
 		get slots() {
 			return [
 				via({ slot: "author.image-feedback" }, image_feedback_web_default),
+				via({ slot: "author.media-review" }, media_review_web_default),
 				via({ slot: "author.open-source" }, open_source_web_default),
 				via({ slot: "author.preview-action" }, preview_action_web_default),
 				via({ slot: "author.preview-provider" }, preview_provider_web_default)