@prosopo/procaptcha-puzzle 2.14.7 → 2.15.0

package/package.json

@@ -1,72 +1,73 @@
 {
-	"name": "@prosopo/procaptcha-puzzle",
-	"version": "2.14.7",
-	"author": "PROSOPO LIMITED <info@prosopo.io>",
-	"license": "Apache-2.0",
-	"main": "dist/index.js",
-	"type": "module",
-	"sideEffects": false,
-	"engines": {
-		"node": "^24",
-		"npm": "^11"
-	},
-	"exports": {
-		".": {
-			"types": "./dist/index.d.ts",
-			"import": "./dist/index.js",
-			"require": "./dist/cjs/index.cjs"
-		}
-	},
-	"types": "dist/index.d.ts",
-	"source": "./src/index.ts",
-	"scripts": {
-		"clean": "del-cli --verbose dist tsconfig.tsbuildinfo",
-		"build": "npm run build:cross-env -- --mode ${NODE_ENV:-development}",
-		"build:cross-env": "vite build --config vite.esm.config.ts",
-		"build:tsc": "tsc --build --verbose",
-		"build:cjs": "NODE_ENV=${NODE_ENV:-development}; vite build --config vite.cjs.config.ts --mode $NODE_ENV",
-		"typecheck": "tsc --project tsconfig.types.json",
-		"test": "NODE_ENV=${NODE_ENV:-test}; npx vitest run --config ./vite.test.config.ts",
-		"test:watch": "NODE_ENV=${NODE_ENV:-test}; npx vitest --config ./vite.test.config.ts",
-		"test:coverage": "NODE_ENV=${NODE_ENV:-test}; npx vitest run --coverage --config ./vite.test.config.ts"
-	},
-	"browserslist": ["> 0.5%, last 2 versions, not dead"],
-	"dependencies": {
-		"@polkadot/util": "14.0.3",
-		"@prosopo/api": "4.3.8",
-		"@prosopo/common": "3.1.61",
-		"@prosopo/locale": "3.6.2",
-		"@prosopo/procaptcha-common": "2.18.2",
-		"@prosopo/types": "5.12.0",
-		"@prosopo/util": "3.3.13",
-		"@prosopo/util-crypto": "13.6.0",
-		"@prosopo/widget-skeleton": "2.10.1"
-	},
-	"devDependencies": {
-		"@prosopo/config": "3.4.2",
-		"@types/node": "22.5.5",
-		"@vitest/coverage-v8": "4.1.11",
-		"concurrently": "9.0.1",
-		"del-cli": "6.0.0",
-		"jsdom": "26.1.0",
-		"npm-run-all": "4.1.5",
-		"tslib": "2.7.0",
-		"tsx": "4.20.3",
-		"typescript": "5.6.2",
-		"vite": "8.1.5",
-		"vitest": "4.1.11"
-	},
-	"repository": {
-		"type": "git",
-		"url": "git+https://github.com/prosopo/captcha.git",
-		"directory": "packages/procaptcha-puzzle"
-	},
-	"bugs": {
-		"url": "https://github.com/prosopo/captcha/issues"
-	},
-	"homepage": "https://github.com/prosopo/captcha#readme",
-	"description": "",
-	"publishConfig": {
-		"registry": "https://registry.npmjs.org"
-	}
-}
+  "name": "@prosopo/procaptcha-puzzle",
+  "version": "2.15.0",
+  "author": "PROSOPO LIMITED <info@prosopo.io>",
+  "license": "Apache-2.0",
+  "main": "dist/index.js",
+  "type": "module",
+  "sideEffects": false,
+  "engines": {
+    "node": "^24"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/cjs/index.cjs"
+    }
+  },
+  "types": "dist/index.d.ts",
+  "source": "./src/index.ts",
+  "browserslist": [
+    "> 0.5%, last 2 versions, not dead"
+  ],
+  "dependencies": {
+    "@polkadot/util": "14.0.3",
+    "@prosopo/api": "4.4.0",
+    "@prosopo/common": "3.1.62",
+    "@prosopo/locale": "3.7.0",
+    "@prosopo/procaptcha-common": "2.19.0",
+    "@prosopo/types": "5.13.0",
+    "@prosopo/util": "3.3.14",
+    "@prosopo/util-crypto": "13.6.0",
+    "@prosopo/widget-skeleton": "2.10.1"
+  },
+  "devDependencies": {
+    "@prosopo/config": "3.4.3",
+    "@types/node": "22.5.5",
+    "@vitest/coverage-v8": "4.1.11",
+    "concurrently": "9.0.1",
+    "del-cli": "6.0.0",
+    "jsdom": "26.1.0",
+    "npm-run-all": "4.1.5",
+    "tslib": "2.7.0",
+    "tsx": "4.20.3",
+    "typescript": "5.6.2",
+    "vite": "8.1.5",
+    "vitest": "4.1.11"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/prosopo/captcha.git",
+    "directory": "packages/procaptcha-puzzle"
+  },
+  "bugs": {
+    "url": "https://github.com/prosopo/captcha/issues"
+  },
+  "homepage": "https://github.com/prosopo/captcha#readme",
+  "description": "",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org"
+  },
+  "scripts": {
+    "clean": "del-cli --verbose dist tsconfig.tsbuildinfo",
+    "build": "pnpm run build:cross-env --mode ${NODE_ENV:-development}",
+    "build:cross-env": "vite build --config vite.esm.config.ts",
+    "build:tsc": "tsc --build --verbose",
+    "build:cjs": "NODE_ENV=${NODE_ENV:-development}; vite build --config vite.cjs.config.ts --mode $NODE_ENV",
+    "typecheck": "tsc --project tsconfig.types.json",
+    "test": "NODE_ENV=${NODE_ENV:-test}; pnpm exec vitest run --config ./vite.test.config.ts",
+    "test:watch": "NODE_ENV=${NODE_ENV:-test}; pnpm exec vitest --config ./vite.test.config.ts",
+    "test:coverage": "NODE_ENV=${NODE_ENV:-test}; pnpm exec vitest run --coverage --config ./vite.test.config.ts"
+  }
+}

