@neta-art/cohub 12.6.0 → 13.0.0

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

@@ -1,10 +1,10 @@
 import { BOARD_FONT_STACK, BOARD_MONO_FONT_STACK } from "../../../protocol/dist/board-constants.js";
 import { featuredTaskArtifact } from "../../../protocol/dist/board-task.js";
-import { boardCardDetailed } from "../lod.js";
+import { drawAudioWaveform } from "../audio-waveform.js";
 import { fitTextToLines, fitTextToWidth } from "../text-fit.js";
 import { syncTextResolution } from "../text-resolution.js";
 import { createCardTag, formatBoardDuration, syncCardTag, zoomCardTag } from "../card-tag.js";
-import { drawAudioWaveform } from "../audio-waveform.js";
+import { boardCardDetailed } from "../lod.js";
 import { cardElevation, containRect, drawCardSurface, traceCardOutline } from "../surface.js";
 import { positionShell } from "./base-card-renderer.js";
 import { drawFarPlate, farPictureTone } from "./far-plate.js";

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

@@ -1,8 +1,8 @@
 import { estimateTextWidth, layoutBoardText } from "../../../protocol/dist/board-layout.js";
-import { itemAlpha, itemColor } from "../palette.js";
 import { boardTextStyle, canvasFont, cssBaselineShift, layoutTextLines } from "../text-measurement.js";
-import { boardTextSize } from "../lod.js";
 import { syncTextResolution } from "../text-resolution.js";
+import { itemAlpha, itemColor } from "../palette.js";
+import { boardTextSize } from "../lod.js";
 import { positionShell } from "./base-card-renderer.js";
 import { drawFarBars } from "./far-plate.js";
 import { Container, Graphics, Text } from "pixi.js";

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

@@ -1,6 +1,6 @@
 import { getMediaResourceTitle } from "../../model/media.js";
-import { boardCardDetailed } from "../lod.js";
 import { createCardTag, formatBoardDuration, syncCardTag, zoomCardTag } from "../card-tag.js";
+import { boardCardDetailed } from "../lod.js";
 import { cardElevation, containRect, drawCardSurface, fillCardPicture } from "../surface.js";
 import { positionShell } from "./base-card-renderer.js";
 import { drawFarPlate, farPictureTone } from "./far-plate.js";

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

@@ -2,12 +2,14 @@ import { BoardShapeColors } from "../model/palette.js";
 import { BoardThemeId } from "../model/themes.js";
 import { BoardRenderStyle } from "./style.js";
 import { BoardRenderPalette } from "./renderers/board-renderer-registry.js";
+import { BoardThemeBackdrop } from "./backdrop.js";
 //#region src/board/render/theme.d.ts
 type BoardRenderTheme = {
   colorScheme: "dark" | "light";
   palette: BoardRenderPalette;
   colors: BoardShapeColors;
   style: BoardRenderStyle;
+  backdrop?: BoardThemeBackdrop;
 };
 /** A built-in Cohub theme as the app draws it; spread it into export or sampler options. */
 declare function boardRenderTheme(id: BoardThemeId): BoardRenderTheme;

package/dist/board/render/theme.js

@@ -3,12 +3,14 @@ import { resolveBoardRenderStyle } from "./style.js";
 //#region src/board/render/theme.ts
 /** A built-in Cohub theme as the app draws it; spread it into export or sampler options. */
 function boardRenderTheme(id) {
-	const { colorScheme, palette, colors, style } = BOARD_THEME_DATA[id];
+	const data = BOARD_THEME_DATA[id];
+	const { colorScheme, palette, colors, style } = data;
 	return {
 		colorScheme,
 		palette: { ...palette },
 		colors: Object.fromEntries(Object.entries(colors).map(([key, value]) => [key, { ...value }])),
-		style: resolveBoardRenderStyle(colorScheme, style)
+		style: resolveBoardRenderStyle(colorScheme, style),
+		..."backdrop" in data ? { backdrop: structuredClone(data.backdrop) } : {}
 	};
 }
 //#endregion

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

