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
package/dist/sdk2.esm.js
CHANGED
|
@@ -201,7 +201,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
201
201
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
202
202
|
};
|
|
203
203
|
|
|
204
|
-
var webSdkVersion = '2.2.
|
|
204
|
+
var webSdkVersion = '2.2.35';
|
|
205
205
|
|
|
206
206
|
function getPlatform() {
|
|
207
207
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -362,7 +362,7 @@ function videoDataUrlToB64(url) {
|
|
|
362
362
|
});
|
|
363
363
|
}
|
|
364
364
|
|
|
365
|
-
var PageContainerDiv = styled.div(templateObject_1$
|
|
365
|
+
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) {
|
|
366
366
|
var _a;
|
|
367
367
|
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 ");
|
|
368
368
|
}, function (props) {
|
|
@@ -402,7 +402,7 @@ var PageContainer = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
402
402
|
}, dimensionsCalculated && children);
|
|
403
403
|
});
|
|
404
404
|
PageContainer.displayName = 'PageContainer';
|
|
405
|
-
var templateObject_1$
|
|
405
|
+
var templateObject_1$L;
|
|
406
406
|
|
|
407
407
|
var LoaderButton = function LoaderButton(_a) {
|
|
408
408
|
var children = _a.children,
|
|
@@ -461,30 +461,30 @@ var LoaderButton = function LoaderButton(_a) {
|
|
|
461
461
|
className: "ladda-label"
|
|
462
462
|
}, children));
|
|
463
463
|
};
|
|
464
|
-
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) {
|
|
464
|
+
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) {
|
|
465
465
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
466
466
|
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 ");
|
|
467
467
|
});
|
|
468
|
-
var templateObject_1$
|
|
468
|
+
var templateObject_1$K;
|
|
469
469
|
|
|
470
|
-
var OverlayContainer = styled(PageContainer)(templateObject_1$
|
|
470
|
+
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) {
|
|
471
471
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
472
472
|
}, function (props) {
|
|
473
473
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
474
474
|
});
|
|
475
|
-
var OverlayInner$2 = styled.div(templateObject_2$
|
|
475
|
+
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) {
|
|
476
476
|
var _a;
|
|
477
477
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
478
478
|
}, function (props) {
|
|
479
479
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
480
480
|
});
|
|
481
|
-
var OverlayImageContainer = styled.div(templateObject_3$
|
|
482
|
-
var OverlayImageRow = styled.div(templateObject_4$
|
|
483
|
-
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$
|
|
484
|
-
var ButtonsColumn = styled.div(templateObject_6$
|
|
485
|
-
var WideButton = styled(LoaderButton)(templateObject_7$
|
|
481
|
+
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"])));
|
|
482
|
+
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"])));
|
|
483
|
+
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
484
|
+
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"])));
|
|
485
|
+
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"])));
|
|
486
486
|
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"])));
|
|
487
|
-
var templateObject_1$
|
|
487
|
+
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;
|
|
488
488
|
|
|
489
489
|
var GeolocationAccessDeniedOverlay = function GeolocationAccessDeniedOverlay(_a) {
|
|
490
490
|
var accessBlockedImageUrl = _a.accessBlockedImageUrl;
|
|
@@ -731,13 +731,13 @@ var SessionValidationErrorOverlay = function SessionValidationErrorOverlay(_a) {
|
|
|
731
731
|
}, retryText)))));
|
|
732
732
|
};
|
|
733
733
|
|
|
734
|
-
var wavesAnimation = keyframes(templateObject_1$
|
|
735
|
-
var progressBarAnimation = keyframes(templateObject_2$
|
|
736
|
-
var dualRingSpinnerAnimation = keyframes(templateObject_3$
|
|
737
|
-
var progressBorderAnimation = keyframes(templateObject_4$
|
|
738
|
-
var templateObject_1$
|
|
734
|
+
var wavesAnimation = 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"])));
|
|
735
|
+
var progressBarAnimation = 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"])));
|
|
736
|
+
var dualRingSpinnerAnimation = 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"])));
|
|
737
|
+
var progressBorderAnimation = keyframes(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
738
|
+
var templateObject_1$I, templateObject_2$z, templateObject_3$q, templateObject_4$k;
|
|
739
739
|
|
|
740
|
-
var Spinner = styled.div(templateObject_1$
|
|
740
|
+
var Spinner = 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) {
|
|
741
741
|
var $size = _a.$size;
|
|
742
742
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
743
743
|
}, function (_a) {
|
|
@@ -762,7 +762,7 @@ var Spinner = styled.div(templateObject_1$F || (templateObject_1$F = __makeTempl
|
|
|
762
762
|
var $color = _a.$color;
|
|
763
763
|
return $color !== null && $color !== void 0 ? $color : '#888';
|
|
764
764
|
}, dualRingSpinnerAnimation);
|
|
765
|
-
var templateObject_1$
|
|
765
|
+
var templateObject_1$H;
|
|
766
766
|
|
|
767
767
|
var defaultAuthUrl = 'https://portal-api.idmission.com';
|
|
768
768
|
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'];
|
|
@@ -1900,7 +1900,7 @@ function getFrameDimensions(frame) {
|
|
|
1900
1900
|
return [frameWidth, frameHeight];
|
|
1901
1901
|
}
|
|
1902
1902
|
|
|
1903
|
-
var InvisibleCanvas = styled.canvas(templateObject_1$
|
|
1903
|
+
var InvisibleCanvas = styled.canvas(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
1904
1904
|
function drawToCanvas(canvas, frame, width, height) {
|
|
1905
1905
|
if (!canvas) return;
|
|
1906
1906
|
var ctx = canvas.getContext('2d');
|
|
@@ -1920,7 +1920,7 @@ function clearCanvas(canvas) {
|
|
|
1920
1920
|
var _a;
|
|
1921
1921
|
(_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);
|
|
1922
1922
|
}
|
|
1923
|
-
var templateObject_1$
|
|
1923
|
+
var templateObject_1$G;
|
|
1924
1924
|
|
|
1925
1925
|
function listAvailableCameras(facingMode_1) {
|
|
1926
1926
|
return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
|
|
@@ -4651,12 +4651,12 @@ function DebugStatsPane(_a) {
|
|
|
4651
4651
|
if (!portalLocation) return element;
|
|
4652
4652
|
return /*#__PURE__*/createPortal(element, portalLocation);
|
|
4653
4653
|
}
|
|
4654
|
-
var DebugStatsPaneDiv = styled.span(templateObject_1$
|
|
4655
|
-
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$
|
|
4654
|
+
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"])));
|
|
4655
|
+
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) {
|
|
4656
4656
|
var $flipX = _a.$flipX;
|
|
4657
4657
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
4658
4658
|
});
|
|
4659
|
-
var ObjectDetectionDebugBox = styled.div(templateObject_3$
|
|
4659
|
+
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) {
|
|
4660
4660
|
var $color = _a.$color;
|
|
4661
4661
|
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
4662
4662
|
}, function (_a) {
|
|
@@ -4666,7 +4666,7 @@ var ObjectDetectionDebugBox = styled.div(templateObject_3$n || (templateObject_3
|
|
|
4666
4666
|
var $flipX = _a.$flipX;
|
|
4667
4667
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
4668
4668
|
});
|
|
4669
|
-
var FaceDetectionKeypointMarker = styled.div(templateObject_4$
|
|
4669
|
+
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) {
|
|
4670
4670
|
var $color = _a.$color;
|
|
4671
4671
|
return $color !== null && $color !== void 0 ? $color : 'red';
|
|
4672
4672
|
}, function (_a) {
|
|
@@ -4857,7 +4857,7 @@ function SelfieCaptureFaceKeypoint(_a) {
|
|
|
4857
4857
|
}
|
|
4858
4858
|
});
|
|
4859
4859
|
}
|
|
4860
|
-
var templateObject_1$
|
|
4860
|
+
var templateObject_1$F, templateObject_2$y, templateObject_3$p, templateObject_4$j;
|
|
4861
4861
|
|
|
4862
4862
|
var enTranslation = {};
|
|
4863
4863
|
|
|
@@ -5034,7 +5034,7 @@ function useTranslations(verbiage, fallbacks) {
|
|
|
5034
5034
|
}, [fallbacks, i18n.language, t, verbiage]);
|
|
5035
5035
|
}
|
|
5036
5036
|
|
|
5037
|
-
var GuidanceMessageContainerDiv = styled.div(templateObject_1$
|
|
5037
|
+
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) {
|
|
5038
5038
|
var $top = _a.$top;
|
|
5039
5039
|
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
5040
5040
|
}, function (_a) {
|
|
@@ -5047,14 +5047,14 @@ var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
|
5047
5047
|
if (!portalLocation) return element;
|
|
5048
5048
|
return /*#__PURE__*/createPortal(element, portalLocation);
|
|
5049
5049
|
};
|
|
5050
|
-
var GuidanceMessage = styled.div(templateObject_2$
|
|
5050
|
+
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) {
|
|
5051
5051
|
var _a, _b, _c, _d, _e, _f;
|
|
5052
5052
|
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';
|
|
5053
5053
|
}, function (props) {
|
|
5054
5054
|
var _a, _b, _c, _d, _e, _f;
|
|
5055
5055
|
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';
|
|
5056
5056
|
});
|
|
5057
|
-
var templateObject_1$
|
|
5057
|
+
var templateObject_1$E, templateObject_2$x;
|
|
5058
5058
|
|
|
5059
5059
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
5060
5060
|
var _b = _a.classNames,
|
|
@@ -5069,7 +5069,7 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
|
5069
5069
|
buttonText: 'OK'
|
|
5070
5070
|
});
|
|
5071
5071
|
if (!state.allowOverrideWrongDocumentTypeGuidance) return null;
|
|
5072
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
5072
|
+
return /*#__PURE__*/React__default.createElement(Container$2, {
|
|
5073
5073
|
className: classNames.container
|
|
5074
5074
|
}, /*#__PURE__*/React__default.createElement(InnerContainer, {
|
|
5075
5075
|
className: classNames.inner
|
|
@@ -5087,18 +5087,18 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
|
5087
5087
|
}
|
|
5088
5088
|
}, verbiage.buttonText))));
|
|
5089
5089
|
}
|
|
5090
|
-
var Container$
|
|
5090
|
+
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) {
|
|
5091
5091
|
var _a, _b, _c;
|
|
5092
5092
|
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';
|
|
5093
5093
|
}, function (props) {
|
|
5094
5094
|
var _a, _b, _c;
|
|
5095
5095
|
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';
|
|
5096
5096
|
});
|
|
5097
|
-
var InnerContainer = styled.div(templateObject_2$
|
|
5098
|
-
var Message = styled.span(templateObject_3$
|
|
5099
|
-
var ButtonContainer = styled.div(templateObject_4$
|
|
5100
|
-
var Button = styled(LoaderButton)(templateObject_5$
|
|
5101
|
-
var templateObject_1$
|
|
5097
|
+
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"])));
|
|
5098
|
+
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"])));
|
|
5099
|
+
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"])));
|
|
5100
|
+
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"])));
|
|
5101
|
+
var templateObject_1$D, templateObject_2$w, templateObject_3$o, templateObject_4$i, templateObject_5$b;
|
|
5102
5102
|
|
|
5103
5103
|
var IdCapture = function IdCapture(_a) {
|
|
5104
5104
|
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
@@ -5293,13 +5293,13 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
|
|
|
5293
5293
|
finished: true
|
|
5294
5294
|
}, verbiage.retryBtnText)));
|
|
5295
5295
|
};
|
|
5296
|
-
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$
|
|
5297
|
-
var StyledOverlayImageContainer$3 = styled(OverlayImageContainer)(templateObject_2$
|
|
5298
|
-
var Description$4 = styled.p(templateObject_3$
|
|
5299
|
-
var RetryButton$1 = styled(LoaderButton)(templateObject_4$
|
|
5300
|
-
var templateObject_1$
|
|
5296
|
+
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"])));
|
|
5297
|
+
var StyledOverlayImageContainer$3 = styled(OverlayImageContainer)(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
5298
|
+
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"])));
|
|
5299
|
+
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"])));
|
|
5300
|
+
var templateObject_1$C, templateObject_2$v, templateObject_3$n, templateObject_4$h;
|
|
5301
5301
|
|
|
5302
|
-
var ExitCaptureStyledButton = styled.button(templateObject_1$
|
|
5302
|
+
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"])));
|
|
5303
5303
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
5304
5304
|
var onClick = _a.onClick,
|
|
5305
5305
|
className = _a.className;
|
|
@@ -5343,10 +5343,10 @@ var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
|
5343
5343
|
y2: "19.75"
|
|
5344
5344
|
}))));
|
|
5345
5345
|
};
|
|
5346
|
-
var templateObject_1$
|
|
5346
|
+
var templateObject_1$B;
|
|
5347
5347
|
|
|
5348
|
-
var ButtonsRow = styled.div(templateObject_1$
|
|
5349
|
-
var templateObject_1$
|
|
5348
|
+
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"])));
|
|
5349
|
+
var templateObject_1$A;
|
|
5350
5350
|
|
|
5351
5351
|
function IdCaptureLoadingGraphic(props) {
|
|
5352
5352
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -5375,25 +5375,15 @@ function IdCaptureLoadingGraphicDesktop(_a) {
|
|
|
5375
5375
|
var theme = useTheme();
|
|
5376
5376
|
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)';
|
|
5377
5377
|
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;
|
|
5378
|
-
return /*#__PURE__*/React__default.createElement(
|
|
5379
|
-
style: {
|
|
5380
|
-
display: 'flex',
|
|
5381
|
-
width: '100%',
|
|
5382
|
-
height: '100%'
|
|
5383
|
-
}
|
|
5384
|
-
}, /*#__PURE__*/React__default.createElement("svg", {
|
|
5378
|
+
return /*#__PURE__*/React__default.createElement(LoadingGraphicWrapper, null, /*#__PURE__*/React__default.createElement(LoadingGraphicSvg, {
|
|
5385
5379
|
className: className,
|
|
5386
5380
|
width: width,
|
|
5387
5381
|
height: height,
|
|
5382
|
+
"$frame": frame,
|
|
5383
|
+
"$borderColor": accentColor,
|
|
5388
5384
|
viewBox: "0 0 698 452",
|
|
5389
5385
|
fill: "none",
|
|
5390
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
5391
|
-
style: {
|
|
5392
|
-
margin: 'auto',
|
|
5393
|
-
transform: "scale(".concat(frame > 1 ? 1 : frame === 1 ? 1.25 : 0.75, ")"),
|
|
5394
|
-
transition: 'transform 0.2s linear, border-width 0.2s linear',
|
|
5395
|
-
border: "".concat(frame >= 5 ? 10 : 0, "px solid ").concat(accentColor)
|
|
5396
|
-
}
|
|
5386
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
5397
5387
|
}, /*#__PURE__*/React__default.createElement("g", {
|
|
5398
5388
|
filter: frame === 1 ? 'url(#filter0_f_91_884)' : undefined
|
|
5399
5389
|
}, /*#__PURE__*/React__default.createElement("path", {
|
|
@@ -5621,12 +5611,9 @@ function IdCaptureLoadingGraphicMobile(_a) {
|
|
|
5621
5611
|
viewBox: "0 0 428 747",
|
|
5622
5612
|
fill: "none",
|
|
5623
5613
|
xmlns: "http://www.w3.org/2000/svg"
|
|
5624
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
5614
|
+
}, /*#__PURE__*/React__default.createElement(LoadingGraphicCardGroup, {
|
|
5625
5615
|
id: "card",
|
|
5626
|
-
|
|
5627
|
-
transform: "translate(".concat(frame < 1 ? '-500px' : '0', ", 0)"),
|
|
5628
|
-
transition: 'transform 0.3s linear'
|
|
5629
|
-
}
|
|
5616
|
+
"$offScreen": frame < 1
|
|
5630
5617
|
}, /*#__PURE__*/React__default.createElement("path", {
|
|
5631
5618
|
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",
|
|
5632
5619
|
fill: "#F3F3F3",
|
|
@@ -5809,13 +5796,10 @@ function IdCaptureLoadingGraphicMobile(_a) {
|
|
|
5809
5796
|
strokeWidth: "5",
|
|
5810
5797
|
strokeLinecap: "round",
|
|
5811
5798
|
strokeLinejoin: "round"
|
|
5812
|
-
}))), /*#__PURE__*/React__default.createElement(
|
|
5799
|
+
}))), /*#__PURE__*/React__default.createElement(LoadingGraphicPhoneGroup, {
|
|
5813
5800
|
id: "phone",
|
|
5814
5801
|
clipPath: "url(#clip0_29_1778)",
|
|
5815
|
-
|
|
5816
|
-
transform: "translate(".concat(frame < 1 ? '40px' : '0', ", 0)"),
|
|
5817
|
-
transition: 'transform 0.3s linear'
|
|
5818
|
-
}
|
|
5802
|
+
"$offScreen": frame < 1
|
|
5819
5803
|
}, /*#__PURE__*/React__default.createElement("rect", {
|
|
5820
5804
|
x: "154",
|
|
5821
5805
|
y: "693",
|
|
@@ -5843,6 +5827,21 @@ function IdCaptureLoadingGraphicMobile(_a) {
|
|
|
5843
5827
|
fill: "white"
|
|
5844
5828
|
}))));
|
|
5845
5829
|
}
|
|
5830
|
+
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"])));
|
|
5831
|
+
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) {
|
|
5832
|
+
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
5833
|
+
}, function (props) {
|
|
5834
|
+
return props.$frame >= 5 ? 10 : 0;
|
|
5835
|
+
}, function (props) {
|
|
5836
|
+
return props.$borderColor;
|
|
5837
|
+
});
|
|
5838
|
+
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) {
|
|
5839
|
+
return props.$offScreen ? '-500px' : '0';
|
|
5840
|
+
});
|
|
5841
|
+
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) {
|
|
5842
|
+
return props.$offScreen ? '40px' : '0';
|
|
5843
|
+
});
|
|
5844
|
+
var templateObject_1$z, templateObject_2$u, templateObject_3$m, templateObject_4$g;
|
|
5846
5845
|
|
|
5847
5846
|
function LoadingListItemIndicator(_a) {
|
|
5848
5847
|
var _b = _a.state,
|
|
@@ -6037,24 +6036,24 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
|
|
|
6037
6036
|
}
|
|
6038
6037
|
}, verbiage.continueText))))));
|
|
6039
6038
|
};
|
|
6040
|
-
var OverlayInner$1 = styled.div(templateObject_1$
|
|
6039
|
+
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) {
|
|
6041
6040
|
var _a, _b, _c, _d;
|
|
6042
6041
|
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';
|
|
6043
6042
|
}, function (props) {
|
|
6044
6043
|
var _a, _b, _c, _d;
|
|
6045
6044
|
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';
|
|
6046
6045
|
});
|
|
6047
|
-
var OverlayHeader$1 = styled.div(templateObject_2$
|
|
6046
|
+
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) {
|
|
6048
6047
|
var _a;
|
|
6049
6048
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
6050
6049
|
}, function (props) {
|
|
6051
6050
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
6052
6051
|
});
|
|
6053
|
-
var StyledGuidanceMessage$2 = styled(GuidanceMessage)(templateObject_3$
|
|
6054
|
-
var StyledOverlayImageContainer$2 = styled(OverlayImageContainer)(templateObject_4$
|
|
6055
|
-
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_5$
|
|
6056
|
-
var ContinuityCameraCheckboxInner = styled(GuidanceMessage)(templateObject_6$
|
|
6057
|
-
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$
|
|
6052
|
+
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"])));
|
|
6053
|
+
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"])));
|
|
6054
|
+
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"])));
|
|
6055
|
+
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"])));
|
|
6056
|
+
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
6058
6057
|
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) {
|
|
6059
6058
|
var _a, _b, _c, _d;
|
|
6060
6059
|
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';
|
|
@@ -6080,7 +6079,7 @@ var ProgressIndicator$1 = styled.span(templateObject_15$1 || (templateObject_15$
|
|
|
6080
6079
|
var _a, _b, _c, _d;
|
|
6081
6080
|
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)';
|
|
6082
6081
|
}, progressBarAnimation);
|
|
6083
|
-
var CustomLoadingGraphic$1 = styled.img(templateObject_16 || (templateObject_16 = __makeTemplateObject([""], [""])));
|
|
6082
|
+
var CustomLoadingGraphic$1 = styled.img(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
6084
6083
|
var ContinueButtonContainer$1 = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
6085
6084
|
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) {
|
|
6086
6085
|
var _a, _b, _c, _d, _e, _f;
|
|
@@ -6089,10 +6088,10 @@ var ContinueButton$1 = styled(LoaderButton)(templateObject_18 || (templateObject
|
|
|
6089
6088
|
var _a, _b, _c, _d, _e, _f;
|
|
6090
6089
|
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, ";") : '';
|
|
6091
6090
|
});
|
|
6092
|
-
var templateObject_1$
|
|
6091
|
+
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;
|
|
6093
6092
|
|
|
6094
|
-
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$
|
|
6095
|
-
var ContinuityCameraCheckbox = styled.input(templateObject_2$
|
|
6093
|
+
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"])));
|
|
6094
|
+
var ContinuityCameraCheckbox = styled.input(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
6096
6095
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
6097
6096
|
var _b, _c, _d, _e;
|
|
6098
6097
|
var onDismissed = _a.onDismissed,
|
|
@@ -6203,7 +6202,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
|
6203
6202
|
}
|
|
6204
6203
|
}, cameraReady && modelsReady ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
6205
6204
|
};
|
|
6206
|
-
var templateObject_1$
|
|
6205
|
+
var templateObject_1$x, templateObject_2$s;
|
|
6207
6206
|
|
|
6208
6207
|
var components$1 = {
|
|
6209
6208
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -6261,9 +6260,9 @@ var CapturedDocumentImg = function CapturedDocumentImg(_a) {
|
|
|
6261
6260
|
});
|
|
6262
6261
|
};
|
|
6263
6262
|
|
|
6264
|
-
var Card = styled.div(templateObject_1$
|
|
6265
|
-
var FlexCard = styled(Card)(templateObject_2$
|
|
6266
|
-
var templateObject_1$
|
|
6263
|
+
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"])));
|
|
6264
|
+
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"])));
|
|
6265
|
+
var templateObject_1$w, templateObject_2$r;
|
|
6267
6266
|
|
|
6268
6267
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
6269
6268
|
var capturedDocuments = _a.capturedDocuments,
|
|
@@ -6338,13 +6337,13 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
6338
6337
|
finished: true
|
|
6339
6338
|
}, verbiage.retryText)))));
|
|
6340
6339
|
};
|
|
6341
|
-
var Heading$a = styled.h1(templateObject_1$
|
|
6342
|
-
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$
|
|
6343
|
-
var ImageRow = styled(OverlayImageRow)(templateObject_3$
|
|
6344
|
-
var ImageCol$1 = styled.div(templateObject_4$
|
|
6345
|
-
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$
|
|
6346
|
-
var DebugPre = styled.pre(templateObject_6$
|
|
6347
|
-
var templateObject_1$
|
|
6340
|
+
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"])));
|
|
6341
|
+
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"])));
|
|
6342
|
+
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"])));
|
|
6343
|
+
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"])));
|
|
6344
|
+
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"])));
|
|
6345
|
+
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"])));
|
|
6346
|
+
var templateObject_1$v, templateObject_2$q, templateObject_3$k, templateObject_4$e, templateObject_5$9, templateObject_6$7;
|
|
6348
6347
|
|
|
6349
6348
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
6350
6349
|
var _this = this;
|
|
@@ -6396,10 +6395,10 @@ function resetCanvasDimensions(canvas) {
|
|
|
6396
6395
|
canvas.style.height = '0';
|
|
6397
6396
|
}
|
|
6398
6397
|
|
|
6399
|
-
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$
|
|
6398
|
+
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) {
|
|
6400
6399
|
return props.$isVisible ? '' : 'opacity: 0;';
|
|
6401
6400
|
});
|
|
6402
|
-
var IdCardGuideImage = styled.img(templateObject_2$
|
|
6401
|
+
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) {
|
|
6403
6402
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
6404
6403
|
}, function (props) {
|
|
6405
6404
|
return props.$isInvisible ? 'opacity: 0;' : '';
|
|
@@ -6541,16 +6540,16 @@ function IdCardBorderSvg(_a) {
|
|
|
6541
6540
|
className: isProgressBar ? "idmSdkProgressBorder ".concat(progressPaused ? 'idmSdkProgressPaused' : '') : ''
|
|
6542
6541
|
}));
|
|
6543
6542
|
}
|
|
6544
|
-
var IdCardBorderContainer = styled.div(templateObject_3$
|
|
6545
|
-
var SvgOverlay = styled.svg(templateObject_4$
|
|
6546
|
-
var IdCardBorderRect = styled.rect(templateObject_5$
|
|
6543
|
+
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);
|
|
6544
|
+
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"])));
|
|
6545
|
+
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) {
|
|
6547
6546
|
var _a;
|
|
6548
6547
|
return (_a = props.$speed) !== null && _a !== void 0 ? _a : '3s';
|
|
6549
6548
|
}, function (props) {
|
|
6550
6549
|
var _a;
|
|
6551
6550
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
6552
6551
|
});
|
|
6553
|
-
var templateObject_1$
|
|
6552
|
+
var templateObject_1$u, templateObject_2$p, templateObject_3$j, templateObject_4$d, templateObject_5$8;
|
|
6554
6553
|
|
|
6555
6554
|
var defaultIdCaptureGuideImages = {
|
|
6556
6555
|
portrait: {
|
|
@@ -6656,12 +6655,81 @@ function getOrientation(allowPortraitOnMobile) {
|
|
|
6656
6655
|
return allowPortraitOnMobile && window.innerWidth < window.innerHeight ? 'portrait' : 'landscape';
|
|
6657
6656
|
}
|
|
6658
6657
|
|
|
6659
|
-
var
|
|
6658
|
+
var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
|
|
6659
|
+
var _b;
|
|
6660
|
+
var _c = _a.idCaptureGuideImages,
|
|
6661
|
+
idCaptureGuideImages = _c === void 0 ? defaultIdCaptureGuideImages : _c,
|
|
6662
|
+
_d = _a.classNames,
|
|
6663
|
+
classNames = _d === void 0 ? {} : _d,
|
|
6664
|
+
borderWidth = _a.borderWidth,
|
|
6665
|
+
borderColor = _a.borderColor,
|
|
6666
|
+
borderRadius = _a.borderRadius,
|
|
6667
|
+
imageStyle = _a.imageStyle;
|
|
6668
|
+
var cameraRef = useContext(CameraStateContext).cameraRef;
|
|
6669
|
+
var isMirrored = !((_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing);
|
|
6670
|
+
var _e = useState(1),
|
|
6671
|
+
transitionTime = _e[0],
|
|
6672
|
+
setTransitionTime = _e[1];
|
|
6673
|
+
var _f = useState(0),
|
|
6674
|
+
rotationAngle = _f[0],
|
|
6675
|
+
setRotationAngle = _f[1];
|
|
6676
|
+
var frontTransforms = ["rotateY(".concat(rotationAngle, "deg)")];
|
|
6677
|
+
if (isMirrored) frontTransforms.push('scaleX(-1)');
|
|
6678
|
+
var backTransforms = ["rotateY(".concat(180 - rotationAngle, "deg)")];
|
|
6679
|
+
if (isMirrored) backTransforms.push('scaleX(-1)');
|
|
6680
|
+
useEffect(function () {
|
|
6681
|
+
var timeout;
|
|
6682
|
+
function doFlip() {
|
|
6683
|
+
setTransitionTime(1);
|
|
6684
|
+
setRotationAngle(180);
|
|
6685
|
+
timeout = setTimeout(function () {
|
|
6686
|
+
setTransitionTime(0);
|
|
6687
|
+
setRotationAngle(0);
|
|
6688
|
+
}, 1500);
|
|
6689
|
+
}
|
|
6690
|
+
var interval = setInterval(doFlip, 2500);
|
|
6691
|
+
timeout = setTimeout(doFlip, 250);
|
|
6692
|
+
return function () {
|
|
6693
|
+
clearInterval(interval);
|
|
6694
|
+
clearTimeout(timeout);
|
|
6695
|
+
};
|
|
6696
|
+
}, []);
|
|
6697
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(FlipImageContainer, {
|
|
6698
|
+
className: classNames.frontImageContainer,
|
|
6699
|
+
status: "disabled",
|
|
6700
|
+
borderWidth: borderWidth,
|
|
6701
|
+
borderColor: borderColor,
|
|
6702
|
+
borderRadius: borderRadius,
|
|
6703
|
+
"$transforms": frontTransforms.join(' '),
|
|
6704
|
+
"$transitionTime": transitionTime,
|
|
6705
|
+
"$isVisible": true
|
|
6706
|
+
}, /*#__PURE__*/React__default.createElement(IdCardGuideImage, {
|
|
6707
|
+
src: idCaptureGuideImages.landscape.SHOW_ID_FRONT.url,
|
|
6708
|
+
className: classNames.frontImage,
|
|
6709
|
+
alt: "",
|
|
6710
|
+
style: imageStyle
|
|
6711
|
+
})), /*#__PURE__*/React__default.createElement(FlipImageContainer, {
|
|
6712
|
+
className: classNames.backImageContainer,
|
|
6713
|
+
status: "disabled",
|
|
6714
|
+
borderWidth: borderWidth,
|
|
6715
|
+
borderColor: borderColor,
|
|
6716
|
+
borderRadius: borderRadius,
|
|
6717
|
+
"$transforms": backTransforms.join(' '),
|
|
6718
|
+
"$transitionTime": transitionTime,
|
|
6719
|
+
"$isVisible": true
|
|
6720
|
+
}, /*#__PURE__*/React__default.createElement(IdCardGuideImage, {
|
|
6721
|
+
src: idCaptureGuideImages.landscape.SHOW_ID_BACK.url,
|
|
6722
|
+
className: classNames.backImage,
|
|
6723
|
+
alt: "",
|
|
6724
|
+
style: imageStyle
|
|
6725
|
+
})));
|
|
6726
|
+
};
|
|
6727
|
+
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) {
|
|
6660
6728
|
return props.$transitionTime;
|
|
6661
6729
|
}, function (props) {
|
|
6662
6730
|
return props.$transforms;
|
|
6663
6731
|
});
|
|
6664
|
-
var templateObject_1$
|
|
6732
|
+
var templateObject_1$t;
|
|
6665
6733
|
|
|
6666
6734
|
var GuideOrientationContext = /*#__PURE__*/createContext({
|
|
6667
6735
|
orientation: 'landscape',
|
|
@@ -6950,10 +7018,10 @@ var regionClsx = function regionClsx(classNames, which) {
|
|
|
6950
7018
|
return v;
|
|
6951
7019
|
}).join(' ');
|
|
6952
7020
|
};
|
|
6953
|
-
var StyledPageContainer = styled(PageContainerDiv)(templateObject_1$
|
|
6954
|
-
var GuidesContainer = styled.div(templateObject_2$
|
|
6955
|
-
var GuideCenterRow = styled.div(templateObject_3$
|
|
6956
|
-
var GuideRegion = styled.div(templateObject_4$
|
|
7021
|
+
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"])));
|
|
7022
|
+
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"])));
|
|
7023
|
+
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"])));
|
|
7024
|
+
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) {
|
|
6957
7025
|
var _a, _b, _c, _d, _e;
|
|
6958
7026
|
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)';
|
|
6959
7027
|
}, function (props) {
|
|
@@ -6964,13 +7032,13 @@ var GuideRegion = styled.div(templateObject_4$b || (templateObject_4$b = __makeT
|
|
|
6964
7032
|
}, function (props) {
|
|
6965
7033
|
return props.$minHeight ? "min-height: ".concat(props.$minHeight, "px;") : "";
|
|
6966
7034
|
});
|
|
6967
|
-
var Spacer = styled(GuideRegion)(templateObject_5$
|
|
6968
|
-
var GuideCenterRegion = styled.div(templateObject_6$
|
|
7035
|
+
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"])));
|
|
7036
|
+
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) {
|
|
6969
7037
|
return props.$minWidth ? "min-width: ".concat(props.$minWidth, "px;") : "";
|
|
6970
7038
|
}, function (props) {
|
|
6971
7039
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
6972
7040
|
});
|
|
6973
|
-
var GuideCenterBorder = styled.div(templateObject_7$
|
|
7041
|
+
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) {
|
|
6974
7042
|
var _a, _b;
|
|
6975
7043
|
return "".concat((_a = props.$borderWidth) !== null && _a !== void 0 ? _a : 4, "px solid ").concat((_b = props.$borderColor) !== null && _b !== void 0 ? _b : 'white');
|
|
6976
7044
|
}, function (props) {
|
|
@@ -6978,7 +7046,7 @@ var GuideCenterBorder = styled.div(templateObject_7$3 || (templateObject_7$3 = _
|
|
|
6978
7046
|
});
|
|
6979
7047
|
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"])));
|
|
6980
7048
|
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"])));
|
|
6981
|
-
var templateObject_1$
|
|
7049
|
+
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;
|
|
6982
7050
|
|
|
6983
7051
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
6984
7052
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -7121,11 +7189,11 @@ var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
|
7121
7189
|
progress: progress
|
|
7122
7190
|
}));
|
|
7123
7191
|
};
|
|
7124
|
-
var CanvasWrapper$1 = styled.div(templateObject_1$
|
|
7192
|
+
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) {
|
|
7125
7193
|
return props.$maskColor;
|
|
7126
7194
|
});
|
|
7127
|
-
var Canvas$1 = styled.canvas(templateObject_2$
|
|
7128
|
-
var templateObject_1$
|
|
7195
|
+
var Canvas$1 = styled.canvas(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
7196
|
+
var templateObject_1$r, templateObject_2$n;
|
|
7129
7197
|
|
|
7130
7198
|
function IdCaptureGuides(_a) {
|
|
7131
7199
|
var _b, _c;
|
|
@@ -7265,11 +7333,11 @@ var SelfieProgressPreview = function SelfieProgressPreview(_a) {
|
|
|
7265
7333
|
onError: onError
|
|
7266
7334
|
})));
|
|
7267
7335
|
};
|
|
7268
|
-
var StyledSpinner = styled(Spinner)(templateObject_1$
|
|
7269
|
-
var ImagePreviewWrapper = styled.div(templateObject_2$
|
|
7270
|
-
var ImagePreviewText = styled.div(templateObject_3$
|
|
7271
|
-
var ImagePreviewImageWrapper = styled.div(templateObject_4$
|
|
7272
|
-
var templateObject_1$
|
|
7336
|
+
var StyledSpinner = styled(Spinner)(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"])));
|
|
7337
|
+
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"])));
|
|
7338
|
+
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"])));
|
|
7339
|
+
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"])));
|
|
7340
|
+
var templateObject_1$q, templateObject_2$m, templateObject_3$h, templateObject_4$b;
|
|
7273
7341
|
|
|
7274
7342
|
var CameraVideoTag = function CameraVideoTag(_a) {
|
|
7275
7343
|
var _b;
|
|
@@ -7308,10 +7376,10 @@ var CameraVideoTag = function CameraVideoTag(_a) {
|
|
|
7308
7376
|
"$isRearFacing": (_b = cameraRef.current) === null || _b === void 0 ? void 0 : _b.isRearFacing
|
|
7309
7377
|
});
|
|
7310
7378
|
};
|
|
7311
|
-
var FullscreenVideoTag = styled.video(templateObject_1$
|
|
7379
|
+
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) {
|
|
7312
7380
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
7313
7381
|
});
|
|
7314
|
-
var templateObject_1$
|
|
7382
|
+
var templateObject_1$p;
|
|
7315
7383
|
|
|
7316
7384
|
var documentCaptureInitialState = {
|
|
7317
7385
|
documents: [],
|
|
@@ -7667,16 +7735,16 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
|
|
|
7667
7735
|
ref: canvasRef
|
|
7668
7736
|
}));
|
|
7669
7737
|
};
|
|
7670
|
-
var CanvasWrapper = styled.div(templateObject_1$
|
|
7738
|
+
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) {
|
|
7671
7739
|
return props.$maskColor;
|
|
7672
7740
|
});
|
|
7673
|
-
var Canvas = styled.canvas(templateObject_2$
|
|
7674
|
-
var templateObject_1$
|
|
7741
|
+
var Canvas = styled.canvas(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
7742
|
+
var templateObject_1$o, templateObject_2$l;
|
|
7675
7743
|
|
|
7676
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
7744
|
+
var CameraFeedWrapper = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7677
7745
|
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;") : "";
|
|
7678
7746
|
});
|
|
7679
|
-
var templateObject_1$
|
|
7747
|
+
var templateObject_1$n;
|
|
7680
7748
|
|
|
7681
7749
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
7682
7750
|
var _b, _c, _d, _e, _f, _g, _h;
|
|
@@ -7826,21 +7894,21 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
|
7826
7894
|
disabled: !cameraReady || capturing
|
|
7827
7895
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
7828
7896
|
};
|
|
7829
|
-
var CaptureContainer = styled.div(templateObject_1$
|
|
7830
|
-
var HeadingRow = styled.div(templateObject_2$
|
|
7897
|
+
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"])));
|
|
7898
|
+
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) {
|
|
7831
7899
|
return props.$maskColor;
|
|
7832
7900
|
});
|
|
7833
|
-
var Heading$9 = styled.h1(templateObject_3$
|
|
7834
|
-
var FooterRow = styled.div(templateObject_4$
|
|
7901
|
+
var Heading$9 = styled.h1(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
|
|
7902
|
+
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) {
|
|
7835
7903
|
return props.$maskColor;
|
|
7836
7904
|
});
|
|
7837
|
-
var Instructions = styled.div(templateObject_5$
|
|
7905
|
+
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) {
|
|
7838
7906
|
var _a, _b, _c;
|
|
7839
7907
|
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';
|
|
7840
7908
|
});
|
|
7841
|
-
var StyledButtonsRow$9 = styled(ButtonsRow)(templateObject_6$
|
|
7842
|
-
var PreviewImage = styled.img(templateObject_7$
|
|
7843
|
-
var templateObject_1$
|
|
7909
|
+
var StyledButtonsRow$9 = styled(ButtonsRow)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
|
|
7910
|
+
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"])));
|
|
7911
|
+
var templateObject_1$m, templateObject_2$k, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$3;
|
|
7844
7912
|
|
|
7845
7913
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
7846
7914
|
var onSuccess = _a.onSuccess,
|
|
@@ -8109,13 +8177,13 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
|
|
|
8109
8177
|
}
|
|
8110
8178
|
}, verbiage.doneBtnText))))));
|
|
8111
8179
|
};
|
|
8112
|
-
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
8113
|
-
var Heading$8 = styled.h3(templateObject_2$
|
|
8114
|
-
var Description$3 = styled.p(templateObject_3$
|
|
8115
|
-
var Instruction = styled.p(templateObject_4$
|
|
8116
|
-
var ImageCol = styled.div(templateObject_5$
|
|
8117
|
-
var StyledButtonsRow$8 = styled(ButtonsRow)(templateObject_6$
|
|
8118
|
-
var templateObject_1$
|
|
8180
|
+
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
8181
|
+
var Heading$8 = styled.h3(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
8182
|
+
var Description$3 = styled.p(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
8183
|
+
var Instruction = styled.p(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
8184
|
+
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"])));
|
|
8185
|
+
var StyledButtonsRow$8 = styled(ButtonsRow)(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
8186
|
+
var templateObject_1$l, templateObject_2$j, templateObject_3$f, templateObject_4$9, templateObject_5$5, templateObject_6$4;
|
|
8119
8187
|
|
|
8120
8188
|
function ScalingCameraFeed() {
|
|
8121
8189
|
var _a = useContext(IdCaptureStateContext),
|
|
@@ -8801,7 +8869,7 @@ var HeadGuideSvg = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
8801
8869
|
}))));
|
|
8802
8870
|
});
|
|
8803
8871
|
HeadGuideSvg.displayName = 'HeadGuideSvg';
|
|
8804
|
-
var PulsingHeadGuideContainer = styled.div(templateObject_1$
|
|
8872
|
+
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);
|
|
8805
8873
|
function HeadGuide(_a) {
|
|
8806
8874
|
var _b;
|
|
8807
8875
|
var _c = _a.status,
|
|
@@ -8851,8 +8919,8 @@ function HeadGuide(_a) {
|
|
|
8851
8919
|
height: parentHeight
|
|
8852
8920
|
})));
|
|
8853
8921
|
}
|
|
8854
|
-
var AbsoluteSvg = styled.svg(templateObject_2$
|
|
8855
|
-
var RelativeSvgContainer = styled.div(templateObject_3$
|
|
8922
|
+
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"])));
|
|
8923
|
+
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) {
|
|
8856
8924
|
return props.$verticalAlign === 'bottom' ? 'flex-end' : 'center';
|
|
8857
8925
|
});
|
|
8858
8926
|
function SelfieCaptureAnimatedMask(_a) {
|
|
@@ -9079,10 +9147,10 @@ function SelfieCaptureAnimatedMaskWithStatus(_a) {
|
|
|
9079
9147
|
status: status
|
|
9080
9148
|
}));
|
|
9081
9149
|
}
|
|
9082
|
-
var templateObject_1$
|
|
9150
|
+
var templateObject_1$k, templateObject_2$i, templateObject_3$e;
|
|
9083
9151
|
|
|
9084
|
-
var FaceCaptureGuideContainer = styled.div(templateObject_1$
|
|
9085
|
-
var FaceCaptureGuideInner = styled.div(templateObject_2$
|
|
9152
|
+
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"])));
|
|
9153
|
+
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"])));
|
|
9086
9154
|
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
9087
9155
|
var _b = _a.classNames,
|
|
9088
9156
|
classNames = _b === void 0 ? {} : _b,
|
|
@@ -9104,7 +9172,7 @@ var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
|
9104
9172
|
verticalAlign: "center"
|
|
9105
9173
|
})));
|
|
9106
9174
|
};
|
|
9107
|
-
var templateObject_1$
|
|
9175
|
+
var templateObject_1$j, templateObject_2$h;
|
|
9108
9176
|
|
|
9109
9177
|
var SelfieGuidanceModelsContext = /*#__PURE__*/createContext({
|
|
9110
9178
|
start: function start() {
|
|
@@ -9408,12 +9476,12 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
|
|
|
9408
9476
|
}
|
|
9409
9477
|
}, !image ? invalidSelfie ? verbiage.retryButtonText : verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
|
|
9410
9478
|
};
|
|
9411
|
-
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$
|
|
9412
|
-
var Heading$7 = styled.h3(templateObject_2$
|
|
9413
|
-
var Description$2 = styled.p(templateObject_3$
|
|
9414
|
-
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$
|
|
9415
|
-
var StyledButtonsRow$7 = styled(ButtonsRow)(templateObject_5$
|
|
9416
|
-
var templateObject_1$
|
|
9479
|
+
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
9480
|
+
var Heading$7 = styled.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
9481
|
+
var Description$2 = styled.p(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
9482
|
+
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
9483
|
+
var StyledButtonsRow$7 = styled(ButtonsRow)(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
9484
|
+
var templateObject_1$i, templateObject_2$g, templateObject_3$d, templateObject_4$8, templateObject_5$4;
|
|
9417
9485
|
|
|
9418
9486
|
var initialState$3 = {
|
|
9419
9487
|
busy: false,
|
|
@@ -9957,9 +10025,9 @@ var FaceLivenessSuccess = function FaceLivenessSuccess(_a) {
|
|
|
9957
10025
|
finished: true
|
|
9958
10026
|
}, verbiage.retryBtnText)))));
|
|
9959
10027
|
};
|
|
9960
|
-
var ImageContainer$5 = styled.div(templateObject_1$
|
|
9961
|
-
var Heading$6 = styled.h3(templateObject_2$
|
|
9962
|
-
var templateObject_1$
|
|
10028
|
+
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"])));
|
|
10029
|
+
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"])));
|
|
10030
|
+
var templateObject_1$h, templateObject_2$f;
|
|
9963
10031
|
|
|
9964
10032
|
var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
9965
10033
|
var _b = _a.canRetry,
|
|
@@ -10008,9 +10076,9 @@ var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
|
10008
10076
|
finished: true
|
|
10009
10077
|
}, verbiage.exitBtnText)))));
|
|
10010
10078
|
};
|
|
10011
|
-
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$
|
|
10012
|
-
var Heading$5 = styled.h3(templateObject_2$
|
|
10013
|
-
var templateObject_1$
|
|
10079
|
+
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"])));
|
|
10080
|
+
var Heading$5 = styled.h3(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
|
|
10081
|
+
var templateObject_1$g, templateObject_2$e;
|
|
10014
10082
|
|
|
10015
10083
|
var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
10016
10084
|
var _b;
|
|
@@ -10051,11 +10119,11 @@ var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
|
10051
10119
|
finished: true
|
|
10052
10120
|
}, verbiage.retryBtnText)));
|
|
10053
10121
|
};
|
|
10054
|
-
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$
|
|
10055
|
-
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$
|
|
10056
|
-
var Description$1 = styled.p(templateObject_3$
|
|
10057
|
-
var RetryButton = styled(LoaderButton)(templateObject_4$
|
|
10058
|
-
var templateObject_1$
|
|
10122
|
+
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"])));
|
|
10123
|
+
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
10124
|
+
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"])));
|
|
10125
|
+
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"])));
|
|
10126
|
+
var templateObject_1$f, templateObject_2$d, templateObject_3$c, templateObject_4$7;
|
|
10059
10127
|
|
|
10060
10128
|
var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLegacy(_a) {
|
|
10061
10129
|
var onDismissed = _a.onDismissed,
|
|
@@ -10138,9 +10206,9 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
|
|
|
10138
10206
|
}
|
|
10139
10207
|
}, cameraReady && allModelsReady ? verbiage.continueText : allModelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
|
|
10140
10208
|
};
|
|
10141
|
-
var StyledGuidanceMessage$1 = styled(GuidanceMessage)(templateObject_1$
|
|
10142
|
-
var StyledButtonsRow$6 = styled(ButtonsRow)(templateObject_2$
|
|
10143
|
-
var templateObject_1$
|
|
10209
|
+
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"])));
|
|
10210
|
+
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"])));
|
|
10211
|
+
var templateObject_1$e, templateObject_2$c;
|
|
10144
10212
|
|
|
10145
10213
|
var legacyInstructionImageUrl = "".concat(DEFAULT_CDN_URL, "/Selfie-Image-1.png");
|
|
10146
10214
|
var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDefault(_a) {
|
|
@@ -10265,30 +10333,30 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
|
|
|
10265
10333
|
}
|
|
10266
10334
|
}, verbiage.continueText))))));
|
|
10267
10335
|
};
|
|
10268
|
-
var OverlayInner = styled.div(templateObject_1$
|
|
10336
|
+
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) {
|
|
10269
10337
|
var _a, _b, _c, _d;
|
|
10270
10338
|
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';
|
|
10271
10339
|
}, function (props) {
|
|
10272
10340
|
var _a, _b, _c, _d;
|
|
10273
10341
|
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';
|
|
10274
10342
|
});
|
|
10275
|
-
var OverlayHeader = styled.div(templateObject_2$
|
|
10343
|
+
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) {
|
|
10276
10344
|
var _a;
|
|
10277
10345
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
10278
10346
|
}, function (props) {
|
|
10279
10347
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
10280
10348
|
});
|
|
10281
|
-
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_3$
|
|
10282
|
-
var StyledButtonsRow$5 = styled(ButtonsRow)(templateObject_4$
|
|
10349
|
+
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"])));
|
|
10350
|
+
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) {
|
|
10283
10351
|
var _a, _b, _c, _d;
|
|
10284
10352
|
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';
|
|
10285
10353
|
}, function (props) {
|
|
10286
10354
|
var _a, _b, _c, _d, _e, _f;
|
|
10287
10355
|
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, ";") : '';
|
|
10288
10356
|
});
|
|
10289
|
-
var StyledOverlayImageContainer = styled(OverlayImageContainer)(templateObject_5$
|
|
10290
|
-
var LoadingListContainer = styled.div(templateObject_6$
|
|
10291
|
-
var LoadingList = styled.ul(templateObject_7$
|
|
10357
|
+
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"])));
|
|
10358
|
+
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"])));
|
|
10359
|
+
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"])));
|
|
10292
10360
|
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"])));
|
|
10293
10361
|
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"])));
|
|
10294
10362
|
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) {
|
|
@@ -10314,7 +10382,7 @@ var ContinueButton = styled(LoaderButton)(templateObject_15 || (templateObject_1
|
|
|
10314
10382
|
var _a, _b, _c, _d, _e, _f;
|
|
10315
10383
|
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, ";") : '';
|
|
10316
10384
|
});
|
|
10317
|
-
var templateObject_1$
|
|
10385
|
+
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;
|
|
10318
10386
|
|
|
10319
10387
|
var components = {
|
|
10320
10388
|
"default": SelfieCaptureLoadingOverlayDefault,
|
|
@@ -10643,7 +10711,7 @@ var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
|
|
|
10643
10711
|
}
|
|
10644
10712
|
return /*#__PURE__*/React__default.createElement(OverlayContainer, {
|
|
10645
10713
|
className: classNames.container
|
|
10646
|
-
}, /*#__PURE__*/React__default.createElement(Inner$
|
|
10714
|
+
}, /*#__PURE__*/React__default.createElement(Inner$2, {
|
|
10647
10715
|
className: classNames.inner
|
|
10648
10716
|
}, /*#__PURE__*/React__default.createElement(Heading$4, {
|
|
10649
10717
|
className: classNames.heading
|
|
@@ -10673,11 +10741,11 @@ var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
|
|
|
10673
10741
|
}
|
|
10674
10742
|
}, verbiage.captureBtnText)))));
|
|
10675
10743
|
};
|
|
10676
|
-
var Inner$
|
|
10677
|
-
var Heading$4 = styled.h3(templateObject_2$
|
|
10678
|
-
var Description = styled.p(templateObject_3$
|
|
10679
|
-
var StyledButtonsRow$4 = styled(ButtonsRow)(templateObject_4$
|
|
10680
|
-
var templateObject_1$
|
|
10744
|
+
var Inner$2 = styled(OverlayInner$2)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
10745
|
+
var Heading$4 = styled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
10746
|
+
var Description = styled.p(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
10747
|
+
var StyledButtonsRow$4 = styled(ButtonsRow)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
10748
|
+
var templateObject_1$c, templateObject_2$a, templateObject_3$a, templateObject_4$5;
|
|
10681
10749
|
|
|
10682
10750
|
var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
|
|
10683
10751
|
var documents = _a.documents,
|
|
@@ -10821,7 +10889,7 @@ function convertSVGtoImg(svgData_1) {
|
|
|
10821
10889
|
});
|
|
10822
10890
|
}
|
|
10823
10891
|
|
|
10824
|
-
var SignaturePaperBacking = styled.div(templateObject_1$
|
|
10892
|
+
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) {
|
|
10825
10893
|
var _a, _b;
|
|
10826
10894
|
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, ";") : "";
|
|
10827
10895
|
}, function (props) {
|
|
@@ -10831,8 +10899,8 @@ var SignaturePaperBacking = styled.div(templateObject_1$a || (templateObject_1$a
|
|
|
10831
10899
|
var _a, _b;
|
|
10832
10900
|
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, ";") : "";
|
|
10833
10901
|
});
|
|
10834
|
-
var SignatureCanvasContainer$1 = styled.div(templateObject_2$
|
|
10835
|
-
var SignaturePad = styled.div(templateObject_3$
|
|
10902
|
+
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"])));
|
|
10903
|
+
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) {
|
|
10836
10904
|
var _a, _b, _c;
|
|
10837
10905
|
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)';
|
|
10838
10906
|
}, function (props) {
|
|
@@ -10842,8 +10910,8 @@ var SignaturePad = styled.div(templateObject_3$8 || (templateObject_3$8 = __make
|
|
|
10842
10910
|
var _a, _b, _c;
|
|
10843
10911
|
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';
|
|
10844
10912
|
});
|
|
10845
|
-
var SignatureButtonsContainer = styled(ButtonsRow)(templateObject_4$
|
|
10846
|
-
var templateObject_1$
|
|
10913
|
+
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"])));
|
|
10914
|
+
var templateObject_1$b, templateObject_2$9, templateObject_3$9, templateObject_4$4;
|
|
10847
10915
|
|
|
10848
10916
|
var SignatureCapture = function SignatureCapture(_a) {
|
|
10849
10917
|
var _b;
|
|
@@ -10914,8 +10982,8 @@ var SignatureCapture = function SignatureCapture(_a) {
|
|
|
10914
10982
|
finished: true
|
|
10915
10983
|
}, verbiage.acceptBtnText)))));
|
|
10916
10984
|
};
|
|
10917
|
-
var AcceptBtn$1 = styled(LoaderButton)(templateObject_1$
|
|
10918
|
-
var templateObject_1$
|
|
10985
|
+
var AcceptBtn$1 = styled(LoaderButton)(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
10986
|
+
var templateObject_1$a;
|
|
10919
10987
|
|
|
10920
10988
|
var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
|
|
10921
10989
|
if (mergeAVStreams === void 0) {
|
|
@@ -11275,11 +11343,11 @@ function VideoSignatureGuides(_a) {
|
|
|
11275
11343
|
className: classNames.signatureCanvas
|
|
11276
11344
|
};
|
|
11277
11345
|
}, [classNames.signatureCanvas, height, width]);
|
|
11278
|
-
return /*#__PURE__*/React__default.createElement(Container, {
|
|
11346
|
+
return /*#__PURE__*/React__default.createElement(Container$1, {
|
|
11279
11347
|
className: classNames.container
|
|
11280
|
-
}, /*#__PURE__*/React__default.createElement(Inner, {
|
|
11348
|
+
}, /*#__PURE__*/React__default.createElement(Inner$1, {
|
|
11281
11349
|
className: classNames.inner
|
|
11282
|
-
}, /*#__PURE__*/React__default.createElement(FaceGuideContainer, {
|
|
11350
|
+
}, /*#__PURE__*/React__default.createElement(FaceGuideContainer$1, {
|
|
11283
11351
|
className: classNames.faceGuideContainer
|
|
11284
11352
|
}, /*#__PURE__*/React__default.createElement(StyledSelfieCaptureAnimatedMask, {
|
|
11285
11353
|
className: classNames.faceGuide,
|
|
@@ -11314,19 +11382,19 @@ function VideoSignatureGuides(_a) {
|
|
|
11314
11382
|
finished: true
|
|
11315
11383
|
}, verbiage.acceptSignatureBtnText))))));
|
|
11316
11384
|
}
|
|
11317
|
-
var Container = styled.div(templateObject_1$
|
|
11385
|
+
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) {
|
|
11318
11386
|
var _a;
|
|
11319
11387
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
11320
11388
|
});
|
|
11321
|
-
var Inner = styled.div(templateObject_2$
|
|
11322
|
-
var FaceGuideContainer = styled.div(templateObject_3$
|
|
11323
|
-
var StyledSelfieCaptureAnimatedMask = styled(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$
|
|
11324
|
-
var SignaturePadContainer = styled.div(templateObject_5$
|
|
11325
|
-
var SignatureCanvasContainer = styled.div(templateObject_6$
|
|
11389
|
+
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"])));
|
|
11390
|
+
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"])));
|
|
11391
|
+
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"])));
|
|
11392
|
+
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"])));
|
|
11393
|
+
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) {
|
|
11326
11394
|
return props.$disabled ? 'opacity: 0.5; pointer-events: none;' : '';
|
|
11327
11395
|
});
|
|
11328
|
-
var AcceptBtn = styled(LoaderButton)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
11329
|
-
var templateObject_1$
|
|
11396
|
+
var AcceptBtn = styled(LoaderButton)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
11397
|
+
var templateObject_1$9, templateObject_2$8, templateObject_3$8, templateObject_4$3, templateObject_5$2, templateObject_6$2, templateObject_7$1;
|
|
11330
11398
|
|
|
11331
11399
|
var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
11332
11400
|
var _b, _c, _d;
|
|
@@ -11454,8 +11522,8 @@ var VideoSignatureSuccess = function VideoSignatureSuccess(_a) {
|
|
|
11454
11522
|
finished: true
|
|
11455
11523
|
}, verbiage.doneBtnText))));
|
|
11456
11524
|
};
|
|
11457
|
-
var StyledVideo$1 = styled.video(templateObject_1$
|
|
11458
|
-
var templateObject_1$
|
|
11525
|
+
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"])));
|
|
11526
|
+
var templateObject_1$8;
|
|
11459
11527
|
|
|
11460
11528
|
var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
11461
11529
|
var _b;
|
|
@@ -11648,6 +11716,127 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
|
11648
11716
|
}()));
|
|
11649
11717
|
};
|
|
11650
11718
|
|
|
11719
|
+
var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
|
|
11720
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
11721
|
+
var _0 = _a.requestedAction,
|
|
11722
|
+
requestedAction = _0 === void 0 ? 'SHOW_ID_FRONT' : _0,
|
|
11723
|
+
_1 = _a.satisfied,
|
|
11724
|
+
satisfied = _1 === void 0 ? false : _1,
|
|
11725
|
+
_2 = _a.faceGuideStatus,
|
|
11726
|
+
faceGuideStatus = _2 === void 0 ? 'success' : _2,
|
|
11727
|
+
faceGuideBorderWidth = _a.faceGuideBorderWidth,
|
|
11728
|
+
faceGuideBorderColor = _a.faceGuideBorderColor,
|
|
11729
|
+
_3 = _a.idCardGuideStatus,
|
|
11730
|
+
idCardGuideStatus = _3 === void 0 ? 'ready' : _3,
|
|
11731
|
+
idCardGuideBorderWidth = _a.idCardGuideBorderWidth,
|
|
11732
|
+
idCardGuideBorderColor = _a.idCardGuideBorderColor,
|
|
11733
|
+
idCardCaptureProgress = _a.idCardCaptureProgress,
|
|
11734
|
+
_4 = _a.idCardCaptureGuideImages,
|
|
11735
|
+
userSuppliedImages = _4 === void 0 ? defaultIdCaptureGuideImages : _4,
|
|
11736
|
+
_5 = _a.classNames,
|
|
11737
|
+
classNames = _5 === void 0 ? {} : _5,
|
|
11738
|
+
_6 = _a.verbiage,
|
|
11739
|
+
rawVerbiage = _6 === void 0 ? {} : _6;
|
|
11740
|
+
var cameraRef = useContext(CameraStateContext).cameraRef;
|
|
11741
|
+
var verbiage = useTranslations(rawVerbiage, {
|
|
11742
|
+
idFrontInstructionText: 'Display the front of your ID card...',
|
|
11743
|
+
idBackInstructionText: 'Display the back of your ID card...',
|
|
11744
|
+
flipIdInstructionText: 'Please flip your ID card...',
|
|
11745
|
+
verifyLivenessInstructionText: 'Performing facial recognition, please hold still...'
|
|
11746
|
+
});
|
|
11747
|
+
var instructionText = requestedAction === 'VERIFY_LIVENESS' ? verbiage.verifyLivenessInstructionText : requestedAction === 'SHOW_ID_FRONT' ? verbiage.idFrontInstructionText : requestedAction === 'FLIP_ID' ? verbiage.flipIdInstructionText : verbiage.idBackInstructionText;
|
|
11748
|
+
var theme = useTheme();
|
|
11749
|
+
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;
|
|
11750
|
+
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';
|
|
11751
|
+
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;
|
|
11752
|
+
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';
|
|
11753
|
+
var _7 = useResizeObserver(),
|
|
11754
|
+
idCardGuideRef = _7.ref,
|
|
11755
|
+
_8 = _7.width,
|
|
11756
|
+
idCardGuideWidth = _8 === void 0 ? 0 : _8,
|
|
11757
|
+
_9 = _7.height,
|
|
11758
|
+
idCardGuideHeight = _9 === void 0 ? 0 : _9;
|
|
11759
|
+
var idCaptureGuideImages = useGuideImages(userSuppliedImages);
|
|
11760
|
+
var idCaptureGuideImagesByUrl = useGuideImagesByUrl(idCaptureGuideImages);
|
|
11761
|
+
var _10 = useState(undefined),
|
|
11762
|
+
aspectRatio = _10[0],
|
|
11763
|
+
setAspectRatio = _10[1];
|
|
11764
|
+
var onImageLoaded = useCallback(function (e) {
|
|
11765
|
+
var _a, _b, _c, _d;
|
|
11766
|
+
var img = e.currentTarget;
|
|
11767
|
+
var imageByUrl = idCaptureGuideImagesByUrl[img.src];
|
|
11768
|
+
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;
|
|
11769
|
+
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;
|
|
11770
|
+
setAspectRatio(naturalHeight > 0 ? naturalWidth / naturalHeight : undefined);
|
|
11771
|
+
}, [idCaptureGuideImagesByUrl]);
|
|
11772
|
+
var idCardImageStyle = useMemo(function () {
|
|
11773
|
+
return {
|
|
11774
|
+
maxWidth: idCardGuideWidth > idCardGuideHeight ? idCardGuideWidth : undefined,
|
|
11775
|
+
maxHeight: idCardGuideHeight > idCardGuideWidth ? idCardGuideHeight : undefined,
|
|
11776
|
+
height: '100%',
|
|
11777
|
+
aspectRatio: aspectRatio
|
|
11778
|
+
};
|
|
11779
|
+
}, [idCardGuideWidth, idCardGuideHeight, aspectRatio]);
|
|
11780
|
+
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';
|
|
11781
|
+
return /*#__PURE__*/React__default.createElement(Container, {
|
|
11782
|
+
className: classNames.container
|
|
11783
|
+
}, /*#__PURE__*/React__default.createElement(Inner, null, /*#__PURE__*/React__default.createElement(FaceGuideContainer, {
|
|
11784
|
+
className: classNames.faceGuideContainer
|
|
11785
|
+
}, /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMaskWithStatus, {
|
|
11786
|
+
className: classNames.faceGuide,
|
|
11787
|
+
status: requestedAction === 'VERIFY_LIVENESS' ? faceGuideStatus : 'success',
|
|
11788
|
+
borderWidth: faceGuideBorderWidth,
|
|
11789
|
+
borderColor: faceGuideBorderColor,
|
|
11790
|
+
verticalAlign: "bottom"
|
|
11791
|
+
})), !disableIdGuides && ( /*#__PURE__*/React__default.createElement(IdCardGuideContainer, {
|
|
11792
|
+
className: classNames.idCardGuideContainer,
|
|
11793
|
+
ref: idCardGuideRef
|
|
11794
|
+
}, /*#__PURE__*/React__default.createElement(IdCardGuideInner, {
|
|
11795
|
+
className: classNames.idCardGuideInner,
|
|
11796
|
+
style: {
|
|
11797
|
+
aspectRatio: aspectRatio
|
|
11798
|
+
}
|
|
11799
|
+
}, /*#__PURE__*/React__default.createElement(IdCardGuideImageContainer, {
|
|
11800
|
+
className: classNames.idCardGuideImageContainer,
|
|
11801
|
+
status: requestedAction === 'VERIFY_LIVENESS' ? 'disabled' : idCardGuideStatus,
|
|
11802
|
+
borderWidth: idCardGuideBorderWidth,
|
|
11803
|
+
borderColor: idCardGuideBorderColor,
|
|
11804
|
+
aspectRatio: aspectRatio,
|
|
11805
|
+
"$isVisible": requestedAction !== 'FLIP_ID',
|
|
11806
|
+
progress: requestedAction === 'VERIFY_LIVENESS' ? undefined : idCardCaptureProgress
|
|
11807
|
+
}, /*#__PURE__*/React__default.createElement(IdCardGuideImage, {
|
|
11808
|
+
alt: "",
|
|
11809
|
+
className: classNames.idCardGuideImage,
|
|
11810
|
+
"$isMirrored": !((_v = cameraRef.current) === null || _v === void 0 ? void 0 : _v.isRearFacing),
|
|
11811
|
+
style: idCardImageStyle,
|
|
11812
|
+
src: requestedAction === 'SHOW_ID_BACK' ? idCaptureGuideImages.landscape.SHOW_ID_BACK.url : idCaptureGuideImages.landscape.SHOW_ID_FRONT.url,
|
|
11813
|
+
onLoad: onImageLoaded
|
|
11814
|
+
})), requestedAction === 'FLIP_ID' && ( /*#__PURE__*/React__default.createElement(IdVideoCaptureFlipIdPrompt, {
|
|
11815
|
+
idCaptureGuideImages: idCaptureGuideImages,
|
|
11816
|
+
classNames: classNames.flipIdPrompt,
|
|
11817
|
+
borderWidth: idCardGuideBorderWidth,
|
|
11818
|
+
borderColor: idCardGuideBorderColor,
|
|
11819
|
+
imageStyle: idCardImageStyle
|
|
11820
|
+
}))), /*#__PURE__*/React__default.createElement(IdCardGuideInstructionsContainer, {
|
|
11821
|
+
className: classNames.idCardGuideInstructionsContainer
|
|
11822
|
+
}, /*#__PURE__*/React__default.createElement(IdCardGuideInstructions, {
|
|
11823
|
+
className: classNames.idCardGuideInstructions,
|
|
11824
|
+
"$textColor": (_x = (_w = theme.idVideoCapture) === null || _w === void 0 ? void 0 : _w.idCardGuides) === null || _x === void 0 ? void 0 : _x.instructionsTextColor,
|
|
11825
|
+
"$background": (_z = (_y = theme.idVideoCapture) === null || _y === void 0 ? void 0 : _y.idCardGuides) === null || _z === void 0 ? void 0 : _z.instructionsBackgroundColor
|
|
11826
|
+
}, instructionText))))));
|
|
11827
|
+
};
|
|
11828
|
+
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) {
|
|
11829
|
+
var _a;
|
|
11830
|
+
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
11831
|
+
});
|
|
11832
|
+
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"])));
|
|
11833
|
+
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"])));
|
|
11834
|
+
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"])));
|
|
11835
|
+
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"])));
|
|
11836
|
+
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"])));
|
|
11837
|
+
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"])));
|
|
11838
|
+
var templateObject_1$7, templateObject_2$7, templateObject_3$7, templateObject_4$2, templateObject_5$1, templateObject_6$1, templateObject_7;
|
|
11839
|
+
|
|
11651
11840
|
var ReadTextPrompt = function ReadTextPrompt(_a) {
|
|
11652
11841
|
var text = _a.text,
|
|
11653
11842
|
onComplete = _a.onComplete,
|
|
@@ -11787,90 +11976,90 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
11787
11976
|
onExitCapture = _a.onExitCapture,
|
|
11788
11977
|
_x = _a.idCaptureModelsEnabled,
|
|
11789
11978
|
idCaptureModelsEnabled = _x === void 0 ? true : _x,
|
|
11790
|
-
|
|
11791
|
-
|
|
11792
|
-
|
|
11793
|
-
idCardFrontDelay =
|
|
11794
|
-
|
|
11795
|
-
videoIdCaptureThresholds =
|
|
11796
|
-
|
|
11797
|
-
skipShowIdCardBack =
|
|
11798
|
-
|
|
11799
|
-
captureCountdownSeconds =
|
|
11979
|
+
_y = _a.idCardCaptureGuideImages,
|
|
11980
|
+
idCardCaptureGuideImages = _y === void 0 ? defaultIdCaptureGuideImages : _y,
|
|
11981
|
+
_z = _a.idCardFrontDelay,
|
|
11982
|
+
idCardFrontDelay = _z === void 0 ? 1000 : _z,
|
|
11983
|
+
_0 = _a.videoIdCaptureThresholds,
|
|
11984
|
+
videoIdCaptureThresholds = _0 === void 0 ? defaultVideoIdCaptureThresholds : _0,
|
|
11985
|
+
_1 = _a.skipShowIdCardBack,
|
|
11986
|
+
skipShowIdCardBack = _1 === void 0 ? false : _1,
|
|
11987
|
+
_2 = _a.captureCountdownSeconds,
|
|
11988
|
+
captureCountdownSeconds = _2 === void 0 ? 3 : _2,
|
|
11800
11989
|
readTextPrompt = _a.readTextPrompt,
|
|
11801
|
-
|
|
11802
|
-
readTextTimeoutDurationMs =
|
|
11803
|
-
|
|
11804
|
-
readTextMinReadingMs =
|
|
11805
|
-
|
|
11806
|
-
disableFaceDetectionWhileAudioCapture =
|
|
11807
|
-
|
|
11808
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
11809
|
-
|
|
11810
|
-
mergeAVStreams =
|
|
11811
|
-
|
|
11812
|
-
classNames =
|
|
11813
|
-
|
|
11814
|
-
|
|
11815
|
-
|
|
11816
|
-
rawVerbiage =
|
|
11817
|
-
|
|
11818
|
-
debugMode =
|
|
11819
|
-
var
|
|
11820
|
-
ref =
|
|
11821
|
-
|
|
11822
|
-
width =
|
|
11823
|
-
|
|
11824
|
-
height =
|
|
11825
|
-
var
|
|
11826
|
-
cameraRef =
|
|
11827
|
-
videoRef =
|
|
11828
|
-
videoLoaded =
|
|
11829
|
-
cameraReady =
|
|
11830
|
-
microphoneReady =
|
|
11831
|
-
audioStream =
|
|
11832
|
-
setVideoLoaded =
|
|
11833
|
-
var
|
|
11834
|
-
detectedObjects =
|
|
11835
|
-
setDetectedObjects =
|
|
11836
|
-
var _15 = useState(null),
|
|
11837
|
-
face = _15[0],
|
|
11838
|
-
setFace = _15[1];
|
|
11839
|
-
var _16 = useContext(IdCaptureModelsContext),
|
|
11840
|
-
idModelsReady = _16.ready,
|
|
11841
|
-
startIdModels = _16.start,
|
|
11842
|
-
stopIdModels = _16.stop,
|
|
11843
|
-
onIdPredictionMade = _16.onPredictionMade,
|
|
11844
|
-
setThresholds = _16.setThresholds,
|
|
11845
|
-
setDocumentDetectionBoundaries = _16.setDocumentDetectionBoundaries,
|
|
11846
|
-
bestFrameDetails = _16.bestFrameDetails,
|
|
11847
|
-
resetBestFrame = _16.resetBestFrame,
|
|
11848
|
-
idModelError = _16.modelError;
|
|
11990
|
+
_3 = _a.readTextTimeoutDurationMs,
|
|
11991
|
+
readTextTimeoutDurationMs = _3 === void 0 ? 15000 : _3,
|
|
11992
|
+
_4 = _a.readTextMinReadingMs,
|
|
11993
|
+
readTextMinReadingMs = _4 === void 0 ? 10000 : _4,
|
|
11994
|
+
_5 = _a.disableFaceDetectionWhileAudioCapture,
|
|
11995
|
+
disableFaceDetectionWhileAudioCapture = _5 === void 0 ? false : _5,
|
|
11996
|
+
_6 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
11997
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _6 === void 0 ? 2000 : _6,
|
|
11998
|
+
_7 = _a.mergeAVStreams,
|
|
11999
|
+
mergeAVStreams = _7 === void 0 ? false : _7,
|
|
12000
|
+
_8 = _a.classNames,
|
|
12001
|
+
classNames = _8 === void 0 ? {} : _8,
|
|
12002
|
+
_9 = _a.colors,
|
|
12003
|
+
colors = _9 === void 0 ? {} : _9,
|
|
12004
|
+
_10 = _a.verbiage,
|
|
12005
|
+
rawVerbiage = _10 === void 0 ? {} : _10,
|
|
12006
|
+
_11 = _a.debugMode,
|
|
12007
|
+
debugMode = _11 === void 0 ? false : _11;
|
|
12008
|
+
var _12 = useResizeObserver(),
|
|
12009
|
+
ref = _12.ref,
|
|
12010
|
+
_13 = _12.width,
|
|
12011
|
+
width = _13 === void 0 ? 1 : _13,
|
|
12012
|
+
_14 = _12.height,
|
|
12013
|
+
height = _14 === void 0 ? 1 : _14;
|
|
12014
|
+
var _15 = useContext(CameraStateContext),
|
|
12015
|
+
cameraRef = _15.cameraRef,
|
|
12016
|
+
videoRef = _15.videoRef,
|
|
12017
|
+
videoLoaded = _15.videoLoaded,
|
|
12018
|
+
cameraReady = _15.cameraReady,
|
|
12019
|
+
microphoneReady = _15.microphoneReady,
|
|
12020
|
+
audioStream = _15.audioStream,
|
|
12021
|
+
setVideoLoaded = _15.setVideoLoaded;
|
|
12022
|
+
var _16 = useState([]),
|
|
12023
|
+
detectedObjects = _16[0],
|
|
12024
|
+
setDetectedObjects = _16[1];
|
|
11849
12025
|
var _17 = useState(null),
|
|
11850
|
-
|
|
11851
|
-
|
|
11852
|
-
var _18 = useContext(
|
|
11853
|
-
|
|
11854
|
-
|
|
11855
|
-
|
|
11856
|
-
|
|
11857
|
-
|
|
11858
|
-
|
|
11859
|
-
|
|
11860
|
-
|
|
11861
|
-
|
|
11862
|
-
|
|
11863
|
-
|
|
11864
|
-
|
|
11865
|
-
|
|
11866
|
-
|
|
11867
|
-
|
|
11868
|
-
|
|
11869
|
-
|
|
12026
|
+
face = _17[0],
|
|
12027
|
+
setFace = _17[1];
|
|
12028
|
+
var _18 = useContext(IdCaptureModelsContext),
|
|
12029
|
+
idModelsReady = _18.ready,
|
|
12030
|
+
startIdModels = _18.start,
|
|
12031
|
+
stopIdModels = _18.stop,
|
|
12032
|
+
onIdPredictionMade = _18.onPredictionMade,
|
|
12033
|
+
setThresholds = _18.setThresholds,
|
|
12034
|
+
setDocumentDetectionBoundaries = _18.setDocumentDetectionBoundaries,
|
|
12035
|
+
bestFrameDetails = _18.bestFrameDetails,
|
|
12036
|
+
resetBestFrame = _18.resetBestFrame,
|
|
12037
|
+
idModelError = _18.modelError;
|
|
12038
|
+
var _19 = useState(null),
|
|
12039
|
+
videoStartsAt = _19[0],
|
|
12040
|
+
setVideoStartsAt = _19[1];
|
|
12041
|
+
var _20 = useContext(SubmissionContext),
|
|
12042
|
+
setIdCaptureVideoAudioStartsAt = _20.setIdCaptureVideoAudioStartsAt,
|
|
12043
|
+
setExpectedAudioText = _20.setExpectedAudioText;
|
|
12044
|
+
var _21 = useContext(SelfieGuidanceModelsContext),
|
|
12045
|
+
startSelfieGuidance = _21.start,
|
|
12046
|
+
stopSelfieGuidance = _21.stop,
|
|
12047
|
+
onSelfiePredictionMade = _21.onPredictionMade,
|
|
12048
|
+
selfieModelError = _21.error;
|
|
12049
|
+
var _22 = useVideoRecorder(cameraRef.current, audioStream, mergeAVStreams),
|
|
12050
|
+
isRecordingVideo = _22.isRecordingVideo,
|
|
12051
|
+
startRecordingVideo = _22.startRecordingVideo,
|
|
12052
|
+
startRecordingAudio = _22.startRecordingAudio,
|
|
12053
|
+
stopRecordingVideo = _22.stopRecordingVideo,
|
|
12054
|
+
stopRecordingAudio = _22.stopRecordingAudio,
|
|
12055
|
+
videoRecordingUnintentionallyStopped = _22.videoRecordingUnintentionallyStopped,
|
|
12056
|
+
audioRecordingUnintentionallyStopped = _22.audioRecordingUnintentionallyStopped,
|
|
12057
|
+
videoUrl = _22.videoUrl,
|
|
12058
|
+
audioUrl = _22.audioUrl;
|
|
11870
12059
|
var countdownTimeoutRef = useRef(undefined);
|
|
11871
|
-
var
|
|
11872
|
-
countdownRemaining =
|
|
11873
|
-
setCountdownRemaining =
|
|
12060
|
+
var _23 = useState(-1),
|
|
12061
|
+
countdownRemaining = _23[0],
|
|
12062
|
+
setCountdownRemaining = _23[1];
|
|
11874
12063
|
useEffect(function () {
|
|
11875
12064
|
if (!isRecordingVideo && !videoUrl) {
|
|
11876
12065
|
startRecordingVideo();
|
|
@@ -11890,9 +12079,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
11890
12079
|
onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
|
|
11891
12080
|
}
|
|
11892
12081
|
}, [audioRecordingUnintentionallyStopped, onRecordingFailed, videoRecordingUnintentionallyStopped]);
|
|
11893
|
-
var
|
|
11894
|
-
requestedAction =
|
|
11895
|
-
setRequestedAction =
|
|
12082
|
+
var _24 = useState('SHOW_ID_FRONT'),
|
|
12083
|
+
requestedAction = _24[0],
|
|
12084
|
+
setRequestedAction = _24[1];
|
|
11896
12085
|
var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
|
|
11897
12086
|
useEffect(function startModelsWhenCapturing() {
|
|
11898
12087
|
if (!shouldRunIdModels) return;
|
|
@@ -11912,18 +12101,18 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
11912
12101
|
bottom: 1
|
|
11913
12102
|
});
|
|
11914
12103
|
}, [setDocumentDetectionBoundaries]);
|
|
11915
|
-
var _23 = useState(0),
|
|
11916
|
-
currentDetectionScore = _23[0],
|
|
11917
|
-
setCurrentDetectionScore = _23[1];
|
|
11918
|
-
var _24 = useState('none'),
|
|
11919
|
-
currentDetectedDocumentType = _24[0],
|
|
11920
|
-
setCurrentDetectedDocumentType = _24[1];
|
|
11921
12104
|
var _25 = useState(0),
|
|
11922
|
-
|
|
11923
|
-
|
|
11924
|
-
var _26 = useState(
|
|
11925
|
-
|
|
11926
|
-
|
|
12105
|
+
currentDetectionScore = _25[0],
|
|
12106
|
+
setCurrentDetectionScore = _25[1];
|
|
12107
|
+
var _26 = useState('none'),
|
|
12108
|
+
currentDetectedDocumentType = _26[0],
|
|
12109
|
+
setCurrentDetectedDocumentType = _26[1];
|
|
12110
|
+
var _27 = useState(0),
|
|
12111
|
+
currentFocusScore = _27[0],
|
|
12112
|
+
setCurrentFocusScore = _27[1];
|
|
12113
|
+
var _28 = useState(0),
|
|
12114
|
+
goodFramesCount = _28[0],
|
|
12115
|
+
setGoodFramesCount = _28[1];
|
|
11927
12116
|
var goodFramesThreshold = requestedAction === 'SHOW_ID_FRONT' ? videoIdCaptureThresholds.goodFrames.idCardFront : videoIdCaptureThresholds.goodFrames.idCardBack;
|
|
11928
12117
|
var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
|
|
11929
12118
|
useEffect(function () {
|
|
@@ -11944,9 +12133,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
11944
12133
|
} : 0);
|
|
11945
12134
|
});
|
|
11946
12135
|
}, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, videoIdCaptureThresholds.flipShortcutThreshold]);
|
|
11947
|
-
var
|
|
11948
|
-
idFrontCaptureStartedAt =
|
|
11949
|
-
setFirstGoodFrameTime =
|
|
12136
|
+
var _29 = useState(null),
|
|
12137
|
+
idFrontCaptureStartedAt = _29[0],
|
|
12138
|
+
setFirstGoodFrameTime = _29[1];
|
|
11950
12139
|
useEffect(function () {
|
|
11951
12140
|
if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
|
|
11952
12141
|
}, [goodFramesCount]);
|
|
@@ -11967,9 +12156,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
11967
12156
|
var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
|
|
11968
12157
|
var faceBox = face === null || face === void 0 ? void 0 : face.box;
|
|
11969
12158
|
var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
|
|
11970
|
-
var
|
|
11971
|
-
countdownStartedAt =
|
|
11972
|
-
setCountdownStartedAt =
|
|
12159
|
+
var _30 = useState(),
|
|
12160
|
+
countdownStartedAt = _30[0],
|
|
12161
|
+
setCountdownStartedAt = _30[1];
|
|
11973
12162
|
var photoCanvas = useRef(null);
|
|
11974
12163
|
var frameLock = useRef(false);
|
|
11975
12164
|
var captureFrame = useCallback(function () {
|
|
@@ -12092,9 +12281,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
12092
12281
|
stopSelfieGuidance();
|
|
12093
12282
|
};
|
|
12094
12283
|
}, [startSelfieGuidance, stopSelfieGuidance]);
|
|
12095
|
-
var
|
|
12096
|
-
numFramesWithoutFaces =
|
|
12097
|
-
setNumFramesWithoutFaces =
|
|
12284
|
+
var _31 = useState(0),
|
|
12285
|
+
numFramesWithoutFaces = _31[0],
|
|
12286
|
+
setNumFramesWithoutFaces = _31[1];
|
|
12098
12287
|
onSelfiePredictionMade(useThrottledCallback(useCallback(function (_a) {
|
|
12099
12288
|
var face = _a.face;
|
|
12100
12289
|
if (selfieModelError) return;
|
|
@@ -12110,12 +12299,12 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
12110
12299
|
}
|
|
12111
12300
|
}, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
|
|
12112
12301
|
var theme = useTheme();
|
|
12113
|
-
var
|
|
12302
|
+
var _32 = useTranslations(rawVerbiage, {
|
|
12114
12303
|
faceNotCenteredText: 'Please move your face to the center...',
|
|
12115
12304
|
captureBtnText: 'Capture'
|
|
12116
12305
|
}),
|
|
12117
|
-
captureBtnText =
|
|
12118
|
-
faceNotCenteredText =
|
|
12306
|
+
captureBtnText = _32.captureBtnText,
|
|
12307
|
+
faceNotCenteredText = _32.faceNotCenteredText;
|
|
12119
12308
|
var debugScalingDetails = useDebugScalingDetails({
|
|
12120
12309
|
enabled: debugMode,
|
|
12121
12310
|
pageWidth: width,
|
|
@@ -12140,7 +12329,17 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
12140
12329
|
classNames: classNames.readTextPrompt,
|
|
12141
12330
|
verbiage: rawVerbiage.readTextPrompt,
|
|
12142
12331
|
onComplete: stopRecording
|
|
12143
|
-
})) : ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null,
|
|
12332
|
+
})) : ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(IdVideoCaptureGuides, {
|
|
12333
|
+
classNames: classNames.guides,
|
|
12334
|
+
verbiage: rawVerbiage.guides,
|
|
12335
|
+
requestedAction: requestedAction,
|
|
12336
|
+
satisfied: satisfied,
|
|
12337
|
+
idCardGuideStatus: countdownStartedAt ? 'capturing' : 'ready',
|
|
12338
|
+
idCardCaptureProgress: !!countdownStartedAt ? 1 : 0,
|
|
12339
|
+
idCardCaptureGuideImages: idCardCaptureGuideImages,
|
|
12340
|
+
faceGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor,
|
|
12341
|
+
idCardGuideBorderColor: satisfied ? colors.guidesSatisfiedColor : colors.guidesUnsatisfiedColor
|
|
12342
|
+
}), debugMode && capturingId && ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ObjectDetectionDebugOverlayDiv, {
|
|
12144
12343
|
"$flipX": !((_l = cameraRef.current) === null || _l === void 0 ? void 0 : _l.isRearFacing)
|
|
12145
12344
|
}, detectedObjects.map(function (obj, i) {
|
|
12146
12345
|
var _a;
|
|
@@ -12440,27 +12639,18 @@ var VideoIdWizard = function VideoIdWizard(_a) {
|
|
|
12440
12639
|
onExitCapture === null || onExitCapture === void 0 ? void 0 : onExitCapture();
|
|
12441
12640
|
}, [onExitCapture]);
|
|
12442
12641
|
var faceLivenessGuides = useCallback(function (_a) {
|
|
12443
|
-
|
|
12444
|
-
|
|
12445
|
-
|
|
12446
|
-
|
|
12447
|
-
|
|
12448
|
-
|
|
12449
|
-
|
|
12450
|
-
|
|
12451
|
-
|
|
12452
|
-
|
|
12453
|
-
|
|
12454
|
-
|
|
12455
|
-
// }
|
|
12456
|
-
// idCardGuideStatus="disabled"
|
|
12457
|
-
// // idCardGuideBorderColor={
|
|
12458
|
-
// // status === 'success'
|
|
12459
|
-
// // ? colors.idVideoCapture?.guidesSatisfiedColor
|
|
12460
|
-
// // : colors.idVideoCapture?.guidesUnsatisfiedColor
|
|
12461
|
-
// // }
|
|
12462
|
-
// />
|
|
12463
|
-
[(_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]);
|
|
12642
|
+
var _b, _c, _d, _e;
|
|
12643
|
+
var status = _a.status;
|
|
12644
|
+
return /*#__PURE__*/React__default.createElement(IdVideoCaptureGuides, {
|
|
12645
|
+
idCardCaptureGuideImages: idCaptureGuideImages,
|
|
12646
|
+
classNames: (_b = classNames.idVideoCapture) === null || _b === void 0 ? void 0 : _b.guides,
|
|
12647
|
+
verbiage: (_c = verbiage.idVideoCapture) === null || _c === void 0 ? void 0 : _c.guides,
|
|
12648
|
+
requestedAction: "VERIFY_LIVENESS",
|
|
12649
|
+
faceGuideStatus: status,
|
|
12650
|
+
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,
|
|
12651
|
+
idCardGuideStatus: "disabled"
|
|
12652
|
+
});
|
|
12653
|
+
}, [(_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]);
|
|
12464
12654
|
if (submissionStatus === SubmissionStatus.SUBMITTING) {
|
|
12465
12655
|
return /*#__PURE__*/React__default.createElement(PageContainer, {
|
|
12466
12656
|
className: "flex"
|