@paywithglide/glide-react 0.0.4 → 0.0.6

package/dist/GlideDeposit.d.ts

@@ -77,17 +77,17 @@ export type GlideDepositWalletProvider = {
 export type GlideDepositOptions = {
     app: string;
     recipient?: Hex;
-    mode: "deposit" | "withdraw";
+    mode?: "deposit" | "withdraw";
+    preferGaslessPayment?: boolean;
     walletProvider?: GlideDepositWalletProvider;
     baseUrl?: string;
 };
 export declare class GlideDeposit {
     opts: GlideDepositOptions;
     constructor(opts: GlideDepositOptions);
-    private didInit;
-    initialize(): void;
-    destroy(): void;
     open: () => void;
+    private initialize;
+    private destroy;
     private get baseUrl();
     private get iframe();
     private iframeEventHandler;

package/dist/glide.js

@@ -1,28 +1,31 @@
 var v = Object.defineProperty;
-var b = (o, e, t) => e in o ? v(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var l = (o, e, t) => b(o, typeof e != "symbol" ? e + "" : e, t);
-import { useMemo as I, useEffect as E } from "react";
-class P {
+var b = (i, e, t) => e in i ? v(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
+var p = (i, e, t) => b(i, typeof e != "symbol" ? e + "" : e, t);
+import { useMemo as P } from "react";
+class E {
   constructor(e) {
-    l(this, "opts");
-    l(this, "didInit", !1);
-    l(this, "open", () => {
-      var e, t, s, a;
+    p(this, "opts");
+    p(this, "open", () => {
+      var e, t, s, o;
       if (!document.body.classList.contains("glide-deposit-open")) {
         if (document.body.classList.add("glide-deposit-open"), this.opts.mode === "deposit" && !this.opts.recipient)
           throw new Error("recipient is required for deposit mode");
-        const i = this.opts.recipient, n = (e = this.opts.walletProvider) == null ? void 0 : e.address, d = (t = this.opts.walletProvider) == null ? void 0 : t.availableChainIds, c = (s = this.opts.walletProvider) == null ? void 0 : s.currentChainId, p = !!((a = this.opts.walletProvider) != null && a.signTypedDataAsync);
+        if (this.opts.preferGaslessPayment && this.opts.walletProvider && !this.opts.walletProvider.signTypedDataAsync)
+          throw new Error(
+            "walletProvider.signTypedDataAsync is required when preferGaslessPayment=true"
+          );
+        const a = this.opts.recipient, n = (e = this.opts.walletProvider) == null ? void 0 : e.address, d = (t = this.opts.walletProvider) == null ? void 0 : t.availableChainIds, l = (s = this.opts.walletProvider) == null ? void 0 : s.currentChainId, c = this.opts.preferGaslessPayment || !!((o = this.opts.walletProvider) != null && o.signTypedDataAsync);
         this.openUrl(
-          `${this.baseUrl}${this.opts.app}?embed=true${i ? `&recipient=${i}` : ""}${n ? `&connectedWalletAddress=${n}` : ""}${c ? `&currentChainId=${c}` : ""}${d ? `&availableChainIds=${d.join(",")}` : ""}${p ? "&preferGaslessPayment=true" : ""}&mode=${this.opts.mode}`
-        );
+          `${this.baseUrl}${this.opts.app}?embed=true${a ? `&recipient=${a}` : ""}${n ? `&connectedWalletAddress=${n}` : ""}${l ? `&currentChainId=${l}` : ""}${d ? `&availableChainIds=${d.join(",")}` : ""}${c ? "&preferGaslessPayment=true" : ""}${this.opts.mode ? `&mode=${this.opts.mode}` : ""}`
+        ), this.initialize();
       }
     });
-    l(this, "iframeEventHandler", async (e) => {
-      var s, a, i, n, d, c, p, h, m, y, u, w, f, g;
+    p(this, "iframeEventHandler", async (e) => {
+      var s, o, a, n, d, l, c, h, m, w, y, u, f, g;
       const t = e.data;
       switch (t.type) {
         case "close":
-          this.removeIframe(), this.hideLoader();
+          this.removeIframe(), this.hideLoader(), this.destroy();
           break;
         case "switchChain":
           if (!this.opts.walletProvider)
@@ -30,7 +33,7 @@ class P {
           try {
             await this.opts.walletProvider.switchChainAsync({
               chainId: t.chainId
-            }), (a = (s = this.iframe) == null ? void 0 : s.contentWindow) == null || a.postMessage(
+            }), (o = (s = this.iframe) == null ? void 0 : s.contentWindow) == null || o.postMessage(
               {
                 type: "didSwitchChain",
                 success: !0,
@@ -39,7 +42,7 @@ class P {
               this.baseUrl
             );
           } catch (r) {
-            (n = (i = this.iframe) == null ? void 0 : i.contentWindow) == null || n.postMessage(
+            (n = (a = this.iframe) == null ? void 0 : a.contentWindow) == null || n.postMessage(
               {
                 type: "didSwitchChain",
                 success: !1,
@@ -57,7 +60,7 @@ class P {
               const r = await this.opts.walletProvider.sendTransactionAsync(
                 t.tx
               );
-              (c = (d = this.iframe) == null ? void 0 : d.contentWindow) == null || c.postMessage(
+              (l = (d = this.iframe) == null ? void 0 : d.contentWindow) == null || l.postMessage(
                 {
                   type: "didSendTransaction",
                   success: !0,
@@ -66,7 +69,7 @@ class P {
                 this.baseUrl
               );
             } catch (r) {
-              (h = (p = this.iframe) == null ? void 0 : p.contentWindow) == null || h.postMessage(
+              (h = (c = this.iframe) == null ? void 0 : c.contentWindow) == null || h.postMessage(
                 {
                   type: "didSendTransaction",
                   success: !1,
@@ -82,7 +85,7 @@ class P {
             if (!this.opts.walletProvider)
               throw new Error("walletProvider is not set");
             if (!this.opts.walletProvider.signTypedDataAsync) {
-              (y = (m = this.iframe) == null ? void 0 : m.contentWindow) == null || y.postMessage(
+              (w = (m = this.iframe) == null ? void 0 : m.contentWindow) == null || w.postMessage(
                 {
                   type: "didSignTypedData",
                   success: !1,
@@ -96,7 +99,7 @@ class P {
               const r = await this.opts.walletProvider.signTypedDataAsync(
                 t.data
               );
-              (w = (u = this.iframe) == null ? void 0 : u.contentWindow) == null || w.postMessage(
+              (u = (y = this.iframe) == null ? void 0 : y.contentWindow) == null || u.postMessage(
                 {
                   type: "didSignTypedData",
                   success: !0,
@@ -121,7 +124,7 @@ class P {
     this.opts = e;
   }
   initialize() {
-    this.didInit || (this.didInit = !0, window.addEventListener("message", this.iframeEventHandler));
+    window.addEventListener("message", this.iframeEventHandler);
   }
   destroy() {
     window.removeEventListener("message", this.iframeEventHandler);
@@ -141,7 +144,7 @@ class P {
     t.id = "glide-deposit-iframe", t.setAttribute(
       "style",
       "z-index: 2147483647; display: block; background-color: transparent; border: 0px none transparent; overflow-x: hidden; overflow-y: auto; visibility: visible; margin: 0px; padding: 0px; -webkit-tap-highlight-color: transparent; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%;"
-    ), t.src = e, t.allow = "payment", document.body.appendChild(t), window.setTimeout(() => {
+    ), t.src = e, t.allow = "payment *; clipboard-write *", document.body.appendChild(t), window.setTimeout(() => {
       var s;
       (s = t == null ? void 0 : t.contentWindow) == null || s.focus();
     }, 100);
@@ -165,27 +168,24 @@ class P {
     document.querySelectorAll(".glide-deposit-loader").forEach((e) => e.remove());
   }
 }
-const T = ({
-  app: o,
+const D = ({
+  app: i,
   recipient: e,
-  mode: t = "deposit",
-  walletProvider: s,
+  preferGaslessPayment: t,
+  mode: s,
+  walletProvider: o,
   baseUrl: a
-}) => {
-  const i = I(() => new P({
-    app: o,
+}) => ({
+  openGlideDeposit: P(() => new E({
+    app: i,
     recipient: e,
-    mode: t,
-    walletProvider: s,
+    preferGaslessPayment: t,
+    mode: s,
+    walletProvider: o,
     baseUrl: a
-  }), [o, e, t, s, a]);
-  return E(() => (i.initialize(), () => {
-    i.destroy();
-  }), [i]), {
-    openGlideDeposit: i.open
-  };
-};
+  }), [i, e, t, s, o, a]).open
+});
 export {
-  P as GlideDeposit,
-  T as useGlideDeposit
+  E as GlideDeposit,
+  D as useGlideDeposit
 };

package/dist/useGlideDeposit.d.ts

@@ -2,11 +2,12 @@ import { GlideDepositWalletProvider, Hex } from './GlideDeposit.ts';
 interface UseGlideDepositProps {
     app: string;
     recipient?: Hex;
+    preferGaslessPayment?: boolean;
     mode?: "deposit" | "withdraw";
-    walletProvider: GlideDepositWalletProvider;
+    walletProvider?: GlideDepositWalletProvider;
     baseUrl?: string;
 }
-export declare const useGlideDeposit: ({ app, recipient, mode, walletProvider, baseUrl, }: UseGlideDepositProps) => {
+export declare const useGlideDeposit: ({ app, recipient, preferGaslessPayment, mode, walletProvider, baseUrl, }: UseGlideDepositProps) => {
     openGlideDeposit: () => void;
 };
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paywithglide/glide-react",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "type": "module",
   "files": [
     "dist"