@neta-art/cohub 8.23.0 → 9.0.0

package/dist/board/core/arrow-geometry.d.ts

@@ -1,23 +1,38 @@
-import { BoardArrowItem, BoardFrame } from "../../protocol/dist/board-document.js";
+import { BoardArrowAnchor, BoardArrowItem } from "../../protocol/dist/board-model.js";
+import { BoardFrame, BoardLayout, BoardMatrix } from "../../protocol/dist/board-layout.js";
+import "../../protocol/dist/index.js";
 import { Rect, WorldPoint } from "../geometry.js";
 //#region src/board/core/arrow-geometry.d.ts
+declare const ARROW_BINDING_GAP = 4;
+type ResolvedArrowEnd = {
+  point: WorldPoint;
+  normal: WorldPoint;
+  item?: string;
+};
 type ResolvedArrow = {
-  start: WorldPoint;
-  end: WorldPoint;
-  /** Quadratic control point (already bent); the midpoint when bend is 0. */
-  control: WorldPoint;
+  start: ResolvedArrowEnd;
+  end: ResolvedArrowEnd;
+  path: WorldPoint[];
+  mid: WorldPoint;
+};
+type ArrowFrameLookup = (id: string) => BoardFrame | undefined;
+declare function resolveAnchor(anchor: BoardArrowAnchor, frame: BoardFrame, toward: WorldPoint, gap?: number): {
+  point: WorldPoint;
+  normal: WorldPoint;
 };
-/** Resolve an arrow's endpoints and its bent control point. */
-declare function resolveArrow(item: BoardArrowItem): ResolvedArrow;
-/** Sample an arrow's quadratic curve into world points. */
-declare function sampleArrow(resolved: ResolvedArrow, segments: number): WorldPoint[];
-/** World bounds of an arrow, padded for its stroke. */
-declare function arrowBounds(item: BoardArrowItem): Rect;
-/** The frame an arrow should carry, derived from its endpoints. */
-declare function arrowFrame(item: BoardArrowItem): BoardFrame;
-/** Distance from a world point to an arrow's curve (hit testing). */
-declare function distanceToArrow(item: BoardArrowItem, point: WorldPoint): number;
-/** Translate an arrow by a delta, keeping its frame consistent. */
-declare function translateArrow(item: BoardArrowItem, dx: number, dy: number): BoardArrowItem;
+declare function resolveArrow(item: BoardArrowItem, matrix: BoardMatrix, getFrame: ArrowFrameLookup): ResolvedArrow;
+declare function resolveSceneArrow(item: BoardArrowItem & {
+  id: string;
+}, scene: {
+  layout: BoardLayout;
+  get(id: string): {
+    frame: BoardFrame;
+  } | undefined;
+}): ResolvedArrow;
+declare function pathMidpoint(path: readonly WorldPoint[]): WorldPoint;
+declare function pathPointAt(path: readonly WorldPoint[], fraction: number): WorldPoint;
+declare function arrowPathBounds(resolved: ResolvedArrow, strokeWidth?: number): Rect;
+declare function distanceToArrow(resolved: ResolvedArrow, point: WorldPoint): number;
+declare function arrowHitRadius(strokeWidth?: number): number;
 //#endregion
-export { ResolvedArrow, arrowBounds, arrowFrame, distanceToArrow, resolveArrow, sampleArrow, translateArrow };
+export { ARROW_BINDING_GAP, ArrowFrameLookup, ResolvedArrow, ResolvedArrowEnd, arrowHitRadius, arrowPathBounds, distanceToArrow, pathMidpoint, pathPointAt, resolveAnchor, resolveArrow, resolveSceneArrow };

package/dist/board/core/arrow-geometry.js

@@ -1,48 +1,283 @@
-import { boardArrowBounds, boardArrowFrame, boardResolveArrow, boardSampleResolvedArrow } from "../../protocol/dist/board-geometry.js";
+import { BOARD_ARROW_STROKE_SIZE } from "../../protocol/dist/board-constants.js";
+import { applyMatrix, autoAnchorSide, bendControl, framePoint, isArrowBinding, sideAnchor } from "../../protocol/dist/board-layout.js";
 import { worldPoint } from "../geometry.js";
 //#region src/board/core/arrow-geometry.ts
