@b3dotfun/sdk 0.0.41 → 0.0.42-alpha.1

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 (116) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpend.d.ts +1 -0
  2. package/dist/cjs/anyspend/react/components/AnySpend.js +18 -2
  3. package/dist/cjs/anyspend/react/components/AnySpendBondKit.js +0 -1
  4. package/dist/cjs/anyspend/react/components/AnySpendBuySpin.js +0 -1
  5. package/dist/cjs/anyspend/react/components/AnySpendCustom.d.ts +1 -0
  6. package/dist/cjs/anyspend/react/components/AnySpendCustom.js +76 -14
  7. package/dist/cjs/anyspend/react/components/AnySpendNFT.d.ts +2 -1
  8. package/dist/cjs/anyspend/react/components/AnySpendNFT.js +2 -2
  9. package/dist/cjs/anyspend/react/components/AnySpendStakeB3.js +0 -1
  10. package/dist/cjs/anyspend/react/components/AnyspendSignatureMint.js +1 -2
  11. package/dist/cjs/anyspend/react/components/common/CryptoPaySection.js +1 -1
  12. package/dist/cjs/anyspend/react/components/common/CryptoReceiveSection.js +2 -1
  13. package/dist/cjs/anyspend/react/components/common/PanelOnramp.js +4 -1
  14. package/dist/cjs/anyspend/react/components/common/PointsBadge.d.ts +7 -0
  15. package/dist/cjs/anyspend/react/components/common/PointsBadge.js +7 -0
  16. package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js +5 -3
  17. package/dist/cjs/anyspend/services/anyspend.d.ts +1 -1
  18. package/dist/cjs/anyspend/services/anyspend.js +2 -0
  19. package/dist/cjs/anyspend/types/api.d.ts +41 -1
  20. package/dist/cjs/anyspend/utils/orderPayload.js +3 -0
  21. package/dist/cjs/bondkit/components/TradingView.js +3 -4
  22. package/dist/cjs/bondkit/swapService.js +3 -0
  23. package/dist/cjs/global-account/react/components/B3Provider/B3Provider.js +19 -13
  24. package/dist/cjs/global-account/react/hooks/index.d.ts +1 -0
  25. package/dist/cjs/global-account/react/hooks/index.js +3 -1
  26. package/dist/cjs/global-account/react/hooks/useAccountAssets.js +5 -2
  27. package/dist/cjs/global-account/react/hooks/useAuthentication.js +1 -1
  28. package/dist/cjs/global-account/react/hooks/useGlobalAccount.d.ts +6 -0
  29. package/dist/cjs/global-account/react/hooks/useGlobalAccount.js +32 -0
  30. package/dist/cjs/global-account/react/hooks/useQueryB3.js +5 -2
  31. package/dist/cjs/global-account/react/hooks/useQueryBSMNT.js +5 -2
  32. package/dist/cjs/global-account/react/hooks/useTokenBalancesByChain.js +7 -1
  33. package/dist/cjs/global-account/react/hooks/useTokenFromUrl.js +2 -2
  34. package/dist/cjs/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +1 -2
  35. package/dist/cjs/global-account/react/stores/useModalStore.d.ts +1 -1
  36. package/dist/cjs/shared/utils/fetchBalances.d.ts +1 -1
  37. package/dist/esm/anyspend/react/components/AnySpend.d.ts +1 -0
  38. package/dist/esm/anyspend/react/components/AnySpend.js +18 -2
  39. package/dist/esm/anyspend/react/components/AnySpendBondKit.js +0 -1
  40. package/dist/esm/anyspend/react/components/AnySpendBuySpin.js +0 -1
  41. package/dist/esm/anyspend/react/components/AnySpendCustom.d.ts +1 -0
  42. package/dist/esm/anyspend/react/components/AnySpendCustom.js +43 -14
  43. package/dist/esm/anyspend/react/components/AnySpendNFT.d.ts +2 -1
  44. package/dist/esm/anyspend/react/components/AnySpendNFT.js +2 -2
  45. package/dist/esm/anyspend/react/components/AnySpendStakeB3.js +0 -1
  46. package/dist/esm/anyspend/react/components/AnyspendSignatureMint.js +1 -2
  47. package/dist/esm/anyspend/react/components/common/CryptoPaySection.js +1 -1
  48. package/dist/esm/anyspend/react/components/common/CryptoReceiveSection.js +2 -1
  49. package/dist/esm/anyspend/react/components/common/PanelOnramp.js +4 -1
  50. package/dist/esm/anyspend/react/components/common/PointsBadge.d.ts +7 -0
  51. package/dist/esm/anyspend/react/components/common/PointsBadge.js +4 -0
  52. package/dist/esm/anyspend/react/hooks/useAnyspendFlow.js +5 -3
  53. package/dist/esm/anyspend/services/anyspend.d.ts +1 -1
  54. package/dist/esm/anyspend/services/anyspend.js +2 -0
  55. package/dist/esm/anyspend/types/api.d.ts +41 -1
  56. package/dist/esm/anyspend/utils/orderPayload.js +3 -0
  57. package/dist/esm/bondkit/components/TradingView.js +3 -4
  58. package/dist/esm/bondkit/swapService.js +5 -2
  59. package/dist/esm/global-account/react/components/B3Provider/B3Provider.js +19 -13
  60. package/dist/esm/global-account/react/hooks/index.d.ts +1 -0
  61. package/dist/esm/global-account/react/hooks/index.js +1 -0
  62. package/dist/esm/global-account/react/hooks/useAccountAssets.js +2 -2
  63. package/dist/esm/global-account/react/hooks/useAuthentication.js +1 -1
  64. package/dist/esm/global-account/react/hooks/useGlobalAccount.d.ts +6 -0
  65. package/dist/esm/global-account/react/hooks/useGlobalAccount.js +29 -0
  66. package/dist/esm/global-account/react/hooks/useQueryB3.js +5 -2
  67. package/dist/esm/global-account/react/hooks/useQueryBSMNT.js +5 -2
  68. package/dist/esm/global-account/react/hooks/useTokenBalancesByChain.js +4 -1
  69. package/dist/esm/global-account/react/hooks/useTokenFromUrl.js +2 -2
  70. package/dist/esm/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +2 -3
  71. package/dist/esm/global-account/react/stores/useModalStore.d.ts +1 -1
  72. package/dist/esm/shared/utils/fetchBalances.d.ts +1 -1
  73. package/dist/styles/index.css +1 -1
  74. package/dist/types/anyspend/react/components/AnySpend.d.ts +1 -0
  75. package/dist/types/anyspend/react/components/AnySpendCustom.d.ts +1 -0
  76. package/dist/types/anyspend/react/components/AnySpendNFT.d.ts +2 -1
  77. package/dist/types/anyspend/react/components/common/PointsBadge.d.ts +7 -0
  78. package/dist/types/anyspend/services/anyspend.d.ts +1 -1
  79. package/dist/types/anyspend/types/api.d.ts +41 -1
  80. package/dist/types/global-account/react/hooks/index.d.ts +1 -0
  81. package/dist/types/global-account/react/hooks/useGlobalAccount.d.ts +6 -0
  82. package/dist/types/global-account/react/stores/useModalStore.d.ts +1 -1
  83. package/dist/types/shared/utils/fetchBalances.d.ts +1 -1
  84. package/package.json +22 -23
  85. package/src/anyspend/react/components/AnySpend.tsx +23 -1
  86. package/src/anyspend/react/components/AnySpendBondKit.tsx +0 -1
  87. package/src/anyspend/react/components/AnySpendBuySpin.tsx +0 -1
  88. package/src/anyspend/react/components/AnySpendCustom.tsx +74 -15
  89. package/src/anyspend/react/components/AnySpendNFT.tsx +3 -0
  90. package/src/anyspend/react/components/AnySpendStakeB3.tsx +0 -1
  91. package/src/anyspend/react/components/AnyspendSignatureMint.tsx +1 -2
  92. package/src/anyspend/react/components/common/CryptoPaySection.tsx +1 -1
  93. package/src/anyspend/react/components/common/CryptoReceiveSection.tsx +6 -8
  94. package/src/anyspend/react/components/common/PanelOnramp.tsx +10 -10
  95. package/src/anyspend/react/components/common/PointsBadge.tsx +20 -0
  96. package/src/anyspend/react/hooks/useAnyspendFlow.ts +5 -3
  97. package/src/anyspend/react/hooks/useAnyspendOrderAndTransactions.ts +1 -1
  98. package/src/anyspend/react/hooks/useCoinbaseOnrampOptions.ts +1 -1
  99. package/src/anyspend/services/anyspend.ts +3 -1
  100. package/src/anyspend/types/api.ts +41 -1
  101. package/src/anyspend/utils/orderPayload.ts +3 -0
  102. package/src/bondkit/components/TradingView.tsx +3 -5
  103. package/src/bondkit/swapService.ts +10 -7
  104. package/src/global-account/react/components/B3Provider/B3Provider.tsx +21 -17
  105. package/src/global-account/react/hooks/index.ts +1 -0
  106. package/src/global-account/react/hooks/useAccountAssets.ts +4 -3
  107. package/src/global-account/react/hooks/useAuthentication.ts +1 -1
  108. package/src/global-account/react/hooks/useGlobalAccount.tsx +36 -0
  109. package/src/global-account/react/hooks/useOneBalance.tsx +1 -1
  110. package/src/global-account/react/hooks/useQueryB3.ts +22 -15
  111. package/src/global-account/react/hooks/useQueryBSMNT.ts +22 -15
  112. package/src/global-account/react/hooks/useTokenBalancesByChain.tsx +4 -1
  113. package/src/global-account/react/hooks/useTokenFromUrl.tsx +2 -2
  114. package/src/global-account/react/hooks/useUnifiedChainSwitchAndExecute.ts +2 -3
  115. package/src/global-account/react/stores/useModalStore.ts +1 -1
  116. package/src/shared/utils/fetchBalances.ts +1 -1
