idmission-web-sdk 2.2.46 → 2.2.47

package/dist/sdk2.cjs.development.js

@@ -9,12 +9,10 @@ var tusJsClient = require('tus-js-client');
 var SparkMD5 = require('spark-md5');
 var useResizeObserver = require('use-resize-observer');
 var tasksVision = require('@mediapipe/tasks-vision');
-var zustand = require('zustand');
 var useDebounce = require('use-debounce');
 var reactDom = require('react-dom');
 var LanguageDetector = require('i18next-browser-languagedetector');
 var i18n = require('i18next');
-var shallow = require('zustand/react/shallow');
 var SignatureCanvas = require('react-signature-canvas');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -234,7 +232,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.2.46';
+var webSdkVersion = '2.2.47';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -803,11 +801,11 @@ function setDefaultAuthUrl(url) {
   if (!allowedAuthUrls.includes(url)) throw new Error('invalid auth url');
   exports.defaultAuthUrl = url;
 }
-var initialState$6 = {
+var initialState$5 = {
   authUrl: exports.defaultAuthUrl,
   sessionCheckState: 'READY'
 };
-var AuthStateContext = /*#__PURE__*/React.createContext(initialState$6);
+var AuthStateContext = /*#__PURE__*/React.createContext(initialState$5);
 var AuthDispatchContext = /*#__PURE__*/React.createContext(function () {});
 var reducer$4 = function reducer(state, action) {
   switch (action.type) {
@@ -839,7 +837,7 @@ function useAuthReducer(authUrl, sessionId) {
   if (authUrl === void 0) {
     authUrl = exports.defaultAuthUrl;
   }
-  var _a = React.useReducer(reducer$4, _assign(_assign({}, initialState$6), {
+  var _a = React.useReducer(reducer$4, _assign(_assign({}, initialState$5), {
       authUrl: authUrl
     })),
     state = _a[0],
@@ -1352,7 +1350,8 @@ var SubmissionProvider = function SubmissionProvider(_a) {
                 }
               };
               _e = {
-                filetype: blob.type
+                filetype: blob.type,
+                contentType: blob.type
               };
               return [4 /*yield*/, calculateMd5(blob)];
             case 3:
@@ -1919,48 +1918,6 @@ function calculateMd5(blob) {
   });
 }
 
-var visionTasksBasePath = "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.7/wasm";
-var visionRuntimePreloading = false;
-function preloadVisionRuntime() {
-  return __awaiter(this, void 0, void 0, function () {
-    function handleDownloadProgress(event) {
-      var detail = event.detail;
-      if (detail.url !== url) return;
-      progressByUseCase.visionRuntime = sumUpProgressForDependencies([url]);
-      document.dispatchEvent(new CustomEvent('idmission.preloadProgress.visionRuntime', {
-        detail: progressByUseCase.visionRuntime
-      }));
-    }
-    var url;
-    return __generator(this, function (_a) {
-      switch (_a.label) {
-        case 0:
-          if (visionRuntimePreloading) return [2 /*return*/, new Promise(function (resolve) {
-            setInterval(function () {
-              if (!visionRuntimePreloading) resolve();
-            }, 100);
-          })];
-          visionRuntimePreloading = true;
-          url = "".concat(visionTasksBasePath, "/vision_wasm_internal.wasm");
-          document.addEventListener('idmission.preloadProgress', handleDownloadProgress);
-          _a.label = 1;
-        case 1:
-          _a.trys.push([1,, 3, 4]);
-          return [4 /*yield*/, preloadDependency(url)];
-        case 2:
-          _a.sent();
-          return [3 /*break*/, 4];
-        case 3:
-          document.removeEventListener('idmission.preloadProgress', handleDownloadProgress);
-          visionRuntimePreloading = false;
-          return [7 /*endfinally*/];
-        case 4:
-          return [2 /*return*/];
-      }
-    });
-  });
-}
-
 function getFrameDimensions(frame) {
   var frameWidth = frame.width,
     frameHeight = frame.height;
@@ -1997,219 +1954,827 @@ function clearCanvas(canvas) {
 }
 var templateObject_1$G;
 
-function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
-  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 _a = face.box,
-      xMin = _a.xMin,
-      width = _a.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
-// isn't fooled by cache times, but subsequent downloads of the vision runtime still do load from the cache.
-var tinyModelCacheKey = new Date().getTime();
-var initialModelCapabilities = {
-  probeState: 'notProbed',
-  delegate: 'GPU',
-  networkTier: 'untested',
-  networkSpeed: 0,
-  networkTestTime: 0
-};
-var modelCapabilities = _assign({}, initialModelCapabilities);
-function probeModelCapabilities() {
-  return __awaiter(this, void 0, void 0, function () {
-    var error_1, error_2;
+function listAvailableCameras(facingMode_1) {
+  return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
+    var cameraEnumerationStream, videoDevices;
+    if (requestMicAccess === void 0) {
+      requestMicAccess = false;
+    }
     return __generator(this, function (_a) {
       switch (_a.label) {
         case 0:
-          if (modelCapabilities.probeState === 'probed') return [2 /*return*/];
-          if (modelCapabilities.probeState === 'probing') return [2 /*return*/, new Promise(function (resolve) {
-            setInterval(function () {
-              if (modelCapabilities.probeState === 'probed') resolve();
-            }, 100);
-          })];
-          modelCapabilities.probeState = 'probing';
-          return [4 /*yield*/, preloadVisionRuntime()];
+          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:
-          _a.sent();
-          _a.label = 2;
+          cameraEnumerationStream = _a.sent();
+          return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
         case 2:
-          _a.trys.push([2, 4, 9, 10]);
-          log('Model Probing: testing GPU capabilities...');
-          return [4 /*yield*/, loadTinyModel('GPU')];
-        case 3:
-          _a.sent();
-          log('Model Probing: GPU is capable.');
-          return [3 /*break*/, 10];
-        case 4:
-          error_1 = _a.sent();
-          warn('Model Probing: GPU delegate could not be loaded', error_1);
-          modelCapabilities.delegate = 'CPU';
-          _a.label = 5;
-        case 5:
-          _a.trys.push([5, 7,, 8]);
-          log('Model Probing: testing CPU capabilities...');
-          return [4 /*yield*/, loadTinyModel('CPU')];
-        case 6:
-          _a.sent();
-          log('Model Probing: CPU is capable.');
-          return [3 /*break*/, 8];
-        case 7:
-          error_2 = _a.sent();
-          warn('Model Probing: CPU delegate could not be loaded', error_2);
-          modelCapabilities.delegate = 'NONE';
-          return [3 /*break*/, 8];
-        case 8:
-          return [3 /*break*/, 10];
-        case 9:
-          modelCapabilities.probeState = 'probed';
-          return [7 /*endfinally*/];
-        case 10:
-          return [2 /*return*/];
+          videoDevices = _a.sent().filter(function (_a) {
+            var kind = _a.kind;
+            return kind === 'videoinput';
+          });
+          // 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*/, videoDevices];
       }
     });
   });
 }
-function loadTinyModel() {
-  return __awaiter(this, arguments, void 0, function (delegate, maxTime) {
-    var modelAssetPath, startedAt, e_1, time, speedMbps, model, _a, _b, emptyFrame;
-    if (delegate === void 0) {
-      delegate = 'GPU';
+var frontLabels = ['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 rearLabels = ['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 backUltraWideLabels = ['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 labelMatches = function labelMatches(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;
+var currentAudioStream;
+function obtainCameraAccess(stream, deviceLabel, video) {
+  releaseCameraAccess();
+  log('obtaining camera access...');
+  var _a = stream.getVideoTracks()[0].getSettings(),
+    width = _a.width,
+    height = _a.height;
+  var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
+  var isRearFacing = labelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearLabels, true), backUltraWideLabels, true), ['iphone'], false));
+  var release = function release() {
+    stream.getTracks().forEach(function (track) {
+      track.enabled = false;
+      track.stop();
+    });
+    if (video) {
+      video.pause();
+      video.srcObject = null;
+      video.src = '';
     }
-    if (maxTime === void 0) {
-      maxTime = 10000;
+  };
+  width || (width = 0);
+  height || (height = 0);
+  currentCamera = {
+    label: deviceLabel,
+    stream: stream,
+    width: width,
+    height: height,
+    isRearFacing: isRearFacing,
+    release: release
+  };
+  if (video) video.srcObject = stream;
+  return currentCamera;
+}
+function releaseCameraAccess() {
+  if (!currentCamera) return;
+  log('releasing camera access...');
+  currentCamera.release();
+  currentCamera = undefined;
+}
+function releaseMicrophoneAccess() {
+  var _a;
+  if (!currentAudioStream) return;
+  log('releasing microphone access...');
+  (_a = currentAudioStream.stop) === null || _a === void 0 ? void 0 : _a.call(currentAudioStream);
+  currentAudioStream.getAudioTracks().forEach(function (t) {
+    var _a;
+    (_a = t.stop) === null || _a === void 0 ? void 0 : _a.call(t);
+  });
+  currentAudioStream = undefined;
+}
+function usePreferredCaptureDevice(_a) {
+  var _b = _a === void 0 ? {} : _a,
+    _c = _b.requestAccessAutomatically,
+    requestAccessAutomatically = _c === void 0 ? true : _c,
+    _d = _b.preferFrontFacingCamera,
+    preferFrontFacingCamera = _d === void 0 ? false : _d,
+    _e = _b.preferContinuityCamera,
+    preferContinuityCamera = _e === void 0 ? true : _e,
+    _f = _b.requireMicrophoneAccess,
+    requireMicrophoneAccess = _f === void 0 ? false : _f,
+    _g = _b.maxVideoWidth,
+    maxVideoWidth = _g === void 0 ? 1920 : _g,
+    maxFps = _b.maxFps,
+    _h = _b.debugMode,
+    debugMode = _h === void 0 ? false : _h;
+  var videoRef = React.useRef(null);
+  var videoRefStack = React.useRef([]);
+  var cameraRef = React.useRef(null);
+  var _j = React.useState(false),
+    cameraReady = _j[0],
+    setCameraReady = _j[1];
+  var _k = React.useState(false),
+    microphoneReady = _k[0],
+    setMicrophoneReady = _k[1];
+  var _l = React.useState(null),
+    videoDevice = _l[0],
+    setVideoDevice = _l[1];
+  var _m = React.useState(null),
+    audioStream = _m[0],
+    setAudioStream = _m[1];
+  var _o = React.useState(false),
+    videoLoaded = _o[0],
+    setVideoLoaded = _o[1];
+  var _p = React.useState(false),
+    iphoneContinuityCameraAvailable = _p[0],
+    setIphoneContinuityCameraAvailable = _p[1];
+  var _q = React.useState(preferContinuityCamera),
+    iphoneContinuityCameraAllowed = _q[0],
+    setIphoneContinuityCameraAllowed = _q[1];
+  var _r = React.useState(false),
+    iphoneContinuityCameraDenied = _r[0],
+    setIphoneContinuityCameraDenied = _r[1];
+  var _s = React.useState(false),
+    cameraAccessDenied = _s[0],
+    setCameraAccessDenied = _s[1];
+  var _t = React.useState(false),
+    microphoneAccessDenied = _t[0],
+    setMicrophoneAccessDenied = _t[1];
+  var videoRefElement = videoRef.current;
+  React.useEffect(function pushVideoRefToStackWhenChanged() {
+    // proceed if the video element being mounted is not already at the top of the videoRefStack.
+    var topOfStack = videoRefStack.current.slice(-1)[0];
+    if (videoRefElement && videoRefElement !== topOfStack) {
+      log('adding video to stack', videoRefElement);
+      videoRefStack.current.push(videoRefElement);
+    }
+  }, [videoRefElement]);
+  var onVideoUnmounted = React.useCallback(function (videoElement) {
+    log('removing video from stack', videoElement);
+    videoRefStack.current = videoRefStack.current.filter(function (v) {
+      return v !== videoElement;
+    });
+    videoRef.current = videoRefStack.current.slice(-1)[0]; // top of stack.
+    log('new videoRef is', videoRef.current);
+  }, []);
+  React.useEffect(function resetCameraOnContinuityPreferenceChanged() {
+    if (debugMode) {
+      log('iphone continuity camera allowed changed', iphoneContinuityCameraAllowed);
     }
-    return __generator(this, function (_c) {
-      switch (_c.label) {
-        case 0:
-          modelAssetPath = "".concat(defaultImageSegmenterModelPath, "?_=").concat(tinyModelCacheKey);
-          startedAt = new Date();
-          _c.label = 1;
+    releaseCameraAccess();
+    cameraRef.current = null;
+    setVideoLoaded(false);
+  }, [debugMode, iphoneContinuityCameraAllowed]);
+  // NOTE: the bound callback function here is called requestCameraAccess, because
+  // it initiates the useEffect chain that results in camera access being requested
+  // (requestCameraAccessAutomatically -> chooseFromAvailableCameras -> accessChosenCamera).
+  //
+  // We chose to title the inner function "chooseFromAvailableCameras" because
+  // that's all it literally does -- the available cameras are enumerated, and then
+  // the result is parsed to decide which one we like best, which is then passed to
+  // setVideoDevice, which causes accessChosenCamera to trigger.
+  //
+  // I am not a huge fan of getUserMedia's design -- you need to call it twice in order
+  // to select the "best" camera for your application's purposes.
+  var requestCameraAccess = React.useCallback(function chooseFromAvailableCameras() {
+    return __awaiter(this, void 0, void 0, function () {
+      var availableCameras, selectedCamera, platform_1, iphoneContinuityCamera, e_1;
+      var _a, _b;
+      return __generator(this, function (_c) {
+        switch (_c.label) {
+          case 0:
+            setCameraReady(false);
+            setCameraAccessDenied(false);
+            _c.label = 1;
+          case 1:
+            _c.trys.push([1, 3,, 4]);
+            return [4 /*yield*/, listAvailableCameras()];
+          case 2:
+            availableCameras = _c.sent();
+            selectedCamera = void 0;
+            if (debugMode) {
+              log('availableCameras', availableCameras);
+            }
+            platform_1 = getPlatform();
+            if (debugMode) {
+              log('platformDetails', platform_1);
+            }
+            if (!iphoneContinuityCameraDenied && (!(platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) || platform_1.os.family === 'OS X')) {
+              iphoneContinuityCamera = availableCameras.find(function (deviceInfo) {
+                return labelMatches(deviceInfo, 'iphone');
+              });
+              setIphoneContinuityCameraAvailable(!!iphoneContinuityCamera);
+              if (iphoneContinuityCamera && iphoneContinuityCameraAllowed) {
+                selectedCamera = iphoneContinuityCamera;
+              }
+            } else if (((_a = platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) === null || _a === void 0 ? void 0 : _a.family) === 'Android' || availableCameras.every(function (c) {
+              return c.label.startsWith('camera2 ');
+            })) {
+              availableCameras = availableCameras.sort(function (a, b) {
+                return a.label.toLowerCase().localeCompare(b.label.toLowerCase());
+              });
+              if (debugMode) {
+                log('cameras have been sorted', availableCameras);
+              }
+            }
+            if (preferFrontFacingCamera) {
+              selectedCamera = availableCameras.find(function (deviceInfo) {
+                return labelMatches(deviceInfo, frontLabels);
+              });
+            }
+            selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
+              return labelMatches(deviceInfo, 'backtriplecamera');
+            }));
+            selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
+              return labelMatches(deviceInfo, 'backdualcamera');
+            }));
+            selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
+              return labelMatches(deviceInfo, rearLabels) && !labelMatches(deviceInfo, backUltraWideLabels);
+            }));
+            selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
+              return labelMatches(deviceInfo, rearLabels);
+            }));
+            // on iOS, the front facing camera always is at the first position in the list, so we skip it if all else fails.
+            if (!preferFrontFacingCamera && ((_b = platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) === null || _b === void 0 ? void 0 : _b.family) === 'iOS' && availableCameras.length > 0) {
+              selectedCamera || (selectedCamera = availableCameras[1]);
+            }
+            selectedCamera || (selectedCamera = availableCameras[0]);
+            if (debugMode) log('selectedCamera', selectedCamera);
+            setVideoDevice(selectedCamera);
+            return [3 /*break*/, 4];
+          case 3:
+            e_1 = _c.sent();
+            if (e_1.name === 'NotAllowedError') {
+              error('camera access has been blocked by the user', e_1);
+              setCameraAccessDenied(true);
+            } else {
+              error('camera access encountered some other error', e_1);
+              throw e_1;
+            }
+            return [3 /*break*/, 4];
+          case 4:
+            return [2 /*return*/];
+        }
+      });
+    });
+  }, [debugMode, iphoneContinuityCameraAllowed, iphoneContinuityCameraDenied, preferFrontFacingCamera]);
+  React.useEffect(function requestCameraAccessAutomatically() {
+    if (requestAccessAutomatically && !cameraAccessDenied) {
+      requestCameraAccess()["catch"](error);
+    }
+  }, [cameraAccessDenied, requestAccessAutomatically, requestCameraAccess]);
+  React.useEffect(function accessChosenCamera() {
+    var _this = this;
+    var _a;
+    if (!videoDevice) return;
+    var cleanup = function cleanup() {
+      releaseCameraAccess();
+      cameraRef.current = null;
+      setVideoLoaded(false);
+    };
+    if (!((_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.getUserMedia)) return cleanup;
+    (function () {
+      return __awaiter(_this, void 0, void 0, function () {
+        var constraints, stream, e_2, handleStreamEnded;
+        var _a;
+        return __generator(this, function (_b) {
+          switch (_b.label) {
+            case 0:
+              constraints = {
+                audio: false,
+                video: {
+                  deviceId: {
+                    exact: videoDevice.deviceId
+                  },
+                  width: {
+                    ideal: maxVideoWidth
+                  },
+                  aspectRatio: 1.777777778,
+                  frameRate: {}
+                }
+              };
+              if (maxFps) {
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-ignore
+                constraints.video.frameRate = {
+                  max: maxFps
+                };
+              }
+              stream = null;
+              _b.label = 1;
+            case 1:
+              _b.trys.push([1, 3,, 4]);
+              return [4 /*yield*/, navigator.mediaDevices.getUserMedia(constraints)];
+            case 2:
+              stream = _b.sent();
+              return [3 /*break*/, 4];
+            case 3:
+              e_2 = _b.sent();
+              if (e_2.name === 'NotAllowedError') {
+                if (iphoneContinuityCameraAllowed) {
+                  setIphoneContinuityCameraAvailable(false);
+                  setIphoneContinuityCameraDenied(true);
+                } else {
+                  setCameraAccessDenied(true);
+                }
+                return [2 /*return*/];
+              }
+              return [3 /*break*/, 4];
+            case 4:
+              if (!!stream) return [3 /*break*/, 8];
+              _b.label = 5;
+            case 5:
+              _b.trys.push([5, 7,, 8]);
+              return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
+                audio: false,
+                video: true
+              })];
+            case 6:
+              stream = _b.sent();
+              log('opened stream with no width and height constraints');
+              return [3 /*break*/, 8];
+            case 7:
+              _b.sent();
+              log('cannot open stream at all');
+              return [3 /*break*/, 8];
+            case 8:
+              if (!stream) {
+                throw new Error('failed to open camera');
+              }
+              handleStreamEnded = function handleStreamEnded() {
+                if (iphoneContinuityCameraAvailable && iphoneContinuityCameraAllowed) {
+                  log('someone unplugged the continuity camera');
+                  releaseCameraAccess();
+                  cameraRef.current = null;
+                  setIphoneContinuityCameraAvailable(false);
+                  setIphoneContinuityCameraDenied(true);
+                  setVideoDevice(null);
+                } else {
+                  log('someone unplugged the webcam');
+                  releaseCameraAccess();
+                  cameraRef.current = null;
+                  setVideoLoaded(false);
+                  setCameraAccessDenied(true);
+                }
+              };
+              (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('ended', handleStreamEnded);
+              stream.getVideoTracks().forEach(function (track) {
+                track.onended = handleStreamEnded;
+              });
+              cameraRef.current = obtainCameraAccess(stream, videoDevice.label, videoRef.current);
+              return [2 /*return*/];
+          }
+        });
+      });
+    })();
+    return cleanup;
+  }, [iphoneContinuityCameraAllowed, iphoneContinuityCameraAvailable, maxFps, maxVideoWidth, videoDevice]);
+  React.useEffect(function triggerCameraReady() {
+    // TODO: in the future let's evaluate whether we can simplify this to just
+    // setCameraReady(!!videoDevice && videoLoaded) -- we are wondering whether
+    // we somehow depend on this being set twice.
+    setCameraReady(false);
+    if (videoDevice && videoLoaded) {
+      setCameraReady(videoDevice && videoLoaded);
+    }
+  }, [videoLoaded, videoDevice]);
+  var requestMicrophoneAccess = React.useCallback(function _requestMicrophoneAccess() {
+    return __awaiter(this, void 0, void 0, function () {
+      var stream;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            setMicrophoneReady(false);
+            setMicrophoneAccessDenied(false);
+            _a.label = 1;
+          case 1:
+            _a.trys.push([1, 3,, 4]);
+            return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
+              audio: true,
+              video: false
+            })];
+          case 2:
+            stream = _a.sent();
+            currentAudioStream = stream;
+            setAudioStream(stream);
+            setMicrophoneReady(true);
+            stream.getAudioTracks().forEach(function (track) {
+              track.onended = function () {
+                setMicrophoneAccessDenied(true);
+              };
+            });
+            return [3 /*break*/, 4];
+          case 3:
+            _a.sent();
+            setMicrophoneAccessDenied(true);
+            return [3 /*break*/, 4];
+          case 4:
+            return [2 /*return*/];
+        }
+      });
+    });
+  }, []);
+  React.useEffect(function requestMicrophoneAccessIfNeeded() {
+    if (!requireMicrophoneAccess || microphoneAccessDenied) return;
+    requestMicrophoneAccess()["catch"](error);
+    return function () {
+      releaseMicrophoneAccess();
+      setAudioStream(null);
+      setMicrophoneReady(false);
+    };
+  }, [microphoneAccessDenied, requestMicrophoneAccess, requireMicrophoneAccess]);
+  var takePhoto = React.useCallback(function _takePhoto() {
+    return __awaiter(this, void 0, void 0, function () {
+      var canvas;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            if (!cameraRef.current) return [2 /*return*/, null];
+            if (!(typeof ImageCapture !== 'undefined')) return [3 /*break*/, 2];
+            return [4 /*yield*/, new ImageCapture(cameraRef.current.stream.getTracks()[0]).takePhoto()];
+          case 1:
+            return [2 /*return*/, _a.sent()];
+          case 2:
+            if (!videoRef.current) return [2 /*return*/, null];
+            canvas = document.createElement('canvas');
+            drawToCanvas(canvas, videoRef.current);
+            return [2 /*return*/, new Promise(function (resolve) {
+              return canvas.toBlob(resolve);
+            })];
+        }
+      });
+    });
+  }, []);
+  return React.useMemo(function () {
+    return {
+      videoRef: videoRef,
+      videoDevice: videoDevice,
+      videoLoaded: videoLoaded,
+      setVideoLoaded: setVideoLoaded,
+      onVideoUnmounted: onVideoUnmounted,
+      cameraRef: cameraRef,
+      cameraReady: cameraReady,
+      cameraAccessDenied: cameraAccessDenied,
+      requestCameraAccess: requestCameraAccess,
+      releaseCameraAccess: releaseCameraAccess,
+      iphoneContinuityCameraAvailable: iphoneContinuityCameraAvailable,
+      iphoneContinuityCameraAllowed: iphoneContinuityCameraAllowed,
+      setIphoneContinuityCameraAllowed: setIphoneContinuityCameraAllowed,
+      takePhoto: takePhoto,
+      audioStream: audioStream,
+      microphoneReady: microphoneReady,
+      microphoneAccessDenied: microphoneAccessDenied,
+      requestMicrophoneAccess: requestMicrophoneAccess
+    };
+  }, [audioStream, cameraAccessDenied, cameraReady, iphoneContinuityCameraAllowed, iphoneContinuityCameraAvailable, microphoneAccessDenied, microphoneReady, onVideoUnmounted, requestCameraAccess, requestMicrophoneAccess, takePhoto, videoDevice, videoLoaded]);
+}
+
+var CameraStateContext = /*#__PURE__*/React.createContext({
+  videoRef: {
+    current: null
+  },
+  videoDevice: null,
+  videoLoaded: false,
+  cameraRef: {
+    current: null
+  },
+  cameraReady: false,
+  cameraAccessDenied: false,
+  requestCameraAccess: function requestCameraAccess() {
+    return null;
+  },
+  releaseCameraAccess: function releaseCameraAccess() {
+    return null;
+  },
+  iphoneContinuityCameraAvailable: false,
+  iphoneContinuityCameraAllowed: true,
+  setIphoneContinuityCameraAllowed: function setIphoneContinuityCameraAllowed() {
+    return null;
+  },
+  takePhoto: function takePhoto() {
+    return Promise.resolve(null);
+  },
+  setVideoLoaded: function setVideoLoaded() {
+    return null;
+  },
+  onVideoUnmounted: function onVideoUnmounted() {
+    return null;
+  },
+  audioStream: null,
+  microphoneReady: false,
+  microphoneAccessDenied: false,
+  requestMicrophoneAccess: function requestMicrophoneAccess() {
+    return null;
+  }
+});
+var CameraProvider = function CameraProvider(_a) {
+  var children = _a.children,
+    _b = _a.requestAccessAutomatically,
+    requestAccessAutomatically = _b === void 0 ? true : _b,
+    _c = _a.preferFrontFacingCamera,
+    preferFrontFacingCamera = _c === void 0 ? false : _c,
+    _d = _a.preferContinuityCamera,
+    preferContinuityCamera = _d === void 0 ? true : _d,
+    _e = _a.requireMicrophoneAccess,
+    requireMicrophoneAccess = _e === void 0 ? false : _e,
+    _f = _a.maxVideoWidth,
+    maxVideoWidth = _f === void 0 ? 1920 : _f,
+    maxFps = _a.maxFps,
+    onCameraAccessDenied = _a.onCameraAccessDenied,
+    onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
+    _g = _a.debugMode,
+    debugMode = _g === void 0 ? false : _g;
+  var captureDevice = usePreferredCaptureDevice({
+    requestAccessAutomatically: requestAccessAutomatically,
+    preferFrontFacingCamera: preferFrontFacingCamera,
+    preferContinuityCamera: preferContinuityCamera,
+    requireMicrophoneAccess: requireMicrophoneAccess,
+    maxVideoWidth: maxVideoWidth,
+    maxFps: maxFps,
+    debugMode: debugMode
+  });
+  React.useEffect(function () {
+    if (captureDevice.cameraAccessDenied) onCameraAccessDenied === null || onCameraAccessDenied === void 0 ? void 0 : onCameraAccessDenied();
+  }, [captureDevice.cameraAccessDenied, onCameraAccessDenied]);
+  React.useEffect(function () {
+    if (captureDevice.microphoneAccessDenied) onMicrophoneAccessDenied === null || onMicrophoneAccessDenied === void 0 ? void 0 : onMicrophoneAccessDenied();
+  }, [captureDevice.microphoneAccessDenied, onMicrophoneAccessDenied]);
+  var releaseCameraAccess = captureDevice.releaseCameraAccess;
+  React.useEffect(function () {
+    return function () {
+      releaseCameraAccess();
+    };
+  }, [releaseCameraAccess]);
+  return /*#__PURE__*/React__namespace.default.createElement(CameraStateContext.Provider, {
+    value: captureDevice
+  }, children);
+};
+
+var visionTasksBasePath = "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.7/wasm";
+var visionRuntimePreloading = false;
+function preloadVisionRuntime() {
+  return __awaiter(this, void 0, void 0, function () {
+    function handleDownloadProgress(event) {
+      var detail = event.detail;
+      if (detail.url !== url) return;
+      progressByUseCase.visionRuntime = sumUpProgressForDependencies([url]);
+      document.dispatchEvent(new CustomEvent('idmission.preloadProgress.visionRuntime', {
+        detail: progressByUseCase.visionRuntime
+      }));
+    }
+    var url;
+    return __generator(this, function (_a) {
+      switch (_a.label) {
+        case 0:
+          if (visionRuntimePreloading) return [2 /*return*/, new Promise(function (resolve) {
+            setInterval(function () {
+              if (!visionRuntimePreloading) resolve();
+            }, 100);
+          })];
+          visionRuntimePreloading = true;
+          url = "".concat(visionTasksBasePath, "/vision_wasm_internal.wasm");
+          document.addEventListener('idmission.preloadProgress', handleDownloadProgress);
+          _a.label = 1;
         case 1:
-          _c.trys.push([1, 3,, 4]);
-          return [4 /*yield*/, Promise.race([preloadDependency(modelAssetPath), giveUpAfter(maxTime)])];
+          _a.trys.push([1,, 3, 4]);
+          return [4 /*yield*/, preloadDependency(url)];
         case 2:
-          _c.sent();
+          _a.sent();
           return [3 /*break*/, 4];
         case 3:
-          e_1 = _c.sent();
-          error('speed test failed', e_1);
-          modelCapabilities.networkTier = 'unusable';
-          return [2 /*return*/];
+          document.removeEventListener('idmission.preloadProgress', handleDownloadProgress);
+          visionRuntimePreloading = false;
+          return [7 /*endfinally*/];
         case 4:
-          time = (new Date().getTime() - startedAt.getTime()) / 1000.0;
-          modelCapabilities.networkTestTime || (modelCapabilities.networkTestTime = time);
-          modelCapabilities.networkSpeed || (modelCapabilities.networkSpeed = imageSegmenterModelSizeInBytes / time);
-          modelCapabilities.networkTier = time < 0.5 ? 'fast' : time < 2 ? 'medium' : 'slow';
-          speedMbps = modelCapabilities.networkSpeed / 1024 / 1024;
-          log('Model Probing: network speed', speedMbps.toFixed(3), 'Mbps');
-          log('Model Probing: network test took', time);
-          log('Model Probing: network tier', modelCapabilities.networkTier);
-          _b = (_a = tasksVision.ImageSegmenter).createFromOptions;
-          return [4 /*yield*/, tasksVision.FilesetResolver.forVisionTasks(visionTasksBasePath)];
-        case 5:
-          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
-            baseOptions: {
-              modelAssetPath: modelAssetPath,
-              delegate: delegate
-            }
-          }])];
-        case 6:
-          model = _c.sent();
-          emptyFrame = document.createElement('canvas');
-          model.segment(emptyFrame);
-          emptyFrame.remove();
           return [2 /*return*/];
       }
     });
   });
 }
