idmission-web-sdk 2.2.172 → 2.2.174
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/common/SdkPage.d.ts +18 -0
- package/dist/components/common/SdkPage.d.ts.map +1 -0
- package/dist/components/common/debug.d.ts.map +1 -1
- package/dist/components/common/overlay.d.ts +29 -26
- package/dist/components/common/overlay.d.ts.map +1 -1
- package/dist/components/common/spinner.d.ts +4 -1
- package/dist/components/common/spinner.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerBiometricsEnrollment.d.ts +1 -0
- package/dist/components/customer_flows/CustomerBiometricsEnrollment.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerIdAndBiometricsEnrollment.d.ts +1 -0
- package/dist/components/customer_flows/CustomerIdAndBiometricsEnrollment.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerIdentification.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerVerification.d.ts.map +1 -1
- package/dist/components/customer_flows/DocumentCapture.d.ts.map +1 -1
- package/dist/components/customer_flows/FaceValidation.d.ts +3 -1
- package/dist/components/customer_flows/FaceValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/IdAndFaceValidation.d.ts +1 -0
- package/dist/components/customer_flows/IdAndFaceValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/IdValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/SignatureKYC.d.ts.map +1 -1
- package/dist/components/customer_flows/VideoIdValidation.d.ts +1 -0
- package/dist/components/customer_flows/VideoIdValidation.d.ts.map +1 -1
- package/dist/components/customer_identification/CustomerIdentificationWizard.d.ts.map +1 -1
- package/dist/components/customer_verification/CustomerVerificationWizard.d.ts.map +1 -1
- package/dist/components/document_capture/DocumentCaptureScreen.d.ts.map +1 -1
- package/dist/components/face_liveness/FaceCaptureGuideOverlay.d.ts.map +1 -1
- package/dist/components/face_liveness/FaceLivenessWizard.d.ts.map +1 -1
- package/dist/components/id_capture/IdCapture.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureGuideOverlay.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureLoadingGraphic.d.ts +1 -1
- package/dist/components/id_capture/IdCaptureLoadingGraphic.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureLoadingOverlayDefault.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCapture.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCaptureLoadingGraphic.d.ts +1 -3
- package/dist/components/selfie_capture/SelfieCaptureLoadingGraphic.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCaptureLoadingOverlayDefault.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCaptureGuides.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCaptureWizard.d.ts +0 -1
- package/dist/components/video_id/IdVideoCaptureWizard.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureGuides.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +884 -923
- 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 +886 -925
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +887 -926
- 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 +3 -1
- package/dist/themes/index.d.ts.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +3 -3
- package/dist/components/common/Page.d.ts +0 -13
- package/dist/components/common/Page.d.ts.map +0 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-dom/client'), require('platform'), require('styled-components'), require('
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-dom/client', 'platform', 'styled-components', '
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Sdk2 = {}, global.React, global.ReactDOM, global.platform, global.styled, global.
|
|
5
|
-
})(this, (function (exports, React, ReactDOM, platform, styled,
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-dom/client'), require('platform'), require('styled-components'), require('react-dom'), require('tus-js-client'), require('prop-types')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-dom/client', 'platform', 'styled-components', 'react-dom', 'tus-js-client', 'prop-types'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Sdk2 = {}, global.React, global.ReactDOM, global.platform, global.styled, global.ReactDOM, global.tusJsClient, global.PropTypes));
|
|
5
|
+
})(this, (function (exports, React, ReactDOM, platform, styled, reactDom, tusJsClient, require$$0) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopNamespaceDefault(e) {
|
|
8
8
|
var n = Object.create(null);
|
|
@@ -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.174';
|
|
215
215
|
|
|
216
216
|
function getPlatform() {
|
|
217
217
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -376,48 +376,6 @@
|
|
|
376
376
|
});
|
|
377
377
|
}
|
|
378
378
|
|
|
379
|
-
var PageContainerDiv = styled.div(templateObject_1$N || (templateObject_1$N = __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) {
|
|
380
|
-
var _a;
|
|
381
|
-
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 ");
|
|
382
|
-
}, function (props) {
|
|
383
|
-
return props.theme.fontFamily ? "font-family: ".concat(props.theme.fontFamily, ";") : "";
|
|
384
|
-
});
|
|
385
|
-
var PageContainer = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
386
|
-
var children = _a.children,
|
|
387
|
-
className = _a.className,
|
|
388
|
-
_b = _a.heightOffset,
|
|
389
|
-
heightOffset = _b === void 0 ? 0 : _b,
|
|
390
|
-
style = _a.style,
|
|
391
|
-
onClick = _a.onClick;
|
|
392
|
-
var _c = React.useState(false),
|
|
393
|
-
dimensionsCalculated = _c[0],
|
|
394
|
-
setDimensionsCalculated = _c[1];
|
|
395
|
-
React.useEffect(function () {
|
|
396
|
-
if (typeof window === 'undefined') return;
|
|
397
|
-
setDimensionsCalculated(false);
|
|
398
|
-
var calcAppDimensions = function calcAppDimensions() {
|
|
399
|
-
var doc = document.documentElement;
|
|
400
|
-
doc.style.setProperty('--app-width', "".concat(window.innerWidth, "px"));
|
|
401
|
-
doc.style.setProperty('--app-height', "".concat(window.innerHeight, "px"));
|
|
402
|
-
};
|
|
403
|
-
window.addEventListener('resize', calcAppDimensions);
|
|
404
|
-
calcAppDimensions();
|
|
405
|
-
setDimensionsCalculated(true);
|
|
406
|
-
return function () {
|
|
407
|
-
window.removeEventListener('resize', calcAppDimensions);
|
|
408
|
-
};
|
|
409
|
-
}, []);
|
|
410
|
-
return /*#__PURE__*/React.createElement(PageContainerDiv, {
|
|
411
|
-
ref: ref,
|
|
412
|
-
style: style,
|
|
413
|
-
onClick: onClick,
|
|
414
|
-
className: className,
|
|
415
|
-
"$heightOffset": heightOffset
|
|
416
|
-
}, dimensionsCalculated && children);
|
|
417
|
-
});
|
|
418
|
-
PageContainer.displayName = 'PageContainer';
|
|
419
|
-
var templateObject_1$N;
|
|
420
|
-
|
|
421
379
|
var LoaderButton = function LoaderButton(_a) {
|
|
422
380
|
var children = _a.children,
|
|
423
381
|
className = _a.className,
|
|
@@ -473,29 +431,60 @@
|
|
|
473
431
|
className: "ladda-label"
|
|
474
432
|
}, children));
|
|
475
433
|
};
|
|
476
|
-
var StyledButton = styled.button(templateObject_1$M || (templateObject_1$M = __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) {
|
|
434
|
+
var StyledButton = styled.button(templateObject_1$O || (templateObject_1$O = __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) {
|
|
477
435
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
478
436
|
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 ");
|
|
479
437
|
});
|
|
480
|
-
var templateObject_1$
|
|
438
|
+
var templateObject_1$O;
|
|
481
439
|
|
|
482
|
-
var
|
|
440
|
+
var ButtonsRow$2 = styled.div(templateObject_1$N || (templateObject_1$N = __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"])));
|
|
441
|
+
var templateObject_1$N;
|
|
442
|
+
|
|
443
|
+
var GuidanceMessageContainerDiv = styled.div(templateObject_1$M || (templateObject_1$M = __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) {
|
|
444
|
+
var $top = _a.$top;
|
|
445
|
+
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
446
|
+
}, function (_a) {
|
|
447
|
+
var $bottom = _a.$bottom;
|
|
448
|
+
return $bottom ? "bottom: ".concat($bottom, ";") : "";
|
|
449
|
+
});
|
|
450
|
+
var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
451
|
+
var element = /*#__PURE__*/React.createElement(GuidanceMessageContainerDiv, _assign({}, props));
|
|
452
|
+
var portalLocation = document.getElementById('idmission-above-guides-content');
|
|
453
|
+
if (!portalLocation) return element;
|
|
454
|
+
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
455
|
+
};
|
|
456
|
+
var GuidanceMessage = styled.div(templateObject_2$E || (templateObject_2$E = __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) {
|
|
457
|
+
var _a, _b, _c, _d, _e, _f;
|
|
458
|
+
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';
|
|
459
|
+
}, function (props) {
|
|
460
|
+
var _a, _b, _c, _d, _e, _f;
|
|
461
|
+
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';
|
|
462
|
+
});
|
|
463
|
+
var templateObject_1$M, templateObject_2$E;
|
|
464
|
+
|
|
465
|
+
var wavesAnimation = styled.keyframes(templateObject_1$L || (templateObject_1$L = __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"])));
|
|
466
|
+
var progressBarAnimation = styled.keyframes(templateObject_2$D || (templateObject_2$D = __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"])));
|
|
467
|
+
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$s || (templateObject_3$s = __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"])));
|
|
468
|
+
var progressBorderAnimation = styled.keyframes(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
469
|
+
var templateObject_1$L, templateObject_2$D, templateObject_3$s, templateObject_4$m;
|
|
470
|
+
|
|
471
|
+
var OverlayContainer = styled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"])), function (props) {
|
|
483
472
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
484
473
|
}, function (props) {
|
|
485
474
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
486
475
|
});
|
|
487
|
-
var OverlayInner$2 = styled.div(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n
|
|
476
|
+
var OverlayInner$2 = styled.div(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) {
|
|
488
477
|
var _a;
|
|
489
478
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
490
479
|
}, function (props) {
|
|
491
480
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
492
481
|
});
|
|
493
|
-
var OverlayImageContainer = styled.div(templateObject_3$
|
|
494
|
-
var OverlayImageRow = styled.div(templateObject_4$
|
|
482
|
+
var OverlayImageContainer = styled.div(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n 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 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"])));
|
|
483
|
+
var OverlayImageRow = styled.div(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n display: flex;\n margin: auto;\n\n & > div {\n max-height: calc(100% - 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(100% - 320px);\n\n & > img {\n width: 100%;\n max-height: 100%;\n height: auto;\n object-fit: contain;\n }\n }\n"])));
|
|
495
484
|
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
496
485
|
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"])));
|
|
497
486
|
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"])));
|
|
498
|
-
var WideBorderButton = styled(WideButton)(templateObject_8$
|
|
487
|
+
var WideBorderButton = styled(WideButton)(templateObject_8$3 || (templateObject_8$3 = __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) {
|
|
499
488
|
var _a, _b;
|
|
500
489
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.textColor) !== null && _b !== void 0 ? _b : 'black';
|
|
501
490
|
}, function (props) {
|
|
@@ -505,7 +494,26 @@
|
|
|
505
494
|
var _a, _b;
|
|
506
495
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.borderColor) !== null && _b !== void 0 ? _b : 'var(--idm-color-secondary-500)';
|
|
507
496
|
});
|
|
508
|
-
var
|
|
497
|
+
var LoadingOverlayInner = styled(OverlayInner$2)(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n display: flex;\n flex-direction: column;\n padding: 0;\n"], ["\n position: relative;\n height: 100%;\n display: flex;\n flex-direction: column;\n padding: 0;\n"])));
|
|
498
|
+
var LoadingOverlayHeader = styled.div(templateObject_10$2 || (templateObject_10$2 = __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) {
|
|
499
|
+
var _a;
|
|
500
|
+
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
501
|
+
}, function (props) {
|
|
502
|
+
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
503
|
+
});
|
|
504
|
+
var LoadingOverlayGuidanceMessage = styled(GuidanceMessage)(templateObject_11$1 || (templateObject_11$1 = __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"])));
|
|
505
|
+
var LoadingOverlayImageContainer = styled(OverlayImageContainer)(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n padding: 0;\n max-height: 100%;\n pointer-events: none;\n"], ["\n padding: 0;\n max-height: 100%;\n pointer-events: none;\n"])));
|
|
506
|
+
var LoadingOverlayProgressBarBackground = 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"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
507
|
+
var LoadingOverlayProgressBar = styled.span(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n display: block;\n width: ", "%;\n height: 100%;\n left: 0;\n position: absolute;\n"], ["\n display: block;\n width: ", "%;\n height: 100%;\n left: 0;\n position: absolute;\n"])), function (props) {
|
|
508
|
+
return props.$progress;
|
|
509
|
+
});
|
|
510
|
+
var LoadingOverlayProgressIndicator = styled.span(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n display: block;\n height: 100%;\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"], ["\n display: block;\n height: 100%;\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"])), progressBarAnimation);
|
|
511
|
+
var LoadingOverlayButtonsRow = styled(ButtonsRow$2)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n min-height: 100px;\n width: 100%;\n box-sizing: border-box;\n position: relative;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n min-height: 100px;\n width: 100%;\n box-sizing: border-box;\n position: relative;\n"])));
|
|
512
|
+
var LoadingOverlayLoadingListContainer = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n display: flex;\n position: relative;\n z-index: 2;\n"], ["\n display: flex;\n position: relative;\n z-index: 2;\n"])));
|
|
513
|
+
var LoadingOverlayLoadingList = styled.ul(templateObject_18 || (templateObject_18 = __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"])));
|
|
514
|
+
var LoadingOverlayLoadingListItem = styled.li(templateObject_19 || (templateObject_19 = __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"])));
|
|
515
|
+
var LoadingOverlayProgressContainer = styled.div(templateObject_20 || (templateObject_20 = __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"])));
|
|
516
|
+
var templateObject_1$K, templateObject_2$C, templateObject_3$r, templateObject_4$l, templateObject_5$d, templateObject_6$a, templateObject_7$7, templateObject_8$3, templateObject_9$3, templateObject_10$2, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20;
|
|
509
517
|
|
|
510
518
|
function _extends() {
|
|
511
519
|
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
@@ -8032,7 +8040,7 @@
|
|
|
8032
8040
|
return [frameWidth, frameHeight];
|
|
8033
8041
|
}
|
|
8034
8042
|
|
|
8035
|
-
var InvisibleCanvas = styled.canvas(templateObject_1$
|
|
8043
|
+
var InvisibleCanvas = styled.canvas(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
8036
8044
|
function drawToCanvas(canvas, frame, width, height) {
|
|
8037
8045
|
if (!canvas) return;
|
|
8038
8046
|
var ctx = canvas.getContext('2d');
|
|
@@ -8052,7 +8060,7 @@
|
|
|
8052
8060
|
var _a;
|
|
8053
8061
|
(_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);
|
|
8054
8062
|
}
|
|
8055
|
-
var templateObject_1$
|
|
8063
|
+
var templateObject_1$J;
|
|
8056
8064
|
|
|
8057
8065
|
function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
|
|
8058
8066
|
if (quality === void 0) {
|
|
@@ -13874,14 +13882,14 @@
|
|
|
13874
13882
|
className: classNames.message
|
|
13875
13883
|
}, messageText)));
|
|
13876
13884
|
}
|
|
13877
|
-
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$
|
|
13885
|
+
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
13878
13886
|
var StyledOverlayHeading = styled.h3(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
13879
13887
|
function useCameraStore(selector) {
|
|
13880
13888
|
var store = React.useContext(CameraStoreContext);
|
|
13881
13889
|
if (!store) throw new Error('useCameraStore cannot be used without Provider');
|
|
13882
13890
|
return useStore(store, selector);
|
|
13883
13891
|
}
|
|
13884
|
-
var templateObject_1$
|
|
13892
|
+
var templateObject_1$I, templateObject_2$B;
|
|
13885
13893
|
|
|
13886
13894
|
var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
|
|
13887
13895
|
startDocumentDetection: function startDocumentDetection() {
|
|
@@ -15209,12 +15217,12 @@
|
|
|
15209
15217
|
if (!portalLocation) return element;
|
|
15210
15218
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
15211
15219
|
}
|
|
15212
|
-
var DebugStatsPaneDiv = styled.span(templateObject_1$
|
|
15213
|
-
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$A || (templateObject_2$A = __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) {
|
|
15220
|
+
var DebugStatsPaneDiv = styled.span(templateObject_1$H || (templateObject_1$H = __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"])));
|
|
15221
|
+
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n position: absolute;\n z-index: 1001;\n top: 0;\n left: 0;\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 top: 0;\n left: 0;\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) {
|
|
15214
15222
|
var $flipX = _a.$flipX;
|
|
15215
15223
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
15216
15224
|
});
|
|
15217
|
-
var ObjectDetectionDebugBox = styled.div(templateObject_3$
|
|
15225
|
+
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) {
|
|
15218
15226
|
var $color = _a.$color;
|
|
15219
15227
|
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
15220
15228
|
}, function (_a) {
|
|
@@ -15224,7 +15232,7 @@
|
|
|
15224
15232
|
var $flipX = _a.$flipX;
|
|
15225
15233
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
15226
15234
|
});
|
|
15227
|
-
var FaceDetectionKeypointMarker = styled.div(templateObject_4$
|
|
15235
|
+
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) {
|
|
15228
15236
|
var $color = _a.$color;
|
|
15229
15237
|
return $color !== null && $color !== void 0 ? $color : 'red';
|
|
15230
15238
|
}, function (_a) {
|
|
@@ -15415,29 +15423,7 @@
|
|
|
15415
15423
|
}
|
|
15416
15424
|
});
|
|
15417
15425
|
}
|
|
15418
|
-
var templateObject_1$
|
|
15419
|
-
|
|
15420
|
-
var GuidanceMessageContainerDiv = styled.div(templateObject_1$H || (templateObject_1$H = __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) {
|
|
15421
|
-
var $top = _a.$top;
|
|
15422
|
-
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
15423
|
-
}, function (_a) {
|
|
15424
|
-
var $bottom = _a.$bottom;
|
|
15425
|
-
return $bottom ? "bottom: ".concat($bottom, ";") : "";
|
|
15426
|
-
});
|
|
15427
|
-
var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
15428
|
-
var element = /*#__PURE__*/React.createElement(GuidanceMessageContainerDiv, _assign({}, props));
|
|
15429
|
-
var portalLocation = document.getElementById('idmission-above-guides-content');
|
|
15430
|
-
if (!portalLocation) return element;
|
|
15431
|
-
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
15432
|
-
};
|
|
15433
|
-
var GuidanceMessage = styled.div(templateObject_2$z || (templateObject_2$z = __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) {
|
|
15434
|
-
var _a, _b, _c, _d, _e, _f;
|
|
15435
|
-
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';
|
|
15436
|
-
}, function (props) {
|
|
15437
|
-
var _a, _b, _c, _d, _e, _f;
|
|
15438
|
-
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';
|
|
15439
|
-
});
|
|
15440
|
-
var templateObject_1$H, templateObject_2$z;
|
|
15426
|
+
var templateObject_1$H, templateObject_2$A, templateObject_3$q, templateObject_4$k;
|
|
15441
15427
|
|
|
15442
15428
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
15443
15429
|
var _b = _a.classNames,
|
|
@@ -15452,7 +15438,7 @@
|
|
|
15452
15438
|
buttonText: 'OK'
|
|
15453
15439
|
});
|
|
15454
15440
|
if (!allowOverrideWrongDocumentTypeGuidance) return null;
|
|
15455
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
15441
|
+
return /*#__PURE__*/React.createElement(Container$3, {
|
|
15456
15442
|
className: classNames.container
|
|
15457
15443
|
}, /*#__PURE__*/React.createElement(InnerContainer, {
|
|
15458
15444
|
className: classNames.inner
|
|
@@ -15470,18 +15456,18 @@
|
|
|
15470
15456
|
}
|
|
15471
15457
|
}, verbiage.buttonText))));
|
|
15472
15458
|
}
|
|
15473
|
-
var Container$
|
|
15459
|
+
var Container$3 = styled.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"], ["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"])), function (props) {
|
|
15474
15460
|
var _a, _b, _c;
|
|
15475
15461
|
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';
|
|
15476
15462
|
}, function (props) {
|
|
15477
15463
|
var _a, _b, _c;
|
|
15478
15464
|
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';
|
|
15479
15465
|
});
|
|
15480
|
-
var InnerContainer = styled.div(templateObject_2$
|
|
15481
|
-
var Message = styled.span(templateObject_3$
|
|
15482
|
-
var ButtonContainer = styled.div(templateObject_4$
|
|
15466
|
+
var InnerContainer = styled.div(templateObject_2$z || (templateObject_2$z = __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"])));
|
|
15467
|
+
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"])));
|
|
15468
|
+
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"])));
|
|
15483
15469
|
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"])));
|
|
15484
|
-
var templateObject_1$G, templateObject_2$
|
|
15470
|
+
var templateObject_1$G, templateObject_2$z, templateObject_3$p, templateObject_4$j, templateObject_5$c;
|
|
15485
15471
|
|
|
15486
15472
|
// This is a simplified version of https://github.com/ZeeCoder/use-resize-observer.
|
|
15487
15473
|
// We have removed all options and made it compliant with React Compiler/React 19.
|
|
@@ -15600,37 +15586,37 @@
|
|
|
15600
15586
|
}
|
|
15601
15587
|
|
|
15602
15588
|
var IdCapture = function IdCapture(_a) {
|
|
15603
|
-
var _b, _c, _d, _e, _f, _g
|
|
15589
|
+
var _b, _c, _d, _e, _f, _g;
|
|
15604
15590
|
var requiredDocumentType = _a.requiredDocumentType,
|
|
15605
|
-
|
|
15606
|
-
thresholds =
|
|
15591
|
+
_h = _a.thresholds,
|
|
15592
|
+
thresholds = _h === void 0 ? defaultIdCaptureThresholds : _h,
|
|
15607
15593
|
guidanceMessage = _a.guidanceMessage,
|
|
15608
15594
|
guidanceSatisfied = _a.guidanceSatisfied,
|
|
15609
15595
|
onCapture = _a.onCapture,
|
|
15610
|
-
|
|
15611
|
-
classNames =
|
|
15612
|
-
|
|
15613
|
-
colors =
|
|
15614
|
-
|
|
15615
|
-
rawVerbiage =
|
|
15616
|
-
|
|
15617
|
-
debugMode =
|
|
15618
|
-
var
|
|
15619
|
-
ref =
|
|
15620
|
-
|
|
15621
|
-
width =
|
|
15622
|
-
|
|
15623
|
-
height =
|
|
15596
|
+
_j = _a.classNames,
|
|
15597
|
+
classNames = _j === void 0 ? {} : _j,
|
|
15598
|
+
_k = _a.colors,
|
|
15599
|
+
colors = _k === void 0 ? {} : _k,
|
|
15600
|
+
_l = _a.verbiage,
|
|
15601
|
+
rawVerbiage = _l === void 0 ? {} : _l,
|
|
15602
|
+
_m = _a.debugMode,
|
|
15603
|
+
debugMode = _m === void 0 ? false : _m;
|
|
15604
|
+
var _o = useResizeObserver(),
|
|
15605
|
+
ref = _o.ref,
|
|
15606
|
+
_p = _o.width,
|
|
15607
|
+
width = _p === void 0 ? 1 : _p,
|
|
15608
|
+
_q = _o.height,
|
|
15609
|
+
height = _q === void 0 ? 1 : _q;
|
|
15624
15610
|
var state = useIdCaptureStore();
|
|
15625
|
-
var
|
|
15626
|
-
camera =
|
|
15627
|
-
isRearFacing =
|
|
15628
|
-
var
|
|
15629
|
-
modelsReady =
|
|
15630
|
-
setThresholds =
|
|
15631
|
-
detectionTime =
|
|
15632
|
-
focusPredictionTime =
|
|
15633
|
-
getBestFrame =
|
|
15611
|
+
var _r = useCameraStore(),
|
|
15612
|
+
camera = _r.camera,
|
|
15613
|
+
isRearFacing = _r.isRearFacing;
|
|
15614
|
+
var _s = React.useContext(IdCaptureModelsContext),
|
|
15615
|
+
modelsReady = _s.ready,
|
|
15616
|
+
setThresholds = _s.setThresholds,
|
|
15617
|
+
detectionTime = _s.detectionTime,
|
|
15618
|
+
focusPredictionTime = _s.focusPredictionTime,
|
|
15619
|
+
getBestFrame = _s.getBestFrame;
|
|
15634
15620
|
React.useEffect(function () {
|
|
15635
15621
|
return dispatchIdCaptureAction({
|
|
15636
15622
|
type: 'captureInitialized'
|
|
@@ -15703,11 +15689,6 @@
|
|
|
15703
15689
|
var theme = styled.useTheme();
|
|
15704
15690
|
colors.guideBoxUnsatisfiedColor || (colors.guideBoxUnsatisfiedColor = (_d = (_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.guideBox) === null || _c === void 0 ? void 0 : _c.unsatisfiedColor) !== null && _d !== void 0 ? _d : 'white');
|
|
15705
15691
|
colors.guideBoxSatisfiedColor || (colors.guideBoxSatisfiedColor = (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.guideBox) === null || _f === void 0 ? void 0 : _f.satisfiedColor) !== null && _g !== void 0 ? _g : 'green');
|
|
15706
|
-
// console.log(
|
|
15707
|
-
// `${
|
|
15708
|
-
// documentTypeDisplayNames[state.detectedDocumentType]
|
|
15709
|
-
// } detected, hold still...`,
|
|
15710
|
-
// )
|
|
15711
15692
|
var verbiage = useTranslations(rawVerbiage, {
|
|
15712
15693
|
instructionText: 'Scan the front of ID',
|
|
15713
15694
|
processingIdCardText: 'ID card front captured.',
|
|
@@ -15732,12 +15713,12 @@
|
|
|
15732
15713
|
var satisfied = state.isGoodFrame;
|
|
15733
15714
|
if (typeof guidanceSatisfied === 'boolean') satisfied = guidanceSatisfied;
|
|
15734
15715
|
guidanceMessage || (guidanceMessage = satisfied ? verbiage.guidanceSatisfiedText : !state.detectionThresholdMet ? verbiage.guidanceNotDetectedText : state.backDetectedFirst ? verbiage.guidanceBackDetectedFirstText : state.flipRequired ? verbiage.guidancePleaseFlipText : state.idCardDetectedButNotAllowed ? verbiage.guidanceIdCardNotAllowedText : state.passportDetectedButNotAllowed ? verbiage.guidancePassportNotAllowedText : !state.documentInBounds ? verbiage.guidanceNotCenteredText : state.documentTooClose ? verbiage.guidanceTooCloseText : !state.documentIsStable ? verbiage.guidanceNotStableText : !state.focusThresholdMet ? verbiage.guidanceTooBlurryText : '');
|
|
15735
|
-
return /*#__PURE__*/React.createElement(
|
|
15716
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
15736
15717
|
ref: ref,
|
|
15737
|
-
className:
|
|
15718
|
+
className: classNames.container
|
|
15738
15719
|
}, guidanceMessage !== '' && ( /*#__PURE__*/React.createElement(GuidanceMessageContainer, {
|
|
15739
15720
|
"$top": "",
|
|
15740
|
-
"$bottom": "12.
|
|
15721
|
+
"$bottom": "12.5%",
|
|
15741
15722
|
className: classNames.guidanceMessageContainer
|
|
15742
15723
|
}, /*#__PURE__*/React.createElement(GuidanceMessage, {
|
|
15743
15724
|
"$variant": satisfied ? 'positive' : 'default',
|
|
@@ -15800,7 +15781,7 @@
|
|
|
15800
15781
|
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
15801
15782
|
}, /*#__PURE__*/React.createElement(StyledOverlayInner$3, {
|
|
15802
15783
|
className: classNames.inner
|
|
15803
|
-
}, /*#__PURE__*/React.createElement(StyledOverlayImageContainer$
|
|
15784
|
+
}, /*#__PURE__*/React.createElement(StyledOverlayImageContainer$1, {
|
|
15804
15785
|
className: classNames.imageContainer
|
|
15805
15786
|
}, /*#__PURE__*/React.createElement("img", {
|
|
15806
15787
|
src: assets.imageUrl,
|
|
@@ -15819,10 +15800,10 @@
|
|
|
15819
15800
|
}, verbiage.retryBtnText)));
|
|
15820
15801
|
};
|
|
15821
15802
|
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
15822
|
-
var StyledOverlayImageContainer$
|
|
15823
|
-
var Description$4 = styled.p(templateObject_3$
|
|
15824
|
-
var RetryButton$1 = styled(LoaderButton)(templateObject_4$
|
|
15825
|
-
var templateObject_1$F, templateObject_2$
|
|
15803
|
+
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
15804
|
+
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"])));
|
|
15805
|
+
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"])));
|
|
15806
|
+
var templateObject_1$F, templateObject_2$y, templateObject_3$o, templateObject_4$i;
|
|
15826
15807
|
|
|
15827
15808
|
var ExitCaptureStyledButton = styled.button(templateObject_1$E || (templateObject_1$E = __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"])));
|
|
15828
15809
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
@@ -15870,23 +15851,16 @@
|
|
|
15870
15851
|
};
|
|
15871
15852
|
var templateObject_1$E;
|
|
15872
15853
|
|
|
15873
|
-
var ButtonsRow = styled.div(templateObject_1$D || (templateObject_1$D = __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"])));
|
|
15874
|
-
var templateObject_1$D;
|
|
15875
|
-
|
|
15876
15854
|
function IdCaptureLoadingGraphic(props) {
|
|
15877
15855
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
15878
15856
|
return isMobile ? ( /*#__PURE__*/React.createElement(IdCaptureLoadingGraphicMobile, _assign({}, props))) : ( /*#__PURE__*/React.createElement(IdCaptureLoadingGraphicDesktop, _assign({}, props)));
|
|
15879
15857
|
}
|
|
15880
15858
|
function IdCaptureLoadingGraphicDesktop(_a) {
|
|
15881
15859
|
var _b, _c, _d, _e, _f, _g;
|
|
15882
|
-
var
|
|
15883
|
-
|
|
15884
|
-
|
|
15885
|
-
|
|
15886
|
-
className = _a.className;
|
|
15887
|
-
var _k = React.useState(0),
|
|
15888
|
-
frame = _k[0],
|
|
15889
|
-
setFrame = _k[1];
|
|
15860
|
+
var className = _a.className;
|
|
15861
|
+
var _h = React.useState(0),
|
|
15862
|
+
frame = _h[0],
|
|
15863
|
+
setFrame = _h[1];
|
|
15890
15864
|
React.useEffect(function () {
|
|
15891
15865
|
var i = setInterval(function () {
|
|
15892
15866
|
setFrame(function (n) {
|
|
@@ -15902,8 +15876,6 @@
|
|
|
15902
15876
|
var accentOpacity = (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.loadingGraphicAccentOpacity) !== null && _g !== void 0 ? _g : 0.2;
|
|
15903
15877
|
return /*#__PURE__*/React.createElement(LoadingGraphicWrapper, null, /*#__PURE__*/React.createElement(LoadingGraphicSvg, {
|
|
15904
15878
|
className: className,
|
|
15905
|
-
width: width,
|
|
15906
|
-
height: height,
|
|
15907
15879
|
"$frame": frame,
|
|
15908
15880
|
"$borderColor": accentColor,
|
|
15909
15881
|
viewBox: "0 0 698 452",
|
|
@@ -16352,21 +16324,21 @@
|
|
|
16352
16324
|
fill: "white"
|
|
16353
16325
|
}))));
|
|
16354
16326
|
}
|
|
16355
|
-
var LoadingGraphicWrapper = styled.div(templateObject_1$
|
|
16356
|
-
var LoadingGraphicSvg = styled.svg(templateObject_2$
|
|
16327
|
+
var LoadingGraphicWrapper = styled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
|
|
16328
|
+
var LoadingGraphicSvg = styled.svg(templateObject_2$x || (templateObject_2$x = __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 max-height: 80%;\n max-width: 80%;\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 max-height: 80%;\n max-width: 80%;\n"])), function (props) {
|
|
16357
16329
|
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
16358
16330
|
}, function (props) {
|
|
16359
16331
|
return props.$frame >= 5 ? 10 : 0;
|
|
16360
16332
|
}, function (props) {
|
|
16361
16333
|
return props.$borderColor;
|
|
16362
16334
|
});
|
|
16363
|
-
var LoadingGraphicCardGroup = styled.g(templateObject_3$
|
|
16335
|
+
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) {
|
|
16364
16336
|
return props.$offScreen ? '-500px' : '0';
|
|
16365
16337
|
});
|
|
16366
|
-
var LoadingGraphicPhoneGroup = styled.g(templateObject_4$
|
|
16338
|
+
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) {
|
|
16367
16339
|
return props.$offScreen ? '40px' : '0';
|
|
16368
16340
|
});
|
|
16369
|
-
var templateObject_1$
|
|
16341
|
+
var templateObject_1$D, templateObject_2$x, templateObject_3$n, templateObject_4$h;
|
|
16370
16342
|
|
|
16371
16343
|
function LoadingListItemIndicator(_a) {
|
|
16372
16344
|
var _b = _a.state,
|
|
@@ -16417,12 +16389,6 @@
|
|
|
16417
16389
|
}))))));
|
|
16418
16390
|
}
|
|
16419
16391
|
|
|
16420
|
-
var wavesAnimation = styled.keyframes(templateObject_1$B || (templateObject_1$B = __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"])));
|
|
16421
|
-
var progressBarAnimation = styled.keyframes(templateObject_2$v || (templateObject_2$v = __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"])));
|
|
16422
|
-
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$n || (templateObject_3$n = __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"])));
|
|
16423
|
-
var progressBorderAnimation = styled.keyframes(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
16424
|
-
var templateObject_1$B, templateObject_2$v, templateObject_3$n, templateObject_4$h;
|
|
16425
|
-
|
|
16426
16392
|
var legacyInstructionImageUrl$1 = "".concat(DEFAULT_CDN_URL, "/WebSDK-Instruction-DL-Capture-3-Portrait.png");
|
|
16427
16393
|
var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a) {
|
|
16428
16394
|
var _b, _c, _d, _e;
|
|
@@ -16503,13 +16469,10 @@
|
|
|
16503
16469
|
}, onUserCancel && ( /*#__PURE__*/React.createElement(ExitCaptureButton, {
|
|
16504
16470
|
onClick: onUserCancel,
|
|
16505
16471
|
className: classNames.cancelBtn
|
|
16506
|
-
})), customOverlayContent || ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
16472
|
+
})), customOverlayContent || ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LoadingOverlayHeader, null, /*#__PURE__*/React.createElement(LoadingOverlayGuidanceMessage, {
|
|
16507
16473
|
className: classNames.heading
|
|
16508
|
-
}, verbiage.headingText)), /*#__PURE__*/React.createElement(
|
|
16509
|
-
className: classNames.imageContainer
|
|
16510
|
-
style: {
|
|
16511
|
-
pointerEvents: 'none'
|
|
16512
|
-
}
|
|
16474
|
+
}, verbiage.headingText)), /*#__PURE__*/React.createElement(LoadingOverlayImageContainer, {
|
|
16475
|
+
className: classNames.imageContainer
|
|
16513
16476
|
}, (assets === null || assets === void 0 ? void 0 : assets.instructionImageUrl) && assets.instructionImageUrl !== legacyInstructionImageUrl$1 ? ( /*#__PURE__*/React.createElement(CustomLoadingGraphic$1, {
|
|
16514
16477
|
ref: imageRef,
|
|
16515
16478
|
alt: verbiage.headingText,
|
|
@@ -16533,27 +16496,27 @@
|
|
|
16533
16496
|
}), /*#__PURE__*/React.createElement("label", {
|
|
16534
16497
|
htmlFor: "use-continuity-camera",
|
|
16535
16498
|
className: classNames.continuityCameraCheckboxLabel
|
|
16536
|
-
}, verbiage.useContinuityCameraText)))), /*#__PURE__*/React.createElement(
|
|
16499
|
+
}, verbiage.useContinuityCameraText)))), /*#__PURE__*/React.createElement(ButtonsRow$1, {
|
|
16537
16500
|
className: classNames.buttonsRow
|
|
16538
|
-
}, /*#__PURE__*/React.createElement(
|
|
16501
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayProgressContainer, {
|
|
16539
16502
|
className: classNames.progressContainer
|
|
16540
16503
|
}, /*#__PURE__*/React.createElement(ProgressBarBackground$1, {
|
|
16541
16504
|
className: classNames.progressBackground
|
|
16542
|
-
}), /*#__PURE__*/React.createElement(
|
|
16505
|
+
}), /*#__PURE__*/React.createElement(LoadingOverlayProgressBar, {
|
|
16543
16506
|
"$progress": modelDownloadProgress,
|
|
16544
16507
|
className: classNames.progressBar
|
|
16545
16508
|
}, /*#__PURE__*/React.createElement(ProgressIndicator$1, {
|
|
16546
16509
|
className: classNames.progressIndicator
|
|
16547
|
-
}))), /*#__PURE__*/React.createElement(
|
|
16510
|
+
}))), /*#__PURE__*/React.createElement(LoadingOverlayLoadingListContainer, {
|
|
16548
16511
|
className: classNames.loadingListContainer
|
|
16549
|
-
}, /*#__PURE__*/React.createElement(
|
|
16512
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayLoadingList, {
|
|
16550
16513
|
className: classNames.loadingList
|
|
16551
|
-
}, /*#__PURE__*/React.createElement(
|
|
16514
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayLoadingListItem, {
|
|
16552
16515
|
className: clsx(classNames.loadingListItem, cameraReady ? 'done' : 'running')
|
|
16553
16516
|
}, /*#__PURE__*/React.createElement(LoadingListItemIndicator, {
|
|
16554
16517
|
className: classNames.loadingListItemIndicator,
|
|
16555
16518
|
state: cameraReady ? 'done' : 'running'
|
|
16556
|
-
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React.createElement(
|
|
16519
|
+
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React.createElement(LoadingOverlayLoadingListItem, {
|
|
16557
16520
|
className: clsx(classNames.loadingListItem, sessionReady && modelsReady ? 'done' : 'running')
|
|
16558
16521
|
}, /*#__PURE__*/React.createElement(LoadingListItemIndicator, {
|
|
16559
16522
|
className: classNames.loadingListItemIndicator,
|
|
@@ -16572,52 +16535,34 @@
|
|
|
16572
16535
|
}
|
|
16573
16536
|
}, verbiage.continueText))))));
|
|
16574
16537
|
};
|
|
16575
|
-
var OverlayInner$1 = styled
|
|
16538
|
+
var OverlayInner$1 = styled(LoadingOverlayInner)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
16576
16539
|
var _a, _b, _c, _d;
|
|
16577
16540
|
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';
|
|
16578
16541
|
}, function (props) {
|
|
16579
16542
|
var _a, _b, _c, _d;
|
|
16580
16543
|
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';
|
|
16581
16544
|
});
|
|
16582
|
-
var
|
|
16583
|
-
|
|
16584
|
-
|
|
16585
|
-
|
|
16586
|
-
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
16587
|
-
});
|
|
16588
|
-
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"])));
|
|
16589
|
-
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"])));
|
|
16590
|
-
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"])));
|
|
16591
|
-
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"])));
|
|
16592
|
-
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
16593
|
-
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) {
|
|
16545
|
+
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n position: absolute;\n bottom: 120px;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n bottom: 120px;\n width: 100%;\n display: flex;\n"])));
|
|
16546
|
+
var ContinuityCameraCheckboxInner = styled(GuidanceMessage)(templateObject_3$m || (templateObject_3$m = __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"])));
|
|
16547
|
+
var ContinuityCameraCheckbox$1 = styled.input(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
16548
|
+
var ButtonsRow$1 = styled(LoadingOverlayButtonsRow)(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n color: ", ";\n ", "\n"], ["\n color: ", ";\n ", "\n"])), function (props) {
|
|
16594
16549
|
var _a, _b, _c, _d;
|
|
16595
16550
|
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';
|
|
16596
16551
|
}, function (props) {
|
|
16597
16552
|
var _a, _b, _c, _d, _e, _f;
|
|
16598
16553
|
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, ";") : '';
|
|
16599
16554
|
});
|
|
16600
|
-
var
|
|
16601
|
-
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"])));
|
|
16602
|
-
var LoadingListItem$1 = styled.li(templateObject_11$2 || (templateObject_11$2 = __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"])));
|
|
16603
|
-
var ProgressContainer$1 = styled.div(templateObject_12$2 || (templateObject_12$2 = __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"])));
|
|
16604
|
-
var ProgressBarBackground$1 = styled.div(templateObject_13$2 || (templateObject_13$2 = __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) {
|
|
16555
|
+
var ProgressBarBackground$1 = styled(LoadingOverlayProgressBarBackground)(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n background: ", ";\n opacity: ", ";\n"], ["\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
16605
16556
|
var _a, _b, _c, _d;
|
|
16606
16557
|
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.progressBarBackgroundColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
16607
16558
|
}, function (props) {
|
|
16608
16559
|
var _a, _b, _c, _d;
|
|
16609
16560
|
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.progressBarBackgroundOpacity) !== null && _d !== void 0 ? _d : 0.75;
|
|
16610
16561
|
});
|
|
16611
|
-
var
|
|
16612
|
-
|
|
16613
|
-
|
|
16614
|
-
var
|
|
16615
|
-
var _a, _b, _c, _d;
|
|
16616
|
-
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarIndicatorColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
16617
|
-
}, progressBarAnimation);
|
|
16618
|
-
var CustomLoadingGraphic$1 = styled.img(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
16619
|
-
var ContinueButtonContainer$1 = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
16620
|
-
var ContinueButton$1 = styled(LoaderButton)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n"], ["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n"])), function (props) {
|
|
16562
|
+
var ProgressIndicator$1 = styled(LoadingOverlayProgressIndicator)(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"], ["\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"])), progressBarAnimation);
|
|
16563
|
+
var CustomLoadingGraphic$1 = styled.img(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
16564
|
+
var ContinueButtonContainer$1 = styled.div(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
16565
|
+
var ContinueButton$1 = styled(LoaderButton)(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n"], ["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n"])), function (props) {
|
|
16621
16566
|
var _a, _b, _c, _d, _e, _f;
|
|
16622
16567
|
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, ";") : '';
|
|
16623
16568
|
}, function (props) {
|
|
@@ -16627,10 +16572,10 @@
|
|
|
16627
16572
|
var _a, _b, _c, _d, _e, _f;
|
|
16628
16573
|
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, ";") : '';
|
|
16629
16574
|
});
|
|
16630
|
-
var templateObject_1$
|
|
16575
|
+
var templateObject_1$C, templateObject_2$w, templateObject_3$m, templateObject_4$g, templateObject_5$b, templateObject_6$9, templateObject_7$6, templateObject_8$2, templateObject_9$2, templateObject_10$1;
|
|
16631
16576
|
|
|
16632
|
-
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$
|
|
16633
|
-
var ContinuityCameraCheckbox = styled.input(templateObject_2$
|
|
16577
|
+
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
|
|
16578
|
+
var ContinuityCameraCheckbox = styled.input(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
16634
16579
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
16635
16580
|
var _b, _c, _d, _e;
|
|
16636
16581
|
var onDismissed = _a.onDismissed,
|
|
@@ -16751,7 +16696,7 @@
|
|
|
16751
16696
|
}
|
|
16752
16697
|
}, ready ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
16753
16698
|
};
|
|
16754
|
-
var templateObject_1$
|
|
16699
|
+
var templateObject_1$B, templateObject_2$v;
|
|
16755
16700
|
|
|
16756
16701
|
var components$1 = {
|
|
16757
16702
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -16809,9 +16754,9 @@
|
|
|
16809
16754
|
});
|
|
16810
16755
|
};
|
|
16811
16756
|
|
|
16812
|
-
var Card = styled.div(templateObject_1$
|
|
16813
|
-
var FlexCard = styled(Card)(templateObject_2$
|
|
16814
|
-
var templateObject_1$
|
|
16757
|
+
var Card = styled.div(templateObject_1$A || (templateObject_1$A = __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, 100% - 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, 100% - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"])));
|
|
16758
|
+
var FlexCard = styled(Card)(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
16759
|
+
var templateObject_1$A, templateObject_2$u;
|
|
16815
16760
|
|
|
16816
16761
|
var imageDisplayOrder = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
16817
16762
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
@@ -16873,13 +16818,13 @@
|
|
|
16873
16818
|
finished: true
|
|
16874
16819
|
}, verbiage.retryText)))));
|
|
16875
16820
|
};
|
|
16876
|
-
var Heading$a = styled.h1(templateObject_1$
|
|
16877
|
-
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$
|
|
16878
|
-
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"])));
|
|
16879
|
-
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"])));
|
|
16821
|
+
var Heading$a = styled.h1(templateObject_1$z || (templateObject_1$z = __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"])));
|
|
16822
|
+
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$t || (templateObject_2$t = __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"])));
|
|
16823
|
+
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 position: relative;\n width: 100%;\n"], ["\n max-width: 100%;\n flex-direction: column;\n display: grid;\n grid-gap: 12px;\n position: relative;\n width: 100%;\n"])));
|
|
16824
|
+
var ImageCol$1 = styled.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n width: 450px;\n max-width: 100%;\n max-height: none !important;\n"], ["\n width: 450px;\n max-width: 100%;\n max-height: none !important;\n"])));
|
|
16880
16825
|
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"])));
|
|
16881
|
-
var DebugPre = styled.pre(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n text-align: left;\n max-width:
|
|
16882
|
-
var templateObject_1$
|
|
16826
|
+
var DebugPre = styled.pre(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n display: block;\n text-align: left;\n width: 100%;\n max-width: 100%;\n overflow-x: auto;\n"], ["\n display: block;\n text-align: left;\n width: 100%;\n max-width: 100%;\n overflow-x: auto;\n"])));
|
|
16827
|
+
var templateObject_1$z, templateObject_2$t, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$8;
|
|
16883
16828
|
|
|
16884
16829
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
16885
16830
|
var _this = this;
|
|
@@ -16931,10 +16876,10 @@
|
|
|
16931
16876
|
canvas.style.height = '0';
|
|
16932
16877
|
}
|
|
16933
16878
|
|
|
16934
|
-
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$
|
|
16879
|
+
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n"])), function (props) {
|
|
16935
16880
|
return props.$isVisible ? '' : 'opacity: 0;';
|
|
16936
16881
|
});
|
|
16937
|
-
var IdCardGuideImage = styled.img(templateObject_2$
|
|
16882
|
+
var IdCardGuideImage = styled.img(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n transform-style: preserve-3d;\n ", "\n ", "\n"], ["\n transform-style: preserve-3d;\n ", "\n ", "\n"])), function (props) {
|
|
16938
16883
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
16939
16884
|
}, function (props) {
|
|
16940
16885
|
return props.$isInvisible ? 'opacity: 0;' : '';
|
|
@@ -17087,7 +17032,7 @@
|
|
|
17087
17032
|
var _a;
|
|
17088
17033
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
17089
17034
|
});
|
|
17090
|
-
var templateObject_1$
|
|
17035
|
+
var templateObject_1$y, templateObject_2$s, templateObject_3$k, templateObject_4$e, templateObject_5$9;
|
|
17091
17036
|
|
|
17092
17037
|
var defaultIdCaptureGuideImages = {
|
|
17093
17038
|
portrait: {
|
|
@@ -17263,12 +17208,12 @@
|
|
|
17263
17208
|
style: imageStyle
|
|
17264
17209
|
})));
|
|
17265
17210
|
};
|
|
17266
|
-
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$
|
|
17211
|
+
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$x || (templateObject_1$x = __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) {
|
|
17267
17212
|
return props.$transitionTime;
|
|
17268
17213
|
}, function (props) {
|
|
17269
17214
|
return props.$transforms;
|
|
17270
17215
|
});
|
|
17271
|
-
var templateObject_1$
|
|
17216
|
+
var templateObject_1$x;
|
|
17272
17217
|
|
|
17273
17218
|
var GuideOrientationContext = /*#__PURE__*/React.createContext({
|
|
17274
17219
|
orientation: 'landscape',
|
|
@@ -17555,8 +17500,8 @@
|
|
|
17555
17500
|
return v;
|
|
17556
17501
|
}).join(' ');
|
|
17557
17502
|
};
|
|
17558
|
-
var StyledPageContainer = styled(
|
|
17559
|
-
var GuidesContainer = styled.div(templateObject_2$
|
|
17503
|
+
var StyledPageContainer = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1000;\n overflow: hidden;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1000;\n overflow: hidden;\n"])));
|
|
17504
|
+
var GuidesContainer = styled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"])));
|
|
17560
17505
|
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"])));
|
|
17561
17506
|
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) {
|
|
17562
17507
|
var _a, _b, _c, _d, _e;
|
|
@@ -17581,9 +17526,9 @@
|
|
|
17581
17526
|
}, function (props) {
|
|
17582
17527
|
return props.$padding ? "padding: ".concat(props.$padding, "px;") : '';
|
|
17583
17528
|
});
|
|
17584
|
-
var GuideText = styled.span(templateObject_8$
|
|
17585
|
-
var GuideCenterInner = styled.div(templateObject_9$
|
|
17586
|
-
var templateObject_1$
|
|
17529
|
+
var GuideText = styled.span(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n align-content: center;\n margin-top: 12px;\n margin-bottom: 12px;\n"], ["\n align-content: center;\n margin-top: 12px;\n margin-bottom: 12px;\n"])));
|
|
17530
|
+
var GuideCenterInner = styled.div(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n position: relative;\n margin: auto;\n"], ["\n position: relative;\n margin: auto;\n"])));
|
|
17531
|
+
var templateObject_1$w, templateObject_2$r, templateObject_3$j, templateObject_4$d, templateObject_5$8, templateObject_6$7, templateObject_7$5, templateObject_8$1, templateObject_9$1;
|
|
17587
17532
|
|
|
17588
17533
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
17589
17534
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -17724,11 +17669,11 @@
|
|
|
17724
17669
|
progress: progress
|
|
17725
17670
|
}));
|
|
17726
17671
|
};
|
|
17727
|
-
var CanvasWrapper$1 = styled.div(templateObject_1$
|
|
17672
|
+
var CanvasWrapper$1 = styled.div(templateObject_1$v || (templateObject_1$v = __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) {
|
|
17728
17673
|
return props.$maskColor;
|
|
17729
17674
|
});
|
|
17730
|
-
var Canvas$1 = styled.canvas(templateObject_2$
|
|
17731
|
-
var templateObject_1$
|
|
17675
|
+
var Canvas$1 = styled.canvas(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
17676
|
+
var templateObject_1$v, templateObject_2$q;
|
|
17732
17677
|
|
|
17733
17678
|
function IdCaptureGuides(_a) {
|
|
17734
17679
|
var _b = _a.guideType,
|
|
@@ -17784,7 +17729,7 @@
|
|
|
17784
17729
|
})));
|
|
17785
17730
|
}
|
|
17786
17731
|
|
|
17787
|
-
var Spinner$1 = styled.div(templateObject_1$
|
|
17732
|
+
var Spinner$1 = styled.div(templateObject_1$u || (templateObject_1$u = __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) {
|
|
17788
17733
|
var $size = _a.$size;
|
|
17789
17734
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
17790
17735
|
}, function (_a) {
|
|
@@ -17809,7 +17754,11 @@
|
|
|
17809
17754
|
var $color = _a.$color;
|
|
17810
17755
|
return $color !== null && $color !== void 0 ? $color : '#888';
|
|
17811
17756
|
}, dualRingSpinnerAnimation);
|
|
17812
|
-
var
|
|
17757
|
+
var SpinnerPageContainer = styled.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"])));
|
|
17758
|
+
function SpinnerPage() {
|
|
17759
|
+
return /*#__PURE__*/React.createElement(SpinnerPageContainer, null, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
17760
|
+
}
|
|
17761
|
+
var templateObject_1$u, templateObject_2$p;
|
|
17813
17762
|
|
|
17814
17763
|
var IdCaptureImagePreview = function IdCaptureImagePreview(_a) {
|
|
17815
17764
|
var _b = _a.classNames,
|
|
@@ -17896,11 +17845,11 @@
|
|
|
17896
17845
|
onError: onError
|
|
17897
17846
|
})));
|
|
17898
17847
|
};
|
|
17899
|
-
var StyledSpinner = styled(Spinner$1)(templateObject_1$
|
|
17900
|
-
var ImagePreviewWrapper = styled.div(templateObject_2$
|
|
17848
|
+
var StyledSpinner = styled(Spinner$1)(templateObject_1$t || (templateObject_1$t = __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"])));
|
|
17849
|
+
var ImagePreviewWrapper = styled.div(templateObject_2$o || (templateObject_2$o = __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"])));
|
|
17901
17850
|
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"])));
|
|
17902
17851
|
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"])));
|
|
17903
|
-
var templateObject_1$
|
|
17852
|
+
var templateObject_1$t, templateObject_2$o, templateObject_3$i, templateObject_4$c;
|
|
17904
17853
|
|
|
17905
17854
|
var documentCaptureInitialState = {
|
|
17906
17855
|
documents: [],
|
|
@@ -18248,16 +18197,16 @@
|
|
|
18248
18197
|
ref: canvasRef
|
|
18249
18198
|
}));
|
|
18250
18199
|
};
|
|
18251
|
-
var CanvasWrapper = styled.div(templateObject_1$
|
|
18200
|
+
var CanvasWrapper = styled.div(templateObject_1$s || (templateObject_1$s = __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) {
|
|
18252
18201
|
return props.$maskColor;
|
|
18253
18202
|
});
|
|
18254
|
-
var Canvas = styled.canvas(templateObject_2$
|
|
18255
|
-
var templateObject_1$
|
|
18203
|
+
var Canvas = styled.canvas(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
18204
|
+
var templateObject_1$s, templateObject_2$n;
|
|
18256
18205
|
|
|
18257
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
18206
|
+
var CameraFeedWrapper = styled.div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
18258
18207
|
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;") : "";
|
|
18259
18208
|
});
|
|
18260
|
-
var templateObject_1$
|
|
18209
|
+
var templateObject_1$r;
|
|
18261
18210
|
|
|
18262
18211
|
var CameraVideoTag = function CameraVideoTag(props) {
|
|
18263
18212
|
var _a = useCameraStore(useShallow(function (store) {
|
|
@@ -18288,46 +18237,46 @@
|
|
|
18288
18237
|
"$isRearFacing": isRearFacing
|
|
18289
18238
|
}, props));
|
|
18290
18239
|
};
|
|
18291
|
-
var FullscreenVideoTag = styled.video(templateObject_1$
|
|
18240
|
+
var FullscreenVideoTag = styled.video(templateObject_1$q || (templateObject_1$q = __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) {
|
|
18292
18241
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
18293
18242
|
});
|
|
18294
|
-
var templateObject_1$
|
|
18243
|
+
var templateObject_1$q;
|
|
18295
18244
|
|
|
18296
18245
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
18297
|
-
var _b, _c, _d, _e
|
|
18246
|
+
var _b, _c, _d, _e;
|
|
18298
18247
|
var onCaptureClicked = _a.onCaptureClicked,
|
|
18299
|
-
|
|
18300
|
-
classNames =
|
|
18301
|
-
|
|
18302
|
-
rawVerbiage =
|
|
18303
|
-
var
|
|
18304
|
-
|
|
18305
|
-
documents =
|
|
18306
|
-
currentDocumentIndex =
|
|
18307
|
-
rectX =
|
|
18308
|
-
rectY =
|
|
18309
|
-
rectWidth =
|
|
18310
|
-
rectHeight =
|
|
18311
|
-
rectOffsetTop =
|
|
18312
|
-
capturing =
|
|
18313
|
-
uploadCapturedDocument =
|
|
18314
|
-
dispatch =
|
|
18315
|
-
var
|
|
18316
|
-
title =
|
|
18317
|
-
aspectRatio =
|
|
18318
|
-
cameraFeedMode =
|
|
18319
|
-
instructions =
|
|
18320
|
-
contentUrl =
|
|
18321
|
-
content =
|
|
18322
|
-
uploadState =
|
|
18323
|
-
var
|
|
18324
|
-
videoStream =
|
|
18325
|
-
cameraReady =
|
|
18326
|
-
cameraAccessDenied =
|
|
18327
|
-
requestCameraAccess =
|
|
18328
|
-
var
|
|
18329
|
-
cameraAccessRequested =
|
|
18330
|
-
setCameraAccessRequested =
|
|
18248
|
+
_f = _a.classNames,
|
|
18249
|
+
classNames = _f === void 0 ? {} : _f,
|
|
18250
|
+
_g = _a.verbiage,
|
|
18251
|
+
rawVerbiage = _g === void 0 ? {} : _g;
|
|
18252
|
+
var _h = useDocumentCaptureState(),
|
|
18253
|
+
_j = _h[0],
|
|
18254
|
+
documents = _j.documents,
|
|
18255
|
+
currentDocumentIndex = _j.currentDocumentIndex,
|
|
18256
|
+
rectX = _j.rectX,
|
|
18257
|
+
rectY = _j.rectY,
|
|
18258
|
+
rectWidth = _j.rectWidth,
|
|
18259
|
+
rectHeight = _j.rectHeight,
|
|
18260
|
+
rectOffsetTop = _j.rectOffsetTop,
|
|
18261
|
+
capturing = _j.capturing,
|
|
18262
|
+
uploadCapturedDocument = _j.uploadCapturedDocument,
|
|
18263
|
+
dispatch = _h[1];
|
|
18264
|
+
var _k = (_b = documents[currentDocumentIndex]) !== null && _b !== void 0 ? _b : {},
|
|
18265
|
+
title = _k.title,
|
|
18266
|
+
aspectRatio = _k.aspectRatio,
|
|
18267
|
+
cameraFeedMode = _k.cameraFeedMode,
|
|
18268
|
+
instructions = _k.instructions,
|
|
18269
|
+
contentUrl = _k.contentUrl,
|
|
18270
|
+
content = _k.content,
|
|
18271
|
+
uploadState = _k.uploadState;
|
|
18272
|
+
var _l = useCameraStore(),
|
|
18273
|
+
videoStream = _l.videoStream,
|
|
18274
|
+
cameraReady = _l.cameraReady,
|
|
18275
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
18276
|
+
requestCameraAccess = _l.requestCameraAccess;
|
|
18277
|
+
var _m = React.useState(false),
|
|
18278
|
+
cameraAccessRequested = _m[0],
|
|
18279
|
+
setCameraAccessRequested = _m[1];
|
|
18331
18280
|
var cameraAccessNeeded =
|
|
18332
18281
|
// we should force the browser to ask for camera access if...
|
|
18333
18282
|
uploadState === 'not_started' &&
|
|
@@ -18375,9 +18324,7 @@
|
|
|
18375
18324
|
});
|
|
18376
18325
|
});
|
|
18377
18326
|
}
|
|
18378
|
-
return /*#__PURE__*/React.createElement(
|
|
18379
|
-
className: "flex ".concat((_f = classNames.container) !== null && _f !== void 0 ? _f : '')
|
|
18380
|
-
}, /*#__PURE__*/React.createElement(CameraFeedWrapper, {
|
|
18327
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CameraFeedWrapper, {
|
|
18381
18328
|
className: classNames.cameraFeedWrapper,
|
|
18382
18329
|
"$mode": cameraFeedMode !== null && cameraFeedMode !== void 0 ? cameraFeedMode : 'snapToGuides',
|
|
18383
18330
|
"$x": rectX,
|
|
@@ -18406,7 +18353,7 @@
|
|
|
18406
18353
|
className: classNames.footerRow
|
|
18407
18354
|
}, instructions && ( /*#__PURE__*/React.createElement(Instructions, {
|
|
18408
18355
|
className: classNames.instructions
|
|
18409
|
-
}, instructions)), /*#__PURE__*/React.createElement(StyledButtonsRow$
|
|
18356
|
+
}, instructions)), /*#__PURE__*/React.createElement(StyledButtonsRow$8, {
|
|
18410
18357
|
className: classNames.buttonsRow
|
|
18411
18358
|
}, cameraAccessDenied ? ( /*#__PURE__*/React.createElement(LoaderButton, {
|
|
18412
18359
|
className: classNames.retryCameraAccessBtn,
|
|
@@ -18441,8 +18388,8 @@
|
|
|
18441
18388
|
disabled: !cameraReady || capturing
|
|
18442
18389
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
18443
18390
|
};
|
|
18444
|
-
var CaptureContainer = styled.div(templateObject_1$
|
|
18445
|
-
var HeadingRow = styled.div(templateObject_2$
|
|
18391
|
+
var CaptureContainer = styled.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
18392
|
+
var HeadingRow = styled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
|
|
18446
18393
|
return props.$maskColor;
|
|
18447
18394
|
});
|
|
18448
18395
|
var Heading$9 = styled.h1(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
|
|
@@ -18453,9 +18400,9 @@
|
|
|
18453
18400
|
var _a, _b, _c;
|
|
18454
18401
|
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';
|
|
18455
18402
|
});
|
|
18456
|
-
var StyledButtonsRow$
|
|
18403
|
+
var StyledButtonsRow$8 = styled(ButtonsRow$2)(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
|
|
18457
18404
|
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"])));
|
|
18458
|
-
var templateObject_1$
|
|
18405
|
+
var templateObject_1$p, templateObject_2$m, templateObject_3$h, templateObject_4$b, templateObject_5$7, templateObject_6$6, templateObject_7$4;
|
|
18459
18406
|
|
|
18460
18407
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
18461
18408
|
var onSuccess = _a.onSuccess,
|
|
@@ -18701,7 +18648,7 @@
|
|
|
18701
18648
|
capture: "environment",
|
|
18702
18649
|
onChange: onFileSelected,
|
|
18703
18650
|
hidden: true
|
|
18704
|
-
}), /*#__PURE__*/React.createElement(StyledButtonsRow$
|
|
18651
|
+
}), /*#__PURE__*/React.createElement(StyledButtonsRow$7, {
|
|
18705
18652
|
className: classNames.buttonsRow
|
|
18706
18653
|
}, images.length < maxImageCount && ( /*#__PURE__*/React.createElement(LoaderButton, {
|
|
18707
18654
|
variant: images.length > 0 ? 'secondary' : 'positive',
|
|
@@ -18726,13 +18673,13 @@
|
|
|
18726
18673
|
}
|
|
18727
18674
|
}, verbiage.doneBtnText))))));
|
|
18728
18675
|
};
|
|
18729
|
-
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
18730
|
-
var Heading$8 = styled.h3(templateObject_2$
|
|
18676
|
+
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
18677
|
+
var Heading$8 = styled.h3(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18731
18678
|
var Description$3 = styled.p(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18732
18679
|
var Instruction = styled.p(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
18733
18680
|
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"])));
|
|
18734
|
-
var StyledButtonsRow$
|
|
18735
|
-
var templateObject_1$
|
|
18681
|
+
var StyledButtonsRow$7 = styled(ButtonsRow$2)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
18682
|
+
var templateObject_1$o, templateObject_2$l, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5;
|
|
18736
18683
|
|
|
18737
18684
|
function ScalingCameraFeed() {
|
|
18738
18685
|
var _a = useIdCaptureStore(),
|
|
@@ -19084,24 +19031,24 @@
|
|
|
19084
19031
|
}
|
|
19085
19032
|
}, file ? "".concat(file.name, " (").concat(humanFileSize(file.size), ")") : filePickerLoading ? loadingText : children));
|
|
19086
19033
|
}
|
|
19087
|
-
var ScreenContainer = styled.div(templateObject_1$
|
|
19034
|
+
var ScreenContainer = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n position: relative;\n font-family: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n position: relative;\n font-family: ", ";\n"])), function (props) {
|
|
19088
19035
|
var _a;
|
|
19089
19036
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
19090
19037
|
});
|
|
19091
|
-
var ScreenPanel = styled.div(templateObject_2$
|
|
19038
|
+
var ScreenPanel = styled.div(templateObject_2$k || (templateObject_2$k = __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"])));
|
|
19092
19039
|
var SelectIdCardScreenPanel = styled(ScreenPanel)(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n background: white;\n padding: 80px 0;\n\n @media (max-height: 1000px) {\n padding: 40px 0;\n }\n"], ["\n background: white;\n padding: 80px 0;\n\n @media (max-height: 1000px) {\n padding: 40px 0;\n }\n"])));
|
|
19093
19040
|
var ScreenPanelHeading = styled.h3(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n margin: 0 0 30px;\n"], ["\n margin: 0 0 30px;\n"])));
|
|
19094
19041
|
var ScreenActionsBar = styled.div(templateObject_5$5 || (templateObject_5$5 = __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 @media (max-width: 600px) {\n justify-content: center;\n }\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\n @media (max-width: 600px) {\n justify-content: center;\n }\n"])));
|
|
19095
19042
|
var DashedSeparator = styled.div(templateObject_6$4 || (templateObject_6$4 = __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"])));
|
|
19096
19043
|
var OrWrapper = styled.div(templateObject_7$3 || (templateObject_7$3 = __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"])));
|
|
19097
|
-
var UploadIdBackHelpText = styled.p(templateObject_8
|
|
19098
|
-
var Button = styled(WideBorderButton)(templateObject_9
|
|
19099
|
-
var Modal = styled.div(templateObject_10
|
|
19100
|
-
var Dialog = styled.div(templateObject_11
|
|
19044
|
+
var UploadIdBackHelpText = styled.p(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n color: #323232;\n font-style: italic;\n margin: 30px 0 0;\n"], ["\n color: #323232;\n font-style: italic;\n margin: 30px 0 0;\n"])));
|
|
19045
|
+
var Button = styled(WideBorderButton)(templateObject_9 || (templateObject_9 = __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 white-space: nowrap;\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 white-space: nowrap;\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"])));
|
|
19046
|
+
var Modal = styled.div(templateObject_10 || (templateObject_10 = __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"])));
|
|
19047
|
+
var Dialog = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n width: 100%;\n max-width: 500px;\n height: 100%;\n max-height: 600px;\n background: white;\n border-radius: 25px;\n overflow: auto;\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 //margin: 25px;\n"], ["\n width: 100%;\n max-width: 500px;\n height: 100%;\n max-height: 600px;\n background: white;\n border-radius: 25px;\n overflow: auto;\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 //margin: 25px;\n"])), function (props) {
|
|
19101
19048
|
var _a;
|
|
19102
19049
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
19103
19050
|
});
|
|
19104
|
-
var ModalCloseButton = styled.button(templateObject_12
|
|
19051
|
+
var ModalCloseButton = styled.button(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n width: 60px;\n height: 60px;\n background: black;\n color: whitesmoke;\n border-radius: 50%;\n font-size: 32px;\n border: none;\n cursor: pointer;\n margin: 20px 0;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n transition: background 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n padding: 0;\n\n &:hover {\n background: #222;\n color: white;\n }\n"], ["\n width: 60px;\n height: 60px;\n background: black;\n color: whitesmoke;\n border-radius: 50%;\n font-size: 32px;\n border: none;\n cursor: pointer;\n margin: 20px 0;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n transition: background 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n padding: 0;\n\n &:hover {\n background: #222;\n color: white;\n }\n"])));
|
|
19105
19052
|
function XIcon(props) {
|
|
19106
19053
|
return /*#__PURE__*/React.createElement("svg", _assign({
|
|
19107
19054
|
width: "25",
|
|
@@ -19352,7 +19299,7 @@
|
|
|
19352
19299
|
strokeWidth: "3"
|
|
19353
19300
|
}));
|
|
19354
19301
|
}
|
|
19355
|
-
var InlineSvg = styled.svg(templateObject_13
|
|
19302
|
+
var InlineSvg = styled.svg(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n display: inline;\n"], ["\n display: inline;\n"])));
|
|
19356
19303
|
function humanFileSize(bytes, si, dp) {
|
|
19357
19304
|
if (si === void 0) {
|
|
19358
19305
|
si = false;
|
|
@@ -19373,87 +19320,87 @@
|
|
|
19373
19320
|
} while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
|
|
19374
19321
|
return bytes.toFixed(dp) + ' ' + units[u];
|
|
19375
19322
|
}
|
|
19376
|
-
var templateObject_1$
|
|
19323
|
+
var templateObject_1$n, templateObject_2$k, templateObject_3$f, templateObject_4$9, templateObject_5$5, templateObject_6$4, templateObject_7$3, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
|
|
19377
19324
|
|
|
19378
19325
|
var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
19379
|
-
var _b, _c, _d, _e, _f
|
|
19326
|
+
var _b, _c, _d, _e, _f;
|
|
19380
19327
|
var onSuccess = _a.onSuccess,
|
|
19381
19328
|
onExitCapture = _a.onExitCapture,
|
|
19382
19329
|
onUserCancel = _a.onUserCancel,
|
|
19383
|
-
|
|
19384
|
-
loadingOverlayMode =
|
|
19330
|
+
_g = _a.loadingOverlayMode,
|
|
19331
|
+
loadingOverlayMode = _g === void 0 ? 'default' : _g,
|
|
19385
19332
|
customOverlayContent = _a.customOverlayContent,
|
|
19386
19333
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
19387
19334
|
precapturedDocuments = _a.precapturedDocuments,
|
|
19388
|
-
|
|
19389
|
-
captureRequirement =
|
|
19390
|
-
|
|
19391
|
-
allowSinglePageIdCapture =
|
|
19392
|
-
|
|
19393
|
-
separateIdCardCaptureSequence =
|
|
19394
|
-
|
|
19395
|
-
thresholds =
|
|
19396
|
-
|
|
19397
|
-
skipSuccessScreen =
|
|
19335
|
+
_h = _a.captureRequirement,
|
|
19336
|
+
captureRequirement = _h === void 0 ? 'idCardOrPassport' : _h,
|
|
19337
|
+
_j = _a.allowSinglePageIdCapture,
|
|
19338
|
+
allowSinglePageIdCapture = _j === void 0 ? false : _j,
|
|
19339
|
+
_k = _a.separateIdCardCaptureSequence,
|
|
19340
|
+
separateIdCardCaptureSequence = _k === void 0 ? false : _k,
|
|
19341
|
+
_l = _a.thresholds,
|
|
19342
|
+
thresholds = _l === void 0 ? defaultIdCaptureThresholds : _l,
|
|
19343
|
+
_m = _a.skipSuccessScreen,
|
|
19344
|
+
skipSuccessScreen = _m === void 0 ? false : _m,
|
|
19398
19345
|
instructions = _a.instructions,
|
|
19399
|
-
|
|
19400
|
-
releaseCameraAccessOnExit =
|
|
19401
|
-
|
|
19402
|
-
guideType =
|
|
19403
|
-
|
|
19404
|
-
portraitGuidesOnMobile =
|
|
19405
|
-
|
|
19406
|
-
rotateLoadingOverlayImageWhenPortrait =
|
|
19407
|
-
|
|
19408
|
-
silentFallback =
|
|
19409
|
-
|
|
19410
|
-
forceFallbackMode =
|
|
19411
|
-
|
|
19412
|
-
allowIdCardBackToFrontCapture =
|
|
19413
|
-
|
|
19414
|
-
enableOverrideWrongDocumentTypeDialog =
|
|
19415
|
-
|
|
19416
|
-
allowOverrideWrongDocumentTypeAfterMs =
|
|
19417
|
-
|
|
19418
|
-
allowUploadingDocumentsFromStorage =
|
|
19419
|
-
|
|
19420
|
-
guideImages =
|
|
19421
|
-
|
|
19422
|
-
assets =
|
|
19423
|
-
|
|
19424
|
-
classNames =
|
|
19425
|
-
|
|
19426
|
-
colors =
|
|
19427
|
-
|
|
19428
|
-
verbiage =
|
|
19429
|
-
|
|
19430
|
-
debugMode =
|
|
19346
|
+
_o = _a.releaseCameraAccessOnExit,
|
|
19347
|
+
releaseCameraAccessOnExit = _o === void 0 ? true : _o,
|
|
19348
|
+
_p = _a.guideType,
|
|
19349
|
+
guideType = _p === void 0 ? 'fit' : _p,
|
|
19350
|
+
_q = _a.portraitGuidesOnMobile,
|
|
19351
|
+
portraitGuidesOnMobile = _q === void 0 ? true : _q,
|
|
19352
|
+
_r = _a.rotateLoadingOverlayImageWhenPortrait,
|
|
19353
|
+
rotateLoadingOverlayImageWhenPortrait = _r === void 0 ? true : _r,
|
|
19354
|
+
_s = _a.silentFallback,
|
|
19355
|
+
silentFallback = _s === void 0 ? false : _s,
|
|
19356
|
+
_t = _a.forceFallbackMode,
|
|
19357
|
+
forceFallbackMode = _t === void 0 ? false : _t,
|
|
19358
|
+
_u = _a.allowIdCardBackToFrontCapture,
|
|
19359
|
+
allowIdCardBackToFrontCapture = _u === void 0 ? false : _u,
|
|
19360
|
+
_v = _a.enableOverrideWrongDocumentTypeDialog,
|
|
19361
|
+
enableOverrideWrongDocumentTypeDialog = _v === void 0 ? false : _v,
|
|
19362
|
+
_w = _a.allowOverrideWrongDocumentTypeAfterMs,
|
|
19363
|
+
allowOverrideWrongDocumentTypeAfterMs = _w === void 0 ? 8000 : _w,
|
|
19364
|
+
_x = _a.allowUploadingDocumentsFromStorage,
|
|
19365
|
+
allowUploadingDocumentsFromStorage = _x === void 0 ? false : _x,
|
|
19366
|
+
_y = _a.guideImages,
|
|
19367
|
+
guideImages = _y === void 0 ? defaultIdCaptureGuideImages : _y,
|
|
19368
|
+
_z = _a.assets,
|
|
19369
|
+
assets = _z === void 0 ? {} : _z,
|
|
19370
|
+
_0 = _a.classNames,
|
|
19371
|
+
classNames = _0 === void 0 ? {} : _0,
|
|
19372
|
+
_1 = _a.colors,
|
|
19373
|
+
colors = _1 === void 0 ? {} : _1,
|
|
19374
|
+
_2 = _a.verbiage,
|
|
19375
|
+
verbiage = _2 === void 0 ? {} : _2,
|
|
19376
|
+
_3 = _a.debugMode,
|
|
19377
|
+
debugMode = _3 === void 0 ? false : _3;
|
|
19431
19378
|
var state = useIdCaptureStore();
|
|
19432
|
-
var
|
|
19433
|
-
cameraAccessDenied =
|
|
19434
|
-
requestCameraAccess =
|
|
19435
|
-
releaseCameraAccess =
|
|
19436
|
-
var
|
|
19437
|
-
overlayDismissed =
|
|
19438
|
-
setOverlayDismissed =
|
|
19439
|
-
var
|
|
19440
|
-
submissionStatus =
|
|
19441
|
-
setIdFrontImage =
|
|
19442
|
-
setIdBackImage =
|
|
19443
|
-
setPassportImage =
|
|
19444
|
-
setIdFrontIrImage =
|
|
19445
|
-
setIdBackIrImage =
|
|
19446
|
-
setIdFrontUvImage =
|
|
19447
|
-
setIdBackUvImage =
|
|
19448
|
-
logIdFrontCaptureAttempt =
|
|
19449
|
-
logIdBackCaptureAttempt =
|
|
19450
|
-
var
|
|
19451
|
-
start =
|
|
19452
|
-
stop =
|
|
19453
|
-
onPredictionMade =
|
|
19454
|
-
setRequiredDocumentType =
|
|
19455
|
-
modelError =
|
|
19456
|
-
resetBestFrame =
|
|
19379
|
+
var _4 = useCameraStore(),
|
|
19380
|
+
cameraAccessDenied = _4.cameraAccessDenied,
|
|
19381
|
+
requestCameraAccess = _4.requestCameraAccess,
|
|
19382
|
+
releaseCameraAccess = _4.releaseCameraAccess;
|
|
19383
|
+
var _5 = React.useState(false),
|
|
19384
|
+
overlayDismissed = _5[0],
|
|
19385
|
+
setOverlayDismissed = _5[1];
|
|
19386
|
+
var _6 = React.useContext(SubmissionContext),
|
|
19387
|
+
submissionStatus = _6.submissionStatus,
|
|
19388
|
+
setIdFrontImage = _6.setIdFrontImage,
|
|
19389
|
+
setIdBackImage = _6.setIdBackImage,
|
|
19390
|
+
setPassportImage = _6.setPassportImage,
|
|
19391
|
+
setIdFrontIrImage = _6.setIdFrontIrImage,
|
|
19392
|
+
setIdBackIrImage = _6.setIdBackIrImage,
|
|
19393
|
+
setIdFrontUvImage = _6.setIdFrontUvImage,
|
|
19394
|
+
setIdBackUvImage = _6.setIdBackUvImage,
|
|
19395
|
+
logIdFrontCaptureAttempt = _6.logIdFrontCaptureAttempt,
|
|
19396
|
+
logIdBackCaptureAttempt = _6.logIdBackCaptureAttempt;
|
|
19397
|
+
var _7 = useIdCaptureModelsContext(),
|
|
19398
|
+
start = _7.start,
|
|
19399
|
+
stop = _7.stop,
|
|
19400
|
+
onPredictionMade = _7.onPredictionMade,
|
|
19401
|
+
setRequiredDocumentType = _7.setRequiredDocumentType,
|
|
19402
|
+
modelError = _7.modelError,
|
|
19403
|
+
resetBestFrame = _7.resetBestFrame;
|
|
19457
19404
|
React.useEffect(function () {
|
|
19458
19405
|
dispatchIdCaptureAction({
|
|
19459
19406
|
type: 'configureWizard',
|
|
@@ -19565,9 +19512,9 @@
|
|
|
19565
19512
|
type: 'resetWizard'
|
|
19566
19513
|
});
|
|
19567
19514
|
}, []);
|
|
19568
|
-
var
|
|
19569
|
-
attempt =
|
|
19570
|
-
setAttempt =
|
|
19515
|
+
var _8 = React.useState(0),
|
|
19516
|
+
attempt = _8[0],
|
|
19517
|
+
setAttempt = _8[1];
|
|
19571
19518
|
var onExit = React.useCallback(function () {
|
|
19572
19519
|
releaseCameraAccess();
|
|
19573
19520
|
setOverlayDismissed(false);
|
|
@@ -19658,9 +19605,9 @@
|
|
|
19658
19605
|
});
|
|
19659
19606
|
});
|
|
19660
19607
|
}, []);
|
|
19661
|
-
var
|
|
19662
|
-
progressStarted =
|
|
19663
|
-
setProgressStarted =
|
|
19608
|
+
var _9 = React.useState(false),
|
|
19609
|
+
progressStarted = _9[0],
|
|
19610
|
+
setProgressStarted = _9[1];
|
|
19664
19611
|
React.useEffect(function () {
|
|
19665
19612
|
if (state.captureState === 'capturing') {
|
|
19666
19613
|
setProgressStarted(false);
|
|
@@ -19690,9 +19637,7 @@
|
|
|
19690
19637
|
}
|
|
19691
19638
|
var requestedAction = state.captureState === 'requestingFlip' ? 'FLIP_ID' : state.requestedDocumentType === 'idCardBack' ? 'SHOW_ID_BACK' : state.requestedDocumentType === 'passport' ? 'SHOW_PASSPORT' : 'SHOW_ID_FRONT';
|
|
19692
19639
|
var guidesStatus = !overlayDismissed ? 'disabled' : state.isGoodFrame ? 'capturing' : 'ready';
|
|
19693
|
-
return /*#__PURE__*/React.createElement(
|
|
19694
|
-
className: "flex ".concat((_b = classNames === null || classNames === void 0 ? void 0 : classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
19695
|
-
}, /*#__PURE__*/React.createElement(ScalingCameraFeed, null), overlayDismissed && state.captureState === 'capturing' && ( /*#__PURE__*/React.createElement(IdCapture, {
|
|
19640
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScalingCameraFeed, null), overlayDismissed && state.captureState === 'capturing' && ( /*#__PURE__*/React.createElement(IdCapture, {
|
|
19696
19641
|
requiredDocumentType: state.requestedDocumentType,
|
|
19697
19642
|
thresholds: thresholds,
|
|
19698
19643
|
onCapture: onCapture,
|
|
@@ -19712,15 +19657,15 @@
|
|
|
19712
19657
|
colors: colors,
|
|
19713
19658
|
verbiage: idCaptureVerbiage,
|
|
19714
19659
|
isBackToFront: state.allowIdCardBackToFrontCapture && 'idCardBack' in state.capturedDocuments
|
|
19715
|
-
}), debugMode && !((
|
|
19716
|
-
classNames: (
|
|
19717
|
-
text: (
|
|
19660
|
+
}), debugMode && !((_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.capturePreview) === null || _c === void 0 ? void 0 : _c.disabled) && state.captureState === 'requestingFlip' && !separateIdCardCaptureSequence && state.imageUrl && ( /*#__PURE__*/React.createElement(IdCaptureImagePreview, {
|
|
19661
|
+
classNames: (_d = classNames.capture) === null || _d === void 0 ? void 0 : _d.imagePreview,
|
|
19662
|
+
text: (_e = idCaptureVerbiages === null || idCaptureVerbiages === void 0 ? void 0 : idCaptureVerbiages.idCardFront) === null || _e === void 0 ? void 0 : _e.processingIdCardText,
|
|
19718
19663
|
imageUrl: state.imageUrl
|
|
19719
19664
|
})), state.captureState !== 'complete' && ( /*#__PURE__*/React.createElement("div", {
|
|
19720
19665
|
id: "idmission-above-guides-content"
|
|
19721
19666
|
})), /*#__PURE__*/React.createElement(ExitCaptureButton, {
|
|
19722
19667
|
onClick: onExit,
|
|
19723
|
-
className: (
|
|
19668
|
+
className: (_f = classNames.capture) === null || _f === void 0 ? void 0 : _f.exitCaptureBtn
|
|
19724
19669
|
}), !overlayDismissed && ( /*#__PURE__*/React.createElement(IdCaptureLoadingOverlay, {
|
|
19725
19670
|
key: "loading".concat(attempt),
|
|
19726
19671
|
mode: loadingOverlayMode,
|
|
@@ -19760,14 +19705,10 @@
|
|
|
19760
19705
|
|
|
19761
19706
|
function SelfieCaptureLoadingGraphic(_a) {
|
|
19762
19707
|
var _b, _c, _d;
|
|
19763
|
-
var
|
|
19764
|
-
|
|
19765
|
-
|
|
19766
|
-
|
|
19767
|
-
className = _a.className;
|
|
19768
|
-
var _g = React.useState(1),
|
|
19769
|
-
frame = _g[0],
|
|
19770
|
-
setFrame = _g[1];
|
|
19708
|
+
var className = _a.className;
|
|
19709
|
+
var _e = React.useState(1),
|
|
19710
|
+
frame = _e[0],
|
|
19711
|
+
setFrame = _e[1];
|
|
19771
19712
|
React.useEffect(function () {
|
|
19772
19713
|
var i = setInterval(function () {
|
|
19773
19714
|
setFrame(function (n) {
|
|
@@ -19781,8 +19722,6 @@
|
|
|
19781
19722
|
var theme = styled.useTheme();
|
|
19782
19723
|
var satisfiedColor = (_d = (_c = (_b = theme.selfieCapture) === null || _b === void 0 ? void 0 : _b.guides) === null || _c === void 0 ? void 0 : _c.satisfiedColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
19783
19724
|
return /*#__PURE__*/React.createElement("svg", {
|
|
19784
|
-
width: width,
|
|
19785
|
-
height: height,
|
|
19786
19725
|
className: className,
|
|
19787
19726
|
viewBox: "0 0 840 740",
|
|
19788
19727
|
fill: "none",
|
|
@@ -20074,7 +20013,7 @@
|
|
|
20074
20013
|
}))));
|
|
20075
20014
|
});
|
|
20076
20015
|
HeadGuideSvg.displayName = 'HeadGuideSvg';
|
|
20077
|
-
var PulsingHeadGuideContainer = styled.div(templateObject_1$
|
|
20016
|
+
var PulsingHeadGuideContainer = styled.div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"], ["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"])), wavesAnimation);
|
|
20078
20017
|
function HeadGuide(_a) {
|
|
20079
20018
|
var _b;
|
|
20080
20019
|
var _c = _a.status,
|
|
@@ -20124,7 +20063,7 @@
|
|
|
20124
20063
|
height: parentHeight
|
|
20125
20064
|
})));
|
|
20126
20065
|
}
|
|
20127
|
-
var AbsoluteSvg = styled.svg(templateObject_2$
|
|
20066
|
+
var AbsoluteSvg = styled.svg(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n"])));
|
|
20128
20067
|
var RelativeSvgContainer = styled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n position: relative;\n height: 100%;\n display: flex;\n align-items: ", ";\n"], ["\n position: relative;\n height: 100%;\n display: flex;\n align-items: ", ";\n"])), function (props) {
|
|
20129
20068
|
return props.$verticalAlign === 'bottom' ? 'flex-end' : 'center';
|
|
20130
20069
|
});
|
|
@@ -20352,10 +20291,10 @@
|
|
|
20352
20291
|
status: status
|
|
20353
20292
|
}));
|
|
20354
20293
|
}
|
|
20355
|
-
var templateObject_1$
|
|
20294
|
+
var templateObject_1$m, templateObject_2$j, templateObject_3$e;
|
|
20356
20295
|
|
|
20357
|
-
var FaceCaptureGuideContainer = styled.div(templateObject_1$
|
|
20358
|
-
var FaceCaptureGuideInner = styled.div(templateObject_2$
|
|
20296
|
+
var FaceCaptureGuideContainer = styled.div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"], ["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"])));
|
|
20297
|
+
var FaceCaptureGuideInner = styled.div(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n position: relative;\n height: 60%;\n"], ["\n position: relative;\n height: 60%;\n"])));
|
|
20359
20298
|
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
20360
20299
|
var _b = _a.classNames,
|
|
20361
20300
|
classNames = _b === void 0 ? {} : _b,
|
|
@@ -20377,7 +20316,7 @@
|
|
|
20377
20316
|
verticalAlign: "center"
|
|
20378
20317
|
})));
|
|
20379
20318
|
};
|
|
20380
|
-
var templateObject_1$
|
|
20319
|
+
var templateObject_1$l, templateObject_2$i;
|
|
20381
20320
|
|
|
20382
20321
|
var SelfieGuidanceModelsContext = /*#__PURE__*/React.createContext({
|
|
20383
20322
|
start: function start() {
|
|
@@ -20662,7 +20601,7 @@
|
|
|
20662
20601
|
src: image,
|
|
20663
20602
|
alt: "",
|
|
20664
20603
|
className: classNames.image
|
|
20665
|
-
}))), /*#__PURE__*/React.createElement(StyledButtonsRow$
|
|
20604
|
+
}))), /*#__PURE__*/React.createElement(StyledButtonsRow$6, {
|
|
20666
20605
|
className: classNames.buttonsRow
|
|
20667
20606
|
}, image && !loading && !isMobile() && ( /*#__PURE__*/React.createElement(LoaderButton, {
|
|
20668
20607
|
className: classNames.retryCaptureBtn,
|
|
@@ -20697,12 +20636,12 @@
|
|
|
20697
20636
|
}
|
|
20698
20637
|
}, !image ? invalidSelfie ? verbiage.retryButtonText : verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
|
|
20699
20638
|
};
|
|
20700
|
-
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$
|
|
20701
|
-
var Heading$7 = styled.h3(templateObject_2$
|
|
20639
|
+
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
20640
|
+
var Heading$7 = styled.h3(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
20702
20641
|
var Description$2 = styled.p(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
20703
20642
|
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
20704
|
-
var StyledButtonsRow$
|
|
20705
|
-
var templateObject_1$
|
|
20643
|
+
var StyledButtonsRow$6 = styled(ButtonsRow$2)(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
20644
|
+
var templateObject_1$k, templateObject_2$h, templateObject_3$d, templateObject_4$8, templateObject_5$4;
|
|
20706
20645
|
|
|
20707
20646
|
var initialState$3 = {
|
|
20708
20647
|
busy: false,
|
|
@@ -20730,7 +20669,7 @@
|
|
|
20730
20669
|
}
|
|
20731
20670
|
};
|
|
20732
20671
|
var SelfieCapture = function SelfieCapture(_a) {
|
|
20733
|
-
var _b, _c, _d, _e, _f
|
|
20672
|
+
var _b, _c, _d, _e, _f;
|
|
20734
20673
|
var onGuidanceSatisfied = _a.onGuidanceSatisfied,
|
|
20735
20674
|
onGuidanceNotSatisfied = _a.onGuidanceNotSatisfied,
|
|
20736
20675
|
onFaceDetected = _a.onFaceDetected,
|
|
@@ -20738,46 +20677,46 @@
|
|
|
20738
20677
|
onSelfieCaptured = _a.onSelfieCaptured,
|
|
20739
20678
|
onTimeout = _a.onTimeout,
|
|
20740
20679
|
onExit = _a.onExit,
|
|
20741
|
-
|
|
20742
|
-
timeoutDurationMs =
|
|
20680
|
+
_g = _a.timeoutDurationMs,
|
|
20681
|
+
timeoutDurationMs = _g === void 0 ? 15000 : _g,
|
|
20743
20682
|
guidanceMessage = _a.guidanceMessage,
|
|
20744
20683
|
guidanceSatisfied = _a.guidanceSatisfied,
|
|
20745
20684
|
guidesComponent = _a.guidesComponent,
|
|
20746
|
-
|
|
20747
|
-
shouldCapture =
|
|
20748
|
-
|
|
20749
|
-
classNames =
|
|
20750
|
-
|
|
20751
|
-
colors =
|
|
20752
|
-
|
|
20753
|
-
rawVerbiage =
|
|
20754
|
-
|
|
20755
|
-
debugMode =
|
|
20756
|
-
var
|
|
20757
|
-
ref =
|
|
20758
|
-
|
|
20759
|
-
width =
|
|
20760
|
-
|
|
20761
|
-
height =
|
|
20762
|
-
var
|
|
20763
|
-
|
|
20764
|
-
busy =
|
|
20765
|
-
prediction =
|
|
20766
|
-
dispatch =
|
|
20685
|
+
_h = _a.shouldCapture,
|
|
20686
|
+
shouldCapture = _h === void 0 ? true : _h,
|
|
20687
|
+
_j = _a.classNames,
|
|
20688
|
+
classNames = _j === void 0 ? {} : _j,
|
|
20689
|
+
_k = _a.colors,
|
|
20690
|
+
colors = _k === void 0 ? {} : _k,
|
|
20691
|
+
_l = _a.verbiage,
|
|
20692
|
+
rawVerbiage = _l === void 0 ? {} : _l,
|
|
20693
|
+
_m = _a.debugMode,
|
|
20694
|
+
debugMode = _m === void 0 ? false : _m;
|
|
20695
|
+
var _o = useResizeObserver(),
|
|
20696
|
+
ref = _o.ref,
|
|
20697
|
+
_p = _o.width,
|
|
20698
|
+
width = _p === void 0 ? 1 : _p,
|
|
20699
|
+
_q = _o.height,
|
|
20700
|
+
height = _q === void 0 ? 1 : _q;
|
|
20701
|
+
var _r = React.useReducer(reducer$3, initialState$3),
|
|
20702
|
+
_s = _r[0],
|
|
20703
|
+
busy = _s.busy,
|
|
20704
|
+
prediction = _s.prediction,
|
|
20705
|
+
dispatch = _r[1];
|
|
20767
20706
|
var lastPredictionCanvas = React.useRef(null);
|
|
20768
|
-
var
|
|
20707
|
+
var _t = useCameraStore(useShallow(function (state) {
|
|
20769
20708
|
return {
|
|
20770
20709
|
camera: state.camera,
|
|
20771
20710
|
cameraReady: state.cameraReady,
|
|
20772
20711
|
videoRef: state.videoRef
|
|
20773
20712
|
};
|
|
20774
20713
|
})),
|
|
20775
|
-
camera =
|
|
20776
|
-
videoRef =
|
|
20777
|
-
var
|
|
20778
|
-
onPredictionMade =
|
|
20779
|
-
canvasRef =
|
|
20780
|
-
guidanceError =
|
|
20714
|
+
camera = _t.camera,
|
|
20715
|
+
videoRef = _t.videoRef;
|
|
20716
|
+
var _u = React.useContext(SelfieGuidanceModelsContext),
|
|
20717
|
+
onPredictionMade = _u.onPredictionMade,
|
|
20718
|
+
canvasRef = _u.canvasRef,
|
|
20719
|
+
guidanceError = _u.error;
|
|
20781
20720
|
onPredictionMade(f(React.useCallback(function (prediction) {
|
|
20782
20721
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
20783
20722
|
return __generator(this, function (_a) {
|
|
@@ -20822,9 +20761,9 @@
|
|
|
20822
20761
|
if (timer) clearTimeout(timer);
|
|
20823
20762
|
};
|
|
20824
20763
|
}, [onSelfieCaptureStarted, onSelfieCaptured, prediction]);
|
|
20825
|
-
var
|
|
20826
|
-
timedOut =
|
|
20827
|
-
timeoutStartedAt =
|
|
20764
|
+
var _v = useTimeout(timeoutDurationMs, onTimeout),
|
|
20765
|
+
timedOut = _v.timedOut,
|
|
20766
|
+
timeoutStartedAt = _v.timeoutStartedAt;
|
|
20828
20767
|
var debugScalingDetails = useDebugScalingDetails({
|
|
20829
20768
|
enabled: debugMode,
|
|
20830
20769
|
pageWidth: width,
|
|
@@ -20852,9 +20791,9 @@
|
|
|
20852
20791
|
});
|
|
20853
20792
|
}
|
|
20854
20793
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : FaceCaptureGuideOverlay;
|
|
20855
|
-
return /*#__PURE__*/React.createElement(
|
|
20794
|
+
return /*#__PURE__*/React.createElement(Container$2, {
|
|
20856
20795
|
ref: ref,
|
|
20857
|
-
className:
|
|
20796
|
+
className: classNames.container
|
|
20858
20797
|
}, /*#__PURE__*/React.createElement(InvisibleCanvas, {
|
|
20859
20798
|
ref: lastPredictionCanvas
|
|
20860
20799
|
}), /*#__PURE__*/React.createElement(GuidesComponent, {
|
|
@@ -20874,6 +20813,8 @@
|
|
|
20874
20813
|
className: classNames.exitCaptureBtn
|
|
20875
20814
|
}));
|
|
20876
20815
|
};
|
|
20816
|
+
var Container$2 = styled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
|
|
20817
|
+
var templateObject_1$j;
|
|
20877
20818
|
|
|
20878
20819
|
var initialState$2 = {
|
|
20879
20820
|
frame: null,
|
|
@@ -21261,9 +21202,9 @@
|
|
|
21261
21202
|
finished: true
|
|
21262
21203
|
}, verbiage.retryBtnText)))));
|
|
21263
21204
|
};
|
|
21264
|
-
var ImageContainer$5 = styled.div(templateObject_1$
|
|
21265
|
-
var Heading$6 = styled.h3(templateObject_2$
|
|
21266
|
-
var templateObject_1$
|
|
21205
|
+
var ImageContainer$5 = styled.div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100%;\n max-height: 100%;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"], ["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100%;\n max-height: 100%;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"])));
|
|
21206
|
+
var Heading$6 = styled.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n font-size: 1.2rem;\n margin: 0;\n"], ["\n font-size: 1.2rem;\n margin: 0;\n"])));
|
|
21207
|
+
var templateObject_1$i, templateObject_2$g;
|
|
21267
21208
|
|
|
21268
21209
|
var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
21269
21210
|
var _b = _a.canRetry,
|
|
@@ -21312,9 +21253,9 @@
|
|
|
21312
21253
|
finished: true
|
|
21313
21254
|
}, verbiage.exitBtnText)))));
|
|
21314
21255
|
};
|
|
21315
|
-
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$
|
|
21316
|
-
var Heading$5 = styled.h3(templateObject_2$
|
|
21317
|
-
var templateObject_1$
|
|
21256
|
+
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
21257
|
+
var Heading$5 = styled.h3(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
|
|
21258
|
+
var templateObject_1$h, templateObject_2$f;
|
|
21318
21259
|
|
|
21319
21260
|
var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
21320
21261
|
var _b;
|
|
@@ -21339,7 +21280,7 @@
|
|
|
21339
21280
|
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
21340
21281
|
}, /*#__PURE__*/React.createElement(StyledOverlayInner, {
|
|
21341
21282
|
className: classNames.inner
|
|
21342
|
-
}, /*#__PURE__*/React.createElement(StyledOverlayImageContainer
|
|
21283
|
+
}, /*#__PURE__*/React.createElement(StyledOverlayImageContainer, {
|
|
21343
21284
|
className: classNames.imageContainer
|
|
21344
21285
|
}, /*#__PURE__*/React.createElement("img", {
|
|
21345
21286
|
src: assets.imageUrl,
|
|
@@ -21357,11 +21298,11 @@
|
|
|
21357
21298
|
finished: true
|
|
21358
21299
|
}, verbiage.retryBtnText)));
|
|
21359
21300
|
};
|
|
21360
|
-
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$
|
|
21361
|
-
var StyledOverlayImageContainer
|
|
21301
|
+
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
21302
|
+
var StyledOverlayImageContainer = styled(OverlayImageContainer)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
21362
21303
|
var Description$1 = styled.p(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
|
|
21363
21304
|
var RetryButton = styled(LoaderButton)(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
|
|
21364
|
-
var templateObject_1$
|
|
21305
|
+
var templateObject_1$g, templateObject_2$e, templateObject_3$c, templateObject_4$7;
|
|
21365
21306
|
|
|
21366
21307
|
var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLegacy(_a) {
|
|
21367
21308
|
var onDismissed = _a.onDismissed,
|
|
@@ -21433,13 +21374,13 @@
|
|
|
21433
21374
|
}, verbiage.headingText), onUserCancel && ( /*#__PURE__*/React.createElement(ExitCaptureButton, {
|
|
21434
21375
|
onClick: onUserCancel,
|
|
21435
21376
|
className: classNames.cancelBtn
|
|
21436
|
-
})), /*#__PURE__*/React.createElement(StyledGuidanceMessage
|
|
21377
|
+
})), /*#__PURE__*/React.createElement(StyledGuidanceMessage, null, verbiage.removeEyeCoveringsText, /*#__PURE__*/React.createElement("br", null), verbiage.avoidExcessiveBacklightingText), /*#__PURE__*/React.createElement(OverlayImageContainer, {
|
|
21437
21378
|
className: classNames.imageContainer
|
|
21438
21379
|
}, /*#__PURE__*/React.createElement("img", {
|
|
21439
21380
|
className: classNames.image,
|
|
21440
21381
|
alt: verbiage.headingText,
|
|
21441
21382
|
src: assets.instructionImageUrl
|
|
21442
|
-
})), /*#__PURE__*/React.createElement(StyledButtonsRow$
|
|
21383
|
+
})), /*#__PURE__*/React.createElement(StyledButtonsRow$5, {
|
|
21443
21384
|
className: classNames.buttonsRow
|
|
21444
21385
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
21445
21386
|
variant: "positive",
|
|
@@ -21453,18 +21394,11 @@
|
|
|
21453
21394
|
}
|
|
21454
21395
|
}, ready ? verbiage.continueText : allModelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
|
|
21455
21396
|
};
|
|
21456
|
-
var StyledGuidanceMessage
|
|
21457
|
-
var StyledButtonsRow$
|
|
21458
|
-
var templateObject_1$
|
|
21397
|
+
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"], ["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"])));
|
|
21398
|
+
var StyledButtonsRow$5 = styled(ButtonsRow$2)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n flex-direction: column;\n padding-top: 25px;\n"], ["\n flex-direction: column;\n padding-top: 25px;\n"])));
|
|
21399
|
+
var templateObject_1$f, templateObject_2$d;
|
|
21459
21400
|
|
|
21460
21401
|
var legacyInstructionImageUrl = "".concat(DEFAULT_CDN_URL, "/Selfie-Image-1.png");
|
|
21461
|
-
var OverlayInner = styled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n height: 100dvh;\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n"], ["\n height: 100dvh;\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
21462
|
-
var _a, _b, _c, _d;
|
|
21463
|
-
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.backgroundColor) !== null && _d !== void 0 ? _d : '#ecedf3';
|
|
21464
|
-
}, function (props) {
|
|
21465
|
-
var _a, _b, _c, _d;
|
|
21466
|
-
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.textColor) !== null && _d !== void 0 ? _d : 'black';
|
|
21467
|
-
});
|
|
21468
21402
|
var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDefault(_a) {
|
|
21469
21403
|
var onDismissed = _a.onDismissed,
|
|
21470
21404
|
onUserCancel = _a.onUserCancel,
|
|
@@ -21547,11 +21481,11 @@
|
|
|
21547
21481
|
}, onUserCancel && ( /*#__PURE__*/React.createElement(ExitCaptureButton, {
|
|
21548
21482
|
onClick: onUserCancel,
|
|
21549
21483
|
className: classNames.cancelBtn
|
|
21550
|
-
})), customOverlayContent || ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
21484
|
+
})), customOverlayContent || ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LoadingOverlayHeader, {
|
|
21551
21485
|
className: classNames.headingContainer
|
|
21552
|
-
}, /*#__PURE__*/React.createElement(
|
|
21486
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayGuidanceMessage, {
|
|
21553
21487
|
className: classNames.heading
|
|
21554
|
-
}, headingText)), /*#__PURE__*/React.createElement(
|
|
21488
|
+
}, headingText)), /*#__PURE__*/React.createElement(LoadingOverlayImageContainer, {
|
|
21555
21489
|
className: classNames.imageContainer
|
|
21556
21490
|
}, (assets === null || assets === void 0 ? void 0 : assets.instructionImageUrl) && assets.instructionImageUrl !== legacyInstructionImageUrl ? ( /*#__PURE__*/React.createElement(CustomLoadingGraphic, {
|
|
21557
21491
|
className: classNames.image,
|
|
@@ -21559,32 +21493,32 @@
|
|
|
21559
21493
|
src: assets.instructionImageUrl
|
|
21560
21494
|
})) : ( /*#__PURE__*/React.createElement(SelfieCaptureLoadingGraphic, {
|
|
21561
21495
|
className: classNames.image
|
|
21562
|
-
}))))), /*#__PURE__*/React.createElement(
|
|
21496
|
+
}))))), /*#__PURE__*/React.createElement(ButtonsRow, {
|
|
21563
21497
|
className: classNames.buttonsRow
|
|
21564
|
-
}, /*#__PURE__*/React.createElement(
|
|
21498
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayProgressContainer, {
|
|
21565
21499
|
className: classNames.progressContainer
|
|
21566
21500
|
}, /*#__PURE__*/React.createElement(ProgressBarBackground, {
|
|
21567
21501
|
className: classNames.progressBackground
|
|
21568
|
-
}), /*#__PURE__*/React.createElement(
|
|
21502
|
+
}), /*#__PURE__*/React.createElement(LoadingOverlayProgressBar, {
|
|
21569
21503
|
"$progress": modelDownloadProgress,
|
|
21570
21504
|
className: classNames.progressBar
|
|
21571
21505
|
}, /*#__PURE__*/React.createElement(ProgressIndicator, {
|
|
21572
21506
|
className: classNames.progressIndicator
|
|
21573
|
-
}))), /*#__PURE__*/React.createElement(
|
|
21507
|
+
}))), /*#__PURE__*/React.createElement(LoadingOverlayLoadingListContainer, {
|
|
21574
21508
|
className: classNames.loadingListContainer
|
|
21575
|
-
}, /*#__PURE__*/React.createElement(
|
|
21509
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayLoadingList, {
|
|
21576
21510
|
className: classNames.loadingList
|
|
21577
|
-
}, /*#__PURE__*/React.createElement(
|
|
21511
|
+
}, /*#__PURE__*/React.createElement(LoadingOverlayLoadingListItem, {
|
|
21578
21512
|
className: clsx(classNames.loadingListItem, cameraReady ? 'done' : 'running')
|
|
21579
21513
|
}, /*#__PURE__*/React.createElement(LoadingListItemIndicator, {
|
|
21580
21514
|
className: classNames.loadingListItemIndicator,
|
|
21581
21515
|
state: cameraReady ? 'done' : 'running'
|
|
21582
|
-
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React.createElement(
|
|
21516
|
+
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React.createElement(LoadingOverlayLoadingListItem, {
|
|
21583
21517
|
className: clsx(classNames.loadingListItem, sessionReady && allModelsReady ? 'done' : 'running')
|
|
21584
21518
|
}, /*#__PURE__*/React.createElement(LoadingListItemIndicator, {
|
|
21585
21519
|
className: classNames.loadingListItemIndicator,
|
|
21586
21520
|
state: sessionReady && allModelsReady ? 'done' : 'running'
|
|
21587
|
-
}), !sessionReady ? verbiage.sessionCheckingText :
|
|
21521
|
+
}), !sessionReady ? verbiage.sessionCheckingText : allModelsReady ? verbiage.modelsReadyText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))), /*#__PURE__*/React.createElement(ContinueButtonContainer, {
|
|
21588
21522
|
className: classNames.continueBtnContainer
|
|
21589
21523
|
}, ready && ( /*#__PURE__*/React.createElement(ContinueButton, {
|
|
21590
21524
|
autoFocus: true,
|
|
@@ -21598,42 +21532,34 @@
|
|
|
21598
21532
|
}
|
|
21599
21533
|
}, verbiage.continueText))))));
|
|
21600
21534
|
};
|
|
21601
|
-
var
|
|
21602
|
-
var _a;
|
|
21603
|
-
return (_a = props.theme.
|
|
21535
|
+
var OverlayInner = styled(LoadingOverlayInner)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
21536
|
+
var _a, _b, _c, _d;
|
|
21537
|
+
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.backgroundColor) !== null && _d !== void 0 ? _d : '#ecedf3';
|
|
21604
21538
|
}, function (props) {
|
|
21605
|
-
|
|
21539
|
+
var _a, _b, _c, _d;
|
|
21540
|
+
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.textColor) !== null && _d !== void 0 ? _d : 'black';
|
|
21606
21541
|
});
|
|
21607
|
-
var
|
|
21608
|
-
var StyledButtonsRow$5 = styled(ButtonsRow)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n height: 100px;\n color: ", ";\n ", "\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100dvw;\n box-sizing: border-box;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n height: 100px;\n color: ", ";\n ", "\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100dvw;\n box-sizing: border-box;\n"])), function (props) {
|
|
21542
|
+
var ButtonsRow = styled(LoadingOverlayButtonsRow)(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n color: ", ";\n ", "\n"], ["\n color: ", ";\n ", "\n"])), function (props) {
|
|
21609
21543
|
var _a, _b, _c, _d;
|
|
21610
21544
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarTextColor) !== null && _d !== void 0 ? _d : 'white';
|
|
21611
21545
|
}, function (props) {
|
|
21612
21546
|
var _a, _b, _c, _d, _e, _f;
|
|
21613
21547
|
return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarFontSize) ? "font-size: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.selfieCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.progressBarFontSize, ";") : '';
|
|
21614
21548
|
});
|
|
21615
|
-
var
|
|
21616
|
-
var LoadingListContainer = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n display: flex;\n position: relative;\n z-index: 2;\n"], ["\n display: flex;\n position: relative;\n z-index: 2;\n"])));
|
|
21617
|
-
var LoadingList = styled.ul(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n display: block;\n margin: auto;\n list-style: none;\n padding: 0;\n"], ["\n display: block;\n margin: auto;\n list-style: none;\n padding: 0;\n"])));
|
|
21618
|
-
var LoadingListItem = styled.li(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"], ["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"])));
|
|
21619
|
-
var ProgressContainer = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
21620
|
-
var ProgressBarBackground = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: ", ";\n opacity: ", ";\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
21549
|
+
var ProgressBarBackground = styled(LoadingOverlayProgressBarBackground)(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n background: ", ";\n opacity: ", ";\n"], ["\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
21621
21550
|
var _a, _b, _c, _d;
|
|
21622
21551
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarBackgroundColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
21623
21552
|
}, function (props) {
|
|
21624
21553
|
var _a, _b, _c, _d;
|
|
21625
21554
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarBackgroundOpacity) !== null && _d !== void 0 ? _d : 0.75;
|
|
21626
21555
|
});
|
|
21627
|
-
var
|
|
21628
|
-
return props.$progress;
|
|
21629
|
-
});
|
|
21630
|
-
var ProgressIndicator = styled.span(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n display: block;\n height: 100%;\n background: ", ";\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"], ["\n display: block;\n height: 100%;\n background: ", ";\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"])), function (props) {
|
|
21556
|
+
var ProgressIndicator = styled(LoadingOverlayProgressIndicator)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n background: ", ";\n"], ["\n background: ", ";\n"])), function (props) {
|
|
21631
21557
|
var _a, _b, _c, _d;
|
|
21632
21558
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarIndicatorColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
21633
|
-
}
|
|
21634
|
-
var CustomLoadingGraphic = styled.img(
|
|
21635
|
-
var ContinueButtonContainer = styled.div(
|
|
21636
|
-
var ContinueButton = styled(LoaderButton)(
|
|
21559
|
+
});
|
|
21560
|
+
var CustomLoadingGraphic = styled.img(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
21561
|
+
var ContinueButtonContainer = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
21562
|
+
var ContinueButton = styled(LoaderButton)(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n"], ["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n"])), function (props) {
|
|
21637
21563
|
var _a, _b, _c, _d, _e, _f;
|
|
21638
21564
|
return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarFontSize) ? "font-size: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.selfieCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.progressBarFontSize, ";") : '';
|
|
21639
21565
|
}, function (props) {
|
|
@@ -21643,7 +21569,7 @@
|
|
|
21643
21569
|
var _a, _b, _c, _d, _e, _f;
|
|
21644
21570
|
return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.selfieCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.continueBtnBorder) ? "border: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.selfieCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.continueBtnBorder, ";") : '';
|
|
21645
21571
|
});
|
|
21646
|
-
var templateObject_1$
|
|
21572
|
+
var templateObject_1$e, templateObject_2$c, templateObject_3$b, templateObject_4$6, templateObject_5$3, templateObject_6$3, templateObject_7$2;
|
|
21647
21573
|
|
|
21648
21574
|
var components = {
|
|
21649
21575
|
"default": SelfieCaptureLoadingOverlayDefault,
|
|
@@ -21659,7 +21585,7 @@
|
|
|
21659
21585
|
};
|
|
21660
21586
|
|
|
21661
21587
|
var FaceLivenessWizard = function FaceLivenessWizard(_a) {
|
|
21662
|
-
var _b
|
|
21588
|
+
var _b;
|
|
21663
21589
|
var onComplete = _a.onComplete,
|
|
21664
21590
|
onSuccess = _a.onSuccess,
|
|
21665
21591
|
onFailure = _a.onFailure,
|
|
@@ -21669,70 +21595,70 @@
|
|
|
21669
21595
|
onExitAfterFailure = _a.onExitAfterFailure,
|
|
21670
21596
|
onUserCancel = _a.onUserCancel,
|
|
21671
21597
|
precapturedDocuments = _a.precapturedDocuments,
|
|
21672
|
-
|
|
21673
|
-
loadingOverlayMode =
|
|
21598
|
+
_c = _a.loadingOverlayMode,
|
|
21599
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
21674
21600
|
customOverlayContent = _a.customOverlayContent,
|
|
21675
21601
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
21676
|
-
|
|
21677
|
-
initialCaptureDelayMs =
|
|
21678
|
-
|
|
21679
|
-
timeoutDurationMs =
|
|
21680
|
-
|
|
21681
|
-
maxRetries =
|
|
21682
|
-
|
|
21683
|
-
skipSuccessScreen =
|
|
21684
|
-
|
|
21685
|
-
allowLivenessFailure =
|
|
21686
|
-
|
|
21687
|
-
renderCameraFeed =
|
|
21688
|
-
|
|
21689
|
-
releaseCameraAccessOnExit =
|
|
21690
|
-
|
|
21691
|
-
silentFallback =
|
|
21692
|
-
|
|
21693
|
-
waitForIdCaptureModels =
|
|
21602
|
+
_d = _a.initialCaptureDelayMs,
|
|
21603
|
+
initialCaptureDelayMs = _d === void 0 ? 1000 : _d,
|
|
21604
|
+
_e = _a.timeoutDurationMs,
|
|
21605
|
+
timeoutDurationMs = _e === void 0 ? 15000 : _e,
|
|
21606
|
+
_f = _a.maxRetries,
|
|
21607
|
+
maxRetries = _f === void 0 ? 2 : _f,
|
|
21608
|
+
_g = _a.skipSuccessScreen,
|
|
21609
|
+
skipSuccessScreen = _g === void 0 ? false : _g,
|
|
21610
|
+
_h = _a.allowLivenessFailure,
|
|
21611
|
+
allowLivenessFailure = _h === void 0 ? false : _h,
|
|
21612
|
+
_j = _a.renderCameraFeed,
|
|
21613
|
+
renderCameraFeed = _j === void 0 ? true : _j,
|
|
21614
|
+
_k = _a.releaseCameraAccessOnExit,
|
|
21615
|
+
releaseCameraAccessOnExit = _k === void 0 ? true : _k,
|
|
21616
|
+
_l = _a.silentFallback,
|
|
21617
|
+
silentFallback = _l === void 0 ? false : _l,
|
|
21618
|
+
_m = _a.waitForIdCaptureModels,
|
|
21619
|
+
waitForIdCaptureModels = _m === void 0 ? false : _m,
|
|
21694
21620
|
guidesComponent = _a.guidesComponent,
|
|
21695
21621
|
disableCapturePreview = _a.disableCapturePreview,
|
|
21696
|
-
|
|
21697
|
-
assets =
|
|
21698
|
-
|
|
21699
|
-
classNames =
|
|
21700
|
-
|
|
21701
|
-
colors =
|
|
21702
|
-
|
|
21703
|
-
verbiage =
|
|
21704
|
-
|
|
21705
|
-
debugMode =
|
|
21706
|
-
var
|
|
21707
|
-
submissionResponse =
|
|
21708
|
-
livenessCheckRequest =
|
|
21709
|
-
setSelfieImage =
|
|
21710
|
-
logSelfieCaptureAttempt =
|
|
21711
|
-
var
|
|
21622
|
+
_o = _a.assets,
|
|
21623
|
+
assets = _o === void 0 ? {} : _o,
|
|
21624
|
+
_p = _a.classNames,
|
|
21625
|
+
classNames = _p === void 0 ? {} : _p,
|
|
21626
|
+
_q = _a.colors,
|
|
21627
|
+
colors = _q === void 0 ? {} : _q,
|
|
21628
|
+
_r = _a.verbiage,
|
|
21629
|
+
verbiage = _r === void 0 ? {} : _r,
|
|
21630
|
+
_s = _a.debugMode,
|
|
21631
|
+
debugMode = _s === void 0 ? false : _s;
|
|
21632
|
+
var _t = React.useContext(SubmissionContext),
|
|
21633
|
+
submissionResponse = _t.submissionResponse,
|
|
21634
|
+
livenessCheckRequest = _t.livenessCheckRequest,
|
|
21635
|
+
setSelfieImage = _t.setSelfieImage,
|
|
21636
|
+
logSelfieCaptureAttempt = _t.logSelfieCaptureAttempt;
|
|
21637
|
+
var _u = useCameraStore(useShallow(function (state) {
|
|
21712
21638
|
return {
|
|
21713
21639
|
cameraAccessDenied: state.cameraAccessDenied,
|
|
21714
21640
|
requestCameraAccess: state.requestCameraAccess,
|
|
21715
21641
|
releaseCameraAccess: state.releaseCameraAccess
|
|
21716
21642
|
};
|
|
21717
21643
|
})),
|
|
21718
|
-
cameraAccessDenied =
|
|
21719
|
-
requestCameraAccess =
|
|
21720
|
-
releaseCameraAccess =
|
|
21721
|
-
var
|
|
21722
|
-
faceCropImageUrl =
|
|
21723
|
-
setFaceCropImageUrl =
|
|
21724
|
-
var
|
|
21725
|
-
retryCount =
|
|
21726
|
-
setRetryCount =
|
|
21727
|
-
var
|
|
21728
|
-
captureState =
|
|
21729
|
-
setCaptureState =
|
|
21644
|
+
cameraAccessDenied = _u.cameraAccessDenied,
|
|
21645
|
+
requestCameraAccess = _u.requestCameraAccess,
|
|
21646
|
+
releaseCameraAccess = _u.releaseCameraAccess;
|
|
21647
|
+
var _v = React.useState(''),
|
|
21648
|
+
faceCropImageUrl = _v[0],
|
|
21649
|
+
setFaceCropImageUrl = _v[1];
|
|
21650
|
+
var _w = React.useState(0),
|
|
21651
|
+
retryCount = _w[0],
|
|
21652
|
+
setRetryCount = _w[1];
|
|
21653
|
+
var _x = React.useState('LOADING'),
|
|
21654
|
+
captureState = _x[0],
|
|
21655
|
+
setCaptureState = _x[1];
|
|
21730
21656
|
var captureStartedAt = React.useRef();
|
|
21731
21657
|
var operationStartedAt = React.useRef();
|
|
21732
21658
|
var livenessScore = React.useRef();
|
|
21733
|
-
var
|
|
21734
|
-
start =
|
|
21735
|
-
stop =
|
|
21659
|
+
var _y = React.useContext(SelfieGuidanceModelsContext),
|
|
21660
|
+
start = _y.start,
|
|
21661
|
+
stop = _y.stop;
|
|
21736
21662
|
React.useEffect(function () {
|
|
21737
21663
|
if (precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie) {
|
|
21738
21664
|
setSelfieImage(precapturedDocuments.selfie.imageData);
|
|
@@ -21816,9 +21742,9 @@
|
|
|
21816
21742
|
}
|
|
21817
21743
|
onDenied === null || onDenied === void 0 ? void 0 : onDenied(submissionResponse, livenessCheckRequest);
|
|
21818
21744
|
}, [allowLivenessFailure, onDenied, submissionResponse, livenessCheckRequest]);
|
|
21819
|
-
var
|
|
21820
|
-
attempt =
|
|
21821
|
-
setAttempt =
|
|
21745
|
+
var _z = React.useState(0),
|
|
21746
|
+
attempt = _z[0],
|
|
21747
|
+
setAttempt = _z[1];
|
|
21822
21748
|
var onExitCallback = React.useCallback(function () {
|
|
21823
21749
|
setAttempt(function (n) {
|
|
21824
21750
|
return n + 1;
|
|
@@ -21866,10 +21792,8 @@
|
|
|
21866
21792
|
}, [livenessCheckRequest, onExitAfterFailure, releaseCameraAccess, releaseCameraAccessOnExit, submissionResponse]);
|
|
21867
21793
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(InvisibleCanvas, {
|
|
21868
21794
|
ref: resizeCanvas
|
|
21869
|
-
}), /*#__PURE__*/React.createElement(
|
|
21870
|
-
className:
|
|
21871
|
-
}, renderCameraFeed && ( /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
21872
|
-
className: (_d = classNames.capture) === null || _d === void 0 ? void 0 : _d.cameraFeed
|
|
21795
|
+
}), renderCameraFeed && ( /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
21796
|
+
className: (_b = classNames.capture) === null || _b === void 0 ? void 0 : _b.cameraFeed
|
|
21873
21797
|
})), captureState !== 'LOADING' && function () {
|
|
21874
21798
|
switch (captureState) {
|
|
21875
21799
|
case 'CAPTURING':
|
|
@@ -21919,7 +21843,7 @@
|
|
|
21919
21843
|
default:
|
|
21920
21844
|
return null;
|
|
21921
21845
|
}
|
|
21922
|
-
}()
|
|
21846
|
+
}(), /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
21923
21847
|
key: attempt,
|
|
21924
21848
|
mode: loadingOverlayMode,
|
|
21925
21849
|
customOverlayContent: customOverlayContent,
|
|
@@ -22046,11 +21970,11 @@
|
|
|
22046
21970
|
}
|
|
22047
21971
|
}, verbiage.captureBtnText)))));
|
|
22048
21972
|
};
|
|
22049
|
-
var Inner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
22050
|
-
var Heading$4 = styled.h3(templateObject_2$
|
|
21973
|
+
var Inner$2 = styled(OverlayInner$2)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
21974
|
+
var Heading$4 = styled.h3(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
22051
21975
|
var Description = styled.p(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
22052
|
-
var StyledButtonsRow$4 = styled(ButtonsRow)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
22053
|
-
var templateObject_1$
|
|
21976
|
+
var StyledButtonsRow$4 = styled(ButtonsRow$2)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
21977
|
+
var templateObject_1$d, templateObject_2$b, templateObject_3$a, templateObject_4$5;
|
|
22054
21978
|
|
|
22055
21979
|
var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
|
|
22056
21980
|
var documents = _a.documents,
|
|
@@ -22968,7 +22892,7 @@
|
|
|
22968
22892
|
});
|
|
22969
22893
|
}
|
|
22970
22894
|
|
|
22971
|
-
var SignaturePaperBacking = styled.div(templateObject_1$
|
|
22895
|
+
var SignaturePaperBacking = styled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n ", "\n ", "\n"], ["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n ", "\n ", "\n"])), function (props) {
|
|
22972
22896
|
var _a, _b;
|
|
22973
22897
|
return ((_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.background) ? "background: ".concat((_b = props.theme.signatureCapture) === null || _b === void 0 ? void 0 : _b.background, ";") : "";
|
|
22974
22898
|
}, function (props) {
|
|
@@ -22978,7 +22902,7 @@
|
|
|
22978
22902
|
var _a, _b;
|
|
22979
22903
|
return ((_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.backgroundPosition) ? "background-position: ".concat((_b = props.theme.signatureCapture) === null || _b === void 0 ? void 0 : _b.backgroundPosition, ";") : "";
|
|
22980
22904
|
});
|
|
22981
|
-
var SignatureCanvasContainer$1 = styled.div(templateObject_2$
|
|
22905
|
+
var SignatureCanvasContainer$1 = styled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"], ["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"])));
|
|
22982
22906
|
var SignaturePad = styled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n"], ["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n"])), function (props) {
|
|
22983
22907
|
var _a, _b, _c;
|
|
22984
22908
|
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.background) !== null && _c !== void 0 ? _c : 'rgba(255, 255, 255, 0.5)';
|
|
@@ -22989,8 +22913,35 @@
|
|
|
22989
22913
|
var _a, _b, _c;
|
|
22990
22914
|
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.borderRadius) !== null && _c !== void 0 ? _c : '16px';
|
|
22991
22915
|
});
|
|
22992
|
-
var SignatureButtonsContainer = styled(ButtonsRow)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n flex-grow: 0;\n padding-top: 12px;\n display: flex;\n z-index: 1000;\n position: relative;\n"], ["\n flex-grow: 0;\n padding-top: 12px;\n display: flex;\n z-index: 1000;\n position: relative;\n"])));
|
|
22993
|
-
var templateObject_1$
|
|
22916
|
+
var SignatureButtonsContainer = styled(ButtonsRow$2)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n flex-grow: 0;\n padding-top: 12px;\n display: flex;\n z-index: 1000;\n position: relative;\n"], ["\n flex-grow: 0;\n padding-top: 12px;\n display: flex;\n z-index: 1000;\n position: relative;\n"])));
|
|
22917
|
+
var templateObject_1$c, templateObject_2$a, templateObject_3$9, templateObject_4$4;
|
|
22918
|
+
|
|
22919
|
+
var SdkPage = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
22920
|
+
var children = _a.children,
|
|
22921
|
+
className = _a.className,
|
|
22922
|
+
_b = _a.heightOffset,
|
|
22923
|
+
heightOffset = _b === void 0 ? 0 : _b,
|
|
22924
|
+
style = _a.style,
|
|
22925
|
+
onClick = _a.onClick;
|
|
22926
|
+
var theme = styled.useTheme();
|
|
22927
|
+
return /*#__PURE__*/React.createElement(SdkPageOuter, {
|
|
22928
|
+
ref: ref,
|
|
22929
|
+
style: style,
|
|
22930
|
+
onClick: onClick,
|
|
22931
|
+
className: className,
|
|
22932
|
+
"$heightOffset": heightOffset
|
|
22933
|
+
}, theme.header && /*#__PURE__*/React.createElement(theme.header, null), /*#__PURE__*/React.createElement(SdkPageInner, null, children), theme.footer && /*#__PURE__*/React.createElement(theme.footer, null));
|
|
22934
|
+
});
|
|
22935
|
+
SdkPage.displayName = 'SdkPage';
|
|
22936
|
+
var SdkPageOuter = styled.div.attrs({
|
|
22937
|
+
className: 'sdk-page-outer'
|
|
22938
|
+
})(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n overflow: hidden;\n\n ", "\n\n ", "\n"], ["\n display: flex;\n flex-direction: column;\n overflow: hidden;\n\n ", "\n\n ", "\n"])), function (props) {
|
|
22939
|
+
return props.theme.fontFamily ? "font-family: ".concat(props.theme.fontFamily, ";") : "";
|
|
22940
|
+
}, function (props) {
|
|
22941
|
+
return props.theme.isFullscreen === false ? "" : "\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ";
|
|
22942
|
+
});
|
|
22943
|
+
var SdkPageInner = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n flex: 1;\n position: relative;\n overflow: hidden;\n"], ["\n flex: 1;\n position: relative;\n overflow: hidden;\n"])));
|
|
22944
|
+
var templateObject_1$b, templateObject_2$9;
|
|
22994
22945
|
|
|
22995
22946
|
var SignatureCapture = function SignatureCapture(_a) {
|
|
22996
22947
|
var onAccept = _a.onAccept,
|
|
@@ -23025,7 +22976,7 @@
|
|
|
23025
22976
|
});
|
|
23026
22977
|
});
|
|
23027
22978
|
}
|
|
23028
|
-
return /*#__PURE__*/React.createElement(
|
|
22979
|
+
return /*#__PURE__*/React.createElement(SdkPage, {
|
|
23029
22980
|
className: classNames.container
|
|
23030
22981
|
}, /*#__PURE__*/React.createElement(SignaturePaperBacking, {
|
|
23031
22982
|
className: classNames.inner
|
|
@@ -23457,8 +23408,11 @@
|
|
|
23457
23408
|
signaturePad = _h.signaturePad,
|
|
23458
23409
|
onAcceptClicked = _h.onAcceptClicked;
|
|
23459
23410
|
var _j = React.useState(true),
|
|
23460
|
-
|
|
23461
|
-
|
|
23411
|
+
signaturePadEmpty = _j[0],
|
|
23412
|
+
setSignaturePadEmpty = _j[1];
|
|
23413
|
+
var _k = React.useState(false),
|
|
23414
|
+
signatureValid = _k[0],
|
|
23415
|
+
setSignatureValid = _k[1];
|
|
23462
23416
|
var verbiage = useTranslations(rawVerbiage, {
|
|
23463
23417
|
clearSignatureBtnText: 'Clear',
|
|
23464
23418
|
acceptSignatureBtnText: 'Accept'
|
|
@@ -23470,7 +23424,9 @@
|
|
|
23470
23424
|
className: classNames.signatureCanvas
|
|
23471
23425
|
};
|
|
23472
23426
|
}, [classNames.signatureCanvas, height, width]);
|
|
23473
|
-
var
|
|
23427
|
+
var isSigning = requestedAction === 'CAPTURE_SIGNATURE';
|
|
23428
|
+
var canClear = isSigning && !signaturePadEmpty;
|
|
23429
|
+
var canSubmit = isSigning && signatureValid;
|
|
23474
23430
|
return /*#__PURE__*/React.createElement(Container$1, {
|
|
23475
23431
|
className: classNames.container
|
|
23476
23432
|
}, /*#__PURE__*/React.createElement(Inner$1, {
|
|
@@ -23494,23 +23450,27 @@
|
|
|
23494
23450
|
}, /*#__PURE__*/React.createElement(SignatureCanvas, {
|
|
23495
23451
|
ref: signaturePad,
|
|
23496
23452
|
canvasProps: canvasProps,
|
|
23453
|
+
onBegin: function onBegin() {
|
|
23454
|
+
return setSignaturePadEmpty(false);
|
|
23455
|
+
},
|
|
23497
23456
|
onEnd: function onEnd() {
|
|
23498
23457
|
var _a, _b;
|
|
23499
23458
|
var strokes = (_b = (_a = signaturePad === null || signaturePad === void 0 ? void 0 : signaturePad.current) === null || _a === void 0 ? void 0 : _a.toData()) !== null && _b !== void 0 ? _b : [];
|
|
23500
23459
|
var points = strokes.flatMap(function (point) {
|
|
23501
23460
|
return point;
|
|
23502
23461
|
});
|
|
23503
|
-
|
|
23462
|
+
setSignatureValid(points.length >= minSignaturePadPoints);
|
|
23504
23463
|
}
|
|
23505
23464
|
})), /*#__PURE__*/React.createElement(SignatureButtonsContainer, {
|
|
23506
23465
|
className: classNames.signatureButtonsRow
|
|
23507
23466
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
23508
23467
|
variant: "secondary",
|
|
23509
23468
|
className: classNames.clearSignatureBtn,
|
|
23510
|
-
disabled: !
|
|
23469
|
+
disabled: !canClear,
|
|
23511
23470
|
onClick: function onClick() {
|
|
23512
23471
|
var _a;
|
|
23513
|
-
|
|
23472
|
+
setSignaturePadEmpty(true);
|
|
23473
|
+
setSignatureValid(false);
|
|
23514
23474
|
(_a = signaturePad === null || signaturePad === void 0 ? void 0 : signaturePad.current) === null || _a === void 0 ? void 0 : _a.clear();
|
|
23515
23475
|
onClearSignaturePadClicked === null || onClearSignaturePadClicked === void 0 ? void 0 : onClearSignaturePadClicked();
|
|
23516
23476
|
},
|
|
@@ -23523,7 +23483,7 @@
|
|
|
23523
23483
|
finished: true
|
|
23524
23484
|
}, verbiage.acceptSignatureBtnText))))));
|
|
23525
23485
|
}
|
|
23526
|
-
var Container$1 = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n
|
|
23486
|
+
var Container$1 = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
|
|
23527
23487
|
var _a;
|
|
23528
23488
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
23529
23489
|
});
|
|
@@ -23539,35 +23499,34 @@
|
|
|
23539
23499
|
|
|
23540
23500
|
var DEFAULT_MIN_SIGNATURE_PAD_POINTS = 10;
|
|
23541
23501
|
var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
23542
|
-
var _b;
|
|
23543
23502
|
var onVideoCaptured = _a.onVideoCaptured,
|
|
23544
23503
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
23545
23504
|
onExit = _a.onExit,
|
|
23546
|
-
|
|
23547
|
-
restartVideoOnSignaturePadCleared =
|
|
23505
|
+
_b = _a.restartVideoOnSignaturePadCleared,
|
|
23506
|
+
restartVideoOnSignaturePadCleared = _b === void 0 ? true : _b,
|
|
23548
23507
|
guidesComponent = _a.guidesComponent,
|
|
23549
|
-
|
|
23550
|
-
minSignaturePadPoints =
|
|
23551
|
-
|
|
23552
|
-
classNames =
|
|
23553
|
-
|
|
23554
|
-
colors =
|
|
23555
|
-
|
|
23556
|
-
rawVerbiage =
|
|
23557
|
-
|
|
23558
|
-
debugMode =
|
|
23508
|
+
_c = _a.minSignaturePadPoints,
|
|
23509
|
+
minSignaturePadPoints = _c === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _c,
|
|
23510
|
+
_d = _a.classNames,
|
|
23511
|
+
classNames = _d === void 0 ? {} : _d,
|
|
23512
|
+
_e = _a.colors,
|
|
23513
|
+
colors = _e === void 0 ? {} : _e,
|
|
23514
|
+
_f = _a.verbiage,
|
|
23515
|
+
rawVerbiage = _f === void 0 ? {} : _f,
|
|
23516
|
+
_g = _a.debugMode,
|
|
23517
|
+
debugMode = _g === void 0 ? false : _g;
|
|
23559
23518
|
var camera = useCameraStore(function (state) {
|
|
23560
23519
|
return state.camera;
|
|
23561
23520
|
});
|
|
23562
23521
|
var onPredictionMade = React.useContext(SelfieGuidanceModelsContext).onPredictionMade;
|
|
23563
|
-
var
|
|
23564
|
-
signatureData =
|
|
23565
|
-
signatureDataUrl =
|
|
23566
|
-
signatureVideoData =
|
|
23567
|
-
startRecording =
|
|
23568
|
-
stopRecording =
|
|
23569
|
-
clearRecordedData =
|
|
23570
|
-
isRecording =
|
|
23522
|
+
var _h = useVideoSignatureContext(),
|
|
23523
|
+
signatureData = _h.signatureData,
|
|
23524
|
+
signatureDataUrl = _h.signatureDataUrl,
|
|
23525
|
+
signatureVideoData = _h.signatureVideoData,
|
|
23526
|
+
startRecording = _h.startRecording,
|
|
23527
|
+
stopRecording = _h.stopRecording,
|
|
23528
|
+
clearRecordedData = _h.clearRecordedData,
|
|
23529
|
+
isRecording = _h.isRecording;
|
|
23571
23530
|
React.useEffect(function () {
|
|
23572
23531
|
startRecording();
|
|
23573
23532
|
return stopRecording;
|
|
@@ -23582,9 +23541,9 @@
|
|
|
23582
23541
|
onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
|
|
23583
23542
|
}
|
|
23584
23543
|
}, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
|
|
23585
|
-
var
|
|
23586
|
-
numFramesWithoutFaces =
|
|
23587
|
-
setNumFramesWithoutFaces =
|
|
23544
|
+
var _j = React.useState(0),
|
|
23545
|
+
numFramesWithoutFaces = _j[0],
|
|
23546
|
+
setNumFramesWithoutFaces = _j[1];
|
|
23588
23547
|
React.useEffect(function () {
|
|
23589
23548
|
onPredictionMade(function (_a) {
|
|
23590
23549
|
var face = _a.face;
|
|
@@ -23599,8 +23558,8 @@
|
|
|
23599
23558
|
}
|
|
23600
23559
|
}, [numFramesWithoutFaces, onFaceNotDetected]);
|
|
23601
23560
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : VideoSignatureGuides;
|
|
23602
|
-
return /*#__PURE__*/React.createElement(
|
|
23603
|
-
className:
|
|
23561
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
23562
|
+
className: classNames.container
|
|
23604
23563
|
}, verbiage.guidanceMessageText && ( /*#__PURE__*/React.createElement(GuidanceMessageContainer, {
|
|
23605
23564
|
"$top": "10vh",
|
|
23606
23565
|
className: classNames.guidanceMessageContainer
|
|
@@ -23658,7 +23617,7 @@
|
|
|
23658
23617
|
style: {
|
|
23659
23618
|
display: 'none'
|
|
23660
23619
|
}
|
|
23661
|
-
})), /*#__PURE__*/React.createElement(ButtonsRow, {
|
|
23620
|
+
})), /*#__PURE__*/React.createElement(ButtonsRow$2, {
|
|
23662
23621
|
className: classNames.buttonsRow
|
|
23663
23622
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
23664
23623
|
variant: "warning",
|
|
@@ -23678,57 +23637,56 @@
|
|
|
23678
23637
|
var templateObject_1$8;
|
|
23679
23638
|
|
|
23680
23639
|
var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
23681
|
-
var _b;
|
|
23682
23640
|
var onComplete = _a.onComplete,
|
|
23683
23641
|
onVideoCaptured = _a.onVideoCaptured,
|
|
23684
23642
|
onRetryClicked = _a.onRetryClicked,
|
|
23685
23643
|
onExitCapture = _a.onExitCapture,
|
|
23686
23644
|
onUserCancel = _a.onUserCancel,
|
|
23687
23645
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
23688
|
-
|
|
23689
|
-
loadingOverlayMode =
|
|
23646
|
+
_b = _a.loadingOverlayMode,
|
|
23647
|
+
loadingOverlayMode = _b === void 0 ? 'default' : _b,
|
|
23690
23648
|
customOverlayContent = _a.customOverlayContent,
|
|
23691
|
-
|
|
23692
|
-
skipSuccessScreen =
|
|
23693
|
-
|
|
23694
|
-
captureAudio =
|
|
23695
|
-
|
|
23696
|
-
minSignaturePadPoints =
|
|
23697
|
-
|
|
23698
|
-
allowSignatureAfterLivenessCheckFailure =
|
|
23699
|
-
|
|
23700
|
-
restartVideoOnSignaturePadCleared =
|
|
23649
|
+
_c = _a.skipSuccessScreen,
|
|
23650
|
+
skipSuccessScreen = _c === void 0 ? false : _c,
|
|
23651
|
+
_d = _a.captureAudio,
|
|
23652
|
+
captureAudio = _d === void 0 ? false : _d,
|
|
23653
|
+
_e = _a.minSignaturePadPoints,
|
|
23654
|
+
minSignaturePadPoints = _e === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _e,
|
|
23655
|
+
_f = _a.allowSignatureAfterLivenessCheckFailure,
|
|
23656
|
+
allowSignatureAfterLivenessCheckFailure = _f === void 0 ? false : _f,
|
|
23657
|
+
_g = _a.restartVideoOnSignaturePadCleared,
|
|
23658
|
+
restartVideoOnSignaturePadCleared = _g === void 0 ? true : _g,
|
|
23701
23659
|
faceLivenessProps = _a.faceLivenessProps,
|
|
23702
|
-
|
|
23703
|
-
assets =
|
|
23704
|
-
|
|
23705
|
-
classNames =
|
|
23706
|
-
|
|
23707
|
-
colors =
|
|
23708
|
-
|
|
23709
|
-
verbiage =
|
|
23710
|
-
|
|
23711
|
-
debugMode =
|
|
23712
|
-
var
|
|
23713
|
-
selfieImage =
|
|
23714
|
-
setSelfieImage =
|
|
23715
|
-
setSignatureData =
|
|
23716
|
-
setSignatureVideoUrl =
|
|
23717
|
-
logSelfieCaptureAttempt =
|
|
23660
|
+
_h = _a.assets,
|
|
23661
|
+
assets = _h === void 0 ? {} : _h,
|
|
23662
|
+
_j = _a.classNames,
|
|
23663
|
+
classNames = _j === void 0 ? {} : _j,
|
|
23664
|
+
_k = _a.colors,
|
|
23665
|
+
colors = _k === void 0 ? {} : _k,
|
|
23666
|
+
_l = _a.verbiage,
|
|
23667
|
+
verbiage = _l === void 0 ? {} : _l,
|
|
23668
|
+
_m = _a.debugMode,
|
|
23669
|
+
debugMode = _m === void 0 ? false : _m;
|
|
23670
|
+
var _o = React.useContext(SubmissionContext),
|
|
23671
|
+
selfieImage = _o.selfieImage,
|
|
23672
|
+
setSelfieImage = _o.setSelfieImage,
|
|
23673
|
+
setSignatureData = _o.setSignatureData,
|
|
23674
|
+
setSignatureVideoUrl = _o.setSignatureVideoUrl,
|
|
23675
|
+
logSelfieCaptureAttempt = _o.logSelfieCaptureAttempt;
|
|
23718
23676
|
var cameraAccessDenied = useCameraStore(useShallow(function (state) {
|
|
23719
23677
|
return {
|
|
23720
23678
|
cameraAccessDenied: state.cameraAccessDenied
|
|
23721
23679
|
};
|
|
23722
23680
|
})).cameraAccessDenied;
|
|
23723
|
-
var
|
|
23724
|
-
captureState =
|
|
23725
|
-
setCaptureState =
|
|
23681
|
+
var _p = React.useState('CHECKING_LIVENESS'),
|
|
23682
|
+
captureState = _p[0],
|
|
23683
|
+
setCaptureState = _p[1];
|
|
23726
23684
|
var operationStartedAt = React.useRef();
|
|
23727
23685
|
var captureStartedAt = React.useRef();
|
|
23728
23686
|
var captureEndedAt = React.useRef();
|
|
23729
|
-
var
|
|
23730
|
-
start =
|
|
23731
|
-
stop =
|
|
23687
|
+
var _q = React.useContext(SelfieGuidanceModelsContext),
|
|
23688
|
+
start = _q.start,
|
|
23689
|
+
stop = _q.stop;
|
|
23732
23690
|
React.useEffect(function () {
|
|
23733
23691
|
operationStartedAt.current = new Date();
|
|
23734
23692
|
}, []);
|
|
@@ -23764,9 +23722,9 @@
|
|
|
23764
23722
|
setSelfieImage(selfieFromRequest);
|
|
23765
23723
|
}
|
|
23766
23724
|
}, [logCaptureMetadata, onFaceLivenessSuccessProp, selfieImage, setSelfieImage]);
|
|
23767
|
-
var
|
|
23768
|
-
signatureImageUrl =
|
|
23769
|
-
setSignatureImageUrl =
|
|
23725
|
+
var _r = React.useState(null),
|
|
23726
|
+
signatureImageUrl = _r[0],
|
|
23727
|
+
setSignatureImageUrl = _r[1];
|
|
23770
23728
|
var onSignatureCaptureCompleted = React.useCallback(function (videoData, signatureData, signatureImageData) {
|
|
23771
23729
|
setSignatureData(signatureData);
|
|
23772
23730
|
setSignatureVideoUrl(URL.createObjectURL(videoData));
|
|
@@ -23777,9 +23735,9 @@
|
|
|
23777
23735
|
var onSignatureCaptureFacesNotDetected = React.useCallback(function () {
|
|
23778
23736
|
setCaptureState('CHECKING_LIVENESS');
|
|
23779
23737
|
}, []);
|
|
23780
|
-
var
|
|
23781
|
-
attempt =
|
|
23782
|
-
setAttempt =
|
|
23738
|
+
var _s = React.useState(0),
|
|
23739
|
+
attempt = _s[0],
|
|
23740
|
+
setAttempt = _s[1];
|
|
23783
23741
|
var onRetry = React.useCallback(function () {
|
|
23784
23742
|
onRetryClicked === null || onRetryClicked === void 0 ? void 0 : onRetryClicked();
|
|
23785
23743
|
setAttempt(function (n) {
|
|
@@ -23816,8 +23774,6 @@
|
|
|
23816
23774
|
}, [faceLivenessOnLoadingOverlayDismissed, onLoadingOverlayDismissed]);
|
|
23817
23775
|
return /*#__PURE__*/React.createElement(VideoSignatureContextProvider, {
|
|
23818
23776
|
captureAudio: captureAudio
|
|
23819
|
-
}, /*#__PURE__*/React.createElement(PageContainer, {
|
|
23820
|
-
className: "flex ".concat((_b = classNames === null || classNames === void 0 ? void 0 : classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
23821
23777
|
}, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
23822
23778
|
className: classNames.cameraFeed
|
|
23823
23779
|
}), function () {
|
|
@@ -23867,7 +23823,7 @@
|
|
|
23867
23823
|
default:
|
|
23868
23824
|
return null;
|
|
23869
23825
|
}
|
|
23870
|
-
}())
|
|
23826
|
+
}());
|
|
23871
23827
|
};
|
|
23872
23828
|
function VideoSignatureWizardGuides(_a) {
|
|
23873
23829
|
var status = _a.status,
|
|
@@ -24033,7 +23989,7 @@
|
|
|
24033
23989
|
"$background": (_y = (_x = theme.idVideoCapture) === null || _x === void 0 ? void 0 : _x.idCardGuides) === null || _y === void 0 ? void 0 : _y.instructionsBackgroundColor
|
|
24034
23990
|
}, instructionText))))));
|
|
24035
23991
|
};
|
|
24036
|
-
var Container = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n
|
|
23992
|
+
var Container = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
|
|
24037
23993
|
var _a;
|
|
24038
23994
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
24039
23995
|
});
|
|
@@ -24041,7 +23997,7 @@
|
|
|
24041
23997
|
var FaceGuideContainer = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n position: relative;\n height: 65%;\n"], ["\n position: relative;\n height: 65%;\n"])));
|
|
24042
23998
|
var IdCardGuideContainer = styled.div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n margin: 0 auto;\n position: relative;\n max-width: 100%;\n height: 35%;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n margin: 0 auto;\n position: relative;\n max-width: 100%;\n height: 35%;\n"])));
|
|
24043
23999
|
var IdCardGuideInner = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n width: 100%;\n"], ["\n position: relative;\n height: 100%;\n width: 100%;\n"])));
|
|
24044
|
-
var IdCardGuideInstructionsContainer = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n padding: 0 40px;\n position:
|
|
24000
|
+
var IdCardGuideInstructionsContainer = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n padding: 0 40px;\n position: absolute;\n bottom: 14px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"], ["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n padding: 0 40px;\n position: absolute;\n bottom: 14px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"])));
|
|
24045
24001
|
var IdCardGuideInstructions = styled(GuidanceMessage)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-content: center;\n margin: 12px auto;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"], ["\n align-content: center;\n margin: 12px auto;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"])));
|
|
24046
24002
|
var templateObject_1$7, templateObject_2$7, templateObject_3$7, templateObject_4$2, templateObject_5$1, templateObject_6$1, templateObject_7;
|
|
24047
24003
|
|
|
@@ -24133,7 +24089,7 @@
|
|
|
24133
24089
|
var _a, _b, _c, _d, _e, _f;
|
|
24134
24090
|
return ((_c = (_b = (_a = props.theme.idVideoCapture) === null || _a === void 0 ? void 0 : _a.readTextPrompt) === null || _b === void 0 ? void 0 : _b.prompt) === null || _c === void 0 ? void 0 : _c.borderRadius) ? "border-radius: ".concat((_f = (_e = (_d = props.theme.idVideoCapture) === null || _d === void 0 ? void 0 : _d.readTextPrompt) === null || _e === void 0 ? void 0 : _e.prompt) === null || _f === void 0 ? void 0 : _f.borderRadius, ";") : "";
|
|
24135
24091
|
});
|
|
24136
|
-
var ReadTextPromptButtonsRow = styled(ButtonsRow)(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n margin: 32px auto auto;\n gap: 20px;\n"], ["\n margin: 32px auto auto;\n gap: 20px;\n"])));
|
|
24092
|
+
var ReadTextPromptButtonsRow = styled(ButtonsRow$2)(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n margin: 32px auto auto;\n gap: 20px;\n"], ["\n margin: 32px auto auto;\n gap: 20px;\n"])));
|
|
24137
24093
|
var ReadTextPromptTimeRemaining = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n padding: 20px;\n\n ", ";\n ", ";\n ", ";\n"], ["\n padding: 20px;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
|
|
24138
24094
|
var _a, _b, _c, _d, _e, _f;
|
|
24139
24095
|
return ((_c = (_b = (_a = props.theme.idVideoCapture) === null || _a === void 0 ? void 0 : _a.readTextPrompt) === null || _b === void 0 ? void 0 : _b.timeRemaining) === null || _c === void 0 ? void 0 : _c.backgroundColor) ? "background: ".concat((_f = (_e = (_d = props.theme.idVideoCapture) === null || _d === void 0 ? void 0 : _d.readTextPrompt) === null || _e === void 0 ? void 0 : _e.timeRemaining) === null || _f === void 0 ? void 0 : _f.backgroundColor, ";") : "";
|
|
@@ -24182,103 +24138,103 @@
|
|
|
24182
24138
|
flipShortcutThreshold: 0.7
|
|
24183
24139
|
};
|
|
24184
24140
|
var IdVideoCapture = function IdVideoCapture(_a) {
|
|
24185
|
-
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u
|
|
24141
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
|
24186
24142
|
var onComplete = _a.onComplete,
|
|
24187
24143
|
onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
|
|
24188
24144
|
onIdBackImageCaptured = _a.onIdBackImageCaptured,
|
|
24189
24145
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
24190
24146
|
onRecordingFailed = _a.onRecordingFailed,
|
|
24191
24147
|
onExitCapture = _a.onExitCapture,
|
|
24192
|
-
|
|
24193
|
-
idCaptureModelsEnabled =
|
|
24194
|
-
|
|
24195
|
-
idDocumentType =
|
|
24196
|
-
|
|
24197
|
-
idCaptureGuideImages =
|
|
24198
|
-
|
|
24199
|
-
idCardFrontDelay =
|
|
24200
|
-
|
|
24201
|
-
videoIdCaptureThresholds =
|
|
24202
|
-
|
|
24203
|
-
skipShowIdCardBack =
|
|
24204
|
-
|
|
24205
|
-
captureCountdownSeconds =
|
|
24148
|
+
_v = _a.idCaptureModelsEnabled,
|
|
24149
|
+
idCaptureModelsEnabled = _v === void 0 ? true : _v,
|
|
24150
|
+
_w = _a.idDocumentType,
|
|
24151
|
+
idDocumentType = _w === void 0 ? 'idCard' : _w,
|
|
24152
|
+
_x = _a.idCaptureGuideImages,
|
|
24153
|
+
idCaptureGuideImages = _x === void 0 ? defaultIdCaptureGuideImages : _x,
|
|
24154
|
+
_y = _a.idCardFrontDelay,
|
|
24155
|
+
idCardFrontDelay = _y === void 0 ? 1000 : _y,
|
|
24156
|
+
_z = _a.videoIdCaptureThresholds,
|
|
24157
|
+
videoIdCaptureThresholds = _z === void 0 ? defaultVideoIdCaptureThresholds : _z,
|
|
24158
|
+
_0 = _a.skipShowIdCardBack,
|
|
24159
|
+
skipShowIdCardBack = _0 === void 0 ? false : _0,
|
|
24160
|
+
_1 = _a.captureCountdownSeconds,
|
|
24161
|
+
captureCountdownSeconds = _1 === void 0 ? 3 : _1,
|
|
24206
24162
|
readTextPrompt = _a.readTextPrompt,
|
|
24207
|
-
|
|
24208
|
-
readTextTimeoutDurationMs =
|
|
24209
|
-
|
|
24210
|
-
readTextMinReadingMs =
|
|
24211
|
-
|
|
24212
|
-
disableFaceDetectionWhileAudioCapture =
|
|
24213
|
-
|
|
24214
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
24215
|
-
|
|
24216
|
-
mergeAVStreams =
|
|
24217
|
-
|
|
24218
|
-
classNames =
|
|
24219
|
-
|
|
24220
|
-
colors =
|
|
24221
|
-
|
|
24222
|
-
rawVerbiage =
|
|
24223
|
-
|
|
24224
|
-
debugMode =
|
|
24225
|
-
var
|
|
24226
|
-
ref =
|
|
24227
|
-
|
|
24228
|
-
width =
|
|
24229
|
-
|
|
24230
|
-
height =
|
|
24231
|
-
var
|
|
24232
|
-
camera =
|
|
24233
|
-
videoRef =
|
|
24234
|
-
videoLoaded =
|
|
24235
|
-
cameraReady =
|
|
24236
|
-
microphoneReady =
|
|
24237
|
-
audioStream =
|
|
24238
|
-
isRearFacing =
|
|
24239
|
-
releaseCameraAccess =
|
|
24240
|
-
var
|
|
24241
|
-
detectedObjects =
|
|
24242
|
-
setDetectedObjects =
|
|
24243
|
-
var
|
|
24244
|
-
face =
|
|
24245
|
-
setFace =
|
|
24246
|
-
var
|
|
24247
|
-
idModelsReady =
|
|
24248
|
-
startIdModels =
|
|
24249
|
-
stopIdModels =
|
|
24250
|
-
onIdPredictionMade =
|
|
24251
|
-
setThresholds =
|
|
24252
|
-
setRequiredDocumentType =
|
|
24253
|
-
setDocumentDetectionBoundaries =
|
|
24254
|
-
bestFrameDetails =
|
|
24255
|
-
resetBestFrame =
|
|
24256
|
-
idModelError =
|
|
24257
|
-
var
|
|
24258
|
-
videoStartsAt =
|
|
24259
|
-
setVideoStartsAt =
|
|
24260
|
-
var
|
|
24261
|
-
setIdCaptureVideoAudioStartsAt =
|
|
24262
|
-
setExpectedAudioText =
|
|
24263
|
-
var
|
|
24264
|
-
startSelfieGuidance =
|
|
24265
|
-
stopSelfieGuidance =
|
|
24266
|
-
onSelfiePredictionMade =
|
|
24267
|
-
selfieModelError =
|
|
24268
|
-
var
|
|
24269
|
-
isRecordingVideo =
|
|
24270
|
-
startRecordingVideo =
|
|
24271
|
-
startRecordingAudio =
|
|
24272
|
-
stopRecordingVideo =
|
|
24273
|
-
stopRecordingAudio =
|
|
24274
|
-
videoRecordingUnintentionallyStopped =
|
|
24275
|
-
audioRecordingUnintentionallyStopped =
|
|
24276
|
-
videoUrl =
|
|
24277
|
-
audioUrl =
|
|
24163
|
+
_2 = _a.readTextTimeoutDurationMs,
|
|
24164
|
+
readTextTimeoutDurationMs = _2 === void 0 ? 15000 : _2,
|
|
24165
|
+
_3 = _a.readTextMinReadingMs,
|
|
24166
|
+
readTextMinReadingMs = _3 === void 0 ? 10000 : _3,
|
|
24167
|
+
_4 = _a.disableFaceDetectionWhileAudioCapture,
|
|
24168
|
+
disableFaceDetectionWhileAudioCapture = _4 === void 0 ? false : _4,
|
|
24169
|
+
_5 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
24170
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _5 === void 0 ? 2000 : _5,
|
|
24171
|
+
_6 = _a.mergeAVStreams,
|
|
24172
|
+
mergeAVStreams = _6 === void 0 ? false : _6,
|
|
24173
|
+
_7 = _a.classNames,
|
|
24174
|
+
classNames = _7 === void 0 ? {} : _7,
|
|
24175
|
+
_8 = _a.colors,
|
|
24176
|
+
colors = _8 === void 0 ? {} : _8,
|
|
24177
|
+
_9 = _a.verbiage,
|
|
24178
|
+
rawVerbiage = _9 === void 0 ? {} : _9,
|
|
24179
|
+
_10 = _a.debugMode,
|
|
24180
|
+
debugMode = _10 === void 0 ? false : _10;
|
|
24181
|
+
var _11 = useResizeObserver(),
|
|
24182
|
+
ref = _11.ref,
|
|
24183
|
+
_12 = _11.width,
|
|
24184
|
+
width = _12 === void 0 ? 1 : _12,
|
|
24185
|
+
_13 = _11.height,
|
|
24186
|
+
height = _13 === void 0 ? 1 : _13;
|
|
24187
|
+
var _14 = useCameraStore(),
|
|
24188
|
+
camera = _14.camera,
|
|
24189
|
+
videoRef = _14.videoRef,
|
|
24190
|
+
videoLoaded = _14.videoLoaded,
|
|
24191
|
+
cameraReady = _14.cameraReady,
|
|
24192
|
+
microphoneReady = _14.microphoneReady,
|
|
24193
|
+
audioStream = _14.audioStream,
|
|
24194
|
+
isRearFacing = _14.isRearFacing,
|
|
24195
|
+
releaseCameraAccess = _14.releaseCameraAccess;
|
|
24196
|
+
var _15 = React.useState([]),
|
|
24197
|
+
detectedObjects = _15[0],
|
|
24198
|
+
setDetectedObjects = _15[1];
|
|
24199
|
+
var _16 = React.useState(null),
|
|
24200
|
+
face = _16[0],
|
|
24201
|
+
setFace = _16[1];
|
|
24202
|
+
var _17 = React.useContext(IdCaptureModelsContext),
|
|
24203
|
+
idModelsReady = _17.ready,
|
|
24204
|
+
startIdModels = _17.start,
|
|
24205
|
+
stopIdModels = _17.stop,
|
|
24206
|
+
onIdPredictionMade = _17.onPredictionMade,
|
|
24207
|
+
setThresholds = _17.setThresholds,
|
|
24208
|
+
setRequiredDocumentType = _17.setRequiredDocumentType,
|
|
24209
|
+
setDocumentDetectionBoundaries = _17.setDocumentDetectionBoundaries,
|
|
24210
|
+
bestFrameDetails = _17.bestFrameDetails,
|
|
24211
|
+
resetBestFrame = _17.resetBestFrame,
|
|
24212
|
+
idModelError = _17.modelError;
|
|
24213
|
+
var _18 = React.useState(null),
|
|
24214
|
+
videoStartsAt = _18[0],
|
|
24215
|
+
setVideoStartsAt = _18[1];
|
|
24216
|
+
var _19 = React.useContext(SubmissionContext),
|
|
24217
|
+
setIdCaptureVideoAudioStartsAt = _19.setIdCaptureVideoAudioStartsAt,
|
|
24218
|
+
setExpectedAudioText = _19.setExpectedAudioText;
|
|
24219
|
+
var _20 = React.useContext(SelfieGuidanceModelsContext),
|
|
24220
|
+
startSelfieGuidance = _20.start,
|
|
24221
|
+
stopSelfieGuidance = _20.stop,
|
|
24222
|
+
onSelfiePredictionMade = _20.onPredictionMade,
|
|
24223
|
+
selfieModelError = _20.error;
|
|
24224
|
+
var _21 = useVideoRecorder(camera, audioStream, mergeAVStreams),
|
|
24225
|
+
isRecordingVideo = _21.isRecordingVideo,
|
|
24226
|
+
startRecordingVideo = _21.startRecordingVideo,
|
|
24227
|
+
startRecordingAudio = _21.startRecordingAudio,
|
|
24228
|
+
stopRecordingVideo = _21.stopRecordingVideo,
|
|
24229
|
+
stopRecordingAudio = _21.stopRecordingAudio,
|
|
24230
|
+
videoRecordingUnintentionallyStopped = _21.videoRecordingUnintentionallyStopped,
|
|
24231
|
+
audioRecordingUnintentionallyStopped = _21.audioRecordingUnintentionallyStopped,
|
|
24232
|
+
videoUrl = _21.videoUrl,
|
|
24233
|
+
audioUrl = _21.audioUrl;
|
|
24278
24234
|
var countdownTimeoutRef = React.useRef(undefined);
|
|
24279
|
-
var
|
|
24280
|
-
countdownRemaining =
|
|
24281
|
-
setCountdownRemaining =
|
|
24235
|
+
var _22 = React.useState(-1),
|
|
24236
|
+
countdownRemaining = _22[0],
|
|
24237
|
+
setCountdownRemaining = _22[1];
|
|
24282
24238
|
React.useEffect(function () {
|
|
24283
24239
|
if (!isRecordingVideo && !videoUrl) {
|
|
24284
24240
|
startRecordingVideo();
|
|
@@ -24298,9 +24254,9 @@
|
|
|
24298
24254
|
onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
|
|
24299
24255
|
}
|
|
24300
24256
|
}, [audioRecordingUnintentionallyStopped, microphoneReady, onRecordingFailed, readTextPrompt, videoRecordingUnintentionallyStopped]);
|
|
24301
|
-
var
|
|
24302
|
-
requestedAction =
|
|
24303
|
-
setRequestedAction =
|
|
24257
|
+
var _23 = React.useState(idDocumentType === 'idCard' ? 'SHOW_ID_FRONT' : 'SHOW_PASSPORT'),
|
|
24258
|
+
requestedAction = _23[0],
|
|
24259
|
+
setRequestedAction = _23[1];
|
|
24304
24260
|
var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
|
|
24305
24261
|
React.useEffect(function startModelsWhenCapturing() {
|
|
24306
24262
|
if (!shouldRunIdModels) return;
|
|
@@ -24339,23 +24295,23 @@
|
|
|
24339
24295
|
bottom: 0
|
|
24340
24296
|
});
|
|
24341
24297
|
}, [setDocumentDetectionBoundaries]);
|
|
24342
|
-
var
|
|
24343
|
-
currentDetectionScore =
|
|
24344
|
-
setCurrentDetectionScore =
|
|
24345
|
-
var
|
|
24346
|
-
currentDetectedDocumentType =
|
|
24347
|
-
setCurrentDetectedDocumentType =
|
|
24298
|
+
var _24 = React.useState(0),
|
|
24299
|
+
currentDetectionScore = _24[0],
|
|
24300
|
+
setCurrentDetectionScore = _24[1];
|
|
24301
|
+
var _25 = React.useState('none'),
|
|
24302
|
+
currentDetectedDocumentType = _25[0],
|
|
24303
|
+
setCurrentDetectedDocumentType = _25[1];
|
|
24304
|
+
var _26 = React.useState(0),
|
|
24305
|
+
currentFocusScore = _26[0],
|
|
24306
|
+
setCurrentFocusScore = _26[1];
|
|
24348
24307
|
var _27 = React.useState(0),
|
|
24349
|
-
|
|
24350
|
-
|
|
24351
|
-
var _28 = React.useState(0),
|
|
24352
|
-
goodFramesCount = _28[0],
|
|
24353
|
-
setGoodFramesCount = _28[1];
|
|
24308
|
+
goodFramesCount = _27[0],
|
|
24309
|
+
setGoodFramesCount = _27[1];
|
|
24354
24310
|
var goodFramesThreshold = requestedAction === 'SHOW_PASSPORT' ? adjustedThresholds.goodFrames.passport : requestedAction === 'SHOW_ID_FRONT' ? adjustedThresholds.goodFrames.idCardFront : adjustedThresholds.goodFrames.idCardBack;
|
|
24355
24311
|
var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
|
|
24356
|
-
var
|
|
24357
|
-
isSinglePage =
|
|
24358
|
-
setIsSinglePage =
|
|
24312
|
+
var _28 = React.useState(false),
|
|
24313
|
+
isSinglePage = _28[0],
|
|
24314
|
+
setIsSinglePage = _28[1];
|
|
24359
24315
|
React.useEffect(function () {
|
|
24360
24316
|
if (!idCaptureModelsEnabled || idModelError) return;
|
|
24361
24317
|
onIdPredictionMade(function (prediction) {
|
|
@@ -24375,9 +24331,9 @@
|
|
|
24375
24331
|
} : 0);
|
|
24376
24332
|
});
|
|
24377
24333
|
}, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, adjustedThresholds.flipShortcutThreshold]);
|
|
24378
|
-
var
|
|
24379
|
-
idFrontCaptureStartedAt =
|
|
24380
|
-
setFirstGoodFrameTime =
|
|
24334
|
+
var _29 = React.useState(null),
|
|
24335
|
+
idFrontCaptureStartedAt = _29[0],
|
|
24336
|
+
setFirstGoodFrameTime = _29[1];
|
|
24381
24337
|
React.useEffect(function () {
|
|
24382
24338
|
if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
|
|
24383
24339
|
}, [goodFramesCount]);
|
|
@@ -24398,9 +24354,9 @@
|
|
|
24398
24354
|
var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
|
|
24399
24355
|
var faceBox = face === null || face === void 0 ? void 0 : face.box;
|
|
24400
24356
|
var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
|
|
24401
|
-
var
|
|
24402
|
-
countdownStartedAt =
|
|
24403
|
-
setCountdownStartedAt =
|
|
24357
|
+
var _30 = React.useState(),
|
|
24358
|
+
countdownStartedAt = _30[0],
|
|
24359
|
+
setCountdownStartedAt = _30[1];
|
|
24404
24360
|
var photoCanvas = React.useRef(null);
|
|
24405
24361
|
var frameLock = React.useRef(false);
|
|
24406
24362
|
var captureFrame = React.useCallback(function () {
|
|
@@ -24510,9 +24466,9 @@
|
|
|
24510
24466
|
stopSelfieGuidance();
|
|
24511
24467
|
};
|
|
24512
24468
|
}, [startSelfieGuidance, stopSelfieGuidance]);
|
|
24513
|
-
var
|
|
24514
|
-
numFramesWithoutFaces =
|
|
24515
|
-
setNumFramesWithoutFaces =
|
|
24469
|
+
var _31 = React.useState(0),
|
|
24470
|
+
numFramesWithoutFaces = _31[0],
|
|
24471
|
+
setNumFramesWithoutFaces = _31[1];
|
|
24516
24472
|
onSelfiePredictionMade(f(React.useCallback(function (_a) {
|
|
24517
24473
|
var face = _a.face;
|
|
24518
24474
|
if (selfieModelError) return;
|
|
@@ -24528,12 +24484,12 @@
|
|
|
24528
24484
|
}
|
|
24529
24485
|
}, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
|
|
24530
24486
|
var theme = styled.useTheme();
|
|
24531
|
-
var
|
|
24487
|
+
var _32 = useTranslations(rawVerbiage, {
|
|
24532
24488
|
faceNotCenteredText: 'Please move your face to the center...',
|
|
24533
24489
|
captureBtnText: 'Capture'
|
|
24534
24490
|
}),
|
|
24535
|
-
captureBtnText =
|
|
24536
|
-
faceNotCenteredText =
|
|
24491
|
+
captureBtnText = _32.captureBtnText,
|
|
24492
|
+
faceNotCenteredText = _32.faceNotCenteredText;
|
|
24537
24493
|
var debugScalingDetails = useDebugScalingDetails({
|
|
24538
24494
|
enabled: debugMode,
|
|
24539
24495
|
pageWidth: width,
|
|
@@ -24543,9 +24499,9 @@
|
|
|
24543
24499
|
});
|
|
24544
24500
|
var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK', 'SHOW_PASSPORT'].includes(requestedAction);
|
|
24545
24501
|
var guidanceText = !faceCentered ? faceNotCenteredText : undefined;
|
|
24546
|
-
return /*#__PURE__*/React.createElement(
|
|
24502
|
+
return /*#__PURE__*/React.createElement(SdkPage, {
|
|
24547
24503
|
ref: ref,
|
|
24548
|
-
className:
|
|
24504
|
+
className: classNames.container
|
|
24549
24505
|
}, /*#__PURE__*/React.createElement(InvisibleCanvas, {
|
|
24550
24506
|
ref: photoCanvas
|
|
24551
24507
|
}), requestedAction === 'READ_TEXT' ? ( /*#__PURE__*/React.createElement(ReadTextPrompt, {
|
|
@@ -24584,9 +24540,9 @@
|
|
|
24584
24540
|
className: classNames.guidanceMessageContainer
|
|
24585
24541
|
}, /*#__PURE__*/React.createElement(GuidanceMessage, {
|
|
24586
24542
|
className: classNames.guidanceMessage,
|
|
24587
|
-
"$background": (
|
|
24588
|
-
"$textColor": (
|
|
24589
|
-
}, guidanceText))), debugMode && ( /*#__PURE__*/React.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React.createElement(React.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React.createElement("br", null), "Best Frame Detection Score:", ' ', (
|
|
24543
|
+
"$background": (_m = (_l = (_k = theme.guidanceMessages) === null || _k === void 0 ? void 0 : _k.negative) === null || _l === void 0 ? void 0 : _l.backgroundColor) !== null && _m !== void 0 ? _m : 'red',
|
|
24544
|
+
"$textColor": (_q = (_p = (_o = theme.guidanceMessages) === null || _o === void 0 ? void 0 : _o.negative) === null || _p === void 0 ? void 0 : _p.textColor) !== null && _q !== void 0 ? _q : 'white'
|
|
24545
|
+
}, guidanceText))), debugMode && ( /*#__PURE__*/React.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React.createElement(React.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React.createElement("br", null), "Best Frame Detection Score:", ' ', (_s = (_r = bestFrameDetails.current) === null || _r === void 0 ? void 0 : _r.detectionScore) !== null && _s !== void 0 ? _s : 0, /*#__PURE__*/React.createElement("br", null), "Best Frame Focus Score: ", (_u = (_t = bestFrameDetails.current) === null || _t === void 0 ? void 0 : _t.focusScore) !== null && _u !== void 0 ? _u : 0)), countdownRemaining > 0 && capturingId && ( /*#__PURE__*/React.createElement(CountdownContainer, {
|
|
24590
24546
|
className: classNames.countdownContainer
|
|
24591
24547
|
}, /*#__PURE__*/React.createElement(Countdown, {
|
|
24592
24548
|
className: classNames.countdown
|
|
@@ -24604,9 +24560,9 @@
|
|
|
24604
24560
|
className: classNames.exitCaptureBtn
|
|
24605
24561
|
}));
|
|
24606
24562
|
};
|
|
24607
|
-
var CountdownContainer = styled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n position:
|
|
24563
|
+
var CountdownContainer = styled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 99999;\n display: flex;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 99999;\n display: flex;\n"])));
|
|
24608
24564
|
var Countdown = styled.div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n color: white;\n font-size: 64px;\n font-weight: bold;\n margin: auto;\n"], ["\n color: white;\n font-size: 64px;\n font-weight: bold;\n margin: auto;\n"])));
|
|
24609
|
-
var CaptureButtonContainer = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n position:
|
|
24565
|
+
var CaptureButtonContainer = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n position: absolute;\n bottom: 0;\n width: 100%;\n display: flex;\n z-index: 100000;\n"], ["\n position: absolute;\n bottom: 0;\n width: 100%;\n display: flex;\n z-index: 100000;\n"])));
|
|
24610
24566
|
var CaptureButton = styled(LoaderButton)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n margin: 0 auto 25px;\n"], ["\n margin: 0 auto 25px;\n"])));
|
|
24611
24567
|
function evaluateShouldSkip(value) {
|
|
24612
24568
|
if (value === true) return true;
|
|
@@ -24714,7 +24670,7 @@
|
|
|
24714
24670
|
})) : ( /*#__PURE__*/React.createElement("img", {
|
|
24715
24671
|
src: idBackImageUrl,
|
|
24716
24672
|
alt: "ID Back Image"
|
|
24717
|
-
}))), /*#__PURE__*/React.createElement(ButtonsRow, {
|
|
24673
|
+
}))), /*#__PURE__*/React.createElement(ButtonsRow$2, {
|
|
24718
24674
|
className: classNames.buttonsRow
|
|
24719
24675
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
24720
24676
|
variant: "warning",
|
|
@@ -24739,7 +24695,7 @@
|
|
|
24739
24695
|
var templateObject_1$4, templateObject_2$4, templateObject_3$4;
|
|
24740
24696
|
|
|
24741
24697
|
var VideoIdWizard = function VideoIdWizard(_a) {
|
|
24742
|
-
var _b, _c, _d, _e, _f, _g, _h, _j
|
|
24698
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
24743
24699
|
var onComplete = _a.onComplete,
|
|
24744
24700
|
onExitCapture = _a.onExitCapture,
|
|
24745
24701
|
onExitAfterFailure = _a.onExitAfterFailure,
|
|
@@ -24748,73 +24704,73 @@
|
|
|
24748
24704
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
24749
24705
|
onCameraTamperingDetected = _a.onCameraTamperingDetected,
|
|
24750
24706
|
onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
|
|
24751
|
-
|
|
24752
|
-
idCaptureProps =
|
|
24753
|
-
|
|
24754
|
-
faceLivenessProps =
|
|
24755
|
-
|
|
24756
|
-
idCaptureModelsEnabled =
|
|
24757
|
-
|
|
24758
|
-
videoIdCaptureThresholds =
|
|
24707
|
+
_k = _a.idCaptureProps,
|
|
24708
|
+
idCaptureProps = _k === void 0 ? {} : _k,
|
|
24709
|
+
_l = _a.faceLivenessProps,
|
|
24710
|
+
faceLivenessProps = _l === void 0 ? {} : _l,
|
|
24711
|
+
_m = _a.idCaptureModelsEnabled,
|
|
24712
|
+
idCaptureModelsEnabled = _m === void 0 ? true : _m,
|
|
24713
|
+
_o = _a.videoIdCaptureThresholds,
|
|
24714
|
+
videoIdCaptureThresholds = _o === void 0 ? defaultVideoIdCaptureThresholds : _o,
|
|
24759
24715
|
readTextPrompt = _a.readTextPrompt,
|
|
24760
24716
|
readTextTimeoutDurationMs = _a.readTextTimeoutDurationMs,
|
|
24761
24717
|
readTextMinReadingMs = _a.readTextMinReadingMs,
|
|
24762
|
-
|
|
24763
|
-
skipIdCapture =
|
|
24764
|
-
|
|
24765
|
-
skipShowIdCardBack =
|
|
24766
|
-
|
|
24767
|
-
skipSuccessScreen =
|
|
24768
|
-
|
|
24769
|
-
idCaptureLoadingOverlayMode =
|
|
24718
|
+
_p = _a.skipIdCapture,
|
|
24719
|
+
skipIdCapture = _p === void 0 ? false : _p,
|
|
24720
|
+
_q = _a.skipShowIdCardBack,
|
|
24721
|
+
skipShowIdCardBack = _q === void 0 ? false : _q,
|
|
24722
|
+
_r = _a.skipSuccessScreen,
|
|
24723
|
+
skipSuccessScreen = _r === void 0 ? false : _r,
|
|
24724
|
+
_s = _a.idCaptureLoadingOverlayMode,
|
|
24725
|
+
idCaptureLoadingOverlayMode = _s === void 0 ? 'default' : _s,
|
|
24770
24726
|
customOverlayContent = _a.customOverlayContent,
|
|
24771
24727
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
24772
|
-
|
|
24773
|
-
idDocumentType =
|
|
24774
|
-
|
|
24775
|
-
idCaptureGuideType =
|
|
24776
|
-
|
|
24777
|
-
idCaptureGuideImages =
|
|
24778
|
-
|
|
24779
|
-
idCapturePortraitGuidesOnMobile =
|
|
24780
|
-
|
|
24781
|
-
idCaptureRotateLoadingOverlayImageWhenPortrait =
|
|
24782
|
-
|
|
24783
|
-
idCaptureModelLoadTimeoutMs =
|
|
24784
|
-
|
|
24785
|
-
faceLivenessLoadingOverlayMode =
|
|
24786
|
-
|
|
24787
|
-
disableFaceDetectionWhileAudioCapture =
|
|
24788
|
-
|
|
24789
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
24790
|
-
|
|
24791
|
-
silentFallback =
|
|
24792
|
-
|
|
24793
|
-
mergeAVStreams =
|
|
24794
|
-
|
|
24795
|
-
assets =
|
|
24796
|
-
|
|
24797
|
-
classNames =
|
|
24798
|
-
|
|
24799
|
-
colors =
|
|
24800
|
-
|
|
24801
|
-
verbiage =
|
|
24802
|
-
|
|
24803
|
-
debugMode =
|
|
24804
|
-
var
|
|
24805
|
-
passportImage =
|
|
24806
|
-
submissionStatus =
|
|
24807
|
-
idCaptureVideoUrl =
|
|
24808
|
-
idCaptureVideoAudioUrl =
|
|
24809
|
-
idCaptureVideoIdFrontImage =
|
|
24810
|
-
idCaptureVideoIdBackImage =
|
|
24811
|
-
setIdCaptureVideoUrl =
|
|
24812
|
-
setIdCaptureVideoIdFrontImage =
|
|
24813
|
-
setIdCaptureVideoIdBackImage =
|
|
24814
|
-
setIdCaptureVideoAudioUrl =
|
|
24815
|
-
var
|
|
24816
|
-
captureState =
|
|
24817
|
-
setCaptureState =
|
|
24728
|
+
_t = _a.idDocumentType,
|
|
24729
|
+
idDocumentType = _t === void 0 ? 'idCardOrPassport' : _t,
|
|
24730
|
+
_u = _a.idCaptureGuideType,
|
|
24731
|
+
idCaptureGuideType = _u === void 0 ? 'fit' : _u,
|
|
24732
|
+
_v = _a.idCaptureGuideImages,
|
|
24733
|
+
idCaptureGuideImages = _v === void 0 ? defaultIdCaptureGuideImages : _v,
|
|
24734
|
+
_w = _a.idCapturePortraitGuidesOnMobile,
|
|
24735
|
+
idCapturePortraitGuidesOnMobile = _w === void 0 ? true : _w,
|
|
24736
|
+
_x = _a.idCaptureRotateLoadingOverlayImageWhenPortrait,
|
|
24737
|
+
idCaptureRotateLoadingOverlayImageWhenPortrait = _x === void 0 ? true : _x,
|
|
24738
|
+
_y = _a.idCaptureModelLoadTimeoutMs,
|
|
24739
|
+
idCaptureModelLoadTimeoutMs = _y === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _y,
|
|
24740
|
+
_z = _a.faceLivenessLoadingOverlayMode,
|
|
24741
|
+
faceLivenessLoadingOverlayMode = _z === void 0 ? 'default' : _z,
|
|
24742
|
+
_0 = _a.disableFaceDetectionWhileAudioCapture,
|
|
24743
|
+
disableFaceDetectionWhileAudioCapture = _0 === void 0 ? true : _0,
|
|
24744
|
+
_1 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
24745
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _1 === void 0 ? 2000 : _1,
|
|
24746
|
+
_2 = _a.silentFallback,
|
|
24747
|
+
silentFallback = _2 === void 0 ? false : _2,
|
|
24748
|
+
_3 = _a.mergeAVStreams,
|
|
24749
|
+
mergeAVStreams = _3 === void 0 ? false : _3,
|
|
24750
|
+
_4 = _a.assets,
|
|
24751
|
+
assets = _4 === void 0 ? {} : _4,
|
|
24752
|
+
_5 = _a.classNames,
|
|
24753
|
+
classNames = _5 === void 0 ? {} : _5,
|
|
24754
|
+
_6 = _a.colors,
|
|
24755
|
+
colors = _6 === void 0 ? {} : _6,
|
|
24756
|
+
_7 = _a.verbiage,
|
|
24757
|
+
verbiage = _7 === void 0 ? {} : _7,
|
|
24758
|
+
_8 = _a.debugMode,
|
|
24759
|
+
debugMode = _8 === void 0 ? false : _8;
|
|
24760
|
+
var _9 = React.useContext(SubmissionContext),
|
|
24761
|
+
passportImage = _9.passportImage,
|
|
24762
|
+
submissionStatus = _9.submissionStatus,
|
|
24763
|
+
idCaptureVideoUrl = _9.idCaptureVideoUrl,
|
|
24764
|
+
idCaptureVideoAudioUrl = _9.idCaptureVideoAudioUrl,
|
|
24765
|
+
idCaptureVideoIdFrontImage = _9.idCaptureVideoIdFrontImage,
|
|
24766
|
+
idCaptureVideoIdBackImage = _9.idCaptureVideoIdBackImage,
|
|
24767
|
+
setIdCaptureVideoUrl = _9.setIdCaptureVideoUrl,
|
|
24768
|
+
setIdCaptureVideoIdFrontImage = _9.setIdCaptureVideoIdFrontImage,
|
|
24769
|
+
setIdCaptureVideoIdBackImage = _9.setIdCaptureVideoIdBackImage,
|
|
24770
|
+
setIdCaptureVideoAudioUrl = _9.setIdCaptureVideoAudioUrl;
|
|
24771
|
+
var _10 = React.useState('CAPTURING_ID'),
|
|
24772
|
+
captureState = _10[0],
|
|
24773
|
+
setCaptureState = _10[1];
|
|
24818
24774
|
React.useEffect(function () {
|
|
24819
24775
|
if (skipIdCapture && captureState === 'CAPTURING_ID') setCaptureState('CHECKING_LIVENESS');
|
|
24820
24776
|
}, [captureState, skipIdCapture]);
|
|
@@ -24845,9 +24801,9 @@
|
|
|
24845
24801
|
var onVideoCaptureFaceNotDetected = React.useCallback(function () {
|
|
24846
24802
|
setCaptureState('CHECKING_LIVENESS');
|
|
24847
24803
|
}, []);
|
|
24848
|
-
var
|
|
24849
|
-
attempt =
|
|
24850
|
-
setAttempt =
|
|
24804
|
+
var _11 = React.useState(0),
|
|
24805
|
+
attempt = _11[0],
|
|
24806
|
+
setAttempt = _11[1];
|
|
24851
24807
|
var userSuppliedExitAfterFailure = onExitAfterFailure !== null && onExitAfterFailure !== void 0 ? onExitAfterFailure : faceLivenessProps.onExitAfterFailure;
|
|
24852
24808
|
var onFaceCaptureExitAfterFailure = React.useCallback(function (resp, req) {
|
|
24853
24809
|
userSuppliedExitAfterFailure === null || userSuppliedExitAfterFailure === void 0 ? void 0 : userSuppliedExitAfterFailure(resp, req);
|
|
@@ -24893,11 +24849,6 @@
|
|
|
24893
24849
|
idCardGuideStatus: "disabled"
|
|
24894
24850
|
});
|
|
24895
24851
|
}, [capturedIdDocumentType, (_b = classNames.idVideoCapture) === null || _b === void 0 ? void 0 : _b.guides, (_c = colors.idVideoCapture) === null || _c === void 0 ? void 0 : _c.guidesSatisfiedColor, (_d = colors.idVideoCapture) === null || _d === void 0 ? void 0 : _d.guidesUnsatisfiedColor, idCaptureGuideImages, (_e = verbiage.idVideoCapture) === null || _e === void 0 ? void 0 : _e.guides]);
|
|
24896
|
-
if (submissionStatus === SubmissionStatus.SUBMITTING) {
|
|
24897
|
-
return /*#__PURE__*/React.createElement(PageContainer, {
|
|
24898
|
-
className: "flex"
|
|
24899
|
-
}, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
24900
|
-
}
|
|
24901
24852
|
return /*#__PURE__*/React.createElement(CameraStoreProvider, {
|
|
24902
24853
|
preferIphoneContinuityCamera: isCapturingId,
|
|
24903
24854
|
preferFrontFacingCamera: !isCapturingId,
|
|
@@ -24921,11 +24872,9 @@
|
|
|
24921
24872
|
onModelError: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.onModelError,
|
|
24922
24873
|
modelLoadTimeoutMs: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.modelLoadTimeoutMs,
|
|
24923
24874
|
requireVerticalFaceCentering: false
|
|
24924
|
-
}, /*#__PURE__*/React.createElement(
|
|
24925
|
-
className: "flex ".concat((_k = classNames.container) !== null && _k !== void 0 ? _k : '')
|
|
24926
|
-
}, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
24875
|
+
}, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && ( /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
24927
24876
|
className: classNames.cameraFeed
|
|
24928
|
-
}), function () {
|
|
24877
|
+
})), function () {
|
|
24929
24878
|
switch (captureState) {
|
|
24930
24879
|
case 'CAPTURING_ID':
|
|
24931
24880
|
return /*#__PURE__*/React.createElement(IdCaptureStateProvider, null, /*#__PURE__*/React.createElement(GuideOrientationContextProvider, null, /*#__PURE__*/React.createElement(IdCaptureWizard, _assign({
|
|
@@ -25015,7 +24964,7 @@
|
|
|
25015
24964
|
default:
|
|
25016
24965
|
return /*#__PURE__*/React.createElement(React.Fragment, null);
|
|
25017
24966
|
}
|
|
25018
|
-
}())))
|
|
24967
|
+
}())));
|
|
25019
24968
|
};
|
|
25020
24969
|
|
|
25021
24970
|
function CompositeWizard(_a) {
|
|
@@ -25141,9 +25090,7 @@
|
|
|
25141
25090
|
if (isComplete) {
|
|
25142
25091
|
switch (submissionStatus) {
|
|
25143
25092
|
case SubmissionStatus.SUBMITTING:
|
|
25144
|
-
return /*#__PURE__*/React.createElement(
|
|
25145
|
-
className: "flex"
|
|
25146
|
-
}, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
25093
|
+
return /*#__PURE__*/React.createElement(SpinnerPage, null);
|
|
25147
25094
|
case SubmissionStatus.SUBMITTED:
|
|
25148
25095
|
if (debugMode) return /*#__PURE__*/React.createElement(SubmissionSuccess, null);
|
|
25149
25096
|
return /*#__PURE__*/React.createElement(React.Fragment, null);
|
|
@@ -25667,6 +25614,8 @@
|
|
|
25667
25614
|
geolocationEnabled: geolocationEnabled,
|
|
25668
25615
|
geolocationRequired: geolocationRequired,
|
|
25669
25616
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
25617
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
25618
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
25670
25619
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
25671
25620
|
checks: React.useMemo(function () {
|
|
25672
25621
|
return ['IdCapture'];
|
|
@@ -25680,7 +25629,7 @@
|
|
|
25680
25629
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
25681
25630
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
25682
25631
|
debugMode: debugMode
|
|
25683
|
-
}))));
|
|
25632
|
+
})))));
|
|
25684
25633
|
};
|
|
25685
25634
|
|
|
25686
25635
|
/** Render a fullscreen capture component that analyzes frames from the user's front-facing camera to determine whether a live human face is present. */
|
|
@@ -25803,6 +25752,8 @@
|
|
|
25803
25752
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks,
|
|
25804
25753
|
estimateAge: estimateAge,
|
|
25805
25754
|
predictGender: predictGender
|
|
25755
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
25756
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
25806
25757
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
25807
25758
|
checks: React.useMemo(function () {
|
|
25808
25759
|
return ['FaceLiveness'];
|
|
@@ -25811,7 +25762,7 @@
|
|
|
25811
25762
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
25812
25763
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
25813
25764
|
debugMode: debugMode
|
|
25814
|
-
}))));
|
|
25765
|
+
})))));
|
|
25815
25766
|
};
|
|
25816
25767
|
|
|
25817
25768
|
/**
|
|
@@ -26060,6 +26011,8 @@
|
|
|
26060
26011
|
geolocationEnabled: geolocationEnabled,
|
|
26061
26012
|
geolocationRequired: geolocationRequired,
|
|
26062
26013
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
26014
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
26015
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
26063
26016
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
26064
26017
|
checks: checks,
|
|
26065
26018
|
idCaptureProps: idCaptureProps,
|
|
@@ -26072,7 +26025,7 @@
|
|
|
26072
26025
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
26073
26026
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
26074
26027
|
debugMode: debugMode
|
|
26075
|
-
}))));
|
|
26028
|
+
})))));
|
|
26076
26029
|
};
|
|
26077
26030
|
|
|
26078
26031
|
/**
|
|
@@ -26345,6 +26298,8 @@
|
|
|
26345
26298
|
geolocationEnabled: geolocationEnabled,
|
|
26346
26299
|
geolocationRequired: geolocationRequired,
|
|
26347
26300
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
26301
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
26302
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
26348
26303
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
26349
26304
|
checks: checks,
|
|
26350
26305
|
idCaptureProps: idCaptureProps,
|
|
@@ -26358,7 +26313,7 @@
|
|
|
26358
26313
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
26359
26314
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
26360
26315
|
debugMode: debugMode
|
|
26361
|
-
}))));
|
|
26316
|
+
})))));
|
|
26362
26317
|
};
|
|
26363
26318
|
|
|
26364
26319
|
var ALLOWED_RETRIES$3 = 0;
|
|
@@ -26601,8 +26556,8 @@
|
|
|
26601
26556
|
}, verbiage.doneBtnText))));
|
|
26602
26557
|
};
|
|
26603
26558
|
var Heading$3 = styled.h3(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
26604
|
-
var ImageContainer$3 = styled(ButtonsRow)(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
26605
|
-
var StyledButtonsRow$3 = styled(ButtonsRow)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26559
|
+
var ImageContainer$3 = styled(ButtonsRow$2)(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
26560
|
+
var StyledButtonsRow$3 = styled(ButtonsRow$2)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26606
26561
|
var templateObject_1$3, templateObject_2$3, templateObject_3$3;
|
|
26607
26562
|
|
|
26608
26563
|
var CustomerVerificationFailure = function CustomerVerificationFailure(_a) {
|
|
@@ -26653,13 +26608,12 @@
|
|
|
26653
26608
|
}, verbiage.exitBtnText))));
|
|
26654
26609
|
};
|
|
26655
26610
|
var Heading$2 = styled.h3(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
26656
|
-
var ImageContainer$2 = styled(ButtonsRow)(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
26657
|
-
var StyledButtonsRow$2 = styled(ButtonsRow)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26611
|
+
var ImageContainer$2 = styled(ButtonsRow$2)(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
26612
|
+
var StyledButtonsRow$2 = styled(ButtonsRow$2)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26658
26613
|
var templateObject_1$2, templateObject_2$2, templateObject_3$2;
|
|
26659
26614
|
|
|
26660
26615
|
var ALLOWED_RETRIES$2 = 2;
|
|
26661
26616
|
var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
26662
|
-
var _b;
|
|
26663
26617
|
var onComplete = _a.onComplete,
|
|
26664
26618
|
onCustomerMatched = _a.onCustomerMatched,
|
|
26665
26619
|
onCustomerNotMatched = _a.onCustomerNotMatched,
|
|
@@ -26668,33 +26622,33 @@
|
|
|
26668
26622
|
onUserCancel = _a.onUserCancel,
|
|
26669
26623
|
onCaptureGuidanceTimeout = _a.onCaptureGuidanceTimeout,
|
|
26670
26624
|
captureGuidanceTimeoutDurationMs = _a.captureGuidanceTimeoutDurationMs,
|
|
26671
|
-
|
|
26672
|
-
skipSuccessScreen =
|
|
26673
|
-
|
|
26674
|
-
loadingOverlayMode =
|
|
26675
|
-
|
|
26676
|
-
assets =
|
|
26677
|
-
|
|
26678
|
-
classNames =
|
|
26679
|
-
|
|
26680
|
-
colors =
|
|
26681
|
-
|
|
26682
|
-
verbiage =
|
|
26683
|
-
|
|
26684
|
-
debugMode =
|
|
26685
|
-
var
|
|
26686
|
-
submissionRequest =
|
|
26687
|
-
submissionResponse =
|
|
26688
|
-
selfieImage =
|
|
26689
|
-
var
|
|
26690
|
-
captureState =
|
|
26691
|
-
setCaptureState =
|
|
26692
|
-
var
|
|
26693
|
-
cameraAccessDenied =
|
|
26694
|
-
releaseCameraAccess =
|
|
26695
|
-
var
|
|
26696
|
-
start =
|
|
26697
|
-
stop =
|
|
26625
|
+
_b = _a.skipSuccessScreen,
|
|
26626
|
+
skipSuccessScreen = _b === void 0 ? false : _b,
|
|
26627
|
+
_c = _a.loadingOverlayMode,
|
|
26628
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
26629
|
+
_d = _a.assets,
|
|
26630
|
+
assets = _d === void 0 ? {} : _d,
|
|
26631
|
+
_e = _a.classNames,
|
|
26632
|
+
classNames = _e === void 0 ? {} : _e,
|
|
26633
|
+
_f = _a.colors,
|
|
26634
|
+
colors = _f === void 0 ? {} : _f,
|
|
26635
|
+
_g = _a.verbiage,
|
|
26636
|
+
verbiage = _g === void 0 ? {} : _g,
|
|
26637
|
+
_h = _a.debugMode,
|
|
26638
|
+
debugMode = _h === void 0 ? false : _h;
|
|
26639
|
+
var _j = React.useContext(SubmissionContext),
|
|
26640
|
+
submissionRequest = _j.submissionRequest,
|
|
26641
|
+
submissionResponse = _j.submissionResponse,
|
|
26642
|
+
selfieImage = _j.selfieImage;
|
|
26643
|
+
var _k = React.useState('LOADING'),
|
|
26644
|
+
captureState = _k[0],
|
|
26645
|
+
setCaptureState = _k[1];
|
|
26646
|
+
var _l = useCameraStore(),
|
|
26647
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
26648
|
+
releaseCameraAccess = _l.releaseCameraAccess;
|
|
26649
|
+
var _m = React.useContext(SelfieGuidanceModelsContext),
|
|
26650
|
+
start = _m.start,
|
|
26651
|
+
stop = _m.stop;
|
|
26698
26652
|
React.useEffect(function () {
|
|
26699
26653
|
if (captureState !== 'CAPTURING') return;
|
|
26700
26654
|
start();
|
|
@@ -26724,9 +26678,9 @@
|
|
|
26724
26678
|
setCaptureState('FAILED');
|
|
26725
26679
|
onCaptureGuidanceTimeout === null || onCaptureGuidanceTimeout === void 0 ? void 0 : onCaptureGuidanceTimeout();
|
|
26726
26680
|
}, [onCaptureGuidanceTimeout]);
|
|
26727
|
-
var
|
|
26728
|
-
attempt =
|
|
26729
|
-
setAttempt =
|
|
26681
|
+
var _o = React.useState(0),
|
|
26682
|
+
attempt = _o[0],
|
|
26683
|
+
setAttempt = _o[1];
|
|
26730
26684
|
var onExitCallback = React.useCallback(function () {
|
|
26731
26685
|
setAttempt(function (n) {
|
|
26732
26686
|
return n + 1;
|
|
@@ -26747,9 +26701,7 @@
|
|
|
26747
26701
|
setCaptureState('LOADING');
|
|
26748
26702
|
}
|
|
26749
26703
|
}, [cameraAccessDenied]);
|
|
26750
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
26751
|
-
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
26752
|
-
}, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
26704
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
26753
26705
|
className: classNames.cameraFeed
|
|
26754
26706
|
}), captureState !== 'LOADING' && function () {
|
|
26755
26707
|
switch (captureState) {
|
|
@@ -26800,7 +26752,7 @@
|
|
|
26800
26752
|
default:
|
|
26801
26753
|
return null;
|
|
26802
26754
|
}
|
|
26803
|
-
}()
|
|
26755
|
+
}(), /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
26804
26756
|
key: attempt,
|
|
26805
26757
|
mode: loadingOverlayMode,
|
|
26806
26758
|
assets: assets.loadingOverlay,
|
|
@@ -26916,6 +26868,8 @@
|
|
|
26916
26868
|
autoStart: false,
|
|
26917
26869
|
onModelError: onModelError,
|
|
26918
26870
|
modelLoadTimeoutMs: modelLoadTimeoutMs
|
|
26871
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
26872
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
26919
26873
|
}, /*#__PURE__*/React.createElement(CustomerVerificationWizard, {
|
|
26920
26874
|
onComplete: onComplete,
|
|
26921
26875
|
onCustomerMatched: onCustomerMatched,
|
|
@@ -26931,7 +26885,7 @@
|
|
|
26931
26885
|
colors: colors,
|
|
26932
26886
|
verbiage: verbiage,
|
|
26933
26887
|
debugMode: debugMode
|
|
26934
|
-
}))))));
|
|
26888
|
+
})))))));
|
|
26935
26889
|
};
|
|
26936
26890
|
|
|
26937
26891
|
var ALLOWED_RETRIES$1 = 0;
|
|
@@ -27172,8 +27126,8 @@
|
|
|
27172
27126
|
}, verbiage.doneBtnText))));
|
|
27173
27127
|
};
|
|
27174
27128
|
var Heading$1 = styled.h3(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
27175
|
-
var ImageContainer$1 = styled(ButtonsRow)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
27176
|
-
var StyledButtonsRow$1 = styled(ButtonsRow)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27129
|
+
var ImageContainer$1 = styled(ButtonsRow$2)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
27130
|
+
var StyledButtonsRow$1 = styled(ButtonsRow$2)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27177
27131
|
var templateObject_1$1, templateObject_2$1, templateObject_3$1;
|
|
27178
27132
|
|
|
27179
27133
|
var CustomerIdentificationFailure = function CustomerIdentificationFailure(_a) {
|
|
@@ -27224,13 +27178,12 @@
|
|
|
27224
27178
|
}, verbiage.exitBtnText))));
|
|
27225
27179
|
};
|
|
27226
27180
|
var Heading = styled.h3(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
27227
|
-
var ImageContainer = styled(ButtonsRow)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
27228
|
-
var StyledButtonsRow = styled(ButtonsRow)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27181
|
+
var ImageContainer = styled(ButtonsRow$2)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
27182
|
+
var StyledButtonsRow = styled(ButtonsRow$2)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27229
27183
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
27230
27184
|
|
|
27231
27185
|
var ALLOWED_RETRIES = 2;
|
|
27232
27186
|
var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
27233
|
-
var _b;
|
|
27234
27187
|
var onComplete = _a.onComplete,
|
|
27235
27188
|
onCustomerMatched = _a.onCustomerMatched,
|
|
27236
27189
|
onCustomerNotMatched = _a.onCustomerNotMatched,
|
|
@@ -27239,33 +27192,33 @@
|
|
|
27239
27192
|
onUserCancel = _a.onUserCancel,
|
|
27240
27193
|
onCaptureGuidanceTimeout = _a.onCaptureGuidanceTimeout,
|
|
27241
27194
|
captureGuidanceTimeoutDurationMs = _a.captureGuidanceTimeoutDurationMs,
|
|
27242
|
-
|
|
27243
|
-
skipSuccessScreen =
|
|
27244
|
-
|
|
27245
|
-
loadingOverlayMode =
|
|
27246
|
-
|
|
27247
|
-
assets =
|
|
27248
|
-
|
|
27249
|
-
classNames =
|
|
27250
|
-
|
|
27251
|
-
colors =
|
|
27252
|
-
|
|
27253
|
-
verbiage =
|
|
27254
|
-
|
|
27255
|
-
debugMode =
|
|
27256
|
-
var
|
|
27257
|
-
submissionResponse =
|
|
27258
|
-
submissionRequest =
|
|
27259
|
-
selfieImage =
|
|
27260
|
-
var
|
|
27261
|
-
captureState =
|
|
27262
|
-
setCaptureState =
|
|
27263
|
-
var
|
|
27264
|
-
cameraAccessDenied =
|
|
27265
|
-
releaseCameraAccess =
|
|
27266
|
-
var
|
|
27267
|
-
start =
|
|
27268
|
-
stop =
|
|
27195
|
+
_b = _a.skipSuccessScreen,
|
|
27196
|
+
skipSuccessScreen = _b === void 0 ? false : _b,
|
|
27197
|
+
_c = _a.loadingOverlayMode,
|
|
27198
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
27199
|
+
_d = _a.assets,
|
|
27200
|
+
assets = _d === void 0 ? {} : _d,
|
|
27201
|
+
_e = _a.classNames,
|
|
27202
|
+
classNames = _e === void 0 ? {} : _e,
|
|
27203
|
+
_f = _a.colors,
|
|
27204
|
+
colors = _f === void 0 ? {} : _f,
|
|
27205
|
+
_g = _a.verbiage,
|
|
27206
|
+
verbiage = _g === void 0 ? {} : _g,
|
|
27207
|
+
_h = _a.debugMode,
|
|
27208
|
+
debugMode = _h === void 0 ? false : _h;
|
|
27209
|
+
var _j = React.useContext(SubmissionContext),
|
|
27210
|
+
submissionResponse = _j.submissionResponse,
|
|
27211
|
+
submissionRequest = _j.submissionRequest,
|
|
27212
|
+
selfieImage = _j.selfieImage;
|
|
27213
|
+
var _k = React.useState('LOADING'),
|
|
27214
|
+
captureState = _k[0],
|
|
27215
|
+
setCaptureState = _k[1];
|
|
27216
|
+
var _l = useCameraStore(),
|
|
27217
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
27218
|
+
releaseCameraAccess = _l.releaseCameraAccess;
|
|
27219
|
+
var _m = React.useContext(SelfieGuidanceModelsContext),
|
|
27220
|
+
start = _m.start,
|
|
27221
|
+
stop = _m.stop;
|
|
27269
27222
|
React.useEffect(function () {
|
|
27270
27223
|
if (captureState !== 'CAPTURING') return;
|
|
27271
27224
|
start();
|
|
@@ -27295,9 +27248,9 @@
|
|
|
27295
27248
|
setCaptureState('FAILED');
|
|
27296
27249
|
onCaptureGuidanceTimeout === null || onCaptureGuidanceTimeout === void 0 ? void 0 : onCaptureGuidanceTimeout();
|
|
27297
27250
|
}, [onCaptureGuidanceTimeout]);
|
|
27298
|
-
var
|
|
27299
|
-
attempt =
|
|
27300
|
-
setAttempt =
|
|
27251
|
+
var _o = React.useState(0),
|
|
27252
|
+
attempt = _o[0],
|
|
27253
|
+
setAttempt = _o[1];
|
|
27301
27254
|
var onExitCallback = React.useCallback(function () {
|
|
27302
27255
|
setAttempt(function (n) {
|
|
27303
27256
|
return n + 1;
|
|
@@ -27318,9 +27271,7 @@
|
|
|
27318
27271
|
setCaptureState('LOADING');
|
|
27319
27272
|
}
|
|
27320
27273
|
}, [cameraAccessDenied]);
|
|
27321
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
27322
|
-
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
27323
|
-
}, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
27274
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
27324
27275
|
className: classNames.cameraFeed
|
|
27325
27276
|
}), captureState !== 'LOADING' && function () {
|
|
27326
27277
|
switch (captureState) {
|
|
@@ -27371,7 +27322,7 @@
|
|
|
27371
27322
|
default:
|
|
27372
27323
|
return null;
|
|
27373
27324
|
}
|
|
27374
|
-
}()
|
|
27325
|
+
}(), /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
27375
27326
|
key: attempt,
|
|
27376
27327
|
mode: loadingOverlayMode,
|
|
27377
27328
|
assets: assets.loadingOverlay,
|
|
@@ -27485,6 +27436,8 @@
|
|
|
27485
27436
|
autoStart: false,
|
|
27486
27437
|
modelLoadTimeoutMs: modelLoadTimeoutMs,
|
|
27487
27438
|
onModelError: onModelError
|
|
27439
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27440
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
27488
27441
|
}, /*#__PURE__*/React.createElement(CustomerIdentificationWizard, {
|
|
27489
27442
|
onComplete: onComplete,
|
|
27490
27443
|
onCustomerMatched: onCustomerMatched,
|
|
@@ -27501,7 +27454,7 @@
|
|
|
27501
27454
|
colors: colors,
|
|
27502
27455
|
verbiage: verbiage,
|
|
27503
27456
|
debugMode: debugMode
|
|
27504
|
-
}))))));
|
|
27457
|
+
})))))));
|
|
27505
27458
|
};
|
|
27506
27459
|
|
|
27507
27460
|
/** Render a fullscreen capture component that captures a video of the user signing the screen. */
|
|
@@ -27583,6 +27536,8 @@
|
|
|
27583
27536
|
geolocationEnabled: geolocationEnabled,
|
|
27584
27537
|
geolocationRequired: geolocationRequired,
|
|
27585
27538
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
27539
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27540
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
27586
27541
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
27587
27542
|
debugMode: debugMode,
|
|
27588
27543
|
checks: React.useMemo(function () {
|
|
@@ -27610,7 +27565,7 @@
|
|
|
27610
27565
|
onUserCancel: onUserCancel
|
|
27611
27566
|
};
|
|
27612
27567
|
}, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
|
|
27613
|
-
}))));
|
|
27568
|
+
})))));
|
|
27614
27569
|
};
|
|
27615
27570
|
|
|
27616
27571
|
/**
|
|
@@ -27832,6 +27787,8 @@
|
|
|
27832
27787
|
geolocationEnabled: geolocationEnabled,
|
|
27833
27788
|
geolocationRequired: geolocationRequired,
|
|
27834
27789
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
27790
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27791
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
27835
27792
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
27836
27793
|
checks: React.useMemo(function () {
|
|
27837
27794
|
return ['VideoIdCapture'];
|
|
@@ -27846,7 +27803,7 @@
|
|
|
27846
27803
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
27847
27804
|
onMicrophoneAccessDenied: onMicrophoneAccessDenied,
|
|
27848
27805
|
debugMode: debugMode
|
|
27849
|
-
}))));
|
|
27806
|
+
})))));
|
|
27850
27807
|
};
|
|
27851
27808
|
|
|
27852
27809
|
/** Render a fullscreen capture component that performs FaceValidation, and then stores the results in IDmission's customer database using the supplied `enrollmentId` for later verification or 1:N matching. */
|
|
@@ -28010,6 +27967,8 @@
|
|
|
28010
27967
|
geolocationEnabled: geolocationEnabled,
|
|
28011
27968
|
geolocationRequired: geolocationRequired,
|
|
28012
27969
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
27970
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27971
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
28013
27972
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
28014
27973
|
checks: React.useMemo(function () {
|
|
28015
27974
|
return ['FaceLiveness'];
|
|
@@ -28023,7 +27982,7 @@
|
|
|
28023
27982
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
28024
27983
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
28025
27984
|
debugMode: debugMode
|
|
28026
|
-
}))));
|
|
27985
|
+
})))));
|
|
28027
27986
|
};
|
|
28028
27987
|
|
|
28029
27988
|
/**
|
|
@@ -28096,6 +28055,8 @@
|
|
|
28096
28055
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
28097
28056
|
classNames: classNames === null || classNames === void 0 ? void 0 : classNames.cameraStoreProvider,
|
|
28098
28057
|
verbiage: verbiage === null || verbiage === void 0 ? void 0 : verbiage.cameraStoreProvider
|
|
28058
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
28059
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
28099
28060
|
}, /*#__PURE__*/React.createElement(DocumentCaptureWizard, {
|
|
28100
28061
|
onSuccess: onComplete,
|
|
28101
28062
|
onExitCapture: onExitCapture,
|
|
@@ -28106,7 +28067,7 @@
|
|
|
28106
28067
|
instructions: instructions,
|
|
28107
28068
|
classNames: classNames,
|
|
28108
28069
|
verbiage: verbiage
|
|
28109
|
-
})))));
|
|
28070
|
+
}))))));
|
|
28110
28071
|
};
|
|
28111
28072
|
|
|
28112
28073
|
initializeI18n();
|