@incodetech/web 2.0.1-rc.0 → 2.1.0-rc.0

package/dist/id-verification/id-verification.es.js

@@ -1,20 +1,24 @@
-import { _ as e, v as t } from "../vendor-preact-D6SntenC.js";
-import { o as n } from "../hooks-BVnGysT7.js";
-import { t as r } from "../incodeComponent-C1o4M0ZK.js";
-import { t as i } from "../spinner-CKnjVHxw.js";
-import { t as a } from "../expiredId-BnmzE8T3.js";
-import { t as o } from "../incodeModule-BqCjVgEI.js";
-import { createIdVerificationManager as s } from "@incodetech/core/id-verification";
+import { v as u } from "../vendor-preact-DThS2ZQ_.js";
+import { c as useManager, o as useModuleTerminalCallbacks } from "../hooks-Da_yP_Dr.js";
+import { t as IncodeComponent } from "../incodeComponent-wfnHlnXx.js";
+import { t as Spinner } from "../spinner-D8a_2LvW.js";
+import { t as ExpiredId } from "../expiredId-Q1t6aVpk.js";
+import { t as registerIncodeModuleElement } from "../incodeModule-BUDoTwT9.js";
+import { createIdVerificationManager } from "@incodetech/core/id-verification";
 //#region src/modules/id-verification/id-verification.tsx
