@prosopo/procaptcha-puzzle 2.10.8 → 2.10.10

package/dist/services/Manager.js

@@ -1,269 +1,286 @@
 import { stringToHex } from "@polkadot/util/string";
 import { ProviderApi } from "@prosopo/api";
 import { ProsopoEnvError } from "@prosopo/common";
-import { ExtensionLoader, buildUpdateState, getProcaptchaRandomActiveProvider, providerRetry, } from "@prosopo/procaptcha-common";
-import { getDefaultEvents } from "@prosopo/procaptcha-common";
-import { ApiParams, ProcaptchaConfigSchema, encodeProcaptchaOutput, } from "@prosopo/types";
-import { embedData, sleep } from "@prosopo/util";
+import { getDefaultEvents, buildUpdateState, providerRetry, ExtensionLoader, getProcaptchaRandomActiveProvider } from "@prosopo/procaptcha-common";
+import { ProcaptchaConfigSchema, ApiParams, encodeProcaptchaOutput } from "@prosopo/types";
+import { sleep, embedData } from "@prosopo/util";
 import { randomAsHex } from "@prosopo/util-crypto";
-export const Manager = (configInput, state, onStateUpdate, callbacks, frictionlessState, getHoneypotValue) => {
-    const events = getDefaultEvents(callbacks);
-    let storedChallengeResponse;
-    let storedProviderApi;
-    let storedProviderUrl;
-    let storedUser;
-    let storedClickX;
-    let storedClickY;
-    const defaultState = () => {
-        return {
-            showModal: false,
-            loading: false,
-            index: 0,
-            challenge: undefined,
-            solutions: undefined,
-            isHuman: false,
-            captchaApi: undefined,
-            account: undefined,
-        };
+const Manager = (configInput, state, onStateUpdate, callbacks, frictionlessState, getHoneypotValue) => {
+  const events = getDefaultEvents(callbacks);
+  let storedChallengeResponse;
+  let storedProviderApi;
+  let storedProviderUrl;
+  let storedUser;
+  let storedClickX;
+  let storedClickY;
+  const defaultState = () => {
+    return {
+      // note order matters! see buildUpdateState. These fields are set in order, so disable modal first, then set loading to false, etc.
+      showModal: false,
+      loading: false,
+      index: 0,
+      challenge: void 0,
+      solutions: void 0,
+      isHuman: false,
+      captchaApi: void 0,
+      account: void 0
+      // don't handle timeout here, this should be handled by the state management
     };
-    const clearTimeout = () => {
-        window.clearTimeout(Number(state.timeout));
-        updateState({ timeout: undefined });
+  };
+  const clearTimeout = () => {
+    window.clearTimeout(Number(state.timeout));
+    updateState({ timeout: void 0 });
+  };
+  const onFailed = () => {
+    updateState({
+      isHuman: false,
+      loading: false
+    });
+    events.onFailed();
+    resetState(frictionlessState?.restart);
+  };
+  const clearSuccessfulChallengeTimeout = () => {
+    window.clearTimeout(Number(state.successfullChallengeTimeout));
+    updateState({ successfullChallengeTimeout: void 0 });
+  };
+  const getConfig = () => {
+    const config = {
+      userAccountAddress: configInput.userAccountAddress || "",
+      ...configInput
     };
-    const onFailed = () => {
+    if (state.account) {
+      config.userAccountAddress = state.account.account.address;
+    }
+    return ProcaptchaConfigSchema.parse(config);
+  };
+  const getAccount = () => {
+    if (!state.account) {
+      throw new ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
+        context: { error: "Account not loaded" }
+      });
+    }
+    const account = state.account;
+    return { account };
+  };
+  const getDappAccount = () => {
+    if (!state.dappAccount) {
+      throw new ProsopoEnvError("GENERAL.SITE_KEY_MISSING");
+    }
+    const dappAccount = state.dappAccount;
+    return dappAccount;
+  };
+  const updateState = buildUpdateState(state, onStateUpdate);
+  const resetState = (frictionlessRestart) => {
+    clearTimeout();
+    clearSuccessfulChallengeTimeout();
+    updateState(defaultState());
+    events.onReset();
+    if (frictionlessRestart) {
+      frictionlessRestart();
+    }
+    storedChallengeResponse = void 0;
+    storedProviderApi = void 0;
+    storedProviderUrl = void 0;
+    storedUser = void 0;
+    storedClickX = void 0;
+    storedClickY = void 0;
+  };
+  const setValidChallengeTimeout = () => {
+    const timeMillis = getConfig().captchas.puzzle.solutionTimeout;
+    const successfullChallengeTimeout = setTimeout(() => {
+      updateState({ isHuman: false });
+      events.onExpired();
+      resetState(frictionlessState?.restart);
+    }, timeMillis);
+    updateState({ successfullChallengeTimeout });
+  };
+  const start = async (x = 0, y = 0) => {
+    storedClickX = x;
+    storedClickY = y;
+    await providerRetry(
+      async () => {
+        if (state.loading) {
+          return;
+        }
+        if (state.isHuman) {
+          return;
+        }
+        resetState();
         updateState({
-            isHuman: false,
-            loading: false,
+          loading: true
         });
-        events.onFailed();
-        resetState(frictionlessState?.restart);
-    };
-    const clearSuccessfulChallengeTimeout = () => {
-        window.clearTimeout(Number(state.successfullChallengeTimeout));
-        updateState({ successfullChallengeTimeout: undefined });
-    };
-    const getConfig = () => {
-        const config = {
-            userAccountAddress: configInput.userAccountAddress || "",
-            ...configInput,
+        updateState({ attemptCount: state.attemptCount + 1 });
+        const config = getConfig();
+        const selectAccount = async () => {
+          if (frictionlessState) {
+            return frictionlessState.userAccount;
+          }
+          const ext = new (await ExtensionLoader(config.web2))();
+          return ext.getAccount(config);
         };
-        if (state.account) {
-            config.userAccountAddress = state.account.account.address;
-        }
-        return ProcaptchaConfigSchema.parse(config);
-    };
-    const getAccount = () => {
-        if (!state.account) {
-            throw new ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
-                context: { error: "Account not loaded" },
-            });
-        }
-        const account = state.account;
-        return { account };
-    };
-    const getDappAccount = () => {
-        if (!state.dappAccount) {
-            throw new ProsopoEnvError("GENERAL.SITE_KEY_MISSING");
+        const user = await selectAccount();
+        const userAccount = user.account.address;
+        updateState({
+          account: { account: { address: userAccount } }
+        });
+        updateState({ dappAccount: config.account.address });
+        await sleep(100);
+        if (!config.web2 && !config.userAccountAddress) {
+          throw new ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
+            context: {
+              error: "Account address has not been set for web3 mode"
+            }
+          });
         }
-        const dappAccount = state.dappAccount;
-        return dappAccount;
-    };
-    const updateState = buildUpdateState(state, onStateUpdate);
-    const resetState = (frictionlessRestart) => {
-        clearTimeout();
-        clearSuccessfulChallengeTimeout();
-        updateState(defaultState());
-        events.onReset();
-        if (frictionlessRestart) {
-            frictionlessRestart();
+        let getRandomProviderResponse = void 0;
+        if (frictionlessState?.provider) {
+          getRandomProviderResponse = frictionlessState.provider;
+        } else {
+          getRandomProviderResponse = await getProcaptchaRandomActiveProvider(
+            getConfig().defaultEnvironment
+          );
         }
-        storedChallengeResponse = undefined;
-        storedProviderApi = undefined;
-        storedProviderUrl = undefined;
-        storedUser = undefined;
-        storedClickX = undefined;
-        storedClickY = undefined;
-    };
-    const setValidChallengeTimeout = () => {
-        const timeMillis = getConfig().captchas.puzzle.solutionTimeout;
-        const successfullChallengeTimeout = setTimeout(() => {
-            updateState({ isHuman: false });
-            events.onExpired();
-            resetState(frictionlessState?.restart);
-        }, timeMillis);
-        updateState({ successfullChallengeTimeout });
-    };
-    const start = async (x = 0, y = 0) => {
-        storedClickX = x;
-        storedClickY = y;
-        await providerRetry(async () => {
-            if (state.loading) {
-                return;
-            }
-            if (state.isHuman) {
-                return;
-            }
-            resetState();
-            updateState({
-                loading: true,
-            });
-            updateState({ attemptCount: state.attemptCount + 1 });
-            const config = getConfig();
-            const selectAccount = async () => {
-                if (frictionlessState) {
-                    return frictionlessState.userAccount;
-                }
-                const ext = new (await ExtensionLoader(config.web2))();
-                return ext.getAccount(config);
-            };
-            const user = await selectAccount();
-            const userAccount = user.account.address;
-            updateState({
-                account: { account: { address: userAccount } },
-            });
-            updateState({ dappAccount: config.account.address });
-            await sleep(100);
-            if (!config.web2 && !config.userAccountAddress) {
-                throw new ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
-                    context: {
-                        error: "Account address has not been set for web3 mode",
-                    },
-                });
-            }
-            let getRandomProviderResponse = undefined;
-            if (frictionlessState?.provider) {
-                getRandomProviderResponse = frictionlessState.provider;
-            }
-            else {
-                getRandomProviderResponse = await getProcaptchaRandomActiveProvider(getConfig().defaultEnvironment);
-            }
-            const providerUrl = getRandomProviderResponse.provider.url;
-            const providerApi = new ProviderApi(providerUrl, getDappAccount());
-            const simdReadingsOnChallenge = frictionlessState?.getSimdReadings
-                ? await frictionlessState.getSimdReadings(0)
-                : undefined;
-            const challenge = await providerApi.getPuzzleCaptchaChallenge(userAccount, getDappAccount(), frictionlessState?.sessionId, simdReadingsOnChallenge);
-            if (challenge.error) {
-                updateState({
-                    loading: false,
-                    error: {
-                        message: challenge.error.message,
-                        key: challenge.error.key || "API.UNKNOWN_ERROR",
-                    },
-                });
-                return;
+        const providerUrl = getRandomProviderResponse.provider.url;
+        const providerApi = new ProviderApi(providerUrl, getDappAccount());
+        const simdReadingsOnChallenge = frictionlessState?.getSimdReadings ? await frictionlessState.getSimdReadings(0) : void 0;
+        const challenge = await providerApi.getPuzzleCaptchaChallenge(
+          userAccount,
+          getDappAccount(),
+          frictionlessState?.sessionId,
+          simdReadingsOnChallenge
+        );
+        if (challenge.error) {
+          updateState({
+            loading: false,
+            error: {
+              message: challenge.error.message,
+              key: challenge.error.key || "API.UNKNOWN_ERROR"
             }
-            storedChallengeResponse = challenge;
-            storedProviderApi = providerApi;
-            storedProviderUrl = providerUrl;
-            storedUser = user;
-            updateState({
-                loading: false,
-            });
-        }, async () => {
-            await start();
-        }, () => {
-            resetState();
-        }, state.attemptCount, 3);
-        return storedChallengeResponse;
-    };
-    const submitSolution = async (finalX, finalY, puzzleEvents) => {
-        if (!storedChallengeResponse ||
-            !storedProviderApi ||
-            !storedProviderUrl ||
-            !storedUser) {
-            throw new ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
-                context: { error: "No challenge data available. Call start() first." },
-            });
+          });
+          return;
         }
-        updateState({ loading: true });
+        storedChallengeResponse = challenge;
+        storedProviderApi = providerApi;
+        storedProviderUrl = providerUrl;
+        storedUser = user;
+        updateState({
+          loading: false
+        });
+      },
+      async () => {
+        await start();
+      },
+      () => {
+        resetState();
+      },
+      state.attemptCount,
+      3
+    );
+    return storedChallengeResponse;
+  };
+  const submitSolution = async (finalX, finalY, puzzleEvents) => {
+    if (!storedChallengeResponse || !storedProviderApi || !storedProviderUrl || !storedUser) {
+      throw new ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
+        context: { error: "No challenge data available. Call start() first." }
+      });
+    }
+    updateState({ loading: true });
+    try {
+      const challenge = storedChallengeResponse;
+      const providerApi = storedProviderApi;
+      const providerUrl = storedProviderUrl;
+      const user = storedUser;
+      const config = getConfig();
+      const signer = user.extension?.signer;
+      if (!signer || !signer.signRaw) {
+        throw new ProsopoEnvError("GENERAL.CANT_FIND_KEYRINGPAIR", {
+          context: {
+            error: "Signer is not defined, cannot sign message to prove account ownership"
+          }
+        });
+      }
+      const userTimestampSignature = await signer.signRaw({
+        address: user.account.address,
+        data: stringToHex(challenge[ApiParams.timestamp].toString()),
+        type: "bytes"
+      });
+      let encryptedBehavioralData;
+      if (frictionlessState?.encryptBehavioralData && (frictionlessState?.behaviorCollector1 || frictionlessState?.behaviorCollector2 || frictionlessState?.behaviorCollector3)) {
         try {
-            const challenge = storedChallengeResponse;
-            const providerApi = storedProviderApi;
-            const providerUrl = storedProviderUrl;
-            const user = storedUser;
-            const config = getConfig();
-            const signer = user.extension?.signer;
-            if (!signer || !signer.signRaw) {
-                throw new ProsopoEnvError("GENERAL.CANT_FIND_KEYRINGPAIR", {
-                    context: {
-                        error: "Signer is not defined, cannot sign message to prove account ownership",
-                    },
-                });
-            }
-            const userTimestampSignature = await signer.signRaw({
-                address: user.account.address,
-                data: stringToHex(challenge[ApiParams.timestamp].toString()),
-                type: "bytes",
-            });
-            let encryptedBehavioralData;
-            if (frictionlessState?.encryptBehavioralData &&
-                (frictionlessState?.behaviorCollector1 ||
-                    frictionlessState?.behaviorCollector2 ||
-                    frictionlessState?.behaviorCollector3)) {
-                try {
-                    const behavioralData = {
-                        collector1: frictionlessState.behaviorCollector1?.getData() || [],
-                        collector2: frictionlessState.behaviorCollector2?.getData() || [],
-                        collector3: frictionlessState.behaviorCollector3?.getData() || [],
-                        deviceCapability: frictionlessState.deviceCapability || "unknown",
-                    };
-                    const dataToEncrypt = frictionlessState.packBehavioralData
-                        ? frictionlessState.packBehavioralData(behavioralData)
-                        : behavioralData;
-                    encryptedBehavioralData =
-                        await frictionlessState.encryptBehavioralData(JSON.stringify(dataToEncrypt));
-                }
-                catch {
-                }
-            }
-            let salt;
-            if (storedClickX !== undefined && storedClickY !== undefined) {
-                const coords = [storedClickX, storedClickY];
-                const randomSalt = randomAsHex(coords
-                    .map((coord) => coord.toString(16).length + 4)
-                    .reduce((acc, curr) => acc + curr, 0));
-                salt = embedData(randomSalt, coords);
-            }
-            const simdReadings = frictionlessState?.getSimdReadings
-                ? await frictionlessState.getSimdReadings()
-                : undefined;
-            const hpValue = getHoneypotValue?.();
-            const clientMetaData = hpValue ? { hp: hpValue } : undefined;
-            const verifiedSolution = await providerApi.submitPuzzleCaptchaSolution(challenge, getAccount().account.account.address, getDappAccount(), finalX, finalY, puzzleEvents, userTimestampSignature.signature.toString(), config.captchas.puzzle.verifiedTimeout, encryptedBehavioralData, salt, simdReadings, clientMetaData);
-            if (verifiedSolution[ApiParams.verified]) {
-                updateState({
-                    isHuman: true,
-                    loading: false,
-                });
-                events.onHuman(encodeProcaptchaOutput({
-                    [ApiParams.providerUrl]: providerUrl,
-                    [ApiParams.user]: getAccount().account.account.address,
-                    [ApiParams.dapp]: getDappAccount(),
-                    [ApiParams.challenge]: challenge.challenge,
-                    [ApiParams.timestamp]: challenge.timestamp,
-                    [ApiParams.signature]: {
-                        [ApiParams.provider]: challenge.signature.provider,
-                        [ApiParams.user]: {
-                            [ApiParams.timestamp]: userTimestampSignature.signature.toString(),
-                        },
-                    },
-                }));
-                setValidChallengeTimeout();
-                return true;
-            }
-            onFailed();
-            return false;
-        }
-        catch (error) {
-            updateState({ loading: false });
-            throw error;
+          const behavioralData = {
+            collector1: frictionlessState.behaviorCollector1?.getData() || [],
+            collector2: frictionlessState.behaviorCollector2?.getData() || [],
+            collector3: frictionlessState.behaviorCollector3?.getData() || [],
+            deviceCapability: frictionlessState.deviceCapability || "unknown"
+          };
+          const dataToEncrypt = frictionlessState.packBehavioralData ? frictionlessState.packBehavioralData(behavioralData) : behavioralData;
+          encryptedBehavioralData = await frictionlessState.encryptBehavioralData(
+            JSON.stringify(dataToEncrypt)
+          );
+        } catch {
         }
-    };
-    return {
-        start,
-        submitSolution,
-        resetState,
-    };
+      }
+      let salt;
+      if (storedClickX !== void 0 && storedClickY !== void 0) {
+        const coords = [storedClickX, storedClickY];
+        const randomSalt = randomAsHex(
+          coords.map((coord) => coord.toString(16).length + 4).reduce((acc, curr) => acc + curr, 0)
+        );
+        salt = embedData(randomSalt, coords);
+      }
+      const simdReadings = frictionlessState?.getSimdReadings ? await frictionlessState.getSimdReadings() : void 0;
+      const hpValue = getHoneypotValue?.();
+      const clientMetaData = hpValue ? { hp: hpValue } : void 0;
+      const verifiedSolution = await providerApi.submitPuzzleCaptchaSolution(
+        challenge,
+        getAccount().account.account.address,
+        getDappAccount(),
+        finalX,
+        finalY,
+        puzzleEvents,
+        userTimestampSignature.signature.toString(),
+        config.captchas.puzzle.verifiedTimeout,
+        encryptedBehavioralData,
+        salt,
+        simdReadings,
+        clientMetaData
+      );
+      if (verifiedSolution[ApiParams.verified]) {
+        updateState({
+          isHuman: true,
+          loading: false
+        });
+        events.onHuman(
+          encodeProcaptchaOutput({
+            [ApiParams.providerUrl]: providerUrl,
+            [ApiParams.user]: getAccount().account.account.address,
+            [ApiParams.dapp]: getDappAccount(),
+            [ApiParams.challenge]: challenge.challenge,
+            [ApiParams.timestamp]: challenge.timestamp,
+            [ApiParams.signature]: {
+              [ApiParams.provider]: challenge.signature.provider,
+              [ApiParams.user]: {
+                [ApiParams.timestamp]: userTimestampSignature.signature.toString()
+              }
+            }
+          })
+        );
+        setValidChallengeTimeout();
+        return true;
+      }
+      onFailed();
+      return false;
+    } catch (error) {
+      updateState({ loading: false });
+      throw error;
+    }
+  };
+  return {
+    start,
+    submitSolution,
+    resetState
+  };
+};
+export {
+  Manager
 };
