@incodetech/web 0.0.0-dev-20260608-c8c427ca → 0.0.0-dev-20260609-11ba3e8a

package/dist/flow/flow.es.js

@@ -1,683 +1,787 @@
-import { n as e, o as t } from "../i18n-Kzzvkz94.js";
-import { _ as n, c as r, d as i, l as a, o, p as s, v as c } from "../vendor-preact-D6SntenC.js";
-import { t as l } from "../uiConfig-CwpQ-IM6.js";
-import { c as u } from "../hooks-MxHtZWTS.js";
-import { t as d } from "../incodeComponent-BoFhgK7G.js";
-import { t as f } from "../transitionSpinner-Di3bOyOu.js";
-import { t as p } from "../incodeModule-BiCoAJ5k.js";
-import { _ as m, a as h, c as g, d as _, f as v, h as y, l as b, m as x, n as S, o as C, p as w, r as T, s as E, t as D, u as O, y as k } from "../useModuleLoader-Bqs7fglI.js";
-import { getDeviceClass as A } from "@incodetech/core/device";
-import { getRequiredWasmPipelines as j } from "@incodetech/core/flow";
-import { bootstrapSession as M, refreshQrUrlUuid as N } from "@incodetech/core/session";
+import { n as useTranslation, o as readStoredLanguage } from "../i18n-gTHArCl9.js";
+import { _ as y, c as z, d as T, l as A, o as P, p as d, v as u } from "../vendor-preact-BH7vOa2r.js";
+import { t as setUiConfig } from "../uiConfig-sgEkFuuA.js";
+import { c as useManager } from "../hooks-BtgmGvba.js";
+import { t as IncodeComponent } from "../incodeComponent-CDJxFZvS.js";
+import { t as TransitionSpinner } from "../transitionSpinner-CWhGcr7c.js";
+import { t as registerIncodeModuleElement } from "../incodeModule-DkA_yd0X.js";
+import { _ as warmupWasmIfNeeded, a as resolveApiKey, c as HEADLESS_FLOW_MODULE_KEYS, d as fetchTheme, f as initializeFlowManager, h as preloadRedirectToMobile, l as LAZY_UI_MODULES, m as preloadHomeScreen, n as useModulePreloader, o as extractIncodeStatus, p as preloadFirstModule, r as usePrefetchNextModule, s as UnsupportedModule, t as useModuleLoader, u as createFlowManager, y as TerminalErrorPage } from "../useModuleLoader-CuhHtmgr.js";
+import { getDeviceClass } from "@incodetech/core/device";
+import { getRequiredWasmPipelines } from "@incodetech/core/flow";
+import { bootstrapSession, refreshQrUrlUuid } from "@incodetech/core/session";
 //#region src/shared/processing/useDelayedFlag.ts
