idmission-web-sdk 2.2.45 → 2.2.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/dist/components/CompositeWizard.d.ts +2 -1
  2. package/dist/components/CompositeWizard.d.ts.map +1 -1
  3. package/dist/components/camera/CameraAccessDeniedOverlay.d.ts.map +1 -1
  4. package/dist/components/camera/CameraProvider.d.ts +17 -0
  5. package/dist/components/camera/CameraProvider.d.ts.map +1 -0
  6. package/dist/components/camera/CameraVideoTag.d.ts +4 -2
  7. package/dist/components/camera/CameraVideoTag.d.ts.map +1 -1
  8. package/dist/components/camera/MicrophoneAccessDeniedOverlay.d.ts.map +1 -1
  9. package/dist/components/customer_flows/CustomerBiometricsEnrollment.d.ts.map +1 -1
  10. package/dist/components/customer_flows/CustomerIdAndBiometricsEnrollment.d.ts.map +1 -1
  11. package/dist/components/customer_flows/CustomerIdentification.d.ts.map +1 -1
  12. package/dist/components/customer_flows/CustomerVerification.d.ts.map +1 -1
  13. package/dist/components/customer_flows/DocumentCapture.d.ts.map +1 -1
  14. package/dist/components/customer_flows/FaceValidation.d.ts.map +1 -1
  15. package/dist/components/customer_flows/IdAndFaceValidation.d.ts.map +1 -1
  16. package/dist/components/customer_flows/IdValidation.d.ts.map +1 -1
  17. package/dist/components/customer_flows/VideoIdValidation.d.ts.map +1 -1
  18. package/dist/components/customer_identification/CustomerIdentificationWizard.d.ts +1 -1
  19. package/dist/components/customer_identification/CustomerIdentificationWizard.d.ts.map +1 -1
  20. package/dist/components/customer_verification/CustomerVerificationWizard.d.ts.map +1 -1
  21. package/dist/components/document_capture/DocumentCaptureScreen.d.ts.map +1 -1
  22. package/dist/components/document_capture/DocumentCaptureStateProvider.d.ts.map +1 -1
  23. package/dist/components/face_liveness/FaceLivenessWizard.d.ts.map +1 -1
  24. package/dist/components/id_capture/DocumentDetectionModelProvider.d.ts.map +1 -1
  25. package/dist/components/id_capture/FocusModelProvider.d.ts.map +1 -1
  26. package/dist/components/id_capture/IdCapture.d.ts.map +1 -1
  27. package/dist/components/id_capture/IdCaptureGuides.d.ts.map +1 -1
  28. package/dist/components/id_capture/IdCaptureLoadingOverlayDefault.d.ts.map +1 -1
  29. package/dist/components/id_capture/IdCaptureLoadingOverlayLegacy.d.ts.map +1 -1
  30. package/dist/components/id_capture/IdCaptureWizard.d.ts.map +1 -1
  31. package/dist/components/selfie_capture/SelfieCapture.d.ts.map +1 -1
  32. package/dist/components/selfie_capture/SelfieCaptureLoadingOverlayDefault.d.ts.map +1 -1
  33. package/dist/components/selfie_capture/SelfieCaptureLoadingOverlayLegacy.d.ts.map +1 -1
  34. package/dist/components/selfie_capture/SelfieGuidanceModelsProvider.d.ts.map +1 -1
  35. package/dist/components/submission/SubmissionProvider.d.ts.map +1 -1
  36. package/dist/components/video_id/IdVideoCapture.d.ts.map +1 -1
  37. package/dist/components/video_id/IdVideoCaptureFlipIdPrompt.d.ts.map +1 -1
  38. package/dist/components/video_id/IdVideoCaptureGuides.d.ts.map +1 -1
  39. package/dist/components/video_id/IdVideoCaptureWizard.d.ts.map +1 -1
  40. package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts.map +1 -1
  41. package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts.map +1 -1
  42. package/dist/lib/camera/Camera.d.ts +0 -4
  43. package/dist/lib/camera/Camera.d.ts.map +1 -1
  44. package/dist/lib/models/DocumentDetection.d.ts +1 -3
  45. package/dist/lib/models/DocumentDetection.d.ts.map +1 -1
  46. package/dist/lib/models/FaceDetection.d.ts +1 -3
  47. package/dist/lib/models/FaceDetection.d.ts.map +1 -1
  48. package/dist/lib/models/Focus.d.ts +1 -3
  49. package/dist/lib/models/Focus.d.ts.map +1 -1
  50. package/dist/sdk2.cjs.development.js +1300 -1239
  51. package/dist/sdk2.cjs.development.js.map +1 -1
  52. package/dist/sdk2.cjs.production.js +1 -1
  53. package/dist/sdk2.cjs.production.js.map +1 -1
  54. package/dist/sdk2.esm.js +1300 -1239
  55. package/dist/sdk2.esm.js.map +1 -1
  56. package/dist/sdk2.umd.development.js +1238 -1294
  57. package/dist/sdk2.umd.development.js.map +1 -1
  58. package/dist/sdk2.umd.production.js +1 -1
  59. package/dist/sdk2.umd.production.js.map +1 -1
  60. package/dist/version.d.ts +1 -1
  61. package/package.json +4 -5
  62. package/dist/lib/camera/cameraStore.d.ts +0 -52
  63. package/dist/lib/camera/cameraStore.d.ts.map +0 -1
  64. package/dist/lib/camera/videoRefStack.d.ts +0 -6
  65. package/dist/lib/camera/videoRefStack.d.ts.map +0 -1
@@ -9,12 +9,10 @@ var tusJsClient = require('tus-js-client');
9
9
  var SparkMD5 = require('spark-md5');
10
10
  var useResizeObserver = require('use-resize-observer');
11
11
  var tasksVision = require('@mediapipe/tasks-vision');
12
- var zustand = require('zustand');
13
12
  var useDebounce = require('use-debounce');
14
13
  var reactDom = require('react-dom');
15
14
  var LanguageDetector = require('i18next-browser-languagedetector');
16
15
  var i18n = require('i18next');
17
- var shallow = require('zustand/react/shallow');
18
16
  var SignatureCanvas = require('react-signature-canvas');
19
17
 
20
18
  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
234
232
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
235
233
  };
236
234
 
237
- var webSdkVersion = '2.2.45';
235
+ var webSdkVersion = '2.2.47';
238
236
 
