@b3dotfun/sdk 0.0.73-alpha.1 → 0.0.73-alpha.2

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 (23) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.d.ts +1 -0
  2. package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.js +10 -1
  3. package/dist/cjs/anyspend/react/components/AnyspendDepositHype.d.ts +2 -1
  4. package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +2 -2
  5. package/dist/cjs/global-account/react/hooks/useTokenBalanceDirect.d.ts +1 -0
  6. package/dist/cjs/global-account/react/hooks/useTokenBalanceDirect.js +1 -0
  7. package/dist/cjs/global-account/react/stores/useModalStore.d.ts +2 -0
  8. package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.d.ts +1 -0
  9. package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.js +10 -1
  10. package/dist/esm/anyspend/react/components/AnyspendDepositHype.d.ts +2 -1
  11. package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +2 -2
  12. package/dist/esm/global-account/react/hooks/useTokenBalanceDirect.d.ts +1 -0
  13. package/dist/esm/global-account/react/hooks/useTokenBalanceDirect.js +1 -0
  14. package/dist/esm/global-account/react/stores/useModalStore.d.ts +2 -0
  15. package/dist/types/anyspend/react/components/AnySpendCustomExactIn.d.ts +1 -0
  16. package/dist/types/anyspend/react/components/AnyspendDepositHype.d.ts +2 -1
  17. package/dist/types/global-account/react/hooks/useTokenBalanceDirect.d.ts +1 -0
  18. package/dist/types/global-account/react/stores/useModalStore.d.ts +2 -0
  19. package/package.json +1 -1
  20. package/src/anyspend/react/components/AnySpendCustomExactIn.tsx +11 -0
  21. package/src/anyspend/react/components/AnyspendDepositHype.tsx +3 -0
  22. package/src/global-account/react/hooks/useTokenBalanceDirect.tsx +2 -0
  23. package/src/global-account/react/stores/useModalStore.ts +2 -0
@@ -18,6 +18,7 @@ export interface AnySpendCustomExactInProps {
18
18
  destinationToken: components["schemas"]["Token"];
19
19
  destinationChainId: number;
20
20
  onSuccess?: (amount: string) => void;
21
+ onOpenCustomModal?: () => void;
21
22
  mainFooter?: React.ReactNode;
22
23
  onTokenSelect?: (token: components["schemas"]["Token"], event: {
23
24
  preventDefault: () => void;
@@ -15,6 +15,7 @@ const react_2 = require("motion/react");
15
15
  const react_3 = require("react");
16
16
  const sonner_1 = require("sonner");
17
17
  const react_4 = require("thirdweb/react");
18
+ const constants_1 = require("../../constants");
18
19
  const useAnyspendFlow_1 = require("../hooks/useAnyspendFlow");
19
20
  const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
20
21
  const CryptoPaySection_1 = require("./common/CryptoPaySection");
@@ -31,7 +32,7 @@ function AnySpendCustomExactIn(props) {
31
32
  const fingerprintConfig = (0, AnySpendFingerprintWrapper_1.getFingerprintConfig)();
32
33
  return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: (0, jsx_runtime_1.jsx)(AnySpendCustomExactInInner, { ...props }) }));
33
34
  }
