@neta-art/cohub 9.0.1 → 11.0.0

package/dist/board/editor/camera.js

@@ -0,0 +1,137 @@
+import { cameraForRect, normalizeViewport, panBy, pointToWorld, screenPoint, zoomAround } from "../model/geometry.js";
+import { normalizeWheelDelta, wheelZoomFactor } from "./wheel.js";
+//#region src/board/editor/camera.ts
+const ZOOM_STEP = 1.28;
+const CAMERA_ANIMATION_MS = 240;
+function easeOutCubic(t) {
+	return 1 - (1 - t) * (1 - t) * (1 - t);
+}
+function createCameraModule(ctx) {
+	const { state } = ctx;
+	let animation = 0;
+	function setCamera(viewport) {
+		state.camera = normalizeViewport(viewport, state.camera);
+		state.hoverPoint = null;
+		state.hoverId = null;
+	}
+	function setCameraPolicy(policy) {
+		if (state.cameraPolicy === policy) return;
+		state.cameraPolicy = policy;
+		ctx.preferencesChanged();
+	}
+	function takeCameraControl() {
+		setCameraPolicy("free");
+	}
+	function cancelAnimation() {
+		if (animation) cancelAnimationFrame(animation);
+		animation = 0;
+	}
+	function animateCamera(target) {
+		cancelAnimation();
+		const from = normalizeViewport(state.camera);
+		const to = normalizeViewport(target, from);
+		const started = performance.now();
+		const step = (now) => {
+			const t = Math.min(1, (now - started) / CAMERA_ANIMATION_MS);
+			const eased = easeOutCubic(t);
+			setCamera({
+				x: from.x + (to.x - from.x) * eased,
+				y: from.y + (to.y - from.y) * eased,
+				zoom: from.zoom + (to.zoom - from.zoom) * eased
+			});
+			animation = t < 1 ? requestAnimationFrame(step) : 0;
+		};
+		animation = requestAnimationFrame(step);
+	}
+	function surfaceCenter() {
+		return screenPoint(state.surfaceSize.width / 2, state.surfaceSize.height / 2);
+	}
+	function viewCenter() {
+		return pointToWorld(surfaceCenter(), state.camera);
+	}
+	function visibleRect() {
+		const { camera, surfaceSize } = state;
+		if (surfaceSize.width <= 0 || surfaceSize.height <= 0) return null;
+		return {
+			x: -camera.x / camera.zoom,
+			y: -camera.y / camera.zoom,
+			width: surfaceSize.width / camera.zoom,
+			height: surfaceSize.height / camera.zoom
+		};
+	}
+	function zoomAt(point, factor, animate = false) {
+		const target = zoomAround(state.camera, point, state.camera.zoom * factor);
+		if (animate) animateCamera(target);
+		else setCamera(target);
+	}
+	function focusRect(rect, focus = {}) {
+		const { surfaceSize } = state;
+		if (surfaceSize.width <= 0 || surfaceSize.height <= 0) return;
+		const target = cameraForRect(rect, surfaceSize, {
+			fit: focus.fit ?? "contain",
+			padding: focus.padding ?? 32,
+			minZoom: focus.minZoom,
+			maxZoom: focus.maxZoom
+		});
+		if (focus.animate === false) setCamera(target);
+		else animateCamera(target);
+	}
+	function fitView(focus = {}) {
+		const content = ctx.query.contentBounds();
+		if (content && state.surfaceSize.width > 0) focusRect(content, {
+			padding: 64,
+			...focus
+		});
+		else if (focus.animate === false) setCamera({
+			x: 0,
+			y: 0,
+			zoom: 1
+		});
+		else animateCamera({
+			x: 0,
+			y: 0,
+			zoom: 1
+		});
+	}
+	function focusItems(ids, focus) {
+		const rect = ctx.query.contentBounds(ids);
+		if (rect) focusRect(rect, focus);
+	}
+	function focusSelection(focus) {
+		const rect = ctx.query.contentBounds(state.selection);
+		if (rect) focusRect(rect, focus);
+		else fitView();
+	}
+	function wheel(point, deltaX, deltaY, zoomKey, deltaMode = 0) {
+		cancelAnimation();
+		const { camera } = state;
+		if (zoomKey) {
+			setCamera(zoomAround(camera, point, camera.zoom * wheelZoomFactor(deltaY, deltaMode)));
+			return;
+		}
+		setCamera(panBy(camera, -normalizeWheelDelta(deltaX, deltaMode) * 1.15, -normalizeWheelDelta(deltaY, deltaMode) * 1.15));
+	}
+	return {
+		setCamera,
+		setCameraPolicy,
+		takeCameraControl,
+		cancelAnimation,
+		viewCenter,
+		visibleRect,
+		zoomAt,
+		zoomIn: () => zoomAt(surfaceCenter(), ZOOM_STEP, true),
+		zoomOut: () => zoomAt(surfaceCenter(), 1 / ZOOM_STEP, true),
+		resetZoom: () => animateCamera({
+			...state.camera,
+			zoom: 1
+		}),
+		focusRect,
+		fitView,
+		focusItems,
+		focusNode: (id, focus) => focusItems([id], focus),
+		focusSelection,
+		wheel
+	};
+}
+//#endregion
+export { createCameraModule };

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

