@incodetech/web 2.3.2-rc.4 → 2.4.0-rc.0

package/dist/finalSuccessScreen-DS4fm_uM.js

@@ -0,0 +1,500 @@
+import { o as useTranslation } from "./uiConfig-CzjzpmLx.js";
+import { S as k, _ as y, c as A, f as d, h as q, v as u } from "./vendor-preact-C0jX1Cbq.js";
+import { f as useTimeoutHandle } from "./incodeComponent-I3JIdKa5.js";
+import { d as cn, n as LoadingIcon, o as Lottie, s as Asset } from "./spacer-CRMb016O.js";
+import { b as ErrorIcon, r as SuccessIcon, x as Button } from "./icons-Cri5P1f0.js";
+import { t as Page } from "./page-BzEithea.js";
+import { n as Modal } from "./incode-logo-r5UBM52t.js";
+import { t as AutoFocusTitle } from "./autoFocusTitle-DTSPbDgY.js";
+import { n as CameraFrame } from "./cameraView-DG425WNr.js";
+import { t as ManualCaptureButton } from "./manualCaptureButton-DghY-ZUO.js";
+import { n as CaptureNotification, t as ManualCaptureButton$1 } from "./manualCaptureButton-DwcLDSMN.js";
+import { checkCameraPermission, requestCameraPermission } from "@incodetech/core/camera";
+import { resolveVideoSelfieSteps } from "@incodetech/core/video-selfie";
+//#region src/modules/video-selfie/useVideoSelfiePermissions.ts
+/**
+* Drives the shared camera `<Permissions>` screen for Video Selfie. Mirrors the
+* selfie/ID permission substates, but runs as a UI-level gate (the recording
+* machine has no permission states of its own). The grant request includes
+* audio (`requestAudio: true`) because Video Selfie records the microphone; the
+* initial check only queries the camera, so an already-granted camera skips
+* straight to capture and the recording machine surfaces the mic prompt.
+*/
+function useVideoSelfiePermissions({ enabled, onGranted, onClose, requestAudio = true }) {
+	const [permissionStatus, setPermissionStatus] = d("checking");
+	const onGrantedRef = A(onGranted);
+	onGrantedRef.current = onGranted;
+	const onCloseRef = A(onClose);
+	onCloseRef.current = onClose;
+	const resolve = q((result) => {
+		if (result === "granted") {
+			onGrantedRef.current();
+			return;
+		}
+		setPermissionStatus(result === "denied" ? "denied" : "idle");
+	}, []);
+	y(() => {
+		if (!enabled) return;
+		let cancelled = false;
+		checkCameraPermission().then((result) => {
+			if (!cancelled) resolve(result);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [enabled, resolve]);
+	return {
+		permissionStatus,
+		manager: {
+			requestPermission: q(() => {
+				setPermissionStatus("requesting");
+				requestCameraPermission({ requestAudio }).then(resolve);
+			}, [resolve, requestAudio]),
+			goToLearnMore: q(() => {
+				setPermissionStatus("learnMore");
+			}, []),
+			close: q(() => {
+				onCloseRef.current();
+			}, [])
+		}
+	};
+}
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/permission.svg?raw
+var permission_default = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M19.957 10.785a.75.75 0 0 0-.75-.748h-.002a.75.75 0 0 0-.748.752 6.484 6.484 0 0 1-6.452 6.49L12 17.276h-.003a6.43 6.43 0 0 1-4.569-1.907 6.43 6.43 0 0 1-1.885-4.58.75.75 0 0 0-.748-.753h-.002a.75.75 0 0 0-.75.748 7.92 7.92 0 0 0 2.322 5.644 7.9 7.9 0 0 0 4.885 2.31v2.136a.75.75 0 0 0 1.5 0v-2.137c4.046-.389 7.217-3.809 7.207-7.953\" clip-rule=\"evenodd\"/><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M11.998 14.932h.005a4.17 4.17 0 0 0 4.156-4.175V6.534A4.164 4.164 0 0 0 12 2.375a4.164 4.164 0 0 0-4.159 4.16v4.221a4.14 4.14 0 0 0 1.214 2.95 4.14 4.14 0 0 0 2.944 1.226\" clip-rule=\"evenodd\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/selfie.svg?raw
+var selfie_default$1 = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12.2 2.3c-5.4 0-9.8 4.4-9.8 9.8 0 1.8.4 3.3 1.1 4.6.2.4.7.5 1 .3.4-.2.5-.7.3-1-.6-1-.9-2.3-.9-3.8C3.9 7.7 7.6 4 12.1 4s8.2 3.7 8.2 8.2c0 1.3-.3 2.5-.9 3.9-.2.4 0 .8.4 1 .1 0 .2.1.3.1.3 0 .6-.2.7-.4.7-1.6 1.1-3 1.1-4.5 0-5.6-4.3-10-9.7-10\" clip-rule=\"evenodd\"/><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M15.9 10.501c0-2.1-1.7-3.8-3.8-3.8s-3.8 1.7-3.8 3.8 1.7 3.8 3.8 3.8 3.8-1.7 3.8-3.8m-3.7 5.3c-3.8 0-5.4 1.9-5.6 3.7 0 .2.1.4.2.5 1.5 1.1 3.4 1.7 5.4 1.7 1.9 0 3.7-.6 5.4-1.7.2-.1.2-.3.2-.5-.1-.9-.8-3.8-5.6-3.7\" clip-rule=\"evenodd\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/frontId.svg?raw
+var frontId_default = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M17.748 11.272h-3.507a.823.823 0 1 1 0-1.645h3.507a.822.822 0 0 1 0 1.645m0 3.709h-2.183a.822.822 0 1 1 0-1.645h2.183a.822.822 0 0 1 0 1.645m-5.274 1.434-6.399.009a.38.38 0 0 1-.264-.108.38.38 0 0 1-.108-.263c0-1.353 1.104-2.717 3.571-2.717s3.572 1.36 3.572 2.708a.37.37 0 0 1-.372.37m-3.2-8.862a2.32 2.32 0 0 1 2.317 2.317 2.32 2.32 0 0 1-2.317 2.318A2.32 2.32 0 0 1 6.957 9.87a2.32 2.32 0 0 1 2.317-2.317M17.05 3.8h-9.8c-2.7 0-4.6 2-4.6 4.8v6.8c0 2.8 1.9 4.8 4.6 4.8h9.8c2.7 0 4.6-2 4.6-4.8V8.6c0-2.8-1.9-4.8-4.6-4.8\" clip-rule=\"evenodd\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/backId.svg?raw
+var backId_default = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12.21 15.92h-1.428a.75.75 0 0 1 0-1.5h1.428a.75.75 0 0 1 0 1.5m-3.884 0H6.898a.75.75 0 0 1 0-1.5h1.428a.75.75 0 0 1 0 1.5m-5.525-5.33a.3.3 0 0 0-.3.3v4.4c0 2.793 1.794 4.67 4.463 4.67h10.07c2.671 0 4.465-1.878 4.465-4.67v-4.4a.3.3 0 0 0-.3-.3zM21.2 9.09a.3.3 0 0 0 .3-.3v-.08c0-2.794-1.795-4.67-4.465-4.67H6.965C4.294 4.04 2.5 5.915 2.5 8.71v.08a.3.3 0 0 0 .3.3z\" clip-rule=\"evenodd\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/poa.svg?raw
+var poa_default = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"9 8 26 26\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M22.555 9.168a1 1 0 0 0-1.11 0l-11.983 7.99a1 1 0 0 0-.323.334A1 1 0 0 0 9 18.01V31a2 2 0 0 0 2 2h22a2 2 0 0 0 2-2V18.013a1 1 0 0 0-.462-.856zm9.684 8.86L22 11.202l-10.239 6.826L20.138 24h3.724zM11 19.94v10.064l7.09-5.009zM20.136 26l-7.078 5h17.885l-7.079-5zm5.774-1.005 7.09 5.01V19.94z\" clip-rule=\"evenodd\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/questions.svg?raw
+var questions_default$1 = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M9 16c0-1.654-1.346-3-3-3s-3 1.346-3 3a1 1 0 1 0 2 0 1 1 0 0 1 2 0c0 .096-.03.601-.618 1.136-.689.618-2.642 2.041-2.662 2.055A1 1 0 0 0 4.309 21H8a1 1 0 1 0 0-2h-.727c.172-.14.327-.27.45-.381C8.876 17.57 9 16.438 9 16M4.78 6.268 5 6.09V10a1 1 0 1 0 2 0V4a1 1 0 0 0-1.628-.779l-1.848 1.49A1 1 0 0 0 4.78 6.268M11.334 7H20a1 1 0 1 0 0-2h-8.666a1 1 0 1 0 0 2M20 11h-8.666a1 1 0 1 0 0 2H20a1 1 0 1 0 0-2m0 6h-8.666a1 1 0 1 0 0 2H20a1 1 0 1 0 0-2\" clip-rule=\"evenodd\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/assets/tutorial/speech.svg?raw
+var speech_default = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" d=\"M12.02 2C17.7 2 22 6.657 22 11.985 22 18.165 16.96 22 12 22c-1.64 0-3.46-.44-4.92-1.302-.51-.31-.94-.54-1.49-.36l-2.02.6c-.51.16-.97-.24-.82-.78l.67-2.244c.11-.31.09-.641-.07-.901C2.49 15.43 2 13.698 2 12.015 2 6.747 6.21 2 12.02 2m4.57 8.743c-.71 0-1.28.571-1.28 1.282 0 .701.57 1.282 1.28 1.282a1.283 1.283 0 0 0 0-2.564m-4.61 0c-.7-.01-1.28.571-1.28 1.272 0 .711.57 1.282 1.28 1.292a1.283 1.283 0 0 0 0-2.564m-4.61 0c-.71 0-1.28.571-1.28 1.282 0 .701.58 1.282 1.28 1.282a1.29 1.29 0 0 0 1.28-1.282c0-.711-.57-1.282-1.28-1.282\"/></svg>";
+//#endregion
+//#region src/modules/video-selfie/tutorial.tsx
+var tutorialDefaults = {
+	"videoSelfie.tutorial.permission": permission_default,
+	"videoSelfie.tutorial.selfie": selfie_default$1,
+	"videoSelfie.tutorial.frontId": frontId_default,
+	"videoSelfie.tutorial.backId": backId_default,
+	"videoSelfie.tutorial.poa": poa_default,
+	"videoSelfie.tutorial.questions": questions_default$1,
+	"videoSelfie.tutorial.speech": speech_default
+};
+/**
+* Per-step tutorial row metadata — icon + localized label. Mirrors V1's
+* `RecorderTutorial`: each enabled step gets a row describing what the user will
+* be asked to do. Icons are reused from the progress header for consistency.
+*/
+var STEP_ROWS = {
+	frontId: {
+		assetKey: "videoSelfie.tutorial.frontId",
+		key: "videoSelfie.tutorial.scanFrontId",
+		defaultValue: "Scan the front of ID"
+	},
+	backId: {
+		assetKey: "videoSelfie.tutorial.backId",
+		key: "videoSelfie.tutorial.scanBackId",
+		defaultValue: "Scan the back of ID"
+	},
+	poa: {
+		assetKey: "videoSelfie.tutorial.poa",
+		key: "videoSelfie.tutorial.poa",
+		defaultValue: "Scan your proof of address"
+	},
+	selfie: {
+		assetKey: "videoSelfie.tutorial.selfie",
+		key: "videoSelfie.tutorial.takeSelfie",
+		defaultValue: "Look at your front camera"
+	},
+	questions: {
+		assetKey: "videoSelfie.tutorial.questions",
+		key: "videoSelfie.tutorial.questions",
+		defaultValue: "Answer some questions out loud"
+	},
+	speech: {
+		assetKey: "videoSelfie.tutorial.speech",
+		key: "videoSelfie.tutorial.recordVoiceMessage",
+		defaultValue: "Speak the words displayed on the screen"
+	}
+};
+/**
+* Pre-capture tutorial for the Video Selfie flow — a port of V1's
+* `RecorderTutorial`. Shows the list of steps the user will go through
+* (permissions first, then the enabled capture steps) and a "Start" button.
+*
+* While this screen is up, the host component warms the WASM pipelines in the
+* background (see `warmupVideoSelfieWasm`), so detection is ready the moment the
+* user taps "Start". Gated by the `showTutorials` config flag.
+*/
+var VideoSelfieTutorial = ({ config, steps, copy, onStart, isLoading }) => {
+	const { t } = useTranslation();
+	const activeSteps = steps ?? (config ? resolveVideoSelfieSteps(config) : []);
+	const rows = [{
+		key: "permissions",
+		assetKey: "videoSelfie.tutorial.permission",
+		label: copy?.permissionsLabel ?? t("videoSelfie.tutorial.permissions", { defaultValue: "Give recording permissions" })
+	}, ...activeSteps.map((step) => {
+		const meta = STEP_ROWS[step];
+		return {
+			key: step,
+			assetKey: meta.assetKey,
+			label: t(meta.key, { defaultValue: meta.defaultValue })
+		};
+	})];
+	return /* @__PURE__ */ u(Page, {
+		className: "IncodeVideoSelfieTutorialPage",
+		title: copy?.title ?? t("videoSelfie.tutorial.videoCheck", { defaultValue: "Video selfie" }),
+		titleId: "video-selfie-tutorial-heading",
+		subtitle: copy?.subtitle ?? t("videoSelfie.tutorial.legalReason", { defaultValue: "For legal reasons, we must recheck your documents. You'll be requested to:" }),
+		children: [/* @__PURE__ */ u("div", {
+			class: "IncodeVideoSelfieTutorialBody",
+			children: /* @__PURE__ */ u("ul", {
+				class: "IncodeVideoSelfieTutorialSteps",
+				children: rows.map((row) => /* @__PURE__ */ u("li", {
+					class: "IncodeVideoSelfieTutorialStep",
+					children: [/* @__PURE__ */ u(Asset, {
+						name: row.assetKey,
+						class: "IncodeVideoSelfieTutorialStepIcon",
+						default: tutorialDefaults[row.assetKey]
+					}), /* @__PURE__ */ u("span", {
+						class: "IncodeVideoSelfieTutorialStepLabel",
+						children: row.label
+					})]
+				}, row.key))
+			})
+		}), /* @__PURE__ */ u("div", {
+			class: "IncodeVideoSelfieTutorialActions",
+			children: /* @__PURE__ */ u(Button, {
+				class: "IncodeVideoSelfieTutorialStartButton",
+				onClick: onStart,
+				isLoading,
+				children: copy?.startLabel ?? t("videoSelfie.tutorial.startVideoSelfie", { defaultValue: "Start video selfie" })
+			})
+		})]
+	});
+};
+//#endregion
+//#region src/modules/video-selfie/assets/check-circle.svg
+var check_circle_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3ccircle%20cx='16'%20cy='16'%20r='16'%20fill='%23189f60'/%3e%3cpath%20stroke='%23fff'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='2.4'%20d='m10.5%2016.4%203.8%203.8%207.2-8.2'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/failVideoselfieSolid.svg
+var failVideoselfieSolid_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='64'%20height='64'%20fill='none'%20viewBox='0%200%2064%2064'%3e%3cpath%20fill='%23ff5c6f'%20fill-rule='evenodd'%20d='M45%208.5a1.5%201.5%200%200%200%200%203h7a.5.5%200%200%201%20.5.5v7a1.5%201.5%200%200%200%203%200v-7A3.5%203.5%200%200%200%2052%208.5zM55.5%2045a1.5%201.5%200%200%200-3%200v7a.5.5%200%200%201-.5.5h-7a1.5%201.5%200%200%200%200%203h7a3.5%203.5%200%200%200%203.5-3.5zM10%2043.5a1.5%201.5%200%200%201%201.5%201.5v7a.5.5%200%200%200%20.5.5h7a1.5%201.5%200%200%201%200%203h-7A3.5%203.5%200%200%201%208.5%2052v-7a1.5%201.5%200%200%201%201.5-1.5m2-35A3.5%203.5%200%200%200%208.5%2012v7a1.5%201.5%200%200%200%203%200v-7a.5.5%200%200%201%20.5-.5h7a1.5%201.5%200%200%200%200-3z'%20clip-rule='evenodd'%20style='fill:%23ff5c6f;fill-opacity:1'/%3e%3cpath%20fill='%23fff'%20fill-rule='evenodd'%20d='M41.414%2025.414a2%202%200%201%200-2.828-2.828L32%2029.172l-6.586-6.586a2%202%200%201%200-2.828%202.828L29.172%2032l-6.586%206.586a2%202%200%201%200%202.828%202.828L32%2034.828l6.586%206.586a2%202%200%201%200%202.828-2.828L34.828%2032z'%20clip-rule='evenodd'%20style='fill:%23ff5c6f;fill-opacity:1'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/selfieMask.tsx
+/**
+* Gradient stops for the 9px ring, keyed by variant (verified against the
+* Figma ring SVGs). A single stop repeated renders as a solid stroke.
+*/
+var RING_GRADIENT = {
+	idle: ["var(--border-neutral-100-static)", "var(--border-neutral-100-static)"],
+	processing: ["var(--border-brand-500)", "var(--surface-neutral-0-static)"],
+	success: ["var(--border-status-positive-static)", "var(--surface-neutral-0-static)"],
+	error: ["var(--border-status-negative-static)", "var(--border-status-negative-static)"]
+};
+/**
+* Selfie capture mask (latest design): a fullscreen circular cut-out (dark
+* vignette via box-shadow) framed by a chunky 9px gradient ring, with a status
+* line — and, per state, a spinner or a success check — below it. The ring
+* gradient tracks the {@link SelfieMaskVariant}: idle neutral, processing blue,
+* success green, error red.
+*/
+var SelfieMask = ({ variant = "idle", message, onManualCapture }) => {
+	const [fromColor, toColor] = RING_GRADIENT[variant];
+	const gradientId = `IncodeVsSelfieRing-${variant}`;
+	return /* @__PURE__ */ u(k, { children: [/* @__PURE__ */ u("div", {
+		class: "IncodeVsSelfieMask",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ u("svg", {
+			class: "IncodeVsSelfieMaskRing",
+			viewBox: "0 0 335 335",
+			fill: "none",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: [/* @__PURE__ */ u("circle", {
+				cx: "167.5",
+				cy: "167.5",
+				r: "163",
+				stroke: `url(#${gradientId})`,
+				"stroke-width": "9"
+			}), /* @__PURE__ */ u("defs", { children: /* @__PURE__ */ u("linearGradient", {
+				id: gradientId,
+				x1: "27.7485",
+				y1: "34.8117",
+				x2: "246.205",
+				y2: "290.602",
+				gradientUnits: "userSpaceOnUse",
+				children: [/* @__PURE__ */ u("stop", { "stop-color": fromColor }), /* @__PURE__ */ u("stop", {
+					offset: "1",
+					"stop-color": toColor
+				})]
+			}) })]
+		})
+	}), /* @__PURE__ */ u("div", {
+		class: "IncodeVsSelfieMaskFeedback",
+		role: "region",
+		"aria-live": "polite",
+		children: [
+			variant === "processing" ? /* @__PURE__ */ u(LoadingIcon, { size: 64 }) : null,
+			variant === "success" ? /* @__PURE__ */ u(Asset, {
+				name: "videoSelfie.success",
+				class: "IncodeVsSelfieMaskIcon",
+				default: check_circle_default
+			}) : null,
+			variant === "error" ? /* @__PURE__ */ u(Asset, {
+				name: "videoSelfie.fail",
+				class: "IncodeVsSelfieMaskIcon",
+				default: failVideoselfieSolid_default
+			}) : null,
+			/* @__PURE__ */ u("p", {
+				class: "IncodeVsSelfieMaskText",
+				children: message
+			}),
+			onManualCapture && variant !== "processing" && variant !== "success" ? /* @__PURE__ */ u("div", {
+				class: "IncodeVsSelfieManualCapture",
+				children: /* @__PURE__ */ u(ManualCaptureButton, {
+					onClick: onManualCapture,
+					disabled: false
+				})
+			}) : null
+		]
+	})] });
+};
+//#endregion
+//#region src/modules/video-selfie/idFlipModal.tsx
+var animationPromise = null;
+function loadIdFlipAnimation() {
+	animationPromise ??= import("./flip-animation-BU5LNKYx.js").then((module) => module.default);
+	return animationPromise;
+}
+function preloadIdFlipAnimation() {
+	loadIdFlipAnimation();
+}
+var IdFlipModal = ({ onComplete }) => {
+	const { t } = useTranslation();
+	const completionTimer = useTimeoutHandle();
+	const [animationData, setAnimationData] = d(null);
+	const [animationComplete, setAnimationComplete] = d(false);
+	y(() => {
+		let mounted = true;
+		loadIdFlipAnimation().then((data) => {
+			if (mounted) setAnimationData(data);
+		});
+		return () => {
+			mounted = false;
+		};
+	}, []);
+	y(() => {
+		if (animationComplete) completionTimer.schedule(onComplete, 1e3);
+		return completionTimer.clear;
+	}, [
+		animationComplete,
+		completionTimer,
+		onComplete
+	]);
+	const handleAnimationComplete = q(() => {
+		setAnimationComplete(true);
+	}, []);
+	return /* @__PURE__ */ u(Modal.Root, {
+		open: true,
+		dismissible: false,
+		hasBackdrop: false,
+		class: "IncodeVsIdFlipModal",
+		children: /* @__PURE__ */ u(Modal.Content, { children: [/* @__PURE__ */ u(Modal.TitleSection, { children: /* @__PURE__ */ u(Modal.Title, { children: t("idv2.flipAnimation.title") }) }), animationData ? /* @__PURE__ */ u(Lottie, {
+			animationData,
+			loop: false,
+			className: "IncodeVsIdFlipAnimation",
+			onComplete: handleAnimationComplete
+		}) : null] })
+	});
+};
+//#endregion
+//#region src/modules/video-selfie/idMask.tsx
+var IdFeedbackPanel = ({ variant, message }) => {
+	const variantClass = () => {
+		if (variant === "error") return "IncodeVsIdFeedbackError";
+		if (variant === "processing") return "IncodeVsIdFeedbackProcessing";
+		return "IncodeVsIdFeedbackSuccess";
+	};
+	const renderIcon = () => {
+		if (variant === "processing") return /* @__PURE__ */ u(LoadingIcon, {
+			size: 64,
+			primaryClass: "IncodeVsIdFeedbackSpinnerPrimary",
+			secondaryClass: "IncodeVsIdFeedbackSpinnerSecondary"
+		});
+		if (variant === "success") return /* @__PURE__ */ u(SuccessIcon, { size: 32 });
+		return /* @__PURE__ */ u(ErrorIcon, { size: 32 });
+	};
+	return /* @__PURE__ */ u("div", {
+		class: `IncodeVsIdFeedback ${variantClass()}`,
+		role: "status",
+		"aria-live": variant === "error" ? "assertive" : "polite",
+		children: [renderIcon(), /* @__PURE__ */ u("p", { children: message })]
+	});
+};
+function getFrameState(wrongSide, feedback) {
+	if (wrongSide) return "error";
+	if (feedback?.variant === "error") return "error";
+	if (feedback?.variant === "success") return "success";
+	return "idle";
+}
+/**
+* ID-card frame for the Video Selfie flow. Reuses the shared `CameraFrame`
+* (locked, vertical) — the exact frame the standalone ID-capture module draws —
+* laid over the camera with its own dark vignette.
+*/
+var IdMask = ({ mode, wrongSide = false, feedback, orientation = "vertical", onManualCapture }) => {
+	return /* @__PURE__ */ u("div", {
+		class: "IncodeVsIdMask",
+		children: [
+			wrongSide ? /* @__PURE__ */ u(CaptureNotification, {
+				detectionStatus: "wrongSide",
+				mode,
+				isCapturing: false
+			}) : null,
+			!wrongSide && feedback ? /* @__PURE__ */ u(IdFeedbackPanel, { ...feedback }) : null,
+			/* @__PURE__ */ u(CameraFrame, {
+				variant: "locked",
+				orientation,
+				frameState: getFrameState(wrongSide, feedback)
+			}),
+			onManualCapture && feedback?.variant !== "processing" ? /* @__PURE__ */ u("div", {
+				class: "IncodeVsIdManualCapture",
+				children: /* @__PURE__ */ u(ManualCaptureButton$1, { onClick: onManualCapture })
+			}) : null
+		]
+	});
+};
+//#endregion
+//#region src/modules/video-selfie/assets/steps/selfie.svg
+var selfie_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cpath%20fill='%23fff'%20fill-rule='evenodd'%20d='M22.5%204a1%201%200%201%200%200%202H26v3.5a1%201%200%200%200%202%200V6a2%202%200%200%200-2-2zM28%2022.5a1%201%200%201%200-2%200V26h-3.5a1%201%200%200%200%200%202H26a2%202%200%200%200%202-2zm-23-1a1%201%200%200%201%201%201V26h3.5a1%201%200%200%201%200%202H6a2%202%200%200%201-2-2v-3.5a1%201%200%200%201%201-1M6%204a2%202%200%200%200-2%202v3.5a1%201%200%200%200%202%200V6h3.5a1%201%200%201%200%200-2zm10%207a3%203%200%201%200%200%206%203%203%200%200%200%200-6m3.269%206.784a5%205%200%201%200-6.538%200q-.387.195-.756.437c-1.215.799-2.207%201.944-2.869%203.312-.236.488-.065%201.093.383%201.351s1.002.071%201.239-.417a6.3%206.3%200%200%201%202.194-2.533%205.6%205.6%200%200%201%203.06-.934h.035a5.6%205.6%200%200%201%203.061.934%206.3%206.3%200%200%201%202.194%202.533c.237.488.791.675%201.239.417s.62-.863.383-1.351c-.662-1.368-1.654-2.513-2.87-3.312a8%208%200%200%200-.755-.437'%20clip-rule='evenodd'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/idFront.svg
+var idFront_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cpath%20fill='%23fff'%20fill-rule='evenodd'%20d='M5%205a2%202%200%200%200-2%202v18a2%202%200%200%200%202%202h22a2%202%200%200%200%202-2V7a2%202%200%200%200-2-2zm0%202h22v18H5zm4.513%208a2%202%200%201%201%202%202%202%202%200%200%201-2-2m4.8%202.857a4%204%200%201%200-5.6%200q-.135.09-.263.19a5%205%200%200%200-1.78%202.703%201%201%200%201%200%201.937.5A3%203%200%200%201%2011.513%2019a3%203%200%200%201%202.905%202.25%201%201%200%201%200%201.937-.5%205%205%200%200%200-2.043-2.893M19%2013a1%201%200%201%200%200%202h5a1%201%200%201%200%200-2zm0%204a1%201%200%201%200%200%202h5a1%201%200%201%200%200-2z'%20clip-rule='evenodd'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/idBack.svg
+var idBack_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cpath%20fill='%23fff'%20fill-rule='evenodd'%20d='M5%205a2%202%200%200%200-2%202v18a2%202%200%200%200%202%202h22a2%202%200%200%200%202-2V7a2%202%200%200%200-2-2zm0%202h22v18H5zm2%203h2v3H7zm4%200h4v3h-4zm14%200h-7v3h7zM9.5%2010h1v3h-1zm7.5%200h-1v3h1zM7%2021a1%201%200%200%201%201-1h5a1%201%200%201%201%200%202H8a1%201%200%200%201-1-1'%20clip-rule='evenodd'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/document.svg
+var document_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20viewBox='0%200%208.467%208.467'%3e%3cpath%20d='M2.137%207.707a.61.61%200%200%201-.44-.455c-.022-.1-.022-5.76-.001-5.862a.62.62%200%200%201%20.462-.46c.05-.01.494-.015%201.51-.015%201.405%200%201.44%200%201.492.026.077.038%201.663%201.626%201.691%201.694.018.044.02.303.02%202.298%200%201.616-.004%202.269-.014%202.32a.62.62%200%200%201-.462.461c-.05.01-.67.015-2.13.014-1.727%200-2.07-.004-2.128-.02m4.23-.405a.2.2%200%200%200%20.078-.08c.027-.051.027-.073.027-2.182V2.91h-.53c-.572%200-.61-.004-.75-.074a.63.63%200%200%201-.302-.402%206%206%200%200%201-.015-.596v-.525l-1.334.003-1.334.004-.042.03c-.092.065-.085-.19-.081%202.986l.003%202.866.03.042c.064.09-.1.084%202.157.084%202.018%200%202.04%200%202.092-.026M2.99%206.503a.21.21%200%200%201-.112-.172c0-.062.048-.139.106-.172.05-.028.06-.028.892-.028.84%200%20.842%200%20.893.029a.23.23%200%200%201%20.105.17.22.22%200%200%201-.111.173c-.056.027-.076.027-.888.027-.806%200-.832%200-.885-.027m0-.798a.21.21%200%200%201-.112-.173c0-.061.048-.139.106-.171.05-.029.052-.029%201.291-.029h1.241l.052.03a.23.23%200%200%201%20.105.17.22.22%200%200%201-.112.172c-.056.027-.072.028-1.287.028-1.207%200-1.23%200-1.284-.027m0-.799a.21.21%200%200%201-.112-.172c0-.062.048-.14.106-.172.05-.028.052-.028%201.291-.028h1.241l.052.029c.054.03.105.113.105.17a.22.22%200%200%201-.112.173c-.056.027-.072.027-1.287.027-1.207%200-1.23%200-1.284-.027m0-.798a.21.21%200%200%201-.112-.173c0-.061.048-.139.106-.171.05-.029.052-.029%201.291-.029h1.241l.052.03a.23.23%200%200%201%20.105.17.22.22%200%200%201-.112.172c-.056.027-.072.028-1.287.028-1.207%200-1.23%200-1.284-.027m2.743-2.05-.453-.452-.004.103a11%2011%200%200%200%200%20.39c.004.27.006.288.034.327.058.081.077.084.496.085h.379z'%20style='fill:%23fff;fill-opacity:1;stroke-width:.0503003'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/questions.svg
+var questions_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cg%20clip-path='url(%23clip0_5487_3779)'%3e%3cg%20clip-path='url(%23clip1_5487_3779)'%3e%3cpath%20fill='%2320263d'%20fill-rule='evenodd'%20d='M7.526%204.15A1%201%200%200%201%208%205v8a1%201%200%201%201-2%200V6.618l-.553.276a1%201%200%200%201-.894-1.788l2-1a1%201%200%200%201%20.973.043M12%208a1%201%200%200%201%201-1h14a1%201%200%201%201%200%202H13a1%201%200%200%201-1-1m0%208a1%201%200%200%201%201-1h14a1%201%200%201%201%200%202H13a1%201%200%200%201-1-1m1%207a1%201%200%201%200%200%202h14a1%201%200%201%200%200-2zm-3.432-4.542a3%203%200%200%200-.802-.866%203.097%203.097%200%200%200-4.253.584l-.005.006c-.19.245-.341.518-.448.809a1%201%200%200%200%201.88.685%201%201%200%200%201%20.144-.263%201.1%201.1%200%200%201%201.506-.203l.008.006a.96.96%200%200%201%20.198%201.373l-.012.016-3.585%204.796a1%201%200%200%200%20.8%201.599h4a1%201%200%201%200%200-2H6.997l2.384-3.19a2.96%202.96%200%200%200%20.188-3.352'%20clip-rule='evenodd'%20style='fill:%23fff;fill-opacity:1'/%3e%3c/g%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_5487_3779'%3e%3cpath%20fill='%23fff'%20d='M0%200h32v32H0z'/%3e%3c/clipPath%3e%3cclipPath%20id='clip1_5487_3779'%3e%3cpath%20fill='%23fff'%20d='M0%200h32v32H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/consent.svg
+var consent_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cg%20clip-path='url(%23clip0_5487_4295)'%3e%3cg%20clip-path='url(%23clip1_5487_4295)'%3e%3cpath%20fill='%2320263d'%20d='M16%2017.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203zm-5.5%200a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203zm11%200a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203z'%20style='fill:%23fff;fill-opacity:1;stroke:%23fff;stroke-opacity:1'/%3e%3cpath%20stroke='%2320263d'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='2'%20d='M9.991%2026.389a12%2012%200%201%200-4.375-4.375l-1.563%204.669a1%201%200%200%200%201.265%201.265z'%20style='stroke:%23fff;stroke-opacity:1'/%3e%3c/g%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_5487_4295'%3e%3cpath%20fill='%23fff'%20d='M0%200h32v32H0z'/%3e%3c/clipPath%3e%3cclipPath%20id='clip1_5487_4295'%3e%3cpath%20fill='%23fff'%20d='M0%200h32v32H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/check.svg
+var check_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cpath%20stroke='%23fff'%20stroke-linecap='square'%20stroke-width='2'%20d='M21.334%2013.333%2014%2020l-3.333-3.334'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/assets/steps/green-check.svg
+var green_check_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%20fill='none'%20viewBox='0%200%2032%2032'%3e%3cpath%20stroke='%230cd5a2'%20stroke-linecap='square'%20stroke-width='2'%20d='M21.333%2013.333%2014%2020l-3.333-3.334'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/stepsHeader.tsx
+/** Maps each capture step to its header icon. */
+var STEP_ICONS = {
+	selfie: selfie_default,
+	frontId: idFront_default,
+	backId: idBack_default,
+	poa: document_default,
+	questions: questions_default,
+	speech: consent_default
+};
+/**
+* Port of V1's `StepsHeader`, restyled to the latest design: a full-width
+* segmented "ticket" fixed to the top of the capture screen, overlaid
+* transparently on the live camera. Each step is a pill segment with a 32px
+* icon below it — the current step shows its module icon at full opacity,
+* completed steps show a check (half opacity), upcoming steps are faded. When
+* every step is done the pills turn green.
+*/
+var StepsHeader = ({ steps, currentIndex }) => {
+	const { t } = useTranslation();
+	const isFinished = currentIndex >= steps.length;
+	return /* @__PURE__ */ u("ol", {
+		class: cn("IncodeVsStepsHeader", isFinished && "IncodeVsStepsHeaderFinished"),
+		"aria-label": t("videoSelfie.progressSteps", { defaultValue: "Progress steps" }),
+		children: steps.map((step, index) => {
+			const isCurrent = index === currentIndex && !isFinished;
+			const isCompleted = index < currentIndex && !isFinished;
+			const label = t(`videoSelfie.step.${step}`);
+			return /* @__PURE__ */ u("li", {
+				class: cn("IncodeVsStepsHeaderStep", isCompleted && "IncodeVsStepsHeaderStepCompleted", isCurrent && "IncodeVsStepsHeaderStepCurrent"),
+				"aria-current": isCurrent ? "step" : void 0,
+				children: [/* @__PURE__ */ u("span", {
+					class: "IncodeVsStepsHeaderPill",
+					"aria-hidden": "true"
+				}), isFinished ? /* @__PURE__ */ u("img", {
+					src: green_check_default,
+					alt: label
+				}) : isCompleted ? /* @__PURE__ */ u("img", {
+					src: check_default,
+					alt: label
+				}) : isCurrent ? /* @__PURE__ */ u("img", {
+					src: STEP_ICONS[step],
+					alt: label
+				}) : null]
+			}, step);
+		})
+	});
+};
+//#endregion
+//#region src/modules/video-selfie/assets/switch-camera.svg
+var switch_camera_default = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20fill='none'%20overflow='visible'%20preserveAspectRatio='none'%20style='display:block'%20viewBox='0%200%2040%2040'%3e%3cpath%20fill='var(--fill-0,%20white)'%20fill-rule='evenodd'%20d='M19.998%2028.75a6.4%206.4%200%200%201-4.236-1.604%201.247%201.247%200%200%201%20.26-2.052l2.538-1.288a1.251%201.251%200%200%201%201.132%202.23l-.32.163q.308.05.626.05a3.91%203.91%200%200%200%203.907-3.906%201.25%201.25%200%200%201%202.5%200%206.414%206.414%200%200%201-6.407%206.406m-6.405-6.41a6.41%206.41%200%200%201%206.405-6.402c1.564%200%203.07.568%204.239%201.601a1.252%201.252%200%200%201-.262%202.05l-2.537%201.289a1.25%201.25%200%200%201-1.681-.547%201.25%201.25%200%200%201%20.55-1.682l.318-.162a3.908%203.908%200%200%200-4.532%203.853%201.25%201.25%200%200%201-2.5%200m16.334-10.92a2.3%202.3%200%200%201-1.57-.7c-.075-.083-.374-.453-1.064-1.748a4.55%204.55%200%200%200-4.018-2.41h-6.52a4.56%204.56%200%200%200-3.987%202.352c-.725%201.317-1.028%201.707-1.108%201.795-.42.439-.985.694-1.557.719a5.945%205.945%200%200%200-5.936%205.93v9.403c0%204.233%203.443%207.678%207.676%207.678h16.314c4.233%200%207.676-3.445%207.676-7.678v-9.407c0-3.273-2.663-5.935-5.906-5.935'%20clip-rule='evenodd'/%3e%3c/svg%3e";
+//#endregion
+//#region src/modules/video-selfie/switchingCameraScreen.tsx
+var SwitchingCameraScreen = ({ steps, currentIndex, facing }) => {
+	const { t } = useTranslation();
+	const title = facing === "user" ? t("videoSelfie.switchingToFront") : t("videoSelfie.switchingToBack");
+	return /* @__PURE__ */ u(Page, {
+		hideHeader: true,
+		hideFooterBranding: true,
+		className: "IncodeVideoSelfieSwitchingCameraPage",
+		children: /* @__PURE__ */ u("div", {
+			class: "IncodeVideoSelfieSwitchingCamera",
+			children: [/* @__PURE__ */ u(StepsHeader, {
+				steps,
+				currentIndex
+			}), /* @__PURE__ */ u("div", {
+				class: "IncodeVideoSelfieSwitchingCameraContent",
+				role: "status",
+				"aria-live": "polite",
+				children: [/* @__PURE__ */ u("img", {
+					src: switch_camera_default,
+					alt: "",
+					"aria-hidden": true,
+					class: "IncodeVideoSelfieSwitchingCameraIcon"
+				}), /* @__PURE__ */ u(AutoFocusTitle, {
+					className: "IncodeVideoSelfieSwitchingCameraTitle",
+					children: title
+				})]
+			})]
+		})
+	});
+};
+//#endregion
+//#region src/modules/video-selfie/finalSuccessScreen.tsx
+var VideoSelfieFinalSuccessScreen = () => {
+	const { t } = useTranslation();
+	return /* @__PURE__ */ u(Page, {
+		hideHeader: true,
+		children: /* @__PURE__ */ u("div", {
+			class: "IncodeVsFinalSuccess",
+			children: [/* @__PURE__ */ u(SuccessIcon, { size: 40 }), /* @__PURE__ */ u(AutoFocusTitle, {
+				className: "IncodeVsFinalSuccessTitle",
+				children: t("videoSelfie.finalSuccessTitle")
+			})]
+		})
+	});
+};
+//#endregion
+export { IdFlipModal as a, VideoSelfieTutorial as c, IdMask as i, useVideoSelfiePermissions as l, SwitchingCameraScreen as n, preloadIdFlipAnimation as o, StepsHeader as r, SelfieMask as s, VideoSelfieFinalSuccessScreen as t };