@@ -31,4 +31,5 @@ export declare function AnySpend(props: {
31
31
  onTokenSelect?: (token: components["schemas"]["Token"], event: {
32
32
  preventDefault: () => void;
33
33
  }) => void;
34
+ onSuccess?: (txHash?: string) => void;
34
35
  }): import("react/jsx-runtime").JSX.Element;
@@ -49,7 +49,7 @@ function AnySpend(props) {
49
49
  const fingerprintConfig = (0, AnySpendFingerprintWrapper_1.getFingerprintConfig)();
50
50
  return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: (0, jsx_runtime_1.jsx)(AnySpendInner, { ...props }) }));
51
51
  }
52
- function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode = "modal", defaultActiveTab = "crypto", loadOrder, hideTransactionHistoryButton, recipientAddress: recipientAddressFromProps, onTokenSelect, }) {
52
+ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode = "modal", defaultActiveTab = "crypto", loadOrder, hideTransactionHistoryButton, recipientAddress: recipientAddressFromProps, onTokenSelect, onSuccess, }) {
53
53
  const searchParams = (0, react_2.useSearchParamsSSR)();
54
54
  const router = (0, react_2.useRouter)();
55
55
  // Determine if we're in "buy mode" based on whether destination token props are provided
@@ -57,6 +57,8 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
57
57
  // Add refs to track URL state
58
58
  const initialUrlProcessed = (0, react_4.useRef)(false);
59
59
  const lastUrlUpdate = (0, react_4.useRef)(null);
60
+ // Track if onSuccess has been called for the current order
61
+ const onSuccessCalled = (0, react_4.useRef)(false);
60
62
  const [activeTab, setActiveTab] = (0, react_4.useState)(defaultActiveTab);
61
63
  const [orderId, setOrderId] = (0, react_4.useState)(loadOrder);
62
64
  const { orderAndTransactions: oat, getOrderAndTransactionsError } = (0, react_1.useAnyspendOrderAndTransactions)(orderId);
@@ -328,8 +330,9 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
328
330
  srcTokenAddress: selectedSrcToken.address,
329
331
  dstTokenAddress: isBuyMode ? destinationTokenAddress : selectedDstToken.address,
330
332
  type: "swap",
331
- tradeType: isSrcInputDirty ? "EXACT_INPUT" : "EXPECTED_OUTPUT",
333
+ tradeType: isSrcInputDirty ? "EXACT_INPUT" : "EXACT_OUTPUT",
332
334
  amount: activeInputAmountInWei,
335
+ recipientAddress,
333
336
  }
334
337
  : {
335
338
  srcChain: chains_1.base.id,
@@ -339,6 +342,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
339
342
  type: "swap",
340
343
  tradeType: "EXACT_INPUT",
341
344
  amount: srcAmountOnrampInWei,
345
+ recipientAddress,
342
346
  onrampVendor: getOnrampVendor(selectedFiatPaymentMethod),
343
347
  });
344
348
  // Load custom recipients from local storage on mount
@@ -391,6 +395,18 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
391
395
  }
392
396
  }
393
397
  }, [anyspendQuote, isSrcInputDirty]);
