@neta-art/cohub 12.1.0 → 12.2.0

package/dist/board/model/themes.js

@@ -0,0 +1,495 @@
+//#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: 888041,
+			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: {}
+	},
+	"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: 2,
+				outset: 8,
+				dash: 4,
+				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"
+		}
+	},
+	"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: 2,
+				outset: 8,
+				dash: 4,
+				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"
+		}
+	}
+};
+//#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,4 +1,5 @@
-import { BoardRenderStyle, BoardSelectionStyle, BoardShadowStyle, defaultBoardRenderStyle, resolveBoardRenderStyle } from "./style.js";
+import { BoardRenderStyle, BoardRenderStyleInput, BoardSelectionStyle, BoardShadowStyle, defaultBoardRenderStyle, resolveBoardRenderStyle } from "./style.js";
+import { BOARD_LOD_HYSTERESIS, BoardLod, BoardLodKind, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, boardLongEdge, boardTextSize } from "./lod.js";
 import { 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";
@@ -12,9 +13,10 @@ import { BoardScriptHostOptions, BrowserBoardScriptHost, createBoardScriptHost }
 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 { BOARD_FONT_STACKS, BoardTextStyle, boardTextStyle, canvasFont, canvasFontFamily, cssBaselineShift, ensureBoardTextMeasurement, installBoardTextMeasurement, layoutTextLines, onBoardTextFontsChange } from "./text-measurement.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, BoardBackgroundContext, BoardCardRenderer, BoardCardRendererResolver, BoardCssPaint, BoardLod, BoardLodKind, BoardMediaAction, BoardRenderContext, BoardRenderDiagnostic, BoardRenderLabels, BoardRenderPalette, BoardRenderStyle, BoardRenderStyleInput, BoardRenderTheme, BoardScriptHost, BoardScriptHostOptions, BoardSelectionStyle, BoardShadowStyle, BoardTextStyle, BrowserBoardScriptHost, CARD_TAG_SIZE, COMPACT_BOARD_LOD, CardCrop, CardElevation, CardGlyph, CardRect, CardSurface, CardTag, ClipGroup, DEFAULT_BOARD_LOD, DEFAULT_BOARD_RENDER_LABELS, PIXEL_STEP, VIDEO_THUMBNAIL_MAX_EDGE, VideoNaturalSize, boardCardDetailed, boardLongEdge, boardMediaActionAt, boardRenderTheme, boardTextResolution, boardTextSize, boardTextStyle, canvasFont, canvasFontFamily, cardElevation, cardOutlinePoints, cardShadow, clippingAncestor, containRect, createBoardBackground, createBoardCardRendererResolver, createBoardRenderSampler, createBoardScriptHost, createCardTag, cssBaselineShift, dashPattern, defaultBoardPalette, defaultBoardRenderStyle, drawCardGlyph, drawCardShadow, drawCardSurface, ellipsizeWrappedLines, endAngle, ensureBoardTextMeasurement, fillCardPicture, fitLineWithEllipsis, fitTextToLines, fitTextToWidth, formatBoardDuration, getBoardCardRenderer, getBoardResolution, inspectBoardItems, inspectBoardScene, installBoardTextMeasurement, isBoardCard, isClippingFrame, itemAlpha, itemColor, layoutTextLines, loadVideoThumbnailTexture, measureBoardText, mediaPlayBadgeHit, mediaPlayBadgeVisible, 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,11 +1,12 @@
 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, installBoardTextMeasurement, layoutTextLines, onBoardTextFontsChange } from "./text-measurement.js";
 import { inspectBoardItems, inspectBoardScene, measureBoardText } from "./diagnostics.js";