-function P(e, t) {
-	let [r, i] = s(!1);
-	return n(() => {
-		if (e === !1) {
-			i(!1);
+/**
+* Returns `true` only once `isTrue` has stayed `true` continuously for
+* `delayMs`. Resets to `false` immediately when `isTrue` flips back.
+*
+* Useful to suppress transient loading indicators when an operation
+* completes faster than the given threshold.
+*/
+function useDelayedFlag(isTrue, delayMs) {
+	const [delayed, setDelayed] = d(false);
+	y(() => {
+		if (isTrue === false) {
+			setDelayed(false);
 			return;
 		}
-		let n = window.setTimeout(() => {
-			i(!0);
-		}, t);
+		const timeoutId = window.setTimeout(() => {
+			setDelayed(true);
+		}, delayMs);
 		return () => {
-			window.clearTimeout(n);
+			window.clearTimeout(timeoutId);
 		};
-	}, [e, t]), r;
+	}, [isTrue, delayMs]);
+	return delayed;
 }
 //#endregion
 //#region src/modules/flow/createFlowSession.ts
-async function F(e, t) {
-	return M(await h(e), {
-		configurationId: e.configurationId,
-		externalId: e.externalId,
-		externalCustomerId: e.externalCustomerId,
-		language: e.lang,
-		customFields: e.customFields,
-		uuid: e.uuid,
-		urlUuid: e.urlUuid,
-		interviewId: e.interviewId,
-		loginHint: e.loginHint,
-		onUrlUuidRefreshed: e.onUrlUuidRefreshed
-	}, t);
+async function createFlowSession(config, signal) {
+	return bootstrapSession(await resolveApiKey(config), {
+		configurationId: config.configurationId,
+		externalId: config.externalId,
+		externalCustomerId: config.externalCustomerId,
+		language: config.lang,
+		customFields: config.customFields,
+		uuid: config.uuid,
+		urlUuid: config.urlUuid,
+		interviewId: config.interviewId,
+		loginHint: config.loginHint,
+		onUrlUuidRefreshed: config.onUrlUuidRefreshed
+	}, signal);
 }
 //#endregion
 //#region src/modules/flow/flowConfig.ts
-function I(e) {
-	return typeof e.token == "string";
+function hasFlowToken(config) {
+	return typeof config.token === "string";
 }
-function L(e) {
-	let t = e;
-	return typeof t.configurationId == "string" && (typeof t.apiKey == "string" || typeof t.clientId == "string");
+function isSelfLoadingFlowConfig(config) {
+	const bootstrapConfig = config;
+	return typeof bootstrapConfig.configurationId === "string" && (typeof bootstrapConfig.apiKey === "string" || typeof bootstrapConfig.clientId === "string");
 }
 //#endregion
 //#region src/modules/flow/preloadFlow.ts
-var R = /* @__PURE__ */ new Map();
-function z(e) {
-	let t = R.get(e);
-	if (!t) throw Error("Preload state not found");
+var preloadCache = /* @__PURE__ */ new Map();
+function createPreloadHandle(token) {
+	const state = preloadCache.get(token);
+	if (!state) throw new Error("Preload state not found");
 	return {
 		get isReady() {
-			return t.status === "ready";
+			return state.status === "ready";
 		},
 		get error() {
-			return t.status === "error" ? t.error ?? null : null;
+			return state.status === "error" ? state.error ?? null : null;
 		},
 		async waitUntilReady() {
-			if (t.status !== "ready") {
-				if (t.status === "error") throw Error(t.error ?? "Preload failed");
-				return t.readyPromise;
-			}
+			if (state.status === "ready") return;
+			if (state.status === "error") throw new Error(state.error ?? "Preload failed");
+			return state.readyPromise;
 		},
 		cancel() {
-			t.status === "loading" && (t.unsubscribe && t.unsubscribe(), t.flowManager.stop(), t.readyReject(/* @__PURE__ */ Error("Preload cancelled")), R.delete(e));
+			if (state.status === "loading") {
+				if (state.unsubscribe) state.unsubscribe();
+				state.flowManager.stop();
+				state.readyReject(/* @__PURE__ */ new Error("Preload cancelled"));
+				preloadCache.delete(token);
+			}
 		}
 	};
 }
-function B(e) {
-	let { token: t } = e;
-	if (e.urlUuid) throw Error("preloadIncodeFlow does not support urlUuid; pass it to <IncodeFlow> directly so the SDK can rotate it on mount.");
-	if (R.has(t)) return z(t);
-	let n, r, i = new Promise((e, t) => {
-		n = e, r = t;
-	}), a = O(e);
-	a.getState().presentation.shouldPrefetchHome && x();
-	let o = {
+function preloadIncodeFlow(config) {
+	const { token } = config;
+	if (config.urlUuid) throw new Error("preloadIncodeFlow does not support urlUuid; pass it to <IncodeFlow> directly so the SDK can rotate it on mount.");
+	if (preloadCache.has(token)) return createPreloadHandle(token);
+	let readyResolve;
+	let readyReject;
+	const readyPromise = new Promise((resolve, reject) => {
+		readyResolve = resolve;
+		readyReject = reject;
+	});
+	const flowManager = createFlowManager(config);
+	if (flowManager.getState().presentation.shouldPrefetchHome) preloadHomeScreen();
+	const state = {
 		status: "loading",
-		flowManager: a,
-		config: e,
-		readyPromise: i,
-		readyResolve: n,
-		readyReject: r
+		flowManager,
+		config,
+		readyPromise,
+		readyResolve,
+		readyReject
 	};
-	return R.set(t, o), (async () => {
+	preloadCache.set(token, state);
+	const preload = async () => {
 		try {
-			await v({
-				token: e.token,
-				lang: e.lang,
-				flowManager: a
+			await initializeFlowManager({
+				token: config.token,
+				lang: config.lang,
+				flowManager
 			});
-			let t = e.disableDashboardTheme ? Promise.resolve({}) : _().then((e) => {
-				o.theme = e.theme, o.uiConfig = e.uiConfig;
+			const themePromise = config.disableDashboardTheme ? Promise.resolve({}) : fetchTheme().then((result) => {
+				state.theme = result.theme;
+				state.uiConfig = result.uiConfig;
+			});
+			state.unsubscribe = flowManager.subscribe((managerState) => {
+				if (managerState.status === "ready") {
+					const readyState = managerState;
+					warmupWasmIfNeeded(readyState, config.wasmConfig);
+					preloadFirstModule(readyState);
+					state.unsubscribe?.();
+					state.unsubscribe = void 0;
+					state.status = "ready";
+					state.readyResolve();
+				} else if (managerState.status === "error") {
+					state.unsubscribe?.();
+					state.unsubscribe = void 0;
+					state.status = "error";
+					state.error = managerState.error;
+					state.readyReject(new Error(managerState.error));
+				}
 			});
-			o.unsubscribe = a.subscribe((t) => {
-				if (t.status === "ready") {
-					let n = t;
-					m(n, e.wasmConfig), w(n), o.unsubscribe?.(), o.unsubscribe = void 0, o.status = "ready", o.readyResolve();
-				} else t.status === "error" && (o.unsubscribe?.(), o.unsubscribe = void 0, o.status = "error", o.error = t.error, o.readyReject(Error(t.error)));
-			}), await t;
-		} catch (e) {
-			o.status = "error", o.error = e instanceof Error ? e.message : "Failed to preload", o.readyReject(e instanceof Error ? e : /* @__PURE__ */ Error("Failed to preload")), R.delete(t);
+			await themePromise;
+		} catch (error) {
+			state.status = "error";
+			state.error = error instanceof Error ? error.message : "Failed to preload";
+			state.readyReject(error instanceof Error ? error : /* @__PURE__ */ new Error("Failed to preload"));
+			preloadCache.delete(token);
 		}
-	})(), z(t);
+	};
+	preload();
+	return createPreloadHandle(token);
 }
-function V(e) {
-	return R.get(e) ?? null;
+function getPreloadedData(token) {
+	return preloadCache.get(token) ?? null;
 }
-function H(e) {
-	let t = V(e);
-	return t && R.delete(e), t;
+function consumePreloadedData(token) {
+	const state = getPreloadedData(token);
+	if (state) preloadCache.delete(token);
+	return state;
 }
 //#endregion
 //#region src/modules/flow/useFlowInitialization.ts
-function U(e) {
-	e.getState().presentation.shouldPrefetchHome && x();
+function maybePreloadHomeScreen(flowManager) {
+	if (flowManager.getState().presentation.shouldPrefetchHome) preloadHomeScreen();
 }
-function W() {
-	A() === "desktop" && y();
+function maybePreloadRedirectToMobile() {
+	if (getDeviceClass() === "desktop") preloadRedirectToMobile();
 }
-function G(e) {
-	let { lang: t, disableDashboardTheme: r, enableHome: i, onError: o, useCPF: c } = e, u = I(e) ? e.token : void 0, d = a(null), [f, p] = s(() => {
-		let t = u ? V(u) : null;
-		if (u && t?.status === "ready") {
-			let e = H(u);
-			if (e) return d.current = e.flowManager, U(e.flowManager), W(), e.uiConfig && l(e.uiConfig), {
-				status: "ready",
-				flowManager: e.flowManager
-			};
+function useFlowInitialization(options) {
+	const { lang, disableDashboardTheme, enableHome, onError, useCPF } = options;
+	const token = hasFlowToken(options) ? options.token : void 0;
+	const flowManagerRef = A(null);
+	const [state, setState] = d(() => {
+		const preloaded = token ? getPreloadedData(token) : null;
+		if (token) {
+			if (preloaded?.status === "ready") {
+				const consumed = consumePreloadedData(token);
+				if (consumed) {
+					flowManagerRef.current = consumed.flowManager;
+					maybePreloadHomeScreen(consumed.flowManager);
+					maybePreloadRedirectToMobile();
+					if (consumed.uiConfig) setUiConfig(consumed.uiConfig);
+					return {
+						status: "ready",
+						flowManager: consumed.flowManager
+					};
+				}
+			}
 		}
-		let n = O({
-			authHint: e.authHint,
-			lang: e.lang,
-			enableHome: e.enableHome,
-			useCPF: e.useCPF
+		const flowManager = createFlowManager({
+			authHint: options.authHint,
+			lang: options.lang,
+			enableHome: options.enableHome,
+			useCPF: options.useCPF
 		});
-		return d.current = n, U(n), W(), t?.status === "error" ? {
+		flowManagerRef.current = flowManager;
+		maybePreloadHomeScreen(flowManager);
+		maybePreloadRedirectToMobile();
+		if (preloaded?.status === "error") return {
 			status: "error",
-			error: t.error ?? "Preload failed",
-			flowManager: n
-		} : {
+			error: preloaded.error ?? "Preload failed",
+			flowManager
+		};
+		return {
 			status: "initializing",
-			flowManager: n
+			flowManager
 		};
-	}), m = a(!1);
-	return n(() => {
-		if (f.status !== "initializing") return;
-		let n = u ? V(u) : null;
-		if (u && n?.status === "loading") {
-			n.readyPromise.then(() => {
-				let e = H(u);
-				e && (d.current = e.flowManager, U(e.flowManager), W(), e.uiConfig && l(e.uiConfig), p({
-					status: "ready",
-					flowManager: e.flowManager
-				}));
-			}).catch((e) => {
-				let t = e instanceof Error ? e.message : "Preload failed", n = C(e);
-				p({
+	});
+	const initStartedRef = A(false);
+	y(() => {
+		if (state.status !== "initializing") return;
+		const preloaded = token ? getPreloadedData(token) : null;
+		if (token && preloaded?.status === "loading") {
+			preloaded.readyPromise.then(() => {
+				const consumed = consumePreloadedData(token);
+				if (consumed) {
+					flowManagerRef.current = consumed.flowManager;
+					maybePreloadHomeScreen(consumed.flowManager);
+					maybePreloadRedirectToMobile();
+					if (consumed.uiConfig) setUiConfig(consumed.uiConfig);
+					setState({
+						status: "ready",
+						flowManager: consumed.flowManager
+					});
+				}
+			}).catch((error) => {
+				const errorMessage = error instanceof Error ? error.message : "Preload failed";
+				const errorCode = extractIncodeStatus(error);
+				setState({
 					status: "error",
-					error: t,
-					errorCode: n,
-					flowManager: f.flowManager
-				}), o?.(t, n);
+					error: errorMessage,
+					errorCode,
+					flowManager: state.flowManager
+				});
+				onError?.(errorMessage, errorCode);
 			});
 			return;
 		}
-		if (m.current) return;
-		m.current = !0;
-		let i = new AbortController(), { signal: a } = i;
-		return (async () => {
+		if (initStartedRef.current) return;
+		initStartedRef.current = true;
+		const abortController = new AbortController();
+		const { signal } = abortController;
+		const initialize = async () => {
 			try {
-				let n;
-				if (I(e)) n = e.token, e.urlUuid && await N({
-					urlUuid: e.urlUuid,
-					onboardingId: null,
-					onRefreshed: e.onUrlUuidRefreshed
-				}, a);
-				else if (L(e)) {
-					let t = await F(e, a);
-					n = t.token, f.flowManager.setEndScreenTexts(t.endScreenTitle ?? null, t.endScreenText ?? null);
-				} else throw Error("Flow requires token, or configurationId with apiKey or clientId");
-				await v({
-					token: n,
-					lang: t,
-					flowManager: f.flowManager
+				let resolvedToken;
+				if (hasFlowToken(options)) {
+					resolvedToken = options.token;
+					if (options.urlUuid) await refreshQrUrlUuid({
+						urlUuid: options.urlUuid,
+						onboardingId: null,
+						onRefreshed: options.onUrlUuidRefreshed
+					}, signal);
+				} else if (isSelfLoadingFlowConfig(options)) {
+					const session = await createFlowSession(options, signal);
+					resolvedToken = session.token;
+					state.flowManager.setEndScreenTexts(session.endScreenTitle ?? null, session.endScreenText ?? null);
+				} else throw new Error("Flow requires token, or configurationId with apiKey or clientId");
+				await initializeFlowManager({
+					token: resolvedToken,
+					lang,
+					flowManager: state.flowManager
 				});
-				let i = r ? Promise.resolve() : _().then((e) => {
-					e.uiConfig && l(e.uiConfig);
-				}), o = f.flowManager.waitForReady();
-				await Promise.all([o, i]), p({
+				const themePromise = disableDashboardTheme ? Promise.resolve() : fetchTheme().then((result) => {
+					if (result.uiConfig) setUiConfig(result.uiConfig);
+				});
+				const flowReadyPromise = state.flowManager.waitForReady();
+				await Promise.all([flowReadyPromise, themePromise]);
+				setState({
 					status: "ready",
-					flowManager: f.flowManager
+					flowManager: state.flowManager
 				});
-			} catch (e) {
-				if (a.aborted) return;
-				let t = e instanceof Error ? e.message : "Failed to initialize SDK", n = C(e);
-				p({
+			} catch (error) {
+				if (signal.aborted) return;
+				const errorMessage = error instanceof Error ? error.message : "Failed to initialize SDK";
+				const errorCode = extractIncodeStatus(error);
+				setState({
 					status: "error",
-					error: t,
-					errorCode: n,
-					flowManager: f.flowManager
-				}), o?.(t, n);
+					error: errorMessage,
+					errorCode,
+					flowManager: state.flowManager
+				});
+				onError?.(errorMessage, errorCode);
 			}
-		})(), () => i.abort();
+		};
+		initialize();
+		return () => abortController.abort();
 	}, [
-		u,
-		t,
-		r,
-		i,
-		c,
-		o,
-		e,
-		f
-	]), f;
+		token,
+		lang,
+		disableDashboardTheme,
+		enableHome,
+		useCPF,
+		onError,
+		options,
+		state
+	]);
+	return state;
 }
 //#endregion
 //#region src/modules/flow/flow.tsx
-var K = r(() => import("../homeScreen-CyPddxWl.js").then((e) => ({ default: e.HomeScreen }))), q = ({ config: r, onFinish: s, onError: l }) => {
-	let { i18n: d } = e(), p = G(i(() => ({
-		...r,
-		onError: l
-	}), [r, l])), [h, _] = u(() => p.flowManager, { autoLoad: !1 }), v = h.presentation.lazyModuleKey, y = h.status === "ready" ? h.currentStep : void 0, C = D({
-		moduleKey: v,
-		modules: b,
-		onModuleLoading: r.onModuleLoading,
-		onModuleLoaded: r.onModuleLoaded,
-		onError: l
+var LazyHomeScreen = z(() => import("../homeScreen-BsEYyiDB.js").then((module) => ({ default: module.HomeScreen })));
+var IncodeFlowContent = ({ config, onFinish, onError }) => {
+	const { i18n } = useTranslation();
+	const initState = useFlowInitialization(T(() => ({
+		...config,
+		onError
+	}), [config, onError]));
+	const [flowState, flowManager] = useManager(() => initState.flowManager, { autoLoad: false });
+	const lazyModuleKey = flowState.presentation.lazyModuleKey;
+	const currentModuleKey = flowState.status === "ready" ? flowState.currentStep : void 0;
+	const moduleLoaderState = useModuleLoader({
+		moduleKey: lazyModuleKey,
+		modules: LAZY_UI_MODULES,
+		onModuleLoading: config.onModuleLoading,
+		onModuleLoaded: config.onModuleLoaded,
+		onError
 	});
-	S({
-		moduleKey: h.status === "ready" && h.homeScreen.visible ? y : void 0,
-		modules: b
+	useModulePreloader({
+		moduleKey: flowState.status === "ready" && flowState.homeScreen.visible ? currentModuleKey : void 0,
+		modules: LAZY_UI_MODULES
 	});
-	let w = C.status === "loaded", O = r.enableHome === !0 && h.status === "ready" && h.flow.disableLaunchScreen !== !0 && h.currentStepIndex === 0 && h.homeScreen.visible === !1 && C.status === "loading", A = P(h.presentation.isAwaitingReady === !0, 150), M = P(h.status === "ready" && (C.status === "idle" || C.status === "loading" || C.status === "error"), 150);
-	T(h?.status === "ready" ? h.steps : [], h?.status === "ready" ? h.currentStepIndex : -1, b, w), n(() => {
-		if (r.onFlowEvent) return _.subscribeFlowEvent(r.onFlowEvent);
-	}, [_, r.onFlowEvent]), n(() => {
-		h.presentation.shouldPrefetchHome && x();
-	}, [h.presentation.shouldPrefetchHome]), n(() => {
-		t() || r.lang && d.language !== r.lang && d.changeLanguage(r.lang);
-	}, [r.lang, d]), n(() => {
-		if (h?.status !== "ready" || h.currentStep === "REDIRECT_TO_MOBILE") return;
-		let e = h, t = j(e.flow);
-		t.length > 0 && (r.onWasmWarmup?.(t), m(e, r.wasmConfig));
-	}, [h, r]);
-	let N = a(!1);
-	n(() => {
-		if (!N.current) {
-			if (h?.status === "finished") {
-				N.current = !0;
-				let e = h.finishStatus;
-				queueMicrotask(() => s(e));
-				return;
-			}
-			if (h?.status === "error" && l) {
-				N.current = !0;
-				let { error: e, errorCode: t } = h;
-				queueMicrotask(() => l(e, t));
-			}
+	const currentModuleLoaded = moduleLoaderState.status === "loaded";
+	const showHomeLoadingScreen = config.enableHome === true && flowState.status === "ready" && flowState.flow.disableLaunchScreen !== true && flowState.currentStepIndex === 0 && flowState.homeScreen.visible === false && moduleLoaderState.status === "loading";
+	const isAwaitingReadyDelayed = useDelayedFlag(flowState.presentation.isAwaitingReady === true, 150);
+	const isModuleLoadingDelayed = useDelayedFlag(flowState.status === "ready" && (moduleLoaderState.status === "idle" || moduleLoaderState.status === "loading" || moduleLoaderState.status === "error"), 150);
+	usePrefetchNextModule(flowState?.status === "ready" ? flowState.steps : [], flowState?.status === "ready" ? flowState.currentStepIndex : -1, LAZY_UI_MODULES, currentModuleLoaded);
+	y(() => {
+		if (!config.onFlowEvent) return;
+		return flowManager.subscribeFlowEvent(config.onFlowEvent);
+	}, [flowManager, config.onFlowEvent]);
+	y(() => {
+		if (flowState.presentation.shouldPrefetchHome) preloadHomeScreen();
+	}, [flowState.presentation.shouldPrefetchHome]);
+	y(() => {
+		if (readStoredLanguage()) return;
+		if (config.lang && i18n.language !== config.lang) i18n.changeLanguage(config.lang);
+	}, [config.lang, i18n]);
+	y(() => {
+		if (flowState?.status !== "ready") return;
+		if (flowState.currentStep === "REDIRECT_TO_MOBILE") return;
+		const readyState = flowState;
+		const requiredPipelines = getRequiredWasmPipelines(readyState.flow);
+		if (requiredPipelines.length > 0) {
+			config.onWasmWarmup?.(requiredPipelines);
+			warmupWasmIfNeeded(readyState, config.wasmConfig);
+		}
+	}, [flowState, config]);
+	const terminalFiredRef = A(false);
+	y(() => {
+		if (terminalFiredRef.current) return;
+		if (flowState?.status === "finished") {
+			terminalFiredRef.current = true;
+			const finishStatus = flowState.finishStatus;
+			queueMicrotask(() => onFinish(finishStatus));
+			return;
+		}
+		if (flowState?.status === "error" && onError) {
+			terminalFiredRef.current = true;
+			const { error, errorCode } = flowState;
+			queueMicrotask(() => onError(error, errorCode));
 		}
 	}, [
-		h?.status,
-		s,
-		l,
-		h
-	]), n(() => {
-		h?.status === "ready" && h.currentStep === "ID" && h.steps.includes("TUTORIAL_ID") && _.completeModule();
-	}, [h, _]);
-	let F = !(r.spinnerConfig?.title || r.spinnerConfig?.subtitle);
-	if (p.status === "error") return /* @__PURE__ */ c("div", {
+		flowState?.status,
+		onFinish,
+		onError,
+		flowState
+	]);
+	y(() => {
+		if (flowState?.status === "ready" && flowState.currentStep === "ID" && flowState.steps.includes("TUTORIAL_ID")) flowManager.completeModule();
+	}, [flowState, flowManager]);
+	const hideSpinnerText = !(config.spinnerConfig?.title || config.spinnerConfig?.subtitle);
+	if (initState.status === "error") return /* @__PURE__ */ u("div", {
 		class: "IncodeFlow",
-		children: /* @__PURE__ */ c(k, { message: p.error })
+		children: /* @__PURE__ */ u(TerminalErrorPage, { message: initState.error })
 	});
-	if (h.homeScreen.visible || O) return /* @__PURE__ */ c("div", {
+	if (flowState.homeScreen.visible || showHomeLoadingScreen) return /* @__PURE__ */ u("div", {
 		class: "IncodeFlow",
-		children: /* @__PURE__ */ c(o, {
+		children: /* @__PURE__ */ u(P, {
 			fallback: null,
-			children: /* @__PURE__ */ c(K, {
-				isContinueLoading: h.homeScreen.isContinueLoading || O,
-				onContinue: () => _.continueFromHome()
+			children: /* @__PURE__ */ u(LazyHomeScreen, {
+				isContinueLoading: flowState.homeScreen.isContinueLoading || showHomeLoadingScreen,
+				onContinue: () => flowManager.continueFromHome()
 			})
 		})
 	});
-	if (p.status === "initializing") return /* @__PURE__ */ c("div", {
+	if (initState.status === "initializing") return /* @__PURE__ */ u("div", {
 		class: "IncodeFlow",
-		children: /* @__PURE__ */ c(f, {
-			spinnerConfig: r.spinnerConfig,
-			hideText: F
+		children: /* @__PURE__ */ u(TransitionSpinner, {
+			spinnerConfig: config.spinnerConfig,
+			hideText: hideSpinnerText
 		})
 	});
-	if (h.presentation.isAwaitingReady) return A ? /* @__PURE__ */ c("div", {
-		class: "IncodeFlow",
-		children: /* @__PURE__ */ c(f, {
-			spinnerConfig: r.spinnerConfig,
-			hideText: F
-		})
-	}) : /* @__PURE__ */ c("div", { class: "IncodeFlow" });
-	if (h.status === "error") return /* @__PURE__ */ c("div", {
-		class: "IncodeFlow",
-		children: /* @__PURE__ */ c(k, { message: h.error })
-	});
-	if (h.status === "finished") return null;
-	if (h?.status === "ready") {
-		let { currentStep: e, config: t, flow: n } = h, { flowId: i } = n;
-		if (!e || !t) return /* @__PURE__ */ c("div", {
+	if (flowState.presentation.isAwaitingReady) {
+		if (!isAwaitingReadyDelayed) return /* @__PURE__ */ u("div", { class: "IncodeFlow" });
+		return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(f, {
-				spinnerConfig: r.spinnerConfig,
-				hideText: F
+			children: /* @__PURE__ */ u(TransitionSpinner, {
+				spinnerConfig: config.spinnerConfig,
+				hideText: hideSpinnerText
 			})
 		});
-		if (g.has(e)) return /* @__PURE__ */ c("div", { class: "IncodeFlow" });
-		if (C.status === "unsupported") return /* @__PURE__ */ c("div", {
+	}
+	if (flowState.status === "error") return /* @__PURE__ */ u("div", {
+		class: "IncodeFlow",
+		children: /* @__PURE__ */ u(TerminalErrorPage, { message: flowState.error })
+	});
+	if (flowState.status === "finished") return null;
+	if (flowState?.status === "ready") {
+		const { currentStep, config: flowConfig, flow } = flowState;
+		const { flowId } = flow;
+		if (!currentStep || !flowConfig) return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(E, {
-				moduleKey: e,
-				onNext: () => _.completeModule()
+			children: /* @__PURE__ */ u(TransitionSpinner, {
+				spinnerConfig: config.spinnerConfig,
+				hideText: hideSpinnerText
 			})
 		});
-		if (C.status === "idle" || C.status === "loading" || C.status === "error") return M ? /* @__PURE__ */ c("div", {
+		if (HEADLESS_FLOW_MODULE_KEYS.has(currentStep)) return /* @__PURE__ */ u("div", { class: "IncodeFlow" });
+		if (moduleLoaderState.status === "unsupported") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(f, {
-				spinnerConfig: r.spinnerConfig,
-				hideText: F
+			children: /* @__PURE__ */ u(UnsupportedModule, {
+				moduleKey: currentStep,
+				onNext: () => flowManager.completeModule()
 			})
-		}) : /* @__PURE__ */ c("div", { class: "IncodeFlow" });
-		let { Component: a } = C;
-		if (e === "REDIRECT_TO_MOBILE") return /* @__PURE__ */ c("div", {
+		});
+		if (moduleLoaderState.status === "idle" || moduleLoaderState.status === "loading" || moduleLoaderState.status === "error") {
+			if (!isModuleLoadingDelayed) return /* @__PURE__ */ u("div", { class: "IncodeFlow" });
+			return /* @__PURE__ */ u("div", {
+				class: "IncodeFlow",
+				children: /* @__PURE__ */ u(TransitionSpinner, {
+					spinnerConfig: config.spinnerConfig,
+					hideText: hideSpinnerText
+				})
+			});
+		}
+		const { Component } = moduleLoaderState;
+		if (currentStep === "REDIRECT_TO_MOBILE") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeFlow(),
-				onContinue: () => _.completeModule(),
-				onError: l
-			}, `redirect-to-mobile-${h.currentStepIndex}`)
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeFlow(),
+				onContinue: () => flowManager.completeModule(),
+				onError
+			}, `redirect-to-mobile-${flowState.currentStepIndex}`)
 		});
-		if (e === "SELFIE") return /* @__PURE__ */ c("div", {
+		if (currentStep === "SELFIE") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Selfie verification error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Selfie verification error");
 				}
-			}, `selfie-${h.currentStepIndex}`)
+			}, `selfie-${flowState.currentStepIndex}`)
 		});
-		if (e === "AUTHENTICATION") return /* @__PURE__ */ c("div", {
+		if (currentStep === "AUTHENTICATION") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
+			children: /* @__PURE__ */ u(Component, {
 				config: {
-					...t,
-					authHint: r.authHint
+					...flowConfig,
+					authHint: config.authHint
 				},
-				onFinish: () => _.completeModule(),
-				onError: (e, t, n) => _.errorModule(e ?? "Authentication error", n)
-			}, `authentication-${h.currentStepIndex}`)
+				onFinish: () => flowManager.completeModule(),
+				onError: (error, _errorCode, moduleErrorCode) => flowManager.errorModule(error ?? "Authentication error", moduleErrorCode)
+			}, `authentication-${flowState.currentStepIndex}`)
 		});
-		if (e === "PHONE") return /* @__PURE__ */ c("div", {
+		if (currentStep === "PHONE") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Phone verification error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Phone verification error");
 				}
-			}, `phone-${h.currentStepIndex}`)
+			}, `phone-${flowState.currentStepIndex}`)
 		});
-		if (e === "EMAIL") {
-			let e = t;
-			return !e || typeof e.otpVerification != "boolean" || typeof e.otpExpirationInMinutes != "number" ? /* @__PURE__ */ c("div", {
+		if (currentStep === "EMAIL") {
+			const emailConfig = flowConfig;
+			if (!emailConfig || typeof emailConfig.otpVerification !== "boolean" || typeof emailConfig.otpExpirationInMinutes !== "number") return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c("div", { children: "Error: Invalid email configuration" })
-			}) : /* @__PURE__ */ c("div", {
+				children: /* @__PURE__ */ u("div", { children: "Error: Invalid email configuration" })
+			});
+			return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c(a, {
-					config: e,
-					onFinish: () => _.completeModule(),
-					onError: (e) => {
-						l?.(e ?? "Email verification error");
+				children: /* @__PURE__ */ u(Component, {
+					config: emailConfig,
+					onFinish: () => flowManager.completeModule(),
+					onError: (error) => {
+						onError?.(error ?? "Email verification error");
 					}
-				}, `email-${h.currentStepIndex}`)
+				}, `email-${flowState.currentStepIndex}`)
 			});
 		}
-		if (e === "ID" || e === "SECOND_ID") {
-			let n = t;
-			return /* @__PURE__ */ c("div", {
+		if (currentStep === "ID" || currentStep === "SECOND_ID") {
+			const idConfig = flowConfig;
+			return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c(a, {
-					config: e === "SECOND_ID" ? {
-						...n,
-						isSecondId: !0
-					} : n,
-					onFinish: () => _.completeModule(),
-					onError: (e) => {
-						l?.(e ?? "ID capture error");
+				children: /* @__PURE__ */ u(Component, {
+					config: currentStep === "SECOND_ID" ? {
+						...idConfig,
+						isSecondId: true
+					} : idConfig,
+					onFinish: () => flowManager.completeModule(),
+					onError: (error) => {
+						onError?.(error ?? "ID capture error");
 					}
-				}, `id-${h.currentStepIndex}`)
+				}, `id-${flowState.currentStepIndex}`)
 			});
 		}
-		if (e === "ID_OCR") {
-			let e = t, n = h.steps.includes("SECOND_ID");
-			return /* @__PURE__ */ c("div", {
+		if (currentStep === "ID_OCR") {
+			const idOcrConfig = flowConfig;
+			const isSecondId = flowState.steps.includes("SECOND_ID");
+			return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c(a, {
+				children: /* @__PURE__ */ u(Component, {
 					config: {
-						...e,
-						secondId: e.secondId ?? n,
-						flowId: i
+						...idOcrConfig,
+						secondId: idOcrConfig.secondId ?? isSecondId,
+						flowId
 					},
-					onFinish: () => _.completeModule(),
-					onError: (e) => {
-						l?.(e ?? "ID OCR error");
+					onFinish: () => flowManager.completeModule(),
+					onError: (error) => {
+						onError?.(error ?? "ID OCR error");
 					}
-				}, `id-ocr-${h.currentStepIndex}`)
+				}, `id-ocr-${flowState.currentStepIndex}`)
 			});
 		}
-		if (e === "CPF_OCR") return /* @__PURE__ */ c("div", {
+		if (currentStep === "CPF_OCR") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "CPF OCR error");
+			children: /* @__PURE__ */ u(Component, {
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "CPF OCR error");
 				}
-			}, `cpf-ocr-${h.currentStepIndex}`)
+			}, `cpf-ocr-${flowState.currentStepIndex}`)
 		});
-		if (e === "FACE_MATCH") return /* @__PURE__ */ c("div", {
+		if (currentStep === "FACE_MATCH") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Face match error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Face match error");
 				}
-			}, `face-match-${h.currentStepIndex}`)
+			}, `face-match-${flowState.currentStepIndex}`)
 		});
-		if (e === "CURP_VALIDATION") return /* @__PURE__ */ c("div", {
+		if (currentStep === "CURP_VALIDATION") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "CURP validation error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "CURP validation error");
 				}
-			}, `curp-validation-${h.currentStepIndex}`)
+			}, `curp-validation-${flowState.currentStepIndex}`)
 		});
-		if (e === "GOVT_VALIDATION_PROVISIONING") return /* @__PURE__ */ c("div", {
+		if (currentStep === "GOVT_VALIDATION_PROVISIONING") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Government validation error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Government validation error");
 				}
-			}, `govt-validation-${h.currentStepIndex}`)
+			}, `govt-validation-${flowState.currentStepIndex}`)
 		});
-		if (e === "INE_VALIDATION") return /* @__PURE__ */ c("div", {
+		if (currentStep === "INE_VALIDATION") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "INE validation error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "INE validation error");
 				}
-			}, `ine-validation-${h.currentStepIndex}`)
+			}, `ine-validation-${flowState.currentStepIndex}`)
 		});
-		if (e === "GEOLOCATION") return /* @__PURE__ */ c("div", {
+		if (currentStep === "GEOLOCATION") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Geolocation error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Geolocation error");
 				}
-			}, `geolocation-${h.currentStepIndex}`)
+			}, `geolocation-${flowState.currentStepIndex}`)
 		});
-		if (e === "EXTERNAL_VERIFICATION") return /* @__PURE__ */ c("div", {
+		if (currentStep === "EXTERNAL_VERIFICATION") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: { flowId: h.flow.flowId },
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "External verification error");
+			children: /* @__PURE__ */ u(Component, {
+				config: { flowId: flowState.flow.flowId },
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "External verification error");
 				}
-			}, `ekyc-${h.currentStepIndex}`)
+			}, `ekyc-${flowState.currentStepIndex}`)
 		});
-		if (e === "DOCUMENT_CAPTURE") return /* @__PURE__ */ c("div", {
+		if (currentStep === "DOCUMENT_CAPTURE") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Document capture error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Document capture error");
 				}
-			}, `document-capture-${h.currentStepIndex}`)
+			}, `document-capture-${flowState.currentStepIndex}`)
 		});
-		if (e === "ADDRESS") return /* @__PURE__ */ c("div", {
+		if (currentStep === "ADDRESS") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
+			children: /* @__PURE__ */ u(Component, {
 				config: {
-					...t,
+					...flowConfig,
 					processingType: "addressStatement"
 				},
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Address capture error");
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Address capture error");
 				}
-			}, `address-${h.currentStepIndex}`)
+			}, `address-${flowState.currentStepIndex}`)
 		});