-var c = ({ config: r, onFinish: o }) => {
-	let [c, l] = n(() => s({ config: r }));
-	return e(() => {
-		c.status === "finished" && o?.();
-	}, [c.status, o]), c.status === "expired" ? /* @__PURE__ */ t(a, { onContinue: () => l.continue() }) : /* @__PURE__ */ t(i, { fullScreen: !0 });
-}, l = ({ config: e, onFinish: n }) => /* @__PURE__ */ t(r, { children: e ? /* @__PURE__ */ t(c, {
-	config: e,
-	onFinish: n
+var IdVerificationContent = ({ config, onFinish }) => {
+	const [state, manager] = useManager(() => createIdVerificationManager({ config }));
+	useModuleTerminalCallbacks({
+		status: state.status === "finished" ? "finished" : "loading",
+		onFinish
+	});
+	if (state.status === "expired") return /* @__PURE__ */ u(ExpiredId, { onContinue: () => manager.continue() });
+	return /* @__PURE__ */ u(Spinner, { fullScreen: true });
+};
+var IdVerification = ({ config, onFinish }) => /* @__PURE__ */ u(IncodeComponent, { children: config ? /* @__PURE__ */ u(IdVerificationContent, {
+	config,
+	onFinish
 }) : null });
-o(l, "incode-id-verification");
+registerIncodeModuleElement(IdVerification, "incode-id-verification");
 //#endregion
-export { l as IdVerification };
+export { IdVerification };

package/dist/idOcr-CjGbb4dB.js

@@ -0,0 +1,123 @@
+import { n as useTranslation } from "./i18n-CoCO2ZuN.js";
+import { d as T, v as u } from "./vendor-preact-DThS2ZQ_.js";
+import { c as useManager, o as useModuleTerminalCallbacks } from "./hooks-Da_yP_Dr.js";
+import { t as IncodeComponent } from "./incodeComponent-wfnHlnXx.js";
+import { t as Page } from "./page-DxGQj7Gk.js";
+import "./extensibility-Cs3KQQdC.js";
+import { t as Button } from "./button-CM_hgyIP.js";
+import { t as VerificationResult } from "./verificationResult-Do5SpZ6X.js";
+import { t as InputComposed } from "./inputComposed-CQ4AsvZg.js";
+import { t as RadioGroupComposed } from "./radioGroupComposed-BNuaopVr.js";
+import { t as DateInputComposed } from "./dateInputComposed-C_mh4XBg.js";
+import { t as registerIncodeModuleElement } from "./incodeModule-BUDoTwT9.js";
+import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-DEadtiwx.js";
+import { createIdOcrManager, getOcrFields } from "@incodetech/core/id-ocr";
+//#region src/modules/id-ocr/idOcrForm.tsx
+var TEXT_FIELD_COMPONENTS = {
+	text: InputComposed,
+	date: DateInputComposed
+};
+var IdOcrForm = ({ fields, data, validationErrors, isReadonly, onChange, onBlur, onContinue }) => {
+	const { t } = useTranslation();
+	const hasValidationErrors = validationErrors && Object.keys(validationErrors).length > 0;
+	const visibleFields = fields.filter((field) => {
+		if (field.key === "issuingCountry") return isReadonly === true;
+		if (field.key === "documentNumber" && isReadonly) return !!data.documentNumber;
+		return true;
+	});
+	const mode = T(() => getRequiredHintMode(visibleFields.map((f) => isReadonly ? false : f.required)), [visibleFields, isReadonly]);
+	const renderField = (field) => {
+		const value = data[field.key] ?? "";
+		const fieldErrorKey = validationErrors?.[field.key];
+		const fieldError = fieldErrorKey ? t(fieldErrorKey) : void 0;
+		const isFieldRequired = isReadonly ? false : field.required;
+		const hint = getFieldHint(mode, isFieldRequired);
+		const labelHint = hint ? t(`forms.label.${hint}`) : void 0;
+		if (field.type === "radio") return /* @__PURE__ */ u(RadioGroupComposed, {
+			id: `id-ocr-${field.key}`,
+			class: "IncodeIdOcrRadioGroup",
+			label: t(field.labelKey),
+			labelHint,
+			value,
+			options: (field.options ?? []).map((option) => ({
+				value: option.value,
+				label: t(option.label)
+			})),
+			required: isFieldRequired,
+			disabled: isReadonly,
+			onChange: (next) => onChange(field.key, next)
+		}, field.key);
+		const Component = TEXT_FIELD_COMPONENTS[field.type];
+		const max = (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
+		return /* @__PURE__ */ u(Component, {
+			id: `id-ocr-${field.key}`,
+			label: t(field.labelKey),
+			labelHint,
+			value,
+			disabled: isReadonly,
+			required: isFieldRequired,
+			error: fieldError,
+			showErrorIcon: !!fieldError,
+			onInput: (e) => onChange(field.key, e.target.value),
+			onBlur: isReadonly || !onBlur ? void 0 : () => onBlur(field.key),
+			...field.type === "date" && { max }
+		}, field.key);
+	};
+	return /* @__PURE__ */ u("div", {
+		className: "IncodeIdOcrForm",
+		children: [visibleFields.map(renderField), /* @__PURE__ */ u("div", {
+			className: "IncodeIdOcrButton",
+			children: /* @__PURE__ */ u(Button, {
+				onClick: onContinue,
+				disabled: hasValidationErrors,
+				children: t("common.continue")
+			})
+		})]
+	});
+};
+//#endregion
+//#region src/modules/id-ocr/idOcr.tsx
+var IdOcrContent = ({ config, onFinish }) => {
+	const { t } = useTranslation();
+	const [state, manager] = useManager(() => createIdOcrManager({ config }));
+	useModuleTerminalCallbacks({
+		status: state.status === "finished" ? "finished" : "loading",
+		onFinish
+	});
+	if (state.status === "finished") return null;
+	if (state.status === "success") return /* @__PURE__ */ u(VerificationResult, {
+		status: "success",
+		successTitle: t("idOcr.successTitle")
+	});
+	if (state.status === "error") return /* @__PURE__ */ u(VerificationResult, {
+		status: "failure",
+		onRetry: () => manager.retry()
+	});
+	if (state.status === "loading" || state.status === "submitting") return /* @__PURE__ */ u(VerificationResult, {
+		status: "submitting",
+		submittingTitle: t("common.holdOnASec"),
+		submittingSubtitle: t("idOcr.loadingSubtitle")
+	});
+	if (state.status === "readonly" || state.status === "inputting") return /* @__PURE__ */ u(Page, {
+		title: t("idOcr.title"),
+		className: "IncodeIdOcrPage",
+		hideFooterBranding: true,
+		children: /* @__PURE__ */ u(IdOcrForm, {
+			fields: getOcrFields(config),
+			data: state.formData,
+			validationErrors: state.status === "inputting" ? state.validationErrors : void 0,
+			isReadonly: state.status === "readonly",
+			onChange: (field, value) => manager.setField(field, value),
+			onBlur: state.status === "inputting" ? (field) => manager.validateField(field) : void 0,
+			onContinue: () => manager.continue()
+		}, state.ocrDocument)
+	});
+	return null;
+};
+var IdOcr = ({ config, onFinish }) => /* @__PURE__ */ u(IncodeComponent, { children: config ? /* @__PURE__ */ u(IdOcrContent, {
+	config,
+	onFinish
+}) : null });
+registerIncodeModuleElement(IdOcr, "incode-id-ocr");
+//#endregion
+export { IdOcr };