@b3dotfun/sdk 0.1.65 → 0.1.66-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 (122) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpend.d.ts +2 -0
  2. package/dist/cjs/anyspend/react/components/AnySpend.js +7 -16
  3. package/dist/cjs/anyspend/react/components/AnySpendCollectorClubPurchase.d.ts +6 -1
  4. package/dist/cjs/anyspend/react/components/AnySpendCollectorClubPurchase.js +151 -22
  5. package/dist/cjs/anyspend/react/components/AnySpendCustom.js +4 -50
  6. package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.d.ts +2 -0
  7. package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.js +4 -2
  8. package/dist/cjs/anyspend/react/components/AnySpendDeposit.d.ts +3 -1
  9. package/dist/cjs/anyspend/react/components/AnySpendDeposit.js +2 -2
  10. package/dist/cjs/anyspend/react/components/AnySpendWorkflowTrigger.d.ts +31 -0
  11. package/dist/cjs/anyspend/react/components/AnySpendWorkflowTrigger.js +14 -0
  12. package/dist/cjs/anyspend/react/components/QRDeposit.js +5 -13
  13. package/dist/cjs/anyspend/react/components/ccShopAbi.d.ts +113 -0
  14. package/dist/cjs/anyspend/react/components/ccShopAbi.js +63 -0
  15. package/dist/cjs/anyspend/react/components/common/CryptoPaySection.d.ts +1 -3
  16. package/dist/cjs/anyspend/react/components/common/CryptoPaySection.js +3 -3
  17. package/dist/cjs/anyspend/react/components/common/OrderTokenAmount.d.ts +1 -4
  18. package/dist/cjs/anyspend/react/components/common/OrderTokenAmount.js +3 -57
  19. package/dist/cjs/anyspend/react/components/common/PaySection.js +1 -1
  20. package/dist/cjs/anyspend/react/components/index.d.ts +2 -0
  21. package/dist/cjs/anyspend/react/components/index.js +3 -1
  22. package/dist/cjs/anyspend/react/hooks/index.d.ts +1 -0
  23. package/dist/cjs/anyspend/react/hooks/index.js +1 -0
  24. package/dist/cjs/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js +1 -0
  25. package/dist/cjs/anyspend/react/hooks/useAnyspendCreateOrder.d.ts +1 -0
  26. package/dist/cjs/anyspend/react/hooks/useAnyspendCreateOrder.js +1 -0
  27. package/dist/cjs/anyspend/react/hooks/useOnOrderSuccess.d.ts +10 -0
  28. package/dist/cjs/anyspend/react/hooks/useOnOrderSuccess.js +27 -0
  29. package/dist/cjs/anyspend/services/anyspend.d.ts +2 -1
  30. package/dist/cjs/anyspend/services/anyspend.js +2 -1
  31. package/dist/cjs/anyspend/utils/chain.d.ts +1 -1
  32. package/dist/cjs/anyspend/utils/chain.js +72 -62
  33. package/dist/cjs/app.shared.js +8 -0
  34. package/dist/cjs/global-account/react/components/B3DynamicModal.js +4 -0
  35. package/dist/cjs/global-account/react/hooks/useFirstEOA.d.ts +4 -4
  36. package/dist/cjs/global-account/react/hooks/useUserQuery.js +10 -0
  37. package/dist/cjs/global-account/react/stores/useModalStore.d.ts +37 -1
  38. package/dist/cjs/global-account/react/stores/userStore.js +1 -0
  39. package/dist/esm/anyspend/react/components/AnySpend.d.ts +2 -0
  40. package/dist/esm/anyspend/react/components/AnySpend.js +7 -16
  41. package/dist/esm/anyspend/react/components/AnySpendCollectorClubPurchase.d.ts +6 -1
  42. package/dist/esm/anyspend/react/components/AnySpendCollectorClubPurchase.js +152 -23
  43. package/dist/esm/anyspend/react/components/AnySpendCustom.js +4 -17
  44. package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.d.ts +2 -0
  45. package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.js +4 -2
  46. package/dist/esm/anyspend/react/components/AnySpendDeposit.d.ts +3 -1
  47. package/dist/esm/anyspend/react/components/AnySpendDeposit.js +2 -2
  48. package/dist/esm/anyspend/react/components/AnySpendWorkflowTrigger.d.ts +31 -0
  49. package/dist/esm/anyspend/react/components/AnySpendWorkflowTrigger.js +11 -0
  50. package/dist/esm/anyspend/react/components/QRDeposit.js +6 -14
  51. package/dist/esm/anyspend/react/components/ccShopAbi.d.ts +113 -0
  52. package/dist/esm/anyspend/react/components/ccShopAbi.js +60 -0
  53. package/dist/esm/anyspend/react/components/common/CryptoPaySection.d.ts +1 -3
  54. package/dist/esm/anyspend/react/components/common/CryptoPaySection.js +3 -3
  55. package/dist/esm/anyspend/react/components/common/OrderTokenAmount.d.ts +1 -4
  56. package/dist/esm/anyspend/react/components/common/OrderTokenAmount.js +2 -56
  57. package/dist/esm/anyspend/react/components/common/PaySection.js +1 -1
  58. package/dist/esm/anyspend/react/components/index.d.ts +2 -0
  59. package/dist/esm/anyspend/react/components/index.js +1 -0
  60. package/dist/esm/anyspend/react/hooks/index.d.ts +1 -0
  61. package/dist/esm/anyspend/react/hooks/index.js +1 -0
  62. package/dist/esm/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js +1 -0
  63. package/dist/esm/anyspend/react/hooks/useAnyspendCreateOrder.d.ts +1 -0
  64. package/dist/esm/anyspend/react/hooks/useAnyspendCreateOrder.js +1 -0
  65. package/dist/esm/anyspend/react/hooks/useOnOrderSuccess.d.ts +10 -0
  66. package/dist/esm/anyspend/react/hooks/useOnOrderSuccess.js +24 -0
  67. package/dist/esm/anyspend/services/anyspend.d.ts +2 -1
  68. package/dist/esm/anyspend/services/anyspend.js +2 -1
  69. package/dist/esm/anyspend/utils/chain.d.ts +1 -1
  70. package/dist/esm/anyspend/utils/chain.js +72 -62
  71. package/dist/esm/app.shared.js +8 -0
  72. package/dist/esm/global-account/react/components/B3DynamicModal.js +4 -0
  73. package/dist/esm/global-account/react/hooks/useFirstEOA.d.ts +4 -4
  74. package/dist/esm/global-account/react/hooks/useUserQuery.js +11 -1
  75. package/dist/esm/global-account/react/stores/useModalStore.d.ts +37 -1
  76. package/dist/esm/global-account/react/stores/userStore.js +1 -0
  77. package/dist/types/anyspend/react/components/AnySpend.d.ts +2 -0
  78. package/dist/types/anyspend/react/components/AnySpendCollectorClubPurchase.d.ts +6 -1
  79. package/dist/types/anyspend/react/components/AnySpendCustomExactIn.d.ts +2 -0
  80. package/dist/types/anyspend/react/components/AnySpendDeposit.d.ts +3 -1
  81. package/dist/types/anyspend/react/components/AnySpendWorkflowTrigger.d.ts +31 -0
  82. package/dist/types/anyspend/react/components/ccShopAbi.d.ts +113 -0
  83. package/dist/types/anyspend/react/components/common/CryptoPaySection.d.ts +1 -3
  84. package/dist/types/anyspend/react/components/common/OrderTokenAmount.d.ts +1 -4
  85. package/dist/types/anyspend/react/components/index.d.ts +2 -0
  86. package/dist/types/anyspend/react/hooks/index.d.ts +1 -0
  87. package/dist/types/anyspend/react/hooks/useAnyspendCreateOrder.d.ts +1 -0
  88. package/dist/types/anyspend/react/hooks/useOnOrderSuccess.d.ts +10 -0
  89. package/dist/types/anyspend/services/anyspend.d.ts +2 -1
  90. package/dist/types/anyspend/utils/chain.d.ts +1 -1
  91. package/dist/types/global-account/react/hooks/useFirstEOA.d.ts +4 -4
  92. package/dist/types/global-account/react/stores/useModalStore.d.ts +37 -1
  93. package/package.json +1 -1
  94. package/src/anyspend/README.md +14 -0
  95. package/src/anyspend/docs/checkout-sessions.md +228 -0
  96. package/src/anyspend/docs/components.md +26 -0
  97. package/src/anyspend/docs/examples.md +58 -0
  98. package/src/anyspend/docs/hooks.md +32 -0
  99. package/src/anyspend/llms.txt +185 -0
  100. package/src/anyspend/react/components/AnySpend.tsx +9 -17
  101. package/src/anyspend/react/components/AnySpendCollectorClubPurchase.tsx +206 -22
  102. package/src/anyspend/react/components/AnySpendCustom.tsx +3 -18
  103. package/src/anyspend/react/components/AnySpendCustomExactIn.tsx +5 -1
  104. package/src/anyspend/react/components/AnySpendDeposit.tsx +5 -0
  105. package/src/anyspend/react/components/AnySpendWorkflowTrigger.tsx +73 -0
  106. package/src/anyspend/react/components/QRDeposit.tsx +19 -15
  107. package/src/anyspend/react/components/ccShopAbi.ts +64 -0
  108. package/src/anyspend/react/components/common/CryptoPaySection.tsx +0 -5
  109. package/src/anyspend/react/components/common/OrderTokenAmount.tsx +1 -70
  110. package/src/anyspend/react/components/common/PaySection.tsx +0 -1
  111. package/src/anyspend/react/components/index.ts +2 -0
  112. package/src/anyspend/react/hooks/index.ts +1 -0
  113. package/src/anyspend/react/hooks/useAnyspendCreateOnrampOrder.ts +1 -0
  114. package/src/anyspend/react/hooks/useAnyspendCreateOrder.ts +2 -0
  115. package/src/anyspend/react/hooks/useOnOrderSuccess.ts +36 -0
  116. package/src/anyspend/services/anyspend.ts +3 -0
  117. package/src/anyspend/utils/chain.ts +81 -65
  118. package/src/app.shared.ts +11 -0
  119. package/src/global-account/react/components/B3DynamicModal.tsx +4 -0
  120. package/src/global-account/react/hooks/useUserQuery.ts +12 -1
  121. package/src/global-account/react/stores/useModalStore.ts +39 -2
  122. package/src/global-account/react/stores/userStore.ts +1 -0
