gesso-framework 0.6.14 → 0.6.16

package/dist/index.js

@@ -1,10 +1,10 @@
-import { A as output, C as equalityOf, D as input, E as InputCell, M as trackRead, N as withBodyOf, O as into, S as derive, T as internalState, _ as Resource, a as undoable, b as ComputedCell, c as classifyStorageError, d as storageReadValue, f as pick, g as mutate, h as throttled, i as OpfsStorage, j as outputTargetOf, k as isOutputTarget, l as storageErrorMessage, m as debounced, n as persisted, o as UndoStack, p as pickKeys, r as IndexedDbStorage, s as MemoryStorage, t as PersistedState, u as storageReadFailure, v as resource, w as InternalState, x as computed, y as select } from "./persisted-IXHP0d-X.js";
-import { A as structurallyEqual, C as applyPatches, D as channel, E as isChannelHostMessage, O as defineChannel, S as applyPatch, T as isChannelClientMessage, _ as printPropValue, a as isPortErrorMessage, b as findUnplainPath, c as servePorts, d as isConsoleEntryMessage, f as describeStream, g as formatStream, h as formatNodeReport, i as isHubMessage, k as viewKeys, l as workerHandle, m as formatNodePath, n as serveChannels, o as isPortHandshake, p as formatAge, r as APPLICATION_WORKER, s as portHandle, t as serve, u as captureConsole, v as ProvidedChannel, w as diffProjection, x as requirePlainData, y as provide } from "./serveChannels-CFzq0Hz3.js";
+import { A as output, C as equalityOf, D as input, E as InputCell, M as trackRead, N as withBodyOf, O as into, S as derive, T as internalState, _ as Resource, a as undoable, b as ComputedCell, c as classifyStorageError, d as storageReadValue, f as pick, g as mutate, h as throttled, i as OpfsStorage, j as outputTargetOf, k as isOutputTarget, l as storageErrorMessage, m as debounced, n as persisted, o as UndoStack, p as pickKeys, r as IndexedDbStorage, s as MemoryStorage, t as PersistedState, u as storageReadFailure, v as resource, w as InternalState, x as computed, y as select } from "./persisted-m5v2fOju.js";
+import { C as isChannelClientMessage, D as viewKeys, E as defineChannel, O as structurallyEqual, S as diffProjection, T as channel, _ as printPropValue, a as isPortErrorMessage, b as applyPatch, c as servePorts, d as isConsoleEntryMessage, f as describeStream, g as formatStream, h as formatNodeReport, i as isHubMessage, l as workerHandle, m as formatNodePath, n as serveChannels, o as isPortHandshake, p as formatAge, r as APPLICATION_WORKER, s as portHandle, t as serve, u as captureConsole, v as ProvidedChannel, w as isChannelHostMessage, x as applyPatches, y as provide } from "./serveChannels-DN2R2s0A.js";
 import { a as Each, i as show, n as getComponentMetadata, o as each, r as Show, t as createComponent } from "./createComponent-3n1ZSql8.js";
-import { c as channelSchema, l as describeChannel, t as AGENT_PORT } from "./remote-BEGRJ1V3.js";
-import { n as serveApplicationAgent } from "./app-6S4_PPB0.js";
+import { c as findUnplainPath, d as describeChannel, l as requirePlainData, t as AGENT_PORT, u as channelSchema } from "./remote-CSdwpwXz.js";
+import { n as serveApplicationAgent } from "./app-NLcQF2Oh.js";
 import { BehaviorSubject, EMPTY, Observable, Subject, Subscription, distinctUntilChanged, map } from "rxjs";