398
+ (0, react_4.useEffect)(() => {
399
+ if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
400
+ console.log("Calling onSuccess");
401
+ const txHash = oat?.data?.executeTx?.txHash;
402
+ onSuccess?.(txHash);
403
+ onSuccessCalled.current = true;
404
+ }
405
+ }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
406
+ // Reset flag when orderId changes
407
+ (0, react_4.useEffect)(() => {
408
+ onSuccessCalled.current = false;
409
+ }, [orderId]);
394
410
  const { createOrder, isCreatingOrder } = (0, react_1.useAnyspendCreateOrder)({
395
411
  onSuccess: data => {
396
412
  const orderId = data.data.id;
@@ -202,7 +202,6 @@ function AnySpendBondKit({ mode = "modal", recipientAddress, contractAddress, mi
202
202
  args: [recipientAddress, (0, viem_1.parseEther)(b3Amount), BigInt(minTokensOut)],
203
203
  });
204
204
  return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { mode: mode, recipientAddress: recipientAddress, orderType: "custom", dstChainId: supported_1.baseMainnet.id, dstToken: dstToken, dstAmount: (0, viem_1.parseEther)(b3Amount).toString(), contractAddress: contractAddress, encodedData: encodedData, metadata: {
205
- type: "custom",
206
205
  action: "BondKit Buy",
207
206
  }, header: header, onSuccess: onSuccess, showRecipient: true }));
208
207
  }
@@ -396,7 +396,6 @@ function AnySpendBuySpin({ loadOrder, mode = "modal", spinwheelContractAddress,
396
396
  // AnySpend flow for when user needs to swap to B3
397
397
  const encodedData = generateEncodedDataForBuyEntriesAndSpin(address || "", userSpinQuantity);
398
398
  return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, orderType: "custom", dstChainId: chainId, dstToken: anyspend_1.B3_TOKEN, dstAmount: totalCost.toString(), contractAddress: spinwheelContractAddress, spenderAddress: paymentConfig.entryModule, encodedData: encodedData, metadata: {
399
- type: "custom",
400
399
  action: `buy ${userSpinQuantity} spin${userSpinQuantity !== "1" ? "s" : ""}`,
401
400
  }, header: header, onSuccess: txHash => onSuccess?.(txHash), showRecipient: false }));
402
401
  }
@@ -20,4 +20,5 @@ export declare function AnySpendCustom(props: {
20
20
  }) => React.JSX.Element;
21
21
  onSuccess?: (txHash?: string) => void;
22
22
  showRecipient?: boolean;
23
+ onShowPointsDetail?: () => void;
23
24
  }): import("react/jsx-runtime").JSX.Element;
@@ -1,4 +1,37 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || (function () {
19
+ var ownKeys = function(o) {
20
+ ownKeys = Object.getOwnPropertyNames || function (o) {
21
+ var ar = [];
22
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
+ return ar;
24
+ };
25
+ return ownKeys(o);
26
+ };
27
+ return function (mod) {
28
+ if (mod && mod.__esModule) return mod;
29
+ var result = {};
30
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
+ __setModuleDefault(result, mod);
32
+ return result;
33
+ };
34
+ })();
2
35
  var __importDefault = (this && this.__importDefault) || function (mod) {
3
36
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
37
  };
@@ -16,15 +49,18 @@ const simplehash_1 = require("../../../shared/utils/simplehash");
16
49
  const invariant_1 = __importDefault(require("invariant"));
17
50
  const lucide_react_1 = require("lucide-react");
18
51
  const react_3 = require("motion/react");
19
- const react_4 = require("react");
52
+ const react_4 = __importStar(require("react"));
20
53
  const sonner_1 = require("sonner");
21
54
  const chains_1 = require("viem/chains");
55
+ const FeatureFlagsContext_1 = require("../contexts/FeatureFlagsContext");
22
56
  const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
23
57
  const CryptoPaymentMethod_1 = require("./common/CryptoPaymentMethod");
24
58
  const FiatPaymentMethod_1 = require("./common/FiatPaymentMethod");
25
59
  const OrderDetails_1 = require("./common/OrderDetails");
26
60
  const OrderHistory_1 = require("./common/OrderHistory");
27
61
  const OrderToken_1 = require("./common/OrderToken");
62
+ const PointsBadge_1 = require("./common/PointsBadge");
63
+ const PointsDetailPanel_1 = require("./common/PointsDetailPanel");
28
64
  const RecipientSelection_1 = require("./common/RecipientSelection");
29
65
  var PanelView;
30
66
  (function (PanelView) {
@@ -35,8 +71,9 @@ var PanelView;
35
71
  PanelView[PanelView["RECIPIENT_SELECTION"] = 4] = "RECIPIENT_SELECTION";
36
72
  PanelView[PanelView["CRYPTO_PAYMENT_METHOD"] = 5] = "CRYPTO_PAYMENT_METHOD";
37
73
  PanelView[PanelView["FIAT_PAYMENT_METHOD"] = 6] = "FIAT_PAYMENT_METHOD";
74
+ PanelView[PanelView["POINTS_DETAIL"] = 7] = "POINTS_DETAIL";
38
75
  })(PanelView || (PanelView = {}));
