@incodetech/web 0.0.0-dev-20260403-eccc51c → 0.0.0-dev-20260407-4580f1c

package/dist/captureOverlay-tCb4R4WE.js

@@ -1,592 +0,0 @@
-import { u as e, c as b, b as z, S as M } from "./loadingIcon-DmuPXh70.js";
-import { D as N, A as g, y as I, d as O, q as B, k as P, P as V, z as H, T as L } from "./vendor-preact-BoMmvSgn.js";
-import { E as W } from "./errorIcon-DEARBrGx.js";
-import { S as E } from "./successIcon-Bjsdc4lF.js";
-import "./instance-BWYzq8dk.js";
-import { T as Z } from "./typography-BDACYR5i.js";
-import { B as _ } from "./button-CE9kRlem.js";
-import { L as S } from "./manualCaptureButton-BvFmTyJe.js";
-const G = ({
-  className: r
-}) => /* @__PURE__ */ e(
-  "svg",
-  {
-    width: "68",
-    height: "68",
-    viewBox: "0 0 68 68",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    class: r,
-    "aria-hidden": "true",
-    children: [
-      /* @__PURE__ */ e(
-        "path",
-        {
-          fillRule: "evenodd",
-          clipRule: "evenodd",
-          d: "M34.0001 68C52.7779 68 68.0003 52.7777 68.0003 34C68.0003 15.2223 52.7779 0 34.0001 0C15.2224 0 0 15.2223 0 34C0 52.7777 15.2224 68 34.0001 68ZM34 63.5265C50.307 63.5265 63.5265 50.3071 63.5265 34.0002C63.5265 17.6932 50.307 4.47385 34 4.47385C17.693 4.47385 4.4736 17.6932 4.4736 34.0002C4.4736 50.3071 17.693 63.5265 34 63.5265Z",
-          fill: "white"
-        }
-      ),
-      /* @__PURE__ */ e("circle", { cx: "33.5926", cy: "33.9996", r: "25.4187", fill: "white" })
-    ]
-  }
-), U = ({ className: r }) => /* @__PURE__ */ e(
-  "svg",
-  {
-    width: "30",
-    height: "30",
-    viewBox: "0 0 30 30",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    class: r,
-    "aria-hidden": "true",
-    children: [
-      /* @__PURE__ */ e(
-        "path",
-        {
-          fillRule: "evenodd",
-          clipRule: "evenodd",
-          d: "M15 0C6.7279 0 0 6.72947 0 15C0 23.2705 6.7279 30 15 30C23.2705 30 30 23.2705 30 15C30 6.72947 23.2705 0 15 0Z",
-          fill: "white"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          fillRule: "evenodd",
-          clipRule: "evenodd",
-          d: "M17.3532 16.0616L17.1305 16.1863C16.1074 16.7579 15.7458 17.0516 15.7537 17.5537C15.7616 18.2074 15.2389 18.7442 14.5853 18.7537H14.5695C13.9221 18.7537 13.3932 18.2342 13.3853 17.5853C13.3584 15.5832 14.9958 14.6674 15.9732 14.1211L16.1958 13.9947C17.0942 13.5005 17.5426 12.8153 17.5426 11.9532C17.5426 10.5274 16.3821 9.36842 14.9563 9.36842C13.5053 9.36842 12.3684 10.5037 12.3684 11.9532C12.3684 12.6068 11.8379 13.1374 11.1842 13.1374C10.5305 13.1374 10 12.6068 10 11.9532C10 9.22158 12.2232 7 14.9563 7C17.6879 7 19.9111 9.22158 19.9111 11.9532C19.9111 13.6947 19.0016 15.1537 17.3532 16.0616ZM14.5711 22.6379C13.9174 22.6379 13.3868 22.1311 13.3868 21.4774V21.43C13.3868 20.7763 13.9174 20.2458 14.5711 20.2458C15.2247 20.2458 15.7553 20.7763 15.7553 21.43C15.7553 22.0837 15.2247 22.6379 14.5711 22.6379Z",
-          fill: "black"
-        }
-      )
-    ]
-  }
-), j = ({ className: r }) => /* @__PURE__ */ e(
-  "svg",
-  {
-    width: "16",
-    height: "16",
-    viewBox: "0 0 16 16",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    class: r,
-    "aria-hidden": "true",
-    children: /* @__PURE__ */ e(
-      "path",
-      {
-        d: "M8 2.83368C9.38071 2.83368 10.5 3.95297 10.5 5.33368V6.66669H11.333C11.7012 6.66669 12 6.96549 12 7.33368V11.9997C12 12.3679 11.7012 12.6667 11.333 12.6667H4.66699C4.2988 12.6667 4 12.3679 4 11.9997V7.33368C4 6.96549 4.2988 6.66669 4.66699 6.66669H5.5V5.33368C5.5 3.95297 6.61929 2.83368 8 2.83368ZM8 3.83368C7.17157 3.83368 6.5 4.50525 6.5 5.33368V6.66669H9.5V5.33368C9.5 4.50525 8.82843 3.83368 8 3.83368Z",
-        fill: "currentColor"
-      }
-    )
-  }
-), q = N(
-  (r, n) => {
-    const { class: t, rows: i = 4, ...a } = r;
-    return /* @__PURE__ */ e(
-      "textarea",
-      {
-        ...a,
-        ref: n,
-        rows: i,
-        class: b("IncodeTextArea", t)
-      }
-    );
-  }
-), K = N(
-  ({
-    id: r,
-    label: n,
-    "aria-label": t,
-    error: i,
-    showErrorIcon: a,
-    helper: o,
-    showHelperIcon: c,
-    required: s,
-    rows: d = 4,
-    class: u,
-    ...v
-  }, l) => {
-    const C = `${r}-helper`, m = `${r}-error`, w = [o ? C : null, i ? m : null].filter(Boolean).join(" ");
-    return /* @__PURE__ */ e("div", { class: b("IncodeTextAreaComposed", u), children: [
-      n && /* @__PURE__ */ e(
-        "label",
-        {
-          class: "IncodeTextAreaComposedLabel",
-          htmlFor: r,
-          "data-testid": `${r}-label`,
-          children: [
-            n,
-            s && /* @__PURE__ */ e("span", { class: "IncodeTextAreaComposedRequired", children: " *" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ e("div", { class: "IncodeTextAreaComposedWrapper", children: /* @__PURE__ */ e(
-        q,
-        {
-          id: r,
-          rows: d,
-          ...v,
-          ref: l,
-          required: s,
-          ...!n && t ? { "aria-label": t } : {},
-          "aria-describedby": w || void 0,
-          "aria-required": s ? "true" : void 0,
-          "aria-invalid": i ? "true" : void 0
-        }
-      ) }),
-      i && /* @__PURE__ */ e(
-        "div",
-        {
-          class: "IncodeTextAreaComposedErrorWrapper",
-          "data-testid": `${r}-error-wrapper`,
-          children: [
-            a && /* @__PURE__ */ e("div", { class: "IncodeTextAreaComposedIconWrapper", children: /* @__PURE__ */ e(W, { size: 17 }) }),
-            /* @__PURE__ */ e("p", { id: m, class: "IncodeTextAreaComposedError", children: i })
-          ]
-        }
-      ),
-      o && !i && /* @__PURE__ */ e(
-        "div",
-        {
-          class: "IncodeTextAreaComposedHelperWrapper",
-          "data-testid": `${r}-helper-wrapper`,
-          children: [
-            c && /* @__PURE__ */ e("div", { class: "IncodeTextAreaComposedIconWrapper", children: /* @__PURE__ */ e(E, { size: 17 }) }),
-            /* @__PURE__ */ e("p", { id: C, class: "IncodeTextAreaComposedHelper", children: o })
-          ]
-        }
-      )
-    ] });
-  }
-);
-K.displayName = "TextAreaComposed";
-const J = N(
-  ({
-    variant: r,
-    aspectRatio: n,
-    orientation: t = "horizontal",
-    frameState: i = "idle",
-    className: a,
-    children: o
-  }, c) => {
-    const s = `IncodeCameraFrame${i.charAt(0).toUpperCase()}${i.slice(1)}`;
-    return /* @__PURE__ */ e(
-      "div",
-      {
-        ref: c,
-        class: b(
-          "IncodeCameraFrame",
-          r === "fill" && "IncodeCameraFrameFill",
-          r === "locked" && "IncodeCameraFrameLocked",
-          r === "locked" && t === "horizontal" && "IncodeCameraFrameHorizontal",
-          r === "locked" && t === "vertical" && "IncodeCameraFrameVertical",
-          s,
-          a
-        ),
-        style: n ? { aspectRatio: n } : void 0,
-        "aria-hidden": !0,
-        children: o
-      }
-    );
-  }
-), Q = ({
-  children: r,
-  className: n
-}) => /* @__PURE__ */ e("div", { class: b("IncodeCameraOverlay", n), children: r }), X = ({
-  title: r,
-  subtitle: n,
-  visible: t = !0,
-  className: i,
-  titleId: a
-}) => {
-  const o = g(null);
-  return I(() => {
-    o.current?.focus();
-  }, []), /* @__PURE__ */ e(
-    "div",
-    {
-      class: b(
-        "IncodeCameraOverlayHeader",
-        !t && "IncodeCameraOverlayHeaderHidden",
-        i
-      ),
-      children: [
-        /* @__PURE__ */ e(
-          Z,
-          {
-            ref: o,
-            id: a,
-            className: "IncodeCameraOverlayHeaderTitle",
-            tabIndex: -1,
-            children: r
-          }
-        ),
-        /* @__PURE__ */ e("p", { class: "IncodeCameraOverlayHeaderSubtitle", children: n })
-      ]
-    }
-  );
-}, Y = ({
-  onOpenHelp: r,
-  onCapture: n,
-  isManualCapture: t,
-  captureAriaLabel: i,
-  captureAriaDescribedBy: a,
-  helpAriaLabel: o,
-  helpButtonRef: c,
-  captureButtonRef: s,
-  encryptionLabel: d,
-  children: u
-}) => {
-  const { t: v } = z();
-  return /* @__PURE__ */ e("div", { class: "IncodeCaptureFooter", children: [
-    /* @__PURE__ */ e("div", { class: "IncodeCaptureFooterEncryption", children: [
-      /* @__PURE__ */ e(j, { className: "IncodeCaptureFooterEncryptionIcon" }),
-      /* @__PURE__ */ e("span", { children: d ?? v("v2.capture.label") })
-    ] }),
-    t && n ? /* @__PURE__ */ e("div", { class: "IncodeCaptureFooterCaptureSection", children: [
-      u,
-      /* @__PURE__ */ e(
-        "button",
-        {
-          ref: s,
-          type: "button",
-          class: "IncodeCaptureFooterCaptureButton",
-          onClick: n,
-          "aria-label": i ?? v("manualCapture.ariaLabel"),
-          "aria-describedby": a,
-          "data-testid": "capture-button",
-          children: /* @__PURE__ */ e(G, {})
-        }
-      )
-    ] }) : null,
-    /* @__PURE__ */ e("div", { class: "IncodeCaptureFooterHelp", children: /* @__PURE__ */ e(
-      _,
-      {
-        ref: c,
-        variant: "link",
-        onClick: r,
-        "aria-label": o ?? v("idv2.needHelp.open"),
-        class: "IncodeCaptureFooterHelpButton",
-        children: /* @__PURE__ */ e(U, {})
-      }
-    ) })
-  ] });
-}, h = /* @__PURE__ */ new Map();
-let $ = !1;
-const y = {
-  blur: () => import("./blurdevicelottie-_BZRug1c.js"),
-  glare: () => import("./glaredevicelottie-DLuIStvb.js"),
-  align: () => import("./aligndevicelottie-DlQCRPfM.js"),
-  front: () => import("./frontdevicelottie-KhKxT5n9.js"),
-  back: () => import("./backdevicelottie-B4NgyWmX.js")
-};
-function R(r) {
-  $ || ($ = !0, Promise.all([
-    y.blur(),
-    y.glare(),
-    y.align(),
-    y.front(),
-    y.back()
-  ]).then(([n, t, i, a, o]) => {
-    h.set("blur", n.default), h.set("glare", t.default), h.set("align", i.default), h.set("front", a.default), h.set("back", o.default), r?.();
-  }).catch(() => {
-  }));
-}
-function ee() {
-  R();
-}
-function re() {
-  I(() => {
-    ee();
-  }, []);
-}
-function te(r, n) {
-  const { t } = z(), [, i] = O(0);
-  if (I(() => {
-    R(() => i((a) => a + 1));
-  }, []), r === "blur")
-    return {
-      title: t("idv2.capture.notifications.blur.title"),
-      description: t("idv2.capture.notifications.blur.description"),
-      animationData: h.get("blur") ?? null
-    };
-  if (r === "glare")
-    return {
-      title: t("idv2.capture.notifications.glare.title"),
-      description: t("idv2.capture.notifications.glare.description"),
-      animationData: h.get("glare") ?? null
-    };
-  if (r === "farAway")
-    return {
-      title: t("idv2.capture.notifications.notAligned.title"),
-      description: t("idv2.capture.notifications.notAligned.description"),
-      animationData: h.get("align") ?? null
-    };
-  if (r === "wrongSide") {
-    const a = n === "back";
-    return {
-      title: t(a ? "idv2.capture.notifications.showBack.title" : "idv2.capture.notifications.showFront.title"),
-      description: t(a ? "idv2.capture.notifications.showBack.description" : "idv2.capture.notifications.showFront.description"),
-      animationData: h.get(a ? "back" : "front") ?? null
-    };
-  }
-  return null;
-}
-const ie = ({
-  detectionStatus: r,
-  mode: n,
-  isCapturing: t
-}) => {
-  const { t: i } = z(), a = te(r, n), o = g(null), c = g({
-    message: "",
-    at: 0
-  }), s = g(r), d = g(!1), u = g(), v = g(), l = r === "detecting" || r === "idNotDetected" || r === "manualCapture", C = r === "manualCapture", m = r === "wrongSide", w = r === "farAway", T = r === "glare", F = r === "blur", p = B((f) => {
-    const k = Date.now(), D = c.current;
-    if (f === D.message && k - D.at < 200) return;
-    c.current = { message: f, at: k };
-    const x = o.current;
-    x && (clearTimeout(u.current), x.textContent = "", v.current = setTimeout(() => {
-      x.textContent = f, u.current = setTimeout(() => {
-        x.textContent = "";
-      }, 3e3);
-    }, 50));
-  }, []), A = B(() => i(n === "passport" ? "idv2.capture.fillFramePassport" : n === "back" ? "idv2.capture.v2.fillFrameBack" : "idv2.capture.v2.fillFrameFront"), [n, i]);
-  return I(() => {
-    if (C) {
-      d.current = !1;
-      return;
-    }
-    if (d.current || !l) return;
-    const f = setTimeout(() => {
-      d.current = !0, p(A());
-    }, 500);
-    return () => clearTimeout(f);
-  }, [l, C, p, A]), I(() => {
-    const f = s.current;
-    s.current = r, f !== "manualCapture" && C && p(i("idv2.capture.manualCapture.modeSwitchAriaAnnouncement"));
-  }, [p, r, C, i]), I(() => {
-    if (!t) {
-      if (m) {
-        const k = n === "front" || n === "passport" ? "idv2.capture.notifications.showFront" : "idv2.capture.notifications.showBack";
-        p(`${i(`${k}.title`)}. ${i(`${k}.description`)}`);
-        return;
-      }
-      if (w) {
-        p(`${i("idv2.capture.notifications.notAligned.title")}.`);
-        return;
-      }
-      if (T) {
-        p(`${i("idv2.capture.notifications.glare.title")}.`);
-        return;
-      }
-      if (F) {
-        p(`${i("idv2.capture.notifications.blur.title")}.`);
-        return;
-      }
-      l && d.current && p(A());
-    }
-  }, [
-    p,
-    F,
-    t,
-    w,
-    T,
-    l,
-    m,
-    n,
-    i,
-    A
-  ]), I(() => () => {
-    clearTimeout(v.current), clearTimeout(u.current);
-  }, []), /* @__PURE__ */ e(P, { children: [
-    /* @__PURE__ */ e(
-      "div",
-      {
-        ref: o,
-        class: "IncodeSrOnly",
-        "aria-live": "assertive",
-        "aria-atomic": "true"
-      }
-    ),
-    a ? /* @__PURE__ */ e("div", { class: b("IncodeIdCaptureNotification"), "aria-hidden": "true", children: /* @__PURE__ */ e("div", { class: "IncodeIdCaptureNotificationContent", children: [
-      /* @__PURE__ */ e("div", { class: b("IncodeIdCaptureNotificationText"), children: [
-        /* @__PURE__ */ e("div", { class: "IncodeIdCaptureNotificationTitle", children: a.title }),
-        a.description && /* @__PURE__ */ e("div", { class: "IncodeIdCaptureNotificationDescription", children: a.description })
-      ] }),
-      /* @__PURE__ */ e(M, { size: 16, direction: "horizontal" }),
-      a.animationData && /* @__PURE__ */ e("div", { class: "IncodeIdCaptureNotificationAnimation", children: /* @__PURE__ */ e(S, { animationData: a.animationData, loop: !0 }) })
-    ] }) }) : null
-  ] });
-}, ne = H(
-  () => import("./front-horizontal-hint-lRLKd7vY.js")
-), ae = H(
-  () => import("./front-vertical-hint-qQoJXRE3.js")
-), oe = H(
-  () => import("./back-horizontal-hint-CSlf9KI1.js")
-), ce = H(
-  () => import("./back-vertical-hint-CNieqiCr.js")
-), le = H(
-  () => import("./passport-horizontal-hint-BCtpMp1Y.js")
-), se = H(
-  () => import("./passport-vertical-hint-GaLnzqHP.js")
-), de = {
-  "front-horizontal": 348,
-  "back-horizontal": 348,
-  "passport-horizontal": 342
-}, ue = {
-  "front-vertical": 446,
-  "back-vertical": 446,
-  "passport-vertical": 342
-};
-function pe(r, n, t, i) {
-  const a = `${r}-${n}`, o = de[a];
-  if (o) return t / o;
-  const c = ue[a];
-  return c ? i / c : 1;
-}
-const fe = ({ mode: r, orientation: n }) => {
-  const t = g(null), [i, a] = O(1);
-  I(() => {
-    const c = t.current;
-    if (!c) return;
-    const s = () => {
-      a(
-        pe(r, n, c.clientWidth, c.clientHeight)
-      );
-    };
-    s();
-    const d = new ResizeObserver(s);
-    return d.observe(c), () => d.disconnect();
-  }, [r, n]);
-  const o = () => r === "front" ? n === "horizontal" ? /* @__PURE__ */ e(ne, {}) : /* @__PURE__ */ e(ae, {}) : r === "back" ? n === "horizontal" ? /* @__PURE__ */ e(oe, {}) : /* @__PURE__ */ e(ce, {}) : r === "passport" ? n === "horizontal" ? /* @__PURE__ */ e(le, {}) : /* @__PURE__ */ e(se, {}) : null;
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      ref: t,
-      class: "IncodeIdHint",
-      "aria-hidden": "true",
-      role: "presentation",
-      children: /* @__PURE__ */ e("div", { class: "IncodeIdHintAnimated", children: /* @__PURE__ */ e(V, { fallback: null, children: /* @__PURE__ */ e("div", { class: "IncodeIdHintSvg", style: { transform: `scale(${i})` }, children: o() }) }) })
-    }
-  );
-}, He = N(
-  ({
-    mode: r,
-    orientation: n,
-    detectionStatus: t,
-    counterValue: i,
-    isCapturing: a,
-    showManualCapture: o,
-    onCapture: c,
-    onOpenHelp: s,
-    helpButtonRef: d,
-    captureButtonRef: u
-  }, v) => {
-    const { t: l } = z();
-    re(), I(() => {
-      o && u && u.current?.focus();
-    }, [o, u]);
-    const C = () => a || t === "capturing" ? "capturing" : t === "blur" || t === "glare" || t === "wrongSide" || t === "farAway" ? "error" : "idle", m = L(() => {
-      if (a || t === "capturing")
-        return {
-          title: l("idv2.capture.takingPhoto"),
-          subtitle: l("idv2.capture.dontMove")
-        };
-      if (t === "detecting" || t === "idNotDetected" || t === "manualCapture") {
-        const f = t === "manualCapture";
-        return r === "passport" ? {
-          title: l("idv2.capture.fillFramePassport"),
-          subtitle: f ? "" : l("idv2.capture.v2.autoCapture")
-        } : r === "back" ? {
-          title: l("idv2.capture.v2.fillFrameBack"),
-          subtitle: f ? "" : l("idv2.capture.v2.autoCapture")
-        } : {
-          title: l("idv2.capture.v2.fillFrameFront"),
-          subtitle: f ? "" : l("idv2.capture.v2.autoCapture")
-        };
-      }
-      return null;
-    }, [a, t, r, l]), w = C(), T = r === "passport", F = n !== "vertical" || T, p = F ? "horizontal" : "vertical";
-    return /* @__PURE__ */ e(
-      Q,
-      {
-        className: b(
-          "IncodeCaptureOverlayId",
-          !F && "IncodeCaptureOverlayVertical"
-        ),
-        children: [
-          /* @__PURE__ */ e("div", { class: "IncodeCaptureTopSection", children: [
-            /* @__PURE__ */ e(
-              ie,
-              {
-                detectionStatus: t,
-                mode: r,
-                isCapturing: a
-              }
-            ),
-            /* @__PURE__ */ e(
-              X,
-              {
-                title: m?.title ?? "",
-                subtitle: m?.subtitle,
-                visible: m !== null,
-                titleId: "id-capture-heading"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ e(
-            J,
-            {
-              ref: v,
-              variant: "locked",
-              orientation: p,
-              frameState: w,
-              className: b(T && "IncodeCaptureFramePassport"),
-              children: [
-                a && i > 0 && /* @__PURE__ */ e("div", { class: "IncodeCaptureCounter", children: i }),
-                t === "idNotDetected" && /* @__PURE__ */ e(fe, { mode: r, orientation: n ?? "horizontal" })
-              ]
-            }
-          ),
-          /* @__PURE__ */ e("div", { class: "IncodeSrOnly", "aria-live": "polite", "aria-atomic": "true", children: a && i > 0 ? i : "" }),
-          /* @__PURE__ */ e(
-            Y,
-            {
-              onOpenHelp: s,
-              onCapture: c,
-              isManualCapture: o,
-              helpButtonRef: d,
-              captureButtonRef: u,
-              captureAriaDescribedBy: o ? "manual-capture-tooltip" : void 0,
-              children: o ? /* @__PURE__ */ e("div", { class: "IncodeIdManualCaptureTooltipContainer", children: /* @__PURE__ */ e(
-                "div",
-                {
-                  id: "manual-capture-tooltip",
-                  role: "tooltip",
-                  class: "IncodeIdManualCaptureTooltip",
-                  children: /* @__PURE__ */ e("ol", { class: "IncodeIdManualCaptureTooltipList", children: [
-                    /* @__PURE__ */ e("li", { children: l("idv2.commonIssues.firstStep") }),
-                    /* @__PURE__ */ e("li", { children: l("idv2.commonIssues.secondStep") })
-                  ] })
-                }
-              ) }) : null
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-export {
-  Q as C,
-  U as H,
-  j as L,
-  q as T,
-  K as a,
-  J as b,
-  X as c,
-  Y as d,
-  G as e,
-  He as f
-};