idmission-web-sdk 1.0.307 → 1.0.308

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import { ReactElement } from 'react';
2
- import { IdVideoCaptureGuidesAssets, IdVideoCaptureGuidesVerbiage } from './IdVideoCaptureGuides';
2
+ import { IdVideoCaptureGuidesAssets, IdVideoCaptureGuidesClassNames, IdVideoCaptureGuidesVerbiage } from './IdVideoCaptureGuides';
3
3
  import { CustomerSuppliedVerbiage } from '../../lib/locales';
4
4
  import { LoaderButtonColors } from '../common/LoaderButton';
5
5
  import { ReadTextPromptClassNames, ReadTextPromptVerbiage } from '../read_text_prompt/ReadTextPrompt';
@@ -10,6 +10,9 @@ export type IdVideoCaptureAssets = {
10
10
  export type IdVideoCaptureClassNames = {
11
11
  container?: string;
12
12
  cameraFeed?: string;
13
+ guides?: IdVideoCaptureGuidesClassNames;
14
+ guidanceMessageContainer?: string;
15
+ guidanceMessage?: string;
13
16
  readTextPrompt?: ReadTextPromptClassNames;
14
17
  captureBtn?: string;
15
18
  };
@@ -22,6 +25,7 @@ export type IdVideoCaptureVerbiage = {
22
25
  guides?: IdVideoCaptureGuidesVerbiage;
23
26
  readTextPrompt?: ReadTextPromptVerbiage;
24
27
  faceNotCenteredText?: CustomerSuppliedVerbiage;
28
+ searchingForIdCardText?: CustomerSuppliedVerbiage;
25
29
  captureBtnText?: CustomerSuppliedVerbiage;
26
30
  };
27
31
  export type IdVideoCaptureProps = {
@@ -5,6 +5,10 @@ export type IdVideoCaptureGuidesAssets = {
5
5
  frontImageUrl?: string;
6
6
  backImageUrl?: string;
7
7
  };
8
+ export type IdVideoCaptureGuidesClassNames = {
9
+ container?: string;
10
+ faceGuide?: string;
11
+ };
8
12
  export type IdVideoCaptureGuidesVerbiage = {
9
13
  idFrontInstructionText?: CustomerSuppliedVerbiage;
10
14
  idBackInstructionText?: CustomerSuppliedVerbiage;
@@ -18,6 +22,7 @@ export type IdVideoCaptureGuidesProps = {
18
22
  idCardGuideBorderWidth?: number;
19
23
  idCardGuideBorderColor?: string;
20
24
  assets?: IdVideoCaptureGuidesAssets;
25
+ classNames?: IdVideoCaptureGuidesClassNames;
21
26
  verbiage?: IdVideoCaptureGuidesVerbiage;
22
27
  };
23
- export declare const IdVideoCaptureGuides: ({ requestedAction, satisfied, faceGuideBorderWidth, faceGuideBorderColor, idCardGuideBorderWidth, idCardGuideBorderColor, assets, verbiage: rawVerbiage, }: IdVideoCaptureGuidesProps) => ReactElement;
28
+ export declare const IdVideoCaptureGuides: ({ requestedAction, satisfied, faceGuideBorderWidth, faceGuideBorderColor, idCardGuideBorderWidth, idCardGuideBorderColor, assets, classNames, verbiage: rawVerbiage, }: IdVideoCaptureGuidesProps) => ReactElement;
@@ -50,7 +50,7 @@ var LanguageDetector__default = /*#__PURE__*/_interopDefaultLegacy(LanguageDetec
50
50
  var i18n__default = /*#__PURE__*/_interopDefaultLegacy(i18n);
51
51
  var SignatureCanvas__default = /*#__PURE__*/_interopDefaultLegacy(SignatureCanvas);
52
52
 
53
- var webSdkVersion = '1.0.307';
53
+ var webSdkVersion = '1.0.308';
54
54
 
55
55
  function getPlatform() {
56
56
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -232,15 +232,15 @@ var OverlayContainer = styled__default['default'](PageContainer)(templateObject_
232
232
  }, function (props) {
233
233
  return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
234
234
  });
235
- var OverlayInner$2 = styled__default['default'].div(templateObject_2$q || (templateObject_2$q = tslib.__makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n max-height: var(--app-height);\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n max-height: var(--app-height);\n height: 100%;\n ", "\n"])), function (props) {
235
+ var OverlayInner$2 = styled__default['default'].div(templateObject_2$r || (templateObject_2$r = tslib.__makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n max-height: var(--app-height);\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n max-height: var(--app-height);\n height: 100%;\n ", "\n"])), function (props) {
236
236
  var _a;
237
237
  return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
238
238
  }, function (props) {
239
239
  return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
240
240
  });
241
- var OverlayImageContainer = styled__default['default'].div(templateObject_3$j || (templateObject_3$j = tslib.__makeTemplateObject(["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n max-width: var(--app-width);\n max-height: var(--app-height);\n overflow: hidden;\n\n & > img,\n & > svg {\n margin: 0 auto;\n width: max-content;\n max-width: 100%;\n max-height: 100%;\n aspect-ratio: initial;\n object-fit: contain;\n display: block;\n }\n"], ["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n max-width: var(--app-width);\n max-height: var(--app-height);\n overflow: hidden;\n\n & > img,\n & > svg {\n margin: 0 auto;\n width: max-content;\n max-width: 100%;\n max-height: 100%;\n aspect-ratio: initial;\n object-fit: contain;\n display: block;\n }\n"])));
241
+ var OverlayImageContainer = styled__default['default'].div(templateObject_3$k || (templateObject_3$k = tslib.__makeTemplateObject(["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n max-width: var(--app-width);\n max-height: var(--app-height);\n overflow: hidden;\n\n & > img,\n & > svg {\n margin: 0 auto;\n width: max-content;\n max-width: 100%;\n max-height: 100%;\n aspect-ratio: initial;\n object-fit: contain;\n display: block;\n }\n"], ["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n max-width: var(--app-width);\n max-height: var(--app-height);\n overflow: hidden;\n\n & > img,\n & > svg {\n margin: 0 auto;\n width: max-content;\n max-width: 100%;\n max-height: 100%;\n aspect-ratio: initial;\n object-fit: contain;\n display: block;\n }\n"])));
242
242
  var OverlayImageRow = styled__default['default'].div(templateObject_4$e || (templateObject_4$e = tslib.__makeTemplateObject(["\n display: flex;\n margin: auto;\n\n & > div {\n max-height: calc(100vh - 320px);\n\n & > img {\n width: 100%;\n max-height: 100%;\n height: auto;\n object-fit: contain;\n }\n }\n"], ["\n display: flex;\n margin: auto;\n\n & > div {\n max-height: calc(100vh - 320px);\n\n & > img {\n width: 100%;\n max-height: 100%;\n height: auto;\n object-fit: contain;\n }\n }\n"])));
243
- var templateObject_1$D, templateObject_2$q, templateObject_3$j, templateObject_4$e;
243
+ var templateObject_1$D, templateObject_2$r, templateObject_3$k, templateObject_4$e;
244
244
 
245
245
  var LoaderButton = function LoaderButton(_a) {
246
246
  var children = _a.children,
@@ -10043,11 +10043,11 @@ var useIdCaptureState = function useIdCaptureState() {
10043
10043
  };
10044
10044
 
10045
10045
  var DebugStatsPane = styled__default['default'].span(templateObject_1$A || (templateObject_1$A = tslib.__makeTemplateObject(["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1001;\n"], ["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1001;\n"])));
10046
- var ObjectDetectionDebugOverlayDiv = styled__default['default'].div(templateObject_2$p || (templateObject_2$p = tslib.__makeTemplateObject(["\n position: absolute;\n z-index: 1001;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n ", "\n"], ["\n position: absolute;\n z-index: 1001;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n ", "\n"])), function (_a) {
10046
+ var ObjectDetectionDebugOverlayDiv = styled__default['default'].div(templateObject_2$q || (templateObject_2$q = tslib.__makeTemplateObject(["\n position: absolute;\n z-index: 1001;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n ", "\n"], ["\n position: absolute;\n z-index: 1001;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n ", "\n"])), function (_a) {
10047
10047
  var $flipX = _a.$flipX;
10048
10048
  return $flipX ? 'transform: scaleX(-1);' : '';
10049
10049
  });
10050
- var ObjectDetectionDebugBox = styled__default['default'].div(templateObject_3$i || (templateObject_3$i = tslib.__makeTemplateObject(["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n"], ["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n"])), function (_a) {
10050
+ var ObjectDetectionDebugBox = styled__default['default'].div(templateObject_3$j || (templateObject_3$j = tslib.__makeTemplateObject(["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n"], ["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n"])), function (_a) {
10051
10051
  var $color = _a.$color;
10052
10052
  return $color !== null && $color !== void 0 ? $color : 'green';
10053
10053
  }, function (_a) {
@@ -10237,7 +10237,7 @@ function SelfieCaptureFaceKeypoint(_a) {
10237
10237
  }
10238
10238
  });
10239
10239
  }
10240
- var templateObject_1$A, templateObject_2$p, templateObject_3$i, templateObject_4$d;
10240
+ var templateObject_1$A, templateObject_2$q, templateObject_3$j, templateObject_4$d;
10241
10241
 
10242
10242
  var enTranslation = {};
10243
10243
 
@@ -10405,14 +10405,14 @@ var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
10405
10405
  if (!portalLocation) return element;
10406
10406
  return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
10407
10407
  };
10408
- var GuidanceMessage = styled__default['default'].div(templateObject_2$o || (templateObject_2$o = tslib.__makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n padding: 10px 12px 8px;\n border-radius: 8px;\n z-index: 10001;\n"], ["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n padding: 10px 12px 8px;\n border-radius: 8px;\n z-index: 10001;\n"])), function (props) {
10408
+ var GuidanceMessage = styled__default['default'].div(templateObject_2$p || (templateObject_2$p = tslib.__makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n padding: 10px 12px 8px;\n border-radius: 8px;\n z-index: 10001;\n"], ["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n padding: 10px 12px 8px;\n border-radius: 8px;\n z-index: 10001;\n"])), function (props) {
10409
10409
  var _a, _b, _c, _d, _e, _f;
10410
10410
  return (_f = (_a = props.$background) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.backgroundColor) !== null && _f !== void 0 ? _f : '#ccc';
10411
10411
  }, function (props) {
10412
10412
  var _a, _b, _c, _d, _e, _f;
10413
10413
  return (_f = (_a = props.$textColor) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.textColor) !== null && _f !== void 0 ? _f : 'black';
10414
10414
  });
10415
- var templateObject_1$z, templateObject_2$o;
10415
+ var templateObject_1$z, templateObject_2$p;
10416
10416
 
10417
10417
  var IdCapture = function IdCapture(_a) {
10418
10418
  var _b, _c, _d, _e, _f, _g, _h, _j, _k;
@@ -10765,10 +10765,10 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
10765
10765
  }, verbiage.retryBtnText)));
10766
10766
  };
10767
10767
  var StyledOverlayInner$2 = styled__default['default'](OverlayInner$2)(templateObject_1$y || (templateObject_1$y = tslib.__makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
10768
- var StyledOverlayImageContainer$2 = styled__default['default'](OverlayImageContainer)(templateObject_2$n || (templateObject_2$n = tslib.__makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
10769
- var Description$3 = styled__default['default'].p(templateObject_3$h || (templateObject_3$h = tslib.__makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
10768
+ var StyledOverlayImageContainer$2 = styled__default['default'](OverlayImageContainer)(templateObject_2$o || (templateObject_2$o = tslib.__makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
10769
+ var Description$3 = styled__default['default'].p(templateObject_3$i || (templateObject_3$i = tslib.__makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
10770
10770
  var RetryButton = styled__default['default'](LoaderButton)(templateObject_4$c || (templateObject_4$c = tslib.__makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
10771
- var templateObject_1$y, templateObject_2$n, templateObject_3$h, templateObject_4$c;
10771
+ var templateObject_1$y, templateObject_2$o, templateObject_3$i, templateObject_4$c;
10772
10772
 
10773
10773
  var ExitCaptureStyledButton = styled__default['default'].button(templateObject_1$x || (templateObject_1$x = tslib.__makeTemplateObject(["\n position: absolute;\n top: 12px;\n right: 12px;\n font-size: 20px;\n width: 32px;\n height: 32px;\n font-family: monospace;\n z-index: 1002;\n border: none;\n border-radius: 4px;\n background: #ccc;\n cursor: pointer;\n padding: 8px;\n box-sizing: border-box;\n display: flex;\n\n &:hover {\n background: #ddd;\n }\n\n & > svg {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n"], ["\n position: absolute;\n top: 12px;\n right: 12px;\n font-size: 20px;\n width: 32px;\n height: 32px;\n font-family: monospace;\n z-index: 1002;\n border: none;\n border-radius: 4px;\n background: #ccc;\n cursor: pointer;\n padding: 8px;\n box-sizing: border-box;\n display: flex;\n\n &:hover {\n background: #ddd;\n }\n\n & > svg {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n"])));
10774
10774
  var ExitCaptureButton = function ExitCaptureButton(_a) {
@@ -11459,13 +11459,13 @@ var OverlayInner$1 = styled__default['default'].div(templateObject_1$v || (templ
11459
11459
  var _a, _b, _c, _d;
11460
11460
  return (_d = (_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.textColor) !== null && _d !== void 0 ? _d : 'black';
11461
11461
  });
11462
- var OverlayHeader$1 = styled__default['default'].div(templateObject_2$m || (templateObject_2$m = tslib.__makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"])), function (props) {
11462
+ var OverlayHeader$1 = styled__default['default'].div(templateObject_2$n || (templateObject_2$n = tslib.__makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"])), function (props) {
11463
11463
  var _a;
11464
11464
  return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
11465
11465
  }, function (props) {
11466
11466
  return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
11467
11467
  });
11468
- var StyledGuidanceMessage$2 = styled__default['default'](GuidanceMessage)(templateObject_3$g || (templateObject_3$g = tslib.__makeTemplateObject(["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])));
11468
+ var StyledGuidanceMessage$2 = styled__default['default'](GuidanceMessage)(templateObject_3$h || (templateObject_3$h = tslib.__makeTemplateObject(["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])));
11469
11469
  var StyledOverlayImageContainer$1 = styled__default['default'](OverlayImageContainer)(templateObject_4$b || (templateObject_4$b = tslib.__makeTemplateObject(["\n padding: 0 0 100px;\n\n & > svg {\n height: 100%;\n }\n"], ["\n padding: 0 0 100px;\n\n & > svg {\n height: 100%;\n }\n"])));
11470
11470
  var ContinuityCameraCheckboxContainer$1 = styled__default['default'].div(templateObject_5$7 || (templateObject_5$7 = tslib.__makeTemplateObject(["\n position: fixed;\n bottom: 120px;\n width: 100dvw;\n display: flex;\n"], ["\n position: fixed;\n bottom: 120px;\n width: 100dvw;\n display: flex;\n"])));
11471
11471
  var ContinuityCameraCheckboxInner = styled__default['default'](GuidanceMessage)(templateObject_6$6 || (templateObject_6$6 = tslib.__makeTemplateObject(["\n padding: 12px 18px;\n margin: 0 auto;\n font-size: 14px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n padding: 12px 18px;\n margin: 0 auto;\n font-size: 14px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])));
@@ -11504,10 +11504,10 @@ var ContinueButton$1 = styled__default['default'](LoaderButton)(templateObject_1
11504
11504
  var _a, _b, _c, _d, _e, _f;
11505
11505
  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, ";") : '';
11506
11506
  });
11507
- var templateObject_1$v, templateObject_2$m, templateObject_3$g, templateObject_4$b, templateObject_5$7, templateObject_6$6, templateObject_7$4, templateObject_8$3, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16, templateObject_17, templateObject_18;
11507
+ var templateObject_1$v, templateObject_2$n, templateObject_3$h, templateObject_4$b, templateObject_5$7, templateObject_6$6, templateObject_7$4, templateObject_8$3, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16, templateObject_17, templateObject_18;
11508
11508
 
11509
11509
  var ContinuityCameraCheckboxContainer = styled__default['default'].div(templateObject_1$u || (templateObject_1$u = tslib.__makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
11510
- var ContinuityCameraCheckbox = styled__default['default'].input(templateObject_2$l || (templateObject_2$l = tslib.__makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
11510
+ var ContinuityCameraCheckbox = styled__default['default'].input(templateObject_2$m || (templateObject_2$m = tslib.__makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
11511
11511
  var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
11512
11512
  var _b, _c, _d, _e;
11513
11513
  var onDismissed = _a.onDismissed,
@@ -11618,7 +11618,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
11618
11618
  }
11619
11619
  }, cameraReady && modelsReady ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
11620
11620
  };
11621
- var templateObject_1$u, templateObject_2$l;
11621
+ var templateObject_1$u, templateObject_2$m;
11622
11622
 
11623
11623
  var components$1 = {
11624
11624
  "default": IdCaptureLoadingOverlayDefault,
@@ -11746,8 +11746,8 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
11746
11746
  finished: true
11747
11747
  }, submissionStatus === SubmissionStatus.SUBMITTING ? verbiage.submittingText : verbiage.submitText))));
11748
11748
  };
11749
- var Heading$9 = styled__default['default'].h1(templateObject_2$k || (templateObject_2$k = tslib.__makeTemplateObject(["\n margin-bottom: 12px;\n"], ["\n margin-bottom: 12px;\n"])));
11750
- var ImagesContainer = styled__default['default'](OverlayImageContainer)(templateObject_3$f || (templateObject_3$f = tslib.__makeTemplateObject(["\n overflow-y: auto;\n"], ["\n overflow-y: auto;\n"])));
11749
+ var Heading$9 = styled__default['default'].h1(templateObject_2$l || (templateObject_2$l = tslib.__makeTemplateObject(["\n margin-bottom: 12px;\n"], ["\n margin-bottom: 12px;\n"])));
11750
+ var ImagesContainer = styled__default['default'](OverlayImageContainer)(templateObject_3$g || (templateObject_3$g = tslib.__makeTemplateObject(["\n overflow-y: auto;\n"], ["\n overflow-y: auto;\n"])));
11751
11751
  var ImageRow = styled__default['default'](OverlayImageRow)(templateObject_4$a || (templateObject_4$a = tslib.__makeTemplateObject(["\n flex-direction: column;\n"], ["\n flex-direction: column;\n"])));
11752
11752
  var ImageCol$1 = styled__default['default'].div(templateObject_5$6 || (templateObject_5$6 = tslib.__makeTemplateObject(["\n max-height: none !important;\n"], ["\n max-height: none !important;\n"])));
11753
11753
  var ImageHeading = styled__default['default'].h3(templateObject_6$5 || (templateObject_6$5 = tslib.__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"])));
@@ -11756,7 +11756,7 @@ var CapturedImageWrapper = styled__default['default'].div(templateObject_7$3 ||
11756
11756
  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)';
11757
11757
  });
11758
11758
  var StyledImage = styled__default['default'](CapturedDocumentImg)(templateObject_8$2 || (templateObject_8$2 = tslib.__makeTemplateObject(["\n width: 100%;\n border-radius: 4px;\n"], ["\n width: 100%;\n border-radius: 4px;\n"])));
11759
- var templateObject_1$t, templateObject_2$k, templateObject_3$f, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$3, templateObject_8$2;
11759
+ var templateObject_1$t, templateObject_2$l, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$3, templateObject_8$2;
11760
11760
 
11761
11761
  var CameraVideoTag = function CameraVideoTag(_a) {
11762
11762
  var _b;
@@ -11863,8 +11863,8 @@ var GuideOrientationContext = /*#__PURE__*/React.createContext({
11863
11863
  });
11864
11864
 
11865
11865
  var StyledPageContainer = styled__default['default'](PageContainer)(templateObject_1$q || (templateObject_1$q = tslib.__makeTemplateObject(["\n z-index: 1000;\n"], ["\n z-index: 1000;\n"])));
11866
- var GuidesContainer = styled__default['default'].div(templateObject_2$j || (templateObject_2$j = tslib.__makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"])));
11867
- var GuideCenterRow = styled__default['default'].div(templateObject_3$e || (templateObject_3$e = tslib.__makeTemplateObject(["\n position: relative;\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-items: center;\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n"], ["\n position: relative;\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-items: center;\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n"])));
11866
+ var GuidesContainer = styled__default['default'].div(templateObject_2$k || (templateObject_2$k = tslib.__makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"])));
11867
+ var GuideCenterRow = styled__default['default'].div(templateObject_3$f || (templateObject_3$f = tslib.__makeTemplateObject(["\n position: relative;\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-items: center;\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n"], ["\n position: relative;\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-items: center;\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n"])));
11868
11868
  var GuideRegion = styled__default['default'].div(templateObject_4$9 || (templateObject_4$9 = tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: end;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n position: relative;\n z-index: 1000;\n background: ", ";\n color: ", ";\n text-align: center;\n ", "\n ", "\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: end;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n position: relative;\n z-index: 1000;\n background: ", ";\n color: ", ";\n text-align: center;\n ", "\n ", "\n"])), function (props) {
11869
11869
  var _a, _b, _c, _d, _e;
11870
11870
  return (_e = (_a = props.$maskColor) !== null && _a !== void 0 ? _a : (_d = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.idCapture) === null || _c === void 0 ? void 0 : _c.guideOverlay) === null || _d === void 0 ? void 0 : _d.backgroundColor) !== null && _e !== void 0 ? _e : 'rgba(0, 0, 0, 0.5)';
@@ -12014,14 +12014,14 @@ var regionClsx$1 = function regionClsx(classNames, which) {
12014
12014
  return v;
12015
12015
  }).join(' ');
12016
12016
  };
12017
- var templateObject_1$q, templateObject_2$j, templateObject_3$e, templateObject_4$9, templateObject_5$5, templateObject_6$4, templateObject_7$2, templateObject_8$1;
12017
+ var templateObject_1$q, templateObject_2$k, templateObject_3$f, templateObject_4$9, templateObject_5$5, templateObject_6$4, templateObject_7$2, templateObject_8$1;
12018
12018
 
12019
12019
  var FlippingImage = styled__default['default'](GuideImage$1)(templateObject_1$p || (templateObject_1$p = tslib.__makeTemplateObject(["\n backface-visibility: hidden;\n transform-style: preserve-3d;\n position: relative;\n top: 0;\n left: 0;\n transition: transform ", "s;\n transform: ", ";\n"], ["\n backface-visibility: hidden;\n transform-style: preserve-3d;\n position: relative;\n top: 0;\n left: 0;\n transition: transform ", "s;\n transform: ", ";\n"])), function (props) {
12020
12020
  return props.$transitionTime;
12021
12021
  }, function (props) {
12022
12022
  return props.$transforms;
12023
12023
  });
12024
- var FlippingImageBack = styled__default['default'](FlippingImage)(templateObject_2$i || (templateObject_2$i = tslib.__makeTemplateObject(["\n position: absolute;\n"], ["\n position: absolute;\n"])));
12024
+ var FlippingImageBack = styled__default['default'](FlippingImage)(templateObject_2$j || (templateObject_2$j = tslib.__makeTemplateObject(["\n position: absolute;\n"], ["\n position: absolute;\n"])));
12025
12025
  var FlipIdPrompt = function FlipIdPrompt(_a) {
12026
12026
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
12027
12027
  var userSuppliedPadding = _a.padding,
@@ -12162,7 +12162,7 @@ var regionClsx = function regionClsx(classNames, which) {
12162
12162
  return v;
12163
12163
  }).join(' ');
12164
12164
  };
12165
- var templateObject_1$p, templateObject_2$i;
12165
+ var templateObject_1$p, templateObject_2$j;
12166
12166
 
12167
12167
  var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
12168
12168
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
@@ -12301,8 +12301,8 @@ var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
12301
12301
  var CanvasWrapper$1 = styled__default['default'].div(templateObject_1$o || (templateObject_1$o = tslib.__makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n z-index: -1;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n z-index: -1;\n"])), function (props) {
12302
12302
  return props.$maskColor;
12303
12303
  });
12304
- var Canvas$1 = styled__default['default'].canvas(templateObject_2$h || (templateObject_2$h = tslib.__makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
12305
- var templateObject_1$o, templateObject_2$h;
12304
+ var Canvas$1 = styled__default['default'].canvas(templateObject_2$i || (templateObject_2$i = tslib.__makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
12305
+ var templateObject_1$o, templateObject_2$i;
12306
12306
 
12307
12307
  function IdCaptureGuides(_a) {
12308
12308
  var _b, _c;
@@ -12471,10 +12471,10 @@ var SelfieProgressPreview = function SelfieProgressPreview(_a) {
12471
12471
  })));
12472
12472
  };
12473
12473
  var StyledSpinner = styled__default['default'](Spinner)(templateObject_1$m || (templateObject_1$m = tslib.__makeTemplateObject(["\n position: relative;\n top: 4px;\n left: -3px;\n margin: 0 3px 0 -12px;\n"], ["\n position: relative;\n top: 4px;\n left: -3px;\n margin: 0 3px 0 -12px;\n"])));
12474
- var ImagePreviewWrapper = styled__default['default'].div(templateObject_2$g || (templateObject_2$g = tslib.__makeTemplateObject(["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"], ["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"])));
12475
- var ImagePreviewText = styled__default['default'].div(templateObject_3$d || (templateObject_3$d = tslib.__makeTemplateObject(["\n display: block;\n position: absolute;\n top: -32px;\n font:\n 14px -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Helvetica,\n Arial,\n sans-serif,\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol';\n color: white;\n text-align: center;\n margin: 0 auto;\n width: 100%;\n"], ["\n display: block;\n position: absolute;\n top: -32px;\n font:\n 14px -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Helvetica,\n Arial,\n sans-serif,\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol';\n color: white;\n text-align: center;\n margin: 0 auto;\n width: 100%;\n"])));
12474
+ var ImagePreviewWrapper = styled__default['default'].div(templateObject_2$h || (templateObject_2$h = tslib.__makeTemplateObject(["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"], ["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"])));
12475
+ var ImagePreviewText = styled__default['default'].div(templateObject_3$e || (templateObject_3$e = tslib.__makeTemplateObject(["\n display: block;\n position: absolute;\n top: -32px;\n font:\n 14px -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Helvetica,\n Arial,\n sans-serif,\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol';\n color: white;\n text-align: center;\n margin: 0 auto;\n width: 100%;\n"], ["\n display: block;\n position: absolute;\n top: -32px;\n font:\n 14px -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Helvetica,\n Arial,\n sans-serif,\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol';\n color: white;\n text-align: center;\n margin: 0 auto;\n width: 100%;\n"])));
12476
12476
  var ImagePreviewImageWrapper = styled__default['default'].div(templateObject_4$8 || (templateObject_4$8 = tslib.__makeTemplateObject(["\n position: relative;\n height: calc(100% - 8px);\n padding: 4px;\n border-radius: 4px;\n background: white;\n\n & > img {\n border-radius: 4px;\n width: auto;\n max-height: 100%;\n }\n"], ["\n position: relative;\n height: calc(100% - 8px);\n padding: 4px;\n border-radius: 4px;\n background: white;\n\n & > img {\n border-radius: 4px;\n width: auto;\n max-height: 100%;\n }\n"])));
12477
- var templateObject_1$m, templateObject_2$g, templateObject_3$d, templateObject_4$8;
12477
+ var templateObject_1$m, templateObject_2$h, templateObject_3$e, templateObject_4$8;
12478
12478
 
12479
12479
  var documentCaptureInitialState = {
12480
12480
  documents: [],
@@ -12818,8 +12818,8 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
12818
12818
  var CanvasWrapper = styled__default['default'].div(templateObject_1$l || (templateObject_1$l = tslib.__makeTemplateObject(["\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n"], ["\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n"])), function (props) {
12819
12819
  return props.$maskColor;
12820
12820
  });
12821
- var Canvas = styled__default['default'].canvas(templateObject_2$f || (templateObject_2$f = tslib.__makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
12822
- var templateObject_1$l, templateObject_2$f;
12821
+ var Canvas = styled__default['default'].canvas(templateObject_2$g || (templateObject_2$g = tslib.__makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
12822
+ var templateObject_1$l, templateObject_2$g;
12823
12823
 
12824
12824
  var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
12825
12825
  var _b, _c, _d, _e, _f;
@@ -12952,10 +12952,10 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
12952
12952
  }, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
12953
12953
  };
12954
12954
  var CaptureContainer = styled__default['default'].div(templateObject_1$k || (templateObject_1$k = tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: var(--app-height);\n"], ["\n display: flex;\n flex-direction: column;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: var(--app-height);\n"])));
12955
- var HeadingRow = styled__default['default'].div(templateObject_2$e || (templateObject_2$e = tslib.__makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
12955
+ var HeadingRow = styled__default['default'].div(templateObject_2$f || (templateObject_2$f = tslib.__makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
12956
12956
  return props.$maskColor;
12957
12957
  });
12958
- var Heading$8 = styled__default['default'].h1(templateObject_3$c || (templateObject_3$c = tslib.__makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
12958
+ var Heading$8 = styled__default['default'].h1(templateObject_3$d || (templateObject_3$d = tslib.__makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
12959
12959
  var FooterRow = styled__default['default'].div(templateObject_4$7 || (templateObject_4$7 = tslib.__makeTemplateObject(["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"], ["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"])), function (props) {
12960
12960
  return props.$maskColor;
12961
12961
  });
@@ -12965,7 +12965,7 @@ var Instructions = styled__default['default'].div(templateObject_5$4 || (templat
12965
12965
  });
12966
12966
  var StyledButtonsRow$9 = styled__default['default'](ButtonsRow)(templateObject_6$3 || (templateObject_6$3 = tslib.__makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
12967
12967
  var PreviewImage = styled__default['default'].img(templateObject_7$1 || (templateObject_7$1 = tslib.__makeTemplateObject(["\n width: 100%;\n height: 100%;\n object-fit: cover;\n"], ["\n width: 100%;\n height: 100%;\n object-fit: cover;\n"])));
12968
- var templateObject_1$k, templateObject_2$e, templateObject_3$c, templateObject_4$7, templateObject_5$4, templateObject_6$3, templateObject_7$1;
12968
+ var templateObject_1$k, templateObject_2$f, templateObject_3$d, templateObject_4$7, templateObject_5$4, templateObject_6$3, templateObject_7$1;
12969
12969
 
12970
12970
  var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
12971
12971
  var onSuccess = _a.onSuccess,
@@ -13121,12 +13121,12 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
13121
13121
  }, verbiage.doneBtnText))))));
13122
13122
  };
13123
13123
  var StyledOverlayInner$1 = styled__default['default'](OverlayInner$2)(templateObject_1$j || (templateObject_1$j = tslib.__makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
13124
- var Heading$7 = styled__default['default'].h3(templateObject_2$d || (templateObject_2$d = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13125
- var Description$2 = styled__default['default'].p(templateObject_3$b || (templateObject_3$b = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13124
+ var Heading$7 = styled__default['default'].h3(templateObject_2$e || (templateObject_2$e = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13125
+ var Description$2 = styled__default['default'].p(templateObject_3$c || (templateObject_3$c = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13126
13126
  var Instruction = styled__default['default'].p(templateObject_4$6 || (templateObject_4$6 = tslib.__makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
13127
13127
  var ImageCol = styled__default['default'].div(templateObject_5$3 || (templateObject_5$3 = tslib.__makeTemplateObject(["\n display: flex;\n justify-content: center;\n flex-grow: 1;\n flex-basis: 0;\n"], ["\n display: flex;\n justify-content: center;\n flex-grow: 1;\n flex-basis: 0;\n"])));
13128
13128
  var StyledButtonsRow$8 = styled__default['default'](ButtonsRow)(templateObject_6$2 || (templateObject_6$2 = tslib.__makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
13129
- var templateObject_1$j, templateObject_2$d, templateObject_3$b, templateObject_4$6, templateObject_5$3, templateObject_6$2;
13129
+ var templateObject_1$j, templateObject_2$e, templateObject_3$c, templateObject_4$6, templateObject_5$3, templateObject_6$2;
13130
13130
 
13131
13131
  var IdCaptureWizard = function IdCaptureWizard(_a) {
13132
13132
  var _b, _c, _d, _e, _f, _g;
@@ -13451,7 +13451,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
13451
13451
  };
13452
13452
 
13453
13453
  var FaceCaptureGuideContainer = styled__default['default'].div(templateObject_1$i || (templateObject_1$i = tslib.__makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n width: 100%;\n height: 100%;\n display: flex;\n"], ["\n position: absolute;\n z-index: 1000;\n width: 100%;\n height: 100%;\n display: flex;\n"])));
13454
- var FaceCaptureGuideOval = styled__default['default'].div(templateObject_2$c || (templateObject_2$c = tslib.__makeTemplateObject(["\n border-width: ", "px;\n border-color: ", ";\n border-style: solid;\n border-radius: 50%;\n aspect-ratio: 1 / 1.618;\n height: 50%;\n margin: auto;\n"], ["\n border-width: ", "px;\n border-color: ", ";\n border-style: solid;\n border-radius: 50%;\n aspect-ratio: 1 / 1.618;\n height: 50%;\n margin: auto;\n"])), function (props) {
13454
+ var FaceCaptureGuideOval = styled__default['default'].div(templateObject_2$d || (templateObject_2$d = tslib.__makeTemplateObject(["\n border-width: ", "px;\n border-color: ", ";\n border-style: solid;\n border-radius: 50%;\n aspect-ratio: 1 / 1.618;\n height: 50%;\n margin: auto;\n"], ["\n border-width: ", "px;\n border-color: ", ";\n border-style: solid;\n border-radius: 50%;\n aspect-ratio: 1 / 1.618;\n height: 50%;\n margin: auto;\n"])), function (props) {
13455
13455
  return props.$borderWidth;
13456
13456
  }, function (props) {
13457
13457
  var _a, _b, _c, _d;
@@ -13474,7 +13474,7 @@ var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
13474
13474
  "$borderColor": borderColor
13475
13475
  }));
13476
13476
  };
13477
- var templateObject_1$i, templateObject_2$c;
13477
+ var templateObject_1$i, templateObject_2$d;
13478
13478
 
13479
13479
  var useTimeout = function useTimeout(durationMs, onTimeout, timeoutAverted, shouldWaitLonger, shouldStart) {
13480
13480
  if (shouldStart === void 0) {
@@ -13616,11 +13616,11 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
13616
13616
  }, loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
13617
13617
  };
13618
13618
  var StyledOverlayInner = styled__default['default'](OverlayInner$2)(templateObject_1$h || (templateObject_1$h = tslib.__makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
13619
- var Heading$6 = styled__default['default'].h3(templateObject_2$b || (templateObject_2$b = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13620
- var Description$1 = styled__default['default'].p(templateObject_3$a || (templateObject_3$a = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13619
+ var Heading$6 = styled__default['default'].h3(templateObject_2$c || (templateObject_2$c = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13620
+ var Description$1 = styled__default['default'].p(templateObject_3$b || (templateObject_3$b = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
13621
13621
  var ImageContainer$5 = styled__default['default'](OverlayImageContainer)(templateObject_4$5 || (templateObject_4$5 = tslib.__makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
13622
13622
  var StyledButtonsRow$7 = styled__default['default'](ButtonsRow)(templateObject_5$2 || (templateObject_5$2 = tslib.__makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
13623
- var templateObject_1$h, templateObject_2$b, templateObject_3$a, templateObject_4$5, templateObject_5$2;
13623
+ var templateObject_1$h, templateObject_2$c, templateObject_3$b, templateObject_4$5, templateObject_5$2;
13624
13624
 
13625
13625
  var initialState$3 = {
13626
13626
  videoWidth: 0,
@@ -14281,8 +14281,8 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
14281
14281
  }, cameraReady && modelsReady ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
14282
14282
  };
14283
14283
  var StyledGuidanceMessage$1 = styled__default['default'](GuidanceMessage)(templateObject_1$e || (templateObject_1$e = tslib.__makeTemplateObject(["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"], ["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"])));
14284
- var StyledButtonsRow$6 = styled__default['default'](ButtonsRow)(templateObject_2$a || (templateObject_2$a = tslib.__makeTemplateObject(["\n flex-direction: column;\n padding-top: 25px;\n"], ["\n flex-direction: column;\n padding-top: 25px;\n"])));
14285
- var templateObject_1$e, templateObject_2$a;
14284
+ var StyledButtonsRow$6 = styled__default['default'](ButtonsRow)(templateObject_2$b || (templateObject_2$b = tslib.__makeTemplateObject(["\n flex-direction: column;\n padding-top: 25px;\n"], ["\n flex-direction: column;\n padding-top: 25px;\n"])));
14285
+ var templateObject_1$e, templateObject_2$b;
14286
14286
 
14287
14287
  function SelfieCaptureLoadingGraphic(_a) {
14288
14288
  var _b, _c, _d;
@@ -14658,13 +14658,13 @@ var OverlayInner = styled__default['default'].div(templateObject_1$d || (templat
14658
14658
  var _a, _b, _c, _d;
14659
14659
  return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.textColor) !== null && _d !== void 0 ? _d : 'black';
14660
14660
  });
14661
- var OverlayHeader = styled__default['default'].div(templateObject_2$9 || (templateObject_2$9 = tslib.__makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"])), function (props) {
14661
+ var OverlayHeader = styled__default['default'].div(templateObject_2$a || (templateObject_2$a = tslib.__makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"])), function (props) {
14662
14662
  var _a;
14663
14663
  return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
14664
14664
  }, function (props) {
14665
14665
  return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
14666
14666
  });
14667
- var StyledGuidanceMessage = styled__default['default'](GuidanceMessage)(templateObject_3$9 || (templateObject_3$9 = tslib.__makeTemplateObject(["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])));
14667
+ var StyledGuidanceMessage = styled__default['default'](GuidanceMessage)(templateObject_3$a || (templateObject_3$a = tslib.__makeTemplateObject(["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])));
14668
14668
  var StyledButtonsRow$5 = styled__default['default'](ButtonsRow)(templateObject_4$4 || (templateObject_4$4 = tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n height: 100px;\n color: ", ";\n ", "\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100dvw;\n box-sizing: border-box;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n height: 100px;\n color: ", ";\n ", "\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100dvw;\n box-sizing: border-box;\n"])), function (props) {
14669
14669
  var _a, _b, _c, _d;
14670
14670
  return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarTextColor) !== null && _d !== void 0 ? _d : 'white';
@@ -14700,7 +14700,7 @@ var ContinueButton = styled__default['default'](LoaderButton)(templateObject_15
14700
14700
  var _a, _b, _c, _d, _e, _f;
14701
14701
  return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === 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.selfieCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.continueBtnBorder, ";") : '';
14702
14702
  });
14703
- var templateObject_1$d, templateObject_2$9, templateObject_3$9, templateObject_4$4, templateObject_5$1, templateObject_6$1, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
14703
+ var templateObject_1$d, templateObject_2$a, templateObject_3$a, templateObject_4$4, templateObject_5$1, templateObject_6$1, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
14704
14704
 
14705
14705
  var components = {
14706
14706
  "default": SelfieCaptureLoadingOverlayDefault,
@@ -15047,10 +15047,10 @@ var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
15047
15047
  }, verbiage.captureBtnText)))));
15048
15048
  };
15049
15049
  var Inner = styled__default['default'](OverlayInner$2)(templateObject_1$c || (templateObject_1$c = tslib.__makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
15050
- var Heading$4 = styled__default['default'].h3(templateObject_2$8 || (templateObject_2$8 = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
15051
- var Description = styled__default['default'].p(templateObject_3$8 || (templateObject_3$8 = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
15050
+ var Heading$4 = styled__default['default'].h3(templateObject_2$9 || (templateObject_2$9 = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
15051
+ var Description = styled__default['default'].p(templateObject_3$9 || (templateObject_3$9 = tslib.__makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
15052
15052
  var StyledButtonsRow$4 = styled__default['default'](ButtonsRow)(templateObject_4$3 || (templateObject_4$3 = tslib.__makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
15053
- var templateObject_1$c, templateObject_2$8, templateObject_3$8, templateObject_4$3;
15053
+ var templateObject_1$c, templateObject_2$9, templateObject_3$9, templateObject_4$3;
15054
15054
 
15055
15055
  var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
15056
15056
  var documents = _a.documents,
@@ -15143,8 +15143,8 @@ var SignaturePaperBacking = styled__default['default'].div(templateObject_1$b ||
15143
15143
  var _a, _b;
15144
15144
  return ((_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.backgroundPosition) ? "background-position: ".concat((_b = props.theme.signatureCapture) === null || _b === void 0 ? void 0 : _b.backgroundPosition, ";") : "";
15145
15145
  });
15146
- var SignatureCanvasContainer = styled__default['default'].div(templateObject_2$7 || (templateObject_2$7 = tslib.__makeTemplateObject(["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"], ["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"])));
15147
- var SignaturePad = styled__default['default'].div(templateObject_3$7 || (templateObject_3$7 = tslib.__makeTemplateObject(["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n"], ["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n"])), function (props) {
15146
+ var SignatureCanvasContainer = styled__default['default'].div(templateObject_2$8 || (templateObject_2$8 = tslib.__makeTemplateObject(["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"], ["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"])));
15147
+ var SignaturePad = styled__default['default'].div(templateObject_3$8 || (templateObject_3$8 = tslib.__makeTemplateObject(["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n"], ["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n"])), function (props) {
15148
15148
  var _a, _b, _c;
15149
15149
  return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.background) !== null && _c !== void 0 ? _c : 'rgba(255, 255, 255, 0.5)';
15150
15150
  }, function (props) {
@@ -15155,7 +15155,7 @@ var SignaturePad = styled__default['default'].div(templateObject_3$7 || (templat
15155
15155
  return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.borderRadius) !== null && _c !== void 0 ? _c : '16px';
15156
15156
  });
15157
15157
  var SignatureButtonsContainer = styled__default['default'](ButtonsRow)(templateObject_4$2 || (templateObject_4$2 = tslib.__makeTemplateObject(["\n flex-grow: 0;\n padding-top: 12px;\n display: flex;\n z-index: 1000;\n position: relative;\n"], ["\n flex-grow: 0;\n padding-top: 12px;\n display: flex;\n z-index: 1000;\n position: relative;\n"])));
15158
- var templateObject_1$b, templateObject_2$7, templateObject_3$7, templateObject_4$2;
15158
+ var templateObject_1$b, templateObject_2$8, templateObject_3$8, templateObject_4$2;
15159
15159
 
15160
15160
  var SignatureCapture = function SignatureCapture(_a) {
15161
15161
  var _b;
@@ -15849,16 +15849,18 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
15849
15849
  idCardGuideBorderColor = _a.idCardGuideBorderColor,
15850
15850
  _w = _a.assets,
15851
15851
  assets = _w === void 0 ? {} : _w,
15852
- _x = _a.verbiage,
15853
- rawVerbiage = _x === void 0 ? {} : _x;
15852
+ _x = _a.classNames,
15853
+ classNames = _x === void 0 ? {} : _x,
15854
+ _y = _a.verbiage,
15855
+ rawVerbiage = _y === void 0 ? {} : _y;
15854
15856
  var cameraRef = React.useContext(CameraStateContext).cameraRef;
15855
15857
  var imageRef = React.useRef(null);
15856
- var _y = React.useState(0),
15857
- imageWidth = _y[0],
15858
- setImageWidth = _y[1];
15859
15858
  var _z = React.useState(0),
15860
- imageHeight = _z[0],
15861
- setImageHeight = _z[1];
15859
+ imageWidth = _z[0],
15860
+ setImageWidth = _z[1];
15861
+ var _0 = React.useState(0),
15862
+ imageHeight = _0[0],
15863
+ setImageHeight = _0[1];
15862
15864
  assets.frontImageUrl || (assets.frontImageUrl = "".concat(DEFAULT_CDN_URL, "/Shieldout-IDCard-Front-SVG-Landscape-2.svg"));
15863
15865
  assets.backImageUrl || (assets.backImageUrl = "".concat(DEFAULT_CDN_URL, "/Shieldout-IDCard-Back-SVG-Landscape-2.svg"));
15864
15866
  var verbiage = useTranslations(rawVerbiage, {
@@ -15872,25 +15874,12 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
15872
15874
  if (faceGuideBorderColor === undefined) faceGuideBorderColor = (_j = satisfied ? (_f = (_e = theme.idVideoCapture) === null || _e === void 0 ? void 0 : _e.faceGuides) === null || _f === void 0 ? void 0 : _f.satisfiedColor : (_h = (_g = theme.idVideoCapture) === null || _g === void 0 ? void 0 : _g.faceGuides) === null || _h === void 0 ? void 0 : _h.unsatisfiedColor) !== null && _j !== void 0 ? _j : 'white';
15873
15875
  if (idCardGuideBorderWidth === undefined) idCardGuideBorderWidth = (_m = (_l = (_k = theme.idVideoCapture) === null || _k === void 0 ? void 0 : _k.idCardGuides) === null || _l === void 0 ? void 0 : _l.borderWidth) !== null && _m !== void 0 ? _m : 4;
15874
15876
  if (idCardGuideBorderColor === undefined) idCardGuideBorderColor = (_s = satisfied ? (_p = (_o = theme.idVideoCapture) === null || _o === void 0 ? void 0 : _o.idCardGuides) === null || _p === void 0 ? void 0 : _p.satisfiedColor : (_r = (_q = theme.idVideoCapture) === null || _q === void 0 ? void 0 : _q.idCardGuides) === null || _r === void 0 ? void 0 : _r.unsatisfiedColor) !== null && _s !== void 0 ? _s : 'white';
15875
- return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", {
15876
- style: {
15877
- position: 'absolute',
15878
- zIndex: 1000,
15879
- width: '100%',
15880
- height: '100%',
15881
- display: 'flex',
15882
- flexDirection: 'column'
15883
- }
15884
- }, /*#__PURE__*/React__default['default'].createElement("div", {
15885
- style: {
15886
- borderWidth: faceGuideBorderWidth,
15887
- borderColor: faceGuideBorderColor,
15888
- borderStyle: 'solid',
15889
- borderRadius: '50%',
15890
- aspectRatio: '1 / 1.618',
15891
- height: '100%',
15892
- margin: '4% auto auto'
15893
- }
15877
+ return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Container, {
15878
+ className: classNames.container
15879
+ }, /*#__PURE__*/React__default['default'].createElement(FaceGuide, {
15880
+ className: classNames.faceGuide,
15881
+ "$borderWidth": faceGuideBorderWidth,
15882
+ "$borderColor": faceGuideBorderColor
15894
15883
  }), requestedAction === 'FLIP_ID' ? ( /*#__PURE__*/React__default['default'].createElement(IdVideoCaptureFlipIdPrompt, {
15895
15884
  assets: assets,
15896
15885
  verbiage: {
@@ -15962,10 +15951,18 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
15962
15951
  }
15963
15952
  }, instructionText))))));
15964
15953
  };
15965
- var GuideImage = styled__default['default'].img(templateObject_1$7 || (templateObject_1$7 = tslib.__makeTemplateObject(["\n width: 100%;\n ", "\n"], ["\n width: 100%;\n ", "\n"])), function (props) {
15954
+ var Container = styled__default['default'].div(templateObject_1$7 || (templateObject_1$7 = tslib.__makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n"], ["\n position: absolute;\n z-index: 1000;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n"])));
15955
+ var FaceGuide = styled__default['default'].div(templateObject_2$7 || (templateObject_2$7 = tslib.__makeTemplateObject(["\n border-width: ", "px;\n border-color: ", ";\n border-style: solid;\n border-radius: 50%;\n aspect-ratio: 1 / 1.618;\n height: 100%;\n margin: 4% auto auto;\n"], ["\n border-width: ", "px;\n border-color: ", ";\n border-style: solid;\n border-radius: 50%;\n aspect-ratio: 1 / 1.618;\n height: 100%;\n margin: 4% auto auto;\n"])), function (props) {
15956
+ var _a;
15957
+ return (_a = props.$borderWidth) !== null && _a !== void 0 ? _a : 0;
15958
+ }, function (props) {
15959
+ var _a;
15960
+ return (_a = props.$borderColor) !== null && _a !== void 0 ? _a : 'white';
15961
+ });
15962
+ var GuideImage = styled__default['default'].img(templateObject_3$7 || (templateObject_3$7 = tslib.__makeTemplateObject(["\n width: 100%;\n ", "\n"], ["\n width: 100%;\n ", "\n"])), function (props) {
15966
15963
  return props.$isMirrored ? 'transform: scaleX(-1);' : '';
15967
15964
  });
15968
- var templateObject_1$7;
15965
+ var templateObject_1$7, templateObject_2$7, templateObject_3$7;
15969
15966
 
15970
15967
  var ReadTextPrompt = function ReadTextPrompt(_a) {
15971
15968
  var text = _a.text,
@@ -16295,7 +16292,6 @@ var IdVideoCapture = function IdVideoCapture(_a) {
16295
16292
  React.useEffect(function () {
16296
16293
  if (!countdownStartedAt) return;
16297
16294
  var remainingTime = new Date().getTime() + captureCountdownSeconds * 1000.0 - countdownStartedAt.getTime();
16298
- console.log('setting timer for', remainingTime);
16299
16295
  var timeout = setTimeout(captureFrame, remainingTime);
16300
16296
  return function () {
16301
16297
  clearTimeout(timeout);
@@ -16324,10 +16320,12 @@ var IdVideoCapture = function IdVideoCapture(_a) {
16324
16320
  var theme = styled.useTheme();
16325
16321
  var _25 = useTranslations(rawVerbiage, {
16326
16322
  faceNotCenteredText: 'Please move your face to the center...',
16323
+ searchingForIdCardText: 'Searching for ID card...',
16327
16324
  captureBtnText: 'Capture'
16328
16325
  }),
16329
16326
  captureBtnText = _25.captureBtnText,
16330
- faceNotCenteredText = _25.faceNotCenteredText;
16327
+ faceNotCenteredText = _25.faceNotCenteredText,
16328
+ searchingForIdCardText = _25.searchingForIdCardText;
16331
16329
  var debugScalingDetails = useDebugScalingDetails({
16332
16330
  enabled: debugMode,
16333
16331
  pageWidth: width,
@@ -16337,6 +16335,8 @@ var IdVideoCapture = function IdVideoCapture(_a) {
16337
16335
  });
16338
16336
  var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK'].includes(requestedAction);
16339
16337
  var countdownRemaining = !!countdownStartedAt && Math.max(0, captureCountdownSeconds - Math.floor((new Date().getTime() - countdownStartedAt.getTime()) / 1000.0));
16338
+ var searchingForIdCard = idCaptureModelsEnabled && capturingId && !goodFramesThresholdMet;
16339
+ var guidanceText = !faceCentered ? faceNotCenteredText : searchingForIdCard ? searchingForIdCardText : undefined;
16340
16340
  return /*#__PURE__*/React__default['default'].createElement(PageContainer, {
16341
16341
  ref: ref,
16342
16342
  className: "flex ".concat((_l = classNames.container) !== null && _l !== void 0 ? _l : '')
@@ -16349,6 +16349,7 @@ var IdVideoCapture = function IdVideoCapture(_a) {
16349
16349
  onComplete: stopRecording
16350
16350
  })) : ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(IdVideoCaptureGuides, {
16351
16351
  assets: assets.guides,
16352
+ classNames: classNames.guides,
16352
16353
  verbiage: rawVerbiage.guides,
16353
16354
  requestedAction: requestedAction,
16354
16355
  satisfied: satisfied,
@@ -16371,10 +16372,13 @@ var IdVideoCapture = function IdVideoCapture(_a) {
16371
16372
  face: face,
16372
16373
  scaling: debugScalingDetails
16373
16374
  });
16374
- })))))), !faceCentered && ( /*#__PURE__*/React__default['default'].createElement(GuidanceMessageContainer, null, /*#__PURE__*/React__default['default'].createElement(GuidanceMessage, {
16375
+ })))))), guidanceText && ( /*#__PURE__*/React__default['default'].createElement(GuidanceMessageContainer, {
16376
+ className: classNames.guidanceMessageContainer
16377
+ }, /*#__PURE__*/React__default['default'].createElement(GuidanceMessage, {
16378
+ className: classNames.guidanceMessage,
16375
16379
  "$background": (_q = (_p = (_o = theme.guidanceMessages) === null || _o === void 0 ? void 0 : _o.negative) === null || _p === void 0 ? void 0 : _p.backgroundColor) !== null && _q !== void 0 ? _q : 'red',
16376
16380
  "$textColor": (_t = (_s = (_r = theme.guidanceMessages) === null || _r === void 0 ? void 0 : _r.negative) === null || _s === void 0 ? void 0 : _s.textColor) !== null && _t !== void 0 ? _t : 'white'
16377
- }, faceNotCenteredText))), debugMode && ( /*#__PURE__*/React__default['default'].createElement(DebugStatsPane, null, cameraRef.current ? ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, "\u2705 Camera: ", cameraRef.current.label, " (", cameraRef.current.width, "x", cameraRef.current.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__default['default'].createElement("br", null), isRecording ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__default['default'].createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__default['default'].createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__default['default'].createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__default['default'].createElement("br", null), "Best Frame Detection Score: ", bestFrameDetectionScore, /*#__PURE__*/React__default['default'].createElement("br", null), "Best Frame Focus Score: ", bestFrameFocusScore)), countdownRemaining && capturingId && ( /*#__PURE__*/React__default['default'].createElement(CountdownContainer, null, /*#__PURE__*/React__default['default'].createElement(Countdown, null, countdownRemaining))), (!idCaptureModelsEnabled || modelError) && capturingId && ( /*#__PURE__*/React__default['default'].createElement(CaptureButtonContainer, null, /*#__PURE__*/React__default['default'].createElement(CaptureButton, {
16381
+ }, guidanceText))), debugMode && ( /*#__PURE__*/React__default['default'].createElement(DebugStatsPane, null, cameraRef.current ? ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, "\u2705 Camera: ", cameraRef.current.label, " (", cameraRef.current.width, "x", cameraRef.current.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__default['default'].createElement("br", null), isRecording ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__default['default'].createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__default['default'].createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__default['default'].createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__default['default'].createElement("br", null), "Best Frame Detection Score: ", bestFrameDetectionScore, /*#__PURE__*/React__default['default'].createElement("br", null), "Best Frame Focus Score: ", bestFrameFocusScore)), countdownRemaining && capturingId && ( /*#__PURE__*/React__default['default'].createElement(CountdownContainer, null, /*#__PURE__*/React__default['default'].createElement(Countdown, null, countdownRemaining))), (!idCaptureModelsEnabled || modelError) && capturingId && ( /*#__PURE__*/React__default['default'].createElement(CaptureButtonContainer, null, /*#__PURE__*/React__default['default'].createElement(CaptureButton, {
16378
16382
  finished: true,
16379
16383
  onClick: function onClick() {
16380
16384
  return setCountdownStartedAt(new Date());