@neta-art/cohub 5.6.0 → 5.8.0

package/dist/board/nodes.js

@@ -0,0 +1,154 @@
+import "../protocol/dist/board-constants.js";
+import { validateBoardNodeInput } from "../protocol/dist/board-node.js";
+import "../protocol/dist/index.js";
+import { computeDrawBounds } from "./core/draw-geometry.js";
+//#region src/board/nodes.ts
+var BoardInputError = class extends Error {
+	code = "INVALID_BOARD_NODE";
+	diagnostics;
+	body;
+	constructor(diagnostics) {
+		const message = diagnostics[0]?.message ?? "Invalid Board node";
+		super(message);
+		this.name = "BoardInputError";
+		this.diagnostics = diagnostics;
+		this.body = {
+			code: this.code,
+			message,
+			diagnostics
+		};
+	}
+};
+function baseNode(spec, frame) {
+	return {
+		nodeId: spec.id,
+		type: spec.type,
+		parentId: spec.parentId ?? null,
+		orderKey: spec.orderKey ?? null,
+		x: frame.x,
+		y: frame.y,
+		width: frame.width,
+		height: frame.height,
+		rotation: frame.rotation ?? 0,
+		refKind: null,
+		refPath: null,
+		refUrl: null,
+		view: {},
+		style: spec.style ?? {},
+		data: {}
+	};
+}
+function arrowFrame(start, end) {
+	const padding = 16;
+	return {
+		x: Math.min(start.x, end.x) - padding,
+		y: Math.min(start.y, end.y) - padding,
+		width: Math.max(1, Math.abs(end.x - start.x) + padding * 2),
+		height: Math.max(1, Math.abs(end.y - start.y) + padding * 2)
+	};
+}
+/**
+* Create one validated wire node from semantic Board input.
+*
+* Box nodes take an explicit world-space frame. Draw samples and arrow endpoints
+* take world coordinates; the builder derives their frame and local storage form.
+*/
+function createBoardNode(spec) {
+	let node;
+	if (spec.type === "draw") {
+		const size = spec.size ?? 4;
+		const worldPoints = spec.points.map((point) => ({
+			x: point.x,
+			y: point.y,
+			p: point.p ?? .5
+		}));
+		const bounds = computeDrawBounds(worldPoints, size);
+		node = baseNode(spec, bounds);
+		node.data = {
+			points: worldPoints.map((point) => ({
+				x: point.x - bounds.x,
+				y: point.y - bounds.y,
+				p: point.p
+			})),
+			color: spec.color ?? "brand",
+			size
+		};
+	} else if (spec.type === "arrow") {
+		node = baseNode(spec, arrowFrame(spec.start, spec.end));
+		node.data = {
+			start: spec.start,
+			end: spec.end,
+			bend: spec.bend ?? 0,
+			color: spec.color ?? "brand",
+			size: spec.size ?? 2.5,
+			arrowStart: spec.arrowStart ?? false,
+			arrowEnd: spec.arrowEnd ?? true,
+			label: spec.label ?? ""
+		};
+	} else {
+		node = baseNode(spec, spec.frame);
+		switch (spec.type) {
+			case "text":
+				node.data = {
+					text: spec.text ?? "",
+					color: spec.color ?? "neutral",
+					fontSize: spec.fontSize ?? 24
+				};
+				break;
+			case "geo":
+				node.data = {
+					geo: spec.geo ?? "rectangle",
+					text: spec.text ?? "",
+					color: spec.color ?? "brand",
+					fillOpacity: spec.fillOpacity ?? 0
+				};
+				break;
+			case "frame":
+				node.data = {
+					label: spec.label ?? "Frame",
+					color: spec.color ?? "neutral"
+				};
+				break;
+			case "image":
+				node.refKind = "space_file";
+				node.refPath = spec.path;
+				node.view = spec.snapshot ?? {};
+				node.data = spec.crop ? { crop: spec.crop } : {};
+				break;
+			case "video":
+			case "audio":
+				node.refKind = "space_file";
+				node.refPath = spec.path;
+				node.view = spec.snapshot ?? {};
+				break;
+			case "file":
+				node.refKind = "space_file";
+				node.refPath = spec.path;
+				node.view = spec.snapshot ?? {};
+				break;
+			case "task":
+				node.view = spec.snapshot;
+				node.data = { taskRunId: spec.taskRunId };
+				break;
+		}
+	}
+	assertBoardNodes([node]);
+	return node;
+}
+function validateBoardNodes(nodes, path = "nodes") {
+	return nodes.flatMap((node, index) => validateBoardNodeInput(node, `${path}.${index}`));
+}
+function assertBoardNodes(nodes, path = "nodes") {
+	const diagnostics = validateBoardNodes(nodes, path);
+	if (diagnostics.length > 0) throw new BoardInputError(diagnostics);
+}
+function assertBoardTransactionNodeCreates(operations) {
+	const diagnostics = operations.flatMap((operation, index) => {
+		if (operation.type !== "node.create") return [];
+		const payload = operation.payload;
+		return payload.node ? validateBoardNodeInput(payload.node, `operations.${index}.payload.node`) : [];
+	});
+	if (diagnostics.length > 0) throw new BoardInputError(diagnostics);
+}
+//#endregion
+export { BoardInputError, assertBoardNodes, assertBoardTransactionNodeCreates, createBoardNode, validateBoardNodes };

