UNPKG

@sheerid/jslib-nightly

Version:

SheerID JavaScript Library

490 lines (488 loc) 16.2 kB
/** * VERSION: 2.154.0-alpha.1 * BUILD_TIMESTAMP: 1763401515326 * BUILD_DATE: Mon Nov 17 2025 17:45:15 GMT+0000 (Coordinated Universal Time) * BUILD_COMMIT: 73f4468155aaed0f31ab0d59dc3394018b939b6d */ import { l as M, R as r, aE as V, aF as x, aG as S, aH as Q, aI as I, aJ as G, aK as K, aL as y, r as E, j as e, aM as W, A as F, c as d, aN as N, v as q, L as X, V as J, n as Z, a2 as R, p as Y, a3 as ee } from "../sheerid.js"; const se = async (s, t, i = void 0) => { M.info(`uploading files to ${s}`); const a = new FormData(); return a.append("frontImage", t), i && a.append("backImage", i), fetch(s, { method: "POST", body: a }); }, A = (s, t, i = "image/jpeg") => { const a = atob(s), l = new Uint8Array(a.length); for (let o = 0; o < a.length; o++) l[o] = a.charCodeAt(o); return new File([l], t, { type: i }); }; function te() { return typeof window > "u" ? !1 : window.matchMedia("(pointer: coarse)").matches && window.innerWidth <= 768; } function ae({ verificationId: s, locale: t, currentUploadAttempt: i, setCurrentUploadAttempt: a, setStartPolling: l }) { const o = r.useRef(null), [u, g] = r.useState(), [j, n] = r.useState(), [_, k] = r.useState(!1), p = te(); return r.useEffect(() => { const m = new V(); window.RegulaDocumentSDK = m; const h = new URL(window.location.href); return h.searchParams.set("verificationId", s), m.recognizerProcessParam = { processParam: { scenario: S, multipageProcessing: !0, updateOCRValidityByGlare: !0, strictImageQuality: !0, imageQa: { expectedPass: [ x.Glares, x.Focus, x.Resolution, x.Perspective, x.Bounds, x.Portrait, x.Brightness ], focusCheck: !0, glaresCheck: !0 } }, delegateProcessing: { serviceURL: p ? void 0 : h.toString(), delegateURL: p ? void 0 : h.toString() } }, Q().then(() => { m.initialize(void 0); }), () => { m.shutdown(), m.initializeListener = null; }; }, [p, s]), r.useEffect(() => { const m = () => { o.current && (o.current.settings = { internalScenario: S, locale: t || "en", startScreen: !0, uploadFileButton: !1, captureButton: !1, copyright: !1, closeButton: !0, skipButton: !1 }); }, h = (w) => { const L = w?.data?.response, v = L?.images?.fieldList, P = L?.status, U = v?.find((c) => c.fieldType === G.DOCUMENT_FRONT)?.valueList ?? [], D = (c) => U.find( (b) => b.pageIndex === c && b.containerType === K.RAW_UNCROPPED_IMAGE ), B = () => { const c = P?.detailsOptical, b = c?.imageQA === y.ERROR || c?.imageQA === y.WAS_NOT_DONE, H = c?.expiry === y.ERROR, z = c?.text === y.ERROR, $ = c?.mrz === y.ERROR; return b || H || z || $; }; if (v?.length) { const c = D(0), b = D(1); g(c?.value), n(b?.value), k(B()); } }, C = () => { p || l(!0); }, f = (w) => { const v = w?.detail; switch (v?.action) { case I.ELEMENT_VISIBLE: m(); break; case I.PROCESS_FINISHED: h(v); break; case I.PRESS_REMOTE_DEVICE_BUTTON: C(); break; } }; return window.addEventListener("document-reader", f), () => { window.removeEventListener("document-reader", f); }; }, [p, t]), { readerRef: o, frontImage: u, backImage: j, hasImageError: _, handleRetry: () => { g(void 0), n(void 0), k(!1), a(i + 1); } }; } function ie({ title: s, titleId: t, ...i }, a) { return /* @__PURE__ */ E.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", "aria-hidden": "true", "data-slot": "icon", ref: a, "aria-labelledby": t }, i), s ? /* @__PURE__ */ E.createElement("title", { id: t }, s) : null, /* @__PURE__ */ E.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" })); } const oe = /* @__PURE__ */ E.forwardRef(ie), T = ({ src: s, alt: t = "", imageClassName: i = "", imageContainerClassName: a = "" }) => { const l = r.useRef(null), [o, u] = r.useState(!1), g = (n) => { (n.key === "Enter" || n.key === " ") && (n.preventDefault(), u(!0)); }, j = (n) => { (n.key === "Enter" || n.key === " " || n.key === "Escape") && (n.preventDefault(), u(!1)); }; return r.useEffect(() => { o && l.current?.focus(); }, [o]), /* @__PURE__ */ e.jsxs(e.Fragment, { children: [ /* @__PURE__ */ e.jsxs( "div", { role: "button", tabIndex: 0, "aria-label": "Expand image", "data-testid": "image-preview-container", className: `expandable-image__preview-container ${a}`, onClick: () => u(!0), onKeyDown: g, children: [ /* @__PURE__ */ e.jsx( "img", { src: s, alt: t, "data-testid": "image-preview", className: `expandable-image__preview-image ${i}` } ), /* @__PURE__ */ e.jsx(oe, { "data-testid": "expand-icon", className: "expandable-image__expand-icon" }) ] } ), o && W.createPortal( /* @__PURE__ */ e.jsxs( "div", { ref: l, role: "button", tabIndex: 0, "aria-label": "Close expanded image", "data-testid": "overlay", className: "expandable-image__overlay", onClick: () => u(!1), onKeyDown: j, children: [ /* @__PURE__ */ e.jsx( "button", { type: "button", "aria-label": "Close fullscreen image", "data-testid": "close-button", className: "expandable-image__close-button", children: "×" } ), /* @__PURE__ */ e.jsx( "img", { src: s, alt: t, "data-testid": "image-expanded", className: "expandable-image__expanded-image" } ) ] } ), document.body ) ] }); }, ne = ({ frontImage: s, backImage: t, hasImageError: i, currentUploadAttempt: a, onRetry: l, onSubmit: o }) => /* @__PURE__ */ e.jsxs("div", { className: "sid-header sid-l-horz-center", "data-testid": "sid-review-pending", children: [ /* @__PURE__ */ e.jsx(F, { align: "center", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.sdk.title", defaultMessage: "Identity document upload", tagName: "h1" } ) }), /* @__PURE__ */ e.jsx("div", { className: "sid-header__subtitle", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.sdk.subtitle", defaultMessage: "Submit a photo of your government-issued ID to continue verification." } ) }), i && a < N && /* @__PURE__ */ e.jsxs("div", { className: "sid-step-id-check-loop__error-wrapper", children: [ /* @__PURE__ */ e.jsx("div", { className: "sid-step-id-check-loop__error-header", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.sdk.imageQualityErrorTitle", defaultMessage: "We couldn't process your document" } ) }), /* @__PURE__ */ e.jsx("ul", { className: "sid-step-id-check-loop__error-list", children: /* @__PURE__ */ e.jsx("li", { className: "sid-step-id-check-loop__error-list-li", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.sdk.imageQualityError", defaultMessage: "The image has quality issues. Make sure it's clear, well-lit, and all details are visible." } ) }) }), /* @__PURE__ */ e.jsx("div", { className: "sid-step-id-check-loop__error-next-step", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.sdk.rejectedImageNextStep", defaultMessage: "Please retake and upload again." } ) }) ] }), /* @__PURE__ */ e.jsxs("div", { className: "sid-step-id-check-loop__image-preview-wrapper", children: [ s && /* @__PURE__ */ e.jsx( T, { src: `data:image/jpeg;base64,${s}`, alt: "front", imageContainerClassName: "sid-step-id-check-loop__image-preview" } ), t && /* @__PURE__ */ e.jsx( T, { src: `data:image/jpeg;base64,${t}`, alt: "back", imageContainerClassName: "sid-step-id-check-loop__image-preview" } ) ] }), /* @__PURE__ */ e.jsx( "button", { onClick: o, type: "button", className: "sid-btn sid-btn--dark", "aria-label": "submit", "data-testid": "submit-button", disabled: i && a < N, children: /* @__PURE__ */ e.jsx(d, { id: "step.idCheckLoop.regula.submit", defaultMessage: "Submit" }) } ), a < N && /* @__PURE__ */ e.jsx("div", { className: "sid-l-space-top-sm", children: /* @__PURE__ */ e.jsx( "button", { onClick: l, type: "button", className: "sid-btn sid-btn-light", "aria-label": "retry", "data-testid": "retry-button", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.sdk.uploadAgain", defaultMessage: "Upload Again" } ) } ) }) ] }), re = 6e3, de = ({ verificationService: s }) => { const t = s.verificationResponse, { uploadUrl: i, verificationId: a, locale: l } = t, [o, u] = r.useState(!1), [g, j] = r.useState(1), [n, _] = r.useState(!1); q( () => { n && s.fetchExistingVerificationRequest( s.programId, a, t, s.previousViewModel, !1 ); }, n ? re : null ); const { frontImage: k, backImage: p, hasImageError: O, handleRetry: m, readerRef: h } = ae({ verificationId: a, locale: l, currentUploadAttempt: g, setCurrentUploadAttempt: j, setStartPolling: _ }), C = () => { u(!0), se( i, A(k, "front.jpg"), p ? A(p, "back.jpg") : void 0 ).then((f) => { f.ok ? s.submitStep( J.idCheckLoop, s.viewModel, s.verificationResponse ) : (M.error( `IdCheckLoop step failed to upload files to: ${i}. ${f.status}` ), u(!1)); }).catch((f) => { M.error(`IdCheckLoop step failed to upload files to: ${i}. ${f}`), u(!1); }); }; return o ? /* @__PURE__ */ e.jsx(X, { step: "idCheckLoop" }) : /* @__PURE__ */ e.jsx("div", { children: k ? /* @__PURE__ */ e.jsx( ne, { frontImage: k, backImage: p, hasImageError: O, currentUploadAttempt: g, onRetry: m, onSubmit: C } ) : ( // Regula web sdk component /* @__PURE__ */ e.jsx( "document-reader", { ref: h, "internal-scenario": S }, `reader-${g}` ) ) }); }, le = de, ce = ({ verificationService: s }) => /* @__PURE__ */ e.jsx(Z, { verificationService: s, children: /* @__PURE__ */ e.jsxs("div", { children: [ /* @__PURE__ */ e.jsx("p", { children: /* @__PURE__ */ e.jsx( R, { id: "step.idCheckLoop.regula.terms", defaultMessage: 'By clicking "Continue", you agree you have read, understand, and accept the {privacyPolicyLink} and {termsOfService}.', values: { privacyPolicyLink: /* @__PURE__ */ e.jsx( "a", { href: "https://regulaforensics.com/privacy/", target: "_blank", rel: "noopener noreferrer", className: "sid-link", children: /* @__PURE__ */ e.jsx( R, { id: "step.idCheckLoop.privacyPolicy", defaultMessage: "Privacy Policy" } ) } ), termsOfService: /* @__PURE__ */ e.jsx( "a", { href: "https://regulaforensics.com/terms-of-use/", target: "_blank", rel: "noopener noreferrer", className: "sid-link", children: /* @__PURE__ */ e.jsx( R, { id: "step.idCheckLoop.termsOfService", defaultMessage: "Terms of Service" } ) } ) } } ) }), /* @__PURE__ */ e.jsx("p", { children: /* @__PURE__ */ e.jsx(R, { id: "companyName", defaultMessage: "{Company}", children: (t) => /* @__PURE__ */ e.jsx( R, { id: "step.idCheckLoop.disclaimer", defaultMessage: "SheerID, {companyName}'s trusted partner, use a third party, {serviceType}, to process our identity check.", values: { serviceType: "Regula", companyName: t } } ) }) }) ] }) }), pe = ({ verificationService: s }) => { const t = s.verificationResponse, [i, a] = r.useState(!1); return r.useEffect(() => { t && t?.errorIds?.length > 0 && a(!0); }, [t]), /* @__PURE__ */ e.jsxs("div", { id: "sid-step-id-check-loop", className: "sid-l-container", children: [ /* @__PURE__ */ e.jsx("div", { className: "sid-l-horz-center", children: /* @__PURE__ */ e.jsx("div", { className: "sid-doc-upload-logo-container sid-l-horz-center", children: /* @__PURE__ */ e.jsx(Y, { verificationService: s }) }) }), i ? /* @__PURE__ */ e.jsx("div", { role: "main", children: /* @__PURE__ */ e.jsx(le, { verificationService: s }) }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [ /* @__PURE__ */ e.jsxs("div", { role: "main", children: [ /* @__PURE__ */ e.jsx(F, { align: "center", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.title", defaultMessage: "To continue, we need to verify your identity." } ) }), /* @__PURE__ */ e.jsx("div", { className: "sid-header__subtitle sid-l-horz-center sid-l-space-btm-md", children: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.subtitle", defaultMessage: "To complete the verification process, we ask that you provide us with:" } ) }), /* @__PURE__ */ e.jsx("div", { className: "sid-identity-check-steps", children: /* @__PURE__ */ e.jsx( ee, { title: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.info.title", defaultMessage: "Photo of a government-issued ID" } ), subtitle: /* @__PURE__ */ e.jsx( d, { id: "step.idCheckLoop.regula.info.subtitle", defaultMessage: "Drivers license, state ID, passport, or residence permit." } ), icon: /* @__PURE__ */ e.jsx( "img", { className: "sid-identity-check-steps__icon", alt: "", src: "https://assets-resources.sheerid.com/common/images/2018/icons/upload-proof.svg" } ), isHighlighted: !0 }, "" ) }), /* @__PURE__ */ e.jsx("div", { className: "sid-submit sid-l-horz-center sid-l-space-top-md sid-l-space-btm-md", children: /* @__PURE__ */ e.jsx( "button", { onClick: () => a(!i), type: "button", className: "sid-btn sid-btn--dark", "aria-label": "submit", children: /* @__PURE__ */ e.jsx(d, { id: "step.idCheckLoop.continue", defaultMessage: "Continue" }) } ) }) ] }), /* @__PURE__ */ e.jsx(ce, { verificationService: s }) ] }) ] }); }; export { pe as default };