idmission-web-sdk 2.3.80 → 2.3.82

package/dist/sdk2.umd.development.js

@@ -211,7 +211,7 @@
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
   };
 
-  var webSdkVersion = '2.3.80';
+  var webSdkVersion = '2.3.82';
 
   function getPlatform() {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -2125,6 +2125,12 @@
     setIdCaptureVideoUrl: function setIdCaptureVideoUrl() {
       return null;
     },
+    setSignatureStartTimestamp: function setSignatureStartTimestamp() {
+      return null;
+    },
+    setSignatureEndTimestamp: function setSignatureEndTimestamp() {
+      return null;
+    },
     setIdCaptureVideoIdFrontImage: function setIdCaptureVideoIdFrontImage() {
       return null;
     },
@@ -2289,44 +2295,50 @@
       signatureVideoUrl = _16[0],
       setSignatureVideoUrl = _16[1];
     var _17 = React.useState(null),
-      idCaptureVideoUrl = _17[0],
-      setIdCaptureVideoUrl = _17[1];
+      signatureStartTimestamp = _17[0],
+      setSignatureStartTimestamp = _17[1];
     var _18 = React.useState(null),
-      idCaptureVideoIdFrontImage = _18[0],
-      setIdCaptureVideoIdFrontImage = _18[1];
+      signatureEndTimestamp = _18[0],
+      setSignatureEndTimestamp = _18[1];
     var _19 = React.useState(null),
-      idCaptureVideoIdBackImage = _19[0],
-      setIdCaptureVideoIdBackImage = _19[1];
+      idCaptureVideoUrl = _19[0],
+      setIdCaptureVideoUrl = _19[1];
     var _20 = React.useState(null),
-      idCaptureVideoAudioUrl = _20[0],
-      setIdCaptureVideoAudioUrl = _20[1];
+      idCaptureVideoIdFrontImage = _20[0],
+      setIdCaptureVideoIdFrontImage = _20[1];
     var _21 = React.useState(null),
-      idCaptureVideoAudioStartsAt = _21[0],
-      setIdCaptureVideoAudioStartsAt = _21[1];
+      idCaptureVideoIdBackImage = _21[0],
+      setIdCaptureVideoIdBackImage = _21[1];
     var _22 = React.useState(null),
-      expectedAudioText = _22[0],
-      setExpectedAudioText = _22[1];
+      idCaptureVideoAudioUrl = _22[0],
+      setIdCaptureVideoAudioUrl = _22[1];
     var _23 = React.useState(null),
-      additionalDocuments = _23[0],
-      setAdditionalDocuments = _23[1];
+      idCaptureVideoAudioStartsAt = _23[0],
+      setIdCaptureVideoAudioStartsAt = _23[1];
     var _24 = React.useState(null),
-      geolocationResult = _24[0],
-      setGeolocationResult = _24[1];
-    var _25 = React.useState(0),
-      geolocationAttempts = _25[0],
-      setGeolocationAttempts = _25[1];
-    var _26 = React.useState(false),
-      geolocationBlocked = _26[0],
-      setGeolocationBlocked = _26[1];
-    var _27 = React.useState([]),
-      idFrontCaptureAttempts = _27[0],
-      setIdFrontCaptureAttempts = _27[1];
-    var _28 = React.useState([]),
-      idBackCaptureAttempts = _28[0],
-      setIdBackCaptureAttempts = _28[1];
+      expectedAudioText = _24[0],
+      setExpectedAudioText = _24[1];
+    var _25 = React.useState(null),
+      additionalDocuments = _25[0],
+      setAdditionalDocuments = _25[1];
+    var _26 = React.useState(null),
+      geolocationResult = _26[0],
+      setGeolocationResult = _26[1];
+    var _27 = React.useState(0),
+      geolocationAttempts = _27[0],
+      setGeolocationAttempts = _27[1];
+    var _28 = React.useState(false),
+      geolocationBlocked = _28[0],
+      setGeolocationBlocked = _28[1];
     var _29 = React.useState([]),
-      selfieCaptureAttempts = _29[0],
-      setSelfieCaptureAttempts = _29[1];
+      idFrontCaptureAttempts = _29[0],
+      setIdFrontCaptureAttempts = _29[1];
+    var _30 = React.useState([]),
+      idBackCaptureAttempts = _30[0],
+      setIdBackCaptureAttempts = _30[1];
+    var _31 = React.useState([]),
+      selfieCaptureAttempts = _31[0],
+      setSelfieCaptureAttempts = _31[1];
     var logIdFrontCaptureAttempt = React.useCallback(function (attempt) {
       setIdFrontCaptureAttempts(function (attempts) {
         return __spreadArray(__spreadArray([], attempts, true), [attempt], false);
@@ -2603,6 +2615,12 @@
                   submissionRequest.customerData.signatureData.signatureVideo = documents.signatureVideo;
                 }
               }
+              if (signatureStartTimestamp) {
+                submissionRequest.customerData.signatureStartTimestamp = signatureStartTimestamp;
+              }
+              if (signatureEndTimestamp) {
+                submissionRequest.customerData.signatureEndTimestamp = signatureEndTimestamp;
+              }
               if (additionalDocuments) {
                 submissionRequest.customerData.additionalDocuments = additionalDocuments.map(function (d) {
                   return _assign(_assign({}, d), {
@@ -2645,7 +2663,7 @@
           }
         });
       });
-    }, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idCardForFaceMatch, idData, idFrontCaptureAttempts, idFrontImage, idFrontIrImage, idFrontUvImage, idImageResolutionCheck, jobId, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksFireOnReviewURL, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters, webhooksURL]);
+    }, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idCardForFaceMatch, idData, idFrontCaptureAttempts, idFrontImage, idFrontIrImage, idFrontUvImage, idImageResolutionCheck, jobId, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureEndTimestamp, signatureStartTimestamp, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksFireOnReviewURL, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters, webhooksURL]);
     var defaultOnSubmit = React.useCallback(function () {
       return __awaiter(void 0, void 0, void 0, function () {
         var submissionResponse_1, payload, host, endpoint, response, statusMessage, submissionResponse_2, e_1, err;
@@ -2942,6 +2960,8 @@
         setSelfieImage: setSelfieImage,
         setSignatureData: setSignatureData,
         setSignatureVideoUrl: setSignatureVideoUrl,
+        setSignatureStartTimestamp: setSignatureStartTimestamp,
+        setSignatureEndTimestamp: setSignatureEndTimestamp,
         setIdCaptureVideoUrl: setIdCaptureVideoUrl,
         setIdCaptureVideoIdFrontImage: setIdCaptureVideoIdFrontImage,
         setIdCaptureVideoIdBackImage: setIdCaptureVideoIdBackImage,
@@ -23743,7 +23763,6 @@
     clearRecordedData: function clearRecordedData() {
       return null;
     },
-    isRecording: false,
     signaturePad: {
       current: null
     },
@@ -23766,7 +23785,7 @@
         if (!camera) throw new Error('Camera not found');
         // set our flag and clear whatever we have recorded so far.
         set({
-          isRecording: true
+          recordingStartedAt: performance.now()
         });
         signatureChunks = [];
         // start recording video and audio
@@ -23780,27 +23799,51 @@
           videoBitsPerSecond: 270000,
           audioBitsPerSecond: 32000
         });
+        var hasFirstChunk = false;
         signatureRecorder.ondataavailable = function (event) {
           signatureChunks.push(event.data);
+          if (!hasFirstChunk) {
+            hasFirstChunk = true;
+            set({
+              firstChunkReceivedAt: performance.now(),
+              lastChunkReceivedAt: performance.now()
+            });
+          } else {
+            set({
+              lastChunkReceivedAt: performance.now()
+            });
+          }
         };
         signatureRecorder.start(100);
       },
       stopRecording: function stopRecording(signatureData, imageUrl) {
         set({
-          isRecording: false
+          firstChunkReceivedAt: undefined,
+          recordingStoppedAt: performance.now()
+        });
+        waitForOneMoreChunk().then(function () {
+          if (!signatureRecorder) return;
+          signatureRecorder.stop();
+          signatureRecorder.onstop = function () {
+            var blob = new Blob(signatureChunks, {
+              type: 'video/mp4'
+            });
+            signatureChunks = [];
+            signatureRecorder = null;
+            if (!signatureData) return;
+            var _a = get(),
+              onSignatureVideoCaptured = _a.onSignatureVideoCaptured,
+              recordingStartedAt = _a.recordingStartedAt,
+              signatureStartedAt = _a.signatureStartedAt,
+              signatureEndedAt = _a.signatureEndedAt,
+              lastChunkReceivedAt = _a.lastChunkReceivedAt;
+            var endMs = Math.min(signatureEndedAt !== null && signatureEndedAt !== void 0 ? signatureEndedAt : Infinity, lastChunkReceivedAt !== null && lastChunkReceivedAt !== void 0 ? lastChunkReceivedAt : Infinity);
+            var signatureStartTimestamp = signatureStartedAt && recordingStartedAt ? formatTimestamp(Math.max(0, signatureStartedAt - recordingStartedAt - 500)) : undefined;
+            var signatureEndTimestamp = endMs !== Infinity && recordingStartedAt ? formatTimestamp(Math.min(endMs - recordingStartedAt + 500, lastChunkReceivedAt !== null && lastChunkReceivedAt !== void 0 ? lastChunkReceivedAt : Infinity)) : undefined;
+            onSignatureVideoCaptured(blob, signatureData, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, signatureStartTimestamp, signatureEndTimestamp);
+          };
+          useVideoRecorderStore.getState().stopRecording();
         });
-        if (!signatureRecorder) return;
-        signatureRecorder.stop();
-        signatureRecorder.onstop = function () {
-          var blob = new Blob(signatureChunks, {
-            type: 'video/mp4'
-          });
-          signatureChunks = [];
-          signatureRecorder = null;
-          if (!signatureData) return;
-          get().onSignatureVideoCaptured(blob, signatureData, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null);
-        };
-        useVideoRecorderStore.getState().stopRecording();
       },
       clearRecordedData: function clearRecordedData() {
         signatureChunks = [];
@@ -23809,13 +23852,42 @@
         signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.stop();
         signatureRecorder = null;
         set({
-          isRecording: false,
+          recordingStartedAt: undefined,
+          recordingStoppedAt: undefined,
+          firstChunkReceivedAt: undefined,
+          lastChunkReceivedAt: undefined,
           signaturePadEmpty: true,
-          signatureValid: false
+          signatureValid: false,
+          signatureStartedAt: undefined,
+          signatureEndedAt: undefined
         });
       }
     });
   }));
