idmission-web-sdk 2.2.34 → 2.2.35
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.
- package/dist/components/camera/CameraVideoTag.d.ts.map +1 -1
- package/dist/components/common/debug.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureGuideOverlay.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureGuidesCommon.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureLoadingGraphic.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCaptureLoadingGraphic.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCapture.d.ts +1 -1
- package/dist/components/video_id/IdVideoCapture.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCaptureWizard.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +518 -328
- package/dist/sdk2.cjs.development.js.map +1 -1
- package/dist/sdk2.cjs.production.js +1 -1
- package/dist/sdk2.cjs.production.js.map +1 -1
- package/dist/sdk2.esm.js +518 -328
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +518 -328
- package/dist/sdk2.umd.development.js.map +1 -1
- package/dist/sdk2.umd.production.js +1 -1
- package/dist/sdk2.umd.production.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +3 -3
|
@@ -211,7 +211,7 @@
|
|
|
211
211
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
212
212
|
};
|
|
213
213
|
|
|
214
|
-
var webSdkVersion = '2.2.
|
|
214
|
+
var webSdkVersion = '2.2.35';
|
|
215
215
|
|
|
216
216
|
function getPlatform() {
|
|
217
217
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -372,7 +372,7 @@
|
|
|
372
372
|
});
|
|
373
373
|
}
|
|
374
374
|
|
|
375
|
-
var PageContainerDiv = styled.div(templateObject_1$
|
|
375
|
+
var PageContainerDiv = styled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n ", "\n\n ", "\n\n &.flex {\n display: flex;\n }\n\n &.padded {\n box-sizing: border-box;\n padding: 16px 24px;\n }\n"], ["\n ", "\n\n ", "\n\n &.flex {\n display: flex;\n }\n\n &.padded {\n box-sizing: border-box;\n padding: 16px 24px;\n }\n"])), function (props) {
|
|
376
376
|
var _a;
|
|
377
377
|
return props.theme.isFullscreen === false ? "" : "\n position: fixed;\n top: 0;\n left: 0;\n width: var(--app-width);\n height: calc(\n var(--app-height) - ".concat((_a = props.$heightOffset) !== null && _a !== void 0 ? _a : 0, "px\n );\n overflow-x: hidden;\n overflow-y: auto;\n ");
|
|
378
378
|
}, function (props) {
|
|
@@ -412,7 +412,7 @@
|
|
|
412
412
|
}, dimensionsCalculated && children);
|
|
413
413
|
});
|
|
414
414
|
PageContainer.displayName = 'PageContainer';
|
|
415
|
-
var templateObject_1$
|
|
415
|
+
var templateObject_1$L;
|
|
416
416
|
|
|
417
417
|
var LoaderButton = function LoaderButton(_a) {
|
|
418
418
|
var children = _a.children,
|
|
@@ -471,30 +471,30 @@
|
|
|
471
471
|
className: "ladda-label"
|
|
472
472
|
}, children));
|
|
473
473
|
};
|
|
474
|
-
var StyledButton = styled.button(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"], ["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"])), function (props) {
|
|
474
|
+
var StyledButton = styled.button(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"], ["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"])), function (props) {
|
|
475
475
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
476
476
|
return ((_a = props.theme.buttons) === null || _a === void 0 ? void 0 : _a.style) === 'bootstrap' && "\n border-radius: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n text-transform: none;\n -webkit-appearance: button;\n \n &:not(:disabled),\n &[type='button']:not(:disabled),\n &[type='reset']:not(:disabled),\n &[type='submit']:not(:disabled) {\n cursor: pointer;\n }\n \n &:focus:not(:focus-visible) {\n outline: 0;\n }\n \n --bs-btn-padding-x: 0.75rem;\n --bs-btn-padding-y: 0.375rem;\n --bs-btn-font-family: ;\n --bs-btn-font-size: 1rem;\n --bs-btn-font-weight: 400;\n --bs-btn-line-height: 1.5;\n --bs-btn-color: var(--bs-body-color);\n --bs-btn-bg: transparent;\n --bs-btn-border-width: var(--bs-border-width);\n --bs-btn-border-color: transparent;\n --bs-btn-border-radius: var(--bs-border-radius);\n --bs-btn-hover-border-color: transparent;\n --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15),\n 0 1px 1px rgba(0, 0, 0, 0.075);\n --bs-btn-disabled-opacity: 0.65;\n --bs-btn-focus-box-shadow: 0 0 0 0.25rem\n rgba(var(--bs-btn-focus-shadow-rgb), 0.5);\n display: inline-block;\n padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);\n font-family: var(--bs-btn-font-family);\n font-size: var(--bs-btn-font-size);\n font-weight: var(--bs-btn-font-weight);\n line-height: var(--bs-btn-line-height);\n color: var(--bs-btn-color);\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);\n border-radius: var(--bs-btn-border-radius);\n background-color: var(--bs-btn-bg);\n //transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,\n // border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n \n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n \n &:hover {\n filter: brightness(1.15);\n }\n \n &:focus-visible {\n color: var(--bs-btn-hover-color);\n background-color: var(--bs-btn-hover-bg);\n border-color: var(--bs-btn-hover-border-color);\n outline: 0;\n box-shadow: var(--bs-btn-focus-box-shadow);\n }\n \n &:disabled,\n &.disabled,\n fieldset:disabled & {\n color: var(--bs-btn-disabled-color);\n pointer-events: none;\n background-color: var(--bs-btn-disabled-bg);\n border-color: var(--bs-btn-disabled-border-color);\n opacity: var(--bs-btn-disabled-opacity);\n }\n \n --bs-btn-color: ".concat((_f = (_b = props.$textColor) !== null && _b !== void 0 ? _b : (_e = (_c = props.theme.buttons) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'primary']) === null || _e === void 0 ? void 0 : _e.textColor) !== null && _f !== void 0 ? _f : '#fff', ";\n --bs-btn-bg: ").concat((_l = (_g = props.$backgroundColor) !== null && _g !== void 0 ? _g : (_k = (_h = props.theme.buttons) === null || _h === void 0 ? void 0 : _h[(_j = props.$variant) !== null && _j !== void 0 ? _j : 'primary']) === null || _k === void 0 ? void 0 : _k.backgroundColor) !== null && _l !== void 0 ? _l : '#0d6efd', ";\n --bs-btn-border-color: var(--bs-btn-bg);\n --bs-btn-focus-shadow-rgb: 49, 132, 253;\n --bs-btn-active-color: #fff;\n --bs-btn-active-bg: #0a58ca;\n --bs-btn-active-border-color: #0a53be;\n --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);\n --bs-btn-disabled-color: ").concat((_q = (_m = props.$disabledTextColor) !== null && _m !== void 0 ? _m : (_p = (_o = props.theme.buttons) === null || _o === void 0 ? void 0 : _o.loading) === null || _p === void 0 ? void 0 : _p.textColor) !== null && _q !== void 0 ? _q : '#fff', ";\n --bs-btn-disabled-bg: ").concat((_u = (_r = props.$disabledBackgroundColor) !== null && _r !== void 0 ? _r : (_t = (_s = props.theme.buttons) === null || _s === void 0 ? void 0 : _s.loading) === null || _t === void 0 ? void 0 : _t.backgroundColor) !== null && _u !== void 0 ? _u : 'gray', ";\n --bs-btn-disabled-border-color: ").concat((_v = props.$disabledBackgroundColor) !== null && _v !== void 0 ? _v : '#0d6efd', ";\n \n --bs-btn-padding-y: 14px;\n --bs-btn-padding-x: 1rem;\n --bs-btn-font-size: 18px;\n --bs-btn-border-radius: 4px;\n ");
|
|
477
477
|
});
|
|
478
|
-
var templateObject_1$
|
|
478
|
+
var templateObject_1$K;
|
|
479
479
|
|
|
480
|
-
var OverlayContainer = styled(PageContainer)(templateObject_1$
|
|
480
|
+
var OverlayContainer = styled(PageContainer)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n background: ", ";\n ", "\n z-index: 10000;\n"], ["\n background: ", ";\n ", "\n z-index: 10000;\n"])), function (props) {
|
|
481
481
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
482
482
|
}, function (props) {
|
|
483
483
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
484
484
|
});
|
|
485
|
-
var OverlayInner$2 = styled.div(templateObject_2$
|
|
485
|
+
var OverlayInner$2 = styled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n max-width: 100dvw;\n max-height: 100dvh;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n max-width: 100dvw;\n max-height: 100dvh;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) {
|
|
486
486
|
var _a;
|
|
487
487
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
488
488
|
}, function (props) {
|
|
489
489
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
490
490
|
});
|
|
491
|
-
var OverlayImageContainer = styled.div(templateObject_3$
|
|
492
|
-
var OverlayImageRow = styled.div(templateObject_4$
|
|
493
|
-
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$
|
|
494
|
-
var ButtonsColumn = styled.div(templateObject_6$
|
|
495
|
-
var WideButton = styled(LoaderButton)(templateObject_7$
|
|
491
|
+
var OverlayImageContainer = styled.div(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n max-width: 100dvw;\n max-height: 100dvh;\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: 100dvw;\n max-height: 100dvh;\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"])));
|
|
492
|
+
var OverlayImageRow = styled.div(templateObject_4$l || (templateObject_4$l = __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"])));
|
|
493
|
+
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
494
|
+
var ButtonsColumn = styled.div(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 15px 0;\n justify-content: center;\n margin-top: 24px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 15px 0;\n justify-content: center;\n margin-top: 24px;\n"])));
|
|
495
|
+
var WideButton = styled(LoaderButton)(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n width: 100%;\n border-radius: 30px;\n"], ["\n width: 100%;\n border-radius: 30px;\n"])));
|
|
496
496
|
var WideBorderButton = styled(WideButton)(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n color: black;\n background: white;\n border: 1px solid var(--idm-color-secondary-500);\n box-sizing: border-box;\n"], ["\n color: black;\n background: white;\n border: 1px solid var(--idm-color-secondary-500);\n box-sizing: border-box;\n"])));
|
|
497
|
-
var templateObject_1$
|
|
497
|
+
var templateObject_1$J, templateObject_2$A, templateObject_3$r, templateObject_4$l, templateObject_5$c, templateObject_6$9, templateObject_7$6, templateObject_8$3;
|
|
498
498
|
|
|
499
499
|
function _extends() {
|
|
500
500
|
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
@@ -1049,13 +1049,13 @@
|
|
|
1049
1049
|
}, retryText)))));
|
|
1050
1050
|
};
|
|
1051
1051
|
|
|
1052
|
-
var wavesAnimation = styled.keyframes(templateObject_1$
|
|
1053
|
-
var progressBarAnimation = styled.keyframes(templateObject_2$
|
|
1054
|
-
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$
|
|
1055
|
-
var progressBorderAnimation = styled.keyframes(templateObject_4$
|
|
1056
|
-
var templateObject_1$
|
|
1052
|
+
var wavesAnimation = styled.keyframes(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"], ["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"])));
|
|
1053
|
+
var progressBarAnimation = styled.keyframes(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"], ["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"])));
|
|
1054
|
+
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"], ["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"])));
|
|
1055
|
+
var progressBorderAnimation = styled.keyframes(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
1056
|
+
var templateObject_1$I, templateObject_2$z, templateObject_3$q, templateObject_4$k;
|
|
1057
1057
|
|
|
1058
|
-
var Spinner$1 = styled.div(templateObject_1$
|
|
1058
|
+
var Spinner$1 = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n display: inline-block;\n width: ", "px;\n height: ", "px;\n margin: auto;\n\n &:after {\n content: ' ';\n display: block;\n width: ", "px;\n height: ", "px;\n margin: 8px;\n border-radius: 50%;\n border: ", "px solid\n ", ";\n border-color: ", " transparent\n ", " transparent;\n animation: ", " 1.2s linear infinite;\n box-sizing: content-box;\n }\n"], ["\n display: inline-block;\n width: ", "px;\n height: ", "px;\n margin: auto;\n\n &:after {\n content: ' ';\n display: block;\n width: ", "px;\n height: ", "px;\n margin: 8px;\n border-radius: 50%;\n border: ", "px solid\n ", ";\n border-color: ", " transparent\n ", " transparent;\n animation: ", " 1.2s linear infinite;\n box-sizing: content-box;\n }\n"])), function (_a) {
|
|
1059
1059
|
var $size = _a.$size;
|
|
1060
1060
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
1061
1061
|
}, function (_a) {
|
|
@@ -1080,7 +1080,7 @@
|
|
|
1080
1080
|
var $color = _a.$color;
|
|
1081
1081
|
return $color !== null && $color !== void 0 ? $color : '#888';
|
|
1082
1082
|
}, dualRingSpinnerAnimation);
|
|
1083
|
-
var templateObject_1$
|
|
1083
|
+
var templateObject_1$H;
|
|
1084
1084
|
|
|
1085
1085
|
exports.defaultAuthUrl = 'https://portal-api.idmission.com';
|
|
1086
1086
|
var allowedAuthUrls = ['https://portal-api.idmission.com', 'https://portal-api-uat.idmission.com', 'https://portal-api-demo.idmission.com', 'https://portal-api-dev.idmission.com', 'http://localhost:10000'];
|
|
@@ -3051,7 +3051,7 @@
|
|
|
3051
3051
|
return [frameWidth, frameHeight];
|
|
3052
3052
|
}
|
|
3053
3053
|
|
|
3054
|
-
var InvisibleCanvas = styled.canvas(templateObject_1$
|
|
3054
|
+
var InvisibleCanvas = styled.canvas(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
3055
3055
|
function drawToCanvas(canvas, frame, width, height) {
|
|
3056
3056
|
if (!canvas) return;
|
|
3057
3057
|
var ctx = canvas.getContext('2d');
|
|
@@ -3071,7 +3071,7 @@
|
|
|
3071
3071
|
var _a;
|
|
3072
3072
|
(_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas === null || canvas === void 0 ? void 0 : canvas.width, canvas === null || canvas === void 0 ? void 0 : canvas.height);
|
|
3073
3073
|
}
|
|
3074
|
-
var templateObject_1$
|
|
3074
|
+
var templateObject_1$G;
|
|
3075
3075
|
|
|
3076
3076
|
function listAvailableCameras(facingMode_1) {
|
|
3077
3077
|
return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
|
|
@@ -10809,12 +10809,12 @@
|
|
|
10809
10809
|
if (!portalLocation) return element;
|
|
10810
10810
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
10811
10811
|
}
|
|
10812
|
-
var DebugStatsPaneDiv = styled.span(templateObject_1$
|
|
10813
|
-
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$
|
|
10812
|
+
var DebugStatsPaneDiv = styled.span(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n margin-right: 20px;\n padding: 8px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10002;\n"], ["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n margin-right: 20px;\n padding: 8px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10002;\n"])));
|
|
10813
|
+
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$y || (templateObject_2$y = __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 transform-style: preserve-3d;\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 transform-style: preserve-3d;\n"])), function (_a) {
|
|
10814
10814
|
var $flipX = _a.$flipX;
|
|
10815
10815
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
10816
10816
|
});
|
|
10817
|
-
var ObjectDetectionDebugBox = styled.div(templateObject_3$
|
|
10817
|
+
var ObjectDetectionDebugBox = styled.div(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n transform-style: preserve-3d;\n"], ["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n transform-style: preserve-3d;\n"])), function (_a) {
|
|
10818
10818
|
var $color = _a.$color;
|
|
10819
10819
|
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
10820
10820
|
}, function (_a) {
|
|
@@ -10824,7 +10824,7 @@
|
|
|
10824
10824
|
var $flipX = _a.$flipX;
|
|
10825
10825
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
10826
10826
|
});
|
|
10827
|
-
var FaceDetectionKeypointMarker = styled.div(templateObject_4$
|
|
10827
|
+
var FaceDetectionKeypointMarker = styled.div(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n position: absolute;\n width: 4px;\n height: 4px;\n border: 2px solid ", ";\n font: 10px monospace;\n color: ", ";\n border-radius: 50%;\n ", "\n transform-style: preserve-3d;\n"], ["\n position: absolute;\n width: 4px;\n height: 4px;\n border: 2px solid ", ";\n font: 10px monospace;\n color: ", ";\n border-radius: 50%;\n ", "\n transform-style: preserve-3d;\n"])), function (_a) {
|
|
10828
10828
|
var $color = _a.$color;
|
|
10829
10829
|
return $color !== null && $color !== void 0 ? $color : 'red';
|
|
10830
10830
|
}, function (_a) {
|
|
@@ -11015,7 +11015,7 @@
|
|
|
11015
11015
|
}
|
|
11016
11016
|
});
|
|
11017
11017
|
}
|
|
11018
|
-
var templateObject_1$
|
|
11018
|
+
var templateObject_1$F, templateObject_2$y, templateObject_3$p, templateObject_4$j;
|
|
11019
11019
|
|
|
11020
11020
|
var enTranslation = {};
|
|
11021
11021
|
|
|
@@ -13982,7 +13982,7 @@
|
|
|
13982
13982
|
}, [fallbacks, i18n.language, t, verbiage]);
|
|
13983
13983
|
}
|
|
13984
13984
|
|
|
13985
|
-
var GuidanceMessageContainerDiv = styled.div(templateObject_1$
|
|
13985
|
+
var GuidanceMessageContainerDiv = styled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"])), function (_a) {
|
|
13986
13986
|
var $top = _a.$top;
|
|
13987
13987
|
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
13988
13988
|
}, function (_a) {
|
|
@@ -13995,14 +13995,14 @@
|
|
|
13995
13995
|
if (!portalLocation) return element;
|
|
13996
13996
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
13997
13997
|
};
|
|
13998
|
-
var GuidanceMessage = styled.div(templateObject_2$
|
|
13998
|
+
var GuidanceMessage = styled.div(templateObject_2$x || (templateObject_2$x = __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) {
|
|
13999
13999
|
var _a, _b, _c, _d, _e, _f;
|
|
14000
14000
|
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';
|
|
14001
14001
|
}, function (props) {
|
|
14002
14002
|
var _a, _b, _c, _d, _e, _f;
|
|
14003
14003
|
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';
|
|
14004
14004
|
});
|
|
14005
|
-
var templateObject_1$
|
|
14005
|
+
var templateObject_1$E, templateObject_2$x;
|
|
14006
14006
|
|
|
14007
14007
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
14008
14008
|
var _b = _a.classNames,
|
|
@@ -14017,7 +14017,7 @@
|
|
|
14017
14017
|
buttonText: 'OK'
|
|
14018
14018
|
});
|
|
14019
14019
|
if (!state.allowOverrideWrongDocumentTypeGuidance) return null;
|
|
14020
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
14020
|
+
return /*#__PURE__*/React.createElement(Container$2, {
|
|
14021
14021
|
className: classNames.container
|
|
14022
14022
|
}, /*#__PURE__*/React.createElement(InnerContainer, {
|
|
14023
14023
|
className: classNames.inner
|
|
@@ -14035,18 +14035,18 @@
|
|
|
14035
14035
|
}
|
|
14036
14036
|
}, verbiage.buttonText))));
|
|
14037
14037
|
}
|
|
14038
|
-
var Container$
|
|
14038
|
+
var Container$2 = styled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100dvw;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"], ["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100dvw;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"])), function (props) {
|
|
14039
14039
|
var _a, _b, _c;
|
|
14040
14040
|
return (_c = (_b = (_a = props.theme.idCapture) === null || _a === void 0 ? void 0 : _a.overrideWrongDocumentTypeGuidance) === null || _b === void 0 ? void 0 : _b.backgroundColor) !== null && _c !== void 0 ? _c : '#eed202';
|
|
14041
14041
|
}, function (props) {
|
|
14042
14042
|
var _a, _b, _c;
|
|
14043
14043
|
return (_c = (_b = (_a = props.theme.idCapture) === null || _a === void 0 ? void 0 : _a.overrideWrongDocumentTypeGuidance) === null || _b === void 0 ? void 0 : _b.textColor) !== null && _c !== void 0 ? _c : 'black';
|
|
14044
14044
|
});
|
|
14045
|
-
var InnerContainer = styled.div(templateObject_2$
|
|
14046
|
-
var Message = styled.span(templateObject_3$
|
|
14047
|
-
var ButtonContainer = styled.div(templateObject_4$
|
|
14048
|
-
var Button = styled(LoaderButton)(templateObject_5$
|
|
14049
|
-
var templateObject_1$
|
|
14045
|
+
var InnerContainer = styled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 16px 24px;\n margin: auto 0;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 16px 24px;\n margin: auto 0;\n width: 100%;\n"])));
|
|
14046
|
+
var Message = styled.span(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n display: block;\n margin: auto 12px auto 0;\n"], ["\n display: block;\n margin: auto 12px auto 0;\n"])));
|
|
14047
|
+
var ButtonContainer = styled.div(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n display: flex;\n margin-left: auto;\n"], ["\n display: flex;\n margin-left: auto;\n"])));
|
|
14048
|
+
var Button = styled(LoaderButton)(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n white-space: nowrap;\n margin: auto;\n"], ["\n white-space: nowrap;\n margin: auto;\n"])));
|
|
14049
|
+
var templateObject_1$D, templateObject_2$w, templateObject_3$o, templateObject_4$i, templateObject_5$b;
|
|
14050
14050
|
|
|
14051
14051
|
var IdCapture = function IdCapture(_a) {
|
|
14052
14052
|
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
@@ -14241,13 +14241,13 @@
|
|
|
14241
14241
|
finished: true
|
|
14242
14242
|
}, verbiage.retryBtnText)));
|
|
14243
14243
|
};
|
|
14244
|
-
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$
|
|
14245
|
-
var StyledOverlayImageContainer$3 = styled(OverlayImageContainer)(templateObject_2$
|
|
14246
|
-
var Description$4 = styled.p(templateObject_3$
|
|
14247
|
-
var RetryButton$1 = styled(LoaderButton)(templateObject_4$
|
|
14248
|
-
var templateObject_1$
|
|
14244
|
+
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
14245
|
+
var StyledOverlayImageContainer$3 = styled(OverlayImageContainer)(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
14246
|
+
var Description$4 = styled.p(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
|
|
14247
|
+
var RetryButton$1 = styled(LoaderButton)(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
|
|
14248
|
+
var templateObject_1$C, templateObject_2$v, templateObject_3$n, templateObject_4$h;
|
|
14249
14249
|
|
|
14250
|
-
var ExitCaptureStyledButton = styled.button(templateObject_1$
|
|
14250
|
+
var ExitCaptureStyledButton = styled.button(templateObject_1$B || (templateObject_1$B = __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"])));
|
|
14251
14251
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
14252
14252
|
var onClick = _a.onClick,
|
|
14253
14253
|
className = _a.className;
|
|
@@ -14291,10 +14291,10 @@
|
|
|
14291
14291
|
y2: "19.75"
|
|
14292
14292
|
}))));
|
|
14293
14293
|
};
|
|
14294
|
-
var templateObject_1$
|
|
14294
|
+
var templateObject_1$B;
|
|
14295
14295
|
|
|
14296
|
-
var ButtonsRow = styled.div(templateObject_1$
|
|
14297
|
-
var templateObject_1$
|
|
14296
|
+
var ButtonsRow = styled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: flex;\n gap: 0 15px;\n justify-content: center;\n"], ["\n display: flex;\n gap: 0 15px;\n justify-content: center;\n"])));
|
|
14297
|
+
var templateObject_1$A;
|
|
14298
14298
|
|
|
14299
14299
|
function IdCaptureLoadingGraphic(props) {
|
|
14300
14300
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -14323,25 +14323,15 @@
|
|
|
14323
14323
|
var theme = styled.useTheme();
|
|
14324
14324
|
var accentColor = (_d = (_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.loadingGraphicAccentColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
14325
14325
|
var accentOpacity = (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.loadingGraphicAccentOpacity) !== null && _g !== void 0 ? _g : 0.2;
|
|
14326
|
-
return /*#__PURE__*/React.createElement(
|
|
14327
|
-
style: {
|
|
14328
|
-
display: 'flex',
|
|
14329
|
-
width: '100%',
|
|
14330
|
-
height: '100%'
|
|
14331
|
-
}
|
|
14332
|
-
}, /*#__PURE__*/React.createElement("svg", {
|
|
14326
|
+
return /*#__PURE__*/React.createElement(LoadingGraphicWrapper, null, /*#__PURE__*/React.createElement(LoadingGraphicSvg, {
|
|
14333
14327
|
className: className,
|
|
14334
14328
|
width: width,
|
|
14335
14329
|
height: height,
|
|
14330
|
+
"$frame": frame,
|
|
14331
|
+
"$borderColor": accentColor,
|
|
14336
14332
|
viewBox: "0 0 698 452",
|
|
14337
14333
|
fill: "none",
|
|
14338
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
14339
|
-
style: {
|
|
14340
|
-
margin: 'auto',
|
|
14341
|
-
transform: "scale(".concat(frame > 1 ? 1 : frame === 1 ? 1.25 : 0.75, ")"),
|
|
14342
|
-
transition: 'transform 0.2s linear, border-width 0.2s linear',
|
|
14343
|
-
border: "".concat(frame >= 5 ? 10 : 0, "px solid ").concat(accentColor)
|
|
14344
|
-
}
|
|
14334
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
14345
14335
|
}, /*#__PURE__*/React.createElement("g", {
|
|
14346
14336
|
filter: frame === 1 ? 'url(#filter0_f_91_884)' : undefined
|
|
14347
14337
|
}, /*#__PURE__*/React.createElement("path", {
|
|
@@ -14569,12 +14559,9 @@
|
|
|
14569
14559
|
viewBox: "0 0 428 747",
|
|
14570
14560
|
fill: "none",
|
|
14571
14561
|
xmlns: "http://www.w3.org/2000/svg"
|
|
14572
|
-
}, /*#__PURE__*/React.createElement(
|
|
14562
|
+
}, /*#__PURE__*/React.createElement(LoadingGraphicCardGroup, {
|
|
14573
14563
|
id: "card",
|
|
14574
|
-
|
|
14575
|
-
transform: "translate(".concat(frame < 1 ? '-500px' : '0', ", 0)"),
|
|
14576
|
-
transition: 'transform 0.3s linear'
|
|
14577
|
-
}
|
|
14564
|
+
"$offScreen": frame < 1
|
|
14578
14565
|
}, /*#__PURE__*/React.createElement("path", {
|
|
14579
14566
|
d: "M76.5001 181.274C76.5001 176.027 80.7534 171.774 86.0001 171.774L342 171.774C347.247 171.774 351.5 176.027 351.5 181.274L351.5 586C351.5 591.247 347.247 595.5 342 595.5L86.0001 595.5C80.7534 595.5 76.5001 591.247 76.5001 586L76.5001 181.274Z",
|
|
14580
14567
|
fill: "#F3F3F3",
|
|
@@ -14757,13 +14744,10 @@
|
|
|
14757
14744
|
strokeWidth: "5",
|
|
14758
14745
|
strokeLinecap: "round",
|
|
14759
14746
|
strokeLinejoin: "round"
|
|
14760
|
-
}))), /*#__PURE__*/React.createElement(
|
|
14747
|
+
}))), /*#__PURE__*/React.createElement(LoadingGraphicPhoneGroup, {
|
|
14761
14748
|
id: "phone",
|
|
14762
14749
|
clipPath: "url(#clip0_29_1778)",
|
|
14763
|
-
|
|
14764
|
-
transform: "translate(".concat(frame < 1 ? '40px' : '0', ", 0)"),
|
|
14765
|
-
transition: 'transform 0.3s linear'
|
|
14766
|
-
}
|
|
14750
|
+
"$offScreen": frame < 1
|
|
14767
14751
|
}, /*#__PURE__*/React.createElement("rect", {
|
|
14768
14752
|
x: "154",
|
|
14769
14753
|
y: "693",
|
|
@@ -14791,6 +14775,21 @@
|
|
|
14791
14775
|
fill: "white"
|
|
14792
14776
|
}))));
|
|
14793
14777
|
}
|
|
14778
|
+
var LoadingGraphicWrapper = styled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
|
|
14779
|
+
var LoadingGraphicSvg = styled.svg(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n margin: auto;\n transform: scale(\n ", "\n );\n transform-style: preserve-3d;\n transition:\n transform 0.2s linear,\n border-width 0.2s linear;\n border: ", "px solid\n ", ";\n"], ["\n margin: auto;\n transform: scale(\n ", "\n );\n transform-style: preserve-3d;\n transition:\n transform 0.2s linear,\n border-width 0.2s linear;\n border: ", "px solid\n ", ";\n"])), function (props) {
|
|
14780
|
+
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
14781
|
+
}, function (props) {
|
|
14782
|
+
return props.$frame >= 5 ? 10 : 0;
|
|
14783
|
+
}, function (props) {
|
|
14784
|
+
return props.$borderColor;
|
|
14785
|
+
});
|
|
14786
|
+
var LoadingGraphicCardGroup = styled.g(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n transform: translate(", ", 0);\n transform-style: preserve-3d;\n transition: transform 0.3s linear;\n"], ["\n transform: translate(", ", 0);\n transform-style: preserve-3d;\n transition: transform 0.3s linear;\n"])), function (props) {
|
|
14787
|
+
return props.$offScreen ? '-500px' : '0';
|
|
14788
|
+
});
|
|
14789
|
+
var LoadingGraphicPhoneGroup = styled.g(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n transform: translate(", ", 0);\n transform-style: preserve-3d;\n transition: transform 0.3s linear;\n"], ["\n transform: translate(", ", 0);\n transform-style: preserve-3d;\n transition: transform 0.3s linear;\n"])), function (props) {
|
|
14790
|
+
return props.$offScreen ? '40px' : '0';
|
|
14791
|
+
});
|
|
14792
|
+
var templateObject_1$z, templateObject_2$u, templateObject_3$m, templateObject_4$g;
|
|
14794
14793
|
|
|
14795
14794
|
function LoadingListItemIndicator(_a) {
|
|
14796
14795
|
var _b = _a.state,
|
|
@@ -14985,24 +14984,24 @@
|
|
|
14985
14984
|
}
|
|
14986
14985
|
}, verbiage.continueText))))));
|
|
14987
14986
|
};
|
|
14988
|
-
var OverlayInner$1 = styled.div(templateObject_1$
|
|
14987
|
+
var OverlayInner$1 = styled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n height: 100dvh;\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n"], ["\n height: 100dvh;\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
14989
14988
|
var _a, _b, _c, _d;
|
|
14990
14989
|
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.backgroundColor) !== null && _d !== void 0 ? _d : '#ecedf3';
|
|
14991
14990
|
}, function (props) {
|
|
14992
14991
|
var _a, _b, _c, _d;
|
|
14993
14992
|
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';
|
|
14994
14993
|
});
|
|
14995
|
-
var OverlayHeader$1 = styled.div(templateObject_2$
|
|
14994
|
+
var OverlayHeader$1 = styled.div(templateObject_2$t || (templateObject_2$t = __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) {
|
|
14996
14995
|
var _a;
|
|
14997
14996
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
14998
14997
|
}, function (props) {
|
|
14999
14998
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
15000
14999
|
});
|
|
15001
|
-
var StyledGuidanceMessage$2 = styled(GuidanceMessage)(templateObject_3$
|
|
15002
|
-
var StyledOverlayImageContainer$2 = styled(OverlayImageContainer)(templateObject_4$
|
|
15003
|
-
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_5$
|
|
15004
|
-
var ContinuityCameraCheckboxInner = styled(GuidanceMessage)(templateObject_6$
|
|
15005
|
-
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$
|
|
15000
|
+
var StyledGuidanceMessage$2 = styled(GuidanceMessage)(templateObject_3$l || (templateObject_3$l = __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"])));
|
|
15001
|
+
var StyledOverlayImageContainer$2 = styled(OverlayImageContainer)(templateObject_4$f || (templateObject_4$f = __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"])));
|
|
15002
|
+
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_5$a || (templateObject_5$a = __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"])));
|
|
15003
|
+
var ContinuityCameraCheckboxInner = styled(GuidanceMessage)(templateObject_6$8 || (templateObject_6$8 = __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"])));
|
|
15004
|
+
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
15006
15005
|
var StyledButtonsRow$a = styled(ButtonsRow)(templateObject_8$2 || (templateObject_8$2 = __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) {
|
|
15007
15006
|
var _a, _b, _c, _d;
|
|
15008
15007
|
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.progressBarTextColor) !== null && _d !== void 0 ? _d : 'white';
|
|
@@ -15028,7 +15027,7 @@
|
|
|
15028
15027
|
var _a, _b, _c, _d;
|
|
15029
15028
|
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.progressBarIndicatorColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
15030
15029
|
}, progressBarAnimation);
|
|
15031
|
-
var CustomLoadingGraphic$1 = styled.img(templateObject_16 || (templateObject_16 = __makeTemplateObject([""], [""])));
|
|
15030
|
+
var CustomLoadingGraphic$1 = styled.img(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
15032
15031
|
var ContinueButtonContainer$1 = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
15033
15032
|
var ContinueButton$1 = styled(LoaderButton)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n"], ["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n"])), function (props) {
|
|
15034
15033
|
var _a, _b, _c, _d, _e, _f;
|
|
@@ -15037,10 +15036,10 @@
|
|
|
15037
15036
|
var _a, _b, _c, _d, _e, _f;
|
|
15038
15037
|
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, ";") : '';
|
|
15039
15038
|
});
|
|
15040
|
-
var templateObject_1$
|
|
15039
|
+
var templateObject_1$y, templateObject_2$t, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$8, templateObject_7$5, templateObject_8$2, 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;
|
|
15041
15040
|
|
|
15042
|
-
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$
|
|
15043
|
-
var ContinuityCameraCheckbox = styled.input(templateObject_2$
|
|
15041
|
+
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
|
|
15042
|
+
var ContinuityCameraCheckbox = styled.input(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
15044
15043
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
15045
15044
|
var _b, _c, _d, _e;
|
|
15046
15045
|
var onDismissed = _a.onDismissed,
|
|
@@ -15151,7 +15150,7 @@
|
|
|
15151
15150
|
}
|
|
15152
15151
|
}, cameraReady && modelsReady ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
15153
15152
|
};
|
|
15154
|
-
var templateObject_1$
|
|
15153
|
+
var templateObject_1$x, templateObject_2$s;
|
|
15155
15154
|
|
|
15156
15155
|
var components$1 = {
|
|
15157
15156
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -15209,9 +15208,9 @@
|
|
|
15209
15208
|
});
|
|
15210
15209
|
};
|
|
15211
15210
|
|
|
15212
|
-
var Card = styled.div(templateObject_1$
|
|
15213
|
-
var FlexCard = styled(Card)(templateObject_2$
|
|
15214
|
-
var templateObject_1$
|
|
15211
|
+
var Card = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n background: white;\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n margin: auto;\n max-width: min(500px, 100dvw - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"], ["\n background: white;\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n margin: auto;\n max-width: min(500px, 100dvw - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"])));
|
|
15212
|
+
var FlexCard = styled(Card)(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
15213
|
+
var templateObject_1$w, templateObject_2$r;
|
|
15215
15214
|
|
|
15216
15215
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
15217
15216
|
var capturedDocuments = _a.capturedDocuments,
|
|
@@ -15286,13 +15285,13 @@
|
|
|
15286
15285
|
finished: true
|
|
15287
15286
|
}, verbiage.retryText)))));
|
|
15288
15287
|
};
|
|
15289
|
-
var Heading$a = styled.h1(templateObject_1$
|
|
15290
|
-
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$
|
|
15291
|
-
var ImageRow = styled(OverlayImageRow)(templateObject_3$
|
|
15292
|
-
var ImageCol$1 = styled.div(templateObject_4$
|
|
15293
|
-
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$
|
|
15294
|
-
var DebugPre = styled.pre(templateObject_6$
|
|
15295
|
-
var templateObject_1$
|
|
15288
|
+
var Heading$a = styled.h1(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n font-size: 1.5rem;\n margin-top: 0;\n margin-bottom: 1.5rem;\n"], ["\n font-size: 1.5rem;\n margin-top: 0;\n margin-bottom: 1.5rem;\n"])));
|
|
15289
|
+
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n flex-grow: 1;\n overflow-y: auto;\n padding-bottom: 0;\n max-width: 100%;\n"], ["\n flex-grow: 1;\n overflow-y: auto;\n padding-bottom: 0;\n max-width: 100%;\n"])));
|
|
15290
|
+
var ImageRow = styled(OverlayImageRow)(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n max-width: 100%;\n flex-direction: column;\n display: grid;\n grid-gap: 12px;\n //grid-template-columns: 1fr 1fr;\n"], ["\n max-width: 100%;\n flex-direction: column;\n display: grid;\n grid-gap: 12px;\n //grid-template-columns: 1fr 1fr;\n"])));
|
|
15291
|
+
var ImageCol$1 = styled.div(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n width: 100%;\n max-height: none !important;\n"], ["\n width: 100%;\n max-height: none !important;\n"])));
|
|
15292
|
+
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n width: 100%;\n border-radius: 12px;\n"], ["\n width: 100%;\n border-radius: 12px;\n"])));
|
|
15293
|
+
var DebugPre = styled.pre(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n text-align: left;\n max-width: min(450px, 100dvw - 100px);\n overflow-x: auto;\n"], ["\n text-align: left;\n max-width: min(450px, 100dvw - 100px);\n overflow-x: auto;\n"])));
|
|
15294
|
+
var templateObject_1$v, templateObject_2$q, templateObject_3$k, templateObject_4$e, templateObject_5$9, templateObject_6$7;
|
|
15296
15295
|
|
|
15297
15296
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
15298
15297
|
var _this = this;
|
|
@@ -15344,10 +15343,10 @@
|
|
|
15344
15343
|
canvas.style.height = '0';
|
|
15345
15344
|
}
|
|
15346
15345
|
|
|
15347
|
-
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$
|
|
15346
|
+
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n"])), function (props) {
|
|
15348
15347
|
return props.$isVisible ? '' : 'opacity: 0;';
|
|
15349
15348
|
});
|
|
15350
|
-
var IdCardGuideImage = styled.img(templateObject_2$
|
|
15349
|
+
var IdCardGuideImage = styled.img(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n transform-style: preserve-3d;\n ", "\n ", "\n"], ["\n transform-style: preserve-3d;\n ", "\n ", "\n"])), function (props) {
|
|
15351
15350
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
15352
15351
|
}, function (props) {
|
|
15353
15352
|
return props.$isInvisible ? 'opacity: 0;' : '';
|
|
@@ -15489,16 +15488,16 @@
|
|
|
15489
15488
|
className: isProgressBar ? "idmSdkProgressBorder ".concat(progressPaused ? 'idmSdkProgressPaused' : '') : ''
|
|
15490
15489
|
}));
|
|
15491
15490
|
}
|
|
15492
|
-
var IdCardBorderContainer = styled.div(templateObject_3$
|
|
15493
|
-
var SvgOverlay = styled.svg(templateObject_4$
|
|
15494
|
-
var IdCardBorderRect = styled.rect(templateObject_5$
|
|
15491
|
+
var IdCardBorderContainer = styled.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n"], ["\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n"])), wavesAnimation);
|
|
15492
|
+
var SvgOverlay = styled.svg(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"])));
|
|
15493
|
+
var IdCardBorderRect = styled.rect(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"], ["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"])), progressBorderAnimation, function (props) {
|
|
15495
15494
|
var _a;
|
|
15496
15495
|
return (_a = props.$speed) !== null && _a !== void 0 ? _a : '3s';
|
|
15497
15496
|
}, function (props) {
|
|
15498
15497
|
var _a;
|
|
15499
15498
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
15500
15499
|
});
|
|
15501
|
-
var templateObject_1$
|
|
15500
|
+
var templateObject_1$u, templateObject_2$p, templateObject_3$j, templateObject_4$d, templateObject_5$8;
|
|
15502
15501
|
|
|
15503
15502
|
var defaultIdCaptureGuideImages = {
|
|
15504
15503
|
portrait: {
|
|
@@ -15604,12 +15603,81 @@
|
|
|
15604
15603
|
return allowPortraitOnMobile && window.innerWidth < window.innerHeight ? 'portrait' : 'landscape';
|
|
15605
15604
|
}
|
|
15606
15605
|
|
|
15607
|
-
var
|
|
15606
|
+
var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
|
|
15607
|
+
var _b;
|
|
15608
|
+
var _c = _a.idCaptureGuideImages,
|
|
15609
|
+
idCaptureGuideImages = _c === void 0 ? defaultIdCaptureGuideImages : _c,
|
|
15610
|
+
_d = _a.classNames,
|
|
15611
|
+
classNames = _d === void 0 ? {} : _d,
|
|
15612
|
+
borderWidth = _a.borderWidth,
|
|
15613
|
+
borderColor = _a.borderColor,
|
|
15614
|
+
borderRadius = _a.borderRadius,
|
|
15615
|
+
imageStyle = _a.imageStyle;
|
|
15616
|
+
var cameraRef = React.useContext(CameraStateContext).cameraRef;
|
|
15617
|
+
var isMirrored = !((_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing);
|
|
15618
|
+
var _e = React.useState(1),
|
|
15619
|
+
transitionTime = _e[0],
|
|
15620
|
+
setTransitionTime = _e[1];
|
|
15621
|
+
var _f = React.useState(0),
|
|
15622
|
+
rotationAngle = _f[0],
|
|
15623
|
+
setRotationAngle = _f[1];
|
|
15624
|
+
var frontTransforms = ["rotateY(".concat(rotationAngle, "deg)")];
|
|
15625
|
+
if (isMirrored) frontTransforms.push('scaleX(-1)');
|
|
15626
|
+
var backTransforms = ["rotateY(".concat(180 - rotationAngle, "deg)")];
|
|
15627
|
+
if (isMirrored) backTransforms.push('scaleX(-1)');
|
|
15628
|
+
React.useEffect(function () {
|
|
15629
|
+
var timeout;
|
|
15630
|
+
function doFlip() {
|
|
15631
|
+
setTransitionTime(1);
|
|
15632
|
+
setRotationAngle(180);
|
|
15633
|
+
timeout = setTimeout(function () {
|
|
15634
|
+
setTransitionTime(0);
|
|
15635
|
+
setRotationAngle(0);
|
|
15636
|
+
}, 1500);
|
|
15637
|
+
}
|
|
15638
|
+
var interval = setInterval(doFlip, 2500);
|
|
15639
|
+
timeout = setTimeout(doFlip, 250);
|
|
15640
|
+
return function () {
|
|
15641
|
+
clearInterval(interval);
|
|
15642
|
+
clearTimeout(timeout);
|
|
15643
|
+
};
|
|
15644
|
+
}, []);
|
|
15645
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FlipImageContainer, {
|
|
15646
|
+
className: classNames.frontImageContainer,
|
|
15647
|
+
status: "disabled",
|
|
15648
|
+
borderWidth: borderWidth,
|
|
15649
|
+
borderColor: borderColor,
|
|
15650
|
+
borderRadius: borderRadius,
|
|
15651
|
+
"$transforms": frontTransforms.join(' '),
|
|
15652
|
+
"$transitionTime": transitionTime,
|
|
15653
|
+
"$isVisible": true
|
|
15654
|
+
}, /*#__PURE__*/React.createElement(IdCardGuideImage, {
|
|
15655
|
+
src: idCaptureGuideImages.landscape.SHOW_ID_FRONT.url,
|
|
15656
|
+
className: classNames.frontImage,
|
|
15657
|
+
alt: "",
|
|
15658
|
+
style: imageStyle
|
|
15659
|
+
})), /*#__PURE__*/React.createElement(FlipImageContainer, {
|
|
15660
|
+
className: classNames.backImageContainer,
|
|
15661
|
+
status: "disabled",
|
|
15662
|
+
borderWidth: borderWidth,
|
|
15663
|
+
borderColor: borderColor,
|
|
15664
|
+
borderRadius: borderRadius,
|
|
15665
|
+
"$transforms": backTransforms.join(' '),
|
|
15666
|
+
"$transitionTime": transitionTime,
|
|
15667
|
+
"$isVisible": true
|
|
15668
|
+
}, /*#__PURE__*/React.createElement(IdCardGuideImage, {
|
|
15669
|
+
src: idCaptureGuideImages.landscape.SHOW_ID_BACK.url,
|
|
15670
|
+
className: classNames.backImage,
|
|
15671
|
+
alt: "",
|
|
15672
|
+
style: imageStyle
|
|
15673
|
+
})));
|
|
15674
|
+
};
|
|
15675
|
+
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n backface-visibility: hidden;\n transition: transform ", "s;\n transform: ", ";\n transform-style: preserve-3d;\n position: absolute;\n display: block;\n top: 0;\n width: 100%;\n max-height: 100%;\n"], ["\n backface-visibility: hidden;\n transition: transform ", "s;\n transform: ", ";\n transform-style: preserve-3d;\n position: absolute;\n display: block;\n top: 0;\n width: 100%;\n max-height: 100%;\n"])), function (props) {
|
|
15608
15676
|
return props.$transitionTime;
|
|
15609
15677
|
}, function (props) {
|
|
15610
15678
|
return props.$transforms;
|
|
15611
15679
|
});
|
|
15612
|
-
var templateObject_1$
|
|
15680
|
+
var templateObject_1$t;
|
|
15613
15681
|
|
|
15614
15682
|
var GuideOrientationContext = /*#__PURE__*/React.createContext({
|
|
15615
15683
|
orientation: 'landscape',
|
|
@@ -15898,10 +15966,10 @@
|
|
|
15898
15966
|
return v;
|
|
15899
15967
|
}).join(' ');
|
|
15900
15968
|
};
|
|
15901
|
-
var StyledPageContainer = styled(PageContainerDiv)(templateObject_1$
|
|
15902
|
-
var GuidesContainer = styled.div(templateObject_2$
|
|
15903
|
-
var GuideCenterRow = styled.div(templateObject_3$
|
|
15904
|
-
var GuideRegion = styled.div(templateObject_4$
|
|
15969
|
+
var StyledPageContainer = styled(PageContainerDiv)(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n z-index: 1000;\n overflow-y: hidden;\n"], ["\n z-index: 1000;\n overflow-y: hidden;\n"])));
|
|
15970
|
+
var GuidesContainer = styled.div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n width: 100dvw;\n height: 100dvh;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n width: 100dvw;\n height: 100dvh;\n"])));
|
|
15971
|
+
var GuideCenterRow = styled.div(templateObject_3$i || (templateObject_3$i = __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 min-height: 0;\n flex: 1;\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 min-height: 0;\n flex: 1;\n"])));
|
|
15972
|
+
var GuideRegion = styled.div(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: end;\n width: 100%;\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 position: relative;\n z-index: 1000;\n background: ", ";\n color: ", ";\n text-align: center;\n ", "\n ", "\n"])), function (props) {
|
|
15905
15973
|
var _a, _b, _c, _d, _e;
|
|
15906
15974
|
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)';
|
|
15907
15975
|
}, function (props) {
|
|
@@ -15912,13 +15980,13 @@
|
|
|
15912
15980
|
}, function (props) {
|
|
15913
15981
|
return props.$minHeight ? "min-height: ".concat(props.$minHeight, "px;") : "";
|
|
15914
15982
|
});
|
|
15915
|
-
var Spacer = styled(GuideRegion)(templateObject_5$
|
|
15916
|
-
var GuideCenterRegion = styled.div(templateObject_6$
|
|
15983
|
+
var Spacer = styled(GuideRegion)(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n display: block;\n width: auto;\n"], ["\n display: block;\n width: auto;\n"])));
|
|
15984
|
+
var GuideCenterRegion = styled.div(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"], ["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"])), function (props) {
|
|
15917
15985
|
return props.$minWidth ? "min-width: ".concat(props.$minWidth, "px;") : "";
|
|
15918
15986
|
}, function (props) {
|
|
15919
15987
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
15920
15988
|
});
|
|
15921
|
-
var GuideCenterBorder = styled.div(templateObject_7$
|
|
15989
|
+
var GuideCenterBorder = styled.div(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n box-sizing: border-box;\n border: ", ";\n display: flex;\n flex: 1;\n justify-content: center;\n max-height: 100%;\n min-height: 0;\n position: relative;\n ", "\n"], ["\n box-sizing: border-box;\n border: ", ";\n display: flex;\n flex: 1;\n justify-content: center;\n max-height: 100%;\n min-height: 0;\n position: relative;\n ", "\n"])), function (props) {
|
|
15922
15990
|
var _a, _b;
|
|
15923
15991
|
return "".concat((_a = props.$borderWidth) !== null && _a !== void 0 ? _a : 4, "px solid ").concat((_b = props.$borderColor) !== null && _b !== void 0 ? _b : 'white');
|
|
15924
15992
|
}, function (props) {
|
|
@@ -15926,7 +15994,7 @@
|
|
|
15926
15994
|
});
|
|
15927
15995
|
var GuideText = styled.span(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n align-content: center;\n margin-top: 12px;\n margin-bottom: 12px;\n"], ["\n align-content: center;\n margin-top: 12px;\n margin-bottom: 12px;\n"])));
|
|
15928
15996
|
var GuideCenterInner = styled.div(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n position: relative;\n margin: auto;\n"], ["\n position: relative;\n margin: auto;\n"])));
|
|
15929
|
-
var templateObject_1$
|
|
15997
|
+
var templateObject_1$s, templateObject_2$o, templateObject_3$i, templateObject_4$c, templateObject_5$7, templateObject_6$6, templateObject_7$4, templateObject_8$1, templateObject_9$1;
|
|
15930
15998
|
|
|
15931
15999
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
15932
16000
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -16069,11 +16137,11 @@
|
|
|
16069
16137
|
progress: progress
|
|
16070
16138
|
}));
|
|
16071
16139
|
};
|
|
16072
|
-
var CanvasWrapper$1 = styled.div(templateObject_1$
|
|
16140
|
+
var CanvasWrapper$1 = styled.div(templateObject_1$r || (templateObject_1$r = __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) {
|
|
16073
16141
|
return props.$maskColor;
|
|
16074
16142
|
});
|
|
16075
|
-
var Canvas$1 = styled.canvas(templateObject_2$
|
|
16076
|
-
var templateObject_1$
|
|
16143
|
+
var Canvas$1 = styled.canvas(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
16144
|
+
var templateObject_1$r, templateObject_2$n;
|
|
16077
16145
|
|
|
16078
16146
|
function IdCaptureGuides(_a) {
|
|
16079
16147
|
var _b, _c;
|
|
@@ -16213,11 +16281,11 @@
|
|
|
16213
16281
|
onError: onError
|
|
16214
16282
|
})));
|
|
16215
16283
|
};
|
|
16216
|
-
var StyledSpinner = styled(Spinner$1)(templateObject_1$
|
|
16217
|
-
var ImagePreviewWrapper = styled.div(templateObject_2$
|
|
16218
|
-
var ImagePreviewText = styled.div(templateObject_3$
|
|
16219
|
-
var ImagePreviewImageWrapper = styled.div(templateObject_4$
|
|
16220
|
-
var templateObject_1$
|
|
16284
|
+
var StyledSpinner = styled(Spinner$1)(templateObject_1$q || (templateObject_1$q = __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"])));
|
|
16285
|
+
var ImagePreviewWrapper = styled.div(templateObject_2$m || (templateObject_2$m = __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"])));
|
|
16286
|
+
var ImagePreviewText = styled.div(templateObject_3$h || (templateObject_3$h = __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"])));
|
|
16287
|
+
var ImagePreviewImageWrapper = styled.div(templateObject_4$b || (templateObject_4$b = __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"])));
|
|
16288
|
+
var templateObject_1$q, templateObject_2$m, templateObject_3$h, templateObject_4$b;
|
|
16221
16289
|
|
|
16222
16290
|
var CameraVideoTag = function CameraVideoTag(_a) {
|
|
16223
16291
|
var _b;
|
|
@@ -16256,10 +16324,10 @@
|
|
|
16256
16324
|
"$isRearFacing": (_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing
|
|
16257
16325
|
});
|
|
16258
16326
|
};
|
|
16259
|
-
var FullscreenVideoTag = styled.video(templateObject_1$
|
|
16327
|
+
var FullscreenVideoTag = styled.video(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n transform: ", ";\n transform-style: preserve-3d;\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: cover;\n background: black;\n z-index: -2;\n"], ["\n transform: ", ";\n transform-style: preserve-3d;\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: cover;\n background: black;\n z-index: -2;\n"])), function (props) {
|
|
16260
16328
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
16261
16329
|
});
|
|
16262
|
-
var templateObject_1$
|
|
16330
|
+
var templateObject_1$p;
|
|
16263
16331
|
|
|
16264
16332
|
var documentCaptureInitialState = {
|
|
16265
16333
|
documents: [],
|
|
@@ -16615,16 +16683,16 @@
|
|
|
16615
16683
|
ref: canvasRef
|
|
16616
16684
|
}));
|
|
16617
16685
|
};
|
|
16618
|
-
var CanvasWrapper = styled.div(templateObject_1$
|
|
16686
|
+
var CanvasWrapper = styled.div(templateObject_1$o || (templateObject_1$o = __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) {
|
|
16619
16687
|
return props.$maskColor;
|
|
16620
16688
|
});
|
|
16621
|
-
var Canvas = styled.canvas(templateObject_2$
|
|
16622
|
-
var templateObject_1$
|
|
16689
|
+
var Canvas = styled.canvas(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
16690
|
+
var templateObject_1$o, templateObject_2$l;
|
|
16623
16691
|
|
|
16624
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
16692
|
+
var CameraFeedWrapper = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
16625
16693
|
return props.$mode === 'snapToGuides' ? "display: flex;\n position: absolute;\n left: ".concat(props.$x, "px;\n top: ").concat(props.$y, "px;\n width: ").concat(props.$w, "px;\n height: ").concat(props.$h, "px;") : "";
|
|
16626
16694
|
});
|
|
16627
|
-
var templateObject_1$
|
|
16695
|
+
var templateObject_1$n;
|
|
16628
16696
|
|
|
16629
16697
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
16630
16698
|
var _b, _c, _d, _e, _f, _g, _h;
|
|
@@ -16774,21 +16842,21 @@
|
|
|
16774
16842
|
disabled: !cameraReady || capturing
|
|
16775
16843
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
16776
16844
|
};
|
|
16777
|
-
var CaptureContainer = styled.div(templateObject_1$
|
|
16778
|
-
var HeadingRow = styled.div(templateObject_2$
|
|
16845
|
+
var CaptureContainer = styled.div(templateObject_1$m || (templateObject_1$m = __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"])));
|
|
16846
|
+
var HeadingRow = styled.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
|
|
16779
16847
|
return props.$maskColor;
|
|
16780
16848
|
});
|
|
16781
|
-
var Heading$9 = styled.h1(templateObject_3$
|
|
16782
|
-
var FooterRow = styled.div(templateObject_4$
|
|
16849
|
+
var Heading$9 = styled.h1(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
|
|
16850
|
+
var FooterRow = styled.div(templateObject_4$a || (templateObject_4$a = __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) {
|
|
16783
16851
|
return props.$maskColor;
|
|
16784
16852
|
});
|
|
16785
|
-
var Instructions = styled.div(templateObject_5$
|
|
16853
|
+
var Instructions = styled.div(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n max-height: ", ";\n overflow-y: auto;\n"], ["\n max-height: ", ";\n overflow-y: auto;\n"])), function (props) {
|
|
16786
16854
|
var _a, _b, _c;
|
|
16787
16855
|
return (_c = (_b = (_a = props.theme.documentCapture) === null || _a === void 0 ? void 0 : _a.instructions) === null || _b === void 0 ? void 0 : _b.maxHeight) !== null && _c !== void 0 ? _c : '8rem';
|
|
16788
16856
|
});
|
|
16789
|
-
var StyledButtonsRow$9 = styled(ButtonsRow)(templateObject_6$
|
|
16790
|
-
var PreviewImage = styled.img(templateObject_7$
|
|
16791
|
-
var templateObject_1$
|
|
16857
|
+
var StyledButtonsRow$9 = styled(ButtonsRow)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
|
|
16858
|
+
var PreviewImage = styled.img(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n object-fit: cover;\n"], ["\n width: 100%;\n height: 100%;\n object-fit: cover;\n"])));
|
|
16859
|
+
var templateObject_1$m, templateObject_2$k, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$3;
|
|
16792
16860
|
|
|
16793
16861
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
16794
16862
|
var onSuccess = _a.onSuccess,
|
|
@@ -17057,13 +17125,13 @@
|
|
|
17057
17125
|
}
|
|
17058
17126
|
}, verbiage.doneBtnText))))));
|
|
17059
17127
|
};
|
|
17060
|
-
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
17061
|
-
var Heading$8 = styled.h3(templateObject_2$
|
|
17062
|
-
var Description$3 = styled.p(templateObject_3$
|
|
17063
|
-
var Instruction = styled.p(templateObject_4$
|
|
17064
|
-
var ImageCol = styled.div(templateObject_5$
|
|
17065
|
-
var StyledButtonsRow$8 = styled(ButtonsRow)(templateObject_6$
|
|
17066
|
-
var templateObject_1$
|
|
17128
|
+
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
17129
|
+
var Heading$8 = styled.h3(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
17130
|
+
var Description$3 = styled.p(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
17131
|
+
var Instruction = styled.p(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
17132
|
+
var ImageCol = styled.div(templateObject_5$5 || (templateObject_5$5 = __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"])));
|
|
17133
|
+
var StyledButtonsRow$8 = styled(ButtonsRow)(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
17134
|
+
var templateObject_1$l, templateObject_2$j, templateObject_3$f, templateObject_4$9, templateObject_5$5, templateObject_6$4;
|
|
17067
17135
|
|
|
17068
17136
|
function ScalingCameraFeed() {
|
|
17069
17137
|
var _a = React.useContext(IdCaptureStateContext),
|
|
@@ -17749,7 +17817,7 @@
|
|
|
17749
17817
|
}))));
|
|
17750
17818
|
});
|
|
17751
17819
|
HeadGuideSvg.displayName = 'HeadGuideSvg';
|
|
17752
|
-
var PulsingHeadGuideContainer = styled.div(templateObject_1$
|
|
17820
|
+
var PulsingHeadGuideContainer = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"], ["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"])), wavesAnimation);
|
|
17753
17821
|
function HeadGuide(_a) {
|
|
17754
17822
|
var _b;
|
|
17755
17823
|
var _c = _a.status,
|
|
@@ -17799,8 +17867,8 @@
|
|
|
17799
17867
|
height: parentHeight
|
|
17800
17868
|
})));
|
|
17801
17869
|
}
|
|
17802
|
-
var AbsoluteSvg = styled.svg(templateObject_2$
|
|
17803
|
-
var RelativeSvgContainer = styled.div(templateObject_3$
|
|
17870
|
+
var AbsoluteSvg = styled.svg(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n"])));
|
|
17871
|
+
var RelativeSvgContainer = styled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n position: relative;\n height: 100%;\n display: flex;\n align-items: ", ";\n"], ["\n position: relative;\n height: 100%;\n display: flex;\n align-items: ", ";\n"])), function (props) {
|
|
17804
17872
|
return props.$verticalAlign === 'bottom' ? 'flex-end' : 'center';
|
|
17805
17873
|
});
|
|
17806
17874
|
function SelfieCaptureAnimatedMask(_a) {
|
|
@@ -18027,10 +18095,10 @@
|
|
|
18027
18095
|
status: status
|
|
18028
18096
|
}));
|
|
18029
18097
|
}
|
|
18030
|
-
var templateObject_1$
|
|
18098
|
+
var templateObject_1$k, templateObject_2$i, templateObject_3$e;
|
|
18031
18099
|
|
|
18032
|
-
var FaceCaptureGuideContainer = styled.div(templateObject_1$
|
|
18033
|
-
var FaceCaptureGuideInner = styled.div(templateObject_2$
|
|
18100
|
+
var FaceCaptureGuideContainer = styled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n position: fixed;\n z-index: 1000;\n width: 100dvw;\n height: 100dvh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"], ["\n position: fixed;\n z-index: 1000;\n width: 100dvw;\n height: 100dvh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"])));
|
|
18101
|
+
var FaceCaptureGuideInner = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n position: relative;\n height: 60%;\n"], ["\n position: relative;\n height: 60%;\n"])));
|
|
18034
18102
|
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
18035
18103
|
var _b = _a.classNames,
|
|
18036
18104
|
classNames = _b === void 0 ? {} : _b,
|
|
@@ -18052,7 +18120,7 @@
|
|
|
18052
18120
|
verticalAlign: "center"
|
|
18053
18121
|
})));
|
|
18054
18122
|
};
|
|
18055
|
-
var templateObject_1$
|
|
18123
|
+
var templateObject_1$j, templateObject_2$h;
|
|
18056
18124
|
|
|
18057
18125
|
var SelfieGuidanceModelsContext = /*#__PURE__*/React.createContext({
|
|
18058
18126
|
start: function start() {
|
|
@@ -18356,12 +18424,12 @@
|
|
|
18356
18424
|
}
|
|
18357
18425
|
}, !image ? invalidSelfie ? verbiage.retryButtonText : verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
|
|
18358
18426
|
};
|
|
18359
|
-
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$
|
|
18360
|
-
var Heading$7 = styled.h3(templateObject_2$
|
|
18361
|
-
var Description$2 = styled.p(templateObject_3$
|
|
18362
|
-
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$
|
|
18363
|
-
var StyledButtonsRow$7 = styled(ButtonsRow)(templateObject_5$
|
|
18364
|
-
var templateObject_1$
|
|
18427
|
+
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
18428
|
+
var Heading$7 = styled.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18429
|
+
var Description$2 = styled.p(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18430
|
+
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
18431
|
+
var StyledButtonsRow$7 = styled(ButtonsRow)(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
18432
|
+
var templateObject_1$i, templateObject_2$g, templateObject_3$d, templateObject_4$8, templateObject_5$4;
|
|
18365
18433
|
|
|
18366
18434
|
var initialState$3 = {
|
|
18367
18435
|
busy: false,
|
|
@@ -18905,9 +18973,9 @@
|
|
|
18905
18973
|
finished: true
|
|
18906
18974
|
}, verbiage.retryBtnText)))));
|
|
18907
18975
|
};
|
|
18908
|
-
var ImageContainer$5 = styled.div(templateObject_1$
|
|
18909
|
-
var Heading$6 = styled.h3(templateObject_2$
|
|
18910
|
-
var templateObject_1$
|
|
18976
|
+
var ImageContainer$5 = styled.div(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100dvw;\n max-height: 100dvh;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"], ["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100dvw;\n max-height: 100dvh;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"])));
|
|
18977
|
+
var Heading$6 = styled.h3(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n font-size: 1.2rem;\n margin: 0;\n"], ["\n font-size: 1.2rem;\n margin: 0;\n"])));
|
|
18978
|
+
var templateObject_1$h, templateObject_2$f;
|
|
18911
18979
|
|
|
18912
18980
|
var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
18913
18981
|
var _b = _a.canRetry,
|
|
@@ -18956,9 +19024,9 @@
|
|
|
18956
19024
|
finished: true
|
|
18957
19025
|
}, verbiage.exitBtnText)))));
|
|
18958
19026
|
};
|
|
18959
|
-
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$
|
|
18960
|
-
var Heading$5 = styled.h3(templateObject_2$
|
|
18961
|
-
var templateObject_1$
|
|
19027
|
+
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
19028
|
+
var Heading$5 = styled.h3(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
|
|
19029
|
+
var templateObject_1$g, templateObject_2$e;
|
|
18962
19030
|
|
|
18963
19031
|
var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
18964
19032
|
var _b;
|
|
@@ -18999,11 +19067,11 @@
|
|
|
18999
19067
|
finished: true
|
|
19000
19068
|
}, verbiage.retryBtnText)));
|
|
19001
19069
|
};
|
|
19002
|
-
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$
|
|
19003
|
-
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$
|
|
19004
|
-
var Description$1 = styled.p(templateObject_3$
|
|
19005
|
-
var RetryButton = styled(LoaderButton)(templateObject_4$
|
|
19006
|
-
var templateObject_1$
|
|
19070
|
+
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
19071
|
+
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
19072
|
+
var Description$1 = styled.p(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
|
|
19073
|
+
var RetryButton = styled(LoaderButton)(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
|
|
19074
|
+
var templateObject_1$f, templateObject_2$d, templateObject_3$c, templateObject_4$7;
|
|
19007
19075
|
|
|
19008
19076
|
var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLegacy(_a) {
|
|
19009
19077
|
var onDismissed = _a.onDismissed,
|
|
@@ -19086,9 +19154,9 @@
|
|
|
19086
19154
|
}
|
|
19087
19155
|
}, cameraReady && allModelsReady ? verbiage.continueText : allModelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
|
|
19088
19156
|
};
|
|
19089
|
-
var StyledGuidanceMessage$1 = styled(GuidanceMessage)(templateObject_1$
|
|
19090
|
-
var StyledButtonsRow$6 = styled(ButtonsRow)(templateObject_2$
|
|
19091
|
-
var templateObject_1$
|
|
19157
|
+
var StyledGuidanceMessage$1 = styled(GuidanceMessage)(templateObject_1$e || (templateObject_1$e = __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"])));
|
|
19158
|
+
var StyledButtonsRow$6 = styled(ButtonsRow)(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n flex-direction: column;\n padding-top: 25px;\n"], ["\n flex-direction: column;\n padding-top: 25px;\n"])));
|
|
19159
|
+
var templateObject_1$e, templateObject_2$c;
|
|
19092
19160
|
|
|
19093
19161
|
var legacyInstructionImageUrl = "".concat(DEFAULT_CDN_URL, "/Selfie-Image-1.png");
|
|
19094
19162
|
var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDefault(_a) {
|
|
@@ -19213,30 +19281,30 @@
|
|
|
19213
19281
|
}
|
|
19214
19282
|
}, verbiage.continueText))))));
|
|
19215
19283
|
};
|
|
19216
|
-
var OverlayInner = styled.div(templateObject_1$
|
|
19284
|
+
var OverlayInner = styled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n height: 100dvh;\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n"], ["\n height: 100dvh;\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
19217
19285
|
var _a, _b, _c, _d;
|
|
19218
19286
|
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.backgroundColor) !== null && _d !== void 0 ? _d : '#ecedf3';
|
|
19219
19287
|
}, function (props) {
|
|
19220
19288
|
var _a, _b, _c, _d;
|
|
19221
19289
|
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';
|
|
19222
19290
|
});
|
|
19223
|
-
var OverlayHeader = styled.div(templateObject_2$
|
|
19291
|
+
var OverlayHeader = styled.div(templateObject_2$b || (templateObject_2$b = __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) {
|
|
19224
19292
|
var _a;
|
|
19225
19293
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
19226
19294
|
}, function (props) {
|
|
19227
19295
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
19228
19296
|
});
|
|
19229
|
-
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_3$
|
|
19230
|
-
var StyledButtonsRow$5 = styled(ButtonsRow)(templateObject_4$
|
|
19297
|
+
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_3$b || (templateObject_3$b = __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"])));
|
|
19298
|
+
var StyledButtonsRow$5 = styled(ButtonsRow)(templateObject_4$6 || (templateObject_4$6 = __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) {
|
|
19231
19299
|
var _a, _b, _c, _d;
|
|
19232
19300
|
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';
|
|
19233
19301
|
}, function (props) {
|
|
19234
19302
|
var _a, _b, _c, _d, _e, _f;
|
|
19235
19303
|
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.progressBarFontSize) ? "font-size: ".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.progressBarFontSize, ";") : '';
|
|
19236
19304
|
});
|
|
19237
|
-
var StyledOverlayImageContainer = styled(OverlayImageContainer)(templateObject_5$
|
|
19238
|
-
var LoadingListContainer = styled.div(templateObject_6$
|
|
19239
|
-
var LoadingList = styled.ul(templateObject_7$
|
|
19305
|
+
var StyledOverlayImageContainer = styled(OverlayImageContainer)(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n padding: 0;\n\n & > svg {\n height: 100%;\n }\n"], ["\n padding: 0;\n\n & > svg {\n height: 100%;\n }\n"])));
|
|
19306
|
+
var LoadingListContainer = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n display: flex;\n position: relative;\n z-index: 2;\n"], ["\n display: flex;\n position: relative;\n z-index: 2;\n"])));
|
|
19307
|
+
var LoadingList = styled.ul(templateObject_7$2 || (templateObject_7$2 = __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"])));
|
|
19240
19308
|
var LoadingListItem = styled.li(templateObject_8 || (templateObject_8 = __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 display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"])));
|
|
19241
19309
|
var ProgressContainer = styled.div(templateObject_9 || (templateObject_9 = __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"])));
|
|
19242
19310
|
var ProgressBarBackground = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: ", ";\n opacity: ", ";\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
@@ -19262,7 +19330,7 @@
|
|
|
19262
19330
|
var _a, _b, _c, _d, _e, _f;
|
|
19263
19331
|
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, ";") : '';
|
|
19264
19332
|
});
|
|
19265
|
-
var templateObject_1$
|
|
19333
|
+
var templateObject_1$d, templateObject_2$b, templateObject_3$b, templateObject_4$6, templateObject_5$3, templateObject_6$3, templateObject_7$2, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
|
|
19266
19334
|
|
|
19267
19335
|
var components = {
|
|
19268
19336
|
"default": SelfieCaptureLoadingOverlayDefault,
|
|
@@ -19591,7 +19659,7 @@
|
|
|
19591
19659
|
}
|
|
19592
19660
|
return /*#__PURE__*/React.createElement(OverlayContainer, {
|
|
19593
19661
|
className: classNames.container
|
|
19594
|
-
}, /*#__PURE__*/React.createElement(Inner$
|
|
19662
|
+
}, /*#__PURE__*/React.createElement(Inner$2, {
|
|
19595
19663
|
className: classNames.inner
|
|
19596
19664
|
}, /*#__PURE__*/React.createElement(Heading$4, {
|
|
19597
19665
|
className: classNames.heading
|
|
@@ -19621,11 +19689,11 @@
|
|
|
19621
19689
|
}
|
|
19622
19690
|
}, verbiage.captureBtnText)))));
|
|
19623
19691
|
};
|
|
19624
|
-
var Inner$
|
|
19625
|
-
var Heading$4 = styled.h3(templateObject_2$
|
|
19626
|
-
var Description = styled.p(templateObject_3$
|
|
19627
|
-
var StyledButtonsRow$4 = styled(ButtonsRow)(templateObject_4$
|
|
19628
|
-
var templateObject_1$
|
|
19692
|
+
var Inner$2 = styled(OverlayInner$2)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
19693
|
+
var Heading$4 = styled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
19694
|
+
var Description = styled.p(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
19695
|
+
var StyledButtonsRow$4 = styled(ButtonsRow)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
19696
|
+
var templateObject_1$c, templateObject_2$a, templateObject_3$a, templateObject_4$5;
|
|
19629
19697
|
|
|
19630
19698
|
var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
|
|
19631
19699
|
var documents = _a.documents,
|
|
@@ -20537,7 +20605,7 @@
|
|
|
20537
20605
|
});
|
|
20538
20606
|
}
|
|
20539
20607
|
|
|
20540
|
-
var SignaturePaperBacking = styled.div(templateObject_1$
|
|
20608
|
+
var SignaturePaperBacking = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n ", "\n ", "\n"], ["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n ", "\n ", "\n"])), function (props) {
|
|
20541
20609
|
var _a, _b;
|
|
20542
20610
|
return ((_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.background) ? "background: ".concat((_b = props.theme.signatureCapture) === null || _b === void 0 ? void 0 : _b.background, ";") : "";
|
|
20543
20611
|
}, function (props) {
|
|
@@ -20547,8 +20615,8 @@
|
|
|
20547
20615
|
var _a, _b;
|
|
20548
20616
|
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, ";") : "";
|
|
20549
20617
|
});
|
|
20550
|
-
var SignatureCanvasContainer$1 = styled.div(templateObject_2$
|
|
20551
|
-
var SignaturePad = styled.div(templateObject_3$
|
|
20618
|
+
var SignatureCanvasContainer$1 = styled.div(templateObject_2$9 || (templateObject_2$9 = __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"])));
|
|
20619
|
+
var SignaturePad = styled.div(templateObject_3$9 || (templateObject_3$9 = __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) {
|
|
20552
20620
|
var _a, _b, _c;
|
|
20553
20621
|
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)';
|
|
20554
20622
|
}, function (props) {
|
|
@@ -20558,8 +20626,8 @@
|
|
|
20558
20626
|
var _a, _b, _c;
|
|
20559
20627
|
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';
|
|
20560
20628
|
});
|
|
20561
|
-
var SignatureButtonsContainer = styled(ButtonsRow)(templateObject_4$
|
|
20562
|
-
var templateObject_1$
|
|
20629
|
+
var SignatureButtonsContainer = styled(ButtonsRow)(templateObject_4$4 || (templateObject_4$4 = __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"])));
|
|
20630
|
+
var templateObject_1$b, templateObject_2$9, templateObject_3$9, templateObject_4$4;
|
|
20563
20631
|
|
|
20564
20632
|
var SignatureCapture = function SignatureCapture(_a) {
|
|
20565
20633
|
var _b;
|
|
@@ -20630,8 +20698,8 @@
|
|
|
20630
20698
|
finished: true
|
|
20631
20699
|
}, verbiage.acceptBtnText)))));
|
|
20632
20700
|
};
|
|
20633
|
-
var AcceptBtn$1 = styled(LoaderButton)(templateObject_1$
|
|
20634
|
-
var templateObject_1$
|
|
20701
|
+
var AcceptBtn$1 = styled(LoaderButton)(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
20702
|
+
var templateObject_1$a;
|
|
20635
20703
|
|
|
20636
20704
|
var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
|
|
20637
20705
|
if (mergeAVStreams === void 0) {
|
|
@@ -20991,11 +21059,11 @@
|
|
|
20991
21059
|
className: classNames.signatureCanvas
|
|
20992
21060
|
};
|
|
20993
21061
|
}, [classNames.signatureCanvas, height, width]);
|
|
20994
|
-
return /*#__PURE__*/React.createElement(Container, {
|
|
21062
|
+
return /*#__PURE__*/React.createElement(Container$1, {
|
|
20995
21063
|
className: classNames.container
|
|
20996
|
-
}, /*#__PURE__*/React.createElement(Inner, {
|
|
21064
|
+
}, /*#__PURE__*/React.createElement(Inner$1, {
|
|
20997
21065
|
className: classNames.inner
|
|
20998
|
-
}, /*#__PURE__*/React.createElement(FaceGuideContainer, {
|
|
21066
|
+
}, /*#__PURE__*/React.createElement(FaceGuideContainer$1, {
|
|
20999
21067
|
className: classNames.faceGuideContainer
|
|
21000
21068
|
}, /*#__PURE__*/React.createElement(StyledSelfieCaptureAnimatedMask, {
|
|
21001
21069
|
className: classNames.faceGuide,
|
|
@@ -21030,19 +21098,19 @@
|
|
|
21030
21098
|
finished: true
|
|
21031
21099
|
}, verbiage.acceptSignatureBtnText))))));
|
|
21032
21100
|
}
|
|
21033
|
-
var Container = styled.div(templateObject_1$
|
|
21101
|
+
var Container$1 = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n width: 100dvw;\n height: 100dvh;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n width: 100dvw;\n height: 100dvh;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
|
|
21034
21102
|
var _a;
|
|
21035
21103
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
21036
21104
|
});
|
|
21037
|
-
var Inner = styled.div(templateObject_2$
|
|
21038
|
-
var FaceGuideContainer = styled.div(templateObject_3$
|
|
21039
|
-
var StyledSelfieCaptureAnimatedMask = styled(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$
|
|
21040
|
-
var SignaturePadContainer = styled.div(templateObject_5$
|
|
21041
|
-
var SignatureCanvasContainer = styled.div(templateObject_6$
|
|
21105
|
+
var Inner$1 = styled.div(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n"])));
|
|
21106
|
+
var FaceGuideContainer$1 = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n position: relative;\n height: 50%;\n"], ["\n position: relative;\n height: 50%;\n"])));
|
|
21107
|
+
var StyledSelfieCaptureAnimatedMask = styled(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n max-width: 100%;\n height: 100%;\n"], ["\n max-width: 100%;\n height: 100%;\n"])));
|
|
21108
|
+
var SignaturePadContainer = styled.div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n position: relative;\n max-width: 100%;\n height: 50%;\n aspect-ratio: 2;\n"], ["\n position: relative;\n max-width: 100%;\n height: 50%;\n aspect-ratio: 2;\n"])));
|
|
21109
|
+
var SignatureCanvasContainer = styled.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n"])), function (props) {
|
|
21042
21110
|
return props.$disabled ? 'opacity: 0.5; pointer-events: none;' : '';
|
|
21043
21111
|
});
|
|
21044
|
-
var AcceptBtn = styled(LoaderButton)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
21045
|
-
var templateObject_1$
|
|
21112
|
+
var AcceptBtn = styled(LoaderButton)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
21113
|
+
var templateObject_1$9, templateObject_2$8, templateObject_3$8, templateObject_4$3, templateObject_5$2, templateObject_6$2, templateObject_7$1;
|
|
21046
21114
|
|
|
21047
21115
|
var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
21048
21116
|
var _b, _c, _d;
|
|
@@ -21170,8 +21238,8 @@
|
|
|
21170
21238
|
finished: true
|
|
21171
21239
|
}, verbiage.doneBtnText))));
|
|
21172
21240
|
};
|
|
21173
|
-
var StyledVideo$1 = styled.video(templateObject_1$
|
|
21174
|
-
var templateObject_1$
|
|
21241
|
+
var StyledVideo$1 = styled.video(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"], ["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"])));
|
|
21242
|
+
var templateObject_1$8;
|
|
21175
21243
|
|
|
21176
21244
|
var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
21177
21245
|
var _b;
|
|
@@ -21364,6 +21432,127 @@
|
|
|
21364
21432
|
}()));
|
|
21365
21433
|
};
|
|
21366
21434
|
|
|
21435
|
+
var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
|
|
21436
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
21437
|
+
var _0 = _a.requestedAction,
|
|
21438
|
+
requestedAction = _0 === void 0 ? 'SHOW_ID_FRONT' : _0,
|
|
21439
|
+
_1 = _a.satisfied,
|
|
21440
|
+
satisfied = _1 === void 0 ? false : _1,
|
|
21441
|
+
_2 = _a.faceGuideStatus,
|
|
21442
|
+
faceGuideStatus = _2 === void 0 ? 'success' : _2,
|
|
21443
|
+
faceGuideBorderWidth = _a.faceGuideBorderWidth,
|
|
21444
|
+
faceGuideBorderColor = _a.faceGuideBorderColor,
|
|
21445
|
+
_3 = _a.idCardGuideStatus,
|
|
21446
|
+
idCardGuideStatus = _3 === void 0 ? 'ready' : _3,
|
|
21447
|
+
idCardGuideBorderWidth = _a.idCardGuideBorderWidth,
|
|
21448
|
+
idCardGuideBorderColor = _a.idCardGuideBorderColor,
|
|
21449
|
+
idCardCaptureProgress = _a.idCardCaptureProgress,
|
|
21450
|
+
_4 = _a.idCardCaptureGuideImages,
|
|
21451
|
+
userSuppliedImages = _4 === void 0 ? defaultIdCaptureGuideImages : _4,
|
|
21452
|
+
_5 = _a.classNames,
|
|
21453
|
+
classNames = _5 === void 0 ? {} : _5,
|
|
21454
|
+
_6 = _a.verbiage,
|
|
21455
|
+
rawVerbiage = _6 === void 0 ? {} : _6;
|
|
21456
|
+
var cameraRef = React.useContext(CameraStateContext).cameraRef;
|
|
21457
|
+
var verbiage = useTranslations(rawVerbiage, {
|
|
21458
|
+
idFrontInstructionText: 'Display the front of your ID card...',
|
|
21459
|
+
idBackInstructionText: 'Display the back of your ID card...',
|
|
21460
|
+
flipIdInstructionText: 'Please flip your ID card...',
|
|
21461
|
+
verifyLivenessInstructionText: 'Performing facial recognition, please hold still...'
|
|
21462
|
+
});
|
|
21463
|
+
var instructionText = requestedAction === 'VERIFY_LIVENESS' ? verbiage.verifyLivenessInstructionText : requestedAction === 'SHOW_ID_FRONT' ? verbiage.idFrontInstructionText : requestedAction === 'FLIP_ID' ? verbiage.flipIdInstructionText : verbiage.idBackInstructionText;
|
|
21464
|
+
var theme = styled.useTheme();
|
|
21465
|
+
if (faceGuideBorderWidth === undefined) faceGuideBorderWidth = (_d = (_c = (_b = theme.idVideoCapture) === null || _b === void 0 ? void 0 : _b.faceGuides) === null || _c === void 0 ? void 0 : _c.borderWidth) !== null && _d !== void 0 ? _d : 5;
|
|
21466
|
+
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 : '#D6DCE7';
|
|
21467
|
+
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 : 20;
|
|
21468
|
+
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 : '#D6DCE7';
|
|
21469
|
+
var _7 = useResizeObserver(),
|
|
21470
|
+
idCardGuideRef = _7.ref,
|
|
21471
|
+
_8 = _7.width,
|
|
21472
|
+
idCardGuideWidth = _8 === void 0 ? 0 : _8,
|
|
21473
|
+
_9 = _7.height,
|
|
21474
|
+
idCardGuideHeight = _9 === void 0 ? 0 : _9;
|
|
21475
|
+
var idCaptureGuideImages = useGuideImages(userSuppliedImages);
|
|
21476
|
+
var idCaptureGuideImagesByUrl = useGuideImagesByUrl(idCaptureGuideImages);
|
|
21477
|
+
var _10 = React.useState(undefined),
|
|
21478
|
+
aspectRatio = _10[0],
|
|
21479
|
+
setAspectRatio = _10[1];
|
|
21480
|
+
var onImageLoaded = React.useCallback(function (e) {
|
|
21481
|
+
var _a, _b, _c, _d;
|
|
21482
|
+
var img = e.currentTarget;
|
|
21483
|
+
var imageByUrl = idCaptureGuideImagesByUrl[img.src];
|
|
21484
|
+
var naturalWidth = (_b = (_a = imageByUrl === null || imageByUrl === void 0 ? void 0 : imageByUrl.width) !== null && _a !== void 0 ? _a : img.naturalWidth) !== null && _b !== void 0 ? _b : 0;
|
|
21485
|
+
var naturalHeight = (_d = (_c = imageByUrl === null || imageByUrl === void 0 ? void 0 : imageByUrl.height) !== null && _c !== void 0 ? _c : img.naturalHeight) !== null && _d !== void 0 ? _d : 0;
|
|
21486
|
+
setAspectRatio(naturalHeight > 0 ? naturalWidth / naturalHeight : undefined);
|
|
21487
|
+
}, [idCaptureGuideImagesByUrl]);
|
|
21488
|
+
var idCardImageStyle = React.useMemo(function () {
|
|
21489
|
+
return {
|
|
21490
|
+
maxWidth: idCardGuideWidth > idCardGuideHeight ? idCardGuideWidth : undefined,
|
|
21491
|
+
maxHeight: idCardGuideHeight > idCardGuideWidth ? idCardGuideHeight : undefined,
|
|
21492
|
+
height: '100%',
|
|
21493
|
+
aspectRatio: aspectRatio
|
|
21494
|
+
};
|
|
21495
|
+
}, [idCardGuideWidth, idCardGuideHeight, aspectRatio]);
|
|
21496
|
+
var disableIdGuides = ((_u = (_t = theme.idVideoCapture) === null || _t === void 0 ? void 0 : _t.idCardGuides) === null || _u === void 0 ? void 0 : _u.disableDuringLivenessCheck) && requestedAction === 'VERIFY_LIVENESS';
|
|
21497
|
+
return /*#__PURE__*/React.createElement(Container, {
|
|
21498
|
+
className: classNames.container
|
|
21499
|
+
}, /*#__PURE__*/React.createElement(Inner, null, /*#__PURE__*/React.createElement(FaceGuideContainer, {
|
|
21500
|
+
className: classNames.faceGuideContainer
|
|
21501
|
+
}, /*#__PURE__*/React.createElement(SelfieCaptureAnimatedMaskWithStatus, {
|
|
21502
|
+
className: classNames.faceGuide,
|
|
21503
|
+
status: requestedAction === 'VERIFY_LIVENESS' ? faceGuideStatus : 'success',
|
|
21504
|
+
borderWidth: faceGuideBorderWidth,
|
|
21505
|
+
borderColor: faceGuideBorderColor,
|
|
21506
|
+
verticalAlign: "bottom"
|
|
21507
|
+
})), !disableIdGuides && ( /*#__PURE__*/React.createElement(IdCardGuideContainer, {
|
|
21508
|
+
className: classNames.idCardGuideContainer,
|
|
21509
|
+
ref: idCardGuideRef
|
|
21510
|
+
}, /*#__PURE__*/React.createElement(IdCardGuideInner, {
|
|
21511
|
+
className: classNames.idCardGuideInner,
|
|
21512
|
+
style: {
|
|
21513
|
+
aspectRatio: aspectRatio
|
|
21514
|
+
}
|
|
21515
|
+
}, /*#__PURE__*/React.createElement(IdCardGuideImageContainer, {
|
|
21516
|
+
className: classNames.idCardGuideImageContainer,
|
|
21517
|
+
status: requestedAction === 'VERIFY_LIVENESS' ? 'disabled' : idCardGuideStatus,
|
|
21518
|
+
borderWidth: idCardGuideBorderWidth,
|
|
21519
|
+
borderColor: idCardGuideBorderColor,
|
|
21520
|
+
aspectRatio: aspectRatio,
|
|
21521
|
+
"$isVisible": requestedAction !== 'FLIP_ID',
|
|
21522
|
+
progress: requestedAction === 'VERIFY_LIVENESS' ? undefined : idCardCaptureProgress
|
|
21523
|
+
}, /*#__PURE__*/React.createElement(IdCardGuideImage, {
|
|
21524
|
+
alt: "",
|
|
21525
|
+
className: classNames.idCardGuideImage,
|
|
21526
|
+
"$isMirrored": !((_v = cameraRef.current) === null || _v === void 0 ? void 0 : _v.isRearFacing),
|
|
21527
|
+
style: idCardImageStyle,
|
|
21528
|
+
src: requestedAction === 'SHOW_ID_BACK' ? idCaptureGuideImages.landscape.SHOW_ID_BACK.url : idCaptureGuideImages.landscape.SHOW_ID_FRONT.url,
|
|
21529
|
+
onLoad: onImageLoaded
|
|
21530
|
+
})), requestedAction === 'FLIP_ID' && ( /*#__PURE__*/React.createElement(IdVideoCaptureFlipIdPrompt, {
|
|
21531
|
+
idCaptureGuideImages: idCaptureGuideImages,
|
|
21532
|
+
classNames: classNames.flipIdPrompt,
|
|
21533
|
+
borderWidth: idCardGuideBorderWidth,
|
|
21534
|
+
borderColor: idCardGuideBorderColor,
|
|
21535
|
+
imageStyle: idCardImageStyle
|
|
21536
|
+
}))), /*#__PURE__*/React.createElement(IdCardGuideInstructionsContainer, {
|
|
21537
|
+
className: classNames.idCardGuideInstructionsContainer
|
|
21538
|
+
}, /*#__PURE__*/React.createElement(IdCardGuideInstructions, {
|
|
21539
|
+
className: classNames.idCardGuideInstructions,
|
|
21540
|
+
"$textColor": (_x = (_w = theme.idVideoCapture) === null || _w === void 0 ? void 0 : _w.idCardGuides) === null || _x === void 0 ? void 0 : _x.instructionsTextColor,
|
|
21541
|
+
"$background": (_z = (_y = theme.idVideoCapture) === null || _y === void 0 ? void 0 : _y.idCardGuides) === null || _z === void 0 ? void 0 : _z.instructionsBackgroundColor
|
|
21542
|
+
}, instructionText))))));
|
|
21543
|
+
};
|
|
21544
|
+
var Container = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n width: 100dvw;\n height: 100dvh;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n width: 100dvw;\n height: 100dvh;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
|
|
21545
|
+
var _a;
|
|
21546
|
+
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
21547
|
+
});
|
|
21548
|
+
var Inner = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
21549
|
+
var FaceGuideContainer = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n position: relative;\n height: 65%;\n"], ["\n position: relative;\n height: 65%;\n"])));
|
|
21550
|
+
var IdCardGuideContainer = styled.div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n margin: 0 auto;\n position: relative;\n max-width: 100%;\n height: 35%;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n margin: 0 auto;\n position: relative;\n max-width: 100%;\n height: 35%;\n"])));
|
|
21551
|
+
var IdCardGuideInner = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n width: 100%;\n"], ["\n position: relative;\n height: 100%;\n width: 100%;\n"])));
|
|
21552
|
+
var IdCardGuideInstructionsContainer = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n padding: 0 40px;\n position: fixed;\n bottom: 14px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"], ["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n padding: 0 40px;\n position: fixed;\n bottom: 14px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"])));
|
|
21553
|
+
var IdCardGuideInstructions = styled(GuidanceMessage)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-content: center;\n margin: 12px auto;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"], ["\n align-content: center;\n margin: 12px auto;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"])));
|
|
21554
|
+
var templateObject_1$7, templateObject_2$7, templateObject_3$7, templateObject_4$2, templateObject_5$1, templateObject_6$1, templateObject_7;
|
|
21555
|
+
|
|
21367
21556
|
var ReadTextPrompt = function ReadTextPrompt(_a) {
|
|
21368
21557
|
var text = _a.text,
|
|
21369
21558
|
onComplete = _a.onComplete,
|
|
@@ -21503,90 +21692,90 @@
|
|
|
21503
21692
|
onExitCapture = _a.onExitCapture,
|
|
21504
21693
|
_x = _a.idCaptureModelsEnabled,
|
|
21505
21694
|
idCaptureModelsEnabled = _x === void 0 ? true : _x,
|
|
21506
|
-
|
|
21507
|
-
|
|
21508
|
-
|
|
21509
|
-
idCardFrontDelay =
|
|
21510
|
-
|
|
21511
|
-
videoIdCaptureThresholds =
|
|
21512
|
-
|
|
21513
|
-
skipShowIdCardBack =
|
|
21514
|
-
|
|
21515
|
-
captureCountdownSeconds =
|
|
21695
|
+
_y = _a.idCardCaptureGuideImages,
|
|
21696
|
+
idCardCaptureGuideImages = _y === void 0 ? defaultIdCaptureGuideImages : _y,
|
|
21697
|
+
_z = _a.idCardFrontDelay,
|
|
21698
|
+
idCardFrontDelay = _z === void 0 ? 1000 : _z,
|
|
21699
|
+
_0 = _a.videoIdCaptureThresholds,
|
|
21700
|
+
videoIdCaptureThresholds = _0 === void 0 ? defaultVideoIdCaptureThresholds : _0,
|
|
21701
|
+
_1 = _a.skipShowIdCardBack,
|
|
21702
|
+
skipShowIdCardBack = _1 === void 0 ? false : _1,
|
|
21703
|
+
_2 = _a.captureCountdownSeconds,
|
|
21704
|
+
captureCountdownSeconds = _2 === void 0 ? 3 : _2,
|
|
21516
21705
|
readTextPrompt = _a.readTextPrompt,
|
|
21517
|
-
|
|
21518
|
-
readTextTimeoutDurationMs =
|
|
21519
|
-
|
|
21520
|
-
readTextMinReadingMs =
|
|
21521
|
-
|
|
21522
|
-
disableFaceDetectionWhileAudioCapture =
|
|
21523
|
-
|
|
21524
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
21525
|
-
|
|
21526
|
-
mergeAVStreams =
|
|
21527
|
-
|
|
21528
|
-
classNames =
|
|
21529
|
-
|
|
21530
|
-
|
|
21531
|
-
|
|
21532
|
-
rawVerbiage =
|
|
21533
|
-
|
|
21534
|
-
debugMode =
|
|
21535
|
-
var
|
|
21536
|
-
ref =
|
|
21537
|
-
|
|
21538
|
-
width =
|
|
21539
|
-
|
|
21540
|
-
height =
|
|
21541
|
-
var
|
|
21542
|
-
cameraRef =
|
|
21543
|
-
videoRef =
|
|
21544
|
-
videoLoaded =
|
|
21545
|
-
cameraReady =
|
|
21546
|
-
microphoneReady =
|
|
21547
|
-
audioStream =
|
|
21548
|
-
setVideoLoaded =
|
|
21549
|
-
var
|
|
21550
|
-
detectedObjects =
|
|
21551
|
-
setDetectedObjects =
|
|
21552
|
-
var _15 = React.useState(null),
|
|
21553
|
-
face = _15[0],
|
|
21554
|
-
setFace = _15[1];
|
|
21555
|
-
var _16 = React.useContext(IdCaptureModelsContext),
|
|
21556
|
-
idModelsReady = _16.ready,
|
|
21557
|
-
startIdModels = _16.start,
|
|
21558
|
-
stopIdModels = _16.stop,
|
|
21559
|
-
onIdPredictionMade = _16.onPredictionMade,
|
|
21560
|
-
setThresholds = _16.setThresholds,
|
|
21561
|
-
setDocumentDetectionBoundaries = _16.setDocumentDetectionBoundaries,
|
|
21562
|
-
bestFrameDetails = _16.bestFrameDetails,
|
|
21563
|
-
resetBestFrame = _16.resetBestFrame,
|
|
21564
|
-
idModelError = _16.modelError;
|
|
21706
|
+
_3 = _a.readTextTimeoutDurationMs,
|
|
21707
|
+
readTextTimeoutDurationMs = _3 === void 0 ? 15000 : _3,
|
|
21708
|
+
_4 = _a.readTextMinReadingMs,
|
|
21709
|
+
readTextMinReadingMs = _4 === void 0 ? 10000 : _4,
|
|
21710
|
+
_5 = _a.disableFaceDetectionWhileAudioCapture,
|
|
21711
|
+
disableFaceDetectionWhileAudioCapture = _5 === void 0 ? false : _5,
|
|
21712
|
+
_6 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
21713
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _6 === void 0 ? 2000 : _6,
|
|
21714
|
+
_7 = _a.mergeAVStreams,
|
|
21715
|
+
mergeAVStreams = _7 === void 0 ? false : _7,
|
|
21716
|
+
_8 = _a.classNames,
|
|
21717
|
+
classNames = _8 === void 0 ? {} : _8,
|
|
21718
|
+
_9 = _a.colors,
|
|
21719
|
+
colors = _9 === void 0 ? {} : _9,
|
|
21720
|
+
_10 = _a.verbiage,
|
|
21721
|
+
rawVerbiage = _10 === void 0 ? {} : _10,
|
|
21722
|
+
_11 = _a.debugMode,
|
|
21723
|
+
debugMode = _11 === void 0 ? false : _11;
|
|
21724
|
+
var _12 = useResizeObserver(),
|
|
21725
|
+
ref = _12.ref,
|
|
21726
|
+
_13 = _12.width,
|
|
21727
|
+
width = _13 === void 0 ? 1 : _13,
|
|
21728
|
+
_14 = _12.height,
|
|
21729
|
+
height = _14 === void 0 ? 1 : _14;
|
|
21730
|
+
var _15 = React.useContext(CameraStateContext),
|
|
21731
|
+
cameraRef = _15.cameraRef,
|
|
21732
|
+
videoRef = _15.videoRef,
|
|
21733
|
+
videoLoaded = _15.videoLoaded,
|
|
21734
|
+
cameraReady = _15.cameraReady,
|
|
21735
|
+
microphoneReady = _15.microphoneReady,
|
|
21736
|
+
audioStream = _15.audioStream,
|
|
21737
|
+
setVideoLoaded = _15.setVideoLoaded;
|
|
21738
|
+
var _16 = React.useState([]),
|
|
21739
|
+
detectedObjects = _16[0],
|
|
21740
|
+
setDetectedObjects = _16[1];
|
|
21565
21741
|
var _17 = React.useState(null),
|
|
21566
|
-
|
|
21567
|
-
|
|
21568
|
-
var _18 = React.useContext(
|
|
21569
|
-
|
|
21570
|
-
|
|
21571
|
-
|
|
21572
|
-
|
|
21573
|
-
|
|
21574
|
-
|
|
21575
|
-
|
|
21576
|
-
|
|
21577
|
-
|
|
21578
|
-
|
|
21579
|
-
|
|
21580
|
-
|
|
21581
|
-
|
|
21582
|
-
|
|
21583
|
-
|
|
21584
|
-
|
|
21585
|
-
|
|
21742
|
+
face = _17[0],
|
|
21743
|
+
setFace = _17[1];
|
|
21744
|
+
var _18 = React.useContext(IdCaptureModelsContext),
|
|
21745
|
+
idModelsReady = _18.ready,
|
|
21746
|
+
startIdModels = _18.start,
|
|
21747
|
+
stopIdModels = _18.stop,
|
|
21748
|
+
onIdPredictionMade = _18.onPredictionMade,
|
|
21749
|
+
setThresholds = _18.setThresholds,
|
|
21750
|
+
setDocumentDetectionBoundaries = _18.setDocumentDetectionBoundaries,
|
|
21751
|
+
bestFrameDetails = _18.bestFrameDetails,
|
|
21752
|
+
resetBestFrame = _18.resetBestFrame,
|
|
21753
|
+
idModelError = _18.modelError;
|
|
21754
|
+
var _19 = React.useState(null),
|
|
21755
|
+
videoStartsAt = _19[0],
|
|
21756
|
+
setVideoStartsAt = _19[1];
|
|
21757
|
+
var _20 = React.useContext(SubmissionContext),
|
|
21758
|
+
setIdCaptureVideoAudioStartsAt = _20.setIdCaptureVideoAudioStartsAt,
|
|
21759
|
+
setExpectedAudioText = _20.setExpectedAudioText;
|
|
21760
|
+
var _21 = React.useContext(SelfieGuidanceModelsContext),
|
|
21761
|
+
startSelfieGuidance = _21.start,
|
|
21762
|
+
stopSelfieGuidance = _21.stop,
|
|
21763
|
+
onSelfiePredictionMade = _21.onPredictionMade,
|
|
21764
|
+
selfieModelError = _21.error;
|
|
21765
|
+
var _22 = useVideoRecorder(cameraRef.current, audioStream, mergeAVStreams),
|
|
21766
|
+
isRecordingVideo = _22.isRecordingVideo,
|
|
21767
|
+
startRecordingVideo = _22.startRecordingVideo,
|
|
21768
|
+
startRecordingAudio = _22.startRecordingAudio,
|
|
21769
|
+
stopRecordingVideo = _22.stopRecordingVideo,
|
|
21770
|
+
stopRecordingAudio = _22.stopRecordingAudio,
|
|
21771
|
+
videoRecordingUnintentionallyStopped = _22.videoRecordingUnintentionallyStopped,
|
|
21772
|
+
audioRecordingUnintentionallyStopped = _22.audioRecordingUnintentionallyStopped,
|
|
21773
|
+
videoUrl = _22.videoUrl,
|
|
21774
|
+
audioUrl = _22.audioUrl;
|
|
21586
21775
|
var countdownTimeoutRef = React.useRef(undefined);
|
|
21587
|
-
var
|
|
21588
|
-
countdownRemaining =
|
|
21589
|
-
setCountdownRemaining =
|
|
21776
|
+
var _23 = React.useState(-1),
|
|
21777
|
+
countdownRemaining = _23[0],
|
|
21778
|
+
setCountdownRemaining = _23[1];
|
|
21590
21779
|
React.useEffect(function () {
|
|
21591
21780
|
if (!isRecordingVideo && !videoUrl) {
|
|
21592
21781
|
startRecordingVideo();
|
|
@@ -21606,9 +21795,9 @@
|
|
|
21606
21795
|
onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
|
|
21607
21796
|
}
|
|
21608
21797
|
}, [audioRecordingUnintentionallyStopped, onRecordingFailed, videoRecordingUnintentionallyStopped]);
|
|
21609
|
-
var
|
|
21610
|
-
requestedAction =
|
|
21611
|
-
setRequestedAction =
|
|
21798
|
+
var _24 = React.useState('SHOW_ID_FRONT'),
|
|
21799
|
+
requestedAction = _24[0],
|
|
21800
|
+
setRequestedAction = _24[1];
|
|
21612
21801
|
var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
|
|
21613
21802
|
React.useEffect(function startModelsWhenCapturing() {
|
|
21614
21803
|
if (!shouldRunIdModels) return;
|
|
@@ -21628,18 +21817,18 @@
|
|
|
21628
21817
|
bottom: 1
|
|
21629
21818
|
});
|
|
21630
21819
|
}, [setDocumentDetectionBoundaries]);
|
|
21631
|
-
var _23 = React.useState(0),
|
|
21632
|
-
currentDetectionScore = _23[0],
|
|
21633
|
-
setCurrentDetectionScore = _23[1];
|
|
21634
|
-
var _24 = React.useState('none'),
|
|
21635
|
-
currentDetectedDocumentType = _24[0],
|
|
21636
|
-
setCurrentDetectedDocumentType = _24[1];
|
|
21637
21820
|
var _25 = React.useState(0),
|
|
21638
|
-
|
|
21639
|
-
|
|
21640
|
-
var _26 = React.useState(
|
|
21641
|
-
|
|
21642
|
-
|
|
21821
|
+
currentDetectionScore = _25[0],
|
|
21822
|
+
setCurrentDetectionScore = _25[1];
|
|
21823
|
+
var _26 = React.useState('none'),
|
|
21824
|
+
currentDetectedDocumentType = _26[0],
|
|
21825
|
+
setCurrentDetectedDocumentType = _26[1];
|
|
21826
|
+
var _27 = React.useState(0),
|
|
21827
|
+
currentFocusScore = _27[0],
|
|
21828
|
+
setCurrentFocusScore = _27[1];
|
|
21829
|
+
var _28 = React.useState(0),
|
|
21830
|
+
goodFramesCount = _28[0],
|
|
21831
|
+
setGoodFramesCount = _28[1];
|
|
21643
21832
|
var goodFramesThreshold = requestedAction === 'SHOW_ID_FRONT' ? videoIdCaptureThresholds.goodFrames.idCardFront : videoIdCaptureThresholds.goodFrames.idCardBack;
|
|
21644
21833
|
var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
|
|
21645
21834
|
React.useEffect(function () {
|
|
@@ -21660,9 +21849,9 @@
|
|
|
21660
21849
|
} : 0);
|
|
21661
21850
|
});
|
|
21662
21851
|
}, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, videoIdCaptureThresholds.flipShortcutThreshold]);
|
|
21663
|
-
var
|
|
21664
|
-
idFrontCaptureStartedAt =
|
|
21665
|
-
setFirstGoodFrameTime =
|
|
21852
|
+
var _29 = React.useState(null),
|
|
21853
|
+
idFrontCaptureStartedAt = _29[0],
|
|
21854
|
+
setFirstGoodFrameTime = _29[1];
|
|
21666
21855
|
React.useEffect(function () {
|
|
21667
21856
|
if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
|
|
21668
21857
|
}, [goodFramesCount]);
|
|
@@ -21683,9 +21872,9 @@
|
|
|
21683
21872
|
var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
|
|
21684
21873
|
var faceBox = face === null || face === void 0 ? void 0 : face.box;
|
|
21685
21874
|
var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
|
|
21686
|
-
var
|
|
21687
|
-
countdownStartedAt =
|
|
21688
|
-
setCountdownStartedAt =
|
|
21875
|
+
var _30 = React.useState(),
|
|
21876
|
+
countdownStartedAt = _30[0],
|
|
21877
|
+
setCountdownStartedAt = _30[1];
|
|
21689
21878
|
var photoCanvas = React.useRef(null);
|
|
21690
21879
|
var frameLock = React.useRef(false);
|
|
21691
21880
|
var captureFrame = React.useCallback(function () {
|
|
@@ -21808,9 +21997,9 @@
|
|
|
21808
21997
|
stopSelfieGuidance();
|
|
21809
21998
|
};
|
|
21810
21999
|
}, [startSelfieGuidance, stopSelfieGuidance]);
|
|
21811
|
-
var
|
|
21812
|
-
numFramesWithoutFaces =
|
|
21813
|
-
setNumFramesWithoutFaces =
|
|
22000
|
+
var _31 = React.useState(0),
|
|
22001
|
+
numFramesWithoutFaces = _31[0],
|
|
22002
|
+
setNumFramesWithoutFaces = _31[1];
|
|
21814
22003
|
onSelfiePredictionMade(f(React.useCallback(function (_a) {
|
|
21815
22004
|
var face = _a.face;
|
|
21816
22005
|
if (selfieModelError) return;
|
|
@@ -21826,12 +22015,12 @@
|
|
|
21826
22015
|
}
|
|
21827
22016
|
}, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
|
|
21828
22017
|
var theme = styled.useTheme();
|
|
21829
|
-
var
|
|
22018
|
+
var _32 = useTranslations(rawVerbiage, {
|
|
21830
22019
|
faceNotCenteredText: 'Please move your face to the center...',
|
|
21831
22020
|
captureBtnText: 'Capture'
|
|
21832
22021
|
}),
|
|
21833
|
-
captureBtnText =
|
|
21834
|
-
faceNotCenteredText =
|
|
22022
|
+
captureBtnText = _32.captureBtnText,
|
|
22023
|
+
faceNotCenteredText = _32.faceNotCenteredText;
|
|
21835
22024
|
var debugScalingDetails = useDebugScalingDetails({
|
|
21836
22025
|
enabled: debugMode,
|
|
21837
22026
|
pageWidth: width,
|
|
@@ -21856,7 +22045,17 @@
|
|
|
21856
22045
|
classNames: classNames.readTextPrompt,
|
|
21857
22046
|
verbiage: rawVerbiage.readTextPrompt,
|
|
21858
22047
|
onComplete: stopRecording
|
|
21859
|
-
})) : ( /*#__PURE__*/React.createElement(React.Fragment, null,
|
|
22048
|
+
})) : ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IdVideoCaptureGuides, {
|
|
22049
|
+
classNames: classNames.guides,
|
|
22050
|
+
verbiage: rawVerbiage.guides,
|
|
22051
|
+
requestedAction: requestedAction,
|
|
22052
|
+
satisfied: satisfied,
|
|
22053
|
+
idCardGuideStatus: countdownStartedAt ? 'capturing' : 'ready',
|
|
22054
|
+
idCardCaptureProgress: !!countdownStartedAt ? 1 : 0,
|
|
22055
|
+
idCardCaptureGuideImages: idCardCaptureGuideImages,
|
|
22056
|
+
faceGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor,
|
|
22057
|
+
idCardGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor
|
|
22058
|
+
}), debugMode && capturingId && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ObjectDetectionDebugOverlayDiv, {
|
|
21860
22059
|
"$flipX": !((_l = cameraRef.current) === null || _l === void 0 ? void 0 : _l.isRearFacing)
|
|
21861
22060
|
}, detectedObjects.map(function (obj, i) {
|
|
21862
22061
|
var _a;
|
|
@@ -22156,27 +22355,18 @@
|
|
|
22156
22355
|
onExitCapture === null || onExitCapture === void 0 ? void 0 : onExitCapture();
|
|
22157
22356
|
}, [onExitCapture]);
|
|
22158
22357
|
var faceLivenessGuides = React.useCallback(function (_a) {
|
|
22159
|
-
|
|
22160
|
-
|
|
22161
|
-
|
|
22162
|
-
|
|
22163
|
-
|
|
22164
|
-
|
|
22165
|
-
|
|
22166
|
-
|
|
22167
|
-
|
|
22168
|
-
|
|
22169
|
-
|
|
22170
|
-
|
|
22171
|
-
// }
|
|
22172
|
-
// idCardGuideStatus="disabled"
|
|
22173
|
-
// // idCardGuideBorderColor={
|
|
22174
|
-
// // status === 'success'
|
|
22175
|
-
// // ? colors.idVideoCapture?.guidesSatisfiedColor
|
|
22176
|
-
// // : colors.idVideoCapture?.guidesUnsatisfiedColor
|
|
22177
|
-
// // }
|
|
22178
|
-
// />
|
|
22179
|
-
[(_b = classNames.idVideoCapture) === null || _b === void 0 ? void 0 : _b.guides, (_c = colors.idVideoCapture) === null || _c === void 0 ? void 0 : _c.guidesSatisfiedColor, (_d = colors.idVideoCapture) === null || _d === void 0 ? void 0 : _d.guidesUnsatisfiedColor, idCaptureGuideImages, (_e = verbiage.idVideoCapture) === null || _e === void 0 ? void 0 : _e.guides]);
|
|
22358
|
+
var _b, _c, _d, _e;
|
|
22359
|
+
var status = _a.status;
|
|
22360
|
+
return /*#__PURE__*/React.createElement(IdVideoCaptureGuides, {
|
|
22361
|
+
idCardCaptureGuideImages: idCaptureGuideImages,
|
|
22362
|
+
classNames: (_b = classNames.idVideoCapture) === null || _b === void 0 ? void 0 : _b.guides,
|
|
22363
|
+
verbiage: (_c = verbiage.idVideoCapture) === null || _c === void 0 ? void 0 : _c.guides,
|
|
22364
|
+
requestedAction: "VERIFY_LIVENESS",
|
|
22365
|
+
faceGuideStatus: status,
|
|
22366
|
+
faceGuideBorderColor: status === 'success' ? (_d = colors.idVideoCapture) === null || _d === void 0 ? void 0 : _d.guidesSatisfiedColor : (_e = colors.idVideoCapture) === null || _e === void 0 ? void 0 : _e.guidesUnsatisfiedColor,
|
|
22367
|
+
idCardGuideStatus: "disabled"
|
|
22368
|
+
});
|
|
22369
|
+
}, [(_b = classNames.idVideoCapture) === null || _b === void 0 ? void 0 : _b.guides, (_c = colors.idVideoCapture) === null || _c === void 0 ? void 0 : _c.guidesSatisfiedColor, (_d = colors.idVideoCapture) === null || _d === void 0 ? void 0 : _d.guidesUnsatisfiedColor, idCaptureGuideImages, (_e = verbiage.idVideoCapture) === null || _e === void 0 ? void 0 : _e.guides]);
|
|
22180
22370
|
if (submissionStatus === SubmissionStatus.SUBMITTING) {
|
|
22181
22371
|
return /*#__PURE__*/React.createElement(PageContainer, {
|
|
22182
22372
|
className: "flex"
|