idmission-web-sdk 2.3.3 → 2.3.5

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.
Files changed (33) hide show
  1. package/dist/components/common/debug.d.ts +1 -3
  2. package/dist/components/common/debug.d.ts.map +1 -1
  3. package/dist/components/common/signature.d.ts.map +1 -1
  4. package/dist/components/customer_flows/SignatureKYC.d.ts +2 -0
  5. package/dist/components/customer_flows/SignatureKYC.d.ts.map +1 -1
  6. package/dist/components/face_liveness/FaceLivenessWizard.d.ts +2 -1
  7. package/dist/components/face_liveness/FaceLivenessWizard.d.ts.map +1 -1
  8. package/dist/components/id_capture/IdCapture.d.ts.map +1 -1
  9. package/dist/components/selfie_capture/SelfieCapture.d.ts.map +1 -1
  10. package/dist/components/selfie_capture/SelfieGuidanceModelsProvider.d.ts.map +1 -1
  11. package/dist/components/video_id/IdVideoCapture.d.ts.map +1 -1
  12. package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts +2 -1
  13. package/dist/components/video_signature_capture/VideoSignatureCapture.d.ts.map +1 -1
  14. package/dist/components/video_signature_capture/VideoSignatureGuides.d.ts +4 -1
  15. package/dist/components/video_signature_capture/VideoSignatureGuides.d.ts.map +1 -1
  16. package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts +2 -1
  17. package/dist/components/video_signature_capture/VideoSignatureWizard.d.ts.map +1 -1
  18. package/dist/lib/camera/cameraStore.d.ts +2 -0
  19. package/dist/lib/camera/cameraStore.d.ts.map +1 -1
  20. package/dist/sdk2.cjs.development.js +456 -374
  21. package/dist/sdk2.cjs.development.js.map +1 -1
  22. package/dist/sdk2.cjs.production.js +1 -1
  23. package/dist/sdk2.cjs.production.js.map +1 -1
  24. package/dist/sdk2.esm.js +456 -374
  25. package/dist/sdk2.esm.js.map +1 -1
  26. package/dist/sdk2.umd.development.js +456 -374
  27. package/dist/sdk2.umd.development.js.map +1 -1
  28. package/dist/sdk2.umd.production.js +1 -1
  29. package/dist/sdk2.umd.production.js.map +1 -1
  30. package/dist/themes/index.d.ts +3 -0
  31. package/dist/themes/index.d.ts.map +1 -1
  32. package/dist/version.d.ts +1 -1
  33. package/package.json +3 -3
@@ -235,7 +235,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
235
235
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
236
236
  };
237
237
 
238
- var webSdkVersion = '2.3.3';
238
+ var webSdkVersion = '2.3.5';
239
239
 
240
240
  function getPlatform() {
241
241
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -455,18 +455,18 @@ var LoaderButton = function LoaderButton(_a) {
455
455
  className: "ladda-label"
456
456
  }, children));
457
457
  };
458
- var StyledButton = styled__default.default.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) {
458
+ var StyledButton = styled__default.default.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) {
459
459
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
460
460
  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 ");
461
461
  });
462
- var templateObject_1$P;
462
+ var templateObject_1$Q;
463
463
 
464
- var ButtonsRow$2 = styled__default.default.div(templateObject_1$O || (templateObject_1$O = __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"])));
465
- var templateObject_1$O;
464
+ var ButtonsRow$2 = styled__default.default.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"])));
465
+ var templateObject_1$P;
466
466
 
467
- var GuidanceMessageContainerDiv = styled__default.default.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n"])), function (_a) {
467
+ var GuidanceMessageContainerDiv = styled__default.default.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) {
468
468
  var $top = _a.$top;
469
- return $top !== null && $top !== void 0 ? $top : '10vh';
469
+ return $top !== null && $top !== void 0 ? $top : '10%';
470
470
  }, function (_a) {
471
471
  var $bottom = _a.$bottom;
472
472
  return $bottom ? "bottom: ".concat($bottom, ";") : "";
@@ -484,15 +484,15 @@ var GuidanceMessage = styled__default.default.div(templateObject_2$F || (templat
484
484
  var _a, _b, _c, _d, _e, _f;
485
485
  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';
486
486
  });
487
- var templateObject_1$N, templateObject_2$F;
487
+ var templateObject_1$O, templateObject_2$F;
488
488
 
489
- var wavesAnimation = styled.keyframes(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"], ["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"])));
489
+ 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"])));
490
490
  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"])));
491
491
  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"])));
492
492
  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"])));
493
- var templateObject_1$M, templateObject_2$E, templateObject_3$s, templateObject_4$m;
493
+ var templateObject_1$N, templateObject_2$E, templateObject_3$s, templateObject_4$m;
494
494
 
495
- var OverlayContainer = styled__default.default.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"])), function (props) {
495
+ var OverlayContainer = styled__default.default.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) {
496
496
  return props.theme.background ? "".concat(props.theme.background) : "white";
497
497
  }, function (props) {
498
498
  return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
@@ -537,7 +537,7 @@ var LoadingOverlayLoadingListContainer = styled__default.default.div(templateObj
537
537
  var LoadingOverlayLoadingList = styled__default.default.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"])));
538
538
  var LoadingOverlayLoadingListItem = styled__default.default.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"])));
539
539
  var LoadingOverlayProgressContainer = styled__default.default.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"])));
540
- var templateObject_1$L, 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;
540
+ 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;
541
541
 
542
542
  var GeolocationAccessDeniedOverlay = function GeolocationAccessDeniedOverlay(_a) {
543
543
  var accessBlockedImageUrl = _a.accessBlockedImageUrl;
@@ -2166,7 +2166,7 @@ function getFrameDimensions(frame) {
2166
2166
  return [frameWidth, frameHeight];
2167
2167
  }
2168
2168
 
2169
- var InvisibleCanvas = styled__default.default.canvas(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
2169
+ var InvisibleCanvas = styled__default.default.canvas(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
2170
2170
  function drawToCanvas(canvas, frame, width, height) {
2171
2171
  if (!canvas) return;
2172
2172
  var ctx = canvas.getContext('2d');
@@ -2186,7 +2186,7 @@ function clearCanvas(canvas) {
2186
2186
  var _a;
2187
2187
  (_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);
2188
2188
  }
2189
- var templateObject_1$K;
2189
+ var templateObject_1$L;
2190
2190
 
2191
2191
  function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
2192
2192
  if (quality === void 0) {
@@ -4732,6 +4732,8 @@ var initialState$5 = {
4732
4732
  videoLoaded: false,
4733
4733
  videoStream: null,
4734
4734
  videoDevice: null,
4735
+ videoWidth: 0,
4736
+ videoHeight: 0,
4735
4737
  isRearFacing: false,
4736
4738
  camera: null,
4737
4739
  cameraReady: false,
@@ -5064,25 +5066,26 @@ var createCameraStore = function createCameraStore(config) {
5064
5066
  };
5065
5067
  var CameraStoreContext = /*#__PURE__*/React.createContext(undefined);
5066
5068
  function CameraStoreProvider(_a) {
5069
+ var _b;
5067
5070
  var children = _a.children,
5068
- _b = _a.requestAccessAutomatically,
5069
- requestAccessAutomatically = _b === void 0 ? true : _b,
5070
- _c = _a.preferIphoneContinuityCamera,
5071
- preferIphoneContinuityCamera = _c === void 0 ? true : _c,
5072
- _d = _a.preferFrontFacingCamera,
5073
- preferFrontFacingCamera = _d === void 0 ? false : _d,
5074
- _e = _a.maxVideoWidth,
5075
- maxVideoWidth = _e === void 0 ? 1920 : _e,
5071
+ _c = _a.requestAccessAutomatically,
5072
+ requestAccessAutomatically = _c === void 0 ? true : _c,
5073
+ _d = _a.preferIphoneContinuityCamera,
5074
+ preferIphoneContinuityCamera = _d === void 0 ? true : _d,
5075
+ _e = _a.preferFrontFacingCamera,
5076
+ preferFrontFacingCamera = _e === void 0 ? false : _e,
5077
+ _f = _a.maxVideoWidth,
5078
+ maxVideoWidth = _f === void 0 ? 1920 : _f,
5076
5079
  maxFps = _a.maxFps,
5077
5080
  onCameraAccessDenied = _a.onCameraAccessDenied,
5078
5081
  onCameraTamperingDetected = _a.onCameraTamperingDetected,
5079
5082
  onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
5080
- _f = _a.requireMicrophoneAccess,
5081
- requireMicrophoneAccess = _f === void 0 ? false : _f,
5082
- _g = _a.classNames,
5083
- classNames = _g === void 0 ? {} : _g,
5084
- _h = _a.verbiage,
5085
- verbiage = _h === void 0 ? {} : _h;
5083
+ _g = _a.requireMicrophoneAccess,
5084
+ requireMicrophoneAccess = _g === void 0 ? false : _g,
5085
+ _h = _a.classNames,
5086
+ classNames = _h === void 0 ? {} : _h,
5087
+ _j = _a.verbiage,
5088
+ verbiage = _j === void 0 ? {} : _j;
5086
5089
  var videoRef = React.useRef(null);
5087
5090
  var store = React.useRef();
5088
5091
  store.current || (store.current = createCameraStore({
@@ -5096,6 +5099,16 @@ function CameraStoreProvider(_a) {
5096
5099
  onMicrophoneAccessDenied: onMicrophoneAccessDenied,
5097
5100
  requireMicrophoneAccess: requireMicrophoneAccess
5098
5101
  }));
5102
+ var _k = (_b = videoRef.current) !== null && _b !== void 0 ? _b : {},
5103
+ videoWidth = _k.videoWidth,
5104
+ videoHeight = _k.videoHeight;
5105
+ React.useEffect(function () {
5106
+ var _a;
5107
+ (_a = store.current) === null || _a === void 0 ? void 0 : _a.setState({
5108
+ videoWidth: videoWidth,
5109
+ videoHeight: videoHeight
5110
+ });
5111
+ }, [videoWidth, videoHeight]);
5099
5112
  React.useEffect(function () {
5100
5113
  var _a, _b, _c;
5101
5114
  var state = (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState();
@@ -5161,14 +5174,14 @@ function CameraTamperSeal(_a) {
5161
5174
  className: classNames.message
5162
5175
  }, messageText)));
5163
5176
  }
5164
- var StyledOverlayInner$4 = styled__default.default(OverlayInner$2)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
5177
+ var StyledOverlayInner$4 = styled__default.default(OverlayInner$2)(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
5165
5178
  var StyledOverlayHeading = styled__default.default.h3(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
5166
5179
  function useCameraStore(selector) {
5167
5180
  var store = React.useContext(CameraStoreContext);
5168
5181
  if (!store) throw new Error('useCameraStore cannot be used without Provider');
5169
5182
  return zustand.useStore(store, selector);
5170
5183
  }
5171
- var templateObject_1$J, templateObject_2$C;
5184
+ var templateObject_1$K, templateObject_2$C;
5172
5185
 
5173
5186
  var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
5174
5187
  startDocumentDetection: function startDocumentDetection() {
@@ -6133,8 +6146,8 @@ function DebugStatsPane(_a) {
6133
6146
  if (!portalLocation) return element;
6134
6147
  return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
6135
6148
  }
6136
- var DebugStatsPaneDiv = styled__default.default.span(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n margin-right: 20px;\n padding: 8px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10002;\n"], ["\n font-size: 16px;\n font-family: monospace;\n position: absolute;\n left: 20px;\n bottom: 20px;\n margin-right: 20px;\n padding: 8px;\n color: limegreen;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10002;\n"])));
6137
- var ObjectDetectionDebugOverlayDiv = styled__default.default.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) {
6149
+ var DebugStatsPaneDiv = styled__default.default.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"])));
6150
+ var ObjectDetectionDebugOverlayDiv = styled__default.default.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) {
6138
6151
  var $flipX = _a.$flipX;
6139
6152
  return $flipX ? 'transform: scaleX(-1);' : '';
6140
6153
  });
@@ -6162,9 +6175,15 @@ function useDebugScalingDetails(_a) {
6162
6175
  var _b = _a.enabled,
6163
6176
  enabled = _b === void 0 ? true : _b,
6164
6177
  pageWidth = _a.pageWidth,
6165
- pageHeight = _a.pageHeight,
6166
- videoWidth = _a.videoWidth,
6167
- videoHeight = _a.videoHeight;
6178
+ pageHeight = _a.pageHeight;
6179
+ var _c = useCameraStore(shallow.useShallow(function (state) {
6180
+ return {
6181
+ videoWidth: state.videoWidth,
6182
+ videoHeight: state.videoHeight
6183
+ };
6184
+ })),
6185
+ videoWidth = _c.videoWidth,
6186
+ videoHeight = _c.videoHeight;
6168
6187
  return React.useMemo(function () {
6169
6188
  var horizontal = false,
6170
6189
  scaledWidth = 0,
@@ -6339,7 +6358,7 @@ function SelfieCaptureFaceKeypoint(_a) {
6339
6358
  }
6340
6359
  });
6341
6360
  }
6342
- var templateObject_1$I, templateObject_2$B, templateObject_3$q, templateObject_4$k;
6361
+ var templateObject_1$J, templateObject_2$B, templateObject_3$q, templateObject_4$k;
6343
6362
 
6344
6363
  function OverrideWrongDocumentTypeGuidanceDialog(_a) {
6345
6364
  var _b = _a.classNames,
@@ -6354,7 +6373,7 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
6354
6373
  buttonText: 'OK'
6355
6374
  });
6356
6375
  if (!allowOverrideWrongDocumentTypeGuidance) return null;
6357
- return /*#__PURE__*/React__namespace.default.createElement(Container$6, {
6376
+ return /*#__PURE__*/React__namespace.default.createElement(Container$7, {
6358
6377
  className: classNames.container
6359
6378
  }, /*#__PURE__*/React__namespace.default.createElement(InnerContainer, {
6360
6379
  className: classNames.inner
@@ -6372,7 +6391,7 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
6372
6391
  }
6373
6392
  }, verbiage.buttonText))));
6374
6393
  }
6375
- var Container$6 = styled__default.default.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"], ["\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n background: ", ";\n color: ", ";\n display: flex;\n z-index: 100001;\n"])), function (props) {
6394
+ var Container$7 = styled__default.default.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) {
6376
6395
  var _a, _b, _c;
6377
6396
  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';
6378
6397
  }, function (props) {
@@ -6383,7 +6402,7 @@ var InnerContainer = styled__default.default.div(templateObject_2$A || (template
6383
6402
  var Message = styled__default.default.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"])));
6384
6403
  var ButtonContainer = styled__default.default.div(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n display: flex;\n margin-left: auto;\n"], ["\n display: flex;\n margin-left: auto;\n"])));
6385
6404
  var Button$1 = styled__default.default(LoaderButton)(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n white-space: nowrap;\n margin: auto;\n"], ["\n white-space: nowrap;\n margin: auto;\n"])));
6386
- var templateObject_1$H, templateObject_2$A, templateObject_3$p, templateObject_4$j, templateObject_5$d;
6405
+ var templateObject_1$I, templateObject_2$A, templateObject_3$p, templateObject_4$j, templateObject_5$d;
6387
6406
 
6388
6407
  // This is a simplified version of https://github.com/ZeeCoder/use-resize-observer.
6389
6408
  // We have removed all options and made it compliant with React Compiler/React 19.
@@ -6622,9 +6641,7 @@ var IdCapture = function IdCapture(_a) {
6622
6641
  var debugScalingDetails = useDebugScalingDetails({
6623
6642
  enabled: debugMode,
6624
6643
  pageWidth: state.guideRectWidth,
6625
- pageHeight: state.guideRectHeight,
6626
- videoWidth: state.videoWidth,
6627
- videoHeight: state.videoHeight
6644
+ pageHeight: state.guideRectHeight
6628
6645
  });
6629
6646
  var satisfied = state.isGoodFrame;
6630
6647
  if (typeof guidanceSatisfied === 'boolean') satisfied = guidanceSatisfied;
@@ -6700,13 +6717,13 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
6700
6717
  finished: true
6701
6718
  }, verbiage.retryBtnText)));
6702
6719
  };
6703
- var StyledOverlayInner$3 = styled__default.default(OverlayInner$2)(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
6720
+ var StyledOverlayInner$3 = styled__default.default(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"])));
6704
6721
  var StyledOverlayImageContainer$1 = styled__default.default(OverlayImageContainer)(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
6705
6722
  var Description$4 = styled__default.default.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"])));
6706
6723
  var RetryButton$1 = styled__default.default(LoaderButton)(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
6707
- var templateObject_1$G, templateObject_2$z, templateObject_3$o, templateObject_4$i;
6724
+ var templateObject_1$H, templateObject_2$z, templateObject_3$o, templateObject_4$i;
6708
6725
 
6709
- var ExitCaptureStyledButton = styled__default.default.button(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n position: absolute;\n top: 12px;\n right: 12px;\n font-size: 20px;\n width: 32px;\n height: 32px;\n font-family: monospace;\n z-index: 1002;\n border: none;\n border-radius: 4px;\n background: #ccc;\n cursor: pointer;\n padding: 8px;\n box-sizing: border-box;\n display: flex;\n\n &:hover {\n background: #ddd;\n }\n\n & > svg {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n"], ["\n position: absolute;\n top: 12px;\n right: 12px;\n font-size: 20px;\n width: 32px;\n height: 32px;\n font-family: monospace;\n z-index: 1002;\n border: none;\n border-radius: 4px;\n background: #ccc;\n cursor: pointer;\n padding: 8px;\n box-sizing: border-box;\n display: flex;\n\n &:hover {\n background: #ddd;\n }\n\n & > svg {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n"])));
6726
+ var ExitCaptureStyledButton = styled__default.default.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"])));
6710
6727
  var ExitCaptureButton = function ExitCaptureButton(_a) {
6711
6728
  var onClick = _a.onClick,
6712
6729
  className = _a.className;
@@ -6750,7 +6767,7 @@ var ExitCaptureButton = function ExitCaptureButton(_a) {
6750
6767
  y2: "19.75"
6751
6768
  }))));
6752
6769
  };
6753
- var templateObject_1$F;
6770
+ var templateObject_1$G;
6754
6771
 
6755
6772
  function IdCaptureLoadingGraphic(props) {
6756
6773
  var isMobile = window.innerHeight > window.innerWidth;
@@ -7225,7 +7242,7 @@ function IdCaptureLoadingGraphicMobile(_a) {
7225
7242
  fill: "white"
7226
7243
  }))));
7227
7244
  }
7228
- var LoadingGraphicWrapper = styled__default.default.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
7245
+ var LoadingGraphicWrapper = styled__default.default.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"])));
7229
7246
  var LoadingGraphicSvg = styled__default.default.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) {
7230
7247
  return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
7231
7248
  }, function (props) {
@@ -7239,7 +7256,7 @@ var LoadingGraphicCardGroup = styled__default.default.g(templateObject_3$n || (t
7239
7256
  var LoadingGraphicPhoneGroup = styled__default.default.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) {
7240
7257
  return props.$offScreen ? '40px' : '0';
7241
7258
  });
7242
- var templateObject_1$E, templateObject_2$y, templateObject_3$n, templateObject_4$h;
7259
+ var templateObject_1$F, templateObject_2$y, templateObject_3$n, templateObject_4$h;
7243
7260
 
7244
7261
  function LoadingListItemIndicator(_a) {
7245
7262
  var _b = _a.state,
@@ -7439,7 +7456,7 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
7439
7456
  }
7440
7457
  }, ready ? verbiage.continueText : verbiage.pleaseWaitText))))));
