idmission-web-sdk 2.3.89 → 2.3.90

package/dist/sdk2.esm.js

@@ -7,7 +7,7 @@ import { createPortal } from 'react-dom';
 import { useTranslation, initReactI18next } from 'react-i18next';
 import { Upload } from 'tus-js-client';
 import SparkMD5 from 'spark-md5';
-import { ImageSegmenter, FilesetResolver, ImageClassifier, FaceDetector, ObjectDetector } from '@mediapipe/tasks-vision';
+import { ImageSegmenter, FilesetResolver, ObjectDetector, ImageClassifier, FaceDetector } from '@mediapipe/tasks-vision';
 import { useStore, createStore, create } from 'zustand';
 import LanguageDetector from 'i18next-browser-languagedetector';
 import i18n from 'i18next';
@@ -205,7 +205,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.3.89';
+var webSdkVersion = '2.3.90';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -466,27 +466,27 @@ var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
   if (!portalLocation) return element;
   return /*#__PURE__*/createPortal(element, portalLocation);
 };
-var GuidanceMessage = styled.div(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n  margin-left: auto;\n  margin-right: auto;\n  background: ", ";\n  color: ", ";\n  border-radius: 8px;\n  z-index: 10001;\n  padding: 16px 24px;\n  font-size: 18px;\n  font-weight: bold;\n  box-shadow:\n    0 1px 3px 0 rgb(0 0 0 / 0.1),\n    0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n  margin-left: auto;\n  margin-right: auto;\n  background: ", ";\n  color: ", ";\n  border-radius: 8px;\n  z-index: 10001;\n  padding: 16px 24px;\n  font-size: 18px;\n  font-weight: bold;\n  box-shadow:\n    0 1px 3px 0 rgb(0 0 0 / 0.1),\n    0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])), function (props) {
+var GuidanceMessage = styled.div(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n  margin-left: auto;\n  margin-right: auto;\n  background: ", ";\n  color: ", ";\n  border-radius: 8px;\n  z-index: 10001;\n  padding: 16px 24px;\n  font-size: 18px;\n  font-weight: bold;\n  box-shadow:\n    0 1px 3px 0 rgb(0 0 0 / 0.1),\n    0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n  margin-left: auto;\n  margin-right: auto;\n  background: ", ";\n  color: ", ";\n  border-radius: 8px;\n  z-index: 10001;\n  padding: 16px 24px;\n  font-size: 18px;\n  font-weight: bold;\n  box-shadow:\n    0 1px 3px 0 rgb(0 0 0 / 0.1),\n    0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])), function (props) {
   var _a, _b, _c, _d, _e, _f;
   return (_f = (_a = props.$background) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.backgroundColor) !== null && _f !== void 0 ? _f : 'white';
 }, function (props) {
   var _a, _b, _c, _d, _e, _f;
   return (_f = (_a = props.$textColor) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.textColor) !== null && _f !== void 0 ? _f : 'black';
 });
