vesant-sdk 1.7.0-dev.9b89b96 → 1.7.0-dev.a85efc5

package/dist/react.mjs

@@ -883,8 +883,90 @@ var Camera = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0i
 var Done = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPg0KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik04LjUgMTIuNUwxMC41IDE0LjVMMTUuNSA5LjUiIHN0cm9rZT0iIzFDMjc0QyIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPg0KPHBhdGggZD0iTTcgMy4zMzc4MkM4LjQ3MDg3IDIuNDg2OTcgMTAuMTc4NiAyIDEyIDJDMTcuNTIyOCAyIDIyIDYuNDc3MTUgMjIgMTJDMjIgMTcuNTIyOCAxNy41MjI4IDIyIDEyIDIyQzYuNDc3MTUgMjIgMiAxNy41MjI4IDIgMTJDMiAxMC4xNzg2IDIuNDg2OTcgOC40NzA4NyAzLjMzNzgyIDciIHN0cm9rZT0iIzFDMjc0QyIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPg0KPC9zdmc+";
 var Close = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPg0KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xNC41IDkuNTAwMDJMOS41IDE0LjVNOS40OTk5OCA5LjVMMTQuNSAxNC41IiBzdHJva2U9IiMxQzI3NEMiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4NCjxwYXRoIGQ9Ik03IDMuMzM3ODJDOC40NzA4NyAyLjQ4Njk3IDEwLjE3ODYgMiAxMiAyQzE3LjUyMjggMiAyMiA2LjQ3NzE1IDIyIDEyQzIyIDE3LjUyMjggMTcuNTIyOCAyMiAxMiAyMkM2LjQ3NzE1IDIyIDIgMTcuNTIyOCAyIDEyQzIgMTAuMTc4NiAyLjQ4Njk3IDguNDcwODcgMy4zMzc4MiA3IiBzdHJva2U9IiMxQzI3NEMiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4NCjwvc3ZnPg==";
 
+// src/kyc/faceDetection.ts
+var FACE_MESSAGES = {
+  idle: "Initializing camera...",
+  loading: "Loading face detection...",
+  scanning: "Position your face in the circle",
+  too_far: "Face too far. Please move closer to the camera",
+  too_close: "Too close. Please move back a little",
+  off_center: "Center your face in the circle",
+  ok: "Looking great! Tap the button to capture"
+};
+var FACE_COLORS = {
+  idle: "#9ca3af",
+  loading: "#3b82f6",
+  scanning: "#3b82f6",
+  too_far: "#ef4444",
+  too_close: "#f59e0b",
+  off_center: "#f59e0b",
+  ok: "#10b981"
+};
+var MEDIAPIPE_BASE = "https://cdn.jsdelivr.net/npm/@mediapipe/face_detection";
+function mapDetectionsToFaceStatus(detections) {
+  if (detections.length === 0) return "scanning";
+  const bb = detections[0].boundingBox;
+  if (bb.width < 0.18) return "too_far";
+  if (bb.width > 0.72) return "too_close";
+  if (bb.xCenter < 0.28 || bb.xCenter > 0.72 || bb.yCenter < 0.28 || bb.yCenter > 0.72) {
+    return "off_center";
+  }
+  return "ok";
+}
+function isCaptureDisabled(ready, detectionActive, faceStatus) {
+  return !ready || detectionActive && faceStatus !== "ok";
+}
+function resolveMediaPipeBase(base) {
+  if (!base) return MEDIAPIPE_BASE;
+  return base.endsWith("/") ? base.slice(0, -1) : base;
+}
+var LIVENESS_SAMPLE_LIMIT = 20;
+function buildLivenessArtifact(samples) {
+  if (samples.length === 0) return void 0;
+  return JSON.stringify({
+    version: 1,
+    source: "mediapipe-face-detection",
+    samples: samples.slice(-LIVENESS_SAMPLE_LIMIT)
+  });
+}
+var mediapipeLoaderPromises = /* @__PURE__ */ new Map();
+function loadMediaPipeFaceDetection(assetBasePath) {
+  if (typeof window === "undefined" || typeof document === "undefined") {
+    return Promise.reject(new Error("MediaPipe requires a browser environment"));
+  }
+  const w = window;
+  if (w.FaceDetection) {
+    return Promise.resolve(w.FaceDetection);
+  }
+  const src = `${resolveMediaPipeBase(assetBasePath)}/face_detection.js`;
+  const existing = mediapipeLoaderPromises.get(src);
+  if (existing) return existing;
+  const loader = new Promise((resolve, reject) => {
+    const script = document.createElement("script");
+    script.src = src;
+    script.async = true;
+    script.crossOrigin = "anonymous";
+    script.onload = () => {
+      if (w.FaceDetection) {
+        resolve(w.FaceDetection);
+      } else {
+        mediapipeLoaderPromises.delete(src);
+        reject(new Error("MediaPipe loaded but FaceDetection global is missing"));
+      }
+    };
+    script.onerror = () => {
+      mediapipeLoaderPromises.delete(src);
+      reject(new Error("Failed to load MediaPipe face_detection script"));
+    };
+    document.head.appendChild(script);
+  });
+  mediapipeLoaderPromises.set(src, loader);
+  return loader;
+}
+
 // src/kyc/FaceCaptureModal.tsx
 var MOBILE_UA = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