7441
7458
  };
7442
- var OverlayInner$1 = styled__default.default(LoadingOverlayInner)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
7459
+ var OverlayInner$1 = styled__default.default(LoadingOverlayInner)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
7443
7460
  var _a, _b, _c, _d;
7444
7461
  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';
7445
7462
  }, function (props) {
@@ -7485,9 +7502,9 @@ var ContinueButton$1 = styled__default.default(LoaderButton)(templateObject_10$1
7485
7502
  var _a, _b, _c, _d;
7486
7503
  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';
7487
7504
  });
7488
- var templateObject_1$D, 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;
7505
+ 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;
7489
7506
 
7490
- var ContinuityCameraCheckboxContainer = styled__default.default.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
7507
+ var ContinuityCameraCheckboxContainer = styled__default.default.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"])));
7491
7508
  var ContinuityCameraCheckbox = styled__default.default.input(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
7492
7509
  var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
7493
7510
  var _b, _c, _d, _e;
@@ -7609,7 +7626,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
7609
7626
  }
7610
7627
  }, ready ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
7611
7628
  };
7612
- var templateObject_1$C, templateObject_2$w;
7629
+ var templateObject_1$D, templateObject_2$w;
7613
7630
 
7614
7631
  var components$1 = {
7615
7632
  "default": IdCaptureLoadingOverlayDefault,
@@ -7667,9 +7684,9 @@ var CapturedDocumentImg = function CapturedDocumentImg(_a) {
7667
7684
  });
7668
7685
  };
7669
7686
 
7670
- var Card = styled__default.default.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n background: white;\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n margin: auto;\n max-width: min(500px, 100% - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"], ["\n background: white;\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n margin: auto;\n max-width: min(500px, 100% - 48px);\n max-height: 100%;\n overflow: auto;\n box-sizing: border-box;\n"])));
7687
+ var Card = styled__default.default.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"])));
7671
7688
  var FlexCard = styled__default.default(Card)(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
7672
- var templateObject_1$B, templateObject_2$v;
7689
+ var templateObject_1$C, templateObject_2$v;
7673
7690
 
7674
7691
  var imageDisplayOrder = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
7675
7692
  var IdCaptureSuccess = function IdCaptureSuccess(_a) {
@@ -7731,13 +7748,13 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
7731
7748
  finished: true
7732
7749
  }, verbiage.retryText)))));
7733
7750
  };
7734
- var Heading$a = styled__default.default.h1(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n font-size: 1.5rem;\n margin-top: 0;\n margin-bottom: 1.5rem;\n"], ["\n font-size: 1.5rem;\n margin-top: 0;\n margin-bottom: 1.5rem;\n"])));
7751
+ var Heading$a = styled__default.default.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"])));
7735
7752
  var ImagesContainer = styled__default.default(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"])));
7736
7753
  var ImageRow = styled__default.default(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"])));
7737
7754
  var ImageCol$1 = styled__default.default.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"])));
7738
7755
  var StyledImage = styled__default.default(CapturedDocumentImg)(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n width: 100%;\n border-radius: 12px;\n"], ["\n width: 100%;\n border-radius: 12px;\n"])));
7739
7756
  var DebugPre = styled__default.default.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"])));
7740
- var templateObject_1$A, templateObject_2$u, templateObject_3$l, templateObject_4$f, templateObject_5$b, templateObject_6$8;
7757
+ var templateObject_1$B, templateObject_2$u, templateObject_3$l, templateObject_4$f, templateObject_5$b, templateObject_6$8;
7741
7758
 
7742
7759
  function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
7743
7760
  var _this = this;
@@ -7789,7 +7806,7 @@ function resetCanvasDimensions(canvas) {
7789
7806
  canvas.style.height = '0';
7790
7807
  }
7791
7808
 
7792
- var IdCardGuideImageContainer = styled__default.default(IdCardBorder)(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n"])), function (props) {
7809
+ var IdCardGuideImageContainer = styled__default.default(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) {
7793
7810
  return props.$isVisible ? '' : 'opacity: 0;';
7794
7811
  });
7795
7812
  var IdCardGuideImage = styled__default.default.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) {
@@ -7945,7 +7962,7 @@ var IdCardBorderRect = styled__default.default.rect(templateObject_5$a || (templ
7945
7962
  var _a;
7946
7963
  return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
7947
7964
  });
7948
- var templateObject_1$z, templateObject_2$t, templateObject_3$k, templateObject_4$e, templateObject_5$a;
7965
+ var templateObject_1$A, templateObject_2$t, templateObject_3$k, templateObject_4$e, templateObject_5$a;
7949
7966
 
7950
7967
  var defaultIdCaptureGuideImages = {
7951
7968
  portrait: {
@@ -8121,12 +8138,12 @@ var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
8121
8138
  style: imageStyle
8122
8139
  })));
8123
8140
  };
8124
- var FlipImageContainer = styled__default.default(IdCardGuideImageContainer)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n backface-visibility: hidden;\n transition: transform ", "s;\n transform: ", ";\n transform-style: preserve-3d;\n position: absolute;\n display: block;\n top: 0;\n width: 100%;\n max-height: 100%;\n"], ["\n backface-visibility: hidden;\n transition: transform ", "s;\n transform: ", ";\n transform-style: preserve-3d;\n position: absolute;\n display: block;\n top: 0;\n width: 100%;\n max-height: 100%;\n"])), function (props) {
8141
+ var FlipImageContainer = styled__default.default(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) {
8125
8142
  return props.$transitionTime;
8126
8143
  }, function (props) {
8127
8144
  return props.$transforms;
8128
8145
  });
8129
- var templateObject_1$y;
8146
+ var templateObject_1$z;
8130
8147
 
8131
8148
  var GuideOrientationContext = /*#__PURE__*/React.createContext({
8132
8149
  orientation: 'landscape',
@@ -8413,7 +8430,7 @@ var regionClsx = function regionClsx(classNames, which) {
8413
8430
  return v;
8414
8431
  }).join(' ');
8415
8432
  };
8416
- var StyledPageContainer = styled__default.default.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1000;\n overflow: hidden;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1000;\n overflow: hidden;\n"])));
8433
+ var StyledPageContainer = styled__default.default.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"])));
8417
8434
  var GuidesContainer = styled__default.default.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"])));
8418
8435
  var GuideCenterRow = styled__default.default.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"])));
8419
8436
  var GuideRegion = styled__default.default.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) {
@@ -8441,7 +8458,7 @@ var GuideCenterBorder = styled__default.default.div(templateObject_7$5 || (templ
8441
8458
  });
8442
8459
  var GuideText = styled__default.default.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"])));
8443
8460
  var GuideCenterInner = styled__default.default.div(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n position: relative;\n margin: auto;\n"], ["\n position: relative;\n margin: auto;\n"])));
8444
- var templateObject_1$x, templateObject_2$s, templateObject_3$j, templateObject_4$d, templateObject_5$9, templateObject_6$7, templateObject_7$5, templateObject_8$2, templateObject_9$1;
8461
+ 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;
8445
8462
 
8446
8463
  var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
8447
8464
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
@@ -8582,11 +8599,11 @@ var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
8582
8599
  progress: progress
8583
8600
  }));
8584
8601
  };
8585
- var CanvasWrapper$1 = styled__default.default.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n z-index: -1;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n z-index: -1;\n"])), function (props) {
8602
+ var CanvasWrapper$1 = styled__default.default.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) {
8586
8603
  return props.$maskColor;
8587
8604
  });
8588
8605
  var Canvas$1 = styled__default.default.canvas(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
8589
- var templateObject_1$w, templateObject_2$r;
8606
+ var templateObject_1$x, templateObject_2$r;
8590
8607
 
8591
8608
  function IdCaptureGuides(_a) {
8592
8609
  var _b = _a.guideType,
@@ -8642,7 +8659,7 @@ function IdCaptureGuides(_a) {
8642
8659
  })));
8643
8660
  }
8644
8661
 
