idmission-web-sdk 2.3.174 → 2.3.175-feature-barcode-client-scan-eaf765f
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/common/debug.d.ts +3 -0
- package/dist/components/common/debug.d.ts.map +1 -1
- package/dist/components/customer_flows/IdValidation.d.ts +11 -0
- package/dist/components/customer_flows/IdValidation.d.ts.map +1 -1
- package/dist/components/id_capture/BarcodeGuideOverlay.d.ts +23 -0
- package/dist/components/id_capture/BarcodeGuideOverlay.d.ts.map +1 -0
- package/dist/components/id_capture/BarcodeSuccessOverlay.d.ts +8 -0
- package/dist/components/id_capture/BarcodeSuccessOverlay.d.ts.map +1 -0
- package/dist/components/id_capture/DynamsoftBarcodeProvider.d.ts +29 -0
- package/dist/components/id_capture/DynamsoftBarcodeProvider.d.ts.map +1 -0
- package/dist/components/id_capture/DynamsoftLicensePrompt.d.ts +9 -0
- package/dist/components/id_capture/DynamsoftLicensePrompt.d.ts.map +1 -0
- package/dist/components/id_capture/IdCapture.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureGuides.d.ts +5 -1
- package/dist/components/id_capture/IdCaptureGuides.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureModelsProvider.d.ts +8 -0
- package/dist/components/id_capture/IdCaptureModelsProvider.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureStateProvider.d.ts +74 -1
- package/dist/components/id_capture/IdCaptureStateProvider.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureSuccess.d.ts +18 -1
- package/dist/components/id_capture/IdCaptureSuccess.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts +32 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts.map +1 -1
- package/dist/lib/barcode/AAMVAParser.d.ts +32 -0
- package/dist/lib/barcode/AAMVAParser.d.ts.map +1 -0
- package/dist/lib/barcode/DynamsoftLoader.d.ts +26 -0
- package/dist/lib/barcode/DynamsoftLoader.d.ts.map +1 -0
- package/dist/lib/barcode/DynamsoftTypes.d.ts +128 -0
- package/dist/lib/barcode/DynamsoftTypes.d.ts.map +1 -0
- package/dist/lib/barcode/NativeBarcodeDecoder.d.ts +93 -0
- package/dist/lib/barcode/NativeBarcodeDecoder.d.ts.map +1 -0
- package/dist/lib/camera/cameraStore.d.ts.map +1 -1
- package/dist/lib/models/DocumentDetection.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +2677 -522
- package/dist/sdk2.cjs.development.js.map +1 -1
- package/dist/sdk2.cjs.production.js +1 -1
- package/dist/sdk2.cjs.production.js.map +1 -1
- package/dist/sdk2.esm.js +2677 -522
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +2679 -524
- package/dist/sdk2.umd.development.js.map +1 -1
- package/dist/sdk2.umd.production.js +1 -1
- package/dist/sdk2.umd.production.js.map +1 -1
- package/package.json +1 -1
|
@@ -483,16 +483,16 @@ var LoaderButton = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
483
483
|
}, children));
|
|
484
484
|
});
|
|
485
485
|
LoaderButton.displayName = 'LoaderButton';
|
|
486
|
-
var StyledButton = styled__default.default.button(templateObject_1$S || (templateObject_1$S = __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) {
|
|
486
|
+
var StyledButton = styled__default.default.button(templateObject_1$V || (templateObject_1$V = __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) {
|
|
487
487
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
488
488
|
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-color);\n background-color: var(--bs-btn-bg);\n border-color: var(--bs-btn-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 ");
|
|
489
489
|
});
|
|
490
|
-
var templateObject_1$
|
|
490
|
+
var templateObject_1$V;
|
|
491
491
|
|
|
492
|
-
var ButtonsRow$2 = styled__default.default.div(templateObject_1$
|
|
493
|
-
var templateObject_1$
|
|
492
|
+
var ButtonsRow$2 = styled__default.default.div(templateObject_1$U || (templateObject_1$U = __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"])));
|
|
493
|
+
var templateObject_1$U;
|
|
494
494
|
|
|
495
|
-
var GuidanceMessageContainerDiv = styled__default.default.div(templateObject_1$
|
|
495
|
+
var GuidanceMessageContainerDiv = styled__default.default.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n padding: 0 10%;\n box-sizing: border-box;\n"], ["\n position: absolute;\n top: calc(", ");\n ", "\n font-weight: bold;\n width: 100%;\n display: flex;\n padding: 0 10%;\n box-sizing: border-box;\n"])), function (_a) {
|
|
496
496
|
var $top = _a.$top;
|
|
497
497
|
return $top !== null && $top !== void 0 ? $top : '10%';
|
|
498
498
|
}, function (_a) {
|
|
@@ -505,38 +505,38 @@ var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
|
505
505
|
if (!portalLocation) return element;
|
|
506
506
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
507
507
|
};
|
|
508
|
-
var GuidanceMessage = styled__default.default.div(templateObject_2$
|
|
508
|
+
var GuidanceMessage = styled__default.default.div(templateObject_2$O || (templateObject_2$O = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n border-radius: 8px;\n z-index: 10001;\n padding: 16px 24px;\n font-size: 18px;\n font-weight: bold;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n border-radius: 8px;\n z-index: 10001;\n padding: 16px 24px;\n font-size: 18px;\n font-weight: bold;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])), function (props) {
|
|
509
509
|
var _a, _b, _c, _d, _e, _f;
|
|
510
510
|
return (_f = (_a = props.$background) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.backgroundColor) !== null && _f !== void 0 ? _f : 'white';
|
|
511
511
|
}, function (props) {
|
|
512
512
|
var _a, _b, _c, _d, _e, _f;
|
|
513
513
|
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';
|
|
514
514
|
});
|
|
515
|
-
var templateObject_1$
|
|
515
|
+
var templateObject_1$T, templateObject_2$O;
|
|
516
516
|
|
|
517
|
-
var wavesAnimation = styled.keyframes(templateObject_1$
|
|
518
|
-
var progressBarAnimation = styled.keyframes(templateObject_2$
|
|
519
|
-
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$
|
|
520
|
-
var progressBorderAnimation = styled.keyframes(templateObject_4$
|
|
521
|
-
var templateObject_1$
|
|
517
|
+
var wavesAnimation = styled.keyframes(templateObject_1$S || (templateObject_1$S = __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"])));
|
|
518
|
+
var progressBarAnimation = styled.keyframes(templateObject_2$N || (templateObject_2$N = __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"])));
|
|
519
|
+
var dualRingSpinnerAnimation = styled.keyframes(templateObject_3$z || (templateObject_3$z = __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"])));
|
|
520
|
+
var progressBorderAnimation = styled.keyframes(templateObject_4$t || (templateObject_4$t = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
521
|
+
var templateObject_1$S, templateObject_2$N, templateObject_3$z, templateObject_4$t;
|
|
522
522
|
|
|
523
|
-
var OverlayContainer = styled__default.default.div(templateObject_1$
|
|
523
|
+
var OverlayContainer = styled__default.default.div(templateObject_1$R || (templateObject_1$R = __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) {
|
|
524
524
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
525
525
|
}, function (props) {
|
|
526
526
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
527
527
|
});
|
|
528
|
-
var OverlayInner$2 = styled__default.default.div(templateObject_2$
|
|
528
|
+
var OverlayInner$2 = styled__default.default.div(templateObject_2$M || (templateObject_2$M = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) {
|
|
529
529
|
var _a;
|
|
530
530
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
531
531
|
}, function (props) {
|
|
532
532
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
533
533
|
});
|
|
534
|
-
var OverlayImageContainer = styled__default.default.div(templateObject_3$
|
|
535
|
-
var OverlayImageRow = styled__default.default.div(templateObject_4$
|
|
536
|
-
var GrayOverlayContainer = styled__default.default(OverlayContainer)(templateObject_5$
|
|
537
|
-
var ButtonsColumn = styled__default.default.div(templateObject_6$
|
|
538
|
-
var WideButton = styled__default.default(LoaderButton)(templateObject_7$
|
|
539
|
-
var WideBorderButton = styled__default.default(WideButton)(templateObject_8$
|
|
534
|
+
var OverlayImageContainer = styled__default.default.div(templateObject_3$y || (templateObject_3$y = __makeTemplateObject(["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n overflow: hidden;\n\n & > img,\n & > svg {\n margin: 0 auto;\n width: max-content;\n max-width: 100%;\n max-height: 100%;\n aspect-ratio: initial;\n object-fit: contain;\n display: block;\n }\n"], ["\n position: relative;\n display: flex;\n flex-grow: 1;\n padding-bottom: 25px;\n overflow: hidden;\n\n & > img,\n & > svg {\n margin: 0 auto;\n width: max-content;\n max-width: 100%;\n max-height: 100%;\n aspect-ratio: initial;\n object-fit: contain;\n display: block;\n }\n"])));
|
|
535
|
+
var OverlayImageRow = styled__default.default.div(templateObject_4$s || (templateObject_4$s = __makeTemplateObject(["\n display: flex;\n margin: auto;\n\n & > div {\n max-height: calc(100% - 320px);\n\n & > img {\n width: 100%;\n max-height: 100%;\n height: auto;\n object-fit: contain;\n }\n }\n"], ["\n display: flex;\n margin: auto;\n\n & > div {\n max-height: calc(100% - 320px);\n\n & > img {\n width: 100%;\n max-height: 100%;\n height: auto;\n object-fit: contain;\n }\n }\n"])));
|
|
536
|
+
var GrayOverlayContainer = styled__default.default(OverlayContainer)(templateObject_5$l || (templateObject_5$l = __makeTemplateObject(["\n background: #f7f6fb;\n"], ["\n background: #f7f6fb;\n"])));
|
|
537
|
+
var ButtonsColumn = styled__default.default.div(templateObject_6$d || (templateObject_6$d = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 15px 0;\n justify-content: center;\n margin-top: 24px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 15px 0;\n justify-content: center;\n margin-top: 24px;\n"])));
|
|
538
|
+
var WideButton = styled__default.default(LoaderButton)(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject(["\n width: 100%;\n border-radius: 30px;\n"], ["\n width: 100%;\n border-radius: 30px;\n"])));
|
|
539
|
+
var WideBorderButton = styled__default.default(WideButton)(templateObject_8$8 || (templateObject_8$8 = __makeTemplateObject(["\n color: ", ";\n background: ", ";\n border: 1px solid\n ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n background: ", ";\n border: 1px solid\n ", ";\n box-sizing: border-box;\n"])), function (props) {
|
|
540
540
|
var _a, _b;
|
|
541
541
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.textColor) !== null && _b !== void 0 ? _b : 'black';
|
|
542
542
|
}, function (props) {
|
|
@@ -546,34 +546,34 @@ var WideBorderButton = styled__default.default(WideButton)(templateObject_8$6 ||
|
|
|
546
546
|
var _a, _b;
|
|
547
547
|
return (_b = (_a = props.colors) === null || _a === void 0 ? void 0 : _a.borderColor) !== null && _b !== void 0 ? _b : 'var(--idm-color-secondary-500)';
|
|
548
548
|
});
|
|
549
|
-
var LoadingOverlayInner = styled__default.default(OverlayInner$2)(templateObject_9$
|
|
550
|
-
var LoadingOverlayHeader = styled__default.default.div(templateObject_10$
|
|
549
|
+
var LoadingOverlayInner = styled__default.default(OverlayInner$2)(templateObject_9$6 || (templateObject_9$6 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n display: flex;\n flex-direction: column;\n padding: 0;\n"], ["\n position: relative;\n height: 100%;\n display: flex;\n flex-direction: column;\n padding: 0;\n"])));
|
|
550
|
+
var LoadingOverlayHeader = styled__default.default.div(templateObject_10$5 || (templateObject_10$5 = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n ", "\n padding-bottom: 0;\n"])), function (props) {
|
|
551
551
|
var _a;
|
|
552
552
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
553
553
|
}, function (props) {
|
|
554
554
|
return props.theme.padding ? "box-sizing: border-box; padding: ".concat(props.theme.padding, ";") : "";
|
|
555
555
|
});
|
|
556
|
-
var LoadingOverlayGuidanceMessage = styled__default.default(GuidanceMessage)(templateObject_11$
|
|
557
|
-
var LoadingOverlayImageContainer = styled__default.default(OverlayImageContainer)(templateObject_12$
|
|
556
|
+
var LoadingOverlayGuidanceMessage = styled__default.default(GuidanceMessage)(templateObject_11$5 || (templateObject_11$5 = __makeTemplateObject(["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n"], ["\n padding: 16px 24px;\n margin-top: 16px;\n font-size: 18px;\n font-weight: bold;\n"])));
|
|
557
|
+
var LoadingOverlayImageContainer = styled__default.default(OverlayImageContainer)(templateObject_12$5 || (templateObject_12$5 = __makeTemplateObject(["\n padding: 0;\n max-height: 100%;\n pointer-events: none;\n"], ["\n padding: 0;\n max-height: 100%;\n pointer-events: none;\n"])));
|
|
558
558
|
var LoadingOverlayProgressBarBackground = styled__default.default.div.attrs({
|
|
559
559
|
className: 'loading-overlay-progress-bar-background'
|
|
560
|
-
})(templateObject_13$
|
|
560
|
+
})(templateObject_13$5 || (templateObject_13$5 = __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"])));
|
|
561
561
|
var LoadingOverlayProgressBar = styled__default.default.span.attrs({
|
|
562
562
|
className: 'loading-overlay-progress-bar'
|
|
563
|
-
})(templateObject_14$
|
|
563
|
+
})(templateObject_14$2 || (templateObject_14$2 = __makeTemplateObject(["\n display: block;\n width: ", "%;\n height: 100%;\n left: 0;\n top: 0;\n position: absolute;\n"], ["\n display: block;\n width: ", "%;\n height: 100%;\n left: 0;\n top: 0;\n position: absolute;\n"])), function (props) {
|
|
564
564
|
return props.$progress;
|
|
565
565
|
});
|
|
566
566
|
var LoadingOverlayProgressIndicator = styled__default.default.span.attrs({
|
|
567
567
|
className: 'loading-overlay-progress-indicator'
|
|
568
|
-
})(templateObject_15$
|
|
569
|
-
var LoadingOverlayButtonsRow = styled__default.default(ButtonsRow$2)(templateObject_16$
|
|
570
|
-
var LoadingOverlayLoadingListContainer = styled__default.default.div(templateObject_17$
|
|
571
|
-
var LoadingOverlayLoadingList = styled__default.default.ul(templateObject_18$
|
|
572
|
-
var LoadingOverlayLoadingListItem = styled__default.default.li(templateObject_19$
|
|
573
|
-
var LoadingOverlayProgressContainer = styled__default.default.div(templateObject_20$
|
|
574
|
-
var LoadingOverlayCustomLoadingGraphic = styled__default.default.img(templateObject_21$
|
|
575
|
-
var LoadingOverlayContinueButtonContainer = styled__default.default.div(templateObject_22$
|
|
576
|
-
var templateObject_1$
|
|
568
|
+
})(templateObject_15$2 || (templateObject_15$2 = __makeTemplateObject(["\n display: block;\n height: 100%;\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"], ["\n display: block;\n height: 100%;\n animation: ", " 3s ease-in-out;\n animation-fill-mode: both;\n"])), progressBarAnimation);
|
|
569
|
+
var LoadingOverlayButtonsRow = styled__default.default(ButtonsRow$2)(templateObject_16$2 || (templateObject_16$2 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n min-height: 100px;\n width: 100%;\n box-sizing: border-box;\n position: relative;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 15px 25px;\n min-height: 100px;\n width: 100%;\n box-sizing: border-box;\n position: relative;\n"])));
|
|
570
|
+
var LoadingOverlayLoadingListContainer = styled__default.default.div(templateObject_17$2 || (templateObject_17$2 = __makeTemplateObject(["\n display: flex;\n position: relative;\n z-index: 2;\n"], ["\n display: flex;\n position: relative;\n z-index: 2;\n"])));
|
|
571
|
+
var LoadingOverlayLoadingList = styled__default.default.ul(templateObject_18$2 || (templateObject_18$2 = __makeTemplateObject(["\n display: block;\n margin: auto;\n list-style: none;\n padding: 0;\n"], ["\n display: block;\n margin: auto;\n list-style: none;\n padding: 0;\n"])));
|
|
572
|
+
var LoadingOverlayLoadingListItem = styled__default.default.li(templateObject_19$2 || (templateObject_19$2 = __makeTemplateObject(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"], ["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n padding: 2px 1.25rem 2px 0;\n line-height: 1rem;\n"])));
|
|
573
|
+
var LoadingOverlayProgressContainer = styled__default.default.div(templateObject_20$2 || (templateObject_20$2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
574
|
+
var LoadingOverlayCustomLoadingGraphic = styled__default.default.img(templateObject_21$2 || (templateObject_21$2 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
575
|
+
var LoadingOverlayContinueButtonContainer = styled__default.default.div(templateObject_22$2 || (templateObject_22$2 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
576
|
+
var templateObject_1$R, templateObject_2$M, templateObject_3$y, templateObject_4$s, templateObject_5$l, templateObject_6$d, templateObject_7$9, templateObject_8$8, templateObject_9$6, templateObject_10$5, templateObject_11$5, templateObject_12$5, templateObject_13$5, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2, templateObject_18$2, templateObject_19$2, templateObject_20$2, templateObject_21$2, templateObject_22$2;
|
|
577
577
|
|
|
578
578
|
var GeolocationAccessDeniedOverlay = function GeolocationAccessDeniedOverlay(_a) {
|
|
579
579
|
var accessBlockedImageUrl = _a.accessBlockedImageUrl;
|
|
@@ -799,20 +799,20 @@ var NetworkErrorContent = function NetworkErrorContent(_a) {
|
|
|
799
799
|
onClick: onRetry
|
|
800
800
|
}, retryText))));
|
|
801
801
|
};
|
|
802
|
-
var ErrorContainer = styled__default.default.div(templateObject_1$
|
|
803
|
-
var ErrorIcon = styled__default.default.div(templateObject_2$
|
|
804
|
-
var Heading$b = styled__default.default.h3(templateObject_3$
|
|
805
|
-
var Message$1 = styled__default.default.p(templateObject_4$
|
|
806
|
-
var StatusBadge$1 = styled__default.default.div(templateObject_5$
|
|
807
|
-
var StatusLabel = styled__default.default.span(templateObject_6$
|
|
808
|
-
var StatusValue = styled__default.default.span(templateObject_7$
|
|
809
|
-
var DetailsSection = styled__default.default.div(templateObject_8$
|
|
810
|
-
var DetailsHeader = styled__default.default.div(templateObject_9$
|
|
811
|
-
var DetailsLabel = styled__default.default.span(templateObject_10$
|
|
812
|
-
var CopyButton = styled__default.default.button(templateObject_11$
|
|
813
|
-
var CodeBlock = styled__default.default.pre(templateObject_12$
|
|
814
|
-
var RetryContainer = styled__default.default.div(templateObject_13$
|
|
815
|
-
var templateObject_1$
|
|
802
|
+
var ErrorContainer = styled__default.default.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n max-width: 600px;\n width: 100%;\n padding: 24px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,\n Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n max-width: 600px;\n width: 100%;\n padding: 24px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,\n Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n"])));
|
|
803
|
+
var ErrorIcon = styled__default.default.div(templateObject_2$L || (templateObject_2$L = __makeTemplateObject(["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fee2e2;\n color: #dc2626;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 24px;\n font-weight: bold;\n margin-bottom: 16px;\n"], ["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fee2e2;\n color: #dc2626;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 24px;\n font-weight: bold;\n margin-bottom: 16px;\n"])));
|
|
804
|
+
var Heading$b = styled__default.default.h3(templateObject_3$x || (templateObject_3$x = __makeTemplateObject(["\n margin: 0 0 16px 0;\n font-size: 1.25rem;\n font-weight: 600;\n color: #1f2937;\n text-align: center;\n"], ["\n margin: 0 0 16px 0;\n font-size: 1.25rem;\n font-weight: 600;\n color: #1f2937;\n text-align: center;\n"])));
|
|
805
|
+
var Message$1 = styled__default.default.p(templateObject_4$r || (templateObject_4$r = __makeTemplateObject(["\n margin: 0 0 16px 0;\n color: #6b7280;\n text-align: center;\n line-height: 1.5;\n"], ["\n margin: 0 0 16px 0;\n color: #6b7280;\n text-align: center;\n line-height: 1.5;\n"])));
|
|
806
|
+
var StatusBadge$1 = styled__default.default.div(templateObject_5$k || (templateObject_5$k = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background-color: #fef2f2;\n border: 1px solid #fecaca;\n border-radius: 6px;\n padding: 6px 12px;\n margin-bottom: 20px;\n"], ["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background-color: #fef2f2;\n border: 1px solid #fecaca;\n border-radius: 6px;\n padding: 6px 12px;\n margin-bottom: 20px;\n"])));
|
|
807
|
+
var StatusLabel = styled__default.default.span(templateObject_6$c || (templateObject_6$c = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 500;\n color: #991b1b;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n"], ["\n font-size: 0.75rem;\n font-weight: 500;\n color: #991b1b;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n"])));
|
|
808
|
+
var StatusValue = styled__default.default.span(templateObject_7$8 || (templateObject_7$8 = __makeTemplateObject(["\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n font-size: 0.875rem;\n font-weight: 600;\n color: #dc2626;\n"], ["\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n font-size: 0.875rem;\n font-weight: 600;\n color: #dc2626;\n"])));
|
|
809
|
+
var DetailsSection = styled__default.default.div(templateObject_8$7 || (templateObject_8$7 = __makeTemplateObject(["\n width: 100%;\n margin-bottom: 16px;\n"], ["\n width: 100%;\n margin-bottom: 16px;\n"])));
|
|
810
|
+
var DetailsHeader = styled__default.default.div(templateObject_9$5 || (templateObject_9$5 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 8px;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 8px;\n"])));
|
|
811
|
+
var DetailsLabel = styled__default.default.span(templateObject_10$4 || (templateObject_10$4 = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 500;\n color: #6b7280;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n"], ["\n font-size: 0.75rem;\n font-weight: 500;\n color: #6b7280;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n"])));
|
|
812
|
+
var CopyButton = styled__default.default.button(templateObject_11$4 || (templateObject_11$4 = __makeTemplateObject(["\n background-color: #f3f4f6;\n border: 1px solid #d1d5db;\n border-radius: 4px;\n padding: 4px 10px;\n font-size: 0.75rem;\n font-weight: 500;\n color: #374151;\n cursor: pointer;\n transition: all 0.15s ease;\n\n &:hover {\n background-color: #e5e7eb;\n border-color: #9ca3af;\n }\n\n &:active {\n background-color: #d1d5db;\n }\n"], ["\n background-color: #f3f4f6;\n border: 1px solid #d1d5db;\n border-radius: 4px;\n padding: 4px 10px;\n font-size: 0.75rem;\n font-weight: 500;\n color: #374151;\n cursor: pointer;\n transition: all 0.15s ease;\n\n &:hover {\n background-color: #e5e7eb;\n border-color: #9ca3af;\n }\n\n &:active {\n background-color: #d1d5db;\n }\n"])));
|
|
813
|
+
var CodeBlock = styled__default.default.pre(templateObject_12$4 || (templateObject_12$4 = __makeTemplateObject(["\n background-color: #1f2937;\n border-radius: 8px;\n padding: 16px;\n margin: 0;\n overflow-x: auto;\n max-height: 300px;\n overflow-y: auto;\n text-align: left;\n\n code {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n font-size: 0.8125rem;\n line-height: 1.6;\n color: #e5e7eb;\n white-space: pre-wrap;\n word-break: break-word;\n display: block;\n text-align: left;\n }\n"], ["\n background-color: #1f2937;\n border-radius: 8px;\n padding: 16px;\n margin: 0;\n overflow-x: auto;\n max-height: 300px;\n overflow-y: auto;\n text-align: left;\n\n code {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n font-size: 0.8125rem;\n line-height: 1.6;\n color: #e5e7eb;\n white-space: pre-wrap;\n word-break: break-word;\n display: block;\n text-align: left;\n }\n"])));
|
|
814
|
+
var RetryContainer = styled__default.default.div(templateObject_13$4 || (templateObject_13$4 = __makeTemplateObject(["\n margin-top: 24px;\n"], ["\n margin-top: 24px;\n"])));
|
|
815
|
+
var templateObject_1$Q, templateObject_2$L, templateObject_3$x, templateObject_4$r, templateObject_5$k, templateObject_6$c, templateObject_7$8, templateObject_8$7, templateObject_9$5, templateObject_10$4, templateObject_11$4, templateObject_12$4, templateObject_13$4;
|
|
816
816
|
|
|
817
817
|
var SessionIdMissingOverlay = function SessionIdMissingOverlay() {
|
|
818
818
|
return /*#__PURE__*/React__namespace.default.createElement(OverlayContainer, null, /*#__PURE__*/React__namespace.default.createElement(OverlayInner$2, {
|
|
@@ -3278,6 +3278,11 @@ function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
|
|
|
3278
3278
|
};
|
|
3279
3279
|
});
|
|
3280
3280
|
}), function (obj) {
|
|
3281
|
+
// Skip boundary filtering for PDF417 - barcodes can be anywhere in frame,
|
|
3282
|
+
// especially during recapture when user zooms in on the barcode
|
|
3283
|
+
if (obj.label === 'PDF417') {
|
|
3284
|
+
return true;
|
|
3285
|
+
}
|
|
3281
3286
|
var _a = obj.box,
|
|
3282
3287
|
xMin = _a.xMin,
|
|
3283
3288
|
yMin = _a.yMin,
|
|
@@ -3439,8 +3444,8 @@ function getFrameDimensions(frame) {
|
|
|
3439
3444
|
return [frameWidth, frameHeight];
|
|
3440
3445
|
}
|
|
3441
3446
|
|
|
3442
|
-
var InvisibleCanvasContainer = styled__default.default.div(templateObject_1$
|
|
3443
|
-
var InvisibleCanvas = styled__default.default.canvas(templateObject_2$
|
|
3447
|
+
var InvisibleCanvasContainer = styled__default.default.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n pointer-events: none;\n user-select: none;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n pointer-events: none;\n user-select: none;\n"])));
|
|
3448
|
+
var InvisibleCanvas = styled__default.default.canvas(templateObject_2$K || (templateObject_2$K = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
3444
3449
|
function drawToCanvas(canvas, frame, width, height) {
|
|
3445
3450
|
if (!canvas) return;
|
|
3446
3451
|
var ctx = canvas.getContext('2d');
|
|
@@ -3460,7 +3465,7 @@ function clearCanvas(canvas) {
|
|
|
3460
3465
|
var _a;
|
|
3461
3466
|
(_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);
|
|
3462
3467
|
}
|
|
3463
|
-
var templateObject_1$
|
|
3468
|
+
var templateObject_1$P, templateObject_2$K;
|
|
3464
3469
|
|
|
3465
3470
|
function useFrameLoop(fn, options) {
|
|
3466
3471
|
if (options === void 0) {
|
|
@@ -4817,8 +4822,13 @@ var createCameraStore = function createCameraStore(config) {
|
|
|
4817
4822
|
if (!selectedVideoStreamId) return;
|
|
4818
4823
|
var srcObject = e.currentTarget.srcObject;
|
|
4819
4824
|
if (srcObject.id === selectedVideoStreamId) {
|
|
4825
|
+
var _a = e.currentTarget,
|
|
4826
|
+
videoWidth = _a.videoWidth,
|
|
4827
|
+
videoHeight = _a.videoHeight;
|
|
4820
4828
|
set({
|
|
4821
|
-
videoLoaded: true
|
|
4829
|
+
videoLoaded: true,
|
|
4830
|
+
videoWidth: videoWidth,
|
|
4831
|
+
videoHeight: videoHeight
|
|
4822
4832
|
});
|
|
4823
4833
|
} else {
|
|
4824
4834
|
set({
|
|
@@ -5131,26 +5141,25 @@ var createCameraStore = function createCameraStore(config) {
|
|
|
5131
5141
|
};
|
|
5132
5142
|
var CameraStoreContext = /*#__PURE__*/React.createContext(undefined);
|
|
5133
5143
|
function CameraStoreProvider(_a) {
|
|
5134
|
-
var _b;
|
|
5135
5144
|
var children = _a.children,
|
|
5136
|
-
|
|
5137
|
-
requestAccessAutomatically =
|
|
5138
|
-
|
|
5139
|
-
preferIphoneContinuityCamera =
|
|
5140
|
-
|
|
5141
|
-
preferFrontFacingCamera =
|
|
5142
|
-
|
|
5143
|
-
maxVideoWidth =
|
|
5145
|
+
_b = _a.requestAccessAutomatically,
|
|
5146
|
+
requestAccessAutomatically = _b === void 0 ? true : _b,
|
|
5147
|
+
_c = _a.preferIphoneContinuityCamera,
|
|
5148
|
+
preferIphoneContinuityCamera = _c === void 0 ? true : _c,
|
|
5149
|
+
_d = _a.preferFrontFacingCamera,
|
|
5150
|
+
preferFrontFacingCamera = _d === void 0 ? false : _d,
|
|
5151
|
+
_e = _a.maxVideoWidth,
|
|
5152
|
+
maxVideoWidth = _e === void 0 ? 1920 : _e,
|
|
5144
5153
|
maxFps = _a.maxFps,
|
|
5145
5154
|
onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
5146
5155
|
onCameraTamperingDetected = _a.onCameraTamperingDetected,
|
|
5147
5156
|
onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
|
|
5148
|
-
|
|
5149
|
-
requireMicrophoneAccess =
|
|
5150
|
-
|
|
5151
|
-
classNames =
|
|
5152
|
-
|
|
5153
|
-
verbiage =
|
|
5157
|
+
_f = _a.requireMicrophoneAccess,
|
|
5158
|
+
requireMicrophoneAccess = _f === void 0 ? false : _f,
|
|
5159
|
+
_g = _a.classNames,
|
|
5160
|
+
classNames = _g === void 0 ? {} : _g,
|
|
5161
|
+
_h = _a.verbiage,
|
|
5162
|
+
verbiage = _h === void 0 ? {} : _h;
|
|
5154
5163
|
var videoRef = React.useRef(null);
|
|
5155
5164
|
var store = React.useRef(undefined);
|
|
5156
5165
|
store.current || (store.current = createCameraStore({
|
|
@@ -5164,16 +5173,6 @@ function CameraStoreProvider(_a) {
|
|
|
5164
5173
|
onMicrophoneAccessDenied: onMicrophoneAccessDenied,
|
|
5165
5174
|
requireMicrophoneAccess: requireMicrophoneAccess
|
|
5166
5175
|
}));
|
|
5167
|
-
var _k = (_b = videoRef.current) !== null && _b !== void 0 ? _b : {},
|
|
5168
|
-
videoWidth = _k.videoWidth,
|
|
5169
|
-
videoHeight = _k.videoHeight;
|
|
5170
|
-
React.useEffect(function () {
|
|
5171
|
-
var _a;
|
|
5172
|
-
(_a = store.current) === null || _a === void 0 ? void 0 : _a.setState({
|
|
5173
|
-
videoWidth: videoWidth,
|
|
5174
|
-
videoHeight: videoHeight
|
|
5175
|
-
});
|
|
5176
|
-
}, [videoWidth, videoHeight]);
|
|
5177
5176
|
React.useEffect(function () {
|
|
5178
5177
|
var _a, _b, _c;
|
|
5179
5178
|
var state = (_a = store.current) === null || _a === void 0 ? void 0 : _a.getState();
|
|
@@ -5262,14 +5261,14 @@ function CameraTamperSeal(_a) {
|
|
|
5262
5261
|
className: classNames.message
|
|
5263
5262
|
}, messageText)));
|
|
5264
5263
|
}
|
|
5265
|
-
var StyledOverlayInner$4 = styled__default.default(OverlayInner$2)(templateObject_1$
|
|
5266
|
-
var StyledOverlayHeading = styled__default.default.h3(templateObject_2$
|
|
5264
|
+
var StyledOverlayInner$4 = styled__default.default(OverlayInner$2)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
5265
|
+
var StyledOverlayHeading = styled__default.default.h3(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
5267
5266
|
function useCameraStore(selector) {
|
|
5268
5267
|
var store = React.useContext(CameraStoreContext);
|
|
5269
5268
|
if (!store) throw new Error('useCameraStore cannot be used without Provider');
|
|
5270
5269
|
return zustand.useStore(store, selector);
|
|
5271
5270
|
}
|
|
5272
|
-
var templateObject_1$
|
|
5271
|
+
var templateObject_1$O, templateObject_2$J;
|
|
5273
5272
|
|
|
5274
5273
|
var DocumentDetectionModelContext = /*#__PURE__*/React.createContext({
|
|
5275
5274
|
startDocumentDetection: function startDocumentDetection() {
|
|
@@ -6108,9 +6107,9 @@ var onMobile = isMobile();
|
|
|
6108
6107
|
function analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocumentCanvas, bestBarcodeCanvas, currentBestBarcodeScore, documentDetectionThresholds, makeBarcodeReadabilityPrediction, barcodeReadabilityThreshold) {
|
|
6109
6108
|
return __awaiter(this, void 0, void 0, function () {
|
|
6110
6109
|
var pdf417PredictionTime, pdf417PredictionScore, pdf417PredictionThresholdMet, newBestBarcodeScore, newBestBarcodeDetails, documentCroppedPrediction, processedCroppedPrediction, pdf417Prediction;
|
|
6111
|
-
var _a;
|
|
6112
|
-
return __generator(this, function (
|
|
6113
|
-
switch (
|
|
6110
|
+
var _a, _b;
|
|
6111
|
+
return __generator(this, function (_c) {
|
|
6112
|
+
switch (_c.label) {
|
|
6114
6113
|
case 0:
|
|
6115
6114
|
pdf417PredictionTime = 0;
|
|
6116
6115
|
pdf417PredictionScore = 0;
|
|
@@ -6121,7 +6120,8 @@ function analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocu
|
|
|
6121
6120
|
pdf417PredictionScore: pdf417PredictionScore,
|
|
6122
6121
|
pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
|
|
6123
6122
|
newBestBarcodeScore: newBestBarcodeScore,
|
|
6124
|
-
newBestBarcodeDetails: newBestBarcodeDetails
|
|
6123
|
+
newBestBarcodeDetails: newBestBarcodeDetails,
|
|
6124
|
+
processedBarcodeBoundingBox: undefined
|
|
6125
6125
|
}];
|
|
6126
6126
|
}
|
|
6127
6127
|
/**
|
|
@@ -6131,7 +6131,7 @@ function analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocu
|
|
|
6131
6131
|
cropToDetectedObjectBox(lastPredictionCanvas, prediction.bestDocument.box, croppedDocumentCanvas);
|
|
6132
6132
|
return [4 /*yield*/, makeDocumentDetectorPrediction(croppedDocumentCanvas)];
|
|
6133
6133
|
case 1:
|
|
6134
|
-
documentCroppedPrediction =
|
|
6134
|
+
documentCroppedPrediction = _c.sent();
|
|
6135
6135
|
if (!documentCroppedPrediction) {
|
|
6136
6136
|
// error occurred during prediction (error logged by callee)
|
|
6137
6137
|
return [2 /*return*/, {
|
|
@@ -6139,7 +6139,8 @@ function analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocu
|
|
|
6139
6139
|
pdf417PredictionScore: pdf417PredictionScore,
|
|
6140
6140
|
pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
|
|
6141
6141
|
newBestBarcodeScore: newBestBarcodeScore,
|
|
6142
|
-
newBestBarcodeDetails: newBestBarcodeDetails
|
|
6142
|
+
newBestBarcodeDetails: newBestBarcodeDetails,
|
|
6143
|
+
processedBarcodeBoundingBox: undefined
|
|
6143
6144
|
}];
|
|
6144
6145
|
}
|
|
6145
6146
|
processedCroppedPrediction = processDocumentDetectorPrediction(documentCroppedPrediction, documentDetectionThresholds);
|
|
@@ -6169,7 +6170,9 @@ function analyzeBarcodeReadability(prediction, lastPredictionCanvas, croppedDocu
|
|
|
6169
6170
|
pdf417PredictionScore: pdf417PredictionScore,
|
|
6170
6171
|
pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
|
|
6171
6172
|
newBestBarcodeScore: newBestBarcodeScore,
|
|
6172
|
-
newBestBarcodeDetails: newBestBarcodeDetails
|
|
6173
|
+
newBestBarcodeDetails: newBestBarcodeDetails,
|
|
6174
|
+
// Return processed barcode bounding box for recapture tracking (valid even when not a new best)
|
|
6175
|
+
processedBarcodeBoundingBox: (_b = processedCroppedPrediction === null || processedCroppedPrediction === void 0 ? void 0 : processedCroppedPrediction.bestPDF417) === null || _b === void 0 ? void 0 : _b.box
|
|
6173
6176
|
}];
|
|
6174
6177
|
}
|
|
6175
6178
|
});
|
|
@@ -6260,6 +6263,18 @@ var IdCaptureModelsContext = /*#__PURE__*/React.createContext({
|
|
|
6260
6263
|
getBestBarcode: function getBestBarcode() {
|
|
6261
6264
|
return null;
|
|
6262
6265
|
},
|
|
6266
|
+
resetBestBarcode: function resetBestBarcode() {
|
|
6267
|
+
return null;
|
|
6268
|
+
},
|
|
6269
|
+
startBarcodeRecapturePhase: function startBarcodeRecapturePhase() {
|
|
6270
|
+
return null;
|
|
6271
|
+
},
|
|
6272
|
+
getInitialCaptureBestBarcode: function getInitialCaptureBestBarcode() {
|
|
6273
|
+
return null;
|
|
6274
|
+
},
|
|
6275
|
+
getRecaptureBestBarcode: function getRecaptureBestBarcode() {
|
|
6276
|
+
return null;
|
|
6277
|
+
},
|
|
6263
6278
|
requiredDocumentType: 'none',
|
|
6264
6279
|
setRequiredDocumentType: function setRequiredDocumentType() {
|
|
6265
6280
|
return null;
|
|
@@ -6319,6 +6334,14 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6319
6334
|
var bestBarcodeScore = React.useRef(0);
|
|
6320
6335
|
var stopDetection = React.useRef(0);
|
|
6321
6336
|
var analyzeBarcodeReadability = useBarcodeReadabilityAnalysis();
|
|
6337
|
+
// Barcode recapture tracking - separate canvases for initial and recapture sequences
|
|
6338
|
+
var initialCaptureBarcodeCanvas = React.useRef(null);
|
|
6339
|
+
var initialCaptureBarcodeDetails = React.useRef(null);
|
|
6340
|
+
var initialCaptureBarcodeScore = React.useRef(0);
|
|
6341
|
+
var recaptureBarcodeCanvas = React.useRef(null);
|
|
6342
|
+
var recaptureBarcodeDetails = React.useRef(null);
|
|
6343
|
+
var recaptureBarcodeScore = React.useRef(0);
|
|
6344
|
+
var isRecapturePhase = React.useRef(false);
|
|
6322
6345
|
var _h = React.useState('none'),
|
|
6323
6346
|
requiredDocumentType = _h[0],
|
|
6324
6347
|
setRequiredDocumentType = _h[1];
|
|
@@ -6343,10 +6366,10 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6343
6366
|
var _this = this;
|
|
6344
6367
|
onDocumentDetected(function (prediction) {
|
|
6345
6368
|
return __awaiter(_this, void 0, void 0, function () {
|
|
6346
|
-
var stopDetectionAtStart, focusPredictionTime, focusScore, focusThresholdMet, pdf417PredictionTime, pdf417PredictionScore, pdf417PredictionThresholdMet, isSinglePage, isRequiredDocumentType, focusPrediction, focusThresholdSet, focusThreshold, barcodeAnalysisResult;
|
|
6347
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
6348
|
-
return __generator(this, function (
|
|
6349
|
-
switch (
|
|
6369
|
+
var stopDetectionAtStart, focusPredictionTime, focusScore, focusThresholdMet, pdf417PredictionTime, pdf417PredictionScore, pdf417PredictionThresholdMet, isSinglePage, isRequiredDocumentType, isInRecapturePhase, shouldRunBarcodeAnalysisDuringRecapture, shouldRunBarcodeOnlyAnalysisDuringRecapture, focusPrediction, focusThresholdSet, focusThreshold, barcodeAnalysisResult, barcodeAnalysisResult, startTime, barcodeReadabilityResult;
|
|
6370
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
6371
|
+
return __generator(this, function (_m) {
|
|
6372
|
+
switch (_m.label) {
|
|
6350
6373
|
case 0:
|
|
6351
6374
|
if (!lastPredictionCanvas.current) return [2 /*return*/];
|
|
6352
6375
|
stopDetectionAtStart = stopDetection.current;
|
|
@@ -6360,21 +6383,28 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6360
6383
|
prediction.singlePageDetectionThresholdMet = false;
|
|
6361
6384
|
}
|
|
6362
6385
|
isRequiredDocumentType = requiredDocumentType === 'none' || prediction.detectedDocumentType === requiredDocumentType || ((_a = requiredDocumentType.includes) === null || _a === void 0 ? void 0 : _a.call(requiredDocumentType, prediction.detectedDocumentType)) || allowSinglePageIdCapture && isSinglePage && ((_b = requiredDocumentType.includes) === null || _b === void 0 ? void 0 : _b.call(requiredDocumentType, 'idCardFront'));
|
|
6363
|
-
|
|
6364
|
-
|
|
6386
|
+
isInRecapturePhase = isRecapturePhase.current;
|
|
6387
|
+
shouldRunBarcodeAnalysisDuringRecapture = isInRecapturePhase && isRequiredDocumentType && prediction.detectedDocumentType !== 'none' && prediction.detectionThresholdMet && prediction.bestDocument && prediction.bestPDF417;
|
|
6388
|
+
shouldRunBarcodeOnlyAnalysisDuringRecapture = isInRecapturePhase && !prediction.bestDocument && ((_c = prediction.bestPDF417) === null || _c === void 0 ? void 0 : _c.box);
|
|
6389
|
+
// Debug logging for recapture conditions
|
|
6390
|
+
if (isInRecapturePhase && ((_d = prediction.bestPDF417) === null || _d === void 0 ? void 0 : _d.box)) {
|
|
6391
|
+
log("[IdCaptureModelsProvider] Recapture debug: isRecapture=".concat(isInRecapturePhase, ", bestDocument=").concat(!!prediction.bestDocument, ", bestPDF417=").concat(!!((_e = prediction.bestPDF417) === null || _e === void 0 ? void 0 : _e.box), ", shouldRunBarcodeOnly=").concat(shouldRunBarcodeOnlyAnalysisDuringRecapture, ", shouldRunRelaxed=").concat(shouldRunBarcodeAnalysisDuringRecapture));
|
|
6392
|
+
}
|
|
6393
|
+
if (!(isRequiredDocumentType && prediction.detectedDocumentType !== 'none' && prediction.detectionThresholdMet && prediction.documentInBounds && !prediction.documentTooClose && prediction.documentIsStable)) return [3 /*break*/, 3];
|
|
6394
|
+
focusPrediction = makeFocusPrediction(lastPredictionCanvas.current, (_f = prediction.bestDocument) === null || _f === void 0 ? void 0 : _f.box);
|
|
6365
6395
|
if (focusPrediction) {
|
|
6366
6396
|
focusScore = focusPrediction.score;
|
|
6367
6397
|
focusPredictionTime = focusPrediction.predictionTime;
|
|
6368
6398
|
}
|
|
6369
|
-
focusThresholdSet = (
|
|
6370
|
-
focusThreshold = (
|
|
6399
|
+
focusThresholdSet = (_g = thresholds.focus) === null || _g === void 0 ? void 0 : _g[prediction.detectedDocumentType];
|
|
6400
|
+
focusThreshold = (_h = onMobile ? focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.mobile : focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.desktop) !== null && _h !== void 0 ? _h : 0;
|
|
6371
6401
|
focusThresholdMet = focusScore >= focusThreshold;
|
|
6372
6402
|
if (!(stopDetectionAtStart === stopDetection.current)) return [3 /*break*/, 2];
|
|
6373
6403
|
if (bestFocusScore.current <= focusScore) {
|
|
6374
6404
|
bestFocusScore.current = focusScore;
|
|
6375
6405
|
drawToCanvas(bestPredictionCanvas.current, lastPredictionCanvas.current);
|
|
6376
6406
|
bestFrameDetails.current = {
|
|
6377
|
-
boundingBox: (
|
|
6407
|
+
boundingBox: (_j = prediction.bestDocument) === null || _j === void 0 ? void 0 : _j.box,
|
|
6378
6408
|
documentType: prediction.detectedDocumentType,
|
|
6379
6409
|
detectionScore: prediction.detectionScore,
|
|
6380
6410
|
focusScore: focusScore
|
|
@@ -6383,7 +6413,7 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6383
6413
|
if (!(enableBarcodeReadabilityModel && prediction.bestDocument && prediction.bestPDF417 && croppedDocumentCanvas.current)) return [3 /*break*/, 2];
|
|
6384
6414
|
return [4 /*yield*/, analyzeBarcodeReadability(prediction, lastPredictionCanvas.current, croppedDocumentCanvas.current, bestBarcodeCanvas.current, bestBarcodeScore.current)];
|
|
6385
6415
|
case 1:
|
|
6386
|
-
barcodeAnalysisResult =
|
|
6416
|
+
barcodeAnalysisResult = _m.sent();
|
|
6387
6417
|
pdf417PredictionTime = barcodeAnalysisResult.pdf417PredictionTime;
|
|
6388
6418
|
pdf417PredictionScore = barcodeAnalysisResult.pdf417PredictionScore;
|
|
6389
6419
|
pdf417PredictionThresholdMet = barcodeAnalysisResult.pdf417PredictionThresholdMet;
|
|
@@ -6393,15 +6423,98 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6393
6423
|
if (barcodeAnalysisResult.newBestBarcodeDetails) {
|
|
6394
6424
|
bestBarcodeDetails.current = barcodeAnalysisResult.newBestBarcodeDetails;
|
|
6395
6425
|
}
|
|
6396
|
-
|
|
6426
|
+
// During recapture phase, also track best barcode separately for recapture sequence
|
|
6427
|
+
if (isRecapturePhase.current && recaptureBarcodeCanvas.current && pdf417PredictionScore > recaptureBarcodeScore.current) {
|
|
6428
|
+
log("[IdCaptureModelsProvider] Recapture tracking: new best score ".concat(pdf417PredictionScore, " (was ").concat(recaptureBarcodeScore.current, ")"));
|
|
6429
|
+
recaptureBarcodeScore.current = pdf417PredictionScore;
|
|
6430
|
+
// Create details directly from current prediction (not newBestBarcodeDetails which
|
|
6431
|
+
// is only set when score beats overall best, not just recapture best)
|
|
6432
|
+
recaptureBarcodeDetails.current = {
|
|
6433
|
+
boundingBox: prediction.bestPDF417.box,
|
|
6434
|
+
score: pdf417PredictionScore
|
|
6435
|
+
};
|
|
6436
|
+
// Crop barcode from croppedDocumentCanvas using the processed bounding box
|
|
6437
|
+
// (can't use bestBarcodeCanvas since it's only updated for overall best)
|
|
6438
|
+
if (croppedDocumentCanvas.current && barcodeAnalysisResult.processedBarcodeBoundingBox) {
|
|
6439
|
+
cropToDetectedObjectBox(croppedDocumentCanvas.current, barcodeAnalysisResult.processedBarcodeBoundingBox, recaptureBarcodeCanvas.current, 16);
|
|
6440
|
+
} else {
|
|
6441
|
+
log("[IdCaptureModelsProvider] Recapture tracking: could not crop barcode - croppedDocumentCanvas=".concat(!!croppedDocumentCanvas.current, ", processedBarcodeBoundingBox=").concat(!!barcodeAnalysisResult.processedBarcodeBoundingBox));
|
|
6442
|
+
}
|
|
6443
|
+
}
|
|
6444
|
+
_m.label = 2;
|
|
6397
6445
|
case 2:
|
|
6446
|
+
return [3 /*break*/, 7];
|
|
6447
|
+
case 3:
|
|
6448
|
+
if (!shouldRunBarcodeAnalysisDuringRecapture) return [3 /*break*/, 6];
|
|
6449
|
+
if (!(enableBarcodeReadabilityModel && croppedDocumentCanvas.current && stopDetectionAtStart === stopDetection.current)) return [3 /*break*/, 5];
|
|
6450
|
+
return [4 /*yield*/, analyzeBarcodeReadability(prediction, lastPredictionCanvas.current, croppedDocumentCanvas.current, bestBarcodeCanvas.current, bestBarcodeScore.current)];
|
|
6451
|
+
case 4:
|
|
6452
|
+
barcodeAnalysisResult = _m.sent();
|
|
6453
|
+
pdf417PredictionTime = barcodeAnalysisResult.pdf417PredictionTime;
|
|
6454
|
+
pdf417PredictionScore = barcodeAnalysisResult.pdf417PredictionScore;
|
|
6455
|
+
pdf417PredictionThresholdMet = barcodeAnalysisResult.pdf417PredictionThresholdMet;
|
|
6456
|
+
if (barcodeAnalysisResult.newBestBarcodeScore) {
|
|
6457
|
+
bestBarcodeScore.current = barcodeAnalysisResult.newBestBarcodeScore;
|
|
6458
|
+
}
|
|
6459
|
+
if (barcodeAnalysisResult.newBestBarcodeDetails) {
|
|
6460
|
+
bestBarcodeDetails.current = barcodeAnalysisResult.newBestBarcodeDetails;
|
|
6461
|
+
}
|
|
6462
|
+
// Track best barcode separately for recapture sequence
|
|
6463
|
+
if (recaptureBarcodeCanvas.current && pdf417PredictionScore > recaptureBarcodeScore.current) {
|
|
6464
|
+
log("[IdCaptureModelsProvider] Recapture tracking (relaxed): new best score ".concat(pdf417PredictionScore, " (was ").concat(recaptureBarcodeScore.current, ")"));
|
|
6465
|
+
recaptureBarcodeScore.current = pdf417PredictionScore;
|
|
6466
|
+
// Create details directly from current prediction (not newBestBarcodeDetails which
|
|
6467
|
+
// is only set when score beats overall best, not just recapture best)
|
|
6468
|
+
recaptureBarcodeDetails.current = {
|
|
6469
|
+
boundingBox: prediction.bestPDF417.box,
|
|
6470
|
+
score: pdf417PredictionScore
|
|
6471
|
+
};
|
|
6472
|
+
// Crop barcode from croppedDocumentCanvas using the processed bounding box
|
|
6473
|
+
// (can't use bestBarcodeCanvas since it's only updated for overall best)
|
|
6474
|
+
if (croppedDocumentCanvas.current && barcodeAnalysisResult.processedBarcodeBoundingBox) {
|
|
6475
|
+
cropToDetectedObjectBox(croppedDocumentCanvas.current, barcodeAnalysisResult.processedBarcodeBoundingBox, recaptureBarcodeCanvas.current, 16);
|
|
6476
|
+
} else {
|
|
6477
|
+
log("[IdCaptureModelsProvider] Recapture tracking (relaxed): could not crop barcode - croppedDocumentCanvas=".concat(!!croppedDocumentCanvas.current, ", processedBarcodeBoundingBox=").concat(!!barcodeAnalysisResult.processedBarcodeBoundingBox));
|
|
6478
|
+
}
|
|
6479
|
+
}
|
|
6480
|
+
_m.label = 5;
|
|
6481
|
+
case 5:
|
|
6482
|
+
return [3 /*break*/, 7];
|
|
6483
|
+
case 6:
|
|
6484
|
+
if (shouldRunBarcodeOnlyAnalysisDuringRecapture) {
|
|
6485
|
+
// During recapture when only PDF417 is detected (no document),
|
|
6486
|
+
// run barcode readability directly on the PDF417 box from the full frame
|
|
6487
|
+
log("[IdCaptureModelsProvider] Barcode-only recapture path: enableBarcodeReadabilityModel=".concat(enableBarcodeReadabilityModel, ", hasCanvas=").concat(!!lastPredictionCanvas.current, ", stopMatch=").concat(stopDetectionAtStart === stopDetection.current));
|
|
6488
|
+
if (enableBarcodeReadabilityModel && lastPredictionCanvas.current && stopDetectionAtStart === stopDetection.current) {
|
|
6489
|
+
startTime = performance.now();
|
|
6490
|
+
barcodeReadabilityResult = makeBarcodeReadabilityPrediction(lastPredictionCanvas.current, prediction.bestPDF417.box);
|
|
6491
|
+
log("[IdCaptureModelsProvider] Barcode-only readability result: ".concat((_k = barcodeReadabilityResult === null || barcodeReadabilityResult === void 0 ? void 0 : barcodeReadabilityResult.score) !== null && _k !== void 0 ? _k : 'null'));
|
|
6492
|
+
if (barcodeReadabilityResult) {
|
|
6493
|
+
pdf417PredictionTime = performance.now() - startTime;
|
|
6494
|
+
pdf417PredictionScore = barcodeReadabilityResult.score;
|
|
6495
|
+
// Track best barcode for recapture sequence
|
|
6496
|
+
if (recaptureBarcodeCanvas.current && pdf417PredictionScore > recaptureBarcodeScore.current) {
|
|
6497
|
+
log("[IdCaptureModelsProvider] Recapture tracking (barcode-only): new best score ".concat(pdf417PredictionScore, " (was ").concat(recaptureBarcodeScore.current, ")"));
|
|
6498
|
+
recaptureBarcodeScore.current = pdf417PredictionScore;
|
|
6499
|
+
recaptureBarcodeDetails.current = {
|
|
6500
|
+
boundingBox: prediction.bestPDF417.box,
|
|
6501
|
+
score: pdf417PredictionScore
|
|
6502
|
+
};
|
|
6503
|
+
// Crop barcode directly from full frame
|
|
6504
|
+
cropToDetectedObjectBox(lastPredictionCanvas.current, prediction.bestPDF417.box, recaptureBarcodeCanvas.current, 16);
|
|
6505
|
+
}
|
|
6506
|
+
}
|
|
6507
|
+
}
|
|
6508
|
+
}
|
|
6509
|
+
_m.label = 7;
|
|
6510
|
+
case 7:
|
|
6398
6511
|
/**
|
|
6399
6512
|
* @note
|
|
6400
6513
|
* This should ALWAYS be called.
|
|
6401
6514
|
* Do not return early from this function unless
|
|
6402
6515
|
* lastPredictionCanvas.current is not set
|
|
6403
6516
|
*/
|
|
6404
|
-
(
|
|
6517
|
+
(_l = onPredictionHandler.current) === null || _l === void 0 ? void 0 : _l.call(onPredictionHandler, _assign(_assign({}, prediction), {
|
|
6405
6518
|
focusScore: focusScore,
|
|
6406
6519
|
focusPredictionTime: focusPredictionTime,
|
|
6407
6520
|
focusThresholdMet: focusThresholdMet,
|
|
@@ -6434,19 +6547,80 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6434
6547
|
canvas: bestBarcodeCanvas.current
|
|
6435
6548
|
});
|
|
6436
6549
|
}, []);
|
|
6550
|
+
var resetBestBarcode = React.useCallback(function () {
|
|
6551
|
+
// Light-weight reset that only clears barcode tracking without disrupting detection
|
|
6552
|
+
bestBarcodeScore.current = 0;
|
|
6553
|
+
bestBarcodeDetails.current = null;
|
|
6554
|
+
// Also reset recapture tracking so early frames during move-closer window are ignored
|
|
6555
|
+
recaptureBarcodeScore.current = 0;
|
|
6556
|
+
recaptureBarcodeDetails.current = null;
|
|
6557
|
+
// Clear the canvas content but don't recreate it
|
|
6558
|
+
if (bestBarcodeCanvas.current) {
|
|
6559
|
+
var ctx = bestBarcodeCanvas.current.getContext('2d');
|
|
6560
|
+
if (ctx) {
|
|
6561
|
+
ctx.clearRect(0, 0, bestBarcodeCanvas.current.width, bestBarcodeCanvas.current.height);
|
|
6562
|
+
}
|
|
6563
|
+
}
|
|
6564
|
+
if (recaptureBarcodeCanvas.current) {
|
|
6565
|
+
var ctx = recaptureBarcodeCanvas.current.getContext('2d');
|
|
6566
|
+
if (ctx) {
|
|
6567
|
+
ctx.clearRect(0, 0, recaptureBarcodeCanvas.current.width, recaptureBarcodeCanvas.current.height);
|
|
6568
|
+
}
|
|
6569
|
+
}
|
|
6570
|
+
}, []);
|
|
6571
|
+
var startBarcodeRecapturePhase = React.useCallback(function () {
|
|
6572
|
+
log("[IdCaptureModelsProvider] Starting barcode recapture phase. Initial best score: ".concat(bestBarcodeScore.current));
|
|
6573
|
+
// Snapshot current best barcode to initial capture canvas
|
|
6574
|
+
if (bestBarcodeCanvas.current && initialCaptureBarcodeCanvas.current) {
|
|
6575
|
+
var ctx = initialCaptureBarcodeCanvas.current.getContext('2d');
|
|
6576
|
+
if (ctx) {
|
|
6577
|
+
initialCaptureBarcodeCanvas.current.width = bestBarcodeCanvas.current.width;
|
|
6578
|
+
initialCaptureBarcodeCanvas.current.height = bestBarcodeCanvas.current.height;
|
|
6579
|
+
ctx.drawImage(bestBarcodeCanvas.current, 0, 0);
|
|
6580
|
+
}
|
|
6581
|
+
}
|
|
6582
|
+
initialCaptureBarcodeDetails.current = bestBarcodeDetails.current ? _assign({}, bestBarcodeDetails.current) : null;
|
|
6583
|
+
initialCaptureBarcodeScore.current = bestBarcodeScore.current;
|
|
6584
|
+
// Reset recapture tracking
|
|
6585
|
+
recaptureBarcodeScore.current = 0;
|
|
6586
|
+
recaptureBarcodeDetails.current = null;
|
|
6587
|
+
// Enter recapture phase
|
|
6588
|
+
isRecapturePhase.current = true;
|
|
6589
|
+
}, []);
|
|
6590
|
+
var getInitialCaptureBestBarcode = React.useCallback(function () {
|
|
6591
|
+
if (!initialCaptureBarcodeDetails.current || !initialCaptureBarcodeCanvas.current) return null;
|
|
6592
|
+
return _assign(_assign({}, initialCaptureBarcodeDetails.current), {
|
|
6593
|
+
canvas: initialCaptureBarcodeCanvas.current
|
|
6594
|
+
});
|
|
6595
|
+
}, []);
|
|
6596
|
+
var getRecaptureBestBarcode = React.useCallback(function () {
|
|
6597
|
+
if (!recaptureBarcodeDetails.current || !recaptureBarcodeCanvas.current) return null;
|
|
6598
|
+
return _assign(_assign({}, recaptureBarcodeDetails.current), {
|
|
6599
|
+
canvas: recaptureBarcodeCanvas.current
|
|
6600
|
+
});
|
|
6601
|
+
}, []);
|
|
6437
6602
|
var _j = React.useState(0),
|
|
6438
6603
|
canvasKey = _j[0],
|
|
6439
6604
|
setCanvasKey = _j[1];
|
|
6440
6605
|
var resetBestFrame = React.useCallback(function () {
|
|
6606
|
+
// During recapture phase, preserve all canvas state to avoid race conditions
|
|
6607
|
+
// that could result in black/empty barcode images on slow devices
|
|
6608
|
+
if (isRecapturePhase.current) {
|
|
6609
|
+
return;
|
|
6610
|
+
}
|
|
6441
6611
|
stopDetection.current += 1;
|
|
6442
|
-
setCanvasKey(function (n) {
|
|
6443
|
-
return n + 1;
|
|
6444
|
-
});
|
|
6445
6612
|
clearDocumentDetectionLastPredictionCanvas();
|
|
6446
6613
|
bestFrameDetails.current = null;
|
|
6447
6614
|
bestFocusScore.current = 0;
|
|
6448
6615
|
bestBarcodeScore.current = 0;
|
|
6449
6616
|
bestBarcodeDetails.current = null;
|
|
6617
|
+
setCanvasKey(function (n) {
|
|
6618
|
+
return n + 1;
|
|
6619
|
+
});
|
|
6620
|
+
initialCaptureBarcodeScore.current = 0;
|
|
6621
|
+
initialCaptureBarcodeDetails.current = null;
|
|
6622
|
+
recaptureBarcodeScore.current = 0;
|
|
6623
|
+
recaptureBarcodeDetails.current = null;
|
|
6450
6624
|
}, [clearDocumentDetectionLastPredictionCanvas]);
|
|
6451
6625
|
React.useEffect(function () {
|
|
6452
6626
|
if (requiredDocumentType) resetBestFrame();
|
|
@@ -6512,10 +6686,14 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6512
6686
|
bestFrameDetails: bestFrameDetails,
|
|
6513
6687
|
bestBarcodeDetails: bestBarcodeDetails,
|
|
6514
6688
|
getBestBarcode: getBestBarcode,
|
|
6689
|
+
resetBestBarcode: resetBestBarcode,
|
|
6690
|
+
startBarcodeRecapturePhase: startBarcodeRecapturePhase,
|
|
6691
|
+
getInitialCaptureBestBarcode: getInitialCaptureBestBarcode,
|
|
6692
|
+
getRecaptureBestBarcode: getRecaptureBestBarcode,
|
|
6515
6693
|
requiredDocumentType: requiredDocumentType,
|
|
6516
6694
|
setRequiredDocumentType: setRequiredDocumentType
|
|
6517
6695
|
};
|
|
6518
|
-
}, [ready, modelDownloadProgress, modelLoadState, modelWarmingStartedAt, modelError, startDocumentDetection, stopDocumentDetection, load, thresholds, setThresholds, documentDetectionBoundaries, setDocumentDetectionBoundaries, onPredictionMade, detectionTime, focusPredictionTime, barcodeReadabilityPredictionTime, getBestFrame, resetBestFrame, getBestBarcode, requiredDocumentType]);
|
|
6696
|
+
}, [ready, modelDownloadProgress, modelLoadState, modelWarmingStartedAt, modelError, startDocumentDetection, stopDocumentDetection, load, thresholds, setThresholds, documentDetectionBoundaries, setDocumentDetectionBoundaries, onPredictionMade, detectionTime, focusPredictionTime, barcodeReadabilityPredictionTime, getBestFrame, resetBestFrame, getBestBarcode, resetBestBarcode, startBarcodeRecapturePhase, getInitialCaptureBestBarcode, getRecaptureBestBarcode, requiredDocumentType]);
|
|
6519
6697
|
return /*#__PURE__*/React__namespace.default.createElement(IdCaptureModelsContext.Provider, {
|
|
6520
6698
|
value: value
|
|
6521
6699
|
}, /*#__PURE__*/React__namespace.default.createElement(InvisibleCanvasContainer, null, /*#__PURE__*/React__namespace.default.createElement(InvisibleCanvas, {
|
|
@@ -6527,6 +6705,12 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
6527
6705
|
}), /*#__PURE__*/React__namespace.default.createElement(InvisibleCanvas, {
|
|
6528
6706
|
key: "cd-".concat(canvasKey),
|
|
6529
6707
|
ref: croppedDocumentCanvas
|
|
6708
|
+
}), /*#__PURE__*/React__namespace.default.createElement(InvisibleCanvas, {
|
|
6709
|
+
key: "icb-".concat(canvasKey),
|
|
6710
|
+
ref: initialCaptureBarcodeCanvas
|
|
6711
|
+
}), /*#__PURE__*/React__namespace.default.createElement(InvisibleCanvas, {
|
|
6712
|
+
key: "rcb-".concat(canvasKey),
|
|
6713
|
+
ref: recaptureBarcodeCanvas
|
|
6530
6714
|
})), children);
|
|
6531
6715
|
}
|
|
6532
6716
|
function IdCaptureModelsProvider(_a) {
|
|
@@ -6621,6 +6805,8 @@ var initialState$5 = {
|
|
|
6621
6805
|
singlePageDetectionThresholdMet: false,
|
|
6622
6806
|
focusScore: 0,
|
|
6623
6807
|
focusThresholdMet: false,
|
|
6808
|
+
pdf417PredictionScore: 0,
|
|
6809
|
+
pdf417PredictionThresholdMet: false,
|
|
6624
6810
|
isGoodFrame: false,
|
|
6625
6811
|
goodFramesCount: 0,
|
|
6626
6812
|
goodFramesThreshold: 3,
|
|
@@ -6642,30 +6828,47 @@ var initialState$5 = {
|
|
|
6642
6828
|
uploadingDocumentsType: null,
|
|
6643
6829
|
operationStartedAt: null,
|
|
6644
6830
|
captureStartedAt: null,
|
|
6831
|
+
barcodeRecaptureStartedAt: null,
|
|
6832
|
+
initialBarcodeScore: 0,
|
|
6833
|
+
recaptureBarcodeScore: null,
|
|
6834
|
+
barcodeRecaptureThreshold: 0,
|
|
6835
|
+
barcodeRecaptureTimeoutMs: 5000,
|
|
6836
|
+
initialCaptureBarcodeImage: null,
|
|
6837
|
+
recaptureBarcodeImage: null,
|
|
6838
|
+
clientBarcodeScanEnabled: false,
|
|
6839
|
+
clientBarcodeScanActive: false,
|
|
6840
|
+
clientBarcodeDecodeResult: null,
|
|
6841
|
+
nativeBarcodeDecodeResult: null,
|
|
6842
|
+
nativeBarcodeDecoding: false,
|
|
6645
6843
|
dispatch: function dispatch() {
|
|
6646
6844
|
return null;
|
|
6647
6845
|
}
|
|
6648
6846
|
};
|
|
6649
6847
|
var _reducer = function reducer(state, action) {
|
|
6650
6848
|
var _a;
|
|
6849
|
+
var _b, _c;
|
|
6651
6850
|
switch (action.type) {
|
|
6652
6851
|
case 'configureWizard':
|
|
6653
6852
|
{
|
|
6654
|
-
var
|
|
6655
|
-
captureRequirement =
|
|
6656
|
-
precapturedDocuments =
|
|
6657
|
-
allowSinglePageIdCapture =
|
|
6658
|
-
allowIdCardBackToFrontCapture =
|
|
6659
|
-
enableOverrideWrongDocumentTypeDialog =
|
|
6660
|
-
allowOverrideWrongDocumentTypeAfterMs =
|
|
6661
|
-
allowUploadingDocumentsFromStorage =
|
|
6853
|
+
var _d = action.payload,
|
|
6854
|
+
captureRequirement = _d.captureRequirement,
|
|
6855
|
+
precapturedDocuments = _d.precapturedDocuments,
|
|
6856
|
+
allowSinglePageIdCapture = _d.allowSinglePageIdCapture,
|
|
6857
|
+
allowIdCardBackToFrontCapture = _d.allowIdCardBackToFrontCapture,
|
|
6858
|
+
enableOverrideWrongDocumentTypeDialog = _d.enableOverrideWrongDocumentTypeDialog,
|
|
6859
|
+
allowOverrideWrongDocumentTypeAfterMs = _d.allowOverrideWrongDocumentTypeAfterMs,
|
|
6860
|
+
allowUploadingDocumentsFromStorage = _d.allowUploadingDocumentsFromStorage,
|
|
6861
|
+
barcodeRecaptureThreshold = _d.barcodeRecaptureThreshold,
|
|
6862
|
+
barcodeRecaptureTimeoutMs = _d.barcodeRecaptureTimeoutMs;
|
|
6662
6863
|
var newState = _assign(_assign({}, state), {
|
|
6663
6864
|
captureRequirement: captureRequirement,
|
|
6664
6865
|
allowSinglePageIdCapture: allowSinglePageIdCapture !== null && allowSinglePageIdCapture !== void 0 ? allowSinglePageIdCapture : false,
|
|
6665
6866
|
allowIdCardBackToFrontCapture: allowIdCardBackToFrontCapture !== null && allowIdCardBackToFrontCapture !== void 0 ? allowIdCardBackToFrontCapture : false,
|
|
6666
6867
|
enableOverrideWrongDocumentTypeDialog: enableOverrideWrongDocumentTypeDialog,
|
|
6667
6868
|
allowOverrideWrongDocumentTypeAfterMs: allowOverrideWrongDocumentTypeAfterMs,
|
|
6668
|
-
allowUploadingDocumentsFromStorage: allowUploadingDocumentsFromStorage
|
|
6869
|
+
allowUploadingDocumentsFromStorage: allowUploadingDocumentsFromStorage,
|
|
6870
|
+
barcodeRecaptureThreshold: barcodeRecaptureThreshold !== null && barcodeRecaptureThreshold !== void 0 ? barcodeRecaptureThreshold : 0,
|
|
6871
|
+
barcodeRecaptureTimeoutMs: barcodeRecaptureTimeoutMs !== null && barcodeRecaptureTimeoutMs !== void 0 ? barcodeRecaptureTimeoutMs : 5000
|
|
6669
6872
|
});
|
|
6670
6873
|
if (captureRequirement === 'idCardBack') newState.requestedDocumentType = 'idCardBack';
|
|
6671
6874
|
if (captureRequirement === 'passport') newState.requestedDocumentType = 'passport';
|
|
@@ -6722,26 +6925,28 @@ var _reducer = function reducer(state, action) {
|
|
|
6722
6925
|
});
|
|
6723
6926
|
case 'objectsDetected':
|
|
6724
6927
|
{
|
|
6725
|
-
var
|
|
6726
|
-
detectedObjects =
|
|
6727
|
-
detectionThresholdMet =
|
|
6728
|
-
detectedDocumentType =
|
|
6729
|
-
idCardFrontDetectionScore =
|
|
6730
|
-
idCardFrontDetectionThresholdMet =
|
|
6731
|
-
idCardBackDetectionScore =
|
|
6732
|
-
idCardBackDetectionThresholdMet =
|
|
6733
|
-
passportDetectionScore =
|
|
6734
|
-
passportDetectionThresholdMet =
|
|
6735
|
-
singlePageDetectionScore =
|
|
6736
|
-
singlePageDetectionThresholdMet =
|
|
6737
|
-
bestDocument =
|
|
6738
|
-
documentInBounds =
|
|
6739
|
-
documentTooClose =
|
|
6740
|
-
documentIsStable =
|
|
6741
|
-
focusScore =
|
|
6742
|
-
focusThresholdMet =
|
|
6743
|
-
|
|
6744
|
-
|
|
6928
|
+
var _e = action.payload.prediction,
|
|
6929
|
+
detectedObjects = _e.detectedObjects,
|
|
6930
|
+
detectionThresholdMet = _e.detectionThresholdMet,
|
|
6931
|
+
detectedDocumentType = _e.detectedDocumentType,
|
|
6932
|
+
idCardFrontDetectionScore = _e.idCardFrontDetectionScore,
|
|
6933
|
+
idCardFrontDetectionThresholdMet = _e.idCardFrontDetectionThresholdMet,
|
|
6934
|
+
idCardBackDetectionScore = _e.idCardBackDetectionScore,
|
|
6935
|
+
idCardBackDetectionThresholdMet = _e.idCardBackDetectionThresholdMet,
|
|
6936
|
+
passportDetectionScore = _e.passportDetectionScore,
|
|
6937
|
+
passportDetectionThresholdMet = _e.passportDetectionThresholdMet,
|
|
6938
|
+
singlePageDetectionScore = _e.singlePageDetectionScore,
|
|
6939
|
+
singlePageDetectionThresholdMet = _e.singlePageDetectionThresholdMet,
|
|
6940
|
+
bestDocument = _e.bestDocument,
|
|
6941
|
+
documentInBounds = _e.documentInBounds,
|
|
6942
|
+
documentTooClose = _e.documentTooClose,
|
|
6943
|
+
documentIsStable = _e.documentIsStable,
|
|
6944
|
+
focusScore = _e.focusScore,
|
|
6945
|
+
focusThresholdMet = _e.focusThresholdMet,
|
|
6946
|
+
pdf417PredictionScore = _e.pdf417PredictionScore,
|
|
6947
|
+
pdf417PredictionThresholdMet = _e.pdf417PredictionThresholdMet,
|
|
6948
|
+
frameWidth = _e.frameWidth,
|
|
6949
|
+
frameHeight = _e.frameHeight;
|
|
6745
6950
|
var frameCapturedAt = new Date();
|
|
6746
6951
|
var frameCaptureRate = 0;
|
|
6747
6952
|
var goodFramesThreshold = state.goodFramesThreshold;
|
|
@@ -6821,6 +7026,8 @@ var _reducer = function reducer(state, action) {
|
|
|
6821
7026
|
singlePageDetectionThresholdMet: singlePageDetectionThresholdMet,
|
|
6822
7027
|
focusScore: focusScore,
|
|
6823
7028
|
focusThresholdMet: focusThresholdMet,
|
|
7029
|
+
pdf417PredictionScore: pdf417PredictionScore,
|
|
7030
|
+
pdf417PredictionThresholdMet: pdf417PredictionThresholdMet,
|
|
6824
7031
|
isGoodFrame: isGoodFrame,
|
|
6825
7032
|
goodFramesCount: goodFramesCount,
|
|
6826
7033
|
goodFramesThreshold: goodFramesThreshold,
|
|
@@ -6874,7 +7081,21 @@ var _reducer = function reducer(state, action) {
|
|
|
6874
7081
|
});
|
|
6875
7082
|
var remainingRequirements = remainingIdCaptureRequirements(state.captureRequirement, newState.capturedDocuments, state.requestedDocumentType);
|
|
6876
7083
|
if (remainingRequirements.length === 0) {
|
|
6877
|
-
|
|
7084
|
+
// Check if we just captured ID back and need barcode recapture
|
|
7085
|
+
var justCapturedIdBack = action.payload.documentType === 'idCardBack';
|
|
7086
|
+
var barcodeScore = (_c = (_b = state.capturedDocuments.idBarcodeImage) === null || _b === void 0 ? void 0 : _b.barcodeReadabilityScore) !== null && _c !== void 0 ? _c : 0;
|
|
7087
|
+
// Note: We no longer skip recapture when Dynamsoft has decoded a barcode.
|
|
7088
|
+
// This allows the recapture flow to continue and capture a good barcode
|
|
7089
|
+
// image for comparison with native decoder results.
|
|
7090
|
+
var needsBarcodeRecapture = justCapturedIdBack && state.barcodeRecaptureThreshold > 0 && barcodeScore < state.barcodeRecaptureThreshold;
|
|
7091
|
+
if (needsBarcodeRecapture) {
|
|
7092
|
+
// Skip 'complete' and go directly to barcode recapture
|
|
7093
|
+
newState.captureState = 'requestingBetterBarcode';
|
|
7094
|
+
newState.barcodeRecaptureStartedAt = new Date();
|
|
7095
|
+
newState.initialBarcodeScore = barcodeScore;
|
|
7096
|
+
} else {
|
|
7097
|
+
newState.captureState = 'complete';
|
|
7098
|
+
}
|
|
6878
7099
|
} else {
|
|
6879
7100
|
newState.requestedDocumentType = remainingRequirements[0];
|
|
6880
7101
|
if (state.requestedDocumentType === 'idCardFront' && newState.requestedDocumentType === 'idCardBack' || state.requestedDocumentType === 'idCardBack' && newState.requestedDocumentType === 'idCardFront') {
|
|
@@ -6901,8 +7122,8 @@ var _reducer = function reducer(state, action) {
|
|
|
6901
7122
|
case 'documentsCaptured':
|
|
6902
7123
|
{
|
|
6903
7124
|
var newState = _assign({}, state);
|
|
6904
|
-
for (var
|
|
6905
|
-
var doc =
|
|
7125
|
+
for (var _f = 0, _g = action.payload; _f < _g.length; _f++) {
|
|
7126
|
+
var doc = _g[_f];
|
|
6906
7127
|
newState = _reducer(newState, {
|
|
6907
7128
|
type: 'documentCaptured',
|
|
6908
7129
|
payload: doc
|
|
@@ -6952,13 +7173,91 @@ var _reducer = function reducer(state, action) {
|
|
|
6952
7173
|
requestedDocumentType: requestedDocumentType
|
|
6953
7174
|
});
|
|
6954
7175
|
}
|
|
7176
|
+
case 'barcodeRecaptureStarted':
|
|
7177
|
+
return _assign(_assign({}, state), {
|
|
7178
|
+
captureState: 'requestingBetterBarcode',
|
|
7179
|
+
barcodeRecaptureStartedAt: new Date(),
|
|
7180
|
+
initialBarcodeScore: action.payload.initialBarcodeScore,
|
|
7181
|
+
initialCaptureBarcodeImage: action.payload.initialCaptureBarcodeImage,
|
|
7182
|
+
recaptureBarcodeScore: null,
|
|
7183
|
+
recaptureBarcodeImage: null,
|
|
7184
|
+
goodFramesCount: 0,
|
|
7185
|
+
capturing: false
|
|
7186
|
+
});
|
|
7187
|
+
case 'barcodeRecaptureScoreUpdated':
|
|
7188
|
+
return _assign(_assign({}, state), {
|
|
7189
|
+
recaptureBarcodeScore: action.payload.recaptureBarcodeScore
|
|
7190
|
+
});
|
|
7191
|
+
case 'recaptureBarcodeImageCaptured':
|
|
7192
|
+
return _assign(_assign({}, state), {
|
|
7193
|
+
recaptureBarcodeImage: action.payload.recaptureBarcodeImage
|
|
7194
|
+
});
|
|
7195
|
+
case 'barcodeRecaptureCompleted':
|
|
7196
|
+
return _assign(_assign({}, state), {
|
|
7197
|
+
captureState: 'complete',
|
|
7198
|
+
barcodeRecaptureStartedAt: null
|
|
7199
|
+
});
|
|
6955
7200
|
case 'resetWizard':
|
|
6956
7201
|
return _assign(_assign({}, initialState$5), {
|
|
6957
7202
|
dispatch: state.dispatch,
|
|
7203
|
+
// Preserve all configuration values
|
|
7204
|
+
captureRequirement: state.captureRequirement,
|
|
7205
|
+
allowSinglePageIdCapture: state.allowSinglePageIdCapture,
|
|
7206
|
+
allowIdCardBackToFrontCapture: state.allowIdCardBackToFrontCapture,
|
|
7207
|
+
enableOverrideWrongDocumentTypeDialog: state.enableOverrideWrongDocumentTypeDialog,
|
|
7208
|
+
allowOverrideWrongDocumentTypeAfterMs: state.allowOverrideWrongDocumentTypeAfterMs,
|
|
6958
7209
|
allowUploadingDocumentsFromStorage: state.allowUploadingDocumentsFromStorage,
|
|
7210
|
+
barcodeRecaptureThreshold: state.barcodeRecaptureThreshold,
|
|
7211
|
+
barcodeRecaptureTimeoutMs: state.barcodeRecaptureTimeoutMs,
|
|
7212
|
+
clientBarcodeScanEnabled: state.clientBarcodeScanEnabled,
|
|
7213
|
+
// Reset capture-specific state
|
|
6959
7214
|
captureState: state.allowUploadingDocumentsFromStorage ? 'initializing' : 'capturing',
|
|
6960
|
-
|
|
6961
|
-
|
|
7215
|
+
barcodeRecaptureStartedAt: null,
|
|
7216
|
+
initialBarcodeScore: 0,
|
|
7217
|
+
recaptureBarcodeScore: null,
|
|
7218
|
+
initialCaptureBarcodeImage: null,
|
|
7219
|
+
recaptureBarcodeImage: null,
|
|
7220
|
+
clientBarcodeScanActive: false,
|
|
7221
|
+
clientBarcodeDecodeResult: null,
|
|
7222
|
+
nativeBarcodeDecodeResult: null,
|
|
7223
|
+
nativeBarcodeDecoding: false
|
|
7224
|
+
});
|
|
7225
|
+
case 'configureClientBarcodeScan':
|
|
7226
|
+
return _assign(_assign({}, state), {
|
|
7227
|
+
clientBarcodeScanEnabled: action.payload.enabled
|
|
7228
|
+
});
|
|
7229
|
+
case 'clientBarcodeScanStarted':
|
|
7230
|
+
return _assign(_assign({}, state), {
|
|
7231
|
+
clientBarcodeScanActive: true,
|
|
7232
|
+
clientBarcodeDecodeResult: null
|
|
7233
|
+
});
|
|
7234
|
+
case 'clientBarcodeScanStopped':
|
|
7235
|
+
return _assign(_assign({}, state), {
|
|
7236
|
+
clientBarcodeScanActive: false
|
|
7237
|
+
});
|
|
7238
|
+
case 'clientBarcodeDecoded':
|
|
7239
|
+
return _assign(_assign({}, state), {
|
|
7240
|
+
clientBarcodeDecodeResult: action.payload,
|
|
7241
|
+
clientBarcodeScanActive: false
|
|
7242
|
+
});
|
|
7243
|
+
case 'clientBarcodeDecodeReset':
|
|
7244
|
+
return _assign(_assign({}, state), {
|
|
7245
|
+
clientBarcodeDecodeResult: null
|
|
7246
|
+
});
|
|
7247
|
+
case 'nativeBarcodeDecodeStarted':
|
|
7248
|
+
return _assign(_assign({}, state), {
|
|
7249
|
+
nativeBarcodeDecoding: true,
|
|
7250
|
+
nativeBarcodeDecodeResult: null
|
|
7251
|
+
});
|
|
7252
|
+
case 'nativeBarcodeDecoded':
|
|
7253
|
+
return _assign(_assign({}, state), {
|
|
7254
|
+
nativeBarcodeDecoding: false,
|
|
7255
|
+
nativeBarcodeDecodeResult: action.payload
|
|
7256
|
+
});
|
|
7257
|
+
case 'nativeBarcodeDecodeFailed':
|
|
7258
|
+
return _assign(_assign({}, state), {
|
|
7259
|
+
nativeBarcodeDecoding: false,
|
|
7260
|
+
nativeBarcodeDecodeResult: null
|
|
6962
7261
|
});
|
|
6963
7262
|
default:
|
|
6964
7263
|
return state;
|
|
@@ -7014,12 +7313,12 @@ function DebugStatsPane(_a) {
|
|
|
7014
7313
|
if (!portalLocation) return element;
|
|
7015
7314
|
return /*#__PURE__*/reactDom.createPortal(element, portalLocation);
|
|
7016
7315
|
}
|
|
7017
|
-
var DebugStatsPaneDiv = styled__default.default.span(templateObject_1$
|
|
7018
|
-
var ObjectDetectionDebugOverlayDiv = styled__default.default.div(templateObject_2$
|
|
7316
|
+
var DebugStatsPaneDiv = styled__default.default.span(templateObject_1$N || (templateObject_1$N = __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"])));
|
|
7317
|
+
var ObjectDetectionDebugOverlayDiv = styled__default.default.div(templateObject_2$I || (templateObject_2$I = __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) {
|
|
7019
7318
|
var $flipX = _a.$flipX;
|
|
7020
7319
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
7021
7320
|
});
|
|
7022
|
-
var ObjectDetectionDebugBox = styled__default.default.div(templateObject_3$
|
|
7321
|
+
var ObjectDetectionDebugBox = styled__default.default.div(templateObject_3$w || (templateObject_3$w = __makeTemplateObject(["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n transform-style: preserve-3d;\n"], ["\n font: 10px monospace;\n position: absolute;\n border: 3px solid ", ";\n color: ", ";\n ", "\n transform-style: preserve-3d;\n"])), function (_a) {
|
|
7023
7322
|
var $color = _a.$color;
|
|
7024
7323
|
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
7025
7324
|
}, function (_a) {
|
|
@@ -7029,7 +7328,11 @@ var ObjectDetectionDebugBox = styled__default.default.div(templateObject_3$t ||
|
|
|
7029
7328
|
var $flipX = _a.$flipX;
|
|
7030
7329
|
return $flipX ? 'transform: scaleX(-1);' : '';
|
|
7031
7330
|
});
|
|
7032
|
-
var
|
|
7331
|
+
var ObjectDetectionDebugLabel = styled__default.default.span(templateObject_4$q || (templateObject_4$q = __makeTemplateObject(["\n position: absolute;\n top: -1px;\n left: -1px;\n background: ", ";\n color: black;\n font: bold 9px monospace;\n padding: 1px 3px;\n white-space: nowrap;\n transform: translateY(-100%);\n"], ["\n position: absolute;\n top: -1px;\n left: -1px;\n background: ", ";\n color: black;\n font: bold 9px monospace;\n padding: 1px 3px;\n white-space: nowrap;\n transform: translateY(-100%);\n"])), function (_a) {
|
|
7332
|
+
var $color = _a.$color;
|
|
7333
|
+
return $color !== null && $color !== void 0 ? $color : 'green';
|
|
7334
|
+
});
|
|
7335
|
+
var FaceDetectionKeypointMarker = styled__default.default.div(templateObject_5$j || (templateObject_5$j = __makeTemplateObject(["\n position: absolute;\n width: 4px;\n height: 4px;\n border: 2px solid ", ";\n font: 10px monospace;\n color: ", ";\n border-radius: 50%;\n ", "\n transform-style: preserve-3d;\n"], ["\n position: absolute;\n width: 4px;\n height: 4px;\n border: 2px solid ", ";\n font: 10px monospace;\n color: ", ";\n border-radius: 50%;\n ", "\n transform-style: preserve-3d;\n"])), function (_a) {
|
|
7033
7336
|
var $color = _a.$color;
|
|
7034
7337
|
return $color !== null && $color !== void 0 ? $color : 'red';
|
|
7035
7338
|
}, function (_a) {
|
|
@@ -7141,7 +7444,9 @@ function IdCaptureDetectedObjectDebugBox(_a) {
|
|
|
7141
7444
|
width: width,
|
|
7142
7445
|
height: height
|
|
7143
7446
|
}
|
|
7144
|
-
}
|
|
7447
|
+
}, /*#__PURE__*/React__namespace.default.createElement(ObjectDetectionDebugLabel, {
|
|
7448
|
+
"$color": color
|
|
7449
|
+
}, obj.label, " ", obj.score.toFixed(2)));
|
|
7145
7450
|
}
|
|
7146
7451
|
function SelfieCaptureFaceDebugBox(_a) {
|
|
7147
7452
|
var face = _a.face,
|
|
@@ -7227,7 +7532,7 @@ function SelfieCaptureFaceKeypoint(_a) {
|
|
|
7227
7532
|
}
|
|
7228
7533
|
});
|
|
7229
7534
|
}
|
|
7230
|
-
var templateObject_1$
|
|
7535
|
+
var templateObject_1$N, templateObject_2$I, templateObject_3$w, templateObject_4$q, templateObject_5$j;
|
|
7231
7536
|
|
|
7232
7537
|
function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
7233
7538
|
var _b = _a.classNames,
|
|
@@ -7250,7 +7555,7 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
|
7250
7555
|
className: classNames.message
|
|
7251
7556
|
}, verbiage.messageText), /*#__PURE__*/React__namespace.default.createElement(ButtonContainer, {
|
|
7252
7557
|
className: classNames.buttonContainer
|
|
7253
|
-
}, /*#__PURE__*/React__namespace.default.createElement(Button$
|
|
7558
|
+
}, /*#__PURE__*/React__namespace.default.createElement(Button$2, {
|
|
7254
7559
|
variant: "positive",
|
|
7255
7560
|
className: classNames.button,
|
|
7256
7561
|
onClick: function onClick() {
|
|
@@ -7260,18 +7565,18 @@ function OverrideWrongDocumentTypeGuidanceDialog(_a) {
|
|
|
7260
7565
|
}
|
|
7261
7566
|
}, verbiage.buttonText))));
|
|
7262
7567
|
}
|
|
7263
|
-
var Container$7 = styled__default.default.div(templateObject_1$
|
|
7568
|
+
var Container$7 = styled__default.default.div(templateObject_1$M || (templateObject_1$M = __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) {
|
|
7264
7569
|
var _a, _b, _c;
|
|
7265
7570
|
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';
|
|
7266
7571
|
}, function (props) {
|
|
7267
7572
|
var _a, _b, _c;
|
|
7268
7573
|
return (_c = (_b = (_a = props.theme.idCapture) === null || _a === void 0 ? void 0 : _a.overrideWrongDocumentTypeGuidance) === null || _b === void 0 ? void 0 : _b.textColor) !== null && _c !== void 0 ? _c : 'black';
|
|
7269
7574
|
});
|
|
7270
|
-
var InnerContainer = styled__default.default.div(templateObject_2$
|
|
7271
|
-
var Message = styled__default.default.span(templateObject_3$
|
|
7272
|
-
var ButtonContainer = styled__default.default.div(templateObject_4$
|
|
7273
|
-
var Button$
|
|
7274
|
-
var templateObject_1$
|
|
7575
|
+
var InnerContainer = styled__default.default.div(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: 16px 24px;\n margin: auto 0;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: row;\n padding: 16px 24px;\n margin: auto 0;\n width: 100%;\n"])));
|
|
7576
|
+
var Message = styled__default.default.span(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n display: block;\n margin: auto 12px auto 0;\n"], ["\n display: block;\n margin: auto 12px auto 0;\n"])));
|
|
7577
|
+
var ButtonContainer = styled__default.default.div(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n display: flex;\n margin-left: auto;\n"], ["\n display: flex;\n margin-left: auto;\n"])));
|
|
7578
|
+
var Button$2 = styled__default.default(LoaderButton)(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n white-space: nowrap;\n margin: auto;\n"], ["\n white-space: nowrap;\n margin: auto;\n"])));
|
|
7579
|
+
var templateObject_1$M, templateObject_2$H, templateObject_3$v, templateObject_4$p, templateObject_5$i;
|
|
7275
7580
|
|
|
7276
7581
|
// This is a simplified version of https://github.com/ZeeCoder/use-resize-observer.
|
|
7277
7582
|
// We have removed all options and made it compliant with React Compiler/React 19.
|
|
@@ -7390,36 +7695,36 @@ function extractSize(entry, sizeType) {
|
|
|
7390
7695
|
}
|
|
7391
7696
|
|
|
7392
7697
|
var IdCapture = function IdCapture(_a) {
|
|
7393
|
-
var _b, _c, _d, _e, _f, _g;
|
|
7698
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
7394
7699
|
var requiredDocumentType = _a.requiredDocumentType,
|
|
7395
|
-
|
|
7396
|
-
thresholds =
|
|
7700
|
+
_k = _a.thresholds,
|
|
7701
|
+
thresholds = _k === void 0 ? defaultIdCaptureThresholds : _k,
|
|
7397
7702
|
guidanceMessage = _a.guidanceMessage,
|
|
7398
7703
|
guidanceSatisfied = _a.guidanceSatisfied,
|
|
7399
7704
|
onCapture = _a.onCapture,
|
|
7400
|
-
|
|
7401
|
-
classNames =
|
|
7402
|
-
|
|
7403
|
-
colors =
|
|
7404
|
-
|
|
7405
|
-
rawVerbiage =
|
|
7406
|
-
|
|
7407
|
-
debugMode =
|
|
7408
|
-
var
|
|
7409
|
-
ref =
|
|
7410
|
-
|
|
7411
|
-
width =
|
|
7412
|
-
|
|
7413
|
-
height =
|
|
7705
|
+
_l = _a.classNames,
|
|
7706
|
+
classNames = _l === void 0 ? {} : _l,
|
|
7707
|
+
_m = _a.colors,
|
|
7708
|
+
colors = _m === void 0 ? {} : _m,
|
|
7709
|
+
_o = _a.verbiage,
|
|
7710
|
+
rawVerbiage = _o === void 0 ? {} : _o,
|
|
7711
|
+
_p = _a.debugMode,
|
|
7712
|
+
debugMode = _p === void 0 ? false : _p;
|
|
7713
|
+
var _q = useResizeObserver(),
|
|
7714
|
+
ref = _q.ref,
|
|
7715
|
+
_r = _q.width,
|
|
7716
|
+
width = _r === void 0 ? 1 : _r,
|
|
7717
|
+
_s = _q.height,
|
|
7718
|
+
height = _s === void 0 ? 1 : _s;
|
|
7414
7719
|
var state = useIdCaptureStore();
|
|
7415
7720
|
var isRearFacing = useCameraStore().isRearFacing;
|
|
7416
|
-
var
|
|
7417
|
-
modelsReady =
|
|
7418
|
-
setThresholds =
|
|
7419
|
-
detectionTime =
|
|
7420
|
-
focusPredictionTime =
|
|
7421
|
-
getBestFrame =
|
|
7422
|
-
getBestBarcode =
|
|
7721
|
+
var _t = useIdCaptureModelsContext(),
|
|
7722
|
+
modelsReady = _t.ready,
|
|
7723
|
+
setThresholds = _t.setThresholds,
|
|
7724
|
+
detectionTime = _t.detectionTime,
|
|
7725
|
+
focusPredictionTime = _t.focusPredictionTime,
|
|
7726
|
+
getBestFrame = _t.getBestFrame,
|
|
7727
|
+
getBestBarcode = _t.getBestBarcode;
|
|
7423
7728
|
React.useEffect(function () {
|
|
7424
7729
|
return dispatchIdCaptureAction({
|
|
7425
7730
|
type: 'captureInitialized'
|
|
@@ -7444,7 +7749,7 @@ var IdCapture = function IdCapture(_a) {
|
|
|
7444
7749
|
}
|
|
7445
7750
|
});
|
|
7446
7751
|
}, [height, width]);
|
|
7447
|
-
var shouldCapture = state.goodFramesThresholdMet && !state.capturing && timeSince(state.captureStartedAt) >= 3000;
|
|
7752
|
+
var shouldCapture = state.captureState === 'capturing' && state.goodFramesThresholdMet && !state.capturing && timeSince(state.captureStartedAt) >= 3000;
|
|
7448
7753
|
React.useEffect(function () {
|
|
7449
7754
|
if (!shouldCapture) return;
|
|
7450
7755
|
dispatchIdCaptureAction({
|
|
@@ -7460,10 +7765,11 @@ var IdCapture = function IdCapture(_a) {
|
|
|
7460
7765
|
}
|
|
7461
7766
|
var bestBarcode = getBestBarcode();
|
|
7462
7767
|
if (bestBarcode) {
|
|
7768
|
+
var barcodeImageUrl = bestBarcode.canvas.toDataURL('image/jpeg', 0.95);
|
|
7463
7769
|
dispatchIdCaptureAction({
|
|
7464
7770
|
type: 'barcodeCaptured',
|
|
7465
7771
|
payload: {
|
|
7466
|
-
imageUrl:
|
|
7772
|
+
imageUrl: barcodeImageUrl,
|
|
7467
7773
|
barcodeReadabilityScore: bestBarcode.score
|
|
7468
7774
|
}
|
|
7469
7775
|
});
|
|
@@ -7544,13 +7850,18 @@ var IdCapture = function IdCapture(_a) {
|
|
|
7544
7850
|
"$flipX": !isRearFacing,
|
|
7545
7851
|
scaling: debugScalingDetails
|
|
7546
7852
|
}, state.detectedObjects.map(function (obj, i) {
|
|
7853
|
+
// During barcode recapture, render PDF417 barcodes with green color
|
|
7854
|
+
var isBarcodeRecapture = state.captureState === 'requestingBetterBarcode';
|
|
7855
|
+
var isBarcode = obj.label === 'PDF417';
|
|
7856
|
+
var color = isBarcodeRecapture && isBarcode ? 'green' : undefined;
|
|
7547
7857
|
return /*#__PURE__*/React__namespace.default.createElement(IdCaptureDetectedObjectDebugBox, {
|
|
7548
7858
|
key: i,
|
|
7549
7859
|
obj: obj,
|
|
7550
7860
|
scaling: debugScalingDetails,
|
|
7551
|
-
flipX: !isRearFacing
|
|
7861
|
+
flipX: !isRearFacing,
|
|
7862
|
+
color: color
|
|
7552
7863
|
});
|
|
7553
|
-
}))), 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), state.frameCaptureRate > 0.75 ? '✅' : '👎', " Frame Rate:", ' ', Math.round((state.frameCaptureRate + Number.EPSILON) * 1000) / 1000, ' ', "fps (", detectionTime, "ms doc detect, ", focusPredictionTime, "ms focus)", /*#__PURE__*/React__namespace.default.createElement("br", null), modelsReady ? (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, state.detectionThresholdMet ? '✅' : '❌', " Detected Document Type: ", state.detectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardFrontDetectionThresholdMet ? '✅' : '❌', " ID Card Front Score: ", state.idCardFrontDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardBackDetectionThresholdMet ? '✅' : '❌', " ID Card Back Score: ", state.idCardBackDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.passportDetectionThresholdMet ? '✅' : '❌', " Passport Score: ", state.passportDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.singlePageDetectionThresholdMet ? '✅' : '❌', " Single Page Score: ", state.singlePageDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.focusThresholdMet ? '✅' : '❌', " Focus Score:", ' ', state.focusScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentInBounds ? '✅' : '❌', " Document In Bounds", /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentIsStable ? '✅' : '❌', " Document Is Stable", /*#__PURE__*/React__namespace.default.createElement("br", null), state.goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', state.goodFramesCount, "/", state.goodFramesThreshold)) : (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u274C Models not ready")))));
|
|
7864
|
+
}))), 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), state.frameCaptureRate > 0.75 ? '✅' : '👎', " Frame Rate:", ' ', Math.round((state.frameCaptureRate + Number.EPSILON) * 1000) / 1000, ' ', "fps (", detectionTime, "ms doc detect, ", focusPredictionTime, "ms focus)", /*#__PURE__*/React__namespace.default.createElement("br", null), modelsReady ? (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, state.detectionThresholdMet ? '✅' : '❌', " Detected Document Type: ", state.detectedDocumentType, /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardFrontDetectionThresholdMet ? '✅' : '❌', " ID Card Front Score: ", state.idCardFrontDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.idCardBackDetectionThresholdMet ? '✅' : '❌', " ID Card Back Score: ", state.idCardBackDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.passportDetectionThresholdMet ? '✅' : '❌', " Passport Score: ", state.passportDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.singlePageDetectionThresholdMet ? '✅' : '❌', " Single Page Score: ", state.singlePageDetectionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.focusThresholdMet ? '✅' : '❌', " Focus Score:", ' ', state.focusScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), state.pdf417PredictionThresholdMet ? '✅' : '❌', " Current Barcode Score: ", state.pdf417PredictionScore.toFixed(3), /*#__PURE__*/React__namespace.default.createElement("br", null), getBestBarcode() ? '✅' : '❌', " Best Barcode Score:", ' ', (_j = (_h = getBestBarcode()) === null || _h === void 0 ? void 0 : _h.score.toFixed(3)) !== null && _j !== void 0 ? _j : 'N/A', /*#__PURE__*/React__namespace.default.createElement("br", null), state.clientBarcodeDecodeResult ? '✅' : '⏳', " Client Barcode:", ' ', state.clientBarcodeDecodeResult ? "".concat(state.clientBarcodeDecodeResult.format, " (").concat(state.clientBarcodeDecodeResult.text.length, " chars)") : 'Not decoded', /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentInBounds ? '✅' : '❌', " Document In Bounds", /*#__PURE__*/React__namespace.default.createElement("br", null), state.documentIsStable ? '✅' : '❌', " Document Is Stable", /*#__PURE__*/React__namespace.default.createElement("br", null), state.goodFramesThresholdMet ? '✅' : '❌', " Good Frame Count:", ' ', state.goodFramesCount, "/", state.goodFramesThreshold)) : (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u274C Models not ready")))));
|
|
7554
7865
|
};
|
|
7555
7866
|
var timeSince = function timeSince(t) {
|
|
7556
7867
|
if (!t) return 0;
|
|
@@ -7588,7 +7899,7 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
|
|
|
7588
7899
|
className: classNames.image
|
|
7589
7900
|
})), /*#__PURE__*/React__namespace.default.createElement("h3", {
|
|
7590
7901
|
className: classNames.heading
|
|
7591
|
-
}, verbiage.headingText), /*#__PURE__*/React__namespace.default.createElement(Description$
|
|
7902
|
+
}, verbiage.headingText), /*#__PURE__*/React__namespace.default.createElement(Description$5, {
|
|
7592
7903
|
className: classNames.description
|
|
7593
7904
|
}, verbiage.descriptionText), /*#__PURE__*/React__namespace.default.createElement(RetryButton$1, {
|
|
7594
7905
|
variant: "warning",
|
|
@@ -7598,13 +7909,13 @@ var CameraAccessDeniedOverlay = function CameraAccessDeniedOverlay(_a) {
|
|
|
7598
7909
|
finished: true
|
|
7599
7910
|
}, verbiage.retryBtnText)));
|
|
7600
7911
|
};
|
|
7601
|
-
var StyledOverlayInner$3 = styled__default.default(OverlayInner$2)(templateObject_1$
|
|
7602
|
-
var StyledOverlayImageContainer$1 = styled__default.default(OverlayImageContainer)(templateObject_2$
|
|
7603
|
-
var Description$
|
|
7604
|
-
var RetryButton$1 = styled__default.default(LoaderButton)(templateObject_4$
|
|
7605
|
-
var templateObject_1$
|
|
7912
|
+
var StyledOverlayInner$3 = styled__default.default(OverlayInner$2)(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n max-width: 500px;\n height: auto;\n margin: auto;\n"], ["\n max-width: 500px;\n height: auto;\n margin: auto;\n"])));
|
|
7913
|
+
var StyledOverlayImageContainer$1 = styled__default.default(OverlayImageContainer)(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n flex-grow: 0;\n"], ["\n flex-grow: 0;\n"])));
|
|
7914
|
+
var Description$5 = styled__default.default.p(templateObject_3$u || (templateObject_3$u = __makeTemplateObject(["\n line-height: 1.5;\n margin-bottom: 50px;\n"], ["\n line-height: 1.5;\n margin-bottom: 50px;\n"])));
|
|
7915
|
+
var RetryButton$1 = styled__default.default(LoaderButton)(templateObject_4$o || (templateObject_4$o = __makeTemplateObject(["\n width: 200px;\n margin: 0 auto;\n"], ["\n width: 200px;\n margin: 0 auto;\n"])));
|
|
7916
|
+
var templateObject_1$L, templateObject_2$G, templateObject_3$u, templateObject_4$o;
|
|
7606
7917
|
|
|
7607
|
-
var ExitCaptureStyledButton = styled__default.default.button(templateObject_1$
|
|
7918
|
+
var ExitCaptureStyledButton = styled__default.default.button(templateObject_1$K || (templateObject_1$K = __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: 10002;\n border: none;\n border-radius: 4px;\n background: var(--idm-color-secondary-200);\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: 10002;\n border: none;\n border-radius: 4px;\n background: var(--idm-color-secondary-200);\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"])));
|
|
7608
7919
|
var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
7609
7920
|
var onClick = _a.onClick,
|
|
7610
7921
|
className = _a.className;
|
|
@@ -7648,7 +7959,7 @@ var ExitCaptureButton = function ExitCaptureButton(_a) {
|
|
|
7648
7959
|
y2: "19.75"
|
|
7649
7960
|
}))));
|
|
7650
7961
|
};
|
|
7651
|
-
var templateObject_1$
|
|
7962
|
+
var templateObject_1$K;
|
|
7652
7963
|
|
|
7653
7964
|
function IdCaptureLoadingGraphic(props) {
|
|
7654
7965
|
var isMobile = window.innerHeight > window.innerWidth;
|
|
@@ -8123,21 +8434,21 @@ function IdCaptureLoadingGraphicMobile(_a) {
|
|
|
8123
8434
|
fill: "white"
|
|
8124
8435
|
}))));
|
|
8125
8436
|
}
|
|
8126
|
-
var LoadingGraphicWrapper = styled__default.default.div(templateObject_1$
|
|
8127
|
-
var LoadingGraphicSvg = styled__default.default.svg(templateObject_2$
|
|
8437
|
+
var LoadingGraphicWrapper = styled__default.default.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n width: 100%;\n height: 100%;\n"])));
|
|
8438
|
+
var LoadingGraphicSvg = styled__default.default.svg(templateObject_2$F || (templateObject_2$F = __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) {
|
|
8128
8439
|
return props.$frame > 1 ? 1 : props.$frame === 1 ? 1.25 : 0.75;
|
|
8129
8440
|
}, function (props) {
|
|
8130
8441
|
return props.$frame >= 5 ? 10 : 0;
|
|
8131
8442
|
}, function (props) {
|
|
8132
8443
|
return props.$borderColor;
|
|
8133
8444
|
});
|
|
8134
|
-
var LoadingGraphicCardGroup = styled__default.default.g(templateObject_3$
|
|
8445
|
+
var LoadingGraphicCardGroup = styled__default.default.g(templateObject_3$t || (templateObject_3$t = __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) {
|
|
8135
8446
|
return props.$offScreen ? '-500px' : '0';
|
|
8136
8447
|
});
|
|
8137
|
-
var LoadingGraphicPhoneGroup = styled__default.default.g(templateObject_4$
|
|
8448
|
+
var LoadingGraphicPhoneGroup = styled__default.default.g(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n transform: translate(", ", 0);\n transform-style: preserve-3d;\n transition: transform 0.3s linear;\n"], ["\n transform: translate(", ", 0);\n transform-style: preserve-3d;\n transition: transform 0.3s linear;\n"])), function (props) {
|
|
8138
8449
|
return props.$offScreen ? '40px' : '0';
|
|
8139
8450
|
});
|
|
8140
|
-
var templateObject_1$
|
|
8451
|
+
var templateObject_1$J, templateObject_2$F, templateObject_3$t, templateObject_4$n;
|
|
8141
8452
|
|
|
8142
8453
|
function LoadingListItemIndicator(_a) {
|
|
8143
8454
|
var _b = _a.state,
|
|
@@ -8406,35 +8717,35 @@ var IdCaptureLoadingOverlayDefault = function IdCaptureLoadingOverlayDefault(_a)
|
|
|
8406
8717
|
}
|
|
8407
8718
|
}, ready ? verbiage.continueText : verbiage.pleaseWaitText))))));
|
|
8408
8719
|
};
|
|
8409
|
-
var OverlayInner$1 = styled__default.default(LoadingOverlayInner)(templateObject_1$
|
|
8720
|
+
var OverlayInner$1 = styled__default.default(LoadingOverlayInner)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n"], ["\n background: ", ";\n color: ", ";\n"])), function (props) {
|
|
8410
8721
|
var _a, _b, _c, _d;
|
|
8411
8722
|
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';
|
|
8412
8723
|
}, function (props) {
|
|
8413
8724
|
var _a, _b, _c, _d;
|
|
8414
8725
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.textColor) !== null && _d !== void 0 ? _d : 'black';
|
|
8415
8726
|
});
|
|
8416
|
-
var ContinuityCameraCheckboxContainer$1 = styled__default.default.div(templateObject_2$
|
|
8417
|
-
var ContinuityCameraCheckboxInner = styled__default.default(GuidanceMessage)(templateObject_3$
|
|
8418
|
-
var ContinuityCameraCheckbox$1 = styled__default.default.input(templateObject_4$
|
|
8419
|
-
var ButtonsRow$1 = styled__default.default(LoadingOverlayButtonsRow)(templateObject_5$
|
|
8727
|
+
var ContinuityCameraCheckboxContainer$1 = styled__default.default.div(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n position: absolute;\n bottom: 120px;\n width: 100%;\n display: flex;\n"], ["\n position: absolute;\n bottom: 120px;\n width: 100%;\n display: flex;\n"])));
|
|
8728
|
+
var ContinuityCameraCheckboxInner = styled__default.default(GuidanceMessage)(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n display: flex;\n gap: 8px;\n align-items: center;\n padding: 12px 18px;\n margin: 0 auto;\n font-size: 14px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n display: flex;\n gap: 8px;\n align-items: center;\n padding: 12px 18px;\n margin: 0 auto;\n font-size: 14px;\n font-weight: bold;\n background: white;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])));
|
|
8729
|
+
var ContinuityCameraCheckbox$1 = styled__default.default.input(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
|
|
8730
|
+
var ButtonsRow$1 = styled__default.default(LoadingOverlayButtonsRow)(templateObject_5$h || (templateObject_5$h = __makeTemplateObject(["\n color: ", ";\n ", "\n"], ["\n color: ", ";\n ", "\n"])), function (props) {
|
|
8420
8731
|
var _a, _b, _c, _d;
|
|
8421
8732
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarTextColor) !== null && _d !== void 0 ? _d : 'white';
|
|
8422
8733
|
}, function (props) {
|
|
8423
8734
|
var _a, _b, _c, _d, _e, _f;
|
|
8424
8735
|
return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarFontSize) ? "font-size: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.progressBarFontSize, ";") : '';
|
|
8425
8736
|
});
|
|
8426
|
-
var ProgressBarBackground$1 = styled__default.default(LoadingOverlayProgressBarBackground)(templateObject_6$
|
|
8737
|
+
var ProgressBarBackground$1 = styled__default.default(LoadingOverlayProgressBarBackground)(templateObject_6$b || (templateObject_6$b = __makeTemplateObject(["\n background: ", ";\n opacity: ", ";\n"], ["\n background: ", ";\n opacity: ", ";\n"])), function (props) {
|
|
8427
8738
|
var _a, _b, _c, _d;
|
|
8428
8739
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarBackgroundColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-positive-600)';
|
|
8429
8740
|
}, function (props) {
|
|
8430
8741
|
var _a, _b, _c, _d;
|
|
8431
8742
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarBackgroundOpacity) !== null && _d !== void 0 ? _d : 0.75;
|
|
8432
8743
|
});
|
|
8433
|
-
var ProgressIndicator$1 = styled__default.default(LoadingOverlayProgressIndicator)(templateObject_7$
|
|
8744
|
+
var ProgressIndicator$1 = styled__default.default(LoadingOverlayProgressIndicator)(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n background: ", ";\n"], ["\n background: ", ";\n"])), function (props) {
|
|
8434
8745
|
var _a, _b, _c, _d;
|
|
8435
8746
|
return (_d = (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarIndicatorColor) !== null && _d !== void 0 ? _d : 'var(--idm-color-primary-500)';
|
|
8436
8747
|
});
|
|
8437
|
-
var ContinueButton$1 = styled__default.default(LoaderButton)(templateObject_8$
|
|
8748
|
+
var ContinueButton$1 = styled__default.default(LoaderButton)(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n\n &.disabled {\n background: ", ";\n color: ", ";\n border: ", ";\n }\n"], ["\n margin: auto;\n white-space: nowrap;\n ", "\n ", "\n \n &:focus-visible {\n ", "\n box-shadow: none;\n }\n\n &.disabled {\n background: ", ";\n color: ", ";\n border: ", ";\n }\n"])), function (props) {
|
|
8438
8749
|
var _a, _b, _c, _d, _e, _f;
|
|
8439
8750
|
return ((_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.idCapture) === null || _b === void 0 ? void 0 : _b.loadingOverlay) === null || _c === void 0 ? void 0 : _c.progressBarFontSize) ? "font-size: ".concat((_f = (_e = (_d = props.theme) === null || _d === void 0 ? void 0 : _d.idCapture) === null || _e === void 0 ? void 0 : _e.loadingOverlay) === null || _f === void 0 ? void 0 : _f.progressBarFontSize, ";") : '';
|
|
8440
8751
|
}, function (props) {
|
|
@@ -8453,10 +8764,10 @@ var ContinueButton$1 = styled__default.default(LoaderButton)(templateObject_8$4
|
|
|
8453
8764
|
var _a, _b, _c, _d;
|
|
8454
8765
|
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';
|
|
8455
8766
|
});
|
|
8456
|
-
var templateObject_1$
|
|
8767
|
+
var templateObject_1$I, templateObject_2$E, templateObject_3$s, templateObject_4$m, templateObject_5$h, templateObject_6$b, templateObject_7$7, templateObject_8$6;
|
|
8457
8768
|
|
|
8458
|
-
var ContinuityCameraCheckboxContainer = styled__default.default.div(templateObject_1$
|
|
8459
|
-
var ContinuityCameraCheckbox = styled__default.default.input(templateObject_2$
|
|
8769
|
+
var ContinuityCameraCheckboxContainer = styled__default.default.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n margin-top: 15px;\n margin-bottom: 15px;\n"], ["\n margin-top: 15px;\n margin-bottom: 15px;\n"])));
|
|
8770
|
+
var ContinuityCameraCheckbox = styled__default.default.input(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n margin-right: 8px;\n"], ["\n margin-right: 8px;\n"])));
|
|
8460
8771
|
var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
8461
8772
|
var _b, _c, _d, _e;
|
|
8462
8773
|
var onDismissed = _a.onDismissed,
|
|
@@ -8577,7 +8888,7 @@ var IdCaptureLoadingOverlayLegacy = function IdCaptureLoadingOverlayLegacy(_a) {
|
|
|
8577
8888
|
}
|
|
8578
8889
|
}, ready ? verbiage.continueText : modelsReady ? verbiage.cameraInitializingText : modelDownloadProgress >= 100 ? verbiage.modelsWarmingUpText : "".concat(verbiage.downloadingText, " (").concat(modelDownloadProgress, "%)"))));
|
|
8579
8890
|
};
|
|
8580
|
-
var templateObject_1$
|
|
8891
|
+
var templateObject_1$H, templateObject_2$D;
|
|
8581
8892
|
|
|
8582
8893
|
var components$1 = {
|
|
8583
8894
|
"default": IdCaptureLoadingOverlayDefault,
|
|
@@ -8635,11 +8946,205 @@ var CapturedDocumentImg = function CapturedDocumentImg(_a) {
|
|
|
8635
8946
|
});
|
|
8636
8947
|
};
|
|
8637
8948
|
|
|
8638
|
-
var Card = styled__default.default.div(templateObject_1$
|
|
8639
|
-
var FlexCard = styled__default.default(Card)(templateObject_2$
|
|
8640
|
-
var templateObject_1$
|
|
8949
|
+
var Card = styled__default.default.div(templateObject_1$G || (templateObject_1$G = __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"])));
|
|
8950
|
+
var FlexCard = styled__default.default(Card)(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
8951
|
+
var templateObject_1$G, templateObject_2$C;
|
|
8952
|
+
|
|
8953
|
+
/**
|
|
8954
|
+
* Parser for AAMVA (American Association of Motor Vehicle Administrators)
|
|
8955
|
+
* PDF417 barcode data found on US and Canadian driver's licenses.
|
|
8956
|
+
*/
|
|
8957
|
+
// AAMVA field codes to human-readable labels
|
|
8958
|
+
var AAMVA_FIELD_LABELS = {
|
|
8959
|
+
// Required fields
|
|
8960
|
+
DCS: 'Last Name',
|
|
8961
|
+
DAC: 'First Name',
|
|
8962
|
+
DAD: 'Middle Name',
|
|
8963
|
+
DBB: 'Date of Birth',
|
|
8964
|
+
DBC: 'Sex',
|
|
8965
|
+
DAY: 'Eye Color',
|
|
8966
|
+
DAU: 'Height',
|
|
8967
|
+
DAG: 'Street Address',
|
|
8968
|
+
DAI: 'City',
|
|
8969
|
+
DAJ: 'State',
|
|
8970
|
+
DAK: 'ZIP Code',
|
|
8971
|
+
DAQ: 'License Number',
|
|
8972
|
+
DCF: 'Document Discriminator',
|
|
8973
|
+
DCG: 'Country',
|
|
8974
|
+
DDE: 'Last Name Truncation',
|
|
8975
|
+
DDF: 'First Name Truncation',
|
|
8976
|
+
DDG: 'Middle Name Truncation',
|
|
8977
|
+
// Optional fields
|
|
8978
|
+
DBD: 'Document Issue Date',
|
|
8979
|
+
DBA: 'Document Expiration Date',
|
|
8980
|
+
DCD: 'Jurisdiction Restriction Codes',
|
|
8981
|
+
DCB: 'Jurisdiction Endorsement Codes',
|
|
8982
|
+
DCA: 'Vehicle Class',
|
|
8983
|
+
DCE: 'Weight Range',
|
|
8984
|
+
DCL: 'Race/Ethnicity',
|
|
8985
|
+
DCM: 'Standard Vehicle Classification',
|
|
8986
|
+
DCN: 'Standard Endorsement Code',
|
|
8987
|
+
DCO: 'Standard Restriction Code',
|
|
8988
|
+
DCP: 'Jurisdiction Vehicle Class Description',
|
|
8989
|
+
DCQ: 'Jurisdiction Endorsement Code Description',
|
|
8990
|
+
DCR: 'Jurisdiction Restriction Code Description',
|
|
8991
|
+
DDA: 'Compliance Type',
|
|
8992
|
+
DDB: 'Card Revision Date',
|
|
8993
|
+
DDC: 'HAZMAT Endorsement Expiration Date',
|
|
8994
|
+
DDD: 'Limited Duration Document Indicator',
|
|
8995
|
+
DDH: 'Under 18 Until',
|
|
8996
|
+
DDI: 'Under 19 Until',
|
|
8997
|
+
DDJ: 'Under 21 Until',
|
|
8998
|
+
DDK: 'Organ Donor Indicator',
|
|
8999
|
+
DDL: 'Veteran Indicator',
|
|
9000
|
+
DAW: 'Weight (lbs)',
|
|
9001
|
+
DAX: 'Weight (kg)',
|
|
9002
|
+
DAZ: 'Hair Color',
|
|
9003
|
+
DBN: 'Alias/AKA Last Name',
|
|
9004
|
+
DBG: 'Alias/AKA First Name',
|
|
9005
|
+
DBS: 'Alias/AKA Suffix',
|
|
9006
|
+
DCU: 'Name Suffix',
|
|
9007
|
+
DCT: 'First Name Alias',
|
|
9008
|
+
DAH: 'Street Address Line 2',
|
|
9009
|
+
DAL: 'Residence Street Address',
|
|
9010
|
+
DAN: 'Residence City',
|
|
9011
|
+
DAO: 'Residence State',
|
|
9012
|
+
DAP: 'Residence ZIP'
|
|
9013
|
+
};
|
|
9014
|
+
// Sex code mappings
|
|
9015
|
+
var SEX_CODES = {
|
|
9016
|
+
'1': 'Male',
|
|
9017
|
+
'2': 'Female',
|
|
9018
|
+
'9': 'Not Specified'
|
|
9019
|
+
};
|
|
9020
|
+
// Eye color code mappings
|
|
9021
|
+
var EYE_COLOR_CODES = {
|
|
9022
|
+
BLK: 'Black',
|
|
9023
|
+
BLU: 'Blue',
|
|
9024
|
+
BRO: 'Brown',
|
|
9025
|
+
GRY: 'Gray',
|
|
9026
|
+
GRN: 'Green',
|
|
9027
|
+
HAZ: 'Hazel',
|
|
9028
|
+
MAR: 'Maroon',
|
|
9029
|
+
PNK: 'Pink',
|
|
9030
|
+
DIC: 'Dichromatic',
|
|
9031
|
+
UNK: 'Unknown'
|
|
9032
|
+
};
|
|
9033
|
+
// Hair color code mappings
|
|
9034
|
+
var HAIR_COLOR_CODES = {
|
|
9035
|
+
BAL: 'Bald',
|
|
9036
|
+
BLK: 'Black',
|
|
9037
|
+
BLN: 'Blond',
|
|
9038
|
+
BRO: 'Brown',
|
|
9039
|
+
GRY: 'Gray',
|
|
9040
|
+
RED: 'Red/Auburn',
|
|
9041
|
+
SDY: 'Sandy',
|
|
9042
|
+
WHI: 'White',
|
|
9043
|
+
UNK: 'Unknown'
|
|
9044
|
+
};
|
|
9045
|
+
/**
|
|
9046
|
+
* Formats a date string from AAMVA format (MMDDYYYY) to readable format
|
|
9047
|
+
*/
|
|
9048
|
+
function formatDate(value) {
|
|
9049
|
+
if (value.length !== 8) return value;
|
|
9050
|
+
var month = value.substring(0, 2);
|
|
9051
|
+
var day = value.substring(2, 4);
|
|
9052
|
+
var year = value.substring(4, 8);
|
|
9053
|
+
return "".concat(month, "/").concat(day, "/").concat(year);
|
|
9054
|
+
}
|
|
9055
|
+
/**
|
|
9056
|
+
* Formats a value based on its field code
|
|
9057
|
+
*/
|
|
9058
|
+
function formatValue$1(code, value) {
|
|
9059
|
+
// Date fields
|
|
9060
|
+
if (['DBB', 'DBD', 'DBA', 'DDB', 'DDC', 'DDH', 'DDI', 'DDJ'].includes(code)) {
|
|
9061
|
+
return formatDate(value);
|
|
9062
|
+
}
|
|
9063
|
+
// Sex field
|
|
9064
|
+
if (code === 'DBC') {
|
|
9065
|
+
return SEX_CODES[value] || value;
|
|
9066
|
+
}
|
|
9067
|
+
// Eye color
|
|
9068
|
+
if (code === 'DAY') {
|
|
9069
|
+
return EYE_COLOR_CODES[value] || value;
|
|
9070
|
+
}
|
|
9071
|
+
// Hair color
|
|
9072
|
+
if (code === 'DAZ') {
|
|
9073
|
+
return HAIR_COLOR_CODES[value] || value;
|
|
9074
|
+
}
|
|
9075
|
+
// Height - format as feet and inches
|
|
9076
|
+
if (code === 'DAU') {
|
|
9077
|
+
// Format is typically "XXX in" or "FT IN"
|
|
9078
|
+
var match = value.match(/^(\d{3})/);
|
|
9079
|
+
if (match) {
|
|
9080
|
+
var inches = parseInt(match[1], 10);
|
|
9081
|
+
var feet = Math.floor(inches / 12);
|
|
9082
|
+
var remainingInches = inches % 12;
|
|
9083
|
+
return "".concat(feet, "'").concat(remainingInches, "\"");
|
|
9084
|
+
}
|
|
9085
|
+
return value;
|
|
9086
|
+
}
|
|
9087
|
+
// ZIP code - format with hyphen if 9 digits
|
|
9088
|
+
if (code === 'DAK' && value.length === 9) {
|
|
9089
|
+
return "".concat(value.substring(0, 5), "-").concat(value.substring(5));
|
|
9090
|
+
}
|
|
9091
|
+
return value.trim();
|
|
9092
|
+
}
|
|
9093
|
+
/**
|
|
9094
|
+
* Parses AAMVA PDF417 barcode data into structured fields
|
|
9095
|
+
*/
|
|
9096
|
+
function parseAAMVABarcode(rawData) {
|
|
9097
|
+
var result = {
|
|
9098
|
+
fields: [],
|
|
9099
|
+
rawData: rawData
|
|
9100
|
+
};
|
|
9101
|
+
// Clean up the data - remove control characters but keep newlines for parsing
|
|
9102
|
+
// AAMVA uses various separators: \n, \r, record separator (0x1E), etc.
|
|
9103
|
+
// eslint-disable-next-line no-control-regex
|
|
9104
|
+
var controlCharRegex = /[\x00-\x09\x0B\x0C\x0E-\x1F]/g;
|
|
9105
|
+
var cleanData = rawData.replace(controlCharRegex, '\n') // Replace control chars with newlines
|
|
9106
|
+
.replace(/\r\n/g, '\n').replace(/\r/g, '\n');
|
|
9107
|
+
// Split into lines
|
|
9108
|
+
var lines = cleanData.split('\n').filter(function (line) {
|
|
9109
|
+
return line.trim();
|
|
9110
|
+
});
|
|
9111
|
+
// Extract fields using regex - AAMVA fields are 3-letter codes followed by data
|
|
9112
|
+
var fieldRegex = /^([A-Z]{3})(.*)$/;
|
|
9113
|
+
for (var _i = 0, lines_1 = lines; _i < lines_1.length; _i++) {
|
|
9114
|
+
var line = lines_1[_i];
|
|
9115
|
+
var match = line.match(fieldRegex);
|
|
9116
|
+
if (match) {
|
|
9117
|
+
var code = match[1],
|
|
9118
|
+
rawValue = match[2];
|
|
9119
|
+
var value = rawValue.trim();
|
|
9120
|
+
// Skip empty values and header/version info
|
|
9121
|
+
if (!value || code === 'ANS') continue;
|
|
9122
|
+
var label = AAMVA_FIELD_LABELS[code] || code;
|
|
9123
|
+
var formattedValue = formatValue$1(code, value);
|
|
9124
|
+
result.fields.push({
|
|
9125
|
+
code: code,
|
|
9126
|
+
label: label,
|
|
9127
|
+
value: formattedValue
|
|
9128
|
+
});
|
|
9129
|
+
}
|
|
9130
|
+
}
|
|
9131
|
+
// Try to extract version and jurisdiction from header
|
|
9132
|
+
var headerMatch = rawData.match(/ANSI\s*(\d+)/);
|
|
9133
|
+
if (headerMatch) {
|
|
9134
|
+
result.jurisdictionId = headerMatch[1].substring(0, 6);
|
|
9135
|
+
}
|
|
9136
|
+
return result;
|
|
9137
|
+
}
|
|
8641
9138
|
|
|
8642
9139
|
var imageDisplayOrder = ['idCardFront', 'idCardBack', 'idBarcodeImage', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
9140
|
+
var downloadImage = function downloadImage(dataUrl, filename) {
|
|
9141
|
+
var link = document.createElement('a');
|
|
9142
|
+
link.href = dataUrl;
|
|
9143
|
+
link.download = filename;
|
|
9144
|
+
document.body.appendChild(link);
|
|
9145
|
+
link.click();
|
|
9146
|
+
document.body.removeChild(link);
|
|
9147
|
+
};
|
|
8643
9148
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
8644
9149
|
var capturedDocuments = _a.capturedDocuments,
|
|
8645
9150
|
onSubmitClick = _a.onSubmitClick,
|
|
@@ -8651,7 +9156,13 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
8651
9156
|
_d = _a.verbiage,
|
|
8652
9157
|
rawVerbiage = _d === void 0 ? {} : _d,
|
|
8653
9158
|
_e = _a.debugMode,
|
|
8654
|
-
debugMode = _e === void 0 ? false : _e
|
|
9159
|
+
debugMode = _e === void 0 ? false : _e,
|
|
9160
|
+
initialBarcodeScore = _a.initialBarcodeScore,
|
|
9161
|
+
recaptureBarcodeScore = _a.recaptureBarcodeScore,
|
|
9162
|
+
initialCaptureBarcodeImage = _a.initialCaptureBarcodeImage,
|
|
9163
|
+
recaptureBarcodeImage = _a.recaptureBarcodeImage,
|
|
9164
|
+
clientBarcodeDecodeResult = _a.clientBarcodeDecodeResult,
|
|
9165
|
+
nativeBarcodeDecodeResult = _a.nativeBarcodeDecodeResult;
|
|
8655
9166
|
var submissionStatus = React.useContext(SubmissionContext).submissionStatus;
|
|
8656
9167
|
var sessionCheckState = useAuthContext()[0].sessionCheckState;
|
|
8657
9168
|
var sessionReady = sessionCheckState === 'PASSED';
|
|
@@ -8663,12 +9174,50 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
8663
9174
|
(_a = submitButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
8664
9175
|
}
|
|
8665
9176
|
}, [sessionReady, submissionStatus]);
|
|
9177
|
+
if (debugMode) {
|
|
9178
|
+
log('[IdCaptureSuccess] Debug info:', {
|
|
9179
|
+
debugMode: debugMode,
|
|
9180
|
+
initialBarcodeScore: initialBarcodeScore,
|
|
9181
|
+
recaptureBarcodeScore: recaptureBarcodeScore,
|
|
9182
|
+
shouldShow: debugMode && initialBarcodeScore !== undefined,
|
|
9183
|
+
condition1: debugMode,
|
|
9184
|
+
condition2: initialBarcodeScore !== undefined
|
|
9185
|
+
});
|
|
9186
|
+
}
|
|
8666
9187
|
var verbiage = useTranslations(rawVerbiage, {
|
|
8667
9188
|
headingText: 'ID Capture Successful',
|
|
8668
9189
|
retryText: 'Retry',
|
|
8669
9190
|
submittingText: 'Submitting...',
|
|
8670
9191
|
submitText: 'Done'
|
|
8671
9192
|
});
|
|
9193
|
+
// Parse AAMVA barcode data if available (Dynamsoft/client-side)
|
|
9194
|
+
var parsedBarcodeData = React.useMemo(function () {
|
|
9195
|
+
if (!(clientBarcodeDecodeResult === null || clientBarcodeDecodeResult === void 0 ? void 0 : clientBarcodeDecodeResult.text)) return null;
|
|
9196
|
+
try {
|
|
9197
|
+
return parseAAMVABarcode(clientBarcodeDecodeResult.text);
|
|
9198
|
+
} catch (_a) {
|
|
9199
|
+
return null;
|
|
9200
|
+
}
|
|
9201
|
+
}, [clientBarcodeDecodeResult]);
|
|
9202
|
+
// Parse AAMVA barcode data from native decoder
|
|
9203
|
+
var parsedNativeBarcodeData = React.useMemo(function () {
|
|
9204
|
+
if (!(nativeBarcodeDecodeResult === null || nativeBarcodeDecodeResult === void 0 ? void 0 : nativeBarcodeDecodeResult.text)) return null;
|
|
9205
|
+
try {
|
|
9206
|
+
return parseAAMVABarcode(nativeBarcodeDecodeResult.text);
|
|
9207
|
+
} catch (_a) {
|
|
9208
|
+
return null;
|
|
9209
|
+
}
|
|
9210
|
+
}, [nativeBarcodeDecodeResult]);
|
|
9211
|
+
// Compare native vs Dynamsoft results
|
|
9212
|
+
var barcodeComparisonResult = React.useMemo(function () {
|
|
9213
|
+
if (!(clientBarcodeDecodeResult === null || clientBarcodeDecodeResult === void 0 ? void 0 : clientBarcodeDecodeResult.text) || !(nativeBarcodeDecodeResult === null || nativeBarcodeDecodeResult === void 0 ? void 0 : nativeBarcodeDecodeResult.text)) {
|
|
9214
|
+
return null;
|
|
9215
|
+
}
|
|
9216
|
+
var match = clientBarcodeDecodeResult.text === nativeBarcodeDecodeResult.text;
|
|
9217
|
+
return {
|
|
9218
|
+
match: match
|
|
9219
|
+
};
|
|
9220
|
+
}, [clientBarcodeDecodeResult, nativeBarcodeDecodeResult]);
|
|
8672
9221
|
return /*#__PURE__*/React__namespace.default.createElement(GrayOverlayContainer, {
|
|
8673
9222
|
className: classNames.container
|
|
8674
9223
|
}, /*#__PURE__*/React__namespace.default.createElement(OverlayInner$2, {
|
|
@@ -8682,6 +9231,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
8682
9231
|
}, /*#__PURE__*/React__namespace.default.createElement(ImageRow, {
|
|
8683
9232
|
className: classNames.imageRow
|
|
8684
9233
|
}, imageDisplayOrder.map(function (name) {
|
|
9234
|
+
var _a, _b, _c, _d, _e, _f;
|
|
8685
9235
|
var doc = capturedDocuments[name];
|
|
8686
9236
|
if (!doc) return null;
|
|
8687
9237
|
return /*#__PURE__*/React__namespace.default.createElement(ImageCol$1, {
|
|
@@ -8691,8 +9241,68 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
8691
9241
|
image: doc,
|
|
8692
9242
|
className: classNames.image,
|
|
8693
9243
|
alt: doc.documentType
|
|
8694
|
-
}), debugMode && (/*#__PURE__*/React__namespace.default.createElement(
|
|
8695
|
-
|
|
9244
|
+
}), debugMode && (/*#__PURE__*/React__namespace.default.createElement(DebugInfoContainer, null, name === 'idBarcodeImage' ? (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(DebugSection, null, /*#__PURE__*/React__namespace.default.createElement(DebugLabel, null, "Document Type:"), /*#__PURE__*/React__namespace.default.createElement(DebugValue, null, doc.documentType)), /*#__PURE__*/React__namespace.default.createElement(DebugSection, null, /*#__PURE__*/React__namespace.default.createElement(DebugLabel, null, "Readability Score:"), /*#__PURE__*/React__namespace.default.createElement(ScoreBadge, {
|
|
9245
|
+
"$score": (_a = doc.barcodeReadabilityScore) !== null && _a !== void 0 ? _a : 0,
|
|
9246
|
+
"$type": "readability"
|
|
9247
|
+
}, ((_b = doc.barcodeReadabilityScore) !== null && _b !== void 0 ? _b : 0).toFixed(3))), initialBarcodeScore !== undefined && (recaptureBarcodeScore !== null && recaptureBarcodeScore !== undefined ? (/*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonCard, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonHeader, null, "\uD83D\uDCCA Barcode Recapture Analysis"), /*#__PURE__*/React__namespace.default.createElement(ComparisonRow, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonLabel, null, "Initial Capture:"), /*#__PURE__*/React__namespace.default.createElement(ComparisonScoreBadge, null, initialBarcodeScore.toFixed(3))), /*#__PURE__*/React__namespace.default.createElement(ComparisonRow, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonLabel, null, "After Recapture:"), /*#__PURE__*/React__namespace.default.createElement(ComparisonScoreBadge, null, recaptureBarcodeScore.toFixed(3))), /*#__PURE__*/React__namespace.default.createElement(ComparisonDivider, null), /*#__PURE__*/React__namespace.default.createElement(ComparisonRow, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonLabel, null, "Improvement:"), /*#__PURE__*/React__namespace.default.createElement(ImprovementBadge, {
|
|
9248
|
+
"$improved": recaptureBarcodeScore > initialBarcodeScore
|
|
9249
|
+
}, recaptureBarcodeScore > initialBarcodeScore ? '↑' : '→', ' ', Math.abs(recaptureBarcodeScore - initialBarcodeScore).toFixed(3), ' ', "(", recaptureBarcodeScore > initialBarcodeScore ? 'Better' : 'Same/Worse', ")")), (initialCaptureBarcodeImage || recaptureBarcodeImage) && (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonDivider, null), /*#__PURE__*/React__namespace.default.createElement(ComparisonHeader, {
|
|
9250
|
+
style: {
|
|
9251
|
+
marginTop: '0.25rem'
|
|
9252
|
+
}
|
|
9253
|
+
}, "\uD83D\uDD0D Visual Comparison"), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImagesContainer, null, initialCaptureBarcodeImage && (/*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImageWrapper, null, /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImageLabel, null, "Initial Capture"), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImage, {
|
|
9254
|
+
src: initialCaptureBarcodeImage,
|
|
9255
|
+
alt: "Initial capture barcode",
|
|
9256
|
+
onDoubleClick: function onDoubleClick() {
|
|
9257
|
+
return downloadImage(initialCaptureBarcodeImage, "barcode-initial-".concat(initialBarcodeScore.toFixed(3), ".jpg"));
|
|
9258
|
+
},
|
|
9259
|
+
title: "Double-click to download"
|
|
9260
|
+
}), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonScoreLabel, {
|
|
9261
|
+
"$isHigher": initialBarcodeScore >= recaptureBarcodeScore
|
|
9262
|
+
}, initialBarcodeScore.toFixed(3)))), recaptureBarcodeImage && (/*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImageWrapper, null, /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImageLabel, null, "Recapture"), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImage, {
|
|
9263
|
+
src: recaptureBarcodeImage,
|
|
9264
|
+
alt: "Recapture barcode",
|
|
9265
|
+
onDoubleClick: function onDoubleClick() {
|
|
9266
|
+
return downloadImage(recaptureBarcodeImage, "barcode-recapture-".concat(recaptureBarcodeScore.toFixed(3), ".jpg"));
|
|
9267
|
+
},
|
|
9268
|
+
title: "Double-click to download"
|
|
9269
|
+
}), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonScoreLabel, {
|
|
9270
|
+
"$isHigher": recaptureBarcodeScore > initialBarcodeScore
|
|
9271
|
+
}, recaptureBarcodeScore.toFixed(3))))))))) : (/*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonCard, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonHeader, null, "\u26A0\uFE0F Recapture Attempted"), /*#__PURE__*/React__namespace.default.createElement(ComparisonRow, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonLabel, null, "Initial Score:"), /*#__PURE__*/React__namespace.default.createElement(ComparisonScoreBadge, null, initialBarcodeScore.toFixed(3))), /*#__PURE__*/React__namespace.default.createElement(ComparisonRow, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonLabel, null, "Recapture Result:"), /*#__PURE__*/React__namespace.default.createElement(ComparisonValue, null, "No barcode found")), initialCaptureBarcodeImage && (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ComparisonDivider, null), /*#__PURE__*/React__namespace.default.createElement(ComparisonHeader, {
|
|
9272
|
+
style: {
|
|
9273
|
+
marginTop: '0.25rem'
|
|
9274
|
+
}
|
|
9275
|
+
}, "\uD83D\uDD0D Barcode Image (kept)"), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImagesContainer, {
|
|
9276
|
+
style: {
|
|
9277
|
+
gridTemplateColumns: '1fr'
|
|
9278
|
+
}
|
|
9279
|
+
}, /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImageWrapper, null, /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImageLabel, null, "Initial Capture"), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonImage, {
|
|
9280
|
+
src: initialCaptureBarcodeImage,
|
|
9281
|
+
alt: "Initial capture barcode",
|
|
9282
|
+
onDoubleClick: function onDoubleClick() {
|
|
9283
|
+
return downloadImage(initialCaptureBarcodeImage, "barcode-initial-".concat(initialBarcodeScore.toFixed(3), ".jpg"));
|
|
9284
|
+
},
|
|
9285
|
+
title: "Double-click to download"
|
|
9286
|
+
}), /*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonScoreLabel, {
|
|
9287
|
+
"$isHigher": true
|
|
9288
|
+
}, initialBarcodeScore.toFixed(3))))))))))) : (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(DebugSection, null, /*#__PURE__*/React__namespace.default.createElement(DebugLabel, null, "Document Type:"), /*#__PURE__*/React__namespace.default.createElement(DebugValue, null, doc.documentType)), /*#__PURE__*/React__namespace.default.createElement(DebugSection, null, /*#__PURE__*/React__namespace.default.createElement(DebugLabel, null, "Detection Score:"), /*#__PURE__*/React__namespace.default.createElement(ScoreBadge, {
|
|
9289
|
+
"$score": (_c = doc.detectionScore) !== null && _c !== void 0 ? _c : 0,
|
|
9290
|
+
"$type": "detection"
|
|
9291
|
+
}, ((_d = doc.detectionScore) !== null && _d !== void 0 ? _d : 0).toFixed(3))), /*#__PURE__*/React__namespace.default.createElement(DebugSection, null, /*#__PURE__*/React__namespace.default.createElement(DebugLabel, null, "Focus Score:"), /*#__PURE__*/React__namespace.default.createElement(ScoreBadge, {
|
|
9292
|
+
"$score": (_e = doc.focusScore) !== null && _e !== void 0 ? _e : 0,
|
|
9293
|
+
"$type": "focus"
|
|
9294
|
+
}, ((_f = doc.focusScore) !== null && _f !== void 0 ? _f : 0).toFixed(3))), /*#__PURE__*/React__namespace.default.createElement(DebugSection, null, /*#__PURE__*/React__namespace.default.createElement(DebugLabel, null, "Bounding Box:"), /*#__PURE__*/React__namespace.default.createElement(DebugValue, null, JSON.stringify(doc.boundingBox, null, 2))))))));
|
|
9295
|
+
}), (clientBarcodeDecodeResult || nativeBarcodeDecodeResult || !capturedDocuments.idBarcodeImage) && (/*#__PURE__*/React__namespace.default.createElement(BarcodeResultsSection, null, !capturedDocuments.idBarcodeImage && (/*#__PURE__*/React__namespace.default.createElement(NoPDF417Warning, null, "\u26A0\uFE0F No PDF417 barcode detected during capture")), clientBarcodeDecodeResult && (/*#__PURE__*/React__namespace.default.createElement(ClientBarcodeResultCard, null, /*#__PURE__*/React__namespace.default.createElement(ClientBarcodeHeader, null, "\u2705 Dynamsoft (", clientBarcodeDecodeResult.format, ")"), parsedBarcodeData && parsedBarcodeData.fields.length > 0 ? (/*#__PURE__*/React__namespace.default.createElement(ClientBarcodeFieldsTable, null, /*#__PURE__*/React__namespace.default.createElement("tbody", null, parsedBarcodeData.fields.map(function (field) {
|
|
9296
|
+
return /*#__PURE__*/React__namespace.default.createElement(ClientBarcodeFieldTableRow, {
|
|
9297
|
+
key: field.code
|
|
9298
|
+
}, /*#__PURE__*/React__namespace.default.createElement(ClientBarcodeFieldLabelCell, null, field.label), /*#__PURE__*/React__namespace.default.createElement(ClientBarcodeFieldValueCell, null, field.value));
|
|
9299
|
+
})))) : (/*#__PURE__*/React__namespace.default.createElement(ClientBarcodeRow, null, /*#__PURE__*/React__namespace.default.createElement(ClientBarcodeLabel, null, "Raw Data:"), /*#__PURE__*/React__namespace.default.createElement(ClientBarcodeData, null, clientBarcodeDecodeResult.text))))), barcodeComparisonResult && (/*#__PURE__*/React__namespace.default.createElement(BarcodeComparisonBadge, {
|
|
9300
|
+
"$match": barcodeComparisonResult.match
|
|
9301
|
+
}, barcodeComparisonResult.match ? (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u2705 Results Match")) : (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, "\u26A0\uFE0F Results Differ")))), nativeBarcodeDecodeResult && (/*#__PURE__*/React__namespace.default.createElement(NativeBarcodeResultCard, null, /*#__PURE__*/React__namespace.default.createElement(NativeBarcodeHeader, null, "\uD83D\uDD0D Native Decode (", nativeBarcodeDecodeResult.method === 'native' ? 'BarcodeDetector API' : 'zxing-js', ")"), parsedNativeBarcodeData && parsedNativeBarcodeData.fields.length > 0 ? (/*#__PURE__*/React__namespace.default.createElement(NativeBarcodeFieldsTable, null, /*#__PURE__*/React__namespace.default.createElement("tbody", null, parsedNativeBarcodeData.fields.map(function (field) {
|
|
9302
|
+
return /*#__PURE__*/React__namespace.default.createElement(NativeBarcodeFieldTableRow, {
|
|
9303
|
+
key: field.code
|
|
9304
|
+
}, /*#__PURE__*/React__namespace.default.createElement(NativeBarcodeFieldLabelCell, null, field.label), /*#__PURE__*/React__namespace.default.createElement(NativeBarcodeFieldValueCell, null, field.value));
|
|
9305
|
+
})))) : (/*#__PURE__*/React__namespace.default.createElement(NativeBarcodeRow, null, /*#__PURE__*/React__namespace.default.createElement(NativeBarcodeLabel, null, "Raw Data:"), /*#__PURE__*/React__namespace.default.createElement(NativeBarcodeData, null, nativeBarcodeDecodeResult.text))))))))), /*#__PURE__*/React__namespace.default.createElement(ButtonsColumn, {
|
|
8696
9306
|
className: classNames.buttonsRow
|
|
8697
9307
|
}, /*#__PURE__*/React__namespace.default.createElement(WideButton, {
|
|
8698
9308
|
ref: submitButtonRef,
|
|
@@ -8710,13 +9320,138 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
8710
9320
|
finished: true
|
|
8711
9321
|
}, verbiage.retryText)))));
|
|
8712
9322
|
};
|
|
8713
|
-
var Heading$a = styled__default.default.h1(templateObject_1$
|
|
8714
|
-
var ImagesContainer = styled__default.default(OverlayImageContainer)(templateObject_2$
|
|
8715
|
-
var ImageRow = styled__default.default(OverlayImageRow)(templateObject_3$
|
|
8716
|
-
var ImageCol$1 = styled__default.default.div(templateObject_4$
|
|
8717
|
-
var StyledImage = styled__default.default(CapturedDocumentImg)(templateObject_5$
|
|
8718
|
-
var
|
|
8719
|
-
var
|
|
9323
|
+
var Heading$a = styled__default.default.h1(templateObject_1$F || (templateObject_1$F = __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"])));
|
|
9324
|
+
var ImagesContainer = styled__default.default(OverlayImageContainer)(templateObject_2$B || (templateObject_2$B = __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"])));
|
|
9325
|
+
var ImageRow = styled__default.default(OverlayImageRow)(templateObject_3$r || (templateObject_3$r = __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"])));
|
|
9326
|
+
var ImageCol$1 = styled__default.default.div(templateObject_4$l || (templateObject_4$l = __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"])));
|
|
9327
|
+
var StyledImage = styled__default.default(CapturedDocumentImg)(templateObject_5$g || (templateObject_5$g = __makeTemplateObject(["\n width: 100%;\n border-radius: 12px;\n"], ["\n width: 100%;\n border-radius: 12px;\n"])));
|
|
9328
|
+
var DebugInfoContainer = styled__default.default.div(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n margin-top: 0.5rem;\n margin-bottom: 1rem;\n padding: 0.625rem;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8125rem;\n line-height: 1.35;\n text-align: left;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n margin-top: 0.5rem;\n margin-bottom: 1rem;\n padding: 0.625rem;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8125rem;\n line-height: 1.35;\n text-align: left;\n"])));
|
|
9329
|
+
var DebugSection = styled__default.default.div(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin: 0;\n"], ["\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin: 0;\n"])));
|
|
9330
|
+
var DebugLabel = styled__default.default.span(templateObject_8$5 || (templateObject_8$5 = __makeTemplateObject(["\n font-weight: 600;\n color: #495057;\n font-size: 0.8125rem;\n flex-shrink: 0;\n width: 110px;\n"], ["\n font-weight: 600;\n color: #495057;\n font-size: 0.8125rem;\n flex-shrink: 0;\n width: 110px;\n"])));
|
|
9331
|
+
var DebugValue = styled__default.default.span(templateObject_9$4 || (templateObject_9$4 = __makeTemplateObject(["\n color: #212529;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8125rem;\n"], ["\n color: #212529;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8125rem;\n"])));
|
|
9332
|
+
var ScoreBadge = styled__default.default.span(templateObject_10$3 || (templateObject_10$3 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n padding: 0.1875rem 0.5rem;\n border-radius: 4px;\n font-weight: 600;\n font-size: 0.75rem;\n background: ", ";\n color: ", ";\n border: 1px solid\n ", ";\n"], ["\n display: inline-flex;\n align-items: center;\n padding: 0.1875rem 0.5rem;\n border-radius: 4px;\n font-weight: 600;\n font-size: 0.75rem;\n background: ", ";\n color: ", ";\n border: 1px solid\n ", ";\n"])), function (_a) {
|
|
9333
|
+
var $score = _a.$score,
|
|
9334
|
+
$type = _a.$type;
|
|
9335
|
+
var thresholds = $type === 'readability' ? {
|
|
9336
|
+
good: 0.5,
|
|
9337
|
+
medium: 0.2
|
|
9338
|
+
} : $type === 'detection' ? {
|
|
9339
|
+
good: 0.7,
|
|
9340
|
+
medium: 0.4
|
|
9341
|
+
} : {
|
|
9342
|
+
good: 0.7,
|
|
9343
|
+
medium: 0.4
|
|
9344
|
+
};
|
|
9345
|
+
if ($score >= thresholds.good) return '#d4edda';
|
|
9346
|
+
if ($score >= thresholds.medium) return '#fff3cd';
|
|
9347
|
+
return '#f8d7da';
|
|
9348
|
+
}, function (_a) {
|
|
9349
|
+
var $score = _a.$score,
|
|
9350
|
+
$type = _a.$type;
|
|
9351
|
+
var thresholds = $type === 'readability' ? {
|
|
9352
|
+
good: 0.5,
|
|
9353
|
+
medium: 0.2
|
|
9354
|
+
} : $type === 'detection' ? {
|
|
9355
|
+
good: 0.7,
|
|
9356
|
+
medium: 0.4
|
|
9357
|
+
} : {
|
|
9358
|
+
good: 0.7,
|
|
9359
|
+
medium: 0.4
|
|
9360
|
+
};
|
|
9361
|
+
if ($score >= thresholds.good) return '#155724';
|
|
9362
|
+
if ($score >= thresholds.medium) return '#856404';
|
|
9363
|
+
return '#721c24';
|
|
9364
|
+
}, function (_a) {
|
|
9365
|
+
var $score = _a.$score,
|
|
9366
|
+
$type = _a.$type;
|
|
9367
|
+
var thresholds = $type === 'readability' ? {
|
|
9368
|
+
good: 0.5,
|
|
9369
|
+
medium: 0.2
|
|
9370
|
+
} : $type === 'detection' ? {
|
|
9371
|
+
good: 0.7,
|
|
9372
|
+
medium: 0.4
|
|
9373
|
+
} : {
|
|
9374
|
+
good: 0.7,
|
|
9375
|
+
medium: 0.4
|
|
9376
|
+
};
|
|
9377
|
+
if ($score >= thresholds.good) return '#c3e6cb';
|
|
9378
|
+
if ($score >= thresholds.medium) return '#ffeaa7';
|
|
9379
|
+
return '#f5c6cb';
|
|
9380
|
+
});
|
|
9381
|
+
var BarcodeComparisonCard = styled__default.default.div(templateObject_11$3 || (templateObject_11$3 = __makeTemplateObject(["\n margin-top: 0.375rem;\n padding: 0.625rem;\n background: #e7f3ff;\n border-radius: 6px;\n border: 1px solid #b3d9ff;\n"], ["\n margin-top: 0.375rem;\n padding: 0.625rem;\n background: #e7f3ff;\n border-radius: 6px;\n border: 1px solid #b3d9ff;\n"])));
|
|
9382
|
+
var ComparisonHeader = styled__default.default.div(templateObject_12$3 || (templateObject_12$3 = __makeTemplateObject(["\n font-size: 0.8125rem;\n font-weight: 700;\n margin-bottom: 0.375rem;\n display: flex;\n align-items: center;\n gap: 0.375rem;\n color: #004085;\n"], ["\n font-size: 0.8125rem;\n font-weight: 700;\n margin-bottom: 0.375rem;\n display: flex;\n align-items: center;\n gap: 0.375rem;\n color: #004085;\n"])));
|
|
9383
|
+
var ComparisonRow = styled__default.default.div(templateObject_13$3 || (templateObject_13$3 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 0.25rem;\n gap: 0.75rem;\n font-size: 0.8125rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 0.25rem;\n gap: 0.75rem;\n font-size: 0.8125rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
|
|
9384
|
+
var ComparisonLabel = styled__default.default.span(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n font-weight: 500;\n color: #495057;\n"], ["\n font-weight: 500;\n color: #495057;\n"])));
|
|
9385
|
+
var ComparisonValue = styled__default.default.span(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n font-weight: 600;\n color: #212529;\n"], ["\n font-weight: 600;\n color: #212529;\n"])));
|
|
9386
|
+
var ComparisonDivider = styled__default.default.hr(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n border: none;\n border-top: 1px solid #b3d9ff;\n margin: 0.375rem 0;\n"], ["\n border: none;\n border-top: 1px solid #b3d9ff;\n margin: 0.375rem 0;\n"])));
|
|
9387
|
+
var ComparisonScoreBadge = styled__default.default.span(templateObject_17$1 || (templateObject_17$1 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n padding: 0.1875rem 0.5rem;\n border-radius: 4px;\n font-weight: 600;\n font-size: 0.75rem;\n background: white;\n color: #212529;\n border: 1px solid #dee2e6;\n"], ["\n display: inline-flex;\n align-items: center;\n padding: 0.1875rem 0.5rem;\n border-radius: 4px;\n font-weight: 600;\n font-size: 0.75rem;\n background: white;\n color: #212529;\n border: 1px solid #dee2e6;\n"])));
|
|
9388
|
+
var ImprovementBadge = styled__default.default.span(templateObject_18$1 || (templateObject_18$1 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n padding: 0.1875rem 0.5rem;\n border-radius: 4px;\n font-weight: 600;\n font-size: 0.75rem;\n background: ", ";\n color: ", ";\n border: 1px solid ", ";\n"], ["\n display: inline-flex;\n align-items: center;\n padding: 0.1875rem 0.5rem;\n border-radius: 4px;\n font-weight: 600;\n font-size: 0.75rem;\n background: ", ";\n color: ", ";\n border: 1px solid ", ";\n"])), function (_a) {
|
|
9389
|
+
var $improved = _a.$improved;
|
|
9390
|
+
return $improved ? '#d4edda' : '#e2e3e5';
|
|
9391
|
+
}, function (_a) {
|
|
9392
|
+
var $improved = _a.$improved;
|
|
9393
|
+
return $improved ? '#155724' : '#383d41';
|
|
9394
|
+
}, function (_a) {
|
|
9395
|
+
var $improved = _a.$improved;
|
|
9396
|
+
return $improved ? '#c3e6cb' : '#d6d8db';
|
|
9397
|
+
});
|
|
9398
|
+
var BarcodeComparisonImagesContainer = styled__default.default.div(templateObject_19$1 || (templateObject_19$1 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1rem;\n margin-top: 0.75rem;\n padding: 0.5rem;\n background: rgba(255, 255, 255, 0.5);\n border-radius: 6px;\n"], ["\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1rem;\n margin-top: 0.75rem;\n padding: 0.5rem;\n background: rgba(255, 255, 255, 0.5);\n border-radius: 6px;\n"])));
|
|
9399
|
+
var BarcodeComparisonImageWrapper = styled__default.default.div(templateObject_20$1 || (templateObject_20$1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 0.375rem;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 0.375rem;\n"])));
|
|
9400
|
+
var BarcodeComparisonImageLabel = styled__default.default.span(templateObject_21$1 || (templateObject_21$1 = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 700;\n color: #004085;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n padding: 0.25rem 0.5rem;\n background: white;\n border-radius: 4px;\n border: 1px solid #b3d9ff;\n"], ["\n font-size: 0.75rem;\n font-weight: 700;\n color: #004085;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n padding: 0.25rem 0.5rem;\n background: white;\n border-radius: 4px;\n border: 1px solid #b3d9ff;\n"])));
|
|
9401
|
+
var BarcodeComparisonImage = styled__default.default.img(templateObject_22$1 || (templateObject_22$1 = __makeTemplateObject(["\n width: 100%;\n height: auto;\n border-radius: 6px;\n border: 2px solid #dee2e6;\n background: white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n cursor: pointer;\n transition:\n transform 0.15s ease,\n box-shadow 0.15s ease;\n\n &:hover {\n transform: scale(1.02);\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);\n }\n\n &:active {\n transform: scale(0.98);\n }\n"], ["\n width: 100%;\n height: auto;\n border-radius: 6px;\n border: 2px solid #dee2e6;\n background: white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n cursor: pointer;\n transition:\n transform 0.15s ease,\n box-shadow 0.15s ease;\n\n &:hover {\n transform: scale(1.02);\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);\n }\n\n &:active {\n transform: scale(0.98);\n }\n"])));
|
|
9402
|
+
var BarcodeComparisonScoreLabel = styled__default.default.span(templateObject_23$1 || (templateObject_23$1 = __makeTemplateObject(["\n font-size: 0.8125rem;\n font-weight: 700;\n color: ", ";\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n padding: 0.25rem 0.5rem;\n background: ", ";\n border-radius: 4px;\n border: 1px solid ", ";\n"], ["\n font-size: 0.8125rem;\n font-weight: 700;\n color: ", ";\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n padding: 0.25rem 0.5rem;\n background: ", ";\n border-radius: 4px;\n border: 1px solid ", ";\n"])), function (_a) {
|
|
9403
|
+
var $isHigher = _a.$isHigher;
|
|
9404
|
+
return $isHigher ? '#155724' : '#495057';
|
|
9405
|
+
}, function (_a) {
|
|
9406
|
+
var $isHigher = _a.$isHigher;
|
|
9407
|
+
return $isHigher ? '#d4edda' : 'white';
|
|
9408
|
+
}, function (_a) {
|
|
9409
|
+
var $isHigher = _a.$isHigher;
|
|
9410
|
+
return $isHigher ? '#c3e6cb' : '#dee2e6';
|
|
9411
|
+
});
|
|
9412
|
+
var ClientBarcodeResultCard = styled__default.default.div(templateObject_24$1 || (templateObject_24$1 = __makeTemplateObject(["\n margin-top: 0.75rem;\n margin-bottom: 1rem;\n padding: 0.75rem;\n background: #d4edda;\n border-radius: 8px;\n border: 1px solid #c3e6cb;\n text-align: left;\n"], ["\n margin-top: 0.75rem;\n margin-bottom: 1rem;\n padding: 0.75rem;\n background: #d4edda;\n border-radius: 8px;\n border: 1px solid #c3e6cb;\n text-align: left;\n"])));
|
|
9413
|
+
var ClientBarcodeHeader = styled__default.default.div(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 700;\n margin-bottom: 0.5rem;\n color: #155724;\n"], ["\n font-size: 0.875rem;\n font-weight: 700;\n margin-bottom: 0.5rem;\n color: #155724;\n"])));
|
|
9414
|
+
var ClientBarcodeRow = styled__default.default.div(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin-bottom: 0.375rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n flex-direction: column;\n margin-bottom: 0.375rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
|
|
9415
|
+
var ClientBarcodeLabel = styled__default.default.span(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 600;\n color: #155724;\n margin-bottom: 0.125rem;\n"], ["\n font-size: 0.75rem;\n font-weight: 600;\n color: #155724;\n margin-bottom: 0.125rem;\n"])));
|
|
9416
|
+
var ClientBarcodeData = styled__default.default.pre(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n font-size: 0.6875rem;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n color: #155724;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n margin: 0;\n white-space: pre-wrap;\n word-break: break-all;\n max-height: 150px;\n overflow-y: auto;\n"], ["\n font-size: 0.6875rem;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n color: #155724;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n margin: 0;\n white-space: pre-wrap;\n word-break: break-all;\n max-height: 150px;\n overflow-y: auto;\n"])));
|
|
9417
|
+
var ClientBarcodeFieldsTable = styled__default.default.table(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n width: 100%;\n max-height: 300px;\n overflow-y: auto;\n display: block;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n border-collapse: collapse;\n\n tbody {\n display: table;\n width: 100%;\n }\n"], ["\n width: 100%;\n max-height: 300px;\n overflow-y: auto;\n display: block;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n border-collapse: collapse;\n\n tbody {\n display: table;\n width: 100%;\n }\n"])));
|
|
9418
|
+
var ClientBarcodeFieldTableRow = styled__default.default.tr(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n border-bottom: 1px solid rgba(21, 87, 36, 0.1);\n\n &:last-child {\n border-bottom: none;\n }\n\n @media (max-width: 480px) {\n display: flex;\n flex-direction: column;\n padding: 0.375rem 0;\n }\n"], ["\n border-bottom: 1px solid rgba(21, 87, 36, 0.1);\n\n &:last-child {\n border-bottom: none;\n }\n\n @media (max-width: 480px) {\n display: flex;\n flex-direction: column;\n padding: 0.375rem 0;\n }\n"])));
|
|
9419
|
+
var ClientBarcodeFieldLabelCell = styled__default.default.td(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 600;\n color: #155724;\n padding: 0.375rem 0.75rem 0.375rem 0;\n white-space: nowrap;\n vertical-align: top;\n\n @media (max-width: 480px) {\n padding: 0 0 0.125rem 0;\n white-space: normal;\n }\n"], ["\n font-size: 0.75rem;\n font-weight: 600;\n color: #155724;\n padding: 0.375rem 0.75rem 0.375rem 0;\n white-space: nowrap;\n vertical-align: top;\n\n @media (max-width: 480px) {\n padding: 0 0 0.125rem 0;\n white-space: normal;\n }\n"])));
|
|
9420
|
+
var ClientBarcodeFieldValueCell = styled__default.default.td(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n font-size: 0.75rem;\n color: #155724;\n padding: 0.375rem 0;\n word-break: break-word;\n\n @media (max-width: 480px) {\n padding: 0;\n }\n"], ["\n font-size: 0.75rem;\n color: #155724;\n padding: 0.375rem 0;\n word-break: break-word;\n\n @media (max-width: 480px) {\n padding: 0;\n }\n"
|
|
9421
|
+
// Native barcode result styles (blue theme for comparison)
|
|
9422
|
+
])));
|
|
9423
|
+
// Native barcode result styles (blue theme for comparison)
|
|
9424
|
+
var NativeBarcodeResultCard = styled__default.default.div(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n margin-top: 0.75rem;\n margin-bottom: 1rem;\n padding: 0.75rem;\n background: #cce5ff;\n border-radius: 8px;\n border: 1px solid #b8daff;\n text-align: left;\n"], ["\n margin-top: 0.75rem;\n margin-bottom: 1rem;\n padding: 0.75rem;\n background: #cce5ff;\n border-radius: 8px;\n border: 1px solid #b8daff;\n text-align: left;\n"])));
|
|
9425
|
+
var NativeBarcodeHeader = styled__default.default.div(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 700;\n margin-bottom: 0.5rem;\n color: #004085;\n"], ["\n font-size: 0.875rem;\n font-weight: 700;\n margin-bottom: 0.5rem;\n color: #004085;\n"])));
|
|
9426
|
+
var NativeBarcodeRow = styled__default.default.div(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin-bottom: 0.375rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n flex-direction: column;\n margin-bottom: 0.375rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
|
|
9427
|
+
var NativeBarcodeLabel = styled__default.default.span(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 600;\n color: #004085;\n margin-bottom: 0.125rem;\n"], ["\n font-size: 0.75rem;\n font-weight: 600;\n color: #004085;\n margin-bottom: 0.125rem;\n"])));
|
|
9428
|
+
var NativeBarcodeData = styled__default.default.pre(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n font-size: 0.6875rem;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n color: #004085;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n margin: 0;\n white-space: pre-wrap;\n word-break: break-all;\n max-height: 150px;\n overflow-y: auto;\n"], ["\n font-size: 0.6875rem;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n color: #004085;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n margin: 0;\n white-space: pre-wrap;\n word-break: break-all;\n max-height: 150px;\n overflow-y: auto;\n"])));
|
|
9429
|
+
var NativeBarcodeFieldsTable = styled__default.default.table(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n width: 100%;\n max-height: 300px;\n overflow-y: auto;\n display: block;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n border-collapse: collapse;\n\n tbody {\n display: table;\n width: 100%;\n }\n"], ["\n width: 100%;\n max-height: 300px;\n overflow-y: auto;\n display: block;\n background: rgba(255, 255, 255, 0.5);\n padding: 0.5rem;\n border-radius: 4px;\n border-collapse: collapse;\n\n tbody {\n display: table;\n width: 100%;\n }\n"])));
|
|
9430
|
+
var NativeBarcodeFieldTableRow = styled__default.default.tr(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n border-bottom: 1px solid rgba(0, 64, 133, 0.1);\n\n &:last-child {\n border-bottom: none;\n }\n\n @media (max-width: 480px) {\n display: flex;\n flex-direction: column;\n padding: 0.375rem 0;\n }\n"], ["\n border-bottom: 1px solid rgba(0, 64, 133, 0.1);\n\n &:last-child {\n border-bottom: none;\n }\n\n @media (max-width: 480px) {\n display: flex;\n flex-direction: column;\n padding: 0.375rem 0;\n }\n"])));
|
|
9431
|
+
var NativeBarcodeFieldLabelCell = styled__default.default.td(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 600;\n color: #004085;\n padding: 0.375rem 0.75rem 0.375rem 0;\n white-space: nowrap;\n vertical-align: top;\n\n @media (max-width: 480px) {\n padding: 0 0 0.125rem 0;\n white-space: normal;\n }\n"], ["\n font-size: 0.75rem;\n font-weight: 600;\n color: #004085;\n padding: 0.375rem 0.75rem 0.375rem 0;\n white-space: nowrap;\n vertical-align: top;\n\n @media (max-width: 480px) {\n padding: 0 0 0.125rem 0;\n white-space: normal;\n }\n"])));
|
|
9432
|
+
var NativeBarcodeFieldValueCell = styled__default.default.td(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n font-size: 0.75rem;\n color: #004085;\n padding: 0.375rem 0;\n word-break: break-word;\n\n @media (max-width: 480px) {\n padding: 0;\n }\n"], ["\n font-size: 0.75rem;\n color: #004085;\n padding: 0.375rem 0;\n word-break: break-word;\n\n @media (max-width: 480px) {\n padding: 0;\n }\n"
|
|
9433
|
+
// Comparison badge showing whether native and Dynamsoft results match
|
|
9434
|
+
])));
|
|
9435
|
+
// Comparison badge showing whether native and Dynamsoft results match
|
|
9436
|
+
var BarcodeComparisonBadge = styled__default.default.div(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n margin: 0.5rem 0;\n padding: 0.625rem 1rem;\n border-radius: 8px;\n font-size: 0.875rem;\n font-weight: 700;\n background: ", ";\n color: ", ";\n border: 2px solid ", ";\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n margin: 0.5rem 0;\n padding: 0.625rem 1rem;\n border-radius: 8px;\n font-size: 0.875rem;\n font-weight: 700;\n background: ", ";\n color: ", ";\n border: 2px solid ", ";\n"
|
|
9437
|
+
// Container for barcode decode results section
|
|
9438
|
+
])), function (_a) {
|
|
9439
|
+
var $match = _a.$match;
|
|
9440
|
+
return $match ? '#d4edda' : '#fff3cd';
|
|
9441
|
+
}, function (_a) {
|
|
9442
|
+
var $match = _a.$match;
|
|
9443
|
+
return $match ? '#155724' : '#856404';
|
|
9444
|
+
}, function (_a) {
|
|
9445
|
+
var $match = _a.$match;
|
|
9446
|
+
return $match ? '#28a745' : '#ffc107';
|
|
9447
|
+
});
|
|
9448
|
+
// Container for barcode decode results section
|
|
9449
|
+
var BarcodeResultsSection = styled__default.default.div(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n width: 450px;\n max-width: 100%;\n margin-top: 1rem;\n flex-shrink: 0;\n"], ["\n width: 450px;\n max-width: 100%;\n margin-top: 1rem;\n flex-shrink: 0;\n"
|
|
9450
|
+
// Warning shown when no PDF417 barcode was detected
|
|
9451
|
+
])));
|
|
9452
|
+
// Warning shown when no PDF417 barcode was detected
|
|
9453
|
+
var NoPDF417Warning = styled__default.default.div(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n margin-bottom: 0.75rem;\n padding: 0.75rem 1rem;\n border-radius: 8px;\n font-size: 0.875rem;\n font-weight: 600;\n background: #fff3cd;\n color: #856404;\n border: 1px solid #ffc107;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n margin-bottom: 0.75rem;\n padding: 0.75rem 1rem;\n border-radius: 8px;\n font-size: 0.875rem;\n font-weight: 600;\n background: #fff3cd;\n color: #856404;\n border: 1px solid #ffc107;\n"])));
|
|
9454
|
+
var templateObject_1$F, templateObject_2$B, templateObject_3$r, templateObject_4$l, templateObject_5$g, templateObject_6$a, templateObject_7$6, templateObject_8$5, templateObject_9$4, templateObject_10$3, templateObject_11$3, templateObject_12$3, templateObject_13$3, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19$1, templateObject_20$1, templateObject_21$1, templateObject_22$1, templateObject_23$1, templateObject_24$1, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44;
|
|
8720
9455
|
|
|
8721
9456
|
function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallback) {
|
|
8722
9457
|
var _this = this;
|
|
@@ -8751,44 +9486,420 @@ function useShowSuccessScreen(skipSuccessScreen, successScreenReady, onDoneCallb
|
|
|
8751
9486
|
return !skipSuccessScreen || skipSuccessScreenResolvedFalse;
|
|
8752
9487
|
}
|
|
8753
9488
|
|
|
8754
|
-
|
|
8755
|
-
|
|
8756
|
-
|
|
8757
|
-
|
|
8758
|
-
|
|
8759
|
-
|
|
8760
|
-
|
|
8761
|
-
|
|
8762
|
-
|
|
9489
|
+
/**
|
|
9490
|
+
* Native barcode decoder that tries browser BarcodeDetector API first,
|
|
9491
|
+
* then falls back to zxing-js for broader compatibility.
|
|
9492
|
+
*
|
|
9493
|
+
* This provides a free alternative to Dynamsoft for PDF417 barcode scanning.
|
|
9494
|
+
*/
|
|
9495
|
+
// CDN URL for zxing-js library
|
|
9496
|
+
var ZXING_CDN_URL = 'https://unpkg.com/@zxing/library@latest';
|
|
9497
|
+
var zxingLoadPromise = null;
|
|
9498
|
+
var zxingInstance = null;
|
|
9499
|
+
var nativeSupportChecked = false;
|
|
9500
|
+
var nativeSupportsFormat = false;
|
|
9501
|
+
/**
|
|
9502
|
+
* Check if the native BarcodeDetector API is available
|
|
9503
|
+
*/
|
|
9504
|
+
function isNativeBarcodeDetectorAvailable() {
|
|
9505
|
+
return typeof window !== 'undefined' && 'BarcodeDetector' in window;
|
|
8763
9506
|
}
|
|
8764
|
-
|
|
8765
|
-
|
|
8766
|
-
|
|
8767
|
-
|
|
8768
|
-
|
|
9507
|
+
/**
|
|
9508
|
+
* Check if the native BarcodeDetector supports PDF417 format
|
|
9509
|
+
*/
|
|
9510
|
+
function checkNativePDF417Support() {
|
|
9511
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
9512
|
+
var formats, error_1;
|
|
9513
|
+
return __generator(this, function (_a) {
|
|
9514
|
+
switch (_a.label) {
|
|
9515
|
+
case 0:
|
|
9516
|
+
if (nativeSupportChecked) {
|
|
9517
|
+
return [2 /*return*/, nativeSupportsFormat];
|
|
9518
|
+
}
|
|
9519
|
+
if (!isNativeBarcodeDetectorAvailable()) {
|
|
9520
|
+
nativeSupportChecked = true;
|
|
9521
|
+
nativeSupportsFormat = false;
|
|
9522
|
+
return [2 /*return*/, false];
|
|
9523
|
+
}
|
|
9524
|
+
_a.label = 1;
|
|
9525
|
+
case 1:
|
|
9526
|
+
_a.trys.push([1, 3,, 4]);
|
|
9527
|
+
return [4 /*yield*/, window.BarcodeDetector.getSupportedFormats()];
|
|
9528
|
+
case 2:
|
|
9529
|
+
formats = _a.sent();
|
|
9530
|
+
nativeSupportsFormat = formats.includes('pdf417');
|
|
9531
|
+
nativeSupportChecked = true;
|
|
9532
|
+
log('[NativeBarcodeDecoder] Native BarcodeDetector formats:', formats);
|
|
9533
|
+
log('[NativeBarcodeDecoder] PDF417 supported:', nativeSupportsFormat);
|
|
9534
|
+
return [2 /*return*/, nativeSupportsFormat];
|
|
9535
|
+
case 3:
|
|
9536
|
+
error_1 = _a.sent();
|
|
9537
|
+
warn('[NativeBarcodeDecoder] Error checking native format support:', error_1);
|
|
9538
|
+
nativeSupportChecked = true;
|
|
9539
|
+
nativeSupportsFormat = false;
|
|
9540
|
+
return [2 /*return*/, false];
|
|
9541
|
+
case 4:
|
|
9542
|
+
return [2 /*return*/];
|
|
9543
|
+
}
|
|
9544
|
+
});
|
|
9545
|
+
});
|
|
8769
9546
|
}
|
|
8770
|
-
|
|
8771
|
-
|
|
8772
|
-
|
|
8773
|
-
|
|
8774
|
-
return
|
|
8775
|
-
|
|
8776
|
-
|
|
8777
|
-
|
|
8778
|
-
}
|
|
8779
|
-
|
|
8780
|
-
|
|
8781
|
-
|
|
8782
|
-
|
|
8783
|
-
|
|
8784
|
-
|
|
8785
|
-
|
|
8786
|
-
|
|
8787
|
-
|
|
8788
|
-
|
|
8789
|
-
|
|
8790
|
-
|
|
8791
|
-
|
|
9547
|
+
/**
|
|
9548
|
+
* Load a script from URL
|
|
9549
|
+
*/
|
|
9550
|
+
function loadScript$1(url) {
|
|
9551
|
+
return new Promise(function (resolve, reject) {
|
|
9552
|
+
if (document.querySelector("script[src=\"".concat(url, "\"]"))) {
|
|
9553
|
+
resolve();
|
|
9554
|
+
return;
|
|
9555
|
+
}
|
|
9556
|
+
var script = document.createElement('script');
|
|
9557
|
+
script.src = url;
|
|
9558
|
+
script.async = true;
|
|
9559
|
+
script.onload = function () {
|
|
9560
|
+
return resolve();
|
|
9561
|
+
};
|
|
9562
|
+
script.onerror = function () {
|
|
9563
|
+
return reject(new Error("Failed to load script from ".concat(url)));
|
|
9564
|
+
};
|
|
9565
|
+
document.head.appendChild(script);
|
|
9566
|
+
});
|
|
9567
|
+
}
|
|
9568
|
+
/**
|
|
9569
|
+
* Load zxing-js from CDN
|
|
9570
|
+
*/
|
|
9571
|
+
function loadZXing() {
|
|
9572
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
9573
|
+
var _this = this;
|
|
9574
|
+
return __generator(this, function (_a) {
|
|
9575
|
+
if (window.ZXing) {
|
|
9576
|
+
return [2 /*return*/, window.ZXing];
|
|
9577
|
+
}
|
|
9578
|
+
if (zxingLoadPromise) {
|
|
9579
|
+
return [2 /*return*/, zxingLoadPromise];
|
|
9580
|
+
}
|
|
9581
|
+
zxingLoadPromise = function () {
|
|
9582
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
9583
|
+
return __generator(this, function (_a) {
|
|
9584
|
+
switch (_a.label) {
|
|
9585
|
+
case 0:
|
|
9586
|
+
return [4 /*yield*/, loadScript$1(ZXING_CDN_URL)];
|
|
9587
|
+
case 1:
|
|
9588
|
+
_a.sent();
|
|
9589
|
+
if (!window.ZXing) {
|
|
9590
|
+
throw new Error('Failed to load ZXing library from CDN');
|
|
9591
|
+
}
|
|
9592
|
+
log('[NativeBarcodeDecoder] Loaded @zxing/library from CDN');
|
|
9593
|
+
return [2 /*return*/, window.ZXing];
|
|
9594
|
+
}
|
|
9595
|
+
});
|
|
9596
|
+
});
|
|
9597
|
+
}();
|
|
9598
|
+
return [2 /*return*/, zxingLoadPromise];
|
|
9599
|
+
});
|
|
9600
|
+
});
|
|
9601
|
+
}
|
|
9602
|
+
/**
|
|
9603
|
+
* Create a ZXing reader instance configured for PDF417
|
|
9604
|
+
*/
|
|
9605
|
+
function getZXingReader() {
|
|
9606
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
9607
|
+
var ZXing, reader;
|
|
9608
|
+
return __generator(this, function (_a) {
|
|
9609
|
+
switch (_a.label) {
|
|
9610
|
+
case 0:
|
|
9611
|
+
if (zxingInstance) {
|
|
9612
|
+
return [2 /*return*/, zxingInstance];
|
|
9613
|
+
}
|
|
9614
|
+
return [4 /*yield*/, loadZXing()
|
|
9615
|
+
// Use the dedicated PDF417 reader class
|
|
9616
|
+
];
|
|
9617
|
+
case 1:
|
|
9618
|
+
ZXing = _a.sent();
|
|
9619
|
+
reader = new ZXing.BrowserPDF417Reader();
|
|
9620
|
+
zxingInstance = reader;
|
|
9621
|
+
return [2 /*return*/, reader];
|
|
9622
|
+
}
|
|
9623
|
+
});
|
|
9624
|
+
});
|
|
9625
|
+
}
|
|
9626
|
+
/**
|
|
9627
|
+
* Decode a barcode using the native BarcodeDetector API
|
|
9628
|
+
*/
|
|
9629
|
+
function decodeWithNative(image) {
|
|
9630
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
9631
|
+
var detector, results, result, error_2;
|
|
9632
|
+
return __generator(this, function (_a) {
|
|
9633
|
+
switch (_a.label) {
|
|
9634
|
+
case 0:
|
|
9635
|
+
if (!isNativeBarcodeDetectorAvailable()) {
|
|
9636
|
+
return [2 /*return*/, null];
|
|
9637
|
+
}
|
|
9638
|
+
_a.label = 1;
|
|
9639
|
+
case 1:
|
|
9640
|
+
_a.trys.push([1, 3,, 4]);
|
|
9641
|
+
detector = new window.BarcodeDetector({
|
|
9642
|
+
formats: ['pdf417']
|
|
9643
|
+
});
|
|
9644
|
+
return [4 /*yield*/, detector.detect(image)];
|
|
9645
|
+
case 2:
|
|
9646
|
+
results = _a.sent();
|
|
9647
|
+
if (results.length > 0) {
|
|
9648
|
+
result = results[0];
|
|
9649
|
+
return [2 /*return*/, {
|
|
9650
|
+
text: result.rawValue,
|
|
9651
|
+
format: result.format,
|
|
9652
|
+
method: 'native'
|
|
9653
|
+
}];
|
|
9654
|
+
}
|
|
9655
|
+
return [2 /*return*/, null];
|
|
9656
|
+
case 3:
|
|
9657
|
+
error_2 = _a.sent();
|
|
9658
|
+
warn('[NativeBarcodeDecoder] Native decode error:', error_2);
|
|
9659
|
+
return [2 /*return*/, null];
|
|
9660
|
+
case 4:
|
|
9661
|
+
return [2 /*return*/];
|
|
9662
|
+
}
|
|
9663
|
+
});
|
|
9664
|
+
});
|
|
9665
|
+
}
|
|
9666
|
+
/**
|
|
9667
|
+
* Decode a barcode using zxing-js
|
|
9668
|
+
*/
|
|
9669
|
+
function decodeWithZXing(image) {
|
|
9670
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
9671
|
+
var reader, result, text, format, error_3;
|
|
9672
|
+
return __generator(this, function (_a) {
|
|
9673
|
+
switch (_a.label) {
|
|
9674
|
+
case 0:
|
|
9675
|
+
_a.trys.push([0, 7,, 8]);
|
|
9676
|
+
return [4 /*yield*/, getZXingReader()];
|
|
9677
|
+
case 1:
|
|
9678
|
+
reader = _a.sent();
|
|
9679
|
+
result = void 0;
|
|
9680
|
+
if (!(image instanceof HTMLImageElement)) return [3 /*break*/, 3];
|
|
9681
|
+
return [4 /*yield*/, reader.decodeFromImage(image)];
|
|
9682
|
+
case 2:
|
|
9683
|
+
// decodeFromImage takes an image element or undefined + URL
|
|
9684
|
+
result = _a.sent();
|
|
9685
|
+
return [3 /*break*/, 6];
|
|
9686
|
+
case 3:
|
|
9687
|
+
if (!(image instanceof HTMLCanvasElement)) return [3 /*break*/, 5];
|
|
9688
|
+
return [4 /*yield*/, reader.decodeFromCanvas(image)];
|
|
9689
|
+
case 4:
|
|
9690
|
+
result = _a.sent();
|
|
9691
|
+
return [3 /*break*/, 6];
|
|
9692
|
+
case 5:
|
|
9693
|
+
throw new Error('Unsupported image type for ZXing decoder');
|
|
9694
|
+
case 6:
|
|
9695
|
+
text = result.text || result.getText();
|
|
9696
|
+
format = result.getBarcodeFormat().toString();
|
|
9697
|
+
return [2 /*return*/, {
|
|
9698
|
+
text: text,
|
|
9699
|
+
format: format,
|
|
9700
|
+
method: 'zxing'
|
|
9701
|
+
}];
|
|
9702
|
+
case 7:
|
|
9703
|
+
error_3 = _a.sent();
|
|
9704
|
+
// NotFoundException is expected when no barcode is found
|
|
9705
|
+
if (error_3 instanceof Error && error_3.name !== 'NotFoundException' && !error_3.message.includes('No barcode') && !error_3.message.includes('not found')) {
|
|
9706
|
+
warn('[NativeBarcodeDecoder] ZXing decode error:', error_3);
|
|
9707
|
+
}
|
|
9708
|
+
return [2 /*return*/, null];
|
|
9709
|
+
case 8:
|
|
9710
|
+
return [2 /*return*/];
|
|
9711
|
+
}
|
|
9712
|
+
});
|
|
9713
|
+
});
|
|
9714
|
+
}
|
|
9715
|
+
/**
|
|
9716
|
+
* Convert various image sources to HTMLImageElement or HTMLCanvasElement
|
|
9717
|
+
*/
|
|
9718
|
+
function prepareImageForDecoding(source) {
|
|
9719
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
9720
|
+
var canvas, ctx, canvas, ctx, url_1, img_1, canvas, ctx;
|
|
9721
|
+
return __generator(this, function (_a) {
|
|
9722
|
+
switch (_a.label) {
|
|
9723
|
+
case 0:
|
|
9724
|
+
if (!(source instanceof HTMLImageElement)) return [3 /*break*/, 3];
|
|
9725
|
+
if (!!source.complete) return [3 /*break*/, 2];
|
|
9726
|
+
return [4 /*yield*/, new Promise(function (resolve, reject) {
|
|
9727
|
+
source.onload = function () {
|
|
9728
|
+
return resolve();
|
|
9729
|
+
};
|
|
9730
|
+
source.onerror = function () {
|
|
9731
|
+
return reject(new Error('Failed to load image'));
|
|
9732
|
+
};
|
|
9733
|
+
})];
|
|
9734
|
+
case 1:
|
|
9735
|
+
_a.sent();
|
|
9736
|
+
_a.label = 2;
|
|
9737
|
+
case 2:
|
|
9738
|
+
return [2 /*return*/, source];
|
|
9739
|
+
case 3:
|
|
9740
|
+
// If it's a canvas, return it directly
|
|
9741
|
+
if (source instanceof HTMLCanvasElement) {
|
|
9742
|
+
return [2 /*return*/, source];
|
|
9743
|
+
}
|
|
9744
|
+
// If it's a video element, capture a frame to canvas
|
|
9745
|
+
if (source instanceof HTMLVideoElement) {
|
|
9746
|
+
canvas = document.createElement('canvas');
|
|
9747
|
+
canvas.width = source.videoWidth;
|
|
9748
|
+
canvas.height = source.videoHeight;
|
|
9749
|
+
ctx = canvas.getContext('2d');
|
|
9750
|
+
if (!ctx) {
|
|
9751
|
+
throw new Error('Failed to get canvas context');
|
|
9752
|
+
}
|
|
9753
|
+
ctx.drawImage(source, 0, 0);
|
|
9754
|
+
return [2 /*return*/, canvas];
|
|
9755
|
+
}
|
|
9756
|
+
// If it's ImageData, draw to canvas
|
|
9757
|
+
if (source instanceof ImageData) {
|
|
9758
|
+
canvas = document.createElement('canvas');
|
|
9759
|
+
canvas.width = source.width;
|
|
9760
|
+
canvas.height = source.height;
|
|
9761
|
+
ctx = canvas.getContext('2d');
|
|
9762
|
+
if (!ctx) {
|
|
9763
|
+
throw new Error('Failed to get canvas context');
|
|
9764
|
+
}
|
|
9765
|
+
ctx.putImageData(source, 0, 0);
|
|
9766
|
+
return [2 /*return*/, canvas];
|
|
9767
|
+
}
|
|
9768
|
+
if (!(source instanceof Blob)) return [3 /*break*/, 7];
|
|
9769
|
+
url_1 = URL.createObjectURL(source);
|
|
9770
|
+
_a.label = 4;
|
|
9771
|
+
case 4:
|
|
9772
|
+
_a.trys.push([4,, 6, 7]);
|
|
9773
|
+
img_1 = new Image();
|
|
9774
|
+
img_1.crossOrigin = 'anonymous';
|
|
9775
|
+
return [4 /*yield*/, new Promise(function (resolve, reject) {
|
|
9776
|
+
img_1.onload = function () {
|
|
9777
|
+
return resolve();
|
|
9778
|
+
};
|
|
9779
|
+
img_1.onerror = function () {
|
|
9780
|
+
return reject(new Error('Failed to load image from blob'));
|
|
9781
|
+
};
|
|
9782
|
+
img_1.src = url_1;
|
|
9783
|
+
})];
|
|
9784
|
+
case 5:
|
|
9785
|
+
_a.sent();
|
|
9786
|
+
return [2 /*return*/, img_1];
|
|
9787
|
+
case 6:
|
|
9788
|
+
URL.revokeObjectURL(url_1);
|
|
9789
|
+
return [7 /*endfinally*/];
|
|
9790
|
+
case 7:
|
|
9791
|
+
// If it's an ImageBitmap, draw to canvas
|
|
9792
|
+
if (source instanceof ImageBitmap) {
|
|
9793
|
+
canvas = document.createElement('canvas');
|
|
9794
|
+
canvas.width = source.width;
|
|
9795
|
+
canvas.height = source.height;
|
|
9796
|
+
ctx = canvas.getContext('2d');
|
|
9797
|
+
if (!ctx) {
|
|
9798
|
+
throw new Error('Failed to get canvas context');
|
|
9799
|
+
}
|
|
9800
|
+
ctx.drawImage(source, 0, 0);
|
|
9801
|
+
return [2 /*return*/, canvas];
|
|
9802
|
+
}
|
|
9803
|
+
throw new Error('Unsupported image source type');
|
|
9804
|
+
}
|
|
9805
|
+
});
|
|
9806
|
+
});
|
|
9807
|
+
}
|
|
9808
|
+
/**
|
|
9809
|
+
* Decode a PDF417 barcode from an image source.
|
|
9810
|
+
*
|
|
9811
|
+
* Tries native BarcodeDetector API first (if available and supports PDF417),
|
|
9812
|
+
* then falls back to zxing-js.
|
|
9813
|
+
*
|
|
9814
|
+
* @param source - Image source (HTMLImageElement, HTMLCanvasElement, HTMLVideoElement, ImageData, Blob, ImageBitmap)
|
|
9815
|
+
* @param options - Decode options
|
|
9816
|
+
* @returns Decoded barcode result or null if no barcode found
|
|
9817
|
+
*/
|
|
9818
|
+
function decodePDF417(source_1) {
|
|
9819
|
+
return __awaiter(this, arguments, void 0, function (source, options) {
|
|
9820
|
+
var _a, tryNative, _b, fallbackToZXing, _c, preloadZXing, supportsNative, nativeResult, preparedImage, zxingResult;
|
|
9821
|
+
if (options === void 0) {
|
|
9822
|
+
options = {};
|
|
9823
|
+
}
|
|
9824
|
+
return __generator(this, function (_d) {
|
|
9825
|
+
switch (_d.label) {
|
|
9826
|
+
case 0:
|
|
9827
|
+
_a = options.tryNative, tryNative = _a === void 0 ? true : _a, _b = options.fallbackToZXing, fallbackToZXing = _b === void 0 ? true : _b, _c = options.preloadZXing, preloadZXing = _c === void 0 ? false : _c;
|
|
9828
|
+
// Optionally preload zxing in background
|
|
9829
|
+
if (preloadZXing && fallbackToZXing) {
|
|
9830
|
+
loadZXing()["catch"](function () {
|
|
9831
|
+
/* ignore preload errors */
|
|
9832
|
+
});
|
|
9833
|
+
}
|
|
9834
|
+
if (!tryNative) return [3 /*break*/, 3];
|
|
9835
|
+
return [4 /*yield*/, checkNativePDF417Support()];
|
|
9836
|
+
case 1:
|
|
9837
|
+
supportsNative = _d.sent();
|
|
9838
|
+
if (!supportsNative) return [3 /*break*/, 3];
|
|
9839
|
+
return [4 /*yield*/, decodeWithNative(source)];
|
|
9840
|
+
case 2:
|
|
9841
|
+
nativeResult = _d.sent();
|
|
9842
|
+
if (nativeResult) {
|
|
9843
|
+
return [2 /*return*/, nativeResult];
|
|
9844
|
+
}
|
|
9845
|
+
_d.label = 3;
|
|
9846
|
+
case 3:
|
|
9847
|
+
if (!fallbackToZXing) return [3 /*break*/, 6];
|
|
9848
|
+
return [4 /*yield*/, prepareImageForDecoding(source)];
|
|
9849
|
+
case 4:
|
|
9850
|
+
preparedImage = _d.sent();
|
|
9851
|
+
return [4 /*yield*/, decodeWithZXing(preparedImage)];
|
|
9852
|
+
case 5:
|
|
9853
|
+
zxingResult = _d.sent();
|
|
9854
|
+
if (zxingResult) {
|
|
9855
|
+
return [2 /*return*/, zxingResult];
|
|
9856
|
+
}
|
|
9857
|
+
_d.label = 6;
|
|
9858
|
+
case 6:
|
|
9859
|
+
return [2 /*return*/, null];
|
|
9860
|
+
}
|
|
9861
|
+
});
|
|
9862
|
+
});
|
|
9863
|
+
}
|
|
9864
|
+
|
|
9865
|
+
function setCanvasDimensions(canvas, width, height) {
|
|
9866
|
+
var _a;
|
|
9867
|
+
var devicePixelRatio = 1;
|
|
9868
|
+
if (typeof window !== 'undefined') devicePixelRatio = window.devicePixelRatio;
|
|
9869
|
+
canvas.width = width * devicePixelRatio;
|
|
9870
|
+
canvas.height = height * devicePixelRatio;
|
|
9871
|
+
canvas.style.width = width + 'px';
|
|
9872
|
+
canvas.style.height = height + 'px';
|
|
9873
|
+
(_a = canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.scale(devicePixelRatio, devicePixelRatio);
|
|
9874
|
+
}
|
|
9875
|
+
function resetCanvasDimensions(canvas) {
|
|
9876
|
+
canvas.width = 0;
|
|
9877
|
+
canvas.height = 0;
|
|
9878
|
+
canvas.style.width = '0';
|
|
9879
|
+
canvas.style.height = '0';
|
|
9880
|
+
}
|
|
9881
|
+
|
|
9882
|
+
var IdCardGuideImageContainer = styled__default.default(IdCardBorder)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n position: relative;\n ", "\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n ", ";\n"], ["\n position: relative;\n ", "\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n ", ";\n"])), function (props) {
|
|
9883
|
+
return props.$isVisible ? '' : 'opacity: 0;';
|
|
9884
|
+
}, function (props) {
|
|
9885
|
+
return props.$isMobile ? props.$isLandscape ? 'height: 100%;' : 'width: 80%;' : props.$isLandscape ? 'height: 70%;' : 'width: 82%;';
|
|
9886
|
+
});
|
|
9887
|
+
var IdCardGuideImage = styled__default.default.img(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n max-height: 100%;\n transform-style: preserve-3d;\n ", "\n ", "\n"], ["\n max-height: 100%;\n transform-style: preserve-3d;\n ", "\n ", "\n"])), function (props) {
|
|
9888
|
+
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
9889
|
+
}, function (props) {
|
|
9890
|
+
return props.$isInvisible ? 'opacity: 0;' : '';
|
|
9891
|
+
});
|
|
9892
|
+
function IdCardBorder(_a) {
|
|
9893
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
9894
|
+
var children = _a.children,
|
|
9895
|
+
_s = _a.status,
|
|
9896
|
+
status = _s === void 0 ? 'ready' : _s,
|
|
9897
|
+
_t = _a.borderWidth,
|
|
9898
|
+
borderWidth = _t === void 0 ? 20 : _t,
|
|
9899
|
+
_u = _a.borderRadius,
|
|
9900
|
+
borderRadius = _u === void 0 ? 25 : _u,
|
|
9901
|
+
_v = _a.borderColor,
|
|
9902
|
+
borderColor = _v === void 0 ? 'white' : _v,
|
|
8792
9903
|
_w = _a.aspectRatio,
|
|
8793
9904
|
aspectRatio = _w === void 0 ? 1 : _w,
|
|
8794
9905
|
_x = _a.progress,
|
|
@@ -8923,17 +10034,17 @@ function IdCardBorderSvg(_a) {
|
|
|
8923
10034
|
className: isProgressBar ? "idmSdkProgressBorder ".concat(progressPaused ? 'idmSdkProgressPaused' : '') : ''
|
|
8924
10035
|
}));
|
|
8925
10036
|
}
|
|
8926
|
-
var IdCardBorderContainer = styled__default.default.div(templateObject_3$
|
|
8927
|
-
var IdCardBorderInner = styled__default.default.div(templateObject_4$
|
|
8928
|
-
var SvgOverlay = styled__default.default.svg(templateObject_5$
|
|
8929
|
-
var IdCardBorderRect = styled__default.default.rect(templateObject_6$
|
|
10037
|
+
var IdCardBorderContainer = styled__default.default.div(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n align-items: center;\n justify-content: center;\n display: flex;\n position: relative;\n margin: auto;\n\n & .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(3) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(4) {\n animation-delay: 1.33s;\n }\n }\n"], ["\n align-items: center;\n justify-content: center;\n display: flex;\n position: relative;\n margin: auto;\n\n & .idmSdkWaves {\n position: absolute;\n animation: ", " 2s ease-out infinite;\n transform-style: preserve-3d;\n\n &:nth-child(3) {\n animation-delay: 0.66s;\n }\n\n &:nth-child(4) {\n animation-delay: 1.33s;\n }\n }\n"])), wavesAnimation);
|
|
10038
|
+
var IdCardBorderInner = styled__default.default.div(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n max-height: 100%;\n max-width: 100%;\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n"], ["\n max-height: 100%;\n max-width: 100%;\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n"])));
|
|
10039
|
+
var SvgOverlay = styled__default.default.svg(templateObject_5$f || (templateObject_5$f = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n"])));
|
|
10040
|
+
var IdCardBorderRect = styled__default.default.rect(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"], ["\n &.idmSdkProgressBorder {\n animation: ", " ", "\n ", ";\n }\n\n &.idmSdkProgressPaused {\n animation-play-state: paused;\n }\n"])), progressBorderAnimation, function (props) {
|
|
8930
10041
|
var _a;
|
|
8931
10042
|
return (_a = props.$speed) !== null && _a !== void 0 ? _a : '3s';
|
|
8932
10043
|
}, function (props) {
|
|
8933
10044
|
var _a;
|
|
8934
10045
|
return (_a = props.$fillMode) !== null && _a !== void 0 ? _a : 'forwards';
|
|
8935
10046
|
});
|
|
8936
|
-
var templateObject_1$
|
|
10047
|
+
var templateObject_1$E, templateObject_2$A, templateObject_3$q, templateObject_4$k, templateObject_5$f, templateObject_6$9;
|
|
8937
10048
|
|
|
8938
10049
|
var defaultIdCaptureGuideImages = {
|
|
8939
10050
|
portrait: {
|
|
@@ -9081,7 +10192,7 @@ var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
|
|
|
9081
10192
|
clearTimeout(timeout);
|
|
9082
10193
|
};
|
|
9083
10194
|
}, []);
|
|
9084
|
-
return /*#__PURE__*/React__namespace.default.createElement(Wrapper$
|
|
10195
|
+
return /*#__PURE__*/React__namespace.default.createElement(Wrapper$2, {
|
|
9085
10196
|
"$isLandscape": orientation === 'landscape',
|
|
9086
10197
|
style: {
|
|
9087
10198
|
aspectRatio: aspectRatio
|
|
@@ -9122,15 +10233,15 @@ var IdVideoCaptureFlipIdPrompt = function IdVideoCaptureFlipIdPrompt(_a) {
|
|
|
9122
10233
|
style: imageStyle
|
|
9123
10234
|
})));
|
|
9124
10235
|
};
|
|
9125
|
-
var Wrapper$
|
|
10236
|
+
var Wrapper$2 = styled__default.default.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n ", "\n\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n ", "\n\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n"])), function (props) {
|
|
9126
10237
|
return props.$isLandscape ? 'height: 100%;' : 'height: 100%;';
|
|
9127
10238
|
});
|
|
9128
|
-
var FlipImageContainer = styled__default.default(IdCardGuideImageContainer)(templateObject_2$
|
|
10239
|
+
var FlipImageContainer = styled__default.default(IdCardGuideImageContainer)(templateObject_2$z || (templateObject_2$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 height: 100%; // todo: branch between desktop and mobile\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 height: 100%; // todo: branch between desktop and mobile\n"])), function (props) {
|
|
9129
10240
|
return props.$transitionTime;
|
|
9130
10241
|
}, function (props) {
|
|
9131
10242
|
return props.$transforms;
|
|
9132
10243
|
});
|
|
9133
|
-
var templateObject_1$
|
|
10244
|
+
var templateObject_1$D, templateObject_2$z;
|
|
9134
10245
|
|
|
9135
10246
|
var GuideOrientationContext = /*#__PURE__*/React.createContext({
|
|
9136
10247
|
orientation: 'landscape',
|
|
@@ -9225,7 +10336,7 @@ var FlipIdPrompt = function FlipIdPrompt(_a) {
|
|
|
9225
10336
|
clearTimeout(timeout);
|
|
9226
10337
|
};
|
|
9227
10338
|
}, []);
|
|
9228
|
-
return /*#__PURE__*/React__namespace.default.createElement(Wrapper, {
|
|
10339
|
+
return /*#__PURE__*/React__namespace.default.createElement(Wrapper$1, {
|
|
9229
10340
|
style: {
|
|
9230
10341
|
aspectRatio: imageAspectRatio
|
|
9231
10342
|
},
|
|
@@ -9269,10 +10380,10 @@ var FlipIdPrompt = function FlipIdPrompt(_a) {
|
|
|
9269
10380
|
height: height
|
|
9270
10381
|
})));
|
|
9271
10382
|
};
|
|
9272
|
-
var Wrapper = styled__default.default.div(templateObject_1$
|
|
10383
|
+
var Wrapper$1 = styled__default.default.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n align-items: center;\n justify-content: center;\n display: flex;\n position: absolute;\n margin: auto;\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n ", ";\n"], ["\n align-items: center;\n justify-content: center;\n display: flex;\n position: absolute;\n margin: auto;\n box-sizing: border-box;\n max-width: 100%;\n max-height: 100%;\n ", ";\n"])), function (props) {
|
|
9273
10384
|
return props.$isMobile ? props.$isLandscape ? 'height: 100%;' : 'width: 80%;' : props.$isLandscape ? 'height: 70%;' : 'width: 82%;';
|
|
9274
10385
|
});
|
|
9275
|
-
var templateObject_1$
|
|
10386
|
+
var templateObject_1$C;
|
|
9276
10387
|
|
|
9277
10388
|
var IdCaptureGuideOverlay = function IdCaptureGuideOverlay(_a) {
|
|
9278
10389
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
@@ -9418,10 +10529,10 @@ var regionClsx = function regionClsx(classNames, which) {
|
|
|
9418
10529
|
return v;
|
|
9419
10530
|
}).join(' ');
|
|
9420
10531
|
};
|
|
9421
|
-
var StyledPageContainer = styled__default.default.div(templateObject_1$
|
|
9422
|
-
var GuidesContainer = styled__default.default.div(templateObject_2$
|
|
9423
|
-
var GuideCenterRow = styled__default.default.div(templateObject_3$
|
|
9424
|
-
var GuideRegion = styled__default.default.div(templateObject_4$
|
|
10532
|
+
var StyledPageContainer = styled__default.default.div(templateObject_1$B || (templateObject_1$B = __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"])));
|
|
10533
|
+
var GuidesContainer = styled__default.default.div(templateObject_2$y || (templateObject_2$y = __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"])));
|
|
10534
|
+
var GuideCenterRow = styled__default.default.div(templateObject_3$p || (templateObject_3$p = __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"])));
|
|
10535
|
+
var GuideRegion = styled__default.default.div(templateObject_4$j || (templateObject_4$j = __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) {
|
|
9425
10536
|
var _a, _b, _c, _d, _e;
|
|
9426
10537
|
return (_e = (_a = props.$maskColor) !== null && _a !== void 0 ? _a : (_d = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.idCapture) === null || _c === void 0 ? void 0 : _c.guideOverlay) === null || _d === void 0 ? void 0 : _d.backgroundColor) !== null && _e !== void 0 ? _e : 'rgba(0, 0, 0, 0.5)';
|
|
9427
10538
|
}, function (props) {
|
|
@@ -9432,23 +10543,23 @@ var GuideRegion = styled__default.default.div(templateObject_4$g || (templateObj
|
|
|
9432
10543
|
}, function (props) {
|
|
9433
10544
|
return props.$minHeight ? "min-height: ".concat(props.$minHeight, "px;") : "";
|
|
9434
10545
|
});
|
|
9435
|
-
var Spacer = styled__default.default(GuideRegion)(templateObject_5$
|
|
9436
|
-
var GuideCenterRegion = styled__default.default.div(templateObject_6$
|
|
10546
|
+
var Spacer = styled__default.default(GuideRegion)(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n display: block;\n width: auto;\n"], ["\n display: block;\n width: auto;\n"])));
|
|
10547
|
+
var GuideCenterRegion = styled__default.default.div(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"], ["\n ", "\n ", "\n transform-style: preserve-3d;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n max-height: 100%;\n height: 100%;\n"])), function (props) {
|
|
9437
10548
|
return props.$minWidth ? "min-width: ".concat(props.$minWidth, "px;") : "";
|
|
9438
10549
|
}, function (props) {
|
|
9439
10550
|
return props.$isMirrored ? 'transform: scaleX(-1);' : '';
|
|
9440
10551
|
});
|
|
9441
|
-
var GuideCenterBorder = styled__default.default.div(templateObject_7$
|
|
10552
|
+
var GuideCenterBorder = styled__default.default.div(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n box-sizing: border-box;\n border: ", ";\n display: flex;\n flex: 1;\n justify-content: center;\n max-height: 100%;\n min-height: 0;\n max-width: 100%;\n position: relative;\n ", "\n"], ["\n box-sizing: border-box;\n border: ", ";\n display: flex;\n flex: 1;\n justify-content: center;\n max-height: 100%;\n min-height: 0;\n max-width: 100%;\n position: relative;\n ", "\n"])), function (props) {
|
|
9442
10553
|
var _a, _b;
|
|
9443
10554
|
return "".concat((_a = props.$borderWidth) !== null && _a !== void 0 ? _a : 4, "px solid ").concat((_b = props.$borderColor) !== null && _b !== void 0 ? _b : 'white');
|
|
9444
10555
|
}, function (props) {
|
|
9445
10556
|
return props.$padding ? "padding: ".concat(props.$padding, "px;") : '';
|
|
9446
10557
|
});
|
|
9447
|
-
var GuideText = styled__default.default.span(templateObject_8$
|
|
9448
|
-
var GuideCenterInner = styled__default.default.div(templateObject_9$
|
|
10558
|
+
var GuideText = styled__default.default.span(templateObject_8$4 || (templateObject_8$4 = __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"])));
|
|
10559
|
+
var GuideCenterInner = styled__default.default.div(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n position: relative;\n top: 0;\n margin: auto;\n ", "\n max-height: 100%;\n max-width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n position: relative;\n top: 0;\n margin: auto;\n ", "\n max-height: 100%;\n max-width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (props) {
|
|
9449
10560
|
return props.$isLandscape ? 'height: 100%;' : 'width: 90%;';
|
|
9450
10561
|
});
|
|
9451
|
-
var templateObject_1$
|
|
10562
|
+
var templateObject_1$B, templateObject_2$y, templateObject_3$p, templateObject_4$j, templateObject_5$e, templateObject_6$8, templateObject_7$5, templateObject_8$4, templateObject_9$3;
|
|
9452
10563
|
|
|
9453
10564
|
var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
9454
10565
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
@@ -9571,7 +10682,7 @@ var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
|
9571
10682
|
ref: wrapperRef,
|
|
9572
10683
|
"$maskColor": maskColor !== null && maskColor !== void 0 ? maskColor : '',
|
|
9573
10684
|
className: classNames.canvasWrapper
|
|
9574
|
-
}, /*#__PURE__*/React__namespace.default.createElement(Canvas$
|
|
10685
|
+
}, /*#__PURE__*/React__namespace.default.createElement(Canvas$2, {
|
|
9575
10686
|
ref: canvasRef,
|
|
9576
10687
|
className: classNames.canvas
|
|
9577
10688
|
})), /*#__PURE__*/React__namespace.default.createElement(IdCaptureGuideOverlay, {
|
|
@@ -9589,11 +10700,174 @@ var IdCaptureFitGuide = function IdCaptureFitGuide(_a) {
|
|
|
9589
10700
|
progress: progress
|
|
9590
10701
|
}));
|
|
9591
10702
|
};
|
|
9592
|
-
var CanvasWrapper$1 = styled__default.default.div(templateObject_1$
|
|
10703
|
+
var CanvasWrapper$1 = styled__default.default.div(templateObject_1$A || (templateObject_1$A = __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) {
|
|
9593
10704
|
return props.$maskColor;
|
|
9594
10705
|
});
|
|
9595
|
-
var Canvas$
|
|
9596
|
-
var templateObject_1$
|
|
10706
|
+
var Canvas$2 = styled__default.default.canvas(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
10707
|
+
var templateObject_1$A, templateObject_2$x;
|
|
10708
|
+
|
|
10709
|
+
var PDF417_ASPECT_RATIO = 3 / 1;
|
|
10710
|
+
function BarcodeGuideOverlay(_a) {
|
|
10711
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
10712
|
+
var _l = _a.aspectRatio,
|
|
10713
|
+
aspectRatio = _l === void 0 ? PDF417_ASPECT_RATIO : _l,
|
|
10714
|
+
maskColor = _a.maskColor,
|
|
10715
|
+
_m = _a.cornerColor,
|
|
10716
|
+
cornerColor = _m === void 0 ? 'white' : _m,
|
|
10717
|
+
_o = _a.cornerLength,
|
|
10718
|
+
cornerLength = _o === void 0 ? 40 : _o,
|
|
10719
|
+
_p = _a.cornerWidth,
|
|
10720
|
+
cornerWidth = _p === void 0 ? 4 : _p,
|
|
10721
|
+
padding = _a.padding,
|
|
10722
|
+
_q = _a.borderRadius,
|
|
10723
|
+
borderRadius = _q === void 0 ? 8 : _q,
|
|
10724
|
+
_r = _a.headerText,
|
|
10725
|
+
headerText = _r === void 0 ? 'SCAN THE BARCODE' : _r,
|
|
10726
|
+
_s = _a.instructionText,
|
|
10727
|
+
instructionText = _s === void 0 ? 'Bring camera closer until the barcode fills the rectangular box.' : _s,
|
|
10728
|
+
_t = _a.isSuccess,
|
|
10729
|
+
isSuccess = _t === void 0 ? false : _t,
|
|
10730
|
+
_u = _a.successColor,
|
|
10731
|
+
successColor = _u === void 0 ? '#22c55e' : _u,
|
|
10732
|
+
_v = _a.classNames,
|
|
10733
|
+
classNames = _v === void 0 ? {} : _v;
|
|
10734
|
+
var canvasRef = React.useRef(null);
|
|
10735
|
+
var _w = useResizeObserver(),
|
|
10736
|
+
wrapperRef = _w.ref,
|
|
10737
|
+
_x = _w.width,
|
|
10738
|
+
wrapperWidth = _x === void 0 ? 1 : _x,
|
|
10739
|
+
_y = _w.height,
|
|
10740
|
+
wrapperHeight = _y === void 0 ? 1 : _y;
|
|
10741
|
+
var theme = styled.useTheme();
|
|
10742
|
+
if (padding === undefined) {
|
|
10743
|
+
padding = isMobile() ? (_d = (_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.guideBox) === null || _c === void 0 ? void 0 : _c.mobilePadding) !== null && _d !== void 0 ? _d : 24 : (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.guideBox) === null || _f === void 0 ? void 0 : _f.desktopPadding) !== null && _g !== void 0 ? _g : 48;
|
|
10744
|
+
}
|
|
10745
|
+
if (maskColor === undefined) {
|
|
10746
|
+
maskColor = (_k = (_j = (_h = theme.idCapture) === null || _h === void 0 ? void 0 : _h.guideOverlay) === null || _j === void 0 ? void 0 : _j.backgroundColor) !== null && _k !== void 0 ? _k : '#708090';
|
|
10747
|
+
}
|
|
10748
|
+
React.useEffect(function () {
|
|
10749
|
+
var canvas = canvasRef.current;
|
|
10750
|
+
if (!canvas) return;
|
|
10751
|
+
// Wait for valid dimensions from resize observer
|
|
10752
|
+
if (wrapperWidth <= 1 || wrapperHeight <= 1) return;
|
|
10753
|
+
var boundingWidth = wrapperWidth - padding * 2;
|
|
10754
|
+
var boundingHeight = wrapperHeight - padding * 2;
|
|
10755
|
+
// Start with bounding box dimensions
|
|
10756
|
+
var rectWidth = boundingWidth;
|
|
10757
|
+
var rectHeight = boundingWidth / aspectRatio;
|
|
10758
|
+
// If calculated height exceeds available height, constrain by height instead
|
|
10759
|
+
if (rectHeight > boundingHeight) {
|
|
10760
|
+
rectHeight = boundingHeight;
|
|
10761
|
+
rectWidth = boundingHeight * aspectRatio;
|
|
10762
|
+
}
|
|
10763
|
+
// Center the rectangle
|
|
10764
|
+
var rectX = padding + (boundingWidth - rectWidth) / 2;
|
|
10765
|
+
var rectY = padding + (boundingHeight - rectHeight) / 2;
|
|
10766
|
+
setCanvasDimensions(canvas, wrapperWidth, wrapperHeight);
|
|
10767
|
+
var ctx = canvas.getContext('2d');
|
|
10768
|
+
if (!ctx) return;
|
|
10769
|
+
// Fill with mask color
|
|
10770
|
+
ctx.fillStyle = maskColor;
|
|
10771
|
+
ctx.clearRect(0, 0, wrapperWidth, wrapperHeight);
|
|
10772
|
+
ctx.fillRect(0, 0, wrapperWidth, wrapperHeight);
|
|
10773
|
+
// Create the cutout
|
|
10774
|
+
ctx.beginPath();
|
|
10775
|
+
ctx.roundRect(rectX, rectY, rectWidth, rectHeight, borderRadius);
|
|
10776
|
+
ctx.fillStyle = 'rgba(0,0,0,1)';
|
|
10777
|
+
ctx.globalCompositeOperation = 'destination-out';
|
|
10778
|
+
ctx.fill();
|
|
10779
|
+
ctx.globalCompositeOperation = 'source-over';
|
|
10780
|
+
// Draw corner brackets
|
|
10781
|
+
var color = isSuccess ? successColor : cornerColor;
|
|
10782
|
+
ctx.strokeStyle = color;
|
|
10783
|
+
ctx.lineWidth = cornerWidth;
|
|
10784
|
+
ctx.lineCap = 'round';
|
|
10785
|
+
var effectiveCornerLength = Math.min(cornerLength, rectWidth / 3, rectHeight / 3);
|
|
10786
|
+
// Top-left corner
|
|
10787
|
+
ctx.beginPath();
|
|
10788
|
+
ctx.moveTo(rectX + effectiveCornerLength, rectY);
|
|
10789
|
+
ctx.lineTo(rectX + borderRadius, rectY);
|
|
10790
|
+
ctx.arcTo(rectX, rectY, rectX, rectY + borderRadius, borderRadius);
|
|
10791
|
+
ctx.lineTo(rectX, rectY + effectiveCornerLength);
|
|
10792
|
+
ctx.stroke();
|
|
10793
|
+
// Top-right corner
|
|
10794
|
+
ctx.beginPath();
|
|
10795
|
+
ctx.moveTo(rectX + rectWidth - effectiveCornerLength, rectY);
|
|
10796
|
+
ctx.lineTo(rectX + rectWidth - borderRadius, rectY);
|
|
10797
|
+
ctx.arcTo(rectX + rectWidth, rectY, rectX + rectWidth, rectY + borderRadius, borderRadius);
|
|
10798
|
+
ctx.lineTo(rectX + rectWidth, rectY + effectiveCornerLength);
|
|
10799
|
+
ctx.stroke();
|
|
10800
|
+
// Bottom-left corner
|
|
10801
|
+
ctx.beginPath();
|
|
10802
|
+
ctx.moveTo(rectX, rectY + rectHeight - effectiveCornerLength);
|
|
10803
|
+
ctx.lineTo(rectX, rectY + rectHeight - borderRadius);
|
|
10804
|
+
ctx.arcTo(rectX, rectY + rectHeight, rectX + borderRadius, rectY + rectHeight, borderRadius);
|
|
10805
|
+
ctx.lineTo(rectX + effectiveCornerLength, rectY + rectHeight);
|
|
10806
|
+
ctx.stroke();
|
|
10807
|
+
// Bottom-right corner
|
|
10808
|
+
ctx.beginPath();
|
|
10809
|
+
ctx.moveTo(rectX + rectWidth, rectY + rectHeight - effectiveCornerLength);
|
|
10810
|
+
ctx.lineTo(rectX + rectWidth, rectY + rectHeight - borderRadius);
|
|
10811
|
+
ctx.arcTo(rectX + rectWidth, rectY + rectHeight, rectX + rectWidth - borderRadius, rectY + rectHeight, borderRadius);
|
|
10812
|
+
ctx.lineTo(rectX + rectWidth - effectiveCornerLength, rectY + rectHeight);
|
|
10813
|
+
ctx.stroke();
|
|
10814
|
+
return function () {
|
|
10815
|
+
resetCanvasDimensions(canvas);
|
|
10816
|
+
};
|
|
10817
|
+
}, [aspectRatio, borderRadius, cornerColor, cornerLength, cornerWidth, isSuccess, maskColor, padding, successColor, wrapperHeight, wrapperWidth]);
|
|
10818
|
+
return /*#__PURE__*/React__namespace.default.createElement(Wrapper, {
|
|
10819
|
+
ref: wrapperRef,
|
|
10820
|
+
className: classNames.wrapper
|
|
10821
|
+
}, /*#__PURE__*/React__namespace.default.createElement(Canvas$1, {
|
|
10822
|
+
ref: canvasRef,
|
|
10823
|
+
className: classNames.canvas
|
|
10824
|
+
}), /*#__PURE__*/React__namespace.default.createElement(TextOverlay, null, /*#__PURE__*/React__namespace.default.createElement(HeaderText, {
|
|
10825
|
+
className: classNames.header
|
|
10826
|
+
}, headerText), /*#__PURE__*/React__namespace.default.createElement(InstructionText, {
|
|
10827
|
+
className: classNames.instruction
|
|
10828
|
+
}, instructionText)));
|
|
10829
|
+
}
|
|
10830
|
+
var Wrapper = styled__default.default.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n position: absolute;\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 z-index: 1;\n"], ["\n position: absolute;\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 z-index: 1;\n"])));
|
|
10831
|
+
var Canvas$1 = styled__default.default.canvas(templateObject_2$w || (templateObject_2$w = __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"])));
|
|
10832
|
+
var TextOverlay = styled__default.default.div(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n position: absolute;\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: flex-start;\n padding-top: 48px;\n pointer-events: none;\n z-index: 2;\n"], ["\n position: absolute;\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: flex-start;\n padding-top: 48px;\n pointer-events: none;\n z-index: 2;\n"])));
|
|
10833
|
+
var HeaderText = styled__default.default.div(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n color: white;\n font-size: 24px;\n font-weight: 700;\n text-align: center;\n text-transform: uppercase;\n letter-spacing: 2px;\n margin-bottom: 16px;\n"], ["\n color: white;\n font-size: 24px;\n font-weight: 700;\n text-align: center;\n text-transform: uppercase;\n letter-spacing: 2px;\n margin-bottom: 16px;\n"])));
|
|
10834
|
+
var InstructionText = styled__default.default.div(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n color: white;\n font-size: 16px;\n font-weight: 400;\n text-align: center;\n max-width: 300px;\n line-height: 1.4;\n opacity: 0.9;\n"], ["\n color: white;\n font-size: 16px;\n font-weight: 400;\n text-align: center;\n max-width: 300px;\n line-height: 1.4;\n opacity: 0.9;\n"])));
|
|
10835
|
+
var templateObject_1$z, templateObject_2$w, templateObject_3$o, templateObject_4$i, templateObject_5$d;
|
|
10836
|
+
|
|
10837
|
+
function BarcodeSuccessOverlay(_a) {
|
|
10838
|
+
var _b = _a.headerText,
|
|
10839
|
+
headerText = _b === void 0 ? 'Scan Successful!' : _b,
|
|
10840
|
+
_c = _a.processingText,
|
|
10841
|
+
processingText = _c === void 0 ? 'Processing...' : _c,
|
|
10842
|
+
_d = _a.successColor,
|
|
10843
|
+
successColor = _d === void 0 ? '#22c55e' : _d;
|
|
10844
|
+
return /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(BarcodeGuideOverlay, {
|
|
10845
|
+
headerText: headerText,
|
|
10846
|
+
instructionText: processingText,
|
|
10847
|
+
isSuccess: true,
|
|
10848
|
+
successColor: successColor
|
|
10849
|
+
}), /*#__PURE__*/React__namespace.default.createElement(CheckmarkWrapper, null, /*#__PURE__*/React__namespace.default.createElement(CheckmarkCircle, {
|
|
10850
|
+
"$color": successColor
|
|
10851
|
+
}, /*#__PURE__*/React__namespace.default.createElement(CheckmarkIcon, {
|
|
10852
|
+
viewBox: "0 0 24 24",
|
|
10853
|
+
fill: "none"
|
|
10854
|
+
}, /*#__PURE__*/React__namespace.default.createElement(CheckmarkPath, {
|
|
10855
|
+
d: "M5 13l4 4L19 7",
|
|
10856
|
+
stroke: "white",
|
|
10857
|
+
strokeWidth: "3",
|
|
10858
|
+
strokeLinecap: "round",
|
|
10859
|
+
strokeLinejoin: "round"
|
|
10860
|
+
})))));
|
|
10861
|
+
}
|
|
10862
|
+
var scaleIn = styled.keyframes(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n 50% {\n transform: scale(1.1);\n }\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n"], ["\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n 50% {\n transform: scale(1.1);\n }\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n"])));
|
|
10863
|
+
var drawCheck = styled.keyframes(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n 0% {\n stroke-dashoffset: 24;\n }\n 100% {\n stroke-dashoffset: 0;\n }\n"], ["\n 0% {\n stroke-dashoffset: 24;\n }\n 100% {\n stroke-dashoffset: 0;\n }\n"])));
|
|
10864
|
+
var CheckmarkWrapper = styled__default.default.div(templateObject_3$n || (templateObject_3$n = __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 pointer-events: none;\n z-index: 3;\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 pointer-events: none;\n z-index: 3;\n"])));
|
|
10865
|
+
var CheckmarkCircle = styled__default.default.div(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n width: 80px;\n height: 80px;\n border-radius: 50%;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n animation: ", " 0.4s ease-out forwards;\n"], ["\n width: 80px;\n height: 80px;\n border-radius: 50%;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n animation: ", " 0.4s ease-out forwards;\n"])), function (props) {
|
|
10866
|
+
return props.$color;
|
|
10867
|
+
}, scaleIn);
|
|
10868
|
+
var CheckmarkIcon = styled__default.default.svg(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n width: 48px;\n height: 48px;\n"], ["\n width: 48px;\n height: 48px;\n"])));
|
|
10869
|
+
var CheckmarkPath = styled__default.default.path(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n stroke-dasharray: 24;\n stroke-dashoffset: 24;\n animation: ", " 0.4s ease-out 0.2s forwards;\n"], ["\n stroke-dasharray: 24;\n stroke-dashoffset: 24;\n animation: ", " 0.4s ease-out 0.2s forwards;\n"])), drawCheck);
|
|
10870
|
+
var templateObject_1$y, templateObject_2$v, templateObject_3$n, templateObject_4$h, templateObject_5$c, templateObject_6$7;
|
|
9597
10871
|
|
|
9598
10872
|
function IdCaptureGuides(_a) {
|
|
9599
10873
|
var _b = _a.guideType,
|
|
@@ -9615,7 +10889,15 @@ function IdCaptureGuides(_a) {
|
|
|
9615
10889
|
_k = _a.colors,
|
|
9616
10890
|
colors = _k === void 0 ? {} : _k,
|
|
9617
10891
|
_l = _a.verbiage,
|
|
9618
|
-
rawVerbiage = _l === void 0 ? {} : _l
|
|
10892
|
+
rawVerbiage = _l === void 0 ? {} : _l,
|
|
10893
|
+
_m = _a.isRequestingBetterBarcode,
|
|
10894
|
+
isRequestingBetterBarcode = _m === void 0 ? false : _m,
|
|
10895
|
+
_o = _a.isBarcodeSuccess,
|
|
10896
|
+
isBarcodeSuccess = _o === void 0 ? false : _o,
|
|
10897
|
+
_p = _a.barcodeHeaderText,
|
|
10898
|
+
barcodeHeaderText = _p === void 0 ? 'SCAN THE BARCODE' : _p,
|
|
10899
|
+
_q = _a.barcodeInstructionText,
|
|
10900
|
+
barcodeInstructionText = _q === void 0 ? 'Bring camera closer until the barcode fills the rectangular box.' : _q;
|
|
9619
10901
|
var state = useIdCaptureStore();
|
|
9620
10902
|
var isRearFacing = useCameraStore(function (state) {
|
|
9621
10903
|
return state.isRearFacing;
|
|
@@ -9625,6 +10907,18 @@ function IdCaptureGuides(_a) {
|
|
|
9625
10907
|
capturingText: 'Capturing...',
|
|
9626
10908
|
captureFailedText: 'Capture failed!'
|
|
9627
10909
|
});
|
|
10910
|
+
// Render barcode guide overlays when in barcode recapture state
|
|
10911
|
+
if (isRequestingBetterBarcode) {
|
|
10912
|
+
if (isBarcodeSuccess) {
|
|
10913
|
+
return /*#__PURE__*/React__namespace.default.createElement(BarcodeSuccessOverlay, null);
|
|
10914
|
+
}
|
|
10915
|
+
return /*#__PURE__*/React__namespace.default.createElement(BarcodeGuideOverlay, {
|
|
10916
|
+
headerText: barcodeHeaderText,
|
|
10917
|
+
instructionText: barcodeInstructionText
|
|
10918
|
+
});
|
|
10919
|
+
}
|
|
10920
|
+
// Client barcode scanning happens silently in the background
|
|
10921
|
+
// during normal ID back capture - no special UI needed here
|
|
9628
10922
|
return /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, guideType === 'overlay' && (/*#__PURE__*/React__namespace.default.createElement(IdCaptureGuideOverlay, {
|
|
9629
10923
|
images: images,
|
|
9630
10924
|
classNames: classNames,
|
|
@@ -9649,7 +10943,7 @@ function IdCaptureGuides(_a) {
|
|
|
9649
10943
|
})));
|
|
9650
10944
|
}
|
|
9651
10945
|
|
|
9652
|
-
var Spinner = styled__default.default.div(templateObject_1$
|
|
10946
|
+
var Spinner = styled__default.default.div(templateObject_1$x || (templateObject_1$x = __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) {
|
|
9653
10947
|
var $size = _a.$size;
|
|
9654
10948
|
return $size !== null && $size !== void 0 ? $size : 80;
|
|
9655
10949
|
}, function (_a) {
|
|
@@ -9674,11 +10968,11 @@ var Spinner = styled__default.default.div(templateObject_1$w || (templateObject_
|
|
|
9674
10968
|
var $color = _a.$color;
|
|
9675
10969
|
return $color !== null && $color !== void 0 ? $color : '#888';
|
|
9676
10970
|
}, dualRingSpinnerAnimation);
|
|
9677
|
-
var SpinnerPageContainer = styled__default.default.div(templateObject_2$
|
|
10971
|
+
var SpinnerPageContainer = styled__default.default.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"], ["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"])));
|
|
9678
10972
|
function SpinnerPage() {
|
|
9679
10973
|
return /*#__PURE__*/React__namespace.default.createElement(SpinnerPageContainer, null, /*#__PURE__*/React__namespace.default.createElement(Spinner, null));
|
|
9680
10974
|
}
|
|
9681
|
-
var templateObject_1$
|
|
10975
|
+
var templateObject_1$x, templateObject_2$u;
|
|
9682
10976
|
|
|
9683
10977
|
var IdCaptureImagePreview = function IdCaptureImagePreview(_a) {
|
|
9684
10978
|
var _b = _a.classNames,
|
|
@@ -9765,11 +11059,11 @@ var SelfieProgressPreview = function SelfieProgressPreview(_a) {
|
|
|
9765
11059
|
onError: onError
|
|
9766
11060
|
})));
|
|
9767
11061
|
};
|
|
9768
|
-
var StyledSpinner = styled__default.default(Spinner)(templateObject_1$
|
|
9769
|
-
var ImagePreviewWrapper = styled__default.default.div(templateObject_2$
|
|
9770
|
-
var ImagePreviewText = styled__default.default.div(templateObject_3$
|
|
9771
|
-
var ImagePreviewImageWrapper = styled__default.default.div(templateObject_4$
|
|
9772
|
-
var templateObject_1$
|
|
11062
|
+
var StyledSpinner = styled__default.default(Spinner)(templateObject_1$w || (templateObject_1$w = __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"])));
|
|
11063
|
+
var ImagePreviewWrapper = styled__default.default.div(templateObject_2$t || (templateObject_2$t = __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"])));
|
|
11064
|
+
var ImagePreviewText = styled__default.default.div(templateObject_3$m || (templateObject_3$m = __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"])));
|
|
11065
|
+
var ImagePreviewImageWrapper = styled__default.default.div(templateObject_4$g || (templateObject_4$g = __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"])));
|
|
11066
|
+
var templateObject_1$w, templateObject_2$t, templateObject_3$m, templateObject_4$g;
|
|
9773
11067
|
|
|
9774
11068
|
var documentCaptureInitialState = {
|
|
9775
11069
|
documents: [],
|
|
@@ -10115,16 +11409,16 @@ var DocumentCaptureGuideOverlay = function DocumentCaptureGuideOverlay(_a) {
|
|
|
10115
11409
|
ref: canvasRef
|
|
10116
11410
|
}));
|
|
10117
11411
|
};
|
|
10118
|
-
var CanvasWrapper = styled__default.default.div(templateObject_1$
|
|
11412
|
+
var CanvasWrapper = styled__default.default.div(templateObject_1$v || (templateObject_1$v = __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) {
|
|
10119
11413
|
return props.$maskColor;
|
|
10120
11414
|
});
|
|
10121
|
-
var Canvas = styled__default.default.canvas(templateObject_2$
|
|
10122
|
-
var templateObject_1$
|
|
11415
|
+
var Canvas = styled__default.default.canvas(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
11416
|
+
var templateObject_1$v, templateObject_2$s;
|
|
10123
11417
|
|
|
10124
|
-
var CameraFeedWrapper = styled__default.default.div(templateObject_1$
|
|
11418
|
+
var CameraFeedWrapper = styled__default.default.div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
10125
11419
|
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;") : "";
|
|
10126
11420
|
});
|
|
10127
|
-
var templateObject_1$
|
|
11421
|
+
var templateObject_1$u;
|
|
10128
11422
|
|
|
10129
11423
|
var CameraVideoTag = function CameraVideoTag(props) {
|
|
10130
11424
|
var _a = useCameraStore(shallow.useShallow(function (store) {
|
|
@@ -10154,10 +11448,10 @@ var CameraVideoTag = function CameraVideoTag(props) {
|
|
|
10154
11448
|
"$isRearFacing": isRearFacing
|
|
10155
11449
|
}, props));
|
|
10156
11450
|
};
|
|
10157
|
-
var FullscreenVideoTag = styled__default.default.video(templateObject_1$
|
|
11451
|
+
var FullscreenVideoTag = styled__default.default.video(templateObject_1$t || (templateObject_1$t = __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) {
|
|
10158
11452
|
return props.$isRearFacing ? '' : 'scaleX(-1)';
|
|
10159
11453
|
});
|
|
10160
|
-
var templateObject_1$
|
|
11454
|
+
var templateObject_1$t;
|
|
10161
11455
|
|
|
10162
11456
|
var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
10163
11457
|
var _b, _c, _d, _e;
|
|
@@ -10304,21 +11598,21 @@ var DocumentCaptureScreen = function DocumentCaptureScreen(_a) {
|
|
|
10304
11598
|
disabled: !cameraReady || capturing
|
|
10305
11599
|
}, !cameraReady ? verbiage.loadingBtnText : capturing ? verbiage.capturingBtnText : verbiage.captureBtnText))))));
|
|
10306
11600
|
};
|
|
10307
|
-
var CaptureContainer = styled__default.default.div(templateObject_1$
|
|
10308
|
-
var HeadingRow = styled__default.default.div(templateObject_2$
|
|
11601
|
+
var CaptureContainer = styled__default.default.div(templateObject_1$s || (templateObject_1$s = __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"])));
|
|
11602
|
+
var HeadingRow = styled__default.default.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n color: white;\n"], ["\n background: ", ";\n text-align: center;\n color: white;\n"])), function (props) {
|
|
10309
11603
|
return props.$maskColor;
|
|
10310
11604
|
});
|
|
10311
|
-
var Heading$9 = styled__default.default.h1(templateObject_3$
|
|
10312
|
-
var FooterRow = styled__default.default.div(templateObject_4$
|
|
11605
|
+
var Heading$9 = styled__default.default.h1(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n font-size: 22px;\n"], ["\n font-size: 22px;\n"])));
|
|
11606
|
+
var FooterRow = styled__default.default.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"], ["\n background: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0 20px 20px;\n height: auto;\n color: white;\n"])), function (props) {
|
|
10313
11607
|
return props.$maskColor;
|
|
10314
11608
|
});
|
|
10315
|
-
var Instructions = styled__default.default.div(templateObject_5$
|
|
11609
|
+
var Instructions = styled__default.default.div(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n max-height: ", ";\n overflow-y: auto;\n"], ["\n max-height: ", ";\n overflow-y: auto;\n"])), function (props) {
|
|
10316
11610
|
var _a, _b, _c;
|
|
10317
11611
|
return (_c = (_b = (_a = props.theme.documentCapture) === null || _a === void 0 ? void 0 : _a.instructions) === null || _b === void 0 ? void 0 : _b.maxHeight) !== null && _c !== void 0 ? _c : '8rem';
|
|
10318
11612
|
});
|
|
10319
|
-
var StyledButtonsRow$8 = styled__default.default(ButtonsRow$2)(templateObject_6$
|
|
10320
|
-
var PreviewImage = styled__default.default.img(templateObject_7$
|
|
10321
|
-
var templateObject_1$
|
|
11613
|
+
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"])));
|
|
11614
|
+
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"])));
|
|
11615
|
+
var templateObject_1$s, templateObject_2$r, templateObject_3$l, templateObject_4$f, templateObject_5$b, templateObject_6$6, templateObject_7$4;
|
|
10322
11616
|
|
|
10323
11617
|
var DocumentCaptureWizard = function DocumentCaptureWizard(_a) {
|
|
10324
11618
|
var onSuccess = _a.onSuccess,
|
|
@@ -10542,7 +11836,7 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
|
|
|
10542
11836
|
className: classNames.inner
|
|
10543
11837
|
}, !silentFallback && (/*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(Heading$8, {
|
|
10544
11838
|
className: classNames.heading
|
|
10545
|
-
}, verbiage.headingText), /*#__PURE__*/React__namespace.default.createElement(Description$
|
|
11839
|
+
}, verbiage.headingText), /*#__PURE__*/React__namespace.default.createElement(Description$4, {
|
|
10546
11840
|
className: classNames.description
|
|
10547
11841
|
}, verbiage.descriptionText))), (images.length > 0 || isProcessing) && (/*#__PURE__*/React__namespace.default.createElement(OverlayImageRow, {
|
|
10548
11842
|
className: classNames.imageContainer
|
|
@@ -10589,13 +11883,13 @@ var IdCaptureFallback = function IdCaptureFallback(_a) {
|
|
|
10589
11883
|
}
|
|
10590
11884
|
}, verbiage.doneBtnText))))));
|
|
10591
11885
|
};
|
|
10592
|
-
var StyledOverlayInner$2 = styled__default.default(OverlayInner$2)(templateObject_1$
|
|
10593
|
-
var Heading$8 = styled__default.default.h3(templateObject_2$
|
|
10594
|
-
var Description$
|
|
10595
|
-
var Instruction = styled__default.default.p(templateObject_4$
|
|
10596
|
-
var ImageCol = styled__default.default.div(templateObject_5$
|
|
10597
|
-
var StyledButtonsRow$7 = styled__default.default(ButtonsRow$2)(templateObject_6$
|
|
10598
|
-
var templateObject_1$
|
|
11886
|
+
var StyledOverlayInner$2 = styled__default.default(OverlayInner$2)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
11887
|
+
var Heading$8 = styled__default.default.h3(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
11888
|
+
var Description$4 = styled__default.default.p(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
11889
|
+
var Instruction = styled__default.default.p(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
11890
|
+
var ImageCol = styled__default.default.div(templateObject_5$a || (templateObject_5$a = __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"])));
|
|
11891
|
+
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"])));
|
|
11892
|
+
var templateObject_1$r, templateObject_2$q, templateObject_3$k, templateObject_4$e, templateObject_5$a, templateObject_6$5;
|
|
10599
11893
|
|
|
10600
11894
|
function ScalingCameraFeed() {
|
|
10601
11895
|
var _a = useIdCaptureStore(),
|
|
@@ -10655,7 +11949,7 @@ function IdCaptureOrUploadScreen(_a) {
|
|
|
10655
11949
|
className: classNames.captureWithCameraPanel
|
|
10656
11950
|
}, /*#__PURE__*/React__namespace.default.createElement(CameraIcon, {
|
|
10657
11951
|
className: classNames.captureWithCameraIcon
|
|
10658
|
-
}), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
11952
|
+
}), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10659
11953
|
className: classNames.captureWithCameraButton,
|
|
10660
11954
|
colors: buttonColors,
|
|
10661
11955
|
onClick: function onClick() {
|
|
@@ -10674,7 +11968,7 @@ function IdCaptureOrUploadScreen(_a) {
|
|
|
10674
11968
|
className: classNames.uploadFromStoragePanel
|
|
10675
11969
|
}, /*#__PURE__*/React__namespace.default.createElement(UploadIcon, {
|
|
10676
11970
|
className: classNames.uploadFromStorageIcon
|
|
10677
|
-
}), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
11971
|
+
}), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10678
11972
|
className: classNames.uploadFromStorageButton,
|
|
10679
11973
|
colors: buttonColors,
|
|
10680
11974
|
onClick: function onClick() {
|
|
@@ -10698,7 +11992,7 @@ function IdCaptureOrUploadScreen(_a) {
|
|
|
10698
11992
|
}
|
|
10699
11993
|
}, verbiage.uploadFromStorageText, /*#__PURE__*/React__namespace.default.createElement(ArrowIcon, null)))), selectIdTypeModalOpen && (/*#__PURE__*/React__namespace.default.createElement(Modal, {
|
|
10700
11994
|
className: classNames.selectIdTypeModal
|
|
10701
|
-
}, /*#__PURE__*/React__namespace.default.createElement(Dialog, {
|
|
11995
|
+
}, /*#__PURE__*/React__namespace.default.createElement(Dialog$1, {
|
|
10702
11996
|
className: classNames.selectIdTypeDialog
|
|
10703
11997
|
}, /*#__PURE__*/React__namespace.default.createElement(ScreenPanel, {
|
|
10704
11998
|
className: classNames.selectPassportTypePanel
|
|
@@ -10706,7 +12000,7 @@ function IdCaptureOrUploadScreen(_a) {
|
|
|
10706
12000
|
className: classNames.selectIdTypeHeading
|
|
10707
12001
|
}, verbiage.selectIdTypeText), /*#__PURE__*/React__namespace.default.createElement(PassportIcon, {
|
|
10708
12002
|
className: classNames.selectPassportTypeIcon
|
|
10709
|
-
}), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
12003
|
+
}), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10710
12004
|
className: classNames.selectPassportTypeButton,
|
|
10711
12005
|
colors: buttonColors,
|
|
10712
12006
|
onClick: function onClick() {
|
|
@@ -10719,7 +12013,7 @@ function IdCaptureOrUploadScreen(_a) {
|
|
|
10719
12013
|
className: classNames.selectIdCardTypePanel
|
|
10720
12014
|
}, /*#__PURE__*/React__namespace.default.createElement(IdDocumentIcon, {
|
|
10721
12015
|
className: classNames.selectIdCardTypeIcon
|
|
10722
|
-
}), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
12016
|
+
}), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10723
12017
|
className: classNames.selectIdCardTypeButton,
|
|
10724
12018
|
colors: buttonColors,
|
|
10725
12019
|
onClick: function onClick() {
|
|
@@ -10764,7 +12058,7 @@ function PassportUploadScreen(_a) {
|
|
|
10764
12058
|
className: classNames.actionsBar
|
|
10765
12059
|
}, /*#__PURE__*/React__namespace.default.createElement(CancelUploadTypeButton, {
|
|
10766
12060
|
className: classNames.cancelButton
|
|
10767
|
-
}, verbiage.cancelText), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
12061
|
+
}, verbiage.cancelText), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10768
12062
|
className: classNames.continueButton,
|
|
10769
12063
|
disabled: !file,
|
|
10770
12064
|
colors: buttonColors,
|
|
@@ -10836,7 +12130,7 @@ function IdDocumentUploadScreen(_a) {
|
|
|
10836
12130
|
className: classNames.actionsBar
|
|
10837
12131
|
}, /*#__PURE__*/React__namespace.default.createElement(CancelUploadTypeButton, {
|
|
10838
12132
|
className: classNames.cancelButton
|
|
10839
|
-
}, verbiage.cancelText), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
12133
|
+
}, verbiage.cancelText), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10840
12134
|
className: classNames.continueButton,
|
|
10841
12135
|
disabled: !idFrontFile || !state.allowSinglePageIdCapture && !idBackFile,
|
|
10842
12136
|
colors: buttonColors,
|
|
@@ -10878,7 +12172,7 @@ function IdDocumentUploadScreen(_a) {
|
|
|
10878
12172
|
function CancelUploadTypeButton(_a) {
|
|
10879
12173
|
var children = _a.children,
|
|
10880
12174
|
className = _a.className;
|
|
10881
|
-
return /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
12175
|
+
return /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10882
12176
|
className: className,
|
|
10883
12177
|
colors: buttonColors,
|
|
10884
12178
|
onClick: function onClick() {
|
|
@@ -10937,7 +12231,7 @@ function FilePickerButton(_a) {
|
|
|
10937
12231
|
setFile(file);
|
|
10938
12232
|
onFileSelected === null || onFileSelected === void 0 ? void 0 : onFileSelected(file);
|
|
10939
12233
|
}
|
|
10940
|
-
}), /*#__PURE__*/React__namespace.default.createElement(Button, {
|
|
12234
|
+
}), /*#__PURE__*/React__namespace.default.createElement(Button$1, {
|
|
10941
12235
|
className: className,
|
|
10942
12236
|
colors: buttonColors,
|
|
10943
12237
|
onClick: function onClick() {
|
|
@@ -10947,24 +12241,24 @@ function FilePickerButton(_a) {
|
|
|
10947
12241
|
}
|
|
10948
12242
|
}, file ? "".concat(file.name, " (").concat(humanFileSize(file.size), ")") : filePickerLoading ? loadingText : children));
|
|
10949
12243
|
}
|
|
10950
|
-
var ScreenContainer = styled__default.default.div(templateObject_1$
|
|
12244
|
+
var ScreenContainer = styled__default.default.div(templateObject_1$q || (templateObject_1$q = __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) {
|
|
10951
12245
|
var _a;
|
|
10952
12246
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
10953
12247
|
});
|
|
10954
|
-
var ScreenPanel = styled__default.default.div(templateObject_2$
|
|
10955
|
-
var SelectIdCardScreenPanel = styled__default.default(ScreenPanel)(templateObject_3$
|
|
10956
|
-
var ScreenPanelHeading = styled__default.default.h3(templateObject_4$
|
|
10957
|
-
var ScreenActionsBar = styled__default.default.div(templateObject_5$
|
|
10958
|
-
var DashedSeparator = styled__default.default.div(templateObject_6$
|
|
10959
|
-
var OrWrapper = styled__default.default.div(templateObject_7$
|
|
10960
|
-
var UploadIdBackHelpText = styled__default.default.p(templateObject_8$
|
|
10961
|
-
var Button = styled__default.default(WideBorderButton)(templateObject_9$
|
|
10962
|
-
var Modal = styled__default.default.div(templateObject_10$
|
|
10963
|
-
var Dialog = styled__default.default.div(templateObject_11$
|
|
12248
|
+
var ScreenPanel = styled__default.default.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n flex-grow: 1;\n background: #f7f6fb;\n box-sizing: border-box;\n padding: 40px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n flex-grow: 1;\n background: #f7f6fb;\n box-sizing: border-box;\n padding: 40px;\n"])));
|
|
12249
|
+
var SelectIdCardScreenPanel = styled__default.default(ScreenPanel)(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n background: white;\n padding: 80px 0;\n\n @media (max-height: 1000px) {\n padding: 40px 0;\n }\n"], ["\n background: white;\n padding: 80px 0;\n\n @media (max-height: 1000px) {\n padding: 40px 0;\n }\n"])));
|
|
12250
|
+
var ScreenPanelHeading = styled__default.default.h3(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n margin: 0 0 30px;\n"], ["\n margin: 0 0 30px;\n"])));
|
|
12251
|
+
var ScreenActionsBar = styled__default.default.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n border-top: 1px solid #ccc;\n\n @media (max-width: 600px) {\n justify-content: center;\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: end;\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n border-top: 1px solid #ccc;\n\n @media (max-width: 600px) {\n justify-content: center;\n }\n"])));
|
|
12252
|
+
var DashedSeparator = styled__default.default.div(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n width: 100%;\n height: 0;\n border-top: 2px solid #606060;\n border-top-style: dashed;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n width: 100%;\n height: 0;\n border-top: 2px solid #606060;\n border-top-style: dashed;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
12253
|
+
var OrWrapper = styled__default.default.div(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n color: #323232;\n font-weight: bold;\n background: white;\n border-radius: 50%;\n top: -2px;\n position: relative;\n width: 60px;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n color: #323232;\n font-weight: bold;\n background: white;\n border-radius: 50%;\n top: -2px;\n position: relative;\n width: 60px;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
12254
|
+
var UploadIdBackHelpText = styled__default.default.p(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n color: #323232;\n font-style: italic;\n margin: 30px 0 0;\n"], ["\n color: #323232;\n font-style: italic;\n margin: 30px 0 0;\n"])));
|
|
12255
|
+
var Button$1 = styled__default.default(WideBorderButton)(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n width: auto;\n font-weight: 500;\n padding-left: 40px;\n padding-right: 40px;\n transition: background-color 0.3s ease;\n background-color: #ffffff;\n white-space: nowrap;\n\n &:disabled,\n &.disabled {\n background-color: #f1f1f1 !important;\n border-color: #dbdbdb !important;\n color: #323232 !important;\n }\n\n &:hover {\n filter: none;\n background-color: #fafafa !important;\n }\n"], ["\n width: auto;\n font-weight: 500;\n padding-left: 40px;\n padding-right: 40px;\n transition: background-color 0.3s ease;\n background-color: #ffffff;\n white-space: nowrap;\n\n &:disabled,\n &.disabled {\n background-color: #f1f1f1 !important;\n border-color: #dbdbdb !important;\n color: #323232 !important;\n }\n\n &:hover {\n filter: none;\n background-color: #fafafa !important;\n }\n"])));
|
|
12256
|
+
var Modal = styled__default.default.div(templateObject_10$2 || (templateObject_10$2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10000;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 10000;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])));
|
|
12257
|
+
var Dialog$1 = styled__default.default.div(templateObject_11$2 || (templateObject_11$2 = __makeTemplateObject(["\n width: 100%;\n max-width: 500px;\n height: 100%;\n max-height: 600px;\n background: white;\n border-radius: 25px;\n overflow: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n font-family: ", ";\n //margin: 25px;\n"], ["\n width: 100%;\n max-width: 500px;\n height: 100%;\n max-height: 600px;\n background: white;\n border-radius: 25px;\n overflow: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n font-family: ", ";\n //margin: 25px;\n"])), function (props) {
|
|
10964
12258
|
var _a;
|
|
10965
12259
|
return (_a = props.theme) === null || _a === void 0 ? void 0 : _a.fontFamily;
|
|
10966
12260
|
});
|
|
10967
|
-
var ModalCloseButton = styled__default.default.button(templateObject_12$
|
|
12261
|
+
var ModalCloseButton = styled__default.default.button(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n width: 60px;\n height: 60px;\n background: black;\n color: whitesmoke;\n border-radius: 50%;\n font-size: 32px;\n border: none;\n cursor: pointer;\n margin: 20px 0;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n transition: background 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n padding: 0;\n\n &:hover {\n background: #222;\n color: white;\n }\n"], ["\n width: 60px;\n height: 60px;\n background: black;\n color: whitesmoke;\n border-radius: 50%;\n font-size: 32px;\n border: none;\n cursor: pointer;\n margin: 20px 0;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);\n transition: background 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n padding: 0;\n\n &:hover {\n background: #222;\n color: white;\n }\n"])));
|
|
10968
12262
|
function XIcon(props) {
|
|
10969
12263
|
return /*#__PURE__*/React__namespace.default.createElement("svg", _assign({
|
|
10970
12264
|
width: "25",
|
|
@@ -11155,88 +12449,537 @@ function IdDocumentIcon(props) {
|
|
|
11155
12449
|
style: {
|
|
11156
12450
|
marginBottom: 30
|
|
11157
12451
|
}
|
|
11158
|
-
}, props), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
11159
|
-
d: "M18 41C18 41 18.5 33 24.5 33C30.5 33 31 41 31 41",
|
|
11160
|
-
stroke: "black",
|
|
11161
|
-
strokeWidth: "3",
|
|
11162
|
-
strokeLinecap: "round",
|
|
11163
|
-
strokeLinejoin: "round"
|
|
11164
|
-
}), /*#__PURE__*/React__namespace.default.createElement("rect", {
|
|
11165
|
-
x: "2",
|
|
11166
|
-
y: "2",
|
|
11167
|
-
width: "88",
|
|
11168
|
-
height: "58",
|
|
11169
|
-
rx: "6",
|
|
11170
|
-
stroke: "black",
|
|
11171
|
-
strokeWidth: "3"
|
|
11172
|
-
}), /*#__PURE__*/React__namespace.default.createElement("rect", {
|
|
11173
|
-
x: "10",
|
|
11174
|
-
y: "15",
|
|
11175
|
-
width: "29",
|
|
11176
|
-
height: "30",
|
|
11177
|
-
rx: "3",
|
|
11178
|
-
stroke: "black",
|
|
11179
|
-
strokeWidth: "3"
|
|
11180
|
-
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
11181
|
-
d: "M48 17H80",
|
|
11182
|
-
stroke: "black",
|
|
11183
|
-
strokeWidth: "3",
|
|
11184
|
-
strokeLinecap: "round",
|
|
11185
|
-
strokeLinejoin: "round"
|
|
11186
|
-
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
11187
|
-
d: "M48 35H80",
|
|
11188
|
-
stroke: "black",
|
|
11189
|
-
strokeWidth: "3",
|
|
11190
|
-
strokeLinecap: "round",
|
|
11191
|
-
strokeLinejoin: "round"
|
|
11192
|
-
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
11193
|
-
d: "M48 44H62",
|
|
11194
|
-
stroke: "black",
|
|
11195
|
-
strokeWidth: "3",
|
|
11196
|
-
strokeLinecap: "round",
|
|
11197
|
-
strokeLinejoin: "round"
|
|
11198
|
-
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
11199
|
-
d: "M48 26H69",
|
|
11200
|
-
stroke: "black",
|
|
11201
|
-
strokeWidth: "3",
|
|
11202
|
-
strokeLinecap: "round",
|
|
11203
|
-
strokeLinejoin: "round"
|
|
11204
|
-
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
11205
|
-
d: "M74 26L80 26",
|
|
11206
|
-
stroke: "black",
|
|
11207
|
-
strokeWidth: "3",
|
|
11208
|
-
strokeLinecap: "round",
|
|
11209
|
-
strokeLinejoin: "round"
|
|
11210
|
-
}), /*#__PURE__*/React__namespace.default.createElement("circle", {
|
|
11211
|
-
cx: "24.5",
|
|
11212
|
-
cy: "26.5",
|
|
11213
|
-
r: "6.5",
|
|
11214
|
-
stroke: "black",
|
|
11215
|
-
strokeWidth: "3"
|
|
11216
|
-
}));
|
|
12452
|
+
}, props), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
12453
|
+
d: "M18 41C18 41 18.5 33 24.5 33C30.5 33 31 41 31 41",
|
|
12454
|
+
stroke: "black",
|
|
12455
|
+
strokeWidth: "3",
|
|
12456
|
+
strokeLinecap: "round",
|
|
12457
|
+
strokeLinejoin: "round"
|
|
12458
|
+
}), /*#__PURE__*/React__namespace.default.createElement("rect", {
|
|
12459
|
+
x: "2",
|
|
12460
|
+
y: "2",
|
|
12461
|
+
width: "88",
|
|
12462
|
+
height: "58",
|
|
12463
|
+
rx: "6",
|
|
12464
|
+
stroke: "black",
|
|
12465
|
+
strokeWidth: "3"
|
|
12466
|
+
}), /*#__PURE__*/React__namespace.default.createElement("rect", {
|
|
12467
|
+
x: "10",
|
|
12468
|
+
y: "15",
|
|
12469
|
+
width: "29",
|
|
12470
|
+
height: "30",
|
|
12471
|
+
rx: "3",
|
|
12472
|
+
stroke: "black",
|
|
12473
|
+
strokeWidth: "3"
|
|
12474
|
+
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
12475
|
+
d: "M48 17H80",
|
|
12476
|
+
stroke: "black",
|
|
12477
|
+
strokeWidth: "3",
|
|
12478
|
+
strokeLinecap: "round",
|
|
12479
|
+
strokeLinejoin: "round"
|
|
12480
|
+
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
12481
|
+
d: "M48 35H80",
|
|
12482
|
+
stroke: "black",
|
|
12483
|
+
strokeWidth: "3",
|
|
12484
|
+
strokeLinecap: "round",
|
|
12485
|
+
strokeLinejoin: "round"
|
|
12486
|
+
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
12487
|
+
d: "M48 44H62",
|
|
12488
|
+
stroke: "black",
|
|
12489
|
+
strokeWidth: "3",
|
|
12490
|
+
strokeLinecap: "round",
|
|
12491
|
+
strokeLinejoin: "round"
|
|
12492
|
+
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
12493
|
+
d: "M48 26H69",
|
|
12494
|
+
stroke: "black",
|
|
12495
|
+
strokeWidth: "3",
|
|
12496
|
+
strokeLinecap: "round",
|
|
12497
|
+
strokeLinejoin: "round"
|
|
12498
|
+
}), /*#__PURE__*/React__namespace.default.createElement("path", {
|
|
12499
|
+
d: "M74 26L80 26",
|
|
12500
|
+
stroke: "black",
|
|
12501
|
+
strokeWidth: "3",
|
|
12502
|
+
strokeLinecap: "round",
|
|
12503
|
+
strokeLinejoin: "round"
|
|
12504
|
+
}), /*#__PURE__*/React__namespace.default.createElement("circle", {
|
|
12505
|
+
cx: "24.5",
|
|
12506
|
+
cy: "26.5",
|
|
12507
|
+
r: "6.5",
|
|
12508
|
+
stroke: "black",
|
|
12509
|
+
strokeWidth: "3"
|
|
12510
|
+
}));
|
|
12511
|
+
}
|
|
12512
|
+
var InlineSvg = styled__default.default.svg(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject(["\n display: inline;\n"], ["\n display: inline;\n"])));
|
|
12513
|
+
function humanFileSize(bytes, si, dp) {
|
|
12514
|
+
if (si === void 0) {
|
|
12515
|
+
si = false;
|
|
12516
|
+
}
|
|
12517
|
+
if (dp === void 0) {
|
|
12518
|
+
dp = 1;
|
|
12519
|
+
}
|
|
12520
|
+
var thresh = si ? 1000 : 1024;
|
|
12521
|
+
if (Math.abs(bytes) < thresh) {
|
|
12522
|
+
return bytes + ' B';
|
|
12523
|
+
}
|
|
12524
|
+
var units = si ? ['kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'] : ['KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB'];
|
|
12525
|
+
var u = -1;
|
|
12526
|
+
var r = Math.pow(10, dp);
|
|
12527
|
+
do {
|
|
12528
|
+
bytes /= thresh;
|
|
12529
|
+
++u;
|
|
12530
|
+
} while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
|
|
12531
|
+
return bytes.toFixed(dp) + ' ' + units[u];
|
|
12532
|
+
}
|
|
12533
|
+
var templateObject_1$q, templateObject_2$p, templateObject_3$j, templateObject_4$d, templateObject_5$9, templateObject_6$4, templateObject_7$3, templateObject_8$3, templateObject_9$2, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2;
|
|
12534
|
+
|
|
12535
|
+
/**
|
|
12536
|
+
* Lazy loader for Dynamsoft Barcode Reader Bundle from CDN
|
|
12537
|
+
* Only loads when client-side barcode scanning is enabled.
|
|
12538
|
+
*/
|
|
12539
|
+
var DYNAMSOFT_CDN_URL = 'https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.0.3000/dist/dbr.bundle.min.js';
|
|
12540
|
+
var loadPromise = null;
|
|
12541
|
+
var isInitialized = false;
|
|
12542
|
+
function isDynamsoftLoaded() {
|
|
12543
|
+
return typeof window !== 'undefined' && !!window.Dynamsoft;
|
|
12544
|
+
}
|
|
12545
|
+
function loadScript(url) {
|
|
12546
|
+
return new Promise(function (resolve, reject) {
|
|
12547
|
+
if (document.querySelector("script[src=\"".concat(url, "\"]"))) {
|
|
12548
|
+
resolve();
|
|
12549
|
+
return;
|
|
12550
|
+
}
|
|
12551
|
+
var script = document.createElement('script');
|
|
12552
|
+
script.src = url;
|
|
12553
|
+
script.async = true;
|
|
12554
|
+
script.onload = function () {
|
|
12555
|
+
document.dispatchEvent(new CustomEvent('idmission.dynamsoftLoaded', {
|
|
12556
|
+
detail: {
|
|
12557
|
+
url: url
|
|
12558
|
+
}
|
|
12559
|
+
}));
|
|
12560
|
+
resolve();
|
|
12561
|
+
};
|
|
12562
|
+
script.onerror = function () {
|
|
12563
|
+
reject(new Error("Failed to load Dynamsoft SDK from ".concat(url)));
|
|
12564
|
+
};
|
|
12565
|
+
document.head.appendChild(script);
|
|
12566
|
+
});
|
|
12567
|
+
}
|
|
12568
|
+
function loadDynamsoftSDK() {
|
|
12569
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
12570
|
+
return __generator(this, function (_a) {
|
|
12571
|
+
if (isDynamsoftLoaded()) {
|
|
12572
|
+
return [2 /*return*/, window.Dynamsoft];
|
|
12573
|
+
}
|
|
12574
|
+
if (loadPromise) {
|
|
12575
|
+
return [2 /*return*/, loadPromise];
|
|
12576
|
+
}
|
|
12577
|
+
loadPromise = loadScript(DYNAMSOFT_CDN_URL).then(function () {
|
|
12578
|
+
if (!window.Dynamsoft) {
|
|
12579
|
+
throw new Error('Dynamsoft SDK failed to initialize after loading');
|
|
12580
|
+
}
|
|
12581
|
+
return window.Dynamsoft;
|
|
12582
|
+
});
|
|
12583
|
+
return [2 /*return*/, loadPromise];
|
|
12584
|
+
});
|
|
12585
|
+
});
|
|
12586
|
+
}
|
|
12587
|
+
function initializeDynamsoft(config) {
|
|
12588
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
12589
|
+
var Dynamsoft, licenseValue, orgIdJson, base64;
|
|
12590
|
+
return __generator(this, function (_a) {
|
|
12591
|
+
switch (_a.label) {
|
|
12592
|
+
case 0:
|
|
12593
|
+
return [4 /*yield*/, loadDynamsoftSDK()];
|
|
12594
|
+
case 1:
|
|
12595
|
+
Dynamsoft = _a.sent();
|
|
12596
|
+
if (isInitialized) {
|
|
12597
|
+
return [2 /*return*/, Dynamsoft];
|
|
12598
|
+
}
|
|
12599
|
+
if (config.organizationId) {
|
|
12600
|
+
orgIdJson = JSON.stringify({
|
|
12601
|
+
organizationID: config.organizationId
|
|
12602
|
+
});
|
|
12603
|
+
base64 = btoa(orgIdJson);
|
|
12604
|
+
licenseValue = "DLS2".concat(base64);
|
|
12605
|
+
} else {
|
|
12606
|
+
licenseValue = config.licenseKey;
|
|
12607
|
+
}
|
|
12608
|
+
return [4 /*yield*/, Dynamsoft.License.LicenseManager.initLicense(licenseValue)];
|
|
12609
|
+
case 2:
|
|
12610
|
+
_a.sent();
|
|
12611
|
+
isInitialized = true;
|
|
12612
|
+
document.dispatchEvent(new CustomEvent('idmission.dynamsoftInitialized', {
|
|
12613
|
+
detail: {
|
|
12614
|
+
success: true
|
|
12615
|
+
}
|
|
12616
|
+
}));
|
|
12617
|
+
return [2 /*return*/, Dynamsoft];
|
|
12618
|
+
}
|
|
12619
|
+
});
|
|
12620
|
+
});
|
|
12621
|
+
}
|
|
12622
|
+
|
|
12623
|
+
var STORAGE_KEY = 'idmission_dynamsoft_license';
|
|
12624
|
+
function DynamsoftLicensePrompt(_a) {
|
|
12625
|
+
var onLicenseSubmit = _a.onLicenseSubmit,
|
|
12626
|
+
onCancel = _a.onCancel;
|
|
12627
|
+
var _b = React.useState(''),
|
|
12628
|
+
licenseKey = _b[0],
|
|
12629
|
+
setLicenseKey = _b[1];
|
|
12630
|
+
// Check for stored license on mount
|
|
12631
|
+
React.useEffect(function () {
|
|
12632
|
+
var stored = localStorage.getItem(STORAGE_KEY);
|
|
12633
|
+
if (stored) {
|
|
12634
|
+
setLicenseKey(stored);
|
|
12635
|
+
}
|
|
12636
|
+
}, []);
|
|
12637
|
+
var handleSubmit = React.useCallback(function (e) {
|
|
12638
|
+
e.preventDefault();
|
|
12639
|
+
var trimmedKey = licenseKey.trim();
|
|
12640
|
+
if (trimmedKey) {
|
|
12641
|
+
// Store for future sessions
|
|
12642
|
+
localStorage.setItem(STORAGE_KEY, trimmedKey);
|
|
12643
|
+
onLicenseSubmit(trimmedKey);
|
|
12644
|
+
}
|
|
12645
|
+
}, [licenseKey, onLicenseSubmit]);
|
|
12646
|
+
var handleUseSaved = React.useCallback(function () {
|
|
12647
|
+
var stored = localStorage.getItem(STORAGE_KEY);
|
|
12648
|
+
if (stored) {
|
|
12649
|
+
onLicenseSubmit(stored);
|
|
12650
|
+
}
|
|
12651
|
+
}, [onLicenseSubmit]);
|
|
12652
|
+
var hasSavedLicense = !!localStorage.getItem(STORAGE_KEY);
|
|
12653
|
+
return /*#__PURE__*/React__namespace.default.createElement(Overlay, null, /*#__PURE__*/React__namespace.default.createElement(Dialog, null, /*#__PURE__*/React__namespace.default.createElement(Title$1, null, "Dynamsoft License Required"), /*#__PURE__*/React__namespace.default.createElement(Description$3, null, "Enter your Dynamsoft Barcode Reader license key to enable client-side barcode scanning. The key will be stored in your browser for future sessions."), /*#__PURE__*/React__namespace.default.createElement(Form, {
|
|
12654
|
+
onSubmit: handleSubmit
|
|
12655
|
+
}, /*#__PURE__*/React__namespace.default.createElement(TextArea, {
|
|
12656
|
+
value: licenseKey,
|
|
12657
|
+
onChange: function onChange(e) {
|
|
12658
|
+
return setLicenseKey(e.target.value);
|
|
12659
|
+
},
|
|
12660
|
+
placeholder: "Paste your Dynamsoft license key here...",
|
|
12661
|
+
rows: 4,
|
|
12662
|
+
autoFocus: true
|
|
12663
|
+
}), /*#__PURE__*/React__namespace.default.createElement(ButtonRow, null, onCancel && (/*#__PURE__*/React__namespace.default.createElement(CancelButton, {
|
|
12664
|
+
type: "button",
|
|
12665
|
+
onClick: onCancel
|
|
12666
|
+
}, "Skip")), hasSavedLicense && (/*#__PURE__*/React__namespace.default.createElement(SavedButton, {
|
|
12667
|
+
type: "button",
|
|
12668
|
+
onClick: handleUseSaved
|
|
12669
|
+
}, "Use Saved Key")), /*#__PURE__*/React__namespace.default.createElement(SubmitButton, {
|
|
12670
|
+
type: "submit",
|
|
12671
|
+
disabled: !licenseKey.trim()
|
|
12672
|
+
}, "Activate"))), /*#__PURE__*/React__namespace.default.createElement(HelpText, null, "Don't have a license?", ' ', /*#__PURE__*/React__namespace.default.createElement(HelpLink, {
|
|
12673
|
+
href: "https://www.dynamsoft.com/customer/license/trialLicense",
|
|
12674
|
+
target: "_blank",
|
|
12675
|
+
rel: "noopener noreferrer"
|
|
12676
|
+
}, "Get a free trial"))));
|
|
12677
|
+
}
|
|
12678
|
+
function getSavedDynamsoftLicense() {
|
|
12679
|
+
if (typeof window === 'undefined') return null;
|
|
12680
|
+
return localStorage.getItem(STORAGE_KEY);
|
|
12681
|
+
}
|
|
12682
|
+
var Overlay = styled__default.default.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.7);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10000;\n padding: 1rem;\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.7);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10000;\n padding: 1rem;\n"])));
|
|
12683
|
+
var Dialog = styled__default.default.div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n background: white;\n border-radius: 12px;\n padding: 1.5rem;\n max-width: 480px;\n width: 100%;\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n"], ["\n background: white;\n border-radius: 12px;\n padding: 1.5rem;\n max-width: 480px;\n width: 100%;\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n"])));
|
|
12684
|
+
var Title$1 = styled__default.default.h2(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n margin: 0 0 0.75rem 0;\n font-size: 1.25rem;\n color: #1a1a1a;\n"], ["\n margin: 0 0 0.75rem 0;\n font-size: 1.25rem;\n color: #1a1a1a;\n"])));
|
|
12685
|
+
var Description$3 = styled__default.default.p(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n margin: 0 0 1rem 0;\n font-size: 0.875rem;\n color: #666;\n line-height: 1.5;\n"], ["\n margin: 0 0 1rem 0;\n font-size: 0.875rem;\n color: #666;\n line-height: 1.5;\n"])));
|
|
12686
|
+
var Form = styled__default.default.form(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 1rem;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 1rem;\n"])));
|
|
12687
|
+
var TextArea = styled__default.default.textarea(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n width: 100%;\n box-sizing: border-box;\n padding: 0.75rem;\n border: 1px solid #ddd;\n border-radius: 8px;\n font-size: 0.8125rem;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n resize: vertical;\n min-height: 80px;\n\n &:focus {\n outline: none;\n border-color: #0066cc;\n box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);\n }\n\n &::placeholder {\n color: #999;\n }\n"], ["\n width: 100%;\n box-sizing: border-box;\n padding: 0.75rem;\n border: 1px solid #ddd;\n border-radius: 8px;\n font-size: 0.8125rem;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n resize: vertical;\n min-height: 80px;\n\n &:focus {\n outline: none;\n border-color: #0066cc;\n box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);\n }\n\n &::placeholder {\n color: #999;\n }\n"])));
|
|
12688
|
+
var ButtonRow = styled__default.default.div(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n display: flex;\n gap: 0.75rem;\n justify-content: flex-end;\n"], ["\n display: flex;\n gap: 0.75rem;\n justify-content: flex-end;\n"])));
|
|
12689
|
+
var Button = styled__default.default.button(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n border-radius: 6px;\n font-size: 0.875rem;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.15s ease;\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n"], ["\n padding: 0.625rem 1.25rem;\n border-radius: 6px;\n font-size: 0.875rem;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.15s ease;\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n"])));
|
|
12690
|
+
var SubmitButton = styled__default.default(Button)(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n background: #0066cc;\n color: white;\n border: none;\n\n &:hover:not(:disabled) {\n background: #0052a3;\n }\n"], ["\n background: #0066cc;\n color: white;\n border: none;\n\n &:hover:not(:disabled) {\n background: #0052a3;\n }\n"])));
|
|
12691
|
+
var CancelButton = styled__default.default(Button)(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n background: transparent;\n color: #666;\n border: 1px solid #ddd;\n\n &:hover {\n background: #f5f5f5;\n }\n"], ["\n background: transparent;\n color: #666;\n border: 1px solid #ddd;\n\n &:hover {\n background: #f5f5f5;\n }\n"])));
|
|
12692
|
+
var SavedButton = styled__default.default(Button)(templateObject_11$1 || (templateObject_11$1 = __makeTemplateObject(["\n background: #e8f4e8;\n color: #2e7d32;\n border: 1px solid #c8e6c9;\n\n &:hover {\n background: #c8e6c9;\n }\n"], ["\n background: #e8f4e8;\n color: #2e7d32;\n border: 1px solid #c8e6c9;\n\n &:hover {\n background: #c8e6c9;\n }\n"])));
|
|
12693
|
+
var HelpText = styled__default.default.p(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n margin: 1rem 0 0 0;\n font-size: 0.8125rem;\n color: #888;\n text-align: center;\n"], ["\n margin: 1rem 0 0 0;\n font-size: 0.8125rem;\n color: #888;\n text-align: center;\n"])));
|
|
12694
|
+
var HelpLink = styled__default.default.a(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject(["\n color: #0066cc;\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n"], ["\n color: #0066cc;\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n"])));
|
|
12695
|
+
var templateObject_1$p, templateObject_2$o, templateObject_3$i, templateObject_4$c, templateObject_5$8, templateObject_6$3, templateObject_7$2, templateObject_8$2, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1;
|
|
12696
|
+
|
|
12697
|
+
var DynamsoftBarcodeContext = /*#__PURE__*/React.createContext({
|
|
12698
|
+
loadState: 'not-started',
|
|
12699
|
+
error: null,
|
|
12700
|
+
lastDecodeResult: null,
|
|
12701
|
+
isScanning: false,
|
|
12702
|
+
startScanning: function startScanning() {},
|
|
12703
|
+
stopScanning: function stopScanning() {},
|
|
12704
|
+
resetDecodeResult: function resetDecodeResult() {}
|
|
12705
|
+
});
|
|
12706
|
+
function DynamsoftBarcodeProvider(_a) {
|
|
12707
|
+
var _this = this;
|
|
12708
|
+
var children = _a.children,
|
|
12709
|
+
organizationId = _a.organizationId,
|
|
12710
|
+
licenseKey = _a.licenseKey,
|
|
12711
|
+
_b = _a.promptForLicense,
|
|
12712
|
+
promptForLicense = _b === void 0 ? false : _b,
|
|
12713
|
+
_c = _a.enabled,
|
|
12714
|
+
enabled = _c === void 0 ? true : _c,
|
|
12715
|
+
onBarcodeDecoded = _a.onBarcodeDecoded,
|
|
12716
|
+
onError = _a.onError;
|
|
12717
|
+
var _d = React.useState('not-started'),
|
|
12718
|
+
loadState = _d[0],
|
|
12719
|
+
setLoadState = _d[1];
|
|
12720
|
+
var _e = React.useState(null),
|
|
12721
|
+
error = _e[0],
|
|
12722
|
+
setError = _e[1];
|
|
12723
|
+
var _f = React.useState(null),
|
|
12724
|
+
lastDecodeResult = _f[0],
|
|
12725
|
+
setLastDecodeResult = _f[1];
|
|
12726
|
+
var _g = React.useState(false),
|
|
12727
|
+
isScanning = _g[0],
|
|
12728
|
+
setIsScanning = _g[1];
|
|
12729
|
+
var _h = React.useState(null),
|
|
12730
|
+
promptedLicenseKey = _h[0],
|
|
12731
|
+
setPromptedLicenseKey = _h[1];
|
|
12732
|
+
var _j = React.useState(false),
|
|
12733
|
+
showLicensePrompt = _j[0],
|
|
12734
|
+
setShowLicensePrompt = _j[1];
|
|
12735
|
+
var readerRef = React.useRef(null);
|
|
12736
|
+
var scanningRef = React.useRef(false);
|
|
12737
|
+
var animationFrameRef = React.useRef(null);
|
|
12738
|
+
var videoRef = useCameraStore().videoRef;
|
|
12739
|
+
// Check for saved license on mount if promptForLicense is enabled
|
|
12740
|
+
React.useEffect(function () {
|
|
12741
|
+
if (promptForLicense && !organizationId && !licenseKey) {
|
|
12742
|
+
var savedLicense = getSavedDynamsoftLicense();
|
|
12743
|
+
if (savedLicense) {
|
|
12744
|
+
log('[DynamsoftBarcodeProvider] Using saved license from localStorage');
|
|
12745
|
+
setPromptedLicenseKey(savedLicense);
|
|
12746
|
+
} else {
|
|
12747
|
+
log('[DynamsoftBarcodeProvider] No saved license, showing prompt');
|
|
12748
|
+
setShowLicensePrompt(true);
|
|
12749
|
+
}
|
|
12750
|
+
}
|
|
12751
|
+
}, [promptForLicense, organizationId, licenseKey]);
|
|
12752
|
+
// Handle license submission from prompt
|
|
12753
|
+
var handleLicenseSubmit = React.useCallback(function (key) {
|
|
12754
|
+
log('[DynamsoftBarcodeProvider] License key submitted');
|
|
12755
|
+
setPromptedLicenseKey(key);
|
|
12756
|
+
setShowLicensePrompt(false);
|
|
12757
|
+
}, []);
|
|
12758
|
+
// Handle prompt skip/cancel
|
|
12759
|
+
var handleLicenseCancel = React.useCallback(function () {
|
|
12760
|
+
log('[DynamsoftBarcodeProvider] License prompt cancelled');
|
|
12761
|
+
setShowLicensePrompt(false);
|
|
12762
|
+
}, []);
|
|
12763
|
+
// Build license config from props or prompted key
|
|
12764
|
+
var licenseConfig = React.useMemo(function () {
|
|
12765
|
+
if (organizationId) return {
|
|
12766
|
+
organizationId: organizationId
|
|
12767
|
+
};
|
|
12768
|
+
if (licenseKey) return {
|
|
12769
|
+
licenseKey: licenseKey
|
|
12770
|
+
};
|
|
12771
|
+
if (promptedLicenseKey) return {
|
|
12772
|
+
licenseKey: promptedLicenseKey
|
|
12773
|
+
};
|
|
12774
|
+
return null;
|
|
12775
|
+
}, [organizationId, licenseKey, promptedLicenseKey]);
|
|
12776
|
+
// Load and initialize Dynamsoft SDK
|
|
12777
|
+
React.useEffect(function () {
|
|
12778
|
+
if (!enabled || !licenseConfig) return;
|
|
12779
|
+
if (loadState !== 'not-started') return;
|
|
12780
|
+
var initSDK = function initSDK() {
|
|
12781
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
12782
|
+
var router, err_1, error_1;
|
|
12783
|
+
var _a, _b;
|
|
12784
|
+
return __generator(this, function (_c) {
|
|
12785
|
+
switch (_c.label) {
|
|
12786
|
+
case 0:
|
|
12787
|
+
_c.trys.push([0, 6,, 7]);
|
|
12788
|
+
setLoadState('loading');
|
|
12789
|
+
log('[DynamsoftBarcodeProvider] Loading Dynamsoft SDK from CDN...');
|
|
12790
|
+
return [4 /*yield*/, loadDynamsoftSDK()];
|
|
12791
|
+
case 1:
|
|
12792
|
+
_c.sent();
|
|
12793
|
+
setLoadState('initializing');
|
|
12794
|
+
log('[DynamsoftBarcodeProvider] Initializing Dynamsoft license...');
|
|
12795
|
+
return [4 /*yield*/, initializeDynamsoft(licenseConfig)
|
|
12796
|
+
// Log available Dynamsoft APIs for debugging
|
|
12797
|
+
];
|
|
12798
|
+
case 2:
|
|
12799
|
+
_c.sent();
|
|
12800
|
+
// Log available Dynamsoft APIs for debugging
|
|
12801
|
+
if (window.Dynamsoft) {
|
|
12802
|
+
log('[DynamsoftBarcodeProvider] Available Dynamsoft APIs:', Object.keys(window.Dynamsoft));
|
|
12803
|
+
if (window.Dynamsoft.DBR) {
|
|
12804
|
+
log('[DynamsoftBarcodeProvider] DBR APIs:', Object.keys(window.Dynamsoft.DBR));
|
|
12805
|
+
}
|
|
12806
|
+
if (window.Dynamsoft.CVR) {
|
|
12807
|
+
log('[DynamsoftBarcodeProvider] CVR APIs:', Object.keys(window.Dynamsoft.CVR));
|
|
12808
|
+
}
|
|
12809
|
+
}
|
|
12810
|
+
if (!((_b = (_a = window.Dynamsoft) === null || _a === void 0 ? void 0 : _a.CVR) === null || _b === void 0 ? void 0 : _b.CaptureVisionRouter)) return [3 /*break*/, 4];
|
|
12811
|
+
return [4 /*yield*/, window.Dynamsoft.CVR.CaptureVisionRouter.createInstance()
|
|
12812
|
+
// Store router as our "reader" - we'll use capture() method
|
|
12813
|
+
// PDF417 filtering is done at the result level in decodeFrame()
|
|
12814
|
+
];
|
|
12815
|
+
case 3:
|
|
12816
|
+
router = _c.sent();
|
|
12817
|
+
// Store router as our "reader" - we'll use capture() method
|
|
12818
|
+
// PDF417 filtering is done at the result level in decodeFrame()
|
|
12819
|
+
readerRef.current = router;
|
|
12820
|
+
log('[DynamsoftBarcodeProvider] CaptureVisionRouter instance created');
|
|
12821
|
+
return [3 /*break*/, 5];
|
|
12822
|
+
case 4:
|
|
12823
|
+
throw new Error('Dynamsoft CaptureVisionRouter not available');
|
|
12824
|
+
case 5:
|
|
12825
|
+
setLoadState('ready');
|
|
12826
|
+
log('[DynamsoftBarcodeProvider] Dynamsoft SDK ready');
|
|
12827
|
+
return [3 /*break*/, 7];
|
|
12828
|
+
case 6:
|
|
12829
|
+
err_1 = _c.sent();
|
|
12830
|
+
error_1 = err_1 instanceof Error ? err_1 : new Error('Failed to load Dynamsoft SDK');
|
|
12831
|
+
setError(error_1);
|
|
12832
|
+
setLoadState('error');
|
|
12833
|
+
log('[DynamsoftBarcodeProvider] Error loading Dynamsoft SDK:', error_1);
|
|
12834
|
+
onError === null || onError === void 0 ? void 0 : onError(error_1);
|
|
12835
|
+
return [3 /*break*/, 7];
|
|
12836
|
+
case 7:
|
|
12837
|
+
return [2 /*return*/];
|
|
12838
|
+
}
|
|
12839
|
+
});
|
|
12840
|
+
});
|
|
12841
|
+
};
|
|
12842
|
+
void initSDK();
|
|
12843
|
+
}, [enabled, licenseConfig, loadState, onError]);
|
|
12844
|
+
// Cleanup router on unmount
|
|
12845
|
+
React.useEffect(function () {
|
|
12846
|
+
return function () {
|
|
12847
|
+
if (readerRef.current) {
|
|
12848
|
+
var router = readerRef.current;
|
|
12849
|
+
router.dispose();
|
|
12850
|
+
readerRef.current = null;
|
|
12851
|
+
}
|
|
12852
|
+
if (animationFrameRef.current) {
|
|
12853
|
+
cancelAnimationFrame(animationFrameRef.current);
|
|
12854
|
+
}
|
|
12855
|
+
};
|
|
12856
|
+
}, []);
|
|
12857
|
+
var decodeFrame = React.useCallback(function () {
|
|
12858
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
12859
|
+
var video, router, result, items, pdf417Item, decodeResult, otherBarcodes, err_2;
|
|
12860
|
+
return __generator(this, function (_a) {
|
|
12861
|
+
switch (_a.label) {
|
|
12862
|
+
case 0:
|
|
12863
|
+
if (!scanningRef.current) return [2 /*return*/];
|
|
12864
|
+
if (!readerRef.current) return [2 /*return*/];
|
|
12865
|
+
if (!videoRef.current) return [2 /*return*/];
|
|
12866
|
+
video = videoRef.current;
|
|
12867
|
+
if (video.readyState < 2) {
|
|
12868
|
+
// Video not ready, try again
|
|
12869
|
+
animationFrameRef.current = requestAnimationFrame(decodeFrame);
|
|
12870
|
+
return [2 /*return*/];
|
|
12871
|
+
}
|
|
12872
|
+
_a.label = 1;
|
|
12873
|
+
case 1:
|
|
12874
|
+
_a.trys.push([1, 3,, 4]);
|
|
12875
|
+
router = readerRef.current;
|
|
12876
|
+
return [4 /*yield*/, router.capture(video)
|
|
12877
|
+
// Extract barcode results from captured result
|
|
12878
|
+
// The result contains items array with different result types
|
|
12879
|
+
];
|
|
12880
|
+
case 2:
|
|
12881
|
+
result = _a.sent();
|
|
12882
|
+
items = result.items;
|
|
12883
|
+
if (items && items.length > 0) {
|
|
12884
|
+
pdf417Item = items.find(function (item) {
|
|
12885
|
+
var _a;
|
|
12886
|
+
return item.type === 2 && item.text && ((_a = item.formatString) === null || _a === void 0 ? void 0 : _a.toUpperCase().includes('PDF417'));
|
|
12887
|
+
});
|
|
12888
|
+
if (pdf417Item && pdf417Item.text) {
|
|
12889
|
+
decodeResult = {
|
|
12890
|
+
text: pdf417Item.text,
|
|
12891
|
+
format: pdf417Item.formatString || 'PDF417'
|
|
12892
|
+
};
|
|
12893
|
+
log("[DynamsoftBarcodeProvider] PDF417 barcode decoded: ".concat(decodeResult.text.substring(0, 50), "..."));
|
|
12894
|
+
setLastDecodeResult(decodeResult);
|
|
12895
|
+
onBarcodeDecoded === null || onBarcodeDecoded === void 0 ? void 0 : onBarcodeDecoded(decodeResult);
|
|
12896
|
+
// Stop scanning after successful decode
|
|
12897
|
+
scanningRef.current = false;
|
|
12898
|
+
setIsScanning(false);
|
|
12899
|
+
return [2 /*return*/];
|
|
12900
|
+
}
|
|
12901
|
+
otherBarcodes = items.filter(function (item) {
|
|
12902
|
+
var _a;
|
|
12903
|
+
return item.type === 2 && item.text && !((_a = item.formatString) === null || _a === void 0 ? void 0 : _a.toUpperCase().includes('PDF417'));
|
|
12904
|
+
});
|
|
12905
|
+
if (otherBarcodes.length > 0) {
|
|
12906
|
+
log("[DynamsoftBarcodeProvider] Ignoring non-PDF417 barcodes: ".concat(otherBarcodes.map(function (b) {
|
|
12907
|
+
return b.formatString;
|
|
12908
|
+
}).join(', ')));
|
|
12909
|
+
}
|
|
12910
|
+
}
|
|
12911
|
+
return [3 /*break*/, 4];
|
|
12912
|
+
case 3:
|
|
12913
|
+
err_2 = _a.sent();
|
|
12914
|
+
// Decode errors are expected when no barcode is visible
|
|
12915
|
+
// Only log unexpected errors
|
|
12916
|
+
if (err_2 instanceof Error && !err_2.message.includes('No barcode') && !err_2.message.includes('timeout')) {
|
|
12917
|
+
log('[DynamsoftBarcodeProvider] Decode error:', err_2.message);
|
|
12918
|
+
}
|
|
12919
|
+
return [3 /*break*/, 4];
|
|
12920
|
+
case 4:
|
|
12921
|
+
// Continue scanning
|
|
12922
|
+
if (scanningRef.current) {
|
|
12923
|
+
animationFrameRef.current = requestAnimationFrame(decodeFrame);
|
|
12924
|
+
}
|
|
12925
|
+
return [2 /*return*/];
|
|
12926
|
+
}
|
|
12927
|
+
});
|
|
12928
|
+
});
|
|
12929
|
+
}, [onBarcodeDecoded, videoRef]);
|
|
12930
|
+
var startScanning = React.useCallback(function () {
|
|
12931
|
+
if (loadState !== 'ready') {
|
|
12932
|
+
log('[DynamsoftBarcodeProvider] Cannot start scanning - SDK not ready:', loadState);
|
|
12933
|
+
return;
|
|
12934
|
+
}
|
|
12935
|
+
if (scanningRef.current) {
|
|
12936
|
+
log('[DynamsoftBarcodeProvider] Already scanning');
|
|
12937
|
+
return;
|
|
12938
|
+
}
|
|
12939
|
+
log('[DynamsoftBarcodeProvider] Starting continuous barcode scanning');
|
|
12940
|
+
scanningRef.current = true;
|
|
12941
|
+
setIsScanning(true);
|
|
12942
|
+
setLastDecodeResult(null);
|
|
12943
|
+
// Start decode loop
|
|
12944
|
+
animationFrameRef.current = requestAnimationFrame(decodeFrame);
|
|
12945
|
+
}, [decodeFrame, loadState]);
|
|
12946
|
+
var stopScanning = React.useCallback(function () {
|
|
12947
|
+
log('[DynamsoftBarcodeProvider] Stopping barcode scanning');
|
|
12948
|
+
scanningRef.current = false;
|
|
12949
|
+
setIsScanning(false);
|
|
12950
|
+
if (animationFrameRef.current) {
|
|
12951
|
+
cancelAnimationFrame(animationFrameRef.current);
|
|
12952
|
+
animationFrameRef.current = null;
|
|
12953
|
+
}
|
|
12954
|
+
}, []);
|
|
12955
|
+
var resetDecodeResult = React.useCallback(function () {
|
|
12956
|
+
setLastDecodeResult(null);
|
|
12957
|
+
}, []);
|
|
12958
|
+
var value = React.useMemo(function () {
|
|
12959
|
+
return {
|
|
12960
|
+
loadState: loadState,
|
|
12961
|
+
error: error,
|
|
12962
|
+
lastDecodeResult: lastDecodeResult,
|
|
12963
|
+
isScanning: isScanning,
|
|
12964
|
+
startScanning: startScanning,
|
|
12965
|
+
stopScanning: stopScanning,
|
|
12966
|
+
resetDecodeResult: resetDecodeResult
|
|
12967
|
+
};
|
|
12968
|
+
}, [loadState, error, lastDecodeResult, isScanning, startScanning, stopScanning, resetDecodeResult]);
|
|
12969
|
+
return /*#__PURE__*/React__namespace.default.createElement(DynamsoftBarcodeContext.Provider, {
|
|
12970
|
+
value: value
|
|
12971
|
+
}, children, showLicensePrompt && (/*#__PURE__*/React__namespace.default.createElement(DynamsoftLicensePrompt, {
|
|
12972
|
+
onLicenseSubmit: handleLicenseSubmit,
|
|
12973
|
+
onCancel: handleLicenseCancel
|
|
12974
|
+
})));
|
|
11217
12975
|
}
|
|
11218
|
-
|
|
11219
|
-
|
|
11220
|
-
if (
|
|
11221
|
-
|
|
11222
|
-
}
|
|
11223
|
-
if (dp === void 0) {
|
|
11224
|
-
dp = 1;
|
|
11225
|
-
}
|
|
11226
|
-
var thresh = si ? 1000 : 1024;
|
|
11227
|
-
if (Math.abs(bytes) < thresh) {
|
|
11228
|
-
return bytes + ' B';
|
|
12976
|
+
function useDynamsoftBarcodeContext() {
|
|
12977
|
+
var context = React.useContext(DynamsoftBarcodeContext);
|
|
12978
|
+
if (!context) {
|
|
12979
|
+
throw new Error('useDynamsoftBarcodeContext must be used within a DynamsoftBarcodeProvider');
|
|
11229
12980
|
}
|
|
11230
|
-
|
|
11231
|
-
var u = -1;
|
|
11232
|
-
var r = Math.pow(10, dp);
|
|
11233
|
-
do {
|
|
11234
|
-
bytes /= thresh;
|
|
11235
|
-
++u;
|
|
11236
|
-
} while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
|
|
11237
|
-
return bytes.toFixed(dp) + ' ' + units[u];
|
|
12981
|
+
return context;
|
|
11238
12982
|
}
|
|
11239
|
-
var templateObject_1$p, templateObject_2$o, templateObject_3$i, templateObject_4$c, templateObject_5$8, templateObject_6$3, templateObject_7$2, templateObject_8$2, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1;
|
|
11240
12983
|
|
|
11241
12984
|
var lastDocumentDetectedAtDefaults = {
|
|
11242
12985
|
idCardFront: null,
|
|
@@ -11246,7 +12989,7 @@ var lastDocumentDetectedAtDefaults = {
|
|
|
11246
12989
|
none: null
|
|
11247
12990
|
};
|
|
11248
12991
|
var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
11249
|
-
var _b, _c, _d, _e, _f;
|
|
12992
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
11250
12993
|
var onLoadingStarted = _a.onLoadingStarted,
|
|
11251
12994
|
onLoadingProgress = _a.onLoadingProgress,
|
|
11252
12995
|
onLoadingCompleted = _a.onLoadingCompleted,
|
|
@@ -11257,86 +13000,119 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11257
13000
|
onLoadingOverlayDismissed = _a.onLoadingOverlayDismissed,
|
|
11258
13001
|
onDocumentCaptured = _a.onDocumentCaptured,
|
|
11259
13002
|
onDocumentDetected = _a.onDocumentDetected,
|
|
11260
|
-
|
|
11261
|
-
documentDetectionThrottleMs =
|
|
11262
|
-
|
|
11263
|
-
loadingOverlayMode =
|
|
13003
|
+
_o = _a.documentDetectionThrottleMs,
|
|
13004
|
+
documentDetectionThrottleMs = _o === void 0 ? 0 : _o,
|
|
13005
|
+
_p = _a.loadingOverlayMode,
|
|
13006
|
+
loadingOverlayMode = _p === void 0 ? 'default' : _p,
|
|
11264
13007
|
customOverlayContent = _a.customOverlayContent,
|
|
11265
13008
|
precapturedDocuments = _a.precapturedDocuments,
|
|
11266
|
-
|
|
11267
|
-
captureRequirement =
|
|
11268
|
-
|
|
11269
|
-
allowSinglePageIdCapture =
|
|
11270
|
-
|
|
11271
|
-
separateIdCardCaptureSequence =
|
|
11272
|
-
|
|
11273
|
-
thresholds =
|
|
11274
|
-
|
|
11275
|
-
skipSuccessScreen =
|
|
13009
|
+
_q = _a.captureRequirement,
|
|
13010
|
+
captureRequirement = _q === void 0 ? 'idCardOrPassport' : _q,
|
|
13011
|
+
_r = _a.allowSinglePageIdCapture,
|
|
13012
|
+
allowSinglePageIdCapture = _r === void 0 ? false : _r,
|
|
13013
|
+
_s = _a.separateIdCardCaptureSequence,
|
|
13014
|
+
separateIdCardCaptureSequence = _s === void 0 ? false : _s,
|
|
13015
|
+
_t = _a.thresholds,
|
|
13016
|
+
thresholds = _t === void 0 ? defaultIdCaptureThresholds : _t,
|
|
13017
|
+
_u = _a.skipSuccessScreen,
|
|
13018
|
+
skipSuccessScreen = _u === void 0 ? false : _u,
|
|
11276
13019
|
instructions = _a.instructions,
|
|
11277
|
-
|
|
11278
|
-
releaseCameraAccessOnExit =
|
|
11279
|
-
|
|
11280
|
-
guideType =
|
|
11281
|
-
|
|
11282
|
-
portraitGuidesOnMobile =
|
|
11283
|
-
|
|
11284
|
-
rotateLoadingOverlayImageWhenPortrait =
|
|
11285
|
-
|
|
11286
|
-
silentFallback =
|
|
11287
|
-
|
|
11288
|
-
forceFallbackMode =
|
|
11289
|
-
|
|
11290
|
-
allowIdCardBackToFrontCapture =
|
|
11291
|
-
|
|
11292
|
-
enableOverrideWrongDocumentTypeDialog =
|
|
11293
|
-
|
|
11294
|
-
allowOverrideWrongDocumentTypeAfterMs =
|
|
11295
|
-
|
|
11296
|
-
allowUploadingDocumentsFromStorage =
|
|
11297
|
-
|
|
11298
|
-
guideImages =
|
|
11299
|
-
|
|
11300
|
-
|
|
11301
|
-
|
|
11302
|
-
|
|
11303
|
-
|
|
11304
|
-
|
|
11305
|
-
|
|
11306
|
-
|
|
11307
|
-
|
|
11308
|
-
|
|
11309
|
-
|
|
11310
|
-
|
|
13020
|
+
_v = _a.releaseCameraAccessOnExit,
|
|
13021
|
+
releaseCameraAccessOnExit = _v === void 0 ? true : _v,
|
|
13022
|
+
_w = _a.guideType,
|
|
13023
|
+
guideType = _w === void 0 ? 'fit' : _w,
|
|
13024
|
+
_x = _a.portraitGuidesOnMobile,
|
|
13025
|
+
portraitGuidesOnMobile = _x === void 0 ? true : _x,
|
|
13026
|
+
_y = _a.rotateLoadingOverlayImageWhenPortrait,
|
|
13027
|
+
rotateLoadingOverlayImageWhenPortrait = _y === void 0 ? true : _y,
|
|
13028
|
+
_z = _a.silentFallback,
|
|
13029
|
+
silentFallback = _z === void 0 ? false : _z,
|
|
13030
|
+
_0 = _a.forceFallbackMode,
|
|
13031
|
+
forceFallbackMode = _0 === void 0 ? false : _0,
|
|
13032
|
+
_1 = _a.allowIdCardBackToFrontCapture,
|
|
13033
|
+
allowIdCardBackToFrontCapture = _1 === void 0 ? false : _1,
|
|
13034
|
+
_2 = _a.enableOverrideWrongDocumentTypeDialog,
|
|
13035
|
+
enableOverrideWrongDocumentTypeDialog = _2 === void 0 ? false : _2,
|
|
13036
|
+
_3 = _a.allowOverrideWrongDocumentTypeAfterMs,
|
|
13037
|
+
allowOverrideWrongDocumentTypeAfterMs = _3 === void 0 ? 8000 : _3,
|
|
13038
|
+
_4 = _a.allowUploadingDocumentsFromStorage,
|
|
13039
|
+
allowUploadingDocumentsFromStorage = _4 === void 0 ? false : _4,
|
|
13040
|
+
_5 = _a.guideImages,
|
|
13041
|
+
guideImages = _5 === void 0 ? defaultIdCaptureGuideImages : _5,
|
|
13042
|
+
_6 = _a.barcodeRecaptureThreshold,
|
|
13043
|
+
barcodeRecaptureThreshold = _6 === void 0 ? 1 : _6,
|
|
13044
|
+
_7 = _a.barcodeRecaptureTimeoutMs,
|
|
13045
|
+
barcodeRecaptureTimeoutMs = _7 === void 0 ? 5000 : _7,
|
|
13046
|
+
_8 = _a.barcodeRecaptureMoveCloserTimeoutMs,
|
|
13047
|
+
barcodeRecaptureMoveCloserTimeoutMs = _8 === void 0 ? 10000 : _8,
|
|
13048
|
+
_9 = _a.barcodeRecaptureBboxGrowthPct,
|
|
13049
|
+
barcodeRecaptureBboxGrowthPct = _9 === void 0 ? 20 : _9,
|
|
13050
|
+
_10 = _a.documentEdgeDistancePct,
|
|
13051
|
+
documentEdgeDistancePct = _10 === void 0 ? 0 : _10,
|
|
13052
|
+
_11 = _a.enableClientBarcodeScan,
|
|
13053
|
+
enableClientBarcodeScan = _11 === void 0 ? false : _11,
|
|
13054
|
+
onClientBarcodeDecoded = _a.onClientBarcodeDecoded,
|
|
13055
|
+
_12 = _a.assets,
|
|
13056
|
+
assets = _12 === void 0 ? {} : _12,
|
|
13057
|
+
_13 = _a.classNames,
|
|
13058
|
+
classNames = _13 === void 0 ? {} : _13,
|
|
13059
|
+
_14 = _a.colors,
|
|
13060
|
+
colors = _14 === void 0 ? {} : _14,
|
|
13061
|
+
_15 = _a.verbiage,
|
|
13062
|
+
verbiage = _15 === void 0 ? {} : _15,
|
|
13063
|
+
_16 = _a.debugMode,
|
|
13064
|
+
debugMode = _16 === void 0 ? false : _16;
|
|
11311
13065
|
var state = useIdCaptureStore();
|
|
11312
|
-
var
|
|
11313
|
-
|
|
11314
|
-
|
|
11315
|
-
|
|
11316
|
-
|
|
11317
|
-
|
|
11318
|
-
|
|
11319
|
-
|
|
11320
|
-
|
|
11321
|
-
|
|
11322
|
-
|
|
11323
|
-
|
|
11324
|
-
|
|
11325
|
-
|
|
11326
|
-
|
|
11327
|
-
|
|
11328
|
-
|
|
11329
|
-
|
|
11330
|
-
|
|
11331
|
-
|
|
11332
|
-
|
|
11333
|
-
|
|
11334
|
-
|
|
11335
|
-
|
|
11336
|
-
|
|
11337
|
-
|
|
11338
|
-
|
|
11339
|
-
|
|
13066
|
+
var isCapturing = state.captureState === 'capturing' || state.captureState === 'requestingBetterBarcode';
|
|
13067
|
+
var _17 = useCameraStore(),
|
|
13068
|
+
cameraAccessDenied = _17.cameraAccessDenied,
|
|
13069
|
+
requestCameraAccess = _17.requestCameraAccess,
|
|
13070
|
+
releaseCameraAccess = _17.releaseCameraAccess;
|
|
13071
|
+
var _18 = React.useState(false),
|
|
13072
|
+
overlayDismissed = _18[0],
|
|
13073
|
+
setOverlayDismissed = _18[1];
|
|
13074
|
+
var _19 = useSubmissionContext(),
|
|
13075
|
+
submissionStatus = _19.submissionStatus,
|
|
13076
|
+
setIdFrontImage = _19.setIdFrontImage,
|
|
13077
|
+
setIdBackImage = _19.setIdBackImage,
|
|
13078
|
+
setPassportImage = _19.setPassportImage,
|
|
13079
|
+
setIdFrontIrImage = _19.setIdFrontIrImage,
|
|
13080
|
+
setIdBackIrImage = _19.setIdBackIrImage,
|
|
13081
|
+
setIdFrontUvImage = _19.setIdFrontUvImage,
|
|
13082
|
+
setIdBackUvImage = _19.setIdBackUvImage,
|
|
13083
|
+
setIdBarcodeImage = _19.setIdBarcodeImage,
|
|
13084
|
+
logIdFrontCaptureAttempt = _19.logIdFrontCaptureAttempt,
|
|
13085
|
+
logIdBackCaptureAttempt = _19.logIdBackCaptureAttempt;
|
|
13086
|
+
var _20 = useIdCaptureModelsContext(),
|
|
13087
|
+
start = _20.start,
|
|
13088
|
+
stop = _20.stop,
|
|
13089
|
+
onPredictionMade = _20.onPredictionMade,
|
|
13090
|
+
setRequiredDocumentType = _20.setRequiredDocumentType,
|
|
13091
|
+
modelError = _20.modelError,
|
|
13092
|
+
resetBestFrame = _20.resetBestFrame,
|
|
13093
|
+
resetBestBarcode = _20.resetBestBarcode,
|
|
13094
|
+
documentDetectionBoundaries = _20.documentDetectionBoundaries,
|
|
13095
|
+
setDocumentDetectionBoundaries = _20.setDocumentDetectionBoundaries,
|
|
13096
|
+
getBestBarcode = _20.getBestBarcode,
|
|
13097
|
+
startBarcodeRecapturePhase = _20.startBarcodeRecapturePhase,
|
|
13098
|
+
getRecaptureBestBarcode = _20.getRecaptureBestBarcode;
|
|
13099
|
+
var initialBarcodeBboxRef = React.useRef(null);
|
|
13100
|
+
var recapturePhaseStartedRef = React.useRef(false);
|
|
13101
|
+
var _21 = React.useState(false),
|
|
13102
|
+
barcodeRecaptureGrowthSatisfied = _21[0],
|
|
13103
|
+
setBarcodeRecaptureGrowthSatisfied = _21[1];
|
|
13104
|
+
React.useEffect(function () {
|
|
13105
|
+
// Reset recapture gating whenever we enter/exit the recapture flow
|
|
13106
|
+
if (state.captureState === 'requestingBetterBarcode') {
|
|
13107
|
+
initialBarcodeBboxRef.current = null;
|
|
13108
|
+
recapturePhaseStartedRef.current = false;
|
|
13109
|
+
setBarcodeRecaptureGrowthSatisfied(false);
|
|
13110
|
+
return;
|
|
13111
|
+
}
|
|
13112
|
+
initialBarcodeBboxRef.current = null;
|
|
13113
|
+
recapturePhaseStartedRef.current = false;
|
|
13114
|
+
setBarcodeRecaptureGrowthSatisfied(false);
|
|
13115
|
+
}, [state.captureState]);
|
|
11340
13116
|
React.useEffect(function () {
|
|
11341
13117
|
dispatchIdCaptureAction({
|
|
11342
13118
|
type: 'configureWizard',
|
|
@@ -11347,10 +13123,12 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11347
13123
|
allowIdCardBackToFrontCapture: allowIdCardBackToFrontCapture,
|
|
11348
13124
|
enableOverrideWrongDocumentTypeDialog: enableOverrideWrongDocumentTypeDialog,
|
|
11349
13125
|
allowOverrideWrongDocumentTypeAfterMs: allowOverrideWrongDocumentTypeAfterMs,
|
|
11350
|
-
allowUploadingDocumentsFromStorage: allowUploadingDocumentsFromStorage
|
|
13126
|
+
allowUploadingDocumentsFromStorage: allowUploadingDocumentsFromStorage,
|
|
13127
|
+
barcodeRecaptureThreshold: barcodeRecaptureThreshold,
|
|
13128
|
+
barcodeRecaptureTimeoutMs: barcodeRecaptureTimeoutMs
|
|
11351
13129
|
}
|
|
11352
13130
|
});
|
|
11353
|
-
}, [allowIdCardBackToFrontCapture, allowOverrideWrongDocumentTypeAfterMs, allowSinglePageIdCapture, allowUploadingDocumentsFromStorage, captureRequirement, enableOverrideWrongDocumentTypeDialog, precapturedDocuments]);
|
|
13131
|
+
}, [allowIdCardBackToFrontCapture, allowOverrideWrongDocumentTypeAfterMs, allowSinglePageIdCapture, allowUploadingDocumentsFromStorage, barcodeRecaptureThreshold, barcodeRecaptureTimeoutMs, captureRequirement, enableOverrideWrongDocumentTypeDialog, precapturedDocuments]);
|
|
11354
13132
|
React.useEffect(function () {
|
|
11355
13133
|
var _a;
|
|
11356
13134
|
var desiredEdgeDistance = documentEdgeDistancePct !== null && documentEdgeDistancePct !== void 0 ? documentEdgeDistancePct : 0;
|
|
@@ -11360,10 +13138,36 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11360
13138
|
edgeMarginPct: desiredEdgeDistance
|
|
11361
13139
|
}));
|
|
11362
13140
|
}, [documentDetectionBoundaries, documentEdgeDistancePct, setDocumentDetectionBoundaries]);
|
|
13141
|
+
// Relax detection boundaries during barcode recapture to allow edge detections
|
|
13142
|
+
// (when user zooms in, the barcode may be closer to frame edges)
|
|
13143
|
+
var savedBoundariesRef = React.useRef(documentDetectionBoundaries);
|
|
13144
|
+
React.useEffect(function () {
|
|
13145
|
+
if (state.captureState === 'requestingBetterBarcode') {
|
|
13146
|
+
// Save current boundaries and relax to 0 for recapture
|
|
13147
|
+
savedBoundariesRef.current = documentDetectionBoundaries;
|
|
13148
|
+
log('[IdCaptureWizard] Relaxing detection boundaries for barcode recapture');
|
|
13149
|
+
setDocumentDetectionBoundaries({
|
|
13150
|
+
top: 0,
|
|
13151
|
+
bottom: 0,
|
|
13152
|
+
left: 0,
|
|
13153
|
+
right: 0,
|
|
13154
|
+
edgeMarginPct: documentDetectionBoundaries.edgeMarginPct
|
|
13155
|
+
});
|
|
13156
|
+
} else if (savedBoundariesRef.current !== documentDetectionBoundaries) {
|
|
13157
|
+
// Restore boundaries when exiting recapture (only if they were changed)
|
|
13158
|
+
var saved = savedBoundariesRef.current;
|
|
13159
|
+
if (saved.top === 0 && saved.bottom === 0 && saved.left === 0 && saved.right === 0) {
|
|
13160
|
+
// Don't restore if saved values are the relaxed ones
|
|
13161
|
+
return;
|
|
13162
|
+
}
|
|
13163
|
+
}
|
|
13164
|
+
}, [state.captureState, documentDetectionBoundaries, setDocumentDetectionBoundaries]);
|
|
11363
13165
|
var documentCount = Object.keys(state.capturedDocuments).length;
|
|
11364
13166
|
React.useEffect(function () {
|
|
13167
|
+
// Skip reset during barcode recapture - the recapture flow manages its own canvas state
|
|
13168
|
+
if (state.captureState === 'requestingBetterBarcode') return;
|
|
11365
13169
|
if (documentCount) resetBestFrame();
|
|
11366
|
-
}, [documentCount, resetBestFrame]);
|
|
13170
|
+
}, [documentCount, resetBestFrame, state.captureState]);
|
|
11367
13171
|
var isFallbackMode = forceFallbackMode || modelError;
|
|
11368
13172
|
var lastDocumentDetectedAt = React.useRef(_assign({}, lastDocumentDetectedAtDefaults));
|
|
11369
13173
|
var logCaptureMetadata = React.useCallback(function (metadata) {
|
|
@@ -11382,24 +13186,62 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11382
13186
|
}
|
|
11383
13187
|
}, [isFallbackMode, logIdBackCaptureAttempt, logIdFrontCaptureAttempt]);
|
|
11384
13188
|
React.useEffect(function startModelsWhenCapturing() {
|
|
11385
|
-
if (!overlayDismissed ||
|
|
13189
|
+
if (!overlayDismissed || !isCapturing) return;
|
|
11386
13190
|
dispatchIdCaptureAction({
|
|
11387
13191
|
type: 'captureStarted'
|
|
11388
13192
|
});
|
|
11389
13193
|
start();
|
|
11390
|
-
}, [overlayDismissed, start
|
|
13194
|
+
}, [isCapturing, overlayDismissed, start]);
|
|
11391
13195
|
React.useEffect(function () {
|
|
11392
13196
|
onPredictionMade(function (prediction) {
|
|
11393
|
-
var _a;
|
|
11394
|
-
var
|
|
11395
|
-
captureState =
|
|
11396
|
-
requestedDocumentType =
|
|
13197
|
+
var _a, _b, _c, _d;
|
|
13198
|
+
var _e = useIdCaptureStore.getState(),
|
|
13199
|
+
captureState = _e.captureState,
|
|
13200
|
+
requestedDocumentType = _e.requestedDocumentType;
|
|
11397
13201
|
var k = "".concat(requestedDocumentType, "DetectionThresholdMet");
|
|
11398
13202
|
var thresholdMet = prediction[k];
|
|
11399
|
-
if (captureState === 'capturing') {
|
|
13203
|
+
if (captureState === 'capturing' || captureState === 'requestingBetterBarcode') {
|
|
13204
|
+
// During barcode recapture, wait until the barcode bbox grows by a configurable %
|
|
13205
|
+
// (to confirm the user moved the camera closer) before we start recapture processing.
|
|
13206
|
+
if (captureState === 'requestingBetterBarcode') {
|
|
13207
|
+
var growthPct = Math.max(0, Math.min(barcodeRecaptureBboxGrowthPct, 200));
|
|
13208
|
+
var requiredMultiplier = 1 + growthPct / 100;
|
|
13209
|
+
if (!recapturePhaseStartedRef.current) {
|
|
13210
|
+
// If growth requirement is disabled, begin recapture immediately.
|
|
13211
|
+
if (requiredMultiplier === 1) {
|
|
13212
|
+
recapturePhaseStartedRef.current = true;
|
|
13213
|
+
setBarcodeRecaptureGrowthSatisfied(true);
|
|
13214
|
+
startBarcodeRecapturePhase();
|
|
13215
|
+
} else {
|
|
13216
|
+
var pdf417Box = (_a = prediction.bestPDF417) === null || _a === void 0 ? void 0 : _a.box;
|
|
13217
|
+
var frameWidth = (_b = prediction.frameWidth) !== null && _b !== void 0 ? _b : 0;
|
|
13218
|
+
var frameHeight = (_c = prediction.frameHeight) !== null && _c !== void 0 ? _c : 0;
|
|
13219
|
+
if (pdf417Box && frameWidth > 0 && frameHeight > 0) {
|
|
13220
|
+
var widthRatio = pdf417Box.width / frameWidth;
|
|
13221
|
+
var heightRatio = pdf417Box.height / frameHeight;
|
|
13222
|
+
if (!initialBarcodeBboxRef.current) {
|
|
13223
|
+
// First observed bbox when we enter recapture.
|
|
13224
|
+
initialBarcodeBboxRef.current = {
|
|
13225
|
+
widthRatio: widthRatio,
|
|
13226
|
+
heightRatio: heightRatio
|
|
13227
|
+
};
|
|
13228
|
+
} else {
|
|
13229
|
+
var baseline = initialBarcodeBboxRef.current;
|
|
13230
|
+
var widthSatisfied = widthRatio >= baseline.widthRatio * requiredMultiplier;
|
|
13231
|
+
var heightSatisfied = heightRatio >= baseline.heightRatio * requiredMultiplier;
|
|
13232
|
+
if (widthSatisfied && heightSatisfied) {
|
|
13233
|
+
recapturePhaseStartedRef.current = true;
|
|
13234
|
+
setBarcodeRecaptureGrowthSatisfied(true);
|
|
13235
|
+
startBarcodeRecapturePhase();
|
|
13236
|
+
}
|
|
13237
|
+
}
|
|
13238
|
+
}
|
|
13239
|
+
}
|
|
13240
|
+
}
|
|
13241
|
+
}
|
|
11400
13242
|
if (prediction.detectedDocumentType !== 'none') {
|
|
11401
13243
|
var now = Date.now();
|
|
11402
|
-
if (!lastDocumentDetectedAt.current[prediction.detectedDocumentType] || documentDetectionThrottleMs && now - ((
|
|
13244
|
+
if (!lastDocumentDetectedAt.current[prediction.detectedDocumentType] || documentDetectionThrottleMs && now - ((_d = lastDocumentDetectedAt.current[prediction.detectedDocumentType]) !== null && _d !== void 0 ? _d : 0) > documentDetectionThrottleMs) {
|
|
11403
13245
|
lastDocumentDetectedAt.current[prediction.detectedDocumentType] = now;
|
|
11404
13246
|
onDocumentDetected === null || onDocumentDetected === void 0 ? void 0 : onDocumentDetected(prediction.detectedDocumentType);
|
|
11405
13247
|
}
|
|
@@ -11417,10 +13259,67 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11417
13259
|
});
|
|
11418
13260
|
}
|
|
11419
13261
|
});
|
|
11420
|
-
}, [documentDetectionThrottleMs, onDocumentDetected, onPredictionMade, resetBestFrame]);
|
|
13262
|
+
}, [barcodeRecaptureBboxGrowthPct, documentDetectionThrottleMs, onDocumentDetected, onPredictionMade, resetBestFrame, startBarcodeRecapturePhase]);
|
|
11421
13263
|
React.useEffect(function () {
|
|
11422
13264
|
if (state.captureState === 'complete') stop();
|
|
11423
13265
|
}, [state.captureState, stop]);
|
|
13266
|
+
// Run native barcode decoder when capture completes and there's a barcode image
|
|
13267
|
+
React.useEffect(function () {
|
|
13268
|
+
var _a;
|
|
13269
|
+
if (state.captureState !== 'complete') return;
|
|
13270
|
+
if (state.nativeBarcodeDecodeResult) return; // Already decoded
|
|
13271
|
+
if (state.nativeBarcodeDecoding) return; // Already decoding
|
|
13272
|
+
var barcodeImage = (_a = state.capturedDocuments.idBarcodeImage) === null || _a === void 0 ? void 0 : _a.imageData;
|
|
13273
|
+
if (!barcodeImage) return;
|
|
13274
|
+
log('[IdCaptureWizard] Running native barcode decoder on final barcode image');
|
|
13275
|
+
dispatchIdCaptureAction({
|
|
13276
|
+
type: 'nativeBarcodeDecodeStarted'
|
|
13277
|
+
});
|
|
13278
|
+
// Convert base64/data URL to blob and decode
|
|
13279
|
+
fetch(barcodeImage.startsWith('data:') ? barcodeImage : "data:image/jpeg;base64,".concat(barcodeImage)).then(function (res) {
|
|
13280
|
+
return res.blob();
|
|
13281
|
+
}).then(function (blob) {
|
|
13282
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
13283
|
+
var result, error_1;
|
|
13284
|
+
return __generator(this, function (_a) {
|
|
13285
|
+
switch (_a.label) {
|
|
13286
|
+
case 0:
|
|
13287
|
+
_a.trys.push([0, 2,, 3]);
|
|
13288
|
+
return [4 /*yield*/, decodePDF417(blob)];
|
|
13289
|
+
case 1:
|
|
13290
|
+
result = _a.sent();
|
|
13291
|
+
if (result) {
|
|
13292
|
+
log("[IdCaptureWizard] Native barcode decoded via ".concat(result.method, ": ").concat(result.text.substring(0, 50), "..."));
|
|
13293
|
+
dispatchIdCaptureAction({
|
|
13294
|
+
type: 'nativeBarcodeDecoded',
|
|
13295
|
+
payload: result
|
|
13296
|
+
});
|
|
13297
|
+
} else {
|
|
13298
|
+
log('[IdCaptureWizard] Native barcode decode returned no result');
|
|
13299
|
+
dispatchIdCaptureAction({
|
|
13300
|
+
type: 'nativeBarcodeDecodeFailed'
|
|
13301
|
+
});
|
|
13302
|
+
}
|
|
13303
|
+
return [3 /*break*/, 3];
|
|
13304
|
+
case 2:
|
|
13305
|
+
error_1 = _a.sent();
|
|
13306
|
+
log('[IdCaptureWizard] Native barcode decode error:', error_1);
|
|
13307
|
+
dispatchIdCaptureAction({
|
|
13308
|
+
type: 'nativeBarcodeDecodeFailed'
|
|
13309
|
+
});
|
|
13310
|
+
return [3 /*break*/, 3];
|
|
13311
|
+
case 3:
|
|
13312
|
+
return [2 /*return*/];
|
|
13313
|
+
}
|
|
13314
|
+
});
|
|
13315
|
+
});
|
|
13316
|
+
})["catch"](function (error) {
|
|
13317
|
+
log('[IdCaptureWizard] Failed to fetch barcode image for native decode:', error);
|
|
13318
|
+
dispatchIdCaptureAction({
|
|
13319
|
+
type: 'nativeBarcodeDecodeFailed'
|
|
13320
|
+
});
|
|
13321
|
+
});
|
|
13322
|
+
}, [state.captureState, (_b = state.capturedDocuments.idBarcodeImage) === null || _b === void 0 ? void 0 : _b.imageData, state.nativeBarcodeDecodeResult, state.nativeBarcodeDecoding]);
|
|
11424
13323
|
var onCapture = React.useCallback(function (imageData, width, height, documentType, metadata) {
|
|
11425
13324
|
logCaptureMetadata(metadata);
|
|
11426
13325
|
onDocumentCaptured === null || onDocumentCaptured === void 0 ? void 0 : onDocumentCaptured(metadata);
|
|
@@ -11472,9 +13371,9 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11472
13371
|
type: 'resetWizard'
|
|
11473
13372
|
});
|
|
11474
13373
|
}, []);
|
|
11475
|
-
var
|
|
11476
|
-
attempt =
|
|
11477
|
-
setAttempt =
|
|
13374
|
+
var _22 = React.useState(0),
|
|
13375
|
+
attempt = _22[0],
|
|
13376
|
+
setAttempt = _22[1];
|
|
11478
13377
|
var onExit = React.useCallback(function () {
|
|
11479
13378
|
releaseCameraAccess();
|
|
11480
13379
|
setOverlayDismissed(false);
|
|
@@ -11500,20 +13399,25 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11500
13399
|
});
|
|
11501
13400
|
}
|
|
11502
13401
|
}, [cameraAccessDenied]);
|
|
13402
|
+
var guidanceBarcodeRecaptureText = (_c = verbiage.guidanceBarcodeRecaptureText) !== null && _c !== void 0 ? _c : 'Please move the barcode closer to the camera';
|
|
13403
|
+
var guidanceBarcodeRecaptureInProgressText = (_d = verbiage.guidanceBarcodeRecaptureInProgressText) !== null && _d !== void 0 ? _d : 'Barcode capture in progress, please hold still';
|
|
13404
|
+
var barcodeRecaptureGuidanceMessage = barcodeRecaptureGrowthSatisfied ? guidanceBarcodeRecaptureInProgressText : guidanceBarcodeRecaptureText;
|
|
11503
13405
|
var idCaptureVerbiages = {
|
|
11504
13406
|
idCardFront: useTranslations(verbiage.idCardFront, {
|
|
11505
13407
|
instructionText: 'Scan the front of ID',
|
|
11506
13408
|
processingIdCardText: "ID card ".concat('idCardFront' in state.capturedDocuments ? 'front' : 'back', " captured.")
|
|
11507
13409
|
}),
|
|
11508
13410
|
idCardBack: useTranslations(verbiage.idCardBack, {
|
|
11509
|
-
instructionText: 'Scan the back of ID'
|
|
13411
|
+
instructionText: state.captureState === 'requestingBetterBarcode' ? barcodeRecaptureGuidanceMessage : 'Scan the back of ID'
|
|
11510
13412
|
}),
|
|
11511
13413
|
passport: useTranslations(verbiage.passport, {
|
|
11512
13414
|
instructionText: 'Scan the ID page of passport'
|
|
11513
13415
|
})
|
|
11514
13416
|
};
|
|
11515
13417
|
var theme = styled.useTheme();
|
|
11516
|
-
|
|
13418
|
+
// During barcode recapture, use idCardBack verbiage to show barcode recapture message
|
|
13419
|
+
var verbiageKey = state.captureState === 'requestingBetterBarcode' ? 'idCardBack' : state.requestedDocumentType;
|
|
13420
|
+
var idCaptureVerbiage = idCaptureVerbiages[verbiageKey];
|
|
11517
13421
|
React.useEffect(function () {
|
|
11518
13422
|
if (separateIdCardCaptureSequence) return;
|
|
11519
13423
|
if (state.captureState !== 'requestingFlip') return;
|
|
@@ -11527,6 +13431,152 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11527
13431
|
clearTimeout(t);
|
|
11528
13432
|
};
|
|
11529
13433
|
}, [resetBestFrame, separateIdCardCaptureSequence, state.captureState]);
|
|
13434
|
+
// Handle barcode recapture start - snapshot initial barcode and initialize recapture state
|
|
13435
|
+
React.useEffect(function () {
|
|
13436
|
+
var _a, _b;
|
|
13437
|
+
if (state.captureState !== 'requestingBetterBarcode') return;
|
|
13438
|
+
if (state.initialCaptureBarcodeImage !== null) return; // Already initialized
|
|
13439
|
+
// Get the initial barcode image from capturedDocuments (since resetBestFrame clears the canvas)
|
|
13440
|
+
var initialBarcodeImage = (_b = (_a = state.capturedDocuments.idBarcodeImage) === null || _a === void 0 ? void 0 : _a.imageData) !== null && _b !== void 0 ? _b : null;
|
|
13441
|
+
dispatchIdCaptureAction({
|
|
13442
|
+
type: 'barcodeRecaptureStarted',
|
|
13443
|
+
payload: {
|
|
13444
|
+
initialBarcodeScore: state.initialBarcodeScore,
|
|
13445
|
+
initialCaptureBarcodeImage: initialBarcodeImage
|
|
13446
|
+
}
|
|
13447
|
+
});
|
|
13448
|
+
// Start recapture phase immediately so barcode analysis runs with relaxed conditions
|
|
13449
|
+
// (don't require document in bounds since user is zooming in)
|
|
13450
|
+
startBarcodeRecapturePhase();
|
|
13451
|
+
}, [startBarcodeRecapturePhase, state.captureState, (_e = state.capturedDocuments.idBarcodeImage) === null || _e === void 0 ? void 0 : _e.imageData, state.initialBarcodeScore, state.initialCaptureBarcodeImage]);
|
|
13452
|
+
// Reset best barcode after 1 second delay to ignore early frames before user has time to move closer
|
|
13453
|
+
React.useEffect(function () {
|
|
13454
|
+
if (state.captureState !== 'requestingBetterBarcode') return;
|
|
13455
|
+
var t = setTimeout(function () {
|
|
13456
|
+
log('[IdCaptureWizard] Resetting best barcode after 1s delay in move-closer window');
|
|
13457
|
+
resetBestBarcode();
|
|
13458
|
+
}, 1000);
|
|
13459
|
+
return function () {
|
|
13460
|
+
return clearTimeout(t);
|
|
13461
|
+
};
|
|
13462
|
+
}, [resetBestBarcode, state.captureState]);
|
|
13463
|
+
// Handle barcode recapture timeout
|
|
13464
|
+
React.useEffect(function () {
|
|
13465
|
+
if (state.captureState !== 'requestingBetterBarcode') return;
|
|
13466
|
+
// Continue detection to try to get a better barcode
|
|
13467
|
+
setTimeout(start, 100);
|
|
13468
|
+
var t = setTimeout(function () {
|
|
13469
|
+
var _a, _b;
|
|
13470
|
+
// Move-closer window expired before growth requirement was met
|
|
13471
|
+
if (recapturePhaseStartedRef.current) return;
|
|
13472
|
+
// Use recapture tracking since we start tracking with relaxed conditions immediately
|
|
13473
|
+
var recaptureBarcode = getRecaptureBestBarcode();
|
|
13474
|
+
var recaptureScore = (_a = recaptureBarcode === null || recaptureBarcode === void 0 ? void 0 : recaptureBarcode.score) !== null && _a !== void 0 ? _a : null;
|
|
13475
|
+
var improved = !!recaptureBarcode && recaptureBarcode.score > state.initialBarcodeScore;
|
|
13476
|
+
if (improved) {
|
|
13477
|
+
log("[IdCaptureWizard] Barcode recapture move-closer window timed out. Found better barcode anyway: ".concat(recaptureBarcode.score.toFixed(3), " (was ").concat(state.initialBarcodeScore.toFixed(3), ")"));
|
|
13478
|
+
dispatchIdCaptureAction({
|
|
13479
|
+
type: 'barcodeCaptured',
|
|
13480
|
+
payload: {
|
|
13481
|
+
imageUrl: recaptureBarcode.canvas.toDataURL('image/jpeg', 0.95),
|
|
13482
|
+
barcodeReadabilityScore: recaptureBarcode.score
|
|
13483
|
+
}
|
|
13484
|
+
});
|
|
13485
|
+
} else {
|
|
13486
|
+
log("[IdCaptureWizard] Barcode recapture move-closer window timed out. No better barcode found. Best score during window: ".concat((_b = recaptureScore === null || recaptureScore === void 0 ? void 0 : recaptureScore.toFixed(3)) !== null && _b !== void 0 ? _b : 'none', ", initial score: ").concat(state.initialBarcodeScore.toFixed(3)));
|
|
13487
|
+
}
|
|
13488
|
+
// Record recapture attempt data for diagnostics - always store the best score
|
|
13489
|
+
// from the move-closer window so debug info shows what was actually captured
|
|
13490
|
+
dispatchIdCaptureAction({
|
|
13491
|
+
type: 'barcodeRecaptureScoreUpdated',
|
|
13492
|
+
payload: {
|
|
13493
|
+
recaptureBarcodeScore: recaptureScore
|
|
13494
|
+
}
|
|
13495
|
+
});
|
|
13496
|
+
// Persist the barcode image from move-closer window for debug visual comparison
|
|
13497
|
+
if (recaptureBarcode) {
|
|
13498
|
+
dispatchIdCaptureAction({
|
|
13499
|
+
type: 'recaptureBarcodeImageCaptured',
|
|
13500
|
+
payload: {
|
|
13501
|
+
recaptureBarcodeImage: recaptureBarcode.canvas.toDataURL('image/jpeg', 0.95)
|
|
13502
|
+
}
|
|
13503
|
+
});
|
|
13504
|
+
}
|
|
13505
|
+
dispatchIdCaptureAction({
|
|
13506
|
+
type: 'barcodeRecaptureCompleted'
|
|
13507
|
+
});
|
|
13508
|
+
}, barcodeRecaptureMoveCloserTimeoutMs);
|
|
13509
|
+
return function () {
|
|
13510
|
+
return clearTimeout(t);
|
|
13511
|
+
};
|
|
13512
|
+
}, [barcodeRecaptureMoveCloserTimeoutMs, getRecaptureBestBarcode, start, state.captureState, state.initialBarcodeScore]);
|
|
13513
|
+
React.useEffect(function () {
|
|
13514
|
+
if (state.captureState !== 'requestingBetterBarcode') return;
|
|
13515
|
+
if (!barcodeRecaptureGrowthSatisfied) return;
|
|
13516
|
+
var t = setTimeout(function () {
|
|
13517
|
+
var _a, _b;
|
|
13518
|
+
// Capture window expired - complete with whatever barcode we have
|
|
13519
|
+
var recaptureBarcode = getRecaptureBestBarcode();
|
|
13520
|
+
var bestBarcode = getBestBarcode();
|
|
13521
|
+
var recaptureScore = (_a = recaptureBarcode === null || recaptureBarcode === void 0 ? void 0 : recaptureBarcode.score) !== null && _a !== void 0 ? _a : null;
|
|
13522
|
+
var improved = !!bestBarcode && bestBarcode.score > state.initialBarcodeScore;
|
|
13523
|
+
log("[IdCaptureWizard] Recapture timeout debug: recaptureBarcode=".concat(!!recaptureBarcode, ", recaptureScore=").concat(recaptureScore, ", bestBarcode=").concat(!!bestBarcode, ", bestBarcodeScore=").concat(bestBarcode === null || bestBarcode === void 0 ? void 0 : bestBarcode.score, ", initialScore=").concat(state.initialBarcodeScore, ", improved=").concat(improved));
|
|
13524
|
+
// Store the recapture score for diagnostic purposes
|
|
13525
|
+
// Always use actual recapture score (even if worse than initial) so debug info
|
|
13526
|
+
// shows what was actually captured during each sequence
|
|
13527
|
+
dispatchIdCaptureAction({
|
|
13528
|
+
type: 'barcodeRecaptureScoreUpdated',
|
|
13529
|
+
payload: {
|
|
13530
|
+
recaptureBarcodeScore: recaptureScore
|
|
13531
|
+
}
|
|
13532
|
+
});
|
|
13533
|
+
// Store the recapture barcode image if we found one
|
|
13534
|
+
if (recaptureBarcode) {
|
|
13535
|
+
dispatchIdCaptureAction({
|
|
13536
|
+
type: 'recaptureBarcodeImageCaptured',
|
|
13537
|
+
payload: {
|
|
13538
|
+
recaptureBarcodeImage: recaptureBarcode.canvas.toDataURL('image/jpeg', 0.95)
|
|
13539
|
+
}
|
|
13540
|
+
});
|
|
13541
|
+
} else if (improved) {
|
|
13542
|
+
// If we improved but don't have a recapture-specific best tracked,
|
|
13543
|
+
// still persist the "after" image so debug visual comparison works.
|
|
13544
|
+
dispatchIdCaptureAction({
|
|
13545
|
+
type: 'recaptureBarcodeImageCaptured',
|
|
13546
|
+
payload: {
|
|
13547
|
+
recaptureBarcodeImage: bestBarcode.canvas.toDataURL('image/jpeg', 0.95)
|
|
13548
|
+
}
|
|
13549
|
+
});
|
|
13550
|
+
}
|
|
13551
|
+
if (improved) {
|
|
13552
|
+
log("[IdCaptureWizard] Barcode recapture completed. Found better barcode: ".concat(bestBarcode.score.toFixed(3), " (was ").concat(state.initialBarcodeScore.toFixed(3), ")"));
|
|
13553
|
+
dispatchIdCaptureAction({
|
|
13554
|
+
type: 'barcodeCaptured',
|
|
13555
|
+
payload: {
|
|
13556
|
+
imageUrl: bestBarcode.canvas.toDataURL('image/jpeg', 0.95),
|
|
13557
|
+
barcodeReadabilityScore: bestBarcode.score
|
|
13558
|
+
}
|
|
13559
|
+
});
|
|
13560
|
+
} else {
|
|
13561
|
+
log("[IdCaptureWizard] Barcode recapture completed. No better barcode found. Best recapture score: ".concat((_b = recaptureScore === null || recaptureScore === void 0 ? void 0 : recaptureScore.toFixed(3)) !== null && _b !== void 0 ? _b : 'none', ", initial score: ").concat(state.initialBarcodeScore.toFixed(3)));
|
|
13562
|
+
}
|
|
13563
|
+
dispatchIdCaptureAction({
|
|
13564
|
+
type: 'barcodeRecaptureCompleted'
|
|
13565
|
+
});
|
|
13566
|
+
}, barcodeRecaptureTimeoutMs);
|
|
13567
|
+
return function () {
|
|
13568
|
+
return clearTimeout(t);
|
|
13569
|
+
};
|
|
13570
|
+
}, [barcodeRecaptureGrowthSatisfied, barcodeRecaptureTimeoutMs, getBestBarcode, getRecaptureBestBarcode, state.captureState, state.initialBarcodeScore]);
|
|
13571
|
+
// Continue detection during barcode recapture and update barcode if better one found
|
|
13572
|
+
React.useEffect(function () {
|
|
13573
|
+
if (state.captureState !== 'requestingBetterBarcode') return;
|
|
13574
|
+
// Set required document type to idCardBack for barcode detection
|
|
13575
|
+
setRequiredDocumentType('idCardBack');
|
|
13576
|
+
return function () {
|
|
13577
|
+
setRequiredDocumentType('none');
|
|
13578
|
+
};
|
|
13579
|
+
}, [setRequiredDocumentType, state.captureState]);
|
|
11530
13580
|
React.useEffect(function () {
|
|
11531
13581
|
if (state.requestedDocumentType === 'idCardFront') {
|
|
11532
13582
|
if (captureRequirement === 'idCardOrPassport') {
|
|
@@ -11565,9 +13615,9 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11565
13615
|
});
|
|
11566
13616
|
});
|
|
11567
13617
|
}, []);
|
|
11568
|
-
var
|
|
11569
|
-
progressStarted =
|
|
11570
|
-
setProgressStarted =
|
|
13618
|
+
var _23 = React.useState(false),
|
|
13619
|
+
progressStarted = _23[0],
|
|
13620
|
+
setProgressStarted = _23[1];
|
|
11571
13621
|
React.useEffect(function () {
|
|
11572
13622
|
if (state.captureState === 'capturing') {
|
|
11573
13623
|
setProgressStarted(false);
|
|
@@ -11578,6 +13628,65 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11578
13628
|
setProgressStarted(true);
|
|
11579
13629
|
}
|
|
11580
13630
|
}, [state.goodFramesCount]);
|
|
13631
|
+
// Configure client barcode scan state
|
|
13632
|
+
React.useEffect(function () {
|
|
13633
|
+
dispatchIdCaptureAction({
|
|
13634
|
+
type: 'configureClientBarcodeScan',
|
|
13635
|
+
payload: {
|
|
13636
|
+
enabled: enableClientBarcodeScan
|
|
13637
|
+
}
|
|
13638
|
+
});
|
|
13639
|
+
}, [enableClientBarcodeScan]);
|
|
13640
|
+
// Client barcode scanning integration
|
|
13641
|
+
var dynamsoftContext = useDynamsoftBarcodeContext();
|
|
13642
|
+
var _24 = dynamsoftContext !== null && dynamsoftContext !== void 0 ? dynamsoftContext : {
|
|
13643
|
+
loadState: 'not-started',
|
|
13644
|
+
lastDecodeResult: null,
|
|
13645
|
+
isScanning: false,
|
|
13646
|
+
startScanning: function startScanning() {},
|
|
13647
|
+
stopScanning: function stopScanning() {}
|
|
13648
|
+
},
|
|
13649
|
+
dynamsoftLoadState = _24.loadState,
|
|
13650
|
+
lastDecodeResult = _24.lastDecodeResult,
|
|
13651
|
+
isDynamsoftScanning = _24.isScanning,
|
|
13652
|
+
startScanning = _24.startScanning,
|
|
13653
|
+
stopScanning = _24.stopScanning;
|
|
13654
|
+
// Start/stop client barcode scanning when capturing ID back or during barcode recapture
|
|
13655
|
+
React.useEffect(function () {
|
|
13656
|
+
if (!enableClientBarcodeScan) return;
|
|
13657
|
+
if (dynamsoftLoadState !== 'ready') return;
|
|
13658
|
+
// Scan during initial ID back capture
|
|
13659
|
+
var isCapturingIdBack = overlayDismissed && state.captureState === 'capturing' && state.requestedDocumentType === 'idCardBack';
|
|
13660
|
+
// Also scan during barcode recapture flow (when asking user to move closer)
|
|
13661
|
+
var isInBarcodeRecapture = state.captureState === 'requestingBetterBarcode';
|
|
13662
|
+
var shouldScan = (isCapturingIdBack || isInBarcodeRecapture) && !lastDecodeResult;
|
|
13663
|
+
if (shouldScan && !isDynamsoftScanning) {
|
|
13664
|
+
log('[IdCaptureWizard] Starting client barcode scanning');
|
|
13665
|
+
dispatchIdCaptureAction({
|
|
13666
|
+
type: 'clientBarcodeScanStarted'
|
|
13667
|
+
});
|
|
13668
|
+
startScanning();
|
|
13669
|
+
} else if (!shouldScan && isDynamsoftScanning) {
|
|
13670
|
+
log('[IdCaptureWizard] Stopping client barcode scanning');
|
|
13671
|
+
stopScanning();
|
|
13672
|
+
dispatchIdCaptureAction({
|
|
13673
|
+
type: 'clientBarcodeScanStopped'
|
|
13674
|
+
});
|
|
13675
|
+
}
|
|
13676
|
+
}, [enableClientBarcodeScan, dynamsoftLoadState, overlayDismissed, state.captureState, state.requestedDocumentType, lastDecodeResult, isDynamsoftScanning, startScanning, stopScanning]);
|
|
13677
|
+
// Handle client barcode decode result
|
|
13678
|
+
React.useEffect(function () {
|
|
13679
|
+
if (!lastDecodeResult) return;
|
|
13680
|
+
log("[IdCaptureWizard] Client barcode decoded: ".concat(lastDecodeResult.format, " - ").concat(lastDecodeResult.text.substring(0, 50), "..."));
|
|
13681
|
+
dispatchIdCaptureAction({
|
|
13682
|
+
type: 'clientBarcodeDecoded',
|
|
13683
|
+
payload: lastDecodeResult
|
|
13684
|
+
});
|
|
13685
|
+
// Note: We no longer exit recapture immediately when Dynamsoft decodes.
|
|
13686
|
+
// This allows the barcode recapture flow to continue and capture a good
|
|
13687
|
+
// barcode image for comparison with native decoder results.
|
|
13688
|
+
onClientBarcodeDecoded === null || onClientBarcodeDecoded === void 0 ? void 0 : onClientBarcodeDecoded(lastDecodeResult);
|
|
13689
|
+
}, [lastDecodeResult, onClientBarcodeDecoded]);
|
|
11581
13690
|
if (isFallbackMode) {
|
|
11582
13691
|
return /*#__PURE__*/React__namespace.default.createElement(IdCaptureFallback, {
|
|
11583
13692
|
idCaptureRequirement: captureRequirement,
|
|
@@ -11595,9 +13704,9 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11595
13704
|
verbiage: verbiage.uploadOrCaptureScreen
|
|
11596
13705
|
});
|
|
11597
13706
|
}
|
|
11598
|
-
var requestedAction = state.captureState === 'requestingFlip' ? 'FLIP_ID' : state.requestedDocumentType === 'idCardBack' ? 'SHOW_ID_BACK' : state.requestedDocumentType === 'passport' ? 'SHOW_PASSPORT' : 'SHOW_ID_FRONT';
|
|
13707
|
+
var requestedAction = state.captureState === 'requestingFlip' ? 'FLIP_ID' : state.captureState === 'requestingBetterBarcode' ? 'SHOW_ID_BACK' : state.requestedDocumentType === 'idCardBack' ? 'SHOW_ID_BACK' : state.requestedDocumentType === 'passport' ? 'SHOW_PASSPORT' : 'SHOW_ID_FRONT';
|
|
11599
13708
|
var guidesStatus = !overlayDismissed ? 'disabled' : state.isGoodFrame ? 'capturing' : 'ready';
|
|
11600
|
-
return /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ScalingCameraFeed, null), overlayDismissed && state.captureState === 'capturing' && (/*#__PURE__*/React__namespace.default.createElement(IdCapture, {
|
|
13709
|
+
return /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(ScalingCameraFeed, null), overlayDismissed && (state.captureState === 'capturing' || state.captureState === 'requestingBetterBarcode') && (/*#__PURE__*/React__namespace.default.createElement(IdCapture, {
|
|
11601
13710
|
requiredDocumentType: state.requestedDocumentType,
|
|
11602
13711
|
thresholds: thresholds,
|
|
11603
13712
|
onCapture: onCapture,
|
|
@@ -11605,27 +13714,35 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11605
13714
|
colors: colors,
|
|
11606
13715
|
verbiage: idCaptureVerbiage,
|
|
11607
13716
|
debugMode: debugMode
|
|
11608
|
-
})), /*#__PURE__*/React__namespace.default.createElement(
|
|
13717
|
+
})), overlayDismissed && state.captureState === 'requestingBetterBarcode' && (/*#__PURE__*/React__namespace.default.createElement(GuidanceMessageContainer, {
|
|
13718
|
+
"$top": "",
|
|
13719
|
+
"$bottom": "12.5%",
|
|
13720
|
+
className: (_f = classNames.capture) === null || _f === void 0 ? void 0 : _f.guidanceMessageContainer
|
|
13721
|
+
}, /*#__PURE__*/React__namespace.default.createElement(GuidanceMessage, {
|
|
13722
|
+
"$variant": "default",
|
|
13723
|
+
className: (_g = classNames.capture) === null || _g === void 0 ? void 0 : _g.guidanceMessage
|
|
13724
|
+
}, barcodeRecaptureGuidanceMessage))), /*#__PURE__*/React__namespace.default.createElement(IdCaptureGuides, {
|
|
11609
13725
|
key: "guides".concat(attempt),
|
|
11610
13726
|
guideType: guideType,
|
|
11611
13727
|
status: guidesStatus,
|
|
11612
|
-
progress: progressStarted &&
|
|
13728
|
+
progress: progressStarted && isCapturing ? 1 : 0,
|
|
11613
13729
|
portraitGuidesOnMobile: portraitGuidesOnMobile,
|
|
11614
13730
|
requestedAction: requestedAction,
|
|
11615
13731
|
images: guideImages,
|
|
11616
13732
|
classNames: classNames.guides,
|
|
11617
13733
|
colors: colors,
|
|
11618
13734
|
verbiage: idCaptureVerbiage,
|
|
11619
|
-
isBackToFront: state.allowIdCardBackToFrontCapture && 'idCardBack' in state.capturedDocuments
|
|
11620
|
-
|
|
11621
|
-
|
|
11622
|
-
|
|
13735
|
+
isBackToFront: state.allowIdCardBackToFrontCapture && 'idCardBack' in state.capturedDocuments,
|
|
13736
|
+
isRequestingBetterBarcode: state.captureState === 'requestingBetterBarcode'
|
|
13737
|
+
}), debugMode && !((_j = (_h = theme.idCapture) === null || _h === void 0 ? void 0 : _h.capturePreview) === null || _j === void 0 ? void 0 : _j.disabled) && state.captureState === 'requestingFlip' && !separateIdCardCaptureSequence && state.imageUrl && (/*#__PURE__*/React__namespace.default.createElement(IdCaptureImagePreview, {
|
|
13738
|
+
classNames: (_k = classNames.capture) === null || _k === void 0 ? void 0 : _k.imagePreview,
|
|
13739
|
+
text: (_l = idCaptureVerbiages === null || idCaptureVerbiages === void 0 ? void 0 : idCaptureVerbiages.idCardFront) === null || _l === void 0 ? void 0 : _l.processingIdCardText,
|
|
11623
13740
|
imageUrl: state.imageUrl
|
|
11624
13741
|
})), state.captureState !== 'complete' && (/*#__PURE__*/React__namespace.default.createElement("div", {
|
|
11625
13742
|
id: "idmission-above-guides-content"
|
|
11626
13743
|
})), (!customOverlayContent || !!customOverlayContent && overlayDismissed) && (/*#__PURE__*/React__namespace.default.createElement(ExitCaptureButton, {
|
|
11627
13744
|
onClick: onExit,
|
|
11628
|
-
className: (
|
|
13745
|
+
className: (_m = classNames.capture) === null || _m === void 0 ? void 0 : _m.exitCaptureBtn
|
|
11629
13746
|
})), !overlayDismissed && (/*#__PURE__*/React__namespace.default.createElement(IdCaptureLoadingOverlay, {
|
|
11630
13747
|
key: "loading".concat(attempt),
|
|
11631
13748
|
mode: loadingOverlayMode,
|
|
@@ -11663,9 +13780,21 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
11663
13780
|
onRetryClick: onRetryClick,
|
|
11664
13781
|
colors: colors.success,
|
|
11665
13782
|
verbiage: verbiage.success,
|
|
11666
|
-
debugMode: debugMode
|
|
13783
|
+
debugMode: debugMode,
|
|
13784
|
+
initialBarcodeScore:
|
|
13785
|
+
// Show diagnostic info if recapture occurred (indicated by recaptureBarcodeScore being set)
|
|
13786
|
+
// If recapture occurred, initialBarcodeScore was set (even if it's 0, which is valid)
|
|
13787
|
+
state.recaptureBarcodeScore !== null ? state.initialBarcodeScore : undefined,
|
|
13788
|
+
recaptureBarcodeScore: state.recaptureBarcodeScore,
|
|
13789
|
+
initialCaptureBarcodeImage: state.initialCaptureBarcodeImage,
|
|
13790
|
+
recaptureBarcodeImage: state.recaptureBarcodeImage,
|
|
13791
|
+
clientBarcodeDecodeResult: state.clientBarcodeDecodeResult,
|
|
13792
|
+
nativeBarcodeDecodeResult: state.nativeBarcodeDecodeResult
|
|
11667
13793
|
})));
|
|
11668
13794
|
};
|
|
13795
|
+
function IdCaptureWizardInner(props) {
|
|
13796
|
+
return /*#__PURE__*/React__namespace.default.createElement(IdCaptureStateProvider, null, /*#__PURE__*/React__namespace.default.createElement(GuideOrientationContextProvider, null, /*#__PURE__*/React__namespace.default.createElement(IdCaptureWizard, _assign({}, props))));
|
|
13797
|
+
}
|
|
11669
13798
|
function IdCaptureWizardWithProviders(_a) {
|
|
11670
13799
|
var _b, _c, _d, _e, _f, _g;
|
|
11671
13800
|
var onCameraAccessDenied = _a.onCameraAccessDenied,
|
|
@@ -11673,6 +13802,20 @@ function IdCaptureWizardWithProviders(_a) {
|
|
|
11673
13802
|
onMicrophoneAccessDenied = _a.onMicrophoneAccessDenied,
|
|
11674
13803
|
shouldLoadIdCaptureModels = _a.shouldLoadIdCaptureModels,
|
|
11675
13804
|
idCaptureProps = __rest(_a, ["onCameraAccessDenied", "onCameraTamperingDetected", "onMicrophoneAccessDenied", "shouldLoadIdCaptureModels"]);
|
|
13805
|
+
var enableClientBarcodeScan = idCaptureProps.enableClientBarcodeScan,
|
|
13806
|
+
dynamsoftOrganizationId = idCaptureProps.dynamsoftOrganizationId,
|
|
13807
|
+
dynamsoftLicenseKey = idCaptureProps.dynamsoftLicenseKey,
|
|
13808
|
+
promptForDynamsoftLicense = idCaptureProps.promptForDynamsoftLicense,
|
|
13809
|
+
onClientBarcodeDecoded = idCaptureProps.onClientBarcodeDecoded;
|
|
13810
|
+
// Enable Dynamsoft provider if we have credentials OR if prompt mode is enabled
|
|
13811
|
+
var shouldUseDynamsoftProvider = enableClientBarcodeScan && (dynamsoftOrganizationId || dynamsoftLicenseKey || promptForDynamsoftLicense);
|
|
13812
|
+
var innerContent = shouldUseDynamsoftProvider ? (/*#__PURE__*/React__namespace.default.createElement(DynamsoftBarcodeProvider, {
|
|
13813
|
+
organizationId: dynamsoftOrganizationId,
|
|
13814
|
+
licenseKey: dynamsoftLicenseKey,
|
|
13815
|
+
promptForLicense: promptForDynamsoftLicense,
|
|
13816
|
+
enabled: enableClientBarcodeScan,
|
|
13817
|
+
onBarcodeDecoded: onClientBarcodeDecoded
|
|
13818
|
+
}, /*#__PURE__*/React__namespace.default.createElement(IdCaptureWizardInner, _assign({}, idCaptureProps)))) : (/*#__PURE__*/React__namespace.default.createElement(IdCaptureWizardInner, _assign({}, idCaptureProps)));
|
|
11676
13819
|
return /*#__PURE__*/React__namespace.default.createElement(CameraStoreProvider, {
|
|
11677
13820
|
onCameraAccessDenied: onCameraAccessDenied,
|
|
11678
13821
|
onCameraTamperingDetected: onCameraTamperingDetected,
|
|
@@ -11688,7 +13831,7 @@ function IdCaptureWizardWithProviders(_a) {
|
|
|
11688
13831
|
onModelError: idCaptureProps.onModelError,
|
|
11689
13832
|
modelLoadTimeoutMs: idCaptureProps.modelLoadTimeoutMs,
|
|
11690
13833
|
allowSinglePageIdCapture: idCaptureProps.allowSinglePageIdCapture
|
|
11691
|
-
},
|
|
13834
|
+
}, innerContent));
|
|
11692
13835
|
}
|
|
11693
13836
|
|
|
11694
13837
|
function SelfieCaptureLoadingGraphic(_a) {
|
|
@@ -18226,7 +20369,14 @@ var IdValidation = function IdValidation(_a) {
|
|
|
18226
20369
|
geolocationRequired = _6 === void 0 ? false : _6,
|
|
18227
20370
|
_7 = _a.debugMode,
|
|
18228
20371
|
debugMode = _7 === void 0 ? false : _7,
|
|
18229
|
-
documentEdgeDistancePct = _a.documentEdgeDistancePct
|
|
20372
|
+
documentEdgeDistancePct = _a.documentEdgeDistancePct,
|
|
20373
|
+
_8 = _a.enableClientBarcodeScan,
|
|
20374
|
+
enableClientBarcodeScan = _8 === void 0 ? false : _8,
|
|
20375
|
+
dynamsoftOrganizationId = _a.dynamsoftOrganizationId,
|
|
20376
|
+
dynamsoftLicenseKey = _a.dynamsoftLicenseKey,
|
|
20377
|
+
_9 = _a.promptForDynamsoftLicense,
|
|
20378
|
+
promptForDynamsoftLicense = _9 === void 0 ? false : _9,
|
|
20379
|
+
onClientBarcodeDecoded = _a.onClientBarcodeDecoded;
|
|
18230
20380
|
useLanguage(lang);
|
|
18231
20381
|
useDebugLogging(debugMode);
|
|
18232
20382
|
var idCaptureProps = React.useMemo(function () {
|
|
@@ -18267,9 +20417,14 @@ var IdValidation = function IdValidation(_a) {
|
|
|
18267
20417
|
classNames: classNames,
|
|
18268
20418
|
colors: colors,
|
|
18269
20419
|
verbiage: verbiage,
|
|
18270
|
-
debugMode: debugMode
|
|
20420
|
+
debugMode: debugMode,
|
|
20421
|
+
enableClientBarcodeScan: enableClientBarcodeScan,
|
|
20422
|
+
dynamsoftOrganizationId: dynamsoftOrganizationId,
|
|
20423
|
+
dynamsoftLicenseKey: dynamsoftLicenseKey,
|
|
20424
|
+
promptForDynamsoftLicense: promptForDynamsoftLicense,
|
|
20425
|
+
onClientBarcodeDecoded: onClientBarcodeDecoded
|
|
18271
20426
|
};
|
|
18272
|
-
}, [onLoadingStarted, onLoadingProgress, onLoadingCompleted, onLoadingFailed, onExitCapture, onUserCancel, onModelError, onDocumentCaptured, onDocumentDetected, documentDetectionThrottleMs, precapturedDocuments, idCaptureRequirement, allowSinglePageIdCapture, separateIdCardCaptureSequence, idCaptureThresholds, skipSuccessScreen, loadingOverlayMode, customOverlayContent, onLoadingOverlayDismissed, forceFallbackMode, silentFallback, allowIdCardBackToFrontCapture, allowUploadingDocumentsFromStorage, instructions, guideType, guideImages, portraitGuidesOnMobile, rotateLoadingOverlayImageWhenPortrait, modelLoadTimeoutMs, enableOverrideWrongDocumentTypeDialog, allowOverrideWrongDocumentTypeAfterMs, assets, classNames, colors, verbiage, debugMode, documentEdgeDistancePct]);
|
|
20427
|
+
}, [onLoadingStarted, onLoadingProgress, onLoadingCompleted, onLoadingFailed, onExitCapture, onUserCancel, onModelError, onDocumentCaptured, onDocumentDetected, documentDetectionThrottleMs, precapturedDocuments, idCaptureRequirement, allowSinglePageIdCapture, separateIdCardCaptureSequence, idCaptureThresholds, skipSuccessScreen, loadingOverlayMode, customOverlayContent, onLoadingOverlayDismissed, forceFallbackMode, silentFallback, allowIdCardBackToFrontCapture, allowUploadingDocumentsFromStorage, instructions, guideType, guideImages, portraitGuidesOnMobile, rotateLoadingOverlayImageWhenPortrait, modelLoadTimeoutMs, enableOverrideWrongDocumentTypeDialog, allowOverrideWrongDocumentTypeAfterMs, assets, classNames, colors, verbiage, debugMode, documentEdgeDistancePct, enableClientBarcodeScan, dynamsoftOrganizationId, dynamsoftLicenseKey, promptForDynamsoftLicense, onClientBarcodeDecoded]);
|
|
18273
20428
|
var additionalDocumentCaptureProps = React.useMemo(function () {
|
|
18274
20429
|
return {
|
|
18275
20430
|
documents: captureAdditionalDocuments,
|