-function giveUpAfter(maxTime) {
-  return new Promise(function (_resolve, reject) {
-    setTimeout(function () {
-      reject(new Error('gave up after reaching maximum time allowed'));
-    }, maxTime);
-  });
-}
 
-function convertBoundingBox(box) {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  return {
-    xMin: (_a = box === null || box === void 0 ? void 0 : box.originX) !== null && _a !== void 0 ? _a : 0,
-    xMax: ((_b = box === null || box === void 0 ? void 0 : box.originX) !== null && _b !== void 0 ? _b : 0) + ((_c = box === null || box === void 0 ? void 0 : box.width) !== null && _c !== void 0 ? _c : 0),
-    yMin: (_d = box === null || box === void 0 ? void 0 : box.originY) !== null && _d !== void 0 ? _d : 0,
-    yMax: ((_e = box === null || box === void 0 ? void 0 : box.originY) !== null && _e !== void 0 ? _e : 0) + ((_f = box === null || box === void 0 ? void 0 : box.height) !== null && _f !== void 0 ? _f : 0),
-    width: (_g = box === null || box === void 0 ? void 0 : box.width) !== null && _g !== void 0 ? _g : 0,
-    height: (_h = box === null || box === void 0 ? void 0 : box.height) !== null && _h !== void 0 ? _h : 0
-  };
-}
-function waitForVideoReady(videoRef, checkEveryMs) {
-  if (checkEveryMs === void 0) {
-    checkEveryMs = 100;
+function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
+  if (quality === void 0) {
+    quality = 0.92;
   }
-  return new Promise(function (resolve) {
-    var _a, _b, _c;
-    if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) return resolve();
-    (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.load();
-    var interval = setInterval(function () {
-      var _a, _b;
-      if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) {
-        clearInterval(interval);
-        resolve();
-      }
-    }, checkEveryMs);
-  });
-}
-function calculateIoU(boxA, boxB) {
-  var xA = Math.max(boxA.xMin, boxB.xMin);
-  var yA = Math.max(boxA.yMin, boxB.yMin);
-  var xB = Math.min(boxA.xMax, boxB.xMax);
-  var yB = Math.min(boxA.yMax, boxB.yMax);
+  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 _a = face.box,
+      xMin = _a.xMin,
+      width = _a.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
+// isn't fooled by cache times, but subsequent downloads of the vision runtime still do load from the cache.
+var tinyModelCacheKey = new Date().getTime();
+var initialModelCapabilities = {
+  probeState: 'notProbed',
+  delegate: 'GPU',
+  networkTier: 'untested',
+  networkSpeed: 0,
+  networkTestTime: 0
+};
+var modelCapabilities = _assign({}, initialModelCapabilities);
+function probeModelCapabilities() {
+  return __awaiter(this, void 0, void 0, function () {
+    var error_1, error_2;
+    return __generator(this, function (_a) {
+      switch (_a.label) {
+        case 0:
+          if (modelCapabilities.probeState === 'probed') return [2 /*return*/];
+          if (modelCapabilities.probeState === 'probing') return [2 /*return*/, new Promise(function (resolve) {
+            setInterval(function () {
+              if (modelCapabilities.probeState === 'probed') resolve();
+            }, 100);
+          })];
+          modelCapabilities.probeState = 'probing';
+          return [4 /*yield*/, preloadVisionRuntime()];
+        case 1:
+          _a.sent();
+          _a.label = 2;
+        case 2:
+          _a.trys.push([2, 4, 9, 10]);
+          log('Model Probing: testing GPU capabilities...');
+          return [4 /*yield*/, loadTinyModel('GPU')];
+        case 3:
+          _a.sent();
+          log('Model Probing: GPU is capable.');
+          return [3 /*break*/, 10];
+        case 4:
+          error_1 = _a.sent();
+          warn('Model Probing: GPU delegate could not be loaded', error_1);
+          modelCapabilities.delegate = 'CPU';
+          _a.label = 5;
+        case 5:
+          _a.trys.push([5, 7,, 8]);
+          log('Model Probing: testing CPU capabilities...');
+          return [4 /*yield*/, loadTinyModel('CPU')];
+        case 6:
+          _a.sent();
+          log('Model Probing: CPU is capable.');
+          return [3 /*break*/, 8];
+        case 7:
+          error_2 = _a.sent();
+          warn('Model Probing: CPU delegate could not be loaded', error_2);
+          modelCapabilities.delegate = 'NONE';
+          return [3 /*break*/, 8];
+        case 8:
+          return [3 /*break*/, 10];
+        case 9:
+          modelCapabilities.probeState = 'probed';
+          return [7 /*endfinally*/];
+        case 10:
+          return [2 /*return*/];
+      }
+    });
+  });
+}
+function loadTinyModel() {
+  return __awaiter(this, arguments, void 0, function (delegate, maxTime) {
+    var modelAssetPath, startedAt, e_1, time, speedMbps, model, _a, _b, emptyFrame;
+    if (delegate === void 0) {
+      delegate = 'GPU';
+    }
+    if (maxTime === void 0) {
+      maxTime = 10000;
+    }
+    return __generator(this, function (_c) {
+      switch (_c.label) {
+        case 0:
+          modelAssetPath = "".concat(defaultImageSegmenterModelPath, "?_=").concat(tinyModelCacheKey);
+          startedAt = new Date();
+          _c.label = 1;
+        case 1:
+          _c.trys.push([1, 3,, 4]);
+          return [4 /*yield*/, Promise.race([preloadDependency(modelAssetPath), giveUpAfter(maxTime)])];
+        case 2:
+          _c.sent();
+          return [3 /*break*/, 4];
+        case 3:
+          e_1 = _c.sent();
+          error('speed test failed', e_1);
+          modelCapabilities.networkTier = 'unusable';
+          return [2 /*return*/];
+        case 4:
+          time = (new Date().getTime() - startedAt.getTime()) / 1000.0;
+          modelCapabilities.networkTestTime || (modelCapabilities.networkTestTime = time);
+          modelCapabilities.networkSpeed || (modelCapabilities.networkSpeed = imageSegmenterModelSizeInBytes / time);
+          modelCapabilities.networkTier = time < 0.5 ? 'fast' : time < 2 ? 'medium' : 'slow';
+          speedMbps = modelCapabilities.networkSpeed / 1024 / 1024;
+          log('Model Probing: network speed', speedMbps.toFixed(3), 'Mbps');
+          log('Model Probing: network test took', time);
+          log('Model Probing: network tier', modelCapabilities.networkTier);
+          _b = (_a = tasksVision.ImageSegmenter).createFromOptions;
+          return [4 /*yield*/, tasksVision.FilesetResolver.forVisionTasks(visionTasksBasePath)];
+        case 5:
+          return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
+            baseOptions: {
+              modelAssetPath: modelAssetPath,
+              delegate: delegate
+            }
+          }])];
+        case 6:
+          model = _c.sent();
+          emptyFrame = document.createElement('canvas');
+          model.segment(emptyFrame);
+          emptyFrame.remove();
+          return [2 /*return*/];
+      }
+    });
+  });
+}
+function giveUpAfter(maxTime) {
+  return new Promise(function (_resolve, reject) {
+    setTimeout(function () {
+      reject(new Error('gave up after reaching maximum time allowed'));
+    }, maxTime);
+  });
+}
+
+function convertBoundingBox(box) {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  return {
+    xMin: (_a = box === null || box === void 0 ? void 0 : box.originX) !== null && _a !== void 0 ? _a : 0,
+    xMax: ((_b = box === null || box === void 0 ? void 0 : box.originX) !== null && _b !== void 0 ? _b : 0) + ((_c = box === null || box === void 0 ? void 0 : box.width) !== null && _c !== void 0 ? _c : 0),
+    yMin: (_d = box === null || box === void 0 ? void 0 : box.originY) !== null && _d !== void 0 ? _d : 0,
+    yMax: ((_e = box === null || box === void 0 ? void 0 : box.originY) !== null && _e !== void 0 ? _e : 0) + ((_f = box === null || box === void 0 ? void 0 : box.height) !== null && _f !== void 0 ? _f : 0),
+    width: (_g = box === null || box === void 0 ? void 0 : box.width) !== null && _g !== void 0 ? _g : 0,
+    height: (_h = box === null || box === void 0 ? void 0 : box.height) !== null && _h !== void 0 ? _h : 0
+  };
+}
+function waitForVideoReady(videoRef, checkEveryMs) {
+  if (checkEveryMs === void 0) {
+    checkEveryMs = 100;
+  }
+  return new Promise(function (resolve) {
+    var _a, _b, _c;
+    if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) return resolve();
+    (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.load();
+    var interval = setInterval(function () {
+      var _a, _b;
+      if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) {
+        clearInterval(interval);
+        resolve();
+      }
+    }, checkEveryMs);
+  });
+}
+function calculateIoU(boxA, boxB) {
+  var xA = Math.max(boxA.xMin, boxB.xMin);
+  var yA = Math.max(boxA.yMin, boxB.yMin);
+  var xB = Math.min(boxA.xMax, boxB.xMax);
+  var yB = Math.min(boxA.yMax, boxB.yMax);
   var intersectWidth = Math.max(0, xB - xA);
   var intersectHeight = Math.max(0, yB - yA);
   var intersectionArea = intersectWidth * intersectHeight;
@@ -2300,8 +2865,7 @@ function useLoadFocusModel(_a) {
     modelPath = _b === void 0 ? defaultFocusModelPath : _b,
     _c = _a.modelLoadTimeoutMs,
     modelLoadTimeoutMs = _c === void 0 ? defaultFocusModelLoadTimeoutMs : _c,
-    onModelError = _a.onModelError,
-    videoRef = _a.videoRef;
+    onModelError = _a.onModelError;
   var _d = React.useState(false),
     ready = _d[0],
     setReady = _d[1];
@@ -2311,6 +2875,7 @@ function useLoadFocusModel(_a) {
   var _f = React.useState(null),
     modelError = _f[0],
     setModelError = _f[1];
+  var videoRef = React.useContext(CameraStateContext).videoRef;
   React.useEffect(function loadModel() {
     var _this = this;
     setReady(false);
@@ -2448,8 +3013,7 @@ function closeFaceDetector() {
 function useLoadFaceDetector(_a) {
   var onModelError = _a.onModelError,
     _b = _a.modelLoadTimeoutMs,
-    modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b,
-    videoRef = _a.videoRef;
+    modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b;
   var _c = React.useState(false),
     ready = _c[0],
     setReady = _c[1];
@@ -2459,6 +3023,7 @@ function useLoadFaceDetector(_a) {
   var _e = React.useState(null),
     modelError = _e[0],
     setModelError = _e[1];
+  var videoRef = React.useContext(CameraStateContext).videoRef;
   React.useEffect(function loadModel() {
     var _this = this;
     setReady(false);
@@ -2939,8 +3504,7 @@ function useLoadDocumentDetector(_a) {
     modelLoadTimeoutMs = _c === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _c,
     _d = _a.scoreThreshold,
     scoreThreshold = _d === void 0 ? defaultDocumentDetectionScoreThreshold : _d,
-    onModelError = _a.onModelError,
-    videoRef = _a.videoRef;
+    onModelError = _a.onModelError;
   var _e = React.useState(false),
     ready = _e[0],
     setReady = _e[1];
@@ -2950,6 +3514,7 @@ function useLoadDocumentDetector(_a) {
   var _g = React.useState(null),
     modelError = _g[0],
     setModelError = _g[1];
+  var videoRef = React.useContext(CameraStateContext).videoRef;
   React.useEffect(function loadModel() {
     var _this = this;
     setReady(false);
@@ -3170,582 +3735,92 @@ function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
     passportDetectionThresholdMet: passportDetectionThresholdMet,
     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 useFrameLoop(fn, _a) {
-  var _b = _a.throttleMs,
-    throttleMs = _b === void 0 ? 0 : _b,
-    _c = _a.autoStart,
-    autoStart = _c === void 0 ? false : _c;
-  var _d = React.useState(false),
-    running = _d[0],
-    setRunning = _d[1];
-  var startedAtRef = React.useRef(null);
-  var loopId = React.useRef(0);
-  var frameId = React.useRef(0);
-  React.useEffect(function runFrameLoop() {
-    if (!running) return;
-    var timer;
-    var currentLoopId = loopId.current;
-    function renderPrediction() {
-      return __awaiter(this, void 0, void 0, function () {
-        var start, timeRunning, took, amountToThrottle;
-        var _a, _b;
-        return __generator(this, function (_c) {
-          switch (_c.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:
-              _c.sent();
-              took = new Date().getTime() - start;
-              amountToThrottle = Math.max((throttleMs !== null && throttleMs !== void 0 ? throttleMs : 0) - took, 0);
-              timer = setTimeout(function () {
-                frameId.current = requestAnimationFrame(renderPrediction);
-              }, amountToThrottle);
-              return [2 /*return*/];
-          }
-        });
-      });
-    }
-    renderPrediction().then();
-    return function () {
-      loopId.current += 1;
-      frameId.current && cancelAnimationFrame(frameId.current);
-      timer && clearTimeout(timer);
-    };
-  }, [fn, running, throttleMs]);
-  var start = React.useCallback(function () {
-    startedAtRef.current = new Date();
-    setRunning(true);
-  }, []);
-  var stop = React.useCallback(function () {
-    loopId.current += 1; // force the loop to stop immediately.
-    setRunning(false);
-    startedAtRef.current = null;
-  }, []);
-  React.useEffect(function startAutomatically() {
-    if (autoStart) start();
-    return function () {
-      stop();
-    };
-  }, [autoStart, start, stop]);
-  return {
-    start: start,
-    stop: stop
-  };
-}
-
-function listAvailableCameras(facingMode_1) {
-  return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
-    var cameraEnumerationStream, videoDevices;
-    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:
-          videoDevices = _a.sent().filter(function (_a) {
-            var kind = _a.kind;
-            return kind === 'videoinput';
-          });
-          // 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*/, videoDevices];
-      }
-    });
-  });
-}
-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 = '';
-    }
-  };
-  width || (width = 0);
-  height || (height = 0);
-  currentCamera = {
-    label: deviceLabel,
-    stream: stream,
-    width: width,
-    height: height,
-    isRearFacing: isRearFacing,
-    release: release
-  };
-  log('camera access granted');
-  if (video) video.srcObject = stream;
-  log('video source initialized');
-  return currentCamera;
-}
-function releaseCameraAccess() {
-  if (!currentCamera) return;
-  log('releasing camera access...');
-  currentCamera.release();
-  currentCamera = undefined;
-}
-
-var initialState$5 = {
-  videoRef: {
-    current: null
-  },
-  videoLoaded: false,
-  videoStream: null,
-  videoDevice: null,
-  isRearFacing: false,
-  camera: null,
-  cameraReady: false,
-  cameraAccessDenied: false,
-  iphoneContinuityCameraAvailable: false,
-  iphoneContinuityCameraDenied: false,
-  preferIphoneContinuityCamera: true,
-  audioStream: null,
-  microphoneReady: false,
-  microphoneAccessDenied: false
-};
-var createCameraStore = function createCameraStore(config) {
-  var store = zustand.createStore(function (set, get) {
-    return _assign(_assign(_assign({}, initialState$5), config), {
-      reset: function reset() {
-        return set(_assign(_assign({}, initialState$5), config));
-      },
-      setConfig: function setConfig(config) {
-        return set(config);
-      },
-      onVideoMounted: function onVideoMounted() {
-        return set({
-          videoLoaded: true
-        });
-      },
-      setIphoneContinuityCameraAllowed: function setIphoneContinuityCameraAllowed(value) {
-        return set({
-          preferIphoneContinuityCamera: value
-        });
-      },
-      requestCameraAccess: function requestCameraAccess() {
-        return __awaiter(this, void 0, void 0, function () {
-          var _a, videoRef, releaseCameraAccess, preferFrontFacingCamera, preferIphoneContinuityCamera, iphoneContinuityCameraDenied, availableCameras, selectedCamera, platform_1, iphoneContinuityCamera, constraints, stream_1, e_1, handleStreamEnded_1, videoTrack_1, camera_1, e_3;
-          var _b, _c, _d;
-          return __generator(this, function (_e) {
-            switch (_e.label) {
-              case 0:
-                _a = get(), videoRef = _a.videoRef, releaseCameraAccess = _a.releaseCameraAccess, preferFrontFacingCamera = _a.preferFrontFacingCamera, preferIphoneContinuityCamera = _a.preferIphoneContinuityCamera, iphoneContinuityCameraDenied = _a.iphoneContinuityCameraDenied;
-                releaseCameraAccess();
-                _e.label = 1;
-              case 1:
-                _e.trys.push([1, 11,, 12]);
-                return [4 /*yield*/, listAvailableCameras()];
-              case 2:
-                availableCameras = _e.sent();
-                selectedCamera = void 0;
-                debug('availableCameras', availableCameras);
-                platform_1 = getPlatform();
-                debug('platformDetails', platform_1);
-                if (!iphoneContinuityCameraDenied && (!(platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) || platform_1.os.family === 'OS X')) {
-                  iphoneContinuityCamera = availableCameras.find(function (deviceInfo) {
-                    return cameraLabelMatches(deviceInfo, 'iphone');
-                  });
-                  set({
-                    iphoneContinuityCameraAvailable: !!iphoneContinuityCamera
-                  });
-                  if (iphoneContinuityCamera && preferIphoneContinuityCamera) {
-                    selectedCamera = iphoneContinuityCamera;
-                  }
-                } else if (((_b = platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) === null || _b === void 0 ? void 0 : _b.family) === 'Android' || availableCameras.every(function (c) {
-                  return c.label.startsWith('camera2 ');
-                })) {
-                  availableCameras = availableCameras.sort(function (a, b) {
-                    return a.label.toLowerCase().localeCompare(b.label.toLowerCase());
-                  });
-                  debug('cameras have been sorted', availableCameras);
-                }
-                if (preferFrontFacingCamera) {
-                  selectedCamera = availableCameras.find(function (deviceInfo) {
-                    return cameraLabelMatches(deviceInfo, frontCameraLabels);
-                  });
-                }
-                selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
-                  return cameraLabelMatches(deviceInfo, 'backtriplecamera');
-                }));
-                selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
-                  return cameraLabelMatches(deviceInfo, 'backdualcamera');
-                }));
-                selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
-                  return cameraLabelMatches(deviceInfo, rearCameraLabels) && !cameraLabelMatches(deviceInfo, backUltraWideCameraLabels);
-                }));
-                selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
-                  return cameraLabelMatches(deviceInfo, rearCameraLabels);
-                }));
-                // on iOS, the front facing camera always is at the first position in the list, so we skip it if all else fails.
-                if (!preferFrontFacingCamera && ((_c = platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) === null || _c === void 0 ? void 0 : _c.family) === 'iOS' && availableCameras.length > 0) {
-                  selectedCamera || (selectedCamera = availableCameras[1]);
-                }
-                selectedCamera || (selectedCamera = availableCameras[0]);
-                debug('selectedCamera', selectedCamera);
-                set({
-                  videoDevice: selectedCamera
-                });
-                constraints = {
-                  audio: false,
-                  video: {
-                    deviceId: {
-                      exact: selectedCamera.deviceId
-                    },
-                    width: {
-                      ideal: config.maxVideoWidth
-                    },
-                    aspectRatio: 1.777777778,
-                    frameRate: {}
-                  }
-                };
-                if (config.maxFps) {
-                  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                  // @ts-ignore
-                  constraints.video.frameRate = {
-                    max: config.maxFps
-                  };
-                }
-                stream_1 = null;
-                _e.label = 3;
-              case 3:
-                _e.trys.push([3, 5,, 6]);
-                debug('obtaining camera access with constraints', constraints);
-                return [4 /*yield*/, navigator.mediaDevices.getUserMedia(constraints)];
-              case 4:
-                stream_1 = _e.sent();
-                return [3 /*break*/, 6];
-              case 5:
-                e_1 = _e.sent();
-                if (e_1.name === 'NotAllowedError') {
-                  if (preferIphoneContinuityCamera) {
-                    set({
-                      iphoneContinuityCameraAvailable: false,
-                      iphoneContinuityCameraDenied: true
-                    });
-                  } else {
-                    set({
-                      cameraAccessDenied: true
-                    });
-                  }
-                  return [2 /*return*/];
-                }
-                return [3 /*break*/, 6];
-              case 6:
-                if (!!stream_1) return [3 /*break*/, 10];
-                _e.label = 7;
-              case 7:
-                _e.trys.push([7, 9,, 10]);
-                return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
-                  audio: false,
-                  video: true
-                })];
-              case 8:
-                stream_1 = _e.sent();
-                debug('opened stream with no width and height constraints');
-                return [3 /*break*/, 10];
-              case 9:
-                _e.sent();
-                debug('cannot open stream at all');
-                return [3 /*break*/, 10];
-              case 10:
-                if (!stream_1) {
-                  error('failed to open camera');
-                  throw new Error('failed to open camera');
-                }
-                debug('camera access granted with constraints', constraints);
-                handleStreamEnded_1 = function handleStreamEnded_1() {
-                  if (preferIphoneContinuityCamera && get().iphoneContinuityCameraAvailable) {
-                    debug('someone unplugged the continuity camera');
-                    set({
-                      videoStream: null,
-                      videoDevice: null,
-                      cameraReady: false,
-                      iphoneContinuityCameraAvailable: false,
-                      iphoneContinuityCameraDenied: true
-                    });
-                    get().requestCameraAccess();
-                  } else {
-                    debug('someone unplugged the webcam');
-                    releaseCameraAccess();
-                    set({
-                      videoStream: null,
-                      videoDevice: null,
-                      videoLoaded: false,
-                      cameraReady: false,
-                      cameraAccessDenied: true
-                    });
-                  }
-                };
-                (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.addEventListener('ended', handleStreamEnded_1);
-                videoTrack_1 = stream_1.getVideoTracks()[0];
-                videoTrack_1.onended = handleStreamEnded_1;
-                camera_1 = obtainCameraAccess(stream_1, selectedCamera.label, videoRef.current);
-                setTimeout(function () {
-                  // iOS 17 has a strange behavior where the video track flickers between muted and unmuted
-                  // when the camera access is being requested. This delay is a workaround for that.
-                  videoTrack_1.onmute = handleStreamEnded_1;
-                  set({
-                    camera: camera_1,
-                    cameraReady: true,
-                    cameraAccessDenied: false,
-                    isRearFacing: camera_1.isRearFacing,
-                    videoStream: stream_1
-                  });
-                }, 500);
-                return [3 /*break*/, 12];
-              case 11:
-                e_3 = _e.sent();
-                if (e_3.name === 'NotAllowedError') {
-                  error('camera access has been blocked by the user', e_3);
-                  set({
-                    cameraAccessDenied: true
-                  });
-                } else {
-                  error('camera access encountered some other error', e_3);
-                  throw e_3;
-                }
-                return [3 /*break*/, 12];
-              case 12:
-                return [2 /*return*/];
-            }
-          });
-        });
-      },
-      releaseCameraAccess: function releaseCameraAccess() {
-        return __awaiter(this, void 0, void 0, function () {
-          var camera;
-          return __generator(this, function (_a) {
-            camera = get().camera;
-            if (!camera) return [2 /*return*/];
-            camera.release();
-            set({
-              camera: null,
-              cameraReady: false,
-              cameraAccessDenied: false
-            });
-            return [2 /*return*/];
-          });
-        });
-      },
-      requestMicrophoneAccess: function requestMicrophoneAccess() {
-        return __awaiter(this, void 0, void 0, function () {
-          var stream_2;
-          return __generator(this, function (_a) {
-            switch (_a.label) {
-              case 0:
-                get().releaseMicrophoneAccess();
-                _a.label = 1;
-              case 1:
-                _a.trys.push([1, 3,, 4]);
-                return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
-                  audio: true,
-                  video: false
-                })
-                // iOS 17 has a strange behavior where the video track flickers between muted and unmuted
-                // when the camera access is being requested. This delay is a workaround for that.
-                ];
-              case 2:
-                stream_2 = _a.sent();
-                // iOS 17 has a strange behavior where the video track flickers between muted and unmuted
-                // when the camera access is being requested. This delay is a workaround for that.
-                setTimeout(function () {
-                  set({
-                    audioStream: stream_2,
-                    microphoneReady: true,
-                    microphoneAccessDenied: false
-                  });
-                  var track = stream_2.getAudioTracks()[0];
-                  track.onended = function () {
-                    return set({
-                      microphoneReady: false,
-                      microphoneAccessDenied: true
-                    });
-                  };
-                  track.onmute = function () {
-                    return set({
-                      microphoneReady: false,
-                      microphoneAccessDenied: true
-                    });
-                  };
-                }, 500);
-                return [3 /*break*/, 4];
-              case 3:
-                _a.sent();
-                set({
-                  microphoneAccessDenied: true
-                });
-                return [3 /*break*/, 4];
-              case 4:
-                return [2 /*return*/];
-            }
-          });
-        });
-      },
-      releaseMicrophoneAccess: function releaseMicrophoneAccess() {
-        var _a;
-        var audioStream = get().audioStream;
-        (_a = audioStream === null || audioStream === void 0 ? void 0 : audioStream.stop) === null || _a === void 0 ? void 0 : _a.call(audioStream);
-        audioStream === null || audioStream === void 0 ? void 0 : audioStream.getAudioTracks().forEach(function (track) {
-          var _a;
-          (_a = track.stop) === null || _a === void 0 ? void 0 : _a.call(track);
-        });
-        set({
-          audioStream: null,
-          microphoneReady: false,
-          microphoneAccessDenied: false
-        });
-      }
-    });
-  });
-  if (config.requestAccessAutomatically) {
-    void store.getState().requestCameraAccess();
-  }
-  return _assign(_assign({}, store), {
-    destroy: function destroy() {
-      store.getState().releaseCameraAccess();
-      store.getState().releaseMicrophoneAccess();
+    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];
     }
   });