39
- function generateGetRelayQuoteRequest({ orderType, srcChainId, srcToken, dstChainId, dstToken, dstAmount, contractAddress, tokenId, contractType, encodedData, spenderAddress, }) {
76
+ function generateGetRelayQuoteRequest({ orderType, srcChainId, srcToken, dstChainId, dstToken, recipientAddress, dstAmount, contractAddress, tokenId, contractType, encodedData, spenderAddress, }) {
40
77
  switch (orderType) {
41
78
  case "mint_nft": {
42
79
  (0, invariant_1.default)(contractType, "Contract type is required");
@@ -46,6 +83,7 @@ function generateGetRelayQuoteRequest({ orderType, srcChainId, srcToken, dstChai
46
83
  srcTokenAddress: srcToken.address,
47
84
  dstChain: dstChainId,
48
85
  dstTokenAddress: dstToken.address,
86
+ recipientAddress,
49
87
  price: dstAmount,
50
88
  contractAddress: contractAddress,
51
89
  tokenId: tokenId,
@@ -59,6 +97,7 @@ function generateGetRelayQuoteRequest({ orderType, srcChainId, srcToken, dstChai
59
97
  srcTokenAddress: srcToken.address,
60
98
  dstChain: dstChainId,
61
99
  dstTokenAddress: dstToken.address,
100
+ recipientAddress,
62
101
  price: dstAmount,
63
102
  contractAddress: contractAddress,
64
103
  };
@@ -70,6 +109,7 @@ function generateGetRelayQuoteRequest({ orderType, srcChainId, srcToken, dstChai
70
109
  srcTokenAddress: srcToken.address,
71
110
  dstChain: dstChainId,
72
111
  dstTokenAddress: dstToken.address,
112
+ recipientAddress,
73
113
  fundAmount: dstAmount,
74
114
  contractAddress: contractAddress,
75
115
  };
@@ -81,6 +121,7 @@ function generateGetRelayQuoteRequest({ orderType, srcChainId, srcToken, dstChai
81
121
  srcTokenAddress: srcToken.address,
82
122
  dstChain: dstChainId,
83
123
  dstTokenAddress: dstToken.address,
124
+ recipientAddress,
84
125
  payload: {
85
126
  amount: dstAmount,
86
127
  data: encodedData,
@@ -98,8 +139,9 @@ function AnySpendCustom(props) {
98
139
  const fingerprintConfig = (0, AnySpendFingerprintWrapper_1.getFingerprintConfig)();
99
140
  return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: (0, jsx_runtime_1.jsx)(AnySpendCustomInner, { ...props }) }));
100
141
  }
101
- function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabProps = "crypto", recipientAddress: recipientAddressProps, spenderAddress, orderType, dstChainId, dstToken, dstAmount, contractAddress, encodedData, metadata, header, onSuccess, showRecipient = true, }) {
142
+ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabProps = "crypto", recipientAddress: recipientAddressProps, spenderAddress, orderType, dstChainId, dstToken, dstAmount, contractAddress, encodedData, metadata, header, onSuccess, showRecipient = true, onShowPointsDetail, }) {
102
143
  const hasMounted = (0, react_2.useHasMounted)();
144
+ const featureFlags = (0, FeatureFlagsContext_1.useFeatureFlags)();
103
145
  const searchParams = (0, react_2.useSearchParamsSSR)();
104
146
  const router = (0, react_2.useRouter)();
105
147
  const [activePanel, setActivePanel] = (0, react_4.useState)(loadOrder ? PanelView.ORDER_DETAILS : PanelView.CONFIRM_ORDER);
@@ -114,6 +156,8 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
114
156
  // Update recipient logic to use custom recipient
115
157
  const recipientAddress = customRecipientAddress || currentWallet.address;
116
158
  const [orderId, setOrderId] = (0, react_4.useState)(loadOrder);
159
+ // Track if onSuccess has been called for the current order
160
+ const onSuccessCalled = react_4.default.useRef(false);
117
161
  const [srcChainId, setSrcChainId] = (0, react_4.useState)(chains_1.base.id);
118
162
  // Get token list for token balance check
119
163
  const chainName = (0, react_4.useMemo)(() => (0, simplehash_1.simpleHashChainToChainName)(srcChainId), [srcChainId]);
@@ -174,10 +218,11 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
174
218
  srcToken: activeTab === "fiat" ? constants_1.USDC_BASE : srcToken,
175
219
  dstChainId: dstChainId,
176
220
  dstToken: dstToken,
221
+ recipientAddress,
177
222
  dstAmount: dstAmount,
178
223
  contractAddress: contractAddress,
179
- tokenId: metadata.type === "mint_nft" ? metadata.nftContract.tokenId : undefined,
180
- contractType: metadata.type === "mint_nft" ? metadata.nftContract.type : undefined,
224
+ tokenId: orderType === "mint_nft" ? metadata?.nftContract?.tokenId : undefined,
225
+ contractType: orderType === "mint_nft" ? metadata?.nftContract?.type : undefined,
181
226
  encodedData: encodedData,
182
227
  spenderAddress: spenderAddress,
183
228
  });
@@ -190,8 +235,8 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
190
235
  encodedData,
191
236
  metadata?.nftContract?.tokenId,
192
237
  metadata?.nftContract?.type,
193
- metadata?.type,
194
238
  orderType,
239
+ recipientAddress,
195
240
  spenderAddress,
196
241
  srcChainId,
197
242
  srcToken,
@@ -226,12 +271,17 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
226
271
  // Get geo data and onramp options (after quote is available)
227
272
  const { geoData, isOnrampSupported, coinbaseAvailablePaymentMethods, stripeWeb2Support } = (0, react_1.useGeoOnrampOptions)(srcFiatAmount);
228
273
  (0, react_4.useEffect)(() => {
229
- if (oat?.data?.order.status === "executed") {
274
+ if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
230
275
  console.log("Calling onSuccess");
231
276
  const txHash = oat?.data?.executeTx?.txHash;
232
277
  onSuccess?.(txHash);
278
+ onSuccessCalled.current = true;
233
279
  }
234
- }, [oat?.data?.executeTx?.txHash, oat?.data?.order.status, onSuccess]);
280
+ }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
281
+ // Reset flag when orderId changes
282
+ (0, react_4.useEffect)(() => {
283
+ onSuccessCalled.current = false;
284
+ }, [orderId]);
235
285
  const { createOrder: createRegularOrder, isCreatingOrder: isCreatingRegularOrder } = (0, react_1.useAnyspendCreateOrder)({
236
286
  onSuccess: data => {
237
287
  setOrderId(data.data.id);
@@ -267,7 +317,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
267
317
  srcAmount: srcAmount.toString(),
268
318
  recipientAddress,
269
319
  creatorAddress: currentWallet?.wallet?.address,
270
- nft: metadata.type === "mint_nft"
320
+ nft: orderType === "mint_nft"
271
321
  ? metadata.nftContract.type === "erc1155"
272
322
  ? {
273
323
  type: "erc1155",
@@ -288,7 +338,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
288
338
  imageUrl: metadata.nftContract.imageUrl,
289
339
  }
290
340
  : undefined,
291
- tournament: metadata.type === "join_tournament" || metadata.type === "fund_tournament"
341
+ tournament: orderType === "join_tournament" || orderType === "fund_tournament"
292
342
  ? {
293
343
  ...metadata.tournament,
294
344
  contractAddress: contractAddress,
@@ -296,13 +346,12 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
296
346
  }
297
347
  : undefined,
298
348
  // only populate payload for custom tx
299
- payload: metadata.type === "custom"
349
+ payload: orderType === "custom"
300
350
  ? {
301
351
  amount: dstAmount,
302
352
  data: encodedData,
303
353
  spenderAddress: spenderAddress,
304
354
  to: contractAddress,
305
- action: metadata.action,
306
355
  }
307
356
  : undefined,
308
357
  };
@@ -427,6 +476,16 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
427
476
  router.push(`${window.location.pathname}?${params.toString()}`);
428
477
  } })), mode === "page" && (0, jsx_runtime_1.jsx)("div", { className: "h-12" })] }));
