idmission-web-sdk 2.3.11 → 2.3.13

package/dist/components/video_signature_capture/VideoSignatureContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VideoSignatureContext.d.ts","sourceRoot":"","sources":["../../../src/components/video_signature_capture/VideoSignatureContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEZ,SAAS,EAOV,MAAM,OAAO,CAAA;AACd,OAAO,EAGL,aAAa,EACd,MAAM,2BAA2B,CAAA;AAClC,OAAO,eAAe,MAAM,wBAAwB,CAAA;AAMpD,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAA;IACzB,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAC7B,WAAW,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAA;IAC/C,aAAa,EAAE,aAAa,GAAG,IAAI,CAAA;IACnC,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,kBAAkB,EAAE,IAAI,GAAG,IAAI,CAAA;IAC/B,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAA;IAEhC,eAAe,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CACrC,CAAA;AAeD,eAAO,MAAM,qBAAqB,oCAEjC,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,6BAA6B,CAAC,EACpD,QAAQ,EACR,YAAoB,GACrB,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB,qBAoMA;AAED,wBAAgB,wBAAwB,wBAOvC"}
+{"version":3,"file":"VideoSignatureContext.d.ts","sourceRoot":"","sources":["../../../src/components/video_signature_capture/VideoSignatureContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEZ,SAAS,EAOV,MAAM,OAAO,CAAA;AACd,OAAO,EAGL,aAAa,EACd,MAAM,2BAA2B,CAAA;AAClC,OAAO,eAAe,MAAM,wBAAwB,CAAA;AAgCpD,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAA;IACzB,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAC7B,WAAW,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAA;IAC/C,aAAa,EAAE,aAAa,GAAG,IAAI,CAAA;IACnC,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,kBAAkB,EAAE,IAAI,GAAG,IAAI,CAAA;IAC/B,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAA;IAEhC,eAAe,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CACrC,CAAA;AAeD,eAAO,MAAM,qBAAqB,oCAEjC,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,6BAA6B,CAAC,EACpD,QAAQ,EACR,YAAoB,GACrB,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB,qBA8LA;AAED,wBAAgB,wBAAwB,wBAOvC"}

package/dist/lib/camera/useVideoRecorder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useVideoRecorder.d.ts","sourceRoot":"","sources":["../../../src/lib/camera/useVideoRecorder.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAGjC,eAAO,MAAM,gBAAgB,WACnB,MAAM,GAAG,IAAI,gBACP,WAAW,GAAG,IAAI;;;;;;;;;;;;CAqKjC,CAAA"}
+{"version":3,"file":"useVideoRecorder.d.ts","sourceRoot":"","sources":["../../../src/lib/camera/useVideoRecorder.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AA6BjC,eAAO,MAAM,gBAAgB,WACnB,MAAM,GAAG,IAAI,gBACP,WAAW,GAAG,IAAI;;;;;;;;;;;;CAqKjC,CAAA"}

package/dist/sdk2.cjs.development.js

@@ -235,7 +235,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.3.11';
+var webSdkVersion = '2.3.13';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -13357,14 +13357,29 @@ var Container$4 = styled__default.default.div(templateObject_1$c || (templateObj
 var AcceptBtn$1 = styled__default.default(LoaderButton)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n  margin-left: auto;\n"], ["\n  margin-left: auto;\n"])));
 var templateObject_1$c, templateObject_2$a;
 
+var videoRecorder = null;
+var audioRecorder = null;
+var videoChunks = [];
+var audioChunks = [];
+function getVideoRecorder() {
+  return videoRecorder;
+}
+function setVideoRecorder(recorder) {
+  videoRecorder = recorder;
+}
+function setAudioRecorder(recorder) {
+  audioRecorder = recorder;
+}
+function clearVideoChunks() {
+  videoChunks = [];
+}
+function clearAudioChunks() {
+  audioChunks = [];
+}
 var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
   if (mergeAVStreams === void 0) {
     mergeAVStreams = false;
   }
-  var videoRecorder = React.useRef(null);
-  var audioRecorder = React.useRef(null);
-  var videoChunks = React.useRef([]);
-  var audioChunks = React.useRef([]);
   var _a = React.useState(null),
     videoUrl = _a[0],
     setVideoUrl = _a[1];
@@ -13397,45 +13412,48 @@ var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStr
     return new MediaStream(__spreadArray(__spreadArray([], videoTracks, true), audioTracks, true));
   }, [audioStream, camera === null || camera === void 0 ? void 0 : camera.stream, mergeAVStreams]);
   var processVideo = React.useCallback(function () {
-    var videoBlob = new Blob(videoChunks.current, {
+    var videoBlob = new Blob(videoChunks, {
       type: 'video/mp4'
     });
-    videoChunks.current = [];
     setVideoUrl(URL.createObjectURL(videoBlob));
+    clearVideoChunks();
     setIsRecordingVideo(false);
+    setVideoRecorder(null);
     camera === null || camera === void 0 ? void 0 : camera.release();
   }, [camera]);
   var processAudio = React.useCallback(function () {
     var _a;
-    var audioBlob = new Blob(audioChunks.current, {
+    var audioBlob = new Blob(audioChunks, {
       type: 'audio/mp4'
     });
-    audioChunks.current = [];
     setAudioUrl(URL.createObjectURL(audioBlob));
+    clearAudioChunks();
     setIsRecordingAudio(false);
+    setAudioRecorder(null);
     (_a = audioStream === null || audioStream === void 0 ? void 0 : audioStream.stop) === null || _a === void 0 ? void 0 : _a.call(audioStream);
   }, [audioStream]);
   var startRecordingVideo = React.useCallback(function () {
     var videoStream = getVideoStream();
     if (!videoStream) return;
-    videoChunks.current = [];
+    clearVideoChunks();
     setIsRecordingVideo(true);
     setVideoRecordingStopped(false);
     setVideoRecordingIntentionallyStopped(false);
-    videoRecorder.current = new MediaRecorder(videoStream, {
+    var videoRecorder = new MediaRecorder(videoStream, {
       videoBitsPerSecond: 270000,
       audioBitsPerSecond: 32000
     });
-    videoRecorder.current.ondataavailable = function (e) {
-      videoChunks.current.push(e.data);
+    setVideoRecorder(videoRecorder);
+    videoRecorder.ondataavailable = function (e) {
+      videoChunks.push(e.data);
     };
-    videoRecorder.current.onstop = function () {
+    videoRecorder.onstop = function () {
       setVideoRecordingStopped(true);
     };
-    videoRecorder.current.start(1000);
+    videoRecorder.start(1000);
     setTimeout(function () {
       var _a;
-      if (((_a = videoRecorder.current) === null || _a === void 0 ? void 0 : _a.state) === 'inactive') {
+      if (((_a = getVideoRecorder()) === null || _a === void 0 ? void 0 : _a.state) === 'inactive') {
         log('media recorder is inactive!');
         // TODO: figure out what to do here
       }
@@ -13444,33 +13462,32 @@ var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStr
   var startRecordingAudio = React.useCallback(function () {
     if (mergeAVStreams) return;
     if (!audioStream) return;
-    audioChunks.current = [];
+    clearAudioChunks();
     setIsRecordingAudio(true);
     setAudioRecordingStopped(false);
     setAudioRecordingIntentionallyStopped(false);
-    audioRecorder.current = new MediaRecorder(audioStream, {
+    var audioRecorder = new MediaRecorder(audioStream, {
       audioBitsPerSecond: 32000
     });
-    audioRecorder.current.ondataavailable = function (e) {
-      audioChunks.current.push(e.data);
+    setAudioRecorder(audioRecorder);
+    audioRecorder.ondataavailable = function (e) {
+      audioChunks.push(e.data);
     };
-    audioRecorder.current.onstop = function () {
+    audioRecorder.onstop = function () {
       setAudioRecordingStopped(true);
     };
-    audioRecorder.current.start(1000);
+    audioRecorder.start(1000);
   }, [audioStream, mergeAVStreams]);
   var stopRecordingVideo = React.useCallback(function () {
-    var _a, _b;
     setVideoRecordingIntentionallyStopped(true);
-    if (((_a = videoRecorder.current) === null || _a === void 0 ? void 0 : _a.state) !== 'inactive') {
-      (_b = videoRecorder.current) === null || _b === void 0 ? void 0 : _b.stop(); // if you call this while state === 'inactive', an exception is thrown.
+    if ((videoRecorder === null || videoRecorder === void 0 ? void 0 : videoRecorder.state) !== 'inactive') {
+      videoRecorder === null || videoRecorder === void 0 ? void 0 : videoRecorder.stop(); // if you call this while state === 'inactive', an exception is thrown.
     }
   }, []);
   var stopRecordingAudio = React.useCallback(function () {
-    var _a, _b;
     setAudioRecordingIntentionallyStopped(true);
-    if (((_a = audioRecorder.current) === null || _a === void 0 ? void 0 : _a.state) !== 'inactive') {
-      (_b = audioRecorder.current) === null || _b === void 0 ? void 0 : _b.stop(); // if you call this while state === 'inactive', an exception is thrown.
+    if ((audioRecorder === null || audioRecorder === void 0 ? void 0 : audioRecorder.state) !== 'inactive') {
+      audioRecorder === null || audioRecorder === void 0 ? void 0 : audioRecorder.stop(); // if you call this while state === 'inactive', an exception is thrown.
     }
   }, []);
   React.useEffect(function () {
@@ -13484,8 +13501,8 @@ var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStr
     }
   }, [audioRecordingIntentionallyStopped, audioRecordingStopped, processAudio]);
   var clearRecordedData = React.useCallback(function () {
-    videoChunks.current = [];
-    audioChunks.current = [];
+    clearVideoChunks();
+    clearAudioChunks();
   }, []);
   return React.useMemo(function () {
     return {
@@ -13504,6 +13521,36 @@ var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStr
   }, [audioRecordingIntentionallyStopped, audioRecordingStopped, audioUrl, clearRecordedData, isRecordingAudio, isRecordingVideo, startRecordingAudio, startRecordingVideo, stopRecordingAudio, stopRecordingVideo, videoRecordingIntentionallyStopped, videoRecordingStopped, videoUrl]);
 };
 
+var signatureRecorder = null;
+var getSignatureRecorder = function getSignatureRecorder() {
+  return signatureRecorder;
+};
+var setSignatureRecorder = function setSignatureRecorder(recorder) {
+  return signatureRecorder = recorder;
+};
+var signatureChunks = [];
+var clearSignatureChunks = function clearSignatureChunks() {
+  return signatureChunks = [];
+};
+var recordingLock = false;
+var setRecordingLock = function setRecordingLock(lock) {
+  return recordingLock = lock;
+};
+var recordingLockEngaged = function recordingLockEngaged() {
+  return recordingLock;
+};
+function waitForCanvasAvailable(canvasRef) {
+  if (canvasRef.current) return Promise.resolve(null);
+  return new Promise(function (resolve) {
+    var interval = setInterval(function () {
+      debug('VideoSignatureContext: waiting for output canvas');
+      if (canvasRef.current) {
+        clearInterval(interval);
+        resolve(null);
+      }
+    }, 100);
+  });
+}
 var videoSignatureInitialState = {
   startRecording: function startRecording() {
     return null;
@@ -13522,7 +13569,7 @@ var videoSignatureInitialState = {
   onAcceptClicked: function onAcceptClicked() {
     return __awaiter(void 0, void 0, void 0, function () {
       return __generator(this, function (_a) {
-        return [2 /*return*/, void 0];
+        return [2 /*return*/];
       });
     });
   }
@@ -13547,8 +13594,6 @@ function VideoSignatureContextProvider(_a) {
   var _h = React.useState(null),
     signatureVideoUrl = _h[0],
     setSignatureVideoUrl = _h[1];
-  var signatureRecorder = React.useRef(null);
-  var recordedChunks = React.useRef([]);
   var _j = useCameraStore(),
     camera = _j.camera,
     videoRef = _j.videoRef,
@@ -13561,7 +13606,6 @@ function VideoSignatureContextProvider(_a) {
     stopRecordingAudio = _k.stopRecordingAudio,
     clearRecordedVideoData = _k.clearRecordedData;
   var outputCanvas = React.useRef(null);
-  var recordingLock = React.useRef(false);
   var onRecordingStopped = React.useRef(function () {});
   var _l = React.useState(false),
     isRecording = _l[0],
@@ -13580,67 +13624,45 @@ function VideoSignatureContextProvider(_a) {
       setIsRecording(true);
       onRecordingStopped.current = function () {};
     };
-    recordingLock.current = false;
+    setRecordingLock(false);
     setIsRecording(false);
-    (_a = signatureRecorder.current) === null || _a === void 0 ? void 0 : _a.stop();
+    (_a = getSignatureRecorder()) === null || _a === void 0 ? void 0 : _a.stop();
+    setSignatureRecorder(null);
   }, []);
   React.useEffect(function () {
     if (!isRecording) return;
-    if (recordingLock.current) return;
-    recordingLock.current = true;
-    (function () {
-      return __awaiter(_this, void 0, void 0, function () {
-        var stream, tracks, audioTrack;
-        var _a;
-        return __generator(this, function (_b) {
-          switch (_b.label) {
-            case 0:
-              if (!!outputCanvas.current) return [3 /*break*/, 2];
-              return [4 /*yield*/, new Promise(function (resolve) {
-                var interval = setInterval(function () {
-                  if (outputCanvas.current) {
-                    clearInterval(interval);
-                    resolve(null);
-                  }
-                }, 10);
-              })];
-            case 1:
-              _b.sent();
-              _b.label = 2;
-            case 2:
-              recordedChunks.current = [];
-              clearRecordedVideoData();
-              startRecordingVideo();
-              if (captureAudio) startRecordingAudio();
-              stream = outputCanvas.current.captureStream(24 /* fps */);
-              tracks = [stream.getVideoTracks()[0]];
-              audioTrack = (_a = audioStream === null || audioStream === void 0 ? void 0 : audioStream.getAudioTracks()) === null || _a === void 0 ? void 0 : _a[0];
-              if (audioTrack) tracks.push(audioTrack);
-              signatureRecorder.current = new MediaRecorder(new MediaStream(tracks), {
-                videoBitsPerSecond: 270000,
-                audioBitsPerSecond: 32000
-              });
-              signatureRecorder.current.start();
-              signatureRecorder.current.ondataavailable = function (event) {
-                var _a;
-                recordedChunks.current.push(event.data);
-                if (((_a = signatureRecorder.current) === null || _a === void 0 ? void 0 : _a.state) === 'recording') {
-                  signatureRecorder.current.stop();
-                }
-              };
-              signatureRecorder.current.onstop = function () {
-                var blob = new Blob(recordedChunks.current, {
-                  type: 'video/mp4'
-                });
-                setSignatureVideoData(blob);
-                setSignatureVideoUrl(URL.createObjectURL(blob));
-                onRecordingStopped.current();
-              };
-              return [2 /*return*/];
-          }
-        });
+    if (recordingLockEngaged()) return;
+    setRecordingLock(true);
+    waitForCanvasAvailable(outputCanvas).then(function () {
+      var _a;
+      clearSignatureChunks();
+      clearRecordedVideoData();
+      startRecordingVideo();
+      if (captureAudio) startRecordingAudio();
+      var stream = outputCanvas.current.captureStream(24 /* fps */);
+      var tracks = [stream.getVideoTracks()[0]];
+      var audioTrack = (_a = audioStream === null || audioStream === void 0 ? void 0 : audioStream.getAudioTracks()) === null || _a === void 0 ? void 0 : _a[0];
+      if (audioTrack) tracks.push(audioTrack);
+      var signatureRecorder = new MediaRecorder(new MediaStream(tracks), {
+        videoBitsPerSecond: 270000,
+        audioBitsPerSecond: 32000
       });
-    })();
+      setSignatureRecorder(signatureRecorder);
+      signatureRecorder.ondataavailable = function (event) {
+        signatureChunks.push(event.data);
+      };
+      signatureRecorder.onstop = function () {
+        var blob = new Blob(signatureChunks, {
+          type: 'video/mp4'
+        });
+        setSignatureVideoData(blob);
+        setSignatureVideoUrl(URL.createObjectURL(blob));
+        clearSignatureChunks();
+        setSignatureRecorder(null);
+        onRecordingStopped.current();
+      };
+      signatureRecorder.start(1000);
+    });
   }, [audioStream, captureAudio, clearRecordedVideoData, isRecording, startRecordingAudio, startRecordingVideo]);
   var animationFrame = React.useRef(0);
   React.useEffect(function () {
@@ -13682,17 +13704,23 @@ function VideoSignatureContextProvider(_a) {
       return __generator(this, function (_b) {
         switch (_b.label) {
           case 0:
+            debug('VideoSignatureContext: onAcceptClicked');
             if (!signaturePad.current) return [2 /*return*/];
+            debug('VideoSignatureContext: building signature data...');
             signatureData = buildSignatureData(signaturePad.current);
+            debug('VideoSignatureContext: exporting signature image...');
             return [4 /*yield*/, exportSignatureImage(signaturePad.current)];
           case 1:
             imageUrl = _b.sent();
             if (imageUrl) signatureData.fileContent = dataUrlToBase64Sync(imageUrl);
+            debug('VideoSignatureContext: setting signature data url...');
             setSignatureDataUrl(imageUrl);
             setSignatureData(signatureData);
+            debug('VideoSignatureContext: stopping recording...');
             stopRecordingVideo();
             stopRecordingAudio();
-            (_a = signatureRecorder.current) === null || _a === void 0 ? void 0 : _a.stop();
+            debug('VideoSignatureContext: stopping signature recorder...');
+            (_a = getSignatureRecorder()) === null || _a === void 0 ? void 0 : _a.stop();
             return [2 /*return*/];
         }
       });