@rohal12/spindle 0.52.2 → 0.52.3

package/dist/pkg/headless.js

@@ -4,6 +4,7 @@ import { useSyncExternalStore } from "preact/compat";
 import { createStore } from "zustand/vanilla";
 import { immer } from "zustand/middleware/immer";
 import { Immer, applyPatches, current, enableMapSet, enablePatches, freeze, isDraft, produceWithPatches } from "immer";
+import { shallow } from "zustand/vanilla/shallow";
 import { Fragment as Fragment$1, jsx, jsxs } from "preact/jsx-runtime";
 import { micromark } from "micromark";
 import { gfmTable, gfmTableHtml } from "micromark-extension-gfm-table";
@@ -2804,15 +2805,28 @@ function buildAST(tokens) {
 	return root;
 }
 //#endregion
+//#region src/hooks/use-story-fields.ts
+/**
+* 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.
+*/
+function useStoryFields(...keys) {
+	const prev = useRef();
+	return useStoryStore((s) => {
+		const next = {};
+		for (const key of keys) next[key] = s[key];
+		return shallow(prev.current, next) ? prev.current : prev.current = next;
+	});
+}
+//#endregion
 //#region src/hooks/use-merged-locals.ts
 /**
 * Return store variables, temporary, locals from context, and transient.
 * All four dicts use unprefixed keys suitable for evaluate/execute.
 */
 function useMergedLocals() {
-	const variables = useStoryStore((s) => s.variables);
-	const temporary = useStoryStore((s) => s.temporary);
-	const transient = useStoryStore((s) => s.transient);
+	const { variables, temporary, transient } = useStoryFields("variables", "temporary", "transient");
 	const localsValues = useContext(LocalsValuesContext);
 	return useMemo(() => {
 		return [
@@ -2957,21 +2971,38 @@ function getPRNGPull() {
 /** The variable name no namespace can hold. */
 var RESERVED_NAME = "__proto__";
 /**
-* Throw a TypeError if `name` (without its sigil) cannot be a variable
-* name. `label` is the name as the author wrote it (e.g. `$__proto__`).
+* Why `name` (without its sigil) cannot be a variable name, or undefined if
+* it can. `label` is the name as the author wrote it (e.g. `$__proto__`).
 */
+function variableNameError(name, label = name) {
+	return name === "__proto__" ? `"${label}" cannot be used as a variable name (${RESERVED_NAME} is reserved)` : void 0;
+}
+/** Throw a TypeError if `name` cannot be a variable name. */
 function checkVariableName(name, label = name) {
-	if (name === "__proto__") throw new TypeError(`spindle: "${label}" cannot be used as a variable name (${RESERVED_NAME} is reserved)`);
+	const error = variableNameError(name, label);
+	if (error) throw new TypeError(`spindle: ${error}`);
 }
-/** A namespace with no prototype holding the own entries of `sources`. */
-function createNamespace(...sources) {
-	const ns = Object.create(null);
+/** Whether `obj` holds `key` as an own property. */
+var hasOwn$2 = (obj, key) => Object.prototype.hasOwnProperty.call(obj, key);
+/** `ns[key]` if `ns` holds it as an own property, else undefined. */
+var ownValue = (ns, key) => ns && hasOwn$2(ns, key) ? ns[key] : void 0;
+/**
+* A record with no prototype holding the own entries of `sources`, or only
+* those whose value passes `keep`.
+*/
+function ownEntries(sources, keep = () => true) {
+	const record = Object.create(null);
 	for (const source of sources) {
 		if (!source) continue;
-		for (const key of Object.keys(source)) ns[key] = source[key];
+		for (const key of Object.keys(source)) {
+			const value = source[key];
+			if (keep(value)) record[key] = value;
+		}
 	}
-	return ns;
+	return record;
 }
+/** A namespace with no prototype holding the own entries of `sources`. */
+var createNamespace = (...sources) => ownEntries(sources);
 /** Whether `value` is an object with no prototype. */
 var isNamespace = (value) => Object.getPrototypeOf(value) === null;
 /** `ns` itself if it has no prototype, else a namespace copy of it. */
@@ -2984,15 +3015,14 @@ function withEntry(ns, key, value) {
 }
 /** An empty namespace that cannot change. */
 var EMPTY_NAMESPACE = Object.freeze(createNamespace());
-/** `ns[key]` if `ns` holds it as an own property, else undefined. */
-var ownValue = (ns, key) => Object.prototype.hasOwnProperty.call(ns, key) ? ns[key] : void 0;
-//#endregion
-//#region src/utils/counts.ts
+/** The names whose own entries differ between `a` and `b`, `a`'s first. */
+function changedNames(a, b) {
+	return [...new Set([...Object.keys(a), ...Object.keys(b)])].filter((name) => ownValue(a, name) !== ownValue(b, name));
+}
 var isCount = (value) => typeof value === "number" && Number.isInteger(value) && value >= 0;
 /** The count of `name` in `counts`: its own entry, or 0. */
 function countOf(counts, name) {
-	if (!counts || !Object.prototype.hasOwnProperty.call(counts, name)) return 0;
-	const value = counts[name];
+	const value = ownValue(counts, name);
 	return isCount(value) ? value : 0;
 }
 /**
@@ -3002,11 +3032,7 @@ function countOf(counts, name) {
 * more than counting in place.
 */
 function createCounts(source, name) {
-	const counts = Object.create(null);
-	if (source) for (const key of Object.keys(source)) {
-		const value = source[key];
-		if (isCount(value)) counts[key] = value;
-	}
+	const counts = ownEntries([source], isCount);
 	if (name !== void 0) counts[name] = countOf(source, name) + 1;
 	return counts;
 }
@@ -3045,7 +3071,8 @@ function transform(expr, goal = "expression") {
 			result += text;
 		},
 		variable(sigil, name) {
-			if (name === "__proto__") throw new SyntaxError(`spindle: "${sigil}${name}" cannot be used as a variable name (${RESERVED_NAME} is reserved)`);
+			const error = variableNameError(name, sigil + name);
+			if (error) throw new SyntaxError(`spindle: ${error}`);
 			if (IDENT_END_RE.test(result.slice(-2))) result += " ";
 			result += `${NAMESPACES$1[sigil]}["${name}"]`;
 		}
@@ -3068,41 +3095,50 @@ function getOrCompile(key, body) {
 	}
 	return fn;
 }
+/** The passage being shown. */
+function currentPassage() {
+	const s = useStoryStore.getState();
+	return s.storyData?.passages.get(s.currentPassage);
+}
+/** The passage shown before the current one in history. */
+function previousPassage() {
+	const s = useStoryStore.getState();
+	if (s.historyIndex <= 0) return void 0;
+	const prevName = s.history[s.historyIndex - 1]?.passage;
+	return prevName ? s.storyData?.passages.get(prevName) : void 0;
+}
+/**
+* visited()/rendered() and their has-forms, counting in the counters
+* `counts()` returns. A missing name means the current passage.
+*/
+function countQueries(counts) {
+	const count = (name) => countOf(counts(), name ?? useStoryStore.getState().currentPassage);
+	return {
+		count,
+		has: (name) => count(name) > 0,
+		any: (...names) => names.some((n) => count(n) > 0),
+		all: (...names) => names.every((n) => count(n) > 0)
+	};
+}
 var cachedFns = null;
 var cachedVisitCounts = null;
 var cachedRenderCounts = null;
 function buildExpressionFns() {
 	const { visitCounts, renderCounts } = useStoryStore.getState();
 	if (cachedFns && cachedVisitCounts === visitCounts && cachedRenderCounts === renderCounts) return cachedFns;
-	const visited = (name) => countOf(visitCounts, name ?? useStoryStore.getState().currentPassage);
-	const hasVisited = (name) => visited(name) > 0;
-	const hasVisitedAny = (...names) => names.some((n) => visited(n) > 0);
-	const hasVisitedAll = (...names) => names.every((n) => visited(n) > 0);
-	const rendered = (name) => countOf(renderCounts, name ?? useStoryStore.getState().currentPassage);
-	const hasRendered = (name) => rendered(name) > 0;
-	const hasRenderedAny = (...names) => names.some((n) => rendered(n) > 0);
-	const hasRenderedAll = (...names) => names.every((n) => rendered(n) > 0);
-	const currentPassage = () => {
-		const s = useStoryStore.getState();
-		return s.storyData?.passages.get(s.currentPassage);
-	};
-	const previousPassage = () => {
-		const s = useStoryStore.getState();
-		if (s.historyIndex <= 0) return void 0;
-		const prevName = s.history[s.historyIndex - 1]?.passage;
-		return prevName ? s.storyData?.passages.get(prevName) : void 0;
-	};
+	const visits = countQueries(() => visitCounts);
+	const renders = countQueries(() => renderCounts);
 	cachedFns = {
 		currentPassage,
 		previousPassage,
-		visited,
-		hasVisited,
-		hasVisitedAny,
-		hasVisitedAll,
-		rendered,
-		hasRendered,
-		hasRenderedAny,
-		hasRenderedAll,
+		visited: visits.count,
+		hasVisited: visits.has,
+		hasVisitedAny: visits.any,
+		hasVisitedAll: visits.all,
+		rendered: renders.count,
+		hasRendered: renders.has,
+		hasRenderedAny: renders.any,
+		hasRenderedAll: renders.all,
 		random,
 		randomInt
 	};
@@ -3700,6 +3736,11 @@ var SIGILS = {
 	local: "@",
 	transient: "%"
 };
+var STORE_NAMESPACES = {
+	variable: "variables",
+	temporary: "temporary",
+	transient: "transient"
+};
 function VarDisplay({ name, scope, className, id }) {
 	const resolve = useInterpolate();
 	className = resolve(className);
@@ -3707,10 +3748,11 @@ function VarDisplay({ name, scope, className, id }) {
 	const localsValues = useContext(LocalsValuesContext);
 	const parts = name.split(".");
 	const root = parts[0];
-	const storeValue = useStoryStore((s) => scope === "variable" ? ownValue(s.variables, root) : scope === "temporary" ? ownValue(s.temporary, root) : scope === "transient" ? ownValue(s.transient, root) : void 0);
-	if (root === "__proto__") return /* @__PURE__ */ jsx("span", {
+	const storeValue = useStoryStore((s) => scope === "local" ? void 0 : ownValue(s[STORE_NAMESPACES[scope]], root));
+	const nameError = variableNameError(root, SIGILS[scope] + root);
+	if (nameError) return /* @__PURE__ */ jsx("span", {
 		class: "error",
-		children: `{${SIGILS[scope]}${name} error: "${SIGILS[scope]}${root}" cannot be used as a variable name (${RESERVED_NAME} is reserved)}`
+		children: `{${SIGILS[scope]}${name} error: ${nameError}}`
 	});
 	let value;
 	if (scope === "local") value = ownValue(localsValues, root);
@@ -3737,10 +3779,7 @@ function ExprDisplay({ expression, className, id }) {
 	const resolve = useInterpolate();
 	className = resolve(className);
 	id = resolve(id);
-	const localsValues = useContext(LocalsValuesContext);
-	const variables = useStoryStore((s) => s.variables);
-	const temporary = useStoryStore((s) => s.temporary);
-	const transient = useStoryStore((s) => s.transient);
+	const [variables, temporary, localsValues, transient] = useMergedLocals();
 	let display;
 	try {
 		const value = evaluate(expression, variables, temporary, localsValues, transient);
@@ -5049,10 +5088,14 @@ function on(event, cb) {
 		set.delete(cb);
 	};
 }
-function emit(event, ...args) {
+/** Call `call` with each listener of `event`. */
+function forEachListener(event, call) {
 	const set = listeners.get(event);
 	if (!set) return;
-	for (const cb of [...set]) cb(...args);
+	for (const cb of [...set]) call(cb);
+}
+function emit(event, ...args) {
+	forEachListener(event, (cb) => cb(...args));
 }
 /**
 * Emit an event from inside a render commit (layout effect). A throwing
@@ -5060,13 +5103,13 @@ function emit(event, ...args) {
 * render; the remaining handlers still run.
 */
 function emitFromRender(event, ...args) {
-	const set = listeners.get(event);
-	if (!set) return;
-	for (const cb of [...set]) try {
-		cb(...args);
-	} catch (err) {
-		console.error(`spindle: Error in ${event} handler:`, err);
-	}
+	forEachListener(event, (cb) => {
+		try {
+			cb(...args);
+		} catch (err) {
+			console.error(`spindle: Error in ${event} handler:`, err);
+		}
+	});
 }
 //#endregion
 //#region src/saves/save-manager.ts
@@ -5784,7 +5827,6 @@ function initializeStory(session) {
 }
 //#endregion
 //#region src/utils/object-path.ts
-var hasOwn$2 = (obj, key) => Object.prototype.hasOwnProperty.call(obj, key);
 /**
 * Traverse dot-path segments on an object and return the nested value.
 * Members of Object.prototype (`constructor`, `toString`, `__proto__`, ...)
@@ -7638,9 +7680,7 @@ function TriggerDialogHost() {
 //#endregion
 //#region src/components/App.tsx
 function App() {
-	const storyData = useStoryStore((s) => s.storyData);
-	const currentPassage = useStoryStore((s) => s.currentPassage);
-	const nobr = useStoryStore((s) => s.nobr);
+	const { storyData, currentPassage, nobr } = useStoryFields("storyData", "currentPassage", "nobr");
 	useEffect(() => {
 		const onKeyDown = (e) => {
 			const { quickSaveKey, quickLoadKey, save, load } = useStoryStore.getState();
@@ -7759,45 +7799,47 @@ function loadFromStorage() {
 		}
 	} catch {}
 }
+/** Register a setting, starting from its default unless it has a value. */
+function define(name, def) {
+	definitions.set(name, def);
+	if (!hasOwn$2(values, name)) values[name] = def.config.default;
+	loadFromStorage();
+}
+/** The value of setting `name` if it has the type of `fallback`, else that. */
+function valueOf(name, fallback) {
+	const v = ownValue(values, name);
+	return typeof v === typeof fallback ? v : fallback;
+}
 var settings = {
 	addToggle(name, config) {
-		definitions.set(name, {
+		define(name, {
 			type: "toggle",
 			config
 		});
-		if (!Object.prototype.hasOwnProperty.call(values, name)) values[name] = config.default;
-		loadFromStorage();
 	},
 	addList(name, config) {
-		definitions.set(name, {
+		define(name, {
 			type: "list",
 			config
 		});
-		if (!Object.prototype.hasOwnProperty.call(values, name)) values[name] = config.default;
-		loadFromStorage();
 	},
 	addRange(name, config) {
-		definitions.set(name, {
+		define(name, {
 			type: "range",
 			config
 		});
-		if (!Object.prototype.hasOwnProperty.call(values, name)) values[name] = config.default;
-		loadFromStorage();
 	},
 	get(name) {
 		return ownValue(values, name);
 	},
 	getToggle(name) {
-		const v = ownValue(values, name);
-		return typeof v === "boolean" ? v : false;
+		return valueOf(name, false);
 	},
 	getList(name) {
-		const v = ownValue(values, name);
-		return typeof v === "string" ? v : "";
+		return valueOf(name, "");
 	},
 	getRange(name) {
-		const v = ownValue(values, name);
-		return typeof v === "number" ? v : 0;
+		return valueOf(name, 0);
 	},
 	set(name, value) {
 		values[name] = value;
@@ -8096,26 +8138,17 @@ function ensureVariableChangedSubscription() {
 	let prevTrans = useStoryStore.getState().transient;
 	useStoryStore.subscribe((state) => {
 		const changed = {};
-		let hasChanges = false;
-		const allVarKeys = new Set([...Object.keys(prevVars), ...Object.keys(state.variables)]);
-		for (const key of allVarKeys) if (state.variables[key] !== prevVars[key]) {
-			changed[key] = {
-				from: prevVars[key],
-				to: state.variables[key]
-			};
-			hasChanges = true;
-		}
-		const allTransKeys = new Set([...Object.keys(prevTrans), ...Object.keys(state.transient)]);
-		for (const key of allTransKeys) if (state.transient[key] !== prevTrans[key]) {
-			changed[`%${key}`] = {
-				from: prevTrans[key],
-				to: state.transient[key]
+		const collect = (prev, next, prefix) => {
+			for (const key of changedNames(prev, next)) changed[prefix + key] = {
+				from: ownValue(prev, key),
+				to: ownValue(next, key)
 			};
-			hasChanges = true;
-		}
+		};
+		collect(prevVars, state.variables, "");
+		collect(prevTrans, state.transient, "%");
 		prevVars = state.variables;
 		prevTrans = state.transient;
-		if (hasChanges) emit("variableChanged", changed);
+		if (Object.keys(changed).length > 0) emit("variableChanged", changed);
 	});
 }
 var declaredVariables = null;
@@ -8160,13 +8193,15 @@ function setOne(draft, name, value) {
 	else namespace[key] = value;
 }
 function createStoryAPI() {
+	const visits = countQueries(() => useStoryStore.getState().visitCounts);
+	const renders = countQueries(() => useStoryStore.getState().renderCounts);
 	return {
 		get(name) {
 			const { isTransient, key } = parseName(name);
 			const scope = getActiveMutationScope();
 			const source = scope ?? useStoryStore.getState();
 			const namespace = isTransient ? source.transient : source.variables;
-			const value = key.includes(".") ? getByPath(namespace, key.split(".")) : namespace[key];
+			const value = key.includes(".") ? getByPath(namespace, key.split(".")) : ownValue(namespace, key);
 			return scope ? frozenCopy(value) : value;
 		},
 		set(nameOrVars, value) {
@@ -8215,46 +8250,16 @@ function createStoryAPI() {
 		importSave(data, slot) {
 			return useStoryStore.getState().importSave(data, slot);
 		},
-		visited(name) {
-			const state = useStoryStore.getState();
-			return countOf(state.visitCounts, name ?? state.currentPassage);
-		},
-		hasVisited(name) {
-			return this.visited(name) > 0;
-		},
-		hasVisitedAny(...names) {
-			const { visitCounts } = useStoryStore.getState();
-			return names.some((n) => countOf(visitCounts, n) > 0);
-		},
-		hasVisitedAll(...names) {
-			const { visitCounts } = useStoryStore.getState();
-			return names.every((n) => countOf(visitCounts, n) > 0);
-		},
-		rendered(name) {
-			const state = useStoryStore.getState();
-			return countOf(state.renderCounts, name ?? state.currentPassage);
-		},
-		hasRendered(name) {
-			return this.rendered(name) > 0;
-		},
-		hasRenderedAny(...names) {
-			const { renderCounts } = useStoryStore.getState();
-			return names.some((n) => countOf(renderCounts, n) > 0);
-		},
-		hasRenderedAll(...names) {
-			const { renderCounts } = useStoryStore.getState();
-			return names.every((n) => countOf(renderCounts, n) > 0);
-		},
-		currentPassage() {
-			const state = useStoryStore.getState();
-			return state.storyData?.passages.get(state.currentPassage);
-		},
-		previousPassage() {
-			const state = useStoryStore.getState();
-			if (state.historyIndex <= 0) return void 0;
-			const prevName = state.history[state.historyIndex - 1]?.passage;
-			return prevName ? state.storyData?.passages.get(prevName) : void 0;
-		},
+		visited: visits.count,
+		hasVisited: visits.has,
+		hasVisitedAny: visits.any,
+		hasVisitedAll: visits.all,
+		rendered: renders.count,
+		hasRendered: renders.has,
+		hasRenderedAny: renders.any,
+		hasRenderedAll: renders.all,
+		currentPassage,
+		previousPassage,
 		get title() {
 			return useStoryStore.getState().storyData?.name || "";
 		},
@@ -8492,7 +8497,8 @@ function parseStoryVariables(content, sigil = "$") {
 		const match = line.match(DECLARATION_RE);
 		if (!match) throw new Error(`${passageName}: Invalid declaration: "${line}". Expected: ${sigil}name = value`);
 		const [, name, expr] = match;
-		if (name === "__proto__") throw new Error(`${passageName}: "${sigil}${name}" cannot be used as a variable name (${RESERVED_NAME} is reserved)`);
+		const nameError = variableNameError(name, sigil + name);
+		if (nameError) throw new Error(`${passageName}: ${nameError}`);
 		let value;
 		try {
 			value = new Function("return (" + expr + ")")();
@@ -8535,7 +8541,8 @@ function extractForLocals(content) {
 function validateRef(ref, schema, forLocals) {
 	const parts = ref.split(".");
 	const rootName = parts[0];
-	if (rootName === "__proto__") return `"$${rootName}" cannot be used as a variable name (${RESERVED_NAME} is reserved)`;
+	const nameError = variableNameError(rootName, "$" + rootName);
+	if (nameError) return nameError;
 	if (forLocals.has(rootName)) return null;
 	const rootSchema = schema.get(rootName);
 	if (!rootSchema) return `Undeclared variable: $${ref}`;
@@ -9159,7 +9166,7 @@ defineMacro({
 function liveLocalsView(getValues) {
 	return new Proxy(createNamespace(), {
 		get: (_, key) => typeof key === "string" ? ownValue(getValues(), key) : void 0,
-		has: (_, key) => typeof key === "string" && Object.prototype.hasOwnProperty.call(getValues(), key),
+		has: (_, key) => typeof key === "string" && hasOwn$2(getValues(), key),
 		ownKeys: () => Reflect.ownKeys(getValues()),
 		getOwnPropertyDescriptor: (_, key) => {
 			const desc = Object.getOwnPropertyDescriptor(getValues(), key);
@@ -9631,10 +9638,13 @@ defineMenubarAction({
 	name: "quicksave",
 	label: "QuickSave",
 	actionType: "save",
-	setup: () => ({
-		perform: useStoryStore((s) => s.save),
-		title: hotkeyTitle("Quick Save", useStoryStore((s) => s.quickSaveKey))
-	})
+	setup: () => {
+		const { save, quickSaveKey } = useStoryFields("save", "quickSaveKey");
+		return {
+			perform: save,
+			title: hotkeyTitle("Quick Save", quickSaveKey)
+		};
+	}
 });
 defineMenubarAction({
 	name: "quickload",
@@ -9642,14 +9652,11 @@ defineMenubarAction({
 	actionType: "load",
 	confirm: "Load saved game? Current progress will be lost.",
 	setup: () => {
-		const load = useStoryStore((s) => s.load);
-		const hasSave = useStoryStore((s) => s.hasSave);
-		const key = useStoryStore((s) => s.quickLoadKey);
-		useStoryStore((s) => s.knownSaves);
+		const { load, hasSave, quickLoadKey } = useStoryFields("load", "hasSave", "quickLoadKey", "knownSaves");
 		return {
 			perform: () => load(),
 			disabled: !hasSave(),
-			title: hotkeyTitle("Quick Load", key)
+			title: hotkeyTitle("Quick Load", quickLoadKey)
 		};
 	}
 });
@@ -9737,10 +9744,7 @@ function SaveManagerContent() {
 	const renameInputRef = useRef(null);
 	const fileInputRef = useRef(null);
 	const closeDialog = useContext(DialogCloseContext);
-	const storyData = useStoryStore((s) => s.storyData);
-	const playthroughId = useStoryStore((s) => s.playthroughId);
-	const beginSave = useStoryStore((s) => s.beginSave);
-	const loadFromPayload = useStoryStore((s) => s.loadFromPayload);
+	const { storyData, playthroughId, beginSave, loadFromPayload } = useStoryFields("storyData", "playthroughId", "beginSave", "loadFromPayload");
 	const ifid = storyData?.ifid ?? "";
 	const refresh = useCallback(async () => {
 		if (!ifid) return;
@@ -10680,10 +10684,7 @@ defineMacro({
 	name: "passage",
 	interpolate: true,
 	render(_props, ctx) {
-		const currentPassage = useStoryStore((s) => s.currentPassage);
-		const navigationId = useStoryStore((s) => s.navigationId);
-		const storyData = useStoryStore((s) => s.storyData);
-		const renderDeferred = useStoryStore((s) => s.renderDeferred);
+		const { currentPassage, navigationId, storyData, renderDeferred } = useStoryFields("currentPassage", "navigationId", "storyData", "renderDeferred");
 		const [displayed, setDisplayed] = useState({
 			passage: currentPassage,
 			id: navigationId

package/dist/pkg/story-variables.js

@@ -2234,15 +2234,30 @@ function errorMessage(err, fallback) {
 //#region src/utils/namespace.ts
 /** The variable name no namespace can hold. */
 var RESERVED_NAME = "__proto__";
-/** A namespace with no prototype holding the own entries of `sources`. */
-function createNamespace(...sources) {
-	const ns = Object.create(null);
+/**
+* Why `name` (without its sigil) cannot be a variable name, or undefined if
+* it can. `label` is the name as the author wrote it (e.g. `$__proto__`).
+*/
+function variableNameError(name, label = name) {
+	return name === "__proto__" ? `"${label}" cannot be used as a variable name (${RESERVED_NAME} is reserved)` : void 0;
+}
+/**
+* A record with no prototype holding the own entries of `sources`, or only
+* those whose value passes `keep`.
+*/
+function ownEntries(sources, keep = () => true) {
+	const record = Object.create(null);
 	for (const source of sources) {
 		if (!source) continue;
-		for (const key of Object.keys(source)) ns[key] = source[key];
+		for (const key of Object.keys(source)) {
+			const value = source[key];
+			if (keep(value)) record[key] = value;
+		}
 	}
-	return ns;
+	return record;
 }
+/** A namespace with no prototype holding the own entries of `sources`. */
+var createNamespace = (...sources) => ownEntries(sources);
 Object.freeze(createNamespace());
 //#endregion
 //#region src/story-variables.ts
@@ -2294,7 +2309,8 @@ function parseStoryVariables(content, sigil = "$") {
 		const match = line.match(DECLARATION_RE);
 		if (!match) throw new Error(`${passageName}: Invalid declaration: "${line}". Expected: ${sigil}name = value`);
 		const [, name, expr] = match;
-		if (name === "__proto__") throw new Error(`${passageName}: "${sigil}${name}" cannot be used as a variable name (${RESERVED_NAME} is reserved)`);
+		const nameError = variableNameError(name, sigil + name);
+		if (nameError) throw new Error(`${passageName}: ${nameError}`);
 		let value;
 		try {
 			value = new Function("return (" + expr + ")")();
@@ -2337,7 +2353,8 @@ function extractForLocals(content) {
 function validateRef(ref, schema, forLocals) {
 	const parts = ref.split(".");
 	const rootName = parts[0];
-	if (rootName === "__proto__") return `"$${rootName}" cannot be used as a variable name (${RESERVED_NAME} is reserved)`;
+	const nameError = variableNameError(rootName, "$" + rootName);
+	if (nameError) return nameError;
 	if (forLocals.has(rootName)) return null;
 	const rootSchema = schema.get(rootName);
 	if (!rootSchema) return `Undeclared variable: $${ref}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rohal12/spindle",
-  "version": "0.52.2",
+  "version": "0.52.3",
   "type": "module",
   "description": "A Preact-based story format for Twine 2.",
   "license": "Unlicense",

package/src/components/App.tsx

@@ -1,13 +1,16 @@
 import { useEffect } from 'preact/hooks';
 import { useStoryStore } from '../store';
+import { useStoryFields } from '../hooks/use-story-fields';
 import { NobrContext } from '../markup/render';
 import { StoryInterface } from './StoryInterface';
 import { TriggerDialogHost } from './TriggerDialogHost';
 
 export function App() {
-  const storyData = useStoryStore((s) => s.storyData);
-  const currentPassage = useStoryStore((s) => s.currentPassage);
-  const nobr = useStoryStore((s) => s.nobr);
+  const { storyData, currentPassage, nobr } = useStoryFields(
+    'storyData',
+    'currentPassage',
+    'nobr',
+  );
 
   useEffect(() => {
     const onKeyDown = (e: KeyboardEvent) => {

package/src/components/macros/ExprDisplay.tsx

@@ -1,8 +1,6 @@
-import { useContext } from 'preact/hooks';
-import { useStoryStore } from '../../store';
 import { evaluate } from '../../expression';
-import { LocalsValuesContext } from '../../markup/render';
 import { useInterpolate } from '../../hooks/use-interpolate';
+import { useMergedLocals } from '../../hooks/use-merged-locals';
 
 interface ExprDisplayProps {
   expression: string;
@@ -14,10 +12,7 @@ export function ExprDisplay({ expression, className, id }: ExprDisplayProps) {
   const resolve = useInterpolate();
   className = resolve(className);
   id = resolve(id);
-  const localsValues = useContext(LocalsValuesContext);
-  const variables = useStoryStore((s) => s.variables);
-  const temporary = useStoryStore((s) => s.temporary);
-  const transient = useStoryStore((s) => s.transient);
+  const [variables, temporary, localsValues, transient] = useMergedLocals();
 
   let display: string;
   try {