239
237
  function getPlatform() {
240
238
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -803,11 +801,11 @@ function setDefaultAuthUrl(url) {
803
801
  if (!allowedAuthUrls.includes(url)) throw new Error('invalid auth url');
804
802
  exports.defaultAuthUrl = url;
805
803
  }
806
- var initialState$6 = {
804
+ var initialState$5 = {
807
805
  authUrl: exports.defaultAuthUrl,
808
806
  sessionCheckState: 'READY'
809
807
  };
810
- var AuthStateContext = /*#__PURE__*/React.createContext(initialState$6);
808
+ var AuthStateContext = /*#__PURE__*/React.createContext(initialState$5);
811
809
  var AuthDispatchContext = /*#__PURE__*/React.createContext(function () {});
812
810
  var reducer$4 = function reducer(state, action) {
813
811
  switch (action.type) {
@@ -839,7 +837,7 @@ function useAuthReducer(authUrl, sessionId) {
839
837
  if (authUrl === void 0) {
840
838
  authUrl = exports.defaultAuthUrl;
841
839
  }
842
- var _a = React.useReducer(reducer$4, _assign(_assign({}, initialState$6), {
840
+ var _a = React.useReducer(reducer$4, _assign(_assign({}, initialState$5), {
843
841
  authUrl: authUrl
844
842
  })),
845
843
  state = _a[0],
@@ -1352,7 +1350,8 @@ var SubmissionProvider = function SubmissionProvider(_a) {
1352
1350
  }
1353
1351
  };
1354
1352
  _e = {
1355
- filetype: blob.type
1353
+ filetype: blob.type,
1354
+ contentType: blob.type
1356
1355
  };
1357
1356
  return [4 /*yield*/, calculateMd5(blob)];
1358
1357
  case 3:
@@ -1919,48 +1918,6 @@ function calculateMd5(blob) {
1919
1918
  });
1920
1919
  }
1921
1920
 
1922
- var visionTasksBasePath = "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.7/wasm";
1923
- var visionRuntimePreloading = false;
1924
- function preloadVisionRuntime() {
1925
- return __awaiter(this, void 0, void 0, function () {
1926
- function handleDownloadProgress(event) {
1927
- var detail = event.detail;
1928
- if (detail.url !== url) return;
1929
- progressByUseCase.visionRuntime = sumUpProgressForDependencies([url]);
1930
- document.dispatchEvent(new CustomEvent('idmission.preloadProgress.visionRuntime', {
1931
- detail: progressByUseCase.visionRuntime
1932
- }));
1933
- }
1934
- var url;
1935
- return __generator(this, function (_a) {
1936
- switch (_a.label) {
1937
- case 0:
1938
- if (visionRuntimePreloading) return [2 /*return*/, new Promise(function (resolve) {
1939
- setInterval(function () {
1940
- if (!visionRuntimePreloading) resolve();
1941
- }, 100);
1942
- })];
1943
- visionRuntimePreloading = true;
1944
- url = "".concat(visionTasksBasePath, "/vision_wasm_internal.wasm");
1945
- document.addEventListener('idmission.preloadProgress', handleDownloadProgress);
1946
- _a.label = 1;
1947
- case 1:
1948
- _a.trys.push([1,, 3, 4]);
1949
- return [4 /*yield*/, preloadDependency(url)];
1950
- case 2:
1951
- _a.sent();
1952
- return [3 /*break*/, 4];
1953
- case 3:
1954
- document.removeEventListener('idmission.preloadProgress', handleDownloadProgress);
1955
- visionRuntimePreloading = false;
1956
- return [7 /*endfinally*/];
1957
- case 4:
1958
- return [2 /*return*/];
1959
- }
1960
- });
1961
- });
1962
- }
1963
-
1964
1921
  function getFrameDimensions(frame) {
1965
1922
  var frameWidth = frame.width,
1966
1923
  frameHeight = frame.height;
@@ -1997,219 +1954,827 @@ function clearCanvas(canvas) {
1997
1954
  }
1998
1955
  var templateObject_1$G;
1999
1956
 
2000
- function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
2001
- if (quality === void 0) {
2002
- quality = 0.92;
2003
- }
2004
- if (!rawCanvas || !cropCanvas || !resizeCanvas) return '';
2005
- var rawCtx = rawCanvas.getContext('2d');
2006
- var cropCtx = cropCanvas.getContext('2d');
2007
- var resizeCtx = resizeCanvas.getContext('2d');
2008
- if (!rawCtx || !cropCtx || !resizeCtx) throw new Error('could not get 2d context');
2009
- rawCanvas.width = frame.width;
2010
- rawCanvas.height = frame.height;
2011
- rawCtx.putImageData(frame, 0, 0);
2012
- if (frame.height > frame.width) {
2013
- cropCanvas.width = frame.width;
2014
- cropCanvas.height = frame.height;
2015
- cropCtx.drawImage(rawCanvas, 0, 0, cropCanvas.width, cropCanvas.height);
2016
- } else {
2017
- var _a = face.box,
2018
- xMin = _a.xMin,
2019
- width = _a.width;
2020
- var desiredWidth = frame.height * 0.6;
2021
- var faceCenterX = xMin + width / 2;
2022
- var xPos = Math.max(0, faceCenterX - desiredWidth / 2);
2023
- cropCanvas.width = desiredWidth;
2024
- cropCanvas.height = frame.height;
2025
- cropCtx.drawImage(rawCanvas, xPos, 0, cropCanvas.width, cropCanvas.height, 0, 0, cropCanvas.width, cropCanvas.height);
2026
- }
2027
- resizeCanvas.height = maxHeight !== null && maxHeight !== void 0 ? maxHeight : cropCanvas.height;
2028
- resizeCanvas.width = cropCanvas.width * (resizeCanvas.height / cropCanvas.height);
2029
- resizeCtx === null || resizeCtx === void 0 ? void 0 : resizeCtx.drawImage(cropCanvas, 0, 0, resizeCanvas.width, resizeCanvas.height);
2030
- var dataURL = resizeCanvas.toDataURL('image/jpeg', quality);
2031
- log('cropToShoulders size', new TextEncoder().encode(dataURL).length);
2032
- clearCanvas(rawCanvas);
2033
- clearCanvas(cropCanvas);
2034
- clearCanvas(resizeCanvas);
2035
- return dataURL;
2036
- }
2037
- function cropToDetectedObjectBox(frame, box, canvas) {
2038
- canvas || (canvas = document.createElement('canvas'));
2039
- var ctx = canvas.getContext('2d');
2040
- if (!ctx) throw new Error('could not get 2d context');
2041
- var xMin = box.xMin,
2042
- yMin = box.yMin,
2043
- width = box.width,
2044
- height = box.height;
2045
- canvas.width = width;
2046
- canvas.height = height;
2047
- ctx.drawImage(frame, xMin, yMin, width, height, 0, 0, width, height);
2048
- return canvas;
2049
- }
2050
-
2051
- var defaultImageSegmenterModelPath = 'https://websdk-cdn-dev.idmission.com/assets/models/selfiesegmenter20240524/selfie_segmenter.tflite';
2052
- var imageSegmenterModelSizeInBytes = 256440.32;
2053
- // 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
2054
- // isn't fooled by cache times, but subsequent downloads of the vision runtime still do load from the cache.
2055
- var tinyModelCacheKey = new Date().getTime();
2056
- var initialModelCapabilities = {
2057
- probeState: 'notProbed',
2058
- delegate: 'GPU',
2059
- networkTier: 'untested',
2060
- networkSpeed: 0,
2061
- networkTestTime: 0
2062
- };
2063
- var modelCapabilities = _assign({}, initialModelCapabilities);
2064
- function probeModelCapabilities() {
2065
- return __awaiter(this, void 0, void 0, function () {
2066
- var error_1, error_2;
1957
+ function listAvailableCameras(facingMode_1) {
1958
+ return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
1959
+ var cameraEnumerationStream, videoDevices;
1960
+ if (requestMicAccess === void 0) {
1961
+ requestMicAccess = false;
1962
+ }
2067
1963
  return __generator(this, function (_a) {
2068
1964
  switch (_a.label) {
2069
1965
  case 0:
2070
- if (modelCapabilities.probeState === 'probed') return [2 /*return*/];
2071
- if (modelCapabilities.probeState === 'probing') return [2 /*return*/, new Promise(function (resolve) {
2072
- setInterval(function () {
2073
- if (modelCapabilities.probeState === 'probed') resolve();
2074
- }, 100);
2075
- })];
2076
- modelCapabilities.probeState = 'probing';
2077
- return [4 /*yield*/, preloadVisionRuntime()];
1966
+ return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
1967
+ video: {
1968
+ facingMode: {
1969
+ exact: facingMode
1970
+ }
1971
+ },
1972
+ audio: requestMicAccess
1973
+ })
1974
+ // This lists all available cameras attached to the user's device.
1975
+ ];
2078
1976
  case 1:
2079
- _a.sent();
2080
- _a.label = 2;
1977
+ cameraEnumerationStream = _a.sent();
1978
+ return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
2081
1979
  case 2:
2082
- _a.trys.push([2, 4, 9, 10]);
2083
- log('Model Probing: testing GPU capabilities...');
2084
- return [4 /*yield*/, loadTinyModel('GPU')];
2085
- case 3:
2086
- _a.sent();
2087
- log('Model Probing: GPU is capable.');
2088
- return [3 /*break*/, 10];
2089
- case 4:
2090
- error_1 = _a.sent();
2091
- warn('Model Probing: GPU delegate could not be loaded', error_1);
2092
- modelCapabilities.delegate = 'CPU';
2093
- _a.label = 5;
2094
- case 5:
2095
- _a.trys.push([5, 7,, 8]);
2096
- log('Model Probing: testing CPU capabilities...');
2097
- return [4 /*yield*/, loadTinyModel('CPU')];
2098
- case 6:
2099
- _a.sent();
2100
- log('Model Probing: CPU is capable.');
2101
- return [3 /*break*/, 8];
2102
- case 7:
2103
- error_2 = _a.sent();
2104
- warn('Model Probing: CPU delegate could not be loaded', error_2);
2105
- modelCapabilities.delegate = 'NONE';
2106
- return [3 /*break*/, 8];
2107
- case 8:
2108
- return [3 /*break*/, 10];
2109
- case 9:
2110
- modelCapabilities.probeState = 'probed';
2111
- return [7 /*endfinally*/];
2112
- case 10:
2113
- return [2 /*return*/];
1980
+ videoDevices = _a.sent().filter(function (_a) {
1981
+ var kind = _a.kind;
1982
+ return kind === 'videoinput';
1983
+ });
1984
+ // Release the access to the user's camera that we obtained for enumeration purposes.
1985
+ cameraEnumerationStream.getVideoTracks().forEach(function (track) {
1986
+ track.enabled = false;
1987
+ track.stop();
1988
+ });
1989
+ cameraEnumerationStream = null;
1990
+ return [2 /*return*/, videoDevices];
2114
1991
  }
2115
1992
  });
2116
1993
  });
2117
1994
  }
2118
- function loadTinyModel() {
2119
- return __awaiter(this, arguments, void 0, function (delegate, maxTime) {
2120
- var modelAssetPath, startedAt, e_1, time, speedMbps, model, _a, _b, emptyFrame;
2121
- if (delegate === void 0) {
2122
- delegate = 'GPU';
1995
+ 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) {
1996
+ return s.toLocaleLowerCase().split(' ').join('');
1997
+ });
1998
+ 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) {
1999
+ return s.toLocaleLowerCase().split(' ').join('');
2000
+ });
2001
+ 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) {
2002
+ return s.toLocaleLowerCase().split(' ').join('');
2003
+ });
2004
+ var labelMatches = function labelMatches(labelOrDevice, labelSetOrLabel) {
2005
+ var label = labelOrDevice instanceof MediaDeviceInfo ? getDeviceLabel(labelOrDevice) : labelOrDevice;
2006
+ var labelSet = typeof labelSetOrLabel === 'string' ? [labelSetOrLabel] : labelSetOrLabel;
2007
+ return labelSet.some(function (l) {
2008
+ return label.includes(l);
2009
+ });
2010
+ };
2011
+ var getDeviceLabel = function getDeviceLabel(deviceInfo) {
2012
+ return deviceInfo.label.toLocaleLowerCase().split(' ').join('');
2013
+ };
2014
+ var currentCamera;
2015
+ var currentAudioStream;
2016
+ function obtainCameraAccess(stream, deviceLabel, video) {
2017
+ releaseCameraAccess();
2018
+ log('obtaining camera access...');
2019
+ var _a = stream.getVideoTracks()[0].getSettings(),
2020
+ width = _a.width,
2021
+ height = _a.height;
2022
+ var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
2023
+ var isRearFacing = labelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearLabels, true), backUltraWideLabels, true), ['iphone'], false));
2024
+ var release = function release() {
2025
+ stream.getTracks().forEach(function (track) {
2026
+ track.enabled = false;
2027
+ track.stop();
2028
+ });
2029
+ if (video) {
2030
+ video.pause();
2031
+ video.srcObject = null;
2032
+ video.src = '';
2123
2033
  }
2124
- if (maxTime === void 0) {
2125
- maxTime = 10000;
2034
+ };
2035
+ width || (width = 0);
2036
+ height || (height = 0);
2037
+ currentCamera = {
2038
+ label: deviceLabel,
2039
+ stream: stream,
2040
+ width: width,
2041
+ height: height,
2042
+ isRearFacing: isRearFacing,
2043
+ release: release
2044
+ };
2045
+ if (video) video.srcObject = stream;
2046
+ return currentCamera;
2047
+ }
2048
+ function releaseCameraAccess() {
2049
+ if (!currentCamera) return;
2050
+ log('releasing camera access...');
2051
+ currentCamera.release();
2052
+ currentCamera = undefined;
2053
+ }
2054
+ function releaseMicrophoneAccess() {
2055
+ var _a;
2056
+ if (!currentAudioStream) return;
2057
+ log('releasing microphone access...');
2058
+ (_a = currentAudioStream.stop) === null || _a === void 0 ? void 0 : _a.call(currentAudioStream);
2059
+ currentAudioStream.getAudioTracks().forEach(function (t) {
2060
+ var _a;
2061
+ (_a = t.stop) === null || _a === void 0 ? void 0 : _a.call(t);
2062
+ });
2063
+ currentAudioStream = undefined;
2064
+ }
2065
+ function usePreferredCaptureDevice(_a) {
2066
+ var _b = _a === void 0 ? {} : _a,
2067
+ _c = _b.requestAccessAutomatically,
2068
+ requestAccessAutomatically = _c === void 0 ? true : _c,
2069
+ _d = _b.preferFrontFacingCamera,
2070
+ preferFrontFacingCamera = _d === void 0 ? false : _d,
2071
+ _e = _b.preferContinuityCamera,
2072
+ preferContinuityCamera = _e === void 0 ? true : _e,
2073
+ _f = _b.requireMicrophoneAccess,
2074
+ requireMicrophoneAccess = _f === void 0 ? false : _f,
2075
+ _g = _b.maxVideoWidth,
2076
+ maxVideoWidth = _g === void 0 ? 1920 : _g,
2077
+ maxFps = _b.maxFps,
2078
+ _h = _b.debugMode,
2079
+ debugMode = _h === void 0 ? false : _h;
2080
+ var videoRef = React.useRef(null);
2081
+ var videoRefStack = React.useRef([]);
2082
+ var cameraRef = React.useRef(null);
2083
+ var _j = React.useState(false),
2084
+ cameraReady = _j[0],
2085
+ setCameraReady = _j[1];
2086
+ var _k = React.useState(false),
2087
+ microphoneReady = _k[0],
2088
+ setMicrophoneReady = _k[1];
2089
+ var _l = React.useState(null),
2090
+ videoDevice = _l[0],
2091
+ setVideoDevice = _l[1];
2092
+ var _m = React.useState(null),
2093
+ audioStream = _m[0],
2094
+ setAudioStream = _m[1];
2095
+ var _o = React.useState(false),
2096
+ videoLoaded = _o[0],
2097
+ setVideoLoaded = _o[1];
2098
+ var _p = React.useState(false),
2099
+ iphoneContinuityCameraAvailable = _p[0],
2100
+ setIphoneContinuityCameraAvailable = _p[1];
2101
+ var _q = React.useState(preferContinuityCamera),
2102
+ iphoneContinuityCameraAllowed = _q[0],
2103
+ setIphoneContinuityCameraAllowed = _q[1];
2104
+ var _r = React.useState(false),
2105
+ iphoneContinuityCameraDenied = _r[0],
2106
+ setIphoneContinuityCameraDenied = _r[1];
2107
+ var _s = React.useState(false),
2108
+ cameraAccessDenied = _s[0],
2109
+ setCameraAccessDenied = _s[1];
2110
+ var _t = React.useState(false),
2111
+ microphoneAccessDenied = _t[0],
2112
+ setMicrophoneAccessDenied = _t[1];
2113
+ var videoRefElement = videoRef.current;
2114
+ React.useEffect(function pushVideoRefToStackWhenChanged() {
2115
+ // proceed if the video element being mounted is not already at the top of the videoRefStack.
2116
+ var topOfStack = videoRefStack.current.slice(-1)[0];
2117
+ if (videoRefElement && videoRefElement !== topOfStack) {
2118
+ log('adding video to stack', videoRefElement);
2119
+ videoRefStack.current.push(videoRefElement);
2120
+ }
2121
+ }, [videoRefElement]);
2122
+ var onVideoUnmounted = React.useCallback(function (videoElement) {
2123
+ log('removing video from stack', videoElement);
2124
+ videoRefStack.current = videoRefStack.current.filter(function (v) {
2125
+ return v !== videoElement;
2126
+ });
2127
+ videoRef.current = videoRefStack.current.slice(-1)[0]; // top of stack.
2128
+ log('new videoRef is', videoRef.current);
2129
+ }, []);
2130
+ React.useEffect(function resetCameraOnContinuityPreferenceChanged() {
2131
+ if (debugMode) {
2132
+ log('iphone continuity camera allowed changed', iphoneContinuityCameraAllowed);
2126
2133
  }
2127
- return __generator(this, function (_c) {
2128
- switch (_c.label) {
2129
- case 0:
2130
- modelAssetPath = "".concat(defaultImageSegmenterModelPath, "?_=").concat(tinyModelCacheKey);
2131
- startedAt = new Date();
2132
- _c.label = 1;
2134
+ releaseCameraAccess();
2135
+ cameraRef.current = null;
2136
+ setVideoLoaded(false);
2137
+ }, [debugMode, iphoneContinuityCameraAllowed]);
2138
+ // NOTE: the bound callback function here is called requestCameraAccess, because
2139
+ // it initiates the useEffect chain that results in camera access being requested
2140
+ // (requestCameraAccessAutomatically -> chooseFromAvailableCameras -> accessChosenCamera).
2141
+ //
2142
+ // We chose to title the inner function "chooseFromAvailableCameras" because
2143
+ // that's all it literally does -- the available cameras are enumerated, and then
2144
+ // the result is parsed to decide which one we like best, which is then passed to
2145
+ // setVideoDevice, which causes accessChosenCamera to trigger.
2146
+ //
2147
+ // I am not a huge fan of getUserMedia's design -- you need to call it twice in order
2148
+ // to select the "best" camera for your application's purposes.
2149
+ var requestCameraAccess = React.useCallback(function chooseFromAvailableCameras() {
2150
+ return __awaiter(this, void 0, void 0, function () {
2151
+ var availableCameras, selectedCamera, platform_1, iphoneContinuityCamera, e_1;
2152
+ var _a, _b;
2153
+ return __generator(this, function (_c) {
2154
+ switch (_c.label) {
2155
+ case 0:
2156
+ setCameraReady(false);
2157
+ setCameraAccessDenied(false);
2158
+ _c.label = 1;
2159
+ case 1:
2160
+ _c.trys.push([1, 3,, 4]);
2161
+ return [4 /*yield*/, listAvailableCameras()];
2162
+ case 2:
2163
+ availableCameras = _c.sent();
2164
+ selectedCamera = void 0;
2165
+ if (debugMode) {
2166
+ log('availableCameras', availableCameras);
2167
+ }
2168
+ platform_1 = getPlatform();
2169
+ if (debugMode) {
2170
+ log('platformDetails', platform_1);
2171
+ }
2172
+ if (!iphoneContinuityCameraDenied && (!(platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) || platform_1.os.family === 'OS X')) {
2173
+ iphoneContinuityCamera = availableCameras.find(function (deviceInfo) {
2174
+ return labelMatches(deviceInfo, 'iphone');
2175
+ });
2176
+ setIphoneContinuityCameraAvailable(!!iphoneContinuityCamera);
2177
+ if (iphoneContinuityCamera && iphoneContinuityCameraAllowed) {
2178
+ selectedCamera = iphoneContinuityCamera;
2179
+ }
2180
+ } 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) {
2181
+ return c.label.startsWith('camera2 ');
2182
+ })) {
2183
+ availableCameras = availableCameras.sort(function (a, b) {
2184
+ return a.label.toLowerCase().localeCompare(b.label.toLowerCase());
2185
+ });
2186
+ if (debugMode) {
2187
+ log('cameras have been sorted', availableCameras);
2188
+ }
2189
+ }
2190
+ if (preferFrontFacingCamera) {
2191
+ selectedCamera = availableCameras.find(function (deviceInfo) {
2192
+ return labelMatches(deviceInfo, frontLabels);
2193
+ });
2194
+ }
2195
+ selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
2196
+ return labelMatches(deviceInfo, 'backtriplecamera');
2197
+ }));
2198
+ selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
2199
+ return labelMatches(deviceInfo, 'backdualcamera');
2200
+ }));
2201
+ selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
2202
+ return labelMatches(deviceInfo, rearLabels) && !labelMatches(deviceInfo, backUltraWideLabels);
2203
+ }));
2204
+ selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
2205
+ return labelMatches(deviceInfo, rearLabels);
2206
+ }));
2207
+ // on iOS, the front facing camera always is at the first position in the list, so we skip it if all else fails.
2208
+ 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) {
2209
+ selectedCamera || (selectedCamera = availableCameras[1]);
2210
+ }
2211
+ selectedCamera || (selectedCamera = availableCameras[0]);
2212
+ if (debugMode) log('selectedCamera', selectedCamera);
2213
+ setVideoDevice(selectedCamera);
2214
+ return [3 /*break*/, 4];
2215
+ case 3:
2216
+ e_1 = _c.sent();
2217
+ if (e_1.name === 'NotAllowedError') {
2218
+ error('camera access has been blocked by the user', e_1);
2219
+ setCameraAccessDenied(true);
2220
+ } else {
2221
+ error('camera access encountered some other error', e_1);
2222
+ throw e_1;
2223
+ }
2224
+ return [3 /*break*/, 4];
2225
+ case 4:
2226
+ return [2 /*return*/];
2227
+ }
2228
+ });
2229
+ });
2230
+ }, [debugMode, iphoneContinuityCameraAllowed, iphoneContinuityCameraDenied, preferFrontFacingCamera]);
2231
+ React.useEffect(function requestCameraAccessAutomatically() {
2232
+ if (requestAccessAutomatically && !cameraAccessDenied) {
2233
+ requestCameraAccess()["catch"](error);
2234
+ }
2235
+ }, [cameraAccessDenied, requestAccessAutomatically, requestCameraAccess]);
2236
+ React.useEffect(function accessChosenCamera() {
2237
+ var _this = this;
2238
+ var _a;
2239
+ if (!videoDevice) return;
2240
+ var cleanup = function cleanup() {
2241
+ releaseCameraAccess();
2242
+ cameraRef.current = null;
2243
+ setVideoLoaded(false);
2244
+ };
2245
+ if (!((_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.getUserMedia)) return cleanup;
2246
+ (function () {
2247
+ return __awaiter(_this, void 0, void 0, function () {
2248
+ var constraints, stream, e_2, handleStreamEnded;
2249
+ var _a;
2250
+ return __generator(this, function (_b) {
2251
+ switch (_b.label) {
2252
+ case 0:
2253
+ constraints = {
2254
+ audio: false,
2255
+ video: {
2256
+ deviceId: {
2257
+ exact: videoDevice.deviceId
2258
+ },
2259
+ width: {
2260
+ ideal: maxVideoWidth
2261
+ },
2262
+ aspectRatio: 1.777777778,
2263
+ frameRate: {}
2264
+ }
2265
+ };
2266
+ if (maxFps) {
2267
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
2268
+ // @ts-ignore
2269
+ constraints.video.frameRate = {
2270
+ max: maxFps
2271
+ };
2272
+ }
2273
+ stream = null;
2274
+ _b.label = 1;
2275
+ case 1:
2276
+ _b.trys.push([1, 3,, 4]);
2277
+ return [4 /*yield*/, navigator.mediaDevices.getUserMedia(constraints)];
2278
+ case 2:
2279
+ stream = _b.sent();
2280
+ return [3 /*break*/, 4];
2281
+ case 3:
2282
+ e_2 = _b.sent();
2283
+ if (e_2.name === 'NotAllowedError') {
2284
+ if (iphoneContinuityCameraAllowed) {
2285
+ setIphoneContinuityCameraAvailable(false);
2286
+ setIphoneContinuityCameraDenied(true);
2287
+ } else {
2288
+ setCameraAccessDenied(true);
2289
+ }
2290
+ return [2 /*return*/];
2291
+ }
2292
+ return [3 /*break*/, 4];
2293
+ case 4:
2294
+ if (!!stream) return [3 /*break*/, 8];
2295
+ _b.label = 5;
2296
+ case 5:
2297
+ _b.trys.push([5, 7,, 8]);
2298
+ return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
2299
+ audio: false,
2300
+ video: true
2301
+ })];
2302
+ case 6:
2303
+ stream = _b.sent();
2304
+ log('opened stream with no width and height constraints');
2305
+ return [3 /*break*/, 8];
2306
+ case 7:
2307
+ _b.sent();
2308
+ log('cannot open stream at all');
2309
+ return [3 /*break*/, 8];
2310
+ case 8:
2311
+ if (!stream) {
2312
+ throw new Error('failed to open camera');
2313
+ }
2314
+ handleStreamEnded = function handleStreamEnded() {
2315
+ if (iphoneContinuityCameraAvailable && iphoneContinuityCameraAllowed) {
2316
+ log('someone unplugged the continuity camera');
2317
+ releaseCameraAccess();
2318
+ cameraRef.current = null;
2319
+ setIphoneContinuityCameraAvailable(false);
2320
+ setIphoneContinuityCameraDenied(true);
2321
+ setVideoDevice(null);
2322
+ } else {
2323
+ log('someone unplugged the webcam');
2324
+ releaseCameraAccess();
2325
+ cameraRef.current = null;
2326
+ setVideoLoaded(false);
2327
+ setCameraAccessDenied(true);
2328
+ }
2329
+ };
2330
+ (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('ended', handleStreamEnded);
2331
+ stream.getVideoTracks().forEach(function (track) {
2332
+ track.onended = handleStreamEnded;
2333
+ });
2334
+ cameraRef.current = obtainCameraAccess(stream, videoDevice.label, videoRef.current);
2335
+ return [2 /*return*/];
2336
+ }
2337
+ });
2338
+ });
2339
+ })();
2340
+ return cleanup;
2341
+ }, [iphoneContinuityCameraAllowed, iphoneContinuityCameraAvailable, maxFps, maxVideoWidth, videoDevice]);
2342
+ React.useEffect(function triggerCameraReady() {
2343
+ // TODO: in the future let's evaluate whether we can simplify this to just
2344
+ // setCameraReady(!!videoDevice && videoLoaded) -- we are wondering whether
2345
+ // we somehow depend on this being set twice.
2346
+ setCameraReady(false);
2347
+ if (videoDevice && videoLoaded) {
2348
+ setCameraReady(videoDevice && videoLoaded);
2349
+ }
2350
+ }, [videoLoaded, videoDevice]);
2351
+ var requestMicrophoneAccess = React.useCallback(function _requestMicrophoneAccess() {
2352
+ return __awaiter(this, void 0, void 0, function () {
2353
+ var stream;
2354
+ return __generator(this, function (_a) {
2355
+ switch (_a.label) {
2356
+ case 0:
2357
+ setMicrophoneReady(false);
2358
+ setMicrophoneAccessDenied(false);
2359
+ _a.label = 1;
2360
+ case 1:
2361
+ _a.trys.push([1, 3,, 4]);
2362
+ return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
2363
+ audio: true,
2364
+ video: false
2365
+ })];
2366
+ case 2:
2367
+ stream = _a.sent();
2368
+ currentAudioStream = stream;
2369
+ setAudioStream(stream);
2370
+ setMicrophoneReady(true);
2371
+ stream.getAudioTracks().forEach(function (track) {
2372
+ track.onended = function () {
2373
+ setMicrophoneAccessDenied(true);
2374
+ };
2375
+ });
2376
+ return [3 /*break*/, 4];
2377
+ case 3:
2378
+ _a.sent();
2379
+ setMicrophoneAccessDenied(true);
2380
+ return [3 /*break*/, 4];
2381
+ case 4:
2382
+ return [2 /*return*/];
2383
+ }
2384
+ });
2385
+ });
2386
+ }, []);
2387
+ React.useEffect(function requestMicrophoneAccessIfNeeded() {
2388
+ if (!requireMicrophoneAccess || microphoneAccessDenied) return;
2389
+ requestMicrophoneAccess()["catch"](error);
2390
+ return function () {
2391
+ releaseMicrophoneAccess();
2392
+ setAudioStream(null);
2393
+ setMicrophoneReady(false);
2394
+ };
2395
+ }, [microphoneAccessDenied, requestMicrophoneAccess, requireMicrophoneAccess]);
2396
+ var takePhoto = React.useCallback(function _takePhoto() {
2397
+ return __awaiter(this, void 0, void 0, function () {
2398
+ var canvas;
2399
+ return __generator(this, function (_a) {
2400
+ switch (_a.label) {
2401
+ case 0:
2402
+ if (!cameraRef.current) return [2 /*return*/, null];
2403
+ if (!(typeof ImageCapture !== 'undefined')) return [3 /*break*/, 2];
2404
+ return [4 /*yield*/, new ImageCapture(cameraRef.current.stream.getTracks()[0]).takePhoto()];
2405
+ case 1:
2406
+ return [2 /*return*/, _a.sent()];
2407
+ case 2:
2408
+ if (!videoRef.current) return [2 /*return*/, null];
2409
+ canvas = document.createElement('canvas');
2410
+ drawToCanvas(canvas, videoRef.current);
2411
+ return [2 /*return*/, new Promise(function (resolve) {
2412
+ return canvas.toBlob(resolve);
2413
+ })];
2414
+ }
2415
+ });
2416
+ });
2417
+ }, []);
2418
+ return React.useMemo(function () {
2419
+ return {
2420
+ videoRef: videoRef,
2421
+ videoDevice: videoDevice,
2422
+ videoLoaded: videoLoaded,
2423
+ setVideoLoaded: setVideoLoaded,
2424
+ onVideoUnmounted: onVideoUnmounted,
2425
+ cameraRef: cameraRef,
2426
+ cameraReady: cameraReady,
2427
+ cameraAccessDenied: cameraAccessDenied,
2428
+ requestCameraAccess: requestCameraAccess,
2429
+ releaseCameraAccess: releaseCameraAccess,
2430
+ iphoneContinuityCameraAvailable: iphoneContinuityCameraAvailable,
2431
+ iphoneContinuityCameraAllowed: iphoneContinuityCameraAllowed,
2432
+ setIphoneContinuityCameraAllowed: setIphoneContinuityCameraAllowed,
2433
+ takePhoto: takePhoto,
2434
+ audioStream: audioStream,
2435
+ microphoneReady: microphoneReady,
2436
+ microphoneAccessDenied: microphoneAccessDenied,
2437
+ requestMicrophoneAccess: requestMicrophoneAccess
2438
+ };
2439
+ }, [audioStream, cameraAccessDenied, cameraReady, iphoneContinuityCameraAllowed, iphoneContinuityCameraAvailable, microphoneAccessDenied, microphoneReady, onVideoUnmounted, requestCameraAccess, requestMicrophoneAccess, takePhoto, videoDevice, videoLoaded]);
2440
+ }
2441
+
2442
+ var CameraStateContext = /*#__PURE__*/React.createContext({
2443
+ videoRef: {
2444
+ current: null
2445
+ },
2446
+ videoDevice: null,
2447
+ videoLoaded: false,
2448
+ cameraRef: {
2449
+ current: null
2450
+ },
2451
+ cameraReady: false,
2452
+ cameraAccessDenied: false,
2453
+ requestCameraAccess: function requestCameraAccess() {
2454
+ return null;
2455
+ },
2456
+ releaseCameraAccess: function releaseCameraAccess() {
2457
+ return null;
2458
+ },
2459
+ iphoneContinuityCameraAvailable: false,
2460
+ iphoneContinuityCameraAllowed: true,
2461
+ setIphoneContinuityCameraAllowed: function setIphoneContinuityCameraAllowed() {
2462
+ return null;
2463
+ },
2464
+ takePhoto: function takePhoto() {
2465
+ return Promise.resolve(null);
2466
+ },
2467
+ setVideoLoaded: function setVideoLoaded() {
2468
+ return null;
2469
+ },
2470
+ onVideoUnmounted: function onVideoUnmounted() {
2471
+ return null;
2472
+ },
2473
+ audioStream: null,
2474
+ microphoneReady: false,
2475
+ microphoneAccessDenied: false,
2476
+ requestMicrophoneAccess: function requestMicrophoneAccess() {
2477
+ return null;
2478
+ }
2479
+ });
2480
+ var CameraProvider = function CameraProvider(_a) {
2481
+ var children = _a.children,
2482
+ _b = _a.requestAccessAutomatically,
2483
+ requestAccessAutomatically = _b === void 0 ? true : _b,
2484
+ _c = _a.preferFrontFacingCamera,
2485
+ preferFrontFacingCamera = _c === void 0 ? false : _c,
2486
+ _d = _a.preferContinuityCamera,
2487
+ preferContinuityCamera = _d === void 0 ? true : _d,
2488
+ _e = _a.requireMicrophoneAccess,
2489
+ requireMicrophoneAccess = _e === void 0 ? false : _e,
2490
+ _f = _a.maxVideoWidth,
2491
+ maxVideoWidth = _f === void 0 ? 1920 : _f,
2492
+ maxFps = _a.maxFps,
2493
+ onCameraAccessDenied = _a.onCameraAccessDenied,
2494
+ onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
2495
+ _g = _a.debugMode,
2496
+ debugMode = _g === void 0 ? false : _g;
2497
+ var captureDevice = usePreferredCaptureDevice({
2498
+ requestAccessAutomatically: requestAccessAutomatically,
2499
+ preferFrontFacingCamera: preferFrontFacingCamera,
2500
+ preferContinuityCamera: preferContinuityCamera,
2501
+ requireMicrophoneAccess: requireMicrophoneAccess,
2502
+ maxVideoWidth: maxVideoWidth,
2503
+ maxFps: maxFps,
2504
+ debugMode: debugMode
2505
+ });
2506
+ React.useEffect(function () {
2507
+ if (captureDevice.cameraAccessDenied) onCameraAccessDenied === null || onCameraAccessDenied === void 0 ? void 0 : onCameraAccessDenied();
2508
+ }, [captureDevice.cameraAccessDenied, onCameraAccessDenied]);
2509
+ React.useEffect(function () {
2510
+ if (captureDevice.microphoneAccessDenied) onMicrophoneAccessDenied === null || onMicrophoneAccessDenied === void 0 ? void 0 : onMicrophoneAccessDenied();
2511
+ }, [captureDevice.microphoneAccessDenied, onMicrophoneAccessDenied]);
2512
+ var releaseCameraAccess = captureDevice.releaseCameraAccess;
2513
+ React.useEffect(function () {
2514
+ return function () {
2515
+ releaseCameraAccess();
2516
+ };
2517
+ }, [releaseCameraAccess]);
2518
+ return /*#__PURE__*/React__namespace.default.createElement(CameraStateContext.Provider, {
2519
+ value: captureDevice
2520
+ }, children);
2521
+ };
2522
+
2523
+ var visionTasksBasePath = "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.7/wasm";
2524
+ var visionRuntimePreloading = false;
2525
+ function preloadVisionRuntime() {
2526
+ return __awaiter(this, void 0, void 0, function () {
2527
+ function handleDownloadProgress(event) {
2528
+ var detail = event.detail;
2529
+ if (detail.url !== url) return;
2530
+ progressByUseCase.visionRuntime = sumUpProgressForDependencies([url]);
2531
+ document.dispatchEvent(new CustomEvent('idmission.preloadProgress.visionRuntime', {
2532
+ detail: progressByUseCase.visionRuntime
2533
+ }));
2534
+ }
2535
+ var url;
2536
+ return __generator(this, function (_a) {
2537
+ switch (_a.label) {
2538
+ case 0:
2539
+ if (visionRuntimePreloading) return [2 /*return*/, new Promise(function (resolve) {
2540
+ setInterval(function () {
2541
+ if (!visionRuntimePreloading) resolve();
2542
+ }, 100);
2543
+ })];
2544
+ visionRuntimePreloading = true;
2545
+ url = "".concat(visionTasksBasePath, "/vision_wasm_internal.wasm");
2546
+ document.addEventListener('idmission.preloadProgress', handleDownloadProgress);
2547
+ _a.label = 1;
2133
2548
  case 1:
2134
- _c.trys.push([1, 3,, 4]);
2135
- return [4 /*yield*/, Promise.race([preloadDependency(modelAssetPath), giveUpAfter(maxTime)])];
2549
+ _a.trys.push([1,, 3, 4]);
2550
+ return [4 /*yield*/, preloadDependency(url)];
2136
2551
  case 2:
2137
- _c.sent();
2552
+ _a.sent();
2138
2553
  return [3 /*break*/, 4];
2139
2554
  case 3:
2140
- e_1 = _c.sent();
2141
- error('speed test failed', e_1);
2142
- modelCapabilities.networkTier = 'unusable';
2143
- return [2 /*return*/];
2555
+ document.removeEventListener('idmission.preloadProgress', handleDownloadProgress);
2556
+ visionRuntimePreloading = false;
2557
+ return [7 /*endfinally*/];
2144
2558
  case 4:
2145
- time = (new Date().getTime() - startedAt.getTime()) / 1000.0;
2146
- modelCapabilities.networkTestTime || (modelCapabilities.networkTestTime = time);
2147
- modelCapabilities.networkSpeed || (modelCapabilities.networkSpeed = imageSegmenterModelSizeInBytes / time);
2148
- modelCapabilities.networkTier = time < 0.5 ? 'fast' : time < 2 ? 'medium' : 'slow';
2149
- speedMbps = modelCapabilities.networkSpeed / 1024 / 1024;
2150
- log('Model Probing: network speed', speedMbps.toFixed(3), 'Mbps');
2151
- log('Model Probing: network test took', time);
2152
- log('Model Probing: network tier', modelCapabilities.networkTier);
2153
- _b = (_a = tasksVision.ImageSegmenter).createFromOptions;
2154
- return [4 /*yield*/, tasksVision.FilesetResolver.forVisionTasks(visionTasksBasePath)];
2155
- case 5:
2156
- return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
2157
- baseOptions: {
2158
- modelAssetPath: modelAssetPath,
2159
- delegate: delegate
2160
- }
2161
- }])];
2162
- case 6:
2163
- model = _c.sent();
2164
- emptyFrame = document.createElement('canvas');
2165
- model.segment(emptyFrame);
2166
- emptyFrame.remove();
2167
2559
  return [2 /*return*/];
2168
2560
  }
2169
2561
  });
