@prosopo/procaptcha-frictionless 0.3.2 → 0.3.3

package/dist/ProcaptchaFrictionless.d.ts

@@ -1,3 +1,3 @@
-import { ProcaptchaProps } from '@prosopo/procaptcha-pow';
+import { ProcaptchaProps } from '@prosopo/types';
 export declare const ProcaptchaFrictionless: ({ config, callbacks }: ProcaptchaProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ProcaptchaFrictionless.d.ts.map

package/dist/ProcaptchaFrictionless.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProcaptchaFrictionless.d.ts","sourceRoot":"","sources":["../src/ProcaptchaFrictionless.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAiB,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAIxE,eAAO,MAAM,sBAAsB,0BAA2B,eAAe,4CAmB5E,CAAA"}
+{"version":3,"file":"ProcaptchaFrictionless.d.ts","sourceRoot":"","sources":["../src/ProcaptchaFrictionless.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAIhD,eAAO,MAAM,sBAAsB,0BAA2B,eAAe,4CAmB5E,CAAA"}

package/dist/ProcaptchaFrictionless.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProcaptchaFrictionless.js","sourceRoot":"","sources":["../src/ProcaptchaFrictionless.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAmB,MAAM,yBAAyB,CAAA;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAA;AAC1C,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAmB,EAAE,EAAE;IAE7E,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAC,qBAAqB,IAAC,QAAQ,EAAE,MAAM,CAAC,KAAK,GAAI,CAAC,CAAA;IAE7G,SAAS,CAAC,GAAG,EAAE;QACX,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE;YACzB,MAAM,IAAI,GAAG,MAAM,IAAI,EAAE,CAAA;YACzB,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;YAC5B,IAAI,MAAM,CAAC,GAAG,EAAE;gBACZ,oBAAoB,CAAC,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC,CAAA;aAC7E;iBAAM;gBACH,oBAAoB,CAAC,KAAC,aAAa,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC,CAAA;aAChF;QACL,CAAC,CAAA;QAED,SAAS,EAAE,CAAA;IACf,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAA;IAEvB,OAAO,iBAAiB,CAAA;AAC5B,CAAC,CAAA"}
+{"version":3,"file":"ProcaptchaFrictionless.js","sourceRoot":"","sources":["../src/ProcaptchaFrictionless.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAEvD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAA;AAC1C,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAmB,EAAE,EAAE;IAE7E,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAC,qBAAqB,IAAC,QAAQ,EAAE,MAAM,CAAC,KAAK,GAAI,CAAC,CAAA;IAE7G,SAAS,CAAC,GAAG,EAAE;QACX,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE;YACzB,MAAM,IAAI,GAAG,MAAM,IAAI,EAAE,CAAA;YACzB,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;YAC5B,IAAI,MAAM,CAAC,GAAG,EAAE;gBACZ,oBAAoB,CAAC,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC,CAAA;aAC7E;iBAAM;gBACH,oBAAoB,CAAC,KAAC,aAAa,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC,CAAA;aAChF;QACL,CAAC,CAAA;QAED,SAAS,EAAE,CAAA;IACf,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAA;IAEvB,OAAO,iBAAiB,CAAA;AAC5B,CAAC,CAAA"}

package/dist/cjs/procaptcha-pow/dist/Services/Manager.cjs

@@ -1,29 +1,47 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const types = require("@prosopo/types");
 const Api = require("@polkadot/api/promise/Api");
 require("../../../account/dist/index.cjs");
 const keyring = require("@polkadot/keyring");
-const types = require("@prosopo/types");
 const contract = require("@prosopo/contract");
 const common = require("@prosopo/common");
 const api = require("@prosopo/api");
 const ws = require("@polkadot/rpc-provider/ws");
 const contractInfo = require("@prosopo/captcha-contract/contract-info");
+const procaptchaCommon = require("@prosopo/procaptcha-common");
+const procaptcha = require("@prosopo/procaptcha");
 const SolverService = require("./SolverService.cjs");
 const ExtensionWeb2 = require("../../../account/dist/extension/ExtensionWeb2.cjs");
-const Manager = async (configInput) => {
+const Manager = (configInput, state, onStateUpdate, callbacks) => {
+  const defaultState = () => {
+    return {
+      showModal: false,
+      loading: false,
+      index: 0,
+      challenge: void 0,
+      solutions: void 0,
+      isHuman: false,
+      captchaApi: void 0,
+      account: void 0
+    };
+  };
+  const clearTimeout = () => {
+    window.clearTimeout(state.timeout);
+    updateState({ timeout: void 0 });
+  };
   const getConfig = () => {
-    const config2 = {
+    const config = {
       userAccountAddress: "",
       ...configInput
     };
-    return types.ProcaptchaConfigSchema.parse(config2);
+    return types.ProcaptchaConfigSchema.parse(config);
   };
-  const getNetwork = (config2) => {
-    const network = config2.networks[config2.defaultNetwork];
+  const getNetwork = (config) => {
+    const network = config.networks[config.defaultNetwork];
     if (!network) {
       throw new common.ProsopoEnvError("DEVELOPER.NETWORK_NOT_FOUND", {
-        context: { error: `No network found for environment ${config2.defaultEnvironment}` }
+        context: { error: `No network found for environment ${config.defaultEnvironment}` }
       });
     }
     return network;
@@ -35,25 +53,71 @@ const Manager = async (configInput) => {
     const keyring$1 = new keyring.Keyring({ type, ss58Format: api2.registry.chainSS58 });
     return new contract.ProsopoCaptchaContract(api2, JSON.parse(contractInfo.ContractAbi), network.contract.address, "prosopo", 0, keyring$1.addFromAddress(getConfig().account.address || ""));
   };
-  const config = getConfig();
-  if (!config.web2 && !config.userAccountAddress) {
-    throw new common.ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
-      context: { error: "Account address has not been set for web3 mode" }
-    });
-  }
-  const ext = new ExtensionWeb2.ExtensionWeb2();
-  const account = await ext.getAccount(config);
-  const contract$1 = await loadContract();
-  const getRandomProviderResponse = await contract.wrapQuery(contract$1.query.getRandomActiveProvider, contract$1.query)(account.account.address, configInput.account.address || "");
-  const providerUrl = common.trimProviderUrl(getRandomProviderResponse.provider.url.toString());
-  const providerApi = new api.ProviderApi(getNetwork(getConfig()), providerUrl, configInput.account.address || "");
-  const challenge = await providerApi.getPowCaptchaChallenge(account.account.address, configInput.account.address || "");
-  console.log("challenge", challenge);
-  console.log("challenge", challenge.challenge);
-  console.log("challenge", challenge.difficulty);
-  const solution = SolverService.solvePoW(challenge.challenge, challenge.difficulty);
-  console.log("solution", solution);
-  const verifiedSolution = await providerApi.submitPowCaptchaSolution(challenge, account.account.address, configInput.account.address || "", getRandomProviderResponse, solution);
-  return verifiedSolution;
+  const getAccount = () => {
+    if (!state.account) {
+      throw new common.ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", { context: { error: "Account not loaded" } });
+    }
+    const account = state.account;
+    return account;
+  };
+  const getDappAccount = () => {
+    if (!state.dappAccount) {
+      throw new common.ProsopoEnvError("GENERAL.SITE_KEY_MISSING");
+    }
+    const dappAccount = state.dappAccount;
+    return dappAccount;
+  };
+  const getBlockNumber = () => {
+    if (!state.blockNumber) {
+      throw new common.ProsopoContractError("CAPTCHA.INVALID_BLOCK_NO", { context: { error: "Block number not found" } });
+    }
+    const blockNumber = state.blockNumber;
+    return blockNumber;
+  };
+  const updateState = procaptchaCommon.buildUpdateState(state, onStateUpdate);
+  const resetState = () => {
+    clearTimeout();
+    updateState(defaultState());
+  };
+  const start = async () => {
+    if (state.loading) {
+      return;
+    }
+    if (state.isHuman) {
+      return;
+    }
+    resetState();
+    updateState({ loading: true });
+    const config = getConfig();
+    updateState({ dappAccount: config.account.address });
+    await procaptcha.sleep(100);
+    if (!config.web2 && !config.userAccountAddress) {
+      throw new common.ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", {
+        context: { error: "Account address has not been set for web3 mode" }
+      });
+    }
+    const ext = new ExtensionWeb2.ExtensionWeb2();
+    const account = await ext.getAccount(config);
+    const contract$1 = await loadContract();
+    const events = procaptchaCommon.getDefaultEvents(onStateUpdate, state, callbacks);
+    const getRandomProviderResponse = await contract.wrapQuery(contract$1.query.getRandomActiveProvider, contract$1.query)(account.account.address, getDappAccount());
+    const providerUrl = common.trimProviderUrl(getRandomProviderResponse.provider.url.toString());
+    const providerApi = new api.ProviderApi(getNetwork(getConfig()), providerUrl, getDappAccount());
+    const challenge = await providerApi.getPowCaptchaChallenge(account.account.address, getDappAccount());
+    const solution = SolverService.solvePoW(challenge.challenge, challenge.difficulty);
+    await providerApi.submitPowCaptchaSolution(challenge, getAccount().account.address, getDappAccount(), getRandomProviderResponse, solution);
+    if (state.isHuman) {
+      events.onHuman({
+        providerUrl,
+        [types.ApiParams.user]: getAccount().account.address,
+        [types.ApiParams.dapp]: getDappAccount(),
+        [types.ApiParams.challengeId]: challenge.challenge,
+        [types.ApiParams.blockNumber]: getBlockNumber()
+      });
+    }
+  };
+  return {
+    start
+  };
 };
 exports.Manager = Manager;

package/dist/cjs/procaptcha-pow/dist/components/Captcha.cjs

@@ -2,6 +2,7 @@
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 require("../../../web-components/dist/index.cjs");
 const Manager = require("../Services/Manager.cjs");
+const procaptchaCommon = require("@prosopo/procaptcha-common");
 const react = require("react");
 const theme = require("../../../web-components/dist/theme.cjs");
 const Containers = require("../../../web-components/dist/Containers.cjs");
@@ -10,21 +11,13 @@ const LoadingSpinner = require("../../../web-components/dist/LoadingSpinner.cjs"
 const Checkbox = require("../../../web-components/dist/Checkbox.cjs");
 const Logo = require("../../../web-components/dist/Logo.cjs");
 const Procaptcha = (props) => {
-  const [checked, setChecked] = react.useState(false);
-  const [loading, setLoading] = react.useState(false);
-  const darkMode = props.config.theme;
-  const themeColor = darkMode ? "light" : "dark";
-  const theme$1 = react.useMemo(() => darkMode === "light" ? theme.lightTheme : theme.darkTheme, [darkMode]);
-  const handlePowCaptcha = async () => {
-    setLoading(true);
-    Manager.Manager(props.config).then((verified) => {
-      if (verified.verified) {
-        console.log("verified");
-        setChecked(true);
-      }
-      setLoading(false);
-    });
-  };
+  const config = props.config;
+  const themeColor = config.theme === "light" ? "light" : "dark";
+  const theme$1 = props.config.theme === "light" ? theme.lightTheme : theme.darkTheme;
+  const callbacks = props.callbacks || {};
+  const [state, _updateState] = procaptchaCommon.useProcaptcha(react.useState, react.useRef);
+  const updateState = procaptchaCommon.buildUpdateState(state, _updateState);
+  const manager = Manager.Manager(config, state, updateState, callbacks);
   return jsxRuntime.jsx("div", { children: jsxRuntime.jsx("div", { style: { maxWidth: "100%", maxHeight: "100%", overflowX: "auto" }, children: jsxRuntime.jsx(Containers.ContainerDiv, { children: jsxRuntime.jsx(Containers.WidthBasedStylesDiv, { children: jsxRuntime.jsxs("div", { style: WidgetConstants.WIDGET_DIMENSIONS, "data-cy": "button-human", children: [" ", jsxRuntime.jsxs("div", { style: {
     padding: "2px",
     border: "1px solid",
@@ -50,6 +43,6 @@ const Procaptcha = (props) => {
     verticalAlign: "middle"
   }, children: jsxRuntime.jsx("div", { style: {
     display: "flex"
-  }, children: jsxRuntime.jsx("div", { style: { flex: 1 }, children: loading ? jsxRuntime.jsx(LoadingSpinner.LoadingSpinner, { themeColor }) : jsxRuntime.jsx(Checkbox.Checkbox, { checked, onChange: handlePowCaptcha, themeColor, labelText: "I am human" }) }) }) }) }) }), jsxRuntime.jsx("div", { style: { display: "inline-flex", flexDirection: "column" }, children: jsxRuntime.jsx("a", { href: WidgetConstants.WIDGET_URL, target: "_blank", "aria-label": WidgetConstants.WIDGET_URL_TEXT, children: jsxRuntime.jsx("div", { style: { flex: 1 }, children: jsxRuntime.jsx(Logo, { themeColor }) }) }) })] })] }) }) }) }) });
+  }, children: jsxRuntime.jsx("div", { style: { flex: 1 }, children: state.loading ? jsxRuntime.jsx(LoadingSpinner.LoadingSpinner, { themeColor }) : jsxRuntime.jsx(Checkbox.Checkbox, { checked: state.isHuman, onChange: manager.start, themeColor, labelText: "I am human" }) }) }) }) }) }), jsxRuntime.jsx("div", { style: { display: "inline-flex", flexDirection: "column" }, children: jsxRuntime.jsx("a", { href: WidgetConstants.WIDGET_URL, target: "_blank", "aria-label": WidgetConstants.WIDGET_URL_TEXT, children: jsxRuntime.jsx("div", { style: { flex: 1 }, children: jsxRuntime.jsx(Logo, { themeColor }) }) }) })] })] }) }) }) }) });
 };
 module.exports = Procaptcha;