-		if (e === "SIGNATURE") return /* @__PURE__ */ c("div", {
+		if (currentStep === "SIGNATURE") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Signature capture error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Signature capture error");
 				}
-			}, `signature-${h.currentStepIndex}`)
+			}, `signature-${flowState.currentStepIndex}`)
 		});
-		if (e === "EKYB") {
-			let e = t;
-			return /* @__PURE__ */ c("div", {
+		if (currentStep === "EKYB") {
+			const ekybFlowConfig = flowConfig;
+			return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c(a, {
+				children: /* @__PURE__ */ u(Component, {
 					config: {
-						flowId: i,
-						checkBusinessName: e.checkBusinessName,
-						checkAddress: e.checkAddress,
-						checkTaxId: e.checkTaxId,
-						checkUniqueBeneficialOwner: e.checkUniqueBeneficialOwner
+						flowId,
+						checkBusinessName: ekybFlowConfig.checkBusinessName,
+						checkAddress: ekybFlowConfig.checkAddress,
+						checkTaxId: ekybFlowConfig.checkTaxId,
+						checkUniqueBeneficialOwner: ekybFlowConfig.checkUniqueBeneficialOwner
 					},
-					onFinish: () => _.completeModule(),
-					onError: (e) => {
-						l?.(e ?? "eKYB verification error");
+					onFinish: () => flowManager.completeModule(),
+					onError: (error) => {
+						onError?.(error ?? "eKYB verification error");
 					}
-				}, `ekyb-${h.currentStepIndex}`)
+				}, `ekyb-${flowState.currentStepIndex}`)
 			});
 		}
-		if (e === "COMBINED_CONSENT") return /* @__PURE__ */ c("div", {
+		if (currentStep === "COMBINED_CONSENT") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Combined consent error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Combined consent error");
 				}
-			}, `combined-consent-${h.currentStepIndex}`)
+			}, `combined-consent-${flowState.currentStepIndex}`)
 		});
