@incodetech/web 2.0.0-alpha.5 → 2.0.0-alpha.7

package/dist/flow/flow.es.js

@@ -1,9 +1,539 @@
-import "../button-DeMZ_34N.js";
-import "@incodetech/core/flow";
-import "../vendor-preact-CK0WeTOR.js";
-import "../title-ng7q7YDh.js";
-import { I as i, p as a } from "../flow-ZK6OBsa3.js";
+import { c as D, u as i, L as W, S as E, B as j, r as H, a as B } from "../incodeModule-Dv8Qllrv.js";
+import { createOrchestratedFlowManager as O, getRequiredWasmPipelines as R } from "@incodetech/core/flow";
+import { k as F, A as I, d as x, y as M } from "../vendor-preact-CK0WeTOR.js";
+import "../instance-B-q0ZREN.js";
+import { T as K, u as $ } from "../title-BfO5Dlzk.js";
+import { api as z, warmupWasm as q } from "@incodetech/core";
+import { emailMachine as _ } from "@incodetech/core/email";
+import { phoneMachine as V } from "@incodetech/core/phone";
+import { selfieMachine as Y } from "@incodetech/core/selfie";
+import { s as Z } from "../setup-wNL83jmW.js";
+import { s as y } from "../uiConfig-CQ1W9cUD.js";
+const G = {
+  small: 24,
+  medium: 48,
+  large: 64
+}, b = ({
+  title: e,
+  subtitle: t,
+  size: n = "medium",
+  fullScreen: s = !0,
+  className: r
+}) => {
+  const a = G[n], o = D(
+    "IncodeSpinner",
+    s && "IncodeSpinnerFullScreen",
+    r
+  );
+  return /* @__PURE__ */ i(
+    "div",
+    {
+      class: o,
+      "data-testid": "spinner",
+      "data-title": e,
+      "data-subtitle": t,
+      "data-size": n,
+      children: /* @__PURE__ */ i("div", { class: "IncodeSpinnerContent", children: [
+        /* @__PURE__ */ i(W, { size: a }),
+        (e || t) && /* @__PURE__ */ i(F, { children: [
+          /* @__PURE__ */ i(E, { size: 16 }),
+          /* @__PURE__ */ i("div", { class: "IncodeSpinnerText", children: [
+            e && /* @__PURE__ */ i(K, { className: "IncodeSpinnerTitle", children: e }),
+            t && /* @__PURE__ */ i(F, { children: [
+              e && /* @__PURE__ */ i(E, { size: 12 }),
+              /* @__PURE__ */ i("p", { class: "IncodeSpinnerSubtitle", children: t })
+            ] })
+          ] })
+        ] })
+      ] })
+    }
+  );
+};
+function J(e) {
+  let t = e.replace("#", "");
+  t.length === 3 && (t = t.split("").map((u) => u + u).join(""));
+  const n = /^([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);
+  if (!n) return null;
+  const s = Number.parseInt(n[1], 16) / 255, r = Number.parseInt(n[2], 16) / 255, a = Number.parseInt(n[3], 16) / 255, o = Math.max(s, r, a), l = Math.min(s, r, a);
+  let c = 0, p = 0;
+  const d = (o + l) / 2;
+  if (o !== l) {
+    const u = o - l;
+    switch (p = d > 0.5 ? u / (2 - o - l) : u / (o + l), o) {
+      case s:
+        c = ((r - a) / u + (r < a ? 6 : 0)) / 6;
+        break;
+      case r:
+        c = ((a - s) / u + 2) / 6;
+        break;
+      case a:
+        c = ((s - r) / u + 4) / 6;
+        break;
+    }
+  }
+  return { h: c * 360, s: p * 100, l: d * 100 };
+}
+function w(e, t, n) {
+  const s = e / 360, r = t / 100, a = n / 100;
+  let o, l, c;
+  if (r === 0)
+    o = l = c = a;
+  else {
+    const d = (h, C, m) => (m < 0 && (m += 1), m > 1 && (m -= 1), m < 0.16666666666666666 ? h + (C - h) * 6 * m : m < 0.5 ? C : m < 0.6666666666666666 ? h + (C - h) * (0.6666666666666666 - m) * 6 : h), u = a < 0.5 ? a * (1 + r) : a + r - a * r, f = 2 * a - u;
+    o = d(f, u, s + 1 / 3), l = d(f, u, s), c = d(f, u, s - 1 / 3);
+  }
+  const p = (d) => {
+    const u = Math.round(d * 255).toString(16);
+    return u.length === 1 ? `0${u}` : u;
+  };
+  return `#${p(o)}${p(l)}${p(c)}`;
+}
+function Q(e) {
+  const t = J(e);
+  if (!t)
+    throw new Error(`Invalid color format: ${e}`);
+  return {
+    50: w(t.h, t.s, 95),
+    200: w(t.h, t.s, 80),
+    300: w(t.h, t.s, 65),
+    400: w(t.h, t.s, Math.min(100, t.l + 10)),
+    500: e,
+    600: w(t.h, t.s, Math.max(0, t.l - 10)),
+    900: w(t.h, t.s, 20)
+  };
+}
+function X(e, t) {
+  if (typeof document > "u")
+    return;
+  const n = Q(e);
+  let s = document.getElementById(
+    "incode-theme"
+  );
+  s || (s = document.createElement("style"), s.id = "incode-theme", document.head.appendChild(s));
+  const r = t || "#ffffff", a = `
+    :root,
+    :host {
+      --primitive-color-brand-50: ${n[50]};
+      --primitive-color-brand-200: ${n[200]};
+      --primitive-color-brand-300: ${n[300]};
+      --primitive-color-brand-400: ${n[400]};
+      --primitive-color-brand-500: ${n[500]};
+      --primitive-color-brand-600: ${n[600]};
+      --primitive-color-brand-900: ${n[900]};
+      --button-primary-text-default: ${r};
+    }
+  `;
+  s.textContent = a;
+}
+async function ee() {
+  return (await z.get("/omni/asset/fetch-all")).data;
+}
+const L = /* @__PURE__ */ new Map();
+async function te(e) {
+  if (e.startsWith("data:"))
+    return e;
+  const t = L.get(e);
+  if (t)
+    return t;
+  const s = await (await fetch(e)).blob(), r = await new Promise((a, o) => {
+    const l = new FileReader();
+    l.onloadend = () => a(l.result), l.onerror = o, l.readAsDataURL(s);
+  });
+  return L.set(e, r), r;
+}
+async function re() {
+  const e = await ee();
+  if (!e.theme)
+    throw new Error("Theme URL not found in assets response");
+  const t = e.theme, n = t.startsWith("http://") || t.startsWith("https://");
+  let s;
+  if (n) {
+    const o = await fetch(t);
+    if (!o.ok)
+      throw new Error(`Failed to fetch theme: ${o.statusText}`);
+    s = await o.json();
+  } else
+    s = (await z.get(t)).data;
+  const r = e["logo.png"] || e["logo.svg"] || e["logo.jpg"] || e["logo.jpeg"] || e["logo.webp"] || s.logo;
+  let a = r;
+  return r && (a = await te(r)), {
+    ...s,
+    logo: a
+  };
+}
+async function ne() {
+  const e = await re();
+  return e.main && X(e.main, e.buttonColor), e;
+}
+const S = {
+  PHONE: () => import("../phone/phone.es.js").then((e) => e.Phone),
+  EMAIL: () => import("../email/email.es.js").then((e) => e.Email),
+  SELFIE: () => import("../selfie/selfie.es.js").then((e) => e.Selfie)
+};
+function T() {
+  return O({
+    modules: {
+      PHONE: V,
+      EMAIL: _,
+      SELFIE: Y
+    }
+  });
+}
+async function N(e) {
+  await Z({
+    apiURL: e.apiURL,
+    token: e.token,
+    i18n: { lang: e.lang ?? "en" }
+  });
+}
+async function k() {
+  try {
+    const e = await ne(), t = {
+      logoSrc: e.logo,
+      hideFooterBranding: e.hideFooterBranding
+    };
+    return y(t), { theme: e, uiConfig: t };
+  } catch (e) {
+    return console.warn("Failed to fetch dashboard theme:", e), {};
+  }
+}
+function A(e, t) {
+  const n = R(e.flow);
+  n.length > 0 && q({
+    ...t,
+    pipelines: n
+  }).catch((s) => {
+    console.error("WASM warmup failed:", s);
+  });
+}
+function oe(e) {
+  const t = e.currentStep;
+  if (t) {
+    const n = S[t];
+    n && n().catch(() => {
+    });
+  }
+}
+const se = ({
+  moduleKey: e,
+  onNext: t
+}) => {
+  const { t: n } = $();
+  return /* @__PURE__ */ i("section", { class: "IncodeUnsupportedModule", "aria-live": "polite", children: /* @__PURE__ */ i("div", { class: "IncodeUnsupportedModuleContent", children: [
+    /* @__PURE__ */ i("h2", { class: "IncodeUnsupportedModuleTitle", children: n("unsupportedModule.title", "Module not available") }),
+    /* @__PURE__ */ i("p", { class: "IncodeUnsupportedModuleMessage", children: n(
+      "unsupportedModule.message",
+      `The "${e}" module is not yet supported in this version.`
+    ) }),
+    /* @__PURE__ */ i(
+      j,
+      {
+        onClick: t,
+        class: "IncodeUnsupportedModuleButton",
+        "data-testid": "unsupported-module-next-button",
+        children: n("unsupportedModule.next", "Next")
+      }
+    )
+  ] }) });
+}, g = /* @__PURE__ */ new Map();
+function U(e) {
+  const t = g.get(e);
+  if (!t)
+    throw new Error("Preload state not found");
+  return {
+    get isReady() {
+      return t.status === "ready";
+    },
+    get error() {
+      return t.status === "error" ? t.error ?? null : null;
+    },
+    async waitUntilReady() {
+      if (t.status !== "ready") {
+        if (t.status === "error")
+          throw new Error(t.error ?? "Preload failed");
+        return t.readyPromise;
+      }
+    },
+    cancel() {
+      t.status === "loading" && (t.unsubscribe && t.unsubscribe(), t.flowManager.stop(), t.readyReject(new Error("Preload cancelled")), g.delete(e));
+    }
+  };
+}
+function Ie(e) {
+  const { token: t } = e;
+  if (g.has(t))
+    return U(t);
+  let n, s;
+  const r = new Promise((c, p) => {
+    n = c, s = p;
+  }), a = T(), o = {
+    status: "loading",
+    flowManager: a,
+    config: e,
+    readyPromise: r,
+    readyResolve: n,
+    readyReject: s
+  };
+  return g.set(t, o), (async () => {
+    try {
+      await N({
+        apiURL: e.apiURL,
+        token: e.token,
+        lang: e.lang
+      });
+      const c = e.disableDashboardTheme ? Promise.resolve({}) : k().then((d) => {
+        o.theme = d.theme, o.uiConfig = d.uiConfig;
+      }), p = a.subscribe((d) => {
+        if (d.status === "ready") {
+          const u = d;
+          e.wasmConfig && A(u, e.wasmConfig), oe(u), o.unsubscribe?.(), o.unsubscribe = void 0, o.status = "ready", o.readyResolve();
+        } else d.status === "error" && (o.unsubscribe?.(), o.unsubscribe = void 0, o.status = "error", o.error = d.error, o.readyReject(new Error(d.error)));
+      });
+      o.unsubscribe = p, a.load(), await c;
+    } catch (c) {
+      o.status = "error", o.error = c instanceof Error ? c.message : "Failed to preload", o.readyReject(
+        c instanceof Error ? c : new Error("Failed to preload")
+      ), g.delete(t);
+    }
+  })(), U(t);
+}
+function v(e) {
+  return g.get(e) ?? null;
+}
+function P(e) {
+  const t = v(e);
+  return t && g.delete(e), t;
+}
+function ie(e) {
+  const { apiURL: t, token: n, lang: s, disableDashboardTheme: r, onError: a } = e, o = I(null), [l, c] = x(() => {
+    const d = v(n);
+    if (d?.status === "ready") {
+      const f = P(n);
+      if (f)
+        return o.current = f.flowManager, f.uiConfig && y(f.uiConfig), { status: "ready", flowManager: f.flowManager };
+    }
+    const u = T();
+    return o.current = u, d?.status === "error" ? {
+      status: "error",
+      error: d.error ?? "Preload failed",
+      flowManager: u
+    } : { status: "initializing", flowManager: u };
+  }), p = I(!1);
+  return M(() => {
+    if (l.status !== "initializing")
+      return;
+    const d = v(n);
+    if (d?.status === "loading") {
+      d.readyPromise.then(() => {
+        const f = P(n);
+        f && (o.current = f.flowManager, f.uiConfig && y(f.uiConfig), c({ status: "ready", flowManager: f.flowManager }));
+      }).catch((f) => {
+        const h = f instanceof Error ? f.message : "Preload failed";
+        c({
+          status: "error",
+          error: h,
+          flowManager: l.flowManager
+        }), a?.(h);
+      });
+      return;
+    }
+    if (p.current)
+      return;
+    p.current = !0, (async () => {
+      try {
+        await N({ apiURL: t, token: n, lang: s });
+        const f = r ? Promise.resolve() : k().then((h) => {
+          h.uiConfig && y(h.uiConfig);
+        });
+        l.flowManager.load(), await f, c({ status: "ready", flowManager: l.flowManager });
+      } catch (f) {
+        const h = f instanceof Error ? f.message : "Failed to initialize SDK";
+        c({
+          status: "error",
+          error: h,
+          flowManager: l.flowManager
+        }), a?.(h);
+      }
+    })();
+  }, [t, n, s, r, a, l]), l;
+}
+function ae(e) {
+  const { moduleKey: t, onModuleLoading: n, onModuleLoaded: s, onError: r } = e, [a, o] = x({ status: "idle" });
+  return M(() => {
+    if (!t) {
+      o({ status: "idle" });
+      return;
+    }
+    const l = S[t];
+    if (!l) {
+      o({ status: "unsupported", moduleKey: t });
+      return;
+    }
+    o({ status: "loading", moduleKey: t }), n?.(t);
+    let c = !1;
+    return l().then((p) => {
+      c || (o({ status: "loaded", moduleKey: t, Component: p }), s?.(t));
+    }).catch((p) => {
+      if (!c) {
+        const d = p instanceof Error ? p.message : "Failed to load module";
+        o({ status: "error", moduleKey: t, error: d }), r?.(`Failed to load ${t}: ${d}`);
+      }
+    }), () => {
+      c = !0;
+    };
+  }, [t, n, s, r]), a;
+}
+function le(e, t) {
+  const n = I(/* @__PURE__ */ new Set());
+  M(() => {
+    if (t < e.length - 1) {
+      const s = e[t + 1];
+      if (s && !n.current.has(s)) {
+        n.current.add(s);
+        const r = S[s];
+        r && r().catch(() => {
+          n.current.delete(s);
+        });
+      }
+    }
+  }, [e, t]);
+}
+const de = ({ config: e, onError: t }) => {
+  const { t: n } = $(), s = ie({
+    apiURL: e.apiURL,
+    token: e.token,
+    lang: e.lang,
+    disableDashboardTheme: e.disableDashboardTheme,
+    onError: t
+  }), [r, a] = B(() => s.flowManager, {
+    autoLoad: !1
+  }), o = ae({
+    moduleKey: r?.status === "ready" ? r.currentStep : void 0,
+    onModuleLoading: e.onModuleLoading,
+    onModuleLoaded: e.onModuleLoaded,
+    onError: t
+  });
+  if (le(
+    r?.status === "ready" ? r.steps : [],
+    r?.status === "ready" ? r.currentStepIndex : -1
+  ), M(() => {
+    if (r?.status === "ready" && e.wasmConfig) {
+      const l = r, c = R(l.flow);
+      c.length > 0 && (e.onWasmWarmup?.(c), A(l, e.wasmConfig));
+    }
+  }, [r, e]), M(() => {
+    r?.status === "finished" && e.onComplete(r.finishStatus);
+  }, [r?.status, e, r]), M(() => {
+    r?.status === "error" && t && t(r.error);
+  }, [r?.status, t, r]), s.status === "error")
+    return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i("div", { children: [
+      "Error: ",
+      s.error
+    ] }) });
+  if (s.status === "initializing")
+    return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+      b,
+      {
+        title: e.spinnerConfig?.title ?? n("home.settingUp"),
+        subtitle: e.spinnerConfig?.subtitle,
+        size: e.spinnerConfig?.size,
+        fullScreen: !0
+      }
+    ) });
+  if (!r || r.status === "idle" || r.status === "loading")
+    return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+      b,
+      {
+        title: e.spinnerConfig?.title ?? n("home.settingUp"),
+        subtitle: e.spinnerConfig?.subtitle,
+        size: e.spinnerConfig?.size,
+        fullScreen: !0
+      }
+    ) });
+  if (r.status === "error")
+    return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i("div", { children: [
+      "Error: ",
+      r.error
+    ] }) });
+  if (r.status === "finished")
+    return null;
+  if (r.status === "ready") {
+    const { currentStep: l, config: c } = r;
+    if (!l || !c)
+      return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+        b,
+        {
+          title: e.spinnerConfig?.title ?? n("loadingCircle.hangOn"),
+          subtitle: e.spinnerConfig?.subtitle ?? n("loadingCircle.validating"),
+          size: e.spinnerConfig?.size,
+          fullScreen: !0
+        }
+      ) });
+    if (o.status === "unsupported")
+      return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+        se,
+        {
+          moduleKey: l,
+          onNext: () => a.completeModule()
+        }
+      ) });
+    if (o.status === "idle" || o.status === "loading" || o.status === "error")
+      return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+        b,
+        {
+          title: e.spinnerConfig?.title ?? n("loadingCircle.hangOn"),
+          subtitle: e.spinnerConfig?.subtitle ?? n("loadingCircle.validating"),
+          size: e.spinnerConfig?.size,
+          fullScreen: !0
+        }
+      ) });
+    const { Component: p } = o;
+    if (l === "SELFIE")
+      return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+        p,
+        {
+          config: c,
+          onFinish: () => a.completeModule(),
+          onError: (u) => {
+            t?.(u ?? "Selfie verification error");
+          }
+        },
+        `selfie-${r.currentStepIndex}`
+      ) });
+    if (l === "PHONE")
+      return /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+        p,
+        {
+          config: c,
+          onFinish: () => a.completeModule(),
+          onError: (u) => {
+            t?.(u ?? "Phone verification error");
+          }
+        },
+        `phone-${r.currentStepIndex}`
+      ) });
+    if (l === "EMAIL") {
+      const d = c;
+      return !d || typeof d.otpVerification != "boolean" || typeof d.otpExpirationInMinutes != "number" ? /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i("div", { children: "Error: Invalid email configuration" }) }) : /* @__PURE__ */ i("div", { class: "IncodeFlow", children: /* @__PURE__ */ i(
+        p,
+        {
+          config: {
+            ...d,
+            prefill: d.prefill ?? !1
+          },
+          onFinish: () => a.completeModule(),
+          onError: (u) => {
+            t?.(u ?? "Email verification error");
+          }
+        },
+        `email-${r.currentStepIndex}`
+      ) });
+    }
+  }
+  return null;
+}, ce = ({ config: e, onError: t }) => /* @__PURE__ */ i("div", { class: "IncodeComponent", children: e ? /* @__PURE__ */ i(de, { config: e, onError: t }) : null });
+H(ce, "incode-flow");
 export {
-  i as IncodeFlow,
-  a as preloadIncodeFlow
+  ce as IncodeFlow,
+  Ie as preloadIncodeFlow
 };