idmission-web-sdk 2.2.175 → 2.2.176
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/signature_capture/SignatureCapture.d.ts.map +1 -1
- package/dist/components/submission/SubmissionSuccess.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCapture.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/VideoSignatureWizard.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +910 -954
- 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 +912 -956
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +913 -957
- 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.176';
|
|
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$P || (templateObject_1$P = __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$P;
|
|
439
|
+
|
|
440
|
+
var ButtonsRow$2 = styled.div(templateObject_1$O || (templateObject_1$O = __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$O;
|
|
442
|
+
|
|
443
|
+
var GuidanceMessageContainerDiv = styled.div(templateObject_1$N || (templateObject_1$N = __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$F || (templateObject_2$F = __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$N, templateObject_2$F;
|
|
481
464
|
|
|
482
|
-
var
|
|
465
|
+
var wavesAnimation = styled.keyframes(templateObject_1$M || (templateObject_1$M = __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$E || (templateObject_2$E = __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$M, templateObject_2$E, templateObject_3$s, templateObject_4$m;
|
|
470
|
+
|
|
471
|
+
var OverlayContainer = styled.div(templateObject_1$L || (templateObject_1$L = __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$
|
|
476
|
+
var OverlayInner$2 = styled.div(templateObject_2$D || (templateObject_2$D = __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$
|
|
495
|
-
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$
|
|
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"])));
|
|
484
|
+
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$e || (templateObject_5$e = __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$L, templateObject_2$D, templateObject_3$r, templateObject_4$l, templateObject_5$e, 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) {
|
|
@@ -13875,13 +13883,13 @@
|
|
|
13875
13883
|
}, messageText)));
|
|
13876
13884
|
}
|
|
13877
13885
|
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
13878
|
-
var StyledOverlayHeading = styled.h3(templateObject_2$
|
|
13886
|
+
var StyledOverlayHeading = styled.h3(templateObject_2$C || (templateObject_2$C = __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$J, templateObject_2$
|
|
13892
|
+
var templateObject_1$J, templateObject_2$C;
|
|
13885
13893
|
|
|
13886
13894
|
var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
|
|
13887
13895
|
startDocumentDetection: function startDocumentDetection() {
|
|
@@ -15210,11 +15218,11 @@
|
|
|
15210
15218
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
15211
15219
|
}
|
|
15212
15220
|
var DebugStatsPaneDiv = styled.span(templateObject_1$I || (templateObject_1$I = __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"])));
|
|
15213
|
-
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$
|
|
15221
|
+
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$B || (templateObject_2$B = __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$I, templateObject_2$
|
|
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$I, templateObject_2$B, 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$6, {
|
|
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$6 = styled.div(templateObject_1$H || (templateObject_1$H = __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$
|
|
15483
|
-
var Button$1 = styled(LoaderButton)(templateObject_5$
|
|
15484
|
-
var templateObject_1$
|
|
15466
|
+
var InnerContainer = styled.div(templateObject_2$A || (templateObject_2$A = __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"])));
|
|
15469
|
+
var Button$1 = styled(LoaderButton)(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n white-space: nowrap;\n margin: auto;\n"], ["\n white-space: nowrap;\n margin: auto;\n"])));
|
|
15470
|
+
var templateObject_1$H, templateObject_2$A, templateObject_3$p, templateObject_4$j, templateObject_5$d;
|
|
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,
|
|
@@ -15818,13 +15799,13 @@
|
|
|
15818
15799
|
finished: true
|
|
15819
15800
|
}, verbiage.retryBtnText)));
|
|
15820
15801
|
};
|
|
15821
|
-
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$
|
|
15822
|
-
var StyledOverlayImageContainer$
|
|
15823
|
-
var Description$4 = styled.p(templateObject_3$
|
|
15824
|
-
var RetryButton$1 = styled(LoaderButton)(templateObject_4$
|
|
15825
|
-
var templateObject_1$
|
|
15802
|
+
var StyledOverlayInner$3 = 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"])));
|
|
15803
|
+
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$z || (templateObject_2$z = __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$G, templateObject_2$z, templateObject_3$o, templateObject_4$i;
|
|
15826
15807
|
|
|
15827
|
-
var ExitCaptureStyledButton = styled.button(templateObject_1$
|
|
15808
|
+
var ExitCaptureStyledButton = styled.button(templateObject_1$F || (templateObject_1$F = __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) {
|
|
15829
15810
|
var onClick = _a.onClick,
|
|
15830
15811
|
className = _a.className;
|
|
@@ -15868,10 +15849,7 @@
|
|
|
15868
15849
|
y2: "19.75"
|
|
15869
15850
|
}))));
|
|
15870
15851
|
};
|
|
15871
|
-
var templateObject_1$
|
|
15872
|
-
|
|
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;
|
|
15852
|
+
var templateObject_1$F;
|
|
15875
15853
|
|
|
15876
15854
|
function IdCaptureLoadingGraphic(props) {
|
|
15877
15855
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -15879,14 +15857,10 @@
|
|
|
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$E || (templateObject_1$E = __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$y || (templateObject_2$y = __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$E, templateObject_2$y, 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$D || (templateObject_1$D = __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$x || (templateObject_2$x = __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$c || (templateObject_5$c = __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$D, templateObject_2$x, templateObject_3$m, templateObject_4$g, templateObject_5$c, 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$C || (templateObject_1$C = __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$w || (templateObject_2$w = __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$C, templateObject_2$w;
|
|
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$B || (templateObject_1$B = __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$v || (templateObject_2$v = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
16759
|
+
var templateObject_1$B, templateObject_2$v;
|
|
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
|
|
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"])));
|
|
16880
|
-
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$
|
|
16881
|
-
var DebugPre = styled.pre(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n text-align: left;\n max-width:
|
|
16882
|
-
var templateObject_1$
|
|
16821
|
+
var Heading$a = styled.h1(templateObject_1$A || (templateObject_1$A = __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$u || (templateObject_2$u = __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 position: relative;\n width: 100%;\n"], ["\n max-width: 100%;\n flex-direction: column;\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"])));
|
|
16825
|
+
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n width: 100%;\n border-radius: 12px;\n"], ["\n width: 100%;\n border-radius: 12px;\n"])));
|
|
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$A, templateObject_2$u, templateObject_3$l, templateObject_4$f, templateObject_5$b, 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$z || (templateObject_1$z = __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$t || (templateObject_2$t = __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;' : '';
|
|
@@ -17080,14 +17025,14 @@
|
|
|
17080
17025
|
}
|
|
17081
17026
|
var IdCardBorderContainer = styled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n"], ["\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n"])), wavesAnimation);
|
|
17082
17027
|
var SvgOverlay = styled.svg(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"])));
|
|
17083
|
-
var IdCardBorderRect = styled.rect(templateObject_5$
|
|
17028
|
+
var IdCardBorderRect = styled.rect(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"], ["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"])), progressBorderAnimation, function (props) {
|
|
17084
17029
|
var _a;
|
|
17085
17030
|
return (_a = props.$speed) !== null && _a !== void 0 ? _a : '3s';
|
|
17086
17031
|
}, function (props) {
|
|
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$z, templateObject_2$t, templateObject_3$k, templateObject_4$e, templateObject_5$a;
|
|
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$y || (templateObject_1$y = __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$y;
|
|
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$x || (templateObject_1$x = __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$s || (templateObject_2$s = __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;
|
|
@@ -17569,7 +17514,7 @@
|
|
|
17569
17514
|
}, function (props) {
|
|
17570
17515
|
return props.$minHeight ? "min-height: ".concat(props.$minHeight, "px;") : "";
|
|
17571
17516
|
});
|
|
17572
|
-
var Spacer = styled(GuideRegion)(templateObject_5$
|
|
17517
|
+
var Spacer = styled(GuideRegion)(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: block;\n width: auto;\n"], ["\n display: block;\n width: auto;\n"])));
|
|
17573
17518
|
var GuideCenterRegion = styled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"], ["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"])), function (props) {
|
|
17574
17519
|
return props.$minWidth ? "min-width: ".concat(props.$minWidth, "px;") : "";
|
|
17575
17520
|
}, function (props) {
|
|
@@ -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$x, templateObject_2$s, templateObject_3$j, templateObject_4$d, templateObject_5$9, 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$w || (templateObject_1$w = __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$r || (templateObject_2$r = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
17676
|
+
var templateObject_1$w, templateObject_2$r;
|
|
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$v || (templateObject_1$v = __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$q || (templateObject_2$q = __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$v, templateObject_2$q;
|
|
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$u || (templateObject_1$u = __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$p || (templateObject_2$p = __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$u, templateObject_2$p, 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$t || (templateObject_1$t = __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$o || (templateObject_2$o = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
18204
|
+
var templateObject_1$t, templateObject_2$o;
|
|
18256
18205
|
|
|
18257
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
18206
|
+
var CameraFeedWrapper = styled.div(templateObject_1$s || (templateObject_1$s = __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$s;
|
|
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$r || (templateObject_1$r = __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$r;
|
|
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,21 +18388,21 @@
|
|
|
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$q || (templateObject_1$q = __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$n || (templateObject_2$n = __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"])));
|
|
18449
18396
|
var FooterRow = styled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"], ["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"])), function (props) {
|
|
18450
18397
|
return props.$maskColor;
|
|
18451
18398
|
});
|
|
18452
|
-
var Instructions = styled.div(templateObject_5$
|
|
18399
|
+
var Instructions = styled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n max-height: ", ";\n overflow-y: auto;\n"], ["\n max-height: ", ";\n overflow-y: auto;\n"])), function (props) {
|
|
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$q, templateObject_2$n, templateObject_3$h, templateObject_4$b, templateObject_5$8, 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$p || (templateObject_1$p = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
18677
|
+
var Heading$8 = styled.h3(templateObject_2$m || (templateObject_2$m = __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
|
-
var ImageCol = styled.div(templateObject_5$
|
|
18734
|
-
var StyledButtonsRow$
|
|
18735
|
-
var templateObject_1$
|
|
18680
|
+
var ImageCol = styled.div(templateObject_5$7 || (templateObject_5$7 = __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"])));
|
|
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$p, templateObject_2$m, templateObject_3$g, templateObject_4$a, templateObject_5$7, 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$o || (templateObject_1$o = __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$l || (templateObject_2$l = __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
|
-
var ScreenActionsBar = styled.div(templateObject_5$
|
|
19041
|
+
var ScreenActionsBar = styled.div(templateObject_5$6 || (templateObject_5$6 = __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$o, templateObject_2$l, templateObject_3$f, templateObject_4$9, templateObject_5$6, 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$n || (templateObject_1$n = __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$k || (templateObject_2$k = __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$n, templateObject_2$k, 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$m || (templateObject_1$m = __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$j || (templateObject_2$j = __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$m, templateObject_2$j;
|
|
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$l || (templateObject_1$l = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
20640
|
+
var Heading$7 = styled.h3(templateObject_2$i || (templateObject_2$i = __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$5 || (templateObject_5$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
20644
|
+
var templateObject_1$l, templateObject_2$i, templateObject_3$d, templateObject_4$8, templateObject_5$5;
|
|
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$5, {
|
|
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$5 = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
|
|
20817
|
+
var templateObject_1$k;
|
|
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$j || (templateObject_1$j = __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$h || (templateObject_2$h = __makeTemplateObject(["\n font-size: 1.2rem;\n margin: 0;\n"], ["\n font-size: 1.2rem;\n margin: 0;\n"])));
|
|
21207
|
+
var templateObject_1$j, templateObject_2$h;
|
|
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$i || (templateObject_1$i = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
21257
|
+
var Heading$5 = styled.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
|
|
21258
|
+
var templateObject_1$i, templateObject_2$g;
|
|
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$h || (templateObject_1$h = __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$f || (templateObject_2$f = __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$h, templateObject_2$f, 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$g || (templateObject_1$g = __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$e || (templateObject_2$e = __makeTemplateObject(["\n flex-direction: column;\n padding-top: 25px;\n"], ["\n flex-direction: column;\n padding-top: 25px;\n"])));
|
|
21399
|
+
var templateObject_1$g, templateObject_2$e;
|
|
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$f || (templateObject_1$f = __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$d || (templateObject_2$d = __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$4 || (templateObject_5$4 = __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$f, templateObject_2$d, templateObject_3$b, templateObject_4$6, templateObject_5$4, 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,
|
|
@@ -21953,24 +21877,26 @@
|
|
|
21953
21877
|
}
|
|
21954
21878
|
return JSON.stringify(body, null, 2);
|
|
21955
21879
|
}, [submissionRequest, truncateImages]);
|
|
21956
|
-
return /*#__PURE__*/React.createElement(
|
|
21880
|
+
return /*#__PURE__*/React.createElement(Container$4, null, /*#__PURE__*/React.createElement("h3", null, "Submission completed!"), /*#__PURE__*/React.createElement(LoaderButton, {
|
|
21957
21881
|
onClick: function onClick() {
|
|
21958
|
-
setShowRequestBody(!showRequestBody);
|
|
21882
|
+
return setShowRequestBody(!showRequestBody);
|
|
21959
21883
|
}
|
|
21960
|
-
}, showRequestBody ? 'Hide' : 'Show', " request body"), showRequestBody && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
21884
|
+
}, showRequestBody ? 'Hide' : 'Show', " request body"), showRequestBody && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
21961
21885
|
style: {
|
|
21962
21886
|
marginLeft: 8
|
|
21963
21887
|
},
|
|
21964
21888
|
onClick: function onClick() {
|
|
21965
|
-
setTruncateImages(!truncateImages);
|
|
21889
|
+
return setTruncateImages(!truncateImages);
|
|
21966
21890
|
}
|
|
21967
21891
|
}, truncateImages ? 'Display full images' : 'Truncate images'), /*#__PURE__*/React.createElement("h5", null, "Request Body"), /*#__PURE__*/React.createElement("pre", null, requestBodyDisplay))), /*#__PURE__*/React.createElement("h5", null, "Response Body"), /*#__PURE__*/React.createElement("pre", null, JSON.stringify(submissionResponse, null, 2)));
|
|
21968
21892
|
};
|
|
21893
|
+
var Container$4 = styled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n padding: 16px;\n overflow: auto;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n"], ["\n padding: 16px;\n overflow: auto;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n"])));
|
|
21969
21894
|
function truncate(str, max_chars) {
|
|
21970
21895
|
var truncated = str.split('').splice(0, max_chars).join('');
|
|
21971
21896
|
if (truncated.length < str.length) truncated += '...';
|
|
21972
21897
|
return truncated;
|
|
21973
21898
|
}
|
|
21899
|
+
var templateObject_1$e;
|
|
21974
21900
|
|
|
21975
21901
|
var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
|
|
21976
21902
|
var document = _a.document,
|
|
@@ -22046,11 +21972,11 @@
|
|
|
22046
21972
|
}
|
|
22047
21973
|
}, verbiage.captureBtnText)))));
|
|
22048
21974
|
};
|
|
22049
|
-
var Inner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
22050
|
-
var Heading$4 = styled.h3(templateObject_2$
|
|
21975
|
+
var Inner$2 = styled(OverlayInner$2)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
21976
|
+
var Heading$4 = styled.h3(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
22051
21977
|
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$
|
|
21978
|
+
var StyledButtonsRow$4 = styled(ButtonsRow$2)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
21979
|
+
var templateObject_1$d, templateObject_2$c, templateObject_3$a, templateObject_4$5;
|
|
22054
21980
|
|
|
22055
21981
|
var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
|
|
22056
21982
|
var documents = _a.documents,
|
|
@@ -22968,7 +22894,7 @@
|
|
|
22968
22894
|
});
|
|
22969
22895
|
}
|
|
22970
22896
|
|
|
22971
|
-
var SignaturePaperBacking = styled.div(templateObject_1$
|
|
22897
|
+
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
22898
|
var _a, _b;
|
|
22973
22899
|
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
22900
|
}, function (props) {
|
|
@@ -22978,7 +22904,7 @@
|
|
|
22978
22904
|
var _a, _b;
|
|
22979
22905
|
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
22906
|
});
|
|
22981
|
-
var SignatureCanvasContainer$1 = styled.div(templateObject_2$
|
|
22907
|
+
var SignatureCanvasContainer$1 = styled.div(templateObject_2$b || (templateObject_2$b = __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
22908
|
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
22909
|
var _a, _b, _c;
|
|
22984
22910
|
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 +22915,8 @@
|
|
|
22989
22915
|
var _a, _b, _c;
|
|
22990
22916
|
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
22917
|
});
|
|
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$
|
|
22918
|
+
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"])));
|
|
22919
|
+
var templateObject_1$c, templateObject_2$b, templateObject_3$9, templateObject_4$4;
|
|
22994
22920
|
|
|
22995
22921
|
var SignatureCapture = function SignatureCapture(_a) {
|
|
22996
22922
|
var onAccept = _a.onAccept,
|
|
@@ -23025,7 +22951,7 @@
|
|
|
23025
22951
|
});
|
|
23026
22952
|
});
|
|
23027
22953
|
}
|
|
23028
|
-
return /*#__PURE__*/React.createElement(
|
|
22954
|
+
return /*#__PURE__*/React.createElement(Container$3, {
|
|
23029
22955
|
className: classNames.container
|
|
23030
22956
|
}, /*#__PURE__*/React.createElement(SignaturePaperBacking, {
|
|
23031
22957
|
className: classNames.inner
|
|
@@ -23063,8 +22989,9 @@
|
|
|
23063
22989
|
finished: true
|
|
23064
22990
|
}, verbiage.acceptBtnText)))));
|
|
23065
22991
|
};
|
|
23066
|
-
var
|
|
23067
|
-
var
|
|
22992
|
+
var Container$3 = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n position: relative;\n"], ["\n width: 100%;\n height: 100%;\n position: relative;\n"])));
|
|
22993
|
+
var AcceptBtn$1 = styled(LoaderButton)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
22994
|
+
var templateObject_1$b, templateObject_2$a;
|
|
23068
22995
|
|
|
23069
22996
|
var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
|
|
23070
22997
|
if (mergeAVStreams === void 0) {
|
|
@@ -23476,7 +23403,7 @@
|
|
|
23476
23403
|
var isSigning = requestedAction === 'CAPTURE_SIGNATURE';
|
|
23477
23404
|
var canClear = isSigning && !signaturePadEmpty;
|
|
23478
23405
|
var canSubmit = isSigning && signatureValid;
|
|
23479
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
23406
|
+
return /*#__PURE__*/React.createElement(Container$2, {
|
|
23480
23407
|
className: classNames.container
|
|
23481
23408
|
}, /*#__PURE__*/React.createElement(Inner$1, {
|
|
23482
23409
|
className: classNames.inner
|
|
@@ -23532,51 +23459,50 @@
|
|
|
23532
23459
|
finished: true
|
|
23533
23460
|
}, verbiage.acceptSignatureBtnText))))));
|
|
23534
23461
|
}
|
|
23535
|
-
var Container$
|
|
23462
|
+
var Container$2 = styled.div(templateObject_1$a || (templateObject_1$a = __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) {
|
|
23536
23463
|
var _a;
|
|
23537
23464
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
23538
23465
|
});
|
|
23539
|
-
var Inner$1 = styled.div(templateObject_2$
|
|
23466
|
+
var Inner$1 = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n"])));
|
|
23540
23467
|
var FaceGuideContainer$1 = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n position: relative;\n height: 50%;\n"], ["\n position: relative;\n height: 50%;\n"])));
|
|
23541
23468
|
var StyledSelfieCaptureAnimatedMask = styled(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n max-width: 100%;\n height: 100%;\n"], ["\n max-width: 100%;\n height: 100%;\n"])));
|
|
23542
|
-
var SignaturePadContainer = styled.div(templateObject_5$
|
|
23469
|
+
var SignaturePadContainer = styled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n position: relative;\n max-width: 100%;\n height: 50%;\n aspect-ratio: 2;\n"], ["\n position: relative;\n max-width: 100%;\n height: 50%;\n aspect-ratio: 2;\n"])));
|
|
23543
23470
|
var SignatureCanvasContainer = styled.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n"])), function (props) {
|
|
23544
23471
|
return props.$disabled ? 'opacity: 0.5; pointer-events: none;' : '';
|
|
23545
23472
|
});
|
|
23546
23473
|
var AcceptBtn = styled(LoaderButton)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
23547
|
-
var templateObject_1$
|
|
23474
|
+
var templateObject_1$a, templateObject_2$9, templateObject_3$8, templateObject_4$3, templateObject_5$3, templateObject_6$2, templateObject_7$1;
|
|
23548
23475
|
|
|
23549
23476
|
var DEFAULT_MIN_SIGNATURE_PAD_POINTS = 10;
|
|
23550
23477
|
var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
23551
|
-
var _b;
|
|
23552
23478
|
var onVideoCaptured = _a.onVideoCaptured,
|
|
23553
23479
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
23554
23480
|
onExit = _a.onExit,
|
|
23555
|
-
|
|
23556
|
-
restartVideoOnSignaturePadCleared =
|
|
23481
|
+
_b = _a.restartVideoOnSignaturePadCleared,
|
|
23482
|
+
restartVideoOnSignaturePadCleared = _b === void 0 ? true : _b,
|
|
23557
23483
|
guidesComponent = _a.guidesComponent,
|
|
23558
|
-
|
|
23559
|
-
minSignaturePadPoints =
|
|
23560
|
-
|
|
23561
|
-
classNames =
|
|
23562
|
-
|
|
23563
|
-
colors =
|
|
23564
|
-
|
|
23565
|
-
rawVerbiage =
|
|
23566
|
-
|
|
23567
|
-
debugMode =
|
|
23484
|
+
_c = _a.minSignaturePadPoints,
|
|
23485
|
+
minSignaturePadPoints = _c === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _c,
|
|
23486
|
+
_d = _a.classNames,
|
|
23487
|
+
classNames = _d === void 0 ? {} : _d,
|
|
23488
|
+
_e = _a.colors,
|
|
23489
|
+
colors = _e === void 0 ? {} : _e,
|
|
23490
|
+
_f = _a.verbiage,
|
|
23491
|
+
rawVerbiage = _f === void 0 ? {} : _f,
|
|
23492
|
+
_g = _a.debugMode,
|
|
23493
|
+
debugMode = _g === void 0 ? false : _g;
|
|
23568
23494
|
var camera = useCameraStore(function (state) {
|
|
23569
23495
|
return state.camera;
|
|
23570
23496
|
});
|
|
23571
23497
|
var onPredictionMade = React.useContext(SelfieGuidanceModelsContext).onPredictionMade;
|
|
23572
|
-
var
|
|
23573
|
-
signatureData =
|
|
23574
|
-
signatureDataUrl =
|
|
23575
|
-
signatureVideoData =
|
|
23576
|
-
startRecording =
|
|
23577
|
-
stopRecording =
|
|
23578
|
-
clearRecordedData =
|
|
23579
|
-
isRecording =
|
|
23498
|
+
var _h = useVideoSignatureContext(),
|
|
23499
|
+
signatureData = _h.signatureData,
|
|
23500
|
+
signatureDataUrl = _h.signatureDataUrl,
|
|
23501
|
+
signatureVideoData = _h.signatureVideoData,
|
|
23502
|
+
startRecording = _h.startRecording,
|
|
23503
|
+
stopRecording = _h.stopRecording,
|
|
23504
|
+
clearRecordedData = _h.clearRecordedData,
|
|
23505
|
+
isRecording = _h.isRecording;
|
|
23580
23506
|
React.useEffect(function () {
|
|
23581
23507
|
startRecording();
|
|
23582
23508
|
return stopRecording;
|
|
@@ -23591,9 +23517,9 @@
|
|
|
23591
23517
|
onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
|
|
23592
23518
|
}
|
|
23593
23519
|
}, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
|
|
23594
|
-
var
|
|
23595
|
-
numFramesWithoutFaces =
|
|
23596
|
-
setNumFramesWithoutFaces =
|
|
23520
|
+
var _j = React.useState(0),
|
|
23521
|
+
numFramesWithoutFaces = _j[0],
|
|
23522
|
+
setNumFramesWithoutFaces = _j[1];
|
|
23597
23523
|
React.useEffect(function () {
|
|
23598
23524
|
onPredictionMade(function (_a) {
|
|
23599
23525
|
var face = _a.face;
|
|
@@ -23608,8 +23534,8 @@
|
|
|
23608
23534
|
}
|
|
23609
23535
|
}, [numFramesWithoutFaces, onFaceNotDetected]);
|
|
23610
23536
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : VideoSignatureGuides;
|
|
23611
|
-
return /*#__PURE__*/React.createElement(
|
|
23612
|
-
className:
|
|
23537
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
23538
|
+
className: classNames.container
|
|
23613
23539
|
}, verbiage.guidanceMessageText && ( /*#__PURE__*/React.createElement(GuidanceMessageContainer, {
|
|
23614
23540
|
"$top": "10vh",
|
|
23615
23541
|
className: classNames.guidanceMessageContainer
|
|
@@ -23667,7 +23593,7 @@
|
|
|
23667
23593
|
style: {
|
|
23668
23594
|
display: 'none'
|
|
23669
23595
|
}
|
|
23670
|
-
})), /*#__PURE__*/React.createElement(ButtonsRow, {
|
|
23596
|
+
})), /*#__PURE__*/React.createElement(ButtonsRow$2, {
|
|
23671
23597
|
className: classNames.buttonsRow
|
|
23672
23598
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
23673
23599
|
variant: "warning",
|
|
@@ -23683,61 +23609,60 @@
|
|
|
23683
23609
|
finished: true
|
|
23684
23610
|
}, verbiage.doneBtnText))));
|
|
23685
23611
|
};
|
|
23686
|
-
var StyledVideo$1 = styled.video(templateObject_1$
|
|
23687
|
-
var templateObject_1$
|
|
23612
|
+
var StyledVideo$1 = styled.video(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"], ["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"])));
|
|
23613
|
+
var templateObject_1$9;
|
|
23688
23614
|
|
|
23689
23615
|
var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
23690
|
-
var _b;
|
|
23691
23616
|
var onComplete = _a.onComplete,
|
|
23692
23617
|
onVideoCaptured = _a.onVideoCaptured,
|
|
23693
23618
|
onRetryClicked = _a.onRetryClicked,
|
|
23694
23619
|
onExitCapture = _a.onExitCapture,
|
|
23695
23620
|
onUserCancel = _a.onUserCancel,
|
|
23696
23621
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
23697
|
-
|
|
23698
|
-
loadingOverlayMode =
|
|
23622
|
+
_b = _a.loadingOverlayMode,
|
|
23623
|
+
loadingOverlayMode = _b === void 0 ? 'default' : _b,
|
|
23699
23624
|
customOverlayContent = _a.customOverlayContent,
|
|
23700
|
-
|
|
23701
|
-
skipSuccessScreen =
|
|
23702
|
-
|
|
23703
|
-
captureAudio =
|
|
23704
|
-
|
|
23705
|
-
minSignaturePadPoints =
|
|
23706
|
-
|
|
23707
|
-
allowSignatureAfterLivenessCheckFailure =
|
|
23708
|
-
|
|
23709
|
-
restartVideoOnSignaturePadCleared =
|
|
23625
|
+
_c = _a.skipSuccessScreen,
|
|
23626
|
+
skipSuccessScreen = _c === void 0 ? false : _c,
|
|
23627
|
+
_d = _a.captureAudio,
|
|
23628
|
+
captureAudio = _d === void 0 ? false : _d,
|
|
23629
|
+
_e = _a.minSignaturePadPoints,
|
|
23630
|
+
minSignaturePadPoints = _e === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _e,
|
|
23631
|
+
_f = _a.allowSignatureAfterLivenessCheckFailure,
|
|
23632
|
+
allowSignatureAfterLivenessCheckFailure = _f === void 0 ? false : _f,
|
|
23633
|
+
_g = _a.restartVideoOnSignaturePadCleared,
|
|
23634
|
+
restartVideoOnSignaturePadCleared = _g === void 0 ? true : _g,
|
|
23710
23635
|
faceLivenessProps = _a.faceLivenessProps,
|
|
23711
|
-
|
|
23712
|
-
assets =
|
|
23713
|
-
|
|
23714
|
-
classNames =
|
|
23715
|
-
|
|
23716
|
-
colors =
|
|
23717
|
-
|
|
23718
|
-
verbiage =
|
|
23719
|
-
|
|
23720
|
-
debugMode =
|
|
23721
|
-
var
|
|
23722
|
-
selfieImage =
|
|
23723
|
-
setSelfieImage =
|
|
23724
|
-
setSignatureData =
|
|
23725
|
-
setSignatureVideoUrl =
|
|
23726
|
-
logSelfieCaptureAttempt =
|
|
23636
|
+
_h = _a.assets,
|
|
23637
|
+
assets = _h === void 0 ? {} : _h,
|
|
23638
|
+
_j = _a.classNames,
|
|
23639
|
+
classNames = _j === void 0 ? {} : _j,
|
|
23640
|
+
_k = _a.colors,
|
|
23641
|
+
colors = _k === void 0 ? {} : _k,
|
|
23642
|
+
_l = _a.verbiage,
|
|
23643
|
+
verbiage = _l === void 0 ? {} : _l,
|
|
23644
|
+
_m = _a.debugMode,
|
|
23645
|
+
debugMode = _m === void 0 ? false : _m;
|
|
23646
|
+
var _o = React.useContext(SubmissionContext),
|
|
23647
|
+
selfieImage = _o.selfieImage,
|
|
23648
|
+
setSelfieImage = _o.setSelfieImage,
|
|
23649
|
+
setSignatureData = _o.setSignatureData,
|
|
23650
|
+
setSignatureVideoUrl = _o.setSignatureVideoUrl,
|
|
23651
|
+
logSelfieCaptureAttempt = _o.logSelfieCaptureAttempt;
|
|
23727
23652
|
var cameraAccessDenied = useCameraStore(useShallow(function (state) {
|
|
23728
23653
|
return {
|
|
23729
23654
|
cameraAccessDenied: state.cameraAccessDenied
|
|
23730
23655
|
};
|
|
23731
23656
|
})).cameraAccessDenied;
|
|
23732
|
-
var
|
|
23733
|
-
captureState =
|
|
23734
|
-
setCaptureState =
|
|
23657
|
+
var _p = React.useState('CHECKING_LIVENESS'),
|
|
23658
|
+
captureState = _p[0],
|
|
23659
|
+
setCaptureState = _p[1];
|
|
23735
23660
|
var operationStartedAt = React.useRef();
|
|
23736
23661
|
var captureStartedAt = React.useRef();
|
|
23737
23662
|
var captureEndedAt = React.useRef();
|
|
23738
|
-
var
|
|
23739
|
-
start =
|
|
23740
|
-
stop =
|
|
23663
|
+
var _q = React.useContext(SelfieGuidanceModelsContext),
|
|
23664
|
+
start = _q.start,
|
|
23665
|
+
stop = _q.stop;
|
|
23741
23666
|
React.useEffect(function () {
|
|
23742
23667
|
operationStartedAt.current = new Date();
|
|
23743
23668
|
}, []);
|
|
@@ -23773,9 +23698,9 @@
|
|
|
23773
23698
|
setSelfieImage(selfieFromRequest);
|
|
23774
23699
|
}
|
|
23775
23700
|
}, [logCaptureMetadata, onFaceLivenessSuccessProp, selfieImage, setSelfieImage]);
|
|
23776
|
-
var
|
|
23777
|
-
signatureImageUrl =
|
|
23778
|
-
setSignatureImageUrl =
|
|
23701
|
+
var _r = React.useState(null),
|
|
23702
|
+
signatureImageUrl = _r[0],
|
|
23703
|
+
setSignatureImageUrl = _r[1];
|
|
23779
23704
|
var onSignatureCaptureCompleted = React.useCallback(function (videoData, signatureData, signatureImageData) {
|
|
23780
23705
|
setSignatureData(signatureData);
|
|
23781
23706
|
setSignatureVideoUrl(URL.createObjectURL(videoData));
|
|
@@ -23786,9 +23711,9 @@
|
|
|
23786
23711
|
var onSignatureCaptureFacesNotDetected = React.useCallback(function () {
|
|
23787
23712
|
setCaptureState('CHECKING_LIVENESS');
|
|
23788
23713
|
}, []);
|
|
23789
|
-
var
|
|
23790
|
-
attempt =
|
|
23791
|
-
setAttempt =
|
|
23714
|
+
var _s = React.useState(0),
|
|
23715
|
+
attempt = _s[0],
|
|
23716
|
+
setAttempt = _s[1];
|
|
23792
23717
|
var onRetry = React.useCallback(function () {
|
|
23793
23718
|
onRetryClicked === null || onRetryClicked === void 0 ? void 0 : onRetryClicked();
|
|
23794
23719
|
setAttempt(function (n) {
|
|
@@ -23825,8 +23750,6 @@
|
|
|
23825
23750
|
}, [faceLivenessOnLoadingOverlayDismissed, onLoadingOverlayDismissed]);
|
|
23826
23751
|
return /*#__PURE__*/React.createElement(VideoSignatureContextProvider, {
|
|
23827
23752
|
captureAudio: captureAudio
|
|
23828
|
-
}, /*#__PURE__*/React.createElement(PageContainer, {
|
|
23829
|
-
className: "flex ".concat((_b = classNames === null || classNames === void 0 ? void 0 : classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
23830
23753
|
}, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
23831
23754
|
className: classNames.cameraFeed
|
|
23832
23755
|
}), function () {
|
|
@@ -23876,7 +23799,7 @@
|
|
|
23876
23799
|
default:
|
|
23877
23800
|
return null;
|
|
23878
23801
|
}
|
|
23879
|
-
}())
|
|
23802
|
+
}());
|
|
23880
23803
|
};
|
|
23881
23804
|
function VideoSignatureWizardGuides(_a) {
|
|
23882
23805
|
var status = _a.status,
|
|
@@ -23995,7 +23918,7 @@
|
|
|
23995
23918
|
};
|
|
23996
23919
|
}, [idCardGuideWidth, idCardGuideHeight, aspectRatio]);
|
|
23997
23920
|
var disableIdGuides = ((_u = (_t = theme.idVideoCapture) === null || _t === void 0 ? void 0 : _t.idCardGuides) === null || _u === void 0 ? void 0 : _u.disableDuringLivenessCheck) && requestedAction === 'VERIFY_LIVENESS';
|
|
23998
|
-
return /*#__PURE__*/React.createElement(Container, {
|
|
23921
|
+
return /*#__PURE__*/React.createElement(Container$1, {
|
|
23999
23922
|
className: classNames.container
|
|
24000
23923
|
}, /*#__PURE__*/React.createElement(Inner, null, /*#__PURE__*/React.createElement(FaceGuideContainer, {
|
|
24001
23924
|
className: classNames.faceGuideContainer
|
|
@@ -24034,25 +23957,25 @@
|
|
|
24034
23957
|
borderWidth: idCardGuideBorderWidth,
|
|
24035
23958
|
borderColor: idCardGuideBorderColor,
|
|
24036
23959
|
imageStyle: idCardImageStyle
|
|
24037
|
-
}))), /*#__PURE__*/React.createElement(IdCardGuideInstructionsContainer, {
|
|
23960
|
+
}))))), /*#__PURE__*/React.createElement(IdCardGuideInstructionsContainer, {
|
|
24038
23961
|
className: classNames.idCardGuideInstructionsContainer
|
|
24039
23962
|
}, /*#__PURE__*/React.createElement(IdCardGuideInstructions, {
|
|
24040
23963
|
className: classNames.idCardGuideInstructions,
|
|
24041
23964
|
"$textColor": (_w = (_v = theme.idVideoCapture) === null || _v === void 0 ? void 0 : _v.idCardGuides) === null || _w === void 0 ? void 0 : _w.instructionsTextColor,
|
|
24042
23965
|
"$background": (_y = (_x = theme.idVideoCapture) === null || _x === void 0 ? void 0 : _x.idCardGuides) === null || _y === void 0 ? void 0 : _y.instructionsBackgroundColor
|
|
24043
|
-
}, instructionText))))
|
|
23966
|
+
}, instructionText))));
|
|
24044
23967
|
};
|
|
24045
|
-
var Container = styled.div(templateObject_1$
|
|
23968
|
+
var Container$1 = styled.div(templateObject_1$8 || (templateObject_1$8 = __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) {
|
|
24046
23969
|
var _a;
|
|
24047
23970
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
24048
23971
|
});
|
|
24049
|
-
var Inner = styled.div(templateObject_2$
|
|
23972
|
+
var Inner = styled.div(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
24050
23973
|
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"])));
|
|
24051
23974
|
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"])));
|
|
24052
|
-
var IdCardGuideInner = styled.div(templateObject_5$
|
|
24053
|
-
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
|
|
24054
|
-
var IdCardGuideInstructions = styled(GuidanceMessage)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-content: center;\n
|
|
24055
|
-
var templateObject_1$
|
|
23975
|
+
var IdCardGuideInner = styled.div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n width: 100%;\n"], ["\n position: relative;\n height: 100%;\n width: 100%;\n"])));
|
|
23976
|
+
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 position: absolute;\n bottom: 16px;\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 position: absolute;\n bottom: 16px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"])));
|
|
23977
|
+
var IdCardGuideInstructions = styled(GuidanceMessage)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-content: center;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"], ["\n align-content: center;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"])));
|
|
23978
|
+
var templateObject_1$8, templateObject_2$8, templateObject_3$7, templateObject_4$2, templateObject_5$2, templateObject_6$1, templateObject_7;
|
|
24056
23979
|
|
|
24057
23980
|
var ReadTextPrompt = function ReadTextPrompt(_a) {
|
|
24058
23981
|
var text = _a.text,
|
|
@@ -24121,8 +24044,8 @@
|
|
|
24121
24044
|
finished: true
|
|
24122
24045
|
}, verbiage.doneBtnText)));
|
|
24123
24046
|
};
|
|
24124
|
-
var ReadTextPromptContainer = styled.div(templateObject_1$
|
|
24125
|
-
var ReadTextPromptHeading = styled.div(templateObject_2$
|
|
24047
|
+
var ReadTextPromptContainer = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n flex-direction: column;\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n flex-direction: column;\n"])));
|
|
24048
|
+
var ReadTextPromptHeading = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n padding: 20px;\n font-weight: bold;\n margin: auto auto 32px;\n\n ", ";\n ", ";\n ", ";\n"], ["\n padding: 20px;\n font-weight: bold;\n margin: auto auto 32px;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
|
|
24126
24049
|
var _a, _b, _c, _d, _e, _f;
|
|
24127
24050
|
return ((_c = (_b = (_a = props.theme.idVideoCapture) === null || _a === void 0 ? void 0 : _a.readTextPrompt) === null || _b === void 0 ? void 0 : _b.heading) === 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.heading) === null || _f === void 0 ? void 0 : _f.backgroundColor, ";") : "";
|
|
24128
24051
|
}, function (props) {
|
|
@@ -24142,8 +24065,8 @@
|
|
|
24142
24065
|
var _a, _b, _c, _d, _e, _f;
|
|
24143
24066
|
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, ";") : "";
|
|
24144
24067
|
});
|
|
24145
|
-
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"])));
|
|
24146
|
-
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) {
|
|
24068
|
+
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"])));
|
|
24069
|
+
var ReadTextPromptTimeRemaining = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n padding: 20px;\n\n ", ";\n ", ";\n ", ";\n"], ["\n padding: 20px;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
|
|
24147
24070
|
var _a, _b, _c, _d, _e, _f;
|
|
24148
24071
|
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, ";") : "";
|
|
24149
24072
|
}, function (props) {
|
|
@@ -24154,7 +24077,7 @@
|
|
|
24154
24077
|
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.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.timeRemaining) === null || _f === void 0 ? void 0 : _f.borderRadius, ";") : "";
|
|
24155
24078
|
});
|
|
24156
24079
|
var DoneButton = styled(LoaderButton)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n margin: auto 0;\n"], ["\n margin: auto 0;\n"])));
|
|
24157
|
-
var templateObject_1$
|
|
24080
|
+
var templateObject_1$7, templateObject_2$7, templateObject_3$6, templateObject_4$1, templateObject_5$1, templateObject_6;
|
|
24158
24081
|
|
|
24159
24082
|
var edgeBoundary = 0.05;
|
|
24160
24083
|
var defaultVideoIdCaptureThresholds = {
|
|
@@ -24191,103 +24114,103 @@
|
|
|
24191
24114
|
flipShortcutThreshold: 0.7
|
|
24192
24115
|
};
|
|
24193
24116
|
var IdVideoCapture = function IdVideoCapture(_a) {
|
|
24194
|
-
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u
|
|
24117
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
|
24195
24118
|
var onComplete = _a.onComplete,
|
|
24196
24119
|
onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
|
|
24197
24120
|
onIdBackImageCaptured = _a.onIdBackImageCaptured,
|
|
24198
24121
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
24199
24122
|
onRecordingFailed = _a.onRecordingFailed,
|
|
24200
24123
|
onExitCapture = _a.onExitCapture,
|
|
24201
|
-
|
|
24202
|
-
idCaptureModelsEnabled =
|
|
24203
|
-
|
|
24204
|
-
idDocumentType =
|
|
24205
|
-
|
|
24206
|
-
idCaptureGuideImages =
|
|
24207
|
-
|
|
24208
|
-
idCardFrontDelay =
|
|
24209
|
-
|
|
24210
|
-
videoIdCaptureThresholds =
|
|
24211
|
-
|
|
24212
|
-
skipShowIdCardBack =
|
|
24213
|
-
|
|
24214
|
-
captureCountdownSeconds =
|
|
24124
|
+
_v = _a.idCaptureModelsEnabled,
|
|
24125
|
+
idCaptureModelsEnabled = _v === void 0 ? true : _v,
|
|
24126
|
+
_w = _a.idDocumentType,
|
|
24127
|
+
idDocumentType = _w === void 0 ? 'idCard' : _w,
|
|
24128
|
+
_x = _a.idCaptureGuideImages,
|
|
24129
|
+
idCaptureGuideImages = _x === void 0 ? defaultIdCaptureGuideImages : _x,
|
|
24130
|
+
_y = _a.idCardFrontDelay,
|
|
24131
|
+
idCardFrontDelay = _y === void 0 ? 1000 : _y,
|
|
24132
|
+
_z = _a.videoIdCaptureThresholds,
|
|
24133
|
+
videoIdCaptureThresholds = _z === void 0 ? defaultVideoIdCaptureThresholds : _z,
|
|
24134
|
+
_0 = _a.skipShowIdCardBack,
|
|
24135
|
+
skipShowIdCardBack = _0 === void 0 ? false : _0,
|
|
24136
|
+
_1 = _a.captureCountdownSeconds,
|
|
24137
|
+
captureCountdownSeconds = _1 === void 0 ? 3 : _1,
|
|
24215
24138
|
readTextPrompt = _a.readTextPrompt,
|
|
24216
|
-
|
|
24217
|
-
readTextTimeoutDurationMs =
|
|
24218
|
-
|
|
24219
|
-
readTextMinReadingMs =
|
|
24220
|
-
|
|
24221
|
-
disableFaceDetectionWhileAudioCapture =
|
|
24222
|
-
|
|
24223
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
24224
|
-
|
|
24225
|
-
mergeAVStreams =
|
|
24226
|
-
|
|
24227
|
-
classNames =
|
|
24228
|
-
|
|
24229
|
-
colors =
|
|
24230
|
-
|
|
24231
|
-
rawVerbiage =
|
|
24232
|
-
|
|
24233
|
-
debugMode =
|
|
24234
|
-
var
|
|
24235
|
-
ref =
|
|
24236
|
-
|
|
24237
|
-
width =
|
|
24238
|
-
|
|
24239
|
-
height =
|
|
24240
|
-
var
|
|
24241
|
-
camera =
|
|
24242
|
-
videoRef =
|
|
24243
|
-
videoLoaded =
|
|
24244
|
-
cameraReady =
|
|
24245
|
-
microphoneReady =
|
|
24246
|
-
audioStream =
|
|
24247
|
-
isRearFacing =
|
|
24248
|
-
releaseCameraAccess =
|
|
24249
|
-
var
|
|
24250
|
-
detectedObjects =
|
|
24251
|
-
setDetectedObjects =
|
|
24252
|
-
var
|
|
24253
|
-
face =
|
|
24254
|
-
setFace =
|
|
24255
|
-
var
|
|
24256
|
-
idModelsReady =
|
|
24257
|
-
startIdModels =
|
|
24258
|
-
stopIdModels =
|
|
24259
|
-
onIdPredictionMade =
|
|
24260
|
-
setThresholds =
|
|
24261
|
-
setRequiredDocumentType =
|
|
24262
|
-
setDocumentDetectionBoundaries =
|
|
24263
|
-
bestFrameDetails =
|
|
24264
|
-
resetBestFrame =
|
|
24265
|
-
idModelError =
|
|
24266
|
-
var
|
|
24267
|
-
videoStartsAt =
|
|
24268
|
-
setVideoStartsAt =
|
|
24269
|
-
var
|
|
24270
|
-
setIdCaptureVideoAudioStartsAt =
|
|
24271
|
-
setExpectedAudioText =
|
|
24272
|
-
var
|
|
24273
|
-
startSelfieGuidance =
|
|
24274
|
-
stopSelfieGuidance =
|
|
24275
|
-
onSelfiePredictionMade =
|
|
24276
|
-
selfieModelError =
|
|
24277
|
-
var
|
|
24278
|
-
isRecordingVideo =
|
|
24279
|
-
startRecordingVideo =
|
|
24280
|
-
startRecordingAudio =
|
|
24281
|
-
stopRecordingVideo =
|
|
24282
|
-
stopRecordingAudio =
|
|
24283
|
-
videoRecordingUnintentionallyStopped =
|
|
24284
|
-
audioRecordingUnintentionallyStopped =
|
|
24285
|
-
videoUrl =
|
|
24286
|
-
audioUrl =
|
|
24139
|
+
_2 = _a.readTextTimeoutDurationMs,
|
|
24140
|
+
readTextTimeoutDurationMs = _2 === void 0 ? 15000 : _2,
|
|
24141
|
+
_3 = _a.readTextMinReadingMs,
|
|
24142
|
+
readTextMinReadingMs = _3 === void 0 ? 10000 : _3,
|
|
24143
|
+
_4 = _a.disableFaceDetectionWhileAudioCapture,
|
|
24144
|
+
disableFaceDetectionWhileAudioCapture = _4 === void 0 ? false : _4,
|
|
24145
|
+
_5 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
24146
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _5 === void 0 ? 2000 : _5,
|
|
24147
|
+
_6 = _a.mergeAVStreams,
|
|
24148
|
+
mergeAVStreams = _6 === void 0 ? false : _6,
|
|
24149
|
+
_7 = _a.classNames,
|
|
24150
|
+
classNames = _7 === void 0 ? {} : _7,
|
|
24151
|
+
_8 = _a.colors,
|
|
24152
|
+
colors = _8 === void 0 ? {} : _8,
|
|
24153
|
+
_9 = _a.verbiage,
|
|
24154
|
+
rawVerbiage = _9 === void 0 ? {} : _9,
|
|
24155
|
+
_10 = _a.debugMode,
|
|
24156
|
+
debugMode = _10 === void 0 ? false : _10;
|
|
24157
|
+
var _11 = useResizeObserver(),
|
|
24158
|
+
ref = _11.ref,
|
|
24159
|
+
_12 = _11.width,
|
|
24160
|
+
width = _12 === void 0 ? 1 : _12,
|
|
24161
|
+
_13 = _11.height,
|
|
24162
|
+
height = _13 === void 0 ? 1 : _13;
|
|
24163
|
+
var _14 = useCameraStore(),
|
|
24164
|
+
camera = _14.camera,
|
|
24165
|
+
videoRef = _14.videoRef,
|
|
24166
|
+
videoLoaded = _14.videoLoaded,
|
|
24167
|
+
cameraReady = _14.cameraReady,
|
|
24168
|
+
microphoneReady = _14.microphoneReady,
|
|
24169
|
+
audioStream = _14.audioStream,
|
|
24170
|
+
isRearFacing = _14.isRearFacing,
|
|
24171
|
+
releaseCameraAccess = _14.releaseCameraAccess;
|
|
24172
|
+
var _15 = React.useState([]),
|
|
24173
|
+
detectedObjects = _15[0],
|
|
24174
|
+
setDetectedObjects = _15[1];
|
|
24175
|
+
var _16 = React.useState(null),
|
|
24176
|
+
face = _16[0],
|
|
24177
|
+
setFace = _16[1];
|
|
24178
|
+
var _17 = React.useContext(IdCaptureModelsContext),
|
|
24179
|
+
idModelsReady = _17.ready,
|
|
24180
|
+
startIdModels = _17.start,
|
|
24181
|
+
stopIdModels = _17.stop,
|
|
24182
|
+
onIdPredictionMade = _17.onPredictionMade,
|
|
24183
|
+
setThresholds = _17.setThresholds,
|
|
24184
|
+
setRequiredDocumentType = _17.setRequiredDocumentType,
|
|
24185
|
+
setDocumentDetectionBoundaries = _17.setDocumentDetectionBoundaries,
|
|
24186
|
+
bestFrameDetails = _17.bestFrameDetails,
|
|
24187
|
+
resetBestFrame = _17.resetBestFrame,
|
|
24188
|
+
idModelError = _17.modelError;
|
|
24189
|
+
var _18 = React.useState(null),
|
|
24190
|
+
videoStartsAt = _18[0],
|
|
24191
|
+
setVideoStartsAt = _18[1];
|
|
24192
|
+
var _19 = React.useContext(SubmissionContext),
|
|
24193
|
+
setIdCaptureVideoAudioStartsAt = _19.setIdCaptureVideoAudioStartsAt,
|
|
24194
|
+
setExpectedAudioText = _19.setExpectedAudioText;
|
|
24195
|
+
var _20 = React.useContext(SelfieGuidanceModelsContext),
|
|
24196
|
+
startSelfieGuidance = _20.start,
|
|
24197
|
+
stopSelfieGuidance = _20.stop,
|
|
24198
|
+
onSelfiePredictionMade = _20.onPredictionMade,
|
|
24199
|
+
selfieModelError = _20.error;
|
|
24200
|
+
var _21 = useVideoRecorder(camera, audioStream, mergeAVStreams),
|
|
24201
|
+
isRecordingVideo = _21.isRecordingVideo,
|
|
24202
|
+
startRecordingVideo = _21.startRecordingVideo,
|
|
24203
|
+
startRecordingAudio = _21.startRecordingAudio,
|
|
24204
|
+
stopRecordingVideo = _21.stopRecordingVideo,
|
|
24205
|
+
stopRecordingAudio = _21.stopRecordingAudio,
|
|
24206
|
+
videoRecordingUnintentionallyStopped = _21.videoRecordingUnintentionallyStopped,
|
|
24207
|
+
audioRecordingUnintentionallyStopped = _21.audioRecordingUnintentionallyStopped,
|
|
24208
|
+
videoUrl = _21.videoUrl,
|
|
24209
|
+
audioUrl = _21.audioUrl;
|
|
24287
24210
|
var countdownTimeoutRef = React.useRef(undefined);
|
|
24288
|
-
var
|
|
24289
|
-
countdownRemaining =
|
|
24290
|
-
setCountdownRemaining =
|
|
24211
|
+
var _22 = React.useState(-1),
|
|
24212
|
+
countdownRemaining = _22[0],
|
|
24213
|
+
setCountdownRemaining = _22[1];
|
|
24291
24214
|
React.useEffect(function () {
|
|
24292
24215
|
if (!isRecordingVideo && !videoUrl) {
|
|
24293
24216
|
startRecordingVideo();
|
|
@@ -24307,9 +24230,9 @@
|
|
|
24307
24230
|
onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
|
|
24308
24231
|
}
|
|
24309
24232
|
}, [audioRecordingUnintentionallyStopped, microphoneReady, onRecordingFailed, readTextPrompt, videoRecordingUnintentionallyStopped]);
|
|
24310
|
-
var
|
|
24311
|
-
requestedAction =
|
|
24312
|
-
setRequestedAction =
|
|
24233
|
+
var _23 = React.useState(idDocumentType === 'idCard' ? 'SHOW_ID_FRONT' : 'SHOW_PASSPORT'),
|
|
24234
|
+
requestedAction = _23[0],
|
|
24235
|
+
setRequestedAction = _23[1];
|
|
24313
24236
|
var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
|
|
24314
24237
|
React.useEffect(function startModelsWhenCapturing() {
|
|
24315
24238
|
if (!shouldRunIdModels) return;
|
|
@@ -24348,23 +24271,23 @@
|
|
|
24348
24271
|
bottom: 0
|
|
24349
24272
|
});
|
|
24350
24273
|
}, [setDocumentDetectionBoundaries]);
|
|
24351
|
-
var
|
|
24352
|
-
currentDetectionScore =
|
|
24353
|
-
setCurrentDetectionScore =
|
|
24354
|
-
var
|
|
24355
|
-
currentDetectedDocumentType =
|
|
24356
|
-
setCurrentDetectedDocumentType =
|
|
24274
|
+
var _24 = React.useState(0),
|
|
24275
|
+
currentDetectionScore = _24[0],
|
|
24276
|
+
setCurrentDetectionScore = _24[1];
|
|
24277
|
+
var _25 = React.useState('none'),
|
|
24278
|
+
currentDetectedDocumentType = _25[0],
|
|
24279
|
+
setCurrentDetectedDocumentType = _25[1];
|
|
24280
|
+
var _26 = React.useState(0),
|
|
24281
|
+
currentFocusScore = _26[0],
|
|
24282
|
+
setCurrentFocusScore = _26[1];
|
|
24357
24283
|
var _27 = React.useState(0),
|
|
24358
|
-
|
|
24359
|
-
|
|
24360
|
-
var _28 = React.useState(0),
|
|
24361
|
-
goodFramesCount = _28[0],
|
|
24362
|
-
setGoodFramesCount = _28[1];
|
|
24284
|
+
goodFramesCount = _27[0],
|
|
24285
|
+
setGoodFramesCount = _27[1];
|
|
24363
24286
|
var goodFramesThreshold = requestedAction === 'SHOW_PASSPORT' ? adjustedThresholds.goodFrames.passport : requestedAction === 'SHOW_ID_FRONT' ? adjustedThresholds.goodFrames.idCardFront : adjustedThresholds.goodFrames.idCardBack;
|
|
24364
24287
|
var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
|
|
24365
|
-
var
|
|
24366
|
-
isSinglePage =
|
|
24367
|
-
setIsSinglePage =
|
|
24288
|
+
var _28 = React.useState(false),
|
|
24289
|
+
isSinglePage = _28[0],
|
|
24290
|
+
setIsSinglePage = _28[1];
|
|
24368
24291
|
React.useEffect(function () {
|
|
24369
24292
|
if (!idCaptureModelsEnabled || idModelError) return;
|
|
24370
24293
|
onIdPredictionMade(function (prediction) {
|
|
@@ -24384,9 +24307,9 @@
|
|
|
24384
24307
|
} : 0);
|
|
24385
24308
|
});
|
|
24386
24309
|
}, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, adjustedThresholds.flipShortcutThreshold]);
|
|
24387
|
-
var
|
|
24388
|
-
idFrontCaptureStartedAt =
|
|
24389
|
-
setFirstGoodFrameTime =
|
|
24310
|
+
var _29 = React.useState(null),
|
|
24311
|
+
idFrontCaptureStartedAt = _29[0],
|
|
24312
|
+
setFirstGoodFrameTime = _29[1];
|
|
24390
24313
|
React.useEffect(function () {
|
|
24391
24314
|
if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
|
|
24392
24315
|
}, [goodFramesCount]);
|
|
@@ -24407,9 +24330,9 @@
|
|
|
24407
24330
|
var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
|
|
24408
24331
|
var faceBox = face === null || face === void 0 ? void 0 : face.box;
|
|
24409
24332
|
var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
|
|
24410
|
-
var
|
|
24411
|
-
countdownStartedAt =
|
|
24412
|
-
setCountdownStartedAt =
|
|
24333
|
+
var _30 = React.useState(),
|
|
24334
|
+
countdownStartedAt = _30[0],
|
|
24335
|
+
setCountdownStartedAt = _30[1];
|
|
24413
24336
|
var photoCanvas = React.useRef(null);
|
|
24414
24337
|
var frameLock = React.useRef(false);
|
|
24415
24338
|
var captureFrame = React.useCallback(function () {
|
|
@@ -24519,9 +24442,9 @@
|
|
|
24519
24442
|
stopSelfieGuidance();
|
|
24520
24443
|
};
|
|
24521
24444
|
}, [startSelfieGuidance, stopSelfieGuidance]);
|
|
24522
|
-
var
|
|
24523
|
-
numFramesWithoutFaces =
|
|
24524
|
-
setNumFramesWithoutFaces =
|
|
24445
|
+
var _31 = React.useState(0),
|
|
24446
|
+
numFramesWithoutFaces = _31[0],
|
|
24447
|
+
setNumFramesWithoutFaces = _31[1];
|
|
24525
24448
|
onSelfiePredictionMade(f(React.useCallback(function (_a) {
|
|
24526
24449
|
var face = _a.face;
|
|
24527
24450
|
if (selfieModelError) return;
|
|
@@ -24537,12 +24460,12 @@
|
|
|
24537
24460
|
}
|
|
24538
24461
|
}, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
|
|
24539
24462
|
var theme = styled.useTheme();
|
|
24540
|
-
var
|
|
24463
|
+
var _32 = useTranslations(rawVerbiage, {
|
|
24541
24464
|
faceNotCenteredText: 'Please move your face to the center...',
|
|
24542
24465
|
captureBtnText: 'Capture'
|
|
24543
24466
|
}),
|
|
24544
|
-
captureBtnText =
|
|
24545
|
-
faceNotCenteredText =
|
|
24467
|
+
captureBtnText = _32.captureBtnText,
|
|
24468
|
+
faceNotCenteredText = _32.faceNotCenteredText;
|
|
24546
24469
|
var debugScalingDetails = useDebugScalingDetails({
|
|
24547
24470
|
enabled: debugMode,
|
|
24548
24471
|
pageWidth: width,
|
|
@@ -24552,9 +24475,9 @@
|
|
|
24552
24475
|
});
|
|
24553
24476
|
var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK', 'SHOW_PASSPORT'].includes(requestedAction);
|
|
24554
24477
|
var guidanceText = !faceCentered ? faceNotCenteredText : undefined;
|
|
24555
|
-
return /*#__PURE__*/React.createElement(
|
|
24478
|
+
return /*#__PURE__*/React.createElement(Container, {
|
|
24556
24479
|
ref: ref,
|
|
24557
|
-
className:
|
|
24480
|
+
className: classNames.container
|
|
24558
24481
|
}, /*#__PURE__*/React.createElement(InvisibleCanvas, {
|
|
24559
24482
|
ref: photoCanvas
|
|
24560
24483
|
}), requestedAction === 'READ_TEXT' ? ( /*#__PURE__*/React.createElement(ReadTextPrompt, {
|
|
@@ -24593,9 +24516,9 @@
|
|
|
24593
24516
|
className: classNames.guidanceMessageContainer
|
|
24594
24517
|
}, /*#__PURE__*/React.createElement(GuidanceMessage, {
|
|
24595
24518
|
className: classNames.guidanceMessage,
|
|
24596
|
-
"$background": (
|
|
24597
|
-
"$textColor": (
|
|
24598
|
-
}, 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:", ' ', (
|
|
24519
|
+
"$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',
|
|
24520
|
+
"$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'
|
|
24521
|
+
}, 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, {
|
|
24599
24522
|
className: classNames.countdownContainer
|
|
24600
24523
|
}, /*#__PURE__*/React.createElement(Countdown, {
|
|
24601
24524
|
className: classNames.countdown
|
|
@@ -24613,16 +24536,17 @@
|
|
|
24613
24536
|
className: classNames.exitCaptureBtn
|
|
24614
24537
|
}));
|
|
24615
24538
|
};
|
|
24616
|
-
var
|
|
24617
|
-
var
|
|
24618
|
-
var
|
|
24619
|
-
var
|
|
24539
|
+
var Container = styled.div(templateObject_1$6 || (templateObject_1$6 = __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"])));
|
|
24540
|
+
var CountdownContainer = styled.div(templateObject_2$6 || (templateObject_2$6 = __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"])));
|
|
24541
|
+
var Countdown = styled.div(templateObject_3$5 || (templateObject_3$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"])));
|
|
24542
|
+
var CaptureButtonContainer = styled.div(templateObject_4 || (templateObject_4 = __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"])));
|
|
24543
|
+
var CaptureButton = styled(LoaderButton)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n margin: 0 auto 25px;\n"], ["\n margin: 0 auto 25px;\n"])));
|
|
24620
24544
|
function evaluateShouldSkip(value) {
|
|
24621
24545
|
if (value === true) return true;
|
|
24622
24546
|
if (typeof value === 'function') return value();
|
|
24623
24547
|
return false;
|
|
24624
24548
|
}
|
|
24625
|
-
var templateObject_1$
|
|
24549
|
+
var templateObject_1$6, templateObject_2$6, templateObject_3$5, templateObject_4, templateObject_5;
|
|
24626
24550
|
|
|
24627
24551
|
var IdVideoCaptureSuccess = function IdVideoCaptureSuccess(_a) {
|
|
24628
24552
|
var videoUrl = _a.videoUrl,
|
|
@@ -24723,7 +24647,7 @@
|
|
|
24723
24647
|
})) : ( /*#__PURE__*/React.createElement("img", {
|
|
24724
24648
|
src: idBackImageUrl,
|
|
24725
24649
|
alt: "ID Back Image"
|
|
24726
|
-
}))), /*#__PURE__*/React.createElement(ButtonsRow, {
|
|
24650
|
+
}))), /*#__PURE__*/React.createElement(ButtonsRow$2, {
|
|
24727
24651
|
className: classNames.buttonsRow
|
|
24728
24652
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
24729
24653
|
variant: "warning",
|
|
@@ -24742,13 +24666,13 @@
|
|
|
24742
24666
|
finished: true
|
|
24743
24667
|
}, verbiage.doneBtnText))));
|
|
24744
24668
|
};
|
|
24745
|
-
var StyledVideo = styled.video(templateObject_1$
|
|
24746
|
-
var AssetSelectorOptions = styled.div(templateObject_2$
|
|
24669
|
+
var StyledVideo = styled.video(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"], ["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"])));
|
|
24670
|
+
var AssetSelectorOptions = styled.div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n margin-bottom: 15px;\n display: flex;\n justify-content: center;\n"], ["\n margin-bottom: 15px;\n display: flex;\n justify-content: center;\n"])));
|
|
24747
24671
|
var AssetSelectorOption = styled.div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n padding: 0 8px;\n display: flex;\n gap: 5px;\n align-items: center;\n\n & > input {\n margin: 0;\n padding: 0;\n display: block;\n }\n"], ["\n padding: 0 8px;\n display: flex;\n gap: 5px;\n align-items: center;\n\n & > input {\n margin: 0;\n padding: 0;\n display: block;\n }\n"])));
|
|
24748
|
-
var templateObject_1$
|
|
24672
|
+
var templateObject_1$5, templateObject_2$5, templateObject_3$4;
|
|
24749
24673
|
|
|
24750
24674
|
var VideoIdWizard = function VideoIdWizard(_a) {
|
|
24751
|
-
var _b, _c, _d, _e, _f, _g, _h, _j
|
|
24675
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
24752
24676
|
var onComplete = _a.onComplete,
|
|
24753
24677
|
onExitCapture = _a.onExitCapture,
|
|
24754
24678
|
onExitAfterFailure = _a.onExitAfterFailure,
|
|
@@ -24757,73 +24681,73 @@
|
|
|
24757
24681
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
24758
24682
|
onCameraTamperingDetected = _a.onCameraTamperingDetected,
|
|
24759
24683
|
onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
|
|
24760
|
-
|
|
24761
|
-
idCaptureProps =
|
|
24762
|
-
|
|
24763
|
-
faceLivenessProps =
|
|
24764
|
-
|
|
24765
|
-
idCaptureModelsEnabled =
|
|
24766
|
-
|
|
24767
|
-
videoIdCaptureThresholds =
|
|
24684
|
+
_k = _a.idCaptureProps,
|
|
24685
|
+
idCaptureProps = _k === void 0 ? {} : _k,
|
|
24686
|
+
_l = _a.faceLivenessProps,
|
|
24687
|
+
faceLivenessProps = _l === void 0 ? {} : _l,
|
|
24688
|
+
_m = _a.idCaptureModelsEnabled,
|
|
24689
|
+
idCaptureModelsEnabled = _m === void 0 ? true : _m,
|
|
24690
|
+
_o = _a.videoIdCaptureThresholds,
|
|
24691
|
+
videoIdCaptureThresholds = _o === void 0 ? defaultVideoIdCaptureThresholds : _o,
|
|
24768
24692
|
readTextPrompt = _a.readTextPrompt,
|
|
24769
24693
|
readTextTimeoutDurationMs = _a.readTextTimeoutDurationMs,
|
|
24770
24694
|
readTextMinReadingMs = _a.readTextMinReadingMs,
|
|
24771
|
-
|
|
24772
|
-
skipIdCapture =
|
|
24773
|
-
|
|
24774
|
-
skipShowIdCardBack =
|
|
24775
|
-
|
|
24776
|
-
skipSuccessScreen =
|
|
24777
|
-
|
|
24778
|
-
idCaptureLoadingOverlayMode =
|
|
24695
|
+
_p = _a.skipIdCapture,
|
|
24696
|
+
skipIdCapture = _p === void 0 ? false : _p,
|
|
24697
|
+
_q = _a.skipShowIdCardBack,
|
|
24698
|
+
skipShowIdCardBack = _q === void 0 ? false : _q,
|
|
24699
|
+
_r = _a.skipSuccessScreen,
|
|
24700
|
+
skipSuccessScreen = _r === void 0 ? false : _r,
|
|
24701
|
+
_s = _a.idCaptureLoadingOverlayMode,
|
|
24702
|
+
idCaptureLoadingOverlayMode = _s === void 0 ? 'default' : _s,
|
|
24779
24703
|
customOverlayContent = _a.customOverlayContent,
|
|
24780
24704
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
24781
|
-
|
|
24782
|
-
idDocumentType =
|
|
24783
|
-
|
|
24784
|
-
idCaptureGuideType =
|
|
24785
|
-
|
|
24786
|
-
idCaptureGuideImages =
|
|
24787
|
-
|
|
24788
|
-
idCapturePortraitGuidesOnMobile =
|
|
24789
|
-
|
|
24790
|
-
idCaptureRotateLoadingOverlayImageWhenPortrait =
|
|
24791
|
-
|
|
24792
|
-
idCaptureModelLoadTimeoutMs =
|
|
24793
|
-
|
|
24794
|
-
faceLivenessLoadingOverlayMode =
|
|
24795
|
-
|
|
24796
|
-
disableFaceDetectionWhileAudioCapture =
|
|
24797
|
-
|
|
24798
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
24799
|
-
|
|
24800
|
-
silentFallback =
|
|
24801
|
-
|
|
24802
|
-
mergeAVStreams =
|
|
24803
|
-
|
|
24804
|
-
assets =
|
|
24805
|
-
|
|
24806
|
-
classNames =
|
|
24807
|
-
|
|
24808
|
-
colors =
|
|
24809
|
-
|
|
24810
|
-
verbiage =
|
|
24811
|
-
|
|
24812
|
-
debugMode =
|
|
24813
|
-
var
|
|
24814
|
-
passportImage =
|
|
24815
|
-
submissionStatus =
|
|
24816
|
-
idCaptureVideoUrl =
|
|
24817
|
-
idCaptureVideoAudioUrl =
|
|
24818
|
-
idCaptureVideoIdFrontImage =
|
|
24819
|
-
idCaptureVideoIdBackImage =
|
|
24820
|
-
setIdCaptureVideoUrl =
|
|
24821
|
-
setIdCaptureVideoIdFrontImage =
|
|
24822
|
-
setIdCaptureVideoIdBackImage =
|
|
24823
|
-
setIdCaptureVideoAudioUrl =
|
|
24824
|
-
var
|
|
24825
|
-
captureState =
|
|
24826
|
-
setCaptureState =
|
|
24705
|
+
_t = _a.idDocumentType,
|
|
24706
|
+
idDocumentType = _t === void 0 ? 'idCardOrPassport' : _t,
|
|
24707
|
+
_u = _a.idCaptureGuideType,
|
|
24708
|
+
idCaptureGuideType = _u === void 0 ? 'fit' : _u,
|
|
24709
|
+
_v = _a.idCaptureGuideImages,
|
|
24710
|
+
idCaptureGuideImages = _v === void 0 ? defaultIdCaptureGuideImages : _v,
|
|
24711
|
+
_w = _a.idCapturePortraitGuidesOnMobile,
|
|
24712
|
+
idCapturePortraitGuidesOnMobile = _w === void 0 ? true : _w,
|
|
24713
|
+
_x = _a.idCaptureRotateLoadingOverlayImageWhenPortrait,
|
|
24714
|
+
idCaptureRotateLoadingOverlayImageWhenPortrait = _x === void 0 ? true : _x,
|
|
24715
|
+
_y = _a.idCaptureModelLoadTimeoutMs,
|
|
24716
|
+
idCaptureModelLoadTimeoutMs = _y === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _y,
|
|
24717
|
+
_z = _a.faceLivenessLoadingOverlayMode,
|
|
24718
|
+
faceLivenessLoadingOverlayMode = _z === void 0 ? 'default' : _z,
|
|
24719
|
+
_0 = _a.disableFaceDetectionWhileAudioCapture,
|
|
24720
|
+
disableFaceDetectionWhileAudioCapture = _0 === void 0 ? true : _0,
|
|
24721
|
+
_1 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
24722
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _1 === void 0 ? 2000 : _1,
|
|
24723
|
+
_2 = _a.silentFallback,
|
|
24724
|
+
silentFallback = _2 === void 0 ? false : _2,
|
|
24725
|
+
_3 = _a.mergeAVStreams,
|
|
24726
|
+
mergeAVStreams = _3 === void 0 ? false : _3,
|
|
24727
|
+
_4 = _a.assets,
|
|
24728
|
+
assets = _4 === void 0 ? {} : _4,
|
|
24729
|
+
_5 = _a.classNames,
|
|
24730
|
+
classNames = _5 === void 0 ? {} : _5,
|
|
24731
|
+
_6 = _a.colors,
|
|
24732
|
+
colors = _6 === void 0 ? {} : _6,
|
|
24733
|
+
_7 = _a.verbiage,
|
|
24734
|
+
verbiage = _7 === void 0 ? {} : _7,
|
|
24735
|
+
_8 = _a.debugMode,
|
|
24736
|
+
debugMode = _8 === void 0 ? false : _8;
|
|
24737
|
+
var _9 = React.useContext(SubmissionContext),
|
|
24738
|
+
passportImage = _9.passportImage,
|
|
24739
|
+
submissionStatus = _9.submissionStatus,
|
|
24740
|
+
idCaptureVideoUrl = _9.idCaptureVideoUrl,
|
|
24741
|
+
idCaptureVideoAudioUrl = _9.idCaptureVideoAudioUrl,
|
|
24742
|
+
idCaptureVideoIdFrontImage = _9.idCaptureVideoIdFrontImage,
|
|
24743
|
+
idCaptureVideoIdBackImage = _9.idCaptureVideoIdBackImage,
|
|
24744
|
+
setIdCaptureVideoUrl = _9.setIdCaptureVideoUrl,
|
|
24745
|
+
setIdCaptureVideoIdFrontImage = _9.setIdCaptureVideoIdFrontImage,
|
|
24746
|
+
setIdCaptureVideoIdBackImage = _9.setIdCaptureVideoIdBackImage,
|
|
24747
|
+
setIdCaptureVideoAudioUrl = _9.setIdCaptureVideoAudioUrl;
|
|
24748
|
+
var _10 = React.useState('CAPTURING_ID'),
|
|
24749
|
+
captureState = _10[0],
|
|
24750
|
+
setCaptureState = _10[1];
|
|
24827
24751
|
React.useEffect(function () {
|
|
24828
24752
|
if (skipIdCapture && captureState === 'CAPTURING_ID') setCaptureState('CHECKING_LIVENESS');
|
|
24829
24753
|
}, [captureState, skipIdCapture]);
|
|
@@ -24854,9 +24778,9 @@
|
|
|
24854
24778
|
var onVideoCaptureFaceNotDetected = React.useCallback(function () {
|
|
24855
24779
|
setCaptureState('CHECKING_LIVENESS');
|
|
24856
24780
|
}, []);
|
|
24857
|
-
var
|
|
24858
|
-
attempt =
|
|
24859
|
-
setAttempt =
|
|
24781
|
+
var _11 = React.useState(0),
|
|
24782
|
+
attempt = _11[0],
|
|
24783
|
+
setAttempt = _11[1];
|
|
24860
24784
|
var userSuppliedExitAfterFailure = onExitAfterFailure !== null && onExitAfterFailure !== void 0 ? onExitAfterFailure : faceLivenessProps.onExitAfterFailure;
|
|
24861
24785
|
var onFaceCaptureExitAfterFailure = React.useCallback(function (resp, req) {
|
|
24862
24786
|
userSuppliedExitAfterFailure === null || userSuppliedExitAfterFailure === void 0 ? void 0 : userSuppliedExitAfterFailure(resp, req);
|
|
@@ -24902,11 +24826,6 @@
|
|
|
24902
24826
|
idCardGuideStatus: "disabled"
|
|
24903
24827
|
});
|
|
24904
24828
|
}, [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]);
|
|
24905
|
-
if (submissionStatus === SubmissionStatus.SUBMITTING) {
|
|
24906
|
-
return /*#__PURE__*/React.createElement(PageContainer, {
|
|
24907
|
-
className: "flex"
|
|
24908
|
-
}, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
24909
|
-
}
|
|
24910
24829
|
return /*#__PURE__*/React.createElement(CameraStoreProvider, {
|
|
24911
24830
|
preferIphoneContinuityCamera: isCapturingId,
|
|
24912
24831
|
preferFrontFacingCamera: !isCapturingId,
|
|
@@ -24930,11 +24849,9 @@
|
|
|
24930
24849
|
onModelError: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.onModelError,
|
|
24931
24850
|
modelLoadTimeoutMs: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.modelLoadTimeoutMs,
|
|
24932
24851
|
requireVerticalFaceCentering: false
|
|
24933
|
-
}, /*#__PURE__*/React.createElement(
|
|
24934
|
-
className: "flex ".concat((_k = classNames.container) !== null && _k !== void 0 ? _k : '')
|
|
24935
|
-
}, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
24852
|
+
}, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && ( /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
24936
24853
|
className: classNames.cameraFeed
|
|
24937
|
-
}), function () {
|
|
24854
|
+
})), function () {
|
|
24938
24855
|
switch (captureState) {
|
|
24939
24856
|
case 'CAPTURING_ID':
|
|
24940
24857
|
return /*#__PURE__*/React.createElement(IdCaptureStateProvider, null, /*#__PURE__*/React.createElement(GuideOrientationContextProvider, null, /*#__PURE__*/React.createElement(IdCaptureWizard, _assign({
|
|
@@ -25024,7 +24941,7 @@
|
|
|
25024
24941
|
default:
|
|
25025
24942
|
return /*#__PURE__*/React.createElement(React.Fragment, null);
|
|
25026
24943
|
}
|
|
25027
|
-
}())))
|
|
24944
|
+
}())));
|
|
25028
24945
|
};
|
|
25029
24946
|
|
|
25030
24947
|
function CompositeWizard(_a) {
|
|
@@ -25150,9 +25067,7 @@
|
|
|
25150
25067
|
if (isComplete) {
|
|
25151
25068
|
switch (submissionStatus) {
|
|
25152
25069
|
case SubmissionStatus.SUBMITTING:
|
|
25153
|
-
return /*#__PURE__*/React.createElement(
|
|
25154
|
-
className: "flex"
|
|
25155
|
-
}, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
25070
|
+
return /*#__PURE__*/React.createElement(SpinnerPage, null);
|
|
25156
25071
|
case SubmissionStatus.SUBMITTED:
|
|
25157
25072
|
if (debugMode) return /*#__PURE__*/React.createElement(SubmissionSuccess, null);
|
|
25158
25073
|
return /*#__PURE__*/React.createElement(React.Fragment, null);
|
|
@@ -25462,6 +25377,33 @@
|
|
|
25462
25377
|
}, children);
|
|
25463
25378
|
};
|
|
25464
25379
|
|
|
25380
|
+
var SdkPage = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
25381
|
+
var children = _a.children,
|
|
25382
|
+
className = _a.className,
|
|
25383
|
+
_b = _a.heightOffset,
|
|
25384
|
+
heightOffset = _b === void 0 ? 0 : _b,
|
|
25385
|
+
style = _a.style,
|
|
25386
|
+
onClick = _a.onClick;
|
|
25387
|
+
var theme = styled.useTheme();
|
|
25388
|
+
return /*#__PURE__*/React.createElement(SdkPageOuter, {
|
|
25389
|
+
ref: ref,
|
|
25390
|
+
style: style,
|
|
25391
|
+
onClick: onClick,
|
|
25392
|
+
className: className,
|
|
25393
|
+
"$heightOffset": heightOffset
|
|
25394
|
+
}, theme.header && /*#__PURE__*/React.createElement(theme.header, null), /*#__PURE__*/React.createElement(SdkPageInner, null, children), theme.footer && /*#__PURE__*/React.createElement(theme.footer, null));
|
|
25395
|
+
});
|
|
25396
|
+
SdkPage.displayName = 'SdkPage';
|
|
25397
|
+
var SdkPageOuter = styled.div.attrs({
|
|
25398
|
+
className: 'sdk-page-outer'
|
|
25399
|
+
})(templateObject_1$4 || (templateObject_1$4 = __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) {
|
|
25400
|
+
return props.theme.fontFamily ? "font-family: ".concat(props.theme.fontFamily, ";") : "";
|
|
25401
|
+
}, function (props) {
|
|
25402
|
+
return props.theme.isFullscreen === false ? "" : "\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ";
|
|
25403
|
+
});
|
|
25404
|
+
var SdkPageInner = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n flex: 1;\n position: relative;\n overflow: hidden;\n"], ["\n flex: 1;\n position: relative;\n overflow: hidden;\n"])));
|
|
25405
|
+
var templateObject_1$4, templateObject_2$4;
|
|
25406
|
+
|
|
25465
25407
|
/**
|
|
25466
25408
|
* Render a fullscreen ID capture component that instructs the user to photograph both sides of their ID card, or full page of their passport.
|
|
25467
25409
|
*/
|
|
@@ -25676,6 +25618,8 @@
|
|
|
25676
25618
|
geolocationEnabled: geolocationEnabled,
|
|
25677
25619
|
geolocationRequired: geolocationRequired,
|
|
25678
25620
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
25621
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
25622
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
25679
25623
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
25680
25624
|
checks: React.useMemo(function () {
|
|
25681
25625
|
return ['IdCapture'];
|
|
@@ -25689,7 +25633,7 @@
|
|
|
25689
25633
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
25690
25634
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
25691
25635
|
debugMode: debugMode
|
|
25692
|
-
}))));
|
|
25636
|
+
})))));
|
|
25693
25637
|
};
|
|
25694
25638
|
|
|
25695
25639
|
/** Render a fullscreen capture component that analyzes frames from the user's front-facing camera to determine whether a live human face is present. */
|
|
@@ -25812,6 +25756,8 @@
|
|
|
25812
25756
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks,
|
|
25813
25757
|
estimateAge: estimateAge,
|
|
25814
25758
|
predictGender: predictGender
|
|
25759
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
25760
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
25815
25761
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
25816
25762
|
checks: React.useMemo(function () {
|
|
25817
25763
|
return ['FaceLiveness'];
|
|
@@ -25820,7 +25766,7 @@
|
|
|
25820
25766
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
25821
25767
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
25822
25768
|
debugMode: debugMode
|
|
25823
|
-
}))));
|
|
25769
|
+
})))));
|
|
25824
25770
|
};
|
|
25825
25771
|
|
|
25826
25772
|
/**
|
|
@@ -26069,6 +26015,8 @@
|
|
|
26069
26015
|
geolocationEnabled: geolocationEnabled,
|
|
26070
26016
|
geolocationRequired: geolocationRequired,
|
|
26071
26017
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
26018
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
26019
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
26072
26020
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
26073
26021
|
checks: checks,
|
|
26074
26022
|
idCaptureProps: idCaptureProps,
|
|
@@ -26081,7 +26029,7 @@
|
|
|
26081
26029
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
26082
26030
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
26083
26031
|
debugMode: debugMode
|
|
26084
|
-
}))));
|
|
26032
|
+
})))));
|
|
26085
26033
|
};
|
|
26086
26034
|
|
|
26087
26035
|
/**
|
|
@@ -26354,6 +26302,8 @@
|
|
|
26354
26302
|
geolocationEnabled: geolocationEnabled,
|
|
26355
26303
|
geolocationRequired: geolocationRequired,
|
|
26356
26304
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
26305
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
26306
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
26357
26307
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
26358
26308
|
checks: checks,
|
|
26359
26309
|
idCaptureProps: idCaptureProps,
|
|
@@ -26367,7 +26317,7 @@
|
|
|
26367
26317
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
26368
26318
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
26369
26319
|
debugMode: debugMode
|
|
26370
|
-
}))));
|
|
26320
|
+
})))));
|
|
26371
26321
|
};
|
|
26372
26322
|
|
|
26373
26323
|
var ALLOWED_RETRIES$3 = 0;
|
|
@@ -26610,8 +26560,8 @@
|
|
|
26610
26560
|
}, verbiage.doneBtnText))));
|
|
26611
26561
|
};
|
|
26612
26562
|
var Heading$3 = styled.h3(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
26613
|
-
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"])));
|
|
26614
|
-
var StyledButtonsRow$3 = styled(ButtonsRow)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26563
|
+
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"])));
|
|
26564
|
+
var StyledButtonsRow$3 = styled(ButtonsRow$2)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26615
26565
|
var templateObject_1$3, templateObject_2$3, templateObject_3$3;
|
|
26616
26566
|
|
|
26617
26567
|
var CustomerVerificationFailure = function CustomerVerificationFailure(_a) {
|
|
@@ -26662,13 +26612,12 @@
|
|
|
26662
26612
|
}, verbiage.exitBtnText))));
|
|
26663
26613
|
};
|
|
26664
26614
|
var Heading$2 = styled.h3(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
26665
|
-
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"])));
|
|
26666
|
-
var StyledButtonsRow$2 = styled(ButtonsRow)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26615
|
+
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"])));
|
|
26616
|
+
var StyledButtonsRow$2 = styled(ButtonsRow$2)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
26667
26617
|
var templateObject_1$2, templateObject_2$2, templateObject_3$2;
|
|
26668
26618
|
|
|
26669
26619
|
var ALLOWED_RETRIES$2 = 2;
|
|
26670
26620
|
var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
26671
|
-
var _b;
|
|
26672
26621
|
var onComplete = _a.onComplete,
|
|
26673
26622
|
onCustomerMatched = _a.onCustomerMatched,
|
|
26674
26623
|
onCustomerNotMatched = _a.onCustomerNotMatched,
|
|
@@ -26677,33 +26626,33 @@
|
|
|
26677
26626
|
onUserCancel = _a.onUserCancel,
|
|
26678
26627
|
onCaptureGuidanceTimeout = _a.onCaptureGuidanceTimeout,
|
|
26679
26628
|
captureGuidanceTimeoutDurationMs = _a.captureGuidanceTimeoutDurationMs,
|
|
26680
|
-
|
|
26681
|
-
skipSuccessScreen =
|
|
26682
|
-
|
|
26683
|
-
loadingOverlayMode =
|
|
26684
|
-
|
|
26685
|
-
assets =
|
|
26686
|
-
|
|
26687
|
-
classNames =
|
|
26688
|
-
|
|
26689
|
-
colors =
|
|
26690
|
-
|
|
26691
|
-
verbiage =
|
|
26692
|
-
|
|
26693
|
-
debugMode =
|
|
26694
|
-
var
|
|
26695
|
-
submissionRequest =
|
|
26696
|
-
submissionResponse =
|
|
26697
|
-
selfieImage =
|
|
26698
|
-
var
|
|
26699
|
-
captureState =
|
|
26700
|
-
setCaptureState =
|
|
26701
|
-
var
|
|
26702
|
-
cameraAccessDenied =
|
|
26703
|
-
releaseCameraAccess =
|
|
26704
|
-
var
|
|
26705
|
-
start =
|
|
26706
|
-
stop =
|
|
26629
|
+
_b = _a.skipSuccessScreen,
|
|
26630
|
+
skipSuccessScreen = _b === void 0 ? false : _b,
|
|
26631
|
+
_c = _a.loadingOverlayMode,
|
|
26632
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
26633
|
+
_d = _a.assets,
|
|
26634
|
+
assets = _d === void 0 ? {} : _d,
|
|
26635
|
+
_e = _a.classNames,
|
|
26636
|
+
classNames = _e === void 0 ? {} : _e,
|
|
26637
|
+
_f = _a.colors,
|
|
26638
|
+
colors = _f === void 0 ? {} : _f,
|
|
26639
|
+
_g = _a.verbiage,
|
|
26640
|
+
verbiage = _g === void 0 ? {} : _g,
|
|
26641
|
+
_h = _a.debugMode,
|
|
26642
|
+
debugMode = _h === void 0 ? false : _h;
|
|
26643
|
+
var _j = React.useContext(SubmissionContext),
|
|
26644
|
+
submissionRequest = _j.submissionRequest,
|
|
26645
|
+
submissionResponse = _j.submissionResponse,
|
|
26646
|
+
selfieImage = _j.selfieImage;
|
|
26647
|
+
var _k = React.useState('LOADING'),
|
|
26648
|
+
captureState = _k[0],
|
|
26649
|
+
setCaptureState = _k[1];
|
|
26650
|
+
var _l = useCameraStore(),
|
|
26651
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
26652
|
+
releaseCameraAccess = _l.releaseCameraAccess;
|
|
26653
|
+
var _m = React.useContext(SelfieGuidanceModelsContext),
|
|
26654
|
+
start = _m.start,
|
|
26655
|
+
stop = _m.stop;
|
|
26707
26656
|
React.useEffect(function () {
|
|
26708
26657
|
if (captureState !== 'CAPTURING') return;
|
|
26709
26658
|
start();
|
|
@@ -26733,9 +26682,9 @@
|
|
|
26733
26682
|
setCaptureState('FAILED');
|
|
26734
26683
|
onCaptureGuidanceTimeout === null || onCaptureGuidanceTimeout === void 0 ? void 0 : onCaptureGuidanceTimeout();
|
|
26735
26684
|
}, [onCaptureGuidanceTimeout]);
|
|
26736
|
-
var
|
|
26737
|
-
attempt =
|
|
26738
|
-
setAttempt =
|
|
26685
|
+
var _o = React.useState(0),
|
|
26686
|
+
attempt = _o[0],
|
|
26687
|
+
setAttempt = _o[1];
|
|
26739
26688
|
var onExitCallback = React.useCallback(function () {
|
|
26740
26689
|
setAttempt(function (n) {
|
|
26741
26690
|
return n + 1;
|
|
@@ -26756,9 +26705,7 @@
|
|
|
26756
26705
|
setCaptureState('LOADING');
|
|
26757
26706
|
}
|
|
26758
26707
|
}, [cameraAccessDenied]);
|
|
26759
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
26760
|
-
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
26761
|
-
}, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
26708
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
26762
26709
|
className: classNames.cameraFeed
|
|
26763
26710
|
}), captureState !== 'LOADING' && function () {
|
|
26764
26711
|
switch (captureState) {
|
|
@@ -26809,7 +26756,7 @@
|
|
|
26809
26756
|
default:
|
|
26810
26757
|
return null;
|
|
26811
26758
|
}
|
|
26812
|
-
}()
|
|
26759
|
+
}(), /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
26813
26760
|
key: attempt,
|
|
26814
26761
|
mode: loadingOverlayMode,
|
|
26815
26762
|
assets: assets.loadingOverlay,
|
|
@@ -26925,6 +26872,8 @@
|
|
|
26925
26872
|
autoStart: false,
|
|
26926
26873
|
onModelError: onModelError,
|
|
26927
26874
|
modelLoadTimeoutMs: modelLoadTimeoutMs
|
|
26875
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
26876
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
26928
26877
|
}, /*#__PURE__*/React.createElement(CustomerVerificationWizard, {
|
|
26929
26878
|
onComplete: onComplete,
|
|
26930
26879
|
onCustomerMatched: onCustomerMatched,
|
|
@@ -26940,7 +26889,7 @@
|
|
|
26940
26889
|
colors: colors,
|
|
26941
26890
|
verbiage: verbiage,
|
|
26942
26891
|
debugMode: debugMode
|
|
26943
|
-
}))))));
|
|
26892
|
+
})))))));
|
|
26944
26893
|
};
|
|
26945
26894
|
|
|
26946
26895
|
var ALLOWED_RETRIES$1 = 0;
|
|
@@ -27181,8 +27130,8 @@
|
|
|
27181
27130
|
}, verbiage.doneBtnText))));
|
|
27182
27131
|
};
|
|
27183
27132
|
var Heading$1 = styled.h3(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
27184
|
-
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"])));
|
|
27185
|
-
var StyledButtonsRow$1 = styled(ButtonsRow)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27133
|
+
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"])));
|
|
27134
|
+
var StyledButtonsRow$1 = styled(ButtonsRow$2)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27186
27135
|
var templateObject_1$1, templateObject_2$1, templateObject_3$1;
|
|
27187
27136
|
|
|
27188
27137
|
var CustomerIdentificationFailure = function CustomerIdentificationFailure(_a) {
|
|
@@ -27233,13 +27182,12 @@
|
|
|
27233
27182
|
}, verbiage.exitBtnText))));
|
|
27234
27183
|
};
|
|
27235
27184
|
var Heading = styled.h3(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
27236
|
-
var ImageContainer = styled(ButtonsRow)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
27237
|
-
var StyledButtonsRow = styled(ButtonsRow)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27185
|
+
var ImageContainer = styled(ButtonsRow$2)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
27186
|
+
var StyledButtonsRow = styled(ButtonsRow$2)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
27238
27187
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
27239
27188
|
|
|
27240
27189
|
var ALLOWED_RETRIES = 2;
|
|
27241
27190
|
var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
27242
|
-
var _b;
|
|
27243
27191
|
var onComplete = _a.onComplete,
|
|
27244
27192
|
onCustomerMatched = _a.onCustomerMatched,
|
|
27245
27193
|
onCustomerNotMatched = _a.onCustomerNotMatched,
|
|
@@ -27248,33 +27196,33 @@
|
|
|
27248
27196
|
onUserCancel = _a.onUserCancel,
|
|
27249
27197
|
onCaptureGuidanceTimeout = _a.onCaptureGuidanceTimeout,
|
|
27250
27198
|
captureGuidanceTimeoutDurationMs = _a.captureGuidanceTimeoutDurationMs,
|
|
27251
|
-
|
|
27252
|
-
skipSuccessScreen =
|
|
27253
|
-
|
|
27254
|
-
loadingOverlayMode =
|
|
27255
|
-
|
|
27256
|
-
assets =
|
|
27257
|
-
|
|
27258
|
-
classNames =
|
|
27259
|
-
|
|
27260
|
-
colors =
|
|
27261
|
-
|
|
27262
|
-
verbiage =
|
|
27263
|
-
|
|
27264
|
-
debugMode =
|
|
27265
|
-
var
|
|
27266
|
-
submissionResponse =
|
|
27267
|
-
submissionRequest =
|
|
27268
|
-
selfieImage =
|
|
27269
|
-
var
|
|
27270
|
-
captureState =
|
|
27271
|
-
setCaptureState =
|
|
27272
|
-
var
|
|
27273
|
-
cameraAccessDenied =
|
|
27274
|
-
releaseCameraAccess =
|
|
27275
|
-
var
|
|
27276
|
-
start =
|
|
27277
|
-
stop =
|
|
27199
|
+
_b = _a.skipSuccessScreen,
|
|
27200
|
+
skipSuccessScreen = _b === void 0 ? false : _b,
|
|
27201
|
+
_c = _a.loadingOverlayMode,
|
|
27202
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
27203
|
+
_d = _a.assets,
|
|
27204
|
+
assets = _d === void 0 ? {} : _d,
|
|
27205
|
+
_e = _a.classNames,
|
|
27206
|
+
classNames = _e === void 0 ? {} : _e,
|
|
27207
|
+
_f = _a.colors,
|
|
27208
|
+
colors = _f === void 0 ? {} : _f,
|
|
27209
|
+
_g = _a.verbiage,
|
|
27210
|
+
verbiage = _g === void 0 ? {} : _g,
|
|
27211
|
+
_h = _a.debugMode,
|
|
27212
|
+
debugMode = _h === void 0 ? false : _h;
|
|
27213
|
+
var _j = React.useContext(SubmissionContext),
|
|
27214
|
+
submissionResponse = _j.submissionResponse,
|
|
27215
|
+
submissionRequest = _j.submissionRequest,
|
|
27216
|
+
selfieImage = _j.selfieImage;
|
|
27217
|
+
var _k = React.useState('LOADING'),
|
|
27218
|
+
captureState = _k[0],
|
|
27219
|
+
setCaptureState = _k[1];
|
|
27220
|
+
var _l = useCameraStore(),
|
|
27221
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
27222
|
+
releaseCameraAccess = _l.releaseCameraAccess;
|
|
27223
|
+
var _m = React.useContext(SelfieGuidanceModelsContext),
|
|
27224
|
+
start = _m.start,
|
|
27225
|
+
stop = _m.stop;
|
|
27278
27226
|
React.useEffect(function () {
|
|
27279
27227
|
if (captureState !== 'CAPTURING') return;
|
|
27280
27228
|
start();
|
|
@@ -27304,9 +27252,9 @@
|
|
|
27304
27252
|
setCaptureState('FAILED');
|
|
27305
27253
|
onCaptureGuidanceTimeout === null || onCaptureGuidanceTimeout === void 0 ? void 0 : onCaptureGuidanceTimeout();
|
|
27306
27254
|
}, [onCaptureGuidanceTimeout]);
|
|
27307
|
-
var
|
|
27308
|
-
attempt =
|
|
27309
|
-
setAttempt =
|
|
27255
|
+
var _o = React.useState(0),
|
|
27256
|
+
attempt = _o[0],
|
|
27257
|
+
setAttempt = _o[1];
|
|
27310
27258
|
var onExitCallback = React.useCallback(function () {
|
|
27311
27259
|
setAttempt(function (n) {
|
|
27312
27260
|
return n + 1;
|
|
@@ -27327,9 +27275,7 @@
|
|
|
27327
27275
|
setCaptureState('LOADING');
|
|
27328
27276
|
}
|
|
27329
27277
|
}, [cameraAccessDenied]);
|
|
27330
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
27331
|
-
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
27332
|
-
}, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
27278
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CameraVideoTag, {
|
|
27333
27279
|
className: classNames.cameraFeed
|
|
27334
27280
|
}), captureState !== 'LOADING' && function () {
|
|
27335
27281
|
switch (captureState) {
|
|
@@ -27380,7 +27326,7 @@
|
|
|
27380
27326
|
default:
|
|
27381
27327
|
return null;
|
|
27382
27328
|
}
|
|
27383
|
-
}()
|
|
27329
|
+
}(), /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
27384
27330
|
key: attempt,
|
|
27385
27331
|
mode: loadingOverlayMode,
|
|
27386
27332
|
assets: assets.loadingOverlay,
|
|
@@ -27494,6 +27440,8 @@
|
|
|
27494
27440
|
autoStart: false,
|
|
27495
27441
|
modelLoadTimeoutMs: modelLoadTimeoutMs,
|
|
27496
27442
|
onModelError: onModelError
|
|
27443
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27444
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
27497
27445
|
}, /*#__PURE__*/React.createElement(CustomerIdentificationWizard, {
|
|
27498
27446
|
onComplete: onComplete,
|
|
27499
27447
|
onCustomerMatched: onCustomerMatched,
|
|
@@ -27510,7 +27458,7 @@
|
|
|
27510
27458
|
colors: colors,
|
|
27511
27459
|
verbiage: verbiage,
|
|
27512
27460
|
debugMode: debugMode
|
|
27513
|
-
}))))));
|
|
27461
|
+
})))))));
|
|
27514
27462
|
};
|
|
27515
27463
|
|
|
27516
27464
|
/** Render a fullscreen capture component that captures a video of the user signing the screen. */
|
|
@@ -27592,6 +27540,8 @@
|
|
|
27592
27540
|
geolocationEnabled: geolocationEnabled,
|
|
27593
27541
|
geolocationRequired: geolocationRequired,
|
|
27594
27542
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
27543
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27544
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
27595
27545
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
27596
27546
|
debugMode: debugMode,
|
|
27597
27547
|
checks: React.useMemo(function () {
|
|
@@ -27619,7 +27569,7 @@
|
|
|
27619
27569
|
onUserCancel: onUserCancel
|
|
27620
27570
|
};
|
|
27621
27571
|
}, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
|
|
27622
|
-
}))));
|
|
27572
|
+
})))));
|
|
27623
27573
|
};
|
|
27624
27574
|
|
|
27625
27575
|
/**
|
|
@@ -27841,6 +27791,8 @@
|
|
|
27841
27791
|
geolocationEnabled: geolocationEnabled,
|
|
27842
27792
|
geolocationRequired: geolocationRequired,
|
|
27843
27793
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
27794
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27795
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
27844
27796
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
27845
27797
|
checks: React.useMemo(function () {
|
|
27846
27798
|
return ['VideoIdCapture'];
|
|
@@ -27855,7 +27807,7 @@
|
|
|
27855
27807
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
27856
27808
|
onMicrophoneAccessDenied: onMicrophoneAccessDenied,
|
|
27857
27809
|
debugMode: debugMode
|
|
27858
|
-
}))));
|
|
27810
|
+
})))));
|
|
27859
27811
|
};
|
|
27860
27812
|
|
|
27861
27813
|
/** 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. */
|
|
@@ -28019,6 +27971,8 @@
|
|
|
28019
27971
|
geolocationEnabled: geolocationEnabled,
|
|
28020
27972
|
geolocationRequired: geolocationRequired,
|
|
28021
27973
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
27974
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
27975
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
28022
27976
|
}, /*#__PURE__*/React.createElement(CompositeWizard, {
|
|
28023
27977
|
checks: React.useMemo(function () {
|
|
28024
27978
|
return ['FaceLiveness'];
|
|
@@ -28032,7 +27986,7 @@
|
|
|
28032
27986
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
28033
27987
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
28034
27988
|
debugMode: debugMode
|
|
28035
|
-
}))));
|
|
27989
|
+
})))));
|
|
28036
27990
|
};
|
|
28037
27991
|
|
|
28038
27992
|
/**
|
|
@@ -28105,6 +28059,8 @@
|
|
|
28105
28059
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
28106
28060
|
classNames: classNames === null || classNames === void 0 ? void 0 : classNames.cameraStoreProvider,
|
|
28107
28061
|
verbiage: verbiage === null || verbiage === void 0 ? void 0 : verbiage.cameraStoreProvider
|
|
28062
|
+
}, /*#__PURE__*/React.createElement(SdkPage, {
|
|
28063
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
28108
28064
|
}, /*#__PURE__*/React.createElement(DocumentCaptureWizard, {
|
|
28109
28065
|
onSuccess: onComplete,
|
|
28110
28066
|
onExitCapture: onExitCapture,
|
|
@@ -28115,7 +28071,7 @@
|
|
|
28115
28071
|
instructions: instructions,
|
|
28116
28072
|
classNames: classNames,
|
|
28117
28073
|
verbiage: verbiage
|
|
28118
|
-
})))));
|
|
28074
|
+
}))))));
|
|
28119
28075
|
};
|
|
28120
28076
|
|
|
28121
28077
|
initializeI18n();
|