+var SESSION_EXPIRY_MS = 15 * 60 * 1e3;
 var LIVENESS_MESSAGES = [
   "Position your face inside the circle",
   "Make sure your face is well lit",
@@ -915,7 +997,8 @@ function FaceCaptureModal({
   onComplete,
   onCancel,
   defaultDevice,
-  renderQR
+  renderQR,
+  mediapipeAssetBasePath
 }) {
   const isMobile = typeof navigator !== "undefined" && MOBILE_UA.test(navigator.userAgent);
   const initialChoice = defaultDevice ?? (isMobile ? "this" : "ask");
@@ -932,15 +1015,24 @@ function FaceCaptureModal({
   const [captureMode, setCaptureMode] = useState("idle");
   const [capturedPreview, setCapturedPreview] = useState(null);
   const [capturedBase64, setCapturedBase64] = useState(null);
+  const [capturedArtifact, setCapturedArtifact] = useState(null);
   const [livenessMessage, setLivenessMessage] = useState(LIVENESS_MESSAGES[0]);
   const qrPayload = session.link || `vesant://reuse-kyc?token=${encodeURIComponent(session.token)}`;
   const cancelledRef = useRef(false);
   const submittingRef = useRef(false);
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setStage(
+        (prev) => prev.kind === "choose" || prev.kind === "qr" || prev.kind === "capture" ? { kind: "error", message: "Session expired" } : prev
+      );
+    }, SESSION_EXPIRY_MS);
+    return () => clearTimeout(timer);
+  }, [session.token]);
   useEffect(() => {
     if (stage.kind !== "qr") return;
     let stopped = false;
     const intervalMs = 2e3;
-    const deadline = Date.now() + 15 * 60 * 1e3;
+    const deadline = Date.now() + SESSION_EXPIRY_MS;
     let mobileSeen = stage.mobileConnected;
     const tick = async () => {
       if (stopped || cancelledRef.current) return;
@@ -1021,7 +1113,10 @@ function FaceCaptureModal({
           const data = await client.submitEventBasedFaceVerificationSession({
             token: session.token,
             reference: ref,
-            proof
+            proof,
+            // undefined when detection wasn't running for this capture —
+            // JSON.stringify drops it, so the field is absent on the wire.
+            liveness_artifact: capturedArtifact ?? void 0
           });
           return { ok: true, data };
         } catch (err2) {
@@ -1067,16 +1162,18 @@ function FaceCaptureModal({
       submittingRef.current = false;
     }
   };
-  const handleCameraCapture = (dataUrl) => {
+  const handleCameraCapture = (dataUrl, livenessArtifact) => {
     const raw = dataUrl.split(",")[1] ?? "";
     setCapturedPreview(dataUrl);
     setCapturedBase64(raw);
+    setCapturedArtifact(livenessArtifact ?? null);
     setCaptureMode("preview");
   };
   const handleCameraCancel = () => setCaptureMode("idle");
   const handleRetake = () => {
     setCapturedPreview(null);
     setCapturedBase64(null);
+    setCapturedArtifact(null);
     setCaptureMode("live");
   };
   const handleConfirmSubmit = () => {
@@ -1148,14 +1245,15 @@ function FaceCaptureModal({
         {
           onCapture: handleCameraCapture,
           onCancel: handleCameraCancel,
-          message: livenessMessage
+          message: livenessMessage,
+          assetBasePath: mediapipeAssetBasePath
         }
       ), /* @__PURE__ */ React.createElement("p", { style: attemptsTextStyle }, "Attempt ", attempts + 1, " of ", maxAttempts));
     }
     if (captureMode === "preview" && capturedPreview) {
       return /* @__PURE__ */ React.createElement("div", { style: contentStyle }, declinedReason && /* @__PURE__ */ React.createElement("div", { style: alertBoxStyle }, /* @__PURE__ */ React.createElement("strong", null, "Verification declined."), /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, declinedReason)), /* @__PURE__ */ React.createElement("p", { style: subtitleStyle }, "Looks good? Submit this selfie or retake it."), /* @__PURE__ */ React.createElement("div", { style: previewBoxStyle }, /* @__PURE__ */ React.createElement("img", { src: capturedPreview, alt: "Captured selfie preview", style: previewImgStyle })), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: handleConfirmSubmit }, /* @__PURE__ */ React.createElement("img", { src: Done, alt: "", width: 20, height: 20 }), /* @__PURE__ */ React.createElement("span", null, "Submit")), /* @__PURE__ */ React.createElement("button", { style: secondaryButtonStyle, onClick: handleRetake }, "Retake"), /* @__PURE__ */ React.createElement("button", { style: cancelButtonStyle, onClick: () => close(null) }, "Cancel")), /* @__PURE__ */ React.createElement("p", { style: attemptsTextStyle }, "Attempt ", attempts + 1, " of ", maxAttempts));
     }
-    return /* @__PURE__ */ React.createElement("div", { style: contentStyle }, /* @__PURE__ */ React.createElement("div", { style: visualGuideContainerStyle }, /* @__PURE__ */ React.createElement("div", { style: visualGuideStyle }, /* @__PURE__ */ React.createElement("div", { style: circleStyle }, /* @__PURE__ */ React.createElement("img", { src: Camera, alt: "", width: 48, height: 48 })), /* @__PURE__ */ React.createElement("div", { style: badgeStyle }, /* @__PURE__ */ React.createElement("img", { src: Done, alt: "", width: 16, height: 16 })))), declinedReason && /* @__PURE__ */ React.createElement("div", { style: alertBoxStyle }, /* @__PURE__ */ React.createElement("strong", null, "Verification declined."), /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, declinedReason)), /* @__PURE__ */ React.createElement("div", { style: instructionsBoxStyle }, /* @__PURE__ */ React.createElement("h3", { style: instructionsTitleStyle }, "Tips for best results:"), /* @__PURE__ */ React.createElement("ul", { style: instructionsListStyle }, /* @__PURE__ */ React.createElement("li", { style: instructionItemStyle }, /* @__PURE__ */ React.createElement("span", { style: bulletStyle }, "\u2022"), /* @__PURE__ */ React.createElement("span", null, "Ensure good lighting on your face")), /* @__PURE__ */ React.createElement("li", { style: instructionItemStyle }, /* @__PURE__ */ React.createElement("span", { style: bulletStyle }, "\u2022"), /* @__PURE__ */ React.createElement("span", null, "Remove glasses or accessories if possible")), /* @__PURE__ */ React.createElement("li", { style: instructionItemStyle }, /* @__PURE__ */ React.createElement("span", { style: bulletStyle }, "\u2022"), /* @__PURE__ */ React.createElement("span", null, "Look directly at the camera")))), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: handleOpenCamera }, /* @__PURE__ */ React.createElement("img", { src: Camera, alt: "", width: 20, height: 20 }), /* @__PURE__ */ React.createElement("span", null, declinedReason ? "Try again" : "Open Camera")), hasMethodChoice && /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ React.createElement("div", { style: contentStyle }, /* @__PURE__ */ React.createElement("div", { style: visualGuideContainerStyle }, /* @__PURE__ */ React.createElement("div", { style: visualGuideStyle }, /* @__PURE__ */ React.createElement("div", { style: circleStyle }, /* @__PURE__ */ React.createElement("img", { src: Camera, alt: "", width: 48, height: 48 })), /* @__PURE__ */ React.createElement("div", { style: badgeStyle }, /* @__PURE__ */ React.createElement("img", { src: Done, alt: "", width: 16, height: 16 })))), declinedReason && /* @__PURE__ */ React.createElement("div", { style: alertBoxStyle }, /* @__PURE__ */ React.createElement("strong", null, "Verification declined."), /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, declinedReason)), /* @__PURE__ */ React.createElement("div", { style: instructionsBoxStyle }, /* @__PURE__ */ React.createElement("h3", { style: instructionsTitleStyle }, "Tips for best results:"), /* @__PURE__ */ React.createElement("ul", { style: instructionsListStyle }, /* @__PURE__ */ React.createElement("li", { style: instructionItemStyle }, /* @__PURE__ */ React.createElement("span", { style: bulletStyle }, "\u2022"), /* @__PURE__ */ React.createElement("span", null, "Ensure good lighting on your face")), /* @__PURE__ */ React.createElement("li", { style: instructionItemStyle }, /* @__PURE__ */ React.createElement("span", { style: bulletStyle }, "\u2022"), /* @__PURE__ */ React.createElement("span", null, "Remove glasses or accessories if possible")), /* @__PURE__ */ React.createElement("li", { style: instructionItemStyle }, /* @__PURE__ */ React.createElement("span", { style: bulletStyle }, "\u2022"), /* @__PURE__ */ React.createElement("span", null, "Look directly at the camera")))), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: handleOpenCamera }, /* @__PURE__ */ React.createElement("img", { src: Camera, alt: "", width: 20, height: 20 }), /* @__PURE__ */ React.createElement("span", null, declinedReason ? "Try Again" : "Open Camera")), hasMethodChoice && /* @__PURE__ */ React.createElement(
       "button",
       {
         style: secondaryButtonStyle,
@@ -1167,10 +1265,10 @@ function FaceCaptureModal({
   const renderSubmitting = () => /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: { ...spinnerStyle, margin: "24px auto", width: 32, height: 32 } }), /* @__PURE__ */ React.createElement("p", { style: subtitleStyle }, "Verifying your photo\u2026"), /* @__PURE__ */ React.createElement("p", { style: { ...attemptsTextStyle, marginTop: 8 } }, "This usually takes a few seconds."));
   const renderAccepted = (result) => /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: successCircleStyle }, /* @__PURE__ */ React.createElement("img", { src: Done, alt: "", width: 48, height: 48 })), /* @__PURE__ */ React.createElement("h3", { style: titleStyle }, "Verified"), /* @__PURE__ */ React.createElement("p", { style: subtitleStyle }, "Your identity has been confirmed. You can continue."), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: () => close(result) }, "Continue")));
   const renderDeclined = (result) => /* @__PURE__ */ React.createElement("div", { style: contentStyle }, /* @__PURE__ */ React.createElement("div", { style: alertBoxStyle }, /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, result.declined_reason ?? "We couldn't match your selfie. Please take a new one.")), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: handleRetakeAfterDecline }, /* @__PURE__ */ React.createElement("img", { src: Camera, alt: "", width: 20, height: 20 }), /* @__PURE__ */ React.createElement("span", null, "Retake")), /* @__PURE__ */ React.createElement("button", { style: cancelButtonStyle, onClick: () => close(result) }, "Cancel")), /* @__PURE__ */ React.createElement("p", { style: attemptsTextStyle }, "Attempt ", Math.min(attempts + 1, maxAttempts), " of ", maxAttempts));