429
478
  const loadingView = ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("mx-auto flex w-full flex-col items-center gap-4 p-5", mode === "modal" && "bg-b3-react-background"), children: [(0, jsx_runtime_1.jsxs)(react_2.Badge, { variant: "default", className: "bg-b3-react-muted/30 border-b3-react-border hover:bg-b3-react-muted/50 flex items-center gap-3 px-4 py-1 text-base transition-all", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "text-b3-react-foreground size-4 animate-spin" }), (0, jsx_runtime_1.jsx)(react_2.TextShimmer, { duration: 1, className: "font-sf-rounded text-base font-semibold", children: "Loading..." })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-1 flex-col", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex flex-col gap-1", children: [(0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-4 w-24" }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-8 w-48" }), (0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "ml-4 h-8 w-32" })] }), (0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "mt-4 h-8 w-24" })] }), (0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "mb-4 h-12 w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between gap-4", children: [(0, jsx_runtime_1.jsxs)(react_2.Skeleton, { className: "rounded-lg bg-white/5 p-6 pb-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "size-[200px]" }), (0, jsx_runtime_1.jsx)("div", { className: "mt-3 flex items-center justify-center gap-2", children: (0, jsx_runtime_1.jsx)("div", { className: "size-5 rounded-full" }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 flex-col gap-2", children: [1, 2, 3].map(i => ((0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-10 w-full" }, i))) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-muted/30 mt-8 w-full rounded-lg p-4", children: [(0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "mb-3 h-4 w-48" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-10 flex-1" }), (0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-10 flex-1" })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex w-full flex-col gap-3", children: [1, 2, 3, 4, 5].map(i => ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full justify-between", children: [(0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-4 w-24" }), (0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-4 w-32" })] }, i))) }), (0, jsx_runtime_1.jsx)(react_2.Skeleton, { className: "h-10 w-full" }), mode === "page" && (0, jsx_runtime_1.jsx)("div", { className: "h-12" })] }));
479
+ // Render points badge if conditions are met
480
+ const renderPointsBadge = () => {
481
+ if (featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0) {
482
+ return ((0, jsx_runtime_1.jsx)(PointsBadge_1.PointsBadge, { pointsAmount: anyspendQuote.data.pointsAmount, pointsMultiplier: anyspendQuote.data.pointsMultiplier, onClick: () => {
483
+ onShowPointsDetail?.();
484
+ setActivePanel(PanelView.POINTS_DETAIL);
485
+ } }));
486
+ }
487
+ return null;
488
+ };
430
489
  // Confirm order view.
431
490
  const confirmOrderView = ((0, jsx_runtime_1.jsxs)("div", { className: "relative mx-auto flex w-full flex-col items-center", children: [header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote }), (0, jsx_runtime_1.jsxs)(react_2.Tabs, { value: activeTab, onValueChange: value => setActiveTab(value), className: "bg-b3-react-background max-h-[60dvh] w-full overflow-y-auto p-5", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-full", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-surface-secondary relative mb-4 grid h-10 grid-cols-2 rounded-xl", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("bg-as-brand absolute bottom-0 left-0 top-0 z-0 rounded-xl transition-transform duration-100", "h-full w-1/2", activeTab === "fiat" ? "translate-x-full" : "translate-x-0"), style: { willChange: "transform" } }), (0, jsx_runtime_1.jsx)("button", { className: (0, utils_1.cn)("relative z-10 h-full w-full rounded-xl px-3 text-sm font-medium transition-colors duration-100", activeTab === "crypto" ? "text-white" : "text-as-primary/70 hover:bg-as-on-surface-2 bg-transparent"), onClick: () => {
432
491
  setActiveTab("crypto");
@@ -451,7 +510,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
451
510
  opacity: hasMounted ? 1 : 0,
452
511
  y: hasMounted ? 0 : 20,
453
512
  filter: hasMounted ? "blur(0px)" : "blur(10px)",
454
- }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["Total ", (0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry", children: "(with fee)" })] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: [formattedSrcAmount || "--", " ", srcToken.symbol] })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex w-full flex-col items-center justify-between gap-2"), children: (0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: false, animate: {
513
+ }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["Total ", (0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry", children: "(with fee)" })] }), renderPointsBadge()] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: [formattedSrcAmount || "--", " ", srcToken.symbol] })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex w-full flex-col items-center justify-between gap-2"), children: (0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: false, animate: {
455
514
  opacity: hasMounted ? 1 : 0,
456
515
  y: hasMounted ? 0 : 20,
457
516
  filter: hasMounted ? "blur(0px)" : "blur(10px)",
@@ -463,7 +522,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
463
522
  opacity: hasMounted ? 1 : 0,
464
523
  y: hasMounted ? 0 : 20,
465
524
  filter: hasMounted ? "blur(0px)" : "blur(10px)",
466
- }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["Total ", (0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry", children: "(USD)" })] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary text-xl font-semibold", children: ["$", srcFiatAmount || "0.00"] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex w-full flex-col items-center justify-between gap-2"), children: (0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: false, animate: {
525
+ }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["Total ", (0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry", children: "(USD)" })] }), renderPointsBadge()] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary text-xl font-semibold", children: ["$", srcFiatAmount || "0.00"] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex w-full flex-col items-center justify-between gap-2"), children: (0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: false, animate: {
467
526
  opacity: hasMounted ? 1 : 0,
468
527
  y: hasMounted ? 0 : 20,
469
528
  filter: hasMounted ? "blur(0px)" : "blur(10px)",
@@ -490,6 +549,8 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
490
549
  setSelectedFiatPaymentMethod(method);
491
550
  setActivePanel(PanelView.CONFIRM_ORDER);
492
551
  }, srcAmountOnRamp: srcFiatAmount }) }));
552
+ // Points detail view
553
+ const pointsDetailView = ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("bg-as-surface-primary mx-auto w-[460px] max-w-full rounded-xl p-4"), children: (0, jsx_runtime_1.jsx)(PointsDetailPanel_1.PointsDetailPanel, { pointsAmount: anyspendQuote?.data?.pointsAmount || 0, onBack: () => setActivePanel(PanelView.CONFIRM_ORDER) }) }));
493
554
  // Return the TransitionPanel with all views
494
555
  return ((0, jsx_runtime_1.jsx)(react_2.StyleRoot, { children: (0, jsx_runtime_1.jsx)(react_2.TransitionPanel, { activeIndex: orderId
495
556
  ? oat
@@ -509,5 +570,6 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
509
570
  (0, jsx_runtime_1.jsx)("div", { className: "w-full", children: recipientSelectionView }, "recipient-selection-view"),
510
571
  (0, jsx_runtime_1.jsx)("div", { className: "w-full", children: cryptoPaymentMethodView }, "crypto-payment-method-view"),
511
572
  (0, jsx_runtime_1.jsx)("div", { className: "w-full", children: fiatPaymentMethodView }, "fiat-payment-method-view"),
573
+ (0, jsx_runtime_1.jsx)("div", { className: "w-full", children: pointsDetailView }, "points-detail-view"),
512
574
  ] }) }));
513
575
  }