@@ -14,8 +14,8 @@ type BoardChangedPayload = {
   after?: BoardDelta;
 };
 type BoardRemote = {
-  /** `only: []` reads metadata only; remotes may return the full Board. */
-  get(read?: Pick<BoardReadInput, "only">): Promise<BoardReadResult>;
+  /** `since` asks only for the changes after that version; remotes may return the full Board. */
+  get(read?: Pick<BoardReadInput, "since">): Promise<BoardReadResult>;
   apply(patch: BoardPatch, options: {
     mutationId: string;
     clientId?: string;

package/dist/board/replica/index.js

@@ -1,6 +1,6 @@
 import { applyBoardDelta, applyBoardPatchToDocument, parseBoardDocument } from "../../protocol/dist/board-patch.js";
 import { createBoardEntityId } from "../model/items/id.js";
-import { shareBoardDocument } from "../model/document-share.js";
+import { readBoardDocument } from "../model/read.js";
 import { clearBoardReplicaStorage, createIndexedDbBoardReplicaStorage } from "./indexeddb.js";
 //#region src/board/replica/index.ts
 function memoryStorage() {
@@ -15,6 +15,7 @@ function memoryStorage() {
 const RETRY_BASE_MS = 1e3;
 const RETRY_MAX_MS = 3e4;
 const PERSIST_INTERVAL_MS = 500;
+const CACHE_WAIT_MS = 250;
 function isRejection(error) {
 	const status = error.status;
 	return typeof status === "number" && status >= 400 && status < 500 && ![
@@ -34,6 +35,7 @@ function createBoardReplica(options) {
 	let unsubscribeRemote = null;
 	let server = null;
 	let version = 0;
+	let sent = [];
 	let title = null;
 	let playback = null;
 	let playbackRevision = 0;
@@ -57,7 +59,7 @@ function createBoardReplica(options) {
 			return remote.subscribe({
 				changed: (event) => receive(event.payload),
 				playback: (event) => receivePlayback(event.payload.playback),
-				resync: () => void resync()
+				resync: () => void retry()
 			});
 		} catch {
 			return null;
@@ -69,7 +71,7 @@ function createBoardReplica(options) {
 			return;
 		}
 		let next = server;
-		for (const entry of pending) {
+		for (const entry of [...sent, ...pending]) {
 			const result = applyBoardPatchToDocument(next, entry.patch);
 			if (result.ok) next = result.document;
 		}
@@ -95,6 +97,7 @@ function createBoardReplica(options) {
 	function adoptServer(next, nextVersion, persist) {
 		server = next;
 		version = nextVersion;
+		sent = sent.filter((entry) => entry.version > nextVersion);
 		recompute();
 		if (persist) schedulePersist(nextVersion, next);
 	}
@@ -112,21 +115,16 @@ function createBoardReplica(options) {
 		unpersisted = null;
 		if (entry) storage.writeDocument(entry.version, entry.document).catch(() => void 0);
 	}
-	function adoptRead(result, readPlaybackRevision) {
-		const parsed = parseBoardDocument({
-			board: result.board,
-			items: result.items ?? {},
-			animations: result.animations ?? {}
-		});
-		if (!parsed.ok) throw new Error(`Board ${result.id} could not be read.`);
+	function adoptRead(result, base, readPlaybackRevision) {
+		const next = readBoardDocument(result, result.changes ? base : server);
 		title = result.title;
 		if (readPlaybackRevision === playbackRevision) playback = result.playback;
 		loaded = true;
-		const next = shareBoardDocument(server, parsed.document);
 		if (next === server && result.version === version) return;
 		adoptServer(next, result.version, true);
 	}
 	function refresh() {
+		if (disposed) return Promise.resolve();
 		if (refreshing) {
 			refreshAgain = true;
 			return refreshing;
@@ -136,9 +134,10 @@ function createBoardReplica(options) {
 				do {
 					refreshAgain = false;
 					const readPlaybackRevision = playbackRevision;
-					const result = await remote.get();
+					const base = server;
+					const result = await remote.get(base ? { since: version } : void 0);
 					if (disposed) return;
-					if (result.version >= version || !loaded) adoptRead(result, readPlaybackRevision);
+					if (result.version >= version || !loaded) adoptRead(result, base, readPlaybackRevision);
 					readError = null;
 					emit();
 				} while (refreshAgain && !disposed);
@@ -162,6 +161,7 @@ function createBoardReplica(options) {
 	async function flush() {
 		if (sending || disposed || !loaded || !restored) return;
 		sending = true;
+		let latest = 0;
 		try {
 			while (pending.length && !disposed) {
 				const entry = pending[0];
@@ -173,12 +173,12 @@ function createBoardReplica(options) {
 					const stillPending = pending.some((item) => item.mutationId === entry.mutationId);
 					pending = pending.filter((item) => item.mutationId !== entry.mutationId);
 					storage.deletePending(entry.mutationId).catch(() => void 0);
-					if (stillPending && server && !result.replayed && result.status === "applied" && result.version === version + 1) {
-						const next = applyBoardPatchToDocument(server, entry.patch);
-						if (next.ok) adoptServer(next.document, result.version, true);
-						else refresh();
-					} else if (result.version > version) refresh();
-					else recompute();
+					if (stillPending && result.status === "applied" && result.version > version) sent = [...sent, {
+						version: result.version,
+						patch: entry.patch
+					}];
+					latest = Math.max(latest, result.version);
+					recompute();
 					retryDelay = RETRY_BASE_MS;
 					writeError = null;
 					emit();
@@ -198,6 +198,7 @@ function createBoardReplica(options) {
 					return;
 				}
 			}
+			if (latest > version && !disposed) refresh();
 		} finally {
 			sending = false;
 		}
@@ -220,7 +221,7 @@ function createBoardReplica(options) {
 		}
 		emit();
 	}
-	function retry(read = true) {
+	function retry() {
 		if (disposed) return Promise.resolve();
 		if (retryTimer) clearTimeout(retryTimer);
 		retryTimer = null;
@@ -228,31 +229,24 @@ function createBoardReplica(options) {
 		readError = null;
 		writeError = null;
 		emit();
-		return (read ? refresh() : Promise.resolve()).then(flush);
-	}
-	async function resync() {
-		await refreshing;
-		if (disposed) return;
-		if (!loaded || readError) return retry();
-		const revision = playbackRevision;
-		const head = await remote.get({ only: [] }).catch(() => null);
-		if (disposed) return;
-		if (!head || head.version > version) return retry();
-		if (revision === playbackRevision) playback = head.playback;
-		return retry(false);
+		return refresh().then(flush);
 	}
 	function onOnline() {
 		if (pending.length || readError || writeError) retry();
 	}
-	async function restore() {
-		const [cached, stored] = await Promise.all([storage.readDocument().catch(() => null), storage.listPending().catch(() => [])]);
+	async function restoreDocument() {
+		const cached = await storage.readDocument().catch(() => null);
+		if (disposed || server || !cached) return;
+		const parsed = parseBoardDocument(cached.document);
+		if (parsed.ok) adoptServer(parsed.document, cached.version, false);
+	}
+	async function restore(document) {
+		const [, stored] = await Promise.all([document, storage.listPending().catch(() => [])]);
 		if (disposed) return;
 		const known = new Set(stored.map((entry) => entry.mutationId));
 		pending = [...stored, ...pending.filter((entry) => !known.has(entry.mutationId))];
 		restored = true;
-		const parsed = cached && !server ? parseBoardDocument(cached.document) : null;
-		if (cached && parsed?.ok) adoptServer(parsed.document, cached.version, false);
-		else recompute();
+		recompute();
 		emit();
 	}
 	function receivePlayback(next) {
@@ -271,7 +265,12 @@ function createBoardReplica(options) {
 		async start() {
 			unsubscribeRemote ??= subscribeRemote();
 			globalThis.addEventListener?.("online", onOnline);
-			await Promise.all([restore(), refresh()]);
+			const document = restoreDocument();
+			const cacheWait = new Promise((resolve) => {
+				const timer = setTimeout(resolve, CACHE_WAIT_MS);
+				document.then(() => clearTimeout(timer));
+			});
+			await Promise.all([restore(document), Promise.race([document, cacheWait]).then(refresh)]);
 			await flush();
 		},
 		apply(patch) {
@@ -287,7 +286,7 @@ function createBoardReplica(options) {
 		receive,
 		receivePlayback,
 		refresh,
-		retry: () => retry(),
+		retry,
 		dispose() {
 			disposed = true;
 			globalThis.removeEventListener?.("online", onOnline);

package/dist/board/stage/assets.d.ts

@@ -1,7 +1,7 @@
 import { ModelFormat } from "../../protocol/dist/fs/mime.js";
 import { BoardSceneItem } from "../model/scene.js";
 import { BoardAssetMedia, BoardAssetRef } from "../model/asset-key.js";
-import { BoardAssetSource, BoardAssetUrlOptions } from "../model/media-playback.js";
+import { BoardAssetSource } from "../model/media-playback.js";
 import "../model/index.js";
 import { LruBudget } from "./lru.js";
 import { BoardImageTexturePool } from "./texture-pool.js";
@@ -60,7 +60,7 @@ type BoardAssetPrefetch = {
 type BoardAssetChange = "texture" | "tone";
 type BoardAssetManagerOptions = {
   /** Resolve a Space file path to a URL a texture can load from; null when unavailable. */
-  resolveFileUrl: (path: string, options?: BoardAssetUrlOptions) => Promise<string | null>;
+  resolveFile: BoardAssetSource["resolveFile"];
   subscribe?: BoardAssetSource["subscribe"];
   /** undefined keeps the built-in rule, null shows none; cached until `invalidateItemAssets`. */
   itemAsset?: (item: BoardSceneItem) => BoardAssetRef | null | undefined;

package/dist/board/stage/assets.js

@@ -1,7 +1,7 @@
-import { probeMediaInfo } from "../../protocol/dist/core/media.js";
-import { MEDIA_VARIANT_SIZES, imageVariantUrl, variantSource } from "../../media.js";
+import { MEDIA_VARIANT_SIZES, fitsVideoFrames, imageVariantUrl, mediaHost, mediaVariantSize, variantSource, videoFrameUrl } from "../../protocol/dist/core/media.js";
+import { loadMediaInfo, loadMediaSize } from "../../media.js";
 import { boardModelFormat } from "../model/media.js";
-import { boardAssetKey, boardAssetKeySource, boardAssetRefKey } from "../model/asset-key.js";
+import { boardAssetKey, boardAssetKeySource, boardAssetRefKey, boardMediaNaturalSize } from "../model/asset-key.js";
 import { loadVideoThumbnailTexture, videoTextureNaturalSize } from "../render/video-thumbnail.js";
 import { planLruTrim } from "./lru.js";
 import { defaultBoardDeviceBudget } from "./device.js";
@@ -9,12 +9,43 @@ import { scheduleBoardIdle } from "./idle.js";
 import { boardImageTexturePool, loadBoardImageTexture, loadFittedImageTexture, readTextureTone, shrinkBoardTexture, unloadBoardImageTexture } from "./texture-pool.js";
 import { Texture } from "pixi.js";
 //#region src/board/stage/assets.ts
+const SMALLEST_VARIANT = MEDIA_VARIANT_SIZES[0];
 function variantUrl(source, edge, cover) {
 	if (!(edge <= 1536)) return null;
 	const url = imageVariantUrl(source, edge, cover ? "cover" : "contain");
 	return url && url !== source ? url : null;
 }
-const SMALLEST_VARIANT = MEDIA_VARIANT_SIZES[0];
+const frameAspects = /* @__PURE__ */ new Map();
+const FRAME_ASPECT_LIMIT = 2048;
+const FRAME_SLACK = 1.25;
+function learnAspect(source, { width, height }) {
+	if (!width || !height || frameAspects.has(source)) return;
+	frameAspects.set(source, width / height);
+	if (frameAspects.size > FRAME_ASPECT_LIMIT) frameAspects.delete(frameAspects.keys().next().value);
+}
+const FRAME_FACTS_WAIT_MS = 300;
+async function factSize(source) {
+	const timeout = new Promise((resolve) => setTimeout(resolve, FRAME_FACTS_WAIT_MS, null));
+	const info = await Promise.race([loadMediaInfo(source, "video"), timeout]);
+	return info?.width && info.height ? {
+		width: info.width,
+		height: info.height
+	} : void 0;
+}
+function frameUrl(source, edge, natural) {
+	return videoFrameUrl(source, mediaVariantSize(edge), {
+		natural,
+		aspect: natural ? null : frameAspects.get(source)
+	});
+}
+function textureMedia(media, url) {
+	return media === "video" && url && variantSource(url)?.type === "video" ? "image" : media;
+}
+function slotOf(media, source, frameless = false) {
+	return media === "video" && !frameless && videoFrameUrl(source, SMALLEST_VARIANT) ? "image" : media;
+}
+const FRAMELESS = /* @__PURE__ */ new Error("Video frame failed");
+const NO_PREVIEW = /* @__PURE__ */ new Error("No preview without decoding the video");
 function boundEdge({ width, height }, cover) {
 	return cover ? Math.min(width, height) : Math.max(width, height);
 }
@@ -62,7 +93,8 @@ function createBoardAssetManager(options) {
 		}
 		await unloadBoardImageTexture(url, texture);
 	});
-	function releaseTexture(media, url, texture) {
+	function releaseTexture(asset, url, texture) {
+		const media = textureMedia(asset, url);
 		const pendingKey = `${media}:${url}`;
 		const promise = unloadTexture(url, texture, media).catch(() => {}).then(() => {
 			if (url && pendingUnloads.get(pendingKey) === promise) pendingUnloads.delete(pendingKey);
@@ -78,12 +110,11 @@ function createBoardAssetManager(options) {
 		if (typeof requestAnimationFrame === "function") requestAnimationFrame(release);
 		else setTimeout(release, 0);
 	}
-	const resolveFileUrl = options.resolveFileUrl;
 	const entries = /* @__PURE__ */ new Map();
 	const keysByPath = /* @__PURE__ */ new Map();
 	const pathVersions = /* @__PURE__ */ new Map();
 	const starters = /* @__PURE__ */ new Map();
-	const failedModels = /* @__PURE__ */ new Set();
+	const unavailable = /* @__PURE__ */ new Set();
 	const queue = [];
 	const listeners = /* @__PURE__ */ new Set();
 	let active = 0;
@@ -139,7 +170,7 @@ function createBoardAssetManager(options) {
 		const itemEpoch = itemEpochs.get(item.id) ?? 0;
 		let record = keys.get(item);
 		if (record?.epoch !== keyEpoch || record.itemEpoch !== itemEpoch) {
-			const base = resolveAssetKey(item);
+			const { key: base, natural } = resolveAsset(item);
 			const source = base ? boardAssetKeySource(base) : null;
 			const path = source?.kind === "file" ? source.value : null;
 			record = {
@@ -148,7 +179,8 @@ function createBoardAssetManager(options) {
 				base,
 				path,
 				version: 0,
-				key: base
+				key: base,
+				natural
 			};
 			keys.set(item, record);
 		}
@@ -161,14 +193,23 @@ function createBoardAssetManager(options) {
 		}
 		return record.key;
 	}
-	function resolveAssetKey(item) {
+	function resolveAsset(item) {
 		const asset = options.itemAsset?.(item);
+		const natural = (asset === void 0 ? boardMediaNaturalSize(item) : asset?.natural) ?? null;
 		const key = asset === void 0 ? boardAssetKey(item) : asset && boardAssetRefKey(asset);
-		if (!key) return null;
-		const source = boardAssetKeySource(key);
-		if (source?.media === "video" && options.loadVideoPreviews === false) return null;
-		if (source?.media === "model" && !modelPreviewable(item)) return null;
-		return key;
+		const source = key ? boardAssetKeySource(key) : null;
+		if (source?.media === "video" && source.kind === "url" && options.loadVideoPreviews === false && slotOf("video", source.value) === "video") return {
+			key: null,
+			natural
+		};
+		if (source?.media === "model" && !modelPreviewable(item)) return {
+			key: null,
+			natural
+		};
+		return {
+			key,
+			natural
+		};
 	}
 	function clearRetry(entry) {
 		if (entry.retryTimer) {
@@ -196,6 +237,7 @@ function createBoardAssetManager(options) {
 				loading: false,
 				error: false,
 				attempts: 0,
+				frameless: false,
 				retryAt: 0,
 				retryTimer: null,
 				lastUsedAt: now()
@@ -242,8 +284,8 @@ function createBoardAssetManager(options) {
 			if (!disposed) trim();
 		}, TRIM_DELAY);
 	}
-	function shrunkFootprint({ media, texture }) {
-		if (!shrinkTexture || media !== "image" || !texture) return void 0;
+	function shrunkFootprint({ media, texture, url }) {
+		if (!shrinkTexture || textureMedia(media, url ?? "") !== "image" || !texture) return void 0;
 		const scale = SHRINK_EDGE / Math.max(texture.width, texture.height);
 		return scale < 1 ? Math.round(texture.width * scale) * Math.round(texture.height * scale) * 4 : void 0;
 	}
@@ -303,7 +345,9 @@ function createBoardAssetManager(options) {
 			entry.texture = texture;
 			entry.url = loaded.url;
 			entry.edge = loaded.edge;
-			if (loaded.edge === Number.POSITIVE_INFINITY && !variantSource(loaded.url)) entry.natural = videoTextureNaturalSize(texture) ?? {
+			const decoded = videoTextureNaturalSize(texture);
+			if (decoded) entry.natural = decoded;
+			else if (loaded.edge === Number.POSITIVE_INFINITY && !variantSource(loaded.url)) entry.natural = {
 				width: texture.width,
 				height: texture.height
 			};
@@ -320,23 +364,27 @@ function createBoardAssetManager(options) {
 			notify(key);
 			return;
 		}
-		const media = entry.media;
+		if (error === FRAMELESS && entry.source && entry.refs > 0) return enqueue(key, "video", textureLoad("video", entry.source));
+		const final = entry.media === "model" || error === NO_PREVIEW;
 		entry.error = true;
 		entry.attempts += 1;
 		entry.retryAt = now() + Math.min(1e3 * 2 ** entry.attempts, MAX_RETRY_DELAY);
-		console.warn(`[board] failed to load preview for ${key}`, error);
-		if (media === "model") failedModels.add(key);
+		if (error !== NO_PREVIEW) console.warn(`[board] failed to load preview for ${key}`, error);
+		if (final) unavailable.add(key);
 		if (entry.refs <= 0) evict(key, entry);
 		else {
-			if (media !== "model") scheduleRetry(key, entry);
+			if (!final) scheduleRetry(key, entry);
 			notify(key);
 		}
 	}
 	function refinable(key, entry) {
-		return entry.media === "image" && (entry.refs > 0 || warm.has(key)) && entry.texture !== null && entry.source !== null && entry.want > entry.edge;
+		if (entry.media === "model" || !(entry.refs > 0 || warm.has(key)) || !entry.texture || !entry.source || entry.want <= entry.edge) return false;
+		return entry.media === "image" || frameUrl(entry.source, entry.want, entry.natural) !== entry.url;
 	}
 	function refine(key, entry) {
-		if (refinable(key, entry) && !entry.loading && entry.source) enqueue(key, "image", textureLoad("image", entry.source));
+		if (entry.loading || !entry.source || entry.media === "model") return;
+		if (refinable(key, entry)) enqueue(key, slotOf(entry.media, entry.source, entry.frameless), textureLoad(entry.media, entry.source));
+		else if (entry.media === "video" && entry.natural === void 0 && entry.texture && boundEdge(entry.texture, false) < entry.want && !fitsVideoFrames(entry.source)) probeNaturalSize(key, entry, entry.source);
 	}
 	function enqueue(key, media, load) {
 		if (queue.some((task) => task.key === key)) return;
@@ -390,55 +438,79 @@ function createBoardAssetManager(options) {
 			task.load(entry).then((loaded) => done(loaded), (error) => done(null, error));
 		}
 	}
+	async function loadSized(entry, url, media, resized, slack = 2) {
+		const { cover, want: edge } = entry;
+		const pending = pendingUnloads.get(`${media}:${url}`);
+		if (pending) await pending;
+		if (disposed) return null;
+		const texture = await loadTexture(url, media);
+		if (!texture) return null;
+		const bound = boundEdge(texture, cover);
+		if (media === "image" && shrinkTexture && edge < bound / slack) {
+			const longEdge = Math.round(edge * Math.max(texture.width, texture.height) / bound);
+			const small = await shrinkTexture(texture, longEdge).catch(() => null);
+			if (small) {
+				releaseTexture(media, url, texture);
+				return {
+					texture: small,
+					url: "",
+					edge
+				};
+			}
+		}
+		return {
+			texture,
+			url,
+			edge: sharpEdge(texture, edge, resized, cover)
+		};
+	}
 	function textureLoad(media, source) {
 		return async (entry) => {
 			entry.source = source;
 			const { cover, want: edge } = entry;
-			const variant = media === "image" ? variantUrl(source, Math.max(edge, SMALLEST_VARIANT), cover) : null;
-			const url = variant ?? source;
-			const pending = pendingUnloads.get(`${media}:${url}`);
-			if (pending) await pending;
-			if (disposed) return null;
-			if (media === "image" && !variant && useSharedImagePool && Number.isFinite(edge)) {
-				const fitted = await loadFittedImageTexture(url, edge, cover).catch(() => null);
+			if (media === "video") {
+				if (entry.natural === void 0 && !entry.frameless && mediaHost(source)?.metaHeaders) entry.natural = await factSize(source);
+				const frame = entry.frameless ? null : frameUrl(source, edge, entry.natural);
+				if (frame) {
+					const loaded = await loadSized(entry, frame, "image", true, FRAME_SLACK).catch(() => null);
+					if (loaded) {
+						learnAspect(source, loaded.texture);
+						if (!entry.natural && !fitsVideoFrames(source) && loaded.edge === Number.POSITIVE_INFINITY) loaded.edge = boundEdge(loaded.texture, false);
+					}
+					if (loaded || entry.texture) return loaded;
+					entry.frameless = true;
+					throw FRAMELESS;
+				}
+				if (options.loadVideoPreviews === false) throw NO_PREVIEW;
+				return loadSized(entry, source, "video", false);
+			}
+			const variant = variantUrl(source, Math.max(edge, SMALLEST_VARIANT), cover);
+			if (!variant && useSharedImagePool && Number.isFinite(edge)) {
+				const fitted = await loadFittedImageTexture(source, edge, cover).catch(() => null);
 				if (fitted) return {
 					texture: fitted,
 					url: "",
 					edge: sharpEdge(fitted, edge, true, cover)
 				};
 			}
-			const texture = await loadTexture(url, media);
-			if (!texture) return null;
-			const bound = boundEdge(texture, cover);
-			if (media === "image" && shrinkTexture && edge < bound / 2) {
-				const longEdge = Math.round(edge * Math.max(texture.width, texture.height) / bound);
-				const small = await shrinkTexture(texture, longEdge).catch(() => null);
-				if (small) {
-					releaseTexture(media, url, texture);
-					return {
-						texture: small,
-						url: "",
-						edge
-					};
-				}
-			}
-			return {
-				texture,
-				url,
-				edge: sharpEdge(texture, edge, Boolean(variant), cover)
-			};
+			return loadSized(entry, variant ?? source, "image", Boolean(variant));
 		};
 	}
-	function resolveFile(key, media, path) {
+	function startFile(key, media, path) {
 		return (entry) => {
 			const fresh = entry.attempts > 0;
 			entry.loading = true;
-			resolveFileUrl(path, fresh ? { fresh } : void 0).then((url) => {
+			options.resolveFile(path, fresh ? { fresh } : void 0).then((file) => {
 				if (disposed || entries.get(key) !== entry) return;
 				if (entry.refs <= 0 && !warm.has(key)) return evict(key, entry);
-				if (!url) return adopt(key, entry, null, /* @__PURE__ */ new Error(`Unavailable file: ${path}`));
+				if (!file) return adopt(key, entry, null, /* @__PURE__ */ new Error(`Unavailable file: ${path}`));
+				const { url, media: facts } = file;
+				if (facts && !entry.natural) entry.natural = {
+					width: facts.width,
+					height: facts.height
+				};
 				entry.loading = false;
-				enqueue(key, media, textureLoad(media, url));
+				enqueue(key, slotOf(media, url, entry.frameless), textureLoad(media, url));
 			}, (error) => {
 				if (!disposed) adopt(key, entry, null, error);
 			});
@@ -446,12 +518,10 @@ function createBoardAssetManager(options) {
 	}
 	function probeNaturalSize(key, entry, source) {
 		entry.natural = null;
-		probeMediaInfo(source, { type: "image" }).then(({ width, height }) => {
-			if (disposed || entries.get(key) !== entry || !width || !height) return;
-			entry.natural = {
-				width,
-				height
-			};
+		loadMediaSize(source, entry.media === "video" ? "video" : "image").then((size) => {
+			if (disposed || entries.get(key) !== entry || !size) return;
+			entry.natural = size;
+			refine(key, entry);
 			notify(key);
 		});
 	}
@@ -485,9 +555,9 @@ function createBoardAssetManager(options) {
 			return load ? () => enqueue(key, "model", load) : null;
 		}
 		const media = source.media;
-		if (source.kind === "file") return resolveFile(key, media, source.value);
+		if (source.kind === "file") return startFile(key, media, source.value);
 		const load = textureLoad(media, source.value);
-		return () => enqueue(key, media, load);
+		return (entry) => enqueue(key, slotOf(media, source.value, entry.frameless), load);
 	}
 	const manager = {
 		assetKey: managedAssetKey,
@@ -509,11 +579,12 @@ function createBoardAssetManager(options) {
 		requestItem(item, edge = Number.POSITIVE_INFINITY) {
 			if (disposed) return;
 			const key = managedAssetKey(item);
-			if (!key || failedModels.has(key)) return;
+			if (!key || unavailable.has(key)) return;
 			const source = boardAssetKeySource(key);
 			if (!source) return;
 			const entry = ensureEntry(key);
 			entry.lastUsedAt = now();
+			if (!entry.natural) entry.natural = keys.get(item)?.natural ?? entry.natural;
 			entry.center = {
 				x: item.frame.x + item.frame.width / 2,
 				y: item.frame.y + item.frame.height / 2
@@ -701,7 +772,7 @@ function createBoardAssetManager(options) {
 			pathVersions.clear();
 			itemEpochs.clear();
 			starters.clear();
-			failedModels.clear();
+			unavailable.clear();
 			for (const [key, entry] of entries) evict(key, entry);
 			entries.clear();
 			for (const release of [...retiring]) release();