@spicenet-io/spiceflow-ui 1.9.11 → 1.9.13

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.
Files changed (3) hide show
  1. package/dist/index.cjs.js +14 -59
  2. package/dist/index.js +14 -59
  3. package/package.json +1 -1
package/dist/index.cjs.js CHANGED
@@ -4285,7 +4285,6 @@ const DepositStatusPanel = ({
4285
4285
  };
4286
4286
  if (intentStatus) {
4287
4287
  const { steps, overallStatus } = intentStatus;
4288
- const isProcessing = overallStatus === "processing";
4289
4288
  const isSuccess = overallStatus === "success";
4290
4289
  const isError = overallStatus === "failed";
4291
4290
  const stepWithTxHash = steps.find((step) => step.transactionHash);
@@ -4322,9 +4321,9 @@ const DepositStatusPanel = ({
4322
4321
  display: "flex",
4323
4322
  alignItems: "center",
4324
4323
  gap: "8px",
4325
- cursor: !isProcessing ? "pointer" : "default"
4324
+ cursor: "pointer"
4326
4325
  },
4327
- onClick: !isProcessing ? toggleDetails : void 0,
4326
+ onClick: toggleDetails,
4328
4327
  children: [
4329
4328
  /* @__PURE__ */ jsxRuntime.jsx(
4330
4329
  "span",
@@ -4338,7 +4337,7 @@ const DepositStatusPanel = ({
4338
4337
  children: "Deposit Results"
4339
4338
  }
4340
4339
  ),
4341
- !isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
4340
+ /* @__PURE__ */ jsxRuntime.jsx(
4342
4341
  "svg",
4343
4342
  {
4344
4343
  width: "16",
@@ -4364,7 +4363,7 @@ const DepositStatusPanel = ({
4364
4363
  ]
4365
4364
  }
4366
4365
  ),
4367
- !isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
4366
+ /* @__PURE__ */ jsxRuntime.jsx(
4368
4367
  "button",
4369
4368
  {
4370
4369
  onClick: onClose,
@@ -4393,47 +4392,7 @@ const DepositStatusPanel = ({
4393
4392
  ]
4394
4393
  }
4395
4394
  ),
4396
- isProcessing && /* @__PURE__ */ jsxRuntime.jsxs(
4397
- "div",
4398
- {
4399
- style: {
4400
- display: "flex",
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(
4395
+ /* @__PURE__ */ jsxRuntime.jsx(
4437
4396
  "div",
4438
4397
  {
4439
4398
  style: {
@@ -4450,7 +4409,7 @@ const DepositStatusPanel = ({
4450
4409
  )
4451
4410
  }
4452
4411
  ),
4453
- !isProcessing && /* @__PURE__ */ jsxRuntime.jsx(
4412
+ /* @__PURE__ */ jsxRuntime.jsx(
4454
4413
  "div",
4455
4414
  {
4456
4415
  style: {
@@ -4510,7 +4469,7 @@ const DepositStatusPanel = ({
4510
4469
  )
4511
4470
  }
4512
4471
  ),
4513
- !isProcessing && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
4472
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
4514
4473
  isError && onRetry && /* @__PURE__ */ jsxRuntime.jsx(
4515
4474
  "button",
4516
4475
  {
@@ -4561,13 +4520,7 @@ const DepositStatusPanel = ({
4561
4520
  children: "CONTINUE \u2192"
4562
4521
  }
4563
4522
  )
4564
- ] }),
4565
- /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
4566
- @keyframes spin {
4567
- from { transform: rotate(0deg); }
4568
- to { transform: rotate(360deg); }
4569
- }
4570
- ` })
4523
+ ] })
4571
4524
  ]
4572
4525
  }
4573
4526
  );
@@ -4989,7 +4942,8 @@ const DepositWidget = ({
4989
4942
  }
4990
4943
  return spiceAssets;
4991
4944
  }, [spiceAssets, supportedTokens]);
4992
- const canDeposit = selectedDepositAsset && selectedDepositAsset.amount && parseFloat(selectedDepositAsset.amount) > 0 && parseFloat(selectedDepositAsset.amount) <= selectedDepositAsset.asset.balanceFormatted && isConnected && !isExecuting && depositBatches.length > 0;
4945
+ const isProcessingIntent = intentStatus?.overallStatus === "processing";
4946
+ const canDeposit = selectedDepositAsset && selectedDepositAsset.amount && parseFloat(selectedDepositAsset.amount) > 0 && parseFloat(selectedDepositAsset.amount) <= selectedDepositAsset.asset.balanceFormatted && isConnected && !isExecuting && !isProcessingIntent && depositBatches.length > 0;
4993
4947
  const displayError = spiceAssetsError || error;
4994
4948
  const containerStyles = {
4995
4949
  backgroundColor: styles?.container?.backgroundColor || styles?.primaryBackground || theme.colors.background,
@@ -5003,7 +4957,8 @@ const DepositWidget = ({
5003
4957
  fontFamily: theme.typography.fontFamily,
5004
4958
  boxShadow: styles?.container?.boxShadow || (theme.mode === "light" ? "0 4px 6px -1px rgb(0 0 0 / 0.1)" : "0 4px 6px -1px rgb(0 0 0 / 0.3)")
5005
4959
  };
5006
- if (intentStatus) {
4960
+ const showStatusPanel = intentStatus && intentStatus.overallStatus !== "processing";
4961
+ if (showStatusPanel) {
5007
4962
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(
5008
4963
  DepositStatusPanel,
5009
4964
  {
@@ -5119,11 +5074,11 @@ const DepositWidget = ({
5119
5074
  variant: "outline",
5120
5075
  fullWidth: true,
5121
5076
  onClick: handleDeposit,
5122
- loading: isExecuting,
5077
+ loading: isExecuting || isProcessingIntent,
5123
5078
  disabled: !canDeposit || !isConnected,
5124
5079
  theme,
5125
5080
  styles,
5126
- children: !ready ? "Loading..." : !authenticated ? "Authentication Required" : !isConnected ? "Wallet Not Connected" : isExecuting ? "Executing Deposit..." : !selectedDepositAsset ? "Select Token" : !selectedDepositAsset.amount ? "Enter Amount" : parseFloat(selectedDepositAsset.amount) > selectedDepositAsset.asset.balanceFormatted ? "Insufficient Balance" : depositBatches.length === 0 ? "No Deposit Batches" : "Execute Deposit"
5081
+ children: !ready ? "Loading..." : !authenticated ? "Authentication Required" : !isConnected ? "Wallet Not Connected" : isExecuting ? "Executing Deposit..." : isProcessingIntent ? "Processing..." : !selectedDepositAsset ? "Select Token" : !selectedDepositAsset.amount ? "Enter Amount" : parseFloat(selectedDepositAsset.amount) > selectedDepositAsset.asset.balanceFormatted ? "Insufficient Balance" : depositBatches.length === 0 ? "No Deposit Batches" : "Execute Deposit"
5127
5082
  }
5128
5083
  )
5129
5084
  }
package/dist/index.js CHANGED
@@ -4283,7 +4283,6 @@ const DepositStatusPanel = ({
4283
4283
  };
4284
4284
  if (intentStatus) {
4285
4285
  const { steps, overallStatus } = intentStatus;
4286
- const isProcessing = overallStatus === "processing";
4287
4286
  const isSuccess = overallStatus === "success";
4288
4287
  const isError = overallStatus === "failed";
4289
4288
  const stepWithTxHash = steps.find((step) => step.transactionHash);
@@ -4320,9 +4319,9 @@ const DepositStatusPanel = ({
4320
4319
  display: "flex",
4321
4320
  alignItems: "center",
4322
4321
  gap: "8px",
4323
- cursor: !isProcessing ? "pointer" : "default"
4322
+ cursor: "pointer"
4324
4323
  },
4325
- onClick: !isProcessing ? toggleDetails : void 0,
4324
+ onClick: toggleDetails,
4326
4325
  children: [
4327
4326
  /* @__PURE__ */ jsx(
4328
4327
  "span",
@@ -4336,7 +4335,7 @@ const DepositStatusPanel = ({
4336
4335
  children: "Deposit Results"
4337
4336
  }
4338
4337
  ),
4339
- !isProcessing && /* @__PURE__ */ jsx(
4338
+ /* @__PURE__ */ jsx(
4340
4339
  "svg",
4341
4340
  {
4342
4341
  width: "16",
@@ -4362,7 +4361,7 @@ const DepositStatusPanel = ({
4362
4361
  ]
4363
4362
  }
4364
4363
  ),
4365
- !isProcessing && /* @__PURE__ */ jsx(
4364
+ /* @__PURE__ */ jsx(
4366
4365
  "button",
4367
4366
  {
4368
4367
  onClick: onClose,
@@ -4391,47 +4390,7 @@ const DepositStatusPanel = ({
4391
4390
  ]
4392
4391
  }
4393
4392
  ),
4394
- isProcessing && /* @__PURE__ */ jsxs(
4395
- "div",
4396
- {
4397
- style: {
4398
- display: "flex",
4399
- flexDirection: "column",
4400
- alignItems: "center",
4401
- padding: "24px",
4402
- marginBottom: "16px"
4403
- },
4404
- children: [
4405
- /* @__PURE__ */ jsx(
4406
- "div",
4407
- {
4408
- style: {
4409
- width: "48px",
4410
- height: "48px",
4411
- border: "3px solid #e5e7eb",
4412
- borderTopColor: theme.colors.primary,
4413
- borderRadius: "50%",
4414
- animation: "spin 1s linear infinite",
4415
- marginBottom: "16px"
4416
- }
4417
- }
4418
- ),
4419
- /* @__PURE__ */ jsx(
4420
- "p",
4421
- {
4422
- style: {
4423
- fontSize: "14px",
4424
- fontWeight: 500,
4425
- color: "#374151",
4426
- margin: 0
4427
- },
4428
- children: "Processing your deposit..."
4429
- }
4430
- )
4431
- ]
4432
- }
4433
- ),
4434
- !isProcessing && /* @__PURE__ */ jsx(
4393
+ /* @__PURE__ */ jsx(
4435
4394
  "div",
4436
4395
  {
4437
4396
  style: {
@@ -4448,7 +4407,7 @@ const DepositStatusPanel = ({
4448
4407
  )
4449
4408
  }
4450
4409
  ),
4451
- !isProcessing && /* @__PURE__ */ jsx(
4410
+ /* @__PURE__ */ jsx(
4452
4411
  "div",
4453
4412
  {
4454
4413
  style: {
@@ -4508,7 +4467,7 @@ const DepositStatusPanel = ({
4508
4467
  )
4509
4468
  }
4510
4469
  ),
4511
- !isProcessing && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
4470
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
4512
4471
  isError && onRetry && /* @__PURE__ */ jsx(
4513
4472
  "button",
4514
4473
  {
@@ -4559,13 +4518,7 @@ const DepositStatusPanel = ({
4559
4518
  children: "CONTINUE \u2192"
4560
4519
  }
4561
4520
  )
4562
- ] }),
4563
- /* @__PURE__ */ jsx("style", { children: `
4564
- @keyframes spin {
4565
- from { transform: rotate(0deg); }
4566
- to { transform: rotate(360deg); }
4567
- }
4568
- ` })
4521
+ ] })
4569
4522
  ]
4570
4523
  }
4571
4524
  );
@@ -4987,7 +4940,8 @@ const DepositWidget = ({
4987
4940
  }
4988
4941
  return spiceAssets;
4989
4942
  }, [spiceAssets, supportedTokens]);
4990
- const canDeposit = selectedDepositAsset && selectedDepositAsset.amount && parseFloat(selectedDepositAsset.amount) > 0 && parseFloat(selectedDepositAsset.amount) <= selectedDepositAsset.asset.balanceFormatted && isConnected && !isExecuting && depositBatches.length > 0;
4943
+ const isProcessingIntent = intentStatus?.overallStatus === "processing";
4944
+ const canDeposit = selectedDepositAsset && selectedDepositAsset.amount && parseFloat(selectedDepositAsset.amount) > 0 && parseFloat(selectedDepositAsset.amount) <= selectedDepositAsset.asset.balanceFormatted && isConnected && !isExecuting && !isProcessingIntent && depositBatches.length > 0;
4991
4945
  const displayError = spiceAssetsError || error;
4992
4946
  const containerStyles = {
4993
4947
  backgroundColor: styles?.container?.backgroundColor || styles?.primaryBackground || theme.colors.background,
@@ -5001,7 +4955,8 @@ const DepositWidget = ({
5001
4955
  fontFamily: theme.typography.fontFamily,
5002
4956
  boxShadow: styles?.container?.boxShadow || (theme.mode === "light" ? "0 4px 6px -1px rgb(0 0 0 / 0.1)" : "0 4px 6px -1px rgb(0 0 0 / 0.3)")
5003
4957
  };
5004
- if (intentStatus) {
4958
+ const showStatusPanel = intentStatus && intentStatus.overallStatus !== "processing";
4959
+ if (showStatusPanel) {
5005
4960
  return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(
5006
4961
  DepositStatusPanel,
5007
4962
  {
@@ -5117,11 +5072,11 @@ const DepositWidget = ({
5117
5072
  variant: "outline",
5118
5073
  fullWidth: true,
5119
5074
  onClick: handleDeposit,
5120
- loading: isExecuting,
5075
+ loading: isExecuting || isProcessingIntent,
5121
5076
  disabled: !canDeposit || !isConnected,
5122
5077
  theme,
5123
5078
  styles,
5124
- children: !ready ? "Loading..." : !authenticated ? "Authentication Required" : !isConnected ? "Wallet Not Connected" : isExecuting ? "Executing Deposit..." : !selectedDepositAsset ? "Select Token" : !selectedDepositAsset.amount ? "Enter Amount" : parseFloat(selectedDepositAsset.amount) > selectedDepositAsset.asset.balanceFormatted ? "Insufficient Balance" : depositBatches.length === 0 ? "No Deposit Batches" : "Execute Deposit"
5079
+ children: !ready ? "Loading..." : !authenticated ? "Authentication Required" : !isConnected ? "Wallet Not Connected" : isExecuting ? "Executing Deposit..." : isProcessingIntent ? "Processing..." : !selectedDepositAsset ? "Select Token" : !selectedDepositAsset.amount ? "Enter Amount" : parseFloat(selectedDepositAsset.amount) > selectedDepositAsset.asset.balanceFormatted ? "Insufficient Balance" : depositBatches.length === 0 ? "No Deposit Batches" : "Execute Deposit"
5125
5080
  }
5126
5081
  )
5127
5082
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spicenet-io/spiceflow-ui",
3
- "version": "1.9.11",
3
+ "version": "1.9.13",
4
4
  "description": "Spiceflow UI SDK",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs.js",