2170
2562
  });
2171
2563
  }
2172
- function giveUpAfter(maxTime) {
2173
- return new Promise(function (_resolve, reject) {
2174
- setTimeout(function () {
2175
- reject(new Error('gave up after reaching maximum time allowed'));
2176
- }, maxTime);
2177
- });
2178
- }
2179
2564
 
2180
- function convertBoundingBox(box) {
2181
- var _a, _b, _c, _d, _e, _f, _g, _h;
2182
- return {
2183
- xMin: (_a = box === null || box === void 0 ? void 0 : box.originX) !== null && _a !== void 0 ? _a : 0,
2184
- 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),
2185
- yMin: (_d = box === null || box === void 0 ? void 0 : box.originY) !== null && _d !== void 0 ? _d : 0,
2186
- 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),
2187
- width: (_g = box === null || box === void 0 ? void 0 : box.width) !== null && _g !== void 0 ? _g : 0,
2188
- height: (_h = box === null || box === void 0 ? void 0 : box.height) !== null && _h !== void 0 ? _h : 0
2189
- };
2190
- }
2191
- function waitForVideoReady(videoRef, checkEveryMs) {
2192
- if (checkEveryMs === void 0) {
2193
- checkEveryMs = 100;
2565
+ function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
2566
+ if (quality === void 0) {
2567
+ quality = 0.92;
2194
2568
  }
2195
- return new Promise(function (resolve) {
2196
- var _a, _b, _c;
2197
- if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) return resolve();
2198
- (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.load();
2199
- var interval = setInterval(function () {
2200
- var _a, _b;
2201
- if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) {
2202
- clearInterval(interval);
2203
- resolve();
2204
- }
2205
- }, checkEveryMs);
2206
- });
2207
- }
2208
- function calculateIoU(boxA, boxB) {
2209
- var xA = Math.max(boxA.xMin, boxB.xMin);
2210
- var yA = Math.max(boxA.yMin, boxB.yMin);
2211
- var xB = Math.min(boxA.xMax, boxB.xMax);
2212
- var yB = Math.min(boxA.yMax, boxB.yMax);
2569
+ if (!rawCanvas || !cropCanvas || !resizeCanvas) return '';
2570
+ var rawCtx = rawCanvas.getContext('2d');
2571
+ var cropCtx = cropCanvas.getContext('2d');
2572
+ var resizeCtx = resizeCanvas.getContext('2d');
2573
+ if (!rawCtx || !cropCtx || !resizeCtx) throw new Error('could not get 2d context');
2574
+ rawCanvas.width = frame.width;
2575
+ rawCanvas.height = frame.height;
2576
+ rawCtx.putImageData(frame, 0, 0);
2577
+ if (frame.height > frame.width) {
2578
+ cropCanvas.width = frame.width;
2579
+ cropCanvas.height = frame.height;
2580
+ cropCtx.drawImage(rawCanvas, 0, 0, cropCanvas.width, cropCanvas.height);
2581
+ } else {
2582
+ var _a = face.box,
2583
+ xMin = _a.xMin,
2584
+ width = _a.width;
2585
+ var desiredWidth = frame.height * 0.6;
2586
+ var faceCenterX = xMin + width / 2;
2587
+ var xPos = Math.max(0, faceCenterX - desiredWidth / 2);
2588
+ cropCanvas.width = desiredWidth;
2589
+ cropCanvas.height = frame.height;
2590
+ cropCtx.drawImage(rawCanvas, xPos, 0, cropCanvas.width, cropCanvas.height, 0, 0, cropCanvas.width, cropCanvas.height);
2591
+ }
2592
+ resizeCanvas.height = maxHeight !== null && maxHeight !== void 0 ? maxHeight : cropCanvas.height;
2593
+ resizeCanvas.width = cropCanvas.width * (resizeCanvas.height / cropCanvas.height);
2594
+ resizeCtx === null || resizeCtx === void 0 ? void 0 : resizeCtx.drawImage(cropCanvas, 0, 0, resizeCanvas.width, resizeCanvas.height);
2595
+ var dataURL = resizeCanvas.toDataURL('image/jpeg', quality);
2596
+ log('cropToShoulders size', new TextEncoder().encode(dataURL).length);
2597
+ clearCanvas(rawCanvas);
2598
+ clearCanvas(cropCanvas);
2599
+ clearCanvas(resizeCanvas);
2600
+ return dataURL;
2601
+ }
2602
+ function cropToDetectedObjectBox(frame, box, canvas) {
2603
+ canvas || (canvas = document.createElement('canvas'));
2604
+ var ctx = canvas.getContext('2d');
2605
+ if (!ctx) throw new Error('could not get 2d context');
2606
+ var xMin = box.xMin,
2607
+ yMin = box.yMin,
2608
+ width = box.width,
2609
+ height = box.height;
2610
+ canvas.width = width;
2611
+ canvas.height = height;
2612
+ ctx.drawImage(frame, xMin, yMin, width, height, 0, 0, width, height);
2613
+ return canvas;
2614
+ }
2615
+
2616
+ var defaultImageSegmenterModelPath = 'https://websdk-cdn-dev.idmission.com/assets/models/selfiesegmenter20240524/selfie_segmenter.tflite';
2617
+ var imageSegmenterModelSizeInBytes = 256440.32;
2618
+ // 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
2619
+ // isn't fooled by cache times, but subsequent downloads of the vision runtime still do load from the cache.
2620
+ var tinyModelCacheKey = new Date().getTime();
2621
+ var initialModelCapabilities = {
2622
+ probeState: 'notProbed',
2623
+ delegate: 'GPU',
2624
+ networkTier: 'untested',
2625
+ networkSpeed: 0,
2626
+ networkTestTime: 0
2627
+ };
2628
+ var modelCapabilities = _assign({}, initialModelCapabilities);
2629
+ function probeModelCapabilities() {
2630
+ return __awaiter(this, void 0, void 0, function () {
2631
+ var error_1, error_2;
2632
+ return __generator(this, function (_a) {
2633
+ switch (_a.label) {
2634
+ case 0:
2635
+ if (modelCapabilities.probeState === 'probed') return [2 /*return*/];
2636
+ if (modelCapabilities.probeState === 'probing') return [2 /*return*/, new Promise(function (resolve) {
2637
+ setInterval(function () {
2638
+ if (modelCapabilities.probeState === 'probed') resolve();
2639
+ }, 100);
2640
+ })];
2641
+ modelCapabilities.probeState = 'probing';
2642
+ return [4 /*yield*/, preloadVisionRuntime()];
2643
+ case 1:
2644
+ _a.sent();
2645
+ _a.label = 2;
2646
+ case 2:
2647
+ _a.trys.push([2, 4, 9, 10]);
2648
+ log('Model Probing: testing GPU capabilities...');
2649
+ return [4 /*yield*/, loadTinyModel('GPU')];
2650
+ case 3:
2651
+ _a.sent();
2652
+ log('Model Probing: GPU is capable.');
2653
+ return [3 /*break*/, 10];
2654
+ case 4:
2655
+ error_1 = _a.sent();
2656
+ warn('Model Probing: GPU delegate could not be loaded', error_1);
2657
+ modelCapabilities.delegate = 'CPU';
2658
+ _a.label = 5;
2659
+ case 5:
2660
+ _a.trys.push([5, 7,, 8]);
2661
+ log('Model Probing: testing CPU capabilities...');
2662
+ return [4 /*yield*/, loadTinyModel('CPU')];
2663
+ case 6:
2664
+ _a.sent();
2665
+ log('Model Probing: CPU is capable.');
2666
+ return [3 /*break*/, 8];
2667
+ case 7:
2668
+ error_2 = _a.sent();
2669
+ warn('Model Probing: CPU delegate could not be loaded', error_2);
2670
+ modelCapabilities.delegate = 'NONE';
2671
+ return [3 /*break*/, 8];
2672
+ case 8:
2673
+ return [3 /*break*/, 10];
2674
+ case 9:
2675
+ modelCapabilities.probeState = 'probed';
2676
+ return [7 /*endfinally*/];
2677
+ case 10:
2678
+ return [2 /*return*/];
2679
+ }
2680
+ });
2681
+ });
2682
+ }
2683
+ function loadTinyModel() {
2684
+ return __awaiter(this, arguments, void 0, function (delegate, maxTime) {
2685
+ var modelAssetPath, startedAt, e_1, time, speedMbps, model, _a, _b, emptyFrame;
2686
+ if (delegate === void 0) {
2687
+ delegate = 'GPU';
2688
+ }
2689
+ if (maxTime === void 0) {
2690
+ maxTime = 10000;
2691
+ }
2692
+ return __generator(this, function (_c) {
2693
+ switch (_c.label) {
2694
+ case 0:
2695
+ modelAssetPath = "".concat(defaultImageSegmenterModelPath, "?_=").concat(tinyModelCacheKey);
2696
+ startedAt = new Date();
2697
+ _c.label = 1;
2698
+ case 1:
2699
+ _c.trys.push([1, 3,, 4]);
2700
+ return [4 /*yield*/, Promise.race([preloadDependency(modelAssetPath), giveUpAfter(maxTime)])];
2701
+ case 2:
2702
+ _c.sent();
2703
+ return [3 /*break*/, 4];
2704
+ case 3:
2705
+ e_1 = _c.sent();
2706
+ error('speed test failed', e_1);
2707
+ modelCapabilities.networkTier = 'unusable';
2708
+ return [2 /*return*/];
2709
+ case 4:
2710
+ time = (new Date().getTime() - startedAt.getTime()) / 1000.0;
2711
+ modelCapabilities.networkTestTime || (modelCapabilities.networkTestTime = time);
2712
+ modelCapabilities.networkSpeed || (modelCapabilities.networkSpeed = imageSegmenterModelSizeInBytes / time);
2713
+ modelCapabilities.networkTier = time < 0.5 ? 'fast' : time < 2 ? 'medium' : 'slow';
2714
+ speedMbps = modelCapabilities.networkSpeed / 1024 / 1024;
2715
+ log('Model Probing: network speed', speedMbps.toFixed(3), 'Mbps');
2716
+ log('Model Probing: network test took', time);
2717
+ log('Model Probing: network tier', modelCapabilities.networkTier);
2718
+ _b = (_a = tasksVision.ImageSegmenter).createFromOptions;
2719
+ return [4 /*yield*/, tasksVision.FilesetResolver.forVisionTasks(visionTasksBasePath)];
2720
+ case 5:
2721
+ return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
2722
+ baseOptions: {
2723
+ modelAssetPath: modelAssetPath,
2724
+ delegate: delegate
2725
+ }
2726
+ }])];
2727
+ case 6:
2728
+ model = _c.sent();
2729
+ emptyFrame = document.createElement('canvas');
2730
+ model.segment(emptyFrame);
2731
+ emptyFrame.remove();
2732
+ return [2 /*return*/];
2733
+ }
2734
+ });
2735
+ });
2736
+ }
2737
+ function giveUpAfter(maxTime) {
2738
+ return new Promise(function (_resolve, reject) {
2739
+ setTimeout(function () {
2740
+ reject(new Error('gave up after reaching maximum time allowed'));
2741
+ }, maxTime);
2742
+ });
2743
+ }
2744
+
2745
+ function convertBoundingBox(box) {
2746
+ var _a, _b, _c, _d, _e, _f, _g, _h;
2747
+ return {
2748
+ xMin: (_a = box === null || box === void 0 ? void 0 : box.originX) !== null && _a !== void 0 ? _a : 0,
2749
+ 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),
2750
+ yMin: (_d = box === null || box === void 0 ? void 0 : box.originY) !== null && _d !== void 0 ? _d : 0,
2751
+ 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),
2752
+ width: (_g = box === null || box === void 0 ? void 0 : box.width) !== null && _g !== void 0 ? _g : 0,
2753
+ height: (_h = box === null || box === void 0 ? void 0 : box.height) !== null && _h !== void 0 ? _h : 0
2754
+ };
2755
+ }
2756
+ function waitForVideoReady(videoRef, checkEveryMs) {
2757
+ if (checkEveryMs === void 0) {
2758
+ checkEveryMs = 100;
2759
+ }
2760
+ return new Promise(function (resolve) {
2761
+ var _a, _b, _c;
2762
+ if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) return resolve();
2763
+ (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.load();
2764
+ var interval = setInterval(function () {
2765
+ var _a, _b;
2766
+ if (((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) !== null && _b !== void 0 ? _b : 0) >= 2) {
2767
+ clearInterval(interval);
2768
+ resolve();
2769
+ }
2770
+ }, checkEveryMs);
2771
+ });
2772
+ }
2773
+ function calculateIoU(boxA, boxB) {
2774
+ var xA = Math.max(boxA.xMin, boxB.xMin);
2775
+ var yA = Math.max(boxA.yMin, boxB.yMin);
2776
+ var xB = Math.min(boxA.xMax, boxB.xMax);
2777
+ var yB = Math.min(boxA.yMax, boxB.yMax);
2213
2778
  var intersectWidth = Math.max(0, xB - xA);
2214
2779
  var intersectHeight = Math.max(0, yB - yA);
2215
2780
  var intersectionArea = intersectWidth * intersectHeight;
@@ -2300,8 +2865,7 @@ function useLoadFocusModel(_a) {
2300
2865
  modelPath = _b === void 0 ? defaultFocusModelPath : _b,
2301
2866
  _c = _a.modelLoadTimeoutMs,
2302
2867
  modelLoadTimeoutMs = _c === void 0 ? defaultFocusModelLoadTimeoutMs : _c,
2303
- onModelError = _a.onModelError,
2304
- videoRef = _a.videoRef;
2868
+ onModelError = _a.onModelError;
2305
2869
  var _d = React.useState(false),
2306
2870
  ready = _d[0],
2307
2871
  setReady = _d[1];
@@ -2311,6 +2875,7 @@ function useLoadFocusModel(_a) {
2311
2875
  var _f = React.useState(null),
2312
2876
  modelError = _f[0],
2313
2877
  setModelError = _f[1];
2878
+ var videoRef = React.useContext(CameraStateContext).videoRef;
2314
2879
  React.useEffect(function loadModel() {
2315
2880
  var _this = this;
2316
2881
  setReady(false);
@@ -2448,8 +3013,7 @@ function closeFaceDetector() {
2448
3013
  function useLoadFaceDetector(_a) {
2449
3014
  var onModelError = _a.onModelError,
2450
3015
  _b = _a.modelLoadTimeoutMs,
2451
- modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b,
2452
- videoRef = _a.videoRef;
3016
+ modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b;
2453
3017
  var _c = React.useState(false),
2454
3018
  ready = _c[0],
2455
3019
  setReady = _c[1];
@@ -2459,6 +3023,7 @@ function useLoadFaceDetector(_a) {
2459
3023
  var _e = React.useState(null),
2460
3024
  modelError = _e[0],
2461
3025
  setModelError = _e[1];
3026
+ var videoRef = React.useContext(CameraStateContext).videoRef;
2462
3027
  React.useEffect(function loadModel() {
2463
3028
  var _this = this;
2464
3029
  setReady(false);
@@ -2939,8 +3504,7 @@ function useLoadDocumentDetector(_a) {
2939
3504
  modelLoadTimeoutMs = _c === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _c,
2940
3505
  _d = _a.scoreThreshold,
2941
3506
  scoreThreshold = _d === void 0 ? defaultDocumentDetectionScoreThreshold : _d,
2942
- onModelError = _a.onModelError,
2943
- videoRef = _a.videoRef;
3507
+ onModelError = _a.onModelError;
2944
3508
  var _e = React.useState(false),
2945
3509
  ready = _e[0],
2946
3510
  setReady = _e[1];
@@ -2950,6 +3514,7 @@ function useLoadDocumentDetector(_a) {
2950
3514
  var _g = React.useState(null),
2951
3515
  modelError = _g[0],
2952
3516
  setModelError = _g[1];
3517
+ var videoRef = React.useContext(CameraStateContext).videoRef;
2953
3518
  React.useEffect(function loadModel() {
2954
3519
  var _this = this;
2955
3520
  setReady(false);
@@ -3166,582 +3731,96 @@ function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
3166
3731
  idCardFrontDetectionThresholdMet: idCardFrontDetectionThresholdMet,
3167
3732
  idCardBackDetectionScore: idCardBackDetectionScore,
3168
3733
  idCardBackDetectionThresholdMet: idCardBackDetectionThresholdMet,
3169
- passportDetectionScore: passportDetectionScore,
3170
- passportDetectionThresholdMet: passportDetectionThresholdMet,
3171
- bestDocument: bestDocument,
3172
- documentInBounds: documentInBounds,
3173
- documentTooClose: documentTooClose,
3174
- documentIsStable: documentIsStable,
3175
- frameWidth: frameWidth,
3176
- frameHeight: frameHeight,
3177
- allZero: allZero
3178
- };
3179
- }
3180
- function applyNonMaxSuppression(detectedObjects, isGoodBox) {
3181
- var maxes = {};
3182
- detectedObjects.forEach(function (obj, i) {
3183
- if (obj) {
3184
- if (!maxes[obj.label]) maxes[obj.label] = [0, -1];
3185
- if (obj.score > maxes[obj.label][0] && (isGoodBox === null || isGoodBox === void 0 ? void 0 : isGoodBox(obj))) maxes[obj.label] = [obj.score, i];
3186
- }
3187
- });
3188
- return Object.keys(maxes).map(function (label) {
3189
- return detectedObjects[maxes[label][1]];
3190
- }).filter(function (obj) {
3191
- return !!obj;
3192
- });
3193
- }
3194
-
3195
- function useFrameLoop(fn, _a) {
3196
- var _b = _a.throttleMs,
3197
- throttleMs = _b === void 0 ? 0 : _b,
3198
- _c = _a.autoStart,
3199
- autoStart = _c === void 0 ? false : _c;
3200
- var _d = React.useState(false),
3201
- running = _d[0],
3202
- setRunning = _d[1];
3203
- var startedAtRef = React.useRef(null);
3204
- var loopId = React.useRef(0);
3205
- var frameId = React.useRef(0);
3206
- React.useEffect(function runFrameLoop() {
3207
- if (!running) return;
3208
- var timer;
3209
- var currentLoopId = loopId.current;
3210
- function renderPrediction() {
3211
- return __awaiter(this, void 0, void 0, function () {
3212
- var start, timeRunning, took, amountToThrottle;
3213
- var _a, _b;
3214
- return __generator(this, function (_c) {
3215
- switch (_c.label) {
3216
- case 0:
3217
- if (currentLoopId !== loopId.current) return [2 /*return*/];
3218
- start = new Date().getTime();
3219
- timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
3220
- return [4 /*yield*/, fn(frameId.current, timeRunning)];
3221
- case 1:
3222
- _c.sent();
3223
- took = new Date().getTime() - start;
3224
- amountToThrottle = Math.max((throttleMs !== null && throttleMs !== void 0 ? throttleMs : 0) - took, 0);
3225
- timer = setTimeout(function () {
3226
- frameId.current = requestAnimationFrame(renderPrediction);
3227
- }, amountToThrottle);
3228
- return [2 /*return*/];
3229
- }
3230
- });
3231
- });
3232
- }
3233
- renderPrediction().then();
3234
- return function () {
3235
- loopId.current += 1;
3236
- frameId.current && cancelAnimationFrame(frameId.current);
3237
- timer && clearTimeout(timer);
3238
- };
3239
- }, [fn, running, throttleMs]);
3240
- var start = React.useCallback(function () {
3241
- startedAtRef.current = new Date();
3242
- setRunning(true);
3243
- }, []);
3244
- var stop = React.useCallback(function () {
3245
- loopId.current += 1; // force the loop to stop immediately.
3246
- setRunning(false);
3247
- startedAtRef.current = null;
3248
- }, []);
3249
- React.useEffect(function startAutomatically() {
3250
- if (autoStart) start();
3251
- return function () {
3252
- stop();
3253
- };
3254
- }, [autoStart, start, stop]);
3255
- return {
3256
- start: start,
3257
- stop: stop
3258
- };
3259
- }
3260
-
3261
- function listAvailableCameras(facingMode_1) {
3262
- return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
3263
- var cameraEnumerationStream, videoDevices;
3264
- if (requestMicAccess === void 0) {
3265
- requestMicAccess = false;
3266
- }
3267
- return __generator(this, function (_a) {
3268
- switch (_a.label) {
3269
- case 0:
3270
- return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
3271
- video: {
3272
- facingMode: {
3273
- exact: facingMode
3274
- }
3275
- },
3276
- audio: requestMicAccess
3277
- })
3278
- // This lists all available cameras attached to the user's device.
3279
- ];
3280
- case 1:
3281
- cameraEnumerationStream = _a.sent();
3282
- return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
3283
- case 2:
3284
- videoDevices = _a.sent().filter(function (_a) {
3285
- var kind = _a.kind;
3286
- return kind === 'videoinput';
3287
- });
3288
- // Release the access to the user's camera that we obtained for enumeration purposes.
3289
- cameraEnumerationStream.getVideoTracks().forEach(function (track) {
3290
- track.enabled = false;
3291
- track.stop();
3292
- });
3293
- cameraEnumerationStream = null;
3294
- return [2 /*return*/, videoDevices];
3295
- }
3296
- });
3297
- });
3298
- }
3299
- 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) {
3300
- return s.toLocaleLowerCase().split(' ').join('');
3301
- });
3302
- 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) {
3303
- return s.toLocaleLowerCase().split(' ').join('');
3304
- });
3305
- 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) {
3306
- return s.toLocaleLowerCase().split(' ').join('');
3307
- });
3308
- var cameraLabelMatches = function cameraLabelMatches(labelOrDevice, labelSetOrLabel) {
3309
- var label = labelOrDevice instanceof MediaDeviceInfo ? getDeviceLabel(labelOrDevice) : labelOrDevice;
3310
- var labelSet = typeof labelSetOrLabel === 'string' ? [labelSetOrLabel] : labelSetOrLabel;
3311
- return labelSet.some(function (l) {
3312
- return label.includes(l);
3313
- });
3314
- };
3315
- var getDeviceLabel = function getDeviceLabel(deviceInfo) {
3316
- return deviceInfo.label.toLocaleLowerCase().split(' ').join('');
3317
- };
3318
- var currentCamera;
3319
- function obtainCameraAccess(stream, deviceLabel, video) {
3320
- releaseCameraAccess();
3321
- log('obtaining camera access...');
3322
- var _a = stream.getVideoTracks()[0].getSettings(),
3323
- width = _a.width,
3324
- height = _a.height;
3325
- log('camera dimensions', width, height);
3326
- var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
3327
- log('camera label', label);
3328
- var isRearFacing = cameraLabelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearCameraLabels, true), backUltraWideCameraLabels, true), ['iphone'], false));
3329
- log('is rear facing?', isRearFacing);
3330
- var release = function release() {
3331
- stream.getTracks().forEach(function (track) {
3332
- track.enabled = false;
3333
- track.stop();
3334
- });
3335
- if (video) {
3336
- video.pause();
3337
- video.srcObject = null;
3338
- video.src = '';
3339
- }
3340
- };
3341
- width || (width = 0);
3342
- height || (height = 0);
3343
- currentCamera = {
3344
- label: deviceLabel,
3345
- stream: stream,
3346
- width: width,
3347
- height: height,
3348
- isRearFacing: isRearFacing,
3349
- release: release
3350
- };
3351
- log('camera access granted');
3352
- if (video) video.srcObject = stream;
3353
- log('video source initialized');
3354
- return currentCamera;
3355
- }
3356
- function releaseCameraAccess() {
3357
- if (!currentCamera) return;
3358
- log('releasing camera access...');
3359
- currentCamera.release();
3360
- currentCamera = undefined;
3361
- }
3362
-
3363
- var initialState$5 = {
3364
- videoRef: {
3365
- current: null
3366
- },
3367
- videoLoaded: false,
3368
- videoStream: null,
3369
- videoDevice: null,
3370
- isRearFacing: false,
3371
- camera: null,
3372
- cameraReady: false,
3373
- cameraAccessDenied: false,
3374
- iphoneContinuityCameraAvailable: false,
3375
- iphoneContinuityCameraDenied: false,
3376
- preferIphoneContinuityCamera: true,
3377
- audioStream: null,
3378
- microphoneReady: false,
3379
- microphoneAccessDenied: false
3380
- };
3381
- var createCameraStore = function createCameraStore(config) {
3382
- var store = zustand.createStore(function (set, get) {
3383
- return _assign(_assign(_assign({}, initialState$5), config), {
3384
- reset: function reset() {
3385
- return set(_assign(_assign({}, initialState$5), config));
3386
- },
3387
- setConfig: function setConfig(config) {
3388
- return set(config);
3389
- },
3390
- onVideoMounted: function onVideoMounted() {
3391
- return set({
3392
- videoLoaded: true
3393
- });
3394
- },
3395
- setIphoneContinuityCameraAllowed: function setIphoneContinuityCameraAllowed(value) {
3396
- return set({
3397
- preferIphoneContinuityCamera: value
3398
- });
3399
- },
3400
- requestCameraAccess: function requestCameraAccess() {
3401
- return __awaiter(this, void 0, void 0, function () {
3402
- var _a, videoRef, releaseCameraAccess, preferFrontFacingCamera, preferIphoneContinuityCamera, iphoneContinuityCameraDenied, availableCameras, selectedCamera, platform_1, iphoneContinuityCamera, constraints, stream_1, e_1, iphoneContinuityCameraAvailable_1, handleStreamEnded_1, videoTrack_1, camera_1, e_3;
3403
- var _b, _c, _d;
3404
- return __generator(this, function (_e) {
3405
- switch (_e.label) {
3406
- case 0:
3407
- _a = get(), videoRef = _a.videoRef, releaseCameraAccess = _a.releaseCameraAccess, preferFrontFacingCamera = _a.preferFrontFacingCamera, preferIphoneContinuityCamera = _a.preferIphoneContinuityCamera, iphoneContinuityCameraDenied = _a.iphoneContinuityCameraDenied;
3408
- releaseCameraAccess();
3409
- _e.label = 1;
3410
- case 1:
3411
- _e.trys.push([1, 11,, 12]);
3412
- return [4 /*yield*/, listAvailableCameras()];
3413
- case 2:
3414
- availableCameras = _e.sent();
3415
- selectedCamera = void 0;
3416
- debug('availableCameras', availableCameras);
3417
- platform_1 = getPlatform();
3418
- debug('platformDetails', platform_1);
3419
- if (!iphoneContinuityCameraDenied && (!(platform_1 === null || platform_1 === void 0 ? void 0 : platform_1.os) || platform_1.os.family === 'OS X')) {
3420
- iphoneContinuityCamera = availableCameras.find(function (deviceInfo) {
3421
- return cameraLabelMatches(deviceInfo, 'iphone');
3422
- });
3423
- set({
3424
- iphoneContinuityCameraAvailable: !!iphoneContinuityCamera
3425
- });
3426
- if (iphoneContinuityCamera && preferIphoneContinuityCamera) {
3427
- selectedCamera = iphoneContinuityCamera;
3428
- }
3429
- } 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) {
3430
- return c.label.startsWith('camera2 ');
3431
- })) {
3432
- availableCameras = availableCameras.sort(function (a, b) {
3433
- return a.label.toLowerCase().localeCompare(b.label.toLowerCase());
3434
- });
3435
- debug('cameras have been sorted', availableCameras);
3436
- }
3437
- if (preferFrontFacingCamera) {
3438
- selectedCamera = availableCameras.find(function (deviceInfo) {
3439
- return cameraLabelMatches(deviceInfo, frontCameraLabels);
3440
- });
3441
- }
3442
- selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
3443
- return cameraLabelMatches(deviceInfo, 'backtriplecamera');
3444
- }));
3445
- selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
3446
- return cameraLabelMatches(deviceInfo, 'backdualcamera');
3447
- }));
3448
- selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
3449
- return cameraLabelMatches(deviceInfo, rearCameraLabels) && !cameraLabelMatches(deviceInfo, backUltraWideCameraLabels);
3450
- }));
3451
- selectedCamera || (selectedCamera = availableCameras.find(function (deviceInfo) {
3452
- return cameraLabelMatches(deviceInfo, rearCameraLabels);
3453
- }));
3454
- // on iOS, the front facing camera always is at the first position in the list, so we skip it if all else fails.
3455
- 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) {
3456
- selectedCamera || (selectedCamera = availableCameras[1]);
3457
- }
3458
- selectedCamera || (selectedCamera = availableCameras[0]);
3459
- debug('selectedCamera', selectedCamera);
3460
- set({
3461
- videoDevice: selectedCamera
3462
- });
3463
- constraints = {
3464
- audio: false,
3465
- video: {
3466
- deviceId: {
3467
- exact: selectedCamera.deviceId
3468
- },
3469
- width: {
3470
- ideal: config.maxVideoWidth
3471
- },
3472
- aspectRatio: 1.777777778,
3473
- frameRate: {}
3474
- }
3475
- };
3476
- if (config.maxFps) {
3477
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
3478
- // @ts-ignore
3479
- constraints.video.frameRate = {
3480
- max: config.maxFps
3481
- };
3482
- }
3483
- stream_1 = null;
3484
- _e.label = 3;
3485
- case 3:
3486
- _e.trys.push([3, 5,, 6]);
3487
- debug('obtaining camera access with constraints', constraints);
3488
- return [4 /*yield*/, navigator.mediaDevices.getUserMedia(constraints)];
3489
- case 4:
3490
- stream_1 = _e.sent();
3491
- return [3 /*break*/, 6];
3492
- case 5:
3493
- e_1 = _e.sent();
3494
- if (e_1.name === 'NotAllowedError') {
3495
- if (preferIphoneContinuityCamera) {
3496
- set({
3497
- iphoneContinuityCameraAvailable: false,
3498
- iphoneContinuityCameraDenied: true
3499
- });
3500
- } else {
3501
- set({
3502
- cameraAccessDenied: true
3503
- });
3504
- }
3505
- return [2 /*return*/];
3506
- }
3507
- return [3 /*break*/, 6];
3508
- case 6:
3509
- if (!!stream_1) return [3 /*break*/, 10];
3510
- _e.label = 7;
3511
- case 7:
3512
- _e.trys.push([7, 9,, 10]);
3513
- return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
3514
- audio: false,
3515
- video: true
3516
- })];
3517
- case 8:
3518
- stream_1 = _e.sent();
3519
- debug('opened stream with no width and height constraints');
3520
- return [3 /*break*/, 10];
3521
- case 9:
3522
- _e.sent();
3523
- debug('cannot open stream at all');
3524
- return [3 /*break*/, 10];
3525
- case 10:
3526
- if (!stream_1) {
3527
- error('failed to open camera');
3528
- throw new Error('failed to open camera');
3529
- }
3530
- debug('camera access granted with constraints', constraints);
3531
- iphoneContinuityCameraAvailable_1 = get().iphoneContinuityCameraAvailable;
3532
- handleStreamEnded_1 = function handleStreamEnded_1() {
3533
- if (iphoneContinuityCameraAvailable_1 && preferIphoneContinuityCamera) {
3534
- debug('someone unplugged the continuity camera');
3535
- set({
3536
- videoStream: null,
3537
- videoDevice: null,
3538
- cameraReady: false,
3539
- iphoneContinuityCameraAvailable: false,
3540
- iphoneContinuityCameraDenied: true
3541
- });
3542
- get().requestCameraAccess();
3543
- } else {
3544
- debug('someone unplugged the webcam');
3545
- releaseCameraAccess();
3546
- set({
3547
- videoStream: null,
3548
- videoDevice: null,
3549
- videoLoaded: false,
3550
- cameraReady: false,
3551
- cameraAccessDenied: true
3552
- });
3553
- }
3554
- };
3555
- (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.addEventListener('ended', handleStreamEnded_1);
3556
- videoTrack_1 = stream_1.getVideoTracks()[0];
3557
- videoTrack_1.onended = handleStreamEnded_1;
3558
- camera_1 = obtainCameraAccess(stream_1, selectedCamera.label, videoRef.current);
3559
- // iOS 17 has a strange behavior where the video track flickers between muted and unmuted
3560
- // when the camera access is being requested. This delay is a workaround for that.
3561
- setTimeout(function () {
3562
- videoTrack_1.onmute = handleStreamEnded_1;
3563
- set({
3564
- camera: camera_1,
3565
- cameraReady: true,
3566
- cameraAccessDenied: false,
3567
- isRearFacing: camera_1.isRearFacing,
3568
- videoStream: stream_1
3569
- });
3570
- }, 500);
3571
- return [3 /*break*/, 12];
3572
- case 11:
3573
- e_3 = _e.sent();
3574
- if (e_3.name === 'NotAllowedError') {
3575
- error('camera access has been blocked by the user', e_3);
3576
- set({
3577
- cameraAccessDenied: true
3578
- });
3579
- } else {
3580
- error('camera access encountered some other error', e_3);
3581
- throw e_3;
3582
- }
3583
- return [3 /*break*/, 12];
3584
- case 12:
3585
- return [2 /*return*/];
3586
- }
3587
- });
3588
- });
3589
- },
3590
- releaseCameraAccess: function releaseCameraAccess() {
3591
- return __awaiter(this, void 0, void 0, function () {
3592
- var camera;
3593
- return __generator(this, function (_a) {
3594
- camera = get().camera;
3595
- if (!camera) return [2 /*return*/];
3596
- camera.release();
3597
- set({
3598
- camera: null,
3599
- cameraReady: false,
3600
- cameraAccessDenied: false
3601
- });
3602
- return [2 /*return*/];
3603
- });
3604
- });
3605
- },
3606
- requestMicrophoneAccess: function requestMicrophoneAccess() {
3607
- return __awaiter(this, void 0, void 0, function () {
3608
- var stream_2;
3609
- return __generator(this, function (_a) {
3610
- switch (_a.label) {
3611
- case 0:
3612
- get().releaseMicrophoneAccess();
3613
- _a.label = 1;
3614
- case 1:
3615
- _a.trys.push([1, 3,, 4]);
3616
- return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
3617
- audio: true,
3618
- video: false
3619
- })
3620
- // iOS 17 has a strange behavior where the video track flickers between muted and unmuted
3621
- // when the camera access is being requested. This delay is a workaround for that.
3622
- ];
3623
- case 2:
3624
- stream_2 = _a.sent();
3625
- // iOS 17 has a strange behavior where the video track flickers between muted and unmuted
3626
- // when the camera access is being requested. This delay is a workaround for that.
3627
- setTimeout(function () {
3628
- set({
3629
- audioStream: stream_2,
3630
- microphoneReady: true,
3631
- microphoneAccessDenied: false
3632
- });
3633
- stream_2.getAudioTracks().forEach(function (track) {
3634
- track.onended = function () {
3635
- return set({
3636
- microphoneReady: false,
3637
- microphoneAccessDenied: true
3638
- });
3639
- };
3640
- track.onmute = function () {
3641
- return set({
3642
- microphoneReady: false,
3643
- microphoneAccessDenied: true
3644
- });
3645
- };
3646
- });
3647
- }, 500);
3648
- return [3 /*break*/, 4];
3649
- case 3:
3650
- _a.sent();
3651
- set({
3652
- microphoneAccessDenied: true
3653
- });
3654
- return [3 /*break*/, 4];
3655
- case 4:
3656
- return [2 /*return*/];
3657
- }
3658
- });
3659
- });
3660
- },
3661
- releaseMicrophoneAccess: function releaseMicrophoneAccess() {
3662
- var _a;
3663
- var audioStream = get().audioStream;
3664
- (_a = audioStream === null || audioStream === void 0 ? void 0 : audioStream.stop) === null || _a === void 0 ? void 0 : _a.call(audioStream);
3665
- audioStream === null || audioStream === void 0 ? void 0 : audioStream.getAudioTracks().forEach(function (track) {
3666
- var _a;
3667
- (_a = track.stop) === null || _a === void 0 ? void 0 : _a.call(track);
3668
- });
3669
- set({
3670
- audioStream: null,
3671
- microphoneReady: false,
3672
- microphoneAccessDenied: false
3673
- });
3674
- }
3675
- });
3676
- });
3677
- if (config.requestAccessAutomatically) {
3678
- void store.getState().requestCameraAccess();
3679
- }
3680
- if (config.requireMicrophoneAccess) {
3681
- void store.getState().requestMicrophoneAccess();
3682
- }
3683
- return _assign(_assign({}, store), {
3684
- destroy: function destroy() {
3685
- store.getState().releaseCameraAccess();
3686
- store.getState().releaseMicrophoneAccess();
3734
+ passportDetectionScore: passportDetectionScore,
3735
+ passportDetectionThresholdMet: passportDetectionThresholdMet,
3736
+ bestDocument: bestDocument,
3737
+ documentInBounds: documentInBounds,
3738
+ documentTooClose: documentTooClose,
3739
+ documentIsStable: documentIsStable,
3740
+ frameWidth: frameWidth,
3741
+ frameHeight: frameHeight,
3742
+ allZero: allZero
3743
+ };
3744
+ }
3745
+ function applyNonMaxSuppression(detectedObjects, isGoodBox) {
3746
+ var maxes = {};
3747
+ detectedObjects.forEach(function (obj, i) {
3748
+ if (obj) {
3749
+ if (!maxes[obj.label]) maxes[obj.label] = [0, -1];
3750
+ if (obj.score > maxes[obj.label][0] && (isGoodBox === null || isGoodBox === void 0 ? void 0 : isGoodBox(obj))) maxes[obj.label] = [obj.score, i];
3687
3751
  }
3688
3752
  });
3689
- };
3690
- var CameraStoreContext = /*#__PURE__*/React.createContext(undefined);
3691
- function CameraStoreProvider(_a) {
3692
- var children = _a.children,
3693
- _b = _a.requestAccessAutomatically,
3694
- requestAccessAutomatically = _b === void 0 ? true : _b,
3695
- _c = _a.preferIphoneContinuityCamera,
3696
- preferIphoneContinuityCamera = _c === void 0 ? true : _c,
3697
- _d = _a.preferFrontFacingCamera,
3698
- preferFrontFacingCamera = _d === void 0 ? false : _d,
3699
- _e = _a.maxVideoWidth,
3700
- maxVideoWidth = _e === void 0 ? 1920 : _e,
3701
- maxFps = _a.maxFps,
3702
- onCameraAccessDenied = _a.onCameraAccessDenied,
3703
- onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
3704
- _f = _a.requireMicrophoneAccess,
3705
- requireMicrophoneAccess = _f === void 0 ? false : _f;
3706
- var videoRef = React.useRef(null);
3707
- var store = React.useRef();
3708
- store.current || (store.current = createCameraStore({
3709
- videoRef: videoRef,
3710
- requestAccessAutomatically: requestAccessAutomatically,
3711
- preferIphoneContinuityCamera: preferIphoneContinuityCamera,
3712
- preferFrontFacingCamera: preferFrontFacingCamera,
3713
- maxVideoWidth: maxVideoWidth,
3714
- maxFps: maxFps,
3715
- onCameraAccessDenied: onCameraAccessDenied,
3716
- onMicrophoneAccessDenied: onMicrophoneAccessDenied,
3717
- requireMicrophoneAccess: requireMicrophoneAccess
3718
- }));
3719
- React.useEffect(function () {
3720
- var _a, _b, _c;
3721
- var state = (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState();
3722
- if (!state) return;
3723
- if (preferIphoneContinuityCamera !== (state === null || state === void 0 ? void 0 : state.preferIphoneContinuityCamera) || preferFrontFacingCamera !== (state === null || state === void 0 ? void 0 : state.preferFrontFacingCamera)) {
3724
- (_b = store.current) === null || _b === void 0 ? void 0 : _b.setState({
3725
- preferIphoneContinuityCamera: preferIphoneContinuityCamera,
3726
- preferFrontFacingCamera: preferFrontFacingCamera
3753
+ return Object.keys(maxes).map(function (label) {
3754
+ return detectedObjects[maxes[label][1]];
3755
+ }).filter(function (obj) {
3756
+ return !!obj;
3757
+ });
3758
+ }
3759
+
3760
+ function useFrameLoop(fn, _a) {
3761
+ var _b = _a.throttleMs,
3762
+ throttleMs = _b === void 0 ? 0 : _b,
3763
+ _c = _a.autoStart,
3764
+ autoStart = _c === void 0 ? false : _c;
3765
+ var _d = React.useState(false),
3766
+ running = _d[0],
3767
+ setRunning = _d[1];
3768
+ var startedAtRef = React.useRef(null);
3769
+ var loopId = React.useRef(0);
3770
+ var frameId = React.useRef(0);
3771
+ React.useEffect(function runFrameLoop() {
3772
+ if (!running) return;
3773
+ var timer;
3774
+ var currentLoopId = loopId.current;
3775
+ function renderPrediction() {
3776
+ return __awaiter(this, void 0, void 0, function () {
3777
+ var start, timeRunning, took, amountToThrottle;
3778
+ var _a, _b;
3779
+ return __generator(this, function (_c) {
3780
+ switch (_c.label) {
3781
+ case 0:
3782
+ if (currentLoopId !== loopId.current) return [2 /*return*/];
3783
+ start = new Date().getTime();
3784
+ timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
3785
+ return [4 /*yield*/, fn(frameId.current, timeRunning)];
3786
+ case 1:
3787
+ _c.sent();
3788
+ took = new Date().getTime() - start;
3789
+ amountToThrottle = Math.max((throttleMs !== null && throttleMs !== void 0 ? throttleMs : 0) - took, 0);
3790
+ timer = setTimeout(function () {
3791
+ frameId.current = requestAnimationFrame(renderPrediction);
3792
+ }, amountToThrottle);
3793
+ return [2 /*return*/];
3794
+ }
3795
+ });
3727
3796
  });
3728
- (_c = store.current) === null || _c === void 0 ? void 0 : _c.getState().requestCameraAccess();
3729
3797
  }
3730
- }, [preferFrontFacingCamera, preferIphoneContinuityCamera]);
3731
- React.useEffect(function () {
3798
+ renderPrediction().then();
3732
3799
  return function () {
3733
- var _a;
3734
- return (_a = store.current) === null || _a === void 0 ? void 0 : _a.destroy();
3800
+ loopId.current += 1;
3801
+ frameId.current && cancelAnimationFrame(frameId.current);
3802
+ timer && clearTimeout(timer);
3735
3803
  };
3804
+ }, [fn, running, throttleMs]);
3805
+ var start = React.useCallback(function () {
3806
+ startedAtRef.current = new Date();
3807
+ setRunning(true);
3736
3808
  }, []);
3737
- return /*#__PURE__*/React__namespace.default.createElement(CameraStoreContext.Provider, {
3738
- value: store.current
3739
- }, children);
3740
- }
3741
- function useCameraStore(selector) {
3742
- var store = React.useContext(CameraStoreContext);
3743
- if (!store) throw new Error('useCameraStore cannot be used without Provider');
3744
- return zustand.useStore(store, selector);
3809
+ var stop = React.useCallback(function () {
3810
+ loopId.current += 1; // force the loop to stop immediately.
3811
+ setRunning(false);
3812
+ startedAtRef.current = null;
3813
+ }, []);
3814
+ React.useEffect(function startAutomatically() {
3815
+ if (autoStart) start();
3816
+ return function () {
3817
+ stop();
3818
+ };
3819
+ }, [autoStart, start, stop]);
3820
+ return {
3821
+ start: start,
3822
+ stop: stop
3823
+ };
3745
3824
  }
3746
3825
 
3747
3826
  var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
@@ -3789,7 +3868,7 @@ function DocumentDetectionModelProvider(_a) {
3789
3868
  _g = _a.documentDetectionModelLoadTimeoutMs,
3790
3869
  documentDetectionModelLoadTimeoutMs = _g === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _g,
3791
3870
  onDocumentDetectionModelError = _a.onDocumentDetectionModelError;
3792
- var _h = useCameraStore(),
3871
+ var _h = React.useContext(CameraStateContext),
3793
3872
  videoRef = _h.videoRef,
3794
3873
  videoLoaded = _h.videoLoaded,
3795
3874
  cameraReady = _h.cameraReady;
@@ -3812,8 +3891,7 @@ function DocumentDetectionModelProvider(_a) {
3812
3891
  modelPath: documentDetectionModelPath,
3813
3892
  modelLoadTimeoutMs: documentDetectionModelLoadTimeoutMs,
3814
3893
  scoreThreshold: documentDetectionModelScoreThreshold,
3815
- onModelError: onDocumentDetectionModelError,
3816
- videoRef: videoRef
3894
+ onModelError: onDocumentDetectionModelError
3817
3895
  }),
3818
3896
  ready = _o.ready,
3819
3897
  modelDownloadProgress = _o.modelDownloadProgress,
@@ -3930,12 +4008,10 @@ function FocusModelProvider(_a) {
3930
4008
  var _e = React.useState({}),
3931
4009
  focusThresholds = _e[0],
3932
4010
  setFocusThresholds = _e[1];
3933
- var videoRef = useCameraStore().videoRef;
3934
4011
  var _f = useLoadFocusModel({
3935
4012
  modelPath: focusModelPath,
3936
4013
  modelLoadTimeoutMs: focusModelLoadTimeoutMs,
3937
- onModelError: onFocusModelError,
3938
- videoRef: videoRef
4014
+ onModelError: onFocusModelError
3939
4015
  }),
3940
4016
  ready = _f.ready,
3941
4017
  modelDownloadProgress = _f.modelDownloadProgress,
@@ -5057,33 +5133,31 @@ var Button = styled__default.default(LoaderButton)(templateObject_5$b || (templa
5057
5133
  var templateObject_1$D, templateObject_2$w, templateObject_3$o, templateObject_4$i, templateObject_5$b;
5058
5134
 
5059
5135
  var IdCapture = function IdCapture(_a) {
5060
- var _b, _c, _d, _e, _f, _g, _h;
5136
+ var _b, _c, _d, _e, _f, _g, _h, _j;
5061
5137
  var requiredDocumentType = _a.requiredDocumentType,
5062
- _j = _a.thresholds,
5063
- thresholds = _j === void 0 ? defaultIdCaptureThresholds : _j,
5138
+ _k = _a.thresholds,
5139
+ thresholds = _k === void 0 ? defaultIdCaptureThresholds : _k,
5064
5140
  guidanceMessage = _a.guidanceMessage,
5065
5141
  guidanceSatisfied = _a.guidanceSatisfied,
5066
5142
  onCapture = _a.onCapture,
5067
- _k = _a.classNames,
5068
- classNames = _k === void 0 ? {} : _k,
5069
- _l = _a.colors,
5070
- colors = _l === void 0 ? {} : _l,
5071
- _m = _a.verbiage,
5072
- rawVerbiage = _m === void 0 ? {} : _m,
5073
- _o = _a.debugMode,
5074
- debugMode = _o === void 0 ? false : _o;
5075
- var _p = useResizeObserver__default.default(),
5076
- ref = _p.ref,
5077
- _q = _p.width,
5078
- width = _q === void 0 ? 1 : _q,
5079
- _r = _p.height,
5080
- height = _r === void 0 ? 1 : _r;
5081
- var _s = useIdCaptureState(),
5082
- state = _s[0],
5083
- dispatch = _s[1];
5084
- var _t = useCameraStore(),
5085
- camera = _t.camera,
5086
- isRearFacing = _t.isRearFacing;
5143
+ _l = _a.classNames,
5144
+ classNames = _l === void 0 ? {} : _l,
5145
+ _m = _a.colors,
5146
+ colors = _m === void 0 ? {} : _m,
5147
+ _o = _a.verbiage,
5148
+ rawVerbiage = _o === void 0 ? {} : _o,
5149
+ _p = _a.debugMode,
5150
+ debugMode = _p === void 0 ? false : _p;
5151
+ var _q = useResizeObserver__default.default(),
5152
+ ref = _q.ref,
5153
+ _r = _q.width,
5154
+ width = _r === void 0 ? 1 : _r,
5155
+ _s = _q.height,
5156
+ height = _s === void 0 ? 1 : _s;
5157
+ var _t = useIdCaptureState(),
5158
+ state = _t[0],
5159
+ dispatch = _t[1];
5160
+ var cameraRef = React.useContext(CameraStateContext).cameraRef;
5087
5161
  var _u = React.useContext(IdCaptureModelsContext),
5088
5162
  modelsReady = _u.ready,
5089
5163
  setThresholds = _u.setThresholds,
@@ -5195,16 +5269,17 @@ var IdCapture = function IdCapture(_a) {
5195
5269
  classNames: classNames.overrideWrongDocumentTypeGuidanceDialog,
5196
5270
  verbiage: rawVerbiage.overrideWrongDocumentTypeGuidanceDialog
5197
5271
  }))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugBoundingBoxOverlay, {
5198
- "$flipX": !isRearFacing,
5272
+ "$flipX": !((_j = cameraRef.current) === null || _j === void 0 ? void 0 : _j.isRearFacing),
5199
5273
  scaling: debugScalingDetails
5200
5274
  }, state.detectedObjects.map(function (obj, i) {
5275
+ var _a;
5201
5276
  return /*#__PURE__*/React__namespace.default.createElement(IdCaptureDetectedObjectDebugBox, {
5202
5277
  key: i,
5203
5278
  obj: obj,
5204
5279
  scaling: debugScalingDetails,
5205
- flipX: !isRearFacing
5280
+ flipX: !((_a = cameraRef.current) === null || _a === void 0 ? void 0 : _a.isRearFacing)
5206
5281
  });
5207
- }))), 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")))));
5282
+ }))), 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")))));
5208
5283
  };
5209
5284
  var timeSince = function timeSince(t) {
5210
5285
  if (!t) return 0;
@@ -5221,9 +5296,7 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
5221
5296
  colors = _e === void 0 ? {} : _e,
5222
5297
  _f = _a.verbiage,
5223
5298
  rawVerbiage = _f === void 0 ? {} : _f;
5224
- var requestCameraAccess = useCameraStore(function (state) {
5225
- return state.requestCameraAccess;
5226
- });
5299
+ var requestCameraAccess = React.useContext(CameraStateContext).requestCameraAccess;
5227
5300
  assets.imageUrl || (assets.imageUrl = DEFAULT_CDN_URL + '/camera-disable-icon.png');
5228
5301
  var verbiage = useTranslations(rawVerbiage, {
5229
5302
  headingText: 'Your camera permission is disabled',
@@ -5871,7 +5944,7 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
5871
5944
  var _o = React.useContext(IdCaptureModelsContext),
5872
5945
  modelsReady = _o.ready,
5873
5946
  modelDownloadProgress = _o.modelDownloadProgress;
5874
- var _p = useCameraStore(),
5947
+ var _p = React.useContext(CameraStateContext),
5875
5948
  cameraReady = _p.cameraReady,
5876
5949
  cameraAccessDenied = _p.cameraAccessDenied,
5877
5950
  iphoneContinuityCameraAvailable = _p.iphoneContinuityCameraAvailable,
@@ -6069,14 +6142,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
6069
6142
  var _l = React.useContext(IdCaptureModelsContext),
6070
6143
  modelsReady = _l.ready,
6071
6144
  modelDownloadProgress = _l.modelDownloadProgress;
6072
- var _m = useCameraStore(shallow.useShallow(function (state) {
6073
- return {
6074
- cameraReady: state.cameraReady,
6075
- cameraAccessDenied: state.cameraAccessDenied,
6076
- iphoneContinuityCameraAvailable: state.iphoneContinuityCameraAvailable,
6077
- setIphoneContinuityCameraAllowed: state.setIphoneContinuityCameraAllowed
6078
- };
6079
- })),
6145
+ var _m = React.useContext(CameraStateContext),
6080
6146
  cameraReady = _m.cameraReady,
6081
6147
  cameraAccessDenied = _m.cameraAccessDenied,
6082
6148
  iphoneContinuityCameraAvailable = _m.iphoneContinuityCameraAvailable,
@@ -6622,24 +6688,23 @@ function getOrientation(allowPortraitOnMobile) {
6622
6688
  }
6623
6689
 
6624
6690
  var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
6625
- var _b = _a.idCaptureGuideImages,
6626
- idCaptureGuideImages = _b === void 0 ? defaultIdCaptureGuideImages : _b,
6627
- _c = _a.classNames,
6628
- classNames = _c === void 0 ? {} : _c,
6691
+ var _b;
6692
+ var _c = _a.idCaptureGuideImages,
6693
+ idCaptureGuideImages = _c === void 0 ? defaultIdCaptureGuideImages : _c,
6694
+ _d = _a.classNames,
6695
+ classNames = _d === void 0 ? {} : _d,
6629
6696
  borderWidth = _a.borderWidth,
6630
6697
  borderColor = _a.borderColor,
6631
6698
  borderRadius = _a.borderRadius,
6632
6699
  imageStyle = _a.imageStyle;
6633
- var isRearFacing = useCameraStore(function (state) {
6634
- return state.isRearFacing;
6635
- });
6636
- var isMirrored = !isRearFacing;
6637
- var _d = React.useState(1),
6638
- transitionTime = _d[0],
6639
- setTransitionTime = _d[1];
6640
- var _e = React.useState(0),
6641
- rotationAngle = _e[0],
6642
- setRotationAngle = _e[1];
6700
+ var cameraRef = React.useContext(CameraStateContext).cameraRef;
6701
+ var isMirrored = !((_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing);
6702
+ var _e = React.useState(1),
6703
+ transitionTime = _e[0],
6704
+ setTransitionTime = _e[1];
6705
+ var _f = React.useState(0),
6706
+ rotationAngle = _f[0],
6707
+ setRotationAngle = _f[1];
6643
6708
  var frontTransforms = ["rotateY(".concat(rotationAngle, "deg)")];
6644
6709
  if (isMirrored) frontTransforms.push('scaleX(-1)');
6645
6710
  var backTransforms = ["rotateY(".concat(180 - rotationAngle, "deg)")];
@@ -7163,30 +7228,29 @@ var Canvas$1 = styled__default.default.canvas(templateObject_2$n || (templateObj
7163
7228
  var templateObject_1$r, templateObject_2$n;
7164
7229
 
7165
7230
  function IdCaptureGuides(_a) {
7166
- var _b = _a.guideType,
7167
- guideType = _b === void 0 ? 'fit' : _b,
7168
- _c = _a.status,
7169
- status = _c === void 0 ? 'ready' : _c,
7170
- _d = _a.progress,
7171
- progress = _d === void 0 ? 0 : _d,
7172
- _e = _a.portraitGuidesOnMobile,
7173
- portraitGuidesOnMobile = _e === void 0 ? true : _e,
7174
- _f = _a.requestedAction,
7175
- requestedAction = _f === void 0 ? 'SHOW_ID_FRONT' : _f,
7176
- _g = _a.isBackToFront,
7177
- isBackToFront = _g === void 0 ? false : _g,
7178
- _h = _a.images,
7179
- images = _h === void 0 ? defaultIdCaptureGuideImages : _h,
7180
- _j = _a.classNames,
7181
- classNames = _j === void 0 ? {} : _j,
7182
- _k = _a.colors,
7183
- colors = _k === void 0 ? {} : _k,
7184
- _l = _a.verbiage,
7185
- rawVerbiage = _l === void 0 ? {} : _l;
7231
+ var _b, _c;
7232
+ var _d = _a.guideType,
7233
+ guideType = _d === void 0 ? 'fit' : _d,
7234
+ _e = _a.status,
7235
+ status = _e === void 0 ? 'ready' : _e,
7236
+ _f = _a.progress,
7237
+ progress = _f === void 0 ? 0 : _f,
7238
+ _g = _a.portraitGuidesOnMobile,
7239
+ portraitGuidesOnMobile = _g === void 0 ? true : _g,
7240
+ _h = _a.requestedAction,
7241
+ requestedAction = _h === void 0 ? 'SHOW_ID_FRONT' : _h,
7242
+ _j = _a.isBackToFront,
7243
+ isBackToFront = _j === void 0 ? false : _j,
7244
+ _k = _a.images,
7245
+ images = _k === void 0 ? defaultIdCaptureGuideImages : _k,
7246
+ _l = _a.classNames,
7247
+ classNames = _l === void 0 ? {} : _l,
7248
+ _m = _a.colors,
7249
+ colors = _m === void 0 ? {} : _m,
7250
+ _o = _a.verbiage,
7251
+ rawVerbiage = _o === void 0 ? {} : _o;
7186
7252
  var state = useIdCaptureState()[0];
7187
- var isRearFacing = useCameraStore(function (state) {
7188
- return state.isRearFacing;
7189
- });
7253
+ var cameraRef = React.useContext(CameraStateContext).cameraRef;
7190
7254
  var verbiage = useTranslations(rawVerbiage, {
7191
7255
  instructionText: 'Scan the front of ID',
7192
7256
  capturingText: 'Capturing...',
@@ -7198,7 +7262,7 @@ function IdCaptureGuides(_a) {
7198
7262
  status: status,
7199
7263
  progress: progress,
7200
7264
  instruction: state.captureFailed ? verbiage.captureFailedText : state.capturing ? verbiage === null || verbiage === void 0 ? void 0 : verbiage.capturingText : verbiage.instructionText,
7201
- isMirrored: !isRearFacing,
7265
+ isMirrored: !((_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing),
7202
7266
  borderColor: state.isGoodFrame ? colors.guideBoxSatisfiedColor : colors.guideBoxUnsatisfiedColor,
7203
7267
  imageVisible: requestedAction === 'FLIP_ID' || !state.idCardFrontDetectionThresholdMet || !state.documentInBounds || state.documentTooClose
7204
7268
  })), guideType === 'fit' && ( /*#__PURE__*/React__namespace.default.createElement(IdCaptureFitGuide, {
@@ -7208,7 +7272,7 @@ function IdCaptureGuides(_a) {
7208
7272
  status: status,
7209
7273
  progress: progress,
7210
7274
  instruction: state.captureFailed ? verbiage.captureFailedText : state.capturing ? verbiage === null || verbiage === void 0 ? void 0 : verbiage.capturingText : verbiage.instructionText,
7211
- isMirrored: !isRearFacing,
7275
+ isMirrored: !((_c = cameraRef.current) === null || _c === void 0 ? void 0 : _c.isRearFacing),
7212
7276
  isBackToFront: isBackToFront,
7213
7277
  portraitGuidesOnMobile: portraitGuidesOnMobile,
7214
7278
  borderColor: state.isGoodFrame ? colors.guideBoxSatisfiedColor : colors.guideBoxUnsatisfiedColor,
@@ -7307,6 +7371,48 @@ var ImagePreviewText = styled__default.default.div(templateObject_3$h || (templa
7307
7371
  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"])));
7308
7372
  var templateObject_1$q, templateObject_2$m, templateObject_3$h, templateObject_4$b;
7309
7373
 
7374
+ var CameraVideoTag = function CameraVideoTag(_a) {
7375
+ var _b;
7376
+ var className = _a.className;
7377
+ var _c = React.useContext(CameraStateContext),
7378
+ videoRef = _c.videoRef,
7379
+ setVideoLoaded = _c.setVideoLoaded,
7380
+ onVideoUnmounted = _c.onVideoUnmounted,
7381
+ cameraRef = _c.cameraRef;
7382
+ React.useEffect(function notifyCameraProviderOfUnmount() {
7383
+ var videoElement = videoRef.current;
7384
+ if (!videoElement) return;
7385
+ return function () {
7386
+ onVideoUnmounted(videoElement);
7387
+ };
7388
+ }, [onVideoUnmounted, videoRef]);
7389
+ React.useEffect(function setVideoLoadedToFalseOnMount() {
7390
+ setVideoLoaded(false);
7391
+ }, [setVideoLoaded]);
7392
+ React.useEffect(function attachCameraStreamToVideoTagWhenReady() {
7393
+ var _a;
7394
+ if (videoRef.current && ((_a = cameraRef.current) === null || _a === void 0 ? void 0 : _a.stream)) {
7395
+ videoRef.current.srcObject = cameraRef.current.stream;
7396
+ }
7397
+ }, [cameraRef, videoRef]);
7398
+ var onLoadedData = React.useCallback(function () {
7399
+ setVideoLoaded(true);
7400
+ }, [setVideoLoaded]);
7401
+ return /*#__PURE__*/React__namespace.default.createElement(FullscreenVideoTag, {
7402
+ className: className,
7403
+ autoPlay: true,
7404
+ playsInline: true,
7405
+ muted: true,
7406
+ ref: videoRef,
7407
+ onLoadedData: onLoadedData,
7408
+ "$isRearFacing": (_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing
7409
+ });
7410
+ };
7411
+ 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) {
7412
+ return props.$isRearFacing ? '' : 'scaleX(-1)';
7413
+ });
7414
+ var templateObject_1$p;
7415
+
7310
7416
  var documentCaptureInitialState = {
7311
7417
  documents: [],
7312
7418
  currentDocumentIndex: 0,
@@ -7425,8 +7531,8 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
7425
7531
  var _c = React.useReducer(documentCaptureStateReducer, documentCaptureInitialState),
7426
7532
  state = _c[0],
7427
7533
  dispatch = _c[1];
7428
- var _d = useCameraStore(),
7429
- videoStream = _d.videoStream,
7534
+ var _d = React.useContext(CameraStateContext),
7535
+ cameraRef = _d.cameraRef,
7430
7536
  videoRef = _d.videoRef;
7431
7537
  var uploadDocument = React.useContext(SubmissionContext).uploadDocument;
7432
7538
  var uploadCapturedDocument = React.useCallback(function (content, filetype) {
@@ -7517,7 +7623,8 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
7517
7623
  }, [onResize]);
7518
7624
  var videoTag = videoRef.current;
7519
7625
  React.useEffect(function () {
7520
- if (!state.capturing || !(videoStream === null || videoStream === void 0 ? void 0 : videoStream.active)) return;
7626
+ if (!state.capturing) return;
7627
+ if (!cameraRef.current) return;
7521
7628
  function onComplete(content) {
7522
7629
  if (!content) return;
7523
7630
  var contentUrl = URL.createObjectURL(content);
@@ -7530,7 +7637,7 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
7530
7637
  });
7531
7638
  }
7532
7639
  if (typeof ImageCapture !== 'undefined') {
7533
- var tracks = videoStream.getTracks();
7640
+ var tracks = cameraRef.current.stream.getTracks();
7534
7641
  var videoCameraTrack = tracks.find(function (track) {
7535
7642
  return track.kind === 'video';
7536
7643
  });
@@ -7545,7 +7652,7 @@ var DocumentCaptureStateProvider = function DocumentCaptureStateProvider(_a) {
7545
7652
  drawToCanvas(canvas, videoTag);
7546
7653
  canvas.toBlob(onComplete);
7547
7654
  }
7548
- }, [state.capturing, videoStream, videoTag]);
7655
+ }, [cameraRef, state.capturing, videoTag]);
7549
7656
  var stateWithActions = React.useMemo(function () {
7550
7657
  return _assign(_assign({}, state), {
7551
7658
  uploadCapturedDocument: uploadCapturedDocument
@@ -7660,85 +7767,52 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
7660
7767
  ref: canvasRef
7661
7768
  }));
7662
7769
  };
7663
- 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) {
7770
+ 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) {
7664
7771
  return props.$maskColor;
7665
7772
  });
7666
7773
  var Canvas = styled__default.default.canvas(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
7667
- var templateObject_1$p, templateObject_2$l;
7774
+ var templateObject_1$o, templateObject_2$l;
7668
7775
 
7669
- var CameraFeedWrapper = styled__default.default.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
7776
+ var CameraFeedWrapper = styled__default.default.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
7670
7777
  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;") : "";
7671
7778
  });
7672
- var templateObject_1$o;
7673
-
7674
- var CameraVideoTag = function CameraVideoTag(props) {
7675
- var _a = useCameraStore(shallow.useShallow(function (store) {
7676
- return {
7677
- videoRef: store.videoRef,
7678
- videoStream: store.videoStream,
7679
- onVideoMounted: store.onVideoMounted,
7680
- isRearFacing: store.isRearFacing
7681
- };
7682
- })),
7683
- videoRef = _a.videoRef,
7684
- videoStream = _a.videoStream,
7685
- onVideoMounted = _a.onVideoMounted,
7686
- isRearFacing = _a.isRearFacing;
7687
- React.useEffect(function attachCameraStreamToVideoTagWhenReady() {
7688
- if (videoRef.current && videoStream) {
7689
- debug('attaching camera stream to video tag');
7690
- videoRef.current.srcObject = videoStream;
7691
- }
7692
- }, [videoStream, videoRef]);
7693
- return /*#__PURE__*/React__namespace.default.createElement(FullscreenVideoTag, _assign({
7694
- autoPlay: true,
7695
- playsInline: true,
7696
- muted: true,
7697
- ref: videoRef,
7698
- onLoadedData: onVideoMounted,
7699
- "$isRearFacing": isRearFacing
7700
- }, props));
7701
- };
7702
- 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) {
7703
- return props.$isRearFacing ? '' : 'scaleX(-1)';
7704
- });
7705
7779
  var templateObject_1$n;
7706
7780
 
7707
7781
  var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
7708
- var _b, _c, _d, _e, _f;
7782
+ var _b, _c, _d, _e, _f, _g, _h;
7709
7783
  var onCaptureClicked = _a.onCaptureClicked,
7710
- _g = _a.classNames,
7711
- classNames = _g === void 0 ? {} : _g,
7712
- _h = _a.verbiage,
7713
- rawVerbiage = _h === void 0 ? {} : _h;
7714
- var _j = useDocumentCaptureState(),
7715
- _k = _j[0],
7716
- documents = _k.documents,
7717
- currentDocumentIndex = _k.currentDocumentIndex,
7718
- rectX = _k.rectX,
7719
- rectY = _k.rectY,
7720
- rectWidth = _k.rectWidth,
7721
- rectHeight = _k.rectHeight,
7722
- rectOffsetTop = _k.rectOffsetTop,
7723
- capturing = _k.capturing,
7724
- uploadCapturedDocument = _k.uploadCapturedDocument,
7725
- dispatch = _j[1];
7726
- var _l = (_b = documents[currentDocumentIndex]) !== null && _b !== void 0 ? _b : {},
7727
- title = _l.title,
7728
- aspectRatio = _l.aspectRatio,
7729
- cameraFeedMode = _l.cameraFeedMode,
7730
- instructions = _l.instructions,
7731
- contentUrl = _l.contentUrl,
7732
- content = _l.content,
7733
- uploadState = _l.uploadState;
7734
- var _m = useCameraStore(),
7735
- videoStream = _m.videoStream,
7736
- cameraReady = _m.cameraReady,
7737
- cameraAccessDenied = _m.cameraAccessDenied,
7738
- requestCameraAccess = _m.requestCameraAccess;
7739
- var _o = React.useState(false),
7740
- cameraAccessRequested = _o[0],
7741
- setCameraAccessRequested = _o[1];
7784
+ _j = _a.classNames,
7785
+ classNames = _j === void 0 ? {} : _j,
7786
+ _k = _a.verbiage,
7787
+ rawVerbiage = _k === void 0 ? {} : _k;
7788
+ var _l = useDocumentCaptureState(),
7789
+ _m = _l[0],
7790
+ documents = _m.documents,
7791
+ currentDocumentIndex = _m.currentDocumentIndex,
7792
+ rectX = _m.rectX,
7793
+ rectY = _m.rectY,
7794
+ rectWidth = _m.rectWidth,
7795
+ rectHeight = _m.rectHeight,
7796
+ rectOffsetTop = _m.rectOffsetTop,
7797
+ capturing = _m.capturing,
7798
+ uploadCapturedDocument = _m.uploadCapturedDocument,
7799
+ dispatch = _l[1];
7800
+ var _o = (_b = documents[currentDocumentIndex]) !== null && _b !== void 0 ? _b : {},
7801
+ title = _o.title,
7802
+ aspectRatio = _o.aspectRatio,
7803
+ cameraFeedMode = _o.cameraFeedMode,
7804
+ instructions = _o.instructions,
7805
+ contentUrl = _o.contentUrl,
7806
+ content = _o.content,
7807
+ uploadState = _o.uploadState;
7808
+ var _p = React.useContext(CameraStateContext),
7809
+ cameraRef = _p.cameraRef,
7810
+ cameraReady = _p.cameraReady,
7811
+ cameraAccessDenied = _p.cameraAccessDenied,
7812
+ requestCameraAccess = _p.requestCameraAccess;
7813
+ var _q = React.useState(false),
7814
+ cameraAccessRequested = _q[0],
7815
+ setCameraAccessRequested = _q[1];
7742
7816
  var cameraAccessNeeded =
7743
7817
  // we should force the browser to ask for camera access if...
7744
7818
  uploadState === 'not_started' &&
@@ -7747,14 +7821,14 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
7747
7821
  // and the user hasn't passed a media blob for the current document...
7748
7822
  !cameraAccessRequested &&
7749
7823
  // and we haven't already tried to force a camera request...
7750
- !(videoStream === null || videoStream === void 0 ? void 0 : videoStream.active); // and we don't already have camera access.
7824
+ !((_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.
7751
7825
  React.useEffect(function requestCameraAccessIfNeeded() {
7752
7826
  if (!cameraAccessNeeded) return;
7753
7827
  setCameraAccessRequested(true);
7754
7828
  requestCameraAccess();
7755
7829
  }, [cameraAccessNeeded, requestCameraAccess]);
7756
7830
  var theme = styled.useTheme();
7757
- 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)";
7831
+ 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)";
7758
7832
  var verbiage = useTranslations(rawVerbiage, {
7759
7833
  headingText: title,
7760
7834
  loadingBtnText: 'Camera initializing...',
@@ -7787,7 +7861,7 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
7787
7861
  });
7788
7862
  }
7789
7863
  return /*#__PURE__*/React__namespace.default.createElement(PageContainer, {
7790
- className: "flex ".concat((_f = classNames.container) !== null && _f !== void 0 ? _f : '')
7864
+ className: "flex ".concat((_h = classNames.container) !== null && _h !== void 0 ? _h : '')
7791
7865
  }, /*#__PURE__*/React__namespace.default.createElement(CameraFeedWrapper, {
7792
7866
  className: classNames.cameraFeedWrapper,
7793
7867
  "$mode": cameraFeedMode !== null && cameraFeedMode !== void 0 ? cameraFeedMode : 'snapToGuides',
@@ -8212,7 +8286,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
8212
8286
  var _3 = useIdCaptureState(),
8213
8287
  state = _3[0],
8214
8288
  dispatch = _3[1];
8215
- var _4 = useCameraStore(),
8289
+ var _4 = React.useContext(CameraStateContext),
8216
8290
  cameraAccessDenied = _4.cameraAccessDenied,
8217
8291
  requestCameraAccess = _4.requestCameraAccess,
8218
8292
  releaseCameraAccess = _4.releaseCameraAccess;
@@ -8337,7 +8411,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
8337
8411
  type: 'resetWizard'
8338
8412
  });
8339
8413
  onExitCapture === null || onExitCapture === void 0 ? void 0 : onExitCapture();
8340
- void requestCameraAccess();
8414
+ requestCameraAccess();
8341
8415
  }, [dispatch, onExitCapture, releaseCameraAccess, requestCameraAccess]);
8342
8416
  React.useEffect(function () {
8343
8417
  if (submissionStatus !== SubmissionStatus.READY) {
@@ -9160,13 +9234,7 @@ function SelfieGuidanceModelsProvider(_a) {
9160
9234
  modelLoadTimeoutMs = _c === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _c,
9161
9235
  _d = _a.requireVerticalFaceCentering,
9162
9236
  requireVerticalFaceCentering = _d === void 0 ? true : _d;
9163
- var _e = useCameraStore(shallow.useShallow(function (state) {
9164
- return {
9165
- videoRef: state.videoRef,
9166
- videoLoaded: state.videoLoaded,
9167
- cameraReady: state.cameraReady
9168
- };
9169
- })),
9237
+ var _e = React.useContext(CameraStateContext),
9170
9238
  videoRef = _e.videoRef,
9171
9239
  videoLoaded = _e.videoLoaded,
9172
9240
  cameraReady = _e.cameraReady;
@@ -9174,8 +9242,7 @@ function SelfieGuidanceModelsProvider(_a) {
9174
9242
  var onPredictionHandler = React.useRef();
9175
9243
  var _f = useLoadFaceDetector({
9176
9244
  onModelError: onModelError,
9177
- modelLoadTimeoutMs: modelLoadTimeoutMs,
9178
- videoRef: videoRef
9245
+ modelLoadTimeoutMs: modelLoadTimeoutMs
9179
9246
  }),
9180
9247
  ready = _f.ready,
9181
9248
  modelDownloadProgress = _f.modelDownloadProgress,
@@ -9508,14 +9575,8 @@ var SelfieCapture = function SelfieCapture(_a) {
9508
9575
  prediction = _t.prediction,
9509
9576
  dispatch = _s[1];
9510
9577
  var lastPredictionCanvas = React.useRef(null);
9511
- var _u = useCameraStore(shallow.useShallow(function (state) {
9512
- return {
9513
- camera: state.camera,
9514
- cameraReady: state.cameraReady,
9515
- videoRef: state.videoRef
9516
- };
9517
- })),
9518
- camera = _u.camera,
9578
+ var _u = React.useContext(CameraStateContext),
9579
+ cameraRef = _u.cameraRef,
9519
9580
  videoRef = _u.videoRef;
9520
9581
  var _v = React.useContext(SelfieGuidanceModelsContext),
9521
9582
  onPredictionMade = _v.onPredictionMade,
@@ -9605,7 +9666,7 @@ var SelfieCapture = function SelfieCapture(_a) {
9605
9666
  face: prediction.face,
9606
9667
  scaling: debugScalingDetails,
9607
9668
  color: satisfied ? 'green' : 'red'
9608
- }))), 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, {
9669
+ }))), 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, {
9609
9670
  onClick: onExit,
9610
9671
  className: classNames.exitCaptureBtn
9611
9672
  }));
@@ -10061,9 +10122,7 @@ var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
10061
10122
  colors = _e === void 0 ? {} : _e,
10062
10123
  _f = _a.verbiage,
10063
10124
  rawVerbiage = _f === void 0 ? {} : _f;
10064
- var requestMicrophoneAccess = useCameraStore(function (state) {
10065
- return state.requestMicrophoneAccess;
10066
- });
10125
+ var requestMicrophoneAccess = React.useContext(CameraStateContext).requestMicrophoneAccess;
10067
10126
  assets.imageUrl || (assets.imageUrl = DEFAULT_CDN_URL + '/microphone-disable-icon.svg');
10068
10127
  var verbiage = useTranslations(rawVerbiage, {
10069
10128
  headingText: 'Your microphone permission is disabled',
@@ -10111,13 +10170,7 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
10111
10170
  colors = _e === void 0 ? {} : _e,
10112
10171
  _f = _a.verbiage,
10113
10172
  rawVerbiage = _f === void 0 ? {} : _f;
10114
- var _g = useCameraStore(shallow.useShallow(function (state) {
10115
- return {
10116
- cameraReady: state.cameraReady,
10117
- cameraAccessDenied: state.cameraAccessDenied,
10118
- microphoneAccessDenied: state.microphoneAccessDenied
10119
- };
10120
- })),
10173
+ var _g = React.useContext(CameraStateContext),
10121
10174
  cameraReady = _g.cameraReady,
10122
10175
  cameraAccessDenied = _g.cameraAccessDenied,
10123
10176
  microphoneAccessDenied = _g.microphoneAccessDenied;
@@ -10204,13 +10257,7 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
10204
10257
  colors = _e === void 0 ? {} : _e,
10205
10258
  _f = _a.verbiage,
10206
10259
  rawVerbiage = _f === void 0 ? {} : _f;
10207
- var _g = useCameraStore(shallow.useShallow(function (state) {
10208
- return {
10209
- cameraReady: state.cameraReady,
10210
- cameraAccessDenied: state.cameraAccessDenied,
10211
- microphoneAccessDenied: state.microphoneAccessDenied
10212
- };
10213
- })),
10260
+ var _g = React.useContext(CameraStateContext),
10214
10261
  cameraReady = _g.cameraReady,
10215
10262
  cameraAccessDenied = _g.cameraAccessDenied,
10216
10263
  microphoneAccessDenied = _g.microphoneAccessDenied;
@@ -10427,13 +10474,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
10427
10474
  livenessCheckRequest = _t.livenessCheckRequest,
10428
10475
  setSelfieImage = _t.setSelfieImage,
10429
10476
  logSelfieCaptureAttempt = _t.logSelfieCaptureAttempt;
10430
- var _u = useCameraStore(shallow.useShallow(function (state) {
10431
- return {
10432
- cameraAccessDenied: state.cameraAccessDenied,
10433
- requestCameraAccess: state.requestCameraAccess,
10434
- releaseCameraAccess: state.releaseCameraAccess
10435
- };
10436
- })),
10477
+ var _u = React.useContext(CameraStateContext),
10437
10478
  cameraAccessDenied = _u.cameraAccessDenied,
10438
10479
  requestCameraAccess = _u.requestCameraAccess,
10439
10480
  releaseCameraAccess = _u.releaseCameraAccess;
@@ -11154,10 +11195,10 @@ function VideoSignatureContextProvider(_a) {
11154
11195
  setSignatureVideoUrl = _e[1];
11155
11196
  var signatureRecorder = React.useRef(null);
11156
11197
  var recordedChunks = React.useRef([]);
11157
- var _f = useCameraStore(),
11158
- camera = _f.camera,
11198
+ var _f = React.useContext(CameraStateContext),
11199
+ cameraRef = _f.cameraRef,
11159
11200
  videoRef = _f.videoRef;
11160
- var _g = useVideoRecorder(camera),
11201
+ var _g = useVideoRecorder(cameraRef.current),
11161
11202
  isRecordingVideo = _g.isRecordingVideo,
11162
11203
  startRecordingVideo = _g.startRecordingVideo,
11163
11204
  stopRecordingVideo = _g.stopRecordingVideo,
@@ -11225,8 +11266,8 @@ function VideoSignatureContextProvider(_a) {
11225
11266
  var animationFrame = React.useRef(0);
11226
11267
  React.useEffect(function () {
11227
11268
  var _a;
11228
- if (!signaturePad.current || !videoRef.current || !outputCanvas.current || !camera || !isRecording || !isRecordingVideo) return;
11229
- var _b = [camera.width, camera.height],
11269
+ if (!signaturePad.current || !videoRef.current || !outputCanvas.current || !cameraRef.current || !isRecording || !isRecordingVideo) return;
11270
+ var _b = [cameraRef.current.width, cameraRef.current.height],
11230
11271
  w = _b[0],
11231
11272
  h = _b[1];
11232
11273
  var isPortrait = typeof window !== 'undefined' && window.innerWidth < window.innerHeight;
@@ -11259,7 +11300,7 @@ function VideoSignatureContextProvider(_a) {
11259
11300
  return function () {
11260
11301
  cancelAnimationFrame(animationFrame.current);
11261
11302
  };
11262
- }, [camera, isRecording, isRecordingVideo, videoRef]);
11303
+ }, [cameraRef, isRecording, isRecordingVideo, videoRef]);
11263
11304
  var onAcceptClicked = React.useCallback(function () {
11264
11305
  return __awaiter(_this, void 0, void 0, function () {
11265
11306
  var imageUrl;
@@ -11388,29 +11429,27 @@ var AcceptBtn = styled__default.default(LoaderButton)(templateObject_7$1 || (tem
11388
11429
  var templateObject_1$9, templateObject_2$8, templateObject_3$8, templateObject_4$3, templateObject_5$2, templateObject_6$2, templateObject_7$1;
11389
11430
 
11390
11431
  var VideoSignatureCapture = function VideoSignatureCapture(_a) {
11391
- var _b;
11432
+ var _b, _c, _d;
11392
11433
  var onVideoCaptured = _a.onVideoCaptured,
11393
11434
  onFaceNotDetected = _a.onFaceNotDetected,
11394
11435
  onExit = _a.onExit,
11395
11436
  guidesComponent = _a.guidesComponent,
11396
- _c = _a.classNames,
11397
- classNames = _c === void 0 ? {} : _c,
11398
- _d = _a.colors,
11399
- colors = _d === void 0 ? {} : _d,
11400
- _e = _a.verbiage,
11401
- rawVerbiage = _e === void 0 ? {} : _e,
11402
- _f = _a.debugMode,
11403
- debugMode = _f === void 0 ? false : _f;
11404
- var camera = useCameraStore(function (state) {
11405
- return state.camera;
11406
- });
11437
+ _e = _a.classNames,
11438
+ classNames = _e === void 0 ? {} : _e,
11439
+ _f = _a.colors,
11440
+ colors = _f === void 0 ? {} : _f,
11441
+ _g = _a.verbiage,
11442
+ rawVerbiage = _g === void 0 ? {} : _g,
11443
+ _h = _a.debugMode,
11444
+ debugMode = _h === void 0 ? false : _h;
11445
+ var cameraRef = React.useContext(CameraStateContext).cameraRef;
11407
11446
  var onPredictionMade = React.useContext(SelfieGuidanceModelsContext).onPredictionMade;
11408
- var _g = useVideoSignatureContext(),
11409
- signatureData = _g.signatureData,
11410
- signatureDataUrl = _g.signatureDataUrl,
11411
- signatureVideoData = _g.signatureVideoData,
11412
- startRecording = _g.startRecording,
11413
- stopRecording = _g.stopRecording;
11447
+ var _j = useVideoSignatureContext(),
11448
+ signatureData = _j.signatureData,
11449
+ signatureDataUrl = _j.signatureDataUrl,
11450
+ signatureVideoData = _j.signatureVideoData,
11451
+ startRecording = _j.startRecording,
11452
+ stopRecording = _j.stopRecording;
11414
11453
  React.useEffect(function () {
11415
11454
  startRecording();
11416
11455
  return function () {
@@ -11427,9 +11466,9 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
11427
11466
  onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
11428
11467
  }
11429
11468
  }, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
11430
- var _h = React.useState(0),
11431
- numFramesWithoutFaces = _h[0],
11432
- setNumFramesWithoutFaces = _h[1];
11469
+ var _k = React.useState(0),
11470
+ numFramesWithoutFaces = _k[0],
11471
+ setNumFramesWithoutFaces = _k[1];
11433
11472
  React.useEffect(function () {
11434
11473
  onPredictionMade(function (_a) {
11435
11474
  var face = _a.face;
@@ -11456,7 +11495,7 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
11456
11495
  }, verbiage.guidanceMessageText))), /*#__PURE__*/React__namespace.default.createElement(GuidesComponent, {
11457
11496
  classNames: classNames.videoSignatureGuidesClassNames,
11458
11497
  status: "success"
11459
- }), 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, {
11498
+ }), 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, {
11460
11499
  onClick: onExit,
11461
11500
  className: classNames.exitCaptureBtn
11462
11501
  }));
@@ -11550,13 +11589,7 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
11550
11589
  setSignatureData = _l.setSignatureData,
11551
11590
  setSignatureVideoUrl = _l.setSignatureVideoUrl,
11552
11591
  logSelfieCaptureAttempt = _l.logSelfieCaptureAttempt;
11553
- var _m = useCameraStore(shallow.useShallow(function (state) {
11554
- return {
11555
- cameraAccessDenied: state.cameraAccessDenied,
11556
- requestCameraAccess: state.requestCameraAccess,
11557
- releaseCameraAccess: state.releaseCameraAccess
11558
- };
11559
- })),
11592
+ var _m = React.useContext(CameraStateContext),
11560
11593
  cameraAccessDenied = _m.cameraAccessDenied,
11561
11594
  requestCameraAccess = _m.requestCameraAccess,
11562
11595
  releaseCameraAccess = _m.releaseCameraAccess;
@@ -11716,29 +11749,27 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
11716
11749
  };
11717
11750
 
11718
11751
  var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
11719
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
11720
- var _z = _a.requestedAction,
11721
- requestedAction = _z === void 0 ? 'SHOW_ID_FRONT' : _z,
11722
- _0 = _a.satisfied,
11723
- satisfied = _0 === void 0 ? false : _0,
11724
- _1 = _a.faceGuideStatus,
11725
- faceGuideStatus = _1 === void 0 ? 'success' : _1,
11752
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
11753
+ var _0 = _a.requestedAction,
11754
+ requestedAction = _0 === void 0 ? 'SHOW_ID_FRONT' : _0,
11755
+ _1 = _a.satisfied,
11756
+ satisfied = _1 === void 0 ? false : _1,
11757
+ _2 = _a.faceGuideStatus,
11758
+ faceGuideStatus = _2 === void 0 ? 'success' : _2,
11726
11759
  faceGuideBorderWidth = _a.faceGuideBorderWidth,
11727
11760
  faceGuideBorderColor = _a.faceGuideBorderColor,
11728
- _2 = _a.idCardGuideStatus,
11729
- idCardGuideStatus = _2 === void 0 ? 'ready' : _2,
11761
+ _3 = _a.idCardGuideStatus,
11762
+ idCardGuideStatus = _3 === void 0 ? 'ready' : _3,
11730
11763
  idCardGuideBorderWidth = _a.idCardGuideBorderWidth,
11731
11764
  idCardGuideBorderColor = _a.idCardGuideBorderColor,
11732
11765
  idCardCaptureProgress = _a.idCardCaptureProgress,
11733
- _3 = _a.idCardCaptureGuideImages,
11734
- userSuppliedImages = _3 === void 0 ? defaultIdCaptureGuideImages : _3,
11735
- _4 = _a.classNames,
11736
- classNames = _4 === void 0 ? {} : _4,
11737
- _5 = _a.verbiage,
11738
- rawVerbiage = _5 === void 0 ? {} : _5;
11739
- var isRearFacing = useCameraStore(function (state) {
11740
- return state.isRearFacing;
11741
- });
11766
+ _4 = _a.idCardCaptureGuideImages,
11767
+ userSuppliedImages = _4 === void 0 ? defaultIdCaptureGuideImages : _4,
11768
+ _5 = _a.classNames,
11769
+ classNames = _5 === void 0 ? {} : _5,
11770
+ _6 = _a.verbiage,
11771
+ rawVerbiage = _6 === void 0 ? {} : _6;
11772
+ var cameraRef = React.useContext(CameraStateContext).cameraRef;
11742
11773
  var verbiage = useTranslations(rawVerbiage, {
11743
11774
  idFrontInstructionText: 'Display the front of your ID card...',
11744
11775
  idBackInstructionText: 'Display the back of your ID card...',
@@ -11751,17 +11782,17 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
11751
11782
  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';
11752
11783
  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;
11753
11784
  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';
11754
- var _6 = useResizeObserver__default.default(),
11755
- idCardGuideRef = _6.ref,
11756
- _7 = _6.width,
11757
- idCardGuideWidth = _7 === void 0 ? 0 : _7,
11758
- _8 = _6.height,
11759
- idCardGuideHeight = _8 === void 0 ? 0 : _8;
11785
+ var _7 = useResizeObserver__default.default(),
11786
+ idCardGuideRef = _7.ref,
11787
+ _8 = _7.width,
11788
+ idCardGuideWidth = _8 === void 0 ? 0 : _8,
11789
+ _9 = _7.height,
11790
+ idCardGuideHeight = _9 === void 0 ? 0 : _9;
11760
11791
  var idCaptureGuideImages = useGuideImages(userSuppliedImages);
11761
11792
  var idCaptureGuideImagesByUrl = useGuideImagesByUrl(idCaptureGuideImages);
11762
- var _9 = React.useState(undefined),
11763
- aspectRatio = _9[0],
11764
- setAspectRatio = _9[1];
11793
+ var _10 = React.useState(undefined),
11794
+ aspectRatio = _10[0],
11795
+ setAspectRatio = _10[1];
11765
11796
  var onImageLoaded = React.useCallback(function (e) {
11766
11797
  var _a, _b, _c, _d;
11767
11798
  var img = e.currentTarget;
@@ -11808,7 +11839,7 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
11808
11839
  }, /*#__PURE__*/React__namespace.default.createElement(IdCardGuideImage, {
11809
11840
  alt: "",
11810
11841
  className: classNames.idCardGuideImage,
11811
- "$isMirrored": !isRearFacing,
11842
+ "$isMirrored": !((_v = cameraRef.current) === null || _v === void 0 ? void 0 : _v.isRearFacing),
11812
11843
  style: idCardImageStyle,
11813
11844
  src: requestedAction === 'SHOW_ID_BACK' ? idCaptureGuideImages.landscape.SHOW_ID_BACK.url : idCaptureGuideImages.landscape.SHOW_ID_FRONT.url,
11814
11845
  onLoad: onImageLoaded
@@ -11822,8 +11853,8 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
11822
11853
  className: classNames.idCardGuideInstructionsContainer
11823
11854
  }, /*#__PURE__*/React__namespace.default.createElement(IdCardGuideInstructions, {
11824
11855
  className: classNames.idCardGuideInstructions,
11825
- "$textColor": (_w = (_v = theme.idVideoCapture) === null || _v === void 0 ? void 0 : _v.idCardGuides) === null || _w === void 0 ? void 0 : _w.instructionsTextColor,
11826
- "$background": (_y = (_x = theme.idVideoCapture) === null || _x === void 0 ? void 0 : _x.idCardGuides) === null || _y === void 0 ? void 0 : _y.instructionsBackgroundColor
11856
+ "$textColor": (_x = (_w = theme.idVideoCapture) === null || _w === void 0 ? void 0 : _w.idCardGuides) === null || _x === void 0 ? void 0 : _x.instructionsTextColor,
11857
+ "$background": (_z = (_y = theme.idVideoCapture) === null || _y === void 0 ? void 0 : _y.idCardGuides) === null || _z === void 0 ? void 0 : _z.instructionsBackgroundColor
11827
11858
  }, instructionText))))));
11828
11859
  };
11829
11860
  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) {
@@ -11968,100 +11999,99 @@ var defaultVideoIdCaptureThresholds = {
11968
11999
  flipShortcutThreshold: 0.7
11969
12000
  };
11970
12001
  var IdVideoCapture = function IdVideoCapture(_a) {
11971
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
12002
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
11972
12003
  var onComplete = _a.onComplete,
11973
12004
  onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
11974
12005
  onIdBackImageCaptured = _a.onIdBackImageCaptured,
11975
12006
  onFaceNotDetected = _a.onFaceNotDetected,
11976
12007
  onRecordingFailed = _a.onRecordingFailed,
11977
12008
  onExitCapture = _a.onExitCapture,
11978
- _w = _a.idCaptureModelsEnabled,
11979
- idCaptureModelsEnabled = _w === void 0 ? true : _w,
11980
- _x = _a.idCardCaptureGuideImages,
11981
- idCardCaptureGuideImages = _x === void 0 ? defaultIdCaptureGuideImages : _x,
11982
- _y = _a.idCardFrontDelay,
11983
- idCardFrontDelay = _y === void 0 ? 1000 : _y,
11984
- _z = _a.videoIdCaptureThresholds,
11985
- videoIdCaptureThresholds = _z === void 0 ? defaultVideoIdCaptureThresholds : _z,
11986
- _0 = _a.skipShowIdCardBack,
11987
- skipShowIdCardBack = _0 === void 0 ? false : _0,
11988
- _1 = _a.captureCountdownSeconds,
11989
- captureCountdownSeconds = _1 === void 0 ? 3 : _1,
12009
+ _x = _a.idCaptureModelsEnabled,
12010
+ idCaptureModelsEnabled = _x === void 0 ? true : _x,
12011
+ _y = _a.idCardCaptureGuideImages,
12012
+ idCardCaptureGuideImages = _y === void 0 ? defaultIdCaptureGuideImages : _y,
12013
+ _z = _a.idCardFrontDelay,
12014
+ idCardFrontDelay = _z === void 0 ? 1000 : _z,
12015
+ _0 = _a.videoIdCaptureThresholds,
12016
+ videoIdCaptureThresholds = _0 === void 0 ? defaultVideoIdCaptureThresholds : _0,
12017
+ _1 = _a.skipShowIdCardBack,
12018
+ skipShowIdCardBack = _1 === void 0 ? false : _1,
12019
+ _2 = _a.captureCountdownSeconds,
12020
+ captureCountdownSeconds = _2 === void 0 ? 3 : _2,
11990
12021
  readTextPrompt = _a.readTextPrompt,
11991
- _2 = _a.readTextTimeoutDurationMs,
11992
- readTextTimeoutDurationMs = _2 === void 0 ? 15000 : _2,
11993
- _3 = _a.readTextMinReadingMs,
11994
- readTextMinReadingMs = _3 === void 0 ? 10000 : _3,
11995
- _4 = _a.disableFaceDetectionWhileAudioCapture,
11996
- disableFaceDetectionWhileAudioCapture = _4 === void 0 ? false : _4,
11997
- _5 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
11998
- disableFaceDetectionWhileAudioCaptureMsDelay = _5 === void 0 ? 2000 : _5,
11999
- _6 = _a.mergeAVStreams,
12000
- mergeAVStreams = _6 === void 0 ? false : _6,
12001
- _7 = _a.classNames,
12002
- classNames = _7 === void 0 ? {} : _7,
12003
- _8 = _a.colors,
12004
- colors = _8 === void 0 ? {} : _8,
12005
- _9 = _a.verbiage,
12006
- rawVerbiage = _9 === void 0 ? {} : _9,
12007
- _10 = _a.debugMode,
12008
- debugMode = _10 === void 0 ? false : _10;
12009
- var _11 = useResizeObserver__default.default(),
12010
- ref = _11.ref,
12011
- _12 = _11.width,
12012
- width = _12 === void 0 ? 1 : _12,
12013
- _13 = _11.height,
12014
- height = _13 === void 0 ? 1 : _13;
12015
- var _14 = useCameraStore(),
12016
- camera = _14.camera,
12017
- videoRef = _14.videoRef,
12018
- videoLoaded = _14.videoLoaded,
12019
- cameraReady = _14.cameraReady,
12020
- microphoneReady = _14.microphoneReady,
12021
- audioStream = _14.audioStream,
12022
- isRearFacing = _14.isRearFacing,
12023
- releaseCameraAccess = _14.releaseCameraAccess;
12024
- var _15 = React.useState([]),
12025
- detectedObjects = _15[0],
12026
- setDetectedObjects = _15[1];
12027
- var _16 = React.useState(null),
12028
- face = _16[0],
12029
- setFace = _16[1];
12030
- var _17 = React.useContext(IdCaptureModelsContext),
12031
- idModelsReady = _17.ready,
12032
- startIdModels = _17.start,
12033
- stopIdModels = _17.stop,
12034
- onIdPredictionMade = _17.onPredictionMade,
12035
- setThresholds = _17.setThresholds,
12036
- setDocumentDetectionBoundaries = _17.setDocumentDetectionBoundaries,
12037
- bestFrameDetails = _17.bestFrameDetails,
12038
- resetBestFrame = _17.resetBestFrame,
12039
- idModelError = _17.modelError;
12040
- var _18 = React.useState(null),
12041
- videoStartsAt = _18[0],
12042
- setVideoStartsAt = _18[1];
12043
- var _19 = React.useContext(SubmissionContext),
12044
- setIdCaptureVideoAudioStartsAt = _19.setIdCaptureVideoAudioStartsAt,
12045
- setExpectedAudioText = _19.setExpectedAudioText;
12046
- var _20 = React.useContext(SelfieGuidanceModelsContext),
12047
- startSelfieGuidance = _20.start,
12048
- stopSelfieGuidance = _20.stop,
12049
- onSelfiePredictionMade = _20.onPredictionMade,
12050
- selfieModelError = _20.error;
12051
- var _21 = useVideoRecorder(camera, audioStream, mergeAVStreams),
12052
- isRecordingVideo = _21.isRecordingVideo,
12053
- startRecordingVideo = _21.startRecordingVideo,
12054
- startRecordingAudio = _21.startRecordingAudio,
12055
- stopRecordingVideo = _21.stopRecordingVideo,
12056
- stopRecordingAudio = _21.stopRecordingAudio,
12057
- videoRecordingUnintentionallyStopped = _21.videoRecordingUnintentionallyStopped,
12058
- audioRecordingUnintentionallyStopped = _21.audioRecordingUnintentionallyStopped,
12059
- videoUrl = _21.videoUrl,
12060
- audioUrl = _21.audioUrl;
12022
+ _3 = _a.readTextTimeoutDurationMs,
12023
+ readTextTimeoutDurationMs = _3 === void 0 ? 15000 : _3,
12024
+ _4 = _a.readTextMinReadingMs,
12025
+ readTextMinReadingMs = _4 === void 0 ? 10000 : _4,
12026
+ _5 = _a.disableFaceDetectionWhileAudioCapture,
12027
+ disableFaceDetectionWhileAudioCapture = _5 === void 0 ? false : _5,
12028
+ _6 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
12029
+ disableFaceDetectionWhileAudioCaptureMsDelay = _6 === void 0 ? 2000 : _6,
12030
+ _7 = _a.mergeAVStreams,
12031
+ mergeAVStreams = _7 === void 0 ? false : _7,
12032
+ _8 = _a.classNames,
12033
+ classNames = _8 === void 0 ? {} : _8,
12034
+ _9 = _a.colors,
12035
+ colors = _9 === void 0 ? {} : _9,
12036
+ _10 = _a.verbiage,
12037
+ rawVerbiage = _10 === void 0 ? {} : _10,
12038
+ _11 = _a.debugMode,
12039
+ debugMode = _11 === void 0 ? false : _11;
12040
+ var _12 = useResizeObserver__default.default(),
12041
+ ref = _12.ref,
12042
+ _13 = _12.width,
12043
+ width = _13 === void 0 ? 1 : _13,
12044
+ _14 = _12.height,
12045
+ height = _14 === void 0 ? 1 : _14;
12046
+ var _15 = React.useContext(CameraStateContext),
12047
+ cameraRef = _15.cameraRef,
12048
+ videoRef = _15.videoRef,
12049
+ videoLoaded = _15.videoLoaded,
12050
+ cameraReady = _15.cameraReady,
12051
+ microphoneReady = _15.microphoneReady,
12052
+ audioStream = _15.audioStream,
12053
+ setVideoLoaded = _15.setVideoLoaded;
12054
+ var _16 = React.useState([]),
12055
+ detectedObjects = _16[0],
12056
+ setDetectedObjects = _16[1];
12057
+ var _17 = React.useState(null),
12058
+ face = _17[0],
12059
+ setFace = _17[1];
12060
+ var _18 = React.useContext(IdCaptureModelsContext),
12061
+ idModelsReady = _18.ready,
12062
+ startIdModels = _18.start,
12063
+ stopIdModels = _18.stop,
12064
+ onIdPredictionMade = _18.onPredictionMade,
12065
+ setThresholds = _18.setThresholds,
12066
+ setDocumentDetectionBoundaries = _18.setDocumentDetectionBoundaries,
12067
+ bestFrameDetails = _18.bestFrameDetails,
12068
+ resetBestFrame = _18.resetBestFrame,
12069
+ idModelError = _18.modelError;
12070
+ var _19 = React.useState(null),
12071
+ videoStartsAt = _19[0],
12072
+ setVideoStartsAt = _19[1];
12073
+ var _20 = React.useContext(SubmissionContext),
12074
+ setIdCaptureVideoAudioStartsAt = _20.setIdCaptureVideoAudioStartsAt,
12075
+ setExpectedAudioText = _20.setExpectedAudioText;
12076
+ var _21 = React.useContext(SelfieGuidanceModelsContext),
12077
+ startSelfieGuidance = _21.start,
12078
+ stopSelfieGuidance = _21.stop,
12079
+ onSelfiePredictionMade = _21.onPredictionMade,
12080
+ selfieModelError = _21.error;
12081
+ var _22 = useVideoRecorder(cameraRef.current, audioStream, mergeAVStreams),
12082
+ isRecordingVideo = _22.isRecordingVideo,
12083
+ startRecordingVideo = _22.startRecordingVideo,
12084
+ startRecordingAudio = _22.startRecordingAudio,
12085
+ stopRecordingVideo = _22.stopRecordingVideo,
12086
+ stopRecordingAudio = _22.stopRecordingAudio,
12087
+ videoRecordingUnintentionallyStopped = _22.videoRecordingUnintentionallyStopped,
12088
+ audioRecordingUnintentionallyStopped = _22.audioRecordingUnintentionallyStopped,
12089
+ videoUrl = _22.videoUrl,
12090
+ audioUrl = _22.audioUrl;
12061
12091
  var countdownTimeoutRef = React.useRef(undefined);
12062
- var _22 = React.useState(-1),
12063
- countdownRemaining = _22[0],
12064
- setCountdownRemaining = _22[1];
12092
+ var _23 = React.useState(-1),
12093
+ countdownRemaining = _23[0],
12094
+ setCountdownRemaining = _23[1];
12065
12095
  React.useEffect(function () {
12066
12096
  if (!isRecordingVideo && !videoUrl) {
12067
12097
  startRecordingVideo();
@@ -12072,18 +12102,18 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12072
12102
  var needsAudio = !!readTextPrompt && !mergeAVStreams;
12073
12103
  var audioReady = !needsAudio || audioUrl;
12074
12104
  if (videoUrl && audioReady) {
12075
- releaseCameraAccess();
12105
+ setVideoLoaded(false);
12076
12106
  onComplete === null || onComplete === void 0 ? void 0 : onComplete(videoUrl, audioUrl);
12077
12107
  }
12078
- }, [audioUrl, isRecordingVideo, mergeAVStreams, onComplete, readTextPrompt, releaseCameraAccess, startRecordingVideo, videoUrl]);
12108
+ }, [audioUrl, isRecordingVideo, mergeAVStreams, onComplete, readTextPrompt, setVideoLoaded, startRecordingVideo, videoUrl]);
12079
12109
  React.useEffect(function () {
12080
12110
  if (videoRecordingUnintentionallyStopped || audioRecordingUnintentionallyStopped) {
12081
12111
  onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
12082
12112
  }
12083
12113
  }, [audioRecordingUnintentionallyStopped, onRecordingFailed, videoRecordingUnintentionallyStopped]);
12084
- var _23 = React.useState('SHOW_ID_FRONT'),
12085
- requestedAction = _23[0],
12086
- setRequestedAction = _23[1];
12114
+ var _24 = React.useState('SHOW_ID_FRONT'),
12115
+ requestedAction = _24[0],
12116
+ setRequestedAction = _24[1];
12087
12117
  var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
12088
12118
  React.useEffect(function startModelsWhenCapturing() {
12089
12119
  if (!shouldRunIdModels) return;
@@ -12103,18 +12133,18 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12103
12133
  bottom: 1
12104
12134
  });
12105
12135
  }, [setDocumentDetectionBoundaries]);
12106
- var _24 = React.useState(0),
12107
- currentDetectionScore = _24[0],
12108
- setCurrentDetectionScore = _24[1];
12109
- var _25 = React.useState('none'),
12110
- currentDetectedDocumentType = _25[0],
12111
- setCurrentDetectedDocumentType = _25[1];
12112
- var _26 = React.useState(0),
12113
- currentFocusScore = _26[0],
12114
- setCurrentFocusScore = _26[1];
12136
+ var _25 = React.useState(0),
12137
+ currentDetectionScore = _25[0],
12138
+ setCurrentDetectionScore = _25[1];
12139
+ var _26 = React.useState('none'),
12140
+ currentDetectedDocumentType = _26[0],
12141
+ setCurrentDetectedDocumentType = _26[1];
12115
12142
  var _27 = React.useState(0),
12116
- goodFramesCount = _27[0],
12117
- setGoodFramesCount = _27[1];
12143
+ currentFocusScore = _27[0],
12144
+ setCurrentFocusScore = _27[1];
12145
+ var _28 = React.useState(0),
12146
+ goodFramesCount = _28[0],
12147
+ setGoodFramesCount = _28[1];
12118
12148
  var goodFramesThreshold = requestedAction === 'SHOW_ID_FRONT' ? videoIdCaptureThresholds.goodFrames.idCardFront : videoIdCaptureThresholds.goodFrames.idCardBack;
12119
12149
  var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
12120
12150
  React.useEffect(function () {
@@ -12135,9 +12165,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12135
12165
  } : 0);
12136
12166
  });
12137
12167
  }, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, videoIdCaptureThresholds.flipShortcutThreshold]);
12138
- var _28 = React.useState(null),
12139
- idFrontCaptureStartedAt = _28[0],
12140
- setFirstGoodFrameTime = _28[1];
12168
+ var _29 = React.useState(null),
12169
+ idFrontCaptureStartedAt = _29[0],
12170
+ setFirstGoodFrameTime = _29[1];
12141
12171
  React.useEffect(function () {
12142
12172
  if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
12143
12173
  }, [goodFramesCount]);
@@ -12158,9 +12188,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12158
12188
  var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
12159
12189
  var faceBox = face === null || face === void 0 ? void 0 : face.box;
12160
12190
  var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
12161
- var _29 = React.useState(),
12162
- countdownStartedAt = _29[0],
12163
- setCountdownStartedAt = _29[1];
12191
+ var _30 = React.useState(),
12192
+ countdownStartedAt = _30[0],
12193
+ setCountdownStartedAt = _30[1];
12164
12194
  var photoCanvas = React.useRef(null);
12165
12195
  var frameLock = React.useRef(false);
12166
12196
  var captureFrame = React.useCallback(function () {
@@ -12283,9 +12313,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12283
12313
  stopSelfieGuidance();
12284
12314
  };
12285
12315
  }, [startSelfieGuidance, stopSelfieGuidance]);
12286
- var _30 = React.useState(0),
12287
- numFramesWithoutFaces = _30[0],
12288
- setNumFramesWithoutFaces = _30[1];
12316
+ var _31 = React.useState(0),
12317
+ numFramesWithoutFaces = _31[0],
12318
+ setNumFramesWithoutFaces = _31[1];
12289
12319
  onSelfiePredictionMade(useDebounce.useThrottledCallback(React.useCallback(function (_a) {
12290
12320
  var face = _a.face;
12291
12321
  if (selfieModelError) return;
@@ -12301,12 +12331,12 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12301
12331
  }
12302
12332
  }, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
12303
12333
  var theme = styled.useTheme();
12304
- var _31 = useTranslations(rawVerbiage, {
12334
+ var _32 = useTranslations(rawVerbiage, {
12305
12335
  faceNotCenteredText: 'Please move your face to the center...',
12306
12336
  captureBtnText: 'Capture'
12307
12337
  }),
12308
- captureBtnText = _31.captureBtnText,
12309
- faceNotCenteredText = _31.faceNotCenteredText;
12338
+ captureBtnText = _32.captureBtnText,
12339
+ faceNotCenteredText = _32.faceNotCenteredText;
12310
12340
  var debugScalingDetails = useDebugScalingDetails({
12311
12341
  enabled: debugMode,
12312
12342
  pageWidth: width,
@@ -12342,14 +12372,15 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12342
12372
  faceGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor,
12343
12373
  idCardGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor
12344
12374
  }), debugMode && capturingId && ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ObjectDetectionDebugOverlayDiv, {
12345
- "$flipX": !isRearFacing
12375
+ "$flipX": !((_l = cameraRef.current) === null || _l === void 0 ? void 0 : _l.isRearFacing)
12346
12376
  }, detectedObjects.map(function (obj, i) {
12377
+ var _a;
12347
12378
  return /*#__PURE__*/React__namespace.default.createElement(IdCaptureDetectedObjectDebugBox, {
12348
12379
  key: i,
12349
12380
  obj: obj,
12350
12381
  scaling: debugScalingDetails,
12351
12382
  color: "blue",
12352
- flipX: !isRearFacing
12383
+ flipX: !((_a = cameraRef.current) === null || _a === void 0 ? void 0 : _a.isRearFacing)
12353
12384
  });
12354
12385
  })), /*#__PURE__*/React__namespace.default.createElement(DebugBoundingBoxOverlay, null, face && ( /*#__PURE__*/React__namespace.default.createElement(SelfieCaptureFaceDebugBox, {
12355
12386
  face: face,
@@ -12358,9 +12389,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
12358
12389
  className: classNames.guidanceMessageContainer
12359
12390
  }, /*#__PURE__*/React__namespace.default.createElement(GuidanceMessage, {
12360
12391
  className: classNames.guidanceMessage,
12361
- "$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',
12362
- "$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'
12363
- }, 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, {
12392
+ "$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',
12393
+ "$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'
12394
+ }, 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, {
12364
12395
  className: classNames.countdownContainer
12365
12396
  }, /*#__PURE__*/React__namespace.default.createElement(Countdown, {
12366
12397
  className: classNames.countdown
@@ -12657,14 +12688,16 @@ var VideoIdWizard = function VideoIdWizard(_a) {
12657
12688
  className: "flex"
12658
12689
  }, /*#__PURE__*/React__namespace.default.createElement(Spinner, null));
12659
12690
  }
12660
- return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
12661
- preferIphoneContinuityCamera: isCapturingId,
12691
+ return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
12692
+ key: "".concat(isCapturingId ? 'id' : 'selfie', "-camera-").concat(attempt),
12693
+ preferContinuityCamera: isCapturingId,
12662
12694
  preferFrontFacingCamera: !isCapturingId,
12663
12695
  requireMicrophoneAccess: !isCapturingId && !!readTextPrompt,
12664
12696
  maxVideoWidth: isCapturingId ? 1920 : 1280,
12665
12697
  maxFps: isCapturingId ? 60 : 30,
12666
12698
  onCameraAccessDenied: onCameraAccessDenied,
12667
- onMicrophoneAccessDenied: onMicrophoneAccessDenied
12699
+ onMicrophoneAccessDenied: onMicrophoneAccessDenied,
12700
+ debugMode: debugMode
12668
12701
  }, /*#__PURE__*/React__namespace.default.createElement(IdCaptureModelsProvider, {
12669
12702
  autoStart: false,
12670
12703
  documentDetectionModelUrl: (_g = (_f = idCaptureProps.assets) === null || _f === void 0 ? void 0 : _f.documentDetectionModelUrl) !== null && _g !== void 0 ? _g : '',
@@ -12675,7 +12708,7 @@ var VideoIdWizard = function VideoIdWizard(_a) {
12675
12708
  autoStart: false,
12676
12709
  onModelError: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.onModelError,
12677
12710
  modelLoadTimeoutMs: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.modelLoadTimeoutMs,
12678
- requireVerticalFaceCentering: false
12711
+ requireVerticalFaceCentering: captureState === 'CHECKING_LIVENESS'
12679
12712
  }, /*#__PURE__*/React__namespace.default.createElement(PageContainer, {
12680
12713
  className: "flex ".concat((_k = classNames.container) !== null && _k !== void 0 ? _k : '')
12681
12714
  }, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && /*#__PURE__*/React__namespace.default.createElement(CameraVideoTag, {
@@ -12790,15 +12823,17 @@ function CompositeWizard(_a) {
12790
12823
  _o = _a.captureSignatureVideo,
12791
12824
  captureSignatureVideo = _o === void 0 ? false : _o,
12792
12825
  onCameraAccessDenied = _a.onCameraAccessDenied,
12793
- onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied;
12794
- var _p = React.useContext(SubmissionContext),
12795
- submit = _p.submit,
12796
- submissionStatus = _p.submissionStatus,
12797
- setSignatureData = _p.setSignatureData,
12798
- setAdditionalDocuments = _p.setAdditionalDocuments;
12799
- var _q = React.useState(0),
12800
- checkIndex = _q[0],
12801
- setCheckIndex = _q[1];
12826
+ onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
12827
+ _p = _a.debugMode,
12828
+ debugMode = _p === void 0 ? false : _p;
12829
+ var _q = React.useContext(SubmissionContext),
12830
+ submit = _q.submit,
12831
+ submissionStatus = _q.submissionStatus,
12832
+ setSignatureData = _q.setSignatureData,
12833
+ setAdditionalDocuments = _q.setAdditionalDocuments;
12834
+ var _r = React.useState(0),
12835
+ checkIndex = _r[0],
12836
+ setCheckIndex = _r[1];
12802
12837
  var checks = React.useMemo(function () {
12803
12838
  var _a, _b;
12804
12839
  var checks = __spreadArray([], userChecks, true);
@@ -12876,6 +12911,16 @@ function CompositeWizard(_a) {
12876
12911
  return i + 1;
12877
12912
  });
12878
12913
  }, [onVideoSignatureCompleteProp]);
12914
+ var _s = React.useState(0),
12915
+ videoSignatureAttempts = _s[0],
12916
+ setVideoSignatureAttempts = _s[1];
12917
+ var onVideoSignatureRetryProp = videoSignatureCaptureProps.onRetryClicked;
12918
+ var onVideoSignatureRetry = React.useCallback(function () {
12919
+ onVideoSignatureRetryProp === null || onVideoSignatureRetryProp === void 0 ? void 0 : onVideoSignatureRetryProp();
12920
+ setVideoSignatureAttempts(function (n) {
12921
+ return n + 1;
12922
+ });
12923
+ }, [onVideoSignatureRetryProp]);
12879
12924
  var onAdditionalDocumentCaptureCompleteProp = additionalDocumentCaptureProps === null || additionalDocumentCaptureProps === void 0 ? void 0 : additionalDocumentCaptureProps.onComplete;
12880
12925
  var onAdditionalDocumentCaptureComplete = React.useCallback(function (uploadedDocuments) {
12881
12926
  setAdditionalDocuments(uploadedDocuments);
@@ -12904,9 +12949,11 @@ function CompositeWizard(_a) {
12904
12949
  }
12905
12950
  switch (checks[checkIndex]) {
12906
12951
  case 'IdCapture':
12907
- return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
12952
+ return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
12953
+ key: "IdCaptureCamera",
12908
12954
  onCameraAccessDenied: onCameraAccessDenied,
12909
- onMicrophoneAccessDenied: onMicrophoneAccessDenied
12955
+ onMicrophoneAccessDenied: onMicrophoneAccessDenied,
12956
+ debugMode: debugMode
12910
12957
  }, /*#__PURE__*/React__namespace.default.createElement(IdCaptureModelsProvider, {
12911
12958
  autoStart: false,
12912
12959
  documentDetectionModelUrl: (_d = (_c = idCaptureProps.assets) === null || _c === void 0 ? void 0 : _c.documentDetectionModelUrl) !== null && _d !== void 0 ? _d : '',
@@ -12923,11 +12970,13 @@ function CompositeWizard(_a) {
12923
12970
  onMicrophoneAccessDenied: onMicrophoneAccessDenied
12924
12971
  }));
12925
12972
  case 'FaceLiveness':
12926
- return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
12973
+ return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
12974
+ key: "FaceLivenessCamera",
12927
12975
  preferFrontFacingCamera: true,
12928
- preferIphoneContinuityCamera: false,
12976
+ preferContinuityCamera: false,
12929
12977
  onCameraAccessDenied: onCameraAccessDenied,
12930
- onMicrophoneAccessDenied: onMicrophoneAccessDenied
12978
+ onMicrophoneAccessDenied: onMicrophoneAccessDenied,
12979
+ debugMode: debugMode
12931
12980
  }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
12932
12981
  autoStart: false,
12933
12982
  onModelError: faceLivenessProps.onModelError,
@@ -12940,13 +12989,15 @@ function CompositeWizard(_a) {
12940
12989
  onAccept: onSignatureCaptureSuccess
12941
12990
  }));
12942
12991
  case 'VideoSignatureCapture':
12943
- return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
12944
- preferIphoneContinuityCamera: false,
12992
+ return /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
12993
+ key: "SignatureKycCamera-".concat(videoSignatureAttempts),
12994
+ preferContinuityCamera: false,
12945
12995
  preferFrontFacingCamera: true,
12946
12996
  maxVideoWidth: 1280,
12947
12997
  maxFps: 30,
12948
12998
  onCameraAccessDenied: onCameraAccessDenied,
12949
- onMicrophoneAccessDenied: onMicrophoneAccessDenied
12999
+ onMicrophoneAccessDenied: onMicrophoneAccessDenied,
13000
+ debugMode: debugMode
12950
13001
  }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
12951
13002
  autoStart: false,
12952
13003
  throttleMs: 250,
@@ -12954,7 +13005,8 @@ function CompositeWizard(_a) {
12954
13005
  modelLoadTimeoutMs: videoSignatureCaptureProps.modelLoadTimeoutMs,
12955
13006
  requireVerticalFaceCentering: false
12956
13007
  }, /*#__PURE__*/React__namespace.default.createElement(VideoSignatureWizard, _assign({}, videoSignatureCaptureProps, {
12957
- onComplete: onVideoSignatureComplete
13008
+ onComplete: onVideoSignatureComplete,
13009
+ onRetryClicked: onVideoSignatureRetry
12958
13010
  }))));
12959
13011
  case 'AdditionalDocumentCapture':
12960
13012
  return /*#__PURE__*/React__namespace.default.createElement(AdditionalDocumentCaptureWizard, _assign({}, additionalDocumentCaptureProps, {
@@ -13405,7 +13457,8 @@ var IdValidation = function IdValidation(_a) {
13405
13457
  videoSignatureCaptureProps: videoSignatureCaptureProps,
13406
13458
  captureSignature: captureSignature,
13407
13459
  captureSignatureVideo: captureSignatureVideo,
13408
- onCameraAccessDenied: onCameraAccessDenied
13460
+ onCameraAccessDenied: onCameraAccessDenied,
13461
+ debugMode: debugMode
13409
13462
  }))));
13410
13463
  };
13411
13464
 
@@ -13511,7 +13564,8 @@ var FaceValidation = function FaceValidation(_a) {
13511
13564
  return ['FaceLiveness'];
13512
13565
  }, []),
13513
13566
  faceLivenessProps: faceLivenessProps,
13514
- onCameraAccessDenied: onCameraAccessDenied
13567
+ onCameraAccessDenied: onCameraAccessDenied,
13568
+ debugMode: debugMode
13515
13569
  }))));
