quidproquo-web-react 0.0.258 → 0.0.259

package/lib/commonjs/hooks/asmj/QpqMappedApi.d.ts

@@ -4,3 +4,4 @@ export type QpqApi = Record<`ask${string}`, Story<any, any>>;
 export type QpqMappedApi<TApi extends QpqApi> = {
     [K in Extract<keyof TApi, string> as RemoveQpqAskPrefix<K>]: TApi[K] extends (...args: infer P) => infer R ? R extends AskResponse<any> ? (...args: P) => Promise<AskResponseReturnType<R>> : never : never;
 };
+export declare const combineQpqApis: <TApiA extends QpqApi, TApiB extends QpqApi>(apiA: TApiA, apiB: TApiB) => TApiA & TApiB;

package/lib/commonjs/hooks/asmj/QpqMappedApi.js

@@ -1,2 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.combineQpqApis = void 0;
+const combineQpqApis = (apiA, apiB) => {
+    return Object.assign(Object.assign({}, apiA), apiB);
+};
+exports.combineQpqApis = combineQpqApis;

package/lib/commonjs/hooks/index.d.ts

@@ -1,8 +1,10 @@
 export * from './asmj';
 export * from './useAsyncEffect';
+export * from './useEffectCallback';
 export * from './useFastCallback';
 export * from './useMetadata';
 export * from './useOnKeyDownEffect';
 export * from './useQpq';
 export * from './useRunEvery';
 export * from './useThrottledMemo';
+export * from './useZipArrays';

package/lib/commonjs/hooks/index.js

@@ -16,9 +16,11 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./asmj"), exports);
 __exportStar(require("./useAsyncEffect"), exports);
+__exportStar(require("./useEffectCallback"), exports);
 __exportStar(require("./useFastCallback"), exports);
 __exportStar(require("./useMetadata"), exports);
 __exportStar(require("./useOnKeyDownEffect"), exports);
 __exportStar(require("./useQpq"), exports);
 __exportStar(require("./useRunEvery"), exports);
 __exportStar(require("./useThrottledMemo"), exports);
+__exportStar(require("./useZipArrays"), exports);

package/lib/commonjs/hooks/useEffectCallback.d.ts

@@ -0,0 +1,2 @@
+import { DependencyList } from 'react';
+export declare function useEffectCallback<T extends Function>(callback: T, deps?: DependencyList): T;

package/lib/commonjs/hooks/useEffectCallback.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useEffectCallback = useEffectCallback;
+const react_1 = require("react");
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+function useEffectCallback(callback, deps) {
+    const callbackRef = (0, react_1.useRef)(callback);
+    const depsRef = (0, react_1.useRef)(deps);
+    // If the deps have changed, update the callback ref
+    // We support undefined deps, which means they are always updated
+    // This is different to [] where its never updated.
+    const hasDepsChanged = !depsRef.current || !deps || depsRef.current.some((dep, index) => dep !== deps[index]);
+    if (hasDepsChanged) {
+        callbackRef.current = callback;
+    }
+    depsRef.current = deps;
+    const memoFunc = (0, react_1.useCallback)((...args) => callbackRef.current(...args), []);
+    return memoFunc;
+}

package/lib/commonjs/hooks/useFastCallback.js

@@ -1,19 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFastCallback = useFastCallback;
-const react_1 = require("react");
-// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+const useEffectCallback_1 = require("./useEffectCallback");
+// depraecated: use useEffectCallback instead
 function useFastCallback(callback, deps) {
-    const callbackRef = (0, react_1.useRef)(callback);
-    const depsRef = (0, react_1.useRef)(deps);
-    // If the deps have changed, update the callback ref
-    // We support undefined deps, which means they are always updated
-    // This is different to [] where its never updated.
-    const hasDepsChanged = !depsRef.current || !deps || depsRef.current.some((dep, index) => dep !== deps[index]);
-    if (hasDepsChanged) {
-        callbackRef.current = callback;
-    }
-    depsRef.current = deps;
-    const memoFunc = (0, react_1.useCallback)((...args) => callbackRef.current(...args), []);
-    return memoFunc;
+    return (0, useEffectCallback_1.useEffectCallback)(callback, deps);
 }

package/lib/commonjs/hooks/useQpq.js

