@incodetech/web 2.1.1 → 2.2.0-rc.1

package/dist/dropdownComposed-DE-VJgcR.js

@@ -0,0 +1 @@
+import "./dropdownComposed-BXleSN7n.js";

package/dist/dynamic-forms/styles.css

@@ -3,10 +3,28 @@
   margin-top: var(--spacing-24, var(--spacing-24, 24px));
 }
 
+@media (min-width: 48rem) {
+  .IncodeDynamicFormsPage.IncodePageContainer {
+    align-items: stretch;
+  }
+
+  .IncodeDynamicFormsPage .IncodePageInner {
+    height: 100%;
+    min-height: var(--spacing-0, var(--spacing-none, 0px));
+  }
+}
+
 .IncodeDynamicFormsPage .IncodePageContent {
+  padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
   align-items: center;
 }
 
+@media (min-width: 48rem) {
+  .IncodeDynamicFormsPage .IncodePageContent {
+    min-height: var(--spacing-0, var(--spacing-none, 0px));
+  }
+}
+
 .IncodeDynamicFormsPage .IncodeDynamicFormsProgress {
   margin-bottom: var(--spacing-4, var(--spacing-4, 4px));
   text-align: center;
@@ -15,16 +33,24 @@
   color: var(--text-secondary);
 }
 
