idmission-web-sdk 2.2.84 → 2.2.86
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/CompositeWizard.d.ts.map +1 -1
- package/dist/components/customer_flows/IdAndFaceValidation.d.ts +2 -0
- package/dist/components/customer_flows/IdAndFaceValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/IdValidation.d.ts +2 -0
- package/dist/components/customer_flows/IdValidation.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureGuidesCommon.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureOrUploadScreen.d.ts +75 -0
- package/dist/components/id_capture/IdCaptureOrUploadScreen.d.ts.map +1 -0
- package/dist/components/id_capture/IdCaptureStateProvider.d.ts +10 -1
- package/dist/components/id_capture/IdCaptureStateProvider.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts +5 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts.map +1 -1
- package/dist/components/submission/SubmissionProvider.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +858 -248
- 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 +858 -248
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +858 -248
- 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/themes/index.d.ts +2 -0
- package/dist/themes/index.d.ts.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +3 -3
|
@@ -211,7 +211,7 @@
|
|
|
211
211
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
212
212
|
};
|
|
213
213
|
|
|
214
|
-
var webSdkVersion = '2.2.
|
|
214
|
+
var webSdkVersion = '2.2.86';
|
|
215
215
|
|
|
216
216
|
function getPlatform() {
|
|
217
217
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -372,7 +372,7 @@
|
|
|
372
372
|
});
|
|
373
373
|
}
|
|
374
374
|
|
|
375
|
-
var PageContainerDiv = styled.div(templateObject_1$
|
|
375
|
+
var PageContainerDiv = styled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n ", "\n\n ", "\n\n &.flex {\n display: flex;\n }\n\n &.padded {\n box-sizing: border-box;\n padding: 16px 24px;\n }\n"], ["\n ", "\n\n ", "\n\n &.flex {\n display: flex;\n }\n\n &.padded {\n box-sizing: border-box;\n padding: 16px 24px;\n }\n"])), function (props) {
|
|
376
376
|
var _a;
|
|
377
377
|
return props.theme.isFullscreen === false ? "" : "\n position: fixed;\n top: 0;\n left: 0;\n width: var(--app-width);\n height: calc(\n var(--app-height) - ".concat((_a = props.$heightOffset) !== null && _a !== void 0 ? _a : 0, "px\n );\n overflow-x: hidden;\n overflow-y: auto;\n ");
|
|
378
378
|
}, function (props) {
|
|
@@ -412,7 +412,7 @@
|
|
|
412
412
|
}, dimensionsCalculated && children);
|
|
413
413
|
});
|
|
414
414
|
PageContainer.displayName = 'PageContainer';
|
|
415
|
-
var templateObject_1$
|
|
415
|
+
var templateObject_1$M;
|
|
416
416
|
|
|
417
417
|
var LoaderButton = function LoaderButton(_a) {
|
|
418
418
|
var children = _a.children,
|
|
@@ -469,29 +469,29 @@
|
|
|
469
469
|
className: "ladda-label"
|
|
470
470
|
}, children));
|
|
471
471
|
};
|
|
472
|
-
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) {
|
|
472
|
+
var StyledButton = styled.button(templateObject_1$L || (templateObject_1$L = __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) {
|
|
473
473
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
474
474
|
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 ");
|
|
475
475
|
});
|
|
476
|
-
var templateObject_1$
|
|
476
|
+
var templateObject_1$L;
|
|
477
477
|
|
|
478
|
-
var OverlayContainer = styled(PageContainer)(templateObject_1$
|
|
478
|
+
var OverlayContainer = styled(PageContainer)(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n background: ", ";\n ", "\n z-index: 10000;\n"], ["\n background: ", ";\n ", "\n z-index: 10000;\n"])), function (props) {
|
|
479
479
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
480
480
|
}, function (props) {
|
|
481
481
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
482
482
|
});
|
|
483
|
-
var OverlayInner$2 = styled.div(templateObject_2$
|
|
483
|
+
var OverlayInner$2 = styled.div(templateObject_2$B || (templateObject_2$B = __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) {
|
|
484
484
|
var _a;
|
|
485
485
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
486
486
|
}, function (props) {
|
|
487
487
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
488
488
|
});
|
|
489
|
-
var OverlayImageContainer = styled.div(templateObject_3$
|
|
490
|
-
var OverlayImageRow = styled.div(templateObject_4$
|
|
491
|
-
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$
|
|
492
|
-
var ButtonsColumn = styled.div(templateObject_6$
|
|
493
|
-
var WideButton = styled(LoaderButton)(templateObject_7$
|
|
494
|
-
var WideBorderButton = styled(WideButton)(templateObject_8$
|
|
489
|
+
var OverlayImageContainer = styled.div(templateObject_3$s || (templateObject_3$s = __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"])));
|
|
490
|
+
var OverlayImageRow = styled.div(templateObject_4$m || (templateObject_4$m = __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"])));
|
|
491
|
+
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
492
|
+
var ButtonsColumn = styled.div(templateObject_6$a || (templateObject_6$a = __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"])));
|
|
493
|
+
var WideButton = styled(LoaderButton)(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n width: 100%;\n border-radius: 30px;\n"], ["\n width: 100%;\n border-radius: 30px;\n"])));
|
|
494
|
+
var WideBorderButton = styled(WideButton)(templateObject_8$4 || (templateObject_8$4 = __makeTemplateObject(["\n color: ", ";\n background: ", ";\n border: 1px solid\n ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n background: ", ";\n border: 1px solid\n ", ";\n box-sizing: border-box;\n"])), function (props) {
|
|
495
495
|
var _a, _b;
|
|
496
496
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.textColor) !== null && _b !== void 0 ? _b : 'black';
|
|
497
497
|
}, function (props) {
|
|
@@ -501,7 +501,7 @@
|
|
|
501
501
|
var _a, _b;
|
|
502
502
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.borderColor) !== null && _b !== void 0 ? _b : 'var(--idm-color-secondary-500)';
|
|
503
503
|
});
|
|
504
|
-
var templateObject_1$
|
|
504
|
+
var templateObject_1$K, templateObject_2$B, templateObject_3$s, templateObject_4$m, templateObject_5$d, templateObject_6$a, templateObject_7$7, templateObject_8$4;
|
|
505
505
|
|
|
506
506
|
function _extends() {
|
|
507
507
|
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
@@ -1056,13 +1056,13 @@
|
|
|
1056
1056
|
}, retryText)))));
|
|
1057
1057
|
};
|
|
1058
1058
|
|
|
1059
|
-
var wavesAnimation = styled.keyframes(templateObject_1$
|
|
1060
|
-
var progressBarAnimation = styled.keyframes(templateObject_2$
|
|
1061
|
-
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$
|
|
1062
|
-
var progressBorderAnimation = styled.keyframes(templateObject_4$
|
|
1063
|
-
var templateObject_1$
|
|
1059
|
+
var wavesAnimation = styled.keyframes(templateObject_1$J || (templateObject_1$J = __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"])));
|
|
1060
|
+
var progressBarAnimation = styled.keyframes(templateObject_2$A || (templateObject_2$A = __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"])));
|
|
1061
|
+
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$r || (templateObject_3$r = __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"])));
|
|
1062
|
+
var progressBorderAnimation = styled.keyframes(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
1063
|
+
var templateObject_1$J, templateObject_2$A, templateObject_3$r, templateObject_4$l;
|
|
1064
1064
|
|
|
1065
|
-
var Spinner$1 = styled.div(templateObject_1$
|
|
1065
|
+
var Spinner$1 = styled.div(templateObject_1$I || (templateObject_1$I = __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) {
|
|
1066
1066
|
var $size = _a.$size;
|
|
1067
1067
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
1068
1068
|
}, function (_a) {
|
|
@@ -1087,7 +1087,7 @@
|
|
|
1087
1087
|
var $color = _a.$color;
|
|
1088
1088
|
return $color !== null && $color !== void 0 ? $color : '#888';
|
|
1089
1089
|
}, dualRingSpinnerAnimation);
|
|
1090
|
-
var templateObject_1$
|
|
1090
|
+
var templateObject_1$I;
|
|
1091
1091
|
|
|
1092
1092
|
exports.defaultAuthUrl = 'https://portal-api.idmission.com';
|
|
1093
1093
|
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'];
|
|
@@ -2686,7 +2686,7 @@
|
|
|
2686
2686
|
}
|
|
2687
2687
|
});
|
|
2688
2688
|
});
|
|
2689
|
-
}, [clientRequestID, documentServiceUrl, geolocationResult, idBackCaptureAttempts, idCardForFaceMatch, idFrontCaptureAttempts, selfieCaptureAttempts, uploadDocument, webhooksStripSpecialCharacters]);
|
|
2689
|
+
}, [clientRequestID, documentServiceUrl, geolocationResult, idBackCaptureAttempts, idCardForFaceMatch, idFrontCaptureAttempts, selfieCaptureAttempts, uploadDocument, useDocumentServiceForLivenessChecks, webhooksStripSpecialCharacters]);
|
|
2690
2690
|
var checkLiveness = React.useCallback(function (imageDataUrl) {
|
|
2691
2691
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
2692
2692
|
var request, host, endpoint, response, statusMessage, submissionResponse_3, e_2, err;
|
|
@@ -8105,7 +8105,7 @@
|
|
|
8105
8105
|
return [frameWidth, frameHeight];
|
|
8106
8106
|
}
|
|
8107
8107
|
|
|
8108
|
-
var InvisibleCanvas = styled.canvas(templateObject_1$
|
|
8108
|
+
var InvisibleCanvas = styled.canvas(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
8109
8109
|
function drawToCanvas(canvas, frame, width, height) {
|
|
8110
8110
|
if (!canvas) return;
|
|
8111
8111
|
var ctx = canvas.getContext('2d');
|
|
@@ -8125,7 +8125,7 @@
|
|
|
8125
8125
|
var _a;
|
|
8126
8126
|
(_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);
|
|
8127
8127
|
}
|
|
8128
|
-
var templateObject_1$
|
|
8128
|
+
var templateObject_1$H;
|
|
8129
8129
|
|
|
8130
8130
|
function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
|
|
8131
8131
|
if (quality === void 0) {
|
|
@@ -10592,12 +10592,14 @@
|
|
|
10592
10592
|
capturing: false,
|
|
10593
10593
|
captureFailed: false,
|
|
10594
10594
|
imageUrl: null,
|
|
10595
|
-
captureState: '
|
|
10595
|
+
captureState: 'initializing',
|
|
10596
10596
|
capturedDocuments: {},
|
|
10597
10597
|
captureRequirement: 'idCardOrPassport',
|
|
10598
10598
|
requestedDocumentType: 'idCardFront',
|
|
10599
10599
|
allowSinglePageIdCapture: false,
|
|
10600
10600
|
allowIdCardBackToFrontCapture: false,
|
|
10601
|
+
isUploadingDocumentsFromStorage: false,
|
|
10602
|
+
uploadingDocumentsType: null,
|
|
10601
10603
|
operationStartedAt: null,
|
|
10602
10604
|
captureStartedAt: null
|
|
10603
10605
|
};
|
|
@@ -10638,6 +10640,9 @@
|
|
|
10638
10640
|
}
|
|
10639
10641
|
}
|
|
10640
10642
|
newState.operationStartedAt = new Date();
|
|
10643
|
+
if (!action.payload.allowUploadingDocumentsFromStorage) {
|
|
10644
|
+
newState.captureState = 'capturing';
|
|
10645
|
+
}
|
|
10641
10646
|
return newState;
|
|
10642
10647
|
}
|
|
10643
10648
|
case 'setRequiredDocumentType':
|
|
@@ -10835,6 +10840,7 @@
|
|
|
10835
10840
|
{
|
|
10836
10841
|
var newState = _assign(_assign({}, state), {
|
|
10837
10842
|
capturedDocuments: _assign(_assign({}, state.capturedDocuments), (_b = {}, _b[state.requestedDocumentType] = _assign(_assign({}, action.payload), {
|
|
10843
|
+
documentType: state.requestedDocumentType,
|
|
10838
10844
|
width: 0,
|
|
10839
10845
|
height: 0
|
|
10840
10846
|
}), _b))
|
|
@@ -10845,10 +10851,13 @@
|
|
|
10845
10851
|
} else {
|
|
10846
10852
|
newState.requestedDocumentType = remainingRequirements[0];
|
|
10847
10853
|
if (state.requestedDocumentType === 'idCardFront' && newState.requestedDocumentType === 'idCardBack' || state.requestedDocumentType === 'idCardBack' && newState.requestedDocumentType === 'idCardFront') {
|
|
10848
|
-
newState.
|
|
10854
|
+
if (!newState.isUploadingDocumentsFromStorage) {
|
|
10855
|
+
newState.captureState = 'requestingFlip';
|
|
10856
|
+
}
|
|
10849
10857
|
newState.idCardFrontDetectionThresholdMet = false;
|
|
10850
10858
|
newState.idCardBackDetectionThresholdMet = false;
|
|
10851
10859
|
newState.passportDetectionThresholdMet = false;
|
|
10860
|
+
newState.wrongDocumentTypePredictions = 0;
|
|
10852
10861
|
}
|
|
10853
10862
|
}
|
|
10854
10863
|
return newState;
|
|
@@ -10869,6 +10878,17 @@
|
|
|
10869
10878
|
allowOverrideWrongDocumentTypeGuidance: false,
|
|
10870
10879
|
overrideWrongDocumentTypeGuidance: true
|
|
10871
10880
|
});
|
|
10881
|
+
case 'setUploadingDocumentsFromStorage':
|
|
10882
|
+
return _assign(_assign({}, state), {
|
|
10883
|
+
isUploadingDocumentsFromStorage: action.payload,
|
|
10884
|
+
captureState: action.payload ? 'initializing' : 'capturing'
|
|
10885
|
+
});
|
|
10886
|
+
case 'setUploadingDocumentsType':
|
|
10887
|
+
return _assign(_assign({}, state), {
|
|
10888
|
+
captureState: action.payload ? 'uploading' : 'initializing',
|
|
10889
|
+
uploadingDocumentsType: action.payload,
|
|
10890
|
+
requestedDocumentType: action.payload === 'passport' ? 'passport' : 'idCardFront'
|
|
10891
|
+
});
|
|
10872
10892
|
case 'resetWizard':
|
|
10873
10893
|
return _assign(_assign({}, initialState$4), {
|
|
10874
10894
|
captureRequirement: state.captureRequirement,
|
|
@@ -10921,12 +10941,12 @@
|
|
|
10921
10941
|
if (!portalLocation) return element;
|
|
10922
10942
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
10923
10943
|
}
|
|
10924
|
-
var DebugStatsPaneDiv = styled.span(templateObject_1$
|
|
10925
|
-
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$
|
|
10944
|
+
var DebugStatsPaneDiv = styled.span(templateObject_1$G || (templateObject_1$G = __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"])));
|
|
10945
|
+
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$z || (templateObject_2$z = __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) {
|
|
10926
10946
|
var $flipX = _a.$flipX;
|
|
10927
10947
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
10928
10948
|
});
|
|
10929
|
-
var ObjectDetectionDebugBox = styled.div(templateObject_3$
|
|
10949
|
+
var ObjectDetectionDebugBox = styled.div(templateObject_3$q || (templateObject_3$q = __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) {
|
|
10930
10950
|
var $color = _a.$color;
|
|
10931
10951
|
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
10932
10952
|
}, function (_a) {
|
|
@@ -10936,7 +10956,7 @@
|
|
|
10936
10956
|
var $flipX = _a.$flipX;
|
|
10937
10957
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
10938
10958
|
});
|
|
10939
|
-
var FaceDetectionKeypointMarker = styled.div(templateObject_4$
|
|
10959
|
+
var FaceDetectionKeypointMarker = styled.div(templateObject_4$k || (templateObject_4$k = __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) {
|
|
10940
10960
|
var $color = _a.$color;
|
|
10941
10961
|
return $color !== null && $color !== void 0 ? $color : 'red';
|
|
10942
10962
|
}, function (_a) {
|
|
@@ -11127,7 +11147,7 @@
|
|
|
11127
11147
|
}
|
|
11128
11148
|
});
|
|
11129
11149
|
}
|
|
11130
|
-
var templateObject_1$
|
|
11150
|
+
var templateObject_1$G, templateObject_2$z, templateObject_3$q, templateObject_4$k;
|
|
11131
11151
|
|
|
11132
11152
|
function _classCallCheck(a, n) {
|
|
11133
11153
|
if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function");
|
|
@@ -14914,7 +14934,7 @@
|
|
|
14914
14934
|
}, [fallbacks, i18n.language, t, verbiage]);
|
|
14915
14935
|
}
|
|
14916
14936
|
|
|
14917
|
-
var GuidanceMessageContainerDiv = styled.div(templateObject_1$
|
|
14937
|
+
var GuidanceMessageContainerDiv = styled.div(templateObject_1$F || (templateObject_1$F = __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) {
|
|
14918
14938
|
var $top = _a.$top;
|
|
14919
14939
|
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
14920
14940
|
}, function (_a) {
|
|
@@ -14927,14 +14947,14 @@
|
|
|
14927
14947
|
if (!portalLocation) return element;
|
|
14928
14948
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
14929
14949
|
};
|
|
14930
|
-
var GuidanceMessage = styled.div(templateObject_2$
|
|
14950
|
+
var GuidanceMessage = styled.div(templateObject_2$y || (templateObject_2$y = __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) {
|
|
14931
14951
|
var _a, _b, _c, _d, _e, _f;
|
|
14932
14952
|
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';
|
|
14933
14953
|
}, function (props) {
|
|
14934
14954
|
var _a, _b, _c, _d, _e, _f;
|
|
14935
14955
|
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';
|
|
14936
14956
|
});
|
|
14937
|
-
var templateObject_1$
|
|
14957
|
+
var templateObject_1$F, templateObject_2$y;
|
|
14938
14958
|
|
|
14939
14959
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
14940
14960
|
var _b = _a.classNames,
|
|
@@ -14957,7 +14977,7 @@
|
|
|
14957
14977
|
className: classNames.message
|
|
14958
14978
|
}, verbiage.messageText), /*#__PURE__*/React.createElement(ButtonContainer, {
|
|
14959
14979
|
className: classNames.buttonContainer
|
|
14960
|
-
}, /*#__PURE__*/React.createElement(Button, {
|
|
14980
|
+
}, /*#__PURE__*/React.createElement(Button$1, {
|
|
14961
14981
|
variant: "positive",
|
|
14962
14982
|
className: classNames.button,
|
|
14963
14983
|
onClick: function onClick() {
|
|
@@ -14967,18 +14987,18 @@
|
|
|
14967
14987
|
}
|
|
14968
14988
|
}, verbiage.buttonText))));
|
|
14969
14989
|
}
|
|
14970
|
-
var Container$2 = styled.div(templateObject_1$
|
|
14990
|
+
var Container$2 = styled.div(templateObject_1$E || (templateObject_1$E = __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) {
|
|
14971
14991
|
var _a, _b, _c;
|
|
14972
14992
|
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';
|
|
14973
14993
|
}, function (props) {
|
|
14974
14994
|
var _a, _b, _c;
|
|
14975
14995
|
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';
|
|
14976
14996
|
});
|
|
14977
|
-
var InnerContainer = styled.div(templateObject_2$
|
|
14978
|
-
var Message = styled.span(templateObject_3$
|
|
14979
|
-
var ButtonContainer = styled.div(templateObject_4$
|
|
14980
|
-
var Button = styled(LoaderButton)(templateObject_5$
|
|
14981
|
-
var templateObject_1$
|
|
14997
|
+
var InnerContainer = styled.div(templateObject_2$x || (templateObject_2$x = __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"])));
|
|
14998
|
+
var Message = styled.span(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n display: block;\n margin: auto 12px auto 0;\n"], ["\n display: block;\n margin: auto 12px auto 0;\n"])));
|
|
14999
|
+
var ButtonContainer = styled.div(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n display: flex;\n margin-left: auto;\n"], ["\n display: flex;\n margin-left: auto;\n"])));
|
|
15000
|
+
var Button$1 = styled(LoaderButton)(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n white-space: nowrap;\n margin: auto;\n"], ["\n white-space: nowrap;\n margin: auto;\n"])));
|
|
15001
|
+
var templateObject_1$E, templateObject_2$x, templateObject_3$p, templateObject_4$j, templateObject_5$c;
|
|
14982
15002
|
|
|
14983
15003
|
var IdCapture = function IdCapture(_a) {
|
|
14984
15004
|
var _b, _c, _d, _e, _f, _g, _h;
|
|
@@ -15176,13 +15196,13 @@
|
|
|
15176
15196
|
finished: true
|
|
15177
15197
|
}, verbiage.retryBtnText)));
|
|
15178
15198
|
};
|
|
15179
|
-
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$
|
|
15180
|
-
var StyledOverlayImageContainer$3 = styled(OverlayImageContainer)(templateObject_2$
|
|
15181
|
-
var Description$4 = styled.p(templateObject_3$
|
|
15182
|
-
var RetryButton$1 = styled(LoaderButton)(templateObject_4$
|
|
15183
|
-
var templateObject_1$
|
|
15199
|
+
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
15200
|
+
var StyledOverlayImageContainer$3 = styled(OverlayImageContainer)(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
15201
|
+
var Description$4 = styled.p(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
|
|
15202
|
+
var RetryButton$1 = styled(LoaderButton)(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
|
|
15203
|
+
var templateObject_1$D, templateObject_2$w, templateObject_3$o, templateObject_4$i;
|
|
15184
15204
|
|
|
15185
|
-
var ExitCaptureStyledButton = styled.button(templateObject_1$
|
|
15205
|
+
var ExitCaptureStyledButton = styled.button(templateObject_1$C || (templateObject_1$C = __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"])));
|
|
15186
15206
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
15187
15207
|
var onClick = _a.onClick,
|
|
15188
15208
|
className = _a.className;
|
|
@@ -15226,10 +15246,10 @@
|
|
|
15226
15246
|
y2: "19.75"
|
|
15227
15247
|
}))));
|
|
15228
15248
|
};
|
|
15229
|
-
var templateObject_1$
|
|
15249
|
+
var templateObject_1$C;
|
|
15230
15250
|
|
|
15231
|
-
var ButtonsRow = styled.div(templateObject_1$
|
|
15232
|
-
var templateObject_1$
|
|
15251
|
+
var ButtonsRow = styled.div(templateObject_1$B || (templateObject_1$B = __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"])));
|
|
15252
|
+
var templateObject_1$B;
|
|
15233
15253
|
|
|
15234
15254
|
function IdCaptureLoadingGraphic(props) {
|
|
15235
15255
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -15710,21 +15730,21 @@
|
|
|
15710
15730
|
fill: "white"
|
|
15711
15731
|
}))));
|
|
15712
15732
|
}
|
|
15713
|
-
var LoadingGraphicWrapper = styled.div(templateObject_1$
|
|
15714
|
-
var LoadingGraphicSvg = styled.svg(templateObject_2$
|
|
15733
|
+
var LoadingGraphicWrapper = styled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
|
|
15734
|
+
var LoadingGraphicSvg = styled.svg(templateObject_2$v || (templateObject_2$v = __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) {
|
|
15715
15735
|
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
15716
15736
|
}, function (props) {
|
|
15717
15737
|
return props.$frame >= 5 ? 10 : 0;
|
|
15718
15738
|
}, function (props) {
|
|
15719
15739
|
return props.$borderColor;
|
|
15720
15740
|
});
|
|
15721
|
-
var LoadingGraphicCardGroup = styled.g(templateObject_3$
|
|
15741
|
+
var LoadingGraphicCardGroup = styled.g(templateObject_3$n || (templateObject_3$n = __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) {
|
|
15722
15742
|
return props.$offScreen ? '-500px' : '0';
|
|
15723
15743
|
});
|
|
15724
|
-
var LoadingGraphicPhoneGroup = styled.g(templateObject_4$
|
|
15744
|
+
var LoadingGraphicPhoneGroup = styled.g(templateObject_4$h || (templateObject_4$h = __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) {
|
|
15725
15745
|
return props.$offScreen ? '40px' : '0';
|
|
15726
15746
|
});
|
|
15727
|
-
var templateObject_1$
|
|
15747
|
+
var templateObject_1$A, templateObject_2$v, templateObject_3$n, templateObject_4$h;
|
|
15728
15748
|
|
|
15729
15749
|
function LoadingListItemIndicator(_a) {
|
|
15730
15750
|
var _b = _a.state,
|
|
@@ -15919,33 +15939,33 @@
|
|
|
15919
15939
|
}
|
|
15920
15940
|
}, verbiage.continueText))))));
|
|
15921
15941
|
};
|
|
15922
|
-
var OverlayInner$1 = styled.div(templateObject_1$
|
|
15942
|
+
var OverlayInner$1 = styled.div(templateObject_1$z || (templateObject_1$z = __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) {
|
|
15923
15943
|
var _a, _b, _c, _d;
|
|
15924
15944
|
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';
|
|
15925
15945
|
}, function (props) {
|
|
15926
15946
|
var _a, _b, _c, _d;
|
|
15927
15947
|
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';
|
|
15928
15948
|
});
|
|
15929
|
-
var OverlayHeader$1 = styled.div(templateObject_2$
|
|
15949
|
+
var OverlayHeader$1 = styled.div(templateObject_2$u || (templateObject_2$u = __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) {
|
|
15930
15950
|
var _a;
|
|
15931
15951
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
15932
15952
|
}, function (props) {
|
|
15933
15953
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
15934
15954
|
});
|
|
15935
|
-
var StyledGuidanceMessage$2 = styled(GuidanceMessage)(templateObject_3$
|
|
15936
|
-
var StyledOverlayImageContainer$2 = styled(OverlayImageContainer)(templateObject_4$
|
|
15937
|
-
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_5$
|
|
15938
|
-
var ContinuityCameraCheckboxInner = styled(GuidanceMessage)(templateObject_6$
|
|
15939
|
-
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$
|
|
15940
|
-
var StyledButtonsRow$a = styled(ButtonsRow)(templateObject_8$
|
|
15955
|
+
var StyledGuidanceMessage$2 = styled(GuidanceMessage)(templateObject_3$m || (templateObject_3$m = __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"])));
|
|
15956
|
+
var StyledOverlayImageContainer$2 = styled(OverlayImageContainer)(templateObject_4$g || (templateObject_4$g = __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"])));
|
|
15957
|
+
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_5$b || (templateObject_5$b = __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"])));
|
|
15958
|
+
var ContinuityCameraCheckboxInner = styled(GuidanceMessage)(templateObject_6$9 || (templateObject_6$9 = __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"])));
|
|
15959
|
+
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
15960
|
+
var StyledButtonsRow$a = styled(ButtonsRow)(templateObject_8$3 || (templateObject_8$3 = __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) {
|
|
15941
15961
|
var _a, _b, _c, _d;
|
|
15942
15962
|
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';
|
|
15943
15963
|
}, function (props) {
|
|
15944
15964
|
var _a, _b, _c, _d, _e, _f;
|
|
15945
15965
|
return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarFontSize) ? "font-size: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.progressBarFontSize, ";") : '';
|
|
15946
15966
|
});
|
|
15947
|
-
var LoadingListContainer$1 = styled.div(templateObject_9$
|
|
15948
|
-
var LoadingList$1 = styled.ul(templateObject_10$
|
|
15967
|
+
var LoadingListContainer$1 = styled.div(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n display: flex;\n position: relative;\n z-index: 2;\n"], ["\n display: flex;\n position: relative;\n z-index: 2;\n"])));
|
|
15968
|
+
var LoadingList$1 = styled.ul(templateObject_10$2 || (templateObject_10$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"])));
|
|
15949
15969
|
var LoadingListItem$1 = styled.li(templateObject_11$1 || (templateObject_11$1 = __makeTemplateObject(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"], ["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"])));
|
|
15950
15970
|
var ProgressContainer$1 = styled.div(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
15951
15971
|
var ProgressBarBackground$1 = styled.div(templateObject_13$1 || (templateObject_13$1 = __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) {
|
|
@@ -15971,7 +15991,7 @@
|
|
|
15971
15991
|
var _a, _b, _c, _d, _e, _f;
|
|
15972
15992
|
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, ";") : '';
|
|
15973
15993
|
});
|
|
15974
|
-
var templateObject_1$
|
|
15994
|
+
var templateObject_1$z, templateObject_2$u, templateObject_3$m, templateObject_4$g, templateObject_5$b, templateObject_6$9, templateObject_7$6, templateObject_8$3, templateObject_9$3, templateObject_10$2, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16, templateObject_17, templateObject_18;
|
|
15975
15995
|
|
|
15976
15996
|
function _createForOfIteratorHelperLoose(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (t) return (t = t.call(r)).next.bind(t); if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e) { t && (r = t); var o = 0; return function () { return o >= r.length ? { done: !0 } : { done: !1, value: r[o++] }; }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
15977
15997
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
@@ -16047,8 +16067,8 @@
|
|
|
16047
16067
|
};
|
|
16048
16068
|
}
|
|
16049
16069
|
|
|
16050
|
-
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$
|
|
16051
|
-
var ContinuityCameraCheckbox = styled.input(templateObject_2$
|
|
16070
|
+
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
|
|
16071
|
+
var ContinuityCameraCheckbox = styled.input(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
16052
16072
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
16053
16073
|
var _b, _c, _d, _e;
|
|
16054
16074
|
var onDismissed = _a.onDismissed,
|
|
@@ -16166,7 +16186,7 @@
|
|
|
16166
16186
|
}
|
|
16167
16187
|
}, cameraReady && modelsReady ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
16168
16188
|
};
|
|
16169
|
-
var templateObject_1$
|
|
16189
|
+
var templateObject_1$y, templateObject_2$t;
|
|
16170
16190
|
|
|
16171
16191
|
var components$1 = {
|
|
16172
16192
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -16224,9 +16244,9 @@
|
|
|
16224
16244
|
});
|
|
16225
16245
|
};
|
|
16226
16246
|
|
|
16227
|
-
var Card = styled.div(templateObject_1$
|
|
16228
|
-
var FlexCard = styled(Card)(templateObject_2$
|
|
16229
|
-
var templateObject_1$
|
|
16247
|
+
var Card = styled.div(templateObject_1$x || (templateObject_1$x = __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"])));
|
|
16248
|
+
var FlexCard = styled(Card)(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
16249
|
+
var templateObject_1$x, templateObject_2$s;
|
|
16230
16250
|
|
|
16231
16251
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
16232
16252
|
var capturedDocuments = _a.capturedDocuments,
|
|
@@ -16285,13 +16305,13 @@
|
|
|
16285
16305
|
finished: true
|
|
16286
16306
|
}, verbiage.retryText)))));
|
|
16287
16307
|
};
|
|
16288
|
-
var Heading$a = styled.h1(templateObject_1$
|
|
16289
|
-
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$
|
|
16290
|
-
var ImageRow = styled(OverlayImageRow)(templateObject_3$
|
|
16291
|
-
var ImageCol$1 = styled.div(templateObject_4$
|
|
16292
|
-
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$
|
|
16293
|
-
var DebugPre = styled.pre(templateObject_6$
|
|
16294
|
-
var templateObject_1$
|
|
16308
|
+
var Heading$a = styled.h1(templateObject_1$w || (templateObject_1$w = __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"])));
|
|
16309
|
+
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$r || (templateObject_2$r = __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"])));
|
|
16310
|
+
var ImageRow = styled(OverlayImageRow)(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n max-width: 100%;\n flex-direction: column;\n display: grid;\n grid-gap: 12px;\n"], ["\n max-width: 100%;\n flex-direction: column;\n display: grid;\n grid-gap: 12px;\n"])));
|
|
16311
|
+
var ImageCol$1 = styled.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n width: 100%;\n max-height: none !important;\n"], ["\n width: 100%;\n max-height: none !important;\n"])));
|
|
16312
|
+
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n width: 100%;\n border-radius: 12px;\n"], ["\n width: 100%;\n border-radius: 12px;\n"])));
|
|
16313
|
+
var DebugPre = styled.pre(templateObject_6$8 || (templateObject_6$8 = __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"])));
|
|
16314
|
+
var templateObject_1$w, templateObject_2$r, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$8;
|
|
16295
16315
|
|
|
16296
16316
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
16297
16317
|
var _this = this;
|
|
@@ -16343,38 +16363,38 @@
|
|
|
16343
16363
|
canvas.style.height = '0';
|
|
16344
16364
|
}
|
|
16345
16365
|
|
|
16346
|
-
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$
|
|
16366
|
+
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n"])), function (props) {
|
|
16347
16367
|
return props.$isVisible ? '' : 'opacity: 0;';
|
|
16348
16368
|
});
|
|
16349
|
-
var IdCardGuideImage = styled.img(templateObject_2$
|
|
16369
|
+
var IdCardGuideImage = styled.img(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n transform-style: preserve-3d;\n ", "\n ", "\n"], ["\n transform-style: preserve-3d;\n ", "\n ", "\n"])), function (props) {
|
|
16350
16370
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
16351
16371
|
}, function (props) {
|
|
16352
16372
|
return props.$isInvisible ? 'opacity: 0;' : '';
|
|
16353
16373
|
});
|
|
16354
16374
|
function IdCardBorder(_a) {
|
|
16355
|
-
var _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
16375
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
16356
16376
|
var children = _a.children,
|
|
16357
|
-
|
|
16358
|
-
status =
|
|
16359
|
-
|
|
16360
|
-
borderWidth =
|
|
16361
|
-
|
|
16362
|
-
borderRadius =
|
|
16363
|
-
|
|
16364
|
-
borderColor =
|
|
16377
|
+
_p = _a.status,
|
|
16378
|
+
status = _p === void 0 ? 'ready' : _p,
|
|
16379
|
+
_q = _a.borderWidth,
|
|
16380
|
+
borderWidth = _q === void 0 ? 20 : _q,
|
|
16381
|
+
_r = _a.borderRadius,
|
|
16382
|
+
borderRadius = _r === void 0 ? 25 : _r,
|
|
16383
|
+
_s = _a.borderColor,
|
|
16384
|
+
borderColor = _s === void 0 ? 'white' : _s,
|
|
16365
16385
|
aspectRatio = _a.aspectRatio,
|
|
16366
|
-
|
|
16367
|
-
progress =
|
|
16386
|
+
_t = _a.progress,
|
|
16387
|
+
progress = _t === void 0 ? 0 : _t,
|
|
16368
16388
|
props = __rest(_a, ["children", "status", "borderWidth", "borderRadius", "borderColor", "aspectRatio", "progress"]);
|
|
16369
|
-
var
|
|
16370
|
-
ref =
|
|
16371
|
-
|
|
16372
|
-
width =
|
|
16373
|
-
|
|
16374
|
-
height =
|
|
16375
|
-
var
|
|
16376
|
-
progressResets =
|
|
16377
|
-
setProgressResets =
|
|
16389
|
+
var _u = useResizeObserver(),
|
|
16390
|
+
ref = _u.ref,
|
|
16391
|
+
_v = _u.width,
|
|
16392
|
+
width = _v === void 0 ? 0 : _v,
|
|
16393
|
+
_w = _u.height,
|
|
16394
|
+
height = _w === void 0 ? 0 : _w;
|
|
16395
|
+
var _x = React.useState(0),
|
|
16396
|
+
progressResets = _x[0],
|
|
16397
|
+
setProgressResets = _x[1];
|
|
16378
16398
|
React.useEffect(function () {
|
|
16379
16399
|
if (progress === 0 && status === 'capturing') {
|
|
16380
16400
|
setProgressResets(function (n) {
|
|
@@ -16386,6 +16406,7 @@
|
|
|
16386
16406
|
var wavesDisabled = (_d = (_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.guideBox) === null || _c === void 0 ? void 0 : _c.wavesDisabled) !== null && _d !== void 0 ? _d : false;
|
|
16387
16407
|
var wavesColor = (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.guideBox) === null || _f === void 0 ? void 0 : _f.wavesColor) !== null && _g !== void 0 ? _g : '#287ec6';
|
|
16388
16408
|
var progressBarColor = (_k = (_j = (_h = theme.idCapture) === null || _h === void 0 ? void 0 : _h.guideBox) === null || _j === void 0 ? void 0 : _j.progressBarColor) !== null && _k !== void 0 ? _k : '#287ec6';
|
|
16409
|
+
var progressBarWidth = (_o = (_m = (_l = theme.idCapture) === null || _l === void 0 ? void 0 : _l.guideBox) === null || _m === void 0 ? void 0 : _m.progressBarWidth) !== null && _o !== void 0 ? _o : borderWidth;
|
|
16389
16410
|
return /*#__PURE__*/React.createElement(IdCardBorderContainer, _assign({}, props), /*#__PURE__*/React.createElement("div", {
|
|
16390
16411
|
ref: ref,
|
|
16391
16412
|
style: {
|
|
@@ -16420,7 +16441,7 @@
|
|
|
16420
16441
|
height: height,
|
|
16421
16442
|
borderRadius: borderRadius,
|
|
16422
16443
|
borderColor: borderColor,
|
|
16423
|
-
borderWidth:
|
|
16444
|
+
borderWidth: progressBarWidth,
|
|
16424
16445
|
className: "idmSdkWavesOrigin"
|
|
16425
16446
|
}), (status === 'capturing' || progress > 0) && ( /*#__PURE__*/React.createElement(IdCardBorderSvg, {
|
|
16426
16447
|
key: "progress".concat(progressResets),
|
|
@@ -16488,16 +16509,16 @@
|
|
|
16488
16509
|
className: isProgressBar ? "idmSdkProgressBorder ".concat(progressPaused ? 'idmSdkProgressPaused' : '') : ''
|
|
16489
16510
|
}));
|
|
16490
16511
|
}
|
|
16491
|
-
var IdCardBorderContainer = styled.div(templateObject_3$
|
|
16492
|
-
var SvgOverlay = styled.svg(templateObject_4$
|
|
16493
|
-
var IdCardBorderRect = styled.rect(templateObject_5$
|
|
16512
|
+
var IdCardBorderContainer = styled.div(templateObject_3$k || (templateObject_3$k = __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);
|
|
16513
|
+
var SvgOverlay = styled.svg(templateObject_4$e || (templateObject_4$e = __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"])));
|
|
16514
|
+
var IdCardBorderRect = styled.rect(templateObject_5$9 || (templateObject_5$9 = __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) {
|
|
16494
16515
|
var _a;
|
|
16495
16516
|
return (_a = props.$speed) !== null && _a !== void 0 ? _a : '3s';
|
|
16496
16517
|
}, function (props) {
|
|
16497
16518
|
var _a;
|
|
16498
16519
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
16499
16520
|
});
|
|
16500
|
-
var templateObject_1$
|
|
16521
|
+
var templateObject_1$v, templateObject_2$q, templateObject_3$k, templateObject_4$e, templateObject_5$9;
|
|
16501
16522
|
|
|
16502
16523
|
var defaultIdCaptureGuideImages = {
|
|
16503
16524
|
portrait: {
|
|
@@ -16673,12 +16694,12 @@
|
|
|
16673
16694
|
style: imageStyle
|
|
16674
16695
|
})));
|
|
16675
16696
|
};
|
|
16676
|
-
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$
|
|
16697
|
+
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$u || (templateObject_1$u = __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) {
|
|
16677
16698
|
return props.$transitionTime;
|
|
16678
16699
|
}, function (props) {
|
|
16679
16700
|
return props.$transforms;
|
|
16680
16701
|
});
|
|
16681
|
-
var templateObject_1$
|
|
16702
|
+
var templateObject_1$u;
|
|
16682
16703
|
|
|
16683
16704
|
var GuideOrientationContext = /*#__PURE__*/React.createContext({
|
|
16684
16705
|
orientation: 'landscape',
|
|
@@ -16967,10 +16988,10 @@
|
|
|
16967
16988
|
return v;
|
|
16968
16989
|
}).join(' ');
|
|
16969
16990
|
};
|
|
16970
|
-
var StyledPageContainer = styled(PageContainerDiv)(templateObject_1$
|
|
16971
|
-
var GuidesContainer = styled.div(templateObject_2$
|
|
16972
|
-
var GuideCenterRow = styled.div(templateObject_3$
|
|
16973
|
-
var GuideRegion = styled.div(templateObject_4$
|
|
16991
|
+
var StyledPageContainer = styled(PageContainerDiv)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n z-index: 1000;\n overflow-y: hidden;\n"], ["\n z-index: 1000;\n overflow-y: hidden;\n"])));
|
|
16992
|
+
var GuidesContainer = styled.div(templateObject_2$p || (templateObject_2$p = __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"])));
|
|
16993
|
+
var GuideCenterRow = styled.div(templateObject_3$j || (templateObject_3$j = __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"])));
|
|
16994
|
+
var GuideRegion = styled.div(templateObject_4$d || (templateObject_4$d = __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) {
|
|
16974
16995
|
var _a, _b, _c, _d, _e;
|
|
16975
16996
|
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)';
|
|
16976
16997
|
}, function (props) {
|
|
@@ -16981,21 +17002,21 @@
|
|
|
16981
17002
|
}, function (props) {
|
|
16982
17003
|
return props.$minHeight ? "min-height: ".concat(props.$minHeight, "px;") : "";
|
|
16983
17004
|
});
|
|
16984
|
-
var Spacer = styled(GuideRegion)(templateObject_5$
|
|
16985
|
-
var GuideCenterRegion = styled.div(templateObject_6$
|
|
17005
|
+
var Spacer = styled(GuideRegion)(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n display: block;\n width: auto;\n"], ["\n display: block;\n width: auto;\n"])));
|
|
17006
|
+
var GuideCenterRegion = styled.div(templateObject_6$7 || (templateObject_6$7 = __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) {
|
|
16986
17007
|
return props.$minWidth ? "min-width: ".concat(props.$minWidth, "px;") : "";
|
|
16987
17008
|
}, function (props) {
|
|
16988
17009
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
16989
17010
|
});
|
|
16990
|
-
var GuideCenterBorder = styled.div(templateObject_7$
|
|
17011
|
+
var GuideCenterBorder = styled.div(templateObject_7$5 || (templateObject_7$5 = __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) {
|
|
16991
17012
|
var _a, _b;
|
|
16992
17013
|
return "".concat((_a = props.$borderWidth) !== null && _a !== void 0 ? _a : 4, "px solid ").concat((_b = props.$borderColor) !== null && _b !== void 0 ? _b : 'white');
|
|
16993
17014
|
}, function (props) {
|
|
16994
17015
|
return props.$padding ? "padding: ".concat(props.$padding, "px;") : '';
|
|
16995
17016
|
});
|
|
16996
|
-
var GuideText = styled.span(templateObject_8$
|
|
16997
|
-
var GuideCenterInner = styled.div(templateObject_9$
|
|
16998
|
-
var templateObject_1$
|
|
17017
|
+
var GuideText = styled.span(templateObject_8$2 || (templateObject_8$2 = __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"])));
|
|
17018
|
+
var GuideCenterInner = styled.div(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n position: relative;\n margin: auto;\n"], ["\n position: relative;\n margin: auto;\n"])));
|
|
17019
|
+
var templateObject_1$t, templateObject_2$p, templateObject_3$j, templateObject_4$d, templateObject_5$8, templateObject_6$7, templateObject_7$5, templateObject_8$2, templateObject_9$2;
|
|
16999
17020
|
|
|
17000
17021
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
17001
17022
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -17138,11 +17159,11 @@
|
|
|
17138
17159
|
progress: progress
|
|
17139
17160
|
}));
|
|
17140
17161
|
};
|
|
17141
|
-
var CanvasWrapper$1 = styled.div(templateObject_1$
|
|
17162
|
+
var CanvasWrapper$1 = styled.div(templateObject_1$s || (templateObject_1$s = __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) {
|
|
17142
17163
|
return props.$maskColor;
|
|
17143
17164
|
});
|
|
17144
|
-
var Canvas$1 = styled.canvas(templateObject_2$
|
|
17145
|
-
var templateObject_1$
|
|
17165
|
+
var Canvas$1 = styled.canvas(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
17166
|
+
var templateObject_1$s, templateObject_2$o;
|
|
17146
17167
|
|
|
17147
17168
|
function IdCaptureGuides(_a) {
|
|
17148
17169
|
var _b = _a.guideType,
|
|
@@ -17283,11 +17304,11 @@
|
|
|
17283
17304
|
onError: onError
|
|
17284
17305
|
})));
|
|
17285
17306
|
};
|
|
17286
|
-
var StyledSpinner = styled(Spinner$1)(templateObject_1$
|
|
17287
|
-
var ImagePreviewWrapper = styled.div(templateObject_2$
|
|
17288
|
-
var ImagePreviewText = styled.div(templateObject_3$
|
|
17289
|
-
var ImagePreviewImageWrapper = styled.div(templateObject_4$
|
|
17290
|
-
var templateObject_1$
|
|
17307
|
+
var StyledSpinner = styled(Spinner$1)(templateObject_1$r || (templateObject_1$r = __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"])));
|
|
17308
|
+
var ImagePreviewWrapper = styled.div(templateObject_2$n || (templateObject_2$n = __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"])));
|
|
17309
|
+
var ImagePreviewText = styled.div(templateObject_3$i || (templateObject_3$i = __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"])));
|
|
17310
|
+
var ImagePreviewImageWrapper = styled.div(templateObject_4$c || (templateObject_4$c = __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"])));
|
|
17311
|
+
var templateObject_1$r, templateObject_2$n, templateObject_3$i, templateObject_4$c;
|
|
17291
17312
|
|
|
17292
17313
|
var documentCaptureInitialState = {
|
|
17293
17314
|
documents: [],
|
|
@@ -17643,16 +17664,16 @@
|
|
|
17643
17664
|
ref: canvasRef
|
|
17644
17665
|
}));
|
|
17645
17666
|
};
|
|
17646
|
-
var CanvasWrapper = styled.div(templateObject_1$
|
|
17667
|
+
var CanvasWrapper = styled.div(templateObject_1$q || (templateObject_1$q = __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) {
|
|
17647
17668
|
return props.$maskColor;
|
|
17648
17669
|
});
|
|
17649
|
-
var Canvas = styled.canvas(templateObject_2$
|
|
17650
|
-
var templateObject_1$
|
|
17670
|
+
var Canvas = styled.canvas(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
17671
|
+
var templateObject_1$q, templateObject_2$m;
|
|
17651
17672
|
|
|
17652
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
17673
|
+
var CameraFeedWrapper = styled.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
17653
17674
|
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;") : "";
|
|
17654
17675
|
});
|
|
17655
|
-
var templateObject_1$
|
|
17676
|
+
var templateObject_1$p;
|
|
17656
17677
|
|
|
17657
17678
|
var CameraVideoTag = function CameraVideoTag(props) {
|
|
17658
17679
|
var _a = useCameraStore(useShallow(function (store) {
|
|
@@ -17683,10 +17704,10 @@
|
|
|
17683
17704
|
"$isRearFacing": isRearFacing
|
|
17684
17705
|
}, props));
|
|
17685
17706
|
};
|
|
17686
|
-
var FullscreenVideoTag = styled.video(templateObject_1$
|
|
17707
|
+
var FullscreenVideoTag = styled.video(templateObject_1$o || (templateObject_1$o = __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) {
|
|
17687
17708
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
17688
17709
|
});
|
|
17689
|
-
var templateObject_1$
|
|
17710
|
+
var templateObject_1$o;
|
|
17690
17711
|
|
|
17691
17712
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
17692
17713
|
var _b, _c, _d, _e, _f;
|
|
@@ -17836,21 +17857,21 @@
|
|
|
17836
17857
|
disabled: !cameraReady || capturing
|
|
17837
17858
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
17838
17859
|
};
|
|
17839
|
-
var CaptureContainer = styled.div(templateObject_1$
|
|
17840
|
-
var HeadingRow = styled.div(templateObject_2$
|
|
17860
|
+
var CaptureContainer = styled.div(templateObject_1$n || (templateObject_1$n = __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"])));
|
|
17861
|
+
var HeadingRow = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
|
|
17841
17862
|
return props.$maskColor;
|
|
17842
17863
|
});
|
|
17843
|
-
var Heading$9 = styled.h1(templateObject_3$
|
|
17844
|
-
var FooterRow = styled.div(templateObject_4$
|
|
17864
|
+
var Heading$9 = styled.h1(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
|
|
17865
|
+
var FooterRow = styled.div(templateObject_4$b || (templateObject_4$b = __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) {
|
|
17845
17866
|
return props.$maskColor;
|
|
17846
17867
|
});
|
|
17847
|
-
var Instructions = styled.div(templateObject_5$
|
|
17868
|
+
var Instructions = styled.div(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n max-height: ", ";\n overflow-y: auto;\n"], ["\n max-height: ", ";\n overflow-y: auto;\n"])), function (props) {
|
|
17848
17869
|
var _a, _b, _c;
|
|
17849
17870
|
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';
|
|
17850
17871
|
});
|
|
17851
|
-
var StyledButtonsRow$9 = styled(ButtonsRow)(templateObject_6$
|
|
17852
|
-
var PreviewImage = styled.img(templateObject_7$
|
|
17853
|
-
var templateObject_1$
|
|
17872
|
+
var StyledButtonsRow$9 = styled(ButtonsRow)(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
|
|
17873
|
+
var PreviewImage = styled.img(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n object-fit: cover;\n"], ["\n width: 100%;\n height: 100%;\n object-fit: cover;\n"])));
|
|
17874
|
+
var templateObject_1$n, templateObject_2$l, templateObject_3$h, templateObject_4$b, templateObject_5$7, templateObject_6$6, templateObject_7$4;
|
|
17854
17875
|
|
|
17855
17876
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
17856
17877
|
var onSuccess = _a.onSuccess,
|
|
@@ -18119,13 +18140,13 @@
|
|
|
18119
18140
|
}
|
|
18120
18141
|
}, verbiage.doneBtnText))))));
|
|
18121
18142
|
};
|
|
18122
|
-
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
18123
|
-
var Heading$8 = styled.h3(templateObject_2$
|
|
18124
|
-
var Description$3 = styled.p(templateObject_3$
|
|
18125
|
-
var Instruction = styled.p(templateObject_4$
|
|
18126
|
-
var ImageCol = styled.div(templateObject_5$
|
|
18127
|
-
var StyledButtonsRow$8 = styled(ButtonsRow)(templateObject_6$
|
|
18128
|
-
var templateObject_1$
|
|
18143
|
+
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
18144
|
+
var Heading$8 = styled.h3(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18145
|
+
var Description$3 = styled.p(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18146
|
+
var Instruction = styled.p(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
18147
|
+
var ImageCol = styled.div(templateObject_5$6 || (templateObject_5$6 = __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"])));
|
|
18148
|
+
var StyledButtonsRow$8 = styled(ButtonsRow)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
18149
|
+
var templateObject_1$m, templateObject_2$k, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5;
|
|
18129
18150
|
|
|
18130
18151
|
function ScalingCameraFeed() {
|
|
18131
18152
|
var _a = React.useContext(IdCaptureStateContext),
|
|
@@ -18144,6 +18165,579 @@
|
|
|
18144
18165
|
}, /*#__PURE__*/React.createElement(CameraVideoTag, null));
|
|
18145
18166
|
}
|
|
18146
18167
|
|
|
18168
|
+
var buttonColors = {
|
|
18169
|
+
backgroundColor: 'white',
|
|
18170
|
+
borderColor: '#dbdbdb',
|
|
18171
|
+
textColor: '#323232'
|
|
18172
|
+
};
|
|
18173
|
+
function IdCaptureOrUploadScreen(_a) {
|
|
18174
|
+
var _b = _a.classNames,
|
|
18175
|
+
classNames = _b === void 0 ? {} : _b,
|
|
18176
|
+
_c = _a.verbiage,
|
|
18177
|
+
rawVerbiage = _c === void 0 ? {} : _c;
|
|
18178
|
+
var _d = useIdCaptureState(),
|
|
18179
|
+
state = _d[0],
|
|
18180
|
+
dispatch = _d[1];
|
|
18181
|
+
var requestCameraAccess = useCameraStore().requestCameraAccess;
|
|
18182
|
+
var _e = React.useState(false),
|
|
18183
|
+
selectIdTypeModalOpen = _e[0],
|
|
18184
|
+
setSelectIdTypeModalOpen = _e[1];
|
|
18185
|
+
var verbiage = useTranslations(rawVerbiage, {
|
|
18186
|
+
captureWithCameraText: 'Capture with Camera',
|
|
18187
|
+
orText: 'OR',
|
|
18188
|
+
uploadFromStorageText: 'Upload from Storage',
|
|
18189
|
+
selectIdTypeText: 'Select ID Type',
|
|
18190
|
+
passportText: 'Passport',
|
|
18191
|
+
idCardText: 'ID Card'
|
|
18192
|
+
});
|
|
18193
|
+
if (state.captureState === 'uploading') {
|
|
18194
|
+
if (state.uploadingDocumentsType === 'passport') {
|
|
18195
|
+
return /*#__PURE__*/React.createElement(PassportUploadScreen, {
|
|
18196
|
+
classNames: classNames.passportUploadScreen
|
|
18197
|
+
});
|
|
18198
|
+
} else if (state.uploadingDocumentsType === 'idCard') {
|
|
18199
|
+
return /*#__PURE__*/React.createElement(IdDocumentUploadScreen, {
|
|
18200
|
+
classNames: classNames.idDocumentUploadScreen
|
|
18201
|
+
});
|
|
18202
|
+
}
|
|
18203
|
+
}
|
|
18204
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScreenContainer, {
|
|
18205
|
+
className: classNames.container
|
|
18206
|
+
}, /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18207
|
+
className: classNames.captureWithCameraPanel
|
|
18208
|
+
}, /*#__PURE__*/React.createElement(CameraIcon, {
|
|
18209
|
+
className: classNames.captureWithCameraIcon
|
|
18210
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
18211
|
+
className: classNames.captureWithCameraButton,
|
|
18212
|
+
colors: buttonColors,
|
|
18213
|
+
onClick: function onClick() {
|
|
18214
|
+
void requestCameraAccess();
|
|
18215
|
+
dispatch({
|
|
18216
|
+
type: 'setUploadingDocumentsFromStorage',
|
|
18217
|
+
payload: false
|
|
18218
|
+
});
|
|
18219
|
+
}
|
|
18220
|
+
}, verbiage.captureWithCameraText, /*#__PURE__*/React.createElement(ArrowIcon, null))), /*#__PURE__*/React.createElement(DashedSeparator, {
|
|
18221
|
+
className: classNames.separator
|
|
18222
|
+
}, /*#__PURE__*/React.createElement(OrWrapper, {
|
|
18223
|
+
className: classNames.orText
|
|
18224
|
+
}, verbiage.orText)), /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18225
|
+
className: classNames.uploadFromStoragePanel
|
|
18226
|
+
}, /*#__PURE__*/React.createElement(UploadIcon, {
|
|
18227
|
+
className: classNames.uploadFromStorageIcon
|
|
18228
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
18229
|
+
className: classNames.uploadFromStorageButton,
|
|
18230
|
+
colors: buttonColors,
|
|
18231
|
+
onClick: function onClick() {
|
|
18232
|
+
dispatch({
|
|
18233
|
+
type: 'setUploadingDocumentsFromStorage',
|
|
18234
|
+
payload: true
|
|
18235
|
+
});
|
|
18236
|
+
setSelectIdTypeModalOpen(state.captureRequirement === 'idCardOrPassport');
|
|
18237
|
+
if (state.captureRequirement === 'passport') {
|
|
18238
|
+
dispatch({
|
|
18239
|
+
type: 'setUploadingDocumentsType',
|
|
18240
|
+
payload: 'passport'
|
|
18241
|
+
});
|
|
18242
|
+
} else {
|
|
18243
|
+
dispatch({
|
|
18244
|
+
type: 'setUploadingDocumentsType',
|
|
18245
|
+
payload: 'idCard'
|
|
18246
|
+
});
|
|
18247
|
+
}
|
|
18248
|
+
}
|
|
18249
|
+
}, verbiage.uploadFromStorageText, /*#__PURE__*/React.createElement(ArrowIcon, null)))), selectIdTypeModalOpen && ( /*#__PURE__*/React.createElement(Modal, {
|
|
18250
|
+
className: classNames.selectIdTypeModal
|
|
18251
|
+
}, /*#__PURE__*/React.createElement(Dialog, {
|
|
18252
|
+
className: classNames.selectIdTypeDialog
|
|
18253
|
+
}, /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18254
|
+
className: classNames.selectPassportTypePanel
|
|
18255
|
+
}, /*#__PURE__*/React.createElement(ScreenPanelHeading, {
|
|
18256
|
+
className: classNames.selectIdTypeHeading
|
|
18257
|
+
}, verbiage.selectIdTypeText), /*#__PURE__*/React.createElement(PassportIcon, {
|
|
18258
|
+
className: classNames.selectPassportTypeIcon
|
|
18259
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
18260
|
+
className: classNames.selectPassportTypeButton,
|
|
18261
|
+
colors: buttonColors,
|
|
18262
|
+
onClick: function onClick() {
|
|
18263
|
+
return dispatch({
|
|
18264
|
+
type: 'setUploadingDocumentsType',
|
|
18265
|
+
payload: 'passport'
|
|
18266
|
+
});
|
|
18267
|
+
}
|
|
18268
|
+
}, verbiage.passportText, /*#__PURE__*/React.createElement(ArrowIcon, null))), /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18269
|
+
className: classNames.selectIdCardTypePanel,
|
|
18270
|
+
style: {
|
|
18271
|
+
background: 'white',
|
|
18272
|
+
padding: '80px 0'
|
|
18273
|
+
}
|
|
18274
|
+
}, /*#__PURE__*/React.createElement(IdDocumentIcon, {
|
|
18275
|
+
className: classNames.selectIdCardTypeIcon
|
|
18276
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
18277
|
+
className: classNames.selectIdCardTypeButton,
|
|
18278
|
+
colors: buttonColors,
|
|
18279
|
+
onClick: function onClick() {
|
|
18280
|
+
return dispatch({
|
|
18281
|
+
type: 'setUploadingDocumentsType',
|
|
18282
|
+
payload: 'idCard'
|
|
18283
|
+
});
|
|
18284
|
+
}
|
|
18285
|
+
}, verbiage.idCardText, /*#__PURE__*/React.createElement(ArrowIcon, null)))), /*#__PURE__*/React.createElement(ModalCloseButton, {
|
|
18286
|
+
className: classNames.selectIdTypeModalCloseButton,
|
|
18287
|
+
onClick: function onClick() {
|
|
18288
|
+
return setSelectIdTypeModalOpen(false);
|
|
18289
|
+
}
|
|
18290
|
+
}, "\xD7"))));
|
|
18291
|
+
}
|
|
18292
|
+
function PassportUploadScreen(_a) {
|
|
18293
|
+
var _b = _a.classNames,
|
|
18294
|
+
classNames = _b === void 0 ? {} : _b,
|
|
18295
|
+
_c = _a.verbiage,
|
|
18296
|
+
rawVerbiage = _c === void 0 ? {} : _c;
|
|
18297
|
+
var _d = React.useState(null),
|
|
18298
|
+
file = _d[0],
|
|
18299
|
+
setFile = _d[1];
|
|
18300
|
+
var onCapturedManually = useOnCapturedManually();
|
|
18301
|
+
var verbiage = useTranslations(rawVerbiage, {
|
|
18302
|
+
uploadPassportText: 'Upload Passport',
|
|
18303
|
+
loadingText: 'Loading...',
|
|
18304
|
+
continueText: 'Continue',
|
|
18305
|
+
cancelText: 'Cancel'
|
|
18306
|
+
});
|
|
18307
|
+
return /*#__PURE__*/React.createElement(ScreenContainer, {
|
|
18308
|
+
className: classNames.container
|
|
18309
|
+
}, /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18310
|
+
className: classNames.uploadPassportPanel
|
|
18311
|
+
}, /*#__PURE__*/React.createElement(UploadIcon, {
|
|
18312
|
+
className: classNames.uploadPassportIcon
|
|
18313
|
+
}), /*#__PURE__*/React.createElement(FilePickerButton, {
|
|
18314
|
+
className: classNames.uploadPassportButton,
|
|
18315
|
+
onFileSelected: setFile,
|
|
18316
|
+
loadingText: verbiage.loadingText
|
|
18317
|
+
}, verbiage.uploadPassportText)), /*#__PURE__*/React.createElement(ScreenActionsBar, {
|
|
18318
|
+
className: classNames.actionsBar
|
|
18319
|
+
}, /*#__PURE__*/React.createElement(CancelUploadTypeButton, {
|
|
18320
|
+
className: classNames.cancelButton
|
|
18321
|
+
}, verbiage.cancelText), /*#__PURE__*/React.createElement(Button, {
|
|
18322
|
+
className: classNames.continueButton,
|
|
18323
|
+
disabled: !file,
|
|
18324
|
+
colors: buttonColors,
|
|
18325
|
+
onClick: function onClick() {
|
|
18326
|
+
return onCapturedManually(file);
|
|
18327
|
+
}
|
|
18328
|
+
}, verbiage.continueText)));
|
|
18329
|
+
}
|
|
18330
|
+
function IdDocumentUploadScreen(_a) {
|
|
18331
|
+
var _b = _a.classNames,
|
|
18332
|
+
classNames = _b === void 0 ? {} : _b,
|
|
18333
|
+
_c = _a.verbiage,
|
|
18334
|
+
rawVerbiage = _c === void 0 ? {} : _c;
|
|
18335
|
+
var _d = React.useState(null),
|
|
18336
|
+
idFrontFile = _d[0],
|
|
18337
|
+
setIdFrontFile = _d[1];
|
|
18338
|
+
var _e = React.useState(null),
|
|
18339
|
+
idBackFile = _e[0],
|
|
18340
|
+
setIdBackFile = _e[1];
|
|
18341
|
+
var onCapturedManually = useOnCapturedManually();
|
|
18342
|
+
var verbiage = useTranslations(rawVerbiage, {
|
|
18343
|
+
uploadIdFrontText: 'Upload ID Front',
|
|
18344
|
+
uploadIdBackText: 'Upload ID Back',
|
|
18345
|
+
loadingText: 'Loading...',
|
|
18346
|
+
continueText: 'Continue',
|
|
18347
|
+
cancelText: 'Cancel'
|
|
18348
|
+
});
|
|
18349
|
+
return /*#__PURE__*/React.createElement(ScreenContainer, {
|
|
18350
|
+
className: classNames.container
|
|
18351
|
+
}, /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18352
|
+
className: classNames.uploadIdFrontPanel
|
|
18353
|
+
}, /*#__PURE__*/React.createElement(UploadIcon, {
|
|
18354
|
+
className: classNames.uploadIdFrontIcon
|
|
18355
|
+
}), /*#__PURE__*/React.createElement(FilePickerButton, {
|
|
18356
|
+
className: classNames.uploadIdFrontButton,
|
|
18357
|
+
onFileSelected: setIdFrontFile,
|
|
18358
|
+
loadingText: verbiage.loadingText
|
|
18359
|
+
}, verbiage.uploadIdFrontText)), /*#__PURE__*/React.createElement(DashedSeparator, {
|
|
18360
|
+
className: classNames.separator
|
|
18361
|
+
}), /*#__PURE__*/React.createElement(ScreenPanel, {
|
|
18362
|
+
className: classNames.uploadIdBackPanel
|
|
18363
|
+
}, /*#__PURE__*/React.createElement(UploadIcon, {
|
|
18364
|
+
className: classNames.uploadIdBackIcon
|
|
18365
|
+
}), /*#__PURE__*/React.createElement(FilePickerButton, {
|
|
18366
|
+
className: classNames.uploadIdBackButton,
|
|
18367
|
+
onFileSelected: setIdBackFile,
|
|
18368
|
+
loadingText: verbiage.loadingText
|
|
18369
|
+
}, verbiage.uploadIdBackText)), /*#__PURE__*/React.createElement(ScreenActionsBar, {
|
|
18370
|
+
className: classNames.actionsBar
|
|
18371
|
+
}, /*#__PURE__*/React.createElement(CancelUploadTypeButton, {
|
|
18372
|
+
className: classNames.cancelButton
|
|
18373
|
+
}, verbiage.cancelText), /*#__PURE__*/React.createElement(Button, {
|
|
18374
|
+
className: classNames.continueButton,
|
|
18375
|
+
disabled: !idFrontFile || !idBackFile,
|
|
18376
|
+
colors: buttonColors,
|
|
18377
|
+
onClick: function onClick() {
|
|
18378
|
+
return onCapturedManually(idFrontFile, idBackFile);
|
|
18379
|
+
}
|
|
18380
|
+
}, verbiage.continueText)));
|
|
18381
|
+
}
|
|
18382
|
+
function CancelUploadTypeButton(_a) {
|
|
18383
|
+
var children = _a.children,
|
|
18384
|
+
className = _a.className;
|
|
18385
|
+
var dispatch = useIdCaptureState()[1];
|
|
18386
|
+
return /*#__PURE__*/React.createElement(Button, {
|
|
18387
|
+
className: className,
|
|
18388
|
+
colors: buttonColors,
|
|
18389
|
+
onClick: function onClick() {
|
|
18390
|
+
return dispatch({
|
|
18391
|
+
type: 'setUploadingDocumentsType',
|
|
18392
|
+
payload: null
|
|
18393
|
+
});
|
|
18394
|
+
}
|
|
18395
|
+
}, children);
|
|
18396
|
+
}
|
|
18397
|
+
function useOnCapturedManually() {
|
|
18398
|
+
var dispatch = useIdCaptureState()[1];
|
|
18399
|
+
return React.useCallback(function () {
|
|
18400
|
+
var files = [];
|
|
18401
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
18402
|
+
files[_i] = arguments[_i];
|
|
18403
|
+
}
|
|
18404
|
+
return Promise.all(files.map(readFile)).then(function (f) {
|
|
18405
|
+
for (var _i = 0, f_1 = f; _i < f_1.length; _i++) {
|
|
18406
|
+
var imageData = f_1[_i];
|
|
18407
|
+
dispatch({
|
|
18408
|
+
type: 'documentCapturedManually',
|
|
18409
|
+
payload: {
|
|
18410
|
+
imageData: imageData
|
|
18411
|
+
}
|
|
18412
|
+
});
|
|
18413
|
+
}
|
|
18414
|
+
});
|
|
18415
|
+
}, [dispatch]);
|
|
18416
|
+
}
|
|
18417
|
+
function readFile(file) {
|
|
18418
|
+
return new Promise(function (resolve, reject) {
|
|
18419
|
+
var reader = new FileReader();
|
|
18420
|
+
reader.onload = function () {
|
|
18421
|
+
return resolve(reader.result);
|
|
18422
|
+
};
|
|
18423
|
+
reader.onerror = function (e) {
|
|
18424
|
+
return reject(e);
|
|
18425
|
+
};
|
|
18426
|
+
reader.readAsDataURL(file);
|
|
18427
|
+
});
|
|
18428
|
+
}
|
|
18429
|
+
function FilePickerButton(_a) {
|
|
18430
|
+
var className = _a.className,
|
|
18431
|
+
children = _a.children,
|
|
18432
|
+
_b = _a.loadingText,
|
|
18433
|
+
loadingText = _b === void 0 ? 'Loading...' : _b,
|
|
18434
|
+
onFileSelected = _a.onFileSelected;
|
|
18435
|
+
var fileInput = React.useRef(null);
|
|
18436
|
+
var _c = React.useState(false),
|
|
18437
|
+
filePickerLoading = _c[0],
|
|
18438
|
+
setFilePickerLoading = _c[1];
|
|
18439
|
+
var _d = React.useState(null),
|
|
18440
|
+
file = _d[0],
|
|
18441
|
+
setFile = _d[1];
|
|
18442
|
+
React.useEffect(function () {
|
|
18443
|
+
if (!fileInput.current) return;
|
|
18444
|
+
fileInput.current.oncancel = function () {
|
|
18445
|
+
setFile(null);
|
|
18446
|
+
setFilePickerLoading(false);
|
|
18447
|
+
};
|
|
18448
|
+
}, [fileInput, file]);
|
|
18449
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("input", {
|
|
18450
|
+
ref: fileInput,
|
|
18451
|
+
type: "file",
|
|
18452
|
+
accept: "image/*",
|
|
18453
|
+
style: {
|
|
18454
|
+
display: 'none'
|
|
18455
|
+
},
|
|
18456
|
+
onChange: function onChange(e) {
|
|
18457
|
+
var _a;
|
|
18458
|
+
setFilePickerLoading(false);
|
|
18459
|
+
var file = (_a = e.currentTarget.files) === null || _a === void 0 ? void 0 : _a[0];
|
|
18460
|
+
if (!file) return;
|
|
18461
|
+
setFile(file);
|
|
18462
|
+
onFileSelected === null || onFileSelected === void 0 ? void 0 : onFileSelected(file);
|
|
18463
|
+
}
|
|
18464
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
18465
|
+
className: className,
|
|
18466
|
+
colors: buttonColors,
|
|
18467
|
+
onClick: function onClick() {
|
|
18468
|
+
var _a;
|
|
18469
|
+
setFilePickerLoading(true);
|
|
18470
|
+
(_a = fileInput.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
18471
|
+
}
|
|
18472
|
+
}, file ? "".concat(file.name, " (").concat(humanFileSize(file.size), ")") : filePickerLoading ? loadingText : children));
|
|
18473
|
+
}
|
|
18474
|
+
var ScreenContainer = styled.div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100dvh;\n width: 100dvw;\n position: relative;\n font-family: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100dvh;\n width: 100dvw;\n position: relative;\n font-family: ", ";\n"])), function (props) {
|
|
18475
|
+
var _a;
|
|
18476
|
+
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
18477
|
+
});
|
|
18478
|
+
var ScreenPanel = styled.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n flex-grow: 1;\n background: #f7f6fb;\n box-sizing: border-box;\n padding: 40px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n flex-grow: 1;\n background: #f7f6fb;\n box-sizing: border-box;\n padding: 40px;\n"])));
|
|
18479
|
+
var ScreenPanelHeading = styled.h3(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n margin: 0 0 30px;\n"], ["\n margin: 0 0 30px;\n"])));
|
|
18480
|
+
var ScreenActionsBar = styled.div(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n border-top: 1px solid #ccc;\n"], ["\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n border-top: 1px solid #ccc;\n"])));
|
|
18481
|
+
var DashedSeparator = styled.div(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n width: 100%;\n height: 0;\n border-top: 2px solid #606060;\n border-top-style: dashed;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n width: 100%;\n height: 0;\n border-top: 2px solid #606060;\n border-top-style: dashed;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
18482
|
+
var OrWrapper = styled.div(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n color: #323232;\n font-weight: bold;\n background: white;\n border-radius: 50%;\n top: -2px;\n position: relative;\n width: 60px;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n color: #323232;\n font-weight: bold;\n background: white;\n border-radius: 50%;\n top: -2px;\n position: relative;\n width: 60px;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
18483
|
+
var Button = styled(WideBorderButton)(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n width: auto;\n font-weight: 500;\n padding-left: 40px;\n padding-right: 40px;\n transition: background-color 0.3s ease;\n background-color: #ffffff;\n\n &:disabled,\n &.disabled {\n background-color: #f1f1f1 !important;\n border-color: #dbdbdb !important;\n color: #323232 !important;\n }\n\n &:hover {\n filter: none;\n background-color: #fafafa !important;\n }\n"], ["\n width: auto;\n font-weight: 500;\n padding-left: 40px;\n padding-right: 40px;\n transition: background-color 0.3s ease;\n background-color: #ffffff;\n\n &:disabled,\n &.disabled {\n background-color: #f1f1f1 !important;\n border-color: #dbdbdb !important;\n color: #323232 !important;\n }\n\n &:hover {\n filter: none;\n background-color: #fafafa !important;\n }\n"])));
|
|
18484
|
+
var Modal = styled.div(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10000;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10000;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])));
|
|
18485
|
+
var Dialog = styled.div(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n width: 100%;\n max-width: 500px;\n height: 100%;\n max-height: 600px;\n background: white;\n border-radius: 25px;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n font-family: ", ";\n"], ["\n width: 100%;\n max-width: 500px;\n height: 100%;\n max-height: 600px;\n background: white;\n border-radius: 25px;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n font-family: ", ";\n"])), function (props) {
|
|
18486
|
+
var _a;
|
|
18487
|
+
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
18488
|
+
});
|
|
18489
|
+
var ModalCloseButton = styled.button(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n width: 50px;\n height: 50px;\n background: black;\n color: whitesmoke;\n border-radius: 50%;\n font-size: 30px;\n border: none;\n cursor: pointer;\n margin-top: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n transition: background 0.3s ease;\n\n &:hover {\n background: #222;\n color: white;\n }\n"], ["\n width: 50px;\n height: 50px;\n background: black;\n color: whitesmoke;\n border-radius: 50%;\n font-size: 30px;\n border: none;\n cursor: pointer;\n margin-top: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n transition: background 0.3s ease;\n\n &:hover {\n background: #222;\n color: white;\n }\n"])));
|
|
18490
|
+
function CameraIcon(props) {
|
|
18491
|
+
return /*#__PURE__*/React.createElement("svg", _assign({
|
|
18492
|
+
width: "91",
|
|
18493
|
+
height: "75",
|
|
18494
|
+
viewBox: "0 0 91 75",
|
|
18495
|
+
fill: "none",
|
|
18496
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18497
|
+
style: {
|
|
18498
|
+
marginBottom: 30
|
|
18499
|
+
}
|
|
18500
|
+
}, props), /*#__PURE__*/React.createElement("path", {
|
|
18501
|
+
d: "M22 2H2V22",
|
|
18502
|
+
stroke: "black",
|
|
18503
|
+
strokeWidth: "3",
|
|
18504
|
+
strokeLinecap: "round",
|
|
18505
|
+
strokeLinejoin: "round"
|
|
18506
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18507
|
+
d: "M69 2H89V22",
|
|
18508
|
+
stroke: "black",
|
|
18509
|
+
strokeWidth: "3",
|
|
18510
|
+
strokeLinecap: "round",
|
|
18511
|
+
strokeLinejoin: "round"
|
|
18512
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18513
|
+
d: "M22 73H2V53",
|
|
18514
|
+
stroke: "black",
|
|
18515
|
+
strokeWidth: "3",
|
|
18516
|
+
strokeLinecap: "round",
|
|
18517
|
+
strokeLinejoin: "round"
|
|
18518
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18519
|
+
d: "M69 73H89V53",
|
|
18520
|
+
stroke: "black",
|
|
18521
|
+
strokeWidth: "3",
|
|
18522
|
+
strokeLinecap: "round",
|
|
18523
|
+
strokeLinejoin: "round"
|
|
18524
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18525
|
+
d: "M21 27.5C21 25.8431 22.3431 24.5 24 24.5H31.833C32.5836 24.5 33.3069 24.2186 33.8602 23.7115L38.1398 19.7885C38.6931 19.2814 39.4164 19 40.167 19H45H50.6729C51.5181 19 52.3241 19.3566 52.8927 19.982L56.1073 23.518C56.6759 24.1434 57.4819 24.5 58.3271 24.5H66C67.6569 24.5 69 25.8431 69 27.5V53.5C69 55.1569 67.6569 56.5 66 56.5H24C22.3431 56.5 21 55.1569 21 53.5V27.5Z",
|
|
18526
|
+
stroke: "black",
|
|
18527
|
+
strokeWidth: "3"
|
|
18528
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
18529
|
+
cx: "45",
|
|
18530
|
+
cy: "40",
|
|
18531
|
+
r: "10",
|
|
18532
|
+
stroke: "black",
|
|
18533
|
+
strokeWidth: "3"
|
|
18534
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
18535
|
+
cx: "62",
|
|
18536
|
+
cy: "31",
|
|
18537
|
+
r: "2",
|
|
18538
|
+
fill: "#221D27"
|
|
18539
|
+
}));
|
|
18540
|
+
}
|
|
18541
|
+
function UploadIcon(props) {
|
|
18542
|
+
return /*#__PURE__*/React.createElement("svg", _assign({
|
|
18543
|
+
width: "61",
|
|
18544
|
+
height: "85",
|
|
18545
|
+
viewBox: "0 0 61 85",
|
|
18546
|
+
fill: "none",
|
|
18547
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18548
|
+
style: {
|
|
18549
|
+
marginBottom: 30
|
|
18550
|
+
}
|
|
18551
|
+
}, props), /*#__PURE__*/React.createElement("path", {
|
|
18552
|
+
d: "M39.5 2C29.3961 2 18.6185 2 7.99995 2C4.68624 2 2 4.68629 2 8V77C2 80.3137 4.68629 83 8 83H53C56.3137 83 59 80.3143 59 77.0006C59 56.9469 59 33.8443 59 18.5M39.5 2L59 18.5M39.5 2V12.5C39.5 15.8137 42.1863 18.5 45.5 18.5H59",
|
|
18553
|
+
stroke: "black",
|
|
18554
|
+
strokeWidth: "3"
|
|
18555
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18556
|
+
d: "M19.4142 44.5H24.5C25.0523 44.5 25.5 44.9477 25.5 45.5V55.5C25.5 56.0523 25.9477 56.5 26.5 56.5H37C37.5523 56.5 38 56.0523 38 55.5V45.5C38 44.9477 38.4477 44.5 39 44.5H42.5858C43.4767 44.5 43.9229 43.4229 43.2929 42.7929L31.7071 31.2071C31.3166 30.8166 30.6834 30.8166 30.2929 31.2071L18.7071 42.7929C18.0771 43.4229 18.5233 44.5 19.4142 44.5Z",
|
|
18557
|
+
stroke: "black",
|
|
18558
|
+
strokeWidth: "3",
|
|
18559
|
+
strokeLinecap: "round",
|
|
18560
|
+
strokeLinejoin: "round"
|
|
18561
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18562
|
+
d: "M17 56.5V62C17 63.1046 17.8954 64 19 64H43C44.1046 64 45 63.1046 45 62V56.5",
|
|
18563
|
+
stroke: "black",
|
|
18564
|
+
strokeWidth: "3",
|
|
18565
|
+
strokeLinecap: "round",
|
|
18566
|
+
strokeLinejoin: "round"
|
|
18567
|
+
}));
|
|
18568
|
+
}
|
|
18569
|
+
function ArrowIcon(props) {
|
|
18570
|
+
return /*#__PURE__*/React.createElement("svg", _assign({
|
|
18571
|
+
width: "18",
|
|
18572
|
+
height: "12",
|
|
18573
|
+
viewBox: "0 0 18 12",
|
|
18574
|
+
fill: "none",
|
|
18575
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18576
|
+
style: {
|
|
18577
|
+
marginLeft: 12
|
|
18578
|
+
}
|
|
18579
|
+
}, props), /*#__PURE__*/React.createElement("path", {
|
|
18580
|
+
d: "M1 6H17M17 6L12.2281 1M17 6L12.2281 11",
|
|
18581
|
+
stroke: "#323232",
|
|
18582
|
+
strokeWidth: "2",
|
|
18583
|
+
strokeLinecap: "round",
|
|
18584
|
+
strokeLinejoin: "round"
|
|
18585
|
+
}));
|
|
18586
|
+
}
|
|
18587
|
+
function PassportIcon(props) {
|
|
18588
|
+
return /*#__PURE__*/React.createElement("svg", _assign({
|
|
18589
|
+
width: "61",
|
|
18590
|
+
height: "92",
|
|
18591
|
+
viewBox: "0 0 61 92",
|
|
18592
|
+
fill: "none",
|
|
18593
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18594
|
+
style: {
|
|
18595
|
+
marginBottom: 30
|
|
18596
|
+
}
|
|
18597
|
+
}, props), /*#__PURE__*/React.createElement("path", {
|
|
18598
|
+
d: "M2 14.6911C2 12.8037 3.31942 11.173 5.16535 10.7792L46.1654 2.03151C48.6545 1.50044 51 3.39834 51 5.94346V75.3089C51 77.1963 49.6806 78.827 47.8346 79.2208L6.83464 87.9685C4.34554 88.4996 2 86.6017 2 84.0565V14.6911Z",
|
|
18599
|
+
stroke: "black",
|
|
18600
|
+
strokeWidth: "3"
|
|
18601
|
+
}), /*#__PURE__*/React.createElement("rect", {
|
|
18602
|
+
x: "2",
|
|
18603
|
+
y: "12",
|
|
18604
|
+
width: "57",
|
|
18605
|
+
height: "78",
|
|
18606
|
+
rx: "4",
|
|
18607
|
+
fill: "#F3F3F3",
|
|
18608
|
+
stroke: "black",
|
|
18609
|
+
strokeWidth: "3"
|
|
18610
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
18611
|
+
cx: "30.5",
|
|
18612
|
+
cy: "44.5",
|
|
18613
|
+
r: "16.5",
|
|
18614
|
+
stroke: "black",
|
|
18615
|
+
strokeWidth: "3"
|
|
18616
|
+
}), /*#__PURE__*/React.createElement("ellipse", {
|
|
18617
|
+
cx: "31",
|
|
18618
|
+
cy: "44.5",
|
|
18619
|
+
rx: "8",
|
|
18620
|
+
ry: "16.5",
|
|
18621
|
+
stroke: "black",
|
|
18622
|
+
strokeWidth: "3"
|
|
18623
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18624
|
+
d: "M16 39H45",
|
|
18625
|
+
stroke: "black",
|
|
18626
|
+
strokeWidth: "3",
|
|
18627
|
+
strokeLinecap: "round",
|
|
18628
|
+
strokeLinejoin: "round"
|
|
18629
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18630
|
+
d: "M16 51H45",
|
|
18631
|
+
stroke: "black",
|
|
18632
|
+
strokeWidth: "3",
|
|
18633
|
+
strokeLinecap: "round",
|
|
18634
|
+
strokeLinejoin: "round"
|
|
18635
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18636
|
+
d: "M17 68H44",
|
|
18637
|
+
stroke: "black",
|
|
18638
|
+
strokeWidth: "3",
|
|
18639
|
+
strokeLinecap: "round",
|
|
18640
|
+
strokeLinejoin: "round"
|
|
18641
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18642
|
+
d: "M21 76H40",
|
|
18643
|
+
stroke: "black",
|
|
18644
|
+
strokeWidth: "3",
|
|
18645
|
+
strokeLinecap: "round",
|
|
18646
|
+
strokeLinejoin: "round"
|
|
18647
|
+
}));
|
|
18648
|
+
}
|
|
18649
|
+
function IdDocumentIcon(props) {
|
|
18650
|
+
return /*#__PURE__*/React.createElement("svg", _assign({
|
|
18651
|
+
width: "92",
|
|
18652
|
+
height: "62",
|
|
18653
|
+
viewBox: "0 0 92 62",
|
|
18654
|
+
fill: "none",
|
|
18655
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18656
|
+
style: {
|
|
18657
|
+
marginBottom: 30
|
|
18658
|
+
}
|
|
18659
|
+
}, props), /*#__PURE__*/React.createElement("path", {
|
|
18660
|
+
d: "M18 41C18 41 18.5 33 24.5 33C30.5 33 31 41 31 41",
|
|
18661
|
+
stroke: "black",
|
|
18662
|
+
strokeWidth: "3",
|
|
18663
|
+
strokeLinecap: "round",
|
|
18664
|
+
strokeLinejoin: "round"
|
|
18665
|
+
}), /*#__PURE__*/React.createElement("rect", {
|
|
18666
|
+
x: "2",
|
|
18667
|
+
y: "2",
|
|
18668
|
+
width: "88",
|
|
18669
|
+
height: "58",
|
|
18670
|
+
rx: "6",
|
|
18671
|
+
stroke: "black",
|
|
18672
|
+
strokeWidth: "3"
|
|
18673
|
+
}), /*#__PURE__*/React.createElement("rect", {
|
|
18674
|
+
x: "10",
|
|
18675
|
+
y: "15",
|
|
18676
|
+
width: "29",
|
|
18677
|
+
height: "30",
|
|
18678
|
+
rx: "3",
|
|
18679
|
+
stroke: "black",
|
|
18680
|
+
strokeWidth: "3"
|
|
18681
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18682
|
+
d: "M48 17H80",
|
|
18683
|
+
stroke: "black",
|
|
18684
|
+
strokeWidth: "3",
|
|
18685
|
+
strokeLinecap: "round",
|
|
18686
|
+
strokeLinejoin: "round"
|
|
18687
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18688
|
+
d: "M48 35H80",
|
|
18689
|
+
stroke: "black",
|
|
18690
|
+
strokeWidth: "3",
|
|
18691
|
+
strokeLinecap: "round",
|
|
18692
|
+
strokeLinejoin: "round"
|
|
18693
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18694
|
+
d: "M48 44H62",
|
|
18695
|
+
stroke: "black",
|
|
18696
|
+
strokeWidth: "3",
|
|
18697
|
+
strokeLinecap: "round",
|
|
18698
|
+
strokeLinejoin: "round"
|
|
18699
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18700
|
+
d: "M48 26H69",
|
|
18701
|
+
stroke: "black",
|
|
18702
|
+
strokeWidth: "3",
|
|
18703
|
+
strokeLinecap: "round",
|
|
18704
|
+
strokeLinejoin: "round"
|
|
18705
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
18706
|
+
d: "M74 26L80 26",
|
|
18707
|
+
stroke: "black",
|
|
18708
|
+
strokeWidth: "3",
|
|
18709
|
+
strokeLinecap: "round",
|
|
18710
|
+
strokeLinejoin: "round"
|
|
18711
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
18712
|
+
cx: "24.5",
|
|
18713
|
+
cy: "26.5",
|
|
18714
|
+
r: "6.5",
|
|
18715
|
+
stroke: "black",
|
|
18716
|
+
strokeWidth: "3"
|
|
18717
|
+
}));
|
|
18718
|
+
}
|
|
18719
|
+
function humanFileSize(bytes, si, dp) {
|
|
18720
|
+
if (si === void 0) {
|
|
18721
|
+
si = false;
|
|
18722
|
+
}
|
|
18723
|
+
if (dp === void 0) {
|
|
18724
|
+
dp = 1;
|
|
18725
|
+
}
|
|
18726
|
+
var thresh = si ? 1000 : 1024;
|
|
18727
|
+
if (Math.abs(bytes) < thresh) {
|
|
18728
|
+
return bytes + ' B';
|
|
18729
|
+
}
|
|
18730
|
+
var units = si ? ['kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'] : ['KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB'];
|
|
18731
|
+
var u = -1;
|
|
18732
|
+
var r = Math.pow(10, dp);
|
|
18733
|
+
do {
|
|
18734
|
+
bytes /= thresh;
|
|
18735
|
+
++u;
|
|
18736
|
+
} while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
|
|
18737
|
+
return bytes.toFixed(dp) + ' ' + units[u];
|
|
18738
|
+
}
|
|
18739
|
+
var templateObject_1$l, templateObject_2$j, templateObject_3$f, templateObject_4$9, templateObject_5$5, templateObject_6$4, templateObject_7$3, templateObject_8$1, templateObject_9$1, templateObject_10$1;
|
|
18740
|
+
|
|
18147
18741
|
var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
18148
18742
|
var _b, _c, _d, _e, _f, _g;
|
|
18149
18743
|
var onSuccess = _a.onSuccess,
|
|
@@ -18183,42 +18777,44 @@
|
|
|
18183
18777
|
enableOverrideWrongDocumentTypeDialog = _w === void 0 ? false : _w,
|
|
18184
18778
|
_x = _a.allowOverrideWrongDocumentTypeAfterMs,
|
|
18185
18779
|
allowOverrideWrongDocumentTypeAfterMs = _x === void 0 ? 8000 : _x,
|
|
18186
|
-
_y = _a.
|
|
18187
|
-
|
|
18188
|
-
_z = _a.
|
|
18189
|
-
|
|
18190
|
-
_0 = _a.
|
|
18191
|
-
|
|
18192
|
-
_1 = _a.
|
|
18193
|
-
|
|
18194
|
-
_2 = _a.
|
|
18195
|
-
|
|
18196
|
-
_3 = _a.
|
|
18197
|
-
|
|
18198
|
-
|
|
18199
|
-
|
|
18200
|
-
|
|
18201
|
-
|
|
18202
|
-
|
|
18203
|
-
|
|
18204
|
-
|
|
18205
|
-
|
|
18206
|
-
|
|
18207
|
-
|
|
18208
|
-
|
|
18209
|
-
|
|
18210
|
-
|
|
18211
|
-
|
|
18212
|
-
|
|
18213
|
-
|
|
18214
|
-
|
|
18215
|
-
|
|
18216
|
-
|
|
18217
|
-
|
|
18218
|
-
|
|
18219
|
-
|
|
18220
|
-
|
|
18221
|
-
|
|
18780
|
+
_y = _a.allowUploadingDocumentsFromStorage,
|
|
18781
|
+
allowUploadingDocumentsFromStorage = _y === void 0 ? false : _y,
|
|
18782
|
+
_z = _a.guideImages,
|
|
18783
|
+
guideImages = _z === void 0 ? defaultIdCaptureGuideImages : _z,
|
|
18784
|
+
_0 = _a.assets,
|
|
18785
|
+
assets = _0 === void 0 ? {} : _0,
|
|
18786
|
+
_1 = _a.classNames,
|
|
18787
|
+
classNames = _1 === void 0 ? {} : _1,
|
|
18788
|
+
_2 = _a.colors,
|
|
18789
|
+
colors = _2 === void 0 ? {} : _2,
|
|
18790
|
+
_3 = _a.verbiage,
|
|
18791
|
+
verbiage = _3 === void 0 ? {} : _3,
|
|
18792
|
+
_4 = _a.debugMode,
|
|
18793
|
+
debugMode = _4 === void 0 ? false : _4;
|
|
18794
|
+
var _5 = useIdCaptureState(),
|
|
18795
|
+
state = _5[0],
|
|
18796
|
+
dispatch = _5[1];
|
|
18797
|
+
var _6 = useCameraStore(),
|
|
18798
|
+
cameraAccessDenied = _6.cameraAccessDenied,
|
|
18799
|
+
requestCameraAccess = _6.requestCameraAccess,
|
|
18800
|
+
releaseCameraAccess = _6.releaseCameraAccess;
|
|
18801
|
+
var _7 = React.useState(false),
|
|
18802
|
+
overlayDismissed = _7[0],
|
|
18803
|
+
setOverlayDismissed = _7[1];
|
|
18804
|
+
var _8 = React.useContext(SubmissionContext),
|
|
18805
|
+
submissionStatus = _8.submissionStatus,
|
|
18806
|
+
setIdFrontImage = _8.setIdFrontImage,
|
|
18807
|
+
setIdBackImage = _8.setIdBackImage,
|
|
18808
|
+
setPassportImage = _8.setPassportImage,
|
|
18809
|
+
logIdFrontCaptureAttempt = _8.logIdFrontCaptureAttempt,
|
|
18810
|
+
logIdBackCaptureAttempt = _8.logIdBackCaptureAttempt;
|
|
18811
|
+
var _9 = React.useContext(IdCaptureModelsContext),
|
|
18812
|
+
start = _9.start,
|
|
18813
|
+
stop = _9.stop,
|
|
18814
|
+
onPredictionMade = _9.onPredictionMade,
|
|
18815
|
+
setRequiredDocumentType = _9.setRequiredDocumentType,
|
|
18816
|
+
modelError = _9.modelError,
|
|
18817
|
+
resetBestFrame = _9.resetBestFrame;
|
|
18222
18818
|
React.useEffect(function () {
|
|
18223
18819
|
dispatch({
|
|
18224
18820
|
type: 'configureWizard',
|
|
@@ -18228,10 +18824,11 @@
|
|
|
18228
18824
|
allowSinglePageIdCapture: allowSinglePageIdCapture,
|
|
18229
18825
|
allowIdCardBackToFrontCapture: allowIdCardBackToFrontCapture,
|
|
18230
18826
|
enableOverrideWrongDocumentTypeDialog: enableOverrideWrongDocumentTypeDialog,
|
|
18231
|
-
allowOverrideWrongDocumentTypeAfterMs: allowOverrideWrongDocumentTypeAfterMs
|
|
18827
|
+
allowOverrideWrongDocumentTypeAfterMs: allowOverrideWrongDocumentTypeAfterMs,
|
|
18828
|
+
allowUploadingDocumentsFromStorage: allowUploadingDocumentsFromStorage
|
|
18232
18829
|
}
|
|
18233
18830
|
});
|
|
18234
|
-
}, [allowIdCardBackToFrontCapture, allowOverrideWrongDocumentTypeAfterMs, allowSinglePageIdCapture, captureRequirement, dispatch, enableOverrideWrongDocumentTypeDialog, precapturedDocuments]);
|
|
18831
|
+
}, [allowIdCardBackToFrontCapture, allowOverrideWrongDocumentTypeAfterMs, allowSinglePageIdCapture, allowUploadingDocumentsFromStorage, captureRequirement, dispatch, enableOverrideWrongDocumentTypeDialog, precapturedDocuments]);
|
|
18235
18832
|
var documentCount = Object.keys(state.capturedDocuments).length;
|
|
18236
18833
|
React.useEffect(function () {
|
|
18237
18834
|
if (documentCount) resetBestFrame();
|
|
@@ -18318,9 +18915,9 @@
|
|
|
18318
18915
|
type: 'resetWizard'
|
|
18319
18916
|
});
|
|
18320
18917
|
}, [dispatch]);
|
|
18321
|
-
var
|
|
18322
|
-
attempt =
|
|
18323
|
-
setAttempt =
|
|
18918
|
+
var _10 = React.useState(0),
|
|
18919
|
+
attempt = _10[0],
|
|
18920
|
+
setAttempt = _10[1];
|
|
18324
18921
|
var onExit = React.useCallback(function () {
|
|
18325
18922
|
releaseCameraAccess();
|
|
18326
18923
|
setOverlayDismissed(false);
|
|
@@ -18411,9 +19008,9 @@
|
|
|
18411
19008
|
});
|
|
18412
19009
|
});
|
|
18413
19010
|
}, [dispatch]);
|
|
18414
|
-
var
|
|
18415
|
-
progressStarted =
|
|
18416
|
-
setProgressStarted =
|
|
19011
|
+
var _11 = React.useState(false),
|
|
19012
|
+
progressStarted = _11[0],
|
|
19013
|
+
setProgressStarted = _11[1];
|
|
18417
19014
|
React.useEffect(function () {
|
|
18418
19015
|
if (state.captureState === 'capturing') {
|
|
18419
19016
|
setProgressStarted(false);
|
|
@@ -18435,6 +19032,12 @@
|
|
|
18435
19032
|
silentFallback: silentFallback
|
|
18436
19033
|
});
|
|
18437
19034
|
}
|
|
19035
|
+
if (allowUploadingDocumentsFromStorage && ['initializing', 'uploading'].includes(state.captureState)) {
|
|
19036
|
+
return /*#__PURE__*/React.createElement(IdCaptureOrUploadScreen, {
|
|
19037
|
+
classNames: classNames.uploadOrCaptureScreen,
|
|
19038
|
+
verbiage: verbiage.uploadOrCaptureScreen
|
|
19039
|
+
});
|
|
19040
|
+
}
|
|
18438
19041
|
var requestedAction = state.captureState === 'requestingFlip' ? 'FLIP_ID' : state.requestedDocumentType === 'idCardBack' ? 'SHOW_ID_BACK' : state.requestedDocumentType === 'passport' ? 'SHOW_PASSPORT' : 'SHOW_ID_FRONT';
|
|
18439
19042
|
var guidesStatus = !overlayDismissed ? 'disabled' : state.isGoodFrame ? 'capturing' : 'ready';
|
|
18440
19043
|
return /*#__PURE__*/React.createElement(PageContainer, {
|
|
@@ -23721,7 +24324,7 @@
|
|
|
23721
24324
|
return /*#__PURE__*/React.createElement(CameraStoreProvider, {
|
|
23722
24325
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
23723
24326
|
onMicrophoneAccessDenied: onMicrophoneAccessDenied,
|
|
23724
|
-
requestAccessAutomatically: !(idCaptureProps === null || idCaptureProps === void 0 ? void 0 : idCaptureProps.forceFallbackMode)
|
|
24327
|
+
requestAccessAutomatically: !(idCaptureProps === null || idCaptureProps === void 0 ? void 0 : idCaptureProps.forceFallbackMode) && !(idCaptureProps === null || idCaptureProps === void 0 ? void 0 : idCaptureProps.allowUploadingDocumentsFromStorage)
|
|
23725
24328
|
}, /*#__PURE__*/React.createElement(IdCaptureModelsProvider, {
|
|
23726
24329
|
autoStart: false,
|
|
23727
24330
|
shouldLoadModels: !(idCaptureProps === null || idCaptureProps === void 0 ? void 0 : idCaptureProps.forceFallbackMode),
|
|
@@ -23929,7 +24532,8 @@
|
|
|
23929
24532
|
imagePadding: 50,
|
|
23930
24533
|
wavesDisabled: false,
|
|
23931
24534
|
wavesColor: '#287ec6',
|
|
23932
|
-
progressBarColor: '#287ec6'
|
|
24535
|
+
progressBarColor: '#287ec6',
|
|
24536
|
+
progressBarWidth: '2.5%'
|
|
23933
24537
|
}
|
|
23934
24538
|
},
|
|
23935
24539
|
selfieCapture: {
|
|
@@ -24080,6 +24684,8 @@
|
|
|
24080
24684
|
enableOverrideWrongDocumentTypeDialog = _r === void 0 ? false : _r,
|
|
24081
24685
|
_s = _a.allowOverrideWrongDocumentTypeAfterMs,
|
|
24082
24686
|
allowOverrideWrongDocumentTypeAfterMs = _s === void 0 ? 8000 : _s,
|
|
24687
|
+
_t = _a.allowUploadingDocumentsFromStorage,
|
|
24688
|
+
allowUploadingDocumentsFromStorage = _t === void 0 ? false : _t,
|
|
24083
24689
|
onBeforeSubmit = _a.onBeforeSubmit,
|
|
24084
24690
|
onBeforeDocumentUpload = _a.onBeforeDocumentUpload,
|
|
24085
24691
|
onDocumentUploadProgress = _a.onDocumentUploadProgress,
|
|
@@ -24093,28 +24699,28 @@
|
|
|
24093
24699
|
onUserCancel = _a.onUserCancel,
|
|
24094
24700
|
onModelError = _a.onModelError,
|
|
24095
24701
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
24096
|
-
|
|
24097
|
-
theme =
|
|
24098
|
-
|
|
24099
|
-
assets =
|
|
24100
|
-
|
|
24101
|
-
classNames =
|
|
24102
|
-
|
|
24103
|
-
colors =
|
|
24104
|
-
|
|
24105
|
-
verbiage =
|
|
24106
|
-
|
|
24107
|
-
captureSignature =
|
|
24108
|
-
|
|
24109
|
-
captureSignatureVideo =
|
|
24110
|
-
|
|
24111
|
-
captureAdditionalDocuments =
|
|
24112
|
-
|
|
24113
|
-
geolocationEnabled =
|
|
24114
|
-
|
|
24115
|
-
geolocationRequired =
|
|
24116
|
-
|
|
24117
|
-
debugMode =
|
|
24702
|
+
_u = _a.theme,
|
|
24703
|
+
theme = _u === void 0 ? 'default' : _u,
|
|
24704
|
+
_v = _a.assets,
|
|
24705
|
+
assets = _v === void 0 ? {} : _v,
|
|
24706
|
+
_w = _a.classNames,
|
|
24707
|
+
classNames = _w === void 0 ? {} : _w,
|
|
24708
|
+
_x = _a.colors,
|
|
24709
|
+
colors = _x === void 0 ? {} : _x,
|
|
24710
|
+
_y = _a.verbiage,
|
|
24711
|
+
verbiage = _y === void 0 ? {} : _y,
|
|
24712
|
+
_z = _a.captureSignature,
|
|
24713
|
+
captureSignature = _z === void 0 ? false : _z,
|
|
24714
|
+
_0 = _a.captureSignatureVideo,
|
|
24715
|
+
captureSignatureVideo = _0 === void 0 ? false : _0,
|
|
24716
|
+
_1 = _a.captureAdditionalDocuments,
|
|
24717
|
+
captureAdditionalDocuments = _1 === void 0 ? [] : _1,
|
|
24718
|
+
_2 = _a.geolocationEnabled,
|
|
24719
|
+
geolocationEnabled = _2 === void 0 ? true : _2,
|
|
24720
|
+
_3 = _a.geolocationRequired,
|
|
24721
|
+
geolocationRequired = _3 === void 0 ? false : _3,
|
|
24722
|
+
_4 = _a.debugMode,
|
|
24723
|
+
debugMode = _4 === void 0 ? false : _4;
|
|
24118
24724
|
useLanguage(lang);
|
|
24119
24725
|
useDebugLogging(debugMode);
|
|
24120
24726
|
var idCaptureProps = React.useMemo(function () {
|
|
@@ -24133,6 +24739,7 @@
|
|
|
24133
24739
|
onLoadingOverlayDismissed: onLoadingOverlayDismissed,
|
|
24134
24740
|
forceFallbackMode: forceFallbackMode,
|
|
24135
24741
|
allowIdCardBackToFrontCapture: allowIdCardBackToFrontCapture,
|
|
24742
|
+
allowUploadingDocumentsFromStorage: allowUploadingDocumentsFromStorage,
|
|
24136
24743
|
instructions: instructions,
|
|
24137
24744
|
guideType: guideType,
|
|
24138
24745
|
guideImages: guideImages,
|
|
@@ -24147,7 +24754,7 @@
|
|
|
24147
24754
|
verbiage: verbiage,
|
|
24148
24755
|
debugMode: debugMode
|
|
24149
24756
|
};
|
|
24150
|
-
}, [onExitCapture, onUserCancel, onModelError, precapturedDocuments, idCaptureRequirement, allowSinglePageIdCapture, separateIdCardCaptureSequence, idCaptureThresholds, skipSuccessScreen, loadingOverlayMode, customOverlayContent, onLoadingOverlayDismissed, forceFallbackMode, allowIdCardBackToFrontCapture, instructions, guideType, guideImages, portraitGuidesOnMobile, rotateLoadingOverlayImageWhenPortrait, modelLoadTimeoutMs, enableOverrideWrongDocumentTypeDialog, allowOverrideWrongDocumentTypeAfterMs, assets, classNames, colors, verbiage, debugMode]);
|
|
24757
|
+
}, [onExitCapture, onUserCancel, onModelError, precapturedDocuments, idCaptureRequirement, allowSinglePageIdCapture, separateIdCardCaptureSequence, idCaptureThresholds, skipSuccessScreen, loadingOverlayMode, customOverlayContent, onLoadingOverlayDismissed, forceFallbackMode, allowIdCardBackToFrontCapture, allowUploadingDocumentsFromStorage, instructions, guideType, guideImages, portraitGuidesOnMobile, rotateLoadingOverlayImageWhenPortrait, modelLoadTimeoutMs, enableOverrideWrongDocumentTypeDialog, allowOverrideWrongDocumentTypeAfterMs, assets, classNames, colors, verbiage, debugMode]);
|
|
24151
24758
|
var additionalDocumentCaptureProps = React.useMemo(function () {
|
|
24152
24759
|
return {
|
|
24153
24760
|
documents: captureAdditionalDocuments,
|
|
@@ -24409,14 +25016,16 @@
|
|
|
24409
25016
|
idCaptureModelLoadTimeoutMs = _p === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _p,
|
|
24410
25017
|
_q = _a.idCaptureForceFallbackMode,
|
|
24411
25018
|
idCaptureForceFallbackMode = _q === void 0 ? false : _q,
|
|
24412
|
-
_r = _a.
|
|
24413
|
-
|
|
24414
|
-
_s = _a.
|
|
24415
|
-
|
|
24416
|
-
_t = _a.
|
|
24417
|
-
|
|
24418
|
-
_u = _a.
|
|
24419
|
-
|
|
25019
|
+
_r = _a.idCaptureAllowUploadingDocumentsFromStorage,
|
|
25020
|
+
idCaptureAllowUploadingDocumentsFromStorage = _r === void 0 ? false : _r,
|
|
25021
|
+
_s = _a.selfieCaptureModelLoadTimeoutMs,
|
|
25022
|
+
selfieCaptureModelLoadTimeoutMs = _s === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _s,
|
|
25023
|
+
_t = _a.allowIdCardBackToFrontCapture,
|
|
25024
|
+
allowIdCardBackToFrontCapture = _t === void 0 ? false : _t,
|
|
25025
|
+
_u = _a.enableOverrideWrongDocumentTypeDialog,
|
|
25026
|
+
enableOverrideWrongDocumentTypeDialog = _u === void 0 ? false : _u,
|
|
25027
|
+
_v = _a.allowOverrideWrongDocumentTypeAfterMs,
|
|
25028
|
+
allowOverrideWrongDocumentTypeAfterMs = _v === void 0 ? 8000 : _v,
|
|
24420
25029
|
onBeforeDocumentUpload = _a.onBeforeDocumentUpload,
|
|
24421
25030
|
onDocumentUploaded = _a.onDocumentUploaded,
|
|
24422
25031
|
onDocumentUploadProgress = _a.onDocumentUploadProgress,
|
|
@@ -24433,28 +25042,28 @@
|
|
|
24433
25042
|
onIdCaptureModelError = _a.onIdCaptureModelError,
|
|
24434
25043
|
onSelfieCaptureModelError = _a.onSelfieCaptureModelError,
|
|
24435
25044
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
24436
|
-
|
|
24437
|
-
captureSignature =
|
|
24438
|
-
|
|
24439
|
-
captureSignatureVideo =
|
|
24440
|
-
|
|
24441
|
-
captureAdditionalDocuments =
|
|
24442
|
-
|
|
24443
|
-
theme =
|
|
24444
|
-
|
|
24445
|
-
assets =
|
|
24446
|
-
|
|
24447
|
-
classNames =
|
|
24448
|
-
|
|
24449
|
-
colors =
|
|
24450
|
-
|
|
24451
|
-
verbiage =
|
|
24452
|
-
|
|
24453
|
-
geolocationEnabled =
|
|
24454
|
-
|
|
24455
|
-
geolocationRequired =
|
|
24456
|
-
|
|
24457
|
-
debugMode =
|
|
25045
|
+
_w = _a.captureSignature,
|
|
25046
|
+
captureSignature = _w === void 0 ? false : _w,
|
|
25047
|
+
_x = _a.captureSignatureVideo,
|
|
25048
|
+
captureSignatureVideo = _x === void 0 ? false : _x,
|
|
25049
|
+
_y = _a.captureAdditionalDocuments,
|
|
25050
|
+
captureAdditionalDocuments = _y === void 0 ? [] : _y,
|
|
25051
|
+
_z = _a.theme,
|
|
25052
|
+
theme = _z === void 0 ? 'default' : _z,
|
|
25053
|
+
_0 = _a.assets,
|
|
25054
|
+
assets = _0 === void 0 ? {} : _0,
|
|
25055
|
+
_1 = _a.classNames,
|
|
25056
|
+
classNames = _1 === void 0 ? {} : _1,
|
|
25057
|
+
_2 = _a.colors,
|
|
25058
|
+
colors = _2 === void 0 ? {} : _2,
|
|
25059
|
+
_3 = _a.verbiage,
|
|
25060
|
+
verbiage = _3 === void 0 ? {} : _3,
|
|
25061
|
+
_4 = _a.geolocationEnabled,
|
|
25062
|
+
geolocationEnabled = _4 === void 0 ? true : _4,
|
|
25063
|
+
_5 = _a.geolocationRequired,
|
|
25064
|
+
geolocationRequired = _5 === void 0 ? false : _5,
|
|
25065
|
+
_6 = _a.debugMode,
|
|
25066
|
+
debugMode = _6 === void 0 ? false : _6;
|
|
24458
25067
|
useLanguage(lang);
|
|
24459
25068
|
useDebugLogging(debugMode);
|
|
24460
25069
|
var idCaptureProps = React.useMemo(function () {
|
|
@@ -24478,13 +25087,14 @@
|
|
|
24478
25087
|
rotateLoadingOverlayImageWhenPortrait: idCaptureRotateLoadingOverlayImageWhenPortrait,
|
|
24479
25088
|
modelLoadTimeoutMs: idCaptureModelLoadTimeoutMs,
|
|
24480
25089
|
allowIdCardBackToFrontCapture: allowIdCardBackToFrontCapture,
|
|
25090
|
+
allowUploadingDocumentsFromStorage: idCaptureAllowUploadingDocumentsFromStorage,
|
|
24481
25091
|
enableOverrideWrongDocumentTypeDialog: enableOverrideWrongDocumentTypeDialog,
|
|
24482
25092
|
allowOverrideWrongDocumentTypeAfterMs: allowOverrideWrongDocumentTypeAfterMs,
|
|
24483
25093
|
forceFallbackMode: idCaptureForceFallbackMode,
|
|
24484
25094
|
skipSuccessScreen: skipSuccessScreen,
|
|
24485
25095
|
debugMode: debugMode
|
|
24486
25096
|
};
|
|
24487
|
-
}, [onExitCapture, onUserCancel, onIdCaptureModelError, assets.idCapture, classNames.idCapture, colors.idCapture, verbiage.idCapture, precapturedDocuments, idCaptureRequirement, allowSinglePageIdCapture, idCaptureThresholds, idCaptureLoadingOverlayMode, idCaptureInstructions, idCaptureGuideType, idCaptureGuideImages, idCapturePortraitGuidesOnMobile, idCaptureRotateLoadingOverlayImageWhenPortrait, idCaptureModelLoadTimeoutMs, allowIdCardBackToFrontCapture, enableOverrideWrongDocumentTypeDialog, allowOverrideWrongDocumentTypeAfterMs, idCaptureForceFallbackMode, skipSuccessScreen, debugMode]);
|
|
25097
|
+
}, [onExitCapture, onUserCancel, onIdCaptureModelError, assets.idCapture, classNames.idCapture, colors.idCapture, verbiage.idCapture, precapturedDocuments, idCaptureRequirement, allowSinglePageIdCapture, idCaptureThresholds, idCaptureLoadingOverlayMode, idCaptureInstructions, idCaptureGuideType, idCaptureGuideImages, idCapturePortraitGuidesOnMobile, idCaptureRotateLoadingOverlayImageWhenPortrait, idCaptureModelLoadTimeoutMs, allowIdCardBackToFrontCapture, idCaptureAllowUploadingDocumentsFromStorage, enableOverrideWrongDocumentTypeDialog, allowOverrideWrongDocumentTypeAfterMs, idCaptureForceFallbackMode, skipSuccessScreen, debugMode]);
|
|
24488
25098
|
var faceLivenessProps = React.useMemo(function () {
|
|
24489
25099
|
return {
|
|
24490
25100
|
loadingOverlayMode: faceLivenessLoadingOverlayMode,
|