-};
-var CameraStoreContext = /*#__PURE__*/React.createContext(undefined);
-function CameraStoreProvider(_a) {
-  var children = _a.children,
-    _b = _a.requestAccessAutomatically,
-    requestAccessAutomatically = _b === void 0 ? true : _b,
-    _c = _a.preferIphoneContinuityCamera,
-    preferIphoneContinuityCamera = _c === void 0 ? true : _c,
-    _d = _a.preferFrontFacingCamera,
-    preferFrontFacingCamera = _d === void 0 ? false : _d,
-    _e = _a.maxVideoWidth,
-    maxVideoWidth = _e === void 0 ? 1920 : _e,
-    maxFps = _a.maxFps,
-    onCameraAccessDenied = _a.onCameraAccessDenied,
-    onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
-    _f = _a.requireMicrophoneAccess,
-    requireMicrophoneAccess = _f === void 0 ? false : _f;
-  var videoRef = React.useRef(null);
-  var store = React.useRef();
-  store.current || (store.current = createCameraStore({
-    videoRef: videoRef,
-    requestAccessAutomatically: requestAccessAutomatically,
-    preferIphoneContinuityCamera: preferIphoneContinuityCamera,
-    preferFrontFacingCamera: preferFrontFacingCamera,
-    maxVideoWidth: maxVideoWidth,
-    maxFps: maxFps,
-    onCameraAccessDenied: onCameraAccessDenied,
-    onMicrophoneAccessDenied: onMicrophoneAccessDenied,
-    requireMicrophoneAccess: requireMicrophoneAccess
-  }));
-  React.useEffect(function () {
-    var _a, _b, _c;
-    var state = (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState();
-    if (!state) return;
-    if (preferIphoneContinuityCamera !== (state === null || state === void 0 ? void 0 : state.preferIphoneContinuityCamera) || preferFrontFacingCamera !== (state === null || state === void 0 ? void 0 : state.preferFrontFacingCamera)) {
-      (_b = store.current) === null || _b === void 0 ? void 0 : _b.setState({
-        preferIphoneContinuityCamera: preferIphoneContinuityCamera,
-        preferFrontFacingCamera: preferFrontFacingCamera
+  return Object.keys(maxes).map(function (label) {
+    return detectedObjects[maxes[label][1]];
+  }).filter(function (obj) {
+    return !!obj;
+  });
+}
+
+function useFrameLoop(fn, _a) {
+  var _b = _a.throttleMs,
+    throttleMs = _b === void 0 ? 0 : _b,
+    _c = _a.autoStart,
+    autoStart = _c === void 0 ? false : _c;
+  var _d = React.useState(false),
+    running = _d[0],
+    setRunning = _d[1];
+  var startedAtRef = React.useRef(null);
+  var loopId = React.useRef(0);
+  var frameId = React.useRef(0);
+  React.useEffect(function runFrameLoop() {
+    if (!running) return;
+    var timer;
+    var currentLoopId = loopId.current;
+    function renderPrediction() {
+      return __awaiter(this, void 0, void 0, function () {
+        var start, timeRunning, took, amountToThrottle;
+        var _a, _b;
+        return __generator(this, function (_c) {
+          switch (_c.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:
+              _c.sent();
+              took = new Date().getTime() - start;
+              amountToThrottle = Math.max((throttleMs !== null && throttleMs !== void 0 ? throttleMs : 0) - took, 0);
+              timer = setTimeout(function () {
+                frameId.current = requestAnimationFrame(renderPrediction);
+              }, amountToThrottle);
+              return [2 /*return*/];
+          }
+        });
       });
-      (_c = store.current) === null || _c === void 0 ? void 0 : _c.getState().requestCameraAccess();
     }
-  }, [preferFrontFacingCamera, preferIphoneContinuityCamera]);
-  React.useEffect(function () {
-    var _a;
-    if (!requireMicrophoneAccess) return;
-    (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState().requestMicrophoneAccess();
+    renderPrediction().then();
     return function () {
-      var _a;
-      return (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState().releaseMicrophoneAccess();
+      loopId.current += 1;
+      frameId.current && cancelAnimationFrame(frameId.current);
+      timer && clearTimeout(timer);
     };
-  }, [requireMicrophoneAccess]);
-  React.useEffect(function () {
+  }, [fn, running, throttleMs]);
+  var start = React.useCallback(function () {
+    startedAtRef.current = new Date();
+    setRunning(true);
+  }, []);
+  var stop = React.useCallback(function () {
+    loopId.current += 1; // force the loop to stop immediately.
+    setRunning(false);
+    startedAtRef.current = null;
+  }, []);
+  React.useEffect(function startAutomatically() {
+    if (autoStart) start();
     return function () {
-      var _a;
-      return (_a = store.current) === null || _a === void 0 ? void 0 : _a.destroy();
+      stop();
     };
-  }, []);
-  return /*#__PURE__*/React__namespace.default.createElement(CameraStoreContext.Provider, {
-    value: store.current
-  }, children);
-}
-function useCameraStore(selector) {
-  var store = React.useContext(CameraStoreContext);
-  if (!store) throw new Error('useCameraStore cannot be used without Provider');
-  return zustand.useStore(store, selector);
+  }, [autoStart, start, stop]);
+  return {
+    start: start,
+    stop: stop
+  };
 }
 
 var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
@@ -3793,7 +3868,7 @@ function DocumentDetectionModelProvider(_a) {
     _g = _a.documentDetectionModelLoadTimeoutMs,
     documentDetectionModelLoadTimeoutMs = _g === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _g,
     onDocumentDetectionModelError = _a.onDocumentDetectionModelError;
-  var _h = useCameraStore(),
+  var _h = React.useContext(CameraStateContext),
     videoRef = _h.videoRef,
     videoLoaded = _h.videoLoaded,
     cameraReady = _h.cameraReady;
@@ -3816,8 +3891,7 @@ function DocumentDetectionModelProvider(_a) {
       modelPath: documentDetectionModelPath,
       modelLoadTimeoutMs: documentDetectionModelLoadTimeoutMs,
       scoreThreshold: documentDetectionModelScoreThreshold,
-      onModelError: onDocumentDetectionModelError,
-      videoRef: videoRef
+      onModelError: onDocumentDetectionModelError
     }),
     ready = _o.ready,
     modelDownloadProgress = _o.modelDownloadProgress,
@@ -3934,12 +4008,10 @@ function FocusModelProvider(_a) {
   var _e = React.useState({}),
     focusThresholds = _e[0],
     setFocusThresholds = _e[1];
-  var videoRef = useCameraStore().videoRef;
   var _f = useLoadFocusModel({
       modelPath: focusModelPath,
       modelLoadTimeoutMs: focusModelLoadTimeoutMs,
-      onModelError: onFocusModelError,
-      videoRef: videoRef
+      onModelError: onFocusModelError
     }),
     ready = _f.ready,
     modelDownloadProgress = _f.modelDownloadProgress,
@@ -5061,33 +5133,31 @@ var Button = styled__default.default(LoaderButton)(templateObject_5$b || (templa
 var templateObject_1$D, templateObject_2$w, templateObject_3$o, templateObject_4$i, templateObject_5$b;
 
 var IdCapture = function IdCapture(_a) {
-  var _b, _c, _d, _e, _f, _g, _h;
+  var _b, _c, _d, _e, _f, _g, _h, _j;
   var requiredDocumentType = _a.requiredDocumentType,
-    _j = _a.thresholds,
-    thresholds = _j === void 0 ? defaultIdCaptureThresholds : _j,
+    _k = _a.thresholds,
+    thresholds = _k === void 0 ? defaultIdCaptureThresholds : _k,
     guidanceMessage = _a.guidanceMessage,
     guidanceSatisfied = _a.guidanceSatisfied,
     onCapture = _a.onCapture,
-    _k = _a.classNames,
-    classNames = _k === void 0 ? {} : _k,
-    _l = _a.colors,
-    colors = _l === void 0 ? {} : _l,
-    _m = _a.verbiage,
-    rawVerbiage = _m === void 0 ? {} : _m,
-    _o = _a.debugMode,
-    debugMode = _o === void 0 ? false : _o;
-  var _p = useResizeObserver__default.default(),
-    ref = _p.ref,
-    _q = _p.width,
-    width = _q === void 0 ? 1 : _q,
-    _r = _p.height,
-    height = _r === void 0 ? 1 : _r;
-  var _s = useIdCaptureState(),
-    state = _s[0],
-    dispatch = _s[1];
-  var _t = useCameraStore(),
-    camera = _t.camera,
-    isRearFacing = _t.isRearFacing;
+    _l = _a.classNames,
+    classNames = _l === void 0 ? {} : _l,
+    _m = _a.colors,
+    colors = _m === void 0 ? {} : _m,
+    _o = _a.verbiage,
+    rawVerbiage = _o === void 0 ? {} : _o,
+    _p = _a.debugMode,
+    debugMode = _p === void 0 ? false : _p;
+  var _q = useResizeObserver__default.default(),
+    ref = _q.ref,
+    _r = _q.width,
+    width = _r === void 0 ? 1 : _r,
+    _s = _q.height,
+    height = _s === void 0 ? 1 : _s;
+  var _t = useIdCaptureState(),
+    state = _t[0],
+    dispatch = _t[1];
+  var cameraRef = React.useContext(CameraStateContext).cameraRef;
   var _u = React.useContext(IdCaptureModelsContext),
     modelsReady = _u.ready,
     setThresholds = _u.setThresholds,
@@ -5199,16 +5269,17 @@ var IdCapture = function IdCapture(_a) {
     classNames: classNames.overrideWrongDocumentTypeGuidanceDialog,
     verbiage: rawVerbiage.overrideWrongDocumentTypeGuidanceDialog
   }))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugBoundingBoxOverlay, {
-    "$flipX": !isRearFacing,
+    "$flipX": !((_j = cameraRef.current) === null || _j === void 0 ? void 0 : _j.isRearFacing),
     scaling: debugScalingDetails
   }, state.detectedObjects.map(function (obj, i) {
+    var _a;
     return /*#__PURE__*/React__namespace.default.createElement(IdCaptureDetectedObjectDebugBox, {
       key: i,
       obj: obj,
       scaling: debugScalingDetails,
-      flipX: !isRearFacing
+      flipX: !((_a = cameraRef.current) === null || _a === void 0 ? void 0 : _a.isRearFacing)
     });
-  }))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), state.frameCaptureRate > 0.75 ? '✅' : '👎', " Frame Rate:", ' ', Math.round((state.frameCaptureRate + Number.EPSILON) * 1000) / 1000, ' ', "fps (", detectionTime, "ms doc detect, ", focusPredictionTime, "ms focus)", /*#__PURE__*/React__namespace.default.createElement("br", null), modelsReady ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, state.detectionThresholdMet ? '✅' : '❌', " Detected Document Type: ", state.detectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardFrontDetectionThresholdMet ? '✅' : '❌', " ID Card Front Score: ", state.idCardFrontDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardBackDetectionThresholdMet ? '✅' : '❌', " ID Card Back Score: ", state.idCardBackDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.passportDetectionThresholdMet ? '✅' : '❌', " Passport Score: ", state.passportDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.focusThresholdMet ? '✅' : '❌', " Focus Score:", ' ', state.focusScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentInBounds ? '✅' : '❌', " Document In Bounds", /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentIsStable ? '✅' : '❌', " Document Is Stable", /*#__PURE__*/React__namespace.default.createElement("br", null), state.goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', state.goodFramesCount, "/", state.goodFramesThreshold)) : ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u274C Models not ready")))));
+  }))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, cameraRef.current ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", cameraRef.current.label, " (", cameraRef.current.width, "x", cameraRef.current.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), state.frameCaptureRate > 0.75 ? '✅' : '👎', " Frame Rate:", ' ', Math.round((state.frameCaptureRate + Number.EPSILON) * 1000) / 1000, ' ', "fps (", detectionTime, "ms doc detect, ", focusPredictionTime, "ms focus)", /*#__PURE__*/React__namespace.default.createElement("br", null), modelsReady ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, state.detectionThresholdMet ? '✅' : '❌', " Detected Document Type: ", state.detectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardFrontDetectionThresholdMet ? '✅' : '❌', " ID Card Front Score: ", state.idCardFrontDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardBackDetectionThresholdMet ? '✅' : '❌', " ID Card Back Score: ", state.idCardBackDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.passportDetectionThresholdMet ? '✅' : '❌', " Passport Score: ", state.passportDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.focusThresholdMet ? '✅' : '❌', " Focus Score:", ' ', state.focusScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentInBounds ? '✅' : '❌', " Document In Bounds", /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentIsStable ? '✅' : '❌', " Document Is Stable", /*#__PURE__*/React__namespace.default.createElement("br", null), state.goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', state.goodFramesCount, "/", state.goodFramesThreshold)) : ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u274C Models not ready")))));
 };
 var timeSince = function timeSince(t) {
   if (!t) return 0;
@@ -5225,9 +5296,7 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
     colors = _e === void 0 ? {} : _e,
     _f = _a.verbiage,
     rawVerbiage = _f === void 0 ? {} : _f;
-  var requestCameraAccess = useCameraStore(function (state) {
-    return state.requestCameraAccess;
-  });
+  var requestCameraAccess = React.useContext(CameraStateContext).requestCameraAccess;
   assets.imageUrl || (assets.imageUrl = DEFAULT_CDN_URL + '/camera-disable-icon.png');
   var verbiage = useTranslations(rawVerbiage, {
     headingText: 'Your camera permission is disabled',
@@ -5875,7 +5944,7 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
   var _o = React.useContext(IdCaptureModelsContext),
     modelsReady = _o.ready,
     modelDownloadProgress = _o.modelDownloadProgress;
-  var _p = useCameraStore(),
+  var _p = React.useContext(CameraStateContext),
     cameraReady = _p.cameraReady,
     cameraAccessDenied = _p.cameraAccessDenied,
     iphoneContinuityCameraAvailable = _p.iphoneContinuityCameraAvailable,
@@ -6073,14 +6142,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
   var _l = React.useContext(IdCaptureModelsContext),
     modelsReady = _l.ready,
     modelDownloadProgress = _l.modelDownloadProgress;
-  var _m = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        cameraReady: state.cameraReady,
-        cameraAccessDenied: state.cameraAccessDenied,
-        iphoneContinuityCameraAvailable: state.iphoneContinuityCameraAvailable,
-        setIphoneContinuityCameraAllowed: state.setIphoneContinuityCameraAllowed
-      };
-    })),
+  var _m = React.useContext(CameraStateContext),
     cameraReady = _m.cameraReady,
     cameraAccessDenied = _m.cameraAccessDenied,
     iphoneContinuityCameraAvailable = _m.iphoneContinuityCameraAvailable,