8645
- var Spinner = styled__default.default.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n display: inline-block;\n width: ", "px;\n height: ", "px;\n margin: auto;\n\n &:after {\n content: ' ';\n display: block;\n width: ", "px;\n height: ", "px;\n margin: 8px;\n border-radius: 50%;\n border: ", "px solid\n ", ";\n border-color: ", " transparent\n ", " transparent;\n animation: ", " 1.2s linear infinite;\n box-sizing: content-box;\n }\n"], ["\n display: inline-block;\n width: ", "px;\n height: ", "px;\n margin: auto;\n\n &:after {\n content: ' ';\n display: block;\n width: ", "px;\n height: ", "px;\n margin: 8px;\n border-radius: 50%;\n border: ", "px solid\n ", ";\n border-color: ", " transparent\n ", " transparent;\n animation: ", " 1.2s linear infinite;\n box-sizing: content-box;\n }\n"])), function (_a) {
8662
+ var Spinner = styled__default.default.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) {
8646
8663
  var $size = _a.$size;
8647
8664
  return $size !== null && $size !== void 0 ? $size : 80;
8648
8665
  }, function (_a) {
@@ -8671,7 +8688,7 @@ var SpinnerPageContainer = styled__default.default.div(templateObject_2$q || (te
8671
8688
  function SpinnerPage() {
8672
8689
  return /*#__PURE__*/React__namespace.default.createElement(SpinnerPageContainer, null, /*#__PURE__*/React__namespace.default.createElement(Spinner, null));
8673
8690
  }
8674
- var templateObject_1$v, templateObject_2$q;
8691
+ var templateObject_1$w, templateObject_2$q;
8675
8692
 
8676
8693
  var IdCaptureImagePreview = function IdCaptureImagePreview(_a) {
8677
8694
  var _b = _a.classNames,
@@ -8758,11 +8775,11 @@ var SelfieProgressPreview = function SelfieProgressPreview(_a) {
8758
8775
  onError: onError
8759
8776
  })));
8760
8777
  };
8761
- var StyledSpinner = styled__default.default(Spinner)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n position: relative;\n top: 4px;\n left: -3px;\n margin: 0 3px 0 -12px;\n"], ["\n position: relative;\n top: 4px;\n left: -3px;\n margin: 0 3px 0 -12px;\n"])));
8778
+ var StyledSpinner = styled__default.default(Spinner)(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"])));
8762
8779
  var ImagePreviewWrapper = styled__default.default.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"], ["\n position: absolute;\n display: flex;\n flex-direction: column;\n height: 33%;\n bottom: 12px;\n right: 12px;\n"])));
8763
8780
  var ImagePreviewText = styled__default.default.div(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n display: block;\n position: absolute;\n top: -32px;\n font:\n 14px -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Helvetica,\n Arial,\n sans-serif,\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol';\n color: white;\n text-align: center;\n margin: 0 auto;\n width: 100%;\n"], ["\n display: block;\n position: absolute;\n top: -32px;\n font:\n 14px -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Helvetica,\n Arial,\n sans-serif,\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol';\n color: white;\n text-align: center;\n margin: 0 auto;\n width: 100%;\n"])));
8764
8781
  var ImagePreviewImageWrapper = styled__default.default.div(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n position: relative;\n height: calc(100% - 8px);\n padding: 4px;\n border-radius: 4px;\n background: white;\n\n & > img {\n border-radius: 4px;\n width: auto;\n max-height: 100%;\n }\n"], ["\n position: relative;\n height: calc(100% - 8px);\n padding: 4px;\n border-radius: 4px;\n background: white;\n\n & > img {\n border-radius: 4px;\n width: auto;\n max-height: 100%;\n }\n"])));
8765
- var templateObject_1$u, templateObject_2$p, templateObject_3$i, templateObject_4$c;
8782
+ var templateObject_1$v, templateObject_2$p, templateObject_3$i, templateObject_4$c;
8766
8783
 
8767
8784
  var documentCaptureInitialState = {
8768
8785
  documents: [],
@@ -9110,16 +9127,16 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
9110
9127
  ref: canvasRef
9111
9128
  }));
9112
9129
  };
9113
- var CanvasWrapper = styled__default.default.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n"], ["\n flex-grow: 1;\n background-clip: padding-box;\n box-shadow: inset 0 0 0 2px ", ";\n"])), function (props) {
9130
+ var CanvasWrapper = styled__default.default.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) {
9114
9131
  return props.$maskColor;
9115
9132
  });
9116
9133
  var Canvas = styled__default.default.canvas(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
9117
- var templateObject_1$t, templateObject_2$o;
9134
+ var templateObject_1$u, templateObject_2$o;
9118
9135
 
9119
- var CameraFeedWrapper = styled__default.default.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
9136
+ var CameraFeedWrapper = styled__default.default.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
9120
9137
  return props.$mode === 'snapToGuides' ? "display: flex;\n position: absolute;\n left: ".concat(props.$x, "px;\n top: ").concat(props.$y, "px;\n width: ").concat(props.$w, "px;\n height: ").concat(props.$h, "px;") : "";
9121
9138
  });
9122
- var templateObject_1$s;
9139
+ var templateObject_1$t;
9123
9140
 
9124
9141
  var CameraVideoTag = function CameraVideoTag(props) {
9125
9142
  var _a = useCameraStore(shallow.useShallow(function (store) {
@@ -9150,10 +9167,10 @@ var CameraVideoTag = function CameraVideoTag(props) {
9150
9167
  "$isRearFacing": isRearFacing
9151
9168
  }, props));
9152
9169
  };
9153
- var FullscreenVideoTag = styled__default.default.video(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n transform: ", ";\n transform-style: preserve-3d;\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: cover;\n background: black;\n z-index: -2;\n"], ["\n transform: ", ";\n transform-style: preserve-3d;\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: cover;\n background: black;\n z-index: -2;\n"])), function (props) {
9170
+ var FullscreenVideoTag = styled__default.default.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) {
9154
9171
  return props.$isRearFacing ? '' : 'scaleX(-1)';
9155
9172
  });
9156
- var templateObject_1$r;
9173
+ var templateObject_1$s;
9157
9174
 
9158
9175
  var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
9159
9176
  var _b, _c, _d, _e;
@@ -9301,7 +9318,7 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
9301
9318
  disabled: !cameraReady || capturing
9302
9319
  }, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
9303
9320
  };
9304
- var CaptureContainer = styled__default.default.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
9321
+ var CaptureContainer = styled__default.default.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"])));
9305
9322
  var HeadingRow = styled__default.default.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) {
9306
9323
  return props.$maskColor;
9307
9324
  });
@@ -9315,7 +9332,7 @@ var Instructions = styled__default.default.div(templateObject_5$8 || (templateOb
9315
9332
  });
9316
9333
  var StyledButtonsRow$8 = styled__default.default(ButtonsRow$2)(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n padding-top: 20px;\n"], ["\n padding-top: 20px;\n"])));
9317
9334
  var PreviewImage = styled__default.default.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"])));
9318
- var templateObject_1$q, templateObject_2$n, templateObject_3$h, templateObject_4$b, templateObject_5$8, templateObject_6$6, templateObject_7$4;
9335
+ var templateObject_1$r, templateObject_2$n, templateObject_3$h, templateObject_4$b, templateObject_5$8, templateObject_6$6, templateObject_7$4;
9319
9336
 
9320
9337
  var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
9321
9338
  var onSuccess = _a.onSuccess,
@@ -9586,13 +9603,13 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
9586
9603
  }
9587
9604
  }, verbiage.doneBtnText))))));
9588
9605
  };
9589
- var StyledOverlayInner$2 = styled__default.default(OverlayInner$2)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
9606
+ var StyledOverlayInner$2 = styled__default.default(OverlayInner$2)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
9590
9607
  var Heading$8 = styled__default.default.h3(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
9591
9608
  var Description$3 = styled__default.default.p(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
9592
9609
  var Instruction = styled__default.default.p(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
9593
9610
  var ImageCol = styled__default.default.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"])));
9594
9611
  var StyledButtonsRow$7 = styled__default.default(ButtonsRow$2)(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
9595
- var templateObject_1$p, templateObject_2$m, templateObject_3$g, templateObject_4$a, templateObject_5$7, templateObject_6$5;
9612
+ var templateObject_1$q, templateObject_2$m, templateObject_3$g, templateObject_4$a, templateObject_5$7, templateObject_6$5;
9596
9613
 
9597
9614
  function ScalingCameraFeed() {
9598
9615
  var _a = useIdCaptureStore(),
@@ -9944,7 +9961,7 @@ function FilePickerButton(_a) {
9944
9961
  }
9945
9962
  }, file ? "".concat(file.name, " (").concat(humanFileSize(file.size), ")") : filePickerLoading ? loadingText : children));
9946
9963
  }
9947
- var ScreenContainer = styled__default.default.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n position: relative;\n font-family: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n position: relative;\n font-family: ", ";\n"])), function (props) {
9964
+ var ScreenContainer = styled__default.default.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) {
9948
9965
  var _a;
9949
9966
  return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
9950
9967
  });
@@ -10233,7 +10250,7 @@ function humanFileSize(bytes, si, dp) {
10233
10250
  } while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
10234
10251
  return bytes.toFixed(dp) + ' ' + units[u];
10235
10252
  }
10236
- var templateObject_1$o, 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;
10253
+ 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;
10237
10254
 
10238
10255
  var IdCaptureWizard = function IdCaptureWizard(_a) {
10239
10256
  var _b, _c, _d, _e, _f;
@@ -10926,7 +10943,7 @@ var HeadGuideSvg = /*#__PURE__*/React.forwardRef(function (_a, ref) {
10926
10943
  }))));
10927
10944
  });
10928
10945
  HeadGuideSvg.displayName = 'HeadGuideSvg';
10929
- var PulsingHeadGuideContainer = styled__default.default.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"], ["\n display: flex;\n position: relative;\n height: 100%;\n max-height: 100%;\n\n & > .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(2) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(3) {\n animation-delay: 1.33s;\n }\n }\n\n & > .idmSdkWavesOrigin {\n position: relative;\n }\n"])), wavesAnimation);
10946
+ var PulsingHeadGuideContainer = styled__default.default.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);
10930
10947
  function HeadGuide(_a) {
10931
10948
  var _b;
10932
10949
  var _c = _a.status,
@@ -11204,9 +11221,9 @@ function SelfieCaptureAnimatedMaskWithStatus(_a) {
11204
11221
  status: status
11205
11222
  }));
11206
11223
  }
11207
- var templateObject_1$n, templateObject_2$k, templateObject_3$e;
11224
+ var templateObject_1$o, templateObject_2$k, templateObject_3$e;
11208
11225
 
11209
- var FaceCaptureGuideContainer = styled__default.default.div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"], ["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"])));
11226
+ var FaceCaptureGuideContainer = styled__default.default.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"])));
11210
11227
  var FaceCaptureGuideInner = styled__default.default.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n position: relative;\n height: 60%;\n"], ["\n position: relative;\n height: 60%;\n"])));
11211
11228
  var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
11212
11229
  var _b = _a.classNames,
@@ -11229,7 +11246,7 @@ var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
11229
11246
  verticalAlign: "center"
11230
11247
  })));
11231
11248
  };
11232
- var templateObject_1$m, templateObject_2$j;
11249
+ var templateObject_1$n, templateObject_2$j;
11233
11250
 
11234
11251
  var SelfieGuidanceModelsContext = /*#__PURE__*/React.createContext({
11235
11252
  start: function start() {
@@ -11307,8 +11324,10 @@ function SelfieGuidanceModelsProvider(_a) {
11307
11324
  requireVerticalFaceCentering: requireVerticalFaceCentering
11308
11325
  });
11309
11326
  setLastFaceDetectionAt(new Date().getTime());
11327
+ // setLastPrediction(processed)
11310
11328
  return [4 /*yield*/, (_b = onPredictionHandler.current) === null || _b === void 0 ? void 0 : _b.call(onPredictionHandler, processed)];
11311
11329
  case 2:
11330
+ // setLastPrediction(processed)
11312
11331
  _c.sent();
11313
11332
  return [3 /*break*/, 4];
11314
11333
  case 3:
@@ -11339,7 +11358,7 @@ function SelfieGuidanceModelsProvider(_a) {
11339
11358
  error: modelError,
11340
11359
  modelDownloadProgress: modelDownloadProgress
11341
11360
  };
11342
- }, [modelError, modelDownloadProgress, onPredictionMade, ready, start, stop]);
11361
+ }, [start, stop, ready, onPredictionMade, modelError, modelDownloadProgress]);
11343
11362
  return /*#__PURE__*/React__namespace.createElement(SelfieGuidanceModelsContext.Provider, {
11344
11363
  value: value
11345
11364
  }, /*#__PURE__*/React__namespace.createElement(InvisibleCanvas, {
@@ -11549,12 +11568,12 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
11549
11568
  }
11550
11569
  }, !image ? invalidSelfie ? verbiage.retryButtonText : verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText)))));
11551
11570
  };