13516
13570
  };
13517
13571
 
@@ -13744,7 +13798,8 @@ var IdAndFaceValidation = function IdAndFaceValidation(_a) {
13744
13798
  additionalDocumentCaptureProps: additionalDocumentCaptureProps,
13745
13799
  captureSignature: captureSignature,
13746
13800
  captureSignatureVideo: captureSignatureVideo,
13747
- onCameraAccessDenied: onCameraAccessDenied
13801
+ onCameraAccessDenied: onCameraAccessDenied,
13802
+ debugMode: debugMode
13748
13803
  }))));
13749
13804
  };
13750
13805
 
@@ -13999,7 +14054,8 @@ var CustomerIdAndBiometricsEnrollment = function CustomerIdAndBiometricsEnrollme
13999
14054
  videoSignatureCaptureProps: videoSignatureCaptureProps,
14000
14055
  captureSignature: captureSignature,
14001
14056
  captureSignatureVideo: captureSignatureVideo,
14002
- onCameraAccessDenied: onCameraAccessDenied
14057
+ onCameraAccessDenied: onCameraAccessDenied,
14058
+ debugMode: debugMode
14003
14059
  }))));
14004
14060
  };
14005
14061
 
@@ -14331,7 +14387,7 @@ var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
14331
14387
  var _l = React.useState('LOADING'),
