@fabrika/canvas-kernel 0.1.44 → 0.2.0

package/src/client/diffLines.ts

@@ -1,50 +1,62 @@
 export interface DiffLine {
-  type: "same" | "removed" | "added";
-  line: string;
+	type: 'same' | 'removed' | 'added'
+	line: string
 }
 
 /** Line-level diff of two texts, longest-common-subsequence based. */
 export function buildDiffLines(before: string, after: string): DiffLine[] {
-  const beforeLines = before.split("\n");
-  const afterLines = after.split("\n");
-  const lcs = computeLCS(beforeLines, afterLines);
-  const diffLines: DiffLine[] = [];
+	const beforeLines = before.split('\n')
+	const afterLines = after.split('\n')
+	const lcs = computeLCS(beforeLines, afterLines)
+	const diffLines: DiffLine[] = []
 
-  let bi = 0, ai = 0, li = 0;
-  while (bi < beforeLines.length || ai < afterLines.length) {
-    // split() never leaves holes, so "in range" and "defined" are the same test.
-    const beforeLine = beforeLines[bi];
-    const afterLine = afterLines[ai];
-    if (li < lcs.length && beforeLine !== undefined && afterLine !== undefined
-        && beforeLine === lcs[li] && afterLine === lcs[li]) {
-      diffLines.push({ type: "same", line: beforeLine }); bi++; ai++; li++;
-    } else if (beforeLine !== undefined && (li >= lcs.length || beforeLine !== lcs[li])) {
-      diffLines.push({ type: "removed", line: beforeLine }); bi++;
-    } else if (afterLine !== undefined) {
-      diffLines.push({ type: "added", line: afterLine }); ai++;
-    }
-  }
+	let bi = 0, ai = 0, li = 0
+	while (bi < beforeLines.length || ai < afterLines.length) {
+		// split() never leaves holes, so "in range" and "defined" are the same test.
+		const beforeLine = beforeLines[bi]
+		const afterLine = afterLines[ai]
+		if (
+			li < lcs.length && beforeLine !== undefined && afterLine !== undefined
+			&& beforeLine === lcs[li] && afterLine === lcs[li]
+		) {
+			diffLines.push({ type: 'same', line: beforeLine })
+			bi++
+			ai++
+			li++
+		} else if (beforeLine !== undefined && (li >= lcs.length || beforeLine !== lcs[li])) {
+			diffLines.push({ type: 'removed', line: beforeLine })
+			bi++
+		} else if (afterLine !== undefined) {
+			diffLines.push({ type: 'added', line: afterLine })
+			ai++
+		}
+	}
 
-  return diffLines;
+	return diffLines
 }
 
 export function computeLCS(a: string[], b: string[]): string[] {
-  const m = a.length, n = b.length;
-  // Rows are fully filled before use; the `?? 0` fallbacks only satisfy the
-  // checker, which cannot see that every index here is in range.
-  const dp: number[][] = Array.from({ length: m + 1 }, () => new Array<number>(n + 1).fill(0));
-  for (let i = 1; i <= m; i++) {
-    const row = dp[i] ?? [];
-    const prev = dp[i - 1] ?? [];
-    for (let j = 1; j <= n; j++)
-      row[j] = a[i-1] === b[j-1] ? (prev[j-1] ?? 0) + 1 : Math.max(prev[j] ?? 0, row[j-1] ?? 0);
-  }
-  const result: string[] = [];
-  let i = m, j = n;
-  while (i > 0 && j > 0) {
-    const line = a[i-1];
-    if (line !== undefined && line === b[j-1]) { result.unshift(line); i--; j--; }
-    else if ((dp[i-1]?.[j] ?? 0) > (dp[i]?.[j-1] ?? 0)) i--; else j--;
-  }
-  return result;
+	const m = a.length, n = b.length
+	// Rows are fully filled before use; the `?? 0` fallbacks only satisfy the
+	// checker, which cannot see that every index here is in range.
+	const dp: number[][] = Array.from({ length: m + 1 }, () => new Array<number>(n + 1).fill(0))
+	for (let i = 1; i <= m; i++) {
+		const row = dp[i] ?? []
+		const prev = dp[i - 1] ?? []
+		for (let j = 1; j <= n; j++) {
+			row[j] = a[i - 1] === b[j - 1] ? (prev[j - 1] ?? 0) + 1 : Math.max(prev[j] ?? 0, row[j - 1] ?? 0)
+		}
+	}
+	const result: string[] = []
+	let i = m, j = n
+	while (i > 0 && j > 0) {
+		const line = a[i - 1]
+		if (line !== undefined && line === b[j - 1]) {
+			result.unshift(line)
+			i--
+			j--
+		} else if ((dp[i - 1]?.[j] ?? 0) > (dp[i]?.[j - 1] ?? 0)) i--
+		else j--
+	}
+	return result
 }