11552
- var StyledOverlayInner$1 = styled__default.default(OverlayInner$2)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
11571
+ var StyledOverlayInner$1 = styled__default.default(OverlayInner$2)(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
11553
11572
  var Heading$7 = styled__default.default.h3(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
11554
11573
  var Description$2 = styled__default.default.p(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
11555
11574
  var ImageContainer$6 = styled__default.default(OverlayImageContainer)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
11556
11575
  var StyledButtonsRow$6 = styled__default.default(ButtonsRow$2)(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
11557
- var templateObject_1$l, templateObject_2$i, templateObject_3$d, templateObject_4$8, templateObject_5$5;
11576
+ var templateObject_1$m, templateObject_2$i, templateObject_3$d, templateObject_4$8, templateObject_5$5;
11558
11577
 
11559
11578
  var initialState$3 = {
11560
11579
  busy: false,
@@ -11582,7 +11601,7 @@ var reducer$3 = function reducer(state, action) {
11582
11601
  }
11583
11602
  };
11584
11603
  var SelfieCapture = function SelfieCapture(_a) {
11585
- var _b, _c, _d, _e, _f;
11604
+ var _b;
11586
11605
  var onGuidanceSatisfied = _a.onGuidanceSatisfied,
11587
11606
  onGuidanceNotSatisfied = _a.onGuidanceNotSatisfied,
11588
11607
  onFaceDetected = _a.onFaceDetected,
@@ -11590,46 +11609,40 @@ var SelfieCapture = function SelfieCapture(_a) {
11590
11609
  onSelfieCaptured = _a.onSelfieCaptured,
11591
11610
  onTimeout = _a.onTimeout,
11592
11611
  onExit = _a.onExit,
11593
- _g = _a.timeoutDurationMs,
11594
- timeoutDurationMs = _g === void 0 ? 15000 : _g,
11612
+ _c = _a.timeoutDurationMs,
11613
+ timeoutDurationMs = _c === void 0 ? 15000 : _c,
11595
11614
  guidanceMessage = _a.guidanceMessage,
11596
11615
  guidanceSatisfied = _a.guidanceSatisfied,
11597
11616
  guidesComponent = _a.guidesComponent,
11598
- _h = _a.shouldCapture,
11599
- shouldCapture = _h === void 0 ? true : _h,
11600
- _j = _a.classNames,
11601
- classNames = _j === void 0 ? {} : _j,
11602
- _k = _a.colors,
11603
- colors = _k === void 0 ? {} : _k,
11604
- _l = _a.verbiage,
11605
- rawVerbiage = _l === void 0 ? {} : _l,
11606
- _m = _a.debugMode,
11607
- debugMode = _m === void 0 ? false : _m;
11608
- var _o = useResizeObserver(),
11609
- ref = _o.ref,
11610
- _p = _o.width,
11611
- width = _p === void 0 ? 1 : _p,
11612
- _q = _o.height,
11613
- height = _q === void 0 ? 1 : _q;
11614
- var _r = React.useReducer(reducer$3, initialState$3),
11615
- _s = _r[0],
11616
- busy = _s.busy,
11617
- prediction = _s.prediction,
11618
- dispatch = _r[1];
11617
+ _d = _a.shouldCapture,
11618
+ shouldCapture = _d === void 0 ? true : _d,
11619
+ _e = _a.classNames,
11620
+ classNames = _e === void 0 ? {} : _e,
11621
+ _f = _a.colors,
11622
+ colors = _f === void 0 ? {} : _f,
11623
+ _g = _a.verbiage,
11624
+ rawVerbiage = _g === void 0 ? {} : _g,
11625
+ _h = _a.debugMode,
11626
+ debugMode = _h === void 0 ? false : _h;
11627
+ var _j = useResizeObserver(),
11628
+ ref = _j.ref,
11629
+ _k = _j.width,
11630
+ width = _k === void 0 ? 1 : _k,
11631
+ _l = _j.height,
11632
+ height = _l === void 0 ? 1 : _l;
11633
+ var _m = React.useReducer(reducer$3, initialState$3),
11634
+ _o = _m[0],
11635
+ busy = _o.busy,
11636
+ prediction = _o.prediction,
11637
+ dispatch = _m[1];
11619
11638
  var lastPredictionCanvas = React.useRef(null);
11620
- var _t = useCameraStore(shallow.useShallow(function (state) {
11621
- return {
11622
- camera: state.camera,
11623
- cameraReady: state.cameraReady,
11624
- videoRef: state.videoRef
11625
- };
11626
- })),
11627
- camera = _t.camera,
11628
- videoRef = _t.videoRef;
11629
- var _u = React.useContext(SelfieGuidanceModelsContext),
11630
- onPredictionMade = _u.onPredictionMade,
11631
- canvasRef = _u.canvasRef,
11632
- guidanceError = _u.error;
11639
+ var camera = useCameraStore(shallow.useShallow(function (state) {
11640
+ return state.camera;
11641
+ }));
11642
+ var _p = React.useContext(SelfieGuidanceModelsContext),
11643
+ onPredictionMade = _p.onPredictionMade,
11644
+ canvasRef = _p.canvasRef,
11645
+ guidanceError = _p.error;
11633
11646
  onPredictionMade(useDebounce.useThrottledCallback(React.useCallback(function (prediction) {
11634
11647
  return __awaiter(void 0, void 0, void 0, function () {
11635
11648
  return __generator(this, function (_a) {
@@ -11674,15 +11687,13 @@ var SelfieCapture = function SelfieCapture(_a) {
11674
11687
  if (timer) clearTimeout(timer);
11675
11688
  };
11676
11689
  }, [onSelfieCaptureStarted, onSelfieCaptured, prediction]);
11677
- var _v = useTimeout(timeoutDurationMs, onTimeout),
11678
- timedOut = _v.timedOut,
11679
- timeoutStartedAt = _v.timeoutStartedAt;
11690
+ var _q = useTimeout(timeoutDurationMs, onTimeout),
11691
+ timedOut = _q.timedOut,
11692
+ timeoutStartedAt = _q.timeoutStartedAt;
11680
11693
  var debugScalingDetails = useDebugScalingDetails({
11681
11694
  enabled: debugMode,
11682
11695
  pageWidth: width,
11683
- pageHeight: height,
11684
- videoWidth: (_c = (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.videoWidth) !== null && _c !== void 0 ? _c : 0,
11685
- videoHeight: (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0
11696
+ pageHeight: height
11686
11697
  });
11687
11698
  colors.guidesUnsatisfiedColor || (colors.guidesUnsatisfiedColor = 'white');
11688
11699
  colors.guidesSatisfiedColor || (colors.guidesSatisfiedColor = 'green');
@@ -11695,7 +11706,7 @@ var SelfieCapture = function SelfieCapture(_a) {
11695
11706
  guidanceNoFaceDetectedText: 'Waiting for face to be detected...',
11696
11707
  guidanceNotStableText: 'Please hold still...'
11697
11708
  });
11698
- var satisfied = (_f = prediction === null || prediction === void 0 ? void 0 : prediction.faceReady) !== null && _f !== void 0 ? _f : false;
11709
+ var satisfied = (_b = prediction === null || prediction === void 0 ? void 0 : prediction.faceReady) !== null && _b !== void 0 ? _b : false;
11699
11710
  if (typeof guidanceSatisfied === 'boolean') satisfied = guidanceSatisfied;
11700
11711
  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 : '');
11701
11712
  if (guidanceError) {
@@ -11704,7 +11715,7 @@ var SelfieCapture = function SelfieCapture(_a) {
11704
11715
  });
11705
11716
  }
11706
11717
  var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : FaceCaptureGuideOverlay;
11707
- return /*#__PURE__*/React__namespace.default.createElement(Container$5, {
11718
+ return /*#__PURE__*/React__namespace.default.createElement(Container$6, {
11708
11719
  ref: ref,
11709
11720
  className: classNames.container
11710
11721
  }, /*#__PURE__*/React__namespace.default.createElement(InvisibleCanvas, {
@@ -11726,8 +11737,8 @@ var SelfieCapture = function SelfieCapture(_a) {
11726
11737
  className: classNames.exitCaptureBtn
11727
11738
  }));
11728
11739
  };
11729
- var Container$5 = styled__default.default.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
11730
- var templateObject_1$k;
11740
+ var Container$6 = styled__default.default.div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
11741
+ var templateObject_1$l;
11731
11742
 
11732
11743
  var initialState$2 = {
11733
11744
  frame: null,
@@ -11853,7 +11864,7 @@ var FaceLivenessCapture = function FaceLivenessCapture(_a) {
11853
11864
  var _m = React.useContext(SubmissionContext),
11854
11865
  checkLiveness = _m.checkLiveness,
11855
11866
  submissionError = _m.submissionError;
11856
- var modelError = React.useContext(SelfieGuidanceModelsContext).error;
11867
+ var modelError = useSelfieGuidanceModelsContext().error;
11857
11868
  var _o = React.useReducer(reducer$2, initialState$2),
11858
11869
  state = _o[0],
11859
11870
  dispatch = _o[1];
@@ -12115,9 +12126,9 @@ var FaceLivenessSuccess = function FaceLivenessSuccess(_a) {
12115
12126
  finished: true
12116
12127
  }, verbiage.retryBtnText)))));
12117
12128
  };
12118
- var ImageContainer$5 = styled__default.default.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100%;\n max-height: 100%;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"], ["\n position: relative;\n flex-grow: 1;\n margin-bottom: 25px;\n max-width: 100%;\n max-height: 100%;\n overflow-y: auto;\n border-radius: 12px;\n\n & > img,\n & > svg {\n width: 100%;\n max-width: 100%;\n margin: 0 auto;\n display: block;\n border-radius: 12px;\n }\n"])));
12129
+ var ImageContainer$5 = styled__default.default.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"])));
12119
12130
  var Heading$6 = styled__default.default.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"])));
12120
- var templateObject_1$j, templateObject_2$h;
12131
+ var templateObject_1$k, templateObject_2$h;
12121
12132
 
12122
12133
  var FaceLivenessFailure = function FaceLivenessFailure(_a) {
12123
12134
  var _b = _a.canRetry,
@@ -12166,9 +12177,9 @@ var FaceLivenessFailure = function FaceLivenessFailure(_a) {
12166
12177
  finished: true
12167
12178
  }, verbiage.exitBtnText)))));
12168
12179
  };
12169
- var ImageContainer$4 = styled__default.default(OverlayImageContainer)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
12180
+ var ImageContainer$4 = styled__default.default(OverlayImageContainer)(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n max-height: calc(100vh - 185px);\n"], ["\n max-height: calc(100vh - 185px);\n"])));
12170
12181
  var Heading$5 = styled__default.default.h3(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin-bottom: 36px;\n"], ["\n margin-bottom: 36px;\n"])));
12171
- var templateObject_1$i, templateObject_2$g;
12182
+ var templateObject_1$j, templateObject_2$g;
12172
12183
 
12173
12184
  var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
12174
12185
  var _b;
@@ -12211,11 +12222,11 @@ var MicrophoneAccessDeniedOverlay = function MicrophoneAccessDeniedOverlay(_a) {
12211
12222
  finished: true
12212
12223
  }, verbiage.retryBtnText)));
12213
12224
  };
12214
- var StyledOverlayInner = styled__default.default(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"])));
12225
+ var StyledOverlayInner = styled__default.default(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"])));
12215
12226
  var StyledOverlayImageContainer = styled__default.default(OverlayImageContainer)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
12216
12227
  var Description$1 = styled__default.default.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"])));
12217
12228
  var RetryButton = styled__default.default(LoaderButton)(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
12218
- var templateObject_1$h, templateObject_2$f, templateObject_3$c, templateObject_4$7;
12229
+ var templateObject_1$i, templateObject_2$f, templateObject_3$c, templateObject_4$7;
12219
12230
 
12220
12231
  var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLegacy(_a) {
12221
12232
  var onDismissed = _a.onDismissed,
@@ -12307,9 +12318,9 @@ var SelfieCaptureLoadingOverlayLegacy = function SelfieCaptureLoadingOverlayLega
12307
12318
  }
12308
12319
  }, ready ? verbiage.continueText : allModelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? "".concat(verbiage.modelsWarmingUpText) : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)")))));
12309
12320
  };
12310
- var StyledGuidanceMessage = styled__default.default(GuidanceMessage)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"], ["\n padding: 12px 24px;\n font-weight: normal;\n line-height: 1.5;\n margin-bottom: -30px;\n"])));
12321
+ var StyledGuidanceMessage = styled__default.default(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"])));
12311
12322
  var StyledButtonsRow$5 = styled__default.default(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"])));
12312
- var templateObject_1$g, templateObject_2$e;
12323
+ var templateObject_1$h, templateObject_2$e;
12313
12324
 
12314
12325
  var legacyInstructionImageUrl = "".concat(DEFAULT_CDN_URL, "/Selfie-Image-1.png");
12315
12326
  var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDefault(_a) {
@@ -12449,7 +12460,7 @@ var SelfieCaptureLoadingOverlayDefault = function SelfieCaptureLoadingOverlayDef
12449
12460
  }
12450
12461
  }, ready ? verbiage.continueText : verbiage.pleaseWaitText))))));
12451
12462
  };
12452
- var OverlayInner = styled__default.default(LoadingOverlayInner)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
12463
+ var OverlayInner = styled__default.default(LoadingOverlayInner)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
12453
12464
  var _a, _b, _c, _d;
12454
12465
  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';
12455
12466
  }, function (props) {
@@ -12495,7 +12506,7 @@ var ContinueButton = styled__default.default(LoaderButton)(templateObject_7$2 ||
12495
12506
  var _a, _b, _c, _d;
12496
12507
  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';
12497
12508
  });
12498
- var templateObject_1$f, templateObject_2$d, templateObject_3$b, templateObject_4$6, templateObject_5$4, templateObject_6$3, templateObject_7$2;
12509
+ var templateObject_1$g, templateObject_2$d, templateObject_3$b, templateObject_4$6, templateObject_5$4, templateObject_6$3, templateObject_7$2;
12499
12510
 
