@prosopo/procaptcha-audio 0.0.0-stage → 0.2.0

package/dist/cjs/components/procaptchaAudio.cjs

@@ -0,0 +1,7 @@
+let _prosopo_procaptcha_common = require("@prosopo/procaptcha-common");
+//#region src/components/procaptchaAudio.ts
+var loadProcaptchaAudio = async () => (await Promise.resolve().then(() => require("./procaptchaWidget.cjs"))).mountProcaptchaAudioWidget;
+var mountProcaptchaAudio = (0, _prosopo_procaptcha_common.lazyMount)(loadProcaptchaAudio);
+//#endregion
+exports.loadProcaptchaAudio = loadProcaptchaAudio;
+exports.mountProcaptchaAudio = mountProcaptchaAudio;

package/dist/cjs/components/procaptchaWidget.cjs

@@ -0,0 +1,195 @@
+const require_Manager = require("../services/Manager.cjs");
+const require_audioPlayer = require("./audioPlayer.cjs");
+let _prosopo_locale = require("@prosopo/locale");
+let _prosopo_procaptcha_common = require("@prosopo/procaptcha-common");
+let _prosopo_types = require("@prosopo/types");
+let _prosopo_widget_skeleton = require("@prosopo/widget-skeleton");
+//#region src/components/procaptchaWidget.ts
+var mountProcaptchaAudioWidget = (container, props) => {
+	const teardown = new _prosopo_procaptcha_common.Teardown();
+	const config = props.config;
+	const i18n = props.i18n;
+	const frictionlessState = props.frictionlessState;
+	const callbacks = props.callbacks || {};
+	const translator = (0, _prosopo_locale.createTranslator)(i18n);
+	const isInvisible = _prosopo_types.ModeEnum.invisible === config.mode;
+	const theme = "light" === config.theme ? _prosopo_widget_skeleton.lightTheme : _prosopo_widget_skeleton.darkTheme;
+	const store = (0, _prosopo_procaptcha_common.createProcaptchaState)();
+	let loading = false;
+	let audioPhase = "checkbox";
+	let challengeData = null;
+	let showRetry = true === props.startShowRetry;
+	let lastError = store.state.error;
+	let lastCoords = null;
+	let sessionInvalidatedFired = false;
+	let honeypot;
+	let checkbox;
+	let player;
+	const onReload = props.onReload;
+	const updateState = (0, _prosopo_procaptcha_common.buildUpdateState)(store.state, store.update);
+	const manager = require_Manager.Manager(config, store.state, updateState, callbacks, frictionlessState, () => honeypot?.getValue(), onReload ? (x, y) => onReload(x, y, { showRetry: true }) : void 0);
+	const root = (0, _prosopo_procaptcha_common.createElement)("div");
+	container.appendChild(root);
+	if (frictionlessState?.hp) honeypot = (0, _prosopo_procaptcha_common.mountHoneypot)(root, { encodedQuestion: frictionlessState.hp });
+	const reportError = (error) => {
+		callbacks.onError?.(error instanceof Error ? error : new Error(String(error)));
+	};
+	const returnToCheckbox = () => {
+		audioPhase = "checkbox";
+		challengeData = null;
+		showRetry = false;
+	};
+	const showChallenge = (challenge) => {
+		if (challenge) {
+			challengeData = challenge;
+			audioPhase = "answering";
+		}
+	};
+	const handleAudioComplete = async (answer, replays, audioEvents) => {
+		audioPhase = "submitting";
+		scheduler.schedule();
+		let verified = false;
+		try {
+			verified = await manager.submitSolution(answer, replays, audioEvents);
+		} catch (error) {
+			reportError(error);
+		}
+		if (verified) {
+			returnToCheckbox();
+			loading = false;
+			scheduler.schedule();
+			return;
+		}
+		showRetry = true;
+		if (onReload) {
+			scheduler.schedule();
+			return;
+		}
+		audioPhase = "answering";
+		scheduler.schedule();
+		try {
+			const newChallenge = await manager.start();
+			if (newChallenge) challengeData = newChallenge;
+			else returnToCheckbox();
+		} catch {
+			returnToCheckbox();
+		}
+		loading = false;
+		scheduler.schedule();
+	};
+	const handleDismiss = () => {
+		returnToCheckbox();
+		loading = false;
+		scheduler.schedule();
+	};
+	const playerProps = (challenge) => ({
+		clip: challenge.clip,
+		characterCount: challenge.characterCount,
+		onComplete: (answer, replays, events) => {
+			handleAudioComplete(answer, replays, events);
+		},
+		showRetry,
+		submitting: "submitting" === audioPhase,
+		theme,
+		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;
+		returnToCheckbox();
+		if ("CAPTCHA.NO_SESSION_FOUND" !== store.state.error.key) return;
+		if (props.onSessionInvalidated && !sessionInvalidatedFired || void 0 !== frictionlessState) {
+			loading = true;
+			store.update({ error: void 0 });
+		}
+		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();
+		if (("answering" === audioPhase || "submitting" === audioPhase) && null !== challengeData) if (void 0 === player) player = require_audioPlayer.mountAudioPlayer(playerProps(challengeData));
+		else player.update(playerProps(challengeData));
+		else {
+			player?.destroy();
+			player = void 0;
+		}
+		checkbox?.update(checkboxProps());
+	};
+	const scheduler = (0, _prosopo_procaptcha_common.createRenderScheduler)(render);
+	const beginChallenge = async (coords) => {
+		if (loading) return;
+		loading = true;
+		showRetry = false;
+		scheduler.schedule();
+		if (coords) lastCoords = coords;
+		try {
+			showChallenge(await manager.start(coords?.x, coords?.y));
+		} catch (error) {
+			reportError(error);
+		} finally {
+			loading = false;
+			scheduler.schedule();
+		}
+	};
+	const checkboxProps = () => ({
+		checked: store.state.isHuman,
+		theme,
+		labelText: translator.isReady() ? translator.t("WIDGET.I_AM_HUMAN") : "",
+		error: store.state.error ? (0, _prosopo_locale.localiseErrorMessage)(translator.i18n, store.state.error) : void 0,
+		loadingText: translator.t("WIDGET.CHECKING", { defaultValue: "Checking that you are human" }),
+		loading: loading || "submitting" === audioPhase,
+		onChange: (event) => beginChallenge((0, _prosopo_procaptcha_common.trustedClickCoords)(event))
+	});
+	if (!isInvisible) checkbox = (0, _prosopo_procaptcha_common.mountCheckbox)(root, checkboxProps());
+	teardown.add(scheduler.cancel);
+	teardown.add(store.subscribe(scheduler.schedule));
+	teardown.add(translator.subscribe(scheduler.schedule));
+	const handleExecute = () => {
+		beginChallenge();
+	};
+	if (props.container) teardown.addEventListener(props.container, _prosopo_procaptcha_common.PROCAPTCHA_EXECUTE_EVENT, handleExecute);
+	if (isInvisible) teardown.addEventListener(document, _prosopo_procaptcha_common.PROCAPTCHA_EXECUTE_EVENT, handleExecute);
+	if (config.language) if (i18n) {
+		if (i18n.language !== config.language) i18n.changeLanguage(config.language);
+	} else (0, _prosopo_locale.loadI18next)(false, config.language);
+	if (props.autoStart) {
+		loading = true;
+		const coords = props.startCoords;
+		lastCoords = coords ?? null;
+		scheduler.schedule();
+		manager.start(coords?.x ?? 0, coords?.y ?? 0).then((challenge) => {
+			showChallenge(challenge);
+			loading = false;
+			scheduler.schedule();
+		}, () => {
+			loading = false;
+			scheduler.schedule();
+		});
+	}
+	render();
+	return { destroy: () => {
+		manager.dispose();
+		teardown.run();
+		player?.destroy();
+		checkbox?.destroy();
+		honeypot?.destroy();
+		root.parentNode?.removeChild(root);
+	} };
+};
+//#endregion
+exports.default = mountProcaptchaAudioWidget;
+exports.mountProcaptchaAudioWidget = mountProcaptchaAudioWidget;

package/dist/cjs/index.cjs

@@ -0,0 +1,8 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_audioPlayer = require("./components/audioPlayer.cjs");
+const require_procaptchaWidget = require("./components/procaptchaWidget.cjs");
+const require_procaptchaAudio = require("./components/procaptchaAudio.cjs");
+exports.loadProcaptchaAudio = require_procaptchaAudio.loadProcaptchaAudio;
+exports.mountAudioPlayer = require_audioPlayer.mountAudioPlayer;
+exports.mountProcaptchaAudio = require_procaptchaAudio.mountProcaptchaAudio;
+exports.mountProcaptchaAudioWidget = require_procaptchaWidget.default;

package/dist/cjs/services/Manager.cjs

@@ -0,0 +1,218 @@
+let _prosopo_procaptcha_common = require("@prosopo/procaptcha-common");
+let _prosopo_types = require("@prosopo/types");
+let _polkadot_util_string = require("@polkadot/util/string");
+let _prosopo_api = require("@prosopo/api");
+let _prosopo_common = require("@prosopo/common");
+let _prosopo_util = require("@prosopo/util");
+let _prosopo_util_crypto = require("@prosopo/util-crypto");
+//#region src/services/Manager.ts
+var Manager = (configInput, state, onStateUpdate, callbacks, frictionlessState, getHoneypotValue, onReloadRequest) => {
+	const events = (0, _prosopo_procaptcha_common.getDefaultEvents)(callbacks);
+	let storedChallengeResponse;
+	let storedProviderApi;
+	let storedProviderUrl;
+	let storedUser;
+	let storedClickX;
+	let storedClickY;
+	let previousProviderUrl;
+	const spentSession = (0, _prosopo_procaptcha_common.createSpentSessionGuard)();
+	const defaultState = () => {
+		return {
+			showModal: false,
+			loading: false,
+			index: 0,
+			challenge: void 0,
+			solutions: void 0,
+			isHuman: false,
+			captchaApi: void 0,
+			account: void 0
+		};
+	};
+	const onFailed = () => {
+		updateState({
+			isHuman: false,
+			loading: false
+		});
+		events.onFailed();
+		resetState(frictionlessState?.restart);
+	};
+	const getConfig = () => {
+		const config = {
+			userAccountAddress: configInput.userAccountAddress || "",
+			...configInput
+		};
+		if (state.account) config.userAccountAddress = state.account.account.address;
+		return _prosopo_types.ProcaptchaConfigSchema.parse(config);
+	};
+	const getAccount = () => {
+		if (!state.account) throw new _prosopo_common.ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", { context: { error: "Account not loaded" } });
+		return { account: state.account };
+	};
+	const getDappAccount = () => {
+		if (!state.dappAccount) throw new _prosopo_common.ProsopoEnvError("GENERAL.SITE_KEY_MISSING");
+		return state.dappAccount;
+	};
+	const updateState = (0, _prosopo_procaptcha_common.buildUpdateState)(state, onStateUpdate);
+	const lifecycle = (0, _prosopo_procaptcha_common.createManagerLifecycle)(state, updateState);
+	const resetState = (frictionlessRestart) => {
+		lifecycle.clearTimers();
+		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 = () => {
+		lifecycle.expireSolutionAfter(getConfig().captchas.audio.solutionTimeout, () => {
+			updateState({ isHuman: false });
+			events.onExpired();
+			resetState(frictionlessState?.restart);
+		});
+	};
+	const start = async (x = 0, y = 0) => {
+		await (0, _prosopo_procaptcha_common.providerRetry)(async () => {
+			if (state.loading) return;
+			if (state.isHuman) return;
+			resetState();
+			storedClickX = x;
+			storedClickY = y;
+			updateState({ loading: true });
+			updateState({ attemptCount: state.attemptCount + 1 });
+			const config = getConfig();
+			const selectAccount = async () => {
+				if (frictionlessState) return frictionlessState.userAccount;
+				return new (await ((0, _prosopo_procaptcha_common.ExtensionLoader)(config.web2)))().getAccount(config);
+			};
+			const user = await selectAccount();
+			const userAccount = user.account.address;
+			updateState({ account: { account: { address: userAccount } } });
+			updateState({ dappAccount: config.account.address });
+			await (0, _prosopo_util.sleep)(100);
+			if (!config.web2 && !config.userAccountAddress) throw new _prosopo_common.ProsopoEnvError("GENERAL.ACCOUNT_NOT_FOUND", { context: { error: "Account address has not been set for web3 mode" } });
+			let getRandomProviderResponse = void 0;
+			if (frictionlessState?.provider) getRandomProviderResponse = frictionlessState.provider;
+			else {
+				const currentConfig = getConfig();
+				getRandomProviderResponse = await (0, _prosopo_procaptcha_common.getProcaptchaRandomActiveProvider)(currentConfig.defaultEnvironment, (0, _prosopo_procaptcha_common.pickIpMode)(currentConfig), {
+					attempt: state.attemptCount,
+					excludeUrl: previousProviderUrl
+				});
+			}
+			const providerUrl = getRandomProviderResponse.provider.url;
+			previousProviderUrl = providerUrl;
+			const providerApi = new _prosopo_api.ProviderApi(providerUrl, getDappAccount());
+			const challengeSessionId = frictionlessState?.sessionId;
+			if (spentSession.isSpent(challengeSessionId)) {
+				updateState({
+					loading: false,
+					error: {
+						message: "No session found",
+						key: "CAPTCHA.NO_SESSION_FOUND"
+					}
+				});
+				events.onError(/* @__PURE__ */ new Error("No session found"));
+				return;
+			}
+			const simdReadingsOnChallenge = frictionlessState?.getSimdReadings ? await frictionlessState.getSimdReadings(0) : void 0;
+			const challenge = await providerApi.getAudioCaptchaChallenge(userAccount, getDappAccount(), challengeSessionId, simdReadingsOnChallenge);
+			spentSession.markSpent(challengeSessionId);
+			if (challenge.error) {
+				updateState({
+					loading: false,
+					error: {
+						message: challenge.error.message,
+						key: challenge.error.key || "API.UNKNOWN_ERROR"
+					}
+				});
+				return;
+			}
+			storedChallengeResponse = challenge;
+			storedProviderApi = providerApi;
+			storedProviderUrl = providerUrl;
+			storedUser = user;
+			updateState({ loading: false });
+		}, async () => {
+			await start(x, y);
+		}, () => {
+			resetState();
+		}, state.attemptCount, 3);
+		return storedChallengeResponse;
+	};
+	const submitSolution = async (answer, replays, audioEvents) => {
+		if (!storedChallengeResponse || !storedProviderApi || !storedProviderUrl || !storedUser) throw new _prosopo_common.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 signer = user.extension?.signer;
+			if (!signer || !signer.signRaw) throw new _prosopo_common.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: (0, _polkadot_util_string.stringToHex)(challenge[_prosopo_types.ApiParams.timestamp].toString()),
+				type: "bytes"
+			});
+			const encryptedBehavioralData = await (0, _prosopo_procaptcha_common.encryptBehavioralDataForSubmit)(frictionlessState);
+			let salt;
+			if (storedClickX !== void 0 && storedClickY !== void 0) {
+				const coords = [storedClickX, storedClickY];
+				const randomSalt = (0, _prosopo_util_crypto.randomAsHex)(coords.map((coord) => coord.toString(16).length + 4).reduce((acc, curr) => acc + curr, 0));
+				salt = (0, _prosopo_util.embedData)(randomSalt, coords);
+			}
+			const simdReadings = await (0, _prosopo_procaptcha_common.getSimdReadingsForSubmit)(frictionlessState);
+			const clientMetaData = (0, _prosopo_procaptcha_common.buildClientMetaData)(getHoneypotValue?.(), getConfig().clientSessionId);
+			const verifiedSolution = await providerApi.submitAudioCaptchaSolution(challenge, getAccount().account.account.address, getDappAccount(), answer, replays, audioEvents, userTimestampSignature.signature.toString(), encryptedBehavioralData, salt, simdReadings, clientMetaData);
+			if (lifecycle.isDisposed()) return false;
+			if (verifiedSolution[_prosopo_types.ApiParams.verified]) {
+				updateState({
+					isHuman: true,
+					loading: false
+				});
+				events.onHuman((0, _prosopo_types.encodeProcaptchaOutput)({
+					[_prosopo_types.ApiParams.providerUrl]: providerUrl,
+					[_prosopo_types.ApiParams.user]: getAccount().account.account.address,
+					[_prosopo_types.ApiParams.dapp]: getDappAccount(),
+					[_prosopo_types.ApiParams.challenge]: challenge.challenge,
+					[_prosopo_types.ApiParams.timestamp]: challenge.timestamp,
+					[_prosopo_types.ApiParams.signature]: {
+						[_prosopo_types.ApiParams.provider]: challenge.signature.provider,
+						[_prosopo_types.ApiParams.user]: { [_prosopo_types.ApiParams.timestamp]: userTimestampSignature.signature.toString() }
+					},
+					[_prosopo_types.ApiParams.captchaType]: _prosopo_types.CaptchaType.audio
+				}));
+				setValidChallengeTimeout();
+				return true;
+			}
+			if (onReloadRequest) {
+				updateState({
+					isHuman: false,
+					loading: false
+				});
+				events.onFailed();
+				const retryX = storedClickX;
+				const retryY = storedClickY;
+				resetState();
+				onReloadRequest(retryX, retryY);
+				return false;
+			}
+			onFailed();
+			return false;
+		} catch (error) {
+			updateState({ loading: false });
+			throw error;
+		}
+	};
+	return {
+		start,
+		submitSolution,
+		resetState,
+		dispose: lifecycle.dispose
+	};
+};
+//#endregion
+exports.Manager = Manager;