-  const renderMaxAttempts = (result) => /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: errorCircleStyle }, "!"), /* @__PURE__ */ React.createElement("h3", { style: titleStyle }, "Maximum Attempts Reached"), /* @__PURE__ */ React.createElement("p", { style: subtitleStyle }, result.declined_reason ?? "We couldn't verify your identity after several attempts."), result.data?.freeze_account && /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, "For your security, your account has been temporarily restricted", result.data.freeze_duration_minutes ? ` for ${result.data.freeze_duration_minutes} minutes` : "", ". Please contact support if you need immediate help."), result.data?.enforce_logout && /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, "You will be signed out of your session."), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: () => close(result) }, "Close")));
+  const renderMaxAttempts = (result) => /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: errorCircleStyle }, "!"), /* @__PURE__ */ React.createElement("h3", { style: titleStyle }, "Maximum Attempts Reached"), /* @__PURE__ */ React.createElement("p", { style: subtitleStyle }, result.declined_reason ?? "We couldn't verify your identity after several attempts."), result.data?.freeze_account && /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, "For your security, your account has been temporarily restricted", result.data.freeze_duration_minutes ? ` for ${result.data.freeze_duration_minutes} minutes` : "", ". Please contact support if you need immediate help."), result.data?.enforce_logout && /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, "You will be signed out of your session."), result.data?.block && /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, "This action has been blocked for security reasons."), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: () => close(result) }, "Close")));
   const renderError = (message) => {
     const sessionExpired = /session\s+expired/i.test(message);
-    return /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: errorCircleStyle }, "!"), /* @__PURE__ */ React.createElement("h3", { style: titleStyle }, sessionExpired ? "Session expired" : "Something went wrong"), /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, sessionExpired ? "Your verification session is no longer valid. Please start a new verification from the beginning." : message), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, !sessionExpired && /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: () => setStage({ kind: "capture" }) }, "Try again"), /* @__PURE__ */ React.createElement("button", { style: cancelButtonStyle, onClick: () => close(null) }, sessionExpired ? "Close" : "Cancel")));
+    return /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: errorCircleStyle }, "!"), /* @__PURE__ */ React.createElement("h3", { style: titleStyle }, sessionExpired ? "Session expired" : "Something Went Wrong"), /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, sessionExpired ? "Your verification session is no longer valid. Please start a new verification from the beginning." : message), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, !sessionExpired && /* @__PURE__ */ React.createElement("button", { style: primaryButtonStyle, onClick: () => setStage({ kind: "capture" }) }, "Try Again"), /* @__PURE__ */ React.createElement("button", { style: cancelButtonStyle, onClick: () => close(null) }, sessionExpired ? "Close" : "Cancel")));
   };
   const body = (() => {
     switch (stage.kind) {
@@ -1379,59 +1477,10 @@ var attemptsTextStyle = {
 };
 var footerStyle = { padding: "12px 24px 16px", borderTop: "1px solid #f3f4f6" };
 var footerTextStyle = { margin: 0, fontSize: 12, color: "#9ca3af", textAlign: "center" };
-var FACE_MESSAGES = {
-  idle: "Initializing camera...",
-  loading: "Loading face detection...",
-  scanning: "Position your face in the circle",
-  too_far: "Face too far. Please move closer to the camera",
-  too_close: "Too close. Please move back a little",
-  off_center: "Center your face in the circle",
-  ok: "Looking great! Tap the button to capture"
-};
-var FACE_COLORS = {
-  idle: "#9ca3af",
-  loading: "#3b82f6",
-  scanning: "#3b82f6",
-  too_far: "#ef4444",
-  too_close: "#f59e0b",
-  off_center: "#f59e0b",
-  ok: "#10b981"
-};
-var MEDIAPIPE_BASE = "https://cdn.jsdelivr.net/npm/@mediapipe/face_detection";
-var mediapipeLoaderPromise = null;
-function loadMediaPipeFaceDetection() {
-  if (typeof window === "undefined" || typeof document === "undefined") {
-    return Promise.reject(new Error("MediaPipe requires a browser environment"));
-  }
-  const w = window;
-  if (w.FaceDetection) {
-    return Promise.resolve(w.FaceDetection);
-  }
-  if (mediapipeLoaderPromise) return mediapipeLoaderPromise;
-  mediapipeLoaderPromise = new Promise((resolve, reject) => {
-    const script = document.createElement("script");
-    script.src = `${MEDIAPIPE_BASE}/face_detection.js`;
-    script.async = true;
-    script.crossOrigin = "anonymous";
-    script.onload = () => {
-      if (w.FaceDetection) {
-        resolve(w.FaceDetection);
-      } else {
-        mediapipeLoaderPromise = null;
-        reject(new Error("MediaPipe loaded but FaceDetection global is missing"));
-      }
-    };
-    script.onerror = () => {
-      mediapipeLoaderPromise = null;
-      reject(new Error("Failed to load MediaPipe face_detection script"));
-    };
-    document.head.appendChild(script);
-  });
-  return mediapipeLoaderPromise;
-}
-function LiveCamera({ onCapture, onCancel, message }) {
+function LiveCamera({ onCapture, onCancel, message, assetBasePath }) {
   const videoRef = useRef(null);
   const streamRef = useRef(null);
+  const samplesRef = useRef([]);
   const [ready, setReady] = useState(false);
   const [error, setError] = useState(null);
   const [faceStatus, setFaceStatus] = useState("idle");
@@ -1486,31 +1535,29 @@ function LiveCamera({ onCapture, onCancel, message }) {
     let detector = null;
     setFaceStatus("loading");
     setFaceDetectionFailed(false);
+    samplesRef.current = [];
     (async () => {
       try {
-        const FaceDetection = await loadMediaPipeFaceDetection();
+        const FaceDetection = await loadMediaPipeFaceDetection(assetBasePath);
         if (cancelled) return;
+        const assetBase = resolveMediaPipeBase(assetBasePath);
         const d = new FaceDetection({
-          locateFile: (f) => `${MEDIAPIPE_BASE}/${f}`
+          locateFile: (f) => `${assetBase}/${f}`
         });
         d.setOptions({ model: "short", minDetectionConfidence: 0.5 });
         d.onResults((results) => {
           if (cancelled) return;
           const detections = results.detections ?? [];
-          let next;
-          if (detections.length === 0) {
-            next = "scanning";
-          } else {
-            const bb = detections[0].boundingBox;
-            if (bb.width < 0.18) next = "too_far";
-            else if (bb.width > 0.72) next = "too_close";
-            else if (bb.xCenter < 0.28 || bb.xCenter > 0.72 || bb.yCenter < 0.28 || bb.yCenter > 0.72) {
-              next = "off_center";
-            } else {
-              next = "ok";
-            }
+          const status = mapDetectionsToFaceStatus(detections);
+          samplesRef.current.push({
+            t: Date.now(),
+            status,
+            ...detections.length > 0 ? { boundingBox: detections[0].boundingBox } : {}
+          });
+          if (samplesRef.current.length > LIVENESS_SAMPLE_LIMIT) {
+            samplesRef.current.shift();
           }
-          setFaceStatus(next);
+          setFaceStatus(status);
         });
         await d.initialize();
         if (cancelled) return;
@@ -1546,7 +1593,7 @@ function LiveCamera({ onCapture, onCancel, message }) {
       } catch {
       }
     };
-  }, [ready]);
+  }, [ready, assetBasePath]);
   const capture = () => {
     const video = videoRef.current;
     if (!video || !video.videoWidth) return;
@@ -1563,7 +1610,7 @@ function LiveCamera({ onCapture, onCancel, message }) {
     ctx.drawImage(video, sx, sy, size, size, 0, 0, size, size);
     streamRef.current?.getTracks().forEach((t) => t.stop());
     streamRef.current = null;
-    onCapture(canvas.toDataURL("image/jpeg", 0.9));
+    onCapture(canvas.toDataURL("image/jpeg", 0.9), buildLivenessArtifact(samplesRef.current));
   };
   if (error) {
     return /* @__PURE__ */ React.createElement("div", { style: { ...contentStyle, alignItems: "center", textAlign: "center", padding: 0 } }, /* @__PURE__ */ React.createElement("div", { style: errorCircleStyle }, "!"), /* @__PURE__ */ React.createElement("h3", { style: titleStyle }, "Camera unavailable"), /* @__PURE__ */ React.createElement("p", { style: alertTextStyle }, error), /* @__PURE__ */ React.createElement("div", { style: buttonsContainerStyle }, /* @__PURE__ */ React.createElement("button", { style: secondaryButtonStyle, onClick: onCancel }, "Back")));
@@ -1571,7 +1618,7 @@ function LiveCamera({ onCapture, onCancel, message }) {
   const detectionActive = ready && !faceDetectionFailed;
   const liveMessage = detectionActive ? FACE_MESSAGES[faceStatus] : message;
   const liveFaceColor = detectionActive ? FACE_COLORS[faceStatus] : void 0;
-  const captureDisabled = !ready || detectionActive && faceStatus !== "ok";
+  const captureDisabled = isCaptureDisabled(ready, detectionActive, faceStatus);
   const ringPulse = detectionActive && (faceStatus === "too_far" || faceStatus === "too_close") ? "pulse 1.5s ease-in-out infinite" : void 0;
   const dynamicCircleStyle = {
     ...faceCircleStyle,
@@ -2098,6 +2145,7 @@ function useEventBasedFaceVerificationSubmission(client) {
         defaultDevice: opts.defaultDevice,
         renderQR: opts.renderQR,
         onCancel: opts.onCancel,
+        mediapipeAssetBasePath: opts.mediapipeAssetBasePath,
         onComplete: (result) => {
           cleanup();
           resolve(result);