12500
12511
  var components = {
12501
12512
  "default": SelfieCaptureLoadingOverlayDefault,
@@ -12554,37 +12565,39 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
12554
12565
  _r = _a.verbiage,
12555
12566
  verbiage = _r === void 0 ? {} : _r,
12556
12567
  _s = _a.debugMode,
12557
- debugMode = _s === void 0 ? false : _s;
12558
- var _t = React.useContext(SubmissionContext),
12559
- submissionResponse = _t.submissionResponse,
12560
- livenessCheckRequest = _t.livenessCheckRequest,
12561
- setSelfieImage = _t.setSelfieImage,
12562
- logSelfieCaptureAttempt = _t.logSelfieCaptureAttempt;
12563
- var _u = useCameraStore(shallow.useShallow(function (state) {
12568
+ debugMode = _s === void 0 ? false : _s,
12569
+ _t = _a.showLoadingOverlay,
12570
+ showLoadingOverlay = _t === void 0 ? true : _t;
12571
+ var _u = React.useContext(SubmissionContext),
12572
+ submissionResponse = _u.submissionResponse,
12573
+ livenessCheckRequest = _u.livenessCheckRequest,
12574
+ setSelfieImage = _u.setSelfieImage,
12575
+ logSelfieCaptureAttempt = _u.logSelfieCaptureAttempt;
12576
+ var _v = useCameraStore(shallow.useShallow(function (state) {
12564
12577
  return {
12565
12578
  cameraAccessDenied: state.cameraAccessDenied,
12566
12579
  requestCameraAccess: state.requestCameraAccess,
12567
12580
  releaseCameraAccess: state.releaseCameraAccess
12568
12581
  };
12569
12582
  })),
12570
- cameraAccessDenied = _u.cameraAccessDenied,
12571
- requestCameraAccess = _u.requestCameraAccess,
12572
- releaseCameraAccess = _u.releaseCameraAccess;
12573
- var _v = React.useState(''),
12574
- faceCropImageUrl = _v[0],
12575
- setFaceCropImageUrl = _v[1];
12576
- var _w = React.useState(0),
12577
- retryCount = _w[0],
12578
- setRetryCount = _w[1];
12579
- var _x = React.useState('LOADING'),
12580
- captureState = _x[0],
12581
- setCaptureState = _x[1];
12583
+ cameraAccessDenied = _v.cameraAccessDenied,
12584
+ requestCameraAccess = _v.requestCameraAccess,
12585
+ releaseCameraAccess = _v.releaseCameraAccess;
12586
+ var _w = React.useState(''),
12587
+ faceCropImageUrl = _w[0],
12588
+ setFaceCropImageUrl = _w[1];
12589
+ var _x = React.useState(0),
12590
+ retryCount = _x[0],
12591
+ setRetryCount = _x[1];
12592
+ var _y = React.useState(showLoadingOverlay ? 'LOADING' : 'CAPTURING'),
12593
+ captureState = _y[0],
12594
+ setCaptureState = _y[1];
12582
12595
  var captureStartedAt = React.useRef();
12583
12596
  var operationStartedAt = React.useRef();
12584
12597
  var livenessScore = React.useRef();
12585
- var _y = React.useContext(SelfieGuidanceModelsContext),
12586
- start = _y.start,
12587
- stop = _y.stop;
12598
+ var _z = React.useContext(SelfieGuidanceModelsContext),
12599
+ start = _z.start,
12600
+ stop = _z.stop;
12588
12601
  React.useEffect(function () {
12589
12602
  if (precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie) {
12590
12603
  setSelfieImage(precapturedDocuments.selfie.imageData);
@@ -12594,7 +12607,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
12594
12607
  if (captureState !== 'CAPTURING') return;
12595
12608
  operationStartedAt.current = new Date();
12596
12609
  captureStartedAt.current = undefined;
12597
- start();
12610
+ setTimeout(start, 1);
12598
12611
  return stop;
12599
12612
  }, [captureState, precapturedDocuments === null || precapturedDocuments === void 0 ? void 0 : precapturedDocuments.selfie, setSelfieImage, start, stop]);
12600
12613
  var onCapture = React.useCallback(function () {
@@ -12668,9 +12681,9 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
12668
12681
  }
12669
12682
  onDenied === null || onDenied === void 0 ? void 0 : onDenied(submissionResponse, livenessCheckRequest);
12670
12683
  }, [allowLivenessFailure, onDenied, submissionResponse, livenessCheckRequest]);
12671
- var _z = React.useState(0),
12672
- attempt = _z[0],
12673
- setAttempt = _z[1];
12684
+ var _0 = React.useState(0),
12685
+ attempt = _0[0],
12686
+ setAttempt = _0[1];
12674
12687
  var onExitCallback = React.useCallback(function () {
12675
12688
  setAttempt(function (n) {
12676
12689
  return n + 1;
@@ -12769,7 +12782,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
12769
12782
  default:
12770
12783
  return null;
12771
12784
  }
12772
- }(), /*#__PURE__*/React__namespace.default.createElement(SelfieCaptureLoadingOverlay, {
12785
+ }(), showLoadingOverlay && ( /*#__PURE__*/React__namespace.default.createElement(SelfieCaptureLoadingOverlay, {
12773
12786
  key: attempt,
12774
12787
  mode: loadingOverlayMode,
12775
12788
  customOverlayContent: customOverlayContent,
@@ -12780,7 +12793,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
12780
12793
  onUserCancel: onUserCancel,
12781
12794
  onDismissed: onLoadingOverlayDismissedCallback,
12782
12795
  waitForIdCaptureModels: waitForIdCaptureModels
12783
- }));
12796
+ })));
12784
12797
  };
12785
12798
 
12786
12799
  var SubmissionSuccess = function SubmissionSuccess() {
@@ -12803,7 +12816,7 @@ var SubmissionSuccess = function SubmissionSuccess() {
12803
12816
  }
12804
12817
  return JSON.stringify(body, null, 2);
12805
12818
  }, [submissionRequest, truncateImages]);
12806
- return /*#__PURE__*/React__namespace.default.createElement(Container$4, null, /*#__PURE__*/React__namespace.default.createElement("h3", null, "Submission completed!"), /*#__PURE__*/React__namespace.default.createElement(LoaderButton, {
12819
+ return /*#__PURE__*/React__namespace.default.createElement(Container$5, null, /*#__PURE__*/React__namespace.default.createElement("h3", null, "Submission completed!"), /*#__PURE__*/React__namespace.default.createElement(LoaderButton, {
12807
12820
  onClick: function onClick() {
12808
12821
  return setShowRequestBody(!showRequestBody);
12809
12822
  }
@@ -12816,13 +12829,13 @@ var SubmissionSuccess = function SubmissionSuccess() {
12816
12829
  }
12817
12830
  }, truncateImages ? 'Display full images' : 'Truncate images'), /*#__PURE__*/React__namespace.default.createElement("h5", null, "Request Body"), /*#__PURE__*/React__namespace.default.createElement("pre", null, requestBodyDisplay))), /*#__PURE__*/React__namespace.default.createElement("h5", null, "Response Body"), /*#__PURE__*/React__namespace.default.createElement("pre", null, JSON.stringify(submissionResponse, null, 2)));
12818
12831
  };
12819
- var Container$4 = styled__default.default.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n padding: 16px;\n overflow: auto;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n"], ["\n padding: 16px;\n overflow: auto;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n"])));
12832
+ var Container$5 = styled__default.default.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"])));
12820
12833
  function truncate(str, max_chars) {
12821
12834
  var truncated = str.split('').splice(0, max_chars).join('');
12822
12835
  if (truncated.length < str.length) truncated += '...';
12823
12836
  return truncated;
12824
12837
  }
12825
- var templateObject_1$e;
12838
+ var templateObject_1$f;
12826
12839
 
12827
12840
  var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
12828
12841
  var document = _a.document,
@@ -12898,11 +12911,11 @@ var AdditionalDocumentCapture = function AdditionalDocumentCapture(_a) {
12898
12911
  }
12899
12912
  }, verbiage.captureBtnText)))));
12900
12913
  };
12901
- var Inner$2 = styled__default.default(OverlayInner$2)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
12914
+ var Inner$2 = styled__default.default(OverlayInner$2)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
12902
12915
  var Heading$4 = styled__default.default.h3(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
12903
12916
  var Description = styled__default.default.p(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
12904
12917
  var StyledButtonsRow$4 = styled__default.default(ButtonsRow$2)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin-top: 32px;\n"], ["\n margin-top: 32px;\n"])));
12905
- var templateObject_1$d, templateObject_2$c, templateObject_3$a, templateObject_4$5;
12918
+ var templateObject_1$e, templateObject_2$c, templateObject_3$a, templateObject_4$5;
12906
12919
 
12907
12920
  var AdditionalDocumentCaptureWizard = function AdditionalDocumentCaptureWizard(_a) {
12908
12921
  var documents = _a.documents,
@@ -13052,7 +13065,7 @@ function convertSVGtoImg(svgData_1) {
13052
13065
  });
13053
13066
  }
13054
13067
 
13055
- var SignaturePaperBacking = styled__default.default.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n ", "\n ", "\n"], ["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n ", "\n ", "\n"])), function (props) {
13068
+ var SignaturePaperBacking = styled__default.default.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) {
13056
13069
  var _a, _b;
13057
13070
  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, ";") : "";
13058
13071
  }, function (props) {
@@ -13063,7 +13076,7 @@ var SignaturePaperBacking = styled__default.default.div(templateObject_1$c || (t
13063
13076
  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, ";") : "";
13064
13077
  });
13065
13078
  var SignatureCanvasContainer$1 = styled__default.default.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"])));
13066
- var SignaturePad = styled__default.default.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 }\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 }\n"])), function (props) {
13079
+ var SignaturePad = styled__default.default.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) {
13067
13080
  var _a, _b, _c;
13068
13081
  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)';
13069
13082
  }, function (props) {
@@ -13078,9 +13091,21 @@ var SignaturePad = styled__default.default.div(templateObject_3$9 || (templateOb
13078
13091
  }, function (props) {
13079
13092
  var _a, _b, _c;
13080
13093
  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";
13094
+ }, function (props) {
13095
+ var _a, _b, _c;
13096
+ 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';
13097
+ }, function (props) {
13098
+ var _a, _b, _c;
13099
+ 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)';
13100
+ }, function (props) {
13101
+ var _a, _b, _c;
13102
+ 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";
13103
+ }, function (props) {
13104
+ var _a, _b, _c;
13105
+ 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';
13081
13106
  });
13082
13107
  var SignatureButtonsContainer = styled__default.default(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"])));
13083
- var templateObject_1$c, templateObject_2$b, templateObject_3$9, templateObject_4$4;
13108
+ var templateObject_1$d, templateObject_2$b, templateObject_3$9, templateObject_4$4;
13084
13109
 
13085
13110
  var SignatureCapture = function SignatureCapture(_a) {
13086
13111
  var onAccept = _a.onAccept,
@@ -13115,7 +13140,7 @@ var SignatureCapture = function SignatureCapture(_a) {
13115
13140
  });
13116
13141
  });
13117
13142
  }
13118
- return /*#__PURE__*/React__namespace.default.createElement(Container$3, {
13143
+ return /*#__PURE__*/React__namespace.default.createElement(Container$4, {
13119
13144
  className: classNames.container
13120
13145
  }, /*#__PURE__*/React__namespace.default.createElement(SignaturePaperBacking, {
13121
13146
  className: classNames.inner
@@ -13153,9 +13178,9 @@ var SignatureCapture = function SignatureCapture(_a) {
13153
13178
  finished: true
13154
13179
  }, verbiage.acceptBtnText)))));
13155
13180
  };
13156
- var Container$3 = styled__default.default.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n position: relative;\n"], ["\n width: 100%;\n height: 100%;\n position: relative;\n"])));
13181
+ var Container$4 = styled__default.default.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"])));
13157
13182
  var AcceptBtn$1 = styled__default.default(LoaderButton)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
13158
- var templateObject_1$b, templateObject_2$a;
13183
+ var templateObject_1$c, templateObject_2$a;
13159
13184
 
13160
13185
  var useVideoRecorder = function useVideoRecorder(camera, audioStream, mergeAVStreams) {
13161
13186
  if (mergeAVStreams === void 0) {
@@ -13537,23 +13562,26 @@ function VideoSignatureGuides(_a) {
13537
13562
  _d = _a.minSignaturePadPoints,
13538
13563
  minSignaturePadPoints = _d === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _d,
13539
13564
  signaturePadEmptyContent = _a.signaturePadEmptyContent,
13540
- _e = _a.classNames,
13541
- classNames = _e === void 0 ? {} : _e,
13542
- _f = _a.verbiage,
13543
- rawVerbiage = _f === void 0 ? {} : _f;
13544
- var _g = useResizeObserver(),
13545
- ref = _g.ref,
13546
- width = _g.width,
13547
- height = _g.height;
13548
- var _h = useVideoSignatureContext(),
13549
- signaturePad = _h.signaturePad,
13550
- onAcceptClicked = _h.onAcceptClicked;
13551
- var _j = React.useState(true),
13552
- signaturePadEmpty = _j[0],
13553
- setSignaturePadEmpty = _j[1];
13554
- var _k = React.useState(false),
13555
- signatureValid = _k[0],
13556
- setSignatureValid = _k[1];
13565
+ headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
13566
+ _e = _a.headTrackingSatisfied,
13567
+ headTrackingSatisfied = _e === void 0 ? true : _e,
13568
+ _f = _a.classNames,
13569
+ classNames = _f === void 0 ? {} : _f,
13570
+ _g = _a.verbiage,
13571
+ rawVerbiage = _g === void 0 ? {} : _g;
13572
+ var _h = useResizeObserver(),
13573
+ ref = _h.ref,
13574
+ width = _h.width,
13575
+ height = _h.height;
13576
+ var _j = useVideoSignatureContext(),
13577
+ signaturePad = _j.signaturePad,
13578
+ onAcceptClicked = _j.onAcceptClicked;
13579
+ var _k = React.useState(true),
13580
+ signaturePadEmpty = _k[0],
13581
+ setSignaturePadEmpty = _k[1];
13582
+ var _l = React.useState(false),
13583
+ signatureValid = _l[0],
13584
+ setSignatureValid = _l[1];
13557
13585
  var verbiage = useTranslations(rawVerbiage, {
13558
13586
  clearSignatureBtnText: 'Clear',
13559
13587
  acceptSignatureBtnText: 'Accept'
@@ -13567,10 +13595,11 @@ function VideoSignatureGuides(_a) {
13567
13595
  }, [classNames.signatureCanvas, height, width]);
13568
13596
  var isSigning = requestedAction === 'CAPTURE_SIGNATURE';
13569
13597
  var canClear = isSigning && !signaturePadEmpty;
13570
- var canSubmit = isSigning && signatureValid;
13598
+ var canSubmit = isSigning && signatureValid && headTrackingSatisfied;
13571
13599
  var displayEmptyState = requestedAction === 'CAPTURE_SIGNATURE' && signaturePadEmpty;
13572
13600
  var EmptyContent = signaturePadEmptyContent;
13573
- return /*#__PURE__*/React__namespace.default.createElement(Container$2, {
13601
+ var HeadTrackingUnsatisfiedContent = headTrackingUnsatisfiedContent;
13602
+ return /*#__PURE__*/React__namespace.default.createElement(Container$3, {
13574
13603
  className: classNames.container
13575
13604
  }, /*#__PURE__*/React__namespace.default.createElement(Inner$1, {
13576
13605
  className: classNames.inner
@@ -13586,10 +13615,11 @@ function VideoSignatureGuides(_a) {
13586
13615
  className: classNames.signaturePadContainer
13587
13616
  }, /*#__PURE__*/React__namespace.default.createElement(SignatureCanvasContainer, {
13588
13617
  className: classNames.signatureCanvasContainer,
13589
- "$disabled": requestedAction === 'VERIFY_LIVENESS'
13618
+ "$disabled": requestedAction === 'VERIFY_LIVENESS',
13619
+ "$headTrackingUnsatisfied": !headTrackingSatisfied
13590
13620
  }, /*#__PURE__*/React__namespace.default.createElement(SignaturePad, {
13591
13621
  ref: ref,
13592
- className: cn__default.default(classNames.signatureCanvasInner, displayEmptyState && 'empty')
13622
+ className: cn__default.default(classNames.signatureCanvasInner, displayEmptyState && 'empty', !headTrackingSatisfied && 'head-tracking-unsatisfied')
13593
13623
  }, /*#__PURE__*/React__namespace.default.createElement(SignatureCanvas__default.default, {
13594
13624
  ref: signaturePad,
13595
13625
  canvasProps: canvasProps,
@@ -13604,7 +13634,9 @@ function VideoSignatureGuides(_a) {
13604
13634
  });
13605
13635
  setSignatureValid(points.length >= minSignaturePadPoints);
13606
13636
  }
13607
- }), displayEmptyState && EmptyContent && ( /*#__PURE__*/React__namespace.default.createElement(EmptyContentContainer, {
13637
+ }), !headTrackingSatisfied && HeadTrackingUnsatisfiedContent ? ( /*#__PURE__*/React__namespace.default.createElement(SignaturePadContentContainer, {
13638
+ className: classNames.headTrackingUnsatisfiedContent
13639
+ }, typeof HeadTrackingUnsatisfiedContent === 'string' ? HeadTrackingUnsatisfiedContent : ( /*#__PURE__*/React__namespace.default.createElement(HeadTrackingUnsatisfiedContent, null)))) : displayEmptyState && EmptyContent && ( /*#__PURE__*/React__namespace.default.createElement(SignaturePadContentContainer, {
13608
13640
  className: classNames.emptyContentContainer
13609
13641
  }, typeof EmptyContent === 'string' ? EmptyContent : ( /*#__PURE__*/React__namespace.default.createElement(EmptyContent, null))))), /*#__PURE__*/React__namespace.default.createElement(SignatureButtonsContainer, {
13610
13642
  className: classNames.signatureButtonsRow
@@ -13628,7 +13660,7 @@ function VideoSignatureGuides(_a) {
13628
13660
  finished: true
13629
13661
  }, verbiage.acceptSignatureBtnText))))));
13630
13662
  }
13631
- var Container$2 = styled__default.default.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"], ["\n display: flex;\n max-height: 100%;\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n font-family: ", ";\n box-sizing: border-box;\n overflow: hidden;\n padding: 40px;\n"])), function (props) {
13663
+ var Container$3 = styled__default.default.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) {
13632
13664
  var _a;
13633
13665
  return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
13634
13666
  });
@@ -13636,15 +13668,17 @@ var Inner$1 = styled__default.default.div(templateObject_2$9 || (templateObject_
13636
13668
  var FaceGuideContainer$1 = styled__default.default.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n position: relative;\n height: 50%;\n"], ["\n position: relative;\n height: 50%;\n"])));
13637
13669
  var StyledSelfieCaptureAnimatedMask = styled__default.default(SelfieCaptureAnimatedMaskWithStatus)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n max-width: 100%;\n height: 100%;\n"], ["\n max-width: 100%;\n height: 100%;\n"])));
13638
13670
  var SignaturePadContainer = styled__default.default.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"])));
13639
- var SignatureCanvasContainer = styled__default.default.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) {
13671
+ var SignatureCanvasContainer = styled__default.default.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) {
13640
13672
  return props.$disabled ? 'opacity: 0.5; pointer-events: none;' : '';
13673
+ }, function (props) {
13674
+ return props.$headTrackingUnsatisfied ? 'pointer-events: none;' : '';
13641
13675
  });
13642
13676
  var AcceptBtn = styled__default.default(LoaderButton)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n margin-left: auto;\n"], ["\n margin-left: auto;\n"])));
13643
- var EmptyContentContainer = styled__default.default.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) {
13677
+ var SignaturePadContentContainer = styled__default.default.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) {
13644
13678
  var _a, _b, _c;
13645
13679
  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';
13646
13680
  });