package/dist/components/audioPlayer.d.ts

@@ -0,0 +1,18 @@
+import type { Translator } from "@prosopo/locale";
+import { type Component } from "@prosopo/procaptcha-common";
+import type { AudioEvent, PlacementType } from "@prosopo/types";
+import type { Theme } from "@prosopo/widget-skeleton";
+export interface AudioPlayerProps {
+    clip: string;
+    characterCount: number;
+    onComplete: (answer: string, replays: number, audioEvents: AudioEvent[]) => void;
+    showRetry: boolean;
+    submitting: boolean;
+    theme: Theme;
+    translator: Translator;
+    placement?: PlacementType;
+    anchor?: HTMLElement | null;
+    onDismiss?: () => void;
+}
+export declare const mountAudioPlayer: (initialProps: AudioPlayerProps) => Component<AudioPlayerProps>;
+//# sourceMappingURL=audioPlayer.d.ts.map

package/dist/components/audioPlayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"audioPlayer.d.ts","sourceRoot":"","sources":["../../src/components/audioPlayer.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAkB,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAClE,OAAO,EAGN,KAAK,SAAS,EAOd,MAAM,4BAA4B,CAAC;AACpC,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAEtD,MAAM,WAAW,gBAAgB;IAEhC,IAAI,EAAE,MAAM,CAAC;IAEb,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,CACX,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,MAAM,EACf,WAAW,EAAE,UAAU,EAAE,KACrB,IAAI,CAAC;IACV,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,UAAU,CAAC;IACvB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAkCD,eAAO,MAAM,gBAAgB,iBACd,gBAAgB,KAC5B,SAAS,CAAC,gBAAgB,CA4T5B,CAAC"}