@neta-art/cohub 12.1.1 → 12.3.0

package/dist/board/model/themes.js

@@ -0,0 +1,500 @@
+//#region src/board/model/themes.ts
+const BOARD_THEME_IDS = [
+	"dark",
+	"light",
+	"solarized-dark",
+	"solarized-light",
+	"neta-studio",
+	"neta-pixel",
+	"neta-pixel-dark"
+];
+const BOARD_THEME_DATA = {
+	dark: {
+		colorScheme: "dark",
+		palette: {
+			bg: 1053203,
+			surface: 2369321,
+			hover: 2500907,
+			border: 3158838,
+			brand: 14564909,
+			text: 15330286,
+			muted: 10198947,
+			rare: 6009047,
+			epic: 2070983,
+			legendary: 15580004
+		},
+		colors: {
+			brand: {
+				stroke: 14564909,
+				fill: 14564909,
+				label: 15330286
+			},
+			neutral: {
+				stroke: 10198947,
+				fill: 10198947,
+				label: 15330286
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 15330286
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 15330286
+			},
+			blue: {
+				stroke: 6009047,
+				fill: 6009047,
+				label: 15330286
+			},
+			green: {
+				stroke: 7065501,
+				fill: 7065501,
+				label: 15330286
+			},
+			amber: {
+				stroke: 15580004,
+				fill: 15580004,
+				label: 15330286
+			},
+			violet: {
+				stroke: 11971577,
+				fill: 11971577,
+				label: 15330286
+			},
+			rose: {
+				stroke: 15950429,
+				fill: 15950429,
+				label: 15330286
+			}
+		},
+		style: {}
+	},
+	light: {
+		colorScheme: "light",
+		palette: {
+			bg: 16251130,
+			surface: 16777215,
+			hover: 15330029,
+			border: 14409442,
+			brand: 13582898,
+			text: 66050,
+			muted: 6251625,
+			rare: 24458,
+			epic: 19325,
+			legendary: 8804608
+		},
+		colors: {
+			brand: {
+				stroke: 13582898,
+				fill: 13582898,
+				label: 66050
+			},
+			neutral: {
+				stroke: 6251625,
+				fill: 6251625,
+				label: 66050
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 66050
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 66050
+			},
+			blue: {
+				stroke: 24458,
+				fill: 24458,
+				label: 66050
+			},
+			green: {
+				stroke: 26685,
+				fill: 26685,
+				label: 66050
+			},
+			amber: {
+				stroke: 8804608,
+				fill: 8804608,
+				label: 66050
+			},
+			violet: {
+				stroke: 6904238,
+				fill: 6904238,
+				label: 66050
+			},
+			rose: {
+				stroke: 10165794,
+				fill: 10165794,
+				label: 66050
+			}
+		},
+		style: {}
+	},
+	"solarized-dark": {
+		colorScheme: "dark",
+		palette: {
+			bg: 70677,
+			surface: 859936,
+			hover: 1057828,
+			border: 1582887,
+			brand: 34240,
+			text: 12572374,
+			muted: 6848639,
+			rare: 2206648,
+			epic: 38821,
+			legendary: 14790474
+		},
+		colors: {
+			brand: {
+				stroke: 34240,
+				fill: 34240,
+				label: 12572374
+			},
+			neutral: {
+				stroke: 6848639,
+				fill: 6848639,
+				label: 12572374
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 12572374
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 12572374
+			},
+			blue: {
+				stroke: 2206648,
+				fill: 2206648,
+				label: 12572374
+			},
+			green: {
+				stroke: 9481815,
+				fill: 9481815,
+				label: 12572374
+			},
+			amber: {
+				stroke: 14790474,
+				fill: 14790474,
+				label: 12572374
+			},
+			violet: {
+				stroke: 11182560,
+				fill: 11182560,
+				label: 12572374
+			},
+			rose: {
+				stroke: 15950429,
+				fill: 15950429,
+				label: 12572374
+			}
+		},
+		style: {}
+	},
+	"solarized-light": {
+		colorScheme: "light",
+		palette: {
+			bg: 16775902,
+			surface: 16446169,
+			hover: 15920337,
+			border: 14341313,
+			brand: 31924,
+			text: 2110772,
+			muted: 5860973,
+			rare: 28541,
+			epic: 23659,
+			legendary: 8936704
+		},
+		colors: {
+			brand: {
+				stroke: 31924,
+				fill: 31924,
+				label: 2110772
+			},
+			neutral: {
+				stroke: 5860973,
+				fill: 5860973,
+				label: 2110772
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 2110772
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 2110772
+			},
+			blue: {
+				stroke: 28541,
+				fill: 28541,
+				label: 2110772
+			},
+			green: {
+				stroke: 4809217,
+				fill: 4809217,
+				label: 2110772
+			},
+			amber: {
+				stroke: 8936704,
+				fill: 8936704,
+				label: 2110772
+			},
+			violet: {
+				stroke: 6904995,
+				fill: 6904995,
+				label: 2110772
+			},
+			rose: {
+				stroke: 10363429,
+				fill: 10363429,
+				label: 2110772
+			}
+		},
+		style: {}
+	},
+	"neta-studio": {
+		colorScheme: "dark",
+		palette: {
+			bg: 329221,
+			surface: 2039072,
+			hover: 1842202,
+			border: 1842202,
+			brand: 3900150,
+			text: 15920612,
+			muted: 9999759,
+			rare: 9235170,
+			epic: 7266776,
+			legendary: 15449187
+		},
+		colors: {
+			brand: {
+				stroke: 15524306,
+				fill: 15524306,
+				label: 15920612
+			},
+			neutral: {
+				stroke: 15920612,
+				fill: 15920612,
+				label: 15920612
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 15920612
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 15920612
+			},
+			blue: {
+				stroke: 9235170,
+				fill: 9235170,
+				label: 15920612
+			},
+			green: {
+				stroke: 8177036,
+				fill: 8177036,
+				label: 15920612
+			},
+			amber: {
+				stroke: 15449187,
+				fill: 15449187,
+				label: 15920612
+			},
+			violet: {
+				stroke: 11971327,
+				fill: 11971327,
+				label: 15920612
+			},
+			rose: {
+				stroke: 15562341,
+				fill: 15562341,
+				label: 15920612
+			}
+		},
+		style: {
+			selection: { outset: 0 },
+			frameLabelSize: 16
+		}
+	},
+	"neta-pixel": {
+		colorScheme: "light",
+		palette: {
+			bg: 16185078,
+			surface: 16777215,
+			hover: 15461355,
+			border: 14935011,
+			brand: 1824230,
+			text: 1447704,
+			muted: 7566452,
+			rare: 31378,
+			epic: 31378,
+			legendary: 9725440
+		},
+		colors: {
+			brand: {
+				stroke: 1447704,
+				fill: 1447704,
+				label: 1447704
+			},
+			neutral: {
+				stroke: 7566452,
+				fill: 7566452,
+				label: 1447704
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 1447704
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 1447704
+			},
+			blue: {
+				stroke: 6010853,
+				fill: 6010853,
+				label: 1447704
+			},
+			green: {
+				stroke: 9683613,
+				fill: 9683613,
+				label: 1447704
+			},
+			amber: {
+				stroke: 14264410,
+				fill: 14264410,
+				label: 1447704
+			},
+			violet: {
+				stroke: 11441117,
+				fill: 11441117,
+				label: 1447704
+			},
+			rose: {
+				stroke: 15043210,
+				fill: 15043210,
+				label: 1447704
+			}
+		},
+		style: {
+			corner: "pixel",
+			shadow: {
+				color: 1447704,
+				alpha: .1,
+				blur: 20,
+				y: 0
+			},
+			selection: {
+				width: 1.5,
+				outset: 0,
+				dash: 0,
+				handle: "square",
+				handleSize: 8
+			},
+			media: "framed",
+			progress: "mosaic",
+			icons: "pixel",
+			motion: "stepped",
+			font: "\"Figtree Variable\", \"PingFang SC\", \"Noto Sans CJK SC\", \"Microsoft YaHei\", system-ui, sans-serif",
+			frameLabelSize: 16
+		}
+	},
+	"neta-pixel-dark": {
+		colorScheme: "dark",
+		palette: {
+			bg: 1447704,
+			surface: 2631979,
+			hover: 3224115,
+			border: 3618875,
+			brand: 1824230,
+			text: 15921907,
+			muted: 9408656,
+			rare: 1824230,
+			epic: 1824230,
+			legendary: 16766287
+		},
+		colors: {
+			brand: {
+				stroke: 16185078,
+				fill: 16185078,
+				label: 15921907
+			},
+			neutral: {
+				stroke: 9408656,
+				fill: 9408656,
+				label: 15921907
+			},
+			black: {
+				stroke: 0,
+				fill: 0,
+				label: 15921907
+			},
+			white: {
+				stroke: 16777215,
+				fill: 16777215,
+				label: 15921907
+			},
+			blue: {
+				stroke: 6010853,
+				fill: 6010853,
+				label: 15921907
+			},
+			green: {
+				stroke: 9683613,
+				fill: 9683613,
+				label: 15921907
+			},
+			amber: {
+				stroke: 14264410,
+				fill: 14264410,
+				label: 15921907
+			},
+			violet: {
+				stroke: 11441117,
+				fill: 11441117,
+				label: 15921907
+			},
+			rose: {
+				stroke: 15043210,
+				fill: 15043210,
+				label: 15921907
+			}
+		},
+		style: {
+			corner: "pixel",
+			shadow: {
+				color: 0,
+				alpha: .4,
+				blur: 20,
+				y: 0
+			},
+			selection: {
+				width: 1.5,
+				outset: 0,
+				dash: 0,
+				handle: "square",
+				handleSize: 8
+			},
+			media: "framed",
+			progress: "mosaic",
+			icons: "pixel",
+			motion: "stepped",
+			font: "\"Figtree Variable\", \"PingFang SC\", \"Noto Sans CJK SC\", \"Microsoft YaHei\", system-ui, sans-serif",
+			frameLabelSize: 16
+		}
+	}
+};
+//#endregion
+export { BOARD_THEME_DATA, BOARD_THEME_IDS };

