@neta-art/cohub 11.0.0 → 11.2.0

package/dist/board/model/script-hit.js

@@ -2,11 +2,75 @@ import { applyMatrix, invertMatrix } from "../../protocol/dist/board-layout.js";
 import { frameContainsPoint } from "./geometry.js";
 import { scriptTemporaryPrefix } from "./script-scene.js";
 //#region src/board/model/script-hit.ts
+function resolveBoardScriptHit(scene, owner, hit) {
+	const id = "item" in hit ? `${scriptTemporaryPrefix(owner)}${hit.item}` : owner;
+	const item = scene.get(id);
+	if (!item || scene.opacity(id) <= 0) return null;
+	const box = scene.layout.box(id);
+	return {
+		id,
+		item,
+		rect: "x" in hit ? hit : {
+			x: 0,
+			y: 0,
+			width: box.width,
+			height: box.height
+		}
+	};
+}
+function boardScriptHitVisible(scene, hit, camera, surface) {
+	const { x, y, width, height } = hit.rect;
+	if (width <= 0 || height <= 0) return false;
+	const matrix = scene.layout.matrix(hit.id);
+	const corners = [
+		applyMatrix(matrix, {
+			x,
+			y
+		}),
+		applyMatrix(matrix, {
+			x: x + width,
+			y
+		}),
+		applyMatrix(matrix, {
+			x,
+			y: y + height
+		}),
+		applyMatrix(matrix, {
+			x: x + width,
+			y: y + height
+		})
+	];
+	const xs = corners.map((point) => point.x * camera.zoom + camera.x);
+	const ys = corners.map((point) => point.y * camera.zoom + camera.y);
+	return Math.max(...xs) > 0 && Math.min(...xs) < surface.width && Math.max(...ys) > 0 && Math.min(...ys) < surface.height;
+}
+const bindings = /* @__PURE__ */ new WeakMap();
+function bindingsFor(owner, output) {
+	const cached = bindings.get(output);
+	if (cached?.owner === owner) return cached.byItem;
+	const byItem = /* @__PURE__ */ new Map();
+	for (const [target, hit] of Object.entries(output.hits)) {
+		const id = "item" in hit ? `${scriptTemporaryPrefix(owner)}${hit.item}` : owner;
+		const list = byItem.get(id) ?? [];
+		list.push({
+			owner,
+			target,
+			hit
+		});
+		byItem.set(id, list);
+	}
+	bindings.set(output, {
+		owner,
+		byItem
+	});
+	return byItem;
+}
 function boardScriptTarget(scene, candidates, point, outputs, hitTest) {
-	const owners = new Map([...outputs.keys()].map((id) => [scriptTemporaryPrefix(id), id]));
+	const declared = [...outputs].map(([owner, output]) => bindingsFor(owner, output));
+	const prefixes = [...outputs.keys()].map(scriptTemporaryPrefix);
 	for (const id of [...candidates].sort((a, b) => scene.indexOf(b) - scene.indexOf(a))) {
 		const item = scene.get(id);
-		if (!item || scene.opacity(id) <= 0 || id.endsWith("root") && owners.has(id.slice(0, -4))) continue;
+		if (!item || scene.opacity(id) <= 0) continue;
 		let parent = item.parent;
 		let clipped = false;
 		for (let depth = 0; parent && depth < 64; depth++) {
@@ -19,34 +83,27 @@ function boardScriptTarget(scene, candidates, point, outputs, hitTest) {
 			parent = ancestor.parent;
 		}
 		if (clipped) continue;
-		const output = outputs.get(id);
-		if (output) {
+		for (const byItem of declared) {
+			const hits = byItem.get(id);
+			if (!hits) continue;
 			const local = applyMatrix(invertMatrix(scene.layout.matrix(id)), point);
-			for (const [target, region] of Object.entries(output.hits).reverse()) if (local.x >= region.x && local.y >= region.y && local.x <= region.x + region.width && local.y <= region.y + region.height) return {
-				owner: id,
-				target
-			};
-		}
-		if (!hitTest(item, point)) continue;
-		let current = item;
-		for (let depth = 0; current && depth < 64; depth++) {
-			if (outputs.has(current.id)) return {
-				owner: current.id,
-				target: id
-			};
-			for (const [prefix, owner] of owners) {
-				if (current.id === `${prefix}root`) break;
-				if (current.id.startsWith(prefix)) return {
-					owner,
-					target: current.id.slice(prefix.length)
+			for (let i = hits.length - 1; i >= 0; i--) {
+				const binding = hits[i];
+				if (!binding) continue;
+				const resolved = resolveBoardScriptHit(scene, binding.owner, binding.hit);
+				if (!resolved) continue;
+				const r = resolved.rect;
+				if (local.x >= r.x && local.y >= r.y && local.x <= r.x + r.width && local.y <= r.y + r.height && ("x" in binding.hit || hitTest(item, point))) return {
+					owner: binding.owner,
+					target: binding.target
 				};
 			}
-			current = current.parent ? scene.get(current.parent) : void 0;
 		}
+		if (prefixes.some((prefix) => id.startsWith(prefix))) continue;
 		if (item.type === "frame" && item.props.decoration === "none") continue;
-		return null;
+		if (hitTest(item, point)) return null;
 	}
 	return null;
 }
 //#endregion
-export { boardScriptTarget };
+export { boardScriptHitVisible, boardScriptTarget, resolveBoardScriptHit };

package/dist/board/model/script-observers.d.ts

@@ -0,0 +1,18 @@
+import { BoardDocument } from "../../protocol/dist/board-model.js";
+import "../../protocol/dist/index.js";
+import { BoardScriptEvent, BoardScriptOutput, BoardScriptView } from "./script.js";
+//#region src/board/model/script-observers.d.ts
+declare function createBoardScriptObservers(send: (owner: string, event: BoardScriptEvent) => void): {
+  readonly size: number;
+  readonly transforms: boolean;
+  update(owner: string, output: BoardScriptOutput | null): void;
+  sync(document: BoardDocument, selection: readonly string[], readView: () => BoardScriptView): void;
+  transform(document: BoardDocument, event: {
+    ids: readonly string[];
+    operation: string;
+    cancelled: boolean;
+  }): void;
+  clear(): void;
+};
+//#endregion
+export { createBoardScriptObservers };

package/dist/board/model/script-observers.js

@@ -0,0 +1,92 @@
+import { boardScriptScope } from "./script-scene.js";
+//#region src/board/model/script-observers.ts
+const EVENTS = [
+	"viewchange",
+	"selectionchange",
+	"transformend"
+];
+function createBoardScriptObservers(send) {
+	const subscribers = /* @__PURE__ */ new Map();
+	function scope(owner, entry, document) {
+		if (entry.document !== document) {
+			entry.scope = boardScriptScope(document, owner);
+			entry.document = document;
+			entry.selection = void 0;
+		}
+		return entry.scope;
+	}
+	return {
+		get size() {
+			return subscribers.size;
+		},
+		get transforms() {
+			return [...subscribers.values()].some((entry) => entry.listens.has("transformend"));
+		},
+		update(owner, output) {
+			const listens = new Set(EVENTS.filter((type) => output?.listens.includes(type)));
+			if (!listens.size) {
+				subscribers.delete(owner);
+				return;
+			}
+			const entry = subscribers.get(owner) ?? {
+				listens,
+				scope: /* @__PURE__ */ new Set()
+			};
+			if (!listens.has("viewchange")) entry.view = void 0;
+			if (!listens.has("selectionchange")) {
+				entry.selection = void 0;
+				entry.selected = void 0;
+			}
+			entry.listens = listens;
+			subscribers.set(owner, entry);
+		},
+		sync(document, selection, readView) {
+			let view;
+			let key;
+			for (const [owner, entry] of subscribers) {
+				if (entry.listens.has("viewchange")) {
+					view ??= readView();
+					key ??= JSON.stringify(view);
+					if (entry.view !== key) {
+						entry.view = key;
+						send(owner, {
+							type: "viewchange",
+							data: view
+						});
+					}
+				}
+				if (entry.listens.has("selectionchange")) {
+					const allowed = scope(owner, entry, document);
+					if (entry.selection === selection) continue;
+					entry.selection = selection;
+					const ids = selection.filter((id) => allowed.has(id));
+					if (entry.selected && ids.length === entry.selected.length && ids.every((id, i) => id === entry.selected?.[i])) continue;
+					entry.selected = ids;
+					send(owner, {
+						type: "selectionchange",
+						data: { ids }
+					});
+				}
+			}
+		},
+		transform(document, event) {
+			for (const [owner, entry] of subscribers) {
+				if (!entry.listens.has("transformend")) continue;
+				const allowed = scope(owner, entry, document);
+				const ids = event.ids.filter((id) => allowed.has(id));
+				if (ids.length) send(owner, {
+					type: "transformend",
+					data: {
+						...event,
+						ids
+					}
+				});
+			}
+		},
+		clear() {
+			subscribers.clear();
+		}
+	};
+}
+//#endregion
+export { createBoardScriptObservers };

package/dist/board/model/script-scene.d.ts

@@ -19,6 +19,6 @@ type PreparedOutput = {
 declare function prepareBoardScriptOutput(document: BoardDocument, owner: string, output: BoardScriptOutput): PreparedOutput;
 declare function composeBoardScriptItems(document: BoardDocument, scene: BoardScene, outputs: ReadonlyMap<string, BoardScriptOutput>, incoming?: ReadonlyMap<string, BoardItem>, screen?: {
   zoom: number;
-}, onError?: (owner: string, error: unknown) => void): Map<string, BoardItem>;
+}, onError?: (owner: string, error: unknown) => void, gestureLayout?: BoardScene["layout"]): Map<string, BoardItem>;
 //#endregion
 export { boardScriptScope, composeBoardScriptItems, prepareBoardScriptOutput, scriptTemporaryPrefix, validateBoardScriptCommit, validateBoardScriptOutput };

package/dist/board/model/script-scene.js

@@ -35,6 +35,10 @@ function validateBoardScriptOutput(output, scope) {
 	if (!output || typeof output !== "object" || !output.patches || !output.items || !output.hits || !Array.isArray(output.listens)) throw new Error("Invalid script output.");
 	if (JSON.stringify(output).length > 1e6) throw new Error("Script output exceeds the 1 MB limit.");
 	if (output.space !== void 0 && output.space !== "world" && output.space !== "screen") throw new Error("Invalid script scene space.");
+	if (output.anchor) {
+		const { item, point } = output.anchor;
+		if (output.space !== "screen" || typeof item !== "string" || !item || point && ![point.x, point.y].every((n) => Number.isFinite(n) && n >= 0 && n <= 1)) throw new Error("Invalid screen scene anchor.");
+	}
 	if (output.parameters) {
 		if (Object.keys(output.parameters).length > 64) throw new Error("A script may declare at most 64 parameters.");
 		for (const spec of Object.values(output.parameters)) {
@@ -58,6 +62,7 @@ function validateBoardScriptOutput(output, scope) {
 		if (!patch || typeof patch !== "object" || Object.keys(patch).some((key) => !DISPLAY_FIELDS.has(key))) throw new Error("Scripts may only present display properties.");
 	}
 	for (const hit of Object.values(output.hits)) {
+		if (!hit || typeof hit !== "object") throw new Error("Invalid script hit region.");
 		if (hit.cursor && ![
 			"default",
 			"pointer",
@@ -70,7 +75,11 @@ function validateBoardScriptOutput(output, scope) {
 			"ns-resize",
 			"not-allowed"
 		].includes(hit.cursor)) throw new Error("Invalid script cursor.");
-		if (![
+		if ("target" in hit) {
+			if (hit.target !== "self" || "item" in hit || "x" in hit) throw new Error("Invalid script hit target.");
+		} else if ("item" in hit) {
+			if (typeof hit.item !== "string" || !Object.hasOwn(output.items, hit.item) || "x" in hit) throw new Error("Hit items must belong to the temporary scene.");
+		} else if (![
 			hit.x,
 			hit.y,
 			hit.width,
@@ -100,6 +109,15 @@ function scriptTemporaryPrefix(owner) {
 }
 const preparedOutputs = /* @__PURE__ */ new WeakMap();
 const preparedScopes = /* @__PURE__ */ new WeakMap();
+const itemOrders = /* @__PURE__ */ new WeakMap();
+function orderedScriptOwners(document, outputs) {
+	let order = itemOrders.get(document.items);
+	if (!order) {
+		order = new Map(Object.keys(document.items).map((id, index) => [id, index]));
+		itemOrders.set(document.items, order);
+	}
+	return [...outputs.keys()].filter((id) => order.has(id)).sort((a, b) => (order.get(a) ?? 0) - (order.get(b) ?? 0));
+}
 function prepareBoardScriptOutput(document, owner, output) {
 	const previous = preparedOutputs.get(output);
 	if (previous?.document === document && previous.owner === owner) return previous;
@@ -113,6 +131,7 @@ function prepareBoardScriptOutput(document, owner, output) {
 		scope = boardScriptScope(document, owner);
 		scopes.set(owner, scope);
 	}
+	if (output.anchor && document.items[output.anchor.item] && !scope.has(output.anchor.item)) throw new Error("Scene anchor is outside the script scope.");
 	validateBoardScriptOutput(output, scope);
 	const presented = /* @__PURE__ */ new Map();
 	for (const [id, patch] of Object.entries(output.patches)) {
@@ -177,11 +196,11 @@ function prepareBoardScriptOutput(document, owner, output) {
 	preparedOutputs.set(output, prepared);
 	return prepared;
 }
-function composeBoardScriptItems(document, scene, outputs, incoming = /* @__PURE__ */ new Map(), screen, onError) {
+function composeBoardScriptItems(document, scene, outputs, incoming = /* @__PURE__ */ new Map(), screen, onError, gestureLayout) {
 	const result = new Map(incoming);
 	const screenAnchors = /* @__PURE__ */ new Map();
 	if (outputs.size === 0) return result;
-	for (const owner of Object.keys(document.items)) {
+	for (const owner of orderedScriptOwners(document, outputs)) {
 		const output = outputs.get(owner);
 		if (!output) continue;
 		try {
@@ -249,15 +268,23 @@ function composeBoardScriptItems(document, scene, outputs, incoming = /* @__PURE
 		}
 	}
 	if (screenAnchors.size) {
-		const layout = createBoardLayout((id) => result.get(id) ?? document.items[id]);
+		const layout = gestureLayout ?? createBoardLayout((id) => result.get(id) ?? document.items[id]);
 		for (const [owner, rootId] of screenAnchors) {
 			const root = result.get(rootId);
+			const anchor = outputs.get(owner)?.anchor;
+			const target = anchor?.item ?? owner;
+			const exists = Boolean(document.items[target]);
+			const box = exists ? layout.box(target) : {
+				width: 0,
+				height: 0
+			};
 			if (root) result.set(rootId, {
 				...root,
-				position: applyMatrix(layout.matrix(owner), {
-					x: 0,
-					y: 0
-				})
+				opacity: exists ? root.opacity : 0,
+				position: exists ? applyMatrix(layout.matrix(target), {
+					x: (anchor?.point?.x ?? 0) * box.width,
+					y: (anchor?.point?.y ?? 0) * box.height
+				}) : root.position
 			});
 		}
 	}

package/dist/board/model/script.d.ts

@@ -1,6 +1,29 @@
 import { BoardItem, BoardPatch, BoardScript, BoardVec2 } from "../../protocol/dist/board-model.js";
 import "../../protocol/dist/index.js";
 //#region src/board/model/script.d.ts
+type BoardScriptView = {
+  camera: {
+    x: number;
+    y: number;
+    zoom: number;
+  };
+  width: number;
+  height: number;
+  safeRect: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+  };
+};
+type BoardScriptAnchor = {
+  item: string;
+  point?: BoardVec2;
+};
+type BoardScriptSceneOptions = {
+  space?: "world" | "screen";
+  anchor?: BoardScriptAnchor;
+};
 type BoardScriptEvent = {
   type: string;
   target?: string;
@@ -17,6 +40,22 @@ type BoardScriptEvent = {
   metaKey?: boolean;
   data?: unknown;
 };
+type BoardScriptHostEvents = {
+  viewchange: BoardScriptView;
+  selectionchange: {
+    ids: string[];
+  };
+  transformend: {
+    ids: string[];
+    operation: "move" | "resize" | "rotate" | "arrow";
+    cancelled: boolean;
+  };
+};
+type BoardScriptEventOf<Type extends string> = BoardScriptEvent & {
+  type: Type;
+} & (Type extends keyof BoardScriptHostEvents ? {
+  data: BoardScriptHostEvents[Type];
+} : unknown);
 type BoardScriptFrame = {
   t: number;
   dt: number;
@@ -33,11 +72,16 @@ type BoardScriptItemPatch = Partial<Pick<BoardItem, "position" | "scale" | "rota
   };
   props?: Record<string, unknown>;
 };
-type BoardScriptHit = {
+type BoardScriptHit = ({
   x: number;
   y: number;
   width: number;
   height: number;
+} | {
+  target: "self";
+} | {
+  item: string;
+}) & {
   label?: string;
   cursor?: string;
 };
@@ -46,7 +90,7 @@ type BoardScriptSnapshot = {
   time: number;
   random: number;
   configuration?: string;
-  effects?: Pick<BoardScriptOutput, "patches" | "items" | "hits" | "space">;
+  effects?: Pick<BoardScriptOutput, "patches" | "items" | "hits" | "space" | "anchor">;
 };
 type BoardScriptParameter = {
   type: "number" | "boolean" | "string" | "color";
@@ -59,6 +103,7 @@ type BoardScriptParameter = {
 type BoardScriptOutput = {
   parameters?: Record<string, BoardScriptParameter>;
   space?: "world" | "screen";
+  anchor?: BoardScriptAnchor;
   patches: Record<string, Record<string, unknown>>;
   items: Record<string, unknown>;
   hits: Record<string, BoardScriptHit>;
@@ -78,16 +123,15 @@ type BoardScriptContext = {
   emit(target: string, type: string, data?: unknown): Promise<void>;
   readonly state: Record<string, unknown>;
   readonly frame: BoardScriptFrame;
+  readonly view: BoardScriptView | null;
   random(): number;
-  on(type: string, handler: (event: BoardScriptEvent) => void): () => void;
+  on<Type extends string>(type: Type, handler: (event: BoardScriptEventOf<Type>) => void): () => void;
   onFrame(handler: (frame: BoardScriptFrame) => void): () => void;
   onDispose(handler: () => void): void;
   invalidate(): void;
   get(id: string): BoardItem | undefined;
   present(id: string, patch: BoardScriptItemPatch | null): void;
-  scene(items: Record<string, unknown>, options?: {
-    space?: "world" | "screen";
-  }): void;
+  scene(items: Record<string, unknown>, options?: BoardScriptSceneOptions): void;
   hitRegions(hits: Record<string, BoardScriptHit>): void;
   commit(patch: BoardPatch): Promise<void>;
   capabilities: {
@@ -102,4 +146,4 @@ type BoardScriptModule = {
   animated?: boolean;
 };
 //#endregion
-export { BoardScriptContext, BoardScriptEvent, BoardScriptFrame, BoardScriptHit, BoardScriptItemPatch, BoardScriptModule, BoardScriptOutput, BoardScriptParameter, BoardScriptSnapshot };
+export { BoardScriptAnchor, BoardScriptContext, BoardScriptEvent, BoardScriptEventOf, BoardScriptFrame, BoardScriptHit, BoardScriptHostEvents, BoardScriptItemPatch, BoardScriptModule, BoardScriptOutput, BoardScriptParameter, BoardScriptSceneOptions, BoardScriptSnapshot, BoardScriptView };

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

@@ -7,6 +7,6 @@ declare function drawAudioWaveform(graphics: Graphics, seed: string, rect: {
   y: number;
   width: number;
   height: number;
-}, color: number, alpha?: number): void;
+}, color: number, alpha?: number, square?: boolean): void;
 //#endregion
 export { audioWaveformBars, drawAudioWaveform };

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

@@ -17,7 +17,7 @@ function audioWaveformBars(seed, count) {
 	}
 	return bars;
 }
-function drawAudioWaveform(graphics, seed, rect, color, alpha = .72) {
+function drawAudioWaveform(graphics, seed, rect, color, alpha = .72, square = false) {
 	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);
@@ -26,11 +26,14 @@ function drawAudioWaveform(graphics, seed, rect, color, alpha = .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
-		});
+		const x = rect.x + index * step;
+		if (square) graphics.rect(x, centerY - height / 2, barWidth, height);
+		else graphics.roundRect(x, centerY - height / 2, barWidth, height, barWidth / 2);
 	}
+	graphics.fill({
+		color,
+		alpha
+	});
 }
 //#endregion
 export { audioWaveformBars, drawAudioWaveform };

package/dist/board/render/board-background.js

@@ -12,7 +12,7 @@ function buildGridTexture(context, size, color, opacity, kind) {
 		width: 1,
 		alpha: opacity
 	});
-	else graphics.circle(.5, .5, .9).fill({
+	else graphics.circle(size / 2, size / 2, 1.1).fill({
 		color,
 		alpha: opacity
 	});
@@ -49,8 +49,9 @@ function sync(parts, context) {
 	const kind = settings.background.kind === "grid" ? "grid" : "dots";
 	const visible = settings.grid?.visible === true;
 	const size = Math.max(4, settings.grid?.size ?? 24);
-	const opacity = .12;
-	const key = `${kind}|${size}|${palette.border}|${opacity}`;
+	const color = kind === "grid" ? palette.border : palette.muted;
+	const opacity = kind === "grid" ? .9 : .4;
+	const key = `${kind}|${size}|${color}|${opacity}`;
 	if (!visible) {
 		if (parts.sprite) parts.sprite.visible = false;
 		return;
@@ -61,7 +62,7 @@ function sync(parts, context) {
 			parts.sprite.destroy();
 			previousTexture.destroy(true);
 		}
-		const texture = buildGridTexture(context, size, palette.border, opacity, kind);
+		const texture = buildGridTexture(context, size, color, opacity, kind);
 		parts.sprite = new TilingSprite({
 			texture,
 			width,

package/dist/board/render/card-tag.d.ts

@@ -0,0 +1,24 @@
+import { BoardRenderContext } from "./renderers/board-renderer-registry.js";
+import { Container, Graphics, Text } from "pixi.js";
+//#region src/board/render/card-tag.d.ts
+type CardGlyph = "image" | "video" | "audio" | "file" | "task";
+declare const CARD_TAG_SIZE = 11;
+declare function formatBoardDuration(ms: number): string;
+declare function drawCardGlyph(graphics: Graphics, glyph: CardGlyph, color: number, pixel: boolean): void;
+type CardTag = {
+  root: Container;
+  icon: Graphics;
+  text: Text | null;
+  sig: string;
+  resolution: number;
+  width: number;
+};
+declare function createCardTag(): CardTag;
+declare function zoomCardTag(tag: CardTag, zoom: number): void;
+declare function syncCardTag(tag: CardTag, input: {
+  glyph: CardGlyph;
+  text: string;
+  width: number;
+}, context: BoardRenderContext): void;
+//#endregion
+export { CARD_TAG_SIZE, CardGlyph, CardTag, createCardTag, drawCardGlyph, formatBoardDuration, syncCardTag, zoomCardTag };