idmission-web-sdk 2.1.53 → 2.1.55

package/dist/components/submission/SubmissionProvider.d.ts

@@ -64,6 +64,11 @@ export type SubmissionState = {
     retryLocationAccess: () => void;
 };
 export declare const SubmissionContext: React.Context<SubmissionState>;
+export type OnSubmit = (payload: SubmissionRequest) => void;
+export type OnBeforeSubmit = (req: SubmissionRequest) => Promise<SubmissionRequest>;
+export type OnBeforeLivenessCheck = (req: LivenessCheckRequest) => Promise<LivenessCheckRequest>;
+export type OnResponseReceived = (res: SubmissionResponse, req: SubmissionRequest) => void;
+export type OnRequestFailure = (err: Error) => void;
 export type SubmissionProviderProps = {
     action: SubmissionAction;
     children: ReactElement;
@@ -96,16 +101,16 @@ export type SubmissionProviderProps = {
     precapturedDocuments?: CapturedDocuments;
     documentServiceUrl?: string;
     sendBase64DocumentsInSwaggerProxy?: boolean;
-    onSubmit?: (payload: SubmissionRequest) => void;
-    onBeforeSubmit?: (req: SubmissionRequest) => Promise<SubmissionRequest>;
-    onBeforeLivenessCheck?: (req: LivenessCheckRequest) => Promise<LivenessCheckRequest>;
+    onSubmit?: OnSubmit;
+    onBeforeSubmit?: OnBeforeSubmit;
+    onBeforeLivenessCheck?: OnBeforeLivenessCheck;
     onBeforeDocumentUpload?: OnBeforeDocumentUpload;
     onDocumentUploadProgress?: OnDocumentUploadProgress;
     onDocumentUploaded?: OnDocumentUploaded;
     onDocumentUploadFailed?: OnDocumentUploadFailed;
-    onResponseReceived?: (res: SubmissionResponse, req: SubmissionRequest) => void;
-    onRequestFailure?: (err: Error) => void;
+    onResponseReceived?: OnResponseReceived;
+    onRequestFailure?: OnRequestFailure;
     readTextPrompt?: string;
     clientRequestID?: string;
 };
-export declare const SubmissionProvider: ({ action, children, submissionUrl, environment, companyId, enrollmentId, personalData, cardData, idData, bypassAgeValidation, bypassNameMatching, needImmediateResponse, manualReviewRequired, idBackImageRequired, idImageResolutionCheck, verifyIdWithExternalDatabases, deduplicationEnabled, deduplicationSynchronous, idCardForFaceMatch, geolocationEnabled, geolocationRequired, webhooksEnabled, webhooksClientTraceId, webhooksStripSpecialCharacters, webhooksSendInputImages, webhooksSendProcessedImages, webhooksFireOnReview, customerDataMatchConfig, precapturedDocuments, documentServiceUrl, sendBase64DocumentsInSwaggerProxy, onSubmit, onBeforeSubmit, onBeforeLivenessCheck, onBeforeDocumentUpload, onDocumentUploadProgress, onDocumentUploaded, onDocumentUploadFailed, onResponseReceived, onRequestFailure, clientRequestID, }: SubmissionProviderProps) => ReactElement;
+export declare const SubmissionProvider: ({ action, children, submissionUrl, environment, companyId, enrollmentId, personalData, cardData, idData, bypassAgeValidation, bypassNameMatching, needImmediateResponse, manualReviewRequired, idBackImageRequired, idImageResolutionCheck, verifyIdWithExternalDatabases, deduplicationEnabled, deduplicationSynchronous, idCardForFaceMatch, geolocationEnabled, geolocationRequired, webhooksEnabled, webhooksClientTraceId, webhooksStripSpecialCharacters, webhooksSendInputImages, webhooksSendProcessedImages, webhooksFireOnReview, customerDataMatchConfig, precapturedDocuments, documentServiceUrl, sendBase64DocumentsInSwaggerProxy, onSubmit: userSuppliedOnSubmit, onBeforeSubmit: userSuppliedOnBeforeSubmit, onBeforeLivenessCheck: userSuppliedOnBeforeLivenessCheck, onBeforeDocumentUpload: userSuppliedOnBeforeDocumentUpload, onDocumentUploadProgress: userSuppliedOnDocumentUploadProgress, onDocumentUploaded: userSuppliedOnDocumentUploaded, onDocumentUploadFailed: userSuppliedOnDocumentUploadFailed, onResponseReceived: userSuppliedOnResponseReceived, onRequestFailure: userSuppliedOnRequestFailure, clientRequestID, }: SubmissionProviderProps) => ReactElement;

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.53';
+var webSdkVersion = '2.1.55';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -1168,15 +1168,15 @@ var SubmissionProvider = function SubmissionProvider(_a) {
     documentServiceUrl = _v === void 0 ? defaultDocumentServiceUrl : _v,
     _w = _a.sendBase64DocumentsInSwaggerProxy,
     sendBase64DocumentsInSwaggerProxy = _w === void 0 ? false : _w,
-    onSubmit = _a.onSubmit,
-    onBeforeSubmit = _a.onBeforeSubmit,
-    onBeforeLivenessCheck = _a.onBeforeLivenessCheck,
-    onBeforeDocumentUpload = _a.onBeforeDocumentUpload,
-    onDocumentUploadProgress = _a.onDocumentUploadProgress,
-    onDocumentUploaded = _a.onDocumentUploaded,
-    onDocumentUploadFailed = _a.onDocumentUploadFailed,
-    onResponseReceived = _a.onResponseReceived,
-    onRequestFailure = _a.onRequestFailure,
+    userSuppliedOnSubmit = _a.onSubmit,
+    userSuppliedOnBeforeSubmit = _a.onBeforeSubmit,
+    userSuppliedOnBeforeLivenessCheck = _a.onBeforeLivenessCheck,
+    userSuppliedOnBeforeDocumentUpload = _a.onBeforeDocumentUpload,
+    userSuppliedOnDocumentUploadProgress = _a.onDocumentUploadProgress,
+    userSuppliedOnDocumentUploaded = _a.onDocumentUploaded,
+    userSuppliedOnDocumentUploadFailed = _a.onDocumentUploadFailed,
+    userSuppliedOnResponseReceived = _a.onResponseReceived,
+    userSuppliedOnRequestFailure = _a.onRequestFailure,
     clientRequestID = _a.clientRequestID;
   var sessionId = useAuthContext()[0].sessionId;
   var _x = React.useState(SubmissionStatus.READY),
@@ -1274,20 +1274,57 @@ var SubmissionProvider = function SubmissionProvider(_a) {
       setSelfieImage(dataUrlToBase64Sync(precapturedDocuments.selfie.imageData));
     }
   }, [precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie]);