13647
- var templateObject_1$a, templateObject_2$9, templateObject_3$8, templateObject_4$3, templateObject_5$3, templateObject_6$2, templateObject_7$1, templateObject_8;
13681
+ var templateObject_1$b, templateObject_2$9, templateObject_3$8, templateObject_4$3, templateObject_5$3, templateObject_6$2, templateObject_7$1, templateObject_8;
13648
13682
 
13649
13683
  var DEFAULT_MIN_SIGNATURE_PAD_POINTS = 10;
13650
13684
  var VideoSignatureCapture = function VideoSignatureCapture(_a) {
@@ -13657,6 +13691,7 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
13657
13691
  _c = _a.minSignaturePadPoints,
13658
13692
  minSignaturePadPoints = _c === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _c,
13659
13693
  signaturePadEmptyContent = _a.signaturePadEmptyContent,
13694
+ headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
13660
13695
  _d = _a.classNames,
13661
13696
  classNames = _d === void 0 ? {} : _d,
13662
13697
  _e = _a.colors,
@@ -13665,22 +13700,36 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
13665
13700
  rawVerbiage = _f === void 0 ? {} : _f,
13666
13701
  _g = _a.debugMode,
13667
13702
  debugMode = _g === void 0 ? false : _g;
13668
- var camera = useCameraStore(function (state) {
13669
- return state.camera;
13670
- });
13671
- var onPredictionMade = React.useContext(SelfieGuidanceModelsContext).onPredictionMade;
13672
- var _h = useVideoSignatureContext(),
13673
- signatureData = _h.signatureData,
13674
- signatureDataUrl = _h.signatureDataUrl,
13675
- signatureVideoData = _h.signatureVideoData,
13676
- startRecording = _h.startRecording,
13677
- stopRecording = _h.stopRecording,
13678
- clearRecordedData = _h.clearRecordedData,
13679
- isRecording = _h.isRecording;
13703
+ var _h = useCameraStore(shallow.useShallow(function (state) {
13704
+ return {
13705
+ camera: state.camera,
13706
+ videoWidth: state.videoWidth,
13707
+ videoHeight: state.videoHeight
13708
+ };
13709
+ })),
13710
+ camera = _h.camera,
13711
+ videoWidth = _h.videoWidth,
13712
+ videoHeight = _h.videoHeight;
13713
+ var _j = useSelfieGuidanceModelsContext(),
13714
+ onPredictionMade = _j.onPredictionMade,
13715
+ start = _j.start,
13716
+ stop = _j.stop;
13717
+ var _k = useVideoSignatureContext(),
13718
+ signatureData = _k.signatureData,
13719
+ signatureDataUrl = _k.signatureDataUrl,
13720
+ signatureVideoData = _k.signatureVideoData,
13721
+ startRecording = _k.startRecording,
13722
+ stopRecording = _k.stopRecording,
13723
+ clearRecordedData = _k.clearRecordedData,
13724
+ isRecording = _k.isRecording;
13680
13725
  React.useEffect(function () {
13681
13726
  startRecording();
13682
13727
  return stopRecording;
13683
13728
  }, [startRecording, stopRecording]);
13729
+ React.useEffect(function () {
13730
+ setTimeout(start, 1);
13731
+ return stop;
13732
+ }, [start, stop]);
13684
13733
  colors.guidanceMessageBackgroundColor || (colors.guidanceMessageBackgroundColor = '#ccc');
13685
13734
  colors.guidanceMessageTextColor || (colors.guidanceMessageTextColor = 'black');
13686
13735
  var verbiage = useTranslations(rawVerbiage, {
@@ -13691,27 +13740,47 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
13691
13740
  onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(signatureVideoData, signatureData, signatureDataUrl);
13692
13741
  }
13693
13742
  }, [onVideoCaptured, signatureData, signatureDataUrl, signatureVideoData]);