14332
14388
  captureState = _l[0],
14333
14389
  setCaptureState = _l[1];
14334
- var _m = useCameraStore(),
14390
+ var _m = React.useContext(CameraStateContext),
14335
14391
  cameraAccessDenied = _m.cameraAccessDenied,
14336
14392
  releaseCameraAccess = _m.releaseCameraAccess;
14337
14393
  var _o = React.useContext(SelfieGuidanceModelsContext),
@@ -14537,9 +14593,10 @@ var CustomerVerification = function CustomerVerification(_a) {
14537
14593
  onSubmit: onSubmit,
14538
14594
  geolocationEnabled: geolocationEnabled,
14539
14595
  geolocationRequired: geolocationRequired
14540
- }, /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
14596
+ }, /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
14541
14597
  preferFrontFacingCamera: true,
14542
- onCameraAccessDenied: onCameraAccessDenied
14598
+ onCameraAccessDenied: onCameraAccessDenied,
14599
+ debugMode: debugMode
14543
14600
  }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
14544
14601
  autoStart: false,
14545
14602
  onModelError: onModelError,
@@ -14888,7 +14945,7 @@ var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
14888
14945
  var _l = React.useState('LOADING'),
14889
14946
  captureState = _l[0],
14890
14947
  setCaptureState = _l[1];
