@neta-art/cohub 8.23.0 → 9.0.0

package/dist/board/core/text-metrics.js

@@ -1,43 +1,14 @@
 import { BOARD_TEXT_FONT_FAMILY } from "../../protocol/dist/board-constants.js";
+import { clampBoardFontSize } from "../../protocol/dist/board-layout.js";
 //#region src/board/core/text-metrics.ts
 const TEXT_FONT_FAMILY = BOARD_TEXT_FONT_FAMILY;
 const TEXT_FONT_SIZE = 24;
 const TEXT_LINE_HEIGHT = 32;
 const TEXT_MIN_FONT_SIZE = 2;
 const TEXT_MAX_FONT_SIZE = 512;
-const TEXT_LINE_HEIGHT_RATIO = TEXT_LINE_HEIGHT / TEXT_FONT_SIZE;
-const TEXT_MIN_WIDTH_RATIO = 16 / TEXT_FONT_SIZE;
-const TEXT_HORIZONTAL_PADDING_RATIO = 2 / TEXT_FONT_SIZE;
-const FALLBACK_CHARACTER_RATIO = .52;
-let textMeasurer;
-/** Install the renderer's text measurer, or clear it for environment-free fallback metrics. */
-function setBoardTextMeasurer(measurer) {
-	textMeasurer = measurer;
-}
-function clampBoardTextFontSize(fontSize) {
-	return Math.min(TEXT_MAX_FONT_SIZE, Math.max(TEXT_MIN_FONT_SIZE, fontSize));
-}
-function boardTextLineHeight(fontSize) {
-	return clampBoardTextFontSize(fontSize) * TEXT_LINE_HEIGHT_RATIO;
-}
-/** Measure unwrapped plain text into scalable world-space bounds. */
-function measureBoardText(text, fontSize = TEXT_FONT_SIZE) {
-	const size = clampBoardTextFontSize(fontSize);
-	const lines = (text || " ").split("\n");
-	const minWidth = size * TEXT_MIN_WIDTH_RATIO;
-	const horizontalPadding = size * TEXT_HORIZONTAL_PADDING_RATIO;
-	const lineHeight = boardTextLineHeight(size);
-	const characterWidth = size * FALLBACK_CHARACTER_RATIO;
-	let width = minWidth;
-	for (const line of lines) {
-		const value = line || " ";
-		const measured = textMeasurer?.(value, size);
-		width = Math.max(width, (measured ?? Math.max(1, value.length) * characterWidth) + horizontalPadding);
-	}
-	return {
-		width,
-		height: Math.max(lineHeight, lines.length * lineHeight)
-	};
+function boardFontFamily(font, stacks) {
+	if (font === "sans" || font === "serif" || font === "mono") return stacks[font];
+	return `"${font.replaceAll("\"", "")}", ${stacks.sans}`;
 }
 //#endregion
-export { TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, boardTextLineHeight, clampBoardTextFontSize, measureBoardText, setBoardTextMeasurer };
+export { TEXT_FONT_FAMILY, TEXT_FONT_SIZE, TEXT_LINE_HEIGHT, TEXT_MAX_FONT_SIZE, TEXT_MIN_FONT_SIZE, boardFontFamily, clampBoardFontSize as clampBoardTextFontSize };

package/dist/board/core/tool-styles.d.ts

@@ -1,15 +1,14 @@
 import { BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, clampBoardStrokeSize } from "../../protocol/dist/board-constants.js";
-import { BoardColorId } from "../../protocol/dist/board-node.js";
-import "./palette.js";
-import { GeoKind } from "./shape-types.js";
+import { BoardColorId } from "./palette.js";
+import { ShapeKind } from "./shape-types.js";
 //#region src/board/core/tool-styles.d.ts
 type BoardToolStyleMap = {
   text: {
     color: BoardColorId;
   };
-  geo: {
+  shape: {
     color: BoardColorId;
-    geo: GeoKind;
+    geometry: ShapeKind;
   };
   draw: {
     color: BoardColorId;
@@ -19,10 +18,6 @@ type BoardToolStyleMap = {
     color: BoardColorId;
     size: number;
   };
-  connection: {
-    color: BoardColorId;
-    size: number;
-  };
   frame: {
     color: BoardColorId;
   };
@@ -33,9 +28,9 @@ declare const DEFAULT_BOARD_TOOL_STYLES: {
   readonly text: {
     readonly color: "neutral";
   };
-  readonly geo: {
+  readonly shape: {
     readonly color: "brand";
-    readonly geo: "rectangle";
+    readonly geometry: "rectangle";
   };
   readonly draw: {
     readonly color: "brand";
@@ -45,15 +40,10 @@ declare const DEFAULT_BOARD_TOOL_STYLES: {
     readonly color: "brand";
     readonly size: 2.5;
   };
-  readonly connection: {
-    readonly color: "neutral";
-    readonly size: 2.5;
-  };
   readonly frame: {
     readonly color: "neutral";
   };
 };
-/** Return a mutable, validated style map for an editor or another Board client. */
 declare function createBoardToolStyles(patch?: BoardToolStylePatch): BoardToolStyleMap;
 //#endregion
 export { BOARD_STROKE_MAX_SIZE, BOARD_STROKE_MIN_SIZE, BoardStyledToolId, BoardToolStyleMap, BoardToolStylePatch, DEFAULT_BOARD_TOOL_STYLES, clampBoardStrokeSize, createBoardToolStyles };

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

@@ -1,12 +1,12 @@
-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 { BOARD_ARROW_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";
+import { isShapeKind } from "./shape-types.js";
 //#region src/board/core/tool-styles.ts
 const DEFAULT_BOARD_TOOL_STYLES = {
 	text: { color: "neutral" },
-	geo: {
+	shape: {
 		color: "brand",
-		geo: "rectangle"
+		geometry: "rectangle"
 	},
 	draw: {
 		color: "brand",
@@ -16,39 +16,31 @@ 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;
 }
-/** Return a mutable, validated style map for an editor or another Board client. */
+function colorOr(value, fallback) {
+	return isBoardColorId(value) ? value : fallback;
+}
 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));
+	const defaults = DEFAULT_BOARD_TOOL_STYLES;
 	return {
-		text: { color: isBoardColorId(patch.text?.color) ? patch.text.color : DEFAULT_BOARD_TOOL_STYLES.text.color },
-		geo: {
-			color: isBoardColorId(patch.geo?.color) ? patch.geo.color : DEFAULT_BOARD_TOOL_STYLES.geo.color,
-			geo: isGeoKind(patch.geo?.geo) ? patch.geo.geo : DEFAULT_BOARD_TOOL_STYLES.geo.geo
+		text: { color: colorOr(patch.text?.color, defaults.text.color) },
+		shape: {
+			color: colorOr(patch.shape?.color, defaults.shape.color),
+			geometry: isShapeKind(patch.shape?.geometry) ? patch.shape.geometry : defaults.shape.geometry
 		},
 		draw: {
-			color: isBoardColorId(patch.draw?.color) ? patch.draw.color : DEFAULT_BOARD_TOOL_STYLES.draw.color,
-			size: drawSize
+			color: colorOr(patch.draw?.color, defaults.draw.color),
+			size: clampBoardStrokeSize(finiteOr(patch.draw?.size, defaults.draw.size))
 		},
 		arrow: {
-			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
+			color: colorOr(patch.arrow?.color, defaults.arrow.color),
+			size: clampBoardStrokeSize(finiteOr(patch.arrow?.size, defaults.arrow.size))
 		},
-		frame: { color: isBoardColorId(patch.frame?.color) ? patch.frame.color : DEFAULT_BOARD_TOOL_STYLES.frame.color }
+		frame: { color: colorOr(patch.frame?.color, defaults.frame.color) }
 	};
 }
 //#endregion

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

@@ -1,28 +1,29 @@
-import { BoardDocument, BoardItem } from "../../protocol/dist/board-document.js";
+import { BoardDocument } from "../../protocol/dist/board-model.js";
+import "../../protocol/dist/index.js";
+import { BoardSceneItem } from "../core/scene.js";
 import { BoardExportPlan, BoardExportPlanInput, BoardExportRegion } from "../core/export-plan.js";
 import { BoardShapeColors } from "../core/palette.js";
-import { BoardRenderPalette } from "../render/renderers/board-renderer-registry.js";
+import { BoardRenderPalette, BoardSketchHost } from "../render/renderers/board-renderer-registry.js";
 import "../render/index.js";
 import { BoardExportScene, BoardExportSceneInput, createBoardExportScene } from "./scene.js";
 import { ICanvas, Renderer, Texture } from "pixi.js";
 //#region src/board/export/index.d.ts
-/** Paper behind the content: the theme's page color, or none at all. */
 type BoardExportBackground = "paper" | "transparent" | number;
 type BoardExportOptions = {
   region?: BoardExportRegion;
-  /** Output pixels per world unit. Defaults to 2. */
+  at?: {
+    animation?: string;
+    time: number;
+  };
   scale?: number;
-  /** World-space padding. Frame and rect regions default to 0, others to 32. */
   padding?: number;
   colorScheme?: "dark" | "light";
-  /** Defaults to "paper" — a transparent PNG surprises people who paste it. */
   background?: BoardExportBackground;
   palette?: Partial<BoardRenderPalette>;
   colors?: BoardShapeColors;
-  /** Resolved textures by preview key; unresolved keys become placeholders. */
   textures?: Map<string, Texture>;
-  /** Preview-key strategy supplied by the host; defaults to still images only. */
-  assetKey?: (item: BoardItem) => string | null;
+  sketches?: BoardSketchHost;
+  assetKey?: (item: BoardSceneItem) => string | null;
   backgroundImage?: {
     texture: Texture;
     fit: "cover" | "contain" | "repeat";
@@ -48,15 +49,7 @@ type BoardExportResult = {
   plan: BoardExportPlan;
   warnings: BoardExportWarning[];
 };
-/**
- * Capture a board region as a canvas.
- *
- * Returns null when the region is empty — an empty selection is a no-op, not a
- * failure. The scene is always destroyed, so a throwing renderer cannot leak
- * GPU resources.
- */
 declare function renderBoardExport(renderer: Renderer, input: BoardDocument, options?: BoardExportOptions): BoardExportResult | null;
-/** Human-readable form of a warning, shared by the CLI and the web UI. */
 declare function describeBoardExportWarning(warning: BoardExportWarning): string;
 //#endregion
 export { BoardExportBackground, BoardExportOptions, type BoardExportPlan, type BoardExportPlanInput, type BoardExportRegion, BoardExportResult, type BoardExportScene, type BoardExportSceneInput, BoardExportWarning, createBoardExportScene, describeBoardExportWarning, renderBoardExport };

package/dist/board/export/index.js

@@ -1,26 +1,26 @@
+import { boardDocumentAt } from "../animation.js";
 import { normalizeBoardDocument, planBoardExport } from "../core/export-plan.js";
+import { buildBoardScene } from "../core/scene.js";
 import { parseBoardCssColor } from "../render/css-color.js";
 import { defaultBoardPalette } from "../render/palette.js";
+import { ensureBoardTextMeasurement } from "../render/text-measurement.js";
 import { createBoardExportScene } from "./scene.js";
 import { Rectangle } from "pixi.js";
 //#region src/board/export/index.ts
-function resolveBackground(background, palette, document) {
+function resolveBackground(background, palette, document, colorScheme) {
 	if (background === "transparent") return null;
 	if (typeof background === "number") return background;
-	const declared = document.appearance.background.color;
-	return declared ? parseBoardCssColor(declared) ?? palette.bg : palette.bg;
+	const declared = document.board.background.color;
+	const css = typeof declared === "object" ? declared[colorScheme] : declared;
+	return css ? parseBoardCssColor(css) ?? palette.bg : palette.bg;
 }
-/**
-* Capture a board region as a canvas.
-*
-* Returns null when the region is empty — an empty selection is a no-op, not a
-* failure. The scene is always destroyed, so a throwing renderer cannot leak
-* GPU resources.
-*/
 function renderBoardExport(renderer, input, options = {}) {
-	const document = normalizeBoardDocument(input);
+	ensureBoardTextMeasurement();
+	const base = normalizeBoardDocument(input);
+	const document = options.at ? boardDocumentAt(base, options.at.animation ?? null, options.at.time).document : base;
+	const scene = buildBoardScene(document);
 	const plan = planBoardExport({
-		document,
+		scene,
 		region: options.region ?? { kind: "all" },
 		scale: options.scale,
 		padding: options.padding,
@@ -33,23 +33,25 @@ function renderBoardExport(renderer, input, options = {}) {
 		...defaultBoardPalette(colorScheme),
 		...options.palette
 	};
-	const scene = createBoardExportScene({
-		document,
+	const exportScene = createBoardExportScene({
+		settings: document.board,
+		scene,
 		items: plan.items,
-		connections: plan.connections,
+		time: options.at?.time ?? 0,
 		world: plan.world,
 		scale: plan.scale,
 		colorScheme,
 		palette,
 		colors: options.colors,
 		textures: options.textures,
+		sketches: options.sketches,
 		assetKey: options.assetKey,
-		background: resolveBackground(options.background, palette, document),
+		background: resolveBackground(options.background, palette, document, colorScheme),
 		backgroundImage: options.backgroundImage
 	});
 	try {
 		const canvas = renderer.extract.canvas({
-			target: scene.root,
+			target: exportScene.root,
 			frame: new Rectangle(0, 0, plan.width, plan.height),
 			resolution: 1,
 			antialias: true,
@@ -61,9 +63,9 @@ function renderBoardExport(renderer, input, options = {}) {
 			requested: plan.requestedScale,
 			applied: plan.scale
 		});
-		if (scene.missingImageKeys.length > 0) warnings.push({
+		if (exportScene.missingImageKeys.length > 0) warnings.push({
 			kind: "images-missing",
-			keys: scene.missingImageKeys
+			keys: exportScene.missingImageKeys
 		});
 		if (plan.items.length > 2e3) warnings.push({
 			kind: "many-items",
@@ -75,10 +77,9 @@ function renderBoardExport(renderer, input, options = {}) {
 			warnings
 		};
 	} finally {
-		scene.destroy();
+		exportScene.destroy();
 	}
 }
-/** Human-readable form of a warning, shared by the CLI and the web UI. */
 function describeBoardExportWarning(warning) {
 	switch (warning.kind) {
 		case "scale-clamped": return `Scale reduced from ${warning.requested}x to ${warning.applied.toFixed(2)}x to stay within the size limit.`;

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

@@ -1,29 +1,25 @@
-import { BoardConnection } from "../../protocol/dist/board-connection.js";
-import { BoardDocument, BoardItem } from "../../protocol/dist/board-document.js";
+import { BoardSettings } from "../../protocol/dist/board-model.js";
+import "../../protocol/dist/index.js";
 import { Rect } from "../geometry.js";
+import { BoardScene, BoardSceneItem } from "../core/scene.js";
 import { BoardShapeColors } from "../core/palette.js";
-import { BoardRenderPalette } from "../render/renderers/board-renderer-registry.js";
+import { BoardRenderContext, BoardRenderPalette } from "../render/renderers/board-renderer-registry.js";
 import "../render/index.js";
 import { Container, Texture } from "pixi.js";
 //#region src/board/export/scene.d.ts
 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. */
+  settings: BoardSettings;
+  scene: BoardScene;
+  items: readonly BoardSceneItem[];
+  time?: number;
   world: Rect;
-  /** Output pixels per world unit. Drives text rasterisation resolution. */
   scale: number;
   colorScheme: "dark" | "light";
   palette?: Partial<BoardRenderPalette>;
   colors?: BoardShapeColors;
-  /** Resolved textures by preview key. Missing keys render as placeholders. */
   textures?: Map<string, Texture>;
-  /** Preview-key strategy supplied by the host; defaults to still images only. */
-  assetKey?: (item: BoardItem) => string | null;
-  /** Opaque paper behind the content, or null for transparency. */
+  sketches?: BoardRenderContext["sketches"];
+  assetKey?: (item: BoardSceneItem) => string | null;
   background?: number | null;
   backgroundImage?: {
     texture: Texture;
@@ -33,9 +29,7 @@ type BoardExportSceneInput = {
   };
 };
 type BoardExportScene = {
-  /** Root to hand to the renderer; already positioned and scaled. */
   root: Container;
-  /** Image keys the scene wanted but could not resolve. */
   missingImageKeys: string[];
   destroy: () => void;
 };

package/dist/board/export/scene.js

@@ -1,24 +1,18 @@
 import { imageAssetKey } from "../image-key.js";
 import { buildFallbackShapeColors } from "../core/palette.js";
-import { createConnectionLayer } from "../render/connection-layer.js";
+import { clippingAncestor, isClippingFrame, syncClipGroup } from "../render/clip.js";
 import { defaultBoardPalette } from "../render/palette.js";
 import { getBoardCardRenderer } from "../render/renderers/board-renderer-registry.js";
 import { Container, Graphics, Sprite, TilingSprite } from "pixi.js";
 //#region src/board/export/scene.ts
-/**
-* Render context for an export.
-*
-* Interaction state is empty by construction: nothing is selected, hovered or
-* resizing, so no editor chrome (outlines, handles) can leak into the image.
-*/
 function buildContext(input) {
 	const missing = /* @__PURE__ */ new Set();
-	const byId = new Map(input.document.items.map((item) => [item.id, item]));
 	const textures = input.textures ?? /* @__PURE__ */ new Map();
 	return {
 		context: {
-			document: input.document,
-			getItem: (id) => byId.get(id) ?? null,
+			settings: input.settings,
+			scene: input.scene,
+			time: input.time ?? 0,
 			selectedIds: /* @__PURE__ */ new Set(),
 			hoveredId: null,
 			resizingIds: /* @__PURE__ */ new Set(),
@@ -30,6 +24,7 @@ function buildContext(input) {
 			colorScheme: input.colorScheme,
 			rendererType: "canvas",
 			zoom: input.scale,
+			sketches: input.sketches,
 			assetKey: input.assetKey ?? imageAssetKey,
 			getTexture: (key) => textures.get(key) ?? null,
 			hasError: (key) => {
@@ -80,32 +75,24 @@ 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,
-			cullRect: input.world
-		});
-	}
+	const groups = /* @__PURE__ */ new Map();
 	for (const item of input.items) {
-		const renderer = getBoardCardRenderer(item, context);
-		world.addChild(renderer.create(item, context));
+		const clip = clippingAncestor(input.scene, item);
+		const host = clip && groups.get(clip) || world;
+		const container = getBoardCardRenderer(item, context).create(item, context);
+		container.alpha = input.scene.opacity(item.id);
+		host.addChild(container);
+		if (isClippingFrame(item)) {
+			const { group } = syncClipGroup(void 0, item);
+			host.addChild(group);
+			groups.set(item.id, group);
+		}
 	}
 	root.addChild(world);
 	return {
 		root,
 		missingImageKeys: [...missing],
-		destroy: () => {
-			connectionLayer?.destroy();
-			root.destroy({ children: true });
-		}
+		destroy: () => root.destroy({ children: true })
 	};
 }
 //#endregion

package/dist/board/geometry.d.ts

@@ -1,7 +1,28 @@
-import { BoardCameraFocus, BoardCameraFocusParams, BoardCameraState } from "../protocol/dist/board.js";
-import { BoardFrame, BoardViewport } from "../protocol/dist/board-document.js";
+import { BoardFrame } from "../protocol/dist/board-layout.js";
 import "../protocol/dist/index.js";
 //#region src/board/geometry.d.ts
+type BoardViewport = {
+  x: number;
+  y: number;
+  zoom: number;
+};
+type BoardCameraState = {
+  centerX: number;
+  centerY: number;
+  zoom: number;
+};
+type BoardCameraFocus = string | {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+};
+type BoardCameraFit = {
+  fit?: "contain" | "cover";
+  padding?: number;
+  minZoom?: number;
+  maxZoom?: number;
+};
 type Point = {
   x: number;
   y: number;
@@ -17,13 +38,11 @@ type Size = {
   height: number;
 };
 declare const coordBrand: unique symbol;
-/** Surface-relative screen coordinate, in CSS pixels. */
 type ScreenPoint = {
   x: number;
   y: number;
   readonly [coordBrand]: "screen";
 };
-/** Board world coordinate, in board units. */
 type WorldPoint = {
   x: number;
   y: number;
@@ -52,20 +71,11 @@ declare function normalizedPoint(x: number, y: number): BoardNormalizedPoint;
 declare function worldRect(x: number, y: number, width: number, height: number): BoardWorldRect;
 declare const MIN_BOARD_ZOOM = 0.05;
 declare const MAX_BOARD_ZOOM = 8;
-/** Smallest an item can be resized to, in world units. */
 declare const MIN_ITEM_SIZE = 24;
-/** Extra world-space padding applied when fitting content into view. */
 declare const FIT_PADDING = 64;
-/**
- * Fraction of the viewport's larger dimension used as an off-screen margin for
- * both card culling and texture preloading. Keeping them equal means a card's
- * texture is already requested before the card scrolls into view.
- */
 declare const VIEWPORT_MARGIN_RATIO = 0.5;
-/** Viewport plus margin, snapped to a grid so small pans return the same rect. */
 declare function stableCullRect(view: Rect): Rect;
 declare function clampZoom(zoom: number): number;
-/** Keep transient camera state finite without discarding its last valid axes. */
 declare function normalizeViewport(viewport: BoardViewport, fallback?: BoardViewport): BoardViewport;
 declare function clamp(value: number, min: number, max: number): number;
 declare function degToRad(degrees: number): number;
@@ -78,18 +88,12 @@ declare function expandRect(rect: Rect, amount: number): Rect;
 declare function pointsBounds(points: readonly Point[], minSize?: number): Rect | null;
 declare function unionRects(rects: Rect[]): Rect | null;
 declare function rotatePointAround<P extends Point>(point: P, center: Point, angleRad: number): P;
-/** Axis-aligned bounding box of a (possibly rotated) frame. */
 declare function itemBounds(frame: BoardFrame): Rect;
 declare function selectionBounds(frames: BoardFrame[]): Rect | null;
-/** Exact point-in-frame test, accounting for rotation. */
 declare function frameContainsPoint(frame: BoardFrame, point: WorldPoint): boolean;
-/** World position of a resize handle on a single (possibly rotated) frame. */
 declare function frameHandlePosition(frame: BoardFrame, handle: ResizeHandle): WorldPoint;
-/** Corners in clockwise order, following the frame's rotation. */
 declare function frameCorners(frame: BoardFrame): readonly WorldPoint[];
-/** Screen-space radius (px) within which a pointer grabs a handle. */
 declare const HANDLE_HIT_RADIUS = 8;
-/** Screen-space offset (px) from the selection's lower-facing edge. */
 declare const ROTATION_HANDLE_OFFSET = 28;
 declare function frameRayIntersection(frame: Rect & {
   rotation?: number;
@@ -104,64 +108,31 @@ type ResizeHandle = "nw" | "n" | "ne" | "e" | "se" | "s" | "sw" | "w";
 declare const CORNER_RESIZE_HANDLES: readonly ["nw", "ne", "se", "sw"];
 declare const EDGE_RESIZE_HANDLES: readonly ["n", "e", "s", "w"];
 type CornerResizeHandle = (typeof CORNER_RESIZE_HANDLES)[number];
-/** Screen-space depth of the rotation zone outside each resize corner. */
 declare const CORNER_ROTATION_ZONE_WIDTH = 16;
 declare const RESIZE_HANDLES: ResizeHandle[];
-/**
- * Hit-test the outward quadrant around each corner, outside its resize target.
- * This gives fine pointers Figma-style corner rotation without adding chrome.
- */
 declare function frameCornerRotationHandleAt(frame: BoardFrame, point: WorldPoint, zoom: number, screenRadius?: number): CornerResizeHandle | null;
-/**
- * Hit-test the continuous edge zones of a rotated frame. Corners are inset so
- * their resize handles retain priority even on small nodes.
- */
 declare function frameEdgeHandleAt(frame: BoardFrame, point: WorldPoint, zoom: number, screenRadius?: number): Extract<ResizeHandle, "n" | "e" | "s" | "w"> | null;
-/** Direction of a handle from the rect center: -1, 0, or 1 per axis. */
 declare const HANDLE_DIRECTION: Record<ResizeHandle, Point>;
-/** Position of a handle on an unrotated rect. */
 declare function handlePosition(rect: Rect, handle: ResizeHandle): WorldPoint;
-/** Resize a frame to exact dimensions while keeping the opposite handle fixed. */
 declare function resizeFrameToSize(frame: BoardFrame, handle: ResizeHandle, width: number, height: number): BoardFrame;
-/**
- * Resize a frame by dragging a handle to a world-space pointer position.
- * The edge/corner opposite the handle stays anchored. Works correctly for
- * rotated frames by performing the resize in the frame's local space.
- */
-declare function resizeFrame(frame: BoardFrame, handle: ResizeHandle, pointer: WorldPoint, minSize?: number,
-/** Keep the original aspect ratio (Shift). */
-keepAspect?: boolean): BoardFrame;
-/**
- * Proportionally scale a group of frames by dragging a corner handle of their
- * combined bounds. Individual rotations are preserved.
- */
+declare function resizeFrame(frame: BoardFrame, handle: ResizeHandle, pointer: WorldPoint, minSize?: number, keepAspect?: boolean): BoardFrame;
 declare function scaleFrames(frames: BoardFrame[], bounds: Rect, handle: ResizeHandle, pointer: WorldPoint, minSize?: number, scaleRange?: {
   min?: number;
   max?: number;
 }): BoardFrame[];
-/** Angle (degrees) from a center to a world-space pointer. */
 declare function angleFromCenter(center: WorldPoint, pointer: WorldPoint): number;
-/**
- * Rotate a set of frames around a pivot by a delta (degrees). Each frame's
- * center orbits the pivot and its own rotation increases by the delta.
- */
 declare function rotateFrames(frames: BoardFrame[], pivot: WorldPoint, deltaDeg: number): BoardFrame[];
-/** Normalize a rotation into the [-180, 180] range for tidy persistence. */
 declare function normalizeRotation(degrees: number): number;
-/** Convert a surface-relative screen point into world space. */
 declare function pointToWorld(point: ScreenPoint, viewport: BoardViewport): WorldPoint;
 declare function worldToScreen(point: WorldPoint, viewport: BoardViewport): ScreenPoint;
 declare function screenToWorld(clientX: number, clientY: number, rect: DOMRect, viewport: BoardViewport): WorldPoint;
-/** Zoom while keeping a surface-relative screen point fixed under the cursor. */
 declare function zoomAround(viewport: BoardViewport, anchor: ScreenPoint, nextZoom: number): BoardViewport;
 declare function panBy(viewport: BoardViewport, dx: number, dy: number): BoardViewport;
 declare function cameraForState(state: BoardCameraState, surface: Size): BoardViewport;
-declare function cameraForRect(content: Rect, surface: Size, options?: Pick<BoardCameraFocusParams, "fit" | "padding" | "minZoom" | "maxZoom">): BoardViewport;
+declare function cameraForRect(content: Rect, surface: Size, options?: BoardCameraFit): BoardViewport;
 declare function rectForCameraFocus(focus: BoardCameraFocus, getFrame: (id: string) => BoardFrame | null | undefined): Rect | null;
-declare function cameraForFocus(params: BoardCameraFocusParams, getFrame: (id: string) => BoardFrame | null | undefined, surface: Size): BoardViewport | null;
-/** Compute a viewport that frames the given world rect within the surface. */
+declare function cameraForFocus(focus: BoardCameraFocus, getFrame: (id: string) => BoardFrame | null | undefined, surface: Size, options?: BoardCameraFit): BoardViewport | null;
 declare function fitToContent(content: Rect, surface: Size, padding?: number): BoardViewport;
-/** World-space rectangle currently visible in the board stage. */
 declare function visibleWorldRect(viewport: BoardViewport, surfaceWidth: number, surfaceHeight: number): Rect;
 //#endregion
-export { BoardNormalizedPoint, BoardScreenOffset, BoardScreenPoint, BoardWorldOffset, BoardWorldPoint, BoardWorldRect, 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, cameraForFocus, cameraForRect, cameraForState, clamp, clampZoom, degToRad, expandRect, fitToContent, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, handlePosition, itemBounds, normalizeRotation, normalizeViewport, normalizedPoint, panBy, pointToWorld, pointsBounds, radToDeg, rectCenter, rectContainsPoint, rectForCameraFocus, rectsIntersect, resizeFrame, resizeFrameToSize, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, scaleFrames, screenOffset, screenPoint, screenToWorld, selectionBounds, stableCullRect, unionRects, visibleWorldRect, worldOffset, worldPoint, worldRect, worldToScreen, zoomAround };
+export { BoardCameraFit, BoardCameraFocus, BoardCameraState, BoardNormalizedPoint, BoardScreenOffset, BoardScreenPoint, BoardViewport, BoardWorldOffset, BoardWorldPoint, BoardWorldRect, 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, cameraForFocus, cameraForRect, cameraForState, clamp, clampZoom, degToRad, expandRect, fitToContent, frameContainsPoint, frameCornerRotationHandleAt, frameCorners, frameEdgeHandleAt, frameHandlePosition, frameRayIntersection, frameRect, handlePosition, itemBounds, normalizeRotation, normalizeViewport, normalizedPoint, panBy, pointToWorld, pointsBounds, radToDeg, rectCenter, rectContainsPoint, rectForCameraFocus, rectsIntersect, resizeFrame, resizeFrameToSize, rotateFrames, rotatePointAround, rotationHandleAnchor, rotationHandlePosition, scaleFrames, screenOffset, screenPoint, screenToWorld, selectionBounds, stableCullRect, unionRects, visibleWorldRect, worldOffset, worldPoint, worldRect, worldToScreen, zoomAround };