-//# sourceMappingURL=Manager.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@prosopo/procaptcha-puzzle",
-	"version": "2.10.8",
+	"version": "2.10.10",
 	"author": "PROSOPO LIMITED <info@prosopo.io>",
 	"license": "Apache-2.0",
 	"main": "dist/index.js",
@@ -30,11 +30,11 @@
 	"browserslist": ["> 0.5%, last 2 versions, not dead"],
 	"dependencies": {
 		"@polkadot/util": "13.5.7",
-		"@prosopo/api": "3.4.8",
+		"@prosopo/api": "3.4.10",
 		"@prosopo/common": "3.1.38",
 		"@prosopo/locale": "3.2.4",
-		"@prosopo/procaptcha-common": "2.10.17",
-		"@prosopo/types": "4.3.0",
+		"@prosopo/procaptcha-common": "2.10.19",
+		"@prosopo/types": "4.4.0",
 		"@prosopo/util": "3.2.15",
 		"@prosopo/util-crypto": "13.5.29",
 		"@prosopo/widget-skeleton": "2.8.3",

package/src/components/ProcaptchaPuzzle.tsx

@@ -0,0 +1,38 @@
+// Copyright 2021-2026 Prosopo (UK) Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import type { ProcaptchaProps } from "@prosopo/types";
+import { type LazyExoticComponent, Suspense, lazy } from "react";
+import type { ReactElement } from "react";
+
+// Define the function signature more precisely
+type ProcaptchaWidgetComponent = (
+	props: ProcaptchaProps,
+) => ReactElement | null;
+
+// Lazy load the widget with the correct type signature
+const ProcaptchaWidget: LazyExoticComponent<ProcaptchaWidgetComponent> = lazy(
+	async () => import("./ProcaptchaWidget.js"),
+);
+
+export const ProcaptchaPuzzle = (props: ProcaptchaProps) => (
+	<Suspense>
+		<ProcaptchaWidget
+			config={props.config}
+			callbacks={props.callbacks}
+			frictionlessState={props.frictionlessState}
+			i18n={props.i18n}
+		/>
+	</Suspense>
+);