@@ -0,0 +1,41 @@
+import { BoardItem } from "../../protocol/dist/board-model.js";
+import { BOARD_CLIPBOARD_KIND, BOARD_CLIPBOARD_MIME } from "../../protocol/dist/board.js";
+import "../../protocol/dist/index.js";
+import "../model/index.js";
+//#region src/board/editor/clipboard.d.ts
+/** How far a duplicate or repeated paste lands from its source. */
+declare const DUPLICATE_OFFSET = 24;
+declare const BOARD_CLIPBOARD_VERSION: 3;
+declare const MAX_CLIPBOARD_ITEMS = 2000;
+declare const MAX_CLIPBOARD_CHARS: number;
+type BoardClipboardPayload = {
+  kind: typeof BOARD_CLIPBOARD_KIND;
+  version: typeof BOARD_CLIPBOARD_VERSION;
+  items: Record<string, BoardItem>;
+  origin: {
+    x: number;
+    y: number;
+  };
+};
+declare function encodeClipboard(items: Record<string, BoardItem>, origin: {
+  x: number;
+  y: number;
+}): BoardClipboardPayload | null;
+declare function parseClipboard(raw: unknown): BoardClipboardPayload | null;
+declare function materializeClipboard(payload: BoardClipboardPayload, at: {
+  x: number;
+  y: number;
+}, resolveEnd?: (id: string, which: "start" | "end") => {
+  x: number;
+  y: number;
+} | null): Record<string, BoardItem>;
+declare function remapItems(items: Record<string, BoardItem>, idMap: ReadonlyMap<string, string>, place?: (item: BoardItem) => BoardItem, resolveEnd?: (id: string, which: "start" | "end") => {
+  x: number;
+  y: number;
+} | null): Record<string, BoardItem>;
+declare function defaultPasteOffset(count?: number): {
+  x: number;
+  y: number;
+};
+//#endregion
+export { BOARD_CLIPBOARD_MIME, BOARD_CLIPBOARD_VERSION, BoardClipboardPayload, DUPLICATE_OFFSET, MAX_CLIPBOARD_CHARS, MAX_CLIPBOARD_ITEMS, defaultPasteOffset, encodeClipboard, materializeClipboard, parseClipboard, remapItems };

package/dist/board/editor/clipboard.js