@@ -1,8 +1,9 @@
1
1
  import { components } from "../../../anyspend/types/api";
2
- export declare function AnySpendNFT({ loadOrder, mode, recipientAddress, nftContract, onSuccess, }: {
2
+ export declare function AnySpendNFT({ loadOrder, mode, recipientAddress, nftContract, onSuccess, onShowPointsDetail, }: {
3
3
  loadOrder?: string;
4
4
  mode?: "modal" | "page";
5
5
  recipientAddress?: string;
6
6
  nftContract: components["schemas"]["NftContract"];
7
7
  onSuccess?: (txHash?: string) => void;
8
+ onShowPointsDetail?: () => void;
8
9
  }): import("react/jsx-runtime").JSX.Element;
@@ -29,7 +29,7 @@ const CONTRACT_URI_ABI = [
29
29
  type: "function",
30
30
  },
31
31
  ];
32
- function AnySpendNFT({ loadOrder, mode = "modal", recipientAddress, nftContract, onSuccess, }) {
32
+ function AnySpendNFT({ loadOrder, mode = "modal", recipientAddress, nftContract, onSuccess, onShowPointsDetail, }) {
33
33
  const [imageUrlWithFallback, setFallbackImageUrl] = (0, react_3.useState)(nftContract.imageUrl);
34
34
  const [isLoadingFallback, setIsLoadingFallback] = (0, react_3.useState)(false);
35
35
  // Fetch contract metadata when imageUrl is empty
@@ -89,7 +89,7 @@ function AnySpendNFT({ loadOrder, mode = "modal", recipientAddress, nftContract,
89
89
  return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, activeTab: "fiat", recipientAddress: recipientAddress, orderType: "mint_nft", dstChainId: nftContract.chainId, dstToken: nftContract.currency, dstAmount: nftContract.price, contractAddress: nftContract.contractAddress, encodedData: "0x", metadata: {
90
90
  type: "mint_nft",
91
91
  nftContract: nftContract,
92
- }, header: header, onSuccess: onSuccess }));
92
+ }, header: header, onSuccess: onSuccess, onShowPointsDetail: onShowPointsDetail }));
93
93
  }
94
94
  function DropdownMenu({ nftContract }) {
95
95
  const [open, setOpen] = (0, react_3.useState)(false);
@@ -264,7 +264,6 @@ function AnySpendStakeB3({ loadOrder, mode = "modal", recipientAddress, stakeAmo
264
264
  }
265
265
  const encodedData = generateEncodedDataForStakingB3(userStakeAmount, recipientAddress);
266
266
  return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, orderType: "custom", dstChainId: chains_1.base.id, dstToken: anyspend_1.B3_TOKEN, dstAmount: userStakeAmount, contractAddress: ERC20Staking, encodedData: encodedData, metadata: {
267
- type: "custom",
268
267
  action: "stake B3",
269
268
  }, header: header, onSuccess: onSuccess, showRecipient: true }));
270
269
  }
@@ -72,8 +72,7 @@ function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, image
72
72
  }
73
73
  const encodedData = generateEncodedDataForSignatureMint(signatureData);
74
74
  const price = (0, viem_1.parseEther)(signatureData.payload.price?.toString() || "0");
75
- return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, recipientAddress: signatureData.payload.to, orderType: "custom", dstChainId: signatureData.collection.chainId, dstToken: dstToken, dstAmount: price.toString(), contractAddress: signatureData.collection.address, encodedData: encodedData, metadata: {
76
- type: "custom",
75
+ return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, recipientAddress: signatureData.payload.to, orderType: "custom", dstChainId: signatureData.collection.chainId, dstToken: dstToken, dstAmount: price.toString(), contractAddress: signatureData.collection.address || "", encodedData: encodedData, metadata: {
77
76
  action: "Signature Mint",
78
77
  }, header: header, onSuccess: onSuccess, showRecipient: true }));
79
78
  }
@@ -18,7 +18,7 @@ function CryptoPaySection({ selectedSrcChainId, setSelectedSrcChainId, selectedS
18
18
  // Determine which address to use based on payment method
19
19
  const walletAddress = selectedCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.GLOBAL_WALLET
20
20
  ? connectedSmartWallet?.getAccount()?.address
21
- : connectedEOAWallet?.getAccount()?.address || connectedSmartWallet?.getAccount()?.address;
21
+ : connectedEOAWallet?.getAccount()?.address;
22
22
  const { data: profileData } = (0, react_1.useProfile)({ address: walletAddress });
23
23
  const connectedName = profileData?.displayName;
24
24
  // Add ref to track if we've applied metadata
@@ -10,6 +10,7 @@ const lucide_react_1 = require("lucide-react");
10
10
  const react_1 = require("motion/react");
11
11
  const FeatureFlagsContext_1 = require("../../contexts/FeatureFlagsContext");
12
12
  const OrderTokenAmount_1 = require("./OrderTokenAmount");
13
+ const PointsBadge_1 = require("./PointsBadge");
13
14
  function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, onShowPointsDetail, }) {
14
15
  const featureFlags = (0, FeatureFlagsContext_1.useFeatureFlags)();
15
16
  return ((0, jsx_runtime_1.jsxs)(react_1.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "receive-section bg-as-surface-secondary border-as-border-secondary relative flex w-full flex-col gap-2 rounded-2xl border p-4 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/50 flex h-7 items-center text-sm", children: isDepositMode ? "Deposit" : "Receive" }), selectedRecipientAddress ? ((0, jsx_runtime_1.jsx)("button", { className: (0, cn_1.cn)("text-as-tertiarry flex h-7 items-center gap-2 rounded-lg"), onClick: onSelectRecipient, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry flex items-center gap-1 text-sm", children: recipientName ? (0, utils_1.formatUsername)(recipientName) : (0, formatAddress_1.shortenAddress)(selectedRecipientAddress || "") }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] }) })) : ((0, jsx_runtime_1.jsx)("button", { className: "text-as-primary/70 flex items-center gap-1 rounded-lg", onClick: onSelectRecipient, children: (0, jsx_runtime_1.jsx)("div", { className: "text-sm font-medium", children: "Select recipient" }) }))] }), isBuyMode || isDepositMode ? (
@@ -51,5 +52,5 @@ function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, select
51
52
  }
52
53
  // Using inline style to ensure color displays
53
54
  return ((0, jsx_runtime_1.jsxs)("span", { className: "ml-2", style: { color: percentageNum >= 10 ? "red" : "#FFD700" }, children: ["(", isNegative ? "-" : "", percentage, "%)"] }));
54
- })()] }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && ((0, jsx_runtime_1.jsxs)("button", { className: "bg-as-brand hover:scale-102 active:scale-98 active:scale-98 relative flex cursor-pointer items-center gap-1 rounded-lg px-2 py-1 transition-all", onClick: () => onShowPointsDetail?.(), children: [(0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 h-full w-full rounded-lg border border-white/10 border-t-white/20 bg-gradient-to-b from-white/10 to-white/0" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-white", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] })] }, `points-${anyspendQuote.data.pointsAmount}`))] })] }));
55
+ })()] }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount > 0 && ((0, jsx_runtime_1.jsx)(PointsBadge_1.PointsBadge, { pointsAmount: anyspendQuote.data.pointsAmount, pointsMultiplier: anyspendQuote.data.pointsMultiplier, onClick: () => onShowPointsDetail?.() }))] })] }));
55
56
  }