+  function waitForOneMoreChunk(timeoutMs) {
+    if (timeoutMs === void 0) {
+      timeoutMs = 3000;
+    }
+    var start = performance.now();
+    return new Promise(function (resolve) {
+      var initialLastChunkReceivedAt = useVideoSignatureStore.getState().lastChunkReceivedAt;
+      if (!initialLastChunkReceivedAt) return resolve();
+      function gotAChunk() {
+        var lastChunkReceivedAt = useVideoSignatureStore.getState().lastChunkReceivedAt;
+        return performance.now() - start > timeoutMs || !lastChunkReceivedAt || !initialLastChunkReceivedAt || lastChunkReceivedAt > initialLastChunkReceivedAt;
+      }
+      setTimeout(function () {
+        if (gotAChunk()) return resolve(); // check immediately
+        // otherwise, check every 100ms
+        var interval = setInterval(function () {
+          if (gotAChunk()) {
+            clearInterval(interval);
+            resolve();
+          }
+        }, 100);
+      }, 0);
+    });
+  }
   function VideoSignatureContextProvider(_a) {
     var _this = this;
     var _b, _c;
@@ -23834,7 +23906,14 @@
       // clear recorded data when the component is mounted
       useVideoSignatureStore.getState().clearRecordedData();
     }, []);