-.IncodeDynamicFormsPage .IncodeDynamicFormsForm {
-  width: 100%;
-  height: 100%;
-  max-width: var(--incode-form-max-w);
+.IncodeDynamicFormsPage .IncodeDynamicFormsFields {
+  margin-top: var(--spacing-32, var(--spacing-32, 32px));
   flex-direction: column;
+  width: 100%;
   display: flex;
 }
 
-.IncodeDynamicFormsPage .IncodeDynamicFormsForm button {
-  margin-top: auto;
+@media (min-width: 48rem) {
+  .IncodeDynamicFormsPage .IncodeDynamicFormsFields {
+    min-height: var(--spacing-0, var(--spacing-none, 0px));
+    padding-bottom: var(--spacing-8, var(--spacing-8, 8px));
+    flex: 1;
+    overflow-y: auto;
+  }
+}
+
+.IncodeDynamicFormsPage .IncodeDynamicFormsFields {
+  max-width: var(--incode-form-max-w);
 }
 
 .IncodeDynamicFormsPage .IncodeDynamicFormsField {
@@ -35,6 +61,32 @@
   display: flex;
 }
 
+.IncodeDynamicFormsPage .IncodeDynamicFormsField--prefilled .IncodeInputComposedLabel, .IncodeDynamicFormsPage .IncodeDynamicFormsField--prefilled .IncodeDropdownComposedLabel {
+  justify-content: space-between;
+  align-items: baseline;
+  width: 100%;
+  display: flex;
+}
+
+.IncodeDynamicFormsPage .IncodeDynamicFormsField--prefilled .IncodeInputComposedLabelHint, .IncodeDynamicFormsPage .IncodeDynamicFormsField--prefilled .IncodeDropdownComposedLabelHint {
+  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
+}
+
+.IncodeDynamicFormsPage .IncodeDynamicFormsFooter {
+  width: 100%;
+  padding-top: var(--spacing-16, var(--spacing-16, 16px));
+}
+
+@media (min-width: 48rem) {
+  .IncodeDynamicFormsPage .IncodeDynamicFormsFooter {
+    flex-shrink: 0;
+  }
+}
+
+.IncodeDynamicFormsPage .IncodeDynamicFormsFooter {
+  max-width: var(--incode-form-max-w);
+}
+
 .IncodeDynamicFormsPage .IncodeSrOnly {
   clip-path: inset(50%);
   white-space: nowrap;

package/dist/{dynamicForms-BifGbC9F.js → dynamicForms-DU5fT72-.js}

@@ -1,20 +1,17 @@
-import { n as useTranslation } from "./i18n-CU4xq8qC.js";
-import { d as T, m as g, v as u } from "./vendor-preact-DThS2ZQ_.js";
-import { c as useModuleTerminalCallbacks, u as useManager } from "./hooks-CNu7o-v8.js";
-import { t as IncodeComponent } from "./incodeComponent-CfzJGETt.js";
-import { r as Spacer } from "./loadingIcon-B0ysgiNq.js";
-import { t as Page } from "./page-DidH_RkX.js";
-import { t as Button } from "./button-Dz6AsbmF.js";
-import { t as VerificationResult } from "./verificationResult-BWWkmeiA.js";
-import { t as InputComposed } from "./inputComposed-C1R2LAa3.js";
-import { n as countries, t as PhoneInputComposed } from "./phoneInputComposed-DMiXfF-1.js";
-import { t as DropdownComposed } from "./dropdownComposed-CoU0enG6.js";
-import { t as DateInputComposed } from "./dateInputComposed-DuaofcBl.js";
-import { t as registerIncodeModuleElement } from "./incodeModule-B-4_3JrK.js";
-import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-D0RhuMed.js";
-import { t as EmailInput } from "./emailInput-DsLkDtER.js";
-import { formatCPF, isValidCPF } from "@incodetech/core/cpf-ocr";
+import { a as useTranslation } from "./uiConfig-D7ezQeZ7.js";
+import { d as T, m as g, v as u } from "./vendor-preact-mvwZ8mJj.js";
+import { _ as useModuleTerminalCallbacks, o as Page, r as withStandaloneModuleBootstrap, t as IncodeComponent, y as useManager } from "./incodeComponent-B-daxouV.js";
+import { r as Button } from "./incode-logo-cGsd55rc.js";
+import { t as VerificationResult } from "./verificationResult-IUf0w1aR.js";
+import { t as InputComposed } from "./inputComposed-Pp_XN1-h.js";
+import { n as countries, t as PhoneInputComposed } from "./phoneInputComposed-D1ZBsd4S.js";
+import { t as DropdownComposed } from "./dropdownComposed-BXleSN7n.js";
+import { t as DateInputComposed } from "./dateInputComposed-D0WEYWkS.js";
+import { t as registerIncodeModuleElement } from "./incodeModule-uyUrSSUM.js";
+import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-Dx0WS2cR.js";
+import { t as EmailInput } from "./emailInput-mPPvterQ.js";
 import { createDynamicFormsManager } from "@incodetech/core/dynamic-forms";
+import { formatCPF, isValidCPF } from "@incodetech/core/id-ocr";
 //#region src/modules/dynamic-forms/dynamicForms.tsx
 function getEffectiveType(question) {
 	return question.inputType ?? question.overrides ?? "TEXT";
@@ -27,13 +24,14 @@ function getAutocompleteToken(type) {
 		default: return;
 	}
 }
-var QuestionInput = ({ question, value, disabled = false, error, labelHint, onChange, onFormatValidityChange, onBlur }) => {
+var QuestionInput = ({ question, value, disabled = false, error, labelHint, isPrefilled = false, onChange, onFormatValidityChange, onBlur }) => {
 	const { t } = useTranslation();
 	const effectiveType = getEffectiveType(question);
 	const id = `dynamic-form-${question.questionId}`;
 	const label = question.question;
 	const isRequired = !question.isOptional;
 	const autocomplete = getAutocompleteToken(effectiveType);
+	const fieldClass = isPrefilled ? "IncodeDynamicFormsField IncodeDynamicFormsField--prefilled" : "IncodeDynamicFormsField";
 	const isCountryField = effectiveType === "COUNTRY" || effectiveType === "NATIONALITY";
 	const countryOptions = T(() => isCountryField ? countries.map((c) => ({
 		value: c.code,
@@ -49,7 +47,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 			label: t("common.no")
 		}];
 		return /* @__PURE__ */ u("div", {
-			class: "IncodeDynamicFormsField",
+			class: fieldClass,
 			children: /* @__PURE__ */ u(DropdownComposed, {
 				id,
 				"data-testid": id,
@@ -67,7 +65,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		});
 	}
 	if (effectiveType === "DATE") return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		children: /* @__PURE__ */ u(DateInputComposed, {
 			id,
 			"data-testid": id,
@@ -85,7 +83,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		})
 	});
 	if (effectiveType === "PHONE") return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		onFocusOut: () => onBlur?.(question.questionId),
 		children: /* @__PURE__ */ u(PhoneInputComposed, {
 			id,
@@ -105,7 +103,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		})
 	});
 	if (effectiveType === "COUNTRY" || effectiveType === "NATIONALITY") return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		children: /* @__PURE__ */ u(DropdownComposed, {
 			id,
 			"data-testid": id,
@@ -127,7 +125,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 			label: o
 		}));
 		return /* @__PURE__ */ u("div", {
-			class: "IncodeDynamicFormsField",
+			class: fieldClass,
 			children: /* @__PURE__ */ u(DropdownComposed, {
 				id,
 				"data-testid": id,
@@ -145,7 +143,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		});
 	}
 	if (effectiveType === "EMAIL") return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		children: /* @__PURE__ */ u(EmailInput, {
 			id,
 			"data-testid": id,
@@ -163,7 +161,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		})
 	});
 	if (effectiveType === "CPF") return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		children: /* @__PURE__ */ u(InputComposed, {
 			id,
 			"data-testid": id,
@@ -187,7 +185,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		})
 	});
 	if (effectiveType === "NUMBER") return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		children: /* @__PURE__ */ u(InputComposed, {
 			id,
 			"data-testid": id,
@@ -209,7 +207,7 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		})
 	});
 	return /* @__PURE__ */ u("div", {
-		class: "IncodeDynamicFormsField",
+		class: fieldClass,
 		children: /* @__PURE__ */ u(InputComposed, {
 			id,
 			"data-testid": id,
@@ -228,55 +226,57 @@ var QuestionInput = ({ question, value, disabled = false, error, labelHint, onCh
 		})
 	});
 };
-var ScreenForm = ({ screen, answers, validationErrors, canSubmit, isSubmitting = false, onAnswerChange, onAnswerValidityChange, onValidateField, onSubmit }) => {
+var ScreenForm = ({ screen, answers, validationErrors, canSubmit, isSubmitting = false, prefilledQuestionIds, nonEditableQuestionIds, onAnswerChange, onAnswerValidityChange, onValidateField, onSubmit }) => {
 	const { t } = useTranslation();
 	const title = screen.hideTitle ? void 0 : screen.title || t("dynamicForms.title");
 	const titleId = g();
-	const fallbackFormLabel = screen.title || t("dynamicForms.title");
 	const hintMode = T(() => getRequiredHintMode(screen.questions.map((q) => !q.isOptional)), [screen]);
+	const prefilledSet = T(() => new Set(prefilledQuestionIds), [prefilledQuestionIds]);
+	const nonEditableSet = T(() => new Set(nonEditableQuestionIds), [nonEditableQuestionIds]);
 	return /* @__PURE__ */ u(Page, {
 		className: "IncodeDynamicFormsPage",
 		title,
 		titleId: title ? titleId : void 0,
 		hideFooterBranding: true,
 		children: [
-			/* @__PURE__ */ u(Spacer, { size: 32 }),
 			isSubmitting && /* @__PURE__ */ u("div", {
 				role: "status",
 				"aria-live": "polite",
 				class: "IncodeSrOnly",
 				children: t("common.processing")
 			}),
-			/* @__PURE__ */ u("form", {
-				class: "IncodeDynamicFormsForm",
-				onSubmit: (e) => {
-					e.preventDefault();
-					onSubmit();
-				},
-				"aria-labelledby": title ? titleId : void 0,
-				"aria-label": title ? void 0 : fallbackFormLabel,
-				"aria-busy": isSubmitting || void 0,
-				children: [screen.questions.map((question) => {
+			/* @__PURE__ */ u("div", {
+				class: "IncodeDynamicFormsFields",
+				children: screen.questions.map((question) => {
 					const errorKey = validationErrors?.[question.questionId];
+					const isPrefilled = prefilledSet.has(question.questionId);
+					const isReadOnly = nonEditableSet.has(question.questionId);
 					const hint = getFieldHint(hintMode, !question.isOptional);
-					const labelHint = hint ? t(`forms.label.${hint}`) ?? void 0 : void 0;
+					let labelHint;
+					if (isPrefilled) labelHint = t("forms.prefill.fromId") ?? void 0;
+					else if (hint) labelHint = t(`forms.label.${hint}`) ?? void 0;
 					return /* @__PURE__ */ u(QuestionInput, {
 						question,
 						value: answers[question.questionId] ?? "",
-						disabled: isSubmitting,
+						disabled: isSubmitting || isReadOnly,
 						error: errorKey ? t(errorKey) : void 0,
 						labelHint,
+						isPrefilled,
 						onChange: onAnswerChange,
 						onFormatValidityChange: onAnswerValidityChange,
 						onBlur: onValidateField
 					}, question.questionId);
-				}), /* @__PURE__ */ u(Button, {
-					type: "submit",
+				})
+			}),
+			/* @__PURE__ */ u("div", {
+				class: "IncodeDynamicFormsFooter",
+				children: /* @__PURE__ */ u(Button, {
 					"data-testid": "dynamic-forms-submit",
 					disabled: !canSubmit,
 					isLoading: isSubmitting,
+					onClick: onSubmit,
 					children: t("common.continue")
-				})]
+				})
 			})
 		]
 	});
@@ -308,6 +308,8 @@ var DynamicFormsContent = ({ config, manager: externalManager, onFinish }) => {
 			validationErrors: state.validationErrors,
 			canSubmit,
 			isSubmitting,
+			prefilledQuestionIds: state.prefilledQuestionIds,
+			nonEditableQuestionIds: state.nonEditableQuestionIds,
 			onAnswerChange: (questionId, value) => manager.setAnswer(questionId, value),
 			onAnswerValidityChange: (questionId, isValid) => manager.setAnswerValidity(questionId, isValid),
 			onValidateField: (questionId) => manager.validateField(questionId),
@@ -324,6 +326,11 @@ var DynamicFormsContent = ({ config, manager: externalManager, onFinish }) => {
 		onSkip: () => manager.close(),
 		skipLabel: t("common.close")
 	});
+	if (state.status === "attemptsExhausted") return /* @__PURE__ */ u(VerificationResult, {
+		status: "failure",
+		failureTitle: t("forms.loginHintBlocked.title"),
+		errorMessage: t("forms.loginHintBlocked.message")
+	});
 	if (state.status === "finished" || state.status === "closed") return null;
 };
 /**
@@ -351,13 +358,14 @@ var DynamicFormsContent = ({ config, manager: externalManager, onFinish }) => {
 *
 * @see {@link createDynamicFormsManager} for headless usage
 */
-var DynamicForms = ({ config, manager, onFinish }) => {
+var DynamicFormsWithLocalConfig = ({ config, manager, onFinish }) => {
 	return /* @__PURE__ */ u(IncodeComponent, { children: config || manager ? /* @__PURE__ */ u(DynamicFormsContent, {
 		config,
 		manager,
 		onFinish
 	}) : null });
 };
+var DynamicForms = withStandaloneModuleBootstrap(DynamicFormsWithLocalConfig, "DYNAMIC_FORMS", { supportsExternalManager: true });
 registerIncodeModuleElement(DynamicForms, "incode-dynamic-forms");
 //#endregion
 export { DynamicForms };

package/dist/ekyb/ekyb.es.js

@@ -1,2 +1,2 @@
-import { t as EkybModule } from "../ekybModule-DGnTw5UV.js";
+import { t as EkybModule } from "../ekybModule-CMcpoTgh.js";
 export { EkybModule };

package/dist/ekyb/styles.css

@@ -1,12 +1,4 @@
 /*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
 .IncodeEkybPage {
   animation: fadeIn var(--motion-fade-in-duration, .7s) ease-out;
   margin-inline: auto;
@@ -48,27 +40,16 @@
 }
 
 .IncodeEkybPage .IncodeEkybRemoveUbo {
-  cursor: pointer;
-  border-style: var(--tw-border-style);
-  border-width: var(--border-width-none, var(--primitive-border-width-0));
-  --tw-border-style: none;
-  padding: var(--spacing-0, var(--spacing-none, 0px));
   font-family: var(--typography-body-family);
   font-size: var(--typography-body-s-regular-size);
   font-weight: var(--typography-body-s-regular-weight);
   line-height: var(--typography-body-s-regular-line-height);
   letter-spacing: var(--typography-body-s-regular-letter-spacing);
   color: var(--color-text-status-negative, var(--text-status-negative));
-  background-color: #0000;
-  border-style: none;
+  text-decoration-line: none;
 }
 
 .IncodeEkybPage .IncodeEkybAddUbo {
-  cursor: pointer;
-  border-style: var(--tw-border-style);
-  border-width: var(--border-width-none, var(--primitive-border-width-0));
-  --tw-border-style: none;
-  padding-block: var(--spacing-8, var(--spacing-8, 8px));
   text-align: center;
   font-family: var(--typography-button-family);
   font-size: var(--typography-button-m-underlined-size);
@@ -78,8 +59,6 @@
   -webkit-text-decoration-skip-ink: none;
   text-decoration-skip-ink: none;
   color: var(--color-button-primary-surface-default, var(--button-primary-surface-default));
-  background-color: #0000;
-  border-style: none;
   text-decoration-line: underline;
   text-decoration-style: solid;
   text-decoration-thickness: auto;
@@ -131,9 +110,3 @@
     flex-shrink: 0;
   }
 }
-
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}

package/dist/{ekybModule-DGnTw5UV.js → ekybModule-CMcpoTgh.js}

@@ -1,20 +1,18 @@
-import { n as useTranslation } from "./i18n-CU4xq8qC.js";
-import { _ as y, d as T, l as A, v as u, x as k } from "./vendor-preact-DThS2ZQ_.js";
-import { c as useModuleTerminalCallbacks, o as useFormScrollable, u as useManager } from "./hooks-CNu7o-v8.js";
-import { t as IncodeComponent } from "./incodeComponent-CfzJGETt.js";
-import { r as Spacer } from "./loadingIcon-B0ysgiNq.js";
-import { t as Page } from "./page-DidH_RkX.js";
-import "./extensibility-7sRIN0JC.js";
-import { t as Spinner } from "./spinner-BMeIEK1d.js";
-import { t as Button } from "./button-Dz6AsbmF.js";
-import { t as VerificationResult } from "./verificationResult-BWWkmeiA.js";
-import { t as InputComposed } from "./inputComposed-C1R2LAa3.js";
-import { i as translateError, r as FormField } from "./radioGroupComposed-DuQxslB2.js";
-import { t as DropdownComposed } from "./dropdownComposed-CoU0enG6.js";
-import { t as registerIncodeModuleElement } from "./incodeModule-B-4_3JrK.js";
-import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-D0RhuMed.js";
-import { n as AddressAutocomplete, t as getAccessibleOptionLabel } from "./optionAccessibleLabel-gfF-58Mv.js";
-import { t as CountrySelector$1 } from "./countrySelector-SvUOyPo0.js";
+import { a as useTranslation } from "./uiConfig-D7ezQeZ7.js";
+import { S as k, _ as y, d as T, l as A, v as u } from "./vendor-preact-mvwZ8mJj.js";
+import { _ as useModuleTerminalCallbacks, h as useFormScrollable, o as Page, r as withStandaloneModuleBootstrap, t as IncodeComponent, y as useManager } from "./incodeComponent-B-daxouV.js";
+import { t as Spacer } from "./spacer-Bnmh-DfR.js";
+import { t as Spinner } from "./spinner-HP_c74K-.js";
+import { r as Button } from "./incode-logo-cGsd55rc.js";
+import "./extensibility-DBilbbhC.js";
+import { t as VerificationResult } from "./verificationResult-IUf0w1aR.js";
+import { t as InputComposed } from "./inputComposed-Pp_XN1-h.js";
+import { i as translateError, r as FormField } from "./radioGroupComposed-CYPHpI6a.js";
+import { t as DropdownComposed } from "./dropdownComposed-BXleSN7n.js";
+import { t as registerIncodeModuleElement } from "./incodeModule-uyUrSSUM.js";
+import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-Dx0WS2cR.js";
+import { n as AddressAutocomplete, t as getAccessibleOptionLabel } from "./optionAccessibleLabel-Dmz3eRsO.js";
+import { t as CountrySelector$1 } from "./countrySelector-Sd-u1WGf.js";
 import { DEV_ONLY_COUNTRIES, SUPPORTED_COUNTRIES, createEkybManager } from "@incodetech/core/ekyb";
 //#region src/modules/ekyb/countrySelector.tsx
 var CountrySelector = ({ value, onChange }) => {
@@ -71,9 +69,18 @@ var FieldInput = ({ field, value, error, errorParams, country: _country, labelHi
 //#region src/modules/ekyb/uboInputs.tsx
 var UboInputs = ({ ubos, validationErrors, canAddUbo, labelHint, onSetField, onBlur, onAdd, onRemove }) => {
 	const { t } = useTranslation();
+	const containerRef = A(null);
+	const addButtonRef = A(null);
+	const pendingFocusRef = A();
 	const translateError$2 = (err) => translateError(t, err?.key, err?.params);
+	y(() => {
+		if (pendingFocusRef.current === "added-name") containerRef.current?.querySelector(`#ubo-${ubos.length - 1}-name`)?.focus();
+		else if (pendingFocusRef.current === "add-button") addButtonRef.current?.focus();
+		pendingFocusRef.current = void 0;
+	}, [ubos.length]);
 	if (ubos.length === 0) return null;
 	return /* @__PURE__ */ u("div", {
+		ref: containerRef,
 		className: "IncodeEkybUbos",
 		children: [ubos.map((ubo, index) => {
 			const nameLabel = index === 0 ? t("ekyb.uboName") : t("ekyb.uboNameWithNumber", { number: index + 1 });
@@ -108,18 +115,29 @@ var UboInputs = ({ ubos, validationErrors, canAddUbo, labelHint, onSetField, onB
 						onBlur: onBlur ? () => onBlur(`ubo-${index}-surname`) : void 0,
 						"data-testid": `ekyb-ubo-${index}-surname`
 					}),
-					!isFirst && /* @__PURE__ */ u("button", {
-						className: "IncodeEkybRemoveUbo",
-						onClick: () => onRemove(index),
+					!isFirst && /* @__PURE__ */ u(Button, {
+						class: "IncodeEkybRemoveUbo",
+						variant: "link",
+						size: "S",
+						onClick: () => {
+							pendingFocusRef.current = "add-button";
+							onRemove(index);
+						},
 						type: "button",
 						"aria-label": `${t("common.remove")} UBO ${index + 1}`,
 						children: t("common.remove")
 					})
 				]
 			}, ubo.id);
-		}), canAddUbo && /* @__PURE__ */ u("button", {
-			className: "IncodeEkybAddUbo",
-			onClick: onAdd,
+		}), canAddUbo && /* @__PURE__ */ u(Button, {
+			ref: addButtonRef,
+			class: "IncodeEkybAddUbo",
+			variant: "link",
+			size: "S",
+			onClick: () => {
+				pendingFocusRef.current = "added-name";
+				onAdd();
+			},
 			type: "button",
 			"data-testid": "ekyb-add-ubo",
 			children: t("ekyb.addAnotherUbo")
@@ -128,9 +146,13 @@ var UboInputs = ({ ubos, validationErrors, canAddUbo, labelHint, onSetField, onB
 };
 //#endregion
 //#region src/modules/ekyb/ekybModule.tsx
-var EkybContent = ({ config, onFinish }) => {
+var EkybContent = ({ config, manager: externalManager, onFinish }) => {
 	const { t } = useTranslation();
-	const [state, manager] = useManager(() => createEkybManager({ config }));
+	const [state, manager] = useManager(() => {
+		if (externalManager) return externalManager;
+		if (!config) throw new Error("Ekyb config is required when no manager is provided");
+		return createEkybManager({ config });
+	}, { manageLifecycle: !externalManager });
 	useModuleTerminalCallbacks({
 		status: state.status === "closed" ? "finished" : state.status,
 		onFinish
@@ -268,12 +290,14 @@ var EkybForm = ({ state, manager }) => {
 		})]
 	});
 };
-var EkybModule = ({ config, onFinish }) => {
-	return /* @__PURE__ */ u(IncodeComponent, { children: config ? /* @__PURE__ */ u(EkybContent, {
+var EkybModuleWithLocalConfig = ({ config, manager, onFinish }) => {
+	return /* @__PURE__ */ u(IncodeComponent, { children: config || manager ? /* @__PURE__ */ u(EkybContent, {
 		config,
+		manager,
 		onFinish
 	}) : null });
 };
+var EkybModule = withStandaloneModuleBootstrap(EkybModuleWithLocalConfig, "EKYB", { supportsExternalManager: true });
 registerIncodeModuleElement(EkybModule, "incode-ekyb");
 //#endregion
 export { EkybModule as t };

package/dist/ekybModule-CR9A6Fqb.js

@@ -0,0 +1,2 @@
+import { t as EkybModule } from "./ekybModule-CMcpoTgh.js";
+export { EkybModule };

package/dist/ekyc/ekyc.es.js

@@ -1,2 +1,2 @@
-import { t as EkycModule } from "../ekycModule-Dxpdd0ns.js";
+import { t as EkycModule } from "../ekycModule-BTO8iIwh.js";
 export { EkycModule };

package/dist/ekyc/styles.css

@@ -79,9 +79,9 @@
 
 @media (min-width: 768px) {
   .IncodeEkycPage.IncodePageContainer {
-    height: 100dvh;
-    max-height: none;
     margin-top: var(--spacing-0, var(--spacing-none, 0px));
+    height: 100%;
+    max-height: none;
   }
 
   .IncodeEkycPage .IncodePageInner {

package/dist/{ekycModule-Dxpdd0ns.js → ekycModule-BTO8iIwh.js}

@@ -1,23 +1,44 @@
-import { n as useTranslation } from "./i18n-CU4xq8qC.js";
-import { _ as y, d as T, l as A, v as u } from "./vendor-preact-DThS2ZQ_.js";
-import { c as useModuleTerminalCallbacks, o as useFormScrollable, u as useManager } from "./hooks-CNu7o-v8.js";
-import { t as IncodeComponent } from "./incodeComponent-CfzJGETt.js";
-import { t as Page } from "./page-DidH_RkX.js";
-import { t as Spinner } from "./spinner-BMeIEK1d.js";
-import { t as Button } from "./button-Dz6AsbmF.js";
-import { t as VerificationResult } from "./verificationResult-BWWkmeiA.js";
-import { i as translateError, r as FormField, t as RadioGroupComposed } from "./radioGroupComposed-DuQxslB2.js";
-import { t as PhoneInputComposed } from "./phoneInputComposed-DMiXfF-1.js";
-import { t as DropdownComposed } from "./dropdownComposed-CoU0enG6.js";
-import { t as DateInputComposed } from "./dateInputComposed-DuaofcBl.js";
-import { t as registerIncodeModuleElement } from "./incodeModule-B-4_3JrK.js";
-import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-D0RhuMed.js";
-import { n as AddressAutocomplete, t as getAccessibleOptionLabel } from "./optionAccessibleLabel-gfF-58Mv.js";
+import { a as useTranslation } from "./uiConfig-D7ezQeZ7.js";
+import { _ as y, d as T, l as A, v as u } from "./vendor-preact-mvwZ8mJj.js";
+import { _ as useModuleTerminalCallbacks, h as useFormScrollable, o as Page, r as withStandaloneModuleBootstrap, t as IncodeComponent, y as useManager } from "./incodeComponent-B-daxouV.js";
+import { t as Spinner } from "./spinner-HP_c74K-.js";
+import { r as Button } from "./incode-logo-cGsd55rc.js";
+import { t as VerificationResult } from "./verificationResult-IUf0w1aR.js";
+import { i as translateError, r as FormField, t as RadioGroupComposed } from "./radioGroupComposed-CYPHpI6a.js";
+import { t as PhoneInputComposed } from "./phoneInputComposed-D1ZBsd4S.js";
+import { t as DropdownComposed } from "./dropdownComposed-BXleSN7n.js";
+import { t as DateInputComposed } from "./dateInputComposed-D0WEYWkS.js";
+import { t as registerIncodeModuleElement } from "./incodeModule-uyUrSSUM.js";
+import { n as getRequiredHintMode, t as getFieldHint } from "./requiredLabelHint-Dx0WS2cR.js";
+import { n as AddressAutocomplete, t as getAccessibleOptionLabel } from "./optionAccessibleLabel-Dmz3eRsO.js";
 import { createEkycManager } from "@incodetech/core/ekyc";
 //#region src/modules/ekyc/ekycModule.tsx
-var EkycContent = ({ config, onFinish }) => {
+/**
+* WCAG 2.2 SC 1.3.5 (Identify Input Purpose) — maps eKYC field names to the
+* standard HTML `autocomplete` token so browsers/password managers can offer
+* the right value. Only personal-info fields with an unambiguous token are
+* listed; unmapped fields (IDs, SSNs, dropdowns, address-search combobox) fall
+* through to `undefined`.
+*/
+var EKYC_AUTOCOMPLETE_TOKENS = {
+	firstName: "given-name",
+	middleName: "additional-name",
+	surName: "family-name",
+	email: "email",
+	phone: "tel",
+	city: "address-level2",
+	state: "address-level1",
+	postalCode: "postal-code",
+	dateOfBirth: "bday"
+};
+var getEkycAutocomplete = (name) => EKYC_AUTOCOMPLETE_TOKENS[name];
+var EkycContent = ({ config, manager: externalManager, onFinish }) => {
 	const { t } = useTranslation();
-	const [state, manager] = useManager(() => createEkycManager({ config }));
+	const [state, manager] = useManager(() => {
+		if (externalManager) return externalManager;
+		if (!config) throw new Error("Ekyc config is required when no manager is provided");
+		return createEkycManager({ config });
+	}, { manageLifecycle: !externalManager });
 	useModuleTerminalCallbacks({
 		status: state.status === "closed" ? "finished" : state.status,
 		onFinish
@@ -155,6 +176,7 @@ var EkycForm = ({ state, manager }) => {
 						id: `ekyc-${field.name}`,
 						label: dateLabel,
 						labelHint,
+						autoComplete: getEkycAutocomplete(field.name),
 						value: fieldValue,
 						error: translateError$1(fieldError),
 						disabled: isReadonly,
@@ -173,6 +195,7 @@ var EkycForm = ({ state, manager }) => {
 						id: `ekyc-${field.name}`,
 						label: phoneLabel,
 						labelHint,
+						autoComplete: getEkycAutocomplete(field.name),
 						countryCode: fieldsCountry,
 						value: fieldValue,
 						placeholder: field.placeholder,
@@ -207,6 +230,7 @@ var EkycForm = ({ state, manager }) => {
 						name: field.name,
 						label: field.label,
 						displayLabel: field.displayLabel,
+						autoComplete: getEkycAutocomplete(field.name),
 						value: fieldValue,
 						error: fieldError?.key,
 						errorParams: fieldError?.params,
@@ -246,12 +270,14 @@ var EkycForm = ({ state, manager }) => {
 		})]
 	});
 };
-var EkycModule = ({ config, onFinish }) => {
-	return /* @__PURE__ */ u(IncodeComponent, { children: config ? /* @__PURE__ */ u(EkycContent, {
+var EkycModuleWithLocalConfig = ({ config, manager, onFinish }) => {
+	return /* @__PURE__ */ u(IncodeComponent, { children: config || manager ? /* @__PURE__ */ u(EkycContent, {
 		config,
+		manager,
 		onFinish
 	}) : null });
 };
+var EkycModule = withStandaloneModuleBootstrap(EkycModuleWithLocalConfig, "EXTERNAL_VERIFICATION", { supportsExternalManager: true });
 registerIncodeModuleElement(EkycModule, "incode-ekyc");
 //#endregion
 export { EkycModule as t };

package/dist/ekycModule-CewwzYvk.js

@@ -0,0 +1,2 @@
+import { t as EkycModule } from "./ekycModule-BTO8iIwh.js";
+export { EkycModule };

package/dist/electronic-signature/electronic-signature.es.js

@@ -1,2 +1,2 @@
-import { n as ElectronicSignature, t as AeSignature } from "../electronic-signature-Ueoffasr.js";
+import { n as ElectronicSignature, t as AeSignature } from "../electronic-signature-COBKJBjU.js";
 export { AeSignature, ElectronicSignature };