@@ -6626,24 +6688,23 @@ function getOrientation(allowPortraitOnMobile) {
 }
 
 var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
-  var _b = _a.idCaptureGuideImages,
-    idCaptureGuideImages = _b === void 0 ? defaultIdCaptureGuideImages : _b,
-    _c = _a.classNames,
-    classNames = _c === void 0 ? {} : _c,
+  var _b;
+  var _c = _a.idCaptureGuideImages,
+    idCaptureGuideImages = _c === void 0 ? defaultIdCaptureGuideImages : _c,
+    _d = _a.classNames,
+    classNames = _d === void 0 ? {} : _d,
     borderWidth = _a.borderWidth,
     borderColor = _a.borderColor,
     borderRadius = _a.borderRadius,
     imageStyle = _a.imageStyle;
-  var isRearFacing = useCameraStore(function (state) {
-    return state.isRearFacing;
-  });
-  var isMirrored = !isRearFacing;
-  var _d = React.useState(1),
-    transitionTime = _d[0],
-    setTransitionTime = _d[1];
-  var _e = React.useState(0),
-    rotationAngle = _e[0],
-    setRotationAngle = _e[1];
+  var cameraRef = React.useContext(CameraStateContext).cameraRef;
+  var isMirrored = !((_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing);
+  var _e = React.useState(1),
+    transitionTime = _e[0],
+    setTransitionTime = _e[1];
+  var _f = React.useState(0),
+    rotationAngle = _f[0],
+    setRotationAngle = _f[1];
   var frontTransforms = ["rotateY(".concat(rotationAngle, "deg)")];
   if (isMirrored) frontTransforms.push('scaleX(-1)');
   var backTransforms = ["rotateY(".concat(180 - rotationAngle, "deg)")];
@@ -7167,30 +7228,29 @@ var Canvas$1 = styled__default.default.canvas(templateObject_2$n || (templateObj
 var templateObject_1$r, templateObject_2$n;
 
 function IdCaptureGuides(_a) {
-  var _b = _a.guideType,
-    guideType = _b === void 0 ? 'fit' : _b,
-    _c = _a.status,
-    status = _c === void 0 ? 'ready' : _c,
-    _d = _a.progress,
-    progress = _d === void 0 ? 0 : _d,
-    _e = _a.portraitGuidesOnMobile,
-    portraitGuidesOnMobile = _e === void 0 ? true : _e,
-    _f = _a.requestedAction,
-    requestedAction = _f === void 0 ? 'SHOW_ID_FRONT' : _f,
-    _g = _a.isBackToFront,
-    isBackToFront = _g === void 0 ? false : _g,
-    _h = _a.images,
-    images = _h === void 0 ? defaultIdCaptureGuideImages : _h,
-    _j = _a.classNames,
-    classNames = _j === void 0 ? {} : _j,
-    _k = _a.colors,
-    colors = _k === void 0 ? {} : _k,
-    _l = _a.verbiage,
-    rawVerbiage = _l === void 0 ? {} : _l;
+  var _b, _c;
+  var _d = _a.guideType,
+    guideType = _d === void 0 ? 'fit' : _d,
+    _e = _a.status,
+    status = _e === void 0 ? 'ready' : _e,
+    _f = _a.progress,
+    progress = _f === void 0 ? 0 : _f,
+    _g = _a.portraitGuidesOnMobile,
+    portraitGuidesOnMobile = _g === void 0 ? true : _g,
+    _h = _a.requestedAction,
+    requestedAction = _h === void 0 ? 'SHOW_ID_FRONT' : _h,
+    _j = _a.isBackToFront,
+    isBackToFront = _j === void 0 ? false : _j,
+    _k = _a.images,
+    images = _k === void 0 ? defaultIdCaptureGuideImages : _k,
+    _l = _a.classNames,
+    classNames = _l === void 0 ? {} : _l,
+    _m = _a.colors,
+    colors = _m === void 0 ? {} : _m,
+    _o = _a.verbiage,
+    rawVerbiage = _o === void 0 ? {} : _o;
   var state = useIdCaptureState()[0];
-  var isRearFacing = useCameraStore(function (state) {
-    return state.isRearFacing;
-  });
+  var cameraRef = React.useContext(CameraStateContext).cameraRef;
   var verbiage = useTranslations(rawVerbiage, {
     instructionText: 'Scan the front of ID',
     capturingText: 'Capturing...',
@@ -7202,7 +7262,7 @@ function IdCaptureGuides(_a) {
     status: status,
     progress: progress,
     instruction: state.captureFailed ? verbiage.captureFailedText : state.capturing ? verbiage === null || verbiage === void 0 ? void 0 : verbiage.capturingText : verbiage.instructionText,
-    isMirrored: !isRearFacing,
+    isMirrored: !((_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing),
     borderColor: state.isGoodFrame ? colors.guideBoxSatisfiedColor : colors.guideBoxUnsatisfiedColor,
     imageVisible: requestedAction === 'FLIP_ID' || !state.idCardFrontDetectionThresholdMet || !state.documentInBounds || state.documentTooClose
   })), guideType === 'fit' && ( /*#__PURE__*/React__namespace.default.createElement(IdCaptureFitGuide, {
@@ -7212,7 +7272,7 @@ function IdCaptureGuides(_a) {
     status: status,
     progress: progress,
     instruction: state.captureFailed ? verbiage.captureFailedText : state.capturing ? verbiage === null || verbiage === void 0 ? void 0 : verbiage.capturingText : verbiage.instructionText,
-    isMirrored: !isRearFacing,
+    isMirrored: !((_c = cameraRef.current) === null || _c === void 0 ? void 0 : _c.isRearFacing),
     isBackToFront: isBackToFront,
     portraitGuidesOnMobile: portraitGuidesOnMobile,
     borderColor: state.isGoodFrame ? colors.guideBoxSatisfiedColor : colors.guideBoxUnsatisfiedColor,
@@ -7311,6 +7371,48 @@ var ImagePreviewText = styled__default.default.div(templateObject_3$h || (templa
 var ImagePreviewImageWrapper = styled__default.default.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n  position: relative;\n  height: calc(100% - 8px);\n  padding: 4px;\n  border-radius: 4px;\n  background: white;\n\n  & > img {\n    border-radius: 4px;\n    width: auto;\n    max-height: 100%;\n  }\n"], ["\n  position: relative;\n  height: calc(100% - 8px);\n  padding: 4px;\n  border-radius: 4px;\n  background: white;\n\n  & > img {\n    border-radius: 4px;\n    width: auto;\n    max-height: 100%;\n  }\n"])));
 var templateObject_1$q, templateObject_2$m, templateObject_3$h, templateObject_4$b;
 
+var CameraVideoTag = function CameraVideoTag(_a) {
+  var _b;
+  var className = _a.className;
+  var _c = React.useContext(CameraStateContext),
+    videoRef = _c.videoRef,
+    setVideoLoaded = _c.setVideoLoaded,
+    onVideoUnmounted = _c.onVideoUnmounted,
+    cameraRef = _c.cameraRef;
+  React.useEffect(function notifyCameraProviderOfUnmount() {
+    var videoElement = videoRef.current;
+    if (!videoElement) return;
+    return function () {
+      onVideoUnmounted(videoElement);
+    };
+  }, [onVideoUnmounted, videoRef]);
+  React.useEffect(function setVideoLoadedToFalseOnMount() {
+    setVideoLoaded(false);
+  }, [setVideoLoaded]);
+  React.useEffect(function attachCameraStreamToVideoTagWhenReady() {
+    var _a;
+    if (videoRef.current && ((_a = cameraRef.current) === null || _a === void 0 ? void 0 : _a.stream)) {
+      videoRef.current.srcObject = cameraRef.current.stream;
+    }
+  }, [cameraRef, videoRef]);
+  var onLoadedData = React.useCallback(function () {
+    setVideoLoaded(true);
+  }, [setVideoLoaded]);
+  return /*#__PURE__*/React__namespace.default.createElement(FullscreenVideoTag, {
+    className: className,
+    autoPlay: true,
+    playsInline: true,
+    muted: true,
+    ref: videoRef,
+    onLoadedData: onLoadedData,
+    "$isRearFacing": (_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing
+  });
+};
+var FullscreenVideoTag = styled__default.default.video(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n  transform: ", ";\n  transform-style: preserve-3d;\n  min-width: 100%;\n  min-height: 100%;\n  width: auto;\n  height: auto;\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: cover;\n  background: black;\n  z-index: -2;\n"], ["\n  transform: ", ";\n  transform-style: preserve-3d;\n  min-width: 100%;\n  min-height: 100%;\n  width: auto;\n  height: auto;\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: cover;\n  background: black;\n  z-index: -2;\n"])), function (props) {
+  return props.$isRearFacing ? '' : 'scaleX(-1)';
+});
+var templateObject_1$p;
+
 var documentCaptureInitialState = {
   documents: [],
   currentDocumentIndex: 0,
@@ -7429,8 +7531,8 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
   var _c = React.useReducer(documentCaptureStateReducer, documentCaptureInitialState),
     state = _c[0],
     dispatch = _c[1];
-  var _d = useCameraStore(),
-    videoStream = _d.videoStream,
+  var _d = React.useContext(CameraStateContext),
+    cameraRef = _d.cameraRef,
     videoRef = _d.videoRef;
   var uploadDocument = React.useContext(SubmissionContext).uploadDocument;
   var uploadCapturedDocument = React.useCallback(function (content, filetype) {
@@ -7521,7 +7623,8 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
   }, [onResize]);
   var videoTag = videoRef.current;
   React.useEffect(function () {
-    if (!state.capturing || !(videoStream === null || videoStream === void 0 ? void 0 : videoStream.active)) return;
+    if (!state.capturing) return;
+    if (!cameraRef.current) return;
     function onComplete(content) {
       if (!content) return;
       var contentUrl = URL.createObjectURL(content);
@@ -7534,7 +7637,7 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
       });
     }
     if (typeof ImageCapture !== 'undefined') {
-      var tracks = videoStream.getTracks();
+      var tracks = cameraRef.current.stream.getTracks();
       var videoCameraTrack = tracks.find(function (track) {
         return track.kind === 'video';
       });
@@ -7549,7 +7652,7 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
       drawToCanvas(canvas, videoTag);
       canvas.toBlob(onComplete);
     }
-  }, [state.capturing, videoStream, videoTag]);
+  }, [cameraRef, state.capturing, videoTag]);
   var stateWithActions = React.useMemo(function () {
     return _assign(_assign({}, state), {
       uploadCapturedDocument: uploadCapturedDocument
@@ -7664,85 +7767,52 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
     ref: canvasRef
   }));
 };
-var CanvasWrapper = styled__default.default.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n  flex-grow: 1;\n  background-clip: padding-box;\n  box-shadow: inset 0 0 0 2px ", ";\n"], ["\n  flex-grow: 1;\n  background-clip: padding-box;\n  box-shadow: inset 0 0 0 2px ", ";\n"])), function (props) {
+var CanvasWrapper = styled__default.default.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n  flex-grow: 1;\n  background-clip: padding-box;\n  box-shadow: inset 0 0 0 2px ", ";\n"], ["\n  flex-grow: 1;\n  background-clip: padding-box;\n  box-shadow: inset 0 0 0 2px ", ";\n"])), function (props) {
   return props.$maskColor;
 });
 var Canvas = styled__default.default.canvas(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n  display: block;\n"], ["\n  display: block;\n"])));
-var templateObject_1$p, templateObject_2$l;
+var templateObject_1$o, templateObject_2$l;
 
-var CameraFeedWrapper = styled__default.default.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) {
+var CameraFeedWrapper = styled__default.default.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) {
   return props.$mode === 'snapToGuides' ? "display: flex;\n         position: absolute;\n         left: ".concat(props.$x, "px;\n         top: ").concat(props.$y, "px;\n         width: ").concat(props.$w, "px;\n         height: ").concat(props.$h, "px;") : "";
 });
-var templateObject_1$o;
-
-var CameraVideoTag = function CameraVideoTag(props) {
-  var _a = useCameraStore(shallow.useShallow(function (store) {
-      return {
-        videoRef: store.videoRef,
-        videoStream: store.videoStream,
-        onVideoMounted: store.onVideoMounted,
-        isRearFacing: store.isRearFacing
-      };
-    })),
-    videoRef = _a.videoRef,
-    videoStream = _a.videoStream,
-    onVideoMounted = _a.onVideoMounted,
-    isRearFacing = _a.isRearFacing;
-  React.useEffect(function attachCameraStreamToVideoTagWhenReady() {
-    if (videoRef.current && videoStream) {
-      debug('attaching camera stream to video tag');
-      videoRef.current.srcObject = videoStream;
-    }
-  }, [videoStream, videoRef]);
-  return /*#__PURE__*/React__namespace.default.createElement(FullscreenVideoTag, _assign({
-    autoPlay: true,
-    playsInline: true,
-    muted: true,
-    ref: videoRef,
-    onLoadedData: onVideoMounted,
-    "$isRearFacing": isRearFacing
-  }, props));
-};
-var FullscreenVideoTag = styled__default.default.video(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n  transform: ", ";\n  transform-style: preserve-3d;\n  min-width: 100%;\n  min-height: 100%;\n  width: auto;\n  height: auto;\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: cover;\n  background: black;\n  z-index: -2;\n"], ["\n  transform: ", ";\n  transform-style: preserve-3d;\n  min-width: 100%;\n  min-height: 100%;\n  width: auto;\n  height: auto;\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: cover;\n  background: black;\n  z-index: -2;\n"])), function (props) {
-  return props.$isRearFacing ? '' : 'scaleX(-1)';
-});
 var templateObject_1$n;
 
 var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
-  var _b, _c, _d, _e, _f;
+  var _b, _c, _d, _e, _f, _g, _h;
   var onCaptureClicked = _a.onCaptureClicked,
-    _g = _a.classNames,
-    classNames = _g === void 0 ? {} : _g,
-    _h = _a.verbiage,
-    rawVerbiage = _h === void 0 ? {} : _h;
-  var _j = useDocumentCaptureState(),
-    _k = _j[0],
-    documents = _k.documents,
-    currentDocumentIndex = _k.currentDocumentIndex,
-    rectX = _k.rectX,
-    rectY = _k.rectY,
-    rectWidth = _k.rectWidth,
-    rectHeight = _k.rectHeight,
-    rectOffsetTop = _k.rectOffsetTop,
-    capturing = _k.capturing,
-    uploadCapturedDocument = _k.uploadCapturedDocument,
-    dispatch = _j[1];
-  var _l = (_b = documents[currentDocumentIndex]) !== null && _b !== void 0 ? _b : {},
-    title = _l.title,
-    aspectRatio = _l.aspectRatio,
-    cameraFeedMode = _l.cameraFeedMode,
-    instructions = _l.instructions,
-    contentUrl = _l.contentUrl,
-    content = _l.content,
-    uploadState = _l.uploadState;
-  var _m = useCameraStore(),
-    videoStream = _m.videoStream,
-    cameraReady = _m.cameraReady,
-    cameraAccessDenied = _m.cameraAccessDenied,
-    requestCameraAccess = _m.requestCameraAccess;
-  var _o = React.useState(false),
-    cameraAccessRequested = _o[0],
-    setCameraAccessRequested = _o[1];
+    _j = _a.classNames,
+    classNames = _j === void 0 ? {} : _j,
+    _k = _a.verbiage,
+    rawVerbiage = _k === void 0 ? {} : _k;
+  var _l = useDocumentCaptureState(),
+    _m = _l[0],
+    documents = _m.documents,
+    currentDocumentIndex = _m.currentDocumentIndex,
+    rectX = _m.rectX,
+    rectY = _m.rectY,
+    rectWidth = _m.rectWidth,
+    rectHeight = _m.rectHeight,
+    rectOffsetTop = _m.rectOffsetTop,
+    capturing = _m.capturing,
+    uploadCapturedDocument = _m.uploadCapturedDocument,
+    dispatch = _l[1];
+  var _o = (_b = documents[currentDocumentIndex]) !== null && _b !== void 0 ? _b : {},
+    title = _o.title,
+    aspectRatio = _o.aspectRatio,
+    cameraFeedMode = _o.cameraFeedMode,
+    instructions = _o.instructions,
+    contentUrl = _o.contentUrl,
+    content = _o.content,
+    uploadState = _o.uploadState;
+  var _p = React.useContext(CameraStateContext),
+    cameraRef = _p.cameraRef,
+    cameraReady = _p.cameraReady,
+    cameraAccessDenied = _p.cameraAccessDenied,
+    requestCameraAccess = _p.requestCameraAccess;
+  var _q = React.useState(false),
+    cameraAccessRequested = _q[0],
+    setCameraAccessRequested = _q[1];
   var cameraAccessNeeded =
   // we should force the browser to ask for camera access if...
   uploadState === 'not_started' &&
@@ -7751,14 +7821,14 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
   // and the user hasn't passed a media blob for the current document...
   !cameraAccessRequested &&
   // and we haven't already tried to force a camera request...
-  !(videoStream === null || videoStream === void 0 ? void 0 : videoStream.active); // and we don't already have camera access.
+  !((_d = (_c = cameraRef.current) === null || _c === void 0 ? void 0 : _c.stream) === null || _d === void 0 ? void 0 : _d.active); // and we don't already have camera access.
   React.useEffect(function requestCameraAccessIfNeeded() {
     if (!cameraAccessNeeded) return;
     setCameraAccessRequested(true);
     requestCameraAccess();
   }, [cameraAccessNeeded, requestCameraAccess]);
   var theme = styled.useTheme();
-  var maskColor = (_e = (_d = (_c = theme.documentCapture) === null || _c === void 0 ? void 0 : _c.guideBox) === null || _d === void 0 ? void 0 : _d.maskColor) !== null && _e !== void 0 ? _e : cameraFeedMode === 'snapToGuides' ? '#708090' : "rgba(0, 0, 0, 0.5)";
+  var maskColor = (_g = (_f = (_e = theme.documentCapture) === null || _e === void 0 ? void 0 : _e.guideBox) === null || _f === void 0 ? void 0 : _f.maskColor) !== null && _g !== void 0 ? _g : cameraFeedMode === 'snapToGuides' ? '#708090' : "rgba(0, 0, 0, 0.5)";
   var verbiage = useTranslations(rawVerbiage, {
     headingText: title,
     loadingBtnText: 'Camera initializing...',
@@ -7791,7 +7861,7 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
     });
   }
   return /*#__PURE__*/React__namespace.default.createElement(PageContainer, {
-    className: "flex ".concat((_f = classNames.container) !== null && _f !== void 0 ? _f : '')
+    className: "flex ".concat((_h = classNames.container) !== null && _h !== void 0 ? _h : '')
   }, /*#__PURE__*/React__namespace.default.createElement(CameraFeedWrapper, {
     className: classNames.cameraFeedWrapper,
     "$mode": cameraFeedMode !== null && cameraFeedMode !== void 0 ? cameraFeedMode : 'snapToGuides',
@@ -8216,7 +8286,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
   var _3 = useIdCaptureState(),
     state = _3[0],
     dispatch = _3[1];
-  var _4 = useCameraStore(),
+  var _4 = React.useContext(CameraStateContext),
     cameraAccessDenied = _4.cameraAccessDenied,
     requestCameraAccess = _4.requestCameraAccess,
     releaseCameraAccess = _4.releaseCameraAccess;
@@ -8341,7 +8411,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
       type: 'resetWizard'
     });
     onExitCapture === null || onExitCapture === void 0 ? void 0 : onExitCapture();
-    void requestCameraAccess();
+    requestCameraAccess();
   }, [dispatch, onExitCapture, releaseCameraAccess, requestCameraAccess]);
   React.useEffect(function () {
     if (submissionStatus !== SubmissionStatus.READY) {
@@ -9164,13 +9234,7 @@ function SelfieGuidanceModelsProvider(_a) {
     modelLoadTimeoutMs = _c === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _c,
     _d = _a.requireVerticalFaceCentering,
     requireVerticalFaceCentering = _d === void 0 ? true : _d;
-  var _e = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        videoRef: state.videoRef,
-        videoLoaded: state.videoLoaded,
-        cameraReady: state.cameraReady
-      };
-    })),
+  var _e = React.useContext(CameraStateContext),
     videoRef = _e.videoRef,
     videoLoaded = _e.videoLoaded,
     cameraReady = _e.cameraReady;
@@ -9178,8 +9242,7 @@ function SelfieGuidanceModelsProvider(_a) {
   var onPredictionHandler = React.useRef();
   var _f = useLoadFaceDetector({
       onModelError: onModelError,
-      modelLoadTimeoutMs: modelLoadTimeoutMs,
-      videoRef: videoRef
+      modelLoadTimeoutMs: modelLoadTimeoutMs
     }),
     ready = _f.ready,
     modelDownloadProgress = _f.modelDownloadProgress,
@@ -9512,14 +9575,8 @@ var SelfieCapture = function SelfieCapture(_a) {
     prediction = _t.prediction,
     dispatch = _s[1];
   var lastPredictionCanvas = React.useRef(null);
-  var _u = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        camera: state.camera,
-        cameraReady: state.cameraReady,
-        videoRef: state.videoRef
-      };
-    })),
-    camera = _u.camera,
+  var _u = React.useContext(CameraStateContext),
+    cameraRef = _u.cameraRef,
     videoRef = _u.videoRef;
   var _v = React.useContext(SelfieGuidanceModelsContext),
     onPredictionMade = _v.onPredictionMade,