package/dist/board/render/audio-waveform.d.ts

@@ -0,0 +1,12 @@
+import { Graphics } from "pixi.js";
+//#region src/board/render/audio-waveform.d.ts
+/** Stable placeholder amplitudes without reading or decoding the audio file. */
+declare function audioWaveformBars(seed: string, count: number): number[];
+declare function drawAudioWaveform(graphics: Graphics, seed: string, rect: {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+}, color: number, alpha?: number): void;
+//#endregion
+export { audioWaveformBars, drawAudioWaveform };

package/dist/board/render/audio-waveform.js

@@ -0,0 +1,36 @@
+//#region src/board/render/audio-waveform.ts
+const DEFAULT_BARS = 44;
+const BAR_GAP = 2;
+/** Stable placeholder amplitudes without reading or decoding the audio file. */
+function audioWaveformBars(seed, count) {
+	let hash = 2166136261;
+	for (let index = 0; index < seed.length; index += 1) {
+		hash ^= seed.charCodeAt(index);
+		hash = Math.imul(hash, 16777619);
+	}
+	const bars = [];
+	for (let index = 0; index < count; index += 1) {
+		hash ^= hash << 13;
+		hash ^= hash >>> 17;
+		hash ^= hash << 5;
+		bars.push(.2 + (hash >>> 0) / 4294967295 * .8);
+	}
+	return bars;
+}
+function drawAudioWaveform(graphics, seed, rect, color, alpha = .72) {
+	const count = Math.max(8, Math.min(DEFAULT_BARS, Math.floor(rect.width / 4)));
+	const step = rect.width / count;
+	const barWidth = Math.max(1.5, step - BAR_GAP);
+	const centerY = rect.y + rect.height / 2;
+	const maxHeight = Math.max(2, rect.height * .72);
+	const bars = audioWaveformBars(seed, count);
+	for (let index = 0; index < count; index += 1) {
+		const height = Math.max(2, (bars[index] ?? .4) * maxHeight);
+		graphics.roundRect(rect.x + index * step, centerY - height / 2, barWidth, height, barWidth / 2).fill({
+			color,
+			alpha
+		});
+	}
+}
+//#endregion
+export { audioWaveformBars, drawAudioWaveform };

package/dist/board/render/index.d.ts

@@ -1,7 +1,10 @@
 import { ConnectionLayer, ConnectionRenderInput, createConnectionLayer, framesFromItems } from "./connection-layer.js";
+import { BoardMediaAction, boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible } from "./media-interaction.js";
 import { BoardCardRenderer, BoardRenderContext, BoardRenderPalette, boardCardRenderersForTest, getBoardCardRenderer, registerBoardCardRenderer } from "./renderers/board-renderer-registry.js";
 import { defaultBoardPalette } from "./palette.js";