@@ -0,0 +1,129 @@
+import { parseBoardItem } from "../../protocol/dist/board-model.js";
+import { arrowBindings, isArrowBinding } from "../../protocol/dist/board-layout.js";
+import { BOARD_CLIPBOARD_KIND, BOARD_CLIPBOARD_MIME } from "../../protocol/dist/board.js";
+import { createBoardItemId } from "../model/items/id.js";
+//#region src/board/editor/clipboard.ts
+/** How far a duplicate or repeated paste lands from its source. */
+const DUPLICATE_OFFSET = 24;
+const BOARD_CLIPBOARD_VERSION = 3;
+const MAX_CLIPBOARD_ITEMS = 2e3;
+const MAX_CLIPBOARD_CHARS = 4194304;
+function encodeClipboard(items, origin) {
+	const ids = Object.keys(items);
+	if (ids.length === 0 || ids.length > 2e3) return null;
+	return {
+		kind: BOARD_CLIPBOARD_KIND,
+		version: 3,
+		items: Object.fromEntries(ids.map((id) => {
+			const item = items[id];
+			return [id, item.parent && items[item.parent] ? item : shiftItem(item, -origin.x, -origin.y)];
+		})),
+		origin
+	};
+}
+function parseClipboard(raw) {
+	if (raw == null) return null;
+	if (typeof raw === "string") {
+		if (raw.length > 4194304) return null;
+		try {
+			raw = JSON.parse(raw);
+		} catch {
+			return null;
+		}
+	}
+	if (!raw || typeof raw !== "object") return null;
+	const record = raw;
+	if (record.kind !== "cohub.board.clipboard" || record.version !== 3) return null;
+	const origin = record.origin;
+	if (typeof origin?.x !== "number" || typeof origin.y !== "number" || !Number.isFinite(origin.x) || !Number.isFinite(origin.y)) return null;
+	if (!record.items || typeof record.items !== "object" || Array.isArray(record.items)) return null;
+	const entries = Object.entries(record.items);
+	if (entries.length === 0 || entries.length > 2e3) return null;
+	const items = {};
+	for (const [id, value] of entries) {
+		const parsed = parseBoardItem(value);
+		if (!parsed.ok) return null;
+		items[id] = parsed.item;
+	}
+	return {
+		kind: BOARD_CLIPBOARD_KIND,
+		version: 3,
+		items,
+		origin: {
+			x: origin.x,
+			y: origin.y
+		}
+	};
+}
+function materializeClipboard(payload, at, resolveEnd = () => null) {
+	const idMap = new Map(Object.keys(payload.items).map((id) => [id, createBoardItemId()]));
+	return remapItems(payload.items, idMap, (item) => item.parent && idMap.has(item.parent) ? item : shiftItem(item, at.x, at.y), resolveEnd);
+}
+function remapItems(items, idMap, place = (item) => item, resolveEnd = () => null) {
+	const result = {};
+	for (const [id, source] of Object.entries(items)) {
+		let item = place(source);
+		const { locked: _locked, ...unlocked } = item;
+		item = unlocked;
+		if (item.script) item = {
+			...item,
+			script: {
+				...item.script,
+				targets: Object.fromEntries(Object.entries(item.script.targets).map(([name, target]) => [name, idMap.get(target) ?? target]))
+			}
+		};
+		if (item.parent) {
+			const parent = idMap.get(item.parent);
+			if (parent) item = {
+				...item,
+				parent
+			};
+			else {
+				const { parent: _parent, ...root } = item;
+				item = root;
+			}
+		}
+		if (item.type === "arrow" && arrowBindings(item).length) {
+			const end = (which) => {
+				const value = item.type === "arrow" ? item.props[which] : null;
+				if (!value || !isArrowBinding(value)) return value;
+				const mapped = idMap.get(value.item);
+				if (mapped) return {
+					...value,
+					item: mapped
+				};
+				return resolveEnd(id, which) ?? {
+					x: 0,
+					y: 0
+				};
+			};
+			item = {
+				...item,
+				props: {
+					...item.props,
+					start: end("start"),
+					end: end("end")
+				}
+			};
+		}
+		result[idMap.get(id) ?? createBoardItemId()] = item;
+	}
+	return result;
+}
+function defaultPasteOffset(count = 1) {
+	return {
+		x: 24 * count,
+		y: 24 * count
+	};
+}
+function shiftItem(item, dx, dy) {
+	return {
+		...item,
+		position: {
+			x: item.position.x + dx,
+			y: item.position.y + dy
+		}
+	};
+}
+//#endregion
+export { BOARD_CLIPBOARD_MIME, BOARD_CLIPBOARD_VERSION, DUPLICATE_OFFSET, MAX_CLIPBOARD_CHARS, MAX_CLIPBOARD_ITEMS, defaultPasteOffset, encodeClipboard, materializeClipboard, parseClipboard, remapItems };