@@ -9609,7 +9666,7 @@ var SelfieCapture = function SelfieCapture(_a) {
     face: prediction.face,
     scaling: debugScalingDetails,
     color: satisfied ? 'green' : 'red'
-  }))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceNotCentered) ? '✅' : '❌', " Face Centered", /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceTooClose) && !(prediction === null || prediction === void 0 ? void 0 : prediction.faceTooFar) ? '✅' : '❌', ' ', "Face", ' ', (prediction === null || prediction === void 0 ? void 0 : prediction.faceTooClose) ? 'Too Close' : (prediction === null || prediction === void 0 ? void 0 : prediction.faceTooFar) ? 'Too Far' : 'Distance Correct', /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceLookingAway) ? '✅' : '❌', " Face Looking Forward", /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceIsStable) ? '✅' : '❌', " Face Is Stable", /*#__PURE__*/React__namespace.default.createElement("br", null), !timedOut ? '✅' : '❌', " Time Remaining:", ' ', Math.max(0, timeoutDurationMs - (new Date().getTime() - (timeoutStartedAt !== null && timeoutStartedAt !== void 0 ? timeoutStartedAt : new Date()).getTime())), "ms")), /*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
+  }))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, cameraRef.current ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", cameraRef.current.label, " (", cameraRef.current.width, "x", cameraRef.current.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceNotCentered) ? '✅' : '❌', " Face Centered", /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceTooClose) && !(prediction === null || prediction === void 0 ? void 0 : prediction.faceTooFar) ? '✅' : '❌', ' ', "Face", ' ', (prediction === null || prediction === void 0 ? void 0 : prediction.faceTooClose) ? 'Too Close' : (prediction === null || prediction === void 0 ? void 0 : prediction.faceTooFar) ? 'Too Far' : 'Distance Correct', /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceLookingAway) ? '✅' : '❌', " Face Looking Forward", /*#__PURE__*/React__namespace.default.createElement("br", null), !(prediction === null || prediction === void 0 ? void 0 : prediction.faceIsStable) ? '✅' : '❌', " Face Is Stable", /*#__PURE__*/React__namespace.default.createElement("br", null), !timedOut ? '✅' : '❌', " Time Remaining:", ' ', Math.max(0, timeoutDurationMs - (new Date().getTime() - (timeoutStartedAt !== null && timeoutStartedAt !== void 0 ? timeoutStartedAt : new Date()).getTime())), "ms")), /*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
     onClick: onExit,
     className: classNames.exitCaptureBtn
   }));
@@ -10065,9 +10122,7 @@ var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
     colors = _e === void 0 ? {} : _e,
     _f = _a.verbiage,
     rawVerbiage = _f === void 0 ? {} : _f;
-  var requestMicrophoneAccess = useCameraStore(function (state) {
-    return state.requestMicrophoneAccess;
-  });
+  var requestMicrophoneAccess = React.useContext(CameraStateContext).requestMicrophoneAccess;
   assets.imageUrl || (assets.imageUrl = DEFAULT_CDN_URL + '/microphone-disable-icon.svg');
   var verbiage = useTranslations(rawVerbiage, {
     headingText: 'Your microphone permission is disabled',
@@ -10115,13 +10170,7 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
     colors = _e === void 0 ? {} : _e,
     _f = _a.verbiage,
     rawVerbiage = _f === void 0 ? {} : _f;
-  var _g = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        cameraReady: state.cameraReady,
-        cameraAccessDenied: state.cameraAccessDenied,
-        microphoneAccessDenied: state.microphoneAccessDenied
-      };
-    })),
+  var _g = React.useContext(CameraStateContext),
     cameraReady = _g.cameraReady,
     cameraAccessDenied = _g.cameraAccessDenied,
     microphoneAccessDenied = _g.microphoneAccessDenied;
@@ -10208,13 +10257,7 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
     colors = _e === void 0 ? {} : _e,
     _f = _a.verbiage,
     rawVerbiage = _f === void 0 ? {} : _f;
-  var _g = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        cameraReady: state.cameraReady,
-        cameraAccessDenied: state.cameraAccessDenied,
-        microphoneAccessDenied: state.microphoneAccessDenied
-      };
-    })),
+  var _g = React.useContext(CameraStateContext),
     cameraReady = _g.cameraReady,
     cameraAccessDenied = _g.cameraAccessDenied,
     microphoneAccessDenied = _g.microphoneAccessDenied;
@@ -10431,13 +10474,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
     livenessCheckRequest = _t.livenessCheckRequest,
     setSelfieImage = _t.setSelfieImage,
     logSelfieCaptureAttempt = _t.logSelfieCaptureAttempt;
-  var _u = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        cameraAccessDenied: state.cameraAccessDenied,
-        requestCameraAccess: state.requestCameraAccess,
-        releaseCameraAccess: state.releaseCameraAccess
-      };
-    })),
+  var _u = React.useContext(CameraStateContext),
     cameraAccessDenied = _u.cameraAccessDenied,
     requestCameraAccess = _u.requestCameraAccess,
     releaseCameraAccess = _u.releaseCameraAccess;
@@ -11158,10 +11195,10 @@ function VideoSignatureContextProvider(_a) {
     setSignatureVideoUrl = _e[1];
   var signatureRecorder = React.useRef(null);
   var recordedChunks = React.useRef([]);
-  var _f = useCameraStore(),
-    camera = _f.camera,
+  var _f = React.useContext(CameraStateContext),
+    cameraRef = _f.cameraRef,
     videoRef = _f.videoRef;
-  var _g = useVideoRecorder(camera),
+  var _g = useVideoRecorder(cameraRef.current),
     isRecordingVideo = _g.isRecordingVideo,
     startRecordingVideo = _g.startRecordingVideo,
     stopRecordingVideo = _g.stopRecordingVideo,
@@ -11229,8 +11266,8 @@ function VideoSignatureContextProvider(_a) {
   var animationFrame = React.useRef(0);
   React.useEffect(function () {
     var _a;
-    if (!signaturePad.current || !videoRef.current || !outputCanvas.current || !camera || !isRecording || !isRecordingVideo) return;
-    var _b = [camera.width, camera.height],
+    if (!signaturePad.current || !videoRef.current || !outputCanvas.current || !cameraRef.current || !isRecording || !isRecordingVideo) return;
+    var _b = [cameraRef.current.width, cameraRef.current.height],
       w = _b[0],
       h = _b[1];
     var isPortrait = typeof window !== 'undefined' && window.innerWidth < window.innerHeight;
@@ -11263,7 +11300,7 @@ function VideoSignatureContextProvider(_a) {
     return function () {
       cancelAnimationFrame(animationFrame.current);
     };
-  }, [camera, isRecording, isRecordingVideo, videoRef]);
+  }, [cameraRef, isRecording, isRecordingVideo, videoRef]);
   var onAcceptClicked = React.useCallback(function () {
     return __awaiter(_this, void 0, void 0, function () {
       var imageUrl;
@@ -11392,29 +11429,27 @@ var AcceptBtn = styled__default.default(LoaderButton)(templateObject_7$1 || (tem
 var templateObject_1$9, templateObject_2$8, templateObject_3$8, templateObject_4$3, templateObject_5$2, templateObject_6$2, templateObject_7$1;
 
 var VideoSignatureCapture = function VideoSignatureCapture(_a) {
-  var _b;
+  var _b, _c, _d;
   var onVideoCaptured = _a.onVideoCaptured,
     onFaceNotDetected = _a.onFaceNotDetected,
     onExit = _a.onExit,
     guidesComponent = _a.guidesComponent,
-    _c = _a.classNames,
-    classNames = _c === void 0 ? {} : _c,
-    _d = _a.colors,
-    colors = _d === void 0 ? {} : _d,
-    _e = _a.verbiage,
-    rawVerbiage = _e === void 0 ? {} : _e,
-    _f = _a.debugMode,
-    debugMode = _f === void 0 ? false : _f;
-  var camera = useCameraStore(function (state) {
-    return state.camera;
-  });
+    _e = _a.classNames,
+    classNames = _e === void 0 ? {} : _e,
+    _f = _a.colors,
+    colors = _f === void 0 ? {} : _f,
+    _g = _a.verbiage,
+    rawVerbiage = _g === void 0 ? {} : _g,
+    _h = _a.debugMode,
+    debugMode = _h === void 0 ? false : _h;
+  var cameraRef = React.useContext(CameraStateContext).cameraRef;
   var onPredictionMade = React.useContext(SelfieGuidanceModelsContext).onPredictionMade;
-  var _g = useVideoSignatureContext(),
-    signatureData = _g.signatureData,
-    signatureDataUrl = _g.signatureDataUrl,
-    signatureVideoData = _g.signatureVideoData,
-    startRecording = _g.startRecording,
-    stopRecording = _g.stopRecording;
+  var _j = useVideoSignatureContext(),
+    signatureData = _j.signatureData,
+    signatureDataUrl = _j.signatureDataUrl,
+    signatureVideoData = _j.signatureVideoData,
+    startRecording = _j.startRecording,
+    stopRecording = _j.stopRecording;
   React.useEffect(function () {
     startRecording();
     return function () {
@@ -11431,9 +11466,9 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
       onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
     }
   }, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
-  var _h = React.useState(0),
-    numFramesWithoutFaces = _h[0],
-    setNumFramesWithoutFaces = _h[1];
+  var _k = React.useState(0),
+    numFramesWithoutFaces = _k[0],
+    setNumFramesWithoutFaces = _k[1];
   React.useEffect(function () {
     onPredictionMade(function (_a) {
       var face = _a.face;
@@ -11460,7 +11495,7 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
   }, verbiage.guidanceMessageText))), /*#__PURE__*/React__namespace.default.createElement(GuidesComponent, {
     classNames: classNames.videoSignatureGuidesClassNames,
     status: "success"
-  }), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, "Video: ", camera === null || camera === void 0 ? void 0 : camera.width, "x", camera === null || camera === void 0 ? void 0 : camera.height)), /*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
+  }), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, "Video: ", (_c = cameraRef.current) === null || _c === void 0 ? void 0 : _c.width, "x", (_d = cameraRef.current) === null || _d === void 0 ? void 0 : _d.height)), /*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
     onClick: onExit,
     className: classNames.exitCaptureBtn
   }));
@@ -11554,13 +11589,7 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
     setSignatureData = _l.setSignatureData,
     setSignatureVideoUrl = _l.setSignatureVideoUrl,
     logSelfieCaptureAttempt = _l.logSelfieCaptureAttempt;
-  var _m = useCameraStore(shallow.useShallow(function (state) {
-      return {
-        cameraAccessDenied: state.cameraAccessDenied,
-        requestCameraAccess: state.requestCameraAccess,
-        releaseCameraAccess: state.releaseCameraAccess
-      };
-    })),
+  var _m = React.useContext(CameraStateContext),
     cameraAccessDenied = _m.cameraAccessDenied,
     requestCameraAccess = _m.requestCameraAccess,
     releaseCameraAccess = _m.releaseCameraAccess;
@@ -11720,29 +11749,27 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
 };
 
 var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
-  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
-  var _z = _a.requestedAction,
-    requestedAction = _z === void 0 ? 'SHOW_ID_FRONT' : _z,
-    _0 = _a.satisfied,
-    satisfied = _0 === void 0 ? false : _0,
-    _1 = _a.faceGuideStatus,
-    faceGuideStatus = _1 === void 0 ? 'success' : _1,
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
+  var _0 = _a.requestedAction,
+    requestedAction = _0 === void 0 ? 'SHOW_ID_FRONT' : _0,
+    _1 = _a.satisfied,
+    satisfied = _1 === void 0 ? false : _1,
+    _2 = _a.faceGuideStatus,
+    faceGuideStatus = _2 === void 0 ? 'success' : _2,
     faceGuideBorderWidth = _a.faceGuideBorderWidth,
     faceGuideBorderColor = _a.faceGuideBorderColor,
-    _2 = _a.idCardGuideStatus,
-    idCardGuideStatus = _2 === void 0 ? 'ready' : _2,
+    _3 = _a.idCardGuideStatus,
+    idCardGuideStatus = _3 === void 0 ? 'ready' : _3,
     idCardGuideBorderWidth = _a.idCardGuideBorderWidth,
     idCardGuideBorderColor = _a.idCardGuideBorderColor,
     idCardCaptureProgress = _a.idCardCaptureProgress,
-    _3 = _a.idCardCaptureGuideImages,
-    userSuppliedImages = _3 === void 0 ? defaultIdCaptureGuideImages : _3,
-    _4 = _a.classNames,
-    classNames = _4 === void 0 ? {} : _4,
-    _5 = _a.verbiage,
-    rawVerbiage = _5 === void 0 ? {} : _5;
-  var isRearFacing = useCameraStore(function (state) {
-    return state.isRearFacing;
-  });
+    _4 = _a.idCardCaptureGuideImages,
+    userSuppliedImages = _4 === void 0 ? defaultIdCaptureGuideImages : _4,
+    _5 = _a.classNames,
+    classNames = _5 === void 0 ? {} : _5,
+    _6 = _a.verbiage,
+    rawVerbiage = _6 === void 0 ? {} : _6;
+  var cameraRef = React.useContext(CameraStateContext).cameraRef;
   var verbiage = useTranslations(rawVerbiage, {
     idFrontInstructionText: 'Display the front of your ID card...',
     idBackInstructionText: 'Display the back of your ID card...',
@@ -11755,17 +11782,17 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
   if (faceGuideBorderColor === undefined) faceGuideBorderColor = (_j = satisfied ? (_f = (_e = theme.idVideoCapture) === null || _e === void 0 ? void 0 : _e.faceGuides) === null || _f === void 0 ? void 0 : _f.satisfiedColor : (_h = (_g = theme.idVideoCapture) === null || _g === void 0 ? void 0 : _g.faceGuides) === null || _h === void 0 ? void 0 : _h.unsatisfiedColor) !== null && _j !== void 0 ? _j : '#D6DCE7';
   if (idCardGuideBorderWidth === undefined) idCardGuideBorderWidth = (_m = (_l = (_k = theme.idVideoCapture) === null || _k === void 0 ? void 0 : _k.idCardGuides) === null || _l === void 0 ? void 0 : _l.borderWidth) !== null && _m !== void 0 ? _m : 20;
   if (idCardGuideBorderColor === undefined) idCardGuideBorderColor = (_s = satisfied ? (_p = (_o = theme.idVideoCapture) === null || _o === void 0 ? void 0 : _o.idCardGuides) === null || _p === void 0 ? void 0 : _p.satisfiedColor : (_r = (_q = theme.idVideoCapture) === null || _q === void 0 ? void 0 : _q.idCardGuides) === null || _r === void 0 ? void 0 : _r.unsatisfiedColor) !== null && _s !== void 0 ? _s : '#D6DCE7';
-  var _6 = useResizeObserver__default.default(),
-    idCardGuideRef = _6.ref,
-    _7 = _6.width,
-    idCardGuideWidth = _7 === void 0 ? 0 : _7,
-    _8 = _6.height,
-    idCardGuideHeight = _8 === void 0 ? 0 : _8;
+  var _7 = useResizeObserver__default.default(),
+    idCardGuideRef = _7.ref,
+    _8 = _7.width,
+    idCardGuideWidth = _8 === void 0 ? 0 : _8,
+    _9 = _7.height,
+    idCardGuideHeight = _9 === void 0 ? 0 : _9;
   var idCaptureGuideImages = useGuideImages(userSuppliedImages);
   var idCaptureGuideImagesByUrl = useGuideImagesByUrl(idCaptureGuideImages);
-  var _9 = React.useState(undefined),
-    aspectRatio = _9[0],
-    setAspectRatio = _9[1];
+  var _10 = React.useState(undefined),
+    aspectRatio = _10[0],
+    setAspectRatio = _10[1];
   var onImageLoaded = React.useCallback(function (e) {
     var _a, _b, _c, _d;
     var img = e.currentTarget;
@@ -11812,7 +11839,7 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
   }, /*#__PURE__*/React__namespace.default.createElement(IdCardGuideImage, {
     alt: "",
     className: classNames.idCardGuideImage,
-    "$isMirrored": !isRearFacing,
+    "$isMirrored": !((_v = cameraRef.current) === null || _v === void 0 ? void 0 : _v.isRearFacing),
     style: idCardImageStyle,
     src: requestedAction === 'SHOW_ID_BACK' ? idCaptureGuideImages.landscape.SHOW_ID_BACK.url : idCaptureGuideImages.landscape.SHOW_ID_FRONT.url,
     onLoad: onImageLoaded
@@ -11826,8 +11853,8 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
     className: classNames.idCardGuideInstructionsContainer
   }, /*#__PURE__*/React__namespace.default.createElement(IdCardGuideInstructions, {
     className: classNames.idCardGuideInstructions,
-    "$textColor": (_w = (_v = theme.idVideoCapture) === null || _v === void 0 ? void 0 : _v.idCardGuides) === null || _w === void 0 ? void 0 : _w.instructionsTextColor,
-    "$background": (_y = (_x = theme.idVideoCapture) === null || _x === void 0 ? void 0 : _x.idCardGuides) === null || _y === void 0 ? void 0 : _y.instructionsBackgroundColor
+    "$textColor": (_x = (_w = theme.idVideoCapture) === null || _w === void 0 ? void 0 : _w.idCardGuides) === null || _x === void 0 ? void 0 : _x.instructionsTextColor,
+    "$background": (_z = (_y = theme.idVideoCapture) === null || _y === void 0 ? void 0 : _y.idCardGuides) === null || _z === void 0 ? void 0 : _z.instructionsBackgroundColor
   }, instructionText))))));
 };
 var Container = styled__default.default.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n  display: flex;\n  max-height: 100%;\n  position: absolute;\n  z-index: 1000;\n  width: 100dvw;\n  height: 100dvh;\n  font-family: ", ";\n  box-sizing: border-box;\n  overflow: hidden;\n  padding: 40px;\n"], ["\n  display: flex;\n  max-height: 100%;\n  position: absolute;\n  z-index: 1000;\n  width: 100dvw;\n  height: 100dvh;\n  font-family: ", ";\n  box-sizing: border-box;\n  overflow: hidden;\n  padding: 40px;\n"])), function (props) {
