@neta-art/cohub 9.0.0 → 10.0.0

package/dist/board/editor/creation.js

@@ -0,0 +1,224 @@
+import { IDENTITY_MATRIX, applyMatrix, invertMatrix } from "../../protocol/dist/board-layout.js";
+import { rectCenter } from "../model/geometry.js";
+import { buildBoardScene } from "../model/scene.js";
+import { isShapeKind } from "../model/shape-types.js";
+import { createBoardItemId } from "../model/items/id.js";
+import { createAppBoardItem, createArrowBoardItem, createDrawBoardItem, createFileNodeForPath, createFrameBoardItem, createShapeBoardItem, createTaskBoardItem, createTextBoardItem } from "../model/items/create.js";
+import { sameJson } from "./document-edits.js";
+import { isContinuousBoardTool } from "./tool.js";
+//#region src/board/editor/creation.ts
+function createCreationModule(ctx) {
+	const { state, options } = ctx;
+	function placeNew(entries) {
+		const created = new Set(entries.map((entry) => entry.id));
+		const probe = buildBoardScene({
+			...state.base,
+			items: Object.fromEntries(entries.map((entry) => [entry.id, entry.item]))
+		});
+		const nextZ = /* @__PURE__ */ new Map();
+		const changes = /* @__PURE__ */ new Map();
+		for (const { id, item } of entries) {
+			if (item.parent && created.has(item.parent)) {
+				changes.set(id, item);
+				continue;
+			}
+			const shown = probe.get(id);
+			const container = shown && item.type !== "frame" && item.type !== "arrow" ? ctx.query.frameAt(rectCenter(shown.frame), created) : null;
+			const value = container && shown ? ctx.document.reparent(item, shown.frame, container.id, probe.layout.box(id)) : item;
+			const z = nextZ.get(container?.id) ?? ctx.document.topZ(container?.id);
+			nextZ.set(container?.id, z + 1);
+			changes.set(id, {
+				...value,
+				z
+			});
+		}
+		return changes;
+	}
+	function returnToSelect() {
+		if (!isContinuousBoardTool(state.tool)) state.tool = "select";
+	}
+	function add(entries, { select = !isContinuousBoardTool(state.tool), enter = true } = {}) {
+		if (options.readonly || entries.length === 0) return;
+		const changes = placeNew(entries);
+		if (enter) ctx.document.markAdded([...changes.keys()]);
+		state.selection = select ? [...changes.keys()] : [];
+		ctx.document.commitItems(changes);
+		returnToSelect();
+	}
+	function addOne(entry) {
+		add([entry]);
+		return entry.id;
+	}
+	function addItem(type, input) {
+		if (options.readonly) return null;
+		return addOne(ctx.registry.create(type, input));
+	}
+	function addTaskWithSources(taskRunId, snapshot, at, sources, metadata) {
+		if (options.readonly) return null;
+		const { arrow } = state.toolStyles;
+		const task = createTaskBoardItem(taskRunId, snapshot, at.x, at.y, metadata);
+		add([task, ...sources.filter((source) => source.itemId !== task.id && state.scene.get(source.itemId)).map((source) => {
+			const entry = createArrowBoardItem({
+				x: 0,
+				y: 0
+			}, { item: task.id }, arrow.color, createBoardItemId(), arrow.size, { item: source.itemId });
+			const props = entry.item.props;
+			return {
+				id: entry.id,
+				item: {
+					...entry.item,
+					metadata: { boardFlow: {
+						version: 1,
+						kind: "content",
+						sourcePortId: source.sourcePortId,
+						targetPortId: source.targetPortId
+					} },
+					props: {
+						...props,
+						start: {
+							item: source.itemId,
+							anchor: "auto",
+							port: source.sourcePortId
+						},
+						end: {
+							item: task.id,
+							anchor: "auto",
+							port: source.targetPortId
+						},
+						relation: "input"
+					}
+				}
+			};
+		})], { select: false });
+		state.selection = [task.id];
+		return task.id;
+	}
+	function commitBox(gesture) {
+		const dx = gesture.current.x - gesture.start.x;
+		const dy = gesture.current.y - gesture.start.y;
+		const click = Math.hypot(dx, dy) <= 6 / Math.max(state.camera.zoom, 1e-4);
+		const minimum = gesture.kind === "frame" ? 48 : 24;
+		const box = click ? void 0 : {
+			x: Math.min(gesture.start.x, gesture.current.x),
+			y: Math.min(gesture.start.y, gesture.current.y),
+			width: Math.max(minimum, Math.abs(dx)),
+			height: Math.max(minimum, Math.abs(dy))
+		};
+		const geometry = isShapeKind(gesture.geometry) ? gesture.geometry : "rectangle";
+		const { x, y } = gesture.start;
+		add([gesture.kind === "shape" ? createShapeBoardItem(geometry, x, y, gesture.color, gesture.id, box) : createFrameBoardItem(x, y, gesture.color, "Frame", gesture.id, box)], { enter: false });
+	}
+	function commitDraw(id, points, color, size) {
+		if (points.length === 0) return;
+		add([createDrawBoardItem(points, color, size, id)], { enter: false });
+	}
+	function arrowEnd(point, targetItemId, arrowMatrix = IDENTITY_MATRIX) {
+		if (targetItemId) return {
+			item: targetItemId,
+			anchor: "auto"
+		};
+		const local = applyMatrix(invertMatrix(arrowMatrix), point);
+		return {
+			x: local.x,
+			y: local.y
+		};
+	}
+	function commitArrow(gesture, cancelled) {
+		const { start, current, startItemId, targetItemId } = gesture;
+		const bound = !cancelled && targetItemId && targetItemId !== startItemId ? targetItemId : null;
+		if (!bound && Math.hypot(current.x - start.x, current.y - start.y) < 2 / state.camera.zoom) return;
+		add([createArrowBoardItem(start, bound ? { item: bound } : current, gesture.color, gesture.id, gesture.size, startItemId ? {
+			item: startItemId,
+			...gesture.startSide ? { anchor: {
+				side: gesture.startSide,
+				offset: .5
+			} } : {}
+		} : void 0)], { enter: false });
+	}
+	function beginTextDraft(at) {
+		const entry = createTextBoardItem("", at.x, at.y, state.toolStyles.text.color);
+		ctx.document.writeDraft(placeNew([entry]), true);
+		state.draftTextId = entry.id;
+		state.selection = [entry.id];
+		state.editingId = entry.id;
+	}
+	function previewTextLayout(id, text) {
+		const item = ctx.document.displayItem(id);
+		if (item?.type !== "text" || item.props.text === text) return;
+		ctx.document.writeDraft(/* @__PURE__ */ new Map([[id, {
+			...item,
+			props: {
+				...item.props,
+				text
+			}
+		}]]));
+	}
+	function updateText(id, text, created = false) {
+		const item = ctx.document.displayItem(id);
+		if (!item || item.type !== "text" && item.type !== "shape" && item.type !== "arrow" && item.type !== "frame") return;
+		const next = item.type === "arrow" || item.type === "frame" ? {
+			...item,
+			props: {
+				...item.props,
+				label: text
+			}
+		} : {
+			...item,
+			props: {
+				...item.props,
+				text
+			}
+		};
+		if (!created && sameJson(next, state.base.items[id])) {
+			ctx.document.dropDraftItem(id);
+			ctx.document.rescene([id]);
+			return;
+		}
+		ctx.document.commitItems(/* @__PURE__ */ new Map([[id, next]]));
+	}
+	function commitTextEdit(id, text) {
+		const isDraft = id === state.draftTextId;
+		const target = ctx.document.displayItem(id);
+		const empty = text.trim() === "" && (isDraft || target?.type === "text");
+		state.editingId = null;
+		state.draftTextId = null;
+		if (empty) {
+			if (isDraft) {
+				ctx.document.dropDraftItem(id);
+				ctx.document.rescene();
+			} else ctx.deletion.deleteItem(id);
+		} else updateText(id, text, isDraft);
+		if (state.tool === "text") state.tool = "select";
+		ctx.remote.flushPending();
+	}
+	const styles = () => state.toolStyles;
+	return {
+		placeNew,
+		add,
+		addItem,
+		addApp: (app, at) => addOne(createAppBoardItem(app, at.x, at.y)),
+		addFile: (path, at, snapshot) => addOne(createFileNodeForPath(path, at.x, at.y, snapshot)),
+		addTask: (taskRunId, snapshot, at, metadata) => addOne(createTaskBoardItem(taskRunId, snapshot, at.x, at.y, metadata)),
+		addTaskWithSources,
+		addText: (text, at) => {
+			add([createTextBoardItem(text, at.x, at.y, styles().text.color)]);
+		},
+		addShape: (at, geometry) => {
+			const { shape } = styles();
+			add([createShapeBoardItem(geometry ?? shape.geometry, at.x, at.y, shape.color)]);
+		},
+		addFrame: (at) => {
+			add([createFrameBoardItem(at.x, at.y, styles().frame.color)]);
+		},
+		commitBox,
+		commitDraw,
+		commitArrow,
+		arrowEnd,
+		beginTextDraft,
+		previewTextLayout,
+		updateText,
+		commitTextEdit
+	};
+}
+//#endregion
+export { createCreationModule };