+import { TASK_CARD_FULL_DETAIL_ZOOM } from "./renderers/task-card-renderer.js";
 import { ensureBoardTextMeasurement, installBoardTextMeasurement } from "./text-measurement.js";
 import { getBoardResolution, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket } from "./text-resolution.js";
 import { BoardThemeContext, BoardThemeRenderer, getBoardThemeRenderer, registerBoardThemeRenderer } from "./themes/board-theme-registry.js";
-export { BoardCardRenderer, BoardRenderContext, BoardRenderPalette, BoardThemeContext, BoardThemeRenderer, ConnectionLayer, ConnectionRenderInput, boardCardRenderersForTest, createConnectionLayer, defaultBoardPalette, ensureBoardTextMeasurement, framesFromItems, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket };
+import { VIDEO_THUMBNAIL_MAX_EDGE, VideoNaturalSize, loadVideoThumbnailTexture, videoTextureNaturalSize, videoThumbnailSize } from "./video-thumbnail.js";
+export { BoardCardRenderer, BoardMediaAction, BoardRenderContext, BoardRenderPalette, BoardThemeContext, BoardThemeRenderer, ConnectionLayer, ConnectionRenderInput, TASK_CARD_FULL_DETAIL_ZOOM, VIDEO_THUMBNAIL_MAX_EDGE, VideoNaturalSize, boardCardRenderersForTest, boardMediaActionAt, createConnectionLayer, defaultBoardPalette, ensureBoardTextMeasurement, framesFromItems, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, loadVideoThumbnailTexture, mediaPlayBadgeHit, mediaPlayBadgeVisible, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket, videoTextureNaturalSize, videoThumbnailSize };

package/dist/board/render/index.js

@@ -1,7 +1,10 @@
 import { getBoardResolution, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket } from "./text-resolution.js";
 import { createConnectionLayer, framesFromItems } from "./connection-layer.js";
+import { TASK_CARD_FULL_DETAIL_ZOOM } from "./renderers/task-card-renderer.js";
+import { boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible } from "./media-interaction.js";
 import { defaultBoardPalette } from "./palette.js";
 import { ensureBoardTextMeasurement, installBoardTextMeasurement } from "./text-measurement.js";
 import { boardCardRenderersForTest, getBoardCardRenderer, registerBoardCardRenderer } from "./renderers/board-renderer-registry.js";
 import { getBoardThemeRenderer, registerBoardThemeRenderer } from "./themes/board-theme-registry.js";
-export { boardCardRenderersForTest, createConnectionLayer, defaultBoardPalette, ensureBoardTextMeasurement, framesFromItems, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket };
+import { VIDEO_THUMBNAIL_MAX_EDGE, loadVideoThumbnailTexture, videoTextureNaturalSize, videoThumbnailSize } from "./video-thumbnail.js";
+export { TASK_CARD_FULL_DETAIL_ZOOM, VIDEO_THUMBNAIL_MAX_EDGE, boardCardRenderersForTest, boardMediaActionAt, createConnectionLayer, defaultBoardPalette, ensureBoardTextMeasurement, framesFromItems, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, loadVideoThumbnailTexture, mediaPlayBadgeHit, mediaPlayBadgeVisible, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket, videoTextureNaturalSize, videoThumbnailSize };

package/dist/board/render/media-interaction.d.ts

@@ -0,0 +1,19 @@
+import { BoardItem } from "../../protocol/dist/board-document.js";
+import { WorldPoint } from "../geometry.js";
+//#region src/board/render/media-interaction.d.ts
+type BoardMediaAction = {
+  action: "play-media";
+  itemId: string;
+};
+declare function mediaPlayBadgeVisible(item: BoardItem, zoom: number, options: {
+  materialized: boolean;
+  hasVideoPreview: boolean;
+}): boolean;
+/** The central badge is a fixed screen-space target, independent of Board zoom. */
+declare function mediaPlayBadgeHit(item: BoardItem, point: WorldPoint, zoom: number): boolean;
+declare function boardMediaActionAt(item: BoardItem, point: WorldPoint, zoom: number, options: {
+  materialized: boolean;
+  hasVideoPreview: boolean;
+}): BoardMediaAction | null;
+//#endregion
+export { BoardMediaAction, boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible };

package/dist/board/render/media-interaction.js

@@ -0,0 +1,26 @@
+import { featuredTaskArtifact } from "../task.js";
+import "./renderers/task-card-renderer.js";
+//#region src/board/render/media-interaction.ts
+function mediaPlayBadgeVisible(item, zoom, options) {
+	if (!options.materialized) return false;
+	if (item.type === "video" || item.type === "audio") return true;
+	if (item.type !== "task" || zoom < .55) return false;
+	const artifact = featuredTaskArtifact(item.snapshot.artifacts);
+	if (artifact?.type === "audio") return true;
+	return artifact?.type === "video" && (Boolean(artifact.previewUrl) || options.hasVideoPreview);
+}
+/** The central badge is a fixed screen-space target, independent of Board zoom. */
+function mediaPlayBadgeHit(item, point, zoom) {
+	const radius = 28 / Math.max(zoom, .05);
+	const centerX = item.frame.x + item.frame.width / 2;
+	const centerY = item.frame.y + item.frame.height / 2;
+	return Math.hypot(point.x - centerX, point.y - centerY) <= radius;
+}
+function boardMediaActionAt(item, point, zoom, options) {
+	return mediaPlayBadgeVisible(item, zoom, options) && mediaPlayBadgeHit(item, point, zoom) ? {
+		action: "play-media",
+		itemId: item.id
+	} : null;
+}
+//#endregion
+export { boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible };

package/dist/board/render/renderers/audio-card-renderer.d.ts

@@ -0,0 +1,5 @@
+import { BoardCardRenderer } from "./board-renderer-registry.js";
+//#region src/board/render/renderers/audio-card-renderer.d.ts
+declare const audioCardRenderer: BoardCardRenderer;
+//#endregion
+export { audioCardRenderer };

package/dist/board/render/renderers/audio-card-renderer.js