@@ -11972,100 +11999,99 @@ var defaultVideoIdCaptureThresholds = {
   flipShortcutThreshold: 0.7
 };
 var IdVideoCapture = function IdVideoCapture(_a) {
-  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
   var onComplete = _a.onComplete,
     onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
     onIdBackImageCaptured = _a.onIdBackImageCaptured,
     onFaceNotDetected = _a.onFaceNotDetected,
     onRecordingFailed = _a.onRecordingFailed,
     onExitCapture = _a.onExitCapture,
-    _w = _a.idCaptureModelsEnabled,
-    idCaptureModelsEnabled = _w === void 0 ? true : _w,
-    _x = _a.idCardCaptureGuideImages,
-    idCardCaptureGuideImages = _x === void 0 ? defaultIdCaptureGuideImages : _x,
-    _y = _a.idCardFrontDelay,
-    idCardFrontDelay = _y === void 0 ? 1000 : _y,
-    _z = _a.videoIdCaptureThresholds,
-    videoIdCaptureThresholds = _z === void 0 ? defaultVideoIdCaptureThresholds : _z,
-    _0 = _a.skipShowIdCardBack,
-    skipShowIdCardBack = _0 === void 0 ? false : _0,
-    _1 = _a.captureCountdownSeconds,
-    captureCountdownSeconds = _1 === void 0 ? 3 : _1,
+    _x = _a.idCaptureModelsEnabled,
+    idCaptureModelsEnabled = _x === void 0 ? true : _x,
+    _y = _a.idCardCaptureGuideImages,
+    idCardCaptureGuideImages = _y === void 0 ? defaultIdCaptureGuideImages : _y,
+    _z = _a.idCardFrontDelay,
+    idCardFrontDelay = _z === void 0 ? 1000 : _z,
+    _0 = _a.videoIdCaptureThresholds,
+    videoIdCaptureThresholds = _0 === void 0 ? defaultVideoIdCaptureThresholds : _0,
+    _1 = _a.skipShowIdCardBack,
+    skipShowIdCardBack = _1 === void 0 ? false : _1,
+    _2 = _a.captureCountdownSeconds,
+    captureCountdownSeconds = _2 === void 0 ? 3 : _2,
     readTextPrompt = _a.readTextPrompt,
-    _2 = _a.readTextTimeoutDurationMs,
-    readTextTimeoutDurationMs = _2 === void 0 ? 15000 : _2,
-    _3 = _a.readTextMinReadingMs,
-    readTextMinReadingMs = _3 === void 0 ? 10000 : _3,
-    _4 = _a.disableFaceDetectionWhileAudioCapture,
-    disableFaceDetectionWhileAudioCapture = _4 === void 0 ? false : _4,
-    _5 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
-    disableFaceDetectionWhileAudioCaptureMsDelay = _5 === void 0 ? 2000 : _5,
-    _6 = _a.mergeAVStreams,
-    mergeAVStreams = _6 === void 0 ? false : _6,
-    _7 = _a.classNames,
-    classNames = _7 === void 0 ? {} : _7,
-    _8 = _a.colors,
-    colors = _8 === void 0 ? {} : _8,
-    _9 = _a.verbiage,
-    rawVerbiage = _9 === void 0 ? {} : _9,
-    _10 = _a.debugMode,
-    debugMode = _10 === void 0 ? false : _10;
-  var _11 = useResizeObserver__default.default(),
-    ref = _11.ref,
-    _12 = _11.width,
-    width = _12 === void 0 ? 1 : _12,
-    _13 = _11.height,
-    height = _13 === void 0 ? 1 : _13;
-  var _14 = useCameraStore(),
-    camera = _14.camera,
-    videoRef = _14.videoRef,
-    videoLoaded = _14.videoLoaded,
-    cameraReady = _14.cameraReady,
-    microphoneReady = _14.microphoneReady,
-    audioStream = _14.audioStream,
-    isRearFacing = _14.isRearFacing,
-    releaseCameraAccess = _14.releaseCameraAccess;
-  var _15 = React.useState([]),
-    detectedObjects = _15[0],
-    setDetectedObjects = _15[1];
-  var _16 = React.useState(null),
-    face = _16[0],
-    setFace = _16[1];
-  var _17 = React.useContext(IdCaptureModelsContext),
-    idModelsReady = _17.ready,
-    startIdModels = _17.start,
-    stopIdModels = _17.stop,
-    onIdPredictionMade = _17.onPredictionMade,
-    setThresholds = _17.setThresholds,
-    setDocumentDetectionBoundaries = _17.setDocumentDetectionBoundaries,
-    bestFrameDetails = _17.bestFrameDetails,
-    resetBestFrame = _17.resetBestFrame,
-    idModelError = _17.modelError;
-  var _18 = React.useState(null),
-    videoStartsAt = _18[0],
-    setVideoStartsAt = _18[1];
-  var _19 = React.useContext(SubmissionContext),
-    setIdCaptureVideoAudioStartsAt = _19.setIdCaptureVideoAudioStartsAt,
-    setExpectedAudioText = _19.setExpectedAudioText;
-  var _20 = React.useContext(SelfieGuidanceModelsContext),
-    startSelfieGuidance = _20.start,
-    stopSelfieGuidance = _20.stop,
-    onSelfiePredictionMade = _20.onPredictionMade,
-    selfieModelError = _20.error;
-  var _21 = useVideoRecorder(camera, audioStream, mergeAVStreams),
-    isRecordingVideo = _21.isRecordingVideo,
-    startRecordingVideo = _21.startRecordingVideo,
-    startRecordingAudio = _21.startRecordingAudio,
-    stopRecordingVideo = _21.stopRecordingVideo,
-    stopRecordingAudio = _21.stopRecordingAudio,
-    videoRecordingUnintentionallyStopped = _21.videoRecordingUnintentionallyStopped,
-    audioRecordingUnintentionallyStopped = _21.audioRecordingUnintentionallyStopped,
-    videoUrl = _21.videoUrl,
-    audioUrl = _21.audioUrl;
+    _3 = _a.readTextTimeoutDurationMs,
+    readTextTimeoutDurationMs = _3 === void 0 ? 15000 : _3,
+    _4 = _a.readTextMinReadingMs,
+    readTextMinReadingMs = _4 === void 0 ? 10000 : _4,
+    _5 = _a.disableFaceDetectionWhileAudioCapture,
+    disableFaceDetectionWhileAudioCapture = _5 === void 0 ? false : _5,
+    _6 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
+    disableFaceDetectionWhileAudioCaptureMsDelay = _6 === void 0 ? 2000 : _6,
+    _7 = _a.mergeAVStreams,
+    mergeAVStreams = _7 === void 0 ? false : _7,
+    _8 = _a.classNames,
+    classNames = _8 === void 0 ? {} : _8,
+    _9 = _a.colors,
+    colors = _9 === void 0 ? {} : _9,
+    _10 = _a.verbiage,
+    rawVerbiage = _10 === void 0 ? {} : _10,
+    _11 = _a.debugMode,
+    debugMode = _11 === void 0 ? false : _11;
+  var _12 = useResizeObserver__default.default(),
+    ref = _12.ref,
+    _13 = _12.width,
+    width = _13 === void 0 ? 1 : _13,
+    _14 = _12.height,
+    height = _14 === void 0 ? 1 : _14;
+  var _15 = React.useContext(CameraStateContext),
+    cameraRef = _15.cameraRef,
+    videoRef = _15.videoRef,
+    videoLoaded = _15.videoLoaded,
+    cameraReady = _15.cameraReady,
+    microphoneReady = _15.microphoneReady,
+    audioStream = _15.audioStream,
+    setVideoLoaded = _15.setVideoLoaded;
+  var _16 = React.useState([]),
+    detectedObjects = _16[0],
+    setDetectedObjects = _16[1];
+  var _17 = React.useState(null),
+    face = _17[0],
+    setFace = _17[1];
+  var _18 = React.useContext(IdCaptureModelsContext),
+    idModelsReady = _18.ready,
+    startIdModels = _18.start,
+    stopIdModels = _18.stop,
+    onIdPredictionMade = _18.onPredictionMade,
+    setThresholds = _18.setThresholds,
+    setDocumentDetectionBoundaries = _18.setDocumentDetectionBoundaries,
+    bestFrameDetails = _18.bestFrameDetails,
+    resetBestFrame = _18.resetBestFrame,
+    idModelError = _18.modelError;
+  var _19 = React.useState(null),
+    videoStartsAt = _19[0],
+    setVideoStartsAt = _19[1];
+  var _20 = React.useContext(SubmissionContext),
+    setIdCaptureVideoAudioStartsAt = _20.setIdCaptureVideoAudioStartsAt,
+    setExpectedAudioText = _20.setExpectedAudioText;
+  var _21 = React.useContext(SelfieGuidanceModelsContext),
+    startSelfieGuidance = _21.start,
+    stopSelfieGuidance = _21.stop,
+    onSelfiePredictionMade = _21.onPredictionMade,
+    selfieModelError = _21.error;
+  var _22 = useVideoRecorder(cameraRef.current, audioStream, mergeAVStreams),
+    isRecordingVideo = _22.isRecordingVideo,
+    startRecordingVideo = _22.startRecordingVideo,
+    startRecordingAudio = _22.startRecordingAudio,
+    stopRecordingVideo = _22.stopRecordingVideo,
+    stopRecordingAudio = _22.stopRecordingAudio,
+    videoRecordingUnintentionallyStopped = _22.videoRecordingUnintentionallyStopped,
+    audioRecordingUnintentionallyStopped = _22.audioRecordingUnintentionallyStopped,
+    videoUrl = _22.videoUrl,
+    audioUrl = _22.audioUrl;
   var countdownTimeoutRef = React.useRef(undefined);
-  var _22 = React.useState(-1),
-    countdownRemaining = _22[0],
-    setCountdownRemaining = _22[1];
+  var _23 = React.useState(-1),
+    countdownRemaining = _23[0],
+    setCountdownRemaining = _23[1];
   React.useEffect(function () {
     if (!isRecordingVideo && !videoUrl) {
       startRecordingVideo();
@@ -12076,24 +12102,24 @@ var IdVideoCapture = function IdVideoCapture(_a) {
     var needsAudio = !!readTextPrompt && !mergeAVStreams;
     var audioReady = !needsAudio || audioUrl;
     if (videoUrl && audioReady) {
-      releaseCameraAccess();
+      setVideoLoaded(false);
       onComplete === null || onComplete === void 0 ? void 0 : onComplete(videoUrl, audioUrl);
     }
-  }, [audioUrl, isRecordingVideo, mergeAVStreams, onComplete, readTextPrompt, releaseCameraAccess, startRecordingVideo, videoUrl]);
+  }, [audioUrl, isRecordingVideo, mergeAVStreams, onComplete, readTextPrompt, setVideoLoaded, startRecordingVideo, videoUrl]);
   React.useEffect(function () {
-    if (videoRecordingUnintentionallyStopped || audioRecordingUnintentionallyStopped || !!readTextPrompt && !microphoneReady) {
+    if (videoRecordingUnintentionallyStopped || audioRecordingUnintentionallyStopped) {
       onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
     }
-  }, [audioRecordingUnintentionallyStopped, microphoneReady, onRecordingFailed, readTextPrompt, videoRecordingUnintentionallyStopped]);
-  var _23 = React.useState('SHOW_ID_FRONT'),
-    requestedAction = _23[0],
-    setRequestedAction = _23[1];
+  }, [audioRecordingUnintentionallyStopped, onRecordingFailed, videoRecordingUnintentionallyStopped]);
+  var _24 = React.useState('SHOW_ID_FRONT'),
+    requestedAction = _24[0],
+    setRequestedAction = _24[1];
   var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
   React.useEffect(function startModelsWhenCapturing() {
     if (!shouldRunIdModels) return;
     startIdModels();
     return function () {
-      return stopIdModels();
+      stopIdModels();
     };
   }, [shouldRunIdModels, startIdModels, stopIdModels]);
   React.useEffect(function () {
@@ -12107,18 +12133,18 @@ var IdVideoCapture = function IdVideoCapture(_a) {
       bottom: 1
     });
   }, [setDocumentDetectionBoundaries]);
