gesso-framework 0.8.0 → 0.8.1

package/dist/remote/index.d.ts

@@ -1,5 +1,5 @@
 import { B as ServedChannel } from "../tools-Bl8LZ7LR.js";
-import { Dt as AppLogicEndpoint } from "../index-DocVauCS.js";
+import { Dt as AppLogicEndpoint } from "../index-C08h2Jze.js";
 //#region src/remote/frames.d.ts
 /**
  * The whole wire format, which is deliberately smaller than the

package/dist/{render-W2XO444K.js → render-DlhL5y0d.js}

@@ -1465,6 +1465,8 @@ var ShellService = class {
 	handler = null;
 	/** What `warnOnLeave` last said. */
 	leaving = false;
+	/** What `preferColorScheme` last asked for; null until it is asked. */
+	preferred = null;
 	scheme = internalState("light");
 	contrastState = internalState("standard");
 	pointerState = internalState("fine");
@@ -1582,6 +1584,10 @@ var ShellService = class {
 			type: "leaveWarning",
 			on: true
 		});
+		if (handler !== null && this.preferred !== null) handler({
+			type: "colorScheme",
+			preference: this.preferred
+		});
 	}
 	/**
 	* Called by the runtime when the shell reports the appearance.
@@ -1798,6 +1804,33 @@ var ShellService = class {
 			on
 		});
 	}
+	/**
+	* Asks the shell to report this appearance from now on: `light` or
+	* `dark` whatever the platform says, or `auto` to follow the platform
+	* again. `colorScheme` then reports the answer, as it does when the
+	* host calls `setColorScheme`, which is the same switch.
+	*
+	* For an application whose appearance setting is its own and stored:
+	* the host reads the stored choice before the first frame and starts
+	* with it (`createApp({ colorScheme })`), and the application, where
+	* the person changes it, says so here. Without this, an application in
+	* a render worker could not take back an override the host started it
+	* with, and `auto` would keep reporting the stored choice instead of
+	* the platform's. An application that stores nothing can combine its
+	* choice with `colorScheme` instead and never call this.
+	*
+	* A request, because the media query is the window's; and a state,
+	* like `warnOnLeave`, so a shell that arrives after it was asked is
+	* told. Asking for the same thing twice sends nothing.
+	*/
+	preferColorScheme(preference) {
+		if (preference === this.preferred) return;
+		this.preferred = preference;
+		this.handler?.({
+			type: "colorScheme",
+			preference
+		});
+	}
 	/** Called by the runtime when the shell reports the state. Not for applications. */
 	applyFullscreen(active) {
 		if (this.isFullscreen.value !== active) this.isFullscreen.value = active;
@@ -2928,6 +2961,20 @@ var EditingService = class {
 		return this.controller.caretRectOf(node, offset);
 	}
 	/**
+	* The caret position nearest a point in a field, the point given as a
+	* pointer event gives it: where a press there would put the caret.
+	*
+	* What a field opened over text the person pointed at uses to start
+	* the caret where they pointed: ask once the field is laid out, then
+	* `select` that offset. Null when the node is not an editable, when it
+	* has not been laid out yet, or before the runtime has wired the
+	* controller: "ask again next frame", as for `caretRectOf`.
+	*/
+	offsetNear(node, x, y) {
+		if (node === null || this.controller === null) return null;
+		return this.controller.offsetNear(node, x, y);
+	}
+	/**
 	* Selects from `anchor` to `focus` and focuses the field the focus is
 	* in: within one field, or across the fields of an editing group (see
 	* `UiEditingGroup`). What an editor does after a command over a
@@ -3457,6 +3504,17 @@ var InspectionService = class {
 		return this.host.inspect(node);
 	}
 	/**
+	* Why the node has the size it has, as the layout decided it: for
+	* each axis, the rule that fixed it (`decidedBy`: its own length, a
+	* flex share, a stretch across its parent, its content, a clamp) and
+	* the sentences that say so. What a design tool needs to tell an
+	* element that fills its parent from one that only happens to be as
+	* wide, which the box alone cannot. Null before the node is laid out.
+	*/
+	explain(node) {
+		return this.host?.explain?.(node) ?? null;
+	}
+	/**
 	* Where the node is drawn, as `inspect(node).box` reports it, without
 	* the rest of the report: for an editor that reads the boxes of many
 	* nodes as its view moves (a minimap of a board of frames), where
@@ -4101,6 +4159,10 @@ var GessoRuntime = class {
 	* lays out, whichever comes first; see `resize`.
 	*/
 	laidOutOnce = false;
+	/** Frames in a row that threw; see `reportFrameError`. */
+	framesFailed = 0;
+	/** Nodes that declare `holdUnseen`, as frames have found them; see `updateHolds`. */
+	holdable = /* @__PURE__ */ new Set();
 	constructor(options) {
 		this.services = options.services ?? new ServiceRegistry();
 		this.channels = options.channels ?? new ChannelRegistry();
@@ -4293,6 +4355,7 @@ var GessoRuntime = class {
 		this.services.get(InspectionService).attach({
 			nodesAt: (x, y) => this.hitTester.hitStack(x, y),
 			inspect: (node) => this.inspectNode(node),
+			explain: (node) => this.engine.explain(node),
 			box: (node) => {
 				const box = this.engine.visibleBox(node);
 				return {
@@ -4380,6 +4443,7 @@ var GessoRuntime = class {
 		this.frameErrorListener = listener;
 	}
 	reportFrameError(error) {
+		if (this.framesFailed++ === 0) this.requestRepaint();
 		const message = error instanceof Error ? error.message : String(error);
 		const stack = error instanceof Error ? error.stack : void 0;
 		if (this.frameErrorListener !== null) {
@@ -5380,7 +5444,9 @@ var GessoRuntime = class {
 	* reconciles rather than recreating, so a component whose class is
 	* the same object as before keeps its host and its `internalState`;
 	* one whose module was replaced is a different class, and its host
-	* is disposed and mounted again. Scroll offsets on containers that
+	* is disposed and mounted again with everything it rendered: its body
+	* made new objects for its children, and a child kept from before
+	* would go on holding the old ones. Scroll offsets on containers that
 	* survive are kept, because the node is kept. Component state in a
 	* replaced module is lost, which is the honest cost and the reason
 	* this is a development tool.
@@ -5514,7 +5580,10 @@ var GessoRuntime = class {
 		if (isObservable(definition)) throw new Error("Root definition cannot be an Observable. Wrap it in a component or static element.");
 		if (isComponentLikeElement(definition)) {
 			if (depth > MAX_ROOT_COMPONENT_DEPTH) throw new Error(`Root component chain exceeded ${MAX_ROOT_COMPONENT_DEPTH} levels without producing an element.`);
-			const output = this.resolver.resolve(definition, `app:component:${depth}`);
+			const anchorId = `app:component:${depth}`;
+			const before = this.resolver.hostFor(anchorId);
+			if (before !== void 0 && before.component !== definition.component && this.root !== void 0) this.builder.reconcileChildren(this.root, []);
+			const output = this.resolver.resolve(definition, anchorId);
 			return this.resolveRootElement(output, depth + 1);
 		}
 		return definition;
@@ -6245,6 +6314,7 @@ var GessoRuntime = class {
 					childX = x - (rec.scrollable ? rec.scrollX : 0);
 					childY = y - (rec.scrollable ? rec.scrollY : 0);
 				}
+				if (node.hold !== null && !(focused != null && focused.heldBy === node)) continue;
 				for (let child = node.lastChild; child !== null; child = child.previousSibling) stack.push([
 					child,
 					childX,
@@ -6605,6 +6675,39 @@ var GessoRuntime = class {
 		this.warnedLayoutPasses = true;
 		console.warn(`Gesso: a frame laid out ${MAX_LAYOUT_PASSES} times and its layout listeners were still changing it, so it was painted unsettled and the rest left for the next frame. Something on \`host.onLayout\` (a breakpoint, a sizeContainer, a Responsive, a modifier of your own) is writing a property that changes the box it is listening to, back and forth. Shown once.`);
 	}
+	/**
+	* Holds each subtree that declares `holdUnseen` while it cannot be
+	* read, and lets it go on the frame it can (see `UiGraph.hold`).
+	*
+	* Decided after the frame is drawn, from where it was drawn: a subtree
+	* is only ever held once it has been laid out and painted, so what is
+	* kept of it is what it showed, and one let go catches up on the next
+	* frame, which its own marks arm. Only frames that moved or laid
+	* something out can change the answer, so the rest pay nothing.
+	*/
+	updateHolds(frame, laidOut) {
+		let found = false;
+		for (const [node, flags] of frame.entries()) if ((flags & DirtyFlags.Properties) !== 0 && node.properties.get("holdUnseen") !== void 0 && !this.holdable.has(node)) {
+			this.holdable.add(node);
+			found = true;
+		}
+		if (this.holdable.size === 0 || !laidOut && !found) return;
+		for (const node of this.holdable) {
+			const how = node.properties.get("holdUnseen");
+			if (how === void 0 || this.graph.getNode(node.id) !== node) {
+				this.graph.release(node);
+				this.holdable.delete(node);
+				continue;
+			}
+			const rec = this.engine.recordFor(node);
+			if (rec === void 0 || !(rec.width > 0) || !(rec.height > 0)) continue;
+			const box = this.engine.screenBox(node);
+			const margin = how === true ? 0 : how.margin ?? 0;
+			const below = how === true ? 0 : how.belowScale ?? 0;
+			if (box.x + box.width > -margin && box.y + box.height > -margin && box.x < this.width + margin && box.y < this.height + margin && box.width / rec.width >= below) this.graph.release(node);
+			else this.graph.hold(node);
+		}
+	}
 	handleFrame(collected) {
 		const root = this.root;
 		if (root === void 0) return;
@@ -6636,11 +6739,13 @@ var GessoRuntime = class {
 			overlay: overlay?.shapes,
 			changes
 		}));
+		this.updateHolds(frame, laidOut);
 		if (overlay !== null) {
 			if (laidOut) this.sendInspection();
 			this.scheduleInspectorRepaint(overlay.nextChange);
 		}
 		this.sendDevtoolsUpdates(frame);
+		this.framesFailed = 0;
 		const finished = now();
 		const elapsed = finished - (this.frameBegan ?? started);
 		this.frameBegan = null;
@@ -7307,4 +7412,4 @@ function failure(text) {
 //#endregion
 export { ComponentHostResolver as A, ChannelRegistry as B, ShellService as C, isDiscreteInputMessage as D, epochNow as E, FocusService as F, Input as G, Channel as H, boundFocus as I, BoundsCell as J, Output as K, OverlayScopeKey as L, StartingInputsKey as M, OverlayLayer as N, isInputMessage as O, __decorate as P, OverlayService as R, FrameService as S, epochFromEvent as T, Define as U, ChannelReplica as V, Inject as W, ServiceRegistry as X, bounds as Y, Component as Z, parsePattern as _, UI_FRAME_PHASES as a, AudioService as b, TextService as c, ScrollService as d, EditingService as f, formatUrl as g, buildPath as h, GessoRuntime as i, ComponentHost as j, modifiersFrom as k, FontService as l, RouterService as m, renderFrame as n, InspectionService as o, FindService as p, liveInput as q, isClaimedError as r, AnimationService as s, renderModule as t, MediaService as u, parseUrl as v, shellFilesUnsupported as w, treeText as x, RouteState as y, isClassComponent as z };
 
-//# sourceMappingURL=render-W2XO444K.js.map
+//# sourceMappingURL=render-DlhL5y0d.js.map