@captchafox/react 1.6.0 → 1.7.0

package/dist/index.cjs

@@ -52,13 +52,20 @@ var __async = (__this, __arguments, generator) => {
 var src_exports = {};
 __export(src_exports, {
   CAPTCHA_RESPONSE_KEY: () => CAPTCHA_RESPONSE_KEY,
-  CaptchaFox: () => CaptchaFox
+  CaptchaFox: () => CaptchaFox,
+  RetryError: () => RetryError,
+  TimeoutError: () => TimeoutError
 });
 module.exports = __toCommonJS(src_exports);
 
 // ../internal/dist/index.mjs
+var RetryError = class extends Error {
+};
+var TimeoutError = class extends Error {
+};
 var backoff = (retryCount) => Math.exp(retryCount) * 150;
 var withRetry = (_0, ..._1) => __async(void 0, [_0, ..._1], function* (callback, { attempts = 4 } = {}) {
+  var _a;
   let error;
   for (let i = 0; i < attempts; i++) {
     try {
@@ -68,7 +75,7 @@ var withRetry = (_0, ..._1) => __async(void 0, [_0, ..._1], function* (callback,
       yield new Promise((r) => setTimeout(r, backoff(i)));
     }
   }
-  throw error != null ? error : new Error("Exhausted all retries");
+  throw new RetryError((_a = error == null ? void 0 : error.message) != null ? _a : "Exhausted all retries");
 });
 var mountInstance;
 var LOAD_FUNC_KEY = "captchaFoxOnLoad";
@@ -108,6 +115,7 @@ var isApiReady = () => typeof (window == null ? void 0 : window.captchafox) !==
 var import_react = __toESM(require("react"), 1);
 var CaptchaFox = (0, import_react.forwardRef)(
   ({
+    executeTimeoutSeconds = 30,
     sitekey,
     lang,
     mode,
@@ -124,6 +132,8 @@ var CaptchaFox = (0, import_react.forwardRef)(
     const [containerRef, setContainerRef] = (0, import_react.useState)();
     const [widgetId, setWidgetId] = (0, import_react.useState)();
     const firstRendered = (0, import_react.useRef)(false);
+    const onReady = (0, import_react.useRef)();
+    const executeTimeout = (0, import_react.useRef)();
     (0, import_react.useImperativeHandle)(
       ref,
       () => {
@@ -152,7 +162,7 @@ var CaptchaFox = (0, import_react.forwardRef)(
           },
           execute: () => {
             if (!isApiReady() || !widgetId) {
-              return Promise.reject("[CaptchaFox] Widget has not been loaded");
+              return waitAndExecute();
             }
             return window.captchafox.execute(widgetId);
           }
@@ -165,23 +175,9 @@ var CaptchaFox = (0, import_react.forwardRef)(
         onLoad == null ? void 0 : onLoad();
       }
     }, [widgetId]);
-    const renderCaptcha = () => __async(void 0, null, function* () {
-      var _a, _b, _c;
-      (_a = window.captchafox) == null ? void 0 : _a.remove(widgetId);
-      if (!containerRef || ((_b = containerRef == null ? void 0 : containerRef.children) == null ? void 0 : _b.length) === 1) return;
-      const newWidgetId = yield (_c = window.captchafox) == null ? void 0 : _c.render(containerRef, {
-        lang,
-        sitekey,
-        mode,
-        theme,
-        i18n,
-        onError,
-        onFail,
-        onClose,
-        onVerify
-      });
-      setWidgetId(newWidgetId);
-    });
+    (0, import_react.useEffect)(() => {
+      return () => clearTimeout(executeTimeout.current);
+    }, []);
     (0, import_react.useEffect)(() => {
       if (!containerRef) return;
       if (firstRendered.current) {
@@ -200,6 +196,41 @@ var CaptchaFox = (0, import_react.forwardRef)(
         });
       }
     }, [containerRef, sitekey, lang, mode]);
+    const waitAndExecute = () => {
+      return new Promise((resolve, reject) => {
+        executeTimeout.current = setTimeout(() => {
+          reject(new TimeoutError("Execute timed out"));
+        }, executeTimeoutSeconds * 1e3);
+        onReady.current = (id) => {
+          clearTimeout(executeTimeout.current);
+          window.captchafox.execute(id).then(resolve).catch(reject);
+        };
+      });
+    };
+    const renderCaptcha = () => __async(void 0, null, function* () {
+      var _a, _b, _c;
+      (_a = window.captchafox) == null ? void 0 : _a.remove(widgetId);
+      if (!containerRef || ((_b = containerRef == null ? void 0 : containerRef.children) == null ? void 0 : _b.length) === 1) return;
+      const newWidgetId = yield (_c = window.captchafox) == null ? void 0 : _c.render(containerRef, {
+        lang,
+        sitekey,
+        mode,
+        theme,
+        i18n,
+        onError,
+        onFail,
+        onClose,
+        onVerify
+      });
+      if (!newWidgetId) {
+        return;
+      }
+      setWidgetId(newWidgetId);
+      if (onReady.current) {
+        onReady.current(newWidgetId);
+        onReady.current = void 0;
+      }
+    });
     return /* @__PURE__ */ import_react.default.createElement("div", { ref: setContainerRef, id: widgetId, className });
   }
 );
@@ -210,5 +241,7 @@ var CAPTCHA_RESPONSE_KEY = "cf-captcha-response";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   CAPTCHA_RESPONSE_KEY,
-  CaptchaFox
+  CaptchaFox,
+  RetryError,
+  TimeoutError
 });

package/dist/index.d.cts

@@ -1,14 +1,20 @@
 import { WidgetApi, WidgetOptions } from '@captchafox/types';
 import React from 'react';
 
+declare class RetryError extends Error {
+}
+declare class TimeoutError extends Error {
+}
+
 type CaptchaFoxInstance = Omit<WidgetApi, 'render'>;
 declare const CaptchaFox: React.ForwardRefExoticComponent<WidgetOptions & {
     /** Called after the widget has been loaded */
     onLoad?: (() => void) | undefined;
     className?: string | undefined;
     nonce?: string | undefined;
+    executeTimeoutSeconds?: number | undefined;
 } & React.RefAttributes<CaptchaFoxInstance>>;
 
 declare const CAPTCHA_RESPONSE_KEY = "cf-captcha-response";
 
-export { CAPTCHA_RESPONSE_KEY, CaptchaFox, type CaptchaFoxInstance };
+export { CAPTCHA_RESPONSE_KEY, CaptchaFox, type CaptchaFoxInstance, RetryError, TimeoutError };

package/dist/index.d.ts

@@ -1,14 +1,20 @@
 import { WidgetApi, WidgetOptions } from '@captchafox/types';
 import React from 'react';
 
+declare class RetryError extends Error {
+}
+declare class TimeoutError extends Error {
+}
+
 type CaptchaFoxInstance = Omit<WidgetApi, 'render'>;
 declare const CaptchaFox: React.ForwardRefExoticComponent<WidgetOptions & {
     /** Called after the widget has been loaded */
     onLoad?: (() => void) | undefined;
     className?: string | undefined;
     nonce?: string | undefined;
+    executeTimeoutSeconds?: number | undefined;
 } & React.RefAttributes<CaptchaFoxInstance>>;
 
 declare const CAPTCHA_RESPONSE_KEY = "cf-captcha-response";
 
-export { CAPTCHA_RESPONSE_KEY, CaptchaFox, type CaptchaFoxInstance };
+export { CAPTCHA_RESPONSE_KEY, CaptchaFox, type CaptchaFoxInstance, RetryError, TimeoutError };

package/dist/index.js

@@ -21,8 +21,13 @@ var __async = (__this, __arguments, generator) => {
 };
 
 // ../internal/dist/index.mjs
+var RetryError = class extends Error {
+};
+var TimeoutError = class extends Error {
+};
 var backoff = (retryCount) => Math.exp(retryCount) * 150;
 var withRetry = (_0, ..._1) => __async(void 0, [_0, ..._1], function* (callback, { attempts = 4 } = {}) {
+  var _a;
   let error;
   for (let i = 0; i < attempts; i++) {
     try {
@@ -32,7 +37,7 @@ var withRetry = (_0, ..._1) => __async(void 0, [_0, ..._1], function* (callback,
       yield new Promise((r) => setTimeout(r, backoff(i)));
     }
   }
-  throw error != null ? error : new Error("Exhausted all retries");
+  throw new RetryError((_a = error == null ? void 0 : error.message) != null ? _a : "Exhausted all retries");
 });
 var mountInstance;
 var LOAD_FUNC_KEY = "captchaFoxOnLoad";
@@ -72,6 +77,7 @@ var isApiReady = () => typeof (window == null ? void 0 : window.captchafox) !==
 import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
 var CaptchaFox = forwardRef(
   ({
+    executeTimeoutSeconds = 30,
     sitekey,
     lang,
     mode,
@@ -88,6 +94,8 @@ var CaptchaFox = forwardRef(
     const [containerRef, setContainerRef] = useState();
     const [widgetId, setWidgetId] = useState();
     const firstRendered = useRef(false);
+    const onReady = useRef();
+    const executeTimeout = useRef();
     useImperativeHandle(
       ref,
       () => {
@@ -116,7 +124,7 @@ var CaptchaFox = forwardRef(
           },
           execute: () => {
             if (!isApiReady() || !widgetId) {
-              return Promise.reject("[CaptchaFox] Widget has not been loaded");
+              return waitAndExecute();
             }
             return window.captchafox.execute(widgetId);
           }
@@ -129,23 +137,9 @@ var CaptchaFox = forwardRef(
         onLoad == null ? void 0 : onLoad();
       }
     }, [widgetId]);
-    const renderCaptcha = () => __async(void 0, null, function* () {
-      var _a, _b, _c;
-      (_a = window.captchafox) == null ? void 0 : _a.remove(widgetId);
-      if (!containerRef || ((_b = containerRef == null ? void 0 : containerRef.children) == null ? void 0 : _b.length) === 1) return;
-      const newWidgetId = yield (_c = window.captchafox) == null ? void 0 : _c.render(containerRef, {
-        lang,
-        sitekey,
-        mode,
-        theme,
-        i18n,
-        onError,
-        onFail,
-        onClose,
-        onVerify
-      });
-      setWidgetId(newWidgetId);
-    });
+    useEffect(() => {
+      return () => clearTimeout(executeTimeout.current);
+    }, []);
     useEffect(() => {
       if (!containerRef) return;
       if (firstRendered.current) {
@@ -164,6 +158,41 @@ var CaptchaFox = forwardRef(
         });
       }
     }, [containerRef, sitekey, lang, mode]);
+    const waitAndExecute = () => {
+      return new Promise((resolve, reject) => {
+        executeTimeout.current = setTimeout(() => {
+          reject(new TimeoutError("Execute timed out"));
+        }, executeTimeoutSeconds * 1e3);
+        onReady.current = (id) => {
+          clearTimeout(executeTimeout.current);
+          window.captchafox.execute(id).then(resolve).catch(reject);
+        };
+      });
+    };
+    const renderCaptcha = () => __async(void 0, null, function* () {
+      var _a, _b, _c;
+      (_a = window.captchafox) == null ? void 0 : _a.remove(widgetId);
+      if (!containerRef || ((_b = containerRef == null ? void 0 : containerRef.children) == null ? void 0 : _b.length) === 1) return;
+      const newWidgetId = yield (_c = window.captchafox) == null ? void 0 : _c.render(containerRef, {
+        lang,
+        sitekey,
+        mode,
+        theme,
+        i18n,
+        onError,
+        onFail,
+        onClose,
+        onVerify
+      });
+      if (!newWidgetId) {
+        return;
+      }
+      setWidgetId(newWidgetId);
+      if (onReady.current) {
+        onReady.current(newWidgetId);
+        onReady.current = void 0;
+      }
+    });
     return /* @__PURE__ */ React.createElement("div", { ref: setContainerRef, id: widgetId, className });
   }
 );
@@ -173,5 +202,7 @@ CaptchaFox.displayName = "CaptchaFox";
 var CAPTCHA_RESPONSE_KEY = "cf-captcha-response";
 export {
   CAPTCHA_RESPONSE_KEY,
-  CaptchaFox
+  CaptchaFox,
+  RetryError,
+  TimeoutError
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@captchafox/react",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",