@@ -13,6 +13,7 @@ const sonner_1 = require("sonner");
13
13
  const FeatureFlagsContext_1 = require("../../contexts/FeatureFlagsContext");
14
14
  const FiatPaymentMethod_1 = require("./FiatPaymentMethod");
15
15
  const OrderTokenAmountFiat_1 = require("./OrderTokenAmountFiat");
16
+ const PointsBadge_1 = require("./PointsBadge");
16
17
  function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken = false, anyspendQuote, onShowPointsDetail, }) {
17
18
  const featureFlags = (0, FeatureFlagsContext_1.useFeatureFlags)();
18
19
  // Get geo-based onramp options to access fee information
@@ -78,5 +79,7 @@ function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMetho
78
79
  : "bg-as-surface-secondary hover:bg-as-surface-secondary"}`, children: ["$", value] }, value))) }), destinationToken && destinationChainId && !hideDstToken && ((0, jsx_runtime_1.jsx)(OrderTokenAmountFiat_1.OrderTokenAmountFiat, { address: _recipientAddress, context: "to", inputValue: destinationAmount || "0", onChangeInput: () => { }, chainId: destinationChainId, setChainId: onDestinationChainChange || (() => { }), token: destinationToken, setToken: onDestinationTokenChange || (() => { }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-as-border-secondary bg-as-surface-secondary mt-4 flex w-full flex-col gap-3 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry flex items-center text-sm", children: "Recipient" }), _recipientAddress ? ((0, jsx_runtime_1.jsxs)("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(recipientSelectionPanelIndex), children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm", children: recipientName ? (0, utils_1.formatUsername)(recipientName) : (0, formatAddress_1.formatAddress)(_recipientAddress) }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 })] })) : ((0, jsx_runtime_1.jsxs)("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(5), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "text-as-brand", size: 16 }), "Select recipient", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 })] }))] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry text-sm", children: "Expected to receive" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: [destinationAmount || "0", " ", dstTokenSymbol || destinationToken?.symbol || ""] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["on ", destinationChainId ? chain_1.ALL_CHAINS[destinationChainId]?.name : ""] }), destinationToken && destinationChainId && destinationToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("img", { src: chain_1.ALL_CHAINS[destinationChainId]?.logoUrl, alt: "Chain", className: "h-4 w-4 rounded-full" }))] })] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsx)("div", { className: "", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry text-sm", children: (() => {
79
80
  const fee = getFeeFromApi(selectedPaymentMethod || FiatPaymentMethod_1.FiatPaymentMethod.NONE);
80
81
  return fee !== null ? `Total (included $${fee.toFixed(2)} fee)` : "Total";
81
- })() }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && ((0, jsx_runtime_1.jsxs)("button", { className: "bg-as-brand hover:scale-102 active:scale-98 relative flex cursor-pointer items-center gap-1 rounded-lg px-2 py-1 transition-all", onClick: () => onShowPointsDetail?.(), children: [(0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 h-full w-full rounded-lg border border-white/10 border-t-white/20 bg-gradient-to-b from-white/10 to-white/0" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-white", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] })] }, `points-${anyspendQuote.data.pointsAmount}`))] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: ["$", getTotalAmount(selectedPaymentMethod || FiatPaymentMethod_1.FiatPaymentMethod.NONE).toFixed(2)] })] }) })] })] }));
82
+ })() }), featureFlags.showPoints &&
83
+ anyspendQuote?.data?.pointsAmount &&
84
+ anyspendQuote?.data?.pointsAmount > 0 && ((0, jsx_runtime_1.jsx)(PointsBadge_1.PointsBadge, { pointsAmount: anyspendQuote.data.pointsAmount, pointsMultiplier: anyspendQuote.data.pointsMultiplier, onClick: () => onShowPointsDetail?.() }))] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: ["$", getTotalAmount(selectedPaymentMethod || FiatPaymentMethod_1.FiatPaymentMethod.NONE).toFixed(2)] })] }) })] })] }));
82
85
  }
@@ -0,0 +1,7 @@
1
+ interface PointsBadgeProps {
2
+ pointsAmount: number;
3
+ pointsMultiplier?: number;
4
+ onClick?: () => void;
5
+ }
6
+ export declare function PointsBadge({ pointsAmount, pointsMultiplier, onClick }: PointsBadgeProps): import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.PointsBadge = PointsBadge;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ function PointsBadge({ pointsAmount, pointsMultiplier, onClick }) {
6
+ return ((0, jsx_runtime_1.jsxs)("button", { className: "bg-as-brand hover:scale-102 active:scale-98 relative flex cursor-pointer items-center gap-1 rounded-lg px-2 py-1 transition-all", onClick: onClick, children: [(0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 h-full w-full rounded-lg border border-white/10 border-t-white/20 bg-gradient-to-b from-white/10 to-white/0" }), (0, jsx_runtime_1.jsxs)("span", { className: "relative text-xs text-white", children: ["+", pointsAmount.toLocaleString(), " pts", pointsMultiplier && pointsMultiplier > 1 && (0, jsx_runtime_1.jsxs)("span", { className: "ml-1 opacity-80", children: ["(", pointsMultiplier, "x)"] })] })] }));
7
+ }
@@ -111,15 +111,17 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
111
111
  }
112
112
  };
113
113
  // Get quote
114
- const activeInputAmountInWei = (0, viem_1.parseUnits)(srcAmount.replace(/,/g, ""), selectedSrcToken.decimals).toString();
114
+ // For fiat payments, always use USDC decimals (6) regardless of selectedSrcToken
115
+ const effectiveDecimals = paymentType === "fiat" ? anyspend_1.USDC_BASE.decimals : selectedSrcToken.decimals;
116
+ const activeInputAmountInWei = (0, viem_1.parseUnits)(srcAmount.replace(/,/g, ""), effectiveDecimals).toString();
115
117
  const { anyspendQuote, isLoadingAnyspendQuote, getAnyspendQuoteError } = (0, react_1.useAnyspendQuote)({
116
118
  srcChain: paymentType === "fiat" ? chains_1.base.id : selectedSrcChainId,
117
119
  dstChain: isDepositMode ? chains_1.base.id : selectedDstChainId, // For deposits, always Base; for swaps, use selected destination
118
120
  srcTokenAddress: paymentType === "fiat" ? anyspend_1.USDC_BASE.address : selectedSrcToken.address,
119
121
  dstTokenAddress: isDepositMode ? anyspend_1.B3_TOKEN.address : selectedSrcToken.address, // For deposits, always B3
120
- type: "swap",
121
- tradeType: "EXACT_INPUT",
122
+ type: "hype_duel",
122
123
  amount: activeInputAmountInWei,
124
+ recipientAddress: selectedRecipientAddress,
123
125
  onrampVendor: paymentType === "fiat" ? getOnrampVendor(selectedFiatPaymentMethod) : undefined,
124
126
  });
125
127
  // Get geo options for fiat
@@ -28,7 +28,7 @@ export declare const anyspendService: {
28
28
  }>;
29
29
  getOrderAndTransactions: (orderId: string | undefined) => Promise<GetOrderAndTxsResponse>;
30
30
  getOrderHistory: (creatorAddress: string | undefined, limit?: number, offset?: number) => Promise<GetOrderHistoryResponse>;
31
- getCoinbaseOnrampOptions: (country: string, visitorData?: VisitorData) => Promise<GetCoinbaseOnrampOptionsResponse>;
31
+ getCoinbaseOnrampOptions: (country: string | undefined, visitorData?: VisitorData) => Promise<GetCoinbaseOnrampOptionsResponse>;
32
32
  checkStripeSupport: (usdAmount?: string, visitorData?: VisitorData) => Promise<{
33
33
  stripeOnramp: boolean;
34
34
  stripeWeb2: components["schemas"]["StripeWeb2Support"];
@@ -69,6 +69,7 @@ exports.anyspendService = {
69
69
  return data;
70
70
  },
71
71
  getOrderAndTransactions: async (orderId) => {
72
+ (0, invariant_1.default)(orderId, "orderId is required");
72
73
  const response = await fetch(`${constants_1.ANYSPEND_MAINNET_BASE_URL}/orders/${orderId}`);
73
74
  const data = await response.json();
74
75
  return data;
@@ -86,6 +87,7 @@ exports.anyspendService = {
86
87
  return data;
87
88
  },
88
89
  getCoinbaseOnrampOptions: async (country, visitorData) => {
90
+ (0, invariant_1.default)(country, "country is required");
89
91
  const params = new URLSearchParams({
90
92
  country,
91
93
  // include fingerprintId and requestId in the query params
@@ -503,11 +503,16 @@ export interface paths {
503
503
  * @example 0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913
504
504
  */
505
505
  dstTokenAddress: string;
506
+ /**
507
+ * @description Recipient address
508
+ * @example 0x55c71fca5e01cf246718748ae540473e608d0282
509
+ */
510
+ recipientAddress?: string;
506
511
  /**
507
512
  * @description Type of trade execution
508
513
  * @enum {string}
509
514
  */
510
- tradeType: "EXACT_INPUT" | "EXPECTED_OUTPUT" | "EXACT_OUTPUT";
515
+ tradeType: "EXACT_INPUT" | "EXACT_OUTPUT";
511
516
  /**
512
517
  * @description Amount to quote
513
518
  * @example 1000000000000000000
@@ -544,6 +549,11 @@ export interface paths {
544
549
  * @example 0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913
545
550
  */
546
551
  dstTokenAddress: string;
552
+ /**
553
+ * @description Recipient address
554
+ * @example 0x55c71fca5e01cf246718748ae540473e608d0282
555
+ */
556
+ recipientAddress?: string;
547
557
  /** @description Custom payload for execution */
548
558
  payload: {
549
559
  /** @description Encoded transaction data */
@@ -567,6 +577,11 @@ export interface paths {
567
577
  dstChain: number;
568
578
  srcTokenAddress: string;
569
579
  dstTokenAddress: string;
580
+ /**
581
+ * @description Recipient address
582
+ * @example 0x55c71fca5e01cf246718748ae540473e608d0282
583
+ */
584
+ recipientAddress?: string;
570
585
  /** @enum {string} */
571
586
  onrampVendor?: "coinbase" | "stripe" | "stripe-web2";
572
587
  contractAddress: string;
@@ -581,6 +596,11 @@ export interface paths {
581
596
  dstChain: number;
582
597
  srcTokenAddress: string;
583
598
  dstTokenAddress: string;
599
+ /**
600
+ * @description Recipient address
601
+ * @example 0x55c71fca5e01cf246718748ae540473e608d0282
602
+ */
603
+ recipientAddress?: string;
584
604
  /** @enum {string} */
585
605
  onrampVendor?: "coinbase" | "stripe" | "stripe-web2";
586
606
  contractAddress: string;
@@ -592,6 +612,11 @@ export interface paths {
592
612
  dstChain: number;
593
613
  srcTokenAddress: string;
594
614
  dstTokenAddress: string;
615
+ /**
616
+ * @description Recipient address
617
+ * @example 0x55c71fca5e01cf246718748ae540473e608d0282
618
+ */
619
+ recipientAddress?: string;
595
620
  /** @enum {string} */
596
621
  onrampVendor?: "coinbase" | "stripe" | "stripe-web2";
597
622
  contractAddress: string;
@@ -622,6 +647,11 @@ export interface paths {
622
647
  * @example 0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913
623
648
  */
624
649
  dstTokenAddress: string;
650
+ /**
651
+ * @description Recipient address
652
+ * @example 0x55c71fca5e01cf246718748ae540473e608d0282
653
+ */
654
+ recipientAddress?: string;
625
655
  /**
626
656
  * @description Amount to quote
627
657
  * @example 1000000000000000000
@@ -1087,6 +1117,11 @@ export interface components {
1087
1117
  * @example 990000
1088
1118
  */
1089
1119
  actualDstAmount: string | null;
1120
+ /**
1121
+ * @description Amount in after fee
1122
+ * @example 990000
1123
+ */
1124
+ amountInAfterFee: string | null;
1090
1125
  };
1091
1126
  /** @description HypeDuel-specific payload */
1092
1127
  HypeDuelPayload: {
@@ -1100,6 +1135,11 @@ export interface components {
1100
1135
  * @example 990000
1101
1136
  */
1102
1137
  actualDstAmount: string | null;
1138
+ /**
1139
+ * @description Amount in after fee
1140
+ * @example 990000
1141
+ */
1142
+ amountInAfterFee: string | null;
1103
1143
  };
1104
1144
  /** @description Custom execution payload */
1105
1145
  CustomPayload: {