package/src/components/procaptchaPuzzle.ts

@@ -1,54 +0,0 @@
-// 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 { ProcaptchaPuzzleHandle } from "./procaptchaWidget.js";
-
-export type { ProcaptchaPuzzleHandle };
-
-export type ProcaptchaPuzzleMountFn = (
-	container: HTMLElement,
-	props: ProcaptchaProps,
-) => ProcaptchaPuzzleHandle;
-
-/**
- * Dynamic import so the puzzle widget lands in its own chunk, replacing the
- * `lazy()` + `<Suspense>` pair that used to provide the split.
- */
-export const loadProcaptchaPuzzle =
-	async (): Promise<ProcaptchaPuzzleMountFn> =>
-		(await import("./procaptchaWidget.js")).mountProcaptchaPuzzleWidget;
-
-export const mountProcaptchaPuzzle = (
-	container: HTMLElement,
-	props: ProcaptchaProps,
-): ProcaptchaPuzzleHandle => {
-	let destroyed = false;
-	let inner: ProcaptchaPuzzleHandle | undefined;
-
-	void loadProcaptchaPuzzle().then((mount: ProcaptchaPuzzleMountFn) => {
-		if (destroyed) {
-			return;
-		}
-		inner = mount(container, props);
-	});
-
-	return {
-		destroy: () => {
-			destroyed = true;
-			inner?.destroy();
-			inner = undefined;
-		},
-	};
-};

package/src/components/procaptchaWidget.ts

