@neta-art/cohub 5.3.3 → 5.4.1

package/dist/board/core/tool-styles.js

@@ -1,9 +1,7 @@
-import { BOARD_ARROW_STROKE_SIZE } from "../../protocol/dist/board-constants.js";
+import { BOARD_ARROW_STROKE_SIZE, BOARD_CONNECTION_STROKE_SIZE, BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, clampBoardStrokeSize } from "../../protocol/dist/board-constants.js";
 import { isBoardColorId } from "./palette.js";
 import { isGeoKind } from "./shape-types.js";
 //#region src/board/core/tool-styles.ts
-const BOARD_STROKE_MIN_SIZE = 1;
-const BOARD_STROKE_MAX_SIZE = 64;
 const DEFAULT_BOARD_TOOL_STYLES = {
 	text: { color: "neutral" },
 	geo: {
@@ -18,18 +16,20 @@ const DEFAULT_BOARD_TOOL_STYLES = {
 		color: "brand",
 		size: BOARD_ARROW_STROKE_SIZE
 	},
+	connection: {
+		color: "neutral",
+		size: BOARD_CONNECTION_STROKE_SIZE
+	},
 	frame: { color: "neutral" }
 };
 function finiteOr(value, fallback) {
 	return typeof value === "number" && Number.isFinite(value) ? value : fallback;
 }
-function clampBoardStrokeSize(size) {
-	return Math.min(64, Math.max(1, size));
-}
 /** Return a mutable, validated style map for an editor or another Board client. */
 function createBoardToolStyles(patch = {}) {
 	const drawSize = clampBoardStrokeSize(finiteOr(patch.draw?.size, DEFAULT_BOARD_TOOL_STYLES.draw.size));
 	const arrowSize = clampBoardStrokeSize(finiteOr(patch.arrow?.size, DEFAULT_BOARD_TOOL_STYLES.arrow.size));
+	const connectionSize = clampBoardStrokeSize(finiteOr(patch.connection?.size, DEFAULT_BOARD_TOOL_STYLES.connection.size));
 	return {
 		text: { color: isBoardColorId(patch.text?.color) ? patch.text.color : DEFAULT_BOARD_TOOL_STYLES.text.color },
 		geo: {
@@ -44,6 +44,10 @@ function createBoardToolStyles(patch = {}) {
 			color: isBoardColorId(patch.arrow?.color) ? patch.arrow.color : DEFAULT_BOARD_TOOL_STYLES.arrow.color,
 			size: arrowSize
 		},
+		connection: {
+			color: isBoardColorId(patch.connection?.color) ? patch.connection.color : DEFAULT_BOARD_TOOL_STYLES.connection.color,
+			size: connectionSize
+		},
 		frame: { color: isBoardColorId(patch.frame?.color) ? patch.frame.color : DEFAULT_BOARD_TOOL_STYLES.frame.color }
 	};
 }

package/dist/board/export/index.js

@@ -34,6 +34,7 @@ function renderBoardExport(renderer, input, options = {}) {
 	const scene = createBoardExportScene({
 		document,
 		items: plan.items,
+		connections: plan.connections,
 		world: plan.world,
 		scale: plan.scale,
 		colorScheme,

package/dist/board/export/scene.d.ts

@@ -1,3 +1,4 @@
+import { BoardConnection } from "../../protocol/dist/board-connection.js";
 import { BoardDocument, BoardItem } from "../../protocol/dist/board-document.js";
 import { Rect } from "../geometry.js";
 import { BoardShapeColors } from "../core/palette.js";
@@ -9,6 +10,8 @@ type BoardExportSceneInput = {
   document: BoardDocument;
   /** Items to draw, in document (z) order. */
   items: BoardItem[];
+  /** Connections to draw. Rendered beneath the cards, as in the editor. */
+  connections?: readonly BoardConnection[];
   /** World rect being captured; content is translated so it starts at 0,0. */
   world: Rect;
   /** Output pixels per world unit. Drives text rasterisation resolution. */

package/dist/board/export/scene.js

@@ -1,5 +1,6 @@
 import { imageAssetKey } from "../image-key.js";
 import { buildFallbackShapeColors } from "../core/palette.js";
+import { createConnectionLayer } from "../render/connection-layer.js";
 import { defaultBoardPalette } from "../render/palette.js";
 import { getBoardCardRenderer } from "../render/renderers/board-renderer-registry.js";
 import { Container, Graphics } from "pixi.js";
@@ -54,6 +55,19 @@ function createBoardExportScene(input) {
 	});
 	world.scale.set(input.scale);
 	world.position.set(-input.world.x * input.scale, -input.world.y * input.scale);
+	const connections = input.connections ?? input.document.connections;
+	let connectionLayer = null;
+	if (connections.length > 0) {
+		const frames = new Map(input.document.items.map((item) => [item.id, item.frame]));
+		connectionLayer = createConnectionLayer({ parent: world });
+		connectionLayer.sync({
+			connections,
+			getFrame: (id) => frames.get(id),
+			colors: context.colors,
+			colorScheme: input.colorScheme,
+			zoom: input.scale
+		});
+	}
 	for (const item of input.items) {
 		const renderer = getBoardCardRenderer(item, context);
 		world.addChild(renderer.create(item, context));
@@ -62,7 +76,10 @@ function createBoardExportScene(input) {
 	return {
 		root,
 		missingImageKeys: [...missing],
-		destroy: () => root.destroy({ children: true })
+		destroy: () => {
+			connectionLayer?.destroy();
+			root.destroy({ children: true });
+		}
 	};
 }
 //#endregion

package/dist/board/index.d.ts

@@ -1,17 +1,20 @@
+import { BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, clampBoardStrokeSize } from "../protocol/dist/board-constants.js";
+import { AUTO_BOARD_CONNECTION_ANCHOR, BOARD_CONNECTION_DIRECTIONS, BOARD_CONNECTION_LINES, BOARD_CONNECTION_ROUTINGS, BOARD_CONNECTION_SIDES, BoardConnection, BoardConnectionAnchor, BoardConnectionAnchorSchema, BoardConnectionDirection, BoardConnectionEndpoint, BoardConnectionEndpointSchema, BoardConnectionInput, BoardConnectionLine, BoardConnectionPatch, BoardConnectionPatchSchema, BoardConnectionRecord, BoardConnectionRouting, BoardConnectionRoutingConfig, BoardConnectionRoutingSchema, BoardConnectionSchema, BoardConnectionSide, BoardConnectionStyle, BoardConnectionStyleSchema, BoardConnectionWaypointSchema, BoardRelationSchema, DEFAULT_BOARD_CONNECTION_ROUTING, DEFAULT_BOARD_CONNECTION_STYLE, DEFAULT_BOARD_RELATION, connectionNodeIds, connectionOtherNodeId, connectionTouchesNode, createBoardConnection, flipBoardConnection, normalizeBoardConnectionStyle } from "../protocol/dist/board-connection.js";
 import { BOARD_DOCUMENT_KIND, BOARD_EXTENSION, BoardManifest, BoardNodeRecord, BoardRecord, InvalidBoardFileError, isBoardPath, parseBoardManifest, serializeBoardManifest } from "../protocol/dist/board.js";
 import { BoardExtensionDefinition, BoardExtensionRegistry, BoardPresetDefinition, CompiledSequence, DEFAULT_BOARD_LIMITS, QualityProfile, RenderBounds, TimelineClipInput, TimelineInput, clip, compileSequence, createBoardExtensionRegistry, timeline } from "./animation.js";
-import { ArrowEndpoint, ArrowEndpointSchema, BoardAppearance, BoardAppearanceSchema, BoardArrowItem, BoardArrowItemSchema, BoardDocument, BoardDocumentSchema, BoardDrawItem, BoardDrawItemSchema, BoardFileItem, BoardFileItemSchema, BoardFileSnapshot, BoardFileSnapshotSchema, BoardFrame, BoardFrameItem, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItem, BoardGeoItemSchema, BoardImageItem, BoardImageItemSchema, BoardItem, BoardItemSchema, BoardItemStyle, BoardItemStyleSchema, BoardKnownItem, BoardMediaSnapshot, BoardMediaSnapshotSchema, BoardTextItem, BoardTextItemSchema, BoardUnknownItem, BoardVideoItem, BoardVideoItemSchema, BoardViewport, BoardViewportSchema, DrawPoint, DrawPointSchema, KNOWN_BOARD_ITEM_TYPES, KnownBoardItemType, SpaceFileRef, SpaceFileRefSchema, UNKNOWN_BOARD_ITEM_TYPE, isFileBackedItem, isMediaItem, isUnknownItem, parseBoardItemLoose, unknownRealType } from "../protocol/dist/board-document.js";
+import { BoardAppearance, BoardAppearanceSchema, BoardArrowItem, BoardArrowItemSchema, BoardDocument, BoardDocumentSchema, BoardDrawItem, BoardDrawItemSchema, BoardFileItem, BoardFileItemSchema, BoardFileSnapshot, BoardFileSnapshotSchema, BoardFrame, BoardFrameItem, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItem, BoardGeoItemSchema, BoardImageItem, BoardImageItemSchema, BoardItem, BoardItemSchema, BoardItemStyle, BoardItemStyleSchema, BoardKnownItem, BoardMediaSnapshot, BoardMediaSnapshotSchema, BoardPoint, BoardPointSchema, BoardTextItem, BoardTextItemSchema, BoardUnknownItem, BoardVideoItem, BoardVideoItemSchema, BoardViewport, BoardViewportSchema, DrawPoint, DrawPointSchema, KNOWN_BOARD_ITEM_TYPES, KnownBoardItemType, SpaceFileRef, SpaceFileRefSchema, UNKNOWN_BOARD_ITEM_TYPE, isFileBackedItem, isMediaItem, isUnknownItem, parseBoardDocument, parseBoardItemLoose, unknownRealType, withResolvedConnections } from "../protocol/dist/board-document.js";
 import { BOARD_NODE_SOURCE, DEFAULT_BOARD_APPEARANCE, ITEM_BASE_KEYS, WireBackedBoardItem, boardBootstrapToDocument, boardNodeToItem, isRecord, nodeInputFromRecord, sourceForItem } from "./codec.js";
 import { CORNER_RESIZE_HANDLES, CORNER_ROTATION_ZONE_WIDTH, CornerResizeHandle, EDGE_RESIZE_HANDLES, FIT_PADDING, HANDLE_DIRECTION, HANDLE_HIT_RADIUS, MAX_BOARD_ZOOM, MIN_BOARD_ZOOM, MIN_ITEM_SIZE, Point, RESIZE_HANDLES, ROTATION_HANDLE_OFFSET, Rect, ResizeHandle, ScreenPoint, Size, VIEWPORT_MARGIN_RATIO, WorldPoint, angleFromCenter, clamp, clampZoom, degToRad, expandRect, fitToContent, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, handlePosition, itemBounds, normalizeRotation, normalizeViewport, panBy, pointToWorld, radToDeg, rectCenter, rectContainsPoint, rectsIntersect, resizeFrame, resizeFrameToSize, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, scaleFrames, screenPoint, screenToWorld, selectionBounds, unionRects, visibleWorldRect, worldPoint, worldToScreen, zoomAround } from "./geometry.js";
-import { FrameLookup, ResolvedArrow, anchorToWorld, arrowBounds, bindEndpointAt, distanceToArrow, resolveArrow, resolveEndpoint, sampleQuadratic, translateArrow, worldToAnchor } from "./core/bindings.js";
+import { ResolvedArrow, arrowBounds, arrowFrame, distanceToArrow, resolveArrow, sampleArrow, translateArrow } from "./core/arrow-geometry.js";
+import { CONNECTION_ENDPOINT_GAP, ConnectionIndex, FrameLookup, ResolvedConnection, ResolvedConnectionEndpoint, anchorPointOnFrame, anchorToWorld, autoConnectionSide, connectionArrowheads, connectionBounds, connectionHitTest, createConnectionIndex, distanceToConnection, pathMidpoint, resolveConnection, worldToAnchor } from "./core/connections.js";
 import { buildStrokeOutline, computeDrawBounds, distanceToStroke, sampleRadius, simplifyDrawIndices } from "./core/draw-geometry.js";
 import { BOARD_EXPORT_MAX_TEXTURES, BoardExportAssetSelection, selectBoardExportAssets } from "./core/export-assets.js";
-import { BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, BoardExportPlan, BoardExportPlanInput, BoardExportRegion, boardFrameLookup, exportItemBounds, normalizeBoardDocument, planBoardExport } from "./core/export-plan.js";
+import { BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, BoardExportPlan, BoardExportPlanInput, BoardExportRegion, boardFrameLookup, exportConnectionBounds, exportItemBounds, normalizeBoardDocument, planBoardExport } from "./core/export-plan.js";
 import { BoardFileSnapshotFacts, BuildSnapshotInput, FILE_EXCERPT_MAX_BYTES, FILE_EXCERPT_MAX_CHARS, FileAvailability, FilePreviewKind, ResolvedCover, availabilityFromError, buildFileExcerpt, buildFileSnapshot, fileBaseName, filePreviewKind, filePreviewMemoKey, filePreviewScope, fileTypeLabel, formatFileSize, isFileSnapshotFresh, mergeFileSnapshot, readCoverFromFrontmatter, readTitleFromFrontmatter, resolveCoverRef, resolveSpacePath, shouldFetchFileExcerpt, splitFrontmatter } from "./core/file-preview.js";
 import { BOARD_COLORS, BoardColorEntry, BoardColorId, BoardColorValue, BoardShapeColors, DEFAULT_BOARD_COLOR, boardColorCssVar, buildFallbackShapeColors, isBoardColorId, pickBoardColor, resolveBoardColor } from "./core/palette.js";
 import { ArrowShapeProps, DrawShapeProps, FULL_CAPABILITIES, GEO_KINDS, GeoKind, GeoShapeProps, HandleDragResult, ImageShapeProps, ShapeCapabilities, ShapeGeometry, ShapeHandle, ShapeHandleId, ShapeResizeMode, TextShapeProps, VideoShapeProps, isGeoKind, resizeModeForCapabilities } from "./core/shape-types.js";
 import { ShapeDefinition, definitionForItem, getShapeDefinition, registerShapeDefinition, shapeBounds, shapeCapabilities, shapeHandles, shapeHitTest, shapeResizeMode, unknownShapeDefinition } from "./core/shape-definition.js";
 import { TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, boardTextLineHeight, clampBoardTextFontSize, measureBoardText, setBoardTextMeasurer } from "./core/text-metrics.js";
-import { BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, BoardStyledToolId, BoardToolStyleMap, BoardToolStylePatch, DEFAULT_BOARD_TOOL_STYLES, clampBoardStrokeSize, createBoardToolStyles } from "./core/tool-styles.js";
+import { BoardStyledToolId, BoardToolStyleMap, BoardToolStylePatch, DEFAULT_BOARD_TOOL_STYLES, createBoardToolStyles } from "./core/tool-styles.js";
 import { boardImageKeySource, imageAssetKey } from "./image-key.js";
-export { ArrowEndpoint, ArrowEndpointSchema, type ArrowShapeProps, BOARD_COLORS, BOARD_DOCUMENT_KIND, BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, BOARD_EXPORT_MAX_TEXTURES, BOARD_EXTENSION, BOARD_NODE_SOURCE, BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, BoardAppearance, BoardAppearanceSchema, BoardArrowItem, BoardArrowItemSchema, BoardColorEntry, BoardColorId, BoardColorValue, BoardDocument, BoardDocumentSchema, BoardDrawItem, BoardDrawItemSchema, BoardExportAssetSelection, BoardExportPlan, BoardExportPlanInput, BoardExportRegion, BoardExtensionDefinition, BoardExtensionRegistry, BoardFileItem, BoardFileItemSchema, BoardFileSnapshot, BoardFileSnapshotFacts, BoardFileSnapshotSchema, BoardFrame, BoardFrameItem, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItem, BoardGeoItemSchema, BoardImageItem, BoardImageItemSchema, BoardItem, BoardItemSchema, BoardItemStyle, BoardItemStyleSchema, BoardKnownItem, type BoardManifest, BoardMediaSnapshot, BoardMediaSnapshotSchema, type BoardNodeRecord, BoardPresetDefinition, type BoardRecord, BoardShapeColors, BoardStyledToolId, BoardTextItem, BoardTextItemSchema, BoardToolStyleMap, BoardToolStylePatch, BoardUnknownItem, BoardVideoItem, BoardVideoItemSchema, BoardViewport, BoardViewportSchema, BuildSnapshotInput, CORNER_RESIZE_HANDLES, CORNER_ROTATION_ZONE_WIDTH, CompiledSequence, CornerResizeHandle, DEFAULT_BOARD_APPEARANCE, DEFAULT_BOARD_COLOR, DEFAULT_BOARD_LIMITS, DEFAULT_BOARD_TOOL_STYLES, DrawPoint, DrawPointSchema, type DrawShapeProps, EDGE_RESIZE_HANDLES, FILE_EXCERPT_MAX_BYTES, FILE_EXCERPT_MAX_CHARS, FIT_PADDING, FULL_CAPABILITIES, FileAvailability, FilePreviewKind, FrameLookup, GEO_KINDS, type GeoKind, type GeoShapeProps, HANDLE_DIRECTION, HANDLE_HIT_RADIUS, type HandleDragResult, ITEM_BASE_KEYS, type ImageShapeProps, InvalidBoardFileError, KNOWN_BOARD_ITEM_TYPES, KnownBoardItemType, MAX_BOARD_ZOOM, MIN_BOARD_ZOOM, MIN_ITEM_SIZE, Point, QualityProfile, RESIZE_HANDLES, ROTATION_HANDLE_OFFSET, Rect, RenderBounds, ResizeHandle, ResolvedArrow, ResolvedCover, ScreenPoint, type ShapeCapabilities, ShapeDefinition, type ShapeGeometry, type ShapeHandle, type ShapeHandleId, type ShapeResizeMode, Size, SpaceFileRef, SpaceFileRefSchema, TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, type TextShapeProps, TimelineClipInput, TimelineInput, UNKNOWN_BOARD_ITEM_TYPE, VIEWPORT_MARGIN_RATIO, type VideoShapeProps, WireBackedBoardItem, WorldPoint, anchorToWorld, angleFromCenter, arrowBounds, availabilityFromError, bindEndpointAt, boardBootstrapToDocument, boardColorCssVar, boardFrameLookup, boardImageKeySource, boardNodeToItem, boardTextLineHeight, buildFallbackShapeColors, buildFileExcerpt, buildFileSnapshot, buildStrokeOutline, clamp, clampBoardStrokeSize, clampBoardTextFontSize, clampZoom, clip, compileSequence, computeDrawBounds, createBoardExtensionRegistry, createBoardToolStyles, definitionForItem, degToRad, distanceToArrow, distanceToStroke, expandRect, exportItemBounds, fileBaseName, filePreviewKind, filePreviewMemoKey, filePreviewScope, fileTypeLabel, fitToContent, formatFileSize, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, getShapeDefinition, handlePosition, imageAssetKey, isBoardColorId, isBoardPath, isFileBackedItem, isFileSnapshotFresh, isGeoKind, isMediaItem, isRecord, isUnknownItem, itemBounds, measureBoardText, mergeFileSnapshot, nodeInputFromRecord, normalizeBoardDocument, normalizeRotation, normalizeViewport, panBy, parseBoardItemLoose, parseBoardManifest, pickBoardColor, planBoardExport, pointToWorld, radToDeg, readCoverFromFrontmatter, readTitleFromFrontmatter, rectCenter, rectContainsPoint, rectsIntersect, registerShapeDefinition, resizeFrame, resizeFrameToSize, resizeModeForCapabilities, resolveArrow, resolveBoardColor, resolveCoverRef, resolveEndpoint, resolveSpacePath, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, sampleQuadratic, sampleRadius, scaleFrames, screenPoint, screenToWorld, selectBoardExportAssets, selectionBounds, serializeBoardManifest, setBoardTextMeasurer, shapeBounds, shapeCapabilities, shapeHandles, shapeHitTest, shapeResizeMode, shouldFetchFileExcerpt, simplifyDrawIndices, sourceForItem, splitFrontmatter, timeline, translateArrow, unionRects, unknownRealType, unknownShapeDefinition, visibleWorldRect, worldPoint, worldToAnchor, worldToScreen, zoomAround };
+export { AUTO_BOARD_CONNECTION_ANCHOR, type ArrowShapeProps, BOARD_COLORS, BOARD_CONNECTION_DIRECTIONS, BOARD_CONNECTION_LINES, BOARD_CONNECTION_ROUTINGS, BOARD_CONNECTION_SIDES, BOARD_DOCUMENT_KIND, BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, BOARD_EXPORT_MAX_TEXTURES, BOARD_EXTENSION, BOARD_NODE_SOURCE, BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, BoardAppearance, BoardAppearanceSchema, BoardArrowItem, BoardArrowItemSchema, BoardColorEntry, BoardColorId, BoardColorValue, BoardConnection, BoardConnectionAnchor, BoardConnectionAnchorSchema, BoardConnectionDirection, BoardConnectionEndpoint, BoardConnectionEndpointSchema, BoardConnectionInput, BoardConnectionLine, BoardConnectionPatch, BoardConnectionPatchSchema, BoardConnectionRecord, BoardConnectionRouting, BoardConnectionRoutingConfig, BoardConnectionRoutingSchema, BoardConnectionSchema, BoardConnectionSide, BoardConnectionStyle, BoardConnectionStyleSchema, BoardConnectionWaypointSchema, BoardDocument, BoardDocumentSchema, BoardDrawItem, BoardDrawItemSchema, BoardExportAssetSelection, BoardExportPlan, BoardExportPlanInput, BoardExportRegion, BoardExtensionDefinition, BoardExtensionRegistry, BoardFileItem, BoardFileItemSchema, BoardFileSnapshot, BoardFileSnapshotFacts, BoardFileSnapshotSchema, BoardFrame, BoardFrameItem, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItem, BoardGeoItemSchema, BoardImageItem, BoardImageItemSchema, BoardItem, BoardItemSchema, BoardItemStyle, BoardItemStyleSchema, BoardKnownItem, type BoardManifest, BoardMediaSnapshot, BoardMediaSnapshotSchema, type BoardNodeRecord, BoardPoint, BoardPointSchema, BoardPresetDefinition, type BoardRecord, BoardRelationSchema, BoardShapeColors, BoardStyledToolId, BoardTextItem, BoardTextItemSchema, BoardToolStyleMap, BoardToolStylePatch, BoardUnknownItem, BoardVideoItem, BoardVideoItemSchema, BoardViewport, BoardViewportSchema, BuildSnapshotInput, CONNECTION_ENDPOINT_GAP, CORNER_RESIZE_HANDLES, CORNER_ROTATION_ZONE_WIDTH, CompiledSequence, ConnectionIndex, CornerResizeHandle, DEFAULT_BOARD_APPEARANCE, DEFAULT_BOARD_COLOR, DEFAULT_BOARD_CONNECTION_ROUTING, DEFAULT_BOARD_CONNECTION_STYLE, DEFAULT_BOARD_LIMITS, DEFAULT_BOARD_RELATION, DEFAULT_BOARD_TOOL_STYLES, DrawPoint, DrawPointSchema, type DrawShapeProps, EDGE_RESIZE_HANDLES, FILE_EXCERPT_MAX_BYTES, FILE_EXCERPT_MAX_CHARS, FIT_PADDING, FULL_CAPABILITIES, FileAvailability, FilePreviewKind, FrameLookup, GEO_KINDS, type GeoKind, type GeoShapeProps, HANDLE_DIRECTION, HANDLE_HIT_RADIUS, type HandleDragResult, ITEM_BASE_KEYS, type ImageShapeProps, InvalidBoardFileError, KNOWN_BOARD_ITEM_TYPES, KnownBoardItemType, MAX_BOARD_ZOOM, MIN_BOARD_ZOOM, MIN_ITEM_SIZE, Point, QualityProfile, RESIZE_HANDLES, ROTATION_HANDLE_OFFSET, Rect, RenderBounds, ResizeHandle, ResolvedArrow, ResolvedConnection, ResolvedConnectionEndpoint, ResolvedCover, ScreenPoint, type ShapeCapabilities, ShapeDefinition, type ShapeGeometry, type ShapeHandle, type ShapeHandleId, type ShapeResizeMode, Size, SpaceFileRef, SpaceFileRefSchema, TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, type TextShapeProps, TimelineClipInput, TimelineInput, UNKNOWN_BOARD_ITEM_TYPE, VIEWPORT_MARGIN_RATIO, type VideoShapeProps, WireBackedBoardItem, WorldPoint, anchorPointOnFrame, anchorToWorld, angleFromCenter, arrowBounds, arrowFrame, autoConnectionSide, availabilityFromError, boardBootstrapToDocument, boardColorCssVar, boardFrameLookup, boardImageKeySource, boardNodeToItem, boardTextLineHeight, buildFallbackShapeColors, buildFileExcerpt, buildFileSnapshot, buildStrokeOutline, clamp, clampBoardStrokeSize, clampBoardTextFontSize, clampZoom, clip, compileSequence, computeDrawBounds, connectionArrowheads, connectionBounds, connectionHitTest, connectionNodeIds, connectionOtherNodeId, connectionTouchesNode, createBoardConnection, createBoardExtensionRegistry, createBoardToolStyles, createConnectionIndex, definitionForItem, degToRad, distanceToArrow, distanceToConnection, distanceToStroke, expandRect, exportConnectionBounds, exportItemBounds, fileBaseName, filePreviewKind, filePreviewMemoKey, filePreviewScope, fileTypeLabel, fitToContent, flipBoardConnection, formatFileSize, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, getShapeDefinition, handlePosition, imageAssetKey, isBoardColorId, isBoardPath, isFileBackedItem, isFileSnapshotFresh, isGeoKind, isMediaItem, isRecord, isUnknownItem, itemBounds, measureBoardText, mergeFileSnapshot, nodeInputFromRecord, normalizeBoardConnectionStyle, normalizeBoardDocument, normalizeRotation, normalizeViewport, panBy, parseBoardDocument, parseBoardItemLoose, parseBoardManifest, pathMidpoint, pickBoardColor, planBoardExport, pointToWorld, radToDeg, readCoverFromFrontmatter, readTitleFromFrontmatter, rectCenter, rectContainsPoint, rectsIntersect, registerShapeDefinition, resizeFrame, resizeFrameToSize, resizeModeForCapabilities, resolveArrow, resolveBoardColor, resolveConnection, resolveCoverRef, resolveSpacePath, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, sampleArrow, sampleRadius, scaleFrames, screenPoint, screenToWorld, selectBoardExportAssets, selectionBounds, serializeBoardManifest, setBoardTextMeasurer, shapeBounds, shapeCapabilities, shapeHandles, shapeHitTest, shapeResizeMode, shouldFetchFileExcerpt, simplifyDrawIndices, sourceForItem, splitFrontmatter, timeline, translateArrow, unionRects, unknownRealType, unknownShapeDefinition, visibleWorldRect, withResolvedConnections, worldPoint, worldToAnchor, worldToScreen, zoomAround };

package/dist/board/index.js

@@ -1,17 +1,20 @@
+import { BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, clampBoardStrokeSize } from "../protocol/dist/board-constants.js";
 import { BoardExtensionRegistry, DEFAULT_BOARD_LIMITS, clip, compileSequence, createBoardExtensionRegistry, timeline } from "./animation.js";
+import { AUTO_BOARD_CONNECTION_ANCHOR, BOARD_CONNECTION_DIRECTIONS, BOARD_CONNECTION_LINES, BOARD_CONNECTION_ROUTINGS, BOARD_CONNECTION_SIDES, BoardConnectionAnchorSchema, BoardConnectionEndpointSchema, BoardConnectionPatchSchema, BoardConnectionRoutingSchema, BoardConnectionSchema, BoardConnectionStyleSchema, BoardConnectionWaypointSchema, BoardRelationSchema, DEFAULT_BOARD_CONNECTION_ROUTING, DEFAULT_BOARD_CONNECTION_STYLE, DEFAULT_BOARD_RELATION, connectionNodeIds, connectionOtherNodeId, connectionTouchesNode, createBoardConnection, flipBoardConnection, normalizeBoardConnectionStyle } from "../protocol/dist/board-connection.js";
 import { BOARD_DOCUMENT_KIND, BOARD_EXTENSION, InvalidBoardFileError, isBoardPath, parseBoardManifest, serializeBoardManifest } from "../protocol/dist/board.js";
-import { ArrowEndpointSchema, BoardAppearanceSchema, BoardArrowItemSchema, BoardDocumentSchema, BoardDrawItemSchema, BoardFileItemSchema, BoardFileSnapshotSchema, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItemSchema, BoardImageItemSchema, BoardItemSchema, BoardItemStyleSchema, BoardMediaSnapshotSchema, BoardTextItemSchema, BoardVideoItemSchema, BoardViewportSchema, DrawPointSchema, KNOWN_BOARD_ITEM_TYPES, SpaceFileRefSchema, UNKNOWN_BOARD_ITEM_TYPE, isFileBackedItem, isMediaItem, isUnknownItem, parseBoardItemLoose, unknownRealType } from "../protocol/dist/board-document.js";
+import { BoardAppearanceSchema, BoardArrowItemSchema, BoardDocumentSchema, BoardDrawItemSchema, BoardFileItemSchema, BoardFileSnapshotSchema, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItemSchema, BoardImageItemSchema, BoardItemSchema, BoardItemStyleSchema, BoardMediaSnapshotSchema, BoardPointSchema, BoardTextItemSchema, BoardVideoItemSchema, BoardViewportSchema, DrawPointSchema, KNOWN_BOARD_ITEM_TYPES, SpaceFileRefSchema, UNKNOWN_BOARD_ITEM_TYPE, isFileBackedItem, isMediaItem, isUnknownItem, parseBoardDocument, parseBoardItemLoose, unknownRealType, withResolvedConnections } from "../protocol/dist/board-document.js";
 import { TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, boardTextLineHeight, clampBoardTextFontSize, measureBoardText, setBoardTextMeasurer } from "./core/text-metrics.js";
 import { BOARD_NODE_SOURCE, DEFAULT_BOARD_APPEARANCE, ITEM_BASE_KEYS, boardBootstrapToDocument, boardNodeToItem, isRecord, nodeInputFromRecord, sourceForItem } from "./codec.js";
 import { CORNER_RESIZE_HANDLES, CORNER_ROTATION_ZONE_WIDTH, EDGE_RESIZE_HANDLES, FIT_PADDING, HANDLE_DIRECTION, HANDLE_HIT_RADIUS, MAX_BOARD_ZOOM, MIN_BOARD_ZOOM, MIN_ITEM_SIZE, RESIZE_HANDLES, ROTATION_HANDLE_OFFSET, VIEWPORT_MARGIN_RATIO, angleFromCenter, clamp, clampZoom, degToRad, expandRect, fitToContent, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, handlePosition, itemBounds, normalizeRotation, normalizeViewport, panBy, pointToWorld, radToDeg, rectCenter, rectContainsPoint, rectsIntersect, resizeFrame, resizeFrameToSize, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, scaleFrames, screenPoint, screenToWorld, selectionBounds, unionRects, visibleWorldRect, worldPoint, worldToScreen, zoomAround } from "./geometry.js";
 import { boardImageKeySource, imageAssetKey } from "./image-key.js";
-import { anchorToWorld, arrowBounds, bindEndpointAt, distanceToArrow, resolveArrow, resolveEndpoint, sampleQuadratic, translateArrow, worldToAnchor } from "./core/bindings.js";
+import { arrowBounds, arrowFrame, distanceToArrow, resolveArrow, sampleArrow, translateArrow } from "./core/arrow-geometry.js";
+import { CONNECTION_ENDPOINT_GAP, anchorPointOnFrame, anchorToWorld, autoConnectionSide, connectionArrowheads, connectionBounds, connectionHitTest, createConnectionIndex, distanceToConnection, pathMidpoint, resolveConnection, worldToAnchor } from "./core/connections.js";
 import { buildStrokeOutline, computeDrawBounds, distanceToStroke, sampleRadius, simplifyDrawIndices } from "./core/draw-geometry.js";
 import { BOARD_EXPORT_MAX_TEXTURES, selectBoardExportAssets } from "./core/export-assets.js";
-import { BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, boardFrameLookup, exportItemBounds, normalizeBoardDocument, planBoardExport } from "./core/export-plan.js";
+import { BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, boardFrameLookup, exportConnectionBounds, exportItemBounds, normalizeBoardDocument, planBoardExport } from "./core/export-plan.js";
 import { FILE_EXCERPT_MAX_BYTES, FILE_EXCERPT_MAX_CHARS, availabilityFromError, buildFileExcerpt, buildFileSnapshot, fileBaseName, filePreviewKind, filePreviewMemoKey, filePreviewScope, fileTypeLabel, formatFileSize, isFileSnapshotFresh, mergeFileSnapshot, readCoverFromFrontmatter, readTitleFromFrontmatter, resolveCoverRef, resolveSpacePath, shouldFetchFileExcerpt, splitFrontmatter } from "./core/file-preview.js";
 import { BOARD_COLORS, DEFAULT_BOARD_COLOR, boardColorCssVar, buildFallbackShapeColors, isBoardColorId, pickBoardColor, resolveBoardColor } from "./core/palette.js";
 import { FULL_CAPABILITIES, GEO_KINDS, isGeoKind, resizeModeForCapabilities } from "./core/shape-types.js";
 import { definitionForItem, getShapeDefinition, registerShapeDefinition, shapeBounds, shapeCapabilities, shapeHandles, shapeHitTest, shapeResizeMode, unknownShapeDefinition } from "./core/shape-definition.js";
-import { BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, DEFAULT_BOARD_TOOL_STYLES, clampBoardStrokeSize, createBoardToolStyles } from "./core/tool-styles.js";
-export { ArrowEndpointSchema, BOARD_COLORS, BOARD_DOCUMENT_KIND, BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, BOARD_EXPORT_MAX_TEXTURES, BOARD_EXTENSION, BOARD_NODE_SOURCE, BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, BoardAppearanceSchema, BoardArrowItemSchema, BoardDocumentSchema, BoardDrawItemSchema, BoardExtensionRegistry, BoardFileItemSchema, BoardFileSnapshotSchema, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItemSchema, BoardImageItemSchema, BoardItemSchema, BoardItemStyleSchema, BoardMediaSnapshotSchema, BoardTextItemSchema, BoardVideoItemSchema, BoardViewportSchema, CORNER_RESIZE_HANDLES, CORNER_ROTATION_ZONE_WIDTH, DEFAULT_BOARD_APPEARANCE, DEFAULT_BOARD_COLOR, DEFAULT_BOARD_LIMITS, DEFAULT_BOARD_TOOL_STYLES, DrawPointSchema, EDGE_RESIZE_HANDLES, FILE_EXCERPT_MAX_BYTES, FILE_EXCERPT_MAX_CHARS, FIT_PADDING, FULL_CAPABILITIES, GEO_KINDS, HANDLE_DIRECTION, HANDLE_HIT_RADIUS, ITEM_BASE_KEYS, InvalidBoardFileError, KNOWN_BOARD_ITEM_TYPES, MAX_BOARD_ZOOM, MIN_BOARD_ZOOM, MIN_ITEM_SIZE, RESIZE_HANDLES, ROTATION_HANDLE_OFFSET, SpaceFileRefSchema, TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, UNKNOWN_BOARD_ITEM_TYPE, VIEWPORT_MARGIN_RATIO, anchorToWorld, angleFromCenter, arrowBounds, availabilityFromError, bindEndpointAt, boardBootstrapToDocument, boardColorCssVar, boardFrameLookup, boardImageKeySource, boardNodeToItem, boardTextLineHeight, buildFallbackShapeColors, buildFileExcerpt, buildFileSnapshot, buildStrokeOutline, clamp, clampBoardStrokeSize, clampBoardTextFontSize, clampZoom, clip, compileSequence, computeDrawBounds, createBoardExtensionRegistry, createBoardToolStyles, definitionForItem, degToRad, distanceToArrow, distanceToStroke, expandRect, exportItemBounds, fileBaseName, filePreviewKind, filePreviewMemoKey, filePreviewScope, fileTypeLabel, fitToContent, formatFileSize, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, getShapeDefinition, handlePosition, imageAssetKey, isBoardColorId, isBoardPath, isFileBackedItem, isFileSnapshotFresh, isGeoKind, isMediaItem, isRecord, isUnknownItem, itemBounds, measureBoardText, mergeFileSnapshot, nodeInputFromRecord, normalizeBoardDocument, normalizeRotation, normalizeViewport, panBy, parseBoardItemLoose, parseBoardManifest, pickBoardColor, planBoardExport, pointToWorld, radToDeg, readCoverFromFrontmatter, readTitleFromFrontmatter, rectCenter, rectContainsPoint, rectsIntersect, registerShapeDefinition, resizeFrame, resizeFrameToSize, resizeModeForCapabilities, resolveArrow, resolveBoardColor, resolveCoverRef, resolveEndpoint, resolveSpacePath, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, sampleQuadratic, sampleRadius, scaleFrames, screenPoint, screenToWorld, selectBoardExportAssets, selectionBounds, serializeBoardManifest, setBoardTextMeasurer, shapeBounds, shapeCapabilities, shapeHandles, shapeHitTest, shapeResizeMode, shouldFetchFileExcerpt, simplifyDrawIndices, sourceForItem, splitFrontmatter, timeline, translateArrow, unionRects, unknownRealType, unknownShapeDefinition, visibleWorldRect, worldPoint, worldToAnchor, worldToScreen, zoomAround };
+import { DEFAULT_BOARD_TOOL_STYLES, createBoardToolStyles } from "./core/tool-styles.js";
+export { AUTO_BOARD_CONNECTION_ANCHOR, BOARD_COLORS, BOARD_CONNECTION_DIRECTIONS, BOARD_CONNECTION_LINES, BOARD_CONNECTION_ROUTINGS, BOARD_CONNECTION_SIDES, BOARD_DOCUMENT_KIND, BOARD_EXPORT_DEFAULT_PADDING, BOARD_EXPORT_DEFAULT_SCALE, BOARD_EXPORT_ITEM_WARN_THRESHOLD, BOARD_EXPORT_MAX_EDGE, BOARD_EXPORT_MAX_PIXELS, BOARD_EXPORT_MAX_TEXTURES, BOARD_EXTENSION, BOARD_NODE_SOURCE, BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, BoardAppearanceSchema, BoardArrowItemSchema, BoardConnectionAnchorSchema, BoardConnectionEndpointSchema, BoardConnectionPatchSchema, BoardConnectionRoutingSchema, BoardConnectionSchema, BoardConnectionStyleSchema, BoardConnectionWaypointSchema, BoardDocumentSchema, BoardDrawItemSchema, BoardExtensionRegistry, BoardFileItemSchema, BoardFileSnapshotSchema, BoardFrameItemSchema, BoardFrameSchema, BoardGeoItemSchema, BoardImageItemSchema, BoardItemSchema, BoardItemStyleSchema, BoardMediaSnapshotSchema, BoardPointSchema, BoardRelationSchema, BoardTextItemSchema, BoardVideoItemSchema, BoardViewportSchema, CONNECTION_ENDPOINT_GAP, CORNER_RESIZE_HANDLES, CORNER_ROTATION_ZONE_WIDTH, DEFAULT_BOARD_APPEARANCE, DEFAULT_BOARD_COLOR, DEFAULT_BOARD_CONNECTION_ROUTING, DEFAULT_BOARD_CONNECTION_STYLE, DEFAULT_BOARD_LIMITS, DEFAULT_BOARD_RELATION, DEFAULT_BOARD_TOOL_STYLES, DrawPointSchema, EDGE_RESIZE_HANDLES, FILE_EXCERPT_MAX_BYTES, FILE_EXCERPT_MAX_CHARS, FIT_PADDING, FULL_CAPABILITIES, GEO_KINDS, HANDLE_DIRECTION, HANDLE_HIT_RADIUS, ITEM_BASE_KEYS, InvalidBoardFileError, KNOWN_BOARD_ITEM_TYPES, MAX_BOARD_ZOOM, MIN_BOARD_ZOOM, MIN_ITEM_SIZE, RESIZE_HANDLES, ROTATION_HANDLE_OFFSET, SpaceFileRefSchema, TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, UNKNOWN_BOARD_ITEM_TYPE, VIEWPORT_MARGIN_RATIO, anchorPointOnFrame, anchorToWorld, angleFromCenter, arrowBounds, arrowFrame, autoConnectionSide, availabilityFromError, boardBootstrapToDocument, boardColorCssVar, boardFrameLookup, boardImageKeySource, boardNodeToItem, boardTextLineHeight, buildFallbackShapeColors, buildFileExcerpt, buildFileSnapshot, buildStrokeOutline, clamp, clampBoardStrokeSize, clampBoardTextFontSize, clampZoom, clip, compileSequence, computeDrawBounds, connectionArrowheads, connectionBounds, connectionHitTest, connectionNodeIds, connectionOtherNodeId, connectionTouchesNode, createBoardConnection, createBoardExtensionRegistry, createBoardToolStyles, createConnectionIndex, definitionForItem, degToRad, distanceToArrow, distanceToConnection, distanceToStroke, expandRect, exportConnectionBounds, exportItemBounds, fileBaseName, filePreviewKind, filePreviewMemoKey, filePreviewScope, fileTypeLabel, fitToContent, flipBoardConnection, formatFileSize, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, getShapeDefinition, handlePosition, imageAssetKey, isBoardColorId, isBoardPath, isFileBackedItem, isFileSnapshotFresh, isGeoKind, isMediaItem, isRecord, isUnknownItem, itemBounds, measureBoardText, mergeFileSnapshot, nodeInputFromRecord, normalizeBoardConnectionStyle, normalizeBoardDocument, normalizeRotation, normalizeViewport, panBy, parseBoardDocument, parseBoardItemLoose, parseBoardManifest, pathMidpoint, pickBoardColor, planBoardExport, pointToWorld, radToDeg, readCoverFromFrontmatter, readTitleFromFrontmatter, rectCenter, rectContainsPoint, rectsIntersect, registerShapeDefinition, resizeFrame, resizeFrameToSize, resizeModeForCapabilities, resolveArrow, resolveBoardColor, resolveConnection, resolveCoverRef, resolveSpacePath, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, sampleArrow, sampleRadius, scaleFrames, screenPoint, screenToWorld, selectBoardExportAssets, selectionBounds, serializeBoardManifest, setBoardTextMeasurer, shapeBounds, shapeCapabilities, shapeHandles, shapeHitTest, shapeResizeMode, shouldFetchFileExcerpt, simplifyDrawIndices, sourceForItem, splitFrontmatter, timeline, translateArrow, unionRects, unknownRealType, unknownShapeDefinition, visibleWorldRect, withResolvedConnections, worldPoint, worldToAnchor, worldToScreen, zoomAround };

package/dist/board/render/connection-layer.d.ts

@@ -0,0 +1,48 @@
+import { BoardConnection } from "../../protocol/dist/board-connection.js";
+import { BoardFrame } from "../../protocol/dist/board-document.js";
+import { FrameLookup, ResolvedConnection } from "../core/connections.js";
+import { BoardShapeColors } from "../core/palette.js";
+import { Container } from "pixi.js";
+//#region src/board/render/connection-layer.d.ts
+type ConnectionRenderInput = {
+  connections: readonly BoardConnection[];
+  getFrame: FrameLookup;
+  colors: BoardShapeColors;
+  colorScheme: "dark" | "light";
+  zoom: number;
+  /** Connections drawn in their selected state. */
+  selectedIds?: ReadonlySet<string>;
+  /** Connection under the pointer, if any. */
+  hoveredId?: string | null;
+  /**
+   * Ids to skip because the host is drawing them itself this frame (e.g. a live
+   * drag preview on the interaction overlay). Skipping avoids the doubled stroke
+   * of a preview drawn over its own committed geometry.
+   */
+  skipIds?: ReadonlySet<string>;
+};
+type ConnectionLayer = {
+  /** Redraw every connection. Cheap: one Graphics, batched. */
+  sync: (input: ConnectionRenderInput) => void;
+  /** Resolved geometry from the last sync, for hit testing and overlays. */
+  resolved: (connectionId: string) => ResolvedConnection | null;
+  /**
+   * The display objects this layer owns, so a host can place them in its own
+   * z-ordering scheme without the layer needing to know about it.
+   */
+  readonly children: readonly Container[];
+  destroy: () => void;
+};
+declare function createConnectionLayer(options: {
+  /** World-space container the layer attaches to. */
+  parent: Container;
+  /** zIndex applied to the layer's display objects once they exist. */
+  zIndex?: number;
+}): ConnectionLayer;
+/** Frame lookup over a plain item list, for hosts without an index. */
+declare function framesFromItems(items: readonly {
+  id: string;
+  frame: BoardFrame;
+}[]): FrameLookup;
+//#endregion
+export { ConnectionLayer, ConnectionRenderInput, createConnectionLayer, framesFromItems };

package/dist/board/render/connection-layer.js

@@ -0,0 +1,223 @@
+import { BOARD_FONT_STACK } from "../../protocol/dist/board-constants.js";
+import { connectionArrowheads, resolveConnection } from "../core/connections.js";
+import { pickBoardColor } from "../core/palette.js";
+import { syncTextResolution, textResolutionForZoom } from "./text-resolution.js";
+import { Container, Graphics, Text } from "pixi.js";
+//#region src/board/render/connection-layer.ts
+/**
+* Connection drawing.
+*
+* Connections render into one shared layer beneath the cards rather than as a
+* container per relation. A connection is a thin stroke with no texture and no
+* interactive chrome of its own, so a per-connection container would add a
+* transform, a render group and a draw call each for geometry that batches
+* perfectly — on a densely connected board that is the difference between a few
+* draw calls and a few thousand.
+*
+* Labels are the exception: text needs its own object to rasterise, so a `Text`
+* is materialised only for connections that actually carry one and is pooled by
+* connection id.
+*/
+/** Arrowhead length relative to stroke width, and its floor in world units. */
+const HEAD_SCALE = 5.5;
+const HEAD_MIN = 11;
+const HEAD_SPREAD = Math.PI / 6;
+/** Dash pattern for `dashed` connections, in world units. */
+const DASH_LENGTH = 10;
+const DASH_GAP = 7;
+/** Draw an open chevron arrowhead aimed along `angle`. */
+function drawArrowhead(graphics, tip, angle, size, color, width, alpha) {
+	graphics.moveTo(tip.x - size * Math.cos(angle - HEAD_SPREAD), tip.y - size * Math.sin(angle - HEAD_SPREAD)).lineTo(tip.x, tip.y).lineTo(tip.x - size * Math.cos(angle + HEAD_SPREAD), tip.y - size * Math.sin(angle + HEAD_SPREAD)).stroke({
+		color,
+		width,
+		alpha,
+		cap: "round",
+		join: "round"
+	});
+}
+/** Trace a polyline as a dashed path, walking segment by segment. */
+function traceDashed(graphics, path) {
+	let penDown = true;
+	let remaining = DASH_LENGTH;
+	let current = path[0];
+	if (!current) return;
+	graphics.moveTo(current.x, current.y);
+	for (let index = 1; index < path.length; index += 1) {
+		const next = path[index];
+		if (!next) continue;
+		let segmentRemaining = Math.hypot(next.x - current.x, next.y - current.y);
+		let from = current;
+		while (segmentRemaining > 1e-4) {
+			const step = Math.min(segmentRemaining, remaining);
+			const ratio = step / segmentRemaining;
+			const to = {
+				x: from.x + (next.x - from.x) * ratio,
+				y: from.y + (next.y - from.y) * ratio
+			};
+			if (penDown) graphics.lineTo(to.x, to.y);
+			else graphics.moveTo(to.x, to.y);
+			remaining -= step;
+			segmentRemaining -= step;
+			from = to;
+			if (remaining <= 1e-4) {
+				penDown = !penDown;
+				remaining = penDown ? DASH_LENGTH : DASH_GAP;
+			}
+		}
+		current = next;
+	}
+}
+function createConnectionLayer(options) {
+	let graphics = null;
+	let labelLayer = null;
+	const labels = /* @__PURE__ */ new Map();
+	let resolvedById = /* @__PURE__ */ new Map();
+	function ensureAttached() {
+		if (graphics && labelLayer) return {
+			graphics,
+			labelLayer
+		};
+		const nextGraphics = new Graphics({ label: "board-connections" });
+		const nextLabels = new Container({ label: "board-connection-labels" });
+		if (options.zIndex !== void 0) {
+			nextGraphics.zIndex = options.zIndex;
+			nextLabels.zIndex = options.zIndex;
+		}
+		options.parent.addChild(nextGraphics, nextLabels);
+		graphics = nextGraphics;
+		labelLayer = nextLabels;
+		return {
+			graphics: nextGraphics,
+			labelLayer: nextLabels
+		};
+	}
+	function releaseLabel(connectionId) {
+		const entry = labels.get(connectionId);
+		if (!entry) return;
+		labelLayer?.removeChild(entry.text);
+		entry.text.destroy();
+		labels.delete(connectionId);
+	}
+	function syncLabel(connection, resolved, input, color, host) {
+		const value = connection.label.trim();
+		if (!value) {
+			releaseLabel(connection.id);
+			return;
+		}
+		let entry = labels.get(connection.id);
+		if (!entry) {
+			const resolution = textResolutionForZoom(input.zoom);
+			const text = new Text({
+				text: value,
+				style: {
+					fill: color,
+					fontFamily: BOARD_FONT_STACK,
+					fontSize: 12,
+					fontWeight: "500"
+				},
+				resolution,
+				roundPixels: true
+			});
+			text.anchor.set(.5);
+			host.addChild(text);
+			entry = {
+				text,
+				resolution,
+				sig: ""
+			};
+			labels.set(connection.id, entry);
+		}
+		syncTextResolution(entry.text, entry, input.zoom);
+		const sig = `${value}|${color}`;
+		if (sig !== entry.sig) {
+			entry.sig = sig;
+			entry.text.text = value;
+			entry.text.style.fill = color;
+		}
+		entry.text.position.set(resolved.mid.x, resolved.mid.y);
+	}
+	function sync(input) {
+		if (input.connections.length === 0 && !graphics) {
+			resolvedById = /* @__PURE__ */ new Map();
+			return;
+		}
+		const host = ensureAttached();
+		host.graphics.clear();
+		const next = /* @__PURE__ */ new Map();
+		const selected = input.selectedIds ?? /* @__PURE__ */ new Set();
+		const skip = input.skipIds;
+		const minWidth = 1 / Math.max(input.zoom, 1e-4);
+		for (const connection of input.connections) {
+			const resolved = resolveConnection(connection, input.getFrame);
+			if (!resolved) continue;
+			next.set(connection.id, resolved);
+			if (skip?.has(connection.id)) {
+				releaseLabel(connection.id);
+				continue;
+			}
+			const isSelected = selected.has(connection.id);
+			const isHovered = input.hoveredId === connection.id;
+			const color = pickBoardColor(input.colors, connection.style.color, input.colorScheme);
+			const width = Math.max(connection.style.size + (isSelected ? 1 : 0), minWidth);
+			const alpha = isSelected || isHovered ? 1 : .9;
+			if (connection.style.line === "dashed") traceDashed(host.graphics, resolved.path);
+			else {
+				const first = resolved.path[0];
+				if (!first) continue;
+				host.graphics.moveTo(first.x, first.y);
+				for (let index = 1; index < resolved.path.length; index += 1) {
+					const point = resolved.path[index];
+					if (point) host.graphics.lineTo(point.x, point.y);
+				}
+			}
+			host.graphics.stroke({
+				color: color.stroke,
+				width,
+				alpha,
+				cap: "round",
+				join: "round"
+			});
+			const heads = connectionArrowheads(connection);
+			const headSize = Math.max(HEAD_MIN, connection.style.size * HEAD_SCALE);
+			if (heads.atTarget) {
+				const tip = resolved.path[resolved.path.length - 1];
+				const previous = resolved.path[resolved.path.length - 2];
+				if (tip && previous) drawArrowhead(host.graphics, tip, Math.atan2(tip.y - previous.y, tip.x - previous.x), headSize, color.stroke, width, alpha);
+			}
+			if (heads.atSource) {
+				const tip = resolved.path[0];
+				const next2 = resolved.path[1];
+				if (tip && next2) drawArrowhead(host.graphics, tip, Math.atan2(tip.y - next2.y, tip.x - next2.x), headSize, color.stroke, width, alpha);
+			}
+			syncLabel(connection, resolved, input, color.label, host.labelLayer);
+		}
+		for (const connectionId of [...labels.keys()]) if (!next.has(connectionId)) releaseLabel(connectionId);
+		resolvedById = next;
+	}
+	return {
+		sync,
+		resolved: (connectionId) => resolvedById.get(connectionId) ?? null,
+		get children() {
+			const list = [];
+			if (graphics) list.push(graphics);
+			if (labelLayer) list.push(labelLayer);
+			return list;
+		},
+		destroy: () => {
+			for (const entry of labels.values()) entry.text.destroy();
+			labels.clear();
+			graphics?.destroy();
+			labelLayer?.destroy({ children: true });
+			graphics = null;
+			labelLayer = null;
+			resolvedById = /* @__PURE__ */ new Map();
+		}
+	};
+}
+/** Frame lookup over a plain item list, for hosts without an index. */
+function framesFromItems(items) {
+	const frames = new Map(items.map((item) => [item.id, item.frame]));
+	return (id) => frames.get(id);
+}
+//#endregion
+export { createConnectionLayer, framesFromItems };

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

@@ -1,6 +1,7 @@
+import { ConnectionLayer, ConnectionRenderInput, createConnectionLayer, framesFromItems } from "./connection-layer.js";
 import { BoardCardRenderer, BoardRenderContext, BoardRenderPalette, boardCardRenderersForTest, getBoardCardRenderer, registerBoardCardRenderer } from "./renderers/board-renderer-registry.js";
 import { defaultBoardPalette } from "./palette.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, boardCardRenderersForTest, defaultBoardPalette, ensureBoardTextMeasurement, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket };
+export { BoardCardRenderer, BoardRenderContext, BoardRenderPalette, BoardThemeContext, BoardThemeRenderer, ConnectionLayer, ConnectionRenderInput, boardCardRenderersForTest, createConnectionLayer, defaultBoardPalette, ensureBoardTextMeasurement, framesFromItems, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket };

package/dist/board/render/index.js

@@ -1,6 +1,7 @@
+import { getBoardResolution, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket } from "./text-resolution.js";
+import { createConnectionLayer, framesFromItems } from "./connection-layer.js";
 import { defaultBoardPalette } from "./palette.js";
 import { ensureBoardTextMeasurement, installBoardTextMeasurement } from "./text-measurement.js";
-import { getBoardResolution, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket } from "./text-resolution.js";
 import { boardCardRenderersForTest, getBoardCardRenderer, registerBoardCardRenderer } from "./renderers/board-renderer-registry.js";
 import { getBoardThemeRenderer, registerBoardThemeRenderer } from "./themes/board-theme-registry.js";
-export { boardCardRenderersForTest, defaultBoardPalette, ensureBoardTextMeasurement, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket };
+export { boardCardRenderersForTest, createConnectionLayer, defaultBoardPalette, ensureBoardTextMeasurement, framesFromItems, getBoardCardRenderer, getBoardResolution, getBoardThemeRenderer, installBoardTextMeasurement, registerBoardCardRenderer, registerBoardThemeRenderer, syncTextResolution, syncTextWrapWidth, textResolutionForZoom, textZoomBucket };

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

@@ -1,21 +1,11 @@
 import { BOARD_FONT_STACK } from "../../../protocol/dist/board-constants.js";
-import { resolveArrow, sampleQuadratic } from "../../core/bindings.js";
+import { resolveArrow, sampleArrow } from "../../core/arrow-geometry.js";
 import { pickBoardColor } from "../../core/palette.js";
 import { syncTextResolution, textResolutionForZoom } from "../text-resolution.js";
 import { drawFarStroke } from "./far-plate.js";
 import { Container, Graphics, Text } from "pixi.js";
 //#region src/board/render/renderers/arrow-card-renderer.ts
 const partsByContainer = /* @__PURE__ */ new WeakMap();
-/**
-* Frame lookup for resolving bindings.
-*
-* Routed through the context's id index rather than scanning the document: an
-* arrow re-resolves its endpoints on every sync, and a per-arrow O(items) scan
-* would make a board with many arrows quadratic per frame.
-*/
-function frameLookup(context) {
-	return (id) => context.getItem(id)?.frame;
-}
 /** Open chevron arrowhead — clearly directional, not a tiny filled nub. */
 function drawArrowhead(graphics, tip, angle, size, color, strokeWidth) {
 	const spread = Math.PI / 6;
@@ -44,8 +34,8 @@ function sync(container, item, context) {
 	const hovered = context.hoveredId === item.id;
 	const color = pickBoardColor(context.colors, item.color, context.colorScheme);
 	syncTextResolution(parts.label, parts, context.zoom);
-	const resolved = resolveArrow(item, frameLookup(context));
-	const lineSig = resolved ? [
+	const resolved = resolveArrow(item);
+	const lineSig = [
 		resolved.start.x,
 		resolved.start.y,
 		resolved.end.x,
@@ -58,39 +48,37 @@ function sync(container, item, context) {
 		item.size,
 		item.arrowStart,
 		item.arrowEnd
-	].join("|") : `empty|${item.id}`;
+	].join("|");
 	if (lineSig !== parts.lineSig) {
 		parts.lineSig = lineSig;
 		parts.line.clear();
-		if (resolved) {
-			const strokeColor = color.stroke;
-			const width = selected ? item.size + 1 : item.size;
-			const samples = sampleQuadratic(resolved, 24);
-			const head = samples[0];
-			const tail = samples[samples.length - 1];
-			if (head && tail) {
-				parts.line.moveTo(head.x, head.y);
-				for (let i = 1; i < samples.length; i += 1) {
-					const point = samples[i];
-					if (point) parts.line.lineTo(point.x, point.y);
-				}
-				parts.line.stroke({
-					color: strokeColor,
-					width,
-					alpha: selected || hovered ? 1 : .92,
-					cap: "round",
-					join: "round"
-				});
-				const span = Math.hypot(tail.x - head.x, tail.y - head.y);
-				const headSize = Math.min(Math.max(14, item.size * 5.5), Math.max(10, span * .28));
-				if (item.arrowEnd) {
-					const prev = samples[samples.length - 2];
-					if (prev) drawArrowhead(parts.line, tail, Math.atan2(tail.y - prev.y, tail.x - prev.x), headSize, strokeColor, width);
-				}
-				if (item.arrowStart) {
-					const next = samples[1];
-					if (next) drawArrowhead(parts.line, head, Math.atan2(head.y - next.y, head.x - next.x), headSize, strokeColor, width);
-				}
+		const strokeColor = color.stroke;
+		const width = selected ? item.size + 1 : item.size;
+		const samples = sampleArrow(resolved, 24);
+		const head = samples[0];
+		const tail = samples[samples.length - 1];
+		if (head && tail) {
+			parts.line.moveTo(head.x, head.y);
+			for (let i = 1; i < samples.length; i += 1) {
+				const point = samples[i];
+				if (point) parts.line.lineTo(point.x, point.y);
+			}
+			parts.line.stroke({
+				color: strokeColor,
+				width,
+				alpha: selected || hovered ? 1 : .92,
+				cap: "round",
+				join: "round"
+			});
+			const span = Math.hypot(tail.x - head.x, tail.y - head.y);
+			const headSize = Math.min(Math.max(14, item.size * 5.5), Math.max(10, span * .28));
+			if (item.arrowEnd) {
+				const prev = samples[samples.length - 2];
+				if (prev) drawArrowhead(parts.line, tail, Math.atan2(tail.y - prev.y, tail.x - prev.x), headSize, strokeColor, width);
+			}
+			if (item.arrowStart) {
+				const next = samples[1];
+				if (next) drawArrowhead(parts.line, head, Math.atan2(head.y - next.y, head.x - next.x), headSize, strokeColor, width);
 			}
 		}
 	}
@@ -100,8 +88,8 @@ function sync(container, item, context) {
 		parts.label.text = item.label;
 		parts.label.style.fill = color.label;
 	}
-	parts.label.visible = Boolean(resolved && item.label.length > 0);
-	if (resolved) parts.label.position.copyFrom(resolved.control);
+	parts.label.visible = item.label.length > 0;
+	parts.label.position.copyFrom(resolved.control);
 }
 const arrowCardRenderer = {
 	id: "arrow-card",
@@ -139,10 +127,9 @@ const arrowCardRenderer = {
 	},
 	renderFar: (graphics, item, context) => {
 		if (item.type !== "arrow") return;
-		const resolved = resolveArrow(item, frameLookup(context));
-		if (!resolved) return;
+		const resolved = resolveArrow(item);
 		const color = pickBoardColor(context.colors, item.color, context.colorScheme);
-		drawFarStroke(graphics, sampleQuadratic(resolved, 12), {
+		drawFarStroke(graphics, sampleArrow(resolved, 12), {
 			color: color.stroke,
 			width: item.size,
 			alpha: .85