@rohal12/spindle 0.11.0 → 0.13.0

package/package.json

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

package/src/components/macros/Button.tsx

@@ -1,12 +1,10 @@
 import { useContext } from 'preact/hooks';
-import { useStoryStore } from '../../store';
-import { execute } from '../../expression';
 import { renderInlineNodes, LocalsContext } from '../../markup/render';
-import { deepClone } from '../../class-registry';
 import { collectText } from '../../utils/extract-text';
 import { useAction } from '../../hooks/use-action';
-import { useMergedLocals } from '../../hooks/use-merged-locals';
+import { stripLocalsPrefix } from '../../hooks/use-merged-locals';
 import { useInterpolate } from '../../hooks/use-interpolate';
+import { executeMutation } from '../../execute-mutation';
 import { currentSourceLocation } from '../../utils/source-location';
 import type { ASTNode } from '../../markup/ast';
 
@@ -22,38 +20,15 @@ export function Button({ rawArgs, children, className, id }: ButtonProps) {
   className = resolve(className);
   id = resolve(id);
   const scope = useContext(LocalsContext);
-  const [, , mergedLocals] = useMergedLocals();
 
   const handleClick = () => {
-    const state = useStoryStore.getState();
-    const vars = deepClone(state.variables);
-    const temps = deepClone(state.temporary);
-    const localsClone = { ...mergedLocals };
-
     try {
-      execute(rawArgs, vars, temps, localsClone);
+      executeMutation(rawArgs, stripLocalsPrefix(scope.values), scope.update);
     } catch (err) {
       console.error(
         `spindle: Error in {button ${rawArgs}}${currentSourceLocation()}:`,
         err,
       );
-      return;
-    }
-
-    for (const key of Object.keys(vars)) {
-      if (vars[key] !== state.variables[key]) {
-        state.setVariable(key, vars[key]);
-      }
-    }
-    for (const key of Object.keys(temps)) {
-      if (temps[key] !== state.temporary[key]) {
-        state.setTemporary(key, temps[key]);
-      }
-    }
-    for (const key of Object.keys(localsClone)) {
-      if (localsClone[key] !== mergedLocals[key]) {
-        scope.update(`@${key}`, localsClone[key]);
-      }
     }
   };
 

package/src/components/macros/Do.tsx

@@ -1,10 +1,8 @@
 import { useLayoutEffect, useContext } from 'preact/hooks';
-import { useStoryStore } from '../../store';
-import { execute } from '../../expression';
 import type { ASTNode } from '../../markup/ast';
-import { deepClone } from '../../class-registry';
 import { LocalsContext } from '../../markup/render';
-import { useMergedLocals } from '../../hooks/use-merged-locals';
+import { stripLocalsPrefix } from '../../hooks/use-merged-locals';
+import { executeMutation } from '../../execute-mutation';
 import { currentSourceLocation } from '../../utils/source-location';
 
 interface DoProps {
@@ -21,36 +19,12 @@ function collectText(nodes: ASTNode[]): string {
 export function Do({ children }: DoProps) {
   const code = collectText(children);
   const scope = useContext(LocalsContext);
-  const [, , mergedLocals] = useMergedLocals();
 
   useLayoutEffect(() => {
-    const state = useStoryStore.getState();
-    const vars = deepClone(state.variables);
-    const temps = deepClone(state.temporary);
-    const localsClone = { ...mergedLocals };
-
     try {
-      execute(code, vars, temps, localsClone);
+      executeMutation(code, stripLocalsPrefix(scope.values), scope.update);
     } catch (err) {
       console.error(`spindle: Error in {do}${currentSourceLocation()}:`, err);
-      return;
-    }
-
-    // Diff and apply
-    for (const key of Object.keys(vars)) {
-      if (vars[key] !== state.variables[key]) {
-        state.setVariable(key, vars[key]);
-      }
-    }
-    for (const key of Object.keys(temps)) {
-      if (temps[key] !== state.temporary[key]) {
-        state.setTemporary(key, temps[key]);
-      }
-    }
-    for (const key of Object.keys(localsClone)) {
-      if (localsClone[key] !== mergedLocals[key]) {
-        scope.update(`@${key}`, localsClone[key]);
-      }
     }
   }, []);
 

package/src/components/macros/MacroLink.tsx

@@ -1,11 +1,10 @@
 import { useContext } from 'preact/hooks';
 import { useStoryStore } from '../../store';
-import { execute } from '../../expression';
 import type { ASTNode } from '../../markup/ast';
-import { deepClone } from '../../class-registry';
 import { LocalsContext } from '../../markup/render';
-import { useMergedLocals } from '../../hooks/use-merged-locals';
+import { stripLocalsPrefix } from '../../hooks/use-merged-locals';
 import { useInterpolate } from '../../hooks/use-interpolate';
+import { executeMutation } from '../../execute-mutation';
 import { currentSourceLocation } from '../../utils/source-location';
 
 interface MacroLinkProps {
@@ -47,16 +46,11 @@ function executeChildren(
   mergedLocals: Record<string, unknown>,
   scopeUpdate: (key: string, value: unknown) => void,
 ) {
-  const state = useStoryStore.getState();
-  const vars = deepClone(state.variables);
-  const temps = deepClone(state.temporary);
-  const localsClone = { ...mergedLocals };
-
   for (const node of children) {
     if (node.type !== 'macro') continue;
     if (node.name === 'set') {
       try {
-        execute(node.rawArgs, vars, temps, localsClone);
+        executeMutation(node.rawArgs, mergedLocals, scopeUpdate);
       } catch (err) {
         console.error(
           `spindle: Error in {link} child {set}${currentSourceLocation()}:`,
@@ -66,7 +60,7 @@ function executeChildren(
     } else if (node.name === 'do') {
       const code = collectText(node.children);
       try {
-        execute(code, vars, temps, localsClone);
+        executeMutation(code, mergedLocals, scopeUpdate);
       } catch (err) {
         console.error(
           `spindle: Error in {link} child {do}${currentSourceLocation()}:`,
@@ -75,23 +69,6 @@ function executeChildren(
       }
     }
   }
-
-  // Apply changes
-  for (const key of Object.keys(vars)) {
-    if (vars[key] !== state.variables[key]) {
-      state.setVariable(key, vars[key]);
-    }
-  }
-  for (const key of Object.keys(temps)) {
-    if (temps[key] !== state.temporary[key]) {
-      state.setTemporary(key, temps[key]);
-    }
-  }
-  for (const key of Object.keys(localsClone)) {
-    if (localsClone[key] !== mergedLocals[key]) {
-      scopeUpdate(`@${key}`, localsClone[key]);
-    }
-  }
 }
 
 export function MacroLink({
@@ -105,11 +82,10 @@ export function MacroLink({
   id = resolve(id);
   const { display, passage } = parseArgs(rawArgs);
   const scope = useContext(LocalsContext);
-  const [, , mergedLocals] = useMergedLocals();
 
   const handleClick = (e: Event) => {
     e.preventDefault();
-    executeChildren(children, mergedLocals, scope.update);
+    executeChildren(children, stripLocalsPrefix(scope.values), scope.update);
     if (passage) {
       useStoryStore.getState().navigate(passage);
     }
@@ -122,7 +98,7 @@ export function MacroLink({
     label: display,
     target: passage ?? undefined,
     perform: () => {
-      executeChildren(children, mergedLocals, scope.update);
+      executeChildren(children, stripLocalsPrefix(scope.values), scope.update);
       if (passage) {
         useStoryStore.getState().navigate(passage);
       }

package/src/components/macros/Set.tsx

@@ -1,9 +1,7 @@
 import { useRef, useContext } from 'preact/hooks';
-import { useStoryStore } from '../../store';
-import { execute } from '../../expression';
-import { deepClone } from '../../class-registry';
 import { LocalsContext } from '../../markup/render';
-import { useMergedLocals } from '../../hooks/use-merged-locals';
+import { stripLocalsPrefix } from '../../hooks/use-merged-locals';
+import { executeMutation } from '../../execute-mutation';
 import { currentSourceLocation } from '../../utils/source-location';
 
 interface SetProps {
@@ -12,18 +10,13 @@ interface SetProps {
 
 export function Set({ rawArgs }: SetProps) {
   const scope = useContext(LocalsContext);
-  const [, , mergedLocals] = useMergedLocals();
   const ran = useRef(false);
 
   if (!ran.current) {
     ran.current = true;
-    const state = useStoryStore.getState();
-    const vars = deepClone(state.variables);
-    const temps = deepClone(state.temporary);
-    const localsClone = { ...mergedLocals };
 
     try {
-      execute(rawArgs, vars, temps, localsClone);
+      executeMutation(rawArgs, stripLocalsPrefix(scope.values), scope.update);
     } catch (err) {
       console.error(
         `spindle: Error in {set ${rawArgs}}${currentSourceLocation()}:`,
@@ -31,25 +24,6 @@ export function Set({ rawArgs }: SetProps) {
       );
       return null;
     }
-
-    // Diff and apply store changes
-    for (const key of Object.keys(vars)) {
-      if (vars[key] !== state.variables[key]) {
-        state.setVariable(key, vars[key]);
-      }
-    }
-    for (const key of Object.keys(temps)) {
-      if (temps[key] !== state.temporary[key]) {
-        state.setTemporary(key, temps[key]);
-      }
-    }
-
-    // Diff and apply locals changes
-    for (const key of Object.keys(localsClone)) {
-      if (localsClone[key] !== mergedLocals[key]) {
-        scope.update(`@${key}`, localsClone[key]);
-      }
-    }
   }
 
   return null;

package/src/execute-mutation.ts

@@ -0,0 +1,32 @@
+import { useStoryStore } from './store';
+import { execute } from './expression';
+import { deepClone } from './class-registry';
+
+export function executeMutation(
+  code: string,
+  mergedLocals: Record<string, unknown>,
+  scopeUpdate: (key: string, value: unknown) => void,
+): void {
+  const state = useStoryStore.getState();
+  const vars = deepClone(state.variables);
+  const temps = deepClone(state.temporary);
+  const localsClone = { ...mergedLocals };
+
+  execute(code, vars, temps, localsClone);
+
+  for (const key of Object.keys(vars)) {
+    if (vars[key] !== state.variables[key]) {
+      state.setVariable(key, vars[key]);
+    }
+  }
+  for (const key of Object.keys(temps)) {
+    if (temps[key] !== state.temporary[key]) {
+      state.setTemporary(key, temps[key]);
+    }
+  }
+  for (const key of Object.keys(localsClone)) {
+    if (localsClone[key] !== mergedLocals[key]) {
+      scopeUpdate(`@${key}`, localsClone[key]);
+    }
+  }
+}

package/src/hooks/use-merged-locals.ts

@@ -2,6 +2,22 @@ import { useContext, useMemo } from 'preact/hooks';
 import { useStoryStore } from '../store';
 import { LocalsContext } from '../markup/render';
 
+/**
+ * Strip `@` prefix from locals scope values so they can be passed
+ * directly to evaluate/execute.
+ */
+export function stripLocalsPrefix(
+  values: Record<string, unknown>,
+): Record<string, unknown> {
+  const locals: Record<string, unknown> = {};
+  for (const [key, val] of Object.entries(values)) {
+    if (key.startsWith('@')) {
+      locals[key.slice(1)] = val;
+    }
+  }
+  return locals;
+}
+
 /**
  * Return store variables, temporary, and @-prefixed locals from context.
  * Locals use `@` prefix keys internally; the returned locals dict has
@@ -17,12 +33,6 @@ export function useMergedLocals(): readonly [
   const scope = useContext(LocalsContext);
 
   return useMemo(() => {
-    const locals: Record<string, unknown> = {};
-    for (const [key, val] of Object.entries(scope.values)) {
-      if (key.startsWith('@')) {
-        locals[key.slice(1)] = val;
-      }
-    }
-    return [variables, temporary, locals] as const;
+    return [variables, temporary, stripLocalsPrefix(scope.values)] as const;
   }, [variables, temporary, scope.values]);
 }