@prosopo/procaptcha-react 2.9.95 → 2.9.97

package/dist/components/Modal.js

@@ -1,8 +1,9 @@
+import React from "react";
 import { jsx } from "@emotion/react/jsx-runtime";
 import { css } from "@emotion/react";
-import React from "react";
 import { createPortal } from "react-dom";
-const ModalInnerDivCSS = css`
+//#region src/components/Modal.tsx
+var ModalInnerDivCSS = css`
 	position: absolute;
 	top: 50%;
 	left: 50%;
@@ -22,23 +23,25 @@ const ModalInnerDivCSS = css`
 		transform: translate(-50%, -100%);
     }
 `;
-const ModalComponent = React.memo((props) => {
-  const { show, children } = props;
-  const display = show ? "flex" : "none";
-  const ModalOuterDivCss = {
-    position: "fixed",
-    zIndex: 2147483646,
-    inset: 0,
-    display,
-    alignItems: "center",
-    justifyContent: "center",
-    minHeight: "100vh"
-  };
-  return createPortal(
-    /* @__PURE__ */ jsx("div", { className: "prosopo-modalOuter", style: ModalOuterDivCss, children: /* @__PURE__ */ jsx("div", { className: "prosopo-modalInner", css: ModalInnerDivCSS, children }) }),
-    document.body
-  );
+var ModalComponent = React.memo((props) => {
+	const { show, children } = props;
+	return createPortal(/* @__PURE__ */ jsx("div", {
+		className: "prosopo-modalOuter",
+		style: {
+			position: "fixed",
+			zIndex: 2147483646,
+			inset: 0,
+			display: show ? "flex" : "none",
+			alignItems: "center",
+			justifyContent: "center",
+			minHeight: "100vh"
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			className: "prosopo-modalInner",
+			css: ModalInnerDivCSS,
+			children
+		})
+	}), document.body);
 });
-export {
-  ModalComponent as default
-};
+//#endregion
+export { ModalComponent as default };

package/dist/components/Procaptcha.js

@@ -1,7 +1,7 @@
+import { Suspense, lazy } from "react";
 import { jsx } from "@emotion/react/jsx-runtime";
-import { lazy, Suspense } from "react";
-const ProcaptchaWidget = lazy(async () => import("./ProcaptchaWidget.js"));
-const Procaptcha = (props) => /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(ProcaptchaWidget, { ...props }) });
-export {
-  Procaptcha as default
-};
+//#region src/components/Procaptcha.tsx
+var ProcaptchaWidget = lazy(async () => import("./ProcaptchaWidget.js"));
+var Procaptcha = (props) => /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(ProcaptchaWidget, { ...props }) });
+//#endregion
+export { Procaptcha as default };

package/dist/components/ProcaptchaWidget.js

@@ -1,165 +1,147 @@
-import { jsx, jsxs, Fragment } from "@emotion/react/jsx-runtime";
-import { useTranslation, loadI18next } from "@prosopo/locale";
-import { Manager } from "@prosopo/procaptcha";
-import { useProcaptcha, Honeypot, TestModeBanner, Checkbox } from "@prosopo/procaptcha-common";
-import { ProcaptchaConfigSchema } from "@prosopo/types";
-import { lightTheme, darkTheme } from "@prosopo/widget-skeleton";
-import { useState, useRef, useEffect } from "react";
+import "../_virtual/_rolldown/runtime.js";
 import CaptchaComponent from "./CaptchaComponent.js";
 import ModalComponent from "./Modal.js";