package/dist/board/editor/deletion.d.ts

@@ -0,0 +1,9 @@
+import { EditorContext } from "./context.js";
+//#region src/board/editor/deletion.d.ts
+declare function createDeletionModule(ctx: EditorContext): {
+  deleteSelection: () => void;
+  deleteItem: (id: string) => void;
+};
+type DeletionModule = ReturnType<typeof createDeletionModule>;
+//#endregion
+export { DeletionModule, createDeletionModule };

package/dist/board/editor/deletion.js

@@ -0,0 +1,90 @@
+import { applyMatrix, invertMatrix, isArrowBinding } from "../../protocol/dist/board-layout.js";
+import { pruneBoardTrack } from "../../protocol/dist/board-patch.js";
+import { resolveSceneArrow } from "../model/arrow-geometry.js";
+//#region src/board/editor/deletion.ts
+function createDeletionModule(ctx) {
+	const { state } = ctx;
+	function changesFor(ids) {
+		const { scene, base } = state;
+		const doomed = /* @__PURE__ */ new Set();
+		for (const id of ids) {
+			if (!scene.get(id)) continue;
+			doomed.add(id);
+			for (const child of scene.descendants(id)) doomed.add(child);
+		}
+		const changes = /* @__PURE__ */ new Map();
+		for (const id of doomed) changes.set(id, null);
+		for (const id of doomed) for (const arrowId of scene.binders(id)) {
+			if (doomed.has(arrowId) || changes.has(arrowId)) continue;
+			const arrow = scene.get(arrowId);
+			if (!arrow) continue;
+			const resolved = resolveSceneArrow(arrow, scene);
+			const toLocal = invertMatrix(scene.layout.matrix(arrowId));
+			const free = (end, point) => {
+				if (!isArrowBinding(end) || !doomed.has(end.item)) return end;
+				const local = applyMatrix(toLocal, point);
+				return {
+					x: local.x,
+					y: local.y
+				};
+			};
+			const { id: _id, frame: _frame, ...stored } = arrow;
+			changes.set(arrowId, {
+				...stored,
+				props: {
+					...arrow.props,
+					start: free(arrow.props.start, resolved.start.point),
+					end: free(arrow.props.end, resolved.end.point)
+				}
+			});
+		}
+		let animations;
+		for (const [animationId, animation] of Object.entries(base.animations)) {
+			const tracks = { ...animation.tracks };
+			let changed = false;
+			for (const [id, track] of Object.entries(tracks)) {
+				const next = pruneBoardTrack(track, doomed);
+				if (next === track) continue;
+				changed = true;
+				if (next) tracks[id] = next;
+				else delete tracks[id];
+			}
+			if (!changed) continue;
+			animations ??= { ...base.animations };
+			animations[animationId] = {
+				...animation,
+				tracks
+			};
+		}
+		return {
+			items: changes,
+			...animations ? { animations } : {}
+		};
+	}
+	function deleteIds(ids) {
+		const { items: changes, animations } = changesFor(ids);
+		if (changes.size === 0) return;
+		for (const [id, item] of changes) ctx.document.setDraftItem(id, item);
+		ctx.document.commit(animations ? { animations } : {});
+		state.selection = state.selection.filter((id) => !changes.has(id) || changes.get(id) !== null);
+		if (state.editingId && changes.get(state.editingId) === null) state.editingId = null;
+	}
+	function deleteSelection() {
+		const ids = ctx.query.unlockedIds(state.selection);
+		if (ids.length === 0) return;
+		deleteIds(ids);
+		state.selection = [];
+		state.editingId = null;
+	}
+	function deleteItem(id) {
+		const target = state.scene.get(id);
+		if (!target || ctx.query.isLocked(target)) return;
+		deleteIds([id]);
+	}
+	return {
+		deleteSelection,
+		deleteItem
+	};
+}
+//#endregion
+export { createDeletionModule };