@@ -0,0 +1,120 @@
+import { BOARD_FONT_STACK } from "../../../protocol/dist/board-constants.js";
+import { syncTextResolution, syncTextWrapWidth, textResolutionForZoom } from "../text-resolution.js";
+import { drawAudioWaveform } from "../audio-waveform.js";
+import { positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
+import { Container, Graphics, Text } from "pixi.js";
+//#region src/board/render/renderers/audio-card-renderer.ts
+const RADIUS = 4;
+const PLAY_RADIUS = 18;
+const partsByContainer = /* @__PURE__ */ new WeakMap();
+function sync(container, item, context) {
+	const parts = partsByContainer.get(container);
+	if (!parts) return;
+	positionShell(parts.root, item);
+	const { width, height } = item.frame;
+	const selected = context.selectedIds.has(item.id);
+	const hovered = context.hoveredId === item.id;
+	const title = item.snapshot?.title ?? item.ref.path.split("/").pop() ?? "Audio";
+	syncTextResolution(parts.label, parts, context.zoom);
+	if (parts.label.text !== title) parts.label.text = title;
+	syncTextWrapWidth(parts.label, parts, Math.max(1, width - 24), false);
+	parts.label.position.set(12, Math.max(8, height - parts.label.height - 8));
+	const sig = [
+		width,
+		height,
+		selected,
+		hovered,
+		title,
+		parts.label.height,
+		context.palette.surface,
+		context.palette.brand,
+		context.palette.border,
+		context.palette.muted,
+		context.palette.text
+	].join("|");
+	if (sig === parts.sig) return;
+	parts.sig = sig;
+	parts.plate.clear().roundRect(0, 0, width, height, RADIUS).fill({
+		color: context.palette.surface,
+		alpha: .98
+	}).roundRect(0, 0, width, height, RADIUS).stroke({
+		color: selected ? context.palette.brand : hovered ? context.palette.muted : context.palette.border,
+		width: selected ? 2 : 1,
+		alpha: selected ? .96 : .84
+	});
+	const labelBand = Math.min(height * .38, parts.label.height + 16);
+	const waveformInset = Math.min(24, width * .08);
+	parts.waveform.clear();
+	drawAudioWaveform(parts.waveform, `${item.ref.path}:${item.snapshot?.mtimeMs ?? "unknown"}`, {
+		x: waveformInset,
+		y: 10,
+		width: Math.max(1, width - waveformInset * 2),
+		height: Math.max(8, height - labelBand - 16)
+	}, context.palette.brand);
+	const cx = width / 2;
+	const cy = Math.max(24, (height - labelBand) / 2);
+	parts.chrome.clear().circle(cx, cy, PLAY_RADIUS).fill({
+		color: selected ? context.palette.brand : context.palette.surface,
+		alpha: .92
+	});
+	const triangle = PLAY_RADIUS * .58;
+	parts.chrome.moveTo(cx - triangle * .35, cy - triangle * .62).lineTo(cx - triangle * .35, cy + triangle * .62).lineTo(cx + triangle * .72, cy).closePath().fill({
+		color: context.palette.text,
+		alpha: .96
+	});
+	parts.label.style.fill = context.palette.text;
+}
+const audioCardRenderer = {
+	id: "audio-card",
+	canRender: (item) => item.type === "audio",
+	create: (item, context) => {
+		const root = new Container();
+		const plate = new Graphics();
+		const waveform = new Graphics();
+		const chrome = new Graphics();
+		const resolution = textResolutionForZoom(context.zoom);
+		const label = new Text({
+			text: "",
+			style: {
+				fill: context.palette.text,
+				fontFamily: BOARD_FONT_STACK,
+				fontSize: 12,
+				fontWeight: "500",
+				wordWrap: true
+			},
+			resolution,
+			roundPixels: true
+		});
+		root.addChild(plate, waveform, chrome, label);
+		partsByContainer.set(root, {
+			root,
+			plate,
+			waveform,
+			chrome,
+			label,
+			sig: "",
+			wrapWidth: 0,
+			resolution
+		});
+		if (item.type === "audio") sync(root, item, context);
+		return root;
+	},
+	update: (container, item, context) => {
+		if (item.type === "audio") sync(container, item, context);
+	},
+	renderFar: (graphics, item, context) => {
+		drawFarPlate(graphics, item.frame, {
+			fill: context.palette.surface,
+			fillAlpha: .96,
+			accent: context.palette.brand,
+			accentAlpha: .72
+		});
+	},
+	destroy: (container) => {
+		partsByContainer.get(container)?.root.destroy({ children: true });
+		partsByContainer.delete(container);
+	}
+};
+//#endregion
+export { audioCardRenderer };

package/dist/board/render/renderers/board-renderer-registry.js

@@ -1,11 +1,12 @@
+import { fileCardRenderer } from "./file-card-renderer.js";
+import { taskCardRenderer } from "./task-card-renderer.js";
 import { ensureBoardTextMeasurement } from "../text-measurement.js";
 import { arrowCardRenderer } from "./arrow-card-renderer.js";
+import { audioCardRenderer } from "./audio-card-renderer.js";
 import { drawCardRenderer } from "./draw-card-renderer.js";
-import { fileCardRenderer } from "./file-card-renderer.js";
 import { frameCardRenderer } from "./frame-card-renderer.js";
 import { geoCardRenderer } from "./geo-card-renderer.js";
 import { imageCardRenderer } from "./image-card-renderer.js";
-import { taskCardRenderer } from "./task-card-renderer.js";
 import { textCardRenderer } from "./text-card-renderer.js";
 import { unknownCardRenderer } from "./unknown-card-renderer.js";
 import { videoCardRenderer } from "./video-card-renderer.js";
@@ -14,6 +15,7 @@ const boardCardRenderers = [
 	textCardRenderer,
 	imageCardRenderer,
 	videoCardRenderer,
+	audioCardRenderer,
 	fileCardRenderer,
 	taskCardRenderer,
 	geoCardRenderer,

package/dist/board/render/renderers/draw-card-renderer.js

@@ -1,7 +1,7 @@
 import { buildStrokeOutline, computeDrawBounds } from "../../core/draw-geometry.js";
 import { pickBoardColor } from "../../core/palette.js";
-import { drawFarStroke } from "./far-plate.js";
 import { positionShell } from "./base-card-renderer.js";
+import { drawFarStroke } from "./far-plate.js";
 import { Container, Graphics } from "pixi.js";
 //#region src/board/render/renderers/draw-card-renderer.ts
 const partsByContainer = /* @__PURE__ */ new WeakMap();

package/dist/board/render/renderers/file-card-renderer.js

@@ -1,8 +1,8 @@
 import { BOARD_FONT_STACK } from "../../../protocol/dist/board-constants.js";
 import { fileBaseName, filePreviewKind } from "../../core/file-preview.js";
 import { syncTextResolution } from "../text-resolution.js";
-import { drawFarPlate } from "./far-plate.js";
 import { positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
 import { CanvasTextMetrics, Container, Graphics, Sprite, Text, Texture } from "pixi.js";
 //#region src/board/render/renderers/file-card-renderer.ts
 /**

package/dist/board/render/renderers/frame-card-renderer.js

@@ -1,8 +1,8 @@
 import { BOARD_FONT_STACK } from "../../../protocol/dist/board-constants.js";
 import { pickBoardColor } from "../../core/palette.js";
 import { syncTextResolution } from "../text-resolution.js";
-import { drawFarPlate } from "./far-plate.js";
 import { createLabel, positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
 import { Container, Graphics } from "pixi.js";
 //#region src/board/render/renderers/frame-card-renderer.ts
 const partsByContainer = /* @__PURE__ */ new WeakMap();

package/dist/board/render/renderers/geo-card-renderer.js

@@ -1,8 +1,8 @@
 import { BOARD_FONT_STACK } from "../../../protocol/dist/board-constants.js";
 import { pickBoardColor } from "../../core/palette.js";
 import { syncTextResolution, syncTextWrapWidth, textResolutionForZoom } from "../text-resolution.js";
-import { drawFarPlate } from "./far-plate.js";
 import { positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
 import { Container, Graphics, Text } from "pixi.js";
 //#region src/board/render/renderers/geo-card-renderer.ts
 const RADIUS = 8;

package/dist/board/render/renderers/image-card-renderer.js

@@ -1,5 +1,5 @@
-import { drawFarPlate } from "./far-plate.js";
 import { positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
 import { Container, Graphics, Sprite, Texture } from "pixi.js";
 //#region src/board/render/renderers/image-card-renderer.ts
 const partsByContainer = /* @__PURE__ */ new WeakMap();

package/dist/board/render/renderers/task-card-renderer.d.ts

@@ -1,5 +1,6 @@
 import { BoardCardRenderer } from "./board-renderer-registry.js";
 //#region src/board/render/renderers/task-card-renderer.d.ts
+declare const TASK_CARD_FULL_DETAIL_ZOOM = 0.55;
 /** Scale a texture into a frame without cropping or distortion. */
 declare function containTaskPreviewRect(width: number, height: number, imageWidth: number, imageHeight: number): {
   x: number;
@@ -9,4 +10,4 @@ declare function containTaskPreviewRect(width: number, height: number, imageWidt
 };
 declare const taskCardRenderer: BoardCardRenderer;
 //#endregion
-export { containTaskPreviewRect, taskCardRenderer };
+export { TASK_CARD_FULL_DETAIL_ZOOM, containTaskPreviewRect, taskCardRenderer };

package/dist/board/render/renderers/task-card-renderer.js

@@ -1,24 +1,23 @@
 import { BOARD_FONT_STACK, BOARD_MONO_FONT_STACK } from "../../../protocol/dist/board-constants.js";
+import { featuredTaskArtifact } from "../../task.js";
 import { syncTextResolution, textResolutionForZoom } from "../text-resolution.js";
-import { drawFarPlate } from "./far-plate.js";
+import { drawAudioWaveform } from "../audio-waveform.js";
 import { positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
 import { fitTextToLines } from "./file-card-renderer.js";
 import { Container, Graphics, Sprite, Text } from "pixi.js";
 //#region src/board/render/renderers/task-card-renderer.ts
 const RADIUS = 4;
 const PADDING = 12;
 const META_HEIGHT = 28;
-const FULL_DETAIL_ZOOM = .55;
-const WAVEFORM_BARS = 44;
-const WAVEFORM_GAP = 2;
+const TASK_CARD_FULL_DETAIL_ZOOM = .55;
 const PLAY_BADGE_RADIUS = 15;
 const partsByContainer = /* @__PURE__ */ new WeakMap();
-function previewKindFor(item) {
-	const output = item.snapshot.primaryOutput;
-	if (!output) return "empty";
-	if (output.type === "image" || output.type === "video") return "texture";
-	if (output.type === "audio") return "waveform";
-	return output.textExcerpt ? "text" : "empty";
+function previewKindFor(artifact) {
+	if (!artifact) return "empty";
+	if (artifact.type === "image" || artifact.type === "video") return "texture";
+	if (artifact.type === "audio") return artifact.previewUrl ? "texture" : "waveform";
+	return artifact.textExcerpt ? "text" : "empty";
 }
 function stateSurfaceFor(item, kind, hasTexture, previewFailed) {
 	if (kind === "texture" && !hasTexture) {
@@ -47,7 +46,8 @@ function statusColor(item, context) {
 	return context.colors.neutral.stroke;
 }
 function metadata(item) {
-	const extra = item.snapshot.outputCount > 1 ? `+${item.snapshot.outputCount - 1}` : null;
+	const { artifactCount, artifacts } = item.snapshot;
+	const extra = artifactCount > artifacts.length ? `${artifacts.length}/${artifactCount}` : artifactCount > 1 ? `+${artifactCount - 1}` : null;
 	return [item.snapshot.model, extra].filter(Boolean).join(" · ");
 }
 /** Scale a texture into a frame without cropping or distortion. */
@@ -68,40 +68,6 @@ function containTaskPreviewRect(width, height, imageWidth, imageHeight) {
 		height: renderedHeight
 	};
 }
-function waveformBars(seed, count) {
-	let hash = 2166136261;
-	for (let index = 0; index < seed.length; index += 1) {
-		hash ^= seed.charCodeAt(index);
-		hash = Math.imul(hash, 16777619) >>> 0;
-	}
-	const bars = [];
-	for (let index = 0; index < count; index += 1) {
-		hash ^= hash << 13;
-		hash ^= hash >>> 17;
-		hash ^= hash << 5;
-		hash >>>= 0;
-		const unit = hash % 1e3 / 1e3;
-		const envelope = Math.sin(Math.PI * (index + .5) / count);
-		bars.push(.18 + unit * .82 * (.45 + envelope * .55));
-	}
-	return bars;
-}
-function drawWaveform(graphics, seed, rect, color) {
-	const count = Math.max(8, Math.min(WAVEFORM_BARS, Math.floor(rect.width / 4)));
-	const step = rect.width / count;
-	const barWidth = Math.max(1.5, step - WAVEFORM_GAP);
-	const centerY = rect.y + rect.height / 2;
-	const maxHeight = Math.max(2, rect.height * .68);
-	const bars = waveformBars(seed, count);
-	for (let index = 0; index < count; index += 1) {
-		const amplitude = (bars[index] ?? .4) * maxHeight;
-		graphics.roundRect(rect.x + index * step + (step - barWidth) / 2, centerY - amplitude / 2, barWidth, amplitude, barWidth / 2);
-	}
-	graphics.fill({
-		color,
-		alpha: .68
-	});
-}
 function drawPlayBadge(graphics, rect, context) {
 	const radius = Math.min(PLAY_BADGE_RADIUS, Math.max(8, Math.min(rect.width, rect.height) * .16));
 	const cx = rect.x + rect.width / 2;
@@ -194,7 +160,7 @@ function sync(container, item, context) {
 	const { width, height } = item.frame;
 	const selected = context.selectedIds.has(item.id);
 	const hovered = context.hoveredId === item.id;
-	const full = context.zoom >= FULL_DETAIL_ZOOM;
+	const full = context.zoom >= TASK_CARD_FULL_DETAIL_ZOOM;
 	const color = statusColor(item, context);
 	const key = context.assetKey(item);
 	if (key !== parts.assetKey) {
@@ -204,7 +170,8 @@ function sync(container, item, context) {
 	}
 	const texture = key ? context.getTexture(key) : null;
 	const previewFailed = Boolean(key && !texture && context.hasError(key));
-	const kind = previewKindFor(item);
+	const artifact = featuredTaskArtifact(item.snapshot.artifacts);
+	const kind = previewKindFor(artifact);
 	const surface = stateSurfaceFor(item, kind, Boolean(texture), previewFailed);
 	const frame = {
 		x: 1,
@@ -212,7 +179,7 @@ function sync(container, item, context) {
 		width: Math.max(1, width - 2),
 		height: Math.max(1, height - 2)
 	};
-	const metaText = item.snapshot.primaryOutput ? metadata(item) : "";
+	const metaText = artifact ? metadata(item) : "";
 	const showMeta = full && Boolean(metaText);
 	const failedWithOutput = item.snapshot.status === "failed" && kind !== "empty";
 	syncTextResolution(parts.body, parts, context.zoom);
@@ -228,7 +195,8 @@ function sync(container, item, context) {
 		surface,
 		showMeta,
 		failedWithOutput,
-		item.snapshot.primaryOutput?.type ?? "none",
+		artifact?.type ?? "none",
+		artifact?.id ?? "none",
 		item.taskRunId,
 		texture ? `${texture.width}x${texture.height}` : "none",
 		context.palette.surface,
@@ -255,14 +223,14 @@ function sync(container, item, context) {
 		parts.previewArt.clear();
 		if (kind === "waveform") {
 			const bottomInset = showMeta ? META_HEIGHT : 0;
-			drawWaveform(parts.previewArt, item.taskRunId, {
+			drawAudioWaveform(parts.previewArt, item.taskRunId, {
 				x: frame.x + PADDING,
 				y: frame.y + PADDING,
 				width: Math.max(1, frame.width - PADDING * 2),
 				height: Math.max(1, frame.height - PADDING * 2 - bottomInset)
 			}, context.colors.brand.stroke);
 		}
-		if (kind === "texture" && texture && item.snapshot.primaryOutput?.type === "video" && full) drawPlayBadge(parts.previewArt, frame, context);
+		if (full && (artifact?.type === "audio" || artifact?.type === "video" && texture)) drawPlayBadge(parts.previewArt, frame, context);
 		if (surface) {
 			const markY = frame.y + frame.height / 2 - (full && stateLabel(surface) ? 10 : 0);
 			drawStateMark(parts.previewArt, surface, frame.x + frame.width / 2, markY, surface === "failed" ? color : context.colors.neutral.stroke);
@@ -281,7 +249,7 @@ function sync(container, item, context) {
 		parts.preview.width = fitted.width;
 		parts.preview.height = fitted.height;
 	}
-	const bodyText = kind === "text" ? item.snapshot.primaryOutput?.textExcerpt ?? "" : stateLabel(surface);
+	const bodyText = kind === "text" && artifact?.type === "text" ? artifact.textExcerpt : stateLabel(surface);
 	const textSig = [
 		bodyText,
 		metaText,
@@ -386,4 +354,4 @@ const taskCardRenderer = {
 	}
 };
 //#endregion
-export { containTaskPreviewRect, taskCardRenderer };
+export { TASK_CARD_FULL_DETAIL_ZOOM, containTaskPreviewRect, taskCardRenderer };

package/dist/board/render/renderers/text-card-renderer.js

@@ -2,8 +2,8 @@ import { BOARD_FONT_STACK } from "../../../protocol/dist/board-constants.js";
 import { TEXT_FONT_SIZE, boardTextLineHeight, clampBoardTextFontSize, measureBoardText } from "../../core/text-metrics.js";
 import { pickBoardColor } from "../../core/palette.js";
 import { syncTextResolution, textResolutionForZoom } from "../text-resolution.js";
-import { drawFarPlate } from "./far-plate.js";
 import { positionShell } from "./base-card-renderer.js";
+import { drawFarPlate } from "./far-plate.js";
 import { Container, Text } from "pixi.js";
 //#region src/board/render/renderers/text-card-renderer.ts
 const partsByContainer = /* @__PURE__ */ new WeakMap();