-    var isRecording = useVideoSignatureStore().isRecording;
+    var _e = useVideoSignatureStore(useShallow(function (state) {
+        return {
+          recordingStartedAt: state.recordingStartedAt,
+          recordingStoppedAt: state.recordingStoppedAt
+        };
+      })),
+      recordingStartedAt = _e.recordingStartedAt,
+      recordingStoppedAt = _e.recordingStoppedAt;
     useFrameLoop(React.useCallback(function () {
       return __awaiter(_this, void 0, void 0, function () {
         var signaturePad, ctx, _a, w, h, isPortrait, rect;
@@ -23861,7 +23940,7 @@
         });
       });
     }, [videoRef]), {
-      autoStart: isRecording,
+      autoStart: !!recordingStartedAt && !recordingStoppedAt,
       throttleMs: 1000 / 24
     });
     return /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement(InvisibleCanvas, {
@@ -23870,6 +23949,17 @@
       height: (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.videoHeight
     }));
   }
+  function formatTimestamp(durationMs) {
+    // should be in the format of 00:00:00:00 (hh:mm:ss:cs)
+    var hours = Math.floor(durationMs / 3600000);
+    var minutes = Math.floor(durationMs % 3600000 / 60000);
+    var seconds = Math.floor(durationMs % 60000 / 1000);
+    var milliseconds = durationMs % 1000;
+    // Convert milliseconds to centiseconds (1/100th of a second)
+    var centiseconds = Math.floor(milliseconds / 10);
+    var csString = centiseconds.toString().padStart(2, '0');
+    return "".concat(hours.toString().padStart(2, '0'), ":") + "".concat(minutes.toString().padStart(2, '0'), ":") + "".concat(seconds.toString().padStart(2, '0'), ":") + "".concat(csString);
+  }
 
   function VideoSignaturePad(_a) {
     var onAcceptBtnClicked = _a.onAcceptBtnClicked,
@@ -23931,8 +24021,11 @@
       ref: signaturePad,
       canvasProps: canvasProps,
       onBegin: function onBegin() {
-        return useVideoSignatureStore.setState({
-          signaturePadEmpty: false
+        return useVideoSignatureStore.setState(function (s) {
+          return {
+            signaturePadEmpty: false,
+            signatureStartedAt: s.signatureStartedAt || performance.now()
+          };
         });
       },
       onEnd: function onEnd() {
@@ -23942,7 +24035,8 @@
           return point;
         });
         useVideoSignatureStore.setState({
-          signatureValid: points.length >= minSignaturePadPoints
+          signatureValid: points.length >= minSignaturePadPoints,
+          signatureEndedAt: performance.now()
         });
       }
     }), !headTrackingSatisfied && !!verbiage.headTrackingUnsatisfiedText ? ( /*#__PURE__*/React.createElement(SignaturePadContentContainer, {
@@ -24007,13 +24101,14 @@
       mode = _g[0],
       setMode = _g[1];
     React.useEffect(function () {
-      var delayedTransition = setTimeout(function () {
-        if (guideToDisplay) setMode(guideToDisplay);
-      }, 2000);
-      return function () {
-        return clearTimeout(delayedTransition);
-      };
+      if (guideToDisplay) setMode(guideToDisplay);
     }, [guideToDisplay]);
+    var firstChunkReceivedAt = useVideoSignatureStore(useShallow(function (state) {
+      return {
+        firstChunkReceivedAt: state.firstChunkReceivedAt
+      };
+    })).firstChunkReceivedAt;
+    var signaturePadDisabled = requestedAction !== 'CAPTURE_SIGNATURE' || !firstChunkReceivedAt;
     return /*#__PURE__*/React.createElement(Container$3, {
       className: classNames.container
     }, /*#__PURE__*/React.createElement(Inner$1, {
@@ -24037,7 +24132,7 @@
     }, /*#__PURE__*/React.createElement(VideoSignaturePad, {
       onAcceptBtnClicked: onAcceptBtnClicked,
       onClearBtnClicked: onClearBtnClicked,
-      disabled: requestedAction !== 'CAPTURE_SIGNATURE',
+      disabled: signaturePadDisabled,
       headTrackingSatisfied: headTrackingSatisfied,
       minSignaturePadPoints: minSignaturePadPoints,
       classNames: classNames,
@@ -24049,9 +24144,9 @@
     return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
   });
   var Inner$1 = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  max-height: 1280px;\n  display: flex;\n  margin: auto;\n  align-items: center;\n  flex-direction: column;\n"], ["\n  width: 100%;\n  height: 100%;\n  max-height: 1280px;\n  display: flex;\n  margin: auto;\n  align-items: center;\n  flex-direction: column;\n"])));
-  var FaceGuideContainer$1 = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n  position: relative;\n  height: 50%;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 2s;\n"], ["\n  position: relative;\n  height: 50%;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 2s;\n"])));
+  var FaceGuideContainer$1 = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n  position: relative;\n  height: 50%;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 500ms;\n"], ["\n  position: relative;\n  height: 50%;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 500ms;\n"])));
   var StyledSelfieCaptureAnimatedMask = styled(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n  max-width: 100%;\n  height: 100%;\n"], ["\n  max-width: 100%;\n  height: 100%;\n"])));
-  var SignaturePadContainer = styled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n  position: relative;\n  max-width: 100%;\n  height: 50%;\n  aspect-ratio: 2;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 2s;\n"], ["\n  position: relative;\n  max-width: 100%;\n  height: 50%;\n  aspect-ratio: 2;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 2s;\n"])));
+  var SignaturePadContainer = styled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n  position: relative;\n  max-width: 100%;\n  height: 50%;\n  aspect-ratio: 2;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 500ms;\n"], ["\n  position: relative;\n  max-width: 100%;\n  height: 50%;\n  aspect-ratio: 2;\n  transition: opacity 500ms ease-in-out;\n  transition-delay: 500ms;\n"])));
   var templateObject_1$a, templateObject_2$9, templateObject_3$8, templateObject_4$4, templateObject_5$3;
 
   var DEFAULT_MIN_SIGNATURE_PAD_POINTS = 10;
@@ -24094,9 +24189,14 @@
       onHeadTrackingPredictionMade = _o.onPredictionMade,
       startHeadTracking = _o.start,
       stopHeadTracking = _o.stop;
-    var _p = useVideoSignatureStore(),
+    var _p = useVideoSignatureStore(useShallow(function (state) {
+        return {
+          clearRecordedData: state.clearRecordedData,
+          firstChunkReceivedAt: state.firstChunkReceivedAt
+        };
+      })),
       clearRecordedData = _p.clearRecordedData,
-      isRecording = _p.isRecording;
+      firstChunkReceivedAt = _p.firstChunkReceivedAt;
     React.useEffect(function () {
       useVideoSignatureStore.setState({
         onSignatureVideoCaptured: onSignatureVideoCaptured
@@ -24180,7 +24280,7 @@
       face: lastFace,
       scaling: debugScalingDetails,
       color: headTrackingSatisfied ? 'green' : 'red'
-    }))), /*#__PURE__*/React.createElement(DebugStatsPane, null, "Video: ", videoWidth, "x", videoHeight, /*#__PURE__*/React.createElement("br", null), "Recording: ", isRecording ? 'true' : 'false'))), /*#__PURE__*/React.createElement(ExitCaptureButton, {
+    }))), /*#__PURE__*/React.createElement(DebugStatsPane, null, "Video: ", videoWidth, "x", videoHeight, /*#__PURE__*/React.createElement("br", null), "Recording: ", firstChunkReceivedAt ? 'true' : 'false'))), /*#__PURE__*/React.createElement(ExitCaptureButton, {
       onClick: onExit,
       className: classNames.exitCaptureBtn
     }));