-  var _24 = React.useState(0),
-    currentDetectionScore = _24[0],
-    setCurrentDetectionScore = _24[1];
-  var _25 = React.useState('none'),
-    currentDetectedDocumentType = _25[0],
-    setCurrentDetectedDocumentType = _25[1];
-  var _26 = React.useState(0),
-    currentFocusScore = _26[0],
-    setCurrentFocusScore = _26[1];
+  var _25 = React.useState(0),
+    currentDetectionScore = _25[0],
+    setCurrentDetectionScore = _25[1];
+  var _26 = React.useState('none'),
+    currentDetectedDocumentType = _26[0],
+    setCurrentDetectedDocumentType = _26[1];
   var _27 = React.useState(0),
-    goodFramesCount = _27[0],
-    setGoodFramesCount = _27[1];
+    currentFocusScore = _27[0],
+    setCurrentFocusScore = _27[1];
+  var _28 = React.useState(0),
+    goodFramesCount = _28[0],
+    setGoodFramesCount = _28[1];
   var goodFramesThreshold = requestedAction === 'SHOW_ID_FRONT' ? videoIdCaptureThresholds.goodFrames.idCardFront : videoIdCaptureThresholds.goodFrames.idCardBack;
   var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
   React.useEffect(function () {
@@ -12139,9 +12165,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
       } : 0);
     });
   }, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, videoIdCaptureThresholds.flipShortcutThreshold]);
-  var _28 = React.useState(null),
-    idFrontCaptureStartedAt = _28[0],
-    setFirstGoodFrameTime = _28[1];
+  var _29 = React.useState(null),
+    idFrontCaptureStartedAt = _29[0],
+    setFirstGoodFrameTime = _29[1];
   React.useEffect(function () {
     if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
   }, [goodFramesCount]);
@@ -12162,9 +12188,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
   var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
   var faceBox = face === null || face === void 0 ? void 0 : face.box;
   var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