package/src/client/generateMarkdown.ts

@@ -1,8 +1,7 @@
 // The canvas document format: revisions, responses, required fields, sections.
 // Rendering one annotation is host-agnostic and lives in ./annotationMarkdown.
-import type { Annotation, PlanResponse, FeedbackEntry } from "./AnnotationProvider";
-import { renderAnnotation } from "./annotationMarkdown";
-import { RESPONSE_ANNOTATION_PATH } from "./utils";
+import { renderAnnotation, RESPONSE_ANNOTATION_PATH } from '@fabrika/annotations'
+import type { Annotation, FeedbackEntry, PlanResponse } from './AnnotationProvider'
 
 /**
  * Drop answers whose question is not in this revision's canvas. A draft carried
@@ -14,14 +13,14 @@ import { RESPONSE_ANNOTATION_PATH } from "./utils";
  * point in this draft, never the currently-mounted ones — see canPruneResponses.
  */
 export function pruneStaleResponses(
-  responses: Map<string, PlanResponse>,
-  seenResponseIds: ReadonlySet<string>,
+	responses: Map<string, PlanResponse>,
+	seenResponseIds: ReadonlySet<string>,
 ): Map<string, PlanResponse> {
-  const out = new Map<string, PlanResponse>();
-  for (const [id, r] of responses) {
-    if (seenResponseIds.has(id)) out.set(id, r);
-  }
-  return out;
+	const out = new Map<string, PlanResponse>()
+	for (const [id, r] of responses) {
+		if (seenResponseIds.has(id)) out.set(id, r)
+	}
+	return out
 }
 
 /**
@@ -33,218 +32,225 @@ export function pruneStaleResponses(
  * pruning early would throw away every answer the author gave.
  */
 export function canPruneResponses(
-  canvasFiles: readonly string[] | undefined,
-  renderedCanvases: ReadonlySet<string>,
+	canvasFiles: readonly string[] | undefined,
+	renderedCanvases: ReadonlySet<string>,
 ): boolean {
-  if (!canvasFiles || canvasFiles.length === 0) return false;
-  return canvasFiles.every((filename) => renderedCanvases.has(filename));
+	if (!canvasFiles || canvasFiles.length === 0) return false
+	return canvasFiles.every((filename) => renderedCanvases.has(filename))
 }
 
 /**
  * Generate human-readable markdown feedback from annotations and responses.
  */
 export function generateMarkdown(
-  annotations: Annotation[],
-  generalNote: string,
-  responses?: Map<string, PlanResponse>,
-  feedbackEntries?: Map<string, FeedbackEntry>,
-  includedRemoteIds?: Set<string>,
+	annotations: Annotation[],
+	generalNote: string,
+	responses?: Map<string, PlanResponse>,
+	feedbackEntries?: Map<string, FeedbackEntry>,
+	includedRemoteIds?: Set<string>,
 ): string {
-  const parts: string[] = [];
-  const included = annotations.filter((a) =>
-    a.source !== "remote" || (includedRemoteIds && includedRemoteIds.has(a.id))
-  );
-  const responseAnns = included.filter((a) => a.filePath === RESPONSE_ANNOTATION_PATH);
-  const canvasAnns = included.filter((a) => !a.filePath);
-  const fileAnns = included.filter((a) => a.filePath && a.filePath !== RESPONSE_ANNOTATION_PATH);
-  const resps = responses ? Array.from(responses.values()).filter((r) => hasValue(r)) : [];
-  const fbEntries = feedbackEntries
-    ? Array.from(feedbackEntries.values()).filter((e) => e.markdown.trim())
-    : [];
-
-  // Responses section
-  const hasResponseSection = resps.length > 0 || fbEntries.length > 0;
-  if (hasResponseSection) {
-    parts.push("## Responses");
-    parts.push("");
-    for (const r of resps) {
-      parts.push(renderResponse(r));
-    }
-    for (const entry of fbEntries) {
-      parts.push(entry.markdown.trim());
-      parts.push("");
-    }
-  }
-
-  // Response annotations (on agent response banner)
-  if (responseAnns.length > 0) {
-    parts.push("## Annotations on agent response");
-    parts.push("");
-    for (const ann of responseAnns) {
-      parts.push(renderAnnotation(ann));
-    }
-  }
-
-  // Canvas annotations grouped by canvas file, then hierarchy
-  if (canvasAnns.length > 0) {
-    parts.push("## Canvas annotations");
-    parts.push("");
-
-    // Group by canvasFile
-    const byCanvas = new Map<string, Annotation[]>();
-    for (const ann of canvasAnns) {
-      const key = ann.canvasFile || "";
-      if (!byCanvas.has(key)) byCanvas.set(key, []);
-      byCanvas.get(key)!.push(ann);
-    }
-
-    const canvasKeys = [...byCanvas.keys()].sort();
-    const multipleCanvases = canvasKeys.length > 1 || (canvasKeys.length === 1 && canvasKeys[0] !== "");
-
-    for (const canvasKey of canvasKeys) {
-      const anns = byCanvas.get(canvasKey)!;
-      if (multipleCanvases && canvasKey) {
-        parts.push(`### ${canvasKey.replace(/\.jsx$/, "")}`);
-        parts.push("");
-      }
-      const grouped = groupByHierarchy(anns);
-      parts.push(renderHierarchyGroup(grouped));
-    }
-  }
-
-  // File annotations grouped by path
-  if (fileAnns.length > 0) {
-    const groups: Record<string, Annotation[]> = {};
-    for (const ann of fileAnns) {
-      const key = ann.filePath!;
-      if (!groups[key]) groups[key] = [];
-      groups[key].push(ann);
-    }
-    parts.push("## File annotations");
-    parts.push("");
-    for (const [filePath, anns] of Object.entries(groups)) {
-      parts.push(`### ${filePath}`);
-      parts.push("");
-      for (const ann of anns) {
-        parts.push(renderAnnotation(ann));
-      }
-    }
-  }
-
-  // General notes
-  if (generalNote.trim()) {
-    parts.push("## General notes");
-    parts.push("");
-    parts.push(generalNote.trim());
-    parts.push("");
-  }
-
-  return parts.join("\n").trim() + "\n";
+	const parts: string[] = []
+	const included = annotations.filter((a) => a.source !== 'remote' || (includedRemoteIds && includedRemoteIds.has(a.id)))
+	const responseAnns = included.filter((a) => a.filePath === RESPONSE_ANNOTATION_PATH)
+	const canvasAnns = included.filter((a) => !a.filePath)
+	const fileAnns = included.filter((a) => a.filePath && a.filePath !== RESPONSE_ANNOTATION_PATH)
+	const resps = responses ? Array.from(responses.values()).filter((r) => hasValue(r)) : []
+	const fbEntries = feedbackEntries
+		? Array.from(feedbackEntries.values()).filter((e) => e.markdown.trim())
+		: []
+
+	// Responses section
+	const hasResponseSection = resps.length > 0 || fbEntries.length > 0
+	if (hasResponseSection) {
+		parts.push('## Responses')
+		parts.push('')
+		for (const r of resps) {
+			parts.push(renderResponse(r))
+		}
+		for (const entry of fbEntries) {
+			parts.push(entry.markdown.trim())
+			parts.push('')
+		}
+	}
+
+	// Response annotations (on agent response banner)
+	if (responseAnns.length > 0) {
+		parts.push('## Annotations on agent response')
+		parts.push('')
+		for (const ann of responseAnns) {
+			parts.push(renderAnnotation(ann))
+		}
+	}
+
+	// Canvas annotations grouped by canvas file, then hierarchy
+	if (canvasAnns.length > 0) {
+		parts.push('## Canvas annotations')
+		parts.push('')
+
+		// Group by canvasFile
+		const byCanvas = new Map<string, Annotation[]>()
+		for (const ann of canvasAnns) {
+			const key = ann.canvasFile || ''
+			if (!byCanvas.has(key)) byCanvas.set(key, [])
+			byCanvas.get(key)!.push(ann)
+		}
+
+		const canvasKeys = [...byCanvas.keys()].sort()
+		const multipleCanvases = canvasKeys.length > 1 || (canvasKeys.length === 1 && canvasKeys[0] !== '')
+
+		for (const canvasKey of canvasKeys) {
+			const anns = byCanvas.get(canvasKey)!
+			if (multipleCanvases && canvasKey) {
+				parts.push(`### ${canvasKey.replace(/\.jsx$/, '')}`)
+				parts.push('')
+			}
+			const grouped = groupByHierarchy(anns)
+			parts.push(renderHierarchyGroup(grouped))
+		}
+	}
+
+	// File annotations grouped by path
+	if (fileAnns.length > 0) {
+		const groups: Record<string, Annotation[]> = {}
+		for (const ann of fileAnns) {
+			const key = ann.filePath!
+			if (!groups[key]) groups[key] = []
+			groups[key].push(ann)
+		}
+		parts.push('## File annotations')
+		parts.push('')
+		for (const [filePath, anns] of Object.entries(groups)) {
+			parts.push(`### ${filePath}`)
+			parts.push('')
+			for (const ann of anns) {
+				parts.push(renderAnnotation(ann))
+			}
+		}
+	}
+
+	// General notes
+	if (generalNote.trim()) {
+		parts.push('## General notes')
+		parts.push('')
+		parts.push(generalNote.trim())
+		parts.push('')
+	}
+
+	return parts.join('\n').trim() + '\n'
 }
 
 export function hasValue(r: PlanResponse): boolean {
-  if (r.note?.trim()) return true;
-  if (r.value === null || r.value === undefined) return false;
-  if (r.type === "text" && !(r.value as string).trim()) return false;
-  if (r.type === "checkbox" && (r.value as string[]).length === 0) return false;
-  return true;
+	if (r.note?.trim()) return true
+	if (r.value === null || r.value === undefined) return false
+	if (r.type === 'text' && !(r.value as string).trim()) return false
+	if (r.type === 'checkbox' && (r.value as string[]).length === 0) return false
+	return true
 }
 
 export function getMissingRequired(responses: Map<string, PlanResponse>): PlanResponse[] {
-  const missing: PlanResponse[] = [];
-  for (const r of responses.values()) {
-    if (!r.required) continue;
-    if (r.value === null || r.value === undefined) { missing.push(r); continue; }
-    if (r.type === "text" && !(r.value as string).trim()) { missing.push(r); continue; }
-    if (r.type === "checkbox" && (r.value as string[]).length === 0) { missing.push(r); continue; }
-  }
-  return missing;
+	const missing: PlanResponse[] = []
+	for (const r of responses.values()) {
+		if (!r.required) continue
+		if (r.value === null || r.value === undefined) {
+			missing.push(r)
+			continue
+		}
+		if (r.type === 'text' && !(r.value as string).trim()) {
+			missing.push(r)
+			continue
+		}
+		if (r.type === 'checkbox' && (r.value as string[]).length === 0) {
+			missing.push(r)
+			continue
+		}
+	}
+	return missing
 }
 
 export function getMissingRequiredFeedback(entries: Map<string, FeedbackEntry>): FeedbackEntry[] {
-  const missing: FeedbackEntry[] = [];
-  for (const entry of entries.values()) {
-    if (entry.required && !entry.markdown.trim()) {
-      missing.push(entry);
-    }
-  }
-  return missing;
+	const missing: FeedbackEntry[] = []
+	for (const entry of entries.values()) {
+		if (entry.required && !entry.markdown.trim()) {
+			missing.push(entry)
+		}
+	}
+	return missing
 }
 
 /** Returns list of missing required field labels, or empty if all valid */
 export function getMissingRequiredLabels(responses: Map<string, PlanResponse>, feedbackEntries: Map<string, FeedbackEntry>): string[] {
-  const missingResponses = getMissingRequired(responses);
-  const missingFeedback = getMissingRequiredFeedback(feedbackEntries);
-  return [
-    ...missingResponses.map((r) => r.label),
-    ...missingFeedback.map((e) => e.label || e.id),
-  ];
+	const missingResponses = getMissingRequired(responses)
+	const missingFeedback = getMissingRequiredFeedback(feedbackEntries)
+	return [
+		...missingResponses.map((r) => r.label),
+		...missingFeedback.map((e) => e.label || e.id),
+	]
 }
 
 function renderResponse(r: PlanResponse): string {
-  const lines: string[] = [];
-  lines.push(`**${r.label}**`);
-
-  switch (r.type) {
-    case "radio":
-    case "select":
-      lines.push(`Answer: ${r.value}`);
-      break;
-    case "checkbox":
-      for (const v of r.value as string[]) {
-        lines.push(`- [x] ${v}`);
-      }
-      break;
-    case "text":
-      lines.push("");
-      lines.push((r.value as string).trim());
-      break;
-    case "range":
-      lines.push(`Answer: ${r.value}`);
-      break;
-  }
-
-  if (r.note?.trim()) {
-    lines.push("");
-    lines.push(`Note: ${r.note.trim()}`);
-  }
-
-  lines.push("");
-  return lines.join("\n");
+	const lines: string[] = []
+	lines.push(`**${r.label}**`)
+
+	switch (r.type) {
+		case 'radio':
+		case 'select':
+			lines.push(`Answer: ${r.value}`)
+			break
+		case 'checkbox':
+			for (const v of r.value as string[]) {
+				lines.push(`- [x] ${v}`)
+			}
+			break
+		case 'text':
+			lines.push('')
+			lines.push((r.value as string).trim())
+			break
+		case 'range':
+			lines.push(`Answer: ${r.value}`)
+			break
+	}
+
+	if (r.note?.trim()) {
+		lines.push('')
+		lines.push(`Note: ${r.note.trim()}`)
+	}
+
+	lines.push('')
+	return lines.join('\n')
 }
 
 interface HierarchyNode {
-  label: string;
-  annotations: Annotation[];
-  children: Map<string, HierarchyNode>;
+	label: string
+	annotations: Annotation[]
+	children: Map<string, HierarchyNode>
 }
 
 function groupByHierarchy(annotations: Annotation[]): HierarchyNode {
-  const root: HierarchyNode = { label: "", annotations: [], children: new Map() };
-  for (const ann of annotations) {
-    const path = ann.context?.hierarchy || [];
-    let current = root;
-    for (const segment of path) {
-      if (!current.children.has(segment)) {
-        current.children.set(segment, { label: segment, annotations: [], children: new Map() });
-      }
-      current = current.children.get(segment)!;
-    }
-    current.annotations.push(ann);
-  }
-  return root;
+	const root: HierarchyNode = { label: '', annotations: [], children: new Map() }
+	for (const ann of annotations) {
+		const path = ann.context?.hierarchy || []
+		let current = root
+		for (const segment of path) {
+			if (!current.children.has(segment)) {
+				current.children.set(segment, { label: segment, annotations: [], children: new Map() })
+			}
+			current = current.children.get(segment)!
+		}
+		current.annotations.push(ann)
+	}
+	return root
 }
 
 function renderHierarchyGroup(node: HierarchyNode, depth: number = 0): string {
-  const parts: string[] = [];
-  for (const ann of node.annotations) {
-    parts.push(renderAnnotation(ann));
-  }
-  for (const [, child] of node.children) {
-    const prefix = depth === 0 ? "###" : "####";
-    parts.push(`${prefix} ${child.label}`);
-    parts.push("");
-    parts.push(renderHierarchyGroup(child, depth + 1));
-  }
-  return parts.join("\n");
+	const parts: string[] = []
+	for (const ann of node.annotations) {
+		parts.push(renderAnnotation(ann))
+	}
+	for (const [, child] of node.children) {
+		const prefix = depth === 0 ? '###' : '####'
+		parts.push(`${prefix} ${child.label}`)
+		parts.push('')
+		parts.push(renderHierarchyGroup(child, depth + 1))
+	}
+	return parts.join('\n')
 }

