@paywithglide/glide-react 0.0.12 → 0.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,4 @@
1
+ import { GlideWidgetTheme } from './theme.ts';
1
2
  export type Hex = `0x${string}`;
2
3
  export type EVMTransaction = {
3
4
  chainId: number;
@@ -93,6 +94,8 @@ export type GlideDepositOptions = {
93
94
  preferGaslessPayment?: boolean;
94
95
  walletProvider?: GlideDepositWalletProvider;
95
96
  onSuccess?: (hash: Hex) => void;
97
+ autoCloseOnSuccess?: boolean;
98
+ theme?: GlideWidgetTheme;
96
99
  baseUrl?: string;
97
100
  };
98
101
  export declare class GlideDeposit {
package/dist/glide.js CHANGED
@@ -1,34 +1,34 @@
1
1
  var k = Object.defineProperty;
2
2
  var C = (s, t, e) => t in s ? k(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
3
- var h = (s, t, e) => C(s, typeof t != "symbol" ? t + "" : t, e);
4
- import { useMemo as m } from "react";
3
+ var m = (s, t, e) => C(s, typeof t != "symbol" ? t + "" : t, e);
4
+ import { useMemo as f } from "react";
5
5
  function G(s, { strict: t = !0 } = {}) {
6
6
  return !s || typeof s != "string" ? !1 : t ? /^0x[0-9a-fA-F]*$/.test(s) : s.startsWith("0x");
7
7
  }
8
- function z(s) {
8
+ function U(s) {
9
9
  return G(s, { strict: !1 }) ? Math.ceil((s.length - 2) / 2) : s.length;
10
10
  }
11
11
  const D = "2.21.51";
12
- let u = {
12
+ let h = {
13
13
  getDocsUrl: ({ docsBaseUrl: s, docsPath: t = "", docsSlug: e }) => t ? `${s ?? "https://viem.sh"}${t}${e ? `#${e}` : ""}` : void 0,
14
14
  version: `viem@${D}`
15
15
  };
16
- class l extends Error {
16
+ class u extends Error {
17
17
  constructor(t, e = {}) {
18
- var o;
18
+ var a;
19
19
  const i = (() => {
20
- var d;
21
- return e.cause instanceof l ? e.cause.details : (d = e.cause) != null && d.message ? e.cause.message : e.details;
22
- })(), n = e.cause instanceof l && e.cause.docsPath || e.docsPath, r = (o = u.getDocsUrl) == null ? void 0 : o.call(u, { ...e, docsPath: n }), a = [
20
+ var o;
21
+ return e.cause instanceof u ? e.cause.details : (o = e.cause) != null && o.message ? e.cause.message : e.details;
22
+ })(), n = e.cause instanceof u && e.cause.docsPath || e.docsPath, r = (a = h.getDocsUrl) == null ? void 0 : a.call(h, { ...e, docsPath: n }), d = [
23
23
  t || "An error occurred.",
24
24
  "",
25
25
  ...e.metaMessages ? [...e.metaMessages, ""] : [],
26
26
  ...r ? [`Docs: ${r}`] : [],
27
27
  ...i ? [`Details: ${i}`] : [],
28
- ...u.version ? [`Version: ${u.version}`] : []
28
+ ...h.version ? [`Version: ${h.version}`] : []
29
29
  ].join(`
30
30
  `);
31
- super(a, e.cause ? { cause: e.cause } : void 0), Object.defineProperty(this, "details", {
31
+ super(d, e.cause ? { cause: e.cause } : void 0), Object.defineProperty(this, "details", {
32
32
  enumerable: !0,
33
33
  configurable: !0,
34
34
  writable: !0,
@@ -61,37 +61,37 @@ class l extends Error {
61
61
  }), this.details = i, this.docsPath = n, this.metaMessages = e.metaMessages, this.name = e.name ?? this.name, this.shortMessage = t, this.version = D;
62
62
  }
63
63
  walk(t) {
64
- return S(this, t);
64
+ return T(this, t);
65
65
  }
66
66
  }
67
- function S(s, t) {
68
- return t != null && t(s) ? s : s && typeof s == "object" && "cause" in s && s.cause !== void 0 ? S(s.cause, t) : t ? null : s;
67
+ function T(s, t) {
68
+ return t != null && t(s) ? s : s && typeof s == "object" && "cause" in s && s.cause !== void 0 ? T(s.cause, t) : t ? null : s;
69
69
  }
70
- class T extends l {
70
+ class S extends u {
71
71
  constructor({ size: t, targetSize: e, type: i }) {
72
72
  super(`${i.charAt(0).toUpperCase()}${i.slice(1).toLowerCase()} size (${t}) exceeds padding size (${e}).`, { name: "SizeExceedsPaddingSizeError" });
73
73
  }
74
74
  }
75
- function g(s, { dir: t, size: e = 32 } = {}) {
76
- return typeof s == "string" ? H(s, { dir: t, size: e }) : W(s, { dir: t, size: e });
75
+ function y(s, { dir: t, size: e = 32 } = {}) {
76
+ return typeof s == "string" ? W(s, { dir: t, size: e }) : H(s, { dir: t, size: e });
77
77
  }
78
- function H(s, { dir: t, size: e = 32 } = {}) {
78
+ function W(s, { dir: t, size: e = 32 } = {}) {
79
79
  if (e === null)
80
80
  return s;
81
81
  const i = s.replace("0x", "");
82
82
  if (i.length > e * 2)
83
- throw new T({
83
+ throw new S({
84
84
  size: Math.ceil(i.length / 2),
85
85
  targetSize: e,
86
86
  type: "hex"
87
87
  });
88
88
  return `0x${i[t === "right" ? "padEnd" : "padStart"](e * 2, "0")}`;
89
89
  }
90
- function W(s, { dir: t, size: e = 32 } = {}) {
90
+ function H(s, { dir: t, size: e = 32 } = {}) {
91
91
  if (e === null)
92
92
  return s;
93
93
  if (s.length > e)
94
- throw new T({
94
+ throw new S({
95
95
  size: s.length,
96
96
  targetSize: e,
97
97
  type: "bytes"
@@ -103,66 +103,66 @@ function W(s, { dir: t, size: e = 32 } = {}) {
103
103
  }
104
104
  return i;
105
105
  }
106
- class B extends l {
106
+ class B extends u {
107
107
  constructor({ max: t, min: e, signed: i, size: n, value: r }) {
108
108
  super(`Number "${r}" is not in safe ${n ? `${n * 8}-bit ${i ? "signed" : "unsigned"} ` : ""}integer range ${t ? `(${e} to ${t})` : `(above ${e})`}`, { name: "IntegerOutOfRangeError" });
109
109
  }
110
110
  }
111
- class j extends l {
111
+ class j extends u {
112
112
  constructor({ givenSize: t, maxSize: e }) {
113
113
  super(`Size cannot exceed ${e} bytes. Given size: ${t} bytes.`, { name: "SizeOverflowError" });
114
114
  }
115
115
  }
116
116
  function A(s, { size: t }) {
117
- if (z(s) > t)
117
+ if (U(s) > t)
118
118
  throw new j({
119
- givenSize: z(s),
119
+ givenSize: U(s),
120
120
  maxSize: t
121
121
  });
122
122
  }
123
123
  const O = /* @__PURE__ */ Array.from({ length: 256 }, (s, t) => t.toString(16).padStart(2, "0"));
124
- function U(s, t = {}) {
124
+ function z(s, t = {}) {
125
125
  return typeof s == "number" || typeof s == "bigint" ? N(s, t) : typeof s == "string" ? V(s, t) : typeof s == "boolean" ? L(s, t) : M(s, t);
126
126
  }
127
127
  function L(s, t = {}) {
128
128
  const e = `0x${Number(s)}`;
129
- return typeof t.size == "number" ? (A(e, { size: t.size }), g(e, { size: t.size })) : e;
129
+ return typeof t.size == "number" ? (A(e, { size: t.size }), y(e, { size: t.size })) : e;
130
130
  }
131
131
  function M(s, t = {}) {
132
132
  let e = "";
133
133
  for (let n = 0; n < s.length; n++)
134
134
  e += O[s[n]];
135
135
  const i = `0x${e}`;
136
- return typeof t.size == "number" ? (A(i, { size: t.size }), g(i, { dir: "right", size: t.size })) : i;
136
+ return typeof t.size == "number" ? (A(i, { size: t.size }), y(i, { dir: "right", size: t.size })) : i;
137
137
  }
138
138
  function N(s, t = {}) {
139
139
  const { signed: e, size: i } = t, n = BigInt(s);
140
140
  let r;
141
141
  i ? e ? r = (1n << BigInt(i) * 8n - 1n) - 1n : r = 2n ** (BigInt(i) * 8n) - 1n : typeof s == "number" && (r = BigInt(Number.MAX_SAFE_INTEGER));
142
- const a = typeof r == "bigint" && e ? -r - 1n : 0;
143
- if (r && n > r || n < a) {
144
- const d = typeof s == "bigint" ? "n" : "";
142
+ const d = typeof r == "bigint" && e ? -r - 1n : 0;
143
+ if (r && n > r || n < d) {
144
+ const o = typeof s == "bigint" ? "n" : "";
145
145
  throw new B({
146
- max: r ? `${r}${d}` : void 0,
147
- min: `${a}${d}`,
146
+ max: r ? `${r}${o}` : void 0,
147
+ min: `${d}${o}`,
148
148
  signed: e,
149
149
  size: i,
150
- value: `${s}${d}`
150
+ value: `${s}${o}`
151
151
  });
152
152
  }
153
- const o = `0x${(e && n < 0 ? (1n << BigInt(i * 8)) + BigInt(n) : n).toString(16)}`;
154
- return i ? g(o, { size: i }) : o;
153
+ const a = `0x${(e && n < 0 ? (1n << BigInt(i * 8)) + BigInt(n) : n).toString(16)}`;
154
+ return i ? y(a, { size: i }) : a;
155
155
  }
156
156
  const R = /* @__PURE__ */ new TextEncoder();
157
157
  function V(s, t = {}) {
158
158
  const e = R.encode(s);
159
159
  return M(e, t);
160
160
  }
161
- class f {
161
+ class g {
162
162
  constructor(t) {
163
- h(this, "opts");
164
- h(this, "open", () => {
165
- var a, o, d, p;
163
+ m(this, "opts");
164
+ m(this, "open", () => {
165
+ var d, a, o, c;
166
166
  if (document.body.classList.contains("glide-deposit-open")) return;
167
167
  if (document.body.classList.add("glide-deposit-open"), (this.opts.mode === "deposit" || this.opts.mode === "buy") && !this.opts.recipient)
168
168
  throw new Error("recipient is required for deposit/buy mode");
@@ -170,13 +170,13 @@ class f {
170
170
  throw new Error(
171
171
  "walletProvider.signTypedDataAsync is required when preferGaslessPayment=true"
172
172
  );
173
- const t = this.opts.recipient, e = (a = this.opts.walletProvider) == null ? void 0 : a.address, i = (o = this.opts.walletProvider) == null ? void 0 : o.availableChainIds, n = (d = this.opts.walletProvider) == null ? void 0 : d.currentChainId, r = this.opts.preferGaslessPayment || !!((p = this.opts.walletProvider) != null && p.signTypedDataAsync);
173
+ const t = this.opts.recipient, e = (d = this.opts.walletProvider) == null ? void 0 : d.address, i = (a = this.opts.walletProvider) == null ? void 0 : a.availableChainIds, n = (o = this.opts.walletProvider) == null ? void 0 : o.currentChainId, r = this.opts.preferGaslessPayment || !!((c = this.opts.walletProvider) != null && c.signTypedDataAsync);
174
174
  this.openUrl(
175
- `${this.baseUrl}${this.opts.app}?embed=true${t ? `&recipient=${t}` : ""}${e ? `&connectedWalletAddress=${e}` : ""}${n ? `&currentChainId=${n}` : ""}${i ? `&availableChainIds=${i.join(",")}` : ""}${r ? "&preferGaslessPayment=true" : ""}${this.opts.mode ? `&mode=${this.opts.mode}` : ""}${this.opts.amount ? `&amount=${this.opts.amount}` : ""}${this.opts.evm ? `&evm.chainId=${this.opts.evm.chainId}&evm.to=${this.opts.evm.to}&evm.data=${this.opts.evm.data || "0x0"}&evm.value=${U(this.opts.evm.value || 0n)}` : ""}${this.opts.approval ? `&approval.token=${this.opts.approval.token}&approval.amount=${this.opts.approval.amount}` : ""}${this.opts.sessionMetadata ? `&metadata=${this.opts.sessionMetadata}` : ""}`
175
+ `${this.baseUrl}${this.opts.app}?embed=true${t ? `&recipient=${t}` : ""}${e ? `&connectedWalletAddress=${e}` : ""}${n ? `&currentChainId=${n}` : ""}${i ? `&availableChainIds=${i.join(",")}` : ""}${r ? "&preferGaslessPayment=true" : ""}${this.opts.mode ? `&mode=${this.opts.mode}` : ""}${this.opts.amount ? `&amount=${this.opts.amount}` : ""}${this.opts.evm ? `&evm.chainId=${this.opts.evm.chainId}&evm.to=${this.opts.evm.to}&evm.data=${this.opts.evm.data || "0x0"}&evm.value=${z(this.opts.evm.value || 0n)}` : ""}${this.opts.approval ? `&approval.token=${this.opts.approval.token}&approval.amount=${this.opts.approval.amount}` : ""}${this.opts.sessionMetadata ? `&metadata=${this.opts.sessionMetadata}` : ""}${this.opts.autoCloseOnSuccess ? "&autoCloseOnSuccess=true" : ""}`
176
176
  ), this.initialize();
177
177
  });
178
- h(this, "iframeEventHandler", async (t) => {
179
- var i, n, r, a, o, d, p, y, w, $, v, b, x, P, I, E;
178
+ m(this, "iframeEventHandler", async (t) => {
179
+ var i, n, r, d, a, o, c, l, $, w, v, b, x, P, I, E;
180
180
  const e = t.data;
181
181
  switch (e.type) {
182
182
  case "success":
@@ -191,7 +191,7 @@ class f {
191
191
  try {
192
192
  await this.opts.walletProvider.switchChainAsync({
193
193
  chainId: e.chainId
194
- }), (a = (r = this.iframe) == null ? void 0 : r.contentWindow) == null || a.postMessage(
194
+ }), (d = (r = this.iframe) == null ? void 0 : r.contentWindow) == null || d.postMessage(
195
195
  {
196
196
  type: "didSwitchChain",
197
197
  success: !0,
@@ -199,12 +199,12 @@ class f {
199
199
  },
200
200
  this.baseUrl
201
201
  );
202
- } catch (c) {
203
- (d = (o = this.iframe) == null ? void 0 : o.contentWindow) == null || d.postMessage(
202
+ } catch (p) {
203
+ (o = (a = this.iframe) == null ? void 0 : a.contentWindow) == null || o.postMessage(
204
204
  {
205
205
  type: "didSwitchChain",
206
206
  success: !1,
207
- error: c
207
+ error: p
208
208
  },
209
209
  this.baseUrl
210
210
  );
@@ -215,23 +215,23 @@ class f {
215
215
  if (!this.opts.walletProvider)
216
216
  throw new Error("walletProvider is not set");
217
217
  try {
218
- const c = await this.opts.walletProvider.sendTransactionAsync(
218
+ const p = await this.opts.walletProvider.sendTransactionAsync(
219
219
  e.tx
220
220
  );
221
- (y = (p = this.iframe) == null ? void 0 : p.contentWindow) == null || y.postMessage(
221
+ (l = (c = this.iframe) == null ? void 0 : c.contentWindow) == null || l.postMessage(
222
222
  {
223
223
  type: "didSendTransaction",
224
224
  success: !0,
225
- txHash: c
225
+ txHash: p
226
226
  },
227
227
  this.baseUrl
228
228
  );
229
- } catch (c) {
230
- ($ = (w = this.iframe) == null ? void 0 : w.contentWindow) == null || $.postMessage(
229
+ } catch (p) {
230
+ (w = ($ = this.iframe) == null ? void 0 : $.contentWindow) == null || w.postMessage(
231
231
  {
232
232
  type: "didSendTransaction",
233
233
  success: !1,
234
- error: c
234
+ error: p
235
235
  },
236
236
  this.baseUrl
237
237
  );
@@ -254,23 +254,23 @@ class f {
254
254
  return;
255
255
  }
256
256
  try {
257
- const c = await this.opts.walletProvider.signTypedDataAsync(
257
+ const p = await this.opts.walletProvider.signTypedDataAsync(
258
258
  e.data
259
259
  );
260
260
  (P = (x = this.iframe) == null ? void 0 : x.contentWindow) == null || P.postMessage(
261
261
  {
262
262
  type: "didSignTypedData",
263
263
  success: !0,
264
- signature: c
264
+ signature: p
265
265
  },
266
266
  this.baseUrl
267
267
  );
268
- } catch (c) {
268
+ } catch (p) {
269
269
  (E = (I = this.iframe) == null ? void 0 : I.contentWindow) == null || E.postMessage(
270
270
  {
271
271
  type: "didSignTypedData",
272
272
  success: !1,
273
- error: c
273
+ error: p
274
274
  },
275
275
  this.baseUrl
276
276
  );
@@ -282,7 +282,7 @@ class f {
282
282
  this.opts = t;
283
283
  }
284
284
  get externalUrl() {
285
- return `${this.baseUrl}${this.opts.app}?${this.opts.recipient ? `&recipient=${this.opts.recipient}` : ""}${this.opts.preferGaslessPayment ? "&preferGaslessPayment=true" : ""}${this.opts.mode ? `&mode=${this.opts.mode}` : ""}${this.opts.amount ? `&amount=${this.opts.amount}` : ""}${this.opts.evm ? `&evm.chainId=${this.opts.evm.chainId}&evm.to=${this.opts.evm.to}&evm.data=${this.opts.evm.data || "0x0"}&evm.value=${U(this.opts.evm.value || 0n)}` : ""}${this.opts.approval ? `&approval.token=${this.opts.approval.token}&approval.amount=${this.opts.approval.amount}` : ""}${this.opts.sessionMetadata ? `&metadata=${this.opts.sessionMetadata}` : ""}`;
285
+ return `${this.baseUrl}${this.opts.app}?${this.opts.recipient ? `&recipient=${this.opts.recipient}` : ""}${this.opts.preferGaslessPayment ? "&preferGaslessPayment=true" : ""}${this.opts.mode ? `&mode=${this.opts.mode}` : ""}${this.opts.amount ? `&amount=${this.opts.amount}` : ""}${this.opts.evm ? `&evm.chainId=${this.opts.evm.chainId}&evm.to=${this.opts.evm.to}&evm.data=${this.opts.evm.data || "0x0"}&evm.value=${z(this.opts.evm.value || 0n)}` : ""}${this.opts.approval ? `&approval.token=${this.opts.approval.token}&approval.amount=${this.opts.approval.amount}` : ""}${this.opts.sessionMetadata ? `&metadata=${this.opts.sessionMetadata}` : ""}${this.opts.autoCloseOnSuccess ? "&autoCloseOnSuccess=true" : ""}`;
286
286
  }
287
287
  initialize() {
288
288
  window.addEventListener("message", this.iframeEventHandler);
@@ -306,8 +306,14 @@ class f {
306
306
  "style",
307
307
  "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%; opacity: 0;"
308
308
  ), e.onload = () => {
309
- var i;
310
- e.style.opacity = "1", (i = e == null ? void 0 : e.contentWindow) == null || i.focus();
309
+ var i, n;
310
+ e.style.opacity = "1", (i = e == null ? void 0 : e.contentWindow) == null || i.focus(), (n = e == null ? void 0 : e.contentWindow) == null || n.postMessage(
311
+ {
312
+ type: "updateTheme",
313
+ theme: this.opts.theme
314
+ },
315
+ this.baseUrl
316
+ );
311
317
  }, e.src = t, e.allow = "payment *; clipboard-write *", document.body.appendChild(e);
312
318
  }
313
319
  removeIframe() {
@@ -321,19 +327,23 @@ const X = ({
321
327
  preferGaslessPayment: e,
322
328
  mode: i,
323
329
  sessionMetadata: n,
324
- walletProvider: r,
330
+ theme: r,
331
+ walletProvider: d,
325
332
  onSuccess: a,
326
- baseUrl: o
333
+ autoCloseOnSuccess: o,
334
+ baseUrl: c
327
335
  }) => {
328
- const d = m(() => new f({
336
+ const l = f(() => new g({
329
337
  app: s,
330
338
  recipient: t,
331
339
  preferGaslessPayment: e,
332
340
  mode: i,
333
341
  sessionMetadata: n,
334
- walletProvider: r,
342
+ theme: r,
343
+ walletProvider: d,
335
344
  onSuccess: a,
336
- baseUrl: o
345
+ autoCloseOnSuccess: o,
346
+ baseUrl: c
337
347
  }), [
338
348
  s,
339
349
  t,
@@ -341,32 +351,38 @@ const X = ({
341
351
  i,
342
352
  n,
343
353
  r,
354
+ d,
344
355
  a,
345
- o
356
+ o,
357
+ c
346
358
  ]);
347
359
  return {
348
- openGlideDeposit: d.open,
349
- externalUrl: d.externalUrl,
350
- opts: d.opts
360
+ openGlideDeposit: l.open,
361
+ externalUrl: l.externalUrl,
362
+ opts: l.opts
351
363
  };
352
364
  }, J = ({
353
365
  app: s,
354
366
  preferGaslessPayment: t,
355
367
  amount: e,
356
368
  sessionMetadata: i,
357
- walletProvider: n,
358
- onSuccess: r,
359
- baseUrl: a
369
+ theme: n,
370
+ walletProvider: r,
371
+ onSuccess: d,
372
+ autoCloseOnSuccess: a,
373
+ baseUrl: o
360
374
  }) => {
361
- const o = m(() => new f({
375
+ const c = f(() => new g({
362
376
  app: s,
363
377
  preferGaslessPayment: t,
364
378
  mode: "pay",
365
379
  amount: e,
366
380
  sessionMetadata: i,
367
- walletProvider: n,
368
- onSuccess: r,
369
- baseUrl: a
381
+ theme: n,
382
+ walletProvider: r,
383
+ onSuccess: d,
384
+ autoCloseOnSuccess: a,
385
+ baseUrl: o
370
386
  }), [
371
387
  s,
372
388
  t,
@@ -374,12 +390,14 @@ const X = ({
374
390
  i,
375
391
  n,
376
392
  r,
377
- a
393
+ d,
394
+ a,
395
+ o
378
396
  ]);
379
397
  return {
380
- openGlidePay: o.open,
381
- externalUrl: o.externalUrl,
382
- opts: o.opts
398
+ openGlidePay: c.open,
399
+ externalUrl: c.externalUrl,
400
+ opts: c.opts
383
401
  };
384
402
  }, K = ({
385
403
  app: s,
@@ -387,20 +405,24 @@ const X = ({
387
405
  approval: e,
388
406
  preferGaslessPayment: i,
389
407
  sessionMetadata: n,
390
- walletProvider: r,
408
+ theme: r,
409
+ walletProvider: d,
391
410
  onSuccess: a,
392
- baseUrl: o
411
+ autoCloseOnSuccess: o,
412
+ baseUrl: c
393
413
  }) => {
394
- const d = m(() => new f({
414
+ const l = f(() => new g({
395
415
  app: s,
396
416
  evm: t,
397
417
  approval: e,
398
418
  preferGaslessPayment: i,
399
419
  sessionMetadata: n,
400
420
  mode: "call",
401
- walletProvider: r,
421
+ theme: r,
422
+ walletProvider: d,
402
423
  onSuccess: a,
403
- baseUrl: o
424
+ autoCloseOnSuccess: o,
425
+ baseUrl: c
404
426
  }), [
405
427
  s,
406
428
  t,
@@ -408,32 +430,38 @@ const X = ({
408
430
  i,
409
431
  n,
410
432
  r,
433
+ d,
411
434
  a,
412
- o
435
+ o,
436
+ c
413
437
  ]);
414
438
  return {
415
- openGlideCall: d.open,
416
- externalUrl: d.externalUrl,
417
- opts: d.opts
439
+ openGlideCall: l.open,
440
+ externalUrl: l.externalUrl,
441
+ opts: l.opts
418
442
  };
419
443
  }, Q = ({
420
444
  app: s,
421
445
  recipient: t,
422
446
  preferGaslessPayment: e,
423
447
  sessionMetadata: i,
424
- walletProvider: n,
425
- onSuccess: r,
426
- baseUrl: a
448
+ theme: n,
449
+ walletProvider: r,
450
+ onSuccess: d,
451
+ autoCloseOnSuccess: a,
452
+ baseUrl: o
427
453
  }) => {
428
- const o = m(() => new f({
454
+ const c = f(() => new g({
429
455
  app: s,
430
456
  recipient: t,
431
457
  preferGaslessPayment: e,
432
458
  sessionMetadata: i,
433
459
  mode: "buy",
434
- walletProvider: n,
435
- onSuccess: r,
436
- baseUrl: a
460
+ theme: n,
461
+ walletProvider: r,
462
+ onSuccess: d,
463
+ autoCloseOnSuccess: a,
464
+ baseUrl: o
437
465
  }), [
438
466
  s,
439
467
  t,
@@ -441,16 +469,18 @@ const X = ({
441
469
  i,
442
470
  n,
443
471
  r,
444
- a
472
+ d,
473
+ a,
474
+ o
445
475
  ]);
446
476
  return {
447
- openGlideBuy: o.open,
448
- externalUrl: o.externalUrl,
449
- opts: o.opts
477
+ openGlideBuy: c.open,
478
+ externalUrl: c.externalUrl,
479
+ opts: c.opts
450
480
  };
451
481
  };
452
482
  export {
453
- f as GlideDeposit,
483
+ g as GlideDeposit,
454
484
  Q as useGlideBuy,
455
485
  K as useGlideCall,
456
486
  X as useGlideDeposit,
package/dist/index.d.ts CHANGED
@@ -3,3 +3,4 @@ export * from './useGlideDeposit.ts';
3
3
  export * from './useGlidePay.ts';
4
4
  export * from './useGlideCall.ts';
5
5
  export * from './useGlideBuy.ts';
6
+ export * from './theme.ts';
@@ -0,0 +1,30 @@
1
+ export type GlideWidgetTheme = {
2
+ modalBorderWidth?: string;
3
+ modalBorderRadius?: string;
4
+ buttonPrimaryForeground?: string;
5
+ buttonPrimaryBackground?: string;
6
+ buttonPrimaryBorderColor?: string;
7
+ buttonPrimaryBorderWidth?: string;
8
+ buttonPrimaryBorderRadius?: string;
9
+ buttonPrimaryPadding?: string;
10
+ buttonSecondaryBackground?: string;
11
+ buttonSecondaryBorderColor?: string;
12
+ buttonSecondaryBorderWidth?: string;
13
+ buttonSecondaryBorderRadius?: string;
14
+ buttonSecondaryPadding?: string;
15
+ alertBackground?: string;
16
+ alertBorderWidth?: string;
17
+ colorModalBackdrop?: string;
18
+ colorModalBackground?: string;
19
+ colorModalBorder?: string;
20
+ colorTextPrimary?: string;
21
+ colorTextSeconday?: string;
22
+ colorPrimaryButtonBackground?: string;
23
+ colorBackgroundSecondary?: string;
24
+ colorAlertBackground?: string;
25
+ colorAlertAccent?: string;
26
+ colorAlertWarningBackground?: string;
27
+ colorAlertWarningAccent?: string;
28
+ colorAlertBorder?: string;
29
+ appLogoHeight?: string;
30
+ };
@@ -1,14 +1,17 @@
1
1
  import { GlideDepositWalletProvider, Hex } from './GlideDeposit.ts';
2
+ import { GlideWidgetTheme } from './theme.ts';
2
3
  interface UseGlideBuyProps {
3
4
  app: string;
4
5
  recipient?: Hex;
5
6
  preferGaslessPayment?: boolean;
6
7
  sessionMetadata?: string;
8
+ theme?: GlideWidgetTheme;
7
9
  walletProvider?: GlideDepositWalletProvider;
8
10
  onSuccess?: (hash: Hex) => void;
11
+ autoCloseOnSuccess?: boolean;
9
12
  baseUrl?: string;
10
13
  }
11
- export declare const useGlideBuy: ({ app, recipient, preferGaslessPayment, sessionMetadata, walletProvider, onSuccess, baseUrl, }: UseGlideBuyProps) => {
14
+ export declare const useGlideBuy: ({ app, recipient, preferGaslessPayment, sessionMetadata, theme, walletProvider, onSuccess, autoCloseOnSuccess, baseUrl, }: UseGlideBuyProps) => {
12
15
  openGlideBuy: () => void;
13
16
  externalUrl: string;
14
17
  opts: import('./GlideDeposit.ts').GlideDepositOptions;
@@ -1,4 +1,5 @@
1
1
  import { GlideDepositWalletProvider, Hex } from './GlideDeposit.ts';
2
+ import { GlideWidgetTheme } from './theme.ts';
2
3
  interface UseGlideCallProps {
3
4
  app: string;
4
5
  evm: {
@@ -13,11 +14,13 @@ interface UseGlideCallProps {
13
14
  };
14
15
  preferGaslessPayment?: boolean;
15
16
  sessionMetadata?: string;
17
+ theme?: GlideWidgetTheme;
16
18
  walletProvider?: GlideDepositWalletProvider;
17
19
  onSuccess?: (hash: Hex) => void;
20
+ autoCloseOnSuccess?: boolean;
18
21
  baseUrl?: string;
19
22
  }
20
- export declare const useGlideCall: ({ app, evm, approval, preferGaslessPayment, sessionMetadata, walletProvider, onSuccess, baseUrl, }: UseGlideCallProps) => {
23
+ export declare const useGlideCall: ({ app, evm, approval, preferGaslessPayment, sessionMetadata, theme, walletProvider, onSuccess, autoCloseOnSuccess, baseUrl, }: UseGlideCallProps) => {
21
24
  openGlideCall: () => void;
22
25
  externalUrl: string;
23
26
  opts: import('./GlideDeposit.ts').GlideDepositOptions;
@@ -1,15 +1,18 @@
1
1
  import { GlideDepositWalletProvider, Hex } from './GlideDeposit.ts';
2
+ import { GlideWidgetTheme } from './theme.ts';
2
3
  interface UseGlideDepositProps {
3
4
  app: string;
4
5
  recipient?: Hex;
5
6
  preferGaslessPayment?: boolean;
6
7
  mode?: "deposit" | "withdraw";
7
8
  sessionMetadata?: string;
9
+ theme?: GlideWidgetTheme;
8
10
  walletProvider?: GlideDepositWalletProvider;
9
- onSuccess?: (hash: Hex) => void;
11
+ onSuccess?: (hash: string) => void;
12
+ autoCloseOnSuccess?: boolean;
10
13
  baseUrl?: string;
11
14
  }
12
- export declare const useGlideDeposit: ({ app, recipient, preferGaslessPayment, mode, sessionMetadata, walletProvider, onSuccess, baseUrl, }: UseGlideDepositProps) => {
15
+ export declare const useGlideDeposit: ({ app, recipient, preferGaslessPayment, mode, sessionMetadata, theme, walletProvider, onSuccess, autoCloseOnSuccess, baseUrl, }: UseGlideDepositProps) => {
13
16
  openGlideDeposit: () => void;
14
17
  externalUrl: string;
15
18
  opts: import('./GlideDeposit.ts').GlideDepositOptions;
@@ -1,15 +1,17 @@
1
1
  import { GlideDepositWalletProvider } from './GlideDeposit.ts';
2
- import { Hex } from 'viem';
2
+ import { GlideWidgetTheme } from './theme.ts';
3
3
  interface UseGlidePayProps {
4
4
  app: string;
5
5
  preferGaslessPayment?: boolean;
6
6
  amount: string;
7
7
  sessionMetadata?: string;
8
+ theme?: GlideWidgetTheme;
8
9
  walletProvider?: GlideDepositWalletProvider;
9
- onSuccess?: (hash: Hex) => void;
10
+ onSuccess?: (hash: string) => void;
11
+ autoCloseOnSuccess?: boolean;
10
12
  baseUrl?: string;
11
13
  }
12
- export declare const useGlidePay: ({ app, preferGaslessPayment, amount, sessionMetadata, walletProvider, onSuccess, baseUrl, }: UseGlidePayProps) => {
14
+ export declare const useGlidePay: ({ app, preferGaslessPayment, amount, sessionMetadata, theme, walletProvider, onSuccess, autoCloseOnSuccess, baseUrl, }: UseGlidePayProps) => {
13
15
  openGlidePay: () => void;
14
16
  externalUrl: string;
15
17
  opts: import('./GlideDeposit.ts').GlideDepositOptions;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@paywithglide/glide-react",
3
- "version": "0.0.12",
3
+ "version": "0.0.13",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"