-  var _29 = React.useState(),
-    countdownStartedAt = _29[0],
-    setCountdownStartedAt = _29[1];
+  var _30 = React.useState(),
+    countdownStartedAt = _30[0],
+    setCountdownStartedAt = _30[1];
   var photoCanvas = React.useRef(null);
   var frameLock = React.useRef(false);
   var captureFrame = React.useCallback(function () {
@@ -12287,9 +12313,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
       stopSelfieGuidance();
     };
   }, [startSelfieGuidance, stopSelfieGuidance]);
-  var _30 = React.useState(0),
-    numFramesWithoutFaces = _30[0],
-    setNumFramesWithoutFaces = _30[1];
+  var _31 = React.useState(0),
+    numFramesWithoutFaces = _31[0],
+    setNumFramesWithoutFaces = _31[1];
   onSelfiePredictionMade(useDebounce.useThrottledCallback(React.useCallback(function (_a) {
     var face = _a.face;
     if (selfieModelError) return;
@@ -12305,12 +12331,12 @@ var IdVideoCapture = function IdVideoCapture(_a) {
     }
   }, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
   var theme = styled.useTheme();
-  var _31 = useTranslations(rawVerbiage, {
+  var _32 = useTranslations(rawVerbiage, {
       faceNotCenteredText: 'Please move your face to the center...',
       captureBtnText: 'Capture'
     }),
-    captureBtnText = _31.captureBtnText,
-    faceNotCenteredText = _31.faceNotCenteredText;
+    captureBtnText = _32.captureBtnText,
+    faceNotCenteredText = _32.faceNotCenteredText;
   var debugScalingDetails = useDebugScalingDetails({
     enabled: debugMode,
     pageWidth: width,
@@ -12319,6 +12345,8 @@ var IdVideoCapture = function IdVideoCapture(_a) {
     videoHeight: (_j = (_h = videoRef.current) === null || _h === void 0 ? void 0 : _h.videoHeight) !== null && _j !== void 0 ? _j : 0
   });
   var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK'].includes(requestedAction);
+  // const searchingForIdCard =
+  //   idCaptureModelsEnabled && capturingId && !goodFramesThresholdMet
   var guidanceText = !faceCentered ? faceNotCenteredText : undefined;
   return /*#__PURE__*/React__namespace.default.createElement(PageContainer, {
     ref: ref,
@@ -12344,14 +12372,15 @@ var IdVideoCapture = function IdVideoCapture(_a) {
     faceGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor,
     idCardGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor
   }), debugMode && capturingId && ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ObjectDetectionDebugOverlayDiv, {
-    "$flipX": !isRearFacing
+    "$flipX": !((_l = cameraRef.current) === null || _l === void 0 ? void 0 : _l.isRearFacing)
   }, detectedObjects.map(function (obj, i) {
+    var _a;
     return /*#__PURE__*/React__namespace.default.createElement(IdCaptureDetectedObjectDebugBox, {
       key: i,
       obj: obj,
       scaling: debugScalingDetails,
       color: "blue",
-      flipX: !isRearFacing
+      flipX: !((_a = cameraRef.current) === null || _a === void 0 ? void 0 : _a.isRearFacing)
     });
   })), /*#__PURE__*/React__namespace.default.createElement(DebugBoundingBoxOverlay, null, face && ( /*#__PURE__*/React__namespace.default.createElement(SelfieCaptureFaceDebugBox, {
     face: face,
@@ -12360,9 +12389,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
     className: classNames.guidanceMessageContainer
   }, /*#__PURE__*/React__namespace.default.createElement(GuidanceMessage, {
     className: classNames.guidanceMessage,
-    "$background": (_o = (_m = (_l = theme.guidanceMessages) === null || _l === void 0 ? void 0 : _l.negative) === null || _m === void 0 ? void 0 : _m.backgroundColor) !== null && _o !== void 0 ? _o : 'red',
-    "$textColor": (_r = (_q = (_p = theme.guidanceMessages) === null || _p === void 0 ? void 0 : _p.negative) === null || _q === void 0 ? void 0 : _q.textColor) !== null && _r !== void 0 ? _r : 'white'
-  }, guidanceText))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__namespace.default.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__namespace.default.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Best Frame Detection Score:", ' ', (_t = (_s = bestFrameDetails.current) === null || _s === void 0 ? void 0 : _s.detectionScore) !== null && _t !== void 0 ? _t : 0, /*#__PURE__*/React__namespace.default.createElement("br", null), "Best Frame Focus Score: ", (_v = (_u = bestFrameDetails.current) === null || _u === void 0 ? void 0 : _u.focusScore) !== null && _v !== void 0 ? _v : 0)), countdownRemaining > 0 && capturingId && ( /*#__PURE__*/React__namespace.default.createElement(CountdownContainer, {
+    "$background": (_p = (_o = (_m = theme.guidanceMessages) === null || _m === void 0 ? void 0 : _m.negative) === null || _o === void 0 ? void 0 : _o.backgroundColor) !== null && _p !== void 0 ? _p : 'red',
+    "$textColor": (_s = (_r = (_q = theme.guidanceMessages) === null || _q === void 0 ? void 0 : _q.negative) === null || _r === void 0 ? void 0 : _r.textColor) !== null && _s !== void 0 ? _s : 'white'
+  }, guidanceText))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, cameraRef.current ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", cameraRef.current.label, " (", cameraRef.current.width, "x", cameraRef.current.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__namespace.default.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__namespace.default.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Best Frame Detection Score:", ' ', (_u = (_t = bestFrameDetails.current) === null || _t === void 0 ? void 0 : _t.detectionScore) !== null && _u !== void 0 ? _u : 0, /*#__PURE__*/React__namespace.default.createElement("br", null), "Best Frame Focus Score: ", (_w = (_v = bestFrameDetails.current) === null || _v === void 0 ? void 0 : _v.focusScore) !== null && _w !== void 0 ? _w : 0)), countdownRemaining > 0 && capturingId && ( /*#__PURE__*/React__namespace.default.createElement(CountdownContainer, {
     className: classNames.countdownContainer
   }, /*#__PURE__*/React__namespace.default.createElement(Countdown, {
     className: classNames.countdown
@@ -12371,7 +12400,7 @@ var IdVideoCapture = function IdVideoCapture(_a) {
   }, /*#__PURE__*/React__namespace.default.createElement(CaptureButton, {
     finished: true,
     onClick: function onClick() {
-      return setCountdownStartedAt(new Date());
+      setCountdownStartedAt(new Date());
     },
     disabled: !!countdownStartedAt || frameLock.current,
     className: classNames.captureBtn
@@ -12659,14 +12688,16 @@ var VideoIdWizard = function VideoIdWizard(_a) {
       className: "flex"
     }, /*#__PURE__*/React__namespace.default.createElement(Spinner, null));
   }
-  return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
-    preferIphoneContinuityCamera: isCapturingId,
+  return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
+    key: "".concat(isCapturingId ? 'id' : 'selfie', "-camera-").concat(attempt),
+    preferContinuityCamera: isCapturingId,
     preferFrontFacingCamera: !isCapturingId,
     requireMicrophoneAccess: !isCapturingId && !!readTextPrompt,
     maxVideoWidth: isCapturingId ? 1920 : 1280,
     maxFps: isCapturingId ? 60 : 30,
     onCameraAccessDenied: onCameraAccessDenied,
-    onMicrophoneAccessDenied: onMicrophoneAccessDenied
+    onMicrophoneAccessDenied: onMicrophoneAccessDenied,
+    debugMode: debugMode
   }, /*#__PURE__*/React__namespace.default.createElement(IdCaptureModelsProvider, {
     autoStart: false,
     documentDetectionModelUrl: (_g = (_f = idCaptureProps.assets) === null || _f === void 0 ? void 0 : _f.documentDetectionModelUrl) !== null && _g !== void 0 ? _g : '',
@@ -12677,7 +12708,7 @@ var VideoIdWizard = function VideoIdWizard(_a) {
     autoStart: false,
     onModelError: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.onModelError,
     modelLoadTimeoutMs: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.modelLoadTimeoutMs,
-    requireVerticalFaceCentering: false
+    requireVerticalFaceCentering: captureState === 'CHECKING_LIVENESS'
   }, /*#__PURE__*/React__namespace.default.createElement(PageContainer, {
     className: "flex ".concat((_k = classNames.container) !== null && _k !== void 0 ? _k : '')
   }, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && /*#__PURE__*/React__namespace.default.createElement(CameraVideoTag, {
@@ -12792,15 +12823,17 @@ function CompositeWizard(_a) {
     _o = _a.captureSignatureVideo,
     captureSignatureVideo = _o === void 0 ? false : _o,
     onCameraAccessDenied = _a.onCameraAccessDenied,
-    onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied;
-  var _p = React.useContext(SubmissionContext),
-    submit = _p.submit,
-    submissionStatus = _p.submissionStatus,
-    setSignatureData = _p.setSignatureData,
-    setAdditionalDocuments = _p.setAdditionalDocuments;
-  var _q = React.useState(0),
-    checkIndex = _q[0],
-    setCheckIndex = _q[1];
+    onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
+    _p = _a.debugMode,
+    debugMode = _p === void 0 ? false : _p;
+  var _q = React.useContext(SubmissionContext),
+    submit = _q.submit,
+    submissionStatus = _q.submissionStatus,
+    setSignatureData = _q.setSignatureData,
+    setAdditionalDocuments = _q.setAdditionalDocuments;
+  var _r = React.useState(0),
+    checkIndex = _r[0],
+    setCheckIndex = _r[1];
   var checks = React.useMemo(function () {
     var _a, _b;
     var checks = __spreadArray([], userChecks, true);
@@ -12878,6 +12911,16 @@ function CompositeWizard(_a) {
       return i + 1;
     });
   }, [onVideoSignatureCompleteProp]);
+  var _s = React.useState(0),
+    videoSignatureAttempts = _s[0],
+    setVideoSignatureAttempts = _s[1];
+  var onVideoSignatureRetryProp = videoSignatureCaptureProps.onRetryClicked;
+  var onVideoSignatureRetry = React.useCallback(function () {
+    onVideoSignatureRetryProp === null || onVideoSignatureRetryProp === void 0 ? void 0 : onVideoSignatureRetryProp();
+    setVideoSignatureAttempts(function (n) {
+      return n + 1;
+    });
+  }, [onVideoSignatureRetryProp]);
   var onAdditionalDocumentCaptureCompleteProp = additionalDocumentCaptureProps === null || additionalDocumentCaptureProps === void 0 ? void 0 : additionalDocumentCaptureProps.onComplete;
   var onAdditionalDocumentCaptureComplete = React.useCallback(function (uploadedDocuments) {
     setAdditionalDocuments(uploadedDocuments);
@@ -12906,9 +12949,11 @@ function CompositeWizard(_a) {
   }
   switch (checks[checkIndex]) {
     case 'IdCapture':
-      return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
+      return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
+        key: "IdCaptureCamera",
         onCameraAccessDenied: onCameraAccessDenied,
-        onMicrophoneAccessDenied: onMicrophoneAccessDenied
+        onMicrophoneAccessDenied: onMicrophoneAccessDenied,
+        debugMode: debugMode
       }, /*#__PURE__*/React__namespace.default.createElement(IdCaptureModelsProvider, {
         autoStart: false,
         documentDetectionModelUrl: (_d = (_c = idCaptureProps.assets) === null || _c === void 0 ? void 0 : _c.documentDetectionModelUrl) !== null && _d !== void 0 ? _d : '',
@@ -12925,11 +12970,13 @@ function CompositeWizard(_a) {
         onMicrophoneAccessDenied: onMicrophoneAccessDenied
       }));
     case 'FaceLiveness':
-      return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
+      return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
+        key: "FaceLivenessCamera",
         preferFrontFacingCamera: true,
-        preferIphoneContinuityCamera: false,
+        preferContinuityCamera: false,
         onCameraAccessDenied: onCameraAccessDenied,
-        onMicrophoneAccessDenied: onMicrophoneAccessDenied
+        onMicrophoneAccessDenied: onMicrophoneAccessDenied,
+        debugMode: debugMode
       }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
         autoStart: false,
         onModelError: faceLivenessProps.onModelError,
@@ -12942,13 +12989,15 @@ function CompositeWizard(_a) {
         onAccept: onSignatureCaptureSuccess
       }));
     case 'VideoSignatureCapture':
-      return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
-        preferIphoneContinuityCamera: false,
+      return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
+        key: "SignatureKycCamera-".concat(videoSignatureAttempts),
+        preferContinuityCamera: false,
         preferFrontFacingCamera: true,
         maxVideoWidth: 1280,
         maxFps: 30,
         onCameraAccessDenied: onCameraAccessDenied,
-        onMicrophoneAccessDenied: onMicrophoneAccessDenied
+        onMicrophoneAccessDenied: onMicrophoneAccessDenied,
+        debugMode: debugMode
       }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
         autoStart: false,
         throttleMs: 250,
@@ -12956,7 +13005,8 @@ function CompositeWizard(_a) {
         modelLoadTimeoutMs: videoSignatureCaptureProps.modelLoadTimeoutMs,
         requireVerticalFaceCentering: false
       }, /*#__PURE__*/React__namespace.default.createElement(VideoSignatureWizard, _assign({}, videoSignatureCaptureProps, {
-        onComplete: onVideoSignatureComplete
+        onComplete: onVideoSignatureComplete,
+        onRetryClicked: onVideoSignatureRetry
       }))));
     case 'AdditionalDocumentCapture':
       return /*#__PURE__*/React__namespace.default.createElement(AdditionalDocumentCaptureWizard, _assign({}, additionalDocumentCaptureProps, {
@@ -13407,7 +13457,8 @@ var IdValidation = function IdValidation(_a) {
     videoSignatureCaptureProps: videoSignatureCaptureProps,
     captureSignature: captureSignature,
     captureSignatureVideo: captureSignatureVideo,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }))));
 };
 
@@ -13513,7 +13564,8 @@ var FaceValidation = function FaceValidation(_a) {
       return ['FaceLiveness'];
     }, []),
     faceLivenessProps: faceLivenessProps,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }))));
 };
 
@@ -13746,7 +13798,8 @@ var IdAndFaceValidation = function IdAndFaceValidation(_a) {
     additionalDocumentCaptureProps: additionalDocumentCaptureProps,
     captureSignature: captureSignature,
     captureSignatureVideo: captureSignatureVideo,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }))));
 };
 
@@ -14001,7 +14054,8 @@ var CustomerIdAndBiometricsEnrollment = function CustomerIdAndBiometricsEnrollme
     videoSignatureCaptureProps: videoSignatureCaptureProps,
     captureSignature: captureSignature,
     captureSignatureVideo: captureSignatureVideo,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }))));
 };
 
@@ -14333,7 +14387,7 @@ var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
   var _l = React.useState('LOADING'),
     captureState = _l[0],
     setCaptureState = _l[1];
-  var _m = useCameraStore(),
+  var _m = React.useContext(CameraStateContext),
     cameraAccessDenied = _m.cameraAccessDenied,
     releaseCameraAccess = _m.releaseCameraAccess;
   var _o = React.useContext(SelfieGuidanceModelsContext),
@@ -14539,9 +14593,10 @@ var CustomerVerification = function CustomerVerification(_a) {
     onSubmit: onSubmit,
     geolocationEnabled: geolocationEnabled,
     geolocationRequired: geolocationRequired
-  }, /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
+  }, /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
     preferFrontFacingCamera: true,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
     autoStart: false,
     onModelError: onModelError,
@@ -14890,7 +14945,7 @@ var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
   var _l = React.useState('LOADING'),
     captureState = _l[0],
     setCaptureState = _l[1];
-  var _m = useCameraStore(),
+  var _m = React.useContext(CameraStateContext),
     cameraAccessDenied = _m.cameraAccessDenied,
     releaseCameraAccess = _m.releaseCameraAccess;
   var _o = React.useContext(SelfieGuidanceModelsContext),
@@ -15094,9 +15149,10 @@ var CustomerIdentification = function CustomerIdentification(_a) {
     onSubmit: onSubmit,
     geolocationEnabled: geolocationEnabled,
     geolocationRequired: geolocationRequired
-  }, /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
+  }, /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
     preferFrontFacingCamera: true,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
     autoStart: false,
     modelLoadTimeoutMs: modelLoadTimeoutMs,
@@ -15423,7 +15479,8 @@ var VideoIdValidation = function VideoIdValidation(_a) {
     captureSignature: captureSignature,
     captureSignatureVideo: captureSignatureVideo,
     onCameraAccessDenied: onCameraAccessDenied,
-    onMicrophoneAccessDenied: onMicrophoneAccessDenied
+    onMicrophoneAccessDenied: onMicrophoneAccessDenied,
+    debugMode: debugMode
   }))));
 };
 
@@ -15580,7 +15637,8 @@ var CustomerBiometricsEnrollment = function CustomerBiometricsEnrollment(_a) {
     videoSignatureCaptureProps: videoSignatureCaptureProps,
     captureSignature: captureSignature,
     captureSignatureVideo: captureSignatureVideo,
-    onCameraAccessDenied: onCameraAccessDenied
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }))));
 };
 
@@ -15638,10 +15696,11 @@ var DocumentCapture = function DocumentCapture(_a) {
     onDocumentUploadFailed: onDocumentUploadFailed,
     geolocationEnabled: geolocationEnabled,
     geolocationRequired: geolocationRequired
-  }, /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
+  }, /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
     requestAccessAutomatically: false,
-    preferIphoneContinuityCamera: true,
-    onCameraAccessDenied: onCameraAccessDenied
+    preferContinuityCamera: true,
+    onCameraAccessDenied: onCameraAccessDenied,
+    debugMode: debugMode
   }, /*#__PURE__*/React__namespace.default.createElement(DocumentCaptureWizard, {
     onSuccess: onComplete,
     onExitCapture: onExitCapture,