package/dist/board/editor/document-edits.d.ts

@@ -0,0 +1,22 @@
+import { BoardDocument, BoardItem, BoardPatch } from "../../protocol/dist/board-model.js";
+import "../model/index.js";
+//#region src/board/editor/document-edits.d.ts
+declare function sameJson(a: unknown, b: unknown): boolean;
+declare function readPath(value: unknown, path: readonly string[]): unknown;
+declare function writePath<T>(value: T, path: readonly string[], next: unknown): T;
+type BoardEditPlayhead = {
+  animationId: string;
+  time: number;
+};
+declare function routeBoardEdits(input: {
+  base: BoardDocument;
+  evaluated: ReadonlyMap<string, BoardItem>;
+  draft: ReadonlyMap<string, BoardItem | null>;
+  displayed?: ReadonlyMap<string, BoardItem>;
+  playhead: BoardEditPlayhead | null;
+  recording: boolean;
+}): BoardDocument;
+declare function isEmptyBoardPatch(patch: BoardPatch): boolean;
+declare function diffBoardEdits(from: BoardDocument, to: BoardDocument, ids: Iterable<string>): BoardPatch;
+//#endregion
+export { BoardEditPlayhead, diffBoardEdits, isEmptyBoardPatch, readPath, routeBoardEdits, sameJson, writePath };

