@flonkid/kyc 1.9.2 → 1.9.3

package/dist/core.cjs

@@ -0,0 +1,1371 @@
+'use strict';
+
+// src/shared/constants.ts
+var SDK_VERSION = "1.9.3";
+var DEFAULT_WIDGET_URL = "https://widget.flonk.id";
+var DEFAULT_API_BASE = "https://api.flonk.id/v1";
+var API_VERSION = "2026-06-01";
+var PROTOCOL_VERSION = 1;
+var WIDGET_EVENTS = {
+  READY: "KYC_WIDGET_READY",
+  COMPLETE: "KYC_COMPLETE",
+  CANCEL: "KYC_CANCEL",
+  ERROR: "KYC_ERROR",
+  CONFIG: "KYC_WIDGET_CONFIG"
+};
+var WIDGET_PARAMS = {
+  PROTOCOL_VERSION: "pv",
+  SESSION_ID: "sessionId",
+  EMBED_TOKEN: "embedToken",
+  TOKEN: "token",
+  PUBLISHABLE_KEY: "publishableKey",
+  CLIENT_ID: "clientId",
+  CLIENT_METADATA: "clientMetadata",
+  DESIGN_TOKENS: "designTokens",
+  ALLOW_MANUAL_UPLOAD: "allowManualUpload",
+  LANG: "lang",
+  OVERLAY_COLOR: "overlayColor",
+  MODE: "mode"
+};
+
+// src/shared/errors.ts
+var FlonkError = class extends Error {
+  constructor(message, code, statusCode) {
+    super(message);
+    this.code = code;
+    this.statusCode = statusCode;
+    this.name = "FlonkError";
+  }
+};
+var FlonkValidationError = class extends FlonkError {
+  constructor(message) {
+    super(message, "validation_error", 400);
+    this.name = "FlonkValidationError";
+  }
+};
+
+// src/browser/utils.ts
+function getOrigin(url) {
+  try {
+    return new URL(url).origin;
+  } catch {
+    return "null";
+  }
+}
+function isDesktop() {
+  return window.innerWidth >= 1024 && !("ontouchstart" in window || navigator.maxTouchPoints > 0);
+}
+function setStyles(el, styles) {
+  Object.assign(el.style, styles);
+}
+function createEl(tag, styles, attrs) {
+  const el = document.createElement(tag);
+  if (styles) setStyles(el, styles);
+  if (attrs) {
+    for (const [k, v] of Object.entries(attrs)) el.setAttribute(k, v);
+  }
+  return el;
+}
+function debounce(fn, ms) {
+  let timer;
+  return ((...args) => {
+    clearTimeout(timer);
+    timer = setTimeout(() => fn(...args), ms);
+  });
+}
+function generateSecondaryColor(hex) {
+  try {
+    const h = hex.replace("#", "");
+    const r = parseInt(h.substring(0, 2), 16);
+    const g = parseInt(h.substring(2, 4), 16);
+    const b = parseInt(h.substring(4, 6), 16);
+    const f = 0.6;
+    const toHex = (n) => {
+      const s = n.toString(16);
+      return s.length === 1 ? "0" + s : s;
+    };
+    return "#" + toHex(Math.round(r + (255 - r) * f)) + toHex(Math.round(g + (255 - g) * f)) + toHex(Math.round(b + (255 - b) * f));
+  } catch {
+    return "#93c5fd";
+  }
+}
+var DEFAULT_FETCH_TIMEOUT_MS = 2e4;
+async function fetchWithTimeout(url, init = {}, timeoutMs = DEFAULT_FETCH_TIMEOUT_MS) {
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), timeoutMs);
+  try {
+    return await fetch(url, { ...init, signal: controller.signal });
+  } catch (err) {
+    if (err?.name === "AbortError") {
+      throw new Error(`Request timed out after ${timeoutMs}ms: ${url}`);
+    }
+    throw err;
+  } finally {
+    clearTimeout(timer);
+  }
+}
+var widgetTokenInflight = /* @__PURE__ */ new Map();
+async function fetchWidgetToken(pk, apiBase) {
+  const key = `${apiBase}|${pk}`;
+  const existing = widgetTokenInflight.get(key);
+  if (existing) return existing;
+  const promise = (async () => {
+    const res = await fetchWithTimeout(`${apiBase}/public/widget-token`, {
+      headers: { "x-kyc-pk": pk },
+      credentials: "include"
+    });
+    if (!res.ok) {
+      let message = `Widget token request failed (${res.status})`;
+      try {
+        const b = await res.json();
+        message = b.error || b.message || message;
+      } catch {
+      }
+      throw new Error(message);
+    }
+    return res.json();
+  })().finally(() => {
+    widgetTokenInflight.delete(key);
+  });
+  widgetTokenInflight.set(key, promise);
+  return promise;
+}
+var BRANDING_CACHE_TTL_MS = 5 * 60 * 1e3;
+var brandingCache = /* @__PURE__ */ new Map();
+function brandingCacheKey(opts) {
+  if (opts.pk) return `pk:${opts.pk}`;
+  if (opts.sessionId) return `sid:${opts.sessionId}`;
+  if (opts.clientId) return `cid:${opts.clientId}`;
+  return null;
+}
+async function requestDesignTokens(apiBase, opts) {
+  const params = [];
+  if (opts.sessionId) params.push(`sessionId=${encodeURIComponent(opts.sessionId)}`);
+  else if (opts.clientId) params.push(`clientId=${encodeURIComponent(opts.clientId)}`);
+  const url = `${apiBase}/public/design-tokens${params.length ? "?" + params.join("&") : ""}`;
+  const res = await fetchWithTimeout(
+    url,
+    { headers: opts.pk ? { "x-kyc-pk": opts.pk } : {}, credentials: "omit" },
+    8e3
+  );
+  return res.ok ? res.json() : null;
+}
+async function fetchDesignTokens(apiBase, opts) {
+  const key = brandingCacheKey(opts);
+  if (!key) return null;
+  const now = Date.now();
+  const cached = brandingCache.get(key);
+  if (cached && cached.expiresAt > now) {
+    return cached.promise;
+  }
+  const promise = requestDesignTokens(apiBase, opts).catch(() => null);
+  brandingCache.set(key, { promise, expiresAt: now + BRANDING_CACHE_TTL_MS });
+  promise.then((tokens) => {
+    if (tokens == null) brandingCache.delete(key);
+  });
+  return promise;
+}
+function preloadDesignTokens(apiBase, opts) {
+  return fetchDesignTokens(apiBase, opts);
+}
+function validateServerUrl(url) {
+  if (url.startsWith("/")) return;
+  try {
+    const parsed = new URL(url);
+    const isLocalhost = parsed.hostname === "localhost" || parsed.hostname === "127.0.0.1";
+    if (parsed.protocol !== "https:" && !isLocalhost) {
+      throw new Error(
+        `serverUrl must use HTTPS in production. Got: ${parsed.protocol}//. Use HTTPS ('https://api.myapp.com/...') or a relative path ('/api/...')`
+      );
+    }
+  } catch (e) {
+    if (e.message.includes("serverUrl must use HTTPS")) throw e;
+    throw new Error(`Invalid serverUrl: ${url}`);
+  }
+}
+var sessionCreateInflight = /* @__PURE__ */ new Map();
+async function fetchSessionFromServer(serverUrl, clientMetadata, requestHeaders) {
+  validateServerUrl(serverUrl);
+  const key = `${serverUrl}|${JSON.stringify(clientMetadata ?? null)}`;
+  const existing = sessionCreateInflight.get(key);
+  if (existing) return existing;
+  const promise = (async () => {
+    const res = await fetchWithTimeout(serverUrl, {
+      method: "POST",
+      headers: { "Content-Type": "application/json", ...requestHeaders },
+      credentials: "include",
+      body: JSON.stringify({ clientMetadata })
+    });
+    if (!res.ok) {
+      let message = `Session request failed (${res.status})`;
+      try {
+        const body = await res.json();
+        if (body.error) message = body.error;
+        else if (body.message) message = body.message;
+      } catch {
+      }
+      throw new Error(message);
+    }
+    return res.json();
+  })().finally(() => {
+    sessionCreateInflight.delete(key);
+  });
+  sessionCreateInflight.set(key, promise);
+  return promise;
+}
+async function exchangeSessionForToken(apiBase, sessionId) {
+  const res = await fetchWithTimeout(`${apiBase}/public/session/${sessionId}/token`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" }
+  });
+  if (!res.ok) {
+    let message = `Token exchange failed (${res.status})`;
+    try {
+      const b = await res.json();
+      message = b.error || b.message || message;
+    } catch {
+    }
+    throw new Error(message);
+  }
+  return res.json();
+}
+
+// src/browser/iframe-manager.ts
+function createIframe(src) {
+  const d = isDesktop();
+  const iframe = createEl(
+    "iframe",
+    {
+      border: "0",
+      width: window.innerWidth + "px",
+      height: window.innerHeight + "px",
+      position: "fixed",
+      top: "0",
+      left: "0",
+      zIndex: "9999",
+      // Hidden until reveal so the loader overlay doesn't show the iframe's own
+      // loading state through its translucent backdrop (double loader). Reveal
+      // is gated on READY-OR-a-timeout (see index.ts), so a missing READY can't
+      // leave it permanently hidden — that timeout is what removed the deadlock.
+      opacity: "0",
+      visibility: "hidden",
+      background: "transparent",
+      backgroundColor: "transparent",
+      borderRadius: d ? "0" : "",
+      boxShadow: d ? "none" : "",
+      colorScheme: "normal"
+    },
+    {
+      src,
+      allow: "camera;microphone;clipboard-read;clipboard-write",
+      sandbox: "allow-scripts allow-forms allow-same-origin allow-popups",
+      "aria-label": "KYC Verification",
+      allowtransparency: "true"
+    }
+  );
+  try {
+    iframe.style.setProperty("background", "transparent", "important");
+    iframe.style.setProperty("background-color", "transparent", "important");
+    iframe.style.setProperty("color-scheme", "normal", "important");
+  } catch {
+  }
+  return iframe;
+}
+function adjustZIndex(loader, iframe) {
+  if (!isDesktop()) return;
+  const all = Array.from(document.querySelectorAll("*"));
+  const maxZ = Math.max(
+    ...all.map((el) => parseInt(getComputedStyle(el).zIndex) || 0).filter((z) => z < 999999)
+  );
+  if (maxZ > 9998) {
+    loader.style.zIndex = String(maxZ + 1);
+    iframe.style.zIndex = String(maxZ + 2);
+  }
+}
+function transitionLoaderToIframe(loader, iframe, onDone) {
+  const d = isDesktop();
+  const dur = d ? 300 : 500;
+  const card = loader.querySelector("div");
+  if (card) {
+    setStyles(card, {
+      transition: "transform 300ms ease-out, opacity 300ms ease-out",
+      transform: d ? "translateY(-10px) scale(0.98)" : "translateY(-15px) scale(0.96)",
+      opacity: "0"
+    });
+  }
+  setStyles(loader, { transition: "opacity 300ms ease-out", opacity: "0" });
+  setTimeout(() => {
+    onDone();
+    setStyles(iframe, {
+      transition: d ? "opacity 300ms cubic-bezier(0.4,0,0.2,1),visibility 0ms" : "opacity 400ms ease-out,visibility 0ms",
+      opacity: "1",
+      visibility: "visible"
+    });
+  }, dur);
+}
+
+// src/browser/diagnostics.ts
+var handlers = /* @__PURE__ */ new Set();
+function addDiagnosticHandler(handler) {
+  handlers.add(handler);
+  return () => {
+    handlers.delete(handler);
+  };
+}
+function debugEnabled() {
+  try {
+    return Boolean(globalThis.__FLONK_DEBUG__);
+  } catch {
+    return false;
+  }
+}
+function emitDiagnostic(code, level, message, detail) {
+  const event = { code, level, message, detail };
+  if (debugEnabled()) {
+    try {
+      const fn = level === "error" ? console.error : level === "warn" ? console.warn : console.log;
+      fn(`[flonk:${code}] ${message}`, detail ?? "");
+    } catch {
+    }
+  }
+  for (const handler of handlers) {
+    try {
+      handler(event);
+    } catch {
+    }
+  }
+}
+
+// src/browser/prewarm.ts
+var noop = () => {
+};
+function originOf(url) {
+  try {
+    return new URL(url).origin;
+  } catch {
+    return url.replace(/\/+$/, "");
+  }
+}
+function addLinkHint(doc, rel, href, attrs) {
+  try {
+    const existing = doc.querySelector(`link[rel="${rel}"][href="${href}"]`);
+    if (existing) return;
+    const link = doc.createElement("link");
+    link.rel = rel;
+    link.href = href;
+    if (attrs) for (const k of Object.keys(attrs)) link.setAttribute(k, attrs[k]);
+    (doc.head || doc.documentElement).appendChild(link);
+  } catch {
+  }
+}
+function preconnect(widgetUrl, doc = document) {
+  const origin = originOf(widgetUrl);
+  addLinkHint(doc, "preconnect", origin, { crossorigin: "" });
+  addLinkHint(doc, "dns-prefetch", origin);
+}
+function defaultScheduleIdle(fn) {
+  if (typeof window === "undefined") {
+    fn();
+    return;
+  }
+  const w = window;
+  const run = () => {
+    if (typeof w.requestIdleCallback === "function") {
+      w.requestIdleCallback(fn, { timeout: 2e3 });
+    } else {
+      setTimeout(fn, 200);
+    }
+  };
+  if (document.readyState === "complete") run();
+  else window.addEventListener("load", run, { once: true });
+}
+function prewarm(options) {
+  const level = options.level ?? "connect";
+  const doc = options.doc ?? (typeof document !== "undefined" ? document : void 0);
+  if (level === "none" || !doc) {
+    emitDiagnostic("PREWARM_SKIPPED", "info", `Prewarm skipped (level=${level}${doc ? "" : ", no document"}).`);
+    return noop;
+  }
+  const scheduleIdle = options.scheduleIdle ?? defaultScheduleIdle;
+  const origin = originOf(options.widgetUrl);
+  preconnect(options.widgetUrl, doc);
+  const warmAssets = () => {
+    if (options.apiBase) {
+      const q = options.publishableKey ? `pk=${encodeURIComponent(options.publishableKey)}` : options.sessionId ? `sessionId=${encodeURIComponent(options.sessionId)}` : "";
+      addLinkHint(doc, "prefetch", `${options.apiBase}/v1/public/design-tokens${q ? `?${q}` : ""}`);
+    }
+    addLinkHint(doc, "prefetch", `${origin}/`, { as: "document" });
+  };
+  if (level === "intent") {
+    return attachIntent(doc, options.trigger ?? null, () => {
+      warmAssets();
+      mountHiddenIframe(doc, origin);
+    });
+  }
+  scheduleIdle(() => {
+    warmAssets();
+    if (level === "eager") mountHiddenIframe(doc, origin);
+  });
+  return noop;
+}
+function attachIntent(doc, trigger, warm) {
+  let fired = false;
+  const fire = () => {
+    if (fired) return;
+    fired = true;
+    cleanup();
+    warm();
+  };
+  const events = [
+    ["mouseenter", fire],
+    ["focusin", fire],
+    ["touchstart", fire]
+  ];
+  let io = null;
+  const cleanup = () => {
+    if (trigger) for (const [type, fn] of events) trigger.removeEventListener(type, fn);
+    if (io) {
+      io.disconnect();
+      io = null;
+    }
+  };
+  if (trigger) {
+    for (const [type, fn] of events) trigger.addEventListener(type, fn, { passive: true });
+    const w = doc.defaultView || (typeof window !== "undefined" ? window : void 0);
+    if (w && typeof w.IntersectionObserver === "function") {
+      const observer = new w.IntersectionObserver((entries) => {
+        if (entries.some((e) => e.isIntersecting)) fire();
+      });
+      observer.observe(trigger);
+      io = observer;
+    }
+  } else {
+    defaultScheduleIdle(fire);
+  }
+  return cleanup;
+}
+function mountHiddenIframe(doc, origin) {
+  try {
+    if (doc.querySelector("iframe[data-flonk-prewarm]")) return;
+    const iframe = doc.createElement("iframe");
+    iframe.src = `${origin}/?prewarm=1`;
+    iframe.setAttribute("data-flonk-prewarm", "1");
+    iframe.setAttribute("aria-hidden", "true");
+    iframe.tabIndex = -1;
+    iframe.style.cssText = "position:absolute;width:1px;height:1px;left:-9999px;top:-9999px;border:0;opacity:0;pointer-events:none";
+    (doc.body || doc.documentElement).appendChild(iframe);
+  } catch {
+  }
+}
+
+// src/browser/loader.ts
+var LOADER_I18N = {
+  en: { title: "Initializing...", subtitle: "Loading KYC widget", errorTitle: "Something went wrong", close: "Close" },
+  de: { title: "Initialisierung...", subtitle: "KYC-Widget wird geladen", errorTitle: "Ein Fehler ist aufgetreten", close: "Schlie\xDFen" },
+  uk: { title: "\u0406\u043D\u0456\u0446\u0456\u0430\u043B\u0456\u0437\u0430\u0446\u0456\u044F...", subtitle: "\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F KYC-\u0432\u0456\u0434\u0436\u0435\u0442\u0430", errorTitle: "\u0429\u043E\u0441\u044C \u043F\u0456\u0448\u043B\u043E \u043D\u0435 \u0442\u0430\u043A", close: "\u0417\u0430\u043A\u0440\u0438\u0442\u0438" }
+};
+var KEYFRAMES = `
+@keyframes kycspin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
+@keyframes kycdash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}100%{stroke-dasharray:90,150;stroke-dashoffset:-124}}
+@keyframes kycprogress{0%{transform:translateX(-100%)}50%{transform:translateX(0%)}100%{transform:translateX(250%)}}
+`.trim();
+var styleInjected = false;
+var Loader = class {
+  constructor() {
+    this.overlay = null;
+    this.cleanup = null;
+    this.origBodyStyles = null;
+  }
+  show(primaryColor, lang) {
+    const color = primaryColor || "#15BA68";
+    const strings = LOADER_I18N[lang || ""] || LOADER_I18N.en;
+    const d = isDesktop();
+    if (!styleInjected) {
+      const style = document.createElement("style");
+      style.textContent = KEYFRAMES;
+      document.head.appendChild(style);
+      styleInjected = true;
+    }
+    const overlay = createEl("div", {
+      position: "fixed",
+      top: "0",
+      left: "0",
+      right: "0",
+      bottom: "0",
+      width: window.innerWidth + "px",
+      height: window.innerHeight + "px",
+      background: d ? "rgba(0,0,0,0.05)" : "transparent",
+      backdropFilter: d ? "blur(2px)" : "none",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      zIndex: "9998",
+      transition: "opacity 600ms ease-out,transform 400ms ease-out",
+      opacity: "1",
+      overflow: "hidden",
+      margin: "0",
+      padding: "0"
+    });
+    const card = createEl("div", {
+      width: d ? "min(400px, 35vw)" : "min(360px, 85vw)",
+      backgroundColor: "#FFF",
+      borderRadius: d ? "32px" : "24px",
+      boxShadow: d ? "0 20px 64px rgba(17,17,17,0.12),0 4px 16px rgba(17,17,17,0.08)" : "0 8px 32px rgba(17,17,17,0.08)",
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      padding: d ? "48px 36px" : "36px 24px",
+      gap: d ? "24px" : "20px",
+      transition: "transform 400ms ease-out,opacity 400ms ease-out"
+    });
+    const wrap = createEl("div", {
+      width: "48px",
+      height: "48px",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center"
+    });
+    const NS = "http://www.w3.org/2000/svg";
+    const svg = document.createElementNS(NS, "svg");
+    svg.setAttribute("width", "48");
+    svg.setAttribute("height", "48");
+    svg.setAttribute("viewBox", "0 0 48 48");
+    svg.style.animation = "kycspin 1.2s cubic-bezier(0.4,0,0.6,1) infinite";
+    const bg = document.createElementNS(NS, "circle");
+    for (const [k, v] of Object.entries({
+      cx: "24",
+      cy: "24",
+      r: "20",
+      "stroke-width": "3",
+      fill: "none",
+      stroke: color + "33"
+    })) bg.setAttribute(k, v);
+    const fg = document.createElementNS(NS, "circle");
+    for (const [k, v] of Object.entries({
+      cx: "24",
+      cy: "24",
+      r: "20",
+      "stroke-width": "3",
+      fill: "none",
+      stroke: color,
+      "stroke-linecap": "round",
+      "stroke-dasharray": "62.8",
+      "stroke-dashoffset": "15.7"
+    })) fg.setAttribute(k, v);
+    setStyles(fg, { transformOrigin: "center", animation: "kycdash 1.5s ease-in-out infinite" });
+    svg.append(bg, fg);
+    wrap.appendChild(svg);
+    const font = 'Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif';
+    const textBox = createEl("div", { textAlign: "center" });
+    const title = createEl("h3", { fontFamily: font, fontWeight: "600", fontSize: "18px", lineHeight: "1.3", color: "#1F2937", margin: "0 0 4px 0" });
+    title.textContent = strings.title;
+    const subtitle = createEl("p", { fontFamily: font, fontWeight: "400", fontSize: "13px", lineHeight: "1.4", color: "rgba(31,41,55,0.7)", margin: "0" });
+    subtitle.textContent = strings.subtitle;
+    textBox.append(title, subtitle);
+    const track = createEl("div", { width: "100%", maxWidth: "240px", height: "3px", backgroundColor: color + "1A", borderRadius: "2px", overflow: "hidden" });
+    const bar = createEl("div", { width: "40%", height: "100%", backgroundColor: color, borderRadius: "2px", transform: "translateX(-100%)", animation: "kycprogress 2000ms ease-in-out infinite" });
+    track.appendChild(bar);
+    card.append(wrap, textBox, track);
+    overlay.appendChild(card);
+    this.origBodyStyles = { overflow: document.body.style.overflow, position: document.body.style.position };
+    setStyles(document.body, { overflow: "hidden", position: "fixed", width: "100%", height: "100%" });
+    document.body.appendChild(overlay);
+    let prevW = window.innerWidth;
+    let prevH = window.innerHeight;
+    const onResize = debounce(() => {
+      const w = window.innerWidth;
+      const h = window.innerHeight;
+      if (Math.abs(w - prevW) > 1 || Math.abs(h - prevH) > 1) {
+        setStyles(overlay, { width: w + "px", height: h + "px" });
+        prevW = w;
+        prevH = h;
+      }
+    }, d ? 50 : 150);
+    window.addEventListener("resize", onResize);
+    this.overlay = overlay;
+    this.cleanup = () => {
+      window.removeEventListener("resize", onResize);
+      if (this.origBodyStyles) {
+        setStyles(document.body, { ...this.origBodyStyles, width: "", height: "" });
+      }
+    };
+    return overlay;
+  }
+  get element() {
+    return this.overlay;
+  }
+  updateColor(primaryColor) {
+    if (!this.overlay) return;
+    const color = primaryColor || "#15BA68";
+    const bgCircle = this.overlay.querySelector("circle:first-child");
+    const fgCircle = this.overlay.querySelector("circle:last-child");
+    const bar = this.overlay.querySelector('[style*="kycprogress"]');
+    if (bgCircle) bgCircle.setAttribute("stroke", color + "33");
+    if (fgCircle) fgCircle.setAttribute("stroke", color);
+    if (bar) bar.style.backgroundColor = color;
+    const track = bar?.parentElement;
+    if (track) track.style.backgroundColor = color + "1A";
+  }
+  showError(message, lang) {
+    if (!this.overlay) return;
+    const strings = LOADER_I18N[lang || ""] || LOADER_I18N.en;
+    const card = this.overlay.querySelector("div");
+    if (!card) return;
+    card.innerHTML = "";
+    const font = 'Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif';
+    const iconWrap = createEl("div", {
+      width: "48px",
+      height: "48px",
+      borderRadius: "50%",
+      backgroundColor: "rgba(239, 68, 68, 0.1)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center"
+    });
+    const NS = "http://www.w3.org/2000/svg";
+    const svg = document.createElementNS(NS, "svg");
+    svg.setAttribute("width", "24");
+    svg.setAttribute("height", "24");
+    svg.setAttribute("viewBox", "0 0 24 24");
+    svg.setAttribute("fill", "none");
+    svg.setAttribute("stroke", "#ef4444");
+    svg.setAttribute("stroke-width", "2");
+    svg.setAttribute("stroke-linecap", "round");
+    const line1 = document.createElementNS(NS, "line");
+    line1.setAttribute("x1", "18");
+    line1.setAttribute("y1", "6");
+    line1.setAttribute("x2", "6");
+    line1.setAttribute("y2", "18");
+    const line2 = document.createElementNS(NS, "line");
+    line2.setAttribute("x1", "6");
+    line2.setAttribute("y1", "6");
+    line2.setAttribute("x2", "18");
+    line2.setAttribute("y2", "18");
+    svg.append(line1, line2);
+    iconWrap.appendChild(svg);
+    const title = createEl("h3", {
+      fontFamily: font,
+      fontWeight: "600",
+      fontSize: "18px",
+      lineHeight: "1.3",
+      color: "#1F2937",
+      margin: "0",
+      textAlign: "center"
+    });
+    title.textContent = strings.errorTitle;
+    const msg = createEl("p", {
+      fontFamily: font,
+      fontWeight: "400",
+      fontSize: "13px",
+      lineHeight: "1.5",
+      color: "rgba(31,41,55,0.7)",
+      margin: "0",
+      textAlign: "center",
+      wordBreak: "break-word",
+      maxWidth: "300px"
+    });
+    msg.textContent = message;
+    const btn = createEl("button", {
+      fontFamily: font,
+      fontWeight: "600",
+      fontSize: "14px",
+      padding: "10px 32px",
+      borderRadius: "12px",
+      border: "none",
+      backgroundColor: "#1F2937",
+      color: "#fff",
+      cursor: "pointer",
+      transition: "opacity 150ms"
+    });
+    btn.textContent = strings.close;
+    btn.onmouseenter = () => {
+      btn.style.opacity = "0.85";
+    };
+    btn.onmouseleave = () => {
+      btn.style.opacity = "1";
+    };
+    btn.onclick = () => this.destroy();
+    card.append(iconWrap, title, msg, btn);
+  }
+  fadeOut() {
+    if (!this.overlay) return;
+    const d = isDesktop();
+    const card = this.overlay.querySelector("div");
+    if (card) {
+      setStyles(card, {
+        transform: d ? "translateY(-10px) scale(0.98)" : "translateY(-15px) scale(0.96)",
+        opacity: "0"
+      });
+    }
+    this.overlay.style.opacity = "0";
+  }
+  destroy() {
+    this.cleanup?.();
+    if (this.overlay?.parentNode) this.overlay.remove();
+    this.overlay = null;
+    this.cleanup = null;
+  }
+};
+function isServerLoaderReady() {
+  return typeof window !== "undefined" && !!window.FlonkWidgetLoader?.show;
+}
+var serverScriptRequested = false;
+function loadServerLoaderScript(apiBase, pk, sessionId) {
+  if (typeof document === "undefined" || serverScriptRequested || isServerLoaderReady()) return;
+  serverScriptRequested = true;
+  try {
+    const q = pk ? `?publishableKey=${encodeURIComponent(pk)}` : sessionId ? `?sessionId=${encodeURIComponent(sessionId)}` : "";
+    const s = document.createElement("script");
+    s.src = `${apiBase}/public/loader.js${q}`;
+    s.async = true;
+    s.onerror = () => {
+      serverScriptRequested = false;
+      emitDiagnostic(
+        "LOADER_SCRIPT_BLOCKED",
+        "warn",
+        `Failed to load the server loader (${s.src}). Likely a CSP script-src or CORP block \u2014 allow the API origin in script-src. Falling back to the bundled loader.`,
+        { src: s.src }
+      );
+    };
+    (document.head || document.documentElement).appendChild(s);
+  } catch {
+  }
+}
+var ServerLoader = class {
+  constructor() {
+    this.overlay = null;
+  }
+  show(primaryColor, lang) {
+    this.overlay = window.FlonkWidgetLoader.show({ primaryColor, lang });
+    return this.overlay;
+  }
+  get element() {
+    return this.overlay;
+  }
+  updateColor(primaryColor) {
+    this.overlay?.updateColor?.(primaryColor);
+  }
+  showError(message, lang) {
+    this.overlay?.showError?.(message, lang);
+  }
+  fadeOut() {
+    this.overlay?.fadeOut?.();
+  }
+  destroy() {
+    try {
+      this.overlay?.remove();
+    } catch {
+    }
+    this.overlay = null;
+  }
+};
+function makeLoader() {
+  if (isServerLoaderReady()) return new ServerLoader();
+  emitDiagnostic(
+    "LOADER_FALLBACK_BUNDLED",
+    "info",
+    "Server loader not ready at show time \u2014 using the bundled loader."
+  );
+  return new Loader();
+}
+
+// src/browser/message-handler.ts
+function checkProtocol(data) {
+  const remote = data.protocolVersion;
+  if (typeof remote === "number" && remote !== PROTOCOL_VERSION) {
+    emitDiagnostic(
+      "PROTOCOL_VERSION_MISMATCH",
+      "warn",
+      `SDK speaks protocol ${PROTOCOL_VERSION}, iframe speaks ${remote}. Additive-compatible, but check for a stale-cached widget if behavior is off.`,
+      { sdk: PROTOCOL_VERSION, iframe: remote }
+    );
+  }
+}
+var MessageHandler = class {
+  constructor(iframeSrc, iframe, callbacks) {
+    this.iframeSrc = iframeSrc;
+    this.iframe = iframe;
+    this.callbacks = callbacks;
+    this.listener = null;
+    this.readyListener = null;
+    this.completionHandled = false;
+  }
+  /**
+   * Start listening for postMessage events from the widget iframe.
+   */
+  listen() {
+    const origin = getOrigin(this.iframeSrc);
+    this.listener = (e) => {
+      if (e.origin !== origin) return;
+      if (e.source !== this.iframe.contentWindow) return;
+      const data = e.data || {};
+      const type = data.type;
+      if (type === WIDGET_EVENTS.COMPLETE) {
+        if (this.completionHandled) return;
+        this.completionHandled = true;
+        this.callbacks.onSuccess?.(data.result);
+      } else if (type === WIDGET_EVENTS.CANCEL) {
+        if (this.completionHandled) return;
+        this.completionHandled = true;
+        this.callbacks.onCancel?.();
+      } else if (type === WIDGET_EVENTS.ERROR) {
+        if (this.completionHandled) return;
+        this.completionHandled = true;
+        this.callbacks.onError?.(data.error || "Unknown error");
+      } else if (type === WIDGET_EVENTS.READY) {
+        checkProtocol(data);
+        this.callbacks.onReady?.();
+      }
+    };
+    window.addEventListener("message", this.listener);
+  }
+  /**
+   * Listen for the first READY event, then call the callback once.
+   */
+  onReadyOnce(callback) {
+    const origin = getOrigin(this.iframeSrc);
+    this.readyListener = (e) => {
+      if (e.origin !== origin || e.source !== this.iframe.contentWindow || e.data?.type !== WIDGET_EVENTS.READY) {
+        return;
+      }
+      window.removeEventListener("message", this.readyListener);
+      this.readyListener = null;
+      callback();
+    };
+    window.addEventListener("message", this.readyListener);
+  }
+  destroy() {
+    if (this.listener) {
+      window.removeEventListener("message", this.listener);
+      this.listener = null;
+    }
+    if (this.readyListener) {
+      window.removeEventListener("message", this.readyListener);
+      this.readyListener = null;
+    }
+  }
+};
+
+// src/browser/viewport.ts
+function getVV() {
+  if (window.visualViewport) {
+    return {
+      width: window.visualViewport.width,
+      height: window.visualViewport.height,
+      offsetTop: window.visualViewport.offsetTop || 0,
+      offsetLeft: window.visualViewport.offsetLeft || 0
+    };
+  }
+  return { width: window.innerWidth, height: window.innerHeight, offsetTop: 0, offsetLeft: 0 };
+}
+function ensureViewportMeta() {
+  try {
+    const meta = document.querySelector('meta[name="viewport"]');
+    if (!meta) {
+      const m = document.createElement("meta");
+      m.setAttribute("name", "viewport");
+      m.setAttribute("content", "width=device-width, initial-scale=1.0, viewport-fit=cover");
+      document.head.appendChild(m);
+    } else {
+      const c = meta.getAttribute("content") || "";
+      if (!c.includes("viewport-fit=cover")) {
+        meta.setAttribute("content", c + ", viewport-fit=cover");
+      }
+    }
+  } catch {
+  }
+}
+function setupViewportSizing(overlay, iframe) {
+  ensureViewportMeta();
+  let baselineHeight = 0;
+  let desktop = isDesktop();
+  let rafId = null;
+  const initBaseline = () => {
+    const vv = getVV();
+    baselineHeight = window.innerHeight || vv.height || document.documentElement.clientHeight || 0;
+    desktop = isDesktop();
+    if (rafId) cancelAnimationFrame(rafId);
+    rafId = requestAnimationFrame(applySize);
+  };
+  const applySize = () => {
+    try {
+      const vv = getVV();
+      const inner = window.innerHeight || vv.height;
+      const kbThreshold = desktop ? 200 : 150;
+      const isKeyboard = inner - vv.height > kbThreshold;
+      const height = isKeyboard ? vv.height : baselineHeight || inner;
+      const dims = desktop ? { top: "0", left: "0", width: window.innerWidth + "px", height: window.innerHeight + "px" } : { top: vv.offsetTop + "px", left: vv.offsetLeft + "px", width: vv.width + "px", height: height + "px" };
+      if (overlay) setStyles(overlay, dims);
+      if (iframe) setStyles(iframe, dims);
+    } catch {
+    }
+  };
+  let prevW = window.innerWidth;
+  let prevH = window.innerHeight;
+  let prevX = 0;
+  let prevY = 0;
+  const debouncedApply = debounce(() => {
+    if (rafId) cancelAnimationFrame(rafId);
+    rafId = requestAnimationFrame(applySize);
+  }, desktop ? 50 : 150);
+  const handleResize = () => {
+    const vv = getVV();
+    const w = vv.width;
+    const h = vv.height;
+    const x = vv.offsetLeft;
+    const y = vv.offsetTop;
+    const changed = Math.abs(w - prevW) > 1 || Math.abs(h - prevH) > 1 || Math.abs(x - prevX) > 1 || Math.abs(y - prevY) > 1;
+    if (!changed) return;
+    if (Math.abs(h - prevH) > 1) initBaseline();
+    prevW = w;
+    prevH = h;
+    prevX = x;
+    prevY = y;
+    if (desktop) {
+      if (rafId) cancelAnimationFrame(rafId);
+      rafId = requestAnimationFrame(applySize);
+    } else {
+      debouncedApply();
+    }
+  };
+  const handleOrientation = () => {
+    initBaseline();
+    if (rafId) cancelAnimationFrame(rafId);
+    rafId = requestAnimationFrame(applySize);
+  };
+  initBaseline();
+  applySize();
+  window.addEventListener("resize", handleResize);
+  window.addEventListener("orientationchange", handleOrientation);
+  if (window.visualViewport) {
+    window.visualViewport.addEventListener("resize", handleResize);
+    window.visualViewport.addEventListener("scroll", handleResize);
+  }
+  return () => {
+    try {
+      if (rafId) cancelAnimationFrame(rafId);
+      window.removeEventListener("resize", handleResize);
+      window.removeEventListener("orientationchange", handleOrientation);
+      if (window.visualViewport) {
+        window.visualViewport.removeEventListener("resize", handleResize);
+        window.visualViewport.removeEventListener("scroll", handleResize);
+      }
+    } catch {
+    }
+  };
+}
+
+// src/browser/index.ts
+var FALLBACK_PRIMARY = "#15BA68";
+var EARLY_COLOR_BUDGET_MS = 800;
+var primaryFrom = (tokens) => tokens?.colors?.primary?.cannabis || FALLBACK_PRIMARY;
+async function showLoaderWithEarlyColor(tokensPromise, lang) {
+  const earlyTokens = await Promise.race([
+    tokensPromise,
+    new Promise((resolve) => setTimeout(() => resolve(null), EARLY_COLOR_BUDGET_MS))
+  ]);
+  const primaryColor = primaryFrom(earlyTokens);
+  const loader = makeLoader();
+  loader.show(primaryColor, lang);
+  return { loader, primaryColor };
+}
+var FlonkKYC = class {
+  constructor(options = {}) {
+    this.disposeDiagnostics = null;
+    this.widgetUrl = (options.widgetUrl || DEFAULT_WIDGET_URL).replace(/\/$/, "");
+    this.apiBase = (options.apiBase || DEFAULT_API_BASE).replace(/\/$/, "");
+    if (options.onDiagnostic) this.disposeDiagnostics = addDiagnosticHandler(options.onDiagnostic);
+    if (typeof document !== "undefined") {
+      try {
+        preconnect(this.widgetUrl);
+      } catch {
+      }
+      try {
+        loadServerLoaderScript(this.apiBase);
+      } catch {
+      }
+    }
+  }
+  /** Unregister this instance's `onDiagnostic` handler. */
+  dispose() {
+    this.disposeDiagnostics?.();
+    this.disposeDiagnostics = null;
+  }
+  /**
+   * Prewarm the widget ahead of the user's click — preconnect + idle prefetch
+   * of branding/assets, and (with `level:'eager'`) a hidden background iframe so
+   * the full bundle is loaded before the click. Call on page mount / route
+   * enter. Returns a cleanup (removes `intent` listeners). Never pre-creates a
+   * session. SSR-safe.
+   *
+   * @example
+   * FlonkKYC.prewarm({ publishableKey: 'pk_live_…', level: 'eager' });
+   * // or, warm only when the user shows intent:
+   * FlonkKYC.prewarm({ publishableKey: 'pk_live_…', level: 'intent', trigger: btn });
+   */
+  static prewarm(opts = {}) {
+    if (typeof document === "undefined") return () => {
+    };
+    return prewarm({
+      widgetUrl: (opts.widgetUrl || DEFAULT_WIDGET_URL).replace(/\/$/, ""),
+      apiBase: (opts.apiBase || DEFAULT_API_BASE).replace(/\/$/, ""),
+      publishableKey: opts.publishableKey,
+      sessionId: opts.sessionId,
+      level: opts.level,
+      trigger: opts.trigger ?? null
+    });
+  }
+  /**
+   * Warm the project's branding (colors) ahead of time so the widget paints the
+   * brand color on the first frame, with no branding round-trip at click time.
+   *
+   * Call it early — on page mount, route enter, or hover of the "verify" button
+   * — well before `init()`. The result is cached (module-level, 5-min TTL) and
+   * every subsequent `init()`/`open()` for the same key reads from it. Safe to
+   * call repeatedly; concurrent calls dedupe. Never throws.
+   *
+   * @example
+   * // in a layout effect, long before the user clicks "Verify"
+   * FlonkKYC.preloadBranding({ publishableKey: 'pk_live_...' });
+   */
+  static preloadBranding(opts) {
+    const apiBase = (opts.apiBase || DEFAULT_API_BASE).replace(/\/$/, "");
+    return preloadDesignTokens(apiBase, {
+      pk: opts.publishableKey,
+      sessionId: opts.sessionId
+    }).then(() => void 0);
+  }
+  // ── Public API ───────────────────────────────────────
+  /**
+   * Open the KYC verification widget.
+   *
+   * Flows (pick one; add `publishableKey` to any for an instant branded loader):
+   *  1. `{ serverUrl }` — SDK auto-creates the session via your backend (recommended).
+   *  2. `{ sessionId, embedToken }` — you created the session; pass its credentials.
+   *  3. `{ sessionId }` — **deprecated**: exchanges the sessionId for an embedToken
+   *     via an extra round-trip. Prefer flow 2 by returning `embedToken` from your
+   *     backend alongside `sessionId`.
+   *  4. `{ publishableKey }` — client-only; SDK mints a short-lived widget token.
+   */
+  async init(config) {
+    if (!config) throw new FlonkValidationError("config is required");
+    if (config.serverUrl) {
+      return this.initWithServerUrl(config);
+    }
+    if (config.sessionId && config.embedToken) {
+      return this.initWithEmbedToken(config);
+    }
+    if (config.sessionId) {
+      return this.initWithSession(config);
+    }
+    const pk = config.publishableKey;
+    if (!pk || !/^pk_/.test(pk)) {
+      throw new FlonkValidationError(
+        "Provide one of: serverUrl, sessionId + embedToken, or publishableKey (pk_*)"
+      );
+    }
+    return this.initWithPublishableKey(config);
+  }
+  /**
+   * Preview mode — no API calls, mock data.
+   */
+  preview(config = {}) {
+    const colors = config.colors || { primaryColor: "#3b82f6", secondaryColor: "#93c5fd" };
+    return this.openWidget({
+      mode: "preview",
+      isPreview: "true",
+      previewColors: JSON.stringify(colors),
+      allowManualUpload: "true",
+      documentType: config.documentType || "id_card",
+      lang: config.lang || "de",
+      overlayColor: config.overlayColor
+    }, {
+      primaryColor: colors.primaryColor || "#3b82f6",
+      lang: config.lang,
+      onSuccess: config.onSuccess,
+      onError: config.onError,
+      onCancel: config.onCancel
+    });
+  }
+  /**
+   * Embed inline preview in a container (for dashboards).
+   */
+  embed(config) {
+    if (!config?.container) throw new FlonkValidationError("container is required");
+    const container = typeof config.container === "string" ? document.querySelector(config.container) : config.container;
+    if (!container) throw new FlonkValidationError("Container element not found");
+    let colors = config.colors || { primaryColor: "#3b82f6", secondaryColor: "#93c5fd" };
+    let device = config.device || "mobile";
+    let scale = config.scale ?? 1;
+    const lang = config.lang || "de";
+    const buildSrc = (c, d) => {
+      const p = new URLSearchParams({
+        mode: "preview",
+        isPreview: "true",
+        previewColors: JSON.stringify(c),
+        allowManualUpload: "true",
+        documentType: config.documentType || "id_card",
+        device: d,
+        lang
+      });
+      return `${this.widgetUrl}/?${p.toString()}`;
+    };
+    const applyScale = () => {
+      iframe.style.transform = scale !== 1 ? `scale(${scale})` : "";
+      iframe.style.transformOrigin = scale !== 1 ? "top left" : "";
+    };
+    const iframe = document.createElement("iframe");
+    iframe.style.cssText = "border:none;width:100%;height:100%;display:block";
+    iframe.src = buildSrc(colors, device);
+    iframe.title = "KYC Widget Preview";
+    iframe.setAttribute("sandbox", "allow-scripts allow-same-origin allow-forms");
+    applyScale();
+    container.innerHTML = "";
+    container.appendChild(iframe);
+    return {
+      iframe,
+      setColors(newColors) {
+        colors = { ...colors, ...newColors };
+        if (newColors.primaryColor && !newColors.secondaryColor) {
+          colors.secondaryColor = generateSecondaryColor(newColors.primaryColor);
+        }
+        iframe.src = buildSrc(colors, device);
+      },
+      setDevice(d) {
+        device = d;
+        iframe.src = buildSrc(colors, device);
+      },
+      getColors: () => ({ ...colors }),
+      destroy: () => iframe.remove()
+    };
+  }
+  // ── Private flows ────────────────────────────────────
+  /**
+   * Flow 1: serverUrl — POST to client's backend, get sessionId + embedToken.
+   *
+   * When `publishableKey` is provided, design tokens are fetched in parallel
+   * with the session creation request. This shows the branded loader ~200-500ms
+   * faster because we don't have to wait for the session to be created first.
+   */
+  async initWithServerUrl(config) {
+    const pk = config.publishableKey;
+    const designTokensPromise = pk ? fetchDesignTokens(this.apiBase, { pk }) : Promise.resolve(null);
+    const sessionPromise = fetchSessionFromServer(
+      config.serverUrl,
+      config.clientMetadata,
+      config.requestHeaders
+    );
+    const { loader, primaryColor } = await showLoaderWithEarlyColor(designTokensPromise, config.lang);
+    try {
+      const [{ sessionId, embedToken, qrCodeUrl }, designTokens] = await Promise.all([
+        sessionPromise,
+        designTokensPromise
+      ]);
+      const finalTokens = designTokens ?? await fetchDesignTokens(this.apiBase, { sessionId });
+      const finalColor = primaryFrom(finalTokens);
+      if (finalColor !== primaryColor) loader.updateColor(finalColor);
+      return this.buildWidget(embedToken, sessionId, config, loader, finalTokens, qrCodeUrl);
+    } catch (err) {
+      const msg = err.message || "Failed to create session";
+      loader.showError(msg, config.lang);
+      config.onError?.(msg);
+      throw err;
+    }
+  }
+  /**
+   * Flow 2: sessionId + embedToken — fetch session data, open widget.
+   */
+  async initWithEmbedToken(config) {
+    const pk = config.publishableKey;
+    const designTokensPromise = pk ? fetchDesignTokens(this.apiBase, { pk }) : fetchDesignTokens(this.apiBase, { sessionId: config.sessionId });
+    const { loader, primaryColor } = await showLoaderWithEarlyColor(designTokensPromise, config.lang);
+    try {
+      const designTokens = await designTokensPromise;
+      const finalColor = primaryFrom(designTokens);
+      if (finalColor !== primaryColor) loader.updateColor(finalColor);
+      return this.buildWidget(config.embedToken, config.sessionId, config, loader, designTokens);
+    } catch (err) {
+      const msg = err.message || "Failed to initialize verification";
+      loader.showError(msg, config.lang);
+      config.onError?.(msg);
+      throw err;
+    }
+  }
+  /**
+   * Flow 3: sessionId only — exchange for embedToken, then init.
+   *
+   * @deprecated Prefer flow 2 (`sessionId` + `embedToken`). Return the
+   * `embedToken` from your backend together with the `sessionId` to skip this
+   * extra token-exchange round-trip.
+   */
+  async initWithSession(config) {
+    const designTokensPromise = fetchDesignTokens(this.apiBase, {
+      sessionId: config.sessionId
+    });
+    const exchangePromise = exchangeSessionForToken(this.apiBase, config.sessionId);
+    const { loader } = await showLoaderWithEarlyColor(designTokensPromise, config.lang);
+    try {
+      const [{ embedToken, session }, designTokens] = await Promise.all([
+        exchangePromise,
+        designTokensPromise
+      ]);
+      return this.buildWidget(embedToken, config.sessionId || session.id, config, loader, designTokens);
+    } catch (err) {
+      const msg = err.message || "Failed to initialize verification";
+      loader.showError(msg, config.lang);
+      config.onError?.(msg);
+      throw err;
+    }
+  }
+  /**
+   * Flow 4: publishableKey — fetch widget token, open widget.
+   */
+  async initWithPublishableKey(config) {
+    const pk = config.publishableKey;
+    const designTokensPromise = fetchDesignTokens(this.apiBase, { pk });
+    const widgetTokenPromise = fetchWidgetToken(pk, this.apiBase);
+    const { loader, primaryColor } = await showLoaderWithEarlyColor(designTokensPromise, config.lang);
+    try {
+      const data = await widgetTokenPromise;
+      const params = {
+        mode: "embedded",
+        publishableKey: pk,
+        allowManualUpload: String(data.allowManualUpload !== false)
+      };
+      if (data.token) params.token = data.token;
+      if (config.clientMetadata) {
+        params.clientMetadata = JSON.stringify(config.clientMetadata);
+      }
+      if (config.lang) params.lang = config.lang;
+      if (config.overlayColor) params.overlayColor = config.overlayColor;
+      return this.openWidget(params, {
+        primaryColor,
+        lang: config.lang,
+        loader,
+        onSuccess: config.onSuccess,
+        onError: config.onError,
+        onCancel: config.onCancel,
+        onReady: config.onReady,
+        mount: config.mount
+      });
+    } catch (err) {
+      const msg = err.message || "Failed to initialize verification";
+      loader.showError(msg, config.lang);
+      config.onError?.(msg);
+      throw err;
+    }
+  }
+  // ── Core widget builder ──────────────────────────────
+  buildWidget(token, sessionId, config, loader, designTokens, qrCodeUrl) {
+    const params = {
+      mode: "embedded",
+      sessionId,
+      token
+    };
+    const qr = qrCodeUrl ?? config.qrCodeUrl;
+    if (qr) params.qrCodeUrl = encodeURIComponent(qr);
+    if (config.allowManualUpload !== void 0) {
+      params.allowManualUpload = String(config.allowManualUpload !== false);
+    }
+    if (designTokens?.colors) {
+      params.designTokens = JSON.stringify(designTokens);
+    }
+    if (config.embedToken) params.embedToken = config.embedToken;
+    if (config.clientMetadata) {
+      params.clientMetadata = JSON.stringify(config.clientMetadata);
+    }
+    if (config.lang) params.lang = config.lang;
+    if (config.overlayColor) params.overlayColor = config.overlayColor;
+    return this.openWidget(params, {
+      primaryColor: primaryFrom(designTokens),
+      lang: config.lang,
+      loader,
+      onSuccess: config.onSuccess,
+      onError: config.onError,
+      onCancel: config.onCancel,
+      onReady: config.onReady,
+      mount: config.mount
+    });
+  }
+  /**
+   * Core: create iframe, attach listeners, return WidgetInstance.
+   */
+  openWidget(params, opts) {
+    const filtered = Object.fromEntries(
+      Object.entries(params).filter(([, v]) => v != null)
+    );
+    filtered[WIDGET_PARAMS.PROTOCOL_VERSION] = String(PROTOCOL_VERSION);
+    const search = new URLSearchParams(filtered);
+    const src = `${this.widgetUrl}/?${search.toString()}`;
+    const iframe = createIframe(src);
+    emitDiagnostic("IFRAME_FRESH", "info", "Built a fresh widget iframe");
+    const mountTarget = opts.mount || document.body;
+    const loader = opts.loader ?? (() => {
+      const l = makeLoader();
+      l.show(opts.primaryColor, opts.lang);
+      return l;
+    })();
+    if (loader.element) adjustZIndex(loader.element, iframe);
+    mountTarget.appendChild(iframe);
+    const cleanupViewport = setupViewportSizing(loader.element, iframe);
+    let cleaned = false;
+    const cleanupAll = () => {
+      if (cleaned) return;
+      cleaned = true;
+      try {
+        handler.destroy();
+        cleanupViewport();
+        loader.destroy();
+        if (iframe.parentNode) iframe.remove();
+      } catch {
+      }
+    };
+    const afterCleanup = (delayMs) => setTimeout(cleanupAll, delayMs);
+    const handler = new MessageHandler(src, iframe, {
+      onSuccess: (r) => {
+        opts.onSuccess?.(r);
+        afterCleanup(1e3);
+      },
+      onError: (e) => {
+        opts.onError?.(e);
+        afterCleanup(500);
+      },
+      onCancel: () => {
+        opts.onCancel?.();
+        afterCleanup(500);
+      },
+      onReady: opts.onReady
+    });
+    handler.listen();
+    let revealed = false;
+    const revealOnce = () => {
+      if (revealed) return;
+      revealed = true;
+      clearTimeout(revealTimer);
+      if (loader.element) transitionLoaderToIframe(loader.element, iframe, () => loader.destroy());
+    };
+    const revealTimer = setTimeout(() => {
+      emitDiagnostic("READY_TIMEOUT_REVEAL", "warn", "Widget did not signal READY in time; revealing anyway");
+      revealOnce();
+    }, 4e3);
+    handler.onReadyOnce(revealOnce);
+    return {
+      iframe,
+      destroy: cleanupAll
+    };
+  }
+};
+FlonkKYC.version = SDK_VERSION;
+
+exports.API_VERSION = API_VERSION;
+exports.FlonkError = FlonkError;
+exports.FlonkKYC = FlonkKYC;
+exports.FlonkValidationError = FlonkValidationError;
+exports.PROTOCOL_VERSION = PROTOCOL_VERSION;
+exports.SDK_VERSION = SDK_VERSION;
+exports.WIDGET_EVENTS = WIDGET_EVENTS;
+exports.WIDGET_PARAMS = WIDGET_PARAMS;
+exports.addDiagnosticHandler = addDiagnosticHandler;
+//# sourceMappingURL=core.cjs.map
+//# sourceMappingURL=core.cjs.map