idmission-web-sdk 2.2.175 → 2.2.176
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/CompositeWizard.d.ts.map +1 -1
- package/dist/components/common/SdkPage.d.ts +18 -0
- package/dist/components/common/SdkPage.d.ts.map +1 -0
- package/dist/components/common/debug.d.ts.map +1 -1
- package/dist/components/common/overlay.d.ts +29 -26
- package/dist/components/common/overlay.d.ts.map +1 -1
- package/dist/components/common/spinner.d.ts +4 -1
- package/dist/components/common/spinner.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerBiometricsEnrollment.d.ts +1 -0
- package/dist/components/customer_flows/CustomerBiometricsEnrollment.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerIdAndBiometricsEnrollment.d.ts +1 -0
- package/dist/components/customer_flows/CustomerIdAndBiometricsEnrollment.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerIdentification.d.ts.map +1 -1
- package/dist/components/customer_flows/CustomerVerification.d.ts.map +1 -1
- package/dist/components/customer_flows/DocumentCapture.d.ts.map +1 -1
- package/dist/components/customer_flows/FaceValidation.d.ts +3 -1
- package/dist/components/customer_flows/FaceValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/IdAndFaceValidation.d.ts +1 -0
- package/dist/components/customer_flows/IdAndFaceValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/IdValidation.d.ts.map +1 -1
- package/dist/components/customer_flows/SignatureKYC.d.ts.map +1 -1
- package/dist/components/customer_flows/VideoIdValidation.d.ts +1 -0
- package/dist/components/customer_flows/VideoIdValidation.d.ts.map +1 -1
- package/dist/components/customer_identification/CustomerIdentificationWizard.d.ts.map +1 -1
- package/dist/components/customer_verification/CustomerVerificationWizard.d.ts.map +1 -1
- package/dist/components/document_capture/DocumentCaptureScreen.d.ts.map +1 -1
- package/dist/components/face_liveness/FaceCaptureGuideOverlay.d.ts.map +1 -1
- package/dist/components/face_liveness/FaceLivenessWizard.d.ts.map +1 -1
- package/dist/components/id_capture/IdCapture.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureGuideOverlay.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureLoadingGraphic.d.ts +1 -1
- package/dist/components/id_capture/IdCaptureLoadingGraphic.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureLoadingOverlayDefault.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCapture.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCaptureLoadingGraphic.d.ts +1 -3
- package/dist/components/selfie_capture/SelfieCaptureLoadingGraphic.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieCaptureLoadingOverlayDefault.d.ts.map +1 -1
- package/dist/components/signature_capture/SignatureCapture.d.ts.map +1 -1
- package/dist/components/submission/SubmissionSuccess.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCapture.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCaptureGuides.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCaptureWizard.d.ts +0 -1
- package/dist/components/video_id/IdVideoCaptureWizard.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +910 -954
- package/dist/sdk2.cjs.development.js.map +1 -1
- package/dist/sdk2.cjs.production.js +1 -1
- package/dist/sdk2.cjs.production.js.map +1 -1
- package/dist/sdk2.esm.js +912 -956
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +913 -957
- package/dist/sdk2.umd.development.js.map +1 -1
- package/dist/sdk2.umd.production.js +1 -1
- package/dist/sdk2.umd.production.js.map +1 -1
- package/dist/themes/index.d.ts +3 -1
- package/dist/themes/index.d.ts.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +3 -3
- package/dist/components/common/Page.d.ts +0 -13
- package/dist/components/common/Page.d.ts.map +0 -1
package/dist/sdk2.esm.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import React__default, {
|
|
2
|
+
import React__default, { useRef, useState, useEffect, useContext, createContext, useReducer, useCallback, useMemo, useLayoutEffect, forwardRef } from 'react';
|
|
3
3
|
import * as ReactDOM from 'react-dom/client';
|
|
4
4
|
import platform from 'platform';
|
|
5
|
-
import styled, {
|
|
5
|
+
import styled, { keyframes, useTheme, ThemeProvider as ThemeProvider$1 } from 'styled-components';
|
|
6
|
+
import { createPortal } from 'react-dom';
|
|
6
7
|
import { useTranslation, initReactI18next } from 'react-i18next';
|
|
7
8
|
import { Upload } from 'tus-js-client';
|
|
8
9
|
import SparkMD5 from 'spark-md5';
|
|
@@ -13,7 +14,6 @@ import i18n from 'i18next';
|
|
|
13
14
|
import { useDebouncedCallback, useThrottledCallback } from 'use-debounce';
|
|
14
15
|
import { devtools } from 'zustand/middleware';
|
|
15
16
|
import { useShallow } from 'zustand/react/shallow';
|
|
16
|
-
import { createPortal } from 'react-dom';
|
|
17
17
|
import cn from 'clsx';
|
|
18
18
|
import SignatureCanvas from 'react-signature-canvas';
|
|
19
19
|
|
|
@@ -204,7 +204,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
204
204
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
205
205
|
};
|
|
206
206
|
|
|
207
|
-
var webSdkVersion = '2.2.
|
|
207
|
+
var webSdkVersion = '2.2.176';
|
|
208
208
|
|
|
209
209
|
function getPlatform() {
|
|
210
210
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -369,48 +369,6 @@ function videoDataUrlToB64(url) {
|
|
|
369
369
|
});
|
|
370
370
|
}
|
|
371
371
|
|
|
372
|
-
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) {
|
|
373
|
-
var _a;
|
|
374
|
-
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 ");
|
|
375
|
-
}, function (props) {
|
|
376
|
-
return props.theme.fontFamily ? "font-family: ".concat(props.theme.fontFamily, ";") : "";
|
|
377
|
-
});
|
|
378
|
-
var PageContainer = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
379
|
-
var children = _a.children,
|
|
380
|
-
className = _a.className,
|
|
381
|
-
_b = _a.heightOffset,
|
|
382
|
-
heightOffset = _b === void 0 ? 0 : _b,
|
|
383
|
-
style = _a.style,
|
|
384
|
-
onClick = _a.onClick;
|
|
385
|
-
var _c = useState(false),
|
|
386
|
-
dimensionsCalculated = _c[0],
|
|
387
|
-
setDimensionsCalculated = _c[1];
|
|
388
|
-
useEffect(function () {
|
|
389
|
-
if (typeof window === 'undefined') return;
|
|
390
|
-
setDimensionsCalculated(false);
|
|
391
|
-
var calcAppDimensions = function calcAppDimensions() {
|
|
392
|
-
var doc = document.documentElement;
|
|
393
|
-
doc.style.setProperty('--app-width', "".concat(window.innerWidth, "px"));
|
|
394
|
-
doc.style.setProperty('--app-height', "".concat(window.innerHeight, "px"));
|
|
395
|
-
};
|
|
396
|
-
window.addEventListener('resize', calcAppDimensions);
|
|
397
|
-
calcAppDimensions();
|
|
398
|
-
setDimensionsCalculated(true);
|
|
399
|
-
return function () {
|
|
400
|
-
window.removeEventListener('resize', calcAppDimensions);
|
|
401
|
-
};
|
|
402
|
-
}, []);
|
|
403
|
-
return /*#__PURE__*/React__default.createElement(PageContainerDiv, {
|
|
404
|
-
ref: ref,
|
|
405
|
-
style: style,
|
|
406
|
-
onClick: onClick,
|
|
407
|
-
className: className,
|
|
408
|
-
"$heightOffset": heightOffset
|
|
409
|
-
}, dimensionsCalculated && children);
|
|
410
|
-
});
|
|
411
|
-
PageContainer.displayName = 'PageContainer';
|
|
412
|
-
var templateObject_1$N;
|
|
413
|
-
|
|
414
372
|
var LoaderButton = function LoaderButton(_a) {
|
|
415
373
|
var children = _a.children,
|
|
416
374
|
className = _a.className,
|
|
@@ -466,29 +424,60 @@ var LoaderButton = function LoaderButton(_a) {
|
|
|
466
424
|
className: "ladda-label"
|
|
467
425
|
}, children));
|
|
468
426
|
};
|
|
469
|
-
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) {
|
|
427
|
+
var StyledButton = styled.button(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"], ["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"])), function (props) {
|
|
470
428
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
471
429
|
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 ");
|
|
472
430
|
});
|
|
473
|
-
var templateObject_1$
|
|
431
|
+
var templateObject_1$P;
|
|
474
432
|
|
|
475
|
-
var
|
|
433
|
+
var ButtonsRow$2 = styled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n display: flex;\n gap: 0 15px;\n justify-content: center;\n"], ["\n display: flex;\n gap: 0 15px;\n justify-content: center;\n"])));
|
|
434
|
+
var templateObject_1$O;
|
|
435
|
+
|
|
436
|
+
var GuidanceMessageContainerDiv = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"])), function (_a) {
|
|
437
|
+
var $top = _a.$top;
|
|
438
|
+
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
439
|
+
}, function (_a) {
|
|
440
|
+
var $bottom = _a.$bottom;
|
|
441
|
+
return $bottom ? "bottom: ".concat($bottom, ";") : "";
|
|
442
|
+
});
|
|
443
|
+
var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
444
|
+
var element = /*#__PURE__*/React__default.createElement(GuidanceMessageContainerDiv, _assign({}, props));
|
|
445
|
+
var portalLocation = document.getElementById('idmission-above-guides-content');
|
|
446
|
+
if (!portalLocation) return element;
|
|
447
|
+
return /*#__PURE__*/createPortal(element, portalLocation);
|
|
448
|
+
};
|
|
449
|
+
var GuidanceMessage = styled.div(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n padding: 10px 12px 8px;\n border-radius: 8px;\n z-index: 10001;\n"], ["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n padding: 10px 12px 8px;\n border-radius: 8px;\n z-index: 10001;\n"])), function (props) {
|
|
450
|
+
var _a, _b, _c, _d, _e, _f;
|
|
451
|
+
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';
|
|
452
|
+
}, function (props) {
|
|
453
|
+
var _a, _b, _c, _d, _e, _f;
|
|
454
|
+
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';
|
|
455
|
+
});
|
|
456
|
+
var templateObject_1$N, templateObject_2$F;
|
|
457
|
+
|
|
458
|
+
var wavesAnimation = keyframes(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"], ["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"])));
|
|
459
|
+
var progressBarAnimation = keyframes(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"], ["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"])));
|
|
460
|
+
var dualRingSpinnerAnimation = 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"])));
|
|
461
|
+
var progressBorderAnimation = keyframes(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
462
|
+
var templateObject_1$M, templateObject_2$E, templateObject_3$s, templateObject_4$m;
|
|
463
|
+
|
|
464
|
+
var OverlayContainer = styled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"])), function (props) {
|
|
476
465
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
477
466
|
}, function (props) {
|
|
478
467
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
479
468
|
});
|
|
480
|
-
var OverlayInner$2 = styled.div(templateObject_2$
|
|
469
|
+
var OverlayInner$2 = styled.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) {
|
|
481
470
|
var _a;
|
|
482
471
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
483
472
|
}, function (props) {
|
|
484
473
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
485
474
|
});
|
|
486
|
-
var OverlayImageContainer = styled.div(templateObject_3$
|
|
487
|
-
var OverlayImageRow = styled.div(templateObject_4$
|
|
488
|
-
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$
|
|
475
|
+
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"])));
|
|
476
|
+
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"])));
|
|
477
|
+
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
489
478
|
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"])));
|
|
490
479
|
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"])));
|
|
491
|
-
var WideBorderButton = styled(WideButton)(templateObject_8$
|
|
480
|
+
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) {
|
|
492
481
|
var _a, _b;
|
|
493
482
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.textColor) !== null && _b !== void 0 ? _b : 'black';
|
|
494
483
|
}, function (props) {
|
|
@@ -498,7 +487,26 @@ var WideBorderButton = styled(WideButton)(templateObject_8$4 || (templateObject_
|
|
|
498
487
|
var _a, _b;
|
|
499
488
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.borderColor) !== null && _b !== void 0 ? _b : 'var(--idm-color-secondary-500)';
|
|
500
489
|
});
|
|
501
|
-
var
|
|
490
|
+
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"])));
|
|
491
|
+
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) {
|
|
492
|
+
var _a;
|
|
493
|
+
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
494
|
+
}, function (props) {
|
|
495
|
+
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
496
|
+
});
|
|
497
|
+
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"])));
|
|
498
|
+
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"])));
|
|
499
|
+
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"])));
|
|
500
|
+
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) {
|
|
501
|
+
return props.$progress;
|
|
502
|
+
});
|
|
503
|
+
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);
|
|
504
|
+
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"])));
|
|
505
|
+
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"])));
|
|
506
|
+
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"])));
|
|
507
|
+
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"])));
|
|
508
|
+
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"])));
|
|
509
|
+
var templateObject_1$L, templateObject_2$D, templateObject_3$r, templateObject_4$l, templateObject_5$e, templateObject_6$a, templateObject_7$7, templateObject_8$3, templateObject_9$3, templateObject_10$2, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20;
|
|
502
510
|
|
|
503
511
|
var GeolocationAccessDeniedOverlay = function GeolocationAccessDeniedOverlay(_a) {
|
|
504
512
|
var accessBlockedImageUrl = _a.accessBlockedImageUrl;
|
|
@@ -5115,13 +5123,13 @@ function CameraTamperSeal(_a) {
|
|
|
5115
5123
|
}, messageText)));
|
|
5116
5124
|
}
|
|
5117
5125
|
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
5118
|
-
var StyledOverlayHeading = styled.h3(templateObject_2$
|
|
5126
|
+
var StyledOverlayHeading = styled.h3(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
5119
5127
|
function useCameraStore(selector) {
|
|
5120
5128
|
var store = useContext(CameraStoreContext);
|
|
5121
5129
|
if (!store) throw new Error('useCameraStore cannot be used without Provider');
|
|
5122
5130
|
return useStore(store, selector);
|
|
5123
5131
|
}
|
|
5124
|
-
var templateObject_1$J, templateObject_2$
|
|
5132
|
+
var templateObject_1$J, templateObject_2$C;
|
|
5125
5133
|
|
|
5126
5134
|
var DocumentDetectionModelContext = /*#__PURE__*/createContext({
|
|
5127
5135
|
startDocumentDetection: function startDocumentDetection() {
|
|
@@ -6087,11 +6095,11 @@ function DebugStatsPane(_a) {
|
|
|
6087
6095
|
return /*#__PURE__*/createPortal(element, portalLocation);
|
|
6088
6096
|
}
|
|
6089
6097
|
var DebugStatsPaneDiv = styled.span(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n margin-right: 20px;\n padding: 8px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10002;\n"], ["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n margin-right: 20px;\n padding: 8px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10002;\n"])));
|
|
6090
|
-
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$
|
|
6098
|
+
var ObjectDetectionDebugOverlayDiv = styled.div(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n position: absolute;\n z-index: 1001;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n ", "\n transform-style: preserve-3d;\n"], ["\n position: absolute;\n z-index: 1001;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n ", "\n transform-style: preserve-3d;\n"])), function (_a) {
|
|
6091
6099
|
var $flipX = _a.$flipX;
|
|
6092
6100
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
6093
6101
|
});
|
|
6094
|
-
var ObjectDetectionDebugBox = styled.div(templateObject_3$
|
|
6102
|
+
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) {
|
|
6095
6103
|
var $color = _a.$color;
|
|
6096
6104
|
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
6097
6105
|
}, function (_a) {
|
|
@@ -6101,7 +6109,7 @@ var ObjectDetectionDebugBox = styled.div(templateObject_3$r || (templateObject_3
|
|
|
6101
6109
|
var $flipX = _a.$flipX;
|
|
6102
6110
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
6103
6111
|
});
|
|
6104
|
-
var FaceDetectionKeypointMarker = styled.div(templateObject_4$
|
|
6112
|
+
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) {
|
|
6105
6113
|
var $color = _a.$color;
|
|
6106
6114
|
return $color !== null && $color !== void 0 ? $color : 'red';
|
|
6107
6115
|
}, function (_a) {
|
|
@@ -6292,29 +6300,7 @@ function SelfieCaptureFaceKeypoint(_a) {
|
|
|
6292
6300
|
}
|
|
6293
6301
|
});
|
|
6294
6302
|
}
|
|
6295
|
-
var templateObject_1$I, templateObject_2$
|
|
6296
|
-
|
|
6297
|
-
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) {
|
|
6298
|
-
var $top = _a.$top;
|
|
6299
|
-
return $top !== null && $top !== void 0 ? $top : '10vh';
|
|
6300
|
-
}, function (_a) {
|
|
6301
|
-
var $bottom = _a.$bottom;
|
|
6302
|
-
return $bottom ? "bottom: ".concat($bottom, ";") : "";
|
|
6303
|
-
});
|
|
6304
|
-
var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
6305
|
-
var element = /*#__PURE__*/React__default.createElement(GuidanceMessageContainerDiv, _assign({}, props));
|
|
6306
|
-
var portalLocation = document.getElementById('idmission-above-guides-content');
|
|
6307
|
-
if (!portalLocation) return element;
|
|
6308
|
-
return /*#__PURE__*/createPortal(element, portalLocation);
|
|
6309
|
-
};
|
|
6310
|
-
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) {
|
|
6311
|
-
var _a, _b, _c, _d, _e, _f;
|
|
6312
|
-
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';
|
|
6313
|
-
}, function (props) {
|
|
6314
|
-
var _a, _b, _c, _d, _e, _f;
|
|
6315
|
-
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';
|
|
6316
|
-
});
|
|
6317
|
-
var templateObject_1$H, templateObject_2$z;
|
|
6303
|
+
var templateObject_1$I, templateObject_2$B, templateObject_3$q, templateObject_4$k;
|
|
6318
6304
|
|
|
6319
6305
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
6320
6306
|
var _b = _a.classNames,
|
|
@@ -6329,7 +6315,7 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
|
6329
6315
|
buttonText: 'OK'
|
|
6330
6316
|
});
|
|
6331
6317
|
if (!allowOverrideWrongDocumentTypeGuidance) return null;
|
|
6332
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
6318
|
+
return /*#__PURE__*/React__default.createElement(Container$6, {
|
|
6333
6319
|
className: classNames.container
|
|
6334
6320
|
}, /*#__PURE__*/React__default.createElement(InnerContainer, {
|
|
6335
6321
|
className: classNames.inner
|
|
@@ -6347,18 +6333,18 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
|
6347
6333
|
}
|
|
6348
6334
|
}, verbiage.buttonText))));
|
|
6349
6335
|
}
|
|
6350
|
-
var Container$
|
|
6336
|
+
var Container$6 = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"], ["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"])), function (props) {
|
|
6351
6337
|
var _a, _b, _c;
|
|
6352
6338
|
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';
|
|
6353
6339
|
}, function (props) {
|
|
6354
6340
|
var _a, _b, _c;
|
|
6355
6341
|
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';
|
|
6356
6342
|
});
|
|
6357
|
-
var InnerContainer = styled.div(templateObject_2$
|
|
6358
|
-
var Message = styled.span(templateObject_3$
|
|
6359
|
-
var ButtonContainer = styled.div(templateObject_4$
|
|
6360
|
-
var Button$1 = styled(LoaderButton)(templateObject_5$
|
|
6361
|
-
var templateObject_1$
|
|
6343
|
+
var InnerContainer = styled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 16px 24px;\n margin: auto 0;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 16px 24px;\n margin: auto 0;\n width: 100%;\n"])));
|
|
6344
|
+
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"])));
|
|
6345
|
+
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"])));
|
|
6346
|
+
var Button$1 = styled(LoaderButton)(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n white-space: nowrap;\n margin: auto;\n"], ["\n white-space: nowrap;\n margin: auto;\n"])));
|
|
6347
|
+
var templateObject_1$H, templateObject_2$A, templateObject_3$p, templateObject_4$j, templateObject_5$d;
|
|
6362
6348
|
|
|
6363
6349
|
// This is a simplified version of https://github.com/ZeeCoder/use-resize-observer.
|
|
6364
6350
|
// We have removed all options and made it compliant with React Compiler/React 19.
|
|
@@ -6477,37 +6463,37 @@ function extractSize(entry, sizeType) {
|
|
|
6477
6463
|
}
|
|
6478
6464
|
|
|
6479
6465
|
var IdCapture = function IdCapture(_a) {
|
|
6480
|
-
var _b, _c, _d, _e, _f, _g
|
|
6466
|
+
var _b, _c, _d, _e, _f, _g;
|
|
6481
6467
|
var requiredDocumentType = _a.requiredDocumentType,
|
|
6482
|
-
|
|
6483
|
-
thresholds =
|
|
6468
|
+
_h = _a.thresholds,
|
|
6469
|
+
thresholds = _h === void 0 ? defaultIdCaptureThresholds : _h,
|
|
6484
6470
|
guidanceMessage = _a.guidanceMessage,
|
|
6485
6471
|
guidanceSatisfied = _a.guidanceSatisfied,
|
|
6486
6472
|
onCapture = _a.onCapture,
|
|
6487
|
-
|
|
6488
|
-
classNames =
|
|
6489
|
-
|
|
6490
|
-
colors =
|
|
6491
|
-
|
|
6492
|
-
rawVerbiage =
|
|
6493
|
-
|
|
6494
|
-
debugMode =
|
|
6495
|
-
var
|
|
6496
|
-
ref =
|
|
6497
|
-
|
|
6498
|
-
width =
|
|
6499
|
-
|
|
6500
|
-
height =
|
|
6473
|
+
_j = _a.classNames,
|
|
6474
|
+
classNames = _j === void 0 ? {} : _j,
|
|
6475
|
+
_k = _a.colors,
|
|
6476
|
+
colors = _k === void 0 ? {} : _k,
|
|
6477
|
+
_l = _a.verbiage,
|
|
6478
|
+
rawVerbiage = _l === void 0 ? {} : _l,
|
|
6479
|
+
_m = _a.debugMode,
|
|
6480
|
+
debugMode = _m === void 0 ? false : _m;
|
|
6481
|
+
var _o = useResizeObserver(),
|
|
6482
|
+
ref = _o.ref,
|
|
6483
|
+
_p = _o.width,
|
|
6484
|
+
width = _p === void 0 ? 1 : _p,
|
|
6485
|
+
_q = _o.height,
|
|
6486
|
+
height = _q === void 0 ? 1 : _q;
|
|
6501
6487
|
var state = useIdCaptureStore();
|
|
6502
|
-
var
|
|
6503
|
-
camera =
|
|
6504
|
-
isRearFacing =
|
|
6505
|
-
var
|
|
6506
|
-
modelsReady =
|
|
6507
|
-
setThresholds =
|
|
6508
|
-
detectionTime =
|
|
6509
|
-
focusPredictionTime =
|
|
6510
|
-
getBestFrame =
|
|
6488
|
+
var _r = useCameraStore(),
|
|
6489
|
+
camera = _r.camera,
|
|
6490
|
+
isRearFacing = _r.isRearFacing;
|
|
6491
|
+
var _s = useContext(IdCaptureModelsContext),
|
|
6492
|
+
modelsReady = _s.ready,
|
|
6493
|
+
setThresholds = _s.setThresholds,
|
|
6494
|
+
detectionTime = _s.detectionTime,
|
|
6495
|
+
focusPredictionTime = _s.focusPredictionTime,
|
|
6496
|
+
getBestFrame = _s.getBestFrame;
|
|
6511
6497
|
useEffect(function () {
|
|
6512
6498
|
return dispatchIdCaptureAction({
|
|
6513
6499
|
type: 'captureInitialized'
|
|
@@ -6580,11 +6566,6 @@ var IdCapture = function IdCapture(_a) {
|
|
|
6580
6566
|
var theme = useTheme();
|
|
6581
6567
|
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');
|
|
6582
6568
|
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');
|
|
6583
|
-
// console.log(
|
|
6584
|
-
// `${
|
|
6585
|
-
// documentTypeDisplayNames[state.detectedDocumentType]
|
|
6586
|
-
// } detected, hold still...`,
|
|
6587
|
-
// )
|
|
6588
6569
|
var verbiage = useTranslations(rawVerbiage, {
|
|
6589
6570
|
instructionText: 'Scan the front of ID',
|
|
6590
6571
|
processingIdCardText: 'ID card front captured.',
|
|
@@ -6609,12 +6590,12 @@ var IdCapture = function IdCapture(_a) {
|
|
|
6609
6590
|
var satisfied = state.isGoodFrame;
|
|
6610
6591
|
if (typeof guidanceSatisfied === 'boolean') satisfied = guidanceSatisfied;
|
|
6611
6592
|
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 : '');
|
|
6612
|
-
return /*#__PURE__*/React__default.createElement(
|
|
6593
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
6613
6594
|
ref: ref,
|
|
6614
|
-
className:
|
|
6595
|
+
className: classNames.container
|
|
6615
6596
|
}, guidanceMessage !== '' && ( /*#__PURE__*/React__default.createElement(GuidanceMessageContainer, {
|
|
6616
6597
|
"$top": "",
|
|
6617
|
-
"$bottom": "12.
|
|
6598
|
+
"$bottom": "12.5%",
|
|
6618
6599
|
className: classNames.guidanceMessageContainer
|
|
6619
6600
|
}, /*#__PURE__*/React__default.createElement(GuidanceMessage, {
|
|
6620
6601
|
"$variant": satisfied ? 'positive' : 'default',
|
|
@@ -6662,7 +6643,7 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
|
|
|
6662
6643
|
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
6663
6644
|
}, /*#__PURE__*/React__default.createElement(StyledOverlayInner$3, {
|
|
6664
6645
|
className: classNames.inner
|
|
6665
|
-
}, /*#__PURE__*/React__default.createElement(StyledOverlayImageContainer$
|
|
6646
|
+
}, /*#__PURE__*/React__default.createElement(StyledOverlayImageContainer$1, {
|
|
6666
6647
|
className: classNames.imageContainer
|
|
6667
6648
|
}, /*#__PURE__*/React__default.createElement("img", {
|
|
6668
6649
|
src: assets.imageUrl,
|
|
@@ -6680,13 +6661,13 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
|
|
|
6680
6661
|
finished: true
|
|
6681
6662
|
}, verbiage.retryBtnText)));
|
|
6682
6663
|
};
|
|
6683
|
-
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$
|
|
6684
|
-
var StyledOverlayImageContainer$
|
|
6685
|
-
var Description$4 = styled.p(templateObject_3$
|
|
6686
|
-
var RetryButton$1 = styled(LoaderButton)(templateObject_4$
|
|
6687
|
-
var templateObject_1$
|
|
6664
|
+
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
6665
|
+
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
6666
|
+
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"])));
|
|
6667
|
+
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"])));
|
|
6668
|
+
var templateObject_1$G, templateObject_2$z, templateObject_3$o, templateObject_4$i;
|
|
6688
6669
|
|
|
6689
|
-
var ExitCaptureStyledButton = styled.button(templateObject_1$
|
|
6670
|
+
var ExitCaptureStyledButton = styled.button(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n position: absolute;\n top: 12px;\n right: 12px;\n font-size: 20px;\n width: 32px;\n height: 32px;\n font-family: monospace;\n z-index: 1002;\n border: none;\n border-radius: 4px;\n background: #ccc;\n cursor: pointer;\n padding: 8px;\n box-sizing: border-box;\n display: flex;\n\n &:hover {\n background: #ddd;\n }\n\n & > svg {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n"], ["\n position: absolute;\n top: 12px;\n right: 12px;\n font-size: 20px;\n width: 32px;\n height: 32px;\n font-family: monospace;\n z-index: 1002;\n border: none;\n border-radius: 4px;\n background: #ccc;\n cursor: pointer;\n padding: 8px;\n box-sizing: border-box;\n display: flex;\n\n &:hover {\n background: #ddd;\n }\n\n & > svg {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n"])));
|
|
6690
6671
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
6691
6672
|
var onClick = _a.onClick,
|
|
6692
6673
|
className = _a.className;
|
|
@@ -6730,10 +6711,7 @@ var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
|
6730
6711
|
y2: "19.75"
|
|
6731
6712
|
}))));
|
|
6732
6713
|
};
|
|
6733
|
-
var templateObject_1$
|
|
6734
|
-
|
|
6735
|
-
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"])));
|
|
6736
|
-
var templateObject_1$D;
|
|
6714
|
+
var templateObject_1$F;
|
|
6737
6715
|
|
|
6738
6716
|
function IdCaptureLoadingGraphic(props) {
|
|
6739
6717
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -6741,14 +6719,10 @@ function IdCaptureLoadingGraphic(props) {
|
|
|
6741
6719
|
}
|
|
6742
6720
|
function IdCaptureLoadingGraphicDesktop(_a) {
|
|
6743
6721
|
var _b, _c, _d, _e, _f, _g;
|
|
6744
|
-
var
|
|
6745
|
-
|
|
6746
|
-
|
|
6747
|
-
|
|
6748
|
-
className = _a.className;
|
|
6749
|
-
var _k = useState(0),
|
|
6750
|
-
frame = _k[0],
|
|
6751
|
-
setFrame = _k[1];
|
|
6722
|
+
var className = _a.className;
|
|
6723
|
+
var _h = useState(0),
|
|
6724
|
+
frame = _h[0],
|
|
6725
|
+
setFrame = _h[1];
|
|
6752
6726
|
useEffect(function () {
|
|
6753
6727
|
var i = setInterval(function () {
|
|
6754
6728
|
setFrame(function (n) {
|
|
@@ -6764,8 +6738,6 @@ function IdCaptureLoadingGraphicDesktop(_a) {
|
|
|
6764
6738
|
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;
|
|
6765
6739
|
return /*#__PURE__*/React__default.createElement(LoadingGraphicWrapper, null, /*#__PURE__*/React__default.createElement(LoadingGraphicSvg, {
|
|
6766
6740
|
className: className,
|
|
6767
|
-
width: width,
|
|
6768
|
-
height: height,
|
|
6769
6741
|
"$frame": frame,
|
|
6770
6742
|
"$borderColor": accentColor,
|
|
6771
6743
|
viewBox: "0 0 698 452",
|
|
@@ -7214,21 +7186,21 @@ function IdCaptureLoadingGraphicMobile(_a) {
|
|
|
7214
7186
|
fill: "white"
|
|
7215
7187
|
}))));
|
|
7216
7188
|
}
|
|
7217
|
-
var LoadingGraphicWrapper = styled.div(templateObject_1$
|
|
7218
|
-
var LoadingGraphicSvg = styled.svg(templateObject_2$
|
|
7189
|
+
var LoadingGraphicWrapper = styled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
|
|
7190
|
+
var LoadingGraphicSvg = styled.svg(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n margin: auto;\n transform: scale(\n ", "\n );\n transform-style: preserve-3d;\n transition:\n transform 0.2s linear,\n border-width 0.2s linear;\n border: ", "px solid\n ", ";\n max-height: 80%;\n max-width: 80%;\n"], ["\n margin: auto;\n transform: scale(\n ", "\n );\n transform-style: preserve-3d;\n transition:\n transform 0.2s linear,\n border-width 0.2s linear;\n border: ", "px solid\n ", ";\n max-height: 80%;\n max-width: 80%;\n"])), function (props) {
|
|
7219
7191
|
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
7220
7192
|
}, function (props) {
|
|
7221
7193
|
return props.$frame >= 5 ? 10 : 0;
|
|
7222
7194
|
}, function (props) {
|
|
7223
7195
|
return props.$borderColor;
|
|
7224
7196
|
});
|
|
7225
|
-
var LoadingGraphicCardGroup = styled.g(templateObject_3$
|
|
7197
|
+
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) {
|
|
7226
7198
|
return props.$offScreen ? '-500px' : '0';
|
|
7227
7199
|
});
|
|
7228
|
-
var LoadingGraphicPhoneGroup = styled.g(templateObject_4$
|
|
7200
|
+
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) {
|
|
7229
7201
|
return props.$offScreen ? '40px' : '0';
|
|
7230
7202
|
});
|
|
7231
|
-
var templateObject_1$
|
|
7203
|
+
var templateObject_1$E, templateObject_2$y, templateObject_3$n, templateObject_4$h;
|
|
7232
7204
|
|
|
7233
7205
|
function LoadingListItemIndicator(_a) {
|
|
7234
7206
|
var _b = _a.state,
|
|
@@ -7279,12 +7251,6 @@ function LoadingListItemIndicator(_a) {
|
|
|
7279
7251
|
}))))));
|
|
7280
7252
|
}
|
|
7281
7253
|
|
|
7282
|
-
var wavesAnimation = 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"])));
|
|
7283
|
-
var progressBarAnimation = 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"])));
|
|
7284
|
-
var dualRingSpinnerAnimation = 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"])));
|
|
7285
|
-
var progressBorderAnimation = keyframes(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
7286
|
-
var templateObject_1$B, templateObject_2$v, templateObject_3$n, templateObject_4$h;
|
|
7287
|
-
|
|
7288
7254
|
var legacyInstructionImageUrl$1 = "".concat(DEFAULT_CDN_URL, "/WebSDK-Instruction-DL-Capture-3-Portrait.png");
|
|
7289
7255
|
var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a) {
|
|
7290
7256
|
var _b, _c, _d, _e;
|
|
@@ -7365,13 +7331,10 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
|
|
|
7365
7331
|
}, onUserCancel && ( /*#__PURE__*/React__default.createElement(ExitCaptureButton, {
|
|
7366
7332
|
onClick: onUserCancel,
|
|
7367
7333
|
className: classNames.cancelBtn
|
|
7368
|
-
})), customOverlayContent || ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(
|
|
7334
|
+
})), customOverlayContent || ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(LoadingOverlayHeader, null, /*#__PURE__*/React__default.createElement(LoadingOverlayGuidanceMessage, {
|
|
7369
7335
|
className: classNames.heading
|
|
7370
|
-
}, verbiage.headingText)), /*#__PURE__*/React__default.createElement(
|
|
7371
|
-
className: classNames.imageContainer
|
|
7372
|
-
style: {
|
|
7373
|
-
pointerEvents: 'none'
|
|
7374
|
-
}
|
|
7336
|
+
}, verbiage.headingText)), /*#__PURE__*/React__default.createElement(LoadingOverlayImageContainer, {
|
|
7337
|
+
className: classNames.imageContainer
|
|
7375
7338
|
}, (assets === null || assets === void 0 ? void 0 : assets.instructionImageUrl) && assets.instructionImageUrl !== legacyInstructionImageUrl$1 ? ( /*#__PURE__*/React__default.createElement(CustomLoadingGraphic$1, {
|
|
7376
7339
|
ref: imageRef,
|
|
7377
7340
|
alt: verbiage.headingText,
|
|
@@ -7395,27 +7358,27 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
|
|
|
7395
7358
|
}), /*#__PURE__*/React__default.createElement("label", {
|
|
7396
7359
|
htmlFor: "use-continuity-camera",
|
|
7397
7360
|
className: classNames.continuityCameraCheckboxLabel
|
|
7398
|
-
}, verbiage.useContinuityCameraText)))), /*#__PURE__*/React__default.createElement(
|
|
7361
|
+
}, verbiage.useContinuityCameraText)))), /*#__PURE__*/React__default.createElement(ButtonsRow$1, {
|
|
7399
7362
|
className: classNames.buttonsRow
|
|
7400
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
7363
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayProgressContainer, {
|
|
7401
7364
|
className: classNames.progressContainer
|
|
7402
7365
|
}, /*#__PURE__*/React__default.createElement(ProgressBarBackground$1, {
|
|
7403
7366
|
className: classNames.progressBackground
|
|
7404
|
-
}), /*#__PURE__*/React__default.createElement(
|
|
7367
|
+
}), /*#__PURE__*/React__default.createElement(LoadingOverlayProgressBar, {
|
|
7405
7368
|
"$progress": modelDownloadProgress,
|
|
7406
7369
|
className: classNames.progressBar
|
|
7407
7370
|
}, /*#__PURE__*/React__default.createElement(ProgressIndicator$1, {
|
|
7408
7371
|
className: classNames.progressIndicator
|
|
7409
|
-
}))), /*#__PURE__*/React__default.createElement(
|
|
7372
|
+
}))), /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingListContainer, {
|
|
7410
7373
|
className: classNames.loadingListContainer
|
|
7411
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
7374
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingList, {
|
|
7412
7375
|
className: classNames.loadingList
|
|
7413
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
7376
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingListItem, {
|
|
7414
7377
|
className: cn(classNames.loadingListItem, cameraReady ? 'done' : 'running')
|
|
7415
7378
|
}, /*#__PURE__*/React__default.createElement(LoadingListItemIndicator, {
|
|
7416
7379
|
className: classNames.loadingListItemIndicator,
|
|
7417
7380
|
state: cameraReady ? 'done' : 'running'
|
|
7418
|
-
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React__default.createElement(
|
|
7381
|
+
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingListItem, {
|
|
7419
7382
|
className: cn(classNames.loadingListItem, sessionReady && modelsReady ? 'done' : 'running')
|
|
7420
7383
|
}, /*#__PURE__*/React__default.createElement(LoadingListItemIndicator, {
|
|
7421
7384
|
className: classNames.loadingListItemIndicator,
|
|
@@ -7434,52 +7397,34 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
|
|
|
7434
7397
|
}
|
|
7435
7398
|
}, verbiage.continueText))))));
|
|
7436
7399
|
};
|
|
7437
|
-
var OverlayInner$1 = styled
|
|
7400
|
+
var OverlayInner$1 = styled(LoadingOverlayInner)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
7438
7401
|
var _a, _b, _c, _d;
|
|
7439
7402
|
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';
|
|
7440
7403
|
}, function (props) {
|
|
7441
7404
|
var _a, _b, _c, _d;
|
|
7442
7405
|
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';
|
|
7443
7406
|
});
|
|
7444
|
-
var
|
|
7445
|
-
|
|
7446
|
-
|
|
7447
|
-
|
|
7448
|
-
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
7449
|
-
});
|
|
7450
|
-
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"])));
|
|
7451
|
-
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"])));
|
|
7452
|
-
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"])));
|
|
7453
|
-
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"])));
|
|
7454
|
-
var ContinuityCameraCheckbox$1 = styled.input(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
7455
|
-
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) {
|
|
7407
|
+
var ContinuityCameraCheckboxContainer$1 = styled.div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n position: absolute;\n bottom: 120px;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n bottom: 120px;\n width: 100%;\n display: flex;\n"])));
|
|
7408
|
+
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"])));
|
|
7409
|
+
var ContinuityCameraCheckbox$1 = styled.input(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
7410
|
+
var ButtonsRow$1 = styled(LoadingOverlayButtonsRow)(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n color: ", ";\n ", "\n"], ["\n color: ", ";\n ", "\n"])), function (props) {
|
|
7456
7411
|
var _a, _b, _c, _d;
|
|
7457
7412
|
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';
|
|
7458
7413
|
}, function (props) {
|
|
7459
7414
|
var _a, _b, _c, _d, _e, _f;
|
|
7460
7415
|
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, ";") : '';
|
|
7461
7416
|
});
|
|
7462
|
-
var
|
|
7463
|
-
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"])));
|
|
7464
|
-
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"])));
|
|
7465
|
-
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"])));
|
|
7466
|
-
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) {
|
|
7417
|
+
var ProgressBarBackground$1 = styled(LoadingOverlayProgressBarBackground)(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n background: ", ";\n opacity: ", ";\n"], ["\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
7467
7418
|
var _a, _b, _c, _d;
|
|
7468
7419
|
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)';
|
|
7469
7420
|
}, function (props) {
|
|
7470
7421
|
var _a, _b, _c, _d;
|
|
7471
7422
|
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;
|
|
7472
7423
|
});
|
|
7473
|
-
var
|
|
7474
|
-
|
|
7475
|
-
|
|
7476
|
-
var
|
|
7477
|
-
var _a, _b, _c, _d;
|
|
7478
|
-
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)';
|
|
7479
|
-
}, progressBarAnimation);
|
|
7480
|
-
var CustomLoadingGraphic$1 = styled.img(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
7481
|
-
var ContinueButtonContainer$1 = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
7482
|
-
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) {
|
|
7424
|
+
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);
|
|
7425
|
+
var CustomLoadingGraphic$1 = styled.img(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
7426
|
+
var ContinueButtonContainer$1 = styled.div(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
7427
|
+
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) {
|
|
7483
7428
|
var _a, _b, _c, _d, _e, _f;
|
|
7484
7429
|
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, ";") : '';
|
|
7485
7430
|
}, function (props) {
|
|
@@ -7489,10 +7434,10 @@ var ContinueButton$1 = styled(LoaderButton)(templateObject_18 || (templateObject
|
|
|
7489
7434
|
var _a, _b, _c, _d, _e, _f;
|
|
7490
7435
|
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, ";") : '';
|
|
7491
7436
|
});
|
|
7492
|
-
var templateObject_1$
|
|
7437
|
+
var templateObject_1$D, templateObject_2$x, templateObject_3$m, templateObject_4$g, templateObject_5$c, templateObject_6$9, templateObject_7$6, templateObject_8$2, templateObject_9$2, templateObject_10$1;
|
|
7493
7438
|
|
|
7494
|
-
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$
|
|
7495
|
-
var ContinuityCameraCheckbox = styled.input(templateObject_2$
|
|
7439
|
+
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
|
|
7440
|
+
var ContinuityCameraCheckbox = styled.input(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
7496
7441
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
7497
7442
|
var _b, _c, _d, _e;
|
|
7498
7443
|
var onDismissed = _a.onDismissed,
|
|
@@ -7613,7 +7558,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
|
7613
7558
|
}
|
|
7614
7559
|
}, ready ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
7615
7560
|
};
|
|
7616
|
-
var templateObject_1$
|
|
7561
|
+
var templateObject_1$C, templateObject_2$w;
|
|
7617
7562
|
|
|
7618
7563
|
var components$1 = {
|
|
7619
7564
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -7671,9 +7616,9 @@ var CapturedDocumentImg = function CapturedDocumentImg(_a) {
|
|
|
7671
7616
|
});
|
|
7672
7617
|
};
|
|
7673
7618
|
|
|
7674
|
-
var Card = styled.div(templateObject_1$
|
|
7675
|
-
var FlexCard = styled(Card)(templateObject_2$
|
|
7676
|
-
var templateObject_1$
|
|
7619
|
+
var Card = styled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n background: white;\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n margin: auto;\n max-width: min(500px, 100% - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"], ["\n background: white;\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n margin: auto;\n max-width: min(500px, 100% - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"])));
|
|
7620
|
+
var FlexCard = styled(Card)(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
7621
|
+
var templateObject_1$B, templateObject_2$v;
|
|
7677
7622
|
|
|
7678
7623
|
var imageDisplayOrder = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
7679
7624
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
@@ -7735,13 +7680,13 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
7735
7680
|
finished: true
|
|
7736
7681
|
}, verbiage.retryText)))));
|
|
7737
7682
|
};
|
|
7738
|
-
var Heading$a = styled.h1(templateObject_1$
|
|
7739
|
-
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$
|
|
7740
|
-
var ImageRow = styled(OverlayImageRow)(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n max-width: 100%;\n flex-direction: column;\n
|
|
7741
|
-
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"])));
|
|
7742
|
-
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$
|
|
7743
|
-
var DebugPre = styled.pre(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n text-align: left;\n max-width:
|
|
7744
|
-
var templateObject_1$
|
|
7683
|
+
var Heading$a = styled.h1(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n font-size: 1.5rem;\n margin-top: 0;\n margin-bottom: 1.5rem;\n"], ["\n font-size: 1.5rem;\n margin-top: 0;\n margin-bottom: 1.5rem;\n"])));
|
|
7684
|
+
var ImagesContainer = styled(OverlayImageContainer)(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n flex-grow: 1;\n overflow-y: auto;\n padding-bottom: 0;\n max-width: 100%;\n"], ["\n flex-grow: 1;\n overflow-y: auto;\n padding-bottom: 0;\n max-width: 100%;\n"])));
|
|
7685
|
+
var ImageRow = styled(OverlayImageRow)(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n max-width: 100%;\n flex-direction: column;\n position: relative;\n width: 100%;\n"], ["\n max-width: 100%;\n flex-direction: column;\n position: relative;\n width: 100%;\n"])));
|
|
7686
|
+
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"])));
|
|
7687
|
+
var StyledImage = styled(CapturedDocumentImg)(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n width: 100%;\n border-radius: 12px;\n"], ["\n width: 100%;\n border-radius: 12px;\n"])));
|
|
7688
|
+
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"])));
|
|
7689
|
+
var templateObject_1$A, templateObject_2$u, templateObject_3$l, templateObject_4$f, templateObject_5$b, templateObject_6$8;
|
|
7745
7690
|
|
|
7746
7691
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
7747
7692
|
var _this = this;
|
|
@@ -7793,10 +7738,10 @@ function resetCanvasDimensions(canvas) {
|
|
|
7793
7738
|
canvas.style.height = '0';
|
|
7794
7739
|
}
|
|
7795
7740
|
|
|
7796
|
-
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$
|
|
7741
|
+
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n"])), function (props) {
|
|
7797
7742
|
return props.$isVisible ? '' : 'opacity: 0;';
|
|
7798
7743
|
});
|
|
7799
|
-
var IdCardGuideImage = styled.img(templateObject_2$
|
|
7744
|
+
var IdCardGuideImage = styled.img(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n transform-style: preserve-3d;\n ", "\n ", "\n"], ["\n transform-style: preserve-3d;\n ", "\n ", "\n"])), function (props) {
|
|
7800
7745
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
7801
7746
|
}, function (props) {
|
|
7802
7747
|
return props.$isInvisible ? 'opacity: 0;' : '';
|
|
@@ -7942,14 +7887,14 @@ function IdCardBorderSvg(_a) {
|
|
|
7942
7887
|
}
|
|
7943
7888
|
var IdCardBorderContainer = styled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n"], ["\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n"])), wavesAnimation);
|
|
7944
7889
|
var SvgOverlay = styled.svg(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"])));
|
|
7945
|
-
var IdCardBorderRect = styled.rect(templateObject_5$
|
|
7890
|
+
var IdCardBorderRect = styled.rect(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"], ["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"])), progressBorderAnimation, function (props) {
|
|
7946
7891
|
var _a;
|
|
7947
7892
|
return (_a = props.$speed) !== null && _a !== void 0 ? _a : '3s';
|
|
7948
7893
|
}, function (props) {
|
|
7949
7894
|
var _a;
|
|
7950
7895
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
7951
7896
|
});
|
|
7952
|
-
var templateObject_1$
|
|
7897
|
+
var templateObject_1$z, templateObject_2$t, templateObject_3$k, templateObject_4$e, templateObject_5$a;
|
|
7953
7898
|
|
|
7954
7899
|
var defaultIdCaptureGuideImages = {
|
|
7955
7900
|
portrait: {
|
|
@@ -8125,12 +8070,12 @@ var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
|
|
|
8125
8070
|
style: imageStyle
|
|
8126
8071
|
})));
|
|
8127
8072
|
};
|
|
8128
|
-
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$
|
|
8073
|
+
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n backface-visibility: hidden;\n transition: transform ", "s;\n transform: ", ";\n transform-style: preserve-3d;\n position: absolute;\n display: block;\n top: 0;\n width: 100%;\n max-height: 100%;\n"], ["\n backface-visibility: hidden;\n transition: transform ", "s;\n transform: ", ";\n transform-style: preserve-3d;\n position: absolute;\n display: block;\n top: 0;\n width: 100%;\n max-height: 100%;\n"])), function (props) {
|
|
8129
8074
|
return props.$transitionTime;
|
|
8130
8075
|
}, function (props) {
|
|
8131
8076
|
return props.$transforms;
|
|
8132
8077
|
});
|
|
8133
|
-
var templateObject_1$
|
|
8078
|
+
var templateObject_1$y;
|
|
8134
8079
|
|
|
8135
8080
|
var GuideOrientationContext = /*#__PURE__*/createContext({
|
|
8136
8081
|
orientation: 'landscape',
|
|
@@ -8417,8 +8362,8 @@ var regionClsx = function regionClsx(classNames, which) {
|
|
|
8417
8362
|
return v;
|
|
8418
8363
|
}).join(' ');
|
|
8419
8364
|
};
|
|
8420
|
-
var StyledPageContainer = styled(
|
|
8421
|
-
var GuidesContainer = styled.div(templateObject_2$
|
|
8365
|
+
var StyledPageContainer = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1000;\n overflow: hidden;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1000;\n overflow: hidden;\n"])));
|
|
8366
|
+
var GuidesContainer = styled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-flow: column nowrap;\n width: 100%;\n height: 100%;\n"])));
|
|
8422
8367
|
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"])));
|
|
8423
8368
|
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) {
|
|
8424
8369
|
var _a, _b, _c, _d, _e;
|
|
@@ -8431,7 +8376,7 @@ var GuideRegion = styled.div(templateObject_4$d || (templateObject_4$d = __makeT
|
|
|
8431
8376
|
}, function (props) {
|
|
8432
8377
|
return props.$minHeight ? "min-height: ".concat(props.$minHeight, "px;") : "";
|
|
8433
8378
|
});
|
|
8434
|
-
var Spacer = styled(GuideRegion)(templateObject_5$
|
|
8379
|
+
var Spacer = styled(GuideRegion)(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: block;\n width: auto;\n"], ["\n display: block;\n width: auto;\n"])));
|
|
8435
8380
|
var GuideCenterRegion = styled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"], ["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"])), function (props) {
|
|
8436
8381
|
return props.$minWidth ? "min-width: ".concat(props.$minWidth, "px;") : "";
|
|
8437
8382
|
}, function (props) {
|
|
@@ -8443,9 +8388,9 @@ var GuideCenterBorder = styled.div(templateObject_7$5 || (templateObject_7$5 = _
|
|
|
8443
8388
|
}, function (props) {
|
|
8444
8389
|
return props.$padding ? "padding: ".concat(props.$padding, "px;") : '';
|
|
8445
8390
|
});
|
|
8446
|
-
var GuideText = styled.span(templateObject_8$
|
|
8447
|
-
var GuideCenterInner = styled.div(templateObject_9$
|
|
8448
|
-
var templateObject_1$
|
|
8391
|
+
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"])));
|
|
8392
|
+
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"])));
|
|
8393
|
+
var templateObject_1$x, templateObject_2$s, templateObject_3$j, templateObject_4$d, templateObject_5$9, templateObject_6$7, templateObject_7$5, templateObject_8$1, templateObject_9$1;
|
|
8449
8394
|
|
|
8450
8395
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
8451
8396
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -8586,11 +8531,11 @@ var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
|
8586
8531
|
progress: progress
|
|
8587
8532
|
}));
|
|
8588
8533
|
};
|
|
8589
|
-
var CanvasWrapper$1 = styled.div(templateObject_1$
|
|
8534
|
+
var CanvasWrapper$1 = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n z-index: -1;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n z-index: -1;\n"])), function (props) {
|
|
8590
8535
|
return props.$maskColor;
|
|
8591
8536
|
});
|
|
8592
|
-
var Canvas$1 = styled.canvas(templateObject_2$
|
|
8593
|
-
var templateObject_1$
|
|
8537
|
+
var Canvas$1 = styled.canvas(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
8538
|
+
var templateObject_1$w, templateObject_2$r;
|
|
8594
8539
|
|
|
8595
8540
|
function IdCaptureGuides(_a) {
|
|
8596
8541
|
var _b = _a.guideType,
|
|
@@ -8646,7 +8591,7 @@ function IdCaptureGuides(_a) {
|
|
|
8646
8591
|
})));
|
|
8647
8592
|
}
|
|
8648
8593
|
|
|
8649
|
-
var Spinner = styled.div(templateObject_1$
|
|
8594
|
+
var Spinner = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n display: inline-block;\n width: ", "px;\n height: ", "px;\n margin: auto;\n\n &:after {\n content: ' ';\n display: block;\n width: ", "px;\n height: ", "px;\n margin: 8px;\n border-radius: 50%;\n border: ", "px solid\n ", ";\n border-color: ", " transparent\n ", " transparent;\n animation: ", " 1.2s linear infinite;\n box-sizing: content-box;\n }\n"], ["\n display: inline-block;\n width: ", "px;\n height: ", "px;\n margin: auto;\n\n &:after {\n content: ' ';\n display: block;\n width: ", "px;\n height: ", "px;\n margin: 8px;\n border-radius: 50%;\n border: ", "px solid\n ", ";\n border-color: ", " transparent\n ", " transparent;\n animation: ", " 1.2s linear infinite;\n box-sizing: content-box;\n }\n"])), function (_a) {
|
|
8650
8595
|
var $size = _a.$size;
|
|
8651
8596
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
8652
8597
|
}, function (_a) {
|
|
@@ -8671,7 +8616,11 @@ var Spinner = styled.div(templateObject_1$s || (templateObject_1$s = __makeTempl
|
|
|
8671
8616
|
var $color = _a.$color;
|
|
8672
8617
|
return $color !== null && $color !== void 0 ? $color : '#888';
|
|
8673
8618
|
}, dualRingSpinnerAnimation);
|
|
8674
|
-
var
|
|
8619
|
+
var SpinnerPageContainer = styled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"])));
|
|
8620
|
+
function SpinnerPage() {
|
|
8621
|
+
return /*#__PURE__*/React__default.createElement(SpinnerPageContainer, null, /*#__PURE__*/React__default.createElement(Spinner, null));
|
|
8622
|
+
}
|
|
8623
|
+
var templateObject_1$v, templateObject_2$q;
|
|
8675
8624
|
|
|
8676
8625
|
var IdCaptureImagePreview = function IdCaptureImagePreview(_a) {
|
|
8677
8626
|
var _b = _a.classNames,
|
|
@@ -8758,11 +8707,11 @@ var SelfieProgressPreview = function SelfieProgressPreview(_a) {
|
|
|
8758
8707
|
onError: onError
|
|
8759
8708
|
})));
|
|
8760
8709
|
};
|
|
8761
|
-
var StyledSpinner = styled(Spinner)(templateObject_1$
|
|
8762
|
-
var ImagePreviewWrapper = styled.div(templateObject_2$
|
|
8710
|
+
var StyledSpinner = styled(Spinner)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n position: relative;\n top: 4px;\n left: -3px;\n margin: 0 3px 0 -12px;\n"], ["\n position: relative;\n top: 4px;\n left: -3px;\n margin: 0 3px 0 -12px;\n"])));
|
|
8711
|
+
var ImagePreviewWrapper = styled.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"], ["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"])));
|
|
8763
8712
|
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"])));
|
|
8764
8713
|
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"])));
|
|
8765
|
-
var templateObject_1$
|
|
8714
|
+
var templateObject_1$u, templateObject_2$p, templateObject_3$i, templateObject_4$c;
|
|
8766
8715
|
|
|
8767
8716
|
var documentCaptureInitialState = {
|
|
8768
8717
|
documents: [],
|
|
@@ -9110,16 +9059,16 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
|
|
|
9110
9059
|
ref: canvasRef
|
|
9111
9060
|
}));
|
|
9112
9061
|
};
|
|
9113
|
-
var CanvasWrapper = styled.div(templateObject_1$
|
|
9062
|
+
var CanvasWrapper = styled.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n"], ["\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n"])), function (props) {
|
|
9114
9063
|
return props.$maskColor;
|
|
9115
9064
|
});
|
|
9116
|
-
var Canvas = styled.canvas(templateObject_2$
|
|
9117
|
-
var templateObject_1$
|
|
9065
|
+
var Canvas = styled.canvas(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
9066
|
+
var templateObject_1$t, templateObject_2$o;
|
|
9118
9067
|
|
|
9119
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
9068
|
+
var CameraFeedWrapper = styled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
9120
9069
|
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;") : "";
|
|
9121
9070
|
});
|
|
9122
|
-
var templateObject_1$
|
|
9071
|
+
var templateObject_1$s;
|
|
9123
9072
|
|
|
9124
9073
|
var CameraVideoTag = function CameraVideoTag(props) {
|
|
9125
9074
|
var _a = useCameraStore(useShallow(function (store) {
|
|
@@ -9150,46 +9099,46 @@ var CameraVideoTag = function CameraVideoTag(props) {
|
|
|
9150
9099
|
"$isRearFacing": isRearFacing
|
|
9151
9100
|
}, props));
|
|
9152
9101
|
};
|
|
9153
|
-
var FullscreenVideoTag = styled.video(templateObject_1$
|
|
9102
|
+
var FullscreenVideoTag = styled.video(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n transform: ", ";\n transform-style: preserve-3d;\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: cover;\n background: black;\n z-index: -2;\n"], ["\n transform: ", ";\n transform-style: preserve-3d;\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: cover;\n background: black;\n z-index: -2;\n"])), function (props) {
|
|
9154
9103
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
9155
9104
|
});
|
|
9156
|
-
var templateObject_1$
|
|
9105
|
+
var templateObject_1$r;
|
|
9157
9106
|
|
|
9158
9107
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
9159
|
-
var _b, _c, _d, _e
|
|
9108
|
+
var _b, _c, _d, _e;
|
|
9160
9109
|
var onCaptureClicked = _a.onCaptureClicked,
|
|
9161
|
-
|
|
9162
|
-
classNames =
|
|
9163
|
-
|
|
9164
|
-
rawVerbiage =
|
|
9165
|
-
var
|
|
9166
|
-
|
|
9167
|
-
documents =
|
|
9168
|
-
currentDocumentIndex =
|
|
9169
|
-
rectX =
|
|
9170
|
-
rectY =
|
|
9171
|
-
rectWidth =
|
|
9172
|
-
rectHeight =
|
|
9173
|
-
rectOffsetTop =
|
|
9174
|
-
capturing =
|
|
9175
|
-
uploadCapturedDocument =
|
|
9176
|
-
dispatch =
|
|
9177
|
-
var
|
|
9178
|
-
title =
|
|
9179
|
-
aspectRatio =
|
|
9180
|
-
cameraFeedMode =
|
|
9181
|
-
instructions =
|
|
9182
|
-
contentUrl =
|
|
9183
|
-
content =
|
|
9184
|
-
uploadState =
|
|
9185
|
-
var
|
|
9186
|
-
videoStream =
|
|
9187
|
-
cameraReady =
|
|
9188
|
-
cameraAccessDenied =
|
|
9189
|
-
requestCameraAccess =
|
|
9190
|
-
var
|
|
9191
|
-
cameraAccessRequested =
|
|
9192
|
-
setCameraAccessRequested =
|
|
9110
|
+
_f = _a.classNames,
|
|
9111
|
+
classNames = _f === void 0 ? {} : _f,
|
|
9112
|
+
_g = _a.verbiage,
|
|
9113
|
+
rawVerbiage = _g === void 0 ? {} : _g;
|
|
9114
|
+
var _h = useDocumentCaptureState(),
|
|
9115
|
+
_j = _h[0],
|
|
9116
|
+
documents = _j.documents,
|
|
9117
|
+
currentDocumentIndex = _j.currentDocumentIndex,
|
|
9118
|
+
rectX = _j.rectX,
|
|
9119
|
+
rectY = _j.rectY,
|
|
9120
|
+
rectWidth = _j.rectWidth,
|
|
9121
|
+
rectHeight = _j.rectHeight,
|
|
9122
|
+
rectOffsetTop = _j.rectOffsetTop,
|
|
9123
|
+
capturing = _j.capturing,
|
|
9124
|
+
uploadCapturedDocument = _j.uploadCapturedDocument,
|
|
9125
|
+
dispatch = _h[1];
|
|
9126
|
+
var _k = (_b = documents[currentDocumentIndex]) !== null && _b !== void 0 ? _b : {},
|
|
9127
|
+
title = _k.title,
|
|
9128
|
+
aspectRatio = _k.aspectRatio,
|
|
9129
|
+
cameraFeedMode = _k.cameraFeedMode,
|
|
9130
|
+
instructions = _k.instructions,
|
|
9131
|
+
contentUrl = _k.contentUrl,
|
|
9132
|
+
content = _k.content,
|
|
9133
|
+
uploadState = _k.uploadState;
|
|
9134
|
+
var _l = useCameraStore(),
|
|
9135
|
+
videoStream = _l.videoStream,
|
|
9136
|
+
cameraReady = _l.cameraReady,
|
|
9137
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
9138
|
+
requestCameraAccess = _l.requestCameraAccess;
|
|
9139
|
+
var _m = useState(false),
|
|
9140
|
+
cameraAccessRequested = _m[0],
|
|
9141
|
+
setCameraAccessRequested = _m[1];
|
|
9193
9142
|
var cameraAccessNeeded =
|
|
9194
9143
|
// we should force the browser to ask for camera access if...
|
|
9195
9144
|
uploadState === 'not_started' &&
|
|
@@ -9237,9 +9186,7 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
|
9237
9186
|
});
|
|
9238
9187
|
});
|
|
9239
9188
|
}
|
|
9240
|
-
return /*#__PURE__*/React__default.createElement(
|
|
9241
|
-
className: "flex ".concat((_f = classNames.container) !== null && _f !== void 0 ? _f : '')
|
|
9242
|
-
}, /*#__PURE__*/React__default.createElement(CameraFeedWrapper, {
|
|
9189
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(CameraFeedWrapper, {
|
|
9243
9190
|
className: classNames.cameraFeedWrapper,
|
|
9244
9191
|
"$mode": cameraFeedMode !== null && cameraFeedMode !== void 0 ? cameraFeedMode : 'snapToGuides',
|
|
9245
9192
|
"$x": rectX,
|
|
@@ -9268,7 +9215,7 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
|
9268
9215
|
className: classNames.footerRow
|
|
9269
9216
|
}, instructions && ( /*#__PURE__*/React__default.createElement(Instructions, {
|
|
9270
9217
|
className: classNames.instructions
|
|
9271
|
-
}, instructions)), /*#__PURE__*/React__default.createElement(StyledButtonsRow$
|
|
9218
|
+
}, instructions)), /*#__PURE__*/React__default.createElement(StyledButtonsRow$8, {
|
|
9272
9219
|
className: classNames.buttonsRow
|
|
9273
9220
|
}, cameraAccessDenied ? ( /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
9274
9221
|
className: classNames.retryCameraAccessBtn,
|
|
@@ -9303,21 +9250,21 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
|
9303
9250
|
disabled: !cameraReady || capturing
|
|
9304
9251
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
9305
9252
|
};
|
|
9306
|
-
var CaptureContainer = styled.div(templateObject_1$
|
|
9307
|
-
var HeadingRow = styled.div(templateObject_2$
|
|
9253
|
+
var CaptureContainer = styled.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
9254
|
+
var HeadingRow = styled.div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
|
|
9308
9255
|
return props.$maskColor;
|
|
9309
9256
|
});
|
|
9310
9257
|
var Heading$9 = styled.h1(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
|
|
9311
9258
|
var FooterRow = styled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"], ["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"])), function (props) {
|
|
9312
9259
|
return props.$maskColor;
|
|
9313
9260
|
});
|
|
9314
|
-
var Instructions = styled.div(templateObject_5$
|
|
9261
|
+
var Instructions = styled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n max-height: ", ";\n overflow-y: auto;\n"], ["\n max-height: ", ";\n overflow-y: auto;\n"])), function (props) {
|
|
9315
9262
|
var _a, _b, _c;
|
|
9316
9263
|
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';
|
|
9317
9264
|
});
|
|
9318
|
-
var StyledButtonsRow$
|
|
9265
|
+
var StyledButtonsRow$8 = styled(ButtonsRow$2)(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
|
|
9319
9266
|
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"])));
|
|
9320
|
-
var templateObject_1$
|
|
9267
|
+
var templateObject_1$q, templateObject_2$n, templateObject_3$h, templateObject_4$b, templateObject_5$8, templateObject_6$6, templateObject_7$4;
|
|
9321
9268
|
|
|
9322
9269
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
9323
9270
|
var onSuccess = _a.onSuccess,
|
|
@@ -9563,7 +9510,7 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
|
|
|
9563
9510
|
capture: "environment",
|
|
9564
9511
|
onChange: onFileSelected,
|
|
9565
9512
|
hidden: true
|
|
9566
|
-
}), /*#__PURE__*/React__default.createElement(StyledButtonsRow$
|
|
9513
|
+
}), /*#__PURE__*/React__default.createElement(StyledButtonsRow$7, {
|
|
9567
9514
|
className: classNames.buttonsRow
|
|
9568
9515
|
}, images.length < maxImageCount && ( /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
9569
9516
|
variant: images.length > 0 ? 'secondary' : 'positive',
|
|
@@ -9588,13 +9535,13 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
|
|
|
9588
9535
|
}
|
|
9589
9536
|
}, verbiage.doneBtnText))))));
|
|
9590
9537
|
};
|
|
9591
|
-
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
9592
|
-
var Heading$8 = styled.h3(templateObject_2$
|
|
9538
|
+
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
9539
|
+
var Heading$8 = styled.h3(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
9593
9540
|
var Description$3 = styled.p(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
9594
9541
|
var Instruction = styled.p(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
9595
|
-
var ImageCol = styled.div(templateObject_5$
|
|
9596
|
-
var StyledButtonsRow$
|
|
9597
|
-
var templateObject_1$
|
|
9542
|
+
var ImageCol = styled.div(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n flex-grow: 1;\n flex-basis: 0;\n"], ["\n display: flex;\n justify-content: center;\n flex-grow: 1;\n flex-basis: 0;\n"])));
|
|
9543
|
+
var StyledButtonsRow$7 = styled(ButtonsRow$2)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
9544
|
+
var templateObject_1$p, templateObject_2$m, templateObject_3$g, templateObject_4$a, templateObject_5$7, templateObject_6$5;
|
|
9598
9545
|
|
|
9599
9546
|
function ScalingCameraFeed() {
|
|
9600
9547
|
var _a = useIdCaptureStore(),
|
|
@@ -9946,24 +9893,24 @@ function FilePickerButton(_a) {
|
|
|
9946
9893
|
}
|
|
9947
9894
|
}, file ? "".concat(file.name, " (").concat(humanFileSize(file.size), ")") : filePickerLoading ? loadingText : children));
|
|
9948
9895
|
}
|
|
9949
|
-
var ScreenContainer = styled.div(templateObject_1$
|
|
9896
|
+
var ScreenContainer = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n position: relative;\n font-family: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n position: relative;\n font-family: ", ";\n"])), function (props) {
|
|
9950
9897
|
var _a;
|
|
9951
9898
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
9952
9899
|
});
|
|
9953
|
-
var ScreenPanel = styled.div(templateObject_2$
|
|
9900
|
+
var ScreenPanel = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n flex-grow: 1;\n background: #f7f6fb;\n box-sizing: border-box;\n padding: 40px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n flex-grow: 1;\n background: #f7f6fb;\n box-sizing: border-box;\n padding: 40px;\n"])));
|
|
9954
9901
|
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"])));
|
|
9955
9902
|
var ScreenPanelHeading = styled.h3(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n margin: 0 0 30px;\n"], ["\n margin: 0 0 30px;\n"])));
|
|
9956
|
-
var ScreenActionsBar = styled.div(templateObject_5$
|
|
9903
|
+
var ScreenActionsBar = styled.div(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n border-top: 1px solid #ccc;\n\n @media (max-width: 600px) {\n justify-content: center;\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n border-top: 1px solid #ccc;\n\n @media (max-width: 600px) {\n justify-content: center;\n }\n"])));
|
|
9957
9904
|
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"])));
|
|
9958
9905
|
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"])));
|
|
9959
|
-
var UploadIdBackHelpText = styled.p(templateObject_8
|
|
9960
|
-
var Button = styled(WideBorderButton)(templateObject_9
|
|
9961
|
-
var Modal = styled.div(templateObject_10
|
|
9962
|
-
var Dialog = styled.div(templateObject_11
|
|
9906
|
+
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"])));
|
|
9907
|
+
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"])));
|
|
9908
|
+
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"])));
|
|
9909
|
+
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) {
|
|
9963
9910
|
var _a;
|
|
9964
9911
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
9965
9912
|
});
|
|
9966
|
-
var ModalCloseButton = styled.button(templateObject_12
|
|
9913
|
+
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"])));
|
|
9967
9914
|
function XIcon(props) {
|
|
9968
9915
|
return /*#__PURE__*/React__default.createElement("svg", _assign({
|
|
9969
9916
|
width: "25",
|
|
@@ -10214,7 +10161,7 @@ function IdDocumentIcon(props) {
|
|
|
10214
10161
|
strokeWidth: "3"
|
|
10215
10162
|
}));
|
|
10216
10163
|
}
|
|
10217
|
-
var InlineSvg = styled.svg(templateObject_13
|
|
10164
|
+
var InlineSvg = styled.svg(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n display: inline;\n"], ["\n display: inline;\n"])));
|
|
10218
10165
|
function humanFileSize(bytes, si, dp) {
|
|
10219
10166
|
if (si === void 0) {
|
|
10220
10167
|
si = false;
|
|
@@ -10235,87 +10182,87 @@ function humanFileSize(bytes, si, dp) {
|
|
|
10235
10182
|
} while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
|
|
10236
10183
|
return bytes.toFixed(dp) + ' ' + units[u];
|
|
10237
10184
|
}
|
|
10238
|
-
var templateObject_1$
|
|
10185
|
+
var templateObject_1$o, templateObject_2$l, templateObject_3$f, templateObject_4$9, templateObject_5$6, templateObject_6$4, templateObject_7$3, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
|
|
10239
10186
|
|
|
10240
10187
|
var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
10241
|
-
var _b, _c, _d, _e, _f
|
|
10188
|
+
var _b, _c, _d, _e, _f;
|
|
10242
10189
|
var onSuccess = _a.onSuccess,
|
|
10243
10190
|
onExitCapture = _a.onExitCapture,
|
|
10244
10191
|
onUserCancel = _a.onUserCancel,
|
|
10245
|
-
|
|
10246
|
-
loadingOverlayMode =
|
|
10192
|
+
_g = _a.loadingOverlayMode,
|
|
10193
|
+
loadingOverlayMode = _g === void 0 ? 'default' : _g,
|
|
10247
10194
|
customOverlayContent = _a.customOverlayContent,
|
|
10248
10195
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
10249
10196
|
precapturedDocuments = _a.precapturedDocuments,
|
|
10250
|
-
|
|
10251
|
-
captureRequirement =
|
|
10252
|
-
|
|
10253
|
-
allowSinglePageIdCapture =
|
|
10254
|
-
|
|
10255
|
-
separateIdCardCaptureSequence =
|
|
10256
|
-
|
|
10257
|
-
thresholds =
|
|
10258
|
-
|
|
10259
|
-
skipSuccessScreen =
|
|
10197
|
+
_h = _a.captureRequirement,
|
|
10198
|
+
captureRequirement = _h === void 0 ? 'idCardOrPassport' : _h,
|
|
10199
|
+
_j = _a.allowSinglePageIdCapture,
|
|
10200
|
+
allowSinglePageIdCapture = _j === void 0 ? false : _j,
|
|
10201
|
+
_k = _a.separateIdCardCaptureSequence,
|
|
10202
|
+
separateIdCardCaptureSequence = _k === void 0 ? false : _k,
|
|
10203
|
+
_l = _a.thresholds,
|
|
10204
|
+
thresholds = _l === void 0 ? defaultIdCaptureThresholds : _l,
|
|
10205
|
+
_m = _a.skipSuccessScreen,
|
|
10206
|
+
skipSuccessScreen = _m === void 0 ? false : _m,
|
|
10260
10207
|
instructions = _a.instructions,
|
|
10261
|
-
|
|
10262
|
-
releaseCameraAccessOnExit =
|
|
10263
|
-
|
|
10264
|
-
guideType =
|
|
10265
|
-
|
|
10266
|
-
portraitGuidesOnMobile =
|
|
10267
|
-
|
|
10268
|
-
rotateLoadingOverlayImageWhenPortrait =
|
|
10269
|
-
|
|
10270
|
-
silentFallback =
|
|
10271
|
-
|
|
10272
|
-
forceFallbackMode =
|
|
10273
|
-
|
|
10274
|
-
allowIdCardBackToFrontCapture =
|
|
10275
|
-
|
|
10276
|
-
enableOverrideWrongDocumentTypeDialog =
|
|
10277
|
-
|
|
10278
|
-
allowOverrideWrongDocumentTypeAfterMs =
|
|
10279
|
-
|
|
10280
|
-
allowUploadingDocumentsFromStorage =
|
|
10281
|
-
|
|
10282
|
-
guideImages =
|
|
10283
|
-
|
|
10284
|
-
assets =
|
|
10285
|
-
|
|
10286
|
-
classNames =
|
|
10287
|
-
|
|
10288
|
-
colors =
|
|
10289
|
-
|
|
10290
|
-
verbiage =
|
|
10291
|
-
|
|
10292
|
-
debugMode =
|
|
10208
|
+
_o = _a.releaseCameraAccessOnExit,
|
|
10209
|
+
releaseCameraAccessOnExit = _o === void 0 ? true : _o,
|
|
10210
|
+
_p = _a.guideType,
|
|
10211
|
+
guideType = _p === void 0 ? 'fit' : _p,
|
|
10212
|
+
_q = _a.portraitGuidesOnMobile,
|
|
10213
|
+
portraitGuidesOnMobile = _q === void 0 ? true : _q,
|
|
10214
|
+
_r = _a.rotateLoadingOverlayImageWhenPortrait,
|
|
10215
|
+
rotateLoadingOverlayImageWhenPortrait = _r === void 0 ? true : _r,
|
|
10216
|
+
_s = _a.silentFallback,
|
|
10217
|
+
silentFallback = _s === void 0 ? false : _s,
|
|
10218
|
+
_t = _a.forceFallbackMode,
|
|
10219
|
+
forceFallbackMode = _t === void 0 ? false : _t,
|
|
10220
|
+
_u = _a.allowIdCardBackToFrontCapture,
|
|
10221
|
+
allowIdCardBackToFrontCapture = _u === void 0 ? false : _u,
|
|
10222
|
+
_v = _a.enableOverrideWrongDocumentTypeDialog,
|
|
10223
|
+
enableOverrideWrongDocumentTypeDialog = _v === void 0 ? false : _v,
|
|
10224
|
+
_w = _a.allowOverrideWrongDocumentTypeAfterMs,
|
|
10225
|
+
allowOverrideWrongDocumentTypeAfterMs = _w === void 0 ? 8000 : _w,
|
|
10226
|
+
_x = _a.allowUploadingDocumentsFromStorage,
|
|
10227
|
+
allowUploadingDocumentsFromStorage = _x === void 0 ? false : _x,
|
|
10228
|
+
_y = _a.guideImages,
|
|
10229
|
+
guideImages = _y === void 0 ? defaultIdCaptureGuideImages : _y,
|
|
10230
|
+
_z = _a.assets,
|
|
10231
|
+
assets = _z === void 0 ? {} : _z,
|
|
10232
|
+
_0 = _a.classNames,
|
|
10233
|
+
classNames = _0 === void 0 ? {} : _0,
|
|
10234
|
+
_1 = _a.colors,
|
|
10235
|
+
colors = _1 === void 0 ? {} : _1,
|
|
10236
|
+
_2 = _a.verbiage,
|
|
10237
|
+
verbiage = _2 === void 0 ? {} : _2,
|
|
10238
|
+
_3 = _a.debugMode,
|
|
10239
|
+
debugMode = _3 === void 0 ? false : _3;
|
|
10293
10240
|
var state = useIdCaptureStore();
|
|
10294
|
-
var
|
|
10295
|
-
cameraAccessDenied =
|
|
10296
|
-
requestCameraAccess =
|
|
10297
|
-
releaseCameraAccess =
|
|
10298
|
-
var
|
|
10299
|
-
overlayDismissed =
|
|
10300
|
-
setOverlayDismissed =
|
|
10301
|
-
var
|
|
10302
|
-
submissionStatus =
|
|
10303
|
-
setIdFrontImage =
|
|
10304
|
-
setIdBackImage =
|
|
10305
|
-
setPassportImage =
|
|
10306
|
-
setIdFrontIrImage =
|
|
10307
|
-
setIdBackIrImage =
|
|
10308
|
-
setIdFrontUvImage =
|
|
10309
|
-
setIdBackUvImage =
|
|
10310
|
-
logIdFrontCaptureAttempt =
|
|
10311
|
-
logIdBackCaptureAttempt =
|
|
10312
|
-
var
|
|
10313
|
-
start =
|
|
10314
|
-
stop =
|
|
10315
|
-
onPredictionMade =
|
|
10316
|
-
setRequiredDocumentType =
|
|
10317
|
-
modelError =
|
|
10318
|
-
resetBestFrame =
|
|
10241
|
+
var _4 = useCameraStore(),
|
|
10242
|
+
cameraAccessDenied = _4.cameraAccessDenied,
|
|
10243
|
+
requestCameraAccess = _4.requestCameraAccess,
|
|
10244
|
+
releaseCameraAccess = _4.releaseCameraAccess;
|
|
10245
|
+
var _5 = useState(false),
|
|
10246
|
+
overlayDismissed = _5[0],
|
|
10247
|
+
setOverlayDismissed = _5[1];
|
|
10248
|
+
var _6 = useContext(SubmissionContext),
|
|
10249
|
+
submissionStatus = _6.submissionStatus,
|
|
10250
|
+
setIdFrontImage = _6.setIdFrontImage,
|
|
10251
|
+
setIdBackImage = _6.setIdBackImage,
|
|
10252
|
+
setPassportImage = _6.setPassportImage,
|
|
10253
|
+
setIdFrontIrImage = _6.setIdFrontIrImage,
|
|
10254
|
+
setIdBackIrImage = _6.setIdBackIrImage,
|
|
10255
|
+
setIdFrontUvImage = _6.setIdFrontUvImage,
|
|
10256
|
+
setIdBackUvImage = _6.setIdBackUvImage,
|
|
10257
|
+
logIdFrontCaptureAttempt = _6.logIdFrontCaptureAttempt,
|
|
10258
|
+
logIdBackCaptureAttempt = _6.logIdBackCaptureAttempt;
|
|
10259
|
+
var _7 = useIdCaptureModelsContext(),
|
|
10260
|
+
start = _7.start,
|
|
10261
|
+
stop = _7.stop,
|
|
10262
|
+
onPredictionMade = _7.onPredictionMade,
|
|
10263
|
+
setRequiredDocumentType = _7.setRequiredDocumentType,
|
|
10264
|
+
modelError = _7.modelError,
|
|
10265
|
+
resetBestFrame = _7.resetBestFrame;
|
|
10319
10266
|
useEffect(function () {
|
|
10320
10267
|
dispatchIdCaptureAction({
|
|
10321
10268
|
type: 'configureWizard',
|
|
@@ -10427,9 +10374,9 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10427
10374
|
type: 'resetWizard'
|
|
10428
10375
|
});
|
|
10429
10376
|
}, []);
|
|
10430
|
-
var
|
|
10431
|
-
attempt =
|
|
10432
|
-
setAttempt =
|
|
10377
|
+
var _8 = useState(0),
|
|
10378
|
+
attempt = _8[0],
|
|
10379
|
+
setAttempt = _8[1];
|
|
10433
10380
|
var onExit = useCallback(function () {
|
|
10434
10381
|
releaseCameraAccess();
|
|
10435
10382
|
setOverlayDismissed(false);
|
|
@@ -10520,9 +10467,9 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10520
10467
|
});
|
|
10521
10468
|
});
|
|
10522
10469
|
}, []);
|
|
10523
|
-
var
|
|
10524
|
-
progressStarted =
|
|
10525
|
-
setProgressStarted =
|
|
10470
|
+
var _9 = useState(false),
|
|
10471
|
+
progressStarted = _9[0],
|
|
10472
|
+
setProgressStarted = _9[1];
|
|
10526
10473
|
useEffect(function () {
|
|
10527
10474
|
if (state.captureState === 'capturing') {
|
|
10528
10475
|
setProgressStarted(false);
|
|
@@ -10552,9 +10499,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10552
10499
|
}
|
|
10553
10500
|
var requestedAction = state.captureState === 'requestingFlip' ? 'FLIP_ID' : state.requestedDocumentType === 'idCardBack' ? 'SHOW_ID_BACK' : state.requestedDocumentType === 'passport' ? 'SHOW_PASSPORT' : 'SHOW_ID_FRONT';
|
|
10554
10501
|
var guidesStatus = !overlayDismissed ? 'disabled' : state.isGoodFrame ? 'capturing' : 'ready';
|
|
10555
|
-
return /*#__PURE__*/React__default.createElement(
|
|
10556
|
-
className: "flex ".concat((_b = classNames === null || classNames === void 0 ? void 0 : classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
10557
|
-
}, /*#__PURE__*/React__default.createElement(ScalingCameraFeed, null), overlayDismissed && state.captureState === 'capturing' && ( /*#__PURE__*/React__default.createElement(IdCapture, {
|
|
10502
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ScalingCameraFeed, null), overlayDismissed && state.captureState === 'capturing' && ( /*#__PURE__*/React__default.createElement(IdCapture, {
|
|
10558
10503
|
requiredDocumentType: state.requestedDocumentType,
|
|
10559
10504
|
thresholds: thresholds,
|
|
10560
10505
|
onCapture: onCapture,
|
|
@@ -10574,15 +10519,15 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10574
10519
|
colors: colors,
|
|
10575
10520
|
verbiage: idCaptureVerbiage,
|
|
10576
10521
|
isBackToFront: state.allowIdCardBackToFrontCapture && 'idCardBack' in state.capturedDocuments
|
|
10577
|
-
}), debugMode && !((
|
|
10578
|
-
classNames: (
|
|
10579
|
-
text: (
|
|
10522
|
+
}), 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__default.createElement(IdCaptureImagePreview, {
|
|
10523
|
+
classNames: (_d = classNames.capture) === null || _d === void 0 ? void 0 : _d.imagePreview,
|
|
10524
|
+
text: (_e = idCaptureVerbiages === null || idCaptureVerbiages === void 0 ? void 0 : idCaptureVerbiages.idCardFront) === null || _e === void 0 ? void 0 : _e.processingIdCardText,
|
|
10580
10525
|
imageUrl: state.imageUrl
|
|
10581
10526
|
})), state.captureState !== 'complete' && ( /*#__PURE__*/React__default.createElement("div", {
|
|
10582
10527
|
id: "idmission-above-guides-content"
|
|
10583
10528
|
})), /*#__PURE__*/React__default.createElement(ExitCaptureButton, {
|
|
10584
10529
|
onClick: onExit,
|
|
10585
|
-
className: (
|
|
10530
|
+
className: (_f = classNames.capture) === null || _f === void 0 ? void 0 : _f.exitCaptureBtn
|
|
10586
10531
|
}), !overlayDismissed && ( /*#__PURE__*/React__default.createElement(IdCaptureLoadingOverlay, {
|
|
10587
10532
|
key: "loading".concat(attempt),
|
|
10588
10533
|
mode: loadingOverlayMode,
|
|
@@ -10622,14 +10567,10 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10622
10567
|
|
|
10623
10568
|
function SelfieCaptureLoadingGraphic(_a) {
|
|
10624
10569
|
var _b, _c, _d;
|
|
10625
|
-
var
|
|
10626
|
-
|
|
10627
|
-
|
|
10628
|
-
|
|
10629
|
-
className = _a.className;
|
|
10630
|
-
var _g = useState(1),
|
|
10631
|
-
frame = _g[0],
|
|
10632
|
-
setFrame = _g[1];
|
|
10570
|
+
var className = _a.className;
|
|
10571
|
+
var _e = useState(1),
|
|
10572
|
+
frame = _e[0],
|
|
10573
|
+
setFrame = _e[1];
|
|
10633
10574
|
useEffect(function () {
|
|
10634
10575
|
var i = setInterval(function () {
|
|
10635
10576
|
setFrame(function (n) {
|
|
@@ -10643,8 +10584,6 @@ function SelfieCaptureLoadingGraphic(_a) {
|
|
|
10643
10584
|
var theme = useTheme();
|
|
10644
10585
|
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)';
|
|
10645
10586
|
return /*#__PURE__*/React__default.createElement("svg", {
|
|
10646
|
-
width: width,
|
|
10647
|
-
height: height,
|
|
10648
10587
|
className: className,
|
|
10649
10588
|
viewBox: "0 0 840 740",
|
|
10650
10589
|
fill: "none",
|
|
@@ -10936,7 +10875,7 @@ var HeadGuideSvg = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
10936
10875
|
}))));
|
|
10937
10876
|
});
|
|
10938
10877
|
HeadGuideSvg.displayName = 'HeadGuideSvg';
|
|
10939
|
-
var PulsingHeadGuideContainer = styled.div(templateObject_1$
|
|
10878
|
+
var PulsingHeadGuideContainer = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"], ["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"])), wavesAnimation);
|
|
10940
10879
|
function HeadGuide(_a) {
|
|
10941
10880
|
var _b;
|
|
10942
10881
|
var _c = _a.status,
|
|
@@ -10986,7 +10925,7 @@ function HeadGuide(_a) {
|
|
|
10986
10925
|
height: parentHeight
|
|
10987
10926
|
})));
|
|
10988
10927
|
}
|
|
10989
|
-
var AbsoluteSvg = styled.svg(templateObject_2$
|
|
10928
|
+
var AbsoluteSvg = styled.svg(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n"])));
|
|
10990
10929
|
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) {
|
|
10991
10930
|
return props.$verticalAlign === 'bottom' ? 'flex-end' : 'center';
|
|
10992
10931
|
});
|
|
@@ -11214,10 +11153,10 @@ function SelfieCaptureAnimatedMaskWithStatus(_a) {
|
|
|
11214
11153
|
status: status
|
|
11215
11154
|
}));
|
|
11216
11155
|
}
|
|
11217
|
-
var templateObject_1$
|
|
11156
|
+
var templateObject_1$n, templateObject_2$k, templateObject_3$e;
|
|
11218
11157
|
|
|
11219
|
-
var FaceCaptureGuideContainer = styled.div(templateObject_1$
|
|
11220
|
-
var FaceCaptureGuideInner = styled.div(templateObject_2$
|
|
11158
|
+
var FaceCaptureGuideContainer = styled.div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"], ["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"])));
|
|
11159
|
+
var FaceCaptureGuideInner = styled.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n position: relative;\n height: 60%;\n"], ["\n position: relative;\n height: 60%;\n"])));
|
|
11221
11160
|
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
11222
11161
|
var _b = _a.classNames,
|
|
11223
11162
|
classNames = _b === void 0 ? {} : _b,
|
|
@@ -11239,7 +11178,7 @@ var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
|
11239
11178
|
verticalAlign: "center"
|
|
11240
11179
|
})));
|
|
11241
11180
|
};
|
|
11242
|
-
var templateObject_1$
|
|
11181
|
+
var templateObject_1$m, templateObject_2$j;
|
|
11243
11182
|
|
|
11244
11183
|
var SelfieGuidanceModelsContext = /*#__PURE__*/createContext({
|
|
11245
11184
|
start: function start() {
|
|
@@ -11524,7 +11463,7 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
|
|
|
11524
11463
|
src: image,
|
|
11525
11464
|
alt: "",
|
|
11526
11465
|
className: classNames.image
|
|
11527
|
-
}))), /*#__PURE__*/React__default.createElement(StyledButtonsRow$
|
|
11466
|
+
}))), /*#__PURE__*/React__default.createElement(StyledButtonsRow$6, {
|
|
11528
11467
|
className: classNames.buttonsRow
|
|
11529
11468
|
}, image && !loading && !isMobile() && ( /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
11530
11469
|
className: classNames.retryCaptureBtn,
|
|
@@ -11559,12 +11498,12 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
|
|
|
11559
11498
|
}
|
|
11560
11499
|
}, !image ? invalidSelfie ? verbiage.retryButtonText : verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
|
|
11561
11500
|
};
|
|
11562
|
-
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$
|
|
11563
|
-
var Heading$7 = styled.h3(templateObject_2$
|
|
11501
|
+
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
11502
|
+
var Heading$7 = styled.h3(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
11564
11503
|
var Description$2 = styled.p(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
11565
11504
|
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
11566
|
-
var StyledButtonsRow$
|
|
11567
|
-
var templateObject_1$
|
|
11505
|
+
var StyledButtonsRow$6 = styled(ButtonsRow$2)(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
11506
|
+
var templateObject_1$l, templateObject_2$i, templateObject_3$d, templateObject_4$8, templateObject_5$5;
|
|
11568
11507
|
|
|
11569
11508
|
var initialState$3 = {
|
|
11570
11509
|
busy: false,
|
|
@@ -11592,7 +11531,7 @@ var reducer$3 = function reducer(state, action) {
|
|
|
11592
11531
|
}
|
|
11593
11532
|
};
|
|
11594
11533
|
var SelfieCapture = function SelfieCapture(_a) {
|
|
11595
|
-
var _b, _c, _d, _e, _f
|
|
11534
|
+
var _b, _c, _d, _e, _f;
|
|
11596
11535
|
var onGuidanceSatisfied = _a.onGuidanceSatisfied,
|
|
11597
11536
|
onGuidanceNotSatisfied = _a.onGuidanceNotSatisfied,
|
|
11598
11537
|
onFaceDetected = _a.onFaceDetected,
|
|
@@ -11600,46 +11539,46 @@ var SelfieCapture = function SelfieCapture(_a) {
|
|
|
11600
11539
|
onSelfieCaptured = _a.onSelfieCaptured,
|
|
11601
11540
|
onTimeout = _a.onTimeout,
|
|
11602
11541
|
onExit = _a.onExit,
|
|
11603
|
-
|
|
11604
|
-
timeoutDurationMs =
|
|
11542
|
+
_g = _a.timeoutDurationMs,
|
|
11543
|
+
timeoutDurationMs = _g === void 0 ? 15000 : _g,
|
|
11605
11544
|
guidanceMessage = _a.guidanceMessage,
|
|
11606
11545
|
guidanceSatisfied = _a.guidanceSatisfied,
|
|
11607
11546
|
guidesComponent = _a.guidesComponent,
|
|
11608
|
-
|
|
11609
|
-
shouldCapture =
|
|
11610
|
-
|
|
11611
|
-
classNames =
|
|
11612
|
-
|
|
11613
|
-
colors =
|
|
11614
|
-
|
|
11615
|
-
rawVerbiage =
|
|
11616
|
-
|
|
11617
|
-
debugMode =
|
|
11618
|
-
var
|
|
11619
|
-
ref =
|
|
11620
|
-
|
|
11621
|
-
width =
|
|
11622
|
-
|
|
11623
|
-
height =
|
|
11624
|
-
var
|
|
11625
|
-
|
|
11626
|
-
busy =
|
|
11627
|
-
prediction =
|
|
11628
|
-
dispatch =
|
|
11547
|
+
_h = _a.shouldCapture,
|
|
11548
|
+
shouldCapture = _h === void 0 ? true : _h,
|
|
11549
|
+
_j = _a.classNames,
|
|
11550
|
+
classNames = _j === void 0 ? {} : _j,
|
|
11551
|
+
_k = _a.colors,
|
|
11552
|
+
colors = _k === void 0 ? {} : _k,
|
|
11553
|
+
_l = _a.verbiage,
|
|
11554
|
+
rawVerbiage = _l === void 0 ? {} : _l,
|
|
11555
|
+
_m = _a.debugMode,
|
|
11556
|
+
debugMode = _m === void 0 ? false : _m;
|
|
11557
|
+
var _o = useResizeObserver(),
|
|
11558
|
+
ref = _o.ref,
|
|
11559
|
+
_p = _o.width,
|
|
11560
|
+
width = _p === void 0 ? 1 : _p,
|
|
11561
|
+
_q = _o.height,
|
|
11562
|
+
height = _q === void 0 ? 1 : _q;
|
|
11563
|
+
var _r = useReducer(reducer$3, initialState$3),
|
|
11564
|
+
_s = _r[0],
|
|
11565
|
+
busy = _s.busy,
|
|
11566
|
+
prediction = _s.prediction,
|
|
11567
|
+
dispatch = _r[1];
|
|
11629
11568
|
var lastPredictionCanvas = useRef(null);
|
|
11630
|
-
var
|
|
11569
|
+
var _t = useCameraStore(useShallow(function (state) {
|
|
11631
11570
|
return {
|
|
11632
11571
|
camera: state.camera,
|
|
11633
11572
|
cameraReady: state.cameraReady,
|
|
11634
11573
|
videoRef: state.videoRef
|
|
11635
11574
|
};
|
|
11636
11575
|
})),
|
|
11637
|
-
camera =
|
|
11638
|
-
videoRef =
|
|
11639
|
-
var
|
|
11640
|
-
onPredictionMade =
|
|
11641
|
-
canvasRef =
|
|
11642
|
-
guidanceError =
|
|
11576
|
+
camera = _t.camera,
|
|
11577
|
+
videoRef = _t.videoRef;
|
|
11578
|
+
var _u = useContext(SelfieGuidanceModelsContext),
|
|
11579
|
+
onPredictionMade = _u.onPredictionMade,
|
|
11580
|
+
canvasRef = _u.canvasRef,
|
|
11581
|
+
guidanceError = _u.error;
|
|
11643
11582
|
onPredictionMade(useThrottledCallback(useCallback(function (prediction) {
|
|
11644
11583
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
11645
11584
|
return __generator(this, function (_a) {
|
|
@@ -11684,9 +11623,9 @@ var SelfieCapture = function SelfieCapture(_a) {
|
|
|
11684
11623
|
if (timer) clearTimeout(timer);
|
|
11685
11624
|
};
|
|
11686
11625
|
}, [onSelfieCaptureStarted, onSelfieCaptured, prediction]);
|
|
11687
|
-
var
|
|
11688
|
-
timedOut =
|
|
11689
|
-
timeoutStartedAt =
|
|
11626
|
+
var _v = useTimeout(timeoutDurationMs, onTimeout),
|
|
11627
|
+
timedOut = _v.timedOut,
|
|
11628
|
+
timeoutStartedAt = _v.timeoutStartedAt;
|
|
11690
11629
|
var debugScalingDetails = useDebugScalingDetails({
|
|
11691
11630
|
enabled: debugMode,
|
|
11692
11631
|
pageWidth: width,
|
|
@@ -11714,9 +11653,9 @@ var SelfieCapture = function SelfieCapture(_a) {
|
|
|
11714
11653
|
});
|
|
11715
11654
|
}
|
|
11716
11655
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : FaceCaptureGuideOverlay;
|
|
11717
|
-
return /*#__PURE__*/React__default.createElement(
|
|
11656
|
+
return /*#__PURE__*/React__default.createElement(Container$5, {
|
|
11718
11657
|
ref: ref,
|
|
11719
|
-
className:
|
|
11658
|
+
className: classNames.container
|
|
11720
11659
|
}, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
11721
11660
|
ref: lastPredictionCanvas
|
|
11722
11661
|
}), /*#__PURE__*/React__default.createElement(GuidesComponent, {
|
|
@@ -11736,6 +11675,8 @@ var SelfieCapture = function SelfieCapture(_a) {
|
|
|
11736
11675
|
className: classNames.exitCaptureBtn
|
|
11737
11676
|
}));
|
|
11738
11677
|
};
|
|
11678
|
+
var Container$5 = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
|
|
11679
|
+
var templateObject_1$k;
|
|
11739
11680
|
|
|
11740
11681
|
var initialState$2 = {
|
|
11741
11682
|
frame: null,
|
|
@@ -12123,9 +12064,9 @@ var FaceLivenessSuccess = function FaceLivenessSuccess(_a) {
|
|
|
12123
12064
|
finished: true
|
|
12124
12065
|
}, verbiage.retryBtnText)))));
|
|
12125
12066
|
};
|
|
12126
|
-
var ImageContainer$5 = styled.div(templateObject_1$
|
|
12127
|
-
var Heading$6 = styled.h3(templateObject_2$
|
|
12128
|
-
var templateObject_1$
|
|
12067
|
+
var ImageContainer$5 = styled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100%;\n max-height: 100%;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"], ["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100%;\n max-height: 100%;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"])));
|
|
12068
|
+
var Heading$6 = styled.h3(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n font-size: 1.2rem;\n margin: 0;\n"], ["\n font-size: 1.2rem;\n margin: 0;\n"])));
|
|
12069
|
+
var templateObject_1$j, templateObject_2$h;
|
|
12129
12070
|
|
|
12130
12071
|
var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
12131
12072
|
var _b = _a.canRetry,
|
|
@@ -12174,9 +12115,9 @@ var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
|
12174
12115
|
finished: true
|
|
12175
12116
|
}, verbiage.exitBtnText)))));
|
|
12176
12117
|
};
|
|
12177
|
-
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$
|
|
12178
|
-
var Heading$5 = styled.h3(templateObject_2$
|
|
12179
|
-
var templateObject_1$
|
|
12118
|
+
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
12119
|
+
var Heading$5 = styled.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
|
|
12120
|
+
var templateObject_1$i, templateObject_2$g;
|
|
12180
12121
|
|
|
12181
12122
|
var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
12182
12123
|
var _b;
|
|
@@ -12201,7 +12142,7 @@ var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
|
12201
12142
|
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
12202
12143
|
}, /*#__PURE__*/React__default.createElement(StyledOverlayInner, {
|
|
12203
12144
|
className: classNames.inner
|
|
12204
|
-
}, /*#__PURE__*/React__default.createElement(StyledOverlayImageContainer
|
|
12145
|
+
}, /*#__PURE__*/React__default.createElement(StyledOverlayImageContainer, {
|
|
12205
12146
|
className: classNames.imageContainer
|
|
12206
12147
|
}, /*#__PURE__*/React__default.createElement("img", {
|
|
12207
12148
|
src: assets.imageUrl,
|
|
@@ -12219,11 +12160,11 @@ var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
|
12219
12160
|
finished: true
|
|
12220
12161
|
}, verbiage.retryBtnText)));
|
|
12221
12162
|
};
|
|
12222
|
-
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$
|
|
12223
|
-
var StyledOverlayImageContainer
|
|
12163
|
+
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
12164
|
+
var StyledOverlayImageContainer = styled(OverlayImageContainer)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
12224
12165
|
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"])));
|
|
12225
12166
|
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"])));
|
|
12226
|
-
var templateObject_1$
|
|
12167
|
+
var templateObject_1$h, templateObject_2$f, templateObject_3$c, templateObject_4$7;
|
|
12227
12168
|
|
|
12228
12169
|
var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLegacy(_a) {
|
|
12229
12170
|
var onDismissed = _a.onDismissed,
|
|
@@ -12295,13 +12236,13 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
|
|
|
12295
12236
|
}, verbiage.headingText), onUserCancel && ( /*#__PURE__*/React__default.createElement(ExitCaptureButton, {
|
|
12296
12237
|
onClick: onUserCancel,
|
|
12297
12238
|
className: classNames.cancelBtn
|
|
12298
|
-
})), /*#__PURE__*/React__default.createElement(StyledGuidanceMessage
|
|
12239
|
+
})), /*#__PURE__*/React__default.createElement(StyledGuidanceMessage, null, verbiage.removeEyeCoveringsText, /*#__PURE__*/React__default.createElement("br", null), verbiage.avoidExcessiveBacklightingText), /*#__PURE__*/React__default.createElement(OverlayImageContainer, {
|
|
12299
12240
|
className: classNames.imageContainer
|
|
12300
12241
|
}, /*#__PURE__*/React__default.createElement("img", {
|
|
12301
12242
|
className: classNames.image,
|
|
12302
12243
|
alt: verbiage.headingText,
|
|
12303
12244
|
src: assets.instructionImageUrl
|
|
12304
|
-
})), /*#__PURE__*/React__default.createElement(StyledButtonsRow$
|
|
12245
|
+
})), /*#__PURE__*/React__default.createElement(StyledButtonsRow$5, {
|
|
12305
12246
|
className: classNames.buttonsRow
|
|
12306
12247
|
}, /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
12307
12248
|
variant: "positive",
|
|
@@ -12315,18 +12256,11 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
|
|
|
12315
12256
|
}
|
|
12316
12257
|
}, ready ? verbiage.continueText : allModelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
|
|
12317
12258
|
};
|
|
12318
|
-
var StyledGuidanceMessage
|
|
12319
|
-
var StyledButtonsRow$
|
|
12320
|
-
var templateObject_1$
|
|
12259
|
+
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"], ["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"])));
|
|
12260
|
+
var StyledButtonsRow$5 = styled(ButtonsRow$2)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n flex-direction: column;\n padding-top: 25px;\n"], ["\n flex-direction: column;\n padding-top: 25px;\n"])));
|
|
12261
|
+
var templateObject_1$g, templateObject_2$e;
|
|
12321
12262
|
|
|
12322
12263
|
var legacyInstructionImageUrl = "".concat(DEFAULT_CDN_URL, "/Selfie-Image-1.png");
|
|
12323
|
-
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) {
|
|
12324
|
-
var _a, _b, _c, _d;
|
|
12325
|
-
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';
|
|
12326
|
-
}, function (props) {
|
|
12327
|
-
var _a, _b, _c, _d;
|
|
12328
|
-
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';
|
|
12329
|
-
});
|
|
12330
12264
|
var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDefault(_a) {
|
|
12331
12265
|
var onDismissed = _a.onDismissed,
|
|
12332
12266
|
onUserCancel = _a.onUserCancel,
|
|
@@ -12409,11 +12343,11 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
|
|
|
12409
12343
|
}, onUserCancel && ( /*#__PURE__*/React__default.createElement(ExitCaptureButton, {
|
|
12410
12344
|
onClick: onUserCancel,
|
|
12411
12345
|
className: classNames.cancelBtn
|
|
12412
|
-
})), customOverlayContent || ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(
|
|
12346
|
+
})), customOverlayContent || ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(LoadingOverlayHeader, {
|
|
12413
12347
|
className: classNames.headingContainer
|
|
12414
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
12348
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayGuidanceMessage, {
|
|
12415
12349
|
className: classNames.heading
|
|
12416
|
-
}, headingText)), /*#__PURE__*/React__default.createElement(
|
|
12350
|
+
}, headingText)), /*#__PURE__*/React__default.createElement(LoadingOverlayImageContainer, {
|
|
12417
12351
|
className: classNames.imageContainer
|
|
12418
12352
|
}, (assets === null || assets === void 0 ? void 0 : assets.instructionImageUrl) && assets.instructionImageUrl !== legacyInstructionImageUrl ? ( /*#__PURE__*/React__default.createElement(CustomLoadingGraphic, {
|
|
12419
12353
|
className: classNames.image,
|
|
@@ -12421,32 +12355,32 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
|
|
|
12421
12355
|
src: assets.instructionImageUrl
|
|
12422
12356
|
})) : ( /*#__PURE__*/React__default.createElement(SelfieCaptureLoadingGraphic, {
|
|
12423
12357
|
className: classNames.image
|
|
12424
|
-
}))))), /*#__PURE__*/React__default.createElement(
|
|
12358
|
+
}))))), /*#__PURE__*/React__default.createElement(ButtonsRow, {
|
|
12425
12359
|
className: classNames.buttonsRow
|
|
12426
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
12360
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayProgressContainer, {
|
|
12427
12361
|
className: classNames.progressContainer
|
|
12428
12362
|
}, /*#__PURE__*/React__default.createElement(ProgressBarBackground, {
|
|
12429
12363
|
className: classNames.progressBackground
|
|
12430
|
-
}), /*#__PURE__*/React__default.createElement(
|
|
12364
|
+
}), /*#__PURE__*/React__default.createElement(LoadingOverlayProgressBar, {
|
|
12431
12365
|
"$progress": modelDownloadProgress,
|
|
12432
12366
|
className: classNames.progressBar
|
|
12433
12367
|
}, /*#__PURE__*/React__default.createElement(ProgressIndicator, {
|
|
12434
12368
|
className: classNames.progressIndicator
|
|
12435
|
-
}))), /*#__PURE__*/React__default.createElement(
|
|
12369
|
+
}))), /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingListContainer, {
|
|
12436
12370
|
className: classNames.loadingListContainer
|
|
12437
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
12371
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingList, {
|
|
12438
12372
|
className: classNames.loadingList
|
|
12439
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
12373
|
+
}, /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingListItem, {
|
|
12440
12374
|
className: cn(classNames.loadingListItem, cameraReady ? 'done' : 'running')
|
|
12441
12375
|
}, /*#__PURE__*/React__default.createElement(LoadingListItemIndicator, {
|
|
12442
12376
|
className: classNames.loadingListItemIndicator,
|
|
12443
12377
|
state: cameraReady ? 'done' : 'running'
|
|
12444
|
-
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React__default.createElement(
|
|
12378
|
+
}), cameraReady ? verbiage.cameraInitializedText : verbiage.cameraInitializingText), /*#__PURE__*/React__default.createElement(LoadingOverlayLoadingListItem, {
|
|
12445
12379
|
className: cn(classNames.loadingListItem, sessionReady && allModelsReady ? 'done' : 'running')
|
|
12446
12380
|
}, /*#__PURE__*/React__default.createElement(LoadingListItemIndicator, {
|
|
12447
12381
|
className: classNames.loadingListItemIndicator,
|
|
12448
12382
|
state: sessionReady && allModelsReady ? 'done' : 'running'
|
|
12449
|
-
}), !sessionReady ? verbiage.sessionCheckingText :
|
|
12383
|
+
}), !sessionReady ? verbiage.sessionCheckingText : allModelsReady ? verbiage.modelsReadyText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))), /*#__PURE__*/React__default.createElement(ContinueButtonContainer, {
|
|
12450
12384
|
className: classNames.continueBtnContainer
|
|
12451
12385
|
}, ready && ( /*#__PURE__*/React__default.createElement(ContinueButton, {
|
|
12452
12386
|
autoFocus: true,
|
|
@@ -12460,42 +12394,34 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
|
|
|
12460
12394
|
}
|
|
12461
12395
|
}, verbiage.continueText))))));
|
|
12462
12396
|
};
|
|
12463
|
-
var
|
|
12464
|
-
var _a;
|
|
12465
|
-
return (_a = props.theme.
|
|
12397
|
+
var OverlayInner = styled(LoadingOverlayInner)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
12398
|
+
var _a, _b, _c, _d;
|
|
12399
|
+
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';
|
|
12466
12400
|
}, function (props) {
|
|
12467
|
-
|
|
12401
|
+
var _a, _b, _c, _d;
|
|
12402
|
+
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';
|
|
12468
12403
|
});
|
|
12469
|
-
var
|
|
12470
|
-
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) {
|
|
12404
|
+
var ButtonsRow = styled(LoadingOverlayButtonsRow)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n color: ", ";\n ", "\n"], ["\n color: ", ";\n ", "\n"])), function (props) {
|
|
12471
12405
|
var _a, _b, _c, _d;
|
|
12472
12406
|
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';
|
|
12473
12407
|
}, function (props) {
|
|
12474
12408
|
var _a, _b, _c, _d, _e, _f;
|
|
12475
12409
|
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, ";") : '';
|
|
12476
12410
|
});
|
|
12477
|
-
var
|
|
12478
|
-
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"])));
|
|
12479
|
-
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"])));
|
|
12480
|
-
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"])));
|
|
12481
|
-
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"])));
|
|
12482
|
-
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) {
|
|
12411
|
+
var ProgressBarBackground = styled(LoadingOverlayProgressBarBackground)(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n background: ", ";\n opacity: ", ";\n"], ["\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
12483
12412
|
var _a, _b, _c, _d;
|
|
12484
12413
|
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)';
|
|
12485
12414
|
}, function (props) {
|
|
12486
12415
|
var _a, _b, _c, _d;
|
|
12487
12416
|
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;
|
|
12488
12417
|
});
|
|
12489
|
-
var
|
|
12490
|
-
return props.$progress;
|
|
12491
|
-
});
|
|
12492
|
-
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) {
|
|
12418
|
+
var ProgressIndicator = styled(LoadingOverlayProgressIndicator)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n background: ", ";\n"], ["\n background: ", ";\n"])), function (props) {
|
|
12493
12419
|
var _a, _b, _c, _d;
|
|
12494
12420
|
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)';
|
|
12495
|
-
}
|
|
12496
|
-
var CustomLoadingGraphic = styled.img(
|
|
12497
|
-
var ContinueButtonContainer = styled.div(
|
|
12498
|
-
var ContinueButton = styled(LoaderButton)(
|
|
12421
|
+
});
|
|
12422
|
+
var CustomLoadingGraphic = styled.img(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
12423
|
+
var ContinueButtonContainer = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
12424
|
+
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) {
|
|
12499
12425
|
var _a, _b, _c, _d, _e, _f;
|
|
12500
12426
|
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, ";") : '';
|
|
12501
12427
|
}, function (props) {
|
|
@@ -12505,7 +12431,7 @@ var ContinueButton = styled(LoaderButton)(templateObject_15 || (templateObject_1
|
|
|
12505
12431
|
var _a, _b, _c, _d, _e, _f;
|
|
12506
12432
|
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, ";") : '';
|
|
12507
12433
|
});
|
|
12508
|
-
var templateObject_1$
|
|
12434
|
+
var templateObject_1$f, templateObject_2$d, templateObject_3$b, templateObject_4$6, templateObject_5$4, templateObject_6$3, templateObject_7$2;
|
|
12509
12435
|
|
|
12510
12436
|
var components = {
|
|
12511
12437
|
"default": SelfieCaptureLoadingOverlayDefault,
|
|
@@ -12521,7 +12447,7 @@ var SelfieCaptureLoadingOverlay = function SelfieCaptureLoadingOverlay(_a) {
|
|
|
12521
12447
|
};
|
|
12522
12448
|
|
|
12523
12449
|
var FaceLivenessWizard = function FaceLivenessWizard(_a) {
|
|
12524
|
-
var _b
|
|
12450
|
+
var _b;
|
|
12525
12451
|
var onComplete = _a.onComplete,
|
|
12526
12452
|
onSuccess = _a.onSuccess,
|
|
12527
12453
|
onFailure = _a.onFailure,
|
|
@@ -12531,70 +12457,70 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
|
|
|
12531
12457
|
onExitAfterFailure = _a.onExitAfterFailure,
|
|
12532
12458
|
onUserCancel = _a.onUserCancel,
|
|
12533
12459
|
precapturedDocuments = _a.precapturedDocuments,
|
|
12534
|
-
|
|
12535
|
-
loadingOverlayMode =
|
|
12460
|
+
_c = _a.loadingOverlayMode,
|
|
12461
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
12536
12462
|
customOverlayContent = _a.customOverlayContent,
|
|
12537
12463
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
12538
|
-
|
|
12539
|
-
initialCaptureDelayMs =
|
|
12540
|
-
|
|
12541
|
-
timeoutDurationMs =
|
|
12542
|
-
|
|
12543
|
-
maxRetries =
|
|
12544
|
-
|
|
12545
|
-
skipSuccessScreen =
|
|
12546
|
-
|
|
12547
|
-
allowLivenessFailure =
|
|
12548
|
-
|
|
12549
|
-
renderCameraFeed =
|
|
12550
|
-
|
|
12551
|
-
releaseCameraAccessOnExit =
|
|
12552
|
-
|
|
12553
|
-
silentFallback =
|
|
12554
|
-
|
|
12555
|
-
waitForIdCaptureModels =
|
|
12464
|
+
_d = _a.initialCaptureDelayMs,
|
|
12465
|
+
initialCaptureDelayMs = _d === void 0 ? 1000 : _d,
|
|
12466
|
+
_e = _a.timeoutDurationMs,
|
|
12467
|
+
timeoutDurationMs = _e === void 0 ? 15000 : _e,
|
|
12468
|
+
_f = _a.maxRetries,
|
|
12469
|
+
maxRetries = _f === void 0 ? 2 : _f,
|
|
12470
|
+
_g = _a.skipSuccessScreen,
|
|
12471
|
+
skipSuccessScreen = _g === void 0 ? false : _g,
|
|
12472
|
+
_h = _a.allowLivenessFailure,
|
|
12473
|
+
allowLivenessFailure = _h === void 0 ? false : _h,
|
|
12474
|
+
_j = _a.renderCameraFeed,
|
|
12475
|
+
renderCameraFeed = _j === void 0 ? true : _j,
|
|
12476
|
+
_k = _a.releaseCameraAccessOnExit,
|
|
12477
|
+
releaseCameraAccessOnExit = _k === void 0 ? true : _k,
|
|
12478
|
+
_l = _a.silentFallback,
|
|
12479
|
+
silentFallback = _l === void 0 ? false : _l,
|
|
12480
|
+
_m = _a.waitForIdCaptureModels,
|
|
12481
|
+
waitForIdCaptureModels = _m === void 0 ? false : _m,
|
|
12556
12482
|
guidesComponent = _a.guidesComponent,
|
|
12557
12483
|
disableCapturePreview = _a.disableCapturePreview,
|
|
12558
|
-
|
|
12559
|
-
assets =
|
|
12560
|
-
|
|
12561
|
-
classNames =
|
|
12562
|
-
|
|
12563
|
-
colors =
|
|
12564
|
-
|
|
12565
|
-
verbiage =
|
|
12566
|
-
|
|
12567
|
-
debugMode =
|
|
12568
|
-
var
|
|
12569
|
-
submissionResponse =
|
|
12570
|
-
livenessCheckRequest =
|
|
12571
|
-
setSelfieImage =
|
|
12572
|
-
logSelfieCaptureAttempt =
|
|
12573
|
-
var
|
|
12484
|
+
_o = _a.assets,
|
|
12485
|
+
assets = _o === void 0 ? {} : _o,
|
|
12486
|
+
_p = _a.classNames,
|
|
12487
|
+
classNames = _p === void 0 ? {} : _p,
|
|
12488
|
+
_q = _a.colors,
|
|
12489
|
+
colors = _q === void 0 ? {} : _q,
|
|
12490
|
+
_r = _a.verbiage,
|
|
12491
|
+
verbiage = _r === void 0 ? {} : _r,
|
|
12492
|
+
_s = _a.debugMode,
|
|
12493
|
+
debugMode = _s === void 0 ? false : _s;
|
|
12494
|
+
var _t = useContext(SubmissionContext),
|
|
12495
|
+
submissionResponse = _t.submissionResponse,
|
|
12496
|
+
livenessCheckRequest = _t.livenessCheckRequest,
|
|
12497
|
+
setSelfieImage = _t.setSelfieImage,
|
|
12498
|
+
logSelfieCaptureAttempt = _t.logSelfieCaptureAttempt;
|
|
12499
|
+
var _u = useCameraStore(useShallow(function (state) {
|
|
12574
12500
|
return {
|
|
12575
12501
|
cameraAccessDenied: state.cameraAccessDenied,
|
|
12576
12502
|
requestCameraAccess: state.requestCameraAccess,
|
|
12577
12503
|
releaseCameraAccess: state.releaseCameraAccess
|
|
12578
12504
|
};
|
|
12579
12505
|
})),
|
|
12580
|
-
cameraAccessDenied =
|
|
12581
|
-
requestCameraAccess =
|
|
12582
|
-
releaseCameraAccess =
|
|
12583
|
-
var
|
|
12584
|
-
faceCropImageUrl =
|
|
12585
|
-
setFaceCropImageUrl =
|
|
12586
|
-
var
|
|
12587
|
-
retryCount =
|
|
12588
|
-
setRetryCount =
|
|
12589
|
-
var
|
|
12590
|
-
captureState =
|
|
12591
|
-
setCaptureState =
|
|
12506
|
+
cameraAccessDenied = _u.cameraAccessDenied,
|
|
12507
|
+
requestCameraAccess = _u.requestCameraAccess,
|
|
12508
|
+
releaseCameraAccess = _u.releaseCameraAccess;
|
|
12509
|
+
var _v = useState(''),
|
|
12510
|
+
faceCropImageUrl = _v[0],
|
|
12511
|
+
setFaceCropImageUrl = _v[1];
|
|
12512
|
+
var _w = useState(0),
|
|
12513
|
+
retryCount = _w[0],
|
|
12514
|
+
setRetryCount = _w[1];
|
|
12515
|
+
var _x = useState('LOADING'),
|
|
12516
|
+
captureState = _x[0],
|
|
12517
|
+
setCaptureState = _x[1];
|
|
12592
12518
|
var captureStartedAt = useRef();
|
|
12593
12519
|
var operationStartedAt = useRef();
|
|
12594
12520
|
var livenessScore = useRef();
|
|
12595
|
-
var
|
|
12596
|
-
start =
|
|
12597
|
-
stop =
|
|
12521
|
+
var _y = useContext(SelfieGuidanceModelsContext),
|
|
12522
|
+
start = _y.start,
|
|
12523
|
+
stop = _y.stop;
|
|
12598
12524
|
useEffect(function () {
|
|
12599
12525
|
if (precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie) {
|
|
12600
12526
|
setSelfieImage(precapturedDocuments.selfie.imageData);
|
|
@@ -12678,9 +12604,9 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
|
|
|
12678
12604
|
}
|
|
12679
12605
|
onDenied === null || onDenied === void 0 ? void 0 : onDenied(submissionResponse, livenessCheckRequest);
|
|
12680
12606
|
}, [allowLivenessFailure, onDenied, submissionResponse, livenessCheckRequest]);
|
|
12681
|
-
var
|
|
12682
|
-
attempt =
|
|
12683
|
-
setAttempt =
|
|
12607
|
+
var _z = useState(0),
|
|
12608
|
+
attempt = _z[0],
|
|
12609
|
+
setAttempt = _z[1];
|
|
12684
12610
|
var onExitCallback = useCallback(function () {
|
|
12685
12611
|
setAttempt(function (n) {
|
|
12686
12612
|
return n + 1;
|
|
@@ -12728,10 +12654,8 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
|
|
|
12728
12654
|
}, [livenessCheckRequest, onExitAfterFailure, releaseCameraAccess, releaseCameraAccessOnExit, submissionResponse]);
|
|
12729
12655
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
12730
12656
|
ref: resizeCanvas
|
|
12731
|
-
}), /*#__PURE__*/React__default.createElement(
|
|
12732
|
-
className:
|
|
12733
|
-
}, renderCameraFeed && ( /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
12734
|
-
className: (_d = classNames.capture) === null || _d === void 0 ? void 0 : _d.cameraFeed
|
|
12657
|
+
}), renderCameraFeed && ( /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
12658
|
+
className: (_b = classNames.capture) === null || _b === void 0 ? void 0 : _b.cameraFeed
|
|
12735
12659
|
})), captureState !== 'LOADING' && function () {
|
|
12736
12660
|
switch (captureState) {
|
|
12737
12661
|
case 'CAPTURING':
|
|
@@ -12781,7 +12705,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
|
|
|
12781
12705
|
default:
|
|
12782
12706
|
return null;
|
|
12783
12707
|
}
|
|
12784
|
-
}()
|
|
12708
|
+
}(), /*#__PURE__*/React__default.createElement(SelfieCaptureLoadingOverlay, {
|
|
12785
12709
|
key: attempt,
|
|
12786
12710
|
mode: loadingOverlayMode,
|
|
12787
12711
|
customOverlayContent: customOverlayContent,
|
|
@@ -12815,24 +12739,26 @@ var SubmissionSuccess = function SubmissionSuccess() {
|
|
|
12815
12739
|
}
|
|
12816
12740
|
return JSON.stringify(body, null, 2);
|
|
12817
12741
|
}, [submissionRequest, truncateImages]);
|
|
12818
|
-
return /*#__PURE__*/React__default.createElement(
|
|
12742
|
+
return /*#__PURE__*/React__default.createElement(Container$4, null, /*#__PURE__*/React__default.createElement("h3", null, "Submission completed!"), /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
12819
12743
|
onClick: function onClick() {
|
|
12820
|
-
setShowRequestBody(!showRequestBody);
|
|
12744
|
+
return setShowRequestBody(!showRequestBody);
|
|
12821
12745
|
}
|
|
12822
|
-
}, showRequestBody ? 'Hide' : 'Show', " request body"), showRequestBody && ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(
|
|
12746
|
+
}, showRequestBody ? 'Hide' : 'Show', " request body"), showRequestBody && ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
12823
12747
|
style: {
|
|
12824
12748
|
marginLeft: 8
|
|
12825
12749
|
},
|
|
12826
12750
|
onClick: function onClick() {
|
|
12827
|
-
setTruncateImages(!truncateImages);
|
|
12751
|
+
return setTruncateImages(!truncateImages);
|
|
12828
12752
|
}
|
|
12829
12753
|
}, truncateImages ? 'Display full images' : 'Truncate images'), /*#__PURE__*/React__default.createElement("h5", null, "Request Body"), /*#__PURE__*/React__default.createElement("pre", null, requestBodyDisplay))), /*#__PURE__*/React__default.createElement("h5", null, "Response Body"), /*#__PURE__*/React__default.createElement("pre", null, JSON.stringify(submissionResponse, null, 2)));
|
|
12830
12754
|
};
|
|
12755
|
+
var Container$4 = styled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n padding: 16px;\n overflow: auto;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n"], ["\n padding: 16px;\n overflow: auto;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n"])));
|
|
12831
12756
|
function truncate(str, max_chars) {
|
|
12832
12757
|
var truncated = str.split('').splice(0, max_chars).join('');
|
|
12833
12758
|
if (truncated.length < str.length) truncated += '...';
|
|
12834
12759
|
return truncated;
|
|
12835
12760
|
}
|
|
12761
|
+
var templateObject_1$e;
|
|
12836
12762
|
|
|
12837
12763
|
var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
|
|
12838
12764
|
var document = _a.document,
|
|
@@ -12908,11 +12834,11 @@ var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
|
|
|
12908
12834
|
}
|
|
12909
12835
|
}, verbiage.captureBtnText)))));
|
|
12910
12836
|
};
|
|
12911
|
-
var Inner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
12912
|
-
var Heading$4 = styled.h3(templateObject_2$
|
|
12837
|
+
var Inner$2 = styled(OverlayInner$2)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
12838
|
+
var Heading$4 = styled.h3(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
12913
12839
|
var Description = styled.p(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
12914
|
-
var StyledButtonsRow$4 = styled(ButtonsRow)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
12915
|
-
var templateObject_1$
|
|
12840
|
+
var StyledButtonsRow$4 = styled(ButtonsRow$2)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
12841
|
+
var templateObject_1$d, templateObject_2$c, templateObject_3$a, templateObject_4$5;
|
|
12916
12842
|
|
|
12917
12843
|
var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
|
|
12918
12844
|
var documents = _a.documents,
|
|
@@ -13062,7 +12988,7 @@ function convertSVGtoImg(svgData_1) {
|
|
|
13062
12988
|
});
|
|
13063
12989
|
}
|
|
13064
12990
|
|
|
13065
|
-
var SignaturePaperBacking = styled.div(templateObject_1$
|
|
12991
|
+
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) {
|
|
13066
12992
|
var _a, _b;
|
|
13067
12993
|
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, ";") : "";
|
|
13068
12994
|
}, function (props) {
|
|
@@ -13072,7 +12998,7 @@ var SignaturePaperBacking = styled.div(templateObject_1$b || (templateObject_1$b
|
|
|
13072
12998
|
var _a, _b;
|
|
13073
12999
|
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, ";") : "";
|
|
13074
13000
|
});
|
|
13075
|
-
var SignatureCanvasContainer$1 = styled.div(templateObject_2$
|
|
13001
|
+
var SignatureCanvasContainer$1 = styled.div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"], ["\n position: absolute;\n top: 25%;\n left: 15%;\n width: 70%;\n height: 50%;\n\n @media (max-width: 800px) {\n top: 15%;\n left: 2%;\n width: 96%;\n height: 70%;\n }\n"])));
|
|
13076
13002
|
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) {
|
|
13077
13003
|
var _a, _b, _c;
|
|
13078
13004
|
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)';
|
|
@@ -13083,8 +13009,8 @@ var SignaturePad = styled.div(templateObject_3$9 || (templateObject_3$9 = __make
|
|
|
13083
13009
|
var _a, _b, _c;
|
|
13084
13010
|
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';
|
|
13085
13011
|
});
|
|
13086
|
-
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"])));
|
|
13087
|
-
var templateObject_1$
|
|
13012
|
+
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"])));
|
|
13013
|
+
var templateObject_1$c, templateObject_2$b, templateObject_3$9, templateObject_4$4;
|
|
13088
13014
|
|
|
13089
13015
|
var SignatureCapture = function SignatureCapture(_a) {
|
|
13090
13016
|
var onAccept = _a.onAccept,
|
|
@@ -13119,7 +13045,7 @@ var SignatureCapture = function SignatureCapture(_a) {
|
|
|
13119
13045
|
});
|
|
13120
13046
|
});
|
|
13121
13047
|
}
|
|
13122
|
-
return /*#__PURE__*/React__default.createElement(
|
|
13048
|
+
return /*#__PURE__*/React__default.createElement(Container$3, {
|
|
13123
13049
|
className: classNames.container
|
|
13124
13050
|
}, /*#__PURE__*/React__default.createElement(SignaturePaperBacking, {
|
|
13125
13051
|
className: classNames.inner
|
|
@@ -13157,8 +13083,9 @@ var SignatureCapture = function SignatureCapture(_a) {
|
|
|
13157
13083
|
finished: true
|
|
13158
13084
|
}, verbiage.acceptBtnText)))));
|
|
13159
13085
|
};
|
|
13160
|
-
var
|
|
13161
|
-
var
|
|
13086
|
+
var Container$3 = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n position: relative;\n"], ["\n width: 100%;\n height: 100%;\n position: relative;\n"])));
|
|
13087
|
+
var AcceptBtn$1 = styled(LoaderButton)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
13088
|
+
var templateObject_1$b, templateObject_2$a;
|
|
13162
13089
|
|
|
13163
13090
|
var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
|
|
13164
13091
|
if (mergeAVStreams === void 0) {
|
|
@@ -13570,7 +13497,7 @@ function VideoSignatureGuides(_a) {
|
|
|
13570
13497
|
var isSigning = requestedAction === 'CAPTURE_SIGNATURE';
|
|
13571
13498
|
var canClear = isSigning && !signaturePadEmpty;
|
|
13572
13499
|
var canSubmit = isSigning && signatureValid;
|
|
13573
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
13500
|
+
return /*#__PURE__*/React__default.createElement(Container$2, {
|
|
13574
13501
|
className: classNames.container
|
|
13575
13502
|
}, /*#__PURE__*/React__default.createElement(Inner$1, {
|
|
13576
13503
|
className: classNames.inner
|
|
@@ -13626,51 +13553,50 @@ function VideoSignatureGuides(_a) {
|
|
|
13626
13553
|
finished: true
|
|
13627
13554
|
}, verbiage.acceptSignatureBtnText))))));
|
|
13628
13555
|
}
|
|
13629
|
-
var Container$
|
|
13556
|
+
var Container$2 = styled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
|
|
13630
13557
|
var _a;
|
|
13631
13558
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
13632
13559
|
});
|
|
13633
|
-
var Inner$1 = styled.div(templateObject_2$
|
|
13560
|
+
var Inner$1 = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n"])));
|
|
13634
13561
|
var FaceGuideContainer$1 = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n position: relative;\n height: 50%;\n"], ["\n position: relative;\n height: 50%;\n"])));
|
|
13635
13562
|
var StyledSelfieCaptureAnimatedMask = styled(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n max-width: 100%;\n height: 100%;\n"], ["\n max-width: 100%;\n height: 100%;\n"])));
|
|
13636
|
-
var SignaturePadContainer = styled.div(templateObject_5$
|
|
13563
|
+
var SignaturePadContainer = styled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n position: relative;\n max-width: 100%;\n height: 50%;\n aspect-ratio: 2;\n"], ["\n position: relative;\n max-width: 100%;\n height: 50%;\n aspect-ratio: 2;\n"])));
|
|
13637
13564
|
var SignatureCanvasContainer = styled.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n"])), function (props) {
|
|
13638
13565
|
return props.$disabled ? 'opacity: 0.5; pointer-events: none;' : '';
|
|
13639
13566
|
});
|
|
13640
13567
|
var AcceptBtn = styled(LoaderButton)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
13641
|
-
var templateObject_1$
|
|
13568
|
+
var templateObject_1$a, templateObject_2$9, templateObject_3$8, templateObject_4$3, templateObject_5$3, templateObject_6$2, templateObject_7$1;
|
|
13642
13569
|
|
|
13643
13570
|
var DEFAULT_MIN_SIGNATURE_PAD_POINTS = 10;
|
|
13644
13571
|
var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
13645
|
-
var _b;
|
|
13646
13572
|
var onVideoCaptured = _a.onVideoCaptured,
|
|
13647
13573
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
13648
13574
|
onExit = _a.onExit,
|
|
13649
|
-
|
|
13650
|
-
restartVideoOnSignaturePadCleared =
|
|
13575
|
+
_b = _a.restartVideoOnSignaturePadCleared,
|
|
13576
|
+
restartVideoOnSignaturePadCleared = _b === void 0 ? true : _b,
|
|
13651
13577
|
guidesComponent = _a.guidesComponent,
|
|
13652
|
-
|
|
13653
|
-
minSignaturePadPoints =
|
|
13654
|
-
|
|
13655
|
-
classNames =
|
|
13656
|
-
|
|
13657
|
-
colors =
|
|
13658
|
-
|
|
13659
|
-
rawVerbiage =
|
|
13660
|
-
|
|
13661
|
-
debugMode =
|
|
13578
|
+
_c = _a.minSignaturePadPoints,
|
|
13579
|
+
minSignaturePadPoints = _c === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _c,
|
|
13580
|
+
_d = _a.classNames,
|
|
13581
|
+
classNames = _d === void 0 ? {} : _d,
|
|
13582
|
+
_e = _a.colors,
|
|
13583
|
+
colors = _e === void 0 ? {} : _e,
|
|
13584
|
+
_f = _a.verbiage,
|
|
13585
|
+
rawVerbiage = _f === void 0 ? {} : _f,
|
|
13586
|
+
_g = _a.debugMode,
|
|
13587
|
+
debugMode = _g === void 0 ? false : _g;
|
|
13662
13588
|
var camera = useCameraStore(function (state) {
|
|
13663
13589
|
return state.camera;
|
|
13664
13590
|
});
|
|
13665
13591
|
var onPredictionMade = useContext(SelfieGuidanceModelsContext).onPredictionMade;
|
|
13666
|
-
var
|
|
13667
|
-
signatureData =
|
|
13668
|
-
signatureDataUrl =
|
|
13669
|
-
signatureVideoData =
|
|
13670
|
-
startRecording =
|
|
13671
|
-
stopRecording =
|
|
13672
|
-
clearRecordedData =
|
|
13673
|
-
isRecording =
|
|
13592
|
+
var _h = useVideoSignatureContext(),
|
|
13593
|
+
signatureData = _h.signatureData,
|
|
13594
|
+
signatureDataUrl = _h.signatureDataUrl,
|
|
13595
|
+
signatureVideoData = _h.signatureVideoData,
|
|
13596
|
+
startRecording = _h.startRecording,
|
|
13597
|
+
stopRecording = _h.stopRecording,
|
|
13598
|
+
clearRecordedData = _h.clearRecordedData,
|
|
13599
|
+
isRecording = _h.isRecording;
|
|
13674
13600
|
useEffect(function () {
|
|
13675
13601
|
startRecording();
|
|
13676
13602
|
return stopRecording;
|
|
@@ -13685,9 +13611,9 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
|
13685
13611
|
onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
|
|
13686
13612
|
}
|
|
13687
13613
|
}, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
|
|
13688
|
-
var
|
|
13689
|
-
numFramesWithoutFaces =
|
|
13690
|
-
setNumFramesWithoutFaces =
|
|
13614
|
+
var _j = useState(0),
|
|
13615
|
+
numFramesWithoutFaces = _j[0],
|
|
13616
|
+
setNumFramesWithoutFaces = _j[1];
|
|
13691
13617
|
useEffect(function () {
|
|
13692
13618
|
onPredictionMade(function (_a) {
|
|
13693
13619
|
var face = _a.face;
|
|
@@ -13702,8 +13628,8 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
|
13702
13628
|
}
|
|
13703
13629
|
}, [numFramesWithoutFaces, onFaceNotDetected]);
|
|
13704
13630
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : VideoSignatureGuides;
|
|
13705
|
-
return /*#__PURE__*/React__default.createElement(
|
|
13706
|
-
className:
|
|
13631
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
13632
|
+
className: classNames.container
|
|
13707
13633
|
}, verbiage.guidanceMessageText && ( /*#__PURE__*/React__default.createElement(GuidanceMessageContainer, {
|
|
13708
13634
|
"$top": "10vh",
|
|
13709
13635
|
className: classNames.guidanceMessageContainer
|
|
@@ -13761,7 +13687,7 @@ var VideoSignatureSuccess = function VideoSignatureSuccess(_a) {
|
|
|
13761
13687
|
style: {
|
|
13762
13688
|
display: 'none'
|
|
13763
13689
|
}
|
|
13764
|
-
})), /*#__PURE__*/React__default.createElement(ButtonsRow, {
|
|
13690
|
+
})), /*#__PURE__*/React__default.createElement(ButtonsRow$2, {
|
|
13765
13691
|
className: classNames.buttonsRow
|
|
13766
13692
|
}, /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
13767
13693
|
variant: "warning",
|
|
@@ -13777,61 +13703,60 @@ var VideoSignatureSuccess = function VideoSignatureSuccess(_a) {
|
|
|
13777
13703
|
finished: true
|
|
13778
13704
|
}, verbiage.doneBtnText))));
|
|
13779
13705
|
};
|
|
13780
|
-
var StyledVideo$1 = styled.video(templateObject_1$
|
|
13781
|
-
var templateObject_1$
|
|
13706
|
+
var StyledVideo$1 = styled.video(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"], ["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"])));
|
|
13707
|
+
var templateObject_1$9;
|
|
13782
13708
|
|
|
13783
13709
|
var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
13784
|
-
var _b;
|
|
13785
13710
|
var onComplete = _a.onComplete,
|
|
13786
13711
|
onVideoCaptured = _a.onVideoCaptured,
|
|
13787
13712
|
onRetryClicked = _a.onRetryClicked,
|
|
13788
13713
|
onExitCapture = _a.onExitCapture,
|
|
13789
13714
|
onUserCancel = _a.onUserCancel,
|
|
13790
13715
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
13791
|
-
|
|
13792
|
-
loadingOverlayMode =
|
|
13716
|
+
_b = _a.loadingOverlayMode,
|
|
13717
|
+
loadingOverlayMode = _b === void 0 ? 'default' : _b,
|
|
13793
13718
|
customOverlayContent = _a.customOverlayContent,
|
|
13794
|
-
|
|
13795
|
-
skipSuccessScreen =
|
|
13796
|
-
|
|
13797
|
-
captureAudio =
|
|
13798
|
-
|
|
13799
|
-
minSignaturePadPoints =
|
|
13800
|
-
|
|
13801
|
-
allowSignatureAfterLivenessCheckFailure =
|
|
13802
|
-
|
|
13803
|
-
restartVideoOnSignaturePadCleared =
|
|
13719
|
+
_c = _a.skipSuccessScreen,
|
|
13720
|
+
skipSuccessScreen = _c === void 0 ? false : _c,
|
|
13721
|
+
_d = _a.captureAudio,
|
|
13722
|
+
captureAudio = _d === void 0 ? false : _d,
|
|
13723
|
+
_e = _a.minSignaturePadPoints,
|
|
13724
|
+
minSignaturePadPoints = _e === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _e,
|
|
13725
|
+
_f = _a.allowSignatureAfterLivenessCheckFailure,
|
|
13726
|
+
allowSignatureAfterLivenessCheckFailure = _f === void 0 ? false : _f,
|
|
13727
|
+
_g = _a.restartVideoOnSignaturePadCleared,
|
|
13728
|
+
restartVideoOnSignaturePadCleared = _g === void 0 ? true : _g,
|
|
13804
13729
|
faceLivenessProps = _a.faceLivenessProps,
|
|
13805
|
-
|
|
13806
|
-
assets =
|
|
13807
|
-
|
|
13808
|
-
classNames =
|
|
13809
|
-
|
|
13810
|
-
colors =
|
|
13811
|
-
|
|
13812
|
-
verbiage =
|
|
13813
|
-
|
|
13814
|
-
debugMode =
|
|
13815
|
-
var
|
|
13816
|
-
selfieImage =
|
|
13817
|
-
setSelfieImage =
|
|
13818
|
-
setSignatureData =
|
|
13819
|
-
setSignatureVideoUrl =
|
|
13820
|
-
logSelfieCaptureAttempt =
|
|
13730
|
+
_h = _a.assets,
|
|
13731
|
+
assets = _h === void 0 ? {} : _h,
|
|
13732
|
+
_j = _a.classNames,
|
|
13733
|
+
classNames = _j === void 0 ? {} : _j,
|
|
13734
|
+
_k = _a.colors,
|
|
13735
|
+
colors = _k === void 0 ? {} : _k,
|
|
13736
|
+
_l = _a.verbiage,
|
|
13737
|
+
verbiage = _l === void 0 ? {} : _l,
|
|
13738
|
+
_m = _a.debugMode,
|
|
13739
|
+
debugMode = _m === void 0 ? false : _m;
|
|
13740
|
+
var _o = useContext(SubmissionContext),
|
|
13741
|
+
selfieImage = _o.selfieImage,
|
|
13742
|
+
setSelfieImage = _o.setSelfieImage,
|
|
13743
|
+
setSignatureData = _o.setSignatureData,
|
|
13744
|
+
setSignatureVideoUrl = _o.setSignatureVideoUrl,
|
|
13745
|
+
logSelfieCaptureAttempt = _o.logSelfieCaptureAttempt;
|
|
13821
13746
|
var cameraAccessDenied = useCameraStore(useShallow(function (state) {
|
|
13822
13747
|
return {
|
|
13823
13748
|
cameraAccessDenied: state.cameraAccessDenied
|
|
13824
13749
|
};
|
|
13825
13750
|
})).cameraAccessDenied;
|
|
13826
|
-
var
|
|
13827
|
-
captureState =
|
|
13828
|
-
setCaptureState =
|
|
13751
|
+
var _p = useState('CHECKING_LIVENESS'),
|
|
13752
|
+
captureState = _p[0],
|
|
13753
|
+
setCaptureState = _p[1];
|
|
13829
13754
|
var operationStartedAt = useRef();
|
|
13830
13755
|
var captureStartedAt = useRef();
|
|
13831
13756
|
var captureEndedAt = useRef();
|
|
13832
|
-
var
|
|
13833
|
-
start =
|
|
13834
|
-
stop =
|
|
13757
|
+
var _q = useContext(SelfieGuidanceModelsContext),
|
|
13758
|
+
start = _q.start,
|
|
13759
|
+
stop = _q.stop;
|
|
13835
13760
|
useEffect(function () {
|
|
13836
13761
|
operationStartedAt.current = new Date();
|
|
13837
13762
|
}, []);
|
|
@@ -13867,9 +13792,9 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
|
13867
13792
|
setSelfieImage(selfieFromRequest);
|
|
13868
13793
|
}
|
|
13869
13794
|
}, [logCaptureMetadata, onFaceLivenessSuccessProp, selfieImage, setSelfieImage]);
|
|
13870
|
-
var
|
|
13871
|
-
signatureImageUrl =
|
|
13872
|
-
setSignatureImageUrl =
|
|
13795
|
+
var _r = useState(null),
|
|
13796
|
+
signatureImageUrl = _r[0],
|
|
13797
|
+
setSignatureImageUrl = _r[1];
|
|
13873
13798
|
var onSignatureCaptureCompleted = useCallback(function (videoData, signatureData, signatureImageData) {
|
|
13874
13799
|
setSignatureData(signatureData);
|
|
13875
13800
|
setSignatureVideoUrl(URL.createObjectURL(videoData));
|
|
@@ -13880,9 +13805,9 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
|
13880
13805
|
var onSignatureCaptureFacesNotDetected = useCallback(function () {
|
|
13881
13806
|
setCaptureState('CHECKING_LIVENESS');
|
|
13882
13807
|
}, []);
|
|
13883
|
-
var
|
|
13884
|
-
attempt =
|
|
13885
|
-
setAttempt =
|
|
13808
|
+
var _s = useState(0),
|
|
13809
|
+
attempt = _s[0],
|
|
13810
|
+
setAttempt = _s[1];
|
|
13886
13811
|
var onRetry = useCallback(function () {
|
|
13887
13812
|
onRetryClicked === null || onRetryClicked === void 0 ? void 0 : onRetryClicked();
|
|
13888
13813
|
setAttempt(function (n) {
|
|
@@ -13919,8 +13844,6 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
|
13919
13844
|
}, [faceLivenessOnLoadingOverlayDismissed, onLoadingOverlayDismissed]);
|
|
13920
13845
|
return /*#__PURE__*/React__default.createElement(VideoSignatureContextProvider, {
|
|
13921
13846
|
captureAudio: captureAudio
|
|
13922
|
-
}, /*#__PURE__*/React__default.createElement(PageContainer, {
|
|
13923
|
-
className: "flex ".concat((_b = classNames === null || classNames === void 0 ? void 0 : classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
13924
13847
|
}, /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
13925
13848
|
className: classNames.cameraFeed
|
|
13926
13849
|
}), function () {
|
|
@@ -13970,7 +13893,7 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
|
|
|
13970
13893
|
default:
|
|
13971
13894
|
return null;
|
|
13972
13895
|
}
|
|
13973
|
-
}())
|
|
13896
|
+
}());
|
|
13974
13897
|
};
|
|
13975
13898
|
function VideoSignatureWizardGuides(_a) {
|
|
13976
13899
|
var status = _a.status,
|
|
@@ -14089,7 +14012,7 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
|
|
|
14089
14012
|
};
|
|
14090
14013
|
}, [idCardGuideWidth, idCardGuideHeight, aspectRatio]);
|
|
14091
14014
|
var disableIdGuides = ((_u = (_t = theme.idVideoCapture) === null || _t === void 0 ? void 0 : _t.idCardGuides) === null || _u === void 0 ? void 0 : _u.disableDuringLivenessCheck) && requestedAction === 'VERIFY_LIVENESS';
|
|
14092
|
-
return /*#__PURE__*/React__default.createElement(Container, {
|
|
14015
|
+
return /*#__PURE__*/React__default.createElement(Container$1, {
|
|
14093
14016
|
className: classNames.container
|
|
14094
14017
|
}, /*#__PURE__*/React__default.createElement(Inner, null, /*#__PURE__*/React__default.createElement(FaceGuideContainer, {
|
|
14095
14018
|
className: classNames.faceGuideContainer
|
|
@@ -14128,25 +14051,25 @@ var IdVideoCaptureGuides = function IdVideoCaptureGuides(_a) {
|
|
|
14128
14051
|
borderWidth: idCardGuideBorderWidth,
|
|
14129
14052
|
borderColor: idCardGuideBorderColor,
|
|
14130
14053
|
imageStyle: idCardImageStyle
|
|
14131
|
-
}))), /*#__PURE__*/React__default.createElement(IdCardGuideInstructionsContainer, {
|
|
14054
|
+
}))))), /*#__PURE__*/React__default.createElement(IdCardGuideInstructionsContainer, {
|
|
14132
14055
|
className: classNames.idCardGuideInstructionsContainer
|
|
14133
14056
|
}, /*#__PURE__*/React__default.createElement(IdCardGuideInstructions, {
|
|
14134
14057
|
className: classNames.idCardGuideInstructions,
|
|
14135
14058
|
"$textColor": (_w = (_v = theme.idVideoCapture) === null || _v === void 0 ? void 0 : _v.idCardGuides) === null || _w === void 0 ? void 0 : _w.instructionsTextColor,
|
|
14136
14059
|
"$background": (_y = (_x = theme.idVideoCapture) === null || _x === void 0 ? void 0 : _x.idCardGuides) === null || _y === void 0 ? void 0 : _y.instructionsBackgroundColor
|
|
14137
|
-
}, instructionText))))
|
|
14060
|
+
}, instructionText))));
|
|
14138
14061
|
};
|
|
14139
|
-
var Container = styled.div(templateObject_1$
|
|
14062
|
+
var Container$1 = styled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
|
|
14140
14063
|
var _a;
|
|
14141
14064
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
14142
14065
|
});
|
|
14143
|
-
var Inner = styled.div(templateObject_2$
|
|
14066
|
+
var Inner = styled.div(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 1280px;\n display: flex;\n margin: auto;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
14144
14067
|
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"])));
|
|
14145
14068
|
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"])));
|
|
14146
|
-
var IdCardGuideInner = styled.div(templateObject_5$
|
|
14147
|
-
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
|
|
14148
|
-
var IdCardGuideInstructions = styled(GuidanceMessage)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-content: center;\n
|
|
14149
|
-
var templateObject_1$
|
|
14069
|
+
var IdCardGuideInner = styled.div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n width: 100%;\n"], ["\n position: relative;\n height: 100%;\n width: 100%;\n"])));
|
|
14070
|
+
var IdCardGuideInstructionsContainer = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n position: absolute;\n bottom: 16px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"], ["\n width: 100%;\n text-align: center;\n color: white;\n display: flex;\n flex-direction: column;\n justify-content: end;\n position: absolute;\n bottom: 16px;\n left: 0;\n right: 0;\n box-sizing: border-box;\n"])));
|
|
14071
|
+
var IdCardGuideInstructions = styled(GuidanceMessage)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-content: center;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"], ["\n align-content: center;\n padding: 8px 12px;\n font-weight: bold;\n font-size: 18px;\n"])));
|
|
14072
|
+
var templateObject_1$8, templateObject_2$8, templateObject_3$7, templateObject_4$2, templateObject_5$2, templateObject_6$1, templateObject_7;
|
|
14150
14073
|
|
|
14151
14074
|
var ReadTextPrompt = function ReadTextPrompt(_a) {
|
|
14152
14075
|
var text = _a.text,
|
|
@@ -14215,8 +14138,8 @@ var ReadTextPrompt = function ReadTextPrompt(_a) {
|
|
|
14215
14138
|
finished: true
|
|
14216
14139
|
}, verbiage.doneBtnText)));
|
|
14217
14140
|
};
|
|
14218
|
-
var ReadTextPromptContainer = styled.div(templateObject_1$
|
|
14219
|
-
var ReadTextPromptHeading = styled.div(templateObject_2$
|
|
14141
|
+
var ReadTextPromptContainer = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n flex-direction: column;\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n flex-direction: column;\n"])));
|
|
14142
|
+
var ReadTextPromptHeading = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n padding: 20px;\n font-weight: bold;\n margin: auto auto 32px;\n\n ", ";\n ", ";\n ", ";\n"], ["\n padding: 20px;\n font-weight: bold;\n margin: auto auto 32px;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
|
|
14220
14143
|
var _a, _b, _c, _d, _e, _f;
|
|
14221
14144
|
return ((_c = (_b = (_a = props.theme.idVideoCapture) === null || _a === void 0 ? void 0 : _a.readTextPrompt) === null || _b === void 0 ? void 0 : _b.heading) === null || _c === void 0 ? void 0 : _c.backgroundColor) ? "background: ".concat((_f = (_e = (_d = props.theme.idVideoCapture) === null || _d === void 0 ? void 0 : _d.readTextPrompt) === null || _e === void 0 ? void 0 : _e.heading) === null || _f === void 0 ? void 0 : _f.backgroundColor, ";") : "";
|
|
14222
14145
|
}, function (props) {
|
|
@@ -14236,8 +14159,8 @@ var ReadTextPromptText = styled.div(templateObject_3$6 || (templateObject_3$6 =
|
|
|
14236
14159
|
var _a, _b, _c, _d, _e, _f;
|
|
14237
14160
|
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, ";") : "";
|
|
14238
14161
|
});
|
|
14239
|
-
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"])));
|
|
14240
|
-
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) {
|
|
14162
|
+
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"])));
|
|
14163
|
+
var ReadTextPromptTimeRemaining = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n padding: 20px;\n\n ", ";\n ", ";\n ", ";\n"], ["\n padding: 20px;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
|
|
14241
14164
|
var _a, _b, _c, _d, _e, _f;
|
|
14242
14165
|
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, ";") : "";
|
|
14243
14166
|
}, function (props) {
|
|
@@ -14248,7 +14171,7 @@ var ReadTextPromptTimeRemaining = styled.div(templateObject_5 || (templateObject
|
|
|
14248
14171
|
return ((_c = (_b = (_a = props.theme.idVideoCapture) === null || _a === void 0 ? void 0 : _a.readTextPrompt) === null || _b === void 0 ? void 0 : _b.timeRemaining) === null || _c === void 0 ? void 0 : _c.borderRadius) ? "border-radius: ".concat((_f = (_e = (_d = props.theme.idVideoCapture) === null || _d === void 0 ? void 0 : _d.readTextPrompt) === null || _e === void 0 ? void 0 : _e.timeRemaining) === null || _f === void 0 ? void 0 : _f.borderRadius, ";") : "";
|
|
14249
14172
|
});
|
|
14250
14173
|
var DoneButton = styled(LoaderButton)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n margin: auto 0;\n"], ["\n margin: auto 0;\n"])));
|
|
14251
|
-
var templateObject_1$
|
|
14174
|
+
var templateObject_1$7, templateObject_2$7, templateObject_3$6, templateObject_4$1, templateObject_5$1, templateObject_6;
|
|
14252
14175
|
|
|
14253
14176
|
var edgeBoundary = 0.05;
|
|
14254
14177
|
var defaultVideoIdCaptureThresholds = {
|
|
@@ -14285,103 +14208,103 @@ var defaultVideoIdCaptureThresholds = {
|
|
|
14285
14208
|
flipShortcutThreshold: 0.7
|
|
14286
14209
|
};
|
|
14287
14210
|
var IdVideoCapture = function IdVideoCapture(_a) {
|
|
14288
|
-
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u
|
|
14211
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
|
14289
14212
|
var onComplete = _a.onComplete,
|
|
14290
14213
|
onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
|
|
14291
14214
|
onIdBackImageCaptured = _a.onIdBackImageCaptured,
|
|
14292
14215
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
14293
14216
|
onRecordingFailed = _a.onRecordingFailed,
|
|
14294
14217
|
onExitCapture = _a.onExitCapture,
|
|
14295
|
-
|
|
14296
|
-
idCaptureModelsEnabled =
|
|
14297
|
-
|
|
14298
|
-
idDocumentType =
|
|
14299
|
-
|
|
14300
|
-
idCaptureGuideImages =
|
|
14301
|
-
|
|
14302
|
-
idCardFrontDelay =
|
|
14303
|
-
|
|
14304
|
-
videoIdCaptureThresholds =
|
|
14305
|
-
|
|
14306
|
-
skipShowIdCardBack =
|
|
14307
|
-
|
|
14308
|
-
captureCountdownSeconds =
|
|
14218
|
+
_v = _a.idCaptureModelsEnabled,
|
|
14219
|
+
idCaptureModelsEnabled = _v === void 0 ? true : _v,
|
|
14220
|
+
_w = _a.idDocumentType,
|
|
14221
|
+
idDocumentType = _w === void 0 ? 'idCard' : _w,
|
|
14222
|
+
_x = _a.idCaptureGuideImages,
|
|
14223
|
+
idCaptureGuideImages = _x === void 0 ? defaultIdCaptureGuideImages : _x,
|
|
14224
|
+
_y = _a.idCardFrontDelay,
|
|
14225
|
+
idCardFrontDelay = _y === void 0 ? 1000 : _y,
|
|
14226
|
+
_z = _a.videoIdCaptureThresholds,
|
|
14227
|
+
videoIdCaptureThresholds = _z === void 0 ? defaultVideoIdCaptureThresholds : _z,
|
|
14228
|
+
_0 = _a.skipShowIdCardBack,
|
|
14229
|
+
skipShowIdCardBack = _0 === void 0 ? false : _0,
|
|
14230
|
+
_1 = _a.captureCountdownSeconds,
|
|
14231
|
+
captureCountdownSeconds = _1 === void 0 ? 3 : _1,
|
|
14309
14232
|
readTextPrompt = _a.readTextPrompt,
|
|
14310
|
-
|
|
14311
|
-
readTextTimeoutDurationMs =
|
|
14312
|
-
|
|
14313
|
-
readTextMinReadingMs =
|
|
14314
|
-
|
|
14315
|
-
disableFaceDetectionWhileAudioCapture =
|
|
14316
|
-
|
|
14317
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
14318
|
-
|
|
14319
|
-
mergeAVStreams =
|
|
14320
|
-
|
|
14321
|
-
classNames =
|
|
14322
|
-
|
|
14323
|
-
colors =
|
|
14324
|
-
|
|
14325
|
-
rawVerbiage =
|
|
14326
|
-
|
|
14327
|
-
debugMode =
|
|
14328
|
-
var
|
|
14329
|
-
ref =
|
|
14330
|
-
|
|
14331
|
-
width =
|
|
14332
|
-
|
|
14333
|
-
height =
|
|
14334
|
-
var
|
|
14335
|
-
camera =
|
|
14336
|
-
videoRef =
|
|
14337
|
-
videoLoaded =
|
|
14338
|
-
cameraReady =
|
|
14339
|
-
microphoneReady =
|
|
14340
|
-
audioStream =
|
|
14341
|
-
isRearFacing =
|
|
14342
|
-
releaseCameraAccess =
|
|
14343
|
-
var
|
|
14344
|
-
detectedObjects =
|
|
14345
|
-
setDetectedObjects =
|
|
14346
|
-
var
|
|
14347
|
-
face =
|
|
14348
|
-
setFace =
|
|
14349
|
-
var
|
|
14350
|
-
idModelsReady =
|
|
14351
|
-
startIdModels =
|
|
14352
|
-
stopIdModels =
|
|
14353
|
-
onIdPredictionMade =
|
|
14354
|
-
setThresholds =
|
|
14355
|
-
setRequiredDocumentType =
|
|
14356
|
-
setDocumentDetectionBoundaries =
|
|
14357
|
-
bestFrameDetails =
|
|
14358
|
-
resetBestFrame =
|
|
14359
|
-
idModelError =
|
|
14360
|
-
var
|
|
14361
|
-
videoStartsAt =
|
|
14362
|
-
setVideoStartsAt =
|
|
14363
|
-
var
|
|
14364
|
-
setIdCaptureVideoAudioStartsAt =
|
|
14365
|
-
setExpectedAudioText =
|
|
14366
|
-
var
|
|
14367
|
-
startSelfieGuidance =
|
|
14368
|
-
stopSelfieGuidance =
|
|
14369
|
-
onSelfiePredictionMade =
|
|
14370
|
-
selfieModelError =
|
|
14371
|
-
var
|
|
14372
|
-
isRecordingVideo =
|
|
14373
|
-
startRecordingVideo =
|
|
14374
|
-
startRecordingAudio =
|
|
14375
|
-
stopRecordingVideo =
|
|
14376
|
-
stopRecordingAudio =
|
|
14377
|
-
videoRecordingUnintentionallyStopped =
|
|
14378
|
-
audioRecordingUnintentionallyStopped =
|
|
14379
|
-
videoUrl =
|
|
14380
|
-
audioUrl =
|
|
14233
|
+
_2 = _a.readTextTimeoutDurationMs,
|
|
14234
|
+
readTextTimeoutDurationMs = _2 === void 0 ? 15000 : _2,
|
|
14235
|
+
_3 = _a.readTextMinReadingMs,
|
|
14236
|
+
readTextMinReadingMs = _3 === void 0 ? 10000 : _3,
|
|
14237
|
+
_4 = _a.disableFaceDetectionWhileAudioCapture,
|
|
14238
|
+
disableFaceDetectionWhileAudioCapture = _4 === void 0 ? false : _4,
|
|
14239
|
+
_5 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
14240
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _5 === void 0 ? 2000 : _5,
|
|
14241
|
+
_6 = _a.mergeAVStreams,
|
|
14242
|
+
mergeAVStreams = _6 === void 0 ? false : _6,
|
|
14243
|
+
_7 = _a.classNames,
|
|
14244
|
+
classNames = _7 === void 0 ? {} : _7,
|
|
14245
|
+
_8 = _a.colors,
|
|
14246
|
+
colors = _8 === void 0 ? {} : _8,
|
|
14247
|
+
_9 = _a.verbiage,
|
|
14248
|
+
rawVerbiage = _9 === void 0 ? {} : _9,
|
|
14249
|
+
_10 = _a.debugMode,
|
|
14250
|
+
debugMode = _10 === void 0 ? false : _10;
|
|
14251
|
+
var _11 = useResizeObserver(),
|
|
14252
|
+
ref = _11.ref,
|
|
14253
|
+
_12 = _11.width,
|
|
14254
|
+
width = _12 === void 0 ? 1 : _12,
|
|
14255
|
+
_13 = _11.height,
|
|
14256
|
+
height = _13 === void 0 ? 1 : _13;
|
|
14257
|
+
var _14 = useCameraStore(),
|
|
14258
|
+
camera = _14.camera,
|
|
14259
|
+
videoRef = _14.videoRef,
|
|
14260
|
+
videoLoaded = _14.videoLoaded,
|
|
14261
|
+
cameraReady = _14.cameraReady,
|
|
14262
|
+
microphoneReady = _14.microphoneReady,
|
|
14263
|
+
audioStream = _14.audioStream,
|
|
14264
|
+
isRearFacing = _14.isRearFacing,
|
|
14265
|
+
releaseCameraAccess = _14.releaseCameraAccess;
|
|
14266
|
+
var _15 = useState([]),
|
|
14267
|
+
detectedObjects = _15[0],
|
|
14268
|
+
setDetectedObjects = _15[1];
|
|
14269
|
+
var _16 = useState(null),
|
|
14270
|
+
face = _16[0],
|
|
14271
|
+
setFace = _16[1];
|
|
14272
|
+
var _17 = useContext(IdCaptureModelsContext),
|
|
14273
|
+
idModelsReady = _17.ready,
|
|
14274
|
+
startIdModels = _17.start,
|
|
14275
|
+
stopIdModels = _17.stop,
|
|
14276
|
+
onIdPredictionMade = _17.onPredictionMade,
|
|
14277
|
+
setThresholds = _17.setThresholds,
|
|
14278
|
+
setRequiredDocumentType = _17.setRequiredDocumentType,
|
|
14279
|
+
setDocumentDetectionBoundaries = _17.setDocumentDetectionBoundaries,
|
|
14280
|
+
bestFrameDetails = _17.bestFrameDetails,
|
|
14281
|
+
resetBestFrame = _17.resetBestFrame,
|
|
14282
|
+
idModelError = _17.modelError;
|
|
14283
|
+
var _18 = useState(null),
|
|
14284
|
+
videoStartsAt = _18[0],
|
|
14285
|
+
setVideoStartsAt = _18[1];
|
|
14286
|
+
var _19 = useContext(SubmissionContext),
|
|
14287
|
+
setIdCaptureVideoAudioStartsAt = _19.setIdCaptureVideoAudioStartsAt,
|
|
14288
|
+
setExpectedAudioText = _19.setExpectedAudioText;
|
|
14289
|
+
var _20 = useContext(SelfieGuidanceModelsContext),
|
|
14290
|
+
startSelfieGuidance = _20.start,
|
|
14291
|
+
stopSelfieGuidance = _20.stop,
|
|
14292
|
+
onSelfiePredictionMade = _20.onPredictionMade,
|
|
14293
|
+
selfieModelError = _20.error;
|
|
14294
|
+
var _21 = useVideoRecorder(camera, audioStream, mergeAVStreams),
|
|
14295
|
+
isRecordingVideo = _21.isRecordingVideo,
|
|
14296
|
+
startRecordingVideo = _21.startRecordingVideo,
|
|
14297
|
+
startRecordingAudio = _21.startRecordingAudio,
|
|
14298
|
+
stopRecordingVideo = _21.stopRecordingVideo,
|
|
14299
|
+
stopRecordingAudio = _21.stopRecordingAudio,
|
|
14300
|
+
videoRecordingUnintentionallyStopped = _21.videoRecordingUnintentionallyStopped,
|
|
14301
|
+
audioRecordingUnintentionallyStopped = _21.audioRecordingUnintentionallyStopped,
|
|
14302
|
+
videoUrl = _21.videoUrl,
|
|
14303
|
+
audioUrl = _21.audioUrl;
|
|
14381
14304
|
var countdownTimeoutRef = useRef(undefined);
|
|
14382
|
-
var
|
|
14383
|
-
countdownRemaining =
|
|
14384
|
-
setCountdownRemaining =
|
|
14305
|
+
var _22 = useState(-1),
|
|
14306
|
+
countdownRemaining = _22[0],
|
|
14307
|
+
setCountdownRemaining = _22[1];
|
|
14385
14308
|
useEffect(function () {
|
|
14386
14309
|
if (!isRecordingVideo && !videoUrl) {
|
|
14387
14310
|
startRecordingVideo();
|
|
@@ -14401,9 +14324,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14401
14324
|
onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
|
|
14402
14325
|
}
|
|
14403
14326
|
}, [audioRecordingUnintentionallyStopped, microphoneReady, onRecordingFailed, readTextPrompt, videoRecordingUnintentionallyStopped]);
|
|
14404
|
-
var
|
|
14405
|
-
requestedAction =
|
|
14406
|
-
setRequestedAction =
|
|
14327
|
+
var _23 = useState(idDocumentType === 'idCard' ? 'SHOW_ID_FRONT' : 'SHOW_PASSPORT'),
|
|
14328
|
+
requestedAction = _23[0],
|
|
14329
|
+
setRequestedAction = _23[1];
|
|
14407
14330
|
var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
|
|
14408
14331
|
useEffect(function startModelsWhenCapturing() {
|
|
14409
14332
|
if (!shouldRunIdModels) return;
|
|
@@ -14442,23 +14365,23 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14442
14365
|
bottom: 0
|
|
14443
14366
|
});
|
|
14444
14367
|
}, [setDocumentDetectionBoundaries]);
|
|
14445
|
-
var
|
|
14446
|
-
currentDetectionScore =
|
|
14447
|
-
setCurrentDetectionScore =
|
|
14448
|
-
var
|
|
14449
|
-
currentDetectedDocumentType =
|
|
14450
|
-
setCurrentDetectedDocumentType =
|
|
14368
|
+
var _24 = useState(0),
|
|
14369
|
+
currentDetectionScore = _24[0],
|
|
14370
|
+
setCurrentDetectionScore = _24[1];
|
|
14371
|
+
var _25 = useState('none'),
|
|
14372
|
+
currentDetectedDocumentType = _25[0],
|
|
14373
|
+
setCurrentDetectedDocumentType = _25[1];
|
|
14374
|
+
var _26 = useState(0),
|
|
14375
|
+
currentFocusScore = _26[0],
|
|
14376
|
+
setCurrentFocusScore = _26[1];
|
|
14451
14377
|
var _27 = useState(0),
|
|
14452
|
-
|
|
14453
|
-
|
|
14454
|
-
var _28 = useState(0),
|
|
14455
|
-
goodFramesCount = _28[0],
|
|
14456
|
-
setGoodFramesCount = _28[1];
|
|
14378
|
+
goodFramesCount = _27[0],
|
|
14379
|
+
setGoodFramesCount = _27[1];
|
|
14457
14380
|
var goodFramesThreshold = requestedAction === 'SHOW_PASSPORT' ? adjustedThresholds.goodFrames.passport : requestedAction === 'SHOW_ID_FRONT' ? adjustedThresholds.goodFrames.idCardFront : adjustedThresholds.goodFrames.idCardBack;
|
|
14458
14381
|
var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
|
|
14459
|
-
var
|
|
14460
|
-
isSinglePage =
|
|
14461
|
-
setIsSinglePage =
|
|
14382
|
+
var _28 = useState(false),
|
|
14383
|
+
isSinglePage = _28[0],
|
|
14384
|
+
setIsSinglePage = _28[1];
|
|
14462
14385
|
useEffect(function () {
|
|
14463
14386
|
if (!idCaptureModelsEnabled || idModelError) return;
|
|
14464
14387
|
onIdPredictionMade(function (prediction) {
|
|
@@ -14478,9 +14401,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14478
14401
|
} : 0);
|
|
14479
14402
|
});
|
|
14480
14403
|
}, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, adjustedThresholds.flipShortcutThreshold]);
|
|
14481
|
-
var
|
|
14482
|
-
idFrontCaptureStartedAt =
|
|
14483
|
-
setFirstGoodFrameTime =
|
|
14404
|
+
var _29 = useState(null),
|
|
14405
|
+
idFrontCaptureStartedAt = _29[0],
|
|
14406
|
+
setFirstGoodFrameTime = _29[1];
|
|
14484
14407
|
useEffect(function () {
|
|
14485
14408
|
if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
|
|
14486
14409
|
}, [goodFramesCount]);
|
|
@@ -14501,9 +14424,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14501
14424
|
var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
|
|
14502
14425
|
var faceBox = face === null || face === void 0 ? void 0 : face.box;
|
|
14503
14426
|
var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
|
|
14504
|
-
var
|
|
14505
|
-
countdownStartedAt =
|
|
14506
|
-
setCountdownStartedAt =
|
|
14427
|
+
var _30 = useState(),
|
|
14428
|
+
countdownStartedAt = _30[0],
|
|
14429
|
+
setCountdownStartedAt = _30[1];
|
|
14507
14430
|
var photoCanvas = useRef(null);
|
|
14508
14431
|
var frameLock = useRef(false);
|
|
14509
14432
|
var captureFrame = useCallback(function () {
|
|
@@ -14613,9 +14536,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14613
14536
|
stopSelfieGuidance();
|
|
14614
14537
|
};
|
|
14615
14538
|
}, [startSelfieGuidance, stopSelfieGuidance]);
|
|
14616
|
-
var
|
|
14617
|
-
numFramesWithoutFaces =
|
|
14618
|
-
setNumFramesWithoutFaces =
|
|
14539
|
+
var _31 = useState(0),
|
|
14540
|
+
numFramesWithoutFaces = _31[0],
|
|
14541
|
+
setNumFramesWithoutFaces = _31[1];
|
|
14619
14542
|
onSelfiePredictionMade(useThrottledCallback(useCallback(function (_a) {
|
|
14620
14543
|
var face = _a.face;
|
|
14621
14544
|
if (selfieModelError) return;
|
|
@@ -14631,12 +14554,12 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14631
14554
|
}
|
|
14632
14555
|
}, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
|
|
14633
14556
|
var theme = useTheme();
|
|
14634
|
-
var
|
|
14557
|
+
var _32 = useTranslations(rawVerbiage, {
|
|
14635
14558
|
faceNotCenteredText: 'Please move your face to the center...',
|
|
14636
14559
|
captureBtnText: 'Capture'
|
|
14637
14560
|
}),
|
|
14638
|
-
captureBtnText =
|
|
14639
|
-
faceNotCenteredText =
|
|
14561
|
+
captureBtnText = _32.captureBtnText,
|
|
14562
|
+
faceNotCenteredText = _32.faceNotCenteredText;
|
|
14640
14563
|
var debugScalingDetails = useDebugScalingDetails({
|
|
14641
14564
|
enabled: debugMode,
|
|
14642
14565
|
pageWidth: width,
|
|
@@ -14646,9 +14569,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14646
14569
|
});
|
|
14647
14570
|
var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK', 'SHOW_PASSPORT'].includes(requestedAction);
|
|
14648
14571
|
var guidanceText = !faceCentered ? faceNotCenteredText : undefined;
|
|
14649
|
-
return /*#__PURE__*/React__default.createElement(
|
|
14572
|
+
return /*#__PURE__*/React__default.createElement(Container, {
|
|
14650
14573
|
ref: ref,
|
|
14651
|
-
className:
|
|
14574
|
+
className: classNames.container
|
|
14652
14575
|
}, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
14653
14576
|
ref: photoCanvas
|
|
14654
14577
|
}), requestedAction === 'READ_TEXT' ? ( /*#__PURE__*/React__default.createElement(ReadTextPrompt, {
|
|
@@ -14687,9 +14610,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14687
14610
|
className: classNames.guidanceMessageContainer
|
|
14688
14611
|
}, /*#__PURE__*/React__default.createElement(GuidanceMessage, {
|
|
14689
14612
|
className: classNames.guidanceMessage,
|
|
14690
|
-
"$background": (
|
|
14691
|
-
"$textColor": (
|
|
14692
|
-
}, guidanceText))), debugMode && ( /*#__PURE__*/React__default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__default.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__default.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__default.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React__default.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__default.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__default.createElement("br", null), "Best Frame Detection Score:", ' ', (
|
|
14613
|
+
"$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',
|
|
14614
|
+
"$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'
|
|
14615
|
+
}, guidanceText))), debugMode && ( /*#__PURE__*/React__default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__default.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__default.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__default.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React__default.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__default.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__default.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__default.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__default.createElement(CountdownContainer, {
|
|
14693
14616
|
className: classNames.countdownContainer
|
|
14694
14617
|
}, /*#__PURE__*/React__default.createElement(Countdown, {
|
|
14695
14618
|
className: classNames.countdown
|
|
@@ -14707,16 +14630,17 @@ var IdVideoCapture = function IdVideoCapture(_a) {
|
|
|
14707
14630
|
className: classNames.exitCaptureBtn
|
|
14708
14631
|
}));
|
|
14709
14632
|
};
|
|
14710
|
-
var
|
|
14711
|
-
var
|
|
14712
|
-
var
|
|
14713
|
-
var
|
|
14633
|
+
var Container = styled.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
14634
|
+
var CountdownContainer = styled.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 99999;\n display: flex;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 99999;\n display: flex;\n"])));
|
|
14635
|
+
var Countdown = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n color: white;\n font-size: 64px;\n font-weight: bold;\n margin: auto;\n"], ["\n color: white;\n font-size: 64px;\n font-weight: bold;\n margin: auto;\n"])));
|
|
14636
|
+
var CaptureButtonContainer = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: absolute;\n bottom: 0;\n width: 100%;\n display: flex;\n z-index: 100000;\n"], ["\n position: absolute;\n bottom: 0;\n width: 100%;\n display: flex;\n z-index: 100000;\n"])));
|
|
14637
|
+
var CaptureButton = styled(LoaderButton)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n margin: 0 auto 25px;\n"], ["\n margin: 0 auto 25px;\n"])));
|
|
14714
14638
|
function evaluateShouldSkip(value) {
|
|
14715
14639
|
if (value === true) return true;
|
|
14716
14640
|
if (typeof value === 'function') return value();
|
|
14717
14641
|
return false;
|
|
14718
14642
|
}
|
|
14719
|
-
var templateObject_1$
|
|
14643
|
+
var templateObject_1$6, templateObject_2$6, templateObject_3$5, templateObject_4, templateObject_5;
|
|
14720
14644
|
|
|
14721
14645
|
var IdVideoCaptureSuccess = function IdVideoCaptureSuccess(_a) {
|
|
14722
14646
|
var videoUrl = _a.videoUrl,
|
|
@@ -14817,7 +14741,7 @@ var IdVideoCaptureSuccess = function IdVideoCaptureSuccess(_a) {
|
|
|
14817
14741
|
})) : ( /*#__PURE__*/React__default.createElement("img", {
|
|
14818
14742
|
src: idBackImageUrl,
|
|
14819
14743
|
alt: "ID Back Image"
|
|
14820
|
-
}))), /*#__PURE__*/React__default.createElement(ButtonsRow, {
|
|
14744
|
+
}))), /*#__PURE__*/React__default.createElement(ButtonsRow$2, {
|
|
14821
14745
|
className: classNames.buttonsRow
|
|
14822
14746
|
}, /*#__PURE__*/React__default.createElement(LoaderButton, {
|
|
14823
14747
|
variant: "warning",
|
|
@@ -14836,13 +14760,13 @@ var IdVideoCaptureSuccess = function IdVideoCaptureSuccess(_a) {
|
|
|
14836
14760
|
finished: true
|
|
14837
14761
|
}, verbiage.doneBtnText))));
|
|
14838
14762
|
};
|
|
14839
|
-
var StyledVideo = styled.video(templateObject_1$
|
|
14840
|
-
var AssetSelectorOptions = styled.div(templateObject_2$
|
|
14763
|
+
var StyledVideo = styled.video(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"], ["\n margin-left: auto;\n margin-right: auto;\n max-width: 100%;\n"])));
|
|
14764
|
+
var AssetSelectorOptions = styled.div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n margin-bottom: 15px;\n display: flex;\n justify-content: center;\n"], ["\n margin-bottom: 15px;\n display: flex;\n justify-content: center;\n"])));
|
|
14841
14765
|
var AssetSelectorOption = styled.div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n padding: 0 8px;\n display: flex;\n gap: 5px;\n align-items: center;\n\n & > input {\n margin: 0;\n padding: 0;\n display: block;\n }\n"], ["\n padding: 0 8px;\n display: flex;\n gap: 5px;\n align-items: center;\n\n & > input {\n margin: 0;\n padding: 0;\n display: block;\n }\n"])));
|
|
14842
|
-
var templateObject_1$
|
|
14766
|
+
var templateObject_1$5, templateObject_2$5, templateObject_3$4;
|
|
14843
14767
|
|
|
14844
14768
|
var VideoIdWizard = function VideoIdWizard(_a) {
|
|
14845
|
-
var _b, _c, _d, _e, _f, _g, _h, _j
|
|
14769
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
14846
14770
|
var onComplete = _a.onComplete,
|
|
14847
14771
|
onExitCapture = _a.onExitCapture,
|
|
14848
14772
|
onExitAfterFailure = _a.onExitAfterFailure,
|
|
@@ -14851,73 +14775,73 @@ var VideoIdWizard = function VideoIdWizard(_a) {
|
|
|
14851
14775
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
14852
14776
|
onCameraTamperingDetected = _a.onCameraTamperingDetected,
|
|
14853
14777
|
onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
|
|
14854
|
-
|
|
14855
|
-
idCaptureProps =
|
|
14856
|
-
|
|
14857
|
-
faceLivenessProps =
|
|
14858
|
-
|
|
14859
|
-
idCaptureModelsEnabled =
|
|
14860
|
-
|
|
14861
|
-
videoIdCaptureThresholds =
|
|
14778
|
+
_k = _a.idCaptureProps,
|
|
14779
|
+
idCaptureProps = _k === void 0 ? {} : _k,
|
|
14780
|
+
_l = _a.faceLivenessProps,
|
|
14781
|
+
faceLivenessProps = _l === void 0 ? {} : _l,
|
|
14782
|
+
_m = _a.idCaptureModelsEnabled,
|
|
14783
|
+
idCaptureModelsEnabled = _m === void 0 ? true : _m,
|
|
14784
|
+
_o = _a.videoIdCaptureThresholds,
|
|
14785
|
+
videoIdCaptureThresholds = _o === void 0 ? defaultVideoIdCaptureThresholds : _o,
|
|
14862
14786
|
readTextPrompt = _a.readTextPrompt,
|
|
14863
14787
|
readTextTimeoutDurationMs = _a.readTextTimeoutDurationMs,
|
|
14864
14788
|
readTextMinReadingMs = _a.readTextMinReadingMs,
|
|
14865
|
-
|
|
14866
|
-
skipIdCapture =
|
|
14867
|
-
|
|
14868
|
-
skipShowIdCardBack =
|
|
14869
|
-
|
|
14870
|
-
skipSuccessScreen =
|
|
14871
|
-
|
|
14872
|
-
idCaptureLoadingOverlayMode =
|
|
14789
|
+
_p = _a.skipIdCapture,
|
|
14790
|
+
skipIdCapture = _p === void 0 ? false : _p,
|
|
14791
|
+
_q = _a.skipShowIdCardBack,
|
|
14792
|
+
skipShowIdCardBack = _q === void 0 ? false : _q,
|
|
14793
|
+
_r = _a.skipSuccessScreen,
|
|
14794
|
+
skipSuccessScreen = _r === void 0 ? false : _r,
|
|
14795
|
+
_s = _a.idCaptureLoadingOverlayMode,
|
|
14796
|
+
idCaptureLoadingOverlayMode = _s === void 0 ? 'default' : _s,
|
|
14873
14797
|
customOverlayContent = _a.customOverlayContent,
|
|
14874
14798
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
14875
|
-
|
|
14876
|
-
idDocumentType =
|
|
14877
|
-
|
|
14878
|
-
idCaptureGuideType =
|
|
14879
|
-
|
|
14880
|
-
idCaptureGuideImages =
|
|
14881
|
-
|
|
14882
|
-
idCapturePortraitGuidesOnMobile =
|
|
14883
|
-
|
|
14884
|
-
idCaptureRotateLoadingOverlayImageWhenPortrait =
|
|
14885
|
-
|
|
14886
|
-
idCaptureModelLoadTimeoutMs =
|
|
14887
|
-
|
|
14888
|
-
faceLivenessLoadingOverlayMode =
|
|
14889
|
-
|
|
14890
|
-
disableFaceDetectionWhileAudioCapture =
|
|
14891
|
-
|
|
14892
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
14893
|
-
|
|
14894
|
-
silentFallback =
|
|
14895
|
-
|
|
14896
|
-
mergeAVStreams =
|
|
14897
|
-
|
|
14898
|
-
assets =
|
|
14899
|
-
|
|
14900
|
-
classNames =
|
|
14901
|
-
|
|
14902
|
-
colors =
|
|
14903
|
-
|
|
14904
|
-
verbiage =
|
|
14905
|
-
|
|
14906
|
-
debugMode =
|
|
14907
|
-
var
|
|
14908
|
-
passportImage =
|
|
14909
|
-
submissionStatus =
|
|
14910
|
-
idCaptureVideoUrl =
|
|
14911
|
-
idCaptureVideoAudioUrl =
|
|
14912
|
-
idCaptureVideoIdFrontImage =
|
|
14913
|
-
idCaptureVideoIdBackImage =
|
|
14914
|
-
setIdCaptureVideoUrl =
|
|
14915
|
-
setIdCaptureVideoIdFrontImage =
|
|
14916
|
-
setIdCaptureVideoIdBackImage =
|
|
14917
|
-
setIdCaptureVideoAudioUrl =
|
|
14918
|
-
var
|
|
14919
|
-
captureState =
|
|
14920
|
-
setCaptureState =
|
|
14799
|
+
_t = _a.idDocumentType,
|
|
14800
|
+
idDocumentType = _t === void 0 ? 'idCardOrPassport' : _t,
|
|
14801
|
+
_u = _a.idCaptureGuideType,
|
|
14802
|
+
idCaptureGuideType = _u === void 0 ? 'fit' : _u,
|
|
14803
|
+
_v = _a.idCaptureGuideImages,
|
|
14804
|
+
idCaptureGuideImages = _v === void 0 ? defaultIdCaptureGuideImages : _v,
|
|
14805
|
+
_w = _a.idCapturePortraitGuidesOnMobile,
|
|
14806
|
+
idCapturePortraitGuidesOnMobile = _w === void 0 ? true : _w,
|
|
14807
|
+
_x = _a.idCaptureRotateLoadingOverlayImageWhenPortrait,
|
|
14808
|
+
idCaptureRotateLoadingOverlayImageWhenPortrait = _x === void 0 ? true : _x,
|
|
14809
|
+
_y = _a.idCaptureModelLoadTimeoutMs,
|
|
14810
|
+
idCaptureModelLoadTimeoutMs = _y === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _y,
|
|
14811
|
+
_z = _a.faceLivenessLoadingOverlayMode,
|
|
14812
|
+
faceLivenessLoadingOverlayMode = _z === void 0 ? 'default' : _z,
|
|
14813
|
+
_0 = _a.disableFaceDetectionWhileAudioCapture,
|
|
14814
|
+
disableFaceDetectionWhileAudioCapture = _0 === void 0 ? true : _0,
|
|
14815
|
+
_1 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
14816
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _1 === void 0 ? 2000 : _1,
|
|
14817
|
+
_2 = _a.silentFallback,
|
|
14818
|
+
silentFallback = _2 === void 0 ? false : _2,
|
|
14819
|
+
_3 = _a.mergeAVStreams,
|
|
14820
|
+
mergeAVStreams = _3 === void 0 ? false : _3,
|
|
14821
|
+
_4 = _a.assets,
|
|
14822
|
+
assets = _4 === void 0 ? {} : _4,
|
|
14823
|
+
_5 = _a.classNames,
|
|
14824
|
+
classNames = _5 === void 0 ? {} : _5,
|
|
14825
|
+
_6 = _a.colors,
|
|
14826
|
+
colors = _6 === void 0 ? {} : _6,
|
|
14827
|
+
_7 = _a.verbiage,
|
|
14828
|
+
verbiage = _7 === void 0 ? {} : _7,
|
|
14829
|
+
_8 = _a.debugMode,
|
|
14830
|
+
debugMode = _8 === void 0 ? false : _8;
|
|
14831
|
+
var _9 = useContext(SubmissionContext),
|
|
14832
|
+
passportImage = _9.passportImage,
|
|
14833
|
+
submissionStatus = _9.submissionStatus,
|
|
14834
|
+
idCaptureVideoUrl = _9.idCaptureVideoUrl,
|
|
14835
|
+
idCaptureVideoAudioUrl = _9.idCaptureVideoAudioUrl,
|
|
14836
|
+
idCaptureVideoIdFrontImage = _9.idCaptureVideoIdFrontImage,
|
|
14837
|
+
idCaptureVideoIdBackImage = _9.idCaptureVideoIdBackImage,
|
|
14838
|
+
setIdCaptureVideoUrl = _9.setIdCaptureVideoUrl,
|
|
14839
|
+
setIdCaptureVideoIdFrontImage = _9.setIdCaptureVideoIdFrontImage,
|
|
14840
|
+
setIdCaptureVideoIdBackImage = _9.setIdCaptureVideoIdBackImage,
|
|
14841
|
+
setIdCaptureVideoAudioUrl = _9.setIdCaptureVideoAudioUrl;
|
|
14842
|
+
var _10 = useState('CAPTURING_ID'),
|
|
14843
|
+
captureState = _10[0],
|
|
14844
|
+
setCaptureState = _10[1];
|
|
14921
14845
|
useEffect(function () {
|
|
14922
14846
|
if (skipIdCapture && captureState === 'CAPTURING_ID') setCaptureState('CHECKING_LIVENESS');
|
|
14923
14847
|
}, [captureState, skipIdCapture]);
|
|
@@ -14948,9 +14872,9 @@ var VideoIdWizard = function VideoIdWizard(_a) {
|
|
|
14948
14872
|
var onVideoCaptureFaceNotDetected = useCallback(function () {
|
|
14949
14873
|
setCaptureState('CHECKING_LIVENESS');
|
|
14950
14874
|
}, []);
|
|
14951
|
-
var
|
|
14952
|
-
attempt =
|
|
14953
|
-
setAttempt =
|
|
14875
|
+
var _11 = useState(0),
|
|
14876
|
+
attempt = _11[0],
|
|
14877
|
+
setAttempt = _11[1];
|
|
14954
14878
|
var userSuppliedExitAfterFailure = onExitAfterFailure !== null && onExitAfterFailure !== void 0 ? onExitAfterFailure : faceLivenessProps.onExitAfterFailure;
|
|
14955
14879
|
var onFaceCaptureExitAfterFailure = useCallback(function (resp, req) {
|
|
14956
14880
|
userSuppliedExitAfterFailure === null || userSuppliedExitAfterFailure === void 0 ? void 0 : userSuppliedExitAfterFailure(resp, req);
|
|
@@ -14996,11 +14920,6 @@ var VideoIdWizard = function VideoIdWizard(_a) {
|
|
|
14996
14920
|
idCardGuideStatus: "disabled"
|
|
14997
14921
|
});
|
|
14998
14922
|
}, [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]);
|
|
14999
|
-
if (submissionStatus === SubmissionStatus.SUBMITTING) {
|
|
15000
|
-
return /*#__PURE__*/React__default.createElement(PageContainer, {
|
|
15001
|
-
className: "flex"
|
|
15002
|
-
}, /*#__PURE__*/React__default.createElement(Spinner, null));
|
|
15003
|
-
}
|
|
15004
14923
|
return /*#__PURE__*/React__default.createElement(CameraStoreProvider, {
|
|
15005
14924
|
preferIphoneContinuityCamera: isCapturingId,
|
|
15006
14925
|
preferFrontFacingCamera: !isCapturingId,
|
|
@@ -15024,11 +14943,9 @@ var VideoIdWizard = function VideoIdWizard(_a) {
|
|
|
15024
14943
|
onModelError: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.onModelError,
|
|
15025
14944
|
modelLoadTimeoutMs: faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.modelLoadTimeoutMs,
|
|
15026
14945
|
requireVerticalFaceCentering: false
|
|
15027
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
15028
|
-
className: "flex ".concat((_k = classNames.container) !== null && _k !== void 0 ? _k : '')
|
|
15029
|
-
}, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
14946
|
+
}, ['CHECKING_LIVENESS', 'CAPTURING_VIDEO'].includes(captureState) && ( /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
15030
14947
|
className: classNames.cameraFeed
|
|
15031
|
-
}), function () {
|
|
14948
|
+
})), function () {
|
|
15032
14949
|
switch (captureState) {
|
|
15033
14950
|
case 'CAPTURING_ID':
|
|
15034
14951
|
return /*#__PURE__*/React__default.createElement(IdCaptureStateProvider, null, /*#__PURE__*/React__default.createElement(GuideOrientationContextProvider, null, /*#__PURE__*/React__default.createElement(IdCaptureWizard, _assign({
|
|
@@ -15118,7 +15035,7 @@ var VideoIdWizard = function VideoIdWizard(_a) {
|
|
|
15118
15035
|
default:
|
|
15119
15036
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null);
|
|
15120
15037
|
}
|
|
15121
|
-
}())))
|
|
15038
|
+
}())));
|
|
15122
15039
|
};
|
|
15123
15040
|
|
|
15124
15041
|
function CompositeWizard(_a) {
|
|
@@ -15244,9 +15161,7 @@ function CompositeWizard(_a) {
|
|
|
15244
15161
|
if (isComplete) {
|
|
15245
15162
|
switch (submissionStatus) {
|
|
15246
15163
|
case SubmissionStatus.SUBMITTING:
|
|
15247
|
-
return /*#__PURE__*/React__default.createElement(
|
|
15248
|
-
className: "flex"
|
|
15249
|
-
}, /*#__PURE__*/React__default.createElement(Spinner, null));
|
|
15164
|
+
return /*#__PURE__*/React__default.createElement(SpinnerPage, null);
|
|
15250
15165
|
case SubmissionStatus.SUBMITTED:
|
|
15251
15166
|
if (debugMode) return /*#__PURE__*/React__default.createElement(SubmissionSuccess, null);
|
|
15252
15167
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null);
|
|
@@ -15556,6 +15471,33 @@ var ThemeProvider = function ThemeProvider(_a) {
|
|
|
15556
15471
|
}, children);
|
|
15557
15472
|
};
|
|
15558
15473
|
|
|
15474
|
+
var SdkPage = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
15475
|
+
var children = _a.children,
|
|
15476
|
+
className = _a.className,
|
|
15477
|
+
_b = _a.heightOffset,
|
|
15478
|
+
heightOffset = _b === void 0 ? 0 : _b,
|
|
15479
|
+
style = _a.style,
|
|
15480
|
+
onClick = _a.onClick;
|
|
15481
|
+
var theme = useTheme();
|
|
15482
|
+
return /*#__PURE__*/React__default.createElement(SdkPageOuter, {
|
|
15483
|
+
ref: ref,
|
|
15484
|
+
style: style,
|
|
15485
|
+
onClick: onClick,
|
|
15486
|
+
className: className,
|
|
15487
|
+
"$heightOffset": heightOffset
|
|
15488
|
+
}, theme.header && /*#__PURE__*/React__default.createElement(theme.header, null), /*#__PURE__*/React__default.createElement(SdkPageInner, null, children), theme.footer && /*#__PURE__*/React__default.createElement(theme.footer, null));
|
|
15489
|
+
});
|
|
15490
|
+
SdkPage.displayName = 'SdkPage';
|
|
15491
|
+
var SdkPageOuter = styled.div.attrs({
|
|
15492
|
+
className: 'sdk-page-outer'
|
|
15493
|
+
})(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n overflow: hidden;\n\n ", "\n\n ", "\n"], ["\n display: flex;\n flex-direction: column;\n overflow: hidden;\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15494
|
+
return props.theme.fontFamily ? "font-family: ".concat(props.theme.fontFamily, ";") : "";
|
|
15495
|
+
}, function (props) {
|
|
15496
|
+
return props.theme.isFullscreen === false ? "" : "\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ";
|
|
15497
|
+
});
|
|
15498
|
+
var SdkPageInner = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n flex: 1;\n position: relative;\n overflow: hidden;\n"], ["\n flex: 1;\n position: relative;\n overflow: hidden;\n"])));
|
|
15499
|
+
var templateObject_1$4, templateObject_2$4;
|
|
15500
|
+
|
|
15559
15501
|
/**
|
|
15560
15502
|
* Render a fullscreen ID capture component that instructs the user to photograph both sides of their ID card, or full page of their passport.
|
|
15561
15503
|
*/
|
|
@@ -15770,6 +15712,8 @@ var IdValidation = function IdValidation(_a) {
|
|
|
15770
15712
|
geolocationEnabled: geolocationEnabled,
|
|
15771
15713
|
geolocationRequired: geolocationRequired,
|
|
15772
15714
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
15715
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
15716
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
15773
15717
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
15774
15718
|
checks: useMemo(function () {
|
|
15775
15719
|
return ['IdCapture'];
|
|
@@ -15783,7 +15727,7 @@ var IdValidation = function IdValidation(_a) {
|
|
|
15783
15727
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
15784
15728
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
15785
15729
|
debugMode: debugMode
|
|
15786
|
-
}))));
|
|
15730
|
+
})))));
|
|
15787
15731
|
};
|
|
15788
15732
|
|
|
15789
15733
|
/** Render a fullscreen capture component that analyzes frames from the user's front-facing camera to determine whether a live human face is present. */
|
|
@@ -15906,6 +15850,8 @@ var FaceValidation = function FaceValidation(_a) {
|
|
|
15906
15850
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks,
|
|
15907
15851
|
estimateAge: estimateAge,
|
|
15908
15852
|
predictGender: predictGender
|
|
15853
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
15854
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
15909
15855
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
15910
15856
|
checks: useMemo(function () {
|
|
15911
15857
|
return ['FaceLiveness'];
|
|
@@ -15914,7 +15860,7 @@ var FaceValidation = function FaceValidation(_a) {
|
|
|
15914
15860
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
15915
15861
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
15916
15862
|
debugMode: debugMode
|
|
15917
|
-
}))));
|
|
15863
|
+
})))));
|
|
15918
15864
|
};
|
|
15919
15865
|
|
|
15920
15866
|
/**
|
|
@@ -16163,6 +16109,8 @@ var IdAndFaceValidation = function IdAndFaceValidation(_a) {
|
|
|
16163
16109
|
geolocationEnabled: geolocationEnabled,
|
|
16164
16110
|
geolocationRequired: geolocationRequired,
|
|
16165
16111
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
16112
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
16113
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
16166
16114
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
16167
16115
|
checks: checks,
|
|
16168
16116
|
idCaptureProps: idCaptureProps,
|
|
@@ -16175,7 +16123,7 @@ var IdAndFaceValidation = function IdAndFaceValidation(_a) {
|
|
|
16175
16123
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
16176
16124
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
16177
16125
|
debugMode: debugMode
|
|
16178
|
-
}))));
|
|
16126
|
+
})))));
|
|
16179
16127
|
};
|
|
16180
16128
|
|
|
16181
16129
|
/**
|
|
@@ -16448,6 +16396,8 @@ var CustomerIdAndBiometricsEnrollment = function CustomerIdAndBiometricsEnrollme
|
|
|
16448
16396
|
geolocationEnabled: geolocationEnabled,
|
|
16449
16397
|
geolocationRequired: geolocationRequired,
|
|
16450
16398
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
16399
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
16400
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
16451
16401
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
16452
16402
|
checks: checks,
|
|
16453
16403
|
idCaptureProps: idCaptureProps,
|
|
@@ -16461,7 +16411,7 @@ var CustomerIdAndBiometricsEnrollment = function CustomerIdAndBiometricsEnrollme
|
|
|
16461
16411
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
16462
16412
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
16463
16413
|
debugMode: debugMode
|
|
16464
|
-
}))));
|
|
16414
|
+
})))));
|
|
16465
16415
|
};
|
|
16466
16416
|
|
|
16467
16417
|
var ALLOWED_RETRIES$3 = 0;
|
|
@@ -16704,8 +16654,8 @@ var CustomerVerificationSuccess = function CustomerVerificationSuccess(_a) {
|
|
|
16704
16654
|
}, verbiage.doneBtnText))));
|
|
16705
16655
|
};
|
|
16706
16656
|
var Heading$3 = styled.h3(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
16707
|
-
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"])));
|
|
16708
|
-
var StyledButtonsRow$3 = styled(ButtonsRow)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
16657
|
+
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"])));
|
|
16658
|
+
var StyledButtonsRow$3 = styled(ButtonsRow$2)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
16709
16659
|
var templateObject_1$3, templateObject_2$3, templateObject_3$3;
|
|
16710
16660
|
|
|
16711
16661
|
var CustomerVerificationFailure = function CustomerVerificationFailure(_a) {
|
|
@@ -16756,13 +16706,12 @@ var CustomerVerificationFailure = function CustomerVerificationFailure(_a) {
|
|
|
16756
16706
|
}, verbiage.exitBtnText))));
|
|
16757
16707
|
};
|
|
16758
16708
|
var Heading$2 = styled.h3(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
16759
|
-
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"])));
|
|
16760
|
-
var StyledButtonsRow$2 = styled(ButtonsRow)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
16709
|
+
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"])));
|
|
16710
|
+
var StyledButtonsRow$2 = styled(ButtonsRow$2)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
16761
16711
|
var templateObject_1$2, templateObject_2$2, templateObject_3$2;
|
|
16762
16712
|
|
|
16763
16713
|
var ALLOWED_RETRIES$2 = 2;
|
|
16764
16714
|
var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
16765
|
-
var _b;
|
|
16766
16715
|
var onComplete = _a.onComplete,
|
|
16767
16716
|
onCustomerMatched = _a.onCustomerMatched,
|
|
16768
16717
|
onCustomerNotMatched = _a.onCustomerNotMatched,
|
|
@@ -16771,33 +16720,33 @@ var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
|
16771
16720
|
onUserCancel = _a.onUserCancel,
|
|
16772
16721
|
onCaptureGuidanceTimeout = _a.onCaptureGuidanceTimeout,
|
|
16773
16722
|
captureGuidanceTimeoutDurationMs = _a.captureGuidanceTimeoutDurationMs,
|
|
16774
|
-
|
|
16775
|
-
skipSuccessScreen =
|
|
16776
|
-
|
|
16777
|
-
loadingOverlayMode =
|
|
16778
|
-
|
|
16779
|
-
assets =
|
|
16780
|
-
|
|
16781
|
-
classNames =
|
|
16782
|
-
|
|
16783
|
-
colors =
|
|
16784
|
-
|
|
16785
|
-
verbiage =
|
|
16786
|
-
|
|
16787
|
-
debugMode =
|
|
16788
|
-
var
|
|
16789
|
-
submissionRequest =
|
|
16790
|
-
submissionResponse =
|
|
16791
|
-
selfieImage =
|
|
16792
|
-
var
|
|
16793
|
-
captureState =
|
|
16794
|
-
setCaptureState =
|
|
16795
|
-
var
|
|
16796
|
-
cameraAccessDenied =
|
|
16797
|
-
releaseCameraAccess =
|
|
16798
|
-
var
|
|
16799
|
-
start =
|
|
16800
|
-
stop =
|
|
16723
|
+
_b = _a.skipSuccessScreen,
|
|
16724
|
+
skipSuccessScreen = _b === void 0 ? false : _b,
|
|
16725
|
+
_c = _a.loadingOverlayMode,
|
|
16726
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
16727
|
+
_d = _a.assets,
|
|
16728
|
+
assets = _d === void 0 ? {} : _d,
|
|
16729
|
+
_e = _a.classNames,
|
|
16730
|
+
classNames = _e === void 0 ? {} : _e,
|
|
16731
|
+
_f = _a.colors,
|
|
16732
|
+
colors = _f === void 0 ? {} : _f,
|
|
16733
|
+
_g = _a.verbiage,
|
|
16734
|
+
verbiage = _g === void 0 ? {} : _g,
|
|
16735
|
+
_h = _a.debugMode,
|
|
16736
|
+
debugMode = _h === void 0 ? false : _h;
|
|
16737
|
+
var _j = useContext(SubmissionContext),
|
|
16738
|
+
submissionRequest = _j.submissionRequest,
|
|
16739
|
+
submissionResponse = _j.submissionResponse,
|
|
16740
|
+
selfieImage = _j.selfieImage;
|
|
16741
|
+
var _k = useState('LOADING'),
|
|
16742
|
+
captureState = _k[0],
|
|
16743
|
+
setCaptureState = _k[1];
|
|
16744
|
+
var _l = useCameraStore(),
|
|
16745
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
16746
|
+
releaseCameraAccess = _l.releaseCameraAccess;
|
|
16747
|
+
var _m = useContext(SelfieGuidanceModelsContext),
|
|
16748
|
+
start = _m.start,
|
|
16749
|
+
stop = _m.stop;
|
|
16801
16750
|
useEffect(function () {
|
|
16802
16751
|
if (captureState !== 'CAPTURING') return;
|
|
16803
16752
|
start();
|
|
@@ -16827,9 +16776,9 @@ var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
|
16827
16776
|
setCaptureState('FAILED');
|
|
16828
16777
|
onCaptureGuidanceTimeout === null || onCaptureGuidanceTimeout === void 0 ? void 0 : onCaptureGuidanceTimeout();
|
|
16829
16778
|
}, [onCaptureGuidanceTimeout]);
|
|
16830
|
-
var
|
|
16831
|
-
attempt =
|
|
16832
|
-
setAttempt =
|
|
16779
|
+
var _o = useState(0),
|
|
16780
|
+
attempt = _o[0],
|
|
16781
|
+
setAttempt = _o[1];
|
|
16833
16782
|
var onExitCallback = useCallback(function () {
|
|
16834
16783
|
setAttempt(function (n) {
|
|
16835
16784
|
return n + 1;
|
|
@@ -16850,9 +16799,7 @@ var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
|
16850
16799
|
setCaptureState('LOADING');
|
|
16851
16800
|
}
|
|
16852
16801
|
}, [cameraAccessDenied]);
|
|
16853
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(
|
|
16854
|
-
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
16855
|
-
}, /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
16802
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
16856
16803
|
className: classNames.cameraFeed
|
|
16857
16804
|
}), captureState !== 'LOADING' && function () {
|
|
16858
16805
|
switch (captureState) {
|
|
@@ -16903,7 +16850,7 @@ var CustomerVerificationWizard = function CustomerVerificationWizard(_a) {
|
|
|
16903
16850
|
default:
|
|
16904
16851
|
return null;
|
|
16905
16852
|
}
|
|
16906
|
-
}()
|
|
16853
|
+
}(), /*#__PURE__*/React__default.createElement(SelfieCaptureLoadingOverlay, {
|
|
16907
16854
|
key: attempt,
|
|
16908
16855
|
mode: loadingOverlayMode,
|
|
16909
16856
|
assets: assets.loadingOverlay,
|
|
@@ -17019,6 +16966,8 @@ var CustomerVerification = function CustomerVerification(_a) {
|
|
|
17019
16966
|
autoStart: false,
|
|
17020
16967
|
onModelError: onModelError,
|
|
17021
16968
|
modelLoadTimeoutMs: modelLoadTimeoutMs
|
|
16969
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
16970
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
17022
16971
|
}, /*#__PURE__*/React__default.createElement(CustomerVerificationWizard, {
|
|
17023
16972
|
onComplete: onComplete,
|
|
17024
16973
|
onCustomerMatched: onCustomerMatched,
|
|
@@ -17034,7 +16983,7 @@ var CustomerVerification = function CustomerVerification(_a) {
|
|
|
17034
16983
|
colors: colors,
|
|
17035
16984
|
verbiage: verbiage,
|
|
17036
16985
|
debugMode: debugMode
|
|
17037
|
-
}))))));
|
|
16986
|
+
})))))));
|
|
17038
16987
|
};
|
|
17039
16988
|
|
|
17040
16989
|
var ALLOWED_RETRIES$1 = 0;
|
|
@@ -17275,8 +17224,8 @@ var CustomerIdentificationSuccess = function CustomerIdentificationSuccess(_a) {
|
|
|
17275
17224
|
}, verbiage.doneBtnText))));
|
|
17276
17225
|
};
|
|
17277
17226
|
var Heading$1 = styled.h3(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
17278
|
-
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"])));
|
|
17279
|
-
var StyledButtonsRow$1 = styled(ButtonsRow)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
17227
|
+
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"])));
|
|
17228
|
+
var StyledButtonsRow$1 = styled(ButtonsRow$2)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
17280
17229
|
var templateObject_1$1, templateObject_2$1, templateObject_3$1;
|
|
17281
17230
|
|
|
17282
17231
|
var CustomerIdentificationFailure = function CustomerIdentificationFailure(_a) {
|
|
@@ -17327,13 +17276,12 @@ var CustomerIdentificationFailure = function CustomerIdentificationFailure(_a) {
|
|
|
17327
17276
|
}, verbiage.exitBtnText))));
|
|
17328
17277
|
};
|
|
17329
17278
|
var Heading = styled.h3(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
17330
|
-
var ImageContainer = styled(ButtonsRow)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
17331
|
-
var StyledButtonsRow = styled(ButtonsRow)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
17279
|
+
var ImageContainer = styled(ButtonsRow$2)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
17280
|
+
var StyledButtonsRow = styled(ButtonsRow$2)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
17332
17281
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
17333
17282
|
|
|
17334
17283
|
var ALLOWED_RETRIES = 2;
|
|
17335
17284
|
var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
17336
|
-
var _b;
|
|
17337
17285
|
var onComplete = _a.onComplete,
|
|
17338
17286
|
onCustomerMatched = _a.onCustomerMatched,
|
|
17339
17287
|
onCustomerNotMatched = _a.onCustomerNotMatched,
|
|
@@ -17342,33 +17290,33 @@ var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
|
17342
17290
|
onUserCancel = _a.onUserCancel,
|
|
17343
17291
|
onCaptureGuidanceTimeout = _a.onCaptureGuidanceTimeout,
|
|
17344
17292
|
captureGuidanceTimeoutDurationMs = _a.captureGuidanceTimeoutDurationMs,
|
|
17345
|
-
|
|
17346
|
-
skipSuccessScreen =
|
|
17347
|
-
|
|
17348
|
-
loadingOverlayMode =
|
|
17349
|
-
|
|
17350
|
-
assets =
|
|
17351
|
-
|
|
17352
|
-
classNames =
|
|
17353
|
-
|
|
17354
|
-
colors =
|
|
17355
|
-
|
|
17356
|
-
verbiage =
|
|
17357
|
-
|
|
17358
|
-
debugMode =
|
|
17359
|
-
var
|
|
17360
|
-
submissionResponse =
|
|
17361
|
-
submissionRequest =
|
|
17362
|
-
selfieImage =
|
|
17363
|
-
var
|
|
17364
|
-
captureState =
|
|
17365
|
-
setCaptureState =
|
|
17366
|
-
var
|
|
17367
|
-
cameraAccessDenied =
|
|
17368
|
-
releaseCameraAccess =
|
|
17369
|
-
var
|
|
17370
|
-
start =
|
|
17371
|
-
stop =
|
|
17293
|
+
_b = _a.skipSuccessScreen,
|
|
17294
|
+
skipSuccessScreen = _b === void 0 ? false : _b,
|
|
17295
|
+
_c = _a.loadingOverlayMode,
|
|
17296
|
+
loadingOverlayMode = _c === void 0 ? 'default' : _c,
|
|
17297
|
+
_d = _a.assets,
|
|
17298
|
+
assets = _d === void 0 ? {} : _d,
|
|
17299
|
+
_e = _a.classNames,
|
|
17300
|
+
classNames = _e === void 0 ? {} : _e,
|
|
17301
|
+
_f = _a.colors,
|
|
17302
|
+
colors = _f === void 0 ? {} : _f,
|
|
17303
|
+
_g = _a.verbiage,
|
|
17304
|
+
verbiage = _g === void 0 ? {} : _g,
|
|
17305
|
+
_h = _a.debugMode,
|
|
17306
|
+
debugMode = _h === void 0 ? false : _h;
|
|
17307
|
+
var _j = useContext(SubmissionContext),
|
|
17308
|
+
submissionResponse = _j.submissionResponse,
|
|
17309
|
+
submissionRequest = _j.submissionRequest,
|
|
17310
|
+
selfieImage = _j.selfieImage;
|
|
17311
|
+
var _k = useState('LOADING'),
|
|
17312
|
+
captureState = _k[0],
|
|
17313
|
+
setCaptureState = _k[1];
|
|
17314
|
+
var _l = useCameraStore(),
|
|
17315
|
+
cameraAccessDenied = _l.cameraAccessDenied,
|
|
17316
|
+
releaseCameraAccess = _l.releaseCameraAccess;
|
|
17317
|
+
var _m = useContext(SelfieGuidanceModelsContext),
|
|
17318
|
+
start = _m.start,
|
|
17319
|
+
stop = _m.stop;
|
|
17372
17320
|
useEffect(function () {
|
|
17373
17321
|
if (captureState !== 'CAPTURING') return;
|
|
17374
17322
|
start();
|
|
@@ -17398,9 +17346,9 @@ var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
|
17398
17346
|
setCaptureState('FAILED');
|
|
17399
17347
|
onCaptureGuidanceTimeout === null || onCaptureGuidanceTimeout === void 0 ? void 0 : onCaptureGuidanceTimeout();
|
|
17400
17348
|
}, [onCaptureGuidanceTimeout]);
|
|
17401
|
-
var
|
|
17402
|
-
attempt =
|
|
17403
|
-
setAttempt =
|
|
17349
|
+
var _o = useState(0),
|
|
17350
|
+
attempt = _o[0],
|
|
17351
|
+
setAttempt = _o[1];
|
|
17404
17352
|
var onExitCallback = useCallback(function () {
|
|
17405
17353
|
setAttempt(function (n) {
|
|
17406
17354
|
return n + 1;
|
|
@@ -17421,9 +17369,7 @@ var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
|
17421
17369
|
setCaptureState('LOADING');
|
|
17422
17370
|
}
|
|
17423
17371
|
}, [cameraAccessDenied]);
|
|
17424
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(
|
|
17425
|
-
className: "flex ".concat((_b = classNames.container) !== null && _b !== void 0 ? _b : '')
|
|
17426
|
-
}, /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
17372
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(CameraVideoTag, {
|
|
17427
17373
|
className: classNames.cameraFeed
|
|
17428
17374
|
}), captureState !== 'LOADING' && function () {
|
|
17429
17375
|
switch (captureState) {
|
|
@@ -17474,7 +17420,7 @@ var CustomerIdentificationWizard = function CustomerIdentificationWizard(_a) {
|
|
|
17474
17420
|
default:
|
|
17475
17421
|
return null;
|
|
17476
17422
|
}
|
|
17477
|
-
}()
|
|
17423
|
+
}(), /*#__PURE__*/React__default.createElement(SelfieCaptureLoadingOverlay, {
|
|
17478
17424
|
key: attempt,
|
|
17479
17425
|
mode: loadingOverlayMode,
|
|
17480
17426
|
assets: assets.loadingOverlay,
|
|
@@ -17588,6 +17534,8 @@ var CustomerIdentification = function CustomerIdentification(_a) {
|
|
|
17588
17534
|
autoStart: false,
|
|
17589
17535
|
modelLoadTimeoutMs: modelLoadTimeoutMs,
|
|
17590
17536
|
onModelError: onModelError
|
|
17537
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
17538
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
17591
17539
|
}, /*#__PURE__*/React__default.createElement(CustomerIdentificationWizard, {
|
|
17592
17540
|
onComplete: onComplete,
|
|
17593
17541
|
onCustomerMatched: onCustomerMatched,
|
|
@@ -17604,7 +17552,7 @@ var CustomerIdentification = function CustomerIdentification(_a) {
|
|
|
17604
17552
|
colors: colors,
|
|
17605
17553
|
verbiage: verbiage,
|
|
17606
17554
|
debugMode: debugMode
|
|
17607
|
-
}))))));
|
|
17555
|
+
})))))));
|
|
17608
17556
|
};
|
|
17609
17557
|
|
|
17610
17558
|
/** Render a fullscreen capture component that captures a video of the user signing the screen. */
|
|
@@ -17686,6 +17634,8 @@ var SignatureKYC = function SignatureKYC(_a) {
|
|
|
17686
17634
|
geolocationEnabled: geolocationEnabled,
|
|
17687
17635
|
geolocationRequired: geolocationRequired,
|
|
17688
17636
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
17637
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
17638
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
17689
17639
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
17690
17640
|
debugMode: debugMode,
|
|
17691
17641
|
checks: useMemo(function () {
|
|
@@ -17713,7 +17663,7 @@ var SignatureKYC = function SignatureKYC(_a) {
|
|
|
17713
17663
|
onUserCancel: onUserCancel
|
|
17714
17664
|
};
|
|
17715
17665
|
}, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
|
|
17716
|
-
}))));
|
|
17666
|
+
})))));
|
|
17717
17667
|
};
|
|
17718
17668
|
|
|
17719
17669
|
/**
|
|
@@ -17935,6 +17885,8 @@ var VideoIdValidation = function VideoIdValidation(_a) {
|
|
|
17935
17885
|
geolocationEnabled: geolocationEnabled,
|
|
17936
17886
|
geolocationRequired: geolocationRequired,
|
|
17937
17887
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
17888
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
17889
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
17938
17890
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
17939
17891
|
checks: useMemo(function () {
|
|
17940
17892
|
return ['VideoIdCapture'];
|
|
@@ -17949,7 +17901,7 @@ var VideoIdValidation = function VideoIdValidation(_a) {
|
|
|
17949
17901
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
17950
17902
|
onMicrophoneAccessDenied: onMicrophoneAccessDenied,
|
|
17951
17903
|
debugMode: debugMode
|
|
17952
|
-
}))));
|
|
17904
|
+
})))));
|
|
17953
17905
|
};
|
|
17954
17906
|
|
|
17955
17907
|
/** 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. */
|
|
@@ -18113,6 +18065,8 @@ var CustomerBiometricsEnrollment = function CustomerBiometricsEnrollment(_a) {
|
|
|
18113
18065
|
geolocationEnabled: geolocationEnabled,
|
|
18114
18066
|
geolocationRequired: geolocationRequired,
|
|
18115
18067
|
useDocumentServiceForLivenessChecks: useDocumentServiceForLivenessChecks
|
|
18068
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
18069
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
18116
18070
|
}, /*#__PURE__*/React__default.createElement(CompositeWizard, {
|
|
18117
18071
|
checks: useMemo(function () {
|
|
18118
18072
|
return ['FaceLiveness'];
|
|
@@ -18126,7 +18080,7 @@ var CustomerBiometricsEnrollment = function CustomerBiometricsEnrollment(_a) {
|
|
|
18126
18080
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
18127
18081
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
18128
18082
|
debugMode: debugMode
|
|
18129
|
-
}))));
|
|
18083
|
+
})))));
|
|
18130
18084
|
};
|
|
18131
18085
|
|
|
18132
18086
|
/**
|
|
@@ -18199,6 +18153,8 @@ var DocumentCapture = function DocumentCapture(_a) {
|
|
|
18199
18153
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
18200
18154
|
classNames: classNames === null || classNames === void 0 ? void 0 : classNames.cameraStoreProvider,
|
|
18201
18155
|
verbiage: verbiage === null || verbiage === void 0 ? void 0 : verbiage.cameraStoreProvider
|
|
18156
|
+
}, /*#__PURE__*/React__default.createElement(SdkPage, {
|
|
18157
|
+
className: classNames === null || classNames === void 0 ? void 0 : classNames.container
|
|
18202
18158
|
}, /*#__PURE__*/React__default.createElement(DocumentCaptureWizard, {
|
|
18203
18159
|
onSuccess: onComplete,
|
|
18204
18160
|
onExitCapture: onExitCapture,
|
|
@@ -18209,7 +18165,7 @@ var DocumentCapture = function DocumentCapture(_a) {
|
|
|
18209
18165
|
instructions: instructions,
|
|
18210
18166
|
classNames: classNames,
|
|
18211
18167
|
verbiage: verbiage
|
|
18212
|
-
})))));
|
|
18168
|
+
}))))));
|
|
18213
18169
|
};
|
|
18214
18170
|
|
|
18215
18171
|
initializeI18n();
|