-var templateObject_1$P, templateObject_2$I;
+var templateObject_1$P, templateObject_2$J;
 
 var wavesAnimation = keyframes(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n    0% {\n        opacity: 0;\n        transform: scale3d(1, 1, 1);\n    }\n    80% {\n        opacity: 1;\n    }\n    100% {\n        transform: scale3d(2, 2, 1);\n        opacity: 0;\n    }\n"], ["\n    0% {\n        opacity: 0;\n        transform: scale3d(1, 1, 1);\n    }\n    80% {\n        opacity: 1;\n    }\n    100% {\n        transform: scale3d(2, 2, 1);\n        opacity: 0;\n    }\n"])));
-var progressBarAnimation = keyframes(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n    0% {\n        width: 0;\n    }\n    100% {\n        width: 100%;\n    }\n"], ["\n    0% {\n        width: 0;\n    }\n    100% {\n        width: 100%;\n    }\n"])));
+var progressBarAnimation = keyframes(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n    0% {\n        width: 0;\n    }\n    100% {\n        width: 100%;\n    }\n"], ["\n    0% {\n        width: 0;\n    }\n    100% {\n        width: 100%;\n    }\n"])));
 var dualRingSpinnerAnimation = keyframes(templateObject_3$u || (templateObject_3$u = __makeTemplateObject(["\n    0% {\n        transform: rotate(0deg);\n    }\n    100% {\n        transform: rotate(360deg);\n    }\n"], ["\n    0% {\n        transform: rotate(0deg);\n    }\n    100% {\n        transform: rotate(360deg);\n    }\n"])));
 var progressBorderAnimation = keyframes(templateObject_4$o || (templateObject_4$o = __makeTemplateObject(["\n    to {\n        stroke-dashoffset: 0;\n    }\n"], ["\n    to {\n        stroke-dashoffset: 0;\n    }\n"])));
-var templateObject_1$O, templateObject_2$H, templateObject_3$u, templateObject_4$o;
+var templateObject_1$O, templateObject_2$I, templateObject_3$u, templateObject_4$o;
 
 var OverlayContainer = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  flex-direction: column;\n\n  overflow-x: hidden;\n  overflow-y: auto;\n\n  background: ", ";\n  ", "\n\n  z-index: 10000;\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  flex-direction: column;\n\n  overflow-x: hidden;\n  overflow-y: auto;\n\n  background: ", ";\n  ", "\n\n  z-index: 10000;\n"])), function (props) {
   return props.theme.background ? "".concat(props.theme.background) : "white";
 }, function (props) {
   return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
 });
-var OverlayInner$2 = styled.div(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n  text-align: ", ";\n  display: flex;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  width: 100%;\n  height: 100%;\n  ", "\n"], ["\n  text-align: ", ";\n  display: flex;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  width: 100%;\n  height: 100%;\n  ", "\n"])), function (props) {
+var OverlayInner$2 = styled.div(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n  text-align: ", ";\n  display: flex;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  width: 100%;\n  height: 100%;\n  ", "\n"], ["\n  text-align: ", ";\n  display: flex;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  width: 100%;\n  height: 100%;\n  ", "\n"])), function (props) {
   var _a;
   return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
 }, function (props) {
@@ -534,7 +534,7 @@ var LoadingOverlayLoadingListItem = styled.li(templateObject_19 || (templateObje
 var LoadingOverlayProgressContainer = styled.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
 var LoadingOverlayCustomLoadingGraphic = styled.img(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  transform-style: preserve-3d;\n"], ["\n  transform-style: preserve-3d;\n"])));
 var LoadingOverlayContinueButtonContainer = styled.div(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
-var templateObject_1$N, templateObject_2$G, templateObject_3$t, templateObject_4$n, templateObject_5$f, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22;
+var templateObject_1$N, templateObject_2$H, templateObject_3$t, templateObject_4$n, templateObject_5$f, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22;
 
 var GeolocationAccessDeniedOverlay = function GeolocationAccessDeniedOverlay(_a) {
   var accessBlockedImageUrl = _a.accessBlockedImageUrl;
@@ -1103,6 +1103,11 @@ var SubmissionContext = /*#__PURE__*/createContext({
   idFrontImage: null,
   idBackImage: null,
   passportImage: null,
+  idFrontIrImage: null,
+  idBackIrImage: null,
+  idFrontUvImage: null,
+  idBackUvImage: null,
+  idBarcodeImage: null,
   selfieImage: null,
   signatureData: null,
   signatureVideoUrl: null,
@@ -1133,6 +1138,9 @@ var SubmissionContext = /*#__PURE__*/createContext({
   setIdBackUvImage: function setIdBackUvImage() {
     return null;
   },
+  setIdBarcodeImage: function setIdBarcodeImage() {
+    return null;
+  },
   setSelfieImage: function setSelfieImage() {
     return null;
   },
@@ -1306,59 +1314,62 @@ var SubmissionProvider = function SubmissionProvider(_a) {
     passportImage = _13[0],
     setPassportImage = _13[1];
   var _14 = useState(null),
-    selfieImage = _14[0],
-    setSelfieImage = _14[1];
+    idBarcodeImage = _14[0],
+    setIdBarcodeImage = _14[1];
   var _15 = useState(null),
-    signatureData = _15[0],
-    setSignatureData = _15[1];
+    selfieImage = _15[0],
+    setSelfieImage = _15[1];
   var _16 = useState(null),
-    signatureVideoUrl = _16[0],
-    setSignatureVideoUrl = _16[1];
+    signatureData = _16[0],
+    setSignatureData = _16[1];
   var _17 = useState(null),
-    signatureStartTimestamp = _17[0],
-    setSignatureStartTimestamp = _17[1];
+    signatureVideoUrl = _17[0],
+    setSignatureVideoUrl = _17[1];
   var _18 = useState(null),
-    signatureEndTimestamp = _18[0],
-    setSignatureEndTimestamp = _18[1];
+    signatureStartTimestamp = _18[0],
+    setSignatureStartTimestamp = _18[1];
   var _19 = useState(null),
-    idCaptureVideoUrl = _19[0],
-    setIdCaptureVideoUrl = _19[1];
+    signatureEndTimestamp = _19[0],
+    setSignatureEndTimestamp = _19[1];
   var _20 = useState(null),
-    idCaptureVideoIdFrontImage = _20[0],
-    setIdCaptureVideoIdFrontImage = _20[1];
+    idCaptureVideoUrl = _20[0],
+    setIdCaptureVideoUrl = _20[1];
   var _21 = useState(null),
-    idCaptureVideoIdBackImage = _21[0],
-    setIdCaptureVideoIdBackImage = _21[1];
+    idCaptureVideoIdFrontImage = _21[0],
+    setIdCaptureVideoIdFrontImage = _21[1];
   var _22 = useState(null),
-    idCaptureVideoAudioUrl = _22[0],
-    setIdCaptureVideoAudioUrl = _22[1];
+    idCaptureVideoIdBackImage = _22[0],
+    setIdCaptureVideoIdBackImage = _22[1];
   var _23 = useState(null),
-    idCaptureVideoAudioStartsAt = _23[0],
-    setIdCaptureVideoAudioStartsAt = _23[1];
+    idCaptureVideoAudioUrl = _23[0],
+    setIdCaptureVideoAudioUrl = _23[1];
   var _24 = useState(null),
-    expectedAudioText = _24[0],
-    setExpectedAudioText = _24[1];
+    idCaptureVideoAudioStartsAt = _24[0],
+    setIdCaptureVideoAudioStartsAt = _24[1];
   var _25 = useState(null),
-    additionalDocuments = _25[0],
-    setAdditionalDocuments = _25[1];
+    expectedAudioText = _25[0],
+    setExpectedAudioText = _25[1];
   var _26 = useState(null),
-    geolocationResult = _26[0],
-    setGeolocationResult = _26[1];
-  var _27 = useState(0),
-    geolocationAttempts = _27[0],
-    setGeolocationAttempts = _27[1];
-  var _28 = useState(false),
-    geolocationBlocked = _28[0],
-    setGeolocationBlocked = _28[1];
-  var _29 = useState([]),
-    idFrontCaptureAttempts = _29[0],
-    setIdFrontCaptureAttempts = _29[1];
+    additionalDocuments = _26[0],
+    setAdditionalDocuments = _26[1];
+  var _27 = useState(null),
+    geolocationResult = _27[0],
+    setGeolocationResult = _27[1];
+  var _28 = useState(0),
+    geolocationAttempts = _28[0],
+    setGeolocationAttempts = _28[1];
+  var _29 = useState(false),
+    geolocationBlocked = _29[0],
+    setGeolocationBlocked = _29[1];
   var _30 = useState([]),
-    idBackCaptureAttempts = _30[0],
-    setIdBackCaptureAttempts = _30[1];
+    idFrontCaptureAttempts = _30[0],
+    setIdFrontCaptureAttempts = _30[1];
   var _31 = useState([]),
-    selfieCaptureAttempts = _31[0],
-    setSelfieCaptureAttempts = _31[1];
+    idBackCaptureAttempts = _31[0],
+    setIdBackCaptureAttempts = _31[1];
+  var _32 = useState([]),
+    selfieCaptureAttempts = _32[0],
+    setSelfieCaptureAttempts = _32[1];
   var logIdFrontCaptureAttempt = useCallback(function (attempt) {
     setIdFrontCaptureAttempts(function (attempts) {
       return __spreadArray(__spreadArray([], attempts, true), [attempt], false);
@@ -1484,6 +1495,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
               idFrontImage: idFrontImage,
               idBackImage: idBackImage,
               passportImage: passportImage,
+              idBarcodeImage: idBarcodeImage,
               selfieImage: selfieImage
             };
             _a = signatureVideoUrl;
@@ -1589,6 +1601,9 @@ var SubmissionProvider = function SubmissionProvider(_a) {
             if (documents.passportImage) {
               submissionRequest.customerData.idData.idImageFront = documents.passportImage;
             }
+            if (documents.idBarcodeImage) {
+              submissionRequest.customerData.idData.idBarcodeImage = documents.idBarcodeImage;
+            }
             if (documents.idFrontIrImage) {
               submissionRequest.customerData.idData.idFrontIrImage = documents.idFrontIrImage;
             }
@@ -1683,7 +1698,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
         }
       });
     });
-  }, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idCardForFaceMatch, idData, idFrontCaptureAttempts, idFrontImage, idFrontIrImage, idFrontUvImage, idImageResolutionCheck, jobId, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureEndTimestamp, signatureStartTimestamp, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksFireOnReviewURL, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters, webhooksURL]);
+  }, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idBackIrImage, idBackUvImage, idBarcodeImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idCardForFaceMatch, idData, idFrontCaptureAttempts, idFrontImage, idFrontIrImage, idFrontUvImage, idImageResolutionCheck, jobId, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureEndTimestamp, signatureStartTimestamp, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksFireOnReviewURL, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters, webhooksURL]);
   var defaultOnSubmit = useCallback(function () {
     return __awaiter(void 0, void 0, void 0, function () {
       var submissionResponse_1, payload, host, endpoint, response, statusMessage, submissionResponse_2, e_1, err;
@@ -1961,6 +1976,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
       idFrontUvImage: idFrontUvImage,
       idBackUvImage: idBackUvImage,
       passportImage: passportImage,
+      idBarcodeImage: idBarcodeImage,
       selfieImage: selfieImage,
       signatureData: signatureData,
       signatureVideoUrl: signatureVideoUrl,
@@ -1977,6 +1993,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
       setIdBackIrImage: setIdBackIrImage,
       setIdFrontUvImage: setIdFrontUvImage,
       setIdBackUvImage: setIdBackUvImage,
+      setIdBarcodeImage: setIdBarcodeImage,
       setSelfieImage: setSelfieImage,
       setSignatureData: setSignatureData,
       setSignatureVideoUrl: setSignatureVideoUrl,
@@ -1997,7 +2014,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
       checkLiveness: checkLiveness,
       retryLocationAccess: retryLocationAccess
     };
-  }, [additionalDocuments, checkLiveness, environment, idBackImage, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idFrontImage, idFrontIrImage, idFrontUvImage, livenessCheckRequest, logIdBackCaptureAttempt, logIdFrontCaptureAttempt, logSelfieCaptureAttempt, passportImage, retryLocationAccess, selfieImage, signatureData, signatureVideoUrl, submissionError, submissionRequest, submissionResponse, submissionStatus, submit, uploadDocument]);
+  }, [additionalDocuments, checkLiveness, environment, idBackImage, idBackIrImage, idBackUvImage, idBarcodeImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idFrontImage, idFrontIrImage, idFrontUvImage, livenessCheckRequest, logIdBackCaptureAttempt, logIdFrontCaptureAttempt, logSelfieCaptureAttempt, passportImage, retryLocationAccess, selfieImage, signatureData, signatureVideoUrl, submissionError, submissionRequest, submissionResponse, submissionStatus, submit, uploadDocument]);
   return /*#__PURE__*/React__default.createElement(SubmissionContext.Provider, {
     value: value
   }, geolocationRequired && geolocationBlocked ? ( /*#__PURE__*/React__default.createElement(GeolocationAccessDeniedOverlay, null)) : children, submissionError && ( /*#__PURE__*/React__default.createElement(SubmissionErrorOverlay, {
@@ -2191,97 +2208,6 @@ function preloadVisionRuntime() {
   });
 }
 
-function getFrameDimensions(frame) {
-  var frameWidth = frame.width,
-    frameHeight = frame.height;
-  if (frame instanceof HTMLImageElement) {
-    frameWidth = frame.naturalWidth;
-    frameHeight = frame.naturalHeight;
-  }
-  if (frame instanceof HTMLVideoElement) {
-    frameWidth = frame.videoWidth;
-    frameHeight = frame.videoHeight;
-  }
-  return [frameWidth, frameHeight];
-}
-
-var InvisibleCanvas = styled.canvas(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n  display: none;\n"], ["\n  display: none;\n"])));
-function drawToCanvas(canvas, frame, width, height) {
-  if (!canvas) return;
-  var ctx = canvas.getContext('2d');
-  if (!ctx) return;
-  if (!width || !height) {
-    var _a = getFrameDimensions(frame),
-      frameWidth = _a[0],
-      frameHeight = _a[1];
-    width || (width = frameWidth);
-    height || (height = frameHeight);
-  }
-  canvas.width = width;
-  canvas.height = height;
-  ctx.drawImage(frame, 0, 0, width, height);
-}
-function clearCanvas(canvas) {
-  var _a;
-  (_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas === null || canvas === void 0 ? void 0 : canvas.width, canvas === null || canvas === void 0 ? void 0 : canvas.height);
-}
-var templateObject_1$M;
-
-function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
-  var _a;
-  if (quality === void 0) {
-    quality = 0.92;
-  }
-  if (!rawCanvas || !cropCanvas || !resizeCanvas) return '';
-  var rawCtx = rawCanvas.getContext('2d');
-  var cropCtx = cropCanvas.getContext('2d');
-  var resizeCtx = resizeCanvas.getContext('2d');
-  if (!rawCtx || !cropCtx || !resizeCtx) throw new Error('could not get 2d context');
-  rawCanvas.width = frame.width;
-  rawCanvas.height = frame.height;
-  rawCtx.putImageData(frame, 0, 0);
-  if (frame.height > frame.width) {
-    cropCanvas.width = frame.width;
-    cropCanvas.height = frame.height;
-    cropCtx.drawImage(rawCanvas, 0, 0, cropCanvas.width, cropCanvas.height);
-  } else {
-    var _b = (_a = face === null || face === void 0 ? void 0 : face.box) !== null && _a !== void 0 ? _a : {
-        xMin: 0,
-        width: frame.width
-      },
-      xMin = _b.xMin,
-      width = _b.width;
-    var desiredWidth = frame.height * 0.6;
-    var faceCenterX = xMin + width / 2;
-    var xPos = Math.max(0, faceCenterX - desiredWidth / 2);
-    cropCanvas.width = desiredWidth;
-    cropCanvas.height = frame.height;
-    cropCtx.drawImage(rawCanvas, xPos, 0, cropCanvas.width, cropCanvas.height, 0, 0, cropCanvas.width, cropCanvas.height);
-  }
-  resizeCanvas.height = maxHeight !== null && maxHeight !== void 0 ? maxHeight : cropCanvas.height;
-  resizeCanvas.width = cropCanvas.width * (resizeCanvas.height / cropCanvas.height);
-  resizeCtx === null || resizeCtx === void 0 ? void 0 : resizeCtx.drawImage(cropCanvas, 0, 0, resizeCanvas.width, resizeCanvas.height);
-  var dataURL = resizeCanvas.toDataURL('image/jpeg', quality);
-  log('cropToShoulders size', new TextEncoder().encode(dataURL).length);
-  clearCanvas(rawCanvas);
-  clearCanvas(cropCanvas);
-  clearCanvas(resizeCanvas);
-  return dataURL;
-}
-function cropToDetectedObjectBox(frame, box, canvas) {
-  canvas || (canvas = document.createElement('canvas'));
-  var ctx = canvas.getContext('2d');
-  if (!ctx) throw new Error('could not get 2d context');
-  var xMin = box.xMin,
-    yMin = box.yMin,
-    width = box.width,
-    height = box.height;
-  canvas.width = width;
-  canvas.height = height;
-  ctx.drawImage(frame, xMin, yMin, width, height, 0, 0, width, height);
-  return canvas;
-}
-
 var defaultImageSegmenterModelPath = 'https://websdk-cdn-dev.idmission.com/assets/models/selfiesegmenter20240524/selfie_segmenter.tflite';
 var imageSegmenterModelSizeInBytes = 256440.32;
 // The idea here is that we globally set a cache key based on the time at page load. That way our built-in speed test
@@ -2411,6 +2337,192 @@ function giveUpAfter(maxTime) {
   });
 }
 
+var DEFAULT_CDN_URL = 'https://websdk-cdn-dev.idmission.com/assets';
+
+var defaultDocumentDetectorModelPath = "".concat(DEFAULT_CDN_URL, "/models/DocumentDetector/DocumentDetector-20250815_115859.tflite");
+
+var defaultFocusModelPath = "".concat(DEFAULT_CDN_URL, "/models/Focus/Focus-20241008_102708.tflite");
+
+var defaultFaceDetectorModelPath = "".concat(DEFAULT_CDN_URL, "/models/FaceDetector/FaceDetector-20250820_154546.tflite");
+
+var defaultBarcodeReadabilityModelPath = "".concat(DEFAULT_CDN_URL, "/models/BarcodeReadability/BarcodeReadability-20250815_120417.tflite");
+
+var defaultModelPaths = {
+  documentDetector: defaultDocumentDetectorModelPath,
+  focus: defaultFocusModelPath,
+  faceDetection: defaultFaceDetectorModelPath,
+  barcodeReadability: defaultBarcodeReadabilityModelPath
+};
+
+var preloadModels = function preloadModels(_a) {
+  return __awaiter(void 0, [_a], void 0, function (_b) {
+    var preloadTasks;
+    var _c = _b.documentDetectionModel,
+      documentDetectionModel = _c === void 0 ? true : _c,
+      _d = _b.focusModel,
+      focusModel = _d === void 0 ? true : _d,
+      _e = _b.faceDetectionModel,
+      faceDetectionModel = _e === void 0 ? true : _e,
+      _f = _b.barcodeReadabilityModel,
+      barcodeReadabilityModel = _f === void 0 ? true : _f;
+    return __generator(this, function (_g) {
+      switch (_g.label) {
+        case 0:
+          return [4 /*yield*/, probeModelCapabilities()];
+        case 1:
+          _g.sent();
+          preloadTasks = [];
+          if (documentDetectionModel) {
+            preloadTasks.push(preloadDocumentDetectorDependencies);
+          }
+          if (focusModel) {
+            preloadTasks.push(preloadFocusModelDependencies);
+          }
+          if (faceDetectionModel) {
+            preloadTasks.push(preloadFaceDetectorDependencies);
+          }
+          if (barcodeReadabilityModel) {
+            preloadTasks.push(preloadBarcodeReadabilityModelDependencies);
+          }
+          return [4 /*yield*/, Promise.all(preloadTasks)];
+        case 2:
+          _g.sent();
+          return [2 /*return*/];
+      }
+    });
+  });
+};
+var progressByUrl = {};
+var progressByUseCase = {
+  visionRuntime: {
+    loaded: 0,
+    total: 0
+  },
+  documentDetector: {
+    loaded: 0,
+    total: 0
+  },
+  focus: {
+    loaded: 0,
+    total: 0
+  },
+  faceDetection: {
+    loaded: 0,
+    total: 0
+  },
+  barcodeReadability: {
+    loaded: 0,
+    total: 0
+  }
+};
+function preloadDependency(url) {
+  return __awaiter(this, void 0, void 0, function () {
+    return __generator(this, function (_a) {
+      return [2 /*return*/, new Promise(function (resolve, reject) {
+        var req = new XMLHttpRequest();
+        req.addEventListener('progress', function (event) {
+          if (!event.lengthComputable) return;
+          progressByUrl[url] = event;
+          document.dispatchEvent(new CustomEvent('idmission.preloadProgress', {
+            detail: {
+              url: url,
+              loaded: event.loaded,
+              total: event.total
+            }
+          }));
+        });
+        req.addEventListener('loadend', function () {
+          resolve(req.readyState === 4 && req.status === 200);
+        });
+        req.addEventListener('error', reject);
+        req.open('GET', url, true);
+        req.send();
+      })];
+    });
+  });
+}
+var modelsPreloading = {
+  documentDetector: false,
+  focus: false,
+  faceDetection: false,
+  barcodeReadability: false
+};
+var preloadDocumentDetectorDependencies = function preloadDocumentDetectorDependencies() {
+  return preloadModelDependencies('documentDetector');
+};
+var preloadFocusModelDependencies = function preloadFocusModelDependencies() {
+  return preloadModelDependencies('focus');
+};
+var preloadFaceDetectorDependencies = function preloadFaceDetectorDependencies() {
+  return preloadModelDependencies('faceDetection');
+};
+var preloadBarcodeReadabilityModelDependencies = function preloadBarcodeReadabilityModelDependencies() {
+  return preloadModelDependencies('barcodeReadability');
+};
+function preloadModelDependencies(model) {
+  return __awaiter(this, void 0, void 0, function () {
+    function handleModelDownloadProgress(event) {
+      var detail = event.detail;
+      if (!dependencies.includes(detail.url)) return;
+      progressByUseCase[model] = sumUpProgressForDependencies(dependencies);
+      document.dispatchEvent(new CustomEvent("idmission.preloadProgress.".concat(model), {
+        detail: progressByUseCase[model]
+      }));
+    }
+    var dependencies;
+    return __generator(this, function (_a) {
+      switch (_a.label) {
+        case 0:
+          if (modelsPreloading[model]) return [2 /*return*/, new Promise(function (resolve) {
+            var i = setInterval(function () {
+              if (!modelsPreloading[model]) {
+                clearInterval(i);
+                resolve();
+              }
+            }, 100);
+          })];
+          modelsPreloading[model] = true;
+          return [4 /*yield*/, probeModelCapabilities()];
+        case 1:
+          _a.sent();
+          if (modelCapabilities.delegate === 'NONE') {
+            throw new Error("No available delegate for ".concat(model, " model."));
+          }
+          dependencies = [defaultModelPaths[model]];
+          document.addEventListener('idmission.preloadProgress', handleModelDownloadProgress);
+          _a.label = 2;
+        case 2:
+          _a.trys.push([2,, 4, 5]);
+          return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
+        case 3:
+          _a.sent();
+          return [3 /*break*/, 5];
+        case 4:
+          document.removeEventListener('idmission.preloadProgress', handleModelDownloadProgress);
+          modelsPreloading[model] = false;
+          return [7 /*endfinally*/];
+        case 5:
+          return [2 /*return*/];
+      }
+    });
+  });
+}
+function progressToPercentage(progress) {
+  return progress.total > 0 ? Math.round(100.0 * progress.loaded / progress.total) : 0;
+}
+function sumUpProgressForDependencies(dependencies) {
+  return dependencies.reduce(function (result, dependency) {
+    var dependencyProgress = progressByUrl[dependency];
+    if (!dependencyProgress) return result;
+    result.loaded += dependencyProgress.loaded;
+    result.total += dependencyProgress.total;
+    return result;
+  }, {
+    loaded: 0,
+    total: 0
+  });
+}
+
 function convertBoundingBox(box) {
   var _a, _b, _c, _d, _e, _f, _g, _h;
   return {
@@ -2465,53 +2577,50 @@ function average(arr) {
   return sum / len;
 }
 
-var DEFAULT_CDN_URL = 'https://websdk-cdn-dev.idmission.com/assets';
-
-var defaultDocumentDetectorModelPath = "".concat(DEFAULT_CDN_URL, "/models/DocumentDetector/DocumentDetector-20250815_115859.tflite");
-
-var defaultFocusModelPath = "".concat(DEFAULT_CDN_URL, "/models/Focus/Focus-20241008_102708.tflite");
-
-var defaultFaceDetectorModelPath = "".concat(DEFAULT_CDN_URL, "/models/FaceDetector/FaceDetector-20250820_154546.tflite");
-
-var defaultFocusModelLoadTimeoutMs = 45000;
-var defaultFocusThresholds = {
-  idCardFront: {
-    desktop: 0,
-    mobile: 0.3
-  },
-  idCardBack: {
-    desktop: 0,
-    mobile: 0.3
-  },
-  passport: {
-    desktop: 0,
-    mobile: 0.3
-  },
-  singlePage: {
-    desktop: 0,
-    mobile: 0.3
+var defaultDocumentDetectionScoreThreshold = 0.1;
+var defaultDocumentDetectionModelLoadTimeoutMs = 45000;
+var defaultDocumentDetectionThresholds = {
+  idCardFront: 0.6,
+  idCardBack: 0.6,
+  passport: 0.4,
+  singlePage: 0.4,
+  stability: {
+    idCardFront: 0.85,
+    idCardBack: 0.85,
+    passport: 0.5,
+    singlePage: 0.5
   }
 };
-var classifier = null;
-var classifierSettings = null;
-function loadFocusModel() {
-  return __awaiter(this, arguments, void 0, function (modelAssetPath) {
+var documentTypeDisplayNames = {
+  idCardFront: 'ID card front',
+  idCardBack: 'ID card back',
+  passport: 'Passport',
+  singlePage: 'Single page',
+  none: 'None'
+};
+var detector$1 = null;
+var detectorSettings$1 = null;
+function loadDocumentDetector() {
+  return __awaiter(this, arguments, void 0, function (modelAssetPath, scoreThreshold) {
     var _a, _b;
     if (modelAssetPath === void 0) {
-      modelAssetPath = defaultFocusModelPath;
+      modelAssetPath = defaultDocumentDetectorModelPath;
+    }
+    if (scoreThreshold === void 0) {
+      scoreThreshold = defaultDocumentDetectionScoreThreshold;
     }
     return __generator(this, function (_c) {
       switch (_c.label) {
         case 0:
-          if (classifier && (classifierSettings === null || classifierSettings === void 0 ? void 0 : classifierSettings.modelAssetPath) === modelAssetPath) return [2 /*return*/, classifier];
-          closeFocusModel();
-          return [4 /*yield*/, preloadFocusModelDependencies()];
+          if (detector$1 && (detectorSettings$1 === null || detectorSettings$1 === void 0 ? void 0 : detectorSettings$1.modelAssetPath) === modelAssetPath && (detectorSettings$1 === null || detectorSettings$1 === void 0 ? void 0 : detectorSettings$1.scoreThreshold) === scoreThreshold) return [2 /*return*/, detector$1];
+          closeDocumentDetector();
+          return [4 /*yield*/, preloadDocumentDetectorDependencies()];
         case 1:
           _c.sent();
           if (modelCapabilities.delegate === 'NONE') {
-            throw new Error('No available delegate for focus detector.');
+            throw new Error('No available delegate for document detector.');
           }
-          _b = (_a = ImageClassifier).createFromOptions;
+          _b = (_a = ObjectDetector).createFromOptions;
           return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
         case 2:
           return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
@@ -2520,44 +2629,48 @@ function loadFocusModel() {
               delegate: modelCapabilities.delegate
             },
             // canvas: document.createElement('canvas'),
+            scoreThreshold: scoreThreshold,
             runningMode: 'VIDEO'
           }])];
         case 3:
-          classifier = _c.sent();
-          classifierSettings = {
-            modelAssetPath: modelAssetPath
+          detector$1 = _c.sent();
+          detectorSettings$1 = {
+            modelAssetPath: modelAssetPath,
+            scoreThreshold: scoreThreshold
           };
-          return [2 /*return*/, classifier];
+          return [2 /*return*/, detector$1];
       }
     });
   });
 }
-function closeFocusModel() {
-  classifier === null || classifier === void 0 ? void 0 : classifier.close();
-  classifier = null;
-  classifierSettings = null;
+function closeDocumentDetector() {
+  detector$1 === null || detector$1 === void 0 ? void 0 : detector$1.close();
+  detector$1 = null;
+  detectorSettings$1 = null;
 }
-function useLoadFocusModel(_a) {
-  var _b = _a.modelPath,
-    modelPath = _b === void 0 ? defaultFocusModelPath : _b,
-    _c = _a.modelLoadTimeoutMs,
-    modelLoadTimeoutMs = _c === void 0 ? defaultFocusModelLoadTimeoutMs : _c,
+function useLoadDocumentDetector(_a) {
+  var _b = _a.shouldLoadModels,
+    shouldLoadModels = _b === void 0 ? true : _b,
+    _c = _a.modelPath,
+    modelPath = _c === void 0 ? defaultDocumentDetectorModelPath : _c,
+    _d = _a.modelLoadTimeoutMs,
+    modelLoadTimeoutMs = _d === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _d,
+    _e = _a.scoreThreshold,
+    scoreThreshold = _e === void 0 ? defaultDocumentDetectionScoreThreshold : _e,
     onModelError = _a.onModelError,
-    videoRef = _a.videoRef,
-    _d = _a.shouldLoadModels,
-    shouldLoadModels = _d === void 0 ? true : _d;
-  var _e = useState('not-started'),
-    modelLoadState = _e[0],
-    setModelLoadState = _e[1];
-  var _f = useState(0),
-    modelDownloadProgress = _f[0],
-    setModelDownloadProgress = _f[1];
+    videoRef = _a.videoRef;
+  var _f = useState('not-started'),
+    modelLoadState = _f[0],
+    setModelLoadState = _f[1];
   var _g = useState(null),
     modelWarmingStartedAt = _g[0],
     setModelWarmingStartedAt = _g[1];
-  var _h = useState(null),
-    modelError = _h[0],
-    setModelError = _h[1];
+  var _h = useState(0),
+    modelDownloadProgress = _h[0],
+    setModelDownloadProgress = _h[1];
+  var _j = useState(null),
+    modelError = _j[0],
+    setModelError = _j[1];
   useEffect(function loadModel() {
     var _this = this;
     if (!shouldLoadModels) return;
@@ -2566,21 +2679,24 @@ function useLoadFocusModel(_a) {
     function handleDownloadProgress(event) {
       setModelDownloadProgress(progressToPercentage(event.detail));
     }
-    document.addEventListener('idmission.preloadProgress.focus', handleDownloadProgress);
+    document.addEventListener('idmission.preloadProgress.documentDetector', handleDownloadProgress);
     var modelLoadTimeout = setTimeout(function () {
       setModelError(new Error('Model loading time limit exceeded.'));
     }, modelLoadTimeoutMs);
     var cancelVideoReady = function cancelVideoReady() {};
-    loadFocusModel(modelPath).then(function (loadedModel) {
+    loadDocumentDetector(modelPath, scoreThreshold).then(function (model) {
       return __awaiter(_this, void 0, void 0, function () {
         var _a, videoReady, cancel, cancelled;
         return __generator(this, function (_b) {
           switch (_b.label) {
             case 0:
               setModelDownloadProgress(100);
-              clearTimeout(modelLoadTimeout);
               setModelLoadState('warming');
-              setModelWarmingStartedAt(new Date().getTime());
+              setModelWarmingStartedAt(performance.now());
+              clearTimeout(modelLoadTimeout);
+              return [4 /*yield*/, testDocumentDetectionAgainstKnownImage(model)];
+            case 1:
+              _b.sent();
               _a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
               cancelled = false;
               cancelVideoReady = function cancelVideoReady() {
@@ -2588,11 +2704,11 @@ function useLoadFocusModel(_a) {
                 cancel();
               };
               return [4 /*yield*/, videoReady];
-            case 1:
+            case 2:
               _b.sent();
               setTimeout(function () {
                 if (cancelled) return;
-                loadedModel.classifyForVideo(videoRef.current, performance.now());
+                model.detectForVideo(videoRef.current, performance.now());
                 setModelLoadState('ready');
               }, 500);
               return [2 /*return*/];
@@ -2606,13 +2722,13 @@ function useLoadFocusModel(_a) {
       clearTimeout(modelLoadTimeout);
     });
     return function () {
-      log('unloading focus model');
+      log('unloading document detection model');
       cancelVideoReady();
-      closeFocusModel();
+      closeDocumentDetector();
       clearTimeout(modelLoadTimeout);
-      document.removeEventListener('idmission.preloadProgress.focus', handleDownloadProgress);
+      document.removeEventListener('idmission.preloadProgress.documentDetector', handleDownloadProgress);
     };
-  }, [modelPath, modelLoadTimeoutMs, videoRef, shouldLoadModels]);
+  }, [shouldLoadModels, modelLoadTimeoutMs, modelPath, scoreThreshold, videoRef]);
   useEffect(function handleModelError() {
     if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
   }, [modelError, onModelError]);
@@ -2622,185 +2738,41 @@ function useLoadFocusModel(_a) {
       modelLoadState: modelLoadState,
       modelDownloadProgress: modelDownloadProgress,
       modelWarmingStartedAt: modelWarmingStartedAt,
-      modelError: modelError
+      modelError: modelError,
+      setModelError: setModelError
     };
   }, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
 }
-var lastFocusPredictionAt = 0;
-var lastFocusPredictionTime = 0;
-function setLastFocusPredictionAt(time) {
-  lastFocusPredictionTime = time - lastFocusPredictionAt;
-  lastFocusPredictionAt = time;
-}
-function makeFocusModelPrediction(imageData, cropCanvas, rotateCanvas, box) {
-  var _a, _b, _c, _d, _e;
-  if (!classifier) return null;
-  var startedAt = new Date();
-  var image = cropIfNecessary(imageData, cropCanvas, rotateCanvas, box);
-  var result = classifier.classifyForVideo(image, performance.now());
-  var score = (_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.classifications) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.categories) === null || _c === void 0 ? void 0 : _c.find(function (c) {
-    return c.categoryName === 'focused';
-  })) === null || _d === void 0 ? void 0 : _d.score) !== null && _e !== void 0 ? _e : 0;
-  var predictionTime = new Date().getTime() - startedAt.getTime();
-  return {
-    score: score,
-    predictionTime: predictionTime
-  };
-}
-function cropIfNecessary(imageData, cropCanvas, rotateCanvas, box) {
-  if (!box) return imageData;
-  var cropped = cropToDetectedObjectBox(imageData, box, cropCanvas);
-  var _a = [box.width, box.height],
-    bw = _a[0],
-    bh = _a[1];
-  if (bh <= bw) return cropped;
-  var ctx = rotateCanvas.getContext('2d');
-  if (!ctx) return cropped;
-  rotateCanvas.width = bh;
-  rotateCanvas.height = bw;
-  ctx.clearRect(0, 0, rotateCanvas.width, rotateCanvas.height);
-  ctx.translate(rotateCanvas.width / 2, rotateCanvas.height / 2);
-  ctx.rotate(1.5708); // 90 deg in radians
-  ctx.drawImage(cropped, -bw / 2, -bh / 2);
-  return rotateCanvas;
-}
-
-var defaultSelfieCaptureModelLoadTimeoutMs = 45000;
-var detector$1 = null;
-var detectorSettings$1 = null;
-function loadFaceDetector() {
-  return __awaiter(this, arguments, void 0, function (modelAssetPath) {
-    var _a, _b;
-    if (modelAssetPath === void 0) {
-      modelAssetPath = defaultFaceDetectorModelPath;
-    }
-    return __generator(this, function (_c) {
-      switch (_c.label) {
-        case 0:
-          if (detector$1 && (detectorSettings$1 === null || detectorSettings$1 === void 0 ? void 0 : detectorSettings$1.modelAssetPath) === modelAssetPath) return [2 /*return*/, detector$1];
-          closeFaceDetector();
-          return [4 /*yield*/, preloadFaceDetectorDependencies()];
-        case 1:
-          _c.sent();
-          if (modelCapabilities.delegate === 'NONE') {
-            throw new Error('No available delegate for face detector.');
-          }
-          _b = (_a = FaceDetector).createFromOptions;
-          return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
-        case 2:
-          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
-            // canvas: document.createElement('canvas'),
-            baseOptions: {
-              modelAssetPath: modelAssetPath,
-              delegate: modelCapabilities.delegate
-            },
-            runningMode: 'VIDEO'
-          }])];
-        case 3:
-          detector$1 = _c.sent();
-          detectorSettings$1 = {
-            modelAssetPath: modelAssetPath
-          };
-          return [2 /*return*/, detector$1];
+function makeDocumentDetectorPrediction(frame) {
+  return __awaiter(this, void 0, void 0, function () {
+    var startedAt, prediction, time, frameWidth, frameHeight;
+    return __generator(this, function (_a) {
+      if (!detector$1) return [2 /*return*/, null];
+      startedAt = performance.now();
+      // Detectors can throw errors, for example when using custom URLs that
+      // contain a model that doesn't provide the expected output.
+      try {
+        prediction = detector$1.detectForVideo(frame, performance.now());
+        time = performance.now() - startedAt;
+        frameWidth = frame.width;
+        frameHeight = frame.height;
+        return [2 /*return*/, _assign(_assign({}, prediction), {
+          time: time,
+          frameWidth: frameWidth,
+          frameHeight: frameHeight
+        })];
+      } catch (e) {
+        error('caught object detection error', e);
       }
+      return [2 /*return*/, null];
     });
   });
 }
-function closeFaceDetector() {
-  detector$1 === null || detector$1 === void 0 ? void 0 : detector$1.close();
-  detector$1 = null;
-  detectorSettings$1 = null;
-}
-function useLoadFaceDetector(_a) {
-  var onModelError = _a.onModelError,
-    _b = _a.modelLoadTimeoutMs,
-    modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b,
-    videoRef = _a.videoRef;
-  var _c = useState('not-started'),
-    modelLoadState = _c[0],
-    setModelLoadState = _c[1];
-  var _d = useState(0),
-    modelDownloadProgress = _d[0],
-    setModelDownloadProgress = _d[1];
-  var _e = useState(null),
-    modelWarmingStartedAt = _e[0],
-    setModelWarmingStartedAt = _e[1];
-  var _f = useState(null),
-    modelError = _f[0],
-    setModelError = _f[1];
-  useEffect(function loadModel() {
-    var _this = this;
-    setModelLoadState('downloading');
-    setModelWarmingStartedAt(null);
-    var modelLoadTimeout = setTimeout(function () {
-      setModelError(new Error('Model loading time limit exceeded.'));
-    }, modelLoadTimeoutMs);
-    function handleDownloadProgress(event) {
-      setModelDownloadProgress(progressToPercentage(event.detail));
-    }
-    document.addEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
-    var cancelVideoReady = function cancelVideoReady() {};
-    loadFaceDetector().then(function (model) {
-      return __awaiter(_this, void 0, void 0, function () {
-        var _a, videoReady, cancel, cancelled;
-        return __generator(this, function (_b) {
-          switch (_b.label) {
-            case 0:
-              setModelDownloadProgress(100);
-              clearTimeout(modelLoadTimeout);
-              setModelLoadState('warming');
-              setModelWarmingStartedAt(new Date().getTime());
-              return [4 /*yield*/, testFaceDetectionAgainstKnownImage(model)];
-            case 1:
-              _b.sent();
-              _a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
-              cancelled = false;
-              cancelVideoReady = function cancelVideoReady() {
-                cancelled = true;
-                cancel();
-              };
-              return [4 /*yield*/, videoReady];
-            case 2:
-              _b.sent();
-              if (cancelled) return [2 /*return*/];
-              model.detectForVideo(videoRef.current, performance.now());
-              setModelLoadState('ready');
-              return [2 /*return*/];
-          }
-        });
-      });
-    })["catch"](function (e) {
-      setModelError(e);
-      setModelLoadState('error');
-    })["finally"](function () {
-      clearTimeout(modelLoadTimeout);
-    });
-    return function () {
-      log('unloading face detection model');
-      cancelVideoReady();
-      closeFaceDetector();
-      clearTimeout(modelLoadTimeout);
-      document.removeEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
-    };
-  }, [modelLoadTimeoutMs, videoRef]);
-  useEffect(function handleModelError() {
-    if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
-  }, [modelError, onModelError]);
-  return useMemo(function () {
-    return {
-      ready: modelLoadState === 'ready',
-      modelLoadState: modelLoadState,
-      modelDownloadProgress: modelDownloadProgress,
-      modelWarmingStartedAt: modelWarmingStartedAt,
-      modelError: modelError
-    };
-  }, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
-}
-var lastFaceDetectionAt = 0;
-var lastFaceDetectionTime = 0;
-function setLastFaceDetectionAt(time) {
-  lastFaceDetectionTime = time - lastFaceDetectionAt;
-  lastFaceDetectionAt = time;
+var lastDetectionAt = 0;
+var lastDetectionTime = 0;
+function setLastDetectionAt(time) {
+  lastDetectionTime = time - lastDetectionAt;
+  lastDetectionAt = time;
 }
 var framesNeededSamples$1 = [];
 function trackFramesNeeded$1(value, bufferLength) {
@@ -2810,970 +2782,375 @@ function trackFramesNeeded$1(value, bufferLength) {
   framesNeededSamples$1.unshift(value);
   if (framesNeededSamples$1.length > bufferLength) framesNeededSamples$1.length = bufferLength;
 }
-var lastNFaces = [];
-var lastNFacePairs = [];
-var lastNNoses = [];
-var lastNNosePairs = [];
-function trackFace(face, framesNeeded, frameWidth, frameHeight) {
+var lastNBoxes = [];
+var lastNPairs = [];
+function trackBox(box, framesNeeded) {
   if (framesNeeded === void 0) {
     framesNeeded = 12;
   }
-  var nose = face.keypoints[2];
-  if (!nose) return;
-  lastNFaces.unshift(face);
-  lastNNoses.unshift(nose);
-  if (lastNFaces.length > framesNeeded) lastNFaces.length = framesNeeded;
-  if (lastNNoses.length > framesNeeded) lastNNoses.length = framesNeeded;
-  if (lastNFaces.length > 1) {
-    var lastFace = lastNFaces[1];
-    var iou = calculateIoU(face.box, lastFace.box);
-    lastNFacePairs.unshift({
-      a: face,
-      b: lastFace,
+  lastNBoxes.unshift(box);
+  if (lastNBoxes.length > framesNeeded) lastNBoxes.length = framesNeeded;
+  if (lastNBoxes.length > 1) {
+    var lastBox = lastNBoxes[1];
+    var iou = calculateIoU(box, lastBox);
+    lastNPairs.unshift({
+      a: box,
+      b: lastBox,
       iou: iou
     });
-    if (lastNFacePairs.length > framesNeeded - 1) lastNFacePairs.length = framesNeeded - 1;
+    if (lastNPairs.length > framesNeeded - 1) lastNPairs.length = framesNeeded - 1;
   }
-  if (lastNNoses.length > 1) {
-    var lastNose = lastNNoses[1];
-    var noseDistance = Math.sqrt(Math.pow((nose.x - lastNose.x) / frameWidth, 2) + Math.pow((nose.y - lastNose.y) / frameHeight, 2));
-    lastNNosePairs.unshift({
-      a: nose,
-      b: lastNose,
-      distance: noseDistance
+}
+var defaultDocumentDetectionBoundaries = {
+  top: 20,
+  bottom: 20,
+  left: 20,
+  right: 20
+};
+function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+  if (boundaries === void 0) {
+    boundaries = defaultDocumentDetectionBoundaries;
+  }
+  var detections = prediction.detections,
+    frameWidth = prediction.frameWidth,
+    frameHeight = prediction.frameHeight,
+    time = prediction.time;
+  var boundaryTop = (_a = boundaries.top) !== null && _a !== void 0 ? _a : 20;
+  var boundaryLeft = (_b = boundaries.left) !== null && _b !== void 0 ? _b : 20;
+  var boundaryRight = (_c = boundaries.right) !== null && _c !== void 0 ? _c : 20;
+  var boundaryBottom = (_d = boundaries.bottom) !== null && _d !== void 0 ? _d : 20;
+  var frameWidth80Pct = frameWidth * 0.8;
+  var detectedObjects = applyNonMaxSuppression(detections.flatMap(function (d) {
+    return d.categories.map(function (category) {
+      return {
+        label: category === null || category === void 0 ? void 0 : category.categoryName,
+        score: category === null || category === void 0 ? void 0 : category.score,
+        box: convertBoundingBox(d.boundingBox)
+      };
+    });
+  }), function (obj) {
+    var _a = obj.box,
+      xMin = _a.xMin,
+      yMin = _a.yMin,
+      width = _a.width,
+      height = _a.height;
+    return yMin > boundaryTop &&
+    // Is it valid top edge of ID detected?
+    yMin + height + boundaryBottom < frameHeight && (
+    // Is it valid bottom edge less than max video height
+    xMin > boundaryLeft || xMin + width > frameWidth80Pct) &&
+    // If either the left side visible or if not, right edge of ID should be more than 80% of width.
+    xMin + width + boundaryRight < frameWidth // Valid right edge if it's less than video width.
+    ;
+  });
+  var allZero = detections.length > 0 && !detections.some(function (_a) {
+    var boundingBox = _a.boundingBox;
+    return Object.values(boundingBox !== null && boundingBox !== void 0 ? boundingBox : {}).some(function (n) {
+      return n > 0;
+    });
+  });
+  var bestIdCardFront = detectedObjects.find(function (obj) {
+    return obj.label === 'Document';
+  });
+  var bestIdCardBack = detectedObjects.find(function (obj) {
+    return obj.label === 'Document back';
+  });
+  var bestPassportPage = detectedObjects.find(function (obj) {
+    return obj.label === 'Passport page';
+  });
+  var bestSinglePage = detectedObjects.find(function (obj) {
+    return obj.label === 'Single page';
+  });
+  var idCardFrontDetectionScore = (_e = bestIdCardFront === null || bestIdCardFront === void 0 ? void 0 : bestIdCardFront.score) !== null && _e !== void 0 ? _e : 0;
+  var idCardBackDetectionScore = (_f = bestIdCardBack === null || bestIdCardBack === void 0 ? void 0 : bestIdCardBack.score) !== null && _f !== void 0 ? _f : 0;
+  var passportDetectionScore = (_g = bestPassportPage === null || bestPassportPage === void 0 ? void 0 : bestPassportPage.score) !== null && _g !== void 0 ? _g : 0;
+  var singlePageDetectionScore = (_h = bestSinglePage === null || bestSinglePage === void 0 ? void 0 : bestSinglePage.score) !== null && _h !== void 0 ? _h : 0;
+  var idCardFrontDetectionThresholdMet = idCardFrontDetectionScore >= ((_j = thresholds.idCardFront) !== null && _j !== void 0 ? _j : 0);
+  var idCardBackDetectionThresholdMet = idCardBackDetectionScore >= ((_k = thresholds.idCardBack) !== null && _k !== void 0 ? _k : 0);
+  var passportDetectionThresholdMet = passportDetectionScore >= ((_l = thresholds.passport) !== null && _l !== void 0 ? _l : 0);
+  var singlePageDetectionThresholdMet = singlePageDetectionScore >= ((_m = thresholds.singlePage) !== null && _m !== void 0 ? _m : 0);
+  var bestDocument = singlePageDetectionThresholdMet ? bestSinglePage : passportDetectionThresholdMet ? bestPassportPage : idCardBackDetectionThresholdMet ? bestIdCardBack : bestIdCardFront;
+  var detectionThreshold = singlePageDetectionThresholdMet ? thresholds.singlePage : passportDetectionThresholdMet ? thresholds.passport : idCardBackDetectionThresholdMet ? thresholds.idCardBack : thresholds.idCardFront;
+  var detectionScore = (_o = bestDocument === null || bestDocument === void 0 ? void 0 : bestDocument.score) !== null && _o !== void 0 ? _o : 0;
+  var detectionThresholdMet = detectionScore >= (detectionThreshold !== null && detectionThreshold !== void 0 ? detectionThreshold : 0);
+  var detectedDocumentType = 'none';
+  if (singlePageDetectionThresholdMet) {
+    detectedDocumentType = 'singlePage';
+  } else if (passportDetectionThresholdMet) {
+    detectedDocumentType = 'passport';
+  } else if (idCardBackDetectionThresholdMet) {
+    detectedDocumentType = 'idCardBack';
+  } else if (detectionThresholdMet) {
+    detectedDocumentType = 'idCardFront';
+  }
+  var documentInBounds = !!bestDocument;
+  if (lastDetectionTime > 0) {
+    trackFramesNeeded$1(1000 / lastDetectionTime);
+  }
+  var documentIsStable = false;
+  var documentTooClose = false;
+  if (bestDocument) {
+    var _q = [bestDocument.box.width / frameWidth, bestDocument.box.height / frameHeight],
+      docWidth = _q[0],
+      docHeight = _q[1];
+    documentTooClose = docWidth > 0.85 || docHeight > 0.85;
+    if (detectionThresholdMet && documentInBounds && !documentTooClose) {
+      var thresholdSet = (_p = thresholds.stability) !== null && _p !== void 0 ? _p : defaultDocumentDetectionThresholds.stability;
+      var threshold_1 = thresholdSet[detectedDocumentType];
+      var framesNeeded = Math.ceil(average(framesNeededSamples$1));
+      trackBox(bestDocument.box, framesNeeded);
+      documentIsStable = lastNBoxes.length >= framesNeeded && !lastNPairs.some(function (pair) {
+        return pair.iou < threshold_1;
+      });
+    }
+  }
+  var bestPDF417;
+  if (detectedObjects.length > 0) {
+    bestPDF417 = detectedObjects.find(function (obj) {
+      return obj.label === 'PDF417';
     });
-    if (lastNNosePairs.length > framesNeeded - 1) lastNNosePairs.length = framesNeeded - 1;
   }
+  return {
+    prediction: prediction,
+    detectedObjects: detectedObjects,
+    detectionScore: detectionScore,
+    detectionTime: time,
+    detectionThresholdMet: detectionThresholdMet,
+    detectedDocumentType: detectedDocumentType,
+    idCardFrontDetectionScore: idCardFrontDetectionScore,
+    idCardFrontDetectionThresholdMet: idCardFrontDetectionThresholdMet,
+    idCardBackDetectionScore: idCardBackDetectionScore,
+    idCardBackDetectionThresholdMet: idCardBackDetectionThresholdMet,
+    passportDetectionScore: passportDetectionScore,
+    passportDetectionThresholdMet: passportDetectionThresholdMet,
+    singlePageDetectionScore: singlePageDetectionScore,
+    singlePageDetectionThresholdMet: singlePageDetectionThresholdMet,
+    bestDocument: bestDocument,
+    bestPDF417: bestPDF417,
+    documentInBounds: documentInBounds,
+    documentTooClose: documentTooClose,
+    documentIsStable: documentIsStable,
+    frameWidth: frameWidth,
+    frameHeight: frameHeight,
+    allZero: allZero
+  };
 }
-function makeFaceDetectorPrediction(imageData) {
-  if (!detector$1) return null;
-  var prediction = detector$1.detectForVideo(imageData, performance.now());
-  var faces = prediction.detections.map(function (d) {
-    return {
-      box: convertBoundingBox(d.boundingBox),
-      keypoints: d.keypoints.map(function (k) {
-        var _a;
-        return _assign(_assign({}, k), {
-          x: k.x * imageData.width,
-          y: k.y * imageData.height,
-          name: (_a = k.label) !== null && _a !== void 0 ? _a : ''
-        });
-      })
-    };
+function applyNonMaxSuppression(detectedObjects, isGoodBox) {
+  var maxes = {};
+  detectedObjects.forEach(function (obj, i) {
+    if (obj) {
+      if (!maxes[obj.label]) maxes[obj.label] = [0, -1];
+      if (obj.score > maxes[obj.label][0] && (isGoodBox === null || isGoodBox === void 0 ? void 0 : isGoodBox(obj))) maxes[obj.label] = [obj.score, i];
+    }
   });
-  return _assign(_assign({}, prediction), {
-    faces: faces
+  return Object.keys(maxes).map(function (label) {
+    return detectedObjects[maxes[label][1]];
+  }).filter(function (obj) {
+    return !!obj;
   });
 }
-function processFaceDetectorPrediction(_a) {
-  var faces = _a.faces,
-    videoWidth = _a.videoWidth,
-    videoHeight = _a.videoHeight,
-    _b = _a.requireVerticalFaceCentering,
-    requireVerticalFaceCentering = _b === void 0 ? true : _b,
-    _c = _a.stabilityThreshold,
-    stabilityThreshold = _c === void 0 ? 0.7 : _c,
-    _d = _a.noseDistanceThreshold,
-    noseDistanceThreshold = _d === void 0 ? 0.025 : _d,
-    _e = _a.xBoundary,
-    xBoundary = _e === void 0 ? 0.01 : _e,
-    // this represents the edge that the sides of the face box should not cross -- 1% of video width
-    _f = _a.yBoundary,
-    // this represents the edge that the sides of the face box should not cross -- 1% of video width
-    yBoundary = _f === void 0 ? 0.01 : _f,
-    // this represents the edge that the top or bottom of the face box should not cross -- 1% of video height
-    _g = _a.xCentroidBoundary,
-    // this represents the edge that the top or bottom of the face box should not cross -- 1% of video height
-    xCentroidBoundary = _g === void 0 ? 0.125 : _g,
-    // this represents the edge that the centroid of the face should not cross -- 12.5% of video width
-    _h = _a.yCentroidBoundary,
-    // this represents the edge that the centroid of the face should not cross -- 12.5% of video width
-    yCentroidBoundary = _h === void 0 ? 0.125 : _h,
-    // this represents the edge that the centroid of the face should not cross -- 12.5% of video height
-    _j = _a.foreheadRatio,
-    // this represents the edge that the centroid of the face should not cross -- 12.5% of video height
-    foreheadRatio = _j === void 0 ? 0.275 : _j,
-    // we found that the bounding box ends at the brow and misses the forehead. this ratio represents how much we should extend the box to include the forehead.
-    _k = _a.noseTrackingThreshold,
-    // we found that the bounding box ends at the brow and misses the forehead. this ratio represents how much we should extend the box to include the forehead.
-    noseTrackingThreshold = _k === void 0 ? 0.2 : _k,
-    // this represents the maximum distance that the nose can be from the center of the face box -- 20% of the face box width or height
-    minCaptureBrightnessThreshold = _a.minCaptureBrightnessThreshold,
-    minCaptureRangeThreshold = _a.minCaptureRangeThreshold,
-    minCaptureVarianceThreshold = _a.minCaptureVarianceThreshold,
-    brightness = _a.brightness,
-    range = _a.range,
-    variance = _a.variance;
-  var face = faces[0];
-  var faceNotDetected = faces.length === 0;
-  var faceNotCentered = false,
-    faceLookingAway = false,
-    faceTooClose = false,
-    faceTooFar = false,
-    faceVisibilityTooLow = false;
-  var hasAnyThreshold = minCaptureBrightnessThreshold !== undefined || minCaptureRangeThreshold !== undefined || minCaptureVarianceThreshold !== undefined;
-  if (hasAnyThreshold) {
-    var tooDark = minCaptureBrightnessThreshold !== undefined && brightness !== undefined && brightness < minCaptureBrightnessThreshold;
-    var tooLowRange = minCaptureRangeThreshold !== undefined && range !== undefined && range < minCaptureRangeThreshold;
-    var tooLowVariance = minCaptureVarianceThreshold !== undefined && variance !== undefined && variance < minCaptureVarianceThreshold;
-    faceVisibilityTooLow = !!(tooDark || tooLowRange || tooLowVariance);
-  }
-  if (face && !faceVisibilityTooLow) {
-    // calculate frame centroids
-    var frameCX = videoWidth / 2;
-    var frameCY = videoHeight / 2;
-    // calculate head bounding box, with forehead extension
-    var foreheadSize = face.box.height * foreheadRatio;
-    var headXMin = face.box.xMin;
-    var headXMax = face.box.xMax;
-    var headYMin = face.box.yMin - foreheadSize;
-    var headYMax = face.box.yMax;
-    // calculate head centroids
-    var headCX = (headXMin + headXMax) / 2;
-    var headCY = (headYMin + headYMax) / 2;
-    // calculate thresholds
-    var vTX = videoWidth * xBoundary;
-    var vTY = videoHeight * yBoundary;
-    var vCTX = videoWidth * xCentroidBoundary;
-    var vCTY = videoHeight * yCentroidBoundary;
-    var faceNotCenteredHorizontally = Math.abs(frameCX - headCX) > vCTX;
-    var faceNotCenteredVertically = Math.abs(frameCY - headCY) > vCTY;
-    var faceViolatesHorizontalBoundary = headXMin < vTX || headXMax > videoWidth - vTX;
-    var faceViolatesVerticalBoundary = headYMin < vTY || headYMax > videoHeight - vTY;
-    faceNotCentered = faceViolatesHorizontalBoundary || faceViolatesVerticalBoundary || faceNotCenteredHorizontally || requireVerticalFaceCentering && faceNotCenteredVertically;
-    var isMobile = videoWidth < videoHeight;
-    var tooCloseMultiple = 1.5;
-    var tooFarMultiple = isMobile ? 6 : 7;
-    faceTooClose = face.box.width > videoWidth / tooCloseMultiple;
-    faceTooFar = face.box.width < videoWidth / tooFarMultiple;
-    var nose = face.keypoints[2];
-    var fTW = face.box.width * noseTrackingThreshold;
-    var fTH = face.box.height * noseTrackingThreshold;
-    faceLookingAway = !nose || Math.abs(headCX - nose.x) > fTW || Math.abs(headCY - nose.y) > fTH;
-  }
-  var faceInGuides = !faceNotDetected && !faceNotCentered && !faceLookingAway && !faceTooClose && !faceTooFar;
-  if (lastFaceDetectionTime > 0) {
-    trackFramesNeeded$1(500 / lastFaceDetectionTime);
-  }
-  var faceIsStable = false,
-    noseIsStable = false;
-  if (faceInGuides && !faceVisibilityTooLow) {
-    var framesNeeded = Math.max(Math.ceil(average(framesNeededSamples$1)), 5);
-    trackFace(face, framesNeeded, videoWidth, videoHeight);
-    faceIsStable = lastNFaces.length >= framesNeeded && !lastNFacePairs.some(function (pair) {
-      return pair.iou < stabilityThreshold;
-    });
-    noseIsStable = lastNNoses.length >= framesNeeded && !lastNNosePairs.some(function (pair) {
-      return pair.distance > noseDistanceThreshold;
-    });
-  }
-  var faceReady = faceInGuides && faceIsStable && noseIsStable && !faceVisibilityTooLow;
-  return {
-    face: face,
-    faceNotDetected: faceNotDetected,
-    faceNotCentered: faceNotCentered,
-    faceLookingAway: faceLookingAway,
-    faceTooClose: faceTooClose,
-    faceTooFar: faceTooFar,
-    faceReady: faceReady,
-    faceReadyAt: faceReady ? new Date() : null,
-    faceIsStable: faceIsStable,
-    noseIsStable: noseIsStable,
-    faceVisibilityTooLow: faceVisibilityTooLow
-  };
-}
-function testFaceDetectionAgainstKnownImage(detector) {
+function testDocumentDetectionAgainstKnownImage(detector) {
   return new Promise(function (resolve, reject) {
     var img = new Image();
     img.crossOrigin = 'anonymous';
     img.onload = function () {
       var prediction = detector.detectForVideo(img, performance.now());
       if (prediction.detections.length > 0) {
-        debug('face detection test result', prediction.detections);
+        debug('document detection test result', prediction.detections);
         resolve(void 0);
       } else {
-        warn('face detection test failed');
-        reject(new Error('testFaceDetectionAgainstKnownImage failed to predict'));
+        warn('document detection test failed');
+        reject(new Error('testDocumentDetectionAgainstKnownImage failed to predict'));
       }
     };
     img.onerror = function () {
-      return reject(new Error('testFaceDetectionAgainstKnownImage failed to load image'));
+      return reject(new Error('testDocumentDetectionAgainstKnownImage failed to load image'));
     };
-    img.src = "".concat(DEFAULT_CDN_URL, "/head-test.jpg");
+    img.src = "".concat(DEFAULT_CDN_URL, "/id-card-test.jpg");
   });
 }
 
-var preloadModels = function preloadModels(_a) {
-  return __awaiter(void 0, [_a], void 0, function (_b) {
-    var preloadTasks;
-    var _c = _b.documentDetectionModel,
-      documentDetectionModel = _c === void 0 ? true : _c,
-      _d = _b.focusModel,
-      focusModel = _d === void 0 ? true : _d,
-      _e = _b.faceDetectionModel,
-      faceDetectionModel = _e === void 0 ? true : _e;
-    return __generator(this, function (_f) {
-      switch (_f.label) {
-        case 0:
-          return [4 /*yield*/, probeModelCapabilities()];
-        case 1:
-          _f.sent();
-          preloadTasks = [];
-          if (documentDetectionModel) {
-            preloadTasks.push(preloadDocumentDetectorDependencies);
-          }
-          if (focusModel) {
-            preloadTasks.push(preloadFocusModelDependencies);
-          }
-          if (faceDetectionModel) {
-            preloadTasks.push(preloadFaceDetectorDependencies);
-          }
-          return [4 /*yield*/, Promise.all(preloadTasks)];
-        case 2:
-          _f.sent();
-          return [2 /*return*/];
-      }
-    });
-  });
-};
-var progressByUrl = {};
-var progressByUseCase = {
-  visionRuntime: {
-    loaded: 0,
-    total: 0
-  },
-  documentDetection: {
-    loaded: 0,
-    total: 0
-  },
-  focus: {
-    loaded: 0,
-    total: 0
-  },
-  faceDetection: {
-    loaded: 0,
-    total: 0
+function getFrameDimensions(frame) {
+  var frameWidth = frame.width,
+    frameHeight = frame.height;
+  if (frame instanceof HTMLImageElement) {
+    frameWidth = frame.naturalWidth;
+    frameHeight = frame.naturalHeight;
   }
-};
-function preloadDependency(url) {
-  return __awaiter(this, void 0, void 0, function () {
-    return __generator(this, function (_a) {
-      return [2 /*return*/, new Promise(function (resolve, reject) {
-        var req = new XMLHttpRequest();
-        req.addEventListener('progress', function (event) {
-          if (!event.lengthComputable) return;
-          progressByUrl[url] = event;
-          document.dispatchEvent(new CustomEvent('idmission.preloadProgress', {
-            detail: {
-              url: url,
-              loaded: event.loaded,
-              total: event.total
-            }
-          }));
-        });
-        req.addEventListener('loadend', function () {
-          resolve(req.readyState === 4 && req.status === 200);
-        });
-        req.addEventListener('error', reject);
-        req.open('GET', url, true);
-        req.send();
-      })];
-    });
-  });
+  if (frame instanceof HTMLVideoElement) {
+    frameWidth = frame.videoWidth;
+    frameHeight = frame.videoHeight;
+  }
+  return [frameWidth, frameHeight];
 }
-var documentDetectorPreloading = false,
-  focusModelPreloading = false,
-  faceDetectorPreloading = false;
-function preloadDocumentDetectorDependencies() {
-  return __awaiter(this, void 0, void 0, function () {
-    function handleDownloadProgress(event) {
-      var detail = event.detail;
-      if (!dependencies.includes(detail.url)) return;
-      progressByUseCase.documentDetection = sumUpProgressForDependencies(dependencies);
-      document.dispatchEvent(new CustomEvent('idmission.preloadProgress.documentDetection', {
-        detail: progressByUseCase.documentDetection
-      }));
-    }
-    var dependencies;
-    return __generator(this, function (_a) {
-      switch (_a.label) {
-        case 0:
-          if (documentDetectorPreloading) return [2 /*return*/, new Promise(function (resolve) {
-            var i = setInterval(function () {
-              if (!documentDetectorPreloading) {
-                clearInterval(i);
-                resolve();
-              }
-            }, 100);
-          })];
-          documentDetectorPreloading = true;
-          return [4 /*yield*/, probeModelCapabilities()];
-        case 1:
-          _a.sent();
-          if (modelCapabilities.delegate === 'NONE') {
-            throw new Error('No available delegate for document detector.');
-          }
-          dependencies = [defaultDocumentDetectorModelPath];
-          document.addEventListener('idmission.preloadProgress', handleDownloadProgress);
-          _a.label = 2;
-        case 2:
-          _a.trys.push([2,, 4, 5]);
-          return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
-        case 3:
-          _a.sent();
-          return [3 /*break*/, 5];
-        case 4:
-          document.removeEventListener('idmission.preloadProgress', handleDownloadProgress);
-          documentDetectorPreloading = false;
-          return [7 /*endfinally*/];
-        case 5:
-          return [2 /*return*/];
-      }
-    });
-  });
+
+var InvisibleCanvasContainer = styled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  pointer-events: none;\n  user-select: none;\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  pointer-events: none;\n  user-select: none;\n"])));
+var InvisibleCanvas = styled.canvas(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n  display: none;\n"], ["\n  display: none;\n"])));
+function drawToCanvas(canvas, frame, width, height) {
+  if (!canvas) return;
+  var ctx = canvas.getContext('2d');
+  if (!ctx) return;
+  if (!width || !height) {
+    var _a = getFrameDimensions(frame),
+      frameWidth = _a[0],
+      frameHeight = _a[1];
+    width || (width = frameWidth);
+    height || (height = frameHeight);
+  }
+  canvas.width = width;
+  canvas.height = height;
+  ctx.drawImage(frame, 0, 0, width, height);
 }
-function preloadFocusModelDependencies() {
-  return __awaiter(this, void 0, void 0, function () {
-    function handleModelDownloadProgress(event) {
-      var detail = event.detail;
-      if (!dependencies.includes(detail.url)) return;
-      progressByUseCase.focus = sumUpProgressForDependencies(dependencies);
-      document.dispatchEvent(new CustomEvent('idmission.preloadProgress.focus', {
-        detail: progressByUseCase.focus
-      }));
-    }
-    var dependencies;
-    return __generator(this, function (_a) {
-      switch (_a.label) {
-        case 0:
-          if (focusModelPreloading) return [2 /*return*/, new Promise(function (resolve) {
-            var i = setInterval(function () {
-              if (!focusModelPreloading) {
-                clearInterval(i);
-                resolve();
-              }
-            }, 100);
-          })];
-          focusModelPreloading = true;
-          return [4 /*yield*/, probeModelCapabilities()];
-        case 1:
-          _a.sent();
-          if (modelCapabilities.delegate === 'NONE') {
-            throw new Error('No available delegate for document detector.');
+function clearCanvas(canvas) {
+  var _a;
+  (_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas === null || canvas === void 0 ? void 0 : canvas.width, canvas === null || canvas === void 0 ? void 0 : canvas.height);
+}
+var templateObject_1$M, templateObject_2$G;
+
+function useFrameLoop(fn, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  var _a = useState(false),
+    running = _a[0],
+    setRunning = _a[1];
+  var startedAtRef = useRef(null);
+  var loopId = useRef(0);
+  var frameId = useRef(0);
+  useEffect(function runFrameLoop() {
+    if (!running) return;
+    var timer;
+    var currentLoopId = loopId.current;
+    function hotLoop() {
+      return __awaiter(this, void 0, void 0, function () {
+        var start, timeRunning, took, amountToThrottle;
+        var _a, _b, _c;
+        return __generator(this, function (_d) {
+          switch (_d.label) {
+            case 0:
+              if (currentLoopId !== loopId.current) return [2 /*return*/];
+              start = new Date().getTime();
+              timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
+              return [4 /*yield*/, fn(frameId.current, timeRunning)];
+            case 1:
+              _d.sent();
+              took = new Date().getTime() - start;
+              amountToThrottle = Math.max(((_c = options.throttleMs) !== null && _c !== void 0 ? _c : 0) - took, 0);
+              timer = setTimeout(function () {
+                frameId.current = requestAnimationFrame(hotLoop);
+              }, amountToThrottle);
+              return [2 /*return*/];
           }
-          dependencies = [defaultFocusModelPath];
-          document.addEventListener('idmission.preloadProgress', handleModelDownloadProgress);
-          _a.label = 2;
-        case 2:
-          _a.trys.push([2,, 4, 5]);
-          return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
-        case 3:
-          _a.sent();
-          return [3 /*break*/, 5];
-        case 4:
-          document.removeEventListener('idmission.preloadProgress', handleModelDownloadProgress);
-          focusModelPreloading = false;
-          return [7 /*endfinally*/];
-        case 5:
-          return [2 /*return*/];
-      }
-    });
-  });
+        });
+      });
+    }
+    void hotLoop();
+    return function () {
+      loopId.current += 1;
+      if (frameId.current) cancelAnimationFrame(frameId.current);
+      if (timer) clearTimeout(timer);
+    };
+  }, [fn, running, options.throttleMs]);
+  var start = useCallback(function () {
+    startedAtRef.current = new Date();
+    setRunning(true);
+  }, []);
+  var stop = useCallback(function () {
+    loopId.current += 1; // force the loop to stop immediately.
+    setRunning(false);
+    startedAtRef.current = null;
+  }, []);
+  useEffect(function startAutomatically() {
+    if (options.autoStart) start();
+    return stop;
+  }, [options.autoStart, start, stop]);
+  return {
+    start: start,
+    stop: stop
+  };
 }
-function preloadFaceDetectorDependencies() {
-  return __awaiter(this, void 0, void 0, function () {
-    function handleModelDownloadProgress(event) {
-      var detail = event.detail;
-      if (!dependencies.includes(detail.url)) return;
-      progressByUseCase.faceDetection = sumUpProgressForDependencies(dependencies);
-      document.dispatchEvent(new CustomEvent('idmission.preloadProgress.faceDetection', {
-        detail: progressByUseCase.faceDetection
-      }));
+
+function listAvailableCameras(facingMode_1) {
+  return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
+    var cameraEnumerationStream, allDevices, allowedVideoDevices;
+    if (requestMicAccess === void 0) {
+      requestMicAccess = false;
     }
-    var dependencies;
     return __generator(this, function (_a) {
       switch (_a.label) {
         case 0:
-          if (faceDetectorPreloading) return [2 /*return*/, new Promise(function (resolve) {
-            var i = setInterval(function () {
-              if (!faceDetectorPreloading) {
-                clearInterval(i);
-                resolve();
+          return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
+            video: {
+              facingMode: {
+                exact: facingMode
               }
-            }, 100);
-          })];
-          faceDetectorPreloading = true;
-          return [4 /*yield*/, probeModelCapabilities()];
+            },
+            audio: requestMicAccess
+          })
+          // This lists all available cameras attached to the user's device.
+          ];
         case 1:
-          _a.sent();
-          if (modelCapabilities.delegate === 'NONE') {
-            throw new Error('No available delegate for document detector.');
-          }
-          dependencies = [defaultFaceDetectorModelPath];
-          document.addEventListener('idmission.preloadProgress', handleModelDownloadProgress);
-          _a.label = 2;
+          cameraEnumerationStream = _a.sent();
+          return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
         case 2:
-          _a.trys.push([2,, 4, 5]);
-          return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
-        case 3:
-          _a.sent();
-          return [3 /*break*/, 5];
-        case 4:
-          document.removeEventListener('idmission.preloadProgress', handleModelDownloadProgress);
-          faceDetectorPreloading = false;
-          return [7 /*endfinally*/];
-        case 5:
-          return [2 /*return*/];
+          allDevices = _a.sent();
+          allowedVideoDevices = allDevices.filter(function (_a) {
+            var kind = _a.kind,
+              label = _a.label;
+            return kind === 'videoinput' && !label.toLowerCase().includes('virtual');
+          });
+          // Release the access to the user's camera that we obtained for enumeration purposes.
+          cameraEnumerationStream.getVideoTracks().forEach(function (track) {
+            track.enabled = false;
+            track.stop();
+          });
+          cameraEnumerationStream = null;
+          return [2 /*return*/, allowedVideoDevices];
       }
     });
   });
 }
-function progressToPercentage(progress) {
-  return progress.total > 0 ? Math.round(100.0 * progress.loaded / progress.total) : 0;
-}
-function sumUpProgressForDependencies(dependencies) {
-  return dependencies.reduce(function (result, dependency) {
-    var dependencyProgress = progressByUrl[dependency];
-    if (!dependencyProgress) return result;
-    result.loaded += dependencyProgress.loaded;
-    result.total += dependencyProgress.total;
-    return result;
-  }, {
-    loaded: 0,
-    total: 0
+var frontCameraLabels = ['front', 'avant', 'anteriore', 'cameraaanvoorzijde', 'kamerapåframsidan', 'forsidekamera', 'kamerapåforsiden', 'aparatprzedni', 'etukamera', 'kameradepan', 'ÖnKamera', 'cameramặttrước', 'camerăfață', 'prednákamera', 'prednjakamera', 'előlapikamera', 'přednífotoaparát', 'μπροστινήκάμερα', 'переднякамера', 'передняякамера', 'преднакамера', 'алдыңғыкамера', 'מצלמה קדמית', 'الكاميرا الأمامية', 'फ़्रंटकैमरा', '前置相机', '前置鏡頭', '前面カメラ', '전면카메라', 'กล้องด้านหน้า'].map(function (s) {
+  return s.toLocaleLowerCase().split(' ').join('');
+});
+var rearCameraLabels = ['back', 'rear', 'posterior', 'trasera', 'traseira', 'arrière', 'rückkamera', 'fotocamera(posteriore)', 'cameraaanachterzijde', 'kamerapåbaksidan', 'kamerapåbaksiden', 'bagsidekamera', 'aparattylny', 'takakamera', 'arkakamera', 'kamerabelakang', 'cameramặtsau', 'camerăspate', 'stražnjakamera', 'zadnákamera', 'hátoldalikamera', 'zadnífotoaparát', 'πίσωκάμερα', 'заднякамера', 'Задняякамера', 'заднакамера', 'артқыкамера', 'מצלמה אחורית', 'الكاميرا الخلفية', 'बैककैमरा', '后置相机', '後置鏡頭', '背面カメラ', '후면카메라', 'กล้องด้านหลัง'].map(function (s) {
+  return s.toLocaleLowerCase().split(' ').join('');
+});
+var backUltraWideCameraLabels = ['backdualwidecamera', 'backultrawidecamera', 'ultraampliaposterior', 'ultra-angulartraseira', 'ultragrandeangulartraseira', 'ultragrandangle', 'ultragranangular', 'ultra-weitwinkelkamera', 'ultra-grandangolo', 'ultrabredecameraaanachterzijde', 'ultravidvinkelkamerapåbaksidan', 'ultravidvinkelkameraetpåbagsiden', 'ultravidvinkelkamerabak', 'ultragenişkameraarkayüzü', 'ultralaajakulmainentakakamera', 'tylnyaparatultraszerokokątny', 'cameracựcrộngmặtsau', 'camerăcuobiectivultra‑superangularspate', 'ultraszéleslátószögűkamera', 'kameraultralebarbelakang', 'stražnjaultraširokakamera', 'zadníultraširokoúhlýfotoaparát', 'ultraširokouhlá', 'πίσωυπερευρείακάμερα', 'заднянадширококутнакамера', 'Задняясверхширокоугольнаякамера', 'Задна свръх широкоъгълна камера', 'артқыультракеңбұрыштыкамера', 'מצלמה אולטרה רחבה אחורית', 'كاميرا خلفية عريضة جدًا', 'बैकअल्ट्रावाइडकैमरा', '后置超广角相机', '後置超廣角鏡頭相機', '背面超広角カメラ', '후면울트라와이드카메라', 'กล้องด้านหลังอัลตร้าไวด์'].map(function (s) {
+  return s.toLocaleLowerCase().split(' ').join('');
+});
+var cameraLabelMatches = function cameraLabelMatches(labelOrDevice, labelSetOrLabel) {
+  var label = labelOrDevice instanceof MediaDeviceInfo ? getDeviceLabel(labelOrDevice) : labelOrDevice;
+  var labelSet = typeof labelSetOrLabel === 'string' ? [labelSetOrLabel] : labelSetOrLabel;
+  return labelSet.some(function (l) {
+    return label.includes(l);
   });
-}
-
-var defaultDocumentDetectionScoreThreshold = 0.1;
-var defaultDocumentDetectionModelLoadTimeoutMs = 45000;
-var defaultDocumentDetectionThresholds = {
-  idCardFront: 0.6,
-  idCardBack: 0.6,
-  passport: 0.4,
-  singlePage: 0.4,
-  stability: {
-    idCardFront: 0.85,
-    idCardBack: 0.85,
-    passport: 0.5,
-    singlePage: 0.5
-  }
 };
-var documentTypeDisplayNames = {
-  idCardFront: 'ID card front',
-  idCardBack: 'ID card back',
-  passport: 'Passport',
-  singlePage: 'Single page',
-  none: 'None'
+var getDeviceLabel = function getDeviceLabel(deviceInfo) {
+  return deviceInfo.label.toLocaleLowerCase().split(' ').join('');
 };
-var detector = null;
-var detectorSettings = null;
-function loadDocumentDetector() {
-  return __awaiter(this, arguments, void 0, function (modelAssetPath, scoreThreshold) {
-    var _a, _b;
-    if (modelAssetPath === void 0) {
-      modelAssetPath = defaultDocumentDetectorModelPath;
-    }
-    if (scoreThreshold === void 0) {
-      scoreThreshold = defaultDocumentDetectionScoreThreshold;
-    }
-    return __generator(this, function (_c) {
-      switch (_c.label) {
-        case 0:
-          if (detector && (detectorSettings === null || detectorSettings === void 0 ? void 0 : detectorSettings.modelAssetPath) === modelAssetPath && (detectorSettings === null || detectorSettings === void 0 ? void 0 : detectorSettings.scoreThreshold) === scoreThreshold) return [2 /*return*/, detector];
-          closeDocumentDetector();
-          return [4 /*yield*/, preloadDocumentDetectorDependencies()];
-        case 1:
-          _c.sent();
-          if (modelCapabilities.delegate === 'NONE') {
-            throw new Error('No available delegate for document detector.');
-          }
-          _b = (_a = ObjectDetector).createFromOptions;
-          return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
-        case 2:
-          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
-            baseOptions: {
-              modelAssetPath: modelAssetPath,
-              delegate: modelCapabilities.delegate
-            },
-            // canvas: document.createElement('canvas'),
-            scoreThreshold: scoreThreshold,
-            runningMode: 'VIDEO'
-          }])];
-        case 3:
-          detector = _c.sent();
-          detectorSettings = {
-            modelAssetPath: modelAssetPath,
-            scoreThreshold: scoreThreshold
-          };
-          return [2 /*return*/, detector];
-      }
-    });
-  });
-}
-function closeDocumentDetector() {
-  detector === null || detector === void 0 ? void 0 : detector.close();
-  detector = null;
-  detectorSettings = null;
-}
-function useLoadDocumentDetector(_a) {
-  var _b = _a.shouldLoadModels,
-    shouldLoadModels = _b === void 0 ? true : _b,
-    _c = _a.modelPath,
-    modelPath = _c === void 0 ? defaultDocumentDetectorModelPath : _c,
-    _d = _a.modelLoadTimeoutMs,
-    modelLoadTimeoutMs = _d === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _d,
-    _e = _a.scoreThreshold,
-    scoreThreshold = _e === void 0 ? defaultDocumentDetectionScoreThreshold : _e,
-    onModelError = _a.onModelError,
-    videoRef = _a.videoRef;
-  var _f = useState('not-started'),
-    modelLoadState = _f[0],
-    setModelLoadState = _f[1];
-  var _g = useState(null),
-    modelWarmingStartedAt = _g[0],
-    setModelWarmingStartedAt = _g[1];
-  var _h = useState(0),
-    modelDownloadProgress = _h[0],
-    setModelDownloadProgress = _h[1];
-  var _j = useState(null),
-    modelError = _j[0],
-    setModelError = _j[1];
-  useEffect(function loadModel() {
-    var _this = this;
-    if (!shouldLoadModels) return;
-    setModelLoadState('downloading');
-    setModelWarmingStartedAt(null);
-    function handleDownloadProgress(event) {
-      setModelDownloadProgress(progressToPercentage(event.detail));
-    }
-    document.addEventListener('idmission.preloadProgress.documentDetection', handleDownloadProgress);
-    var modelLoadTimeout = setTimeout(function () {
-      setModelError(new Error('Model loading time limit exceeded.'));
-    }, modelLoadTimeoutMs);
-    var cancelVideoReady = function cancelVideoReady() {};
-    loadDocumentDetector(modelPath, scoreThreshold).then(function (model) {
-      return __awaiter(_this, void 0, void 0, function () {
-        var _a, videoReady, cancel, cancelled;
-        return __generator(this, function (_b) {
-          switch (_b.label) {
-            case 0:
-              setModelDownloadProgress(100);
-              setModelLoadState('warming');
-              setModelWarmingStartedAt(new Date().getTime());
-              clearTimeout(modelLoadTimeout);
-              return [4 /*yield*/, testDocumentDetectionAgainstKnownImage(model)];
-            case 1:
-              _b.sent();
-              _a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
-              cancelled = false;
-              cancelVideoReady = function cancelVideoReady() {
-                cancelled = true;
-                cancel();
-              };
-              return [4 /*yield*/, videoReady];
-            case 2:
-              _b.sent();
-              setTimeout(function () {
-                if (cancelled) return;
-                model.detectForVideo(videoRef.current, performance.now());
-                setModelLoadState('ready');
-              }, 500);
-              return [2 /*return*/];
-          }
-        });
-      });
-    })["catch"](function (e) {
-      setModelError(e);
-      setModelLoadState('error');
-    })["finally"](function () {
-      clearTimeout(modelLoadTimeout);
-    });
-    return function () {
-      log('unloading document detection model');
-      cancelVideoReady();
-      closeDocumentDetector();
-      clearTimeout(modelLoadTimeout);
-      document.removeEventListener('idmission.preloadProgress.documentDetection', handleDownloadProgress);
-    };
-  }, [shouldLoadModels, modelLoadTimeoutMs, modelPath, scoreThreshold, videoRef]);
-  useEffect(function handleModelError() {
-    if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
-  }, [modelError, onModelError]);
-  return useMemo(function () {
-    return {
-      ready: modelLoadState === 'ready',
-      modelLoadState: modelLoadState,
-      modelDownloadProgress: modelDownloadProgress,
-      modelWarmingStartedAt: modelWarmingStartedAt,
-      modelError: modelError,
-      setModelError: setModelError
-    };
-  }, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
-}
-function makeDocumentDetectorPrediction(frame) {
-  return __awaiter(this, void 0, void 0, function () {
-    var startedAt, prediction, time, frameWidth, frameHeight;
-    return __generator(this, function (_a) {
-      if (!detector) return [2 /*return*/, null];
-      startedAt = new Date();
-      // Detectors can throw errors, for example when using custom URLs that
-      // contain a model that doesn't provide the expected output.
-      try {
-        prediction = detector.detectForVideo(frame, performance.now());
-        time = new Date().getTime() - startedAt.getTime();
-        frameWidth = frame.width;
-        frameHeight = frame.height;
-        return [2 /*return*/, _assign(_assign({}, prediction), {
-          time: time,
-          frameWidth: frameWidth,
-          frameHeight: frameHeight
-        })];
-      } catch (e) {
-        error('caught object detection error', e);
-      }
-      return [2 /*return*/, null];
-    });
-  });
-}
-var lastDetectionAt = 0;
-var lastDetectionTime = 0;
-function setLastDetectionAt(time) {
-  lastDetectionTime = time - lastDetectionAt;
-  lastDetectionAt = time;
-}
-var framesNeededSamples = [];
-function trackFramesNeeded(value, bufferLength) {
-  if (bufferLength === void 0) {
-    bufferLength = 25;
-  }
-  framesNeededSamples.unshift(value);
-  if (framesNeededSamples.length > bufferLength) framesNeededSamples.length = bufferLength;
-}
-var lastNBoxes = [];
-var lastNPairs = [];
-function trackBox(box, framesNeeded) {
-  if (framesNeeded === void 0) {
-    framesNeeded = 12;
-  }
-  lastNBoxes.unshift(box);
-  if (lastNBoxes.length > framesNeeded) lastNBoxes.length = framesNeeded;
-  if (lastNBoxes.length > 1) {
-    var lastBox = lastNBoxes[1];
-    var iou = calculateIoU(box, lastBox);
-    lastNPairs.unshift({
-      a: box,
-      b: lastBox,
-      iou: iou
-    });
-    if (lastNPairs.length > framesNeeded - 1) lastNPairs.length = framesNeeded - 1;
-  }
-}
-var defaultDocumentDetectionBoundaries = {
-  top: 20,
-  bottom: 20,
-  left: 20,
-  right: 20
-};
-function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-  if (boundaries === void 0) {
-    boundaries = defaultDocumentDetectionBoundaries;
-  }
-  var detections = prediction.detections,
-    frameWidth = prediction.frameWidth,
-    frameHeight = prediction.frameHeight,
-    time = prediction.time;
-  var boundaryTop = (_a = boundaries.top) !== null && _a !== void 0 ? _a : 20;
-  var boundaryLeft = (_b = boundaries.left) !== null && _b !== void 0 ? _b : 20;
-  var boundaryRight = (_c = boundaries.right) !== null && _c !== void 0 ? _c : 20;
-  var boundaryBottom = (_d = boundaries.bottom) !== null && _d !== void 0 ? _d : 20;
-  var frameWidth80Pct = frameWidth * 0.8;
-  var detectedObjects = applyNonMaxSuppression(detections.flatMap(function (d) {
-    return d.categories.map(function (category) {
-      return {
-        label: category === null || category === void 0 ? void 0 : category.categoryName,
-        score: category === null || category === void 0 ? void 0 : category.score,
-        box: convertBoundingBox(d.boundingBox)
-      };
-    });
-  }), function (obj) {
-    var _a = obj.box,
-      xMin = _a.xMin,
-      yMin = _a.yMin,
-      width = _a.width,
-      height = _a.height;
-    return yMin > boundaryTop &&
-    // Is it valid top edge of ID detected?
-    yMin + height + boundaryBottom < frameHeight && (
-    // Is it valid bottom edge less than max video height
-    xMin > boundaryLeft || xMin + width > frameWidth80Pct) &&
-    // If either the left side visible or if not, right edge of ID should be more than 80% of width.
-    xMin + width + boundaryRight < frameWidth // Valid right edge if it's less than video width.
-    ;
-  });
-  var allZero = detections.length > 0 && !detections.some(function (_a) {
-    var boundingBox = _a.boundingBox;
-    return Object.values(boundingBox !== null && boundingBox !== void 0 ? boundingBox : {}).some(function (n) {
-      return n > 0;
-    });
-  });
-  var bestIdCardFront = detectedObjects.find(function (obj) {
-    return obj.label === 'Document';
-  });
-  var bestIdCardBack = detectedObjects.find(function (obj) {
-    return obj.label === 'Document back';
-  });
-  var bestPassportPage = detectedObjects.find(function (obj) {
-    return obj.label === 'Passport page';
-  });
-  var bestSinglePage = detectedObjects.find(function (obj) {
-    return obj.label === 'Single page';
-  });
-  var idCardFrontDetectionScore = (_e = bestIdCardFront === null || bestIdCardFront === void 0 ? void 0 : bestIdCardFront.score) !== null && _e !== void 0 ? _e : 0;
-  var idCardBackDetectionScore = (_f = bestIdCardBack === null || bestIdCardBack === void 0 ? void 0 : bestIdCardBack.score) !== null && _f !== void 0 ? _f : 0;
-  var passportDetectionScore = (_g = bestPassportPage === null || bestPassportPage === void 0 ? void 0 : bestPassportPage.score) !== null && _g !== void 0 ? _g : 0;
-  var singlePageDetectionScore = (_h = bestSinglePage === null || bestSinglePage === void 0 ? void 0 : bestSinglePage.score) !== null && _h !== void 0 ? _h : 0;
-  var idCardFrontDetectionThresholdMet = idCardFrontDetectionScore >= ((_j = thresholds.idCardFront) !== null && _j !== void 0 ? _j : 0);
-  var idCardBackDetectionThresholdMet = idCardBackDetectionScore >= ((_k = thresholds.idCardBack) !== null && _k !== void 0 ? _k : 0);
-  var passportDetectionThresholdMet = passportDetectionScore >= ((_l = thresholds.passport) !== null && _l !== void 0 ? _l : 0);
-  var singlePageDetectionThresholdMet = singlePageDetectionScore >= ((_m = thresholds.singlePage) !== null && _m !== void 0 ? _m : 0);
-  var bestDocument = singlePageDetectionThresholdMet ? bestSinglePage : passportDetectionThresholdMet ? bestPassportPage : idCardBackDetectionThresholdMet ? bestIdCardBack : bestIdCardFront;
-  var detectionThreshold = singlePageDetectionThresholdMet ? thresholds.singlePage : passportDetectionThresholdMet ? thresholds.passport : idCardBackDetectionThresholdMet ? thresholds.idCardBack : thresholds.idCardFront;
-  var detectionScore = (_o = bestDocument === null || bestDocument === void 0 ? void 0 : bestDocument.score) !== null && _o !== void 0 ? _o : 0;
-  var detectionThresholdMet = detectionScore >= (detectionThreshold !== null && detectionThreshold !== void 0 ? detectionThreshold : 0);
-  var detectedDocumentType = 'none';
-  if (singlePageDetectionThresholdMet) {
-    detectedDocumentType = 'singlePage';
-  } else if (passportDetectionThresholdMet) {
-    detectedDocumentType = 'passport';
-  } else if (idCardBackDetectionThresholdMet) {
-    detectedDocumentType = 'idCardBack';
-  } else if (detectionThresholdMet) {
-    detectedDocumentType = 'idCardFront';
-  }
-  var documentInBounds = !!bestDocument;
-  if (lastDetectionTime > 0) {
-    trackFramesNeeded(1000 / lastDetectionTime);
-  }
-  var documentIsStable = false;
-  var documentTooClose = false;
-  if (bestDocument) {
-    var _q = [bestDocument.box.width / frameWidth, bestDocument.box.height / frameHeight],
-      docWidth = _q[0],
-      docHeight = _q[1];
-    documentTooClose = docWidth > 0.85 || docHeight > 0.85;
-    if (detectionThresholdMet && documentInBounds && !documentTooClose) {
-      var thresholdSet = (_p = thresholds.stability) !== null && _p !== void 0 ? _p : defaultDocumentDetectionThresholds.stability;
-      var threshold_1 = thresholdSet[detectedDocumentType];
-      var framesNeeded = Math.ceil(average(framesNeededSamples));
-      trackBox(bestDocument.box, framesNeeded);
-      documentIsStable = lastNBoxes.length >= framesNeeded && !lastNPairs.some(function (pair) {
-        return pair.iou < threshold_1;
-      });
-    }
-  }
-  return {
-    prediction: prediction,
-    detectedObjects: detectedObjects,
-    detectionScore: detectionScore,
-    detectionTime: time,
-    detectionThresholdMet: detectionThresholdMet,
-    detectedDocumentType: detectedDocumentType,
-    idCardFrontDetectionScore: idCardFrontDetectionScore,
-    idCardFrontDetectionThresholdMet: idCardFrontDetectionThresholdMet,
-    idCardBackDetectionScore: idCardBackDetectionScore,
-    idCardBackDetectionThresholdMet: idCardBackDetectionThresholdMet,
-    passportDetectionScore: passportDetectionScore,
-    passportDetectionThresholdMet: passportDetectionThresholdMet,
-    singlePageDetectionScore: singlePageDetectionScore,
-    singlePageDetectionThresholdMet: singlePageDetectionThresholdMet,
-    bestDocument: bestDocument,
-    documentInBounds: documentInBounds,
-    documentTooClose: documentTooClose,
-    documentIsStable: documentIsStable,
-    frameWidth: frameWidth,
-    frameHeight: frameHeight,
-    allZero: allZero
-  };
-}
-function applyNonMaxSuppression(detectedObjects, isGoodBox) {
-  var maxes = {};
-  detectedObjects.forEach(function (obj, i) {
-    if (obj) {
-      if (!maxes[obj.label]) maxes[obj.label] = [0, -1];
-      if (obj.score > maxes[obj.label][0] && (isGoodBox === null || isGoodBox === void 0 ? void 0 : isGoodBox(obj))) maxes[obj.label] = [obj.score, i];
-    }
-  });
-  return Object.keys(maxes).map(function (label) {
-    return detectedObjects[maxes[label][1]];
-  }).filter(function (obj) {
-    return !!obj;
-  });
-}
-function testDocumentDetectionAgainstKnownImage(detector) {
-  return new Promise(function (resolve, reject) {
-    var img = new Image();
-    img.crossOrigin = 'anonymous';
-    img.onload = function () {
-      var prediction = detector.detectForVideo(img, performance.now());
-      if (prediction.detections.length > 0) {
-        debug('document detection test result', prediction.detections);
-        resolve(void 0);
-      } else {
-        warn('document detection test failed');
-        reject(new Error('testDocumentDetectionAgainstKnownImage failed to predict'));
-      }
-    };
-    img.onerror = function () {
-      return reject(new Error('testDocumentDetectionAgainstKnownImage failed to load image'));
-    };
-    img.src = "".concat(DEFAULT_CDN_URL, "/id-card-test.jpg");
-  });
-}
-
-function useFrameLoop(fn, options) {
-  if (options === void 0) {
-    options = {};
-  }
-  var _a = useState(false),
-    running = _a[0],
-    setRunning = _a[1];
-  var startedAtRef = useRef(null);
-  var loopId = useRef(0);
-  var frameId = useRef(0);
-  useEffect(function runFrameLoop() {
-    if (!running) return;
-    var timer;
-    var currentLoopId = loopId.current;
-    function hotLoop() {
-      return __awaiter(this, void 0, void 0, function () {
-        var start, timeRunning, took, amountToThrottle;
-        var _a, _b, _c;
-        return __generator(this, function (_d) {
-          switch (_d.label) {
-            case 0:
-              if (currentLoopId !== loopId.current) return [2 /*return*/];
-              start = new Date().getTime();
-              timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
-              return [4 /*yield*/, fn(frameId.current, timeRunning)];
-            case 1:
-              _d.sent();
-              took = new Date().getTime() - start;
-              amountToThrottle = Math.max(((_c = options.throttleMs) !== null && _c !== void 0 ? _c : 0) - took, 0);
-              timer = setTimeout(function () {
-                frameId.current = requestAnimationFrame(hotLoop);
-              }, amountToThrottle);
-              return [2 /*return*/];
-          }
-        });
-      });
-    }
-    void hotLoop();
-    return function () {
-      loopId.current += 1;
-      if (frameId.current) cancelAnimationFrame(frameId.current);
-      if (timer) clearTimeout(timer);
-    };
-  }, [fn, running, options.throttleMs]);
-  var start = useCallback(function () {
-    startedAtRef.current = new Date();
-    setRunning(true);
-  }, []);
-  var stop = useCallback(function () {
-    loopId.current += 1; // force the loop to stop immediately.
-    setRunning(false);
-    startedAtRef.current = null;
-  }, []);
-  useEffect(function startAutomatically() {
-    if (options.autoStart) start();
-    return stop;
-  }, [options.autoStart, start, stop]);
-  return {
-    start: start,
-    stop: stop
-  };
-}
-
-function listAvailableCameras(facingMode_1) {
-  return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
-    var cameraEnumerationStream, allDevices, allowedVideoDevices;
-    if (requestMicAccess === void 0) {
-      requestMicAccess = false;
-    }
-    return __generator(this, function (_a) {
-      switch (_a.label) {
-        case 0:
-          return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
-            video: {
-              facingMode: {
-                exact: facingMode
-              }
-            },
-            audio: requestMicAccess
-          })
-          // This lists all available cameras attached to the user's device.
-          ];
-        case 1:
-          cameraEnumerationStream = _a.sent();
-          return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
-        case 2:
-          allDevices = _a.sent();
-          allowedVideoDevices = allDevices.filter(function (_a) {
-            var kind = _a.kind,
-              label = _a.label;
-            return kind === 'videoinput' && !label.toLowerCase().includes('virtual');
-          });
-          // Release the access to the user's camera that we obtained for enumeration purposes.
-          cameraEnumerationStream.getVideoTracks().forEach(function (track) {
-            track.enabled = false;
-            track.stop();
-          });
-          cameraEnumerationStream = null;
-          return [2 /*return*/, allowedVideoDevices];
-      }
-    });
-  });
-}
-var frontCameraLabels = ['front', 'avant', 'anteriore', 'cameraaanvoorzijde', 'kamerapåframsidan', 'forsidekamera', 'kamerapåforsiden', 'aparatprzedni', 'etukamera', 'kameradepan', 'ÖnKamera', 'cameramặttrước', 'camerăfață', 'prednákamera', 'prednjakamera', 'előlapikamera', 'přednífotoaparát', 'μπροστινήκάμερα', 'переднякамера', 'передняякамера', 'преднакамера', 'алдыңғыкамера', 'מצלמה קדמית', 'الكاميرا الأمامية', 'फ़्रंटकैमरा', '前置相机', '前置鏡頭', '前面カメラ', '전면카메라', 'กล้องด้านหน้า'].map(function (s) {
-  return s.toLocaleLowerCase().split(' ').join('');
-});
-var rearCameraLabels = ['back', 'rear', 'posterior', 'trasera', 'traseira', 'arrière', 'rückkamera', 'fotocamera(posteriore)', 'cameraaanachterzijde', 'kamerapåbaksidan', 'kamerapåbaksiden', 'bagsidekamera', 'aparattylny', 'takakamera', 'arkakamera', 'kamerabelakang', 'cameramặtsau', 'camerăspate', 'stražnjakamera', 'zadnákamera', 'hátoldalikamera', 'zadnífotoaparát', 'πίσωκάμερα', 'заднякамера', 'Задняякамера', 'заднакамера', 'артқыкамера', 'מצלמה אחורית', 'الكاميرا الخلفية', 'बैककैमरा', '后置相机', '後置鏡頭', '背面カメラ', '후면카메라', 'กล้องด้านหลัง'].map(function (s) {
-  return s.toLocaleLowerCase().split(' ').join('');
-});
-var backUltraWideCameraLabels = ['backdualwidecamera', 'backultrawidecamera', 'ultraampliaposterior', 'ultra-angulartraseira', 'ultragrandeangulartraseira', 'ultragrandangle', 'ultragranangular', 'ultra-weitwinkelkamera', 'ultra-grandangolo', 'ultrabredecameraaanachterzijde', 'ultravidvinkelkamerapåbaksidan', 'ultravidvinkelkameraetpåbagsiden', 'ultravidvinkelkamerabak', 'ultragenişkameraarkayüzü', 'ultralaajakulmainentakakamera', 'tylnyaparatultraszerokokątny', 'cameracựcrộngmặtsau', 'camerăcuobiectivultra‑superangularspate', 'ultraszéleslátószögűkamera', 'kameraultralebarbelakang', 'stražnjaultraširokakamera', 'zadníultraširokoúhlýfotoaparát', 'ultraširokouhlá', 'πίσωυπερευρείακάμερα', 'заднянадширококутнакамера', 'Задняясверхширокоугольнаякамера', 'Задна свръх широкоъгълна камера', 'артқыультракеңбұрыштыкамера', 'מצלמה אולטרה רחבה אחורית', 'كاميرا خلفية عريضة جدًا', 'बैकअल्ट्रावाइडकैमरा', '后置超广角相机', '後置超廣角鏡頭相機', '背面超広角カメラ', '후면울트라와이드카메라', 'กล้องด้านหลังอัลตร้าไวด์'].map(function (s) {
-  return s.toLocaleLowerCase().split(' ').join('');
-});
-var cameraLabelMatches = function cameraLabelMatches(labelOrDevice, labelSetOrLabel) {
-  var label = labelOrDevice instanceof MediaDeviceInfo ? getDeviceLabel(labelOrDevice) : labelOrDevice;
-  var labelSet = typeof labelSetOrLabel === 'string' ? [labelSetOrLabel] : labelSetOrLabel;
-  return labelSet.some(function (l) {
-    return label.includes(l);
-  });
-};
-var getDeviceLabel = function getDeviceLabel(deviceInfo) {
-  return deviceInfo.label.toLocaleLowerCase().split(' ').join('');
-};
-var currentCamera;
-function obtainCameraAccess(stream, deviceLabel, video) {
-  releaseCameraAccess();
-  log('obtaining camera access...');
-  var _a = stream.getVideoTracks()[0].getSettings(),
-    width = _a.width,
-    height = _a.height;
-  log('camera dimensions', width, height);
-  var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
-  log('camera label', label);
-  var isRearFacing = cameraLabelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearCameraLabels, true), backUltraWideCameraLabels, true), ['iphone'], false));
-  log('is rear facing?', isRearFacing);
-  var release = function release() {
-    stream.getTracks().forEach(function (track) {
-      track.enabled = false;
-      track.stop();
-    });
-    if (video) {
-      video.pause();
-      video.srcObject = null;
-      video.src = '';
+var currentCamera;
+function obtainCameraAccess(stream, deviceLabel, video) {
+  releaseCameraAccess();
+  log('obtaining camera access...');
+  var _a = stream.getVideoTracks()[0].getSettings(),
+    width = _a.width,
+    height = _a.height;
+  log('camera dimensions', width, height);
+  var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
+  log('camera label', label);
+  var isRearFacing = cameraLabelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearCameraLabels, true), backUltraWideCameraLabels, true), ['iphone'], false));
+  log('is rear facing?', isRearFacing);
+  var release = function release() {
+    stream.getTracks().forEach(function (track) {
+      track.enabled = false;
+      track.stop();
+    });
+    if (video) {
+      video.pause();
+      video.srcObject = null;
+      video.src = '';
     }
   };
   width || (width = 0);
@@ -5578,29 +4955,294 @@ function DocumentDetectionModelProvider(_a) {
   }, []);
   var value = useMemo(function () {
     return {
-      startDocumentDetection: start,
-      stopDocumentDetection: stop,
-      loadDocumentDetectionModel: load,
-      documentDetectionModelState: modelLoadState,
-      documentDetectionModelWarmingStartedAt: modelWarmingStartedAt,
-      documentDetectionModelError: modelError,
-      documentDetectionModelDownloadProgress: modelDownloadProgress,
-      onDocumentDetected: onDocumentDetected,
-      detectionTime: lastDetectionTime,
-      documentDetectionThresholds: documentDetectionThresholds,
-      setDocumentDetectionThresholds: setDocumentDetectionThresholds,
-      documentDetectionBoundaries: documentDetectionBoundaries,
-      setDocumentDetectionBoundaries: setDocumentDetectionBoundaries,
-      documentDetectionLastPredictionCanvas: lastPredictionCanvas,
-      clearDocumentDetectionLastPredictionCanvas: clearDocumentDetectionLastPredictionCanvas
+      startDocumentDetection: start,
+      stopDocumentDetection: stop,
+      loadDocumentDetectionModel: load,
+      documentDetectionModelState: modelLoadState,
+      documentDetectionModelWarmingStartedAt: modelWarmingStartedAt,
+      documentDetectionModelError: modelError,
+      documentDetectionModelDownloadProgress: modelDownloadProgress,
+      onDocumentDetected: onDocumentDetected,
+      detectionTime: lastDetectionTime,
+      documentDetectionThresholds: documentDetectionThresholds,
+      setDocumentDetectionThresholds: setDocumentDetectionThresholds,
+      documentDetectionBoundaries: documentDetectionBoundaries,
+      setDocumentDetectionBoundaries: setDocumentDetectionBoundaries,
+      documentDetectionLastPredictionCanvas: lastPredictionCanvas,
+      clearDocumentDetectionLastPredictionCanvas: clearDocumentDetectionLastPredictionCanvas
+    };
+  }, [start, stop, load, modelLoadState, modelWarmingStartedAt, modelError, modelDownloadProgress, onDocumentDetected, documentDetectionThresholds, documentDetectionBoundaries, clearDocumentDetectionLastPredictionCanvas]);
+  return /*#__PURE__*/React.createElement(DocumentDetectionModelContext.Provider, {
+    value: value
+  }, /*#__PURE__*/React.createElement(InvisibleCanvas, {
+    key: canvasKey,
+    ref: lastPredictionCanvas
+  }), children);
+}
+
+function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
+  var _a;
+  if (quality === void 0) {
+    quality = 0.92;
+  }
+  if (!rawCanvas || !cropCanvas || !resizeCanvas) return '';
+  var rawCtx = rawCanvas.getContext('2d');
+  var cropCtx = cropCanvas.getContext('2d');
+  var resizeCtx = resizeCanvas.getContext('2d');
+  if (!rawCtx || !cropCtx || !resizeCtx) throw new Error('could not get 2d context');
+  rawCanvas.width = frame.width;
+  rawCanvas.height = frame.height;
+  rawCtx.putImageData(frame, 0, 0);
+  if (frame.height > frame.width) {
+    cropCanvas.width = frame.width;
+    cropCanvas.height = frame.height;
+    cropCtx.drawImage(rawCanvas, 0, 0, cropCanvas.width, cropCanvas.height);
+  } else {
+    var _b = (_a = face === null || face === void 0 ? void 0 : face.box) !== null && _a !== void 0 ? _a : {
+        xMin: 0,
+        width: frame.width
+      },
+      xMin = _b.xMin,
+      width = _b.width;
+    var desiredWidth = frame.height * 0.6;
+    var faceCenterX = xMin + width / 2;
+    var xPos = Math.max(0, faceCenterX - desiredWidth / 2);
+    cropCanvas.width = desiredWidth;
+    cropCanvas.height = frame.height;
+    cropCtx.drawImage(rawCanvas, xPos, 0, cropCanvas.width, cropCanvas.height, 0, 0, cropCanvas.width, cropCanvas.height);
+  }
+  resizeCanvas.height = maxHeight !== null && maxHeight !== void 0 ? maxHeight : cropCanvas.height;
+  resizeCanvas.width = cropCanvas.width * (resizeCanvas.height / cropCanvas.height);
+  resizeCtx === null || resizeCtx === void 0 ? void 0 : resizeCtx.drawImage(cropCanvas, 0, 0, resizeCanvas.width, resizeCanvas.height);
+  var dataURL = resizeCanvas.toDataURL('image/jpeg', quality);
+  log('cropToShoulders size', new TextEncoder().encode(dataURL).length);
+  clearCanvas(rawCanvas);
+  clearCanvas(cropCanvas);
+  clearCanvas(resizeCanvas);
+  return dataURL;
+}
+function cropToDetectedObjectBox(frame, box, canvas, padding) {
+  if (padding === void 0) {
+    padding = 0;
+  }
+  canvas || (canvas = document.createElement('canvas'));
+  var ctx = canvas.getContext('2d');
+  if (!ctx) throw new Error('could not get 2d context');
+  var xMin = box.xMin,
+    yMin = box.yMin,
+    width = box.width,
+    height = box.height;
+  canvas.width = width + padding * 2;
+  canvas.height = height + padding * 2;
+  ctx.drawImage(frame, xMin - padding, yMin - padding, width + padding * 2, height + padding * 2, 0, 0, canvas.width, canvas.height);
+  return canvas;
+}
+function cropAndRotateIfNecessary(imageData, cropCanvas, rotateCanvas, box, padding) {
+  if (padding === void 0) {
+    padding = 0;
+  }
+  if (!box) return imageData;
+  var cropped = cropToDetectedObjectBox(imageData, box, cropCanvas, padding);
+  var _a = [box.width, box.height],
+    bw = _a[0],
+    bh = _a[1];
+  if (bh <= bw) return cropped;
+  var ctx = rotateCanvas.getContext('2d');
+  if (!ctx) return cropped;
+  rotateCanvas.width = bh;
+  rotateCanvas.height = bw;
+  ctx.clearRect(0, 0, rotateCanvas.width, rotateCanvas.height);
+  ctx.translate(rotateCanvas.width / 2, rotateCanvas.height / 2);
+  ctx.rotate(1.5708); // 90 deg in radians
+  ctx.drawImage(cropped, -bw / 2, -bh / 2);
+  return rotateCanvas;
+}
+function resizeIfNecessary(imageData, resizeCanvas, maxWidth) {
+  var width = imageData.width,
+    height = imageData.height;
+  if (width <= maxWidth) return imageData;
+  var resizeCtx = resizeCanvas.getContext('2d');
+  if (!resizeCtx) return imageData;
+  var scale = maxWidth / width;
+  resizeCanvas.width = maxWidth;
+  resizeCanvas.height = height * scale;
+  resizeCtx.drawImage(imageData, 0, 0, resizeCanvas.width, resizeCanvas.height);
+  return resizeCanvas;
+}
+
+var defaultFocusModelLoadTimeoutMs = 45000;
+var defaultFocusThresholds = {
+  idCardFront: {
+    desktop: 0,
+    mobile: 0.3
+  },
+  idCardBack: {
+    desktop: 0,
+    mobile: 0.3
+  },
+  passport: {
+    desktop: 0,
+    mobile: 0.3
+  },
+  singlePage: {
+    desktop: 0,
+    mobile: 0.3
+  }
+};
+var classifier$1 = null;
+var classifierSettings$1 = null;
+function loadFocusModel() {
+  return __awaiter(this, arguments, void 0, function (modelAssetPath) {
+    var _a, _b;
+    if (modelAssetPath === void 0) {
+      modelAssetPath = defaultFocusModelPath;
+    }
+    return __generator(this, function (_c) {
+      switch (_c.label) {
+        case 0:
+          if (classifier$1 && (classifierSettings$1 === null || classifierSettings$1 === void 0 ? void 0 : classifierSettings$1.modelAssetPath) === modelAssetPath) return [2 /*return*/, classifier$1];
+          closeFocusModel();
+          return [4 /*yield*/, preloadFocusModelDependencies()];
+        case 1:
+          _c.sent();
+          if (modelCapabilities.delegate === 'NONE') {
+            throw new Error('No available delegate for focus detector.');
+          }
+          _b = (_a = ImageClassifier).createFromOptions;
+          return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
+        case 2:
+          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
+            baseOptions: {
+              modelAssetPath: modelAssetPath,
+              delegate: modelCapabilities.delegate
+            },
+            // canvas: document.createElement('canvas'),
+            runningMode: 'VIDEO'
+          }])];
+        case 3:
+          classifier$1 = _c.sent();
+          classifierSettings$1 = {
+            modelAssetPath: modelAssetPath
+          };
+          return [2 /*return*/, classifier$1];
+      }
+    });
+  });
+}
+function closeFocusModel() {
+  classifier$1 === null || classifier$1 === void 0 ? void 0 : classifier$1.close();
+  classifier$1 = null;
+  classifierSettings$1 = null;
+}
+function useLoadFocusModel(_a) {
+  var _b = _a.modelPath,
+    modelPath = _b === void 0 ? defaultFocusModelPath : _b,
+    _c = _a.modelLoadTimeoutMs,
+    modelLoadTimeoutMs = _c === void 0 ? defaultFocusModelLoadTimeoutMs : _c,
+    onModelError = _a.onModelError,
+    videoRef = _a.videoRef,
+    _d = _a.shouldLoadModels,
+    shouldLoadModels = _d === void 0 ? true : _d;
+  var _e = useState('not-started'),
+    modelLoadState = _e[0],
+    setModelLoadState = _e[1];
+  var _f = useState(0),
+    modelDownloadProgress = _f[0],
+    setModelDownloadProgress = _f[1];
+  var _g = useState(null),
+    modelWarmingStartedAt = _g[0],
+    setModelWarmingStartedAt = _g[1];
+  var _h = useState(null),
+    modelError = _h[0],
+    setModelError = _h[1];
+  useEffect(function loadModel() {
+    var _this = this;
+    if (!shouldLoadModels) return;
+    setModelLoadState('downloading');
+    setModelWarmingStartedAt(null);
+    function handleDownloadProgress(event) {
+      setModelDownloadProgress(progressToPercentage(event.detail));
+    }
+    document.addEventListener('idmission.preloadProgress.focus', handleDownloadProgress);
+    var modelLoadTimeout = setTimeout(function () {
+      setModelError(new Error('Model loading time limit exceeded.'));
+    }, modelLoadTimeoutMs);
+    var cancelVideoReady = function cancelVideoReady() {};
+    loadFocusModel(modelPath).then(function (loadedModel) {
+      return __awaiter(_this, void 0, void 0, function () {
+        var _a, videoReady, cancel, cancelled;
+        return __generator(this, function (_b) {
+          switch (_b.label) {
+            case 0:
+              setModelDownloadProgress(100);
+              clearTimeout(modelLoadTimeout);
+              setModelLoadState('warming');
+              setModelWarmingStartedAt(performance.now());
+              _a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
+              cancelled = false;
+              cancelVideoReady = function cancelVideoReady() {
+                cancelled = true;
+                cancel();
+              };
+              return [4 /*yield*/, videoReady];
+            case 1:
+              _b.sent();
+              setTimeout(function () {
+                if (cancelled) return;
+                loadedModel.classifyForVideo(videoRef.current, performance.now());
+                setModelLoadState('ready');
+              }, 500);
+              return [2 /*return*/];
+          }
+        });
+      });
+    })["catch"](function (e) {
+      setModelError(e);
+      setModelLoadState('error');
+    })["finally"](function () {
+      clearTimeout(modelLoadTimeout);
+    });
+    return function () {
+      log('unloading focus model');
+      cancelVideoReady();
+      closeFocusModel();
+      clearTimeout(modelLoadTimeout);
+      document.removeEventListener('idmission.preloadProgress.focus', handleDownloadProgress);
+    };
+  }, [modelPath, modelLoadTimeoutMs, videoRef, shouldLoadModels]);
+  useEffect(function handleModelError() {
+    if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
+  }, [modelError, onModelError]);
+  return useMemo(function () {
+    return {
+      ready: modelLoadState === 'ready',
+      modelLoadState: modelLoadState,
+      modelDownloadProgress: modelDownloadProgress,
+      modelWarmingStartedAt: modelWarmingStartedAt,
+      modelError: modelError
     };
-  }, [start, stop, load, modelLoadState, modelWarmingStartedAt, modelError, modelDownloadProgress, onDocumentDetected, documentDetectionThresholds, documentDetectionBoundaries, clearDocumentDetectionLastPredictionCanvas]);
-  return /*#__PURE__*/React.createElement(DocumentDetectionModelContext.Provider, {
-    value: value
-  }, /*#__PURE__*/React.createElement(InvisibleCanvas, {
-    key: canvasKey,
-    ref: lastPredictionCanvas
-  }), children);
+  }, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
+}
+var lastFocusPredictionAt = 0;
+var lastFocusPredictionTime = 0;
+function setLastFocusPredictionAt(time) {
+  lastFocusPredictionTime = time - lastFocusPredictionAt;
+  lastFocusPredictionAt = time;
+}
+function makeFocusModelPrediction(imageData, cropCanvas, rotateCanvas, box) {
+  var _a, _b, _c, _d, _e;
+  if (!classifier$1) return null;
+  var startedAt = performance.now();
+  var image = cropAndRotateIfNecessary(imageData, cropCanvas, rotateCanvas, box);
+  var result = classifier$1.classifyForVideo(image, performance.now());
+  var score = (_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.classifications) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.categories) === null || _c === void 0 ? void 0 : _c.find(function (c) {
+    return c.categoryName === 'focused';
+  })) === null || _d === void 0 ? void 0 : _d.score) !== null && _e !== void 0 ? _e : 0;
+  var predictionTime = performance.now() - startedAt;
+  return {
+    score: score,
+    predictionTime: predictionTime
+  };
 }
 
 var FocusModelContext = /*#__PURE__*/createContext({
@@ -5677,52 +5319,424 @@ function FocusModelProvider(_a) {
   }, [focusThresholds, load, makeFocusPrediction, modelDownloadProgress, modelError, modelLoadState, modelWarmingStartedAt]);
   return /*#__PURE__*/React__default.createElement(FocusModelContext.Provider, {
     value: value
-  }, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+  }, /*#__PURE__*/React__default.createElement(InvisibleCanvasContainer, null, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
     ref: rotateCanvas,
     style: showCanvases ? {
       display: 'block'
     } : undefined
   }), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
-    ref: cropCanvas,
+    ref: cropCanvas,
+    style: showCanvases ? {
+      display: 'block'
+    } : undefined
+  })), children);
+}
+
+function _isNavigatorDefined() {
+  return typeof navigator !== 'undefined' && navigator != null;
+}
+var isMobileCache;
+function isMobile() {
+  if (isMobileCache !== undefined) return isMobileCache;
+  isMobileCache = evaluateIsMobile();
+  return isMobileCache;
+}
+function evaluateIsMobile(nav) {
+  if (nav || _isNavigatorDefined()) {
+    if (!nav) {
+      nav = navigator;
+    }
+    if (nav.product === 'ReactNative') {
+      return true;
+    }
+    var a = nav.userAgent || nav.vendor || (
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    typeof window !== 'undefined' ? window.opera : '');
+    if (!a) {
+      var navAny = nav;
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      return navAny.userAgentData && navAny.userAgentData.mobile;
+    }
+    return /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4));
+  }
+  return false;
+}
+
+var defaultBarcodeReadabilityModelLoadTimeoutMs = 45000;
+var classifier = null;
+var classifierSettings = null;
+function loadBarcodeReadabilityModel() {
+  return __awaiter(this, arguments, void 0, function (modelAssetPath) {
+    var _a, _b;
+    if (modelAssetPath === void 0) {
+      modelAssetPath = defaultBarcodeReadabilityModelPath;
+    }
+    return __generator(this, function (_c) {
+      switch (_c.label) {
+        case 0:
+          if (classifier && (classifierSettings === null || classifierSettings === void 0 ? void 0 : classifierSettings.modelAssetPath) === modelAssetPath) return [2 /*return*/, classifier];
+          closeBarcodeReadabilityModel();
+          return [4 /*yield*/, preloadBarcodeReadabilityModelDependencies()];
+        case 1:
+          _c.sent();
+          if (modelCapabilities.delegate === 'NONE') {
+            throw new Error('No available delegate for barcode readability model.');
+          }
+          _b = (_a = ImageClassifier).createFromOptions;
+          return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
+        case 2:
+          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
+            baseOptions: {
+              modelAssetPath: modelAssetPath,
+              delegate: 'CPU'
+            },
+            runningMode: 'VIDEO',
+            maxResults: 1
+          }])];
+        case 3:
+          classifier = _c.sent();
+          classifierSettings = {
+            modelAssetPath: modelAssetPath
+          };
+          return [2 /*return*/, classifier];
+      }
+    });
+  });
+}
+function closeBarcodeReadabilityModel() {
+  classifier === null || classifier === void 0 ? void 0 : classifier.close();
+  classifier = null;
+  classifierSettings = null;
+}
+function useLoadBarcodeReadabilityModel(_a) {
+  var _b = _a.modelPath,
+    modelPath = _b === void 0 ? defaultBarcodeReadabilityModelPath : _b,
+    _c = _a.modelLoadTimeoutMs,
+    modelLoadTimeoutMs = _c === void 0 ? defaultBarcodeReadabilityModelLoadTimeoutMs : _c,
+    onModelError = _a.onModelError,
+    videoRef = _a.videoRef,
+    _d = _a.shouldLoadModels,
+    shouldLoadModels = _d === void 0 ? true : _d;
+  var _e = useState('not-started'),
+    modelLoadState = _e[0],
+    setModelLoadState = _e[1];
+  var _f = useState(0),
+    modelDownloadProgress = _f[0],
+    setModelDownloadProgress = _f[1];
+  var _g = useState(null),
+    modelWarmingStartedAt = _g[0],
+    setModelWarmingStartedAt = _g[1];
+  var _h = useState(null),
+    modelError = _h[0],
+    setModelError = _h[1];
+  useEffect(function loadModel() {
+    var _this = this;
+    if (!shouldLoadModels) return;
+    setModelLoadState('downloading');
+    setModelWarmingStartedAt(null);
+    function handleDownloadProgress(event) {
+      setModelDownloadProgress(progressToPercentage(event.detail));
+    }
+    document.addEventListener('idmission.preloadProgress.barcodeReadability', handleDownloadProgress);
+    var modelLoadTimeout = setTimeout(function () {
+      setModelError(new Error('Model loading time limit exceeded.'));
+    }, modelLoadTimeoutMs);
+    var cancelVideoReady = function cancelVideoReady() {};
+    loadBarcodeReadabilityModel(modelPath).then(function (loadedModel) {
+      return __awaiter(_this, void 0, void 0, function () {
+        var _a, videoReady, cancel, cancelled;
+        return __generator(this, function (_b) {
+          switch (_b.label) {
+            case 0:
+              setModelDownloadProgress(100);
+              clearTimeout(modelLoadTimeout);
+              setModelLoadState('warming');
+              setModelWarmingStartedAt(new Date().getTime());
+              _a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
+              cancelled = false;
+              cancelVideoReady = function cancelVideoReady() {
+                cancelled = true;
+                cancel();
+              };
+              return [4 /*yield*/, videoReady];
+            case 1:
+              _b.sent();
+              setTimeout(function () {
+                if (cancelled) return;
+                loadedModel.classifyForVideo(videoRef.current, performance.now());
+                setModelLoadState('ready');
+              }, 500);
+              return [2 /*return*/];
+          }
+        });
+      });
+    })["catch"](function (e) {
+      setModelError(e);
+      setModelLoadState('error');
+    })["finally"](function () {
+      clearTimeout(modelLoadTimeout);
+    });
+    return function () {
+      log('unloading barcode readability model');
+      cancelVideoReady();
+      closeBarcodeReadabilityModel();
+      clearTimeout(modelLoadTimeout);
+      document.removeEventListener('idmission.preloadProgress.barcodeReadability', handleDownloadProgress);
+    };
+  }, [modelPath, modelLoadTimeoutMs, videoRef, shouldLoadModels]);
+  useEffect(function handleModelError() {
+    if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
+  }, [modelError, onModelError]);
+  return useMemo(function () {
+    return {
+      ready: modelLoadState === 'ready',
+      modelLoadState: modelLoadState,
+      modelDownloadProgress: modelDownloadProgress,
+      modelWarmingStartedAt: modelWarmingStartedAt,
+      modelError: modelError
+    };
+  }, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
+}
+var lastBarcodeReadabilityPredictionAt = 0;
+var lastBarcodeReadabilityPredictionTime = 0;
+function setLastBarcodeReadabilityPredictionAt(time) {
+  lastBarcodeReadabilityPredictionTime = time - lastBarcodeReadabilityPredictionAt;
+  lastBarcodeReadabilityPredictionAt = time;
+}
+function makeBarcodeReadabilityModelPrediction(imageData, cropCanvas, rotateCanvas, resizeCanvas, box) {
+  var _a, _b, _c, _d, _e;
+  if (!classifier) return null;
+  var startedAt = performance.now();
+  var image = cropAndRotateIfNecessary(imageData, cropCanvas, rotateCanvas, box);
+  var resized = resizeIfNecessary(image, resizeCanvas, 500);
+  var result = classifier.classifyForVideo(resized, performance.now());
+  var score = (_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.classifications) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.categories) === null || _c === void 0 ? void 0 : _c.find(function (c) {
+    return c.categoryName === 'blurry';
+  })) === null || _d === void 0 ? void 0 : _d.score) !== null && _e !== void 0 ? _e : 0;
+  debug('barcode prediction', "".concat(performance.now() - startedAt, "ms"), score);
+  var predictionTime = performance.now() - startedAt;
+  return {
+    score: score,
+    predictionTime: predictionTime
+  };
+}
+
+var BarcodeReadabilityModelContext = /*#__PURE__*/createContext({
+  loadBarcodeReadabilityModel: function loadBarcodeReadabilityModel() {
+    return null;
+  },
+  barcodeReadabilityModelState: 'not-started',
+  barcodeReadabilityModelDownloadProgress: 0,
+  barcodeReadabilityModelWarmingStartedAt: null,
+  barcodeReadabilityModelError: null,
+  barcodeReadabilityThresholds: {},
+  setBarcodeReadabilityThresholds: function setBarcodeReadabilityThresholds() {
+    return null;
+  },
+  makeBarcodeReadabilityPrediction: function makeBarcodeReadabilityPrediction() {
+    return null;
+  },
+  barcodeReadabilityPredictionTime: 0
+});
+function BarcodeReadabilityModelProvider(_a) {
+  var children = _a.children,
+    _b = _a.barcodeReadabilityModelPath,
+    barcodeReadabilityModelPath = _b === void 0 ? defaultBarcodeReadabilityModelPath : _b,
+    _c = _a.barcodeReadabilityModelLoadTimeoutMs,
+    barcodeReadabilityModelLoadTimeoutMs = _c === void 0 ? defaultBarcodeReadabilityModelLoadTimeoutMs : _c,
+    onBarcodeReadabilityModelError = _a.onBarcodeReadabilityModelError,
+    _d = _a.showCanvases,
+    showCanvases = _d === void 0 ? false : _d,
+    _e = _a.shouldLoadModels,
+    shouldLoadModelsProp = _e === void 0 ? true : _e;
+  var cropCanvas = useRef(null);
+  var rotateCanvas = useRef(null);
+  var resizeCanvas = useRef(null);
+  var _f = useState({}),
+    barcodeReadabilityThresholds = _f[0],
+    setBarcodeReadabilityThresholds = _f[1];
+  var videoRef = useCameraStore().videoRef;
+  var _g = useState(shouldLoadModelsProp),
+    shouldLoadModels = _g[0],
+    setShouldLoadModels = _g[1];
+  var load = useCallback(function () {
+    return setShouldLoadModels(true);
+  }, []);
+  var _h = useLoadBarcodeReadabilityModel({
+      modelPath: barcodeReadabilityModelPath,
+      modelLoadTimeoutMs: barcodeReadabilityModelLoadTimeoutMs,
+      onModelError: onBarcodeReadabilityModelError,
+      videoRef: videoRef,
+      shouldLoadModels: shouldLoadModels
+    }),
+    ready = _h.ready,
+    modelLoadState = _h.modelLoadState,
+    modelDownloadProgress = _h.modelDownloadProgress,
+    modelWarmingStartedAt = _h.modelWarmingStartedAt,
+    modelError = _h.modelError;
+  var makeBarcodeReadabilityPrediction = useCallback(function (imageData, box) {
+    if (!ready) return null;
+    var prediction = makeBarcodeReadabilityModelPrediction(imageData, cropCanvas.current, rotateCanvas.current, resizeCanvas.current, box);
+    if (!prediction) return null;
+    setLastBarcodeReadabilityPredictionAt(prediction.predictionTime);
+    return prediction;
+  }, [ready]);
+  var value = useMemo(function () {
+    return {
+      loadBarcodeReadabilityModel: load,
+      barcodeReadabilityModelState: modelLoadState,
+      barcodeReadabilityModelDownloadProgress: modelDownloadProgress,
+      barcodeReadabilityModelWarmingStartedAt: modelWarmingStartedAt,
+      barcodeReadabilityModelError: modelError,
+      makeBarcodeReadabilityPrediction: makeBarcodeReadabilityPrediction,
+      barcodeReadabilityPredictionTime: lastBarcodeReadabilityPredictionTime,
+      barcodeReadabilityThresholds: barcodeReadabilityThresholds,
+      setBarcodeReadabilityThresholds: setBarcodeReadabilityThresholds
+    };
+  }, [barcodeReadabilityThresholds, load, makeBarcodeReadabilityPrediction, modelDownloadProgress, modelError, modelLoadState, modelWarmingStartedAt]);
+  return /*#__PURE__*/React__default.createElement(BarcodeReadabilityModelContext.Provider, {
+    value: value
+  }, /*#__PURE__*/React__default.createElement(InvisibleCanvasContainer, null, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+    ref: rotateCanvas
+  }), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+    ref: cropCanvas
+  }), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+    ref: resizeCanvas,
     style: showCanvases ? {
       display: 'block'
     } : undefined
-  }), children);
-}
-
-function _isNavigatorDefined() {
-  return typeof navigator !== 'undefined' && navigator != null;
+  })), children);
 }