-		if (e === "MANDATORY_CONSENT" || e === "ML_CONSENT") {
-			let n = e === "ML_CONSENT";
-			return /* @__PURE__ */ c("div", {
+		if (currentStep === "MANDATORY_CONSENT" || currentStep === "ML_CONSENT") {
+			const isMlConsent = currentStep === "ML_CONSENT";
+			return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c(a, {
+				children: /* @__PURE__ */ u(Component, {
 					config: {
-						...t,
-						type: n ? "ML" : "MANDATORY"
+						...flowConfig,
+						type: isMlConsent ? "ML" : "MANDATORY"
 					},
-					onFinish: () => _.completeModule(),
-					onError: (e) => {
-						l?.(e ?? (n ? "ML consent error" : "Mandatory consent error"));
+					onFinish: () => flowManager.completeModule(),
+					onError: (error) => {
+						onError?.(error ?? (isMlConsent ? "ML consent error" : "Mandatory consent error"));
 					}
-				}, `${n ? "ml" : "mandatory"}-consent-${h.currentStepIndex}`)
+				}, `${isMlConsent ? "ml" : "mandatory"}-consent-${flowState.currentStepIndex}`)
 			});
 		}
-		if (e === "AE_SIGNATURE" || e === "QE_SIGNATURE") {
-			let n = t, r = e === "QE_SIGNATURE" ? "qe" : "ae";
-			return /* @__PURE__ */ c("div", {
+		if (currentStep === "AE_SIGNATURE" || currentStep === "QE_SIGNATURE") {
+			const sigConfig = flowConfig;
+			const label = currentStep === "QE_SIGNATURE" ? "qe" : "ae";
+			return /* @__PURE__ */ u("div", {
 				class: "IncodeFlow",
-				children: /* @__PURE__ */ c(a, {
+				children: /* @__PURE__ */ u(Component, {
 					config: {
-						uploadDocument: n.uploadDocument,
-						downloadDocument: n.downloadDocument
+						uploadDocument: sigConfig.uploadDocument,
+						downloadDocument: sigConfig.downloadDocument
 					},
-					onFinish: () => _.completeModule(),
-					onError: (e) => {
-						l?.(e ?? `${r.toUpperCase()} Signature error`);
+					onFinish: () => flowManager.completeModule(),
+					onError: (error) => {
+						onError?.(error ?? `${label.toUpperCase()} Signature error`);
 					}
-				}, `${r}-signature-${h.currentStepIndex}`)
+				}, `${label}-signature-${flowState.currentStepIndex}`)
 			});
 		}
-		if (e === "ANTIFRAUD") return /* @__PURE__ */ c("div", {
+		if (currentStep === "ANTIFRAUD") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Antifraud check error");
+			children: /* @__PURE__ */ u(Component, {
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Antifraud check error");
 				}
-			}, `antifraud-${h.currentStepIndex}`)
+			}, `antifraud-${flowState.currentStepIndex}`)
 		});
-		if (e === "CUSTOM_FIELDS") return /* @__PURE__ */ c("div", {
+		if (currentStep === "CUSTOM_FIELDS") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Custom fields error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Custom fields error");
 				}
-			}, `custom-fields-${h.currentStepIndex}`)
+			}, `custom-fields-${flowState.currentStepIndex}`)
 		});