package/dist/board/editor/document-edits.js

@@ -0,0 +1,193 @@
+import { scaleVector } from "../../protocol/dist/board-layout.js";
+import { diffMergePatch, listBoardProperties } from "../../protocol/dist/board-patch.js";
+import { createBoardEntityId } from "../model/items/id.js";
+//#region src/board/editor/document-edits.ts
+function sameJson(a, b) {
+	if (a === b) return true;
+	if (!a || !b || typeof a !== "object" || typeof b !== "object") return false;
+	if (Array.isArray(a) || Array.isArray(b)) {
+		if (!Array.isArray(a) || !Array.isArray(b) || a.length !== b.length) return false;
+		for (let index = 0; index < a.length; index += 1) if (!sameJson(a[index], b[index])) return false;
+		return true;
+	}
+	const left = a;
+	const right = b;
+	let members = 0;
+	for (const key of Object.keys(left)) {
+		if (left[key] === void 0) continue;
+		members += 1;
+		if (!sameJson(left[key], right[key])) return false;
+	}
+	for (const key of Object.keys(right)) if (right[key] !== void 0) members -= 1;
+	return members === 0;
+}
+function readPath(value, path) {
+	let current = value;
+	for (const segment of path) {
+		if (!current || typeof current !== "object") return void 0;
+		current = current[segment];
+	}
+	return current;
+}
+function writePath(value, path, next) {
+	const [head, ...rest] = path;
+	if (head === void 0) return next;
+	const record = value && typeof value === "object" ? value : {};
+	return {
+		...record,
+		[head]: writePath(record[head], rest, next)
+	};
+}
+const KEYFRAMABLE_KINDS = /* @__PURE__ */ new Set([
+	"number",
+	"vec2",
+	"scale",
+	"color"
+]);
+const STRUCTURAL_KEYS = [
+	"parent",
+	"z",
+	"locked",
+	"metadata"
+];
+function keyframe(animations, playhead, recording, id, property, value, storedValue) {
+	const animation = animations[playhead.animationId];
+	if (!animation) return false;
+	const time = Math.round(playhead.time);
+	const existing = Object.entries(animation.tracks).find(([, track]) => track.target === id && track.property === property && track.composite === "replace");
+	if (!existing && !recording) return false;
+	const candidateId = `${id}-${property.replaceAll(".", "-")}`;
+	const newId = candidateId.length <= 160 && !Object.hasOwn(animation.tracks, candidateId) ? candidateId : createBoardEntityId();
+	const [trackId, track] = existing ?? [newId, {
+		target: id,
+		property,
+		keyframes: time > 0 ? [{
+			at: 0,
+			value: storedValue
+		}] : [],
+		composite: "replace",
+		interpolation: "auto"
+	}];
+	const keyframes = [...track.keyframes.filter((entry) => entry.at !== time), {
+		at: time,
+		value
+	}].sort((a, b) => a.at - b.at);
+	animations[playhead.animationId] = {
+		...animation,
+		duration: Math.max(animation.duration, time),
+		tracks: {
+			...animation.tracks,
+			[trackId]: {
+				...track,
+				keyframes
+			}
+		}
+	};
+	return true;
+}
+function authoredValue(stored, shown, next, property = "") {
+	if (sameJson(shown, next)) return stored;
+	if (property === "scale" && stored !== void 0 && shown !== void 0 && next !== void 0 && [
+		stored,
+		shown,
+		next
+	].some((value) => typeof value === "object")) return authoredValue(scaleVector(stored), scaleVector(shown), scaleVector(next), "scale.vector");
+	if (typeof stored === "number" && typeof shown === "number" && typeof next === "number") {
+		if (property === "opacity") return Math.max(0, Math.min(1, shown ? stored * next / shown : next));
+		if (property === "scale" || property.startsWith("scale.")) return shown ? stored * next / shown : next;
+		return stored + next - shown;
+	}
+	const record = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
+	if (record(stored) && record(shown) && record(next)) {
+		const result = { ...stored };
+		for (const key of /* @__PURE__ */ new Set([...Object.keys(shown), ...Object.keys(next)])) {
+			if (sameJson(shown[key], next[key])) continue;
+			if (!(key in next)) delete result[key];
+			else result[key] = authoredValue(stored[key], shown[key], next[key], property ? `${property}.${key}` : key);
+		}
+		return result;
+	}
+	return next;
+}
+function routeBoardEdits(input) {
+	const { base, evaluated, draft, playhead, recording } = input;
+	if (draft.size === 0) return base;
+	const items = { ...base.items };
+	const animations = { ...base.animations };
+	let keyed = false;
+	for (const [id, next] of draft) {
+		const stored = base.items[id];
+		if (!next) {
+			delete items[id];
+			continue;
+		}
+		if (!stored || next.type !== stored.type) {
+			items[id] = next;
+			continue;
+		}
+		const shown = input.displayed?.get(id) ?? evaluated.get(id) ?? stored;
+		if (!playhead) {
+			items[id] = authoredValue(stored, shown, next);
+			continue;
+		}
+		const properties = listBoardProperties(next.type);
+		let item = stored;
+		for (const { property, kind } of properties) {
+			const path = property.split(".");
+			const value = readPath(next, path);
+			if (sameJson(value, readPath(shown, path))) continue;
+			if (KEYFRAMABLE_KINDS.has(kind) && keyframe(animations, playhead, recording, id, property, value, readPath(stored, path))) keyed = true;
+			else item = writePath(item, path, authoredValue(readPath(stored, path), readPath(shown, path), value, property));
+		}
+		for (const key of STRUCTURAL_KEYS) if (!sameJson(next[key], shown[key])) {
+			const copy = { ...item };
+			if (next[key] === void 0) delete copy[key];
+			else copy[key] = next[key];
+			item = copy;
+		}
+		items[id] = item;
+	}
+	return {
+		...base,
+		items,
+		animations: keyed ? animations : base.animations
+	};
+}
+function isEmptyBoardPatch(patch) {
+	return !patch.board && !patch.items && !patch.animations;
+}
+function diffBoardEdits(from, to, ids) {
+	const patch = {};
+	if (from.board !== to.board && !sameJson(from.board, to.board)) patch.board = diffMergePatch(from.board, to.board);
+	const itemPatch = {};
+	for (const id of new Set(ids)) {
+		const before = from.items[id];
+		const after = to.items[id];
+		if (before === after) continue;
+		if (!after) {
+			if (before) itemPatch[id] = null;
+		} else if (!before || before.type !== after.type) itemPatch[id] = after;
+		else {
+			const change = diffMergePatch(before, after);
+			if (change && typeof change === "object" && Object.keys(change).length) itemPatch[id] = change;
+		}
+	}
+	if (Object.keys(itemPatch).length) patch.items = itemPatch;
+	if (from.animations !== to.animations) {
+		const animationPatch = {};
+		for (const id of /* @__PURE__ */ new Set([...Object.keys(from.animations), ...Object.keys(to.animations)])) {
+			const before = from.animations[id];
+			const after = to.animations[id];
+			if (before === after) continue;
+			if (!after) animationPatch[id] = null;
+			else {
+				const change = diffMergePatch(before ?? {}, after);
+				if (change && typeof change === "object" && Object.keys(change).length) animationPatch[id] = change;
+			}
+		}
+		if (Object.keys(animationPatch).length) patch.animations = animationPatch;
+	}
+	return patch;
+}
+//#endregion
+export { diffBoardEdits, isEmptyBoardPatch, readPath, routeBoardEdits, sameJson, writePath };