-var isMobileCache;
-function isMobile() {
-  if (isMobileCache !== undefined) return isMobileCache;
-  isMobileCache = evaluateIsMobile();
-  return isMobileCache;
-}
-function evaluateIsMobile(nav) {
-  if (nav || _isNavigatorDefined()) {
-    if (!nav) {
-      nav = navigator;
-    }
-    if (nav.product === 'ReactNative') {
-      return true;
-    }
-    var a = nav.userAgent || nav.vendor || (
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    typeof window !== 'undefined' ? window.opera : '');
-    if (!a) {
-      var navAny = nav;
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
-      return navAny.userAgentData && navAny.userAgentData.mobile;
-    }
-    return /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4));
+function useBarcodeReadabilityModelContext() {
+  var context = useContext(BarcodeReadabilityModelContext);
+  if (!context) {
+    throw new Error('useBarcodeReadabilityModelContext must be used within a BarcodeReadabilityModelProvider');
   }
-  return false;
+  return context;
 }
 
 var onMobile = isMobile();
+/**
+ * Analyzes barcode readability for a detected document
+ * @param prediction The document detection prediction
+ * @param lastPredictionCanvas The canvas containing the original frame
+ * @param croppedDocumentCanvas Canvas for storing cropped document
+ * @param bestBarcodeCanvas Canvas for storing best barcode crop
+ * @param currentBestBarcodeScore Current best barcode score
+ * @param documentDetectionThresholds Thresholds for document detection
+ * @param makeBarcodeReadabilityPrediction Function to make barcode readability predictions
+ * @param barcodeReadabilityThresholds Thresholds for barcode readability
+ * @returns Object containing barcode analysis results
+ */
+function analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocumentCanvas, bestBarcodeCanvas, currentBestBarcodeScore, documentDetectionThresholds, makeBarcodeReadabilityPrediction, barcodeReadabilityThreshold) {
+  return __awaiter(this, void 0, void 0, function () {
+    var pdf417PredictionTime, pdf417PredictionScore, pdf417PredictionThresholdMet, newBestBarcodeScore, newBestBarcodeDetails, documentCroppedPrediction, processedCroppedPrediction, pdf417Prediction;
+    var _a;
+    return __generator(this, function (_b) {
+      switch (_b.label) {
+        case 0:
+          pdf417PredictionTime = 0;
+          pdf417PredictionScore = 0;
+          pdf417PredictionThresholdMet = false;
+          if (!prediction.bestDocument || !((_a = prediction.bestPDF417) === null || _a === void 0 ? void 0 : _a.box) || !bestBarcodeCanvas) {
+            return [2 /*return*/, {
+              pdf417PredictionTime: pdf417PredictionTime,
+              pdf417PredictionScore: pdf417PredictionScore,
+              pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
+              newBestBarcodeScore: newBestBarcodeScore,
+              newBestBarcodeDetails: newBestBarcodeDetails
+            }];
+          }
+          /**
+           * Step 1: Crop the full frame to just the document area
+           * This removes background noise and focuses analysis on the document
+           */
+          cropToDetectedObjectBox(lastPredictionCanvas, prediction.bestDocument.box, croppedDocumentCanvas);
+          return [4 /*yield*/, makeDocumentDetectorPrediction(croppedDocumentCanvas)];
+        case 1:
+          documentCroppedPrediction = _b.sent();
+          if (!documentCroppedPrediction) {
+            // error occurred during prediction (error logged by callee)
+            return [2 /*return*/, {
+              pdf417PredictionTime: pdf417PredictionTime,
+              pdf417PredictionScore: pdf417PredictionScore,
+              pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
+              newBestBarcodeScore: newBestBarcodeScore,
+              newBestBarcodeDetails: newBestBarcodeDetails
+            }];
+          }
+          processedCroppedPrediction = processDocumentDetectorPrediction(documentCroppedPrediction, documentDetectionThresholds);
+          if (processedCroppedPrediction.bestPDF417) {
+            pdf417Prediction = makeBarcodeReadabilityPrediction(croppedDocumentCanvas, processedCroppedPrediction.bestPDF417.box);
+            if (pdf417Prediction) {
+              pdf417PredictionTime = pdf417Prediction.predictionTime;
+              pdf417PredictionScore = pdf417Prediction.score;
+              if (pdf417Prediction.score > currentBestBarcodeScore) {
+                /**
+                 * Step 5: Update best barcode
+                 */
+                newBestBarcodeScore = pdf417Prediction.score;
+                newBestBarcodeDetails = {
+                  boundingBox: prediction.bestPDF417.box,
+                  score: pdf417Prediction.score
+                };
+                if (pdf417PredictionScore >= barcodeReadabilityThreshold) {
+                  pdf417PredictionThresholdMet = true;
+                }
+                cropToDetectedObjectBox(croppedDocumentCanvas, processedCroppedPrediction.bestPDF417.box, bestBarcodeCanvas, 16);
+              }
+            }
+          }
+          return [2 /*return*/, {
+            pdf417PredictionTime: pdf417PredictionTime,
+            pdf417PredictionScore: pdf417PredictionScore,
+            pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
+            newBestBarcodeScore: newBestBarcodeScore,
+            newBestBarcodeDetails: newBestBarcodeDetails
+          }];
+      }
+    });
+  });
+}
+/**
+ * Calculates the barcode readability threshold for a given document type
+ * @param detectedDocumentType The type of document detected
+ * @param barcodeReadabilityThresholds The threshold configuration object
+ * @returns The appropriate threshold value for the current platform (mobile/desktop)
+ */
+function calculateBarcodeReadabilityThreshold(detectedDocumentType, barcodeReadabilityThresholds) {
+  var barcodeReadabilityThresholdSet = detectedDocumentType in barcodeReadabilityThresholds ? barcodeReadabilityThresholds[detectedDocumentType] : undefined;
+  if (barcodeReadabilityThresholdSet) {
+    return onMobile ? barcodeReadabilityThresholdSet.mobile || 0 : barcodeReadabilityThresholdSet.desktop || 0;
+  }
+  return 0;
+}
+/**
+ * Hook that calculates the barcode readability threshold for a given document type
+ */
+function useBarcodeReadabilityThreshold() {
+  var barcodeReadabilityThresholds = useBarcodeReadabilityModelContext().barcodeReadabilityThresholds;
+  return useCallback(function (detectedDocumentType) {
+    return calculateBarcodeReadabilityThreshold(detectedDocumentType, barcodeReadabilityThresholds);
+  }, [barcodeReadabilityThresholds]);
+}
+function useBarcodeReadabilityAnalysis() {
+  var _this = this;
+  var documentDetectionThresholds = useContext(DocumentDetectionModelContext).documentDetectionThresholds;
+  var makeBarcodeReadabilityPrediction = useBarcodeReadabilityModelContext().makeBarcodeReadabilityPrediction;
+  var getBarcodeReadabilityThreshold = useBarcodeReadabilityThreshold();
+  return useCallback(function (prediction, lastPredictionCanvas, croppedDocumentCanvas, bestBarcodeCanvas, currentBestBarcodeScore) {
+    return __awaiter(_this, void 0, void 0, function () {
+      var barcodeReadabilityThreshold;
+      return __generator(this, function (_a) {
+        barcodeReadabilityThreshold = getBarcodeReadabilityThreshold(prediction.detectedDocumentType);
+        return [2 /*return*/, analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocumentCanvas, bestBarcodeCanvas, currentBestBarcodeScore, documentDetectionThresholds, makeBarcodeReadabilityPrediction, barcodeReadabilityThreshold)];
+      });
+    });
+  }, [documentDetectionThresholds, makeBarcodeReadabilityPrediction, getBarcodeReadabilityThreshold]);
+}
 var defaultIdCaptureThresholds = {
   detection: defaultDocumentDetectionThresholds,
   focus: defaultFocusThresholds
@@ -5755,6 +5769,7 @@ var IdCaptureModelsContext = /*#__PURE__*/createContext({
   },
   detectionTime: 0,
   focusPredictionTime: 0,
+  barcodeReadabilityPredictionTime: 0,
   bestFrameDetails: {
     current: null
   },
@@ -5764,55 +5779,80 @@ var IdCaptureModelsContext = /*#__PURE__*/createContext({
   resetBestFrame: function resetBestFrame() {
     return null;
   },
+  bestBarcodeDetails: {
+    current: null
+  },
+  getBestBarcode: function getBestBarcode() {
+    return null;
+  },
   requiredDocumentType: 'none',
   setRequiredDocumentType: function setRequiredDocumentType() {
     return null;
   }
 });
 function IdCaptureModelsProviderInner(_a) {
+  var _b;
   var children = _a.children,
     onModelError = _a.onModelError,
-    _b = _a.allowSinglePageIdCapture,
-    allowSinglePageIdCapture = _b === void 0 ? false : _b;
-  var _c = useContext(DocumentDetectionModelContext),
-    documentDetectionModelState = _c.documentDetectionModelState,
-    documentDetectionModelDownloadProgress = _c.documentDetectionModelDownloadProgress,
-    documentDetectionModelWarmingStartedAt = _c.documentDetectionModelWarmingStartedAt,
-    startDocumentDetection = _c.startDocumentDetection,
-    stopDocumentDetection = _c.stopDocumentDetection,
-    loadDocumentDetectionModel = _c.loadDocumentDetectionModel,
-    lastPredictionCanvas = _c.documentDetectionLastPredictionCanvas,
-    clearDocumentDetectionLastPredictionCanvas = _c.clearDocumentDetectionLastPredictionCanvas,
-    onDocumentDetected = _c.onDocumentDetected,
-    detectionTime = _c.detectionTime,
-    documentDetectionThresholds = _c.documentDetectionThresholds,
-    setDocumentDetectionThresholds = _c.setDocumentDetectionThresholds,
-    documentDetectionBoundaries = _c.documentDetectionBoundaries,
-    setDocumentDetectionBoundaries = _c.setDocumentDetectionBoundaries,
-    documentDetectionModelError = _c.documentDetectionModelError;
-  var _d = useContext(FocusModelContext),
-    loadFocusModel = _d.loadFocusModel,
-    focusModelState = _d.focusModelState,
-    focusModelDownloadProgress = _d.focusModelDownloadProgress,
-    focusModelWarmingStartedAt = _d.focusModelWarmingStartedAt,
-    makeFocusPrediction = _d.makeFocusPrediction,
-    focusThresholds = _d.focusThresholds,
-    setFocusThresholds = _d.setFocusThresholds,
-    focusPredictionTime = _d.focusPredictionTime,
-    focusModelError = _d.focusModelError;
+    _c = _a.allowSinglePageIdCapture,
+    allowSinglePageIdCapture = _c === void 0 ? false : _c,
+    _d = _a.enableBarcodeReadabilityModel,
+    enableBarcodeReadabilityModel = _d === void 0 ? true : _d;
+  var _e = useContext(DocumentDetectionModelContext),
+    documentDetectionModelState = _e.documentDetectionModelState,
+    documentDetectionModelDownloadProgress = _e.documentDetectionModelDownloadProgress,
+    documentDetectionModelWarmingStartedAt = _e.documentDetectionModelWarmingStartedAt,
+    startDocumentDetection = _e.startDocumentDetection,
+    stopDocumentDetection = _e.stopDocumentDetection,
+    loadDocumentDetectionModel = _e.loadDocumentDetectionModel,
+    lastPredictionCanvas = _e.documentDetectionLastPredictionCanvas,
+    clearDocumentDetectionLastPredictionCanvas = _e.clearDocumentDetectionLastPredictionCanvas,
+    onDocumentDetected = _e.onDocumentDetected,
+    detectionTime = _e.detectionTime,
+    documentDetectionThresholds = _e.documentDetectionThresholds,
+    setDocumentDetectionThresholds = _e.setDocumentDetectionThresholds,
+    documentDetectionBoundaries = _e.documentDetectionBoundaries,
+    setDocumentDetectionBoundaries = _e.setDocumentDetectionBoundaries,
+    documentDetectionModelError = _e.documentDetectionModelError;
+  var _f = useContext(FocusModelContext),
+    loadFocusModel = _f.loadFocusModel,
+    focusModelState = _f.focusModelState,
+    focusModelDownloadProgress = _f.focusModelDownloadProgress,
+    focusModelWarmingStartedAt = _f.focusModelWarmingStartedAt,
+    makeFocusPrediction = _f.makeFocusPrediction,
+    focusThresholds = _f.focusThresholds,
+    setFocusThresholds = _f.setFocusThresholds,
+    focusPredictionTime = _f.focusPredictionTime,
+    focusModelError = _f.focusModelError;
+  var _g = useBarcodeReadabilityModelContext(),
+    loadBarcodeReadabilityModel = _g.loadBarcodeReadabilityModel,
+    barcodeReadabilityModelState = _g.barcodeReadabilityModelState,
+    barcodeReadabilityModelDownloadProgress = _g.barcodeReadabilityModelDownloadProgress,
+    barcodeReadabilityModelWarmingStartedAt = _g.barcodeReadabilityModelWarmingStartedAt,
+    makeBarcodeReadabilityPrediction = _g.makeBarcodeReadabilityPrediction,
+    barcodeReadabilityThresholds = _g.barcodeReadabilityThresholds,
+    setBarcodeReadabilityThresholds = _g.setBarcodeReadabilityThresholds,
+    barcodeReadabilityPredictionTime = _g.barcodeReadabilityPredictionTime,
+    barcodeReadabilityModelError = _g.barcodeReadabilityModelError;
   var onPredictionHandler = useRef();
   var bestFrameDetails = useRef(null);
+  var bestBarcodeDetails = useRef(null);
   var bestPredictionCanvas = useRef(null);
+  var bestBarcodeCanvas = useRef(null);
+  var croppedDocumentCanvas = useRef(null);
   var bestFocusScore = useRef(0);
+  var bestBarcodeScore = useRef(0);
   var stopDetection = useRef(0);
-  var _e = useState('none'),
-    requiredDocumentType = _e[0],
-    setRequiredDocumentType = _e[1];
+  var analyzeBarcodeReadability = useBarcodeReadabilityAnalysis();
+  var _h = useState('none'),
+    requiredDocumentType = _h[0],
+    setRequiredDocumentType = _h[1];
   var thresholds = useMemo(function () {
     return _assign(_assign({}, documentDetectionThresholds), {
-      focus: focusThresholds
+      focus: focusThresholds,
+      barcodeReadability: barcodeReadabilityThresholds
     });
-  }, [documentDetectionThresholds, focusThresholds]);
+  }, [documentDetectionThresholds, focusThresholds, barcodeReadabilityThresholds]);
   var setThresholds = useCallback(function (thresholds) {
     if (thresholds.detection) {
       setDocumentDetectionThresholds(thresholds.detection);
@@ -5820,57 +5860,87 @@ function IdCaptureModelsProviderInner(_a) {
     if (thresholds.focus) {
       setFocusThresholds(thresholds.focus);
     }
-  }, [setDocumentDetectionThresholds, setFocusThresholds]);
+    if (thresholds.barcodeReadability) {
+      setBarcodeReadabilityThresholds(thresholds.barcodeReadability);
+    }
+  }, [setBarcodeReadabilityThresholds, setDocumentDetectionThresholds, setFocusThresholds]);
   useEffect(function handleDetections() {
     var _this = this;
     onDocumentDetected(function (prediction) {
       return __awaiter(_this, void 0, void 0, function () {
-        var stopDetectionAtStart, focusPredictionTime, focusScore, focusThresholdMet, isSinglePage, isRequiredDocumentType, focusPrediction, focusThresholdSet, focusThreshold;
+        var stopDetectionAtStart, focusPredictionTime, focusScore, focusThresholdMet, pdf417PredictionTime, pdf417PredictionScore, pdf417PredictionThresholdMet, isSinglePage, isRequiredDocumentType, focusPrediction, focusThresholdSet, focusThreshold, barcodeAnalysisResult;
         var _a, _b, _c, _d, _e, _f, _g;
         return __generator(this, function (_h) {
-          if (!lastPredictionCanvas.current) return [2 /*return*/];
-          stopDetectionAtStart = stopDetection.current;
-          focusPredictionTime = 0, focusScore = 0, focusThresholdMet = false;
-          isSinglePage = prediction.detectedDocumentType === 'singlePage';
-          if (!allowSinglePageIdCapture && isSinglePage) {
-            prediction.detectedDocumentType = 'passport';
-            prediction.passportDetectionScore = prediction.singlePageDetectionScore;
-            prediction.passportDetectionThresholdMet = prediction.singlePageDetectionThresholdMet;
-            prediction.singlePageDetectionScore = 0;
-            prediction.singlePageDetectionThresholdMet = false;
-          }
-          isRequiredDocumentType = requiredDocumentType === 'none' || prediction.detectedDocumentType === requiredDocumentType || ((_a = requiredDocumentType.includes) === null || _a === void 0 ? void 0 : _a.call(requiredDocumentType, prediction.detectedDocumentType)) || allowSinglePageIdCapture && isSinglePage && ((_b = requiredDocumentType.includes) === null || _b === void 0 ? void 0 : _b.call(requiredDocumentType, 'idCardFront'));
-          if (isRequiredDocumentType && prediction.detectedDocumentType !== 'none' && prediction.detectionThresholdMet && prediction.documentInBounds && !prediction.documentTooClose && prediction.documentIsStable) {
-            focusPrediction = makeFocusPrediction(lastPredictionCanvas.current, (_c = prediction.bestDocument) === null || _c === void 0 ? void 0 : _c.box);
-            if (focusPrediction) {
-              focusScore = focusPrediction.score;
-              focusPredictionTime = focusPrediction.predictionTime;
-            }
-            focusThresholdSet = (_d = thresholds.focus) === null || _d === void 0 ? void 0 : _d[prediction.detectedDocumentType];
-            focusThreshold = (_e = onMobile ? focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.mobile : focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.desktop) !== null && _e !== void 0 ? _e : 0;
-            focusThresholdMet = focusScore >= focusThreshold;
-            if (bestFocusScore.current <= focusScore && stopDetectionAtStart === stopDetection.current) {
-              bestFocusScore.current = focusScore;
-              drawToCanvas(bestPredictionCanvas.current, lastPredictionCanvas.current);
-              bestFrameDetails.current = {
-                boundingBox: (_f = prediction.bestDocument) === null || _f === void 0 ? void 0 : _f.box,
-                documentType: prediction.detectedDocumentType,
-                detectionScore: prediction.detectionScore,
-                focusScore: focusScore
-              };
-            }
+          switch (_h.label) {
+            case 0:
+              if (!lastPredictionCanvas.current) return [2 /*return*/];
+              stopDetectionAtStart = stopDetection.current;
+              focusPredictionTime = 0, focusScore = 0, focusThresholdMet = false, pdf417PredictionTime = 0, pdf417PredictionScore = 0, pdf417PredictionThresholdMet = false;
+              isSinglePage = prediction.detectedDocumentType === 'singlePage';
+              if (!allowSinglePageIdCapture && isSinglePage) {
+                prediction.detectedDocumentType = 'passport';
+                prediction.passportDetectionScore = prediction.singlePageDetectionScore;
+                prediction.passportDetectionThresholdMet = prediction.singlePageDetectionThresholdMet;
+                prediction.singlePageDetectionScore = 0;
+                prediction.singlePageDetectionThresholdMet = false;
+              }
+              isRequiredDocumentType = requiredDocumentType === 'none' || prediction.detectedDocumentType === requiredDocumentType || ((_a = requiredDocumentType.includes) === null || _a === void 0 ? void 0 : _a.call(requiredDocumentType, prediction.detectedDocumentType)) || allowSinglePageIdCapture && isSinglePage && ((_b = requiredDocumentType.includes) === null || _b === void 0 ? void 0 : _b.call(requiredDocumentType, 'idCardFront'));
+              if (!(isRequiredDocumentType && prediction.detectedDocumentType !== 'none' && prediction.detectionThresholdMet && prediction.documentInBounds && !prediction.documentTooClose && prediction.documentIsStable)) return [3 /*break*/, 2];
+              focusPrediction = makeFocusPrediction(lastPredictionCanvas.current, (_c = prediction.bestDocument) === null || _c === void 0 ? void 0 : _c.box);
+              if (focusPrediction) {
+                focusScore = focusPrediction.score;
+                focusPredictionTime = focusPrediction.predictionTime;
+              }
+              focusThresholdSet = (_d = thresholds.focus) === null || _d === void 0 ? void 0 : _d[prediction.detectedDocumentType];
+              focusThreshold = (_e = onMobile ? focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.mobile : focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.desktop) !== null && _e !== void 0 ? _e : 0;
+              focusThresholdMet = focusScore >= focusThreshold;
+              if (!(stopDetectionAtStart === stopDetection.current)) return [3 /*break*/, 2];
+              if (bestFocusScore.current <= focusScore) {
+                bestFocusScore.current = focusScore;
+                drawToCanvas(bestPredictionCanvas.current, lastPredictionCanvas.current);
+                bestFrameDetails.current = {
+                  boundingBox: (_f = prediction.bestDocument) === null || _f === void 0 ? void 0 : _f.box,
+                  documentType: prediction.detectedDocumentType,
+                  detectionScore: prediction.detectionScore,
+                  focusScore: focusScore
+                };
+              }
+              if (!(enableBarcodeReadabilityModel && prediction.bestDocument && prediction.bestPDF417 && croppedDocumentCanvas.current)) return [3 /*break*/, 2];
+              return [4 /*yield*/, analyzeBarcodeReadability(prediction, lastPredictionCanvas.current, croppedDocumentCanvas.current, bestBarcodeCanvas.current, bestBarcodeScore.current)];
+            case 1:
+              barcodeAnalysisResult = _h.sent();
+              pdf417PredictionTime = barcodeAnalysisResult.pdf417PredictionTime;
+              pdf417PredictionScore = barcodeAnalysisResult.pdf417PredictionScore;
+              pdf417PredictionThresholdMet = barcodeAnalysisResult.pdf417PredictionThresholdMet;
+              if (barcodeAnalysisResult.newBestBarcodeScore) {
+                bestBarcodeScore.current = barcodeAnalysisResult.newBestBarcodeScore;
+              }
+              if (barcodeAnalysisResult.newBestBarcodeDetails) {
+                bestBarcodeDetails.current = barcodeAnalysisResult.newBestBarcodeDetails;
+              }
+              _h.label = 2;
+            case 2:
+              /**
+               * @note
+               * This should ALWAYS be called.
+               * Do not return early from this function unless
+               * lastPredictionCanvas.current is not set
+               */
+              (_g = onPredictionHandler.current) === null || _g === void 0 ? void 0 : _g.call(onPredictionHandler, _assign(_assign({}, prediction), {
+                focusScore: focusScore,
+                focusPredictionTime: focusPredictionTime,
+                focusThresholdMet: focusThresholdMet,
+                pdf417PredictionTime: pdf417PredictionTime,
+                pdf417PredictionScore: pdf417PredictionScore,
+                pdf417PredictionThresholdMet: pdf417PredictionThresholdMet
+              }));
+              return [2 /*return*/];
           }
-          (_g = onPredictionHandler.current) === null || _g === void 0 ? void 0 : _g.call(onPredictionHandler, _assign(_assign({}, prediction), {
-            focusScore: focusScore,
-            focusPredictionTime: focusPredictionTime,
-            focusThresholdMet: focusThresholdMet
-          }));
-          return [2 /*return*/];
         });
       });
     });
-  }, [allowSinglePageIdCapture, lastPredictionCanvas, makeFocusPrediction, onDocumentDetected, requiredDocumentType, thresholds.focus]);
-  var modelError = documentDetectionModelError !== null && documentDetectionModelError !== void 0 ? documentDetectionModelError : focusModelError;
+  }, [allowSinglePageIdCapture, analyzeBarcodeReadability, barcodeReadabilityThresholds, enableBarcodeReadabilityModel, lastPredictionCanvas, makeBarcodeReadabilityPrediction, makeFocusPrediction, onDocumentDetected, requiredDocumentType, thresholds.focus]);
+  var modelError = (_b = documentDetectionModelError !== null && documentDetectionModelError !== void 0 ? documentDetectionModelError : focusModelError) !== null && _b !== void 0 ? _b : barcodeReadabilityModelError;
   useEffect(function handleModelErrors() {
     if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
   }, [modelError, onModelError]);