-import { AnimationDriver, Box, Canvas2DRenderer, CanvasPlatformSurface, CanvasTextMeasurer, Constraints, DefaultImageResolver, DefaultVideoResolver, DirtyFlags, EnvironmentNotifier, FocusNotifier, IconRasterizer, LayoutEngine, LayoutInspector, LayoutNotifier, MARK_PREFIX, Stack, TEXT_RUN_ID_SEPARATOR, UI_ROLES, UI_SEMANTIC_STATES, UiAnimationFrameClock, UiEditingController, UiEnvironmentKeys, UiEventType, UiFindController, UiFocusManager, UiGestureRecognizer, UiGraph, UiGraphBuilder, UiHitTester, UiHostFrameClock, UiInputDispatcher, UiInsetRegistry, UiKeyboardController, UiNodeType, UiPlatformAdapter, UiPointerController, UiPointerEvent, UiScheduler, UiSelectionController, UiSharedElements, UiSpring, UiTimerFrameClock, UiTouchScroller, UiVirtualSheet, UiVirtualWindow, UiWheelController, VIRTUAL_INDEX_PROP, VIRTUAL_LEAD_PROP, VIRTUAL_SHEET_PROP, VIRTUAL_WINDOW_PROP, WebGPURenderer, buildSemanticsSubtree, buildSemanticsTree, bumpFontStack, capturePointer, createCanvasSurface, createTween, createWebGPUSurface, defaultMotion, defineModifier, describeOverrides, diffSemantics, dragSessionFor, dropIndexShifts, easings, fade, formatExplanation, insetsEqual, isComponentLikeElement, isObservable, isWebGPUAvailable, linear, linkOf, markInstant, markNow, measure, measureSpan, motion, noInsets, observeViewportInsets, percent, performanceMarksEnabled, pointerDeviceOf, prepareInputSurface, propertyEffects, recordsEqual, registerFontStack, resolveCursor, rewalkSemantics, scrollRange, scrollbarThumb, semanticsInertAbove, semanticsMemory, setPerformanceMarks, setPerformanceMarks as setPerformanceMarks$1, textRunOfRecordId, themeTokens, touchActionFor, wheelDeltaYOf } from "gesso-core";
+import { AnimationDriver, Box, Canvas2DRenderer, CanvasPlatformSurface, CanvasTextMeasurer, Constraints, DefaultImageResolver, DefaultVideoResolver, DirtyFlags, EnvironmentNotifier, FocusNotifier, IconRasterizer, LayoutEngine, LayoutInspector, LayoutNotifier, MARK_PREFIX, Stack, TEXT_RUN_ID_SEPARATOR, UI_ROLES, UI_SEMANTIC_STATES, UiAnimationFrameClock, UiEditingController, UiEnvironmentKeys, UiEventType, UiFindController, UiFocusManager, UiGestureRecognizer, UiGraph, UiGraphBuilder, UiHitTester, UiHostFrameClock, UiInputDispatcher, UiInsetRegistry, UiKeyboardController, UiNodeType, UiPlatformAdapter, UiPointerController, UiPointerEvent, UiScheduler, UiSelectionController, UiSharedElements, UiSpring, UiTimerFrameClock, UiTouchScroller, UiVirtualSheet, UiVirtualWindow, UiWheelController, VIRTUAL_INDEX_PROP, VIRTUAL_LEAD_PROP, VIRTUAL_SHEET_PROP, VIRTUAL_WINDOW_PROP, WebGPURenderer, buildSemanticsSubtree, buildSemanticsTree, bumpFontStack, capturePointer, createCanvasSurface, createTween, createWebGPUSurface, defaultMotion, defineModifier, describeOverrides, diffSemantics, dragSessionFor, dropIndexShifts, easings, fade, formatExplanation, insetsEqual, isComponentLikeElement, isImeKey, isObservable, isWebGPUAvailable, linear, linkOf, markInstant, markNow, measure, measureSpan, motion, noInsets, observeViewportInsets, percent, performanceMarksEnabled, pointerDeviceOf, prepareInputSurface, propertyEffects, recordsEqual, registerFontStack, resolveCursor, rewalkSemantics, scrollRange, scrollbarThumb, semanticsInertAbove, semanticsMemory, setPerformanceMarks, setPerformanceMarks as setPerformanceMarks$1, textRunOfRecordId, themeTokens, touchActionFor, wheelDeltaYOf } from "gesso-core";
 //#region src/Component.ts
 /**
 * Base class for all Gesso framework components.
@@ -3014,13 +3014,13 @@ var EditingProxy = class {
 			const state = this.state;
 			if (clipboard === null || state === null) return;
 			event.preventDefault();
-			clipboard.setData("text/plain", state.text.slice(state.selectionStart, state.selectionEnd));
+			clipboard.setData("text/plain", state.clipboard ?? state.text.slice(state.selectionStart, state.selectionEnd));
 			if (state.html !== void 0) clipboard.setData("text/html", state.html);
 		};
 		const onCut = (event) => {
 			const state = this.state;
 			onCopy(event);
-			if (state !== null && state.selectionEnd > state.selectionStart) this.sink.beforeInput("deleteByCut", null);
+			if (state !== null && (state.clipboard !== void 0 ? state.clipboard.length > 0 : state.selectionEnd > state.selectionStart)) this.sink.beforeInput("deleteByCut", null);
 		};
 		const onKeyDown = (event) => {
 			this.sink.keyDown?.(event);
@@ -4155,6 +4155,41 @@ function afterLayout(run) {
 	globalThis.requestAnimationFrame(() => globalThis.requestAnimationFrame(run));
 }
 //#endregion
+//#region src/app/pixelRatio.ts
+/**
+* Hears the window's device pixel ratio change while its size does not.
+*
+* A window dragged from a laptop's screen to an external monitor keeps
+* its size in CSS pixels, so no `ResizeObserver` fires, but each CSS
+* pixel is now a different number of device pixels. A canvas sized for
+* the old ratio is drawn blurred, or scaled, until something else
+* happens to resize it. The browser says when the ratio changes only
+* through a media query for the ratio it had, which stops matching; so
+* each change is heard once and the query is made again for the new
+* ratio.
+*
+* @returns A function that stops listening.
+*/
+function watchPixelRatio(onChange, view = globalThis.window) {
+	if (view === void 0 || typeof view.matchMedia !== "function") return () => {};
+	let query = null;
+	let stopped = false;
+	const listen = () => {
+		query = view.matchMedia(`(resolution: ${view.devicePixelRatio || 1}dppx)`);
+		query.addEventListener("change", changed, { once: true });
+	};
+	function changed() {
+		if (stopped) return;
+		onChange(view.devicePixelRatio || 1);
+		listen();
+	}
+	listen();
+	return () => {
+		stopped = true;
+		query?.removeEventListener("change", changed);
+	};
+}
+//#endregion
 //#region src/app/worker/WorkerApp.ts
 /**
 * Main-thread half of a worker-hosted Gesso application.
@@ -4195,6 +4230,35 @@ function openUrlWith(handler, url) {
 	}
 	window.open(url, "_blank", "noopener,noreferrer");
 }
+/**
+* What to say when the browser fails a worker at the worker object,
+* before the worker could say anything itself.
+*
+* Two different failures arrive this way. An exception thrown while the
+* worker's modules were evaluating is an `ErrorEvent` with a message,
+* and the message is the useful part. A script that never loaded at all
+* is a plain `Event` with no message and no filename, and the browser
+* says nothing more about it anywhere a script can read: the reason is
+* only in the network panel. That case used to be reported as "failed
+* to start: undefined", so it now says where to look and what the
+* usual reasons are. The last one is easy to hit: turn on
+* `Cross-Origin-Embedder-Policy` and a worker script the browser cached
+* before is refused, because a dev server's 304 does not repeat the
+* header.
+*/
+function workerFailureMessage(worker, event) {
+	const name = worker === "render" ? "the render worker" : "the app worker";
+	if (hasMessage(event)) {
+		const filename = event.filename;
+		const where = filename === void 0 || filename === "" ? "" : ` (${filename})`;
+		return `${name} failed to start: ${event.message}${where}`;
+	}
+	return `${name} failed to start: its script did not load. The browser's network panel has the reason; usually the file is missing (404), is served with a MIME type that is not JavaScript, or was refused under the page's Cross-Origin-Embedder-Policy (including a copy cached before the policy was turned on; a hard reload clears it).`;
+}
+function hasMessage(event) {
+	const message = event.message;
+	return typeof message === "string" && message !== "";
+}
 function resolveAppLogic(spec) {
 	if (typeof spec === "function") return {
 		endpoint: spec(),
@@ -4221,6 +4285,9 @@ var WorkerApp = class {
 	canvas;
 	host;
 	resizeObserver = null;
+	/** The host's last size, for a pixel ratio that changes on its own; see `watchPixelRatio`. */
+	hostSize = null;
+	stopPixelRatio = null;
 	detachInput = null;
 	/** Pickers and remembered handles, made on the first file request. */
 	files = null;
@@ -4346,6 +4413,7 @@ var WorkerApp = class {
 			this.appLogicWorker = application;
 			this.ownsAppLogicWorker = resolved.owned;
 			application.addEventListener("message", this.handleAppWorkerMessage);
+			if (resolved.owned) application.addEventListener("error", this.handleAppWorkerFailure);
 			application.start?.();
 			if (this.consoleForwarding) application.postMessage({
 				type: "gesso:console",
@@ -4424,7 +4492,7 @@ var WorkerApp = class {
 			})
 		}, this.proxy);
 		const webmcp = this.options.webmcp;
-		if (webmcp !== void 0 && webmcp !== false) import("./webmcp-Dsp4W-pi.js").then((n) => n.a).then((agent) => agent.connectWebMcp(this, webmcp === true ? {} : webmcp)).then((disconnect) => {
+		if (webmcp !== void 0 && webmcp !== false) import("./webmcp-BvQBxNjX.js").then((n) => n.a).then((agent) => agent.connectWebMcp(this, webmcp === true ? {} : webmcp)).then((disconnect) => {
 			if (this.renderWorker === worker) this.disconnectWebMcp = disconnect;
 			else disconnect();
 		}, (error) => console.warn("[gesso] WebMCP could not register the channels:", error));
@@ -4450,8 +4518,22 @@ var WorkerApp = class {
 	handleWorkerFailure = (event) => {
 		event.preventDefault();
 		if (this.ready) return;
-		const where = event.filename === void 0 || event.filename === "" ? "" : ` (${event.filename})`;
-		this.report(`the render worker failed to start: ${event.message}${where}`, void 0, "uncaught");
+		this.report(workerFailureMessage("render", event), void 0, "uncaught");
+	};
+	/**
+	* The app worker's counterpart, for the one failure nothing else
+	* reports: a script that never loaded. Without this, an app worker
+	* blocked by a 404 or by the page's embedder policy left the screen
+	* waiting on channels that would never arrive, and said nothing.
+	*
+	* An exception inside the app worker arrives here too, with a
+	* message, and is left alone: the browser reports it from inside the
+	* worker with its stack, which is better than anything said here.
+	*/
+	handleAppWorkerFailure = (event) => {
+		if (hasMessage(event)) return;
+		event.preventDefault();
+		this.report(workerFailureMessage("app", event), void 0, "uncaught");
 	};
 	/** Reports an error, to `onError` or to the console it defaults to. */
 	report(message, stack, source) {
@@ -4475,22 +4557,26 @@ var WorkerApp = class {
 	* the first letter opens lives in exactly that gap.
 	*/
 	forwardKeyDown(event, viaProxy = false) {
+		if (isImeKey(event)) return;
 		this.flushPendingMove();
 		if (this.options.interceptFind === true && isFind(event) || this.options.interceptKey?.(event) === true) event.preventDefault();
 		if (event.key === "Tab" || isSelectAll(event)) event.preventDefault();
 		this.post({
 			type: "keyDown",
 			key: event.key,
+			code: event.code,
 			modifiers: modifiersFrom(event),
 			at: epochFromEvent(event),
 			textFollows: viaProxy
 		});
 	}
 	forwardKeyUp(event) {
+		if (isImeKey(event)) return;
 		this.flushPendingMove();
 		this.post({
 			type: "keyUp",
 			key: event.key,
+			code: event.code,
 			modifiers: modifiersFrom(event),
 			at: epochFromEvent(event)
 		});
@@ -4617,6 +4703,8 @@ var WorkerApp = class {
 		this.audio = null;
 		this.resizeObserver?.disconnect();
 		this.resizeObserver = null;
+		this.stopPixelRatio?.();
+		this.stopPixelRatio = null;
 		this.resizeInFlight = false;
 		this.heldResize = null;
 		this.canvasOrigin = null;
@@ -4629,7 +4717,10 @@ var WorkerApp = class {
 			this.renderWorker = void 0;
 		}
 		this.appLogicWorker?.removeEventListener("message", this.handleAppWorkerMessage);
-		if (this.ownsAppLogicWorker) this.appLogicWorker?.terminate();
+		if (this.ownsAppLogicWorker) {
+			this.appLogicWorker?.removeEventListener("error", this.handleAppWorkerFailure);
+			this.appLogicWorker?.terminate();
+		}
 		this.appLogicWorker = void 0;
 		this.ownsAppLogicWorker = false;
 		if (this.canvas !== void 0 && this.canvas.parentElement === this.host) this.host?.removeChild(this.canvas);
@@ -4837,13 +4928,25 @@ var WorkerApp = class {
 			this.canvasOrigin = null;
 			if (this.fullscreen) return;
 			const { width, height } = entry.contentRect;
-			if (width > 0 && height > 0) this.requestResize({
-				width,
-				height,
-				dpr: window.devicePixelRatio || 1
-			});
+			if (width > 0 && height > 0) {
+				this.hostSize = {
+					width,
+					height
+				};
+				this.requestResize({
+					width,
+					height,
+					dpr: window.devicePixelRatio || 1
+				});
+			}
 		});
 		this.resizeObserver.observe(element);
+		this.stopPixelRatio = watchPixelRatio((dpr) => {
+			if (this.hostSize !== null && !this.fullscreen) this.requestResize({
+				...this.hostSize,
+				dpr
+			});
+		});
 	}
 	/**
 	* Sends a size to the worker, or holds it back until the worker has
@@ -9746,7 +9849,7 @@ function timeOrigin() {
 }
 function editingStatesEqual(a, b) {
 	if (a === null || b === null) return a === b;
-	return a.text === b.text && a.selectionStart === b.selectionStart && a.selectionEnd === b.selectionEnd && a.multiline === b.multiline && a.composing === b.composing && a.html === b.html && a.caret.x === b.caret.x && a.caret.y === b.caret.y && a.caret.width === b.caret.width && a.caret.height === b.caret.height;
+	return a.text === b.text && a.selectionStart === b.selectionStart && a.selectionEnd === b.selectionEnd && a.multiline === b.multiline && a.composing === b.composing && a.html === b.html && a.clipboard === b.clipboard && a.caret.x === b.caret.x && a.caret.y === b.caret.y && a.caret.width === b.caret.width && a.caret.height === b.caret.height;
 }
 /** A canvas for the text measurer when the draw canvas is not a 2D one. */
 function createMeasureCanvas() {
@@ -9894,6 +9997,9 @@ var GessoApp = class {
 	onOpenRoute;
 	running = false;
 	resizeObserver = null;
+	/** The host's last size, for a pixel ratio that changes on its own; see `watchPixelRatio`. */
+	hostSize = null;
+	stopPixelRatio = null;
 	proxy = null;
 	/** The one audio element, behind `AudioService`; see `AudioSink`. */
 	audio = null;
@@ -10134,6 +10240,8 @@ var GessoApp = class {
 		this.adapter.detach();
 		this.resizeObserver?.disconnect();
 		this.resizeObserver = null;
+		this.stopPixelRatio?.();
+		this.stopPixelRatio = null;
 		if (isCanvasElement(this.canvas) && this.canvas.parentElement === this.host) this.host.removeChild(this.canvas);
 		this.runtime.dispose();
 	}
@@ -10301,9 +10409,16 @@ var GessoApp = class {
 			const entry = entries[0];
 			if (entry === void 0) return;
 			if (this.fullscreen) return;
+			this.hostSize = {
+				width: entry.contentRect.width,
+				height: entry.contentRect.height
+			};
 			this.resize(entry.contentRect.width, entry.contentRect.height);
 		});
 		this.resizeObserver.observe(this.host);
+		this.stopPixelRatio = watchPixelRatio(() => {
+			if (this.hostSize !== null && !this.fullscreen) this.resize(this.hostSize.width, this.hostSize.height);
+		});
 	}
 };
 function createCanvasElement() {
@@ -10568,7 +10683,7 @@ var GessoAppBuilder = class {
 		if (app === void 0 || key !== "gesso:agent") return;
 		const pair = new MessageChannel();
 		const registrations = this.channelRegistrations;
-		import("./app-6S4_PPB0.js").then((n) => n.t).then((agent) => agent.serveApplicationAgent(pair.port2, {
+		import("./app-NLcQF2Oh.js").then((n) => n.t).then((agent) => agent.serveApplicationAgent(pair.port2, {
 			channels: () => registrations.filter((registration) => registration.source !== void 0).map((registration) => ({
 				token: registration.token,
 				source: registration.source
@@ -10581,7 +10696,7 @@ var GessoAppBuilder = class {
 	connectWebMcp(app) {
 		const choice = this.webmcpChoice;
 		if (choice === false) return;
-		import("./webmcp-Dsp4W-pi.js").then((n) => n.a).then((agent) => agent.connectWebMcp(this, choice === true ? {} : choice)).then((disconnect) => {
+		import("./webmcp-BvQBxNjX.js").then((n) => n.a).then((agent) => agent.connectWebMcp(this, choice === true ? {} : choice)).then((disconnect) => {
 			if (this.app === app) this.disconnectWebMcp = disconnect;
 			else disconnect();
 		}, (error) => console.warn("[gesso] WebMCP could not register the channels:", error));
@@ -11410,10 +11525,10 @@ var RenderWorkerApp = class {
 				runtime.input.wheel.wheel(message.x, message.y, message.deltaX, message.deltaY, message.modifiers, message.deltaMode, message.wheelDeltaY, message.at === void 0 ? void 0 : message.at - performance.timeOrigin);
 				break;
 			case "keyDown":
-				runtime.input.keyboard.keyDown(message.key, message.modifiers, message.textFollows);
+				runtime.input.keyboard.keyDown(message.key, message.modifiers, message.textFollows, message.code);
 				break;
 			case "keyUp":
-				runtime.input.keyboard.keyUp(message.key, message.modifiers);
+				runtime.input.keyboard.keyUp(message.key, message.modifiers, message.code);
 				break;
 			case "beforeInput":
 				runtime.input.editing.beforeInput(message.inputType, message.data);