vesant-sdk 1.7.1-dev.afc5a32 → 1.7.1-dev.c2ac5a5

package/dist/react.js

@@ -429,14 +429,11 @@ function useCipherText(client) {
   const [configLoading, setConfigLoading] = React.useState(!!client);
   const [configError, setConfigError] = React.useState(null);
   const configRef = React.useRef(void 0);
-  const configPromiseRef = React.useRef(null);
   React.useEffect(() => {
     if (!client) return;
     let cancelled = false;
     setConfigLoading(true);
-    const promise = client.getGPSConfig();
-    configPromiseRef.current = promise;
-    promise.then((cfg) => {
+    client.getGPSConfig().then((cfg) => {
       if (!cancelled) {
         configRef.current = cfg;
         setConfigLoading(false);
@@ -451,13 +448,21 @@ function useCipherText(client) {
       cancelled = true;
     };
   }, [client]);
+  const refreshConfig = React.useCallback(async () => {
+    if (!client) return;
+    try {
+      configRef.current = await client.refreshGPSConfig();
+      setConfigError(null);
+    } catch (error) {
+      setConfigError(error instanceof Error ? error : new Error("Failed to refresh GPS config"));
+    }
+  }, [client]);
   const generate = React.useCallback(
     async (options) => {
       try {
-        if (configPromiseRef.current) {
+        if (client) {
           try {
-            const cfg = await configPromiseRef.current;
-            configRef.current = cfg;
+            configRef.current = await client.getGPSConfig();
           } catch {
           }
         }
@@ -467,9 +472,9 @@ function useCipherText(client) {
         return null;
       }
     },
-    []
+    [client]
   );
-  return { generate, configLoading, configError };
+  return { generate, refreshConfig, configLoading, configError };
 }
 function useLocationRequests(client, options = {}) {
   const [requests, setRequests] = React.useState([]);
@@ -1009,6 +1014,46 @@ function loadMediaPipeFaceDetection(assetBasePath) {
 
 // src/kyc/hostedJourney.ts
 var REUSE_KYC_SESSION_EXPIRY_MS = 10 * 60 * 1e3;
+var JOURNEY_FRAME_HEIGHT = "clamp(500px, 64vh, 680px)";
+var JOURNEY_CONFIRM_TIMEOUT_MS = 45e3;
+function journeyOutcomeFromMessage(data) {
+  const status = data?.verification_status;
+  if (typeof status !== "string") return null;
+  switch (status) {
+    case "verification.accepted":
+      return "accepted";
+    case "verification.declined":
+      return "declined";
+    case "verification.cancelled":
+    case "request.timeout":
+    case "request.invalid":
+    case "request.unauthorized":
+    case "request.deleted":
+      return "cancelled";
+    default:
+      return null;
+  }
+}
+function journeyPollIntervalMs(confirming) {
+  return confirming ? 1e3 : 2500;
+}
+function pendingJourneyResult(reference) {
+  return {
+    event: "reuse_kyc",
+    reference,
+    resource_id: "",
+    status: "pending",
+    data: {
+      retries_remaining: 0,
+      retry_limit_exceeded: false,
+      trigger_alert: false,
+      enforce_logout: false,
+      freeze_account: false,
+      block: false,
+      freeze_duration_minutes: 0
+    }
+  };
+}
 function tryStartOperation(guard) {
   if (guard.current) return false;
   guard.current = true;
@@ -1020,12 +1065,22 @@ function releaseOperation(guard) {
 function retryTarget(hasHostedJourney) {
   return hasHostedJourney ? "journey" : "capture";
 }
+var CAPTURE_MODAL_MAX_WIDTH = 448;
 function modalMaxWidth(hasHostedJourney) {
-  return hasHostedJourney ? 680 : 448;
+  return hasHostedJourney ? CAPTURE_MODAL_MAX_WIDTH : CAPTURE_MODAL_MAX_WIDTH;
+}
+var JOURNEY_CONTENT_PADDING = 12;
+function resultForModalClose(stageKind, result, unconfirmed) {
+  const terminal = stageKind === "accepted" || stageKind === "declined" || stageKind === "max_attempts";
+  if (terminal && result !== void 0) return result;
+  const awaitingConfirmation = stageKind === "confirming" || stageKind === "unconfirmed";
+  if (awaitingConfirmation && unconfirmed !== void 0) return unconfirmed;
+  return null;
 }
 
 // src/kyc/FaceCaptureModal.tsx
 var MOBILE_UA = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
+var ACCEPTED_AUTO_CLOSE_MS = 1200;
 var LIVENESS_MESSAGES = [
   "Position your face inside the oval",
   "Make sure your face is well lit",
@@ -1038,6 +1093,10 @@ function headerSubtitle(stageKind) {
       return "Use your phone to continue";
     case "journey":
       return "Follow the steps to verify your identity";
+    case "confirming":
+      return "Confirming your result";
+    case "unconfirmed":
+      return "Still confirming";
     case "accepted":
       return "All set";
     case "declined":
@@ -1137,8 +1196,10 @@ function FaceCaptureModal({
       stopped = true;
     };
   }, [stage.kind, stage.kind === "qr" ? stage.mobileConnected : false]);
+  const journeyUrl = stage.kind === "journey" || stage.kind === "confirming" ? stage.url : "";
   React.useEffect(() => {
-    if (stage.kind !== "journey" || !stage.url) return;
+    if (stage.kind !== "journey" && stage.kind !== "confirming" || !journeyUrl) return;
+    const intervalMs = journeyPollIntervalMs(stage.kind === "confirming");
     let stopped = false;
     const checkOnce = async () => {
       try {
@@ -1155,27 +1216,43 @@ function FaceCaptureModal({
       if (stopped || cancelledRef.current) return;
       await checkOnce();
       if (!stopped && !cancelledRef.current) {
-        setTimeout(tick, 2500);
+        setTimeout(tick, intervalMs);
       }
     };
     void tick();
     let frameOrigin = "";
     try {
-      frameOrigin = new URL(stage.url).origin;
+      frameOrigin = new URL(journeyUrl).origin;
     } catch {
       frameOrigin = "";
     }
     const onMessage = (e) => {
       if (!frameOrigin || e.origin !== frameOrigin) return;
-      const status = e.data?.verification_status;
-      if (status) void checkOnce();
+      const outcome = journeyOutcomeFromMessage(e.data);
+      if (!outcome) return;
+      void checkOnce();
+      setStage((prev) => {
+        if (prev.kind !== "journey") return prev;
+        if (outcome === "cancelled") {
+          return { kind: "error", message: "The verification was closed before it finished. Please try again." };
+        }
+        return { kind: "confirming", outcome, url: prev.url };
+      });
     };
     window.addEventListener("message", onMessage);
     return () => {
       stopped = true;
       window.removeEventListener("message", onMessage);
     };
-  }, [stage.kind, stage.kind === "journey" ? stage.url : ""]);
+  }, [stage.kind, journeyUrl]);
+  React.useEffect(() => {
+    if (stage.kind !== "confirming") return;
+    const outcome = stage.outcome;
+    const timer = setTimeout(() => {
+      setStage((prev) => prev.kind === "confirming" ? { kind: "unconfirmed", outcome } : prev);
+    }, JOURNEY_CONFIRM_TIMEOUT_MS);
+    return () => clearTimeout(timer);
+  }, [stage.kind, stage.kind === "confirming" ? stage.outcome : ""]);
   const handleJourneyRetry = async () => {
     if (!tryStartOperation(journeyRetryingRef)) return;
     setStage({ kind: "journey", url: "" });
@@ -1322,12 +1399,23 @@ function FaceCaptureModal({
     }, 3e3);
     return () => clearInterval(interval);
   }, [captureMode]);
-  const close = (result) => {
+  const close = React.useCallback((result) => {
     cancelledRef.current = true;
     if (result === null && onCancel) {
       onCancel();
     }
     onComplete(result);
+  }, [onCancel, onComplete]);
+  React.useEffect(() => {
+    if (stage.kind !== "accepted") return;
+    const result = stage.result;
+    const timer = setTimeout(() => close(result), ACCEPTED_AUTO_CLOSE_MS);
+    return () => clearTimeout(timer);
+  }, [close, stage]);
+  const handleHeaderClose = () => {
+    const result = "result" in stage ? stage.result : void 0;
+    const unconfirmed = stage.kind === "confirming" || stage.kind === "unconfirmed" ? pendingJourneyResult(session.reference) : void 0;
+    close(resultForModalClose(stage.kind, result, unconfirmed));
   };
   const renderChoose = () => /* @__PURE__ */ React__default.default.createElement("div", { style: contentStyle }, /* @__PURE__ */ React__default.default.createElement("div", { style: visualGuideContainerStyle }, /* @__PURE__ */ React__default.default.createElement("div", { style: visualGuideStyle }, /* @__PURE__ */ React__default.default.createElement("div", { style: circleStyle }, /* @__PURE__ */ React__default.default.createElement("img", { src: Camera, alt: "", width: 48, height: 48 })))), /* @__PURE__ */ React__default.default.createElement("p", { style: subtitleStyle }, "How would you like to verify?"), /* @__PURE__ */ React__default.default.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React__default.default.createElement(
     "button",
@@ -1399,7 +1487,16 @@ function FaceCaptureModal({
       "Try Again"
     ), /* @__PURE__ */ React__default.default.createElement("button", { style: cancelButtonStyle, onClick: () => close(null) }, sessionExpired ? "Close" : "Cancel")));
   };
-  const renderJourney = (url) => /* @__PURE__ */ React__default.default.createElement("div", { style: contentStyle }, url ? /* @__PURE__ */ React__default.default.createElement(
+  const renderConfirming = () => /* @__PURE__ */ React__default.default.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React__default.default.createElement("div", { style: { ...spinnerStyle, margin: "24px auto", width: 32, height: 32 } }), /* @__PURE__ */ React__default.default.createElement("h3", { style: titleStyle }, "Confirming your result\u2026"), /* @__PURE__ */ React__default.default.createElement("p", { style: { ...attemptsTextStyle, marginTop: 8 } }, "This usually takes a few seconds."));
+  const renderUnconfirmed = (outcome) => /* @__PURE__ */ React__default.default.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React__default.default.createElement("div", { style: errorCircleStyle }, "!"), /* @__PURE__ */ React__default.default.createElement("h3", { style: titleStyle }, "Still confirming"), /* @__PURE__ */ React__default.default.createElement("p", { style: alertTextStyle }, outcome === "accepted" ? "Your verification was submitted, but we haven't received the final result yet. You can close this window and we'll keep checking in the background." : "Your last attempt wasn't accepted, but we haven't received the details yet. You can try again or close this window."), /* @__PURE__ */ React__default.default.createElement("div", { style: buttonsContainerStyle }, outcome === "declined" && /* @__PURE__ */ React__default.default.createElement("button", { style: primaryButtonStyle, onClick: () => void handleJourneyRetry() }, "Try Again"), /* @__PURE__ */ React__default.default.createElement(
+    "button",
+    {
+      style: outcome === "accepted" ? primaryButtonStyle : cancelButtonStyle,
+      onClick: () => close(pendingJourneyResult(session.reference))
+    },
+    "Close"
+  )));
+  const renderJourney = (url) => /* @__PURE__ */ React__default.default.createElement("div", { style: { ...contentStyle, padding: JOURNEY_CONTENT_PADDING } }, url ? /* @__PURE__ */ React__default.default.createElement(
     "iframe",
     {
       src: url,
@@ -1418,6 +1515,10 @@ function FaceCaptureModal({
         return renderCapture(stage.declinedReason);
       case "journey":
         return renderJourney(stage.url);
+      case "confirming":
+        return renderConfirming();
+      case "unconfirmed":
+        return renderUnconfirmed(stage.outcome);
       case "submitting":
         return renderSubmitting();
       case "accepted":
@@ -1433,7 +1534,7 @@ function FaceCaptureModal({
   return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement("style", null, keyframes), /* @__PURE__ */ React__default.default.createElement("div", { style: overlayStyle }, /* @__PURE__ */ React__default.default.createElement("div", { style: { ...modalStyle, maxWidth: modalMaxWidth(journeyMode) } }, /* @__PURE__ */ React__default.default.createElement("div", { style: headerStyle }, /* @__PURE__ */ React__default.default.createElement(
     "button",
     {
-      onClick: () => close(null),
+      onClick: handleHeaderClose,
       style: closeButtonStyle,
       "aria-label": "Close"
     },
@@ -1492,7 +1593,7 @@ var contentStyle = {
 };
 var journeyFrameStyle = {
   width: "100%",
-  height: "min(520px, 60vh)",
+  height: JOURNEY_FRAME_HEIGHT,
   border: 0,
   borderRadius: 12,
   background: "#f9fafb"
@@ -2279,6 +2380,13 @@ function getRiskColor(risk) {
   };
   return colorMap[risk] || "#6b7280";
 }
+function isMobileDevice(userAgent) {
+  const ua = userAgent ?? (typeof navigator === "undefined" ? "" : navigator.userAgent);
+  return /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(ua);
+}
+function buildEventBasedFaceVerificationQrPayload(token) {
+  return `vesant://reuse-kyc?token=${encodeURIComponent(token)}`;
+}
 function useEventBasedFaceVerificationSubmission(client$1) {
   const startSession = React.useCallback(
     (request) => client$1.createEventBasedFaceVerificationSession(request),
@@ -2326,12 +2434,15 @@ function useEventBasedFaceVerificationSubmission(client$1) {
   return { startSession, verifyFace, runFlow };
 }
 
+exports.FaceCaptureModal = FaceCaptureModal_default;
+exports.buildEventBasedFaceVerificationQrPayload = buildEventBasedFaceVerificationQrPayload;
 exports.createDeviceFingerprint = createDeviceFingerprint;
 exports.fileToBase64 = fileToBase64;
 exports.formatKycStatus = formatKycStatus;
 exports.getBrowserInfo = getBrowserInfo;
 exports.getRiskColor = getRiskColor;
 exports.getStatusColor = getStatusColor;
+exports.isMobileDevice = isMobileDevice;
 exports.isValidFileSize = isValidFileSize;
 exports.isValidFileType = isValidFileType;
 exports.useCipherText = useCipherText;