13694
- var _j = React.useState(0),
13695
- numFramesWithoutFaces = _j[0],
13696
- setNumFramesWithoutFaces = _j[1];
13697
- React.useEffect(function () {
13698
- onPredictionMade(function (_a) {
13699
- var face = _a.face;
13700
- setNumFramesWithoutFaces(face ? 0 : function (n) {
13701
- return n + 1;
13702
- });
13743
+ var _l = React.useState(true),
13744
+ headTrackingSatisfied = _l[0],
13745
+ setHeadTrackingSatisfied = _l[1];
13746
+ var _m = React.useState(null),
13747
+ lastFace = _m[0],
13748
+ setLastFace = _m[1];
13749
+ var _o = React.useState(0),
13750
+ numFramesWithoutFaces = _o[0],
13751
+ setNumFramesWithoutFaces = _o[1];
13752
+ onPredictionMade(useDebounce.useThrottledCallback(function (_a) {
13753
+ var face = _a.face;
13754
+ if (!camera) return;
13755
+ 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 || (face === null || face === void 0 ? void 0 : face.box.yMin) < videoHeight * 0.1 || (face === null || face === void 0 ? void 0 : face.box.yMax) > videoHeight * 0.9;
13756
+ setLastFace(face);
13757
+ setHeadTrackingSatisfied(!!face && !nearBoundary);
13758
+ setNumFramesWithoutFaces(face ? 0 : function (n) {
13759
+ return n + 1;
13703
13760
  });
13704
- }, [onPredictionMade]);
13761
+ }, 16));
13762
+ var _p = useResizeObserver(),
13763
+ ref = _p.ref,
13764
+ _q = _p.width,
13765
+ width = _q === void 0 ? 1 : _q,
13766
+ _r = _p.height,
13767
+ height = _r === void 0 ? 1 : _r;
13768
+ var debugScalingDetails = useDebugScalingDetails({
13769
+ enabled: debugMode,
13770
+ pageWidth: width,
13771
+ pageHeight: height
13772
+ });
13705
13773
  React.useEffect(function () {
13706
13774
  if (numFramesWithoutFaces >= 2) {
13707
13775
  onFaceNotDetected === null || onFaceNotDetected === void 0 ? void 0 : onFaceNotDetected();
13708
13776
  }
13709
13777
  }, [numFramesWithoutFaces, onFaceNotDetected]);
13710
13778
  var GuidesComponent = guidesComponent !== null && guidesComponent !== void 0 ? guidesComponent : VideoSignatureGuides;
13711
- return /*#__PURE__*/React__namespace.default.createElement("div", {
13779
+ return /*#__PURE__*/React__namespace.default.createElement(Container$2, {
13780
+ ref: ref,
13712
13781
  className: classNames.container
13713
13782
  }, verbiage.guidanceMessageText && ( /*#__PURE__*/React__namespace.default.createElement(GuidanceMessageContainer, {
13714
- "$top": "10vh",
13783
+ "$top": "10%",
13715
13784
  className: classNames.guidanceMessageContainer
13716
13785
  }, /*#__PURE__*/React__namespace.default.createElement(GuidanceMessage, {
13717
13786
  className: classNames.guidanceMessage,
@@ -13719,17 +13788,26 @@ var VideoSignatureCapture = function VideoSignatureCapture(_a) {
13719
13788
  "$textColor": colors.guidanceMessageTextColor
13720
13789
  }, verbiage.guidanceMessageText))), /*#__PURE__*/React__namespace.default.createElement(GuidesComponent, {
13721
13790
  status: "success",
13791
+ key: "video-signature-guides-".concat(headTrackingSatisfied ? 'satisfied' : 'unsatisfied'),
13722
13792
  classNames: classNames.videoSignatureGuidesClassNames,
13723
13793
  minSignaturePadPoints: minSignaturePadPoints,
13724
13794
  signaturePadEmptyContent: signaturePadEmptyContent,
13795
+ headTrackingUnsatisfiedContent: headTrackingUnsatisfiedContent,
13796
+ headTrackingSatisfied: headTrackingSatisfied,
13725
13797
  onClearSignaturePadClicked: restartVideoOnSignaturePadCleared ? function () {
13726
13798
  return setTimeout(clearRecordedData, 100);
13727
13799
  } : undefined
13728
- }), debugMode && ( /*#__PURE__*/React__namespace.default.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__namespace.default.createElement("br", null), "Recording: ", isRecording ? 'true' : 'false')), /*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
13800
+ }), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ObjectDetectionDebugOverlayDiv, null, lastFace && ( /*#__PURE__*/React__namespace.default.createElement(SelfieCaptureFaceDebugBox, {
13801
+ face: lastFace,
13802
+ scaling: debugScalingDetails,
13803
+ color: headTrackingSatisfied ? 'green' : 'red'
13804
+ }))), /*#__PURE__*/React__namespace.default.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__namespace.default.createElement("br", null), "Recording: ", isRecording ? 'true' : 'false'))), /*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
13729
13805
  onClick: onExit,
13730
13806
  className: classNames.exitCaptureBtn
13731
13807
  }));
13732
13808
  };
13809
+ var Container$2 = styled__default.default.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n"], ["\n width: 100%;\n height: 100%;\n"])));
13810
+ var templateObject_1$a;
13733
13811
 
13734
13812
  var VideoSignatureSuccess = function VideoSignatureSuccess(_a) {
13735
13813
  var imageUrl = _a.imageUrl,
@@ -13804,6 +13882,7 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13804
13882
  _e = _a.minSignaturePadPoints,
13805
13883
  minSignaturePadPoints = _e === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _e,
13806
13884
  signaturePadEmptyContent = _a.signaturePadEmptyContent,
13885
+ headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
13807
13886
  _f = _a.allowSignatureAfterLivenessCheckFailure,
13808
13887
  allowSignatureAfterLivenessCheckFailure = _f === void 0 ? false : _f,
13809
13888
  _g = _a.restartVideoOnSignaturePadCleared,
@@ -13836,7 +13915,7 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13836
13915
  var operationStartedAt = React.useRef();
13837
13916
  var captureStartedAt = React.useRef();
13838
13917
  var captureEndedAt = React.useRef();
13839
- var _q = React.useContext(SelfieGuidanceModelsContext),
13918
+ var _q = useSelfieGuidanceModelsContext(),
13840
13919
  start = _q.start,
13841
13920
  stop = _q.stop;
13842
13921
  React.useEffect(function () {
@@ -13851,9 +13930,9 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13851
13930
  if (!shouldRun) return;
13852
13931
  start();
13853
13932
  return function () {
13854
- stop();
13933
+ return stop();
13855
13934
  };
13856
- }, [shouldRun, start, stop]);
13935
+ }, [start, stop, shouldRun]);
13857
13936
  var logCaptureMetadata = React.useCallback(function () {
13858
13937
  var _a, _b, _c;
13859
13938
  logSelfieCaptureAttempt({
@@ -13884,12 +13963,16 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13884
13963
  setCaptureState('SUCCESS');
13885
13964
  onVideoCaptured === null || onVideoCaptured === void 0 ? void 0 : onVideoCaptured(videoData, signatureData, signatureImageData);
13886
13965
  }, [onVideoCaptured, setSignatureData, setSignatureVideoUrl]);
13966
+ var _s = React.useState(true),
13967
+ showLoadingOverlay = _s[0],
13968
+ setShowLoadingOverlay = _s[1];
13887
13969
  var onSignatureCaptureFacesNotDetected = React.useCallback(function () {
13970
+ setShowLoadingOverlay(false);
13888
13971
  setCaptureState('CHECKING_LIVENESS');
13889
13972
  }, []);
13890
- var _s = React.useState(0),
13891
- attempt = _s[0],
13892
- setAttempt = _s[1];
13973
+ var _t = React.useState(0),
13974
+ attempt = _t[0],
13975
+ setAttempt = _t[1];
13893
13976
  var onRetry = React.useCallback(function () {
13894
13977
  onRetryClicked === null || onRetryClicked === void 0 ? void 0 : onRetryClicked();
13895
13978
  setAttempt(function (n) {
@@ -13948,7 +14031,8 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13948
14031
  colors: colors.faceLiveness,
13949
14032
  verbiage: verbiage.faceLiveness,
13950
14033
  debugMode: debugMode,
13951
- renderCameraFeed: false
14034
+ renderCameraFeed: false,
14035
+ showLoadingOverlay: showLoadingOverlay
13952
14036
  }));
13953
14037
  case 'CAPTURING_SIGNATURE':
13954
14038
  return /*#__PURE__*/React__namespace.default.createElement(VideoSignatureCapture, {
@@ -13957,6 +14041,7 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13957
14041
  onExit: onExitCapture,
13958
14042
  minSignaturePadPoints: minSignaturePadPoints,
13959
14043
  signaturePadEmptyContent: signaturePadEmptyContent,
14044
+ headTrackingUnsatisfiedContent: headTrackingUnsatisfiedContent,
13960
14045
  restartVideoOnSignaturePadCleared: restartVideoOnSignaturePadCleared,
13961
14046
  guidesComponent: guidesComponent,
13962
14047
  classNames: classNames,
@@ -13981,20 +14066,17 @@ var VideoSignatureWizard = function VideoSignatureWizard(_a) {
13981
14066
  };
13982
14067
  function VideoSignatureWizardGuides(_a) {
13983
14068
  var status = _a.status,
13984
- classNames = _a.classNames,
13985
14069
  _b = _a.restartVideoOnSignaturePadCleared,
13986
14070
  restartVideoOnSignaturePadCleared = _b === void 0 ? true : _b,
13987
- signaturePadEmptyContent = _a.signaturePadEmptyContent;
14071
+ props = __rest(_a, ["status", "restartVideoOnSignaturePadCleared"]);
13988
14072
  var clearRecordedData = useVideoSignatureContext().clearRecordedData;
13989
- return /*#__PURE__*/React__namespace.default.createElement(VideoSignatureGuides, {
13990
- classNames: classNames,
14073
+ return /*#__PURE__*/React__namespace.default.createElement(VideoSignatureGuides, _assign({}, props, {
13991
14074
  faceGuideStatus: status,
13992
- signaturePadEmptyContent: signaturePadEmptyContent,
13993
14075
  requestedAction: status === 'success' ? 'CAPTURE_SIGNATURE' : 'VERIFY_LIVENESS',
13994
14076
  onClearSignaturePadClicked: restartVideoOnSignaturePadCleared ? function () {
13995
14077
  return setTimeout(clearRecordedData, 100);
13996
14078
  } : undefined
13997
- });
14079
+ }));
13998
14080
  }
13999
14081
  var VideoSignatureWizardWithProviders = function VideoSignatureWizardWithProviders(props) {
14000
14082
  var _a, _b;
@@ -14294,103 +14376,103 @@ var defaultVideoIdCaptureThresholds = {
14294
14376
  flipShortcutThreshold: 0.7
14295
14377
  };
14296
14378
  var IdVideoCapture = function IdVideoCapture(_a) {
14297
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
14379
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
14298
14380
  var onComplete = _a.onComplete,
14299
14381
  onIdFrontImageCaptured = _a.onIdFrontImageCaptured,
14300
14382
  onIdBackImageCaptured = _a.onIdBackImageCaptured,
14301
14383
  onFaceNotDetected = _a.onFaceNotDetected,
14302
14384
  onRecordingFailed = _a.onRecordingFailed,
14303
14385
  onExitCapture = _a.onExitCapture,
14304
- _v = _a.idCaptureModelsEnabled,
14305
- idCaptureModelsEnabled = _v === void 0 ? true : _v,
14306
- _w = _a.idDocumentType,
14307
- idDocumentType = _w === void 0 ? 'idCard' : _w,
14308
- _x = _a.idCaptureGuideImages,
14309
- idCaptureGuideImages = _x === void 0 ? defaultIdCaptureGuideImages : _x,
14310
- _y = _a.idCardFrontDelay,
14311
- idCardFrontDelay = _y === void 0 ? 1000 : _y,
14312
- _z = _a.videoIdCaptureThresholds,
14313
- videoIdCaptureThresholds = _z === void 0 ? defaultVideoIdCaptureThresholds : _z,
14314
- _0 = _a.skipShowIdCardBack,
14315
- skipShowIdCardBack = _0 === void 0 ? false : _0,
14316
- _1 = _a.captureCountdownSeconds,
14317
- captureCountdownSeconds = _1 === void 0 ? 3 : _1,
14386
+ _r = _a.idCaptureModelsEnabled,
14387
+ idCaptureModelsEnabled = _r === void 0 ? true : _r,
14388
+ _s = _a.idDocumentType,
14389
+ idDocumentType = _s === void 0 ? 'idCard' : _s,
14390
+ _t = _a.idCaptureGuideImages,
14391
+ idCaptureGuideImages = _t === void 0 ? defaultIdCaptureGuideImages : _t,
14392
+ _u = _a.idCardFrontDelay,
14393
+ idCardFrontDelay = _u === void 0 ? 1000 : _u,
14394
+ _v = _a.videoIdCaptureThresholds,
14395
+ videoIdCaptureThresholds = _v === void 0 ? defaultVideoIdCaptureThresholds : _v,
14396
+ _w = _a.skipShowIdCardBack,
14397
+ skipShowIdCardBack = _w === void 0 ? false : _w,
14398
+ _x = _a.captureCountdownSeconds,
14399
+ captureCountdownSeconds = _x === void 0 ? 3 : _x,
14318
14400
  readTextPrompt = _a.readTextPrompt,
14319
- _2 = _a.readTextTimeoutDurationMs,
14320
- readTextTimeoutDurationMs = _2 === void 0 ? 15000 : _2,
14321
- _3 = _a.readTextMinReadingMs,
14322
- readTextMinReadingMs = _3 === void 0 ? 10000 : _3,
14323
- _4 = _a.disableFaceDetectionWhileAudioCapture,
14324
- disableFaceDetectionWhileAudioCapture = _4 === void 0 ? false : _4,
14325
- _5 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
14326
- disableFaceDetectionWhileAudioCaptureMsDelay = _5 === void 0 ? 2000 : _5,
14327
- _6 = _a.mergeAVStreams,
14328
- mergeAVStreams = _6 === void 0 ? false : _6,
14329
- _7 = _a.classNames,
14330
- classNames = _7 === void 0 ? {} : _7,
14331
- _8 = _a.colors,
14332
- colors = _8 === void 0 ? {} : _8,
14333
- _9 = _a.verbiage,
14334
- rawVerbiage = _9 === void 0 ? {} : _9,
14335
- _10 = _a.debugMode,
14336
- debugMode = _10 === void 0 ? false : _10;
14337
- var _11 = useResizeObserver(),
14338
- ref = _11.ref,
14339
- _12 = _11.width,
14340
- width = _12 === void 0 ? 1 : _12,
14341
- _13 = _11.height,
14342
- height = _13 === void 0 ? 1 : _13;
14343
- var _14 = useCameraStore(),
14344
- camera = _14.camera,
14345
- videoRef = _14.videoRef,
14346
- videoLoaded = _14.videoLoaded,
14347
- cameraReady = _14.cameraReady,
14348
- microphoneReady = _14.microphoneReady,
14349
- audioStream = _14.audioStream,
14350
- isRearFacing = _14.isRearFacing,
14351
- releaseCameraAccess = _14.releaseCameraAccess;
14352
- var _15 = React.useState([]),
14353
- detectedObjects = _15[0],
14354
- setDetectedObjects = _15[1];
14355
- var _16 = React.useState(null),
14356
- face = _16[0],
14357
- setFace = _16[1];
14358
- var _17 = React.useContext(IdCaptureModelsContext),
14359
- idModelsReady = _17.ready,
14360
- startIdModels = _17.start,
14361
- stopIdModels = _17.stop,
14362
- onIdPredictionMade = _17.onPredictionMade,
14363
- setThresholds = _17.setThresholds,
14364
- setRequiredDocumentType = _17.setRequiredDocumentType,
14365
- setDocumentDetectionBoundaries = _17.setDocumentDetectionBoundaries,
14366
- bestFrameDetails = _17.bestFrameDetails,
14367
- resetBestFrame = _17.resetBestFrame,
14368
- idModelError = _17.modelError;
14369
- var _18 = React.useState(null),
14370
- videoStartsAt = _18[0],
14371
- setVideoStartsAt = _18[1];
14372
- var _19 = React.useContext(SubmissionContext),
14373
- setIdCaptureVideoAudioStartsAt = _19.setIdCaptureVideoAudioStartsAt,
14374
- setExpectedAudioText = _19.setExpectedAudioText;
14375
- var _20 = React.useContext(SelfieGuidanceModelsContext),
14376
- startSelfieGuidance = _20.start,
14377
- stopSelfieGuidance = _20.stop,
14378
- onSelfiePredictionMade = _20.onPredictionMade,
14379
- selfieModelError = _20.error;
14380
- var _21 = useVideoRecorder(camera, audioStream, mergeAVStreams),
14381
- isRecordingVideo = _21.isRecordingVideo,
14382
- startRecordingVideo = _21.startRecordingVideo,
14383
- startRecordingAudio = _21.startRecordingAudio,
14384
- stopRecordingVideo = _21.stopRecordingVideo,
14385
- stopRecordingAudio = _21.stopRecordingAudio,
14386
- videoRecordingUnintentionallyStopped = _21.videoRecordingUnintentionallyStopped,
14387
- audioRecordingUnintentionallyStopped = _21.audioRecordingUnintentionallyStopped,
14388
- videoUrl = _21.videoUrl,
14389
- audioUrl = _21.audioUrl;
14401
+ _y = _a.readTextTimeoutDurationMs,
14402
+ readTextTimeoutDurationMs = _y === void 0 ? 15000 : _y,
14403
+ _z = _a.readTextMinReadingMs,
14404
+ readTextMinReadingMs = _z === void 0 ? 10000 : _z,
14405
+ _0 = _a.disableFaceDetectionWhileAudioCapture,
14406
+ disableFaceDetectionWhileAudioCapture = _0 === void 0 ? false : _0,
14407
+ _1 = _a.disableFaceDetectionWhileAudioCaptureMsDelay,
14408
+ disableFaceDetectionWhileAudioCaptureMsDelay = _1 === void 0 ? 2000 : _1,
14409
+ _2 = _a.mergeAVStreams,
14410
+ mergeAVStreams = _2 === void 0 ? false : _2,
14411
+ _3 = _a.classNames,
14412
+ classNames = _3 === void 0 ? {} : _3,
14413
+ _4 = _a.colors,
14414
+ colors = _4 === void 0 ? {} : _4,
14415
+ _5 = _a.verbiage,
14416
+ rawVerbiage = _5 === void 0 ? {} : _5,
14417
+ _6 = _a.debugMode,
14418
+ debugMode = _6 === void 0 ? false : _6;
14419
+ var _7 = useResizeObserver(),
14420
+ ref = _7.ref,
14421
+ _8 = _7.width,
14422
+ width = _8 === void 0 ? 1 : _8,
14423
+ _9 = _7.height,
14424
+ height = _9 === void 0 ? 1 : _9;
14425
+ var _10 = useCameraStore(),
14426
+ camera = _10.camera,
14427
+ videoRef = _10.videoRef,
14428
+ videoLoaded = _10.videoLoaded,
14429
+ cameraReady = _10.cameraReady,
14430
+ microphoneReady = _10.microphoneReady,
14431
+ audioStream = _10.audioStream,
14432
+ isRearFacing = _10.isRearFacing,
14433
+ releaseCameraAccess = _10.releaseCameraAccess;
14434
+ var _11 = React.useState([]),
14435
+ detectedObjects = _11[0],
14436
+ setDetectedObjects = _11[1];
14437
+ var _12 = React.useState(null),
14438
+ face = _12[0],
14439
+ setFace = _12[1];
14440
+ var _13 = React.useContext(IdCaptureModelsContext),
14441
+ idModelsReady = _13.ready,
14442
+ startIdModels = _13.start,
14443
+ stopIdModels = _13.stop,
14444
+ onIdPredictionMade = _13.onPredictionMade,
14445
+ setThresholds = _13.setThresholds,
14446
+ setRequiredDocumentType = _13.setRequiredDocumentType,
14447
+ setDocumentDetectionBoundaries = _13.setDocumentDetectionBoundaries,
14448
+ bestFrameDetails = _13.bestFrameDetails,
14449
+ resetBestFrame = _13.resetBestFrame,
14450
+ idModelError = _13.modelError;
14451
+ var _14 = React.useState(null),
14452
+ videoStartsAt = _14[0],
14453
+ setVideoStartsAt = _14[1];
14454
+ var _15 = React.useContext(SubmissionContext),
14455
+ setIdCaptureVideoAudioStartsAt = _15.setIdCaptureVideoAudioStartsAt,
14456
+ setExpectedAudioText = _15.setExpectedAudioText;
14457
+ var _16 = React.useContext(SelfieGuidanceModelsContext),
14458
+ startSelfieGuidance = _16.start,
14459
+ stopSelfieGuidance = _16.stop,
14460
+ onSelfiePredictionMade = _16.onPredictionMade,
14461
+ selfieModelError = _16.error;
14462
+ var _17 = useVideoRecorder(camera, audioStream, mergeAVStreams),
14463
+ isRecordingVideo = _17.isRecordingVideo,
14464
+ startRecordingVideo = _17.startRecordingVideo,
14465
+ startRecordingAudio = _17.startRecordingAudio,
14466
+ stopRecordingVideo = _17.stopRecordingVideo,
14467
+ stopRecordingAudio = _17.stopRecordingAudio,
14468
+ videoRecordingUnintentionallyStopped = _17.videoRecordingUnintentionallyStopped,
14469
+ audioRecordingUnintentionallyStopped = _17.audioRecordingUnintentionallyStopped,
14470
+ videoUrl = _17.videoUrl,
14471
+ audioUrl = _17.audioUrl;
14390
14472
  var countdownTimeoutRef = React.useRef(undefined);
14391
- var _22 = React.useState(-1),
14392
- countdownRemaining = _22[0],
14393
- setCountdownRemaining = _22[1];
14473
+ var _18 = React.useState(-1),
14474
+ countdownRemaining = _18[0],
14475
+ setCountdownRemaining = _18[1];
14394
14476
  React.useEffect(function () {
14395
14477
  if (!isRecordingVideo && !videoUrl) {
14396
14478
  startRecordingVideo();
@@ -14410,9 +14492,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14410
14492
  onRecordingFailed === null || onRecordingFailed === void 0 ? void 0 : onRecordingFailed();
14411
14493
  }
14412
14494
  }, [audioRecordingUnintentionallyStopped, microphoneReady, onRecordingFailed, readTextPrompt, videoRecordingUnintentionallyStopped]);
14413
- var _23 = React.useState(idDocumentType === 'idCard' ? 'SHOW_ID_FRONT' : 'SHOW_PASSPORT'),
14414
- requestedAction = _23[0],
14415
- setRequestedAction = _23[1];
14495
+ var _19 = React.useState(idDocumentType === 'idCard' ? 'SHOW_ID_FRONT' : 'SHOW_PASSPORT'),
14496
+ requestedAction = _19[0],
14497
+ setRequestedAction = _19[1];
14416
14498
  var shouldRunIdModels = idCaptureModelsEnabled && videoLoaded && cameraReady && idModelsReady && !idModelError && requestedAction !== 'READ_TEXT' && (!readTextPrompt || microphoneReady);
14417
14499
  React.useEffect(function startModelsWhenCapturing() {
14418
14500
  if (!shouldRunIdModels) return;
@@ -14451,23 +14533,23 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14451
14533
  bottom: 0
14452
14534
  });
14453
14535
  }, [setDocumentDetectionBoundaries]);
14454
- var _24 = React.useState(0),
14455
- currentDetectionScore = _24[0],
14456
- setCurrentDetectionScore = _24[1];
14457
- var _25 = React.useState('none'),
14458
- currentDetectedDocumentType = _25[0],
14459
- setCurrentDetectedDocumentType = _25[1];
14460
- var _26 = React.useState(0),
14461
- currentFocusScore = _26[0],
14462
- setCurrentFocusScore = _26[1];
14463
- var _27 = React.useState(0),
14464
- goodFramesCount = _27[0],
14465
- setGoodFramesCount = _27[1];
14536
+ var _20 = React.useState(0),
14537
+ currentDetectionScore = _20[0],
14538
+ setCurrentDetectionScore = _20[1];
14539
+ var _21 = React.useState('none'),
14540
+ currentDetectedDocumentType = _21[0],
14541
+ setCurrentDetectedDocumentType = _21[1];
14542
+ var _22 = React.useState(0),
14543
+ currentFocusScore = _22[0],
14544
+ setCurrentFocusScore = _22[1];
14545
+ var _23 = React.useState(0),
14546
+ goodFramesCount = _23[0],
14547
+ setGoodFramesCount = _23[1];
14466
14548
  var goodFramesThreshold = requestedAction === 'SHOW_PASSPORT' ? adjustedThresholds.goodFrames.passport : requestedAction === 'SHOW_ID_FRONT' ? adjustedThresholds.goodFrames.idCardFront : adjustedThresholds.goodFrames.idCardBack;
14467
14549
  var goodFramesThresholdMet = goodFramesCount >= goodFramesThreshold;
14468
- var _28 = React.useState(false),
14469
- isSinglePage = _28[0],
14470
- setIsSinglePage = _28[1];
14550
+ var _24 = React.useState(false),
14551
+ isSinglePage = _24[0],
14552
+ setIsSinglePage = _24[1];
14471
14553
  React.useEffect(function () {
14472
14554
  if (!idCaptureModelsEnabled || idModelError) return;
14473
14555
  onIdPredictionMade(function (prediction) {
@@ -14487,9 +14569,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14487
14569
  } : 0);
14488
14570
  });
14489
14571
  }, [idCaptureModelsEnabled, onIdPredictionMade, idModelError, requestedAction, adjustedThresholds.flipShortcutThreshold]);