34
- function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, orderType = "custom_exact_in", minDestinationAmount, header, }) {
35
+ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, orderType = "custom_exact_in", minDestinationAmount, header, }) {
35
36
  const actionLabel = customExactInConfig?.action ?? "Custom Execution";
36
37
  const DESTINATION_TOKEN_DETAILS = {
37
38
  SYMBOL: destinationToken.symbol ?? "TOKEN",
@@ -88,6 +89,9 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
88
89
  const btnInfo = (0, react_3.useMemo)(() => {
89
90
  if (activeInputAmountInWei === "0")
90
91
  return { text: "Enter an amount", disable: true, error: false, loading: false };
92
+ if (orderType === "hype_duel" && selectedSrcToken?.address?.toLowerCase() === constants_1.B3_TOKEN.address.toLowerCase()) {
93
+ return { text: "Convert to HYPE using B3", disable: false, error: false, loading: false };
94
+ }
91
95
  if (isLoadingAnyspendQuote)
92
96
  return { text: "Loading quote...", disable: true, error: false, loading: true };
93
97
  if (isCreatingOrder || isCreatingOnrampOrder)
@@ -150,8 +154,13 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
150
154
  minDestinationAmount,
151
155
  DESTINATION_TOKEN_DETAILS.SYMBOL,
152
156
  orderType,
157
+ selectedSrcToken,
153
158
  ]);
154
159
  const onMainButtonClick = async () => {
160
+ if (orderType === "hype_duel" && selectedSrcToken?.address?.toLowerCase() === constants_1.B3_TOKEN.address.toLowerCase()) {
161
+ onOpenCustomModal?.();
162
+ return;
163
+ }
155
164
  if (btnInfo.disable)
156
165
  return;
157
166
  if (!selectedRecipientOrDefault) {
@@ -11,6 +11,7 @@ export interface AnySpendDepositHypeProps {
11
11
  sourceTokenAddress?: string;
12
12
  sourceTokenChainId?: number;
13
13
  onSuccess?: () => void;
14
+ onOpenCustomModal?: () => void;
14
15
  mainFooter?: React.ReactNode;
15
16
  /**
16
17
  * Called when a token is selected. Call event.preventDefault() to prevent default token selection behavior.
@@ -22,4 +23,4 @@ export interface AnySpendDepositHypeProps {
22
23
  customUsdInputValues?: string[];
23
24
  preferEoa?: boolean;
24
25
  }
25
- export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
26
+ export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
@@ -10,7 +10,7 @@ exports.HYPE_TOKEN_DETAILS = {
10
10
  SYMBOL: "HYPE",
11
11
  LOGO_URI: "https://cdn.hypeduel.com/hypes-coin.svg",
12
12
  };
13
- function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }) {
13
+ function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }) {
14
14
  if (!recipientAddress)
15
15
  return null;
16
16
  const header = () => ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: paymentType === "crypto" ? "Deposit Crypto" : "Fund with Fiat" }) }) }));
@@ -23,5 +23,5 @@ function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddress, paym
23
23
  logoURI: exports.HYPE_TOKEN_DETAILS.LOGO_URI,
24
24
  },
25
25
  };
26
- return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: hypeToken, destinationChainId: chains_1.base.id, orderType: "hype_duel", minDestinationAmount: 10, header: header, onSuccess: onSuccess, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa }));
26
+ return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: hypeToken, destinationChainId: chains_1.base.id, orderType: "hype_duel", minDestinationAmount: 10, header: header, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa }));
27
27
  }
@@ -7,6 +7,7 @@ export interface TokenBalanceResult {
7
7
  rawBalance: bigint | null;
8
8
  formattedBalance: string;
9
9
  isLoading: boolean;
10
+ refetch: () => void;
10
11
  }
11
12
  export declare function useTokenBalanceDirect({ token, address }: UseTokenBalanceProps): TokenBalanceResult;
12
13
  export {};
@@ -58,5 +58,6 @@ function useTokenBalanceDirect({ token, address }) {
58
58
  rawBalance: tokenBalance?.raw || BigInt(0),
59
59
  formattedBalance: tokenBalance?.formatted || "0",
60
60
  isLoading: isActuallyLoading,
61
+ refetch,
61
62
  };
62
63
  }
@@ -364,6 +364,8 @@ export interface AnySpendDepositHypeProps extends BaseModalProps {
364
364
  mainFooter?: React.ReactNode;
365
365
  /** Callback function called when the deposit is successful */
366
366
  onSuccess?: (amount?: string) => void;
367
+ /** Callback function trigger open custom modal */
368
+ onOpenCustomModal?: () => void;
367
369
  /** Custom USD input values for quick amount buttons in fiat onramp */
368
370
  customUsdInputValues?: string[];
369
371
  /** prefer eoa wallet */
@@ -18,6 +18,7 @@ export interface AnySpendCustomExactInProps {
18
18
  destinationToken: components["schemas"]["Token"];
19
19
  destinationChainId: number;
20
20
  onSuccess?: (amount: string) => void;
21
+ onOpenCustomModal?: () => void;
21
22
  mainFooter?: React.ReactNode;
22
23
  onTokenSelect?: (token: components["schemas"]["Token"], event: {
23
24
  preventDefault: () => void;
@@ -9,6 +9,7 @@ import { motion } from "motion/react";
9
9
  import { useEffect, useMemo, useRef } from "react";
10
10
  import { toast } from "sonner";
11
11
  import { useSetActiveWallet } from "thirdweb/react";
12
+ import { B3_TOKEN } from "../../constants/index.js";
12
13
  import { PanelView, useAnyspendFlow } from "../hooks/useAnyspendFlow.js";
13
14
  import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper.js";
14
15
  import { CryptoPaySection } from "./common/CryptoPaySection.js";
@@ -25,7 +26,7 @@ export function AnySpendCustomExactIn(props) {
25
26
  const fingerprintConfig = getFingerprintConfig();
26
27
  return (_jsx(AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: _jsx(AnySpendCustomExactInInner, { ...props }) }));
27
28
  }
28
- function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, orderType = "custom_exact_in", minDestinationAmount, header, }) {
29
+ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, orderType = "custom_exact_in", minDestinationAmount, header, }) {
29
30
  const actionLabel = customExactInConfig?.action ?? "Custom Execution";
30
31
  const DESTINATION_TOKEN_DETAILS = {
31
32
  SYMBOL: destinationToken.symbol ?? "TOKEN",
@@ -82,6 +83,9 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
82
83
  const btnInfo = useMemo(() => {
83
84
  if (activeInputAmountInWei === "0")
84
85
  return { text: "Enter an amount", disable: true, error: false, loading: false };
86
+ if (orderType === "hype_duel" && selectedSrcToken?.address?.toLowerCase() === B3_TOKEN.address.toLowerCase()) {
87
+ return { text: "Convert to HYPE using B3", disable: false, error: false, loading: false };
88
+ }
85
89
  if (isLoadingAnyspendQuote)
86
90
  return { text: "Loading quote...", disable: true, error: false, loading: true };
87
91
  if (isCreatingOrder || isCreatingOnrampOrder)
@@ -144,8 +148,13 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
144
148
  minDestinationAmount,
145
149
  DESTINATION_TOKEN_DETAILS.SYMBOL,
146
150
  orderType,
151
+ selectedSrcToken,
147
152
  ]);
148
153
  const onMainButtonClick = async () => {
154
+ if (orderType === "hype_duel" && selectedSrcToken?.address?.toLowerCase() === B3_TOKEN.address.toLowerCase()) {
155
+ onOpenCustomModal?.();
156
+ return;
157
+ }
149
158
  if (btnInfo.disable)
150
159
  return;
151
160
  if (!selectedRecipientOrDefault) {
@@ -11,6 +11,7 @@ export interface AnySpendDepositHypeProps {
11
11
  sourceTokenAddress?: string;
12
12
  sourceTokenChainId?: number;
13
13
  onSuccess?: () => void;
14
+ onOpenCustomModal?: () => void;
14
15
  mainFooter?: React.ReactNode;
15
16
  /**
16
17
  * Called when a token is selected. Call event.preventDefault() to prevent default token selection behavior.
@@ -22,4 +23,4 @@ export interface AnySpendDepositHypeProps {
22
23
  customUsdInputValues?: string[];
23
24
  preferEoa?: boolean;
24
25
  }
25
- export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
26
+ export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
@@ -6,7 +6,7 @@ export const HYPE_TOKEN_DETAILS = {
6
6
  SYMBOL: "HYPE",
7
7
  LOGO_URI: "https://cdn.hypeduel.com/hypes-coin.svg",
8
8
  };
9
- export function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }) {
9
+ export function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }) {
10
10
  if (!recipientAddress)
11
11
  return null;
12
12
  const header = () => (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsx("div", { children: _jsx("h1", { className: "text-as-primary text-xl font-bold", children: paymentType === "crypto" ? "Deposit Crypto" : "Fund with Fiat" }) }) }));
@@ -19,5 +19,5 @@ export function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddres
19
19
  logoURI: HYPE_TOKEN_DETAILS.LOGO_URI,
20
20
  },
21
21
  };
22
- return (_jsx(AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: hypeToken, destinationChainId: base.id, orderType: "hype_duel", minDestinationAmount: 10, header: header, onSuccess: onSuccess, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa }));
22
+ return (_jsx(AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: hypeToken, destinationChainId: base.id, orderType: "hype_duel", minDestinationAmount: 10, header: header, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa }));
23
23
  }
@@ -7,6 +7,7 @@ export interface TokenBalanceResult {
7
7
  rawBalance: bigint | null;
8
8
  formattedBalance: string;
9
9
  isLoading: boolean;
10
+ refetch: () => void;
10
11
  }
11
12
  export declare function useTokenBalanceDirect({ token, address }: UseTokenBalanceProps): TokenBalanceResult;
12
13
  export {};
@@ -55,5 +55,6 @@ export function useTokenBalanceDirect({ token, address }) {
55
55
  rawBalance: tokenBalance?.raw || BigInt(0),
56
56
  formattedBalance: tokenBalance?.formatted || "0",
57
57
  isLoading: isActuallyLoading,
58
+ refetch,
58
59
  };
59
60
  }
@@ -364,6 +364,8 @@ export interface AnySpendDepositHypeProps extends BaseModalProps {
364
364
  mainFooter?: React.ReactNode;
365
365
  /** Callback function called when the deposit is successful */
366
366
  onSuccess?: (amount?: string) => void;
367
+ /** Callback function trigger open custom modal */
368
+ onOpenCustomModal?: () => void;
367
369
  /** Custom USD input values for quick amount buttons in fiat onramp */
368
370
  customUsdInputValues?: string[];
369
371
  /** prefer eoa wallet */
@@ -18,6 +18,7 @@ export interface AnySpendCustomExactInProps {
18
18
  destinationToken: components["schemas"]["Token"];
19
19
  destinationChainId: number;
20
20
  onSuccess?: (amount: string) => void;
21
+ onOpenCustomModal?: () => void;
21
22
  mainFooter?: React.ReactNode;
22
23
  onTokenSelect?: (token: components["schemas"]["Token"], event: {
23
24
  preventDefault: () => void;
@@ -11,6 +11,7 @@ export interface AnySpendDepositHypeProps {
11
11
  sourceTokenAddress?: string;
12
12
  sourceTokenChainId?: number;
13
13
  onSuccess?: () => void;
14
+ onOpenCustomModal?: () => void;
14
15
  mainFooter?: React.ReactNode;
15
16
  /**
16
17
  * Called when a token is selected. Call event.preventDefault() to prevent default token selection behavior.
@@ -22,4 +23,4 @@ export interface AnySpendDepositHypeProps {
22
23
  customUsdInputValues?: string[];
23
24
  preferEoa?: boolean;
24
25
  }
25
- export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
26
+ export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
@@ -7,6 +7,7 @@ export interface TokenBalanceResult {
7
7
  rawBalance: bigint | null;
8
8
  formattedBalance: string;
9
9
  isLoading: boolean;
10
+ refetch: () => void;
10
11
  }
11
12
  export declare function useTokenBalanceDirect({ token, address }: UseTokenBalanceProps): TokenBalanceResult;
12
13
  export {};
@@ -364,6 +364,8 @@ export interface AnySpendDepositHypeProps extends BaseModalProps {
364
364
  mainFooter?: React.ReactNode;
365
365
  /** Callback function called when the deposit is successful */
366
366
  onSuccess?: (amount?: string) => void;
367
+ /** Callback function trigger open custom modal */
368
+ onOpenCustomModal?: () => void;
367
369
  /** Custom USD input values for quick amount buttons in fiat onramp */
368
370
  customUsdInputValues?: string[];
369
371
  /** prefer eoa wallet */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@b3dotfun/sdk",
3
- "version": "0.0.73-alpha.1",
3
+ "version": "0.0.73-alpha.2",
4
4
  "source": "src/index.ts",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "react-native": "./dist/cjs/index.native.js",
@@ -10,6 +10,7 @@ import { motion } from "motion/react";
10
10
  import { useEffect, useMemo, useRef } from "react";
11
11
  import { toast } from "sonner";
12
12
  import { useSetActiveWallet } from "thirdweb/react";
13
+ import { B3_TOKEN } from "../../constants";
13
14
  import { PanelView, useAnyspendFlow } from "../hooks/useAnyspendFlow";
14
15
  import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper";
15
16
  import { CryptoPaySection } from "./common/CryptoPaySection";
@@ -43,6 +44,7 @@ export interface AnySpendCustomExactInProps {
43
44
  destinationToken: components["schemas"]["Token"];
44
45
  destinationChainId: number;
45
46
  onSuccess?: (amount: string) => void;
47
+ onOpenCustomModal?: () => void;
46
48
  mainFooter?: React.ReactNode;
47
49
  onTokenSelect?: (token: components["schemas"]["Token"], event: { preventDefault: () => void }) => void;
48
50
  customUsdInputValues?: string[];
@@ -79,6 +81,7 @@ function AnySpendCustomExactInInner({
79
81
  destinationToken,
80
82
  destinationChainId,
81
83
  onSuccess,
84
+ onOpenCustomModal,
82
85
  mainFooter,
83
86
  onTokenSelect,
84
87
  customUsdInputValues,
@@ -190,6 +193,9 @@ function AnySpendCustomExactInInner({
190
193
 
191
194
  const btnInfo: { text: string; disable: boolean; error: boolean; loading: boolean } = useMemo(() => {
192
195
  if (activeInputAmountInWei === "0") return { text: "Enter an amount", disable: true, error: false, loading: false };
196
+ if (orderType === "hype_duel" && selectedSrcToken?.address?.toLowerCase() === B3_TOKEN.address.toLowerCase()) {
197
+ return { text: "Convert to HYPE using B3", disable: false, error: false, loading: false };
198
+ }
193
199
  if (isLoadingAnyspendQuote) return { text: "Loading quote...", disable: true, error: false, loading: true };
194
200
  if (isCreatingOrder || isCreatingOnrampOrder)
195
201
  return { text: "Creating order...", disable: true, error: false, loading: true };
@@ -259,9 +265,14 @@ function AnySpendCustomExactInInner({
259
265
  minDestinationAmount,
260
266
  DESTINATION_TOKEN_DETAILS.SYMBOL,
261
267
  orderType,
268
+ selectedSrcToken,
262
269
  ]);
263
270
 
264
271
  const onMainButtonClick = async () => {
272
+ if (orderType === "hype_duel" && selectedSrcToken?.address?.toLowerCase() === B3_TOKEN.address.toLowerCase()) {
273
+ onOpenCustomModal?.();
274
+ return;
275
+ }
265
276
  if (btnInfo.disable) return;
266
277
 
267
278
  if (!selectedRecipientOrDefault) {
@@ -16,6 +16,7 @@ export interface AnySpendDepositHypeProps {
16
16
  sourceTokenAddress?: string;
17
17
  sourceTokenChainId?: number;
18
18
  onSuccess?: () => void;
19
+ onOpenCustomModal?: () => void;
19
20
  mainFooter?: React.ReactNode;
20
21
  /**
21
22
  * Called when a token is selected. Call event.preventDefault() to prevent default token selection behavior.
@@ -34,6 +35,7 @@ export function AnySpendDepositHype({
34
35
  sourceTokenAddress,
35
36
  sourceTokenChainId,
36
37
  onSuccess,
38
+ onOpenCustomModal,
37
39
  mainFooter,
38
40
  onTokenSelect,
39
41
  customUsdInputValues,
@@ -75,6 +77,7 @@ export function AnySpendDepositHype({
75
77
  minDestinationAmount={10}
76
78
  header={header}
77
79
  onSuccess={onSuccess}
80
+ onOpenCustomModal={onOpenCustomModal}
78
81
  mainFooter={mainFooter}
79
82
  onTokenSelect={onTokenSelect}
80
83
  customUsdInputValues={customUsdInputValues}
@@ -17,6 +17,7 @@ export interface TokenBalanceResult {
17
17
  rawBalance: bigint | null;
18
18
  formattedBalance: string;
19
19
  isLoading: boolean;
20
+ refetch: () => void;
20
21
  }
21
22
 
22
23
  export function useTokenBalanceDirect({ token, address }: UseTokenBalanceProps): TokenBalanceResult {
@@ -80,5 +81,6 @@ export function useTokenBalanceDirect({ token, address }: UseTokenBalanceProps):
80
81
  rawBalance: tokenBalance?.raw || BigInt(0),
81
82
  formattedBalance: tokenBalance?.formatted || "0",
82
83
  isLoading: isActuallyLoading,
84
+ refetch,
83
85
  };
84
86
  }
@@ -385,6 +385,8 @@ export interface AnySpendDepositHypeProps extends BaseModalProps {
385
385
  mainFooter?: React.ReactNode;
386
386
  /** Callback function called when the deposit is successful */
387
387
  onSuccess?: (amount?: string) => void;
388
+ /** Callback function trigger open custom modal */
389
+ onOpenCustomModal?: () => void;
388
390
  /** Custom USD input values for quick amount buttons in fiat onramp */
389
391
  customUsdInputValues?: string[];
390
392
  /** prefer eoa wallet */