+import { BOARD_LOD_HYSTERESIS, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, 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 { 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";
@@ -16,5 +17,6 @@ import { DEFAULT_BOARD_RENDER_LABELS, createBoardCardRendererResolver, getBoardC
 import { createBoardScriptHost } from "./script-host.js";
 import { prepareBrowserBoardScripts } from "./script-export.js";
 import { defaultBoardRenderStyle, resolveBoardRenderStyle } from "./style.js";
+import { boardRenderTheme } from "./theme.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, CARD_TAG_SIZE, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, DEFAULT_BOARD_RENDER_LABELS, PIXEL_STEP, VIDEO_THUMBNAIL_MAX_EDGE, boardCardDetailed, boardLongEdge, boardMediaActionAt, boardRenderTheme, boardTextResolution, boardTextSize, boardTextStyle, canvasFont, canvasFontFamily, cardElevation, cardOutlinePoints, cardShadow, clippingAncestor, containRect, createBoardBackground, createBoardCardRendererResolver, createBoardRenderSampler, createBoardScriptHost, createCardTag, cssBaselineShift, dashPattern, defaultBoardPalette, defaultBoardRenderStyle, drawCardGlyph, drawCardShadow, drawCardSurface, ellipsizeWrappedLines, endAngle, ensureBoardTextMeasurement, fillCardPicture, fitLineWithEllipsis, fitTextToLines, fitTextToWidth, formatBoardDuration, getBoardCardRenderer, getBoardResolution, inspectBoardItems, inspectBoardScene, installBoardTextMeasurement, isBoardCard, isClippingFrame, itemAlpha, itemColor, layoutTextLines, loadVideoThumbnailTexture, measureBoardText, mediaPlayBadgeHit, mediaPlayBadgeVisible, 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/lod.d.ts

@@ -0,0 +1,22 @@
+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;
+declare function boardTextSize(item: BoardSceneItem): number;
+//#endregion
+export { BOARD_LOD_HYSTERESIS, BoardLod, BoardLodKind, COMPACT_BOARD_LOD, DEFAULT_BOARD_LOD, boardCardDetailed, boardLongEdge, boardTextSize };

package/dist/board/render/lod.js

@@ -0,0 +1,27 @@
+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 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, boardLongEdge, boardTextSize };

package/dist/board/render/media-interaction.js

@@ -1,7 +1,7 @@
 import { featuredTaskArtifact } from "../../protocol/dist/board-task.js";
 import { degToRad, rotatePointAround, worldPoint } from "../model/geometry.js";
 import { isBoardModelItem } from "../model/media.js";
-import { boardCardDetailed } from "./text-resolution.js";
+import { boardCardDetailed } from "./lod.js";
 import { audioKeyCenter } from "./renderers/audio-card-renderer.js";
 import { modelKeyCenter } from "./renderers/model-card-renderer.js";
 //#region src/board/render/media-interaction.ts

package/dist/board/render/palette.js

@@ -1,32 +1,9 @@
+import { BOARD_THEME_DATA } from "../model/themes.js";
 import { resolveItemColor } from "../model/palette.js";
 import { parseBoardCssColor, parseBoardCssPaint } from "./css-color.js";
 //#region src/board/render/palette.ts
-const DARK = {
-	bg: 1315860,
-	surface: 2105376,
-	hover: 2763306,
-	border: 3815994,
-	brand: 16734751,
-	text: 16053492,
-	muted: 9211020,
-	rare: 3718648,
-	epic: 10980346,
-	legendary: 16096779
-};
-const LIGHT = {
-	bg: 16251129,
-	surface: 16777215,
-	hover: 15329772,
-	border: 14079706,
-	brand: 15222030,
-	text: 1579035,
-	muted: 7041664,
-	rare: 2450411,
-	epic: 8141549,
-	legendary: 11817737
-};
 function defaultBoardPalette(mode) {
-	return { ...mode === "light" ? LIGHT : DARK };
+	return { ...BOARD_THEME_DATA[mode].palette };
 }
 function itemAlpha(context, color) {
 	const value = typeof color === "object" && color ? color[context.colorScheme] : color;

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

@@ -1,6 +1,7 @@
 import { getMediaResourceTitle } from "../../model/media.js";
+import { boardCardDetailed } from "../lod.js";
 import { fitTextToWidth } from "../text-fit.js";
-import { boardCardDetailed, syncTextResolution } from "../text-resolution.js";
+import { syncTextResolution } from "../text-resolution.js";
 import { formatBoardDuration } from "../card-tag.js";
 import { drawAudioWaveform } from "../audio-waveform.js";
 import { cardElevation, drawCardSurface } from "../surface.js";

package/dist/board/render/renderers/board-renderer-registry.d.ts

@@ -4,6 +4,7 @@ import "../../../protocol/dist/index.js";
 import { BoardScene, BoardSceneItem, SceneItem } from "../../model/scene.js";
 import { BoardShapeColors } from "../../model/palette.js";
 import { BoardRenderStyle } from "../style.js";
+import { BoardLodKind } from "../lod.js";
 import { Container, Graphics, Texture } from "pixi.js";
 //#region src/board/render/renderers/board-renderer-registry.d.ts
 type BoardRenderPalette = {
@@ -41,6 +42,7 @@ type BoardRenderContext = {
   hoveredId: string | null;
   resizingIds: Set<string>;
   liftedIds: ReadonlySet<string>;
+  editingId?: string | null;
   palette: BoardRenderPalette;
   colors: BoardShapeColors;
   colorScheme: "dark" | "light";
@@ -79,6 +81,14 @@ type BoardCardRenderer = {
   resolution?: (container: Container, item: BoardSceneItem, context: BoardRenderContext) => void;
   /** Runs on every zoom step; only update transforms and visibility. */
   zoom?: (container: Container, zoom: number) => void;
+  /**
+   * Level of detail for `renderFar`: `size` is the world-unit measure kept
+   * legible (default: the long edge), held against the `BoardLod[kind]` threshold.
+   */
+  lod?: {
+    kind: BoardLodKind;
+    size?: (item: BoardSceneItem) => number;
+  };
   renderFar?: (graphics: Graphics, item: BoardSceneItem, context: BoardRenderContext) => void;
   destroy?: (container: Container, context: BoardRenderContext) => void;
 };