@moku-labs/game 0.14.10 → 0.14.12

package/dist/{src-CzfMhkry.mjs → src-CtC8w3_z.mjs}

@@ -1399,14 +1399,18 @@ function invoke(state, log, descriptor, signal) {
 }
 /**
 * Runs the handler of an awaited effect. A missing handler resolves `undefined` instantly, so a
-* game without `audio` runs; a `cosmetic` descriptor swallows the failure the same way.
+* game without `audio` runs. A `cosmetic` descriptor swallows the failure the same way, after one
+* warn entry `flow:fx-cosmetic-failed`: a broken sound never fails the node, and it is never
+* silent either. A failure that arrives after the abort of the signal is no failure: the handler
+* was told to stop, so nothing is written.
 *
 * @param state - fx module state.
+* @param log - The engine log.
 * @param descriptor - The awaited descriptor.
-* @param signal - The node's abort signal.
+* @param signal - The signal the handler is called with.
 * @returns What the handler resolved with.
 */
-async function effectValue(state, descriptor, signal) {
+async function effectValue(state, log, descriptor, signal) {
 	const entry = handlerFor(state, descriptor.kind);
 	if (entry === void 0) return;
 	try {
@@ -1415,8 +1419,12 @@ async function effectValue(state, descriptor, signal) {
 			mode: state.mode
 		});
 	} catch (error) {
-		if (descriptor.cosmetic === true) return;
-		throw error;
+		if (descriptor.cosmetic !== true) throw error;
+		if (signal.aborted) return;
+		log.warn("flow:fx-cosmetic-failed", {
+			kind: descriptor.kind,
+			message: asError$5(error).message
+		});
 	}
 }
 /**
@@ -1567,7 +1575,7 @@ function createFxApi(ctx, deps) {
 			const answers = descriptor.answers;
 			if (answers !== void 0) return openForAnswers(ctx, deps.gate, descriptor, answers, signal);
 			const shown = descriptor.kind === "guide" ? beginGuide(state, signal) : signal;
-			const work = effectValue(state, descriptor, shown);
+			const work = effectValue(state, ctx.log, descriptor, shown);
 			if (state.mode === "fast" || !ctx.deps.time.isRunning()) return work;
 			return enqueue(state, work);
 		},
@@ -3340,6 +3348,25 @@ function refuseEffect(signal) {
 	return refused;
 }
 /**
+* Refuses a descriptor that `fx.start` may not start: one with `answers`, and a `guide`. Both end
+* with an answer, and an answer has to be awaited. Every other descriptor passes. The one place
+* this rule and its message are written: the `fx` of a node context calls it, and so does
+* `fakeFx` of the testing entry, so a unit test gets the error the game would get.
+*
+* @param descriptor - The descriptor a body hands to `fx.start`.
+* @param path - Runtime path of the node, named in the message.
+* @throws {Error} When the descriptor has `answers` or is a `guide`.
+* @example
+* ```ts
+* refuseStart({ kind: "sfx" }, "board/place"); // undefined: a sound may be started
+* refuseStart({ kind: "popup", answers: ["ok"] }, "board/place"); // throws '[game] fx.start() got the effect "popup" in the node "board/place", …'
+* ```
+*/
+function refuseStart(descriptor, path) {
+	if (descriptor.answers === void 0 && descriptor.kind !== "guide") return;
+	throw new Error(`[game] fx.start() got the effect "${descriptor.kind}" in the node "${path}", and its answer has to be awaited.\n  Write await fx(...) for a descriptor with answers and for a guide.`);
+}
+/**
 * Builds the `fx` of a node context: awaited effects by call, effects the body does not wait for
 * by `start`, cosmetic hints by `emit`. A `guide` narrows the gate while it runs; the runner lifts
 * the narrow when the node is left. A body that was aborted keeps running, since the loop only
@@ -3373,8 +3400,9 @@ function nodeFx(modules, step) {
 	* Starts one effect and does not wait for it. It takes the path of an awaited effect, so the
 	* mode and the node's signal apply; only its end is nobody's wait. A failure is the handler's:
 	* it goes to the log and never to the node. A `cosmetic` descriptor does not get that far: the
-	* gateway swallows its failure. After the abort of the node nothing is started and nothing is
-	* thrown, not even for a descriptor refused otherwise. An effect that ends with a rejection
+	* gateway swallows its failure and writes the warn entry `flow:fx-cosmetic-failed` itself, so
+	* no `flow:fx-start-failed` follows. After the abort of the node nothing is started and nothing
+	* is thrown, not even for a descriptor refused otherwise. An effect that ends with a rejection
 	* after the abort did not fail: its handler was told to stop, so nothing is logged.
 	*
 	* @param descriptor - The descriptor the node starts.
@@ -3382,7 +3410,7 @@ function nodeFx(modules, step) {
 	*/
 	const start = (descriptor) => {
 		if (step.signal.aborted) return;
-		if (descriptor.answers !== void 0 || descriptor.kind === "guide") throw new Error(`[game] fx.start() got the effect "${descriptor.kind}" in the node "${step.path}", and its answer has to be awaited.\n  Write await fx(...) for a descriptor with answers and for a guide.`);
+		refuseStart(descriptor, step.path);
 		modules.fx.run(descriptor, step.signal).catch((error) => {
 			if (step.signal.aborted) return;
 			step.log.error("flow:fx-start-failed", {
@@ -28265,16 +28293,18 @@ const Covered = /*#__PURE__*/ tag("Covered");
 */
 const Escapable = /*#__PURE__*/ tag("Escapable");
 /**
-* The three Yoga counters, the reconcile count of the frame and the range re-renders of the
-* windowed lists. Written by the two systems of `ui`, read by the acceptance tests. Not part of
-* `app.ui`.
+* The three Yoga counters, the reconcile count of the frame, the range re-renders of the windowed
+* lists, and the style and write passes of the reconcile. Written by the two systems of `ui`, read
+* by the acceptance tests. Not part of `app.ui`.
 */
 const UiCounters = /*#__PURE__*/ resource("UiCounters", {
 	solves: 0,
 	nodes: 0,
 	measured: 0,
 	reconciles: 0,
-	windowRenders: 0
+	windowRenders: 0,
+	styled: 0,
+	written: 0
 });
 /**
 * Builds the effect a node awaits to show a popup. The gate opens for the outcomes of the
@@ -29850,10 +29880,22 @@ function contentOf$2(element, resolvedOf) {
 	return plain === "" ? void 0 : plain;
 }
 /**
+* The text style key a text element was given: its `style` prop while that is a key.
+*
+* @param element - The element to read.
+* @returns The key, or `undefined` for any other element and for a text with a `Style` object or
+* no style.
+*/
+function textStyleOf(element) {
+	if (element.type !== "text") return void 0;
+	const style = element.node.props.style;
+	return typeof style === "string" ? style : void 0;
+}
+/**
 * Turns one element and its subtree into snapshot nodes. The rect is natural; a fitted element
-* adds the scale it is drawn at; a text adds the words it draws; a text field adds its value; a
-* windowed scroll adds its window. The spacers of a windowed scroll are left out: its content
-* lists the live rows.
+* adds the scale it is drawn at; a text adds the words it draws and the style key of a keyed
+* text; a text field adds its value; a windowed scroll adds its window. The spacers of a windowed
+* scroll are left out: its content lists the live rows.
 *
 * @param state - The jsx state.
 * @param element - The element to read.
@@ -29879,10 +29921,15 @@ function nodeOf(state, element, resolvedOf) {
 		...node,
 		content
 	};
-	const fitted = element.style.fit === "contain" ? {
+	const textStyle = textStyleOf(element);
+	const styled = textStyle === void 0 ? worded : {
 		...worded,
+		textStyle
+	};
+	const fitted = element.style.fit === "contain" ? {
+		...styled,
 		fitScale: element.fit
-	} : worded;
+	} : styled;
 	const field = state.fields.get(element.entity);
 	const valued = field === void 0 ? fitted : {
 		...fitted,
@@ -30993,6 +31040,19 @@ function createRange(ctx, layout, reconcile) {
 		return scroll?.window === void 0 ? void 0 : scroll;
 	}
 	/**
+	* The height an element is laid out at as a row of a windowed scroll, whatever its style says.
+	* The reconcile keeps it with the resolved style: a row whose scroll names another row height
+	* is laid out again, though its own description says the same.
+	*
+	* @param parent - The parent of the element.
+	* @param node - The node of this render.
+	* @returns The row height, or `undefined` for an element that is no row of a windowed scroll.
+	*/
+	function rowHeightOf(parent, node) {
+		const scroll = windowedScrollOf(parent);
+		return scroll?.window === void 0 || isOwnKey(node.key) ? void 0 : scroll.window.rowHeight;
+	}
+	/**
 	* The style an element is laid out with, from the style it resolved to. A row of a windowed
 	* scroll is laid out at the row height, whatever its style says; a row style with another
 	* height is one warning per scroll.
@@ -31175,6 +31235,7 @@ function createRange(ctx, layout, reconcile) {
 	}
 	return {
 		rowStyle,
+		rowHeightOf,
 		slotsFor,
 		step,
 		dropRow,
@@ -31185,14 +31246,18 @@ function createRange(ctx, layout, reconcile) {
 //#endregion
 //#region src/plugins/ui/jsx/remeasure.ts
 /**
-* @file ui/jsx — the bound-text remeasure step: a text whose shown string changed this frame is
-* measured again, and its root solves only when the new string takes another size.
+* @file ui/jsx — the remeasure step: a text `text` wrote this frame is measured again, and its
+* root solves only when it takes another size. A bound text is written when the string it shows
+* changes; any text when `text` resolves it again, after a new locale or when its font arrives.
+* An icon without a size carries no `Text`: it is measured again when the line it is squared on
+* moved.
 */
 /**
-* Asks for a solve of every root with a bound text whose shown string measures to another size
-* now. `text` writes `resolved` earlier in this phase, and only when the shown string changed,
-* so a counter that stands still walks nothing. A leaving text is out of the flow: its roll
-* solves nothing.
+* Asks for a solve of every root with a text that measures to another size now. `text` writes
+* `resolved` earlier in this phase: for a bound text when the string it shows changed, so a
+* counter that stands still walks nothing, and for every label it resolved again, a message after
+* a new locale or any label whose font arrived. No root is reconciled for it and no view runs. A
+* leaving text is out of the flow: its roll solves nothing.
 *
 * @param ctx - Domain context of the ui plugin.
 * @param state - The jsx state: the elements and their roots.
@@ -31207,14 +31272,109 @@ function markResizedTexts(ctx, state, layout) {
 		if (layout.remeasure(element)) root.needsSolve = true;
 	}
 }
+/**
+* Asks for a solve of every root with an icon that takes another size now. An icon without a
+* size is square on one line of the `body` text style and carries no `Text`, so `text` never
+* names it. The layout reads that line once per call, and the icons are walked only when it
+* moved: the body font arrived, left or was replaced, with or without a text on the screen. A
+* leaving icon is out of the flow.
+*
+* @param ctx - Domain context of the ui plugin.
+* @param state - The jsx state: the elements and their roots.
+* @param layout - The layout module, which knows the line and measures the icon again.
+*/
+function markResizedIcons(ctx, state, layout) {
+	if (!layout.iconLineMoved()) return;
+	const ecs = ctx.deps.world.ecs;
+	for (const element of state.elements.values()) {
+		const root = state.roots.get(element.root);
+		if (!(element.type === "icon" && !ecs.has(element.entity, Exiting)) || root === void 0) continue;
+		if (layout.remeasure(element)) root.needsSolve = true;
+	}
+}
+//#endregion
+//#region src/plugins/ui/jsx/same.ts
+/**
+* @file ui/jsx — the comparison of two prop values of a description. A view builds its props
+* again at every render, so identity says nothing about plain data: a plain object and an array
+* are compared by value. Anything else is compared by identity, because only its owner knows what
+* it holds: a function, a `Set`, a `Map`, a `Date`, a class instance. Pure.
+*/
+/**
+* Tells a plain object from any other: one written as a literal, or made without a prototype.
+*
+* @param value - An object that is no array.
+* @returns True when its own enumerable keys are all it holds.
+* @example
+* ```ts
+* isPlain(new Set(["a"])); // false
+* ```
+*/
+function isPlain(value) {
+	const prototype = Object.getPrototypeOf(value);
+	return prototype === Object.prototype || prototype === null;
+}
+/**
+* Compares two lists by value: the same length and the same entry at every index.
+*
+* @param left - The list of the last render.
+* @param right - What this render wrote in its place.
+* @returns True when `right` is a list that says the same.
+* @example
+* ```ts
+* sameList(["a", { n: 1 }], ["a", { n: 1 }]); // true
+* ```
+*/
+function sameList(left, right) {
+	return Array.isArray(right) && left.length === right.length && left.every((entry, index) => sameValue(entry, right[index]));
+}
+/**
+* Compares two plain objects by value: the same own keys, each with the same value.
+*
+* @param left - The object of the last render.
+* @param right - The object of this render.
+* @returns True when both say the same.
+* @example
+* ```ts
+* sameFieldsDeep({ gap: 8, padding: { top: 4 } }, { gap: 8, padding: { top: 4 } }); // true
+* ```
+*/
+function sameFieldsDeep(left, right) {
+	const keys = Object.keys(left);
+	return keys.length === Object.keys(right).length && keys.every((key) => Object.hasOwn(right, key) && sameValue(left[key], right[key]));
+}
+/**
+* Tells whether two prop values say the same. Plain objects and arrays are compared by value,
+* recursing with this function; everything else by identity: a function, a `Set`, a `Map`, a
+* `Date`, a typed array, a class instance. So two sets are never the same, whatever they hold,
+* and a hook built once is the same in every new object around it. `NaN` is the same as `NaN`.
+*
+* @param left - The value of the last render.
+* @param right - The value of this render.
+* @returns True when nothing has to be done for the difference.
+* @example
+* ```ts
+* sameValue({ gap: 8, is: { hover: { gap: 4 } } }, { gap: 8, is: { hover: { gap: 4 } } }); // true
+* sameValue({ picked: new Set(["a"]) }, { picked: new Set(["a"]) }); // false
+* ```
+*/
+function sameValue(left, right) {
+	if (left === right) return true;
+	if (!(typeof left === "object" && typeof right === "object" && left !== null && right !== null)) return Number.isNaN(left) && Number.isNaN(right);
+	if (Array.isArray(left)) return sameList(left, right);
+	if (Array.isArray(right) || !isPlain(left) || !isPlain(right)) return false;
+	return sameFieldsDeep(left, right);
+}
 //#endregion
 //#region src/plugins/ui/jsx/reconcile.ts
 /**
 * @file ui/jsx — the reconcile: a description tree diffed by identity into the entities `ui`
-* owns, and the solve that gives every one of them its rect before it is ever drawn. Beside it:
+* owns, and the solve that gives every one of them its rect before it is ever drawn. An element
+* that stays is compared prop by prop, by value: one that says what it said is neither styled nor
+* written. Beside it:
 * the range of a windowed scroll (`range.ts`), the rest and the motion of the extras
-* (`extras.ts`), the hint routed to a keyed element (`hints.ts`) and the bound-text remeasure
-* (`remeasure.ts`).
+* (`extras.ts`), the hint routed to a keyed element (`hints.ts`) and the remeasure of the texts
+* `text` resolved again (`remeasure.ts`).
 */
 /** The four components an element may be drawn with; a state change can trade one for another. */
 const VISUALS = [
@@ -31264,6 +31424,43 @@ const ELEMENT_OWNED = namesOf$1([
 /** The style of a scroll's content: one object, so a render never reads as a new style. */
 const CONTENT_STYLE = Object.freeze({ origin: "topLeft" });
 /**
+* The props, besides `style`, `state` and `content`, that a live element is written from: `bind`,
+* `texture`, `name` and `fit` reach its visual, `intent`, `payload`, `local` and `escape` its
+* input, `components` its extras and `motion` its hooks. Every other prop is read from the node
+* where it is used, at every patch: `hosts`, the props of a windowed scroll, the props of a text
+* field, and the children.
+*/
+const WRITTEN = [
+	"bind",
+	"texture",
+	"name",
+	"fit",
+	"components",
+	"motion",
+	"intent",
+	"payload",
+	"local",
+	"escape"
+];
+/**
+* Tells whether two nodes write the same visual, input and extras: every prop of `WRITTEN` says
+* the same, as `sameValue` reads it.
+*
+* @param previous - The node the element was last patched from.
+* @param next - The node of this render.
+* @returns True when no component of the element has to be written for these props.
+* @example
+* ```ts
+* writesSame(
+*   { type: "button", props: { intent: "claim", payload: { id: 1 } }, children: [] },
+*   { type: "button", props: { intent: "claim", payload: { id: 2 } }, children: [] }
+* ); // false
+* ```
+*/
+function writesSame(previous, next) {
+	return WRITTEN.every((name) => sameValue(previous.props[name], next.props[name]));
+}
+/**
 * The children one element is diffed against. A scroll container holds exactly one of them: the
 * content the finger moves, which keeps the rects of its own children and carries them along. Its
 * pivot is its top-left corner, so the scroll step writes its offset straight into `y`; it lays
@@ -31665,6 +31862,7 @@ function createReconciler(ctx, modules, fields) {
 			warned: nameSet(),
 			scrolledIn: range.isMoving()
 		};
+		state.styled += 1;
 		state.elements.set(entity, element);
 		state.byIdentity.set(identity, entity);
 		trackHost(state, element);
@@ -31672,6 +31870,10 @@ function createReconciler(ctx, modules, fields) {
 		if (element.type === "input") fields.enter(element);
 		if (element.type === "scroll") state.scrolls.add(entity);
 		modules.layout.attach(element);
+		element.basis = {
+			epoch: state.epoch,
+			rowHeight: range.rowHeightOf(parent, node)
+		};
 		diffChildren(root, element, childrenOf(node, range.slotsFor(element)), instance);
 		root.needsSolve = true;
 		return entity;
@@ -31774,11 +31976,12 @@ function createReconciler(ctx, modules, fields) {
 	* its offset belongs to the finger, and a new look or a new rect never resets it. The look
 	* written is recorded as the rest of the visual, so the rest the world holds is always the one
 	* the element is drawn with: a restore brings it back to exactly that. The extras of the
-	* `components` prop are diffed last.
+	* `components` prop are diffed last. Every call is one write pass of `UiCounters`.
 	*
 	* @param element - The element that changed.
 	*/
 	function writeLive(element) {
+		state.written += 1;
 		writeOrder(element);
 		const visuals = visualOf$1(element);
 		const values = [...visuals, ...inputOf(element)];
@@ -31796,41 +31999,99 @@ function createReconciler(ctx, modules, fields) {
 		writeExtras(element);
 	}
 	/**
-	* Updates one live element from its new node.
+	* Compares the node of this render with the one a live element was last patched from. The
+	* resolved style is kept, and `styles.resolveElement` not called, while the raw `style` says the
+	* same by value, the state flags are the same, and what a style is resolved on stands: the
+	* epoch of the jsx state, which a new viewport ends, and the row height of a windowed row. The element is unchanged when its style is kept and its `content` and every
+	* prop of `WRITTEN` say the same too. A plain object and an array are compared by value;
+	* anything else by identity: a function, a `Set`, a `Map`, a `Date`, a class instance. The
+	* same object always says the same: one changed in place is not seen.
 	*
-	* @param root - The root being reconciled.
+	* @param root - The root being reconciled: its covered flag is one of the state flags.
 	* @param element - The element that stayed.
 	* @param node - The node of this render.
-	* @param instance - The identity of the nearest component instance.
+	* @returns The flags and the style of this render, and what they change.
 	*/
-	function patch(root, element, node, instance) {
-		checkWindow(node);
-		const previousNode = element.node;
+	function compare(root, element, node) {
+		const previous = element.node;
+		const parent = parentOf(element);
 		const is = isFlagsOf(node, {
 			pressed: element.is.pressed,
 			hover: element.is.hover,
 			focus: element.is.focus,
 			covered: root.covered
 		});
-		const style = styleFor(parentOf(element), node, is);
-		const moved = modules.layout.affectsRect(element.style, style);
-		const contentChanged = previousNode.props.content !== node.props.content || previousNode.props.style !== node.props.style;
+		const rowHeight = range.rowHeightOf(parent, node);
+		const stands = element.basis?.epoch === state.epoch && element.basis.rowHeight === rowHeight;
+		const sameStyle = sameValue(previous.props.style, node.props.style);
+		const keepsStyle = stands && sameStyle && sameValue(element.is, is);
+		const style = keepsStyle ? element.style : styleFor(parent, node, is);
+		const sameContent = sameValue(previous.props.content, node.props.content);
+		return {
+			is,
+			style,
+			rowHeight,
+			resolved: !keepsStyle,
+			moved: !keepsStyle && modules.layout.affectsRect(element.style, style),
+			measures: !stands || !sameStyle || !sameContent,
+			unchanged: keepsStyle && sameContent && writesSame(previous, node)
+		};
+	}
+	/**
+	* Writes what a patch changed on one element: its style onto the layout node when a rect or a
+	* measure may move, which asks the root for a solve; then, on a live element, its visual, its
+	* input and its extras, and its rest pose when no rect moved.
+	*
+	* @param root - The root being reconciled.
+	* @param element - The element, its node, flags and style of this render already set.
+	* @param change - What the patch found.
+	*/
+	function rewrite(root, element, change) {
+		const applies = change.moved || change.measures;
+		if (change.resolved || applies) state.styled += 1;
+		if (applies) {
+			modules.layout.applyStyle(element);
+			root.needsSolve = true;
+		}
+		if (!element.live) return;
+		writeLive(element);
+		if (!change.moved) modules.layout.repose(element, parentRect(element), false, hintOf(state, element));
+	}
+	/**
+	* Updates one live element from its new node. An element whose description says what it said is
+	* neither styled nor written: no `styles.resolveElement`, no `layout.applyStyle`, no solve asked
+	* for, no component set, no rest recorded, no rest pose moved. What still runs for it reads a
+	* prop the comparison leaves out, or costs nothing: the check of a windowed scroll's props; the
+	* node of this render kept on the element, which the hosts, the rows of a windowed scroll, a
+	* text field and the measure of a text read later; its motion and its instance; the host set;
+	* the props of a text field; the loop of a new motion; and the diff of its children.
+	*
+	* @param root - The root being reconciled.
+	* @param element - The element that stayed.
+	* @param node - The node of this render.
+	* @param instance - The identity of the nearest component instance.
+	*/
+	function patch(root, element, node, instance) {
+		checkWindow(node);
+		const change = compare(root, element, node);
 		const motion = node.props.motion;
 		const loopChanged = motion?.loop !== element.motion?.loop;
+		if (!change.unchanged) delete element.basis;
 		element.node = node;
-		element.is = is;
-		element.style = style;
+		element.is = change.is;
+		element.style = change.style;
 		element.motion = motion;
 		element.instance = instance;
 		trackHost(state, element);
 		if (element.type === "input") fields.patch(element);
 		if (loopChanged && element.entered) modules.layout.loop(element);
-		if (moved || contentChanged) {
-			modules.layout.applyStyle(element);
-			root.needsSolve = true;
+		if (!change.unchanged) {
+			rewrite(root, element, change);
+			element.basis = {
+				epoch: state.epoch,
+				rowHeight: change.rowHeight
+			};
 		}
-		if (element.live) writeLive(element);
-		if (element.live && !moved) modules.layout.repose(element, parentRect(element), false, hintOf(state, element));
 		diffChildren(root, element, childrenOf(node, range.slotsFor(element)), instance);
 	}
 	/**
@@ -32191,7 +32452,9 @@ function createReconciler(ctx, modules, fields) {
 		modules.layout.scroll(containers, lookup);
 		range.step(containers);
 		markResizedTexts(ctx, state, modules.layout);
+		markResizedIcons(ctx, state, modules.layout);
 		const viewportChanged = modules.styles.useViewport(ctx.deps.renderer.viewport.size());
+		if (viewportChanged) state.epoch += 1;
 		for (const root of dirtyRoots(viewportChanged)) reconcileDirtyRoot(root);
 		hostViews(ctx, state);
 		writeCounters();
@@ -32207,6 +32470,8 @@ function createReconciler(ctx, modules, fields) {
 		counters.solves = solves;
 		counters.reconciles = state.reconciles;
 		counters.windowRenders = state.windowRenders;
+		counters.styled = state.styled;
+		counters.written = state.written;
 	}
 	/**
 	* The second system of phase `layout`: one solve per marked root, then the rects, the rest
@@ -32308,6 +32573,7 @@ function createReconciler(ctx, modules, fields) {
 		const root = state.roots.get(element.root);
 		const moved = modules.layout.affectsRect(element.style, style);
 		element.style = style;
+		state.styled += 1;
 		if (moved) {
 			modules.layout.applyStyle(element);
 			if (root !== void 0) root.needsSolve = true;
@@ -32436,6 +32702,7 @@ function createJsxApi(ctx, modules) {
 			state.components.set(definition.name, definition);
 		},
 		refreshAll: () => {
+			state.epoch += 1;
 			for (const element of state.elements.values()) modules.layout.markMeasured(element);
 			for (const root of state.roots.values()) {
 				root.dirty = true;
@@ -33171,6 +33438,32 @@ const LINE_SAMPLE = "M";
 /** Below this a measured length counts as whole: the tolerance Yoga's own rounding uses. */
 const WHOLE_EPSILON = 1e-4;
 /**
+* One line of the text style an icon without a size is squared on.
+*
+* @param source - What the line is measured through.
+* @returns The height of that line, as `text` measures it now.
+*/
+function lineOf(source) {
+	return source.measure(LINE_SAMPLE, DEFAULT_TEXT_STYLE).height;
+}
+/**
+* Tells whether the line the icons are squared on moved since an icon was last measured: the
+* body font arrived, left or was replaced, or the style was swapped. Nothing is read before the
+* first icon without a size was measured, so a screen without one costs nothing; after that a
+* call is one read of the advance table. A move is told once.
+*
+* @param state - The layout state: the line the icons were last measured with.
+* @param source - What the line is measured through.
+* @returns True when every icon without a size has to be measured again.
+*/
+function iconLineMoved(state, source) {
+	if (state.iconLine === void 0) return false;
+	const line = lineOf(source);
+	if (line === state.iconLine) return false;
+	state.iconLine = line;
+	return true;
+}
+/**
 * Makes an icon square on the line height of the text next to it.
 *
 * @param line - What one line of that text style measures.
@@ -33336,6 +33629,7 @@ function installMeasure(state, node, element, source) {
 		const size = naturalSize(element, source);
 		state.measured += 1;
 		element.measuredSize = size;
+		if (element.type === "icon") state.iconLine = lineOf(source);
 		return clampToMode(yoga, size, {
 			width,
 			widthMode,
@@ -33356,9 +33650,12 @@ function markMeasured(state, element) {
 	state.byEntity.get(element.entity)?.markDirty();
 }
 /**
-* Marks the node of a bound text dirty when the string `text` shows for it now measures to another
-* size than the node was laid out with. `text` writes `resolved` only when the shown string
-* changes, and a counter that rolls through digits of one width asks for no solve.
+* Marks the node of a text dirty when what it draws now measures to another size than the node was
+* laid out with. `text` writes `Text` when the shown string of a bound label changes, and for
+* every label it resolves again: a message after a new locale, any label when its font arrives or
+* its style is swapped. So a text without `bind` is measured again too, and a counter that rolls
+* through digits of one width asks for no solve. A text with a fixed size has no measure function
+* and is left alone.
 *
 * @param state - The layout state, for the node of the element.
 * @param element - An element whose `Text` changed this frame.
@@ -33369,7 +33666,7 @@ function remeasureShown(state, element, source) {
 	const node = state.byEntity.get(element.entity);
 	const before = element.measuredSize;
 	if (node === void 0 || before === void 0) return false;
-	if (bindOf(element) === void 0 || !needsMeasure(element)) return false;
+	if (!needsMeasure(element)) return false;
 	const size = naturalSize(element, source);
 	if (size.width === before.width && size.height === before.height) return false;
 	node.markDirty();
@@ -33813,6 +34110,7 @@ function createLayoutApi(ctx) {
 			markMeasured(state, element);
 		},
 		remeasure: (element) => remeasureShown(state, element, source),
+		iconLineMoved: () => iconLineMoved(state, source),
 		markMeasured: (element) => markMeasured(state, element),
 		place: (parent, children) => placeChildren(state, parent, children),
 		free: (element) => freeNode(state, element),
@@ -34372,6 +34670,7 @@ function stopUi(state) {
 	state.layout.nodes = 0;
 	state.layout.yoga = void 0;
 	state.layout.scrolling = void 0;
+	state.layout.iconLine = void 0;
 	state.jsx.components.clear();
 	state.jsx.roots.clear();
 	state.jsx.elements.clear();
@@ -34727,7 +35026,10 @@ function createJsxState() {
 		hints: [],
 		scrolls: emptySet(),
 		windowRenders: 0,
-		remount: false
+		remount: false,
+		epoch: 0,
+		styled: 0,
+		written: 0
 	};
 }
 //#endregion
@@ -34762,6 +35064,7 @@ function createLayoutState() {
 			pointerY: 0,
 			offset: 0
 		},
+		iconLine: void 0,
 		order: 0,
 		cleanups: []
 	};
@@ -36493,4 +36796,4 @@ const screen = [
 	uiPlugin
 ];
 //#endregion
-export { sfx as $, types_exports$13 as A, Noise as At, defineStyle as B, rendererPlugin as Bt, types_exports$6 as C, effectsPlugin as Ct, types_exports$10 as D, ColorMatrix as Dt, types_exports$9 as E, Blur as Et, resolve as F, assetsPlugin as Ft, external as G, to as Gt, platformPlugin as H, flowPlugin as Ht, Box as I, animPlugin as It, mark as J, SaveUnreadableError as Jt, frames as K, type as Kt, LocalWrite as L, AnimPlayer as Lt, types_exports$15 as M, defineFilter as Mt, types_exports$16 as N, audioPlugin as Nt, types_exports$11 as O, Displacement as Ot, uiPlugin as P, scenesPlugin as Pt, set as Q, popup as R, Animation as Rt, types_exports$5 as S, messageDuration as St, types_exports$8 as T, Alpha as Tt, HAPTIC_KINDS as U, exit as Ut, textPlugin as V, worldPlugin as Vt, defineAnimation as W, slot as Wt, play$1 as X, timePlugin as Xt, parallel as Y, lifecyclePlugin as Yt, sequence as Z, clockPlugin as Zt, types_exports as _, Touchable as _t, defineMotion as a, wait as at, types_exports$3 as b, i18nPlugin as bt, schedule as c, DropTarget as ct, tr as d, Pointer as dt, spawn as et, defineFeature as f, PointerOver as ft, load as g, Tappable as gt, defineBundles as h, Swipeable as ht, screen as i, use as it, types_exports$14 as j, Outline as jt, types_exports$12 as k, Glow as kt, projection as l, Held as lt, music as m, Pressed as mt, createPlugin as n, stagger as nt, guide as o, inputPlugin as ot, defineEmitter as p, Pressable as pt, haptic as q, modelPlugin as qt, defineGame as r, tween as rt, hint as s, Draggable as st, createApp as t, spawned as tt, defineScene as u, Hovered as ut, types_exports$1 as v, Traceable as vt, types_exports$7 as w, Emitter as wt, types_exports$4 as x, messageArgument as xt, types_exports$2 as y, Traced as yt, defineTokens as z, Frames as zt };
+export { sfx as $, types_exports$13 as A, Noise as At, defineStyle as B, rendererPlugin as Bt, types_exports$6 as C, effectsPlugin as Ct, types_exports$10 as D, ColorMatrix as Dt, types_exports$9 as E, Blur as Et, resolve as F, assetsPlugin as Ft, external as G, slot as Gt, platformPlugin as H, flowPlugin as Ht, Box as I, animPlugin as It, mark as J, modelPlugin as Jt, frames as K, to as Kt, LocalWrite as L, AnimPlayer as Lt, types_exports$15 as M, defineFilter as Mt, types_exports$16 as N, audioPlugin as Nt, types_exports$11 as O, Displacement as Ot, uiPlugin as P, scenesPlugin as Pt, set as Q, clockPlugin as Qt, popup as R, Animation as Rt, types_exports$5 as S, messageDuration as St, types_exports$8 as T, Alpha as Tt, HAPTIC_KINDS as U, refuseStart as Ut, textPlugin as V, worldPlugin as Vt, defineAnimation as W, exit as Wt, play$1 as X, lifecyclePlugin as Xt, parallel as Y, SaveUnreadableError as Yt, sequence as Z, timePlugin as Zt, types_exports as _, Touchable as _t, defineMotion as a, wait as at, types_exports$3 as b, i18nPlugin as bt, schedule as c, DropTarget as ct, tr as d, Pointer as dt, spawn as et, defineFeature as f, PointerOver as ft, load as g, Tappable as gt, defineBundles as h, Swipeable as ht, screen as i, use as it, types_exports$14 as j, Outline as jt, types_exports$12 as k, Glow as kt, projection as l, Held as lt, music as m, Pressed as mt, createPlugin as n, stagger as nt, guide as o, inputPlugin as ot, defineEmitter as p, Pressable as pt, haptic as q, type as qt, defineGame as r, tween as rt, hint as s, Draggable as st, createApp as t, spawned as tt, defineScene as u, Hovered as ut, types_exports$1 as v, Traceable as vt, types_exports$7 as w, Emitter as wt, types_exports$4 as x, messageArgument as xt, types_exports$2 as y, Traced as yt, defineTokens as z, Frames as zt };