idmission-web-sdk 2.3.98 → 2.3.99

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

@@ -1,8 +1,10 @@
 import React, { ReactNode } from 'react';
 import { SignatureData } from '../signature_capture/data';
 import SignatureCanvas from 'react-signature-canvas';
+import type { MediaInfo, MediaInfoResult } from 'mediainfo.js';
 export type VideoSignatureMetadata = {
     mimeType?: string;
+    mediaInfo?: MediaInfoResult;
     timingData?: {
         recordingStartRequestedAt?: number;
         recordingStartedAt?: number;
@@ -31,6 +33,7 @@ export type VideoSignatureState = {
     signatureValid: boolean;
     signatureStartedAt?: number;
     signatureEndedAt?: number;
+    mediaInfo?: MediaInfo<'object'>;
     onSignatureVideoCaptured: OnSignatureVideoCaptured;
 };
 export declare const useVideoSignatureStore: import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<VideoSignatureState>, "setState"> & {
@@ -47,7 +50,7 @@ export declare const useVideoSignatureStore: import("zustand").UseBoundStore<Omi
         type: string;
     }) | undefined): void;
 }>;
-export default function VideoSignatureContextProvider({ children, }: {
+export default function VideoSignatureContextProvider({ children, captureMediaInfo, }: {
     children: ReactNode;
     captureMediaInfo?: boolean;
 }): React.JSX.Element;

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,EAAE,SAAS,EAAkC,MAAM,OAAO,CAAA;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AACzD,OAAO,eAAe,MAAM,wBAAwB,CAAA;AAuBpD,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE;QACX,yBAAyB,CAAC,EAAE,MAAM,CAAA;QAClC,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAA;QAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAA;QACzB,wBAAwB,CAAC,EAAE,MAAM,CAAA;QACjC,mBAAmB,CAAC,EAAE,MAAM,CAAA;QAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAA;KAC5B,CAAA;CACF,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG,CACrC,SAAS,EAAE,IAAI,EACf,aAAa,EAAE,aAAa,EAC5B,kBAAkB,EAAE,MAAM,GAAG,IAAI,EACjC,QAAQ,EAAE,sBAAsB,KAC7B,IAAI,CAAA;AAET,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,CAAC,YAAY,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IAChD,aAAa,EAAE,CACb,aAAa,CAAC,EAAE,aAAa,EAC7B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,KAC3B,IAAI,CAAA;IACT,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAE7B,yBAAyB,CAAC,EAAE,MAAM,CAAA;IAClC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAE3B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAA;IAC9C,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAA;IAEhD,iBAAiB,EAAE,OAAO,CAAA;IAC1B,cAAc,EAAE,OAAO,CAAA;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAA;IAIzB,wBAAwB,EAAE,wBAAwB,CAAA;CACnD,CAAA;AAaD,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;EAoHlC,CAAA;AAiCD,MAAM,CAAC,OAAO,UAAU,6BAA6B,CAAC,EACpD,QAAQ,GAET,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,qBA8IA"}
+{"version":3,"file":"VideoSignatureContext.d.ts","sourceRoot":"","sources":["../../../src/components/video_signature_capture/VideoSignatureContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAkC,MAAM,OAAO,CAAA;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AACzD,OAAO,eAAe,MAAM,wBAAwB,CAAA;AAWpD,OAAO,KAAK,EAAiB,SAAS,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAY7E,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,eAAe,CAAA;IAC3B,UAAU,CAAC,EAAE;QACX,yBAAyB,CAAC,EAAE,MAAM,CAAA;QAClC,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAA;QAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAA;QACzB,wBAAwB,CAAC,EAAE,MAAM,CAAA;QACjC,mBAAmB,CAAC,EAAE,MAAM,CAAA;QAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAA;KAC5B,CAAA;CACF,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG,CACrC,SAAS,EAAE,IAAI,EACf,aAAa,EAAE,aAAa,EAC5B,kBAAkB,EAAE,MAAM,GAAG,IAAI,EACjC,QAAQ,EAAE,sBAAsB,KAC7B,IAAI,CAAA;AAET,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,CAAC,YAAY,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IAChD,aAAa,EAAE,CACb,aAAa,CAAC,EAAE,aAAa,EAC7B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,KAC3B,IAAI,CAAA;IACT,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAE7B,yBAAyB,CAAC,EAAE,MAAM,CAAA;IAClC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAE3B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAA;IAC9C,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAA;IAEhD,iBAAiB,EAAE,OAAO,CAAA;IAC1B,cAAc,EAAE,OAAO,CAAA;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAA;IAEzB,SAAS,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAA;IAE/B,wBAAwB,EAAE,wBAAwB,CAAA;CACnD,CAAA;AAaD,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;EAkHlC,CAAA;AAiCD,MAAM,CAAC,OAAO,UAAU,6BAA6B,CAAC,EACpD,QAAQ,EACR,gBAAwB,GACzB,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,qBAqHA"}

package/dist/sdk2.cjs.development.js

@@ -17,6 +17,7 @@ var middleware = require('zustand/middleware');
 var shallow = require('zustand/react/shallow');
 var cn = require('clsx');
 var SignatureCanvas = require('react-signature-canvas');
+var mediainfo_js = require('mediainfo.js');
 var server = require('react-dom/server');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -236,7 +237,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.3.98';
+var webSdkVersion = '2.3.99';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -14326,14 +14327,23 @@ function inferBlobType(blobPart) {
   return t.length > 0 ? t : undefined;
 }
 
-// import { mediaInfoFactory } from 'mediainfo.js'
-// import type { ReadChunkFunc, MediaInfo, MediaInfoResult } from 'mediainfo.js'
-// import { DEFAULT_CDN_URL } from '../common/cdn'
-// import { warn } from '../../lib/utils/logger'
-// function makeReadChunk(file: File | Blob): ReadChunkFunc {
-//   return async (chunkSize: number, offset: number) =>
-//     new Uint8Array(await file.slice(offset, offset + chunkSize).arrayBuffer())
-// }
+function makeReadChunk(file) {
+  var _this = this;
+  return function (chunkSize, offset) {
+    return __awaiter(_this, void 0, void 0, function () {
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
+          case 0:
+            _a = Uint8Array.bind;
+            return [4 /*yield*/, file.slice(offset, offset + chunkSize).arrayBuffer()];
+          case 1:
+            return [2 /*return*/, new (_a.apply(Uint8Array, [void 0, _b.sent()]))()];
+        }
+      });
+    });
+  };
+}
 var signatureRecorder = null;
 var signatureChunks = [];
 var videoSignatureInitialState = {
@@ -14368,9 +14378,8 @@ var useVideoSignatureStore = zustand.create()(middleware.devtools(function (set,
       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) {
@@ -14415,39 +14424,42 @@ var useVideoSignatureStore = zustand.create()(middleware.devtools(function (set,
         signatureRecorder.stop();
         signatureRecorder.onstop = function () {
           return __awaiter(void 0, void 0, void 0, function () {
-            var recordingStoppedAt, inferredType, blob, _a, onSignatureVideoCaptured, recordingStartRequestedAt, recordingStartedAt, firstChunkReceivedAt, signatureStartedAt, signatureEndedAt, recordingStopRequestedAt, lastChunkReceivedAt;
-            return __generator(this, function (_b) {
-              recordingStoppedAt = performance.now();
-              set({
-                recordingStoppedAt: recordingStoppedAt
-              });
-              inferredType = inferBlobType(signatureChunks[0]) || (signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.mimeType) || 'video/mp4';
-              blob = new Blob(signatureChunks, {
-                type: inferredType
-              });
-              signatureChunks = [];
-              signatureRecorder = null;
-              if (!signatureData) return [2 /*return*/];
-              _a = get(), onSignatureVideoCaptured = _a.onSignatureVideoCaptured, recordingStartRequestedAt = _a.recordingStartRequestedAt, recordingStartedAt = _a.recordingStartedAt, firstChunkReceivedAt = _a.firstChunkReceivedAt, signatureStartedAt = _a.signatureStartedAt, signatureEndedAt = _a.signatureEndedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt, lastChunkReceivedAt = _a.lastChunkReceivedAt;
-              // const mediaInfo = await get().mediaInfo?.analyzeData(
-              //   blob.size,
-              //   makeReadChunk(blob),
-              // )
-              onSignatureVideoCaptured(blob, signatureData, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, {
-                // mediaInfo,
-                mimeType: inferredType,
-                timingData: {
-                  recordingStartRequestedAt: recordingStartRequestedAt,
-                  recordingStartedAt: recordingStartedAt,
-                  firstChunkReceivedAt: firstChunkReceivedAt,
-                  signatureStartedAt: signatureStartedAt,
-                  signatureEndedAt: signatureEndedAt,
-                  recordingStopRequestedAt: recordingStopRequestedAt,
-                  recordingStoppedAt: recordingStoppedAt,
-                  lastChunkReceivedAt: lastChunkReceivedAt
-                }
-              });
-              return [2 /*return*/];
+            var recordingStoppedAt, inferredType, blob, _a, onSignatureVideoCaptured, recordingStartRequestedAt, recordingStartedAt, firstChunkReceivedAt, signatureStartedAt, signatureEndedAt, recordingStopRequestedAt, lastChunkReceivedAt, mediaInfo;
+            var _b;
+            return __generator(this, function (_c) {
+              switch (_c.label) {
+                case 0:
+                  recordingStoppedAt = performance.now();
+                  set({
+                    recordingStoppedAt: recordingStoppedAt
+                  });
+                  inferredType = inferBlobType(signatureChunks[0]) || (signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.mimeType) || 'video/mp4';
+                  blob = new Blob(signatureChunks, {
+                    type: inferredType
+                  });
+                  signatureChunks = [];
+                  signatureRecorder = null;
+                  if (!signatureData) return [2 /*return*/];
+                  _a = get(), onSignatureVideoCaptured = _a.onSignatureVideoCaptured, recordingStartRequestedAt = _a.recordingStartRequestedAt, recordingStartedAt = _a.recordingStartedAt, firstChunkReceivedAt = _a.firstChunkReceivedAt, signatureStartedAt = _a.signatureStartedAt, signatureEndedAt = _a.signatureEndedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt, lastChunkReceivedAt = _a.lastChunkReceivedAt;
+                  return [4 /*yield*/, (_b = get().mediaInfo) === null || _b === void 0 ? void 0 : _b.analyzeData(blob.size, makeReadChunk(blob))];
+                case 1:
+                  mediaInfo = _c.sent();
+                  onSignatureVideoCaptured(blob, signatureData, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, {
+                    mediaInfo: mediaInfo,
+                    mimeType: inferredType,
+                    timingData: {
+                      recordingStartRequestedAt: recordingStartRequestedAt,
+                      recordingStartedAt: recordingStartedAt,
+                      firstChunkReceivedAt: firstChunkReceivedAt,
+                      signatureStartedAt: signatureStartedAt,
+                      signatureEndedAt: signatureEndedAt,
+                      recordingStopRequestedAt: recordingStopRequestedAt,
+                      recordingStoppedAt: recordingStoppedAt,
+                      lastChunkReceivedAt: lastChunkReceivedAt
+                    }
+                  });
+                  return [2 /*return*/];
+              }
             });
           });
         };
@@ -14497,7 +14509,9 @@ function waitForOneMoreChunk(timeoutMs) {
 function VideoSignatureContextProvider(_a) {
   var _this = this;
   var _b, _c, _d, _e;
-  var children = _a.children;
+  var children = _a.children,
+    _f = _a.captureMediaInfo,
+    captureMediaInfo = _f === void 0 ? false : _f;
   var videoRef = useCameraStore().videoRef;
   var outputCanvas = React.useRef(null);
   React.useEffect(function () {
@@ -14507,27 +14521,31 @@ function VideoSignatureContextProvider(_a) {
   }, []);
   var signatureVideoRef = React.useRef(null);
   var frameCheckCanvas = React.useRef(null);
-  // useEffect(() => {
-  //   if (!captureMediaInfo) return
-  //   mediaInfoFactory({
-  //     format: 'object',
-  //     full: true,
-  //     locateFile: (filename) => `${DEFAULT_CDN_URL}/${filename}`,
-  //   })
-  //     .then((mediaInfo) => {
-  //       useVideoSignatureStore.setState({ mediaInfo })
-  //     })
-  //     .catch((e) => {
-  //       warn('error loading mediaInfo', e)
-  //     })
-  //   return () => {
-  //     const mediaInfo = useVideoSignatureStore.getState().mediaInfo
-  //     if (mediaInfo) {
-  //       mediaInfo.close()
-  //       useVideoSignatureStore.setState({ mediaInfo: undefined })
-  //     }
-  //   }
-  // }, [captureMediaInfo])
+  React.useEffect(function () {
+    if (!captureMediaInfo) return;
+    mediainfo_js.mediaInfoFactory({
+      format: 'object',
+      full: true,
+      locateFile: function locateFile(filename) {
+        return "".concat(DEFAULT_CDN_URL, "/").concat(filename);
+      }
+    }).then(function (mediaInfo) {
+      useVideoSignatureStore.setState({
+        mediaInfo: mediaInfo
+      });
+    })["catch"](function (e) {
+      warn('error loading mediaInfo', e);
+    });
+    return function () {
+      var mediaInfo = useVideoSignatureStore.getState().mediaInfo;
+      if (mediaInfo) {
+        mediaInfo.close();
+        useVideoSignatureStore.setState({
+          mediaInfo: undefined
+        });
+      }
+    };
+  }, [captureMediaInfo]);
   var signaturePadEmpty = useVideoSignatureStore().signaturePadEmpty;
   var blankCheckPassed = React.useRef(false);
   React.useEffect(function () {
@@ -14568,40 +14586,15 @@ function VideoSignatureContextProvider(_a) {
       });
     });
   }, [videoRef, outputCanvas]);
-  React.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]);
-  React.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 _f = useVideoSignatureStore(),
-    signaturePad = _f.signaturePad,
-    recordingStartedAt = _f.recordingStartedAt;
+  var checkBlankAndDrawOutputFrame = React.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;
   React.useEffect(function () {
     var _a;
     if (!signaturePad.current || !recordingStartedAt) return;
@@ -14641,6 +14634,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) {
+  React.useEffect(function () {
+    return videoFrameLoop(ref.current, onFrame);
+  }, [onFrame, ref]);
+}
 
 function VideoSignaturePad(_a) {
   var onAcceptBtnClicked = _a.onAcceptBtnClicked,