@incodetech/web 0.0.0-dev-20260922-d0252a78 → 0.0.0-dev-20260922-46015ab9

package/dist/flow/flow.es.js

@@ -1,10 +1,10 @@
 import { o as useTranslation, t as setThemeUiConfig, u as readStoredLanguage } from "../uiConfig-CDCUh723.js";
 import { _ as y, a as P, c as A, f as d, s as z, u as T, v as u } from "../vendor-preact-C0jX1Cbq.js";
-import { C as withSessionExpiry, S as useManager, a as ResolvedConfigProvider, d as TransitionSpinner, s as TerminalErrorPage, t as IncodeComponent } from "../incodeComponent-CczO1gui.js";
+import { C as useManager, a as ResolvedConfigProvider, d as TransitionSpinner, s as TerminalErrorPage, t as IncodeComponent, w as withSessionExpiry } from "../incodeComponent-myzNTgon.js";
 import { b as ErrorIcon } from "../icons-WqhnqLRy.js";
-import { t as StatusPage } from "../statusPage-B0sYgTL_.js";
+import { t as StatusPage } from "../statusPage-BqXDBq_C.js";
 import { t as registerIncodeModuleElement } from "../incodeModule-Br_gGyha.js";
-import { a as LAZY_UI_MODULES, c as initializeFlowManager, f as warmupWasmIfNeeded, i as HEADLESS_FLOW_MODULE_KEYS, l as preloadFirstModule, m as resolveSessionLanguage, n as extractIncodeStatus, o as createFlowManager, r as UnsupportedModule, s as fetchTheme, t as resolveApiKey, u as preloadHomeScreen } from "../resolveApiKey-FkPYmv_R.js";
+import { a as LAZY_UI_MODULES, c as initializeFlowManager, f as warmupWasmIfNeeded, i as HEADLESS_FLOW_MODULE_KEYS, l as preloadFirstModule, m as resolveSessionLanguage, n as extractIncodeStatus, o as createFlowManager, r as UnsupportedModule, s as fetchTheme, t as resolveApiKey, u as preloadHomeScreen } from "../resolveApiKey-CHeTCBa_.js";
 import { i as usePrefetchNextModule, n as useModuleLoader, r as useModulePreloader } from "../useModuleLoader-DpcbSKBH.js";
 import { bootstrapSession, refreshQrUrlUuid } from "@incodetech/core/session";
 import { getNextRequiredWasmPipelines } from "@incodetech/core/flow";

package/dist/flow/styles.css

@@ -1789,6 +1789,115 @@
   min-height: var(--id-capture-hint-svg-size);
 }
 