package/dist/board/editor/document.d.ts

@@ -0,0 +1,35 @@
+import { BoardAnimation, BoardDocument, BoardItem, BoardSettings } from "../../protocol/dist/board-model.js";
+import { BoardFrame } from "../../protocol/dist/board-layout.js";
+import { Rect } from "../model/geometry.js";
+import "../model/index.js";
+import { EditorContext } from "./context.js";
+//#region src/board/editor/document.d.ts
+declare function createDocumentModule(ctx: EditorContext): {
+  markAdded: (ids: readonly string[]) => void;
+  consumeRecentlyAdded: () => string[];
+  displayItem: (id: string) => BoardItem | undefined;
+  reevaluate: () => void;
+  setPlayedItems: (items: ReadonlyMap<string, BoardItem>) => void;
+  rescene: (ids?: Iterable<string>) => void;
+  reset: (next: BoardDocument) => void;
+  setDraftItem: (id: string, item: BoardItem | null) => void;
+  draftItem: (id: string) => BoardItem | null | undefined;
+  dropDraftItem: (id: string) => void;
+  writeDraft: (changes: ReadonlyMap<string, BoardItem | null>, structural?: boolean) => void;
+  discardDraft: () => void;
+  adopt: (next: BoardDocument, changedIds?: Iterable<string>) => void;
+  commit: (extra?: {
+    board?: BoardSettings;
+    animations?: Record<string, BoardAnimation>;
+  }, record?: boolean) => void;
+  commitItems: (changes: ReadonlyMap<string, BoardItem | null>, record?: boolean) => void;
+  undo: () => void;
+  redo: () => void;
+  previewSettings: (settings: BoardSettings) => void;
+  setSettings: (settings: BoardSettings) => void;
+  reparent: (item: BoardItem, frame: BoardFrame, parent: string | undefined, box: Rect) => BoardItem;
+  topZ: (parent: string | undefined) => number;
+};
+type DocumentModule = ReturnType<typeof createDocumentModule>;
+//#endregion
+export { DocumentModule, createDocumentModule };