@heliofi/deposit-react 0.4.1-alpha.1770389993 → 0.4.4

package/dist/helio-deposit-react.es.d.ts

@@ -54,9 +54,7 @@ export declare const MoonpayCommerceDeposit: (props: MoonpayCommerceDepositReact
 export declare const MoonpayCommerceDepositProvider: (props: PropsWithChildren) => JSX.Element;
 
     config: MoonpayCommerceDepositConfig;
-    trigger?: React.ComponentType<{
-        onClick: () => void;
-    }>;
+    trigger?: HTMLElement;
 }
 
 

package/dist/helio-deposit-react.es.js

@@ -1,116 +1,126 @@
-import { jsxs as C, jsx as d, Fragment as D } from "react/jsx-runtime";
-import { useRef as y, useEffect as a, useState as l, useLayoutEffect as F } from "react";
-const g = "v1", k = () => {
+import { jsxs as y, jsx as c, Fragment as b } from "react/jsx-runtime";
+import { useRef as h, useEffect as a, useState as f, useLayoutEffect as k } from "react";
+const P = "v1", T = () => {
   try {
     return process.env.VITE_PROD_HOSTNAME || "embed.deposits.hel.io";
   } catch {
     return "embed.deposits.hel.io";
   }
-}, P = k(), A = "deposit-embed-script", H = `https://${P}/assets/index-${g}.js`, L = ({ children: e }) => /* @__PURE__ */ C("div", { children: [
+}, A = T(), H = "deposit-embed-script", L = `https://${A}/assets/index-${P}.js`, N = ({ children: e }) => /* @__PURE__ */ y("div", { children: [
   "Error loading Helio Deposit for React",
   e ? `: ${e}` : ""
 ] });
 process.env.VITE_EMBED_VERSION;
 process.env.VITE_PROD_HOSTNAME;
 process.env.VERCEL_ENV;
-const O = (e, r) => {
-  const t = document.createElement("script");
-  return t.setAttribute("type", "module"), t.setAttribute("id", r), t.setAttribute("src", e), document.body.appendChild(t), t;
-}, I = (e) => document.querySelector(
+const I = (e, t) => {
+  const n = document.createElement("script");
+  return n.setAttribute("type", "module"), n.setAttribute("id", t), n.setAttribute("src", e), document.body.appendChild(n), n;
+}, O = (e) => document.querySelector(
   `script#${e}`
-), N = ({
+), V = ({
   scriptIdentifier: e,
-  scriptSrc: r
+  scriptSrc: t
 }) => {
-  const t = w(r, {
+  const n = R(t, {
     embedScriptSource: void 0
-  }), o = y(!1);
+  }), r = h(!1);
   a(() => {
-    o.current || (o.current = !0, !I(e) && O(t, e));
-  }, [t, e]);
-}, w = (e, r) => r.embedScriptSource || e, V = ({
+    r.current || (r.current = !0, !O(e) && I(n, e));
+  }, [n, e]);
+}, R = (e, t) => t.embedScriptSource || e, j = ({
   type: e,
-  config: r,
-  scriptIdentifier: t,
-  scriptSrc: o,
-  trigger: u
+  config: t,
+  scriptIdentifier: n,
+  scriptSrc: r,
+  trigger: l
 }) => {
-  const p = y(null), [E, b] = l(!1);
-  a(() => b(!0), []);
-  const [i, M] = l(), [_, m] = l(""), S = w(o, r);
+  const i = h(null), [m, d] = f(!1);
+  a(() => d(!0), []);
+  const [s, M] = f(), [_, E] = f(""), S = R(r, t);
   return a(() => {
-    let s = !1;
-    if (i) return;
-    const c = () => {
-      if (s) return;
-      let n;
-      if (e === "paylink" ? n = window.helioCheckout : n = window.moonpayCommerceDeposit, !n) {
-        m(
+    let u = !1;
+    if (s) return;
+    const p = () => {
+      if (u) return;
+      let o;
+      if (e === "paylink" ? o = window.helioCheckout : o = window.moonpayCommerceDeposit, !o) {
+        E(
           e === "paylink" ? "Unable to load MoonPay Commerce Checkout - missing init function on window.helioCheckout" : "Unable to load Helio Deposit - missing init function on window.moonpayCommerceDeposit"
         );
         return;
       }
-      M(() => n);
-    }, f = (n) => {
-      const h = () => m("Error loading script tag");
-      return n.addEventListener("load", c), n.addEventListener("error", h), () => {
-        s = !0, n.removeEventListener("load", c), n.removeEventListener("error", h);
+      M(() => o);
+    }, v = (o) => {
+      const D = () => E("Error loading script tag");
+      return o.addEventListener("load", p), o.addEventListener("error", D), () => {
+        u = !0, o.removeEventListener("load", p), o.removeEventListener("error", D);
       };
-    }, v = I(t);
-    if (v) {
+    }, C = O(n);
+    if (C) {
       if (e === "paylink" && window.helioCheckout || e === "deposit" && window.moonpayCommerceDeposit) {
-        c();
+        p();
         return;
       }
-      return f(v);
+      return v(C);
     }
-    const T = O(
+    const F = I(
       S,
-      t
+      n
     );
-    return f(T);
-  }, [i, S, o, t, e]), F(() => {
-    if (!(!i || !E)) {
-      if (!p.current) {
-        m(
+    return v(F);
+  }, [s, S, r, n, e]), k(() => {
+    if (!(!s || !m)) {
+      if (!i.current) {
+        E(
           e === "paylink" ? "Missing element to mount MoonPay Commerce Checkout" : "Missing element to mount Helio Deposit"
         );
         return;
       }
-      if (!u)
+      if (!l)
         if (e === "paylink") {
-          const s = r;
-          i(p.current, s);
+          const u = t;
+          s(i.current, u);
         } else {
-          const s = i, c = r;
-          s(p.current, c);
+          const u = s, p = t;
+          u(i.current, p);
         }
     }
-  }, [i, E, r, e, u]), { divRef: p, initFn: i, error: _, type: e };
-}, R = {
-  scriptIdentifier: A,
-  scriptSrc: H
-}, j = ({
+  }, [s, m, t, e, l]), { divRef: i, initFn: s, error: _, type: e };
+}, w = {
+  scriptIdentifier: H,
+  scriptSrc: L
+}, x = ({
   config: e,
-  trigger: r
+  trigger: t
 }) => {
-  const { divRef: t, initFn: o, error: u } = V({
+  const { divRef: n, initFn: r, error: l } = j({
     type: "deposit",
-    trigger: r,
+    trigger: t,
     config: e,
-    ...R
-  });
-  return u ? /* @__PURE__ */ d(L, { children: u }) : o ? r ? /* @__PURE__ */ C(D, { children: [
-    /* @__PURE__ */ d("div", { ref: t }),
-    /* @__PURE__ */ d(
-      r,
+    ...w
+  }), i = h(null);
+  return a(() => {
+    const d = i.current;
+    if (!(!d || !t))
+      return d.appendChild(t), () => {
+        d.contains(t) && d.removeChild(t);
+      };
+  }, [t, !!r]), l ? /* @__PURE__ */ c(N, { children: l }) : r ? t ? /* @__PURE__ */ y(b, { children: [
+    /* @__PURE__ */ c("div", { ref: n }),
+    /* @__PURE__ */ c(
+      "button",
       {
-        onClick: () => o(t.current, { ...e, display: "modal" })
+        onClick: () => r(n.current, { ...e, display: "modal" }),
+        className: "hel-bg-transparent hel-border-none hel-outline-none hel-p-0 hel-m-0",
+        id: "moonpay-commerce-deposit-trigger",
+        type: "button",
+        children: /* @__PURE__ */ c("span", { ref: i })
       }
     )
-  ] }) : /* @__PURE__ */ d("div", { ref: t }) : null;
-}, $ = (e) => /* @__PURE__ */ d(j, { ...e }), B = (e) => (N(R), /* @__PURE__ */ d(D, { children: e.children }));
+  ] }) : /* @__PURE__ */ c("div", { ref: n }) : null;
+}, U = (e) => /* @__PURE__ */ c(x, { ...e }), $ = (e) => (V(w), /* @__PURE__ */ c(b, { children: e.children }));
 export {
-  $ as MoonpayCommerceDeposit,
-  B as MoonpayCommerceDepositProvider
+  U as MoonpayCommerceDeposit,
+  $ as MoonpayCommerceDepositProvider
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@heliofi/deposit-react",
   "private": false,
-  "version": "0.4.1-alpha.1770389993",
+  "version": "0.4.4",
   "type": "module",
   "scripts": {
     "dev": "vite",