package/dist/board/editor/connection-ports.d.ts

@@ -0,0 +1,19 @@
+import { BoardAnchorSide } from "../../protocol/dist/board-model.js";
+import { BoardFrame } from "../../protocol/dist/board-layout.js";
+import { WorldPoint } from "../model/geometry.js";
+import "../model/index.js";
+//#region src/board/editor/connection-ports.d.ts
+declare const CONNECTION_SIDES: readonly BoardAnchorSide[];
+declare const CONNECTION_PORT_OFFSET = 14;
+declare const CONNECTION_PORT_RADIUS = 4;
+declare const CONNECTION_PORT_HIT_RADIUS = 11;
+declare const CONNECTION_PORT_TOUCH_HIT_RADIUS = 22;
+type ConnectionPort = {
+  side: BoardAnchorSide;
+  point: WorldPoint;
+};
+declare function portHitRadius(pointerType: string): number;
+declare function connectionPorts(frame: BoardFrame, zoom: number): ConnectionPort[];
+declare function connectionPortAt(frame: BoardFrame, point: WorldPoint, zoom: number, pointerType: string): ConnectionPort | null;
+//#endregion
+export { CONNECTION_PORT_HIT_RADIUS, CONNECTION_PORT_OFFSET, CONNECTION_PORT_RADIUS, CONNECTION_PORT_TOUCH_HIT_RADIUS, CONNECTION_SIDES, ConnectionPort, connectionPortAt, connectionPorts, portHitRadius };

package/dist/board/editor/connection-ports.js

@@ -0,0 +1,85 @@
+import { degToRad, frameRect, rectCenter, rotatePointAround, worldPoint } from "../model/geometry.js";
+//#region src/board/editor/connection-ports.ts
+const CONNECTION_SIDES = [
+	"top",
+	"right",
+	"bottom",
+	"left"
+];
+const CONNECTION_PORT_OFFSET = 14;
+const CONNECTION_PORT_RADIUS = 4;
+const CONNECTION_PORT_HIT_RADIUS = 11;
+const CONNECTION_PORT_TOUCH_HIT_RADIUS = 22;
+function portHitRadius(pointerType) {
+	return pointerType === "touch" || pointerType === "pen" ? 22 : 11;
+}
+const SIDE_NORMAL = {
+	top: {
+		x: 0,
+		y: -1
+	},
+	right: {
+		x: 1,
+		y: 0
+	},
+	bottom: {
+		x: 0,
+		y: 1
+	},
+	left: {
+		x: -1,
+		y: 0
+	}
+};
+const SIDE_ANCHOR = {
+	top: {
+		nx: .5,
+		ny: 0
+	},
+	right: {
+		nx: 1,
+		ny: .5
+	},
+	bottom: {
+		nx: .5,
+		ny: 1
+	},
+	left: {
+		nx: 0,
+		ny: .5
+	}
+};
+function connectionPorts(frame, zoom) {
+	const offset = 14 / Math.max(zoom, 1e-4);
+	const center = rectCenter(frameRect(frame));
+	const rotation = frame.rotation ? degToRad(frame.rotation) : 0;
+	return CONNECTION_SIDES.map((side) => {
+		const anchor = SIDE_ANCHOR[side];
+		const base = worldPoint(frame.x + anchor.nx * frame.width, frame.y + anchor.ny * frame.height);
+		const rotated = rotation ? rotatePointAround(base, center, rotation) : base;
+		const normal = SIDE_NORMAL[side];
+		const direction = rotation ? {
+			x: normal.x * Math.cos(rotation) - normal.y * Math.sin(rotation),
+			y: normal.x * Math.sin(rotation) + normal.y * Math.cos(rotation)
+		} : normal;
+		return {
+			side,
+			point: worldPoint(rotated.x + direction.x * offset, rotated.y + direction.y * offset)
+		};
+	});
+}
+function connectionPortAt(frame, point, zoom, pointerType) {
+	const radius = portHitRadius(pointerType) / Math.max(zoom, 1e-4);
+	let closest = null;
+	let closestDistance = Number.POSITIVE_INFINITY;
+	for (const port of connectionPorts(frame, zoom)) {
+		const distance = Math.hypot(port.point.x - point.x, port.point.y - point.y);
+		if (distance <= radius && distance < closestDistance) {
+			closest = port;
+			closestDistance = distance;
+		}
+	}
+	return closest;
+}
+//#endregion
+export { CONNECTION_PORT_HIT_RADIUS, CONNECTION_PORT_OFFSET, CONNECTION_PORT_RADIUS, CONNECTION_PORT_TOUCH_HIT_RADIUS, CONNECTION_SIDES, connectionPortAt, connectionPorts, portHitRadius };

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