14891
- var _m = useCameraStore(),
14948
+ var _m = React.useContext(CameraStateContext),
14892
14949
  cameraAccessDenied = _m.cameraAccessDenied,
14893
14950
  releaseCameraAccess = _m.releaseCameraAccess;
14894
14951
  var _o = React.useContext(SelfieGuidanceModelsContext),
@@ -15092,9 +15149,10 @@ var CustomerIdentification = function CustomerIdentification(_a) {
15092
15149
  onSubmit: onSubmit,
15093
15150
  geolocationEnabled: geolocationEnabled,
15094
15151
  geolocationRequired: geolocationRequired
15095
- }, /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
15152
+ }, /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
15096
15153
  preferFrontFacingCamera: true,
15097
- onCameraAccessDenied: onCameraAccessDenied
15154
+ onCameraAccessDenied: onCameraAccessDenied,
15155
+ debugMode: debugMode
15098
15156
  }, /*#__PURE__*/React__namespace.default.createElement(SelfieGuidanceModelsProvider, {
15099
15157
  autoStart: false,
15100
15158
  modelLoadTimeoutMs: modelLoadTimeoutMs,
@@ -15421,7 +15479,8 @@ var VideoIdValidation = function VideoIdValidation(_a) {
15421
15479
  captureSignature: captureSignature,
15422
15480
  captureSignatureVideo: captureSignatureVideo,
15423
15481
  onCameraAccessDenied: onCameraAccessDenied,
15424
- onMicrophoneAccessDenied: onMicrophoneAccessDenied
15482
+ onMicrophoneAccessDenied: onMicrophoneAccessDenied,
15483
+ debugMode: debugMode
15425
15484
  }))));