@@ -5883,9 +5953,15 @@ function IdCaptureModelsProviderInner(_a) {
       canvas: bestPredictionCanvas.current
     });
   }, []);
-  var _f = useState(0),
-    canvasKey = _f[0],
-    setCanvasKey = _f[1];
+  var getBestBarcode = useCallback(function () {
+    if (!bestBarcodeDetails.current || !bestBarcodeCanvas.current) return null;
+    return _assign(_assign({}, bestBarcodeDetails.current), {
+      canvas: bestBarcodeCanvas.current
+    });
+  }, []);
+  var _j = useState(0),
+    canvasKey = _j[0],
+    setCanvasKey = _j[1];
   var resetBestFrame = useCallback(function () {
     stopDetection.current += 1;
     setCanvasKey(function (n) {
@@ -5901,16 +5977,45 @@ function IdCaptureModelsProviderInner(_a) {
   var load = useCallback(function () {
     loadDocumentDetectionModel();
     loadFocusModel();
-  }, [loadDocumentDetectionModel, loadFocusModel]);
-  var ready = documentDetectionModelState === 'ready' && focusModelState === 'ready';
-  var modelLoadState = ready ? 'ready' : documentDetectionModelState === 'warming' || focusModelState === 'warming' ? 'warming' : focusModelState === 'downloading' || documentDetectionModelState === 'downloading' ? 'downloading' : 'not-started';
-  var modelWarmingStartedAt = !documentDetectionModelWarmingStartedAt && !focusModelWarmingStartedAt ? null : Math.min.apply(Math, [documentDetectionModelWarmingStartedAt, focusModelWarmingStartedAt].filter(function (v) {
-    return v !== null;
-  }));
+    if (enableBarcodeReadabilityModel) loadBarcodeReadabilityModel();
+  }, [enableBarcodeReadabilityModel, loadBarcodeReadabilityModel, loadDocumentDetectionModel, loadFocusModel]);
+  var _k = useMemo(function () {
+      var modelStates = [documentDetectionModelState, focusModelState];
+      var modelWarmingStartedAts = [documentDetectionModelWarmingStartedAt, focusModelWarmingStartedAt];
+      var modelDownloadProgresses = [documentDetectionModelDownloadProgress, focusModelDownloadProgress];
+      if (enableBarcodeReadabilityModel) {
+        modelStates.push(barcodeReadabilityModelState);
+        modelWarmingStartedAts.push(barcodeReadabilityModelWarmingStartedAt);
+        modelDownloadProgresses.push(barcodeReadabilityModelDownloadProgress);
+      }
+      var ready = modelStates.every(function (state) {
+        return state === 'ready';
+      });
+      return {
+        ready: ready,
+        modelLoadState: ready ? 'ready' : modelStates.some(function (state) {
+          return state === 'warming';
+        }) ? 'warming' : modelStates.some(function (state) {
+          return state === 'downloading';
+        }) ? 'downloading' : 'not-started',
+        modelWarmingStartedAt: modelWarmingStartedAts.every(function (v) {
+          return v === null;
+        }) ? null : Math.min.apply(Math, modelWarmingStartedAts.filter(function (v) {
+          return v !== null;
+        })),
+        modelDownloadProgress: modelDownloadProgresses.reduce(function (a, b) {
+          return a + b;
+        }, 0) / modelDownloadProgresses.length
+      };
+    }, [barcodeReadabilityModelDownloadProgress, barcodeReadabilityModelState, barcodeReadabilityModelWarmingStartedAt, documentDetectionModelDownloadProgress, documentDetectionModelState, documentDetectionModelWarmingStartedAt, enableBarcodeReadabilityModel, focusModelDownloadProgress, focusModelState, focusModelWarmingStartedAt]),
+    ready = _k.ready,
+    modelLoadState = _k.modelLoadState,
+    modelWarmingStartedAt = _k.modelWarmingStartedAt,
+    modelDownloadProgress = _k.modelDownloadProgress;
   var value = useMemo(function () {
     return {
       ready: ready,
-      modelDownloadProgress: (documentDetectionModelDownloadProgress + focusModelDownloadProgress) / 2,
+      modelDownloadProgress: modelDownloadProgress,
       modelLoadState: modelLoadState,
       modelWarmingStartedAt: modelWarmingStartedAt,
       modelError: modelError,
@@ -5924,24 +6029,35 @@ function IdCaptureModelsProviderInner(_a) {
       onPredictionMade: onPredictionMade,
       detectionTime: detectionTime,
       focusPredictionTime: focusPredictionTime,
+      barcodeReadabilityPredictionTime: barcodeReadabilityPredictionTime,
       getBestFrame: getBestFrame,
       resetBestFrame: resetBestFrame,
       bestFrameDetails: bestFrameDetails,
+      bestBarcodeDetails: bestBarcodeDetails,
+      getBestBarcode: getBestBarcode,
       requiredDocumentType: requiredDocumentType,
       setRequiredDocumentType: setRequiredDocumentType
     };
-  }, [detectionTime, documentDetectionBoundaries, documentDetectionModelDownloadProgress, focusModelDownloadProgress, focusPredictionTime, getBestFrame, load, modelLoadState, modelError, modelWarmingStartedAt, onPredictionMade, ready, requiredDocumentType, resetBestFrame, setDocumentDetectionBoundaries, setThresholds, startDocumentDetection, stopDocumentDetection, thresholds]);
+  }, [ready, modelDownloadProgress, modelLoadState, modelWarmingStartedAt, modelError, startDocumentDetection, stopDocumentDetection, load, thresholds, setThresholds, documentDetectionBoundaries, setDocumentDetectionBoundaries, onPredictionMade, detectionTime, focusPredictionTime, barcodeReadabilityPredictionTime, getBestFrame, resetBestFrame, getBestBarcode, requiredDocumentType]);
   return /*#__PURE__*/React__default.createElement(IdCaptureModelsContext.Provider, {
     value: value
-  }, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
-    key: canvasKey,
+  }, /*#__PURE__*/React__default.createElement(InvisibleCanvasContainer, null, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+    key: "bf-".concat(canvasKey),
     ref: bestPredictionCanvas
-  }), children);
+  }), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+    key: "bb-".concat(canvasKey),
+    ref: bestBarcodeCanvas
+  }), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
+    key: "cd-".concat(canvasKey),
+    ref: croppedDocumentCanvas
+  })), children);
 }
 function IdCaptureModelsProvider(_a) {
   var children = _a.children,
     props = __rest(_a, ["children"]);
-  return /*#__PURE__*/React__default.createElement(DocumentDetectionModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(FocusModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(IdCaptureModelsProviderInner, _assign({}, props), children)));
+  return /*#__PURE__*/React__default.createElement(DocumentDetectionModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(FocusModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(BarcodeReadabilityModelProvider, _assign({}, props, {
+    shouldLoadModels: props.enableBarcodeReadabilityModel
+  }), /*#__PURE__*/React__default.createElement(IdCaptureModelsProviderInner, _assign({}, props), children))));
 }
 function useIdCaptureModelsContext() {
   var context = useContext(IdCaptureModelsContext);
@@ -5951,7 +6067,7 @@ function useIdCaptureModelsContext() {
   return context;
 }
 
-var CapturedDocumentTypeValues = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'selfie', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
+var CapturedDocumentTypeValues = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'selfie', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage', 'idBarcodeImage'];
 
 var acceptedDocumentTypesForIdCaptureRequirementOption = {
   idCardFront: ['idCardFront'],
@@ -6037,6 +6153,7 @@ var initialState$5 = {
   capturing: false,
   captureFailed: false,
   imageUrl: null,
+  idBarcodeImage: null,
   captureState: 'initializing',
   capturedDocuments: {},
   captureRequirement: 'idCardOrPassport',
@@ -6316,6 +6433,17 @@ var _reducer = function reducer(state, action) {
         }
         return newState;
       }
+    case 'barcodeCaptured':
+      return _reducer(state, {
+        type: 'documentCaptured',
+        payload: {
+          imageData: action.payload.imageUrl,
+          documentType: 'idBarcodeImage',
+          width: 0,
+          height: 0,
+          barcodeReadabilityScore: action.payload.barcodeReadabilityScore
+        }
+      });
     case 'flipRequestCompleted':
       return _assign(_assign({}, state), {
         captureState: 'capturing',
@@ -6807,12 +6935,13 @@ var IdCapture = function IdCapture(_a) {
     height = _q === void 0 ? 1 : _q;
   var state = useIdCaptureStore();
   var isRearFacing = useCameraStore().isRearFacing;
-  var _r = useContext(IdCaptureModelsContext),
+  var _r = useIdCaptureModelsContext(),
     modelsReady = _r.ready,
     setThresholds = _r.setThresholds,
     detectionTime = _r.detectionTime,
     focusPredictionTime = _r.focusPredictionTime,
-    getBestFrame = _r.getBestFrame;
+    getBestFrame = _r.getBestFrame,
+    getBestBarcode = _r.getBestBarcode;
   useEffect(function () {
     return dispatchIdCaptureAction({
       type: 'captureInitialized'
@@ -6851,6 +6980,16 @@ var IdCapture = function IdCapture(_a) {
       });
       return;
     }
+    var bestBarcode = getBestBarcode();
+    if (bestBarcode) {
+      dispatchIdCaptureAction({
+        type: 'barcodeCaptured',
+        payload: {
+          imageUrl: bestBarcode.canvas.toDataURL('image/jpeg', 0.95),
+          barcodeReadabilityScore: bestBarcode.score
+        }
+      });
+    }
     var canvas = bestFrame.canvas,
       documentType = bestFrame.documentType,
       boundingBox = bestFrame.boundingBox,
@@ -6867,21 +7006,22 @@ var IdCapture = function IdCapture(_a) {
     });
     var capturedDocumentType = documentType;
     setTimeout(function () {
-      var _a;
-      var captureTime = new Date().getTime() - ((_a = state.captureStartedAt) !== null && _a !== void 0 ? _a : new Date()).getTime();
+      var _a, _b;
+      var captureTime = performance.now() - ((_a = state.captureStartedAt) !== null && _a !== void 0 ? _a : new Date()).getTime();
       var metadata = {
         autoCapture: 'Y',
         captureTime: captureTime,
         boundingBox: boundingBox,
         bestDetectionScore: detectionScore,
-        bestFocusScore: focusScore
+        bestFocusScore: focusScore,
+        bestBarcodeScore: (_b = bestBarcode === null || bestBarcode === void 0 ? void 0 : bestBarcode.score) !== null && _b !== void 0 ? _b : 0
       };
       onCapture === null || onCapture === void 0 ? void 0 : onCapture(imageUrl, width, height, capturedDocumentType, metadata);
       dispatchIdCaptureAction({
         type: 'captured'
       });
     }, 0);
-  }, [getBestFrame, onCapture, shouldCapture, state.captureStartedAt, state.requestedDocumentType]);
+  }, [getBestBarcode, getBestFrame, onCapture, shouldCapture, state.captureStartedAt, state.requestedDocumentType]);
   var theme = useTheme();
   colors.guideBoxUnsatisfiedColor || (colors.guideBoxUnsatisfiedColor = (_d = (_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.guideBox) === null || _c === void 0 ? void 0 : _c.unsatisfiedColor) !== null && _d !== void 0 ? _d : 'white');
   colors.guideBoxSatisfiedColor || (colors.guideBoxSatisfiedColor = (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.guideBox) === null || _f === void 0 ? void 0 : _f.satisfiedColor) !== null && _g !== void 0 ? _g : 'green');
@@ -7681,7 +7821,7 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
     };
   }, [ready]);
   var imageRef = useRef(null);
