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