@@ -0,0 +1,111 @@
+import { BoardDocument, BoardPatch, BoardSettings } from "../../protocol/dist/board-model.js";
+import { BoardViewport, WorldPoint } from "../model/geometry.js";
+import { BoardScene } from "../model/scene.js";
+import { BoardToolStyleMap } from "../model/tool-styles.js";
+import { BoardRegistry } from "../model/items/registry.js";
+import "../model/index.js";
+import { DocumentModule } from "./document.js";
+import { QueryModule } from "./query.js";
+import { CameraModule } from "./camera.js";
+import { SelectionModule } from "./selection.js";
+import { BoardInteraction, InteractionModule } from "./interaction.js";
+import { CreationModule } from "./creation.js";
+import { DeletionModule } from "./deletion.js";
+import { CopyModule } from "./copy.js";
+import { SnapshotsModule } from "./snapshots.js";
+import { RemoteModule } from "./remote.js";
+import { SnapGuide } from "./snapping.js";
+import { BoardEditorChannel, BoardEditorChannels } from "./state.js";
+import { BoardToolId } from "./tool.js";
+import { AnimationModule } from "./animation.js";
+//#region src/board/editor/context.d.ts
+type BoardCameraPolicy = "follow" | "free";
+type BoardPlayhead = {
+  animationId: string;
+  time: number;
+};
+type BoardUndoEntry = {
+  undo: BoardPatch;
+  redo: BoardPatch;
+};
+type BoardEditorState = {
+  base: BoardDocument;
+  settingsPreview: BoardSettings | null;
+  scene: BoardScene;
+  structureVersion: number;
+  geometryVersion: number;
+  selection: string[];
+  camera: BoardViewport;
+  surfaceSize: {
+    width: number;
+    height: number;
+  };
+  cameraPolicy: BoardCameraPolicy;
+  tool: BoardToolId;
+  toolStyles: BoardToolStyleMap;
+  interaction: BoardInteraction;
+  snapGuides: SnapGuide[];
+  spaceHeld: boolean;
+  hoverId: string | null;
+  hoverPoint: WorldPoint | null;
+  hoverPointerType: string;
+  editingId: string | null;
+  draftTextId: string | null;
+  playhead: BoardPlayhead | null;
+  recording: boolean;
+  undoStack: BoardUndoEntry[];
+  redoStack: BoardUndoEntry[];
+  saveError: string | null;
+  pendingCommits: number;
+};
+declare const STATE_CHANNELS: { readonly [K in keyof BoardEditorState]: BoardEditorChannel; };
+type BoardEditorPreferences = {
+  toolStyles: BoardToolStyleMap;
+  cameraPolicy: BoardCameraPolicy;
+};
+type BoardViewState = {
+  visibleRect: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+  } | null;
+  selectedNodes: Array<{
+    id: string;
+    type: string;
+    title?: string;
+  }>;
+};
+type BoardEditorOptions = {
+  document: BoardDocument;
+  registry?: BoardRegistry;
+  viewport?: BoardViewport;
+  initialTool?: BoardToolId;
+  key?: string;
+  readonly?: boolean;
+  preferences?: Partial<BoardEditorPreferences>;
+  onPreferencesChange?: (preferences: BoardEditorPreferences) => void;
+  onCommit: (patch: BoardPatch) => void | Promise<void>;
+  onViewStateChange?: (state: BoardViewState) => void;
+  track?: (channel: BoardEditorChannel) => void;
+};
+type EditorContext = {
+  readonly options: BoardEditorOptions;
+  readonly registry: BoardRegistry;
+  readonly state: BoardEditorState;
+  readonly channels: BoardEditorChannels;
+  preferencesChanged(): void;
+  document: DocumentModule;
+  query: QueryModule;
+  camera: CameraModule;
+  selection: SelectionModule;
+  creation: CreationModule;
+  deletion: DeletionModule;
+  copy: CopyModule;
+  interaction: InteractionModule;
+  animation: AnimationModule;
+  snapshots: SnapshotsModule;
+  remote: RemoteModule;
+};
+//#endregion
+export { BoardCameraPolicy, BoardEditorOptions, BoardEditorPreferences, BoardEditorState, BoardPlayhead, BoardUndoEntry, BoardViewState, EditorContext, STATE_CHANNELS };