+.IncodeComponent .IncodePermissionInCameraPage .IncodePermissionInCameraContent {
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  animation: incodePermissionInCameraReveal var(--id-tutorial-to-permission-transition-duration) ease-out var(--id-permission-in-camera-reveal-delay) forwards;
+  flex-direction: column;
+  align-items: center;
+  display: flex;
+}
+
+.IncodeComponent .IncodePermissionInCameraPage .IncodePermissionInCameraReservedFooter {
+  visibility: hidden;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .IncodeComponent .IncodePermissionInCameraPage .IncodePermissionInCameraContent {
+    animation-duration: 1ms;
+    animation-delay: 0s;
+  }
+}
+
+@keyframes incodePermissionInCameraReveal {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage {
+  width: 100%;
+  height: 100%;
+  position: relative;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowCaptureLayer, .IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayer, .IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowTutorialLayer {
+  inset: var(--spacing-0, var(--spacing-none, 0px));
+  position: absolute;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowCaptureLayer {
+  z-index: 10;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayer {
+  z-index: 20;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowTutorialLayer {
+  z-index: 30;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayerExiting {
+  pointer-events: none;
+  animation: incodePermissionInCameraToCaptureExit var(--id-permission-in-camera-to-capture-transition-duration) ease-in var(--id-permission-in-camera-to-capture-transition-duration) forwards;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayerExiting .IncodePermissionInCameraHeading {
+  animation: incodePermissionInCameraHeadingExit var(--id-permission-in-camera-to-capture-transition-duration) ease-in forwards;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowTutorialLayerExiting {
+  pointer-events: none;
+  animation: incodeTutorialToPermissionInCameraExit var(--id-tutorial-to-permission-transition-duration) ease-in forwards;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .IncodeComponent .IncodePermissionInCameraFlowPermissionLayerExiting {
+    animation-duration: 1ms;
+    animation-delay: 0s;
+  }
+
+  .IncodeComponent .IncodePermissionInCameraFlowPermissionLayerExiting .IncodePermissionInCameraHeading, .IncodeComponent .IncodePermissionInCameraFlowTutorialLayerExiting {
+    animation-duration: 1ms;
+  }
+}
+
+@keyframes incodeTutorialToPermissionInCameraExit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes incodePermissionInCameraHeadingExit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes incodePermissionInCameraToCaptureExit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
 .IncodeIdProcessingPage .IncodePageInner {
   padding: var(--spacing-0, var(--spacing-none, 0px));
 }

package/dist/geolocation/geolocation.es.js

@@ -1,10 +1,10 @@
 import { a as Trans, o as useTranslation } from "../uiConfig-CDCUh723.js";
 import { S as k, v as u } from "../vendor-preact-C0jX1Cbq.js";
-import { S as useManager, b as useModuleTerminalCallbacks, c as Page, i as withStandaloneModuleBootstrap, t as IncodeComponent } from "../incodeComponent-CczO1gui.js";
+import { C as useManager, c as Page, i as withStandaloneModuleBootstrap, t as IncodeComponent, x as useModuleTerminalCallbacks } from "../incodeComponent-myzNTgon.js";
 import { t as Spacer } from "../spacer-DpwHVn_F.js";
 import { x as Button } from "../icons-WqhnqLRy.js";
-import { t as VerificationResult } from "../verificationResult-DJXxeLz1.js";
-import { t as ConnectionError } from "../connectionError-C2G8CadP.js";
+import { t as VerificationResult } from "../verificationResult-4WY-cpM5.js";
+import { t as ConnectionError } from "../connectionError-BpCFiyxO.js";
 import { t as NumberedStep } from "../numberedStep-C8e_uPaz.js";
 import { t as registerIncodeModuleElement } from "../incodeModule-Br_gGyha.js";
 import { getBrowser, getDeviceClass } from "@incodetech/core/device";

package/dist/government-validation/government-validation.es.js

@@ -1,6 +1,6 @@
 import { o as useTranslation } from "../uiConfig-CDCUh723.js";
 import { v as u } from "../vendor-preact-C0jX1Cbq.js";
-import { S as useManager, b as useModuleTerminalCallbacks, c as Page, d as TransitionSpinner, i as withStandaloneModuleBootstrap, t as IncodeComponent } from "../incodeComponent-CczO1gui.js";
+import { C as useManager, c as Page, d as TransitionSpinner, i as withStandaloneModuleBootstrap, t as IncodeComponent, x as useModuleTerminalCallbacks } from "../incodeComponent-myzNTgon.js";
 import { t as registerIncodeModuleElement } from "../incodeModule-Br_gGyha.js";
 import { createGovernmentValidationManager } from "@incodetech/core/government-validation";
 //#region src/modules/government-validation/governmentIncodeLogo.tsx

package/dist/id/id.es.js

@@ -1,18 +1,20 @@
 import { o as useTranslation } from "../uiConfig-CDCUh723.js";
 import { S as k, _ as y, a as P, c as A, f as d, h as q, s as z, u as T, v as u } from "../vendor-preact-C0jX1Cbq.js";
-import { S as useManager, _ as useIsMobileDeviceWidth, b as useModuleTerminalCallbacks, c as Page, d as TransitionSpinner, f as useFeatureManagement, i as withStandaloneModuleBootstrap, l as VerifiedByIncodeLogo, m as useTimeoutHandle, o as useHasResolvedConfig, t as IncodeComponent } from "../incodeComponent-CczO1gui.js";
+import { C as useManager, c as Page, d as TransitionSpinner, f as useFeatureManagement, h as useTimeoutHandle, i as withStandaloneModuleBootstrap, l as VerifiedByIncodeLogo, m as useAnimationSignal, o as useHasResolvedConfig, p as usePresence, t as IncodeComponent, v as useIsMobileDeviceWidth, x as useModuleTerminalCallbacks } from "../incodeComponent-myzNTgon.js";
 import { d as cn, i as preloadAnimations, r as AnimatedAsset, s as Asset, t as Spacer } from "../spacer-DpwHVn_F.js";
 import { o as TypographyP, t as Title } from "../typography-C5JjJJg7.js";
 import { a as LockIcon, b as ErrorIcon, r as SuccessIcon, x as Button } from "../icons-WqhnqLRy.js";
 import { t as AutoFocusTitle } from "../autoFocusTitle-L-5SobO2.js";
-import { t as Processing } from "../processing-DRfh5Zei.js";
+import { t as Processing } from "../processing-tdGRMchn.js";
 import { t as Modal } from "../modal-rmddy1AH.js";
-import { t as VerificationResult } from "../verificationResult-DJXxeLz1.js";
-import { r as ProgressBar } from "../useCaptureHelpButton-kNEyneL-.js";
-import { a as IdNoAttempts, c as canFlipCapturedCard, d as CAMERA_PERMISSION_UX, f as CONTINUING_TUTORIAL_PHASES, g as PERMISSION_DIALOG_STATUS, h as ID_CAPTURE_STATUS, i as Capture, l as CaptureFrame, m as ID_CAPTURE_LOADING_PHASE, n as Chooser, o as IdExpired, p as EXPERIMENT_LIFECYCLE_STATUS, r as Tutorial, s as IdError, t as FlipAnimation, u as useIdExperiment } from "../flipAnimation-B15YZvFA.js";
+import { t as VerificationResult } from "../verificationResult-4WY-cpM5.js";
+import { n as CaptureFooter, r as ProgressBar } from "../useCaptureHelpButton-BFtgwFjU.js";
+import { _ as ID_CAPTURE_LOADING_PHASE, a as CaptureAutoFocusProvider, c as IdExpired, d as CaptureFrame, f as useIdExperiment, g as EXPERIMENT_LIFECYCLE_STATUS, h as CONTINUING_TUTORIAL_PHASES, i as Capture, l as IdError, m as CAMERA_WARMUP_LOADING_PHASES, n as Chooser, o as getCaptureFrameTitle, p as CAMERA_PERMISSION_UX, r as Tutorial, s as IdNoAttempts, t as FlipAnimation, u as canFlipCapturedCard, v as ID_CAPTURE_STATUS, y as PERMISSION_DIALOG_STATUS } from "../flipAnimation-DhQIQp5j.js";
 import { t as BottomSheet } from "../bottomSheet-CoP3FqnD.js";
-import { i as SvgReloadIcon, n as SvgCheckV2Icon, r as SvgPersonCardIcon } from "../denied-CGmHuKMu.js";
-import { n as PermissionsDialog, t as Permissions } from "../permissions-DzGg4Fc0.js";
+import { n as CameraFrame, t as CameraView } from "../cameraView-BrrXm3pi.js";
+import { n as CameraOverlay, t as CameraOverlayHeader } from "../cameraOverlayHeader-D_ou9DR7.js";
+import { i as SvgReloadIcon, n as SvgCheckV2Icon, r as SvgPersonCardIcon } from "../denied-BHYWuECd.js";
+import { n as PermissionsDialog, t as Permissions } from "../permissions-B0oXKhGP.js";
 import { t as PdfViewer } from "../pdfViewer-S-XOG4NK.js";
 import { t as registerIncodeModuleElement } from "../incodeModule-Br_gGyha.js";
 import { t as SvgIdBackOfCard } from "../id-back-of-card-B6EcmiCs.js";
@@ -1131,14 +1133,22 @@ function createSlots({ manager, stage, howItWorksOpen, onOpenHowItWorks, onClose
 var TutorialWithPermissions = ({ manager, stage }) => {
 	const { t } = useTranslation();
 	const [howItWorksOpen, setHowItWorksOpen] = d(false);
+	const [isAdvancing, setIsAdvancing] = d(false);
 	const isHowItWorks = stage.ux.id === CAMERA_PERMISSION_UX.HOW_IT_WORKS;
-	const isCtaLoading = stage.tutorialPhase !== null ? CONTINUING_TUTORIAL_PHASES.has(stage.tutorialPhase) || stage.ux.id === CAMERA_PERMISSION_UX.PENDING : true;
+	const isPermissionUxPending = stage.ux.id === CAMERA_PERMISSION_UX.PENDING;
+	const isCtaLoading = stage.tutorialPhase !== null ? CONTINUING_TUTORIAL_PHASES.has(stage.tutorialPhase) || isPermissionUxPending || isAdvancing : true;
 	const requestPermissionFromTutorial = () => manager.requestPermission();
 	function handleContinue() {
+		if (isAdvancing) return;
 		if (isHowItWorks) {
 			requestPermissionFromTutorial();
 			return;
 		}
+		if (stage.ux.id === CAMERA_PERMISSION_UX.PERMISSION_IN_CAMERA) {
+			setIsAdvancing(true);
+			manager.continueToPermission();
+			return;
+		}
 		manager.nextStep();
 	}
 	const slots = createSlots({
@@ -1168,6 +1178,158 @@ var TutorialWithPermissions = ({ manager, stage }) => {
 	] });
 };
 //#endregion
+//#region src/modules/id/permissionInCamera/permissionInCamera.tsx
+var PERMISSION_IN_CAMERA_REVEAL_ANIMATION_NAME = "incodePermissionInCameraReveal";
+var PERMISSION_IN_CAMERA_REVEAL_WATCHDOG_MS = 1500;
+var PermissionInCamera = ({ manager, state }) => {
+	const { t } = useTranslation();
+	const [shellReady, setShellReady] = d(false);
+	const requestedAutomaticallyRef = A(false);
+	const hasRenderedRequestingRef = A(false);
+	const permissionStatus = state.status === "permissions" ? state.permissionStatus : void 0;
+	const canRequest = permissionStatus === "idle" || permissionStatus === "motionOnly";
+	if (permissionStatus === "requesting") hasRenderedRequestingRef.current = true;
+	y(() => {
+		if (!shellReady || !canRequest || state.requiresMotionPermissionUserGesture || requestedAutomaticallyRef.current) return;
+		requestedAutomaticallyRef.current = true;
+		manager.requestPermission({ trigger: "automatic" });
+	}, [
+		canRequest,
+		manager,
+		shellReady,
+		state.requiresMotionPermissionUserGesture
+	]);
+	const handleShellAnimationEnd = useAnimationSignal({
+		active: !shellReady,
+		animationName: PERMISSION_IN_CAMERA_REVEAL_ANIMATION_NAME,
+		timeoutMs: PERMISSION_IN_CAMERA_REVEAL_WATCHDOG_MS,
+		onComplete: () => setShellReady(true)
+	});
+	const automaticRequestReturnedToAskable = requestedAutomaticallyRef.current && hasRenderedRequestingRef.current && canRequest;
+	if (canRequest && (automaticRequestReturnedToAskable || state.requiresMotionPermissionUserGesture)) return /* @__PURE__ */ u(Permissions, {
+		manager,
+		permissionStatus
+	});
+	return /* @__PURE__ */ u(Page, {
+		hideHeader: true,
+		hideFooterBranding: true,
+		className: "IncodeIdCapturePage IncodePermissionInCameraPage",
+		"data-testid": "permission-in-camera",
+		"data-permission-status": permissionStatus,
+		children: /* @__PURE__ */ u(CameraView, {
+			stream: void 0,
+			children: /* @__PURE__ */ u(CameraOverlay, {
+				className: "IncodeCaptureOverlayId",
+				children: /* @__PURE__ */ u("div", {
+					class: "IncodePermissionInCameraContent",
+					onAnimationEnd: handleShellAnimationEnd,
+					children: [
+						/* @__PURE__ */ u("div", {
+							class: "IncodeCaptureTopSection",
+							children: /* @__PURE__ */ u(CameraOverlayHeader, {
+								title: getCaptureFrameTitle(t, state.currentMode),
+								subtitle: t("idv2.capture.permissionInCamera.subtitle"),
+								titleId: "permission-in-camera-heading",
+								className: "IncodePermissionInCameraHeading",
+								autoFocusTitle: shellReady
+							})
+						}),
+						/* @__PURE__ */ u(CameraFrame, {
+							variant: "locked",
+							orientation: "horizontal",
+							className: cn(state.currentMode === "passport" && "IncodeCaptureFramePassport")
+						}),
+						/* @__PURE__ */ u("div", {
+							class: "IncodeSrOnly",
+							"aria-live": "polite",
+							"aria-atomic": "true",
+							children: permissionStatus === "requesting" ? t("common.holdOnASec") : ""
+						}),
+						/* @__PURE__ */ u(CaptureFooter, {
+							className: "IncodePermissionInCameraReservedFooter",
+							onOpenHelp: () => void 0,
+							hideActions: true,
+							inactive: true
+						})
+					]
+				})
+			})
+		})
+	});
+};
+//#endregion
+//#region src/modules/id/permissionInCamera/permissionInCameraFlowTransition.tsx
+var PERMISSION_IN_CAMERA_TO_CAPTURE_EXIT_ANIMATION_NAME = "incodePermissionInCameraToCaptureExit";
+var PERMISSION_IN_CAMERA_TO_CAPTURE_EXIT_WATCHDOG_MS = 1e3;
+/**
+* Coordinates the complete Tutorial -> PermissionInCamera -> Capture visual
+* flow. Core still advances synchronously; this component retains each
+* outgoing screen only for its visual and accessibility handoff.
+*/
+var PermissionInCameraFlowTransition = ({ manager, tutorialStage, permissionState, captureState }) => {
+	const lastTutorialStageRef = A(null);
+	const lastPermissionStateRef = A(null);
+	const permissionIsMounted = permissionState !== null;
+	const tutorialOwnsScreen = tutorialStage !== null && !permissionIsMounted;
+	if (tutorialOwnsScreen) lastTutorialStageRef.current = tutorialStage;
+	if (permissionState) lastPermissionStateRef.current = permissionState;
+	const tutorialPresence = usePresence({
+		present: tutorialOwnsScreen,
+		animationName: PERMISSION_IN_CAMERA_REVEAL_ANIMATION_NAME,
+		timeoutMs: PERMISSION_IN_CAMERA_REVEAL_WATCHDOG_MS,
+		skipExit: !permissionIsMounted
+	});
+	const captureIsMounted = captureState !== null;
+	const permissionPresence = usePresence({
+		present: permissionIsMounted,
+		animationName: PERMISSION_IN_CAMERA_TO_CAPTURE_EXIT_ANIMATION_NAME,
+		timeoutMs: PERMISSION_IN_CAMERA_TO_CAPTURE_EXIT_WATCHDOG_MS,
+		skipExit: !captureIsMounted
+	});
+	const isTutorialHandoff = permissionIsMounted && tutorialPresence.phase === "exiting";
+	const isCaptureHandoff = captureIsMounted && permissionPresence.phase === "exiting";
+	const retainedTutorialStage = tutorialPresence.isRendered ? lastTutorialStageRef.current : null;
+	const retainedPermissionState = permissionPresence.isRendered ? lastPermissionStateRef.current : null;
+	const handlePermissionAnimationEnd = (event) => {
+		tutorialPresence.onAnimationEnd(event);
+		permissionPresence.onAnimationEnd(event);
+	};
+	return /* @__PURE__ */ u("div", {
+		class: "IncodePermissionInCameraFlowStage",
+		children: [
+			captureState ? /* @__PURE__ */ u("div", {
+				class: "IncodePermissionInCameraFlowCaptureLayer",
+				"aria-hidden": isCaptureHandoff || void 0,
+				inert: isCaptureHandoff || void 0,
+				children: /* @__PURE__ */ u(CaptureAutoFocusProvider, {
+					enabled: !isCaptureHandoff,
+					children: /* @__PURE__ */ u(Capture, {
+						manager,
+						state: captureState
+					})
+				})
+			}, "capture") : null,
+			retainedPermissionState ? /* @__PURE__ */ u("div", {
+				class: cn("IncodePermissionInCameraFlowPermissionLayer", isCaptureHandoff && "IncodePermissionInCameraFlowPermissionLayerExiting"),
+				"aria-hidden": isTutorialHandoff || void 0,
+				inert: isTutorialHandoff || void 0,
+				onAnimationEnd: handlePermissionAnimationEnd,
+				children: /* @__PURE__ */ u(PermissionInCamera, {
+					manager,
+					state: retainedPermissionState
+				})
+			}, "permission") : null,
+			retainedTutorialStage ? /* @__PURE__ */ u("div", {
+				class: cn("IncodePermissionInCameraFlowTutorialLayer", tutorialPresence.phase === "exiting" && "IncodePermissionInCameraFlowTutorialLayerExiting"),
+				children: /* @__PURE__ */ u(TutorialWithPermissions, {
+					manager,
+					stage: retainedTutorialStage
+				})
+			}, "tutorial") : null
+		]
+	});
+};
+//#endregion
 //#region src/modules/id/experiments/useCameraPermissionUx.ts
 /** Permission surfaces the treatment can alter — the dialog ones, not the full-screen ones. */
 function isPermissionDialogSurface(state) {
@@ -1200,20 +1362,26 @@ function getCameraPermissionExperimentContext(state) {
 	if (!isCameraDocumentType(state.selectedDocumentType)) return;
 	return { tutorialEnabled: state.status === ID_CAPTURE_STATUS.TUTORIAL ? true : state.tutorialEnabled };
 }
-function isCameraPermissionTreatmentSurface(state) {
-	if (state.status === ID_CAPTURE_STATUS.TUTORIAL) return true;
-	if (isPermissionsIdleBlip(state)) return state.tutorialEnabled;
-	return isPermissionDialogSurface(state) && state.tutorialEnabled;
+function resolveCameraPermissionSurface(state) {
+	if (state.status === ID_CAPTURE_STATUS.TUTORIAL) return "tutorialBacked";
+	if (state.status === ID_CAPTURE_STATUS.LOADING) {
+		if (!state.tutorialEnabled) return "none";
+		if (isPermissionsIdleBlip(state)) return "tutorialBacked";
+		return CAMERA_WARMUP_LOADING_PHASES.has(state.phase) ? "permissionInCameraOnly" : "none";
+	}
+	if (isPermissionDialogSurface(state)) return state.tutorialEnabled ? "tutorialBacked" : "none";
+	return "none";
 }
-function collapseCameraPermissionUx(showHowItWorks, showPermissionSheet) {
+function collapseCameraPermissionUx(showHowItWorks, showPermissionSheet, showPermissionInCamera) {
 	if (showHowItWorks) return { id: CAMERA_PERMISSION_UX.HOW_IT_WORKS };
 	if (showPermissionSheet) return { id: CAMERA_PERMISSION_UX.PERMISSION_SHEET };
+	if (showPermissionInCamera) return { id: CAMERA_PERMISSION_UX.PERMISSION_IN_CAMERA };
 	return { id: CAMERA_PERMISSION_UX.CONTROL };
 }
 function useCameraPermissionUx(state) {
 	const experimentContext = getCameraPermissionExperimentContext(state);
 	const experimentEnabled = experimentContext !== void 0;
-	const onTreatmentSurface = experimentEnabled && isCameraPermissionTreatmentSurface(state);
+	const surface = experimentEnabled ? resolveCameraPermissionSurface(state) : "none";
 	const howItWorksExperiment = useIdExperiment({
 		key: "cameraPermissionHowItWorks",
 		enabled: experimentEnabled,
@@ -1224,9 +1392,15 @@ function useCameraPermissionUx(state) {
 		enabled: experimentEnabled,
 		conditions: experimentContext
 	});
-	if (!onTreatmentSurface) return { id: CAMERA_PERMISSION_UX.CONTROL };
-	if (howItWorksExperiment.status === EXPERIMENT_LIFECYCLE_STATUS.PENDING || permissionSheetExperiment.status === EXPERIMENT_LIFECYCLE_STATUS.PENDING) return { id: CAMERA_PERMISSION_UX.PENDING };
-	return collapseCameraPermissionUx(howItWorksExperiment.params.showHowItWorks, permissionSheetExperiment.params.showPermissionSheet);
+	const permissionInCameraExperiment = useIdExperiment({
+		key: "cameraPermissionInCamera",
+		enabled: experimentEnabled,
+		conditions: experimentContext
+	});
+	if (surface === "none") return { id: CAMERA_PERMISSION_UX.CONTROL };
+	if (howItWorksExperiment.status === EXPERIMENT_LIFECYCLE_STATUS.PENDING || permissionSheetExperiment.status === EXPERIMENT_LIFECYCLE_STATUS.PENDING || permissionInCameraExperiment.status === EXPERIMENT_LIFECYCLE_STATUS.PENDING) return { id: CAMERA_PERMISSION_UX.PENDING };
+	const onTutorialBackedSurface = surface === "tutorialBacked";
+	return collapseCameraPermissionUx(onTutorialBackedSurface && howItWorksExperiment.params.showHowItWorks, onTutorialBackedSurface && permissionSheetExperiment.params.showPermissionSheet, permissionInCameraExperiment.params.showPermissionInCamera);
 }
 //#endregion
 //#region src/modules/id/useIdTutorialWithPermissionsUxStage.ts
@@ -1243,16 +1417,7 @@ function isDialogBackdropStatus(ux, permissionStatus) {
 	if (ux.id === CAMERA_PERMISSION_UX.PERMISSION_SHEET) return permissionStatus === PERMISSION_DIALOG_STATUS.IDLE || permissionStatus === PERMISSION_DIALOG_STATUS.MOTION_ONLY || permissionStatus === PERMISSION_DIALOG_STATUS.REQUESTING;
 	return false;
 }
-/**
-* Resolves when `TutorialWithPermissions` should render instead of the plain
-* tutorial or permissions screens.
-*
-* - Default (non-experimental): `state.status === 'tutorial'`.
-* - Camera-permission experiment: permissions dialog with tutorial backdrop
-*   when `tutorialEnabled` and the treatment is not control.
-*/
-function useIdTutorialWithPermissionsUxStage(state) {
-	const ux = useCameraPermissionUx(state);
+function resolveIdTutorialWithPermissionsUxStage(state, ux) {
 	if (state.status === ID_CAPTURE_STATUS.LOADING && state.phase === "permissionsIdle" && state.tutorialEnabled && ux.id !== CAMERA_PERMISSION_UX.CONTROL && ux.id !== CAMERA_PERMISSION_UX.PENDING) return {
 		documentType: state.selectedDocumentType,
 		mode: state.currentMode,
@@ -1277,8 +1442,46 @@ function useIdTutorialWithPermissionsUxStage(state) {
 	return null;
 }
 //#endregion
+//#region src/modules/id/useIdPermissionExperience.ts
+function isCameraWarmupState(state) {
+	return state.status === "loading" && CAMERA_WARMUP_LOADING_PHASES.has(state.phase);
+}
+function resolvePermissionInCameraState(state, cameraPermissionUx, wasPermissionInCameraVisible) {
+	if (cameraPermissionUx.id !== CAMERA_PERMISSION_UX.PERMISSION_IN_CAMERA) return null;
+	if (isPermissionDialogSurface(state)) return state;
+	if (state.status === "loading" && state.phase === "permissionsIdle") return state;
+	if (wasPermissionInCameraVisible && isCameraWarmupState(state)) return state;
+	return null;
+}
+/**
+* Centralizes the ID permission experiments' presentation decisions. The
+* module dispatcher consumes typed surfaces and does not need to know which
+* permission/loading substates belong to IDC-03 or retain handoff history.
+*/
+function useIdPermissionExperience(state) {
+	const cameraPermissionUx = useCameraPermissionUx(state);
+	const tutorialWithPermissionsUxStage = resolveIdTutorialWithPermissionsUxStage(state, cameraPermissionUx);
+	const wasPermissionInCameraVisibleRef = A(false);
+	const permissionInCameraFlowActiveRef = A(false);
+	const permissionInCameraState = resolvePermissionInCameraState(state, cameraPermissionUx, wasPermissionInCameraVisibleRef.current);
+	const isPermissionInCameraVisible = permissionInCameraState !== null;
+	if (isPermissionInCameraVisible) permissionInCameraFlowActiveRef.current = true;
+	else if (state.status !== "capture") permissionInCameraFlowActiveRef.current = false;
+	const permissionInCameraCaptureState = state.status === "capture" && permissionInCameraFlowActiveRef.current ? state : null;
+	y(() => {
+		wasPermissionInCameraVisibleRef.current = isPermissionInCameraVisible;
+	}, [isPermissionInCameraVisible]);
+	return {
+		cameraPermissionUx,
+		tutorialWithPermissionsUxStage,
+		permissionInCameraState,
+		permissionInCameraCaptureState,
+		isPreparingCameraLoader: state.status === "loading" && permissionInCameraState === null && tutorialWithPermissionsUxStage?.ux.id !== CAMERA_PERMISSION_UX.PERMISSION_SHEET
+	};
+}
+//#endregion
 //#region src/modules/id/id.tsx
-var MandatoryConsent = z(() => import("../mandatoryConsent-DGXKEFDs.js").then((module) => ({ default: module.MandatoryConsent })));
+var MandatoryConsent = z(() => import("../mandatoryConsent-BvL4WCr9.js").then((module) => ({ default: module.MandatoryConsent })));
 var IdContent = ({ config, manager: externalManager, onFinish, onError }) => {
 	usePreloadDisplayFont();
 	y(() => {
@@ -1298,13 +1501,22 @@ var IdContent = ({ config, manager: externalManager, onFinish, onError }) => {
 		onFinish,
 		onError
 	});
-	const tutorialWithPermissionsUxStage = useIdTutorialWithPermissionsUxStage(state);
-	const isPreparingCameraLoader = state.status === "loading" && tutorialWithPermissionsUxStage?.ux.id !== CAMERA_PERMISSION_UX.PERMISSION_SHEET;
+	const { tutorialWithPermissionsUxStage, permissionInCameraState, permissionInCameraCaptureState, isPreparingCameraLoader } = useIdPermissionExperience(state);
 	const { params: darkCameraLoadingParams } = useIdExperiment({
 		key: "darkCameraLoading",
 		enabled: isPreparingCameraLoader
 	});
 	if (state.status === "idle") return /* @__PURE__ */ u(TransitionSpinner, { renderMode: "spinnerOnly" });
+	if (tutorialWithPermissionsUxStage?.ux.id === CAMERA_PERMISSION_UX.PERMISSION_IN_CAMERA || permissionInCameraState !== null || permissionInCameraCaptureState !== null) return /* @__PURE__ */ u(PermissionInCameraFlowTransition, {
+		manager,
+		tutorialStage: tutorialWithPermissionsUxStage,
+		permissionState: permissionInCameraState,
+		captureState: permissionInCameraCaptureState
+	});
+	if (tutorialWithPermissionsUxStage) return /* @__PURE__ */ u(TutorialWithPermissions, {
+		manager,
+		stage: tutorialWithPermissionsUxStage
+	});
 	if (isPreparingCameraLoader) return /* @__PURE__ */ u(TransitionSpinner, {
 		titleKey: "loadingCircle.holdOn",
 		subtitleKey: "loadingCircle.preparingCamera",
@@ -1315,10 +1527,6 @@ var IdContent = ({ config, manager: externalManager, onFinish, onError }) => {
 		state
 	});
 	if (state.status === "ageVerification") return /* @__PURE__ */ u(AgeVerification, { manager });
-	if (tutorialWithPermissionsUxStage) return /* @__PURE__ */ u(TutorialWithPermissions, {
-		manager,
-		stage: tutorialWithPermissionsUxStage
-	});
 	if (state.status === "permissions") return /* @__PURE__ */ u(Permissions, {
 		manager,
 		permissionStatus: state.permissionStatus

package/dist/id/styles.css

@@ -860,6 +860,115 @@
   min-height: var(--id-capture-hint-svg-size);
 }
 
+.IncodeComponent .IncodePermissionInCameraPage .IncodePermissionInCameraContent {
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  animation: incodePermissionInCameraReveal var(--id-tutorial-to-permission-transition-duration) ease-out var(--id-permission-in-camera-reveal-delay) forwards;
+  flex-direction: column;
+  align-items: center;
+  display: flex;
+}
+
+.IncodeComponent .IncodePermissionInCameraPage .IncodePermissionInCameraReservedFooter {
+  visibility: hidden;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .IncodeComponent .IncodePermissionInCameraPage .IncodePermissionInCameraContent {
+    animation-duration: 1ms;
+    animation-delay: 0s;
+  }
+}
+
+@keyframes incodePermissionInCameraReveal {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage {
+  width: 100%;
+  height: 100%;
+  position: relative;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowCaptureLayer, .IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayer, .IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowTutorialLayer {
+  inset: var(--spacing-0, var(--spacing-none, 0px));
+  position: absolute;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowCaptureLayer {
+  z-index: 10;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayer {
+  z-index: 20;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowTutorialLayer {
+  z-index: 30;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayerExiting {
+  pointer-events: none;
+  animation: incodePermissionInCameraToCaptureExit var(--id-permission-in-camera-to-capture-transition-duration) ease-in var(--id-permission-in-camera-to-capture-transition-duration) forwards;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowPermissionLayerExiting .IncodePermissionInCameraHeading {
+  animation: incodePermissionInCameraHeadingExit var(--id-permission-in-camera-to-capture-transition-duration) ease-in forwards;
+}
+
+.IncodeComponent .IncodePermissionInCameraFlowStage > .IncodePermissionInCameraFlowTutorialLayerExiting {
+  pointer-events: none;
+  animation: incodeTutorialToPermissionInCameraExit var(--id-tutorial-to-permission-transition-duration) ease-in forwards;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .IncodeComponent .IncodePermissionInCameraFlowPermissionLayerExiting {
+    animation-duration: 1ms;
+    animation-delay: 0s;
+  }
+
+  .IncodeComponent .IncodePermissionInCameraFlowPermissionLayerExiting .IncodePermissionInCameraHeading, .IncodeComponent .IncodePermissionInCameraFlowTutorialLayerExiting {
+    animation-duration: 1ms;
+  }
+}
+
+@keyframes incodeTutorialToPermissionInCameraExit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes incodePermissionInCameraHeadingExit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes incodePermissionInCameraToCaptureExit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
 .IncodeIdProcessingPage .IncodePageInner {
   padding: var(--spacing-0, var(--spacing-none, 0px));
 }