-/**
-* Free-arrow geometry.
-*
-* An arrow is a standalone annotation stroke between two world points — it does
-* not relate nodes. Node relations are `BoardConnection`s, which resolve their
-* geometry from the nodes they join (see ./connections). Keeping the two apart is
-* what makes each one simple: an arrow owns absolute coordinates and needs no
-* lookup, while a connection owns no coordinates at all.
-*/
-/** Resolve an arrow's endpoints and its bent control point. */
-function resolveArrow(item) {
-	const resolved = boardResolveArrow(item);
+const ARROW_BINDING_GAP = 4;
+const CURVE_SEGMENTS = 20;
+const ORTHOGONAL_SNAP = .5;
+const SIDE_NORMALS = {
+	top: worldPoint(0, -1),
+	right: worldPoint(1, 0),
+	bottom: worldPoint(0, 1),
+	left: worldPoint(-1, 0)
+};
+function rotate(vector, degrees) {
+	if (!degrees) return vector;
+	const radians = degrees * Math.PI / 180;
+	const cos = Math.cos(radians);
+	const sin = Math.sin(radians);
+	return worldPoint(vector.x * cos - vector.y * sin, vector.x * sin + vector.y * cos);
+}
+function nearestSide(x, y) {
+	const distances = [
+		["left", x],
+		["right", 1 - x],
+		["top", y],
+		["bottom", 1 - y]
+	];
+	distances.sort((a, b) => a[1] - b[1]);
+	return distances[0]?.[0] ?? "right";
+}
+function center(frame) {
+	return worldPoint(frame.x + frame.width / 2, frame.y + frame.height / 2);
+}
+function resolveAnchor(anchor, frame, toward, gap = 4) {
+	let side;
+	let normalized;
+	if (anchor === "auto") {
+		side = autoAnchorSide(frame, toward);
+		normalized = sideAnchor(side, .5);
+	} else if ("side" in anchor) {
+		side = anchor.side;
+		normalized = sideAnchor(side, anchor.offset);
+	} else {
+		normalized = anchor;
+		side = nearestSide(anchor.x, anchor.y);
+	}
+	const base = framePoint(frame, normalized.x, normalized.y);
+	const normal = rotate(SIDE_NORMALS[side], frame.rotation);
 	return {
-		start: worldPoint(resolved.start.x, resolved.start.y),
-		end: worldPoint(resolved.end.x, resolved.end.y),
-		control: worldPoint(resolved.control.x, resolved.control.y)
+		point: worldPoint(base.x + normal.x * gap, base.y + normal.y * gap),
+		normal
 	};
 }
-/** Sample an arrow's quadratic curve into world points. */
-function sampleArrow(resolved, segments) {
-	return boardSampleResolvedArrow(resolved, segments).map((point) => worldPoint(point.x, point.y));
+function toWorld(matrix, point) {
+	const mapped = applyMatrix(matrix, point);
+	return worldPoint(mapped.x, mapped.y);
 }
-/** World bounds of an arrow, padded for its stroke. */
-function arrowBounds(item) {
-	return boardArrowBounds(item);
+function resolveEnd(end, other, matrix, getFrame) {
+	const origin = toWorld(matrix, {
+		x: 0,
+		y: 0
+	});
+	const otherPoint = (() => {
+		if (!isArrowBinding(other)) return toWorld(matrix, other);
+		const frame = getFrame(other.item);
+		return frame ? center(frame) : origin;
+	})();
+	if (isArrowBinding(end)) {
+		const frame = getFrame(end.item);
+		if (frame) return {
+			...resolveAnchor(end.anchor, frame, otherPoint),
+			item: end.item
+		};
+	}
+	const point = isArrowBinding(end) ? origin : toWorld(matrix, end);
+	const dx = point.x - otherPoint.x;
+	const dy = point.y - otherPoint.y;
+	const length = Math.hypot(dx, dy) || 1;
+	return {
+		point,
+		normal: worldPoint(dx / length, dy / length)
+	};
 }
-/** The frame an arrow should carry, derived from its endpoints. */
-function arrowFrame(item) {
-	return boardArrowFrame(item);
+function quadratic(start, control, end) {
+	const out = [];
+	for (let index = 0; index <= CURVE_SEGMENTS; index += 1) {
+		const t = index / CURVE_SEGMENTS;
+		const mt = 1 - t;
+		out.push(worldPoint(mt * mt * start.x + 2 * mt * t * control.x + t * t * end.x, mt * mt * start.y + 2 * mt * t * control.y + t * t * end.y));
+	}
+	return out;
 }
-/** Distance from a world point to an arrow's curve (hit testing). */
-function distanceToArrow(item, point) {
-	const samples = sampleArrow(resolveArrow(item), 16);
-	let min = Number.POSITIVE_INFINITY;
-	for (let index = 0; index < samples.length - 1; index += 1) {
-		const from = samples[index];
-		const to = samples[index + 1];
-		if (!from || !to) continue;
-		const distance = segmentDistance(point, from, to);
-		if (distance < min) min = distance;
+function orthogonal(start, end) {
+	const horizontalStart = Math.abs(start.normal.x) > Math.abs(start.normal.y);
+	const horizontalEnd = Math.abs(end.normal.x) > Math.abs(end.normal.y);
+	const a = start.point;
+	const b = end.point;
+	if (horizontalStart && horizontalEnd) {
+		const midX = a.x + (b.x - a.x) * ORTHOGONAL_SNAP;
+		return [
+			a,
+			worldPoint(midX, a.y),
+			worldPoint(midX, b.y),
+			b
+		];
 	}
-	return min;
+	if (!horizontalStart && !horizontalEnd) {
+		const midY = a.y + (b.y - a.y) * ORTHOGONAL_SNAP;
+		return [
+			a,
+			worldPoint(a.x, midY),
+			worldPoint(b.x, midY),
+			b
+		];
+	}
+	return horizontalStart ? [
+		a,
+		worldPoint(b.x, a.y),
+		b
+	] : [
+		a,
+		worldPoint(a.x, b.y),
+		b
+	];
+}
+function curveControl(start, end, bend) {
+	if (bend) return bendControl(start.point, end.point, bend);
+	const mid = worldPoint((start.point.x + end.point.x) / 2, (start.point.y + end.point.y) / 2);
+	const normals = [start, end].filter((entry) => entry.item).map((entry) => entry.normal);
+	if (!normals.length) return mid;
+	const nx = normals.reduce((sum, normal) => sum + normal.x, 0) / normals.length;
+	const ny = normals.reduce((sum, normal) => sum + normal.y, 0) / normals.length;
+	const magnitude = Math.hypot(nx, ny);
+	if (magnitude < 1e-4) return mid;
+	const length = Math.hypot(end.point.x - start.point.x, end.point.y - start.point.y);
+	const strength = Math.min(length * .18, 96);
+	return worldPoint(mid.x + nx / magnitude * strength, mid.y + ny / magnitude * strength);
+}
+function selfLoop(frame) {
+	const size = Math.max(Math.min(frame.width, frame.height) * .45, 24);
+	const right = frame.x + frame.width + 4;
+	const top = frame.y - 4;
+	const midY = frame.y + frame.height * .3;
+	const midX = frame.x + frame.width * .7;
+	return [
+		worldPoint(midX, top),
+		worldPoint(midX, top - size),
+		worldPoint(right + size, top - size),
+		worldPoint(right + size, midY),
+		worldPoint(right, midY)
+	];
+}
+function resolveArrow(item, matrix, getFrame) {
+	const { props } = item;
+	if (isArrowBinding(props.start) && isArrowBinding(props.end) && props.start.item === props.end.item) {
+		const frame = getFrame(props.start.item);
+		if (frame) {
+			const path = selfLoop(frame);
+			const first = path[0];
+			const last = path[path.length - 1];
+			return {
+				start: {
+					point: first,
+					normal: worldPoint(0, -1),
+					item: props.start.item
+				},
+				end: {
+					point: last,
+					normal: worldPoint(1, 0),
+					item: props.end.item
+				},
+				path,
+				mid: path[2]
+			};
+		}
+	}
+	const start = resolveEnd(props.start, props.end, matrix, getFrame);
+	const end = resolveEnd(props.end, props.start, matrix, getFrame);
+	let path;
+	if (props.waypoints.length) path = [
+		start.point,
+		...props.waypoints.map((point) => toWorld(matrix, point)),
+		end.point
+	];
+	else if (props.route === "orthogonal") path = orthogonal(start, end);
+	else if (props.route === "straight" && !props.bend) path = [start.point, end.point];
+	else path = quadratic(start.point, curveControl(start, end, props.bend), end.point);
+	return {
+		start,
+		end,
+		path,
+		mid: pathMidpoint(path)
+	};
+}
+function resolveSceneArrow(item, scene) {
+	const getFrame = (id) => scene.get(id)?.frame;
+	const matrix = scene.layout.matrix(item.id);
+	const key = arrowKey(item, matrix, getFrame);
+	const cached = resolvedCache.get(item);
+	if (cached && cached.key === key) return cached.resolved;
+	const resolved = resolveArrow(item, matrix, getFrame);
+	resolvedCache.set(item, {
+		key,
+		resolved
+	});
+	return resolved;
+}
+const resolvedCache = /* @__PURE__ */ new WeakMap();
+function frameKey(frame) {
+	return frame ? `${frame.x},${frame.y},${frame.width},${frame.height},${frame.rotation}` : "-";
+}
+function arrowKey(item, matrix, getFrame) {
+	const { start, end } = item.props;
+	return `${matrix.join(",")}|${isArrowBinding(start) ? frameKey(getFrame(start.item)) : ""}|${isArrowBinding(end) ? frameKey(getFrame(end.item)) : ""}`;
+}
+function pathMidpoint(path) {
+	if (path.length === 0) return worldPoint(0, 0);
+	if (path.length === 1) return path[0];
+	let total = 0;
+	for (let index = 0; index < path.length - 1; index += 1) {
+		const from = path[index];
+		const to = path[index + 1];
+		total += Math.hypot(to.x - from.x, to.y - from.y);
+	}
+	let travelled = 0;
+	const half = total / 2;
+	for (let index = 0; index < path.length - 1; index += 1) {
+		const from = path[index];
+		const to = path[index + 1];
+		const segment = Math.hypot(to.x - from.x, to.y - from.y);
+		if (travelled + segment >= half) {
+			const t = segment > 0 ? (half - travelled) / segment : 0;
+			return worldPoint(from.x + (to.x - from.x) * t, from.y + (to.y - from.y) * t);
+		}
+		travelled += segment;
+	}
+	return path[path.length - 1];
+}
+function pathPointAt(path, fraction) {
+	if (path.length < 2) return path[0] ?? worldPoint(0, 0);
+	const lengths = [];
+	let total = 0;
+	for (let index = 0; index < path.length - 1; index += 1) {
+		const from = path[index];
+		const to = path[index + 1];
+		const length = Math.hypot(to.x - from.x, to.y - from.y);
+		lengths.push(length);
+		total += length;
+	}
+	let remaining = Math.min(1, Math.max(0, fraction)) * total;
+	for (let index = 0; index < lengths.length; index += 1) {
+		const length = lengths[index];
+		if (remaining <= length) {
+			const from = path[index];
+			const to = path[index + 1];
+			const t = length > 0 ? remaining / length : 0;
+			return worldPoint(from.x + (to.x - from.x) * t, from.y + (to.y - from.y) * t);
+		}
+		remaining -= length;
+	}
+	return path[path.length - 1];
+}
+function arrowPathBounds(resolved, strokeWidth = BOARD_ARROW_STROKE_SIZE) {
+	let minX = Number.POSITIVE_INFINITY;
+	let minY = Number.POSITIVE_INFINITY;
+	let maxX = Number.NEGATIVE_INFINITY;
+	let maxY = Number.NEGATIVE_INFINITY;
+	for (const point of resolved.path) {
+		minX = Math.min(minX, point.x);
+		minY = Math.min(minY, point.y);
+		maxX = Math.max(maxX, point.x);
+		maxY = Math.max(maxY, point.y);
+	}
+	const pad = Math.max(8, strokeWidth * 2);
+	return {
+		x: minX - pad,
+		y: minY - pad,
+		width: Math.max(1, maxX - minX + pad * 2),
+		height: Math.max(1, maxY - minY + pad * 2)
+	};
 }
 function segmentDistance(p, a, b) {
 	const dx = b.x - a.x;
@@ -52,21 +287,17 @@ function segmentDistance(p, a, b) {
 	const t = Math.min(1, Math.max(0, ((p.x - a.x) * dx + (p.y - a.y) * dy) / lengthSq));
 	return Math.hypot(p.x - (a.x + t * dx), p.y - (a.y + t * dy));
 }
-/** Translate an arrow by a delta, keeping its frame consistent. */
-function translateArrow(item, dx, dy) {
-	const move = (point) => ({
-		x: point.x + dx,
-		y: point.y + dy
-	});
-	const next = {
-		...item,
-		start: move(item.start),
-		end: move(item.end)
-	};
-	return {
-		...next,
-		frame: arrowFrame(next)
-	};
+function distanceToArrow(resolved, point) {
+	let min = Number.POSITIVE_INFINITY;
+	for (let index = 0; index < resolved.path.length - 1; index += 1) {
+		const from = resolved.path[index];
+		const to = resolved.path[index + 1];
+		if (from && to) min = Math.min(min, segmentDistance(point, from, to));
+	}
+	return min;
+}
+function arrowHitRadius(strokeWidth = BOARD_ARROW_STROKE_SIZE) {
+	return Math.max(8, strokeWidth * 2.5);
 }
 //#endregion
-export { arrowBounds, arrowFrame, distanceToArrow, resolveArrow, sampleArrow, translateArrow };
+export { ARROW_BINDING_GAP, arrowHitRadius, arrowPathBounds, distanceToArrow, pathMidpoint, pathPointAt, resolveAnchor, resolveArrow, resolveSceneArrow };

package/dist/board/core/draw-geometry.d.ts

@@ -1,49 +1,35 @@
-import { DrawPoint } from "../../protocol/dist/board-document.js";
-import { boardDrawBounds, boardDrawSampleRadius } from "../../protocol/dist/board-geometry.js";
+import { BoardDrawPoint } from "../../protocol/dist/board-model.js";
+import { drawPointsBounds, drawSampleRadius } from "../../protocol/dist/board-layout.js";
 import "../../protocol/dist/index.js";
 import { WorldPoint } from "../geometry.js";
 //#region src/board/core/draw-geometry.d.ts
-/** Radius of a sample in world units given the stroke size and pressure. */
-declare const sampleRadius: typeof boardDrawSampleRadius;
-/** Axis-aligned bounds of a stroke in its local space, padded by stroke width. */
-declare const computeDrawBounds: typeof boardDrawBounds;
-/**
- * Ramer–Douglas–Peucker simplification. Reduces point count for low-zoom
- * rendering without touching the persisted raw samples. Returns indices into
- * the input so callers can keep pressure alongside the simplified path.
- */
-declare function simplifyDrawIndices(points: DrawPoint[], tolerance: number): number[];
-/**
- * Build a closed outline for callers that need a path representation.
- * Interactive rendering uses `buildStrokeRibbonGeometry` below because a single
- * outline is unsafe when a freehand path folds back over itself.
- */
-declare function buildStrokeOutline(points: DrawPoint[], size: number): Array<{
+declare const sampleRadius: typeof drawSampleRadius;
+declare const computeDrawBounds: typeof drawPointsBounds;
+declare function simplifyDrawIndices(points: BoardDrawPoint[], tolerance: number): number[];
+declare function trimDrawPoints(points: readonly BoardDrawPoint[], trim: number | undefined): readonly BoardDrawPoint[];
+declare function buildStrokeOutline(points: BoardDrawPoint[], size: number): Array<{
   x: number;
   y: number;
 }>;
-/** Whether a sample needs a round join rather than the neighboring segment caps. */
-declare function isStrokeCorner(points: readonly DrawPoint[], index: number): boolean;
+declare function isStrokeCorner(points: readonly BoardDrawPoint[], index: number): boolean;
 type StrokeRibbonGeometry = {
   positions: Float32Array;
   indices: Uint32Array;
   uvs: Float32Array;
-  /** Normalized distance along the centerline for reveal animations. */
   progress: Float32Array;
 };
-/**
- * Tessellate a freehand stroke as independent, convex primitives.
- *
- * A whole-path polygon is deliberately avoided: a path that folds back can make
- * its outline self-intersect, and GPU polygon triangulation then creates a large
- * accidental fill. Segment quads plus round point joins overlap safely instead.
- */
-declare function buildStrokeRibbonGeometry(points: readonly DrawPoint[], size: number): StrokeRibbonGeometry;
-/**
- * Distance from a world point to the stroke's polyline, in the shape's local
- * space. Used for hit testing: a hit registers within half the stroke width plus
- * a small tolerance. `local` is the point expressed in the draw item's frame.
- */
-declare function distanceToStroke(points: DrawPoint[], local: WorldPoint): number;
+type StrokeRibbonMesh = {
+  positions: Float32Array;
+  indices: Uint32Array;
+  distances: Float32Array;
+  length: number;
+};
+type StrokeRibbonBuilder = {
+  build(points: readonly BoardDrawPoint[]): StrokeRibbonMesh;
+};
+/** A growing stroke re-emits only its last two samples. */
+declare function createStrokeRibbonBuilder(size: number): StrokeRibbonBuilder;
+declare function buildStrokeRibbonGeometry(points: readonly BoardDrawPoint[], size: number): StrokeRibbonGeometry;
+declare function distanceToStroke(points: BoardDrawPoint[], local: WorldPoint): number;
 //#endregion
-export { StrokeRibbonGeometry, buildStrokeOutline, buildStrokeRibbonGeometry, computeDrawBounds, distanceToStroke, isStrokeCorner, sampleRadius, simplifyDrawIndices };
+export { StrokeRibbonBuilder, StrokeRibbonGeometry, StrokeRibbonMesh, buildStrokeOutline, buildStrokeRibbonGeometry, computeDrawBounds, createStrokeRibbonBuilder, distanceToStroke, isStrokeCorner, sampleRadius, simplifyDrawIndices, trimDrawPoints };