+  var onSubmit = React.useRef();
+  React.useEffect(function () {
+    onSubmit.current = userSuppliedOnSubmit;
+  }, [userSuppliedOnSubmit]);
+  var onBeforeSubmit = React.useRef();
+  React.useEffect(function () {
+    onBeforeSubmit.current = userSuppliedOnBeforeSubmit;
+  }, [userSuppliedOnBeforeSubmit]);
+  var onBeforeLivenessCheck = React.useRef();
+  React.useEffect(function () {
+    onBeforeLivenessCheck.current = userSuppliedOnBeforeLivenessCheck;
+  }, [userSuppliedOnBeforeLivenessCheck]);
+  var onResponseReceived = React.useRef();
+  React.useEffect(function () {
+    onResponseReceived.current = userSuppliedOnResponseReceived;
+  }, [userSuppliedOnResponseReceived]);
+  var onRequestFailure = React.useRef();
+  React.useEffect(function () {
+    onRequestFailure.current = userSuppliedOnRequestFailure;
+  }, [userSuppliedOnRequestFailure]);
+  var onBeforeDocumentUpload = React.useRef();
+  React.useEffect(function () {
+    onBeforeDocumentUpload.current = userSuppliedOnBeforeDocumentUpload;
+  }, [userSuppliedOnBeforeDocumentUpload]);
+  var onDocumentUploadProgress = React.useRef();
+  React.useEffect(function () {
+    onDocumentUploadProgress.current = userSuppliedOnDocumentUploadProgress;
+  }, [userSuppliedOnDocumentUploadProgress]);
+  var onDocumentUploaded = React.useRef();
+  React.useEffect(function () {
+    onDocumentUploaded.current = userSuppliedOnDocumentUploaded;
+  }, [userSuppliedOnDocumentUploaded]);
+  var onDocumentUploadFailed = React.useRef();
+  React.useEffect(function () {
+    onDocumentUploadFailed.current = userSuppliedOnDocumentUploadFailed;
+  }, [userSuppliedOnDocumentUploadFailed]);
   var uploadDocument = React.useCallback(function (src, metadata) {
     return new Promise(function (resolve, reject) {
       return __awaiter(void 0, void 0, void 0, function () {
         var blob, _a, upload;
-        return __generator(this, function (_b) {
-          switch (_b.label) {
+        var _b;
+        return __generator(this, function (_c) {
+          switch (_c.label) {
             case 0:
               blob = typeof src === 'string' ? convertBase64ToBlob(src) : src;
-              _a = onBeforeDocumentUpload;
+              _a = onBeforeDocumentUpload.current;
               if (!_a) return [3 /*break*/, 2];
-              return [4 /*yield*/, onBeforeDocumentUpload === null || onBeforeDocumentUpload === void 0 ? void 0 : onBeforeDocumentUpload(blob, metadata)];
+              return [4 /*yield*/, (_b = onBeforeDocumentUpload.current) === null || _b === void 0 ? void 0 : _b.call(onBeforeDocumentUpload, blob, metadata)];
             case 1:
-              _a = _b.sent() === false;
-              _b.label = 2;
+              _a = _c.sent() === false;
+              _c.label = 2;
             case 2:
               if (_a) return [2 /*return*/, resolve(blobToB64(blob))];
               upload = createUpload(blob, {
@@ -1300,7 +1337,8 @@ var SubmissionProvider = function SubmissionProvider(_a) {
                   filetype: blob.type
                 },
                 onProgress: function onProgress(bytesUploaded, bytesTotal) {
-                  onDocumentUploadProgress === null || onDocumentUploadProgress === void 0 ? void 0 : onDocumentUploadProgress({
+                  var _a;
+                  (_a = onDocumentUploadProgress.current) === null || _a === void 0 ? void 0 : _a.call(onDocumentUploadProgress, {
                     bytesUploaded: bytesUploaded,
                     bytesTotal: bytesTotal,
                     percentage: (bytesUploaded / bytesTotal * 100).toFixed(2) + '%',
@@ -1308,14 +1346,15 @@ var SubmissionProvider = function SubmissionProvider(_a) {
                   });
                 },
                 onSuccess: function onSuccess() {
-                  var _a;
+                  var _a, _b;
                   var documentId = 'urn:documentsv1:' + ((_a = upload.url.split('/files/').pop()) === null || _a === void 0 ? void 0 : _a.split('+').shift());
-                  onDocumentUploaded === null || onDocumentUploaded === void 0 ? void 0 : onDocumentUploaded(documentId, metadata);
+                  (_b = onDocumentUploaded.current) === null || _b === void 0 ? void 0 : _b.call(onDocumentUploaded, documentId, metadata);
                   resolve(documentId);
                 },
                 onError: function onError(error) {
+                  var _a;
                   log('Failed because: ' + error);
-                  onDocumentUploadFailed === null || onDocumentUploadFailed === void 0 ? void 0 : onDocumentUploadFailed(error, metadata);
+                  (_a = onDocumentUploadFailed.current) === null || _a === void 0 ? void 0 : _a.call(onDocumentUploadFailed, error, metadata);
                   reject(error);
                 }
               });
@@ -1333,7 +1372,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
         });
       });
     });
-  }, [onBeforeDocumentUpload, documentServiceUrl, sessionId, onDocumentUploadProgress, onDocumentUploaded, onDocumentUploadFailed]);
+  }, [documentServiceUrl, sessionId]);
   var buildSubmissionPayload = React.useCallback(function () {
     return __awaiter(void 0, void 0, void 0, function () {
       function uploadIfPossible(src_1, filename_1) {
@@ -1529,8 +1568,8 @@ var SubmissionProvider = function SubmissionProvider(_a) {
               idBackCaptureAttempts: idBackCaptureAttempts,
               geolocationResult: geolocationResult
             });
-            if (!onBeforeSubmit) return [3 /*break*/, 10];
-            return [4 /*yield*/, onBeforeSubmit(submissionRequest)];
+            if (!onBeforeSubmit.current) return [3 /*break*/, 10];
+            return [4 /*yield*/, onBeforeSubmit.current(submissionRequest)];
           case 9:
             onBeforeSubmitResult = _h.sent();
             if (onBeforeSubmitResult) submissionRequest = onBeforeSubmitResult;
@@ -1540,13 +1579,13 @@ var SubmissionProvider = function SubmissionProvider(_a) {
         }
       });
     });
-  }, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idData, idFrontCaptureAttempts, idFrontImage, idImageResolutionCheck, manualReviewRequired, needImmediateResponse, onBeforeSubmit, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters]);
+  }, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idData, idFrontCaptureAttempts, idFrontImage, idImageResolutionCheck, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters]);
   var defaultOnSubmit = React.useCallback(function () {
     return __awaiter(void 0, void 0, void 0, function () {
       var submissionResponse_1, payload, host, endpoint, response, statusMessage, submissionResponse_2, e_1, err;
-      var _a;
-      return __generator(this, function (_b) {
-        switch (_b.label) {
+      var _a, _b, _c;
+      return __generator(this, function (_d) {
+        switch (_d.label) {
           case 0:
             if (action === SubmissionAction.NONE) {
               submissionResponse_1 = {
@@ -1560,12 +1599,12 @@ var SubmissionProvider = function SubmissionProvider(_a) {
               return [2 /*return*/, submissionResponse_1];
             }
             setSubmissionStatus(SubmissionStatus.SUBMITTING);
-            _b.label = 1;
+            _d.label = 1;
           case 1:
-            _b.trys.push([1, 7,, 8]);
+            _d.trys.push([1, 7,, 8]);
             return [4 /*yield*/, buildSubmissionPayload()];
           case 2:
-            payload = _b.sent();
+            payload = _d.sent();
             host = submissionUrl || determineSubmissionHost(environment);
             endpoint = determineSubmissionEndpoint(action, !!(idFrontImage || idBackImage || passportImage), !!selfieImage);
             return [4 /*yield*/, fetch(host + endpoint, {
@@ -1576,11 +1615,11 @@ var SubmissionProvider = function SubmissionProvider(_a) {
               throw new NetworkError(e.message);
             })];
           case 3:
-            response = _b.sent();
+            response = _d.sent();
             if (!(!response || !response.ok)) return [3 /*break*/, 5];
             return [4 /*yield*/, response === null || response === void 0 ? void 0 : response.text()];
           case 4:
-            statusMessage = _b.sent();
+            statusMessage = _d.sent();
             if (!statusMessage || statusMessage === 'Load failed') throw new NetworkError(statusMessage);
             throw new SubmissionError({
               statusCode: (_a = response === null || response === void 0 ? void 0 : response.statusText) !== null && _a !== void 0 ? _a : '???',
@@ -1589,16 +1628,17 @@ var SubmissionProvider = function SubmissionProvider(_a) {
           case 5:
             return [4 /*yield*/, response.json()];
           case 6:
-            submissionResponse_2 = _b.sent();
+            submissionResponse_2 = _d.sent();
             if (submissionResponse_2.status.statusCode !== '000') {
               throw new SubmissionError(submissionResponse_2.status);
             }
             setSubmissionRequest(payload);
             setSubmissionResponse(submissionResponse_2);
             setSubmissionStatus(SubmissionStatus.SUBMITTED);
+            (_b = onResponseReceived.current) === null || _b === void 0 ? void 0 : _b.call(onResponseReceived, submissionResponse_2, payload);
             return [2 /*return*/, submissionResponse_2];
           case 7:
-            e_1 = _b.sent();
+            e_1 = _d.sent();
             err = e_1;
             setSubmissionStatus(SubmissionStatus.FAILED);
             setSubmissionError(e_1 instanceof SubmissionError || e_1 instanceof NetworkError ? e_1 : err.message === 'Load failed' ? new NetworkError() : new SubmissionError({
@@ -1610,6 +1650,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
                 return null;
               } : defaultOnSubmit;
             });
+            (_c = onRequestFailure.current) === null || _c === void 0 ? void 0 : _c.call(onRequestFailure, err);
             throw err;
           case 8:
             return [2 /*return*/];
@@ -1617,35 +1658,25 @@ var SubmissionProvider = function SubmissionProvider(_a) {
       });
     });
   }, [action, buildSubmissionPayload, submissionUrl, environment, idFrontImage, idBackImage, passportImage, selfieImage, sessionId, sendBase64DocumentsInSwaggerProxy]);
-  React.useEffect(function () {
-    if (submissionRequest && submissionResponse) {
-      onResponseReceived === null || onResponseReceived === void 0 ? void 0 : onResponseReceived(submissionResponse, submissionRequest);
-    }
-  }, [onResponseReceived, submissionRequest, submissionResponse]);
-  React.useEffect(function () {
-    if (submissionError) {
-      onRequestFailure === null || onRequestFailure === void 0 ? void 0 : onRequestFailure(submissionError);
-    }
-  }, [onRequestFailure, submissionError]);
   var submit = React.useCallback(function () {
     return __awaiter(void 0, void 0, void 0, function () {
-      var _a;
-      return __generator(this, function (_b) {
-        switch (_b.label) {
+      var _a, _b;
+      return __generator(this, function (_c) {
+        switch (_c.label) {
           case 0:
-            if (!onSubmit) return [3 /*break*/, 2];
-            _a = onSubmit;
+            if (!onSubmit.current) return [3 /*break*/, 2];
+            _b = (_a = onSubmit).current;
             return [4 /*yield*/, buildSubmissionPayload()];
           case 1:
-            return [2 /*return*/, _a.apply(void 0, [_b.sent()])];
+            return [2 /*return*/, _b.apply(_a, [_c.sent()])];
           case 2:
             return [4 /*yield*/, defaultOnSubmit()];
           case 3:
-            return [2 /*return*/, _b.sent()];
+            return [2 /*return*/, _c.sent()];
         }
       });
     });
-  }, [buildSubmissionPayload, defaultOnSubmit, onSubmit]);
+  }, [buildSubmissionPayload, defaultOnSubmit]);
   var buildLivenessCheckPayload = React.useCallback(function (imageDataUrl) {
     return __awaiter(void 0, void 0, void 0, function () {
       var request, onBeforeLivenessCheckResult;
@@ -1688,8 +1719,8 @@ var SubmissionProvider = function SubmissionProvider(_a) {
               idBackCaptureAttempts: idBackCaptureAttempts,
               geolocationResult: geolocationResult
             });
-            if (!onBeforeLivenessCheck) return [3 /*break*/, 3];
-            return [4 /*yield*/, onBeforeLivenessCheck(request)];
+            if (!onBeforeLivenessCheck.current) return [3 /*break*/, 3];
+            return [4 /*yield*/, onBeforeLivenessCheck.current(request)];
           case 2:
             onBeforeLivenessCheckResult = _d.sent();
             if (onBeforeLivenessCheckResult) request = onBeforeLivenessCheckResult;
@@ -1700,17 +1731,18 @@ var SubmissionProvider = function SubmissionProvider(_a) {
         }
       });
     });
-  }, [clientRequestID, geolocationResult, idBackCaptureAttempts, idCardForFaceMatch, idFrontCaptureAttempts, onBeforeLivenessCheck, selfieCaptureAttempts, webhooksStripSpecialCharacters]);
+  }, [clientRequestID, geolocationResult, idBackCaptureAttempts, idCardForFaceMatch, idFrontCaptureAttempts, selfieCaptureAttempts, webhooksStripSpecialCharacters]);
   var checkLiveness = React.useCallback(function (imageDataUrl) {
     return __awaiter(void 0, void 0, void 0, function () {
       var request, host, endpoint, response, statusMessage, submissionResponse_3, e_2, err;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
           case 0:
-            _a.trys.push([0, 6,, 7]);
+            _b.trys.push([0, 6,, 7]);
             return [4 /*yield*/, buildLivenessCheckPayload(imageDataUrl)];
           case 1:
-            request = _a.sent();
+            request = _b.sent();
             host = submissionUrl || determineSubmissionHost(environment);
             endpoint = liveCheckEndpoint(!!idCardForFaceMatch);
             return [4 /*yield*/, fetch(host + endpoint, {
@@ -1721,11 +1753,11 @@ var SubmissionProvider = function SubmissionProvider(_a) {
               throw new NetworkError(e.message);
             })];
           case 2:
-            response = _a.sent();
+            response = _b.sent();
             if (!!response.ok) return [3 /*break*/, 4];
             return [4 /*yield*/, response.text()];
           case 3:
-            statusMessage = _a.sent();
+            statusMessage = _b.sent();
             if (!statusMessage || statusMessage === 'Load failed') throw new NetworkError(statusMessage);
             throw new SubmissionError({
               statusCode: response.statusText,
@@ -1734,14 +1766,14 @@ var SubmissionProvider = function SubmissionProvider(_a) {
           case 4:
             return [4 /*yield*/, response.json()];
           case 5:
-            submissionResponse_3 = _a.sent();
+            submissionResponse_3 = _b.sent();
             if (submissionResponse_3.status.statusCode !== '000') {
               throw new SubmissionError(submissionResponse_3.status);
             }
             setSubmissionResponse(submissionResponse_3);
             return [2 /*return*/, submissionResponse_3];
           case 6:
-            e_2 = _a.sent();
+            e_2 = _b.sent();
             err = e_2;
             setSubmissionStatus(SubmissionStatus.FAILED);
             setSubmissionError(e_2 instanceof SubmissionError || e_2 instanceof NetworkError ? e_2 : err.message === 'Load failed' ? new NetworkError() : new SubmissionError({
@@ -1754,6 +1786,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
                 return null;
               };
             });
+            (_a = onRequestFailure.current) === null || _a === void 0 ? void 0 : _a.call(onRequestFailure, err);
             throw err;
           case 7:
             return [2 /*return*/];
@@ -7889,7 +7922,7 @@ var StyledButtonsRow$a = styled__default.default(ButtonsRow$1)(templateObject_8$
   var _a, _b, _c, _d, _e, _f;
   return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarFontSize) ? "font-size: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.progressBarFontSize, ";") : '';
 });
-var LoadingListContainer$1 = styled__default.default.div(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n  display: flex;\n  position: relative;\n  z-index: 2;\n"], ["\n  display: flex;\n  position: relative;\n  z-index: 2;\n"])));
+var LoadingListContainer$1 = styled__default.default.div(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n  display: flex;\n  position: relative;\n  z-index: 2;\n"], ["\n  display: flex;\n  position: relative;\n  z-index: 2;\n"])));
 var LoadingList$1 = styled__default.default.ul(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n  display: block;\n  margin: auto;\n  list-style: none;\n  padding: 0;\n"], ["\n  display: block;\n  margin: auto;\n  list-style: none;\n  padding: 0;\n"])));
 var LoadingListItem$1 = styled__default.default.li(templateObject_11$1 || (templateObject_11$1 = __makeTemplateObject(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  padding: 2px 1.25rem 2px 0;\n  line-height: 1rem;\n\n  &::before {\n    content: '';\n    display: inline-block;\n    height: 1rem;\n    min-width: 1rem;\n    vertical-align: middle;\n    background-size: cover;\n    background-repeat: no-repeat;\n    margin: auto 0.5rem auto 0;\n  }\n\n  &.done::before {\n    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfNDlfMzg1KSI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMiAyNEMxOC42Mjc0IDI0IDI0IDE4LjYyNzQgMjQgMTJDMjQgNS4zNzI1OCAxOC42Mjc0IDAgMTIgMEM1LjM3MjU4IDAgMCA1LjM3MjU4IDAgMTJDMCAxOC42Mjc0IDUuMzcyNTggMjQgMTIgMjRaTTE5LjU2NDMgOC4yNzg1MkMxOS45NTQ5IDcuODg3OTkgMTkuOTU0OSA3LjI1NDgzIDE5LjU2NDMgNi44NjQzQzE5LjE3MzggNi40NzM3OCAxOC41NDA2IDYuNDczNzggMTguMTUwMSA2Ljg2NDNMOS40Mjg2NiAxNS41ODU4TDUuODUwMDUgMTIuMDA3MkM1LjQ1OTUzIDExLjYxNjYgNC44MjYzNiAxMS42MTY2IDQuNDM1ODQgMTIuMDA3MkM0LjA0NTMxIDEyLjM5NzcgNC4wNDUzMSAxMy4wMzA5IDQuNDM1ODQgMTMuNDIxNEw4LjcyMTU1IDE3LjcwNzFDOS4xMTIwOCAxOC4wOTc2IDkuNzQ1MjQgMTguMDk3NiAxMC4xMzU4IDE3LjcwNzFMMTkuNTY0MyA4LjI3ODUyWiIgZmlsbD0id2hpdGUiLz48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJjbGlwMF80OV8zODUiPjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=');\n  }\n\n  &.running::before {\n    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfNDlfMzcwKSI+PG1hc2sgaWQ9InBhdGgtMS1pbnNpZGUtMV80OV8zNzAiIGZpbGw9IndoaXRlIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMuNTE0NzIgMjAuNDg1NUM4LjIwMTAxIDI1LjE3MTggMTUuNzk5IDI1LjE3MTggMjAuNDg1MyAyMC40ODU1QzI1LjE3MTYgMTUuNzk5MiAyNS4xNzE2IDguMjAxMTkgMjAuNDg1MyAzLjUxNDlDMTUuNzk5IC0xLjE3MTM5IDguMjAxMDEgLTEuMTcxMzkgMy41MTQ3MiAzLjUxNDlDLTEuMTcxNTcgOC4yMDExOSAtMS4xNzE1NyAxNS43OTkyIDMuNTE0NzIgMjAuNDg1NVoiLz48L21hc2s+PHBhdGggZD0iTTYuMzk4MTQgMTEuNDU5QzUuODQ1ODYgMTEuNDU5IDUuMzk4MTQgMTEuOTA2NyA1LjM5ODE0IDEyLjQ1OUM1LjM5ODE0IDEzLjAxMTIgNS44NDU4NiAxMy40NTkgNi4zOTgxNCAxMy40NTlWMTEuNDU5Wk0xNy42MDE5IDEzLjQ1OUMxOC4xNTQxIDEzLjQ1OSAxOC42MDE5IDEzLjAxMTIgMTguNjAxOSAxMi40NTlDMTguNjAxOSAxMS45MDY3IDE4LjE1NDEgMTEuNDU5IDE3LjYwMTkgMTEuNDU5VjEzLjQ1OVpNNi4zOTgxNCAxMy40NTlIMTcuNjAxOVYxMS40NTlINi4zOTgxNFYxMy40NTlaTTMuNTE0NzIgMjAuNDg1NUw0LjkyODkzIDE5LjA3MTNMNC45Mjg5MyAxOS4wNzEzTDMuNTE0NzIgMjAuNDg1NVpNMjAuNDg1MyAzLjUxNDlMMTkuMDcxMSA0LjkyOTEyTDE5LjA3MTEgNC45MjkxMkwyMC40ODUzIDMuNTE0OVpNMy41MTQ3MiAzLjUxNDlMNC45Mjg5MyA0LjkyOTEyTDQuOTI4OTMgNC45MjkxMkwzLjUxNDcyIDMuNTE0OVpNMTkuMDcxMSAxOS4wNzEzQzE1LjE2NTggMjIuOTc2NSA4LjgzNDE3IDIyLjk3NjUgNC45Mjg5MyAxOS4wNzEzTDIuMTAwNTEgMjEuODk5N0M3LjU2Nzg0IDI3LjM2NyAxNi40MzIyIDI3LjM2NyAyMS44OTk1IDIxLjg5OTdMMTkuMDcxMSAxOS4wNzEzWk0xOS4wNzExIDQuOTI5MTJDMjIuOTc2MyA4LjgzNDM2IDIyLjk3NjMgMTUuMTY2IDE5LjA3MTEgMTkuMDcxM0wyMS44OTk1IDIxLjg5OTdDMjcuMzY2OCAxNi40MzIzIDI3LjM2NjggNy41NjgwMyAyMS44OTk1IDIuMTAwNjlMMTkuMDcxMSA0LjkyOTEyWk00LjkyODkzIDQuOTI5MTJDOC44MzQxNyAxLjAyMzg3IDE1LjE2NTggMS4wMjM4NyAxOS4wNzExIDQuOTI5MTJMMjEuODk5NSAyLjEwMDY5QzE2LjQzMjIgLTMuMzY2NjUgNy41Njc4NCAtMy4zNjY2NSAyLjEwMDUxIDIuMTAwNjlMNC45Mjg5MyA0LjkyOTEyWk00LjkyODkzIDE5LjA3MTNDMS4wMjM2OSAxNS4xNjYgMS4wMjM2OSA4LjgzNDM2IDQuOTI4OTMgNC45MjkxMkwyLjEwMDUxIDIuMTAwNjlDLTMuMzY2ODMgNy41NjgwMyAtMy4zNjY4MyAxNi40MzIzIDIuMTAwNTEgMjEuODk5N0w0LjkyODkzIDE5LjA3MTNaIiBmaWxsPSJ3aGl0ZSIgbWFzaz0idXJsKCNwYXRoLTEtaW5zaWRlLTFfNDlfMzcwKSIvPjwvZz48ZGVmcz48Y2xpcFBhdGggaWQ9ImNsaXAwXzQ5XzM3MCI+PHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiBmaWxsPSJ3aGl0ZSIvPjwvY2xpcFBhdGg+PC9kZWZzPjwvc3ZnPg==');\n  }\n"], ["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  padding: 2px 1.25rem 2px 0;\n  line-height: 1rem;\n\n  &::before {\n    content: '';\n    display: inline-block;\n    height: 1rem;\n    min-width: 1rem;\n    vertical-align: middle;\n    background-size: cover;\n    background-repeat: no-repeat;\n    margin: auto 0.5rem auto 0;\n  }\n\n  &.done::before {\n    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfNDlfMzg1KSI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMiAyNEMxOC42Mjc0IDI0IDI0IDE4LjYyNzQgMjQgMTJDMjQgNS4zNzI1OCAxOC42Mjc0IDAgMTIgMEM1LjM3MjU4IDAgMCA1LjM3MjU4IDAgMTJDMCAxOC42Mjc0IDUuMzcyNTggMjQgMTIgMjRaTTE5LjU2NDMgOC4yNzg1MkMxOS45NTQ5IDcuODg3OTkgMTkuOTU0OSA3LjI1NDgzIDE5LjU2NDMgNi44NjQzQzE5LjE3MzggNi40NzM3OCAxOC41NDA2IDYuNDczNzggMTguMTUwMSA2Ljg2NDNMOS40Mjg2NiAxNS41ODU4TDUuODUwMDUgMTIuMDA3MkM1LjQ1OTUzIDExLjYxNjYgNC44MjYzNiAxMS42MTY2IDQuNDM1ODQgMTIuMDA3MkM0LjA0NTMxIDEyLjM5NzcgNC4wNDUzMSAxMy4wMzA5IDQuNDM1ODQgMTMuNDIxNEw4LjcyMTU1IDE3LjcwNzFDOS4xMTIwOCAxOC4wOTc2IDkuNzQ1MjQgMTguMDk3NiAxMC4xMzU4IDE3LjcwNzFMMTkuNTY0MyA4LjI3ODUyWiIgZmlsbD0id2hpdGUiLz48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJjbGlwMF80OV8zODUiPjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=');\n  }\n\n  &.running::before {\n    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfNDlfMzcwKSI+PG1hc2sgaWQ9InBhdGgtMS1pbnNpZGUtMV80OV8zNzAiIGZpbGw9IndoaXRlIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMuNTE0NzIgMjAuNDg1NUM4LjIwMTAxIDI1LjE3MTggMTUuNzk5IDI1LjE3MTggMjAuNDg1MyAyMC40ODU1QzI1LjE3MTYgMTUuNzk5MiAyNS4xNzE2IDguMjAxMTkgMjAuNDg1MyAzLjUxNDlDMTUuNzk5IC0xLjE3MTM5IDguMjAxMDEgLTEuMTcxMzkgMy41MTQ3MiAzLjUxNDlDLTEuMTcxNTcgOC4yMDExOSAtMS4xNzE1NyAxNS43OTkyIDMuNTE0NzIgMjAuNDg1NVoiLz48L21hc2s+PHBhdGggZD0iTTYuMzk4MTQgMTEuNDU5QzUuODQ1ODYgMTEuNDU5IDUuMzk4MTQgMTEuOTA2NyA1LjM5ODE0IDEyLjQ1OUM1LjM5ODE0IDEzLjAxMTIgNS44NDU4NiAxMy40NTkgNi4zOTgxNCAxMy40NTlWMTEuNDU5Wk0xNy42MDE5IDEzLjQ1OUMxOC4xNTQxIDEzLjQ1OSAxOC42MDE5IDEzLjAxMTIgMTguNjAxOSAxMi40NTlDMTguNjAxOSAxMS45MDY3IDE4LjE1NDEgMTEuNDU5IDE3LjYwMTkgMTEuNDU5VjEzLjQ1OVpNNi4zOTgxNCAxMy40NTlIMTcuNjAxOVYxMS40NTlINi4zOTgxNFYxMy40NTlaTTMuNTE0NzIgMjAuNDg1NUw0LjkyODkzIDE5LjA3MTNMNC45Mjg5MyAxOS4wNzEzTDMuNTE0NzIgMjAuNDg1NVpNMjAuNDg1MyAzLjUxNDlMMTkuMDcxMSA0LjkyOTEyTDE5LjA3MTEgNC45MjkxMkwyMC40ODUzIDMuNTE0OVpNMy41MTQ3MiAzLjUxNDlMNC45Mjg5MyA0LjkyOTEyTDQuOTI4OTMgNC45MjkxMkwzLjUxNDcyIDMuNTE0OVpNMTkuMDcxMSAxOS4wNzEzQzE1LjE2NTggMjIuOTc2NSA4LjgzNDE3IDIyLjk3NjUgNC45Mjg5MyAxOS4wNzEzTDIuMTAwNTEgMjEuODk5N0M3LjU2Nzg0IDI3LjM2NyAxNi40MzIyIDI3LjM2NyAyMS44OTk1IDIxLjg5OTdMMTkuMDcxMSAxOS4wNzEzWk0xOS4wNzExIDQuOTI5MTJDMjIuOTc2MyA4LjgzNDM2IDIyLjk3NjMgMTUuMTY2IDE5LjA3MTEgMTkuMDcxM0wyMS44OTk1IDIxLjg5OTdDMjcuMzY2OCAxNi40MzIzIDI3LjM2NjggNy41NjgwMyAyMS44OTk1IDIuMTAwNjlMMTkuMDcxMSA0LjkyOTEyWk00LjkyODkzIDQuOTI5MTJDOC44MzQxNyAxLjAyMzg3IDE1LjE2NTggMS4wMjM4NyAxOS4wNzExIDQuOTI5MTJMMjEuODk5NSAyLjEwMDY5QzE2LjQzMjIgLTMuMzY2NjUgNy41Njc4NCAtMy4zNjY2NSAyLjEwMDUxIDIuMTAwNjlMNC45Mjg5MyA0LjkyOTEyWk00LjkyODkzIDE5LjA3MTNDMS4wMjM2OSAxNS4xNjYgMS4wMjM2OSA4LjgzNDM2IDQuOTI4OTMgNC45MjkxMkwyLjEwMDUxIDIuMTAwNjlDLTMuMzY2ODMgNy41NjgwMyAtMy4zNjY4MyAxNi40MzIzIDIuMTAwNTEgMjEuODk5N0w0LjkyODkzIDE5LjA3MTNaIiBmaWxsPSJ3aGl0ZSIgbWFzaz0idXJsKCNwYXRoLTEtaW5zaWRlLTFfNDlfMzcwKSIvPjwvZz48ZGVmcz48Y2xpcFBhdGggaWQ9ImNsaXAwXzQ5XzM3MCI+PHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiBmaWxsPSJ3aGl0ZSIvPjwvY2xpcFBhdGg+PC9kZWZzPjwvc3ZnPg==');\n  }\n"])));
 var ProgressContainer$1 = styled__default.default.div(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
@@ -7916,7 +7949,7 @@ var ContinueButton$1 = styled__default.default(LoaderButton)(templateObject_18 |
   var _a, _b, _c, _d, _e, _f;
   return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.continueBtnBorder) ? "border: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.continueBtnBorder, ";") : '';
 });
-var templateObject_1$x, templateObject_2$r, templateObject_3$m, templateObject_4$g, templateObject_5$b, templateObject_6$9, templateObject_7$7, templateObject_8$3, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16, templateObject_17, templateObject_18;
+var templateObject_1$x, templateObject_2$r, templateObject_3$m, templateObject_4$g, templateObject_5$b, templateObject_6$9, templateObject_7$7, templateObject_8$3, templateObject_9$3, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16, templateObject_17, templateObject_18;
 
 var ContinuityCameraCheckboxContainer = styled__default.default.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n  margin-top: 15px;\n  margin-bottom: 15px;\n"], ["\n  margin-top: 15px;\n  margin-bottom: 15px;\n"])));
 var ContinuityCameraCheckbox = styled__default.default.input(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n  margin-right: 8px;\n"], ["\n  margin-right: 8px;\n"])));
@@ -8134,7 +8167,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
     image: idCardFront,
     className: classNames.image,
     alt: verbiage.idCardFrontText
-  })), debugMode && ( /*#__PURE__*/React__namespace.default.createElement("pre", null, "Detection Score: ".concat(idCardFront.detectionScore, "\nFocus Score: ").concat(idCardFront.focusScore, "\nBounding Box: ").concat(JSON.stringify(idCardFront.boundingBox)))))), idCardBack && ( /*#__PURE__*/React__namespace.default.createElement(ImageCol$1, {
+  })), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugPre, null, "Detection Score: ".concat(idCardFront.detectionScore, "\nFocus Score: ").concat(idCardFront.focusScore, "\nBounding Box: ").concat(JSON.stringify(idCardFront.boundingBox)))))), idCardBack && ( /*#__PURE__*/React__namespace.default.createElement(ImageCol$1, {
     className: classNames.imageCol
   }, /*#__PURE__*/React__namespace.default.createElement(ImageHeading, {
     className: classNames.imageHeading
@@ -8144,7 +8177,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
     image: idCardBack,
     className: classNames.image,
     alt: verbiage.idCardBackText
-  })), debugMode && ( /*#__PURE__*/React__namespace.default.createElement("pre", null, "Detection Score: ".concat(idCardBack.detectionScore, "\nFocus Score: ").concat(idCardBack.focusScore, "\nBounding Box: ").concat(JSON.stringify(idCardBack.boundingBox)))))), passport && ( /*#__PURE__*/React__namespace.default.createElement(ImageCol$1, {
+  })), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugPre, null, "Detection Score: ".concat(idCardBack.detectionScore, "\nFocus Score: ").concat(idCardBack.focusScore, "\nBounding Box: ").concat(JSON.stringify(idCardBack.boundingBox)))))), passport && ( /*#__PURE__*/React__namespace.default.createElement(ImageCol$1, {
     className: classNames.imageCol
   }, /*#__PURE__*/React__namespace.default.createElement(ImageHeading, {
     className: classNames.imageHeading
@@ -8154,7 +8187,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
     image: passport,
     className: classNames.image,
     alt: verbiage.passportText
-  })), debugMode && ( /*#__PURE__*/React__namespace.default.createElement("pre", null, "Detection Score: ".concat(passport.detectionScore, "\nFocus Score: ").concat(passport.focusScore, "\nBounding Box: ").concat(JSON.stringify(passport.boundingBox)))))))), /*#__PURE__*/React__namespace.default.createElement(OverlayInstruction, {
+  })), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugPre, null, "Detection Score: ".concat(passport.detectionScore, "\nFocus Score: ").concat(passport.focusScore, "\nBounding Box: ").concat(JSON.stringify(passport.boundingBox)))))))), /*#__PURE__*/React__namespace.default.createElement(OverlayInstruction, {
     className: classNames.instruction
   }, verbiage.instructionText), /*#__PURE__*/React__namespace.default.createElement(ButtonsRow$1, {
     className: classNames.buttonsRow
@@ -8175,7 +8208,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
 };
 var Heading$a = styled__default.default.h1(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n  margin-bottom: 12px;\n"], ["\n  margin-bottom: 12px;\n"])));
 var ImagesContainer = styled__default.default(OverlayImageContainer)(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n  overflow-y: auto;\n"], ["\n  overflow-y: auto;\n"])));
-var ImageRow = styled__default.default(OverlayImageRow)(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n  flex-direction: column;\n"], ["\n  flex-direction: column;\n"])));
+var ImageRow = styled__default.default(OverlayImageRow)(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n  max-width: 100%;\n  flex-direction: column;\n"], ["\n  max-width: 100%;\n  flex-direction: column;\n"])));
 var ImageCol$1 = styled__default.default.div(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n  max-height: none !important;\n"], ["\n  max-height: none !important;\n"])));
 var ImageHeading = styled__default.default.h3(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n  text-align: left;\n  margin-top: 24px;\n  margin-bottom: 8px;\n  font-size: 16px;\n  font-weight: normal;\n"], ["\n  text-align: left;\n  margin-top: 24px;\n  margin-bottom: 8px;\n  font-size: 16px;\n  font-weight: normal;\n"])));
 var CapturedImageWrapper = styled__default.default.div(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n  border: 1px solid\n    ", ";\n  border-radius: 6px;\n  padding: 4px;\n  background: white;\n  display: flex;\n"], ["\n  border: 1px solid\n    ", ";\n  border-radius: 6px;\n  padding: 4px;\n  background: white;\n  display: flex;\n"])), function (props) {
@@ -8183,7 +8216,8 @@ var CapturedImageWrapper = styled__default.default.div(templateObject_7$6 || (te
   return (_c = (_b = (_a = props.theme.idCapture) === null || _a === void 0 ? void 0 : _a.success) === null || _b === void 0 ? void 0 : _b.imageBorderColor) !== null && _c !== void 0 ? _c : 'var(--idm-color-primary-400)';
 });
 var StyledImage = styled__default.default(CapturedDocumentImg)(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n  width: 100%;\n  border-radius: 4px;\n"], ["\n  width: 100%;\n  border-radius: 4px;\n"])));
-var templateObject_1$v, templateObject_2$p, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$8, templateObject_7$6, templateObject_8$2;
+var DebugPre = styled__default.default.pre(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n  text-align: left;\n  overflow-x: auto;\n"], ["\n  text-align: left;\n  overflow-x: auto;\n"])));
+var templateObject_1$v, templateObject_2$p, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$8, templateObject_7$6, templateObject_8$2, templateObject_9$2;
 
 function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
   var _this = this;