-const PROCAPTCHA_EXECUTE_EVENT = "procaptcha:execute";
-const ProcaptchaWidget = (props) => {
-  const { t, ready: isTranslationReady } = useTranslation();
-  const config = ProcaptchaConfigSchema.parse(props.config);
-  const frictionlessState = props.frictionlessState;
-  const i18n = props.i18n;
-  const callbacks = props.callbacks || {};
-  const [state, updateState] = useProcaptcha(useState, useRef);
-  const [loading, setLoading] = useState(false);
-  const hpRef = useRef(null);
-  const manager = useRef(
-    Manager(
-      config,
-      state,
-      updateState,
-      callbacks,
-      frictionlessState,
-      () => hpRef.current?.value || void 0
-    )
-  );
-  const lastCoordsRef = useRef(null);
-  const sessionInvalidatedFiredRef = useRef(false);
-  const theme = "light" === props.config.theme ? lightTheme : darkTheme;
-  useEffect(() => {
-    if (!config.language) return;
-    if (i18n) {
-      if (i18n.language !== config.language) {
-        void i18n.changeLanguage(config.language);
-      }
-      return;
-    }
-    void loadI18next(false, config.language);
-  }, [i18n, config.language]);
-  useEffect(() => {
-    if (!props.autoStart) return;
-    setLoading(true);
-    const coords = props.startCoords;
-    lastCoordsRef.current = coords ?? null;
-    manager.current.start(coords?.x ?? 0, coords?.y ?? 0).then(
-      () => setLoading(false),
-      () => setLoading(false)
-    );
-  }, [props.autoStart, props.startCoords]);
-  useEffect(() => {
-    if (!state.error) return;
-    setLoading(false);
-    if (state.error.key !== "CAPTCHA.NO_SESSION_FOUND") return;
-    if (props.onSessionInvalidated && !sessionInvalidatedFiredRef.current) {
-      sessionInvalidatedFiredRef.current = true;
-      const coords = lastCoordsRef.current;
-      props.onSessionInvalidated(coords?.x, coords?.y);
-      return;
-    }
-    if (frictionlessState) {
-      setTimeout(() => {
-        frictionlessState.restart();
-      }, 100);
-    }
-  }, [state.error, frictionlessState, props.onSessionInvalidated]);
-  useEffect(() => {
-    const handleExecuteEvent = (event) => {
-      updateState({
-        showModal: true
-      });
-      if (!state.challenge && manager.current.start) {
-        console.log("No challenge set, attempting to start verification");
-        try {
-          manager.current.start();
-        } catch (error) {
-          console.error("Error starting verification:", error);
-        }
-      }
-    };
-    document.addEventListener(PROCAPTCHA_EXECUTE_EVENT, handleExecuteEvent);
-    return () => {
-      document.removeEventListener(
-        PROCAPTCHA_EXECUTE_EVENT,
-        handleExecuteEvent
-      );
-    };
-  }, [state.challenge, updateState]);
-  const honeypot = frictionlessState?.hp ? /* @__PURE__ */ jsx(Honeypot, { ref: hpRef, encodedQuestion: frictionlessState.hp }) : null;
-  if (config.mode === "invisible") {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      honeypot,
-      /* @__PURE__ */ jsx(ModalComponent, { show: state.showModal, children: state.challenge ? /* @__PURE__ */ jsx(
-        CaptchaComponent,
-        {
-          challenge: state.challenge,
-          index: state.index,
-          solutions: state.solutions,
-          onSubmit: manager.current.submit,
-          onCancel: manager.current.cancel,
-          onClick: manager.current.select,
-          onNext: manager.current.nextRound,
-          onReload: manager.current.reload,
-          themeColor: config.theme ?? "light"
-        }
-      ) : null })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "image-captcha", children: [
-    honeypot,
-    /* @__PURE__ */ jsx(ModalComponent, { show: state.showModal, children: state.challenge ? /* @__PURE__ */ jsx(
-      CaptchaComponent,
-      {
-        challenge: state.challenge,
-        index: state.index,
-        solutions: state.solutions,
-        onSubmit: manager.current.submit,
-        onCancel: manager.current.cancel,
-        onClick: manager.current.select,
-        onNext: manager.current.nextRound,
-        onReload: manager.current.reload,
-        themeColor: config.theme ?? "light"
-      }
-    ) : /* @__PURE__ */ jsx("div", { children: "No challenge set." }) }),
-    /* @__PURE__ */ jsx(TestModeBanner, { siteKey: config.account.address ?? "" }),
-    /* @__PURE__ */ jsx(
-      Checkbox,
-      {
-        theme,
-        onChange: async (event) => {
-          if (!event.isTrusted) {
-            return;
-          }
-          if (loading) {
-            return;
-          }
-          setLoading(true);
-          let x = 0;
-          let y = 0;
-          const nativeEvent = event.nativeEvent;
-          if ("touches" in nativeEvent && nativeEvent.touches.length > 0 && nativeEvent.touches[0]) {
-            x = nativeEvent.touches[0].clientX;
-            y = nativeEvent.touches[0].clientY;
-          } else if ("clientX" in nativeEvent && "clientY" in nativeEvent) {
-            x = nativeEvent.clientX;
-            y = nativeEvent.clientY;
-          }
-          lastCoordsRef.current = { x, y };
-          await manager.current.start(x, y);
-          setLoading(false);
-        },
-        checked: state.isHuman,
-        labelText: isTranslationReady ? t("WIDGET.I_AM_HUMAN") : "",
-        error: state.error?.message,
-        "aria-label": "human checkbox",
-        loading
-      }
-    )
-  ] });
-};
-export {
-  ProcaptchaWidget as default
+import { darkTheme, lightTheme } from "@prosopo/widget-skeleton";
+import { useEffect, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "@emotion/react/jsx-runtime";
+import { loadI18next, useTranslation } from "@prosopo/locale";
+import { Checkbox, Honeypot, TestModeBanner, useProcaptcha } from "@prosopo/procaptcha-common";
+import { Manager } from "@prosopo/procaptcha";
+import { ProcaptchaConfigSchema } from "@prosopo/types";
+//#region src/components/ProcaptchaWidget.tsx
+/** @jsxImportSource @emotion/react */
+var PROCAPTCHA_EXECUTE_EVENT = "procaptcha:execute";
+var ProcaptchaWidget = (props) => {
+	const { t, ready: isTranslationReady } = useTranslation();
+	const config = ProcaptchaConfigSchema.parse(props.config);
+	const frictionlessState = props.frictionlessState;
+	const i18n = props.i18n;
+	const callbacks = props.callbacks || {};
+	const [state, updateState] = useProcaptcha(useState, useRef);
+	const [loading, setLoading] = useState(false);
+	const hpRef = useRef(null);
+	const manager = useRef(Manager(config, state, updateState, callbacks, frictionlessState, () => hpRef.current?.value || void 0));
+	const lastCoordsRef = useRef(null);
+	const sessionInvalidatedFiredRef = useRef(false);
+	const theme = "light" === props.config.theme ? lightTheme : darkTheme;
+	useEffect(() => {
+		if (!config.language) return;
+		if (i18n) {
+			if (i18n.language !== config.language) i18n.changeLanguage(config.language);
+			return;
+		}
+		loadI18next(false, config.language);
+	}, [i18n, config.language]);
+	useEffect(() => {
+		if (!props.autoStart) return;
+		setLoading(true);
+		const coords = props.startCoords;
+		lastCoordsRef.current = coords ?? null;
+		manager.current.start(coords?.x ?? 0, coords?.y ?? 0).then(() => setLoading(false), () => setLoading(false));
+	}, [props.autoStart, props.startCoords]);
+	useEffect(() => {
+		if (!state.error) return;
+		setLoading(false);
+		if (state.error.key !== "CAPTCHA.NO_SESSION_FOUND") return;
+		if (props.onSessionInvalidated && !sessionInvalidatedFiredRef.current) {
+			sessionInvalidatedFiredRef.current = true;
+			const coords = lastCoordsRef.current;
+			props.onSessionInvalidated(coords?.x, coords?.y);
+			return;
+		}
+		if (frictionlessState) setTimeout(() => {
+			frictionlessState.restart();
+		}, 100);
+	}, [
+		state.error,
+		frictionlessState,
+		props.onSessionInvalidated
+	]);
+	useEffect(() => {
+		const handleExecuteEvent = (event) => {
+			updateState({ showModal: true });
+			if (!state.challenge && manager.current.start) {
+				console.log("No challenge set, attempting to start verification");
+				try {
+					manager.current.start();
+				} catch (error) {
+					console.error("Error starting verification:", error);
+				}
+			}
+		};
+		document.addEventListener(PROCAPTCHA_EXECUTE_EVENT, handleExecuteEvent);
+		return () => {
+			document.removeEventListener(PROCAPTCHA_EXECUTE_EVENT, handleExecuteEvent);
+		};
+	}, [state.challenge, updateState]);
+	const honeypot = frictionlessState?.hp ? /* @__PURE__ */ jsx(Honeypot, {
+		ref: hpRef,
+		encodedQuestion: frictionlessState.hp
+	}) : null;
+	if (config.mode === "invisible") return /* @__PURE__ */ jsxs(Fragment, { children: [honeypot, /* @__PURE__ */ jsx(ModalComponent, {
+		show: state.showModal,
+		children: state.challenge ? /* @__PURE__ */ jsx(CaptchaComponent, {
+			challenge: state.challenge,
+			index: state.index,
+			solutions: state.solutions,
+			onSubmit: manager.current.submit,
+			onCancel: manager.current.cancel,
+			onClick: manager.current.select,
+			onNext: manager.current.nextRound,
+			onReload: manager.current.reload,
+			themeColor: config.theme ?? "light"
+		}) : null
+	})] });
+	return /* @__PURE__ */ jsxs("div", {
+		className: "image-captcha",
+		children: [
+			honeypot,
+			/* @__PURE__ */ jsx(ModalComponent, {
+				show: state.showModal,
+				children: state.challenge ? /* @__PURE__ */ jsx(CaptchaComponent, {
+					challenge: state.challenge,
+					index: state.index,
+					solutions: state.solutions,
+					onSubmit: manager.current.submit,
+					onCancel: manager.current.cancel,
+					onClick: manager.current.select,
+					onNext: manager.current.nextRound,
+					onReload: manager.current.reload,
+					themeColor: config.theme ?? "light"
+				}) : /* @__PURE__ */ jsx("div", { children: "No challenge set." })
+			}),
+			/* @__PURE__ */ jsx(TestModeBanner, { siteKey: config.account.address ?? "" }),
+			/* @__PURE__ */ jsx(Checkbox, {
+				theme,
+				onChange: async (event) => {
+					if (!event.isTrusted) return;
+					if (loading) return;
+					setLoading(true);
+					let x = 0;
+					let y = 0;
+					const nativeEvent = event.nativeEvent;
+					if ("touches" in nativeEvent && nativeEvent.touches.length > 0 && nativeEvent.touches[0]) {
+						x = nativeEvent.touches[0].clientX;
+						y = nativeEvent.touches[0].clientY;
+					} else if ("clientX" in nativeEvent && "clientY" in nativeEvent) {
+						x = nativeEvent.clientX;
+						y = nativeEvent.clientY;
+					}
+					lastCoordsRef.current = {
+						x,
+						y
+					};
+					await manager.current.start(x, y);
+					setLoading(false);
+				},
+				checked: state.isHuman,
+				labelText: isTranslationReady ? t("WIDGET.I_AM_HUMAN") : "",
+				error: state.error?.message,
+				"aria-label": "human checkbox",
+				loading
+			})
+		]
+	});
 };
+//#endregion
+export { ProcaptchaWidget as default };

package/dist/components/index.js

@@ -1,9 +1,4 @@
 import { CaptchaWidget } from "./CaptchaWidget.js";
-import "./CaptchaComponent.js";
-import { default as default2 } from "./ProcaptchaWidget.js";
-import { default as default3 } from "./Procaptcha.js";
-export {
-  CaptchaWidget,
-  default3 as Procaptcha,
-  default2 as ProcaptchaWidget
-};
+import ProcaptchaWidget from "./ProcaptchaWidget.js";
+import Procaptcha from "./Procaptcha.js";
+export { CaptchaWidget, Procaptcha, ProcaptchaWidget };

package/dist/index.js

@@ -1,10 +1,5 @@
-import "./components/index.js";
-import "./util/index.js";
-import { default as default2 } from "./components/ProcaptchaWidget.js";
-import { default as default3 } from "./components/Procaptcha.js";
+import "./_virtual/_rolldown/runtime.js";
 import { CaptchaWidget } from "./components/CaptchaWidget.js";
-export {
-  CaptchaWidget,
-  default3 as Procaptcha,
-  default2 as ProcaptchaWidget
-};
+import ProcaptchaWidget from "./components/ProcaptchaWidget.js";
+import Procaptcha from "./components/Procaptcha.js";
+export { CaptchaWidget, Procaptcha, ProcaptchaWidget };

package/dist/util/index.js

@@ -1,19 +1,20 @@
+//#region src/util/index.ts
 function renameKeysForDataAttr(data = {}) {
-  return Object.keys(data).reduce(
-    // biome-ignore lint/performance/noAccumulatingSpread: TODO fix
-    (prev, curr) => ({ ...prev, [`data-${curr}`]: data[curr] }),
-    {}
-  );
+	return Object.keys(data).reduce((prev, curr) => ({
+		...prev,
+		[`data-${curr}`]: data[curr]
+	}), {});
 }
-function addDataAttr({
-  general,
-  dev
-}) {
-  return {
-    ...renameKeysForDataAttr(general),
-    ...process.env.NODE_ENV !== "production" ? renameKeysForDataAttr(dev) : {}
-  };
+/**
+* maps any data to data attributes (mapped to { data-[key]: value })
+*
+* dev - only in development mode
+*/
+function addDataAttr({ general, dev }) {
+	return {
+		...renameKeysForDataAttr(general),
+		...process.env.NODE_ENV !== "production" ? renameKeysForDataAttr(dev) : {}
+	};
 }
-export {
-  addDataAttr as default
-};
+//#endregion
+export { addDataAttr as default };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@prosopo/procaptcha-react",
-	"version": "2.9.95",
+	"version": "2.9.97",
 	"author": "PROSOPO LIMITED <info@prosopo.io>",
 	"license": "Apache-2.0",
 	"main": "dist/index.js",
@@ -29,31 +29,31 @@
 	},
 	"browserslist": ["> 0.5%, last 2 versions, not dead"],
 	"dependencies": {
-		"@prosopo/common": "3.1.47",
-		"@prosopo/locale": "3.2.7",
-		"@prosopo/procaptcha": "2.10.56",
-		"@prosopo/procaptcha-common": "2.11.16",
-		"@prosopo/types": "4.9.11",
-		"@prosopo/util": "3.3.4",
+		"@prosopo/common": "3.1.48",
+		"@prosopo/locale": "3.2.8",
+		"@prosopo/procaptcha": "2.10.58",
+		"@prosopo/procaptcha-common": "2.11.18",
+		"@prosopo/types": "4.10.0",
+		"@prosopo/util": "3.3.5",
 		"@prosopo/widget-skeleton": "2.8.4",
 		"csstype": "3.1.3",
 		"react": "18.3.1",
 		"react-dom": "18.3.1"
 	},
 	"devDependencies": {
-		"@prosopo/config": "3.3.4",
+		"@prosopo/config": "3.3.5",
 		"@emotion/react": "11.11.1",
 		"@types/node": "22.10.2",
 		"@types/react-dom": "18.3.1",
-		"@vitest/coverage-v8": "3.2.4",
+		"@vitest/coverage-v8": "4.1.10",
 		"concurrently": "9.0.1",
 		"del-cli": "6.0.0",
 		"npm-run-all": "4.1.5",
 		"tslib": "2.7.0",
 		"tsx": "4.20.3",
 		"typescript": "5.6.2",
-		"vite": "6.4.1",
-		"vitest": "3.2.4"
+		"vite": "8.1.5",
+		"vitest": "4.1.10"
 	},
 	"repository": {
 		"type": "git",