@b3dotfun/sdk 0.0.40-alpha.6 → 0.0.40-alpha.8

package/dist/esm/anyspend/react/components/AnyspendDepositHype.js

@@ -111,7 +111,7 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
             await handleFiatOrder();
         }
     };
-    const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [_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" }) }) }), _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: recipientAddress, destinationToken: B3_TOKEN, destinationChainId: base.id, dstTokenSymbol: HYPE_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: cn("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, selectedRecipientAddress: recipientAddress, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: B3_TOKEN, dstTokenSymbol: HYPE_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: HYPE_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: base.id, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, onChangeDstAmount: value => {
+    const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [_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" }) }) }), _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: recipientAddress, destinationToken: B3_TOKEN, destinationChainId: base.id, dstTokenSymbol: HYPE_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: cn("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, selectedRecipientAddress: recipientAddress, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: B3_TOKEN, dstTokenSymbol: HYPE_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: HYPE_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: base.id, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, onChangeDstAmount: value => {
                                 setIsSrcInputDirty(false);
                                 setSrcAmount(value);
                             }, anyspendQuote: anyspendQuote }))] }) }), _jsx(ErrorSection, { error: getAnyspendQuoteError }), _jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: cn("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0"), children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: cn("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: btnInfo.text }) }), mainFooter ? mainFooter : null] }));

package/dist/esm/anyspend/react/components/common/CryptoReceiveSection.js

@@ -5,46 +5,48 @@ import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
 import { formatDisplayNumber } from "../../../../shared/utils/number.js";
 import { ChevronRight } from "lucide-react";
 import { motion } from "motion/react";
+import { useFeatureFlags } from "../../contexts/FeatureFlagsContext.js";
 import { OrderTokenAmount } from "./OrderTokenAmount.js";
 export function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, }) {
+    const featureFlags = useFeatureFlags();
     return (_jsxs(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "receive-section bg-as-surface-secondary border-as-border-secondary relative flex w-full flex-col gap-2 rounded-2xl border p-4 sm:p-6", children: [_jsxs("div", { className: "flex w-full items-center justify-between", children: [_jsx("div", { className: "text-as-primary/50 flex h-7 items-center text-sm", children: isDepositMode ? "Deposit" : "Receive" }), selectedRecipientAddress ? (_jsx("button", { className: cn("text-as-tertiarry flex h-7 items-center gap-2 rounded-lg"), onClick: onSelectRecipient, children: _jsxs(_Fragment, { children: [_jsx("span", { className: "text-as-tertiarry flex items-center gap-1 text-sm", children: recipientName ? formatUsername(recipientName) : shortenAddress(selectedRecipientAddress || "") }), _jsx(ChevronRight, { className: "h-4 w-4" })] }) })) : (_jsx("button", { className: "text-as-primary/70 flex items-center gap-1 rounded-lg", onClick: onSelectRecipient, children: _jsx("div", { className: "text-sm font-medium", children: "Select recipient" }) }))] }), isBuyMode || isDepositMode ? (
             // Fixed destination token display for buy mode and deposit mode
             _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-as-primary text-2xl font-bold", children: dstAmount || "0" }), _jsxs("div", { className: "bg-as-brand/10 border-as-brand/30 flex items-center gap-3 rounded-xl border px-4 py-3", children: [(dstTokenLogoURI || dstToken.metadata?.logoURI) && (_jsx("img", { src: dstTokenLogoURI || dstToken.metadata?.logoURI, alt: dstTokenSymbol || dstToken.symbol, className: "h-8 w-8 rounded-full" })), _jsx("span", { className: "text-as-brand text-lg font-bold", children: dstTokenSymbol || dstToken.symbol })] })] })) : (
             // Token selection for regular swap mode
-            _jsx(OrderTokenAmount, { address: selectedRecipientAddress, context: "to", inputValue: dstAmount, onChangeInput: onChangeDstAmount || (() => { }), chainId: selectedDstChainId || dstToken.chainId, setChainId: setSelectedDstChainId || (() => { }), token: dstToken, setToken: setSelectedDstToken || (() => { }) })), _jsxs("div", { className: "text-as-primary/50 flex h-5 items-center text-sm", children: [formatDisplayNumber(anyspendQuote?.data?.currencyOut?.amountUsd, {
-                        style: "currency",
-                        fallback: "",
-                    }), anyspendQuote?.data?.currencyIn?.amountUsd &&
-                        anyspendQuote?.data?.currencyOut?.amountUsd &&
-                        (() => {
-                            const calculatePriceImpact = (inputUsd, outputUsd) => {
-                                if (!inputUsd || !outputUsd) {
-                                    return { percentage: "0.00", isNegative: false };
-                                }
-                                const input = Number(inputUsd);
-                                const output = Number(outputUsd);
-                                // Handle edge cases
-                                if (input === 0 || isNaN(input) || isNaN(output) || input <= output) {
-                                    return { percentage: "0.00", isNegative: false };
-                                }
-                                const percentageValue = ((output - input) / input) * 100;
-                                // Handle the -0.00% case
-                                if (percentageValue > -0.005 && percentageValue < 0) {
-                                    return { percentage: "0.00", isNegative: false };
-                                }
-                                return {
-                                    percentage: Math.abs(percentageValue).toFixed(2),
-                                    isNegative: percentageValue < 0,
-                                };
-                            };
-                            const { percentage, isNegative } = calculatePriceImpact(anyspendQuote.data.currencyIn.amountUsd, anyspendQuote.data.currencyOut.amountUsd);
-                            // Parse the percentage as a number for comparison
-                            const percentageNum = parseFloat(percentage);
-                            // Don't show if less than 1%
-                            if (percentageNum < 1) {
-                                return null;
-                            }
-                            // Using inline style to ensure color displays
-                            return (_jsxs("span", { className: "ml-2", style: { color: percentageNum >= 10 ? "red" : "#FFD700" }, children: ["(", isNegative ? "-" : "", percentage, "%)"] }));
-                        })()] })] }));
+            _jsx(OrderTokenAmount, { address: selectedRecipientAddress, context: "to", inputValue: dstAmount, onChangeInput: onChangeDstAmount || (() => { }), chainId: selectedDstChainId || dstToken.chainId, setChainId: setSelectedDstChainId || (() => { }), token: dstToken, setToken: setSelectedDstToken || (() => { }) })), _jsxs("div", { className: "text-as-primary/50 flex h-5 items-center justify-between text-sm", children: [_jsxs("div", { className: "flex items-center gap-2", children: [formatDisplayNumber(anyspendQuote?.data?.currencyOut?.amountUsd, {
+                                style: "currency",
+                                fallback: "",
+                            }), anyspendQuote?.data?.currencyIn?.amountUsd &&
+                                anyspendQuote?.data?.currencyOut?.amountUsd &&
+                                (() => {
+                                    const calculatePriceImpact = (inputUsd, outputUsd) => {
+                                        if (!inputUsd || !outputUsd) {
+                                            return { percentage: "0.00", isNegative: false };
+                                        }
+                                        const input = Number(inputUsd);
+                                        const output = Number(outputUsd);
+                                        // Handle edge cases
+                                        if (input === 0 || isNaN(input) || isNaN(output) || input <= output) {
+                                            return { percentage: "0.00", isNegative: false };
+                                        }
+                                        const percentageValue = ((output - input) / input) * 100;
+                                        // Handle the -0.00% case
+                                        if (percentageValue > -0.005 && percentageValue < 0) {
+                                            return { percentage: "0.00", isNegative: false };
+                                        }
+                                        return {
+                                            percentage: Math.abs(percentageValue).toFixed(2),
+                                            isNegative: percentageValue < 0,
+                                        };
+                                    };
+                                    const { percentage, isNegative } = calculatePriceImpact(anyspendQuote.data.currencyIn.amountUsd, anyspendQuote.data.currencyOut.amountUsd);
+                                    // Parse the percentage as a number for comparison
+                                    const percentageNum = parseFloat(percentage);
+                                    // Don't show if less than 1%
+                                    if (percentageNum < 1) {
+                                        return null;
+                                    }
+                                    // Using inline style to ensure color displays
+                                    return (_jsxs("span", { className: "ml-2", style: { color: percentageNum >= 10 ? "red" : "#FFD700" }, children: ["(", isNegative ? "-" : "", percentage, "%)"] }));
+                                })()] }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && (_jsx("div", { className: "flex items-center gap-1", children: _jsxs("span", { className: "text-as-brand font-medium", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] }) }, `points-${anyspendQuote.data.pointsAmount}`))] })] }));
 }