@@ -26,27 +26,22 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
26
26
  * ```
27
27
  */
28
28
  import { USDC_BASE } from "../../../anyspend/constants/index.js";
29
+ import { PUBLIC_BASE_RPC_URL } from "../../../shared/constants/index.js";
29
30
  import { formatUnits } from "../../../shared/utils/number.js";
30
- import { useMemo } from "react";
31
- import { encodeFunctionData } from "viem";
31
+ import { useEffect, useMemo, useState } from "react";
32
+ import { createPublicClient, encodeFunctionData, http } from "viem";
33
+ import { base } from "viem/chains";
32
34
  import { AnySpendCustom } from "./AnySpendCustom.js";
35
+ import { BUY_PACKS_FOR_ABI, BUY_PACKS_FOR_WITH_DISCOUNT_ABI, GET_DISCOUNT_CODE_ABI, IS_DISCOUNT_CODE_VALID_FOR_PACK_ABI, } from "./ccShopAbi.js";
33
36
  // Collector Club Shop contract addresses on Base
34
37
  const CC_SHOP_ADDRESS = "0x47366E64E4917dd4DdC04Fb9DC507c1dD2b87294";
35
38
  const CC_SHOP_ADDRESS_STAGING = "0x8b751143342ac41eB965E55430e3F7Adf6BE01fA";
36
39
  const BASE_CHAIN_ID = 8453;
37
- // ABI for buyPacksFor function only
38
- const BUY_PACKS_FOR_ABI = {
39
- inputs: [
40
- { internalType: "address", name: "user", type: "address" },
41
- { internalType: "uint256", name: "packId", type: "uint256" },
42
- { internalType: "uint256", name: "amount", type: "uint256" },
43
- ],
44
- name: "buyPacksFor",
45
- outputs: [],
46
- stateMutability: "nonpayable",
47
- type: "function",
48
- };
49
- export function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activeTab = "crypto", packId, packAmount, pricePerPack, paymentToken = USDC_BASE, recipientAddress, spenderAddress, isStaging = false, onSuccess, header, showRecipient = true, vendingMachineId, packType, forceFiatPayment, }) {
40
+ const basePublicClient = createPublicClient({
41
+ chain: base,
42
+ transport: http(PUBLIC_BASE_RPC_URL),
43
+ });
44
+ export function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activeTab = "crypto", packId, packAmount, pricePerPack, paymentToken = USDC_BASE, recipientAddress, spenderAddress, isStaging = false, onSuccess, header, showRecipient = true, vendingMachineId, packType, forceFiatPayment, discountCode, }) {
50
45
  const ccShopAddress = isStaging ? CC_SHOP_ADDRESS_STAGING : CC_SHOP_ADDRESS;
51
46
  // Calculate total amount needed (pricePerPack * packAmount)
52
47
  const totalAmount = useMemo(() => {
@@ -58,15 +53,130 @@ export function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activ
58
53
  return "0";
59
54
  }
60
55
  }, [pricePerPack, packAmount]);
61
- // Calculate fiat amount (totalAmount in USD, assuming USDC with 6 decimals)
56
+ // Discount code validation state
57
+ const [discountInfo, setDiscountInfo] = useState({
58
+ isValid: false,
59
+ discountAmount: BigInt(0),
60
+ minPurchaseAmount: BigInt(0),
61
+ isLoading: false,
62
+ error: null,
63
+ });
64
+ // Validate discount code on-chain when provided
65
+ useEffect(() => {
66
+ if (!discountCode) {
67
+ setDiscountInfo({
68
+ isValid: false,
69
+ discountAmount: BigInt(0),
70
+ minPurchaseAmount: BigInt(0),
71
+ isLoading: false,
72
+ error: null,
73
+ });
74
+ return;
75
+ }
76
+ let cancelled = false;
77
+ const validateDiscount = async () => {
78
+ setDiscountInfo(prev => ({ ...prev, isLoading: true, error: null }));
79
+ try {
80
+ // Validate against specific pack and fetch full details in parallel
81
+ const [validForPack, codeDetails] = await Promise.all([
82
+ basePublicClient.readContract({
83
+ address: ccShopAddress,
84
+ abi: [IS_DISCOUNT_CODE_VALID_FOR_PACK_ABI],
85
+ functionName: "isDiscountCodeValidForPack",
86
+ args: [discountCode, BigInt(packId)],
87
+ }),
88
+ basePublicClient.readContract({
89
+ address: ccShopAddress,
90
+ abi: [GET_DISCOUNT_CODE_ABI],
91
+ functionName: "getDiscountCode",
92
+ args: [discountCode],
93
+ }),
94
+ ]);
95
+ if (cancelled)
96
+ return;
97
+ const [isValid, discountAmount] = validForPack;
98
+ const { minPurchaseAmount, packId: restrictedPackId, exists } = codeDetails;
99
+ if (!exists) {
100
+ setDiscountInfo({
101
+ isValid: false,
102
+ discountAmount: BigInt(0),
103
+ minPurchaseAmount: BigInt(0),
104
+ isLoading: false,
105
+ error: "Discount code does not exist",
106
+ });
107
+ return;
108
+ }
109
+ if (!isValid) {
110
+ // Provide specific error based on code details
111
+ if (restrictedPackId !== BigInt(0) && restrictedPackId !== BigInt(packId)) {
112
+ setDiscountInfo({
113
+ isValid: false,
114
+ discountAmount: BigInt(0),
115
+ minPurchaseAmount: BigInt(0),
116
+ isLoading: false,
117
+ error: "Discount code is not valid for this pack",
118
+ });
119
+ }
120
+ else {
121
+ setDiscountInfo({
122
+ isValid: false,
123
+ discountAmount: BigInt(0),
124
+ minPurchaseAmount: BigInt(0),
125
+ isLoading: false,
126
+ error: "Invalid or expired discount code",
127
+ });
128
+ }
129
+ return;
130
+ }
131
+ setDiscountInfo({ isValid: true, discountAmount, minPurchaseAmount, isLoading: false, error: null });
132
+ }
133
+ catch (error) {
134
+ if (cancelled)
135
+ return;
136
+ console.error("Failed to validate discount code", { discountCode, error });
137
+ setDiscountInfo({
138
+ isValid: false,
139
+ discountAmount: BigInt(0),
140
+ minPurchaseAmount: BigInt(0),
141
+ isLoading: false,
142
+ error: "Failed to validate discount code",
143
+ });
144
+ }
145
+ };
146
+ validateDiscount();
147
+ return () => {
148
+ cancelled = true;
149
+ };
150
+ }, [discountCode, ccShopAddress, packId]);
151
+ // Calculate effective dstAmount after discount
152
+ const effectiveDstAmount = useMemo(() => {
153
+ if (!discountCode || !discountInfo.isValid || discountInfo.discountAmount === BigInt(0)) {
154
+ return totalAmount;
155
+ }
156
+ const total = BigInt(totalAmount);
157
+ const discount = discountInfo.discountAmount;
158
+ if (discount >= total) {
159
+ console.error("Discount exceeds total price", { totalAmount, discountAmount: discount.toString() });
160
+ return "0";
161
+ }
162
+ return (total - discount).toString();
163
+ }, [totalAmount, discountCode, discountInfo.isValid, discountInfo.discountAmount]);
164
+ // Calculate fiat amount (effectiveDstAmount in USD, assuming USDC with 6 decimals)
62
165
  const srcFiatAmount = useMemo(() => {
63
- if (!totalAmount || totalAmount === "0")
166
+ if (!effectiveDstAmount || effectiveDstAmount === "0")
64
167
  return "0";
65
- return formatUnits(totalAmount, USDC_BASE.decimals);
66
- }, [totalAmount]);
67
- // Encode the buyPacksFor function call
168
+ return formatUnits(effectiveDstAmount, USDC_BASE.decimals);
169
+ }, [effectiveDstAmount]);
170
+ // Encode the contract function call (with or without discount)
68
171
  const encodedData = useMemo(() => {
69
172
  try {
173
+ if (discountCode && discountInfo.isValid) {
174
+ return encodeFunctionData({
175
+ abi: [BUY_PACKS_FOR_WITH_DISCOUNT_ABI],
176
+ functionName: "buyPacksForWithDiscount",
177
+ args: [recipientAddress, BigInt(packId), BigInt(packAmount), discountCode],
178
+ });
179
+ }
70
180
  return encodeFunctionData({
71
181
  abi: [BUY_PACKS_FOR_ABI],
72
182
  functionName: "buyPacksFor",
@@ -74,17 +184,36 @@ export function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activ
74
184
  });
75
185
  }
76
186
  catch (error) {
77
- console.error("Failed to encode function data", { recipientAddress, packId, packAmount, error });
187
+ console.error("Failed to encode function data", { recipientAddress, packId, packAmount, discountCode, error });
78
188
  return "0x";
79
189
  }
80
- }, [recipientAddress, packId, packAmount]);
190
+ }, [recipientAddress, packId, packAmount, discountCode, discountInfo.isValid]);
81
191
  // Default header if not provided
82
192
  const defaultHeader = () => (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsxs("div", { children: [_jsx("h1", { className: "text-as-primary text-xl font-bold", children: "Buy Collector Club Packs" }), _jsxs("p", { className: "text-as-secondary text-sm", children: ["Purchase ", packAmount, " pack", packAmount !== 1 ? "s" : "", " using any token"] })] }) }));
83
- return (_jsx(AnySpendCustom, { loadOrder: loadOrder, mode: mode, activeTab: activeTab, recipientAddress: recipientAddress, spenderAddress: spenderAddress ?? ccShopAddress, orderType: "custom", dstChainId: BASE_CHAIN_ID, dstToken: paymentToken, dstAmount: totalAmount, contractAddress: ccShopAddress, encodedData: encodedData, metadata: {
193
+ // Don't render AnySpendCustom while discount is being validated (avoids showing wrong price)
194
+ if (discountCode && discountInfo.isLoading) {
195
+ return (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsx("p", { className: "text-as-secondary text-sm", children: "Validating discount code..." }) }));
196
+ }
197
+ if (discountCode && discountInfo.error) {
198
+ return (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsx("p", { className: "text-sm text-red-500", children: discountInfo.error }) }));
199
+ }
200
+ if (discountCode &&
201
+ discountInfo.isValid &&
202
+ discountInfo.minPurchaseAmount > BigInt(0) &&
203
+ BigInt(packAmount) < discountInfo.minPurchaseAmount) {
204
+ return (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsxs("p", { className: "text-sm text-red-500", children: ["Minimum purchase of ", discountInfo.minPurchaseAmount.toString(), " pack", discountInfo.minPurchaseAmount > BigInt(1) ? "s" : "", " required for this discount code"] }) }));
205
+ }
206
+ if (discountCode && discountInfo.isValid && effectiveDstAmount === "0") {
207
+ return (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsx("p", { className: "text-sm text-red-500", children: "Discount exceeds total price" }) }));
208
+ }
209
+ return (_jsx(AnySpendCustom, { loadOrder: loadOrder, mode: mode, activeTab: activeTab, recipientAddress: recipientAddress, spenderAddress: spenderAddress ?? ccShopAddress, orderType: "custom", dstChainId: BASE_CHAIN_ID, dstToken: paymentToken, dstAmount: effectiveDstAmount, contractAddress: ccShopAddress, encodedData: encodedData, metadata: {
84
210
  packId,
85
211
  packAmount,
86
212
  pricePerPack,
87
213
  vendingMachineId,
88
214
  packType,
215
+ ...(discountCode && discountInfo.isValid
216
+ ? { discountCode, discountAmount: discountInfo.discountAmount.toString() }
217
+ : {}),
89
218
  }, header: header || defaultHeader, onSuccess: onSuccess, showRecipient: showRecipient, srcFiatAmount: srcFiatAmount, forceFiatPayment: forceFiatPayment }));
90
219
  }
@@ -11,9 +11,10 @@ import { simpleHashChainToChainName } from "../../../shared/utils/simplehash.js"
11
11
  import invariant from "invariant";
12
12
  import { ChevronRight, ChevronRightCircle, Info, Loader2 } from "lucide-react";
13
13
  import { motion } from "motion/react";
14
- import React, { useCallback, useEffect, useMemo, useState } from "react";
14
+ import { useCallback, useEffect, useMemo, useState } from "react";
15
15
  import { base } from "viem/chains";
16
16
  import { useCryptoPaymentMethodState } from "../hooks/useCryptoPaymentMethodState.js";
17
+ import { useOnOrderSuccess } from "../hooks/useOnOrderSuccess.js";
17
18
  import { useRecipientAddressState } from "../hooks/useRecipientAddressState.js";
18
19
  import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper.js";
19
20
  import { CryptoPaymentMethod, CryptoPaymentMethodType } from "./common/CryptoPaymentMethod.js";
@@ -126,8 +127,6 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
126
127
  globalAddress: currentWallet.address,
127
128
  });
128
129
  const [orderId, setOrderId] = useState(loadOrder);
129
- // Track if onSuccess has been called for the current order
130
- const onSuccessCalled = React.useRef(false);
131
130
  const [srcChainId, setSrcChainId] = useState(base.id);
132
131
  // Get token list for token balance check
133
132
  const chainName = useMemo(() => simpleHashChainToChainName(srcChainId), [srcChainId]);
@@ -265,20 +264,8 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
265
264
  }, [activeTab, srcFiatAmountForGeoCheck]);
266
265
  // Get geo data and onramp options (use srcFiatAmountForGeoCheck to check availability regardless of activeTab)
267
266
  const { geoData, isOnrampSupported, coinbaseAvailablePaymentMethods, stripeOnrampSupport, stripeWeb2Support } = useGeoOnrampOptions(srcFiatAmountForGeoCheck);
268
- useEffect(() => {
269
- if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
270
- console.log("Calling onSuccess");
271
- const relayTxs = oat?.data?.relayTxs;
272
- const lastRelayTxHash = relayTxs?.[relayTxs.length - 1]?.txHash;
273
- const txHash = oat?.data?.executeTx?.txHash || lastRelayTxHash;
274
- onSuccess?.(txHash);
275
- onSuccessCalled.current = true;
276
- }
277
- }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, oat?.data?.relayTxs, onSuccess]);
278
- // Reset flag when orderId changes
279
- useEffect(() => {
280
- onSuccessCalled.current = false;
281
- }, [orderId]);
267
+ // Call onSuccess when order is executed
268
+ useOnOrderSuccess({ orderData: oat, orderId, onSuccess });
282
269
  const { createOrder: createRegularOrder, isCreatingOrder: isCreatingRegularOrder } = useAnyspendCreateOrder({
283
270
  onSuccess: data => {
284
271
  setOrderId(data.data.id);
@@ -44,6 +44,8 @@ export interface AnySpendCustomExactInProps {
44
44
  classes?: AnySpendCustomExactInClasses;
45
45
  /** When true, allows direct transfer without swap if source and destination token/chain are the same */
46
46
  allowDirectTransfer?: boolean;
47
+ /** Opaque metadata passed to the order for callbacks (e.g., workflow form data) */
48
+ callbackMetadata?: Record<string, unknown>;
47
49
  }
48
50
  export declare function AnySpendCustomExactIn(props: AnySpendCustomExactInProps): import("react/jsx-runtime").JSX.Element;
49
51
  export {};
@@ -29,7 +29,7 @@ export function AnySpendCustomExactIn(props) {
29
29
  const fingerprintConfig = getFingerprintConfig();
30
30
  return (_jsx(AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: _jsx(AnySpendCustomExactInInner, { ...props }) }));
31
31
  }
32
- function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, destinationTokenAmount, orderType = "custom_exact_in", minDestinationAmount, header, returnToHomeUrl, customRecipientLabel, returnHomeLabel, classes, allowDirectTransfer = false, }) {
32
+ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, destinationTokenAmount, orderType = "custom_exact_in", minDestinationAmount, header, returnToHomeUrl, customRecipientLabel, returnHomeLabel, classes, allowDirectTransfer = false, callbackMetadata, }) {
33
33
  const actionLabel = customExactInConfig?.action ?? "Custom Execution";
34
34
  const setB3ModalOpen = useModalStore(state => state.setB3ModalOpen);
35
35
  const DESTINATION_TOKEN_DETAILS = {
@@ -222,7 +222,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
222
222
  };
223
223
  const headerContent = header ? (header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote })) : (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsxs("div", { children: [_jsx("h1", { className: "text-as-primary text-xl font-bold", children: actionLabel }), _jsx("p", { className: "text-as-secondary text-sm", children: "Pay from any token to execute a custom exact-in transaction." })] }) }));
224
224
  const mainView = (_jsxs("div", { className: classes?.container ||
225
- "anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect, skipAutoMaxOnTokenChange: !!destinationTokenAmount })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: selectedRecipientOrDefault, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues, customRecipientLabel: customRecipientLabel }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: classes?.swapDirectionButton ||
225
+ "anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: selectedRecipientOrDefault, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues, customRecipientLabel: customRecipientLabel }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: classes?.swapDirectionButton ||
226
226
  "swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl", children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: false, effectiveRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, customRecipientLabel: customRecipientLabel, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: isSrcInputDirty && !destinationTokenAmount ? dstAmount : dstAmountInput, dstToken: selectedDstToken, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: DESTINATION_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
227
227
  setIsSrcInputDirty(false);
228
228
  setDstAmountInput(value);
@@ -278,6 +278,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
278
278
  ? normalizeAddress(customExactInConfig.spenderAddress)
279
279
  : undefined,
280
280
  },
281
+ callbackMetadata,
281
282
  });
282
283
  }
283
284
  else {
@@ -295,6 +296,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
295
296
  expectedDstAmount: expectedDstAmountRaw,
296
297
  creatorAddress: globalAddress,
297
298
  payload,
299
+ callbackMetadata,
298
300
  });
299
301
  }
300
302
  }
@@ -101,6 +101,8 @@ export interface AnySpendDepositProps {
101
101
  allowDirectTransfer?: boolean;
102
102
  /** Fixed destination token amount (in wei/smallest unit). When provided, user cannot change the amount. */
103
103
  destinationTokenAmount?: string;
104
+ /** Opaque metadata passed to the order for callbacks (e.g., workflow form data) */
105
+ callbackMetadata?: Record<string, unknown>;
104
106
  }
105
107
  /**
106
108
  * A flexible deposit component that wraps AnySpendCustomExactIn with optional chain selection.
@@ -137,4 +139,4 @@ export interface AnySpendDepositProps {
137
139
  * onSuccess={(amount) => console.log(`Deposited ${amount}`)}
138
140
  * />
139
141
  */
140
- export declare function AnySpendDeposit({ loadOrder, mode, recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains, minPoolSize, topChainsCount, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit, classes, allowDirectTransfer, destinationTokenAmount, }: AnySpendDepositProps): import("react/jsx-runtime").JSX.Element | null;
142
+ export declare function AnySpendDeposit({ loadOrder, mode, recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains, minPoolSize, topChainsCount, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit, classes, allowDirectTransfer, destinationTokenAmount, callbackMetadata, }: AnySpendDepositProps): import("react/jsx-runtime").JSX.Element | null;
@@ -94,7 +94,7 @@ function ChainIcon({ chainId, className }) {
94
94
  * onSuccess={(amount) => console.log(`Deposited ${amount}`)}
95
95
  * />
96
96
  */
97
- export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains = DEFAULT_SUPPORTED_CHAINS, minPoolSize = DEFAULT_MIN_POOL_SIZE, topChainsCount = 3, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit = false, classes, allowDirectTransfer = false, destinationTokenAmount, }) {
97
+ export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains = DEFAULT_SUPPORTED_CHAINS, minPoolSize = DEFAULT_MIN_POOL_SIZE, topChainsCount = 3, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit = false, classes, allowDirectTransfer = false, destinationTokenAmount, callbackMetadata, }) {
98
98
  // Extract deposit-specific classes for convenience
99
99
  const depositClasses = classes?.deposit;
100
100
  const { connectedEOAWallet } = useAccountWallet();
@@ -206,5 +206,5 @@ export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, p
206
206
  // Deposit view
207
207
  return (_jsxs("div", { className: depositClasses?.form || "anyspend-deposit anyspend-deposit-form relative", children: [shouldShowChainSelection && (_jsxs("button", { onClick: handleBack, className: depositClasses?.backButton ||
208
208
  "anyspend-deposit-back-button text-as-secondary hover:text-as-primary absolute left-4 top-4 z-10 flex items-center gap-1", children: [_jsx("svg", { className: depositClasses?.backIcon || "anyspend-deposit-back-icon h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), _jsx("span", { className: depositClasses?.backText || "anyspend-deposit-back-text text-sm", children: "Back" })] })), onClose && (_jsx("button", { onClick: onClose, className: depositClasses?.closeButton ||
209
- "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), _jsx("div", { className: depositClasses?.formContent || cn("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? (_jsx(AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: selectedChainId, destinationToken: destinationToken, destinationChainId: destinationTokenChainId, orderType: effectiveOrderType, minDestinationAmount: minDestinationAmount, header: header ?? defaultHeader, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, customExactInConfig: depositContractConfig, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.customExactIn, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount }, selectedChainId)) : (_jsx(AnySpend, { loadOrder: loadOrder, mode: mode, defaultActiveTab: paymentType, recipientAddress: recipientAddress, sourceChainId: selectedChainId, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, onSuccess: txHash => onSuccess?.(txHash ?? ""), onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, hideHeader: true, hideBottomNavigation: true, disableUrlParamManagement: true, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.anySpend, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount }, selectedChainId)) }), _jsx(ChainWarningText, { chainId: destinationTokenChainId, classes: classes?.chainWarningText || { root: "px-4 pb-4" } })] }));
209
+ "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), _jsx("div", { className: depositClasses?.formContent || cn("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? (_jsx(AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: selectedChainId, destinationToken: destinationToken, destinationChainId: destinationTokenChainId, orderType: effectiveOrderType, minDestinationAmount: minDestinationAmount, header: header ?? defaultHeader, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, customExactInConfig: depositContractConfig, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.customExactIn, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount, callbackMetadata: callbackMetadata }, selectedChainId)) : (_jsx(AnySpend, { loadOrder: loadOrder, mode: mode, defaultActiveTab: paymentType, recipientAddress: recipientAddress, sourceChainId: selectedChainId, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, onSuccess: txHash => onSuccess?.(txHash ?? ""), onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, hideHeader: true, hideBottomNavigation: true, disableUrlParamManagement: true, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.anySpend, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount, callbackMetadata: callbackMetadata }, selectedChainId)) }), _jsx(ChainWarningText, { chainId: destinationTokenChainId, classes: classes?.chainWarningText || { root: "px-4 pb-4" } })] }));
210
210
  }
@@ -0,0 +1,31 @@
1
+ import type { AnySpendAllClasses } from "./types/classes";
2
+ export interface AnySpendWorkflowTriggerProps {
3
+ /** Payment recipient address (hex) */
4
+ recipientAddress: string;
5
+ /** Destination chain ID */
6
+ chainId: number;
7
+ /** Destination token address */
8
+ tokenAddress: string;
9
+ /** Required payment amount in token base units (wei) */
10
+ amount: string;
11
+ /** Workflow ID to trigger */
12
+ workflowId: string;
13
+ /** Organization ID that owns the workflow */
14
+ orgId: string;
15
+ /** Optional callback metadata merged into the order */
16
+ callbackMetadata?: {
17
+ /** Passed as trigger result inputs — accessible via {{root.result.inputs.*}} */
18
+ inputs?: Record<string, unknown>;
19
+ } & Record<string, unknown>;
20
+ /** Callback when payment succeeds */
21
+ onSuccess?: (amount: string) => void;
22
+ /** Callback when modal is closed */
23
+ onClose?: () => void;
24
+ /** Display mode */
25
+ mode?: "modal" | "page";
26
+ /** Custom action label */
27
+ actionLabel?: string;
28
+ /** Custom class names */
29
+ classes?: AnySpendAllClasses;
30
+ }
31
+ export declare function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, }: AnySpendWorkflowTriggerProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,11 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useMemo } from "react";
3
+ import { AnySpendDeposit } from "./AnySpendDeposit.js";
4
+ export function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, }) {
5
+ const metadata = useMemo(() => ({
6
+ workflowId,
7
+ orgId,
8
+ ...callbackMetadata,
9
+ }), [workflowId, orgId, callbackMetadata]);
10
+ return (_jsx(AnySpendDeposit, { recipientAddress: recipientAddress, destinationTokenAddress: tokenAddress, destinationTokenChainId: chainId, destinationTokenAmount: amount, callbackMetadata: metadata, onSuccess: onSuccess, onClose: onClose, mode: mode, actionLabel: actionLabel, classes: classes, allowDirectTransfer: true }));
11
+ }
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { ALL_CHAINS, getAvailableChainIds, isSameChainAndToken } from "../../../anyspend/index.js";
2
+ import { ALL_CHAINS, getAvailableChainIds, getPaymentUrl, isSameChainAndToken, ZERO_ADDRESS, } from "../../../anyspend/index.js";
3
3
  import { Button, toast } from "../../../global-account/react/index.js";
4
4
  import { cn } from "../../../shared/utils/cn.js";
5
5
  import { TokenSelector } from "@relayprotocol/relay-kit-ui";
@@ -8,6 +8,7 @@ import { QRCodeSVG } from "qrcode.react";
8
8
  import { useEffect, useRef, useState } from "react";
9
9
  import { useAnyspendOrderAndTransactions } from "../hooks/useAnyspendOrderAndTransactions.js";
10
10
  import { useCreateDepositFirstOrder } from "../hooks/useCreateDepositFirstOrder.js";
11
+ import { useOnOrderSuccess } from "../hooks/useOnOrderSuccess.js";
11
12
  import { useWatchTransfer } from "../hooks/useWatchTransfer.js";
12
13
  import { ChainTokenIcon } from "./common/ChainTokenIcon.js";
13
14
  import { OrderDetails } from "./common/OrderDetails.js";
@@ -43,7 +44,6 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
43
44
  const [orderId, setOrderId] = useState();
44
45
  const [globalAddress, setGlobalAddress] = useState();
45
46
  const orderCreatedRef = useRef(false);
46
- const onSuccessCalled = useRef(false);
47
47
  const [transferResult, setTransferResult] = useState(null);
48
48
  // Source token/chain as state (can be changed by user)
49
49
  const [sourceChainId, setSourceChainId] = useState(sourceChainIdProp ?? 8453);
@@ -125,19 +125,11 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
125
125
  isPureTransfer,
126
126
  ]);
127
127
  // Call onSuccess when order is executed
128
- useEffect(() => {
129
- if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
130
- const txHash = oat?.data?.executeTx?.txHash;
131
- onSuccess?.(txHash);
132
- onSuccessCalled.current = true;
133
- }
134
- }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
135
- // Reset onSuccess flag when orderId changes
136
- useEffect(() => {
137
- onSuccessCalled.current = false;
138
- }, [orderId]);
128
+ useOnOrderSuccess({ orderData: oat, orderId, onSuccess });
139
129
  // For pure transfers, always use recipient address; for orders, use global address
140
130
  const displayAddress = isPureTransfer ? recipientAddress : globalAddress || recipientAddress;
131
+ // Generate EIP-681 payment URI for the QR code so wallets know which chain/token to use
132
+ const qrValue = getPaymentUrl(displayAddress, undefined, sourceToken.address === ZERO_ADDRESS ? "ETH" : sourceToken.address, sourceChainId, sourceToken.decimals);
141
133
  const handleCopyAddress = async () => {
142
134
  if (displayAddress) {
143
135
  await navigator.clipboard.writeText(displayAddress);
@@ -170,7 +162,7 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
170
162
  }
171
163
  return (_jsx("div", { className: classes?.container ||
172
164
  cn("anyspend-container anyspend-qr-deposit font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsxs("div", { className: classes?.content || "anyspend-qr-deposit-content flex flex-col gap-4", children: [_jsxs("div", { className: classes?.header || "anyspend-qr-header flex items-center justify-between", children: [_jsx("button", { onClick: handleBack, className: classes?.backButton || "anyspend-qr-back-button text-as-secondary hover:text-as-primary", children: _jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }), _jsx("h2", { className: classes?.title || "anyspend-qr-title text-as-primary text-base font-semibold", children: "Deposit" }), onClose ? (_jsx("button", { onClick: handleClose, className: classes?.closeButton || "anyspend-qr-close-button text-as-secondary hover:text-as-primary", children: _jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })) : (_jsx("div", { className: "w-5" }))] }), _jsxs("div", { className: classes?.tokenSelectorContainer || "anyspend-qr-token-selector flex flex-col gap-1.5", children: [_jsx("label", { className: classes?.tokenSelectorLabel || "anyspend-qr-token-label text-as-secondary text-sm", children: "Send" }), _jsx(TokenSelector, { chainIdsFilter: getAvailableChainIds("from"), context: "from", fromChainWalletVMSupported: true, isValidAddress: true, lockedChainIds: getAvailableChainIds("from"), multiWalletSupportEnabled: true, onAnalyticEvent: undefined, setToken: handleTokenSelect, supportedWalletVMs: ["evm"], token: undefined, trigger: _jsxs(Button, { variant: "outline", role: "combobox", className: classes?.tokenSelectorTrigger ||
173
- "anyspend-qr-token-trigger border-as-stroke bg-as-surface-secondary flex h-auto w-full items-center justify-between gap-2 rounded-xl border px-3 py-2.5", children: [_jsxs("div", { className: "flex items-center gap-2", children: [sourceToken.metadata?.logoURI ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[sourceChainId]?.logoUrl, tokenUrl: sourceToken.metadata.logoURI, className: "h-8 min-h-8 w-8 min-w-8" })) : (_jsx("div", { className: "h-8 w-8 rounded-full bg-gray-700" })), _jsxs("div", { className: "flex flex-col items-start gap-0", children: [_jsx("div", { className: "text-as-primary font-semibold", children: sourceToken.symbol }), _jsx("div", { className: "text-as-primary/70 text-xs", children: ALL_CHAINS[sourceChainId]?.name ?? "Unknown" })] })] }), _jsx(ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) })] }), _jsxs("div", { className: classes?.qrContent || "anyspend-qr-content border-as-stroke flex items-start gap-4 rounded-xl border p-4", children: [_jsxs("div", { className: classes?.qrCodeContainer || "anyspend-qr-code-container flex flex-col items-center gap-2", children: [_jsx("div", { className: classes?.qrCode || "anyspend-qr-code rounded-lg bg-white p-2", children: _jsx(QRCodeSVG, { value: displayAddress, size: 120, level: "M", marginSize: 0 }) }), _jsxs("span", { className: classes?.qrScanHint || "anyspend-qr-scan-hint text-as-secondary text-xs", children: ["SCAN WITH ", _jsx("span", { className: "inline-block", children: "\uD83E\uDD8A" })] })] }), _jsxs("div", { className: classes?.addressContainer || "anyspend-qr-address-container flex flex-1 flex-col gap-1", children: [_jsx("span", { className: classes?.addressLabel || "anyspend-qr-address-label text-as-secondary text-sm", children: "Deposit address:" }), _jsxs("div", { className: classes?.addressRow || "anyspend-qr-address-row flex items-start gap-1", children: [_jsx("span", { className: classes?.address || "anyspend-qr-address text-as-primary break-all font-mono text-sm leading-relaxed", children: displayAddress }), _jsx("button", { onClick: handleCopyAddress, className: classes?.addressCopyIcon ||
165
+ "anyspend-qr-token-trigger border-as-stroke bg-as-surface-secondary flex h-auto w-full items-center justify-between gap-2 rounded-xl border px-3 py-2.5", children: [_jsxs("div", { className: "flex items-center gap-2", children: [sourceToken.metadata?.logoURI ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[sourceChainId]?.logoUrl, tokenUrl: sourceToken.metadata.logoURI, className: "h-8 min-h-8 w-8 min-w-8" })) : (_jsx("div", { className: "h-8 w-8 rounded-full bg-gray-700" })), _jsxs("div", { className: "flex flex-col items-start gap-0", children: [_jsx("div", { className: "text-as-primary font-semibold", children: sourceToken.symbol }), _jsx("div", { className: "text-as-primary/70 text-xs", children: ALL_CHAINS[sourceChainId]?.name ?? "Unknown" })] })] }), _jsx(ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) })] }), _jsxs("div", { className: classes?.qrContent || "anyspend-qr-content border-as-stroke flex items-start gap-4 rounded-xl border p-4", children: [_jsxs("div", { className: classes?.qrCodeContainer || "anyspend-qr-code-container flex flex-col items-center gap-2", children: [_jsx("div", { className: classes?.qrCode || "anyspend-qr-code rounded-lg bg-white p-2", children: _jsx(QRCodeSVG, { value: qrValue, size: 120, level: "M", marginSize: 0 }) }), _jsxs("span", { className: classes?.qrScanHint || "anyspend-qr-scan-hint text-as-secondary text-xs", children: ["SCAN WITH ", _jsx("span", { className: "inline-block", children: "\uD83E\uDD8A" })] })] }), _jsxs("div", { className: classes?.addressContainer || "anyspend-qr-address-container flex flex-1 flex-col gap-1", children: [_jsx("span", { className: classes?.addressLabel || "anyspend-qr-address-label text-as-secondary text-sm", children: "Deposit address:" }), _jsxs("div", { className: classes?.addressRow || "anyspend-qr-address-row flex items-start gap-1", children: [_jsx("span", { className: classes?.address || "anyspend-qr-address text-as-primary break-all font-mono text-sm leading-relaxed", children: displayAddress }), _jsx("button", { onClick: handleCopyAddress, className: classes?.addressCopyIcon ||
174
166
  "anyspend-qr-copy-icon text-as-secondary hover:text-as-primary mt-0.5 shrink-0", children: copied ? _jsx(Check, { className: "h-4 w-4" }) : _jsx(Copy, { className: "h-4 w-4" }) })] })] })] }), _jsx(ChainWarningText, { chainId: destinationChainId }), _jsxs(WarningText, { children: ["Only send ", sourceToken.symbol, " on ", ALL_CHAINS[sourceChainId]?.name ?? "the specified chain", ". Other tokens will not be converted."] }), isPureTransfer && isWatchingTransfer && (_jsxs("div", { className: classes?.watchingIndicator ||
175
167
  "anyspend-qr-watching flex items-center justify-center gap-2 rounded-lg bg-blue-500/10 p-3", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin text-blue-500" }), _jsx("span", { className: "text-sm text-blue-500", children: "Watching for incoming transfer..." })] })), _jsx("button", { onClick: handleCopyAddress, className: classes?.copyButton ||
176
168
  "anyspend-qr-copy-button flex w-full items-center justify-center gap-2 rounded-xl bg-blue-500 py-3.5 font-medium text-white transition-all hover:bg-blue-600", children: "Copy deposit address" })] }) }));
@@ -0,0 +1,113 @@
1
+ export declare const BUY_PACKS_FOR_ABI: {
2
+ readonly inputs: readonly [{
3
+ readonly internalType: "address";
4
+ readonly name: "user";
5
+ readonly type: "address";
6
+ }, {
7
+ readonly internalType: "uint256";
8
+ readonly name: "packId";
9
+ readonly type: "uint256";
10
+ }, {
11
+ readonly internalType: "uint256";
12
+ readonly name: "amount";
13
+ readonly type: "uint256";
14
+ }];
15
+ readonly name: "buyPacksFor";
16
+ readonly outputs: readonly [];
17
+ readonly stateMutability: "nonpayable";
18
+ readonly type: "function";
19
+ };
20
+ export declare const BUY_PACKS_FOR_WITH_DISCOUNT_ABI: {
21
+ readonly inputs: readonly [{
22
+ readonly internalType: "address";
23
+ readonly name: "user";
24
+ readonly type: "address";
25
+ }, {
26
+ readonly internalType: "uint256";
27
+ readonly name: "packId";
28
+ readonly type: "uint256";
29
+ }, {
30
+ readonly internalType: "uint256";
31
+ readonly name: "amount";
32
+ readonly type: "uint256";
33
+ }, {
34
+ readonly internalType: "string";
35
+ readonly name: "discountCode";
36
+ readonly type: "string";
37
+ }];
38
+ readonly name: "buyPacksForWithDiscount";
39
+ readonly outputs: readonly [];
40
+ readonly stateMutability: "nonpayable";
41
+ readonly type: "function";
42
+ };
43
+ export declare const IS_DISCOUNT_CODE_VALID_FOR_PACK_ABI: {
44
+ readonly inputs: readonly [{
45
+ readonly internalType: "string";
46
+ readonly name: "code";
47
+ readonly type: "string";
48
+ }, {
49
+ readonly internalType: "uint256";
50
+ readonly name: "packId";
51
+ readonly type: "uint256";
52
+ }];
53
+ readonly name: "isDiscountCodeValidForPack";
54
+ readonly outputs: readonly [{
55
+ readonly internalType: "bool";
56
+ readonly name: "isValid";
57
+ readonly type: "bool";
58
+ }, {
59
+ readonly internalType: "uint256";
60
+ readonly name: "discountAmount";
61
+ readonly type: "uint256";
62
+ }];
63
+ readonly stateMutability: "view";
64
+ readonly type: "function";
65
+ };
66
+ export declare const GET_DISCOUNT_CODE_ABI: {
67
+ readonly inputs: readonly [{
68
+ readonly internalType: "string";
69
+ readonly name: "code";
70
+ readonly type: "string";
71
+ }];
72
+ readonly name: "getDiscountCode";
73
+ readonly outputs: readonly [{
74
+ readonly components: readonly [{
75
+ readonly internalType: "uint256";
76
+ readonly name: "discountAmount";
77
+ readonly type: "uint256";
78
+ }, {
79
+ readonly internalType: "uint256";
80
+ readonly name: "expiresAt";
81
+ readonly type: "uint256";
82
+ }, {
83
+ readonly internalType: "bool";
84
+ readonly name: "used";
85
+ readonly type: "bool";
86
+ }, {
87
+ readonly internalType: "bool";
88
+ readonly name: "exists";
89
+ readonly type: "bool";
90
+ }, {
91
+ readonly internalType: "uint256";
92
+ readonly name: "maxUses";
93
+ readonly type: "uint256";
94
+ }, {
95
+ readonly internalType: "uint256";
96
+ readonly name: "usedCount";
97
+ readonly type: "uint256";
98
+ }, {
99
+ readonly internalType: "uint256";
100
+ readonly name: "packId";
101
+ readonly type: "uint256";
102
+ }, {
103
+ readonly internalType: "uint256";
104
+ readonly name: "minPurchaseAmount";
105
+ readonly type: "uint256";
106
+ }];
107
+ readonly internalType: "struct CCShop.DiscountCode";
108
+ readonly name: "";
109
+ readonly type: "tuple";
110
+ }];
111
+ readonly stateMutability: "view";
112
+ readonly type: "function";
113
+ };