@rhinestone/deposit-modal 0.1.13 → 0.1.14
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.
- package/dist/index.cjs +548 -428
- package/dist/index.mjs +528 -409
- package/dist/styles.css +76 -21
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -219,8 +219,89 @@ var init_Button = __esm({
|
|
|
219
219
|
}
|
|
220
220
|
});
|
|
221
221
|
|
|
222
|
-
// src/components/
|
|
222
|
+
// src/components/ui/Icons.tsx
|
|
223
223
|
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
224
|
+
function WalletIcon() {
|
|
225
|
+
return /* @__PURE__ */ jsxs3("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
226
|
+
/* @__PURE__ */ jsx4(
|
|
227
|
+
"rect",
|
|
228
|
+
{
|
|
229
|
+
x: "3",
|
|
230
|
+
y: "6",
|
|
231
|
+
width: "18",
|
|
232
|
+
height: "13",
|
|
233
|
+
rx: "2",
|
|
234
|
+
strokeLinecap: "round",
|
|
235
|
+
strokeLinejoin: "round"
|
|
236
|
+
}
|
|
237
|
+
),
|
|
238
|
+
/* @__PURE__ */ jsx4(
|
|
239
|
+
"path",
|
|
240
|
+
{
|
|
241
|
+
d: "M16 12.5a1 1 0 100-2 1 1 0 000 2z",
|
|
242
|
+
fill: "currentColor",
|
|
243
|
+
stroke: "none"
|
|
244
|
+
}
|
|
245
|
+
),
|
|
246
|
+
/* @__PURE__ */ jsx4("path", { d: "M3 10h18", strokeLinecap: "round" })
|
|
247
|
+
] });
|
|
248
|
+
}
|
|
249
|
+
function ExternalLinkIcon() {
|
|
250
|
+
return /* @__PURE__ */ jsxs3("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
251
|
+
/* @__PURE__ */ jsx4(
|
|
252
|
+
"path",
|
|
253
|
+
{
|
|
254
|
+
d: "M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5",
|
|
255
|
+
strokeLinecap: "round",
|
|
256
|
+
strokeLinejoin: "round"
|
|
257
|
+
}
|
|
258
|
+
),
|
|
259
|
+
/* @__PURE__ */ jsx4("path", { d: "M15 3h6v6", strokeLinecap: "round", strokeLinejoin: "round" }),
|
|
260
|
+
/* @__PURE__ */ jsx4("path", { d: "M10 14L21 3", strokeLinecap: "round", strokeLinejoin: "round" })
|
|
261
|
+
] });
|
|
262
|
+
}
|
|
263
|
+
function TransferIcon() {
|
|
264
|
+
return /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx4(
|
|
265
|
+
"path",
|
|
266
|
+
{
|
|
267
|
+
d: "M7.5 21L3 16.5m0 0L7.5 12M3 16.5h13.5m0-9L21 12m0 0l-4.5 4.5M21 12H7.5",
|
|
268
|
+
strokeLinecap: "round",
|
|
269
|
+
strokeLinejoin: "round"
|
|
270
|
+
}
|
|
271
|
+
) });
|
|
272
|
+
}
|
|
273
|
+
function CheckIcon() {
|
|
274
|
+
return /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx4(
|
|
275
|
+
"path",
|
|
276
|
+
{
|
|
277
|
+
d: "M5 13l4 4L19 7",
|
|
278
|
+
strokeLinecap: "round",
|
|
279
|
+
strokeLinejoin: "round"
|
|
280
|
+
}
|
|
281
|
+
) });
|
|
282
|
+
}
|
|
283
|
+
function ChevronRightIcon() {
|
|
284
|
+
return /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx4(
|
|
285
|
+
"path",
|
|
286
|
+
{
|
|
287
|
+
d: "M9 5l7 7-7 7",
|
|
288
|
+
strokeLinecap: "round",
|
|
289
|
+
strokeLinejoin: "round"
|
|
290
|
+
}
|
|
291
|
+
) });
|
|
292
|
+
}
|
|
293
|
+
var init_Icons = __esm({
|
|
294
|
+
"src/components/ui/Icons.tsx"() {
|
|
295
|
+
"use strict";
|
|
296
|
+
}
|
|
297
|
+
});
|
|
298
|
+
|
|
299
|
+
// src/components/steps/ConnectStep.tsx
|
|
300
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
301
|
+
function rowIcon(kind) {
|
|
302
|
+
if (kind === "connected") return /* @__PURE__ */ jsx5(WalletIcon, {});
|
|
303
|
+
return /* @__PURE__ */ jsx5(ExternalLinkIcon, {});
|
|
304
|
+
}
|
|
224
305
|
function ConnectStep({
|
|
225
306
|
walletOptions,
|
|
226
307
|
selectedAddress,
|
|
@@ -236,52 +317,70 @@ function ConnectStep({
|
|
|
236
317
|
if (hasWalletOptions) {
|
|
237
318
|
const hasExternalWallet = walletOptions?.some((option) => option.kind === "external") ?? false;
|
|
238
319
|
const showConnectDifferentWalletOption = Boolean(onConnect) && !hasExternalWallet;
|
|
239
|
-
return /* @__PURE__ */
|
|
240
|
-
/* @__PURE__ */
|
|
241
|
-
/* @__PURE__ */
|
|
320
|
+
return /* @__PURE__ */ jsxs4("div", { className: "rs-step", children: [
|
|
321
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-connect-centered rs-connect-centered--wallets", children: [
|
|
322
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-connect-wallet-list", children: [
|
|
242
323
|
walletOptions?.map((option) => {
|
|
243
324
|
const isSelected = option.address.toLowerCase() === (selectedAddress ?? "").toLowerCase();
|
|
244
325
|
const shortAddress = `${option.address.slice(0, 6)}...${option.address.slice(-4)}`;
|
|
245
|
-
return /* @__PURE__ */
|
|
326
|
+
return /* @__PURE__ */ jsxs4(
|
|
246
327
|
"button",
|
|
247
328
|
{
|
|
248
329
|
type: "button",
|
|
249
330
|
className: `rs-connect-wallet-row ${isSelected ? "rs-connect-wallet-row--selected" : ""}`,
|
|
250
331
|
onClick: () => onSelectAddress?.(option.address),
|
|
251
|
-
children:
|
|
252
|
-
/* @__PURE__ */
|
|
253
|
-
|
|
254
|
-
|
|
332
|
+
children: [
|
|
333
|
+
/* @__PURE__ */ jsx5(
|
|
334
|
+
"div",
|
|
335
|
+
{
|
|
336
|
+
className: `rs-connect-wallet-icon ${isSelected ? "rs-connect-wallet-icon--selected" : ""}`,
|
|
337
|
+
children: rowIcon(option.kind)
|
|
338
|
+
}
|
|
339
|
+
),
|
|
340
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-connect-wallet-meta", children: [
|
|
341
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-label", children: option.label }),
|
|
342
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-address", children: shortAddress })
|
|
343
|
+
] }),
|
|
344
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-indicator", children: isSelected ? /* @__PURE__ */ jsx5(CheckIcon, {}) : /* @__PURE__ */ jsx5(ChevronRightIcon, {}) })
|
|
345
|
+
]
|
|
255
346
|
},
|
|
256
347
|
`${option.label}-${option.address}`
|
|
257
348
|
);
|
|
258
349
|
}),
|
|
259
|
-
showConnectDifferentWalletOption && /* @__PURE__ */
|
|
350
|
+
showConnectDifferentWalletOption && /* @__PURE__ */ jsxs4(
|
|
260
351
|
"button",
|
|
261
352
|
{
|
|
262
353
|
type: "button",
|
|
263
354
|
className: "rs-connect-wallet-row rs-connect-wallet-row--action",
|
|
264
355
|
onClick: onConnect,
|
|
265
|
-
children:
|
|
266
|
-
/* @__PURE__ */
|
|
267
|
-
/* @__PURE__ */
|
|
268
|
-
|
|
356
|
+
children: [
|
|
357
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-icon rs-connect-wallet-icon--action", children: /* @__PURE__ */ jsx5(ExternalLinkIcon, {}) }),
|
|
358
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-connect-wallet-meta", children: [
|
|
359
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-label", children: "External Wallet" }),
|
|
360
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-address", children: "Connect different wallet" })
|
|
361
|
+
] }),
|
|
362
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-indicator", children: /* @__PURE__ */ jsx5(ChevronRightIcon, {}) })
|
|
363
|
+
]
|
|
269
364
|
}
|
|
270
365
|
),
|
|
271
|
-
onSelectTransferCrypto && /* @__PURE__ */
|
|
366
|
+
onSelectTransferCrypto && /* @__PURE__ */ jsxs4(
|
|
272
367
|
"button",
|
|
273
368
|
{
|
|
274
369
|
type: "button",
|
|
275
370
|
className: "rs-connect-wallet-row rs-connect-wallet-row--action",
|
|
276
371
|
onClick: onSelectTransferCrypto,
|
|
277
|
-
children:
|
|
278
|
-
/* @__PURE__ */
|
|
279
|
-
/* @__PURE__ */
|
|
280
|
-
|
|
372
|
+
children: [
|
|
373
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-icon rs-connect-wallet-icon--action", children: /* @__PURE__ */ jsx5(TransferIcon, {}) }),
|
|
374
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-connect-wallet-meta", children: [
|
|
375
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-label", children: "Transfer Crypto" }),
|
|
376
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-address", children: "Deposit via QR code" })
|
|
377
|
+
] }),
|
|
378
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-wallet-indicator", children: /* @__PURE__ */ jsx5(ChevronRightIcon, {}) })
|
|
379
|
+
]
|
|
281
380
|
}
|
|
282
381
|
)
|
|
283
382
|
] }),
|
|
284
|
-
onConnect && walletOptions?.some((option) => option.kind === "external") && /* @__PURE__ */
|
|
383
|
+
onConnect && walletOptions?.some((option) => option.kind === "external") && /* @__PURE__ */ jsx5(
|
|
285
384
|
"button",
|
|
286
385
|
{
|
|
287
386
|
type: "button",
|
|
@@ -291,7 +390,7 @@ function ConnectStep({
|
|
|
291
390
|
}
|
|
292
391
|
)
|
|
293
392
|
] }),
|
|
294
|
-
/* @__PURE__ */
|
|
393
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-step-footer rs-step-footer--connect-empty", children: /* @__PURE__ */ jsx5(
|
|
295
394
|
Button,
|
|
296
395
|
{
|
|
297
396
|
onClick: onContinue,
|
|
@@ -304,12 +403,12 @@ function ConnectStep({
|
|
|
304
403
|
] });
|
|
305
404
|
}
|
|
306
405
|
const handleConnect = onConnect ?? onRequestConnect;
|
|
307
|
-
return /* @__PURE__ */
|
|
308
|
-
/* @__PURE__ */
|
|
309
|
-
/* @__PURE__ */
|
|
310
|
-
/* @__PURE__ */
|
|
311
|
-
/* @__PURE__ */
|
|
312
|
-
/* @__PURE__ */
|
|
406
|
+
return /* @__PURE__ */ jsxs4("div", { className: "rs-step", children: [
|
|
407
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-centered rs-connect-centered--minimal", children: /* @__PURE__ */ jsxs4("div", { className: "rs-connect-empty", children: [
|
|
408
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-connect-empty-graphic", "aria-hidden": "true", children: [
|
|
409
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-empty-orbit rs-connect-empty-orbit--outer" }),
|
|
410
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-empty-orbit rs-connect-empty-orbit--inner" }),
|
|
411
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-empty-core", children: /* @__PURE__ */ jsxs4(
|
|
313
412
|
"svg",
|
|
314
413
|
{
|
|
315
414
|
viewBox: "0 0 24 24",
|
|
@@ -317,7 +416,7 @@ function ConnectStep({
|
|
|
317
416
|
stroke: "currentColor",
|
|
318
417
|
strokeWidth: "1.6",
|
|
319
418
|
children: [
|
|
320
|
-
/* @__PURE__ */
|
|
419
|
+
/* @__PURE__ */ jsx5(
|
|
321
420
|
"path",
|
|
322
421
|
{
|
|
323
422
|
strokeLinecap: "round",
|
|
@@ -325,7 +424,7 @@ function ConnectStep({
|
|
|
325
424
|
d: "M4 8.25A2.25 2.25 0 016.25 6h11.5A2.25 2.25 0 0120 8.25v7.5A2.25 2.25 0 0117.75 18H6.25A2.25 2.25 0 014 15.75v-7.5z"
|
|
326
425
|
}
|
|
327
426
|
),
|
|
328
|
-
/* @__PURE__ */
|
|
427
|
+
/* @__PURE__ */ jsx5(
|
|
329
428
|
"path",
|
|
330
429
|
{
|
|
331
430
|
strokeLinecap: "round",
|
|
@@ -333,18 +432,18 @@ function ConnectStep({
|
|
|
333
432
|
d: "M20 10.5h-3.75a2.25 2.25 0 100 4.5H20"
|
|
334
433
|
}
|
|
335
434
|
),
|
|
336
|
-
/* @__PURE__ */
|
|
435
|
+
/* @__PURE__ */ jsx5("circle", { cx: "16.25", cy: "12.75", r: "0.85", fill: "currentColor" })
|
|
337
436
|
]
|
|
338
437
|
}
|
|
339
438
|
) }),
|
|
340
|
-
/* @__PURE__ */
|
|
341
|
-
/* @__PURE__ */
|
|
439
|
+
/* @__PURE__ */ jsx5("span", { className: "rs-connect-empty-dot rs-connect-empty-dot--left" }),
|
|
440
|
+
/* @__PURE__ */ jsx5("span", { className: "rs-connect-empty-dot rs-connect-empty-dot--right" })
|
|
342
441
|
] }),
|
|
343
|
-
/* @__PURE__ */
|
|
344
|
-
/* @__PURE__ */
|
|
442
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-empty-title", children: "No wallet connected" }),
|
|
443
|
+
/* @__PURE__ */ jsx5("div", { className: "rs-connect-empty-subtitle", children: "Connect an external wallet to continue." })
|
|
345
444
|
] }) }),
|
|
346
|
-
/* @__PURE__ */
|
|
347
|
-
/* @__PURE__ */
|
|
445
|
+
/* @__PURE__ */ jsxs4("div", { className: "rs-step-footer rs-step-footer--connect-empty", children: [
|
|
446
|
+
/* @__PURE__ */ jsx5(
|
|
348
447
|
Button,
|
|
349
448
|
{
|
|
350
449
|
onClick: handleConnect,
|
|
@@ -354,7 +453,7 @@ function ConnectStep({
|
|
|
354
453
|
children: connectButtonLabel
|
|
355
454
|
}
|
|
356
455
|
),
|
|
357
|
-
onSelectTransferCrypto && /* @__PURE__ */
|
|
456
|
+
onSelectTransferCrypto && /* @__PURE__ */ jsx5(
|
|
358
457
|
"button",
|
|
359
458
|
{
|
|
360
459
|
type: "button",
|
|
@@ -370,6 +469,7 @@ var init_ConnectStep = __esm({
|
|
|
370
469
|
"src/components/steps/ConnectStep.tsx"() {
|
|
371
470
|
"use strict";
|
|
372
471
|
init_Button();
|
|
472
|
+
init_Icons();
|
|
373
473
|
ConnectStep.displayName = "ConnectStep";
|
|
374
474
|
}
|
|
375
475
|
});
|
|
@@ -873,7 +973,7 @@ var init_session_owner = __esm({
|
|
|
873
973
|
// src/components/steps/SetupStep.tsx
|
|
874
974
|
import { useState, useEffect as useEffect2, useRef as useRef2, useCallback as useCallback2 } from "react";
|
|
875
975
|
import { walletClientToAccount } from "@rhinestone/sdk";
|
|
876
|
-
import { Fragment, jsx as
|
|
976
|
+
import { Fragment, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
877
977
|
async function resolveSessionOwner(eoaAddress) {
|
|
878
978
|
const localOwner = loadSessionOwnerFromStorage(eoaAddress);
|
|
879
979
|
if (localOwner) {
|
|
@@ -1013,24 +1113,24 @@ function SetupStep({
|
|
|
1013
1113
|
};
|
|
1014
1114
|
const isLoading = state.type === "idle" || state.type === "checking" || state.type === "creating-account" || state.type === "signing-session" || state.type === "registering";
|
|
1015
1115
|
const isError = state.type === "error";
|
|
1016
|
-
return /* @__PURE__ */
|
|
1017
|
-
/* @__PURE__ */
|
|
1018
|
-
isLoading && /* @__PURE__ */
|
|
1019
|
-
/* @__PURE__ */
|
|
1020
|
-
/* @__PURE__ */
|
|
1021
|
-
/* @__PURE__ */
|
|
1022
|
-
/* @__PURE__ */
|
|
1116
|
+
return /* @__PURE__ */ jsxs5("div", { className: "rs-step", children: [
|
|
1117
|
+
/* @__PURE__ */ jsxs5("div", { className: "rs-loading-state", children: [
|
|
1118
|
+
isLoading && /* @__PURE__ */ jsxs5(Fragment, { children: [
|
|
1119
|
+
/* @__PURE__ */ jsx6(Spinner, { className: "rs-spinner--lg rs-text-accent" }),
|
|
1120
|
+
/* @__PURE__ */ jsxs5("div", { className: "rs-loading-text", children: [
|
|
1121
|
+
/* @__PURE__ */ jsx6("div", { className: "rs-loading-title", children: renderStateMessage() }),
|
|
1122
|
+
/* @__PURE__ */ jsx6("div", { className: "rs-loading-subtitle", children: "This may take a moment" })
|
|
1023
1123
|
] })
|
|
1024
1124
|
] }),
|
|
1025
|
-
isError && /* @__PURE__ */
|
|
1026
|
-
/* @__PURE__ */
|
|
1125
|
+
isError && /* @__PURE__ */ jsxs5(Fragment, { children: [
|
|
1126
|
+
/* @__PURE__ */ jsx6("div", { className: "rs-step-icon rs-step-icon--error", children: /* @__PURE__ */ jsx6(
|
|
1027
1127
|
"svg",
|
|
1028
1128
|
{
|
|
1029
1129
|
viewBox: "0 0 24 24",
|
|
1030
1130
|
fill: "none",
|
|
1031
1131
|
stroke: "currentColor",
|
|
1032
1132
|
strokeWidth: "2",
|
|
1033
|
-
children: /* @__PURE__ */
|
|
1133
|
+
children: /* @__PURE__ */ jsx6(
|
|
1034
1134
|
"path",
|
|
1035
1135
|
{
|
|
1036
1136
|
strokeLinecap: "round",
|
|
@@ -1040,9 +1140,9 @@ function SetupStep({
|
|
|
1040
1140
|
)
|
|
1041
1141
|
}
|
|
1042
1142
|
) }),
|
|
1043
|
-
/* @__PURE__ */
|
|
1044
|
-
/* @__PURE__ */
|
|
1045
|
-
/* @__PURE__ */
|
|
1143
|
+
/* @__PURE__ */ jsxs5("div", { className: "rs-loading-text", children: [
|
|
1144
|
+
/* @__PURE__ */ jsx6("div", { className: "rs-loading-title rs-text-error", children: "Setup failed" }),
|
|
1145
|
+
/* @__PURE__ */ jsx6(
|
|
1046
1146
|
"div",
|
|
1047
1147
|
{
|
|
1048
1148
|
className: "rs-loading-subtitle",
|
|
@@ -1053,7 +1153,7 @@ function SetupStep({
|
|
|
1053
1153
|
] })
|
|
1054
1154
|
] })
|
|
1055
1155
|
] }),
|
|
1056
|
-
isError && /* @__PURE__ */
|
|
1156
|
+
isError && /* @__PURE__ */ jsx6("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx6(Button, { onClick: handleRetry, variant: "default", fullWidth: true, children: "Try Again" }) })
|
|
1057
1157
|
] });
|
|
1058
1158
|
}
|
|
1059
1159
|
var init_SetupStep = __esm({
|
|
@@ -1067,17 +1167,17 @@ var init_SetupStep = __esm({
|
|
|
1067
1167
|
});
|
|
1068
1168
|
|
|
1069
1169
|
// src/components/ui/PoweredBy.tsx
|
|
1070
|
-
import { jsx as
|
|
1170
|
+
import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1071
1171
|
function PoweredBy() {
|
|
1072
|
-
return /* @__PURE__ */
|
|
1073
|
-
/* @__PURE__ */
|
|
1172
|
+
return /* @__PURE__ */ jsxs6("div", { className: "rs-powered-by", children: [
|
|
1173
|
+
/* @__PURE__ */ jsx7(
|
|
1074
1174
|
"svg",
|
|
1075
1175
|
{
|
|
1076
1176
|
viewBox: "0 0 24 24",
|
|
1077
1177
|
fill: "none",
|
|
1078
1178
|
stroke: "currentColor",
|
|
1079
1179
|
strokeWidth: "2",
|
|
1080
|
-
children: /* @__PURE__ */
|
|
1180
|
+
children: /* @__PURE__ */ jsx7(
|
|
1081
1181
|
"path",
|
|
1082
1182
|
{
|
|
1083
1183
|
strokeLinecap: "round",
|
|
@@ -1087,10 +1187,10 @@ function PoweredBy() {
|
|
|
1087
1187
|
)
|
|
1088
1188
|
}
|
|
1089
1189
|
),
|
|
1090
|
-
/* @__PURE__ */
|
|
1190
|
+
/* @__PURE__ */ jsxs6("span", { children: [
|
|
1091
1191
|
"Powered by",
|
|
1092
1192
|
" ",
|
|
1093
|
-
/* @__PURE__ */
|
|
1193
|
+
/* @__PURE__ */ jsx7(
|
|
1094
1194
|
"a",
|
|
1095
1195
|
{
|
|
1096
1196
|
href: "https://www.rhinestone.dev",
|
|
@@ -1372,7 +1472,7 @@ var init_formatters = __esm({
|
|
|
1372
1472
|
// src/components/steps/AssetSelectStep.tsx
|
|
1373
1473
|
import { useEffect as useEffect3, useMemo, useState as useState2 } from "react";
|
|
1374
1474
|
import { formatUnits } from "viem";
|
|
1375
|
-
import { jsx as
|
|
1475
|
+
import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1376
1476
|
function AssetSelectStep({
|
|
1377
1477
|
address,
|
|
1378
1478
|
publicClient,
|
|
@@ -1478,21 +1578,21 @@ function AssetSelectStep({
|
|
|
1478
1578
|
return asset.balance;
|
|
1479
1579
|
}
|
|
1480
1580
|
};
|
|
1481
|
-
return /* @__PURE__ */
|
|
1482
|
-
/* @__PURE__ */
|
|
1483
|
-
/* @__PURE__ */
|
|
1581
|
+
return /* @__PURE__ */ jsxs7("div", { className: "rs-step", children: [
|
|
1582
|
+
/* @__PURE__ */ jsx8("div", { style: { padding: "12px 12px 4px" }, children: /* @__PURE__ */ jsx8("div", { className: "rs-step-title", children: "Select source asset" }) }),
|
|
1583
|
+
/* @__PURE__ */ jsxs7(
|
|
1484
1584
|
"div",
|
|
1485
1585
|
{
|
|
1486
1586
|
className: "rs-step-body",
|
|
1487
1587
|
style: { paddingTop: 4, overflow: "auto", maxHeight: 340 },
|
|
1488
1588
|
children: [
|
|
1489
|
-
loading && /* @__PURE__ */
|
|
1490
|
-
/* @__PURE__ */
|
|
1491
|
-
/* @__PURE__ */
|
|
1589
|
+
loading && /* @__PURE__ */ jsxs7("div", { className: "rs-loading-state", style: { padding: "40px 12px" }, children: [
|
|
1590
|
+
/* @__PURE__ */ jsx8(Spinner, { className: "rs-text-tertiary" }),
|
|
1591
|
+
/* @__PURE__ */ jsx8("span", { className: "rs-text-sm rs-text-tertiary", children: "Loading balances" })
|
|
1492
1592
|
] }),
|
|
1493
|
-
error && /* @__PURE__ */
|
|
1494
|
-
!loading && !error && rows.length === 0 && /* @__PURE__ */
|
|
1495
|
-
/* @__PURE__ */
|
|
1593
|
+
error && /* @__PURE__ */ jsx8("div", { className: "rs-alert rs-alert--error", children: /* @__PURE__ */ jsx8("span", { className: "rs-alert-text", children: error }) }),
|
|
1594
|
+
!loading && !error && rows.length === 0 && /* @__PURE__ */ jsxs7("div", { className: "rs-empty-state", children: [
|
|
1595
|
+
/* @__PURE__ */ jsx8(
|
|
1496
1596
|
"svg",
|
|
1497
1597
|
{
|
|
1498
1598
|
className: "rs-empty-icon",
|
|
@@ -1500,7 +1600,7 @@ function AssetSelectStep({
|
|
|
1500
1600
|
fill: "none",
|
|
1501
1601
|
stroke: "currentColor",
|
|
1502
1602
|
strokeWidth: "1.5",
|
|
1503
|
-
children: /* @__PURE__ */
|
|
1603
|
+
children: /* @__PURE__ */ jsx8(
|
|
1504
1604
|
"path",
|
|
1505
1605
|
{
|
|
1506
1606
|
strokeLinecap: "round",
|
|
@@ -1510,20 +1610,20 @@ function AssetSelectStep({
|
|
|
1510
1610
|
)
|
|
1511
1611
|
}
|
|
1512
1612
|
),
|
|
1513
|
-
/* @__PURE__ */
|
|
1514
|
-
/* @__PURE__ */
|
|
1613
|
+
/* @__PURE__ */ jsx8("div", { className: "rs-empty-text", children: "No funds in connected wallet" }),
|
|
1614
|
+
/* @__PURE__ */ jsxs7("div", { className: "rs-empty-address", children: [
|
|
1515
1615
|
address.slice(0, 6),
|
|
1516
1616
|
"...",
|
|
1517
1617
|
address.slice(-4)
|
|
1518
1618
|
] })
|
|
1519
1619
|
] }),
|
|
1520
|
-
!loading && !error && rows.length > 0 && /* @__PURE__ */
|
|
1620
|
+
!loading && !error && rows.length > 0 && /* @__PURE__ */ jsx8("div", { className: "rs-asset-list", children: rows.map((asset) => {
|
|
1521
1621
|
const isSelected = selectedAssetId === asset.id;
|
|
1522
1622
|
const tokenAmount = formatBalance(asset);
|
|
1523
1623
|
const badge = getChainBadge(asset.chainId);
|
|
1524
1624
|
const tokenIcon = getTokenIcon(asset.symbol);
|
|
1525
1625
|
const chainIcon = getChainIcon(asset.chainId);
|
|
1526
|
-
return /* @__PURE__ */
|
|
1626
|
+
return /* @__PURE__ */ jsxs7(
|
|
1527
1627
|
"button",
|
|
1528
1628
|
{
|
|
1529
1629
|
type: "button",
|
|
@@ -1531,9 +1631,9 @@ function AssetSelectStep({
|
|
|
1531
1631
|
className: `rs-asset-row ${isSelected ? "rs-asset-row--selected" : ""}`,
|
|
1532
1632
|
style: { textAlign: "left" },
|
|
1533
1633
|
children: [
|
|
1534
|
-
/* @__PURE__ */
|
|
1535
|
-
/* @__PURE__ */
|
|
1536
|
-
tokenIcon ? /* @__PURE__ */
|
|
1634
|
+
/* @__PURE__ */ jsxs7("div", { className: "rs-asset-info", children: [
|
|
1635
|
+
/* @__PURE__ */ jsxs7("div", { className: "rs-asset-icon-wrapper", children: [
|
|
1636
|
+
tokenIcon ? /* @__PURE__ */ jsx8(
|
|
1537
1637
|
"img",
|
|
1538
1638
|
{
|
|
1539
1639
|
src: tokenIcon,
|
|
@@ -1541,15 +1641,15 @@ function AssetSelectStep({
|
|
|
1541
1641
|
className: "rs-asset-icon",
|
|
1542
1642
|
style: { background: "transparent" }
|
|
1543
1643
|
}
|
|
1544
|
-
) : /* @__PURE__ */
|
|
1545
|
-
chainIcon ? /* @__PURE__ */
|
|
1644
|
+
) : /* @__PURE__ */ jsx8("div", { className: "rs-asset-icon", children: asset.symbol.slice(0, 4) }),
|
|
1645
|
+
chainIcon ? /* @__PURE__ */ jsx8(
|
|
1546
1646
|
"img",
|
|
1547
1647
|
{
|
|
1548
1648
|
src: chainIcon,
|
|
1549
1649
|
alt: getChainName(asset.chainId),
|
|
1550
1650
|
className: "rs-asset-chain-badge"
|
|
1551
1651
|
}
|
|
1552
|
-
) : /* @__PURE__ */
|
|
1652
|
+
) : /* @__PURE__ */ jsx8(
|
|
1553
1653
|
"div",
|
|
1554
1654
|
{
|
|
1555
1655
|
className: "rs-asset-chain-badge",
|
|
@@ -1561,23 +1661,23 @@ function AssetSelectStep({
|
|
|
1561
1661
|
}
|
|
1562
1662
|
)
|
|
1563
1663
|
] }),
|
|
1564
|
-
/* @__PURE__ */
|
|
1565
|
-
/* @__PURE__ */
|
|
1664
|
+
/* @__PURE__ */ jsxs7("div", { children: [
|
|
1665
|
+
/* @__PURE__ */ jsxs7("div", { className: "rs-asset-name", children: [
|
|
1566
1666
|
asset.symbol,
|
|
1567
|
-
/* @__PURE__ */
|
|
1667
|
+
/* @__PURE__ */ jsxs7("span", { className: "rs-asset-chain", children: [
|
|
1568
1668
|
" ",
|
|
1569
1669
|
"on ",
|
|
1570
1670
|
getChainName(asset.chainId)
|
|
1571
1671
|
] })
|
|
1572
1672
|
] }),
|
|
1573
|
-
/* @__PURE__ */
|
|
1673
|
+
/* @__PURE__ */ jsxs7("div", { className: "rs-asset-balance-small", children: [
|
|
1574
1674
|
tokenAmount,
|
|
1575
1675
|
" ",
|
|
1576
1676
|
asset.symbol
|
|
1577
1677
|
] })
|
|
1578
1678
|
] })
|
|
1579
1679
|
] }),
|
|
1580
|
-
/* @__PURE__ */
|
|
1680
|
+
/* @__PURE__ */ jsx8("div", { className: "rs-asset-balance", children: asset.balanceUsd !== void 0 ? currencyFormatter.format(asset.balanceUsd) : tokenAmount !== "--" ? `${tokenAmount} ${asset.symbol}` : "--" })
|
|
1581
1681
|
]
|
|
1582
1682
|
},
|
|
1583
1683
|
asset.id
|
|
@@ -1586,7 +1686,7 @@ function AssetSelectStep({
|
|
|
1586
1686
|
]
|
|
1587
1687
|
}
|
|
1588
1688
|
),
|
|
1589
|
-
/* @__PURE__ */
|
|
1689
|
+
/* @__PURE__ */ jsx8("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx8(
|
|
1590
1690
|
Button,
|
|
1591
1691
|
{
|
|
1592
1692
|
onClick: () => selectedAsset && onContinue(selectedAsset),
|
|
@@ -1595,7 +1695,7 @@ function AssetSelectStep({
|
|
|
1595
1695
|
children: "Continue"
|
|
1596
1696
|
}
|
|
1597
1697
|
) }),
|
|
1598
|
-
/* @__PURE__ */
|
|
1698
|
+
/* @__PURE__ */ jsx8(PoweredBy, {})
|
|
1599
1699
|
] });
|
|
1600
1700
|
}
|
|
1601
1701
|
async function fetchNativeAssets(address, publicClient, existing) {
|
|
@@ -1651,7 +1751,7 @@ var init_AssetSelectStep = __esm({
|
|
|
1651
1751
|
// src/components/steps/AmountStep.tsx
|
|
1652
1752
|
import { useEffect as useEffect4, useMemo as useMemo2, useState as useState3, useRef as useRef3 } from "react";
|
|
1653
1753
|
import { erc20Abi, formatUnits as formatUnits2, parseUnits } from "viem";
|
|
1654
|
-
import { jsx as
|
|
1754
|
+
import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1655
1755
|
function AmountStep({
|
|
1656
1756
|
walletClient,
|
|
1657
1757
|
publicClient,
|
|
@@ -1822,10 +1922,10 @@ function AmountStep({
|
|
|
1822
1922
|
setIsSwitching(false);
|
|
1823
1923
|
}
|
|
1824
1924
|
};
|
|
1825
|
-
return /* @__PURE__ */
|
|
1826
|
-
/* @__PURE__ */
|
|
1827
|
-
/* @__PURE__ */
|
|
1828
|
-
/* @__PURE__ */
|
|
1925
|
+
return /* @__PURE__ */ jsxs8("div", { className: "rs-step", children: [
|
|
1926
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-step-body", style: { paddingTop: 0 }, children: [
|
|
1927
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-amount-display", children: [
|
|
1928
|
+
/* @__PURE__ */ jsx9("div", { className: "rs-amount-input-wrapper", children: /* @__PURE__ */ jsx9(
|
|
1829
1929
|
"input",
|
|
1830
1930
|
{
|
|
1831
1931
|
type: "text",
|
|
@@ -1843,17 +1943,17 @@ function AmountStep({
|
|
|
1843
1943
|
autoFocus: true
|
|
1844
1944
|
}
|
|
1845
1945
|
) }),
|
|
1846
|
-
/* @__PURE__ */
|
|
1946
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-amount-token-value", children: [
|
|
1847
1947
|
formattedTokenAmount,
|
|
1848
1948
|
" ",
|
|
1849
1949
|
asset.symbol
|
|
1850
1950
|
] }),
|
|
1851
|
-
/* @__PURE__ */
|
|
1951
|
+
/* @__PURE__ */ jsx9("div", { className: "rs-amount-available", children: /* @__PURE__ */ jsxs8("span", { className: "rs-amount-available-value", children: [
|
|
1852
1952
|
formattedBalance,
|
|
1853
1953
|
" ",
|
|
1854
1954
|
asset.symbol,
|
|
1855
1955
|
" available",
|
|
1856
|
-
balanceUsd !== null && /* @__PURE__ */
|
|
1956
|
+
balanceUsd !== null && /* @__PURE__ */ jsxs8("span", { style: { color: "var(--rs-muted-foreground)" }, children: [
|
|
1857
1957
|
" ",
|
|
1858
1958
|
"(",
|
|
1859
1959
|
currencyFormatter.format(balanceUsd),
|
|
@@ -1861,16 +1961,16 @@ function AmountStep({
|
|
|
1861
1961
|
] })
|
|
1862
1962
|
] }) })
|
|
1863
1963
|
] }),
|
|
1864
|
-
/* @__PURE__ */
|
|
1964
|
+
/* @__PURE__ */ jsx9(
|
|
1865
1965
|
"div",
|
|
1866
1966
|
{
|
|
1867
1967
|
style: { display: "flex", justifyContent: "center", marginTop: 16 },
|
|
1868
|
-
children: /* @__PURE__ */
|
|
1869
|
-
/* @__PURE__ */
|
|
1870
|
-
/* @__PURE__ */
|
|
1871
|
-
/* @__PURE__ */
|
|
1872
|
-
/* @__PURE__ */
|
|
1873
|
-
/* @__PURE__ */
|
|
1968
|
+
children: /* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill", children: [
|
|
1969
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill-side", children: [
|
|
1970
|
+
/* @__PURE__ */ jsx9("span", { className: "rs-flow-pill-label", children: "You send" }),
|
|
1971
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill-token", children: [
|
|
1972
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill-token-icon-wrapper", children: [
|
|
1973
|
+
/* @__PURE__ */ jsx9("div", { className: "rs-flow-pill-token-icon", children: getTokenIcon(asset.symbol) ? /* @__PURE__ */ jsx9(
|
|
1874
1974
|
"img",
|
|
1875
1975
|
{
|
|
1876
1976
|
src: getTokenIcon(asset.symbol),
|
|
@@ -1880,7 +1980,7 @@ function AmountStep({
|
|
|
1880
1980
|
(() => {
|
|
1881
1981
|
const chainIcon = getChainIcon(asset.chainId);
|
|
1882
1982
|
if (chainIcon) {
|
|
1883
|
-
return /* @__PURE__ */
|
|
1983
|
+
return /* @__PURE__ */ jsx9(
|
|
1884
1984
|
"img",
|
|
1885
1985
|
{
|
|
1886
1986
|
src: chainIcon,
|
|
@@ -1890,7 +1990,7 @@ function AmountStep({
|
|
|
1890
1990
|
);
|
|
1891
1991
|
}
|
|
1892
1992
|
const badge = getChainBadge(asset.chainId);
|
|
1893
|
-
return /* @__PURE__ */
|
|
1993
|
+
return /* @__PURE__ */ jsx9(
|
|
1894
1994
|
"div",
|
|
1895
1995
|
{
|
|
1896
1996
|
className: "rs-flow-pill-chain-badge",
|
|
@@ -1903,17 +2003,17 @@ function AmountStep({
|
|
|
1903
2003
|
);
|
|
1904
2004
|
})()
|
|
1905
2005
|
] }),
|
|
1906
|
-
/* @__PURE__ */
|
|
2006
|
+
/* @__PURE__ */ jsx9("span", { className: "rs-flow-pill-token-symbol", children: asset.symbol })
|
|
1907
2007
|
] })
|
|
1908
2008
|
] }),
|
|
1909
|
-
/* @__PURE__ */
|
|
2009
|
+
/* @__PURE__ */ jsx9("div", { className: "rs-flow-pill-arrow", children: /* @__PURE__ */ jsx9(
|
|
1910
2010
|
"svg",
|
|
1911
2011
|
{
|
|
1912
2012
|
viewBox: "0 0 24 24",
|
|
1913
2013
|
fill: "none",
|
|
1914
2014
|
stroke: "currentColor",
|
|
1915
2015
|
strokeWidth: "2",
|
|
1916
|
-
children: /* @__PURE__ */
|
|
2016
|
+
children: /* @__PURE__ */ jsx9(
|
|
1917
2017
|
"path",
|
|
1918
2018
|
{
|
|
1919
2019
|
strokeLinecap: "round",
|
|
@@ -1923,11 +2023,11 @@ function AmountStep({
|
|
|
1923
2023
|
)
|
|
1924
2024
|
}
|
|
1925
2025
|
) }),
|
|
1926
|
-
/* @__PURE__ */
|
|
1927
|
-
/* @__PURE__ */
|
|
1928
|
-
/* @__PURE__ */
|
|
1929
|
-
/* @__PURE__ */
|
|
1930
|
-
/* @__PURE__ */
|
|
2026
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill-side", children: [
|
|
2027
|
+
/* @__PURE__ */ jsx9("span", { className: "rs-flow-pill-label", children: "You receive" }),
|
|
2028
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill-token", children: [
|
|
2029
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-flow-pill-token-icon-wrapper", children: [
|
|
2030
|
+
/* @__PURE__ */ jsx9("div", { className: "rs-flow-pill-token-icon", children: getTokenIcon(targetSymbol) ? /* @__PURE__ */ jsx9(
|
|
1931
2031
|
"img",
|
|
1932
2032
|
{
|
|
1933
2033
|
src: getTokenIcon(targetSymbol),
|
|
@@ -1937,7 +2037,7 @@ function AmountStep({
|
|
|
1937
2037
|
(() => {
|
|
1938
2038
|
const chainIcon = getChainIcon(targetChain);
|
|
1939
2039
|
if (chainIcon) {
|
|
1940
|
-
return /* @__PURE__ */
|
|
2040
|
+
return /* @__PURE__ */ jsx9(
|
|
1941
2041
|
"img",
|
|
1942
2042
|
{
|
|
1943
2043
|
src: chainIcon,
|
|
@@ -1947,7 +2047,7 @@ function AmountStep({
|
|
|
1947
2047
|
);
|
|
1948
2048
|
}
|
|
1949
2049
|
const badge = getChainBadge(targetChain);
|
|
1950
|
-
return /* @__PURE__ */
|
|
2050
|
+
return /* @__PURE__ */ jsx9(
|
|
1951
2051
|
"div",
|
|
1952
2052
|
{
|
|
1953
2053
|
className: "rs-flow-pill-chain-badge",
|
|
@@ -1960,14 +2060,14 @@ function AmountStep({
|
|
|
1960
2060
|
);
|
|
1961
2061
|
})()
|
|
1962
2062
|
] }),
|
|
1963
|
-
/* @__PURE__ */
|
|
2063
|
+
/* @__PURE__ */ jsx9("span", { className: "rs-flow-pill-token-symbol", children: targetSymbol })
|
|
1964
2064
|
] })
|
|
1965
2065
|
] })
|
|
1966
2066
|
] })
|
|
1967
2067
|
}
|
|
1968
2068
|
),
|
|
1969
|
-
/* @__PURE__ */
|
|
1970
|
-
[25, 50, 75].map((pct) => /* @__PURE__ */
|
|
2069
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-amount-presets", children: [
|
|
2070
|
+
[25, 50, 75].map((pct) => /* @__PURE__ */ jsxs8(
|
|
1971
2071
|
"button",
|
|
1972
2072
|
{
|
|
1973
2073
|
type: "button",
|
|
@@ -1981,7 +2081,7 @@ function AmountStep({
|
|
|
1981
2081
|
},
|
|
1982
2082
|
pct
|
|
1983
2083
|
)),
|
|
1984
|
-
/* @__PURE__ */
|
|
2084
|
+
/* @__PURE__ */ jsx9(
|
|
1985
2085
|
"button",
|
|
1986
2086
|
{
|
|
1987
2087
|
type: "button",
|
|
@@ -1992,13 +2092,13 @@ function AmountStep({
|
|
|
1992
2092
|
}
|
|
1993
2093
|
)
|
|
1994
2094
|
] }),
|
|
1995
|
-
chainMismatch && /* @__PURE__ */
|
|
1996
|
-
/* @__PURE__ */
|
|
2095
|
+
chainMismatch && /* @__PURE__ */ jsxs8("div", { className: "rs-chain-switch", style: { marginTop: 16 }, children: [
|
|
2096
|
+
/* @__PURE__ */ jsxs8("div", { className: "rs-chain-switch-text", children: [
|
|
1997
2097
|
"Switch your wallet to ",
|
|
1998
2098
|
getChainName(asset.chainId),
|
|
1999
2099
|
" to continue."
|
|
2000
2100
|
] }),
|
|
2001
|
-
switchChain && /* @__PURE__ */
|
|
2101
|
+
switchChain && /* @__PURE__ */ jsx9(
|
|
2002
2102
|
Button,
|
|
2003
2103
|
{
|
|
2004
2104
|
variant: "outline",
|
|
@@ -2009,8 +2109,8 @@ function AmountStep({
|
|
|
2009
2109
|
}
|
|
2010
2110
|
)
|
|
2011
2111
|
] }),
|
|
2012
|
-
error && /* @__PURE__ */
|
|
2013
|
-
/* @__PURE__ */
|
|
2112
|
+
error && /* @__PURE__ */ jsxs8("div", { className: "rs-amount-error", children: [
|
|
2113
|
+
/* @__PURE__ */ jsx9(
|
|
2014
2114
|
"svg",
|
|
2015
2115
|
{
|
|
2016
2116
|
viewBox: "0 0 24 24",
|
|
@@ -2018,7 +2118,7 @@ function AmountStep({
|
|
|
2018
2118
|
stroke: "currentColor",
|
|
2019
2119
|
strokeWidth: "2",
|
|
2020
2120
|
style: { width: 16, height: 16, flexShrink: 0 },
|
|
2021
|
-
children: /* @__PURE__ */
|
|
2121
|
+
children: /* @__PURE__ */ jsx9(
|
|
2022
2122
|
"path",
|
|
2023
2123
|
{
|
|
2024
2124
|
strokeLinecap: "round",
|
|
@@ -2028,10 +2128,10 @@ function AmountStep({
|
|
|
2028
2128
|
)
|
|
2029
2129
|
}
|
|
2030
2130
|
),
|
|
2031
|
-
/* @__PURE__ */
|
|
2131
|
+
/* @__PURE__ */ jsx9("span", { children: error })
|
|
2032
2132
|
] })
|
|
2033
2133
|
] }),
|
|
2034
|
-
/* @__PURE__ */
|
|
2134
|
+
/* @__PURE__ */ jsx9("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx9(
|
|
2035
2135
|
Button,
|
|
2036
2136
|
{
|
|
2037
2137
|
onClick: handleContinue,
|
|
@@ -2040,7 +2140,7 @@ function AmountStep({
|
|
|
2040
2140
|
children: "Continue"
|
|
2041
2141
|
}
|
|
2042
2142
|
) }),
|
|
2043
|
-
/* @__PURE__ */
|
|
2143
|
+
/* @__PURE__ */ jsx9(PoweredBy, {})
|
|
2044
2144
|
] });
|
|
2045
2145
|
}
|
|
2046
2146
|
var init_AmountStep = __esm({
|
|
@@ -2057,7 +2157,7 @@ var init_AmountStep = __esm({
|
|
|
2057
2157
|
// src/components/steps/ConfirmStep.tsx
|
|
2058
2158
|
import { useMemo as useMemo3, useState as useState4 } from "react";
|
|
2059
2159
|
import { erc20Abi as erc20Abi2, formatUnits as formatUnits3, parseUnits as parseUnits2 } from "viem";
|
|
2060
|
-
import { jsx as
|
|
2160
|
+
import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
2061
2161
|
function ConfirmStep({
|
|
2062
2162
|
walletClient,
|
|
2063
2163
|
address,
|
|
@@ -2192,19 +2292,19 @@ function ConfirmStep({
|
|
|
2192
2292
|
setIsSwitching(false);
|
|
2193
2293
|
}
|
|
2194
2294
|
};
|
|
2195
|
-
return /* @__PURE__ */
|
|
2196
|
-
/* @__PURE__ */
|
|
2197
|
-
/* @__PURE__ */
|
|
2198
|
-
/* @__PURE__ */
|
|
2199
|
-
/* @__PURE__ */
|
|
2200
|
-
/* @__PURE__ */
|
|
2201
|
-
/* @__PURE__ */
|
|
2295
|
+
return /* @__PURE__ */ jsxs9("div", { className: "rs-step", children: [
|
|
2296
|
+
/* @__PURE__ */ jsx10("div", { style: { padding: "12px 12px 10px" }, children: /* @__PURE__ */ jsx10("div", { className: "rs-step-title", children: "Review order" }) }),
|
|
2297
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-step-body rs-space-y-3", style: { paddingTop: 0 }, children: [
|
|
2298
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card", children: [
|
|
2299
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card-row", children: [
|
|
2300
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-label", children: "Source" }),
|
|
2301
|
+
/* @__PURE__ */ jsxs9(
|
|
2202
2302
|
"span",
|
|
2203
2303
|
{
|
|
2204
2304
|
className: "rs-card-value",
|
|
2205
2305
|
style: { display: "flex", alignItems: "center", gap: 8 },
|
|
2206
2306
|
children: [
|
|
2207
|
-
getChainIcon(asset.chainId) && /* @__PURE__ */
|
|
2307
|
+
getChainIcon(asset.chainId) && /* @__PURE__ */ jsx10(
|
|
2208
2308
|
"img",
|
|
2209
2309
|
{
|
|
2210
2310
|
src: getChainIcon(asset.chainId),
|
|
@@ -2217,15 +2317,15 @@ function ConfirmStep({
|
|
|
2217
2317
|
}
|
|
2218
2318
|
)
|
|
2219
2319
|
] }),
|
|
2220
|
-
/* @__PURE__ */
|
|
2221
|
-
/* @__PURE__ */
|
|
2222
|
-
/* @__PURE__ */
|
|
2320
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card-row", children: [
|
|
2321
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-label", children: "Destination" }),
|
|
2322
|
+
/* @__PURE__ */ jsxs9(
|
|
2223
2323
|
"span",
|
|
2224
2324
|
{
|
|
2225
2325
|
className: "rs-card-value",
|
|
2226
2326
|
style: { display: "flex", alignItems: "center", gap: 8 },
|
|
2227
2327
|
children: [
|
|
2228
|
-
getChainIcon(targetChain) && /* @__PURE__ */
|
|
2328
|
+
getChainIcon(targetChain) && /* @__PURE__ */ jsx10(
|
|
2229
2329
|
"img",
|
|
2230
2330
|
{
|
|
2231
2331
|
src: getChainIcon(targetChain),
|
|
@@ -2238,21 +2338,21 @@ function ConfirmStep({
|
|
|
2238
2338
|
}
|
|
2239
2339
|
)
|
|
2240
2340
|
] }),
|
|
2241
|
-
/* @__PURE__ */
|
|
2242
|
-
/* @__PURE__ */
|
|
2243
|
-
/* @__PURE__ */
|
|
2341
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card-row", children: [
|
|
2342
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-label", children: "Estimated time" }),
|
|
2343
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-value", children: "< 1 min" })
|
|
2244
2344
|
] })
|
|
2245
2345
|
] }),
|
|
2246
|
-
/* @__PURE__ */
|
|
2247
|
-
/* @__PURE__ */
|
|
2248
|
-
/* @__PURE__ */
|
|
2249
|
-
/* @__PURE__ */
|
|
2346
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card", children: [
|
|
2347
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card-row", children: [
|
|
2348
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-label", children: "You send" }),
|
|
2349
|
+
/* @__PURE__ */ jsxs9(
|
|
2250
2350
|
"span",
|
|
2251
2351
|
{
|
|
2252
2352
|
className: "rs-card-value",
|
|
2253
2353
|
style: { display: "flex", alignItems: "center", gap: 6 },
|
|
2254
2354
|
children: [
|
|
2255
|
-
getTokenIcon(asset.symbol) && /* @__PURE__ */
|
|
2355
|
+
getTokenIcon(asset.symbol) && /* @__PURE__ */ jsx10(
|
|
2256
2356
|
"img",
|
|
2257
2357
|
{
|
|
2258
2358
|
src: getTokenIcon(asset.symbol),
|
|
@@ -2267,15 +2367,15 @@ function ConfirmStep({
|
|
|
2267
2367
|
}
|
|
2268
2368
|
)
|
|
2269
2369
|
] }),
|
|
2270
|
-
/* @__PURE__ */
|
|
2271
|
-
/* @__PURE__ */
|
|
2272
|
-
/* @__PURE__ */
|
|
2370
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-card-row", children: [
|
|
2371
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-label", children: "You receive" }),
|
|
2372
|
+
/* @__PURE__ */ jsxs9(
|
|
2273
2373
|
"span",
|
|
2274
2374
|
{
|
|
2275
2375
|
className: "rs-card-value",
|
|
2276
2376
|
style: { display: "flex", alignItems: "center", gap: 6 },
|
|
2277
2377
|
children: [
|
|
2278
|
-
getTokenIcon(targetSymbol) && /* @__PURE__ */
|
|
2378
|
+
getTokenIcon(targetSymbol) && /* @__PURE__ */ jsx10(
|
|
2279
2379
|
"img",
|
|
2280
2380
|
{
|
|
2281
2381
|
src: getTokenIcon(targetSymbol),
|
|
@@ -2290,18 +2390,18 @@ function ConfirmStep({
|
|
|
2290
2390
|
}
|
|
2291
2391
|
)
|
|
2292
2392
|
] }),
|
|
2293
|
-
receiveAmountUsd !== null && /* @__PURE__ */
|
|
2294
|
-
/* @__PURE__ */
|
|
2295
|
-
/* @__PURE__ */
|
|
2393
|
+
receiveAmountUsd !== null && /* @__PURE__ */ jsxs9("div", { className: "rs-card-row", children: [
|
|
2394
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-label", children: "Value" }),
|
|
2395
|
+
/* @__PURE__ */ jsx10("span", { className: "rs-card-value", children: currencyFormatter.format(receiveAmountUsd) })
|
|
2296
2396
|
] })
|
|
2297
2397
|
] }),
|
|
2298
|
-
chainMismatch && /* @__PURE__ */
|
|
2299
|
-
/* @__PURE__ */
|
|
2398
|
+
chainMismatch && /* @__PURE__ */ jsxs9("div", { className: "rs-chain-switch", children: [
|
|
2399
|
+
/* @__PURE__ */ jsxs9("div", { className: "rs-chain-switch-text", children: [
|
|
2300
2400
|
"Switch your wallet to ",
|
|
2301
2401
|
getChainName(asset.chainId),
|
|
2302
2402
|
" to sign."
|
|
2303
2403
|
] }),
|
|
2304
|
-
switchChain && /* @__PURE__ */
|
|
2404
|
+
switchChain && /* @__PURE__ */ jsx10(
|
|
2305
2405
|
Button,
|
|
2306
2406
|
{
|
|
2307
2407
|
variant: "outline",
|
|
@@ -2312,8 +2412,8 @@ function ConfirmStep({
|
|
|
2312
2412
|
}
|
|
2313
2413
|
)
|
|
2314
2414
|
] }),
|
|
2315
|
-
error && /* @__PURE__ */
|
|
2316
|
-
/* @__PURE__ */
|
|
2415
|
+
error && /* @__PURE__ */ jsxs9("div", { className: "rs-alert rs-alert--error", children: [
|
|
2416
|
+
/* @__PURE__ */ jsx10(
|
|
2317
2417
|
"svg",
|
|
2318
2418
|
{
|
|
2319
2419
|
className: "rs-alert-icon",
|
|
@@ -2321,7 +2421,7 @@ function ConfirmStep({
|
|
|
2321
2421
|
fill: "none",
|
|
2322
2422
|
stroke: "currentColor",
|
|
2323
2423
|
strokeWidth: "2",
|
|
2324
|
-
children: /* @__PURE__ */
|
|
2424
|
+
children: /* @__PURE__ */ jsx10(
|
|
2325
2425
|
"path",
|
|
2326
2426
|
{
|
|
2327
2427
|
strokeLinecap: "round",
|
|
@@ -2331,7 +2431,7 @@ function ConfirmStep({
|
|
|
2331
2431
|
)
|
|
2332
2432
|
}
|
|
2333
2433
|
),
|
|
2334
|
-
/* @__PURE__ */
|
|
2434
|
+
/* @__PURE__ */ jsx10(
|
|
2335
2435
|
"span",
|
|
2336
2436
|
{
|
|
2337
2437
|
className: "rs-alert-text",
|
|
@@ -2346,7 +2446,7 @@ function ConfirmStep({
|
|
|
2346
2446
|
)
|
|
2347
2447
|
] })
|
|
2348
2448
|
] }),
|
|
2349
|
-
/* @__PURE__ */
|
|
2449
|
+
/* @__PURE__ */ jsx10("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx10(
|
|
2350
2450
|
Button,
|
|
2351
2451
|
{
|
|
2352
2452
|
onClick: handleConfirm,
|
|
@@ -2356,7 +2456,7 @@ function ConfirmStep({
|
|
|
2356
2456
|
children: "Confirm Order"
|
|
2357
2457
|
}
|
|
2358
2458
|
) }),
|
|
2359
|
-
/* @__PURE__ */
|
|
2459
|
+
/* @__PURE__ */ jsx10(PoweredBy, {})
|
|
2360
2460
|
] });
|
|
2361
2461
|
}
|
|
2362
2462
|
var STABLECOIN_SYMBOLS;
|
|
@@ -2406,7 +2506,7 @@ var init_webhook = __esm({
|
|
|
2406
2506
|
// src/components/steps/ProcessingStep.tsx
|
|
2407
2507
|
import { useState as useState5, useEffect as useEffect5, useRef as useRef4 } from "react";
|
|
2408
2508
|
import { formatUnits as formatUnits4 } from "viem";
|
|
2409
|
-
import { Fragment as Fragment2, jsx as
|
|
2509
|
+
import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
2410
2510
|
function isEventForTx(event, txHash) {
|
|
2411
2511
|
const eventTxHash = getEventTxHash(event);
|
|
2412
2512
|
if (!eventTxHash) return false;
|
|
@@ -2603,17 +2703,17 @@ function ProcessingStep({
|
|
|
2603
2703
|
}
|
|
2604
2704
|
})();
|
|
2605
2705
|
if (isComplete) {
|
|
2606
|
-
return /* @__PURE__ */
|
|
2607
|
-
/* @__PURE__ */
|
|
2608
|
-
/* @__PURE__ */
|
|
2609
|
-
/* @__PURE__ */
|
|
2706
|
+
return /* @__PURE__ */ jsxs10("div", { className: "rs-step", children: [
|
|
2707
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-step-body rs-space-y-3", children: [
|
|
2708
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-success-state", children: [
|
|
2709
|
+
/* @__PURE__ */ jsx11("div", { className: "rs-success-checkmark", children: /* @__PURE__ */ jsx11(
|
|
2610
2710
|
"svg",
|
|
2611
2711
|
{
|
|
2612
2712
|
viewBox: "0 0 24 24",
|
|
2613
2713
|
fill: "none",
|
|
2614
2714
|
stroke: "currentColor",
|
|
2615
2715
|
strokeWidth: "2.5",
|
|
2616
|
-
children: /* @__PURE__ */
|
|
2716
|
+
children: /* @__PURE__ */ jsx11(
|
|
2617
2717
|
"path",
|
|
2618
2718
|
{
|
|
2619
2719
|
strokeLinecap: "round",
|
|
@@ -2623,13 +2723,13 @@ function ProcessingStep({
|
|
|
2623
2723
|
)
|
|
2624
2724
|
}
|
|
2625
2725
|
) }),
|
|
2626
|
-
/* @__PURE__ */
|
|
2627
|
-
/* @__PURE__ */
|
|
2726
|
+
/* @__PURE__ */ jsx11("div", { className: "rs-success-title", children: isEarlyComplete ? `${flowCapitalized} confirmed` : `${flowCapitalized} successful` }),
|
|
2727
|
+
/* @__PURE__ */ jsx11("div", { className: "rs-success-subtitle", children: isEarlyComplete ? "Your transfer has been confirmed and funds will arrive shortly." : `Your funds have been successfully bridged.` })
|
|
2628
2728
|
] }),
|
|
2629
|
-
/* @__PURE__ */
|
|
2630
|
-
/* @__PURE__ */
|
|
2631
|
-
/* @__PURE__ */
|
|
2632
|
-
/* @__PURE__ */
|
|
2729
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card", children: [
|
|
2730
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2731
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Status" }),
|
|
2732
|
+
/* @__PURE__ */ jsx11(
|
|
2633
2733
|
"span",
|
|
2634
2734
|
{
|
|
2635
2735
|
className: "rs-card-value",
|
|
@@ -2638,29 +2738,29 @@ function ProcessingStep({
|
|
|
2638
2738
|
}
|
|
2639
2739
|
)
|
|
2640
2740
|
] }),
|
|
2641
|
-
/* @__PURE__ */
|
|
2642
|
-
/* @__PURE__ */
|
|
2643
|
-
/* @__PURE__ */
|
|
2741
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2742
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Total time" }),
|
|
2743
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-value", children: formatElapsedTime(elapsedSeconds) })
|
|
2644
2744
|
] }),
|
|
2645
|
-
/* @__PURE__ */
|
|
2646
|
-
/* @__PURE__ */
|
|
2647
|
-
/* @__PURE__ */
|
|
2745
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2746
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "You received" }),
|
|
2747
|
+
/* @__PURE__ */ jsxs10("span", { className: "rs-card-value", children: [
|
|
2648
2748
|
formattedReceivedAmount,
|
|
2649
2749
|
" ",
|
|
2650
2750
|
targetSymbol
|
|
2651
2751
|
] })
|
|
2652
2752
|
] })
|
|
2653
2753
|
] }),
|
|
2654
|
-
/* @__PURE__ */
|
|
2655
|
-
/* @__PURE__ */
|
|
2656
|
-
/* @__PURE__ */
|
|
2657
|
-
/* @__PURE__ */
|
|
2754
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card", children: [
|
|
2755
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2756
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Source" }),
|
|
2757
|
+
/* @__PURE__ */ jsxs10(
|
|
2658
2758
|
"span",
|
|
2659
2759
|
{
|
|
2660
2760
|
className: "rs-card-value",
|
|
2661
2761
|
style: { display: "flex", alignItems: "center", gap: 6 },
|
|
2662
2762
|
children: [
|
|
2663
|
-
getChainIcon(sourceChain) && /* @__PURE__ */
|
|
2763
|
+
getChainIcon(sourceChain) && /* @__PURE__ */ jsx11(
|
|
2664
2764
|
"img",
|
|
2665
2765
|
{
|
|
2666
2766
|
src: getChainIcon(sourceChain),
|
|
@@ -2673,15 +2773,15 @@ function ProcessingStep({
|
|
|
2673
2773
|
}
|
|
2674
2774
|
)
|
|
2675
2775
|
] }),
|
|
2676
|
-
/* @__PURE__ */
|
|
2677
|
-
/* @__PURE__ */
|
|
2678
|
-
/* @__PURE__ */
|
|
2776
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2777
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Destination" }),
|
|
2778
|
+
/* @__PURE__ */ jsxs10(
|
|
2679
2779
|
"span",
|
|
2680
2780
|
{
|
|
2681
2781
|
className: "rs-card-value",
|
|
2682
2782
|
style: { display: "flex", alignItems: "center", gap: 6 },
|
|
2683
2783
|
children: [
|
|
2684
|
-
getChainIcon(targetChain) && /* @__PURE__ */
|
|
2784
|
+
getChainIcon(targetChain) && /* @__PURE__ */ jsx11(
|
|
2685
2785
|
"img",
|
|
2686
2786
|
{
|
|
2687
2787
|
src: getChainIcon(targetChain),
|
|
@@ -2694,9 +2794,9 @@ function ProcessingStep({
|
|
|
2694
2794
|
}
|
|
2695
2795
|
)
|
|
2696
2796
|
] }),
|
|
2697
|
-
sourceExplorerUrl && /* @__PURE__ */
|
|
2698
|
-
/* @__PURE__ */
|
|
2699
|
-
/* @__PURE__ */
|
|
2797
|
+
sourceExplorerUrl && /* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2798
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Transaction" }),
|
|
2799
|
+
/* @__PURE__ */ jsxs10(
|
|
2700
2800
|
"a",
|
|
2701
2801
|
{
|
|
2702
2802
|
href: sourceExplorerUrl,
|
|
@@ -2705,7 +2805,7 @@ function ProcessingStep({
|
|
|
2705
2805
|
className: "rs-link rs-link-external rs-font-mono rs-text-xs",
|
|
2706
2806
|
children: [
|
|
2707
2807
|
truncateHash(txHash),
|
|
2708
|
-
/* @__PURE__ */
|
|
2808
|
+
/* @__PURE__ */ jsx11(
|
|
2709
2809
|
"svg",
|
|
2710
2810
|
{
|
|
2711
2811
|
viewBox: "0 0 24 24",
|
|
@@ -2713,7 +2813,7 @@ function ProcessingStep({
|
|
|
2713
2813
|
stroke: "currentColor",
|
|
2714
2814
|
strokeWidth: "2.5",
|
|
2715
2815
|
style: { width: 12, height: 12 },
|
|
2716
|
-
children: /* @__PURE__ */
|
|
2816
|
+
children: /* @__PURE__ */ jsx11(
|
|
2717
2817
|
"path",
|
|
2718
2818
|
{
|
|
2719
2819
|
strokeLinecap: "round",
|
|
@@ -2727,9 +2827,9 @@ function ProcessingStep({
|
|
|
2727
2827
|
}
|
|
2728
2828
|
)
|
|
2729
2829
|
] }),
|
|
2730
|
-
destinationTxHash && destExplorerUrl && /* @__PURE__ */
|
|
2731
|
-
/* @__PURE__ */
|
|
2732
|
-
/* @__PURE__ */
|
|
2830
|
+
destinationTxHash && destExplorerUrl && /* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2831
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Destination tx" }),
|
|
2832
|
+
/* @__PURE__ */ jsxs10(
|
|
2733
2833
|
"a",
|
|
2734
2834
|
{
|
|
2735
2835
|
href: destExplorerUrl,
|
|
@@ -2738,7 +2838,7 @@ function ProcessingStep({
|
|
|
2738
2838
|
className: "rs-link rs-link-external rs-font-mono rs-text-xs",
|
|
2739
2839
|
children: [
|
|
2740
2840
|
truncateHash(destinationTxHash),
|
|
2741
|
-
/* @__PURE__ */
|
|
2841
|
+
/* @__PURE__ */ jsx11(
|
|
2742
2842
|
"svg",
|
|
2743
2843
|
{
|
|
2744
2844
|
viewBox: "0 0 24 24",
|
|
@@ -2746,7 +2846,7 @@ function ProcessingStep({
|
|
|
2746
2846
|
stroke: "currentColor",
|
|
2747
2847
|
strokeWidth: "2.5",
|
|
2748
2848
|
style: { width: 12, height: 12 },
|
|
2749
|
-
children: /* @__PURE__ */
|
|
2849
|
+
children: /* @__PURE__ */ jsx11(
|
|
2750
2850
|
"path",
|
|
2751
2851
|
{
|
|
2752
2852
|
strokeLinecap: "round",
|
|
@@ -2762,31 +2862,31 @@ function ProcessingStep({
|
|
|
2762
2862
|
] })
|
|
2763
2863
|
] })
|
|
2764
2864
|
] }),
|
|
2765
|
-
/* @__PURE__ */
|
|
2766
|
-
/* @__PURE__ */
|
|
2767
|
-
/* @__PURE__ */
|
|
2865
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-step-footer", style: { gap: 8, display: "flex" }, children: [
|
|
2866
|
+
/* @__PURE__ */ jsx11(Button, { variant: "outline", onClick: onClose, fullWidth: true, children: "Close" }),
|
|
2867
|
+
/* @__PURE__ */ jsxs10(Button, { onClick: onNewDeposit, fullWidth: true, children: [
|
|
2768
2868
|
"New ",
|
|
2769
2869
|
flowNoun
|
|
2770
2870
|
] })
|
|
2771
2871
|
] }),
|
|
2772
|
-
/* @__PURE__ */
|
|
2872
|
+
/* @__PURE__ */ jsx11(PoweredBy, {})
|
|
2773
2873
|
] });
|
|
2774
2874
|
}
|
|
2775
|
-
return /* @__PURE__ */
|
|
2776
|
-
/* @__PURE__ */
|
|
2777
|
-
/* @__PURE__ */
|
|
2778
|
-
/* @__PURE__ */
|
|
2875
|
+
return /* @__PURE__ */ jsxs10("div", { className: "rs-step", children: [
|
|
2876
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-step-header", children: [
|
|
2877
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-step-header-row", children: [
|
|
2878
|
+
/* @__PURE__ */ jsx11(
|
|
2779
2879
|
"div",
|
|
2780
2880
|
{
|
|
2781
2881
|
className: `rs-step-icon ${isError ? "rs-step-icon--error" : "rs-step-icon--accent"}`,
|
|
2782
|
-
children: isError ? /* @__PURE__ */
|
|
2882
|
+
children: isError ? /* @__PURE__ */ jsx11(
|
|
2783
2883
|
"svg",
|
|
2784
2884
|
{
|
|
2785
2885
|
viewBox: "0 0 24 24",
|
|
2786
2886
|
fill: "none",
|
|
2787
2887
|
stroke: "currentColor",
|
|
2788
2888
|
strokeWidth: "2",
|
|
2789
|
-
children: /* @__PURE__ */
|
|
2889
|
+
children: /* @__PURE__ */ jsx11(
|
|
2790
2890
|
"path",
|
|
2791
2891
|
{
|
|
2792
2892
|
strokeLinecap: "round",
|
|
@@ -2795,10 +2895,10 @@ function ProcessingStep({
|
|
|
2795
2895
|
}
|
|
2796
2896
|
)
|
|
2797
2897
|
}
|
|
2798
|
-
) : /* @__PURE__ */
|
|
2898
|
+
) : /* @__PURE__ */ jsx11(Spinner, {})
|
|
2799
2899
|
}
|
|
2800
2900
|
),
|
|
2801
|
-
/* @__PURE__ */
|
|
2901
|
+
/* @__PURE__ */ jsx11(
|
|
2802
2902
|
"div",
|
|
2803
2903
|
{
|
|
2804
2904
|
className: `rs-step-title ${isError ? "rs-step-title--error" : ""}`,
|
|
@@ -2806,7 +2906,7 @@ function ProcessingStep({
|
|
|
2806
2906
|
}
|
|
2807
2907
|
)
|
|
2808
2908
|
] }),
|
|
2809
|
-
/* @__PURE__ */
|
|
2909
|
+
/* @__PURE__ */ jsxs10(
|
|
2810
2910
|
"div",
|
|
2811
2911
|
{
|
|
2812
2912
|
className: `rs-step-description ${isError ? "rs-text-error" : "rs-text-secondary"}`,
|
|
@@ -2818,11 +2918,11 @@ function ProcessingStep({
|
|
|
2818
2918
|
}
|
|
2819
2919
|
)
|
|
2820
2920
|
] }),
|
|
2821
|
-
/* @__PURE__ */
|
|
2822
|
-
isProcessing && /* @__PURE__ */
|
|
2823
|
-
/* @__PURE__ */
|
|
2824
|
-
/* @__PURE__ */
|
|
2825
|
-
/* @__PURE__ */
|
|
2921
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-step-body rs-space-y-3", children: [
|
|
2922
|
+
isProcessing && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
2923
|
+
/* @__PURE__ */ jsx11("div", { className: "rs-progress-bar", children: /* @__PURE__ */ jsx11("div", { className: "rs-progress-bar-fill rs-progress-bar-fill--indeterminate" }) }),
|
|
2924
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-alert rs-alert--info", children: [
|
|
2925
|
+
/* @__PURE__ */ jsx11(
|
|
2826
2926
|
"svg",
|
|
2827
2927
|
{
|
|
2828
2928
|
className: "rs-alert-icon",
|
|
@@ -2830,7 +2930,7 @@ function ProcessingStep({
|
|
|
2830
2930
|
fill: "none",
|
|
2831
2931
|
stroke: "currentColor",
|
|
2832
2932
|
strokeWidth: "2",
|
|
2833
|
-
children: /* @__PURE__ */
|
|
2933
|
+
children: /* @__PURE__ */ jsx11(
|
|
2834
2934
|
"path",
|
|
2835
2935
|
{
|
|
2836
2936
|
strokeLinecap: "round",
|
|
@@ -2840,13 +2940,13 @@ function ProcessingStep({
|
|
|
2840
2940
|
)
|
|
2841
2941
|
}
|
|
2842
2942
|
),
|
|
2843
|
-
/* @__PURE__ */
|
|
2943
|
+
/* @__PURE__ */ jsxs10("p", { className: "rs-alert-text", children: [
|
|
2844
2944
|
"You can safely close this window. Your ",
|
|
2845
2945
|
flowNoun,
|
|
2846
2946
|
" will complete in the background."
|
|
2847
2947
|
] })
|
|
2848
2948
|
] }),
|
|
2849
|
-
/* @__PURE__ */
|
|
2949
|
+
/* @__PURE__ */ jsxs10(
|
|
2850
2950
|
"div",
|
|
2851
2951
|
{
|
|
2852
2952
|
className: "rs-text-sm rs-text-tertiary",
|
|
@@ -2858,16 +2958,16 @@ function ProcessingStep({
|
|
|
2858
2958
|
}
|
|
2859
2959
|
)
|
|
2860
2960
|
] }),
|
|
2861
|
-
/* @__PURE__ */
|
|
2862
|
-
/* @__PURE__ */
|
|
2863
|
-
/* @__PURE__ */
|
|
2864
|
-
/* @__PURE__ */
|
|
2961
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card", children: [
|
|
2962
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2963
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Source" }),
|
|
2964
|
+
/* @__PURE__ */ jsxs10(
|
|
2865
2965
|
"span",
|
|
2866
2966
|
{
|
|
2867
2967
|
className: "rs-card-value",
|
|
2868
2968
|
style: { display: "flex", alignItems: "center", gap: 8 },
|
|
2869
2969
|
children: [
|
|
2870
|
-
getChainIcon(sourceChain) && /* @__PURE__ */
|
|
2970
|
+
getChainIcon(sourceChain) && /* @__PURE__ */ jsx11(
|
|
2871
2971
|
"img",
|
|
2872
2972
|
{
|
|
2873
2973
|
src: getChainIcon(sourceChain),
|
|
@@ -2880,15 +2980,15 @@ function ProcessingStep({
|
|
|
2880
2980
|
}
|
|
2881
2981
|
)
|
|
2882
2982
|
] }),
|
|
2883
|
-
/* @__PURE__ */
|
|
2884
|
-
/* @__PURE__ */
|
|
2885
|
-
/* @__PURE__ */
|
|
2983
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
2984
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Destination" }),
|
|
2985
|
+
/* @__PURE__ */ jsxs10(
|
|
2886
2986
|
"span",
|
|
2887
2987
|
{
|
|
2888
2988
|
className: "rs-card-value",
|
|
2889
2989
|
style: { display: "flex", alignItems: "center", gap: 8 },
|
|
2890
2990
|
children: [
|
|
2891
|
-
getChainIcon(targetChain) && /* @__PURE__ */
|
|
2991
|
+
getChainIcon(targetChain) && /* @__PURE__ */ jsx11(
|
|
2892
2992
|
"img",
|
|
2893
2993
|
{
|
|
2894
2994
|
src: getChainIcon(targetChain),
|
|
@@ -2901,9 +3001,9 @@ function ProcessingStep({
|
|
|
2901
3001
|
}
|
|
2902
3002
|
)
|
|
2903
3003
|
] }),
|
|
2904
|
-
/* @__PURE__ */
|
|
2905
|
-
/* @__PURE__ */
|
|
2906
|
-
sourceExplorerUrl ? /* @__PURE__ */
|
|
3004
|
+
/* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
|
|
3005
|
+
/* @__PURE__ */ jsx11("span", { className: "rs-card-label", children: "Transaction" }),
|
|
3006
|
+
sourceExplorerUrl ? /* @__PURE__ */ jsxs10(
|
|
2907
3007
|
"a",
|
|
2908
3008
|
{
|
|
2909
3009
|
href: sourceExplorerUrl,
|
|
@@ -2912,14 +3012,14 @@ function ProcessingStep({
|
|
|
2912
3012
|
className: "rs-link rs-link-external rs-font-mono rs-text-xs",
|
|
2913
3013
|
children: [
|
|
2914
3014
|
truncateHash(txHash),
|
|
2915
|
-
/* @__PURE__ */
|
|
3015
|
+
/* @__PURE__ */ jsx11(
|
|
2916
3016
|
"svg",
|
|
2917
3017
|
{
|
|
2918
3018
|
viewBox: "0 0 24 24",
|
|
2919
3019
|
fill: "none",
|
|
2920
3020
|
stroke: "currentColor",
|
|
2921
3021
|
strokeWidth: "2.5",
|
|
2922
|
-
children: /* @__PURE__ */
|
|
3022
|
+
children: /* @__PURE__ */ jsx11(
|
|
2923
3023
|
"path",
|
|
2924
3024
|
{
|
|
2925
3025
|
strokeLinecap: "round",
|
|
@@ -2931,15 +3031,15 @@ function ProcessingStep({
|
|
|
2931
3031
|
)
|
|
2932
3032
|
]
|
|
2933
3033
|
}
|
|
2934
|
-
) : /* @__PURE__ */
|
|
3034
|
+
) : /* @__PURE__ */ jsx11("span", { className: "rs-card-value rs-card-value--mono", children: truncateHash(txHash) })
|
|
2935
3035
|
] })
|
|
2936
3036
|
] })
|
|
2937
3037
|
] }),
|
|
2938
|
-
isError && /* @__PURE__ */
|
|
2939
|
-
/* @__PURE__ */
|
|
2940
|
-
/* @__PURE__ */
|
|
3038
|
+
isError && /* @__PURE__ */ jsxs10("div", { className: "rs-step-footer", style: { gap: 8, display: "flex" }, children: [
|
|
3039
|
+
/* @__PURE__ */ jsx11(Button, { variant: "outline", onClick: onClose, fullWidth: true, children: "Close" }),
|
|
3040
|
+
/* @__PURE__ */ jsx11(Button, { onClick: onNewDeposit, fullWidth: true, children: "Try Again" })
|
|
2941
3041
|
] }),
|
|
2942
|
-
/* @__PURE__ */
|
|
3042
|
+
/* @__PURE__ */ jsx11(PoweredBy, {})
|
|
2943
3043
|
] });
|
|
2944
3044
|
}
|
|
2945
3045
|
var INITIAL_POLL_INTERVAL, MAX_POLL_INTERVAL, BACKOFF_MULTIPLIER, PROCESS_TIMEOUT_MS;
|
|
@@ -2961,7 +3061,7 @@ var init_ProcessingStep = __esm({
|
|
|
2961
3061
|
// src/components/ui/QRCode.tsx
|
|
2962
3062
|
import { useMemo as useMemo4 } from "react";
|
|
2963
3063
|
import qrcode from "qrcode-generator";
|
|
2964
|
-
import { Fragment as Fragment3, jsx as
|
|
3064
|
+
import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
2965
3065
|
function QRCode({
|
|
2966
3066
|
value,
|
|
2967
3067
|
size = 200,
|
|
@@ -2995,7 +3095,7 @@ function QRCode({
|
|
|
2995
3095
|
}, [value, size, iconSrc]);
|
|
2996
3096
|
const iconSize = size * 0.22;
|
|
2997
3097
|
const iconOffset = (size - iconSize) / 2;
|
|
2998
|
-
return /* @__PURE__ */
|
|
3098
|
+
return /* @__PURE__ */ jsxs11(
|
|
2999
3099
|
"svg",
|
|
3000
3100
|
{
|
|
3001
3101
|
viewBox: `0 0 ${size} ${size}`,
|
|
@@ -3005,10 +3105,10 @@ function QRCode({
|
|
|
3005
3105
|
role: "img",
|
|
3006
3106
|
"aria-label": "QR Code",
|
|
3007
3107
|
children: [
|
|
3008
|
-
/* @__PURE__ */
|
|
3009
|
-
/* @__PURE__ */
|
|
3010
|
-
iconSrc && /* @__PURE__ */
|
|
3011
|
-
/* @__PURE__ */
|
|
3108
|
+
/* @__PURE__ */ jsx12("rect", { width: size, height: size, fill: "white", rx: 4 }),
|
|
3109
|
+
/* @__PURE__ */ jsx12("path", { d: svgContent.paths, fill: "black" }),
|
|
3110
|
+
iconSrc && /* @__PURE__ */ jsxs11(Fragment3, { children: [
|
|
3111
|
+
/* @__PURE__ */ jsx12(
|
|
3012
3112
|
"rect",
|
|
3013
3113
|
{
|
|
3014
3114
|
x: iconOffset - 4,
|
|
@@ -3019,7 +3119,7 @@ function QRCode({
|
|
|
3019
3119
|
rx: 8
|
|
3020
3120
|
}
|
|
3021
3121
|
),
|
|
3022
|
-
/* @__PURE__ */
|
|
3122
|
+
/* @__PURE__ */ jsx12(
|
|
3023
3123
|
"image",
|
|
3024
3124
|
{
|
|
3025
3125
|
href: iconSrc,
|
|
@@ -3043,7 +3143,7 @@ var init_QRCode = __esm({
|
|
|
3043
3143
|
|
|
3044
3144
|
// src/components/steps/DepositAddressStep.tsx
|
|
3045
3145
|
import { useState as useState6, useEffect as useEffect6, useCallback as useCallback3, useRef as useRef5, useMemo as useMemo5 } from "react";
|
|
3046
|
-
import { jsx as
|
|
3146
|
+
import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
3047
3147
|
function isRecord2(value) {
|
|
3048
3148
|
return typeof value === "object" && value !== null;
|
|
3049
3149
|
}
|
|
@@ -3184,12 +3284,12 @@ function DepositAddressStep({
|
|
|
3184
3284
|
};
|
|
3185
3285
|
}, [smartAccount, service, onDepositDetected, onError]);
|
|
3186
3286
|
const chainIconSrc = getChainIcon(sourceChainId);
|
|
3187
|
-
return /* @__PURE__ */
|
|
3188
|
-
/* @__PURE__ */
|
|
3189
|
-
/* @__PURE__ */
|
|
3190
|
-
/* @__PURE__ */
|
|
3191
|
-
/* @__PURE__ */
|
|
3192
|
-
/* @__PURE__ */
|
|
3287
|
+
return /* @__PURE__ */ jsxs12("div", { className: "rs-step", children: [
|
|
3288
|
+
/* @__PURE__ */ jsx13("div", { className: "rs-step-body", children: /* @__PURE__ */ jsxs12("div", { className: "rs-deposit-address", children: [
|
|
3289
|
+
/* @__PURE__ */ jsxs12("div", { className: "rs-deposit-address-selectors", children: [
|
|
3290
|
+
/* @__PURE__ */ jsxs12("div", { className: "rs-deposit-address-dropdown", children: [
|
|
3291
|
+
/* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-dropdown-label", children: "Supported token" }),
|
|
3292
|
+
/* @__PURE__ */ jsxs12(
|
|
3193
3293
|
"button",
|
|
3194
3294
|
{
|
|
3195
3295
|
type: "button",
|
|
@@ -3199,7 +3299,7 @@ function DepositAddressStep({
|
|
|
3199
3299
|
setChainDropdownOpen(false);
|
|
3200
3300
|
},
|
|
3201
3301
|
children: [
|
|
3202
|
-
getTokenIcon(sourceTokenSymbol) && /* @__PURE__ */
|
|
3302
|
+
getTokenIcon(sourceTokenSymbol) && /* @__PURE__ */ jsx13(
|
|
3203
3303
|
"img",
|
|
3204
3304
|
{
|
|
3205
3305
|
src: getTokenIcon(sourceTokenSymbol),
|
|
@@ -3207,8 +3307,8 @@ function DepositAddressStep({
|
|
|
3207
3307
|
className: "rs-deposit-address-dropdown-icon"
|
|
3208
3308
|
}
|
|
3209
3309
|
),
|
|
3210
|
-
/* @__PURE__ */
|
|
3211
|
-
/* @__PURE__ */
|
|
3310
|
+
/* @__PURE__ */ jsx13("span", { children: sourceTokenSymbol }),
|
|
3311
|
+
/* @__PURE__ */ jsx13(
|
|
3212
3312
|
"svg",
|
|
3213
3313
|
{
|
|
3214
3314
|
className: "rs-deposit-address-dropdown-chevron",
|
|
@@ -3216,7 +3316,7 @@ function DepositAddressStep({
|
|
|
3216
3316
|
fill: "none",
|
|
3217
3317
|
stroke: "currentColor",
|
|
3218
3318
|
strokeWidth: "2",
|
|
3219
|
-
children: /* @__PURE__ */
|
|
3319
|
+
children: /* @__PURE__ */ jsx13(
|
|
3220
3320
|
"path",
|
|
3221
3321
|
{
|
|
3222
3322
|
strokeLinecap: "round",
|
|
@@ -3229,7 +3329,7 @@ function DepositAddressStep({
|
|
|
3229
3329
|
]
|
|
3230
3330
|
}
|
|
3231
3331
|
),
|
|
3232
|
-
tokenDropdownOpen && /* @__PURE__ */
|
|
3332
|
+
tokenDropdownOpen && /* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-dropdown-menu", children: tokensForChain.map((symbol) => /* @__PURE__ */ jsxs12(
|
|
3233
3333
|
"button",
|
|
3234
3334
|
{
|
|
3235
3335
|
type: "button",
|
|
@@ -3239,7 +3339,7 @@ function DepositAddressStep({
|
|
|
3239
3339
|
setTokenDropdownOpen(false);
|
|
3240
3340
|
},
|
|
3241
3341
|
children: [
|
|
3242
|
-
getTokenIcon(symbol) && /* @__PURE__ */
|
|
3342
|
+
getTokenIcon(symbol) && /* @__PURE__ */ jsx13(
|
|
3243
3343
|
"img",
|
|
3244
3344
|
{
|
|
3245
3345
|
src: getTokenIcon(symbol),
|
|
@@ -3247,15 +3347,15 @@ function DepositAddressStep({
|
|
|
3247
3347
|
className: "rs-deposit-address-dropdown-icon"
|
|
3248
3348
|
}
|
|
3249
3349
|
),
|
|
3250
|
-
/* @__PURE__ */
|
|
3350
|
+
/* @__PURE__ */ jsx13("span", { children: symbol })
|
|
3251
3351
|
]
|
|
3252
3352
|
},
|
|
3253
3353
|
symbol
|
|
3254
3354
|
)) })
|
|
3255
3355
|
] }),
|
|
3256
|
-
/* @__PURE__ */
|
|
3257
|
-
/* @__PURE__ */
|
|
3258
|
-
/* @__PURE__ */
|
|
3356
|
+
/* @__PURE__ */ jsxs12("div", { className: "rs-deposit-address-dropdown", children: [
|
|
3357
|
+
/* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-dropdown-label", children: "Supported chain" }),
|
|
3358
|
+
/* @__PURE__ */ jsxs12(
|
|
3259
3359
|
"button",
|
|
3260
3360
|
{
|
|
3261
3361
|
type: "button",
|
|
@@ -3265,7 +3365,7 @@ function DepositAddressStep({
|
|
|
3265
3365
|
setTokenDropdownOpen(false);
|
|
3266
3366
|
},
|
|
3267
3367
|
children: [
|
|
3268
|
-
getChainIcon(sourceChainId) && /* @__PURE__ */
|
|
3368
|
+
getChainIcon(sourceChainId) && /* @__PURE__ */ jsx13(
|
|
3269
3369
|
"img",
|
|
3270
3370
|
{
|
|
3271
3371
|
src: getChainIcon(sourceChainId),
|
|
@@ -3273,8 +3373,8 @@ function DepositAddressStep({
|
|
|
3273
3373
|
className: "rs-deposit-address-dropdown-icon"
|
|
3274
3374
|
}
|
|
3275
3375
|
),
|
|
3276
|
-
/* @__PURE__ */
|
|
3277
|
-
/* @__PURE__ */
|
|
3376
|
+
/* @__PURE__ */ jsx13("span", { children: getChainName(sourceChainId) }),
|
|
3377
|
+
/* @__PURE__ */ jsx13(
|
|
3278
3378
|
"svg",
|
|
3279
3379
|
{
|
|
3280
3380
|
className: "rs-deposit-address-dropdown-chevron",
|
|
@@ -3282,7 +3382,7 @@ function DepositAddressStep({
|
|
|
3282
3382
|
fill: "none",
|
|
3283
3383
|
stroke: "currentColor",
|
|
3284
3384
|
strokeWidth: "2",
|
|
3285
|
-
children: /* @__PURE__ */
|
|
3385
|
+
children: /* @__PURE__ */ jsx13(
|
|
3286
3386
|
"path",
|
|
3287
3387
|
{
|
|
3288
3388
|
strokeLinecap: "round",
|
|
@@ -3295,7 +3395,7 @@ function DepositAddressStep({
|
|
|
3295
3395
|
]
|
|
3296
3396
|
}
|
|
3297
3397
|
),
|
|
3298
|
-
chainDropdownOpen && /* @__PURE__ */
|
|
3398
|
+
chainDropdownOpen && /* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-dropdown-menu", children: supportedChainIds.map((chainId) => /* @__PURE__ */ jsxs12(
|
|
3299
3399
|
"button",
|
|
3300
3400
|
{
|
|
3301
3401
|
type: "button",
|
|
@@ -3305,7 +3405,7 @@ function DepositAddressStep({
|
|
|
3305
3405
|
setChainDropdownOpen(false);
|
|
3306
3406
|
},
|
|
3307
3407
|
children: [
|
|
3308
|
-
getChainIcon(chainId) && /* @__PURE__ */
|
|
3408
|
+
getChainIcon(chainId) && /* @__PURE__ */ jsx13(
|
|
3309
3409
|
"img",
|
|
3310
3410
|
{
|
|
3311
3411
|
src: getChainIcon(chainId),
|
|
@@ -3313,25 +3413,25 @@ function DepositAddressStep({
|
|
|
3313
3413
|
className: "rs-deposit-address-dropdown-icon"
|
|
3314
3414
|
}
|
|
3315
3415
|
),
|
|
3316
|
-
/* @__PURE__ */
|
|
3416
|
+
/* @__PURE__ */ jsx13("span", { children: getChainName(chainId) })
|
|
3317
3417
|
]
|
|
3318
3418
|
},
|
|
3319
3419
|
chainId
|
|
3320
3420
|
)) })
|
|
3321
3421
|
] })
|
|
3322
3422
|
] }),
|
|
3323
|
-
/* @__PURE__ */
|
|
3324
|
-
/* @__PURE__ */
|
|
3325
|
-
/* @__PURE__ */
|
|
3326
|
-
/* @__PURE__ */
|
|
3327
|
-
/* @__PURE__ */
|
|
3423
|
+
/* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-qr", children: /* @__PURE__ */ jsx13(QRCode, { value: smartAccount, size: 200, iconSrc: chainIconSrc }) }),
|
|
3424
|
+
/* @__PURE__ */ jsxs12("div", { className: "rs-deposit-address-info", children: [
|
|
3425
|
+
/* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-label", children: "Your deposit address" }),
|
|
3426
|
+
/* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-value", children: smartAccount }),
|
|
3427
|
+
/* @__PURE__ */ jsxs12(
|
|
3328
3428
|
"button",
|
|
3329
3429
|
{
|
|
3330
3430
|
type: "button",
|
|
3331
3431
|
className: "rs-deposit-address-copy",
|
|
3332
3432
|
onClick: handleCopy,
|
|
3333
3433
|
children: [
|
|
3334
|
-
/* @__PURE__ */
|
|
3434
|
+
/* @__PURE__ */ jsx13(
|
|
3335
3435
|
"svg",
|
|
3336
3436
|
{
|
|
3337
3437
|
viewBox: "0 0 24 24",
|
|
@@ -3339,14 +3439,14 @@ function DepositAddressStep({
|
|
|
3339
3439
|
stroke: "currentColor",
|
|
3340
3440
|
strokeWidth: "2",
|
|
3341
3441
|
style: { width: 14, height: 14 },
|
|
3342
|
-
children: copied ? /* @__PURE__ */
|
|
3442
|
+
children: copied ? /* @__PURE__ */ jsx13(
|
|
3343
3443
|
"path",
|
|
3344
3444
|
{
|
|
3345
3445
|
strokeLinecap: "round",
|
|
3346
3446
|
strokeLinejoin: "round",
|
|
3347
3447
|
d: "M5 12l5 5L20 7"
|
|
3348
3448
|
}
|
|
3349
|
-
) : /* @__PURE__ */
|
|
3449
|
+
) : /* @__PURE__ */ jsx13(
|
|
3350
3450
|
"path",
|
|
3351
3451
|
{
|
|
3352
3452
|
strokeLinecap: "round",
|
|
@@ -3361,9 +3461,9 @@ function DepositAddressStep({
|
|
|
3361
3461
|
}
|
|
3362
3462
|
)
|
|
3363
3463
|
] }),
|
|
3364
|
-
pollingError && /* @__PURE__ */
|
|
3464
|
+
pollingError && /* @__PURE__ */ jsx13("div", { className: "rs-deposit-address-error", children: pollingError })
|
|
3365
3465
|
] }) }),
|
|
3366
|
-
/* @__PURE__ */
|
|
3466
|
+
/* @__PURE__ */ jsx13(PoweredBy, {})
|
|
3367
3467
|
] });
|
|
3368
3468
|
}
|
|
3369
3469
|
var POLL_INTERVAL_MS;
|
|
@@ -3381,7 +3481,7 @@ var init_DepositAddressStep = __esm({
|
|
|
3381
3481
|
|
|
3382
3482
|
// src/DepositFlow.tsx
|
|
3383
3483
|
import { useState as useState7, useCallback as useCallback4, useMemo as useMemo6, useEffect as useEffect7, useRef as useRef6 } from "react";
|
|
3384
|
-
import { jsx as
|
|
3484
|
+
import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
3385
3485
|
function DepositFlow({
|
|
3386
3486
|
walletClient,
|
|
3387
3487
|
publicClient,
|
|
@@ -3442,6 +3542,13 @@ function DepositFlow({
|
|
|
3442
3542
|
setIsConnectSelectionConfirmed(false);
|
|
3443
3543
|
}
|
|
3444
3544
|
}, [hasConnectWalletOptions]);
|
|
3545
|
+
const handleBackFromDepositAddress = useCallback4(() => {
|
|
3546
|
+
setFlowMode(null);
|
|
3547
|
+
setStep({ type: "setup" });
|
|
3548
|
+
if (hasConnectWalletOptions) {
|
|
3549
|
+
setIsConnectSelectionConfirmed(false);
|
|
3550
|
+
}
|
|
3551
|
+
}, [hasConnectWalletOptions]);
|
|
3445
3552
|
const handleBackFromConfirm = useCallback4(() => {
|
|
3446
3553
|
setStep((prev) => {
|
|
3447
3554
|
if (prev.type !== "confirm") return prev;
|
|
@@ -3454,7 +3561,7 @@ function DepositFlow({
|
|
|
3454
3561
|
});
|
|
3455
3562
|
}, []);
|
|
3456
3563
|
const stepIndex = step.type === "setup" ? 0 : step.type === "deposit-address" ? 1 : step.type === "select-asset" ? 1 : step.type === "amount" ? 2 : step.type === "confirm" ? 3 : 4;
|
|
3457
|
-
const currentBackHandler = step.type === "select-asset" && hasConnectedWallet && hasConnectWalletOptions && isConnectSelectionConfirmed ? handleBackFromSelectAsset : step.type === "amount" ? handleBackFromAmount : step.type === "confirm" ? handleBackFromConfirm : void 0;
|
|
3564
|
+
const currentBackHandler = step.type === "deposit-address" ? handleBackFromDepositAddress : step.type === "select-asset" && hasConnectedWallet && hasConnectWalletOptions && isConnectSelectionConfirmed ? handleBackFromSelectAsset : step.type === "amount" ? handleBackFromAmount : step.type === "confirm" ? handleBackFromConfirm : void 0;
|
|
3458
3565
|
useEffect7(() => {
|
|
3459
3566
|
onStepChange?.(stepIndex, currentBackHandler);
|
|
3460
3567
|
}, [stepIndex, currentBackHandler, onStepChange]);
|
|
@@ -3593,7 +3700,7 @@ function DepositFlow({
|
|
|
3593
3700
|
setIsConnectSelectionConfirmed(false);
|
|
3594
3701
|
}, [connectWalletOptionsKey, selectedConnectAddressEffective]);
|
|
3595
3702
|
if (showConnectStep) {
|
|
3596
|
-
return /* @__PURE__ */
|
|
3703
|
+
return /* @__PURE__ */ jsx14("div", { className: "rs-modal-body", children: /* @__PURE__ */ jsx14(
|
|
3597
3704
|
ConnectStep,
|
|
3598
3705
|
{
|
|
3599
3706
|
walletOptions: connectWalletOptions,
|
|
@@ -3617,8 +3724,8 @@ function DepositFlow({
|
|
|
3617
3724
|
return null;
|
|
3618
3725
|
}
|
|
3619
3726
|
if (isDepositAddressMode) {
|
|
3620
|
-
return /* @__PURE__ */
|
|
3621
|
-
step.type === "setup" && targetChainObj && /* @__PURE__ */
|
|
3727
|
+
return /* @__PURE__ */ jsxs13("div", { className: "rs-modal-body", children: [
|
|
3728
|
+
step.type === "setup" && targetChainObj && /* @__PURE__ */ jsx14(
|
|
3622
3729
|
SetupStep,
|
|
3623
3730
|
{
|
|
3624
3731
|
walletClient,
|
|
@@ -3636,7 +3743,7 @@ function DepositFlow({
|
|
|
3636
3743
|
onError: handleError
|
|
3637
3744
|
}
|
|
3638
3745
|
),
|
|
3639
|
-
step.type === "deposit-address" && /* @__PURE__ */
|
|
3746
|
+
step.type === "deposit-address" && /* @__PURE__ */ jsx14(
|
|
3640
3747
|
DepositAddressStep,
|
|
3641
3748
|
{
|
|
3642
3749
|
smartAccount: step.smartAccount,
|
|
@@ -3645,7 +3752,7 @@ function DepositFlow({
|
|
|
3645
3752
|
onError: handleError
|
|
3646
3753
|
}
|
|
3647
3754
|
),
|
|
3648
|
-
step.type === "processing" && /* @__PURE__ */
|
|
3755
|
+
step.type === "processing" && /* @__PURE__ */ jsx14(
|
|
3649
3756
|
ProcessingStep,
|
|
3650
3757
|
{
|
|
3651
3758
|
smartAccount: step.smartAccount,
|
|
@@ -3666,8 +3773,8 @@ function DepositFlow({
|
|
|
3666
3773
|
)
|
|
3667
3774
|
] });
|
|
3668
3775
|
}
|
|
3669
|
-
return /* @__PURE__ */
|
|
3670
|
-
step.type === "setup" && targetChainObj && /* @__PURE__ */
|
|
3776
|
+
return /* @__PURE__ */ jsxs13("div", { className: "rs-modal-body", children: [
|
|
3777
|
+
step.type === "setup" && targetChainObj && /* @__PURE__ */ jsx14(
|
|
3671
3778
|
SetupStep,
|
|
3672
3779
|
{
|
|
3673
3780
|
walletClient,
|
|
@@ -3685,7 +3792,7 @@ function DepositFlow({
|
|
|
3685
3792
|
onError: handleError
|
|
3686
3793
|
}
|
|
3687
3794
|
),
|
|
3688
|
-
step.type === "select-asset" && /* @__PURE__ */
|
|
3795
|
+
step.type === "select-asset" && /* @__PURE__ */ jsx14(
|
|
3689
3796
|
AssetSelectStep,
|
|
3690
3797
|
{
|
|
3691
3798
|
address,
|
|
@@ -3697,7 +3804,7 @@ function DepositFlow({
|
|
|
3697
3804
|
onTotalBalanceComputed: handleTotalBalanceComputed
|
|
3698
3805
|
}
|
|
3699
3806
|
),
|
|
3700
|
-
step.type === "amount" && /* @__PURE__ */
|
|
3807
|
+
step.type === "amount" && /* @__PURE__ */ jsx14(
|
|
3701
3808
|
AmountStep,
|
|
3702
3809
|
{
|
|
3703
3810
|
walletClient,
|
|
@@ -3712,7 +3819,7 @@ function DepositFlow({
|
|
|
3712
3819
|
onContinue: handleAmountContinue
|
|
3713
3820
|
}
|
|
3714
3821
|
),
|
|
3715
|
-
step.type === "confirm" && /* @__PURE__ */
|
|
3822
|
+
step.type === "confirm" && /* @__PURE__ */ jsx14(
|
|
3716
3823
|
ConfirmStep,
|
|
3717
3824
|
{
|
|
3718
3825
|
walletClient,
|
|
@@ -3729,7 +3836,7 @@ function DepositFlow({
|
|
|
3729
3836
|
onError: handleError
|
|
3730
3837
|
}
|
|
3731
3838
|
),
|
|
3732
|
-
step.type === "processing" && /* @__PURE__ */
|
|
3839
|
+
step.type === "processing" && /* @__PURE__ */ jsx14(
|
|
3733
3840
|
ProcessingStep,
|
|
3734
3841
|
{
|
|
3735
3842
|
smartAccount: step.smartAccount,
|
|
@@ -3833,7 +3940,7 @@ import {
|
|
|
3833
3940
|
usePublicClient,
|
|
3834
3941
|
useSwitchChain
|
|
3835
3942
|
} from "wagmi";
|
|
3836
|
-
import { jsx as
|
|
3943
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
3837
3944
|
function mapTheme(theme) {
|
|
3838
3945
|
const themeMode = theme?.mode === "light" ? "light" : "dark";
|
|
3839
3946
|
const themeVariables = {};
|
|
@@ -3872,7 +3979,7 @@ function ReownWalletProvider({
|
|
|
3872
3979
|
const [queryClient] = useState8(() => new QueryClient());
|
|
3873
3980
|
const adapter = getOrCreateAdapter(projectId, theme);
|
|
3874
3981
|
const config = adapter.wagmiConfig;
|
|
3875
|
-
return /* @__PURE__ */
|
|
3982
|
+
return /* @__PURE__ */ jsx15(WagmiProvider, { config, children: /* @__PURE__ */ jsx15(QueryClientProvider, { client: queryClient, children }) });
|
|
3876
3983
|
}
|
|
3877
3984
|
function useReownWallet() {
|
|
3878
3985
|
const { open } = useAppKit();
|
|
@@ -3982,7 +4089,7 @@ __export(DepositModalReown_exports, {
|
|
|
3982
4089
|
DepositModalReown: () => DepositModalReown
|
|
3983
4090
|
});
|
|
3984
4091
|
import { useCallback as useCallback6 } from "react";
|
|
3985
|
-
import { jsx as
|
|
4092
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
3986
4093
|
function DepositModalWithReown(props) {
|
|
3987
4094
|
const reown = useReownWallet();
|
|
3988
4095
|
const resolved = useResolvedWallet(
|
|
@@ -3997,7 +4104,7 @@ function DepositModalWithReown(props) {
|
|
|
3997
4104
|
const handleConnect = useCallback6(() => {
|
|
3998
4105
|
reown.openConnect();
|
|
3999
4106
|
}, [reown.openConnect]);
|
|
4000
|
-
return /* @__PURE__ */
|
|
4107
|
+
return /* @__PURE__ */ jsx16(
|
|
4001
4108
|
DepositModalInner,
|
|
4002
4109
|
{
|
|
4003
4110
|
...props,
|
|
@@ -4014,7 +4121,7 @@ function DepositModalWithReown(props) {
|
|
|
4014
4121
|
);
|
|
4015
4122
|
}
|
|
4016
4123
|
function DepositModalReown(props) {
|
|
4017
|
-
return /* @__PURE__ */
|
|
4124
|
+
return /* @__PURE__ */ jsx16(ReownWalletProvider, { projectId: props.reownAppId, theme: props.theme, children: /* @__PURE__ */ jsx16(DepositModalWithReown, { ...props }) });
|
|
4018
4125
|
}
|
|
4019
4126
|
var init_DepositModalReown = __esm({
|
|
4020
4127
|
"src/DepositModalReown.tsx"() {
|
|
@@ -4034,13 +4141,13 @@ import {
|
|
|
4034
4141
|
lazy,
|
|
4035
4142
|
Suspense
|
|
4036
4143
|
} from "react";
|
|
4037
|
-
import { jsx as
|
|
4144
|
+
import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
4038
4145
|
function DepositModal(props) {
|
|
4039
4146
|
const needsReown = !!props.reownAppId;
|
|
4040
4147
|
if (needsReown) {
|
|
4041
|
-
return /* @__PURE__ */
|
|
4148
|
+
return /* @__PURE__ */ jsx17(Suspense, { fallback: null, children: /* @__PURE__ */ jsx17(ReownDepositInner, { ...props }) });
|
|
4042
4149
|
}
|
|
4043
|
-
return /* @__PURE__ */
|
|
4150
|
+
return /* @__PURE__ */ jsx17(DepositModalInner, { ...props });
|
|
4044
4151
|
}
|
|
4045
4152
|
function DepositModalInner({
|
|
4046
4153
|
walletClient,
|
|
@@ -4122,30 +4229,30 @@ function DepositModalInner({
|
|
|
4122
4229
|
const logoUrl = branding?.logoUrl ?? "https://github.com/rhinestonewtf.png";
|
|
4123
4230
|
const title = branding?.title ?? "Deposit";
|
|
4124
4231
|
const canGoBack = currentStepIndex > 0 && currentStepIndex < 4 && backHandlerRef.current !== void 0;
|
|
4125
|
-
return /* @__PURE__ */
|
|
4232
|
+
return /* @__PURE__ */ jsx17(
|
|
4126
4233
|
Modal,
|
|
4127
4234
|
{
|
|
4128
4235
|
isOpen,
|
|
4129
4236
|
onClose,
|
|
4130
4237
|
className,
|
|
4131
4238
|
inline,
|
|
4132
|
-
children: /* @__PURE__ */
|
|
4133
|
-
/* @__PURE__ */
|
|
4134
|
-
/* @__PURE__ */
|
|
4239
|
+
children: /* @__PURE__ */ jsxs14("div", { ref: modalRef, className: "rs-modal", children: [
|
|
4240
|
+
/* @__PURE__ */ jsxs14("div", { className: "rs-modal-header--redesigned", children: [
|
|
4241
|
+
/* @__PURE__ */ jsx17("div", { className: "rs-modal-header-nav-left", children: showBackButton && canGoBack && /* @__PURE__ */ jsx17(
|
|
4135
4242
|
"button",
|
|
4136
4243
|
{
|
|
4137
4244
|
type: "button",
|
|
4138
4245
|
className: "rs-modal-header-back",
|
|
4139
4246
|
"aria-label": "Go back",
|
|
4140
4247
|
onClick: handleBack,
|
|
4141
|
-
children: /* @__PURE__ */
|
|
4248
|
+
children: /* @__PURE__ */ jsx17(
|
|
4142
4249
|
"svg",
|
|
4143
4250
|
{
|
|
4144
4251
|
viewBox: "0 0 24 24",
|
|
4145
4252
|
fill: "none",
|
|
4146
4253
|
stroke: "currentColor",
|
|
4147
4254
|
strokeWidth: "2",
|
|
4148
|
-
children: /* @__PURE__ */
|
|
4255
|
+
children: /* @__PURE__ */ jsx17(
|
|
4149
4256
|
"path",
|
|
4150
4257
|
{
|
|
4151
4258
|
strokeLinecap: "round",
|
|
@@ -4157,9 +4264,9 @@ function DepositModalInner({
|
|
|
4157
4264
|
)
|
|
4158
4265
|
}
|
|
4159
4266
|
) }),
|
|
4160
|
-
/* @__PURE__ */
|
|
4161
|
-
/* @__PURE__ */
|
|
4162
|
-
showLogo && logoUrl && /* @__PURE__ */
|
|
4267
|
+
/* @__PURE__ */ jsxs14("div", { className: "rs-modal-header-nav-center", children: [
|
|
4268
|
+
/* @__PURE__ */ jsxs14("div", { className: "rs-modal-header-title-row", children: [
|
|
4269
|
+
showLogo && logoUrl && /* @__PURE__ */ jsx17(
|
|
4163
4270
|
"img",
|
|
4164
4271
|
{
|
|
4165
4272
|
src: logoUrl,
|
|
@@ -4170,8 +4277,8 @@ function DepositModalInner({
|
|
|
4170
4277
|
}
|
|
4171
4278
|
}
|
|
4172
4279
|
),
|
|
4173
|
-
/* @__PURE__ */
|
|
4174
|
-
showStepper && /* @__PURE__ */
|
|
4280
|
+
/* @__PURE__ */ jsx17("span", { className: "rs-modal-header-title", children: title }),
|
|
4281
|
+
showStepper && /* @__PURE__ */ jsx17("div", { className: "rs-modal-progress", style: { marginLeft: 8 }, children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx17(
|
|
4175
4282
|
"div",
|
|
4176
4283
|
{
|
|
4177
4284
|
className: `rs-modal-progress-dot ${i <= currentStepIndex ? "rs-modal-progress-dot--active" : "rs-modal-progress-dot--inactive"}`
|
|
@@ -4179,29 +4286,29 @@ function DepositModalInner({
|
|
|
4179
4286
|
i
|
|
4180
4287
|
)) })
|
|
4181
4288
|
] }),
|
|
4182
|
-
balanceTitle && totalBalanceUsd !== null && /* @__PURE__ */
|
|
4183
|
-
/* @__PURE__ */
|
|
4289
|
+
balanceTitle && totalBalanceUsd !== null && /* @__PURE__ */ jsxs14("div", { className: "rs-modal-header-balance", children: [
|
|
4290
|
+
/* @__PURE__ */ jsxs14("span", { children: [
|
|
4184
4291
|
balanceTitle,
|
|
4185
4292
|
":"
|
|
4186
4293
|
] }),
|
|
4187
|
-
/* @__PURE__ */
|
|
4294
|
+
/* @__PURE__ */ jsx17("span", { className: "rs-modal-header-balance-value", children: currencyFormatter.format(totalBalanceUsd) })
|
|
4188
4295
|
] })
|
|
4189
4296
|
] }),
|
|
4190
|
-
/* @__PURE__ */
|
|
4297
|
+
/* @__PURE__ */ jsx17("div", { className: "rs-modal-header-nav-right", children: /* @__PURE__ */ jsx17(
|
|
4191
4298
|
"button",
|
|
4192
4299
|
{
|
|
4193
4300
|
type: "button",
|
|
4194
4301
|
onClick: onClose,
|
|
4195
4302
|
className: "rs-modal-close",
|
|
4196
4303
|
"aria-label": "Close",
|
|
4197
|
-
children: /* @__PURE__ */
|
|
4304
|
+
children: /* @__PURE__ */ jsx17(
|
|
4198
4305
|
"svg",
|
|
4199
4306
|
{
|
|
4200
4307
|
viewBox: "0 0 24 24",
|
|
4201
4308
|
fill: "none",
|
|
4202
4309
|
stroke: "currentColor",
|
|
4203
4310
|
strokeWidth: "2",
|
|
4204
|
-
children: /* @__PURE__ */
|
|
4311
|
+
children: /* @__PURE__ */ jsx17(
|
|
4205
4312
|
"path",
|
|
4206
4313
|
{
|
|
4207
4314
|
strokeLinecap: "round",
|
|
@@ -4214,7 +4321,7 @@ function DepositModalInner({
|
|
|
4214
4321
|
}
|
|
4215
4322
|
) })
|
|
4216
4323
|
] }),
|
|
4217
|
-
/* @__PURE__ */
|
|
4324
|
+
/* @__PURE__ */ jsx17(
|
|
4218
4325
|
DepositFlow,
|
|
4219
4326
|
{
|
|
4220
4327
|
walletClient,
|
|
@@ -4273,7 +4380,7 @@ var init_DepositModal = __esm({
|
|
|
4273
4380
|
// src/components/steps/WithdrawFormStep.tsx
|
|
4274
4381
|
import { useCallback as useCallback8, useEffect as useEffect9, useMemo as useMemo9, useRef as useRef8, useState as useState10 } from "react";
|
|
4275
4382
|
import { erc20Abi as erc20Abi3, formatUnits as formatUnits5, parseUnits as parseUnits3 } from "viem";
|
|
4276
|
-
import { jsx as
|
|
4383
|
+
import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
4277
4384
|
function useClickOutside(ref, onClose) {
|
|
4278
4385
|
useEffect9(() => {
|
|
4279
4386
|
function handleClick(e) {
|
|
@@ -4471,12 +4578,12 @@ function WithdrawFormStep({
|
|
|
4471
4578
|
setIsSwitching(false);
|
|
4472
4579
|
}
|
|
4473
4580
|
};
|
|
4474
|
-
return /* @__PURE__ */
|
|
4475
|
-
/* @__PURE__ */
|
|
4476
|
-
/* @__PURE__ */
|
|
4477
|
-
/* @__PURE__ */
|
|
4478
|
-
/* @__PURE__ */
|
|
4479
|
-
/* @__PURE__ */
|
|
4581
|
+
return /* @__PURE__ */ jsxs15("div", { className: "rs-step", children: [
|
|
4582
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-step-body rs-withdraw-form", children: [
|
|
4583
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-section", children: [
|
|
4584
|
+
/* @__PURE__ */ jsx18("label", { className: "rs-withdraw-label", children: "Recipient" }),
|
|
4585
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-input-row", children: [
|
|
4586
|
+
/* @__PURE__ */ jsx18(
|
|
4480
4587
|
"input",
|
|
4481
4588
|
{
|
|
4482
4589
|
type: "text",
|
|
@@ -4489,7 +4596,7 @@ function WithdrawFormStep({
|
|
|
4489
4596
|
}
|
|
4490
4597
|
}
|
|
4491
4598
|
),
|
|
4492
|
-
address && /* @__PURE__ */
|
|
4599
|
+
address && /* @__PURE__ */ jsxs15(
|
|
4493
4600
|
"button",
|
|
4494
4601
|
{
|
|
4495
4602
|
type: "button",
|
|
@@ -4497,7 +4604,7 @@ function WithdrawFormStep({
|
|
|
4497
4604
|
onClick: handleUseConnected,
|
|
4498
4605
|
title: isRecipientConnected ? "Using connected wallet" : "Use connected wallet",
|
|
4499
4606
|
children: [
|
|
4500
|
-
/* @__PURE__ */
|
|
4607
|
+
/* @__PURE__ */ jsx18(
|
|
4501
4608
|
"svg",
|
|
4502
4609
|
{
|
|
4503
4610
|
viewBox: "0 0 24 24",
|
|
@@ -4505,7 +4612,7 @@ function WithdrawFormStep({
|
|
|
4505
4612
|
stroke: "currentColor",
|
|
4506
4613
|
strokeWidth: "2",
|
|
4507
4614
|
className: "rs-withdraw-use-connected-icon",
|
|
4508
|
-
children: /* @__PURE__ */
|
|
4615
|
+
children: /* @__PURE__ */ jsx18(
|
|
4509
4616
|
"path",
|
|
4510
4617
|
{
|
|
4511
4618
|
strokeLinecap: "round",
|
|
@@ -4521,10 +4628,10 @@ function WithdrawFormStep({
|
|
|
4521
4628
|
)
|
|
4522
4629
|
] })
|
|
4523
4630
|
] }),
|
|
4524
|
-
/* @__PURE__ */
|
|
4525
|
-
/* @__PURE__ */
|
|
4526
|
-
/* @__PURE__ */
|
|
4527
|
-
/* @__PURE__ */
|
|
4631
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-section", children: [
|
|
4632
|
+
/* @__PURE__ */ jsx18("label", { className: "rs-withdraw-label", children: "Amount" }),
|
|
4633
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-input-row", children: [
|
|
4634
|
+
/* @__PURE__ */ jsx18(
|
|
4528
4635
|
"input",
|
|
4529
4636
|
{
|
|
4530
4637
|
type: "text",
|
|
@@ -4541,9 +4648,9 @@ function WithdrawFormStep({
|
|
|
4541
4648
|
}
|
|
4542
4649
|
}
|
|
4543
4650
|
),
|
|
4544
|
-
/* @__PURE__ */
|
|
4545
|
-
/* @__PURE__ */
|
|
4546
|
-
/* @__PURE__ */
|
|
4651
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-amount-right", children: [
|
|
4652
|
+
/* @__PURE__ */ jsx18("span", { className: "rs-withdraw-token-label", children: asset.symbol }),
|
|
4653
|
+
/* @__PURE__ */ jsx18(
|
|
4547
4654
|
"button",
|
|
4548
4655
|
{
|
|
4549
4656
|
type: "button",
|
|
@@ -4555,25 +4662,25 @@ function WithdrawFormStep({
|
|
|
4555
4662
|
)
|
|
4556
4663
|
] })
|
|
4557
4664
|
] }),
|
|
4558
|
-
/* @__PURE__ */
|
|
4559
|
-
/* @__PURE__ */
|
|
4560
|
-
/* @__PURE__ */
|
|
4665
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-amount-info", children: [
|
|
4666
|
+
/* @__PURE__ */ jsx18("span", { className: "rs-withdraw-usd", children: amountUsd !== null ? currencyFormatter.format(amountUsd) : "$0.00" }),
|
|
4667
|
+
/* @__PURE__ */ jsxs15("span", { className: "rs-withdraw-balance", children: [
|
|
4561
4668
|
formattedBalance,
|
|
4562
4669
|
" ",
|
|
4563
4670
|
asset.symbol
|
|
4564
4671
|
] })
|
|
4565
4672
|
] })
|
|
4566
4673
|
] }),
|
|
4567
|
-
/* @__PURE__ */
|
|
4568
|
-
/* @__PURE__ */
|
|
4569
|
-
/* @__PURE__ */
|
|
4570
|
-
/* @__PURE__ */
|
|
4674
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-receive-row", children: [
|
|
4675
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-receive-col", children: [
|
|
4676
|
+
/* @__PURE__ */ jsx18("label", { className: "rs-withdraw-label", children: "Receive" }),
|
|
4677
|
+
/* @__PURE__ */ jsxs15(
|
|
4571
4678
|
"div",
|
|
4572
4679
|
{
|
|
4573
4680
|
className: "rs-withdraw-dropdown-container",
|
|
4574
4681
|
ref: tokenDropdownRef,
|
|
4575
4682
|
children: [
|
|
4576
|
-
/* @__PURE__ */
|
|
4683
|
+
/* @__PURE__ */ jsxs15(
|
|
4577
4684
|
"button",
|
|
4578
4685
|
{
|
|
4579
4686
|
type: "button",
|
|
@@ -4583,8 +4690,8 @@ function WithdrawFormStep({
|
|
|
4583
4690
|
setShowChainDropdown(false);
|
|
4584
4691
|
},
|
|
4585
4692
|
children: [
|
|
4586
|
-
/* @__PURE__ */
|
|
4587
|
-
getTokenIcon(targetSymbol) && /* @__PURE__ */
|
|
4693
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-dropdown-value", children: [
|
|
4694
|
+
getTokenIcon(targetSymbol) && /* @__PURE__ */ jsx18(
|
|
4588
4695
|
"img",
|
|
4589
4696
|
{
|
|
4590
4697
|
src: getTokenIcon(targetSymbol),
|
|
@@ -4592,9 +4699,9 @@ function WithdrawFormStep({
|
|
|
4592
4699
|
className: "rs-withdraw-dropdown-icon"
|
|
4593
4700
|
}
|
|
4594
4701
|
),
|
|
4595
|
-
/* @__PURE__ */
|
|
4702
|
+
/* @__PURE__ */ jsx18("span", { children: targetSymbol })
|
|
4596
4703
|
] }),
|
|
4597
|
-
/* @__PURE__ */
|
|
4704
|
+
/* @__PURE__ */ jsx18(
|
|
4598
4705
|
"svg",
|
|
4599
4706
|
{
|
|
4600
4707
|
viewBox: "0 0 24 24",
|
|
@@ -4605,7 +4712,7 @@ function WithdrawFormStep({
|
|
|
4605
4712
|
style: {
|
|
4606
4713
|
transform: showTokenDropdown ? "rotate(180deg)" : void 0
|
|
4607
4714
|
},
|
|
4608
|
-
children: /* @__PURE__ */
|
|
4715
|
+
children: /* @__PURE__ */ jsx18(
|
|
4609
4716
|
"path",
|
|
4610
4717
|
{
|
|
4611
4718
|
strokeLinecap: "round",
|
|
@@ -4618,7 +4725,7 @@ function WithdrawFormStep({
|
|
|
4618
4725
|
]
|
|
4619
4726
|
}
|
|
4620
4727
|
),
|
|
4621
|
-
showTokenDropdown && /* @__PURE__ */
|
|
4728
|
+
showTokenDropdown && /* @__PURE__ */ jsx18("div", { className: "rs-withdraw-dropdown-menu", children: targetTokenOptions.map((option) => /* @__PURE__ */ jsxs15(
|
|
4622
4729
|
"button",
|
|
4623
4730
|
{
|
|
4624
4731
|
type: "button",
|
|
@@ -4628,7 +4735,7 @@ function WithdrawFormStep({
|
|
|
4628
4735
|
setShowTokenDropdown(false);
|
|
4629
4736
|
},
|
|
4630
4737
|
children: [
|
|
4631
|
-
getTokenIcon(option.symbol) && /* @__PURE__ */
|
|
4738
|
+
getTokenIcon(option.symbol) && /* @__PURE__ */ jsx18(
|
|
4632
4739
|
"img",
|
|
4633
4740
|
{
|
|
4634
4741
|
src: getTokenIcon(option.symbol),
|
|
@@ -4636,7 +4743,7 @@ function WithdrawFormStep({
|
|
|
4636
4743
|
className: "rs-withdraw-dropdown-icon"
|
|
4637
4744
|
}
|
|
4638
4745
|
),
|
|
4639
|
-
/* @__PURE__ */
|
|
4746
|
+
/* @__PURE__ */ jsx18("span", { children: option.symbol })
|
|
4640
4747
|
]
|
|
4641
4748
|
},
|
|
4642
4749
|
option.address
|
|
@@ -4645,15 +4752,15 @@ function WithdrawFormStep({
|
|
|
4645
4752
|
}
|
|
4646
4753
|
)
|
|
4647
4754
|
] }),
|
|
4648
|
-
/* @__PURE__ */
|
|
4649
|
-
/* @__PURE__ */
|
|
4650
|
-
/* @__PURE__ */
|
|
4755
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-receive-col", children: [
|
|
4756
|
+
/* @__PURE__ */ jsx18("label", { className: "rs-withdraw-label", children: "Chain" }),
|
|
4757
|
+
/* @__PURE__ */ jsxs15(
|
|
4651
4758
|
"div",
|
|
4652
4759
|
{
|
|
4653
4760
|
className: "rs-withdraw-dropdown-container",
|
|
4654
4761
|
ref: chainDropdownRef,
|
|
4655
4762
|
children: [
|
|
4656
|
-
/* @__PURE__ */
|
|
4763
|
+
/* @__PURE__ */ jsxs15(
|
|
4657
4764
|
"button",
|
|
4658
4765
|
{
|
|
4659
4766
|
type: "button",
|
|
@@ -4663,8 +4770,8 @@ function WithdrawFormStep({
|
|
|
4663
4770
|
setShowTokenDropdown(false);
|
|
4664
4771
|
},
|
|
4665
4772
|
children: [
|
|
4666
|
-
/* @__PURE__ */
|
|
4667
|
-
getChainIcon(targetChain) && /* @__PURE__ */
|
|
4773
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-dropdown-value", children: [
|
|
4774
|
+
getChainIcon(targetChain) && /* @__PURE__ */ jsx18(
|
|
4668
4775
|
"img",
|
|
4669
4776
|
{
|
|
4670
4777
|
src: getChainIcon(targetChain),
|
|
@@ -4672,9 +4779,9 @@ function WithdrawFormStep({
|
|
|
4672
4779
|
className: "rs-withdraw-dropdown-icon"
|
|
4673
4780
|
}
|
|
4674
4781
|
),
|
|
4675
|
-
/* @__PURE__ */
|
|
4782
|
+
/* @__PURE__ */ jsx18("span", { children: targetChainName })
|
|
4676
4783
|
] }),
|
|
4677
|
-
/* @__PURE__ */
|
|
4784
|
+
/* @__PURE__ */ jsx18(
|
|
4678
4785
|
"svg",
|
|
4679
4786
|
{
|
|
4680
4787
|
viewBox: "0 0 24 24",
|
|
@@ -4685,7 +4792,7 @@ function WithdrawFormStep({
|
|
|
4685
4792
|
style: {
|
|
4686
4793
|
transform: showChainDropdown ? "rotate(180deg)" : void 0
|
|
4687
4794
|
},
|
|
4688
|
-
children: /* @__PURE__ */
|
|
4795
|
+
children: /* @__PURE__ */ jsx18(
|
|
4689
4796
|
"path",
|
|
4690
4797
|
{
|
|
4691
4798
|
strokeLinecap: "round",
|
|
@@ -4698,7 +4805,7 @@ function WithdrawFormStep({
|
|
|
4698
4805
|
]
|
|
4699
4806
|
}
|
|
4700
4807
|
),
|
|
4701
|
-
showChainDropdown && /* @__PURE__ */
|
|
4808
|
+
showChainDropdown && /* @__PURE__ */ jsx18("div", { className: "rs-withdraw-dropdown-menu", children: targetChains.map((chain) => /* @__PURE__ */ jsxs15(
|
|
4702
4809
|
"button",
|
|
4703
4810
|
{
|
|
4704
4811
|
type: "button",
|
|
@@ -4708,7 +4815,7 @@ function WithdrawFormStep({
|
|
|
4708
4815
|
setShowChainDropdown(false);
|
|
4709
4816
|
},
|
|
4710
4817
|
children: [
|
|
4711
|
-
getChainIcon(chain.id) && /* @__PURE__ */
|
|
4818
|
+
getChainIcon(chain.id) && /* @__PURE__ */ jsx18(
|
|
4712
4819
|
"img",
|
|
4713
4820
|
{
|
|
4714
4821
|
src: getChainIcon(chain.id),
|
|
@@ -4716,7 +4823,7 @@ function WithdrawFormStep({
|
|
|
4716
4823
|
className: "rs-withdraw-dropdown-icon"
|
|
4717
4824
|
}
|
|
4718
4825
|
),
|
|
4719
|
-
/* @__PURE__ */
|
|
4826
|
+
/* @__PURE__ */ jsx18("span", { children: chain.name })
|
|
4720
4827
|
]
|
|
4721
4828
|
},
|
|
4722
4829
|
chain.id
|
|
@@ -4726,13 +4833,13 @@ function WithdrawFormStep({
|
|
|
4726
4833
|
)
|
|
4727
4834
|
] })
|
|
4728
4835
|
] }),
|
|
4729
|
-
chainMismatch && /* @__PURE__ */
|
|
4730
|
-
/* @__PURE__ */
|
|
4836
|
+
chainMismatch && /* @__PURE__ */ jsxs15("div", { className: "rs-chain-switch", children: [
|
|
4837
|
+
/* @__PURE__ */ jsxs15("div", { className: "rs-chain-switch-text", children: [
|
|
4731
4838
|
"Switch to ",
|
|
4732
4839
|
getChainName(asset.chainId),
|
|
4733
4840
|
" to continue."
|
|
4734
4841
|
] }),
|
|
4735
|
-
switchChain && /* @__PURE__ */
|
|
4842
|
+
switchChain && /* @__PURE__ */ jsx18(
|
|
4736
4843
|
Button,
|
|
4737
4844
|
{
|
|
4738
4845
|
variant: "outline",
|
|
@@ -4743,15 +4850,15 @@ function WithdrawFormStep({
|
|
|
4743
4850
|
}
|
|
4744
4851
|
)
|
|
4745
4852
|
] }),
|
|
4746
|
-
error && /* @__PURE__ */
|
|
4747
|
-
/* @__PURE__ */
|
|
4853
|
+
error && /* @__PURE__ */ jsxs15("div", { className: "rs-withdraw-error", children: [
|
|
4854
|
+
/* @__PURE__ */ jsx18(
|
|
4748
4855
|
"svg",
|
|
4749
4856
|
{
|
|
4750
4857
|
viewBox: "0 0 24 24",
|
|
4751
4858
|
fill: "none",
|
|
4752
4859
|
stroke: "currentColor",
|
|
4753
4860
|
strokeWidth: "2",
|
|
4754
|
-
children: /* @__PURE__ */
|
|
4861
|
+
children: /* @__PURE__ */ jsx18(
|
|
4755
4862
|
"path",
|
|
4756
4863
|
{
|
|
4757
4864
|
strokeLinecap: "round",
|
|
@@ -4761,10 +4868,10 @@ function WithdrawFormStep({
|
|
|
4761
4868
|
)
|
|
4762
4869
|
}
|
|
4763
4870
|
),
|
|
4764
|
-
/* @__PURE__ */
|
|
4871
|
+
/* @__PURE__ */ jsx18("span", { children: error })
|
|
4765
4872
|
] })
|
|
4766
4873
|
] }),
|
|
4767
|
-
/* @__PURE__ */
|
|
4874
|
+
/* @__PURE__ */ jsx18("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx18(
|
|
4768
4875
|
Button,
|
|
4769
4876
|
{
|
|
4770
4877
|
onClick: handleWithdraw,
|
|
@@ -4774,7 +4881,7 @@ function WithdrawFormStep({
|
|
|
4774
4881
|
children: isBusy ? "Preparing..." : "Withdraw"
|
|
4775
4882
|
}
|
|
4776
4883
|
) }),
|
|
4777
|
-
/* @__PURE__ */
|
|
4884
|
+
/* @__PURE__ */ jsx18(PoweredBy, {})
|
|
4778
4885
|
] });
|
|
4779
4886
|
}
|
|
4780
4887
|
var init_WithdrawFormStep = __esm({
|
|
@@ -5024,9 +5131,10 @@ var init_safe = __esm({
|
|
|
5024
5131
|
|
|
5025
5132
|
// src/WithdrawFlow.tsx
|
|
5026
5133
|
import { useCallback as useCallback9, useEffect as useEffect10, useMemo as useMemo10, useState as useState11 } from "react";
|
|
5134
|
+
import { createPublicClient, http } from "viem";
|
|
5027
5135
|
import { walletClientToAccount as walletClientToAccount2 } from "@rhinestone/sdk";
|
|
5028
5136
|
import { parseUnits as parseUnits4 } from "viem";
|
|
5029
|
-
import { jsx as
|
|
5137
|
+
import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
5030
5138
|
function WithdrawFlow({
|
|
5031
5139
|
walletClient,
|
|
5032
5140
|
publicClient,
|
|
@@ -5071,6 +5179,12 @@ function WithdrawFlow({
|
|
|
5071
5179
|
setTargetToken(targetTokenProp);
|
|
5072
5180
|
}, [targetChainProp, targetTokenProp]);
|
|
5073
5181
|
const targetChainObj = useMemo10(() => CHAIN_BY_ID[targetChain], [targetChain]);
|
|
5182
|
+
const hasCustomSigner = Boolean(address && onWithdrawSign);
|
|
5183
|
+
const sourceChainObj = useMemo10(() => CHAIN_BY_ID[sourceChain], [sourceChain]);
|
|
5184
|
+
const effectivePublicClient = useMemo10(
|
|
5185
|
+
() => publicClient ?? (sourceChainObj ? createPublicClient({ chain: sourceChainObj, transport: http() }) : null),
|
|
5186
|
+
[publicClient, sourceChainObj]
|
|
5187
|
+
);
|
|
5074
5188
|
const asset = useMemo10(() => {
|
|
5075
5189
|
const symbol = getTokenSymbol(sourceToken, sourceChain);
|
|
5076
5190
|
const decimals = getTokenDecimalsByAddress(sourceToken, sourceChain);
|
|
@@ -5121,7 +5235,10 @@ function WithdrawFlow({
|
|
|
5121
5235
|
}, []);
|
|
5122
5236
|
const handleFormSubmit = useCallback9(
|
|
5123
5237
|
async (recipient, amountValue) => {
|
|
5124
|
-
if (!
|
|
5238
|
+
if (!address) {
|
|
5239
|
+
throw new Error("Wallet not connected");
|
|
5240
|
+
}
|
|
5241
|
+
if (!onWithdrawSign && (!walletClient || !publicClient)) {
|
|
5125
5242
|
throw new Error("Wallet not connected");
|
|
5126
5243
|
}
|
|
5127
5244
|
if (!targetChainObj) {
|
|
@@ -5129,7 +5246,7 @@ function WithdrawFlow({
|
|
|
5129
5246
|
}
|
|
5130
5247
|
setIsSubmitting(true);
|
|
5131
5248
|
try {
|
|
5132
|
-
const signerAccount = walletClientToAccount2(walletClient);
|
|
5249
|
+
const signerAccount = walletClient ? walletClientToAccount2(walletClient) : createViewOnlyAccount(address);
|
|
5133
5250
|
const sessionOwner = await resolveSessionOwner2(address);
|
|
5134
5251
|
const account = await createSmartAccount(
|
|
5135
5252
|
signerAccount,
|
|
@@ -5295,13 +5412,15 @@ function WithdrawFlow({
|
|
|
5295
5412
|
() => (connectWalletOptions ?? []).map((option) => option.address.toLowerCase()).join(","),
|
|
5296
5413
|
[connectWalletOptions]
|
|
5297
5414
|
);
|
|
5298
|
-
const hasConnectedWallet = Boolean(
|
|
5299
|
-
|
|
5415
|
+
const hasConnectedWallet = Boolean(
|
|
5416
|
+
walletClient && publicClient && address || hasCustomSigner
|
|
5417
|
+
);
|
|
5418
|
+
const showConnectStep = !hasConnectedWallet || !hasCustomSigner && hasConnectWalletOptions && !isConnectSelectionConfirmed;
|
|
5300
5419
|
useEffect10(() => {
|
|
5301
5420
|
setIsConnectSelectionConfirmed(false);
|
|
5302
5421
|
}, [connectWalletOptionsKey, selectedConnectAddressEffective]);
|
|
5303
5422
|
if (showConnectStep) {
|
|
5304
|
-
return /* @__PURE__ */
|
|
5423
|
+
return /* @__PURE__ */ jsx19("div", { className: "rs-modal-body", children: /* @__PURE__ */ jsx19(
|
|
5305
5424
|
ConnectStep,
|
|
5306
5425
|
{
|
|
5307
5426
|
walletOptions: connectWalletOptions,
|
|
@@ -5314,15 +5433,15 @@ function WithdrawFlow({
|
|
|
5314
5433
|
}
|
|
5315
5434
|
) });
|
|
5316
5435
|
}
|
|
5317
|
-
if (!
|
|
5436
|
+
if (!address || !effectivePublicClient) {
|
|
5318
5437
|
return null;
|
|
5319
5438
|
}
|
|
5320
|
-
return /* @__PURE__ */
|
|
5321
|
-
step.type === "form" && /* @__PURE__ */
|
|
5439
|
+
return /* @__PURE__ */ jsxs16("div", { className: "rs-modal-body", children: [
|
|
5440
|
+
step.type === "form" && /* @__PURE__ */ jsx19(
|
|
5322
5441
|
WithdrawFormStep,
|
|
5323
5442
|
{
|
|
5324
5443
|
walletClient,
|
|
5325
|
-
publicClient,
|
|
5444
|
+
publicClient: effectivePublicClient,
|
|
5326
5445
|
address,
|
|
5327
5446
|
safeAddress,
|
|
5328
5447
|
asset,
|
|
@@ -5340,7 +5459,7 @@ function WithdrawFlow({
|
|
|
5340
5459
|
onBalanceUsdChange: setTotalBalanceUsd
|
|
5341
5460
|
}
|
|
5342
5461
|
),
|
|
5343
|
-
step.type === "processing" && /* @__PURE__ */
|
|
5462
|
+
step.type === "processing" && /* @__PURE__ */ jsx19(
|
|
5344
5463
|
ProcessingStep,
|
|
5345
5464
|
{
|
|
5346
5465
|
smartAccount: step.smartAccount,
|
|
@@ -5382,7 +5501,7 @@ __export(WithdrawModalReown_exports, {
|
|
|
5382
5501
|
WithdrawModalReown: () => WithdrawModalReown
|
|
5383
5502
|
});
|
|
5384
5503
|
import { useCallback as useCallback10 } from "react";
|
|
5385
|
-
import { jsx as
|
|
5504
|
+
import { jsx as jsx20 } from "react/jsx-runtime";
|
|
5386
5505
|
function WithdrawModalWithReown(props) {
|
|
5387
5506
|
const reown = useReownWallet();
|
|
5388
5507
|
const resolved = useResolvedWallet(
|
|
@@ -5397,7 +5516,7 @@ function WithdrawModalWithReown(props) {
|
|
|
5397
5516
|
const handleConnect = useCallback10(() => {
|
|
5398
5517
|
reown.openConnect();
|
|
5399
5518
|
}, [reown.openConnect]);
|
|
5400
|
-
return /* @__PURE__ */
|
|
5519
|
+
return /* @__PURE__ */ jsx20(
|
|
5401
5520
|
WithdrawModalInner,
|
|
5402
5521
|
{
|
|
5403
5522
|
...props,
|
|
@@ -5414,7 +5533,7 @@ function WithdrawModalWithReown(props) {
|
|
|
5414
5533
|
);
|
|
5415
5534
|
}
|
|
5416
5535
|
function WithdrawModalReown(props) {
|
|
5417
|
-
return /* @__PURE__ */
|
|
5536
|
+
return /* @__PURE__ */ jsx20(ReownWalletProvider, { projectId: props.reownAppId, theme: props.theme, children: /* @__PURE__ */ jsx20(WithdrawModalWithReown, { ...props }) });
|
|
5418
5537
|
}
|
|
5419
5538
|
var init_WithdrawModalReown = __esm({
|
|
5420
5539
|
"src/WithdrawModalReown.tsx"() {
|
|
@@ -5434,13 +5553,13 @@ import {
|
|
|
5434
5553
|
lazy as lazy2,
|
|
5435
5554
|
Suspense as Suspense2
|
|
5436
5555
|
} from "react";
|
|
5437
|
-
import { jsx as
|
|
5556
|
+
import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
5438
5557
|
function WithdrawModal(props) {
|
|
5439
5558
|
const needsReown = !!props.reownAppId;
|
|
5440
5559
|
if (needsReown) {
|
|
5441
|
-
return /* @__PURE__ */
|
|
5560
|
+
return /* @__PURE__ */ jsx21(Suspense2, { fallback: null, children: /* @__PURE__ */ jsx21(ReownWithdrawInner, { ...props }) });
|
|
5442
5561
|
}
|
|
5443
|
-
return /* @__PURE__ */
|
|
5562
|
+
return /* @__PURE__ */ jsx21(WithdrawModalInner, { ...props });
|
|
5444
5563
|
}
|
|
5445
5564
|
function WithdrawModalInner({
|
|
5446
5565
|
walletClient,
|
|
@@ -5524,30 +5643,30 @@ function WithdrawModalInner({
|
|
|
5524
5643
|
const logoUrl = branding?.logoUrl ?? "https://github.com/rhinestonewtf.png";
|
|
5525
5644
|
const title = branding?.title ?? "Withdraw";
|
|
5526
5645
|
const canGoBack = currentStepIndex > 0 && currentStepIndex < 3 && backHandlerRef.current;
|
|
5527
|
-
return /* @__PURE__ */
|
|
5646
|
+
return /* @__PURE__ */ jsx21(
|
|
5528
5647
|
Modal,
|
|
5529
5648
|
{
|
|
5530
5649
|
isOpen,
|
|
5531
5650
|
onClose,
|
|
5532
5651
|
className,
|
|
5533
5652
|
inline,
|
|
5534
|
-
children: /* @__PURE__ */
|
|
5535
|
-
/* @__PURE__ */
|
|
5536
|
-
/* @__PURE__ */
|
|
5653
|
+
children: /* @__PURE__ */ jsxs17("div", { ref: modalRef, className: "rs-modal", children: [
|
|
5654
|
+
/* @__PURE__ */ jsxs17("div", { className: "rs-modal-header--redesigned", children: [
|
|
5655
|
+
/* @__PURE__ */ jsx21("div", { className: "rs-modal-header-nav-left", children: showBackButton && canGoBack && /* @__PURE__ */ jsx21(
|
|
5537
5656
|
"button",
|
|
5538
5657
|
{
|
|
5539
5658
|
type: "button",
|
|
5540
5659
|
className: "rs-modal-header-back",
|
|
5541
5660
|
"aria-label": "Go back",
|
|
5542
5661
|
onClick: handleBack,
|
|
5543
|
-
children: /* @__PURE__ */
|
|
5662
|
+
children: /* @__PURE__ */ jsx21(
|
|
5544
5663
|
"svg",
|
|
5545
5664
|
{
|
|
5546
5665
|
viewBox: "0 0 24 24",
|
|
5547
5666
|
fill: "none",
|
|
5548
5667
|
stroke: "currentColor",
|
|
5549
5668
|
strokeWidth: "2",
|
|
5550
|
-
children: /* @__PURE__ */
|
|
5669
|
+
children: /* @__PURE__ */ jsx21(
|
|
5551
5670
|
"path",
|
|
5552
5671
|
{
|
|
5553
5672
|
strokeLinecap: "round",
|
|
@@ -5559,9 +5678,9 @@ function WithdrawModalInner({
|
|
|
5559
5678
|
)
|
|
5560
5679
|
}
|
|
5561
5680
|
) }),
|
|
5562
|
-
/* @__PURE__ */
|
|
5563
|
-
/* @__PURE__ */
|
|
5564
|
-
showLogo && logoUrl && /* @__PURE__ */
|
|
5681
|
+
/* @__PURE__ */ jsxs17("div", { className: "rs-modal-header-nav-center", children: [
|
|
5682
|
+
/* @__PURE__ */ jsxs17("div", { className: "rs-modal-header-title-row", children: [
|
|
5683
|
+
showLogo && logoUrl && /* @__PURE__ */ jsx21(
|
|
5565
5684
|
"img",
|
|
5566
5685
|
{
|
|
5567
5686
|
src: logoUrl,
|
|
@@ -5572,8 +5691,8 @@ function WithdrawModalInner({
|
|
|
5572
5691
|
}
|
|
5573
5692
|
}
|
|
5574
5693
|
),
|
|
5575
|
-
/* @__PURE__ */
|
|
5576
|
-
showStepper && /* @__PURE__ */
|
|
5694
|
+
/* @__PURE__ */ jsx21("span", { className: "rs-modal-header-title", children: title }),
|
|
5695
|
+
showStepper && /* @__PURE__ */ jsx21("div", { className: "rs-modal-progress", style: { marginLeft: 8 }, children: [0, 1].map((i) => /* @__PURE__ */ jsx21(
|
|
5577
5696
|
"div",
|
|
5578
5697
|
{
|
|
5579
5698
|
className: `rs-modal-progress-dot ${i <= currentStepIndex ? "rs-modal-progress-dot--active" : "rs-modal-progress-dot--inactive"}`
|
|
@@ -5581,26 +5700,26 @@ function WithdrawModalInner({
|
|
|
5581
5700
|
i
|
|
5582
5701
|
)) })
|
|
5583
5702
|
] }),
|
|
5584
|
-
balanceTitle && totalBalanceUsd !== null && /* @__PURE__ */
|
|
5585
|
-
/* @__PURE__ */
|
|
5586
|
-
/* @__PURE__ */
|
|
5703
|
+
balanceTitle && totalBalanceUsd !== null && /* @__PURE__ */ jsxs17("div", { className: "rs-modal-header-balance", children: [
|
|
5704
|
+
/* @__PURE__ */ jsx21("span", { className: "rs-modal-header-balance-label", children: balanceTitle }),
|
|
5705
|
+
/* @__PURE__ */ jsx21("span", { className: "rs-modal-header-balance-value", children: currencyFormatter.format(totalBalanceUsd) })
|
|
5587
5706
|
] })
|
|
5588
5707
|
] }),
|
|
5589
|
-
/* @__PURE__ */
|
|
5708
|
+
/* @__PURE__ */ jsx21("div", { className: "rs-modal-header-nav-right", children: /* @__PURE__ */ jsx21(
|
|
5590
5709
|
"button",
|
|
5591
5710
|
{
|
|
5592
5711
|
type: "button",
|
|
5593
5712
|
onClick: onClose,
|
|
5594
5713
|
className: "rs-modal-close",
|
|
5595
5714
|
"aria-label": "Close",
|
|
5596
|
-
children: /* @__PURE__ */
|
|
5715
|
+
children: /* @__PURE__ */ jsx21(
|
|
5597
5716
|
"svg",
|
|
5598
5717
|
{
|
|
5599
5718
|
viewBox: "0 0 24 24",
|
|
5600
5719
|
fill: "none",
|
|
5601
5720
|
stroke: "currentColor",
|
|
5602
5721
|
strokeWidth: "2",
|
|
5603
|
-
children: /* @__PURE__ */
|
|
5722
|
+
children: /* @__PURE__ */ jsx21(
|
|
5604
5723
|
"path",
|
|
5605
5724
|
{
|
|
5606
5725
|
strokeLinecap: "round",
|
|
@@ -5613,7 +5732,7 @@ function WithdrawModalInner({
|
|
|
5613
5732
|
}
|
|
5614
5733
|
) })
|
|
5615
5734
|
] }),
|
|
5616
|
-
/* @__PURE__ */
|
|
5735
|
+
/* @__PURE__ */ jsx21(
|
|
5617
5736
|
WithdrawFlow,
|
|
5618
5737
|
{
|
|
5619
5738
|
walletClient,
|