@b3dotfun/sdk 0.0.30-alpha.9 → 0.0.31-alpha.0

package/dist/cjs/global-account/utils/analytics.d.ts

@@ -1,3 +1,9 @@
+declare global {
+    interface Window {
+        gtag: (...args: any[]) => void;
+        dataLayer: any[];
+    }
+}
 /**
  * Load Google Analytics 4 script and initialize
  */

package/dist/cjs/global-account/utils/analytics.js

@@ -1,4 +1,5 @@
 "use strict";
+// Global window interface augmentations for B3 SDK
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.sendGA4Event = exports.loadGA4Script = void 0;
 const GA4_MEASUREMENT_ID = "G-VER9DKJH87";

package/dist/esm/anyspend/react/components/AnyspendDepositHype.d.ts

@@ -1,3 +1,7 @@
+export declare const HYPE_TOKEN_DETAILS: {
+    SYMBOL: string;
+    LOGO_URI: string;
+};
 export interface AnySpendDepositHypeProps {
     loadOrder?: string;
     mode?: "modal" | "page";

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

@@ -22,6 +22,10 @@ import { ESCROW_ABI } from "../../../anyspend/abis/escrow.js";
 import { ArrowDown } from "lucide-react";
 import { PanelOnramp } from "./common/PanelOnramp.js";
 const SLIPPAGE_PERCENT = 3;
+export const HYPE_TOKEN_DETAILS = {
+    SYMBOL: "HYPE",
+    LOGO_URI: "https://cdn.hypeduel.com/hypes-coin.svg",
+};
 function generateEncodedDataForDepositHype(amount, beneficiary) {
     invariant(BigInt(amount) > 0, "Amount must be greater than zero");
     const encodedData = encodeFunctionData({
@@ -118,7 +122,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(PaySection, { paymentType: "crypto", selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, selectedFiatPaymentMethod: selectedFiatPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), onSelectFiatPaymentMethod: () => setActivePanel(PanelView.FIAT_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, 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, 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(PaySection, { paymentType: "crypto", selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, selectedFiatPaymentMethod: selectedFiatPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), onSelectFiatPaymentMethod: () => setActivePanel(PanelView.FIAT_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 => {
                                 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.d.ts

@@ -12,6 +12,8 @@ interface CryptoReceiveSectionProps {
     setSelectedDstToken?: (token: components["schemas"]["Token"]) => void;
     onChangeDstAmount?: (value: string) => void;
     anyspendQuote?: any;
+    dstTokenSymbol?: string;
+    dstTokenLogoURI?: string;
 }
-export declare function CryptoReceiveSection({ isDepositMode, isBuyMode, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, }: CryptoReceiveSectionProps): import("react/jsx-runtime").JSX.Element;
+export declare function CryptoReceiveSection({ isDepositMode, isBuyMode, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, }: CryptoReceiveSectionProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -6,10 +6,10 @@ import { formatDisplayNumber } from "../../../../shared/utils/number.js";
 import { ChevronRight } from "lucide-react";
 import { motion } from "motion/react";
 import { OrderTokenAmount } from "./OrderTokenAmount.js";
-export function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, }) {
+export function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, }) {
     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: [dstToken.metadata?.logoURI && (_jsx("img", { src: dstToken.metadata.logoURI, alt: dstToken.symbol, className: "h-8 w-8 rounded-full" })), _jsx("span", { className: "text-as-brand text-lg font-bold", children: dstToken.symbol })] })] })) : (
+            _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",

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

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

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

@@ -2,14 +2,14 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useCoinbaseOnrampOptions, useGeoOnrampOptions } from "../../../../anyspend/react/index.js";
 import { ALL_CHAINS } from "../../../../anyspend/utils/chain.js";
 import { Input, useGetGeo, useProfile } from "../../../../global-account/react/index.js";
-import { formatUsername } from "../../../../shared/utils/index.js";
+import { cn, formatUsername } from "../../../../shared/utils/index.js";
 import { formatAddress } from "../../../../shared/utils/formatAddress.js";
 import { ChevronRight, Wallet } from "lucide-react";
 import { useRef } from "react";
 import { toast } from "sonner";
 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, }) {
+export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken = false, }) {
     // Get geo-based onramp options to access fee information
     const { stripeWeb2Support } = useGeoOnrampOptions(srcAmountOnRamp);
     // Helper function to get fees from API data
@@ -68,9 +68,9 @@ export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPayme
     };
     return (_jsxs("div", { className: "panel-onramp bg-as-surface-primary flex w-full flex-col", children: [_jsxs("div", { className: "border-as-border-secondary bg-as-surface-secondary relative flex w-full flex-col rounded-2xl border p-4", children: [_jsxs("div", { className: "flex h-7 w-full items-center justify-between", children: [_jsx("span", { className: "text-as-tertiarry flex items-center text-sm font-bold", children: "Pay" }), _jsx("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm", onClick: () => setActivePanel(fiatPaymentMethodIndex), children: selectedPaymentMethod === FiatPaymentMethod.COINBASE_PAY ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-blue-600", children: _jsx("span", { className: "text-xs font-bold text-white", children: "C" }) }), "Coinbase Pay"] }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : selectedPaymentMethod === FiatPaymentMethod.STRIPE ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-blue-600", children: _jsx("span", { className: "text-xs font-bold text-white", children: "S" }) }), "Stripe"] }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : (_jsxs(_Fragment, { children: ["Select payment method", _jsx(ChevronRight, { className: "h-4 w-4" })] })) })] }), _jsx("div", { className: "flex items-center justify-center pb-2 pt-8", children: _jsxs("div", { className: "flex gap-1", children: [_jsx("span", { className: "text-as-tertiarry text-2xl font-bold", children: "$" }), _jsx(Input, { ref: amountInputRef, type: "text", value: srcAmountOnRamp, onChange: handleAmountChange, placeholder: "5", className: "text-as-primary placeholder:text-as-primary/50 h-auto min-w-[70px] border-0 bg-transparent p-0 px-3 pt-1 text-4xl font-bold focus-visible:ring-0 focus-visible:ring-offset-0", style: {
                                         width: `${Math.max(50, srcAmountOnRamp.length * 34)}px`,
-                                    } })] }) }), _jsx("div", { className: "mx-auto mb-6 inline-grid grid-cols-4 gap-2", 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
+                                    } })] }) }), _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 && (_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", " ", 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: (() => {
+                                : "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)] })] }));

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

@@ -0,0 +1,6 @@
+interface BalanceContentProps {
+    onLogout?: () => void;
+    partnerId: string;
+}
+export declare function BalanceContent({ onLogout, partnerId }: BalanceContentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/global-account/react/components/ManageAccount/BalanceContent.js

@@ -0,0 +1,88 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, CopyToClipboard, useAuthentication, useB3BalanceFromAddresses, useModalStore, useNativeBalance, useProfile, } from "../../../../global-account/react/index.js";
+import { BankIcon } from "../../../../global-account/react/components/icons/BankIcon.js";
+import { SignOutIcon } from "../../../../global-account/react/components/icons/SignOutIcon.js";
+import { SwapIcon } from "../../../../global-account/react/components/icons/SwapIcon.js";
+import { formatUsername } from "../../../../shared/utils/index.js";
+import { Loader2, Pencil } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+import { useActiveAccount } from "thirdweb/react";
+import useFirstEOA from "../../hooks/useFirstEOA.js";
+import { B3TokenIcon, EthereumTokenIcon } from "../TokenIcon.js";
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../ui/accordion.js";
+import { TokenBalanceRow } from "./TokenBalanceRow.js";
+function centerTruncate(str, length = 4) {
+    if (str.length <= length * 2)
+        return str;
+    return `${str.slice(0, length)}...${str.slice(-length)}`;
+}
+export function BalanceContent({ onLogout, partnerId }) {
+    const account = useActiveAccount();
+    const { address: eoaAddress, info: eoaInfo } = useFirstEOA();
+    const { data: profile } = useProfile({
+        address: eoaAddress || account?.address,
+        fresh: true,
+    });
+    const { setB3ModalOpen, setB3ModalContentType } = useModalStore();
+    const { logout } = useAuthentication(partnerId);
+    const [logoutLoading, setLogoutLoading] = useState(false);
+    const [openAccordions, setOpenAccordions] = useState([]);
+    const hasExpandedRef = useRef(false);
+    console.log("eoaAddress", eoaAddress);
+    console.log("account?.address", account?.address);
+    // Balance data fetching
+    const { data: eoaNativeBalance, isLoading: eoaNativeLoading } = useNativeBalance(eoaAddress);
+    const { data: eoaB3Balance, isLoading: eoaB3Loading } = useB3BalanceFromAddresses(eoaAddress);
+    const { data: b3Balance, isLoading: b3Loading } = useB3BalanceFromAddresses(account?.address);
+    const { data: nativeBalance, isLoading: nativeLoading } = useNativeBalance(account?.address);
+    // Calculate total USD values for comparison
+    const globalAccountTotalUsd = (b3Balance?.balanceUsd || 0) + (nativeBalance?.totalUsd || 0);
+    const eoaTotalUsd = (eoaB3Balance?.balanceUsd || 0) + (eoaNativeBalance?.totalUsd || 0);
+    // Check if both data sets are ready (not loading and have data)
+    const isGlobalDataReady = !b3Loading && !nativeLoading && b3Balance !== undefined && nativeBalance !== undefined;
+    const isEoaDataReady = !eoaAddress || (!eoaB3Loading && !eoaNativeLoading && eoaB3Balance !== undefined && eoaNativeBalance !== undefined);
+    const isBothDataReady = isGlobalDataReady && isEoaDataReady;
+    // Reset expansion flag when component mounts
+    useEffect(() => {
+        hasExpandedRef.current = false;
+        setOpenAccordions([]);
+    }, []);
+    // Auto-expand the appropriate section when data becomes ready
+    useEffect(() => {
+        if (isBothDataReady && !hasExpandedRef.current && eoaAddress && account?.address) {
+            hasExpandedRef.current = true;
+            // Determine which section to expand based on higher balance
+            if (globalAccountTotalUsd === 0 && eoaTotalUsd === 0) {
+                // If both have 0 balance, expand global account by default
+                setOpenAccordions(["global-account"]);
+            }
+            else if (globalAccountTotalUsd >= eoaTotalUsd) {
+                setOpenAccordions(["global-account"]);
+            }
+            else {
+                setOpenAccordions(["eoa-account"]);
+            }
+        }
+    }, [isBothDataReady, globalAccountTotalUsd, eoaTotalUsd, eoaAddress, account?.address]);
+    const onLogoutEnhanced = async () => {
+        setLogoutLoading(true);
+        await logout();
+        onLogout?.();
+        setB3ModalOpen(false);
+        setLogoutLoading(false);
+    };
+    return (_jsxs("div", { className: "flex flex-col gap-6", children: [_jsx("div", { className: "flex items-center justify-between", children: _jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "relative", children: [profile?.avatar ? (_jsx("img", { src: profile?.avatar, alt: "Profile", className: "size-24 rounded-full" })) : (_jsx("div", { className: "bg-b3-primary-wash size-24 rounded-full" })), _jsx("div", { className: "bg-b3-grey border-b3-background absolute -bottom-1 -right-1 flex size-8 items-center justify-center rounded-full border-4", children: _jsx(Pencil, { size: 16, className: "text-b3-background" }) })] }), _jsxs("div", { children: [_jsx("h2", { className: "text-b3-grey text-xl font-semibold", children: profile?.displayName || formatUsername(profile?.name || "") }), _jsxs("div", { className: "border-b3-line bg-b3-line/20 hover:bg-b3-line/40 flex w-fit items-center gap-2 rounded-full border px-3 py-1 transition-colors", children: [_jsx("span", { className: "text-b3-foreground-muted font-mono text-xs", children: centerTruncate(account?.address || "", 6) }), _jsx(CopyToClipboard, { text: account?.address || "" })] })] })] }) }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs(Button, { className: "manage-account-deposit bg-b3-primary-wash hover:bg-b3-primary-wash/70 h-[84px] w-full flex-col items-start gap-2 rounded-2xl", onClick: () => {
+                            setB3ModalOpen(true);
+                            setB3ModalContentType({
+                                type: "anySpend",
+                                defaultActiveTab: "fiat",
+                                showBackButton: true,
+                            });
+                        }, children: [_jsx(BankIcon, { size: 24, className: "text-b3-primary-blue shrink-0" }), _jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Deposit" })] }), _jsxs(Button, { className: "manage-account-swap bg-b3-primary-wash hover:bg-b3-primary-wash/70 flex h-[84px] w-full flex-col items-start gap-2 rounded-2xl", onClick: () => {
+                            setB3ModalOpen(true);
+                            setB3ModalContentType({
+                                type: "anySpend",
+                                showBackButton: true,
+                            });
+                        }, children: [_jsx(SwapIcon, { size: 24, className: "text-b3-primary-blue" }), _jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Swap" })] })] }), _jsxs(Accordion, { type: "multiple", value: openAccordions, onValueChange: setOpenAccordions, className: "space-y-2", children: [_jsxs(AccordionItem, { value: "global-account", className: "border-none", children: [_jsx(AccordionTrigger, { className: "text-b3-grey font-neue-montreal-semibold py-2 hover:no-underline", children: _jsx("span", { children: "Balance" }) }), _jsxs(AccordionContent, { className: "space-y-4", children: [_jsx(TokenBalanceRow, { icon: _jsx(B3TokenIcon, { className: "size-10" }), name: "B3", balance: `${b3Balance?.formattedTotal || "0.00"} B3`, usdValue: b3Balance?.balanceUsdFormatted || "0.00", priceChange: b3Balance?.priceChange24h }), _jsx(TokenBalanceRow, { icon: _jsx(EthereumTokenIcon, { className: "size-10" }), name: "Ethereum", balance: `${nativeBalance?.formattedTotal || "0.00"} ETH`, usdValue: nativeBalance?.formattedTotalUsd || "0.00", priceChange: nativeBalance?.priceChange24h })] })] }), eoaAddress && (_jsxs(AccordionItem, { value: "eoa-account", className: "border-none", children: [_jsx(AccordionTrigger, { className: "text-b3-grey font-neue-montreal-semibold py-2 hover:no-underline", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("span", { children: ["Connected ", eoaInfo?.data?.name || "Wallet"] }), _jsxs("div", { className: "border-b3-line bg-b3-line/20 hover:bg-b3-line/40 flex w-fit items-center gap-2 rounded-full border px-3 py-1 transition-colors", children: [_jsx("span", { className: "text-b3-foreground-muted font-mono text-xs", children: centerTruncate(eoaAddress, 6) }), _jsx(CopyToClipboard, { text: eoaAddress })] })] }) }), _jsxs(AccordionContent, { className: "space-y-4", children: [_jsx(TokenBalanceRow, { icon: _jsx(B3TokenIcon, { className: "size-10" }), name: "B3", balance: `${eoaB3Balance?.formattedTotal || "0.00"} B3`, usdValue: eoaB3Balance?.balanceUsdFormatted || "0.00", priceChange: eoaB3Balance?.priceChange24h }), _jsx(TokenBalanceRow, { icon: _jsx(EthereumTokenIcon, { className: "size-10" }), name: "Ethereum", balance: `${eoaNativeBalance?.formattedTotal || "0.00"} ETH`, usdValue: eoaNativeBalance?.formattedTotalUsd || "0.00", priceChange: eoaNativeBalance?.priceChange24h })] })] }))] }), _jsxs("button", { className: "border-b3-line hover:bg-b3-line relative flex w-full items-center justify-center rounded-2xl border p-4 transition-colors", onClick: onLogoutEnhanced, children: [_jsx("span", { className: "font-neue-montreal-semibold text-b3-grey", children: "Sign out" }), _jsx("div", { className: "absolute right-4", children: logoutLoading ? (_jsx(Loader2, { className: "animate-spin", size: 16 })) : (_jsx(SignOutIcon, { size: 16, className: "text-b3-grey" })) })] })] }));
+}

package/dist/esm/global-account/react/components/ManageAccount/ContentTokens.js

@@ -9,6 +9,7 @@ import { NumericFormat } from "react-number-format";
 import { toast } from "sonner";
 import { useActiveAccount } from "thirdweb/react";
 import { encodeFunctionData, erc20Abi, isAddress, parseUnits } from "viem";
+import invariant from "invariant";
 // Panel view enum for managing navigation between token list and send form
 var TokenPanelView;
 (function (TokenPanelView) {
@@ -140,6 +141,7 @@ export function ContentTokens({ activeTab }) {
                 address: displayToken.address,
             };
             try {
+                invariant(isAddress(recipientAddress), "Recipient address is not a valid address");
                 const sendTokenData = encodeFunctionData({
                     abi: erc20Abi,
                     functionName: "transfer",

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

@@ -1,42 +1,25 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, CopyToClipboard, TabsContentPrimitive, TabsListPrimitive, TabsPrimitive, TabTriggerPrimitive, useAccountAssets, useAuthentication, useB3BalanceFromAddresses, useGetAllTWSigners, useModalStore, useNativeBalance, useProfile, useRemoveSessionKey, } from "../../../../global-account/react/index.js";
-import { BankIcon } from "../../../../global-account/react/components/icons/BankIcon.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, TabsContentPrimitive, TabsListPrimitive, TabsPrimitive, TabTriggerPrimitive, useAccountAssets, useAuthentication, useGetAllTWSigners, useModalStore, useRemoveSessionKey, } from "../../../../global-account/react/index.js";
 import { SignOutIcon } from "../../../../global-account/react/components/icons/SignOutIcon.js";
-import { SwapIcon } from "../../../../global-account/react/components/icons/SwapIcon.js";
-import { formatUsername } from "../../../../shared/utils/index.js";
 import { formatNumber } from "../../../../shared/utils/formatNumber.js";
 import { client } from "../../../../shared/utils/thirdweb.js";
-import { BarChart3, Coins, Image, LinkIcon, Loader2, Pencil, Settings, Triangle, UnlinkIcon } from "lucide-react";
+import { BarChart3, Coins, Image, LinkIcon, Loader2, Settings, UnlinkIcon } from "lucide-react";
 import { useState } from "react";
 import { useActiveAccount, useProfiles, useUnlinkProfile } from "thirdweb/react";
 import { formatUnits } from "viem";
-import useFirstEOA from "../../hooks/useFirstEOA.js";
 import { getProfileDisplayInfo } from "../../utils/profileDisplay.js";
 import { AccountAssets } from "../AccountAssets/AccountAssets.js";
 import { ContentTokens } from "./ContentTokens.js";
-function centerTruncate(str, length = 4) {
-    if (str.length <= length * 2)
-        return str;
-    return `${str.slice(0, length)}...${str.slice(-length)}`;
-}
+import { BalanceContent } from "./BalanceContent.js";
 export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit, chain, partnerId, }) {
     const [revokingSignerId, setRevokingSignerId] = useState(null);
     const account = useActiveAccount();
     const { data: nfts, isLoading } = useAccountAssets(account?.address);
-    const { data: b3Balance } = useB3BalanceFromAddresses(account?.address);
-    const { data: nativeBalance } = useNativeBalance(account?.address);
-    const { address: eoaAddress } = useFirstEOA();
-    const { data: profile } = useProfile({
-        address: eoaAddress || account?.address,
-        fresh: true,
-    });
-    const { data: eoaNativeBalance } = useNativeBalance(eoaAddress);
-    const { data: eoaB3Balance } = useB3BalanceFromAddresses(eoaAddress);
     const { data: signers, refetch: refetchSigners } = useGetAllTWSigners({
         chain,
         accountAddress: account?.address,
     });
-    const { setB3ModalOpen, setB3ModalContentType, contentType } = useModalStore();
+    const { setB3ModalOpen, contentType } = useModalStore();
     const { activeTab = "overview", setActiveTab } = contentType;
     const { logout } = useAuthentication(partnerId);
     const [logoutLoading, setLogoutLoading] = useState(false);
@@ -63,23 +46,6 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
         setB3ModalOpen(false);
         setLogoutLoading(false);
     };
-    const BalanceContent = () => {
-        const { info: eoaInfo } = useFirstEOA();
-        return (_jsxs("div", { className: "flex flex-col gap-6", children: [_jsx("div", { className: "flex items-center justify-between", children: _jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "relative", children: [profile?.avatar ? (_jsx("img", { src: profile?.avatar, alt: "Profile", className: "size-24 rounded-full" })) : (_jsx("div", { className: "bg-b3-primary-wash size-24 rounded-full" })), _jsx("div", { className: "bg-b3-grey border-b3-background absolute -bottom-1 -right-1 flex size-8 items-center justify-center rounded-full border-4", children: _jsx(Pencil, { size: 16, className: "text-b3-background" }) })] }), _jsxs("div", { children: [_jsx("h2", { className: "text-b3-grey text-xl font-semibold", children: profile?.displayName || formatUsername(profile?.name || "") }), _jsxs("div", { className: "border-b3-line bg-b3-line/20 hover:bg-b3-line/40 flex w-fit items-center gap-2 rounded-full border px-3 py-1 transition-colors", children: [_jsx("span", { className: "text-b3-foreground-muted font-mono text-xs", children: centerTruncate(account?.address || "", 6) }), _jsx(CopyToClipboard, { text: account?.address || "" })] })] })] }) }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs(Button, { className: "manage-account-deposit bg-b3-primary-wash hover:bg-b3-primary-wash/70 h-[84px] w-full flex-col items-start gap-2 rounded-2xl", onClick: () => {
-                                setB3ModalOpen(true);
-                                setB3ModalContentType({
-                                    type: "anySpend",
-                                    defaultActiveTab: "fiat",
-                                    showBackButton: true,
-                                });
-                            }, children: [_jsx(BankIcon, { size: 24, className: "text-b3-primary-blue shrink-0" }), _jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Deposit" })] }), _jsxs(Button, { className: "manage-account-swap bg-b3-primary-wash hover:bg-b3-primary-wash/70 flex h-[84px] w-full flex-col items-start gap-2 rounded-2xl", onClick: () => {
-                                setB3ModalOpen(true);
-                                setB3ModalContentType({
-                                    type: "anySpend",
-                                    showBackButton: true,
-                                });
-                            }, children: [_jsx(SwapIcon, { size: 24, className: "text-b3-primary-blue" }), _jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Swap" })] })] }), _jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-b3-grey font-neue-montreal-semibold", children: "Balance" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: _jsx("img", { src: "https://cdn.b3.fun/b3-coin-3d.png", alt: "B3", className: "size-10" }) }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: "B3" }) }), _jsxs("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: [b3Balance?.formattedTotal || "0.00", " B3"] })] })] }), _jsxs("div", { className: "text-right", children: [_jsxs("div", { className: "text-b3-grey font-neue-montreal-semibold", children: ["$", b3Balance?.balanceUsdFormatted || "0.00"] }), _jsx("div", { className: "flex items-center gap-1", children: b3Balance?.priceChange24h !== null && b3Balance?.priceChange24h !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Triangle, { className: `size-3 ${b3Balance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}` }), _jsxs("span", { className: `font-neue-montreal-medium text-sm ${b3Balance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`, children: [b3Balance.priceChange24h >= 0 ? "+" : "", b3Balance.priceChange24h.toFixed(2), "%"] })] })) : (_jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "--" })) })] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: _jsx("img", { src: "https://cdn.b3.fun/ethereum.svg", alt: "ETH", className: "size-10" }) }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: "Ethereum" }) }), _jsxs("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: [nativeBalance?.formattedTotal || "0.00", " ETH"] })] })] }), _jsxs("div", { className: "text-right", children: [_jsxs("div", { className: "text-b3-grey font-neue-montreal-semibold", children: ["$", nativeBalance?.formattedTotalUsd || "0.00"] }), _jsx("div", { className: "flex items-center gap-2", children: nativeBalance?.priceChange24h !== null && nativeBalance?.priceChange24h !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Triangle, { className: `size-3 ${nativeBalance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}` }), _jsxs("span", { className: `font-neue-montreal-medium text-sm ${nativeBalance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`, children: [nativeBalance.priceChange24h >= 0 ? "+" : "", nativeBalance.priceChange24h.toFixed(2), "%"] })] })) : (_jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "--" })) })] })] })] }), eoaAddress && (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("h3", { className: "text-b3-grey font-neue-montreal-semibold", children: ["Connected ", eoaInfo?.data?.name || "Wallet"] }), _jsxs("div", { className: "border-b3-line bg-b3-line/20 hover:bg-b3-line/40 flex w-fit items-center gap-2 rounded-full border px-3 py-1 transition-colors", children: [_jsx("span", { className: "text-b3-foreground-muted font-mono text-xs", children: centerTruncate(eoaAddress, 6) }), _jsx(CopyToClipboard, { text: eoaAddress })] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: _jsx("img", { src: "https://cdn.b3.fun/b3-coin-3d.png", alt: "B3", className: "size-10" }) }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: "B3" }) }), _jsxs("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: [eoaB3Balance?.formattedTotal || "0.00", " B3"] })] })] }), _jsxs("div", { className: "text-right", children: [_jsxs("div", { className: "text-b3-grey font-neue-montreal-semibold", children: ["$", eoaB3Balance?.balanceUsdFormatted || "0.00"] }), _jsx("div", { className: "flex items-center gap-1", children: eoaB3Balance?.priceChange24h !== null && eoaB3Balance?.priceChange24h !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Triangle, { className: `size-3 ${eoaB3Balance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}` }), _jsxs("span", { className: `font-neue-montreal-medium text-sm ${eoaB3Balance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`, children: [eoaB3Balance.priceChange24h >= 0 ? "+" : "", eoaB3Balance.priceChange24h.toFixed(2), "%"] })] })) : (_jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "--" })) })] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: _jsx("img", { src: "https://cdn.b3.fun/ethereum.svg", alt: "ETH", className: "size-10" }) }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: "Ethereum" }) }), _jsxs("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: [eoaNativeBalance?.formattedTotal || "0.00", " ETH"] })] })] }), _jsxs("div", { className: "text-right", children: [_jsxs("div", { className: "text-b3-grey font-neue-montreal-semibold", children: ["$", eoaNativeBalance?.formattedTotalUsd || "0.00"] }), _jsx("div", { className: "flex items-center gap-2", children: eoaNativeBalance?.priceChange24h !== null && eoaNativeBalance?.priceChange24h !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Triangle, { className: `size-3 ${eoaNativeBalance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}` }), _jsxs("span", { className: `font-neue-montreal-medium text-sm ${eoaNativeBalance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`, children: [eoaNativeBalance.priceChange24h >= 0 ? "+" : "", eoaNativeBalance.priceChange24h.toFixed(2), "%"] })] })) : (_jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "--" })) })] })] })] })), _jsxs("div", { className: "border-b3-line flex items-center justify-between rounded-2xl border p-4", children: [_jsxs("div", { className: "", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "h-4" }), _jsx("h3", { className: "font-neue-montreal-semibold text-b3-grey", children: "Global Account" })] }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium mt-2 text-sm", children: "Your universal account for all B3 apps" })] }), _jsx("button", { className: "text-b3-grey hover:text-b3-grey/80 hover:bg-b3-line border-b3-line flex size-12 items-center justify-center rounded-full border", onClick: onLogoutEnhanced, children: logoutLoading ? _jsx(Loader2, { className: "animate-spin" }) : _jsx(SignOutIcon, { size: 16, className: "text-b3-grey" }) })] })] }));
-    };
     const AppsContent = () => (_jsxs("div", { className: "space-y-4", children: [signers?.map((signer) => (_jsx("div", { className: "rounded-xl border border-gray-200 p-4 dark:border-gray-800", children: _jsxs("div", { className: "flex items-start justify-between", children: [_jsxs("div", { className: "flex items-start gap-4", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-gray-100 dark:bg-gray-800", children: _jsx("span", { className: "text-xs font-medium text-gray-600 dark:text-gray-400", children: "App" }) }), _jsxs("div", { children: [_jsx("h3", { className: "font-medium text-gray-900 dark:text-white", children: signer.partner.name }), _jsxs("div", { className: "mt-2 space-y-1", children: [_jsxs("p", { className: "text-xs text-gray-500", children: ["Added ", new Date(signer.createdAt).toLocaleDateString()] }), _jsxs("p", { className: "text-xs text-gray-500", children: ["Expires ", new Date(Number(signer.endTimestamp) * 1000).toLocaleDateString()] }), _jsxs("p", { className: "text-xs text-gray-500", children: ["Max spend: ", formatNumber(Number(formatUnits(signer.nativeTokenLimitPerTransaction, 18))), " ETH"] })] })] })] }), _jsx(Button, { variant: "outline", size: "sm", className: "border-red-200 text-red-500 hover:border-red-300 hover:text-red-600", onClick: () => handleRevoke(signer), disabled: revokingSignerId === signer.id, children: revokingSignerId === signer.id ? "Revoking..." : "Revoke" })] }) }, signer.id))), !signers?.length && _jsx("div", { className: "py-12 text-center text-gray-500", children: "No connected apps" })] }));
     const SettingsContent = () => {
         const [unlinkingAccountId, setUnlinkingAccountId] = useState(null);
@@ -129,5 +95,5 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
                     if (["overview", "tokens", "nfts", "apps", "settings"].includes(tab)) {
                         setActiveTab?.(tab);
                     }
-                }, children: [_jsx("div", { className: "px-4", children: _jsxs(TabsListPrimitive, { className: "grid h-auto grid-cols-2 grid-rows-2 gap-3 rounded-none border-none bg-transparent", children: [_jsxs(TabTriggerPrimitive, { value: "overview", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(BarChart3, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Overview" })] }), _jsxs(TabTriggerPrimitive, { value: "tokens", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(Coins, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Tokens" })] }), _jsxs(TabTriggerPrimitive, { value: "nfts", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(Image, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "NFTs" })] }), _jsxs(TabTriggerPrimitive, { value: "settings", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(Settings, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Settings" })] })] }) }), _jsx(TabsContentPrimitive, { value: "overview", className: "px-4 pb-4 pt-2", children: _jsx(BalanceContent, {}) }), _jsx(TabsContentPrimitive, { value: "tokens", className: "px-4 pb-4 pt-2", children: _jsx(ContentTokens, { activeTab: activeTab }) }), _jsx(TabsContentPrimitive, { value: "nfts", className: "px-4 pb-4 pt-2", children: _jsx("div", { className: "grid grid-cols-3 gap-4", children: nfts?.nftResponse ? (_jsx(AccountAssets, { nfts: nfts.nftResponse, isLoading: isLoading })) : (_jsx("div", { className: "col-span-3 py-12 text-center text-gray-500", children: "No NFTs found" })) }) }), _jsx(TabsContentPrimitive, { value: "apps", className: "px-4 pb-4 pt-2", children: _jsx(AppsContent, {}) }), _jsx(TabsContentPrimitive, { value: "settings", className: "px-4 pb-4 pt-2", children: _jsx(SettingsContent, {}) })] }) }) }));
+                }, children: [_jsx("div", { className: "px-4", children: _jsxs(TabsListPrimitive, { className: "grid h-auto grid-cols-2 grid-rows-2 gap-3 rounded-none border-none bg-transparent", children: [_jsxs(TabTriggerPrimitive, { value: "overview", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(BarChart3, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Overview" })] }), _jsxs(TabTriggerPrimitive, { value: "tokens", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(Coins, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Tokens" })] }), _jsxs(TabTriggerPrimitive, { value: "nfts", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(Image, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "NFTs" })] }), _jsxs(TabTriggerPrimitive, { value: "settings", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [_jsx(Settings, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Settings" })] })] }) }), _jsx(TabsContentPrimitive, { value: "overview", className: "px-4 pb-4 pt-2", children: _jsx(BalanceContent, { onLogout: onLogout, partnerId: partnerId }) }), _jsx(TabsContentPrimitive, { value: "tokens", className: "px-4 pb-4 pt-2", children: _jsx(ContentTokens, { activeTab: activeTab }) }), _jsx(TabsContentPrimitive, { value: "nfts", className: "px-4 pb-4 pt-2", children: _jsx("div", { className: "grid grid-cols-3 gap-4", children: nfts?.nftResponse ? (_jsx(AccountAssets, { nfts: nfts.nftResponse, isLoading: isLoading })) : (_jsx("div", { className: "col-span-3 py-12 text-center text-gray-500", children: "No NFTs found" })) }) }), _jsx(TabsContentPrimitive, { value: "apps", className: "px-4 pb-4 pt-2", children: _jsx(AppsContent, {}) }), _jsx(TabsContentPrimitive, { value: "settings", className: "px-4 pb-4 pt-2", children: _jsx(SettingsContent, {}) })] }) }) }));
 }

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

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+interface TokenBalanceRowProps {
+    icon: ReactNode;
+    name: string;
+    balance: string;
+    usdValue: string;
+    priceChange?: number | null;
+}
+export declare function TokenBalanceRow({ icon, name, balance, usdValue, priceChange }: TokenBalanceRowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/global-account/react/components/ManageAccount/TokenBalanceRow.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Triangle } from "lucide-react";
+export function TokenBalanceRow({ icon, name, balance, usdValue, priceChange }) {
+    return (_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: icon }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: name }) }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: balance })] })] }), _jsxs("div", { className: "text-right", children: [_jsxs("div", { className: "text-b3-grey font-neue-montreal-semibold", children: ["$", usdValue] }), _jsx("div", { className: "flex items-center gap-1", children: priceChange !== null && priceChange !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Triangle, { className: `size-3 ${priceChange >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}` }), _jsxs("span", { className: `font-neue-montreal-medium text-sm ${priceChange >= 0 ? "text-b3-positive" : "text-b3-negative"}`, children: [priceChange >= 0 ? "+" : "", priceChange.toFixed(2), "%"] })] })) : (_jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "--" })) })] })] }));
+}

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

@@ -0,0 +1,11 @@
+import React from "react";
+interface TokenIconProps {
+    src: string;
+    alt: string;
+    className?: string;
+    size?: number;
+}
+export declare const TokenIcon: React.FC<TokenIconProps>;
+export declare const B3TokenIcon: React.FC<Omit<TokenIconProps, "src" | "alt">>;
+export declare const EthereumTokenIcon: React.FC<Omit<TokenIconProps, "src" | "alt">>;
+export {};

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

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../../shared/utils/index.js";
+import { useCallback, useMemo, useState } from "react";
+// Create a global image cache to prevent re-loading
+const imageCache = new Map();
+export const TokenIcon = ({ src, alt, className, size = 40 }) => {
+    const [isLoaded, setIsLoaded] = useState(() => imageCache.get(src) || false);
+    const [hasError, setHasError] = useState(false);
+    const handleLoad = useCallback(() => {
+        imageCache.set(src, true);
+        setIsLoaded(true);
+    }, [src]);
+    const handleError = useCallback(() => {
+        setHasError(true);
+    }, []);
+    // Memoize the image element to prevent unnecessary re-renders
+    const imageElement = useMemo(() => (_jsx("img", { src: src, alt: alt, className: cn("transition-opacity duration-200", className, {
+            "opacity-100": isLoaded && !hasError,
+            "opacity-0": !isLoaded || hasError,
+        }), onLoad: handleLoad, onError: handleError, loading: "eager" // Load immediately since these are critical UI elements
+        , decoding: "async", style: {
+            width: size,
+            height: size,
+        } })), [src, alt, className, isLoaded, hasError, handleLoad, handleError, size]);
+    // Show a placeholder while loading or if there's an error
+    const placeholder = useMemo(() => (_jsx("div", { className: cn("bg-b3-primary-wash flex items-center justify-center rounded-full transition-opacity duration-200", {
+            "opacity-0": isLoaded && !hasError,
+            "opacity-100": !isLoaded || hasError,
+        }), style: {
+            width: size,
+            height: size,
+        }, children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-xs", children: alt.charAt(0).toUpperCase() }) })), [alt, isLoaded, hasError, size]);
+    return (_jsxs("div", { className: "relative inline-block", style: { width: size, height: size }, children: [placeholder, _jsx("div", { className: "absolute inset-0", children: imageElement })] }));
+};
+// Pre-defined token icons for common tokens
+export const B3TokenIcon = props => (_jsx(TokenIcon, { src: "https://cdn.b3.fun/b3-coin-3d.png", alt: "B3", ...props }));
+export const EthereumTokenIcon = props => (_jsx(TokenIcon, { src: "https://cdn.b3.fun/ethereum.svg", alt: "ETH", ...props }));

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

@@ -0,0 +1,7 @@
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import * as React from "react";
+declare const Accordion: React.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionItem: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AccordionContent: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/esm/global-account/react/components/ui/accordion.js

@@ -0,0 +1,14 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import { ChevronDown } from "lucide-react";
+import * as React from "react";
+import { cn } from "../../../../shared/utils/index.js";
+const Accordion = AccordionPrimitive.Root;
+const AccordionItem = React.forwardRef(({ className, ...props }, ref) => (_jsx(AccordionPrimitive.Item, { ref: ref, className: cn("border-b3-line border-b", className), ...props })));
+AccordionItem.displayName = "AccordionItem";
+const AccordionTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { ref: ref, className: cn("flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180", className), ...props, children: [children, _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 transition-transform duration-200" })] }) })));
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
+const AccordionContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(AccordionPrimitive.Content, { ref: ref, className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm transition-all", ...props, children: _jsx("div", { className: cn("pb-4 pt-0", className), children: children }) })));
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/esm/global-account/react/components/ui/dialog.js

@@ -12,7 +12,7 @@ const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(D
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 const DialogContent = React.forwardRef(({ className, children, hideCloseButton = false, closeBtnClassName, ...props }, ref) => {
     const container = typeof window !== "undefined" ? document.getElementById("b3-root") : null;
-    return (_jsxs(DialogPortal, { container: container, children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { ref: ref, className: cn("bg-b3-react-background fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border p-6 shadow-lg !outline-none", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 duration-500", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]", "[perspective:1200px] [transform-style:preserve-3d] sm:rounded-xl", "transition-all ease-out", className), ...props, children: [children, !hideCloseButton && (_jsxs(DialogPrimitive.Close, { className: cn("data-[state=open]:bg-b3-react-background data-[state=open]:text-b3-react-muted-foreground absolute right-2 top-2 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none dark:data-[state=open]:bg-gray-800 dark:data-[state=open]:text-gray-400", closeBtnClassName), children: [_jsx(X, { className: "h-5 w-5" }), _jsx("span", { className: "sr-only", children: "Close" })] }))] })] }));
+    return (_jsxs(DialogPortal, { container: container, children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { ref: ref, className: cn("bg-b3-react-background fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border p-6 shadow-lg !outline-none", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 duration-500", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]", "[perspective:1200px] [transform-style:preserve-3d] sm:rounded-xl", "transition-all ease-out", className), ...props, children: [children, !hideCloseButton && (_jsxs(DialogPrimitive.Close, { className: cn("modal-close-button data-[state=open]:bg-b3-react-background data-[state=open]:text-b3-react-muted-foreground absolute right-2 top-2 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none dark:data-[state=open]:bg-gray-800 dark:data-[state=open]:text-gray-400", closeBtnClassName), children: [_jsx(X, { className: "h-5 w-5" }), _jsx("span", { className: "sr-only", children: "Close" })] }))] })] }));
 });
 DialogContent.displayName = DialogPrimitive.Content.displayName;
 const DialogHeader = ({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props }));

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

@@ -9,6 +9,7 @@ import { prepareTransaction, sendTransaction as twSendTransaction } from "thirdw
 import { useSwitchChain, useWalletClient } from "wagmi";
 import { useB3 } from "../components/index.js";
 import { useAccountWallet } from "./useAccountWallet.js";
+import { isAddress } from "viem";
 const partnerId = String(process.env.PUBLIC_THIRDWEB_PARTNER_ID ||
     process.env.NEXT_PUBLIC_THIRDWEB_PARTNER_ID ||
     process.env.PUBLIC_GLOBAL_ACCOUNTS_PARTNER_ID ||
@@ -39,6 +40,7 @@ export function useUnifiedChainSwitchAndExecute() {
             if (!targetChain) {
                 throw new Error(`Chain ${targetChainId} is not supported`);
             }
+            invariant(isAddress(params.to), "params.to is not a valid address");
             const hash = await walletClient.sendTransaction({
                 account: signer,
                 chain: targetChain,

package/dist/esm/global-account/utils/analytics.d.ts

@@ -1,3 +1,9 @@
+declare global {
+    interface Window {
+        gtag: (...args: any[]) => void;
+        dataLayer: any[];
+    }
+}
 /**
  * Load Google Analytics 4 script and initialize
  */

package/dist/esm/global-account/utils/analytics.js

@@ -1,3 +1,4 @@
+// Global window interface augmentations for B3 SDK
 const GA4_MEASUREMENT_ID = "G-VER9DKJH87";
 /**
  * Initialize Google Analytics 4