package/dist/board/render/card-tag.js

@@ -113,7 +113,7 @@ function drawLineGlyph(graphics, glyph, color) {
 				11,
 				2.5,
 				11
-			]).stroke(line);
+			], true).stroke(line);
 			graphics.moveTo(7.5, 1).lineTo(7.5, 3).lineTo(9.5, 3).stroke(line);
 			return;
 		case "task":
@@ -154,7 +154,7 @@ function traceCube(graphics, cx, cy, radius) {
 		cy + dy,
 		cx - dx,
 		cy - dy
-	]).moveTo(cx - dx, cy - dy).lineTo(cx, cy).lineTo(cx + dx, cy - dy).moveTo(cx, cy).lineTo(cx, cy + radius);
+	], true).moveTo(cx - dx, cy - dy).lineTo(cx, cy).lineTo(cx + dx, cy - dy).moveTo(cx, cy).lineTo(cx, cy + radius);
 	return graphics;
 }
 function drawCardGlyph(graphics, glyph, color, pixel) {

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

@@ -1,20 +1,24 @@
-import { BoardRenderStyle, BoardSelectionStyle, BoardShadowStyle, defaultBoardRenderStyle, resolveBoardRenderStyle } from "./style.js";
-import { BoardCardRenderer, BoardCardRendererResolver, BoardRenderContext, BoardRenderLabels, BoardRenderPalette, BoardScriptHost, DEFAULT_BOARD_RENDER_LABELS, createBoardCardRendererResolver, getBoardCardRenderer } from "./renderers/board-renderer-registry.js";
+import { BoardRenderStyle, BoardRenderStyleInput, BoardSelectionStyle, BoardShadowStyle, defaultBoardRenderStyle, resolveBoardRenderStyle } from "./style.js";
+import { BOARD_LOD_HYSTERESIS, BoardLod, BoardLodKind, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, boardLodRatio, boardLodSize, boardLongEdge, boardTextSize } from "./lod.js";
+import { BoardCardHit, BoardCardRenderer, BoardCardRendererResolver, BoardRenderContext, BoardRenderLabels, BoardRenderPalette, BoardScriptHost, DEFAULT_BOARD_RENDER_LABELS, createBoardCardRendererResolver, getBoardCardRenderer } from "./renderers/board-renderer-registry.js";
 import { createBoardRenderSampler } from "./sampling.js";
 import { BoardRenderDiagnostic, inspectBoardItems, inspectBoardScene, measureBoardText } from "./diagnostics.js";
 import { BoardBackgroundContext, createBoardBackground, updateBoardBackground } from "./board-background.js";
 import { CARD_TAG_SIZE, CardGlyph, CardTag, createCardTag, drawCardGlyph, formatBoardDuration, syncCardTag, traceCube, zoomCardTag } from "./card-tag.js";
 import { ClipGroup, clippingAncestor, isClippingFrame, syncClipGroup, traceFrameOutline } from "./clip.js";
 import { BoardCssPaint, parseBoardCssColor, parseBoardCssPaint } from "./css-color.js";
-import { BoardMediaAction, boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayKeyCenter } from "./media-interaction.js";
+import { BOARD_PLAY_MEDIA, BoardMediaAction, boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayHit, mediaPlayKeyCenter } from "./media-interaction.js";
 import { defaultBoardPalette, itemAlpha, itemColor } from "./palette.js";
 import { BoardScriptHostOptions, BrowserBoardScriptHost, createBoardScriptHost } from "./script-host.js";
 import { prepareBrowserBoardScripts } from "./script-export.js";
 import { dashPattern, endAngle, roundRectPoints, traceArrowhead, tracePolyline, trimPolyline } from "./stroke.js";
 import { CardCrop, CardElevation, CardRect, CardSurface, PIXEL_STEP, cardElevation, cardOutlinePoints, cardShadow, containRect, drawCardShadow, drawCardSurface, fillCardPicture, isBoardCard, traceCardOutline, tracePixelRect } from "./surface.js";
+import { BoardRenderTheme, boardRenderTheme } from "./theme.js";
 import { BOARD_EFFECT_MAX_PARTICLES } from "./renderers/effect-card-renderer.js";
-import { ellipsizeWrappedLines, fitLineWithEllipsis, fitTextToLines, fitTextToWidth } from "./text-fit.js";
-import { BOARD_FONT_STACKS, ensureBoardTextMeasurement, installBoardTextMeasurement } from "./text-measurement.js";
-import { boardCardDetailed, boardTextResolution, getBoardResolution, syncTextResolution, syncTextWrapWidth, textZoomBucket } from "./text-resolution.js";
+import { FarPlateStyle, drawFarBars, drawFarPlate, farPictureTone } from "./renderers/far-plate.js";
+import { BOARD_FONT_STACKS, BoardTextLineLayout, BoardTextLineOptions, BoardTextStyle, BoardTextWhiteSpace, boardTextStyle, canvasFont, canvasFontFamily, cssBaselineShift, ensureBoardTextMeasurement, fitLineWithEllipsis, installBoardTextMeasurement, layoutTextLines, measureTextWidth, onBoardTextFontsChange } from "./text-measurement.js";
+import { BoardTextEditInput, BoardTextEditLayout, boardTextEditLayout } from "./text-edit.js";
+import { fitTextToLines, fitTextToWidth } from "./text-fit.js";
+import { boardTextResolution, getBoardResolution, syncTextResolution, textZoomBucket } from "./text-resolution.js";
 import { VIDEO_THUMBNAIL_MAX_EDGE, VideoNaturalSize, loadVideoThumbnailTexture, videoTextureNaturalSize, videoThumbnailSize } from "./video-thumbnail.js";
-export { BOARD_EFFECT_MAX_PARTICLES, BOARD_FONT_STACKS, BoardBackgroundContext, BoardCardRenderer, BoardCardRendererResolver, BoardCssPaint, BoardMediaAction, BoardRenderContext, BoardRenderDiagnostic, BoardRenderLabels, BoardRenderPalette, BoardRenderStyle, BoardScriptHost, BoardScriptHostOptions, BoardSelectionStyle, BoardShadowStyle, BrowserBoardScriptHost, CARD_TAG_SIZE, CardCrop, CardElevation, CardGlyph, CardRect, CardSurface, CardTag, ClipGroup, DEFAULT_BOARD_RENDER_LABELS, PIXEL_STEP, VIDEO_THUMBNAIL_MAX_EDGE, VideoNaturalSize, boardCardDetailed, boardMediaActionAt, boardTextResolution, cardElevation, cardOutlinePoints, cardShadow, clippingAncestor, containRect, createBoardBackground, createBoardCardRendererResolver, createBoardRenderSampler, createBoardScriptHost, createCardTag, dashPattern, defaultBoardPalette, defaultBoardRenderStyle, drawCardGlyph, drawCardShadow, drawCardSurface, ellipsizeWrappedLines, endAngle, ensureBoardTextMeasurement, fillCardPicture, fitLineWithEllipsis, fitTextToLines, fitTextToWidth, formatBoardDuration, getBoardCardRenderer, getBoardResolution, inspectBoardItems, inspectBoardScene, installBoardTextMeasurement, isBoardCard, isClippingFrame, itemAlpha, itemColor, loadVideoThumbnailTexture, measureBoardText, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayKeyCenter, parseBoardCssColor, parseBoardCssPaint, prepareBrowserBoardScripts, resolveBoardRenderStyle, roundRectPoints, syncCardTag, syncClipGroup, syncTextResolution, syncTextWrapWidth, textZoomBucket, traceArrowhead, traceCardOutline, traceCube, traceFrameOutline, tracePixelRect, tracePolyline, trimPolyline, updateBoardBackground, videoTextureNaturalSize, videoThumbnailSize, zoomCardTag };
+export { BOARD_EFFECT_MAX_PARTICLES, BOARD_FONT_STACKS, BOARD_LOD_HYSTERESIS, BOARD_PLAY_MEDIA, BoardBackgroundContext, BoardCardHit, BoardCardRenderer, BoardCardRendererResolver, BoardCssPaint, BoardLod, BoardLodKind, BoardMediaAction, BoardRenderContext, BoardRenderDiagnostic, BoardRenderLabels, BoardRenderPalette, BoardRenderStyle, BoardRenderStyleInput, BoardRenderTheme, BoardScriptHost, BoardScriptHostOptions, BoardSelectionStyle, BoardShadowStyle, BoardTextEditInput, BoardTextEditLayout, BoardTextLineLayout, BoardTextLineOptions, BoardTextStyle, BoardTextWhiteSpace, BrowserBoardScriptHost, CARD_TAG_SIZE, COMPACT_BOARD_LOD, CardCrop, CardElevation, CardGlyph, CardRect, CardSurface, CardTag, ClipGroup, DEFAULT_BOARD_LOD, DEFAULT_BOARD_RENDER_LABELS, type FarPlateStyle, PIXEL_STEP, VIDEO_THUMBNAIL_MAX_EDGE, VideoNaturalSize, boardCardDetailed, boardLodRatio, boardLodSize, boardLongEdge, boardMediaActionAt, boardRenderTheme, boardTextEditLayout, boardTextResolution, boardTextSize, boardTextStyle, canvasFont, canvasFontFamily, cardElevation, cardOutlinePoints, cardShadow, clippingAncestor, containRect, createBoardBackground, createBoardCardRendererResolver, createBoardRenderSampler, createBoardScriptHost, createCardTag, cssBaselineShift, dashPattern, defaultBoardPalette, defaultBoardRenderStyle, drawCardGlyph, drawCardShadow, drawCardSurface, drawFarBars, drawFarPlate, endAngle, ensureBoardTextMeasurement, farPictureTone, fillCardPicture, fitLineWithEllipsis, fitTextToLines, fitTextToWidth, formatBoardDuration, getBoardCardRenderer, getBoardResolution, inspectBoardItems, inspectBoardScene, installBoardTextMeasurement, isBoardCard, isClippingFrame, itemAlpha, itemColor, layoutTextLines, loadVideoThumbnailTexture, measureBoardText, measureTextWidth, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayHit, mediaPlayKeyCenter, onBoardTextFontsChange, parseBoardCssColor, parseBoardCssPaint, prepareBrowserBoardScripts, resolveBoardRenderStyle, roundRectPoints, syncCardTag, syncClipGroup, syncTextResolution, textZoomBucket, traceArrowhead, traceCardOutline, traceCube, traceFrameOutline, tracePixelRect, tracePolyline, trimPolyline, updateBoardBackground, videoTextureNaturalSize, videoThumbnailSize, zoomCardTag };

package/dist/board/render/index.js

@@ -1,20 +1,24 @@
 import { parseBoardCssColor, parseBoardCssPaint } from "./css-color.js";
 import { defaultBoardPalette, itemAlpha, itemColor } from "./palette.js";
 import { createBoardRenderSampler } from "./sampling.js";
-import { BOARD_FONT_STACKS, ensureBoardTextMeasurement, installBoardTextMeasurement } from "./text-measurement.js";
+import { BOARD_FONT_STACKS, boardTextStyle, canvasFont, canvasFontFamily, cssBaselineShift, ensureBoardTextMeasurement, fitLineWithEllipsis, installBoardTextMeasurement, layoutTextLines, measureTextWidth, onBoardTextFontsChange } from "./text-measurement.js";
 import { inspectBoardItems, inspectBoardScene, measureBoardText } from "./diagnostics.js";
+import { BOARD_LOD_HYSTERESIS, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, boardLodRatio, boardLodSize, boardLongEdge, boardTextSize } from "./lod.js";
 import { createBoardBackground, updateBoardBackground } from "./board-background.js";
-import { ellipsizeWrappedLines, fitLineWithEllipsis, fitTextToLines, fitTextToWidth } from "./text-fit.js";
-import { boardCardDetailed, boardTextResolution, getBoardResolution, syncTextResolution, syncTextWrapWidth, textZoomBucket } from "./text-resolution.js";
+import { fitTextToLines, fitTextToWidth } from "./text-fit.js";
+import { boardTextResolution, getBoardResolution, syncTextResolution, textZoomBucket } from "./text-resolution.js";
 import { CARD_TAG_SIZE, createCardTag, drawCardGlyph, formatBoardDuration, syncCardTag, traceCube, zoomCardTag } from "./card-tag.js";
 import { clippingAncestor, isClippingFrame, syncClipGroup, traceFrameOutline } from "./clip.js";
 import { dashPattern, endAngle, roundRectPoints, traceArrowhead, tracePolyline, trimPolyline } from "./stroke.js";
 import { PIXEL_STEP, cardElevation, cardOutlinePoints, cardShadow, containRect, drawCardShadow, drawCardSurface, fillCardPicture, isBoardCard, traceCardOutline, tracePixelRect } from "./surface.js";
-import { boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayKeyCenter } from "./media-interaction.js";
+import { drawFarBars, drawFarPlate, farPictureTone } from "./renderers/far-plate.js";
+import { BOARD_PLAY_MEDIA, boardMediaActionAt, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayHit, mediaPlayKeyCenter } from "./media-interaction.js";
 import { BOARD_EFFECT_MAX_PARTICLES } from "./renderers/effect-card-renderer.js";
 import { DEFAULT_BOARD_RENDER_LABELS, createBoardCardRendererResolver, getBoardCardRenderer } from "./renderers/board-renderer-registry.js";
 import { createBoardScriptHost } from "./script-host.js";
 import { prepareBrowserBoardScripts } from "./script-export.js";
 import { defaultBoardRenderStyle, resolveBoardRenderStyle } from "./style.js";
+import { boardRenderTheme } from "./theme.js";
+import { boardTextEditLayout } from "./text-edit.js";
 import { VIDEO_THUMBNAIL_MAX_EDGE, loadVideoThumbnailTexture, videoTextureNaturalSize, videoThumbnailSize } from "./video-thumbnail.js";
-export { BOARD_EFFECT_MAX_PARTICLES, BOARD_FONT_STACKS, CARD_TAG_SIZE, DEFAULT_BOARD_RENDER_LABELS, PIXEL_STEP, VIDEO_THUMBNAIL_MAX_EDGE, boardCardDetailed, boardMediaActionAt, boardTextResolution, cardElevation, cardOutlinePoints, cardShadow, clippingAncestor, containRect, createBoardBackground, createBoardCardRendererResolver, createBoardRenderSampler, createBoardScriptHost, createCardTag, dashPattern, defaultBoardPalette, defaultBoardRenderStyle, drawCardGlyph, drawCardShadow, drawCardSurface, ellipsizeWrappedLines, endAngle, ensureBoardTextMeasurement, fillCardPicture, fitLineWithEllipsis, fitTextToLines, fitTextToWidth, formatBoardDuration, getBoardCardRenderer, getBoardResolution, inspectBoardItems, inspectBoardScene, installBoardTextMeasurement, isBoardCard, isClippingFrame, itemAlpha, itemColor, loadVideoThumbnailTexture, measureBoardText, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayKeyCenter, parseBoardCssColor, parseBoardCssPaint, prepareBrowserBoardScripts, resolveBoardRenderStyle, roundRectPoints, syncCardTag, syncClipGroup, syncTextResolution, syncTextWrapWidth, textZoomBucket, traceArrowhead, traceCardOutline, traceCube, traceFrameOutline, tracePixelRect, tracePolyline, trimPolyline, updateBoardBackground, videoTextureNaturalSize, videoThumbnailSize, zoomCardTag };
+export { BOARD_EFFECT_MAX_PARTICLES, BOARD_FONT_STACKS, BOARD_LOD_HYSTERESIS, BOARD_PLAY_MEDIA, CARD_TAG_SIZE, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, DEFAULT_BOARD_RENDER_LABELS, PIXEL_STEP, VIDEO_THUMBNAIL_MAX_EDGE, boardCardDetailed, boardLodRatio, boardLodSize, boardLongEdge, boardMediaActionAt, boardRenderTheme, boardTextEditLayout, boardTextResolution, boardTextSize, boardTextStyle, canvasFont, canvasFontFamily, cardElevation, cardOutlinePoints, cardShadow, clippingAncestor, containRect, createBoardBackground, createBoardCardRendererResolver, createBoardRenderSampler, createBoardScriptHost, createCardTag, cssBaselineShift, dashPattern, defaultBoardPalette, defaultBoardRenderStyle, drawCardGlyph, drawCardShadow, drawCardSurface, drawFarBars, drawFarPlate, endAngle, ensureBoardTextMeasurement, farPictureTone, fillCardPicture, fitLineWithEllipsis, fitTextToLines, fitTextToWidth, formatBoardDuration, getBoardCardRenderer, getBoardResolution, inspectBoardItems, inspectBoardScene, installBoardTextMeasurement, isBoardCard, isClippingFrame, itemAlpha, itemColor, layoutTextLines, loadVideoThumbnailTexture, measureBoardText, measureTextWidth, mediaPlayBadgeHit, mediaPlayBadgeVisible, mediaPlayHit, mediaPlayKeyCenter, onBoardTextFontsChange, parseBoardCssColor, parseBoardCssPaint, prepareBrowserBoardScripts, resolveBoardRenderStyle, roundRectPoints, syncCardTag, syncClipGroup, syncTextResolution, textZoomBucket, traceArrowhead, traceCardOutline, traceCube, traceFrameOutline, tracePixelRect, tracePolyline, trimPolyline, updateBoardBackground, videoTextureNaturalSize, videoThumbnailSize, zoomCardTag };

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

@@ -0,0 +1,15 @@
+import { BoardArrowItem } from "../../protocol/dist/board-model.js";
+import "../../protocol/dist/index.js";
+import { WorldPoint } from "../model/geometry.js";
+import { ResolvedArrow } from "../model/arrow-geometry.js";
+//#region src/board/render/labels.d.ts
+declare const FRAME_LABEL_WEIGHT = "600";
+declare const ARROW_LABEL: {
+  readonly fontWeight: "500";
+  readonly lineHeight: 1.25;
+  readonly padX: 0.5;
+  readonly padY: 0.25;
+};
+declare function arrowLabelAnchor(arrow: ResolvedArrow, style: BoardArrowItem["style"]): WorldPoint;
+//#endregion
+export { ARROW_LABEL, FRAME_LABEL_WEIGHT, arrowLabelAnchor };

package/dist/board/render/labels.js

@@ -0,0 +1,14 @@
+import { pathPointAt } from "../model/arrow-geometry.js";
+//#region src/board/render/labels.ts
+const FRAME_LABEL_WEIGHT = "600";
+const ARROW_LABEL = {
+	fontWeight: "500",
+	lineHeight: 1.25,
+	padX: .5,
+	padY: .25
+};
+function arrowLabelAnchor(arrow, style) {
+	return style.trim === void 0 ? arrow.mid : pathPointAt(arrow.path, .5);
+}
+//#endregion
+export { ARROW_LABEL, FRAME_LABEL_WEIGHT, arrowLabelAnchor };

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

@@ -0,0 +1,30 @@
+import { BoardSceneItem } from "../model/scene.js";
+//#region src/board/render/lod.d.ts
+/** On-screen thresholds, in CSS pixels, below which a card draws on the far layer. */
+type BoardLod = {
+  /** Long edge of images and video stills. */
+  media: number;
+  /** Font size of text. */
+  text: number;
+  /** Long edge of every other card. */
+  card: number;
+  /** Most live cards; beyond it the smallest draw on the far layer. */
+  live: number;
+};
+type BoardLodKind = Exclude<keyof BoardLod, "live">;
+declare const DEFAULT_BOARD_LOD: BoardLod;
+declare const COMPACT_BOARD_LOD: BoardLod;
+declare const BOARD_LOD_HYSTERESIS = 0.8;
+declare function boardCardDetailed(zoom: number): boolean;
+declare function boardLongEdge(item: BoardSceneItem): number;
+type BoardLodRenderer = {
+  lod?: {
+    kind: BoardLodKind;
+    size?: (item: BoardSceneItem) => number;
+  };
+};
+declare function boardLodSize(renderer: BoardLodRenderer, item: BoardSceneItem): number;
+declare function boardLodRatio(renderer: BoardLodRenderer, size: number, zoom: number, lod: BoardLod): number;
+declare function boardTextSize(item: BoardSceneItem): number;
+//#endregion
+export { BOARD_LOD_HYSTERESIS, BoardLod, BoardLodKind, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, boardLodRatio, boardLodSize, boardLongEdge, boardTextSize };

package/dist/board/render/lod.js

@@ -0,0 +1,33 @@
+import { clampBoardFontSize, layoutBoardText } from "../../protocol/dist/board-layout.js";
+//#region src/board/render/lod.ts
+const DEFAULT_BOARD_LOD = {
+	media: 12,
+	text: 4,
+	card: 24,
+	live: 1200
+};
+const COMPACT_BOARD_LOD = {
+	...DEFAULT_BOARD_LOD,
+	live: 400
+};
+const BOARD_LOD_HYSTERESIS = .8;
+const CARD_TEXT_SIZE = 12;
+function boardCardDetailed(zoom) {
+	return zoom * CARD_TEXT_SIZE >= DEFAULT_BOARD_LOD.text;
+}
+function boardLongEdge(item) {
+	return Math.max(item.frame.width, item.frame.height);
+}
+function boardLodSize(renderer, item) {
+	return renderer.lod?.size?.(item) ?? boardLongEdge(item);
+}
+function boardLodRatio(renderer, size, zoom, lod) {
+	return size * zoom / lod[renderer.lod?.kind ?? "card"];
+}
+function boardTextSize(item) {
+	if (item.type !== "text") return boardLongEdge(item);
+	const scale = item.frame.width / Math.max(1e-4, layoutBoardText(item.props).width);
+	return clampBoardFontSize(item.props.fontSize ?? 24) * scale;
+}
+//#endregion
+export { BOARD_LOD_HYSTERESIS, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, boardLodRatio, boardLodSize, boardLongEdge, boardTextSize };