@tonconnect/ui 2.1.0 → 2.2.0-beta.0
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/README.md +61 -3
- package/dist/tonconnect-ui.min.js +312 -217
- package/dist/tonconnect-ui.min.js.map +1 -1
- package/lib/index.cjs +997 -223
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.ts +43 -4
- package/lib/index.mjs +998 -224
- package/lib/index.mjs.map +1 -1
- package/package.json +2 -2
package/lib/index.cjs
CHANGED
|
@@ -2054,6 +2054,12 @@ const notifications$1 = {
|
|
|
2054
2054
|
transactionCanceled: {
|
|
2055
2055
|
header: "Transaction canceled",
|
|
2056
2056
|
text: "There will be no changes to\xA0your account."
|
|
2057
|
+
},
|
|
2058
|
+
dataSigned: {
|
|
2059
|
+
header: "Data signed"
|
|
2060
|
+
},
|
|
2061
|
+
signDataCanceled: {
|
|
2062
|
+
header: "Sign data canceled"
|
|
2057
2063
|
}
|
|
2058
2064
|
};
|
|
2059
2065
|
const walletItem$1 = {
|
|
@@ -2111,9 +2117,41 @@ const walletModal$1 = {
|
|
|
2111
2117
|
easilySend: "Easily send, receive, monitor your cryptocurrencies.\xA0Streamline your operations with\xA0decentralized applications.",
|
|
2112
2118
|
getAWallet: "Get a Wallet"
|
|
2113
2119
|
},
|
|
2120
|
+
restoreModal: {
|
|
2121
|
+
title: "Restore",
|
|
2122
|
+
step1: {
|
|
2123
|
+
title: "Find your current recovery phrase",
|
|
2124
|
+
text: "Open your wallet settings and locate the\xA0recovery\xA0phrase"
|
|
2125
|
+
},
|
|
2126
|
+
step2: {
|
|
2127
|
+
title: "Copy your recovery phrase",
|
|
2128
|
+
text: "Write it down or copy it to a safe place"
|
|
2129
|
+
},
|
|
2130
|
+
step3: {
|
|
2131
|
+
title: "Restore in a supported wallet",
|
|
2132
|
+
text: "Enter the recovery phrase to access your wallet"
|
|
2133
|
+
}
|
|
2134
|
+
},
|
|
2114
2135
|
allWallets: {
|
|
2115
2136
|
walletsBelowNotSupported: "The wallets below don\u2019t support all features of\xA0the connected service. You can use your recovery phrase in one of the supported wallets above.",
|
|
2116
2137
|
walletNotSupportService: "{{ name }} doesn\u2019t support connected service"
|
|
2138
|
+
},
|
|
2139
|
+
featureNotSupported: {
|
|
2140
|
+
wallet: {
|
|
2141
|
+
title: "{{ name }} doesn\u2019t support the requested\xA0action",
|
|
2142
|
+
description: "Install a supported wallet from the list below, restore it with your recovery phrase, then connect it and try again.",
|
|
2143
|
+
info: "Learn how to restore your wallet"
|
|
2144
|
+
},
|
|
2145
|
+
version: {
|
|
2146
|
+
description: "Your current version of {{ name }} or wallet contract type doesn't support the required features. Please update it to continue.",
|
|
2147
|
+
updateButton: "Update {{ name }}",
|
|
2148
|
+
aboutW5: "About W5"
|
|
2149
|
+
},
|
|
2150
|
+
disconnect: {
|
|
2151
|
+
title: "Confirm Disconnect",
|
|
2152
|
+
description: "You will be disconnected from your current wallet and redirected to connect {{ name }}.",
|
|
2153
|
+
button: "Disconnect"
|
|
2154
|
+
}
|
|
2117
2155
|
}
|
|
2118
2156
|
};
|
|
2119
2157
|
const actionModal$1 = {
|
|
@@ -2121,8 +2159,14 @@ const actionModal$1 = {
|
|
|
2121
2159
|
header: "Confirm the\xA0transaction in\xA0{{ name }}",
|
|
2122
2160
|
text: "It will only take a\xA0moment."
|
|
2123
2161
|
},
|
|
2162
|
+
signData: {
|
|
2163
|
+
header: "Sign the\xA0data in\xA0{{ name }}",
|
|
2164
|
+
text: "It will only take a\xA0moment."
|
|
2165
|
+
},
|
|
2124
2166
|
transactionSent: "$notifications.transactionSent",
|
|
2125
|
-
transactionCanceled: "$notifications.transactionCanceled"
|
|
2167
|
+
transactionCanceled: "$notifications.transactionCanceled",
|
|
2168
|
+
dataSigned: "$notifications.dataSigned",
|
|
2169
|
+
signDataCanceled: "$notifications.signDataCanceled"
|
|
2126
2170
|
};
|
|
2127
2171
|
const en = {
|
|
2128
2172
|
common: common$1,
|
|
@@ -2164,6 +2208,12 @@ const notifications = {
|
|
|
2164
2208
|
transactionCanceled: {
|
|
2165
2209
|
header: "\u0422\u0440\u0430\u043D\u0437\u0430\u043A\u0446\u0438\u044F \u043E\u0442\u043C\u0435\u043D\u0435\u043D\u0430",
|
|
2166
2210
|
text: "\u0421\u043E\u0441\u0442\u043E\u044F\u043D\u0438\u0435 \u0432\u0430\u0448\u0435\u0433\u043E \u0441\u0447\u0451\u0442\u0430 \u043D\u0435\xA0\u0438\u0437\u043C\u0435\u043D\u0438\u0442\u0441\u044F."
|
|
2211
|
+
},
|
|
2212
|
+
dataSigned: {
|
|
2213
|
+
header: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043F\u043E\u0434\u043F\u0438\u0441\u0430\u043D\u044B"
|
|
2214
|
+
},
|
|
2215
|
+
signDataCanceled: {
|
|
2216
|
+
header: "\u041F\u043E\u0434\u043F\u0438\u0441\u044C \u0434\u0430\u043D\u043D\u044B\u0445 \u043E\u0442\u043C\u0435\u043D\u0435\u043D\u0430"
|
|
2167
2217
|
}
|
|
2168
2218
|
};
|
|
2169
2219
|
const walletItem = {
|
|
@@ -2221,9 +2271,41 @@ const walletModal = {
|
|
|
2221
2271
|
easilySend: "\u041B\u0435\u0433\u043A\u043E \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u044F\u0439\u0442\u0435, \u043F\u043E\u043B\u0443\u0447\u0430\u0439\u0442\u0435 \u0438\xA0\u043E\u0442\u0441\u043B\u0435\u0436\u0438\u0432\u0430\u0439\u0442\u0435 \u0441\u0432\u043E\u0438 \u043A\u0440\u0438\u043F\u0442\u043E\u0432\u0430\u043B\u044E\u0442\u044B. \u041E\u043F\u0442\u0438\u043C\u0438\u0437\u0438\u0440\u0443\u0439\u0442\u0435 \u0441\u0432\u043E\u0438 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0441\xA0\u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0434\u0435\u0446\u0435\u043D\u0442\u0440\u0430\u043B\u0438\u0437\u043E\u0432\u0430\u043D\u043D\u044B\u0445 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0439.",
|
|
2222
2272
|
getAWallet: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u043A\u043E\u0448\u0435\u043B\u0451\u043A"
|
|
2223
2273
|
},
|
|
2274
|
+
restoreModal: {
|
|
2275
|
+
title: "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u0435",
|
|
2276
|
+
step1: {
|
|
2277
|
+
title: "\u041D\u0430\u0439\u0434\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u0442\u0435\u043A\u0443\u0449\u0443\u044E \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F",
|
|
2278
|
+
text: "\u041E\u0442\u043A\u0440\u043E\u0439\u0442\u0435 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0438 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u0438 \u043D\u0430\u0439\u0434\u0438\u0442\u0435 \u0444\u0440\u0430\u0437\u0443\xA0\u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F"
|
|
2279
|
+
},
|
|
2280
|
+
step2: {
|
|
2281
|
+
title: "\u0421\u043A\u043E\u043F\u0438\u0440\u0443\u0439\u0442\u0435 \u0432\u0430\u0448\u0443 \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F",
|
|
2282
|
+
text: "\u0417\u0430\u043F\u0438\u0448\u0438\u0442\u0435 \u0435\u0451 \u0438\u043B\u0438 \u0441\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u0435 \u0432 \u0431\u0435\u0437\u043E\u043F\u0430\u0441\u043D\u043E\u043C \u043C\u0435\u0441\u0442\u0435"
|
|
2283
|
+
},
|
|
2284
|
+
step3: {
|
|
2285
|
+
title: "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u0435 \u0432 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043C\u043E\u043C \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0435",
|
|
2286
|
+
text: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u0434\u043B\u044F \u0434\u043E\u0441\u0442\u0443\u043F\u0430\xA0\u043A\xA0\u0432\u0430\u0448\u0435\u043C\u0443\xA0\u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0443"
|
|
2287
|
+
}
|
|
2288
|
+
},
|
|
2224
2289
|
allWallets: {
|
|
2225
2290
|
walletsBelowNotSupported: "\u041A\u043E\u0448\u0435\u043B\u044C\u043A\u0438 \u043D\u0438\u0436\u0435 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044E\u0442 \u0432\u0441\u0435 \u0444\u0443\u043D\u043A\u0446\u0438\u0438 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0451\u043D\u043D\u043E\u0433\u043E \u0441\u0435\u0440\u0432\u0438\u0441\u0430. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u0441\u0432\u043E\u044E \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u0432 \u043E\u0434\u043D\u043E\u043C \u0438\u0437 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043C\u044B\u0445 \u0432\u044B\u0448\u0435 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u043E\u0432.",
|
|
2226
2291
|
walletNotSupportService: "{{ name }} \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0451\u043D\u043D\u044B\u0439 \u0441\u0435\u0440\u0432\u0438\u0441"
|
|
2292
|
+
},
|
|
2293
|
+
featureNotSupported: {
|
|
2294
|
+
wallet: {
|
|
2295
|
+
title: "{{ name }} \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0437\u0430\u043F\u0440\u043E\u0448\u0435\u043D\u043D\u043E\u0435\xA0\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435",
|
|
2296
|
+
description: "\u0423\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043C\u044B\u0439 \u043A\u043E\u0448\u0435\u043B\u0451\u043A \u0438\u0437 \u0441\u043F\u0438\u0441\u043A\u0430 \u043D\u0438\u0436\u0435, \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u0435 \u0435\u0433\u043E \u0441 \u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0444\u0440\u0430\u0437\u044B \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F, \u0437\u0430\u0442\u0435\u043C \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0438\u0442\u0435\u0441\u044C \u0438 \u043F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u0441\u043D\u043E\u0432\u0430.",
|
|
2297
|
+
info: "\u0423\u0437\u043D\u0430\u0442\u044C, \u043A\u0430\u043A \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C \u043A\u043E\u0448\u0435\u043B\u0451\u043A"
|
|
2298
|
+
},
|
|
2299
|
+
version: {
|
|
2300
|
+
description: "\u0422\u0435\u043A\u0443\u0449\u0430\u044F \u0432\u0435\u0440\u0441\u0438\u044F {{ name }} \u0438\u043B\u0438 \u0442\u0438\u043F \u043A\u043E\u043D\u0442\u0440\u0430\u043A\u0442\u0430 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u044B\u0435 \u0444\u0443\u043D\u043A\u0446\u0438\u0438. \u041E\u0431\u043D\u043E\u0432\u0438\u0442\u0435 \u043A\u043E\u0448\u0435\u043B\u0451\u043A, \u0447\u0442\u043E\u0431\u044B \u043F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C.",
|
|
2301
|
+
updateButton: "\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C {{ name }}",
|
|
2302
|
+
aboutW5: "\u041F\u0440\u043E W5"
|
|
2303
|
+
},
|
|
2304
|
+
disconnect: {
|
|
2305
|
+
title: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u0435 \u043E\u0442\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435",
|
|
2306
|
+
description: "\u0412\u044B \u0431\u0443\u0434\u0435\u0442\u0435 \u043E\u0442\u043A\u043B\u044E\u0447\u0435\u043D\u044B \u043E\u0442 \u0442\u0435\u043A\u0443\u0449\u0435\u0433\u043E \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u0438 \u043F\u0435\u0440\u0435\u043D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u044B \u043D\u0430 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435 {{ name }}.",
|
|
2307
|
+
button: "\u041E\u0442\u043A\u043B\u044E\u0447\u0438\u0442\u044C\u0441\u044F"
|
|
2308
|
+
}
|
|
2227
2309
|
}
|
|
2228
2310
|
};
|
|
2229
2311
|
const actionModal = {
|
|
@@ -2231,8 +2313,14 @@ const actionModal = {
|
|
|
2231
2313
|
header: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0432\xA0{{ name }}",
|
|
2232
2314
|
text: "\u042D\u0442\u043E \u0437\u0430\u0439\u043C\u0435\u0442 \u043F\u0430\u0440\u0443 \u0441\u0435\u043A\u0443\u043D\u0434."
|
|
2233
2315
|
},
|
|
2316
|
+
signData: {
|
|
2317
|
+
header: "\u041F\u043E\u0434\u043F\u0438\u0448\u0438\u0442\u0435 \u0434\u0430\u043D\u043D\u044B\u0435 \u0432\xA0{{ name }}",
|
|
2318
|
+
text: "\u042D\u0442\u043E \u0437\u0430\u0439\u043C\u0435\u0442 \u043F\u0430\u0440\u0443 \u0441\u0435\u043A\u0443\u043D\u0434."
|
|
2319
|
+
},
|
|
2234
2320
|
transactionSent: "$notifications.transactionSent",
|
|
2235
|
-
transactionCanceled: "$notifications.transactionCanceled"
|
|
2321
|
+
transactionCanceled: "$notifications.transactionCanceled",
|
|
2322
|
+
dataSigned: "$notifications.dataSigned",
|
|
2323
|
+
signDataCanceled: "$notifications.signDataCanceled"
|
|
2236
2324
|
};
|
|
2237
2325
|
const ru = {
|
|
2238
2326
|
common,
|
|
@@ -2892,7 +2980,7 @@ function media(device) {
|
|
|
2892
2980
|
}
|
|
2893
2981
|
const mediaTouch = "@media (hover: none)";
|
|
2894
2982
|
const mediaNotTouch = "@media not all and (hover: none)";
|
|
2895
|
-
const borders$
|
|
2983
|
+
const borders$6 = {
|
|
2896
2984
|
m: "100vh",
|
|
2897
2985
|
s: "8px",
|
|
2898
2986
|
none: "0"
|
|
@@ -2913,7 +3001,7 @@ const ButtonStyled$1 = styled.button`
|
|
|
2913
3001
|
padding-left: ${(props) => props.leftIcon && props.appearance !== "flat" ? "12px" : "16px"};
|
|
2914
3002
|
padding-right: ${(props) => props.rightIcon && props.appearance !== "flat" ? "12px" : "16px"};
|
|
2915
3003
|
border: none;
|
|
2916
|
-
border-radius: ${(props) => borders$
|
|
3004
|
+
border-radius: ${(props) => borders$6[props.theme.borderRadius]};
|
|
2917
3005
|
cursor: ${(props) => props.disabled ? "not-allowed" : "pointer"};
|
|
2918
3006
|
|
|
2919
3007
|
font-size: 14px;
|
|
@@ -3477,7 +3565,7 @@ const IconButton = (props) => {
|
|
|
3477
3565
|
}
|
|
3478
3566
|
}));
|
|
3479
3567
|
};
|
|
3480
|
-
const borders$
|
|
3568
|
+
const borders$5 = {
|
|
3481
3569
|
m: "24px",
|
|
3482
3570
|
s: "16px",
|
|
3483
3571
|
none: "0"
|
|
@@ -3518,7 +3606,7 @@ const ModalBodyStyled = styled.div`
|
|
|
3518
3606
|
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
|
|
3519
3607
|
|
|
3520
3608
|
background-color: ${(props) => props.theme.colors.background.primary};
|
|
3521
|
-
border-radius: ${(props) => borders$
|
|
3609
|
+
border-radius: ${(props) => borders$5[props.theme.borderRadius]};
|
|
3522
3610
|
|
|
3523
3611
|
${media("mobile")} {
|
|
3524
3612
|
width: 100%;
|
|
@@ -3534,8 +3622,8 @@ const ModalFooterStyled = styled.div`
|
|
|
3534
3622
|
justify-content: space-between;
|
|
3535
3623
|
align-items: center;
|
|
3536
3624
|
padding: 16px 16px 16px 18px;
|
|
3537
|
-
border-radius: 0 0 ${(props) => borders$
|
|
3538
|
-
${(props) => borders$
|
|
3625
|
+
border-radius: 0 0 ${(props) => borders$5[props.theme.borderRadius]}
|
|
3626
|
+
${(props) => borders$5[props.theme.borderRadius]};
|
|
3539
3627
|
`;
|
|
3540
3628
|
const QuestionButtonStyled = styled(IconButton)`
|
|
3541
3629
|
background-color: ${(props) => rgba(props.theme.colors.icon.secondary, 0.12)};
|
|
@@ -3689,7 +3777,7 @@ const Modal = (props) => {
|
|
|
3689
3777
|
}), null);
|
|
3690
3778
|
insert(_el$, createComponent(Show, {
|
|
3691
3779
|
get when() {
|
|
3692
|
-
return props.onClickQuestion;
|
|
3780
|
+
return props.onClickQuestion && props.showFooter;
|
|
3693
3781
|
},
|
|
3694
3782
|
get children() {
|
|
3695
3783
|
return createComponent(ModalFooterStyled, {
|
|
@@ -3705,12 +3793,12 @@ const Modal = (props) => {
|
|
|
3705
3793
|
}
|
|
3706
3794
|
}), null);
|
|
3707
3795
|
createRenderEffect(() => className(_el$, cn__default.default(ModalWrapperClass, u`
|
|
3708
|
-
border-radius: ${borders$
|
|
3796
|
+
border-radius: ${borders$5[theme.borderRadius]};
|
|
3709
3797
|
background-color: ${theme.colors.background.tint};
|
|
3710
3798
|
|
|
3711
3799
|
${media("mobile")} {
|
|
3712
|
-
border-radius: ${borders$
|
|
3713
|
-
${borders$
|
|
3800
|
+
border-radius: ${borders$5[theme.borderRadius]}
|
|
3801
|
+
${borders$5[theme.borderRadius]} 0 0;
|
|
3714
3802
|
}
|
|
3715
3803
|
`)));
|
|
3716
3804
|
return _el$;
|
|
@@ -5784,7 +5872,7 @@ var createI18nContext = (init = {}, lang = navigator.language in init ? navigato
|
|
|
5784
5872
|
};
|
|
5785
5873
|
var I18nContext = createContext({});
|
|
5786
5874
|
var useI18n = () => useContext(I18nContext);
|
|
5787
|
-
const TextStyled$
|
|
5875
|
+
const TextStyled$4 = styled.div`
|
|
5788
5876
|
font-style: normal;
|
|
5789
5877
|
font-weight: ${(props) => props.fontWeight};
|
|
5790
5878
|
font-size: ${(props) => props.fontSize};
|
|
@@ -5813,7 +5901,7 @@ const Text = (inputs) => {
|
|
|
5813
5901
|
textRef.style.cursor = "default";
|
|
5814
5902
|
}
|
|
5815
5903
|
});
|
|
5816
|
-
return createComponent(TextStyled$
|
|
5904
|
+
return createComponent(TextStyled$4, {
|
|
5817
5905
|
get fontSize() {
|
|
5818
5906
|
return props.fontSize;
|
|
5819
5907
|
},
|
|
@@ -5874,7 +5962,7 @@ const WalletImage = (props) => {
|
|
|
5874
5962
|
}
|
|
5875
5963
|
});
|
|
5876
5964
|
};
|
|
5877
|
-
const borders$
|
|
5965
|
+
const borders$4 = {
|
|
5878
5966
|
m: "16px",
|
|
5879
5967
|
s: "12px",
|
|
5880
5968
|
none: "0"
|
|
@@ -5944,7 +6032,7 @@ const WalletItemStyled = styled.button`
|
|
|
5944
6032
|
const ImageStyled$1 = styled(WalletImage)`
|
|
5945
6033
|
width: 60px;
|
|
5946
6034
|
height: 60px;
|
|
5947
|
-
border-radius: ${(props) => borders$
|
|
6035
|
+
border-radius: ${(props) => borders$4[props.theme.borderRadius]};
|
|
5948
6036
|
margin-bottom: 8px;
|
|
5949
6037
|
position: relative;
|
|
5950
6038
|
`;
|
|
@@ -6042,7 +6130,7 @@ const WalletItem = (props) => {
|
|
|
6042
6130
|
}
|
|
6043
6131
|
});
|
|
6044
6132
|
};
|
|
6045
|
-
const H1Styled$
|
|
6133
|
+
const H1Styled$b = styled.h1`
|
|
6046
6134
|
font-style: normal;
|
|
6047
6135
|
font-weight: 590;
|
|
6048
6136
|
font-size: 20px;
|
|
@@ -6059,7 +6147,7 @@ const H1Styled$9 = styled.h1`
|
|
|
6059
6147
|
`;
|
|
6060
6148
|
const H1 = (props) => {
|
|
6061
6149
|
const [t2] = useI18n();
|
|
6062
|
-
return createComponent(H1Styled$
|
|
6150
|
+
return createComponent(H1Styled$b, {
|
|
6063
6151
|
get ["class"]() {
|
|
6064
6152
|
return props.class;
|
|
6065
6153
|
},
|
|
@@ -6098,7 +6186,7 @@ const H2 = (props) => {
|
|
|
6098
6186
|
}
|
|
6099
6187
|
});
|
|
6100
6188
|
};
|
|
6101
|
-
const H3Styled$
|
|
6189
|
+
const H3Styled$2 = styled.h3`
|
|
6102
6190
|
font-style: normal;
|
|
6103
6191
|
font-weight: 510;
|
|
6104
6192
|
font-size: 16px;
|
|
@@ -6113,7 +6201,7 @@ const H3Styled$1 = styled.h3`
|
|
|
6113
6201
|
`;
|
|
6114
6202
|
const H3 = (props) => {
|
|
6115
6203
|
const [t2] = useI18n();
|
|
6116
|
-
return createComponent(H3Styled$
|
|
6204
|
+
return createComponent(H3Styled$2, {
|
|
6117
6205
|
"data-tc-h3": "true",
|
|
6118
6206
|
get ["class"]() {
|
|
6119
6207
|
return props.class;
|
|
@@ -6847,7 +6935,7 @@ const AccountButtonDropdown = (props) => {
|
|
|
6847
6935
|
}
|
|
6848
6936
|
});
|
|
6849
6937
|
};
|
|
6850
|
-
const borders$
|
|
6938
|
+
const borders$3 = {
|
|
6851
6939
|
m: "16px",
|
|
6852
6940
|
s: "8px",
|
|
6853
6941
|
none: "0"
|
|
@@ -6860,7 +6948,7 @@ const NotificationStyled = styled.div`
|
|
|
6860
6948
|
|
|
6861
6949
|
background-color: ${(props) => props.theme.colors.background.primary};
|
|
6862
6950
|
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.16);
|
|
6863
|
-
border-radius: ${(props) => borders$
|
|
6951
|
+
border-radius: ${(props) => borders$3[props.theme.borderRadius]};
|
|
6864
6952
|
`;
|
|
6865
6953
|
const NotificationContentStyled = styled.div`
|
|
6866
6954
|
width: 192px;
|
|
@@ -6869,7 +6957,7 @@ const NotificationContentStyled = styled.div`
|
|
|
6869
6957
|
font-size: 15px;
|
|
6870
6958
|
}
|
|
6871
6959
|
`;
|
|
6872
|
-
const TextStyled$
|
|
6960
|
+
const TextStyled$3 = styled(Text)`
|
|
6873
6961
|
margin-top: 4px;
|
|
6874
6962
|
color: ${(props) => props.theme.colors.text.secondary};
|
|
6875
6963
|
`;
|
|
@@ -6899,7 +6987,7 @@ const Notification = (props) => {
|
|
|
6899
6987
|
return props.text;
|
|
6900
6988
|
},
|
|
6901
6989
|
get children() {
|
|
6902
|
-
return createComponent(TextStyled$
|
|
6990
|
+
return createComponent(TextStyled$3, {
|
|
6903
6991
|
get translationKey() {
|
|
6904
6992
|
return props.text.translationKey;
|
|
6905
6993
|
},
|
|
@@ -6940,7 +7028,7 @@ const ConfirmOperationNotification = (props) => {
|
|
|
6940
7028
|
children: "Confirm operation in your wallet"
|
|
6941
7029
|
});
|
|
6942
7030
|
};
|
|
6943
|
-
const ErrorIconStyled$
|
|
7031
|
+
const ErrorIconStyled$4 = styled(ErrorIcon)`
|
|
6944
7032
|
margin-top: 2px;
|
|
6945
7033
|
`;
|
|
6946
7034
|
const ErrorTransactionNotification = (props) => {
|
|
@@ -6952,7 +7040,7 @@ const ErrorTransactionNotification = (props) => {
|
|
|
6952
7040
|
translationKey: "notifications.transactionCanceled.text"
|
|
6953
7041
|
},
|
|
6954
7042
|
get icon() {
|
|
6955
|
-
return createComponent(ErrorIconStyled$
|
|
7043
|
+
return createComponent(ErrorIconStyled$4, {
|
|
6956
7044
|
size: "xs"
|
|
6957
7045
|
});
|
|
6958
7046
|
},
|
|
@@ -6998,19 +7086,26 @@ function useOpenedNotifications(config) {
|
|
|
6998
7086
|
const [timeoutIds, setTimeoutIds] = createSignal([]);
|
|
6999
7087
|
createEffect(
|
|
7000
7088
|
on(action, (action2) => {
|
|
7001
|
-
var _a2;
|
|
7089
|
+
var _a2, _b2;
|
|
7002
7090
|
if (!action2 || !action2.showNotification) {
|
|
7091
|
+
setOpenedNotifications(
|
|
7092
|
+
(openedNotifications2) => openedNotifications2.filter((n2) => n2.action !== "confirm-transaction")
|
|
7093
|
+
);
|
|
7003
7094
|
return;
|
|
7004
7095
|
}
|
|
7005
7096
|
if (latestAction() === action2) {
|
|
7006
7097
|
return;
|
|
7007
7098
|
}
|
|
7008
|
-
|
|
7099
|
+
const isConfirmTransactionAction = ((_a2 = latestAction()) == null ? void 0 : _a2.name) === "confirm-transaction" && action2.name === "confirm-transaction";
|
|
7100
|
+
const isConfirmSignDataAction = ((_b2 = latestAction()) == null ? void 0 : _b2.name) === "confirm-sign-data" && action2.name === "confirm-sign-data";
|
|
7101
|
+
if (isConfirmTransactionAction || isConfirmSignDataAction) {
|
|
7009
7102
|
return;
|
|
7010
7103
|
}
|
|
7011
7104
|
setLatestAction(action2);
|
|
7012
7105
|
setOpenedNotifications(
|
|
7013
|
-
(openedNotifications2) => openedNotifications2.filter(
|
|
7106
|
+
(openedNotifications2) => openedNotifications2.filter(
|
|
7107
|
+
(n2) => n2.action !== "confirm-transaction" && n2.action !== "confirm-sign-data"
|
|
7108
|
+
)
|
|
7014
7109
|
);
|
|
7015
7110
|
const notification = { action: action2.name };
|
|
7016
7111
|
setOpenedNotifications((openedNotifications2) => [...openedNotifications2, notification]);
|
|
@@ -7028,6 +7123,41 @@ function useOpenedNotifications(config) {
|
|
|
7028
7123
|
});
|
|
7029
7124
|
return openedNotifications;
|
|
7030
7125
|
}
|
|
7126
|
+
const ErrorIconStyled$3 = styled(ErrorIcon)`
|
|
7127
|
+
margin-top: 2px;
|
|
7128
|
+
`;
|
|
7129
|
+
const ErrorSignDataNotification = (props) => {
|
|
7130
|
+
return createComponent(Notification, {
|
|
7131
|
+
header: {
|
|
7132
|
+
translationKey: "notifications.signDataCanceled.header"
|
|
7133
|
+
},
|
|
7134
|
+
get icon() {
|
|
7135
|
+
return createComponent(ErrorIconStyled$3, {
|
|
7136
|
+
size: "xs"
|
|
7137
|
+
});
|
|
7138
|
+
},
|
|
7139
|
+
get ["class"]() {
|
|
7140
|
+
return props.class;
|
|
7141
|
+
},
|
|
7142
|
+
"data-tc-notification-sign-data-cancelled": "true",
|
|
7143
|
+
children: "Sign data canceled"
|
|
7144
|
+
});
|
|
7145
|
+
};
|
|
7146
|
+
const SuccessSignDataNotification = (props) => {
|
|
7147
|
+
return createComponent(Notification, {
|
|
7148
|
+
header: {
|
|
7149
|
+
translationKey: "notifications.dataSigned.header"
|
|
7150
|
+
},
|
|
7151
|
+
get icon() {
|
|
7152
|
+
return createComponent(SuccessIconStyled, {});
|
|
7153
|
+
},
|
|
7154
|
+
get ["class"]() {
|
|
7155
|
+
return props.class;
|
|
7156
|
+
},
|
|
7157
|
+
"data-tc-notification-data-signed": "true",
|
|
7158
|
+
children: "Data signed"
|
|
7159
|
+
});
|
|
7160
|
+
};
|
|
7031
7161
|
const _tmpl$$5 = /* @__PURE__ */ template$1(`<div data-tc-list-notifications="true"></div>`);
|
|
7032
7162
|
const Notifications = (props) => {
|
|
7033
7163
|
const openedNotifications = useOpenedNotifications();
|
|
@@ -7084,7 +7214,25 @@ const Notifications = (props) => {
|
|
|
7084
7214
|
}
|
|
7085
7215
|
}), createComponent(Match, {
|
|
7086
7216
|
get when() {
|
|
7087
|
-
return openedNotification.action === "
|
|
7217
|
+
return openedNotification.action === "data-signed";
|
|
7218
|
+
},
|
|
7219
|
+
get children() {
|
|
7220
|
+
return createComponent(SuccessSignDataNotification, {
|
|
7221
|
+
"class": NotificationClass
|
|
7222
|
+
});
|
|
7223
|
+
}
|
|
7224
|
+
}), createComponent(Match, {
|
|
7225
|
+
get when() {
|
|
7226
|
+
return openedNotification.action === "sign-data-canceled";
|
|
7227
|
+
},
|
|
7228
|
+
get children() {
|
|
7229
|
+
return createComponent(ErrorSignDataNotification, {
|
|
7230
|
+
"class": NotificationClass
|
|
7231
|
+
});
|
|
7232
|
+
}
|
|
7233
|
+
}), createComponent(Match, {
|
|
7234
|
+
get when() {
|
|
7235
|
+
return openedNotification.action === "confirm-transaction" || openedNotification.action === "confirm-sign-data";
|
|
7088
7236
|
},
|
|
7089
7237
|
get children() {
|
|
7090
7238
|
return createComponent(ConfirmOperationNotification, {
|
|
@@ -8103,7 +8251,7 @@ const StyledModal = styled(Modal)`
|
|
|
8103
8251
|
padding-right: 0;
|
|
8104
8252
|
}
|
|
8105
8253
|
`;
|
|
8106
|
-
const H1Styled$
|
|
8254
|
+
const H1Styled$a = styled(H1)`
|
|
8107
8255
|
margin-top: 12px;
|
|
8108
8256
|
|
|
8109
8257
|
${media("mobile")} {
|
|
@@ -8190,7 +8338,7 @@ const DesktopSelectWalletModalStyled = styled.div`
|
|
|
8190
8338
|
flex-direction: column;
|
|
8191
8339
|
align-items: center;
|
|
8192
8340
|
`;
|
|
8193
|
-
const H1Styled$
|
|
8341
|
+
const H1Styled$9 = styled(H1)`
|
|
8194
8342
|
margin-bottom: 18px;
|
|
8195
8343
|
`;
|
|
8196
8344
|
styled.div`
|
|
@@ -8245,7 +8393,7 @@ styled(Button)`
|
|
|
8245
8393
|
margin: 0 auto 1px;
|
|
8246
8394
|
font-size: 15px;
|
|
8247
8395
|
`;
|
|
8248
|
-
const StyledIconButton$
|
|
8396
|
+
const StyledIconButton$5 = styled(IconButton)`
|
|
8249
8397
|
position: absolute;
|
|
8250
8398
|
top: 16px;
|
|
8251
8399
|
left: 16px;
|
|
@@ -8348,7 +8496,7 @@ const AllWalletsListModal = (props) => {
|
|
|
8348
8496
|
timeoutId = setTimeout(() => setErrorSupportOpened(null), 1500);
|
|
8349
8497
|
};
|
|
8350
8498
|
const handleSelectWallet = (wallet) => {
|
|
8351
|
-
if (!wallet.isSupportRequiredFeatures) {
|
|
8499
|
+
if (!wallet.isSupportRequiredFeatures && props.featureCheckMode === "strict") {
|
|
8352
8500
|
onErrorClick(wallet);
|
|
8353
8501
|
return;
|
|
8354
8502
|
}
|
|
@@ -8360,10 +8508,10 @@ const AllWalletsListModal = (props) => {
|
|
|
8360
8508
|
return createComponent(DesktopSelectWalletModalStyled, {
|
|
8361
8509
|
"data-tc-wallets-modal-list": "true",
|
|
8362
8510
|
get children() {
|
|
8363
|
-
return [createComponent(StyledIconButton$
|
|
8511
|
+
return [createComponent(StyledIconButton$5, {
|
|
8364
8512
|
icon: "arrow",
|
|
8365
8513
|
onClick: () => props.onBack()
|
|
8366
|
-
}), createComponent(H1Styled$
|
|
8514
|
+
}), createComponent(H1Styled$9, {
|
|
8367
8515
|
translationKey: "walletModal.wallets",
|
|
8368
8516
|
children: "Wallets"
|
|
8369
8517
|
}), createComponent(ScrollContainer, {
|
|
@@ -8389,7 +8537,7 @@ const AllWalletsListModal = (props) => {
|
|
|
8389
8537
|
}
|
|
8390
8538
|
}), createComponent(Show, {
|
|
8391
8539
|
get when() {
|
|
8392
|
-
return unsupportedWallets().length > 0;
|
|
8540
|
+
return unsupportedWallets().length > 0 && props.featureCheckMode !== "hide";
|
|
8393
8541
|
},
|
|
8394
8542
|
get children() {
|
|
8395
8543
|
return [createComponent(WalletsNotSupportedNotifier, {
|
|
@@ -8412,7 +8560,9 @@ const AllWalletsListModal = (props) => {
|
|
|
8412
8560
|
insert(_el$2, createComponent(WalletLabeledItemStyled, {
|
|
8413
8561
|
wallet,
|
|
8414
8562
|
onClick: () => handleSelectWallet(wallet),
|
|
8415
|
-
withOpacity
|
|
8563
|
+
get withOpacity() {
|
|
8564
|
+
return props.featureCheckMode === "strict";
|
|
8565
|
+
}
|
|
8416
8566
|
}));
|
|
8417
8567
|
return _el$2;
|
|
8418
8568
|
})()
|
|
@@ -8505,7 +8655,7 @@ const BodyStyled$1 = styled.div`
|
|
|
8505
8655
|
const QRCodeStyled$1 = styled(QRCode)`
|
|
8506
8656
|
margin-bottom: 24px;
|
|
8507
8657
|
`;
|
|
8508
|
-
const H1Styled$
|
|
8658
|
+
const H1Styled$8 = styled(H1)`
|
|
8509
8659
|
max-width: 288px;
|
|
8510
8660
|
margin: 0 auto 2px;
|
|
8511
8661
|
`;
|
|
@@ -8514,18 +8664,18 @@ const H2Styled$4 = styled(H2)`
|
|
|
8514
8664
|
text-align: center;
|
|
8515
8665
|
margin: 0 auto 20px;
|
|
8516
8666
|
`;
|
|
8517
|
-
const StyledIconButton$
|
|
8667
|
+
const StyledIconButton$4 = styled(IconButton)`
|
|
8518
8668
|
position: absolute;
|
|
8519
8669
|
top: 16px;
|
|
8520
8670
|
left: 16px;
|
|
8521
8671
|
`;
|
|
8522
|
-
const ButtonsContainerStyled$
|
|
8672
|
+
const ButtonsContainerStyled$2 = styled.div`
|
|
8523
8673
|
display: flex;
|
|
8524
8674
|
justify-content: center;
|
|
8525
8675
|
gap: 8px;
|
|
8526
8676
|
padding-bottom: 16px;
|
|
8527
8677
|
`;
|
|
8528
|
-
const BottomButtonsContainerStyled = styled(ButtonsContainerStyled$
|
|
8678
|
+
const BottomButtonsContainerStyled = styled(ButtonsContainerStyled$2)`
|
|
8529
8679
|
padding-bottom: 0;
|
|
8530
8680
|
`;
|
|
8531
8681
|
const FooterButton$1 = styled(Button)`
|
|
@@ -8535,10 +8685,10 @@ const LoaderStyled$1 = styled(LoaderIcon)`
|
|
|
8535
8685
|
margin-bottom: 18px;
|
|
8536
8686
|
margin-top: 2px;
|
|
8537
8687
|
`;
|
|
8538
|
-
const ErrorIconStyled$
|
|
8688
|
+
const ErrorIconStyled$2 = styled(ErrorIcon)`
|
|
8539
8689
|
margin-bottom: 16px;
|
|
8540
8690
|
`;
|
|
8541
|
-
const BodyTextStyled$
|
|
8691
|
+
const BodyTextStyled$2 = styled(H2)`
|
|
8542
8692
|
color: ${(props) => props.theme.colors.text.secondary};
|
|
8543
8693
|
text-align: center;
|
|
8544
8694
|
margin-bottom: 20px;
|
|
@@ -9008,12 +9158,12 @@ const DesktopConnectionModal = (props) => {
|
|
|
9008
9158
|
return !props.backDisabled;
|
|
9009
9159
|
},
|
|
9010
9160
|
get children() {
|
|
9011
|
-
return createComponent(StyledIconButton$
|
|
9161
|
+
return createComponent(StyledIconButton$4, {
|
|
9012
9162
|
icon: "arrow",
|
|
9013
9163
|
onClick: () => props.onBackClick()
|
|
9014
9164
|
});
|
|
9015
9165
|
}
|
|
9016
|
-
}), createComponent(H1Styled$
|
|
9166
|
+
}), createComponent(H1Styled$8, {
|
|
9017
9167
|
get children() {
|
|
9018
9168
|
return props.wallet.name;
|
|
9019
9169
|
}
|
|
@@ -9046,7 +9196,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9046
9196
|
return connectionErrored();
|
|
9047
9197
|
},
|
|
9048
9198
|
get children() {
|
|
9049
|
-
return [createComponent(ErrorIconStyled$
|
|
9199
|
+
return [createComponent(ErrorIconStyled$2, {
|
|
9050
9200
|
size: "s"
|
|
9051
9201
|
}), createComponent(Switch, {
|
|
9052
9202
|
get children() {
|
|
@@ -9055,7 +9205,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9055
9205
|
return connectionErrored() === "missing-features";
|
|
9056
9206
|
},
|
|
9057
9207
|
get children() {
|
|
9058
|
-
return createComponent(BodyTextStyled$
|
|
9208
|
+
return createComponent(BodyTextStyled$2, {
|
|
9059
9209
|
translationKey: "walletModal.desktopConnectionModal.missingFeatures",
|
|
9060
9210
|
get translationValues() {
|
|
9061
9211
|
return {
|
|
@@ -9070,7 +9220,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9070
9220
|
return connectionErrored() === "connection-declined";
|
|
9071
9221
|
},
|
|
9072
9222
|
get children() {
|
|
9073
|
-
return createComponent(BodyTextStyled$
|
|
9223
|
+
return createComponent(BodyTextStyled$2, {
|
|
9074
9224
|
translationKey: "walletModal.desktopConnectionModal.connectionDeclined",
|
|
9075
9225
|
children: "Connection declined"
|
|
9076
9226
|
});
|
|
@@ -9080,7 +9230,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9080
9230
|
return connectionErrored() === "not-supported";
|
|
9081
9231
|
},
|
|
9082
9232
|
get children() {
|
|
9083
|
-
return createComponent(BodyTextStyled$
|
|
9233
|
+
return createComponent(BodyTextStyled$2, {
|
|
9084
9234
|
translationKey: "walletModal.desktopConnectionModal.notSupportedWallet",
|
|
9085
9235
|
get translationValues() {
|
|
9086
9236
|
return {
|
|
@@ -9094,7 +9244,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9094
9244
|
}
|
|
9095
9245
|
})];
|
|
9096
9246
|
}
|
|
9097
|
-
}), createComponent(ButtonsContainerStyled$
|
|
9247
|
+
}), createComponent(ButtonsContainerStyled$2, {
|
|
9098
9248
|
get children() {
|
|
9099
9249
|
return [createComponent(Show, {
|
|
9100
9250
|
get when() {
|
|
@@ -9194,7 +9344,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9194
9344
|
get children() {
|
|
9195
9345
|
return [createComponent(LoaderStyled$1, {
|
|
9196
9346
|
size: "s"
|
|
9197
|
-
}), createComponent(BodyTextStyled$
|
|
9347
|
+
}), createComponent(BodyTextStyled$2, {
|
|
9198
9348
|
translationKey: "walletModal.desktopConnectionModal.continueInExtension",
|
|
9199
9349
|
get translationValues() {
|
|
9200
9350
|
return {
|
|
@@ -9204,7 +9354,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9204
9354
|
get children() {
|
|
9205
9355
|
return ["Continue in ", createMemo(() => props.wallet.name), " browser extension\u2026"];
|
|
9206
9356
|
}
|
|
9207
|
-
}), createComponent(ButtonsContainerStyled$
|
|
9357
|
+
}), createComponent(ButtonsContainerStyled$2, {
|
|
9208
9358
|
get children() {
|
|
9209
9359
|
return createComponent(Button, {
|
|
9210
9360
|
get leftIcon() {
|
|
@@ -9226,7 +9376,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9226
9376
|
return !sdk.isWalletInfoCurrentlyInjected(props.wallet);
|
|
9227
9377
|
},
|
|
9228
9378
|
get children() {
|
|
9229
|
-
return [createComponent(BodyTextStyled$
|
|
9379
|
+
return [createComponent(BodyTextStyled$2, {
|
|
9230
9380
|
translationKey: "walletModal.desktopConnectionModal.dontHaveExtension",
|
|
9231
9381
|
get translationValues() {
|
|
9232
9382
|
return {
|
|
@@ -9236,7 +9386,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9236
9386
|
get children() {
|
|
9237
9387
|
return ["Seems you don't have installed ", createMemo(() => props.wallet.name), " browser extension"];
|
|
9238
9388
|
}
|
|
9239
|
-
}), createComponent(ButtonsContainerStyled$
|
|
9389
|
+
}), createComponent(ButtonsContainerStyled$2, {
|
|
9240
9390
|
get children() {
|
|
9241
9391
|
return createComponent(Link, {
|
|
9242
9392
|
get href() {
|
|
@@ -9277,7 +9427,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9277
9427
|
get children() {
|
|
9278
9428
|
return [createComponent(LoaderIcon, {
|
|
9279
9429
|
size: "m"
|
|
9280
|
-
}), createComponent(BodyTextStyled$
|
|
9430
|
+
}), createComponent(BodyTextStyled$2, {
|
|
9281
9431
|
translationKey: "walletModal.desktopConnectionModal.continueOnDesktop",
|
|
9282
9432
|
get translationValues() {
|
|
9283
9433
|
return {
|
|
@@ -9287,7 +9437,7 @@ const DesktopConnectionModal = (props) => {
|
|
|
9287
9437
|
get children() {
|
|
9288
9438
|
return ["Continue in ", createMemo(() => props.wallet.name), " on desktop\u2026"];
|
|
9289
9439
|
}
|
|
9290
|
-
}), createComponent(ButtonsContainerStyled$
|
|
9440
|
+
}), createComponent(ButtonsContainerStyled$2, {
|
|
9291
9441
|
get children() {
|
|
9292
9442
|
return [createComponent(Button, {
|
|
9293
9443
|
get leftIcon() {
|
|
@@ -9429,12 +9579,12 @@ const DesktopConnectionModal = (props) => {
|
|
|
9429
9579
|
});
|
|
9430
9580
|
};
|
|
9431
9581
|
const InfoModalStyled = styled.div``;
|
|
9432
|
-
const StyledIconButton$
|
|
9582
|
+
const StyledIconButton$3 = styled(IconButton)`
|
|
9433
9583
|
position: absolute;
|
|
9434
9584
|
top: 16px;
|
|
9435
9585
|
left: 16px;
|
|
9436
9586
|
`;
|
|
9437
|
-
const H1Styled$
|
|
9587
|
+
const H1Styled$7 = styled(H1)`
|
|
9438
9588
|
margin-bottom: 18px;
|
|
9439
9589
|
`;
|
|
9440
9590
|
const InfoBlock = styled.div`
|
|
@@ -9446,11 +9596,11 @@ const InfoBlock = styled.div`
|
|
|
9446
9596
|
const InfoBlockIconClass = u`
|
|
9447
9597
|
margin-bottom: 12px;
|
|
9448
9598
|
`;
|
|
9449
|
-
const H3Styled = styled(H3)`
|
|
9599
|
+
const H3Styled$1 = styled(H3)`
|
|
9450
9600
|
text-align: center;
|
|
9451
9601
|
margin-bottom: 4px;
|
|
9452
9602
|
`;
|
|
9453
|
-
const TextStyled$
|
|
9603
|
+
const TextStyled$2 = styled(Text)`
|
|
9454
9604
|
text-align: center;
|
|
9455
9605
|
max-width: 352px;
|
|
9456
9606
|
color: ${(props) => props.theme.colors.text.secondary};
|
|
@@ -9469,10 +9619,10 @@ const InfoModal = (props) => {
|
|
|
9469
9619
|
return createComponent(InfoModalStyled, {
|
|
9470
9620
|
"data-tc-wallets-modal-info": "true",
|
|
9471
9621
|
get children() {
|
|
9472
|
-
return [createComponent(StyledIconButton$
|
|
9622
|
+
return [createComponent(StyledIconButton$3, {
|
|
9473
9623
|
icon: "arrow",
|
|
9474
9624
|
onClick: () => props.onBackClick()
|
|
9475
|
-
}), createComponent(H1Styled$
|
|
9625
|
+
}), createComponent(H1Styled$7, {
|
|
9476
9626
|
translationKey: "walletModal.infoModal.whatIsAWallet",
|
|
9477
9627
|
children: "What is a wallet"
|
|
9478
9628
|
}), createComponent(ScrollContainer, {
|
|
@@ -9481,10 +9631,10 @@ const InfoModal = (props) => {
|
|
|
9481
9631
|
get children() {
|
|
9482
9632
|
return [createComponent(SecurityIcon, {
|
|
9483
9633
|
"class": InfoBlockIconClass
|
|
9484
|
-
}), createComponent(H3Styled, {
|
|
9634
|
+
}), createComponent(H3Styled$1, {
|
|
9485
9635
|
translationKey: "walletModal.infoModal.secureDigitalAssets",
|
|
9486
9636
|
children: "Secure digital assets storage"
|
|
9487
|
-
}), createComponent(TextStyled$
|
|
9637
|
+
}), createComponent(TextStyled$2, {
|
|
9488
9638
|
translationKey: "walletModal.infoModal.walletProtects",
|
|
9489
9639
|
children: "A wallet protects and manages your digital assets including TON, tokens and collectables."
|
|
9490
9640
|
})];
|
|
@@ -9493,10 +9643,10 @@ const InfoModal = (props) => {
|
|
|
9493
9643
|
get children() {
|
|
9494
9644
|
return [createComponent(PersonalityIcon, {
|
|
9495
9645
|
"class": InfoBlockIconClass
|
|
9496
|
-
}), createComponent(H3Styled, {
|
|
9646
|
+
}), createComponent(H3Styled$1, {
|
|
9497
9647
|
translationKey: "walletModal.infoModal.controlIdentity",
|
|
9498
9648
|
children: "Control your Web3 identity"
|
|
9499
|
-
}), createComponent(TextStyled$
|
|
9649
|
+
}), createComponent(TextStyled$2, {
|
|
9500
9650
|
translationKey: "walletModal.infoModal.manageIdentity",
|
|
9501
9651
|
children: "Manage your digital identity and access decentralized applications with ease. Maintain control over your data and engage securely in the blockchain ecosystem."
|
|
9502
9652
|
})];
|
|
@@ -9505,10 +9655,10 @@ const InfoModal = (props) => {
|
|
|
9505
9655
|
get children() {
|
|
9506
9656
|
return [createComponent(SwapIcon, {
|
|
9507
9657
|
"class": InfoBlockIconClass
|
|
9508
|
-
}), createComponent(H3Styled, {
|
|
9658
|
+
}), createComponent(H3Styled$1, {
|
|
9509
9659
|
translationKey: "walletModal.infoModal.effortlessCryptoTransactions",
|
|
9510
9660
|
children: "Effortless crypto transactions"
|
|
9511
|
-
}), createComponent(TextStyled$
|
|
9661
|
+
}), createComponent(TextStyled$2, {
|
|
9512
9662
|
translationKey: "walletModal.infoModal.easilySend",
|
|
9513
9663
|
children: "Easily send, receive, monitor your cryptocurrencies. Streamline your operations with decentralized applications."
|
|
9514
9664
|
})];
|
|
@@ -9551,11 +9701,11 @@ const BodyStyled = styled.div`
|
|
|
9551
9701
|
justify-content: center;
|
|
9552
9702
|
min-height: 232px;
|
|
9553
9703
|
`;
|
|
9554
|
-
const H1Styled$
|
|
9704
|
+
const H1Styled$6 = styled(H1)`
|
|
9555
9705
|
max-width: 262px;
|
|
9556
9706
|
margin: 0 auto 8px;
|
|
9557
9707
|
`;
|
|
9558
|
-
const StyledIconButton = styled(IconButton)`
|
|
9708
|
+
const StyledIconButton$2 = styled(IconButton)`
|
|
9559
9709
|
position: absolute;
|
|
9560
9710
|
top: 16px;
|
|
9561
9711
|
left: 16px;
|
|
@@ -9579,15 +9729,15 @@ const LoaderStyled = styled(LoaderIcon)`
|
|
|
9579
9729
|
margin-bottom: 18px;
|
|
9580
9730
|
margin-top: 2px;
|
|
9581
9731
|
`;
|
|
9582
|
-
const ErrorIconStyled = styled(ErrorIcon)`
|
|
9732
|
+
const ErrorIconStyled$1 = styled(ErrorIcon)`
|
|
9583
9733
|
margin-bottom: 16px;
|
|
9584
9734
|
`;
|
|
9585
|
-
const BodyTextStyled = styled(H2)`
|
|
9735
|
+
const BodyTextStyled$1 = styled(H2)`
|
|
9586
9736
|
color: ${(props) => props.theme.colors.text.secondary};
|
|
9587
9737
|
text-align: center;
|
|
9588
9738
|
margin-bottom: 20px;
|
|
9589
9739
|
`;
|
|
9590
|
-
const ButtonsContainerStyled = styled.div`
|
|
9740
|
+
const ButtonsContainerStyled$1 = styled.div`
|
|
9591
9741
|
display: flex;
|
|
9592
9742
|
justify-content: center;
|
|
9593
9743
|
gap: 8px;
|
|
@@ -9598,7 +9748,7 @@ const actionButtonBorderRadius$1 = {
|
|
|
9598
9748
|
s: "8px",
|
|
9599
9749
|
none: "0"
|
|
9600
9750
|
};
|
|
9601
|
-
const H1Styled$
|
|
9751
|
+
const H1Styled$5 = styled(H1)`
|
|
9602
9752
|
margin-bottom: 2px;
|
|
9603
9753
|
padding: 0 52px;
|
|
9604
9754
|
`;
|
|
@@ -9628,7 +9778,7 @@ const ActionButton$1 = styled(Button)`
|
|
|
9628
9778
|
padding: 17px 20px 19px 20px;
|
|
9629
9779
|
`;
|
|
9630
9780
|
const MobileConnectionQR = (props) => {
|
|
9631
|
-
return [createComponent(H1Styled$
|
|
9781
|
+
return [createComponent(H1Styled$5, {
|
|
9632
9782
|
get children() {
|
|
9633
9783
|
return props.walletInfo.name;
|
|
9634
9784
|
}
|
|
@@ -9773,7 +9923,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9773
9923
|
return !props.backDisabled || showQR();
|
|
9774
9924
|
},
|
|
9775
9925
|
get children() {
|
|
9776
|
-
return createComponent(StyledIconButton, {
|
|
9926
|
+
return createComponent(StyledIconButton$2, {
|
|
9777
9927
|
icon: "arrow",
|
|
9778
9928
|
onClick: onBack
|
|
9779
9929
|
});
|
|
@@ -9802,7 +9952,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9802
9952
|
return !showQR();
|
|
9803
9953
|
},
|
|
9804
9954
|
get children() {
|
|
9805
|
-
return [createComponent(H1Styled$
|
|
9955
|
+
return [createComponent(H1Styled$6, {
|
|
9806
9956
|
get children() {
|
|
9807
9957
|
return props.wallet.name;
|
|
9808
9958
|
}
|
|
@@ -9813,7 +9963,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9813
9963
|
return connectionErrored();
|
|
9814
9964
|
},
|
|
9815
9965
|
get children() {
|
|
9816
|
-
return [createComponent(ErrorIconStyled, {
|
|
9966
|
+
return [createComponent(ErrorIconStyled$1, {
|
|
9817
9967
|
size: "s"
|
|
9818
9968
|
}), createComponent(Switch, {
|
|
9819
9969
|
get children() {
|
|
@@ -9822,7 +9972,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9822
9972
|
return connectionErrored() === "missing-features";
|
|
9823
9973
|
},
|
|
9824
9974
|
get children() {
|
|
9825
|
-
return createComponent(BodyTextStyled, {
|
|
9975
|
+
return createComponent(BodyTextStyled$1, {
|
|
9826
9976
|
translationKey: "walletModal.mobileConnectionModal.missingFeatures",
|
|
9827
9977
|
get translationValues() {
|
|
9828
9978
|
return {
|
|
@@ -9837,7 +9987,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9837
9987
|
return connectionErrored() === "connection-declined";
|
|
9838
9988
|
},
|
|
9839
9989
|
get children() {
|
|
9840
|
-
return createComponent(BodyTextStyled, {
|
|
9990
|
+
return createComponent(BodyTextStyled$1, {
|
|
9841
9991
|
translationKey: "walletModal.mobileConnectionModal.connectionDeclined",
|
|
9842
9992
|
children: "Connection declined"
|
|
9843
9993
|
});
|
|
@@ -9847,7 +9997,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9847
9997
|
return connectionErrored() === "not-supported";
|
|
9848
9998
|
},
|
|
9849
9999
|
get children() {
|
|
9850
|
-
return createComponent(BodyTextStyled, {
|
|
10000
|
+
return createComponent(BodyTextStyled$1, {
|
|
9851
10001
|
translationKey: "walletModal.mobileConnectionModal.notSupportedWallet",
|
|
9852
10002
|
get translationValues() {
|
|
9853
10003
|
return {
|
|
@@ -9861,7 +10011,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9861
10011
|
}
|
|
9862
10012
|
})];
|
|
9863
10013
|
}
|
|
9864
|
-
}), createComponent(ButtonsContainerStyled, {
|
|
10014
|
+
}), createComponent(ButtonsContainerStyled$1, {
|
|
9865
10015
|
get children() {
|
|
9866
10016
|
return createComponent(Switch, {
|
|
9867
10017
|
get children() {
|
|
@@ -9969,7 +10119,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9969
10119
|
get children() {
|
|
9970
10120
|
return [createComponent(LoaderStyled, {
|
|
9971
10121
|
size: "s"
|
|
9972
|
-
}), createComponent(BodyTextStyled, {
|
|
10122
|
+
}), createComponent(BodyTextStyled$1, {
|
|
9973
10123
|
translationKey: "walletModal.mobileConnectionModal.continueIn",
|
|
9974
10124
|
get translationValues() {
|
|
9975
10125
|
return {
|
|
@@ -9979,7 +10129,7 @@ const MobileConnectionModal = (props) => {
|
|
|
9979
10129
|
get children() {
|
|
9980
10130
|
return ["Continue in ", createMemo(() => props.wallet.name), "\u2026"];
|
|
9981
10131
|
}
|
|
9982
|
-
}), createComponent(ButtonsContainerStyled, {
|
|
10132
|
+
}), createComponent(ButtonsContainerStyled$1, {
|
|
9983
10133
|
get children() {
|
|
9984
10134
|
return [createComponent(Button, {
|
|
9985
10135
|
get leftIcon() {
|
|
@@ -10046,7 +10196,7 @@ const MobileConnectionModal = (props) => {
|
|
|
10046
10196
|
}
|
|
10047
10197
|
});
|
|
10048
10198
|
};
|
|
10049
|
-
const borders$
|
|
10199
|
+
const borders$2 = {
|
|
10050
10200
|
m: "16px",
|
|
10051
10201
|
s: "12px",
|
|
10052
10202
|
none: "0"
|
|
@@ -10086,7 +10236,7 @@ styled.li`
|
|
|
10086
10236
|
}
|
|
10087
10237
|
}
|
|
10088
10238
|
`;
|
|
10089
|
-
const H1Styled$
|
|
10239
|
+
const H1Styled$4 = styled(H1)`
|
|
10090
10240
|
margin-top: 38px;
|
|
10091
10241
|
margin-bottom: 4px;
|
|
10092
10242
|
padding: 0 24px;
|
|
@@ -10115,7 +10265,7 @@ styled(Button)`
|
|
|
10115
10265
|
const TelegramButtonStyled = styled(Button)`
|
|
10116
10266
|
margin: 0 28px 24px;
|
|
10117
10267
|
width: calc(100% - 56px);
|
|
10118
|
-
border-radius: ${(props) => borders$
|
|
10268
|
+
border-radius: ${(props) => borders$2[props.theme.borderRadius]};
|
|
10119
10269
|
padding: 14px 16px 14px 14px;
|
|
10120
10270
|
background-color: ${(props) => props.theme.colors.telegramButton};
|
|
10121
10271
|
|
|
@@ -10145,7 +10295,7 @@ const actionButtonBorderRadius = {
|
|
|
10145
10295
|
s: "8px",
|
|
10146
10296
|
none: "0"
|
|
10147
10297
|
};
|
|
10148
|
-
const H1Styled$
|
|
10298
|
+
const H1Styled$3 = styled(H1)`
|
|
10149
10299
|
margin-bottom: 2px;
|
|
10150
10300
|
padding: 0 52px;
|
|
10151
10301
|
`;
|
|
@@ -10175,7 +10325,7 @@ const ActionButton = styled(Button)`
|
|
|
10175
10325
|
padding: 17px 20px 19px 20px;
|
|
10176
10326
|
`;
|
|
10177
10327
|
const MobileUniversalQR = (props) => {
|
|
10178
|
-
return [createComponent(H1Styled$
|
|
10328
|
+
return [createComponent(H1Styled$3, {
|
|
10179
10329
|
translationKey: "walletModal.mobileUniversalModal.connectYourWallet",
|
|
10180
10330
|
children: "Connect your TON wallet"
|
|
10181
10331
|
}), createComponent(H2Styled$1, {
|
|
@@ -10342,7 +10492,7 @@ const MobileUniversalModal = (props) => {
|
|
|
10342
10492
|
return createComponent(QRIcon, {});
|
|
10343
10493
|
},
|
|
10344
10494
|
onClick: onOpenQR
|
|
10345
|
-
}), createComponent(H1Styled$
|
|
10495
|
+
}), createComponent(H1Styled$4, {
|
|
10346
10496
|
translationKey: "walletModal.mobileUniversalModal.connectYourWallet",
|
|
10347
10497
|
children: "Connect your TON wallet"
|
|
10348
10498
|
}), createComponent(Show, {
|
|
@@ -10424,7 +10574,7 @@ const MobileUniversalModal = (props) => {
|
|
|
10424
10574
|
return _el$;
|
|
10425
10575
|
})();
|
|
10426
10576
|
};
|
|
10427
|
-
const borders = {
|
|
10577
|
+
const borders$1 = {
|
|
10428
10578
|
m: "16px",
|
|
10429
10579
|
s: "8px",
|
|
10430
10580
|
none: "0"
|
|
@@ -10466,7 +10616,7 @@ styled(Button)`
|
|
|
10466
10616
|
width: 100%;
|
|
10467
10617
|
padding: 0 16px;
|
|
10468
10618
|
height: 56px;
|
|
10469
|
-
border-radius: ${(props) => borders[props.theme.borderRadius]};
|
|
10619
|
+
border-radius: ${(props) => borders$1[props.theme.borderRadius]};
|
|
10470
10620
|
|
|
10471
10621
|
&:hover {
|
|
10472
10622
|
${(props) => props.disableEventsAnimation ? "transform: unset;" : ""}
|
|
@@ -10486,7 +10636,7 @@ styled.ul`
|
|
|
10486
10636
|
transform: translateY(-16px);
|
|
10487
10637
|
|
|
10488
10638
|
background-color: ${(props) => props.theme.colors.background.primary};
|
|
10489
|
-
border-radius: ${(props) => borders[props.theme.borderRadius]};
|
|
10639
|
+
border-radius: ${(props) => borders$1[props.theme.borderRadius]};
|
|
10490
10640
|
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.16);
|
|
10491
10641
|
`;
|
|
10492
10642
|
styled.li`
|
|
@@ -10591,111 +10741,475 @@ const DesktopUniversalModal = (props) => {
|
|
|
10591
10741
|
}
|
|
10592
10742
|
});
|
|
10593
10743
|
};
|
|
10594
|
-
const
|
|
10595
|
-
|
|
10596
|
-
|
|
10597
|
-
|
|
10598
|
-
|
|
10599
|
-
|
|
10600
|
-
|
|
10601
|
-
|
|
10602
|
-
|
|
10603
|
-
|
|
10604
|
-
|
|
10605
|
-
|
|
10606
|
-
|
|
10607
|
-
|
|
10608
|
-
|
|
10609
|
-
|
|
10610
|
-
|
|
10611
|
-
|
|
10612
|
-
|
|
10613
|
-
|
|
10614
|
-
|
|
10615
|
-
|
|
10616
|
-
|
|
10617
|
-
|
|
10618
|
-
|
|
10619
|
-
|
|
10620
|
-
|
|
10621
|
-
|
|
10622
|
-
|
|
10623
|
-
|
|
10624
|
-
|
|
10625
|
-
|
|
10626
|
-
|
|
10627
|
-
|
|
10628
|
-
|
|
10629
|
-
|
|
10630
|
-
|
|
10631
|
-
|
|
10632
|
-
|
|
10633
|
-
|
|
10634
|
-
|
|
10635
|
-
|
|
10636
|
-
|
|
10637
|
-
|
|
10638
|
-
|
|
10639
|
-
|
|
10640
|
-
|
|
10641
|
-
|
|
10642
|
-
|
|
10643
|
-
|
|
10644
|
-
|
|
10645
|
-
|
|
10646
|
-
|
|
10647
|
-
|
|
10648
|
-
|
|
10649
|
-
|
|
10650
|
-
|
|
10651
|
-
|
|
10652
|
-
|
|
10653
|
-
|
|
10654
|
-
|
|
10655
|
-
|
|
10656
|
-
|
|
10657
|
-
|
|
10658
|
-
|
|
10659
|
-
|
|
10660
|
-
|
|
10661
|
-
|
|
10662
|
-
|
|
10663
|
-
|
|
10664
|
-
|
|
10665
|
-
|
|
10666
|
-
|
|
10667
|
-
|
|
10668
|
-
|
|
10669
|
-
|
|
10670
|
-
|
|
10671
|
-
|
|
10672
|
-
|
|
10673
|
-
|
|
10674
|
-
|
|
10675
|
-
|
|
10676
|
-
|
|
10677
|
-
|
|
10678
|
-
|
|
10679
|
-
|
|
10680
|
-
|
|
10681
|
-
|
|
10682
|
-
|
|
10683
|
-
|
|
10684
|
-
|
|
10685
|
-
|
|
10686
|
-
|
|
10687
|
-
|
|
10688
|
-
|
|
10689
|
-
|
|
10690
|
-
|
|
10691
|
-
|
|
10692
|
-
|
|
10693
|
-
|
|
10694
|
-
|
|
10695
|
-
|
|
10696
|
-
|
|
10744
|
+
const borders = {
|
|
10745
|
+
m: "16px",
|
|
10746
|
+
s: "8px",
|
|
10747
|
+
none: "0"
|
|
10748
|
+
};
|
|
10749
|
+
const H1Styled$2 = styled(H1)`
|
|
10750
|
+
max-width: 288px;
|
|
10751
|
+
margin: 0 auto 38px;
|
|
10752
|
+
`;
|
|
10753
|
+
const DesktopFeatureNotSupportModalStyled = styled.div`
|
|
10754
|
+
display: flex;
|
|
10755
|
+
flex-direction: column;
|
|
10756
|
+
align-items: center;
|
|
10757
|
+
`;
|
|
10758
|
+
const StyledIconButton$1 = styled(IconButton)`
|
|
10759
|
+
position: absolute;
|
|
10760
|
+
top: 16px;
|
|
10761
|
+
left: 16px;
|
|
10762
|
+
`;
|
|
10763
|
+
const TitleStyled = styled(H1)`
|
|
10764
|
+
text-align: center;
|
|
10765
|
+
font-size: 20px;
|
|
10766
|
+
line-height: 28px;
|
|
10767
|
+
`;
|
|
10768
|
+
const DescriptionStyled = styled(Text)`
|
|
10769
|
+
margin-top: 12px;
|
|
10770
|
+
margin-bottom: 24px;
|
|
10771
|
+
text-align: center;
|
|
10772
|
+
max-width: 360px;
|
|
10773
|
+
font-weight: 400;
|
|
10774
|
+
color: ${(props) => props.theme.colors.text.secondary};
|
|
10775
|
+
`;
|
|
10776
|
+
styled.button`
|
|
10777
|
+
background: transparent;
|
|
10778
|
+
border: none;
|
|
10779
|
+
padding: 0;
|
|
10780
|
+
margin: 0;
|
|
10781
|
+
color: ${(props) => props.theme.colors.accent};
|
|
10782
|
+
text-decoration: underline;
|
|
10783
|
+
cursor: pointer;
|
|
10784
|
+
font: inherit;
|
|
10785
|
+
`;
|
|
10786
|
+
const Spacer = styled.div`
|
|
10787
|
+
margin-bottom: 46px;
|
|
10788
|
+
`;
|
|
10789
|
+
const ErrorIconStyled = styled(ErrorIcon)`
|
|
10790
|
+
margin-bottom: 16px;
|
|
10791
|
+
`;
|
|
10792
|
+
styled.ul`
|
|
10793
|
+
display: flex;
|
|
10794
|
+
gap: 8px;
|
|
10795
|
+
margin-bottom: 24px;
|
|
10796
|
+
list-style: none;
|
|
10797
|
+
padding: 0;
|
|
10798
|
+
`;
|
|
10799
|
+
const DisconnectButtonStyled = styled(Button)`
|
|
10800
|
+
max-width: 320px;
|
|
10801
|
+
width: 100%;
|
|
10802
|
+
height: 48px;
|
|
10803
|
+
font-size: 16px;
|
|
10804
|
+
line-height: 20px;
|
|
10805
|
+
border-radius: ${(props) => borders[props.theme.borderRadius]};
|
|
10806
|
+
margin-bottom: 28px;
|
|
10807
|
+
`;
|
|
10808
|
+
const BodyTextStyled = styled(H2)`
|
|
10809
|
+
color: ${(props) => props.theme.colors.text.secondary};
|
|
10810
|
+
text-align: center;
|
|
10811
|
+
margin-bottom: 20px;
|
|
10812
|
+
`;
|
|
10813
|
+
const ButtonsContainerStyled = styled.div`
|
|
10814
|
+
display: flex;
|
|
10815
|
+
justify-content: center;
|
|
10816
|
+
gap: 8px;
|
|
10817
|
+
padding-bottom: 31px;
|
|
10818
|
+
`;
|
|
10819
|
+
const RestoreInfoModalStyled = styled.div`
|
|
10820
|
+
margin: 0 8px 16px 8px;
|
|
10821
|
+
`;
|
|
10822
|
+
const StyledIconButton = styled(IconButton)`
|
|
10823
|
+
position: absolute;
|
|
10824
|
+
top: 16px;
|
|
10825
|
+
left: 16px;
|
|
10826
|
+
`;
|
|
10827
|
+
const H1Styled$1 = styled(H1)`
|
|
10828
|
+
margin-bottom: 18px;
|
|
10829
|
+
text-align: center;
|
|
10830
|
+
`;
|
|
10831
|
+
const StepBlock = styled.div`
|
|
10832
|
+
padding: 16px 0;
|
|
10833
|
+
display: flex;
|
|
10834
|
+
flex-direction: column;
|
|
10835
|
+
align-items: center;
|
|
10836
|
+
`;
|
|
10837
|
+
styled.div`
|
|
10838
|
+
margin-bottom: 12px;
|
|
10839
|
+
`;
|
|
10840
|
+
const H3Styled = styled(H3)`
|
|
10841
|
+
text-align: center;
|
|
10842
|
+
margin-bottom: 4px;
|
|
10843
|
+
`;
|
|
10844
|
+
const TextStyled$1 = styled(Text)`
|
|
10845
|
+
text-align: center;
|
|
10846
|
+
max-width: 352px;
|
|
10847
|
+
color: ${(props) => props.theme.colors.text.secondary};
|
|
10848
|
+
`;
|
|
10849
|
+
const CircleNumber = styled.div`
|
|
10850
|
+
width: 44px;
|
|
10851
|
+
height: 44px;
|
|
10852
|
+
border-radius: 20px;
|
|
10853
|
+
background-color: ${(props) => {
|
|
10854
|
+
var _a2;
|
|
10855
|
+
return (_a2 = props.theme) == null ? void 0 : _a2.colors.icon.secondary;
|
|
10856
|
+
}};
|
|
10857
|
+
display: flex;
|
|
10858
|
+
align-items: center;
|
|
10859
|
+
justify-content: center;
|
|
10860
|
+
margin-bottom: 12px;
|
|
10861
|
+
font-weight: 700;
|
|
10862
|
+
font-size: 22px;
|
|
10863
|
+
color: ${(props) => {
|
|
10864
|
+
var _a2;
|
|
10865
|
+
return (_a2 = props.theme) == null ? void 0 : _a2.colors.text.primary;
|
|
10866
|
+
}};
|
|
10867
|
+
`;
|
|
10868
|
+
const RestoreInfoModal = (props) => {
|
|
10869
|
+
return createComponent(RestoreInfoModalStyled, {
|
|
10870
|
+
"data-tc-wallets-modal-restore": "true",
|
|
10871
|
+
get children() {
|
|
10872
|
+
return [createComponent(StyledIconButton, {
|
|
10873
|
+
icon: "arrow",
|
|
10874
|
+
get onClick() {
|
|
10875
|
+
return props.onBackClick;
|
|
10876
|
+
}
|
|
10877
|
+
}), createComponent(H1Styled$1, {
|
|
10878
|
+
translationKey: "walletModal.restoreInfoModal.title",
|
|
10879
|
+
children: "Restore"
|
|
10880
|
+
}), createComponent(ScrollContainer, {
|
|
10881
|
+
get children() {
|
|
10882
|
+
return [createComponent(StepBlock, {
|
|
10883
|
+
get children() {
|
|
10884
|
+
return [createComponent(CircleNumber, {
|
|
10885
|
+
children: "1"
|
|
10886
|
+
}), createComponent(H3Styled, {
|
|
10887
|
+
translationKey: "walletModal.restoreModal.step1.title",
|
|
10888
|
+
children: "Find your current recovery phrase"
|
|
10889
|
+
}), createComponent(TextStyled$1, {
|
|
10890
|
+
translationKey: "walletModal.restoreModal.step1.text",
|
|
10891
|
+
children: "Open your wallet settings and locate the\xA0recovery\xA0phrase"
|
|
10892
|
+
})];
|
|
10893
|
+
}
|
|
10894
|
+
}), createComponent(StepBlock, {
|
|
10895
|
+
get children() {
|
|
10896
|
+
return [createComponent(CircleNumber, {
|
|
10897
|
+
children: "2"
|
|
10898
|
+
}), createComponent(H3Styled, {
|
|
10899
|
+
translationKey: "walletModal.restoreModal.step2.title",
|
|
10900
|
+
children: "Copy your recovery phrase"
|
|
10901
|
+
}), createComponent(TextStyled$1, {
|
|
10902
|
+
translationKey: "walletModal.restoreModal.step2.text",
|
|
10903
|
+
children: "Write it down or copy it to a safe place"
|
|
10904
|
+
})];
|
|
10905
|
+
}
|
|
10906
|
+
}), createComponent(StepBlock, {
|
|
10907
|
+
get children() {
|
|
10908
|
+
return [createComponent(CircleNumber, {
|
|
10909
|
+
children: "3"
|
|
10910
|
+
}), createComponent(H3Styled, {
|
|
10911
|
+
translationKey: "walletModal.restoreModal.step3.title",
|
|
10912
|
+
children: "Restore in a supported wallet from\xA0the\xA0list\xA0below"
|
|
10913
|
+
}), createComponent(TextStyled$1, {
|
|
10914
|
+
translationKey: "walletModal.restoreModal.step3.text",
|
|
10915
|
+
children: "Enter the recovery phrase to access your wallet"
|
|
10916
|
+
})];
|
|
10917
|
+
}
|
|
10918
|
+
})];
|
|
10919
|
+
}
|
|
10920
|
+
})];
|
|
10921
|
+
}
|
|
10922
|
+
});
|
|
10923
|
+
};
|
|
10924
|
+
const DesktopFeatureNotSupportModal = (props) => {
|
|
10925
|
+
const [selectedWallet, setSelectedWallet] = createSignal(null);
|
|
10926
|
+
const [infoModalOpen, setInfoModalOpen] = createSignal(false);
|
|
10927
|
+
const currentWalletUI = createMemo(() => props.walletsList.find((wallet) => wallet.appName === props.currentWallet.device.appName || wallet.name === props.currentWallet.device.appName));
|
|
10928
|
+
const currentWalletName = createMemo(() => {
|
|
10929
|
+
var _a2, _b2, _c2, _d2;
|
|
10930
|
+
const appName = (_b2 = (_a2 = currentWalletUI()) == null ? void 0 : _a2.appName) != null ? _b2 : props.currentWallet.device.appName;
|
|
10931
|
+
if (appName === AT_WALLET_APP_NAME) {
|
|
10932
|
+
return "Wallet in Telegram";
|
|
10933
|
+
}
|
|
10934
|
+
return (_d2 = (_c2 = currentWalletUI()) == null ? void 0 : _c2.name) != null ? _d2 : props.currentWallet.device.appName;
|
|
10935
|
+
});
|
|
10936
|
+
const currentWalletVersionNotSupported = createMemo(() => {
|
|
10937
|
+
const currentWalletUIVar = currentWalletUI();
|
|
10938
|
+
if (!(currentWalletUIVar == null ? void 0 : currentWalletUIVar.features)) {
|
|
10939
|
+
return false;
|
|
10940
|
+
}
|
|
10941
|
+
const requiredFeature = props.walletsModalState.requiredFeature;
|
|
10942
|
+
const requiredFeatures = requiredFeature ? {
|
|
10943
|
+
[requiredFeature.featureName]: requiredFeature.value
|
|
10944
|
+
} : {};
|
|
10945
|
+
const validInList = sdk.checkRequiredWalletFeatures(currentWalletUIVar.features, requiredFeatures);
|
|
10946
|
+
const validCurrentWallet = sdk.checkRequiredWalletFeatures(props.currentWallet.device.features, requiredFeatures);
|
|
10947
|
+
return validInList && !validCurrentWallet;
|
|
10948
|
+
});
|
|
10949
|
+
const handleDisconnect = () => __async(exports, null, function* () {
|
|
10950
|
+
yield props.onDisconnect();
|
|
10951
|
+
props.onSelect(selectedWallet());
|
|
10952
|
+
});
|
|
10953
|
+
return createComponent(DesktopFeatureNotSupportModalStyled, {
|
|
10954
|
+
get children() {
|
|
10955
|
+
return createComponent(Switch, {
|
|
10956
|
+
get children() {
|
|
10957
|
+
return [createComponent(Match, {
|
|
10958
|
+
get when() {
|
|
10959
|
+
return infoModalOpen();
|
|
10960
|
+
},
|
|
10961
|
+
get children() {
|
|
10962
|
+
return createComponent(RestoreInfoModal, {
|
|
10963
|
+
onBackClick: () => setInfoModalOpen(false)
|
|
10964
|
+
});
|
|
10965
|
+
}
|
|
10966
|
+
}), createComponent(Match, {
|
|
10967
|
+
get when() {
|
|
10968
|
+
return selectedWallet();
|
|
10969
|
+
},
|
|
10970
|
+
get children() {
|
|
10971
|
+
return [createComponent(Spacer, {}), createComponent(DesktopFeatureNotSupportModalStyled, {
|
|
10972
|
+
get children() {
|
|
10973
|
+
return [createComponent(StyledIconButton$1, {
|
|
10974
|
+
icon: "arrow",
|
|
10975
|
+
onClick: () => setSelectedWallet(null)
|
|
10976
|
+
}), createComponent(TitleStyled, {
|
|
10977
|
+
translationKey: "walletModal.featureNotSupported.disconnect.title",
|
|
10978
|
+
children: "Confirm Disconnect"
|
|
10979
|
+
}), createComponent(DescriptionStyled, {
|
|
10980
|
+
translationKey: "walletModal.featureNotSupported.disconnect.description",
|
|
10981
|
+
get translationValues() {
|
|
10982
|
+
return {
|
|
10983
|
+
name: selectedWallet().name
|
|
10984
|
+
};
|
|
10985
|
+
},
|
|
10986
|
+
get children() {
|
|
10987
|
+
return ["You will be disconnected from your current wallet and redirected to connect ", createMemo(() => {
|
|
10988
|
+
var _a2;
|
|
10989
|
+
return (_a2 = selectedWallet()) == null ? void 0 : _a2.name;
|
|
10990
|
+
}), "."];
|
|
10991
|
+
}
|
|
10992
|
+
}), createComponent(DisconnectButtonStyled, {
|
|
10993
|
+
onClick: () => handleDisconnect(),
|
|
10994
|
+
get children() {
|
|
10995
|
+
return createComponent(Translation, {
|
|
10996
|
+
translationKey: "walletModal.featureNotSupported.disconnect.button",
|
|
10997
|
+
children: "Disconnect"
|
|
10998
|
+
});
|
|
10999
|
+
}
|
|
11000
|
+
})];
|
|
11001
|
+
}
|
|
11002
|
+
})];
|
|
11003
|
+
}
|
|
11004
|
+
}), createComponent(Match, {
|
|
11005
|
+
get when() {
|
|
11006
|
+
return currentWalletVersionNotSupported();
|
|
11007
|
+
},
|
|
11008
|
+
get children() {
|
|
11009
|
+
return [createComponent(H1Styled$2, {
|
|
11010
|
+
get children() {
|
|
11011
|
+
return currentWalletName();
|
|
11012
|
+
}
|
|
11013
|
+
}), createComponent(ErrorIconStyled, {
|
|
11014
|
+
size: "s"
|
|
11015
|
+
}), createComponent(BodyTextStyled, {
|
|
11016
|
+
translationKey: "walletModal.featureNotSupported.version.description",
|
|
11017
|
+
get translationValues() {
|
|
11018
|
+
return {
|
|
11019
|
+
name: currentWalletName()
|
|
11020
|
+
};
|
|
11021
|
+
},
|
|
11022
|
+
get children() {
|
|
11023
|
+
return ["Your current version of ", createMemo(() => currentWalletName()), " or wallet contract type doesn't support the required features. Please update it to continue."];
|
|
11024
|
+
}
|
|
11025
|
+
}), createComponent(ButtonsContainerStyled, {
|
|
11026
|
+
get children() {
|
|
11027
|
+
return [createComponent(Link, {
|
|
11028
|
+
get href() {
|
|
11029
|
+
return currentWalletUI().aboutUrl;
|
|
11030
|
+
},
|
|
11031
|
+
blank: true,
|
|
11032
|
+
get children() {
|
|
11033
|
+
return createComponent(Button, {
|
|
11034
|
+
get leftIcon() {
|
|
11035
|
+
return createComponent(LinkIcon, {});
|
|
11036
|
+
},
|
|
11037
|
+
get children() {
|
|
11038
|
+
return createComponent(Translation, {
|
|
11039
|
+
translationKey: "walletModal.featureNotSupported.version.updateButton",
|
|
11040
|
+
get translationValues() {
|
|
11041
|
+
return {
|
|
11042
|
+
name: currentWalletName()
|
|
11043
|
+
};
|
|
11044
|
+
},
|
|
11045
|
+
get children() {
|
|
11046
|
+
return ["Update ", createMemo(() => currentWalletName())];
|
|
11047
|
+
}
|
|
11048
|
+
});
|
|
11049
|
+
}
|
|
11050
|
+
});
|
|
11051
|
+
}
|
|
11052
|
+
}), createComponent(Link, {
|
|
11053
|
+
href: "https://tonkeeper.helpscoutdocs.com/article/102-w5",
|
|
11054
|
+
blank: true,
|
|
11055
|
+
get children() {
|
|
11056
|
+
return createComponent(Button, {
|
|
11057
|
+
get leftIcon() {
|
|
11058
|
+
return createComponent(LinkIcon, {});
|
|
11059
|
+
},
|
|
11060
|
+
get children() {
|
|
11061
|
+
return createComponent(Translation, {
|
|
11062
|
+
translationKey: "walletModal.featureNotSupported.version.aboutW5",
|
|
11063
|
+
children: "About W5"
|
|
11064
|
+
});
|
|
11065
|
+
}
|
|
11066
|
+
});
|
|
11067
|
+
}
|
|
11068
|
+
})];
|
|
11069
|
+
}
|
|
11070
|
+
})];
|
|
11071
|
+
}
|
|
11072
|
+
}), createComponent(Match, {
|
|
11073
|
+
when: true,
|
|
11074
|
+
get children() {
|
|
11075
|
+
return [createComponent(Spacer, {}), createComponent(ErrorIconStyled, {
|
|
11076
|
+
size: "s"
|
|
11077
|
+
}), createComponent(TitleStyled, {
|
|
11078
|
+
translationKey: "walletModal.featureNotSupported.wallet.title",
|
|
11079
|
+
get translationValues() {
|
|
11080
|
+
return {
|
|
11081
|
+
name: currentWalletName()
|
|
11082
|
+
};
|
|
11083
|
+
},
|
|
11084
|
+
get children() {
|
|
11085
|
+
return [createMemo(() => currentWalletName()), " doesn\u2019t support the requested\xA0action"];
|
|
11086
|
+
}
|
|
11087
|
+
}), createComponent(Spacer, {})];
|
|
11088
|
+
}
|
|
11089
|
+
})];
|
|
11090
|
+
}
|
|
11091
|
+
});
|
|
11092
|
+
}
|
|
11093
|
+
});
|
|
11094
|
+
};
|
|
11095
|
+
const WalletsModal = () => {
|
|
11096
|
+
const {
|
|
11097
|
+
locale
|
|
11098
|
+
} = useI18n()[1];
|
|
11099
|
+
createEffect(() => locale(appState.language));
|
|
11100
|
+
createEffect(() => {
|
|
11101
|
+
if (getWalletsModalIsOpened()) {
|
|
11102
|
+
updateIsMobile();
|
|
11103
|
+
} else {
|
|
11104
|
+
setSelectedWalletInfo(null);
|
|
11105
|
+
setSelectedTab("universal");
|
|
11106
|
+
setInfoTab(false);
|
|
11107
|
+
}
|
|
11108
|
+
});
|
|
11109
|
+
const connector = useContext(ConnectorContext);
|
|
11110
|
+
const tonConnectUI = useContext(TonConnectUiContext);
|
|
11111
|
+
const [fetchedWalletsList] = createResource(() => tonConnectUI.getWallets());
|
|
11112
|
+
const [selectedWalletInfo, setSelectedWalletInfo] = createSignal(null);
|
|
11113
|
+
const [selectedWalletError, setSelectedWalletError] = createSignal(null);
|
|
11114
|
+
const [selectedTab, setSelectedTab] = createSignal("universal");
|
|
11115
|
+
const [infoTab, setInfoTab] = createSignal(false);
|
|
11116
|
+
const walletsModalIsWalletNotSupportFeature = createMemo(() => {
|
|
11117
|
+
const state = walletsModalState();
|
|
11118
|
+
return "type" in state && state.type === "wallet-not-support-feature";
|
|
11119
|
+
});
|
|
11120
|
+
const walletsList = createMemo(() => {
|
|
11121
|
+
var _a2;
|
|
11122
|
+
if (fetchedWalletsList.state !== "ready") {
|
|
11123
|
+
return null;
|
|
11124
|
+
}
|
|
11125
|
+
let walletsList2 = applyWalletsListConfiguration(fetchedWalletsList(), appState.walletsListConfiguration);
|
|
11126
|
+
const injectedWallets = walletsList2.filter(sdk.isWalletInfoCurrentlyInjected);
|
|
11127
|
+
const notInjectedWallets = walletsList2.filter((w) => !sdk.isWalletInfoCurrentlyInjected(w));
|
|
11128
|
+
walletsList2 = (injectedWallets || []).concat(notInjectedWallets);
|
|
11129
|
+
const preferredWalletAppName = appState.preferredWalletAppName;
|
|
11130
|
+
const preferredWallet = walletsList2.find((item) => eqWalletName(item, preferredWalletAppName));
|
|
11131
|
+
const someWalletsWithSameName = walletsList2.filter((item) => eqWalletName(item, preferredWalletAppName)).length >= 2;
|
|
11132
|
+
if (preferredWalletAppName && preferredWallet && !someWalletsWithSameName) {
|
|
11133
|
+
walletsList2 = [__spreadProps(__spreadValues({}, preferredWallet), {
|
|
11134
|
+
isPreferred: true
|
|
11135
|
+
})].concat(walletsList2.filter((item) => !eqWalletName(item, preferredWalletAppName)));
|
|
11136
|
+
}
|
|
11137
|
+
const atWallet = walletsList2.find((item) => eqWalletName(item, AT_WALLET_APP_NAME));
|
|
11138
|
+
if (atWallet) {
|
|
11139
|
+
walletsList2 = [atWallet].concat(walletsList2.filter((item) => !eqWalletName(item, AT_WALLET_APP_NAME)));
|
|
11140
|
+
}
|
|
11141
|
+
const walletsFeaturesRequested = (_a2 = tonConnectUI == null ? void 0 : tonConnectUI.walletsRequiredFeatures) != null ? _a2 : tonConnectUI == null ? void 0 : tonConnectUI.walletsPreferredFeatures;
|
|
11142
|
+
const uiWallets = walletsList2.map((wallet) => {
|
|
11143
|
+
var _a3;
|
|
11144
|
+
return __spreadProps(__spreadValues({}, wallet), {
|
|
11145
|
+
isSupportRequiredFeatures: walletsFeaturesRequested ? sdk.checkRequiredWalletFeatures((_a3 = wallet.features) != null ? _a3 : [], walletsFeaturesRequested) : true
|
|
11146
|
+
});
|
|
11147
|
+
});
|
|
11148
|
+
return uiWallets;
|
|
11149
|
+
});
|
|
11150
|
+
const additionalRequestLoading = () => {
|
|
11151
|
+
var _a2;
|
|
11152
|
+
return ((_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.state) === "loading";
|
|
11153
|
+
};
|
|
11154
|
+
const additionalRequest = createMemo(() => {
|
|
11155
|
+
var _a2;
|
|
11156
|
+
if (additionalRequestLoading()) {
|
|
11157
|
+
return void 0;
|
|
11158
|
+
}
|
|
11159
|
+
return (_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.value;
|
|
11160
|
+
});
|
|
11161
|
+
const onClose = (closeReason) => {
|
|
11162
|
+
tonConnectUI.closeModal(closeReason);
|
|
11163
|
+
};
|
|
11164
|
+
const unsubscribe = connector.onStatusChange((wallet) => {
|
|
11165
|
+
if (wallet) {
|
|
11166
|
+
onClose("wallet-selected");
|
|
11167
|
+
}
|
|
11168
|
+
}, (err) => {
|
|
11169
|
+
var _a2;
|
|
11170
|
+
if (err instanceof sdk.WalletMissingRequiredFeaturesError) {
|
|
11171
|
+
const errorAppName = err.cause.connectEvent.device.appName.toLowerCase();
|
|
11172
|
+
const wallet = (_a2 = walletsList()) == null ? void 0 : _a2.find((w) => w.appName.toLowerCase() === errorAppName);
|
|
11173
|
+
if (!wallet) {
|
|
11174
|
+
throw new sdk.TonConnectError("Wallet not found");
|
|
11175
|
+
}
|
|
11176
|
+
const walletErrorType = wallet.isSupportRequiredFeatures ? "missing-features" : "not-supported";
|
|
11177
|
+
setSelectedWalletError(walletErrorType);
|
|
11178
|
+
setSelectedWalletInfo(wallet);
|
|
11179
|
+
}
|
|
11180
|
+
});
|
|
11181
|
+
const onSelectAllWallets = () => {
|
|
11182
|
+
setSelectedTab("all-wallets");
|
|
11183
|
+
};
|
|
11184
|
+
const onSelectUniversal = () => {
|
|
11185
|
+
setSelectedTab("universal");
|
|
11186
|
+
};
|
|
11187
|
+
const onSelectWallet = (wallet) => {
|
|
11188
|
+
setSelectedWalletInfo(wallet);
|
|
11189
|
+
widgetController.openWalletsModal();
|
|
11190
|
+
};
|
|
11191
|
+
const clearSelectedWalletInfo = () => {
|
|
11192
|
+
setSelectedWalletInfo(null);
|
|
11193
|
+
setSelectedWalletError(null);
|
|
11194
|
+
};
|
|
11195
|
+
onCleanup(() => {
|
|
11196
|
+
setSelectedWalletInfo(null);
|
|
11197
|
+
setSelectedWalletError(null);
|
|
11198
|
+
setInfoTab(false);
|
|
11199
|
+
});
|
|
11200
|
+
onCleanup(unsubscribe);
|
|
11201
|
+
return createComponent(StyledModal, {
|
|
11202
|
+
get opened() {
|
|
11203
|
+
return getWalletsModalIsOpened();
|
|
11204
|
+
},
|
|
11205
|
+
get enableAndroidBackHandler() {
|
|
11206
|
+
return appState.enableAndroidBackHandler;
|
|
11207
|
+
},
|
|
10697
11208
|
onClose: () => onClose("action-cancelled"),
|
|
10698
11209
|
onClickQuestion: () => setInfoTab((v) => !v),
|
|
11210
|
+
get showFooter() {
|
|
11211
|
+
return !walletsModalIsWalletNotSupportFeature();
|
|
11212
|
+
},
|
|
10699
11213
|
"data-tc-wallets-modal-container": "true",
|
|
10700
11214
|
get children() {
|
|
10701
11215
|
return [createComponent(Show, {
|
|
@@ -10717,7 +11231,7 @@ const WalletsModal = () => {
|
|
|
10717
11231
|
return additionalRequestLoading() || !walletsList();
|
|
10718
11232
|
},
|
|
10719
11233
|
get children() {
|
|
10720
|
-
return [createComponent(H1Styled$
|
|
11234
|
+
return [createComponent(H1Styled$a, {
|
|
10721
11235
|
translationKey: "walletModal.loading",
|
|
10722
11236
|
children: "Wallets list is loading"
|
|
10723
11237
|
}), createComponent(LoaderContainerStyled, {
|
|
@@ -10736,6 +11250,27 @@ const WalletsModal = () => {
|
|
|
10736
11250
|
return createComponent(Switch, {
|
|
10737
11251
|
get children() {
|
|
10738
11252
|
return [createComponent(Match, {
|
|
11253
|
+
get when() {
|
|
11254
|
+
return walletsModalIsWalletNotSupportFeature();
|
|
11255
|
+
},
|
|
11256
|
+
get children() {
|
|
11257
|
+
return createComponent(DesktopFeatureNotSupportModal, {
|
|
11258
|
+
get walletsList() {
|
|
11259
|
+
return walletsList();
|
|
11260
|
+
},
|
|
11261
|
+
get currentWallet() {
|
|
11262
|
+
return tonConnectUI == null ? void 0 : tonConnectUI.wallet;
|
|
11263
|
+
},
|
|
11264
|
+
onSelect: onSelectWallet,
|
|
11265
|
+
onSelectAllWallets,
|
|
11266
|
+
onDisconnect: () => connector.disconnect(),
|
|
11267
|
+
get walletsModalState() {
|
|
11268
|
+
return walletsModalState();
|
|
11269
|
+
},
|
|
11270
|
+
onClose: () => onClose("action-cancelled")
|
|
11271
|
+
});
|
|
11272
|
+
}
|
|
11273
|
+
}), createComponent(Match, {
|
|
10739
11274
|
get when() {
|
|
10740
11275
|
return selectedWalletInfo();
|
|
10741
11276
|
},
|
|
@@ -10784,6 +11319,9 @@ const WalletsModal = () => {
|
|
|
10784
11319
|
get walletsList() {
|
|
10785
11320
|
return walletsList();
|
|
10786
11321
|
},
|
|
11322
|
+
get featureCheckMode() {
|
|
11323
|
+
return (tonConnectUI == null ? void 0 : tonConnectUI.walletsRequiredFeatures) ? "strict" : "soft";
|
|
11324
|
+
},
|
|
10787
11325
|
onBack: onSelectUniversal,
|
|
10788
11326
|
onSelect: setSelectedWalletInfo
|
|
10789
11327
|
});
|
|
@@ -10981,6 +11519,52 @@ const TransactionSentModal = (props) => {
|
|
|
10981
11519
|
"data-tc-transaction-sent-modal": "true"
|
|
10982
11520
|
});
|
|
10983
11521
|
};
|
|
11522
|
+
const ConfirmSignDataModal = (props) => {
|
|
11523
|
+
const tonConnectUI = useContext(TonConnectUiContext);
|
|
11524
|
+
const [t2] = useI18n();
|
|
11525
|
+
const name = () => tonConnectUI.wallet && "name" in tonConnectUI.wallet ? tonConnectUI.wallet.name : t2("common.yourWallet", {}, "Your wallet");
|
|
11526
|
+
return createComponent(ActionModal, {
|
|
11527
|
+
headerTranslationKey: "actionModal.signData.header",
|
|
11528
|
+
get headerTranslationValues() {
|
|
11529
|
+
return {
|
|
11530
|
+
name: name()
|
|
11531
|
+
};
|
|
11532
|
+
},
|
|
11533
|
+
textTranslationKey: "actionModal.signData.text",
|
|
11534
|
+
get icon() {
|
|
11535
|
+
return createComponent(LoaderIcon, {
|
|
11536
|
+
size: "m"
|
|
11537
|
+
});
|
|
11538
|
+
},
|
|
11539
|
+
onClose: () => props.onClose(),
|
|
11540
|
+
showButton: "open-wallet",
|
|
11541
|
+
"data-tc-sign-data-confirm-modal": "true"
|
|
11542
|
+
});
|
|
11543
|
+
};
|
|
11544
|
+
const SignDataCanceledModal = (props) => {
|
|
11545
|
+
return createComponent(ActionModal, {
|
|
11546
|
+
headerTranslationKey: "actionModal.signDataCanceled.header",
|
|
11547
|
+
get icon() {
|
|
11548
|
+
return createComponent(ErrorIcon, {
|
|
11549
|
+
size: "m"
|
|
11550
|
+
});
|
|
11551
|
+
},
|
|
11552
|
+
onClose: () => props.onClose(),
|
|
11553
|
+
"data-tc-sign-data-canceled-modal": "true"
|
|
11554
|
+
});
|
|
11555
|
+
};
|
|
11556
|
+
const DataSignedModal = (props) => {
|
|
11557
|
+
return createComponent(ActionModal, {
|
|
11558
|
+
headerTranslationKey: "actionModal.dataSigned.header",
|
|
11559
|
+
get icon() {
|
|
11560
|
+
return createComponent(SuccessIcon, {
|
|
11561
|
+
size: "m"
|
|
11562
|
+
});
|
|
11563
|
+
},
|
|
11564
|
+
onClose: () => props.onClose(),
|
|
11565
|
+
"data-tc-data-signed-modal": "true"
|
|
11566
|
+
});
|
|
11567
|
+
};
|
|
10984
11568
|
const ActionsModal = () => {
|
|
10985
11569
|
return createComponent(Modal, {
|
|
10986
11570
|
get opened() {
|
|
@@ -10991,6 +11575,7 @@ const ActionsModal = () => {
|
|
|
10991
11575
|
return appState.enableAndroidBackHandler;
|
|
10992
11576
|
},
|
|
10993
11577
|
onClose: () => setAction(null),
|
|
11578
|
+
showFooter: false,
|
|
10994
11579
|
"data-tc-actions-modal-container": "true",
|
|
10995
11580
|
get children() {
|
|
10996
11581
|
return createComponent(Switch, {
|
|
@@ -11022,6 +11607,33 @@ const ActionsModal = () => {
|
|
|
11022
11607
|
onClose: () => setAction(null)
|
|
11023
11608
|
});
|
|
11024
11609
|
}
|
|
11610
|
+
}), createComponent(Match, {
|
|
11611
|
+
get when() {
|
|
11612
|
+
return action().name === "data-signed";
|
|
11613
|
+
},
|
|
11614
|
+
get children() {
|
|
11615
|
+
return createComponent(DataSignedModal, {
|
|
11616
|
+
onClose: () => setAction(null)
|
|
11617
|
+
});
|
|
11618
|
+
}
|
|
11619
|
+
}), createComponent(Match, {
|
|
11620
|
+
get when() {
|
|
11621
|
+
return action().name === "sign-data-canceled";
|
|
11622
|
+
},
|
|
11623
|
+
get children() {
|
|
11624
|
+
return createComponent(SignDataCanceledModal, {
|
|
11625
|
+
onClose: () => setAction(null)
|
|
11626
|
+
});
|
|
11627
|
+
}
|
|
11628
|
+
}), createComponent(Match, {
|
|
11629
|
+
get when() {
|
|
11630
|
+
return action().name === "confirm-sign-data";
|
|
11631
|
+
},
|
|
11632
|
+
get children() {
|
|
11633
|
+
return createComponent(ConfirmSignDataModal, {
|
|
11634
|
+
onClose: () => setAction(null)
|
|
11635
|
+
});
|
|
11636
|
+
}
|
|
11025
11637
|
})];
|
|
11026
11638
|
}
|
|
11027
11639
|
});
|
|
@@ -11073,6 +11685,7 @@ const SingleWalletModal = () => {
|
|
|
11073
11685
|
},
|
|
11074
11686
|
onClose: () => onClose("action-cancelled"),
|
|
11075
11687
|
onClickQuestion: () => setInfoTab((v) => !v),
|
|
11688
|
+
showFooter: true,
|
|
11076
11689
|
"data-tc-wallets-modal-container": "true",
|
|
11077
11690
|
get children() {
|
|
11078
11691
|
return [createComponent(Show, {
|
|
@@ -11094,7 +11707,7 @@ const SingleWalletModal = () => {
|
|
|
11094
11707
|
return additionalRequestLoading();
|
|
11095
11708
|
},
|
|
11096
11709
|
get children() {
|
|
11097
|
-
return [createComponent(H1Styled$
|
|
11710
|
+
return [createComponent(H1Styled$a, {
|
|
11098
11711
|
translationKey: "walletModal.loading",
|
|
11099
11712
|
children: "Wallets list is loading"
|
|
11100
11713
|
}), createComponent(LoaderContainerStyled, {
|
|
@@ -11200,6 +11813,12 @@ const widgetController = {
|
|
|
11200
11813
|
status: "closed",
|
|
11201
11814
|
closeReason: reason
|
|
11202
11815
|
})),
|
|
11816
|
+
openWalletNotSupportFeatureModal: (cause) => void setTimeout(() => setWalletsModalState({
|
|
11817
|
+
status: "opened",
|
|
11818
|
+
closeReason: null,
|
|
11819
|
+
type: "wallet-not-support-feature",
|
|
11820
|
+
requiredFeature: cause.requiredFeature
|
|
11821
|
+
})),
|
|
11203
11822
|
setAction: (action2) => void setTimeout(() => setAction(action2)),
|
|
11204
11823
|
clearAction: () => void setTimeout(() => setAction(null)),
|
|
11205
11824
|
getSelectedWalletInfo: () => lastSelectedWalletInfo(),
|
|
@@ -11511,8 +12130,29 @@ class TonConnectUITracker {
|
|
|
11511
12130
|
} catch (e2) {
|
|
11512
12131
|
}
|
|
11513
12132
|
}
|
|
12133
|
+
trackDataSentForSignature(...args) {
|
|
12134
|
+
try {
|
|
12135
|
+
const event = sdk.createDataSentForSignatureEvent(this.version, ...args);
|
|
12136
|
+
this.dispatchUserActionEvent(event);
|
|
12137
|
+
} catch (e2) {
|
|
12138
|
+
}
|
|
12139
|
+
}
|
|
12140
|
+
trackDataSigned(...args) {
|
|
12141
|
+
try {
|
|
12142
|
+
const event = sdk.createDataSignedEvent(this.version, ...args);
|
|
12143
|
+
this.dispatchUserActionEvent(event);
|
|
12144
|
+
} catch (e2) {
|
|
12145
|
+
}
|
|
12146
|
+
}
|
|
12147
|
+
trackDataSigningFailed(...args) {
|
|
12148
|
+
try {
|
|
12149
|
+
const event = sdk.createDataSigningFailedEvent(this.version, ...args);
|
|
12150
|
+
this.dispatchUserActionEvent(event);
|
|
12151
|
+
} catch (e2) {
|
|
12152
|
+
}
|
|
12153
|
+
}
|
|
11514
12154
|
}
|
|
11515
|
-
const tonConnectUiVersion = "2.
|
|
12155
|
+
const tonConnectUiVersion = "2.2.0-beta.0";
|
|
11516
12156
|
class TonConnectUI {
|
|
11517
12157
|
constructor(options) {
|
|
11518
12158
|
__publicField(this, "walletInfoStorage", new WalletInfoStorage());
|
|
@@ -11522,7 +12162,8 @@ class TonConnectUI {
|
|
|
11522
12162
|
__publicField(this, "systemThemeChangeUnsubscribe", null);
|
|
11523
12163
|
__publicField(this, "actionsConfiguration");
|
|
11524
12164
|
__publicField(this, "walletsList");
|
|
11525
|
-
__publicField(this, "
|
|
12165
|
+
__publicField(this, "_walletsRequiredFeatures");
|
|
12166
|
+
__publicField(this, "_walletsPreferredFeatures");
|
|
11526
12167
|
__publicField(this, "connectRequestParametersCallback");
|
|
11527
12168
|
__publicField(this, "connector");
|
|
11528
12169
|
__publicField(this, "modal");
|
|
@@ -11563,7 +12204,8 @@ class TonConnectUI {
|
|
|
11563
12204
|
this.transactionModal = new TransactionModalManager({
|
|
11564
12205
|
connector: this.connector
|
|
11565
12206
|
});
|
|
11566
|
-
this.
|
|
12207
|
+
this._walletsRequiredFeatures = options.walletsRequiredFeatures;
|
|
12208
|
+
this._walletsPreferredFeatures = options.walletsPreferredFeatures;
|
|
11567
12209
|
this.walletsList = this.getWallets();
|
|
11568
12210
|
this.walletsList.then((list) => preloadImages(uniq(list.map((item) => item.imageUrl))));
|
|
11569
12211
|
const rootId = this.normalizeWidgetRoot(options == null ? void 0 : options.widgetRootId);
|
|
@@ -11592,6 +12234,12 @@ class TonConnectUI {
|
|
|
11592
12234
|
static getWallets() {
|
|
11593
12235
|
return sdk.TonConnect.getWallets();
|
|
11594
12236
|
}
|
|
12237
|
+
get walletsRequiredFeatures() {
|
|
12238
|
+
return this._walletsRequiredFeatures;
|
|
12239
|
+
}
|
|
12240
|
+
get walletsPreferredFeatures() {
|
|
12241
|
+
return this._walletsPreferredFeatures;
|
|
12242
|
+
}
|
|
11595
12243
|
get connected() {
|
|
11596
12244
|
return this.connector.connected;
|
|
11597
12245
|
}
|
|
@@ -11608,6 +12256,12 @@ class TonConnectUI {
|
|
|
11608
12256
|
var _a2, _b2, _c2, _d2, _e2;
|
|
11609
12257
|
this.checkButtonRootExist(options.buttonRootId);
|
|
11610
12258
|
this.actionsConfiguration = options.actionsConfiguration;
|
|
12259
|
+
if ("walletsRequiredFeatures" in options) {
|
|
12260
|
+
this._walletsRequiredFeatures = options.walletsRequiredFeatures;
|
|
12261
|
+
}
|
|
12262
|
+
if ("walletsPreferredFeatures" in options) {
|
|
12263
|
+
this._walletsPreferredFeatures = options.walletsPreferredFeatures;
|
|
12264
|
+
}
|
|
11611
12265
|
if ((_a2 = options.uiPreferences) == null ? void 0 : _a2.theme) {
|
|
11612
12266
|
if (((_b2 = options.uiPreferences) == null ? void 0 : _b2.theme) !== "SYSTEM") {
|
|
11613
12267
|
(_c2 = this.systemThemeChangeUnsubscribe) == null ? void 0 : _c2.call(this);
|
|
@@ -11732,6 +12386,7 @@ class TonConnectUI {
|
|
|
11732
12386
|
openModal: modals.includes("before"),
|
|
11733
12387
|
sent: false
|
|
11734
12388
|
});
|
|
12389
|
+
const abortController = new AbortController();
|
|
11735
12390
|
const onRequestSent = () => {
|
|
11736
12391
|
if (abortController.signal.aborted) {
|
|
11737
12392
|
return;
|
|
@@ -11742,28 +12397,11 @@ class TonConnectUI {
|
|
|
11742
12397
|
openModal: modals.includes("before"),
|
|
11743
12398
|
sent: true
|
|
11744
12399
|
});
|
|
11745
|
-
|
|
11746
|
-
|
|
11747
|
-
|
|
11748
|
-
|
|
11749
|
-
twaReturnUrl: twaReturnUrl || appState.twaReturnUrl,
|
|
11750
|
-
forceRedirect: false
|
|
11751
|
-
});
|
|
11752
|
-
} else {
|
|
11753
|
-
redirectToWallet(
|
|
11754
|
-
this.walletInfo.universalLink,
|
|
11755
|
-
this.walletInfo.deepLink,
|
|
11756
|
-
{
|
|
11757
|
-
returnStrategy,
|
|
11758
|
-
forceRedirect: false
|
|
11759
|
-
},
|
|
11760
|
-
() => {
|
|
11761
|
-
}
|
|
11762
|
-
);
|
|
11763
|
-
}
|
|
11764
|
-
}
|
|
12400
|
+
this.redirectAfterRequestSent({
|
|
12401
|
+
returnStrategy,
|
|
12402
|
+
twaReturnUrl
|
|
12403
|
+
});
|
|
11765
12404
|
};
|
|
11766
|
-
const abortController = new AbortController();
|
|
11767
12405
|
const unsubscribe = this.onTransactionModalStateChange((action2) => {
|
|
11768
12406
|
if (action2 == null ? void 0 : action2.openModal) {
|
|
11769
12407
|
return;
|
|
@@ -11789,6 +12427,11 @@ class TonConnectUI {
|
|
|
11789
12427
|
});
|
|
11790
12428
|
return result;
|
|
11791
12429
|
} catch (e2) {
|
|
12430
|
+
if (e2 instanceof sdk.WalletNotSupportFeatureError) {
|
|
12431
|
+
widgetController.clearAction();
|
|
12432
|
+
widgetController.openWalletNotSupportFeatureModal(e2.cause);
|
|
12433
|
+
throw e2;
|
|
12434
|
+
}
|
|
11792
12435
|
widgetController.setAction({
|
|
11793
12436
|
name: "transaction-canceled",
|
|
11794
12437
|
showNotification: notifications2.includes("error"),
|
|
@@ -11805,6 +12448,110 @@ class TonConnectUI {
|
|
|
11805
12448
|
}
|
|
11806
12449
|
});
|
|
11807
12450
|
}
|
|
12451
|
+
signData(data) {
|
|
12452
|
+
return __async(this, null, function* () {
|
|
12453
|
+
this.tracker.trackDataSentForSignature(this.wallet, data);
|
|
12454
|
+
if (!this.connected) {
|
|
12455
|
+
this.tracker.trackDataSigningFailed(this.wallet, data, "Wallet was not connected");
|
|
12456
|
+
throw new TonConnectUIError("Connect wallet to send a transaction.");
|
|
12457
|
+
}
|
|
12458
|
+
if (isInTMA()) {
|
|
12459
|
+
sendExpand();
|
|
12460
|
+
}
|
|
12461
|
+
const { notifications: notifications2, modals, returnStrategy, twaReturnUrl } = this.getModalsAndNotificationsConfiguration();
|
|
12462
|
+
widgetController.setAction({
|
|
12463
|
+
name: "confirm-sign-data",
|
|
12464
|
+
showNotification: notifications2.includes("before"),
|
|
12465
|
+
openModal: modals.includes("before"),
|
|
12466
|
+
signed: false
|
|
12467
|
+
});
|
|
12468
|
+
const abortController = new AbortController();
|
|
12469
|
+
const onRequestSent = () => {
|
|
12470
|
+
if (abortController.signal.aborted) {
|
|
12471
|
+
return;
|
|
12472
|
+
}
|
|
12473
|
+
widgetController.setAction({
|
|
12474
|
+
name: "confirm-sign-data",
|
|
12475
|
+
showNotification: notifications2.includes("before"),
|
|
12476
|
+
openModal: modals.includes("before"),
|
|
12477
|
+
signed: true
|
|
12478
|
+
});
|
|
12479
|
+
this.redirectAfterRequestSent({
|
|
12480
|
+
returnStrategy,
|
|
12481
|
+
twaReturnUrl
|
|
12482
|
+
});
|
|
12483
|
+
};
|
|
12484
|
+
const unsubscribe = this.onTransactionModalStateChange((action2) => {
|
|
12485
|
+
if (action2 == null ? void 0 : action2.openModal) {
|
|
12486
|
+
return;
|
|
12487
|
+
}
|
|
12488
|
+
unsubscribe();
|
|
12489
|
+
if (!action2) {
|
|
12490
|
+
abortController.abort();
|
|
12491
|
+
}
|
|
12492
|
+
});
|
|
12493
|
+
try {
|
|
12494
|
+
const result = yield this.waitForSignData(
|
|
12495
|
+
{
|
|
12496
|
+
data,
|
|
12497
|
+
signal: new AbortController().signal
|
|
12498
|
+
},
|
|
12499
|
+
onRequestSent
|
|
12500
|
+
);
|
|
12501
|
+
this.tracker.trackDataSigned(this.wallet, data, result);
|
|
12502
|
+
widgetController.setAction({
|
|
12503
|
+
name: "data-signed",
|
|
12504
|
+
showNotification: notifications2.includes("success"),
|
|
12505
|
+
openModal: modals.includes("success")
|
|
12506
|
+
});
|
|
12507
|
+
return result;
|
|
12508
|
+
} catch (e2) {
|
|
12509
|
+
if (e2 instanceof sdk.WalletNotSupportFeatureError) {
|
|
12510
|
+
widgetController.clearAction();
|
|
12511
|
+
widgetController.openWalletNotSupportFeatureModal(e2.cause);
|
|
12512
|
+
throw e2;
|
|
12513
|
+
}
|
|
12514
|
+
widgetController.setAction({
|
|
12515
|
+
name: "sign-data-canceled",
|
|
12516
|
+
showNotification: notifications2.includes("error"),
|
|
12517
|
+
openModal: modals.includes("error")
|
|
12518
|
+
});
|
|
12519
|
+
if (e2 instanceof sdk.TonConnectError) {
|
|
12520
|
+
throw e2;
|
|
12521
|
+
} else {
|
|
12522
|
+
console.error(e2);
|
|
12523
|
+
throw new TonConnectUIError("Unhandled error:" + e2);
|
|
12524
|
+
}
|
|
12525
|
+
} finally {
|
|
12526
|
+
unsubscribe();
|
|
12527
|
+
}
|
|
12528
|
+
});
|
|
12529
|
+
}
|
|
12530
|
+
redirectAfterRequestSent({
|
|
12531
|
+
returnStrategy,
|
|
12532
|
+
twaReturnUrl
|
|
12533
|
+
}) {
|
|
12534
|
+
if (this.walletInfo && "universalLink" in this.walletInfo && (this.walletInfo.openMethod === "universal-link" || this.walletInfo.openMethod === "custom-deeplink")) {
|
|
12535
|
+
if (sdk.isTelegramUrl(this.walletInfo.universalLink)) {
|
|
12536
|
+
redirectToTelegram(this.walletInfo.universalLink, {
|
|
12537
|
+
returnStrategy,
|
|
12538
|
+
twaReturnUrl: twaReturnUrl || appState.twaReturnUrl,
|
|
12539
|
+
forceRedirect: false
|
|
12540
|
+
});
|
|
12541
|
+
} else {
|
|
12542
|
+
redirectToWallet(
|
|
12543
|
+
this.walletInfo.universalLink,
|
|
12544
|
+
this.walletInfo.deepLink,
|
|
12545
|
+
{
|
|
12546
|
+
returnStrategy,
|
|
12547
|
+
forceRedirect: false
|
|
12548
|
+
},
|
|
12549
|
+
() => {
|
|
12550
|
+
}
|
|
12551
|
+
);
|
|
12552
|
+
}
|
|
12553
|
+
}
|
|
12554
|
+
}
|
|
11808
12555
|
connectEmbeddedWallet(embeddedWallet) {
|
|
11809
12556
|
return __async(this, null, function* () {
|
|
11810
12557
|
const connect = (parameters) => {
|
|
@@ -11927,6 +12674,33 @@ class TonConnectUI {
|
|
|
11927
12674
|
});
|
|
11928
12675
|
});
|
|
11929
12676
|
}
|
|
12677
|
+
waitForSignData(options, onRequestSent) {
|
|
12678
|
+
return __async(this, null, function* () {
|
|
12679
|
+
return new Promise((resolve, reject) => {
|
|
12680
|
+
const { data, signal } = options;
|
|
12681
|
+
if (signal.aborted) {
|
|
12682
|
+
this.tracker.trackDataSigningFailed(this.wallet, data, "SignData was cancelled");
|
|
12683
|
+
return reject(new TonConnectUIError("SignData was not sent"));
|
|
12684
|
+
}
|
|
12685
|
+
const onSignHandler = (data2) => __async(this, null, function* () {
|
|
12686
|
+
resolve(data2);
|
|
12687
|
+
});
|
|
12688
|
+
const onErrorsHandler = (reason) => {
|
|
12689
|
+
reject(reason);
|
|
12690
|
+
};
|
|
12691
|
+
const onCanceledHandler = () => {
|
|
12692
|
+
this.tracker.trackDataSigningFailed(this.wallet, data, "SignData was cancelled");
|
|
12693
|
+
reject(new TonConnectUIError("SignData was not sent"));
|
|
12694
|
+
};
|
|
12695
|
+
signal.addEventListener("abort", onCanceledHandler, { once: true });
|
|
12696
|
+
this.connector.signData(data, { onRequestSent, signal }).then((result) => {
|
|
12697
|
+
return onSignHandler(result);
|
|
12698
|
+
}).catch((reason) => {
|
|
12699
|
+
return onErrorsHandler(reason);
|
|
12700
|
+
});
|
|
12701
|
+
});
|
|
12702
|
+
});
|
|
12703
|
+
}
|
|
11930
12704
|
onTransactionModalStateChange(onChange) {
|
|
11931
12705
|
return this.transactionModal.onStateChange(onChange);
|
|
11932
12706
|
}
|