@@ -14,6 +14,19 @@ const quidproquo_actionprocessor_web_1 = require("quidproquo-actionprocessor-web
 const quidproquo_core_1 = require("quidproquo-core");
 const react_1 = require("react");
 const QpqContextProvider_1 = require("./asmj/QpqContextProvider");
+function* withVersionCheck(story, versionRef, capturedVersion) {
+    let nextValue = undefined;
+    while (true) {
+        if (versionRef.current !== capturedVersion) {
+            return undefined;
+        }
+        const { value, done } = story.next(nextValue);
+        if (done) {
+            return value;
+        }
+        nextValue = yield value;
+    }
+}
 // WIP ~ useFastCallback, wack things like loggers in a context, try to only make once instance of the runtime.
 // Also don't create every refresh.. useMemo / useCallback etc
 const logger = {
@@ -24,6 +37,12 @@ const logger = {
 };
 function useQpq(getActionProcessors = () => __awaiter(this, void 0, void 0, function* () { return ({}); })) {
     const qpqContextValues = (0, QpqContextProvider_1.useQpqContextValues)();
+    const versionRef = (0, react_1.useRef)(0);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            versionRef.current++;
+        };
+    }, []);
     const resolveStory = (0, react_1.useMemo)(() => (0, quidproquo_core_1.createRuntime)([(0, quidproquo_core_1.defineModule)('UI')], {
         depth: 0,
         context: qpqContextValues,
@@ -34,7 +53,9 @@ function useQpq(getActionProcessors = () => __awaiter(this, void 0, void 0, func
     })), [qpqContextValues]);
     const qpq = (0, react_1.useCallback)(function getStoryExecutor(story) {
         return (...args) => __awaiter(this, void 0, void 0, function* () {
-            const result = yield resolveStory(story, args);
+            const capturedVersion = versionRef.current;
+            const wrappedStory = (...storyArgs) => withVersionCheck(story(...storyArgs), versionRef, capturedVersion);
+            const result = yield resolveStory(wrappedStory, args);
             if (result.error) {
                 throw new Error(result.error.errorText);
             }

package/lib/commonjs/hooks/useZipArrays.d.ts

@@ -0,0 +1,2 @@
+import { zipArrays } from 'quidproquo-core';
+export declare function useZipArrays<TLeft, TRight>(left: readonly TLeft[], right: readonly TRight[]): ReturnType<typeof zipArrays<TLeft, TRight>>;

package/lib/commonjs/hooks/useZipArrays.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useZipArrays = useZipArrays;
+const quidproquo_core_1 = require("quidproquo-core");
+const react_1 = require("react");
+function useZipArrays(left, right) {
+    const arrays = (0, react_1.useMemo)(() => (0, quidproquo_core_1.zipArrays)(left, right), [left, right]);
+    return arrays;
+}

package/lib/esm/hooks/asmj/QpqMappedApi.d.ts

@@ -4,3 +4,4 @@ export type QpqApi = Record<`ask${string}`, Story<any, any>>;
 export type QpqMappedApi<TApi extends QpqApi> = {
     [K in Extract<keyof TApi, string> as RemoveQpqAskPrefix<K>]: TApi[K] extends (...args: infer P) => infer R ? R extends AskResponse<any> ? (...args: P) => Promise<AskResponseReturnType<R>> : never : never;
 };
+export declare const combineQpqApis: <TApiA extends QpqApi, TApiB extends QpqApi>(apiA: TApiA, apiB: TApiB) => TApiA & TApiB;

package/lib/esm/hooks/asmj/QpqMappedApi.js

@@ -1 +1,3 @@
-export {};
+export const combineQpqApis = (apiA, apiB) => {
+    return { ...apiA, ...apiB };
+};

package/lib/esm/hooks/index.d.ts

@@ -1,8 +1,10 @@
 export * from './asmj';
 export * from './useAsyncEffect';
+export * from './useEffectCallback';
 export * from './useFastCallback';
 export * from './useMetadata';
 export * from './useOnKeyDownEffect';
 export * from './useQpq';
 export * from './useRunEvery';
 export * from './useThrottledMemo';
+export * from './useZipArrays';

package/lib/esm/hooks/index.js

@@ -1,8 +1,10 @@
 export * from './asmj';
 export * from './useAsyncEffect';
+export * from './useEffectCallback';
 export * from './useFastCallback';
 export * from './useMetadata';
 export * from './useOnKeyDownEffect';
 export * from './useQpq';
 export * from './useRunEvery';
 export * from './useThrottledMemo';
+export * from './useZipArrays';

package/lib/esm/hooks/useEffectCallback.d.ts

@@ -0,0 +1,2 @@
+import { DependencyList } from 'react';
+export declare function useEffectCallback<T extends Function>(callback: T, deps?: DependencyList): T;

package/lib/esm/hooks/useEffectCallback.js

@@ -0,0 +1,16 @@
+import { useCallback, useRef } from 'react';
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+export function useEffectCallback(callback, deps) {
+    const callbackRef = useRef(callback);
+    const depsRef = useRef(deps);
+    // If the deps have changed, update the callback ref
+    // We support undefined deps, which means they are always updated
+    // This is different to [] where its never updated.
+    const hasDepsChanged = !depsRef.current || !deps || depsRef.current.some((dep, index) => dep !== deps[index]);
+    if (hasDepsChanged) {
+        callbackRef.current = callback;
+    }
+    depsRef.current = deps;
+    const memoFunc = useCallback((...args) => callbackRef.current(...args), []);
+    return memoFunc;
+}

package/lib/esm/hooks/useFastCallback.js

@@ -1,16 +1,5 @@
-import { useCallback, useRef } from 'react';
-// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+import { useEffectCallback } from './useEffectCallback';
+// depraecated: use useEffectCallback instead
 export function useFastCallback(callback, deps) {
-    const callbackRef = useRef(callback);
-    const depsRef = useRef(deps);
-    // If the deps have changed, update the callback ref
-    // We support undefined deps, which means they are always updated
-    // This is different to [] where its never updated.
-    const hasDepsChanged = !depsRef.current || !deps || depsRef.current.some((dep, index) => dep !== deps[index]);
-    if (hasDepsChanged) {
-        callbackRef.current = callback;
-    }
-    depsRef.current = deps;
-    const memoFunc = useCallback((...args) => callbackRef.current(...args), []);
-    return memoFunc;
+    return useEffectCallback(callback, deps);
 }

package/lib/esm/hooks/useQpq.js

@@ -1,7 +1,20 @@
 import { getWebActionProcessors } from 'quidproquo-actionprocessor-web';
 import { createRuntime, defineModule, QpqRuntimeType, } from 'quidproquo-core';
-import { useCallback, useMemo } from 'react';
+import { useCallback, useEffect, useMemo, useRef } from 'react';
 import { useQpqContextValues } from './asmj/QpqContextProvider';
+function* withVersionCheck(story, versionRef, capturedVersion) {
+    let nextValue = undefined;
+    while (true) {
+        if (versionRef.current !== capturedVersion) {
+            return undefined;
+        }
+        const { value, done } = story.next(nextValue);
+        if (done) {
+            return value;
+        }
+        nextValue = yield value;
+    }
+}
 // WIP ~ useFastCallback, wack things like loggers in a context, try to only make once instance of the runtime.
 // Also don't create every refresh.. useMemo / useCallback etc
 const logger = {
@@ -12,6 +25,12 @@ const logger = {
 };
 export function useQpq(getActionProcessors = async () => ({})) {
     const qpqContextValues = useQpqContextValues();
+    const versionRef = useRef(0);
+    useEffect(() => {
+        return () => {
+            versionRef.current++;
+        };
+    }, []);
     const resolveStory = useMemo(() => createRuntime([defineModule('UI')], {
         depth: 0,
         context: qpqContextValues,
@@ -23,7 +42,9 @@ export function useQpq(getActionProcessors = async () => ({})) {
     }), [qpqContextValues]);
     const qpq = useCallback(function getStoryExecutor(story) {
         return async (...args) => {
-            const result = await resolveStory(story, args);
+            const capturedVersion = versionRef.current;
+            const wrappedStory = (...storyArgs) => withVersionCheck(story(...storyArgs), versionRef, capturedVersion);
+            const result = await resolveStory(wrappedStory, args);
             if (result.error) {
                 throw new Error(result.error.errorText);
             }

package/lib/esm/hooks/useZipArrays.d.ts

@@ -0,0 +1,2 @@
+import { zipArrays } from 'quidproquo-core';
+export declare function useZipArrays<TLeft, TRight>(left: readonly TLeft[], right: readonly TRight[]): ReturnType<typeof zipArrays<TLeft, TRight>>;

package/lib/esm/hooks/useZipArrays.js

@@ -0,0 +1,6 @@
+import { zipArrays } from 'quidproquo-core';
+import { useMemo } from 'react';
+export function useZipArrays(left, right) {
+    const arrays = useMemo(() => zipArrays(left, right), [left, right]);
+    return arrays;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quidproquo-web-react",
-  "version": "0.0.258",
+  "version": "0.0.259",
   "description": "",
   "main": "./lib/commonjs/index.js",
   "module": "./lib/esm/index.js",
@@ -32,8 +32,8 @@
   },
   "homepage": "https://github.com/joe-coady/quidproquo#readme",
   "devDependencies": {
-    "quidproquo-core": "0.0.258",
-    "quidproquo-tsconfig": "0.0.258",
+    "quidproquo-core": "0.0.259",
+    "quidproquo-tsconfig": "0.0.259",
     "typescript": "^5.8.2"
   },
   "peerDependencies": {
@@ -42,9 +42,9 @@
   "dependencies": {
     "jotai": "^2.12.1",
     "symbol-observable": "^4.0.0",
-    "quidproquo-web": "0.0.258",
-    "quidproquo-webserver": "0.0.258",
-    "quidproquo-actionprocessor-node": "0.0.258",
-    "quidproquo-actionprocessor-web": "0.0.258"
+    "quidproquo-web": "0.0.259",
+    "quidproquo-webserver": "0.0.259",
+    "quidproquo-actionprocessor-node": "0.0.259",
+    "quidproquo-actionprocessor-web": "0.0.259"
   }
 }