-  var timeSinceWarmingStarted = modelWarmingStartedAt ? new Date().getTime() - modelWarmingStartedAt : 0;
+  var timeSinceWarmingStarted = modelWarmingStartedAt ? performance.now() - modelWarmingStartedAt : 0;
   var warmingProgress = timeSinceWarmingStarted / 5000.0;
   var modelLoadProgress = modelsReady ? 100 : modelDownloadProgress * 0.5 + warmingProgress * 49.0;
   useLoadProgressHooks({
@@ -8019,7 +8159,7 @@ var Card = styled.div(templateObject_1$D || (templateObject_1$D = __makeTemplate
 var FlexCard = styled(Card)(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
 var templateObject_1$D, templateObject_2$y;
 
-var imageDisplayOrder = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
+var imageDisplayOrder = ['idCardFront', 'idCardBack', 'idBarcodeImage', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
 var IdCaptureSuccess = function IdCaptureSuccess(_a) {
   var capturedDocuments = _a.capturedDocuments,
     onSubmitClick = _a.onSubmitClick,
@@ -8061,7 +8201,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
       image: doc,
       className: classNames.image,
       alt: doc.documentType
-    }), debugMode && ( /*#__PURE__*/React__default.createElement(DebugPre, null, "Document Type: ".concat(doc.documentType, "\nDetection Score: ").concat(doc.detectionScore, "\nFocus Score: ").concat(doc.focusScore, "\nBounding Box: ").concat(JSON.stringify(doc.boundingBox)))));
+    }), debugMode && ( /*#__PURE__*/React__default.createElement(DebugPre, null, name === 'idBarcodeImage' ? "Document Type: ".concat(doc.documentType, "\nReadability Score: ").concat(doc.barcodeReadabilityScore) : "Document Type: ".concat(doc.documentType, "\nDetection Score: ").concat(doc.detectionScore, "\nFocus Score: ").concat(doc.focusScore, "\nBounding Box: ").concat(JSON.stringify(doc.boundingBox)))));
   }))), /*#__PURE__*/React__default.createElement(ButtonsColumn, {
     className: classNames.buttonsRow
   }, /*#__PURE__*/React__default.createElement(WideButton, {
@@ -10683,7 +10823,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
   var _6 = useState(false),
     overlayDismissed = _6[0],
     setOverlayDismissed = _6[1];
-  var _7 = useContext(SubmissionContext),
+  var _7 = useSubmissionContext(),
     submissionStatus = _7.submissionStatus,
     setIdFrontImage = _7.setIdFrontImage,
     setIdBackImage = _7.setIdBackImage,
@@ -10692,6 +10832,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
     setIdBackIrImage = _7.setIdBackIrImage,
     setIdFrontUvImage = _7.setIdFrontUvImage,
     setIdBackUvImage = _7.setIdBackUvImage,
+    setIdBarcodeImage = _7.setIdBarcodeImage,
     logIdFrontCaptureAttempt = _7.logIdFrontCaptureAttempt,
     logIdBackCaptureAttempt = _7.logIdBackCaptureAttempt;
   var _8 = useIdCaptureModelsContext(),
@@ -10792,7 +10933,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
     });
   }, [logCaptureMetadata, onDocumentCaptured]);
   var onSubmitClick = useCallback(function () {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     var docs = state.capturedDocuments;
     var submission = {
       idFrontImage: maybeDataUrlToBase64Sync((_a = docs.idCardFront) === null || _a === void 0 ? void 0 : _a.imageData),
@@ -10802,7 +10943,8 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
       idFrontIrImage: maybeDataUrlToBase64Sync((_e = docs.idFrontIrImage) === null || _e === void 0 ? void 0 : _e.imageData),
       idBackIrImage: maybeDataUrlToBase64Sync((_f = docs.idBackIrImage) === null || _f === void 0 ? void 0 : _f.imageData),
       idFrontUvImage: maybeDataUrlToBase64Sync((_g = docs.idFrontUvImage) === null || _g === void 0 ? void 0 : _g.imageData),
-      idBackUvImage: maybeDataUrlToBase64Sync((_h = docs.idBackUvImage) === null || _h === void 0 ? void 0 : _h.imageData)
+      idBackUvImage: maybeDataUrlToBase64Sync((_h = docs.idBackUvImage) === null || _h === void 0 ? void 0 : _h.imageData),
+      idBarcodeImage: maybeDataUrlToBase64Sync((_j = docs.idBarcodeImage) === null || _j === void 0 ? void 0 : _j.imageData)
     };
     if (submission.idFrontImage) setIdFrontImage(submission.idFrontImage);
     if (submission.idBackImage) setIdBackImage(submission.idBackImage);
@@ -10812,11 +10954,12 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
     if (submission.idBackIrImage) setIdBackIrImage(submission.idBackIrImage);
     if (submission.idFrontUvImage) setIdFrontUvImage(submission.idFrontUvImage);
     if (submission.idBackUvImage) setIdBackUvImage(submission.idBackUvImage);
+    if (submission.idBarcodeImage) setIdBarcodeImage(submission.idBarcodeImage);
     if (releaseCameraAccessOnExit) releaseCameraAccess();
     setTimeout(function () {
       return onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(submission);
     }, 0);
-  }, [onSuccess, releaseCameraAccess, releaseCameraAccessOnExit, setIdBackImage, setIdBackIrImage, setIdBackUvImage, setIdFrontImage, setIdFrontIrImage, setIdFrontUvImage, setPassportImage, state.capturedDocuments]);
+  }, [onSuccess, releaseCameraAccess, releaseCameraAccessOnExit, setIdBarcodeImage, setIdBackImage, setIdBackIrImage, setIdBackUvImage, setIdFrontImage, setIdFrontIrImage, setIdFrontUvImage, setPassportImage, state.capturedDocuments]);
   var showSuccessScreen = useShowSuccessScreen(skipSuccessScreen, state.captureState === 'complete', onSubmitClick);
   var onRetryClick = useCallback(function () {
     return dispatchIdCaptureAction({
@@ -11625,40 +11768,378 @@ function SelfieCaptureAnimatedMaskWithStatus(_a) {
       });
     }, 250);
     return function () {
-      clearInterval(interval);
+      clearInterval(interval);
+    };
+  }, [status]);
+  return /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMask, _assign({}, props, {
+    frame: frame,
+    status: status
+  }));
+}
+var templateObject_1$o, templateObject_2$m, templateObject_3$g;
+
+var FaceCaptureGuideContainer = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n  position: absolute;\n  z-index: 1000;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px;\n  box-sizing: border-box;\n"], ["\n  position: absolute;\n  z-index: 1000;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px;\n  box-sizing: border-box;\n"])));
+var FaceCaptureGuideInner = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n  position: relative;\n  height: 60%;\n"], ["\n  position: relative;\n  height: 60%;\n"])));
+var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
+  var _b = _a.classNames,
+    classNames = _b === void 0 ? {} : _b,
+    _c = _a.status,
+    status = _c === void 0 ? 'ready' : _c,
+    _d = _a.borderWidth,
+    borderWidth = _d === void 0 ? 5 : _d,
+    _e = _a.borderColor,
+    borderColor = _e === void 0 ? 'white' : _e,
+    _f = _a.borderOpacity,
+    borderOpacity = _f === void 0 ? 0.8 : _f;
+  return /*#__PURE__*/React__default.createElement(FaceCaptureGuideContainer, {
+    className: classNames.container
+  }, /*#__PURE__*/React__default.createElement(FaceCaptureGuideInner, null, /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMaskWithStatus, {
+    status: status,
+    borderColor: borderColor,
+    borderWidth: borderWidth,
+    borderOpacity: borderOpacity,
+    verticalAlign: "center"
+  })));
+};
+var templateObject_1$n, templateObject_2$l;
+
+var defaultSelfieCaptureModelLoadTimeoutMs = 45000;
+var detector = null;
+var detectorSettings = null;
+function loadFaceDetector() {
+  return __awaiter(this, arguments, void 0, function (modelAssetPath) {
+    var _a, _b;
+    if (modelAssetPath === void 0) {
+      modelAssetPath = defaultFaceDetectorModelPath;
+    }
+    return __generator(this, function (_c) {
+      switch (_c.label) {
+        case 0:
+          if (detector && (detectorSettings === null || detectorSettings === void 0 ? void 0 : detectorSettings.modelAssetPath) === modelAssetPath) return [2 /*return*/, detector];
+          closeFaceDetector();
+          return [4 /*yield*/, preloadFaceDetectorDependencies()];
+        case 1:
+          _c.sent();
+          if (modelCapabilities.delegate === 'NONE') {
+            throw new Error('No available delegate for face detector.');
+          }
+          _b = (_a = FaceDetector).createFromOptions;
+          return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
+        case 2:
+          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
+            // canvas: document.createElement('canvas'),
+            baseOptions: {
+              modelAssetPath: modelAssetPath,
+              delegate: modelCapabilities.delegate
+            },
+            runningMode: 'VIDEO'
+          }])];
+        case 3:
+          detector = _c.sent();
+          detectorSettings = {
+            modelAssetPath: modelAssetPath
+          };
+          return [2 /*return*/, detector];
+      }
+    });
+  });
+}
+function closeFaceDetector() {
+  detector === null || detector === void 0 ? void 0 : detector.close();
+  detector = null;
+  detectorSettings = null;
+}
+function useLoadFaceDetector(_a) {
+  var onModelError = _a.onModelError,
+    _b = _a.modelLoadTimeoutMs,
+    modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b,
+    videoRef = _a.videoRef;
+  var _c = useState('not-started'),
+    modelLoadState = _c[0],
+    setModelLoadState = _c[1];
+  var _d = useState(0),
+    modelDownloadProgress = _d[0],
+    setModelDownloadProgress = _d[1];
+  var _e = useState(null),
+    modelWarmingStartedAt = _e[0],
+    setModelWarmingStartedAt = _e[1];
+  var _f = useState(null),
+    modelError = _f[0],
+    setModelError = _f[1];
+  useEffect(function loadModel() {
+    var _this = this;
+    setModelLoadState('downloading');
+    setModelWarmingStartedAt(null);
+    var modelLoadTimeout = setTimeout(function () {
+      setModelError(new Error('Model loading time limit exceeded.'));
+    }, modelLoadTimeoutMs);
+    function handleDownloadProgress(event) {
+      setModelDownloadProgress(progressToPercentage(event.detail));
+    }
+    document.addEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
+    var cancelVideoReady = function cancelVideoReady() {};
+    loadFaceDetector().then(function (model) {
+      return __awaiter(_this, void 0, void 0, function () {
+        var _a, videoReady, cancel, cancelled;
+        return __generator(this, function (_b) {
+          switch (_b.label) {
+            case 0:
+              setModelDownloadProgress(100);
+              clearTimeout(modelLoadTimeout);
+              setModelLoadState('warming');
+              setModelWarmingStartedAt(performance.now());
+              return [4 /*yield*/, testFaceDetectionAgainstKnownImage(model)];
+            case 1:
+              _b.sent();
+              _a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
+              cancelled = false;
+              cancelVideoReady = function cancelVideoReady() {
+                cancelled = true;
+                cancel();
+              };
+              return [4 /*yield*/, videoReady];
+            case 2:
+              _b.sent();
+              if (cancelled) return [2 /*return*/];
+              model.detectForVideo(videoRef.current, performance.now());
+              setModelLoadState('ready');
+              return [2 /*return*/];
+          }
+        });
+      });
+    })["catch"](function (e) {
+      setModelError(e);
+      setModelLoadState('error');
+    })["finally"](function () {
+      clearTimeout(modelLoadTimeout);
+    });
+    return function () {
+      log('unloading face detection model');
+      cancelVideoReady();
+      closeFaceDetector();
+      clearTimeout(modelLoadTimeout);
+      document.removeEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
     };
-  }, [status]);
-  return /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMask, _assign({}, props, {
-    frame: frame,
-    status: status
-  }));
+  }, [modelLoadTimeoutMs, videoRef]);
+  useEffect(function handleModelError() {
+    if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
+  }, [modelError, onModelError]);
+  return useMemo(function () {
+    return {
+      ready: modelLoadState === 'ready',
+      modelLoadState: modelLoadState,
+      modelDownloadProgress: modelDownloadProgress,
+      modelWarmingStartedAt: modelWarmingStartedAt,
+      modelError: modelError
+    };
+  }, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
+}
+var lastFaceDetectionAt = 0;
+var lastFaceDetectionTime = 0;
+function setLastFaceDetectionAt(time) {
+  lastFaceDetectionTime = time - lastFaceDetectionAt;
+  lastFaceDetectionAt = time;
+}
+var framesNeededSamples = [];
+function trackFramesNeeded(value, bufferLength) {
+  if (bufferLength === void 0) {
+    bufferLength = 25;
+  }
+  framesNeededSamples.unshift(value);
+  if (framesNeededSamples.length > bufferLength) framesNeededSamples.length = bufferLength;
+}
+var lastNFaces = [];
+var lastNFacePairs = [];
+var lastNNoses = [];
+var lastNNosePairs = [];
+function trackFace(face, framesNeeded, frameWidth, frameHeight) {
+  if (framesNeeded === void 0) {
+    framesNeeded = 12;
+  }
+  var nose = face.keypoints[2];
+  if (!nose) return;
+  lastNFaces.unshift(face);
+  lastNNoses.unshift(nose);
+  if (lastNFaces.length > framesNeeded) lastNFaces.length = framesNeeded;
+  if (lastNNoses.length > framesNeeded) lastNNoses.length = framesNeeded;
+  if (lastNFaces.length > 1) {
+    var lastFace = lastNFaces[1];
+    var iou = calculateIoU(face.box, lastFace.box);
+    lastNFacePairs.unshift({
+      a: face,
+      b: lastFace,
+      iou: iou
+    });
+    if (lastNFacePairs.length > framesNeeded - 1) lastNFacePairs.length = framesNeeded - 1;
+  }
+  if (lastNNoses.length > 1) {
+    var lastNose = lastNNoses[1];
+    var noseDistance = Math.sqrt(Math.pow((nose.x - lastNose.x) / frameWidth, 2) + Math.pow((nose.y - lastNose.y) / frameHeight, 2));
+    lastNNosePairs.unshift({
+      a: nose,
+      b: lastNose,
+      distance: noseDistance
+    });
+    if (lastNNosePairs.length > framesNeeded - 1) lastNNosePairs.length = framesNeeded - 1;
+  }
+}
+function makeFaceDetectorPrediction(imageData) {
+  if (!detector) return null;
+  var prediction = detector.detectForVideo(imageData, performance.now());
+  var faces = prediction.detections.map(function (d) {
+    return {
+      box: convertBoundingBox(d.boundingBox),
+      keypoints: d.keypoints.map(function (k) {
+        var _a;
+        return _assign(_assign({}, k), {
+          x: k.x * imageData.width,
+          y: k.y * imageData.height,
+          name: (_a = k.label) !== null && _a !== void 0 ? _a : ''
+        });
+      })
+    };
+  });
+  return _assign(_assign({}, prediction), {
+    faces: faces
+  });
+}
+function processFaceDetectorPrediction(_a) {
+  var faces = _a.faces,
+    videoWidth = _a.videoWidth,
+    videoHeight = _a.videoHeight,
+    _b = _a.requireVerticalFaceCentering,
+    requireVerticalFaceCentering = _b === void 0 ? true : _b,
+    _c = _a.stabilityThreshold,
+    stabilityThreshold = _c === void 0 ? 0.7 : _c,
+    _d = _a.noseDistanceThreshold,
+    noseDistanceThreshold = _d === void 0 ? 0.025 : _d,
+    _e = _a.xBoundary,
+    xBoundary = _e === void 0 ? 0.01 : _e,
+    // this represents the edge that the sides of the face box should not cross -- 1% of video width
+    _f = _a.yBoundary,
+    // this represents the edge that the sides of the face box should not cross -- 1% of video width
+    yBoundary = _f === void 0 ? 0.01 : _f,
+    // this represents the edge that the top or bottom of the face box should not cross -- 1% of video height
+    _g = _a.xCentroidBoundary,
+    // this represents the edge that the top or bottom of the face box should not cross -- 1% of video height
+    xCentroidBoundary = _g === void 0 ? 0.125 : _g,
+    // this represents the edge that the centroid of the face should not cross -- 12.5% of video width
+    _h = _a.yCentroidBoundary,
+    // this represents the edge that the centroid of the face should not cross -- 12.5% of video width
+    yCentroidBoundary = _h === void 0 ? 0.125 : _h,
+    // this represents the edge that the centroid of the face should not cross -- 12.5% of video height
+    _j = _a.foreheadRatio,
+    // this represents the edge that the centroid of the face should not cross -- 12.5% of video height
+    foreheadRatio = _j === void 0 ? 0.275 : _j,
+    // we found that the bounding box ends at the brow and misses the forehead. this ratio represents how much we should extend the box to include the forehead.
+    _k = _a.noseTrackingThreshold,
+    // we found that the bounding box ends at the brow and misses the forehead. this ratio represents how much we should extend the box to include the forehead.
+    noseTrackingThreshold = _k === void 0 ? 0.2 : _k,
+    // this represents the maximum distance that the nose can be from the center of the face box -- 20% of the face box width or height
+    minCaptureBrightnessThreshold = _a.minCaptureBrightnessThreshold,
+    minCaptureRangeThreshold = _a.minCaptureRangeThreshold,
+    minCaptureVarianceThreshold = _a.minCaptureVarianceThreshold,
+    brightness = _a.brightness,
+    range = _a.range,
+    variance = _a.variance;
+  var face = faces[0];
+  var faceNotDetected = faces.length === 0;
+  var faceNotCentered = false,
+    faceLookingAway = false,
+    faceTooClose = false,
+    faceTooFar = false,
+    faceVisibilityTooLow = false;
+  var hasAnyThreshold = minCaptureBrightnessThreshold !== undefined || minCaptureRangeThreshold !== undefined || minCaptureVarianceThreshold !== undefined;
+  if (hasAnyThreshold) {
+    var tooDark = minCaptureBrightnessThreshold !== undefined && brightness !== undefined && brightness < minCaptureBrightnessThreshold;
+    var tooLowRange = minCaptureRangeThreshold !== undefined && range !== undefined && range < minCaptureRangeThreshold;
+    var tooLowVariance = minCaptureVarianceThreshold !== undefined && variance !== undefined && variance < minCaptureVarianceThreshold;
+    faceVisibilityTooLow = !!(tooDark || tooLowRange || tooLowVariance);
+  }
+  if (face && !faceVisibilityTooLow) {
+    // calculate frame centroids
+    var frameCX = videoWidth / 2;
+    var frameCY = videoHeight / 2;
+    // calculate head bounding box, with forehead extension
+    var foreheadSize = face.box.height * foreheadRatio;
+    var headXMin = face.box.xMin;
+    var headXMax = face.box.xMax;
+    var headYMin = face.box.yMin - foreheadSize;
+    var headYMax = face.box.yMax;
+    // calculate head centroids
+    var headCX = (headXMin + headXMax) / 2;
+    var headCY = (headYMin + headYMax) / 2;
+    // calculate thresholds
+    var vTX = videoWidth * xBoundary;
+    var vTY = videoHeight * yBoundary;
+    var vCTX = videoWidth * xCentroidBoundary;
+    var vCTY = videoHeight * yCentroidBoundary;
+    var faceNotCenteredHorizontally = Math.abs(frameCX - headCX) > vCTX;
+    var faceNotCenteredVertically = Math.abs(frameCY - headCY) > vCTY;
+    var faceViolatesHorizontalBoundary = headXMin < vTX || headXMax > videoWidth - vTX;
+    var faceViolatesVerticalBoundary = headYMin < vTY || headYMax > videoHeight - vTY;
+    faceNotCentered = faceViolatesHorizontalBoundary || faceViolatesVerticalBoundary || faceNotCenteredHorizontally || requireVerticalFaceCentering && faceNotCenteredVertically;
+    var isMobile = videoWidth < videoHeight;
+    var tooCloseMultiple = 1.5;
+    var tooFarMultiple = isMobile ? 6 : 7;
+    faceTooClose = face.box.width > videoWidth / tooCloseMultiple;
+    faceTooFar = face.box.width < videoWidth / tooFarMultiple;
+    var nose = face.keypoints[2];
+    var fTW = face.box.width * noseTrackingThreshold;
+    var fTH = face.box.height * noseTrackingThreshold;
+    faceLookingAway = !nose || Math.abs(headCX - nose.x) > fTW || Math.abs(headCY - nose.y) > fTH;
+  }
+  var faceInGuides = !faceNotDetected && !faceNotCentered && !faceLookingAway && !faceTooClose && !faceTooFar;
+  if (lastFaceDetectionTime > 0) {
+    trackFramesNeeded(500 / lastFaceDetectionTime);
+  }
+  var faceIsStable = false,
+    noseIsStable = false;
+  if (faceInGuides && !faceVisibilityTooLow) {
+    var framesNeeded = Math.max(Math.ceil(average(framesNeededSamples)), 5);
+    trackFace(face, framesNeeded, videoWidth, videoHeight);
+    faceIsStable = lastNFaces.length >= framesNeeded && !lastNFacePairs.some(function (pair) {
+      return pair.iou < stabilityThreshold;
+    });
+    noseIsStable = lastNNoses.length >= framesNeeded && !lastNNosePairs.some(function (pair) {
+      return pair.distance > noseDistanceThreshold;
+    });
+  }
+  var faceReady = faceInGuides && faceIsStable && noseIsStable && !faceVisibilityTooLow;
+  return {
+    face: face,
+    faceNotDetected: faceNotDetected,
+    faceNotCentered: faceNotCentered,
+    faceLookingAway: faceLookingAway,
+    faceTooClose: faceTooClose,
+    faceTooFar: faceTooFar,
+    faceReady: faceReady,
+    faceReadyAt: faceReady ? new Date() : null,
+    faceIsStable: faceIsStable,
+    noseIsStable: noseIsStable,
+    faceVisibilityTooLow: faceVisibilityTooLow
+  };
+}
+function testFaceDetectionAgainstKnownImage(detector) {
+  return new Promise(function (resolve, reject) {
+    var img = new Image();
+    img.crossOrigin = 'anonymous';
+    img.onload = function () {
+      var prediction = detector.detectForVideo(img, performance.now());
+      if (prediction.detections.length > 0) {
+        debug('face detection test result', prediction.detections);
+        resolve(void 0);
+      } else {
+        warn('face detection test failed');
+        reject(new Error('testFaceDetectionAgainstKnownImage failed to predict'));
+      }
+    };
+    img.onerror = function () {
+      return reject(new Error('testFaceDetectionAgainstKnownImage failed to load image'));
+    };
+    img.src = "".concat(DEFAULT_CDN_URL, "/head-test.jpg");
+  });
 }