package/src/client/hostContext.tsx

@@ -1,4 +1,4 @@
-import { createContext, useContext } from "react";
+import { createContext, useContext } from 'react'
 
 /**
  * What the annotation surface needs from the host serving it.
@@ -9,47 +9,47 @@ import { createContext, useContext } from "react";
  * provide their own.
  */
 export interface CanvasHost {
-  /** Session the canvas belongs to. */
-  sessionId: string;
-  /** Read-only share view — local-only affordances stay hidden. */
-  isShared: boolean;
-  /** Host can read project files (feedback bodies, file browser). */
-  fsAvailable: boolean;
-  /** Endpoint accepting annotation image uploads, or `null` for a host that
-   *  has none — the attach affordances then stay hidden rather than posting
-   *  into the void. Required, not optional, so no host can be silent about it. */
-  uploadUrl: (() => string) | null;
-  /** Fetch and `import()` a compiled canvas module. */
-  loadCanvasModule: (filename: string, revision?: number) => Promise<any>;
+	/** Session the canvas belongs to. */
+	sessionId: string
+	/** Read-only share view — local-only affordances stay hidden. */
+	isShared: boolean
+	/** Host can read project files (feedback bodies, file browser). */
+	fsAvailable: boolean
+	/** Endpoint accepting annotation image uploads, or `null` for a host that
+	 *  has none — the attach affordances then stay hidden rather than posting
+	 *  into the void. Required, not optional, so no host can be silent about it. */
+	uploadUrl: (() => string) | null
+	/** Fetch and `import()` a compiled canvas module. */
+	loadCanvasModule: (filename: string, revision?: number) => Promise<any>
 }
 
 /** Local mode carries the session id as the `/s/:id` path suffix. */
 function localSessionId(): string {
-  if (typeof window === "undefined") return "";
-  return window.location.pathname.replace("/s/", "");
+	if (typeof window === 'undefined') return ''
+	return window.location.pathname.replace('/s/', '')
 }
 
 export const localCanvasHost: CanvasHost = {
-  get sessionId() {
-    return localSessionId();
-  },
-  isShared: false,
-  fsAvailable: true,
-  // No endpoint by default. The only hosts that reach this fallback are the
-  // ones that configured nothing, which are exactly the ones least likely to
-  // serve an upload route — claiming one on their behalf is how every host got
-  // a paperclip that posts into the void. A host with uploads names its own.
-  uploadUrl: null,
-  loadCanvasModule: (filename, revision) => {
-    const jsName = filename.replace(/\.jsx$/, ".js");
-    const query = revision ? `?rev=${revision}&t=${Date.now()}` : `?t=${Date.now()}`;
-    const url = `/api/session/${localSessionId()}/canvas/${encodeURIComponent(jsName)}${query}`;
-    return import(/* @vite-ignore */ url);
-  },
-};
+	get sessionId() {
+		return localSessionId()
+	},
+	isShared: false,
+	fsAvailable: true,
+	// No endpoint by default. The only hosts that reach this fallback are the
+	// ones that configured nothing, which are exactly the ones least likely to
+	// serve an upload route — claiming one on their behalf is how every host got
+	// a paperclip that posts into the void. A host with uploads names its own.
+	uploadUrl: null,
+	loadCanvasModule: (filename, revision) => {
+		const jsName = filename.replace(/\.jsx$/, '.js')
+		const query = revision ? `?rev=${revision}&t=${Date.now()}` : `?t=${Date.now()}`
+		const url = `/api/session/${localSessionId()}/canvas/${encodeURIComponent(jsName)}${query}`
+		return import(/* @vite-ignore */ url)
+	},
+}
 
-export const CanvasHostContext = createContext<CanvasHost>(localCanvasHost);
+export const CanvasHostContext = createContext<CanvasHost>(localCanvasHost)
 
 export function useCanvasHost(): CanvasHost {
-  return useContext(CanvasHostContext);
+	return useContext(CanvasHostContext)
 }