14490
- var _29 = React.useState(null),
14491
- idFrontCaptureStartedAt = _29[0],
14492
- setFirstGoodFrameTime = _29[1];
14572
+ var _25 = React.useState(null),
14573
+ idFrontCaptureStartedAt = _25[0],
14574
+ setFirstGoodFrameTime = _25[1];
14493
14575
  React.useEffect(function () {
14494
14576
  if (goodFramesCount === 1) setFirstGoodFrameTime(new Date().getTime());
14495
14577
  }, [goodFramesCount]);
@@ -14510,9 +14592,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14510
14592
  var frameHeight = (_e = (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) !== null && _e !== void 0 ? _e : 0;
14511
14593
  var faceBox = face === null || face === void 0 ? void 0 : face.box;
14512
14594
  var faceCentered = !faceBox || !frameWidth || faceBox.xMin > frameWidth * edgeBoundary && faceBox.yMin > frameHeight * edgeBoundary && faceBox.xMax < frameWidth * (1 - edgeBoundary) && faceBox.yMax < frameHeight * (1 - edgeBoundary);
14513
- var _30 = React.useState(),
14514
- countdownStartedAt = _30[0],
14515
- setCountdownStartedAt = _30[1];
14595
+ var _26 = React.useState(),
14596
+ countdownStartedAt = _26[0],
14597
+ setCountdownStartedAt = _26[1];
14516
14598
  var photoCanvas = React.useRef(null);
14517
14599
  var frameLock = React.useRef(false);
14518
14600
  var captureFrame = React.useCallback(function () {
@@ -14622,9 +14704,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14622
14704
  stopSelfieGuidance();
14623
14705
  };
14624
14706
  }, [startSelfieGuidance, stopSelfieGuidance]);
14625
- var _31 = React.useState(0),
14626
- numFramesWithoutFaces = _31[0],
14627
- setNumFramesWithoutFaces = _31[1];
14707
+ var _27 = React.useState(0),
14708
+ numFramesWithoutFaces = _27[0],
14709
+ setNumFramesWithoutFaces = _27[1];
14628
14710
  onSelfiePredictionMade(useDebounce.useThrottledCallback(React.useCallback(function (_a) {
14629
14711
  var face = _a.face;
14630
14712
  if (selfieModelError) return;
@@ -14640,18 +14722,16 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14640
14722
  }
14641
14723
  }, [disableFaceDetectionWhileAudioCapture, disableFaceDetectionWhileAudioCaptureMsDelay, numFramesWithoutFaces, onFaceNotDetected, timeoutStartedAt]);
14642
14724
  var theme = styled.useTheme();
14643
- var _32 = useTranslations(rawVerbiage, {
14725
+ var _28 = useTranslations(rawVerbiage, {
14644
14726
  faceNotCenteredText: 'Please move your face to the center...',
14645
14727
  captureBtnText: 'Capture'
14646
14728
  }),
14647
- captureBtnText = _32.captureBtnText,
14648
- faceNotCenteredText = _32.faceNotCenteredText;
14729
+ captureBtnText = _28.captureBtnText,
14730
+ faceNotCenteredText = _28.faceNotCenteredText;
14649
14731
  var debugScalingDetails = useDebugScalingDetails({
14650
14732
  enabled: debugMode,
14651
14733
  pageWidth: width,
14652
- pageHeight: height,
14653
- videoWidth: (_g = (_f = videoRef.current) === null || _f === void 0 ? void 0 : _f.videoWidth) !== null && _g !== void 0 ? _g : 0,
14654
- videoHeight: (_j = (_h = videoRef.current) === null || _h === void 0 ? void 0 : _h.videoHeight) !== null && _j !== void 0 ? _j : 0
14734
+ pageHeight: height
14655
14735
  });
14656
14736
  var capturingId = ['SHOW_ID_FRONT', 'SHOW_ID_BACK', 'SHOW_PASSPORT'].includes(requestedAction);
14657
14737
  var guidanceText = !faceCentered ? faceNotCenteredText : undefined;
@@ -14696,9 +14776,9 @@ var IdVideoCapture = function IdVideoCapture(_a) {
14696
14776
  className: classNames.guidanceMessageContainer
14697
14777
  }, /*#__PURE__*/React__namespace.default.createElement(GuidanceMessage, {
14698
14778
  className: classNames.guidanceMessage,
14699
- "$background": (_m = (_l = (_k = theme.guidanceMessages) === null || _k === void 0 ? void 0 : _k.negative) === null || _l === void 0 ? void 0 : _l.backgroundColor) !== null && _m !== void 0 ? _m : 'red',
14700
- "$textColor": (_q = (_p = (_o = theme.guidanceMessages) === null || _o === void 0 ? void 0 : _o.negative) === null || _p === void 0 ? void 0 : _p.textColor) !== null && _q !== void 0 ? _q : 'white'
14701
- }, guidanceText))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__namespace.default.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__namespace.default.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Best Frame Detection Score:", ' ', (_s = (_r = bestFrameDetails.current) === null || _r === void 0 ? void 0 : _r.detectionScore) !== null && _s !== void 0 ? _s : 0, /*#__PURE__*/React__namespace.default.createElement("br", null), "Best Frame Focus Score: ", (_u = (_t = bestFrameDetails.current) === null || _t === void 0 ? void 0 : _t.focusScore) !== null && _u !== void 0 ? _u : 0)), countdownRemaining > 0 && capturingId && ( /*#__PURE__*/React__namespace.default.createElement(CountdownContainer, {
14779
+ "$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',
14780
+ "$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'
14781
+ }, guidanceText))), debugMode && ( /*#__PURE__*/React__namespace.default.createElement(DebugStatsPane, null, camera ? ( /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Camera: ", camera.label, " (", camera.width, "x", camera.height, ")")) : '❌ Camera not ready', /*#__PURE__*/React__namespace.default.createElement("br", null), isRecordingVideo ? '✅ Recording' : '❌ Not recording', /*#__PURE__*/React__namespace.default.createElement("br", null), goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', goodFramesCount, "/", goodFramesThreshold, /*#__PURE__*/React__namespace.default.createElement("br", null), "Document Type: ", currentDetectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), "Detection Score: ", currentDetectionScore, /*#__PURE__*/React__namespace.default.createElement("br", null), "Focus Score: ", currentFocusScore, /*#__PURE__*/React__namespace.default.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__namespace.default.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__namespace.default.createElement(CountdownContainer, {
14702
14782
  className: classNames.countdownContainer
14703
14783
  }, /*#__PURE__*/React__namespace.default.createElement(Countdown, {
14704
14784
  className: classNames.countdown
@@ -17685,6 +17765,7 @@ var SignatureKYC = function SignatureKYC(_a) {
17685
17765
  _f = _a.minSignaturePadPoints,
17686
17766
  minSignaturePadPoints = _f === void 0 ? DEFAULT_MIN_SIGNATURE_PAD_POINTS : _f,
17687
17767
  signaturePadEmptyContent = _a.signaturePadEmptyContent,
17768
+ headTrackingUnsatisfiedContent = _a.headTrackingUnsatisfiedContent,
17688
17769
  _g = _a.modelLoadTimeoutMs,
17689
17770
  modelLoadTimeoutMs = _g === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _g,
17690
17771
  _h = _a.allowSignatureAfterLivenessCheckFailure,
@@ -17746,6 +17827,7 @@ var SignatureKYC = function SignatureKYC(_a) {
17746
17827
  captureAudio: captureAudio,
17747
17828
  minSignaturePadPoints: minSignaturePadPoints,
17748
17829
  signaturePadEmptyContent: signaturePadEmptyContent,
17830
+ headTrackingUnsatisfiedContent: headTrackingUnsatisfiedContent,
17749
17831
  modelLoadTimeoutMs: modelLoadTimeoutMs,
17750
17832
  faceLivenessProps: faceLivenessProps,
17751
17833
  allowSignatureAfterLivenessCheckFailure: allowSignatureAfterLivenessCheckFailure,
@@ -17757,7 +17839,7 @@ var SignatureKYC = function SignatureKYC(_a) {
17757
17839
  onModelError: onModelError,
17758
17840
  onUserCancel: onUserCancel
17759
17841
  };
17760
- }, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, signaturePadEmptyContent, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
17842
+ }, [customOverlayContent, onLoadingOverlayDismissed, loadingOverlayMode, skipSuccessScreen, captureAudio, minSignaturePadPoints, signaturePadEmptyContent, headTrackingUnsatisfiedContent, modelLoadTimeoutMs, faceLivenessProps, allowSignatureAfterLivenessCheckFailure, restartVideoOnSignaturePadCleared, classNames, colors, debugMode, verbiage, onModelError, onUserCancel])
17761
17843
  })))));
17762
17844
  };
17763
17845