-var templateObject_1$o, templateObject_2$m, templateObject_3$g;
-
-var FaceCaptureGuideContainer = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n  position: absolute;\n  z-index: 1000;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px;\n  box-sizing: border-box;\n"], ["\n  position: absolute;\n  z-index: 1000;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px;\n  box-sizing: border-box;\n"])));
-var FaceCaptureGuideInner = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n  position: relative;\n  height: 60%;\n"], ["\n  position: relative;\n  height: 60%;\n"])));
-var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
-  var _b = _a.classNames,
-    classNames = _b === void 0 ? {} : _b,
-    _c = _a.status,
-    status = _c === void 0 ? 'ready' : _c,
-    _d = _a.borderWidth,
-    borderWidth = _d === void 0 ? 5 : _d,
-    _e = _a.borderColor,
-    borderColor = _e === void 0 ? 'white' : _e,
-    _f = _a.borderOpacity,
-    borderOpacity = _f === void 0 ? 0.8 : _f;
-  return /*#__PURE__*/React__default.createElement(FaceCaptureGuideContainer, {
-    className: classNames.container
-  }, /*#__PURE__*/React__default.createElement(FaceCaptureGuideInner, null, /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMaskWithStatus, {
-    status: status,
-    borderColor: borderColor,
-    borderWidth: borderWidth,
-    borderOpacity: borderOpacity,
-    verticalAlign: "center"
-  })));
-};
-var templateObject_1$n, templateObject_2$l;
 
 function detectBrightnessAndContrast(frame, brightnessAverager) {
   var ctx = frame.getContext('2d');
@@ -12952,7 +13433,7 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
       });
     }, 3000);
   }, []);
-  var timeSinceWarmingStarted = modelWarmingStartedAt ? new Date().getTime() - modelWarmingStartedAt : 0;
+  var timeSinceWarmingStarted = modelWarmingStartedAt ? performance.now() - modelWarmingStartedAt : 0;
   var warmingProgress = timeSinceWarmingStarted / 5000.0;
   var _o = useState(false),
     overrideModelsReady = _o[0],