@spicenet-io/spiceflow-ui 1.9.9 → 1.9.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/index.cjs.js +358 -278
- package/dist/index.js +356 -276
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -12,11 +12,10 @@ const reactAuth = require('@privy-io/react-auth');
|
|
|
12
12
|
const sdkReactCore = require('@dynamic-labs/sdk-react-core');
|
|
13
13
|
const spiceflowCoreTest = require('spiceflow-core-test');
|
|
14
14
|
const wagmi = require('wagmi');
|
|
15
|
-
const chains$1 = require('@/utils/chains');
|
|
16
15
|
const authDynamic = require('./auth-dynamic.cjs.js');
|
|
17
16
|
const authPrivy = require('./auth-privy.cjs.js');
|
|
18
17
|
const reactQuery = require('@tanstack/react-query');
|
|
19
|
-
const chains$
|
|
18
|
+
const chains$1 = require('wagmi/chains');
|
|
20
19
|
const connectors = require('wagmi/connectors');
|
|
21
20
|
|
|
22
21
|
const CHAIN_CONFIGS = {
|
|
@@ -61,7 +60,7 @@ const CHAIN_CONFIGS = {
|
|
|
61
60
|
{
|
|
62
61
|
address: "0x4Fc381B6CC6Df8cF1c1bD46D184475bE5b7A3c62",
|
|
63
62
|
name: "Mock Wrapped BTC",
|
|
64
|
-
symbol: "
|
|
63
|
+
symbol: "WBTC",
|
|
65
64
|
decimals: 8
|
|
66
65
|
}
|
|
67
66
|
]
|
|
@@ -97,6 +96,12 @@ const CHAIN_CONFIGS = {
|
|
|
97
96
|
name: "USD Coin",
|
|
98
97
|
symbol: "USDC",
|
|
99
98
|
decimals: 18
|
|
99
|
+
},
|
|
100
|
+
{
|
|
101
|
+
address: "0xBA4c54d4CF10C766c22A08F783998cFaB237F7C9",
|
|
102
|
+
name: "Mock Wrapped BTC",
|
|
103
|
+
symbol: "WBTC",
|
|
104
|
+
decimals: 8
|
|
100
105
|
}
|
|
101
106
|
]
|
|
102
107
|
},
|
|
@@ -133,9 +138,9 @@ const CHAIN_CONFIGS = {
|
|
|
133
138
|
decimals: 18
|
|
134
139
|
},
|
|
135
140
|
{
|
|
136
|
-
address: "
|
|
141
|
+
address: "0x16DD3a855433059Be478FAcb416D9aFed6CA96Ec",
|
|
137
142
|
name: "Mock Wrapped BTC",
|
|
138
|
-
symbol: "
|
|
143
|
+
symbol: "WBTC",
|
|
139
144
|
decimals: 8
|
|
140
145
|
}
|
|
141
146
|
]
|
|
@@ -3081,7 +3086,7 @@ const useWallet = () => {
|
|
|
3081
3086
|
};
|
|
3082
3087
|
};
|
|
3083
3088
|
|
|
3084
|
-
const RELAYER_API_URL = process.env.NEXT_PUBLIC_RELAYER_API_URL || "https://tx-api.spicenet.io/";
|
|
3089
|
+
const RELAYER_API_URL = process.env.NEXT_PUBLIC_RELAYER_API_URL || "https://tx-submission-api-dev.spicenet.io/";
|
|
3085
3090
|
class RelayerService {
|
|
3086
3091
|
constructor() {
|
|
3087
3092
|
this.baseUrl = RELAYER_API_URL;
|
|
@@ -4116,6 +4121,138 @@ const useSpiceAssets = ({
|
|
|
4116
4121
|
};
|
|
4117
4122
|
};
|
|
4118
4123
|
|
|
4124
|
+
const StatusCard = ({ isSuccess, chainName, explorerUrl, txHash }) => {
|
|
4125
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4126
|
+
"div",
|
|
4127
|
+
{
|
|
4128
|
+
style: {
|
|
4129
|
+
display: "flex",
|
|
4130
|
+
alignItems: "center",
|
|
4131
|
+
justifyContent: "space-between",
|
|
4132
|
+
padding: "14px 16px",
|
|
4133
|
+
borderRadius: "8px",
|
|
4134
|
+
backgroundColor: isSuccess ? "#d1fae5" : "#fee2e2",
|
|
4135
|
+
border: isSuccess ? "1px solid #6ee7b7" : "1px solid #fca5a5"
|
|
4136
|
+
},
|
|
4137
|
+
children: [
|
|
4138
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [
|
|
4139
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4140
|
+
"div",
|
|
4141
|
+
{
|
|
4142
|
+
style: {
|
|
4143
|
+
width: "28px",
|
|
4144
|
+
height: "28px",
|
|
4145
|
+
borderRadius: "50%",
|
|
4146
|
+
backgroundColor: isSuccess ? "#10b981" : "#ef4444",
|
|
4147
|
+
display: "flex",
|
|
4148
|
+
alignItems: "center",
|
|
4149
|
+
justifyContent: "center"
|
|
4150
|
+
},
|
|
4151
|
+
children: isSuccess ? /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4152
|
+
"path",
|
|
4153
|
+
{
|
|
4154
|
+
d: "M11.6667 3.5L5.25 9.91667L2.33333 7",
|
|
4155
|
+
stroke: "white",
|
|
4156
|
+
strokeWidth: "2",
|
|
4157
|
+
strokeLinecap: "round",
|
|
4158
|
+
strokeLinejoin: "round"
|
|
4159
|
+
}
|
|
4160
|
+
) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4161
|
+
"path",
|
|
4162
|
+
{
|
|
4163
|
+
d: "M10.5 3.5L3.5 10.5M3.5 3.5L10.5 10.5",
|
|
4164
|
+
stroke: "white",
|
|
4165
|
+
strokeWidth: "2",
|
|
4166
|
+
strokeLinecap: "round",
|
|
4167
|
+
strokeLinejoin: "round"
|
|
4168
|
+
}
|
|
4169
|
+
) })
|
|
4170
|
+
}
|
|
4171
|
+
),
|
|
4172
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4173
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4174
|
+
"p",
|
|
4175
|
+
{
|
|
4176
|
+
style: {
|
|
4177
|
+
margin: 0,
|
|
4178
|
+
fontSize: "14px",
|
|
4179
|
+
fontWeight: 600,
|
|
4180
|
+
fontFamily: '"IBM Plex Mono", monospace',
|
|
4181
|
+
letterSpacing: "0.5px",
|
|
4182
|
+
color: isSuccess ? "#065f46" : "#dc2626"
|
|
4183
|
+
},
|
|
4184
|
+
children: isSuccess ? "DEPOSIT CONFIRMED" : "DEPOSIT FAILED"
|
|
4185
|
+
}
|
|
4186
|
+
),
|
|
4187
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4188
|
+
"p",
|
|
4189
|
+
{
|
|
4190
|
+
style: {
|
|
4191
|
+
margin: "2px 0 0 0",
|
|
4192
|
+
fontSize: "12px",
|
|
4193
|
+
color: "#6b7280"
|
|
4194
|
+
},
|
|
4195
|
+
children: [
|
|
4196
|
+
"on ",
|
|
4197
|
+
chainName
|
|
4198
|
+
]
|
|
4199
|
+
}
|
|
4200
|
+
)
|
|
4201
|
+
] })
|
|
4202
|
+
] }),
|
|
4203
|
+
explorerUrl && txHash && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4204
|
+
"a",
|
|
4205
|
+
{
|
|
4206
|
+
href: `${explorerUrl}/tx/${txHash}`,
|
|
4207
|
+
target: "_blank",
|
|
4208
|
+
rel: "noopener noreferrer",
|
|
4209
|
+
style: {
|
|
4210
|
+
display: "flex",
|
|
4211
|
+
alignItems: "center",
|
|
4212
|
+
gap: "4px",
|
|
4213
|
+
fontSize: "13px",
|
|
4214
|
+
color: "#6b7280",
|
|
4215
|
+
textDecoration: "none",
|
|
4216
|
+
whiteSpace: "nowrap"
|
|
4217
|
+
},
|
|
4218
|
+
children: [
|
|
4219
|
+
"View on explorer",
|
|
4220
|
+
/* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: [
|
|
4221
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4222
|
+
"path",
|
|
4223
|
+
{
|
|
4224
|
+
d: "M9 6.5V9.5C9 9.76522 8.89464 10.0196 8.70711 10.2071C8.51957 10.3946 8.26522 10.5 8 10.5H2.5C2.23478 10.5 1.98043 10.3946 1.79289 10.2071C1.60536 10.0196 1.5 9.76522 1.5 9.5V4C1.5 3.73478 1.60536 3.48043 1.79289 3.29289C1.98043 3.10536 2.23478 3 2.5 3H5.5",
|
|
4225
|
+
stroke: "currentColor",
|
|
4226
|
+
strokeLinecap: "round",
|
|
4227
|
+
strokeLinejoin: "round"
|
|
4228
|
+
}
|
|
4229
|
+
),
|
|
4230
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4231
|
+
"path",
|
|
4232
|
+
{
|
|
4233
|
+
d: "M7.5 1.5H10.5V4.5",
|
|
4234
|
+
stroke: "currentColor",
|
|
4235
|
+
strokeLinecap: "round",
|
|
4236
|
+
strokeLinejoin: "round"
|
|
4237
|
+
}
|
|
4238
|
+
),
|
|
4239
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4240
|
+
"path",
|
|
4241
|
+
{
|
|
4242
|
+
d: "M5 7L10.5 1.5",
|
|
4243
|
+
stroke: "currentColor",
|
|
4244
|
+
strokeLinecap: "round",
|
|
4245
|
+
strokeLinejoin: "round"
|
|
4246
|
+
}
|
|
4247
|
+
)
|
|
4248
|
+
] })
|
|
4249
|
+
]
|
|
4250
|
+
}
|
|
4251
|
+
)
|
|
4252
|
+
]
|
|
4253
|
+
}
|
|
4254
|
+
);
|
|
4255
|
+
};
|
|
4119
4256
|
const DepositStatusPanel = ({
|
|
4120
4257
|
isOpen,
|
|
4121
4258
|
onClose,
|
|
@@ -4137,12 +4274,6 @@ const DepositStatusPanel = ({
|
|
|
4137
4274
|
setIsClosing(false);
|
|
4138
4275
|
}
|
|
4139
4276
|
}, [isOpen, intentStatus]);
|
|
4140
|
-
const handleClose = () => {
|
|
4141
|
-
setIsClosing(true);
|
|
4142
|
-
setTimeout(() => {
|
|
4143
|
-
onClose();
|
|
4144
|
-
}, 300);
|
|
4145
|
-
};
|
|
4146
4277
|
const handleComplete = () => {
|
|
4147
4278
|
setIsClosing(true);
|
|
4148
4279
|
setTimeout(() => {
|
|
@@ -4157,6 +4288,12 @@ const DepositStatusPanel = ({
|
|
|
4157
4288
|
const isProcessing = overallStatus === "processing";
|
|
4158
4289
|
const isSuccess = overallStatus === "success";
|
|
4159
4290
|
const isError = overallStatus === "failed";
|
|
4291
|
+
const stepWithTxHash = steps.find((step) => step.transactionHash);
|
|
4292
|
+
const derivedChainName = chainName !== "Network" ? chainName : steps[0]?.chainName || chainName;
|
|
4293
|
+
const derivedExplorerUrl = explorerUrl || (stepWithTxHash ? getExplorerUrl(
|
|
4294
|
+
stepWithTxHash.chainId,
|
|
4295
|
+
stepWithTxHash.transactionHash || ""
|
|
4296
|
+
).replace(/\/tx\/.*$/, "") : void 0);
|
|
4160
4297
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4161
4298
|
"div",
|
|
4162
4299
|
{
|
|
@@ -4175,20 +4312,56 @@ const DepositStatusPanel = ({
|
|
|
4175
4312
|
display: "flex",
|
|
4176
4313
|
alignItems: "center",
|
|
4177
4314
|
justifyContent: "space-between",
|
|
4178
|
-
marginBottom: "
|
|
4315
|
+
marginBottom: "16px"
|
|
4179
4316
|
},
|
|
4180
4317
|
children: [
|
|
4181
|
-
/* @__PURE__ */ jsxRuntime.
|
|
4182
|
-
"
|
|
4318
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4319
|
+
"div",
|
|
4183
4320
|
{
|
|
4184
4321
|
style: {
|
|
4185
|
-
|
|
4186
|
-
|
|
4187
|
-
|
|
4188
|
-
|
|
4189
|
-
fontFamily: styles?.fontFamily || theme.typography.fontFamily
|
|
4322
|
+
display: "flex",
|
|
4323
|
+
alignItems: "center",
|
|
4324
|
+
gap: "8px",
|
|
4325
|
+
cursor: !isProcessing ? "pointer" : "default"
|
|
4190
4326
|
},
|
|
4191
|
-
|
|
4327
|
+
onClick: !isProcessing ? toggleDetails : void 0,
|
|
4328
|
+
children: [
|
|
4329
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4330
|
+
"span",
|
|
4331
|
+
{
|
|
4332
|
+
style: {
|
|
4333
|
+
fontSize: "13px",
|
|
4334
|
+
fontWeight: 500,
|
|
4335
|
+
color: "#6b7280",
|
|
4336
|
+
fontFamily: styles?.fontFamily || theme.typography.fontFamily
|
|
4337
|
+
},
|
|
4338
|
+
children: "Deposit Results"
|
|
4339
|
+
}
|
|
4340
|
+
),
|
|
4341
|
+
!isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4342
|
+
"svg",
|
|
4343
|
+
{
|
|
4344
|
+
width: "16",
|
|
4345
|
+
height: "16",
|
|
4346
|
+
viewBox: "0 0 16 16",
|
|
4347
|
+
fill: "none",
|
|
4348
|
+
style: {
|
|
4349
|
+
transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
|
|
4350
|
+
transition: "transform 0.3s ease"
|
|
4351
|
+
},
|
|
4352
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4353
|
+
"path",
|
|
4354
|
+
{
|
|
4355
|
+
d: "M4 6L8 10L12 6",
|
|
4356
|
+
stroke: "#6b7280",
|
|
4357
|
+
strokeWidth: "2",
|
|
4358
|
+
strokeLinecap: "round",
|
|
4359
|
+
strokeLinejoin: "round"
|
|
4360
|
+
}
|
|
4361
|
+
)
|
|
4362
|
+
}
|
|
4363
|
+
)
|
|
4364
|
+
]
|
|
4192
4365
|
}
|
|
4193
4366
|
),
|
|
4194
4367
|
!isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4200,6 +4373,9 @@ const DepositStatusPanel = ({
|
|
|
4200
4373
|
border: "none",
|
|
4201
4374
|
cursor: "pointer",
|
|
4202
4375
|
padding: "4px",
|
|
4376
|
+
display: "flex",
|
|
4377
|
+
alignItems: "center",
|
|
4378
|
+
justifyContent: "center",
|
|
4203
4379
|
color: "#6b7280"
|
|
4204
4380
|
},
|
|
4205
4381
|
children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4217,65 +4393,89 @@ const DepositStatusPanel = ({
|
|
|
4217
4393
|
]
|
|
4218
4394
|
}
|
|
4219
4395
|
),
|
|
4220
|
-
/* @__PURE__ */ jsxRuntime.
|
|
4396
|
+
isProcessing && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4221
4397
|
"div",
|
|
4222
4398
|
{
|
|
4223
4399
|
style: {
|
|
4224
4400
|
display: "flex",
|
|
4225
|
-
|
|
4226
|
-
|
|
4401
|
+
flexDirection: "column",
|
|
4402
|
+
alignItems: "center",
|
|
4403
|
+
padding: "24px",
|
|
4404
|
+
marginBottom: "16px"
|
|
4405
|
+
},
|
|
4406
|
+
children: [
|
|
4407
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4408
|
+
"div",
|
|
4409
|
+
{
|
|
4410
|
+
style: {
|
|
4411
|
+
width: "48px",
|
|
4412
|
+
height: "48px",
|
|
4413
|
+
border: "3px solid #e5e7eb",
|
|
4414
|
+
borderTopColor: theme.colors.primary,
|
|
4415
|
+
borderRadius: "50%",
|
|
4416
|
+
animation: "spin 1s linear infinite",
|
|
4417
|
+
marginBottom: "16px"
|
|
4418
|
+
}
|
|
4419
|
+
}
|
|
4420
|
+
),
|
|
4421
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4422
|
+
"p",
|
|
4423
|
+
{
|
|
4424
|
+
style: {
|
|
4425
|
+
fontSize: "14px",
|
|
4426
|
+
fontWeight: 500,
|
|
4427
|
+
color: "#374151",
|
|
4428
|
+
margin: 0
|
|
4429
|
+
},
|
|
4430
|
+
children: "Processing your deposit..."
|
|
4431
|
+
}
|
|
4432
|
+
)
|
|
4433
|
+
]
|
|
4434
|
+
}
|
|
4435
|
+
),
|
|
4436
|
+
!isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4437
|
+
"div",
|
|
4438
|
+
{
|
|
4439
|
+
style: {
|
|
4440
|
+
marginBottom: "16px"
|
|
4227
4441
|
},
|
|
4228
4442
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4229
|
-
|
|
4443
|
+
StatusCard,
|
|
4230
4444
|
{
|
|
4231
|
-
|
|
4232
|
-
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
backgroundColor: isSuccess ? "#dcfce7" : isError ? "#fee2e2" : "#f3f4f6",
|
|
4236
|
-
display: "flex",
|
|
4237
|
-
alignItems: "center",
|
|
4238
|
-
justifyContent: "center"
|
|
4239
|
-
},
|
|
4240
|
-
children: isProcessing ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4241
|
-
"div",
|
|
4242
|
-
{
|
|
4243
|
-
style: {
|
|
4244
|
-
width: "24px",
|
|
4245
|
-
height: "24px",
|
|
4246
|
-
border: "3px solid #e5e7eb",
|
|
4247
|
-
borderTopColor: theme.colors.primary,
|
|
4248
|
-
borderRadius: "50%",
|
|
4249
|
-
animation: "spin 1s linear infinite"
|
|
4250
|
-
}
|
|
4251
|
-
}
|
|
4252
|
-
) : isSuccess ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "28px", color: "#16a34a" }, children: "\u2713" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "28px", color: "#dc2626" }, children: "\u2717" })
|
|
4445
|
+
isSuccess,
|
|
4446
|
+
chainName: derivedChainName,
|
|
4447
|
+
explorerUrl: derivedExplorerUrl,
|
|
4448
|
+
txHash: stepWithTxHash?.transactionHash
|
|
4253
4449
|
}
|
|
4254
4450
|
)
|
|
4255
4451
|
}
|
|
4256
4452
|
),
|
|
4257
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4453
|
+
!isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4258
4454
|
"div",
|
|
4259
4455
|
{
|
|
4260
4456
|
style: {
|
|
4261
|
-
|
|
4262
|
-
|
|
4263
|
-
|
|
4264
|
-
|
|
4457
|
+
overflow: "hidden",
|
|
4458
|
+
maxHeight: isDetailsExpanded ? "300px" : "0px",
|
|
4459
|
+
opacity: isDetailsExpanded ? 1 : 0,
|
|
4460
|
+
transition: "max-height 0.3s ease, opacity 0.3s ease",
|
|
4461
|
+
marginBottom: isDetailsExpanded ? "16px" : "0"
|
|
4265
4462
|
},
|
|
4266
|
-
children:
|
|
4463
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4267
4464
|
"div",
|
|
4268
4465
|
{
|
|
4269
4466
|
style: {
|
|
4270
|
-
|
|
4271
|
-
|
|
4272
|
-
|
|
4273
|
-
border: `1px solid ${step.status === "success" ? "#bbf7d0" : step.status === "failed" ? "#fecaca" : "#e5e7eb"}`
|
|
4467
|
+
display: "flex",
|
|
4468
|
+
flexDirection: "column",
|
|
4469
|
+
gap: "8px"
|
|
4274
4470
|
},
|
|
4275
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4471
|
+
children: steps.map((step, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4276
4472
|
"div",
|
|
4277
4473
|
{
|
|
4278
4474
|
style: {
|
|
4475
|
+
padding: "10px 12px",
|
|
4476
|
+
borderRadius: "6px",
|
|
4477
|
+
backgroundColor: "#f9fafb",
|
|
4478
|
+
border: "1px solid #e5e7eb",
|
|
4279
4479
|
display: "flex",
|
|
4280
4480
|
justifyContent: "space-between",
|
|
4281
4481
|
alignItems: "center"
|
|
@@ -4285,9 +4485,8 @@ const DepositStatusPanel = ({
|
|
|
4285
4485
|
"span",
|
|
4286
4486
|
{
|
|
4287
4487
|
style: {
|
|
4288
|
-
|
|
4289
|
-
|
|
4290
|
-
color: "#111827"
|
|
4488
|
+
fontSize: "13px",
|
|
4489
|
+
color: "#374151"
|
|
4291
4490
|
},
|
|
4292
4491
|
children: step.description || `Step ${idx + 1}`
|
|
4293
4492
|
}
|
|
@@ -4297,17 +4496,18 @@ const DepositStatusPanel = ({
|
|
|
4297
4496
|
{
|
|
4298
4497
|
style: {
|
|
4299
4498
|
fontSize: "12px",
|
|
4300
|
-
color: step.status === "success" ? "#
|
|
4499
|
+
color: step.status === "success" ? "#10b981" : step.status === "failed" ? "#ef4444" : "#6b7280",
|
|
4500
|
+
fontWeight: 500
|
|
4301
4501
|
},
|
|
4302
|
-
children: step.status === "success" ? "\u2713
|
|
4502
|
+
children: step.status === "success" ? "\u2713" : step.status === "failed" ? "\u2717" : "\u25CB"
|
|
4303
4503
|
}
|
|
4304
4504
|
)
|
|
4305
4505
|
]
|
|
4306
|
-
}
|
|
4307
|
-
|
|
4308
|
-
|
|
4309
|
-
|
|
4310
|
-
)
|
|
4506
|
+
},
|
|
4507
|
+
idx
|
|
4508
|
+
))
|
|
4509
|
+
}
|
|
4510
|
+
)
|
|
4311
4511
|
}
|
|
4312
4512
|
),
|
|
4313
4513
|
!isProcessing && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
|
|
@@ -4327,7 +4527,11 @@ const DepositStatusPanel = ({
|
|
|
4327
4527
|
fontSize: "16px",
|
|
4328
4528
|
fontFamily: '"IBM Plex Mono", monospace',
|
|
4329
4529
|
textTransform: "uppercase",
|
|
4330
|
-
cursor: "pointer"
|
|
4530
|
+
cursor: "pointer",
|
|
4531
|
+
display: "flex",
|
|
4532
|
+
alignItems: "center",
|
|
4533
|
+
justifyContent: "center",
|
|
4534
|
+
gap: "8px"
|
|
4331
4535
|
},
|
|
4332
4536
|
children: "RETRY"
|
|
4333
4537
|
}
|
|
@@ -4341,16 +4545,20 @@ const DepositStatusPanel = ({
|
|
|
4341
4545
|
height: "48px",
|
|
4342
4546
|
padding: "14px 24px",
|
|
4343
4547
|
borderRadius: "6px",
|
|
4344
|
-
backgroundColor:
|
|
4548
|
+
backgroundColor: "#ea4b4b",
|
|
4345
4549
|
border: "1px solid #0e0d0b",
|
|
4346
4550
|
color: "#0e0d0b",
|
|
4347
4551
|
fontWeight: 500,
|
|
4348
4552
|
fontSize: "16px",
|
|
4349
4553
|
fontFamily: '"IBM Plex Mono", monospace',
|
|
4350
4554
|
textTransform: "uppercase",
|
|
4351
|
-
cursor: "pointer"
|
|
4555
|
+
cursor: "pointer",
|
|
4556
|
+
display: "flex",
|
|
4557
|
+
alignItems: "center",
|
|
4558
|
+
justifyContent: "center",
|
|
4559
|
+
gap: "8px"
|
|
4352
4560
|
},
|
|
4353
|
-
children:
|
|
4561
|
+
children: "CONTINUE \u2192"
|
|
4354
4562
|
}
|
|
4355
4563
|
)
|
|
4356
4564
|
] }),
|
|
@@ -4365,9 +4573,9 @@ const DepositStatusPanel = ({
|
|
|
4365
4573
|
);
|
|
4366
4574
|
}
|
|
4367
4575
|
if (!isOpen || !results || results.length === 0) return null;
|
|
4368
|
-
const
|
|
4369
|
-
const
|
|
4370
|
-
const
|
|
4576
|
+
const allSuccess = results.every((r) => r.success);
|
|
4577
|
+
const firstResult = results[0];
|
|
4578
|
+
const txHash = firstResult?.txHash;
|
|
4371
4579
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4372
4580
|
"div",
|
|
4373
4581
|
{
|
|
@@ -4392,7 +4600,7 @@ const DepositStatusPanel = ({
|
|
|
4392
4600
|
boxShadow: "0 -4px 20px rgba(0, 0, 0, 0.15)"
|
|
4393
4601
|
},
|
|
4394
4602
|
children: [
|
|
4395
|
-
/* @__PURE__ */ jsxRuntime.
|
|
4603
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4396
4604
|
"div",
|
|
4397
4605
|
{
|
|
4398
4606
|
style: {
|
|
@@ -4401,157 +4609,67 @@ const DepositStatusPanel = ({
|
|
|
4401
4609
|
justifyContent: "space-between",
|
|
4402
4610
|
marginBottom: "16px"
|
|
4403
4611
|
},
|
|
4404
|
-
children:
|
|
4405
|
-
|
|
4406
|
-
|
|
4407
|
-
{
|
|
4408
|
-
|
|
4409
|
-
|
|
4410
|
-
|
|
4411
|
-
|
|
4412
|
-
|
|
4413
|
-
|
|
4414
|
-
|
|
4415
|
-
|
|
4416
|
-
|
|
4417
|
-
"span",
|
|
4418
|
-
{
|
|
4419
|
-
style: {
|
|
4420
|
-
fontSize: "13px",
|
|
4421
|
-
fontWeight: 500,
|
|
4422
|
-
color: "#6b7280",
|
|
4423
|
-
fontFamily: styles?.fontFamily || theme.typography.fontFamily
|
|
4424
|
-
},
|
|
4425
|
-
children: "Deposit Results"
|
|
4426
|
-
}
|
|
4427
|
-
),
|
|
4428
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4429
|
-
"svg",
|
|
4430
|
-
{
|
|
4431
|
-
width: "16",
|
|
4432
|
-
height: "16",
|
|
4433
|
-
viewBox: "0 0 16 16",
|
|
4434
|
-
fill: "none",
|
|
4435
|
-
style: {
|
|
4436
|
-
transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
|
|
4437
|
-
transition: "transform 0.3s ease"
|
|
4438
|
-
},
|
|
4439
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4440
|
-
"path",
|
|
4441
|
-
{
|
|
4442
|
-
d: "M4 6L8 10L12 6",
|
|
4443
|
-
stroke: "#6b7280",
|
|
4444
|
-
strokeWidth: "2",
|
|
4445
|
-
strokeLinecap: "round",
|
|
4446
|
-
strokeLinejoin: "round"
|
|
4447
|
-
}
|
|
4448
|
-
)
|
|
4449
|
-
}
|
|
4450
|
-
)
|
|
4451
|
-
]
|
|
4452
|
-
}
|
|
4453
|
-
),
|
|
4454
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4455
|
-
"button",
|
|
4456
|
-
{
|
|
4457
|
-
onClick: handleClose,
|
|
4458
|
-
style: {
|
|
4459
|
-
background: "none",
|
|
4460
|
-
border: "none",
|
|
4461
|
-
cursor: "pointer",
|
|
4462
|
-
padding: "4px",
|
|
4463
|
-
display: "flex",
|
|
4464
|
-
alignItems: "center",
|
|
4465
|
-
justifyContent: "center",
|
|
4466
|
-
color: "#6b7280",
|
|
4467
|
-
transition: "color 0.2s ease"
|
|
4468
|
-
},
|
|
4469
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4470
|
-
"path",
|
|
4612
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4613
|
+
"div",
|
|
4614
|
+
{
|
|
4615
|
+
style: {
|
|
4616
|
+
display: "flex",
|
|
4617
|
+
alignItems: "center",
|
|
4618
|
+
gap: "8px",
|
|
4619
|
+
cursor: "pointer"
|
|
4620
|
+
},
|
|
4621
|
+
onClick: toggleDetails,
|
|
4622
|
+
children: [
|
|
4623
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4624
|
+
"span",
|
|
4471
4625
|
{
|
|
4472
|
-
|
|
4473
|
-
|
|
4474
|
-
|
|
4475
|
-
|
|
4476
|
-
|
|
4626
|
+
style: {
|
|
4627
|
+
fontSize: "13px",
|
|
4628
|
+
fontWeight: 500,
|
|
4629
|
+
color: "#6b7280",
|
|
4630
|
+
fontFamily: styles?.fontFamily || theme.typography.fontFamily
|
|
4631
|
+
},
|
|
4632
|
+
children: "Deposit Results"
|
|
4477
4633
|
}
|
|
4478
|
-
)
|
|
4479
|
-
|
|
4480
|
-
|
|
4481
|
-
]
|
|
4482
|
-
}
|
|
4483
|
-
),
|
|
4484
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4485
|
-
"div",
|
|
4486
|
-
{
|
|
4487
|
-
style: {
|
|
4488
|
-
display: "flex",
|
|
4489
|
-
alignItems: "center",
|
|
4490
|
-
justifyContent: "center",
|
|
4491
|
-
gap: "12px",
|
|
4492
|
-
marginBottom: "16px",
|
|
4493
|
-
padding: "12px",
|
|
4494
|
-
backgroundColor: allSuccess ? "#f0fdf4" : "#fefce8",
|
|
4495
|
-
borderRadius: "8px",
|
|
4496
|
-
border: `1px solid ${allSuccess ? "#bbf7d0" : "#fef08a"}`
|
|
4497
|
-
},
|
|
4498
|
-
children: [
|
|
4499
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4500
|
-
"div",
|
|
4501
|
-
{
|
|
4502
|
-
style: {
|
|
4503
|
-
width: "32px",
|
|
4504
|
-
height: "32px",
|
|
4505
|
-
borderRadius: "50%",
|
|
4506
|
-
backgroundColor: allSuccess ? "#dcfce7" : "#fef3c7",
|
|
4507
|
-
display: "flex",
|
|
4508
|
-
alignItems: "center",
|
|
4509
|
-
justifyContent: "center"
|
|
4510
|
-
},
|
|
4511
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4512
|
-
"span",
|
|
4634
|
+
),
|
|
4635
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4636
|
+
"svg",
|
|
4513
4637
|
{
|
|
4638
|
+
width: "16",
|
|
4639
|
+
height: "16",
|
|
4640
|
+
viewBox: "0 0 16 16",
|
|
4641
|
+
fill: "none",
|
|
4514
4642
|
style: {
|
|
4515
|
-
|
|
4516
|
-
|
|
4643
|
+
transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
|
|
4644
|
+
transition: "transform 0.3s ease"
|
|
4517
4645
|
},
|
|
4518
|
-
children:
|
|
4646
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4647
|
+
"path",
|
|
4648
|
+
{
|
|
4649
|
+
d: "M4 6L8 10L12 6",
|
|
4650
|
+
stroke: "#6b7280",
|
|
4651
|
+
strokeWidth: "2",
|
|
4652
|
+
strokeLinecap: "round",
|
|
4653
|
+
strokeLinejoin: "round"
|
|
4654
|
+
}
|
|
4655
|
+
)
|
|
4519
4656
|
}
|
|
4520
4657
|
)
|
|
4521
|
-
|
|
4522
|
-
|
|
4523
|
-
|
|
4524
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4525
|
-
"p",
|
|
4526
|
-
{
|
|
4527
|
-
style: {
|
|
4528
|
-
fontWeight: 600,
|
|
4529
|
-
fontSize: "14px",
|
|
4530
|
-
color: allSuccess ? "#166534" : "#854d0e",
|
|
4531
|
-
margin: 0
|
|
4532
|
-
},
|
|
4533
|
-
children: allSuccess ? "All Deposits Complete!" : `${successCount} of ${results.length} Deposits Complete`
|
|
4534
|
-
}
|
|
4535
|
-
),
|
|
4536
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4537
|
-
"p",
|
|
4538
|
-
{
|
|
4539
|
-
style: {
|
|
4540
|
-
fontSize: "12px",
|
|
4541
|
-
color: "#6b7280",
|
|
4542
|
-
margin: "2px 0 0 0"
|
|
4543
|
-
},
|
|
4544
|
-
children: [
|
|
4545
|
-
"on ",
|
|
4546
|
-
chainName
|
|
4547
|
-
]
|
|
4548
|
-
}
|
|
4549
|
-
)
|
|
4550
|
-
] })
|
|
4551
|
-
]
|
|
4658
|
+
]
|
|
4659
|
+
}
|
|
4660
|
+
)
|
|
4552
4661
|
}
|
|
4553
4662
|
),
|
|
4554
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4663
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginBottom: "16px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4664
|
+
StatusCard,
|
|
4665
|
+
{
|
|
4666
|
+
isSuccess: allSuccess,
|
|
4667
|
+
chainName,
|
|
4668
|
+
explorerUrl,
|
|
4669
|
+
txHash
|
|
4670
|
+
}
|
|
4671
|
+
) }),
|
|
4672
|
+
results.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4555
4673
|
"div",
|
|
4556
4674
|
{
|
|
4557
4675
|
style: {
|
|
@@ -4575,10 +4693,13 @@ const DepositStatusPanel = ({
|
|
|
4575
4693
|
"div",
|
|
4576
4694
|
{
|
|
4577
4695
|
style: {
|
|
4578
|
-
padding: "12px",
|
|
4579
|
-
borderRadius: "
|
|
4580
|
-
|
|
4581
|
-
|
|
4696
|
+
padding: "10px 12px",
|
|
4697
|
+
borderRadius: "6px",
|
|
4698
|
+
backgroundColor: "#f9fafb",
|
|
4699
|
+
border: "1px solid #e5e7eb",
|
|
4700
|
+
display: "flex",
|
|
4701
|
+
justifyContent: "space-between",
|
|
4702
|
+
alignItems: "center"
|
|
4582
4703
|
},
|
|
4583
4704
|
children: [
|
|
4584
4705
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -4586,76 +4707,35 @@ const DepositStatusPanel = ({
|
|
|
4586
4707
|
{
|
|
4587
4708
|
style: {
|
|
4588
4709
|
display: "flex",
|
|
4589
|
-
|
|
4590
|
-
|
|
4710
|
+
alignItems: "center",
|
|
4711
|
+
gap: "8px"
|
|
4591
4712
|
},
|
|
4592
4713
|
children: [
|
|
4593
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4594
|
-
"div",
|
|
4595
|
-
{
|
|
4596
|
-
style: {
|
|
4597
|
-
display: "flex",
|
|
4598
|
-
alignItems: "center",
|
|
4599
|
-
gap: "8px"
|
|
4600
|
-
},
|
|
4601
|
-
children: [
|
|
4602
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4603
|
-
"span",
|
|
4604
|
-
{
|
|
4605
|
-
style: {
|
|
4606
|
-
fontWeight: 600,
|
|
4607
|
-
fontSize: "14px",
|
|
4608
|
-
color: "#111827",
|
|
4609
|
-
fontFamily: '"IBM Plex Mono", monospace'
|
|
4610
|
-
},
|
|
4611
|
-
children: result.asset.symbol
|
|
4612
|
-
}
|
|
4613
|
-
),
|
|
4614
|
-
result.amount && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "12px", color: "#6b7280" }, children: result.amount })
|
|
4615
|
-
]
|
|
4616
|
-
}
|
|
4617
|
-
),
|
|
4618
4714
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4619
4715
|
"span",
|
|
4620
4716
|
{
|
|
4621
4717
|
style: {
|
|
4622
|
-
|
|
4718
|
+
fontWeight: 600,
|
|
4623
4719
|
fontSize: "13px",
|
|
4624
|
-
|
|
4720
|
+
color: "#111827",
|
|
4721
|
+
fontFamily: '"IBM Plex Mono", monospace'
|
|
4625
4722
|
},
|
|
4626
|
-
children: result.
|
|
4723
|
+
children: result.asset.symbol
|
|
4627
4724
|
}
|
|
4628
|
-
)
|
|
4725
|
+
),
|
|
4726
|
+
result.amount && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "12px", color: "#6b7280" }, children: result.amount })
|
|
4629
4727
|
]
|
|
4630
4728
|
}
|
|
4631
4729
|
),
|
|
4632
|
-
|
|
4633
|
-
"
|
|
4634
|
-
{
|
|
4635
|
-
href: `${explorerUrl}/tx/${result.txHash}`,
|
|
4636
|
-
target: "_blank",
|
|
4637
|
-
rel: "noopener noreferrer",
|
|
4638
|
-
style: {
|
|
4639
|
-
fontSize: "12px",
|
|
4640
|
-
color: theme.colors.primary,
|
|
4641
|
-
textDecoration: "none",
|
|
4642
|
-
display: "block",
|
|
4643
|
-
marginTop: "4px"
|
|
4644
|
-
},
|
|
4645
|
-
children: "View on Explorer \u2192"
|
|
4646
|
-
}
|
|
4647
|
-
),
|
|
4648
|
-
result.error && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4649
|
-
"p",
|
|
4730
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4731
|
+
"span",
|
|
4650
4732
|
{
|
|
4651
4733
|
style: {
|
|
4652
4734
|
fontSize: "12px",
|
|
4653
|
-
color: "#
|
|
4654
|
-
|
|
4655
|
-
wordWrap: "break-word",
|
|
4656
|
-
overflowWrap: "break-word"
|
|
4735
|
+
color: result.success ? "#10b981" : "#ef4444",
|
|
4736
|
+
fontWeight: 500
|
|
4657
4737
|
},
|
|
4658
|
-
children: result.
|
|
4738
|
+
children: result.success ? "\u2713" : "\u2717"
|
|
4659
4739
|
}
|
|
4660
4740
|
)
|
|
4661
4741
|
]
|
|
@@ -5758,7 +5838,7 @@ const CrossChainDepositModal = ({
|
|
|
5758
5838
|
data
|
|
5759
5839
|
});
|
|
5760
5840
|
}
|
|
5761
|
-
const client =
|
|
5841
|
+
const client = getClientForChain(chainId);
|
|
5762
5842
|
const receipt = await client.waitForTransactionReceipt({
|
|
5763
5843
|
hash,
|
|
5764
5844
|
timeout: 12e4,
|
|
@@ -11748,7 +11828,7 @@ const SpiceWithdraw = (props) => {
|
|
|
11748
11828
|
}
|
|
11749
11829
|
});
|
|
11750
11830
|
if (chains.length === 0) {
|
|
11751
|
-
chains.push(chains$
|
|
11831
|
+
chains.push(chains$1.sepolia, chains$1.arbitrumSepolia);
|
|
11752
11832
|
}
|
|
11753
11833
|
const transports = {};
|
|
11754
11834
|
chains.forEach((chain) => {
|