package/dist/board/editor/context.js

@@ -0,0 +1,30 @@
+//#region src/board/editor/context.ts
+const STATE_CHANNELS = {
+	base: "document",
+	settingsPreview: "document",
+	scene: "scene",
+	structureVersion: "scene",
+	geometryVersion: "scene",
+	selection: "selection",
+	camera: "camera",
+	surfaceSize: "camera",
+	cameraPolicy: "camera",
+	tool: "tool",
+	toolStyles: "tool",
+	interaction: "interaction",
+	snapGuides: "interaction",
+	spaceHeld: "interaction",
+	hoverId: "hover",
+	hoverPoint: "hover",
+	hoverPointerType: "hover",
+	editingId: "editing",
+	draftTextId: "editing",
+	playhead: "playback",
+	recording: "playback",
+	undoStack: "history",
+	redoStack: "history",
+	saveError: "status",
+	pendingCommits: "status"
+};
+//#endregion
+export { STATE_CHANNELS };

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

@@ -0,0 +1,17 @@
+import { BoardItem } from "../../protocol/dist/board-model.js";
+import { WorldPoint } from "../model/geometry.js";
+import "../model/index.js";
+import { BoardClipboardPayload } from "./clipboard.js";
+import { EditorContext } from "./context.js";
+//#region src/board/editor/copy.d.ts
+declare function createCopyModule(ctx: EditorContext): {
+  duplicates: (ids: string[], offset: number) => Map<string, BoardItem>;
+  rootsOfCopies: (copies: ReadonlyMap<string, BoardItem>) => string[];
+  duplicateSelection: () => void;
+  copySelection: () => BoardClipboardPayload | null;
+  cutSelection: () => BoardClipboardPayload | null;
+  pasteClipboard: (raw?: unknown, at?: WorldPoint) => void;
+};
+type CopyModule = ReturnType<typeof createCopyModule>;
+//#endregion
+export { CopyModule, createCopyModule };

package/dist/board/editor/copy.js

