idmission-web-sdk 2.3.2 → 2.3.4
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/common/debug.d.ts +1 -3
- package/dist/components/common/debug.d.ts.map +1 -1
- package/dist/components/common/signature.d.ts.map +1 -1
- package/dist/components/customer_flows/SignatureKYC.d.ts +5 -1
- package/dist/components/customer_flows/SignatureKYC.d.ts.map +1 -1
- package/dist/components/face_liveness/FaceLivenessWizard.d.ts +2 -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/selfie_capture/SelfieCapture.d.ts.map +1 -1
- package/dist/components/selfie_capture/SelfieGuidanceModelsProvider.d.ts.map +1 -1
- package/dist/components/video_id/IdVideoCapture.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts +3 -1
- package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureGuides.d.ts +7 -2
- package/dist/components/video_signature_capture/VideoSignatureGuides.d.ts.map +1 -1
- package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts +4 -2
- package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts.map +1 -1
- package/dist/lib/camera/cameraStore.d.ts +2 -0
- package/dist/lib/camera/cameraStore.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +482 -378
- 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 +482 -378
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +482 -378
- 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 +6 -0
- package/dist/themes/index.d.ts.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +1 -1
|
@@ -211,7 +211,7 @@
|
|
|
211
211
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
212
212
|
};
|
|
213
213
|
|
|
214
|
-
var webSdkVersion = '2.3.
|
|
214
|
+
var webSdkVersion = '2.3.4';
|
|
215
215
|
|
|
216
216
|
function getPlatform() {
|
|
217
217
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -431,18 +431,18 @@
|
|
|
431
431
|
className: "ladda-label"
|
|
432
432
|
}, children));
|
|
433
433
|
};
|
|
434
|
-
var StyledButton = styled.button(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"], ["\n ", "\n\n /*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n */\n\n position: relative;\n\n .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n }\n .ladda-label {\n position: relative;\n z-index: 3;\n }\n .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n display: none;\n transition: 0.1s linear all !important;\n }\n &[data-loading] .ladda-progress {\n display: block;\n }\n\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n\n .ladda-spinner,\n .ladda-label {\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n }\n &[data-style='zoom-in'],\n &[data-style='zoom-in'] .ladda-spinner,\n &[data-style='zoom-in'] .ladda-label,\n &[data-style='zoom-out'],\n &[data-style='zoom-out'] .ladda-spinner,\n &[data-style='zoom-out'] .ladda-label {\n transition: 0.3s ease all !important;\n }\n &[data-style='expand-right'] .ladda-spinner {\n right: -6px;\n }\n &[data-style='expand-right'][data-size='s'] .ladda-spinner,\n &[data-style='expand-right'][data-size='xs'] .ladda-spinner {\n right: -12px;\n }\n &[data-style='expand-right'][data-loading] {\n padding-right: 56px;\n }\n &[data-style='expand-right'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-right'][data-loading][data-size='s'],\n &[data-style='expand-right'][data-loading][data-size='xs'] {\n padding-right: 40px;\n }\n &[data-style='expand-left'] .ladda-spinner {\n left: 26px;\n }\n &[data-style='expand-left'][data-size='s'] .ladda-spinner,\n &[data-style='expand-left'][data-size='xs'] .ladda-spinner {\n left: 4px;\n }\n &[data-style='expand-left'][data-loading] {\n padding-left: 56px;\n }\n &[data-style='expand-left'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-left'][data-loading][data-size='s'],\n &[data-style='expand-left'][data-loading][data-size='xs'] {\n padding-left: 40px;\n }\n &[data-style='expand-up'] {\n overflow: hidden;\n }\n &[data-style='expand-up'] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-up'][data-loading] {\n padding-top: 54px;\n }\n &[data-style='expand-up'][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n }\n &[data-style='expand-up'][data-loading][data-size='s'],\n &[data-style='expand-up'][data-loading][data-size='xs'] {\n padding-top: 32px;\n }\n &[data-style='expand-up'][data-loading][data-size='s'] .ladda-spinner,\n &[data-style='expand-up'][data-loading][data-size='xs'] .ladda-spinner {\n top: 4px;\n }\n &[data-style='expand-down'] {\n overflow: hidden;\n }\n &[data-style='expand-down'] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n }\n &[data-style='expand-down'][data-size='s'] .ladda-spinner,\n &[data-style='expand-down'][data-size='xs'] .ladda-spinner {\n top: 40px;\n }\n &[data-style='expand-down'][data-loading] {\n padding-bottom: 54px;\n }\n &[data-style='expand-down'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='expand-down'][data-loading][data-size='s'],\n &[data-style='expand-down'][data-loading][data-size='xs'] {\n padding-bottom: 32px;\n }\n &[data-style='slide-left'] {\n overflow: hidden;\n }\n &[data-style='slide-left'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-left'] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n }\n &[data-style='slide-left'][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n }\n &[data-style='slide-left'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-right'] {\n overflow: hidden;\n }\n &[data-style='slide-right'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-right'] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n }\n [dir='rtl'] &[data-style='slide-right'] .ladda-spinner {\n right: auto;\n }\n &[data-style='slide-right'][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n }\n &[data-style='slide-right'][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n }\n &[data-style='slide-up'] {\n overflow: hidden;\n }\n &[data-style='slide-up'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-up'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n }\n &[data-style='slide-up'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='slide-down'] {\n overflow: hidden;\n }\n &[data-style='slide-down'] .ladda-label {\n position: relative;\n }\n &[data-style='slide-down'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n }\n &[data-style='slide-down'][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n }\n &[data-style='slide-down'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n }\n &[data-style='zoom-out'] {\n overflow: hidden;\n }\n &[data-style='zoom-out'] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n transform: scale(2.5);\n }\n &[data-style='zoom-out'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-out'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(0.5);\n }\n &[data-style='zoom-out'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='zoom-in'] {\n overflow: hidden;\n }\n &[data-style='zoom-in'] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n transform: scale(0.2);\n }\n &[data-style='zoom-in'] .ladda-label {\n position: relative;\n display: inline-block;\n }\n &[data-style='zoom-in'][data-loading] .ladda-label {\n opacity: 0;\n transform: scale(2.2);\n }\n &[data-style='zoom-in'][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n transform: none;\n }\n &[data-style='contract'] {\n overflow: hidden;\n width: 100px;\n }\n &[data-style='contract'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract'][data-loading] {\n border-radius: 50%;\n width: 52px;\n }\n &[data-style='contract'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n &[data-style='contract-overlay'] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0);\n }\n &[data-style='contract-overlay'] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n }\n &[data-style='contract-overlay'][data-loading] {\n border-radius: 50%;\n width: 52px;\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n }\n &[data-style='contract-overlay'][data-loading] .ladda-label {\n opacity: 0;\n }\n &[data-style='contract-overlay'][data-loading] .ladda-spinner {\n opacity: 1;\n }\n [dir='rtl'] .ladda-spinner > div {\n left: 25% !important;\n }\n"])), function (props) {
|
|
434
|
+
var StyledButton = styled.button(templateObject_1$Q || (templateObject_1$Q = __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) {
|
|
435
435
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
436
436
|
return ((_a = props.theme.buttons) === null || _a === void 0 ? void 0 : _a.style) === 'bootstrap' && "\n border-radius: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n text-transform: none;\n -webkit-appearance: button;\n \n &:not(:disabled),\n &[type='button']:not(:disabled),\n &[type='reset']:not(:disabled),\n &[type='submit']:not(:disabled) {\n cursor: pointer;\n }\n \n &:focus:not(:focus-visible) {\n outline: 0;\n }\n \n --bs-btn-padding-x: 0.75rem;\n --bs-btn-padding-y: 0.375rem;\n --bs-btn-font-family: ;\n --bs-btn-font-size: 1rem;\n --bs-btn-font-weight: 400;\n --bs-btn-line-height: 1.5;\n --bs-btn-color: var(--bs-body-color);\n --bs-btn-bg: transparent;\n --bs-btn-border-width: var(--bs-border-width);\n --bs-btn-border-color: transparent;\n --bs-btn-border-radius: var(--bs-border-radius);\n --bs-btn-hover-border-color: transparent;\n --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15),\n 0 1px 1px rgba(0, 0, 0, 0.075);\n --bs-btn-disabled-opacity: 0.65;\n --bs-btn-focus-box-shadow: 0 0 0 0.25rem\n rgba(var(--bs-btn-focus-shadow-rgb), 0.5);\n display: inline-block;\n padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);\n font-family: var(--bs-btn-font-family);\n font-size: var(--bs-btn-font-size);\n font-weight: var(--bs-btn-font-weight);\n line-height: var(--bs-btn-line-height);\n color: var(--bs-btn-color);\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);\n border-radius: var(--bs-btn-border-radius);\n background-color: var(--bs-btn-bg);\n //transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,\n // border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n \n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n \n &:hover {\n filter: brightness(1.15);\n }\n \n &:focus-visible {\n color: var(--bs-btn-hover-color);\n background-color: var(--bs-btn-hover-bg);\n border-color: var(--bs-btn-hover-border-color);\n outline: 0;\n box-shadow: var(--bs-btn-focus-box-shadow);\n }\n \n &:disabled,\n &.disabled,\n fieldset:disabled & {\n color: var(--bs-btn-disabled-color);\n pointer-events: none;\n background-color: var(--bs-btn-disabled-bg);\n border-color: var(--bs-btn-disabled-border-color);\n opacity: var(--bs-btn-disabled-opacity);\n }\n \n --bs-btn-color: ".concat((_f = (_b = props.$textColor) !== null && _b !== void 0 ? _b : (_e = (_c = props.theme.buttons) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'primary']) === null || _e === void 0 ? void 0 : _e.textColor) !== null && _f !== void 0 ? _f : '#fff', ";\n --bs-btn-bg: ").concat((_l = (_g = props.$backgroundColor) !== null && _g !== void 0 ? _g : (_k = (_h = props.theme.buttons) === null || _h === void 0 ? void 0 : _h[(_j = props.$variant) !== null && _j !== void 0 ? _j : 'primary']) === null || _k === void 0 ? void 0 : _k.backgroundColor) !== null && _l !== void 0 ? _l : '#0d6efd', ";\n --bs-btn-border-color: var(--bs-btn-bg);\n --bs-btn-focus-shadow-rgb: 49, 132, 253;\n --bs-btn-active-color: #fff;\n --bs-btn-active-bg: #0a58ca;\n --bs-btn-active-border-color: #0a53be;\n --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);\n --bs-btn-disabled-color: ").concat((_q = (_m = props.$disabledTextColor) !== null && _m !== void 0 ? _m : (_p = (_o = props.theme.buttons) === null || _o === void 0 ? void 0 : _o.loading) === null || _p === void 0 ? void 0 : _p.textColor) !== null && _q !== void 0 ? _q : '#fff', ";\n --bs-btn-disabled-bg: ").concat((_u = (_r = props.$disabledBackgroundColor) !== null && _r !== void 0 ? _r : (_t = (_s = props.theme.buttons) === null || _s === void 0 ? void 0 : _s.loading) === null || _t === void 0 ? void 0 : _t.backgroundColor) !== null && _u !== void 0 ? _u : 'gray', ";\n --bs-btn-disabled-border-color: ").concat((_v = props.$disabledBackgroundColor) !== null && _v !== void 0 ? _v : '#0d6efd', ";\n \n --bs-btn-padding-y: 14px;\n --bs-btn-padding-x: 1rem;\n --bs-btn-font-size: 18px;\n --bs-btn-border-radius: 4px;\n ");
|
|
437
437
|
});
|
|
438
|
-
var templateObject_1$
|
|
438
|
+
var templateObject_1$Q;
|
|
439
439
|
|
|
440
|
-
var ButtonsRow$2 = styled.div(templateObject_1$
|
|
441
|
-
var templateObject_1$
|
|
440
|
+
var ButtonsRow$2 = styled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n display: flex;\n gap: 0 15px;\n justify-content: center;\n text-align: left;\n"], ["\n display: flex;\n gap: 0 15px;\n justify-content: center;\n text-align: left;\n"])));
|
|
441
|
+
var templateObject_1$P;
|
|
442
442
|
|
|
443
|
-
var GuidanceMessageContainerDiv = styled.div(templateObject_1$
|
|
443
|
+
var GuidanceMessageContainerDiv = styled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"])), function (_a) {
|
|
444
444
|
var $top = _a.$top;
|
|
445
|
-
return $top !== null && $top !== void 0 ? $top : '
|
|
445
|
+
return $top !== null && $top !== void 0 ? $top : '10%';
|
|
446
446
|
}, function (_a) {
|
|
447
447
|
var $bottom = _a.$bottom;
|
|
448
448
|
return $bottom ? "bottom: ".concat($bottom, ";") : "";
|
|
@@ -460,15 +460,15 @@
|
|
|
460
460
|
var _a, _b, _c, _d, _e, _f;
|
|
461
461
|
return (_f = (_a = props.$textColor) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.textColor) !== null && _f !== void 0 ? _f : 'black';
|
|
462
462
|
});
|
|
463
|
-
var templateObject_1$
|
|
463
|
+
var templateObject_1$O, templateObject_2$F;
|
|
464
464
|
|
|
465
|
-
var wavesAnimation = styled.keyframes(templateObject_1$
|
|
465
|
+
var wavesAnimation = styled.keyframes(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"], ["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"])));
|
|
466
466
|
var progressBarAnimation = styled.keyframes(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"], ["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"])));
|
|
467
467
|
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"], ["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"])));
|
|
468
468
|
var progressBorderAnimation = styled.keyframes(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
469
|
-
var templateObject_1$
|
|
469
|
+
var templateObject_1$N, templateObject_2$E, templateObject_3$s, templateObject_4$m;
|
|
470
470
|
|
|
471
|
-
var OverlayContainer = styled.div(templateObject_1$
|
|
471
|
+
var OverlayContainer = styled.div(templateObject_1$M || (templateObject_1$M = __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) {
|
|
472
472
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
473
473
|
}, function (props) {
|
|
474
474
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
@@ -484,7 +484,7 @@
|
|
|
484
484
|
var GrayOverlayContainer = styled(OverlayContainer)(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
485
485
|
var ButtonsColumn = styled.div(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 15px 0;\n justify-content: center;\n margin-top: 24px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 15px 0;\n justify-content: center;\n margin-top: 24px;\n"])));
|
|
486
486
|
var WideButton = styled(LoaderButton)(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n width: 100%;\n border-radius: 30px;\n"], ["\n width: 100%;\n border-radius: 30px;\n"])));
|
|
487
|
-
var WideBorderButton = styled(WideButton)(templateObject_8$
|
|
487
|
+
var WideBorderButton = styled(WideButton)(templateObject_8$4 || (templateObject_8$4 = __makeTemplateObject(["\n color: ", ";\n background: ", ";\n border: 1px solid\n ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n background: ", ";\n border: 1px solid\n ", ";\n box-sizing: border-box;\n"])), function (props) {
|
|
488
488
|
var _a, _b;
|
|
489
489
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.textColor) !== null && _b !== void 0 ? _b : 'black';
|
|
490
490
|
}, function (props) {
|
|
@@ -513,7 +513,7 @@
|
|
|
513
513
|
var LoadingOverlayLoadingList = styled.ul(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n display: block;\n margin: auto;\n list-style: none;\n padding: 0;\n"], ["\n display: block;\n margin: auto;\n list-style: none;\n padding: 0;\n"])));
|
|
514
514
|
var LoadingOverlayLoadingListItem = styled.li(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"], ["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"])));
|
|
515
515
|
var LoadingOverlayProgressContainer = styled.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
516
|
-
var templateObject_1$
|
|
516
|
+
var templateObject_1$M, templateObject_2$D, templateObject_3$r, templateObject_4$l, templateObject_5$e, templateObject_6$a, templateObject_7$7, templateObject_8$4, 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;
|
|
517
517
|
|
|
518
518
|
function _extends() {
|
|
519
519
|
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
@@ -8040,7 +8040,7 @@
|
|
|
8040
8040
|
return [frameWidth, frameHeight];
|
|
8041
8041
|
}
|
|
8042
8042
|
|
|
8043
|
-
var InvisibleCanvas = styled.canvas(templateObject_1$
|
|
8043
|
+
var InvisibleCanvas = styled.canvas(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
8044
8044
|
function drawToCanvas(canvas, frame, width, height) {
|
|
8045
8045
|
if (!canvas) return;
|
|
8046
8046
|
var ctx = canvas.getContext('2d');
|
|
@@ -8060,7 +8060,7 @@
|
|
|
8060
8060
|
var _a;
|
|
8061
8061
|
(_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas === null || canvas === void 0 ? void 0 : canvas.width, canvas === null || canvas === void 0 ? void 0 : canvas.height);
|
|
8062
8062
|
}
|
|
8063
|
-
var templateObject_1$
|
|
8063
|
+
var templateObject_1$L;
|
|
8064
8064
|
|
|
8065
8065
|
function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
|
|
8066
8066
|
if (quality === void 0) {
|
|
@@ -13461,6 +13461,8 @@
|
|
|
13461
13461
|
videoLoaded: false,
|
|
13462
13462
|
videoStream: null,
|
|
13463
13463
|
videoDevice: null,
|
|
13464
|
+
videoWidth: 0,
|
|
13465
|
+
videoHeight: 0,
|
|
13464
13466
|
isRearFacing: false,
|
|
13465
13467
|
camera: null,
|
|
13466
13468
|
cameraReady: false,
|
|
@@ -13793,25 +13795,26 @@
|
|
|
13793
13795
|
};
|
|
13794
13796
|
var CameraStoreContext = /*#__PURE__*/React.createContext(undefined);
|
|
13795
13797
|
function CameraStoreProvider(_a) {
|
|
13798
|
+
var _b;
|
|
13796
13799
|
var children = _a.children,
|
|
13797
|
-
|
|
13798
|
-
requestAccessAutomatically =
|
|
13799
|
-
|
|
13800
|
-
preferIphoneContinuityCamera =
|
|
13801
|
-
|
|
13802
|
-
preferFrontFacingCamera =
|
|
13803
|
-
|
|
13804
|
-
maxVideoWidth =
|
|
13800
|
+
_c = _a.requestAccessAutomatically,
|
|
13801
|
+
requestAccessAutomatically = _c === void 0 ? true : _c,
|
|
13802
|
+
_d = _a.preferIphoneContinuityCamera,
|
|
13803
|
+
preferIphoneContinuityCamera = _d === void 0 ? true : _d,
|
|
13804
|
+
_e = _a.preferFrontFacingCamera,
|
|
13805
|
+
preferFrontFacingCamera = _e === void 0 ? false : _e,
|
|
13806
|
+
_f = _a.maxVideoWidth,
|
|
13807
|
+
maxVideoWidth = _f === void 0 ? 1920 : _f,
|
|
13805
13808
|
maxFps = _a.maxFps,
|
|
13806
13809
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
13807
13810
|
onCameraTamperingDetected = _a.onCameraTamperingDetected,
|
|
13808
13811
|
onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
|
|
13809
|
-
|
|
13810
|
-
requireMicrophoneAccess =
|
|
13811
|
-
|
|
13812
|
-
classNames =
|
|
13813
|
-
|
|
13814
|
-
verbiage =
|
|
13812
|
+
_g = _a.requireMicrophoneAccess,
|
|
13813
|
+
requireMicrophoneAccess = _g === void 0 ? false : _g,
|
|
13814
|
+
_h = _a.classNames,
|
|
13815
|
+
classNames = _h === void 0 ? {} : _h,
|
|
13816
|
+
_j = _a.verbiage,
|
|
13817
|
+
verbiage = _j === void 0 ? {} : _j;
|
|
13815
13818
|
var videoRef = React.useRef(null);
|
|
13816
13819
|
var store = React.useRef();
|
|
13817
13820
|
store.current || (store.current = createCameraStore({
|
|
@@ -13825,6 +13828,16 @@
|
|
|
13825
13828
|
onMicrophoneAccessDenied: onMicrophoneAccessDenied,
|
|
13826
13829
|
requireMicrophoneAccess: requireMicrophoneAccess
|
|
13827
13830
|
}));
|
|
13831
|
+
var _k = (_b = videoRef.current) !== null && _b !== void 0 ? _b : {},
|
|
13832
|
+
videoWidth = _k.videoWidth,
|
|
13833
|
+
videoHeight = _k.videoHeight;
|
|
13834
|
+
React.useEffect(function () {
|
|
13835
|
+
var _a;
|
|
13836
|
+
(_a = store.current) === null || _a === void 0 ? void 0 : _a.setState({
|
|
13837
|
+
videoWidth: videoWidth,
|
|
13838
|
+
videoHeight: videoHeight
|
|
13839
|
+
});
|
|
13840
|
+
}, [videoWidth, videoHeight]);
|
|
13828
13841
|
React.useEffect(function () {
|
|
13829
13842
|
var _a, _b, _c;
|
|
13830
13843
|
var state = (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState();
|
|
@@ -13890,14 +13903,14 @@
|
|
|
13890
13903
|
className: classNames.message
|
|
13891
13904
|
}, messageText)));
|
|
13892
13905
|
}
|
|
13893
|
-
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$
|
|
13906
|
+
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
13894
13907
|
var StyledOverlayHeading = styled.h3(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
13895
13908
|
function useCameraStore(selector) {
|
|
13896
13909
|
var store = React.useContext(CameraStoreContext);
|
|
13897
13910
|
if (!store) throw new Error('useCameraStore cannot be used without Provider');
|
|
13898
13911
|
return useStore(store, selector);
|
|
13899
13912
|
}
|
|
13900
|
-
var templateObject_1$
|
|
13913
|
+
var templateObject_1$K, templateObject_2$C;
|
|
13901
13914
|
|
|
13902
13915
|
var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
|
|
13903
13916
|
startDocumentDetection: function startDocumentDetection() {
|
|
@@ -15225,8 +15238,8 @@
|
|
|
15225
15238
|
if (!portalLocation) return element;
|
|
15226
15239
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
15227
15240
|
}
|
|
15228
|
-
var DebugStatsPaneDiv = styled.span(templateObject_1$
|
|
15229
|
-
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) {
|
|
15241
|
+
var DebugStatsPaneDiv = styled.span(templateObject_1$J || (templateObject_1$J = __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 pointer-events: none;\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 pointer-events: none;\n"])));
|
|
15242
|
+
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 pointer-events: none;\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 pointer-events: none;\n ", "\n transform-style: preserve-3d;\n"])), function (_a) {
|
|
15230
15243
|
var $flipX = _a.$flipX;
|
|
15231
15244
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
15232
15245
|
});
|
|
@@ -15254,9 +15267,15 @@
|
|
|
15254
15267
|
var _b = _a.enabled,
|
|
15255
15268
|
enabled = _b === void 0 ? true : _b,
|
|
15256
15269
|
pageWidth = _a.pageWidth,
|
|
15257
|
-
pageHeight = _a.pageHeight
|
|
15258
|
-
|
|
15259
|
-
|
|
15270
|
+
pageHeight = _a.pageHeight;
|
|
15271
|
+
var _c = useCameraStore(useShallow(function (state) {
|
|
15272
|
+
return {
|
|
15273
|
+
videoWidth: state.videoWidth,
|
|
15274
|
+
videoHeight: state.videoHeight
|
|
15275
|
+
};
|
|
15276
|
+
})),
|
|
15277
|
+
videoWidth = _c.videoWidth,
|
|
15278
|
+
videoHeight = _c.videoHeight;
|
|
15260
15279
|
return React.useMemo(function () {
|
|
15261
15280
|
var horizontal = false,
|
|
15262
15281
|
scaledWidth = 0,
|
|
@@ -15431,7 +15450,7 @@
|
|
|
15431
15450
|
}
|
|
15432
15451
|
});
|
|
15433
15452
|
}
|
|
15434
|
-
var templateObject_1$
|
|
15453
|
+
var templateObject_1$J, templateObject_2$B, templateObject_3$q, templateObject_4$k;
|
|
15435
15454
|
|
|
15436
15455
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
15437
15456
|
var _b = _a.classNames,
|
|
@@ -15446,7 +15465,7 @@
|
|
|
15446
15465
|
buttonText: 'OK'
|
|
15447
15466
|
});
|
|
15448
15467
|
if (!allowOverrideWrongDocumentTypeGuidance) return null;
|
|
15449
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
15468
|
+
return /*#__PURE__*/React.createElement(Container$7, {
|
|
15450
15469
|
className: classNames.container
|
|
15451
15470
|
}, /*#__PURE__*/React.createElement(InnerContainer, {
|
|
15452
15471
|
className: classNames.inner
|
|
@@ -15464,7 +15483,7 @@
|
|
|
15464
15483
|
}
|
|
15465
15484
|
}, verbiage.buttonText))));
|
|
15466
15485
|
}
|
|
15467
|
-
var Container$
|
|
15486
|
+
var Container$7 = styled.div(templateObject_1$I || (templateObject_1$I = __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) {
|
|
15468
15487
|
var _a, _b, _c;
|
|
15469
15488
|
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';
|
|
15470
15489
|
}, function (props) {
|
|
@@ -15475,7 +15494,7 @@
|
|
|
15475
15494
|
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"])));
|
|
15476
15495
|
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"])));
|
|
15477
15496
|
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"])));
|
|
15478
|
-
var templateObject_1$
|
|
15497
|
+
var templateObject_1$I, templateObject_2$A, templateObject_3$p, templateObject_4$j, templateObject_5$d;
|
|
15479
15498
|
|
|
15480
15499
|
// This is a simplified version of https://github.com/ZeeCoder/use-resize-observer.
|
|
15481
15500
|
// We have removed all options and made it compliant with React Compiler/React 19.
|
|
@@ -15714,9 +15733,7 @@
|
|
|
15714
15733
|
var debugScalingDetails = useDebugScalingDetails({
|
|
15715
15734
|
enabled: debugMode,
|
|
15716
15735
|
pageWidth: state.guideRectWidth,
|
|
15717
|
-
pageHeight: state.guideRectHeight
|
|
15718
|
-
videoWidth: state.videoWidth,
|
|
15719
|
-
videoHeight: state.videoHeight
|
|
15736
|
+
pageHeight: state.guideRectHeight
|
|
15720
15737
|
});
|
|
15721
15738
|
var satisfied = state.isGoodFrame;
|
|
15722
15739
|
if (typeof guidanceSatisfied === 'boolean') satisfied = guidanceSatisfied;
|
|
@@ -15807,13 +15824,13 @@
|
|
|
15807
15824
|
finished: true
|
|
15808
15825
|
}, verbiage.retryBtnText)));
|
|
15809
15826
|
};
|
|
15810
|
-
var StyledOverlayInner$3 = styled(OverlayInner$2)(templateObject_1$
|
|
15827
|
+
var StyledOverlayInner$3 = 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"])));
|
|
15811
15828
|
var StyledOverlayImageContainer$1 = styled(OverlayImageContainer)(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
15812
15829
|
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"])));
|
|
15813
15830
|
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"])));
|
|
15814
|
-
var templateObject_1$
|
|
15831
|
+
var templateObject_1$H, templateObject_2$z, templateObject_3$o, templateObject_4$i;
|
|
15815
15832
|
|
|
15816
|
-
var ExitCaptureStyledButton = styled.button(templateObject_1$
|
|
15833
|
+
var ExitCaptureStyledButton = styled.button(templateObject_1$G || (templateObject_1$G = __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"])));
|
|
15817
15834
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
15818
15835
|
var onClick = _a.onClick,
|
|
15819
15836
|
className = _a.className;
|
|
@@ -15857,7 +15874,7 @@
|
|
|
15857
15874
|
y2: "19.75"
|
|
15858
15875
|
}))));
|
|
15859
15876
|
};
|
|
15860
|
-
var templateObject_1$
|
|
15877
|
+
var templateObject_1$G;
|
|
15861
15878
|
|
|
15862
15879
|
function IdCaptureLoadingGraphic(props) {
|
|
15863
15880
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -16332,7 +16349,7 @@
|
|
|
16332
16349
|
fill: "white"
|
|
16333
16350
|
}))));
|
|
16334
16351
|
}
|
|
16335
|
-
var LoadingGraphicWrapper = styled.div(templateObject_1$
|
|
16352
|
+
var LoadingGraphicWrapper = styled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
|
|
16336
16353
|
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) {
|
|
16337
16354
|
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
16338
16355
|
}, function (props) {
|
|
@@ -16346,7 +16363,7 @@
|
|
|
16346
16363
|
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) {
|
|
16347
16364
|
return props.$offScreen ? '40px' : '0';
|
|
16348
16365
|
});
|
|
16349
|
-
var templateObject_1$
|
|
16366
|
+
var templateObject_1$F, templateObject_2$y, templateObject_3$n, templateObject_4$h;
|
|
16350
16367
|
|
|
16351
16368
|
function LoadingListItemIndicator(_a) {
|
|
16352
16369
|
var _b = _a.state,
|
|
@@ -16546,7 +16563,7 @@
|
|
|
16546
16563
|
}
|
|
16547
16564
|
}, ready ? verbiage.continueText : verbiage.pleaseWaitText))))));
|
|
16548
16565
|
};
|
|
16549
|
-
var OverlayInner$1 = styled(LoadingOverlayInner)(templateObject_1$
|
|
16566
|
+
var OverlayInner$1 = styled(LoadingOverlayInner)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
16550
16567
|
var _a, _b, _c, _d;
|
|
16551
16568
|
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';
|
|
16552
16569
|
}, function (props) {
|
|
@@ -16571,7 +16588,7 @@
|
|
|
16571
16588
|
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;
|
|
16572
16589
|
});
|
|
16573
16590
|
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);
|
|
16574
|
-
var CustomLoadingGraphic$1 = styled.img(templateObject_8$
|
|
16591
|
+
var CustomLoadingGraphic$1 = styled.img(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
16575
16592
|
var ContinueButtonContainer$1 = styled.div(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
16576
16593
|
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 &.disabled {\n background: ", ";\n color: ", ";\n border: ", ";\n }\n"], ["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n\n &.disabled {\n background: ", ";\n color: ", ";\n border: ", ";\n }\n"])), function (props) {
|
|
16577
16594
|
var _a, _b, _c, _d, _e, _f;
|
|
@@ -16592,9 +16609,9 @@
|
|
|
16592
16609
|
var _a, _b, _c, _d;
|
|
16593
16610
|
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.continueBtnDisabledBorder) !== null && _d !== void 0 ? _d : 'none';
|
|
16594
16611
|
});
|
|
16595
|
-
var templateObject_1$
|
|
16612
|
+
var templateObject_1$E, templateObject_2$x, templateObject_3$m, templateObject_4$g, templateObject_5$c, templateObject_6$9, templateObject_7$6, templateObject_8$3, templateObject_9$2, templateObject_10$1;
|
|
16596
16613
|
|
|
16597
|
-
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$
|
|
16614
|
+
var ContinuityCameraCheckboxContainer = styled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
|
|
16598
16615
|
var ContinuityCameraCheckbox = styled.input(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
16599
16616
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
16600
16617
|
var _b, _c, _d, _e;
|
|
@@ -16716,7 +16733,7 @@
|
|
|
16716
16733
|
}
|
|
16717
16734
|
}, ready ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
16718
16735
|
};
|
|
16719
|
-
var templateObject_1$
|
|
16736
|
+
var templateObject_1$D, templateObject_2$w;
|
|
16720
16737
|
|
|
16721
16738
|
var components$1 = {
|
|
16722
16739
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -16774,9 +16791,9 @@
|
|
|
16774
16791
|
});
|
|
16775
16792
|
};
|
|
16776
16793
|
|
|
16777
|
-
var Card = styled.div(templateObject_1$
|
|
16794
|
+
var Card = styled.div(templateObject_1$C || (templateObject_1$C = __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"])));
|
|
16778
16795
|
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"])));
|
|
16779
|
-
var templateObject_1$
|
|
16796
|
+
var templateObject_1$C, templateObject_2$v;
|
|
16780
16797
|
|
|
16781
16798
|
var imageDisplayOrder = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
16782
16799
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
@@ -16838,13 +16855,13 @@
|
|
|
16838
16855
|
finished: true
|
|
16839
16856
|
}, verbiage.retryText)))));
|
|
16840
16857
|
};
|
|
16841
|
-
var Heading$a = styled.h1(templateObject_1$
|
|
16858
|
+
var Heading$a = styled.h1(templateObject_1$B || (templateObject_1$B = __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"])));
|
|
16842
16859
|
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"])));
|
|
16843
16860
|
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"])));
|
|
16844
16861
|
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"])));
|
|
16845
16862
|
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"])));
|
|
16846
16863
|
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"])));
|
|
16847
|
-
var templateObject_1$
|
|
16864
|
+
var templateObject_1$B, templateObject_2$u, templateObject_3$l, templateObject_4$f, templateObject_5$b, templateObject_6$8;
|
|
16848
16865
|
|
|
16849
16866
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
16850
16867
|
var _this = this;
|
|
@@ -16896,7 +16913,7 @@
|
|
|
16896
16913
|
canvas.style.height = '0';
|
|
16897
16914
|
}
|
|
16898
16915
|
|
|
16899
|
-
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$
|
|
16916
|
+
var IdCardGuideImageContainer = styled(IdCardBorder)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n"])), function (props) {
|
|
16900
16917
|
return props.$isVisible ? '' : 'opacity: 0;';
|
|
16901
16918
|
});
|
|
16902
16919
|
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) {
|
|
@@ -17052,7 +17069,7 @@
|
|
|
17052
17069
|
var _a;
|
|
17053
17070
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
17054
17071
|
});
|
|
17055
|
-
var templateObject_1$
|
|
17072
|
+
var templateObject_1$A, templateObject_2$t, templateObject_3$k, templateObject_4$e, templateObject_5$a;
|
|
17056
17073
|
|
|
17057
17074
|
var defaultIdCaptureGuideImages = {
|
|
17058
17075
|
portrait: {
|
|
@@ -17228,12 +17245,12 @@
|
|
|
17228
17245
|
style: imageStyle
|
|
17229
17246
|
})));
|
|
17230
17247
|
};
|
|
17231
|
-
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$
|
|
17248
|
+
var FlipImageContainer = styled(IdCardGuideImageContainer)(templateObject_1$z || (templateObject_1$z = __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) {
|
|
17232
17249
|
return props.$transitionTime;
|
|
17233
17250
|
}, function (props) {
|
|
17234
17251
|
return props.$transforms;
|
|
17235
17252
|
});
|
|
17236
|
-
var templateObject_1$
|
|
17253
|
+
var templateObject_1$z;
|
|
17237
17254
|
|
|
17238
17255
|
var GuideOrientationContext = /*#__PURE__*/React.createContext({
|
|
17239
17256
|
orientation: 'landscape',
|
|
@@ -17520,7 +17537,7 @@
|
|
|
17520
17537
|
return v;
|
|
17521
17538
|
}).join(' ');
|
|
17522
17539
|
};
|
|
17523
|
-
var StyledPageContainer = styled.div(templateObject_1$
|
|
17540
|
+
var StyledPageContainer = styled.div(templateObject_1$y || (templateObject_1$y = __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"])));
|
|
17524
17541
|
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"])));
|
|
17525
17542
|
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"])));
|
|
17526
17543
|
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) {
|
|
@@ -17546,9 +17563,9 @@
|
|
|
17546
17563
|
}, function (props) {
|
|
17547
17564
|
return props.$padding ? "padding: ".concat(props.$padding, "px;") : '';
|
|
17548
17565
|
});
|
|
17549
|
-
var GuideText = styled.span(templateObject_8$
|
|
17566
|
+
var GuideText = styled.span(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n align-content: center;\n margin-top: 12px;\n margin-bottom: 12px;\n"], ["\n align-content: center;\n margin-top: 12px;\n margin-bottom: 12px;\n"])));
|
|
17550
17567
|
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"])));
|
|
17551
|
-
var templateObject_1$
|
|
17568
|
+
var templateObject_1$y, templateObject_2$s, templateObject_3$j, templateObject_4$d, templateObject_5$9, templateObject_6$7, templateObject_7$5, templateObject_8$2, templateObject_9$1;
|
|
17552
17569
|
|
|
17553
17570
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
17554
17571
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -17689,11 +17706,11 @@
|
|
|
17689
17706
|
progress: progress
|
|
17690
17707
|
}));
|
|
17691
17708
|
};
|
|
17692
|
-
var CanvasWrapper$1 = styled.div(templateObject_1$
|
|
17709
|
+
var CanvasWrapper$1 = styled.div(templateObject_1$x || (templateObject_1$x = __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) {
|
|
17693
17710
|
return props.$maskColor;
|
|
17694
17711
|
});
|
|
17695
17712
|
var Canvas$1 = styled.canvas(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
17696
|
-
var templateObject_1$
|
|
17713
|
+
var templateObject_1$x, templateObject_2$r;
|
|
17697
17714
|
|
|
17698
17715
|
function IdCaptureGuides(_a) {
|
|
17699
17716
|
var _b = _a.guideType,
|
|
@@ -17749,7 +17766,7 @@
|
|
|
17749
17766
|
})));
|
|
17750
17767
|
}
|
|
17751
17768
|
|
|
17752
|
-
var Spinner$1 = styled.div(templateObject_1$
|
|
17769
|
+
var Spinner$1 = styled.div(templateObject_1$w || (templateObject_1$w = __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) {
|
|
17753
17770
|
var $size = _a.$size;
|
|
17754
17771
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
17755
17772
|
}, function (_a) {
|
|
@@ -17778,7 +17795,7 @@
|
|
|
17778
17795
|
function SpinnerPage() {
|
|
17779
17796
|
return /*#__PURE__*/React.createElement(SpinnerPageContainer, null, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
17780
17797
|
}
|
|
17781
|
-
var templateObject_1$
|
|
17798
|
+
var templateObject_1$w, templateObject_2$q;
|
|
17782
17799
|
|
|
17783
17800
|
var IdCaptureImagePreview = function IdCaptureImagePreview(_a) {
|
|
17784
17801
|
var _b = _a.classNames,
|
|
@@ -17865,11 +17882,11 @@
|
|
|
17865
17882
|
onError: onError
|
|
17866
17883
|
})));
|
|
17867
17884
|
};
|
|
17868
|
-
var StyledSpinner = styled(Spinner$1)(templateObject_1$
|
|
17885
|
+
var StyledSpinner = styled(Spinner$1)(templateObject_1$v || (templateObject_1$v = __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"])));
|
|
17869
17886
|
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"])));
|
|
17870
17887
|
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"])));
|
|
17871
17888
|
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"])));
|
|
17872
|
-
var templateObject_1$
|
|
17889
|
+
var templateObject_1$v, templateObject_2$p, templateObject_3$i, templateObject_4$c;
|
|
17873
17890
|
|
|
17874
17891
|
var documentCaptureInitialState = {
|
|
17875
17892
|
documents: [],
|
|
@@ -18217,16 +18234,16 @@
|
|
|
18217
18234
|
ref: canvasRef
|
|
18218
18235
|
}));
|
|
18219
18236
|
};
|
|
18220
|
-
var CanvasWrapper = styled.div(templateObject_1$
|
|
18237
|
+
var CanvasWrapper = styled.div(templateObject_1$u || (templateObject_1$u = __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) {
|
|
18221
18238
|
return props.$maskColor;
|
|
18222
18239
|
});
|
|
18223
18240
|
var Canvas = styled.canvas(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
18224
|
-
var templateObject_1$
|
|
18241
|
+
var templateObject_1$u, templateObject_2$o;
|
|
18225
18242
|
|
|
18226
|
-
var CameraFeedWrapper = styled.div(templateObject_1$
|
|
18243
|
+
var CameraFeedWrapper = styled.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
18227
18244
|
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;") : "";
|
|
18228
18245
|
});
|
|
18229
|
-
var templateObject_1$
|
|
18246
|
+
var templateObject_1$t;
|
|
18230
18247
|
|
|
18231
18248
|
var CameraVideoTag = function CameraVideoTag(props) {
|
|
18232
18249
|
var _a = useCameraStore(useShallow(function (store) {
|
|
@@ -18257,10 +18274,10 @@
|
|
|
18257
18274
|
"$isRearFacing": isRearFacing
|
|
18258
18275
|
}, props));
|
|
18259
18276
|
};
|
|
18260
|
-
var FullscreenVideoTag = styled.video(templateObject_1$
|
|
18277
|
+
var FullscreenVideoTag = styled.video(templateObject_1$s || (templateObject_1$s = __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) {
|
|
18261
18278
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
18262
18279
|
});
|
|
18263
|
-
var templateObject_1$
|
|
18280
|
+
var templateObject_1$s;
|
|
18264
18281
|
|
|
18265
18282
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
18266
18283
|
var _b, _c, _d, _e;
|
|
@@ -18408,7 +18425,7 @@
|
|
|
18408
18425
|
disabled: !cameraReady || capturing
|
|
18409
18426
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
18410
18427
|
};
|
|
18411
|
-
var CaptureContainer = styled.div(templateObject_1$
|
|
18428
|
+
var CaptureContainer = styled.div(templateObject_1$r || (templateObject_1$r = __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"])));
|
|
18412
18429
|
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) {
|
|
18413
18430
|
return props.$maskColor;
|
|
18414
18431
|
});
|
|
@@ -18422,7 +18439,7 @@
|
|
|
18422
18439
|
});
|
|
18423
18440
|
var StyledButtonsRow$8 = styled(ButtonsRow$2)(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
|
|
18424
18441
|
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"])));
|
|
18425
|
-
var templateObject_1$
|
|
18442
|
+
var templateObject_1$r, templateObject_2$n, templateObject_3$h, templateObject_4$b, templateObject_5$8, templateObject_6$6, templateObject_7$4;
|
|
18426
18443
|
|
|
18427
18444
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
18428
18445
|
var onSuccess = _a.onSuccess,
|
|
@@ -18693,13 +18710,13 @@
|
|
|
18693
18710
|
}
|
|
18694
18711
|
}, verbiage.doneBtnText))))));
|
|
18695
18712
|
};
|
|
18696
|
-
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
18713
|
+
var StyledOverlayInner$2 = styled(OverlayInner$2)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
18697
18714
|
var Heading$8 = styled.h3(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18698
18715
|
var Description$3 = styled.p(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
18699
18716
|
var Instruction = styled.p(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
18700
18717
|
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"])));
|
|
18701
18718
|
var StyledButtonsRow$7 = styled(ButtonsRow$2)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
18702
|
-
var templateObject_1$
|
|
18719
|
+
var templateObject_1$q, templateObject_2$m, templateObject_3$g, templateObject_4$a, templateObject_5$7, templateObject_6$5;
|
|
18703
18720
|
|
|
18704
18721
|
function ScalingCameraFeed() {
|
|
18705
18722
|
var _a = useIdCaptureStore(),
|
|
@@ -19051,7 +19068,7 @@
|
|
|
19051
19068
|
}
|
|
19052
19069
|
}, file ? "".concat(file.name, " (").concat(humanFileSize(file.size), ")") : filePickerLoading ? loadingText : children));
|
|
19053
19070
|
}
|
|
19054
|
-
var ScreenContainer = styled.div(templateObject_1$
|
|
19071
|
+
var ScreenContainer = styled.div(templateObject_1$p || (templateObject_1$p = __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) {
|
|
19055
19072
|
var _a;
|
|
19056
19073
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
19057
19074
|
});
|
|
@@ -19061,7 +19078,7 @@
|
|
|
19061
19078
|
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"])));
|
|
19062
19079
|
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"])));
|
|
19063
19080
|
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"])));
|
|
19064
|
-
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"])));
|
|
19081
|
+
var UploadIdBackHelpText = styled.p(templateObject_8$1 || (templateObject_8$1 = __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"])));
|
|
19065
19082
|
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"])));
|
|
19066
19083
|
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"])));
|
|
19067
19084
|
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) {
|
|
@@ -19340,7 +19357,7 @@
|
|
|
19340
19357
|
} while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
|
|
19341
19358
|
return bytes.toFixed(dp) + ' ' + units[u];
|
|
19342
19359
|
}
|
|
19343
|
-
var templateObject_1$
|
|
19360
|
+
var templateObject_1$p, templateObject_2$l, templateObject_3$f, templateObject_4$9, templateObject_5$6, templateObject_6$4, templateObject_7$3, templateObject_8$1, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
|
|
19344
19361
|
|
|
19345
19362
|
var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
19346
19363
|
var _b, _c, _d, _e, _f;
|
|
@@ -20033,7 +20050,7 @@
|
|
|
20033
20050
|
}))));
|
|
20034
20051
|
});
|
|
20035
20052
|
HeadGuideSvg.displayName = 'HeadGuideSvg';
|
|
20036
|
-
var PulsingHeadGuideContainer = styled.div(templateObject_1$
|
|
20053
|
+
var PulsingHeadGuideContainer = styled.div(templateObject_1$o || (templateObject_1$o = __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);
|
|
20037
20054
|
function HeadGuide(_a) {
|
|
20038
20055
|
var _b;
|
|
20039
20056
|
var _c = _a.status,
|
|
@@ -20311,9 +20328,9 @@
|
|
|
20311
20328
|
status: status
|
|
20312
20329
|
}));
|
|
20313
20330
|
}
|
|
20314
|
-
var templateObject_1$
|
|
20331
|
+
var templateObject_1$o, templateObject_2$k, templateObject_3$e;
|
|
20315
20332
|
|
|
20316
|
-
var FaceCaptureGuideContainer = styled.div(templateObject_1$
|
|
20333
|
+
var FaceCaptureGuideContainer = styled.div(templateObject_1$n || (templateObject_1$n = __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"])));
|
|
20317
20334
|
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"])));
|
|
20318
20335
|
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
20319
20336
|
var _b = _a.classNames,
|
|
@@ -20336,7 +20353,7 @@
|
|
|
20336
20353
|
verticalAlign: "center"
|
|
20337
20354
|
})));
|
|
20338
20355
|
};
|
|
20339
|
-
var templateObject_1$
|
|
20356
|
+
var templateObject_1$n, templateObject_2$j;
|
|
20340
20357
|
|
|
20341
20358
|
var SelfieGuidanceModelsContext = /*#__PURE__*/React.createContext({
|
|
20342
20359
|
start: function start() {
|
|
@@ -20414,8 +20431,10 @@
|
|
|
20414
20431
|
requireVerticalFaceCentering: requireVerticalFaceCentering
|
|
20415
20432
|
});
|
|
20416
20433
|
setLastFaceDetectionAt(new Date().getTime());
|
|
20434
|
+
// setLastPrediction(processed)
|
|
20417
20435
|
return [4 /*yield*/, (_b = onPredictionHandler.current) === null || _b === void 0 ? void 0 : _b.call(onPredictionHandler, processed)];
|
|
20418
20436
|
case 2:
|
|
20437
|
+
// setLastPrediction(processed)
|
|
20419
20438
|
_c.sent();
|
|
20420
20439
|
return [3 /*break*/, 4];
|
|
20421
20440
|
case 3:
|
|
@@ -20446,7 +20465,7 @@
|
|
|
20446
20465
|
error: modelError,
|
|
20447
20466
|
modelDownloadProgress: modelDownloadProgress
|
|
20448
20467
|
};
|
|
20449
|
-
}, [
|
|
20468
|
+
}, [start, stop, ready, onPredictionMade, modelError, modelDownloadProgress]);
|
|
20450
20469
|
return /*#__PURE__*/React__namespace.createElement(SelfieGuidanceModelsContext.Provider, {
|
|
20451
20470
|
value: value
|
|
20452
20471
|
}, /*#__PURE__*/React__namespace.createElement(InvisibleCanvas, {
|
|
@@ -20656,12 +20675,12 @@
|
|
|
20656
20675
|
}
|
|
20657
20676
|
}, !image ? invalidSelfie ? verbiage.retryButtonText : verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
|
|
20658
20677
|
};
|
|
20659
|
-
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$
|
|
20678
|
+
var StyledOverlayInner$1 = styled(OverlayInner$2)(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
20660
20679
|
var Heading$7 = styled.h3(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
20661
20680
|
var Description$2 = styled.p(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
20662
20681
|
var ImageContainer$6 = styled(OverlayImageContainer)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
20663
20682
|
var StyledButtonsRow$6 = styled(ButtonsRow$2)(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
20664
|
-
var templateObject_1$
|
|
20683
|
+
var templateObject_1$m, templateObject_2$i, templateObject_3$d, templateObject_4$8, templateObject_5$5;
|
|
20665
20684
|
|
|
20666
20685
|
var initialState$3 = {
|
|
20667
20686
|
busy: false,
|
|
@@ -20689,7 +20708,7 @@
|
|
|
20689
20708
|
}
|
|
20690
20709
|
};
|
|
20691
20710
|
var SelfieCapture = function SelfieCapture(_a) {
|
|
20692
|
-
var _b
|
|
20711
|
+
var _b;
|
|
20693
20712
|
var onGuidanceSatisfied = _a.onGuidanceSatisfied,
|
|
20694
20713
|
onGuidanceNotSatisfied = _a.onGuidanceNotSatisfied,
|
|
20695
20714
|
onFaceDetected = _a.onFaceDetected,
|
|
@@ -20697,46 +20716,40 @@
|
|
|
20697
20716
|
onSelfieCaptured = _a.onSelfieCaptured,
|
|
20698
20717
|
onTimeout = _a.onTimeout,
|
|
20699
20718
|
onExit = _a.onExit,
|
|
20700
|
-
|
|
20701
|
-
timeoutDurationMs =
|
|
20719
|
+
_c = _a.timeoutDurationMs,
|
|
20720
|
+
timeoutDurationMs = _c === void 0 ? 15000 : _c,
|
|
20702
20721
|
guidanceMessage = _a.guidanceMessage,
|
|
20703
20722
|
guidanceSatisfied = _a.guidanceSatisfied,
|
|
20704
20723
|
guidesComponent = _a.guidesComponent,
|
|
20705
|
-
|
|
20706
|
-
shouldCapture =
|
|
20707
|
-
|
|
20708
|
-
classNames =
|
|
20709
|
-
|
|
20710
|
-
colors =
|
|
20711
|
-
|
|
20712
|
-
rawVerbiage =
|
|
20713
|
-
|
|
20714
|
-
debugMode =
|
|
20715
|
-
var
|
|
20716
|
-
ref =
|
|
20717
|
-
|
|
20718
|
-
width =
|
|
20719
|
-
|
|
20720
|
-
height =
|
|
20721
|
-
var
|
|
20722
|
-
|
|
20723
|
-
busy =
|
|
20724
|
-
prediction =
|
|
20725
|
-
dispatch =
|
|
20724
|
+
_d = _a.shouldCapture,
|
|
20725
|
+
shouldCapture = _d === void 0 ? true : _d,
|
|
20726
|
+
_e = _a.classNames,
|
|
20727
|
+
classNames = _e === void 0 ? {} : _e,
|
|
20728
|
+
_f = _a.colors,
|
|
20729
|
+
colors = _f === void 0 ? {} : _f,
|
|
20730
|
+
_g = _a.verbiage,
|
|
20731
|
+
rawVerbiage = _g === void 0 ? {} : _g,
|
|
20732
|
+
_h = _a.debugMode,
|
|
20733
|
+
debugMode = _h === void 0 ? false : _h;
|
|
20734
|
+
var _j = useResizeObserver(),
|
|
20735
|
+
ref = _j.ref,
|
|
20736
|
+
_k = _j.width,
|
|
20737
|
+
width = _k === void 0 ? 1 : _k,
|
|
20738
|
+
_l = _j.height,
|
|
20739
|
+
height = _l === void 0 ? 1 : _l;
|
|
20740
|
+
var _m = React.useReducer(reducer$3, initialState$3),
|
|
20741
|
+
_o = _m[0],
|
|
20742
|
+
busy = _o.busy,
|
|
20743
|
+
prediction = _o.prediction,
|
|
20744
|
+
dispatch = _m[1];
|
|
20726
20745
|
var lastPredictionCanvas = React.useRef(null);
|
|
20727
|
-
var
|
|
20728
|
-
|
|
20729
|
-
|
|
20730
|
-
|
|
20731
|
-
|
|
20732
|
-
|
|
20733
|
-
|
|
20734
|
-
camera = _t.camera,
|
|
20735
|
-
videoRef = _t.videoRef;
|
|
20736
|
-
var _u = React.useContext(SelfieGuidanceModelsContext),
|
|
20737
|
-
onPredictionMade = _u.onPredictionMade,
|
|
20738
|
-
canvasRef = _u.canvasRef,
|
|
20739
|
-
guidanceError = _u.error;
|
|
20746
|
+
var camera = useCameraStore(useShallow(function (state) {
|
|
20747
|
+
return state.camera;
|
|
20748
|
+
}));
|
|
20749
|
+
var _p = React.useContext(SelfieGuidanceModelsContext),
|
|
20750
|
+
onPredictionMade = _p.onPredictionMade,
|
|
20751
|
+
canvasRef = _p.canvasRef,
|
|
20752
|
+
guidanceError = _p.error;
|
|
20740
20753
|
onPredictionMade(f(React.useCallback(function (prediction) {
|
|
20741
20754
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
20742
20755
|
return __generator(this, function (_a) {
|
|
@@ -20781,15 +20794,13 @@
|
|
|
20781
20794
|
if (timer) clearTimeout(timer);
|
|
20782
20795
|
};
|
|
20783
20796
|
}, [onSelfieCaptureStarted, onSelfieCaptured, prediction]);
|
|
20784
|
-
var
|
|
20785
|
-
timedOut =
|
|
20786
|
-
timeoutStartedAt =
|
|
20797
|
+
var _q = useTimeout(timeoutDurationMs, onTimeout),
|
|
20798
|
+
timedOut = _q.timedOut,
|
|
20799
|
+
timeoutStartedAt = _q.timeoutStartedAt;
|
|
20787
20800
|
var debugScalingDetails = useDebugScalingDetails({
|
|
20788
20801
|
enabled: debugMode,
|
|
20789
20802
|
pageWidth: width,
|
|
20790
|
-
pageHeight: height
|
|
20791
|
-
videoWidth: (_c = (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.videoWidth) !== null && _c !== void 0 ? _c : 0,
|
|
20792
|
-
videoHeight: (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0
|
|
20803
|
+
pageHeight: height
|
|
20793
20804
|
});
|
|
20794
20805
|
colors.guidesUnsatisfiedColor || (colors.guidesUnsatisfiedColor = 'white');
|
|
20795
20806
|
colors.guidesSatisfiedColor || (colors.guidesSatisfiedColor = 'green');
|
|
@@ -20802,7 +20813,7 @@
|
|
|
20802
20813
|
guidanceNoFaceDetectedText: 'Waiting for face to be detected...',
|
|
20803
20814
|
guidanceNotStableText: 'Please hold still...'
|
|
20804
20815
|
});
|
|
20805
|
-
var satisfied = (
|
|
20816
|
+
var satisfied = (_b = prediction === null || prediction === void 0 ? void 0 : prediction.faceReady) !== null && _b !== void 0 ? _b : false;
|
|
20806
20817
|
if (typeof guidanceSatisfied === 'boolean') satisfied = guidanceSatisfied;
|
|
20807
20818
|
guidanceMessage || (guidanceMessage = satisfied ? verbiage.guidanceHoldStillText : (prediction === null || prediction === void 0 ? void 0 : prediction.faceLookingAway) ? verbiage.guidanceLookStraightText : (prediction === null || prediction === void 0 ? void 0 : prediction.faceTooClose) ? verbiage.guidanceMoveBackText : (prediction === null || prediction === void 0 ? void 0 : prediction.faceTooFar) ? verbiage.guidanceMoveForwardText : (prediction === null || prediction === void 0 ? void 0 : prediction.faceNotCentered) ? verbiage.guidanceMoveToCenterText : (prediction === null || prediction === void 0 ? void 0 : prediction.faceNotDetected) ? verbiage.guidanceNoFaceDetectedText : !(prediction === null || prediction === void 0 ? void 0 : prediction.faceIsStable) ? verbiage.guidanceNotStableText : '');
|
|
20808
20819
|
if (guidanceError) {
|
|
@@ -20811,7 +20822,7 @@
|
|
|
20811
20822
|
});
|
|
20812
20823
|
}
|
|
20813
20824
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : FaceCaptureGuideOverlay;
|
|
20814
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
20825
|
+
return /*#__PURE__*/React.createElement(Container$6, {
|
|
20815
20826
|
ref: ref,
|
|
20816
20827
|
className: classNames.container
|
|
20817
20828
|
}, /*#__PURE__*/React.createElement(InvisibleCanvas, {
|
|
@@ -20833,8 +20844,8 @@
|
|
|
20833
20844
|
className: classNames.exitCaptureBtn
|
|
20834
20845
|
}));
|
|
20835
20846
|
};
|
|
20836
|
-
var Container$
|
|
20837
|
-
var templateObject_1$
|
|
20847
|
+
var Container$6 = styled.div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
|
|
20848
|
+
var templateObject_1$l;
|
|
20838
20849
|
|
|
20839
20850
|
var initialState$2 = {
|
|
20840
20851
|
frame: null,
|
|
@@ -20960,7 +20971,7 @@
|
|
|
20960
20971
|
var _m = React.useContext(SubmissionContext),
|
|
20961
20972
|
checkLiveness = _m.checkLiveness,
|
|
20962
20973
|
submissionError = _m.submissionError;
|
|
20963
|
-
var modelError =
|
|
20974
|
+
var modelError = useSelfieGuidanceModelsContext().error;
|
|
20964
20975
|
var _o = React.useReducer(reducer$2, initialState$2),
|
|
20965
20976
|
state = _o[0],
|
|
20966
20977
|
dispatch = _o[1];
|
|
@@ -21222,9 +21233,9 @@
|
|
|
21222
21233
|
finished: true
|
|
21223
21234
|
}, verbiage.retryBtnText)))));
|
|
21224
21235
|
};
|
|
21225
|
-
var ImageContainer$5 = styled.div(templateObject_1$
|
|
21236
|
+
var ImageContainer$5 = styled.div(templateObject_1$k || (templateObject_1$k = __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"])));
|
|
21226
21237
|
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"])));
|
|
21227
|
-
var templateObject_1$
|
|
21238
|
+
var templateObject_1$k, templateObject_2$h;
|
|
21228
21239
|
|
|
21229
21240
|
var FaceLivenessFailure = function FaceLivenessFailure(_a) {
|
|
21230
21241
|
var _b = _a.canRetry,
|
|
@@ -21273,9 +21284,9 @@
|
|
|
21273
21284
|
finished: true
|
|
21274
21285
|
}, verbiage.exitBtnText)))));
|
|
21275
21286
|
};
|
|
21276
|
-
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$
|
|
21287
|
+
var ImageContainer$4 = styled(OverlayImageContainer)(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
|
|
21277
21288
|
var Heading$5 = styled.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
|
|
21278
|
-
var templateObject_1$
|
|
21289
|
+
var templateObject_1$j, templateObject_2$g;
|
|
21279
21290
|
|
|
21280
21291
|
var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
|
|
21281
21292
|
var _b;
|
|
@@ -21318,11 +21329,11 @@
|
|
|
21318
21329
|
finished: true
|
|
21319
21330
|
}, verbiage.retryBtnText)));
|
|
21320
21331
|
};
|
|
21321
|
-
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$
|
|
21332
|
+
var StyledOverlayInner = styled(OverlayInner$2)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
21322
21333
|
var StyledOverlayImageContainer = styled(OverlayImageContainer)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
21323
21334
|
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"])));
|
|
21324
21335
|
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"])));
|
|
21325
|
-
var templateObject_1$
|
|
21336
|
+
var templateObject_1$i, templateObject_2$f, templateObject_3$c, templateObject_4$7;
|
|
21326
21337
|
|
|
21327
21338
|
var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLegacy(_a) {
|
|
21328
21339
|
var onDismissed = _a.onDismissed,
|
|
@@ -21414,9 +21425,9 @@
|
|
|
21414
21425
|
}
|
|
21415
21426
|
}, ready ? verbiage.continueText : allModelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
|
|
21416
21427
|
};
|
|
21417
|
-
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_1$
|
|
21428
|
+
var StyledGuidanceMessage = styled(GuidanceMessage)(templateObject_1$h || (templateObject_1$h = __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"])));
|
|
21418
21429
|
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"])));
|
|
21419
|
-
var templateObject_1$
|
|
21430
|
+
var templateObject_1$h, templateObject_2$e;
|
|
21420
21431
|
|
|
21421
21432
|
var legacyInstructionImageUrl = "".concat(DEFAULT_CDN_URL, "/Selfie-Image-1.png");
|
|
21422
21433
|
var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDefault(_a) {
|
|
@@ -21556,7 +21567,7 @@
|
|
|
21556
21567
|
}
|
|
21557
21568
|
}, ready ? verbiage.continueText : verbiage.pleaseWaitText))))));
|
|
21558
21569
|
};
|
|
21559
|
-
var OverlayInner = styled(LoadingOverlayInner)(templateObject_1$
|
|
21570
|
+
var OverlayInner = styled(LoadingOverlayInner)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
21560
21571
|
var _a, _b, _c, _d;
|
|
21561
21572
|
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';
|
|
21562
21573
|
}, function (props) {
|
|
@@ -21602,7 +21613,7 @@
|
|
|
21602
21613
|
var _a, _b, _c, _d;
|
|
21603
21614
|
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.continueBtnBorder) !== null && _d !== void 0 ? _d : 'none';
|
|
21604
21615
|
});
|
|
21605
|
-
var templateObject_1$
|
|
21616
|
+
var templateObject_1$g, templateObject_2$d, templateObject_3$b, templateObject_4$6, templateObject_5$4, templateObject_6$3, templateObject_7$2;
|
|
21606
21617
|
|
|
21607
21618
|
var components = {
|
|
21608
21619
|
"default": SelfieCaptureLoadingOverlayDefault,
|
|
@@ -21661,37 +21672,39 @@
|
|
|
21661
21672
|
_r = _a.verbiage,
|
|
21662
21673
|
verbiage = _r === void 0 ? {} : _r,
|
|
21663
21674
|
_s = _a.debugMode,
|
|
21664
|
-
debugMode = _s === void 0 ? false : _s
|
|
21665
|
-
|
|
21666
|
-
|
|
21667
|
-
|
|
21668
|
-
|
|
21669
|
-
|
|
21670
|
-
|
|
21675
|
+
debugMode = _s === void 0 ? false : _s,
|
|
21676
|
+
_t = _a.showLoadingOverlay,
|
|
21677
|
+
showLoadingOverlay = _t === void 0 ? true : _t;
|
|
21678
|
+
var _u = React.useContext(SubmissionContext),
|
|
21679
|
+
submissionResponse = _u.submissionResponse,
|
|
21680
|
+
livenessCheckRequest = _u.livenessCheckRequest,
|
|
21681
|
+
setSelfieImage = _u.setSelfieImage,
|
|
21682
|
+
logSelfieCaptureAttempt = _u.logSelfieCaptureAttempt;
|
|
21683
|
+
var _v = useCameraStore(useShallow(function (state) {
|
|
21671
21684
|
return {
|
|
21672
21685
|
cameraAccessDenied: state.cameraAccessDenied,
|
|
21673
21686
|
requestCameraAccess: state.requestCameraAccess,
|
|
21674
21687
|
releaseCameraAccess: state.releaseCameraAccess
|
|
21675
21688
|
};
|
|
21676
21689
|
})),
|
|
21677
|
-
cameraAccessDenied =
|
|
21678
|
-
requestCameraAccess =
|
|
21679
|
-
releaseCameraAccess =
|
|
21680
|
-
var
|
|
21681
|
-
faceCropImageUrl =
|
|
21682
|
-
setFaceCropImageUrl =
|
|
21683
|
-
var
|
|
21684
|
-
retryCount =
|
|
21685
|
-
setRetryCount =
|
|
21686
|
-
var
|
|
21687
|
-
captureState =
|
|
21688
|
-
setCaptureState =
|
|
21690
|
+
cameraAccessDenied = _v.cameraAccessDenied,
|
|
21691
|
+
requestCameraAccess = _v.requestCameraAccess,
|
|
21692
|
+
releaseCameraAccess = _v.releaseCameraAccess;
|
|
21693
|
+
var _w = React.useState(''),
|
|
21694
|
+
faceCropImageUrl = _w[0],
|
|
21695
|
+
setFaceCropImageUrl = _w[1];
|
|
21696
|
+
var _x = React.useState(0),
|
|
21697
|
+
retryCount = _x[0],
|
|
21698
|
+
setRetryCount = _x[1];
|
|
21699
|
+
var _y = React.useState(showLoadingOverlay ? 'LOADING' : 'CAPTURING'),
|
|
21700
|
+
captureState = _y[0],
|
|
21701
|
+
setCaptureState = _y[1];
|
|
21689
21702
|
var captureStartedAt = React.useRef();
|
|
21690
21703
|
var operationStartedAt = React.useRef();
|
|
21691
21704
|
var livenessScore = React.useRef();
|
|
21692
|
-
var
|
|
21693
|
-
start =
|
|
21694
|
-
stop =
|
|
21705
|
+
var _z = React.useContext(SelfieGuidanceModelsContext),
|
|
21706
|
+
start = _z.start,
|
|
21707
|
+
stop = _z.stop;
|
|
21695
21708
|
React.useEffect(function () {
|
|
21696
21709
|
if (precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie) {
|
|
21697
21710
|
setSelfieImage(precapturedDocuments.selfie.imageData);
|
|
@@ -21701,7 +21714,7 @@
|
|
|
21701
21714
|
if (captureState !== 'CAPTURING') return;
|
|
21702
21715
|
operationStartedAt.current = new Date();
|
|
21703
21716
|
captureStartedAt.current = undefined;
|
|
21704
|
-
start
|
|
21717
|
+
setTimeout(start, 1);
|
|
21705
21718
|
return stop;
|
|
21706
21719
|
}, [captureState, precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie, setSelfieImage, start, stop]);
|
|
21707
21720
|
var onCapture = React.useCallback(function () {
|
|
@@ -21775,9 +21788,9 @@
|
|
|
21775
21788
|
}
|
|
21776
21789
|
onDenied === null || onDenied === void 0 ? void 0 : onDenied(submissionResponse, livenessCheckRequest);
|
|
21777
21790
|
}, [allowLivenessFailure, onDenied, submissionResponse, livenessCheckRequest]);
|
|
21778
|
-
var
|
|
21779
|
-
attempt =
|
|
21780
|
-
setAttempt =
|
|
21791
|
+
var _0 = React.useState(0),
|
|
21792
|
+
attempt = _0[0],
|
|
21793
|
+
setAttempt = _0[1];
|
|
21781
21794
|
var onExitCallback = React.useCallback(function () {
|
|
21782
21795
|
setAttempt(function (n) {
|
|
21783
21796
|
return n + 1;
|
|
@@ -21876,7 +21889,7 @@
|
|
|
21876
21889
|
default:
|
|
21877
21890
|
return null;
|
|
21878
21891
|
}
|
|
21879
|
-
}(), /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
21892
|
+
}(), showLoadingOverlay && ( /*#__PURE__*/React.createElement(SelfieCaptureLoadingOverlay, {
|
|
21880
21893
|
key: attempt,
|
|
21881
21894
|
mode: loadingOverlayMode,
|
|
21882
21895
|
customOverlayContent: customOverlayContent,
|
|
@@ -21887,7 +21900,7 @@
|
|
|
21887
21900
|
onUserCancel: onUserCancel,
|
|
21888
21901
|
onDismissed: onLoadingOverlayDismissedCallback,
|
|
21889
21902
|
waitForIdCaptureModels: waitForIdCaptureModels
|
|
21890
|
-
}));
|
|
21903
|
+
})));
|
|
21891
21904
|
};
|
|
21892
21905
|
|
|
21893
21906
|
var SubmissionSuccess = function SubmissionSuccess() {
|
|
@@ -21910,7 +21923,7 @@
|
|
|
21910
21923
|
}
|
|
21911
21924
|
return JSON.stringify(body, null, 2);
|
|
21912
21925
|
}, [submissionRequest, truncateImages]);
|
|
21913
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
21926
|
+
return /*#__PURE__*/React.createElement(Container$5, null, /*#__PURE__*/React.createElement("h3", null, "Submission completed!"), /*#__PURE__*/React.createElement(LoaderButton, {
|
|
21914
21927
|
onClick: function onClick() {
|
|
21915
21928
|
return setShowRequestBody(!showRequestBody);
|
|
21916
21929
|
}
|
|
@@ -21923,13 +21936,13 @@
|
|
|
21923
21936
|
}
|
|
21924
21937
|
}, truncateImages ? 'Display full images' : 'Truncate images'), /*#__PURE__*/React.createElement("h5", null, "Request Body"), /*#__PURE__*/React.createElement("pre", null, requestBodyDisplay))), /*#__PURE__*/React.createElement("h5", null, "Response Body"), /*#__PURE__*/React.createElement("pre", null, JSON.stringify(submissionResponse, null, 2)));
|
|
21925
21938
|
};
|
|
21926
|
-
var Container$
|
|
21939
|
+
var Container$5 = styled.div(templateObject_1$f || (templateObject_1$f = __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"])));
|
|
21927
21940
|
function truncate(str, max_chars) {
|
|
21928
21941
|
var truncated = str.split('').splice(0, max_chars).join('');
|
|
21929
21942
|
if (truncated.length < str.length) truncated += '...';
|
|
21930
21943
|
return truncated;
|
|
21931
21944
|
}
|
|
21932
|
-
var templateObject_1$
|
|
21945
|
+
var templateObject_1$f;
|
|
21933
21946
|
|
|
21934
21947
|
var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
|
|
21935
21948
|
var document = _a.document,
|
|
@@ -22005,11 +22018,11 @@
|
|
|
22005
22018
|
}
|
|
22006
22019
|
}, verbiage.captureBtnText)))));
|
|
22007
22020
|
};
|
|
22008
|
-
var Inner$2 = styled(OverlayInner$2)(templateObject_1$
|
|
22021
|
+
var Inner$2 = styled(OverlayInner$2)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
22009
22022
|
var Heading$4 = styled.h3(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
22010
22023
|
var Description = styled.p(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
22011
22024
|
var StyledButtonsRow$4 = styled(ButtonsRow$2)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
|
|
22012
|
-
var templateObject_1$
|
|
22025
|
+
var templateObject_1$e, templateObject_2$c, templateObject_3$a, templateObject_4$5;
|
|
22013
22026
|
|
|
22014
22027
|
var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
|
|
22015
22028
|
var documents = _a.documents,
|
|
@@ -22927,7 +22940,7 @@
|
|
|
22927
22940
|
});
|
|
22928
22941
|
}
|
|
22929
22942
|
|
|
22930
|
-
var SignaturePaperBacking = styled.div(templateObject_1$
|
|
22943
|
+
var SignaturePaperBacking = styled.div(templateObject_1$d || (templateObject_1$d = __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) {
|
|
22931
22944
|
var _a, _b;
|
|
22932
22945
|
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, ";") : "";
|
|
22933
22946
|
}, function (props) {
|
|
@@ -22938,7 +22951,7 @@
|
|
|
22938
22951
|
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, ";") : "";
|
|
22939
22952
|
});
|
|
22940
22953
|
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"])));
|
|
22941
|
-
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) {
|
|
22954
|
+
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 &.empty {\n background: ", ";\n border: ", ";\n color: ", ";\n }\n\n &.head-tracking-unsatisfied {\n background: ", ";\n border: ", ";\n color: ", ";\n }\n"], ["\n position: relative;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n flex-grow: 1;\n z-index: 100;\n height: 100%;\n\n &.empty {\n background: ", ";\n border: ", ";\n color: ", ";\n }\n\n &.head-tracking-unsatisfied {\n background: ", ";\n border: ", ";\n color: ", ";\n }\n"])), function (props) {
|
|
22942
22955
|
var _a, _b, _c;
|
|
22943
22956
|
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)';
|
|
22944
22957
|
}, function (props) {
|
|
@@ -22947,9 +22960,27 @@
|
|
|
22947
22960
|
}, function (props) {
|
|
22948
22961
|
var _a, _b, _c;
|
|
22949
22962
|
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';
|
|
22963
|
+
}, function (props) {
|
|
22964
|
+
var _a, _b, _c;
|
|
22965
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.emptyBackground) !== null && _c !== void 0 ? _c : 'rgba(255, 255, 255, 0.5)';
|
|
22966
|
+
}, function (props) {
|
|
22967
|
+
var _a, _b, _c;
|
|
22968
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.emptyBorder) !== null && _c !== void 0 ? _c : "1px solid #dedede";
|
|
22969
|
+
}, function (props) {
|
|
22970
|
+
var _a, _b, _c;
|
|
22971
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.emptyTextColor) !== null && _c !== void 0 ? _c : 'black';
|
|
22972
|
+
}, function (props) {
|
|
22973
|
+
var _a, _b, _c;
|
|
22974
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.headTrackingUnsatisfiedBackground) !== null && _c !== void 0 ? _c : 'rgba(255, 255, 255, 0.5)';
|
|
22975
|
+
}, function (props) {
|
|
22976
|
+
var _a, _b, _c;
|
|
22977
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.headTrackingUnsatisfiedBorder) !== null && _c !== void 0 ? _c : "1px solid #dedede";
|
|
22978
|
+
}, function (props) {
|
|
22979
|
+
var _a, _b, _c;
|
|
22980
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.headTrackingUnsatisfiedTextColor) !== null && _c !== void 0 ? _c : 'black';
|
|
22950
22981
|
});
|
|
22951
22982
|
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"])));
|
|
22952
|
-
var templateObject_1$
|
|
22983
|
+
var templateObject_1$d, templateObject_2$b, templateObject_3$9, templateObject_4$4;
|
|
22953
22984
|
|
|
22954
22985
|
var SignatureCapture = function SignatureCapture(_a) {
|
|
22955
22986
|
var onAccept = _a.onAccept,
|
|
@@ -22984,7 +23015,7 @@
|
|
|
22984
23015
|
});
|
|
22985
23016
|
});
|
|
22986
23017
|
}
|
|
22987
|
-
return /*#__PURE__*/React.createElement(Container$
|
|
23018
|
+
return /*#__PURE__*/React.createElement(Container$4, {
|
|
22988
23019
|
className: classNames.container
|
|
22989
23020
|
}, /*#__PURE__*/React.createElement(SignaturePaperBacking, {
|
|
22990
23021
|
className: classNames.inner
|
|
@@ -23022,9 +23053,9 @@
|
|
|
23022
23053
|
finished: true
|
|
23023
23054
|
}, verbiage.acceptBtnText)))));
|
|
23024
23055
|
};
|
|
23025
|
-
var Container$
|
|
23056
|
+
var Container$4 = styled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n position: relative;\n"], ["\n width: 100%;\n height: 100%;\n position: relative;\n"])));
|
|
23026
23057
|
var AcceptBtn$1 = styled(LoaderButton)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
23027
|
-
var templateObject_1$
|
|
23058
|
+
var templateObject_1$c, templateObject_2$a;
|
|
23028
23059
|
|
|
23029
23060
|
var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
|
|
23030
23061
|
if (mergeAVStreams === void 0) {
|
|
@@ -23405,23 +23436,27 @@
|
|
|
23405
23436
|
onClearSignaturePadClicked = _a.onClearSignaturePadClicked,
|
|
23406
23437
|
_d = _a.minSignaturePadPoints,
|
|
23407
23438
|
minSignaturePadPoints = _d === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _d,
|
|
23408
|
-
|
|
23409
|
-
|
|
23410
|
-
|
|
23411
|
-
|
|
23412
|
-
|
|
23413
|
-
|
|
23414
|
-
|
|
23415
|
-
|
|
23416
|
-
var _h =
|
|
23417
|
-
|
|
23418
|
-
|
|
23419
|
-
|
|
23420
|
-
|
|
23421
|
-
|
|
23422
|
-
|
|
23423
|
-
|
|
23424
|
-
|
|
23439
|
+
signaturePadEmptyContent = _a.signaturePadEmptyContent,
|
|
23440
|
+
headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
|
|
23441
|
+
_e = _a.headTrackingSatisfied,
|
|
23442
|
+
headTrackingSatisfied = _e === void 0 ? true : _e,
|
|
23443
|
+
_f = _a.classNames,
|
|
23444
|
+
classNames = _f === void 0 ? {} : _f,
|
|
23445
|
+
_g = _a.verbiage,
|
|
23446
|
+
rawVerbiage = _g === void 0 ? {} : _g;
|
|
23447
|
+
var _h = useResizeObserver(),
|
|
23448
|
+
ref = _h.ref,
|
|
23449
|
+
width = _h.width,
|
|
23450
|
+
height = _h.height;
|
|
23451
|
+
var _j = useVideoSignatureContext(),
|
|
23452
|
+
signaturePad = _j.signaturePad,
|
|
23453
|
+
onAcceptClicked = _j.onAcceptClicked;
|
|
23454
|
+
var _k = React.useState(true),
|
|
23455
|
+
signaturePadEmpty = _k[0],
|
|
23456
|
+
setSignaturePadEmpty = _k[1];
|
|
23457
|
+
var _l = React.useState(false),
|
|
23458
|
+
signatureValid = _l[0],
|
|
23459
|
+
setSignatureValid = _l[1];
|
|
23425
23460
|
var verbiage = useTranslations(rawVerbiage, {
|
|
23426
23461
|
clearSignatureBtnText: 'Clear',
|
|
23427
23462
|
acceptSignatureBtnText: 'Accept'
|
|
@@ -23435,8 +23470,11 @@
|
|
|
23435
23470
|
}, [classNames.signatureCanvas, height, width]);
|
|
23436
23471
|
var isSigning = requestedAction === 'CAPTURE_SIGNATURE';
|
|
23437
23472
|
var canClear = isSigning && !signaturePadEmpty;
|
|
23438
|
-
var canSubmit = isSigning && signatureValid;
|
|
23439
|
-
|
|
23473
|
+
var canSubmit = isSigning && signatureValid && headTrackingSatisfied;
|
|
23474
|
+
var displayEmptyState = requestedAction === 'CAPTURE_SIGNATURE' && signaturePadEmpty;
|
|
23475
|
+
var EmptyContent = signaturePadEmptyContent;
|
|
23476
|
+
var HeadTrackingUnsatisfiedContent = headTrackingUnsatisfiedContent;
|
|
23477
|
+
return /*#__PURE__*/React.createElement(Container$3, {
|
|
23440
23478
|
className: classNames.container
|
|
23441
23479
|
}, /*#__PURE__*/React.createElement(Inner$1, {
|
|
23442
23480
|
className: classNames.inner
|
|
@@ -23452,10 +23490,11 @@
|
|
|
23452
23490
|
className: classNames.signaturePadContainer
|
|
23453
23491
|
}, /*#__PURE__*/React.createElement(SignatureCanvasContainer, {
|
|
23454
23492
|
className: classNames.signatureCanvasContainer,
|
|
23455
|
-
"$disabled": requestedAction === 'VERIFY_LIVENESS'
|
|
23493
|
+
"$disabled": requestedAction === 'VERIFY_LIVENESS',
|
|
23494
|
+
"$headTrackingUnsatisfied": !headTrackingSatisfied
|
|
23456
23495
|
}, /*#__PURE__*/React.createElement(SignaturePad, {
|
|
23457
23496
|
ref: ref,
|
|
23458
|
-
className: classNames.signatureCanvasInner
|
|
23497
|
+
className: clsx(classNames.signatureCanvasInner, displayEmptyState && 'empty', !headTrackingSatisfied && 'head-tracking-unsatisfied')
|
|
23459
23498
|
}, /*#__PURE__*/React.createElement(SignatureCanvas, {
|
|
23460
23499
|
ref: signaturePad,
|
|
23461
23500
|
canvasProps: canvasProps,
|
|
@@ -23470,7 +23509,11 @@
|
|
|
23470
23509
|
});
|
|
23471
23510
|
setSignatureValid(points.length >= minSignaturePadPoints);
|
|
23472
23511
|
}
|
|
23473
|
-
})
|
|
23512
|
+
}), !headTrackingSatisfied && HeadTrackingUnsatisfiedContent ? ( /*#__PURE__*/React.createElement(SignaturePadContentContainer, {
|
|
23513
|
+
className: classNames.headTrackingUnsatisfiedContent
|
|
23514
|
+
}, typeof HeadTrackingUnsatisfiedContent === 'string' ? HeadTrackingUnsatisfiedContent : ( /*#__PURE__*/React.createElement(HeadTrackingUnsatisfiedContent, null)))) : displayEmptyState && EmptyContent && ( /*#__PURE__*/React.createElement(SignaturePadContentContainer, {
|
|
23515
|
+
className: classNames.emptyContentContainer
|
|
23516
|
+
}, typeof EmptyContent === 'string' ? EmptyContent : ( /*#__PURE__*/React.createElement(EmptyContent, null))))), /*#__PURE__*/React.createElement(SignatureButtonsContainer, {
|
|
23474
23517
|
className: classNames.signatureButtonsRow
|
|
23475
23518
|
}, /*#__PURE__*/React.createElement(LoaderButton, {
|
|
23476
23519
|
variant: "secondary",
|
|
@@ -23492,7 +23535,7 @@
|
|
|
23492
23535
|
finished: true
|
|
23493
23536
|
}, verbiage.acceptSignatureBtnText))))));
|
|
23494
23537
|
}
|
|
23495
|
-
var Container$
|
|
23538
|
+
var Container$3 = styled.div(templateObject_1$b || (templateObject_1$b = __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) {
|
|
23496
23539
|
var _a;
|
|
23497
23540
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
23498
23541
|
});
|
|
@@ -23500,11 +23543,17 @@
|
|
|
23500
23543
|
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"])));
|
|
23501
23544
|
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"])));
|
|
23502
23545
|
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"])));
|
|
23503
|
-
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) {
|
|
23546
|
+
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"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: calc(100% - 67px);\n ", "\n ", "\n"])), function (props) {
|
|
23504
23547
|
return props.$disabled ? 'opacity: 0.5; pointer-events: none;' : '';
|
|
23548
|
+
}, function (props) {
|
|
23549
|
+
return props.$headTrackingUnsatisfied ? 'pointer-events: none;' : '';
|
|
23505
23550
|
});
|
|
23506
23551
|
var AcceptBtn = styled(LoaderButton)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
|
|
23507
|
-
var
|
|
23552
|
+
var SignaturePadContentContainer = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n pointer-events: none;\n color: ", ";\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n pointer-events: none;\n color: ", ";\n"])), function (props) {
|
|
23553
|
+
var _a, _b, _c;
|
|
23554
|
+
return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.emptyTextColor) !== null && _c !== void 0 ? _c : 'black';
|
|
23555
|
+
});
|
|
23556
|
+
var templateObject_1$b, templateObject_2$9, templateObject_3$8, templateObject_4$3, templateObject_5$3, templateObject_6$2, templateObject_7$1, templateObject_8;
|
|
23508
23557
|
|
|
23509
23558
|
var DEFAULT_MIN_SIGNATURE_PAD_POINTS = 10;
|
|
23510
23559
|
var VideoSignatureCapture = function VideoSignatureCapture(_a) {
|
|
@@ -23516,6 +23565,8 @@
|
|
|
23516
23565
|
guidesComponent = _a.guidesComponent,
|
|
23517
23566
|
_c = _a.minSignaturePadPoints,
|
|
23518
23567
|
minSignaturePadPoints = _c === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _c,
|
|
23568
|
+
signaturePadEmptyContent = _a.signaturePadEmptyContent,
|
|
23569
|
+
headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
|
|
23519
23570
|
_d = _a.classNames,
|
|
23520
23571
|
classNames = _d === void 0 ? {} : _d,
|
|
23521
23572
|
_e = _a.colors,
|
|
@@ -23524,22 +23575,34 @@
|
|
|
23524
23575
|
rawVerbiage = _f === void 0 ? {} : _f,
|
|
23525
23576
|
_g = _a.debugMode,
|
|
23526
23577
|
debugMode = _g === void 0 ? false : _g;
|
|
23527
|
-
var
|
|
23528
|
-
|
|
23529
|
-
|
|
23530
|
-
|
|
23531
|
-
|
|
23532
|
-
|
|
23533
|
-
|
|
23534
|
-
|
|
23535
|
-
|
|
23536
|
-
|
|
23537
|
-
|
|
23538
|
-
|
|
23578
|
+
var _h = useCameraStore(useShallow(function (state) {
|
|
23579
|
+
return {
|
|
23580
|
+
camera: state.camera,
|
|
23581
|
+
videoWidth: state.videoWidth
|
|
23582
|
+
};
|
|
23583
|
+
})),
|
|
23584
|
+
camera = _h.camera,
|
|
23585
|
+
videoWidth = _h.videoWidth;
|
|
23586
|
+
var _j = useSelfieGuidanceModelsContext(),
|
|
23587
|
+
onPredictionMade = _j.onPredictionMade,
|
|
23588
|
+
start = _j.start,
|
|
23589
|
+
stop = _j.stop;
|
|
23590
|
+
var _k = useVideoSignatureContext(),
|
|
23591
|
+
signatureData = _k.signatureData,
|
|
23592
|
+
signatureDataUrl = _k.signatureDataUrl,
|
|
23593
|
+
signatureVideoData = _k.signatureVideoData,
|
|
23594
|
+
startRecording = _k.startRecording,
|
|
23595
|
+
stopRecording = _k.stopRecording,
|
|
23596
|
+
clearRecordedData = _k.clearRecordedData,
|
|
23597
|
+
isRecording = _k.isRecording;
|
|
23539
23598
|
React.useEffect(function () {
|
|
23540
23599
|
startRecording();
|
|
23541
23600
|
return stopRecording;
|
|
23542
23601
|
}, [startRecording, stopRecording]);
|
|
23602
|
+
React.useEffect(function () {
|
|
23603
|
+
setTimeout(start, 1);
|
|
23604
|
+
return stop;
|
|
23605
|
+
}, [start, stop]);
|
|
23543
23606
|
colors.guidanceMessageBackgroundColor || (colors.guidanceMessageBackgroundColor = '#ccc');
|
|
23544
23607
|
colors.guidanceMessageTextColor || (colors.guidanceMessageTextColor = 'black');
|
|
23545
23608
|
var verbiage = useTranslations(rawVerbiage, {
|
|
@@ -23550,27 +23613,47 @@
|
|
|
23550
23613
|
onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
|
|
23551
23614
|
}
|
|
23552
23615
|
}, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
|
|
23553
|
-
var
|
|
23554
|
-
|
|
23555
|
-
|
|
23556
|
-
React.
|
|
23557
|
-
|
|
23558
|
-
|
|
23559
|
-
|
|
23560
|
-
|
|
23561
|
-
|
|
23616
|
+
var _l = React.useState(true),
|
|
23617
|
+
headTrackingSatisfied = _l[0],
|
|
23618
|
+
setHeadTrackingSatisfied = _l[1];
|
|
23619
|
+
var _m = React.useState(null),
|
|
23620
|
+
lastFace = _m[0],
|
|
23621
|
+
setLastFace = _m[1];
|
|
23622
|
+
var _o = React.useState(0),
|
|
23623
|
+
numFramesWithoutFaces = _o[0],
|
|
23624
|
+
setNumFramesWithoutFaces = _o[1];
|
|
23625
|
+
onPredictionMade(f(function (_a) {
|
|
23626
|
+
var face = _a.face;
|
|
23627
|
+
if (!camera) return;
|
|
23628
|
+
var nearBoundary = (face === null || face === void 0 ? void 0 : face.box.xMin) < videoWidth * 0.2 || (face === null || face === void 0 ? void 0 : face.box.xMax) > videoWidth * 0.8;
|
|
23629
|
+
setLastFace(face);
|
|
23630
|
+
setHeadTrackingSatisfied(!!face && !nearBoundary);
|
|
23631
|
+
setNumFramesWithoutFaces(face ? 0 : function (n) {
|
|
23632
|
+
return n + 1;
|
|
23562
23633
|
});
|
|
23563
|
-
},
|
|
23634
|
+
}, 16));
|
|
23635
|
+
var _p = useResizeObserver(),
|
|
23636
|
+
ref = _p.ref,
|
|
23637
|
+
_q = _p.width,
|
|
23638
|
+
width = _q === void 0 ? 1 : _q,
|
|
23639
|
+
_r = _p.height,
|
|
23640
|
+
height = _r === void 0 ? 1 : _r;
|
|
23641
|
+
var debugScalingDetails = useDebugScalingDetails({
|
|
23642
|
+
enabled: debugMode,
|
|
23643
|
+
pageWidth: width,
|
|
23644
|
+
pageHeight: height
|
|
23645
|
+
});
|
|
23564
23646
|
React.useEffect(function () {
|
|
23565
23647
|
if (numFramesWithoutFaces >= 2) {
|
|
23566
23648
|
onFaceNotDetected === null || onFaceNotDetected === void 0 ? void 0 : onFaceNotDetected();
|
|
23567
23649
|
}
|
|
23568
23650
|
}, [numFramesWithoutFaces, onFaceNotDetected]);
|
|
23569
23651
|
var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : VideoSignatureGuides;
|
|
23570
|
-
return /*#__PURE__*/React.createElement(
|
|
23652
|
+
return /*#__PURE__*/React.createElement(Container$2, {
|
|
23653
|
+
ref: ref,
|
|
23571
23654
|
className: classNames.container
|
|
23572
23655
|
}, verbiage.guidanceMessageText && ( /*#__PURE__*/React.createElement(GuidanceMessageContainer, {
|
|
23573
|
-
"$top": "
|
|
23656
|
+
"$top": "10%",
|
|
23574
23657
|
className: classNames.guidanceMessageContainer
|
|
23575
23658
|
}, /*#__PURE__*/React.createElement(GuidanceMessage, {
|
|
23576
23659
|
className: classNames.guidanceMessage,
|
|
@@ -23578,16 +23661,26 @@
|
|
|
23578
23661
|
"$textColor": colors.guidanceMessageTextColor
|
|
23579
23662
|
}, verbiage.guidanceMessageText))), /*#__PURE__*/React.createElement(GuidesComponent, {
|
|
23580
23663
|
status: "success",
|
|
23664
|
+
key: "video-signature-guides-".concat(headTrackingSatisfied ? 'satisfied' : 'unsatisfied'),
|
|
23581
23665
|
classNames: classNames.videoSignatureGuidesClassNames,
|
|
23582
23666
|
minSignaturePadPoints: minSignaturePadPoints,
|
|
23667
|
+
signaturePadEmptyContent: signaturePadEmptyContent,
|
|
23668
|
+
headTrackingUnsatisfiedContent: headTrackingUnsatisfiedContent,
|
|
23669
|
+
headTrackingSatisfied: headTrackingSatisfied,
|
|
23583
23670
|
onClearSignaturePadClicked: restartVideoOnSignaturePadCleared ? function () {
|
|
23584
23671
|
return setTimeout(clearRecordedData, 100);
|
|
23585
23672
|
} : undefined
|
|
23586
|
-
}), debugMode && ( /*#__PURE__*/React.createElement(
|
|
23673
|
+
}), debugMode && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ObjectDetectionDebugOverlayDiv, null, lastFace && ( /*#__PURE__*/React.createElement(SelfieCaptureFaceDebugBox, {
|
|
23674
|
+
face: lastFace,
|
|
23675
|
+
scaling: debugScalingDetails,
|
|
23676
|
+
color: headTrackingSatisfied ? 'green' : 'red'
|
|
23677
|
+
}))), /*#__PURE__*/React.createElement(DebugStatsPane, null, "Video: ", camera === null || camera === void 0 ? void 0 : camera.width, "x", camera === null || camera === void 0 ? void 0 : camera.height, /*#__PURE__*/React.createElement("br", null), "Recording: ", isRecording ? 'true' : 'false'))), /*#__PURE__*/React.createElement(ExitCaptureButton, {
|
|
23587
23678
|
onClick: onExit,
|
|
23588
23679
|
className: classNames.exitCaptureBtn
|
|
23589
23680
|
}));
|
|
23590
23681
|
};
|
|
23682
|
+
var Container$2 = styled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
|
|
23683
|
+
var templateObject_1$a;
|
|
23591
23684
|
|
|
23592
23685
|
var VideoSignatureSuccess = function VideoSignatureSuccess(_a) {
|
|
23593
23686
|
var imageUrl = _a.imageUrl,
|
|
@@ -23661,6 +23754,8 @@
|
|
|
23661
23754
|
captureAudio = _d === void 0 ? false : _d,
|
|
23662
23755
|
_e = _a.minSignaturePadPoints,
|
|
23663
23756
|
minSignaturePadPoints = _e === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _e,
|
|
23757
|
+
signaturePadEmptyContent = _a.signaturePadEmptyContent,
|
|
23758
|
+
headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
|
|
23664
23759
|
_f = _a.allowSignatureAfterLivenessCheckFailure,
|
|
23665
23760
|
allowSignatureAfterLivenessCheckFailure = _f === void 0 ? false : _f,
|
|
23666
23761
|
_g = _a.restartVideoOnSignaturePadCleared,
|
|
@@ -23693,7 +23788,7 @@
|
|
|
23693
23788
|
var operationStartedAt = React.useRef();
|
|
23694
23789
|
var captureStartedAt = React.useRef();
|
|
23695
23790
|
var captureEndedAt = React.useRef();
|
|
23696
|
-
var _q =
|
|
23791
|
+
var _q = useSelfieGuidanceModelsContext(),
|
|
23697
23792
|
start = _q.start,
|
|
23698
23793
|
stop = _q.stop;
|
|
23699
23794
|
React.useEffect(function () {
|
|
@@ -23708,9 +23803,9 @@
|
|
|
23708
23803
|
if (!shouldRun) return;
|
|
23709
23804
|
start();
|
|
23710
23805
|
return function () {
|
|
23711
|
-
stop();
|
|
23806
|
+
return stop();
|
|
23712
23807
|
};
|
|
23713
|
-
}, [
|
|
23808
|
+
}, [start, stop, shouldRun]);
|
|
23714
23809
|
var logCaptureMetadata = React.useCallback(function () {
|
|
23715
23810
|
var _a, _b, _c;
|
|
23716
23811
|
logSelfieCaptureAttempt({
|
|
@@ -23741,12 +23836,16 @@
|
|
|
23741
23836
|
setCaptureState('SUCCESS');
|
|
23742
23837
|
onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(videoData, signatureData, signatureImageData);
|
|
23743
23838
|
}, [onVideoCaptured, setSignatureData, setSignatureVideoUrl]);
|
|
23839
|
+
var _s = React.useState(true),
|
|
23840
|
+
showLoadingOverlay = _s[0],
|
|
23841
|
+
setShowLoadingOverlay = _s[1];
|
|
23744
23842
|
var onSignatureCaptureFacesNotDetected = React.useCallback(function () {
|
|
23843
|
+
setShowLoadingOverlay(false);
|
|
23745
23844
|
setCaptureState('CHECKING_LIVENESS');
|
|
23746
23845
|
}, []);
|
|
23747
|
-
var
|
|
23748
|
-
attempt =
|
|
23749
|
-
setAttempt =
|
|
23846
|
+
var _t = React.useState(0),
|
|
23847
|
+
attempt = _t[0],
|
|
23848
|
+
setAttempt = _t[1];
|
|
23750
23849
|
var onRetry = React.useCallback(function () {
|
|
23751
23850
|
onRetryClicked === null || onRetryClicked === void 0 ? void 0 : onRetryClicked();
|
|
23752
23851
|
setAttempt(function (n) {
|
|
@@ -23766,9 +23865,10 @@
|
|
|
23766
23865
|
var guidesComponent = React.useCallback(function (props) {
|
|
23767
23866
|
return /*#__PURE__*/React.createElement(VideoSignatureWizardGuides, _assign({}, props, {
|
|
23768
23867
|
classNames: classNames === null || classNames === void 0 ? void 0 : classNames.videoSignatureGuidesClassNames,
|
|
23769
|
-
restartVideoOnSignaturePadCleared: restartVideoOnSignaturePadCleared
|
|
23868
|
+
restartVideoOnSignaturePadCleared: restartVideoOnSignaturePadCleared,
|
|
23869
|
+
signaturePadEmptyContent: signaturePadEmptyContent
|
|
23770
23870
|
}));
|
|
23771
|
-
}, [classNames === null || classNames === void 0 ? void 0 : classNames.videoSignatureGuidesClassNames, restartVideoOnSignaturePadCleared]);
|
|
23871
|
+
}, [classNames === null || classNames === void 0 ? void 0 : classNames.videoSignatureGuidesClassNames, restartVideoOnSignaturePadCleared, signaturePadEmptyContent]);
|
|
23772
23872
|
var onExitAfterFailureProp = faceLivenessProps === null || faceLivenessProps === void 0 ? void 0 : faceLivenessProps.onExitAfterFailure;
|
|
23773
23873
|
var onExitAfterFailure = React.useCallback(function (resp, req) {
|
|
23774
23874
|
onExitAfterFailureProp === null || onExitAfterFailureProp === void 0 ? void 0 : onExitAfterFailureProp(resp, req);
|
|
@@ -23804,7 +23904,8 @@
|
|
|
23804
23904
|
colors: colors.faceLiveness,
|
|
23805
23905
|
verbiage: verbiage.faceLiveness,
|
|
23806
23906
|
debugMode: debugMode,
|
|
23807
|
-
renderCameraFeed: false
|
|
23907
|
+
renderCameraFeed: false,
|
|
23908
|
+
showLoadingOverlay: showLoadingOverlay
|
|
23808
23909
|
}));
|
|
23809
23910
|
case 'CAPTURING_SIGNATURE':
|
|
23810
23911
|
return /*#__PURE__*/React.createElement(VideoSignatureCapture, {
|
|
@@ -23812,6 +23913,8 @@
|
|
|
23812
23913
|
onFaceNotDetected: onSignatureCaptureFacesNotDetected,
|
|
23813
23914
|
onExit: onExitCapture,
|
|
23814
23915
|
minSignaturePadPoints: minSignaturePadPoints,
|
|
23916
|
+
signaturePadEmptyContent: signaturePadEmptyContent,
|
|
23917
|
+
headTrackingUnsatisfiedContent: headTrackingUnsatisfiedContent,
|
|
23815
23918
|
restartVideoOnSignaturePadCleared: restartVideoOnSignaturePadCleared,
|
|
23816
23919
|
guidesComponent: guidesComponent,
|
|
23817
23920
|
classNames: classNames,
|
|
@@ -23836,18 +23939,17 @@
|
|
|
23836
23939
|
};
|
|
23837
23940
|
function VideoSignatureWizardGuides(_a) {
|
|
23838
23941
|
var status = _a.status,
|
|
23839
|
-
classNames = _a.classNames,
|
|
23840
23942
|
_b = _a.restartVideoOnSignaturePadCleared,
|
|
23841
|
-
restartVideoOnSignaturePadCleared = _b === void 0 ? true : _b
|
|
23943
|
+
restartVideoOnSignaturePadCleared = _b === void 0 ? true : _b,
|
|
23944
|
+
props = __rest(_a, ["status", "restartVideoOnSignaturePadCleared"]);
|
|
23842
23945
|
var clearRecordedData = useVideoSignatureContext().clearRecordedData;
|
|
23843
|
-
return /*#__PURE__*/React.createElement(VideoSignatureGuides, {
|
|
23844
|
-
classNames: classNames,
|
|
23946
|
+
return /*#__PURE__*/React.createElement(VideoSignatureGuides, _assign({}, props, {
|
|
23845
23947
|
faceGuideStatus: status,
|
|
23846
23948
|
requestedAction: status === 'success' ? 'CAPTURE_SIGNATURE' : 'VERIFY_LIVENESS',
|
|
23847
23949
|
onClearSignaturePadClicked: restartVideoOnSignaturePadCleared ? function () {
|
|
23848
23950
|
return setTimeout(clearRecordedData, 100);
|
|
23849
23951
|
} : undefined
|
|
23850
|
-
});
|
|
23952
|
+
}));
|
|
23851
23953
|
}
|
|
23852
23954
|
var VideoSignatureWizardWithProviders = function VideoSignatureWizardWithProviders(props) {
|
|
23853
23955
|
var _a, _b;
|
|
@@ -24147,103 +24249,103 @@
|
|
|
24147
24249
|
flipShortcutThreshold: 0.7
|
|
24148
24250
|
};
|
|
24149
24251
|
var IdVideoCapture = function IdVideoCapture(_a) {
|
|
24150
|
-
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
|
24252
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
24151
24253
|
var onComplete = _a.onComplete,
|
|
24152
24254
|
onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
|
|
24153
24255
|
onIdBackImageCaptured = _a.onIdBackImageCaptured,
|
|
24154
24256
|
onFaceNotDetected = _a.onFaceNotDetected,
|
|
24155
24257
|
onRecordingFailed = _a.onRecordingFailed,
|
|
24156
24258
|
onExitCapture = _a.onExitCapture,
|
|
24157
|
-
|
|
24158
|
-
idCaptureModelsEnabled =
|
|
24159
|
-
|
|
24160
|
-
idDocumentType =
|
|
24161
|
-
|
|
24162
|
-
idCaptureGuideImages =
|
|
24163
|
-
|
|
24164
|
-
idCardFrontDelay =
|
|
24165
|
-
|
|
24166
|
-
videoIdCaptureThresholds =
|
|
24167
|
-
|
|
24168
|
-
skipShowIdCardBack =
|
|
24169
|
-
|
|
24170
|
-
captureCountdownSeconds =
|
|
24259
|
+
_r = _a.idCaptureModelsEnabled,
|
|
24260
|
+
idCaptureModelsEnabled = _r === void 0 ? true : _r,
|
|
24261
|
+
_s = _a.idDocumentType,
|
|
24262
|
+
idDocumentType = _s === void 0 ? 'idCard' : _s,
|
|
24263
|
+
_t = _a.idCaptureGuideImages,
|
|
24264
|
+
idCaptureGuideImages = _t === void 0 ? defaultIdCaptureGuideImages : _t,
|
|
24265
|
+
_u = _a.idCardFrontDelay,
|
|
24266
|
+
idCardFrontDelay = _u === void 0 ? 1000 : _u,
|
|
24267
|
+
_v = _a.videoIdCaptureThresholds,
|
|
24268
|
+
videoIdCaptureThresholds = _v === void 0 ? defaultVideoIdCaptureThresholds : _v,
|
|
24269
|
+
_w = _a.skipShowIdCardBack,
|
|
24270
|
+
skipShowIdCardBack = _w === void 0 ? false : _w,
|
|
24271
|
+
_x = _a.captureCountdownSeconds,
|
|
24272
|
+
captureCountdownSeconds = _x === void 0 ? 3 : _x,
|
|
24171
24273
|
readTextPrompt = _a.readTextPrompt,
|
|
24172
|
-
|
|
24173
|
-
readTextTimeoutDurationMs =
|
|
24174
|
-
|
|
24175
|
-
readTextMinReadingMs =
|
|
24176
|
-
|
|
24177
|
-
disableFaceDetectionWhileAudioCapture =
|
|
24178
|
-
|
|
24179
|
-
disableFaceDetectionWhileAudioCaptureMsDelay =
|
|
24180
|
-
|
|
24181
|
-
mergeAVStreams =
|
|
24182
|
-
|
|
24183
|
-
classNames =
|
|
24184
|
-
|
|
24185
|
-
colors =
|
|
24186
|
-
|
|
24187
|
-
rawVerbiage =
|
|
24188
|
-
|
|
24189
|
-
debugMode =
|
|
24190
|
-
var
|
|
24191
|
-
ref =
|
|
24192
|
-
|
|
24193
|
-
width =
|
|
24194
|
-
|
|
24195
|
-
height =
|
|
24196
|
-
var
|
|
24197
|
-
camera =
|
|
24198
|
-
videoRef =
|
|
24199
|
-
videoLoaded =
|
|
24200
|
-
cameraReady =
|
|
24201
|
-
microphoneReady =
|
|
24202
|
-
audioStream =
|
|
24203
|
-
isRearFacing =
|
|
24204
|
-
releaseCameraAccess =
|
|
24205
|
-
var
|
|
24206
|
-
detectedObjects =
|
|
24207
|
-
setDetectedObjects =
|
|
24208
|
-
var
|
|
24209
|
-
face =
|
|
24210
|
-
setFace =
|
|
24211
|
-
var
|
|
24212
|
-
idModelsReady =
|
|
24213
|
-
startIdModels =
|
|
24214
|
-
stopIdModels =
|
|
24215
|
-
onIdPredictionMade =
|
|
24216
|
-
setThresholds =
|
|
24217
|
-
setRequiredDocumentType =
|
|
24218
|
-
setDocumentDetectionBoundaries =
|
|
24219
|
-
bestFrameDetails =
|
|
24220
|
-
resetBestFrame =
|
|
24221
|
-
idModelError =
|
|
24222
|
-
var
|
|
24223
|
-
videoStartsAt =
|
|
24224
|
-
setVideoStartsAt =
|
|
24225
|
-
var
|
|
24226
|
-
setIdCaptureVideoAudioStartsAt =
|
|
24227
|
-
setExpectedAudioText =
|
|
24228
|
-
var
|
|
24229
|
-
startSelfieGuidance =
|
|
24230
|
-
stopSelfieGuidance =
|
|
24231
|
-
onSelfiePredictionMade =
|
|
24232
|
-
selfieModelError =
|
|
24233
|
-
var
|
|
24234
|
-
isRecordingVideo =
|
|
24235
|
-
startRecordingVideo =
|
|
24236
|
-
startRecordingAudio =
|
|
24237
|
-
stopRecordingVideo =
|
|
24238
|
-
stopRecordingAudio =
|
|
24239
|
-
videoRecordingUnintentionallyStopped =
|
|
24240
|
-
audioRecordingUnintentionallyStopped =
|
|
24241
|
-
videoUrl =
|
|
24242
|
-
audioUrl =
|
|
24274
|
+
_y = _a.readTextTimeoutDurationMs,
|
|
24275
|
+
readTextTimeoutDurationMs = _y === void 0 ? 15000 : _y,
|
|
24276
|
+
_z = _a.readTextMinReadingMs,
|
|
24277
|
+
readTextMinReadingMs = _z === void 0 ? 10000 : _z,
|
|
24278
|
+
_0 = _a.disableFaceDetectionWhileAudioCapture,
|
|
24279
|
+
disableFaceDetectionWhileAudioCapture = _0 === void 0 ? false : _0,
|
|
24280
|
+
_1 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
|
|
24281
|
+
disableFaceDetectionWhileAudioCaptureMsDelay = _1 === void 0 ? 2000 : _1,
|
|
24282
|
+
_2 = _a.mergeAVStreams,
|
|
24283
|
+
mergeAVStreams = _2 === void 0 ? false : _2,
|
|
24284
|
+
_3 = _a.classNames,
|
|
24285
|
+
classNames = _3 === void 0 ? {} : _3,
|
|
24286
|
+
_4 = _a.colors,
|
|
24287
|
+
colors = _4 === void 0 ? {} : _4,
|
|
24288
|
+
_5 = _a.verbiage,
|
|
24289
|
+
rawVerbiage = _5 === void 0 ? {} : _5,
|
|
24290
|
+
_6 = _a.debugMode,
|
|
24291
|
+
debugMode = _6 === void 0 ? false : _6;
|
|
24292
|
+
var _7 = useResizeObserver(),
|
|
24293
|
+
ref = _7.ref,
|
|
24294
|
+
_8 = _7.width,
|
|
24295
|
+
width = _8 === void 0 ? 1 : _8,
|
|
24296
|
+
_9 = _7.height,
|
|
24297
|
+
height = _9 === void 0 ? 1 : _9;
|
|
24298
|
+
var _10 = useCameraStore(),
|
|
24299
|
+
camera = _10.camera,
|
|
24300
|
+
videoRef = _10.videoRef,
|
|
24301
|
+
videoLoaded = _10.videoLoaded,
|
|
24302
|
+
cameraReady = _10.cameraReady,
|
|
24303
|
+
microphoneReady = _10.microphoneReady,
|
|
24304
|
+
audioStream = _10.audioStream,
|
|
24305
|
+
isRearFacing = _10.isRearFacing,
|
|
24306
|
+
releaseCameraAccess = _10.releaseCameraAccess;
|
|
24307
|
+
var _11 = React.useState([]),
|
|
24308
|
+
detectedObjects = _11[0],
|
|
24309
|
+
setDetectedObjects = _11[1];
|
|
24310
|
+
var _12 = React.useState(null),
|
|
24311
|
+
face = _12[0],
|
|
24312
|
+
setFace = _12[1];
|
|
24313
|
+
var _13 = React.useContext(IdCaptureModelsContext),
|
|
24314
|
+
idModelsReady = _13.ready,
|
|
24315
|
+
startIdModels = _13.start,
|
|
24316
|
+
stopIdModels = _13.stop,
|
|
24317
|
+
onIdPredictionMade = _13.onPredictionMade,
|
|
24318
|
+
setThresholds = _13.setThresholds,
|
|
24319
|
+
setRequiredDocumentType = _13.setRequiredDocumentType,
|
|
24320
|
+
setDocumentDetectionBoundaries = _13.setDocumentDetectionBoundaries,
|
|
24321
|
+
bestFrameDetails = _13.bestFrameDetails,
|
|
24322
|
+
resetBestFrame = _13.resetBestFrame,
|
|
24323
|
+
idModelError = _13.modelError;
|
|
24324
|
+
var _14 = React.useState(null),
|
|
24325
|
+
videoStartsAt = _14[0],
|
|
24326
|
+
setVideoStartsAt = _14[1];
|
|
24327
|
+
var _15 = React.useContext(SubmissionContext),
|
|
24328
|
+
setIdCaptureVideoAudioStartsAt = _15.setIdCaptureVideoAudioStartsAt,
|
|
24329
|
+
setExpectedAudioText = _15.setExpectedAudioText;
|
|
24330
|
+
var _16 = React.useContext(SelfieGuidanceModelsContext),
|
|
24331
|
+
startSelfieGuidance = _16.start,
|
|
24332
|
+
stopSelfieGuidance = _16.stop,
|
|
24333
|
+
onSelfiePredictionMade = _16.onPredictionMade,
|
|
24334
|
+
selfieModelError = _16.error;
|
|
24335
|
+
var _17 = useVideoRecorder(camera, audioStream, mergeAVStreams),
|
|
24336
|
+
isRecordingVideo = _17.isRecordingVideo,
|
|
24337
|
+
startRecordingVideo = _17.startRecordingVideo,
|
|
24338
|
+
startRecordingAudio = _17.startRecordingAudio,
|
|
24339
|
+
stopRecordingVideo = _17.stopRecordingVideo,
|
|
24340
|
+
stopRecordingAudio = _17.stopRecordingAudio,
|
|
24341
|
+
videoRecordingUnintentionallyStopped = _17.videoRecordingUnintentionallyStopped,
|
|
24342
|
+
audioRecordingUnintentionallyStopped = _17.audioRecordingUnintentionallyStopped,
|
|
24343
|
+
videoUrl = _17.videoUrl,
|
|
24344
|
+
audioUrl = _17.audioUrl;
|
|
24243
24345
|
var countdownTimeoutRef = React.useRef(undefined);
|
|
24244
|
-
var
|
|
24245
|
-
countdownRemaining =
|
|
24246
|
-
setCountdownRemaining =
|
|
24346
|
+
var _18 = React.useState(-1),
|
|
24347
|
+
countdownRemaining = _18[0],
|
|
24348
|
+
setCountdownRemaining = _18[1];
|
|
24247
24349
|
React.useEffect(function () {
|
|
24248
24350
|
if (!isRecordingVideo && !videoUrl) {
|
|
24249
24351
|
startRecordingVideo();
|
|
@@ -24263,9 +24365,9 @@
|
|
|
24263
24365
|
onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
|
|
24264
24366
|
}
|
|
24265
24367
|
}, [audioRecordingUnintentionallyStopped, microphoneReady, onRecordingFailed, readTextPrompt, videoRecordingUnintentionallyStopped]);
|
|
24266
|
-
var
|
|
24267
|
-
requestedAction =
|
|
24268
|
-
setRequestedAction =
|
|
24368
|
+
var _19 = React.useState(idDocumentType === 'idCard' ? 'SHOW_ID_FRONT' : 'SHOW_PASSPORT'),
|
|
24369
|
+
requestedAction = _19[0],
|
|
24370
|
+
setRequestedAction = _19[1];
|
|
24269
24371
|
var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
|
|
24270
24372
|
React.useEffect(function startModelsWhenCapturing() {
|
|
24271
24373
|
if (!shouldRunIdModels) return;
|
|
@@ -24304,23 +24406,23 @@
|
|
|
24304
24406
|
bottom: 0
|
|
24305
24407
|
});
|
|
24306
24408
|
}, [setDocumentDetectionBoundaries]);
|
|
24307
|
-
var
|
|
24308
|
-
currentDetectionScore =
|
|
24309
|
-
setCurrentDetectionScore =
|
|
24310
|
-
var
|
|
24311
|
-
currentDetectedDocumentType =
|
|
24312
|
-
setCurrentDetectedDocumentType =
|
|
24313
|
-
var
|
|
24314
|
-
currentFocusScore =
|
|
24315
|
-
setCurrentFocusScore =
|
|
24316
|
-
var
|
|
24317
|
-
goodFramesCount =
|
|
24318
|
-
setGoodFramesCount =
|
|
24409
|
+
var _20 = React.useState(0),
|
|
24410
|
+
currentDetectionScore = _20[0],
|
|
24411
|
+
setCurrentDetectionScore = _20[1];
|
|
24412
|
+
var _21 = React.useState('none'),
|
|
24413
|
+
currentDetectedDocumentType = _21[0],
|
|
24414
|
+
setCurrentDetectedDocumentType = _21[1];
|
|
24415
|
+
var _22 = React.useState(0),
|
|
24416
|
+
currentFocusScore = _22[0],
|
|
24417
|
+
setCurrentFocusScore = _22[1];
|
|
24418
|
+
var _23 = React.useState(0),
|
|
24419
|
+
goodFramesCount = _23[0],
|
|
24420
|
+
setGoodFramesCount = _23[1];
|
|
24319
24421
|
var goodFramesThreshold = requestedAction === 'SHOW_PASSPORT' ? adjustedThresholds.goodFrames.passport : requestedAction === 'SHOW_ID_FRONT' ? adjustedThresholds.goodFrames.idCardFront : adjustedThresholds.goodFrames.idCardBack;
|
|
24320
24422
|
var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
|
|
24321
|
-
var
|
|
24322
|
-
isSinglePage =
|
|
24323
|
-
setIsSinglePage =
|
|
24423
|
+
var _24 = React.useState(false),
|
|
24424
|
+
isSinglePage = _24[0],
|
|
24425
|
+
setIsSinglePage = _24[1];
|
|
24324
24426
|
React.useEffect(function () {
|
|
24325
24427
|
if (!idCaptureModelsEnabled || idModelError) return;
|
|
24326
24428
|
onIdPredictionMade(function (prediction) {
|
|
@@ -24340,9 +24442,9 @@
|
|
|
24340
24442
|
} : 0);
|
|
24341
24443
|
});
|
|
24342
24444
|
}, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, adjustedThresholds.flipShortcutThreshold]);
|
|
24343
|
-
var
|
|
24344
|
-
idFrontCaptureStartedAt =
|
|
24345
|
-
setFirstGoodFrameTime =
|
|
24445
|
+
var _25 = React.useState(null),
|
|
24446
|
+
idFrontCaptureStartedAt = _25[0],
|
|
24447
|
+
setFirstGoodFrameTime = _25[1];
|
|
24346
24448
|
React.useEffect(function () {
|
|
24347
24449
|
if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
|
|
24348
24450
|
}, [goodFramesCount]);
|
|
@@ -24363,9 +24465,9 @@
|
|
|
24363
24465
|
var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
|
|
24364
24466
|
var faceBox = face === null || face === void 0 ? void 0 : face.box;
|
|
24365
24467
|
var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
|
|
24366
|
-
var
|
|
24367
|
-
countdownStartedAt =
|
|
24368
|
-
setCountdownStartedAt =
|
|
24468
|
+
var _26 = React.useState(),
|
|
24469
|
+
countdownStartedAt = _26[0],
|
|
24470
|
+
setCountdownStartedAt = _26[1];
|
|
24369
24471
|
var photoCanvas = React.useRef(null);
|
|
24370
24472
|
var frameLock = React.useRef(false);
|
|
24371
24473
|
var captureFrame = React.useCallback(function () {
|
|
@@ -24475,9 +24577,9 @@
|
|
|
24475
24577
|
stopSelfieGuidance();
|
|
24476
24578
|
};
|
|
24477
24579
|
}, [startSelfieGuidance, stopSelfieGuidance]);
|
|
24478
|
-
var
|
|
24479
|
-
numFramesWithoutFaces =
|
|
24480
|
-
setNumFramesWithoutFaces =
|
|
24580
|
+
var _27 = React.useState(0),
|
|
24581
|
+
numFramesWithoutFaces = _27[0],
|
|
24582
|
+
setNumFramesWithoutFaces = _27[1];
|
|
24481
24583
|
onSelfiePredictionMade(f(React.useCallback(function (_a) {
|
|
24482
24584
|
var face = _a.face;
|
|
24483
24585
|
if (selfieModelError) return;
|
|
@@ -24493,18 +24595,16 @@
|
|
|
24493
24595
|
}
|
|
24494
24596
|
}, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
|
|
24495
24597
|
var theme = styled.useTheme();
|
|
24496
|
-
var
|
|
24598
|
+
var _28 = useTranslations(rawVerbiage, {
|
|
24497
24599
|
faceNotCenteredText: 'Please move your face to the center...',
|
|
24498
24600
|
captureBtnText: 'Capture'
|
|
24499
24601
|
}),
|
|
24500
|
-
captureBtnText =
|
|
24501
|
-
faceNotCenteredText =
|
|
24602
|
+
captureBtnText = _28.captureBtnText,
|
|
24603
|
+
faceNotCenteredText = _28.faceNotCenteredText;
|
|
24502
24604
|
var debugScalingDetails = useDebugScalingDetails({
|
|
24503
24605
|
enabled: debugMode,
|
|
24504
24606
|
pageWidth: width,
|
|
24505
|
-
pageHeight: height
|
|
24506
|
-
videoWidth: (_g = (_f = videoRef.current) === null || _f === void 0 ? void 0 : _f.videoWidth) !== null && _g !== void 0 ? _g : 0,
|
|
24507
|
-
videoHeight: (_j = (_h = videoRef.current) === null || _h === void 0 ? void 0 : _h.videoHeight) !== null && _j !== void 0 ? _j : 0
|
|
24607
|
+
pageHeight: height
|
|
24508
24608
|
});
|
|
24509
24609
|
var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK', 'SHOW_PASSPORT'].includes(requestedAction);
|
|
24510
24610
|
var guidanceText = !faceCentered ? faceNotCenteredText : undefined;
|
|
@@ -24549,9 +24649,9 @@
|
|
|
24549
24649
|
className: classNames.guidanceMessageContainer
|
|
24550
24650
|
}, /*#__PURE__*/React.createElement(GuidanceMessage, {
|
|
24551
24651
|
className: classNames.guidanceMessage,
|
|
24552
|
-
"$background": (
|
|
24553
|
-
"$textColor": (
|
|
24554
|
-
}, guidanceText))), debugMode && ( /*#__PURE__*/React.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React.createElement(React.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React.createElement("br", null), "Best Frame Detection Score:", ' ', (
|
|
24652
|
+
"$background": (_h = (_g = (_f = theme.guidanceMessages) === null || _f === void 0 ? void 0 : _f.negative) === null || _g === void 0 ? void 0 : _g.backgroundColor) !== null && _h !== void 0 ? _h : 'red',
|
|
24653
|
+
"$textColor": (_l = (_k = (_j = theme.guidanceMessages) === null || _j === void 0 ? void 0 : _j.negative) === null || _k === void 0 ? void 0 : _k.textColor) !== null && _l !== void 0 ? _l : 'white'
|
|
24654
|
+
}, guidanceText))), debugMode && ( /*#__PURE__*/React.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React.createElement(React.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React.createElement("br", null), "Best Frame Detection Score:", ' ', (_o = (_m = bestFrameDetails.current) === null || _m === void 0 ? void 0 : _m.detectionScore) !== null && _o !== void 0 ? _o : 0, /*#__PURE__*/React.createElement("br", null), "Best Frame Focus Score: ", (_q = (_p = bestFrameDetails.current) === null || _p === void 0 ? void 0 : _p.focusScore) !== null && _q !== void 0 ? _q : 0)), countdownRemaining > 0 && capturingId && ( /*#__PURE__*/React.createElement(CountdownContainer, {
|
|
24555
24655
|
className: classNames.countdownContainer
|
|
24556
24656
|
}, /*#__PURE__*/React.createElement(Countdown, {
|
|
24557
24657
|
className: classNames.countdown
|
|
@@ -27537,6 +27637,8 @@
|
|
|
27537
27637
|
idCardForFaceMatch = _a.idCardForFaceMatch,
|
|
27538
27638
|
_f = _a.minSignaturePadPoints,
|
|
27539
27639
|
minSignaturePadPoints = _f === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _f,
|
|
27640
|
+
signaturePadEmptyContent = _a.signaturePadEmptyContent,
|
|
27641
|
+
headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
|
|
27540
27642
|
_g = _a.modelLoadTimeoutMs,
|
|
27541
27643
|
modelLoadTimeoutMs = _g === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _g,
|
|
27542
27644
|
_h = _a.allowSignatureAfterLivenessCheckFailure,
|
|
@@ -27597,6 +27699,8 @@
|
|
|
27597
27699
|
skipSuccessScreen: skipSuccessScreen,
|
|
27598
27700
|
captureAudio: captureAudio,
|
|
27599
27701
|
minSignaturePadPoints: minSignaturePadPoints,
|
|
27702
|
+
signaturePadEmptyContent: signaturePadEmptyContent,
|
|
27703
|
+
headTrackingUnsatisfiedContent: headTrackingUnsatisfiedContent,
|
|
27600
27704
|
modelLoadTimeoutMs: modelLoadTimeoutMs,
|
|
27601
27705
|
faceLivenessProps: faceLivenessProps,
|
|
27602
27706
|
allowSignatureAfterLivenessCheckFailure: allowSignatureAfterLivenessCheckFailure,
|
|
@@ -27608,7 +27712,7 @@
|
|
|
27608
27712
|
onModelError: onModelError,
|
|
27609
27713
|
onUserCancel: onUserCancel
|
|
27610
27714
|
};
|
|
27611
|
-
}, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
|
|
27715
|
+
}, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, signaturePadEmptyContent, headTrackingUnsatisfiedContent, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
|
|
27612
27716
|
})))));
|
|
27613
27717
|
};
|
|
27614
27718
|
|