@rohal12/spindle 0.43.0 → 0.43.2

package/package.json

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

package/src/components/macros/Computed.tsx

@@ -22,9 +22,9 @@ function parseComputedArgs(rawArgs: string): { target: string; expr: string } {
       const target = trimmed.slice(0, i).trim();
       const expr = trimmed.slice(i + 1).trim();
 
-      if (!target.match(/^[$_]\w+$/)) {
+      if (!target.match(/^[$_@]\w+$/)) {
         throw new Error(
-          `{computed}: target must be $name or _name, got "${target}"`,
+          `{computed}: target must be $name, _name, or @name, got "${target}"`,
         );
       }
 
@@ -58,11 +58,14 @@ function computeAndApply(
   expr: string,
   name: string,
   isTemp: boolean,
+  isLocal: boolean,
   variables: Record<string, unknown>,
   temporary: Record<string, unknown>,
   locals: Record<string, unknown>,
   transient: Record<string, unknown>,
   rawArgs: string,
+  prevRef: { current: unknown },
+  localsUpdate: ((key: string, value: unknown) => void) | null,
 ): void {
   let newValue: unknown;
   try {
@@ -75,11 +78,22 @@ function computeAndApply(
     return;
   }
 
-  const current = isTemp ? temporary[name] : variables[name];
-  if (!valuesEqual(current, newValue)) {
-    const state = useStoryStore.getState();
-    if (isTemp) state.setTemporary(name, newValue);
-    else state.setVariable(name, newValue);
+  if (!valuesEqual(prevRef.current, newValue)) {
+    prevRef.current = newValue;
+    if (isLocal) {
+      try {
+        localsUpdate!(name, newValue);
+      } catch (err) {
+        console.error(
+          `spindle: Error in {computed ${rawArgs}}${currentSourceLocation()}:`,
+          err,
+        );
+      }
+    } else {
+      const state = useStoryStore.getState();
+      if (isTemp) state.setTemporary(name, newValue);
+      else state.setVariable(name, newValue);
+    }
   }
 }
 
@@ -101,8 +115,12 @@ defineMacro({
         />
       );
     }
+    const isLocal = target.startsWith('@');
     const isTemp = target.startsWith('_');
     const name = target.slice(1);
+    const localsUpdate = isLocal ? ctx.update : null;
+
+    const prevOutput = ctx.hooks.useRef<unknown>(undefined);
 
     const ran = ctx.hooks.useRef(false);
     if (!ran.current) {
@@ -111,11 +129,14 @@ defineMacro({
         expr,
         name,
         isTemp,
+        isLocal,
         mergedVars,
         mergedTemps,
         mergedLocals,
         mergedTrans,
         rawArgs,
+        prevOutput,
+        localsUpdate,
       );
     }
 
@@ -124,11 +145,14 @@ defineMacro({
         expr,
         name,
         isTemp,
+        isLocal,
         mergedVars,
         mergedTemps,
         mergedLocals,
         mergedTrans,
         rawArgs,
+        prevOutput,
+        localsUpdate,
       );
     }, [mergedVars, mergedTemps, mergedLocals, mergedTrans]);
 

package/src/components/macros/For.tsx

@@ -53,21 +53,35 @@ function parseForArgs(rawArgs: string): {
 
 function ForIteration({
   parentValues,
-  ownKeys,
-  initialValues,
+  itemVar,
+  itemValue,
+  indexVar,
+  indexValue,
   children,
 }: {
   parentValues: Record<string, unknown>;
-  ownKeys: Record<string, unknown>;
-  initialValues: Record<string, unknown>;
+  itemVar: string;
+  itemValue: unknown;
+  indexVar: string | null;
+  indexValue: number;
   children: ASTNode[];
 }) {
   const [localMutations, setLocalMutations] = useState<Record<string, unknown>>(
-    () => ({ ...initialValues }),
+    () => ({}),
   );
 
-  // Recomputed every render — picks up new parentValues/ownKeys from parent
-  const localState = { ...parentValues, ...ownKeys, ...localMutations };
+  const ownKeys = useMemo(
+    () => ({
+      [itemVar]: itemValue,
+      ...(indexVar ? { [indexVar]: indexValue } : undefined),
+    }),
+    [itemVar, itemValue, indexVar, indexValue],
+  );
+
+  const localState = useMemo(
+    () => ({ ...parentValues, ...ownKeys, ...localMutations }),
+    [parentValues, ownKeys, localMutations],
+  );
 
   const valuesRef = useRef(localState);
   valuesRef.current = localState;
@@ -131,22 +145,17 @@ defineMacro({
       );
     }
 
-    const content = list.map((item, i) => {
-      const ownKeys: Record<string, unknown> = {
-        [itemVar]: item,
-        ...(indexVar ? { [indexVar]: i } : undefined),
-      };
-
-      return (
-        <ForIteration
-          key={`${i}-${JSON.stringify(item)}`}
-          parentValues={parentValues}
-          ownKeys={ownKeys}
-          initialValues={{}}
-          children={children}
-        />
-      );
-    });
+    const content = list.map((item, i) => (
+      <ForIteration
+        key={`${i}-${JSON.stringify(item)}`}
+        parentValues={parentValues}
+        itemVar={itemVar}
+        itemValue={item}
+        indexVar={indexVar}
+        indexValue={i}
+        children={children}
+      />
+    ));
 
     return ctx.wrap(content);
   },

package/src/components/macros/WidgetInvocation.tsx

@@ -190,8 +190,10 @@ function WidgetBody({
     {},
   );
 
-  // Recomputed every render — picks up new ownKeys from parent
-  const localState = { ...parentValues, ...ownKeys, ...localMutations };
+  const localState = useMemo(
+    () => ({ ...parentValues, ...ownKeys, ...localMutations }),
+    [parentValues, ownKeys, localMutations],
+  );
 
   const valuesRef = useRef(localState);
   valuesRef.current = localState;
@@ -233,10 +235,9 @@ export function WidgetInvocation({
   }
 
   const argExprs = splitArgs(rawArgs);
-  const ownKeys: Record<string, unknown> = {};
+  const values: unknown[] = [];
 
   for (let i = 0; i < params.length; i++) {
-    const param = params[i]!;
     const expr = argExprs[i];
     let value: unknown;
     if (expr !== undefined) {
@@ -252,9 +253,20 @@ export function WidgetInvocation({
         value = undefined;
       }
     }
-    ownKeys[param.startsWith('@') ? param.slice(1) : param] = value;
+    values.push(value);
   }
 
+  const ownKeys = useMemo(() => {
+    const keys: Record<string, unknown> = {};
+    for (let i = 0; i < params.length; i++) {
+      keys[params[i]!.startsWith('@') ? params[i]!.slice(1) : params[i]!] =
+        values[i];
+    }
+    return keys;
+    // params is stable per widget instance; values tracks evaluated args
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, values);
+
   return (
     <WidgetChildrenContext.Provider value={childrenValue}>
       <WidgetBody