idmission-web-sdk 2.3.121 → 2.3.123

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.121';
+  var webSdkVersion = '2.3.123';
 
   function getPlatform() {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -24273,9 +24273,6 @@
 
   var signatureRecorder = null;
   var signatureChunks = [];
-  var ondataavailableInvocations = [];
-  var ondataavailableStartTime;
-  var lastCalculatedVideoChunkRate;
   var videoSignatureInitialState = {
     startRecording: function startRecording() {
       return null;
@@ -24300,9 +24297,6 @@
     signatureValid: false,
     supportsRequestVideoFrameCallback: undefined,
     supportsRoundRect: undefined,
-    nullChunksReceived: 0,
-    timesSignatureCleared: 0,
-    finalChunkReceived: false,
     onSignatureVideoCaptured: function onSignatureVideoCaptured() {
       return null;
     }
@@ -24315,11 +24309,8 @@
           captureAudio = false;
         }
         if (!camera) throw new Error('Camera not found');
-        // clear whatever we have recorded so far.
+        // set our flag and clear whatever we have recorded so far.
         signatureChunks = [];
-        ondataavailableInvocations = [];
-        ondataavailableStartTime = undefined;
-        lastCalculatedVideoChunkRate = undefined;
         // start recording from the output canvas to capture the signature
         var outputStream = (_a = get().outputCanvas.current) === null || _a === void 0 ? void 0 : _a.captureStream(24);
         if (!outputStream) throw new Error('outputStream not found');
@@ -24337,26 +24328,18 @@
             recordingStartedAt: e.timeStamp
           });
         };