package/dist/cjs/procaptcha-pow/dist/components/ProcaptchaPoW.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-require("../../../web-components/dist/index.cjs");
 const react = require("react");
+require("../../../web-components/dist/index.cjs");
 const CaptchaPlaceholder = require("../../../web-components/dist/CaptchaPlaceholder.cjs");
 const _interopNamespaceDefaultOnly = (e) => Object.freeze(Object.defineProperty({ __proto__: null, default: e }, Symbol.toStringTag, { value: "Module" }));
 const ProcaptchaWidget = react.lazy(async () => Promise.resolve().then(() => /* @__PURE__ */ _interopNamespaceDefaultOnly(require("./Captcha.cjs"))));

package/dist/cjs/web-components/dist/CaptchaPlaceholder.cjs

@@ -5,12 +5,10 @@ const Containers = require("./Containers.cjs");
 const LoadingSpinner = require("./LoadingSpinner.cjs");
 const WidgetConstants = require("./WidgetConstants.cjs");
 const theme = require("./theme.cjs");
-const react = require("react");
 const Logo = require("./Logo.cjs");
 const ProcaptchaPlaceholder = (props) => {
-  const darkMode = props.darkMode;
   const themeColor = props.darkMode === "light" ? "light" : "dark";
-  const theme$1 = react.useMemo(() => darkMode === "light" ? theme.lightTheme : theme.darkTheme, [darkMode]);
+  const theme$1 = props.darkMode === "light" ? theme.lightTheme : theme.darkTheme;
   return jsxRuntime.jsx("div", { children: jsxRuntime.jsx("div", { style: { maxWidth: "100%", maxHeight: "100%", overflowX: "auto" }, children: jsxRuntime.jsx(Containers.ContainerDiv, { children: jsxRuntime.jsx(Containers.WidthBasedStylesDiv, { children: jsxRuntime.jsxs("div", { style: WidgetConstants.WIDGET_DIMENSIONS, "data-cy": "button-human", children: [" ", jsxRuntime.jsxs("div", { style: {
     padding: "2px",
     border: "1px solid",

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@prosopo/procaptcha-frictionless",
-    "version": "0.3.2",
+    "version": "0.3.3",
     "author": "PROSOPO LIMITED <info@prosopo.io>",
     "license": "Apache-2.0",
     "main": "./dist/index.js",
@@ -34,9 +34,9 @@
     ],
     "dependencies": {
         "@fingerprintjs/botd": "^1.9.0",
-        "@prosopo/procaptcha-pow": "0.3.2",
-        "@prosopo/procaptcha-react": "0.3.2",
-        "@prosopo/web-components": "0.3.2",
+        "@prosopo/procaptcha-pow": "0.3.3",
+        "@prosopo/procaptcha-react": "0.3.3",
+        "@prosopo/web-components": "0.3.3",
         "react": "^18.2.0"
     },
     "devDependencies": {