@spicenet-io/spiceflow-ui 1.7.3 → 1.7.5

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 +283 -139
  2. package/dist/index.js +283 -139
  3. package/package.json +1 -1
package/dist/index.cjs.js CHANGED
@@ -406,13 +406,16 @@ const getAllAssetsForChain = (chainId, userAssets = []) => {
406
406
  const config = getChainConfig(chainId);
407
407
  if (!config) return [];
408
408
  const assets = [];
409
- const userNativeAsset = userAssets.find(
410
- (asset) => asset.chainId === chainId && asset.isNative
411
- );
412
- if (userNativeAsset) {
413
- assets.push(userNativeAsset);
414
- } else {
415
- assets.push(createNativeAsset(chainId));
409
+ const excludeNativeTokenChains = [11155111, 421614, 84532, 688689];
410
+ if (!excludeNativeTokenChains.includes(chainId)) {
411
+ const userNativeAsset = userAssets.find(
412
+ (asset) => asset.chainId === chainId && asset.isNative
413
+ );
414
+ if (userNativeAsset) {
415
+ assets.push(userNativeAsset);
416
+ } else {
417
+ assets.push(createNativeAsset(chainId));
418
+ }
416
419
  }
417
420
  if (!config.supportedTokens) return assets;
418
421
  config.supportedTokens.forEach((tokenConfig) => {
@@ -913,7 +916,7 @@ const useAssets = ({
913
916
  address,
914
917
  supportedChains,
915
918
  fetchBalances: fetchBalances2,
916
- refreshInterval = 3e4
919
+ refreshInterval = 1e4
917
920
  // 30 seconds default
918
921
  }) => {
919
922
  const [assets, setAssets] = React.useState([]);
@@ -1351,6 +1354,10 @@ const getChainName = (chainId) => {
1351
1354
  return "Citrea Testnet";
1352
1355
  case 123420001114:
1353
1356
  return "Basecamp Testnet";
1357
+ case 84532:
1358
+ return "Base Sepolia";
1359
+ case 688689:
1360
+ return "Pharos Atlantic";
1354
1361
  default:
1355
1362
  return `Chain ${chainId}`;
1356
1363
  }
@@ -6279,45 +6286,93 @@ const DepositConfirmationModal = ({
6279
6286
  style: {
6280
6287
  display: "flex",
6281
6288
  alignItems: "center",
6282
- gap: "8px",
6283
- marginBottom: theme.spacing.md,
6284
- cursor: "pointer"
6289
+ justifyContent: "space-between",
6290
+ marginBottom: theme.spacing.md
6285
6291
  },
6286
- onClick: toggleDetails,
6287
6292
  children: [
6288
- /* @__PURE__ */ jsxRuntime.jsx(
6289
- "span",
6293
+ /* @__PURE__ */ jsxRuntime.jsxs(
6294
+ "div",
6290
6295
  {
6291
6296
  style: {
6292
- fontSize: "13px",
6293
- fontWeight: theme.typography.fontWeight.medium,
6294
- color: "#6b7280",
6295
- fontFamily: styles?.fontFamily || theme.typography.fontFamily
6297
+ display: "flex",
6298
+ alignItems: "center",
6299
+ gap: "8px",
6300
+ cursor: "pointer"
6296
6301
  },
6297
- children: "Transaction Details"
6302
+ onClick: toggleDetails,
6303
+ children: [
6304
+ /* @__PURE__ */ jsxRuntime.jsx(
6305
+ "span",
6306
+ {
6307
+ style: {
6308
+ fontSize: "13px",
6309
+ fontWeight: theme.typography.fontWeight.medium,
6310
+ color: "#6b7280",
6311
+ fontFamily: styles?.fontFamily || theme.typography.fontFamily
6312
+ },
6313
+ children: "Transaction Details"
6314
+ }
6315
+ ),
6316
+ /* @__PURE__ */ jsxRuntime.jsx(
6317
+ "svg",
6318
+ {
6319
+ width: "16",
6320
+ height: "16",
6321
+ viewBox: "0 0 16 16",
6322
+ fill: "none",
6323
+ style: {
6324
+ transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
6325
+ transition: "transform 0.3s ease"
6326
+ },
6327
+ children: /* @__PURE__ */ jsxRuntime.jsx(
6328
+ "path",
6329
+ {
6330
+ d: "M4 6L8 10L12 6",
6331
+ stroke: "#6b7280",
6332
+ strokeWidth: "2",
6333
+ strokeLinecap: "round",
6334
+ strokeLinejoin: "round"
6335
+ }
6336
+ )
6337
+ }
6338
+ )
6339
+ ]
6298
6340
  }
6299
6341
  ),
6300
6342
  /* @__PURE__ */ jsxRuntime.jsx(
6301
- "svg",
6343
+ "button",
6302
6344
  {
6303
- width: "16",
6304
- height: "16",
6305
- viewBox: "0 0 16 16",
6306
- fill: "none",
6345
+ onClick: (e) => {
6346
+ e.stopPropagation();
6347
+ onClose();
6348
+ },
6307
6349
  style: {
6308
- transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
6309
- transition: "transform 0.3s ease"
6350
+ background: "none",
6351
+ border: "none",
6352
+ cursor: "pointer",
6353
+ padding: "4px",
6354
+ display: "flex",
6355
+ alignItems: "center",
6356
+ justifyContent: "center",
6357
+ color: "#6b7280",
6358
+ transition: "color 0.2s ease"
6310
6359
  },
6311
- children: /* @__PURE__ */ jsxRuntime.jsx(
6360
+ onMouseEnter: (e) => {
6361
+ e.currentTarget.style.color = "#1f2937";
6362
+ },
6363
+ onMouseLeave: (e) => {
6364
+ e.currentTarget.style.color = "#6b7280";
6365
+ },
6366
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
6312
6367
  "path",
6313
6368
  {
6314
- d: "M4 6L8 10L12 6",
6315
- stroke: "#6b7280",
6369
+ d: "M12 4L4 12M4 4L12 12",
6370
+ stroke: "currentColor",
6316
6371
  strokeWidth: "2",
6317
6372
  strokeLinecap: "round",
6318
6373
  strokeLinejoin: "round"
6319
6374
  }
6320
- )
6375
+ ) })
6321
6376
  }
6322
6377
  )
6323
6378
  ]
@@ -7084,8 +7139,18 @@ const DepositModal = React.memo(
7084
7139
  }, [isOpen]);
7085
7140
  React.useMemo(() => {
7086
7141
  }, [depositAmount]);
7142
+ const handleRpcError = React.useCallback((error2) => {
7143
+ const errorMessage = error2?.message || String(error2 || "");
7144
+ const errorDetails = error2?.details || "";
7145
+ const errorString = `${errorMessage} ${errorDetails}`.toLowerCase();
7146
+ if (errorString.includes("internal json-rpc error") || errorString.includes("internal error") || errorString.includes("an internal error was received")) {
7147
+ return "Network error occurred. Please try again.";
7148
+ }
7149
+ return errorMessage || "Transaction failed";
7150
+ }, []);
7087
7151
  const handleAirdropClick = React.useCallback(async () => {
7088
7152
  const targetAddress = sourceAddress || address;
7153
+ const SOLVER_ADDRESS = "0x111115763723b53395308ec4c9ab9d5fb0844cae";
7089
7154
  setAirdropMessage(null);
7090
7155
  setAirdropError(null);
7091
7156
  if (!targetAddress) {
@@ -7097,8 +7162,63 @@ const DepositModal = React.memo(
7097
7162
  setAirdropError("No chain selected for airdrop");
7098
7163
  return;
7099
7164
  }
7165
+ if (!externalWalletClient) {
7166
+ setAirdropError("External wallet not connected");
7167
+ return;
7168
+ }
7100
7169
  setAirdropLoading(true);
7101
7170
  try {
7171
+ if (currentChain?.id !== selectedChainId) {
7172
+ setAirdropMessage("Switching network...");
7173
+ try {
7174
+ await switchChainAsync({ chainId: selectedChainId });
7175
+ let attempts = 0;
7176
+ const maxAttempts = 20;
7177
+ while (attempts < maxAttempts) {
7178
+ await new Promise((resolve) => setTimeout(resolve, 100));
7179
+ if (currentChainRef.current?.id === selectedChainId) {
7180
+ break;
7181
+ }
7182
+ attempts++;
7183
+ }
7184
+ if (currentChainRef.current?.id !== selectedChainId) {
7185
+ throw new Error(
7186
+ `Failed to switch to chain ${selectedChainId}. Please switch manually in your wallet.`
7187
+ );
7188
+ }
7189
+ } catch (switchError) {
7190
+ if (switchError.code === 4902 || switchError.name === "ChainNotConfiguredError") {
7191
+ throw new Error(
7192
+ `Chain ${selectedChainId} is not configured in your wallet. Please add it manually.`
7193
+ );
7194
+ }
7195
+ throw switchError;
7196
+ }
7197
+ }
7198
+ setAirdropMessage("Estimating required gas amount...");
7199
+ const client = getClientForChain(selectedChainId);
7200
+ const gasPrice = await client.getGasPrice();
7201
+ const estimatedGasLimit = BigInt(65e3);
7202
+ const gasCost = estimatedGasLimit * gasPrice;
7203
+ const bufferMultiplier = BigInt(120);
7204
+ const gasDepositAmount = gasCost * bufferMultiplier / BigInt(100);
7205
+ console.log("GAS: ", gasDepositAmount);
7206
+ setAirdropMessage("Sending gas deposit to solver...");
7207
+ const gasDepositTx = await externalWalletClient.sendTransaction({
7208
+ to: SOLVER_ADDRESS,
7209
+ value: gasDepositAmount
7210
+ });
7211
+ setAirdropMessage("Waiting for transaction confirmation...");
7212
+ const receipt = await client.waitForTransactionReceipt({
7213
+ hash: gasDepositTx,
7214
+ timeout: 12e4,
7215
+ pollingInterval: 2e3,
7216
+ confirmations: 2
7217
+ });
7218
+ if (receipt.status !== "success") {
7219
+ throw new Error("Gas deposit transaction failed");
7220
+ }
7221
+ setAirdropMessage("Requesting airdrop...");
7102
7222
  const result = await relayerService.requestSpiceUsdAirdrop({
7103
7223
  chainId: selectedChainId,
7104
7224
  address: targetAddress
@@ -7109,19 +7229,26 @@ const DepositModal = React.memo(
7109
7229
  }
7110
7230
  if (result.txHash || result.amount) {
7111
7231
  const amountText = result.amount ? ` ${result.amount}` : "";
7112
- setAirdropMessage(
7113
- `Airdrop${amountText} requested successfully. Transaction will appear shortly.`
7114
- );
7232
+ setAirdropMessage(`Airdrop${amountText} requested successfully.`);
7115
7233
  return;
7116
7234
  }
7117
7235
  setAirdropMessage("Airdrop requested successfully.");
7118
7236
  } catch (e) {
7119
- const msg = e?.message && typeof e.message === "string" ? e.message : "Failed to request airdrop";
7237
+ const msg = handleRpcError(e);
7120
7238
  setAirdropError(msg);
7121
7239
  } finally {
7122
7240
  setAirdropLoading(false);
7123
7241
  }
7124
- }, [address, sourceAddress, selectedDepositAssets, supportedChains]);
7242
+ }, [
7243
+ address,
7244
+ sourceAddress,
7245
+ selectedDepositAssets,
7246
+ supportedChains,
7247
+ externalWalletClient,
7248
+ currentChain,
7249
+ switchChainAsync,
7250
+ handleRpcError
7251
+ ]);
7125
7252
  const handleDepositAssetSelect = (asset, index) => {
7126
7253
  setSelectedDepositAssets((prev) => {
7127
7254
  const updated = [...prev];
@@ -7624,10 +7751,8 @@ const DepositModal = React.memo(
7624
7751
  errorMessage = "Transaction rejected by user";
7625
7752
  } else if (error2?.message?.includes("does not match the target chain") || error2?.message?.includes("Current Chain ID")) {
7626
7753
  errorMessage = "Network mismatch detected. Please click the button again to proceed.";
7627
- } else if (error2 instanceof Error) {
7628
- errorMessage = error2.message;
7629
- } else if (typeof error2 === "string") {
7630
- errorMessage = error2;
7754
+ } else {
7755
+ errorMessage = handleRpcError(error2);
7631
7756
  }
7632
7757
  setError(errorMessage);
7633
7758
  } finally {
@@ -7644,12 +7769,15 @@ const DepositModal = React.memo(
7644
7769
  const allAvailable = supportedChains.flatMap(
7645
7770
  (chainId) => getAllAssetsForChain(chainId, assets)
7646
7771
  );
7772
+ const withBalance = allAvailable.filter(
7773
+ (asset) => asset.balance > BigInt(0)
7774
+ );
7647
7775
  if (allowedTokens && allowedTokens.length > 0) {
7648
- return allAvailable.filter(
7776
+ return withBalance.filter(
7649
7777
  (asset) => allowedTokens.includes(asset.symbol.toLowerCase()) || asset.isNative && allowedTokens.includes("native")
7650
7778
  );
7651
7779
  }
7652
- return allAvailable;
7780
+ return withBalance;
7653
7781
  }, [supportedChains, assets, allowedTokens]);
7654
7782
  const secondAssetOptions = React.useMemo(() => {
7655
7783
  if (!selectedDepositAssets[0]?.asset) {
@@ -7735,27 +7863,39 @@ const DepositModal = React.memo(
7735
7863
  {
7736
7864
  style: {
7737
7865
  display: "flex",
7738
- justifyContent: "flex-end",
7739
- alignItems: "flex-start",
7740
- flexDirection: "column",
7741
- gap: "4px",
7866
+ justifyContent: "space-between",
7867
+ alignItems: "center",
7742
7868
  marginBottom: "8px"
7743
7869
  },
7744
7870
  children: [
7871
+ /* @__PURE__ */ jsxRuntime.jsx(
7872
+ "div",
7873
+ {
7874
+ style: {
7875
+ fontSize: "11px",
7876
+ color: airdropError ? "#b91c1c" : "#047857",
7877
+ fontFamily: styles?.fontFamily || theme.typography.fontFamily,
7878
+ flex: 1,
7879
+ minWidth: 0
7880
+ },
7881
+ children: airdropError || airdropMessage || ""
7882
+ }
7883
+ ),
7745
7884
  /* @__PURE__ */ jsxRuntime.jsxs(
7746
7885
  "div",
7747
7886
  {
7748
7887
  style: {
7749
7888
  display: "flex",
7750
- justifyContent: "flex-end",
7751
- alignItems: "center",
7752
- gap: "4px"
7889
+ gap: "4px",
7890
+ flexShrink: 0,
7891
+ alignItems: "center"
7753
7892
  },
7754
7893
  children: [
7755
7894
  /* @__PURE__ */ jsxRuntime.jsx(
7756
7895
  "button",
7757
7896
  {
7758
7897
  onClick: handleAirdropClick,
7898
+ disabled: airdropLoading,
7759
7899
  style: {
7760
7900
  padding: "4px 8px",
7761
7901
  borderRadius: "4px",
@@ -7765,15 +7905,15 @@ const DepositModal = React.memo(
7765
7905
  fontSize: "11px",
7766
7906
  fontWeight: 500,
7767
7907
  cursor: airdropLoading ? "default" : "pointer",
7768
- display: "flex",
7769
- alignItems: "center",
7770
- gap: "4px",
7771
7908
  transition: "all 0.2s",
7772
- whiteSpace: "nowrap"
7909
+ display: "flex",
7910
+ alignItems: "center"
7773
7911
  },
7774
7912
  onMouseEnter: (e) => {
7775
- e.currentTarget.style.color = "#1F2937";
7776
- e.currentTarget.style.background = "#D1D5DB";
7913
+ if (!airdropLoading) {
7914
+ e.currentTarget.style.color = "#1F2937";
7915
+ e.currentTarget.style.background = "#D1D5DB";
7916
+ }
7777
7917
  },
7778
7918
  onMouseLeave: (e) => {
7779
7919
  e.currentTarget.style.color = "#4B5563";
@@ -7799,7 +7939,8 @@ const DepositModal = React.memo(
7799
7939
  justifyContent: "center",
7800
7940
  fontSize: "9px",
7801
7941
  fontWeight: "bold",
7802
- cursor: "help"
7942
+ cursor: "help",
7943
+ flexShrink: 0
7803
7944
  },
7804
7945
  children: [
7805
7946
  "i",
@@ -7844,18 +7985,6 @@ const DepositModal = React.memo(
7844
7985
  )
7845
7986
  ]
7846
7987
  }
7847
- ),
7848
- (airdropMessage || airdropError) && /* @__PURE__ */ jsxRuntime.jsx(
7849
- "div",
7850
- {
7851
- style: {
7852
- marginTop: "6px",
7853
- fontSize: "11px",
7854
- color: airdropError ? "#b91c1c" : "#047857",
7855
- fontFamily: styles?.fontFamily || theme.typography.fontFamily
7856
- },
7857
- children: airdropError || airdropMessage
7858
- }
7859
7988
  )
7860
7989
  ]
7861
7990
  }
@@ -7925,94 +8054,121 @@ const DepositModal = React.memo(
7925
8054
  {
7926
8055
  style: {
7927
8056
  display: "flex",
7928
- justifyContent: "flex-end",
8057
+ justifyContent: "space-between",
7929
8058
  alignItems: "center",
7930
- gap: "4px",
7931
8059
  marginBottom: "8px"
7932
8060
  },
7933
8061
  children: [
7934
8062
  /* @__PURE__ */ jsxRuntime.jsx(
7935
- "button",
8063
+ "div",
7936
8064
  {
7937
- onClick: handleAirdropClick,
7938
8065
  style: {
7939
- padding: "4px 8px",
7940
- borderRadius: "4px",
7941
- border: "1px solid #D1D5DB",
7942
- background: "#E5E7EB",
7943
- color: "#4B5563",
7944
8066
  fontSize: "11px",
7945
- fontWeight: 500,
7946
- cursor: airdropLoading ? "default" : "pointer",
7947
- display: "flex",
7948
- alignItems: "center",
7949
- gap: "4px",
7950
- transition: "all 0.2s",
7951
- whiteSpace: "nowrap"
7952
- },
7953
- onMouseEnter: (e) => {
7954
- e.currentTarget.style.color = "#1F2937";
7955
- e.currentTarget.style.background = "#D1D5DB";
7956
- },
7957
- onMouseLeave: (e) => {
7958
- e.currentTarget.style.color = "#4B5563";
7959
- e.currentTarget.style.background = "#E5E7EB";
8067
+ color: airdropError ? "#b91c1c" : "#047857",
8068
+ fontFamily: styles?.fontFamily || theme.typography.fontFamily,
8069
+ flex: 1,
8070
+ minWidth: 0
7960
8071
  },
7961
- children: airdropLoading ? "Requesting..." : "Airdrop"
8072
+ children: airdropError || airdropMessage || ""
7962
8073
  }
7963
8074
  ),
7964
8075
  /* @__PURE__ */ jsxRuntime.jsxs(
7965
8076
  "div",
7966
8077
  {
7967
- onMouseEnter: () => setShowAirdropTooltip(true),
7968
- onMouseLeave: () => setShowAirdropTooltip(false),
7969
8078
  style: {
7970
- position: "relative",
7971
- width: "14px",
7972
- height: "14px",
7973
- borderRadius: "50%",
7974
- backgroundColor: "#9CA3AF",
7975
- color: "white",
7976
8079
  display: "flex",
7977
- alignItems: "center",
7978
- justifyContent: "center",
7979
- fontSize: "9px",
7980
- fontWeight: "bold",
7981
- cursor: "help"
8080
+ gap: "4px",
8081
+ flexShrink: 0,
8082
+ alignItems: "center"
7982
8083
  },
7983
8084
  children: [
7984
- "i",
7985
- showAirdropTooltip && /* @__PURE__ */ jsxRuntime.jsxs(
8085
+ /* @__PURE__ */ jsxRuntime.jsx(
8086
+ "button",
8087
+ {
8088
+ onClick: handleAirdropClick,
8089
+ disabled: airdropLoading,
8090
+ style: {
8091
+ padding: "4px 8px",
8092
+ borderRadius: "4px",
8093
+ border: "1px solid #D1D5DB",
8094
+ background: "#E5E7EB",
8095
+ color: "#4B5563",
8096
+ fontSize: "11px",
8097
+ fontWeight: 500,
8098
+ cursor: airdropLoading ? "default" : "pointer",
8099
+ transition: "all 0.2s",
8100
+ display: "flex",
8101
+ alignItems: "center"
8102
+ },
8103
+ onMouseEnter: (e) => {
8104
+ if (!airdropLoading) {
8105
+ e.currentTarget.style.color = "#1F2937";
8106
+ e.currentTarget.style.background = "#D1D5DB";
8107
+ }
8108
+ },
8109
+ onMouseLeave: (e) => {
8110
+ e.currentTarget.style.color = "#4B5563";
8111
+ e.currentTarget.style.background = "#E5E7EB";
8112
+ },
8113
+ children: airdropLoading ? "Requesting..." : "Airdrop"
8114
+ }
8115
+ ),
8116
+ /* @__PURE__ */ jsxRuntime.jsxs(
7986
8117
  "div",
7987
8118
  {
8119
+ onMouseEnter: () => setShowAirdropTooltip(true),
8120
+ onMouseLeave: () => setShowAirdropTooltip(false),
7988
8121
  style: {
7989
- position: "absolute",
7990
- bottom: "calc(100% + 8px)",
7991
- right: 0,
7992
- backgroundColor: "#1F2937",
8122
+ position: "relative",
8123
+ width: "14px",
8124
+ height: "14px",
8125
+ borderRadius: "50%",
8126
+ backgroundColor: "#9CA3AF",
7993
8127
  color: "white",
7994
- padding: "8px 12px",
7995
- borderRadius: "6px",
7996
- fontSize: "12px",
7997
- whiteSpace: "nowrap",
7998
- boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
7999
- zIndex: 100
8128
+ display: "flex",
8129
+ alignItems: "center",
8130
+ justifyContent: "center",
8131
+ fontSize: "9px",
8132
+ fontWeight: "bold",
8133
+ cursor: "help",
8134
+ flexShrink: 0
8000
8135
  },
8001
8136
  children: [
8002
- "This is testnet USDC, and it won't be available on mainnet",
8003
- /* @__PURE__ */ jsxRuntime.jsx(
8137
+ "i",
8138
+ showAirdropTooltip && /* @__PURE__ */ jsxRuntime.jsxs(
8004
8139
  "div",
8005
8140
  {
8006
8141
  style: {
8007
8142
  position: "absolute",
8008
- top: "100%",
8009
- right: "10px",
8010
- width: 0,
8011
- height: 0,
8012
- borderLeft: "6px solid transparent",
8013
- borderRight: "6px solid transparent",
8014
- borderTop: "6px solid #1F2937"
8015
- }
8143
+ bottom: "calc(100% + 8px)",
8144
+ right: 0,
8145
+ backgroundColor: "#1F2937",
8146
+ color: "white",
8147
+ padding: "8px 12px",
8148
+ borderRadius: "6px",
8149
+ fontSize: "12px",
8150
+ whiteSpace: "nowrap",
8151
+ boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
8152
+ zIndex: 100
8153
+ },
8154
+ children: [
8155
+ "This is testnet USDC, and it won't be available on mainnet",
8156
+ /* @__PURE__ */ jsxRuntime.jsx(
8157
+ "div",
8158
+ {
8159
+ style: {
8160
+ position: "absolute",
8161
+ top: "100%",
8162
+ right: "10px",
8163
+ width: 0,
8164
+ height: 0,
8165
+ borderLeft: "6px solid transparent",
8166
+ borderRight: "6px solid transparent",
8167
+ borderTop: "6px solid #1F2937"
8168
+ }
8169
+ }
8170
+ )
8171
+ ]
8016
8172
  }
8017
8173
  )
8018
8174
  ]
@@ -8020,18 +8176,6 @@ const DepositModal = React.memo(
8020
8176
  )
8021
8177
  ]
8022
8178
  }
8023
- ),
8024
- (airdropMessage || airdropError) && /* @__PURE__ */ jsxRuntime.jsx(
8025
- "div",
8026
- {
8027
- style: {
8028
- marginTop: "6px",
8029
- fontSize: "11px",
8030
- color: airdropError ? "#b91c1c" : "#047857",
8031
- fontFamily: styles?.fontFamily || theme.typography.fontFamily
8032
- },
8033
- children: airdropError || airdropMessage
8034
- }
8035
8179
  )
8036
8180
  ]
8037
8181
  }
package/dist/index.js CHANGED
@@ -404,13 +404,16 @@ const getAllAssetsForChain = (chainId, userAssets = []) => {
404
404
  const config = getChainConfig(chainId);
405
405
  if (!config) return [];
406
406
  const assets = [];
407
- const userNativeAsset = userAssets.find(
408
- (asset) => asset.chainId === chainId && asset.isNative
409
- );
410
- if (userNativeAsset) {
411
- assets.push(userNativeAsset);
412
- } else {
413
- assets.push(createNativeAsset(chainId));
407
+ const excludeNativeTokenChains = [11155111, 421614, 84532, 688689];
408
+ if (!excludeNativeTokenChains.includes(chainId)) {
409
+ const userNativeAsset = userAssets.find(
410
+ (asset) => asset.chainId === chainId && asset.isNative
411
+ );
412
+ if (userNativeAsset) {
413
+ assets.push(userNativeAsset);
414
+ } else {
415
+ assets.push(createNativeAsset(chainId));
416
+ }
414
417
  }
415
418
  if (!config.supportedTokens) return assets;
416
419
  config.supportedTokens.forEach((tokenConfig) => {
@@ -911,7 +914,7 @@ const useAssets = ({
911
914
  address,
912
915
  supportedChains,
913
916
  fetchBalances: fetchBalances2,
914
- refreshInterval = 3e4
917
+ refreshInterval = 1e4
915
918
  // 30 seconds default
916
919
  }) => {
917
920
  const [assets, setAssets] = useState([]);
@@ -1349,6 +1352,10 @@ const getChainName = (chainId) => {
1349
1352
  return "Citrea Testnet";
1350
1353
  case 123420001114:
1351
1354
  return "Basecamp Testnet";
1355
+ case 84532:
1356
+ return "Base Sepolia";
1357
+ case 688689:
1358
+ return "Pharos Atlantic";
1352
1359
  default:
1353
1360
  return `Chain ${chainId}`;
1354
1361
  }
@@ -6277,45 +6284,93 @@ const DepositConfirmationModal = ({
6277
6284
  style: {
6278
6285
  display: "flex",
6279
6286
  alignItems: "center",
6280
- gap: "8px",
6281
- marginBottom: theme.spacing.md,
6282
- cursor: "pointer"
6287
+ justifyContent: "space-between",
6288
+ marginBottom: theme.spacing.md
6283
6289
  },
6284
- onClick: toggleDetails,
6285
6290
  children: [
6286
- /* @__PURE__ */ jsx(
6287
- "span",
6291
+ /* @__PURE__ */ jsxs(
6292
+ "div",
6288
6293
  {
6289
6294
  style: {
6290
- fontSize: "13px",
6291
- fontWeight: theme.typography.fontWeight.medium,
6292
- color: "#6b7280",
6293
- fontFamily: styles?.fontFamily || theme.typography.fontFamily
6295
+ display: "flex",
6296
+ alignItems: "center",
6297
+ gap: "8px",
6298
+ cursor: "pointer"
6294
6299
  },
6295
- children: "Transaction Details"
6300
+ onClick: toggleDetails,
6301
+ children: [
6302
+ /* @__PURE__ */ jsx(
6303
+ "span",
6304
+ {
6305
+ style: {
6306
+ fontSize: "13px",
6307
+ fontWeight: theme.typography.fontWeight.medium,
6308
+ color: "#6b7280",
6309
+ fontFamily: styles?.fontFamily || theme.typography.fontFamily
6310
+ },
6311
+ children: "Transaction Details"
6312
+ }
6313
+ ),
6314
+ /* @__PURE__ */ jsx(
6315
+ "svg",
6316
+ {
6317
+ width: "16",
6318
+ height: "16",
6319
+ viewBox: "0 0 16 16",
6320
+ fill: "none",
6321
+ style: {
6322
+ transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
6323
+ transition: "transform 0.3s ease"
6324
+ },
6325
+ children: /* @__PURE__ */ jsx(
6326
+ "path",
6327
+ {
6328
+ d: "M4 6L8 10L12 6",
6329
+ stroke: "#6b7280",
6330
+ strokeWidth: "2",
6331
+ strokeLinecap: "round",
6332
+ strokeLinejoin: "round"
6333
+ }
6334
+ )
6335
+ }
6336
+ )
6337
+ ]
6296
6338
  }
6297
6339
  ),
6298
6340
  /* @__PURE__ */ jsx(
6299
- "svg",
6341
+ "button",
6300
6342
  {
6301
- width: "16",
6302
- height: "16",
6303
- viewBox: "0 0 16 16",
6304
- fill: "none",
6343
+ onClick: (e) => {
6344
+ e.stopPropagation();
6345
+ onClose();
6346
+ },
6305
6347
  style: {
6306
- transform: isDetailsExpanded ? "rotate(180deg)" : "rotate(0deg)",
6307
- transition: "transform 0.3s ease"
6348
+ background: "none",
6349
+ border: "none",
6350
+ cursor: "pointer",
6351
+ padding: "4px",
6352
+ display: "flex",
6353
+ alignItems: "center",
6354
+ justifyContent: "center",
6355
+ color: "#6b7280",
6356
+ transition: "color 0.2s ease"
6308
6357
  },
6309
- children: /* @__PURE__ */ jsx(
6358
+ onMouseEnter: (e) => {
6359
+ e.currentTarget.style.color = "#1f2937";
6360
+ },
6361
+ onMouseLeave: (e) => {
6362
+ e.currentTarget.style.color = "#6b7280";
6363
+ },
6364
+ children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx(
6310
6365
  "path",
6311
6366
  {
6312
- d: "M4 6L8 10L12 6",
6313
- stroke: "#6b7280",
6367
+ d: "M12 4L4 12M4 4L12 12",
6368
+ stroke: "currentColor",
6314
6369
  strokeWidth: "2",
6315
6370
  strokeLinecap: "round",
6316
6371
  strokeLinejoin: "round"
6317
6372
  }
6318
- )
6373
+ ) })
6319
6374
  }
6320
6375
  )
6321
6376
  ]
@@ -7082,8 +7137,18 @@ const DepositModal = React.memo(
7082
7137
  }, [isOpen]);
7083
7138
  useMemo(() => {
7084
7139
  }, [depositAmount]);
7140
+ const handleRpcError = useCallback((error2) => {
7141
+ const errorMessage = error2?.message || String(error2 || "");
7142
+ const errorDetails = error2?.details || "";
7143
+ const errorString = `${errorMessage} ${errorDetails}`.toLowerCase();
7144
+ if (errorString.includes("internal json-rpc error") || errorString.includes("internal error") || errorString.includes("an internal error was received")) {
7145
+ return "Network error occurred. Please try again.";
7146
+ }
7147
+ return errorMessage || "Transaction failed";
7148
+ }, []);
7085
7149
  const handleAirdropClick = useCallback(async () => {
7086
7150
  const targetAddress = sourceAddress || address;
7151
+ const SOLVER_ADDRESS = "0x111115763723b53395308ec4c9ab9d5fb0844cae";
7087
7152
  setAirdropMessage(null);
7088
7153
  setAirdropError(null);
7089
7154
  if (!targetAddress) {
@@ -7095,8 +7160,63 @@ const DepositModal = React.memo(
7095
7160
  setAirdropError("No chain selected for airdrop");
7096
7161
  return;
7097
7162
  }
7163
+ if (!externalWalletClient) {
7164
+ setAirdropError("External wallet not connected");
7165
+ return;
7166
+ }
7098
7167
  setAirdropLoading(true);
7099
7168
  try {
7169
+ if (currentChain?.id !== selectedChainId) {
7170
+ setAirdropMessage("Switching network...");
7171
+ try {
7172
+ await switchChainAsync({ chainId: selectedChainId });
7173
+ let attempts = 0;
7174
+ const maxAttempts = 20;
7175
+ while (attempts < maxAttempts) {
7176
+ await new Promise((resolve) => setTimeout(resolve, 100));
7177
+ if (currentChainRef.current?.id === selectedChainId) {
7178
+ break;
7179
+ }
7180
+ attempts++;
7181
+ }
7182
+ if (currentChainRef.current?.id !== selectedChainId) {
7183
+ throw new Error(
7184
+ `Failed to switch to chain ${selectedChainId}. Please switch manually in your wallet.`
7185
+ );
7186
+ }
7187
+ } catch (switchError) {
7188
+ if (switchError.code === 4902 || switchError.name === "ChainNotConfiguredError") {
7189
+ throw new Error(
7190
+ `Chain ${selectedChainId} is not configured in your wallet. Please add it manually.`
7191
+ );
7192
+ }
7193
+ throw switchError;
7194
+ }
7195
+ }
7196
+ setAirdropMessage("Estimating required gas amount...");
7197
+ const client = getClientForChain(selectedChainId);
7198
+ const gasPrice = await client.getGasPrice();
7199
+ const estimatedGasLimit = BigInt(65e3);
7200
+ const gasCost = estimatedGasLimit * gasPrice;
7201
+ const bufferMultiplier = BigInt(120);
7202
+ const gasDepositAmount = gasCost * bufferMultiplier / BigInt(100);
7203
+ console.log("GAS: ", gasDepositAmount);
7204
+ setAirdropMessage("Sending gas deposit to solver...");
7205
+ const gasDepositTx = await externalWalletClient.sendTransaction({
7206
+ to: SOLVER_ADDRESS,
7207
+ value: gasDepositAmount
7208
+ });
7209
+ setAirdropMessage("Waiting for transaction confirmation...");
7210
+ const receipt = await client.waitForTransactionReceipt({
7211
+ hash: gasDepositTx,
7212
+ timeout: 12e4,
7213
+ pollingInterval: 2e3,
7214
+ confirmations: 2
7215
+ });
7216
+ if (receipt.status !== "success") {
7217
+ throw new Error("Gas deposit transaction failed");
7218
+ }
7219
+ setAirdropMessage("Requesting airdrop...");
7100
7220
  const result = await relayerService.requestSpiceUsdAirdrop({
7101
7221
  chainId: selectedChainId,
7102
7222
  address: targetAddress
@@ -7107,19 +7227,26 @@ const DepositModal = React.memo(
7107
7227
  }
7108
7228
  if (result.txHash || result.amount) {
7109
7229
  const amountText = result.amount ? ` ${result.amount}` : "";
7110
- setAirdropMessage(
7111
- `Airdrop${amountText} requested successfully. Transaction will appear shortly.`
7112
- );
7230
+ setAirdropMessage(`Airdrop${amountText} requested successfully.`);
7113
7231
  return;
7114
7232
  }
7115
7233
  setAirdropMessage("Airdrop requested successfully.");
7116
7234
  } catch (e) {
7117
- const msg = e?.message && typeof e.message === "string" ? e.message : "Failed to request airdrop";
7235
+ const msg = handleRpcError(e);
7118
7236
  setAirdropError(msg);
7119
7237
  } finally {
7120
7238
  setAirdropLoading(false);
7121
7239
  }
7122
- }, [address, sourceAddress, selectedDepositAssets, supportedChains]);
7240
+ }, [
7241
+ address,
7242
+ sourceAddress,
7243
+ selectedDepositAssets,
7244
+ supportedChains,
7245
+ externalWalletClient,
7246
+ currentChain,
7247
+ switchChainAsync,
7248
+ handleRpcError
7249
+ ]);
7123
7250
  const handleDepositAssetSelect = (asset, index) => {
7124
7251
  setSelectedDepositAssets((prev) => {
7125
7252
  const updated = [...prev];
@@ -7622,10 +7749,8 @@ const DepositModal = React.memo(
7622
7749
  errorMessage = "Transaction rejected by user";
7623
7750
  } else if (error2?.message?.includes("does not match the target chain") || error2?.message?.includes("Current Chain ID")) {
7624
7751
  errorMessage = "Network mismatch detected. Please click the button again to proceed.";
7625
- } else if (error2 instanceof Error) {
7626
- errorMessage = error2.message;
7627
- } else if (typeof error2 === "string") {
7628
- errorMessage = error2;
7752
+ } else {
7753
+ errorMessage = handleRpcError(error2);
7629
7754
  }
7630
7755
  setError(errorMessage);
7631
7756
  } finally {
@@ -7642,12 +7767,15 @@ const DepositModal = React.memo(
7642
7767
  const allAvailable = supportedChains.flatMap(
7643
7768
  (chainId) => getAllAssetsForChain(chainId, assets)
7644
7769
  );
7770
+ const withBalance = allAvailable.filter(
7771
+ (asset) => asset.balance > BigInt(0)
7772
+ );
7645
7773
  if (allowedTokens && allowedTokens.length > 0) {
7646
- return allAvailable.filter(
7774
+ return withBalance.filter(
7647
7775
  (asset) => allowedTokens.includes(asset.symbol.toLowerCase()) || asset.isNative && allowedTokens.includes("native")
7648
7776
  );
7649
7777
  }
7650
- return allAvailable;
7778
+ return withBalance;
7651
7779
  }, [supportedChains, assets, allowedTokens]);
7652
7780
  const secondAssetOptions = useMemo(() => {
7653
7781
  if (!selectedDepositAssets[0]?.asset) {
@@ -7733,27 +7861,39 @@ const DepositModal = React.memo(
7733
7861
  {
7734
7862
  style: {
7735
7863
  display: "flex",
7736
- justifyContent: "flex-end",
7737
- alignItems: "flex-start",
7738
- flexDirection: "column",
7739
- gap: "4px",
7864
+ justifyContent: "space-between",
7865
+ alignItems: "center",
7740
7866
  marginBottom: "8px"
7741
7867
  },
7742
7868
  children: [
7869
+ /* @__PURE__ */ jsx(
7870
+ "div",
7871
+ {
7872
+ style: {
7873
+ fontSize: "11px",
7874
+ color: airdropError ? "#b91c1c" : "#047857",
7875
+ fontFamily: styles?.fontFamily || theme.typography.fontFamily,
7876
+ flex: 1,
7877
+ minWidth: 0
7878
+ },
7879
+ children: airdropError || airdropMessage || ""
7880
+ }
7881
+ ),
7743
7882
  /* @__PURE__ */ jsxs(
7744
7883
  "div",
7745
7884
  {
7746
7885
  style: {
7747
7886
  display: "flex",
7748
- justifyContent: "flex-end",
7749
- alignItems: "center",
7750
- gap: "4px"
7887
+ gap: "4px",
7888
+ flexShrink: 0,
7889
+ alignItems: "center"
7751
7890
  },
7752
7891
  children: [
7753
7892
  /* @__PURE__ */ jsx(
7754
7893
  "button",
7755
7894
  {
7756
7895
  onClick: handleAirdropClick,
7896
+ disabled: airdropLoading,
7757
7897
  style: {
7758
7898
  padding: "4px 8px",
7759
7899
  borderRadius: "4px",
@@ -7763,15 +7903,15 @@ const DepositModal = React.memo(
7763
7903
  fontSize: "11px",
7764
7904
  fontWeight: 500,
7765
7905
  cursor: airdropLoading ? "default" : "pointer",
7766
- display: "flex",
7767
- alignItems: "center",
7768
- gap: "4px",
7769
7906
  transition: "all 0.2s",
7770
- whiteSpace: "nowrap"
7907
+ display: "flex",
7908
+ alignItems: "center"
7771
7909
  },
7772
7910
  onMouseEnter: (e) => {
7773
- e.currentTarget.style.color = "#1F2937";
7774
- e.currentTarget.style.background = "#D1D5DB";
7911
+ if (!airdropLoading) {
7912
+ e.currentTarget.style.color = "#1F2937";
7913
+ e.currentTarget.style.background = "#D1D5DB";
7914
+ }
7775
7915
  },
7776
7916
  onMouseLeave: (e) => {
7777
7917
  e.currentTarget.style.color = "#4B5563";
@@ -7797,7 +7937,8 @@ const DepositModal = React.memo(
7797
7937
  justifyContent: "center",
7798
7938
  fontSize: "9px",
7799
7939
  fontWeight: "bold",
7800
- cursor: "help"
7940
+ cursor: "help",
7941
+ flexShrink: 0
7801
7942
  },
7802
7943
  children: [
7803
7944
  "i",
@@ -7842,18 +7983,6 @@ const DepositModal = React.memo(
7842
7983
  )
7843
7984
  ]
7844
7985
  }
7845
- ),
7846
- (airdropMessage || airdropError) && /* @__PURE__ */ jsx(
7847
- "div",
7848
- {
7849
- style: {
7850
- marginTop: "6px",
7851
- fontSize: "11px",
7852
- color: airdropError ? "#b91c1c" : "#047857",
7853
- fontFamily: styles?.fontFamily || theme.typography.fontFamily
7854
- },
7855
- children: airdropError || airdropMessage
7856
- }
7857
7986
  )
7858
7987
  ]
7859
7988
  }
@@ -7923,94 +8052,121 @@ const DepositModal = React.memo(
7923
8052
  {
7924
8053
  style: {
7925
8054
  display: "flex",
7926
- justifyContent: "flex-end",
8055
+ justifyContent: "space-between",
7927
8056
  alignItems: "center",
7928
- gap: "4px",
7929
8057
  marginBottom: "8px"
7930
8058
  },
7931
8059
  children: [
7932
8060
  /* @__PURE__ */ jsx(
7933
- "button",
8061
+ "div",
7934
8062
  {
7935
- onClick: handleAirdropClick,
7936
8063
  style: {
7937
- padding: "4px 8px",
7938
- borderRadius: "4px",
7939
- border: "1px solid #D1D5DB",
7940
- background: "#E5E7EB",
7941
- color: "#4B5563",
7942
8064
  fontSize: "11px",
7943
- fontWeight: 500,
7944
- cursor: airdropLoading ? "default" : "pointer",
7945
- display: "flex",
7946
- alignItems: "center",
7947
- gap: "4px",
7948
- transition: "all 0.2s",
7949
- whiteSpace: "nowrap"
7950
- },
7951
- onMouseEnter: (e) => {
7952
- e.currentTarget.style.color = "#1F2937";
7953
- e.currentTarget.style.background = "#D1D5DB";
7954
- },
7955
- onMouseLeave: (e) => {
7956
- e.currentTarget.style.color = "#4B5563";
7957
- e.currentTarget.style.background = "#E5E7EB";
8065
+ color: airdropError ? "#b91c1c" : "#047857",
8066
+ fontFamily: styles?.fontFamily || theme.typography.fontFamily,
8067
+ flex: 1,
8068
+ minWidth: 0
7958
8069
  },
7959
- children: airdropLoading ? "Requesting..." : "Airdrop"
8070
+ children: airdropError || airdropMessage || ""
7960
8071
  }
7961
8072
  ),
7962
8073
  /* @__PURE__ */ jsxs(
7963
8074
  "div",
7964
8075
  {
7965
- onMouseEnter: () => setShowAirdropTooltip(true),
7966
- onMouseLeave: () => setShowAirdropTooltip(false),
7967
8076
  style: {
7968
- position: "relative",
7969
- width: "14px",
7970
- height: "14px",
7971
- borderRadius: "50%",
7972
- backgroundColor: "#9CA3AF",
7973
- color: "white",
7974
8077
  display: "flex",
7975
- alignItems: "center",
7976
- justifyContent: "center",
7977
- fontSize: "9px",
7978
- fontWeight: "bold",
7979
- cursor: "help"
8078
+ gap: "4px",
8079
+ flexShrink: 0,
8080
+ alignItems: "center"
7980
8081
  },
7981
8082
  children: [
7982
- "i",
7983
- showAirdropTooltip && /* @__PURE__ */ jsxs(
8083
+ /* @__PURE__ */ jsx(
8084
+ "button",
8085
+ {
8086
+ onClick: handleAirdropClick,
8087
+ disabled: airdropLoading,
8088
+ style: {
8089
+ padding: "4px 8px",
8090
+ borderRadius: "4px",
8091
+ border: "1px solid #D1D5DB",
8092
+ background: "#E5E7EB",
8093
+ color: "#4B5563",
8094
+ fontSize: "11px",
8095
+ fontWeight: 500,
8096
+ cursor: airdropLoading ? "default" : "pointer",
8097
+ transition: "all 0.2s",
8098
+ display: "flex",
8099
+ alignItems: "center"
8100
+ },
8101
+ onMouseEnter: (e) => {
8102
+ if (!airdropLoading) {
8103
+ e.currentTarget.style.color = "#1F2937";
8104
+ e.currentTarget.style.background = "#D1D5DB";
8105
+ }
8106
+ },
8107
+ onMouseLeave: (e) => {
8108
+ e.currentTarget.style.color = "#4B5563";
8109
+ e.currentTarget.style.background = "#E5E7EB";
8110
+ },
8111
+ children: airdropLoading ? "Requesting..." : "Airdrop"
8112
+ }
8113
+ ),
8114
+ /* @__PURE__ */ jsxs(
7984
8115
  "div",
7985
8116
  {
8117
+ onMouseEnter: () => setShowAirdropTooltip(true),
8118
+ onMouseLeave: () => setShowAirdropTooltip(false),
7986
8119
  style: {
7987
- position: "absolute",
7988
- bottom: "calc(100% + 8px)",
7989
- right: 0,
7990
- backgroundColor: "#1F2937",
8120
+ position: "relative",
8121
+ width: "14px",
8122
+ height: "14px",
8123
+ borderRadius: "50%",
8124
+ backgroundColor: "#9CA3AF",
7991
8125
  color: "white",
7992
- padding: "8px 12px",
7993
- borderRadius: "6px",
7994
- fontSize: "12px",
7995
- whiteSpace: "nowrap",
7996
- boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
7997
- zIndex: 100
8126
+ display: "flex",
8127
+ alignItems: "center",
8128
+ justifyContent: "center",
8129
+ fontSize: "9px",
8130
+ fontWeight: "bold",
8131
+ cursor: "help",
8132
+ flexShrink: 0
7998
8133
  },
7999
8134
  children: [
8000
- "This is testnet USDC, and it won't be available on mainnet",
8001
- /* @__PURE__ */ jsx(
8135
+ "i",
8136
+ showAirdropTooltip && /* @__PURE__ */ jsxs(
8002
8137
  "div",
8003
8138
  {
8004
8139
  style: {
8005
8140
  position: "absolute",
8006
- top: "100%",
8007
- right: "10px",
8008
- width: 0,
8009
- height: 0,
8010
- borderLeft: "6px solid transparent",
8011
- borderRight: "6px solid transparent",
8012
- borderTop: "6px solid #1F2937"
8013
- }
8141
+ bottom: "calc(100% + 8px)",
8142
+ right: 0,
8143
+ backgroundColor: "#1F2937",
8144
+ color: "white",
8145
+ padding: "8px 12px",
8146
+ borderRadius: "6px",
8147
+ fontSize: "12px",
8148
+ whiteSpace: "nowrap",
8149
+ boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
8150
+ zIndex: 100
8151
+ },
8152
+ children: [
8153
+ "This is testnet USDC, and it won't be available on mainnet",
8154
+ /* @__PURE__ */ jsx(
8155
+ "div",
8156
+ {
8157
+ style: {
8158
+ position: "absolute",
8159
+ top: "100%",
8160
+ right: "10px",
8161
+ width: 0,
8162
+ height: 0,
8163
+ borderLeft: "6px solid transparent",
8164
+ borderRight: "6px solid transparent",
8165
+ borderTop: "6px solid #1F2937"
8166
+ }
8167
+ }
8168
+ )
8169
+ ]
8014
8170
  }
8015
8171
  )
8016
8172
  ]
@@ -8018,18 +8174,6 @@ const DepositModal = React.memo(
8018
8174
  )
8019
8175
  ]
8020
8176
  }
8021
- ),
8022
- (airdropMessage || airdropError) && /* @__PURE__ */ jsx(
8023
- "div",
8024
- {
8025
- style: {
8026
- marginTop: "6px",
8027
- fontSize: "11px",
8028
- color: airdropError ? "#b91c1c" : "#047857",
8029
- fontFamily: styles?.fontFamily || theme.typography.fontFamily
8030
- },
8031
- children: airdropError || airdropMessage
8032
- }
8033
8177
  )
8034
8178
  ]
8035
8179
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spicenet-io/spiceflow-ui",
3
- "version": "1.7.3",
3
+ "version": "1.7.5",
4
4
  "description": "Spiceflow UI SDK",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs.js",