+        var hasFirstChunk = false;
         signatureRecorder.ondataavailable = function (event) {
-          var now = performance.now();
           signatureChunks.push(event.data);
-          trackVideoChunkRate(now);
-          if (event.data.size > 0) {
-            set(function (state) {
-              var _a;
-              return {
-                firstChunkReceivedAt: (_a = state.firstChunkReceivedAt) !== null && _a !== void 0 ? _a : now,
-                lastChunkReceivedAt: now
-              };
+          if (!hasFirstChunk) {
+            hasFirstChunk = true;
+            set({
+              firstChunkReceivedAt: performance.now(),
+              lastChunkReceivedAt: performance.now()
             });
           } else {
-            set(function (state) {
-              var _a;
-              return {
-                nullChunksReceived: state.nullChunksReceived + 1,
-                firstNullChunkReceivedAt: (_a = state.firstNullChunkReceivedAt) !== null && _a !== void 0 ? _a : now,
-                lastNullChunkReceivedAt: now
-              };
+            set({
+              lastChunkReceivedAt: performance.now()
             });
           }
         };
@@ -24367,88 +24350,55 @@
       },
       stopRecording: function stopRecording(signatureData, imageUrl) {
         return __awaiter(this, void 0, void 0, function () {
-          function processVideo() {
-            return __awaiter(this, void 0, void 0, function () {
-              var recordingStoppedAt, mimeType, blob, _a, onSignatureVideoCaptured, recordingStartRequestedAt, recordingStartedAt, firstChunkReceivedAt, signatureStartedAt, signatureEndedAt, acceptClickedAt, clearClickedAt, recordingStopRequestedAt, lastChunkReceivedAt, supportsRequestVideoFrameCallback, supportsRoundRect, nullChunksReceived, firstNullChunkReceivedAt, lastNullChunkReceivedAt, timesSignatureCleared, metadata;
-              return __generator(this, function (_b) {
-                if (get().recordingStoppedAt) return [2 /*return*/];
-                recordingStoppedAt = performance.now();
-                set({
-                  recordingStoppedAt: recordingStoppedAt
-                });
-                mimeType = inferBlobType(signatureChunks[0]) || (signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.mimeType) || 'video/mp4';
-                blob = new Blob(signatureChunks, {
-                  type: mimeType
-                });
-                signatureChunks = [];
-                signatureRecorder = null;
-                _a = get(), onSignatureVideoCaptured = _a.onSignatureVideoCaptured, recordingStartRequestedAt = _a.recordingStartRequestedAt, recordingStartedAt = _a.recordingStartedAt, firstChunkReceivedAt = _a.firstChunkReceivedAt, signatureStartedAt = _a.signatureStartedAt, signatureEndedAt = _a.signatureEndedAt, acceptClickedAt = _a.acceptClickedAt, clearClickedAt = _a.clearClickedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt, lastChunkReceivedAt = _a.lastChunkReceivedAt, supportsRequestVideoFrameCallback = _a.supportsRequestVideoFrameCallback, supportsRoundRect = _a.supportsRoundRect, nullChunksReceived = _a.nullChunksReceived, firstNullChunkReceivedAt = _a.firstNullChunkReceivedAt, lastNullChunkReceivedAt = _a.lastNullChunkReceivedAt, timesSignatureCleared = _a.timesSignatureCleared;
-                metadata = {
-                  mimeType: mimeType,
-                  browserFeatures: {
-                    supportsRoundRect: supportsRoundRect,
-                    supportsRequestVideoFrameCallback: supportsRequestVideoFrameCallback
-                  },
-                  diagnostics: {
-                    nullChunksReceived: nullChunksReceived,
-                    firstNullChunkReceivedAt: firstNullChunkReceivedAt,
-                    lastNullChunkReceivedAt: lastNullChunkReceivedAt,
-                    finalChunkReceived: finalChunkReceived,
-                    finalChunkTimedOut: timedOut,
-                    finalChunkWaitedMs: Math.ceil(waitedMs),
-                    videoChunkRate: lastCalculatedVideoChunkRate,
-                    timesSignatureCleared: timesSignatureCleared
-                  },
-                  timingData: {
-                    recordingStartRequestedAt: recordingStartRequestedAt ? Math.ceil(recordingStartRequestedAt) : 0,
-                    recordingStartedAt: recordingStartedAt ? Math.ceil(recordingStartedAt) : 0,
-                    firstChunkReceivedAt: firstChunkReceivedAt ? Math.ceil(firstChunkReceivedAt) : 0,
-                    signatureStartedAt: signatureStartedAt ? Math.ceil(signatureStartedAt) : 0,
-                    signatureEndedAt: signatureEndedAt ? Math.ceil(signatureEndedAt) : 0,
-                    acceptClickedAt: acceptClickedAt ? Math.ceil(acceptClickedAt) : 0,
-                    clearClickedAt: clearClickedAt ? Math.ceil(clearClickedAt) : 0,
-                    recordingStopRequestedAt: recordingStopRequestedAt ? Math.ceil(recordingStopRequestedAt) : 0,
-                    recordingStoppedAt: Math.ceil(recordingStoppedAt),
-                    lastChunkReceivedAt: lastChunkReceivedAt ? Math.ceil(lastChunkReceivedAt) : 0
-                  }
-                };
-                debug('signature video metadata', metadata);
-                onSignatureVideoCaptured(blob, signatureData !== null && signatureData !== void 0 ? signatureData : null, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, metadata);
-                return [2 /*return*/];
-              });
-            });
-          }
-          var _a, recordingStartedAt, recordingStopRequestedAt, isRecording, _b, finalChunkReceived, timedOut, waitedMs;
-          return __generator(this, function (_c) {
-            switch (_c.label) {
+          var _this = this;
+          return __generator(this, function (_a) {
+            switch (_a.label) {
               case 0:
-                _a = get(), recordingStartedAt = _a.recordingStartedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt;
-                isRecording = !!recordingStartedAt && !recordingStopRequestedAt;
-                if (!isRecording) return [2 /*return*/];
                 set({
-                  recordingStopRequestedAt: performance.now(),
-                  recordingStoppedAt: undefined
+                  recordingStopRequestedAt: performance.now()
                 });
-                return [4 /*yield*/, waitForOneMoreChunk()
-                // this represents the time that it is safe to release the camera access
-                ];
+                if (!signatureRecorder) return [2 /*return*/];
+                return [4 /*yield*/, waitForOneMoreChunk()];
               case 1:
-                _b = _c.sent(), finalChunkReceived = _b.finalChunkReceived, timedOut = _b.timedOut, waitedMs = _b.waitedMs;
-                // this represents the time that it is safe to release the camera access
-                set({
-                  finalChunkReceived: true
-                });
-                if (!signatureRecorder) return [3 /*break*/, 2];
-                signatureRecorder.onstop = processVideo;
+                _a.sent();
+                signatureRecorder.onstop = function () {
+                  return __awaiter(_this, void 0, void 0, function () {
+                    var recordingStoppedAt, mimeType, blob, _a, onSignatureVideoCaptured, recordingStartRequestedAt, recordingStartedAt, firstChunkReceivedAt, signatureStartedAt, signatureEndedAt, acceptClickedAt, recordingStopRequestedAt, lastChunkReceivedAt, supportsRequestVideoFrameCallback, supportsRoundRect;
+                    return __generator(this, function (_b) {
+                      recordingStoppedAt = performance.now();
+                      set({
+                        recordingStoppedAt: recordingStoppedAt
+                      });
+                      mimeType = inferBlobType(signatureChunks[0]) || (signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.mimeType) || 'video/mp4';
+                      blob = new Blob(signatureChunks, {
+                        type: mimeType
+                      });
+                      signatureChunks = [];
+                      signatureRecorder = null;
+                      _a = get(), onSignatureVideoCaptured = _a.onSignatureVideoCaptured, recordingStartRequestedAt = _a.recordingStartRequestedAt, recordingStartedAt = _a.recordingStartedAt, firstChunkReceivedAt = _a.firstChunkReceivedAt, signatureStartedAt = _a.signatureStartedAt, signatureEndedAt = _a.signatureEndedAt, acceptClickedAt = _a.acceptClickedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt, lastChunkReceivedAt = _a.lastChunkReceivedAt, supportsRequestVideoFrameCallback = _a.supportsRequestVideoFrameCallback, supportsRoundRect = _a.supportsRoundRect;
+                      onSignatureVideoCaptured(blob, signatureData !== null && signatureData !== void 0 ? signatureData : null, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, {
+                        mimeType: mimeType,
+                        browserFeatures: {
+                          supportsRoundRect: supportsRoundRect,
+                          supportsRequestVideoFrameCallback: supportsRequestVideoFrameCallback
+                        },
+                        timingData: {
+                          recordingStartRequestedAt: recordingStartRequestedAt ? Math.ceil(recordingStartRequestedAt) : 0,
+                          recordingStartedAt: recordingStartedAt ? Math.ceil(recordingStartedAt) : 0,
+                          firstChunkReceivedAt: firstChunkReceivedAt ? Math.ceil(firstChunkReceivedAt) : 0,
+                          signatureStartedAt: signatureStartedAt ? Math.ceil(signatureStartedAt) : 0,
+                          signatureEndedAt: signatureEndedAt ? Math.ceil(signatureEndedAt) : 0,
+                          acceptClickedAt: acceptClickedAt ? Math.ceil(acceptClickedAt) : 0,
+                          recordingStopRequestedAt: recordingStopRequestedAt ? Math.ceil(recordingStopRequestedAt) : 0,
+                          recordingStoppedAt: Math.ceil(recordingStoppedAt),
+                          lastChunkReceivedAt: lastChunkReceivedAt ? Math.ceil(lastChunkReceivedAt) : 0
+                        }
+                      });
+                      return [2 /*return*/];
+                    });
+                  });
+                };
                 signatureRecorder.stop();
-                return [3 /*break*/, 4];
-              case 2:
-                warn('signature recorder not found, processing video immediately');
-                return [4 /*yield*/, processVideo()];
-              case 3:
-                _c.sent();
-                _c.label = 4;
-              case 4:
                 return [2 /*return*/];
             }
           });
@@ -24456,9 +24406,6 @@
       },
       clearRecordedData: function clearRecordedData() {
         signatureChunks = [];
-        ondataavailableInvocations = [];
-        ondataavailableStartTime = undefined;
-        lastCalculatedVideoChunkRate = undefined;
         signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.stop();
         signatureRecorder = null;
         set({
@@ -24473,13 +24420,8 @@
           signatureStartedAt: undefined,
           signatureEndedAt: undefined,
           acceptClickedAt: undefined,
-          clearClickedAt: undefined,
           supportsRequestVideoFrameCallback: undefined,
-          supportsRoundRect: undefined,
-          nullChunksReceived: 0,
-          firstNullChunkReceivedAt: undefined,
-          lastNullChunkReceivedAt: undefined,
-          finalChunkReceived: false
+          supportsRoundRect: undefined
         });
       }
     });
@@ -24489,11 +24431,11 @@
    * @param delayMs - The delay in milliseconds before the first check -- this is used to make sure we get at least one extra second of video.
    * @param checkEveryMs - The interval in milliseconds between checks after the initial delay has passed.
    * @param timeoutMs - The maximum time in milliseconds to wait for the chunk -- this is used to prevent infinite loops.
-   * @returns A promise that resolves when the delay has passed and at least one chunk has been received received. The return value is the number of milliseconds that we waited, whether we received a chunk, and whether we timed out.
+   * @returns A promise that resolves when the delay has passed and at least one chunk has been received received.
    */
   function waitForOneMoreChunk(delayMs, checkEveryMs, timeoutMs) {
     if (delayMs === void 0) {
-      delayMs = 250;
+      delayMs = 1000;
     }
     if (checkEveryMs === void 0) {
       checkEveryMs = 100;
@@ -24501,42 +24443,29 @@
     if (timeoutMs === void 0) {
       timeoutMs = 3000;
     }
+    var start = performance.now();
     return new Promise(function (resolve) {
-      var start = performance.now();
       var initialLastChunkReceivedAt = useVideoSignatureStore.getState().lastChunkReceivedAt;
-      function checkForChunk() {
+      function gotAChunk() {
         var lastChunkReceivedAt = useVideoSignatureStore.getState().lastChunkReceivedAt;
-        var waitedMs = performance.now() - start;
-        var timedOut = waitedMs > timeoutMs;
-        var finalChunkReceived = !!lastChunkReceivedAt && !!initialLastChunkReceivedAt && lastChunkReceivedAt > initialLastChunkReceivedAt;
-        return {
-          waitedMs: waitedMs,
-          finalChunkReceived: finalChunkReceived,
-          timedOut: timedOut
-        };
+        return performance.now() - start > timeoutMs || !lastChunkReceivedAt || !initialLastChunkReceivedAt || lastChunkReceivedAt > initialLastChunkReceivedAt;
       }
       setTimeout(function () {
-        // check immediately
-        var result = checkForChunk();
-        if (result.finalChunkReceived || result.timedOut) return resolve(result);
+        if (gotAChunk()) return resolve(); // check immediately
         // otherwise, check on a configured interval
         var interval = setInterval(function () {
-          var result = checkForChunk();
-          if (result.finalChunkReceived || result.timedOut) {
+          if (gotAChunk()) {
             clearInterval(interval);
-            resolve(result);
+            resolve();
           }
         }, checkEveryMs);
       }, delayMs);
     });
   }
   function VideoSignatureContextProvider(_a) {
+    var _b, _c;
     var children = _a.children;
-    var _b = useCameraStore(),
-      videoRef = _b.videoRef,
-      videoWidth = _b.videoWidth,
-      videoHeight = _b.videoHeight,
-      releaseCameraAccess = _b.releaseCameraAccess;
+    var videoRef = useCameraStore().videoRef;
     var outputCanvas = React.useRef(null);
     React.useEffect(function () {
       return useVideoSignatureStore.setState({
@@ -24544,13 +24473,18 @@
       });
     }, []);
     var drawOutputFrame = React.useCallback(function () {
-      if (!outputCanvas.current) return;
+      if (!outputCanvas.current || !videoRef.current) return;
       var ctx = outputCanvas.current.getContext('2d');
       if (!ctx) return;
-      var _a = [outputCanvas.current.width, outputCanvas.current.height],
+      var _a = [videoRef.current.videoWidth, videoRef.current.videoHeight],
         w = _a[0],
         h = _a[1];
       var isPortrait = w < h;
+      // Only update canvas dimensions if they changed (setting dimensions clears the canvas!)
+      if (outputCanvas.current.width !== w || outputCanvas.current.height !== h) {
+        outputCanvas.current.width = w;
+        outputCanvas.current.height = h;
+      }
       var rect = [w * (isPortrait ? 0.02 : 0.15),
       // x
       h * (isPortrait ? 0.15 : 0.25),
@@ -24559,9 +24493,7 @@
       //  width
       h * (isPortrait ? 0.7 : 0.5) //   height
       ];
-      if (videoRef.current) {
-        ctx.drawImage(videoRef.current, 0, 0, w, h);
-      }
+      ctx.drawImage(videoRef.current, 0, 0, w, h);
       ctx.beginPath();
       ctx.fillStyle = 'rgba(255,255,255,0.5)';
       var supportsRoundRect = typeof ctx.roundRect === 'function';
@@ -24583,15 +24515,11 @@
         ctx.drawImage.apply(ctx, __spreadArray([signatureCanvas], rect, false));
       }
     }, [videoRef]);
-    var finalChunkReceived = useVideoSignatureStore().finalChunkReceived;
-    React.useEffect(function () {
-      if (finalChunkReceived) releaseCameraAccess();
-    }, [finalChunkReceived, releaseCameraAccess]);
-    useVideoFrameLoop(videoRef, drawOutputFrame, !finalChunkReceived);
+    useVideoFrameLoop(videoRef, drawOutputFrame);
     return /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement(InvisibleCanvas, {
       ref: outputCanvas,
-      width: videoWidth,
-      height: videoHeight
+      width: (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.videoWidth,
+      height: (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.videoHeight
     }));
   }
   function requestVideoFrameCallback(video, onFrame) {
@@ -24611,11 +24539,8 @@
       };
     }
   }
-  function videoFrameLoop(video, onFrame, running) {
-    if (running === void 0) {
-      running = true;
-    }
-    if (!video || !running) return;
+  function videoFrameLoop(video, onFrame) {
+    if (!video) return;
     var cancelFn;
     var canceled = false;
     function onFrameRecursive() {
@@ -24636,51 +24561,10 @@
       if (cancelFn !== undefined) cancelFn();
     };
   }
-  function useVideoFrameLoop(ref, onFrame, running) {
-    if (running === void 0) {
-      running = true;
-    }
+  function useVideoFrameLoop(ref, onFrame) {
     React.useEffect(function () {
-      return videoFrameLoop(ref.current, onFrame, running);
-    }, [onFrame, ref, running]);
-  }
-  function calculateAndStoreOndataavailableRate() {
-    if (ondataavailableInvocations.length < 2 || !ondataavailableStartTime) {
-      lastCalculatedVideoChunkRate = {
-        averageRate: 0,
-        minRate: 0,
-        maxRate: 0,
-        totalChunksReceived: ondataavailableInvocations.length,
-        recordingDurationMs: 0
-      };
-      return;
-    }
-    var totalDuration = ondataavailableInvocations[ondataavailableInvocations.length - 1] - ondataavailableStartTime;
-    var averageRate = (ondataavailableInvocations.length - 1) / (totalDuration / 1000); // invocations per second
-    // Calculate rates for each interval between invocations
-    var rates = [];
-    for (var i = 1; i < ondataavailableInvocations.length; i++) {
-      var intervalMs = ondataavailableInvocations[i] - ondataavailableInvocations[i - 1];
-      var rate = 1000 / intervalMs; // invocations per second for this interval
-      rates.push(rate);
-    }
-    var minRate = Math.min.apply(Math, rates);
-    var maxRate = Math.max.apply(Math, rates);
-    lastCalculatedVideoChunkRate = {
-      averageRate: Math.round(averageRate * 100) / 100,
-      // Round to 2 decimal places
-      minRate: Math.round(minRate * 100) / 100,
-      maxRate: Math.round(maxRate * 100) / 100,
-      totalChunksReceived: ondataavailableInvocations.length,
-      recordingDurationMs: Math.round(totalDuration)
-    };
-  }
-  function trackVideoChunkRate(now) {
-    // Track ondataavailable invocations for rate calculation
-    ondataavailableStartTime !== null && ondataavailableStartTime !== void 0 ? ondataavailableStartTime : ondataavailableStartTime = now;
-    ondataavailableInvocations.push(now);
-    // Calculate and store the current rate
-    calculateAndStoreOndataavailableRate();
+      return videoFrameLoop(ref.current, onFrame);
+    }, [onFrame, ref]);
   }
 
   function VideoSignaturePad(_a) {
@@ -24932,11 +24816,14 @@
       onHeadTrackingPredictionMade = _o.onPredictionMade,
       startHeadTracking = _o.start,
       stopHeadTracking = _o.stop;
-    var firstChunkReceivedAt = useVideoSignatureStore(useShallow(function (state) {
-      return {
-        firstChunkReceivedAt: state.firstChunkReceivedAt
-      };
-    })).firstChunkReceivedAt;
+    var _p = useVideoSignatureStore(useShallow(function (state) {
+        return {
+          firstChunkReceivedAt: state.firstChunkReceivedAt,
+          acceptClickedAt: state.acceptClickedAt
+        };
+      })),
+      firstChunkReceivedAt = _p.firstChunkReceivedAt,
+      acceptClickedAt = _p.acceptClickedAt;
     React.useImperativeHandle(ref, function () {
       return {
         clearRecordedData: function clearRecordedData() {
@@ -24962,15 +24849,15 @@
     var verbiage = useTranslations(rawVerbiage, {
       guidanceMessageText: 'Please sign the box below'
     });
-    var _p = React.useState(true),
-      headTrackingSatisfied = _p[0],
-      setHeadTrackingSatisfied = _p[1];
-    var _q = React.useState(null),
-      lastFace = _q[0],
-      setLastFace = _q[1];
-    var _r = React.useState(0),
-      numFramesWithoutFaces = _r[0],
-      setNumFramesWithoutFaces = _r[1];
+    var _q = React.useState(true),
+      headTrackingSatisfied = _q[0],
+      setHeadTrackingSatisfied = _q[1];
+    var _r = React.useState(null),
+      lastFace = _r[0],
+      setLastFace = _r[1];
+    var _s = React.useState(0),
+      numFramesWithoutFaces = _s[0],
+      setNumFramesWithoutFaces = _s[1];
     onHeadTrackingPredictionMade(f(React.useCallback(function (_a) {
       var face = _a.face;
       if (headTrackingDisabled) return;
@@ -24985,12 +24872,12 @@
         return n + 1;
       });
     }, [headTrackingBoundaryPercentage, headTrackingBoundaryType, headTrackingDisabled, videoHeight, videoWidth]), 16));
-    var _s = useResizeObserver(),
-      containerRef = _s.ref,
-      _t = _s.width,
-      width = _t === void 0 ? 1 : _t,
-      _u = _s.height,
-      height = _u === void 0 ? 1 : _u;
+    var _t = useResizeObserver(),
+      containerRef = _t.ref,
+      _u = _t.width,
+      width = _u === void 0 ? 1 : _u,
+      _v = _t.height,
+      height = _v === void 0 ? 1 : _v;
     var debugScalingDetails = useDebugScalingDetails({
       enabled: debugMode,
       pageWidth: width,
@@ -25033,10 +24920,10 @@
       face: lastFace,
       scaling: debugScalingDetails,
       color: headTrackingSatisfied ? 'green' : 'red'
-    }))), /*#__PURE__*/React.createElement(DebugStatsPane, null, "Video: ", videoWidth, "x", videoHeight, /*#__PURE__*/React.createElement("br", null), "Recording: ", firstChunkReceivedAt ? 'true' : 'false'))), /*#__PURE__*/React.createElement(ExitCaptureButton, {
+    }))), /*#__PURE__*/React.createElement(DebugStatsPane, null, "Video: ", videoWidth, "x", videoHeight, /*#__PURE__*/React.createElement("br", null), "Recording: ", firstChunkReceivedAt ? 'true' : 'false'))), !acceptClickedAt && ( /*#__PURE__*/React.createElement(ExitCaptureButton, {
       onClick: onExit,
       className: classNames.exitCaptureBtn
-    }));
+    })));
   }
   var VideoSignatureCapture = /*#__PURE__*/React.forwardRef(VideoSignatureCaptureComponent);
   var Container$2 = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n"], ["\n  width: 100%;\n  height: 100%;\n"
@@ -25615,18 +25502,13 @@
       });
     }, []);
     var onClearBtnClicked = React.useCallback(function () {
-      var _a;
-      var _b = useVideoSignatureStore.getState(),
-        timesSignatureCleared = _b.timesSignatureCleared,
-        signaturePad = _b.signaturePad;
+      var _a, _b;
       useVideoSignatureStore.setState({
-        clearClickedAt: performance.now(),
-        timesSignatureCleared: timesSignatureCleared + 1,
         signatureStartedAt: undefined,
         signaturePadEmpty: true,
         signatureValid: false
       });
-      (_a = signaturePad.current) === null || _a === void 0 ? void 0 : _a.clear();
+      (_b = (_a = useVideoSignatureStore.getState().signaturePad) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.clear();
       if (restartVideoOnSignaturePadCleared) {
         setTimeout(function () {
           useVideoSignatureStore.getState().clearRecordedData();