@b3dotfun/sdk 0.1.70-alpha.1 → 0.1.70-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.
- package/dist/cjs/anyspend/react/components/AnySpendBondKit.d.ts +1 -1
- package/dist/cjs/anyspend/react/components/AnySpendBondKit.js +2 -2
- package/dist/cjs/anyspend/react/components/AnySpendBuySpin.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnySpendBuySpin.js +2 -2
- package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.d.ts +2 -0
- package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.js +21 -14
- package/dist/cjs/anyspend/react/components/AnySpendDeposit.js +9 -3
- package/dist/cjs/anyspend/react/components/AnySpendDepositUpside.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnySpendDepositUpside.js +2 -2
- package/dist/cjs/anyspend/react/components/AnySpendStakeB3.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnySpendStakeB3.js +2 -2
- package/dist/cjs/anyspend/react/components/AnySpendStakeB3ExactIn.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnySpendStakeB3ExactIn.js +2 -2
- package/dist/cjs/anyspend/react/components/AnySpendStakeUpsideExactIn.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnySpendStakeUpsideExactIn.js +2 -2
- package/dist/cjs/anyspend/react/components/AnySpendWorkflowTrigger.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/AnySpendWorkflowTrigger.js +2 -2
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +2 -2
- package/dist/cjs/anyspend/react/components/AnyspendSignatureMint.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/AnyspendSignatureMint.js +2 -2
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckout.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckout.js +2 -2
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckoutTrigger.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckoutTrigger.js +2 -2
- package/dist/cjs/anyspend/react/components/checkout/CheckoutPaymentPanel.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/CheckoutPaymentPanel.js +13 -3
- package/dist/cjs/global-account/react/components/B3Provider/B3ConfigProvider.d.ts +1 -5
- package/dist/cjs/global-account/react/components/B3Provider/B3ConfigProvider.js +1 -2
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.d.ts +1 -17
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.js +2 -3
- package/dist/cjs/global-account/react/components/B3Provider/BetterAuthProvider.js +5 -6
- package/dist/cjs/global-account/react/components/index.d.ts +0 -1
- package/dist/cjs/global-account/react/components/index.js +3 -5
- package/dist/cjs/global-account/react/hooks/useBetterAuth.js +13 -14
- package/dist/cjs/global-account/react/stores/useModalStore.d.ts +28 -0
- package/dist/esm/anyspend/react/components/AnySpendBondKit.d.ts +1 -1
- package/dist/esm/anyspend/react/components/AnySpendBondKit.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendBuySpin.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnySpendBuySpin.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.d.ts +2 -0
- package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.js +21 -14
- package/dist/esm/anyspend/react/components/AnySpendDeposit.js +10 -4
- package/dist/esm/anyspend/react/components/AnySpendDepositUpside.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnySpendDepositUpside.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendStakeB3.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnySpendStakeB3.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendStakeB3ExactIn.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnySpendStakeB3ExactIn.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendStakeUpsideExactIn.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnySpendStakeUpsideExactIn.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendWorkflowTrigger.d.ts +3 -1
- package/dist/esm/anyspend/react/components/AnySpendWorkflowTrigger.js +2 -2
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +2 -2
- package/dist/esm/anyspend/react/components/AnyspendSignatureMint.d.ts +2 -1
- package/dist/esm/anyspend/react/components/AnyspendSignatureMint.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckout.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckout.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckoutTrigger.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckoutTrigger.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/CheckoutPaymentPanel.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/CheckoutPaymentPanel.js +14 -4
- package/dist/esm/global-account/react/components/B3Provider/B3ConfigProvider.d.ts +1 -5
- package/dist/esm/global-account/react/components/B3Provider/B3ConfigProvider.js +1 -2
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts +1 -17
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.js +2 -3
- package/dist/esm/global-account/react/components/B3Provider/BetterAuthProvider.js +3 -4
- package/dist/esm/global-account/react/components/index.d.ts +0 -1
- package/dist/esm/global-account/react/components/index.js +0 -1
- package/dist/esm/global-account/react/hooks/useBetterAuth.js +6 -7
- package/dist/esm/global-account/react/stores/useModalStore.d.ts +28 -0
- package/dist/types/anyspend/react/components/AnySpendBondKit.d.ts +1 -1
- package/dist/types/anyspend/react/components/AnySpendBuySpin.d.ts +2 -1
- package/dist/types/anyspend/react/components/AnySpendCustomExactIn.d.ts +2 -0
- package/dist/types/anyspend/react/components/AnySpendDepositUpside.d.ts +2 -1
- package/dist/types/anyspend/react/components/AnySpendStakeB3.d.ts +2 -1
- package/dist/types/anyspend/react/components/AnySpendStakeB3ExactIn.d.ts +2 -1
- package/dist/types/anyspend/react/components/AnySpendStakeUpsideExactIn.d.ts +2 -1
- package/dist/types/anyspend/react/components/AnySpendWorkflowTrigger.d.ts +3 -1
- package/dist/types/anyspend/react/components/AnyspendDepositHype.d.ts +2 -1
- package/dist/types/anyspend/react/components/AnyspendSignatureMint.d.ts +2 -1
- package/dist/types/anyspend/react/components/checkout/AnySpendCheckout.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/AnySpendCheckoutTrigger.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/CheckoutPaymentPanel.d.ts +3 -1
- package/dist/types/global-account/react/components/B3Provider/B3ConfigProvider.d.ts +1 -5
- package/dist/types/global-account/react/components/B3Provider/B3Provider.d.ts +1 -17
- package/dist/types/global-account/react/components/index.d.ts +0 -1
- package/dist/types/global-account/react/stores/useModalStore.d.ts +28 -0
- package/package.json +1 -1
- package/src/anyspend/react/components/AnySpendBondKit.tsx +2 -0
- package/src/anyspend/react/components/AnySpendBuySpin.tsx +3 -0
- package/src/anyspend/react/components/AnySpendCustomExactIn.tsx +29 -14
- package/src/anyspend/react/components/AnySpendDeposit.tsx +13 -3
- package/src/anyspend/react/components/AnySpendDepositUpside.tsx +3 -0
- package/src/anyspend/react/components/AnySpendStakeB3.tsx +3 -0
- package/src/anyspend/react/components/AnySpendStakeB3ExactIn.tsx +3 -0
- package/src/anyspend/react/components/AnySpendStakeUpsideExactIn.tsx +3 -0
- package/src/anyspend/react/components/AnySpendWorkflowTrigger.tsx +4 -0
- package/src/anyspend/react/components/AnyspendDepositHype.tsx +3 -0
- package/src/anyspend/react/components/AnyspendSignatureMint.tsx +3 -0
- package/src/anyspend/react/components/checkout/AnySpendCheckout.tsx +4 -0
- package/src/anyspend/react/components/checkout/AnySpendCheckoutTrigger.tsx +4 -0
- package/src/anyspend/react/components/checkout/CheckoutPaymentPanel.tsx +97 -79
- package/src/global-account/react/components/B3Provider/B3ConfigProvider.tsx +0 -6
- package/src/global-account/react/components/B3Provider/B3Provider.tsx +15 -36
- package/src/global-account/react/components/B3Provider/BetterAuthProvider.tsx +3 -4
- package/src/global-account/react/components/index.ts +0 -1
- package/src/global-account/react/hooks/useBetterAuth.ts +6 -7
- package/src/global-account/react/stores/useModalStore.ts +28 -0
- package/dist/cjs/global-account/react/components/B3Provider/BetterAuthClientProvider.d.ts +0 -17
- package/dist/cjs/global-account/react/components/B3Provider/BetterAuthClientProvider.js +0 -31
- package/dist/esm/global-account/react/components/B3Provider/BetterAuthClientProvider.d.ts +0 -17
- package/dist/esm/global-account/react/components/B3Provider/BetterAuthClientProvider.js +0 -27
- package/dist/types/global-account/react/components/B3Provider/BetterAuthClientProvider.d.ts +0 -17
- package/src/global-account/react/components/B3Provider/BetterAuthClientProvider.tsx +0 -40
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { AnySpendBondKitProps } from "../../../global-account/react/stores/useModalStore";
|
|
2
2
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
3
|
-
export declare function AnySpendBondKit({ mode, recipientAddress, contractAddress, minTokensOut, imageUrl, b3Amount: initialB3Amount, onSuccess, slots, content, theme, }: AnySpendBondKitProps & {
|
|
3
|
+
export declare function AnySpendBondKit({ mode, recipientAddress, contractAddress, minTokensOut, imageUrl, b3Amount: initialB3Amount, onSuccess, slots, content, theme, showFiatOption, }: AnySpendBondKitProps & {
|
|
4
4
|
slots?: AnySpendSlots;
|
|
5
5
|
content?: AnySpendContent;
|
|
6
6
|
theme?: AnySpendTheme;
|
|
@@ -23,7 +23,7 @@ function formatNumberWithCommas(x) {
|
|
|
23
23
|
parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
24
24
|
return parts.join(".");
|
|
25
25
|
}
|
|
26
|
-
function AnySpendBondKit({ mode = "modal", recipientAddress, contractAddress, minTokensOut = "0", imageUrl, b3Amount: initialB3Amount, onSuccess, slots, content, theme, }) {
|
|
26
|
+
function AnySpendBondKit({ mode = "modal", recipientAddress, contractAddress, minTokensOut = "0", imageUrl, b3Amount: initialB3Amount, onSuccess, slots, content, theme, showFiatOption, }) {
|
|
27
27
|
const hasMounted = (0, react_1.useHasMounted)();
|
|
28
28
|
const [showAmountPrompt, setShowAmountPrompt] = (0, react_3.useState)(!initialB3Amount);
|
|
29
29
|
const [b3Amount, setB3Amount] = (0, react_3.useState)(initialB3Amount || "");
|
|
@@ -203,5 +203,5 @@ function AnySpendBondKit({ mode = "modal", recipientAddress, contractAddress, mi
|
|
|
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
205
|
action: "BondKit Buy",
|
|
206
|
-
}, header: header, onSuccess: onSuccess, showRecipient: true, slots: slots, content: content, theme: theme }));
|
|
206
|
+
}, header: header, onSuccess: onSuccess, showRecipient: true, slots: slots, content: content, theme: theme, showFiatOption: showFiatOption }));
|
|
207
207
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
2
|
-
export declare function AnySpendBuySpin({ loadOrder, mode, spinwheelContractAddress, chainId, recipientAddress, prefillQuantity, onSuccess, senderAddress, slots, content, theme, }: {
|
|
2
|
+
export declare function AnySpendBuySpin({ loadOrder, mode, spinwheelContractAddress, chainId, recipientAddress, prefillQuantity, onSuccess, senderAddress, slots, content, theme, showFiatOption, }: {
|
|
3
3
|
loadOrder?: string;
|
|
4
4
|
mode?: "modal" | "page";
|
|
5
5
|
spinwheelContractAddress: string;
|
|
@@ -12,4 +12,5 @@ export declare function AnySpendBuySpin({ loadOrder, mode, spinwheelContractAddr
|
|
|
12
12
|
slots?: AnySpendSlots;
|
|
13
13
|
content?: AnySpendContent;
|
|
14
14
|
theme?: AnySpendTheme;
|
|
15
|
+
showFiatOption?: boolean;
|
|
15
16
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -90,7 +90,7 @@ const basePublicClient = (0, viem_1.createPublicClient)({
|
|
|
90
90
|
chain: supported_1.baseMainnet,
|
|
91
91
|
transport: (0, viem_1.http)(constants_1.PUBLIC_BASE_RPC_URL),
|
|
92
92
|
});
|
|
93
|
-
function AnySpendBuySpin({ loadOrder, mode = "modal", spinwheelContractAddress, chainId, recipientAddress, prefillQuantity, onSuccess, senderAddress, slots, content, theme, }) {
|
|
93
|
+
function AnySpendBuySpin({ loadOrder, mode = "modal", spinwheelContractAddress, chainId, recipientAddress, prefillQuantity, onSuccess, senderAddress, slots, content, theme, showFiatOption, }) {
|
|
94
94
|
const hasMounted = (0, react_1.useHasMounted)();
|
|
95
95
|
const { setB3ModalOpen } = (0, react_1.useModalStore)();
|
|
96
96
|
// Payment config state
|
|
@@ -396,5 +396,5 @@ function AnySpendBuySpin({ loadOrder, mode = "modal", spinwheelContractAddress,
|
|
|
396
396
|
const encodedData = generateEncodedDataForBuyEntriesAndSpin(address || "", userSpinQuantity);
|
|
397
397
|
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: {
|
|
398
398
|
action: `buy ${userSpinQuantity} spin${userSpinQuantity !== "1" ? "s" : ""}`,
|
|
399
|
-
}, header: header, onSuccess: txHash => onSuccess?.(txHash), showRecipient: false, senderAddress: senderAddress, slots: slots, content: content, theme: theme }));
|
|
399
|
+
}, header: header, onSuccess: txHash => onSuccess?.(txHash), showRecipient: false, senderAddress: senderAddress, slots: slots, content: content, theme: theme, showFiatOption: showFiatOption }));
|
|
400
400
|
}
|
|
@@ -55,6 +55,8 @@ export interface AnySpendCustomExactInProps {
|
|
|
55
55
|
content?: AnySpendContent;
|
|
56
56
|
/** Structured color/theme configuration */
|
|
57
57
|
theme?: AnySpendTheme;
|
|
58
|
+
/** Whether to show fiat payment option. Defaults to true. When false, paymentType is forced to "crypto". */
|
|
59
|
+
showFiatOption?: boolean;
|
|
58
60
|
}
|
|
59
61
|
export declare function AnySpendCustomExactIn(props: AnySpendCustomExactInProps): import("react/jsx-runtime").JSX.Element;
|
|
60
62
|
export {};
|
|
@@ -37,8 +37,9 @@ function AnySpendCustomExactIn(props) {
|
|
|
37
37
|
const fingerprintConfig = (0, AnySpendFingerprintWrapper_1.getFingerprintConfig)();
|
|
38
38
|
return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: (0, jsx_runtime_1.jsx)(AnySpendCustomizationContext_1.AnySpendCustomizationProvider, { slots: props.slots, content: props.content, theme: props.theme, children: (0, jsx_runtime_1.jsx)(AnySpendCustomExactInInner, { ...props }) }) }));
|
|
39
39
|
}
|
|
40
|
-
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, senderAddress, }) {
|
|
40
|
+
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, senderAddress, showFiatOption = true, }) {
|
|
41
41
|
const { slots, content } = (0, AnySpendCustomizationContext_1.useAnySpendCustomization)();
|
|
42
|
+
const effectivePaymentType = showFiatOption ? paymentType : "crypto";
|
|
42
43
|
const actionLabel = customExactInConfig?.action ?? "Custom Execution";
|
|
43
44
|
const setB3ModalOpen = (0, react_2.useModalStore)(state => state.setB3ModalOpen);
|
|
44
45
|
const DESTINATION_TOKEN_DETAILS = {
|
|
@@ -46,7 +47,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
46
47
|
LOGO_URI: destinationToken.metadata?.logoURI ?? "",
|
|
47
48
|
};
|
|
48
49
|
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, selectedDstToken, selectedDstChainId, srcAmount, setSrcAmount, dstAmount, dstAmountInput, setDstAmountInput, isSrcInputDirty, setIsSrcInputDirty, tradeType, selectedCryptoPaymentMethod, effectiveCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, hasEnoughBalance, isBalanceLoading, anyspendQuote, isLoadingAnyspendQuote, isQuoteLoading, activeInputAmountInWei, activeOutputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = (0, useAnyspendFlow_1.useAnyspendFlow)({
|
|
49
|
-
paymentType,
|
|
50
|
+
paymentType: effectivePaymentType,
|
|
50
51
|
recipientAddress,
|
|
51
52
|
loadOrder,
|
|
52
53
|
onTransactionSuccess: onSuccess,
|
|
@@ -65,10 +66,16 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
65
66
|
const { executeDirectTransfer, isTransferring: isSwitchingOrExecuting } = (0, useDirectTransfer_1.useDirectTransfer)();
|
|
66
67
|
// Check if source and destination are the same token on the same chain
|
|
67
68
|
const isSameChainSameToken = (0, react_4.useMemo)(() => {
|
|
68
|
-
return (
|
|
69
|
+
return (effectivePaymentType === "crypto" &&
|
|
69
70
|
selectedSrcChainId === selectedDstChainId &&
|
|
70
71
|
selectedSrcToken?.address?.toLowerCase() === selectedDstToken?.address?.toLowerCase());
|
|
71
|
-
}, [
|
|
72
|
+
}, [
|
|
73
|
+
effectivePaymentType,
|
|
74
|
+
selectedSrcChainId,
|
|
75
|
+
selectedDstChainId,
|
|
76
|
+
selectedSrcToken?.address,
|
|
77
|
+
selectedDstToken?.address,
|
|
78
|
+
]);
|
|
72
79
|
// Check if this is a direct transfer
|
|
73
80
|
const isDirectTransfer = isSameChainSameToken && allowDirectTransfer;
|
|
74
81
|
// State for direct transfer success
|
|
@@ -157,7 +164,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
157
164
|
};
|
|
158
165
|
}
|
|
159
166
|
}
|
|
160
|
-
if (
|
|
167
|
+
if (effectivePaymentType === "crypto") {
|
|
161
168
|
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
162
169
|
return { text: "Choose payment method", disable: false, error: false, loading: false };
|
|
163
170
|
}
|
|
@@ -174,7 +181,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
174
181
|
: `Execute ${actionLabel}`;
|
|
175
182
|
return { text: buttonText, disable: false, error: false, loading: false };
|
|
176
183
|
}
|
|
177
|
-
if (
|
|
184
|
+
if (effectivePaymentType === "fiat") {
|
|
178
185
|
if (selectedFiatPaymentMethod === FiatPaymentMethod_1.FiatPaymentMethod.NONE) {
|
|
179
186
|
return { text: "Select payment method", disable: false, error: false, loading: false };
|
|
180
187
|
}
|
|
@@ -189,7 +196,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
189
196
|
isSwitchingOrExecuting,
|
|
190
197
|
selectedRecipientOrDefault,
|
|
191
198
|
anyspendQuote,
|
|
192
|
-
|
|
199
|
+
effectivePaymentType,
|
|
193
200
|
effectiveCryptoPaymentMethod,
|
|
194
201
|
selectedFiatPaymentMethod,
|
|
195
202
|
hasEnoughBalance,
|
|
@@ -215,14 +222,14 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
215
222
|
setActivePanel(useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION);
|
|
216
223
|
return;
|
|
217
224
|
}
|
|
218
|
-
if (
|
|
225
|
+
if (effectivePaymentType === "crypto") {
|
|
219
226
|
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
220
227
|
setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD);
|
|
221
228
|
return;
|
|
222
229
|
}
|
|
223
230
|
await handleCryptoOrder();
|
|
224
231
|
}
|
|
225
|
-
else if (
|
|
232
|
+
else if (effectivePaymentType === "fiat") {
|
|
226
233
|
if (selectedFiatPaymentMethod === FiatPaymentMethod_1.FiatPaymentMethod.NONE) {
|
|
227
234
|
setActivePanel(useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD);
|
|
228
235
|
return;
|
|
@@ -232,8 +239,8 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
232
239
|
};
|
|
233
240
|
const headerContent = header ? (header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote })) : ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: actionLabel }), (0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary text-sm", children: "Pay from any token to execute a custom exact-in transaction." })] }) }));
|
|
234
241
|
const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: classes?.container ||
|
|
235
|
-
"anyspend-custom-exact-in-container mx-auto flex w-full max-w-[460px] flex-col items-center gap-2", children: [headerContent, (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [
|
|
236
|
-
"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: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }),
|
|
242
|
+
"anyspend-custom-exact-in-container mx-auto flex w-full max-w-[460px] flex-col items-center gap-2", children: [headerContent, (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [effectivePaymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : ((0, jsx_runtime_1.jsx)(react_3.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: (0, jsx_runtime_1.jsx)(PanelOnramp_1.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: useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues, customRecipientLabel: customRecipientLabel }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("relative -my-1 flex h-0 items-center justify-center", effectivePaymentType === "fiat" && "hidden"), children: (0, jsx_runtime_1.jsx)(react_2.Button, { variant: "ghost", className: classes?.swapDirectionButton ||
|
|
243
|
+
"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: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), effectivePaymentType === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: false, effectiveRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, customRecipientLabel: customRecipientLabel, onSelectRecipient: () => setActivePanel(useAnyspendFlow_1.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 => {
|
|
237
244
|
setIsSrcInputDirty(false);
|
|
238
245
|
setDstAmountInput(value);
|
|
239
246
|
}, disableAmountInput: !!destinationTokenAmount, anyspendQuote: isDirectTransfer ? undefined : anyspendQuote, onShowPointsDetail: isDirectTransfer ? undefined : () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL), onShowFeeDetail: isDirectTransfer ? undefined : () => setActivePanel(useAnyspendFlow_1.PanelView.FEE_DETAIL) }))] }) }), (0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: slots.actionButton ? (slots.actionButton({
|
|
@@ -244,7 +251,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
244
251
|
})) : ((0, jsx_runtime_1.jsx)(react_2.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (btnInfo.error && classes?.mainButtonError) ||
|
|
245
252
|
(btnInfo.disable && classes?.mainButtonDisabled) ||
|
|
246
253
|
classes?.mainButton ||
|
|
247
|
-
(0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) })) }), gasPriceData && !isLoadingGas &&
|
|
254
|
+
(0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) })) }), gasPriceData && !isLoadingGas && effectivePaymentType === "crypto" && !isDirectTransfer && ((0, jsx_runtime_1.jsx)(GasIndicator_1.GasIndicator, { gasPrice: gasPriceData, className: classes?.gasIndicator || "mt-2 w-full" })), mainFooter ? mainFooter : null] }));
|
|
248
255
|
const handleCryptoOrder = async () => {
|
|
249
256
|
try {
|
|
250
257
|
const isDirectTransfer = isSameChainSameToken && allowDirectTransfer;
|
|
@@ -399,7 +406,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
399
406
|
react_2.toast.error("Failed to create order: " + err.message);
|
|
400
407
|
}
|
|
401
408
|
};
|
|
402
|
-
const orderDetailsView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto w-full max-w-[460px]", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex flex-col gap-4", children: oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod:
|
|
409
|
+
const orderDetailsView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto w-full max-w-[460px]", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex flex-col gap-4", children: oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: effectivePaymentType === "fiat" ? CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE : effectiveCryptoPaymentMethod, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onPaymentMethodChange: setSelectedCryptoPaymentMethod, onBack: () => {
|
|
403
410
|
setOrderId(undefined);
|
|
404
411
|
setActivePanel(useAnyspendFlow_1.PanelView.MAIN);
|
|
405
412
|
}, disableUrlParamManagement: true, points: oat.data.points || undefined, returnToHomeUrl: returnToHomeUrl, returnHomeLabel: returnHomeLabel })) }) }));
|
|
@@ -417,7 +424,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
417
424
|
setActivePanel(useAnyspendFlow_1.PanelView.MAIN);
|
|
418
425
|
}, srcAmountOnRamp: srcAmount }));
|
|
419
426
|
const pointsDetailView = ((0, jsx_runtime_1.jsx)(PointsDetailPanel_1.PointsDetailPanel, { pointsAmount: anyspendQuote?.data?.pointsAmount || 0, onBack: () => setActivePanel(useAnyspendFlow_1.PanelView.MAIN) }));
|
|
420
|
-
const feeDetailView = anyspendQuote?.data?.fee ? ((0, jsx_runtime_1.jsx)(FeeDetailPanel_1.FeeDetailPanel, { fee: anyspendQuote.data.fee, transactionAmountUsd:
|
|
427
|
+
const feeDetailView = anyspendQuote?.data?.fee ? ((0, jsx_runtime_1.jsx)(FeeDetailPanel_1.FeeDetailPanel, { fee: anyspendQuote.data.fee, transactionAmountUsd: effectivePaymentType === "fiat"
|
|
421
428
|
? parseFloat(srcAmount)
|
|
422
429
|
: anyspendQuote.data.currencyIn?.amountUsd
|
|
423
430
|
? Number(anyspendQuote.data.currencyIn.amountUsd)
|
|
@@ -102,11 +102,17 @@ function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentT
|
|
|
102
102
|
const depositClasses = classes?.deposit;
|
|
103
103
|
const { connectedEOAWallet } = (0, react_1.useAccountWallet)();
|
|
104
104
|
const eoaAddress = connectedEOAWallet?.getAccount()?.address;
|
|
105
|
+
const effectiveInitialPaymentType = !showFiatOption && initialPaymentType === "fiat" ? "crypto" : initialPaymentType;
|
|
105
106
|
// Determine if we should show chain selection
|
|
106
|
-
const shouldShowChainSelection = showChainSelection ?? (!initialSourceChainId && !
|
|
107
|
+
const shouldShowChainSelection = showChainSelection ?? (!initialSourceChainId && !effectiveInitialPaymentType);
|
|
107
108
|
const [step, setStep] = (0, react_3.useState)(shouldShowChainSelection ? "select-chain" : "deposit");
|
|
108
109
|
const [selectedChainId, setSelectedChainId] = (0, react_3.useState)(initialSourceChainId);
|
|
109
|
-
const [paymentType, setPaymentType] = (0, react_3.useState)(
|
|
110
|
+
const [paymentType, setPaymentType] = (0, react_3.useState)(effectiveInitialPaymentType ?? "crypto");
|
|
111
|
+
(0, react_3.useEffect)(() => {
|
|
112
|
+
if (!showFiatOption && paymentType === "fiat") {
|
|
113
|
+
setPaymentType("crypto");
|
|
114
|
+
}
|
|
115
|
+
}, [showFiatOption, paymentType]);
|
|
110
116
|
// Fetch destination token data
|
|
111
117
|
const { data: destinationTokenData } = (0, react_1.useTokenData)(destinationTokenChainId, destinationTokenAddress);
|
|
112
118
|
// Construct full destination token object
|
|
@@ -210,5 +216,5 @@ function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentT
|
|
|
210
216
|
// Deposit view
|
|
211
217
|
return ((0, jsx_runtime_1.jsxs)("div", { className: depositClasses?.form || "anyspend-deposit anyspend-deposit-form relative", children: [shouldShowChainSelection && ((0, jsx_runtime_1.jsxs)("button", { onClick: handleBack, className: depositClasses?.backButton ||
|
|
212
218
|
"anyspend-deposit-back-button text-as-secondary hover:text-as-primary absolute left-4 top-4 z-10 flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("svg", { className: depositClasses?.backIcon || "anyspend-deposit-back-icon h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), (0, jsx_runtime_1.jsx)("span", { className: depositClasses?.backText || "anyspend-deposit-back-text text-sm", children: "Back" })] })), onClose && ((0, jsx_runtime_1.jsx)("button", { onClick: onClose, className: depositClasses?.closeButton ||
|
|
213
|
-
"anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: (0, jsx_runtime_1.jsx)("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), (0, jsx_runtime_1.jsx)("div", { className: depositClasses?.formContent || (0, cn_1.cn)("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.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, senderAddress: senderAddress, slots: slots, content: content, theme: theme }, selectedChainId)) : ((0, jsx_runtime_1.jsx)(AnySpend_1.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, senderAddress: senderAddress, slots: slots, content: content, theme: theme }, selectedChainId)) }), (0, jsx_runtime_1.jsx)(WarningText_1.ChainWarningText, { chainId: destinationTokenChainId, classes: classes?.chainWarningText || { root: "px-4 pb-4" } })] }));
|
|
219
|
+
"anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: (0, jsx_runtime_1.jsx)("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), (0, jsx_runtime_1.jsx)("div", { className: depositClasses?.formContent || (0, cn_1.cn)("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.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, senderAddress: senderAddress, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }, selectedChainId)) : ((0, jsx_runtime_1.jsx)(AnySpend_1.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, senderAddress: senderAddress, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }, selectedChainId)) }), (0, jsx_runtime_1.jsx)(WarningText_1.ChainWarningText, { chainId: destinationTokenChainId, classes: classes?.chainWarningText || { root: "px-4 pb-4" } })] }));
|
|
214
220
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { components } from "../../../anyspend/types/api";
|
|
2
2
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
3
|
-
export declare function AnySpendDepositUpside({ loadOrder, mode, recipientAddress, sourceTokenAddress, sourceTokenChainId, depositContractAddress, token, onSuccess, senderAddress, slots, content, theme, }: {
|
|
3
|
+
export declare function AnySpendDepositUpside({ loadOrder, mode, recipientAddress, sourceTokenAddress, sourceTokenChainId, depositContractAddress, token, onSuccess, senderAddress, showFiatOption, slots, content, theme, }: {
|
|
4
4
|
loadOrder?: string;
|
|
5
5
|
mode?: "modal" | "page";
|
|
6
6
|
recipientAddress: string;
|
|
@@ -11,6 +11,7 @@ export declare function AnySpendDepositUpside({ loadOrder, mode, recipientAddres
|
|
|
11
11
|
onSuccess?: (amount: string) => void;
|
|
12
12
|
/** Optional sender (payer) address — pre-fills token balances when the user address is known ahead of time */
|
|
13
13
|
senderAddress?: string;
|
|
14
|
+
showFiatOption?: boolean;
|
|
14
15
|
slots?: AnySpendSlots;
|
|
15
16
|
content?: AnySpendContent;
|
|
16
17
|
theme?: AnySpendTheme;
|
|
@@ -25,7 +25,7 @@ const DEPOSIT_FOR_FUNCTION_ABI = JSON.stringify([
|
|
|
25
25
|
type: "function",
|
|
26
26
|
},
|
|
27
27
|
]);
|
|
28
|
-
function AnySpendDepositUpside({ loadOrder, mode = "modal", recipientAddress, sourceTokenAddress, sourceTokenChainId, depositContractAddress, token, onSuccess, senderAddress, slots, content, theme, }) {
|
|
28
|
+
function AnySpendDepositUpside({ loadOrder, mode = "modal", recipientAddress, sourceTokenAddress, sourceTokenChainId, depositContractAddress, token, onSuccess, senderAddress, showFiatOption, slots, content, theme, }) {
|
|
29
29
|
if (!recipientAddress)
|
|
30
30
|
return null;
|
|
31
31
|
const header = () => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { className: "from-b3-react-background to-as-on-surface-1 w-full rounded-t-lg bg-gradient-to-t", children: (0, jsx_runtime_1.jsx)("div", { className: "mb-1 flex w-full flex-col items-center gap-2", children: (0, jsx_runtime_1.jsxs)("span", { className: "font-sf-rounded text-2xl font-semibold", children: ["Swap & Deposit ", token.symbol] }) }) }) }));
|
|
@@ -37,5 +37,5 @@ function AnySpendDepositUpside({ loadOrder, mode = "modal", recipientAddress, so
|
|
|
37
37
|
spenderAddress: depositContractAddress,
|
|
38
38
|
action: `deposit ${token.symbol}`,
|
|
39
39
|
};
|
|
40
|
-
return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: token, destinationChainId: chains_1.base.id, customExactInConfig: customExactInConfig, header: header, onSuccess: onSuccess, senderAddress: senderAddress, slots: slots, content: content, theme: theme }));
|
|
40
|
+
return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: token, destinationChainId: chains_1.base.id, customExactInConfig: customExactInConfig, header: header, onSuccess: onSuccess, senderAddress: senderAddress, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }));
|
|
41
41
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
2
|
-
export declare function AnySpendStakeB3({ loadOrder, mode, recipientAddress, stakeAmount, onSuccess, senderAddress, slots, content, theme, }: {
|
|
2
|
+
export declare function AnySpendStakeB3({ loadOrder, mode, recipientAddress, stakeAmount, onSuccess, senderAddress, slots, content, theme, showFiatOption, }: {
|
|
3
3
|
loadOrder?: string;
|
|
4
4
|
mode?: "modal" | "page";
|
|
5
5
|
recipientAddress: string;
|
|
@@ -10,4 +10,5 @@ export declare function AnySpendStakeB3({ loadOrder, mode, recipientAddress, sta
|
|
|
10
10
|
slots?: AnySpendSlots;
|
|
11
11
|
content?: AnySpendContent;
|
|
12
12
|
theme?: AnySpendTheme;
|
|
13
|
+
showFiatOption?: boolean;
|
|
13
14
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -34,7 +34,7 @@ function generateEncodedDataForStakingB3(amount, beneficiary) {
|
|
|
34
34
|
});
|
|
35
35
|
return encodedData;
|
|
36
36
|
}
|
|
37
|
-
function AnySpendStakeB3({ loadOrder, mode = "modal", recipientAddress, stakeAmount, onSuccess, senderAddress, slots, content, theme, }) {
|
|
37
|
+
function AnySpendStakeB3({ loadOrder, mode = "modal", recipientAddress, stakeAmount, onSuccess, senderAddress, slots, content, theme, showFiatOption, }) {
|
|
38
38
|
const hasMounted = (0, react_1.useHasMounted)();
|
|
39
39
|
const { setB3ModalOpen } = (0, react_1.useModalStore)();
|
|
40
40
|
// Wagmi hooks for direct staking
|
|
@@ -276,5 +276,5 @@ function AnySpendStakeB3({ loadOrder, mode = "modal", recipientAddress, stakeAmo
|
|
|
276
276
|
const encodedData = generateEncodedDataForStakingB3(userStakeAmount, recipientAddress);
|
|
277
277
|
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: {
|
|
278
278
|
action: "stake B3",
|
|
279
|
-
}, header: header, onSuccess: onSuccess, showRecipient: true, senderAddress: senderAddress, slots: slots, content: content, theme: theme }));
|
|
279
|
+
}, header: header, onSuccess: onSuccess, showRecipient: true, senderAddress: senderAddress, slots: slots, content: content, theme: theme, showFiatOption: showFiatOption }));
|
|
280
280
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
2
|
-
export declare function AnySpendStakeB3ExactIn({ loadOrder, mode, sourceTokenAddress, sourceTokenChainId, recipientAddress, stakeAmount, onSuccess, senderAddress, slots, content, theme, }: {
|
|
2
|
+
export declare function AnySpendStakeB3ExactIn({ loadOrder, mode, sourceTokenAddress, sourceTokenChainId, recipientAddress, stakeAmount, onSuccess, senderAddress, showFiatOption, slots, content, theme, }: {
|
|
3
3
|
loadOrder?: string;
|
|
4
4
|
mode?: "modal" | "page";
|
|
5
5
|
sourceTokenAddress?: string;
|
|
@@ -9,6 +9,7 @@ export declare function AnySpendStakeB3ExactIn({ loadOrder, mode, sourceTokenAdd
|
|
|
9
9
|
onSuccess?: (amount: string) => void;
|
|
10
10
|
/** Optional sender (payer) address — pre-fills token balances when the user address is known ahead of time */
|
|
11
11
|
senderAddress?: string;
|
|
12
|
+
showFiatOption?: boolean;
|
|
12
13
|
slots?: AnySpendSlots;
|
|
13
14
|
content?: AnySpendContent;
|
|
14
15
|
theme?: AnySpendTheme;
|
|
@@ -34,7 +34,7 @@ const STAKE_FUNCTION_ABI = JSON.stringify([
|
|
|
34
34
|
outputs: [],
|
|
35
35
|
},
|
|
36
36
|
]);
|
|
37
|
-
function AnySpendStakeB3ExactIn({ loadOrder, mode = "modal", sourceTokenAddress, sourceTokenChainId, recipientAddress, stakeAmount, onSuccess, senderAddress, slots, content, theme, }) {
|
|
37
|
+
function AnySpendStakeB3ExactIn({ loadOrder, mode = "modal", sourceTokenAddress, sourceTokenChainId, recipientAddress, stakeAmount, onSuccess, senderAddress, showFiatOption, slots, content, theme, }) {
|
|
38
38
|
const hasMounted = (0, react_1.useHasMounted)();
|
|
39
39
|
const { setB3ModalOpen } = (0, react_1.useModalStore)();
|
|
40
40
|
// Wagmi hooks for direct staking
|
|
@@ -283,5 +283,5 @@ function AnySpendStakeB3ExactIn({ loadOrder, mode = "modal", sourceTokenAddress,
|
|
|
283
283
|
onSuccess?.((0, number_1.formatTokenAmount)(BigInt(userStakeAmount), 18) ?? "");
|
|
284
284
|
}, className: "bg-as-brand hover:bg-as-brand/90 text-as-primary h-14 w-full rounded-xl text-lg font-medium", children: "Done" })] })] }) }));
|
|
285
285
|
}
|
|
286
|
-
return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: anyspend_1.B3_TOKEN, destinationChainId: chains_1.base.id, customExactInConfig: customExactInConfig, header: header, onSuccess: onSuccess, senderAddress: senderAddress, slots: slots, content: content, theme: theme }));
|
|
286
|
+
return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: anyspend_1.B3_TOKEN, destinationChainId: chains_1.base.id, customExactInConfig: customExactInConfig, header: header, onSuccess: onSuccess, senderAddress: senderAddress, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }));
|
|
287
287
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { components } from "../../../anyspend/types/api";
|
|
2
2
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
3
|
-
export declare function AnySpendStakeUpsideExactIn({ loadOrder, mode, recipientAddress, sourceTokenAddress, sourceTokenChainId, destinationTokenAmount, stakingContractAddress, token, onSuccess, senderAddress, slots, content, theme, }: {
|
|
3
|
+
export declare function AnySpendStakeUpsideExactIn({ loadOrder, mode, recipientAddress, sourceTokenAddress, sourceTokenChainId, destinationTokenAmount, stakingContractAddress, token, onSuccess, senderAddress, showFiatOption, slots, content, theme, }: {
|
|
4
4
|
loadOrder?: string;
|
|
5
5
|
mode?: "modal" | "page";
|
|
6
6
|
recipientAddress: string;
|
|
@@ -12,6 +12,7 @@ export declare function AnySpendStakeUpsideExactIn({ loadOrder, mode, recipientA
|
|
|
12
12
|
onSuccess?: (amount: string) => void;
|
|
13
13
|
/** Optional sender (payer) address — pre-fills token balances when the user address is known ahead of time */
|
|
14
14
|
senderAddress?: string;
|
|
15
|
+
showFiatOption?: boolean;
|
|
15
16
|
slots?: AnySpendSlots;
|
|
16
17
|
content?: AnySpendContent;
|
|
17
18
|
theme?: AnySpendTheme;
|
|
@@ -17,7 +17,7 @@ const STAKE_FOR_FUNCTION_ABI = JSON.stringify([
|
|
|
17
17
|
outputs: [],
|
|
18
18
|
},
|
|
19
19
|
]);
|
|
20
|
-
function AnySpendStakeUpsideExactIn({ loadOrder, mode = "modal", recipientAddress, sourceTokenAddress, sourceTokenChainId, destinationTokenAmount, stakingContractAddress, token, onSuccess, senderAddress, slots, content, theme, }) {
|
|
20
|
+
function AnySpendStakeUpsideExactIn({ loadOrder, mode = "modal", recipientAddress, sourceTokenAddress, sourceTokenChainId, destinationTokenAmount, stakingContractAddress, token, onSuccess, senderAddress, showFiatOption, slots, content, theme, }) {
|
|
21
21
|
if (!recipientAddress)
|
|
22
22
|
return null;
|
|
23
23
|
const header = () => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { className: "from-b3-react-background to-as-on-surface-1 w-full rounded-t-lg bg-gradient-to-t", children: (0, jsx_runtime_1.jsx)("div", { className: "mb-1 flex w-full flex-col items-center gap-2", children: (0, jsx_runtime_1.jsxs)("span", { className: "font-sf-rounded text-2xl font-semibold", children: ["Swap & Stake ", token.symbol, " (Exact In)"] }) }) }) }));
|
|
@@ -29,5 +29,5 @@ function AnySpendStakeUpsideExactIn({ loadOrder, mode = "modal", recipientAddres
|
|
|
29
29
|
spenderAddress: stakingContractAddress,
|
|
30
30
|
action: `stake ${token.symbol}`,
|
|
31
31
|
};
|
|
32
|
-
return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: token, destinationChainId: chains_1.base.id, destinationTokenAmount: destinationTokenAmount, customExactInConfig: customExactInConfig, header: header, onSuccess: onSuccess, senderAddress: senderAddress, slots: slots, content: content, theme: theme }));
|
|
32
|
+
return ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: sourceTokenChainId, destinationToken: token, destinationChainId: chains_1.base.id, destinationTokenAmount: destinationTokenAmount, customExactInConfig: customExactInConfig, header: header, onSuccess: onSuccess, senderAddress: senderAddress, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }));
|
|
33
33
|
}
|
|
@@ -27,5 +27,7 @@ export interface AnySpendWorkflowTriggerProps {
|
|
|
27
27
|
actionLabel?: string;
|
|
28
28
|
/** Custom class names */
|
|
29
29
|
classes?: AnySpendAllClasses;
|
|
30
|
+
/** Whether to show fiat payment option. Defaults to true. */
|
|
31
|
+
showFiatOption?: boolean;
|
|
30
32
|
}
|
|
31
|
-
export declare function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, }: AnySpendWorkflowTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
33
|
+
export declare function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, showFiatOption, }: AnySpendWorkflowTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -4,11 +4,11 @@ exports.AnySpendWorkflowTrigger = AnySpendWorkflowTrigger;
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const AnySpendDeposit_1 = require("./AnySpendDeposit");
|
|
7
|
-
function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, }) {
|
|
7
|
+
function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, showFiatOption, }) {
|
|
8
8
|
const metadata = (0, react_1.useMemo)(() => ({
|
|
9
9
|
workflowId,
|
|
10
10
|
orgId,
|
|
11
11
|
...callbackMetadata,
|
|
12
12
|
}), [workflowId, orgId, callbackMetadata]);
|
|
13
|
-
return ((0, jsx_runtime_1.jsx)(AnySpendDeposit_1.AnySpendDeposit, { recipientAddress: recipientAddress, destinationTokenAddress: tokenAddress, destinationTokenChainId: chainId, destinationTokenAmount: amount, callbackMetadata: metadata, onSuccess: onSuccess, onClose: onClose, mode: mode, actionLabel: actionLabel, classes: classes, allowDirectTransfer: true }));
|
|
13
|
+
return ((0, jsx_runtime_1.jsx)(AnySpendDeposit_1.AnySpendDeposit, { recipientAddress: recipientAddress, destinationTokenAddress: tokenAddress, destinationTokenChainId: chainId, destinationTokenAmount: amount, callbackMetadata: metadata, onSuccess: onSuccess, onClose: onClose, mode: mode, actionLabel: actionLabel, classes: classes, allowDirectTransfer: true, showFiatOption: showFiatOption }));
|
|
14
14
|
}
|
|
@@ -29,8 +29,9 @@ export interface AnySpendDepositHypeProps {
|
|
|
29
29
|
customRecipientLabel?: string;
|
|
30
30
|
/** Optional sender (payer) address — pre-fills token balances when the user address is known ahead of time */
|
|
31
31
|
senderAddress?: string;
|
|
32
|
+
showFiatOption?: boolean;
|
|
32
33
|
slots?: AnySpendSlots;
|
|
33
34
|
content?: AnySpendContent;
|
|
34
35
|
theme?: AnySpendTheme;
|
|
35
36
|
}
|
|
36
|
-
export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, senderAddress, slots, content, theme, }: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element | null;
|
|
37
|
+
export declare function AnySpendDepositHype({ loadOrder, mode, recipientAddress, paymentType, sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, senderAddress, showFiatOption, slots, content, theme, }: 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, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, senderAddress, slots, content, theme, }) {
|
|
13
|
+
function AnySpendDepositHype({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, senderAddress, showFiatOption, slots, content, theme, }) {
|
|
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, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, senderAddress: senderAddress, slots: slots, content: content, theme: theme }));
|
|
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, senderAddress: senderAddress, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }));
|
|
27
27
|
}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { GenerateSigMintResponse } from "../../types/signatureMint";
|
|
2
2
|
import type { AnySpendContent, AnySpendSlots, AnySpendTheme } from "./types/customization";
|
|
3
|
-
export declare function AnyspendSignatureMint({ loadOrder, mode, signatureData, imageUrl, onSuccess, slots, content, theme, }: {
|
|
3
|
+
export declare function AnyspendSignatureMint({ loadOrder, mode, signatureData, imageUrl, onSuccess, showFiatOption, slots, content, theme, }: {
|
|
4
4
|
loadOrder?: string;
|
|
5
5
|
mode?: "modal" | "page";
|
|
6
6
|
signatureData: GenerateSigMintResponse;
|
|
7
7
|
imageUrl?: string;
|
|
8
8
|
onSuccess?: (txHash?: string) => void;
|
|
9
|
+
showFiatOption?: boolean;
|
|
9
10
|
slots?: AnySpendSlots;
|
|
10
11
|
content?: AnySpendContent;
|
|
11
12
|
theme?: AnySpendTheme;
|
|
@@ -41,7 +41,7 @@ function generateEncodedDataForSignatureMint(signatureData) {
|
|
|
41
41
|
});
|
|
42
42
|
return encodedData;
|
|
43
43
|
}
|
|
44
|
-
function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, imageUrl, onSuccess, slots, content, theme, }) {
|
|
44
|
+
function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, imageUrl, onSuccess, showFiatOption, slots, content, theme, }) {
|
|
45
45
|
// Get token data
|
|
46
46
|
const { data: tokenData, isError: isTokenError, isLoading, } = (0, react_1.useTokenData)(signatureData.collection.chainId, signatureData.collection.signatureRequestBody?.currency);
|
|
47
47
|
// Convert token data to AnySpend Token type
|
|
@@ -74,5 +74,5 @@ function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, image
|
|
|
74
74
|
const price = (0, viem_1.parseEther)(signatureData.payload.price?.toString() || "0");
|
|
75
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
76
|
action: "Signature Mint",
|
|
77
|
-
}, header: header, onSuccess: onSuccess, showRecipient: true, slots: slots, content: content, theme: theme }));
|
|
77
|
+
}, header: header, onSuccess: onSuccess, showRecipient: true, showFiatOption: showFiatOption, slots: slots, content: content, theme: theme }));
|
|
78
78
|
}
|
|
@@ -123,5 +123,7 @@ export interface AnySpendCheckoutProps {
|
|
|
123
123
|
kycEnabled?: boolean;
|
|
124
124
|
/** Extra metadata included under the 'callbackMetadata' key in the order's callbackMetadata (e.g. workflowId, orgId from checkout session) */
|
|
125
125
|
callbackMetadata?: Record<string, unknown>;
|
|
126
|
+
/** Whether to show fiat payment options (card + coinbase). Defaults to true. */
|
|
127
|
+
showFiatOption?: boolean;
|
|
126
128
|
}
|
|
127
|
-
export declare function AnySpendCheckout({ mode, recipientAddress, destinationTokenAddress, destinationTokenChainId, items, totalAmount: totalAmountOverride, organizationName, organizationLogo, themeColor, buttonText, checkoutSessionId, onSuccess, onError, returnUrl, returnLabel, classes, footer, defaultPaymentMethod, senderAddress, slots, content, theme, showPoints, showOrderId, shipping: shippingProp, tax, discount: discountProp, summaryLines, formSchema, formComponent, onFormSubmit, shippingOptions, collectShippingAddress, onShippingChange: onShippingChangeProp, enableDiscountCode, onDiscountApplied: onDiscountAppliedProp, validateDiscount, variablePricing, feeOnTop, kycEnabled, callbackMetadata: callbackMetadataProp, }: AnySpendCheckoutProps): import("react/jsx-runtime").JSX.Element;
|
|
129
|
+
export declare function AnySpendCheckout({ mode, recipientAddress, destinationTokenAddress, destinationTokenChainId, items, totalAmount: totalAmountOverride, organizationName, organizationLogo, themeColor, buttonText, checkoutSessionId, onSuccess, onError, returnUrl, returnLabel, classes, footer, defaultPaymentMethod, senderAddress, slots, content, theme, showPoints, showOrderId, shipping: shippingProp, tax, discount: discountProp, summaryLines, formSchema, formComponent, onFormSubmit, shippingOptions, collectShippingAddress, onShippingChange: onShippingChangeProp, enableDiscountCode, onDiscountApplied: onDiscountAppliedProp, validateDiscount, variablePricing, feeOnTop, kycEnabled, callbackMetadata: callbackMetadataProp, showFiatOption, }: AnySpendCheckoutProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -24,7 +24,7 @@ shippingOptions, collectShippingAddress, onShippingChange: onShippingChangeProp,
|
|
|
24
24
|
// New discount props
|
|
25
25
|
enableDiscountCode, onDiscountApplied: onDiscountAppliedProp, validateDiscount,
|
|
26
26
|
// Variable pricing
|
|
27
|
-
variablePricing, feeOnTop, kycEnabled = false, callbackMetadata: callbackMetadataProp, }) {
|
|
27
|
+
variablePricing, feeOnTop, kycEnabled = false, callbackMetadata: callbackMetadataProp, showFiatOption, }) {
|
|
28
28
|
// ===== Variable pricing state =====
|
|
29
29
|
const [variablePricingAmount, setVariablePricingAmount] = (0, react_2.useState)("0");
|
|
30
30
|
const isVariablePricingActive = variablePricing?.enabled === true;
|
|
@@ -210,5 +210,5 @@ variablePricing, feeOnTop, kycEnabled = false, callbackMetadata: callbackMetadat
|
|
|
210
210
|
successTitle: "Payment Successful",
|
|
211
211
|
successDescription: "Your payment has been processed successfully.",
|
|
212
212
|
...content,
|
|
213
|
-
}, theme: theme, children: (0, jsx_runtime_1.jsx)(CheckoutLayout_1.CheckoutLayout, { mode: mode, paymentPanel: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isVariablePricingActive && tokenData && variablePricing && ((0, jsx_runtime_1.jsx)(VariablePricingInput_1.VariablePricingInput, { config: variablePricing, tokenDecimals: tokenDecimals, tokenSymbol: tokenSymbol, themeColor: themeColor, onChange: setVariablePricingAmount })), hasFormContent && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-6", children: [(0, jsx_runtime_1.jsx)(CheckoutFormPanel_1.CheckoutFormPanel, { formSchema: formSchema, formComponent: formComponent, shippingOptions: shippingOptions, collectShippingAddress: collectShippingAddress, enableDiscountCode: enableDiscountCode, validateDiscount: validateDiscount, tokenSymbol: tokenSymbol, tokenDecimals: tokenDecimals, pricesLoading: isTokenDataLoading, classes: classes, formData: formData, onFormDataChange: handleFormDataChange, selectedShipping: selectedShipping, onShippingChange: handleShippingChange, appliedDiscount: appliedDiscount, onDiscountApplied: handleDiscountApplied, onDiscountRemoved: handleDiscountRemoved, shippingAddress: shippingAddress, onShippingAddressChange: setShippingAddress, checkoutFormSlot: slots?.checkoutForm }), (0, jsx_runtime_1.jsx)("div", { className: "mt-6 border-t border-gray-200 dark:border-neutral-700" })] })), (0, jsx_runtime_1.jsx)(CheckoutPaymentPanel_1.CheckoutPaymentPanel, { recipientAddress: recipientAddress, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, totalAmount: computedTotal, buttonText: buttonText, themeColor: themeColor, returnUrl: returnUrl, returnLabel: returnLabel, onSuccess: onSuccess, onError: onError, classes: classes, defaultPaymentMethod: defaultPaymentMethod, senderAddress: senderAddress, showPoints: showPoints, showOrderId: showOrderId, callbackMetadata: checkoutFormMetadata, isFormValid: isFormValid, feeOnTop: feeOnTop, kycEnabled: kycEnabled })] }), cartPanel: (0, jsx_runtime_1.jsx)(CheckoutCartPanel_1.CheckoutCartPanel, { items: items, totalAmount: computedTotal, tokenSymbol: tokenSymbol, tokenDecimals: tokenDecimals, pricesLoading: isTokenDataLoading, organizationName: organizationName, organizationLogo: organizationLogo, classes: classes, footer: footer, shipping: effectiveShipping, tax: typeof tax === "string" ? { amount: tax } : tax, discount: effectiveDiscount, summaryLines: summaryLines, usdEquivalent: usdEquivalent }), classes: classes }) }) }));
|
|
213
|
+
}, theme: theme, children: (0, jsx_runtime_1.jsx)(CheckoutLayout_1.CheckoutLayout, { mode: mode, paymentPanel: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isVariablePricingActive && tokenData && variablePricing && ((0, jsx_runtime_1.jsx)(VariablePricingInput_1.VariablePricingInput, { config: variablePricing, tokenDecimals: tokenDecimals, tokenSymbol: tokenSymbol, themeColor: themeColor, onChange: setVariablePricingAmount })), hasFormContent && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-6", children: [(0, jsx_runtime_1.jsx)(CheckoutFormPanel_1.CheckoutFormPanel, { formSchema: formSchema, formComponent: formComponent, shippingOptions: shippingOptions, collectShippingAddress: collectShippingAddress, enableDiscountCode: enableDiscountCode, validateDiscount: validateDiscount, tokenSymbol: tokenSymbol, tokenDecimals: tokenDecimals, pricesLoading: isTokenDataLoading, classes: classes, formData: formData, onFormDataChange: handleFormDataChange, selectedShipping: selectedShipping, onShippingChange: handleShippingChange, appliedDiscount: appliedDiscount, onDiscountApplied: handleDiscountApplied, onDiscountRemoved: handleDiscountRemoved, shippingAddress: shippingAddress, onShippingAddressChange: setShippingAddress, checkoutFormSlot: slots?.checkoutForm }), (0, jsx_runtime_1.jsx)("div", { className: "mt-6 border-t border-gray-200 dark:border-neutral-700" })] })), (0, jsx_runtime_1.jsx)(CheckoutPaymentPanel_1.CheckoutPaymentPanel, { recipientAddress: recipientAddress, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, totalAmount: computedTotal, buttonText: buttonText, themeColor: themeColor, returnUrl: returnUrl, returnLabel: returnLabel, onSuccess: onSuccess, onError: onError, classes: classes, defaultPaymentMethod: defaultPaymentMethod, senderAddress: senderAddress, showPoints: showPoints, showOrderId: showOrderId, callbackMetadata: checkoutFormMetadata, isFormValid: isFormValid, feeOnTop: feeOnTop, kycEnabled: kycEnabled, showFiatOption: showFiatOption })] }), cartPanel: (0, jsx_runtime_1.jsx)(CheckoutCartPanel_1.CheckoutCartPanel, { items: items, totalAmount: computedTotal, tokenSymbol: tokenSymbol, tokenDecimals: tokenDecimals, pricesLoading: isTokenDataLoading, organizationName: organizationName, organizationLogo: organizationLogo, classes: classes, footer: footer, shipping: effectiveShipping, tax: typeof tax === "string" ? { amount: tax } : tax, discount: effectiveDiscount, summaryLines: summaryLines, usdEquivalent: usdEquivalent }), classes: classes }) }) }));
|
|
214
214
|
}
|
|
@@ -79,5 +79,7 @@ export interface AnySpendCheckoutTriggerProps {
|
|
|
79
79
|
summaryLines?: CheckoutSummaryLine[];
|
|
80
80
|
/** When true, identity verification (KYC) is required before card payment. Defaults to false. */
|
|
81
81
|
kycEnabled?: boolean;
|
|
82
|
+
/** Whether to show fiat payment options (card + coinbase). Defaults to true. */
|
|
83
|
+
showFiatOption?: boolean;
|
|
82
84
|
}
|
|
83
|
-
export declare function AnySpendCheckoutTrigger({ recipientAddress, destinationTokenAddress, destinationTokenChainId, items, totalAmount: totalAmountOverride, organizationName, organizationLogo, themeColor, buttonText, workflowId, orgId, callbackMetadata, onSuccess, onError, returnUrl, returnLabel, classes, footer, defaultPaymentMethod, senderAddress, slots, content, theme, shipping, tax, discount, summaryLines, kycEnabled, }: AnySpendCheckoutTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
85
|
+
export declare function AnySpendCheckoutTrigger({ recipientAddress, destinationTokenAddress, destinationTokenChainId, items, totalAmount: totalAmountOverride, organizationName, organizationLogo, themeColor, buttonText, workflowId, orgId, callbackMetadata, onSuccess, onError, returnUrl, returnLabel, classes, footer, defaultPaymentMethod, senderAddress, slots, content, theme, shipping, tax, discount, summaryLines, kycEnabled, showFiatOption, }: AnySpendCheckoutTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -12,7 +12,7 @@ const AnySpendCustomizationContext_1 = require("../context/AnySpendCustomization
|
|
|
12
12
|
const CheckoutCartPanel_1 = require("./CheckoutCartPanel");
|
|
13
13
|
const CheckoutPaymentPanel_1 = require("./CheckoutPaymentPanel");
|
|
14
14
|
const PoweredByBranding_1 = require("./PoweredByBranding");
|
|
15
|
-
function AnySpendCheckoutTrigger({ recipientAddress, destinationTokenAddress, destinationTokenChainId, items, totalAmount: totalAmountOverride, organizationName, organizationLogo, themeColor, buttonText = "Pay", workflowId, orgId, callbackMetadata, onSuccess, onError, returnUrl, returnLabel, classes, footer, defaultPaymentMethod, senderAddress, slots, content, theme, shipping, tax, discount, summaryLines, kycEnabled = false, }) {
|
|
15
|
+
function AnySpendCheckoutTrigger({ recipientAddress, destinationTokenAddress, destinationTokenChainId, items, totalAmount: totalAmountOverride, organizationName, organizationLogo, themeColor, buttonText = "Pay", workflowId, orgId, callbackMetadata, onSuccess, onError, returnUrl, returnLabel, classes, footer, defaultPaymentMethod, senderAddress, slots, content, theme, shipping, tax, discount, summaryLines, kycEnabled = false, showFiatOption, }) {
|
|
16
16
|
// Merge workflowId + orgId into callbackMetadata
|
|
17
17
|
const mergedMetadata = (0, react_2.useMemo)(() => {
|
|
18
18
|
if (!workflowId && !orgId && !callbackMetadata)
|
|
@@ -57,5 +57,5 @@ function AnySpendCheckoutTrigger({ recipientAddress, destinationTokenAddress, de
|
|
|
57
57
|
const formattedTotal = (0, react_2.useMemo)(() => (0, number_1.formatTokenAmount)(BigInt(computedTotal || "0"), tokenDecimals), [computedTotal, tokenDecimals]);
|
|
58
58
|
const hasItems = items && items.length > 0;
|
|
59
59
|
const fingerprint = (0, AnySpendFingerprintWrapper_1.getFingerprintConfig)();
|
|
60
|
-
return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprint, children: (0, jsx_runtime_1.jsx)(AnySpendCustomizationContext_1.AnySpendCustomizationProvider, { slots: slots, content: content, theme: theme, children: (0, jsx_runtime_1.jsxs)("div", { className: "anyspend-checkout-trigger flex flex-col", children: [hasItems && ((0, jsx_runtime_1.jsx)("div", { className: "border-b border-gray-200 p-5 dark:border-neutral-700", children: (0, jsx_runtime_1.jsx)(CheckoutCartPanel_1.CheckoutCartPanel, { items: items, totalAmount: computedTotal, tokenSymbol: tokenSymbol, tokenDecimals: tokenDecimals, organizationName: organizationName, organizationLogo: organizationLogo, classes: classes, footer: footer, shipping: typeof shipping === "string" ? { amount: shipping } : shipping, tax: typeof tax === "string" ? { amount: tax } : tax, discount: typeof discount === "string" ? { amount: discount } : discount, summaryLines: summaryLines }) })), !hasItems && ((0, jsx_runtime_1.jsx)("div", { className: "border-b border-gray-200 p-5 dark:border-neutral-700", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("flex items-center justify-between", classes?.cartSummary), children: [(0, jsx_runtime_1.jsx)("span", { className: "text-base font-semibold text-gray-900 dark:text-gray-100", children: "Total" }), (0, jsx_runtime_1.jsxs)("span", { className: (0, cn_1.cn)("text-base font-semibold text-gray-900 dark:text-gray-100", classes?.cartTotal), children: [formattedTotal, " ", tokenSymbol] })] }), footer === undefined ? ((0, jsx_runtime_1.jsx)(PoweredByBranding_1.PoweredByBranding, { organizationName: organizationName, organizationLogo: organizationLogo, classes: classes })) : (footer)] }) })), (0, jsx_runtime_1.jsx)("div", { className: "px-2 py-3", children: (0, jsx_runtime_1.jsx)(CheckoutPaymentPanel_1.CheckoutPaymentPanel, { recipientAddress: recipientAddress, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, totalAmount: computedTotal, buttonText: buttonText, themeColor: themeColor, returnUrl: returnUrl, returnLabel: returnLabel, onSuccess: onSuccess, onError: onError, callbackMetadata: mergedMetadata, classes: classes, defaultPaymentMethod: defaultPaymentMethod, senderAddress: senderAddress, kycEnabled: kycEnabled }) })] }) }) }));
|
|
60
|
+
return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprint, children: (0, jsx_runtime_1.jsx)(AnySpendCustomizationContext_1.AnySpendCustomizationProvider, { slots: slots, content: content, theme: theme, children: (0, jsx_runtime_1.jsxs)("div", { className: "anyspend-checkout-trigger flex flex-col", children: [hasItems && ((0, jsx_runtime_1.jsx)("div", { className: "border-b border-gray-200 p-5 dark:border-neutral-700", children: (0, jsx_runtime_1.jsx)(CheckoutCartPanel_1.CheckoutCartPanel, { items: items, totalAmount: computedTotal, tokenSymbol: tokenSymbol, tokenDecimals: tokenDecimals, organizationName: organizationName, organizationLogo: organizationLogo, classes: classes, footer: footer, shipping: typeof shipping === "string" ? { amount: shipping } : shipping, tax: typeof tax === "string" ? { amount: tax } : tax, discount: typeof discount === "string" ? { amount: discount } : discount, summaryLines: summaryLines }) })), !hasItems && ((0, jsx_runtime_1.jsx)("div", { className: "border-b border-gray-200 p-5 dark:border-neutral-700", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("flex items-center justify-between", classes?.cartSummary), children: [(0, jsx_runtime_1.jsx)("span", { className: "text-base font-semibold text-gray-900 dark:text-gray-100", children: "Total" }), (0, jsx_runtime_1.jsxs)("span", { className: (0, cn_1.cn)("text-base font-semibold text-gray-900 dark:text-gray-100", classes?.cartTotal), children: [formattedTotal, " ", tokenSymbol] })] }), footer === undefined ? ((0, jsx_runtime_1.jsx)(PoweredByBranding_1.PoweredByBranding, { organizationName: organizationName, organizationLogo: organizationLogo, classes: classes })) : (footer)] }) })), (0, jsx_runtime_1.jsx)("div", { className: "px-2 py-3", children: (0, jsx_runtime_1.jsx)(CheckoutPaymentPanel_1.CheckoutPaymentPanel, { recipientAddress: recipientAddress, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, totalAmount: computedTotal, buttonText: buttonText, themeColor: themeColor, returnUrl: returnUrl, returnLabel: returnLabel, onSuccess: onSuccess, onError: onError, callbackMetadata: mergedMetadata, classes: classes, defaultPaymentMethod: defaultPaymentMethod, senderAddress: senderAddress, kycEnabled: kycEnabled, showFiatOption: showFiatOption }) })] }) }) }));
|
|
61
61
|
}
|
|
@@ -30,6 +30,8 @@ interface CheckoutPaymentPanelProps {
|
|
|
30
30
|
feeOnTop?: boolean;
|
|
31
31
|
/** When true, identity verification (KYC) is required before card payment. Defaults to false. */
|
|
32
32
|
kycEnabled?: boolean;
|
|
33
|
+
/** Whether to show fiat payment options (card + coinbase). Defaults to true. */
|
|
34
|
+
showFiatOption?: boolean;
|
|
33
35
|
}
|
|
34
|
-
export declare function CheckoutPaymentPanel({ recipientAddress, destinationTokenAddress, destinationTokenChainId, totalAmount, buttonText, themeColor, returnUrl, returnLabel, onSuccess, onError, callbackMetadata, classes, defaultPaymentMethod, senderAddress, showPoints, showOrderId, isFormValid, feeOnTop, kycEnabled, }: CheckoutPaymentPanelProps): import("react/jsx-runtime").JSX.Element;
|
|
36
|
+
export declare function CheckoutPaymentPanel({ recipientAddress, destinationTokenAddress, destinationTokenChainId, totalAmount, buttonText, themeColor, returnUrl, returnLabel, onSuccess, onError, callbackMetadata, classes, defaultPaymentMethod, senderAddress, showPoints, showOrderId, isFormValid, feeOnTop, kycEnabled, showFiatOption, }: CheckoutPaymentPanelProps): import("react/jsx-runtime").JSX.Element;
|
|
35
37
|
export {};
|