@@ -24511,6 +24611,8 @@
       setSelfieImage = _u.setSelfieImage,
       setSignatureData = _u.setSignatureData,
       setSignatureVideoUrl = _u.setSignatureVideoUrl,
+      setSignatureStartTimestamp = _u.setSignatureStartTimestamp,
+      setSignatureEndTimestamp = _u.setSignatureEndTimestamp,
       logSelfieCaptureAttempt = _u.logSelfieCaptureAttempt,
       uploadDocument = _u.uploadDocument;
     var cameraAccessDenied = useCameraStore(useShallow(function (state) {
@@ -24570,12 +24672,14 @@
         filetype: 'image/jpeg'
       }).then(onSelfieCaptured);
     }, [logCaptureMetadata, onSelfieCaptured, setSelfieImage, uploadDocument]);
-    var onSignatureCaptureCompleted = React.useCallback(function (videoData, signatureData, signatureImageData) {
+    var onSignatureCaptureCompleted = React.useCallback(function (videoData, signatureData, signatureImageData, signatureStartTimestamp, signatureEndTimestamp) {
       setSignatureData(signatureData);
       setSignatureVideoUrl(URL.createObjectURL(videoData));
+      if (signatureStartTimestamp) setSignatureStartTimestamp(signatureStartTimestamp);
+      if (signatureEndTimestamp) setSignatureEndTimestamp(signatureEndTimestamp);
       setCaptureState('SUCCESS');
-      onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(videoData, signatureData, signatureImageData);
-    }, [onVideoCaptured, setSignatureData, setSignatureVideoUrl]);
+      onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(videoData, signatureData, signatureImageData, signatureStartTimestamp, signatureEndTimestamp);
+    }, [onVideoCaptured, setSignatureData, setSignatureEndTimestamp, setSignatureStartTimestamp, setSignatureVideoUrl]);
     var _x = React.useState(true),
       showLoadingOverlay = _x[0],
       setShowLoadingOverlay = _x[1];