idmission-web-sdk 2.3.97 → 2.3.99

package/dist/sdk2.esm.js

@@ -206,7 +206,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.3.97';
+var webSdkVersion = '2.3.99';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -14347,9 +14347,8 @@ var useVideoSignatureStore = create()(devtools(function (set, get) {
       if (!camera) throw new Error('Camera not found');
       // set our flag and clear whatever we have recorded so far.
       signatureChunks = [];
-      var outputCanvas = get().outputCanvas;
       // start recording from the output canvas to capture the signature
-      var outputStream = (_a = outputCanvas.current) === null || _a === void 0 ? void 0 : _a.captureStream(24);
+      var outputStream = (_a = get().outputCanvas.current) === null || _a === void 0 ? void 0 : _a.captureStream(24);
       if (!outputStream) throw new Error('outputStream not found');
       var tracks = [outputStream.getVideoTracks()[0]];
       if (captureAudio) {
@@ -14556,37 +14555,12 @@ function VideoSignatureContextProvider(_a) {
       });
     });
   }, [videoRef, outputCanvas]);
-  useEffect(function () {
-    if (!signatureVideoRef.current) return;
-    var video = signatureVideoRef.current;
-    function onFrame() {
-      blankCheckPassed.current || (blankCheckPassed.current = !isVideoBlank(signatureVideoRef.current, frameCheckCanvas.current));
-      drawOutputFrame();
-      video.requestVideoFrameCallback(onFrame);
-    }
-    function onPlay() {
-      video.requestVideoFrameCallback(onFrame);
-    }
-    video.addEventListener('play', onPlay);
-    return function () {
-      video.removeEventListener('play', onPlay);
-    };
-  }, [drawOutputFrame]);
-  useEffect(function () {
-    if (!videoRef.current) return;
-    var video = videoRef.current;
-    function onFrame() {
-      drawOutputFrame();
-      video.requestVideoFrameCallback(onFrame);
-    }
-    function onPlay() {
-      video.requestVideoFrameCallback(onFrame);
-    }
-    video.addEventListener('play', onPlay);
-    return function () {
-      video.removeEventListener('play', onPlay);
-    };
-  }, [drawOutputFrame, videoRef]);
+  var checkBlankAndDrawOutputFrame = useCallback(function () {
+    blankCheckPassed.current || (blankCheckPassed.current = !isVideoBlank(signatureVideoRef.current, frameCheckCanvas.current));
+    drawOutputFrame();
+  }, [drawOutputFrame, signatureVideoRef]);
+  useVideoFrameLoop(signatureVideoRef, checkBlankAndDrawOutputFrame);
+  useVideoFrameLoop(videoRef, drawOutputFrame);
   var _g = useVideoSignatureStore(),
     signaturePad = _g.signaturePad,
     recordingStartedAt = _g.recordingStartedAt;
@@ -14629,6 +14603,32 @@ function isCanvasBlank(canvas) {
   });
   return result;
 }
+function requestVideoFrameCallback(video, onFrame) {
+  if (typeof (video === null || video === void 0 ? void 0 : video.requestVideoFrameCallback) === 'function') {
+    video.requestVideoFrameCallback(onFrame);
+  } else {
+    requestAnimationFrame(onFrame);
+  }
+}
+function videoFrameLoop(video, onFrame) {
+  if (!video) return;
+  function onFrameRecursive() {
+    onFrame();
+    requestVideoFrameCallback(video, onFrameRecursive);
+  }
+  function onPlay() {
+    requestVideoFrameCallback(video, onFrameRecursive);
+  }
+  video.addEventListener('play', onPlay);
+  return function () {
+    video.removeEventListener('play', onPlay);
+  };
+}
+function useVideoFrameLoop(ref, onFrame) {
+  useEffect(function () {
+    return videoFrameLoop(ref.current, onFrame);
+  }, [onFrame, ref]);
+}
 
 function VideoSignaturePad(_a) {
   var onAcceptBtnClicked = _a.onAcceptBtnClicked,