15426
15485
  };
15427
15486
 
@@ -15578,7 +15637,8 @@ var CustomerBiometricsEnrollment = function CustomerBiometricsEnrollment(_a) {
15578
15637
  videoSignatureCaptureProps: videoSignatureCaptureProps,
15579
15638
  captureSignature: captureSignature,
15580
15639
  captureSignatureVideo: captureSignatureVideo,
15581
- onCameraAccessDenied: onCameraAccessDenied
15640
+ onCameraAccessDenied: onCameraAccessDenied,
15641
+ debugMode: debugMode
15582
15642
  }))));
15583
15643
  };
15584
15644
 
@@ -15636,10 +15696,11 @@ var DocumentCapture = function DocumentCapture(_a) {
15636
15696
  onDocumentUploadFailed: onDocumentUploadFailed,
15637
15697
  geolocationEnabled: geolocationEnabled,
15638
15698
  geolocationRequired: geolocationRequired
15639
- }, /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
15699
+ }, /*#__PURE__*/React__namespace.default.createElement(CameraProvider, {
15640
15700
  requestAccessAutomatically: false,
15641
- preferIphoneContinuityCamera: true,
15642
- onCameraAccessDenied: onCameraAccessDenied
15701
+ preferContinuityCamera: true,
15702
+ onCameraAccessDenied: onCameraAccessDenied,
15703
+ debugMode: debugMode
15643
15704
  }, /*#__PURE__*/React__namespace.default.createElement(DocumentCaptureWizard, {
15644
15705
  onSuccess: onComplete,
15645
15706
  onExitCapture: onExitCapture,