package/dist/esm/anyspend/react/components/common/PanelOnramp.d.ts

@@ -1,6 +1,7 @@
 import { components } from "../../../../anyspend/types/api";
+import { GetQuoteResponse } from "../../../../anyspend/types/api_req_res";
 import { FiatPaymentMethod } from "./FiatPaymentMethod";
-export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken, }: {
+export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken, anyspendQuote, }: {
     srcAmountOnRamp: string;
     setSrcAmountOnRamp: (amount: string) => void;
     selectedPaymentMethod?: FiatPaymentMethod;
@@ -15,4 +16,5 @@ export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selec
     recipientSelectionPanelIndex: number;
     dstTokenSymbol?: string;
     hideDstToken?: boolean;
+    anyspendQuote?: GetQuoteResponse;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/esm/anyspend/react/components/common/PanelOnramp.js

@@ -7,9 +7,11 @@ import { formatAddress } from "../../../../shared/utils/formatAddress.js";
 import { ChevronRight, Wallet } from "lucide-react";
 import { useRef } from "react";
 import { toast } from "sonner";
+import { useFeatureFlags } from "../../contexts/FeatureFlagsContext.js";
 import { FiatPaymentMethod } from "./FiatPaymentMethod.js";
 import { OrderTokenAmountFiat } from "./OrderTokenAmountFiat.js";
-export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken = false, }) {
+export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken = false, anyspendQuote, }) {
+    const featureFlags = useFeatureFlags();
     // Get geo-based onramp options to access fee information
     const { stripeWeb2Support } = useGeoOnrampOptions(srcAmountOnRamp);
     // Helper function to get fees from API data
@@ -70,9 +72,8 @@ export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPayme
                                         width: `${Math.max(50, srcAmountOnRamp.length * 34)}px`,
                                     } })] }) }), _jsx("div", { className: cn("mx-auto mb-6 inline-grid grid-cols-4 gap-2", hideDstToken && "mb-0"), children: ["5", "10", "20", "25"].map(value => (_jsxs("button", { onClick: () => handleQuickAmount(value), className: `bg-as-surface-secondary border-as-border-secondary hover:border-as-border-secondary h-7 w-14 rounded-lg border text-sm font-medium transition-all duration-200 ${srcAmountOnRamp === value
                                 ? "border-as-border-secondary bg-as-surface-secondary"
-                                : "bg-as-surface-secondary hover:bg-as-surface-secondary"}`, children: ["$", value] }, value))) }), destinationToken && destinationChainId && !hideDstToken && (_jsx(OrderTokenAmountFiat, { address: _recipientAddress, context: "to", inputValue: destinationAmount || "0", onChangeInput: () => { }, chainId: destinationChainId, setChainId: onDestinationChainChange || (() => { }), token: destinationToken, setToken: onDestinationTokenChange || (() => { }) }))] }), _jsxs("div", { className: "border-as-border-secondary bg-as-surface-secondary mt-4 flex w-full flex-col gap-3 rounded-xl border p-4", children: [_jsxs("div", { className: "flex w-full items-center justify-between gap-2", children: [_jsx("span", { className: "text-as-tertiarry flex items-center text-sm", children: "Recipient" }), _recipientAddress ? (_jsxs("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(recipientSelectionPanelIndex), children: [_jsx("span", { className: "text-sm", children: recipientName ? formatUsername(recipientName) : formatAddress(_recipientAddress) }), _jsx(ChevronRight, { size: 16 })] })) : (_jsxs("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(5), children: [_jsx(Wallet, { className: "text-as-brand", size: 16 }), "Select recipient", _jsx(ChevronRight, { size: 16 })] }))] }), _jsx("div", { className: "divider w-full" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-as-tertiarry text-sm", children: "Expected to receive" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: "text-as-primary font-semibold", children: [destinationAmount || "0", " ", dstTokenSymbol || destinationToken?.symbol || ""] }), _jsxs("span", { className: "text-as-tertiarry text-sm", children: ["on ", destinationChainId ? ALL_CHAINS[destinationChainId]?.name : ""] }), destinationToken && destinationChainId && destinationToken.metadata?.logoURI && (_jsx("img", { src: ALL_CHAINS[destinationChainId]?.logoUrl, alt: "Chain", className: "h-4 w-4 rounded-full" }))] })] }), _jsx("div", { className: "divider w-full" }), _jsx("div", { className: "", children: _jsx("div", { className: "flex items-center justify-between", children: (() => {
-                                const currentPaymentMethod = selectedPaymentMethod || FiatPaymentMethod.NONE;
-                                const fee = getFeeFromApi(currentPaymentMethod);
-                                return (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-as-tertiarry text-sm", children: fee !== null ? `Total (included $${fee.toFixed(2)} fee)` : "Total" }), _jsxs("span", { className: "text-as-primary font-semibold", children: ["$", getTotalAmount(currentPaymentMethod).toFixed(2)] })] }));
-                            })() }) })] })] }));
+                                : "bg-as-surface-secondary hover:bg-as-surface-secondary"}`, children: ["$", value] }, value))) }), destinationToken && destinationChainId && !hideDstToken && (_jsx(OrderTokenAmountFiat, { address: _recipientAddress, context: "to", inputValue: destinationAmount || "0", onChangeInput: () => { }, chainId: destinationChainId, setChainId: onDestinationChainChange || (() => { }), token: destinationToken, setToken: onDestinationTokenChange || (() => { }) }))] }), _jsxs("div", { className: "border-as-border-secondary bg-as-surface-secondary mt-4 flex w-full flex-col gap-3 rounded-xl border p-4", children: [_jsxs("div", { className: "flex w-full items-center justify-between gap-2", children: [_jsx("span", { className: "text-as-tertiarry flex items-center text-sm", children: "Recipient" }), _recipientAddress ? (_jsxs("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(recipientSelectionPanelIndex), children: [_jsx("span", { className: "text-sm", children: recipientName ? formatUsername(recipientName) : formatAddress(_recipientAddress) }), _jsx(ChevronRight, { size: 16 })] })) : (_jsxs("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(5), children: [_jsx(Wallet, { className: "text-as-brand", size: 16 }), "Select recipient", _jsx(ChevronRight, { size: 16 })] }))] }), _jsx("div", { className: "divider w-full" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-as-tertiarry text-sm", children: "Expected to receive" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: "text-as-primary font-semibold", children: [destinationAmount || "0", " ", dstTokenSymbol || destinationToken?.symbol || ""] }), _jsxs("span", { className: "text-as-tertiarry text-sm", children: ["on ", destinationChainId ? ALL_CHAINS[destinationChainId]?.name : ""] }), destinationToken && destinationChainId && destinationToken.metadata?.logoURI && (_jsx("img", { src: ALL_CHAINS[destinationChainId]?.logoUrl, alt: "Chain", className: "h-4 w-4 rounded-full" }))] })] }), _jsx("div", { className: "divider w-full" }), _jsx("div", { className: "", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-as-tertiarry text-sm", children: (() => {
+                                                const fee = getFeeFromApi(selectedPaymentMethod || FiatPaymentMethod.NONE);
+                                                return fee !== null ? `Total (included $${fee.toFixed(2)} fee)` : "Total";
+                                            })() }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && (_jsxs("span", { className: "text-as-brand text-sm font-medium", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] }, `points-${anyspendQuote.data.pointsAmount}`))] }), _jsxs("span", { className: "text-as-primary font-semibold", children: ["$", getTotalAmount(selectedPaymentMethod || FiatPaymentMethod.NONE).toFixed(2)] })] }) })] })] }));
 }

package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from "react";
+export interface FeatureFlags {
+    showPoints?: boolean;
+}
+interface FeatureFlagsProviderProps {
+    children: ReactNode;
+    featureFlags?: FeatureFlags;
+}
+export declare function FeatureFlagsProvider({ children, featureFlags }: FeatureFlagsProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useFeatureFlags(): FeatureFlags;
+export {};

package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+const FeatureFlagsContext = createContext(undefined);
+const defaultFeatureFlags = {
+    showPoints: false,
+};
+export function FeatureFlagsProvider({ children, featureFlags = defaultFeatureFlags }) {
+    return _jsx(FeatureFlagsContext.Provider, { value: { featureFlags }, children: children });
+}
+export function useFeatureFlags() {
+    const context = useContext(FeatureFlagsContext);
+    if (!context) {
+        return defaultFeatureFlags;
+    }
+    return context.featureFlags;
+}

package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts

@@ -78,71 +78,7 @@ export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrd
     globalAddress: string | undefined;
     hasEnoughBalance: boolean;
     isBalanceLoading: boolean;
-    anyspendQuote: {
-        success: boolean;
-        message: string;
-        data: {
-            operation?: string;
-            sender?: string;
-            recipient?: string;
-            currencyIn?: {
-                currency?: {
-                    chainId?: number;
-                    address?: string;
-                    symbol?: string;
-                    name?: string;
-                    decimals?: number;
-                    metadata?: {
-                        logoURI?: string;
-                    };
-                };
-                amount?: string;
-                amountFormatted?: string;
-                amountUsd?: string;
-                minimumAmount?: string;
-            };
-            currencyOut?: {
-                currency?: {
-                    chainId?: number;
-                    address?: string;
-                    symbol?: string;
-                    name?: string;
-                    decimals?: number;
-                    metadata?: {
-                        logoURI?: string;
-                    };
-                };
-                amount?: string;
-                amountFormatted?: string;
-                amountUsd?: string;
-                minimumAmount?: string;
-            };
-            totalImpact?: {
-                usd?: string;
-                percent?: string;
-            };
-            swapImpact?: {
-                usd?: string;
-                percent?: string;
-            };
-            rate?: string;
-            slippageTolerance?: {
-                origin?: {
-                    usd?: string;
-                    value?: string;
-                    percent?: string;
-                };
-                destination?: {
-                    usd?: string;
-                    value?: string;
-                    percent?: string;
-                };
-            };
-            timeEstimate?: number;
-            userBalance?: string;
-        };
-        statusCode: number;
-    } | undefined;
+    anyspendQuote: import("../../types/api_req_res").GetQuoteResponse | undefined;
     isLoadingAnyspendQuote: boolean;
     getAnyspendQuoteError: Error | null;
     activeInputAmountInWei: string;

package/dist/esm/anyspend/react/providers/AnyspendProvider.d.ts

@@ -1,6 +1,8 @@
 import { ReactNode } from "react";
+import { FeatureFlags } from "../contexts/FeatureFlagsContext";
 interface AnyspendProviderProps {
     children: ReactNode;
+    featureFlags?: FeatureFlags;
 }
 /**
  * AnyspendProvider is a top-level provider that wraps your application to provide
@@ -12,17 +14,18 @@ interface AnyspendProviderProps {
  * - Safe to use at the application root
  * - Configures sensible defaults for query caching
  * - Handles Stripe payment redirects and modal state
+ * - Provides feature flags configuration
  *
  * @example
  * ```tsx
  * function App() {
  *   return (
- *     <AnyspendProvider>
+ *     <AnyspendProvider featureFlags={{ showPoints: true }}>
  *       <YourApp />
  *     </AnyspendProvider>
  *   );
  * }
  * ```
  */
-export declare const AnyspendProvider: ({ children }: AnyspendProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AnyspendProvider: ({ children, featureFlags }: AnyspendProviderProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/anyspend/react/providers/AnyspendProvider.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { TooltipProvider } from "../../../global-account/react/index.js";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { useState } from "react";
+import { FeatureFlagsProvider } from "../contexts/FeatureFlagsContext.js";
 import { StripeRedirectHandler } from "./StripeRedirectHandler.js";
 const defaultQueryClientConfig = {
     defaultOptions: {
@@ -23,19 +24,20 @@ const defaultQueryClientConfig = {
  * - Safe to use at the application root
  * - Configures sensible defaults for query caching
  * - Handles Stripe payment redirects and modal state
+ * - Provides feature flags configuration
  *
  * @example
  * ```tsx
  * function App() {
  *   return (
- *     <AnyspendProvider>
+ *     <AnyspendProvider featureFlags={{ showPoints: true }}>
  *       <YourApp />
  *     </AnyspendProvider>
  *   );
  * }
  * ```
  */
-export const AnyspendProvider = function AnyspendProvider({ children }) {
+export const AnyspendProvider = function AnyspendProvider({ children, featureFlags }) {
     const [queryClient] = useState(() => new QueryClient(defaultQueryClientConfig));
-    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsxs(TooltipProvider, { children: [_jsx(StripeRedirectHandler, {}), children] }) }));
+    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(FeatureFlagsProvider, { featureFlags: featureFlags, children: _jsxs(TooltipProvider, { children: [_jsx(StripeRedirectHandler, {}), children] }) }) }));
 };

package/dist/esm/anyspend/react/providers/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./AnyspendProvider";
 export * from "./StripeRedirectHandler";
+export { useFeatureFlags, type FeatureFlags } from "../contexts/FeatureFlagsContext";

package/dist/esm/anyspend/react/providers/index.js

@@ -1,2 +1,3 @@
 export * from "./AnyspendProvider.js";
 export * from "./StripeRedirectHandler.js";
+export { useFeatureFlags } from "../contexts/FeatureFlagsContext.js";

package/dist/esm/anyspend/types/api_req_res.d.ts

@@ -1,10 +1,17 @@
 import { paths } from "./api";
 export type GetOrderAndTxsResponse = paths["/orders/{orderId}"]["get"]["responses"]["200"]["content"]["application/json"];
 export type GetQuoteRequest = paths["/orders/quote"]["post"]["requestBody"]["content"]["application/json"];
-export type GetQuoteResponse = paths["/orders/quote"]["post"]["responses"]["200"]["content"]["application/json"];
+type BaseGetQuoteResponse = paths["/orders/quote"]["post"]["responses"]["200"]["content"]["application/json"];
+export type GetQuoteResponse = BaseGetQuoteResponse & {
+    data: BaseGetQuoteResponse["data"] & {
+        pointsAmount?: number;
+        pointsMultiplier?: number;
+    };
+};
 export type GetCoinbaseOnrampOptionsResponse = paths["/onramp/coinbase/options"]["get"]["responses"]["200"]["content"]["application/json"];
 export type GetOrderHistoryResponse = paths["/orders"]["get"]["responses"]["200"]["content"]["application/json"];
 export type GetTokenListResponse = paths["/chains/{chainId}/tokens"]["get"]["responses"]["200"]["content"]["application/json"];
 export type CreateOrderResponse = paths["/orders"]["post"]["responses"]["200"]["content"]["application/json"];
 export type GetStripeSupportedResponse = paths["/onramp/stripe/supported"]["get"]["responses"]["200"]["content"]["application/json"];
 export type GetStripeClientSecret = paths["/stripe/clientSecret"]["get"]["responses"]["200"]["content"]["application/json"];
+export {};

package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts

@@ -1,12 +1,12 @@
 import { PermissionsConfig } from "../../../../global-account/types/permissions";
+import "@reservoir0x/relay-kit-ui/styles.css";
 import { Account } from "thirdweb/wallets";
 import { ClientType } from "../../../client-manager";
 import { B3ContextType } from "./types";
-import "@reservoir0x/relay-kit-ui/styles.css";
 /**
  * Main B3Provider component
  */
-export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType, rpcUrls, }: {
+export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType, rpcUrls, partnerId, }: {
     theme: "light" | "dark";
     children: React.ReactNode;
     accountOverride?: Account;
@@ -19,6 +19,7 @@ export declare function B3Provider({ theme, children, accountOverride, environme
     };
     clientType?: ClientType;
     rpcUrls?: Record<number, string>;
+    partnerId?: string;
 }): import("react/jsx-runtime").JSX.Element;
 /**
  * Inner provider component that provides the actual B3Context

package/dist/esm/global-account/react/components/B3Provider/B3Provider.js

@@ -1,16 +1,21 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { RelayKitProviderWrapper, TooltipProvider, useAuthStore } from "../../../../global-account/react/index.js";
 import { loadGA4Script } from "../../../../global-account/utils/analytics.js";
+import { ecosystemWalletId } from "../../../../shared/constants/index.js";
 import { supportedChains } from "../../../../shared/constants/chains/supported.js";
+import { debugB3React } from "../../../../shared/utils/debug.js";
+import { client } from "../../../../shared/utils/thirdweb.js";
+import "@reservoir0x/relay-kit-ui/styles.css";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { useCallback, useEffect, useState } from "react";
+import { inAppWalletConnector } from "@thirdweb-dev/wagmi-adapter";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { Toaster } from "sonner";
 import { getLastAuthProvider, ThirdwebProvider, useActiveAccount, useConnectedWallets, useSetActiveWallet, } from "thirdweb/react";
 import { createConfig, http, WagmiProvider } from "wagmi";
 import { setClientType } from "../../../client-manager.js";
 import { StyleRoot } from "../StyleRoot.js";
 import { B3Context } from "./types.js";
-import "@reservoir0x/relay-kit-ui/styles.css";
+const debug = debugB3React("B3Provider");
 /**
  * Default permissions configuration for B3 provider
  */
@@ -20,24 +25,12 @@ const DEFAULT_PERMISSIONS = {
     startDate: new Date(),
     endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
 };
-/**
- * Creates wagmi config with optional custom RPC URLs
- * @param rpcUrls - Optional mapping of chain IDs to RPC URLs
- */
-function createWagmiConfig(rpcUrls) {
-    return createConfig({
-        chains: [supportedChains[0], ...supportedChains.slice(1)],
-        transports: Object.fromEntries(supportedChains.map(chain => [chain.id, http(rpcUrls?.[chain.id])])),
-    });
-}
 // Create queryClient instance
 const queryClient = new QueryClient();
 /**
  * Main B3Provider component
  */
-export function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType = "rest", rpcUrls, }) {
-    // Create wagmi config with custom RPC URLs if provided
-    const [wagmiConfig] = useState(() => createWagmiConfig(rpcUrls));
+export function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType = "rest", rpcUrls, partnerId, }) {
     // Initialize Google Analytics on mount
     useEffect(() => {
         loadGA4Script();
@@ -46,7 +39,32 @@ export function B3Provider({ theme = "light", children, accountOverride, environ
     useEffect(() => {
         setClientType(clientType);
     }, [clientType]);
-    return (_jsx(WagmiProvider, { config: wagmiConfig, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(ThirdwebProvider, { children: _jsx(TooltipProvider, { children: _jsx(InnerProvider, { accountOverride: accountOverride, environment: environment, theme: theme, automaticallySetFirstEoa: !!automaticallySetFirstEoa, clientType: clientType, children: _jsxs(RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, _jsx(StyleRoot, { id: "b3-root" }), _jsx(Toaster, { theme: theme, position: toaster?.position, style: toaster?.style })] }) }) }) }) }) }));
+    const ecocystemConfig = useMemo(() => {
+        if (!partnerId)
+            return undefined;
+        return {
+            ecosystemId: ecosystemWalletId,
+            partnerId: partnerId,
+            client,
+        };
+    }, [partnerId]);
+    /**
+     * Creates wagmi config with optional custom RPC URLs
+     * @param rpcUrls - Optional mapping of chain IDs to RPC URLs
+     */
+    const wagmiConfig = useMemo(() => createConfig({
+        chains: [supportedChains[0], ...supportedChains.slice(1)],
+        transports: Object.fromEntries(supportedChains.map(chain => [chain.id, http(rpcUrls?.[chain.id])])),
+        connectors: [
+            inAppWalletConnector({
+                ...(ecocystemConfig || {}),
+                client,
+            }),
+            // injected(),
+            // coinbaseWallet({ appName: "HypeDuel" }),
+        ],
+    }), [partnerId]);
+    return (_jsx(ThirdwebProvider, { children: _jsx(WagmiProvider, { config: wagmiConfig, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(TooltipProvider, { children: _jsx(InnerProvider, { accountOverride: accountOverride, environment: environment, theme: theme, automaticallySetFirstEoa: !!automaticallySetFirstEoa, clientType: clientType, children: _jsxs(RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, _jsx(StyleRoot, { id: "b3-root" }), _jsx(Toaster, { theme: theme, position: toaster?.position, style: toaster?.style })] }) }) }) }) }) }));
 }
 /**
  * Inner provider component that provides the actual B3Context
@@ -57,6 +75,7 @@ export function InnerProvider({ children, accountOverride, environment, defaultP
     const wallets = useConnectedWallets();
     const setActiveWallet = useSetActiveWallet();
     const isAuthenticated = useAuthStore(state => state.isAuthenticated);
+    debug("@@wallets", wallets);
     const [user, setUser] = useState(() => {
         // Try to restore user from localStorage on initialization
         if (typeof window !== "undefined") {
@@ -87,7 +106,7 @@ export function InnerProvider({ children, accountOverride, environment, defaultP
     const setWallet = useCallback((wallet) => {
         setManuallySelectedWallet(wallet);
         const account = wallet.getAccount();
-        console.log("@@gio:setWallet", wallet.id, account?.address);
+        debug("@@setWallet", wallet.id, account?.address);
         setActiveWallet(wallet);
     }, [setManuallySelectedWallet, setActiveWallet]);
     useEffect(() => {

package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js

@@ -1,10 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AuthButton, Button, getConnectOptionsFromStrategy, isWalletType, LoginStepContainer, useAuthentication, useAuthStore, useConnect, WalletRow, } from "../../../../../global-account/react/index.js";
-import { debug } from "../../../../../shared/utils/debug.js";
+import { debugB3React } from "../../../../../shared/utils/debug.js";
 import { client } from "../../../../../shared/utils/thirdweb.js";
 import { useState } from "react";
 import { useConnect as useConnectTW } from "thirdweb/react";
 import { createWallet } from "thirdweb/wallets";
+const debug = debugB3React("LoginStepCustom");
 export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, maxInitialWallets = 2, automaticallySetFirstEoa, }) {
     const [isLoading, setIsLoading] = useState(false);
     const [showAllWallets, setShowAllWallets] = useState(false);
@@ -42,7 +43,7 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
                 connectResult = await connect(options);
             }
             const account = connectResult?.getAccount();
-            console.log("@@gio:connectResult", { connectResult, account, options });
+            debug("@@connectResult", { connectResult, account, options });
             if (!account)
                 throw new Error("Failed to connect");
             await onSuccess(account);

package/dist/esm/global-account/react/hooks/useAuthentication.js

@@ -116,8 +116,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
         if (activeWallet) {
             debug("@@logout:activeWallet", activeWallet);
             disconnect(activeWallet);
-            debug("@@logout:disconnected");
-            console.log("@@gio:logout:activeWallet", activeWallet);
+            debug("@@logout:activeWallet", activeWallet);
         }
         // Log out of each wallet
         wallets.forEach(wallet => {

package/dist/types/anyspend/react/components/common/PanelOnramp.d.ts

@@ -1,6 +1,7 @@
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
+import { GetQuoteResponse } from "@b3dotfun/sdk/anyspend/types/api_req_res";
 import { FiatPaymentMethod } from "./FiatPaymentMethod";
-export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken, }: {
+export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken, anyspendQuote, }: {
     srcAmountOnRamp: string;
     setSrcAmountOnRamp: (amount: string) => void;
     selectedPaymentMethod?: FiatPaymentMethod;
@@ -15,4 +16,5 @@ export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selec
     recipientSelectionPanelIndex: number;
     dstTokenSymbol?: string;
     hideDstToken?: boolean;
+    anyspendQuote?: GetQuoteResponse;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/types/anyspend/react/contexts/FeatureFlagsContext.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from "react";
+export interface FeatureFlags {
+    showPoints?: boolean;
+}
+interface FeatureFlagsProviderProps {
+    children: ReactNode;
+    featureFlags?: FeatureFlags;
+}
+export declare function FeatureFlagsProvider({ children, featureFlags }: FeatureFlagsProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useFeatureFlags(): FeatureFlags;
+export {};