@zerohash-sdk/travel-rule-react 0.3.6 → 0.5.0

package/dist/index.js

@@ -1,5 +1,5 @@
-import { jsxs as W, jsx as y } from "react/jsx-runtime";
-import D, { useEffect as I, useState as z, useCallback as j, useRef as M } from "react";
+import { jsxs as A, jsx as p } from "react/jsx-runtime";
+import M, { useEffect as I, useState as L, useCallback as j, useRef as D } from "react";
 const $ = {
   dev: "https://grafana-faro-collector.dev.0hash.com/collect",
   cert: "https://grafana-faro-collector.cert.zerohash.com/collect",
@@ -30,30 +30,30 @@ const $ = {
   if (t.length < 2)
     return {};
   try {
-    const o = t[1].replace(/-/g, "+").replace(/_/g, "/"), r = o + "===".slice(0, (4 - o.length % 4) % 4), n = typeof atob < "u" ? atob(r) : Buffer.from(r, "base64").toString("utf-8"), s = JSON.parse(n), c = s?.payload ?? {}, a = (l) => typeof l == "string" && l.length > 0 ? l : void 0;
+    const o = t[1].replace(/-/g, "+").replace(/_/g, "/"), r = o + "===".slice(0, (4 - o.length % 4) % 4), n = typeof atob < "u" ? atob(r) : Buffer.from(r, "base64").toString("utf-8"), i = JSON.parse(n), c = i?.payload ?? {}, a = (s) => typeof s == "string" && s.length > 0 ? s : void 0;
     return {
       participantCode: a(c.participant_code),
       platformName: a(c.platform_name),
-      platformCode: a(s.platform_code),
+      platformCode: a(i.platform_code),
       region: a(c.region)
     };
   } catch {
     return {};
   }
-}, L = (e, t, o) => {
+}, z = (e, t, o) => {
   const r = U(t, o);
   return e[r] ?? e[t] ?? e.prod;
-}, J = (e, t, o) => {
+}, H = (e, t, o) => {
   const r = U(t, o);
   return e[r] ?? e[t];
-}, T = () => {
-}, H = () => {
+}, O = () => {
+}, J = () => {
   const e = new Uint8Array(8);
   return globalThis.crypto.getRandomValues(e), Array.from(e, (t) => t.toString(16).padStart(2, "0")).join("");
 }, G = (e, t) => {
-  const o = H(), r = globalThis.__ZH_WEB_SDK_VERSION__, n = {};
+  const o = J(), r = globalThis.__ZH_WEB_SDK_VERSION__, n = {};
   e.claims.participantCode && (n.participant_code = e.claims.participantCode), e.claims.platformName && (n.platform_name = e.claims.platformName), e.claims.platformCode && (n.platform_code = e.claims.platformCode), e.claims.region && (n.region = e.claims.region), r && (n.zh_web_sdk_version = r);
-  const s = {
+  const i = {
     meta: {
       app: { name: e.appName, version: t ?? "unknown", environment: e.env },
       session: { id: o, attributes: n },
@@ -75,7 +75,7 @@ const $ = {
       }
     ]
   };
-  return { sessionId: o, payload: s };
+  return { sessionId: o, payload: i };
 }, K = (e, t, o) => {
   if (!e || typeof fetch > "u")
     return;
@@ -91,49 +91,49 @@ const $ = {
   } catch {
   }
 }, Z = (e) => {
-  const { webComponentTag: t, appName: o, appVersion: r, scriptUrls: n, fallbackScriptUrls: s, collectorUrls: c, env: a, jwt: l, timeoutMs: m = 15e3, onLoad: _, onError: g } = e;
+  const { webComponentTag: t, appName: o, appVersion: r, scriptUrls: n, fallbackScriptUrls: i, collectorUrls: c, env: a, jwt: s, timeoutMs: g = 15e3, onLoad: _, onError: h } = e;
   if (typeof document > "u")
-    return T;
+    return O;
   const d = `${t}-script-${a}`;
   if (customElements.get(t) || document.getElementById(d))
-    return T;
-  const b = P(l), R = e.report ?? ((p) => K(c && J(c, a, l), p, r));
-  let f = !1, x = 0, C;
-  const v = () => {
-    C !== void 0 && clearTimeout(C);
-  }, k = (p, h, i) => {
-    if (f)
+    return O;
+  const R = P(s), v = e.report ?? ((u) => K(c && H(c, a, s), u, r));
+  let m = !1, T = 0, k;
+  const S = () => {
+    k !== void 0 && clearTimeout(k);
+  }, x = (u, y, l) => {
+    if (m)
       return;
-    const A = Math.round(performance.now() - x), w = {
+    const W = Math.round(performance.now() - T), E = {
       webComponentTag: t,
       appName: o,
       env: a,
-      scriptUrl: h,
-      reason: p,
-      triedFallback: i,
-      elapsedMs: A,
-      claims: b
+      scriptUrl: y,
+      reason: u,
+      triedFallback: l,
+      elapsedMs: W,
+      claims: R
     };
-    R(w);
-    const O = i ? void 0 : L(s ?? {}, a, l);
-    if (O && O !== h) {
-      N(O, !0);
+    v(E);
+    const C = l ? void 0 : z(i ?? {}, a, s);
+    if (C && C !== y) {
+      w(C, !0);
       return;
     }
-    f = !0, v(), document.getElementById(d)?.remove(), g?.(w);
-  }, N = (p, h) => {
-    v(), x = performance.now();
-    const i = document.createElement("script");
-    i.id = d, i.src = p, i.type = "module", i.async = !0, i.onload = () => {
+    m = !0, S(), document.getElementById(d)?.remove(), h?.(E);
+  }, w = (u, y) => {
+    S(), T = performance.now();
+    const l = document.createElement("script");
+    l.id = d, l.src = u, l.type = "module", l.async = !0, l.onload = () => {
       setTimeout(() => {
-        f || (customElements.get(t) ? (f = !0, v(), _?.()) : k("not-defined", p, h));
+        m || (customElements.get(t) ? (m = !0, S(), _?.()) : x("not-defined", u, y));
       }, 0);
-    }, i.onerror = () => k("network", p, h), C = setTimeout(() => k("timeout", p, h), m), document.getElementById(d)?.remove(), document.head.appendChild(i);
-  }, E = L(n, a, l);
-  return E ? (N(E, !1), () => {
-    f = !0, v();
-  }) : T;
-}, u = {
+    }, l.onerror = () => x("network", u, y), k = setTimeout(() => x("timeout", u, y), g), document.getElementById(d)?.remove(), document.head.appendChild(l);
+  }, N = z(n, a, s);
+  return N ? (w(N, !1), () => {
+    m = !0, S();
+  }) : O;
+}, f = {
   local: "http://localhost:5173",
   dev: "https://sdk-cdn.dev.0hash.com",
   cert: "https://sdk-cdn.cert.zerohash.com",
@@ -141,25 +141,26 @@ const $ = {
   "eu-cert": "https://sdk-cdn.cert.zerohash.eu",
   "eu-prod": "https://sdk-cdn.zerohash.eu"
 }, q = "https://sdk-cdn.gating.0hash.com", Q = (e, t, o = {}) => {
-  const { eu: r = !1, legacyAliases: n = !1, local: s = u.local } = o, c = (l) => `${l}/${e}/${t}`, a = {
-    local: c(s),
-    dev: c(u.dev),
+  const { eu: r = !1, legacyAliases: n = !1, local: i = f.local } = o, c = (s) => `${s}/${e}/${t}`, a = {
+    local: c(i),
+    dev: c(f.dev),
     gating: c(q),
-    cert: c(u.cert),
-    prod: c(u.prod)
+    cert: c(f.cert),
+    prod: c(f.prod)
   };
-  return n && (a.sandbox = c(u.cert), a.production = c(u.prod)), r && (a["eu-cert"] = c(u["eu-cert"]), a["eu-prod"] = c(u["eu-prod"])), a;
+  return n && (a.sandbox = c(f.cert), a.production = c(f.prod)), r && (a["eu-cert"] = c(f["eu-cert"]), a["eu-prod"] = c(f["eu-prod"])), a;
 };
 var F;
 (function(e) {
   e.NETWORK_ERROR = "network_error", e.AUTH_ERROR = "auth_error", e.NOT_FOUND_ERROR = "not_found_error", e.VALIDATION_ERROR = "validation_error", e.SERVER_ERROR = "server_error", e.CLIENT_ERROR = "client_error", e.UNKNOWN_ERROR = "unknown_error";
 })(F || (F = {}));
-const S = {
+const b = {
   evergreen: "#00381D",
   green: "#CCFFD0",
   offBlack: "#1C1B1C",
   grayLight: "#EBEBE9"
-}, X = ({ onRetry: e }) => W("div", { role: "alert", style: {
+}, X = ({ onRetry: e, onClose: t }) => A("div", { role: "alert", style: {
+  position: "relative",
   display: "flex",
   flexDirection: "column",
   alignItems: "center",
@@ -169,18 +170,29 @@ const S = {
   padding: "32px 24px",
   textAlign: "center",
   fontFamily: "inherit",
-  color: S.offBlack,
+  color: b.offBlack,
   background: "#FFFFFF",
-  border: `1px solid ${S.grayLight}`,
+  border: `1px solid ${b.grayLight}`,
   borderRadius: "12px"
-}, children: [y("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: y("path", { d: "M12 9v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z", stroke: S.evergreen, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), y("p", { style: { margin: 0, fontSize: "16px", fontWeight: 600 }, children: "Something went wrong" }), y("p", { style: { margin: 0, fontSize: "14px", opacity: 0.75 }, children: "We couldn't load this content. Please check your internet connection and try again." }), y("button", { type: "button", onClick: e, style: {
+}, children: [t && p("button", { type: "button", onClick: t, "aria-label": "Close", style: {
+  position: "absolute",
+  top: "12px",
+  right: "12px",
+  display: "flex",
+  padding: "4px",
+  color: b.offBlack,
+  background: "none",
+  border: "none",
+  cursor: "pointer",
+  lineHeight: 0
+}, children: p("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: p("path", { d: "M18 6L6 18M6 6l12 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) }), p("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: p("path", { d: "M12 9v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z", stroke: b.evergreen, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), p("p", { style: { margin: 0, fontSize: "16px", fontWeight: 600 }, children: "Something went wrong" }), p("p", { style: { margin: 0, fontSize: "14px", opacity: 0.75 }, children: "We couldn't load this content. Please check your internet connection and try again." }), p("button", { type: "button", onClick: e, style: {
   marginTop: "8px",
   padding: "8px 20px",
   fontSize: "14px",
   fontWeight: 600,
   fontFamily: "inherit",
-  color: S.green,
-  background: S.evergreen,
+  color: b.green,
+  background: b.evergreen,
   border: "none",
   borderRadius: "8px",
   cursor: "pointer"
@@ -192,69 +204,75 @@ const S = {
         n !== void 0 && (o[r] = n);
   });
 }, ee = (e) => {
-  const { webComponentTag: t, appName: o, appVersion: r, scriptUrls: n, fallbackScriptUrls: s, collectorUrls: c, env: a, jwt: l, timeoutMs: m } = e, [_, g] = z(!1), [d, b] = z(0);
-  I(() => (g(!1), Z({
+  const { webComponentTag: t, appName: o, appVersion: r, scriptUrls: n, fallbackScriptUrls: i, collectorUrls: c, env: a, jwt: s, timeoutMs: g } = e, [_, h] = L(!1), [d, R] = L(0);
+  I(() => (h(!1), Z({
     webComponentTag: t,
     appName: o ?? t,
     appVersion: r,
     scriptUrls: n,
-    fallbackScriptUrls: s,
+    fallbackScriptUrls: i,
     collectorUrls: c ?? $,
     env: a,
-    jwt: l,
-    timeoutMs: m,
-    onError: () => g(!0)
+    jwt: s,
+    timeoutMs: g,
+    onError: () => h(!0)
   })), [
     t,
     o,
     r,
     n,
-    s,
+    i,
     c,
     a,
-    l,
-    m,
+    s,
+    g,
     d
   ]);
-  const R = j(() => b((f) => f + 1), []);
-  return { loadFailed: _, retry: R };
+  const v = j(() => R((m) => m + 1), []);
+  return { loadFailed: _, retry: v };
 }, te = Q("travel-rule-web", "index.js", { eu: !0 }), B = "zerohash-travel-rule", ne = ({
   jwt: e,
   depositId: t,
   walletAddress: o,
   intentionAction: r,
   env: n = "prod",
-  theme: s,
+  theme: i,
   onCompleted: c,
   onError: a,
-  onClose: l,
-  onLoaded: m,
+  onClose: s,
+  onLoaded: g,
   onEvent: _,
-  ...g
+  ...h
 }) => {
-  const d = M(null);
+  const d = D(null);
   Y(d, {
-    theme: s,
+    theme: i,
     depositId: t,
     walletAddress: o,
     intentionAction: r,
     onCompleted: c,
     onError: a,
-    onClose: l,
-    onLoaded: m,
+    onClose: s,
+    onLoaded: g,
     onEvent: _
   });
-  const { loadFailed: b, retry: R } = ee({
+  const { loadFailed: R, retry: v } = ee({
     webComponentTag: B,
     scriptUrls: te,
     env: n,
     jwt: e
   });
-  return b ? /* @__PURE__ */ y(X, { onRetry: R }) : D.createElement(B, {
+  return R ? /* @__PURE__ */ p(
+    X,
+    {
+      onRetry: v,
+      onClose: s
+    }
+  ) : M.createElement(B, {
     ref: d,
     jwt: e,
     env: n,
-    theme: s,
+    theme: i,
     // camelCase — React 19 sets these as properties via the extra-prop
     // setters before connectedCallback runs when the element is registered,
     // and as lowercased HTML attributes when it isn't (the base's
@@ -262,7 +280,7 @@ const S = {
     depositId: t,
     walletAddress: o,
     intentionAction: r,
-    ...g
+    ...h
   });
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zerohash-sdk/travel-rule-react",
-  "version": "0.3.6",
+  "version": "0.5.0",
   "private": false,
   "type": "module",
   "main": "./dist/index.js",