@volr/react-ui 0.1.109 → 0.1.110
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 +1795 -352
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +63 -0
- package/dist/index.d.ts +63 -0
- package/dist/index.js +1655 -212
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var React13 = require('react');
|
|
4
4
|
var reactDom = require('react-dom');
|
|
5
5
|
var react = require('@volr/react');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -10,13 +10,130 @@ var qrcode_react = require('qrcode.react');
|
|
|
10
10
|
|
|
11
11
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
12
|
|
|
13
|
-
var
|
|
13
|
+
var React13__default = /*#__PURE__*/_interopDefault(React13);
|
|
14
14
|
|
|
15
15
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
16
16
|
var __esm = (fn, res) => function __init() {
|
|
17
17
|
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
18
18
|
};
|
|
19
19
|
|
|
20
|
+
// ../node_modules/viem/_esm/errors/version.js
|
|
21
|
+
var version;
|
|
22
|
+
var init_version = __esm({
|
|
23
|
+
"../node_modules/viem/_esm/errors/version.js"() {
|
|
24
|
+
version = "2.38.6";
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
|
|
28
|
+
// ../node_modules/viem/_esm/errors/base.js
|
|
29
|
+
function walk(err, fn) {
|
|
30
|
+
if (fn?.(err))
|
|
31
|
+
return err;
|
|
32
|
+
if (err && typeof err === "object" && "cause" in err && err.cause !== void 0)
|
|
33
|
+
return walk(err.cause, fn);
|
|
34
|
+
return fn ? null : err;
|
|
35
|
+
}
|
|
36
|
+
var errorConfig, BaseError;
|
|
37
|
+
var init_base = __esm({
|
|
38
|
+
"../node_modules/viem/_esm/errors/base.js"() {
|
|
39
|
+
init_version();
|
|
40
|
+
errorConfig = {
|
|
41
|
+
getDocsUrl: ({ docsBaseUrl, docsPath = "", docsSlug }) => docsPath ? `${docsBaseUrl ?? "https://viem.sh"}${docsPath}${docsSlug ? `#${docsSlug}` : ""}` : void 0,
|
|
42
|
+
version: `viem@${version}`
|
|
43
|
+
};
|
|
44
|
+
BaseError = class _BaseError extends Error {
|
|
45
|
+
constructor(shortMessage, args = {}) {
|
|
46
|
+
const details = (() => {
|
|
47
|
+
if (args.cause instanceof _BaseError)
|
|
48
|
+
return args.cause.details;
|
|
49
|
+
if (args.cause?.message)
|
|
50
|
+
return args.cause.message;
|
|
51
|
+
return args.details;
|
|
52
|
+
})();
|
|
53
|
+
const docsPath = (() => {
|
|
54
|
+
if (args.cause instanceof _BaseError)
|
|
55
|
+
return args.cause.docsPath || args.docsPath;
|
|
56
|
+
return args.docsPath;
|
|
57
|
+
})();
|
|
58
|
+
const docsUrl = errorConfig.getDocsUrl?.({ ...args, docsPath });
|
|
59
|
+
const message = [
|
|
60
|
+
shortMessage || "An error occurred.",
|
|
61
|
+
"",
|
|
62
|
+
...args.metaMessages ? [...args.metaMessages, ""] : [],
|
|
63
|
+
...docsUrl ? [`Docs: ${docsUrl}`] : [],
|
|
64
|
+
...details ? [`Details: ${details}`] : [],
|
|
65
|
+
...errorConfig.version ? [`Version: ${errorConfig.version}`] : []
|
|
66
|
+
].join("\n");
|
|
67
|
+
super(message, args.cause ? { cause: args.cause } : void 0);
|
|
68
|
+
Object.defineProperty(this, "details", {
|
|
69
|
+
enumerable: true,
|
|
70
|
+
configurable: true,
|
|
71
|
+
writable: true,
|
|
72
|
+
value: void 0
|
|
73
|
+
});
|
|
74
|
+
Object.defineProperty(this, "docsPath", {
|
|
75
|
+
enumerable: true,
|
|
76
|
+
configurable: true,
|
|
77
|
+
writable: true,
|
|
78
|
+
value: void 0
|
|
79
|
+
});
|
|
80
|
+
Object.defineProperty(this, "metaMessages", {
|
|
81
|
+
enumerable: true,
|
|
82
|
+
configurable: true,
|
|
83
|
+
writable: true,
|
|
84
|
+
value: void 0
|
|
85
|
+
});
|
|
86
|
+
Object.defineProperty(this, "shortMessage", {
|
|
87
|
+
enumerable: true,
|
|
88
|
+
configurable: true,
|
|
89
|
+
writable: true,
|
|
90
|
+
value: void 0
|
|
91
|
+
});
|
|
92
|
+
Object.defineProperty(this, "version", {
|
|
93
|
+
enumerable: true,
|
|
94
|
+
configurable: true,
|
|
95
|
+
writable: true,
|
|
96
|
+
value: void 0
|
|
97
|
+
});
|
|
98
|
+
Object.defineProperty(this, "name", {
|
|
99
|
+
enumerable: true,
|
|
100
|
+
configurable: true,
|
|
101
|
+
writable: true,
|
|
102
|
+
value: "BaseError"
|
|
103
|
+
});
|
|
104
|
+
this.details = details;
|
|
105
|
+
this.docsPath = docsPath;
|
|
106
|
+
this.metaMessages = args.metaMessages;
|
|
107
|
+
this.name = args.name ?? this.name;
|
|
108
|
+
this.shortMessage = shortMessage;
|
|
109
|
+
this.version = version;
|
|
110
|
+
}
|
|
111
|
+
walk(fn) {
|
|
112
|
+
return walk(this, fn);
|
|
113
|
+
}
|
|
114
|
+
};
|
|
115
|
+
}
|
|
116
|
+
});
|
|
117
|
+
|
|
118
|
+
// ../node_modules/viem/_esm/utils/unit/formatUnits.js
|
|
119
|
+
function formatUnits(value, decimals) {
|
|
120
|
+
let display = value.toString();
|
|
121
|
+
const negative = display.startsWith("-");
|
|
122
|
+
if (negative)
|
|
123
|
+
display = display.slice(1);
|
|
124
|
+
display = display.padStart(decimals, "0");
|
|
125
|
+
let [integer, fraction] = [
|
|
126
|
+
display.slice(0, display.length - decimals),
|
|
127
|
+
display.slice(display.length - decimals)
|
|
128
|
+
];
|
|
129
|
+
fraction = fraction.replace(/(0+)$/, "");
|
|
130
|
+
return `${negative ? "-" : ""}${integer || "0"}${fraction ? `.${fraction}` : ""}`;
|
|
131
|
+
}
|
|
132
|
+
var init_formatUnits = __esm({
|
|
133
|
+
"../node_modules/viem/_esm/utils/unit/formatUnits.js"() {
|
|
134
|
+
}
|
|
135
|
+
});
|
|
136
|
+
|
|
20
137
|
// ../node_modules/viem/_esm/constants/abis.js
|
|
21
138
|
var universalResolverErrors, erc20Abi;
|
|
22
139
|
var init_abis = __esm({
|
|
@@ -357,7 +474,9 @@ var en = {
|
|
|
357
474
|
common: {
|
|
358
475
|
back: "Back",
|
|
359
476
|
loading: "Loading...",
|
|
360
|
-
cancel: "Cancel"
|
|
477
|
+
cancel: "Cancel",
|
|
478
|
+
done: "Done",
|
|
479
|
+
tryAgain: "Try again"
|
|
361
480
|
},
|
|
362
481
|
login: {
|
|
363
482
|
title: "Sign in",
|
|
@@ -440,7 +559,50 @@ var en = {
|
|
|
440
559
|
title: "My Account",
|
|
441
560
|
walletAddress: "Wallet Address",
|
|
442
561
|
email: "Email",
|
|
443
|
-
logout: "Log out"
|
|
562
|
+
logout: "Log out",
|
|
563
|
+
totalBalance: "Total Balance",
|
|
564
|
+
noAssets: "No assets configured",
|
|
565
|
+
menu: {
|
|
566
|
+
assets: "Assets",
|
|
567
|
+
withdraw: "Withdraw",
|
|
568
|
+
payments: "Payment History",
|
|
569
|
+
account: "Account"
|
|
570
|
+
},
|
|
571
|
+
info: {
|
|
572
|
+
loginMethod: {
|
|
573
|
+
label: "Login Method",
|
|
574
|
+
email: "Email",
|
|
575
|
+
google: "Google",
|
|
576
|
+
twitter: "Twitter",
|
|
577
|
+
wallet: "Wallet"
|
|
578
|
+
},
|
|
579
|
+
connectedWallet: "Connected Wallet",
|
|
580
|
+
signerType: "Signer Type"
|
|
581
|
+
},
|
|
582
|
+
withdraw: {
|
|
583
|
+
title: "Withdraw",
|
|
584
|
+
selectToken: "Select token to withdraw",
|
|
585
|
+
toAddress: "Destination Address",
|
|
586
|
+
amount: "Amount",
|
|
587
|
+
available: "Available",
|
|
588
|
+
useConnectedWallet: "Use connected wallet",
|
|
589
|
+
confirm: "Confirm Withdrawal",
|
|
590
|
+
processing: "Processing withdrawal...",
|
|
591
|
+
success: "Withdrawal Successful",
|
|
592
|
+
sent: "sent",
|
|
593
|
+
failed: "Withdrawal Failed",
|
|
594
|
+
unknownError: "An unknown error occurred"
|
|
595
|
+
},
|
|
596
|
+
payments: {
|
|
597
|
+
payment: "Payment",
|
|
598
|
+
noPayments: "No payment history",
|
|
599
|
+
fetchError: "Failed to load payment history",
|
|
600
|
+
createdAt: "Created",
|
|
601
|
+
confirmedAt: "Confirmed",
|
|
602
|
+
token: "Token",
|
|
603
|
+
txHash: "Transaction",
|
|
604
|
+
referenceId: "Reference ID"
|
|
605
|
+
}
|
|
444
606
|
},
|
|
445
607
|
deposit: {
|
|
446
608
|
selectTitle: "Select asset to deposit",
|
|
@@ -461,7 +623,26 @@ var en = {
|
|
|
461
623
|
noAssets: "No deposit assets configured.",
|
|
462
624
|
otherToken: "Deposit with another token",
|
|
463
625
|
noToken: "Don't have this token?",
|
|
464
|
-
getOtherToken: "Deposit with another token"
|
|
626
|
+
getOtherToken: "Deposit with another token",
|
|
627
|
+
// Wallet transfer
|
|
628
|
+
useWallet: "Use connected wallet",
|
|
629
|
+
walletTransfer: {
|
|
630
|
+
title: "Transfer from Wallet",
|
|
631
|
+
selectWallet: "Select wallet",
|
|
632
|
+
noWallets: "No wallets detected",
|
|
633
|
+
connecting: "Connecting...",
|
|
634
|
+
balance: "Balance",
|
|
635
|
+
amount: "Amount",
|
|
636
|
+
amountPlaceholder: "Enter amount",
|
|
637
|
+
max: "MAX",
|
|
638
|
+
transfer: "Transfer",
|
|
639
|
+
transferring: "Transferring...",
|
|
640
|
+
success: "Transfer successful!",
|
|
641
|
+
insufficientBalance: "Insufficient balance",
|
|
642
|
+
invalidAmount: "Invalid amount",
|
|
643
|
+
wrongNetwork: "Please switch to {{network}}",
|
|
644
|
+
switchNetwork: "Switch Network"
|
|
645
|
+
}
|
|
465
646
|
},
|
|
466
647
|
sign: {
|
|
467
648
|
title: "Sign Request",
|
|
@@ -486,7 +667,9 @@ var ko = {
|
|
|
486
667
|
common: {
|
|
487
668
|
back: "\uB4A4\uB85C",
|
|
488
669
|
loading: "\uB85C\uB529 \uC911...",
|
|
489
|
-
cancel: "\uCDE8\uC18C"
|
|
670
|
+
cancel: "\uCDE8\uC18C",
|
|
671
|
+
done: "\uC644\uB8CC",
|
|
672
|
+
tryAgain: "\uB2E4\uC2DC \uC2DC\uB3C4"
|
|
490
673
|
},
|
|
491
674
|
login: {
|
|
492
675
|
title: "\uB85C\uADF8\uC778",
|
|
@@ -569,7 +752,50 @@ var ko = {
|
|
|
569
752
|
title: "\uB0B4 \uACC4\uC815",
|
|
570
753
|
walletAddress: "\uC9C0\uAC11 \uC8FC\uC18C",
|
|
571
754
|
email: "\uC774\uBA54\uC77C",
|
|
572
|
-
logout: "\uB85C\uADF8\uC544\uC6C3"
|
|
755
|
+
logout: "\uB85C\uADF8\uC544\uC6C3",
|
|
756
|
+
totalBalance: "\uCD1D \uC794\uACE0",
|
|
757
|
+
noAssets: "\uC124\uC815\uB41C \uC790\uC0B0\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
|
|
758
|
+
menu: {
|
|
759
|
+
assets: "\uC790\uC0B0",
|
|
760
|
+
withdraw: "\uCD9C\uAE08",
|
|
761
|
+
payments: "\uACB0\uC81C \uAE30\uB85D",
|
|
762
|
+
account: "\uACC4\uC815 \uC815\uBCF4"
|
|
763
|
+
},
|
|
764
|
+
info: {
|
|
765
|
+
loginMethod: {
|
|
766
|
+
label: "\uB85C\uADF8\uC778 \uBC29\uBC95",
|
|
767
|
+
email: "\uC774\uBA54\uC77C",
|
|
768
|
+
google: "\uAD6C\uAE00",
|
|
769
|
+
twitter: "\uD2B8\uC704\uD130",
|
|
770
|
+
wallet: "\uC9C0\uAC11"
|
|
771
|
+
},
|
|
772
|
+
connectedWallet: "\uC5F0\uACB0\uB41C \uC678\uBD80 \uC9C0\uAC11",
|
|
773
|
+
signerType: "\uC11C\uBA85 \uBC29\uC2DD"
|
|
774
|
+
},
|
|
775
|
+
withdraw: {
|
|
776
|
+
title: "\uCD9C\uAE08",
|
|
777
|
+
selectToken: "\uCD9C\uAE08\uD560 \uD1A0\uD070 \uC120\uD0DD",
|
|
778
|
+
toAddress: "\uBC1B\uB294 \uC8FC\uC18C",
|
|
779
|
+
amount: "\uAE08\uC561",
|
|
780
|
+
available: "\uC0AC\uC6A9 \uAC00\uB2A5",
|
|
781
|
+
useConnectedWallet: "\uC5F0\uACB0\uB41C \uC9C0\uAC11\uC73C\uB85C \uBCF4\uB0B4\uAE30",
|
|
782
|
+
confirm: "\uCD9C\uAE08 \uD655\uC778",
|
|
783
|
+
processing: "\uCD9C\uAE08 \uCC98\uB9AC \uC911...",
|
|
784
|
+
success: "\uCD9C\uAE08 \uC644\uB8CC",
|
|
785
|
+
sent: "\uC804\uC1A1\uB428",
|
|
786
|
+
failed: "\uCD9C\uAE08 \uC2E4\uD328",
|
|
787
|
+
unknownError: "\uC54C \uC218 \uC5C6\uB294 \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4"
|
|
788
|
+
},
|
|
789
|
+
payments: {
|
|
790
|
+
payment: "\uACB0\uC81C",
|
|
791
|
+
noPayments: "\uACB0\uC81C \uAE30\uB85D\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
|
|
792
|
+
fetchError: "\uACB0\uC81C \uAE30\uB85D\uC744 \uBD88\uB7EC\uC624\uC9C0 \uBABB\uD588\uC2B5\uB2C8\uB2E4",
|
|
793
|
+
createdAt: "\uC0DD\uC131\uC77C\uC2DC",
|
|
794
|
+
confirmedAt: "\uD655\uC815\uC77C\uC2DC",
|
|
795
|
+
token: "\uD1A0\uD070",
|
|
796
|
+
txHash: "\uD2B8\uB79C\uC7AD\uC158",
|
|
797
|
+
referenceId: "\uCC38\uC870 ID"
|
|
798
|
+
}
|
|
573
799
|
},
|
|
574
800
|
deposit: {
|
|
575
801
|
selectTitle: "\uCDA9\uC804\uD560 \uC790\uC0B0\uC744 \uC120\uD0DD\uD558\uC138\uC694",
|
|
@@ -590,7 +816,26 @@ var ko = {
|
|
|
590
816
|
noAssets: "\uC124\uC815\uB41C \uCDA9\uC804 \uC790\uC0B0\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.",
|
|
591
817
|
otherToken: "\uB2E4\uB978 \uD1A0\uD070\uC73C\uB85C \uCDA9\uC804\uD558\uAE30",
|
|
592
818
|
noToken: "\uC774 \uD1A0\uD070\uC774 \uC5C6\uC73C\uC2E0\uAC00\uC694?",
|
|
593
|
-
getOtherToken: "\uB2E4\uB978 \uD1A0\uD070\uC73C\uB85C \uC785\uAE08\uD558\uAE30"
|
|
819
|
+
getOtherToken: "\uB2E4\uB978 \uD1A0\uD070\uC73C\uB85C \uC785\uAE08\uD558\uAE30",
|
|
820
|
+
// Wallet transfer
|
|
821
|
+
useWallet: "\uC5F0\uACB0\uB41C \uC9C0\uAC11\uC73C\uB85C \uC785\uAE08",
|
|
822
|
+
walletTransfer: {
|
|
823
|
+
title: "\uC9C0\uAC11\uC5D0\uC11C \uC804\uC1A1",
|
|
824
|
+
selectWallet: "\uC9C0\uAC11 \uC120\uD0DD",
|
|
825
|
+
noWallets: "\uAC10\uC9C0\uB41C \uC9C0\uAC11\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
|
|
826
|
+
connecting: "\uC5F0\uACB0 \uC911...",
|
|
827
|
+
balance: "\uC794\uACE0",
|
|
828
|
+
amount: "\uAE08\uC561",
|
|
829
|
+
amountPlaceholder: "\uAE08\uC561 \uC785\uB825",
|
|
830
|
+
max: "\uCD5C\uB300",
|
|
831
|
+
transfer: "\uC804\uC1A1",
|
|
832
|
+
transferring: "\uC804\uC1A1 \uC911...",
|
|
833
|
+
success: "\uC804\uC1A1 \uC644\uB8CC!",
|
|
834
|
+
insufficientBalance: "\uC794\uACE0 \uBD80\uC871",
|
|
835
|
+
invalidAmount: "\uC798\uBABB\uB41C \uAE08\uC561",
|
|
836
|
+
wrongNetwork: "{{network}}\uB85C \uB124\uD2B8\uC6CC\uD06C\uB97C \uBCC0\uACBD\uD574\uC8FC\uC138\uC694",
|
|
837
|
+
switchNetwork: "\uB124\uD2B8\uC6CC\uD06C \uBCC0\uACBD"
|
|
838
|
+
}
|
|
594
839
|
},
|
|
595
840
|
sign: {
|
|
596
841
|
title: "\uC11C\uBA85 \uC694\uCCAD",
|
|
@@ -618,13 +863,13 @@ var translations = {
|
|
|
618
863
|
function getTranslations(locale = "en") {
|
|
619
864
|
return translations[locale] || translations.en;
|
|
620
865
|
}
|
|
621
|
-
var I18nContext =
|
|
866
|
+
var I18nContext = React13.createContext(null);
|
|
622
867
|
function interpolate(text, params) {
|
|
623
868
|
if (!params) return text;
|
|
624
869
|
return text.replace(/\{\{(\w+)\}\}/g, (_, key) => params[key] ?? `{{${key}}}`);
|
|
625
870
|
}
|
|
626
871
|
function useI18n() {
|
|
627
|
-
const context =
|
|
872
|
+
const context = React13.useContext(I18nContext);
|
|
628
873
|
if (!context) {
|
|
629
874
|
return {
|
|
630
875
|
locale: "en",
|
|
@@ -659,9 +904,9 @@ function detectLocale() {
|
|
|
659
904
|
return lang.startsWith("ko") ? "ko" : "en";
|
|
660
905
|
}
|
|
661
906
|
function I18nProvider({ children }) {
|
|
662
|
-
const [locale, setLocale] =
|
|
663
|
-
const translations2 =
|
|
664
|
-
const t =
|
|
907
|
+
const [locale, setLocale] = React13.useState(detectLocale());
|
|
908
|
+
const translations2 = React13.useMemo(() => getTranslations(locale), [locale]);
|
|
909
|
+
const t = React13.useMemo(() => {
|
|
665
910
|
return (key, params) => {
|
|
666
911
|
const keys = key.split(".");
|
|
667
912
|
let value2 = translations2;
|
|
@@ -678,7 +923,7 @@ function I18nProvider({ children }) {
|
|
|
678
923
|
return typeof value2 === "string" ? interpolate(value2, params) : key;
|
|
679
924
|
};
|
|
680
925
|
}, [translations2]);
|
|
681
|
-
const value =
|
|
926
|
+
const value = React13.useMemo(
|
|
682
927
|
() => ({
|
|
683
928
|
locale,
|
|
684
929
|
translations: translations2,
|
|
@@ -690,9 +935,9 @@ function I18nProvider({ children }) {
|
|
|
690
935
|
return /* @__PURE__ */ jsxRuntime.jsx(I18nContext.Provider, { value, children });
|
|
691
936
|
}
|
|
692
937
|
var useTranslation = useI18n;
|
|
693
|
-
var VolrModalContext =
|
|
938
|
+
var VolrModalContext = React13.createContext(null);
|
|
694
939
|
var useVolrModal = () => {
|
|
695
|
-
const context =
|
|
940
|
+
const context = React13.useContext(VolrModalContext);
|
|
696
941
|
if (!context) {
|
|
697
942
|
throw new Error("useVolrModal must be used within VolrUIProvider");
|
|
698
943
|
}
|
|
@@ -701,17 +946,17 @@ var useVolrModal = () => {
|
|
|
701
946
|
var VolrModalProvider = ({
|
|
702
947
|
children
|
|
703
948
|
}) => {
|
|
704
|
-
const [isOpen, setIsOpen] =
|
|
705
|
-
const [mode, setMode] =
|
|
706
|
-
const [asset, setAsset] =
|
|
707
|
-
const [paymentOptions, setPaymentOptions] =
|
|
708
|
-
const open =
|
|
949
|
+
const [isOpen, setIsOpen] = React13.useState(false);
|
|
950
|
+
const [mode, setMode] = React13.useState("account");
|
|
951
|
+
const [asset, setAsset] = React13.useState(null);
|
|
952
|
+
const [paymentOptions, setPaymentOptions] = React13.useState(null);
|
|
953
|
+
const open = React13.useCallback((options) => {
|
|
709
954
|
setMode(options?.mode ?? "account");
|
|
710
955
|
setAsset(options?.asset ?? null);
|
|
711
956
|
setPaymentOptions(options?.payment ?? null);
|
|
712
957
|
setIsOpen(true);
|
|
713
958
|
}, []);
|
|
714
|
-
const close =
|
|
959
|
+
const close = React13.useCallback(() => {
|
|
715
960
|
setIsOpen(false);
|
|
716
961
|
setAsset(null);
|
|
717
962
|
setPaymentOptions(null);
|
|
@@ -725,11 +970,11 @@ function cn(...inputs) {
|
|
|
725
970
|
return twMerge(clsx.clsx(inputs));
|
|
726
971
|
}
|
|
727
972
|
function useMediaQuery(query) {
|
|
728
|
-
const [matches, setMatches] =
|
|
973
|
+
const [matches, setMatches] = React13.useState(() => {
|
|
729
974
|
if (typeof window === "undefined") return false;
|
|
730
975
|
return window.matchMedia(query).matches;
|
|
731
976
|
});
|
|
732
|
-
|
|
977
|
+
React13.useEffect(() => {
|
|
733
978
|
if (typeof window === "undefined") return;
|
|
734
979
|
const mql = window.matchMedia(query);
|
|
735
980
|
const handler = (event) => setMatches(event.matches);
|
|
@@ -741,14 +986,14 @@ function useMediaQuery(query) {
|
|
|
741
986
|
}
|
|
742
987
|
|
|
743
988
|
// src/generated/volr-sdk-css.ts
|
|
744
|
-
var VOLR_SDK_CSS = '/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--volr-tw-translate-x:0;--volr-tw-translate-y:0;--volr-tw-translate-z:0;--volr-tw-space-y-reverse:0;--volr-tw-border-style:solid;--volr-tw-gradient-position:initial;--volr-tw-gradient-from:#0000;--volr-tw-gradient-via:#0000;--volr-tw-gradient-to:#0000;--volr-tw-gradient-stops:initial;--volr-tw-gradient-via-stops:initial;--volr-tw-gradient-from-position:0%;--volr-tw-gradient-via-position:50%;--volr-tw-gradient-to-position:100%;--volr-tw-leading:initial;--volr-tw-font-weight:initial;--volr-tw-tracking:initial;--volr-tw-shadow:0 0 #0000;--volr-tw-shadow-color:initial;--volr-tw-shadow-alpha:100%;--volr-tw-inset-shadow:0 0 #0000;--volr-tw-inset-shadow-color:initial;--volr-tw-inset-shadow-alpha:100%;--volr-tw-ring-color:initial;--volr-tw-ring-shadow:0 0 #0000;--volr-tw-inset-ring-color:initial;--volr-tw-inset-ring-shadow:0 0 #0000;--volr-tw-ring-inset:initial;--volr-tw-ring-offset-width:0px;--volr-tw-ring-offset-color:#fff;--volr-tw-ring-offset-shadow:0 0 #0000;--volr-tw-blur:initial;--volr-tw-brightness:initial;--volr-tw-contrast:initial;--volr-tw-grayscale:initial;--volr-tw-hue-rotate:initial;--volr-tw-invert:initial;--volr-tw-opacity:initial;--volr-tw-saturate:initial;--volr-tw-sepia:initial;--volr-tw-drop-shadow:initial;--volr-tw-drop-shadow-color:initial;--volr-tw-drop-shadow-alpha:100%;--volr-tw-drop-shadow-size:initial;--volr-tw-duration:initial;--volr-tw-ease:initial}}}@layer theme{:root,:host{--volr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-emerald-600:oklch(59.6% .145 163.225);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-wide:.025em;--volr-leading-relaxed:1.625;--volr-radius-md:.375rem;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-spin:spin 1s linear infinite;--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--volr-default-font-family:var(--volr-font-sans);--volr-default-mono-font-family:var(--volr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--volr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--volr-default-font-feature-settings,normal);font-variation-settings:var(--volr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--volr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--volr-default-mono-font-feature-settings,normal);font-variation-settings:var(--volr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{--volr-primary-color:var(--volr-accent-color,#303030);--volr-font-family:var(--volr-custom-font,inherit);--volr-bg:#fff;--volr-bg-secondary:#f8fafc;--volr-bg-tertiary:#f1f5f9;--volr-text:#0f172a;--volr-text-secondary:#475569;--volr-text-muted:#94a3b8;--volr-border:#e2e8f0;--volr-border-strong:#cbd5e1;--volr-hover-bg:#f8fafc;--volr-error-bg:#fef2f2;--volr-error-border:#fecaca;--volr-error-text:#991b1b}:host([data-theme=dark]){--volr-bg:#1c1c1e;--volr-bg-secondary:#2c2c2e;--volr-bg-tertiary:#3a3a3c;--volr-text:#f5f5f7;--volr-text-secondary:#c7c7cc;--volr-text-muted:#8e8e93;--volr-border:#3a3a3c;--volr-border-strong:#48484a;--volr-hover-bg:#2c2c2e;--volr-error-bg:#3c1f1f;--volr-error-border:#7f1d1d;--volr-error-text:#fca5a5}*,:before,:after{box-sizing:border-box}*{font-family:var(--volr-font-family);color:var(--volr-text)}button,input,select,textarea{color:var(--volr-text);background-color:#0000}button{cursor:pointer;background-color:#0000}input::placeholder{color:var(--volr-text-muted)}h1,h2,h3{color:var(--volr-text);margin:0;font-weight:700}h1{font-size:1.875rem;line-height:2.25rem}h2{font-size:1.5rem;line-height:2rem}h3{font-size:1.25rem;line-height:1.75rem}p{margin:0}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--volr-tw-border-style);padding:calc(var(--volr-spacing)*7);--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow);background-color:var(--volr-bg);border-width:1px;border-color:var(--volr-border-strong);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-text-muted);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{background-color:var(--volr-hover-bg);color:var(--volr-text-secondary)}.volr-dialog-close:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}.volr-email-input{border:1px solid var(--volr-border-strong);background-color:var(--volr-bg);width:100%;color:var(--volr-text);border-radius:.5rem;outline:none;padding:.75rem .75rem .75rem 2.75rem;font-size:1rem;line-height:1.5}.volr-email-input::placeholder{color:var(--volr-text-muted)}.volr-email-input:focus{border-color:var(--volr-border-strong);box-shadow:0 0 0 2px var(--volr-border-strong)}.volr-option-button{border:1px solid var(--volr-border);background-color:var(--volr-bg);width:100%;color:var(--volr-text);cursor:pointer;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out;display:flex}.volr-option-button:hover{background-color:var(--volr-hover-bg);border-color:var(--volr-border)}.volr-option-button:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}}@layer utilities{.volr\\:pointer-events-auto{pointer-events:auto}.volr\\:pointer-events-none{pointer-events:none}.volr\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:-right-4{right:calc(var(--volr-spacing)*-4)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:bottom-0{bottom:calc(var(--volr-spacing)*0)}.volr\\:-left-4{left:calc(var(--volr-spacing)*-4)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-4{margin-top:calc(var(--volr-spacing)*4)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1{height:calc(var(--volr-spacing)*1)}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-3{height:calc(var(--volr-spacing)*3)}.volr\\:h-4{height:calc(var(--volr-spacing)*4)}.volr\\:h-5{height:calc(var(--volr-spacing)*5)}.volr\\:h-6{height:calc(var(--volr-spacing)*6)}.volr\\:h-7{height:calc(var(--volr-spacing)*7)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-12{height:calc(var(--volr-spacing)*12)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-16{height:calc(var(--volr-spacing)*16)}.volr\\:h-20{height:calc(var(--volr-spacing)*20)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-\\[0\\.8em\\]{height:.8em}.volr\\:h-\\[200px\\]{height:200px}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-36{max-height:calc(var(--volr-spacing)*36)}.volr\\:max-h-48{max-height:calc(var(--volr-spacing)*48)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-64{max-height:calc(var(--volr-spacing)*64)}.volr\\:max-h-96{max-height:calc(var(--volr-spacing)*96)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:min-h-\\[500px\\]{min-height:500px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-3{width:calc(var(--volr-spacing)*3)}.volr\\:w-4{width:calc(var(--volr-spacing)*4)}.volr\\:w-5{width:calc(var(--volr-spacing)*5)}.volr\\:w-6{width:calc(var(--volr-spacing)*6)}.volr\\:w-7{width:calc(var(--volr-spacing)*7)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-14{width:calc(var(--volr-spacing)*14)}.volr\\:w-16{width:calc(var(--volr-spacing)*16)}.volr\\:w-20{width:calc(var(--volr-spacing)*20)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-32{width:calc(var(--volr-spacing)*32)}.volr\\:w-36{width:calc(var(--volr-spacing)*36)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-\\[200px\\]{width:200px}.volr\\:w-auto{width:auto}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0,.volr\\:shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--volr-tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--volr-tw-translate-x)var(--volr-tw-translate-y)}.volr\\:rotate-90{rotate:90deg}.volr\\:rotate-180{rotate:180deg}.volr\\:animate-\\[volrFadeIn_0\\.2s_ease-out\\]{animation:.2s ease-out volrFadeIn}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:list-inside{list-style-position:inside}.volr\\:list-decimal{list-style-type:decimal}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-1>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*1)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*1)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-2>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-4>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*4)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*4)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-6>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*6)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*6)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-8>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*8)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*8)*calc(1 - var(--volr-tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-auto{overflow:auto}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-x-auto{overflow-x:auto}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded{border-radius:.25rem}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-md{border-radius:var(--volr-radius-md)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-2xl{border-top-left-radius:var(--volr-radius-2xl);border-top-right-radius:var(--volr-radius-2xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:border{border-style:var(--volr-tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--volr-tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--volr-tw-border-style);border-width:4px}.volr\\:border-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-t-2{border-top-style:var(--volr-tw-border-style);border-top-width:2px}.volr\\:border-b{border-bottom-style:var(--volr-tw-border-style);border-bottom-width:1px}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-slate-200{border-color:var(--volr-color-slate-200)}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:border-t-slate-600{border-top-color:var(--volr-color-slate-600)}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-green-50{background-color:var(--volr-color-green-50)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-slate-50{background-color:var(--volr-color-slate-50)}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-slate-900{background-color:var(--volr-color-slate-900)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right in oklab}}.volr\\:bg-linear-to-br{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:from-emerald-400{--volr-tw-gradient-from:var(--volr-color-emerald-400);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:from-emerald-500{--volr-tw-gradient-from:var(--volr-color-emerald-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-teal-500{--volr-tw-gradient-to:var(--volr-color-teal-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:object-cover{object-fit:cover}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-1\\.5{padding-inline:calc(var(--volr-spacing)*1.5)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-2\\.5{padding-block:calc(var(--volr-spacing)*2.5)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-2{padding-top:calc(var(--volr-spacing)*2)}.volr\\:pt-3{padding-top:calc(var(--volr-spacing)*3)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pb-2{padding-bottom:calc(var(--volr-spacing)*2)}.volr\\:pb-4{padding-bottom:calc(var(--volr-spacing)*4)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:text-right{text-align:right}.volr\\:align-baseline{vertical-align:baseline}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--volr-tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--volr-tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--volr-tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--volr-tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--volr-tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--volr-tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--volr-tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-relaxed{--volr-tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--volr-tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--volr-tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--volr-tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-wide{--volr-tw-tracking:var(--volr-tracking-wide);letter-spacing:var(--volr-tracking-wide)}.volr\\:break-all{word-break:break-all}.volr\\:text-emerald-600{color:var(--volr-color-emerald-600)}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-slate-100{color:var(--volr-color-slate-100)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:capitalize{text-transform:capitalize}.volr\\:uppercase{text-transform:uppercase}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.volr\\:opacity-50{opacity:.5}.volr\\:opacity-75{opacity:.75}.volr\\:shadow-2xl{--volr-tw-shadow:0 25px 50px -12px var(--volr-tw-shadow-color,#00000040);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-\\[0_-8px_30px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\]{--volr-tw-shadow:0 -8px 30px var(--volr-tw-shadow-color,#0003);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-lg{--volr-tw-shadow:0 10px 15px -3px var(--volr-tw-shadow-color,#0000001a),0 4px 6px -4px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-md{--volr-tw-shadow:0 4px 6px -1px var(--volr-tw-shadow-color,#0000001a),0 2px 4px -2px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-sm{--volr-tw-shadow:0 1px 3px 0 var(--volr-tw-shadow-color,#0000001a),0 1px 2px -1px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-xl{--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--volr-tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--volr-tw-blur:blur(var(--volr-blur-2xl));filter:var(--volr-tw-blur,)var(--volr-tw-brightness,)var(--volr-tw-contrast,)var(--volr-tw-grayscale,)var(--volr-tw-hue-rotate,)var(--volr-tw-invert,)var(--volr-tw-saturate,)var(--volr-tw-sepia,)var(--volr-tw-drop-shadow,)}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--volr-tw-gradient-from,--volr-tw-gradient-via,--volr-tw-gradient-to;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-300{--volr-tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--volr-tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--volr-tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--volr-tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:border-slate-300:hover{border-color:var(--volr-color-slate-300)}.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}.volr\\:hover\\:text-slate-700:hover{color:var(--volr-color-slate-700)}}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.volr\\:disabled\\:opacity-50:disabled{opacity:.5}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.volr-text-secondary{color:var(--volr-text-secondary)}.volr-text-muted{color:var(--volr-text-muted)}.volr-bg-secondary{background-color:var(--volr-bg-secondary)}.volr-bg-tertiary{background-color:var(--volr-bg-tertiary)}.volr-border{border-color:var(--volr-border)}.volr-border-strong{border-color:var(--volr-border-strong)}.volr-divider-line{background-color:var(--volr-border)}.volr-error{background-color:var(--volr-error-bg);border-color:var(--volr-error-border);color:var(--volr-error-text)}.volr-hover:hover{background-color:var(--volr-hover-bg)}.volr-surface{background-color:var(--volr-bg)}}@property --volr-tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --volr-tw-gradient-position{syntax:"*";inherits:false}@property --volr-tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-via-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --volr-tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --volr-tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --volr-tw-leading{syntax:"*";inherits:false}@property --volr-tw-font-weight{syntax:"*";inherits:false}@property --volr-tw-tracking{syntax:"*";inherits:false}@property --volr-tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-shadow-color{syntax:"*";inherits:false}@property --volr-tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-shadow-color{syntax:"*";inherits:false}@property --volr-tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-ring-color{syntax:"*";inherits:false}@property --volr-tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-ring-color{syntax:"*";inherits:false}@property --volr-tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-ring-inset{syntax:"*";inherits:false}@property --volr-tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --volr-tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --volr-tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-blur{syntax:"*";inherits:false}@property --volr-tw-brightness{syntax:"*";inherits:false}@property --volr-tw-contrast{syntax:"*";inherits:false}@property --volr-tw-grayscale{syntax:"*";inherits:false}@property --volr-tw-hue-rotate{syntax:"*";inherits:false}@property --volr-tw-invert{syntax:"*";inherits:false}@property --volr-tw-opacity{syntax:"*";inherits:false}@property --volr-tw-saturate{syntax:"*";inherits:false}@property --volr-tw-sepia{syntax:"*";inherits:false}@property --volr-tw-drop-shadow{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-color{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-drop-shadow-size{syntax:"*";inherits:false}@property --volr-tw-duration{syntax:"*";inherits:false}@property --volr-tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}';
|
|
989
|
+
var VOLR_SDK_CSS = '/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--volr-tw-translate-x:0;--volr-tw-translate-y:0;--volr-tw-translate-z:0;--volr-tw-space-y-reverse:0;--volr-tw-border-style:solid;--volr-tw-gradient-position:initial;--volr-tw-gradient-from:#0000;--volr-tw-gradient-via:#0000;--volr-tw-gradient-to:#0000;--volr-tw-gradient-stops:initial;--volr-tw-gradient-via-stops:initial;--volr-tw-gradient-from-position:0%;--volr-tw-gradient-via-position:50%;--volr-tw-gradient-to-position:100%;--volr-tw-leading:initial;--volr-tw-font-weight:initial;--volr-tw-tracking:initial;--volr-tw-shadow:0 0 #0000;--volr-tw-shadow-color:initial;--volr-tw-shadow-alpha:100%;--volr-tw-inset-shadow:0 0 #0000;--volr-tw-inset-shadow-color:initial;--volr-tw-inset-shadow-alpha:100%;--volr-tw-ring-color:initial;--volr-tw-ring-shadow:0 0 #0000;--volr-tw-inset-ring-color:initial;--volr-tw-inset-ring-shadow:0 0 #0000;--volr-tw-ring-inset:initial;--volr-tw-ring-offset-width:0px;--volr-tw-ring-offset-color:#fff;--volr-tw-ring-offset-shadow:0 0 #0000;--volr-tw-blur:initial;--volr-tw-brightness:initial;--volr-tw-contrast:initial;--volr-tw-grayscale:initial;--volr-tw-hue-rotate:initial;--volr-tw-invert:initial;--volr-tw-opacity:initial;--volr-tw-saturate:initial;--volr-tw-sepia:initial;--volr-tw-drop-shadow:initial;--volr-tw-drop-shadow-color:initial;--volr-tw-drop-shadow-alpha:100%;--volr-tw-drop-shadow-size:initial;--volr-tw-duration:initial;--volr-tw-ease:initial}}}@layer theme{:root,:host{--volr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-100:oklch(93.6% .032 17.717);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-amber-50:oklch(98.7% .022 95.277);--volr-color-amber-200:oklch(92.4% .12 95.746);--volr-color-amber-700:oklch(55.5% .163 48.998);--volr-color-yellow-100:oklch(97.3% .071 103.193);--volr-color-yellow-700:oklch(55.4% .135 66.442);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-100:oklch(96.2% .044 156.743);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-green-700:oklch(52.7% .154 150.069);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-emerald-600:oklch(59.6% .145 163.225);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-blue-100:oklch(93.2% .032 255.585);--volr-color-blue-700:oklch(48.8% .243 264.376);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-3xl:1.875rem;--volr-text-3xl--line-height:calc(2.25/1.875);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-wide:.025em;--volr-leading-relaxed:1.625;--volr-radius-md:.375rem;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-spin:spin 1s linear infinite;--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--volr-default-font-family:var(--volr-font-sans);--volr-default-mono-font-family:var(--volr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--volr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--volr-default-font-feature-settings,normal);font-variation-settings:var(--volr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--volr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--volr-default-mono-font-feature-settings,normal);font-variation-settings:var(--volr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{--volr-primary-color:var(--volr-accent-color,#303030);--volr-font-family:var(--volr-custom-font,inherit);--volr-bg:#fff;--volr-bg-secondary:#f8fafc;--volr-bg-tertiary:#f1f5f9;--volr-text:#0f172a;--volr-text-secondary:#475569;--volr-text-muted:#94a3b8;--volr-border:#e2e8f0;--volr-border-strong:#cbd5e1;--volr-hover-bg:#f8fafc;--volr-error-bg:#fef2f2;--volr-error-border:#fecaca;--volr-error-text:#991b1b}:host([data-theme=dark]){--volr-bg:#1c1c1e;--volr-bg-secondary:#2c2c2e;--volr-bg-tertiary:#3a3a3c;--volr-text:#f5f5f7;--volr-text-secondary:#c7c7cc;--volr-text-muted:#8e8e93;--volr-border:#3a3a3c;--volr-border-strong:#48484a;--volr-hover-bg:#2c2c2e;--volr-error-bg:#3c1f1f;--volr-error-border:#7f1d1d;--volr-error-text:#fca5a5}*,:before,:after{box-sizing:border-box}*{font-family:var(--volr-font-family);color:var(--volr-text)}button,input,select,textarea{color:var(--volr-text);background-color:#0000}button{cursor:pointer;background-color:#0000}input::placeholder{color:var(--volr-text-muted)}h1,h2,h3{color:var(--volr-text);margin:0;font-weight:700}h1{font-size:1.875rem;line-height:2.25rem}h2{font-size:1.5rem;line-height:2rem}h3{font-size:1.25rem;line-height:1.75rem}p{margin:0}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--volr-tw-border-style);padding:calc(var(--volr-spacing)*7);--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow);background-color:var(--volr-bg);border-width:1px;border-color:var(--volr-border-strong);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-text-muted);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{background-color:var(--volr-hover-bg);color:var(--volr-text-secondary)}.volr-dialog-close:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}.volr-email-input{border:1px solid var(--volr-border-strong);background-color:var(--volr-bg);width:100%;color:var(--volr-text);border-radius:.5rem;outline:none;padding:.75rem .75rem .75rem 2.75rem;font-size:1rem;line-height:1.5}.volr-email-input::placeholder{color:var(--volr-text-muted)}.volr-email-input:focus{border-color:var(--volr-border-strong);box-shadow:0 0 0 2px var(--volr-border-strong)}.volr-option-button{border:1px solid var(--volr-border);background-color:var(--volr-bg);width:100%;color:var(--volr-text);cursor:pointer;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out;display:flex}.volr-option-button:hover{background-color:var(--volr-hover-bg);border-color:var(--volr-border)}.volr-option-button:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}}@layer utilities{.volr\\:pointer-events-auto{pointer-events:auto}.volr\\:pointer-events-none{pointer-events:none}.volr\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:right-3{right:calc(var(--volr-spacing)*3)}.volr\\:bottom-3{bottom:calc(var(--volr-spacing)*3)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-4{margin-top:calc(var(--volr-spacing)*4)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.volr\\:block{display:block}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1{height:calc(var(--volr-spacing)*1)}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-3{height:calc(var(--volr-spacing)*3)}.volr\\:h-4{height:calc(var(--volr-spacing)*4)}.volr\\:h-5{height:calc(var(--volr-spacing)*5)}.volr\\:h-6{height:calc(var(--volr-spacing)*6)}.volr\\:h-7{height:calc(var(--volr-spacing)*7)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-9{height:calc(var(--volr-spacing)*9)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-12{height:calc(var(--volr-spacing)*12)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-16{height:calc(var(--volr-spacing)*16)}.volr\\:h-20{height:calc(var(--volr-spacing)*20)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-\\[0\\.8em\\]{height:.8em}.volr\\:h-\\[200px\\]{height:200px}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-48{max-height:calc(var(--volr-spacing)*48)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-64{max-height:calc(var(--volr-spacing)*64)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:min-h-\\[500px\\]{min-height:500px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-3{width:calc(var(--volr-spacing)*3)}.volr\\:w-4{width:calc(var(--volr-spacing)*4)}.volr\\:w-5{width:calc(var(--volr-spacing)*5)}.volr\\:w-6{width:calc(var(--volr-spacing)*6)}.volr\\:w-7{width:calc(var(--volr-spacing)*7)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-14{width:calc(var(--volr-spacing)*14)}.volr\\:w-16{width:calc(var(--volr-spacing)*16)}.volr\\:w-20{width:calc(var(--volr-spacing)*20)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-32{width:calc(var(--volr-spacing)*32)}.volr\\:w-36{width:calc(var(--volr-spacing)*36)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-\\[200px\\]{width:200px}.volr\\:w-auto{width:auto}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0,.volr\\:shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--volr-tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--volr-tw-translate-x)var(--volr-tw-translate-y)}.volr\\:rotate-90{rotate:90deg}.volr\\:rotate-180{rotate:180deg}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:list-inside{list-style-position:inside}.volr\\:list-decimal{list-style-type:decimal}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-1>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*1)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*1)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-2>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-4>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*4)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*4)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-6>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*6)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*6)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-8>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*8)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*8)*calc(1 - var(--volr-tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-auto{overflow:auto}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-x-auto{overflow-x:auto}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded{border-radius:.25rem}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-md{border-radius:var(--volr-radius-md)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-2xl{border-top-left-radius:var(--volr-radius-2xl);border-top-right-radius:var(--volr-radius-2xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:border{border-style:var(--volr-tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--volr-tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--volr-tw-border-style);border-width:4px}.volr\\:border-y{border-block-style:var(--volr-tw-border-style);border-block-width:1px}.volr\\:border-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-b{border-bottom-style:var(--volr-tw-border-style);border-bottom-width:1px}.volr\\:border-amber-200{border-color:var(--volr-color-amber-200)}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-slate-100{border-color:var(--volr-color-slate-100)}.volr\\:border-slate-200{border-color:var(--volr-color-slate-200)}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:border-t-slate-600{border-top-color:var(--volr-color-slate-600)}.volr\\:bg-amber-50{background-color:var(--volr-color-amber-50)}.volr\\:bg-black\\/40{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/40{background-color:color-mix(in oklab,var(--volr-color-black)40%,transparent)}}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-blue-100{background-color:var(--volr-color-blue-100)}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-green-50{background-color:var(--volr-color-green-50)}.volr\\:bg-green-100{background-color:var(--volr-color-green-100)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-red-100{background-color:var(--volr-color-red-100)}.volr\\:bg-slate-50{background-color:var(--volr-color-slate-50)}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-slate-900{background-color:var(--volr-color-slate-900)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-yellow-100{background-color:var(--volr-color-yellow-100)}.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right in oklab}}.volr\\:bg-linear-to-br{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-gradient-to-br{--volr-tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-gradient-to-r{--volr-tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:from-emerald-400{--volr-tw-gradient-from:var(--volr-color-emerald-400);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:from-emerald-500{--volr-tw-gradient-from:var(--volr-color-emerald-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-teal-500{--volr-tw-gradient-to:var(--volr-color-teal-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:object-cover{object-fit:cover}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-1{padding-inline:calc(var(--volr-spacing)*1)}.volr\\:px-1\\.5{padding-inline:calc(var(--volr-spacing)*1.5)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1{padding-block:calc(var(--volr-spacing)*1)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-2\\.5{padding-block:calc(var(--volr-spacing)*2.5)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-2{padding-top:calc(var(--volr-spacing)*2)}.volr\\:pt-3{padding-top:calc(var(--volr-spacing)*3)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pr-16{padding-right:calc(var(--volr-spacing)*16)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:text-right{text-align:right}.volr\\:align-baseline{vertical-align:baseline}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--volr-tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-3xl{font-size:var(--volr-text-3xl);line-height:var(--volr-tw-leading,var(--volr-text-3xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--volr-tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--volr-tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--volr-tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--volr-tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--volr-tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--volr-tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-relaxed{--volr-tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--volr-tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--volr-tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--volr-tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-wide{--volr-tw-tracking:var(--volr-tracking-wide);letter-spacing:var(--volr-tracking-wide)}.volr\\:break-all{word-break:break-all}.volr\\:text-amber-700{color:var(--volr-color-amber-700)}.volr\\:text-blue-700{color:var(--volr-color-blue-700)}.volr\\:text-emerald-600{color:var(--volr-color-emerald-600)}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-green-700{color:var(--volr-color-green-700)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-slate-100{color:var(--volr-color-slate-100)}.volr\\:text-slate-300{color:var(--volr-color-slate-300)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:text-yellow-700{color:var(--volr-color-yellow-700)}.volr\\:capitalize{text-transform:capitalize}.volr\\:uppercase{text-transform:uppercase}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.volr\\:opacity-50{opacity:.5}.volr\\:opacity-75{opacity:.75}.volr\\:shadow-2xl{--volr-tw-shadow:0 25px 50px -12px var(--volr-tw-shadow-color,#00000040);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-lg{--volr-tw-shadow:0 10px 15px -3px var(--volr-tw-shadow-color,#0000001a),0 4px 6px -4px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-md{--volr-tw-shadow:0 4px 6px -1px var(--volr-tw-shadow-color,#0000001a),0 2px 4px -2px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-sm{--volr-tw-shadow:0 1px 3px 0 var(--volr-tw-shadow-color,#0000001a),0 1px 2px -1px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-xl{--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--volr-tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--volr-tw-blur:blur(var(--volr-blur-2xl));filter:var(--volr-tw-blur,)var(--volr-tw-brightness,)var(--volr-tw-contrast,)var(--volr-tw-grayscale,)var(--volr-tw-hue-rotate,)var(--volr-tw-invert,)var(--volr-tw-saturate,)var(--volr-tw-sepia,)var(--volr-tw-drop-shadow,)}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--volr-tw-gradient-from,--volr-tw-gradient-via,--volr-tw-gradient-to;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-300{--volr-tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--volr-tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--volr-tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--volr-tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:border-slate-300:hover{border-color:var(--volr-color-slate-300)}.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}.volr\\:hover\\:bg-slate-200:hover{background-color:var(--volr-color-slate-200)}.volr\\:hover\\:text-slate-700:hover{color:var(--volr-color-slate-700)}}.volr\\:focus\\:ring-2:focus{--volr-tw-ring-shadow:var(--volr-tw-ring-inset,)0 0 0 calc(2px + var(--volr-tw-ring-offset-width))var(--volr-tw-ring-color,currentcolor);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:focus\\:ring-slate-300:focus{--volr-tw-ring-color:var(--volr-color-slate-300)}.volr\\:focus\\:outline-none:focus{--volr-tw-outline-style:none;outline-style:none}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.volr\\:disabled\\:bg-slate-100:disabled{background-color:var(--volr-color-slate-100)}.volr\\:disabled\\:text-slate-400:disabled{color:var(--volr-color-slate-400)}.volr\\:disabled\\:opacity-50:disabled{opacity:.5}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.volr-text-secondary{color:var(--volr-text-secondary)}.volr-text-muted{color:var(--volr-text-muted)}.volr-bg-secondary{background-color:var(--volr-bg-secondary)}.volr-bg-tertiary{background-color:var(--volr-bg-tertiary)}.volr-border{border-color:var(--volr-border)}.volr-border-strong{border-color:var(--volr-border-strong)}.volr-divider-line{background-color:var(--volr-border)}.volr-error{background-color:var(--volr-error-bg);border-color:var(--volr-error-border);color:var(--volr-error-text)}.volr-hover:hover{background-color:var(--volr-hover-bg)}.volr-surface{background-color:var(--volr-bg)}}@property --volr-tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --volr-tw-gradient-position{syntax:"*";inherits:false}@property --volr-tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-via-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --volr-tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --volr-tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --volr-tw-leading{syntax:"*";inherits:false}@property --volr-tw-font-weight{syntax:"*";inherits:false}@property --volr-tw-tracking{syntax:"*";inherits:false}@property --volr-tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-shadow-color{syntax:"*";inherits:false}@property --volr-tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-shadow-color{syntax:"*";inherits:false}@property --volr-tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-ring-color{syntax:"*";inherits:false}@property --volr-tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-ring-color{syntax:"*";inherits:false}@property --volr-tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-ring-inset{syntax:"*";inherits:false}@property --volr-tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --volr-tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --volr-tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-blur{syntax:"*";inherits:false}@property --volr-tw-brightness{syntax:"*";inherits:false}@property --volr-tw-contrast{syntax:"*";inherits:false}@property --volr-tw-grayscale{syntax:"*";inherits:false}@property --volr-tw-hue-rotate{syntax:"*";inherits:false}@property --volr-tw-invert{syntax:"*";inherits:false}@property --volr-tw-opacity{syntax:"*";inherits:false}@property --volr-tw-saturate{syntax:"*";inherits:false}@property --volr-tw-sepia{syntax:"*";inherits:false}@property --volr-tw-drop-shadow{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-color{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-drop-shadow-size{syntax:"*";inherits:false}@property --volr-tw-duration{syntax:"*";inherits:false}@property --volr-tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}';
|
|
745
990
|
function useResolvedTheme(theme = "light") {
|
|
746
|
-
const [resolvedTheme, setResolvedTheme] =
|
|
991
|
+
const [resolvedTheme, setResolvedTheme] = React13.useState(() => {
|
|
747
992
|
if (theme !== "system") return theme;
|
|
748
993
|
if (typeof window === "undefined") return "light";
|
|
749
994
|
return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
750
995
|
});
|
|
751
|
-
|
|
996
|
+
React13.useEffect(() => {
|
|
752
997
|
if (theme !== "system") {
|
|
753
998
|
setResolvedTheme(theme);
|
|
754
999
|
return;
|
|
@@ -764,10 +1009,10 @@ function useResolvedTheme(theme = "light") {
|
|
|
764
1009
|
return resolvedTheme;
|
|
765
1010
|
}
|
|
766
1011
|
function ShadowPortal({ children, theme = "light" }) {
|
|
767
|
-
const [mountNode, setMountNode] =
|
|
768
|
-
const hostRef =
|
|
1012
|
+
const [mountNode, setMountNode] = React13.useState(null);
|
|
1013
|
+
const hostRef = React13.useRef(null);
|
|
769
1014
|
const resolvedTheme = useResolvedTheme(theme);
|
|
770
|
-
|
|
1015
|
+
React13.useEffect(() => {
|
|
771
1016
|
const host = document.createElement("div");
|
|
772
1017
|
host.id = "volr-shadow-portal";
|
|
773
1018
|
host.style.position = "fixed";
|
|
@@ -791,7 +1036,7 @@ function ShadowPortal({ children, theme = "light" }) {
|
|
|
791
1036
|
hostRef.current = null;
|
|
792
1037
|
};
|
|
793
1038
|
}, []);
|
|
794
|
-
|
|
1039
|
+
React13.useEffect(() => {
|
|
795
1040
|
if (hostRef.current) {
|
|
796
1041
|
hostRef.current.setAttribute("data-theme", resolvedTheme);
|
|
797
1042
|
}
|
|
@@ -800,7 +1045,7 @@ function ShadowPortal({ children, theme = "light" }) {
|
|
|
800
1045
|
return reactDom.createPortal(children, mountNode);
|
|
801
1046
|
}
|
|
802
1047
|
function useFocusTrap(isActive, containerRef) {
|
|
803
|
-
const previousActiveElement =
|
|
1048
|
+
const previousActiveElement = React13.useRef(null);
|
|
804
1049
|
const focusableSelector = [
|
|
805
1050
|
"button:not([disabled])",
|
|
806
1051
|
"input:not([disabled])",
|
|
@@ -809,7 +1054,7 @@ function useFocusTrap(isActive, containerRef) {
|
|
|
809
1054
|
"a[href]",
|
|
810
1055
|
'[tabindex]:not([tabindex="-1"])'
|
|
811
1056
|
].join(", ");
|
|
812
|
-
const getFocusableElements =
|
|
1057
|
+
const getFocusableElements = React13.useCallback(() => {
|
|
813
1058
|
if (!containerRef.current) return [];
|
|
814
1059
|
return Array.from(
|
|
815
1060
|
containerRef.current.querySelectorAll(focusableSelector)
|
|
@@ -817,7 +1062,7 @@ function useFocusTrap(isActive, containerRef) {
|
|
|
817
1062
|
return el.offsetParent !== null;
|
|
818
1063
|
});
|
|
819
1064
|
}, [containerRef, focusableSelector]);
|
|
820
|
-
const handleKeyDown =
|
|
1065
|
+
const handleKeyDown = React13.useCallback(
|
|
821
1066
|
(event) => {
|
|
822
1067
|
if (event.key !== "Tab") return;
|
|
823
1068
|
const focusableElements = getFocusableElements();
|
|
@@ -838,7 +1083,7 @@ function useFocusTrap(isActive, containerRef) {
|
|
|
838
1083
|
},
|
|
839
1084
|
[getFocusableElements]
|
|
840
1085
|
);
|
|
841
|
-
|
|
1086
|
+
React13.useEffect(() => {
|
|
842
1087
|
if (!isActive) return;
|
|
843
1088
|
previousActiveElement.current = document.activeElement;
|
|
844
1089
|
const focusableElements = getFocusableElements();
|
|
@@ -869,12 +1114,12 @@ var Modal = ({
|
|
|
869
1114
|
}) => {
|
|
870
1115
|
const isMobile2 = useMediaQuery("(max-width: 500px)");
|
|
871
1116
|
const variant = explicitVariant ?? (isMobile2 ? "bottom-sheet" : "centered");
|
|
872
|
-
const dialogRef =
|
|
873
|
-
const dialogId =
|
|
1117
|
+
const dialogRef = React13.useRef(null);
|
|
1118
|
+
const dialogId = React13.useId();
|
|
874
1119
|
const uiContext = useVolrUIOptional();
|
|
875
1120
|
const theme = uiContext?.theme ?? "light";
|
|
876
1121
|
useFocusTrap(open, dialogRef);
|
|
877
|
-
|
|
1122
|
+
React13.useEffect(() => {
|
|
878
1123
|
const handleEscape = (e) => {
|
|
879
1124
|
if (e.key === "Escape" && open) {
|
|
880
1125
|
if (onEscapeKeyDown) {
|
|
@@ -1328,7 +1573,7 @@ var variantMap = {
|
|
|
1328
1573
|
ghost: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "none" },
|
|
1329
1574
|
outline: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "1px solid var(--volr-border)" }
|
|
1330
1575
|
};
|
|
1331
|
-
var Button =
|
|
1576
|
+
var Button = React13__default.default.forwardRef(
|
|
1332
1577
|
({ variant = "primary", size = "md", fullWidth, className, style, disabled, children, ...props }, ref) => {
|
|
1333
1578
|
const { accentColor } = useVolrUI();
|
|
1334
1579
|
const sizeStyle = sizeMap[size];
|
|
@@ -1436,12 +1681,12 @@ function PasskeyEnrollView({
|
|
|
1436
1681
|
isEnrolling,
|
|
1437
1682
|
error: enrollmentError
|
|
1438
1683
|
} = react.usePasskeyEnrollment();
|
|
1439
|
-
const [hasStarted, setHasStarted] =
|
|
1440
|
-
const [errorMessage, setErrorMessage] =
|
|
1441
|
-
const [isRefreshing, setIsRefreshing] =
|
|
1684
|
+
const [hasStarted, setHasStarted] = React13.useState(false);
|
|
1685
|
+
const [errorMessage, setErrorMessage] = React13.useState(null);
|
|
1686
|
+
const [isRefreshing, setIsRefreshing] = React13.useState(false);
|
|
1442
1687
|
const biometricType = getBiometricType();
|
|
1443
1688
|
const hasPasskey = user?.keyStorageType === "passkey";
|
|
1444
|
-
|
|
1689
|
+
React13.useEffect(() => {
|
|
1445
1690
|
console.log("[PasskeyEnrollView] User state:", {
|
|
1446
1691
|
user,
|
|
1447
1692
|
keyStorageType: user?.keyStorageType,
|
|
@@ -1449,7 +1694,7 @@ function PasskeyEnrollView({
|
|
|
1449
1694
|
hasPasskey
|
|
1450
1695
|
});
|
|
1451
1696
|
}, [user, hasPasskey]);
|
|
1452
|
-
|
|
1697
|
+
React13.useEffect(() => {
|
|
1453
1698
|
if (hasPasskey && !user?.evmAddress && !isRefreshing) {
|
|
1454
1699
|
const refreshUserData = async () => {
|
|
1455
1700
|
try {
|
|
@@ -1480,7 +1725,7 @@ function PasskeyEnrollView({
|
|
|
1480
1725
|
refreshUserData();
|
|
1481
1726
|
}
|
|
1482
1727
|
}, [hasPasskey, user?.evmAddress, isRefreshing, client, setUser, user]);
|
|
1483
|
-
|
|
1728
|
+
React13.useEffect(() => {
|
|
1484
1729
|
if (!user?.id) {
|
|
1485
1730
|
const error = new Error("User ID is required for passkey enrollment");
|
|
1486
1731
|
setErrorMessage(getUserFriendlyError(error, t));
|
|
@@ -1489,7 +1734,7 @@ function PasskeyEnrollView({
|
|
|
1489
1734
|
}
|
|
1490
1735
|
}
|
|
1491
1736
|
}, [user, onError, t]);
|
|
1492
|
-
|
|
1737
|
+
React13.useEffect(() => {
|
|
1493
1738
|
if (enrollmentError) {
|
|
1494
1739
|
const friendlyMessage = getUserFriendlyError(enrollmentError, t);
|
|
1495
1740
|
setErrorMessage(friendlyMessage);
|
|
@@ -1646,8 +1891,8 @@ function MpcConnectView({
|
|
|
1646
1891
|
isConnecting,
|
|
1647
1892
|
error: connectionError
|
|
1648
1893
|
} = react.useMpcConnection();
|
|
1649
|
-
const [errorMessage, setErrorMessage] =
|
|
1650
|
-
|
|
1894
|
+
const [errorMessage, setErrorMessage] = React13.useState(null);
|
|
1895
|
+
React13.useEffect(() => {
|
|
1651
1896
|
if (connectionError) {
|
|
1652
1897
|
setErrorMessage(connectionError.message);
|
|
1653
1898
|
if (onError) {
|
|
@@ -1655,7 +1900,7 @@ function MpcConnectView({
|
|
|
1655
1900
|
}
|
|
1656
1901
|
}
|
|
1657
1902
|
}, [connectionError, onError]);
|
|
1658
|
-
|
|
1903
|
+
React13.useEffect(() => {
|
|
1659
1904
|
handleConnect();
|
|
1660
1905
|
}, []);
|
|
1661
1906
|
const handleConnect = async () => {
|
|
@@ -1715,34 +1960,6 @@ function MpcConnectView({
|
|
|
1715
1960
|
}
|
|
1716
1961
|
);
|
|
1717
1962
|
}
|
|
1718
|
-
var CopyButton = ({ text, className, onCopy }) => {
|
|
1719
|
-
const [copied, setCopied] = React12.useState(false);
|
|
1720
|
-
const handleCopy = async () => {
|
|
1721
|
-
try {
|
|
1722
|
-
await navigator.clipboard.writeText(text);
|
|
1723
|
-
setCopied(true);
|
|
1724
|
-
setTimeout(() => setCopied(false), 2e3);
|
|
1725
|
-
onCopy?.();
|
|
1726
|
-
} catch (error) {
|
|
1727
|
-
console.error("Copy failed:", error);
|
|
1728
|
-
}
|
|
1729
|
-
};
|
|
1730
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1731
|
-
"button",
|
|
1732
|
-
{
|
|
1733
|
-
onClick: handleCopy,
|
|
1734
|
-
className: cn(
|
|
1735
|
-
"volr:p-2 volr:rounded-lg volr:transition-all volr-text-muted volr-hover",
|
|
1736
|
-
className
|
|
1737
|
-
),
|
|
1738
|
-
"aria-label": "Copy",
|
|
1739
|
-
children: copied ? /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
1740
|
-
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
|
|
1741
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
|
|
1742
|
-
] })
|
|
1743
|
-
}
|
|
1744
|
-
);
|
|
1745
|
-
};
|
|
1746
1963
|
function OptionButton({
|
|
1747
1964
|
icon,
|
|
1748
1965
|
title,
|
|
@@ -1914,9 +2131,9 @@ function PoweredBy() {
|
|
|
1914
2131
|
}
|
|
1915
2132
|
function EmailInlineInput({ onSubmit, accentColor }) {
|
|
1916
2133
|
const { t } = useI18n();
|
|
1917
|
-
const [email, setEmail] =
|
|
1918
|
-
const [error, setError] =
|
|
1919
|
-
const [isLoading, setIsLoading] =
|
|
2134
|
+
const [email, setEmail] = React13.useState("");
|
|
2135
|
+
const [error, setError] = React13.useState(null);
|
|
2136
|
+
const [isLoading, setIsLoading] = React13.useState(false);
|
|
1920
2137
|
const handleSubmit = async (e) => {
|
|
1921
2138
|
e.preventDefault();
|
|
1922
2139
|
setError(null);
|
|
@@ -2040,14 +2257,14 @@ function SigninSelectScreen({
|
|
|
2040
2257
|
function CodeInputScreen({ email, onSubmit, onResend }) {
|
|
2041
2258
|
const { t } = useI18n();
|
|
2042
2259
|
const { accentColor } = useVolrUI();
|
|
2043
|
-
const [digits, setDigits] =
|
|
2044
|
-
const [error, setError] =
|
|
2045
|
-
const [isLoading, setIsLoading] =
|
|
2046
|
-
const inputRefs =
|
|
2047
|
-
|
|
2260
|
+
const [digits, setDigits] = React13.useState(Array(6).fill(""));
|
|
2261
|
+
const [error, setError] = React13.useState(null);
|
|
2262
|
+
const [isLoading, setIsLoading] = React13.useState(false);
|
|
2263
|
+
const inputRefs = React13.useRef([]);
|
|
2264
|
+
React13.useEffect(() => {
|
|
2048
2265
|
inputRefs.current[0]?.focus();
|
|
2049
2266
|
}, []);
|
|
2050
|
-
|
|
2267
|
+
React13.useEffect(() => {
|
|
2051
2268
|
const code = digits.join("");
|
|
2052
2269
|
if (code.length === 6 && !isLoading) {
|
|
2053
2270
|
handleSubmit(code);
|
|
@@ -2158,6 +2375,34 @@ function CodeInputScreen({ email, onSubmit, onResend }) {
|
|
|
2158
2375
|
)
|
|
2159
2376
|
] });
|
|
2160
2377
|
}
|
|
2378
|
+
var CopyButton = ({ text, className, onCopy }) => {
|
|
2379
|
+
const [copied, setCopied] = React13.useState(false);
|
|
2380
|
+
const handleCopy = async () => {
|
|
2381
|
+
try {
|
|
2382
|
+
await navigator.clipboard.writeText(text);
|
|
2383
|
+
setCopied(true);
|
|
2384
|
+
setTimeout(() => setCopied(false), 2e3);
|
|
2385
|
+
onCopy?.();
|
|
2386
|
+
} catch (error) {
|
|
2387
|
+
console.error("Copy failed:", error);
|
|
2388
|
+
}
|
|
2389
|
+
};
|
|
2390
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2391
|
+
"button",
|
|
2392
|
+
{
|
|
2393
|
+
onClick: handleCopy,
|
|
2394
|
+
className: cn(
|
|
2395
|
+
"volr:p-2 volr:rounded-lg volr:transition-all volr-text-muted volr-hover",
|
|
2396
|
+
className
|
|
2397
|
+
),
|
|
2398
|
+
"aria-label": "Copy",
|
|
2399
|
+
children: copied ? /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
2400
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
|
|
2401
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
|
|
2402
|
+
] })
|
|
2403
|
+
}
|
|
2404
|
+
);
|
|
2405
|
+
};
|
|
2161
2406
|
var isMobile = () => {
|
|
2162
2407
|
if (typeof window === "undefined") return false;
|
|
2163
2408
|
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
|
@@ -2210,23 +2455,23 @@ function SiweLoginScreen({
|
|
|
2210
2455
|
checkSiweSession,
|
|
2211
2456
|
getSiweSignUrl
|
|
2212
2457
|
} = react.useVolrLogin();
|
|
2213
|
-
const [isLoading, setIsLoading] =
|
|
2214
|
-
const [loadingWallet, setLoadingWallet] =
|
|
2215
|
-
const [error, setError] =
|
|
2216
|
-
const [providers, setProviders] =
|
|
2217
|
-
const [isDetecting, setIsDetecting] =
|
|
2218
|
-
const [hasLegacyWallet, setHasLegacyWallet] =
|
|
2219
|
-
const [showOtherWallet, setShowOtherWallet] =
|
|
2220
|
-
const [sessionUrl, setSessionUrl] =
|
|
2221
|
-
const [isPolling, setIsPolling] =
|
|
2222
|
-
const pollingRef =
|
|
2223
|
-
const sessionCreatedRef =
|
|
2224
|
-
|
|
2458
|
+
const [isLoading, setIsLoading] = React13.useState(false);
|
|
2459
|
+
const [loadingWallet, setLoadingWallet] = React13.useState(null);
|
|
2460
|
+
const [error, setError] = React13.useState(null);
|
|
2461
|
+
const [providers, setProviders] = React13.useState([]);
|
|
2462
|
+
const [isDetecting, setIsDetecting] = React13.useState(true);
|
|
2463
|
+
const [hasLegacyWallet, setHasLegacyWallet] = React13.useState(false);
|
|
2464
|
+
const [showOtherWallet, setShowOtherWallet] = React13.useState(false);
|
|
2465
|
+
const [sessionUrl, setSessionUrl] = React13.useState(null);
|
|
2466
|
+
const [isPolling, setIsPolling] = React13.useState(false);
|
|
2467
|
+
const pollingRef = React13.useRef(null);
|
|
2468
|
+
const sessionCreatedRef = React13.useRef(false);
|
|
2469
|
+
React13.useEffect(() => {
|
|
2225
2470
|
return () => {
|
|
2226
2471
|
if (pollingRef.current) clearInterval(pollingRef.current);
|
|
2227
2472
|
};
|
|
2228
2473
|
}, []);
|
|
2229
|
-
|
|
2474
|
+
React13.useEffect(() => {
|
|
2230
2475
|
if (typeof window === "undefined") {
|
|
2231
2476
|
setIsDetecting(false);
|
|
2232
2477
|
return;
|
|
@@ -2252,7 +2497,7 @@ function SiweLoginScreen({
|
|
|
2252
2497
|
};
|
|
2253
2498
|
}, []);
|
|
2254
2499
|
const hasAnyWallet = providers.length > 0 || hasLegacyWallet;
|
|
2255
|
-
const createSession =
|
|
2500
|
+
const createSession = React13.useCallback(async () => {
|
|
2256
2501
|
if (sessionCreatedRef.current || sessionUrl) return;
|
|
2257
2502
|
sessionCreatedRef.current = true;
|
|
2258
2503
|
try {
|
|
@@ -2294,17 +2539,17 @@ function SiweLoginScreen({
|
|
|
2294
2539
|
onError(err instanceof Error ? err : new Error("Failed to create session"));
|
|
2295
2540
|
}
|
|
2296
2541
|
}, [createSiweSession, getSiweSignUrl, checkSiweSession, onSuccess, onError, t, sessionUrl]);
|
|
2297
|
-
|
|
2542
|
+
React13.useEffect(() => {
|
|
2298
2543
|
if (!isDetecting && !hasAnyWallet && !sessionUrl) {
|
|
2299
2544
|
createSession();
|
|
2300
2545
|
}
|
|
2301
2546
|
}, [isDetecting, hasAnyWallet, sessionUrl, createSession]);
|
|
2302
|
-
|
|
2547
|
+
React13.useEffect(() => {
|
|
2303
2548
|
if (showOtherWallet && !sessionUrl) {
|
|
2304
2549
|
createSession();
|
|
2305
2550
|
}
|
|
2306
2551
|
}, [showOtherWallet, sessionUrl, createSession]);
|
|
2307
|
-
const handleWalletClick =
|
|
2552
|
+
const handleWalletClick = React13.useCallback(async (provider, walletName, walletConnector) => {
|
|
2308
2553
|
setError(null);
|
|
2309
2554
|
setIsLoading(true);
|
|
2310
2555
|
setLoadingWallet(walletName);
|
|
@@ -2328,7 +2573,7 @@ function SiweLoginScreen({
|
|
|
2328
2573
|
setLoadingWallet(null);
|
|
2329
2574
|
}
|
|
2330
2575
|
}, [signWithWallet, onSuccess, onError]);
|
|
2331
|
-
const handleLegacyWalletClick =
|
|
2576
|
+
const handleLegacyWalletClick = React13.useCallback(async () => {
|
|
2332
2577
|
if (typeof window === "undefined" || !window.ethereum) return;
|
|
2333
2578
|
const ethereum = window.ethereum;
|
|
2334
2579
|
let walletName = "Wallet";
|
|
@@ -2337,7 +2582,7 @@ function SiweLoginScreen({
|
|
|
2337
2582
|
else if (ethereum.isRabby) walletName = "Rabby";
|
|
2338
2583
|
await handleWalletClick(ethereum, walletName);
|
|
2339
2584
|
}, [handleWalletClick]);
|
|
2340
|
-
const cancelOtherWallet =
|
|
2585
|
+
const cancelOtherWallet = React13.useCallback(() => {
|
|
2341
2586
|
if (pollingRef.current) {
|
|
2342
2587
|
clearInterval(pollingRef.current);
|
|
2343
2588
|
pollingRef.current = null;
|
|
@@ -2483,13 +2728,13 @@ function SigninModal({ isOpen, onClose, onError }) {
|
|
|
2483
2728
|
const { logout, user } = react.useVolrContext();
|
|
2484
2729
|
const { appName, branding } = useVolrUI();
|
|
2485
2730
|
const { requestEmailCode, verifyEmailCode, handleSocialLogin } = react.useVolrLogin();
|
|
2486
|
-
const [currentScreen, setCurrentScreen] =
|
|
2487
|
-
const [email, setEmail] =
|
|
2731
|
+
const [currentScreen, setCurrentScreen] = React13.useState("method-select");
|
|
2732
|
+
const [email, setEmail] = React13.useState("");
|
|
2488
2733
|
const hasPasskey = user?.keyStorageType === "passkey";
|
|
2489
2734
|
const isMobile2 = useMediaQuery("(max-width: 500px)");
|
|
2490
2735
|
const isWideViewport = useMediaQuery("(min-width: 864px)");
|
|
2491
2736
|
const shouldUseWideLayout = !isMobile2 && isWideViewport && Boolean(branding) && currentScreen === "method-select";
|
|
2492
|
-
|
|
2737
|
+
React13.useEffect(() => {
|
|
2493
2738
|
if (!isOpen) {
|
|
2494
2739
|
setCurrentScreen("method-select");
|
|
2495
2740
|
setEmail("");
|
|
@@ -2647,85 +2892,818 @@ function SigninModal({ isOpen, onClose, onError }) {
|
|
|
2647
2892
|
}
|
|
2648
2893
|
);
|
|
2649
2894
|
}
|
|
2650
|
-
function
|
|
2651
|
-
|
|
2895
|
+
function ChevronRightIcon({ className }) {
|
|
2896
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2897
|
+
"svg",
|
|
2898
|
+
{
|
|
2899
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2900
|
+
viewBox: "0 0 20 20",
|
|
2901
|
+
fill: "currentColor",
|
|
2902
|
+
className,
|
|
2903
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2904
|
+
"path",
|
|
2905
|
+
{
|
|
2906
|
+
fillRule: "evenodd",
|
|
2907
|
+
d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z",
|
|
2908
|
+
clipRule: "evenodd"
|
|
2909
|
+
}
|
|
2910
|
+
)
|
|
2911
|
+
}
|
|
2912
|
+
);
|
|
2913
|
+
}
|
|
2914
|
+
function MenuItem({ label, onClick }) {
|
|
2915
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2916
|
+
"button",
|
|
2917
|
+
{
|
|
2918
|
+
type: "button",
|
|
2919
|
+
onClick,
|
|
2920
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:py-3 volr:px-1 volr:text-sm volr:text-slate-700 volr:border-b volr:border-slate-100 hover:volr:bg-slate-50 volr:transition-colors volr:text-left",
|
|
2921
|
+
children: [
|
|
2922
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
|
|
2923
|
+
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
|
|
2924
|
+
]
|
|
2925
|
+
}
|
|
2926
|
+
);
|
|
2927
|
+
}
|
|
2928
|
+
function AccountMainView({
|
|
2929
|
+
totalUsd,
|
|
2930
|
+
isLoading,
|
|
2931
|
+
paymentEnabled,
|
|
2932
|
+
onNavigate,
|
|
2933
|
+
onLogout,
|
|
2934
|
+
isLoggingOut
|
|
2935
|
+
}) {
|
|
2652
2936
|
const { t } = useI18n();
|
|
2653
|
-
const
|
|
2654
|
-
|
|
2655
|
-
|
|
2656
|
-
|
|
2657
|
-
|
|
2658
|
-
|
|
2659
|
-
|
|
2660
|
-
|
|
2661
|
-
|
|
2662
|
-
|
|
2663
|
-
}
|
|
2664
|
-
|
|
2665
|
-
|
|
2666
|
-
|
|
2667
|
-
|
|
2668
|
-
|
|
2669
|
-
|
|
2670
|
-
|
|
2937
|
+
const formattedUsd = isLoading ? "\u2014" : totalUsd.toLocaleString("en-US", {
|
|
2938
|
+
style: "currency",
|
|
2939
|
+
currency: "USD",
|
|
2940
|
+
minimumFractionDigits: 2,
|
|
2941
|
+
maximumFractionDigits: 2
|
|
2942
|
+
});
|
|
2943
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2944
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-8 volr:text-center", children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:animate-pulse", children: [
|
|
2945
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-9 volr:w-32 volr:bg-slate-200 volr:rounded volr:mx-auto volr:mb-2" }),
|
|
2946
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-24 volr:bg-slate-100 volr:rounded volr:mx-auto" })
|
|
2947
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2948
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-3xl volr:font-semibold volr:text-slate-900", children: formattedUsd }),
|
|
2949
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400 volr:tracking-wide volr:mt-1", children: t("account.totalBalance") })
|
|
2950
|
+
] }) }),
|
|
2951
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:border-t volr:border-slate-100", children: [
|
|
2952
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2953
|
+
MenuItem,
|
|
2954
|
+
{
|
|
2955
|
+
label: t("account.menu.assets"),
|
|
2956
|
+
onClick: () => onNavigate("assets")
|
|
2671
2957
|
}
|
|
2672
|
-
|
|
2673
|
-
|
|
2674
|
-
|
|
2675
|
-
|
|
2958
|
+
),
|
|
2959
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2960
|
+
MenuItem,
|
|
2961
|
+
{
|
|
2962
|
+
label: t("account.menu.withdraw"),
|
|
2963
|
+
onClick: () => onNavigate("withdraw")
|
|
2964
|
+
}
|
|
2965
|
+
),
|
|
2966
|
+
paymentEnabled && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2967
|
+
MenuItem,
|
|
2968
|
+
{
|
|
2969
|
+
label: t("account.menu.payments"),
|
|
2970
|
+
onClick: () => onNavigate("payments")
|
|
2971
|
+
}
|
|
2972
|
+
),
|
|
2973
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2974
|
+
MenuItem,
|
|
2975
|
+
{
|
|
2976
|
+
label: t("account.menu.account"),
|
|
2977
|
+
onClick: () => onNavigate("account")
|
|
2978
|
+
}
|
|
2979
|
+
)
|
|
2980
|
+
] }),
|
|
2981
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:border-t volr:border-slate-100 volr:mt-2 volr:pt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2982
|
+
"button",
|
|
2676
2983
|
{
|
|
2677
|
-
|
|
2678
|
-
|
|
2679
|
-
|
|
2680
|
-
|
|
2681
|
-
|
|
2984
|
+
type: "button",
|
|
2985
|
+
onClick: onLogout,
|
|
2986
|
+
disabled: isLoggingOut,
|
|
2987
|
+
className: "volr:w-full volr:py-3 volr:px-1 volr:text-sm volr:text-slate-400 volr:text-left hover:volr:text-slate-600 volr:transition-colors disabled:volr:opacity-50",
|
|
2988
|
+
children: isLoggingOut ? t("common.loading") : t("account.logout")
|
|
2682
2989
|
}
|
|
2683
|
-
) })
|
|
2990
|
+
) })
|
|
2991
|
+
] });
|
|
2992
|
+
}
|
|
2993
|
+
function TokenRow({ token }) {
|
|
2994
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
2995
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
2996
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden volr:shrink-0", children: token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
2997
|
+
"img",
|
|
2998
|
+
{
|
|
2999
|
+
src: token.iconUrl,
|
|
3000
|
+
alt: token.symbol,
|
|
3001
|
+
className: "volr:w-full volr:h-full volr:object-cover"
|
|
3002
|
+
}
|
|
3003
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: token.symbol.slice(0, 2) }) }),
|
|
3004
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3005
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.symbol }),
|
|
3006
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3007
|
+
"Chain ",
|
|
3008
|
+
token.chainId
|
|
3009
|
+
] })
|
|
3010
|
+
] })
|
|
3011
|
+
] }),
|
|
3012
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-right", children: token.isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" }) }) : token.error ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-red-500", children: "Error" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3013
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.balance }),
|
|
3014
|
+
token.balanceUsd !== void 0 && token.balanceUsd > 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3015
|
+
"$",
|
|
3016
|
+
token.balanceUsd.toFixed(2)
|
|
3017
|
+
] })
|
|
3018
|
+
] }) })
|
|
3019
|
+
] });
|
|
3020
|
+
}
|
|
3021
|
+
function BalanceDetailView({
|
|
3022
|
+
balances,
|
|
3023
|
+
isLoading
|
|
3024
|
+
}) {
|
|
3025
|
+
const { t } = useI18n();
|
|
3026
|
+
if (isLoading && balances.length === 0) {
|
|
3027
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse volr:space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
3028
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-200" }),
|
|
3029
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1", children: [
|
|
3030
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded volr:mb-1" }),
|
|
3031
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-12 volr:bg-slate-100 volr:rounded" })
|
|
3032
|
+
] }),
|
|
3033
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" })
|
|
3034
|
+
] }, i)) }) });
|
|
2684
3035
|
}
|
|
2685
|
-
|
|
2686
|
-
|
|
3036
|
+
if (balances.length === 0) {
|
|
3037
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-400", children: t("account.noAssets") }) });
|
|
3038
|
+
}
|
|
3039
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3040
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.assets") }),
|
|
3041
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsx(TokenRow, { token }, token.id)) })
|
|
3042
|
+
] });
|
|
3043
|
+
}
|
|
3044
|
+
var Input = React13__default.default.forwardRef(
|
|
3045
|
+
({ leftIcon, error, className, style, disabled, ...props }, ref) => {
|
|
3046
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3047
|
+
leftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:absolute volr:left-3 volr:top-1/2 volr:-translate-y-1/2 volr:pointer-events-none volr-text-muted", children: leftIcon }),
|
|
3048
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3049
|
+
"input",
|
|
3050
|
+
{
|
|
3051
|
+
ref,
|
|
3052
|
+
disabled,
|
|
3053
|
+
className: cn(
|
|
3054
|
+
"volr:w-full volr:text-base volr:outline-none volr:transition-all volr:rounded-lg volr:py-3 volr:disabled:cursor-not-allowed volr-surface",
|
|
3055
|
+
leftIcon ? "volr:pl-11 volr:pr-3" : "volr:px-3",
|
|
3056
|
+
error ? "volr:border volr-error" : "volr:border volr-border-strong",
|
|
3057
|
+
className
|
|
3058
|
+
),
|
|
3059
|
+
style,
|
|
3060
|
+
...props
|
|
3061
|
+
}
|
|
3062
|
+
)
|
|
3063
|
+
] });
|
|
3064
|
+
}
|
|
3065
|
+
);
|
|
3066
|
+
Input.displayName = "Input";
|
|
3067
|
+
function WithdrawView({
|
|
3068
|
+
balances,
|
|
3069
|
+
connectedWallet,
|
|
3070
|
+
onSuccess
|
|
3071
|
+
}) {
|
|
3072
|
+
const { t } = useI18n();
|
|
3073
|
+
const { withdraw, isWithdrawing, result, error, reset } = react.useWithdraw();
|
|
3074
|
+
const [step, setStep] = React13.useState("select");
|
|
3075
|
+
const [selectedTokenId, setSelectedTokenId] = React13.useState(null);
|
|
3076
|
+
const [toAddress, setToAddress] = React13.useState("");
|
|
3077
|
+
const [amount, setAmount] = React13.useState("");
|
|
3078
|
+
const [useConnectedWallet, setUseConnectedWallet] = React13.useState(false);
|
|
3079
|
+
const selectedToken = React13.useMemo(
|
|
3080
|
+
() => balances.find((b) => b.id === selectedTokenId),
|
|
3081
|
+
[balances, selectedTokenId]
|
|
3082
|
+
);
|
|
3083
|
+
const connectedAddress = React13.useMemo(() => {
|
|
3084
|
+
if (!connectedWallet) return null;
|
|
3085
|
+
const parts = connectedWallet.split(":");
|
|
3086
|
+
return parts.length >= 2 ? parts[1] : null;
|
|
3087
|
+
}, [connectedWallet]);
|
|
3088
|
+
const handleSelectToken = (tokenId) => {
|
|
3089
|
+
setSelectedTokenId(tokenId);
|
|
3090
|
+
setStep("input");
|
|
3091
|
+
};
|
|
3092
|
+
const handleUseConnectedWallet = () => {
|
|
3093
|
+
if (connectedAddress) {
|
|
3094
|
+
setToAddress(connectedAddress);
|
|
3095
|
+
setUseConnectedWallet(true);
|
|
3096
|
+
}
|
|
3097
|
+
};
|
|
3098
|
+
const handleConfirm = async () => {
|
|
3099
|
+
if (!selectedToken || !toAddress || !amount) return;
|
|
3100
|
+
setStep("confirm");
|
|
2687
3101
|
try {
|
|
2688
|
-
await
|
|
2689
|
-
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
|
|
2694
|
-
|
|
2695
|
-
|
|
3102
|
+
await withdraw({
|
|
3103
|
+
chainId: selectedToken.chainId,
|
|
3104
|
+
tokenAddress: selectedToken.address,
|
|
3105
|
+
decimals: selectedToken.decimals,
|
|
3106
|
+
amount,
|
|
3107
|
+
to: toAddress
|
|
3108
|
+
});
|
|
3109
|
+
setStep("result");
|
|
3110
|
+
} catch {
|
|
3111
|
+
setStep("result");
|
|
2696
3112
|
}
|
|
2697
3113
|
};
|
|
2698
|
-
const
|
|
2699
|
-
|
|
2700
|
-
|
|
2701
|
-
|
|
2702
|
-
|
|
2703
|
-
|
|
2704
|
-
|
|
2705
|
-
|
|
2706
|
-
|
|
2707
|
-
|
|
2708
|
-
|
|
2709
|
-
|
|
2710
|
-
|
|
2711
|
-
|
|
2712
|
-
|
|
2713
|
-
|
|
3114
|
+
const handleReset = () => {
|
|
3115
|
+
reset();
|
|
3116
|
+
setStep("select");
|
|
3117
|
+
setSelectedTokenId(null);
|
|
3118
|
+
setToAddress("");
|
|
3119
|
+
setAmount("");
|
|
3120
|
+
setUseConnectedWallet(false);
|
|
3121
|
+
};
|
|
3122
|
+
const isAmountValid = React13.useMemo(() => {
|
|
3123
|
+
if (!amount || !selectedToken) return false;
|
|
3124
|
+
const num = parseFloat(amount);
|
|
3125
|
+
if (isNaN(num) || num <= 0) return false;
|
|
3126
|
+
const balance = parseFloat(selectedToken.balance.replace(/,/g, ""));
|
|
3127
|
+
return num <= balance;
|
|
3128
|
+
}, [amount, selectedToken]);
|
|
3129
|
+
const isAddressValid = /^0x[a-fA-F0-9]{40}$/.test(toAddress);
|
|
3130
|
+
if (step === "select") {
|
|
3131
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3132
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.withdraw.selectToken") }),
|
|
3133
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-2", children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3134
|
+
"button",
|
|
3135
|
+
{
|
|
3136
|
+
type: "button",
|
|
3137
|
+
onClick: () => handleSelectToken(token.id),
|
|
3138
|
+
disabled: token.balanceRaw === 0n,
|
|
3139
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:p-3 volr:rounded-lg volr:border volr:border-slate-200 hover:volr:bg-slate-50 volr:transition-colors disabled:volr:opacity-50 disabled:volr:cursor-not-allowed",
|
|
3140
|
+
children: [
|
|
3141
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
3142
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden", children: token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3143
|
+
"img",
|
|
3144
|
+
{
|
|
3145
|
+
src: token.iconUrl,
|
|
3146
|
+
alt: token.symbol,
|
|
3147
|
+
className: "volr:w-full volr:h-full volr:object-cover"
|
|
3148
|
+
}
|
|
3149
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: token.symbol.slice(0, 2) }) }),
|
|
3150
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.symbol })
|
|
3151
|
+
] }),
|
|
3152
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-500", children: token.balance })
|
|
3153
|
+
]
|
|
3154
|
+
},
|
|
3155
|
+
token.id
|
|
3156
|
+
)) })
|
|
3157
|
+
] });
|
|
3158
|
+
}
|
|
3159
|
+
if (step === "input" && selectedToken) {
|
|
3160
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3161
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.withdraw.title") }),
|
|
3162
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3 volr:p-3 volr:rounded-lg volr:bg-slate-50 volr:mb-4", children: [
|
|
3163
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-200 volr:flex volr:items-center volr:justify-center volr:overflow-hidden", children: selectedToken.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3164
|
+
"img",
|
|
3165
|
+
{
|
|
3166
|
+
src: selectedToken.iconUrl,
|
|
3167
|
+
alt: selectedToken.symbol,
|
|
3168
|
+
className: "volr:w-full volr:h-full volr:object-cover"
|
|
3169
|
+
}
|
|
3170
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: selectedToken.symbol.slice(0, 2) }) }),
|
|
3171
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3172
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: selectedToken.symbol }),
|
|
3173
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3174
|
+
t("account.withdraw.available"),
|
|
3175
|
+
": ",
|
|
3176
|
+
selectedToken.balance
|
|
3177
|
+
] })
|
|
3178
|
+
] })
|
|
3179
|
+
] }),
|
|
3180
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3181
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:text-slate-600 volr:mb-2", children: t("account.withdraw.toAddress") }),
|
|
3182
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3183
|
+
Input,
|
|
3184
|
+
{
|
|
3185
|
+
type: "text",
|
|
3186
|
+
placeholder: "0x...",
|
|
3187
|
+
value: toAddress,
|
|
3188
|
+
onChange: (e) => {
|
|
3189
|
+
setToAddress(e.target.value);
|
|
3190
|
+
setUseConnectedWallet(false);
|
|
3191
|
+
}
|
|
3192
|
+
}
|
|
3193
|
+
),
|
|
3194
|
+
connectedAddress && !useConnectedWallet && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3195
|
+
"button",
|
|
3196
|
+
{
|
|
3197
|
+
type: "button",
|
|
3198
|
+
onClick: handleUseConnectedWallet,
|
|
3199
|
+
className: "volr:mt-2 volr:text-xs volr:text-slate-500 hover:volr:text-slate-700 volr:underline",
|
|
3200
|
+
children: t("account.withdraw.useConnectedWallet")
|
|
3201
|
+
}
|
|
3202
|
+
)
|
|
3203
|
+
] }),
|
|
3204
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6", children: [
|
|
3205
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:text-slate-600 volr:mb-2", children: t("account.withdraw.amount") }),
|
|
3206
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3207
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3208
|
+
Input,
|
|
3209
|
+
{
|
|
3210
|
+
type: "text",
|
|
3211
|
+
inputMode: "decimal",
|
|
3212
|
+
placeholder: "0.00",
|
|
3213
|
+
value: amount,
|
|
3214
|
+
onChange: (e) => setAmount(e.target.value)
|
|
3215
|
+
}
|
|
3216
|
+
),
|
|
3217
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3218
|
+
"button",
|
|
3219
|
+
{
|
|
3220
|
+
type: "button",
|
|
3221
|
+
onClick: () => setAmount(selectedToken.balance.replace(/,/g, "")),
|
|
3222
|
+
className: "volr:absolute volr:right-3 volr:top-1/2 volr:-translate-y-1/2 volr:text-xs volr:text-slate-500 hover:volr:text-slate-700 volr:font-medium",
|
|
3223
|
+
children: "MAX"
|
|
3224
|
+
}
|
|
3225
|
+
)
|
|
2714
3226
|
] })
|
|
2715
3227
|
] }),
|
|
2716
3228
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2717
3229
|
Button,
|
|
2718
3230
|
{
|
|
2719
|
-
|
|
3231
|
+
onClick: handleConfirm,
|
|
3232
|
+
disabled: !isAddressValid || !isAmountValid,
|
|
2720
3233
|
fullWidth: true,
|
|
2721
|
-
|
|
2722
|
-
disabled: isLoggingOut,
|
|
2723
|
-
children: isLoggingOut ? t("common.loading") : t("account.logout")
|
|
3234
|
+
children: t("account.withdraw.confirm")
|
|
2724
3235
|
}
|
|
2725
3236
|
)
|
|
2726
|
-
] })
|
|
2727
|
-
|
|
2728
|
-
|
|
3237
|
+
] });
|
|
3238
|
+
}
|
|
3239
|
+
if (step === "confirm" && selectedToken) {
|
|
3240
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-8 volr:text-center", children: [
|
|
3241
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-spin volr:w-8 volr:h-8 volr:border-2 volr:border-slate-200 volr:border-t-slate-600 volr:rounded-full volr:mx-auto volr:mb-4" }),
|
|
3242
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: t("account.withdraw.processing") })
|
|
3243
|
+
] });
|
|
3244
|
+
}
|
|
3245
|
+
if (step === "result") {
|
|
3246
|
+
const isSuccess = result && !error;
|
|
3247
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-8 volr:text-center", children: [
|
|
3248
|
+
isSuccess ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3249
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-green-100 volr:flex volr:items-center volr:justify-center volr:mx-auto volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3250
|
+
"svg",
|
|
3251
|
+
{
|
|
3252
|
+
className: "volr:w-6 volr:h-6 volr:text-green-600",
|
|
3253
|
+
fill: "none",
|
|
3254
|
+
viewBox: "0 0 24 24",
|
|
3255
|
+
stroke: "currentColor",
|
|
3256
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3257
|
+
"path",
|
|
3258
|
+
{
|
|
3259
|
+
strokeLinecap: "round",
|
|
3260
|
+
strokeLinejoin: "round",
|
|
3261
|
+
strokeWidth: 2,
|
|
3262
|
+
d: "M5 13l4 4L19 7"
|
|
3263
|
+
}
|
|
3264
|
+
)
|
|
3265
|
+
}
|
|
3266
|
+
) }),
|
|
3267
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-2", children: t("account.withdraw.success") }),
|
|
3268
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500 volr:mb-6", children: [
|
|
3269
|
+
amount,
|
|
3270
|
+
" ",
|
|
3271
|
+
selectedToken?.symbol,
|
|
3272
|
+
" ",
|
|
3273
|
+
t("account.withdraw.sent")
|
|
3274
|
+
] })
|
|
3275
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3276
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-red-100 volr:flex volr:items-center volr:justify-center volr:mx-auto volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3277
|
+
"svg",
|
|
3278
|
+
{
|
|
3279
|
+
className: "volr:w-6 volr:h-6 volr:text-red-600",
|
|
3280
|
+
fill: "none",
|
|
3281
|
+
viewBox: "0 0 24 24",
|
|
3282
|
+
stroke: "currentColor",
|
|
3283
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3284
|
+
"path",
|
|
3285
|
+
{
|
|
3286
|
+
strokeLinecap: "round",
|
|
3287
|
+
strokeLinejoin: "round",
|
|
3288
|
+
strokeWidth: 2,
|
|
3289
|
+
d: "M6 18L18 6M6 6l12 12"
|
|
3290
|
+
}
|
|
3291
|
+
)
|
|
3292
|
+
}
|
|
3293
|
+
) }),
|
|
3294
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-2", children: t("account.withdraw.failed") }),
|
|
3295
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-500 volr:mb-6", children: error?.message || t("account.withdraw.unknownError") })
|
|
3296
|
+
] }),
|
|
3297
|
+
/* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "secondary", onClick: isSuccess ? onSuccess : handleReset, fullWidth: true, children: isSuccess ? t("common.done") : t("common.tryAgain") })
|
|
3298
|
+
] });
|
|
3299
|
+
}
|
|
3300
|
+
return null;
|
|
3301
|
+
}
|
|
3302
|
+
function PaymentRow({ payment, onClick }) {
|
|
3303
|
+
const { t } = useI18n();
|
|
3304
|
+
const date = new Date(payment.createdAt);
|
|
3305
|
+
const formattedDate = date.toLocaleDateString(void 0, {
|
|
3306
|
+
month: "short",
|
|
3307
|
+
day: "numeric",
|
|
3308
|
+
year: "numeric"
|
|
3309
|
+
});
|
|
3310
|
+
const statusColors = {
|
|
3311
|
+
CONFIRMED: "volr:bg-green-100 volr:text-green-700",
|
|
3312
|
+
PENDING: "volr:bg-yellow-100 volr:text-yellow-700",
|
|
3313
|
+
PROCESSING: "volr:bg-blue-100 volr:text-blue-700",
|
|
3314
|
+
FAILED: "volr:bg-red-100 volr:text-red-700",
|
|
3315
|
+
CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
|
|
3316
|
+
EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
|
|
3317
|
+
};
|
|
3318
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3319
|
+
"button",
|
|
3320
|
+
{
|
|
3321
|
+
type: "button",
|
|
3322
|
+
onClick,
|
|
3323
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 hover:volr:bg-slate-50 volr:transition-colors volr:text-left",
|
|
3324
|
+
children: [
|
|
3325
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
3326
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-1", children: [
|
|
3327
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900 volr:truncate", children: payment.itemName || t("account.payments.payment") }),
|
|
3328
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3329
|
+
"span",
|
|
3330
|
+
{
|
|
3331
|
+
className: `volr:px-1.5 volr:py-0.5 volr:text-xs volr:font-medium volr:rounded ${statusColors[payment.status] || "volr:bg-slate-100 volr:text-slate-500"}`,
|
|
3332
|
+
children: payment.status
|
|
3333
|
+
}
|
|
3334
|
+
)
|
|
3335
|
+
] }),
|
|
3336
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: formattedDate })
|
|
3337
|
+
] }),
|
|
3338
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3339
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-right", children: [
|
|
3340
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: [
|
|
3341
|
+
payment.amount,
|
|
3342
|
+
" ",
|
|
3343
|
+
payment.token.symbol
|
|
3344
|
+
] }),
|
|
3345
|
+
payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3346
|
+
"$",
|
|
3347
|
+
parseFloat(payment.totalUsd).toFixed(2)
|
|
3348
|
+
] })
|
|
3349
|
+
] }),
|
|
3350
|
+
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
|
|
3351
|
+
] })
|
|
3352
|
+
]
|
|
3353
|
+
}
|
|
3354
|
+
);
|
|
3355
|
+
}
|
|
3356
|
+
function PaymentHistoryView({ onSelectPayment }) {
|
|
3357
|
+
const { t } = useI18n();
|
|
3358
|
+
const { getPaymentHistory, isLoading: isApiLoading } = react.useVolrPaymentApi();
|
|
3359
|
+
const [payments, setPayments] = React13.useState([]);
|
|
3360
|
+
const [isLoading, setIsLoading] = React13.useState(true);
|
|
3361
|
+
const [error, setError] = React13.useState(null);
|
|
3362
|
+
React13.useEffect(() => {
|
|
3363
|
+
setIsLoading(true);
|
|
3364
|
+
setError(null);
|
|
3365
|
+
getPaymentHistory({ take: 20 }).then((result) => {
|
|
3366
|
+
setPayments(result.payments);
|
|
3367
|
+
}).catch((err) => {
|
|
3368
|
+
console.error("[PaymentHistoryView] Failed to fetch payments:", err);
|
|
3369
|
+
setError(t("account.payments.fetchError"));
|
|
3370
|
+
}).finally(() => {
|
|
3371
|
+
setIsLoading(false);
|
|
3372
|
+
});
|
|
3373
|
+
}, [getPaymentHistory, t]);
|
|
3374
|
+
if (isLoading || isApiLoading) {
|
|
3375
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse volr:space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3", children: [
|
|
3376
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3377
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-32 volr:bg-slate-200 volr:rounded volr:mb-2" }),
|
|
3378
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-20 volr:bg-slate-100 volr:rounded" })
|
|
3379
|
+
] }),
|
|
3380
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" })
|
|
3381
|
+
] }, i)) }) });
|
|
3382
|
+
}
|
|
3383
|
+
if (error) {
|
|
3384
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-500", children: error }) });
|
|
3385
|
+
}
|
|
3386
|
+
if (payments.length === 0) {
|
|
3387
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-400", children: t("account.payments.noPayments") }) });
|
|
3388
|
+
}
|
|
3389
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3390
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.payments") }),
|
|
3391
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: payments.map((payment) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3392
|
+
PaymentRow,
|
|
3393
|
+
{
|
|
3394
|
+
payment,
|
|
3395
|
+
onClick: () => onSelectPayment(payment)
|
|
3396
|
+
},
|
|
3397
|
+
payment.id
|
|
3398
|
+
)) })
|
|
3399
|
+
] });
|
|
3400
|
+
}
|
|
3401
|
+
function DetailRow({ label, value, copyable, mono }) {
|
|
3402
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:justify-between volr:py-2 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
3403
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-500", children: label }),
|
|
3404
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3405
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3406
|
+
"span",
|
|
3407
|
+
{
|
|
3408
|
+
className: `volr:text-sm volr:text-slate-900 volr:text-right ${mono ? "volr:font-mono" : ""}`,
|
|
3409
|
+
children: value
|
|
3410
|
+
}
|
|
3411
|
+
),
|
|
3412
|
+
copyable && /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { text: value, className: "volr:shrink-0" })
|
|
3413
|
+
] })
|
|
3414
|
+
] });
|
|
3415
|
+
}
|
|
3416
|
+
function PaymentDetailView({ payment }) {
|
|
3417
|
+
const { t } = useI18n();
|
|
3418
|
+
const createdDate = new Date(payment.createdAt);
|
|
3419
|
+
const formattedCreatedAt = createdDate.toLocaleString(void 0, {
|
|
3420
|
+
year: "numeric",
|
|
3421
|
+
month: "short",
|
|
3422
|
+
day: "numeric",
|
|
3423
|
+
hour: "2-digit",
|
|
3424
|
+
minute: "2-digit"
|
|
3425
|
+
});
|
|
3426
|
+
const confirmedDate = payment.confirmedAt ? new Date(payment.confirmedAt) : null;
|
|
3427
|
+
const formattedConfirmedAt = confirmedDate ? confirmedDate.toLocaleString(void 0, {
|
|
3428
|
+
year: "numeric",
|
|
3429
|
+
month: "short",
|
|
3430
|
+
day: "numeric",
|
|
3431
|
+
hour: "2-digit",
|
|
3432
|
+
minute: "2-digit"
|
|
3433
|
+
}) : null;
|
|
3434
|
+
const statusColors = {
|
|
3435
|
+
CONFIRMED: "volr:bg-green-100 volr:text-green-700",
|
|
3436
|
+
PENDING: "volr:bg-yellow-100 volr:text-yellow-700",
|
|
3437
|
+
PROCESSING: "volr:bg-blue-100 volr:text-blue-700",
|
|
3438
|
+
FAILED: "volr:bg-red-100 volr:text-red-700",
|
|
3439
|
+
CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
|
|
3440
|
+
EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
|
|
3441
|
+
};
|
|
3442
|
+
const truncateHash = (hash) => {
|
|
3443
|
+
if (hash.length <= 16) return hash;
|
|
3444
|
+
return `${hash.slice(0, 8)}...${hash.slice(-6)}`;
|
|
3445
|
+
};
|
|
3446
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3447
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6", children: [
|
|
3448
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-2", children: [
|
|
3449
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900", children: payment.itemName || t("account.payments.payment") }),
|
|
3450
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3451
|
+
"span",
|
|
3452
|
+
{
|
|
3453
|
+
className: `volr:px-2 volr:py-0.5 volr:text-xs volr:font-medium volr:rounded ${statusColors[payment.status] || "volr:bg-slate-100 volr:text-slate-500"}`,
|
|
3454
|
+
children: payment.status
|
|
3455
|
+
}
|
|
3456
|
+
)
|
|
3457
|
+
] }),
|
|
3458
|
+
payment.itemDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: payment.itemDescription })
|
|
3459
|
+
] }),
|
|
3460
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-4 volr:mb-4 volr:border-y volr:border-slate-100", children: [
|
|
3461
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-2xl volr:font-semibold volr:text-slate-900", children: [
|
|
3462
|
+
payment.amount,
|
|
3463
|
+
" ",
|
|
3464
|
+
payment.token.symbol
|
|
3465
|
+
] }),
|
|
3466
|
+
payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500", children: [
|
|
3467
|
+
"\u2248 $",
|
|
3468
|
+
parseFloat(payment.totalUsd).toFixed(2),
|
|
3469
|
+
" USD"
|
|
3470
|
+
] })
|
|
3471
|
+
] }),
|
|
3472
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-1", children: [
|
|
3473
|
+
/* @__PURE__ */ jsxRuntime.jsx(DetailRow, { label: t("account.payments.createdAt"), value: formattedCreatedAt }),
|
|
3474
|
+
formattedConfirmedAt && /* @__PURE__ */ jsxRuntime.jsx(DetailRow, { label: t("account.payments.confirmedAt"), value: formattedConfirmedAt }),
|
|
3475
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3476
|
+
DetailRow,
|
|
3477
|
+
{
|
|
3478
|
+
label: t("account.payments.token"),
|
|
3479
|
+
value: `${payment.token.symbol} (Chain ${payment.token.chainId})`
|
|
3480
|
+
}
|
|
3481
|
+
),
|
|
3482
|
+
payment.txHash && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3483
|
+
DetailRow,
|
|
3484
|
+
{
|
|
3485
|
+
label: t("account.payments.txHash"),
|
|
3486
|
+
value: truncateHash(payment.txHash),
|
|
3487
|
+
copyable: true,
|
|
3488
|
+
mono: true
|
|
3489
|
+
}
|
|
3490
|
+
),
|
|
3491
|
+
payment.referenceId && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3492
|
+
DetailRow,
|
|
3493
|
+
{
|
|
3494
|
+
label: t("account.payments.referenceId"),
|
|
3495
|
+
value: payment.referenceId,
|
|
3496
|
+
copyable: true
|
|
3497
|
+
}
|
|
3498
|
+
)
|
|
3499
|
+
] }),
|
|
3500
|
+
payment.itemImage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-6", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3501
|
+
"img",
|
|
3502
|
+
{
|
|
3503
|
+
src: payment.itemImage,
|
|
3504
|
+
alt: payment.itemName || "Item",
|
|
3505
|
+
className: "volr:w-full volr:h-40 volr:object-cover volr:rounded-lg"
|
|
3506
|
+
}
|
|
3507
|
+
) })
|
|
3508
|
+
] });
|
|
3509
|
+
}
|
|
3510
|
+
function InfoRow({ label, value, copyable, mono }) {
|
|
3511
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
3512
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400 volr:mb-1", children: label }),
|
|
3513
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-2", children: [
|
|
3514
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3515
|
+
"p",
|
|
3516
|
+
{
|
|
3517
|
+
className: `volr:text-sm volr:text-slate-900 volr:break-all ${mono ? "volr:font-mono" : ""}`,
|
|
3518
|
+
children: value
|
|
3519
|
+
}
|
|
3520
|
+
),
|
|
3521
|
+
copyable && /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { text: value, className: "volr:shrink-0" })
|
|
3522
|
+
] })
|
|
3523
|
+
] });
|
|
3524
|
+
}
|
|
3525
|
+
function AccountInfoView({ user }) {
|
|
3526
|
+
const { t } = useI18n();
|
|
3527
|
+
const getLoginMethod = () => {
|
|
3528
|
+
if (user.authWallet) {
|
|
3529
|
+
return t("account.info.loginMethod.wallet");
|
|
3530
|
+
}
|
|
3531
|
+
if (user.email?.includes("@google.")) {
|
|
3532
|
+
return t("account.info.loginMethod.google");
|
|
3533
|
+
}
|
|
3534
|
+
if (user.email?.includes("@twitter.") || user.email?.includes("@x.")) {
|
|
3535
|
+
return t("account.info.loginMethod.twitter");
|
|
3536
|
+
}
|
|
3537
|
+
if (user.email?.includes("@wallet.")) {
|
|
3538
|
+
return t("account.info.loginMethod.wallet");
|
|
3539
|
+
}
|
|
3540
|
+
return t("account.info.loginMethod.email");
|
|
3541
|
+
};
|
|
3542
|
+
const formatAddress = (address) => {
|
|
3543
|
+
if (address.length <= 16) return address;
|
|
3544
|
+
return `${address.slice(0, 6)}...${address.slice(-4)}`;
|
|
3545
|
+
};
|
|
3546
|
+
const externalWallet = user.authWallet ? user.authWallet.split(":")[1] || user.authWallet : null;
|
|
3547
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3548
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.account") }),
|
|
3549
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3550
|
+
/* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.info.loginMethod.label"), value: getLoginMethod() }),
|
|
3551
|
+
user.email && !user.email.includes("@wallet.") && /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.email"), value: user.email }),
|
|
3552
|
+
user.evmAddress && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3553
|
+
InfoRow,
|
|
3554
|
+
{
|
|
3555
|
+
label: t("account.walletAddress"),
|
|
3556
|
+
value: formatAddress(user.evmAddress),
|
|
3557
|
+
copyable: true,
|
|
3558
|
+
mono: true
|
|
3559
|
+
}
|
|
3560
|
+
),
|
|
3561
|
+
externalWallet && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3562
|
+
InfoRow,
|
|
3563
|
+
{
|
|
3564
|
+
label: t("account.info.connectedWallet"),
|
|
3565
|
+
value: formatAddress(externalWallet),
|
|
3566
|
+
copyable: true,
|
|
3567
|
+
mono: true
|
|
3568
|
+
}
|
|
3569
|
+
),
|
|
3570
|
+
user.signerType && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3571
|
+
InfoRow,
|
|
3572
|
+
{
|
|
3573
|
+
label: t("account.info.signerType"),
|
|
3574
|
+
value: user.signerType === "passkey" ? "Passkey" : user.signerType
|
|
3575
|
+
}
|
|
3576
|
+
)
|
|
3577
|
+
] })
|
|
3578
|
+
] });
|
|
3579
|
+
}
|
|
3580
|
+
function AccountModal({ isOpen, onClose, onError }) {
|
|
3581
|
+
const { user, logout } = react.useVolrContext();
|
|
3582
|
+
const { balances, totalUsd, isLoading, paymentEnabled, refresh } = react.useUserBalances();
|
|
3583
|
+
const [currentView, setCurrentView] = React13.useState("main");
|
|
3584
|
+
const [selectedPayment, setSelectedPayment] = React13.useState(null);
|
|
3585
|
+
const [isLoggingOut, setIsLoggingOut] = React13.useState(false);
|
|
3586
|
+
const handleOpenChange = React13.useCallback((open) => {
|
|
3587
|
+
if (!open) {
|
|
3588
|
+
onClose();
|
|
3589
|
+
setTimeout(() => {
|
|
3590
|
+
setCurrentView("main");
|
|
3591
|
+
setSelectedPayment(null);
|
|
3592
|
+
}, 200);
|
|
3593
|
+
}
|
|
3594
|
+
}, [onClose]);
|
|
3595
|
+
if (!user) {
|
|
3596
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SigninModal, { isOpen, onClose, onError });
|
|
3597
|
+
}
|
|
3598
|
+
if (!user.keyStorageType) {
|
|
3599
|
+
const handlePasskeyComplete = () => {
|
|
3600
|
+
onClose();
|
|
3601
|
+
};
|
|
3602
|
+
const handlePasskeyError = (error) => {
|
|
3603
|
+
if (onError) onError(error);
|
|
3604
|
+
};
|
|
3605
|
+
const handleLogoutFromPasskey = async () => {
|
|
3606
|
+
try {
|
|
3607
|
+
await logout();
|
|
3608
|
+
onClose();
|
|
3609
|
+
} catch (error) {
|
|
3610
|
+
if (onError) {
|
|
3611
|
+
onError(error instanceof Error ? error : new Error("Logout failed"));
|
|
3612
|
+
}
|
|
3613
|
+
}
|
|
3614
|
+
};
|
|
3615
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3616
|
+
PasskeyEnrollView,
|
|
3617
|
+
{
|
|
3618
|
+
wrapInModal: false,
|
|
3619
|
+
onComplete: handlePasskeyComplete,
|
|
3620
|
+
onError: handlePasskeyError,
|
|
3621
|
+
onLogout: handleLogoutFromPasskey,
|
|
3622
|
+
onClose
|
|
3623
|
+
}
|
|
3624
|
+
) });
|
|
3625
|
+
}
|
|
3626
|
+
const handleLogout = async () => {
|
|
3627
|
+
setIsLoggingOut(true);
|
|
3628
|
+
try {
|
|
3629
|
+
await logout();
|
|
3630
|
+
onClose();
|
|
3631
|
+
} catch (error) {
|
|
3632
|
+
if (onError) {
|
|
3633
|
+
onError(error instanceof Error ? error : new Error("Logout failed"));
|
|
3634
|
+
}
|
|
3635
|
+
} finally {
|
|
3636
|
+
setIsLoggingOut(false);
|
|
3637
|
+
}
|
|
3638
|
+
};
|
|
3639
|
+
const handleNavigate = (view) => {
|
|
3640
|
+
setCurrentView(view);
|
|
3641
|
+
};
|
|
3642
|
+
const handleBack = () => {
|
|
3643
|
+
if (selectedPayment) {
|
|
3644
|
+
setSelectedPayment(null);
|
|
3645
|
+
setCurrentView("payments");
|
|
3646
|
+
} else {
|
|
3647
|
+
setCurrentView("main");
|
|
3648
|
+
}
|
|
3649
|
+
};
|
|
3650
|
+
const handleSelectPayment = (payment) => {
|
|
3651
|
+
setSelectedPayment(payment);
|
|
3652
|
+
};
|
|
3653
|
+
const handleWithdrawSuccess = () => {
|
|
3654
|
+
refresh();
|
|
3655
|
+
setCurrentView("main");
|
|
3656
|
+
};
|
|
3657
|
+
const showBack = currentView !== "main" || selectedPayment !== null;
|
|
3658
|
+
const renderContent = () => {
|
|
3659
|
+
if (selectedPayment) {
|
|
3660
|
+
return /* @__PURE__ */ jsxRuntime.jsx(PaymentDetailView, { payment: selectedPayment });
|
|
3661
|
+
}
|
|
3662
|
+
switch (currentView) {
|
|
3663
|
+
case "main":
|
|
3664
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3665
|
+
AccountMainView,
|
|
3666
|
+
{
|
|
3667
|
+
totalUsd,
|
|
3668
|
+
balances,
|
|
3669
|
+
isLoading,
|
|
3670
|
+
paymentEnabled,
|
|
3671
|
+
onNavigate: handleNavigate,
|
|
3672
|
+
onLogout: handleLogout,
|
|
3673
|
+
isLoggingOut
|
|
3674
|
+
}
|
|
3675
|
+
);
|
|
3676
|
+
case "assets":
|
|
3677
|
+
return /* @__PURE__ */ jsxRuntime.jsx(BalanceDetailView, { balances, isLoading });
|
|
3678
|
+
case "withdraw":
|
|
3679
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3680
|
+
WithdrawView,
|
|
3681
|
+
{
|
|
3682
|
+
balances,
|
|
3683
|
+
connectedWallet: user.authWallet,
|
|
3684
|
+
onSuccess: handleWithdrawSuccess
|
|
3685
|
+
}
|
|
3686
|
+
);
|
|
3687
|
+
case "payments":
|
|
3688
|
+
return /* @__PURE__ */ jsxRuntime.jsx(PaymentHistoryView, { onSelectPayment: handleSelectPayment });
|
|
3689
|
+
case "account":
|
|
3690
|
+
return /* @__PURE__ */ jsxRuntime.jsx(AccountInfoView, { user });
|
|
3691
|
+
default:
|
|
3692
|
+
return null;
|
|
3693
|
+
}
|
|
3694
|
+
};
|
|
3695
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: [
|
|
3696
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3697
|
+
ModalHeader,
|
|
3698
|
+
{
|
|
3699
|
+
back: showBack,
|
|
3700
|
+
onBack: showBack ? handleBack : void 0,
|
|
3701
|
+
onClose
|
|
3702
|
+
}
|
|
3703
|
+
),
|
|
3704
|
+
renderContent()
|
|
3705
|
+
] });
|
|
3706
|
+
}
|
|
2729
3707
|
function AssetSelectView({
|
|
2730
3708
|
assets,
|
|
2731
3709
|
onSelect
|
|
@@ -2776,7 +3754,7 @@ function AssetSelectView({
|
|
|
2776
3754
|
}) })
|
|
2777
3755
|
] });
|
|
2778
3756
|
}
|
|
2779
|
-
var TextLinkButton =
|
|
3757
|
+
var TextLinkButton = React13__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
|
|
2780
3758
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2781
3759
|
"button",
|
|
2782
3760
|
{
|
|
@@ -2807,6 +3785,383 @@ var OtherTokenModal = ({
|
|
|
2807
3785
|
] })
|
|
2808
3786
|
] });
|
|
2809
3787
|
};
|
|
3788
|
+
|
|
3789
|
+
// ../node_modules/viem/_esm/errors/unit.js
|
|
3790
|
+
init_base();
|
|
3791
|
+
var InvalidDecimalNumberError = class extends BaseError {
|
|
3792
|
+
constructor({ value }) {
|
|
3793
|
+
super(`Number \`${value}\` is not a valid decimal number.`, {
|
|
3794
|
+
name: "InvalidDecimalNumberError"
|
|
3795
|
+
});
|
|
3796
|
+
}
|
|
3797
|
+
};
|
|
3798
|
+
|
|
3799
|
+
// ../node_modules/viem/_esm/utils/unit/parseUnits.js
|
|
3800
|
+
function parseUnits(value, decimals) {
|
|
3801
|
+
if (!/^(-?)([0-9]*)\.?([0-9]*)$/.test(value))
|
|
3802
|
+
throw new InvalidDecimalNumberError({ value });
|
|
3803
|
+
let [integer, fraction = "0"] = value.split(".");
|
|
3804
|
+
const negative = integer.startsWith("-");
|
|
3805
|
+
if (negative)
|
|
3806
|
+
integer = integer.slice(1);
|
|
3807
|
+
fraction = fraction.replace(/(0+)$/, "");
|
|
3808
|
+
if (decimals === 0) {
|
|
3809
|
+
if (Math.round(Number(`.${fraction}`)) === 1)
|
|
3810
|
+
integer = `${BigInt(integer) + 1n}`;
|
|
3811
|
+
fraction = "";
|
|
3812
|
+
} else if (fraction.length > decimals) {
|
|
3813
|
+
const [left, unit, right] = [
|
|
3814
|
+
fraction.slice(0, decimals - 1),
|
|
3815
|
+
fraction.slice(decimals - 1, decimals),
|
|
3816
|
+
fraction.slice(decimals)
|
|
3817
|
+
];
|
|
3818
|
+
const rounded = Math.round(Number(`${unit}.${right}`));
|
|
3819
|
+
if (rounded > 9)
|
|
3820
|
+
fraction = `${BigInt(left) + BigInt(1)}0`.padStart(left.length + 1, "0");
|
|
3821
|
+
else
|
|
3822
|
+
fraction = `${left}${rounded}`;
|
|
3823
|
+
if (fraction.length > decimals) {
|
|
3824
|
+
fraction = fraction.slice(1);
|
|
3825
|
+
integer = `${BigInt(integer) + 1n}`;
|
|
3826
|
+
}
|
|
3827
|
+
fraction = fraction.slice(0, decimals);
|
|
3828
|
+
} else {
|
|
3829
|
+
fraction = fraction.padEnd(decimals, "0");
|
|
3830
|
+
}
|
|
3831
|
+
return BigInt(`${negative ? "-" : ""}${integer}${fraction}`);
|
|
3832
|
+
}
|
|
3833
|
+
|
|
3834
|
+
// ../node_modules/viem/_esm/index.js
|
|
3835
|
+
init_abis();
|
|
3836
|
+
init_formatUnits();
|
|
3837
|
+
var DefaultWalletIcon2 = () => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3838
|
+
"svg",
|
|
3839
|
+
{
|
|
3840
|
+
className: "volr:w-6 volr:h-6",
|
|
3841
|
+
viewBox: "0 0 24 24",
|
|
3842
|
+
fill: "none",
|
|
3843
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3844
|
+
children: [
|
|
3845
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3846
|
+
"rect",
|
|
3847
|
+
{
|
|
3848
|
+
x: "2",
|
|
3849
|
+
y: "6",
|
|
3850
|
+
width: "20",
|
|
3851
|
+
height: "14",
|
|
3852
|
+
rx: "2",
|
|
3853
|
+
stroke: "currentColor",
|
|
3854
|
+
strokeWidth: "1.5"
|
|
3855
|
+
}
|
|
3856
|
+
),
|
|
3857
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3858
|
+
"path",
|
|
3859
|
+
{
|
|
3860
|
+
d: "M17 12.5C17 13.3284 16.3284 14 15.5 14C14.6716 14 14 13.3284 14 12.5C14 11.6716 14.6716 11 15.5 11C16.3284 11 17 11.6716 17 12.5Z",
|
|
3861
|
+
fill: "currentColor"
|
|
3862
|
+
}
|
|
3863
|
+
),
|
|
3864
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3865
|
+
"path",
|
|
3866
|
+
{
|
|
3867
|
+
d: "M6 6V5C6 3.89543 6.89543 3 8 3H16C17.1046 3 18 3.89543 18 5V6",
|
|
3868
|
+
stroke: "currentColor",
|
|
3869
|
+
strokeWidth: "1.5"
|
|
3870
|
+
}
|
|
3871
|
+
)
|
|
3872
|
+
]
|
|
3873
|
+
}
|
|
3874
|
+
);
|
|
3875
|
+
function WalletTransferView({
|
|
3876
|
+
chainId,
|
|
3877
|
+
asset,
|
|
3878
|
+
destinationAddress,
|
|
3879
|
+
onBack,
|
|
3880
|
+
onSuccess
|
|
3881
|
+
}) {
|
|
3882
|
+
const { t } = useI18n();
|
|
3883
|
+
const { config } = react.useVolrContext();
|
|
3884
|
+
const { client } = react.useInternalAuth();
|
|
3885
|
+
const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
|
|
3886
|
+
const [viewState, setViewState] = React13.useState("select-wallet");
|
|
3887
|
+
const [selectedWallet, setSelectedWallet] = React13.useState(null);
|
|
3888
|
+
const [connectedAddress, setConnectedAddress] = React13.useState(null);
|
|
3889
|
+
const [balance, setBalance] = React13.useState(null);
|
|
3890
|
+
const [amount, setAmount] = React13.useState("");
|
|
3891
|
+
const [isConnecting, setIsConnecting] = React13.useState(false);
|
|
3892
|
+
const [isTransferring, setIsTransferring] = React13.useState(false);
|
|
3893
|
+
const [error, setError] = React13.useState(null);
|
|
3894
|
+
const [chainName, setChainName] = React13.useState(null);
|
|
3895
|
+
const [currentChainId, setCurrentChainId] = React13.useState(null);
|
|
3896
|
+
const tokenSymbol = asset === "native" ? "ETH" : asset.symbol;
|
|
3897
|
+
const decimals = asset === "native" ? 18 : asset.decimals;
|
|
3898
|
+
const getNetworkInfo = React13.useCallback(
|
|
3899
|
+
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
3900
|
+
[client, config.rpcOverrides]
|
|
3901
|
+
);
|
|
3902
|
+
React13.useEffect(() => {
|
|
3903
|
+
let cancelled = false;
|
|
3904
|
+
const loadChainName = async () => {
|
|
3905
|
+
try {
|
|
3906
|
+
const info = await getNetworkInfo(chainId, false);
|
|
3907
|
+
if (!cancelled) setChainName(info.name);
|
|
3908
|
+
} catch {
|
|
3909
|
+
if (!cancelled) setChainName(`Chain ${chainId}`);
|
|
3910
|
+
}
|
|
3911
|
+
};
|
|
3912
|
+
loadChainName();
|
|
3913
|
+
return () => {
|
|
3914
|
+
cancelled = true;
|
|
3915
|
+
};
|
|
3916
|
+
}, [getNetworkInfo, chainId]);
|
|
3917
|
+
const connectWallet = React13.useCallback(async (wallet) => {
|
|
3918
|
+
setIsConnecting(true);
|
|
3919
|
+
setError(null);
|
|
3920
|
+
try {
|
|
3921
|
+
const provider = wallet.provider;
|
|
3922
|
+
const accounts = await provider.request({ method: "eth_requestAccounts" });
|
|
3923
|
+
if (!accounts || accounts.length === 0) {
|
|
3924
|
+
throw new Error("No accounts found");
|
|
3925
|
+
}
|
|
3926
|
+
const address = accounts[0];
|
|
3927
|
+
setConnectedAddress(address);
|
|
3928
|
+
setSelectedWallet(wallet);
|
|
3929
|
+
const chainIdHex = await provider.request({ method: "eth_chainId" });
|
|
3930
|
+
const currentChain = parseInt(chainIdHex, 16);
|
|
3931
|
+
setCurrentChainId(currentChain);
|
|
3932
|
+
await fetchBalance(provider, address, currentChain);
|
|
3933
|
+
setViewState("transfer");
|
|
3934
|
+
} catch (err) {
|
|
3935
|
+
console.error("Failed to connect wallet:", err);
|
|
3936
|
+
setError(err instanceof Error ? err.message : "Connection failed");
|
|
3937
|
+
} finally {
|
|
3938
|
+
setIsConnecting(false);
|
|
3939
|
+
}
|
|
3940
|
+
}, [chainId, asset]);
|
|
3941
|
+
const fetchBalance = React13.useCallback(async (provider, address, currentChain) => {
|
|
3942
|
+
try {
|
|
3943
|
+
if (currentChain !== chainId) {
|
|
3944
|
+
setBalance(null);
|
|
3945
|
+
return;
|
|
3946
|
+
}
|
|
3947
|
+
if (asset === "native") {
|
|
3948
|
+
const balanceHex = await provider.request({
|
|
3949
|
+
method: "eth_getBalance",
|
|
3950
|
+
params: [address, "latest"]
|
|
3951
|
+
});
|
|
3952
|
+
setBalance(BigInt(balanceHex));
|
|
3953
|
+
} else {
|
|
3954
|
+
const data = `0x70a08231000000000000000000000000${address.slice(2)}`;
|
|
3955
|
+
const result = await provider.request({
|
|
3956
|
+
method: "eth_call",
|
|
3957
|
+
params: [{ to: asset.address, data }, "latest"]
|
|
3958
|
+
});
|
|
3959
|
+
setBalance(BigInt(result));
|
|
3960
|
+
}
|
|
3961
|
+
} catch (err) {
|
|
3962
|
+
console.error("Failed to fetch balance:", err);
|
|
3963
|
+
setBalance(BigInt(0));
|
|
3964
|
+
}
|
|
3965
|
+
}, [chainId, asset]);
|
|
3966
|
+
const switchNetwork = React13.useCallback(async () => {
|
|
3967
|
+
if (!selectedWallet?.provider) return;
|
|
3968
|
+
try {
|
|
3969
|
+
await selectedWallet.provider.request({
|
|
3970
|
+
method: "wallet_switchEthereumChain",
|
|
3971
|
+
params: [{ chainId: `0x${chainId.toString(16)}` }]
|
|
3972
|
+
});
|
|
3973
|
+
const chainIdHex = await selectedWallet.provider.request({ method: "eth_chainId" });
|
|
3974
|
+
const currentChain = parseInt(chainIdHex, 16);
|
|
3975
|
+
setCurrentChainId(currentChain);
|
|
3976
|
+
if (connectedAddress) {
|
|
3977
|
+
await fetchBalance(selectedWallet.provider, connectedAddress, currentChain);
|
|
3978
|
+
}
|
|
3979
|
+
} catch (err) {
|
|
3980
|
+
console.error("Failed to switch network:", err);
|
|
3981
|
+
setError(err instanceof Error ? err.message : "Failed to switch network");
|
|
3982
|
+
}
|
|
3983
|
+
}, [selectedWallet, chainId, connectedAddress, fetchBalance]);
|
|
3984
|
+
const executeTransfer = React13.useCallback(async () => {
|
|
3985
|
+
if (!selectedWallet?.provider || !connectedAddress || !amount) return;
|
|
3986
|
+
setIsTransferring(true);
|
|
3987
|
+
setError(null);
|
|
3988
|
+
try {
|
|
3989
|
+
const amountWei = parseUnits(amount, decimals);
|
|
3990
|
+
if (balance !== null && amountWei > balance) {
|
|
3991
|
+
setError(t("deposit.walletTransfer.insufficientBalance"));
|
|
3992
|
+
setIsTransferring(false);
|
|
3993
|
+
return;
|
|
3994
|
+
}
|
|
3995
|
+
let txHash;
|
|
3996
|
+
if (asset === "native") {
|
|
3997
|
+
txHash = await selectedWallet.provider.request({
|
|
3998
|
+
method: "eth_sendTransaction",
|
|
3999
|
+
params: [{
|
|
4000
|
+
from: connectedAddress,
|
|
4001
|
+
to: destinationAddress,
|
|
4002
|
+
value: `0x${amountWei.toString(16)}`
|
|
4003
|
+
}]
|
|
4004
|
+
});
|
|
4005
|
+
} else {
|
|
4006
|
+
const paddedTo = destinationAddress.slice(2).padStart(64, "0");
|
|
4007
|
+
const paddedAmount = amountWei.toString(16).padStart(64, "0");
|
|
4008
|
+
const data = `0xa9059cbb${paddedTo}${paddedAmount}`;
|
|
4009
|
+
txHash = await selectedWallet.provider.request({
|
|
4010
|
+
method: "eth_sendTransaction",
|
|
4011
|
+
params: [{
|
|
4012
|
+
from: connectedAddress,
|
|
4013
|
+
to: asset.address,
|
|
4014
|
+
data
|
|
4015
|
+
}]
|
|
4016
|
+
});
|
|
4017
|
+
}
|
|
4018
|
+
console.log("Transfer tx hash:", txHash);
|
|
4019
|
+
onSuccess?.();
|
|
4020
|
+
} catch (err) {
|
|
4021
|
+
console.error("Transfer failed:", err);
|
|
4022
|
+
setError(err instanceof Error ? err.message : "Transfer failed");
|
|
4023
|
+
} finally {
|
|
4024
|
+
setIsTransferring(false);
|
|
4025
|
+
}
|
|
4026
|
+
}, [selectedWallet, connectedAddress, amount, decimals, balance, asset, destinationAddress, onSuccess, t]);
|
|
4027
|
+
const setMaxAmount = React13.useCallback(() => {
|
|
4028
|
+
if (balance !== null) {
|
|
4029
|
+
const formatted = formatUnits(balance, decimals);
|
|
4030
|
+
setAmount(formatted);
|
|
4031
|
+
}
|
|
4032
|
+
}, [balance, decimals]);
|
|
4033
|
+
const wallets = getWalletsForDisplay();
|
|
4034
|
+
const isWrongNetwork = currentChainId !== null && currentChainId !== chainId;
|
|
4035
|
+
const formattedBalance = balance !== null ? formatUnits(balance, decimals) : null;
|
|
4036
|
+
if (viewState === "select-wallet") {
|
|
4037
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4038
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4039
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-1", children: t("deposit.walletTransfer.title") }),
|
|
4040
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("deposit.walletTransfer.selectWallet") })
|
|
4041
|
+
] }),
|
|
4042
|
+
isDetecting && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-center volr:py-8", children: [
|
|
4043
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-spin volr:w-6 volr:h-6 volr:border-2 volr:border-slate-300 volr:border-t-slate-600 volr:rounded-full volr:mx-auto" }),
|
|
4044
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500 volr:mt-3", children: t("common.loading") })
|
|
4045
|
+
] }),
|
|
4046
|
+
!isDetecting && !hasWallet && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("deposit.walletTransfer.noWallets") }) }),
|
|
4047
|
+
!isDetecting && wallets.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-2", children: wallets.map((wallet) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4048
|
+
"button",
|
|
4049
|
+
{
|
|
4050
|
+
type: "button",
|
|
4051
|
+
onClick: () => connectWallet(wallet),
|
|
4052
|
+
disabled: isConnecting,
|
|
4053
|
+
className: "volr:w-full volr:flex volr:items-center volr:gap-3 volr:p-3 volr:border volr:border-slate-200 volr:rounded-xl volr:hover:bg-slate-50 volr:transition-colors volr:disabled:opacity-50",
|
|
4054
|
+
children: [
|
|
4055
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-10 volr:h-10 volr:rounded-lg volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden volr:flex-shrink-0", children: wallet.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4056
|
+
"img",
|
|
4057
|
+
{
|
|
4058
|
+
src: wallet.icon,
|
|
4059
|
+
alt: wallet.name,
|
|
4060
|
+
className: "volr:w-7 volr:h-7"
|
|
4061
|
+
}
|
|
4062
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-slate-400", children: /* @__PURE__ */ jsxRuntime.jsx(DefaultWalletIcon2, {}) }) }),
|
|
4063
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:flex-1 volr:text-left volr:font-medium volr:text-slate-900", children: wallet.name }),
|
|
4064
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4065
|
+
"svg",
|
|
4066
|
+
{
|
|
4067
|
+
className: "volr:w-5 volr:h-5 volr:text-slate-400",
|
|
4068
|
+
fill: "none",
|
|
4069
|
+
viewBox: "0 0 24 24",
|
|
4070
|
+
stroke: "currentColor",
|
|
4071
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" })
|
|
4072
|
+
}
|
|
4073
|
+
)
|
|
4074
|
+
]
|
|
4075
|
+
},
|
|
4076
|
+
wallet.id
|
|
4077
|
+
)) }),
|
|
4078
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-600", children: error }) }),
|
|
4079
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-6 volr:pt-4 volr:border-t volr:border-slate-200", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", onClick: onBack, className: "volr:w-full", children: t("common.back") }) })
|
|
4080
|
+
] });
|
|
4081
|
+
}
|
|
4082
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4083
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4084
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-1", children: t("deposit.walletTransfer.title") }),
|
|
4085
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
4086
|
+
selectedWallet?.icon && /* @__PURE__ */ jsxRuntime.jsx("img", { src: selectedWallet.icon, alt: "", className: "volr:w-5 volr:h-5 volr:rounded" }),
|
|
4087
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-sm volr:text-slate-500", children: [
|
|
4088
|
+
connectedAddress?.slice(0, 6),
|
|
4089
|
+
"...",
|
|
4090
|
+
connectedAddress?.slice(-4)
|
|
4091
|
+
] })
|
|
4092
|
+
] })
|
|
4093
|
+
] }),
|
|
4094
|
+
isWrongNetwork && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4 volr:p-3 volr:bg-amber-50 volr:border volr:border-amber-200 volr:rounded-lg", children: [
|
|
4095
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-amber-700 volr:mb-2", children: t("deposit.walletTransfer.wrongNetwork", { network: chainName || `Chain ${chainId}` }) }),
|
|
4096
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4097
|
+
Button,
|
|
4098
|
+
{
|
|
4099
|
+
variant: "secondary",
|
|
4100
|
+
size: "sm",
|
|
4101
|
+
onClick: switchNetwork,
|
|
4102
|
+
className: "volr:w-full",
|
|
4103
|
+
children: t("deposit.walletTransfer.switchNetwork")
|
|
4104
|
+
}
|
|
4105
|
+
)
|
|
4106
|
+
] }),
|
|
4107
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-4 volr:bg-slate-50 volr:rounded-xl volr:border volr:border-slate-200", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between", children: [
|
|
4108
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
4109
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-base volr:font-semibold", children: tokenSymbol }),
|
|
4110
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:px-2 volr:py-0.5 volr:rounded-full volr:bg-slate-200 volr:text-slate-600", children: chainName || `Chain ${chainId}` })
|
|
4111
|
+
] }),
|
|
4112
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-right", children: [
|
|
4113
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500", children: t("deposit.walletTransfer.balance") }),
|
|
4114
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-mono volr:font-medium", children: isWrongNetwork ? "-" : formattedBalance ? `${Number(formattedBalance).toFixed(4)}` : "..." })
|
|
4115
|
+
] })
|
|
4116
|
+
] }) }),
|
|
4117
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4118
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:font-medium volr:text-slate-700 volr:mb-2", children: t("deposit.walletTransfer.amount") }),
|
|
4119
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4120
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4121
|
+
"input",
|
|
4122
|
+
{
|
|
4123
|
+
type: "text",
|
|
4124
|
+
inputMode: "decimal",
|
|
4125
|
+
value: amount,
|
|
4126
|
+
onChange: (e) => setAmount(e.target.value),
|
|
4127
|
+
placeholder: t("deposit.walletTransfer.amountPlaceholder"),
|
|
4128
|
+
disabled: isWrongNetwork,
|
|
4129
|
+
className: "volr:w-full volr:px-4 volr:py-3 volr:pr-16 volr:border volr:border-slate-300 volr:rounded-xl volr:text-base volr:font-mono volr:focus:outline-none volr:focus:ring-2 volr:focus:ring-slate-300 volr:disabled:bg-slate-100 volr:disabled:text-slate-400"
|
|
4130
|
+
}
|
|
4131
|
+
),
|
|
4132
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4133
|
+
"button",
|
|
4134
|
+
{
|
|
4135
|
+
type: "button",
|
|
4136
|
+
onClick: setMaxAmount,
|
|
4137
|
+
disabled: isWrongNetwork || balance === null,
|
|
4138
|
+
className: "volr:absolute volr:right-3 volr:top-1/2 volr:-translate-y-1/2 volr:px-2 volr:py-1 volr:text-xs volr:font-semibold volr:text-slate-600 volr:bg-slate-100 volr:rounded volr:hover:bg-slate-200 volr:disabled:opacity-50",
|
|
4139
|
+
children: t("deposit.walletTransfer.max")
|
|
4140
|
+
}
|
|
4141
|
+
)
|
|
4142
|
+
] })
|
|
4143
|
+
] }),
|
|
4144
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-600", children: error }) }),
|
|
4145
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4146
|
+
Button,
|
|
4147
|
+
{
|
|
4148
|
+
onClick: executeTransfer,
|
|
4149
|
+
disabled: isTransferring || !amount || isWrongNetwork,
|
|
4150
|
+
className: "volr:w-full",
|
|
4151
|
+
children: isTransferring ? t("deposit.walletTransfer.transferring") : t("deposit.walletTransfer.transfer")
|
|
4152
|
+
}
|
|
4153
|
+
),
|
|
4154
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-3", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4155
|
+
Button,
|
|
4156
|
+
{
|
|
4157
|
+
variant: "ghost",
|
|
4158
|
+
onClick: () => setViewState("select-wallet"),
|
|
4159
|
+
className: "volr:w-full",
|
|
4160
|
+
children: t("common.back")
|
|
4161
|
+
}
|
|
4162
|
+
) })
|
|
4163
|
+
] });
|
|
4164
|
+
}
|
|
2810
4165
|
var DepositQRStatusOverlay = ({
|
|
2811
4166
|
status
|
|
2812
4167
|
}) => {
|
|
@@ -3035,7 +4390,7 @@ var DepositCompletedToast = ({
|
|
|
3035
4390
|
symbol
|
|
3036
4391
|
}) => {
|
|
3037
4392
|
const { t } = useI18n();
|
|
3038
|
-
const [expanded, setExpanded] =
|
|
4393
|
+
const [expanded, setExpanded] = React13.useState(false);
|
|
3039
4394
|
const formatAmount = (amount) => {
|
|
3040
4395
|
const divisor = BigInt(10 ** decimals);
|
|
3041
4396
|
const whole = amount / divisor;
|
|
@@ -3045,112 +4400,129 @@ var DepositCompletedToast = ({
|
|
|
3045
4400
|
return trimmedFraction ? `${whole}.${trimmedFraction}` : `${whole}`;
|
|
3046
4401
|
};
|
|
3047
4402
|
const formattedDelta = formatAmount(delta);
|
|
3048
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3049
|
-
|
|
3050
|
-
|
|
3051
|
-
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
"
|
|
3055
|
-
|
|
3056
|
-
|
|
3057
|
-
|
|
3058
|
-
|
|
3059
|
-
|
|
3060
|
-
|
|
3061
|
-
|
|
3062
|
-
|
|
3063
|
-
|
|
3064
|
-
|
|
3065
|
-
|
|
3066
|
-
|
|
3067
|
-
|
|
3068
|
-
|
|
3069
|
-
|
|
3070
|
-
|
|
3071
|
-
|
|
3072
|
-
|
|
3073
|
-
|
|
3074
|
-
|
|
3075
|
-
|
|
3076
|
-
|
|
3077
|
-
|
|
3078
|
-
|
|
3079
|
-
|
|
3080
|
-
|
|
3081
|
-
|
|
3082
|
-
|
|
3083
|
-
|
|
3084
|
-
|
|
3085
|
-
|
|
3086
|
-
|
|
3087
|
-
|
|
4403
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
4404
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4405
|
+
"div",
|
|
4406
|
+
{
|
|
4407
|
+
className: "volr:absolute volr:inset-0 volr:bg-black/40 volr:z-40",
|
|
4408
|
+
onClick: onClose,
|
|
4409
|
+
style: { animation: "volrFadeIn 0.2s ease-out" }
|
|
4410
|
+
}
|
|
4411
|
+
),
|
|
4412
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4413
|
+
"div",
|
|
4414
|
+
{
|
|
4415
|
+
className: cn(
|
|
4416
|
+
// Position: centered at bottom with margin
|
|
4417
|
+
"volr:absolute volr:bottom-3 volr:left-3 volr:right-3 volr:z-50",
|
|
4418
|
+
// Appearance: floating card
|
|
4419
|
+
"volr:bg-white volr:rounded-2xl",
|
|
4420
|
+
// Border: full border for clear card definition
|
|
4421
|
+
"volr:border volr:border-slate-200",
|
|
4422
|
+
// Shadow: strong shadow for floating effect
|
|
4423
|
+
"volr:shadow-2xl",
|
|
4424
|
+
// Animation
|
|
4425
|
+
"volr:transition-all volr:duration-300 volr:ease-out"
|
|
4426
|
+
),
|
|
4427
|
+
style: {
|
|
4428
|
+
animation: "volrSlideUp 0.3s ease-out"
|
|
4429
|
+
},
|
|
4430
|
+
children: [
|
|
4431
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-1 volr:bg-gradient-to-r volr:from-emerald-400 volr:to-teal-500 volr:rounded-t-2xl" }),
|
|
4432
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:gap-3", children: [
|
|
4433
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:shrink-0 volr:w-10 volr:h-10 volr:rounded-full volr:bg-gradient-to-br volr:from-emerald-500 volr:to-teal-500 volr:flex volr:items-center volr:justify-center volr:shadow-md", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4434
|
+
"svg",
|
|
4435
|
+
{
|
|
4436
|
+
width: "20",
|
|
4437
|
+
height: "20",
|
|
4438
|
+
viewBox: "0 0 24 24",
|
|
4439
|
+
fill: "none",
|
|
4440
|
+
stroke: "white",
|
|
4441
|
+
strokeWidth: "2.5",
|
|
4442
|
+
strokeLinecap: "round",
|
|
4443
|
+
strokeLinejoin: "round",
|
|
4444
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
|
|
4445
|
+
}
|
|
4446
|
+
) }),
|
|
4447
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
4448
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:justify-between volr:gap-2 volr:mb-1", children: [
|
|
4449
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-semibold volr:text-slate-900", children: t("deposit.completed") }),
|
|
4450
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4451
|
+
"button",
|
|
4452
|
+
{
|
|
4453
|
+
onClick: onClose,
|
|
4454
|
+
className: "volr:shrink-0 volr:w-6 volr:h-6 volr:flex volr:items-center volr:justify-center volr:rounded-full volr:transition-colors volr:bg-slate-100 volr:text-slate-500 volr:hover:bg-slate-200",
|
|
4455
|
+
"aria-label": "Close",
|
|
4456
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4457
|
+
"svg",
|
|
4458
|
+
{
|
|
4459
|
+
width: "14",
|
|
4460
|
+
height: "14",
|
|
4461
|
+
viewBox: "0 0 24 24",
|
|
4462
|
+
fill: "none",
|
|
4463
|
+
stroke: "currentColor",
|
|
4464
|
+
strokeWidth: "2.5",
|
|
4465
|
+
children: [
|
|
4466
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
4467
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
4468
|
+
]
|
|
4469
|
+
}
|
|
4470
|
+
)
|
|
4471
|
+
}
|
|
4472
|
+
)
|
|
4473
|
+
] }),
|
|
4474
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-700 volr:mb-3", children: t("deposit.completedAmount", { amount: formattedDelta, symbol }) }),
|
|
4475
|
+
expanded && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4476
|
+
"div",
|
|
4477
|
+
{
|
|
4478
|
+
className: "volr:space-y-2 volr:mb-3 volr:p-3 volr:rounded-lg volr:bg-slate-50 volr:border volr:border-slate-200",
|
|
4479
|
+
style: { animation: "volrFadeIn 0.2s ease-out" },
|
|
4480
|
+
children: [
|
|
4481
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
4482
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.amount") }),
|
|
4483
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-emerald-600 volr:font-semibold", children: [
|
|
4484
|
+
"+",
|
|
4485
|
+
formattedDelta,
|
|
4486
|
+
" ",
|
|
4487
|
+
symbol
|
|
4488
|
+
] })
|
|
4489
|
+
] }),
|
|
4490
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
4491
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.previousBalance") }),
|
|
4492
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-slate-500", children: [
|
|
4493
|
+
formatAmount(previousBalance),
|
|
4494
|
+
" ",
|
|
4495
|
+
symbol
|
|
4496
|
+
] })
|
|
4497
|
+
] }),
|
|
4498
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs volr:pt-2 volr:border-t volr:border-slate-200", children: [
|
|
4499
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.newBalance") }),
|
|
4500
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:font-semibold volr:text-slate-900", children: [
|
|
4501
|
+
formatAmount(newBalance),
|
|
4502
|
+
" ",
|
|
4503
|
+
symbol
|
|
4504
|
+
] })
|
|
4505
|
+
] })
|
|
4506
|
+
]
|
|
4507
|
+
}
|
|
4508
|
+
),
|
|
3088
4509
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3089
4510
|
"button",
|
|
3090
4511
|
{
|
|
3091
|
-
onClick:
|
|
3092
|
-
className: "volr:
|
|
3093
|
-
"
|
|
3094
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3095
|
-
"svg",
|
|
3096
|
-
{
|
|
3097
|
-
width: "14",
|
|
3098
|
-
height: "14",
|
|
3099
|
-
viewBox: "0 0 24 24",
|
|
3100
|
-
fill: "none",
|
|
3101
|
-
stroke: "currentColor",
|
|
3102
|
-
strokeWidth: "2.5",
|
|
3103
|
-
children: [
|
|
3104
|
-
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
3105
|
-
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
3106
|
-
]
|
|
3107
|
-
}
|
|
3108
|
-
)
|
|
4512
|
+
onClick: () => setExpanded(!expanded),
|
|
4513
|
+
className: "volr:w-full volr:py-2.5 volr:text-xs volr:font-medium volr:rounded-lg volr:transition-colors volr:bg-slate-100 volr:text-slate-600 volr:border volr:border-slate-200 volr:hover:bg-slate-200",
|
|
4514
|
+
children: expanded ? t("deposit.seeLess") : t("deposit.seeMore")
|
|
3109
4515
|
}
|
|
3110
4516
|
)
|
|
3111
|
-
] })
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
"+",
|
|
3118
|
-
formattedDelta,
|
|
3119
|
-
" ",
|
|
3120
|
-
symbol
|
|
3121
|
-
] })
|
|
3122
|
-
] }),
|
|
3123
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
3124
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr-text-secondary", children: t("deposit.previousBalance") }),
|
|
3125
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr-text-secondary", children: [
|
|
3126
|
-
formatAmount(previousBalance),
|
|
3127
|
-
" ",
|
|
3128
|
-
symbol
|
|
3129
|
-
] })
|
|
3130
|
-
] }),
|
|
3131
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs volr:pt-2 volr:border-t volr-border", children: [
|
|
3132
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr-text-secondary", children: t("deposit.newBalance") }),
|
|
3133
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:font-semibold", children: [
|
|
3134
|
-
formatAmount(newBalance),
|
|
3135
|
-
" ",
|
|
3136
|
-
symbol
|
|
3137
|
-
] })
|
|
3138
|
-
] })
|
|
3139
|
-
] }),
|
|
3140
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3141
|
-
"button",
|
|
3142
|
-
{
|
|
3143
|
-
onClick: () => setExpanded(!expanded),
|
|
3144
|
-
className: "volr:w-full volr:py-2.5 volr:text-xs volr:font-medium volr:rounded-lg volr:transition-colors volr:border volr-bg-secondary volr-text-secondary volr-border volr-hover",
|
|
3145
|
-
children: expanded ? t("deposit.seeLess") : t("deposit.seeMore")
|
|
3146
|
-
}
|
|
3147
|
-
)
|
|
3148
|
-
] })
|
|
3149
|
-
] }) }),
|
|
3150
|
-
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
4517
|
+
] })
|
|
4518
|
+
] }) })
|
|
4519
|
+
]
|
|
4520
|
+
}
|
|
4521
|
+
),
|
|
4522
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
3151
4523
|
@keyframes volrSlideUp {
|
|
3152
4524
|
from {
|
|
3153
|
-
transform: translateY(
|
|
4525
|
+
transform: translateY(20px);
|
|
3154
4526
|
opacity: 0;
|
|
3155
4527
|
}
|
|
3156
4528
|
to {
|
|
@@ -3167,9 +4539,7 @@ var DepositCompletedToast = ({
|
|
|
3167
4539
|
}
|
|
3168
4540
|
}
|
|
3169
4541
|
` })
|
|
3170
|
-
|
|
3171
|
-
}
|
|
3172
|
-
);
|
|
4542
|
+
] });
|
|
3173
4543
|
};
|
|
3174
4544
|
var DepositSkeleton = () => {
|
|
3175
4545
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:animate-pulse", children: [
|
|
@@ -3190,10 +4560,11 @@ function DepositQRView(props) {
|
|
|
3190
4560
|
const { t } = useI18n();
|
|
3191
4561
|
const { config } = react.useVolrContext();
|
|
3192
4562
|
const { client } = react.useInternalAuth();
|
|
3193
|
-
const [chainName, setChainName] =
|
|
3194
|
-
const [showOtherTokenModal, setShowOtherTokenModal] =
|
|
3195
|
-
const [showToast, setShowToast] =
|
|
3196
|
-
const [toastData, setToastData] =
|
|
4563
|
+
const [chainName, setChainName] = React13.useState(null);
|
|
4564
|
+
const [showOtherTokenModal, setShowOtherTokenModal] = React13.useState(false);
|
|
4565
|
+
const [showToast, setShowToast] = React13.useState(false);
|
|
4566
|
+
const [toastData, setToastData] = React13.useState(null);
|
|
4567
|
+
const [viewMode, setViewMode] = React13.useState("qr");
|
|
3197
4568
|
const eip681 = `ethereum:${props.address}`;
|
|
3198
4569
|
const status = react.useDepositListener({
|
|
3199
4570
|
chainId: props.chainId,
|
|
@@ -3206,7 +4577,7 @@ function DepositQRView(props) {
|
|
|
3206
4577
|
},
|
|
3207
4578
|
address: props.address
|
|
3208
4579
|
});
|
|
3209
|
-
|
|
4580
|
+
React13.useEffect(() => {
|
|
3210
4581
|
if (status.state === "detected") {
|
|
3211
4582
|
setToastData({
|
|
3212
4583
|
previousBalance: status.previousBalance,
|
|
@@ -3216,11 +4587,11 @@ function DepositQRView(props) {
|
|
|
3216
4587
|
setShowToast(true);
|
|
3217
4588
|
}
|
|
3218
4589
|
}, [status]);
|
|
3219
|
-
const getNetworkInfo =
|
|
4590
|
+
const getNetworkInfo = React13.useCallback(
|
|
3220
4591
|
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
3221
4592
|
[client, config.rpcOverrides]
|
|
3222
4593
|
);
|
|
3223
|
-
|
|
4594
|
+
React13.useEffect(() => {
|
|
3224
4595
|
let cancelled = false;
|
|
3225
4596
|
const loadChainName = async () => {
|
|
3226
4597
|
try {
|
|
@@ -3242,6 +4613,36 @@ function DepositQRView(props) {
|
|
|
3242
4613
|
const tokenSymbol = props.asset === "native" ? "ETH" : props.asset.symbol;
|
|
3243
4614
|
const displayChainName = chainName || `Chain ${props.chainId}`;
|
|
3244
4615
|
const decimals = props.asset === "native" ? 18 : props.asset.decimals;
|
|
4616
|
+
if (viewMode === "wallet-transfer") {
|
|
4617
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4618
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4619
|
+
WalletTransferView,
|
|
4620
|
+
{
|
|
4621
|
+
chainId: props.chainId,
|
|
4622
|
+
asset: props.asset,
|
|
4623
|
+
destinationAddress: props.address,
|
|
4624
|
+
onBack: () => setViewMode("qr"),
|
|
4625
|
+
onSuccess: () => {
|
|
4626
|
+
setViewMode("qr");
|
|
4627
|
+
}
|
|
4628
|
+
}
|
|
4629
|
+
),
|
|
4630
|
+
showToast && toastData && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4631
|
+
DepositCompletedToast,
|
|
4632
|
+
{
|
|
4633
|
+
onClose: () => {
|
|
4634
|
+
setShowToast(false);
|
|
4635
|
+
setToastData(null);
|
|
4636
|
+
},
|
|
4637
|
+
previousBalance: toastData.previousBalance,
|
|
4638
|
+
newBalance: toastData.newBalance,
|
|
4639
|
+
delta: toastData.delta,
|
|
4640
|
+
decimals,
|
|
4641
|
+
symbol: tokenSymbol
|
|
4642
|
+
}
|
|
4643
|
+
)
|
|
4644
|
+
] });
|
|
4645
|
+
}
|
|
3245
4646
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3246
4647
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3247
4648
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-2", children: t("deposit.qrTitle") }),
|
|
@@ -3287,7 +4688,33 @@ function DepositQRView(props) {
|
|
|
3287
4688
|
] }) }) }),
|
|
3288
4689
|
status.state === "error" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-center volr:mb-4 volr-error", children: status.message })
|
|
3289
4690
|
] }),
|
|
3290
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:
|
|
4691
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4", children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4692
|
+
"button",
|
|
4693
|
+
{
|
|
4694
|
+
type: "button",
|
|
4695
|
+
onClick: () => setViewMode("wallet-transfer"),
|
|
4696
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-center volr:gap-2 volr:py-3 volr:px-4 volr:border volr:border-slate-200 volr:rounded-xl volr:text-sm volr:font-medium volr:text-slate-700 volr:bg-white volr:hover:bg-slate-50 volr:transition-colors",
|
|
4697
|
+
children: [
|
|
4698
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4699
|
+
"svg",
|
|
4700
|
+
{
|
|
4701
|
+
className: "volr:w-5 volr:h-5",
|
|
4702
|
+
viewBox: "0 0 24 24",
|
|
4703
|
+
fill: "none",
|
|
4704
|
+
stroke: "currentColor",
|
|
4705
|
+
strokeWidth: "1.5",
|
|
4706
|
+
children: [
|
|
4707
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2", y: "6", width: "20", height: "14", rx: "2" }),
|
|
4708
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 12.5C17 13.3284 16.3284 14 15.5 14C14.6716 14 14 13.3284 14 12.5C14 11.6716 14.6716 11 15.5 11C16.3284 11 17 11.6716 17 12.5Z", fill: "currentColor" }),
|
|
4709
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 6V5C6 3.89543 6.89543 3 8 3H16C17.1046 3 18 3.89543 18 5V6" })
|
|
4710
|
+
]
|
|
4711
|
+
}
|
|
4712
|
+
),
|
|
4713
|
+
t("deposit.useWallet")
|
|
4714
|
+
]
|
|
4715
|
+
}
|
|
4716
|
+
) }),
|
|
4717
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:pt-3 volr:mt-3 volr:border-t volr-border", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr-text-secondary", children: [
|
|
3291
4718
|
t("deposit.noToken"),
|
|
3292
4719
|
" ",
|
|
3293
4720
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -3334,19 +4761,40 @@ function DepositModalBody({
|
|
|
3334
4761
|
if (error) {
|
|
3335
4762
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3336
4763
|
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
3337
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4764
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4765
|
+
"div",
|
|
4766
|
+
{
|
|
4767
|
+
className: "volr:absolute volr:inset-0 volr:flex volr:items-center volr:justify-center volr-surface",
|
|
4768
|
+
style: { opacity: 0.9 },
|
|
4769
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-error", children: error })
|
|
4770
|
+
}
|
|
4771
|
+
)
|
|
3338
4772
|
] });
|
|
3339
4773
|
}
|
|
3340
4774
|
if (depositAssets.length === 0) {
|
|
3341
4775
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3342
4776
|
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
3343
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4777
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4778
|
+
"div",
|
|
4779
|
+
{
|
|
4780
|
+
className: "volr:absolute volr:inset-0 volr:flex volr:items-center volr:justify-center volr-surface",
|
|
4781
|
+
style: { opacity: 0.9 },
|
|
4782
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-text-secondary", children: "No payment token configured. Please contact the app developer." })
|
|
4783
|
+
}
|
|
4784
|
+
)
|
|
3344
4785
|
] });
|
|
3345
4786
|
}
|
|
3346
4787
|
if (!evmAddress) {
|
|
3347
4788
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3348
4789
|
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
3349
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4790
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4791
|
+
"div",
|
|
4792
|
+
{
|
|
4793
|
+
className: "volr:absolute volr:inset-0 volr:flex volr:items-center volr:justify-center volr-surface",
|
|
4794
|
+
style: { opacity: 0.9 },
|
|
4795
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-text-secondary", children: "Wallet address is not ready. Please finish wallet setup first." })
|
|
4796
|
+
}
|
|
4797
|
+
)
|
|
3350
4798
|
] });
|
|
3351
4799
|
}
|
|
3352
4800
|
if (depositAssets.length === 1) {
|
|
@@ -3387,11 +4835,11 @@ var DepositModal = ({
|
|
|
3387
4835
|
}) => {
|
|
3388
4836
|
const { user } = react.useVolrContext();
|
|
3389
4837
|
const { client } = react.useInternalAuth();
|
|
3390
|
-
const [depositAssets, setDepositAssets] =
|
|
3391
|
-
const [isLoading, setIsLoading] =
|
|
3392
|
-
const [error, setError] =
|
|
3393
|
-
const [selectedIdx, setSelectedIdx] =
|
|
3394
|
-
|
|
4838
|
+
const [depositAssets, setDepositAssets] = React13.useState([]);
|
|
4839
|
+
const [isLoading, setIsLoading] = React13.useState(true);
|
|
4840
|
+
const [error, setError] = React13.useState(null);
|
|
4841
|
+
const [selectedIdx, setSelectedIdx] = React13.useState(-1);
|
|
4842
|
+
React13.useEffect(() => {
|
|
3395
4843
|
if (!open) return;
|
|
3396
4844
|
setIsLoading(true);
|
|
3397
4845
|
setError(null);
|
|
@@ -3418,12 +4866,12 @@ var DepositModal = ({
|
|
|
3418
4866
|
if (depositAssets.length === 1) return 0;
|
|
3419
4867
|
return -1;
|
|
3420
4868
|
};
|
|
3421
|
-
|
|
4869
|
+
React13.useEffect(() => {
|
|
3422
4870
|
if (open && !isLoading && depositAssets.length > 0) {
|
|
3423
4871
|
setSelectedIdx(getInitialIndex());
|
|
3424
4872
|
}
|
|
3425
4873
|
}, [open, isLoading, depositAssets.length, asset]);
|
|
3426
|
-
|
|
4874
|
+
React13.useEffect(() => {
|
|
3427
4875
|
if (!open) {
|
|
3428
4876
|
setSelectedIdx(-1);
|
|
3429
4877
|
}
|
|
@@ -3452,11 +4900,6 @@ var DepositModal = ({
|
|
|
3452
4900
|
)
|
|
3453
4901
|
] });
|
|
3454
4902
|
};
|
|
3455
|
-
|
|
3456
|
-
// ../node_modules/viem/_esm/index.js
|
|
3457
|
-
init_abis();
|
|
3458
|
-
|
|
3459
|
-
// src/hooks/usePaymentModalState.ts
|
|
3460
4903
|
var initialState = {
|
|
3461
4904
|
step: "info",
|
|
3462
4905
|
processingStep: "signing",
|
|
@@ -3571,7 +5014,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3571
5014
|
const { evm } = react.useVolr();
|
|
3572
5015
|
const { paymentOptions } = useVolrModal();
|
|
3573
5016
|
const { createPayment, updatePaymentToProcessing, pollPaymentStatus, failPendingPayment } = react.useVolrPaymentApi();
|
|
3574
|
-
const [state, dispatch] =
|
|
5017
|
+
const [state, dispatch] = React13.useReducer(paymentModalReducer, initialState);
|
|
3575
5018
|
const tokensWithBalances = state.tokens.map((token) => {
|
|
3576
5019
|
const balanceData = state.tokenBalances.get(token.id);
|
|
3577
5020
|
return {
|
|
@@ -3583,7 +5026,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3583
5026
|
});
|
|
3584
5027
|
const selectedToken = state.selectedTokenId ? tokensWithBalances.find((t) => t.id === state.selectedTokenId) ?? null : null;
|
|
3585
5028
|
const isBalanceLoading = tokensWithBalances.some((t) => t.isBalanceLoading);
|
|
3586
|
-
const fetchTokenBalance =
|
|
5029
|
+
const fetchTokenBalance = React13.useCallback(
|
|
3587
5030
|
async (token) => {
|
|
3588
5031
|
if (!user?.evmAddress) {
|
|
3589
5032
|
dispatch({
|
|
@@ -3631,20 +5074,20 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3631
5074
|
},
|
|
3632
5075
|
[user, evm]
|
|
3633
5076
|
);
|
|
3634
|
-
const fetchAllBalances =
|
|
5077
|
+
const fetchAllBalances = React13.useCallback(
|
|
3635
5078
|
async (tokens) => {
|
|
3636
5079
|
await Promise.all(tokens.map((token) => fetchTokenBalance(token)));
|
|
3637
5080
|
},
|
|
3638
5081
|
[fetchTokenBalance]
|
|
3639
5082
|
);
|
|
3640
|
-
const fetchBranding =
|
|
5083
|
+
const fetchBranding = React13.useCallback(async () => {
|
|
3641
5084
|
try {
|
|
3642
5085
|
const response = await client.get("/auth/branding");
|
|
3643
5086
|
dispatch({ type: "SET_LOGO_URL", logoUrl: response.logoUrl });
|
|
3644
5087
|
} catch {
|
|
3645
5088
|
}
|
|
3646
5089
|
}, [client]);
|
|
3647
|
-
const fetchPaymentConfig =
|
|
5090
|
+
const fetchPaymentConfig = React13.useCallback(async () => {
|
|
3648
5091
|
dispatch({ type: "SET_CONFIG_LOADING", loading: true });
|
|
3649
5092
|
try {
|
|
3650
5093
|
const response = await client.get("/payments/config");
|
|
@@ -3661,7 +5104,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3661
5104
|
dispatch({ type: "SET_CONFIG_LOADING", loading: false });
|
|
3662
5105
|
}
|
|
3663
5106
|
}, [client, fetchAllBalances]);
|
|
3664
|
-
const selectBestToken =
|
|
5107
|
+
const selectBestToken = React13.useCallback(() => {
|
|
3665
5108
|
if (state.tokens.length === 0) return;
|
|
3666
5109
|
if (state.selectedTokenId) return;
|
|
3667
5110
|
let bestTokenId = state.tokens[0].id;
|
|
@@ -3675,7 +5118,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3675
5118
|
}
|
|
3676
5119
|
dispatch({ type: "SELECT_TOKEN", tokenId: bestTokenId });
|
|
3677
5120
|
}, [state.tokens, state.tokenBalances, state.selectedTokenId]);
|
|
3678
|
-
|
|
5121
|
+
React13.useEffect(() => {
|
|
3679
5122
|
if (open && paymentOptions?.options) {
|
|
3680
5123
|
if (state.step === "processing" || state.step === "result") {
|
|
3681
5124
|
return;
|
|
@@ -3687,15 +5130,15 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3687
5130
|
dispatch({ type: "RESET" });
|
|
3688
5131
|
}
|
|
3689
5132
|
}, [open, paymentOptions?.options?.amount]);
|
|
3690
|
-
|
|
5133
|
+
React13.useEffect(() => {
|
|
3691
5134
|
if (!isBalanceLoading && state.tokens.length > 0 && !state.selectedTokenId) {
|
|
3692
5135
|
selectBestToken();
|
|
3693
5136
|
}
|
|
3694
5137
|
}, [isBalanceLoading, state.tokens.length, state.selectedTokenId, selectBestToken]);
|
|
3695
|
-
const handleSelectToken =
|
|
5138
|
+
const handleSelectToken = React13.useCallback((tokenId) => {
|
|
3696
5139
|
dispatch({ type: "SELECT_TOKEN", tokenId });
|
|
3697
5140
|
}, []);
|
|
3698
|
-
const handlePay =
|
|
5141
|
+
const handlePay = React13.useCallback(async () => {
|
|
3699
5142
|
const { payOptions, receiverAddress, selectedTokenId } = state;
|
|
3700
5143
|
if (!payOptions || !user?.evmAddress || !paymentOptions || !receiverAddress || !selectedTokenId) {
|
|
3701
5144
|
return;
|
|
@@ -3782,10 +5225,10 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3782
5225
|
pollPaymentStatus,
|
|
3783
5226
|
failPendingPayment
|
|
3784
5227
|
]);
|
|
3785
|
-
const handleDeposit =
|
|
5228
|
+
const handleDeposit = React13.useCallback(() => {
|
|
3786
5229
|
dispatch({ type: "SHOW_DEPOSIT" });
|
|
3787
5230
|
}, []);
|
|
3788
|
-
const handleDepositClose =
|
|
5231
|
+
const handleDepositClose = React13.useCallback(
|
|
3789
5232
|
(depositOpen) => {
|
|
3790
5233
|
if (!depositOpen) {
|
|
3791
5234
|
dispatch({ type: "HIDE_DEPOSIT" });
|
|
@@ -3796,19 +5239,19 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3796
5239
|
},
|
|
3797
5240
|
[state.tokens, fetchAllBalances]
|
|
3798
5241
|
);
|
|
3799
|
-
const handleDone =
|
|
5242
|
+
const handleDone = React13.useCallback(() => {
|
|
3800
5243
|
if (state.createdPayment?.status === "CONFIRMED") {
|
|
3801
5244
|
paymentOptions?.onComplete?.(state.createdPayment);
|
|
3802
5245
|
}
|
|
3803
5246
|
onOpenChange(false);
|
|
3804
5247
|
}, [state.createdPayment, paymentOptions, onOpenChange]);
|
|
3805
|
-
const handleRetry =
|
|
5248
|
+
const handleRetry = React13.useCallback(() => {
|
|
3806
5249
|
dispatch({ type: "RETRY" });
|
|
3807
5250
|
if (state.tokens.length > 0) {
|
|
3808
5251
|
fetchAllBalances(state.tokens);
|
|
3809
5252
|
}
|
|
3810
5253
|
}, [state.tokens, fetchAllBalances]);
|
|
3811
|
-
const handleClose =
|
|
5254
|
+
const handleClose = React13.useCallback(() => {
|
|
3812
5255
|
if (state.step === "processing") {
|
|
3813
5256
|
return;
|
|
3814
5257
|
}
|
|
@@ -3817,7 +5260,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3817
5260
|
}
|
|
3818
5261
|
onOpenChange(false);
|
|
3819
5262
|
}, [state.step, paymentOptions, onOpenChange]);
|
|
3820
|
-
const handleReport =
|
|
5263
|
+
const handleReport = React13.useCallback(async () => {
|
|
3821
5264
|
const { createdPayment, error, step, txHash, selectedTokenId } = state;
|
|
3822
5265
|
const tokenInfo = state.tokens.find((t) => t.id === selectedTokenId);
|
|
3823
5266
|
if (!createdPayment || !error) return;
|
|
@@ -3972,10 +5415,10 @@ var TokenSelector = ({
|
|
|
3972
5415
|
onSelect,
|
|
3973
5416
|
disabled = false
|
|
3974
5417
|
}) => {
|
|
3975
|
-
const [isOpen, setIsOpen] =
|
|
3976
|
-
const dropdownRef =
|
|
5418
|
+
const [isOpen, setIsOpen] = React13.useState(false);
|
|
5419
|
+
const dropdownRef = React13.useRef(null);
|
|
3977
5420
|
const selectedToken = tokens.find((t) => t.id === selectedTokenId);
|
|
3978
|
-
|
|
5421
|
+
React13.useEffect(() => {
|
|
3979
5422
|
const handleClickOutside = (event) => {
|
|
3980
5423
|
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
3981
5424
|
setIsOpen(false);
|
|
@@ -4481,19 +5924,19 @@ var PaymentModal = ({
|
|
|
4481
5924
|
)
|
|
4482
5925
|
] });
|
|
4483
5926
|
};
|
|
4484
|
-
var SignRequestContext =
|
|
5927
|
+
var SignRequestContext = React13.createContext(null);
|
|
4485
5928
|
function SignRequestProvider({ children }) {
|
|
4486
|
-
const [pendingRequest, setPendingRequest] =
|
|
4487
|
-
const resolveRef =
|
|
4488
|
-
const rejectRef =
|
|
4489
|
-
const requestSign =
|
|
5929
|
+
const [pendingRequest, setPendingRequest] = React13.useState(null);
|
|
5930
|
+
const resolveRef = React13.useRef(null);
|
|
5931
|
+
const rejectRef = React13.useRef(null);
|
|
5932
|
+
const requestSign = React13.useCallback((request) => {
|
|
4490
5933
|
return new Promise((resolve, reject2) => {
|
|
4491
5934
|
setPendingRequest(request);
|
|
4492
5935
|
resolveRef.current = resolve;
|
|
4493
5936
|
rejectRef.current = reject2;
|
|
4494
5937
|
});
|
|
4495
5938
|
}, []);
|
|
4496
|
-
const approve =
|
|
5939
|
+
const approve = React13.useCallback(() => {
|
|
4497
5940
|
if (resolveRef.current) {
|
|
4498
5941
|
resolveRef.current();
|
|
4499
5942
|
resolveRef.current = null;
|
|
@@ -4501,7 +5944,7 @@ function SignRequestProvider({ children }) {
|
|
|
4501
5944
|
}
|
|
4502
5945
|
setPendingRequest(null);
|
|
4503
5946
|
}, []);
|
|
4504
|
-
const reject =
|
|
5947
|
+
const reject = React13.useCallback(() => {
|
|
4505
5948
|
if (rejectRef.current) {
|
|
4506
5949
|
rejectRef.current(new Error("Sign request cancelled by user"));
|
|
4507
5950
|
resolveRef.current = null;
|
|
@@ -4523,7 +5966,7 @@ function SignRequestProvider({ children }) {
|
|
|
4523
5966
|
);
|
|
4524
5967
|
}
|
|
4525
5968
|
function useSignRequest() {
|
|
4526
|
-
const context =
|
|
5969
|
+
const context = React13.useContext(SignRequestContext);
|
|
4527
5970
|
if (!context) {
|
|
4528
5971
|
throw new Error("useSignRequest must be used within SignRequestProvider");
|
|
4529
5972
|
}
|
|
@@ -4532,7 +5975,7 @@ function useSignRequest() {
|
|
|
4532
5975
|
};
|
|
4533
5976
|
}
|
|
4534
5977
|
function useSignRequestInternal() {
|
|
4535
|
-
const context =
|
|
5978
|
+
const context = React13.useContext(SignRequestContext);
|
|
4536
5979
|
if (!context) {
|
|
4537
5980
|
throw new Error("useSignRequestInternal must be used within SignRequestProvider");
|
|
4538
5981
|
}
|
|
@@ -4567,7 +6010,7 @@ function MessageSignView({ message }) {
|
|
|
4567
6010
|
] });
|
|
4568
6011
|
}
|
|
4569
6012
|
function TypedDataSignView({ typedData }) {
|
|
4570
|
-
const [showRawData, setShowRawData] =
|
|
6013
|
+
const [showRawData, setShowRawData] = React13.useState(false);
|
|
4571
6014
|
const { domain, message } = typedData;
|
|
4572
6015
|
const appName = domain.name;
|
|
4573
6016
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-4", children: [
|
|
@@ -4713,16 +6156,16 @@ function SignRequestModal({ open, onOpenChange }) {
|
|
|
4713
6156
|
}
|
|
4714
6157
|
);
|
|
4715
6158
|
}
|
|
4716
|
-
var VolrUIContext =
|
|
6159
|
+
var VolrUIContext = React13__default.default.createContext(null);
|
|
4717
6160
|
var useVolrUI = () => {
|
|
4718
|
-
const context =
|
|
6161
|
+
const context = React13.useContext(VolrUIContext);
|
|
4719
6162
|
if (!context) {
|
|
4720
6163
|
throw new Error("useVolrUI must be used within VolrUIProvider");
|
|
4721
6164
|
}
|
|
4722
6165
|
return context;
|
|
4723
6166
|
};
|
|
4724
6167
|
var useVolrUIOptional = () => {
|
|
4725
|
-
return
|
|
6168
|
+
return React13.useContext(VolrUIContext);
|
|
4726
6169
|
};
|
|
4727
6170
|
function OnboardingFlow({
|
|
4728
6171
|
keyStorageType,
|
|
@@ -4778,10 +6221,10 @@ var VolrUIProvider = ({
|
|
|
4778
6221
|
const providerPolicy = config.providerPolicy ?? {
|
|
4779
6222
|
enforceOnFirstLogin: true
|
|
4780
6223
|
};
|
|
4781
|
-
const [keyStorageTypeError, setKeyStorageTypeError] =
|
|
6224
|
+
const [keyStorageTypeError, setKeyStorageTypeError] = React13.useState(
|
|
4782
6225
|
null
|
|
4783
6226
|
);
|
|
4784
|
-
|
|
6227
|
+
React13.useEffect(() => {
|
|
4785
6228
|
if (providerPolicy.enforceOnFirstLogin !== false && !keyStorageType) {
|
|
4786
6229
|
const errorMessage = "keyStorageType must be specified in VolrUIProvider props. Please set keyStorageType prop in VolrUIProvider.";
|
|
4787
6230
|
console.error(errorMessage);
|
|
@@ -4825,7 +6268,7 @@ function VolrUIProviderInner({
|
|
|
4825
6268
|
providerPolicy,
|
|
4826
6269
|
children
|
|
4827
6270
|
}) {
|
|
4828
|
-
const [showOnboarding, setShowOnboarding] =
|
|
6271
|
+
const [showOnboarding, setShowOnboarding] = React13.useState(false);
|
|
4829
6272
|
const { requestSign } = useSignRequest();
|
|
4830
6273
|
const configWithSignRequest = {
|
|
4831
6274
|
...config,
|
|
@@ -4888,9 +6331,9 @@ function VolrUIProviderInner({
|
|
|
4888
6331
|
}
|
|
4889
6332
|
function AccountModalPortal() {
|
|
4890
6333
|
const { isOpen, mode, close } = useVolrModal();
|
|
4891
|
-
const [portalRoot, setPortalRoot] =
|
|
4892
|
-
const [error, setError] =
|
|
4893
|
-
|
|
6334
|
+
const [portalRoot, setPortalRoot] = React13.useState(null);
|
|
6335
|
+
const [error, setError] = React13.useState(null);
|
|
6336
|
+
React13.useEffect(() => {
|
|
4894
6337
|
if (typeof window === "undefined") return;
|
|
4895
6338
|
let root = document.getElementById("volr-modal-root");
|
|
4896
6339
|
if (!root) {
|
|
@@ -4949,9 +6392,9 @@ function AccountModalPortal() {
|
|
|
4949
6392
|
function DepositModalPortal() {
|
|
4950
6393
|
const { isOpen, mode, asset, close } = useVolrModal();
|
|
4951
6394
|
const { user } = react.useVolrContext();
|
|
4952
|
-
const [portalRoot, setPortalRoot] =
|
|
4953
|
-
const [showLogin, setShowLogin] =
|
|
4954
|
-
|
|
6395
|
+
const [portalRoot, setPortalRoot] = React13.useState(null);
|
|
6396
|
+
const [showLogin, setShowLogin] = React13.useState(false);
|
|
6397
|
+
React13.useEffect(() => {
|
|
4955
6398
|
if (typeof window === "undefined") return;
|
|
4956
6399
|
let root = document.getElementById("volr-modal-root");
|
|
4957
6400
|
if (!root) {
|
|
@@ -4966,7 +6409,7 @@ function DepositModalPortal() {
|
|
|
4966
6409
|
}
|
|
4967
6410
|
};
|
|
4968
6411
|
}, []);
|
|
4969
|
-
|
|
6412
|
+
React13.useEffect(() => {
|
|
4970
6413
|
if (isOpen && mode === "deposit" && !user) {
|
|
4971
6414
|
setShowLogin(true);
|
|
4972
6415
|
} else {
|
|
@@ -5000,8 +6443,8 @@ function DepositModalPortal() {
|
|
|
5000
6443
|
}
|
|
5001
6444
|
function PaymentModalPortal() {
|
|
5002
6445
|
const { isOpen, mode, close } = useVolrModal();
|
|
5003
|
-
const [portalRoot, setPortalRoot] =
|
|
5004
|
-
|
|
6446
|
+
const [portalRoot, setPortalRoot] = React13.useState(null);
|
|
6447
|
+
React13.useEffect(() => {
|
|
5005
6448
|
if (typeof window === "undefined") return;
|
|
5006
6449
|
let root = document.getElementById("volr-modal-root");
|
|
5007
6450
|
if (!root) {
|
|
@@ -5030,8 +6473,8 @@ function PaymentModalPortal() {
|
|
|
5030
6473
|
}
|
|
5031
6474
|
function SignRequestModalPortal() {
|
|
5032
6475
|
const { pendingRequest } = useSignRequestInternal();
|
|
5033
|
-
const [portalRoot, setPortalRoot] =
|
|
5034
|
-
|
|
6476
|
+
const [portalRoot, setPortalRoot] = React13.useState(null);
|
|
6477
|
+
React13.useEffect(() => {
|
|
5035
6478
|
if (typeof window === "undefined") return;
|
|
5036
6479
|
let root = document.getElementById("volr-modal-root");
|
|
5037
6480
|
if (!root) {
|
|
@@ -5062,8 +6505,8 @@ function SignRequestModalPortal() {
|
|
|
5062
6505
|
function OAuthCallbackHandler({
|
|
5063
6506
|
onShowOnboarding
|
|
5064
6507
|
}) {
|
|
5065
|
-
const [hasCode, setHasCode] =
|
|
5066
|
-
|
|
6508
|
+
const [hasCode, setHasCode] = React13.useState(false);
|
|
6509
|
+
React13.useEffect(() => {
|
|
5067
6510
|
if (typeof window === "undefined") return;
|
|
5068
6511
|
const params = new URLSearchParams(window.location.search);
|
|
5069
6512
|
const code = params.get("code");
|
|
@@ -5106,13 +6549,13 @@ function OnboardingChecker({
|
|
|
5106
6549
|
}) {
|
|
5107
6550
|
const { user, provider, isLoading } = react.useVolrContext();
|
|
5108
6551
|
const { isOpen: isModalOpen } = useVolrModal();
|
|
5109
|
-
const modalWasOpened =
|
|
5110
|
-
|
|
6552
|
+
const modalWasOpened = React13__default.default.useRef(false);
|
|
6553
|
+
React13.useEffect(() => {
|
|
5111
6554
|
if (isModalOpen) {
|
|
5112
6555
|
modalWasOpened.current = true;
|
|
5113
6556
|
}
|
|
5114
6557
|
}, [isModalOpen]);
|
|
5115
|
-
|
|
6558
|
+
React13.useEffect(() => {
|
|
5116
6559
|
if (isLoading) {
|
|
5117
6560
|
return;
|
|
5118
6561
|
}
|
|
@@ -5155,7 +6598,7 @@ function OnboardingChecker({
|
|
|
5155
6598
|
}
|
|
5156
6599
|
function useSwitchNetwork() {
|
|
5157
6600
|
const { client } = react.useInternalAuth();
|
|
5158
|
-
return
|
|
6601
|
+
return React13.useCallback(
|
|
5159
6602
|
async (chainId) => {
|
|
5160
6603
|
if (typeof window === "undefined" || !window.ethereum) {
|
|
5161
6604
|
throw new Error("No wallet found");
|
|
@@ -5219,8 +6662,8 @@ var paymentPromiseResolver = null;
|
|
|
5219
6662
|
function useVolrPay() {
|
|
5220
6663
|
const { open: openModal, close: closeModal } = useVolrModal();
|
|
5221
6664
|
const { checkPayment, getPaymentHistory } = react.useVolrPaymentApi();
|
|
5222
|
-
const isInProgressRef =
|
|
5223
|
-
const pay =
|
|
6665
|
+
const isInProgressRef = React13.useRef(false);
|
|
6666
|
+
const pay = React13.useCallback(
|
|
5224
6667
|
(options) => {
|
|
5225
6668
|
isInProgressRef.current = true;
|
|
5226
6669
|
const waitPromise = new Promise((resolve, reject) => {
|