idmission-web-sdk 2.1.85 → 2.1.87

package/dist/components/id_capture/DocumentDetectionModelProvider.d.ts

@@ -22,10 +22,11 @@ export type DocumentDetectionModelProviderProps = {
     autoStart?: boolean;
     children: ReactNode;
     throttleMs?: number;
+    delayAfterStartMs?: number;
     documentDetectionModelPath?: string;
     documentDetectionModelScoreThreshold?: number;
     documentDetectionModelLoadTimeoutMs?: number;
     onDocumentDetectionModelError?: (error: Error) => void;
 };
-export declare function DocumentDetectionModelProvider({ autoStart, children, throttleMs, documentDetectionModelPath, documentDetectionModelScoreThreshold, documentDetectionModelLoadTimeoutMs, onDocumentDetectionModelError, }: DocumentDetectionModelProviderProps): ReactElement;
+export declare function DocumentDetectionModelProvider({ autoStart, children, throttleMs, delayAfterStartMs, documentDetectionModelPath, documentDetectionModelScoreThreshold, documentDetectionModelLoadTimeoutMs, onDocumentDetectionModelError, }: DocumentDetectionModelProviderProps): ReactElement;
 export {};

package/dist/lib/models/FrameLoop.d.ts

@@ -1,4 +1,4 @@
-export declare function useFrameLoop(fn: (frameId: number) => Promise<void>, { throttleMs, autoStart }: {
+export declare function useFrameLoop(fn: (frameId: number, timeRunning: number) => Promise<void>, { throttleMs, autoStart }: {
     throttleMs?: number | undefined;
     autoStart?: boolean | undefined;
 }): {

package/dist/sdk2.cjs.development.js

@@ -234,7 +234,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.1.85';
+var webSdkVersion = '2.1.87';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -5595,6 +5595,7 @@ function setLastDetectionAt(time) {
   lastDetectionTime = time - lastDetectionAt;
   lastDetectionAt = time;
 }
+var framesNeededSamples = [];
 var defaultDocumentDetectionBoundaries = {
   top: 20,
   bottom: 20,
@@ -5678,11 +5679,16 @@ function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
       docWidth = _p[0],
       docHeight = _p[1];
     documentTooClose = docWidth > 0.85 || docHeight > 0.85;
-    if (detectionThresholdMet) {
+    if (detectionThresholdMet && documentInBounds && !documentTooClose) {
       var threshold_1 = (_m = thresholds.stability) !== null && _m !== void 0 ? _m : defaultDocumentDetectionThresholds.stability;
-      var framesNeeded = Math.ceil(Math.min(1000 / lastDetectionTime, 12));
-      lastNBoxes = __spreadArray([bestDocument.box], lastNBoxes, true).slice(0, framesNeeded);
-      documentIsStable = lastNBoxes.length >= framesNeeded && !createPairs(lastNBoxes).some(function (_a) {
+      framesNeededSamples.unshift(1000 / lastDetectionTime);
+      framesNeededSamples = framesNeededSamples.slice(0, 10);
+      var framesNeeded = Math.ceil(average(framesNeededSamples));
+      lastNBoxes.unshift(bestDocument.box);
+      lastNBoxes = lastNBoxes.slice(0, framesNeeded);
+      var numFramesToConsider = Math.min(framesNeeded, 12);
+      var framesToConsider = lastNBoxes.slice(0, numFramesToConsider);
+      documentIsStable = lastNBoxes.length >= framesNeeded - 1 && !createPairs(framesToConsider).some(function (_a) {
         var a = _a[0],
           b = _a[1];
         return calculateIoU(a, b) < threshold_1;
@@ -5745,6 +5751,12 @@ function calculateIoU(boxA, boxB) {
   if (unionArea === 0) return 0;
   return intersectionArea / unionArea;
 }
+function average(arr) {
+  var len = arr.length;
+  var sum = 0;
+  for (var i = 0; i < len; i++) sum += arr[i];
+  return sum / len;
+}
 
 function useFrameLoop(fn, _a) {
   var _b = _a.throttleMs,
@@ -5754,6 +5766,7 @@ function useFrameLoop(fn, _a) {
   var _d = React.useState(false),
     running = _d[0],
     setRunning = _d[1];
+  var startedAtRef = React.useRef(null);
   var loopId = React.useRef(0);
   var frameId = React.useRef(0);
   React.useEffect(function runFrameLoop() {
@@ -5762,15 +5775,17 @@ function useFrameLoop(fn, _a) {
     var currentLoopId = loopId.current;
     function renderPrediction() {
       return __awaiter(this, void 0, void 0, function () {
-        var start, took, amountToThrottle;
-        return __generator(this, function (_a) {
-          switch (_a.label) {
+        var start, timeRunning, took, amountToThrottle;
+        var _a, _b;
+        return __generator(this, function (_c) {
+          switch (_c.label) {
             case 0:
               if (currentLoopId !== loopId.current) return [2 /*return*/];
               start = new Date().getTime();
-              return [4 /*yield*/, fn(frameId.current)];
+              timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
+              return [4 /*yield*/, fn(frameId.current, timeRunning)];
             case 1:
-              _a.sent();
+              _c.sent();
               took = new Date().getTime() - start;
               amountToThrottle = Math.max((throttleMs !== null && throttleMs !== void 0 ? throttleMs : 0) - took, 0);
               timer = setTimeout(function () {
@@ -5789,11 +5804,13 @@ function useFrameLoop(fn, _a) {
     };
   }, [fn, running, throttleMs]);
   var start = React.useCallback(function () {
+    startedAtRef.current = new Date();
     setRunning(true);
   }, []);
   var stop = React.useCallback(function () {
     loopId.current += 1; // force the loop to stop immediately.
     setRunning(false);
+    startedAtRef.current = null;
   }, []);
   React.useEffect(function startAutomatically() {
     if (autoStart) start();
@@ -5843,44 +5860,46 @@ function DocumentDetectionModelProvider(_a) {
     children = _a.children,
     _c = _a.throttleMs,
     throttleMs = _c === void 0 ? 16 : _c,
-    _d = _a.documentDetectionModelPath,
-    documentDetectionModelPath = _d === void 0 ? defaultDocumentDetectorModelPath : _d,
-    _e = _a.documentDetectionModelScoreThreshold,
-    documentDetectionModelScoreThreshold = _e === void 0 ? defaultDocumentDetectionScoreThreshold : _e,
-    _f = _a.documentDetectionModelLoadTimeoutMs,
-    documentDetectionModelLoadTimeoutMs = _f === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _f,
+    _d = _a.delayAfterStartMs,
+    delayAfterStartMs = _d === void 0 ? 0 : _d,
+    _e = _a.documentDetectionModelPath,
+    documentDetectionModelPath = _e === void 0 ? defaultDocumentDetectorModelPath : _e,
+    _f = _a.documentDetectionModelScoreThreshold,
+    documentDetectionModelScoreThreshold = _f === void 0 ? defaultDocumentDetectionScoreThreshold : _f,
+    _g = _a.documentDetectionModelLoadTimeoutMs,
+    documentDetectionModelLoadTimeoutMs = _g === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _g,
     onDocumentDetectionModelError = _a.onDocumentDetectionModelError;
-  var _g = React.useContext(CameraStateContext),
-    videoRef = _g.videoRef,
-    videoLoaded = _g.videoLoaded,
-    cameraReady = _g.cameraReady;
+  var _h = React.useContext(CameraStateContext),
+    videoRef = _h.videoRef,
+    videoLoaded = _h.videoLoaded,
+    cameraReady = _h.cameraReady;
   var lastPredictionCanvas = React.useRef(null);
   var onPredictionHandler = React.useRef();
-  var _h = React.useState({}),
-    documentDetectionThresholds = _h[0],
-    setDocumentDetectionThresholds = _h[1];
-  var _j = React.useState(defaultDocumentDetectionBoundaries),
-    documentDetectionBoundaries = _j[0],
-    setDocumentDetectionBoundaries = _j[1];
-  var _k = React.useState(0),
-    timesAllZero = _k[0],
-    setTimesAllZero = _k[1];
+  var _j = React.useState({}),
+    documentDetectionThresholds = _j[0],
+    setDocumentDetectionThresholds = _j[1];
+  var _k = React.useState(defaultDocumentDetectionBoundaries),
+    documentDetectionBoundaries = _k[0],
+    setDocumentDetectionBoundaries = _k[1];
   var _l = React.useState(0),
-    canvasKey = _l[0],
-    setCanvasKey = _l[1];
+    timesAllZero = _l[0],
+    setTimesAllZero = _l[1];
+  var _m = React.useState(0),
+    canvasKey = _m[0],
+    setCanvasKey = _m[1];
   var stopDetection = React.useRef(0);
-  var _m = useLoadDocumentDetector({
+  var _o = useLoadDocumentDetector({
       modelPath: documentDetectionModelPath,
       modelLoadTimeoutMs: documentDetectionModelLoadTimeoutMs,
       scoreThreshold: documentDetectionModelScoreThreshold,
       onModelError: onDocumentDetectionModelError
     }),
-    detector = _m.detector,
-    ready = _m.ready,
-    modelDownloadProgress = _m.modelDownloadProgress,
-    modelError = _m.modelError,
-    setModelError = _m.setModelError;
-  var _o = useFrameLoop(React.useCallback(function (frameId) {
+    detector = _o.detector,
+    ready = _o.ready,
+    modelDownloadProgress = _o.modelDownloadProgress,
+    modelError = _o.modelError,
+    setModelError = _o.setModelError;
+  var _p = useFrameLoop(React.useCallback(function (frameId, timeRunning) {
       return __awaiter(_this, void 0, void 0, function () {
         var stopDetectionAtStart, vw, vh, ctx, prediction, processedPrediction;
         var _a;
@@ -5909,6 +5928,7 @@ function DocumentDetectionModelProvider(_a) {
                 return n + 1;
               });
               if (stopDetectionAtStart !== stopDetection.current) return [2 /*return*/];
+              if (timeRunning < delayAfterStartMs) return [2 /*return*/];
               return [4 /*yield*/, (_a = onPredictionHandler.current) === null || _a === void 0 ? void 0 : _a.call(onPredictionHandler, processedPrediction)];
             case 2:
               _b.sent();
@@ -5918,12 +5938,12 @@ function DocumentDetectionModelProvider(_a) {
           }
         });
       });
-    }, [cameraReady, detector, documentDetectionBoundaries, documentDetectionThresholds, ready, videoLoaded, videoRef]), {
+    }, [cameraReady, delayAfterStartMs, detector, documentDetectionBoundaries, documentDetectionThresholds, ready, videoLoaded, videoRef]), {
       throttleMs: throttleMs,
       autoStart: autoStart
     }),
-    start = _o.start,
-    stop = _o.stop;
+    start = _p.start,
+    stop = _p.stop;
   React.useEffect(function setErrorIfAllZero() {
     if (timesAllZero >= 2) {
       setModelError(new Error('model is returning all zeroes'));
@@ -8565,7 +8585,7 @@ var defaultIdCaptureGuideImages = {
       height: 573
     },
     SHOW_PASSPORT: {
-      url: "".concat(DEFAULT_CDN_URL, "/Shieldout-Passport-Front-SVG-Portrait-Borderless.svg"),
+      url: "".concat(DEFAULT_CDN_URL, "/Shieldout-Passport-Front-SVG-Portrait-2.svg"),
       width: 386,
       height: 573
     }
@@ -8582,7 +8602,7 @@ var defaultIdCaptureGuideImages = {
       height: 386
     },
     SHOW_PASSPORT: {
-      url: "".concat(DEFAULT_CDN_URL, "/Shieldout-Passport-Front-SVG-Landscape-Borderless.svg"),
+      url: "".concat(DEFAULT_CDN_URL, "/Shieldout-Passport-Front-SVG-Landscape-2.svg"),
       width: 573,
       height: 386
     }