@rohal12/spindle 0.59.15 → 0.59.17

package/dist/pkg/headless.js

@@ -3,7 +3,7 @@ import { useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, u
 import { useSyncExternalStore } from "preact/compat";
 import { createStore } from "zustand/vanilla";
 import { immer } from "zustand/middleware/immer";
-import { Immer, current, enableMapSet, enablePatches, freeze, isDraft } from "immer";
+import { Immer, current, enableMapSet, enablePatches, freeze, isDraft, original } from "immer";
 import { shallow } from "zustand/vanilla/shallow";
 import { Fragment as Fragment$1, jsx, jsxs } from "preact/jsx-runtime";
 import { micromark } from "micromark";
@@ -10286,13 +10286,35 @@ function parseDelay(str) {
 	return parseFloat(trimmed);
 }
 //#endregion
+//#region src/utils/listeners.ts
+/**
+* A set of listeners to call when something happens: `subscribe` adds one and
+* returns the function that removes it, `notify` calls each one. A listener
+* removed or added while they are called is called or not as the set was
+* when `notify` started.
+*/
+function createListeners() {
+	const listeners = /* @__PURE__ */ new Set();
+	return {
+		subscribe(listener) {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		},
+		notify() {
+			for (const listener of [...listeners]) listener();
+		}
+	};
+}
+//#endregion
 //#region src/runtime-errors.ts
 var errors = [];
 var nextId = 1;
-var listeners$1 = /* @__PURE__ */ new Set();
+var listeners$1 = createListeners();
 function update(next) {
 	errors = next;
-	for (const listener of listeners$1) listener();
+	listeners$1.notify();
 }
 /**
 * Show `error` on the page, after `context` (what failed). The same error
@@ -10328,12 +10350,7 @@ function getRuntimeErrors() {
 	return errors;
 }
 /** Call `listener` whenever the shown errors change; returns unsubscribe. */
-function subscribeRuntimeErrors(listener) {
-	listeners$1.add(listener);
-	return () => {
-		listeners$1.delete(listener);
-	};
-}
+var subscribeRuntimeErrors = listeners$1.subscribe;
 //#endregion
 //#region src/components/macros/arg-utils.ts
 /**
@@ -10883,6 +10900,13 @@ function registerWidgetDefinitions(nodes, passageName) {
 */
 var FrozenStateContext = createContext(null);
 /**
+* Tells a timer ({repeat}, {timed}) whether the passage it belongs to has
+* been left: it must not run a new body then, for that would write into the
+* destination's state until the outgoing tree unmounts (#410). Null outside
+* a passage.
+*/
+var OutgoingContext = createContext(null);
+/**
 * Story state fields `keys`, re-rendering when any of them changes (as one
 * useStoryStore() selector per field would). The result keeps its identity
 * while the fields don't change, as the store's snapshot must.
@@ -11054,7 +11078,7 @@ function getPRNGPull() {
 * (see src/tooling.ts).
 */
 var TRANSFORM_CACHE_MAX = 500;
-var NAMESPACES$1 = {
+var NAMESPACES$2 = {
 	$: "variables",
 	_: "temporary",
 	"@": "locals",
@@ -11087,7 +11111,7 @@ function transform(expr, goal = "expression") {
 		result += expr.slice(at, ref.start);
 		if (ref.shorthand) result += `${ref.name}: `;
 		else if (IDENT_END_RE.test(result.slice(-2))) result += " ";
-		result += `${NAMESPACES$1[ref.sigil]}["${ref.name}"]`;
+		result += `${NAMESPACES$2[ref.sigil]}["${ref.name}"]`;
 		at = ref.end;
 	}
 	result += expr.slice(at);
@@ -14400,7 +14424,12 @@ function getByPath(obj, segments) {
 	for (const seg of segments) {
 		if (current == null) return void 0;
 		if (seg in Object.prototype && !hasOwn(Object(current), seg)) return;
-		current = current[seg];
+		const holder = current;
+		current = holder[seg];
+		if (current === void 0 && isDraft(holder) && (holder instanceof Map || holder instanceof Set)) {
+			const base = original(holder);
+			if (base && hasOwn(base, seg)) current = base[seg];
+		}
 	}
 	return current;
 }
@@ -14437,10 +14466,12 @@ function shallowCopy(value) {
 * written in place.
 *
 * The path goes through own properties of plain objects, class instances
-* and arrays (by index); anything else throws a TypeError rather than
-* writing where no clone or save would see it: an inherited property such
-* as a method counts as missing, and Map, Set, Date and RegExp values and
-* other keys of arrays are refused, as is a "__proto__" segment.
+* and arrays (by index), and, outside a draft, any key of an instance of a
+* registered subclass of a built-in (#408); anything else throws a
+* TypeError rather than writing where no clone or save would see it: an
+* inherited property such as a method counts as missing, and Map, Set,
+* Date and RegExp values and other keys of arrays are refused, as is a
+* "__proto__" segment.
 */
 function setByPath(root, segments, value, options = {}) {
 	const parent = walkToParent(root, segments, options.createMissing ?? false);
@@ -14475,8 +14506,15 @@ function deleteByPath(root, segments) {
 function checkSegments(segments) {
 	if (segments.includes("__proto__")) throw new TypeError(`spindle: Cannot use "__proto__" in a variable path ("${segments.join(".")}")`);
 }
-/** Throw unless `holder` can take `key` as story state (see setByPath). */
-function checkHolder(holder, key, segments, depth) {
+/**
+* Throw unless `holder` can take `key` as story state (see setByPath). An
+* instance of a registered subclass of a built-in keeps its own fields
+* through clones and saves, so it takes any key (#408) when written in
+* place: a draft of one, or one a draft shares, is refused as other
+* built-ins are, and the caller writes the whole value instead.
+*/
+function checkHolder(holder, key, segments, depth, inPlace) {
+	if (inPlace && registeredClassName(holder) !== void 0) return;
 	const kind = builtinName(holder) ?? (Array.isArray(holder) && !isArrayKey(key) ? "an array" : "");
 	if (kind) throw new TypeError(`spindle: Cannot set property "${key}" on ${kind} (at "${segments.slice(0, depth).join(".")}")`);
 }
@@ -14492,7 +14530,7 @@ function walkToParent(root, segments, createMissing) {
 	let current = root;
 	for (let i = 0; i < segments.length - 1; i++) {
 		const seg = segments[i];
-		checkHolder(current, seg, segments, i);
+		checkHolder(current, seg, segments, i, !copyOnWrite);
 		let next = hasOwn(current, seg) ? current[seg] : void 0;
 		if (next == null || typeof next !== "object") {
 			if (!createMissing) throw new TypeError(`spindle: Cannot set property "${segments[i + 1]}" on ${next === null ? "null" : typeof next} (at "${segments.slice(0, i + 1).join(".")}")`);
@@ -14504,7 +14542,7 @@ function walkToParent(root, segments, createMissing) {
 		}
 		current = next;
 	}
-	checkHolder(current, segments[segments.length - 1], segments, segments.length - 1);
+	checkHolder(current, segments[segments.length - 1], segments, segments.length - 1, !copyOnWrite);
 	return current;
 }
 //#endregion
@@ -15022,6 +15060,18 @@ function setEntryValue(root, path, value) {
 	return true;
 }
 /**
+* The own enumerable fields of a Map, Set, Date or RegExp (an instance of a
+* registered subclass may hold some besides its built-in content, #412);
+* none for any other value.
+*/
+function builtinFields(value) {
+	return value instanceof Map || value instanceof Set || value instanceof Date || value instanceof RegExp ? extraKeys(value) : [];
+}
+/** Whether `x` and `y` are built-ins of one class that may hold fields. */
+function sameBuiltin(x, y) {
+	return Object.getPrototypeOf(x) === Object.getPrototypeOf(y) && (builtinFields(x).length > 0 || builtinFields(y).length > 0);
+}
+/**
 * Every path each object (or array, or other value) of `root` is at, the
 * first appearance first, in depth-first order. Plain objects and arrays are
 * entered, where first met only (an object held in an array is one object,
@@ -15045,10 +15095,13 @@ function objectPaths(root, skip = /* @__PURE__ */ new Set(), entries = false) {
 		}
 		all.set(value, [at]);
 		if (isMergeable(value) || Array.isArray(value)) walk(value, at);
-		else if (entries && entryChildren(value)) collections.push([value, at]);
+		else {
+			walk(value, at, builtinFields(value));
+			if (entries && entryChildren(value)) collections.push([value, at]);
+		}
 	}
-	function walk(node, path) {
-		for (const key of Object.keys(node)) {
+	function walk(node, path, keys = Object.keys(node)) {
+		for (const key of keys) {
 			const value = node[key];
 			if (!isObjectValue(value)) continue;
 			const at = [...path, key];
@@ -15096,13 +15149,13 @@ function aliasMoved(x, y, at, earlier, later) {
 			a,
 			held.get(segment)
 		]);
-	} else if ((isMergeable(x) || Array.isArray(x)) && mergesWith(x, y, true)) {
-		for (const key of Object.keys(y)) if (hasOwn(x, key)) pairs.push([
-			key,
-			x[key],
-			y[key]
-		]);
 	}
+	const keys = mergesWith(x, y, true) ? Object.keys(y) : sameBuiltin(x, y) ? builtinFields(y) : [];
+	for (const key of keys) if (hasOwn(x, key)) pairs.push([
+		key,
+		x[key],
+		y[key]
+	]);
 	return pairs.some(([segment, a, b]) => {
 		if (!isObjectValue(a) || !isObjectValue(b)) return false;
 		const here = [...at, segment];
@@ -15123,7 +15176,7 @@ function aliasChanges(before, after) {
 	const later = firstPaths(after, void 0, true);
 	const changes = [];
 	(function walk(b, a, path) {
-		for (const key of Object.keys(a)) {
+		for (const key of Array.isArray(a) || isMergeable(a) ? Object.keys(a) : builtinFields(a)) {
 			if (!hasOwn(b, key)) continue;
 			const x = b[key];
 			const y = a[key];
@@ -15144,7 +15197,7 @@ function aliasChanges(before, after) {
 				value: y,
 				alias: true
 			});
-			if ((isMergeable(x) || Array.isArray(x)) && mergesWith(x, y, true) && pathKey(isAt) === k && pathKey(wasAt) === k) walk(x, y, at);
+			if (((isMergeable(x) || Array.isArray(x)) && mergesWith(x, y, true) || sameBuiltin(x, y)) && pathKey(isAt) === k && pathKey(wasAt) === k) walk(x, y, at);
 		}
 	})(before, after, []);
 	return changes;
@@ -15659,11 +15712,13 @@ async function slotRecord(ifid, slot) {
 async function fillSlot(ifid, slot, saveId) {
 	await (await getBackend()).setMeta(slotMetaKey(ifid, slot), saveId);
 	if (isNamedSlot(slot)) await updateSlotIndex(ifid, (slots) => slots.includes(slot) ? slots : [...slots, slot]);
+	announceSlots(ifid);
 }
 /** Clear a slot: its pointer, and its entry in the slot index. */
 async function emptySlot(ifid, slot) {
 	await (await getBackend()).deleteMeta(slotMetaKey(ifid, slot));
 	if (isNamedSlot(slot)) await updateSlotIndex(ifid, (slots) => slots.filter((s) => s !== slot));
+	announceSlots(ifid);
 }
 /** Clear every slot holding a save whose ID passes `test`. */
 async function emptySlotsHolding(ifid, test) {
@@ -15672,6 +15727,46 @@ async function emptySlotsHolding(ifid, test) {
 		if (id && test(id)) await emptySlot(ifid, slot);
 	}
 }
+var SLOTS_CHANNEL = "spindle.slots";
+/** Every story's slots: what clearing all data announces. */
+var ALL_STORIES = "*";
+var slotsChannel;
+function getSlotsChannel() {
+	if (slotsChannel === void 0) try {
+		slotsChannel = new BroadcastChannel(SLOTS_CHANNEL);
+		slotsChannel.unref?.();
+	} catch {
+		slotsChannel = null;
+	}
+	return slotsChannel;
+}
+/** Tell the story's other tabs that its slots changed. */
+function announceSlots(ifid) {
+	try {
+		getSlotsChannel()?.postMessage(ifid);
+	} catch {}
+}
+/**
+* Call `onChange` when another tab may have filled or emptied the story's
+* slots: when it says so, and when this tab is shown again. Returns the
+* function that stops it.
+*/
+function watchSlotChanges(ifid, onChange) {
+	const channel = getSlotsChannel();
+	const onMessage = (event) => {
+		if (event.data === ifid || event.data === ALL_STORIES) onChange();
+	};
+	const onShown = () => {
+		if (document.visibilityState === "visible") onChange();
+	};
+	const doc = typeof document === "undefined" ? void 0 : document;
+	channel?.addEventListener("message", onMessage);
+	doc?.addEventListener("visibilitychange", onShown);
+	return () => {
+		channel?.removeEventListener("message", onMessage);
+		doc?.removeEventListener("visibilitychange", onShown);
+	};
+}
 /** The `custom` keys that say which slot a save lives in. */
 var slotCustom = (slot) => ({
 	isAutosave: !isNamedSlot(slot),
@@ -15925,6 +16020,7 @@ function clearGameData(ifid) {
 		await backend.deletePlaythroughsByIfid(ifid);
 		await backend.deleteMetaByIfid(ifid);
 		clearSession(ifid);
+		announceSlots(ifid);
 	});
 }
 var clearAllData = queued(clearAllDataNow);
@@ -15939,6 +16035,7 @@ async function clearAllDataNow() {
 		}
 		for (const key of toRemove) sessionStorage.removeItem(key);
 	} catch {}
+	announceSlots(ALL_STORIES);
 }
 /**
 * Delete a playthrough with its saves, emptying the slots that held them.
@@ -16023,7 +16120,7 @@ function initializeStory(session) {
 }
 //#endregion
 //#region src/execute-mutation.ts
-var NAMESPACES = [
+var NAMESPACES$1 = [
 	"variables",
 	"temporary",
 	"transient"
@@ -16146,7 +16243,7 @@ function mirror(draft, change, scopes = activeScopes, cloner = clonerOf) {
 }
 /** A cloner of a copy of its own (no references shared with others). */
 var clonerOf = (target) => clonerFor(target);
-var NAMESPACE_KEYS$1 = new Set(NAMESPACES);
+var NAMESPACE_KEYS$1 = new Set(NAMESPACES$1);
 /**
 * Runs store updates on the running code's working copies. They stay the
 * code's own, so nothing may freeze them.
@@ -16241,7 +16338,7 @@ function routeStoreUpdate(recipe) {
 		transient: inner.work.transient
 	};
 	const [next, patches] = scratch.produceWithPatches(view, recipe);
-	const changes = NAMESPACES.flatMap((ns) => {
+	const changes = NAMESPACES$1.flatMap((ns) => {
 		const own = patches.filter((p) => p.path[0] === ns);
 		return own.length ? writtenPaths(view[ns], next[ns], own).map((change) => ({
 			...change,
@@ -16659,8 +16756,21 @@ function reinitTriggerState() {
 */
 function resetTriggers() {
 	triggers = [];
+	resets++;
 	closeAllOpenDialogs();
+	resetListeners.notify();
+}
+var resets = 0;
+var resetListeners = createListeners();
+/** How many times resetTriggers has forgotten every watcher. */
+function triggerResets() {
+	return resets;
 }
+/**
+* Call `listener` after each resetTriggers (a restart): a {watch} that stays
+* mounted, in the story interface, registers its watcher again (#402).
+*/
+var subscribeTriggerResets = resetListeners.subscribe;
 function subscribeTriggerDialogs(cb) {
 	dialogNotify = cb;
 	if (dialogQueue.length > 0) cb();
@@ -17148,8 +17258,21 @@ var latestStateApplied = 0;
 var slotLoadApplying = null;
 /** A replacement of the game state applied at its call. */
 function replaceStateNow() {
-	latestStateApplied = ++stateReplacementsIssued;
+	applyReplacement(++stateReplacementsIssued);
+}
+var replacementListeners = createListeners();
+/** Record that replacement `n` is applied, and tell the listeners. */
+function applyReplacement(n) {
+	latestStateApplied = n;
+	replacementListeners.notify();
 }
+/**
+* Call `listener` whenever a boot, restart or load replaces the game state:
+* work the replaced game started that would write into the new one later (a
+* click body's timer in the story interface, which stays mounted) is to
+* stop (#401).
+*/
+var subscribeStateReplacement = replacementListeners.subscribe;
 var runtimeUnsubs = [];
 var inRuntimePhase = false;
 /**
@@ -17381,6 +17504,16 @@ function recordKnownSave(set, slot, known) {
 		}
 	});
 }
+/** Look up which slots hold a save again, as an operation queued now. */
+function refreshKnownSaves(set, ifid) {
+	return populateKnownSaves(ifid).then((known) => {
+		set((state) => {
+			state.knownSaves = known;
+		});
+	});
+}
+/** Stops following the slot changes of other tabs (see init). */
+var stopWatchingSlots;
 /**
 * Queue the clearing of saved data, then restart now: the new playthrough
 * is stored after it, and operations issued from here on belong to the new
@@ -17462,6 +17595,10 @@ var useStoryStore = create()(storyStore((set, get) => ({
 			console.error("spindle: failed to init save system", err);
 			return "";
 		}));
+		stopWatchingSlots?.();
+		stopWatchingSlots = watchSlotChanges(storyData.ifid, () => {
+			refreshKnownSaves(set, storyData.ifid).catch(() => {});
+		});
 	},
 	navigate: (passageName) => {
 		if (navigationTriggerPhase) {
@@ -17681,12 +17818,7 @@ var useStoryStore = create()(storyStore((set, get) => ({
 		});
 		if (playthroughId !== "" && playthroughId === current) switchToPlaythrough(replacementId, deletion);
 		else if (current === "") switchToLookedUpPlaythrough(deletion.then((replaced) => replaced ? replacementId : established, () => established));
-		return reported(deletion.then(async () => {
-			const known = await populateKnownSaves(storyData.ifid);
-			set((state) => {
-				state.knownSaves = known;
-			});
-		}), "spindle: failed to delete playthrough");
+		return reported(deletion.then(() => refreshKnownSaves(set, storyData.ifid)), "spindle: failed to delete playthrough");
 	},
 	getSavePayload: () => {
 		const { currentPassage, variables, history, historyIndex, visitCounts, renderCounts } = get();
@@ -17723,7 +17855,7 @@ var useStoryStore = create()(storyStore((set, get) => ({
 			return;
 		}
 		assertPassagesExist(get().storyData, payload);
-		latestStateApplied = replacement;
+		applyReplacement(replacement);
 		emit("beforeload", slot);
 		const ifid = get().storyData?.ifid;
 		if (playthroughId && ifid) switchToLoadedPlaythrough(ifid, playthroughId);
@@ -17818,6 +17950,8 @@ var FOCUSABLE = [
 	"select:not([disabled])",
 	"textarea:not([disabled])",
 	"iframe",
+	"audio[controls]",
+	"video[controls]",
 	"summary",
 	"[contenteditable]",
 	"[tabindex]"
@@ -18399,37 +18533,85 @@ var settings = {
 //#endregion
 //#region src/utils/control-edits.ts
 /**
-* Records the edits a reader made through a control bound to a story
-* variable (`{textbox}`, `{checkbox}`, ...). {for} tells these apart from a
-* list that is replaced: typing into a control inside an iteration changes
-* its item, but must not remount the iteration and drop the control's focus.
+* Records the edits made to the items of a list from inside a {for}
+* iteration, which {for} tells apart from a list that is replaced:
+*
+* - a reader editing a variable through a control (`{textbox}`,
+*   `{checkbox}`, ...): typing into a control inside an iteration changes
+*   its item, but must not remount the iteration and drop the control's
+*   focus (#369);
+* - mutation code an iteration runs as it renders (`{set $party[@i].hp +=
+*   1}`): remounting would run the iteration's mount-only macros, and so the
+*   write, again for every write it makes (#400).
+*
 * An edit is attributed to the variable path it wrote, so a replacement made
-* elsewhere (a watcher reacting to the edit) still remounts.
+* elsewhere (a watcher reacting to the edit, a button outside the loop)
+* still remounts.
 */
 var version = 0;
-var MAX_LOG = 256;
+var MAX_LOG = 4096;
+/** Edits in the order made: paths below the namespaces (`['variables', 'a']`). */
 var log = [];
-function noteControlEdit(segments) {
+function note(path) {
 	log.push({
 		version: ++version,
-		segments
+		path
 	});
 	if (log.length > MAX_LOG) log.shift();
 }
+/** Note an edit a control made to the story variable at `segments`. */
+function noteControlEdit(segments) {
+	note(["variables", ...segments]);
+}
+/**
+* Whether mutation code runs inside a {for} iteration: {for} provides true
+* around its iterations, and the writes of such code are noted as edits of
+* the items they reach (see runAsItemEdit).
+*/
+var ItemEditContext = createContext(false);
+var NAMESPACES = [
+	"variables",
+	"temporary",
+	"transient"
+];
+/** Run `run`, noting each variable path it changes as an edit. */
+function runAsItemEdit(run) {
+	const before = readState();
+	try {
+		run();
+	} finally {
+		const after = readState();
+		for (const ns of NAMESPACES) {
+			if (before[ns] === after[ns]) continue;
+			for (const { path } of diffPaths(before[ns], after[ns], true)) note([ns, ...path]);
+		}
+	}
+}
 function controlEditVersion() {
 	return version;
 }
 /**
-* Whether an edit since `since` wrote inside `item`, element `index` of
-* `list`: the path leads through the item (compared by reference in
-* `variables`), or, for a primitive item, ends at its slot in the list.
-*/
-function editedItem(since, variables, list, item, index) {
-	return log.some(({ version: v, segments }) => {
-		if (v <= since) return false;
-		if (typeof item === "object" && item !== null) return segments.some((_, n) => getByPath(variables, segments.slice(0, n + 1)) === item);
-		return segments[segments.length - 1] === String(index) && getByPath(variables, segments.slice(0, -1)) === list;
-	});
+* A test of whether an edit made since `since` wrote inside `item`, element
+* `index` of `list`: the path leads through the item (compared by reference
+* in `state`), or, for a primitive item, ends at its slot in the list.
+*/
+function editedItems(since, state) {
+	const through = /* @__PURE__ */ new Set();
+	const ends = /* @__PURE__ */ new Map();
+	for (let i = log.length - 1; i >= 0 && log[i].version > since; i--) {
+		const { path } = log[i];
+		let node = state;
+		path.forEach((seg, n) => {
+			if (n === path.length - 1 && node !== null && typeof node === "object") {
+				const keys = ends.get(node) ?? /* @__PURE__ */ new Set();
+				keys.add(seg);
+				ends.set(node, keys);
+			}
+			node = node !== null && typeof node === "object" ? getByPath(node, [seg]) : void 0;
+			if (node !== null && typeof node === "object") through.add(node);
+		});
+	}
+	return (list, item, index) => typeof item === "object" && item !== null ? through.has(item) : ends.get(list)?.has(String(index)) === true;
 }
 //#endregion
 //#region src/action-registry.ts
@@ -18626,6 +18808,7 @@ function defineMacro(config, source = "builtin") {
 			id = resolve(id);
 		}
 		const { update, getValues } = useContext(LocalsUpdateContext);
+		const inIteration = useContext(ItemEditContext);
 		const renderOptions = useRenderOptions();
 		const renderNodes$1 = (nodes, options) => renderNodes(nodes, {
 			...renderOptions,
@@ -18656,7 +18839,7 @@ function defineMacro(config, source = "builtin") {
 			id,
 			resolve,
 			cls: macroClass(config.name, className),
-			mutate: (code) => executeMutation(code, getValues(), update),
+			mutate: inIteration ? (code) => runAsItemEdit(() => executeMutation(code, getValues(), update)) : (code) => executeMutation(code, getValues(), update),
 			update,
 			getValues,
 			wrap: (content) => wrapContent(className, id, content)
@@ -18668,7 +18851,12 @@ function defineMacro(config, source = "builtin") {
 		}
 		if (config.storeVar) {
 			const firstToken = readBoundVariable(props.rawArgs).replace(/["']/g, "");
-			if (firstToken.startsWith("%")) return h("span", { class: "error" }, `{${config.name}}: transient variables (%${firstToken.slice(1)}) cannot be bound to input macros`);
+			const kind = {
+				"%": "transient variables",
+				_: "temporary variables",
+				"@": "locals"
+			}[firstToken.charAt(0)];
+			if (kind) return h("span", { class: "error" }, `{${config.name}}: ${kind} (${firstToken}) cannot be bound to input macros`);
 			const varExpr = firstToken.replace(/["']/g, "").replace(/^\$/, "");
 			const segments = varExpr.split(".");
 			if (segments.includes("__proto__")) return h("span", { class: "error" }, `{${config.name}}: "$${varExpr}" cannot be bound: ${RESERVED_NAME} is reserved`);
@@ -18962,7 +19150,7 @@ function createStoryAPI() {
 		},
 		deferRender() {
 			useStoryStore.getState().deferRender();
-			readyPromise = new Promise((resolve) => {
+			readyPromise ??= new Promise((resolve) => {
 				readyResolve = resolve;
 			});
 		},
@@ -19521,16 +19709,25 @@ var PRIMITIVE_SAMPLES = {
 	number: Object(0),
 	boolean: Object(false)
 };
-function inferSchema(value) {
+/**
+* The schema of a default value. An object met again (a backreference, a
+* shared subtree) has the schema made for it the first time, so a cyclic
+* default gives a schema that refers to itself instead of recursing forever.
+*/
+function inferSchema(value, seen = /* @__PURE__ */ new Map()) {
 	if (Array.isArray(value)) return { type: "array" };
 	if (value === null) return { type: "null" };
 	if (typeof value === "object") {
+		const known = seen.get(value);
+		if (known) return known;
 		const fields = /* @__PURE__ */ new Map();
-		for (const [key, val] of Object.entries(value)) fields.set(key, inferSchema(val));
-		return {
+		const schema = {
 			type: "object",
 			fields
 		};
+		seen.set(value, schema);
+		for (const [key, val] of Object.entries(value)) fields.set(key, inferSchema(val, seen));
+		return schema;
 	}
 	const jsType = typeof value;
 	if (!VALID_VAR_TYPES.has(jsType)) throw new Error(`Unsupported type "${jsType}" for value ${String(value)}. Expected number, string, boolean, array, or object.`);
@@ -20028,23 +20225,32 @@ defineMacro({
 * Content-derived string key for a value, used to remount components when
 * the value's contents change (e.g. {for} iterations, #45).
 *
-* JSON-compatible values (strings, finite numbers, booleans, null, arrays and
-* plain objects of those) produce exactly their `JSON.stringify` output. Other
-* values get distinct, unambiguous markers so their contents are reflected
-* too: Map and Set entries (nested at any depth), Date, RegExp, BigInt,
-* undefined, NaN/±Infinity, symbols (by description), functions (by name)
-* and registered class instances. A hole in an array reads as undefined.
-* Cyclic references become a back-reference marker instead of throwing,
-* and the function never throws.
+* A tree of JSON-compatible values (strings, finite numbers, booleans, null,
+* arrays and plain objects of those) produces exactly its `JSON.stringify`
+* output. Other values get distinct, unambiguous markers so their contents
+* are reflected too: Map and Set entries (nested at any depth), Date,
+* RegExp, BigInt, undefined, NaN/±Infinity, symbols (by description),
+* functions (by name) and registered class instances, with the class name
+* and, for a subclass of a built-in, its own fields (#407). A hole in an
+* array reads as undefined.
+*
+* An object met again, through a cycle or a second reference to it, is a
+* marker naming where it was first met rather than another copy of its
+* contents, so the key grows with the objects a value holds, not with the
+* paths to them (#406). The function never throws.
 */
 function stableKey(value) {
 	try {
-		return keyOf(value, []);
+		return keyOf(value, /* @__PURE__ */ new Map());
 	} catch {
 		return "<unkeyable>";
 	}
 }
-function keyOf(val, ancestors) {
+/**
+* The key of `val`. `seen` numbers the objects keyed so far, in the order
+* they were first met.
+*/
+function keyOf(val, seen) {
 	switch (typeof val) {
 		case "string": return JSON.stringify(val);
 		case "number": return Number.isFinite(val) ? JSON.stringify(val) : String(val);
@@ -20056,22 +20262,28 @@ function keyOf(val, ancestors) {
 	}
 	if (val === null) return "null";
 	const obj = val;
-	const depth = ancestors.indexOf(obj);
-	if (depth !== -1) return `<cycle ${ancestors.length - depth}>`;
-	if (val instanceof Date) return `Date(${Date.prototype.getTime.call(val)})`;
-	if (val instanceof RegExp) return `RegExp(${RegExp.prototype.toString.call(val)}@${val.lastIndex})`;
-	ancestors.push(obj);
-	try {
-		if (Array.isArray(val)) return `[${Array.from(val, (v) => keyOf(v, ancestors)).join(",")}]`;
-		if (val instanceof Map) return `Map[${[...mapEntries(val)].map(([k, v]) => `[${keyOf(k, ancestors)},${keyOf(v, ancestors)}]`).join(",")}]`;
-		if (val instanceof Set) return `Set[${[...setMembers(val)].map((v) => keyOf(v, ancestors)).join(",")}]`;
-		const record = obj;
-		const body = Object.keys(record).map((k) => `${JSON.stringify(k)}:${keyOf(record[k], ancestors)}`).join(",");
-		const className = registeredClassName(obj);
-		return className === void 0 ? `{${body}}` : `Class(${JSON.stringify(className)}){${body}}`;
-	} finally {
-		ancestors.pop();
+	const first = seen.get(obj);
+	if (first !== void 0) return `<ref ${first}>`;
+	const className = registeredClassName(obj);
+	const named = (key) => className === void 0 ? key : `Class(${JSON.stringify(className)})${key}`;
+	const withFields = (key) => {
+		const keys = className === void 0 ? [] : extraKeys(obj);
+		return named(keys.length ? `${key}${fieldsOf(obj, keys, seen)}` : key);
+	};
+	if (val instanceof Date || val instanceof RegExp) {
+		if (className !== void 0 && extraKeys(obj).length) seen.set(obj, seen.size);
+		return withFields(val instanceof Date ? `Date(${Date.prototype.getTime.call(val)})` : `RegExp(${RegExp.prototype.toString.call(val)}@${val.lastIndex})`);
 	}
+	seen.set(obj, seen.size);
+	if (Array.isArray(val)) return withFields(`[${Array.from(val, (v) => keyOf(v, seen)).join(",")}]`);
+	if (val instanceof Map) return withFields(`Map[${Array.from(mapEntries(val), ([k, v]) => `[${keyOf(k, seen)},${keyOf(v, seen)}]`).join(",")}]`);
+	if (val instanceof Set) return withFields(`Set[${Array.from(setMembers(val), (v) => keyOf(v, seen)).join(",")}]`);
+	return named(fieldsOf(obj, Object.keys(obj), seen));
+}
+/** `{"key":value,...}` for the `keys` of `obj`. */
+function fieldsOf(obj, keys, seen) {
+	const record = obj;
+	return `{${keys.map((k) => `${JSON.stringify(k)}:${keyOf(record[k], seen)}`).join(",")}}`;
 }
 //#endregion
 //#region src/components/macros/For.tsx
@@ -20153,12 +20365,11 @@ defineMacro({
 			});
 		}
 		const { itemVar, indexVar } = loop;
-		const since = keys.edits;
-		const { variables } = readState();
+		const edited = editedItems(keys.edits, readState());
 		keys.edits = controlEditVersion();
 		const generations = list.map((item, i) => {
 			const contents = stableKey(item);
-			if (keys.generations[i] === void 0 || contents !== keys.contents[i] && !editedItem(since, variables, list, item, i)) keys.generations[i] = keys.next++;
+			if (keys.generations[i] === void 0 || contents !== keys.contents[i] && !edited(list, item, i)) keys.generations[i] = keys.next++;
 			keys.contents[i] = contents;
 			return keys.generations[i];
 		});
@@ -20171,7 +20382,10 @@ defineMacro({
 			indexValue: i,
 			children
 		}, `${i}-${generations[i]}`));
-		return ctx.wrap(content);
+		return ctx.wrap(/* @__PURE__ */ jsx(ItemEditContext.Provider, {
+			value: true,
+			children: content
+		}));
 	},
 	text({ rawArgs, children = [] }, ctx) {
 		const { itemVar, indexVar, listExpr } = loopArgs(rawArgs, ctx.args);
@@ -20226,14 +20440,16 @@ defineMacro({
 	interpolate: true,
 	parameters: [DELAY_PARAMETER],
 	render({ children = [] }, ctx) {
-		const { useState, useEffect, useCallback } = ctx.hooks;
+		const { useState, useEffect, useCallback, useContext } = ctx.hooks;
 		const delay = ctx.args.delay ?? 0;
 		const [count, setCount] = useState(0);
 		const [stopped, setStopped] = useState(false);
+		const hasLeft = useContext(OutgoingContext);
 		const stop = useCallback(() => setStopped(true), []);
 		useEffect(() => {
 			if (stopped) return;
 			const interval = setInterval(() => {
+				if (hasLeft?.()) return;
 				setCount((c) => c + 1);
 			}, delay);
 			return () => clearInterval(interval);
@@ -20262,13 +20478,16 @@ var frozenAlways = () => true;
 * once it has rendered, so it runs once per click. It stays mounted
 * until the owning macro unmounts (its passage changes, say), so work it
 * starts in an effect, such as the timer of a {timed} or {repeat}, can
-* finish; the passage leaving cancels it.
+* finish; the passage leaving cancels it, and so does a restart or a load
+* replacing the game, which a control of the story interface outlives
+* (#401).
 *
 * A detached render starts with no contexts, so the hook captures the ones
 * the owning macro sees and provides them again: the locals scope (read
 * through a live view, so a local assigned earlier in the body is visible),
 * nobr/inline rendering, the enclosing block widget's {@children}, the
-* enclosing {repeat}'s {stop} and the enclosing dialog's close callback.
+* enclosing {repeat}'s {stop} and the enclosing dialog's close callback and whether it runs in a {for} iteration
+* (#411) and the owning passage's departure (#410).
 * The body then behaves as if it rendered in place.
 *
 * The body's macros read story state from the store. Run from mutation code
@@ -20283,9 +20502,20 @@ function useDetachedBody() {
 	const widgetChildren = useContext(WidgetChildrenContext);
 	const repeat = useContext(RepeatContext);
 	const closeDialog = useContext(DialogCloseContext);
+	const inIteration = useContext(ItemEditContext);
+	const hasLeft = useContext(OutgoingContext);
 	const mounted = useRef([]);
-	useEffect(() => () => {
-		for (const container of mounted.current.splice(0)) render(null, container);
+	useEffect(() => {
+		const unsubscribe = subscribeStateReplacement(() => {
+			const replaced = mounted.current.splice(0);
+			queueMicrotask(() => {
+				for (const container of replaced) render(null, container);
+			});
+		});
+		return () => {
+			unsubscribe();
+			for (const container of mounted.current.splice(0)) render(null, container);
+		};
 	}, []);
 	const run = (children) => {
 		const locals = liveLocalsView(updater.getValues);
@@ -20306,10 +20536,16 @@ function useDetachedBody() {
 									value: repeat,
 									children: /* @__PURE__ */ jsx(DialogCloseContext.Provider, {
 										value: closeDialog,
-										children: renderNodes(children, {
-											nobr,
-											inline,
-											locals
+										children: /* @__PURE__ */ jsx(ItemEditContext.Provider, {
+											value: inIteration,
+											children: /* @__PURE__ */ jsx(OutgoingContext.Provider, {
+												value: hasLeft,
+												children: renderNodes(children, {
+													nobr,
+													inline,
+													locals
+												})
+											})
 										})
 									})
 								})
@@ -20468,7 +20704,8 @@ defineMacro({
 	interpolate: true,
 	parameters: TIMED_PARAMETERS,
 	render({ branches = [] }, ctx) {
-		const { useState, useEffect, useMemo } = ctx.hooks;
+		const { useState, useEffect, useMemo, useContext } = ctx.hooks;
+		const hasLeft = useContext(OutgoingContext);
 		const sections = useMemo(() => {
 			return branches.map((branch) => ({
 				delay: parseMacroArgs(branch.rawArgs, TIMED_PARAMETERS).delay ?? 0,
@@ -20483,6 +20720,7 @@ defineMacro({
 			const nextIndex = visibleIndex + 1;
 			const delay = sections[nextIndex].delay;
 			const timer = setTimeout(() => {
+				if (hasLeft?.()) return;
 				setVisibleIndex(nextIndex);
 			}, delay);
 			return () => clearTimeout(timer);
@@ -21790,6 +22028,7 @@ defineMacro({
 		const prevHistoryLenRef = useRef(0);
 		const displayedId = displayed.id;
 		const isOutgoing = useCallback((state) => state.navigationId !== displayedId, [displayedId]);
+		const hasLeft = useCallback(() => isOutgoing(useStoryStore.getState()), [isOutgoing]);
 		const lastElement = useRef(null);
 		const containerRef = useRef(null);
 		const timeoutsRef = useRef([]);
@@ -21896,7 +22135,10 @@ defineMacro({
 				ref: containerRef,
 				children: passageElement && /* @__PURE__ */ jsx(FrozenStateContext.Provider, {
 					value: isOutgoing,
-					children: passageElement
+					children: /* @__PURE__ */ jsx(OutgoingContext.Provider, {
+						value: hasLeft,
+						children: passageElement
+					})
 				})
 			})]
 		});
@@ -21949,9 +22191,12 @@ defineMacro({
 		const { hooks } = ctx;
 		const { condition, options } = ctx.args;
 		if (condition === void 0) return null;
-		const registered = hooks.useRef(false);
-		if (!registered.current) {
-			registered.current = true;
+		const frozen = hooks.useContext(FrozenStateContext);
+		const [, rerender] = hooks.useState(0);
+		hooks.useEffect(() => subscribeTriggerResets(() => rerender((n) => n + 1)), []);
+		const registered = hooks.useRef(null);
+		if (registered.current === null || registered.current !== triggerResets() && !frozen?.(useStoryStore.getState())) {
+			registered.current = triggerResets();
 			addMacroTrigger(condition, options);
 		}
 		return null;