@agg-build/ui 1.2.9 → 1.2.11
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/{chunk-PFOSEY46.mjs → chunk-3ZSNHGAB.mjs} +835 -401
- package/dist/{chunk-5PSAIGOT.mjs → chunk-54PCEK6G.mjs} +137 -61
- package/dist/{chunk-7JKGAWU5.mjs → chunk-ENAGASVU.mjs} +1538 -1369
- package/dist/{chunk-K23CJ5UP.mjs → chunk-J7K2U44E.mjs} +481 -258
- package/dist/{chunk-5MDFM2MX.mjs → chunk-NWJHFGBZ.mjs} +1 -1
- package/dist/{chunk-QFW5NDJ6.mjs → chunk-SJLHOAKK.mjs} +1001 -1015
- package/dist/{chunk-PYKD4W4T.mjs → chunk-YP75TIY6.mjs} +601 -326
- package/dist/events.js +2038 -1559
- package/dist/events.mjs +3 -3
- package/dist/index.js +5417 -4261
- package/dist/index.mjs +56 -50
- package/dist/modals.js +3262 -2384
- package/dist/modals.mjs +3 -3
- package/dist/pages.js +3677 -2709
- package/dist/pages.mjs +6 -6
- package/dist/primitives.js +992 -918
- package/dist/primitives.mjs +5 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +1 -1
- package/dist/trading.js +1360 -1129
- package/dist/trading.mjs +4 -4
- package/dist/types/deposit/deposit-modal.types.d.mts +10 -1
- package/dist/types/deposit/deposit-modal.types.d.ts +10 -1
- package/dist/types/deposit/index.d.mts +1 -1
- package/dist/types/deposit/index.d.ts +1 -1
- package/dist/types/deposit/steps/crypto-transfer.d.mts +1 -2
- package/dist/types/deposit/steps/crypto-transfer.d.ts +1 -2
- package/dist/types/deposit/steps/deposit-method.d.mts +2 -1
- package/dist/types/deposit/steps/deposit-method.d.ts +2 -1
- package/dist/types/events/item/event-list-item.types.d.mts +3 -1
- package/dist/types/events/item/event-list-item.types.d.ts +3 -1
- package/dist/types/events/item/event-list-item.utils.d.mts +26 -2
- package/dist/types/events/item/event-list-item.utils.d.ts +26 -2
- package/dist/types/events/item-details/event-list-item-details.types.d.mts +30 -1
- package/dist/types/events/item-details/event-list-item-details.types.d.ts +30 -1
- package/dist/types/events/market-details/index.d.mts +1 -1
- package/dist/types/events/market-details/index.d.ts +1 -1
- package/dist/types/events/market-details/market-details.types.d.mts +27 -2
- package/dist/types/events/market-details/market-details.types.d.ts +27 -2
- package/dist/types/events/market-details/market-details.utils.d.mts +18 -4
- package/dist/types/events/market-details/market-details.utils.d.ts +18 -4
- package/dist/types/events/market-details/orderbook-aggregation.d.mts +38 -2
- package/dist/types/events/market-details/orderbook-aggregation.d.ts +38 -2
- package/dist/types/events/shared/chart-auto-fallback.d.mts +43 -0
- package/dist/types/events/shared/chart-auto-fallback.d.ts +43 -0
- package/dist/types/events/shared/display-outcome-price.d.mts +14 -0
- package/dist/types/events/shared/display-outcome-price.d.ts +14 -0
- package/dist/types/events/shared/display-outcome-venue.d.mts +30 -0
- package/dist/types/events/shared/display-outcome-venue.d.ts +30 -0
- package/dist/types/events/shared/display-reference-price.d.mts +4 -0
- package/dist/types/events/shared/display-reference-price.d.ts +4 -0
- package/dist/types/events/shared/select-outcome-price.d.mts +21 -0
- package/dist/types/events/shared/select-outcome-price.d.ts +21 -0
- package/dist/types/pages/user-profile/components/available-balance-card.d.mts +2 -1
- package/dist/types/pages/user-profile/components/available-balance-card.d.ts +2 -1
- package/dist/types/pages/user-profile/components/positions-value-card.d.mts +2 -1
- package/dist/types/pages/user-profile/components/positions-value-card.d.ts +2 -1
- package/dist/types/pages/user-profile/index.d.mts +2 -2
- package/dist/types/pages/user-profile/index.d.ts +2 -2
- package/dist/types/pages/user-profile/user-profile.types.d.mts +54 -1
- package/dist/types/pages/user-profile/user-profile.types.d.ts +54 -1
- package/dist/types/primitives/chart/chart.utils.d.mts +9 -10
- package/dist/types/primitives/chart/chart.utils.d.ts +9 -10
- package/dist/types/primitives/icon/index.d.mts +2 -1
- package/dist/types/primitives/icon/index.d.ts +2 -1
- package/dist/types/primitives/icon/registry.d.mts +8 -0
- package/dist/types/primitives/icon/registry.d.ts +8 -0
- package/dist/types/primitives/icon/svg/circle-xmark.d.mts +5 -0
- package/dist/types/primitives/icon/svg/circle-xmark.d.ts +5 -0
- package/dist/types/primitives/icon/svg/spinner.d.mts +5 -0
- package/dist/types/primitives/icon/svg/spinner.d.ts +5 -0
- package/dist/types/primitives/toast/index.d.mts +2 -0
- package/dist/types/primitives/toast/index.d.ts +2 -0
- package/dist/types/primitives/tooltip/tooltip.types.d.mts +1 -0
- package/dist/types/primitives/tooltip/tooltip.types.d.ts +1 -0
- package/dist/types/primitives/typography/index.d.mts +1 -1
- package/dist/types/primitives/typography/index.d.ts +1 -1
- package/dist/types/primitives/typography/typography.types.d.mts +2 -0
- package/dist/types/primitives/typography/typography.types.d.ts +2 -0
- package/dist/types/shared/transfer-fee-summary.d.mts +10 -0
- package/dist/types/shared/transfer-fee-summary.d.ts +10 -0
- package/dist/types/shared/utils.d.mts +3 -0
- package/dist/types/shared/utils.d.ts +3 -0
- package/dist/types/trading/place-order/index.d.mts +1 -1
- package/dist/types/trading/place-order/index.d.ts +1 -1
- package/dist/types/trading/place-order/index.place-order.execution-steps.d.mts +9 -0
- package/dist/types/trading/place-order/index.place-order.execution-steps.d.ts +9 -0
- package/dist/types/trading/place-order/index.place-order.types.d.mts +15 -2
- package/dist/types/trading/place-order/index.place-order.types.d.ts +15 -2
- package/dist/types/trading/place-order/index.place-order.utils.d.mts +49 -6
- package/dist/types/trading/place-order/index.place-order.utils.d.ts +49 -6
- package/dist/types/withdraw/index.d.mts +1 -1
- package/dist/types/withdraw/index.d.ts +1 -1
- package/dist/types/withdraw/steps/withdraw-success.d.mts +13 -7
- package/dist/types/withdraw/steps/withdraw-success.d.ts +13 -7
- package/dist/types/withdraw/steps/withdraw-success.utils.d.mts +2 -0
- package/dist/types/withdraw/steps/withdraw-success.utils.d.ts +2 -0
- package/dist/types/withdraw/withdraw-modal.types.d.mts +5 -0
- package/dist/types/withdraw/withdraw-modal.types.d.ts +5 -0
- package/package.json +3 -3
|
@@ -22,6 +22,8 @@ import {
|
|
|
22
22
|
Select,
|
|
23
23
|
StayInControlIcon,
|
|
24
24
|
SuccessCheckIcon,
|
|
25
|
+
Tabs,
|
|
26
|
+
Tooltip,
|
|
25
27
|
UsdcIcon,
|
|
26
28
|
VenueLogo,
|
|
27
29
|
WalletIcon,
|
|
@@ -31,15 +33,17 @@ import {
|
|
|
31
33
|
__spreadValues,
|
|
32
34
|
cn,
|
|
33
35
|
formatCompactUsd,
|
|
36
|
+
formatTokenAmount,
|
|
34
37
|
getMotionClassName,
|
|
35
38
|
shortenAddress,
|
|
39
|
+
useOptionalToast,
|
|
36
40
|
venueLogoLabels
|
|
37
|
-
} from "./chunk-
|
|
41
|
+
} from "./chunk-SJLHOAKK.mjs";
|
|
38
42
|
|
|
39
43
|
// src/deposit/index.tsx
|
|
40
|
-
import {
|
|
41
|
-
import { useAggAuthState, useAggUiConfig, useDepositAddresses, useLabels as useLabels10 } from "@agg-build/hooks";
|
|
44
|
+
import { useAggAuthState, useAggUiConfig, useDepositAddresses, useLabels as useLabels11 } from "@agg-build/hooks";
|
|
42
45
|
import { SVM_CHAIN_IDS, useDepositFlow } from "@agg-build/hooks/deposit";
|
|
46
|
+
import { useEffect as useEffect3, useMemo, useRef, useState as useState2 } from "react";
|
|
43
47
|
|
|
44
48
|
// src/shared/constants.ts
|
|
45
49
|
var USDC = {
|
|
@@ -78,6 +82,12 @@ var SUPPORTED_NETWORKS = [
|
|
|
78
82
|
iconUrl: "https://assets.snagsolutions.io/public/prediction-markets/logos/Flow.svg",
|
|
79
83
|
tokens: [USDC]
|
|
80
84
|
},
|
|
85
|
+
{
|
|
86
|
+
value: "hyperliquid",
|
|
87
|
+
label: "Hyperliquid",
|
|
88
|
+
iconUrl: "https://assets.snagsolutions.io/public/prediction-markets/logos/hyperliquid.png",
|
|
89
|
+
tokens: [USDC]
|
|
90
|
+
},
|
|
81
91
|
{
|
|
82
92
|
value: "mainnet",
|
|
83
93
|
label: "Ethereum",
|
|
@@ -116,11 +126,37 @@ var mapNetworksToOptions = () => {
|
|
|
116
126
|
iconUrl: n.iconUrl
|
|
117
127
|
}));
|
|
118
128
|
};
|
|
129
|
+
var USDC_ICON_URL = "https://assets.snagsolutions.io/public/web/icons/usdc.svg";
|
|
119
130
|
var DEFAULT_CURRENCY_OPTIONS = [
|
|
120
131
|
{
|
|
121
132
|
value: "USDC",
|
|
122
133
|
label: "USDC",
|
|
123
|
-
iconUrl:
|
|
134
|
+
iconUrl: USDC_ICON_URL
|
|
135
|
+
},
|
|
136
|
+
{
|
|
137
|
+
value: "USDC.e",
|
|
138
|
+
label: "USDC.e",
|
|
139
|
+
iconUrl: USDC_ICON_URL
|
|
140
|
+
},
|
|
141
|
+
{
|
|
142
|
+
value: "USDH",
|
|
143
|
+
label: "USDH",
|
|
144
|
+
iconUrl: USDC_ICON_URL
|
|
145
|
+
},
|
|
146
|
+
{
|
|
147
|
+
value: "pUSD",
|
|
148
|
+
label: "pUSD",
|
|
149
|
+
iconUrl: USDC_ICON_URL
|
|
150
|
+
},
|
|
151
|
+
{
|
|
152
|
+
value: "USDT",
|
|
153
|
+
label: "USDT",
|
|
154
|
+
iconUrl: "https://assets.snagsolutions.io/public/web/icons/usdt.svg"
|
|
155
|
+
},
|
|
156
|
+
{
|
|
157
|
+
value: "USDT",
|
|
158
|
+
label: "USDT",
|
|
159
|
+
iconUrl: "https://assets.snagsolutions.io/public/web/icons/usdt.svg"
|
|
124
160
|
},
|
|
125
161
|
// Add commonly-used tokens with icons. These can be overridden by props.
|
|
126
162
|
{
|
|
@@ -170,6 +206,7 @@ var CHAIN_ID_TO_SLUG = {
|
|
|
170
206
|
"137": "polygon",
|
|
171
207
|
"324": "zksync",
|
|
172
208
|
"747": "flow",
|
|
209
|
+
"1337": "hyperliquid",
|
|
173
210
|
"8453": "base",
|
|
174
211
|
"42161": "arbitrum",
|
|
175
212
|
"2741": "abstract",
|
|
@@ -236,111 +273,10 @@ var NETWORK_TO_CURRENCY_CODE = {
|
|
|
236
273
|
polygon: "USDC_POLYGON"
|
|
237
274
|
};
|
|
238
275
|
|
|
239
|
-
// src/deposit/steps/deposit-method.tsx
|
|
240
|
-
import { useLabels } from "@agg-build/hooks";
|
|
241
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
242
|
-
var DepositMethodCard = ({
|
|
243
|
-
icon,
|
|
244
|
-
title,
|
|
245
|
-
description,
|
|
246
|
-
value,
|
|
247
|
-
highlighted = false,
|
|
248
|
-
disabled = false,
|
|
249
|
-
onContinue
|
|
250
|
-
}) => /* @__PURE__ */ jsxs(
|
|
251
|
-
"div",
|
|
252
|
-
{
|
|
253
|
-
className: cn(
|
|
254
|
-
"flex items-center gap-3 sm:gap-4",
|
|
255
|
-
"rounded-xl border border-agg-separator",
|
|
256
|
-
"p-3 sm:p-4",
|
|
257
|
-
"transition-colors",
|
|
258
|
-
disabled ? "opacity-50 cursor-not-allowed pointer-events-none" : "cursor-pointer hover:bg-agg-secondary-hover",
|
|
259
|
-
highlighted ? "" : ""
|
|
260
|
-
),
|
|
261
|
-
role: "button",
|
|
262
|
-
tabIndex: disabled ? -1 : 0,
|
|
263
|
-
"aria-disabled": disabled || void 0,
|
|
264
|
-
onClick: disabled ? void 0 : onContinue,
|
|
265
|
-
onKeyDown: disabled ? void 0 : (e) => {
|
|
266
|
-
if (e.key === "Enter" || e.key === " ") {
|
|
267
|
-
e.preventDefault();
|
|
268
|
-
onContinue();
|
|
269
|
-
}
|
|
270
|
-
},
|
|
271
|
-
children: [
|
|
272
|
-
/* @__PURE__ */ jsx("div", { className: "shrink-0 flex items-center justify-center h-10 w-10 rounded-lg bg-agg-secondary-hover", children: icon }),
|
|
273
|
-
/* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
|
|
274
|
-
/* @__PURE__ */ jsx("p", { className: "agg-type-body-strong text-agg-foreground", children: title }),
|
|
275
|
-
/* @__PURE__ */ jsx("p", { className: "agg-type-label text-agg-muted-foreground", children: description })
|
|
276
|
-
] }),
|
|
277
|
-
value ? /* @__PURE__ */ jsx("p", { className: "agg-type-label text-agg-muted-foreground", children: value }) : null,
|
|
278
|
-
/* @__PURE__ */ jsx("div", { className: "shrink-0 text-agg-muted-foreground", children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-5 w-5" }) })
|
|
279
|
-
]
|
|
280
|
-
}
|
|
281
|
-
);
|
|
282
|
-
var DepositMethodStep = ({
|
|
283
|
-
balance,
|
|
284
|
-
walletLabel,
|
|
285
|
-
walletBalance,
|
|
286
|
-
isWalletBalanceLoading = false,
|
|
287
|
-
showWalletMethod = true,
|
|
288
|
-
highlightedMethod,
|
|
289
|
-
depositAddressesReady = true,
|
|
290
|
-
onSelectMethod
|
|
291
|
-
}) => {
|
|
292
|
-
const labels = useLabels();
|
|
293
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
294
|
-
/* @__PURE__ */ jsx(Modal.Header, { title: labels.deposit.title, hideBorder: true }),
|
|
295
|
-
/* @__PURE__ */ jsx(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
|
|
296
|
-
/* @__PURE__ */ jsxs("p", { className: "agg-type-body text-agg-foreground", children: [
|
|
297
|
-
labels.deposit.balancePrefix,
|
|
298
|
-
" ",
|
|
299
|
-
formatCompactUsd(balance)
|
|
300
|
-
] }),
|
|
301
|
-
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
|
|
302
|
-
showWalletMethod ? /* @__PURE__ */ jsx(
|
|
303
|
-
DepositMethodCard,
|
|
304
|
-
{
|
|
305
|
-
icon: /* @__PURE__ */ jsx(WalletIcon, { className: "h-6 w-6 text-agg-muted-foreground" }),
|
|
306
|
-
title: labels.deposit.methods.walletTitle(walletLabel),
|
|
307
|
-
description: labels.deposit.methods.walletDescription,
|
|
308
|
-
value: isWalletBalanceLoading ? /* @__PURE__ */ jsx(LoadingIcon, { size: "small" }) : formatCompactUsd(walletBalance),
|
|
309
|
-
highlighted: highlightedMethod === "wallet",
|
|
310
|
-
disabled: !depositAddressesReady,
|
|
311
|
-
onContinue: () => onSelectMethod("wallet")
|
|
312
|
-
}
|
|
313
|
-
) : null,
|
|
314
|
-
/* @__PURE__ */ jsx(
|
|
315
|
-
DepositMethodCard,
|
|
316
|
-
{
|
|
317
|
-
icon: /* @__PURE__ */ jsx(BoltIcon, { className: "h-6 w-6 text-agg-muted-foreground" }),
|
|
318
|
-
title: labels.deposit.methods.cryptoTitle,
|
|
319
|
-
description: labels.deposit.methods.cryptoDescription,
|
|
320
|
-
highlighted: highlightedMethod === "crypto",
|
|
321
|
-
disabled: !depositAddressesReady,
|
|
322
|
-
onContinue: () => onSelectMethod("crypto")
|
|
323
|
-
}
|
|
324
|
-
),
|
|
325
|
-
/* @__PURE__ */ jsx(
|
|
326
|
-
DepositMethodCard,
|
|
327
|
-
{
|
|
328
|
-
icon: /* @__PURE__ */ jsx(CreditCardIcon, { className: "h-6 w-6 text-agg-muted-foreground" }),
|
|
329
|
-
title: labels.deposit.methods.cardTitle,
|
|
330
|
-
description: labels.deposit.methods.cardDescription,
|
|
331
|
-
highlighted: highlightedMethod === "card",
|
|
332
|
-
onContinue: () => onSelectMethod("card")
|
|
333
|
-
}
|
|
334
|
-
)
|
|
335
|
-
] })
|
|
336
|
-
] }) })
|
|
337
|
-
] });
|
|
338
|
-
};
|
|
339
|
-
|
|
340
276
|
// src/deposit/steps/card-deposit.tsx
|
|
341
|
-
import { useLabels
|
|
277
|
+
import { useLabels } from "@agg-build/hooks";
|
|
342
278
|
import { useEffect, useState } from "react";
|
|
343
|
-
import { Fragment
|
|
279
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
344
280
|
var CardDepositStep = ({
|
|
345
281
|
amount,
|
|
346
282
|
currency,
|
|
@@ -356,7 +292,7 @@ var CardDepositStep = ({
|
|
|
356
292
|
onNetworkChange,
|
|
357
293
|
onContinue
|
|
358
294
|
}) => {
|
|
359
|
-
const labels =
|
|
295
|
+
const labels = useLabels();
|
|
360
296
|
const [localAmount, setLocalAmount] = useState(amount);
|
|
361
297
|
useEffect(() => {
|
|
362
298
|
setLocalAmount(amount);
|
|
@@ -366,33 +302,33 @@ var CardDepositStep = ({
|
|
|
366
302
|
const isBelowMin = minAmount != null && hasInput && numericAmount < minAmount;
|
|
367
303
|
const isValid = numericAmount > 0 && !isBelowMin;
|
|
368
304
|
const formattedMin = minAmount != null ? `$${minAmount}` : void 0;
|
|
369
|
-
return /* @__PURE__ */
|
|
370
|
-
/* @__PURE__ */
|
|
305
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
306
|
+
/* @__PURE__ */ jsx(
|
|
371
307
|
Modal.Header,
|
|
372
308
|
{
|
|
373
309
|
title: labels.deposit.cardFlow.title,
|
|
374
310
|
hideBorder: true,
|
|
375
|
-
leftElement: /* @__PURE__ */
|
|
311
|
+
leftElement: /* @__PURE__ */ jsx(
|
|
376
312
|
"button",
|
|
377
313
|
{
|
|
378
314
|
type: "button",
|
|
379
315
|
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
380
316
|
onClick: onBack,
|
|
381
317
|
"aria-label": "Go back",
|
|
382
|
-
children: /* @__PURE__ */
|
|
318
|
+
children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
383
319
|
}
|
|
384
320
|
)
|
|
385
321
|
}
|
|
386
322
|
),
|
|
387
|
-
/* @__PURE__ */
|
|
388
|
-
/* @__PURE__ */
|
|
389
|
-
/* @__PURE__ */
|
|
390
|
-
/* @__PURE__ */
|
|
391
|
-
/* @__PURE__ */
|
|
392
|
-
formattedMin ? /* @__PURE__ */
|
|
323
|
+
/* @__PURE__ */ jsx(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
|
|
324
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
|
|
325
|
+
/* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col gap-2", children: [
|
|
326
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
|
|
327
|
+
/* @__PURE__ */ jsx("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.cardFlow.amountLabel }),
|
|
328
|
+
formattedMin ? /* @__PURE__ */ jsx("p", { className: "agg-type-label text-agg-foreground", children: labels.deposit.cardFlow.minRequired(formattedMin) }) : null
|
|
393
329
|
] }),
|
|
394
|
-
/* @__PURE__ */
|
|
395
|
-
/* @__PURE__ */
|
|
330
|
+
/* @__PURE__ */ jsxs("div", { className: "flex gap-3 items-center", children: [
|
|
331
|
+
/* @__PURE__ */ jsxs(
|
|
396
332
|
"div",
|
|
397
333
|
{
|
|
398
334
|
className: cn(
|
|
@@ -400,7 +336,7 @@ var CardDepositStep = ({
|
|
|
400
336
|
isBelowMin ? "border-agg-primary border-2" : "border-agg-separator"
|
|
401
337
|
),
|
|
402
338
|
children: [
|
|
403
|
-
/* @__PURE__ */
|
|
339
|
+
/* @__PURE__ */ jsx(
|
|
404
340
|
"input",
|
|
405
341
|
{
|
|
406
342
|
type: "text",
|
|
@@ -416,11 +352,11 @@ var CardDepositStep = ({
|
|
|
416
352
|
}
|
|
417
353
|
}
|
|
418
354
|
),
|
|
419
|
-
/* @__PURE__ */
|
|
355
|
+
/* @__PURE__ */ jsx("span", { className: "agg-type-body text-agg-muted-foreground", children: "$" })
|
|
420
356
|
]
|
|
421
357
|
}
|
|
422
358
|
),
|
|
423
|
-
/* @__PURE__ */
|
|
359
|
+
/* @__PURE__ */ jsx("div", { className: "w-[100px]", children: /* @__PURE__ */ jsx(
|
|
424
360
|
Select,
|
|
425
361
|
{
|
|
426
362
|
items: [{ value: currency, label: currency }],
|
|
@@ -432,8 +368,8 @@ var CardDepositStep = ({
|
|
|
432
368
|
) })
|
|
433
369
|
] })
|
|
434
370
|
] }),
|
|
435
|
-
isBelowMin && formattedMin ? /* @__PURE__ */
|
|
436
|
-
/* @__PURE__ */
|
|
371
|
+
isBelowMin && formattedMin ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", role: "alert", "aria-live": "assertive", children: [
|
|
372
|
+
/* @__PURE__ */ jsx(
|
|
437
373
|
Icon,
|
|
438
374
|
{
|
|
439
375
|
name: "warning",
|
|
@@ -441,12 +377,12 @@ var CardDepositStep = ({
|
|
|
441
377
|
"aria-hidden": "true"
|
|
442
378
|
}
|
|
443
379
|
),
|
|
444
|
-
/* @__PURE__ */
|
|
380
|
+
/* @__PURE__ */ jsx("p", { className: "agg-type-label text-agg-error", children: labels.deposit.cardFlow.minAmountError(formattedMin) })
|
|
445
381
|
] }) : null
|
|
446
382
|
] }),
|
|
447
|
-
/* @__PURE__ */
|
|
448
|
-
/* @__PURE__ */
|
|
449
|
-
/* @__PURE__ */
|
|
383
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
|
|
384
|
+
/* @__PURE__ */ jsx("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.cardFlow.networkLabel }),
|
|
385
|
+
/* @__PURE__ */ jsx(
|
|
450
386
|
Select,
|
|
451
387
|
{
|
|
452
388
|
items: networkOptions,
|
|
@@ -457,7 +393,7 @@ var CardDepositStep = ({
|
|
|
457
393
|
}
|
|
458
394
|
)
|
|
459
395
|
] }),
|
|
460
|
-
/* @__PURE__ */
|
|
396
|
+
/* @__PURE__ */ jsx(
|
|
461
397
|
Button,
|
|
462
398
|
{
|
|
463
399
|
variant: "secondary",
|
|
@@ -472,358 +408,81 @@ var CardDepositStep = ({
|
|
|
472
408
|
] });
|
|
473
409
|
};
|
|
474
410
|
|
|
475
|
-
// src/deposit/steps/
|
|
476
|
-
import { useLabels as
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
networkLogo,
|
|
485
|
-
size = 160
|
|
486
|
-
}) {
|
|
487
|
-
const logoOverlay = networkLogo ? /* @__PURE__ */ jsx3(
|
|
488
|
-
"div",
|
|
489
|
-
{
|
|
490
|
-
className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-sm",
|
|
491
|
-
style: { width: 32, height: 32, backgroundColor: "#FFFFFF", padding: 2 },
|
|
492
|
-
children: networkLogo
|
|
493
|
-
}
|
|
494
|
-
) : networkLogoUrl ? /* @__PURE__ */ jsx3(
|
|
495
|
-
"img",
|
|
496
|
-
{
|
|
497
|
-
src: networkLogoUrl,
|
|
498
|
-
alt: "",
|
|
499
|
-
className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-sm",
|
|
500
|
-
width: 32,
|
|
501
|
-
height: 32,
|
|
502
|
-
style: { backgroundColor: "#FFFFFF", padding: 2 }
|
|
503
|
-
}
|
|
504
|
-
) : null;
|
|
505
|
-
return /* @__PURE__ */ jsx3(
|
|
506
|
-
"div",
|
|
507
|
-
{
|
|
508
|
-
className: "inline-flex items-center justify-center rounded-xl border",
|
|
509
|
-
style: {
|
|
510
|
-
padding: 16,
|
|
511
|
-
borderColor: "#E5E7EB",
|
|
512
|
-
backgroundColor: "#FFFFFF"
|
|
513
|
-
},
|
|
514
|
-
children: /* @__PURE__ */ jsxs3("div", { className: "relative", style: { width: size, height: size }, children: [
|
|
515
|
-
/* @__PURE__ */ jsx3(QRCodeSVG, { value: depositAddress, size, level: "H" }),
|
|
516
|
-
logoOverlay
|
|
517
|
-
] })
|
|
518
|
-
}
|
|
519
|
-
);
|
|
520
|
-
}
|
|
521
|
-
DepositQRCode.displayName = "DepositQRCode";
|
|
522
|
-
|
|
523
|
-
// src/deposit/steps/crypto-transfer.tsx
|
|
524
|
-
import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
525
|
-
var CryptoAddressLoadingState = () => {
|
|
526
|
-
const labels = useLabels3();
|
|
527
|
-
const sendCryptoLabels = labels.deposit.sendCrypto;
|
|
528
|
-
return /* @__PURE__ */ jsxs4(
|
|
529
|
-
"div",
|
|
530
|
-
{
|
|
531
|
-
className: "flex w-full flex-col items-center justify-center gap-6 py-10 text-center text-agg-foreground",
|
|
532
|
-
role: "status",
|
|
533
|
-
"aria-live": "polite",
|
|
534
|
-
children: [
|
|
535
|
-
/* @__PURE__ */ jsx4(
|
|
536
|
-
"span",
|
|
537
|
-
{
|
|
538
|
-
className: "h-9 w-9 animate-spin rounded-full border-2 border-agg-primary/25 border-t-agg-primary",
|
|
539
|
-
"aria-hidden": "true"
|
|
540
|
-
}
|
|
541
|
-
),
|
|
542
|
-
/* @__PURE__ */ jsxs4("div", { className: "flex w-full flex-col items-center gap-2", children: [
|
|
543
|
-
/* @__PURE__ */ jsx4("p", { className: "text-agg-base font-agg-bold leading-agg-6", children: sendCryptoLabels.addressLoadingTitle }),
|
|
544
|
-
/* @__PURE__ */ jsx4("p", { className: "max-w-[300px] text-agg-sm leading-agg-5", children: sendCryptoLabels.addressLoadingDescription })
|
|
545
|
-
] })
|
|
546
|
-
]
|
|
547
|
-
}
|
|
548
|
-
);
|
|
549
|
-
};
|
|
550
|
-
var CryptoTransferStep = ({
|
|
551
|
-
tokenOptions,
|
|
552
|
-
networkOptions,
|
|
553
|
-
selectedToken,
|
|
554
|
-
selectedNetwork,
|
|
555
|
-
depositAddress,
|
|
556
|
-
minDeposit,
|
|
557
|
-
feeEstimate,
|
|
558
|
-
eta,
|
|
559
|
-
isLoadingAddress,
|
|
560
|
-
addressError,
|
|
561
|
-
onBack,
|
|
562
|
-
onTokenChange,
|
|
563
|
-
onNetworkChange,
|
|
564
|
-
onCopyAddress,
|
|
565
|
-
onDone
|
|
411
|
+
// src/deposit/steps/card-payment-pending.tsx
|
|
412
|
+
import { useLabels as useLabels2 } from "@agg-build/hooks";
|
|
413
|
+
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
414
|
+
var CardPaymentPendingStep = ({
|
|
415
|
+
providerName,
|
|
416
|
+
walletAddress,
|
|
417
|
+
onClose,
|
|
418
|
+
onViewActivity,
|
|
419
|
+
onChooseAnotherProvider
|
|
566
420
|
}) => {
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
const networkLogo = selectedNetworkOption == null ? void 0 : selectedNetworkOption.icon;
|
|
572
|
-
return /* @__PURE__ */ jsxs4(Fragment3, { children: [
|
|
573
|
-
/* @__PURE__ */ jsx4(
|
|
574
|
-
Modal.Header,
|
|
421
|
+
const labels = useLabels2();
|
|
422
|
+
return /* @__PURE__ */ jsx2("div", { className: "relative", children: /* @__PURE__ */ jsxs2(Modal.Body, { classNames: { root: "px-5 py-8 sm:px-8 sm:py-10" }, children: [
|
|
423
|
+
/* @__PURE__ */ jsx2(
|
|
424
|
+
"button",
|
|
575
425
|
{
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
type: "button",
|
|
582
|
-
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
583
|
-
onClick: onBack,
|
|
584
|
-
"aria-label": "Go back",
|
|
585
|
-
children: /* @__PURE__ */ jsx4(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
586
|
-
}
|
|
587
|
-
)
|
|
426
|
+
type: "button",
|
|
427
|
+
className: "absolute right-8 top-7 flex items-center justify-center text-agg-foreground transition-colors cursor-pointer hover:text-agg-foreground/80",
|
|
428
|
+
onClick: onClose,
|
|
429
|
+
"aria-label": labels.common.close,
|
|
430
|
+
children: /* @__PURE__ */ jsx2(CloseIcon, { className: "h-6 w-6" })
|
|
588
431
|
}
|
|
589
432
|
),
|
|
590
|
-
/* @__PURE__ */
|
|
591
|
-
/* @__PURE__ */
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
)
|
|
603
|
-
] }),
|
|
604
|
-
/* @__PURE__ */ jsxs4("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
605
|
-
/* @__PURE__ */ jsx4("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.sendCrypto.networkLabel }),
|
|
606
|
-
/* @__PURE__ */ jsx4(
|
|
607
|
-
Select,
|
|
433
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex flex-col items-center gap-8", children: [
|
|
434
|
+
/* @__PURE__ */ jsx2("div", { className: "flex h-[60px] w-[60px] items-center justify-center text-agg-muted-foreground", children: /* @__PURE__ */ jsx2(ExternalLinkIcon, { className: "h-[60px] w-[60px]" }) }),
|
|
435
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex flex-col items-center gap-3 text-center", children: [
|
|
436
|
+
/* @__PURE__ */ jsx2("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold text-agg-foreground", children: labels.deposit.cardFlow.pendingTitle(providerName) }),
|
|
437
|
+
/* @__PURE__ */ jsx2("p", { className: "agg-type-body text-agg-foreground", children: labels.deposit.cardFlow.pendingDescription })
|
|
438
|
+
] }),
|
|
439
|
+
walletAddress ? /* @__PURE__ */ jsxs2("div", { className: "flex w-full flex-col items-center gap-3 rounded-agg-md bg-agg-secondary-hover p-5", children: [
|
|
440
|
+
/* @__PURE__ */ jsx2("p", { className: "agg-type-label text-agg-foreground w-full", children: labels.deposit.cardFlow.pendingWalletAddressHelp }),
|
|
441
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex w-full h-10 items-center gap-2 rounded border border-agg-separator bg-agg-secondary px-3 py-[10px]", children: [
|
|
442
|
+
/* @__PURE__ */ jsx2("p", { className: "agg-type-body flex-1 min-w-0 truncate text-agg-foreground", children: walletAddress }),
|
|
443
|
+
/* @__PURE__ */ jsx2(
|
|
444
|
+
CopyButton,
|
|
608
445
|
{
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
ariaLabel: labels.deposit.sendCrypto.networkLabel
|
|
446
|
+
value: walletAddress,
|
|
447
|
+
"aria-label": labels.deposit.cardFlow.pendingCopyAddress,
|
|
448
|
+
className: "text-agg-muted-foreground hover:text-agg-foreground"
|
|
613
449
|
}
|
|
614
450
|
)
|
|
615
451
|
] })
|
|
616
|
-
] })
|
|
617
|
-
/* @__PURE__ */
|
|
618
|
-
|
|
452
|
+
] }) : null,
|
|
453
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex items-start justify-center gap-3", children: [
|
|
454
|
+
/* @__PURE__ */ jsx2(Button, { variant: "secondary", size: "large", className: "w-[120px]", onClick: onClose, children: labels.common.close }),
|
|
455
|
+
/* @__PURE__ */ jsx2(Button, { variant: "primary", size: "large", onClick: onViewActivity, children: labels.deposit.cardFlow.viewActivity })
|
|
456
|
+
] }),
|
|
457
|
+
/* @__PURE__ */ jsx2(
|
|
458
|
+
"button",
|
|
619
459
|
{
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
) }),
|
|
625
|
-
/* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-3", children: [
|
|
626
|
-
/* @__PURE__ */ jsx4("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.sendCrypto.depositAddressLabel }),
|
|
627
|
-
/* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2 rounded border border-agg-separator bg-agg-secondary h-10 px-3", children: [
|
|
628
|
-
isLoadingAddress ? /* @__PURE__ */ jsx4("div", { className: "h-4 flex-1 animate-pulse rounded bg-agg-muted-foreground/20" }) : /* @__PURE__ */ jsx4("p", { className: "agg-type-body flex-1 min-w-0 truncate text-agg-foreground", children: depositAddress }),
|
|
629
|
-
/* @__PURE__ */ jsx4(
|
|
630
|
-
CopyButton,
|
|
631
|
-
{
|
|
632
|
-
value: depositAddress,
|
|
633
|
-
label: labels.deposit.sendCrypto.copy,
|
|
634
|
-
copiedLabel: labels.deposit.sendCrypto.copied,
|
|
635
|
-
disabled: isLoadingAddress || !!addressError || !depositAddress,
|
|
636
|
-
onCopy: onCopyAddress,
|
|
637
|
-
className: "text-agg-primary hover:text-agg-primary/80"
|
|
638
|
-
}
|
|
639
|
-
)
|
|
640
|
-
] }),
|
|
641
|
-
/* @__PURE__ */ jsx4("p", { className: "agg-type-label text-agg-foreground", children: `${labels.deposit.sendCrypto.minDepositPrefix} ${minDeposit} \xB7 ${labels.deposit.walletFlow.feePrefix} ${feeEstimate} \xB7 ${eta}` })
|
|
642
|
-
] }),
|
|
643
|
-
/* @__PURE__ */ jsxs4("div", { className: "flex items-start gap-3 rounded-lg bg-agg-secondary-hover p-3", children: [
|
|
644
|
-
/* @__PURE__ */ jsx4(WarningIcon, { className: "h-4 w-4 text-agg-muted-foreground mt-0.5" }),
|
|
645
|
-
/* @__PURE__ */ jsx4("p", { className: "text-agg-xs leading-agg-4 text-agg-foreground", children: labels.deposit.sendCrypto.warning })
|
|
646
|
-
] }),
|
|
647
|
-
/* @__PURE__ */ jsx4(
|
|
648
|
-
Button,
|
|
649
|
-
{
|
|
650
|
-
variant: "secondary",
|
|
651
|
-
size: "large",
|
|
652
|
-
className: "w-[120px] self-center",
|
|
653
|
-
onClick: onDone,
|
|
654
|
-
children: labels.deposit.done
|
|
655
|
-
}
|
|
656
|
-
)
|
|
657
|
-
] }) })
|
|
658
|
-
] });
|
|
659
|
-
};
|
|
660
|
-
|
|
661
|
-
// src/deposit/steps/wallet-form.tsx
|
|
662
|
-
import { useLabels as useLabels4 } from "@agg-build/hooks";
|
|
663
|
-
import { Fragment as Fragment4, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
664
|
-
var WalletFormStep = ({
|
|
665
|
-
walletLabel,
|
|
666
|
-
walletBalance,
|
|
667
|
-
isBalanceLoading = false,
|
|
668
|
-
tokenOptions,
|
|
669
|
-
networkOptions,
|
|
670
|
-
selectedToken,
|
|
671
|
-
selectedNetwork,
|
|
672
|
-
amount,
|
|
673
|
-
isSubmitting = false,
|
|
674
|
-
formErrorMessage,
|
|
675
|
-
formErrorTone = "error",
|
|
676
|
-
estimatedReceive,
|
|
677
|
-
feeEstimate,
|
|
678
|
-
eta,
|
|
679
|
-
onBack,
|
|
680
|
-
onTokenChange,
|
|
681
|
-
onNetworkChange,
|
|
682
|
-
onAmountChange,
|
|
683
|
-
onMax,
|
|
684
|
-
onConfirm
|
|
685
|
-
}) => {
|
|
686
|
-
const labels = useLabels4();
|
|
687
|
-
const isConfirmEnabled = !isSubmitting && !isBalanceLoading && Number(amount) > 0 && Number(amount) <= walletBalance;
|
|
688
|
-
return /* @__PURE__ */ jsxs5(Fragment4, { children: [
|
|
689
|
-
/* @__PURE__ */ jsx5(
|
|
690
|
-
Modal.Header,
|
|
691
|
-
{
|
|
692
|
-
title: labels.deposit.walletFlow.title,
|
|
693
|
-
hideBorder: true,
|
|
694
|
-
leftElement: /* @__PURE__ */ jsx5(
|
|
695
|
-
"button",
|
|
696
|
-
{
|
|
697
|
-
type: "button",
|
|
698
|
-
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
699
|
-
onClick: onBack,
|
|
700
|
-
"aria-label": "Go back",
|
|
701
|
-
children: /* @__PURE__ */ jsx5(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
702
|
-
}
|
|
703
|
-
)
|
|
704
|
-
}
|
|
705
|
-
),
|
|
706
|
-
/* @__PURE__ */ jsx5(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-7", children: [
|
|
707
|
-
/* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between", children: [
|
|
708
|
-
/* @__PURE__ */ jsx5("p", { className: "agg-type-label text-agg-foreground", children: walletLabel }),
|
|
709
|
-
/* @__PURE__ */ jsxs5("p", { className: "agg-type-label text-agg-muted-foreground", children: [
|
|
710
|
-
labels.deposit.balanceLabel,
|
|
711
|
-
" ",
|
|
712
|
-
isBalanceLoading ? /* @__PURE__ */ jsx5(LoadingIcon, { size: "small" }) : formatCompactUsd(walletBalance)
|
|
713
|
-
] })
|
|
714
|
-
] }),
|
|
715
|
-
/* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-5", children: [
|
|
716
|
-
/* @__PURE__ */ jsxs5("div", { className: "flex gap-5", children: [
|
|
717
|
-
/* @__PURE__ */ jsxs5("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
718
|
-
/* @__PURE__ */ jsx5("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.walletFlow.tokenLabel }),
|
|
719
|
-
/* @__PURE__ */ jsx5(
|
|
720
|
-
Select,
|
|
721
|
-
{
|
|
722
|
-
items: tokenOptions,
|
|
723
|
-
value: selectedToken,
|
|
724
|
-
onChange: onTokenChange,
|
|
725
|
-
ariaLabel: labels.deposit.walletFlow.tokenLabel
|
|
726
|
-
}
|
|
727
|
-
)
|
|
728
|
-
] }),
|
|
729
|
-
networkOptions.length > 1 ? /* @__PURE__ */ jsxs5("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
730
|
-
/* @__PURE__ */ jsx5("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.walletFlow.networkLabel }),
|
|
731
|
-
/* @__PURE__ */ jsx5(
|
|
732
|
-
Select,
|
|
733
|
-
{
|
|
734
|
-
items: networkOptions,
|
|
735
|
-
value: selectedNetwork,
|
|
736
|
-
onChange: onNetworkChange,
|
|
737
|
-
ariaLabel: labels.deposit.walletFlow.networkLabel
|
|
738
|
-
}
|
|
739
|
-
)
|
|
740
|
-
] }) : null
|
|
741
|
-
] }),
|
|
742
|
-
/* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
|
|
743
|
-
/* @__PURE__ */ jsx5("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.walletFlow.amountLabel }),
|
|
744
|
-
/* @__PURE__ */ jsxs5(
|
|
745
|
-
"div",
|
|
746
|
-
{
|
|
747
|
-
className: cn(
|
|
748
|
-
"flex items-center gap-2",
|
|
749
|
-
"rounded border border-agg-separator bg-agg-secondary",
|
|
750
|
-
"h-10 px-3"
|
|
751
|
-
),
|
|
752
|
-
children: [
|
|
753
|
-
/* @__PURE__ */ jsx5(
|
|
754
|
-
"input",
|
|
755
|
-
{
|
|
756
|
-
type: "text",
|
|
757
|
-
inputMode: "decimal",
|
|
758
|
-
"aria-label": labels.deposit.walletFlow.amountLabel,
|
|
759
|
-
className: "agg-type-body w-full bg-transparent outline-none text-agg-foreground",
|
|
760
|
-
placeholder: "0.00",
|
|
761
|
-
value: amount,
|
|
762
|
-
onChange: (event) => onAmountChange(event.target.value)
|
|
763
|
-
}
|
|
764
|
-
),
|
|
765
|
-
/* @__PURE__ */ jsx5(
|
|
766
|
-
"button",
|
|
767
|
-
{
|
|
768
|
-
type: "button",
|
|
769
|
-
className: "shrink-0 text-agg-sm font-agg-bold leading-agg-5 text-agg-primary transition-colors hover:text-agg-primary/80 cursor-pointer",
|
|
770
|
-
onClick: onMax,
|
|
771
|
-
"aria-label": labels.deposit.walletFlow.max,
|
|
772
|
-
children: labels.deposit.walletFlow.max
|
|
773
|
-
}
|
|
774
|
-
)
|
|
775
|
-
]
|
|
776
|
-
}
|
|
777
|
-
)
|
|
778
|
-
] }),
|
|
779
|
-
estimatedReceive && feeEstimate && eta ? /* @__PURE__ */ jsx5("p", { className: "agg-type-label text-agg-foreground", children: `\u2248 ${estimatedReceive} \xB7 ${labels.deposit.walletFlow.feePrefix} ${feeEstimate} \xB7 ${eta}` }) : null,
|
|
780
|
-
formErrorMessage ? /* @__PURE__ */ jsxs5(
|
|
781
|
-
"div",
|
|
782
|
-
{
|
|
783
|
-
className: cn(
|
|
784
|
-
"flex items-start gap-2",
|
|
785
|
-
formErrorTone === "warning" ? "text-agg-warning" : "text-agg-error"
|
|
786
|
-
),
|
|
787
|
-
children: [
|
|
788
|
-
/* @__PURE__ */ jsx5(WarningIcon, { className: "mt-0.5 h-4 w-4 shrink-0" }),
|
|
789
|
-
/* @__PURE__ */ jsx5("p", { className: "agg-type-label", children: formErrorMessage })
|
|
790
|
-
]
|
|
791
|
-
}
|
|
792
|
-
) : null
|
|
793
|
-
] }),
|
|
794
|
-
/* @__PURE__ */ jsx5(
|
|
795
|
-
Button,
|
|
796
|
-
{
|
|
797
|
-
variant: isConfirmEnabled ? "primary" : "secondary",
|
|
798
|
-
size: "large",
|
|
799
|
-
className: "w-full",
|
|
800
|
-
disabled: !isConfirmEnabled,
|
|
801
|
-
isLoading: isSubmitting,
|
|
802
|
-
"aria-label": labels.deposit.walletFlow.confirm,
|
|
803
|
-
onClick: onConfirm,
|
|
804
|
-
children: labels.deposit.walletFlow.confirm
|
|
460
|
+
type: "button",
|
|
461
|
+
className: "agg-type-body font-agg-bold text-agg-primary transition-colors cursor-pointer hover:text-agg-primary/80",
|
|
462
|
+
onClick: onChooseAnotherProvider,
|
|
463
|
+
children: labels.deposit.cardFlow.chooseAnotherProvider
|
|
805
464
|
}
|
|
806
465
|
)
|
|
807
|
-
] })
|
|
808
|
-
] });
|
|
466
|
+
] })
|
|
467
|
+
] }) });
|
|
809
468
|
};
|
|
810
469
|
|
|
811
470
|
// src/deposit/steps/card-provider.tsx
|
|
812
|
-
import { useLabels as
|
|
813
|
-
import { Fragment as
|
|
471
|
+
import { useLabels as useLabels3 } from "@agg-build/hooks";
|
|
472
|
+
import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
814
473
|
var CardProviderItem = ({ provider, onSelect }) => {
|
|
815
|
-
const labels =
|
|
474
|
+
const labels = useLabels3();
|
|
816
475
|
const badgeText = provider.badge === "best" ? labels.deposit.cardFlow.providerBadges.best : provider.badge === "low-kyc" ? labels.deposit.cardFlow.providerBadges.lowKyc : void 0;
|
|
817
|
-
return /* @__PURE__ */
|
|
476
|
+
return /* @__PURE__ */ jsx3(
|
|
818
477
|
"button",
|
|
819
478
|
{
|
|
820
479
|
type: "button",
|
|
821
480
|
className: "w-full rounded-xl border border-agg-separator px-4 py-3 text-left bg-agg-secondary hover:bg-agg-secondary-hover transition-colors cursor-pointer",
|
|
822
481
|
onClick: () => onSelect(provider.id),
|
|
823
|
-
children: /* @__PURE__ */
|
|
824
|
-
/* @__PURE__ */
|
|
825
|
-
/* @__PURE__ */
|
|
826
|
-
badgeText ? /* @__PURE__ */
|
|
482
|
+
children: /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between gap-4", children: [
|
|
483
|
+
/* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
|
|
484
|
+
/* @__PURE__ */ jsx3("p", { className: "text-agg-base leading-agg-6 font-agg-bold text-agg-foreground", children: provider.name }),
|
|
485
|
+
badgeText ? /* @__PURE__ */ jsx3(
|
|
827
486
|
"span",
|
|
828
487
|
{
|
|
829
488
|
className: `rounded border px-2 py-[2px] text-[10px] leading-[14px] font-agg-bold uppercase ${provider.badge === "best" ? "border-agg-primary/50 text-agg-primary bg-agg-secondary" : "border-agg-separator text-agg-foreground bg-agg-secondary"}`,
|
|
@@ -831,16 +490,16 @@ var CardProviderItem = ({ provider, onSelect }) => {
|
|
|
831
490
|
}
|
|
832
491
|
) : null
|
|
833
492
|
] }),
|
|
834
|
-
/* @__PURE__ */
|
|
835
|
-
/* @__PURE__ */
|
|
836
|
-
/* @__PURE__ */
|
|
837
|
-
/* @__PURE__ */
|
|
493
|
+
/* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-4", children: [
|
|
494
|
+
/* @__PURE__ */ jsxs3("div", { className: "text-right", children: [
|
|
495
|
+
/* @__PURE__ */ jsx3("p", { className: "agg-type-body text-agg-foreground", children: provider.quote }),
|
|
496
|
+
/* @__PURE__ */ jsxs3("p", { className: "agg-type-label text-agg-muted-foreground", children: [
|
|
838
497
|
labels.deposit.cardFlow.feeLabel,
|
|
839
498
|
" ",
|
|
840
499
|
provider.fee
|
|
841
500
|
] })
|
|
842
501
|
] }),
|
|
843
|
-
/* @__PURE__ */
|
|
502
|
+
/* @__PURE__ */ jsx3(ChevronRightIcon, { className: "h-5 w-5 text-agg-muted-foreground" })
|
|
844
503
|
] })
|
|
845
504
|
] })
|
|
846
505
|
}
|
|
@@ -858,41 +517,41 @@ var CardProviderStep = ({
|
|
|
858
517
|
onSelectProvider,
|
|
859
518
|
onRetry
|
|
860
519
|
}) => {
|
|
861
|
-
const labels =
|
|
862
|
-
return /* @__PURE__ */
|
|
863
|
-
/* @__PURE__ */
|
|
520
|
+
const labels = useLabels3();
|
|
521
|
+
return /* @__PURE__ */ jsxs3(Fragment2, { children: [
|
|
522
|
+
/* @__PURE__ */ jsx3(
|
|
864
523
|
Modal.Header,
|
|
865
524
|
{
|
|
866
525
|
title: labels.deposit.cardFlow.selectProviderTitle,
|
|
867
526
|
hideBorder: true,
|
|
868
|
-
leftElement: /* @__PURE__ */
|
|
527
|
+
leftElement: /* @__PURE__ */ jsx3(
|
|
869
528
|
"button",
|
|
870
529
|
{
|
|
871
530
|
type: "button",
|
|
872
531
|
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
873
532
|
onClick: onBack,
|
|
874
533
|
"aria-label": labels.deposit.back,
|
|
875
|
-
children: /* @__PURE__ */
|
|
534
|
+
children: /* @__PURE__ */ jsx3(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
876
535
|
}
|
|
877
536
|
)
|
|
878
537
|
}
|
|
879
538
|
),
|
|
880
|
-
/* @__PURE__ */
|
|
881
|
-
/* @__PURE__ */
|
|
882
|
-
/* @__PURE__ */
|
|
883
|
-
/* @__PURE__ */
|
|
884
|
-
/* @__PURE__ */
|
|
539
|
+
/* @__PURE__ */ jsx3(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-4", children: [
|
|
540
|
+
/* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-1.5", children: [
|
|
541
|
+
/* @__PURE__ */ jsx3(UsdcIcon, { className: "h-4 w-4 shrink-0" }),
|
|
542
|
+
/* @__PURE__ */ jsx3("span", { className: "agg-type-body font-agg-bold text-agg-foreground", children: token }),
|
|
543
|
+
/* @__PURE__ */ jsxs3("span", { className: "agg-type-body text-agg-foreground", children: [
|
|
885
544
|
"$",
|
|
886
545
|
amount,
|
|
887
546
|
" ",
|
|
888
547
|
currency
|
|
889
548
|
] })
|
|
890
549
|
] }),
|
|
891
|
-
isLoading ? /* @__PURE__ */
|
|
892
|
-
/* @__PURE__ */
|
|
893
|
-
/* @__PURE__ */
|
|
894
|
-
] }) : error ? /* @__PURE__ */
|
|
895
|
-
/* @__PURE__ */
|
|
550
|
+
isLoading ? /* @__PURE__ */ jsxs3("div", { className: "flex min-h-[200px] flex-col items-center justify-center gap-3", children: [
|
|
551
|
+
/* @__PURE__ */ jsx3(LoadingIcon, { variant: "prominent" }),
|
|
552
|
+
/* @__PURE__ */ jsx3("p", { className: "agg-type-body text-agg-foreground", children: labels.deposit.cardFlow.loadingQuotes })
|
|
553
|
+
] }) : error ? /* @__PURE__ */ jsxs3("div", { className: "flex min-h-[200px] flex-col items-center justify-center gap-6 px-2 text-center", children: [
|
|
554
|
+
/* @__PURE__ */ jsx3(
|
|
896
555
|
Icon,
|
|
897
556
|
{
|
|
898
557
|
name: "quotes-warning",
|
|
@@ -901,13 +560,13 @@ var CardProviderStep = ({
|
|
|
901
560
|
color: "currentColor"
|
|
902
561
|
}
|
|
903
562
|
),
|
|
904
|
-
/* @__PURE__ */
|
|
905
|
-
/* @__PURE__ */
|
|
906
|
-
/* @__PURE__ */
|
|
563
|
+
/* @__PURE__ */ jsxs3("div", { className: "flex max-w-[320px] flex-col gap-2", children: [
|
|
564
|
+
/* @__PURE__ */ jsx3("p", { className: "text-agg-base leading-agg-6 font-agg-bold text-agg-foreground", children: labels.deposit.cardFlow.errorLoadingQuotesTitle }),
|
|
565
|
+
/* @__PURE__ */ jsx3("p", { className: "agg-type-body text-agg-muted-foreground", children: labels.deposit.cardFlow.errorLoadingQuotesDescription })
|
|
907
566
|
] }),
|
|
908
|
-
onRetry ? /* @__PURE__ */
|
|
909
|
-
] }) : providers.length === 0 ? /* @__PURE__ */
|
|
910
|
-
providers.map((provider) => /* @__PURE__ */
|
|
567
|
+
onRetry ? /* @__PURE__ */ jsx3(Button, { variant: "secondary", size: "medium", onClick: onRetry, children: labels.deposit.cardFlow.retry }) : null
|
|
568
|
+
] }) : providers.length === 0 ? /* @__PURE__ */ jsx3("div", { className: "flex min-h-[200px] items-center justify-center", children: /* @__PURE__ */ jsx3("p", { className: "agg-type-body text-agg-muted-foreground", children: labels.deposit.cardFlow.noQuotes }) }) : /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-4", children: [
|
|
569
|
+
providers.map((provider) => /* @__PURE__ */ jsx3(
|
|
911
570
|
CardProviderItem,
|
|
912
571
|
{
|
|
913
572
|
provider,
|
|
@@ -915,141 +574,605 @@ var CardProviderStep = ({
|
|
|
915
574
|
},
|
|
916
575
|
provider.id
|
|
917
576
|
)),
|
|
918
|
-
sessionError ? /* @__PURE__ */
|
|
577
|
+
sessionError ? /* @__PURE__ */ jsx3("p", { className: "agg-type-label text-agg-error text-center", children: sessionError }) : null
|
|
919
578
|
] })
|
|
920
579
|
] }) })
|
|
921
580
|
] });
|
|
922
581
|
};
|
|
923
582
|
|
|
924
|
-
// src/deposit/steps/card-
|
|
925
|
-
import { useLabels as
|
|
926
|
-
import { jsx as
|
|
927
|
-
var
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
583
|
+
// src/deposit/steps/card-purchase-success.tsx
|
|
584
|
+
import { useLabels as useLabels4 } from "@agg-build/hooks";
|
|
585
|
+
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
586
|
+
var SummaryRow = ({ label, value }) => /* @__PURE__ */ jsxs4("div", { className: "flex items-center justify-between border-b border-agg-separator py-2 last:border-b-0", children: [
|
|
587
|
+
/* @__PURE__ */ jsx4("p", { className: "text-[12px] leading-4 font-agg-bold uppercase text-agg-muted-foreground", children: label }),
|
|
588
|
+
/* @__PURE__ */ jsx4("p", { className: "agg-type-label text-agg-foreground", children: value })
|
|
589
|
+
] });
|
|
590
|
+
var CardPurchaseSuccessStep = ({
|
|
591
|
+
summary,
|
|
592
|
+
onDone,
|
|
593
|
+
onClose
|
|
594
|
+
}) => {
|
|
595
|
+
const labels = useLabels4();
|
|
596
|
+
return /* @__PURE__ */ jsx4("div", { className: "relative", children: /* @__PURE__ */ jsxs4(Modal.Body, { classNames: { root: "px-5 py-8 sm:px-8 sm:py-10" }, children: [
|
|
597
|
+
/* @__PURE__ */ jsx4(
|
|
598
|
+
"button",
|
|
599
|
+
{
|
|
600
|
+
type: "button",
|
|
601
|
+
className: "absolute right-8 top-7 flex items-center justify-center text-agg-foreground transition-colors hover:text-agg-foreground/80",
|
|
602
|
+
onClick: onClose,
|
|
603
|
+
"aria-label": labels.common.close,
|
|
604
|
+
children: /* @__PURE__ */ jsx4(CloseIcon, { className: "h-6 w-6" })
|
|
605
|
+
}
|
|
606
|
+
),
|
|
607
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex flex-col items-center gap-8", children: [
|
|
608
|
+
/* @__PURE__ */ jsx4("div", { className: "flex h-[60px] w-[60px] items-center justify-center rounded-full bg-agg-success/15", children: /* @__PURE__ */ jsx4(SuccessCheckIcon, { className: "h-6 w-6 text-agg-success" }) }),
|
|
609
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex flex-col items-center gap-3 text-center", children: [
|
|
610
|
+
/* @__PURE__ */ jsx4("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold text-agg-foreground", children: labels.deposit.cardFlow.successTitle }),
|
|
611
|
+
/* @__PURE__ */ jsx4("p", { className: "agg-type-body text-agg-foreground", children: labels.deposit.cardFlow.successDescription })
|
|
612
|
+
] }),
|
|
613
|
+
/* @__PURE__ */ jsxs4("div", { className: "w-full rounded-lg border border-agg-separator bg-agg-secondary px-3 py-1", children: [
|
|
614
|
+
/* @__PURE__ */ jsx4(
|
|
615
|
+
SummaryRow,
|
|
616
|
+
{
|
|
617
|
+
label: labels.deposit.summary.amountReceived,
|
|
618
|
+
value: summary.amountReceived
|
|
619
|
+
}
|
|
620
|
+
),
|
|
621
|
+
/* @__PURE__ */ jsx4(SummaryRow, { label: labels.deposit.summary.network, value: summary.network }),
|
|
622
|
+
/* @__PURE__ */ jsx4(SummaryRow, { label: labels.deposit.cardFlow.summary.fees, value: summary.fees })
|
|
623
|
+
] }),
|
|
624
|
+
/* @__PURE__ */ jsx4(Button, { variant: "secondary", size: "large", className: "w-[120px]", onClick: onDone, children: labels.deposit.done })
|
|
625
|
+
] })
|
|
626
|
+
] }) });
|
|
627
|
+
};
|
|
628
|
+
|
|
629
|
+
// src/deposit/steps/crypto-transfer.tsx
|
|
630
|
+
import { useLabels as useLabels6, useWithdrawEstimate } from "@agg-build/hooks";
|
|
631
|
+
|
|
632
|
+
// src/shared/transfer-fee-summary.tsx
|
|
633
|
+
import { useLabels as useLabels5 } from "@agg-build/hooks";
|
|
634
|
+
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
635
|
+
var separator = /* @__PURE__ */ jsx5("span", { className: "text-agg-muted-foreground", "aria-hidden": "true", children: "\xB7" });
|
|
636
|
+
var normalizeFeeLabel = (label) => label.replace(/\s*~\s*$/, "");
|
|
637
|
+
var TransferFeeSummary = ({
|
|
638
|
+
estimate,
|
|
639
|
+
view,
|
|
640
|
+
minDeposit,
|
|
641
|
+
eta
|
|
642
|
+
}) => {
|
|
643
|
+
const labels = useLabels5();
|
|
644
|
+
if (!estimate) return null;
|
|
645
|
+
if (view === "deposit") {
|
|
646
|
+
return /* @__PURE__ */ jsxs5("p", { className: "agg-type-label flex flex-wrap items-center gap-x-2 gap-y-1 text-agg-foreground", children: [
|
|
647
|
+
minDeposit ? /* @__PURE__ */ jsxs5("span", { children: [
|
|
648
|
+
labels.deposit.sendCrypto.minDepositPrefix,
|
|
649
|
+
" ",
|
|
650
|
+
minDeposit
|
|
651
|
+
] }) : null,
|
|
652
|
+
minDeposit ? separator : null,
|
|
653
|
+
/* @__PURE__ */ jsxs5("span", { children: [
|
|
654
|
+
normalizeFeeLabel(labels.deposit.walletFlow.feePrefix),
|
|
655
|
+
": ",
|
|
656
|
+
estimate.estimatedFees
|
|
657
|
+
] }),
|
|
658
|
+
eta ? separator : null,
|
|
659
|
+
eta ? /* @__PURE__ */ jsx5("span", { children: eta }) : null
|
|
660
|
+
] });
|
|
661
|
+
}
|
|
662
|
+
return /* @__PURE__ */ jsxs5("div", { className: "agg-type-label flex flex-wrap items-center gap-x-2 gap-y-1 text-agg-foreground", children: [
|
|
663
|
+
/* @__PURE__ */ jsxs5("span", { children: [
|
|
664
|
+
labels.withdraw.walletFlow.estimatedFees,
|
|
665
|
+
": ",
|
|
666
|
+
estimate.estimatedFees
|
|
667
|
+
] }),
|
|
668
|
+
separator,
|
|
669
|
+
/* @__PURE__ */ jsxs5("span", { className: "inline-flex items-center gap-1", children: [
|
|
670
|
+
/* @__PURE__ */ jsxs5("span", { children: [
|
|
671
|
+
labels.withdraw.walletFlow.networkReserve,
|
|
672
|
+
": ",
|
|
673
|
+
estimate.networkReserve
|
|
674
|
+
] }),
|
|
675
|
+
/* @__PURE__ */ jsx5(
|
|
676
|
+
Tooltip,
|
|
677
|
+
{
|
|
678
|
+
"aria-label": labels.withdraw.walletFlow.networkReserveTooltipAria,
|
|
679
|
+
size: "medium",
|
|
680
|
+
content: /* @__PURE__ */ jsxs5("div", { className: "text-center", children: [
|
|
681
|
+
/* @__PURE__ */ jsx5("p", { children: labels.withdraw.walletFlow.networkReserveTooltipLineOne }),
|
|
682
|
+
/* @__PURE__ */ jsx5("p", { children: labels.withdraw.walletFlow.networkReserveTooltipLineTwo })
|
|
683
|
+
] }),
|
|
684
|
+
classNames: {
|
|
685
|
+
content: "min-w-96 max-w-none!",
|
|
686
|
+
arrow: "[&_polygon]:fill-agg-background",
|
|
687
|
+
icon: "text-agg-foreground! h-3! w-3!"
|
|
688
|
+
}
|
|
689
|
+
}
|
|
690
|
+
)
|
|
691
|
+
] }),
|
|
692
|
+
separator,
|
|
693
|
+
/* @__PURE__ */ jsxs5("span", { children: [
|
|
694
|
+
labels.withdraw.walletFlow.youReceive,
|
|
695
|
+
": ",
|
|
696
|
+
estimate.youReceive
|
|
697
|
+
] })
|
|
698
|
+
] });
|
|
699
|
+
};
|
|
700
|
+
|
|
701
|
+
// src/deposit/components/DepositQRCode.tsx
|
|
702
|
+
import { QRCodeSVG } from "qrcode.react";
|
|
703
|
+
import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
704
|
+
function DepositQRCode({
|
|
705
|
+
depositAddress,
|
|
706
|
+
networkLogoUrl,
|
|
707
|
+
networkLogo,
|
|
708
|
+
size = 160
|
|
709
|
+
}) {
|
|
710
|
+
const logoOverlay = networkLogo ? /* @__PURE__ */ jsx6(
|
|
711
|
+
"div",
|
|
712
|
+
{
|
|
713
|
+
className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-sm",
|
|
714
|
+
style: { width: 32, height: 32, backgroundColor: "#FFFFFF", padding: 2 },
|
|
715
|
+
children: networkLogo
|
|
716
|
+
}
|
|
717
|
+
) : networkLogoUrl ? /* @__PURE__ */ jsx6(
|
|
718
|
+
"img",
|
|
719
|
+
{
|
|
720
|
+
src: networkLogoUrl,
|
|
721
|
+
alt: "",
|
|
722
|
+
className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-sm",
|
|
723
|
+
width: 32,
|
|
724
|
+
height: 32,
|
|
725
|
+
style: { backgroundColor: "#FFFFFF", padding: 2 }
|
|
726
|
+
}
|
|
727
|
+
) : null;
|
|
728
|
+
return /* @__PURE__ */ jsx6(
|
|
729
|
+
"div",
|
|
730
|
+
{
|
|
731
|
+
className: "inline-flex items-center justify-center rounded-xl border",
|
|
732
|
+
style: {
|
|
733
|
+
padding: 16,
|
|
734
|
+
borderColor: "#E5E7EB",
|
|
735
|
+
backgroundColor: "#FFFFFF"
|
|
736
|
+
},
|
|
737
|
+
children: /* @__PURE__ */ jsxs6("div", { className: "relative", style: { width: size, height: size }, children: [
|
|
738
|
+
/* @__PURE__ */ jsx6(QRCodeSVG, { value: depositAddress, size, level: "H" }),
|
|
739
|
+
logoOverlay
|
|
740
|
+
] })
|
|
741
|
+
}
|
|
742
|
+
);
|
|
743
|
+
}
|
|
744
|
+
DepositQRCode.displayName = "DepositQRCode";
|
|
745
|
+
|
|
746
|
+
// src/deposit/steps/crypto-transfer.tsx
|
|
747
|
+
import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
748
|
+
var CryptoAddressLoadingState = () => {
|
|
749
|
+
const labels = useLabels6();
|
|
750
|
+
const sendCryptoLabels = labels.deposit.sendCrypto;
|
|
751
|
+
return /* @__PURE__ */ jsxs7(
|
|
752
|
+
"div",
|
|
753
|
+
{
|
|
754
|
+
className: "flex w-full flex-col items-center justify-center gap-6 py-10 text-center text-agg-foreground",
|
|
755
|
+
role: "status",
|
|
756
|
+
"aria-live": "polite",
|
|
757
|
+
children: [
|
|
758
|
+
/* @__PURE__ */ jsx7(
|
|
759
|
+
"span",
|
|
760
|
+
{
|
|
761
|
+
className: "h-9 w-9 animate-spin rounded-full border-2 border-agg-primary/25 border-t-agg-primary",
|
|
762
|
+
"aria-hidden": "true"
|
|
763
|
+
}
|
|
764
|
+
),
|
|
765
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex w-full flex-col items-center gap-2", children: [
|
|
766
|
+
/* @__PURE__ */ jsx7("p", { className: "text-agg-base font-agg-bold leading-agg-6", children: sendCryptoLabels.addressLoadingTitle }),
|
|
767
|
+
/* @__PURE__ */ jsx7("p", { className: "max-w-[300px] text-agg-sm leading-agg-5", children: sendCryptoLabels.addressLoadingDescription })
|
|
768
|
+
] })
|
|
769
|
+
]
|
|
770
|
+
}
|
|
771
|
+
);
|
|
772
|
+
};
|
|
773
|
+
var getEstimateAmountFromMinDeposit = (minDeposit) => {
|
|
774
|
+
const numericMinDeposit = minDeposit.replace(/[^0-9.]/g, "");
|
|
775
|
+
return numericMinDeposit || "1";
|
|
776
|
+
};
|
|
777
|
+
var CryptoTransferStep = ({
|
|
778
|
+
tokenOptions,
|
|
779
|
+
networkOptions,
|
|
780
|
+
selectedToken,
|
|
781
|
+
selectedNetwork,
|
|
782
|
+
depositAddress,
|
|
783
|
+
minDeposit,
|
|
784
|
+
eta,
|
|
785
|
+
isLoadingAddress,
|
|
786
|
+
addressError,
|
|
787
|
+
onBack,
|
|
788
|
+
onTokenChange,
|
|
789
|
+
onNetworkChange,
|
|
790
|
+
onCopyAddress,
|
|
791
|
+
onDone
|
|
792
|
+
}) => {
|
|
793
|
+
var _a;
|
|
794
|
+
const labels = useLabels6();
|
|
795
|
+
const selectedNetworkOption = networkOptions.find((n) => n.value === selectedNetwork);
|
|
796
|
+
const networkLogoUrl = (_a = selectedNetworkOption == null ? void 0 : selectedNetworkOption.iconUrl) != null ? _a : "";
|
|
797
|
+
const networkLogo = selectedNetworkOption == null ? void 0 : selectedNetworkOption.icon;
|
|
798
|
+
const transferFeeEstimate = useWithdrawEstimate({
|
|
799
|
+
amount: getEstimateAmountFromMinDeposit(minDeposit),
|
|
800
|
+
selectedToken,
|
|
801
|
+
selectedNetwork
|
|
802
|
+
});
|
|
803
|
+
return /* @__PURE__ */ jsxs7(Fragment3, { children: [
|
|
804
|
+
/* @__PURE__ */ jsx7(
|
|
805
|
+
Modal.Header,
|
|
806
|
+
{
|
|
807
|
+
title: labels.deposit.sendCrypto.title,
|
|
808
|
+
hideBorder: true,
|
|
809
|
+
leftElement: /* @__PURE__ */ jsx7(
|
|
810
|
+
"button",
|
|
811
|
+
{
|
|
812
|
+
type: "button",
|
|
813
|
+
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
814
|
+
onClick: onBack,
|
|
815
|
+
"aria-label": "Go back",
|
|
816
|
+
children: /* @__PURE__ */ jsx7(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
817
|
+
}
|
|
818
|
+
)
|
|
819
|
+
}
|
|
820
|
+
),
|
|
821
|
+
/* @__PURE__ */ jsx7(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs7("div", { className: "flex flex-col gap-7", children: [
|
|
822
|
+
/* @__PURE__ */ jsx7("div", { className: "flex flex-col gap-5", children: /* @__PURE__ */ jsxs7("div", { className: "flex gap-5", children: [
|
|
823
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
824
|
+
/* @__PURE__ */ jsx7("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.sendCrypto.tokenLabel }),
|
|
825
|
+
/* @__PURE__ */ jsx7(
|
|
826
|
+
Select,
|
|
827
|
+
{
|
|
828
|
+
items: tokenOptions,
|
|
829
|
+
value: selectedToken,
|
|
830
|
+
onChange: onTokenChange,
|
|
831
|
+
ariaLabel: labels.deposit.sendCrypto.tokenLabel
|
|
832
|
+
}
|
|
833
|
+
)
|
|
834
|
+
] }),
|
|
835
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
836
|
+
/* @__PURE__ */ jsx7("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.sendCrypto.networkLabel }),
|
|
837
|
+
/* @__PURE__ */ jsx7(
|
|
838
|
+
Select,
|
|
839
|
+
{
|
|
840
|
+
items: networkOptions,
|
|
841
|
+
value: selectedNetwork,
|
|
842
|
+
onChange: onNetworkChange,
|
|
843
|
+
ariaLabel: labels.deposit.sendCrypto.networkLabel
|
|
844
|
+
}
|
|
845
|
+
)
|
|
846
|
+
] })
|
|
847
|
+
] }) }),
|
|
848
|
+
/* @__PURE__ */ jsx7("div", { className: "mx-auto", children: isLoadingAddress ? /* @__PURE__ */ jsx7(CryptoAddressLoadingState, {}) : addressError ? /* @__PURE__ */ jsx7("div", { className: "flex h-[192px] w-[192px] items-center justify-center rounded-xl border border-agg-separator bg-agg-secondary", children: /* @__PURE__ */ jsx7("p", { className: "agg-type-label text-center text-agg-error px-3", children: addressError }) }) : /* @__PURE__ */ jsx7(
|
|
849
|
+
DepositQRCode,
|
|
850
|
+
{
|
|
851
|
+
depositAddress,
|
|
852
|
+
networkLogoUrl,
|
|
853
|
+
networkLogo
|
|
854
|
+
}
|
|
855
|
+
) }),
|
|
856
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex flex-col gap-3", children: [
|
|
857
|
+
/* @__PURE__ */ jsx7("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.sendCrypto.depositAddressLabel }),
|
|
858
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2 rounded border border-agg-separator bg-agg-secondary h-10 px-3", children: [
|
|
859
|
+
isLoadingAddress ? /* @__PURE__ */ jsx7("div", { className: "h-4 flex-1 animate-pulse rounded bg-agg-muted-foreground/20" }) : /* @__PURE__ */ jsx7("p", { className: "agg-type-body flex-1 min-w-0 truncate text-agg-foreground", children: depositAddress }),
|
|
860
|
+
/* @__PURE__ */ jsx7(
|
|
861
|
+
CopyButton,
|
|
862
|
+
{
|
|
863
|
+
value: depositAddress,
|
|
864
|
+
label: labels.deposit.sendCrypto.copy,
|
|
865
|
+
copiedLabel: labels.deposit.sendCrypto.copied,
|
|
866
|
+
disabled: isLoadingAddress || !!addressError || !depositAddress,
|
|
867
|
+
onCopy: onCopyAddress,
|
|
868
|
+
className: "text-agg-primary hover:text-agg-primary/80"
|
|
869
|
+
}
|
|
870
|
+
)
|
|
871
|
+
] }),
|
|
872
|
+
/* @__PURE__ */ jsx7(
|
|
873
|
+
TransferFeeSummary,
|
|
874
|
+
{
|
|
875
|
+
estimate: transferFeeEstimate,
|
|
876
|
+
view: "deposit",
|
|
877
|
+
minDeposit,
|
|
878
|
+
eta
|
|
879
|
+
}
|
|
880
|
+
)
|
|
881
|
+
] }),
|
|
882
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex items-start gap-3 rounded-lg bg-agg-secondary-hover p-3", children: [
|
|
883
|
+
/* @__PURE__ */ jsx7(WarningIcon, { className: "h-4 w-4 text-agg-muted-foreground mt-0.5" }),
|
|
884
|
+
/* @__PURE__ */ jsx7("p", { className: "text-agg-xs leading-agg-4 text-agg-foreground", children: labels.deposit.sendCrypto.warning })
|
|
885
|
+
] }),
|
|
886
|
+
/* @__PURE__ */ jsx7(
|
|
887
|
+
Button,
|
|
888
|
+
{
|
|
889
|
+
variant: "secondary",
|
|
890
|
+
size: "large",
|
|
891
|
+
className: "w-[120px] self-center",
|
|
892
|
+
onClick: onDone,
|
|
893
|
+
children: labels.deposit.done
|
|
894
|
+
}
|
|
895
|
+
)
|
|
896
|
+
] }) })
|
|
897
|
+
] });
|
|
898
|
+
};
|
|
899
|
+
|
|
900
|
+
// src/deposit/steps/deposit-method.tsx
|
|
901
|
+
import { useLabels as useLabels7 } from "@agg-build/hooks";
|
|
902
|
+
import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
903
|
+
var DepositMethodCard = ({
|
|
904
|
+
icon,
|
|
905
|
+
title,
|
|
906
|
+
description,
|
|
907
|
+
value,
|
|
908
|
+
highlighted = false,
|
|
909
|
+
disabled = false,
|
|
910
|
+
onContinue
|
|
911
|
+
}) => /* @__PURE__ */ jsxs8(
|
|
912
|
+
"div",
|
|
913
|
+
{
|
|
914
|
+
className: cn(
|
|
915
|
+
"flex items-center gap-3 sm:gap-4",
|
|
916
|
+
"rounded-xl border border-agg-separator",
|
|
917
|
+
"p-3 sm:p-4",
|
|
918
|
+
"transition-colors",
|
|
919
|
+
disabled ? "opacity-50 cursor-not-allowed pointer-events-none" : "cursor-pointer hover:bg-agg-secondary-hover",
|
|
920
|
+
highlighted ? "" : ""
|
|
921
|
+
),
|
|
922
|
+
role: "button",
|
|
923
|
+
tabIndex: disabled ? -1 : 0,
|
|
924
|
+
"aria-disabled": disabled || void 0,
|
|
925
|
+
onClick: disabled ? void 0 : onContinue,
|
|
926
|
+
onKeyDown: disabled ? void 0 : (e) => {
|
|
927
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
928
|
+
e.preventDefault();
|
|
929
|
+
onContinue();
|
|
930
|
+
}
|
|
931
|
+
},
|
|
932
|
+
children: [
|
|
933
|
+
/* @__PURE__ */ jsx8("div", { className: "shrink-0 flex items-center justify-center h-10 w-10 rounded-lg bg-agg-secondary-hover", children: icon }),
|
|
934
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex-1 min-w-0", children: [
|
|
935
|
+
/* @__PURE__ */ jsx8("p", { className: "agg-type-body-strong text-agg-foreground", children: title }),
|
|
936
|
+
/* @__PURE__ */ jsx8("p", { className: "agg-type-label text-agg-muted-foreground", children: description })
|
|
937
|
+
] }),
|
|
938
|
+
value ? /* @__PURE__ */ jsx8("p", { className: "agg-type-label text-agg-muted-foreground", children: value }) : null,
|
|
939
|
+
/* @__PURE__ */ jsx8("div", { className: "shrink-0 text-agg-muted-foreground", children: /* @__PURE__ */ jsx8(ChevronRightIcon, { className: "h-5 w-5" }) })
|
|
940
|
+
]
|
|
941
|
+
}
|
|
942
|
+
);
|
|
943
|
+
var DepositMethodStep = ({
|
|
944
|
+
balance,
|
|
945
|
+
walletLabel,
|
|
946
|
+
walletBalance,
|
|
947
|
+
walletToken,
|
|
948
|
+
isWalletBalanceLoading = false,
|
|
949
|
+
showWalletMethod = true,
|
|
950
|
+
highlightedMethod,
|
|
951
|
+
depositAddressesReady = true,
|
|
952
|
+
onSelectMethod
|
|
953
|
+
}) => {
|
|
954
|
+
const labels = useLabels7();
|
|
955
|
+
return /* @__PURE__ */ jsxs8(Fragment4, { children: [
|
|
956
|
+
/* @__PURE__ */ jsx8(Modal.Header, { title: labels.deposit.title, hideBorder: true }),
|
|
957
|
+
/* @__PURE__ */ jsx8(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-5", children: [
|
|
958
|
+
/* @__PURE__ */ jsxs8("p", { className: "agg-type-body text-agg-foreground", children: [
|
|
959
|
+
labels.deposit.balancePrefix,
|
|
960
|
+
" ",
|
|
961
|
+
formatCompactUsd(balance)
|
|
962
|
+
] }),
|
|
963
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-4", children: [
|
|
964
|
+
showWalletMethod ? /* @__PURE__ */ jsx8(
|
|
965
|
+
DepositMethodCard,
|
|
966
|
+
{
|
|
967
|
+
icon: /* @__PURE__ */ jsx8(WalletIcon, { className: "h-6 w-6 text-agg-muted-foreground" }),
|
|
968
|
+
title: labels.deposit.methods.walletTitle(walletLabel),
|
|
969
|
+
description: labels.deposit.methods.walletDescription,
|
|
970
|
+
value: isWalletBalanceLoading ? /* @__PURE__ */ jsx8(LoadingIcon, { size: "small" }) : formatTokenAmount(walletBalance, walletToken),
|
|
971
|
+
highlighted: highlightedMethod === "wallet",
|
|
972
|
+
disabled: !depositAddressesReady,
|
|
973
|
+
onContinue: () => onSelectMethod("wallet")
|
|
974
|
+
}
|
|
975
|
+
) : null,
|
|
976
|
+
/* @__PURE__ */ jsx8(
|
|
977
|
+
DepositMethodCard,
|
|
978
|
+
{
|
|
979
|
+
icon: /* @__PURE__ */ jsx8(BoltIcon, { className: "h-6 w-6 text-agg-muted-foreground" }),
|
|
980
|
+
title: labels.deposit.methods.cryptoTitle,
|
|
981
|
+
description: labels.deposit.methods.cryptoDescription,
|
|
982
|
+
highlighted: highlightedMethod === "crypto",
|
|
983
|
+
disabled: !depositAddressesReady,
|
|
984
|
+
onContinue: () => onSelectMethod("crypto")
|
|
985
|
+
}
|
|
986
|
+
),
|
|
987
|
+
/* @__PURE__ */ jsx8(
|
|
988
|
+
DepositMethodCard,
|
|
989
|
+
{
|
|
990
|
+
icon: /* @__PURE__ */ jsx8(CreditCardIcon, { className: "h-6 w-6 text-agg-muted-foreground" }),
|
|
991
|
+
title: labels.deposit.methods.cardTitle,
|
|
992
|
+
description: labels.deposit.methods.cardDescription,
|
|
993
|
+
highlighted: highlightedMethod === "card",
|
|
994
|
+
onContinue: () => onSelectMethod("card")
|
|
995
|
+
}
|
|
996
|
+
)
|
|
997
|
+
] })
|
|
998
|
+
] }) })
|
|
999
|
+
] });
|
|
1000
|
+
};
|
|
1001
|
+
|
|
1002
|
+
// src/deposit/steps/wallet-form.tsx
|
|
1003
|
+
import { useLabels as useLabels8 } from "@agg-build/hooks";
|
|
1004
|
+
import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1005
|
+
var WalletFormStep = ({
|
|
1006
|
+
walletLabel,
|
|
1007
|
+
walletBalance,
|
|
1008
|
+
isBalanceLoading = false,
|
|
1009
|
+
tokenOptions,
|
|
1010
|
+
networkOptions,
|
|
1011
|
+
selectedToken,
|
|
1012
|
+
selectedNetwork,
|
|
1013
|
+
amount,
|
|
1014
|
+
isSubmitting = false,
|
|
1015
|
+
formErrorMessage,
|
|
1016
|
+
formErrorTone = "error",
|
|
1017
|
+
estimatedReceive,
|
|
1018
|
+
feeEstimate,
|
|
1019
|
+
eta,
|
|
1020
|
+
onBack,
|
|
1021
|
+
onTokenChange,
|
|
1022
|
+
onNetworkChange,
|
|
1023
|
+
onAmountChange,
|
|
1024
|
+
onMax,
|
|
1025
|
+
onConfirm
|
|
933
1026
|
}) => {
|
|
934
|
-
const labels =
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
1027
|
+
const labels = useLabels8();
|
|
1028
|
+
const isConfirmEnabled = !isSubmitting && !isBalanceLoading && Number(amount) > 0 && Number(amount) <= walletBalance;
|
|
1029
|
+
return /* @__PURE__ */ jsxs9(Fragment5, { children: [
|
|
1030
|
+
/* @__PURE__ */ jsx9(
|
|
1031
|
+
Modal.Header,
|
|
938
1032
|
{
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
1033
|
+
title: labels.deposit.walletFlow.title,
|
|
1034
|
+
hideBorder: true,
|
|
1035
|
+
leftElement: /* @__PURE__ */ jsx9(
|
|
1036
|
+
"button",
|
|
1037
|
+
{
|
|
1038
|
+
type: "button",
|
|
1039
|
+
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
1040
|
+
onClick: onBack,
|
|
1041
|
+
"aria-label": "Go back",
|
|
1042
|
+
children: /* @__PURE__ */ jsx9(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
1043
|
+
}
|
|
1044
|
+
)
|
|
944
1045
|
}
|
|
945
1046
|
),
|
|
946
|
-
/* @__PURE__ */
|
|
947
|
-
/* @__PURE__ */
|
|
948
|
-
|
|
949
|
-
/* @__PURE__ */
|
|
950
|
-
|
|
1047
|
+
/* @__PURE__ */ jsx9(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-7", children: [
|
|
1048
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between", children: [
|
|
1049
|
+
/* @__PURE__ */ jsx9("p", { className: "agg-type-label text-agg-foreground", children: walletLabel }),
|
|
1050
|
+
/* @__PURE__ */ jsxs9("p", { className: "agg-type-label text-agg-muted-foreground", children: [
|
|
1051
|
+
labels.deposit.balanceLabel,
|
|
1052
|
+
" ",
|
|
1053
|
+
isBalanceLoading ? /* @__PURE__ */ jsx9(LoadingIcon, { size: "small" }) : formatTokenAmount(walletBalance, selectedToken)
|
|
1054
|
+
] })
|
|
951
1055
|
] }),
|
|
952
|
-
|
|
953
|
-
/* @__PURE__ */
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
1056
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-5", children: [
|
|
1057
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex gap-5", children: [
|
|
1058
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
1059
|
+
/* @__PURE__ */ jsx9("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.walletFlow.tokenLabel }),
|
|
1060
|
+
/* @__PURE__ */ jsx9(
|
|
1061
|
+
Select,
|
|
1062
|
+
{
|
|
1063
|
+
items: tokenOptions,
|
|
1064
|
+
value: selectedToken,
|
|
1065
|
+
onChange: onTokenChange,
|
|
1066
|
+
ariaLabel: labels.deposit.walletFlow.tokenLabel
|
|
1067
|
+
}
|
|
1068
|
+
)
|
|
1069
|
+
] }),
|
|
1070
|
+
networkOptions.length >= 1 ? /* @__PURE__ */ jsxs9("div", { className: "flex flex-1 flex-col gap-2 min-w-0", children: [
|
|
1071
|
+
/* @__PURE__ */ jsx9("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.walletFlow.networkLabel }),
|
|
1072
|
+
/* @__PURE__ */ jsx9(
|
|
1073
|
+
Select,
|
|
1074
|
+
{
|
|
1075
|
+
items: networkOptions,
|
|
1076
|
+
value: selectedNetwork,
|
|
1077
|
+
onChange: onNetworkChange,
|
|
1078
|
+
ariaLabel: labels.deposit.walletFlow.networkLabel
|
|
1079
|
+
}
|
|
1080
|
+
)
|
|
1081
|
+
] }) : null
|
|
1082
|
+
] }),
|
|
1083
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-2", children: [
|
|
1084
|
+
/* @__PURE__ */ jsx9("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.deposit.walletFlow.amountLabel }),
|
|
1085
|
+
/* @__PURE__ */ jsxs9(
|
|
1086
|
+
"div",
|
|
958
1087
|
{
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
1088
|
+
className: cn(
|
|
1089
|
+
"flex items-center gap-2",
|
|
1090
|
+
"rounded border border-agg-separator bg-agg-secondary",
|
|
1091
|
+
"h-10 px-3"
|
|
1092
|
+
),
|
|
1093
|
+
children: [
|
|
1094
|
+
/* @__PURE__ */ jsx9(
|
|
1095
|
+
"input",
|
|
1096
|
+
{
|
|
1097
|
+
type: "text",
|
|
1098
|
+
inputMode: "decimal",
|
|
1099
|
+
"aria-label": labels.deposit.walletFlow.amountLabel,
|
|
1100
|
+
className: "agg-type-body w-full bg-transparent outline-none text-agg-foreground",
|
|
1101
|
+
placeholder: "0.00",
|
|
1102
|
+
value: amount,
|
|
1103
|
+
onChange: (event) => onAmountChange(event.target.value)
|
|
1104
|
+
}
|
|
1105
|
+
),
|
|
1106
|
+
/* @__PURE__ */ jsx9(
|
|
1107
|
+
"button",
|
|
1108
|
+
{
|
|
1109
|
+
type: "button",
|
|
1110
|
+
className: "shrink-0 text-agg-sm font-agg-bold leading-agg-5 text-agg-primary transition-colors hover:text-agg-primary/80 cursor-pointer",
|
|
1111
|
+
onClick: onMax,
|
|
1112
|
+
"aria-label": labels.deposit.walletFlow.max,
|
|
1113
|
+
children: labels.deposit.walletFlow.max
|
|
1114
|
+
}
|
|
1115
|
+
)
|
|
1116
|
+
]
|
|
962
1117
|
}
|
|
963
1118
|
)
|
|
964
|
-
] })
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
1119
|
+
] }),
|
|
1120
|
+
estimatedReceive && feeEstimate && eta ? /* @__PURE__ */ jsx9("p", { className: "agg-type-label text-agg-foreground", children: `\u2248 ${estimatedReceive} \xB7 ${labels.deposit.walletFlow.feePrefix} ${feeEstimate} \xB7 ${eta}` }) : null,
|
|
1121
|
+
formErrorMessage ? /* @__PURE__ */ jsxs9(
|
|
1122
|
+
"div",
|
|
1123
|
+
{
|
|
1124
|
+
className: cn(
|
|
1125
|
+
"flex items-start gap-2",
|
|
1126
|
+
formErrorTone === "warning" ? "text-agg-warning" : "text-agg-error"
|
|
1127
|
+
),
|
|
1128
|
+
children: [
|
|
1129
|
+
/* @__PURE__ */ jsx9(WarningIcon, { className: "mt-0.5 h-4 w-4 shrink-0" }),
|
|
1130
|
+
/* @__PURE__ */ jsx9("p", { className: "agg-type-label", children: formErrorMessage })
|
|
1131
|
+
]
|
|
1132
|
+
}
|
|
1133
|
+
) : null
|
|
969
1134
|
] }),
|
|
970
|
-
/* @__PURE__ */
|
|
971
|
-
|
|
1135
|
+
/* @__PURE__ */ jsx9(
|
|
1136
|
+
Button,
|
|
972
1137
|
{
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
1138
|
+
variant: isConfirmEnabled ? "primary" : "secondary",
|
|
1139
|
+
size: "large",
|
|
1140
|
+
className: "w-full",
|
|
1141
|
+
disabled: !isConfirmEnabled,
|
|
1142
|
+
isLoading: isSubmitting,
|
|
1143
|
+
"aria-label": labels.deposit.walletFlow.confirm,
|
|
1144
|
+
onClick: onConfirm,
|
|
1145
|
+
children: labels.deposit.walletFlow.confirm
|
|
977
1146
|
}
|
|
978
1147
|
)
|
|
979
|
-
] })
|
|
980
|
-
] })
|
|
981
|
-
};
|
|
982
|
-
|
|
983
|
-
// src/deposit/steps/card-purchase-success.tsx
|
|
984
|
-
import { useLabels as useLabels7 } from "@agg-build/hooks";
|
|
985
|
-
import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
986
|
-
var SummaryRow = ({ label, value }) => /* @__PURE__ */ jsxs8("div", { className: "flex items-center justify-between border-b border-agg-separator py-2 last:border-b-0", children: [
|
|
987
|
-
/* @__PURE__ */ jsx8("p", { className: "text-[12px] leading-4 font-agg-bold uppercase text-agg-muted-foreground", children: label }),
|
|
988
|
-
/* @__PURE__ */ jsx8("p", { className: "agg-type-label text-agg-foreground", children: value })
|
|
989
|
-
] });
|
|
990
|
-
var CardPurchaseSuccessStep = ({
|
|
991
|
-
summary,
|
|
992
|
-
onDone,
|
|
993
|
-
onClose
|
|
994
|
-
}) => {
|
|
995
|
-
const labels = useLabels7();
|
|
996
|
-
return /* @__PURE__ */ jsx8("div", { className: "relative", children: /* @__PURE__ */ jsxs8(Modal.Body, { classNames: { root: "px-5 py-8 sm:px-8 sm:py-10" }, children: [
|
|
997
|
-
/* @__PURE__ */ jsx8(
|
|
998
|
-
"button",
|
|
999
|
-
{
|
|
1000
|
-
type: "button",
|
|
1001
|
-
className: "absolute right-8 top-7 flex items-center justify-center text-agg-foreground transition-colors hover:text-agg-foreground/80",
|
|
1002
|
-
onClick: onClose,
|
|
1003
|
-
"aria-label": labels.common.close,
|
|
1004
|
-
children: /* @__PURE__ */ jsx8(CloseIcon, { className: "h-6 w-6" })
|
|
1005
|
-
}
|
|
1006
|
-
),
|
|
1007
|
-
/* @__PURE__ */ jsxs8("div", { className: "flex flex-col items-center gap-8", children: [
|
|
1008
|
-
/* @__PURE__ */ jsx8("div", { className: "flex h-[60px] w-[60px] items-center justify-center rounded-full bg-agg-success/15", children: /* @__PURE__ */ jsx8(SuccessCheckIcon, { className: "h-6 w-6 text-agg-success" }) }),
|
|
1009
|
-
/* @__PURE__ */ jsxs8("div", { className: "flex flex-col items-center gap-3 text-center", children: [
|
|
1010
|
-
/* @__PURE__ */ jsx8("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold text-agg-foreground", children: labels.deposit.cardFlow.successTitle }),
|
|
1011
|
-
/* @__PURE__ */ jsx8("p", { className: "agg-type-body text-agg-foreground", children: labels.deposit.cardFlow.successDescription })
|
|
1012
|
-
] }),
|
|
1013
|
-
/* @__PURE__ */ jsxs8("div", { className: "w-full rounded-lg border border-agg-separator bg-agg-secondary px-3 py-1", children: [
|
|
1014
|
-
/* @__PURE__ */ jsx8(
|
|
1015
|
-
SummaryRow,
|
|
1016
|
-
{
|
|
1017
|
-
label: labels.deposit.summary.amountReceived,
|
|
1018
|
-
value: summary.amountReceived
|
|
1019
|
-
}
|
|
1020
|
-
),
|
|
1021
|
-
/* @__PURE__ */ jsx8(SummaryRow, { label: labels.deposit.summary.network, value: summary.network }),
|
|
1022
|
-
/* @__PURE__ */ jsx8(SummaryRow, { label: labels.deposit.cardFlow.summary.fees, value: summary.fees })
|
|
1023
|
-
] }),
|
|
1024
|
-
/* @__PURE__ */ jsx8(Button, { variant: "secondary", size: "large", className: "w-[120px]", onClick: onDone, children: labels.deposit.done })
|
|
1025
|
-
] })
|
|
1026
|
-
] }) });
|
|
1148
|
+
] }) })
|
|
1149
|
+
] });
|
|
1027
1150
|
};
|
|
1028
1151
|
|
|
1029
1152
|
// src/deposit/steps/wallet-processing.tsx
|
|
1030
|
-
import { useLabels as
|
|
1153
|
+
import { useLabels as useLabels9 } from "@agg-build/hooks";
|
|
1031
1154
|
import { useEffect as useEffect2 } from "react";
|
|
1032
|
-
import { Fragment as Fragment6, jsx as
|
|
1155
|
+
import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1033
1156
|
var WalletProcessingStep = ({
|
|
1034
1157
|
steps,
|
|
1035
1158
|
errorMessage,
|
|
1036
1159
|
onComplete
|
|
1037
1160
|
}) => {
|
|
1038
|
-
const labels =
|
|
1161
|
+
const labels = useLabels9();
|
|
1039
1162
|
useEffect2(() => {
|
|
1040
1163
|
const allDone = steps.length > 0 && steps.every((s) => s.status === "complete");
|
|
1041
1164
|
if (allDone) {
|
|
1042
1165
|
onComplete();
|
|
1043
1166
|
}
|
|
1044
1167
|
}, [steps, onComplete]);
|
|
1045
|
-
return /* @__PURE__ */
|
|
1046
|
-
/* @__PURE__ */
|
|
1047
|
-
/* @__PURE__ */
|
|
1168
|
+
return /* @__PURE__ */ jsxs10(Fragment6, { children: [
|
|
1169
|
+
/* @__PURE__ */ jsx10(Modal.Header, { title: labels.deposit.processingTitle, hideBorder: true }),
|
|
1170
|
+
/* @__PURE__ */ jsx10(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-5", children: [
|
|
1048
1171
|
steps.map((step) => {
|
|
1049
1172
|
const isComplete = step.status === "complete";
|
|
1050
1173
|
const isActive = step.status === "active";
|
|
1051
|
-
return /* @__PURE__ */
|
|
1052
|
-
isComplete ? /* @__PURE__ */
|
|
1174
|
+
return /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-3", children: [
|
|
1175
|
+
isComplete ? /* @__PURE__ */ jsx10(CheckCircleIcon, { className: "h-4 w-4 text-agg-primary" }) : /* @__PURE__ */ jsx10(
|
|
1053
1176
|
"span",
|
|
1054
1177
|
{
|
|
1055
1178
|
className: [
|
|
@@ -1059,7 +1182,7 @@ var WalletProcessingStep = ({
|
|
|
1059
1182
|
].join(" ")
|
|
1060
1183
|
}
|
|
1061
1184
|
),
|
|
1062
|
-
/* @__PURE__ */
|
|
1185
|
+
/* @__PURE__ */ jsx10(
|
|
1063
1186
|
"p",
|
|
1064
1187
|
{
|
|
1065
1188
|
className: isComplete || isActive ? "agg-type-body text-agg-foreground" : "agg-type-body text-agg-muted-foreground",
|
|
@@ -1068,61 +1191,63 @@ var WalletProcessingStep = ({
|
|
|
1068
1191
|
)
|
|
1069
1192
|
] }, step.id);
|
|
1070
1193
|
}),
|
|
1071
|
-
errorMessage ? /* @__PURE__ */
|
|
1194
|
+
errorMessage ? /* @__PURE__ */ jsx10("p", { className: "agg-type-body text-agg-destructive", children: errorMessage }) : null
|
|
1072
1195
|
] }) })
|
|
1073
1196
|
] });
|
|
1074
1197
|
};
|
|
1075
1198
|
|
|
1076
1199
|
// src/deposit/steps/wallet-success.tsx
|
|
1077
|
-
import { useLabels as
|
|
1078
|
-
import { jsx as
|
|
1079
|
-
var SummaryRow2 = ({ label, value }) => /* @__PURE__ */
|
|
1080
|
-
/* @__PURE__ */
|
|
1081
|
-
/* @__PURE__ */
|
|
1200
|
+
import { useLabels as useLabels10 } from "@agg-build/hooks";
|
|
1201
|
+
import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1202
|
+
var SummaryRow2 = ({ label, value }) => /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between border-b border-agg-separator py-2 last:border-b-0", children: [
|
|
1203
|
+
/* @__PURE__ */ jsx11("p", { className: "text-[12px] leading-4 font-agg-bold uppercase text-agg-muted-foreground", children: label }),
|
|
1204
|
+
/* @__PURE__ */ jsx11("p", { className: "agg-type-label text-agg-foreground", children: value })
|
|
1082
1205
|
] });
|
|
1083
1206
|
var WalletSuccessStep = ({
|
|
1084
1207
|
summary,
|
|
1085
1208
|
onDone,
|
|
1086
1209
|
onClose
|
|
1087
1210
|
}) => {
|
|
1088
|
-
const labels =
|
|
1089
|
-
return /* @__PURE__ */
|
|
1090
|
-
/* @__PURE__ */
|
|
1211
|
+
const labels = useLabels10();
|
|
1212
|
+
return /* @__PURE__ */ jsx11("div", { className: "relative", children: /* @__PURE__ */ jsxs11(Modal.Body, { classNames: { root: "px-5 py-8 sm:px-8 sm:py-10" }, children: [
|
|
1213
|
+
/* @__PURE__ */ jsx11(
|
|
1091
1214
|
"button",
|
|
1092
1215
|
{
|
|
1093
1216
|
type: "button",
|
|
1094
1217
|
className: "absolute right-8 top-7 flex items-center justify-center text-agg-foreground transition-colors hover:text-agg-foreground/80",
|
|
1095
1218
|
onClick: onClose,
|
|
1096
1219
|
"aria-label": labels.common.close,
|
|
1097
|
-
children: /* @__PURE__ */
|
|
1220
|
+
children: /* @__PURE__ */ jsx11(CloseIcon, { className: "h-6 w-6" })
|
|
1098
1221
|
}
|
|
1099
1222
|
),
|
|
1100
|
-
/* @__PURE__ */
|
|
1101
|
-
/* @__PURE__ */
|
|
1102
|
-
/* @__PURE__ */
|
|
1103
|
-
/* @__PURE__ */
|
|
1104
|
-
/* @__PURE__ */
|
|
1223
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-8", children: [
|
|
1224
|
+
/* @__PURE__ */ jsx11("div", { className: "flex h-[60px] w-[60px] items-center justify-center rounded-full bg-agg-success/15", children: /* @__PURE__ */ jsx11(SuccessCheckIcon, { className: "h-6 w-6 text-agg-success" }) }),
|
|
1225
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-3 text-center", children: [
|
|
1226
|
+
/* @__PURE__ */ jsx11("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold text-agg-foreground", children: labels.deposit.successTitle }),
|
|
1227
|
+
/* @__PURE__ */ jsx11("p", { className: "agg-type-body text-agg-foreground", children: labels.deposit.successDescription })
|
|
1105
1228
|
] }),
|
|
1106
|
-
/* @__PURE__ */
|
|
1107
|
-
/* @__PURE__ */
|
|
1229
|
+
/* @__PURE__ */ jsxs11("div", { className: "w-full rounded-lg border border-agg-separator bg-agg-secondary px-3 py-1", children: [
|
|
1230
|
+
/* @__PURE__ */ jsx11(
|
|
1108
1231
|
SummaryRow2,
|
|
1109
1232
|
{
|
|
1110
1233
|
label: labels.deposit.summary.amountReceived,
|
|
1111
1234
|
value: summary.amountReceived
|
|
1112
1235
|
}
|
|
1113
1236
|
),
|
|
1114
|
-
/* @__PURE__ */
|
|
1115
|
-
/* @__PURE__ */
|
|
1116
|
-
/* @__PURE__ */
|
|
1237
|
+
/* @__PURE__ */ jsx11(SummaryRow2, { label: labels.deposit.summary.network, value: summary.network }),
|
|
1238
|
+
/* @__PURE__ */ jsx11(SummaryRow2, { label: labels.deposit.summary.fromWallet, value: summary.fromWallet }),
|
|
1239
|
+
/* @__PURE__ */ jsx11(SummaryRow2, { label: labels.deposit.summary.gasFee, value: summary.gasFee })
|
|
1117
1240
|
] }),
|
|
1118
|
-
/* @__PURE__ */
|
|
1241
|
+
/* @__PURE__ */ jsx11(Button, { variant: "secondary", size: "large", className: "w-[120px]", onClick: onDone, children: labels.deposit.done })
|
|
1119
1242
|
] })
|
|
1120
1243
|
] }) });
|
|
1121
1244
|
};
|
|
1122
1245
|
|
|
1123
1246
|
// src/deposit/index.tsx
|
|
1124
|
-
import { jsx as
|
|
1247
|
+
import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1125
1248
|
var PENDING_CARD_SESSION_KEY = "agg-pending-card-session";
|
|
1249
|
+
var DEFAULT_WALLET_CHAIN_ID = "1";
|
|
1250
|
+
var DEFAULT_WALLET_TOKEN = "USDC";
|
|
1126
1251
|
function savePendingCardSession(data) {
|
|
1127
1252
|
try {
|
|
1128
1253
|
localStorage.setItem(PENDING_CARD_SESSION_KEY, JSON.stringify(data));
|
|
@@ -1169,7 +1294,7 @@ function isControlledDepositModalProps(props) {
|
|
|
1169
1294
|
}
|
|
1170
1295
|
function DepositModalSelfDriven({ open, onOpenChange }) {
|
|
1171
1296
|
const depositProps = useDepositFlow({ open, onOpenChange });
|
|
1172
|
-
return /* @__PURE__ */
|
|
1297
|
+
return /* @__PURE__ */ jsx12(DepositModalControlled, __spreadValues({}, depositProps));
|
|
1173
1298
|
}
|
|
1174
1299
|
function DepositModalControlled({
|
|
1175
1300
|
open,
|
|
@@ -1181,6 +1306,7 @@ function DepositModalControlled({
|
|
|
1181
1306
|
onWalletAmountChange,
|
|
1182
1307
|
onWalletMax,
|
|
1183
1308
|
onConfirmWalletDeposit,
|
|
1309
|
+
onCancelWalletDeposit,
|
|
1184
1310
|
onDoneWalletDeposit,
|
|
1185
1311
|
onWalletNetworkChange,
|
|
1186
1312
|
onWalletTokenChange,
|
|
@@ -1201,10 +1327,10 @@ function DepositModalControlled({
|
|
|
1201
1327
|
onCreateCardSession,
|
|
1202
1328
|
pendingCardPurchaseSummary
|
|
1203
1329
|
}) {
|
|
1204
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i
|
|
1330
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
1205
1331
|
const { isWeb3User } = useAggAuthState();
|
|
1206
1332
|
const { walletActions } = useAggUiConfig();
|
|
1207
|
-
const labels =
|
|
1333
|
+
const labels = useLabels11();
|
|
1208
1334
|
const defaultMethod = isWeb3User ? "wallet" : "crypto";
|
|
1209
1335
|
const [step, setStep] = useState2(
|
|
1210
1336
|
() => pendingCardPurchaseSummary ? "card-success" : "method"
|
|
@@ -1263,7 +1389,10 @@ function DepositModalControlled({
|
|
|
1263
1389
|
useEffect3(() => {
|
|
1264
1390
|
if (walletNetworkOptions.length > 0) {
|
|
1265
1391
|
if (!walletChainId || !walletNetworkOptions.some((o) => o.value === walletChainId)) {
|
|
1266
|
-
const
|
|
1392
|
+
const ethereumMainnetOption = walletNetworkOptions.find(
|
|
1393
|
+
(option) => option.value === DEFAULT_WALLET_CHAIN_ID || option.value === "mainnet" || option.label.toLowerCase() === "ethereum"
|
|
1394
|
+
);
|
|
1395
|
+
const preferred = ethereumMainnetOption ? ethereumMainnetOption.value : initialWalletChainId && walletNetworkOptions.some((option) => option.value === initialWalletChainId) ? initialWalletChainId : walletNetworkOptions[0].value;
|
|
1267
1396
|
setWalletChainId(preferred);
|
|
1268
1397
|
}
|
|
1269
1398
|
}
|
|
@@ -1276,10 +1405,15 @@ function DepositModalControlled({
|
|
|
1276
1405
|
}
|
|
1277
1406
|
}, [networkOptions, sendChainId]);
|
|
1278
1407
|
useEffect3(() => {
|
|
1279
|
-
|
|
1408
|
+
var _a2, _b2;
|
|
1409
|
+
if (walletTokenOptions.length > 0) {
|
|
1410
|
+
const preferredToken = (_b2 = (_a2 = walletTokenOptions.find((option) => option.value === DEFAULT_WALLET_TOKEN)) == null ? void 0 : _a2.value) != null ? _b2 : walletTokenOptions[0].value;
|
|
1411
|
+
setWalletToken(preferredToken);
|
|
1412
|
+
}
|
|
1280
1413
|
}, [walletTokenOptions]);
|
|
1281
1414
|
useEffect3(() => {
|
|
1282
|
-
|
|
1415
|
+
var _a2, _b2;
|
|
1416
|
+
setSendToken((_b2 = (_a2 = sendTokenOptions == null ? void 0 : sendTokenOptions[0]) == null ? void 0 : _a2.value) != null ? _b2 : "");
|
|
1283
1417
|
}, [sendTokenOptions]);
|
|
1284
1418
|
useEffect3(() => {
|
|
1285
1419
|
if (walletChainId) {
|
|
@@ -1310,6 +1444,14 @@ function DepositModalControlled({
|
|
|
1310
1444
|
setStep("wallet-success");
|
|
1311
1445
|
}
|
|
1312
1446
|
}, [isWalletSubmitting, step, walletFlow.transactionStatus]);
|
|
1447
|
+
useEffect3(() => {
|
|
1448
|
+
if (!onCancelWalletDeposit) return;
|
|
1449
|
+
if (step === "wallet-processing" && !isWalletSubmitting && walletFlow.transactionStatus === "error") {
|
|
1450
|
+
walletSubmitInFlightRef.current = false;
|
|
1451
|
+
onCancelWalletDeposit();
|
|
1452
|
+
setStep("wallet-form");
|
|
1453
|
+
}
|
|
1454
|
+
}, [isWalletSubmitting, onCancelWalletDeposit, step, walletFlow.transactionStatus]);
|
|
1313
1455
|
const cardTokenOptions = withTokenIcons(
|
|
1314
1456
|
mergeSelectOptionsUnique(cardFlow == null ? void 0 : cardFlow.tokenOptions, DEFAULT_CURRENCY_OPTIONS)
|
|
1315
1457
|
);
|
|
@@ -1362,7 +1504,7 @@ function DepositModalControlled({
|
|
|
1362
1504
|
}
|
|
1363
1505
|
};
|
|
1364
1506
|
const handleSelectProvider = (providerId) => __async(null, null, function* () {
|
|
1365
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2,
|
|
1507
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j, _k, _l, _m;
|
|
1366
1508
|
onSelectCardProvider == null ? void 0 : onSelectCardProvider(providerId);
|
|
1367
1509
|
if (onCreateCardSession) {
|
|
1368
1510
|
setSessionError(null);
|
|
@@ -1380,7 +1522,7 @@ function DepositModalControlled({
|
|
|
1380
1522
|
redirectUrl: cardRedirectUrl
|
|
1381
1523
|
});
|
|
1382
1524
|
const selectedProvider = cardProviders.find((p) => p.id === providerId);
|
|
1383
|
-
const networkLabel = (
|
|
1525
|
+
const networkLabel = (_j = (_i2 = (_h2 = (_g2 = cardFlow == null ? void 0 : cardFlow.networkOptions) == null ? void 0 : _g2.find((o) => o.value === (cardFlow == null ? void 0 : cardFlow.selectedNetwork))) == null ? void 0 : _h2.label) != null ? _i2 : cardFlow == null ? void 0 : cardFlow.selectedNetwork) != null ? _j : "";
|
|
1384
1526
|
savePendingCardSession({
|
|
1385
1527
|
sessionId: session.id,
|
|
1386
1528
|
summary: {
|
|
@@ -1445,13 +1587,14 @@ function DepositModalControlled({
|
|
|
1445
1587
|
onOpenChange(isOpen);
|
|
1446
1588
|
};
|
|
1447
1589
|
const depositModalMaxWidth = step === "method" ? "600px" : "480px";
|
|
1448
|
-
return /* @__PURE__ */
|
|
1449
|
-
step === "method" ? /* @__PURE__ */
|
|
1590
|
+
return /* @__PURE__ */ jsx12(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs12(Modal.Container, { maxWidth: depositModalMaxWidth, "aria-label": "Deposit", children: [
|
|
1591
|
+
step === "method" ? /* @__PURE__ */ jsx12(
|
|
1450
1592
|
DepositMethodStep,
|
|
1451
1593
|
{
|
|
1452
1594
|
balance: walletFlow.balance,
|
|
1453
1595
|
walletLabel: walletFlow.walletLabel,
|
|
1454
1596
|
walletBalance: walletFlow.walletBalance,
|
|
1597
|
+
walletToken,
|
|
1455
1598
|
isWalletBalanceLoading: walletFlow.isWalletBalanceLoading,
|
|
1456
1599
|
showWalletMethod: isWeb3User,
|
|
1457
1600
|
highlightedMethod,
|
|
@@ -1459,7 +1602,7 @@ function DepositModalControlled({
|
|
|
1459
1602
|
onSelectMethod: handleSelectMethod
|
|
1460
1603
|
}
|
|
1461
1604
|
) : null,
|
|
1462
|
-
step === "wallet-form" ? /* @__PURE__ */
|
|
1605
|
+
step === "wallet-form" ? /* @__PURE__ */ jsx12(
|
|
1463
1606
|
WalletFormStep,
|
|
1464
1607
|
{
|
|
1465
1608
|
walletLabel: walletFlow.walletLabel,
|
|
@@ -1523,7 +1666,7 @@ function DepositModalControlled({
|
|
|
1523
1666
|
})
|
|
1524
1667
|
}
|
|
1525
1668
|
) : null,
|
|
1526
|
-
step === "wallet-processing" ? /* @__PURE__ */
|
|
1669
|
+
step === "wallet-processing" ? /* @__PURE__ */ jsx12(
|
|
1527
1670
|
WalletProcessingStep,
|
|
1528
1671
|
{
|
|
1529
1672
|
steps: processingSteps,
|
|
@@ -1531,7 +1674,7 @@ function DepositModalControlled({
|
|
|
1531
1674
|
onComplete: () => setStep("wallet-success")
|
|
1532
1675
|
}
|
|
1533
1676
|
) : null,
|
|
1534
|
-
step === "wallet-success" ? /* @__PURE__ */
|
|
1677
|
+
step === "wallet-success" ? /* @__PURE__ */ jsx12(
|
|
1535
1678
|
WalletSuccessStep,
|
|
1536
1679
|
{
|
|
1537
1680
|
summary: resolvedSuccessSummary,
|
|
@@ -1539,7 +1682,7 @@ function DepositModalControlled({
|
|
|
1539
1682
|
onClose: () => handleOpenChange(false)
|
|
1540
1683
|
}
|
|
1541
1684
|
) : null,
|
|
1542
|
-
step === "card-deposit" && cardFlow ? /* @__PURE__ */
|
|
1685
|
+
step === "card-deposit" && cardFlow ? /* @__PURE__ */ jsx12(
|
|
1543
1686
|
CardDepositStep,
|
|
1544
1687
|
{
|
|
1545
1688
|
amount: cardFlow.amount,
|
|
@@ -1561,7 +1704,7 @@ function DepositModalControlled({
|
|
|
1561
1704
|
onContinue: handleContinueCardDeposit
|
|
1562
1705
|
}
|
|
1563
1706
|
) : null,
|
|
1564
|
-
step === "card-provider" && cardFlow ? /* @__PURE__ */
|
|
1707
|
+
step === "card-provider" && cardFlow ? /* @__PURE__ */ jsx12(
|
|
1565
1708
|
CardProviderStep,
|
|
1566
1709
|
{
|
|
1567
1710
|
amount: cardFlow.amount,
|
|
@@ -1576,7 +1719,7 @@ function DepositModalControlled({
|
|
|
1576
1719
|
onRetry: handleRetryQuotes
|
|
1577
1720
|
}
|
|
1578
1721
|
) : null,
|
|
1579
|
-
step === "card-payment-pending" ? /* @__PURE__ */
|
|
1722
|
+
step === "card-payment-pending" ? /* @__PURE__ */ jsx12(
|
|
1580
1723
|
CardPaymentPendingStep,
|
|
1581
1724
|
{
|
|
1582
1725
|
providerName: pendingProviderName,
|
|
@@ -1586,7 +1729,7 @@ function DepositModalControlled({
|
|
|
1586
1729
|
onChooseAnotherProvider: handleChooseAnotherProvider
|
|
1587
1730
|
}
|
|
1588
1731
|
) : null,
|
|
1589
|
-
step === "card-success" ? /* @__PURE__ */
|
|
1732
|
+
step === "card-success" ? /* @__PURE__ */ jsx12(
|
|
1590
1733
|
CardPurchaseSuccessStep,
|
|
1591
1734
|
{
|
|
1592
1735
|
summary: (_g = pendingCardPurchaseSummary != null ? pendingCardPurchaseSummary : cardFlow == null ? void 0 : cardFlow.purchaseSummary) != null ? _g : {
|
|
@@ -1598,7 +1741,7 @@ function DepositModalControlled({
|
|
|
1598
1741
|
onDone: handleDoneCardPurchase
|
|
1599
1742
|
}
|
|
1600
1743
|
) : null,
|
|
1601
|
-
step === "crypto-transfer" ? /* @__PURE__ */
|
|
1744
|
+
step === "crypto-transfer" ? /* @__PURE__ */ jsx12(
|
|
1602
1745
|
CryptoTransferStep,
|
|
1603
1746
|
{
|
|
1604
1747
|
tokenOptions: sendTokenOptions,
|
|
@@ -1607,15 +1750,16 @@ function DepositModalControlled({
|
|
|
1607
1750
|
selectedNetwork: sendChainId,
|
|
1608
1751
|
depositAddress,
|
|
1609
1752
|
minDeposit: (_h = sendCryptoConfig == null ? void 0 : sendCryptoConfig.minDeposit) != null ? _h : "$1",
|
|
1610
|
-
|
|
1611
|
-
eta: (_j = sendCryptoConfig == null ? void 0 : sendCryptoConfig.eta) != null ? _j : "~30s",
|
|
1753
|
+
eta: (_i = sendCryptoConfig == null ? void 0 : sendCryptoConfig.eta) != null ? _i : "~30s",
|
|
1612
1754
|
isLoadingAddress,
|
|
1613
1755
|
addressError,
|
|
1614
1756
|
onBack: () => setStep("method"),
|
|
1615
1757
|
onTokenChange: setSendToken,
|
|
1616
1758
|
onNetworkChange: (id) => {
|
|
1617
1759
|
setSendChainId(id);
|
|
1618
|
-
|
|
1760
|
+
if (id !== sendChainId) {
|
|
1761
|
+
setSendToken("");
|
|
1762
|
+
}
|
|
1619
1763
|
},
|
|
1620
1764
|
onDone: handleDoneCryptoTransfer
|
|
1621
1765
|
}
|
|
@@ -1624,33 +1768,33 @@ function DepositModalControlled({
|
|
|
1624
1768
|
}
|
|
1625
1769
|
var DepositModal = (props) => {
|
|
1626
1770
|
if (!isControlledDepositModalProps(props)) {
|
|
1627
|
-
return /* @__PURE__ */
|
|
1771
|
+
return /* @__PURE__ */ jsx12(DepositModalSelfDriven, __spreadValues({}, props));
|
|
1628
1772
|
}
|
|
1629
|
-
return /* @__PURE__ */
|
|
1773
|
+
return /* @__PURE__ */ jsx12(DepositModalControlled, __spreadValues({}, props));
|
|
1630
1774
|
};
|
|
1631
1775
|
DepositModal.displayName = "DepositModal";
|
|
1632
1776
|
|
|
1633
1777
|
// src/withdraw/index.tsx
|
|
1634
|
-
import { useEffect as
|
|
1635
|
-
import { useWithdrawFlow } from "@agg-build/hooks/withdraw";
|
|
1778
|
+
import { useEffect as useEffect4, useState as useState3 } from "react";
|
|
1779
|
+
import { useWithdrawalLifecycle, useWithdrawFlow } from "@agg-build/hooks/withdraw";
|
|
1636
1780
|
|
|
1637
1781
|
// src/withdraw/steps/withdraw-method.tsx
|
|
1638
|
-
import { useLabels as
|
|
1639
|
-
import { Fragment as Fragment7, jsx as
|
|
1782
|
+
import { useLabels as useLabels12 } from "@agg-build/hooks";
|
|
1783
|
+
import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1640
1784
|
var WithdrawMethodStep = ({
|
|
1641
1785
|
balance,
|
|
1642
1786
|
onSelectMethod
|
|
1643
1787
|
}) => {
|
|
1644
|
-
const labels =
|
|
1645
|
-
return /* @__PURE__ */
|
|
1646
|
-
/* @__PURE__ */
|
|
1647
|
-
/* @__PURE__ */
|
|
1648
|
-
/* @__PURE__ */
|
|
1788
|
+
const labels = useLabels12();
|
|
1789
|
+
return /* @__PURE__ */ jsxs13(Fragment7, { children: [
|
|
1790
|
+
/* @__PURE__ */ jsx13(Modal.Header, { title: labels.withdraw.title, hideBorder: true }),
|
|
1791
|
+
/* @__PURE__ */ jsx13(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-5", children: [
|
|
1792
|
+
/* @__PURE__ */ jsxs13("p", { className: "agg-type-body text-agg-foreground", children: [
|
|
1649
1793
|
labels.withdraw.balancePrefix,
|
|
1650
1794
|
" ",
|
|
1651
1795
|
formatCompactUsd(balance)
|
|
1652
1796
|
] }),
|
|
1653
|
-
/* @__PURE__ */
|
|
1797
|
+
/* @__PURE__ */ jsxs13(
|
|
1654
1798
|
"div",
|
|
1655
1799
|
{
|
|
1656
1800
|
className: cn(
|
|
@@ -1667,12 +1811,12 @@ var WithdrawMethodStep = ({
|
|
|
1667
1811
|
}
|
|
1668
1812
|
},
|
|
1669
1813
|
children: [
|
|
1670
|
-
/* @__PURE__ */
|
|
1671
|
-
/* @__PURE__ */
|
|
1672
|
-
/* @__PURE__ */
|
|
1673
|
-
/* @__PURE__ */
|
|
1814
|
+
/* @__PURE__ */ jsx13("div", { className: "shrink-0 flex items-center justify-center h-10 w-10 rounded-lg bg-agg-secondary-hover", children: /* @__PURE__ */ jsx13(WalletIcon, { className: "h-6 w-6 text-agg-muted-foreground" }) }),
|
|
1815
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex-1 min-w-0", children: [
|
|
1816
|
+
/* @__PURE__ */ jsx13("p", { className: "agg-type-body-strong text-agg-foreground", children: labels.withdraw.methods.walletTitle }),
|
|
1817
|
+
/* @__PURE__ */ jsx13("p", { className: "agg-type-label text-agg-muted-foreground", children: labels.withdraw.methods.walletDescription })
|
|
1674
1818
|
] }),
|
|
1675
|
-
/* @__PURE__ */
|
|
1819
|
+
/* @__PURE__ */ jsx13("div", { className: "shrink-0 text-agg-muted-foreground", children: /* @__PURE__ */ jsx13(ChevronRightIcon, { className: "h-5 w-5" }) })
|
|
1676
1820
|
]
|
|
1677
1821
|
}
|
|
1678
1822
|
)
|
|
@@ -1681,8 +1825,8 @@ var WithdrawMethodStep = ({
|
|
|
1681
1825
|
};
|
|
1682
1826
|
|
|
1683
1827
|
// src/withdraw/steps/withdraw-amount.tsx
|
|
1684
|
-
import { useLabels as
|
|
1685
|
-
import { Fragment as Fragment8, jsx as
|
|
1828
|
+
import { useLabels as useLabels13, useWithdrawEstimate as useWithdrawEstimate2 } from "@agg-build/hooks";
|
|
1829
|
+
import { Fragment as Fragment8, jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1686
1830
|
var WithdrawAmountStep = ({
|
|
1687
1831
|
amount,
|
|
1688
1832
|
destinationWallet,
|
|
@@ -1701,114 +1845,123 @@ var WithdrawAmountStep = ({
|
|
|
1701
1845
|
onMaxClick,
|
|
1702
1846
|
onContinue
|
|
1703
1847
|
}) => {
|
|
1704
|
-
const labels =
|
|
1848
|
+
const labels = useLabels13();
|
|
1705
1849
|
const SOLANA_CHAIN_ID = "792703809";
|
|
1706
1850
|
const isSolanaDest = selectedNetwork === SOLANA_CHAIN_ID;
|
|
1707
1851
|
const trimmedDestination = destinationWallet.trim();
|
|
1708
1852
|
const isValidAddress = isSolanaDest ? /^[1-9A-HJ-NP-Za-km-z]{32,44}$/.test(trimmedDestination) : /^0x[a-fA-F0-9]{40}$/.test(trimmedDestination);
|
|
1709
1853
|
const isValid = Number(amount) > 0 && isValidAddress;
|
|
1710
1854
|
const isDisabled = !isValid || isConfirming;
|
|
1711
|
-
|
|
1712
|
-
|
|
1855
|
+
const withdrawEstimate = useWithdrawEstimate2({
|
|
1856
|
+
amount,
|
|
1857
|
+
selectedToken,
|
|
1858
|
+
selectedNetwork
|
|
1859
|
+
});
|
|
1860
|
+
const shouldShowWithdrawEstimate = Boolean(withdrawEstimate);
|
|
1861
|
+
return /* @__PURE__ */ jsxs14(Fragment8, { children: [
|
|
1862
|
+
/* @__PURE__ */ jsx14(
|
|
1713
1863
|
Modal.Header,
|
|
1714
1864
|
{
|
|
1715
1865
|
title: labels.withdraw.walletFlow.title,
|
|
1716
1866
|
hideBorder: true,
|
|
1717
|
-
leftElement: /* @__PURE__ */
|
|
1867
|
+
leftElement: /* @__PURE__ */ jsx14(
|
|
1718
1868
|
"button",
|
|
1719
1869
|
{
|
|
1720
1870
|
type: "button",
|
|
1721
1871
|
className: "mr-2 flex items-center justify-center text-agg-foreground transition-colors hover:cursor-pointer hover:text-agg-foreground/80",
|
|
1722
1872
|
onClick: onBack,
|
|
1723
1873
|
"aria-label": labels.withdraw.back,
|
|
1724
|
-
children: /* @__PURE__ */
|
|
1874
|
+
children: /* @__PURE__ */ jsx14(ChevronLeftIcon, { className: "h-6 w-6" })
|
|
1725
1875
|
}
|
|
1726
1876
|
)
|
|
1727
1877
|
}
|
|
1728
1878
|
),
|
|
1729
|
-
/* @__PURE__ */
|
|
1730
|
-
/* @__PURE__ */
|
|
1731
|
-
/* @__PURE__ */
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
{
|
|
1735
|
-
type: "text",
|
|
1736
|
-
"aria-label": labels.withdraw.walletFlow.recipientAddressLabel,
|
|
1737
|
-
className: cn(
|
|
1738
|
-
"agg-type-body w-full h-10 rounded border border-agg-separator bg-agg-secondary px-3 outline-none",
|
|
1739
|
-
"text-agg-foreground placeholder:text-agg-muted-foreground",
|
|
1740
|
-
"focus:border-agg-primary transition-colors"
|
|
1741
|
-
),
|
|
1742
|
-
placeholder: isSolanaDest ? "FwR3..." : "0x971d...",
|
|
1743
|
-
value: destinationWallet,
|
|
1744
|
-
onChange: (e) => onDestinationChange(e.target.value)
|
|
1745
|
-
}
|
|
1746
|
-
)
|
|
1747
|
-
] }),
|
|
1748
|
-
/* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-2", children: [
|
|
1749
|
-
/* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-between", children: [
|
|
1750
|
-
/* @__PURE__ */ jsx13("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.withdraw.walletFlow.amountLabel }),
|
|
1751
|
-
/* @__PURE__ */ jsxs13("p", { className: "agg-type-label text-agg-muted-foreground", children: [
|
|
1752
|
-
labels.withdraw.balancePrefix,
|
|
1753
|
-
" ",
|
|
1754
|
-
balanceDisplay
|
|
1755
|
-
] })
|
|
1756
|
-
] }),
|
|
1757
|
-
/* @__PURE__ */ jsxs13("div", { className: "flex h-10 items-center gap-2 rounded border border-agg-separator bg-agg-secondary px-3 focus-within:border-agg-primary transition-colors", children: [
|
|
1758
|
-
/* @__PURE__ */ jsx13(
|
|
1879
|
+
/* @__PURE__ */ jsx14(Modal.Body, { classNames: { root: "px-5 pt-0 pb-6 sm:px-8 sm:pt-0 sm:pb-8" }, children: /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-5", children: [
|
|
1880
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-5", children: [
|
|
1881
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-2", children: [
|
|
1882
|
+
/* @__PURE__ */ jsx14("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.withdraw.walletFlow.recipientAddressLabel }),
|
|
1883
|
+
/* @__PURE__ */ jsx14(
|
|
1759
1884
|
"input",
|
|
1760
1885
|
{
|
|
1761
1886
|
type: "text",
|
|
1762
|
-
|
|
1763
|
-
"aria-label": labels.withdraw.walletFlow.amountLabel,
|
|
1887
|
+
"aria-label": labels.withdraw.walletFlow.recipientAddressLabel,
|
|
1764
1888
|
className: cn(
|
|
1765
|
-
"agg-type-body
|
|
1766
|
-
|
|
1889
|
+
"agg-type-body w-full h-10 rounded border border-agg-separator bg-agg-secondary px-3 outline-none",
|
|
1890
|
+
"text-agg-foreground placeholder:text-agg-muted-foreground",
|
|
1891
|
+
"focus:border-agg-primary transition-colors"
|
|
1767
1892
|
),
|
|
1768
|
-
placeholder: "
|
|
1769
|
-
value:
|
|
1770
|
-
onChange: (e) =>
|
|
1771
|
-
}
|
|
1772
|
-
),
|
|
1773
|
-
/* @__PURE__ */ jsx13("span", { className: "agg-type-body text-agg-muted-foreground shrink-0", children: selectedToken }),
|
|
1774
|
-
onMaxClick ? /* @__PURE__ */ jsx13(
|
|
1775
|
-
"button",
|
|
1776
|
-
{
|
|
1777
|
-
type: "button",
|
|
1778
|
-
className: "agg-type-label-strong text-agg-primary hover:opacity-80 transition-opacity cursor-pointer shrink-0",
|
|
1779
|
-
onClick: onMaxClick,
|
|
1780
|
-
children: labels.withdraw.walletFlow.max
|
|
1781
|
-
}
|
|
1782
|
-
) : null
|
|
1783
|
-
] })
|
|
1784
|
-
] }),
|
|
1785
|
-
/* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-3 sm:flex-row sm:gap-5", children: [
|
|
1786
|
-
/* @__PURE__ */ jsxs13("div", { className: "flex-1 flex flex-col gap-2 min-w-0", children: [
|
|
1787
|
-
/* @__PURE__ */ jsx13("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.withdraw.walletFlow.tokenLabel }),
|
|
1788
|
-
/* @__PURE__ */ jsx13(
|
|
1789
|
-
Select,
|
|
1790
|
-
{
|
|
1791
|
-
items: tokenOptions,
|
|
1792
|
-
value: selectedToken,
|
|
1793
|
-
onChange: onTokenChange,
|
|
1794
|
-
ariaLabel: labels.withdraw.walletFlow.tokenLabel
|
|
1893
|
+
placeholder: isSolanaDest ? "FwR3..." : "0x971d...",
|
|
1894
|
+
value: destinationWallet,
|
|
1895
|
+
onChange: (e) => onDestinationChange(e.target.value)
|
|
1795
1896
|
}
|
|
1796
1897
|
)
|
|
1797
1898
|
] }),
|
|
1798
|
-
/* @__PURE__ */
|
|
1799
|
-
/* @__PURE__ */
|
|
1800
|
-
|
|
1801
|
-
|
|
1802
|
-
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
|
|
1806
|
-
|
|
1807
|
-
|
|
1808
|
-
|
|
1809
|
-
|
|
1899
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-2", children: [
|
|
1900
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-between", children: [
|
|
1901
|
+
/* @__PURE__ */ jsx14("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.withdraw.walletFlow.amountLabel }),
|
|
1902
|
+
/* @__PURE__ */ jsxs14("p", { className: "agg-type-label text-agg-muted-foreground", children: [
|
|
1903
|
+
labels.withdraw.balancePrefix,
|
|
1904
|
+
" ",
|
|
1905
|
+
balanceDisplay
|
|
1906
|
+
] })
|
|
1907
|
+
] }),
|
|
1908
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex h-10 items-center gap-2 rounded border border-agg-separator bg-agg-secondary px-3 focus-within:border-agg-primary transition-colors", children: [
|
|
1909
|
+
/* @__PURE__ */ jsx14(
|
|
1910
|
+
"input",
|
|
1911
|
+
{
|
|
1912
|
+
type: "text",
|
|
1913
|
+
inputMode: "decimal",
|
|
1914
|
+
"aria-label": labels.withdraw.walletFlow.amountLabel,
|
|
1915
|
+
className: cn(
|
|
1916
|
+
"agg-type-body flex-1 min-w-0 bg-transparent outline-none",
|
|
1917
|
+
Number(amount) > 0 ? "text-agg-foreground" : "text-agg-muted-foreground"
|
|
1918
|
+
),
|
|
1919
|
+
placeholder: "0.00",
|
|
1920
|
+
value: amount,
|
|
1921
|
+
onChange: (e) => onAmountChange(e.target.value)
|
|
1922
|
+
}
|
|
1923
|
+
),
|
|
1924
|
+
/* @__PURE__ */ jsx14("span", { className: "agg-type-body text-agg-muted-foreground shrink-0", children: selectedToken }),
|
|
1925
|
+
onMaxClick ? /* @__PURE__ */ jsx14(
|
|
1926
|
+
"button",
|
|
1927
|
+
{
|
|
1928
|
+
type: "button",
|
|
1929
|
+
className: "agg-type-label-strong text-agg-primary hover:opacity-80 transition-opacity cursor-pointer shrink-0",
|
|
1930
|
+
onClick: onMaxClick,
|
|
1931
|
+
children: labels.withdraw.walletFlow.max
|
|
1932
|
+
}
|
|
1933
|
+
) : null
|
|
1934
|
+
] })
|
|
1935
|
+
] }),
|
|
1936
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-3 sm:flex-row sm:gap-5", children: [
|
|
1937
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex-1 flex flex-col gap-2 min-w-0", children: [
|
|
1938
|
+
/* @__PURE__ */ jsx14("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.withdraw.walletFlow.tokenLabel }),
|
|
1939
|
+
/* @__PURE__ */ jsx14(
|
|
1940
|
+
Select,
|
|
1941
|
+
{
|
|
1942
|
+
items: tokenOptions,
|
|
1943
|
+
value: selectedToken,
|
|
1944
|
+
onChange: onTokenChange,
|
|
1945
|
+
ariaLabel: labels.withdraw.walletFlow.tokenLabel
|
|
1946
|
+
}
|
|
1947
|
+
)
|
|
1948
|
+
] }),
|
|
1949
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex-1 flex flex-col gap-2 min-w-0", children: [
|
|
1950
|
+
/* @__PURE__ */ jsx14("p", { className: "agg-type-label-strong text-agg-foreground", children: labels.withdraw.walletFlow.networkLabel }),
|
|
1951
|
+
/* @__PURE__ */ jsx14(
|
|
1952
|
+
Select,
|
|
1953
|
+
{
|
|
1954
|
+
items: networkOptions,
|
|
1955
|
+
value: selectedNetwork,
|
|
1956
|
+
onChange: onNetworkChange,
|
|
1957
|
+
ariaLabel: labels.withdraw.walletFlow.networkLabel
|
|
1958
|
+
}
|
|
1959
|
+
)
|
|
1960
|
+
] })
|
|
1961
|
+
] }),
|
|
1962
|
+
shouldShowWithdrawEstimate && withdrawEstimate ? /* @__PURE__ */ jsx14(TransferFeeSummary, { estimate: withdrawEstimate, view: "withdraw" }) : null
|
|
1810
1963
|
] }),
|
|
1811
|
-
/* @__PURE__ */
|
|
1964
|
+
/* @__PURE__ */ jsx14(
|
|
1812
1965
|
Button,
|
|
1813
1966
|
{
|
|
1814
1967
|
variant: isValid && !isConfirming ? "primary" : "secondary",
|
|
@@ -1819,107 +1972,32 @@ var WithdrawAmountStep = ({
|
|
|
1819
1972
|
children: isConfirming ? labels.common.loading : labels.withdraw.walletFlow.confirm
|
|
1820
1973
|
}
|
|
1821
1974
|
),
|
|
1822
|
-
error ? /* @__PURE__ */
|
|
1975
|
+
error ? /* @__PURE__ */ jsx14("p", { className: "agg-type-label text-agg-error text-center", role: "alert", children: error }) : null
|
|
1823
1976
|
] }) })
|
|
1824
1977
|
] });
|
|
1825
1978
|
};
|
|
1826
1979
|
|
|
1827
1980
|
// src/withdraw/steps/withdraw-success.tsx
|
|
1828
|
-
import {
|
|
1829
|
-
import {
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
var CHAIN_LABELS = {
|
|
1834
|
-
1: "Ethereum",
|
|
1835
|
-
10: "Optimism",
|
|
1836
|
-
56: "BNB Chain",
|
|
1837
|
-
137: "Polygon",
|
|
1838
|
-
8453: "Base",
|
|
1839
|
-
42161: "Arbitrum",
|
|
1840
|
-
43114: "Avalanche",
|
|
1841
|
-
11155111: "Sepolia",
|
|
1842
|
-
792703809: "Solana"
|
|
1843
|
-
};
|
|
1844
|
-
var resolveChainLabel = (chainId) => {
|
|
1845
|
-
var _a;
|
|
1846
|
-
return (_a = CHAIN_LABELS[chainId]) != null ? _a : `Chain ${chainId}`;
|
|
1847
|
-
};
|
|
1848
|
-
var legStepStatusFor = (legStatus) => {
|
|
1849
|
-
switch (legStatus) {
|
|
1850
|
-
case "confirmed":
|
|
1851
|
-
return "complete";
|
|
1852
|
-
case "failed":
|
|
1853
|
-
return "error";
|
|
1854
|
-
case "submitted":
|
|
1855
|
-
case "planned":
|
|
1856
|
-
default:
|
|
1857
|
-
return "pending";
|
|
1858
|
-
}
|
|
1859
|
-
};
|
|
1860
|
-
var legStepLabel = (leg, labels) => {
|
|
1861
|
-
if (leg.type === "bridge") {
|
|
1862
|
-
return labels.bridge(resolveChainLabel(leg.sourceChainId), resolveChainLabel(leg.destChainId));
|
|
1863
|
-
}
|
|
1864
|
-
return labels.transfer(resolveChainLabel(leg.destChainId));
|
|
1865
|
-
};
|
|
1866
|
-
var finalStepStatusFor = (status) => {
|
|
1867
|
-
switch (status) {
|
|
1868
|
-
case "completed":
|
|
1869
|
-
return "complete";
|
|
1870
|
-
case "partial":
|
|
1871
|
-
return "warning";
|
|
1872
|
-
case "failed":
|
|
1873
|
-
return "error";
|
|
1874
|
-
case "pending":
|
|
1875
|
-
case "bridging":
|
|
1876
|
-
case "transferring":
|
|
1877
|
-
default:
|
|
1878
|
-
return "pending";
|
|
1879
|
-
}
|
|
1880
|
-
};
|
|
1881
|
-
var finalStepLabelFor = (status, pending, walletFlowLabels) => {
|
|
1882
|
-
var _a;
|
|
1883
|
-
if (pending || status === null) {
|
|
1884
|
-
return walletFlowLabels.lifecycle.pending;
|
|
1885
|
-
}
|
|
1886
|
-
return (_a = walletFlowLabels.lifecycle[status]) != null ? _a : walletFlowLabels.lifecycle.pending;
|
|
1887
|
-
};
|
|
1888
|
-
var buildWithdrawalLifecycleSteps = ({
|
|
1889
|
-
pending,
|
|
1890
|
-
status,
|
|
1891
|
-
legs,
|
|
1892
|
-
walletFlowLabels
|
|
1893
|
-
}) => {
|
|
1894
|
-
const stepLabels = walletFlowLabels.lifecycle.steps;
|
|
1895
|
-
const legSteps = legs.map((leg, index) => ({
|
|
1896
|
-
id: `leg-${index}-${leg.type}-${leg.sourceChainId}-${leg.destChainId}`,
|
|
1897
|
-
label: legStepLabel(leg, stepLabels),
|
|
1898
|
-
status: legStepStatusFor(leg.status)
|
|
1899
|
-
}));
|
|
1900
|
-
const groups = legSteps.length > 0 ? [legSteps] : [];
|
|
1901
|
-
const finalStep = {
|
|
1902
|
-
id: `final-${status != null ? status : "pending"}`,
|
|
1903
|
-
label: finalStepLabelFor(status, pending, walletFlowLabels),
|
|
1904
|
-
status: finalStepStatusFor(status != null ? status : "pending")
|
|
1905
|
-
};
|
|
1906
|
-
return {
|
|
1907
|
-
groups,
|
|
1908
|
-
finalStep,
|
|
1909
|
-
hasDetails: legSteps.length > 0
|
|
1910
|
-
};
|
|
1911
|
-
};
|
|
1912
|
-
|
|
1913
|
-
// src/withdraw/steps/withdraw-success.tsx
|
|
1914
|
-
import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1915
|
-
var SummaryRow3 = ({ label, value }) => /* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-between border-b border-agg-separator py-2 last:border-b-0", children: [
|
|
1916
|
-
/* @__PURE__ */ jsx14("p", { className: "text-[12px] leading-4 font-agg-bold uppercase text-agg-muted-foreground", children: label }),
|
|
1917
|
-
/* @__PURE__ */ jsx14("p", { className: "agg-type-label text-agg-foreground", children: value })
|
|
1981
|
+
import { useLabels as useLabels14, useSdkUiConfig } from "@agg-build/hooks";
|
|
1982
|
+
import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1983
|
+
var SummaryRow3 = ({ label, value }) => /* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-between gap-4 border-b border-agg-separator py-2 last:border-b-0", children: [
|
|
1984
|
+
/* @__PURE__ */ jsx15("p", { className: "min-w-0 text-[12px] leading-4 font-agg-bold uppercase text-agg-muted-foreground", children: label }),
|
|
1985
|
+
/* @__PURE__ */ jsx15("p", { className: "min-w-0 text-right text-[14px] leading-5 text-agg-foreground", children: value })
|
|
1918
1986
|
] });
|
|
1987
|
+
var WithdrawCloseButton = ({ onClose, label }) => /* @__PURE__ */ jsx15(
|
|
1988
|
+
"button",
|
|
1989
|
+
{
|
|
1990
|
+
type: "button",
|
|
1991
|
+
className: "absolute right-8 top-7 flex cursor-pointer items-center justify-center text-agg-foreground transition-colors hover:text-agg-foreground/80 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary",
|
|
1992
|
+
onClick: onClose,
|
|
1993
|
+
"aria-label": label,
|
|
1994
|
+
children: /* @__PURE__ */ jsx15(CloseIcon, { className: "h-6 w-6" })
|
|
1995
|
+
}
|
|
1996
|
+
);
|
|
1919
1997
|
var LoadingGlyph = ({
|
|
1920
1998
|
className,
|
|
1921
1999
|
enableAnimations
|
|
1922
|
-
}) => /* @__PURE__ */
|
|
2000
|
+
}) => /* @__PURE__ */ jsx15(
|
|
1923
2001
|
"span",
|
|
1924
2002
|
{
|
|
1925
2003
|
"aria-hidden": "true",
|
|
@@ -1930,213 +2008,242 @@ var LoadingGlyph = ({
|
|
|
1930
2008
|
)
|
|
1931
2009
|
}
|
|
1932
2010
|
);
|
|
1933
|
-
var
|
|
1934
|
-
|
|
1935
|
-
|
|
1936
|
-
|
|
1937
|
-
|
|
1938
|
-
|
|
1939
|
-
|
|
1940
|
-
|
|
1941
|
-
|
|
1942
|
-
|
|
1943
|
-
|
|
1944
|
-
|
|
2011
|
+
var loadingActiveIndexFor = (state) => {
|
|
2012
|
+
if (state.status === "transferring") return 2;
|
|
2013
|
+
if (state.status === "bridging") return 1;
|
|
2014
|
+
return 0;
|
|
2015
|
+
};
|
|
2016
|
+
var getLoadingSteps = (labels) => [
|
|
2017
|
+
{ id: "preparing", label: labels.lifecycle.loadingSteps.preparing },
|
|
2018
|
+
{ id: "bridging", label: labels.lifecycle.loadingSteps.bridging },
|
|
2019
|
+
{ id: "sending", label: labels.lifecycle.loadingSteps.sending },
|
|
2020
|
+
{ id: "confirming", label: labels.lifecycle.loadingSteps.confirming }
|
|
2021
|
+
];
|
|
2022
|
+
var WithdrawLoadingStep = ({
|
|
2023
|
+
lifecycleState,
|
|
2024
|
+
onClose
|
|
2025
|
+
}) => {
|
|
2026
|
+
const labels = useLabels14();
|
|
2027
|
+
const {
|
|
2028
|
+
features: { enableAnimations }
|
|
2029
|
+
} = useSdkUiConfig();
|
|
2030
|
+
const walletFlowLabels = labels.withdraw.walletFlow;
|
|
2031
|
+
const activeIndex = loadingActiveIndexFor(lifecycleState);
|
|
2032
|
+
const loadingSteps = getLoadingSteps(walletFlowLabels);
|
|
2033
|
+
return /* @__PURE__ */ jsx15("div", { className: "relative", children: /* @__PURE__ */ jsx15(Modal.Body, { classNames: { root: "px-8 py-7" }, children: /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-7", children: [
|
|
2034
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-between gap-4", children: [
|
|
2035
|
+
/* @__PURE__ */ jsx15("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold text-agg-foreground", children: walletFlowLabels.successTitle }),
|
|
2036
|
+
/* @__PURE__ */ jsx15(
|
|
2037
|
+
"button",
|
|
2038
|
+
{
|
|
2039
|
+
type: "button",
|
|
2040
|
+
className: "flex cursor-pointer items-center justify-center text-agg-foreground transition-colors hover:text-agg-foreground/80 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary",
|
|
2041
|
+
onClick: onClose,
|
|
2042
|
+
"aria-label": labels.common.close,
|
|
2043
|
+
children: /* @__PURE__ */ jsx15(CloseIcon, { className: "h-6 w-6" })
|
|
2044
|
+
}
|
|
2045
|
+
)
|
|
2046
|
+
] }),
|
|
2047
|
+
/* @__PURE__ */ jsx15("div", { className: "flex flex-col gap-5", role: "status", "aria-live": "polite", children: loadingSteps.map((step, index) => {
|
|
2048
|
+
const isComplete = index < activeIndex;
|
|
2049
|
+
const isActive = index === activeIndex;
|
|
2050
|
+
const textClassName = isActive || isComplete ? "text-agg-foreground" : "text-agg-muted-foreground";
|
|
2051
|
+
return /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-3", children: [
|
|
2052
|
+
isComplete ? /* @__PURE__ */ jsx15(
|
|
2053
|
+
Icon,
|
|
2054
|
+
{
|
|
2055
|
+
name: "check-circle",
|
|
2056
|
+
size: "small",
|
|
2057
|
+
className: "h-4 w-4 shrink-0 text-agg-primary",
|
|
2058
|
+
"aria-hidden": "true"
|
|
2059
|
+
}
|
|
2060
|
+
) : null,
|
|
2061
|
+
isActive ? /* @__PURE__ */ jsx15(
|
|
2062
|
+
LoadingGlyph,
|
|
2063
|
+
{
|
|
2064
|
+
enableAnimations,
|
|
2065
|
+
className: "h-4 w-4 shrink-0 text-agg-primary"
|
|
2066
|
+
}
|
|
2067
|
+
) : null,
|
|
2068
|
+
!isComplete && !isActive ? /* @__PURE__ */ jsx15(
|
|
2069
|
+
"span",
|
|
2070
|
+
{
|
|
2071
|
+
"aria-hidden": "true",
|
|
2072
|
+
className: "h-4 w-4 shrink-0 rounded-full border border-agg-separator"
|
|
2073
|
+
}
|
|
2074
|
+
) : null,
|
|
2075
|
+
/* @__PURE__ */ jsx15("p", { className: cn("min-w-0 flex-1 text-agg-base leading-agg-6", textClassName), children: step.label })
|
|
2076
|
+
] }, step.id);
|
|
2077
|
+
}) }),
|
|
2078
|
+
/* @__PURE__ */ jsx15("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: walletFlowLabels.loadingDescription })
|
|
2079
|
+
] }) }) });
|
|
1945
2080
|
};
|
|
1946
|
-
var
|
|
1947
|
-
|
|
2081
|
+
var resultCopyFor = ({
|
|
2082
|
+
status,
|
|
2083
|
+
tokenSymbol,
|
|
2084
|
+
labels
|
|
2085
|
+
}) => {
|
|
2086
|
+
if (status === "failed") {
|
|
2087
|
+
return {
|
|
2088
|
+
title: labels.successTitleFailed,
|
|
2089
|
+
description: labels.successDescriptionFailed(tokenSymbol)
|
|
2090
|
+
};
|
|
2091
|
+
}
|
|
2092
|
+
if (status === "partial_success") {
|
|
2093
|
+
return {
|
|
2094
|
+
title: labels.successTitlePartial,
|
|
2095
|
+
description: labels.successDescriptionPartial(tokenSymbol)
|
|
2096
|
+
};
|
|
2097
|
+
}
|
|
2098
|
+
return {
|
|
2099
|
+
title: labels.successTitleCompleted,
|
|
2100
|
+
description: labels.successDescriptionCompleted(tokenSymbol)
|
|
2101
|
+
};
|
|
1948
2102
|
};
|
|
1949
2103
|
var WithdrawSuccessStep = ({
|
|
1950
2104
|
summary,
|
|
1951
2105
|
tokenSymbol,
|
|
1952
|
-
|
|
2106
|
+
requestedWithdrawal,
|
|
2107
|
+
resultStatus,
|
|
2108
|
+
errorMessage,
|
|
1953
2109
|
onDone,
|
|
2110
|
+
onRetry,
|
|
1954
2111
|
onClose
|
|
1955
2112
|
}) => {
|
|
1956
|
-
|
|
1957
|
-
const labels = useLabels13();
|
|
1958
|
-
const {
|
|
1959
|
-
features: { enableAnimations }
|
|
1960
|
-
} = useSdkUiConfig();
|
|
1961
|
-
const { state } = useWithdrawalLifecycle(withdrawalId);
|
|
1962
|
-
const [isTimelineExpanded, setIsTimelineExpanded] = useState3(true);
|
|
2113
|
+
const labels = useLabels14();
|
|
1963
2114
|
const walletFlowLabels = labels.withdraw.walletFlow;
|
|
1964
|
-
const {
|
|
1965
|
-
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
walletFlowLabels
|
|
2115
|
+
const { title, description } = resultCopyFor({
|
|
2116
|
+
status: resultStatus,
|
|
2117
|
+
tokenSymbol,
|
|
2118
|
+
labels: walletFlowLabels
|
|
1969
2119
|
});
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
|
|
1976
|
-
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
}
|
|
1989
|
-
if (state.terminal && state.status === "failed") {
|
|
1990
|
-
return {
|
|
1991
|
-
titleCopy: walletFlowLabels.successTitleFailed,
|
|
1992
|
-
descriptionCopy: walletFlowLabels.successDescriptionFailed(tokenSymbol)
|
|
1993
|
-
};
|
|
1994
|
-
}
|
|
1995
|
-
return {
|
|
1996
|
-
titleCopy: walletFlowLabels.successTitle,
|
|
1997
|
-
descriptionCopy: walletFlowLabels.successDescription(tokenSymbol)
|
|
1998
|
-
};
|
|
1999
|
-
})();
|
|
2000
|
-
return /* @__PURE__ */ jsx14("div", { className: "relative", children: /* @__PURE__ */ jsxs14(Modal.Body, { classNames: { root: "px-5 py-8 sm:px-8 sm:py-10" }, children: [
|
|
2001
|
-
/* @__PURE__ */ jsx14(
|
|
2002
|
-
"button",
|
|
2003
|
-
{
|
|
2004
|
-
type: "button",
|
|
2005
|
-
className: "absolute right-8 top-7 flex items-center justify-center text-agg-foreground transition-colors hover:text-agg-foreground/80 cursor-pointer",
|
|
2006
|
-
onClick: onClose,
|
|
2007
|
-
"aria-label": labels.common.close,
|
|
2008
|
-
children: /* @__PURE__ */ jsx14(CloseIcon, { className: "h-6 w-6" })
|
|
2009
|
-
}
|
|
2010
|
-
),
|
|
2011
|
-
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col items-center gap-8", children: [
|
|
2012
|
-
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col items-center gap-3 text-center", children: [
|
|
2013
|
-
/* @__PURE__ */ jsx14("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold text-agg-foreground", children: titleCopy }),
|
|
2014
|
-
/* @__PURE__ */ jsx14(
|
|
2120
|
+
const isFailed = resultStatus === "failed";
|
|
2121
|
+
return /* @__PURE__ */ jsx15("div", { className: "relative", children: /* @__PURE__ */ jsxs15(Modal.Body, { classNames: { root: "px-10 py-12" }, children: [
|
|
2122
|
+
/* @__PURE__ */ jsx15(WithdrawCloseButton, { onClose, label: labels.common.close }),
|
|
2123
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex flex-col items-center justify-center gap-8 text-center", children: [
|
|
2124
|
+
/* @__PURE__ */ jsx15(
|
|
2125
|
+
"div",
|
|
2126
|
+
{
|
|
2127
|
+
className: cn(
|
|
2128
|
+
"flex h-[60px] w-[60px] items-center justify-center rounded-full",
|
|
2129
|
+
isFailed ? "bg-agg-error/15" : "bg-agg-success/15"
|
|
2130
|
+
),
|
|
2131
|
+
"aria-hidden": "true",
|
|
2132
|
+
children: isFailed ? /* @__PURE__ */ jsx15(CloseIcon, { className: "h-6 w-6 text-agg-error" }) : /* @__PURE__ */ jsx15(SuccessCheckIcon, { className: "h-6 w-6 text-agg-success" })
|
|
2133
|
+
}
|
|
2134
|
+
),
|
|
2135
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex w-full flex-col items-center gap-3 text-center text-agg-foreground", children: [
|
|
2136
|
+
/* @__PURE__ */ jsx15("h3", { className: "text-agg-2xl leading-agg-8 font-agg-bold", children: title }),
|
|
2137
|
+
/* @__PURE__ */ jsx15(
|
|
2015
2138
|
"p",
|
|
2016
2139
|
{
|
|
2017
|
-
className: "
|
|
2018
|
-
"data-
|
|
2019
|
-
|
|
2020
|
-
children: descriptionCopy
|
|
2140
|
+
className: "max-w-[400px] text-agg-base leading-agg-6",
|
|
2141
|
+
"data-withdraw-result-status": resultStatus,
|
|
2142
|
+
children: errorMessage && isFailed ? errorMessage : description
|
|
2021
2143
|
}
|
|
2022
|
-
)
|
|
2023
|
-
state.errorMessage ? /* @__PURE__ */ jsx14("p", { className: "agg-type-body text-agg-destructive", children: state.errorMessage }) : null
|
|
2144
|
+
)
|
|
2024
2145
|
] }),
|
|
2025
|
-
|
|
2026
|
-
|
|
2027
|
-
|
|
2028
|
-
{
|
|
2029
|
-
"aria-hidden": !isTimelineExpanded,
|
|
2030
|
-
className: cn(
|
|
2031
|
-
"grid overflow-hidden",
|
|
2032
|
-
isTimelineExpanded ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0",
|
|
2033
|
-
!isTimelineExpanded && "pointer-events-none",
|
|
2034
|
-
getMotionClassName(
|
|
2035
|
-
enableAnimations,
|
|
2036
|
-
"transition-[grid-template-rows,opacity] duration-200 ease-[cubic-bezier(0.22,1,0.36,1)]"
|
|
2037
|
-
)
|
|
2038
|
-
),
|
|
2039
|
-
children: /* @__PURE__ */ jsx14("div", { className: "min-h-0", children: /* @__PURE__ */ jsx14("div", { className: "flex flex-col gap-4 pb-2", children: groups.map((group, groupIndex) => /* @__PURE__ */ jsx14(
|
|
2040
|
-
"div",
|
|
2041
|
-
{
|
|
2042
|
-
className: "flex flex-col gap-2",
|
|
2043
|
-
children: group.map((step) => /* @__PURE__ */ jsxs14(
|
|
2044
|
-
"div",
|
|
2045
|
-
{
|
|
2046
|
-
className: "flex items-center gap-2 text-agg-sm leading-agg-5 text-agg-foreground",
|
|
2047
|
-
"data-step-status": step.status,
|
|
2048
|
-
children: [
|
|
2049
|
-
step.status === "pending" ? /* @__PURE__ */ jsx14(
|
|
2050
|
-
LoadingGlyph,
|
|
2051
|
-
{
|
|
2052
|
-
enableAnimations,
|
|
2053
|
-
className: cn(
|
|
2054
|
-
"h-3 w-3 shrink-0",
|
|
2055
|
-
stepIconClassNameFor(step.status)
|
|
2056
|
-
)
|
|
2057
|
-
}
|
|
2058
|
-
) : /* @__PURE__ */ jsx14(
|
|
2059
|
-
Icon,
|
|
2060
|
-
{
|
|
2061
|
-
name: stepIconNameFor(step.status),
|
|
2062
|
-
size: "small",
|
|
2063
|
-
className: cn(
|
|
2064
|
-
"h-3 w-3 shrink-0",
|
|
2065
|
-
stepIconClassNameFor(step.status)
|
|
2066
|
-
),
|
|
2067
|
-
"aria-hidden": "true"
|
|
2068
|
-
}
|
|
2069
|
-
),
|
|
2070
|
-
/* @__PURE__ */ jsx14("p", { className: "min-w-0 flex-1", children: step.label })
|
|
2071
|
-
]
|
|
2072
|
-
},
|
|
2073
|
-
step.id
|
|
2074
|
-
))
|
|
2075
|
-
},
|
|
2076
|
-
`withdraw-step-group-${groupIndex}`
|
|
2077
|
-
)) }) })
|
|
2078
|
-
}
|
|
2079
|
-
) : null,
|
|
2080
|
-
hasDetails ? /* @__PURE__ */ jsxs14(
|
|
2081
|
-
"button",
|
|
2146
|
+
!isFailed ? /* @__PURE__ */ jsxs15("div", { className: "flex w-full max-w-[400px] flex-col rounded-agg-lg border border-agg-separator bg-agg-secondary px-3 py-1 text-left", children: [
|
|
2147
|
+
/* @__PURE__ */ jsx15(
|
|
2148
|
+
SummaryRow3,
|
|
2082
2149
|
{
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
className: cn(
|
|
2086
|
-
"flex w-full items-center gap-2 text-left text-agg-sm leading-agg-5 text-agg-foreground",
|
|
2087
|
-
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary focus-visible:ring-offset-0 focus-visible:ring-offset-agg-secondary",
|
|
2088
|
-
"cursor-pointer"
|
|
2089
|
-
),
|
|
2090
|
-
onClick: () => setIsTimelineExpanded((current) => !current),
|
|
2091
|
-
children: [
|
|
2092
|
-
finalStep.status === "pending" ? /* @__PURE__ */ jsx14(
|
|
2093
|
-
LoadingGlyph,
|
|
2094
|
-
{
|
|
2095
|
-
enableAnimations,
|
|
2096
|
-
className: cn("h-3 w-3 shrink-0", stepIconClassNameFor(finalStep.status))
|
|
2097
|
-
}
|
|
2098
|
-
) : /* @__PURE__ */ jsx14(
|
|
2099
|
-
Icon,
|
|
2100
|
-
{
|
|
2101
|
-
name: stepIconNameFor(finalStep.status),
|
|
2102
|
-
size: "small",
|
|
2103
|
-
className: cn("h-3 w-3 shrink-0", stepIconClassNameFor(finalStep.status)),
|
|
2104
|
-
"aria-hidden": "true"
|
|
2105
|
-
}
|
|
2106
|
-
),
|
|
2107
|
-
/* @__PURE__ */ jsx14("p", { className: "min-w-0 flex-1", children: finalStep.label }),
|
|
2108
|
-
/* @__PURE__ */ jsx14(
|
|
2109
|
-
Icon,
|
|
2110
|
-
{
|
|
2111
|
-
name: isTimelineExpanded ? "chevron-up" : "chevron-down",
|
|
2112
|
-
size: "small",
|
|
2113
|
-
className: "h-4 w-4 shrink-0 text-agg-muted-foreground",
|
|
2114
|
-
"aria-hidden": "true"
|
|
2115
|
-
}
|
|
2116
|
-
)
|
|
2117
|
-
]
|
|
2150
|
+
label: walletFlowLabels.summary.requestedWithdrawal,
|
|
2151
|
+
value: requestedWithdrawal
|
|
2118
2152
|
}
|
|
2119
|
-
)
|
|
2120
|
-
|
|
2121
|
-
/* @__PURE__ */ jsxs14("div", { className: "w-full rounded-lg border border-agg-separator bg-agg-secondary px-3 py-1", children: [
|
|
2122
|
-
/* @__PURE__ */ jsx14(
|
|
2153
|
+
),
|
|
2154
|
+
/* @__PURE__ */ jsx15(
|
|
2123
2155
|
SummaryRow3,
|
|
2124
2156
|
{
|
|
2125
2157
|
label: walletFlowLabels.summary.amountReceived,
|
|
2126
2158
|
value: summary.amountReceived
|
|
2127
2159
|
}
|
|
2128
2160
|
),
|
|
2129
|
-
/* @__PURE__ */
|
|
2130
|
-
/* @__PURE__ */
|
|
2131
|
-
/* @__PURE__ */
|
|
2132
|
-
] }),
|
|
2133
|
-
/* @__PURE__ */
|
|
2161
|
+
/* @__PURE__ */ jsx15(SummaryRow3, { label: walletFlowLabels.summary.fees, value: summary.fees }),
|
|
2162
|
+
/* @__PURE__ */ jsx15(SummaryRow3, { label: walletFlowLabels.summary.network, value: summary.network }),
|
|
2163
|
+
/* @__PURE__ */ jsx15(SummaryRow3, { label: walletFlowLabels.summary.toWallet, value: summary.toWallet })
|
|
2164
|
+
] }) : null,
|
|
2165
|
+
isFailed ? /* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-center gap-3", children: [
|
|
2166
|
+
/* @__PURE__ */ jsx15(Button, { variant: "secondary", size: "large", className: "w-[120px]", onClick: onClose, children: walletFlowLabels.close }),
|
|
2167
|
+
/* @__PURE__ */ jsx15(Button, { variant: "primary", size: "large", className: "w-[123px]", onClick: onRetry, children: walletFlowLabels.retry })
|
|
2168
|
+
] }) : /* @__PURE__ */ jsx15(Button, { variant: "secondary", size: "large", className: "w-[120px]", onClick: onDone, children: labels.withdraw.done })
|
|
2134
2169
|
] })
|
|
2135
2170
|
] }) });
|
|
2136
2171
|
};
|
|
2137
2172
|
|
|
2138
2173
|
// src/withdraw/index.tsx
|
|
2139
|
-
import { jsx as
|
|
2174
|
+
import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2175
|
+
var DEFAULT_TOKEN_DECIMALS = 6;
|
|
2176
|
+
var TOKEN_DECIMALS_BY_SYMBOL = {
|
|
2177
|
+
BNB: 18,
|
|
2178
|
+
ETH: 18,
|
|
2179
|
+
MATIC: 18,
|
|
2180
|
+
POL: 18,
|
|
2181
|
+
WETH: 18,
|
|
2182
|
+
USDC: 6,
|
|
2183
|
+
USDT: 6
|
|
2184
|
+
};
|
|
2185
|
+
var TOKEN_DECIMALS_BY_CHAIN_AND_SYMBOL = {
|
|
2186
|
+
"56": {
|
|
2187
|
+
USDC: 18,
|
|
2188
|
+
USDT: 18
|
|
2189
|
+
}
|
|
2190
|
+
};
|
|
2191
|
+
var getTokenDecimals = (tokenSymbol, chainId) => {
|
|
2192
|
+
var _a;
|
|
2193
|
+
const normalizedSymbol = tokenSymbol.trim().toUpperCase();
|
|
2194
|
+
const normalizedChainId = chainId == null ? void 0 : chainId.trim();
|
|
2195
|
+
if (normalizedChainId) {
|
|
2196
|
+
const chainDecimals = TOKEN_DECIMALS_BY_CHAIN_AND_SYMBOL[normalizedChainId];
|
|
2197
|
+
const chainTokenDecimals = chainDecimals == null ? void 0 : chainDecimals[normalizedSymbol];
|
|
2198
|
+
if (chainTokenDecimals != null) return chainTokenDecimals;
|
|
2199
|
+
}
|
|
2200
|
+
return (_a = TOKEN_DECIMALS_BY_SYMBOL[normalizedSymbol]) != null ? _a : DEFAULT_TOKEN_DECIMALS;
|
|
2201
|
+
};
|
|
2202
|
+
var formatRawTokenAmount = (rawAmount, decimals) => {
|
|
2203
|
+
const raw = BigInt(rawAmount);
|
|
2204
|
+
const divisor = BigInt(`1${"0".repeat(decimals)}`);
|
|
2205
|
+
const whole = raw / divisor;
|
|
2206
|
+
const remainder = raw % divisor;
|
|
2207
|
+
if (remainder === BigInt(0)) return whole.toString();
|
|
2208
|
+
return `${whole.toString()}.${remainder.toString().padStart(decimals, "0").replace(/0+$/, "")}`;
|
|
2209
|
+
};
|
|
2210
|
+
var formatLifecycleTokenAmount = ({
|
|
2211
|
+
rawAmount,
|
|
2212
|
+
tokenSymbol,
|
|
2213
|
+
chainId
|
|
2214
|
+
}) => `${formatRawTokenAmount(rawAmount, getTokenDecimals(tokenSymbol, chainId))} ${tokenSymbol}`;
|
|
2215
|
+
var buildTerminalSummary = ({
|
|
2216
|
+
fallbackSummary,
|
|
2217
|
+
lifecycleCompletedAmountRaw,
|
|
2218
|
+
lifecycleRequestedAmountRaw,
|
|
2219
|
+
tokenSymbol,
|
|
2220
|
+
chainId
|
|
2221
|
+
}) => {
|
|
2222
|
+
if (!lifecycleCompletedAmountRaw) return fallbackSummary;
|
|
2223
|
+
const amountReceived = formatLifecycleTokenAmount({
|
|
2224
|
+
rawAmount: lifecycleCompletedAmountRaw,
|
|
2225
|
+
tokenSymbol,
|
|
2226
|
+
chainId
|
|
2227
|
+
});
|
|
2228
|
+
if (!lifecycleRequestedAmountRaw) {
|
|
2229
|
+
return __spreadProps(__spreadValues({}, fallbackSummary), { amountReceived });
|
|
2230
|
+
}
|
|
2231
|
+
try {
|
|
2232
|
+
const requestedRaw = BigInt(lifecycleRequestedAmountRaw);
|
|
2233
|
+
const completedRaw = BigInt(lifecycleCompletedAmountRaw);
|
|
2234
|
+
const feeRaw = requestedRaw > completedRaw ? requestedRaw - completedRaw : BigInt(0);
|
|
2235
|
+
return __spreadProps(__spreadValues({}, fallbackSummary), {
|
|
2236
|
+
amountReceived,
|
|
2237
|
+
fees: formatLifecycleTokenAmount({
|
|
2238
|
+
rawAmount: feeRaw.toString(),
|
|
2239
|
+
tokenSymbol,
|
|
2240
|
+
chainId
|
|
2241
|
+
})
|
|
2242
|
+
});
|
|
2243
|
+
} catch (e) {
|
|
2244
|
+
return __spreadProps(__spreadValues({}, fallbackSummary), { amountReceived });
|
|
2245
|
+
}
|
|
2246
|
+
};
|
|
2140
2247
|
function isControlledWithdrawModalProps(props) {
|
|
2141
2248
|
return "withdrawFlow" in props;
|
|
2142
2249
|
}
|
|
@@ -2145,7 +2252,7 @@ function WithdrawModalSelfDriven({
|
|
|
2145
2252
|
onOpenChange
|
|
2146
2253
|
}) {
|
|
2147
2254
|
const withdrawProps = useWithdrawFlow({ open, onOpenChange });
|
|
2148
|
-
return /* @__PURE__ */
|
|
2255
|
+
return /* @__PURE__ */ jsx16(WithdrawModalControlled, __spreadValues({}, withdrawProps));
|
|
2149
2256
|
}
|
|
2150
2257
|
function WithdrawModalControlled({
|
|
2151
2258
|
open,
|
|
@@ -2159,51 +2266,98 @@ function WithdrawModalControlled({
|
|
|
2159
2266
|
onSelectWithdrawProvider,
|
|
2160
2267
|
onDoneWithdraw
|
|
2161
2268
|
}) {
|
|
2162
|
-
const [
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2269
|
+
const [flowState, setFlowState] = useState3({
|
|
2270
|
+
status: "form",
|
|
2271
|
+
formStep: "method"
|
|
2272
|
+
});
|
|
2273
|
+
const [isConfirming, setIsConfirming] = useState3(false);
|
|
2274
|
+
const [confirmError, setConfirmError] = useState3(null);
|
|
2275
|
+
const { state: withdrawalLifecycleState, reset: resetWithdrawalLifecycle } = useWithdrawalLifecycle(withdrawFlow.withdrawalId);
|
|
2276
|
+
useEffect4(() => {
|
|
2166
2277
|
if (!open) {
|
|
2167
|
-
|
|
2278
|
+
setFlowState({ status: "form", formStep: "method" });
|
|
2168
2279
|
setIsConfirming(false);
|
|
2169
2280
|
setConfirmError(null);
|
|
2281
|
+
resetWithdrawalLifecycle();
|
|
2170
2282
|
}
|
|
2171
|
-
}, [open]);
|
|
2283
|
+
}, [open, resetWithdrawalLifecycle]);
|
|
2284
|
+
useEffect4(() => {
|
|
2285
|
+
if (flowState.status !== "loading") return;
|
|
2286
|
+
if (!withdrawalLifecycleState.terminal) return;
|
|
2287
|
+
if (withdrawalLifecycleState.status === "completed") {
|
|
2288
|
+
setFlowState({ status: "success" });
|
|
2289
|
+
return;
|
|
2290
|
+
}
|
|
2291
|
+
if (withdrawalLifecycleState.status === "partial") {
|
|
2292
|
+
setFlowState({ status: "partial_success" });
|
|
2293
|
+
return;
|
|
2294
|
+
}
|
|
2295
|
+
if (withdrawalLifecycleState.status === "failed") {
|
|
2296
|
+
setFlowState({
|
|
2297
|
+
status: "failed",
|
|
2298
|
+
errorMessage: withdrawalLifecycleState.errorMessage
|
|
2299
|
+
});
|
|
2300
|
+
}
|
|
2301
|
+
}, [
|
|
2302
|
+
flowState.status,
|
|
2303
|
+
withdrawalLifecycleState.errorMessage,
|
|
2304
|
+
withdrawalLifecycleState.status,
|
|
2305
|
+
withdrawalLifecycleState.terminal
|
|
2306
|
+
]);
|
|
2172
2307
|
const handleOpenChange = (isOpen) => {
|
|
2173
2308
|
if (!isOpen) {
|
|
2174
|
-
|
|
2309
|
+
setFlowState({ status: "form", formStep: "method" });
|
|
2175
2310
|
setIsConfirming(false);
|
|
2176
2311
|
setConfirmError(null);
|
|
2312
|
+
resetWithdrawalLifecycle();
|
|
2177
2313
|
}
|
|
2178
2314
|
onOpenChange(isOpen);
|
|
2179
2315
|
};
|
|
2180
2316
|
const handleBack = () => {
|
|
2181
2317
|
setConfirmError(null);
|
|
2182
|
-
|
|
2318
|
+
setFlowState({ status: "form", formStep: "method" });
|
|
2319
|
+
};
|
|
2320
|
+
const handleRetry = () => {
|
|
2321
|
+
setConfirmError(null);
|
|
2322
|
+
setIsConfirming(false);
|
|
2323
|
+
resetWithdrawalLifecycle();
|
|
2324
|
+
setFlowState({ status: "form", formStep: "withdraw-amount" });
|
|
2183
2325
|
};
|
|
2184
2326
|
const handleConfirm = () => __async(null, null, function* () {
|
|
2327
|
+
setFlowState({ status: "loading" });
|
|
2185
2328
|
setIsConfirming(true);
|
|
2186
2329
|
setConfirmError(null);
|
|
2187
2330
|
try {
|
|
2188
2331
|
yield onSelectWithdrawProvider("wallet");
|
|
2189
|
-
setStep("success");
|
|
2190
2332
|
} catch (err) {
|
|
2191
|
-
|
|
2333
|
+
const errorMessage = err instanceof Error ? err.message : "Withdrawal failed. Please try again.";
|
|
2334
|
+
setConfirmError(errorMessage);
|
|
2335
|
+
setFlowState({ status: "failed", errorMessage });
|
|
2192
2336
|
} finally {
|
|
2193
2337
|
setIsConfirming(false);
|
|
2194
2338
|
}
|
|
2195
2339
|
});
|
|
2196
2340
|
const withdrawTokenOptions = withTokenIcons(withdrawFlow.tokenOptions);
|
|
2197
2341
|
const withdrawNetworkOptions = withNetworkIcons(withdrawFlow.networkOptions);
|
|
2198
|
-
|
|
2199
|
-
|
|
2342
|
+
const requestedWithdrawal = `${withdrawFlow.amount} ${withdrawFlow.selectedToken}`.trim();
|
|
2343
|
+
const modalMaxWidth = flowState.status === "form" && flowState.formStep === "method" ? "600px" : "480px";
|
|
2344
|
+
const resultStatus = flowState.status;
|
|
2345
|
+
const terminalSummary = buildTerminalSummary({
|
|
2346
|
+
fallbackSummary: withdrawFlow.purchaseSummary,
|
|
2347
|
+
lifecycleCompletedAmountRaw: withdrawalLifecycleState.completedAmountRaw,
|
|
2348
|
+
lifecycleRequestedAmountRaw: withdrawalLifecycleState.requestedAmountRaw,
|
|
2349
|
+
tokenSymbol: withdrawFlow.selectedToken,
|
|
2350
|
+
chainId: withdrawFlow.selectedNetwork
|
|
2351
|
+
});
|
|
2352
|
+
return /* @__PURE__ */ jsx16(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs16(Modal.Container, { maxWidth: modalMaxWidth, "aria-label": "Withdraw", children: [
|
|
2353
|
+
flowState.status === "form" && flowState.formStep === "method" ? /* @__PURE__ */ jsx16(
|
|
2200
2354
|
WithdrawMethodStep,
|
|
2201
2355
|
{
|
|
2202
2356
|
balance: withdrawFlow.balance,
|
|
2203
|
-
onSelectMethod: () =>
|
|
2357
|
+
onSelectMethod: () => setFlowState({ status: "form", formStep: "withdraw-amount" })
|
|
2204
2358
|
}
|
|
2205
2359
|
) : null,
|
|
2206
|
-
|
|
2360
|
+
flowState.status === "form" && flowState.formStep === "withdraw-amount" ? /* @__PURE__ */ jsx16(
|
|
2207
2361
|
WithdrawAmountStep,
|
|
2208
2362
|
{
|
|
2209
2363
|
amount: withdrawFlow.amount,
|
|
@@ -2224,13 +2378,23 @@ function WithdrawModalControlled({
|
|
|
2224
2378
|
onContinue: handleConfirm
|
|
2225
2379
|
}
|
|
2226
2380
|
) : null,
|
|
2227
|
-
|
|
2381
|
+
flowState.status === "loading" ? /* @__PURE__ */ jsx16(
|
|
2382
|
+
WithdrawLoadingStep,
|
|
2383
|
+
{
|
|
2384
|
+
lifecycleState: withdrawalLifecycleState,
|
|
2385
|
+
onClose: () => handleOpenChange(false)
|
|
2386
|
+
}
|
|
2387
|
+
) : null,
|
|
2388
|
+
flowState.status === "success" || flowState.status === "partial_success" || flowState.status === "failed" ? /* @__PURE__ */ jsx16(
|
|
2228
2389
|
WithdrawSuccessStep,
|
|
2229
2390
|
{
|
|
2230
|
-
summary:
|
|
2391
|
+
summary: terminalSummary,
|
|
2231
2392
|
tokenSymbol: withdrawFlow.selectedToken,
|
|
2232
|
-
|
|
2393
|
+
requestedWithdrawal,
|
|
2394
|
+
resultStatus,
|
|
2395
|
+
errorMessage: flowState.status === "failed" ? flowState.errorMessage : null,
|
|
2233
2396
|
onDone: onDoneWithdraw,
|
|
2397
|
+
onRetry: handleRetry,
|
|
2234
2398
|
onClose: () => handleOpenChange(false)
|
|
2235
2399
|
}
|
|
2236
2400
|
) : null
|
|
@@ -2238,15 +2402,15 @@ function WithdrawModalControlled({
|
|
|
2238
2402
|
}
|
|
2239
2403
|
var WithdrawModal = (props) => {
|
|
2240
2404
|
if (isControlledWithdrawModalProps(props)) {
|
|
2241
|
-
return /* @__PURE__ */
|
|
2405
|
+
return /* @__PURE__ */ jsx16(WithdrawModalControlled, __spreadValues({}, props));
|
|
2242
2406
|
}
|
|
2243
|
-
return /* @__PURE__ */
|
|
2407
|
+
return /* @__PURE__ */ jsx16(WithdrawModalSelfDriven, __spreadValues({}, props));
|
|
2244
2408
|
};
|
|
2245
2409
|
WithdrawModal.displayName = "WithdrawModal";
|
|
2246
2410
|
|
|
2247
2411
|
// src/onboarding/index.tsx
|
|
2248
|
-
import { useCallback as useCallback5, useEffect as
|
|
2249
|
-
import { useLabels as
|
|
2412
|
+
import { useCallback as useCallback5, useEffect as useEffect5, useState as useState8 } from "react";
|
|
2413
|
+
import { useLabels as useLabels20 } from "@agg-build/hooks";
|
|
2250
2414
|
import * as Dialog3 from "@radix-ui/react-dialog";
|
|
2251
2415
|
|
|
2252
2416
|
// src/onboarding/onboarding-modal.constants.ts
|
|
@@ -2265,30 +2429,30 @@ var ONBOARDING_STEPS = {
|
|
|
2265
2429
|
var ONCHAIN_VENUES = [Venue.polymarket, Venue.opinion, Venue.predict];
|
|
2266
2430
|
|
|
2267
2431
|
// src/onboarding/steps/how-it-works.tsx
|
|
2268
|
-
import { useCallback, useRef as useRef2, useState as
|
|
2269
|
-
import { useLabels as
|
|
2270
|
-
import { jsx as
|
|
2432
|
+
import { useCallback, useRef as useRef2, useState as useState4 } from "react";
|
|
2433
|
+
import { useLabels as useLabels15 } from "@agg-build/hooks";
|
|
2434
|
+
import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2271
2435
|
var defaultIcons = {
|
|
2272
|
-
createAccount: /* @__PURE__ */
|
|
2273
|
-
linkAccounts: /* @__PURE__ */
|
|
2274
|
-
bestPrices: /* @__PURE__ */
|
|
2275
|
-
stayInControl: /* @__PURE__ */
|
|
2436
|
+
createAccount: /* @__PURE__ */ jsx17(CreateAccountIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" }),
|
|
2437
|
+
linkAccounts: /* @__PURE__ */ jsx17(LinkAccountsIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" }),
|
|
2438
|
+
bestPrices: /* @__PURE__ */ jsx17(BestPricesIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" }),
|
|
2439
|
+
stayInControl: /* @__PURE__ */ jsx17(StayInControlIcon, { className: "h-[28px] w-[28px] text-agg-muted-foreground" })
|
|
2276
2440
|
};
|
|
2277
2441
|
var HowItWorksStep = ({ onContinue, icons }) => {
|
|
2278
|
-
const labels =
|
|
2442
|
+
const labels = useLabels15();
|
|
2279
2443
|
const scrollRef = useRef2(null);
|
|
2280
|
-
const [showTopGradient, setShowTopGradient] =
|
|
2281
|
-
const [showBottomGradient, setShowBottomGradient] =
|
|
2444
|
+
const [showTopGradient, setShowTopGradient] = useState4(false);
|
|
2445
|
+
const [showBottomGradient, setShowBottomGradient] = useState4(true);
|
|
2282
2446
|
const handleScroll = useCallback(() => {
|
|
2283
2447
|
const el = scrollRef.current;
|
|
2284
2448
|
if (!el) return;
|
|
2285
2449
|
setShowTopGradient(el.scrollTop > 0);
|
|
2286
2450
|
setShowBottomGradient(el.scrollTop + el.clientHeight < el.scrollHeight - 1);
|
|
2287
2451
|
}, []);
|
|
2288
|
-
return /* @__PURE__ */
|
|
2289
|
-
/* @__PURE__ */
|
|
2290
|
-
/* @__PURE__ */
|
|
2291
|
-
/* @__PURE__ */
|
|
2452
|
+
return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-6 h-[600px] sm:h-auto", children: [
|
|
2453
|
+
/* @__PURE__ */ jsx17("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.howItWorks.title }),
|
|
2454
|
+
/* @__PURE__ */ jsxs17("div", { className: "relative flex-1 min-h-0 sm:flex-initial", children: [
|
|
2455
|
+
/* @__PURE__ */ jsx17(
|
|
2292
2456
|
"div",
|
|
2293
2457
|
{
|
|
2294
2458
|
ref: scrollRef,
|
|
@@ -2298,7 +2462,7 @@ var HowItWorksStep = ({ onContinue, icons }) => {
|
|
|
2298
2462
|
var _a;
|
|
2299
2463
|
const icon = (_a = icons == null ? void 0 : icons[featureKey]) != null ? _a : defaultIcons[featureKey];
|
|
2300
2464
|
const feature = labels.onboarding.howItWorks.features[featureKey];
|
|
2301
|
-
return /* @__PURE__ */
|
|
2465
|
+
return /* @__PURE__ */ jsxs17(
|
|
2302
2466
|
"div",
|
|
2303
2467
|
{
|
|
2304
2468
|
className: cn(
|
|
@@ -2307,11 +2471,11 @@ var HowItWorksStep = ({ onContinue, icons }) => {
|
|
|
2307
2471
|
"bg-agg-secondary-hover"
|
|
2308
2472
|
),
|
|
2309
2473
|
children: [
|
|
2310
|
-
/* @__PURE__ */
|
|
2311
|
-
/* @__PURE__ */
|
|
2312
|
-
/* @__PURE__ */
|
|
2474
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex flex-col flex-1 min-w-0 gap-[6px]", children: [
|
|
2475
|
+
/* @__PURE__ */ jsx17("p", { className: "text-agg-base font-agg-bold leading-agg-6 text-agg-foreground", children: feature.title }),
|
|
2476
|
+
/* @__PURE__ */ jsx17("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: feature.description })
|
|
2313
2477
|
] }),
|
|
2314
|
-
icon ? /* @__PURE__ */
|
|
2478
|
+
icon ? /* @__PURE__ */ jsx17("div", { className: "hidden shrink-0 items-center justify-center text-agg-muted-foreground sm:flex", children: icon }) : null
|
|
2315
2479
|
]
|
|
2316
2480
|
},
|
|
2317
2481
|
featureKey
|
|
@@ -2319,7 +2483,7 @@ var HowItWorksStep = ({ onContinue, icons }) => {
|
|
|
2319
2483
|
})
|
|
2320
2484
|
}
|
|
2321
2485
|
),
|
|
2322
|
-
/* @__PURE__ */
|
|
2486
|
+
/* @__PURE__ */ jsx17(
|
|
2323
2487
|
"div",
|
|
2324
2488
|
{
|
|
2325
2489
|
className: cn(
|
|
@@ -2330,7 +2494,7 @@ var HowItWorksStep = ({ onContinue, icons }) => {
|
|
|
2330
2494
|
)
|
|
2331
2495
|
}
|
|
2332
2496
|
),
|
|
2333
|
-
/* @__PURE__ */
|
|
2497
|
+
/* @__PURE__ */ jsx17(
|
|
2334
2498
|
"div",
|
|
2335
2499
|
{
|
|
2336
2500
|
className: cn(
|
|
@@ -2342,20 +2506,20 @@ var HowItWorksStep = ({ onContinue, icons }) => {
|
|
|
2342
2506
|
}
|
|
2343
2507
|
)
|
|
2344
2508
|
] }),
|
|
2345
|
-
/* @__PURE__ */
|
|
2509
|
+
/* @__PURE__ */ jsx17(Button, { variant: "primary", size: "large", className: "w-full", onClick: onContinue, children: labels.onboarding.howItWorks.continue })
|
|
2346
2510
|
] });
|
|
2347
2511
|
};
|
|
2348
2512
|
HowItWorksStep.displayName = "HowItWorksStep";
|
|
2349
2513
|
|
|
2350
2514
|
// src/onboarding/steps/profile-setup.tsx
|
|
2351
|
-
import { useCallback as useCallback2, useRef as useRef3, useState as
|
|
2352
|
-
import { useLabels as
|
|
2353
|
-
import { jsx as
|
|
2515
|
+
import { useCallback as useCallback2, useRef as useRef3, useState as useState5 } from "react";
|
|
2516
|
+
import { useLabels as useLabels16 } from "@agg-build/hooks";
|
|
2517
|
+
import { jsx as jsx18, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2354
2518
|
var ProfileSetupStep = ({ onContinue }) => {
|
|
2355
|
-
const labels =
|
|
2356
|
-
const [username, setUsername] =
|
|
2357
|
-
const [avatarFile, setAvatarFile] =
|
|
2358
|
-
const [avatarPreview, setAvatarPreview] =
|
|
2519
|
+
const labels = useLabels16();
|
|
2520
|
+
const [username, setUsername] = useState5("");
|
|
2521
|
+
const [avatarFile, setAvatarFile] = useState5();
|
|
2522
|
+
const [avatarPreview, setAvatarPreview] = useState5();
|
|
2359
2523
|
const fileInputRef = useRef3(null);
|
|
2360
2524
|
const handleAvatarClick = useCallback2(() => {
|
|
2361
2525
|
var _a;
|
|
@@ -2380,11 +2544,11 @@ var ProfileSetupStep = ({ onContinue }) => {
|
|
|
2380
2544
|
avatarPreview
|
|
2381
2545
|
});
|
|
2382
2546
|
}, [username, avatarFile, avatarPreview, onContinue]);
|
|
2383
|
-
return /* @__PURE__ */
|
|
2384
|
-
/* @__PURE__ */
|
|
2385
|
-
/* @__PURE__ */
|
|
2386
|
-
/* @__PURE__ */
|
|
2387
|
-
/* @__PURE__ */
|
|
2547
|
+
return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-7", children: [
|
|
2548
|
+
/* @__PURE__ */ jsx18("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.profileSetup.title }),
|
|
2549
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-5 items-center w-full", children: [
|
|
2550
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex justify-center", children: [
|
|
2551
|
+
/* @__PURE__ */ jsxs18(
|
|
2388
2552
|
"button",
|
|
2389
2553
|
{
|
|
2390
2554
|
type: "button",
|
|
@@ -2400,13 +2564,13 @@ var ProfileSetupStep = ({ onContinue }) => {
|
|
|
2400
2564
|
),
|
|
2401
2565
|
"aria-label": labels.onboarding.profileSetup.uploadProfilePictureAria,
|
|
2402
2566
|
children: [
|
|
2403
|
-
!avatarPreview ? /* @__PURE__ */
|
|
2567
|
+
!avatarPreview ? /* @__PURE__ */ jsx18(
|
|
2404
2568
|
"svg",
|
|
2405
2569
|
{
|
|
2406
2570
|
"aria-hidden": true,
|
|
2407
2571
|
viewBox: "0 0 80 80",
|
|
2408
2572
|
className: "pointer-events-none absolute inset-0 h-full w-full text-agg-separator group-hover:text-agg-muted-foreground",
|
|
2409
|
-
children: /* @__PURE__ */
|
|
2573
|
+
children: /* @__PURE__ */ jsx18(
|
|
2410
2574
|
"circle",
|
|
2411
2575
|
{
|
|
2412
2576
|
cx: "40",
|
|
@@ -2420,18 +2584,18 @@ var ProfileSetupStep = ({ onContinue }) => {
|
|
|
2420
2584
|
)
|
|
2421
2585
|
}
|
|
2422
2586
|
) : null,
|
|
2423
|
-
avatarPreview ? /* @__PURE__ */
|
|
2587
|
+
avatarPreview ? /* @__PURE__ */ jsx18(
|
|
2424
2588
|
RemoteImage,
|
|
2425
2589
|
{
|
|
2426
2590
|
src: avatarPreview,
|
|
2427
2591
|
alt: labels.onboarding.profileSetup.profilePreviewAlt,
|
|
2428
2592
|
className: "h-full w-full object-cover"
|
|
2429
2593
|
}
|
|
2430
|
-
) : /* @__PURE__ */
|
|
2594
|
+
) : /* @__PURE__ */ jsx18(ProfileIcon, { className: "h-7 w-7 text-agg-muted-foreground" })
|
|
2431
2595
|
]
|
|
2432
2596
|
}
|
|
2433
2597
|
),
|
|
2434
|
-
/* @__PURE__ */
|
|
2598
|
+
/* @__PURE__ */ jsx18(
|
|
2435
2599
|
"input",
|
|
2436
2600
|
{
|
|
2437
2601
|
ref: fileInputRef,
|
|
@@ -2443,8 +2607,8 @@ var ProfileSetupStep = ({ onContinue }) => {
|
|
|
2443
2607
|
}
|
|
2444
2608
|
)
|
|
2445
2609
|
] }),
|
|
2446
|
-
/* @__PURE__ */
|
|
2447
|
-
/* @__PURE__ */
|
|
2610
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-2 w-full", children: [
|
|
2611
|
+
/* @__PURE__ */ jsx18(
|
|
2448
2612
|
"label",
|
|
2449
2613
|
{
|
|
2450
2614
|
htmlFor: "onboarding-username",
|
|
@@ -2452,7 +2616,7 @@ var ProfileSetupStep = ({ onContinue }) => {
|
|
|
2452
2616
|
children: labels.onboarding.profileSetup.usernameLabel
|
|
2453
2617
|
}
|
|
2454
2618
|
),
|
|
2455
|
-
/* @__PURE__ */
|
|
2619
|
+
/* @__PURE__ */ jsx18(
|
|
2456
2620
|
"input",
|
|
2457
2621
|
{
|
|
2458
2622
|
id: "onboarding-username",
|
|
@@ -2476,17 +2640,17 @@ var ProfileSetupStep = ({ onContinue }) => {
|
|
|
2476
2640
|
)
|
|
2477
2641
|
] })
|
|
2478
2642
|
] }),
|
|
2479
|
-
/* @__PURE__ */
|
|
2643
|
+
/* @__PURE__ */ jsx18(Button, { variant: "primary", size: "large", className: "w-full", onClick: handleContinue, children: labels.onboarding.profileSetup.continue })
|
|
2480
2644
|
] });
|
|
2481
2645
|
};
|
|
2482
2646
|
ProfileSetupStep.displayName = "ProfileSetupStep";
|
|
2483
2647
|
|
|
2484
2648
|
// src/onboarding/steps/connect-accounts.tsx
|
|
2485
2649
|
import { Venue as Venue2 } from "@agg-build/sdk";
|
|
2486
|
-
import { useLabels as
|
|
2487
|
-
import { jsx as
|
|
2650
|
+
import { useLabels as useLabels17 } from "@agg-build/hooks";
|
|
2651
|
+
import { jsx as jsx19, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2488
2652
|
var OnchainVenueLogos = () => {
|
|
2489
|
-
return /* @__PURE__ */
|
|
2653
|
+
return /* @__PURE__ */ jsx19("div", { className: "flex gap-1 sm:gap-0 sm:-space-x-5", children: ONCHAIN_VENUES.map((venue, index) => /* @__PURE__ */ jsx19("div", { style: { zIndex: ONCHAIN_VENUES.length - index }, children: /* @__PURE__ */ jsx19(VenueLogo, { venue, variant: "logo", size: "medium", className: "sm:h-8 sm:w-8" }) }, venue)) });
|
|
2490
2654
|
};
|
|
2491
2655
|
var VenueCard = ({
|
|
2492
2656
|
logos,
|
|
@@ -2497,8 +2661,8 @@ var VenueCard = ({
|
|
|
2497
2661
|
onConnect,
|
|
2498
2662
|
connected = false
|
|
2499
2663
|
}) => {
|
|
2500
|
-
const labels =
|
|
2501
|
-
const action = connected ? /* @__PURE__ */
|
|
2664
|
+
const labels = useLabels17();
|
|
2665
|
+
const action = connected ? /* @__PURE__ */ jsx19(CheckCircleIcon, { className: "h-6 w-6 text-agg-success" }) : /* @__PURE__ */ jsx19(
|
|
2502
2666
|
Button,
|
|
2503
2667
|
{
|
|
2504
2668
|
variant: "tertiary",
|
|
@@ -2508,18 +2672,18 @@ var VenueCard = ({
|
|
|
2508
2672
|
children: labels.onboarding.connectAccounts.connect
|
|
2509
2673
|
}
|
|
2510
2674
|
);
|
|
2511
|
-
const mobileAction = connected ? /* @__PURE__ */
|
|
2675
|
+
const mobileAction = connected ? /* @__PURE__ */ jsx19(CheckCircleIcon, { className: "h-6 w-6 text-agg-success" }) : /* @__PURE__ */ jsx19(
|
|
2512
2676
|
Button,
|
|
2513
2677
|
{
|
|
2514
2678
|
variant: "tertiary",
|
|
2515
2679
|
size: "medium",
|
|
2516
2680
|
className: "!h-auto !px-0 !py-0 text-agg-primary hover:bg-transparent hover:text-agg-primary-hover",
|
|
2517
2681
|
onClick: onConnect,
|
|
2518
|
-
suffix: /* @__PURE__ */
|
|
2682
|
+
suffix: /* @__PURE__ */ jsx19(ChevronRightIcon, { className: "h-4 w-4" }),
|
|
2519
2683
|
children: labels.onboarding.connectAccounts.connectAccount
|
|
2520
2684
|
}
|
|
2521
2685
|
);
|
|
2522
|
-
return /* @__PURE__ */
|
|
2686
|
+
return /* @__PURE__ */ jsxs19(
|
|
2523
2687
|
"div",
|
|
2524
2688
|
{
|
|
2525
2689
|
className: cn(
|
|
@@ -2527,23 +2691,23 @@ var VenueCard = ({
|
|
|
2527
2691
|
connected ? "bg-agg-success/5" : "bg-agg-secondary-hover hover:bg-agg-tertiary"
|
|
2528
2692
|
),
|
|
2529
2693
|
children: [
|
|
2530
|
-
/* @__PURE__ */
|
|
2531
|
-
/* @__PURE__ */
|
|
2532
|
-
/* @__PURE__ */
|
|
2533
|
-
/* @__PURE__ */
|
|
2534
|
-
/* @__PURE__ */
|
|
2535
|
-
/* @__PURE__ */
|
|
2694
|
+
/* @__PURE__ */ jsxs19("div", { className: "hidden sm:flex items-center justify-between", children: [
|
|
2695
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-5", children: [
|
|
2696
|
+
/* @__PURE__ */ jsx19("div", { className: "shrink-0", children: logos }),
|
|
2697
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-[2px]", children: [
|
|
2698
|
+
/* @__PURE__ */ jsx19("p", { className: "text-agg-base font-agg-bold text-agg-foreground", children: title }),
|
|
2699
|
+
/* @__PURE__ */ jsx19("p", { className: "text-agg-sm text-agg-foreground", children: description })
|
|
2536
2700
|
] })
|
|
2537
2701
|
] }),
|
|
2538
|
-
/* @__PURE__ */
|
|
2702
|
+
/* @__PURE__ */ jsx19("div", { className: "shrink-0", children: action })
|
|
2539
2703
|
] }),
|
|
2540
|
-
/* @__PURE__ */
|
|
2541
|
-
/* @__PURE__ */
|
|
2542
|
-
/* @__PURE__ */
|
|
2543
|
-
/* @__PURE__ */
|
|
2704
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-3 sm:hidden", children: [
|
|
2705
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-3", children: [
|
|
2706
|
+
/* @__PURE__ */ jsx19("div", { className: "shrink-0", children: logos }),
|
|
2707
|
+
/* @__PURE__ */ jsx19("p", { className: "text-agg-lg font-agg-bold text-agg-foreground", children: mobileTitle != null ? mobileTitle : title })
|
|
2544
2708
|
] }),
|
|
2545
|
-
/* @__PURE__ */
|
|
2546
|
-
/* @__PURE__ */
|
|
2709
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex flex-col items-start gap-2", children: [
|
|
2710
|
+
/* @__PURE__ */ jsx19("p", { className: "text-agg-base text-agg-foreground", children: mobileDescription != null ? mobileDescription : description }),
|
|
2547
2711
|
mobileAction
|
|
2548
2712
|
] })
|
|
2549
2713
|
] })
|
|
@@ -2558,15 +2722,15 @@ var ConnectAccountsStep = ({
|
|
|
2558
2722
|
connectedOnchain = false,
|
|
2559
2723
|
connectedKalshi = false
|
|
2560
2724
|
}) => {
|
|
2561
|
-
const labels =
|
|
2725
|
+
const labels = useLabels17();
|
|
2562
2726
|
const canContinue = connectedOnchain || connectedKalshi;
|
|
2563
|
-
return /* @__PURE__ */
|
|
2564
|
-
/* @__PURE__ */
|
|
2565
|
-
/* @__PURE__ */
|
|
2566
|
-
/* @__PURE__ */
|
|
2727
|
+
return /* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-6", children: [
|
|
2728
|
+
/* @__PURE__ */ jsx19("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.connectAccounts.title }),
|
|
2729
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-4", children: [
|
|
2730
|
+
/* @__PURE__ */ jsx19(
|
|
2567
2731
|
VenueCard,
|
|
2568
2732
|
{
|
|
2569
|
-
logos: /* @__PURE__ */
|
|
2733
|
+
logos: /* @__PURE__ */ jsx19(OnchainVenueLogos, {}),
|
|
2570
2734
|
title: labels.onboarding.connectAccounts.onchainTitle,
|
|
2571
2735
|
mobileTitle: labels.onboarding.connectAccounts.onchainMobileTitle(
|
|
2572
2736
|
ONCHAIN_VENUES.length - 1
|
|
@@ -2577,10 +2741,10 @@ var ConnectAccountsStep = ({
|
|
|
2577
2741
|
connected: connectedOnchain
|
|
2578
2742
|
}
|
|
2579
2743
|
),
|
|
2580
|
-
/* @__PURE__ */
|
|
2744
|
+
/* @__PURE__ */ jsx19(
|
|
2581
2745
|
VenueCard,
|
|
2582
2746
|
{
|
|
2583
|
-
logos: /* @__PURE__ */
|
|
2747
|
+
logos: /* @__PURE__ */ jsx19("div", { className: "sm:flex sm:w-14 sm:items-center sm:justify-center", children: /* @__PURE__ */ jsx19(
|
|
2584
2748
|
VenueLogo,
|
|
2585
2749
|
{
|
|
2586
2750
|
venue: Venue2.kalshi,
|
|
@@ -2598,7 +2762,7 @@ var ConnectAccountsStep = ({
|
|
|
2598
2762
|
}
|
|
2599
2763
|
)
|
|
2600
2764
|
] }),
|
|
2601
|
-
/* @__PURE__ */
|
|
2765
|
+
/* @__PURE__ */ jsx19(
|
|
2602
2766
|
Button,
|
|
2603
2767
|
{
|
|
2604
2768
|
variant: "primary",
|
|
@@ -2615,20 +2779,20 @@ ConnectAccountsStep.displayName = "ConnectAccountsStep";
|
|
|
2615
2779
|
|
|
2616
2780
|
// src/onboarding/steps/connect-kalshi-modal.tsx
|
|
2617
2781
|
import { Venue as Venue3 } from "@agg-build/sdk";
|
|
2618
|
-
import { useCallback as useCallback3, useState as
|
|
2619
|
-
import { useLabels as
|
|
2782
|
+
import { useCallback as useCallback3, useState as useState6 } from "react";
|
|
2783
|
+
import { useLabels as useLabels18 } from "@agg-build/hooks";
|
|
2620
2784
|
import * as Dialog from "@radix-ui/react-dialog";
|
|
2621
|
-
import { jsx as
|
|
2785
|
+
import { jsx as jsx20, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2622
2786
|
var ConnectKalshiModal = ({
|
|
2623
2787
|
open,
|
|
2624
2788
|
onOpenChange,
|
|
2625
2789
|
onVerify
|
|
2626
2790
|
}) => {
|
|
2627
|
-
const labels =
|
|
2628
|
-
const [apiKeyId, setApiKeyId] =
|
|
2629
|
-
const [privateKey, setPrivateKey] =
|
|
2630
|
-
const [verifying, setVerifying] =
|
|
2631
|
-
const [error, setError] =
|
|
2791
|
+
const labels = useLabels18();
|
|
2792
|
+
const [apiKeyId, setApiKeyId] = useState6("");
|
|
2793
|
+
const [privateKey, setPrivateKey] = useState6("");
|
|
2794
|
+
const [verifying, setVerifying] = useState6(false);
|
|
2795
|
+
const [error, setError] = useState6();
|
|
2632
2796
|
const canVerify = apiKeyId.trim().length > 0 && privateKey.trim().length > 0;
|
|
2633
2797
|
const handleCancel = useCallback3(() => {
|
|
2634
2798
|
onOpenChange(false);
|
|
@@ -2674,15 +2838,15 @@ var ConnectKalshiModal = ({
|
|
|
2674
2838
|
},
|
|
2675
2839
|
[onOpenChange]
|
|
2676
2840
|
);
|
|
2677
|
-
return /* @__PURE__ */
|
|
2841
|
+
return /* @__PURE__ */ jsx20(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs20(
|
|
2678
2842
|
Modal.Container,
|
|
2679
2843
|
{
|
|
2680
2844
|
maxWidth: "600px",
|
|
2681
2845
|
"aria-label": labels.onboarding.connectKalshiModal.ariaLabel,
|
|
2682
2846
|
classNames: { container: "!rounded-agg-lg" },
|
|
2683
2847
|
children: [
|
|
2684
|
-
/* @__PURE__ */
|
|
2685
|
-
/* @__PURE__ */
|
|
2848
|
+
/* @__PURE__ */ jsx20(Dialog.Title, { className: "sr-only", children: labels.onboarding.connectKalshiModal.title }),
|
|
2849
|
+
/* @__PURE__ */ jsx20(
|
|
2686
2850
|
Modal.Header,
|
|
2687
2851
|
{
|
|
2688
2852
|
hideClose: false,
|
|
@@ -2693,8 +2857,8 @@ var ConnectKalshiModal = ({
|
|
|
2693
2857
|
}
|
|
2694
2858
|
}
|
|
2695
2859
|
),
|
|
2696
|
-
/* @__PURE__ */
|
|
2697
|
-
/* @__PURE__ */
|
|
2860
|
+
/* @__PURE__ */ jsx20(Modal.Body, { classNames: { root: "!px-5 !pt-0 !pb-[60px] sm:!px-8" }, children: /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-8 items-center", children: [
|
|
2861
|
+
/* @__PURE__ */ jsx20(
|
|
2698
2862
|
VenueLogo,
|
|
2699
2863
|
{
|
|
2700
2864
|
venue: Venue3.kalshi,
|
|
@@ -2703,54 +2867,54 @@ var ConnectKalshiModal = ({
|
|
|
2703
2867
|
className: "h-[60px] w-[60px]"
|
|
2704
2868
|
}
|
|
2705
2869
|
),
|
|
2706
|
-
/* @__PURE__ */
|
|
2707
|
-
/* @__PURE__ */
|
|
2708
|
-
/* @__PURE__ */
|
|
2870
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-4 items-center text-center", children: [
|
|
2871
|
+
/* @__PURE__ */ jsx20("h2", { className: "text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.connectKalshiModal.title }),
|
|
2872
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-base leading-agg-6 text-agg-foreground", children: labels.onboarding.connectKalshiModal.description })
|
|
2709
2873
|
] }),
|
|
2710
|
-
/* @__PURE__ */
|
|
2711
|
-
/* @__PURE__ */
|
|
2712
|
-
/* @__PURE__ */
|
|
2713
|
-
/* @__PURE__ */
|
|
2714
|
-
/* @__PURE__ */
|
|
2874
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-4 w-full", children: [
|
|
2875
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-3 rounded-agg-lg bg-agg-secondary-hover p-4", children: [
|
|
2876
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-1", children: [
|
|
2877
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-xs font-agg-bold uppercase leading-agg-4 text-agg-muted-foreground", children: labels.onboarding.connectKalshiModal.stepOne.label }),
|
|
2878
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.onboarding.connectKalshiModal.stepOne.title })
|
|
2715
2879
|
] }),
|
|
2716
|
-
/* @__PURE__ */
|
|
2717
|
-
/* @__PURE__ */
|
|
2718
|
-
/* @__PURE__ */
|
|
2880
|
+
/* @__PURE__ */ jsxs20("div", { className: "space-y-0 text-agg-sm leading-agg-5 text-agg-foreground", children: [
|
|
2881
|
+
/* @__PURE__ */ jsx20("p", { children: labels.onboarding.connectKalshiModal.stepOne.instructions.signIn }),
|
|
2882
|
+
/* @__PURE__ */ jsxs20("p", { children: [
|
|
2719
2883
|
labels.onboarding.connectKalshiModal.stepOne.instructions.goToProfilePrefix,
|
|
2720
2884
|
" ",
|
|
2721
|
-
/* @__PURE__ */
|
|
2885
|
+
/* @__PURE__ */ jsx20("span", { className: "font-agg-bold", children: labels.onboarding.connectKalshiModal.stepOne.instructions.profileText }),
|
|
2722
2886
|
labels.onboarding.connectKalshiModal.stepOne.instructions.goToProfileSeparator,
|
|
2723
2887
|
" ",
|
|
2724
|
-
/* @__PURE__ */
|
|
2888
|
+
/* @__PURE__ */ jsx20("span", { className: "text-agg-foreground underline", children: labels.onboarding.connectKalshiModal.stepOne.instructions.profileUrl })
|
|
2725
2889
|
] }),
|
|
2726
|
-
/* @__PURE__ */
|
|
2890
|
+
/* @__PURE__ */ jsxs20("p", { children: [
|
|
2727
2891
|
labels.onboarding.connectKalshiModal.stepOne.instructions.clickCreateKeyPrefix,
|
|
2728
2892
|
" ",
|
|
2729
|
-
/* @__PURE__ */
|
|
2893
|
+
/* @__PURE__ */ jsx20("span", { className: "font-agg-bold", children: labels.onboarding.connectKalshiModal.stepOne.instructions.createKeyText }),
|
|
2730
2894
|
labels.onboarding.connectKalshiModal.stepOne.instructions.clickCreateKeySuffix
|
|
2731
2895
|
] }),
|
|
2732
|
-
/* @__PURE__ */
|
|
2896
|
+
/* @__PURE__ */ jsxs20("p", { children: [
|
|
2733
2897
|
labels.onboarding.connectKalshiModal.stepOne.instructions.selectPermissionsPrefix,
|
|
2734
2898
|
" ",
|
|
2735
|
-
/* @__PURE__ */
|
|
2899
|
+
/* @__PURE__ */ jsx20("span", { className: "font-agg-bold", children: labels.onboarding.connectKalshiModal.stepOne.instructions.readWriteText }),
|
|
2736
2900
|
labels.onboarding.connectKalshiModal.stepOne.instructions.selectPermissionsSuffix
|
|
2737
2901
|
] }),
|
|
2738
|
-
/* @__PURE__ */
|
|
2902
|
+
/* @__PURE__ */ jsx20("p", { children: labels.onboarding.connectKalshiModal.stepOne.instructions.createKey })
|
|
2739
2903
|
] }),
|
|
2740
|
-
/* @__PURE__ */
|
|
2904
|
+
/* @__PURE__ */ jsxs20("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: [
|
|
2741
2905
|
labels.onboarding.connectKalshiModal.stepOne.footerLineOne,
|
|
2742
|
-
/* @__PURE__ */
|
|
2906
|
+
/* @__PURE__ */ jsx20("br", {}),
|
|
2743
2907
|
labels.onboarding.connectKalshiModal.stepOne.footerLineTwo
|
|
2744
2908
|
] })
|
|
2745
2909
|
] }),
|
|
2746
|
-
/* @__PURE__ */
|
|
2747
|
-
/* @__PURE__ */
|
|
2748
|
-
/* @__PURE__ */
|
|
2749
|
-
/* @__PURE__ */
|
|
2910
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-3 rounded-agg-lg bg-agg-secondary-hover p-4", children: [
|
|
2911
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-1", children: [
|
|
2912
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-xs font-agg-bold uppercase leading-agg-4 text-agg-muted-foreground", children: labels.onboarding.connectKalshiModal.stepTwo.label }),
|
|
2913
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.onboarding.connectKalshiModal.stepTwo.title })
|
|
2750
2914
|
] }),
|
|
2751
|
-
/* @__PURE__ */
|
|
2752
|
-
/* @__PURE__ */
|
|
2753
|
-
/* @__PURE__ */
|
|
2915
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: labels.onboarding.connectKalshiModal.stepTwo.description }),
|
|
2916
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-2", children: [
|
|
2917
|
+
/* @__PURE__ */ jsx20(
|
|
2754
2918
|
"label",
|
|
2755
2919
|
{
|
|
2756
2920
|
htmlFor: "kalshi-api-key-id",
|
|
@@ -2758,7 +2922,7 @@ var ConnectKalshiModal = ({
|
|
|
2758
2922
|
children: labels.onboarding.connectKalshiModal.stepTwo.apiKeyIdLabel
|
|
2759
2923
|
}
|
|
2760
2924
|
),
|
|
2761
|
-
/* @__PURE__ */
|
|
2925
|
+
/* @__PURE__ */ jsx20(
|
|
2762
2926
|
"input",
|
|
2763
2927
|
{
|
|
2764
2928
|
id: "kalshi-api-key-id",
|
|
@@ -2778,8 +2942,8 @@ var ConnectKalshiModal = ({
|
|
|
2778
2942
|
}
|
|
2779
2943
|
)
|
|
2780
2944
|
] }),
|
|
2781
|
-
/* @__PURE__ */
|
|
2782
|
-
/* @__PURE__ */
|
|
2945
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-2", children: [
|
|
2946
|
+
/* @__PURE__ */ jsx20(
|
|
2783
2947
|
"label",
|
|
2784
2948
|
{
|
|
2785
2949
|
htmlFor: "kalshi-private-key",
|
|
@@ -2787,7 +2951,7 @@ var ConnectKalshiModal = ({
|
|
|
2787
2951
|
children: labels.onboarding.connectKalshiModal.stepTwo.privateKeyLabel
|
|
2788
2952
|
}
|
|
2789
2953
|
),
|
|
2790
|
-
/* @__PURE__ */
|
|
2954
|
+
/* @__PURE__ */ jsx20(
|
|
2791
2955
|
"textarea",
|
|
2792
2956
|
{
|
|
2793
2957
|
id: "kalshi-private-key",
|
|
@@ -2809,42 +2973,42 @@ var ConnectKalshiModal = ({
|
|
|
2809
2973
|
] })
|
|
2810
2974
|
] })
|
|
2811
2975
|
] }),
|
|
2812
|
-
/* @__PURE__ */
|
|
2813
|
-
/* @__PURE__ */
|
|
2814
|
-
/* @__PURE__ */
|
|
2815
|
-
/* @__PURE__ */
|
|
2976
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center justify-between w-full", children: [
|
|
2977
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-base text-agg-foreground", children: labels.onboarding.connectKalshiModal.help.label }),
|
|
2978
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-3", children: [
|
|
2979
|
+
/* @__PURE__ */ jsxs20(
|
|
2816
2980
|
"a",
|
|
2817
2981
|
{
|
|
2818
2982
|
href: "#",
|
|
2819
2983
|
className: "flex items-center gap-2 text-agg-base font-agg-bold text-agg-primary hover:text-agg-primary-hover",
|
|
2820
2984
|
children: [
|
|
2821
|
-
/* @__PURE__ */
|
|
2985
|
+
/* @__PURE__ */ jsx20(DocumentIcon, { className: "h-4 w-4" }),
|
|
2822
2986
|
labels.onboarding.connectKalshiModal.help.docsLinkLabel
|
|
2823
2987
|
]
|
|
2824
2988
|
}
|
|
2825
2989
|
),
|
|
2826
|
-
/* @__PURE__ */
|
|
2827
|
-
/* @__PURE__ */
|
|
2990
|
+
/* @__PURE__ */ jsx20("span", { className: "h-3 w-px bg-agg-separator" }),
|
|
2991
|
+
/* @__PURE__ */ jsxs20(
|
|
2828
2992
|
"a",
|
|
2829
2993
|
{
|
|
2830
2994
|
href: "#",
|
|
2831
2995
|
className: "flex items-center gap-2 text-agg-base font-agg-bold text-agg-primary hover:text-agg-primary-hover",
|
|
2832
2996
|
children: [
|
|
2833
|
-
/* @__PURE__ */
|
|
2997
|
+
/* @__PURE__ */ jsx20(PlaySquareIcon, { className: "h-4 w-4" }),
|
|
2834
2998
|
labels.onboarding.connectKalshiModal.help.tutorialLinkLabel
|
|
2835
2999
|
]
|
|
2836
3000
|
}
|
|
2837
3001
|
)
|
|
2838
3002
|
] })
|
|
2839
3003
|
] }),
|
|
2840
|
-
/* @__PURE__ */
|
|
2841
|
-
error ? /* @__PURE__ */
|
|
2842
|
-
/* @__PURE__ */
|
|
2843
|
-
/* @__PURE__ */
|
|
3004
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-5 items-center", children: [
|
|
3005
|
+
error ? /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2", children: [
|
|
3006
|
+
/* @__PURE__ */ jsx20(WarningIcon, { className: "h-3.5 w-3.5 shrink-0 text-agg-error" }),
|
|
3007
|
+
/* @__PURE__ */ jsx20("p", { className: "text-agg-sm leading-agg-5 text-agg-error", children: error })
|
|
2844
3008
|
] }) : null,
|
|
2845
|
-
/* @__PURE__ */
|
|
2846
|
-
/* @__PURE__ */
|
|
2847
|
-
/* @__PURE__ */
|
|
3009
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-3 justify-center", children: [
|
|
3010
|
+
/* @__PURE__ */ jsx20(Button, { variant: "secondary", size: "large", onClick: handleCancel, children: labels.onboarding.connectKalshiModal.actions.cancel }),
|
|
3011
|
+
/* @__PURE__ */ jsx20(
|
|
2848
3012
|
Button,
|
|
2849
3013
|
{
|
|
2850
3014
|
variant: "primary",
|
|
@@ -2865,18 +3029,18 @@ var ConnectKalshiModal = ({
|
|
|
2865
3029
|
ConnectKalshiModal.displayName = "ConnectKalshiModal";
|
|
2866
3030
|
|
|
2867
3031
|
// src/onboarding/steps/connect-onchain-modal.tsx
|
|
2868
|
-
import { useCallback as useCallback4, useState as
|
|
2869
|
-
import { useLabels as
|
|
3032
|
+
import { useCallback as useCallback4, useState as useState7 } from "react";
|
|
3033
|
+
import { useLabels as useLabels19 } from "@agg-build/hooks";
|
|
2870
3034
|
import * as Dialog2 from "@radix-ui/react-dialog";
|
|
2871
|
-
import { jsx as
|
|
3035
|
+
import { jsx as jsx21, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2872
3036
|
var ConnectOnchainModal = ({
|
|
2873
3037
|
open,
|
|
2874
3038
|
onOpenChange,
|
|
2875
3039
|
onConnect
|
|
2876
3040
|
}) => {
|
|
2877
|
-
const labels =
|
|
2878
|
-
const [connecting, setConnecting] =
|
|
2879
|
-
const [error, setError] =
|
|
3041
|
+
const labels = useLabels19();
|
|
3042
|
+
const [connecting, setConnecting] = useState7(false);
|
|
3043
|
+
const [error, setError] = useState7();
|
|
2880
3044
|
const handleCancel = useCallback4(() => {
|
|
2881
3045
|
onOpenChange(false);
|
|
2882
3046
|
}, [onOpenChange]);
|
|
@@ -2905,15 +3069,15 @@ var ConnectOnchainModal = ({
|
|
|
2905
3069
|
},
|
|
2906
3070
|
[onOpenChange]
|
|
2907
3071
|
);
|
|
2908
|
-
return /* @__PURE__ */
|
|
3072
|
+
return /* @__PURE__ */ jsx21(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs21(
|
|
2909
3073
|
Modal.Container,
|
|
2910
3074
|
{
|
|
2911
3075
|
maxWidth: "600px",
|
|
2912
3076
|
"aria-label": labels.onboarding.connectOnchainModal.ariaLabel,
|
|
2913
3077
|
classNames: { container: "!rounded-agg-lg" },
|
|
2914
3078
|
children: [
|
|
2915
|
-
/* @__PURE__ */
|
|
2916
|
-
/* @__PURE__ */
|
|
3079
|
+
/* @__PURE__ */ jsx21(Dialog2.Title, { className: "sr-only", children: labels.onboarding.connectOnchainModal.title }),
|
|
3080
|
+
/* @__PURE__ */ jsx21(
|
|
2917
3081
|
Modal.Header,
|
|
2918
3082
|
{
|
|
2919
3083
|
hideClose: false,
|
|
@@ -2924,26 +3088,26 @@ var ConnectOnchainModal = ({
|
|
|
2924
3088
|
}
|
|
2925
3089
|
}
|
|
2926
3090
|
),
|
|
2927
|
-
/* @__PURE__ */
|
|
2928
|
-
/* @__PURE__ */
|
|
2929
|
-
/* @__PURE__ */
|
|
2930
|
-
/* @__PURE__ */
|
|
3091
|
+
/* @__PURE__ */ jsx21(Modal.Body, { classNames: { root: "!px-5 !pt-0 !pb-[60px] sm:!px-8" }, children: /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-8 items-center", children: [
|
|
3092
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-4 items-center text-center", children: [
|
|
3093
|
+
/* @__PURE__ */ jsx21("h2", { className: "text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.connectOnchainModal.title }),
|
|
3094
|
+
/* @__PURE__ */ jsx21("p", { className: "text-agg-base text-center leading-agg-6 text-agg-foreground whitespace-pre-line", children: labels.onboarding.connectOnchainModal.description })
|
|
2931
3095
|
] }),
|
|
2932
|
-
/* @__PURE__ */
|
|
2933
|
-
/* @__PURE__ */
|
|
2934
|
-
/* @__PURE__ */
|
|
2935
|
-
index > 0 && /* @__PURE__ */
|
|
2936
|
-
/* @__PURE__ */
|
|
2937
|
-
/* @__PURE__ */
|
|
3096
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex w-full flex-col items-center gap-4 rounded-agg-xl bg-agg-secondary-hover p-6", children: [
|
|
3097
|
+
/* @__PURE__ */ jsx21("p", { className: "text-agg-sm font-agg-bold uppercase leading-agg-5 text-agg-muted-foreground", children: labels.onboarding.connectOnchainModal.supportedVenuesLabel }),
|
|
3098
|
+
/* @__PURE__ */ jsx21("div", { className: "flex flex-wrap items-center justify-center gap-x-4 gap-y-3", children: ONCHAIN_VENUES.map((venue, index) => /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-[6px]", children: [
|
|
3099
|
+
index > 0 && /* @__PURE__ */ jsx21("span", { className: "mr-2.5 h-3 w-px bg-agg-separator" }),
|
|
3100
|
+
/* @__PURE__ */ jsx21(VenueLogo, { venue, size: "medium" }),
|
|
3101
|
+
/* @__PURE__ */ jsx21("span", { className: "text-agg-base text-agg-foreground", children: labels.venues[venue] })
|
|
2938
3102
|
] }, venue)) })
|
|
2939
3103
|
] }),
|
|
2940
|
-
/* @__PURE__ */
|
|
2941
|
-
/* @__PURE__ */
|
|
2942
|
-
error ? /* @__PURE__ */
|
|
2943
|
-
/* @__PURE__ */
|
|
2944
|
-
/* @__PURE__ */
|
|
3104
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-6 items-center", children: [
|
|
3105
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-3 items-center", children: [
|
|
3106
|
+
error ? /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2", children: [
|
|
3107
|
+
/* @__PURE__ */ jsx21(WarningIcon, { className: "h-3.5 w-3.5 shrink-0 text-agg-error" }),
|
|
3108
|
+
/* @__PURE__ */ jsx21("p", { className: "text-agg-sm leading-agg-5 text-agg-error", children: error })
|
|
2945
3109
|
] }) : null,
|
|
2946
|
-
/* @__PURE__ */
|
|
3110
|
+
/* @__PURE__ */ jsx21(
|
|
2947
3111
|
Button,
|
|
2948
3112
|
{
|
|
2949
3113
|
variant: "primary",
|
|
@@ -2954,7 +3118,7 @@ var ConnectOnchainModal = ({
|
|
|
2954
3118
|
}
|
|
2955
3119
|
)
|
|
2956
3120
|
] }),
|
|
2957
|
-
/* @__PURE__ */
|
|
3121
|
+
/* @__PURE__ */ jsx21(
|
|
2958
3122
|
Button,
|
|
2959
3123
|
{
|
|
2960
3124
|
variant: "tertiary",
|
|
@@ -2973,7 +3137,7 @@ var ConnectOnchainModal = ({
|
|
|
2973
3137
|
ConnectOnchainModal.displayName = "ConnectOnchainModal";
|
|
2974
3138
|
|
|
2975
3139
|
// src/onboarding/index.tsx
|
|
2976
|
-
import { Fragment as Fragment9, jsx as
|
|
3140
|
+
import { Fragment as Fragment9, jsx as jsx22, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2977
3141
|
var OnboardingModal = ({
|
|
2978
3142
|
open,
|
|
2979
3143
|
onOpenChange,
|
|
@@ -2986,19 +3150,19 @@ var OnboardingModal = ({
|
|
|
2986
3150
|
connectedKalshi = false
|
|
2987
3151
|
}) => {
|
|
2988
3152
|
var _a;
|
|
2989
|
-
const labels =
|
|
2990
|
-
const [step, setStep] =
|
|
3153
|
+
const labels = useLabels20();
|
|
3154
|
+
const [step, setStep] = useState8(ONBOARDING_STEPS.HOW_IT_WORKS);
|
|
2991
3155
|
const stepLabels = {
|
|
2992
3156
|
[ONBOARDING_STEPS.HOW_IT_WORKS]: labels.onboarding.modal.stepHowItWorks,
|
|
2993
3157
|
[ONBOARDING_STEPS.PROFILE_SETUP]: labels.onboarding.modal.stepProfileSetup,
|
|
2994
3158
|
[ONBOARDING_STEPS.CONNECT_ACCOUNTS]: labels.onboarding.modal.stepConnectAccounts
|
|
2995
3159
|
};
|
|
2996
3160
|
const resolvedTitle = (_a = stepLabels[step]) != null ? _a : labels.onboarding.modal.title;
|
|
2997
|
-
const [kalshiModalOpen, setKalshiModalOpen] =
|
|
2998
|
-
const [kalshiConnected, setKalshiConnected] =
|
|
2999
|
-
const [onchainModalOpen, setOnchainModalOpen] =
|
|
3000
|
-
const [onchainConnected, setOnchainConnected] =
|
|
3001
|
-
|
|
3161
|
+
const [kalshiModalOpen, setKalshiModalOpen] = useState8(false);
|
|
3162
|
+
const [kalshiConnected, setKalshiConnected] = useState8(false);
|
|
3163
|
+
const [onchainModalOpen, setOnchainModalOpen] = useState8(false);
|
|
3164
|
+
const [onchainConnected, setOnchainConnected] = useState8(false);
|
|
3165
|
+
useEffect5(() => {
|
|
3002
3166
|
if (open) {
|
|
3003
3167
|
setStep(ONBOARDING_STEPS.HOW_IT_WORKS);
|
|
3004
3168
|
setKalshiConnected(false);
|
|
@@ -3035,19 +3199,19 @@ var OnboardingModal = ({
|
|
|
3035
3199
|
}),
|
|
3036
3200
|
[onConnectKalshi]
|
|
3037
3201
|
);
|
|
3038
|
-
return /* @__PURE__ */
|
|
3039
|
-
/* @__PURE__ */
|
|
3202
|
+
return /* @__PURE__ */ jsxs22(Fragment9, { children: [
|
|
3203
|
+
/* @__PURE__ */ jsx22(Modal, { open, onOpenChange, children: /* @__PURE__ */ jsxs22(
|
|
3040
3204
|
Modal.Container,
|
|
3041
3205
|
{
|
|
3042
3206
|
maxWidth: "600px",
|
|
3043
3207
|
"aria-label": resolvedTitle,
|
|
3044
3208
|
classNames: { container: "!rounded-agg-lg" },
|
|
3045
3209
|
children: [
|
|
3046
|
-
/* @__PURE__ */
|
|
3047
|
-
/* @__PURE__ */
|
|
3048
|
-
step === ONBOARDING_STEPS.HOW_IT_WORKS && /* @__PURE__ */
|
|
3049
|
-
step === ONBOARDING_STEPS.PROFILE_SETUP && /* @__PURE__ */
|
|
3050
|
-
step === ONBOARDING_STEPS.CONNECT_ACCOUNTS && /* @__PURE__ */
|
|
3210
|
+
/* @__PURE__ */ jsx22(Dialog3.Title, { className: "sr-only", children: resolvedTitle }),
|
|
3211
|
+
/* @__PURE__ */ jsxs22(Modal.Body, { classNames: { root: "px-5 py-6 sm:px-10 sm:py-8" }, children: [
|
|
3212
|
+
step === ONBOARDING_STEPS.HOW_IT_WORKS && /* @__PURE__ */ jsx22(HowItWorksStep, { onContinue: handleHowItWorksContinue, icons: howItWorksIcons }),
|
|
3213
|
+
step === ONBOARDING_STEPS.PROFILE_SETUP && /* @__PURE__ */ jsx22(ProfileSetupStep, { onContinue: handleProfileContinue }),
|
|
3214
|
+
step === ONBOARDING_STEPS.CONNECT_ACCOUNTS && /* @__PURE__ */ jsx22(
|
|
3051
3215
|
ConnectAccountsStep,
|
|
3052
3216
|
{
|
|
3053
3217
|
onConnectOnchain: handleOpenOnchainModal,
|
|
@@ -3061,7 +3225,7 @@ var OnboardingModal = ({
|
|
|
3061
3225
|
]
|
|
3062
3226
|
}
|
|
3063
3227
|
) }),
|
|
3064
|
-
/* @__PURE__ */
|
|
3228
|
+
/* @__PURE__ */ jsx22(
|
|
3065
3229
|
ConnectOnchainModal,
|
|
3066
3230
|
{
|
|
3067
3231
|
open: onchainModalOpen,
|
|
@@ -3069,7 +3233,7 @@ var OnboardingModal = ({
|
|
|
3069
3233
|
onConnect: handleOnchainConnect
|
|
3070
3234
|
}
|
|
3071
3235
|
),
|
|
3072
|
-
/* @__PURE__ */
|
|
3236
|
+
/* @__PURE__ */ jsx22(
|
|
3073
3237
|
ConnectKalshiModal,
|
|
3074
3238
|
{
|
|
3075
3239
|
open: kalshiModalOpen,
|
|
@@ -3083,7 +3247,7 @@ OnboardingModal.displayName = "OnboardingModal";
|
|
|
3083
3247
|
|
|
3084
3248
|
// src/profile/index.tsx
|
|
3085
3249
|
import { Venue as Venue4 } from "@agg-build/sdk";
|
|
3086
|
-
import { useState as
|
|
3250
|
+
import { useState as useState10, useEffect as useEffect7, useCallback as useCallback8, useMemo as useMemo2 } from "react";
|
|
3087
3251
|
import { useAggClient as useAggClient2, useAggAuthState as useAggAuthState2 } from "@agg-build/hooks";
|
|
3088
3252
|
|
|
3089
3253
|
// src/profile/profile-modal.constants.ts
|
|
@@ -3102,8 +3266,8 @@ var PROFILE_TAB_ITEMS = [
|
|
|
3102
3266
|
|
|
3103
3267
|
// src/profile/tabs/about-tab.tsx
|
|
3104
3268
|
import { useCallback as useCallback6, useRef as useRef4 } from "react";
|
|
3105
|
-
import { useLabels as
|
|
3106
|
-
import { jsx as
|
|
3269
|
+
import { useLabels as useLabels21 } from "@agg-build/hooks";
|
|
3270
|
+
import { jsx as jsx23, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3107
3271
|
var AboutTab = ({
|
|
3108
3272
|
avatarPreview,
|
|
3109
3273
|
onDeleteProfile: _onDeleteProfile,
|
|
@@ -3113,7 +3277,7 @@ var AboutTab = ({
|
|
|
3113
3277
|
draftAvatarPreview,
|
|
3114
3278
|
avatarError: _avatarError
|
|
3115
3279
|
}) => {
|
|
3116
|
-
const labels =
|
|
3280
|
+
const labels = useLabels21();
|
|
3117
3281
|
const fileInputRef = useRef4(null);
|
|
3118
3282
|
const handleAvatarClick = useCallback6(() => {
|
|
3119
3283
|
var _a;
|
|
@@ -3135,9 +3299,9 @@ var AboutTab = ({
|
|
|
3135
3299
|
);
|
|
3136
3300
|
const resolvedPreview = draftAvatarPreview != null ? draftAvatarPreview : avatarPreview;
|
|
3137
3301
|
const hasAvatarPreview = Boolean(resolvedPreview);
|
|
3138
|
-
return /* @__PURE__ */
|
|
3139
|
-
/* @__PURE__ */
|
|
3140
|
-
/* @__PURE__ */
|
|
3302
|
+
return /* @__PURE__ */ jsxs23("div", { className: "agg-profile-about flex flex-col gap-8", children: [
|
|
3303
|
+
/* @__PURE__ */ jsxs23("div", { className: "agg-profile-avatar-section flex w-full flex-col items-stretch sm:items-start", children: [
|
|
3304
|
+
/* @__PURE__ */ jsxs23(
|
|
3141
3305
|
"button",
|
|
3142
3306
|
{
|
|
3143
3307
|
type: "button",
|
|
@@ -3154,13 +3318,13 @@ var AboutTab = ({
|
|
|
3154
3318
|
),
|
|
3155
3319
|
"aria-label": labels.onboarding.profileSetup.uploadProfilePictureAria,
|
|
3156
3320
|
children: [
|
|
3157
|
-
!hasAvatarPreview ? /* @__PURE__ */
|
|
3321
|
+
!hasAvatarPreview ? /* @__PURE__ */ jsx23(
|
|
3158
3322
|
"svg",
|
|
3159
3323
|
{
|
|
3160
3324
|
"aria-hidden": true,
|
|
3161
3325
|
viewBox: "0 0 80 80",
|
|
3162
3326
|
className: "pointer-events-none absolute inset-0 h-full w-full text-agg-separator group-hover:text-agg-muted-foreground",
|
|
3163
|
-
children: /* @__PURE__ */
|
|
3327
|
+
children: /* @__PURE__ */ jsx23(
|
|
3164
3328
|
"circle",
|
|
3165
3329
|
{
|
|
3166
3330
|
cx: "40",
|
|
@@ -3174,18 +3338,18 @@ var AboutTab = ({
|
|
|
3174
3338
|
)
|
|
3175
3339
|
}
|
|
3176
3340
|
) : null,
|
|
3177
|
-
resolvedPreview ? /* @__PURE__ */
|
|
3341
|
+
resolvedPreview ? /* @__PURE__ */ jsx23(
|
|
3178
3342
|
RemoteImage,
|
|
3179
3343
|
{
|
|
3180
3344
|
src: resolvedPreview,
|
|
3181
3345
|
alt: labels.onboarding.profileSetup.profilePreviewAlt,
|
|
3182
3346
|
className: "h-full w-full object-cover"
|
|
3183
3347
|
}
|
|
3184
|
-
) : /* @__PURE__ */
|
|
3348
|
+
) : /* @__PURE__ */ jsx23(Icon, { name: "profile", className: "h-7 w-7 text-agg-muted-foreground" })
|
|
3185
3349
|
]
|
|
3186
3350
|
}
|
|
3187
3351
|
),
|
|
3188
|
-
/* @__PURE__ */
|
|
3352
|
+
/* @__PURE__ */ jsx23(
|
|
3189
3353
|
"input",
|
|
3190
3354
|
{
|
|
3191
3355
|
ref: fileInputRef,
|
|
@@ -3197,8 +3361,8 @@ var AboutTab = ({
|
|
|
3197
3361
|
}
|
|
3198
3362
|
)
|
|
3199
3363
|
] }),
|
|
3200
|
-
/* @__PURE__ */
|
|
3201
|
-
/* @__PURE__ */
|
|
3364
|
+
/* @__PURE__ */ jsxs23("div", { className: "agg-form-section flex flex-col gap-2", children: [
|
|
3365
|
+
/* @__PURE__ */ jsx23(
|
|
3202
3366
|
"label",
|
|
3203
3367
|
{
|
|
3204
3368
|
htmlFor: "profile-username",
|
|
@@ -3206,7 +3370,7 @@ var AboutTab = ({
|
|
|
3206
3370
|
children: "Username"
|
|
3207
3371
|
}
|
|
3208
3372
|
),
|
|
3209
|
-
/* @__PURE__ */
|
|
3373
|
+
/* @__PURE__ */ jsx23(
|
|
3210
3374
|
"input",
|
|
3211
3375
|
{
|
|
3212
3376
|
id: "profile-username",
|
|
@@ -3233,11 +3397,11 @@ var AboutTab = ({
|
|
|
3233
3397
|
AboutTab.displayName = "AboutTab";
|
|
3234
3398
|
|
|
3235
3399
|
// src/profile/tabs/accounts-wallets-tab.tsx
|
|
3236
|
-
import { useCallback as useCallback7, useEffect as
|
|
3400
|
+
import { useCallback as useCallback7, useEffect as useEffect6, useState as useState9 } from "react";
|
|
3237
3401
|
import { useAggClient, useDepositAddresses as useDepositAddresses2 } from "@agg-build/hooks";
|
|
3238
|
-
import { jsx as
|
|
3239
|
-
var SectionTitle = ({ children }) => /* @__PURE__ */
|
|
3240
|
-
var AccountRow = ({ children, className }) => /* @__PURE__ */
|
|
3402
|
+
import { jsx as jsx24, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3403
|
+
var SectionTitle = ({ children }) => /* @__PURE__ */ jsx24("h3", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children });
|
|
3404
|
+
var AccountRow = ({ children, className }) => /* @__PURE__ */ jsx24(
|
|
3241
3405
|
"div",
|
|
3242
3406
|
{
|
|
3243
3407
|
className: cn(
|
|
@@ -3249,7 +3413,7 @@ var AccountRow = ({ children, className }) => /* @__PURE__ */ jsx23(
|
|
|
3249
3413
|
children
|
|
3250
3414
|
}
|
|
3251
3415
|
);
|
|
3252
|
-
var ConnectTextButton = ({ onClick }) => /* @__PURE__ */
|
|
3416
|
+
var ConnectTextButton = ({ onClick }) => /* @__PURE__ */ jsx24(
|
|
3253
3417
|
"button",
|
|
3254
3418
|
{
|
|
3255
3419
|
type: "button",
|
|
@@ -3258,7 +3422,7 @@ var ConnectTextButton = ({ onClick }) => /* @__PURE__ */ jsx23(
|
|
|
3258
3422
|
children: "Connect"
|
|
3259
3423
|
}
|
|
3260
3424
|
);
|
|
3261
|
-
var DisconnectTextButton = ({ onClick }) => /* @__PURE__ */
|
|
3425
|
+
var DisconnectTextButton = ({ onClick }) => /* @__PURE__ */ jsx24(
|
|
3262
3426
|
"button",
|
|
3263
3427
|
{
|
|
3264
3428
|
type: "button",
|
|
@@ -3270,13 +3434,13 @@ var DisconnectTextButton = ({ onClick }) => /* @__PURE__ */ jsx23(
|
|
|
3270
3434
|
var TRADING_ACCESS_VENUES = ["kalshi", "polymarket", "opinion", "predict"];
|
|
3271
3435
|
var VerifyIdentityButton = ({ onError }) => {
|
|
3272
3436
|
const client = useAggClient();
|
|
3273
|
-
const [isInitiating, setIsInitiating] =
|
|
3274
|
-
const [needsDepositAddress, setNeedsDepositAddress] =
|
|
3437
|
+
const [isInitiating, setIsInitiating] = useState9(false);
|
|
3438
|
+
const [needsDepositAddress, setNeedsDepositAddress] = useState9(false);
|
|
3275
3439
|
const { isReady, isTimedOut } = useDepositAddresses2({
|
|
3276
3440
|
enabled: needsDepositAddress,
|
|
3277
3441
|
poll: true
|
|
3278
3442
|
});
|
|
3279
|
-
|
|
3443
|
+
useEffect6(() => {
|
|
3280
3444
|
if (!isInitiating || !isReady) return;
|
|
3281
3445
|
const redirectUri = window.location.href;
|
|
3282
3446
|
client.initiateKyc("kalshi", redirectUri).then((res) => {
|
|
@@ -3290,7 +3454,7 @@ var VerifyIdentityButton = ({ onError }) => {
|
|
|
3290
3454
|
setNeedsDepositAddress(false);
|
|
3291
3455
|
});
|
|
3292
3456
|
}, [isReady, isInitiating, client, onError]);
|
|
3293
|
-
|
|
3457
|
+
useEffect6(() => {
|
|
3294
3458
|
if (isTimedOut && isInitiating) {
|
|
3295
3459
|
setIsInitiating(false);
|
|
3296
3460
|
setNeedsDepositAddress(false);
|
|
@@ -3301,14 +3465,14 @@ var VerifyIdentityButton = ({ onError }) => {
|
|
|
3301
3465
|
setIsInitiating(true);
|
|
3302
3466
|
setNeedsDepositAddress(true);
|
|
3303
3467
|
}, []);
|
|
3304
|
-
return /* @__PURE__ */
|
|
3468
|
+
return /* @__PURE__ */ jsx24(
|
|
3305
3469
|
"button",
|
|
3306
3470
|
{
|
|
3307
3471
|
type: "button",
|
|
3308
3472
|
disabled: isInitiating,
|
|
3309
3473
|
onClick: handleClick,
|
|
3310
3474
|
className: "shrink-0 cursor-pointer text-agg-sm font-agg-bold leading-agg-5 text-agg-primary whitespace-nowrap disabled:cursor-not-allowed disabled:opacity-60",
|
|
3311
|
-
children: isInitiating ? /* @__PURE__ */
|
|
3475
|
+
children: isInitiating ? /* @__PURE__ */ jsx24("span", { className: "inline-block h-4 w-4 animate-spin rounded-full border-2 border-current border-t-transparent" }) : "Verify Identity"
|
|
3312
3476
|
}
|
|
3313
3477
|
);
|
|
3314
3478
|
};
|
|
@@ -3316,26 +3480,26 @@ var TradingAccessSection = ({
|
|
|
3316
3480
|
venueAccounts,
|
|
3317
3481
|
onKycError
|
|
3318
3482
|
}) => {
|
|
3319
|
-
return /* @__PURE__ */
|
|
3320
|
-
/* @__PURE__ */
|
|
3321
|
-
/* @__PURE__ */
|
|
3483
|
+
return /* @__PURE__ */ jsxs24("div", { className: "agg-trading-access-section flex flex-col gap-3", children: [
|
|
3484
|
+
/* @__PURE__ */ jsx24(SectionTitle, { children: "Trading access" }),
|
|
3485
|
+
/* @__PURE__ */ jsx24("div", { className: "flex flex-col gap-2", children: TRADING_ACCESS_VENUES.map((venue) => {
|
|
3322
3486
|
var _a;
|
|
3323
3487
|
const venueAccount = venueAccounts == null ? void 0 : venueAccounts.find((va) => va.venue === venue);
|
|
3324
3488
|
const isKalshi = venue === "kalshi";
|
|
3325
3489
|
const isVerified = (venueAccount == null ? void 0 : venueAccount.kycStatus) === "verified";
|
|
3326
3490
|
const displayName = (_a = venueLogoLabels[venue]) != null ? _a : venue;
|
|
3327
|
-
return /* @__PURE__ */
|
|
3328
|
-
/* @__PURE__ */
|
|
3329
|
-
/* @__PURE__ */
|
|
3330
|
-
/* @__PURE__ */
|
|
3491
|
+
return /* @__PURE__ */ jsxs24(AccountRow, { children: [
|
|
3492
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
|
|
3493
|
+
/* @__PURE__ */ jsx24(VenueLogo, { venue, size: "small" }),
|
|
3494
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: displayName })
|
|
3331
3495
|
] }),
|
|
3332
|
-
isKalshi && !isVerified ? /* @__PURE__ */
|
|
3333
|
-
/* @__PURE__ */
|
|
3334
|
-
/* @__PURE__ */
|
|
3335
|
-
] }) : isKalshi && isVerified ? /* @__PURE__ */
|
|
3336
|
-
/* @__PURE__ */
|
|
3337
|
-
/* @__PURE__ */
|
|
3338
|
-
/* @__PURE__ */
|
|
3496
|
+
isKalshi && !isVerified ? /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-4", children: [
|
|
3497
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-sm font-agg-normal leading-agg-5 text-agg-muted-foreground whitespace-nowrap", children: "KYC required" }),
|
|
3498
|
+
/* @__PURE__ */ jsx24(VerifyIdentityButton, { onError: onKycError })
|
|
3499
|
+
] }) : isKalshi && isVerified ? /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-4", children: [
|
|
3500
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-sm font-agg-normal leading-agg-5 text-agg-muted-foreground whitespace-nowrap", children: "Verified" }),
|
|
3501
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-2", children: [
|
|
3502
|
+
/* @__PURE__ */ jsx24(
|
|
3339
3503
|
Icon,
|
|
3340
3504
|
{
|
|
3341
3505
|
name: "check-badge",
|
|
@@ -3343,11 +3507,11 @@ var TradingAccessSection = ({
|
|
|
3343
3507
|
color: "var(--agg-color-primary, #536dfe)"
|
|
3344
3508
|
}
|
|
3345
3509
|
),
|
|
3346
|
-
/* @__PURE__ */
|
|
3510
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-sm font-agg-normal leading-agg-5 text-agg-foreground whitespace-nowrap", children: "Available" })
|
|
3347
3511
|
] })
|
|
3348
|
-
] }) : /* @__PURE__ */
|
|
3349
|
-
/* @__PURE__ */
|
|
3350
|
-
/* @__PURE__ */
|
|
3512
|
+
] }) : /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-2", children: [
|
|
3513
|
+
/* @__PURE__ */ jsx24(Icon, { name: "check-badge", size: "small", color: "var(--agg-color-primary, #536dfe)" }),
|
|
3514
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-sm font-agg-normal leading-agg-5 text-agg-foreground whitespace-nowrap", children: "Available" })
|
|
3351
3515
|
] })
|
|
3352
3516
|
] }, venue);
|
|
3353
3517
|
}) })
|
|
@@ -3375,37 +3539,37 @@ var AccountsWalletsTab = ({
|
|
|
3375
3539
|
const twitter = socialAccounts == null ? void 0 : socialAccounts.twitter;
|
|
3376
3540
|
const google = socialAccounts == null ? void 0 : socialAccounts.google;
|
|
3377
3541
|
const apple = socialAccounts == null ? void 0 : socialAccounts.apple;
|
|
3378
|
-
return /* @__PURE__ */
|
|
3379
|
-
/* @__PURE__ */
|
|
3380
|
-
/* @__PURE__ */
|
|
3381
|
-
/* @__PURE__ */
|
|
3382
|
-
/* @__PURE__ */
|
|
3383
|
-
/* @__PURE__ */
|
|
3384
|
-
/* @__PURE__ */
|
|
3385
|
-
/* @__PURE__ */
|
|
3386
|
-
/* @__PURE__ */
|
|
3542
|
+
return /* @__PURE__ */ jsxs24("div", { className: "agg-accounts-wallets-tab flex flex-col gap-8", children: [
|
|
3543
|
+
/* @__PURE__ */ jsx24(TradingAccessSection, { venueAccounts, onKycError }),
|
|
3544
|
+
/* @__PURE__ */ jsxs24("div", { className: "agg-social-accounts-section flex flex-col gap-3", children: [
|
|
3545
|
+
/* @__PURE__ */ jsx24(SectionTitle, { children: "Social Accounts" }),
|
|
3546
|
+
/* @__PURE__ */ jsxs24("div", { className: "agg-social-accounts-list flex flex-col gap-2", children: [
|
|
3547
|
+
/* @__PURE__ */ jsxs24(AccountRow, { className: "agg-social-account-row", children: [
|
|
3548
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
|
|
3549
|
+
/* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-agg-foreground", children: /* @__PURE__ */ jsx24(Icon, { name: "google", size: "small", color: "currentColor" }) }),
|
|
3550
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "Google" })
|
|
3387
3551
|
] }),
|
|
3388
|
-
(google == null ? void 0 : google.connected) ? /* @__PURE__ */
|
|
3552
|
+
(google == null ? void 0 : google.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectGoogle }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectGoogle })
|
|
3389
3553
|
] }),
|
|
3390
|
-
/* @__PURE__ */
|
|
3391
|
-
/* @__PURE__ */
|
|
3392
|
-
/* @__PURE__ */
|
|
3393
|
-
/* @__PURE__ */
|
|
3554
|
+
/* @__PURE__ */ jsxs24(AccountRow, { className: "agg-social-account-row", children: [
|
|
3555
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
|
|
3556
|
+
/* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-agg-foreground", children: /* @__PURE__ */ jsx24(Icon, { name: "apple", size: "small", color: "currentColor" }) }),
|
|
3557
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "Apple" })
|
|
3394
3558
|
] }),
|
|
3395
|
-
(apple == null ? void 0 : apple.connected) ? /* @__PURE__ */
|
|
3559
|
+
(apple == null ? void 0 : apple.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectApple }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectApple })
|
|
3396
3560
|
] }),
|
|
3397
|
-
/* @__PURE__ */
|
|
3398
|
-
/* @__PURE__ */
|
|
3399
|
-
/* @__PURE__ */
|
|
3400
|
-
/* @__PURE__ */
|
|
3561
|
+
/* @__PURE__ */ jsxs24(AccountRow, { className: "agg-social-account-row", children: [
|
|
3562
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
|
|
3563
|
+
/* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-agg-foreground", children: /* @__PURE__ */ jsx24(Icon, { name: "twitter", size: "small", color: "currentColor" }) }),
|
|
3564
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "X (Twitter)" })
|
|
3401
3565
|
] }),
|
|
3402
|
-
(twitter == null ? void 0 : twitter.connected) ? /* @__PURE__ */
|
|
3566
|
+
(twitter == null ? void 0 : twitter.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectTwitter }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectTwitter })
|
|
3403
3567
|
] })
|
|
3404
3568
|
] })
|
|
3405
3569
|
] }),
|
|
3406
|
-
/* @__PURE__ */
|
|
3407
|
-
/* @__PURE__ */
|
|
3408
|
-
/* @__PURE__ */
|
|
3570
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-3", children: [
|
|
3571
|
+
/* @__PURE__ */ jsx24(SectionTitle, { children: "Email Address" }),
|
|
3572
|
+
/* @__PURE__ */ jsxs24(
|
|
3409
3573
|
"button",
|
|
3410
3574
|
{
|
|
3411
3575
|
type: "button",
|
|
@@ -3417,11 +3581,11 @@ var AccountsWalletsTab = ({
|
|
|
3417
3581
|
"cursor-pointer hover:bg-agg-secondary-hover"
|
|
3418
3582
|
),
|
|
3419
3583
|
children: [
|
|
3420
|
-
/* @__PURE__ */
|
|
3421
|
-
/* @__PURE__ */
|
|
3422
|
-
/* @__PURE__ */
|
|
3584
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
|
|
3585
|
+
/* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-agg-foreground", children: /* @__PURE__ */ jsx24(Icon, { name: "email", size: "small", color: "currentColor" }) }),
|
|
3586
|
+
/* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: email != null ? email : "Connect email" })
|
|
3423
3587
|
] }),
|
|
3424
|
-
/* @__PURE__ */
|
|
3588
|
+
/* @__PURE__ */ jsx24(Icon, { name: "chevron-right", size: "small", color: "currentColor" })
|
|
3425
3589
|
]
|
|
3426
3590
|
}
|
|
3427
3591
|
)
|
|
@@ -3431,7 +3595,7 @@ var AccountsWalletsTab = ({
|
|
|
3431
3595
|
AccountsWalletsTab.displayName = "AccountsWalletsTab";
|
|
3432
3596
|
|
|
3433
3597
|
// src/profile/index.tsx
|
|
3434
|
-
import { jsx as
|
|
3598
|
+
import { jsx as jsx25, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3435
3599
|
var EVM_WALLET_VENUES = [Venue4.polymarket, Venue4.predict, Venue4.opinion];
|
|
3436
3600
|
var ProfileModal = ({
|
|
3437
3601
|
open,
|
|
@@ -3462,14 +3626,15 @@ var ProfileModal = ({
|
|
|
3462
3626
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
3463
3627
|
const client = useAggClient2();
|
|
3464
3628
|
const { user, startAuth } = useAggAuthState2();
|
|
3465
|
-
const
|
|
3629
|
+
const toastCtx = useOptionalToast();
|
|
3630
|
+
const [activeTab, setActiveTab] = useState10(PROFILE_TAB_KEYS.ABOUT);
|
|
3466
3631
|
const resolvedInitialUsername = (_a = username != null ? username : user == null ? void 0 : user.username) != null ? _a : "";
|
|
3467
|
-
const [draftUsername, setDraftUsername] =
|
|
3468
|
-
const [draftAvatarFile, setDraftAvatarFile] =
|
|
3469
|
-
const [draftAvatarPreview, setDraftAvatarPreview] =
|
|
3470
|
-
const [isSaving, setIsSaving] =
|
|
3471
|
-
const [avatarTypeError, setAvatarTypeError] =
|
|
3472
|
-
|
|
3632
|
+
const [draftUsername, setDraftUsername] = useState10(resolvedInitialUsername);
|
|
3633
|
+
const [draftAvatarFile, setDraftAvatarFile] = useState10();
|
|
3634
|
+
const [draftAvatarPreview, setDraftAvatarPreview] = useState10();
|
|
3635
|
+
const [isSaving, setIsSaving] = useState10(false);
|
|
3636
|
+
const [avatarTypeError, setAvatarTypeError] = useState10(null);
|
|
3637
|
+
useEffect7(() => {
|
|
3473
3638
|
var _a2;
|
|
3474
3639
|
setDraftUsername((_a2 = username != null ? username : user == null ? void 0 : user.username) != null ? _a2 : "");
|
|
3475
3640
|
}, [username, user == null ? void 0 : user.username]);
|
|
@@ -3513,7 +3678,7 @@ var ProfileModal = ({
|
|
|
3513
3678
|
const originalUsername = (_b = username != null ? username : user == null ? void 0 : user.username) != null ? _b : "";
|
|
3514
3679
|
const hasChanges = draftUsername !== originalUsername || draftAvatarFile !== void 0;
|
|
3515
3680
|
const handleSave = useCallback8(() => __async(null, null, function* () {
|
|
3516
|
-
var _a2, _b2;
|
|
3681
|
+
var _a2, _b2, _c2;
|
|
3517
3682
|
setIsSaving(true);
|
|
3518
3683
|
try {
|
|
3519
3684
|
const normalizedUsername = draftUsername.trim();
|
|
@@ -3545,6 +3710,15 @@ var ProfileModal = ({
|
|
|
3545
3710
|
avatarPreview: resolvedAvatarPreview
|
|
3546
3711
|
});
|
|
3547
3712
|
onOpenChange(false);
|
|
3713
|
+
} catch (err) {
|
|
3714
|
+
const apiError = err;
|
|
3715
|
+
const fieldErrors = ((_c2 = apiError.errors) != null ? _c2 : []).map((e) => e == null ? void 0 : e.message).filter((m) => typeof m === "string" && m.length > 0);
|
|
3716
|
+
const toastMessage = fieldErrors.length > 0 ? fieldErrors.join("\n") : apiError.message || "Failed to save profile. Please try again.";
|
|
3717
|
+
if (toastCtx) {
|
|
3718
|
+
toastCtx.toast(toastMessage, { tone: "error", title: "Could not save profile" });
|
|
3719
|
+
} else if (typeof console !== "undefined") {
|
|
3720
|
+
console.error("[ProfileModal] save failed:", toastMessage);
|
|
3721
|
+
}
|
|
3548
3722
|
} finally {
|
|
3549
3723
|
setIsSaving(false);
|
|
3550
3724
|
}
|
|
@@ -3555,7 +3729,8 @@ var ProfileModal = ({
|
|
|
3555
3729
|
draftUsername,
|
|
3556
3730
|
onOpenChange,
|
|
3557
3731
|
onSave,
|
|
3558
|
-
originalUsername
|
|
3732
|
+
originalUsername,
|
|
3733
|
+
toastCtx
|
|
3559
3734
|
]);
|
|
3560
3735
|
const handleCancel = useCallback8(() => {
|
|
3561
3736
|
handleOpenChange(false);
|
|
@@ -3744,7 +3919,7 @@ var ProfileModal = ({
|
|
|
3744
3919
|
}),
|
|
3745
3920
|
[client, exchanges, onDisconnectExchangeProp]
|
|
3746
3921
|
);
|
|
3747
|
-
return /* @__PURE__ */
|
|
3922
|
+
return /* @__PURE__ */ jsx25(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs25(
|
|
3748
3923
|
Modal.Container,
|
|
3749
3924
|
{
|
|
3750
3925
|
maxWidth: "800px",
|
|
@@ -3753,77 +3928,67 @@ var ProfileModal = ({
|
|
|
3753
3928
|
container: cn("agg-profile-modal", "min-h-[37.5rem]")
|
|
3754
3929
|
},
|
|
3755
3930
|
children: [
|
|
3756
|
-
/* @__PURE__ */
|
|
3757
|
-
/* @__PURE__ */
|
|
3758
|
-
|
|
3759
|
-
|
|
3760
|
-
|
|
3761
|
-
|
|
3762
|
-
|
|
3763
|
-
|
|
3764
|
-
|
|
3765
|
-
|
|
3766
|
-
|
|
3767
|
-
|
|
3768
|
-
|
|
3769
|
-
|
|
3770
|
-
|
|
3771
|
-
|
|
3772
|
-
|
|
3773
|
-
|
|
3774
|
-
|
|
3775
|
-
|
|
3776
|
-
|
|
3777
|
-
|
|
3778
|
-
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
|
|
3782
|
-
|
|
3783
|
-
|
|
3784
|
-
|
|
3785
|
-
|
|
3786
|
-
|
|
3787
|
-
|
|
3788
|
-
|
|
3789
|
-
|
|
3790
|
-
"
|
|
3791
|
-
|
|
3792
|
-
|
|
3793
|
-
|
|
3794
|
-
|
|
3795
|
-
|
|
3796
|
-
|
|
3797
|
-
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
className:
|
|
3806
|
-
|
|
3807
|
-
|
|
3808
|
-
|
|
3809
|
-
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
|
|
3814
|
-
|
|
3815
|
-
|
|
3816
|
-
|
|
3817
|
-
]
|
|
3818
|
-
},
|
|
3819
|
-
tab.value
|
|
3820
|
-
);
|
|
3821
|
-
})
|
|
3822
|
-
}
|
|
3823
|
-
)
|
|
3824
|
-
] }),
|
|
3825
|
-
/* @__PURE__ */ jsxs24("div", { className: "agg-profile-content min-w-0 flex-1", children: [
|
|
3826
|
-
activeTab === PROFILE_TAB_KEYS.ABOUT ? /* @__PURE__ */ jsx24(
|
|
3931
|
+
/* @__PURE__ */ jsx25(Modal.Header, { title: "Edit Profile", classNames: { root: "agg-profile-modal-header" } }),
|
|
3932
|
+
/* @__PURE__ */ jsx25("div", { className: "agg-profile-tabs sm:hidden w-full", children: /* @__PURE__ */ jsx25(
|
|
3933
|
+
Tabs,
|
|
3934
|
+
{
|
|
3935
|
+
className: "w-full [&>div]:w-full",
|
|
3936
|
+
variant: "underline",
|
|
3937
|
+
classNames: { tabList: "w-full" },
|
|
3938
|
+
items: PROFILE_TAB_ITEMS.map((tab) => ({
|
|
3939
|
+
value: tab.value,
|
|
3940
|
+
label: tab.label,
|
|
3941
|
+
icon: /* @__PURE__ */ jsx25(Icon, { name: tab.icon, size: "small" })
|
|
3942
|
+
})),
|
|
3943
|
+
value: activeTab,
|
|
3944
|
+
onChange: (val) => setActiveTab(val)
|
|
3945
|
+
}
|
|
3946
|
+
) }),
|
|
3947
|
+
/* @__PURE__ */ jsx25(Modal.Body, { classNames: { root: cn("agg-profile-modal-body", "overflow-x-visible") }, children: /* @__PURE__ */ jsxs25("div", { className: "agg-profile-layout flex flex-col sm:flex-row sm:gap-10", children: [
|
|
3948
|
+
/* @__PURE__ */ jsx25("div", { className: "shrink-0", children: /* @__PURE__ */ jsx25(
|
|
3949
|
+
"nav",
|
|
3950
|
+
{
|
|
3951
|
+
className: cn(
|
|
3952
|
+
"agg-profile-sidebar",
|
|
3953
|
+
"hidden sm:sticky sm:top-0 sm:self-start sm:flex sm:flex-col",
|
|
3954
|
+
"w-[240px]",
|
|
3955
|
+
"overflow-hidden rounded-agg-lg",
|
|
3956
|
+
"border border-agg-separator",
|
|
3957
|
+
"bg-agg-secondary",
|
|
3958
|
+
"py-3"
|
|
3959
|
+
),
|
|
3960
|
+
role: "tablist",
|
|
3961
|
+
"aria-label": "Profile sections",
|
|
3962
|
+
children: PROFILE_TAB_ITEMS.map((tab) => {
|
|
3963
|
+
const isActive = activeTab === tab.value;
|
|
3964
|
+
return /* @__PURE__ */ jsxs25(
|
|
3965
|
+
"button",
|
|
3966
|
+
{
|
|
3967
|
+
type: "button",
|
|
3968
|
+
role: "tab",
|
|
3969
|
+
"aria-selected": isActive,
|
|
3970
|
+
onClick: () => setActiveTab(tab.value),
|
|
3971
|
+
className: cn(
|
|
3972
|
+
"agg-profile-tab-trigger",
|
|
3973
|
+
"relative flex items-center gap-3",
|
|
3974
|
+
"h-[49px] px-6 py-4",
|
|
3975
|
+
"text-agg-sm leading-agg-5 font-agg-sans",
|
|
3976
|
+
"transition-colors cursor-pointer",
|
|
3977
|
+
isActive ? "font-agg-normal text-agg-foreground bg-agg-secondary-hover" : "font-agg-normal text-agg-foreground"
|
|
3978
|
+
),
|
|
3979
|
+
children: [
|
|
3980
|
+
isActive ? /* @__PURE__ */ jsx25("div", { className: "absolute left-0 top-0 bottom-0 w-1 bg-agg-primary" }) : null,
|
|
3981
|
+
/* @__PURE__ */ jsx25(Icon, { name: tab.icon, size: "small", color: "currentColor" }),
|
|
3982
|
+
/* @__PURE__ */ jsx25("span", { className: "shrink-0 whitespace-nowrap", children: tab.label })
|
|
3983
|
+
]
|
|
3984
|
+
},
|
|
3985
|
+
tab.value
|
|
3986
|
+
);
|
|
3987
|
+
})
|
|
3988
|
+
}
|
|
3989
|
+
) }),
|
|
3990
|
+
/* @__PURE__ */ jsxs25("div", { className: "agg-profile-content min-w-0 flex-1", children: [
|
|
3991
|
+
activeTab === PROFILE_TAB_KEYS.ABOUT ? /* @__PURE__ */ jsx25(
|
|
3827
3992
|
AboutTab,
|
|
3828
3993
|
{
|
|
3829
3994
|
username: username != null ? username : user == null ? void 0 : user.username,
|
|
@@ -3837,7 +4002,7 @@ var ProfileModal = ({
|
|
|
3837
4002
|
avatarError: avatarTypeError
|
|
3838
4003
|
}
|
|
3839
4004
|
) : null,
|
|
3840
|
-
activeTab === PROFILE_TAB_KEYS.ACCOUNTS_WALLETS ? /* @__PURE__ */
|
|
4005
|
+
activeTab === PROFILE_TAB_KEYS.ACCOUNTS_WALLETS ? /* @__PURE__ */ jsx25(
|
|
3841
4006
|
AccountsWalletsTab,
|
|
3842
4007
|
{
|
|
3843
4008
|
exchanges: resolvedExchanges,
|
|
@@ -3867,9 +4032,9 @@ var ProfileModal = ({
|
|
|
3867
4032
|
) : null
|
|
3868
4033
|
] })
|
|
3869
4034
|
] }) }),
|
|
3870
|
-
/* @__PURE__ */
|
|
3871
|
-
/* @__PURE__ */
|
|
3872
|
-
/* @__PURE__ */
|
|
4035
|
+
/* @__PURE__ */ jsxs25(Modal.Footer, { classNames: { root: "agg-profile-modal-footer" }, children: [
|
|
4036
|
+
/* @__PURE__ */ jsx25(Button, { variant: "secondary", size: "large", onClick: handleCancel, className: "min-w-[120px]", children: "Cancel" }),
|
|
4037
|
+
/* @__PURE__ */ jsx25(
|
|
3873
4038
|
Button,
|
|
3874
4039
|
{
|
|
3875
4040
|
variant: "primary",
|
|
@@ -3888,53 +4053,57 @@ var ProfileModal = ({
|
|
|
3888
4053
|
ProfileModal.displayName = "ProfileModal";
|
|
3889
4054
|
|
|
3890
4055
|
// src/geo-block-modal/index.tsx
|
|
3891
|
-
import { useLabels as
|
|
4056
|
+
import { useLabels as useLabels22 } from "@agg-build/hooks";
|
|
3892
4057
|
import { useCallback as useCallback9 } from "react";
|
|
3893
|
-
import { jsx as
|
|
4058
|
+
import { jsx as jsx26, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3894
4059
|
var GeoBlockModal = ({
|
|
3895
4060
|
open,
|
|
3896
4061
|
onOpenChange,
|
|
3897
4062
|
onConfirm,
|
|
3898
4063
|
classNames
|
|
3899
4064
|
}) => {
|
|
3900
|
-
const labels =
|
|
4065
|
+
const labels = useLabels22();
|
|
3901
4066
|
const handleConfirm = useCallback9(() => {
|
|
3902
4067
|
onConfirm == null ? void 0 : onConfirm();
|
|
3903
4068
|
onOpenChange(false);
|
|
3904
4069
|
}, [onConfirm, onOpenChange]);
|
|
3905
|
-
return /* @__PURE__ */
|
|
4070
|
+
return /* @__PURE__ */ jsx26(
|
|
3906
4071
|
Modal,
|
|
3907
4072
|
{
|
|
3908
4073
|
open,
|
|
3909
4074
|
onOpenChange,
|
|
3910
4075
|
"aria-label": labels.trading.geoBlockModalAriaLabel,
|
|
3911
|
-
children: /* @__PURE__ */
|
|
4076
|
+
children: /* @__PURE__ */ jsxs26(
|
|
3912
4077
|
Modal.Container,
|
|
3913
4078
|
{
|
|
3914
4079
|
maxWidth: "480px",
|
|
3915
4080
|
classNames: { container: cn("!rounded-agg-2xl", classNames == null ? void 0 : classNames.container) },
|
|
3916
4081
|
children: [
|
|
3917
|
-
/* @__PURE__ */
|
|
4082
|
+
/* @__PURE__ */ jsx26(
|
|
3918
4083
|
Modal.Header,
|
|
3919
4084
|
{
|
|
3920
4085
|
title: "",
|
|
3921
4086
|
hideBorder: true,
|
|
3922
|
-
classNames: {
|
|
4087
|
+
classNames: {
|
|
4088
|
+
root: "min-h-0! h-12!",
|
|
4089
|
+
container: "p-0! sm:p-0!",
|
|
4090
|
+
close: "absolute top-8 right-8"
|
|
4091
|
+
}
|
|
3923
4092
|
}
|
|
3924
4093
|
),
|
|
3925
|
-
/* @__PURE__ */
|
|
3926
|
-
/* @__PURE__ */
|
|
4094
|
+
/* @__PURE__ */ jsx26(Modal.Body, { classNames: { root: cn("!px-10 !pt-0 !pb-12", classNames == null ? void 0 : classNames.body) }, children: /* @__PURE__ */ jsxs26("div", { className: "flex flex-col items-center gap-8", children: [
|
|
4095
|
+
/* @__PURE__ */ jsx26(
|
|
3927
4096
|
Icon,
|
|
3928
4097
|
{
|
|
3929
4098
|
name: "internet-security",
|
|
3930
4099
|
className: "h-[60px] w-[60px] text-agg-muted-foreground"
|
|
3931
4100
|
}
|
|
3932
4101
|
),
|
|
3933
|
-
/* @__PURE__ */
|
|
3934
|
-
/* @__PURE__ */
|
|
3935
|
-
/* @__PURE__ */
|
|
4102
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex flex-col items-center gap-3 text-center", children: [
|
|
4103
|
+
/* @__PURE__ */ jsx26("h2", { className: "text-agg-2xl font-agg-bold leading-agg-8 text-agg-foreground", children: labels.trading.geoBlockModalTitle }),
|
|
4104
|
+
/* @__PURE__ */ jsx26("p", { className: "text-agg-base font-agg-normal leading-agg-6 text-agg-foreground", children: labels.trading.geoBlockModalDescription })
|
|
3936
4105
|
] }),
|
|
3937
|
-
/* @__PURE__ */
|
|
4106
|
+
/* @__PURE__ */ jsx26(
|
|
3938
4107
|
Button,
|
|
3939
4108
|
{
|
|
3940
4109
|
variant: "secondary",
|