@@ -1,429 +0,0 @@
-// 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 {
-	createTranslator,
-	loadI18next,
-	localiseErrorMessage,
-} from "@prosopo/locale";
-import {
-	type CheckboxProps,
-	type Component,
-	type HoneypotComponent,
-	type ProcaptchaStateHandle,
-	Teardown,
-	buildUpdateState,
-	createElement,
-	createProcaptchaState,
-	createRenderScheduler,
-	isEventTrusted,
-	mountCheckbox,
-	mountHoneypot,
-} from "@prosopo/procaptcha-common";
-import {
-	type GetPuzzleCaptchaResponse,
-	ModeEnum,
-	type ProcaptchaProps,
-	type ProcaptchaState,
-	type PuzzleEvent,
-} from "@prosopo/types";
-import { darkTheme, lightTheme } from "@prosopo/widget-skeleton";
-import { Manager } from "../services/Manager.js";
-import { type PuzzleCanvasProps, mountPuzzleCanvas } from "./puzzleCanvas.js";
-
-// Define the same event name as in the bundle for consistency
-const PROCAPTCHA_EXECUTE_EVENT = "procaptcha:execute";
-
-type PuzzlePhase = "checkbox" | "dragging" | "submitting";
-
-export interface ProcaptchaPuzzleHandle {
-	destroy(): void;
-}
-
-export const mountProcaptchaPuzzleWidget = (
-	container: HTMLElement,
-	props: ProcaptchaProps,
-): ProcaptchaPuzzleHandle => {
-	const teardown = new Teardown();
-	const config = props.config;
-	const i18n = props.i18n;
-	const frictionlessState = props.frictionlessState; // Set up Session ID and Provider if they exist
-	const callbacks = props.callbacks || {};
-	const translator = createTranslator(i18n);
-	const isInvisible = ModeEnum.invisible === config.mode;
-
-	const store: ProcaptchaStateHandle = createProcaptchaState();
-	let loading = false;
-	let puzzlePhase: PuzzlePhase = "checkbox";
-	let challengeData: GetPuzzleCaptchaResponse | null = null;
-	// A re-mint after a wrong answer builds a brand new widget, so the miss is
-	// only still on screen if the wrapper hands it back to us.
-	let showRetry = true === props.startShowRetry;
-	let lastError: ProcaptchaState["error"] = store.state.error;
-	// See procaptcha-pow's widget — same session-invalidation recovery contract
-	// with coords preservation across a re-mint.
-	let lastCoords: { x: number; y: number } | null = null;
-	let sessionInvalidatedFired = false;
-
-	let honeypot: HoneypotComponent | undefined;
-	let checkbox: Component<CheckboxProps> | undefined;
-	let puzzle: Component<PuzzleCanvasProps> | undefined;
-
-	// get the state update mechanism
-	const updateState = buildUpdateState(store.state, store.update);
-
-	const manager = Manager(
-		config,
-		store.state,
-		updateState,
-		callbacks,
-		frictionlessState,
-		() => honeypot?.getValue(),
-	);
-
-	const root = createElement("div");
-	container.appendChild(root);
-
-	if (frictionlessState?.hp) {
-		honeypot = mountHoneypot(root, { encodedQuestion: frictionlessState.hp });
-	}
-
-	const handlePuzzleComplete = async (
-		finalX: number,
-		finalY: number,
-		puzzleEvents: PuzzleEvent[],
-	): Promise<void> => {
-		puzzlePhase = "submitting";
-		scheduler.schedule();
-
-		let verified = false;
-		try {
-			verified = await manager.submitSolution(finalX, finalY, puzzleEvents);
-		} catch (error) {
-			callbacks.onError?.(
-				error instanceof Error ? error : new Error(String(error)),
-			);
-		}
-
-		if (verified) {
-			puzzlePhase = "checkbox";
-			challengeData = null;
-			showRetry = false;
-			loading = false;
-			scheduler.schedule();
-			return;
-		}
-
-		// Failed — show retry message and fetch a new challenge
-		showRetry = true;
-		puzzlePhase = "dragging";
-		scheduler.schedule();
-
-		// A frictionless session is single-use: the provider consumed it when it
-		// issued the puzzle the user just got wrong, so asking `manager.start()`
-		// for a replacement on the same sessionId can only ever come back
-		// CAPTCHA.NO_SESSION_FOUND — a wasted round trip that surfaces an error
-		// on the checkbox before the wrapper recovers. Go straight to the
-		// re-mint instead; the wrapper mints a new session and re-mounts us with
-		// `autoStart`, so a fresh puzzle appears in place.
-		if (frictionlessState?.sessionId && props.onReload) {
-			puzzlePhase = "submitting";
-			scheduler.schedule();
-			props.onReload(lastCoords?.x, lastCoords?.y, { showRetry: true });
-			return;
-		}
-
-		try {
-			const newChallenge = await manager.start();
-			if (newChallenge) {
-				challengeData = newChallenge;
-			} else {
-				// Couldn't get new challenge, fall back to checkbox
-				puzzlePhase = "checkbox";
-				challengeData = null;
-				showRetry = false;
-			}
-		} catch {
-			puzzlePhase = "checkbox";
-			challengeData = null;
-			showRetry = false;
-		}
-		loading = false;
-		scheduler.schedule();
-	};
-
-	// Dismissing returns to the checkbox; clicking away is not a wrong answer.
-	const handleDismiss = () => {
-		puzzlePhase = "checkbox";
-		challengeData = null;
-		showRetry = false;
-		loading = false;
-		scheduler.schedule();
-	};
-
-	const puzzleProps = (
-		challenge: GetPuzzleCaptchaResponse,
-	): PuzzleCanvasProps => ({
-		originX: challenge.originX,
-		originY: challenge.originY,
-		background: challenge.background,
-		piece: challenge.piece,
-		pieceSize: challenge.pieceSize,
-		onComplete: (finalX: number, finalY: number, events: PuzzleEvent[]) => {
-			void handlePuzzleComplete(finalX, finalY, events);
-		},
-		showRetry,
-		submitting: "submitting" === puzzlePhase,
-		theme: "light" === config.theme ? lightTheme : darkTheme,
-		translator,
-		placement: config.placement,
-		anchor: props.container,
-		onDismiss: handleDismiss,
-	});
-
-	const runErrorEffect = () => {
-		if (store.state.error === lastError) {
-			return;
-		}
-		lastError = store.state.error;
-		if (!store.state.error) {
-			return;
-		}
-		loading = false;
-		puzzlePhase = "checkbox";
-		challengeData = null;
-		showRetry = false;
-		if ("CAPTCHA.NO_SESSION_FOUND" !== store.state.error.key) {
-			return;
-		}
-		// Suppressed only when something is actually going to re-mint: this is
-		// an internal recovery signal, not something the user should read, so
-		// hold the spinner rather than paint a support code that is about to
-		// stop being true. Clearing it re-enters this effect once, which returns
-		// at the `!error` guard. With no recovery route the error stands — a
-		// spinner that never resolves is worse than a message.
-		const willRecover =
-			(props.onSessionInvalidated && !sessionInvalidatedFired) ||
-			undefined !== frictionlessState;
-		if (willRecover) {
-			loading = true;
-			store.update({ error: undefined });
-		}
-		if (props.onSessionInvalidated && !sessionInvalidatedFired) {
-			sessionInvalidatedFired = true;
-			props.onSessionInvalidated(lastCoords?.x, lastCoords?.y);
-			return;
-		}
-		if (frictionlessState) {
-			const timer = setTimeout(() => {
-				frictionlessState.restart();
-			}, 100);
-			teardown.add(() => clearTimeout(timer));
-		}
-	};
-
-	const render = () => {
-		runErrorEffect();
-
-		// Puzzle overlay — shown in both visible and invisible modes once a
-		// challenge has been fetched; puzzle is inherently interactive.
-		const showOverlay =
-			("dragging" === puzzlePhase || "submitting" === puzzlePhase) &&
-			null !== challengeData;
-
-		if (showOverlay && null !== challengeData) {
-			if (undefined === puzzle) {
-				puzzle = mountPuzzleCanvas(puzzleProps(challengeData));
-			} else {
-				puzzle.update(puzzleProps(challengeData));
-			}
-		} else {
-			puzzle?.destroy();
-			puzzle = undefined;
-		}
-
-		checkbox?.update(checkboxProps());
-	};
-
-	const scheduler = createRenderScheduler(render);
-
-	const checkboxProps = (): CheckboxProps => ({
-		checked: store.state.isHuman,
-		theme: "light" === config.theme ? lightTheme : darkTheme,
-		labelText: translator.isReady() ? translator.t("WIDGET.I_AM_HUMAN") : "",
-		error: store.state.error
-			? localiseErrorMessage(translator.i18n, store.state.error)
-			: undefined,
-		loadingText: translator.t("WIDGET.CHECKING", {
-			defaultValue: "Checking that you are human",
-		}),
-		loading: loading || "submitting" === puzzlePhase,
-		onChange: async (
-			event: MouseEvent | KeyboardEvent | TouchEvent,
-		): Promise<void> => {
-			if (loading) {
-				return;
-			}
-			loading = true;
-			showRetry = false;
-			scheduler.schedule();
-
-			// Capture click coordinates (mirrors the PoW widget) so the puzzle
-			// solution salt records the entry-point telemetry.
-			let x = 0;
-			let y = 0;
-			if (!isEventTrusted(event)) {
-				// Don't capture coordinates for non-trusted events
-			} else if ("touches" in event && event.touches.length > 0) {
-				const touch = event.touches[0];
-				if (touch) {
-					x = touch.clientX;
-					y = touch.clientY;
-				}
-			} else if ("clientX" in event && "clientY" in event) {
-				x = event.clientX;
-				y = event.clientY;
-			}
-
-			lastCoords = { x, y };
-			try {
-				const challenge = await manager.start(x, y);
-
-				if (challenge) {
-					challengeData = challenge;
-					puzzlePhase = "dragging";
-				}
-			} catch (error) {
-				// The manager reports failures through state.error; rethrowing here
-				// only produces an unhandled rejection, since nothing awaits this
-				// handler.
-				callbacks.onError?.(
-					error instanceof Error ? error : new Error(String(error)),
-				);
-			} finally {
-				// A rejected start would otherwise leave the spinner up for good,
-				// with no way back to the checkbox for the user.
-				loading = false;
-				scheduler.schedule();
-			}
-		},
-	});
-
-	// Checkbox — only in visible mode. Invisible mode is driven by the host
-	// page's execute() call (e.g. on form submit).
-	if (!isInvisible) {
-		checkbox = mountCheckbox(root, checkboxProps());
-	}
-
-	teardown.add(scheduler.cancel);
-	teardown.add(store.subscribe(scheduler.schedule));
-	teardown.add(translator.subscribe(scheduler.schedule));
-
-	// A bare execute() reaches every invisible widget via document. A targeted
-	// execute() is dispatched on this widget's container and works in either
-	// mode, which is what lets a bound button drive a visible widget. Either
-	// way it fetches a challenge and drives the puzzle UI through the same
-	// phase transitions as the visible checkbox flow.
-	const handleExecute = () => {
-		void (async () => {
-			if (loading) {
-				return;
-			}
-			loading = true;
-			showRetry = false;
-			scheduler.schedule();
-			try {
-				const challenge = await manager.start();
-				if (challenge) {
-					challengeData = challenge;
-					puzzlePhase = "dragging";
-				}
-			} catch (error) {
-				callbacks.onError?.(
-					error instanceof Error ? error : new Error(String(error)),
-				);
-			} finally {
-				loading = false;
-				scheduler.schedule();
-			}
-		})();
-	};
-
-	if (props.container) {
-		teardown.addEventListener(
-			props.container,
-			PROCAPTCHA_EXECUTE_EVENT,
-			handleExecute,
-		);
-	}
-	if (isInvisible) {
-		teardown.addEventListener(
-			document,
-			PROCAPTCHA_EXECUTE_EVENT,
-			handleExecute,
-		);
-	}
-
-	if (config.language) {
-		if (i18n) {
-			if (i18n.language !== config.language) {
-				void i18n.changeLanguage(config.language);
-			}
-		} else {
-			// Direct consumers don't go through WidgetFactory, so pass the language
-			// into loadI18next — first init boots with the right language (skipping
-			// browser detection), and subsequent calls reconcile via changeLanguage
-			// inside loadI18next.
-			void loadI18next(false, config.language);
-		}
-	}
-
-	if (props.autoStart) {
-		loading = true;
-		// Deliberately not cleared: an autoStart mount is how a re-mint after a
-		// wrong answer arrives, and `startShowRetry` says whether it was one.
-		const coords = props.startCoords;
-		lastCoords = coords ?? null;
-		scheduler.schedule();
-		manager.start(coords?.x ?? 0, coords?.y ?? 0).then(
-			(challenge: GetPuzzleCaptchaResponse | undefined) => {
-				if (challenge) {
-					challengeData = challenge;
-					puzzlePhase = "dragging";
-				}
-				loading = false;
-				scheduler.schedule();
-			},
-			() => {
-				loading = false;
-				scheduler.schedule();
-			},
-		);
-	}
-
-	render();
-
-	return {
-		destroy: () => {
-			manager.dispose();
-			teardown.run();
-			puzzle?.destroy();
-			checkbox?.destroy();
-			honeypot?.destroy();
-			root.parentNode?.removeChild(root);
-		},
-	};
-};
-
-export default mountProcaptchaPuzzleWidget;