@incodetech/web 2.1.0-rc.1 → 2.1.0-rc.3

package/dist/phone/phone.es.js

@@ -1,14 +1,14 @@
-import { n as useTranslation } from "../i18n-CoCO2ZuN.js";
+import { n as useTranslation } from "../i18n-CU4xq8qC.js";
 import { h as q, v as u } from "../vendor-preact-DThS2ZQ_.js";
-import { a as isTerminalModuleState, c as useManager, o as useModuleTerminalCallbacks } from "../hooks-Da_yP_Dr.js";
-import { t as IncodeComponent } from "../incodeComponent-wfnHlnXx.js";
+import { c as useModuleTerminalCallbacks, s as isTerminalModuleState, 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-DxGQj7Gk.js";
-import { t as Button } from "../button-CM_hgyIP.js";
-import { t as OtpInput } from "../otpInput-_JmtVwa0.js";
-import { t as Checkbox } from "../checkbox-BoeLHKgp.js";
-import { t as PhoneInputComposed } from "../phoneInputComposed-DjNdsmPE.js";
-import { t as registerIncodeModuleElement } from "../incodeModule-BUDoTwT9.js";
+import { t as Page } from "../page-DidH_RkX.js";
+import { t as Button } from "../button-Dz6AsbmF.js";
+import { t as OtpInput } from "../otpInput-CnDc6pQm.js";
+import { t as Checkbox } from "../checkbox-1wUHSoaK.js";
+import { t as PhoneInputComposed } from "../phoneInputComposed-DMiXfF-1.js";
+import { t as registerIncodeModuleElement } from "../incodeModule-B-4_3JrK.js";
 import { createPhoneManager } from "@incodetech/core/phone";
 //#region src/modules/phone/phone.tsx
 /**

package/dist/{phoneInputComposed-DjNdsmPE.js → phoneInputComposed-DMiXfF-1.js}

@@ -1,9 +1,9 @@
 import { _ as y, a as D, d as T, h as q, l as A, p as d, v as u, x as k } from "./vendor-preact-DThS2ZQ_.js";
-import { t as ErrorIcon } from "./errorIcon-DJRZpd8j.js";
-import "./icons-Dbs9ZfYM.js";
-import { t as SuccessIcon } from "./successIcon-BAyDPT7I.js";
-import { t as InputComposed } from "./inputComposed-CQ4AsvZg.js";
-import { t as DropdownComposed } from "./dropdownComposed-_fgAlo_C.js";
+import { t as ErrorIcon } from "./errorIcon-BA4T6iy-.js";
+import "./icons-CJJbIpBq.js";
+import { t as SuccessIcon } from "./successIcon-B5mGvdx1.js";
+import { t as InputComposed } from "./inputComposed-C1R2LAa3.js";
+import { t as DropdownComposed } from "./dropdownComposed-CoU0enG6.js";
 //#region ../../node_modules/.pnpm/libphonenumber-js@1.12.31/node_modules/libphonenumber-js/metadata.min.json.js
 var metadata_min_json_default = {
 	"version": 4,

package/dist/{processing-BM-wT-1W.js → processing-BeUMfdJJ.js}

@@ -1,5 +1,5 @@
 import { v as u } from "./vendor-preact-DThS2ZQ_.js";
-import { t as TransitionSpinner } from "./transitionSpinner-DRRz-NV8.js";
+import { t as TransitionSpinner } from "./transitionSpinner-CuNCqHNi.js";
 //#region src/shared/processing/processing.tsx
 var Processing = () => {
 	return /* @__PURE__ */ u(TransitionSpinner, {});

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

@@ -1,6 +1,6 @@
 import { v as u } from "../vendor-preact-DThS2ZQ_.js";
-import { n as ElectronicSignature } from "../electronic-signature-B-Q7M0wK.js";
-import { t as registerIncodeModuleElement } from "../incodeModule-BUDoTwT9.js";
+import { n as ElectronicSignature } from "../electronic-signature-Ueoffasr.js";
+import { t as registerIncodeModuleElement } from "../incodeModule-B-4_3JrK.js";
 //#region src/modules/qe-signature/qe-signature.tsx
 var QeSignature = ({ config, onFinish, onError }) => {
 	return /* @__PURE__ */ u(ElectronicSignature, {

package/dist/{radioGroupComposed-BNuaopVr.js → radioGroupComposed-DuQxslB2.js}

@@ -1,9 +1,9 @@
-import { n as useTranslation } from "./i18n-CoCO2ZuN.js";
+import { n as useTranslation } from "./i18n-CU4xq8qC.js";
 import { a as D, p as d, v as u } from "./vendor-preact-DThS2ZQ_.js";
 import { n as cn } from "./loadingIcon-B0ysgiNq.js";
-import { t as ErrorIcon } from "./errorIcon-DJRZpd8j.js";
-import "./icons-Dbs9ZfYM.js";
-import { t as InputComposed } from "./inputComposed-CQ4AsvZg.js";
+import { t as ErrorIcon } from "./errorIcon-BA4T6iy-.js";
+import "./icons-CJJbIpBq.js";
+import { t as InputComposed } from "./inputComposed-C1R2LAa3.js";
 //#region src/shared/errorParams.ts
 /**
 * Resolves error params by translating the `fieldName` key

package/dist/redirect-to-mobile/redirect-to-mobile.es.js

@@ -1,20 +1,21 @@
 import { t as __commonJSMin } from "../rolldown-runtime--E5BIlTp.js";
-import { n as useTranslation, t as Trans } from "../i18n-CoCO2ZuN.js";
+import { n as useTranslation, t as Trans } from "../i18n-CU4xq8qC.js";
 import { _ as y, h as q, l as A, p as d, v as u, x as k } 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 { 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 incode_logo_default } from "../incode-logo-57XFniXU.js";
-import { n as usePageUiConfig, t as VerifiedByIncodeLogo } from "../verifiedByIncode-DjXOdCml.js";
-import { t as TransitionSpinner } from "../transitionSpinner-DRRz-NV8.js";
-import { t as Button } from "../button-CM_hgyIP.js";
-import "../icons-Dbs9ZfYM.js";
-import { t as SuccessIcon } from "../successIcon-BAyDPT7I.js";
-import { t as AutoFocusTitle } from "../autoFocusTitle-BzkUiELM.js";
-import { r as getCountryByCallingCode, t as PhoneInputComposed } from "../phoneInputComposed-DjNdsmPE.js";
-import { t as registerIncodeElement } from "../registerIncodeElement-77NGCDsy.js";
-import { t as Snackbar } from "../snackbar-CxepGC3e.js";
-import { t as Tabs } from "../tabs-C8npVBbk.js";
+import { n as VerifiedByIncodeLogo, r as usePageUiConfig } from "../page-DidH_RkX.js";
+import "../extensibility-7sRIN0JC.js";
+import { t as TransitionSpinner } from "../transitionSpinner-CuNCqHNi.js";
+import { t as Button } from "../button-Dz6AsbmF.js";
+import "../icons-CJJbIpBq.js";
+import { t as SuccessIcon } from "../successIcon-B5mGvdx1.js";
+import { t as AutoFocusTitle } from "../autoFocusTitle-CuRu2lPg.js";
+import { r as getCountryByCallingCode, t as PhoneInputComposed } from "../phoneInputComposed-DMiXfF-1.js";
+import { t as registerIncodeElement } from "../registerIncodeElement-DaNjbAwZ.js";
+import { t as Snackbar } from "../snackbar-DS7Mv62v.js";
+import { t as Tabs } from "../tabs-C__chW-u.js";
 import { createRedirectToMobileManager } from "@incodetech/core/redirect-to-mobile";
 //#region src/modules/redirect-to-mobile/redirectHeader.tsx
 var RedirectHeader = ({ logoSrc }) => {
@@ -50,17 +51,21 @@ var RedirectFooter = ({ addContinueToDesktop, onContinueOnDesktop }) => {
 	const { t } = useTranslation();
 	return /* @__PURE__ */ u("footer", {
 		class: "IncodeRedirectBottomNav",
-		children: [addContinueToDesktop ? /* @__PURE__ */ u("div", {
-			class: "IncodeRedirectFooterContent",
-			children: [/* @__PURE__ */ u("span", {
-				class: "IncodeRedirectFooterContentText",
-				children: t("idv2.permissions.or")
-			}), /* @__PURE__ */ u(Button, {
-				variant: "secondary",
-				onClick: onContinueOnDesktop,
-				children: t("redirect.continueOnDesktop")
-			})]
-		}) : null, /* @__PURE__ */ u(VerifiedByIncodeLogo, {})]
+		children: [
+			/* @__PURE__ */ u(Spacer, {}),
+			addContinueToDesktop ? /* @__PURE__ */ u("div", {
+				class: "IncodeRedirectFooterContent",
+				children: [/* @__PURE__ */ u("span", {
+					class: "IncodeRedirectFooterContentText",
+					children: t("idv2.permissions.or")
+				}), /* @__PURE__ */ u(Button, {
+					variant: "secondary",
+					onClick: onContinueOnDesktop,
+					children: t("redirect.continueOnDesktop")
+				})]
+			}) : null,
+			/* @__PURE__ */ u(VerifiedByIncodeLogo, {})
+		]
 	});
 };
 //#endregion
@@ -2517,7 +2522,7 @@ var SmsSentView = ({ formattedPhone, onResend, onChangePhone }) => {
 	return /* @__PURE__ */ u("div", {
 		class: "IncodeRedirectLinkSent",
 		children: [
-			/* @__PURE__ */ u(SuccessIcon, { size: 32 }),
+			/* @__PURE__ */ u(SuccessIcon, { size: 40 }),
 			/* @__PURE__ */ u(Spacer, { size: 16 }),
 			/* @__PURE__ */ u(AutoFocusTitle, {
 				className: "IncodeRedirectLinkSentTitle",
@@ -2537,10 +2542,12 @@ var SmsSentView = ({ formattedPhone, onResend, onChangePhone }) => {
 					components: {
 						resend: /* @__PURE__ */ u(Button, {
 							variant: "link",
+							size: "inline",
 							onClick: onResend
 						}),
 						changePhone: /* @__PURE__ */ u(Button, {
 							variant: "link",
+							size: "inline",
 							onClick: onChangePhone
 						})
 					}
@@ -2565,7 +2572,7 @@ var SmsForm = ({ countryCode, error, isSending, isPhoneValid, onPhoneChange, onS
 		disabled: !isPhoneValid || isSending,
 		isLoading: isSending,
 		class: "IncodeRedirectSmsSendButton",
-		children: t("redirect.sendLinkViaSms")
+		children: t("redirect.sendLinkSms")
 	})] });
 };
 //#endregion
@@ -2632,10 +2639,7 @@ var QrScreen = ({ redirectUrl, phonePrefix, smsSent, disableSmsOption, addContin
 		class: "IncodeRedirectContainer",
 		children: [/* @__PURE__ */ u(ResendToast, { visible: showResendToast }), /* @__PURE__ */ u("div", {
 			class: "IncodeRedirectCard",
-			children: [disableSmsOption ? /* @__PURE__ */ u(k, { children: [/* @__PURE__ */ u(RedirectHeader, { logoSrc }), /* @__PURE__ */ u("div", {
-				class: "IncodeRedirectOptions",
-				children: /* @__PURE__ */ u(QrTabContent, { redirectUrl })
-			})] }) : /* @__PURE__ */ u(Tabs, {
+			children: [/* @__PURE__ */ u(Tabs, {
 				defaultValue: "qr",
 				listClassName: "IncodeRedirectTabs",
 				triggerClassName: "IncodeRedirectTab",
@@ -2647,7 +2651,7 @@ var QrScreen = ({ redirectUrl, phonePrefix, smsSent, disableSmsOption, addContin
 						children: [/* @__PURE__ */ u(Tabs.Trigger, {
 							value: "qr",
 							children: t("v2.redirectToMobile.tabs.0")
-						}), /* @__PURE__ */ u(Tabs.Trigger, {
+						}), !disableSmsOption && /* @__PURE__ */ u(Tabs.Trigger, {
 							value: "sms",
 							children: t("v2.redirectToMobile.tabs.1")
 						})]
@@ -2657,7 +2661,7 @@ var QrScreen = ({ redirectUrl, phonePrefix, smsSent, disableSmsOption, addContin
 					children: [/* @__PURE__ */ u(Tabs.Content, {
 						value: "qr",
 						children: /* @__PURE__ */ u(QrTabContent, { redirectUrl })
-					}), /* @__PURE__ */ u(Tabs.Content, {
+					}), !disableSmsOption && /* @__PURE__ */ u(Tabs.Content, {
 						value: "sms",
 						children: /* @__PURE__ */ u(SmsTabContent, {
 							phonePrefix,

package/dist/redirect-to-mobile/styles.css

@@ -141,6 +141,7 @@
   width: 100%;
   max-width: var(--redirect-form-column-max-width);
   flex-direction: column;
+  flex: 1;
   display: flex;
 }
 
@@ -167,7 +168,7 @@
   gap: var(--spacing-12, var(--spacing-12, 12px));
   border-bottom-style: var(--tw-border-style);
   border-bottom-width: 1px;
-  border-color: var(--color-border-neutral-300, var(--border-neutral-300));
+  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
   width: 100%;
   max-width: var(--redirect-tabs-max-width);
   display: flex;
@@ -198,7 +199,7 @@
 }
 
 .IncodeRedirectContainer .IncodeRedirectCard .IncodeRedirectTabs .IncodeRedirectTab.IncodeRedirectTabActive {
-  border-color: var(--color-text-link-default, var(--text-link-default));
+  border-color: var(--color-border-brand-500, var(--border-brand-500));
   color: var(--color-text-body-primary, var(--text-body-800-primary));
 }
 

package/dist/{richText-Cf9aMOCk.js → richText-CB1fmegc.js}

@@ -1,5 +1,5 @@
 import { t as preact_markup_module_default, v as u } from "./vendor-preact-DThS2ZQ_.js";
-import { t as _defineProperty } from "./defineProperty-mefzVtTv.js";
+import { t as _defineProperty } from "./defineProperty-Qjefk7Uf.js";
 //#region ../../node_modules/.pnpm/dompurify@3.3.3/node_modules/dompurify/dist/purify.es.mjs
 /*! @license DOMPurify 3.3.3 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.3.3/LICENSE */
 var { entries, setPrototypeOf, isFrozen, getPrototypeOf, getOwnPropertyDescriptor } = Object;

package/dist/selfie/selfie.es.js

@@ -1,17 +1,18 @@
 import { _ as y, v as u } from "../vendor-preact-DThS2ZQ_.js";
-import { a as isTerminalModuleState, c as useManager, o as useModuleTerminalCallbacks } from "../hooks-Da_yP_Dr.js";
-import { t as IncodeComponent } from "../incodeComponent-wfnHlnXx.js";
-import { t as TransitionSpinner } from "../transitionSpinner-DRRz-NV8.js";
-import { t as Processing } from "../processing-BM-wT-1W.js";
-import { n as Capture, r as Permissions, t as Tutorial } from "../tutorial-D1qaY2Tm.js";
-import { t as registerIncodeModuleElement } from "../incodeModule-BUDoTwT9.js";
+import { c as useModuleTerminalCallbacks, s as isTerminalModuleState, u as useManager } from "../hooks-CNu7o-v8.js";
+import { t as IncodeComponent } from "../incodeComponent-CfzJGETt.js";
+import { t as TransitionSpinner } from "../transitionSpinner-CuNCqHNi.js";
+import { t as Processing } from "../processing-BeUMfdJJ.js";
+import { n as Capture, t as Tutorial } from "../tutorial-CCfPuVKX.js";
+import { i as Permissions } from "../capture-CkGvdDNH.js";
+import { t as registerIncodeModuleElement } from "../incodeModule-B-4_3JrK.js";
 import { createSelfieManager } from "@incodetech/core/selfie";
 //#region src/modules/selfie/preloadTutorialAssets.ts
 var started = false;
 function preloadSelfieTutorialAssets() {
 	if (started) return;
 	started = true;
-	import("../selfieTutorial-CtruLyO2.js");
+	import("../selfieTutorial-pB-N-fj5.js");
 }
 //#endregion
 //#region src/modules/selfie/selfie.tsx

package/dist/selfie/styles.css

@@ -449,6 +449,51 @@
     }
   }
 
+  @media (min-width: 40rem) {
+    .incode-container {
+      max-width: 40rem;
+    }
+  }
+
+  @media (min-width: 48rem) {
+    .incode-container {
+      max-width: 48rem;
+    }
+  }
+
+  @media (min-width: 64rem) {
+    .incode-container {
+      max-width: 64rem;
+    }
+  }
+
+  @media (min-width: 80rem) {
+    .incode-container {
+      max-width: 80rem;
+    }
+  }
+
+  @media (min-width: 96rem) {
+    .incode-container {
+      max-width: 96rem;
+    }
+  }
+
+  @media (min-width: 48rem) {
+    .incode-container {
+      max-height: var(--incode-page-max-h);
+      max-width: var(--incode-page-max-w);
+    }
+
+    @media not all and (min-width: 80rem) {
+      @media (orientation: landscape) {
+        .incode-container {
+          max-height: var(--incode-page-max-h-landscape);
+        }
+      }
+    }
+  }
+
   .incode-container {
     width: 100%;
   }
@@ -609,6 +654,10 @@
     justify-content: space-between;
   }
 
+  .rounded {
+    border-radius: .25rem;
+  }
+
   .border {
     border-style: var(--tw-border-style);
     border-width: 1px;
@@ -666,6 +715,11 @@
     font-weight: var(--typography-button-m-underlined-weight);
     line-height: var(--typography-button-m-underlined-line-height);
     letter-spacing: var(--typography-button-m-underlined-letter-spacing);
+    font-family: var(--typography-button-family);
+    font-size: var(--typography-button-m-underlined-size);
+    font-weight: var(--typography-button-m-underlined-weight);
+    line-height: var(--typography-button-m-underlined-line-height);
+    letter-spacing: var(--typography-button-m-underlined-letter-spacing);
     text-decoration-line: underline;
     text-decoration-style: solid;
     text-decoration-thickness: auto;
@@ -732,20 +786,6 @@
   }
 }
 
-.IncodeCameraButton {
-  justify-content: center;
-  align-items: center;
-  display: flex;
-}
-
-.IncodeCameraButton .IncodeCameraButtonBackground {
-  fill: var(--color-icon-neutral-800-static, var(--icon-neutral-800-static));
-}
-
-.IncodeCameraButton .IncodeCameraButtonRing, .IncodeCameraButton .IncodeCameraButtonPath {
-  fill: var(--color-icon-neutral-50, var(--icon-neutral-50-static));
-}
-
 .IncodeCaptureContainer {
   flex-direction: column;
   flex: 1;
@@ -805,10 +845,21 @@
   transform: scaleX(-1);
 }
 
-.IncodeCaptureCapturingPage .IncodeCaptureCapturingActions {
-  justify-content: center;
-  margin-top: auto;
-  display: flex;
+.IncodeCaptureContainer .IncodeCaptureAvatarHost {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+}
+
+.IncodeCaptureContainer .IncodeCaptureAvatarElement {
+  object-fit: cover;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+}
+
+.IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeCaptureAvatarMirrored {
+  transform: scaleX(-1);
 }
 
 .IncodeCaptureVisuallyHidden {
@@ -823,26 +874,6 @@
   overflow: hidden;
 }
 
-.IncodeCaptureStatusPage .IncodeCaptureStatusContainer {
-  flex-direction: column;
-  flex: 1;
-  align-items: center;
-  display: flex;
-}
-
-.IncodeCaptureStatusPage .IncodeCaptureStatusTitle {
-  text-align: center;
-  font-size: var(--text-2xl, 1.5rem);
-  line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
-  --tw-leading: 125%;
-  --tw-font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
-  line-height: 125%;
-  font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
-  --tw-tracking: -1px;
-  letter-spacing: -1px;
-  color: var(--color-text-body-primary, var(--text-body-800-primary));
-}
-
 .IncodeFaceOutline {
   width: 100%;
   height: 100%;
@@ -868,54 +899,93 @@
   transition: all 1s ease-in-out;
 }
 
-.IncodeSelfieManualCapture {
+.IncodeNotification {
   flex-direction: column;
   align-items: center;
-  max-width: 275px;
   display: flex;
 }
 
-.IncodeSelfieManualCaptureText {
+.IncodeNotification .IncodeNotificationText {
   text-align: center;
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h5-size);
-  font-weight: var(--typography-headline-h5-weight);
-  line-height: var(--typography-headline-h5-line-height);
-  letter-spacing: var(--typography-headline-h5-letter-spacing);
-  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
+  font-family: var(--typography-feedback-family);
+  font-size: var(--typography-feedback-l-size);
+  font-weight: var(--typography-feedback-l-weight);
+  line-height: var(--typography-feedback-l-line-height);
+  letter-spacing: var(--typography-feedback-l-letter-spacing);
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
 }
 
-.IncodeSelfieManualCaptureButton {
-  padding: var(--spacing-0, var(--spacing-none, 0px));
-  color: var(--color-text-body-primary, var(--text-body-800-primary));
+.IncodeCameraButton {
+  justify-content: center;
+  align-items: center;
+  display: flex;
 }
 
-.IncodeNotification {
+.IncodeCameraButton .IncodeCameraButtonBackground {
+  fill: var(--color-icon-neutral-800-static, var(--icon-neutral-800-static));
+}
+
+.IncodeCameraButton .IncodeCameraButtonRing, .IncodeCameraButton .IncodeCameraButtonPath {
+  fill: var(--color-icon-neutral-50, var(--icon-neutral-50-static));
+}
+
+.IncodeCaptureCapturingPage .IncodeCaptureCapturingActions {
+  justify-content: center;
+  margin-top: auto;
+  display: flex;
+}
+
+.IncodePrivacyLensBanner {
+  text-align: center;
+  color: #4a5568;
+  text-align: center;
+  max-width: 320px;
+  margin-inline: auto;
+  padding: 0 1rem 1rem;
+  font-size: .95rem;
+  line-height: 1.4;
+}
+
+.IncodeCaptureStatusPage .IncodeCaptureStatusContainer {
   flex-direction: column;
+  flex: 1;
   align-items: center;
   display: flex;
 }
 
-.IncodeNotification .IncodeNotificationText {
+.IncodeCaptureStatusPage .IncodeCaptureStatusTitle {
   text-align: center;
-  font-family: var(--typography-feedback-family);
-  font-size: var(--typography-feedback-l-size);
-  font-weight: var(--typography-feedback-l-weight);
-  line-height: var(--typography-feedback-l-line-height);
-  letter-spacing: var(--typography-feedback-l-letter-spacing);
+  font-size: var(--text-2xl, 1.5rem);
+  line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
+  --tw-leading: 125%;
+  --tw-font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
+  line-height: 125%;
+  font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
+  --tw-tracking: -1px;
+  letter-spacing: -1px;
   color: var(--color-text-body-primary, var(--text-body-800-primary));
 }
 
-.IncodeSelfieTutorial {
-  --brand-color: var(--surface-brand-500);
+.IncodeSelfieManualCapture {
+  flex-direction: column;
+  align-items: center;
+  max-width: 275px;
+  display: flex;
 }
 
-.IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg linearGradient#__lottie_element_29 stop {
-  stop-color: var(--brand-color);
+.IncodeSelfieManualCaptureText {
+  text-align: center;
+  font-family: var(--typography-headline-family);
+  font-size: var(--typography-headline-h5-size);
+  font-weight: var(--typography-headline-h5-weight);
+  line-height: var(--typography-headline-h5-line-height);
+  letter-spacing: var(--typography-headline-h5-letter-spacing);
+  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
 }
 
-.IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g:first-child > g > g > g:nth-child(2) > g:nth-child(3) > g > path, .IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g:first-child > g > g > g:nth-child(2) > g:first-child > g > path {
-  fill: var(--brand-color);
+.IncodeSelfieManualCaptureButton {
+  padding: var(--spacing-0, var(--spacing-none, 0px));
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
 }
 
 @property --tw-rotate-x {

package/dist/signature/signature.es.js

@@ -1,14 +1,14 @@
-import { n as useTranslation } from "../i18n-CoCO2ZuN.js";
+import { n as useTranslation } from "../i18n-CU4xq8qC.js";
 import { _ as y, a as D, h as q, l as A, p as d, u as F, 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 { 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-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 registerIncodeModuleElement } from "../incodeModule-BUDoTwT9.js";
-import { t as _defineProperty } from "../defineProperty-mefzVtTv.js";
+import { t as Page } from "../page-DidH_RkX.js";
+import "../extensibility-7sRIN0JC.js";
+import { t as Button } from "../button-Dz6AsbmF.js";
+import { t as VerificationResult } from "../verificationResult-BWWkmeiA.js";
+import { t as registerIncodeModuleElement } from "../incodeModule-B-4_3JrK.js";
+import { t as _defineProperty } from "../defineProperty-Qjefk7Uf.js";
 import { createSignatureManager } from "@incodetech/core/signature";
 //#region ../../node_modules/.pnpm/signature_pad@5.1.3/node_modules/signature_pad/dist/signature_pad.js
 /*!

package/dist/spinner-BCDCoi9C.js

@@ -0,0 +1 @@
+import "./spinner-BMeIEK1d.js";

package/dist/{spinner-D8a_2LvW.js → spinner-BMeIEK1d.js}

@@ -1,28 +1,40 @@
 import { _ as y, l as A, v as u, x as k } from "./vendor-preact-DThS2ZQ_.js";
 import { n as cn, r as Spacer, t as LoadingIcon } from "./loadingIcon-B0ysgiNq.js";
-import { t as Title } from "./typography-YLgHHuao.js";
+import { t as Title } from "./typography-BZIpjo97.js";
 //#region src/shared/spinner/spinner.tsx
 var sizeMap = {
 	small: 24,
 	medium: 48,
 	large: 64
 };
-var Spinner = ({ title, subtitle, size = "medium", fullScreen = true, className }) => {
+var Spinner = ({ title, subtitle, ariaLabel, size = "medium", fullScreen = true, className, presentational = false }) => {
 	const iconSize = sizeMap[size];
 	const titleRef = A(null);
+	const containerRef = A(null);
 	y(() => {
-		if (title) titleRef.current?.focus();
-	}, [title]);
+		if (presentational) return;
+		if (ariaLabel) containerRef.current?.focus();
+		else if (title) titleRef.current?.focus();
+	}, [
+		title,
+		ariaLabel,
+		presentational
+	]);
 	return /* @__PURE__ */ u("div", {
+		ref: containerRef,
 		class: cn("IncodeSpinner", fullScreen && "IncodeSpinnerFullScreen", className),
 		"data-testid": "spinner",
 		"data-title": title,
 		"data-subtitle": subtitle,
 		"data-size": size,
-		role: "status",
-		"aria-live": "polite",
+		role: presentational ? void 0 : "status",
+		"aria-live": presentational ? void 0 : "polite",
+		"aria-label": presentational ? void 0 : ariaLabel,
+		"aria-hidden": presentational ? true : void 0,
+		tabIndex: !presentational && ariaLabel ? -1 : void 0,
 		children: /* @__PURE__ */ u("div", {
 			class: "IncodeSpinnerContent",
+			"aria-hidden": ariaLabel ? true : void 0,
 			children: [/* @__PURE__ */ u(LoadingIcon, { size: iconSize }), (title || subtitle) && /* @__PURE__ */ u(k, { children: [/* @__PURE__ */ u(Spacer, { size: 16 }), /* @__PURE__ */ u("div", {
 				class: "IncodeSpinnerText",
 				children: [title && /* @__PURE__ */ u(Title, {

package/dist/{statusPage-DMYPUwRZ.js → statusPage-Bk8nJwXV.js}

@@ -1,7 +1,7 @@
 import { v as u } from "./vendor-preact-DThS2ZQ_.js";
 import { r as Spacer } from "./loadingIcon-B0ysgiNq.js";
-import { t as Page } from "./page-DxGQj7Gk.js";
-import { t as AutoFocusTitle } from "./autoFocusTitle-BzkUiELM.js";
+import { t as Page } from "./page-DidH_RkX.js";
+import { t as AutoFocusTitle } from "./autoFocusTitle-CuRu2lPg.js";
 //#region src/shared/statusPage/statusPage.tsx
 var StatusPage = ({ variant, icon, title, subtitle, hideFooterBranding }) => /* @__PURE__ */ u(Page, {
 	className: `IncodeStatusPage IncodeStatusPage--${variant}`,