-		if (e === "WATCHLIST") return /* @__PURE__ */ c("div", {
+		if (currentStep === "WATCHLIST") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Watchlist check error");
+			children: /* @__PURE__ */ u(Component, {
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Watchlist check error");
 				}
-			}, `watchlist-${h.currentStepIndex}`)
+			}, `watchlist-${flowState.currentStepIndex}`)
 		});
-		if (e === "WATCHLIST_BUSINESS") return /* @__PURE__ */ c("div", {
+		if (currentStep === "WATCHLIST_BUSINESS") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Watchlist for business check error");
+			children: /* @__PURE__ */ u(Component, {
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Watchlist for business check error");
 				}
-			}, `watchlist-for-business-${h.currentStepIndex}`)
+			}, `watchlist-for-business-${flowState.currentStepIndex}`)
 		});
-		if (e === "INCODE_WATCHLIST") return /* @__PURE__ */ c("div", {
+		if (currentStep === "INCODE_WATCHLIST") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: t,
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Custom watchlist check error");
+			children: /* @__PURE__ */ u(Component, {
+				config: flowConfig,
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Custom watchlist check error");
 				}
-			}, `incode-watchlist-${h.currentStepIndex}`)
+			}, `incode-watchlist-${flowState.currentStepIndex}`)
 		});