@@ -0,0 +1,121 @@
+import { applyMatrix, arrowBindings, invertMatrix } from "../../protocol/dist/board-layout.js";
+import { resolveSceneArrow } from "../model/arrow-geometry.js";
+import { createBoardItemId } from "../model/items/id.js";
+import { defaultPasteOffset, encodeClipboard, materializeClipboard, parseClipboard, remapItems } from "./clipboard.js";
+//#region src/board/editor/copy.ts
+function createCopyModule(ctx) {
+	const { state, options } = ctx;
+	let internalClipboard = null;
+	let pasteCount = 0;
+	function detachedSubtrees(ids, scene) {
+		const items = {};
+		for (const root of ctx.query.rootsOf(ids)) {
+			const item = scene.get(root);
+			if (!item || !state.base.items[root]) continue;
+			const { id: _id, frame, ...stored } = item;
+			items[root] = ctx.document.reparent(stored, frame, void 0, scene.layout.box(root));
+			for (const child of scene.descendants(root)) {
+				if (!state.base.items[child]) continue;
+				const shown = scene.get(child);
+				if (shown) {
+					const { id: _id, frame: _frame, ...value } = shown;
+					items[child] = value;
+				}
+			}
+		}
+		return items;
+	}
+	function arrowEndPoint(scene, id, which) {
+		const arrow = scene.get(id);
+		if (arrow?.type !== "arrow") return null;
+		const resolved = resolveSceneArrow(arrow, scene);
+		return applyMatrix(invertMatrix(scene.layout.matrix(id)), (which === "start" ? resolved.start : resolved.end).point);
+	}
+	function duplicates(ids, offset) {
+		const scene = ctx.document.copyScene();
+		const copied = detachedSubtrees(ids, scene);
+		for (const id of Object.keys(copied)) for (const arrowId of scene.binders(id)) {
+			if (!state.base.items[arrowId]) continue;
+			const shown = scene.get(arrowId);
+			if (copied[arrowId] || !shown || !arrowBindings(shown).every((bound) => copied[bound])) continue;
+			const { id: _id, frame, ...arrow } = shown;
+			copied[arrowId] = ctx.document.reparent(arrow, frame, void 0, scene.layout.box(arrowId));
+		}
+		const idMap = new Map(Object.keys(copied).map((id) => [id, createBoardItemId()]));
+		const moved = remapItems(copied, idMap, (item) => item.parent && copied[item.parent] ? item : {
+			...item,
+			position: {
+				x: item.position.x + offset,
+				y: item.position.y + offset
+			}
+		}, (id, which) => arrowEndPoint(scene, id, which));
+		let z = ctx.document.topZ(void 0, scene);
+		return new Map(Object.entries(moved).map(([id, item]) => [id, item.parent ? item : {
+			...item,
+			z: z++
+		}]));
+	}
+	function rootsOfCopies(copies) {
+		return [...copies].filter(([, item]) => !item.parent || !copies.has(item.parent)).map(([id]) => id);
+	}
+	function duplicateSelection() {
+		if (options.readonly || state.selection.length === 0) return;
+		const copies = duplicates(state.selection, 24);
+		if (copies.size === 0) return;
+		const roots = rootsOfCopies(copies);
+		ctx.document.markAdded(roots);
+		state.selection = roots;
+		ctx.document.commitItems(copies);
+	}
+	function copySelection() {
+		const { selection } = state;
+		if (selection.length === 0) return null;
+		const scene = ctx.document.copyScene();
+		const copied = detachedSubtrees(selection, scene);
+		const origin = ctx.query.contentBounds(ctx.query.rootsOf(selection), scene);
+		const payload = origin ? encodeClipboard(copied, {
+			x: origin.x,
+			y: origin.y
+		}) : null;
+		if (payload) {
+			internalClipboard = payload;
+			pasteCount = 0;
+		}
+		return payload;
+	}
+	function cutSelection() {
+		const payload = copySelection();
+		if (payload) ctx.deletion.deleteSelection();
+		return payload;
+	}
+	function pasteClipboard(raw, at) {
+		if (options.readonly) return;
+		const parsed = parseClipboard(raw) ?? (raw == null ? parseClipboard(internalClipboard) : null);
+		if (!parsed) return;
+		pasteCount += 1;
+		const offset = at ?? {
+			x: parsed.origin.x + defaultPasteOffset(pasteCount).x,
+			y: parsed.origin.y + defaultPasteOffset(pasteCount).y
+		};
+		const pasted = materializeClipboard(parsed, offset);
+		const entries = Object.entries(pasted).map(([id, item]) => ({
+			id,
+			item
+		}));
+		const roots = entries.filter(({ item }) => !item.parent).map(({ id }) => id);
+		const changes = ctx.creation.placeNew(entries);
+		ctx.document.markAdded(roots);
+		state.selection = roots;
+		ctx.document.commitItems(changes);
+	}
+	return {
+		duplicates,
+		rootsOfCopies,
+		duplicateSelection,
+		copySelection,
+		cutSelection,
+		pasteClipboard
+	};
+}
+//#endregion
+export { createCopyModule };