-		if (e === "CROSS_DOCUMENT_DATA_MATCH") return /* @__PURE__ */ c("div", {
+		if (currentStep === "CROSS_DOCUMENT_DATA_MATCH") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Cross document data match error");
+			children: /* @__PURE__ */ u(Component, {
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Cross document data match error");
 				}
-			}, `cross-document-data-match-${h.currentStepIndex}`)
+			}, `cross-document-data-match-${flowState.currentStepIndex}`)
 		});
-		if (e === "FIELD_COMPARISON") return /* @__PURE__ */ c("div", {
+		if (currentStep === "FIELD_COMPARISON") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Field comparison error");
+			children: /* @__PURE__ */ u(Component, {
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Field comparison error");
 				}
-			}, `field-comparison-${h.currentStepIndex}`)
+			}, `field-comparison-${flowState.currentStepIndex}`)
 		});
-		if (e === "DYNAMIC_FORMS") return /* @__PURE__ */ c("div", {
+		if (currentStep === "DYNAMIC_FORMS") return /* @__PURE__ */ u("div", {
 			class: "IncodeFlow",
-			children: /* @__PURE__ */ c(a, {
-				config: { screens: t.screens.map((e) => ({
-					title: e.title,
-					hideTitle: e.hideTitle,
-					questions: e.questions.map((e) => ({
-						questionId: e.questionId,
-						question: e.question,
-						inputType: e.inputType,
-						isOptional: e.isOptional,
-						overrides: e.overrides ?? void 0,
-						isPredefined: e.isPredefined,
-						options: e.options
+			children: /* @__PURE__ */ u(Component, {
+				config: { screens: flowConfig.screens.map((s) => ({
+					title: s.title,
+					hideTitle: s.hideTitle,
+					questions: s.questions.map((q) => ({
+						questionId: q.questionId,
+						question: q.question,
+						inputType: q.inputType,
+						isOptional: q.isOptional,
+						overrides: q.overrides ?? void 0,
+						isPredefined: q.isPredefined,
+						options: q.options
 					}))
 				})) },
-				onFinish: () => _.completeModule(),
-				onError: (e) => {
-					l?.(e ?? "Dynamic forms error");
+				onFinish: () => flowManager.completeModule(),
+				onError: (error) => {
+					onError?.(error ?? "Dynamic forms error");
 				}
-			}, `dynamic-forms-${h.currentStepIndex}`)
+			}, `dynamic-forms-${flowState.currentStepIndex}`)
 		});
 	}
 	return null;
-}, J = ({ config: e, onFinish: t = () => {}, onError: n }) => /* @__PURE__ */ c(d, { children: e ? /* @__PURE__ */ c(q, {
-	config: e,
-	onFinish: t,
-	onError: n
-}) : null });
-p(J, "incode-flow");
+};
+var IncodeFlow = ({ config, onFinish = () => {}, onError }) => {
+	return /* @__PURE__ */ u(IncodeComponent, { children: config ? /* @__PURE__ */ u(IncodeFlowContent, {
+		config,
+		onFinish,
+		onError
+	}) : null });
+};
+registerIncodeModuleElement(IncodeFlow, "incode-flow");
 //#endregion
-export { J as IncodeFlow, B as preloadIncodeFlow };
+export { IncodeFlow, preloadIncodeFlow };