@b3dotfun/sdk 0.0.64 → 0.0.65-test.1

package/dist/cjs/global-account/react/components/Send/Send.js

@@ -0,0 +1,187 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Send = Send;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const anyspend_1 = require("../../../../anyspend");
+const ChainTokenIcon_1 = require("../../../../anyspend/react/components/common/ChainTokenIcon");
+const react_1 = require("../../../../global-account/react");
+const number_1 = require("../../../../shared/utils/number");
+const invariant_1 = __importDefault(require("invariant"));
+const lucide_react_1 = require("lucide-react");
+const react_2 = require("react");
+const react_number_format_1 = require("react-number-format");
+const sonner_1 = require("sonner");
+const viem_1 = require("viem");
+const useRecentAddressesStore_1 = require("../../stores/useRecentAddressesStore");
+const ModalHeader_1 = __importDefault(require("../ModalHeader/ModalHeader"));
+const button_1 = require("../ui/button");
+function Send({ recipientAddress: initialRecipient, onSuccess }) {
+    const { address } = (0, react_1.useAccountWallet)();
+    const navigateBack = (0, react_1.useModalStore)(state => state.navigateBack);
+    const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
+    // Wizard state
+    const [step, setStep] = (0, react_2.useState)("recipient");
+    const [selectedToken, setSelectedToken] = (0, react_2.useState)(null);
+    const [recipientAddress, setRecipientAddress] = (0, react_2.useState)(initialRecipient || "");
+    const [sendAmount, setSendAmount] = (0, react_2.useState)("");
+    const [isSending, setIsSending] = (0, react_2.useState)(false);
+    const [addressError, setAddressError] = (0, react_2.useState)("");
+    const [showValidatedResult, setShowValidatedResult] = (0, react_2.useState)(false);
+    // Hooks
+    const { data: simBalance, refetch: refetchSimBalance, isLoading: isLoadingBalance } = (0, react_1.useSimBalance)(address);
+    const { switchChainAndExecute } = (0, react_1.useUnifiedChainSwitchAndExecute)();
+    const { sendAnalyticsEvent } = (0, react_1.useAnalytics)();
+    // Recent addresses store
+    const recentAddresses = (0, useRecentAddressesStore_1.useRecentAddressesStore)(state => state.recentAddresses);
+    const addRecentAddress = (0, useRecentAddressesStore_1.useRecentAddressesStore)(state => state.addRecentAddress);
+    // Address validation
+    const handleRecipientAddressChange = (value) => {
+        setRecipientAddress(value);
+        setShowValidatedResult(false);
+        if (value && !(0, viem_1.isAddress)(value)) {
+            setAddressError("Please enter a valid EVM address (0x...)");
+        }
+        else {
+            setAddressError("");
+            if (value && (0, viem_1.isAddress)(value)) {
+                setShowValidatedResult(true);
+            }
+        }
+    };
+    // Paste from clipboard
+    const handlePaste = async () => {
+        try {
+            const text = await navigator.clipboard.readText();
+            const trimmedText = text.trim();
+            setRecipientAddress(trimmedText);
+            if (trimmedText && (0, viem_1.isAddress)(trimmedText)) {
+                setAddressError("");
+                setShowValidatedResult(true);
+            }
+            else if (trimmedText) {
+                setAddressError("Please enter a valid EVM address (0x...)");
+                setShowValidatedResult(false);
+            }
+        }
+        catch (error) {
+            sonner_1.toast.error("Failed to read clipboard");
+        }
+    };
+    // Handle clicking on the validated result to proceed
+    const handleSelectValidatedAddress = () => {
+        if (recipientAddress && (0, viem_1.isAddress)(recipientAddress)) {
+            addRecentAddress(recipientAddress);
+            setStep("token");
+        }
+    };
+    // Go to previous step
+    const handleBack = () => {
+        if (step === "token")
+            setStep("recipient");
+        else if (step === "amount")
+            setStep("token");
+        else if (step === "confirm")
+            setStep("amount");
+        else
+            navigateBack();
+    };
+    // Get current selected token from fresh balance
+    const getCurrentSelectedToken = () => {
+        if (!selectedToken || !simBalance?.balances) {
+            return null;
+        }
+        const found = simBalance.balances.find(token => token.chain_id === selectedToken.chain_id && token.address === selectedToken.address);
+        return found || null;
+    };
+    // Percentage button handler
+    const handlePercentageClick = (percentage) => {
+        const currentToken = getCurrentSelectedToken();
+        if (currentToken) {
+            const tokenBalance = (BigInt(currentToken.amount) * BigInt(percentage)) / BigInt(100);
+            const amount = (0, number_1.formatTokenAmount)(tokenBalance, currentToken.decimals, 30, false);
+            setSendAmount(amount);
+        }
+    };
+    // Send transaction
+    const handleSend = async () => {
+        const sendAmountWithoutCommas = sendAmount.replace(/,/g, "");
+        const currentToken = getCurrentSelectedToken();
+        if (!currentToken || !recipientAddress || !sendAmount || parseFloat(sendAmountWithoutCommas) <= 0) {
+            return;
+        }
+        setIsSending(true);
+        const amountInWei = (0, viem_1.parseUnits)(sendAmountWithoutCommas, currentToken.decimals);
+        const analyticsData = {
+            amount: sendAmount,
+            symbol: currentToken.symbol,
+            chain_id: currentToken.chain_id,
+            address: currentToken.address,
+        };
+        try {
+            (0, invariant_1.default)((0, viem_1.isAddress)(recipientAddress), "Recipient address is not a valid address");
+            const sendTokenData = (0, viem_1.encodeFunctionData)({
+                abi: viem_1.erc20Abi,
+                functionName: "transfer",
+                args: [recipientAddress, amountInWei],
+            });
+            const tx = await switchChainAndExecute(currentToken.chain_id, {
+                to: currentToken.address === "native" ? recipientAddress : currentToken.address,
+                data: sendTokenData,
+                value: currentToken.address === "native" ? amountInWei : BigInt(0),
+            });
+            if (tx) {
+                sendAnalyticsEvent("send_token_button_click", {
+                    ...analyticsData,
+                    success: true,
+                    tx: (0, anyspend_1.getExplorerTxUrl)(currentToken.chain_id, tx),
+                });
+                setStep("success");
+                sonner_1.toast.success(`Successfully sent ${sendAmount} ${currentToken.symbol}`);
+                if (onSuccess) {
+                    onSuccess(tx);
+                }
+                setTimeout(async () => {
+                    await refetchSimBalance();
+                }, 1000);
+            }
+        }
+        catch (error) {
+            sendAnalyticsEvent("send_token_button_click", {
+                ...analyticsData,
+                success: false,
+                reason: error.message || "Unknown error",
+            });
+            sonner_1.toast.error(`Failed to send ${currentToken.symbol}: ${error.message || "Unknown error"}`);
+        }
+        finally {
+            setIsSending(false);
+        }
+    };
+    // Get step title
+    const getStepTitle = () => {
+        switch (step) {
+            case "recipient":
+                return "Select Recipient";
+            case "token":
+                return "Select Token";
+            case "amount":
+                return "Enter Amount";
+            case "confirm":
+                return "Confirm";
+            case "success":
+                return "Sent!";
+            default:
+                return "Send";
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[600px] w-full flex-col bg-white", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { handleBack: handleBack, title: getStepTitle() }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 overflow-y-auto", children: [step === "recipient" && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-6 p-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex h-12 w-full items-stretch overflow-hidden rounded-lg border border-[#d1d1d6] bg-white", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex w-12 items-center justify-center bg-transparent px-3 py-2", children: (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-medium text-base text-[#3f3f46]", children: "To" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 items-center border-l border-[#d1d1d6] px-3 py-2", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: recipientAddress, onChange: e => handleRecipientAddressChange(e.target.value), placeholder: "ENS or Address", className: "font-neue-montreal-medium flex-1 text-base text-[#70707b] outline-none placeholder:text-[#70707b]" }), (0, jsx_runtime_1.jsx)("button", { onClick: handlePaste, className: "font-inter ml-2 rounded-md border border-[#e4e4e7] bg-[#fafafa] px-2.5 py-0.5 text-sm font-medium text-[#3f3f46] transition-colors hover:bg-[#f4f4f5]", children: "Paste" })] })] }), addressError && (0, jsx_runtime_1.jsx)("p", { className: "font-neue-montreal-medium -mt-4 text-xs text-red-500", children: addressError }), showValidatedResult && recipientAddress && (0, viem_1.isAddress)(recipientAddress) && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1", children: (0, jsx_runtime_1.jsx)("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#0b57c2]", children: "Result" }) }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleSelectValidatedAddress, className: "flex items-center gap-2 rounded-xl bg-[#f4f4f5] px-3 py-2 transition-colors hover:bg-[#e4e4e7]", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "h-5 w-5 text-[#a0a0ab]" }) }), (0, jsx_runtime_1.jsxs)("span", { className: "font-neue-montreal-medium text-base tracking-[-0.32px] text-[#70707b]", children: [recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4)] })] })] })), recentAddresses.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Clock, { className: "h-3.5 w-3.5 text-[#3f3f46]" }), (0, jsx_runtime_1.jsx)("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#3f3f46]", children: "Recents" })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col", children: recentAddresses.map((recent, index) => ((0, jsx_runtime_1.jsxs)("button", { onClick: () => {
+                                                // Just fill the input and show validation - don't auto-proceed
+                                                handleRecipientAddressChange(recent.address);
+                                            }, className: "flex items-center gap-2 rounded-xl px-3 py-2 transition-colors hover:bg-[#fafafa]", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "h-5 w-5 text-[#a0a0ab]" }) }), (0, jsx_runtime_1.jsxs)("span", { className: "font-neue-montreal-medium text-base tracking-[-0.32px] text-[#70707b]", children: [recent.address.slice(0, 6), "...", recent.address.slice(-4)] })] }, index))) })] }))] })), step === "token" && ((0, jsx_runtime_1.jsx)("div", { className: "flex flex-col p-5", children: isLoadingBalance ? ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: (0, jsx_runtime_1.jsx)("div", { className: "space-y-1", children: [...Array(3)].map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between rounded-xl p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line h-10 w-10 animate-pulse rounded-full" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line mb-1 h-4 w-16 animate-pulse rounded" }), (0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line h-3 w-24 animate-pulse rounded" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line mb-1 h-4 w-20 animate-pulse rounded" }), (0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line h-3 w-16 animate-pulse rounded" })] })] }, index))) }) })) : simBalance?.balances && simBalance.balances.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: (0, jsx_runtime_1.jsx)("div", { className: "space-y-1", children: simBalance.balances.map(token => ((0, jsx_runtime_1.jsxs)("div", { className: "hover:bg-b3-line/60 dark:hover:bg-b3-primary-wash/40 group flex cursor-pointer items-center justify-between rounded-xl p-3 transition-all duration-200", onClick: () => {
+                                        setSelectedToken(token);
+                                        setStep("amount");
+                                    }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: anyspend_1.ALL_CHAINS[token.chain_id]?.logoUrl ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[token.chain_id].logoUrl, tokenUrl: token.token_metadata?.logo, className: "size-10" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-react-foreground size-10" })) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: token.symbol }) }), (0, jsx_runtime_1.jsx)("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: token.name })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: (0, number_1.formatTokenAmount)(BigInt(token.amount), token.decimals) }), (0, jsx_runtime_1.jsx)("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: (0, number_1.formatDisplayNumber)(token.value_usd, { style: "currency", fractionDigits: 2 }) })] })] }, token.chain_id + "_" + token.address))) }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center justify-center py-12 text-center", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-foreground-muted mb-4 h-8 w-8" }), (0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "No tokens available" })] })) })), step === "amount" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-6 p-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between rounded-xl border border-[#d1d1d6] bg-[#fafafa] p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center", children: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.logoUrl ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[selectedToken.chain_id].logoUrl, tokenUrl: selectedToken.token_metadata?.logo, className: "size-10" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-react-foreground size-10" })) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "font-neue-montreal-semibold text-base text-[#18181b]", children: selectedToken.symbol }), (0, jsx_runtime_1.jsx)("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: (0, number_1.formatTokenAmount)(BigInt(selectedToken.amount), selectedToken.decimals) })] })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setStep("token"), className: "text-b3-primary-blue font-neue-montreal-semibold hover:text-b3-primary-blue/80 text-sm transition-colors", children: "Change" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsx)(react_number_format_1.NumericFormat, { decimalSeparator: ".", allowedDecimalSeparators: [","], thousandSeparator: true, inputMode: "decimal", autoComplete: "off", autoCorrect: "off", type: "text", placeholder: "0.00", minLength: 1, maxLength: 30, spellCheck: "false", className: "font-neue-montreal-medium placeholder:text-b3-foreground-muted w-full rounded-lg border border-[#d1d1d6] bg-white px-3 py-2 text-base text-[#18181b] outline-none focus:border-[#0c68e9]", pattern: "^[0-9]*[.,]?[0-9]*$", disabled: isSending, value: sendAmount, allowNegative: false, onValueChange: values => setSendAmount(values.value) }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-4 gap-2", children: [25, 50, 75, 100].map(percentage => ((0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", onClick: () => handlePercentageClick(percentage), className: "font-neue-montreal-medium border-[#d1d1d6] text-sm text-[#18181b] hover:bg-[#fafafa]", disabled: isSending, children: [percentage, "%"] }, percentage))) }), (0, jsx_runtime_1.jsxs)("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: ["Available: ", (0, number_1.formatTokenAmount)(BigInt(selectedToken.amount), selectedToken.decimals), " ", selectedToken.symbol] })] }), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setStep("confirm"), disabled: !sendAmount || parseFloat(sendAmount) <= 0, className: "bg-b3-primary-blue hover:bg-b3-primary-blue/90 font-neue-montreal-semibold disabled:bg-b3-line disabled:text-b3-foreground-muted h-12 w-full rounded-xl text-white", children: "Continue" })] })), step === "confirm" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex min-h-full flex-col", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center gap-4 px-5 pb-0 pt-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-[#d5e5fd]", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Send, { className: "h-7 w-7 text-[#0c68e9]" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#18181b]", children: sendAmount }), (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#70707b]", children: selectedToken.symbol })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-5" }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-3 px-5", children: (0, jsx_runtime_1.jsx)("div", { className: "rounded-xl border border-[#e4e4e7] bg-[#fafafa] p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "To" }), (0, jsx_runtime_1.jsxs)("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b]", children: ["Wallet (", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4), ")"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "Network" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.name || "Unknown" }), anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.logoUrl && ((0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[selectedToken.chain_id].logoUrl, alt: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.name, className: "h-4 w-4 rounded-full" }))] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "Network fee" }), (0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b]", children: "$0.1" })] })] }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-4 border-t border-[#e4e4e7] bg-[#fafafa] p-4", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { onClick: handleBack, disabled: isSending, variant: "outline", className: "font-inter h-12 flex-1 rounded-xl border border-[#e4e4e7] bg-white text-base font-semibold text-[#3f3f46] shadow-[inset_0px_0px_0px_1px_rgba(10,13,18,0.18),inset_0px_-2px_0px_0px_rgba(10,13,18,0.05)] hover:bg-[#fafafa]", children: "Cancel" }), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: handleSend, disabled: isSending, className: "font-inter border-white/12 h-12 flex-1 rounded-xl border-2 bg-[#0c68e9] text-base font-semibold text-white shadow-[inset_0px_0px_0px_1px_rgba(10,13,18,0.18),inset_0px_-2px_0px_0px_rgba(10,13,18,0.05)] hover:bg-[#0b5fd4]", children: isSending ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Sending..."] })) : ("Send") })] })] })), step === "success" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-5 text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-green-100", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Send, { className: "h-7 w-7 text-green-600" }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "font-neue-montreal-semibold mb-2 text-xl text-[#18181b]", children: "Sent!" }), (0, jsx_runtime_1.jsxs)("p", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: [sendAmount, " ", selectedToken.symbol, " was sent to ", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4)] })] }), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setB3ModalOpen(false), className: "bg-b3-primary-blue hover:bg-b3-primary-blue/90 font-neue-montreal-semibold h-12 w-full rounded-xl text-white", children: "Done" })] }))] })] }));
+}

package/dist/cjs/global-account/react/components/icons/BellIcon.d.ts

@@ -0,0 +1,3 @@
+import { SVGProps } from "react";
+declare const BellIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default BellIcon;

package/dist/cjs/global-account/react/components/icons/BellIcon.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const BellIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M7.5 17.5H12.5M4.16667 7.5C4.16667 4.27834 6.77834 1.66667 10 1.66667C13.2217 1.66667 15.8333 4.27834 15.8333 7.5V8.33333C15.8333 9.61667 16.2167 10.8583 16.9167 11.9167L17.5 12.75C17.9417 13.3917 17.4833 14.1667 16.7333 14.1667H3.26667C2.51667 14.1667 2.05834 13.3917 2.5 12.75L3.08334 11.9167C3.78334 10.8583 4.16667 9.61667 4.16667 8.33333V7.5Z", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+exports.default = BellIcon;

package/dist/cjs/global-account/react/components/icons/ChevronDownIcon.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from "react";
+export declare function ChevronDownIcon({ className, ...props }: SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/global-account/react/components/icons/ChevronDownIcon.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChevronDownIcon = ChevronDownIcon;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function ChevronDownIcon({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M6 9L12 15L18 9", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+}

package/dist/cjs/global-account/react/components/icons/CopyIcon.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from "react";
+export declare function CopyIcon({ className, ...props }: SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/global-account/react/components/icons/CopyIcon.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CopyIcon = CopyIcon;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function CopyIcon({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M3.33333 3.33333V2C3.33333 1.63181 3.63181 1.33333 4 1.33333H10C10.3682 1.33333 10.6667 1.63181 10.6667 2V8C10.6667 8.36819 10.3682 8.66667 10 8.66667H8.66667M2 3.33333H8C8.36819 3.33333 8.66667 3.63181 8.66667 4V10C8.66667 10.3682 8.36819 10.6667 8 10.6667H2C1.63181 10.6667 1.33333 10.3682 1.33333 10V4C1.33333 3.63181 1.63181 3.33333 2 3.33333Z", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+}

package/dist/cjs/global-account/react/components/icons/LinkIcon.d.ts

@@ -0,0 +1,3 @@
+import { SVGProps } from "react";
+declare const LinkIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default LinkIcon;

package/dist/cjs/global-account/react/components/icons/LinkIcon.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const LinkIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M10.8333 9.16667L15.8333 4.16667M17.5 2.5L15.8333 4.16667L17.5 2.5ZM11.6667 4.16667H15.8333V8.33333L11.6667 4.16667ZM9.16667 10.8333L4.16667 15.8333L9.16667 10.8333ZM8.33333 15.8333H4.16667V11.6667L8.33333 15.8333ZM15.8333 10V15.8333H10L15.8333 10ZM4.16667 4.16667V10L10 4.16667H4.16667Z", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+exports.default = LinkIcon;

package/dist/cjs/global-account/react/components/icons/LockIcon.d.ts

@@ -0,0 +1,3 @@
+import { SVGProps } from "react";
+declare const LockIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default LockIcon;

package/dist/cjs/global-account/react/components/icons/LockIcon.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const LockIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M14.1667 9.16667V6.66667C14.1667 4.36548 12.3012 2.5 10 2.5C7.69881 2.5 5.83333 4.36548 5.83333 6.66667V9.16667M7.5 14.1667C7.5 15.0871 8.24619 15.8333 9.16667 15.8333H10.8333C11.7538 15.8333 12.5 15.0871 12.5 14.1667C12.5 13.2462 11.7538 12.5 10.8333 12.5H9.16667C8.24619 12.5 7.5 11.7538 7.5 10.8333C7.5 9.91286 8.24619 9.16667 9.16667 9.16667H10.8333C11.7538 9.16667 12.5 9.91286 12.5 10.8333", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+exports.default = LockIcon;

package/dist/cjs/global-account/react/components/icons/WalletIcon.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from "react";
+export declare function WalletIcon({ className, ...props }: SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/global-account/react/components/icons/WalletIcon.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WalletIcon = WalletIcon;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function WalletIcon({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsxs)("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, ...props, children: [(0, jsx_runtime_1.jsx)("rect", { width: "40", height: "40", rx: "20", fill: "#F4F4F5" }), (0, jsx_runtime_1.jsx)("path", { d: "M28 16H27V14C27 13.4696 26.7893 12.9609 26.4142 12.5858C26.0391 12.2107 25.5304 12 25 12H15C14.4696 12 13.9609 12.2107 13.5858 12.5858C13.2107 12.9609 13 13.4696 13 14V26C13 26.5304 13.2107 27.0391 13.5858 27.4142C13.9609 27.7893 14.4696 28 15 28H27C27.5304 28 28.0391 27.7893 28.4142 27.4142C28.7893 27.0391 29 26.5304 29 26V18C29 17.4696 28.7893 16.9609 28.4142 16.5858C28.0391 16.2107 27.5304 16 27 16ZM15 14H25V16H15V14ZM27 22H25C24.7348 22 24.4804 21.8946 24.2929 21.7071C24.1054 21.5196 24 21.2652 24 21C24 20.7348 24.1054 20.4804 24.2929 20.2929C24.4804 20.1054 24.7348 20 25 20H27V22Z", fill: "#71717A" })] }));
+}

package/dist/cjs/global-account/react/components/index.d.ts

@@ -13,6 +13,8 @@ export { SignInWithB3Privy } from "./SignInWithB3/SignInWithB3Privy";
 export { LoginStepContainer } from "./SignInWithB3/steps/LoginStep";
 export { getConnectOptionsFromStrategy, isWalletType, type AllowedStrategy } from "./SignInWithB3/utils/signInUtils";
 export { ManageAccount } from "./ManageAccount/ManageAccount";
+export { Deposit } from "./Deposit/Deposit";
+export { Send } from "./Send/Send";
 export { AvatarEditor } from "./AvatarEditor/AvatarEditor";
 export { ProfileEditor } from "./ProfileEditor/ProfileEditor";
 export { RequestPermissions } from "./RequestPermissions/RequestPermissions";
@@ -40,8 +42,8 @@ export { Popover, PopoverContent, PopoverTrigger } from "./ui/popover";
 export { ScrollArea, ScrollBar } from "./ui/scroll-area";
 export { ShinyButton } from "./ui/ShinyButton";
 export { Skeleton } from "./ui/skeleton";
-export { TabTrigger as TabTriggerPrimitive, TabsContent as TabsContentPrimitive, TabsList as TabsListPrimitive, Tabs as TabsPrimitive, } from "./ui/Tabs";
-export { TabTrigger, Tabs, TabsContent, TabsList, TabsTransitionWrapper } from "./ui/TabSystem";
+export { TabsContent as TabsContentPrimitive, TabsList as TabsListPrimitive, Tabs as TabsPrimitive, TabTrigger as TabTriggerPrimitive, } from "./ui/Tabs";
+export { Tabs, TabsContent, TabsList, TabsTransitionWrapper, TabTrigger } from "./ui/TabSystem";
 export { TextLoop } from "./ui/text-loop";
 export { TextShimmer } from "./ui/text-shimmer";
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./ui/tooltip";

package/dist/cjs/global-account/react/components/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DialogHeader = exports.DialogFooter = exports.DialogDescription = exports.DialogContent = exports.DialogClose = exports.Dialog = exports.CommandShortcut = exports.CommandSeparator = exports.CommandList = exports.CommandItem = exports.CommandInput = exports.CommandGroup = exports.CommandEmpty = exports.CommandDialog = exports.Command = exports.buttonVariants = exports.Button = exports.badgeVariants = exports.Badge = exports.WalletConnectorIcon = exports.StaggeredFadeLoader = exports.CopyToClipboard = exports.ClientOnly = exports.customButtonVariants = exports.CustomButton = exports.SendERC20Button = exports.SendETHButton = exports.MintButton = exports.AccountAssets = exports.RequestPermissionsButton = exports.RequestPermissions = exports.ProfileEditor = exports.AvatarEditor = exports.ManageAccount = exports.isWalletType = exports.getConnectOptionsFromStrategy = exports.LoginStepContainer = exports.SignInWithB3Privy = exports.SignInWithB3Flow = exports.SignInWithB3 = exports.WalletRow = exports.PermissionItem = exports.AuthButton = exports.StyleRoot = exports.useB3 = exports.B3Context = exports.RelayKitProviderWrapper = exports.InnerProvider = exports.B3Provider = exports.B3DynamicModal = void 0;
-exports.AnimatedLottie = exports.TransitionPanel = exports.TooltipTrigger = exports.TooltipProvider = exports.TooltipContent = exports.Tooltip = exports.TextShimmer = exports.TextLoop = exports.TabsTransitionWrapper = exports.TabsList = exports.TabsContent = exports.Tabs = exports.TabTrigger = exports.TabsPrimitive = exports.TabsListPrimitive = exports.TabsContentPrimitive = exports.TabTriggerPrimitive = exports.Skeleton = exports.ShinyButton = exports.ScrollBar = exports.ScrollArea = exports.PopoverTrigger = exports.PopoverContent = exports.Popover = exports.Loading = exports.Input = exports.GlareCardRounded = exports.GlareCard = exports.DropdownMenuTrigger = exports.DropdownMenuSeparator = exports.DropdownMenuItem = exports.DropdownMenuContent = exports.DropdownMenu = exports.DrawerTrigger = exports.DrawerTitle = exports.DrawerPortal = exports.DrawerOverlay = exports.DrawerHeader = exports.DrawerFooter = exports.DrawerDescription = exports.DrawerContent = exports.DrawerClose = exports.Drawer = exports.DialogTrigger = exports.DialogTitle = exports.DialogPortal = exports.DialogOverlay = void 0;
+exports.DialogDescription = exports.DialogContent = exports.DialogClose = exports.Dialog = exports.CommandShortcut = exports.CommandSeparator = exports.CommandList = exports.CommandItem = exports.CommandInput = exports.CommandGroup = exports.CommandEmpty = exports.CommandDialog = exports.Command = exports.buttonVariants = exports.Button = exports.badgeVariants = exports.Badge = exports.WalletConnectorIcon = exports.StaggeredFadeLoader = exports.CopyToClipboard = exports.ClientOnly = exports.customButtonVariants = exports.CustomButton = exports.SendERC20Button = exports.SendETHButton = exports.MintButton = exports.AccountAssets = exports.RequestPermissionsButton = exports.RequestPermissions = exports.ProfileEditor = exports.AvatarEditor = exports.Send = exports.Deposit = exports.ManageAccount = exports.isWalletType = exports.getConnectOptionsFromStrategy = exports.LoginStepContainer = exports.SignInWithB3Privy = exports.SignInWithB3Flow = exports.SignInWithB3 = exports.WalletRow = exports.PermissionItem = exports.AuthButton = exports.StyleRoot = exports.useB3 = exports.B3Context = exports.RelayKitProviderWrapper = exports.InnerProvider = exports.B3Provider = exports.B3DynamicModal = void 0;
+exports.AnimatedLottie = exports.TransitionPanel = exports.TooltipTrigger = exports.TooltipProvider = exports.TooltipContent = exports.Tooltip = exports.TextShimmer = exports.TextLoop = exports.TabTrigger = exports.TabsTransitionWrapper = exports.TabsList = exports.TabsContent = exports.Tabs = exports.TabTriggerPrimitive = exports.TabsPrimitive = exports.TabsListPrimitive = exports.TabsContentPrimitive = exports.Skeleton = exports.ShinyButton = exports.ScrollBar = exports.ScrollArea = exports.PopoverTrigger = exports.PopoverContent = exports.Popover = exports.Loading = exports.Input = exports.GlareCardRounded = exports.GlareCard = exports.DropdownMenuTrigger = exports.DropdownMenuSeparator = exports.DropdownMenuItem = exports.DropdownMenuContent = exports.DropdownMenu = exports.DrawerTrigger = exports.DrawerTitle = exports.DrawerPortal = exports.DrawerOverlay = exports.DrawerHeader = exports.DrawerFooter = exports.DrawerDescription = exports.DrawerContent = exports.DrawerClose = exports.Drawer = exports.DialogTrigger = exports.DialogTitle = exports.DialogPortal = exports.DialogOverlay = exports.DialogHeader = exports.DialogFooter = void 0;
 // Core Components
 var B3DynamicModal_1 = require("./B3DynamicModal");
 Object.defineProperty(exports, "B3DynamicModal", { enumerable: true, get: function () { return B3DynamicModal_1.B3DynamicModal; } });
@@ -37,6 +37,13 @@ Object.defineProperty(exports, "isWalletType", { enumerable: true, get: function
 // ManageAccount Components
 var ManageAccount_1 = require("./ManageAccount/ManageAccount");
 Object.defineProperty(exports, "ManageAccount", { enumerable: true, get: function () { return ManageAccount_1.ManageAccount; } });
+// Deposit Components
+var Deposit_1 = require("./Deposit/Deposit");
+Object.defineProperty(exports, "Deposit", { enumerable: true, get: function () { return Deposit_1.Deposit; } });
+// Send Components
+var Send_1 = require("./Send/Send");
+Object.defineProperty(exports, "Send", { enumerable: true, get: function () { return Send_1.Send; } });
+// B3 Global Branding Wrapper
 // Profile Components
 var AvatarEditor_1 = require("./AvatarEditor/AvatarEditor");
 Object.defineProperty(exports, "AvatarEditor", { enumerable: true, get: function () { return AvatarEditor_1.AvatarEditor; } });
@@ -136,16 +143,16 @@ Object.defineProperty(exports, "ShinyButton", { enumerable: true, get: function
 var skeleton_1 = require("./ui/skeleton");
 Object.defineProperty(exports, "Skeleton", { enumerable: true, get: function () { return skeleton_1.Skeleton; } });
 var Tabs_1 = require("./ui/Tabs");
-Object.defineProperty(exports, "TabTriggerPrimitive", { enumerable: true, get: function () { return Tabs_1.TabTrigger; } });
 Object.defineProperty(exports, "TabsContentPrimitive", { enumerable: true, get: function () { return Tabs_1.TabsContent; } });
 Object.defineProperty(exports, "TabsListPrimitive", { enumerable: true, get: function () { return Tabs_1.TabsList; } });
 Object.defineProperty(exports, "TabsPrimitive", { enumerable: true, get: function () { return Tabs_1.Tabs; } });
+Object.defineProperty(exports, "TabTriggerPrimitive", { enumerable: true, get: function () { return Tabs_1.TabTrigger; } });
 var TabSystem_1 = require("./ui/TabSystem");
-Object.defineProperty(exports, "TabTrigger", { enumerable: true, get: function () { return TabSystem_1.TabTrigger; } });
 Object.defineProperty(exports, "Tabs", { enumerable: true, get: function () { return TabSystem_1.Tabs; } });
 Object.defineProperty(exports, "TabsContent", { enumerable: true, get: function () { return TabSystem_1.TabsContent; } });
 Object.defineProperty(exports, "TabsList", { enumerable: true, get: function () { return TabSystem_1.TabsList; } });
 Object.defineProperty(exports, "TabsTransitionWrapper", { enumerable: true, get: function () { return TabSystem_1.TabsTransitionWrapper; } });
+Object.defineProperty(exports, "TabTrigger", { enumerable: true, get: function () { return TabSystem_1.TabTrigger; } });
 var text_loop_1 = require("./ui/text-loop");
 Object.defineProperty(exports, "TextLoop", { enumerable: true, get: function () { return text_loop_1.TextLoop; } });
 var text_shimmer_1 = require("./ui/text-shimmer");

package/dist/cjs/global-account/react/components/ui/Tabs.js

@@ -43,10 +43,10 @@ const TabsPrimitive = __importStar(require("@radix-ui/react-tabs"));
 const Tabs = ({ defaultValue, onValueChange, children, }) => ((0, jsx_runtime_1.jsx)(TabsPrimitive.Root, { defaultValue: defaultValue, onValueChange: onValueChange, children: children }));
 exports.Tabs = Tabs;
 function TabsList({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.List, { className: (0, utils_1.cn)("border-b3-react-border bg-b3-react-background inline-flex h-12 w-full items-center justify-center rounded-lg border", className), ...props }));
+    return (0, jsx_runtime_1.jsx)(TabsPrimitive.List, { className: (0, utils_1.cn)("", className), ...props });
 }
 function TabTrigger({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Trigger, { className: (0, utils_1.cn)("inline-flex h-full items-center justify-center whitespace-nowrap px-3 text-sm font-medium transition-all", "focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50", "data-[state=active]:bg-b3-react-subtle data-[state=active]:text-b3-react-primary data-[state=active]:font-bold", "border-b3-react-border hover:text-b3-react-foreground data-[state=inactive]:border-b3-react-border data-[state=inactive]:text-b3-react-muted-foreground", "flex-1 border-r", className), ...props }));
+    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Trigger, { className: (0, utils_1.cn)("text-md inline-flex h-full items-center justify-center whitespace-nowrap px-3 font-semibold transition-all", "focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50", "data-[state=active]:text-b3-react-primary data-[state=active]:font-bold", "hover:text-b3-react-foreground data-[state=inactive]:text-b3-react-muted-foreground", "flex-1", className), ...props }));
 }
 function TabsContent({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Content, { className: (0, utils_1.cn)("ring-offset-b3-react-background focus-visible:ring-b3-react-ring mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2", className), ...props }));

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

@@ -51,9 +51,9 @@ exports.DialogClose = DialogClose;
 const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(DialogPrimitive.Overlay, { ref: ref, className: (0, utils_1.cn)("fixed inset-0 z-50 bg-black/80 backdrop-blur-[20px]", "data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:backdrop-blur-none data-[state=open]:backdrop-blur-[20px]", "transition-all duration-300", className), ...props })));
 exports.DialogOverlay = DialogOverlay;
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-const DialogContent = React.forwardRef(({ className, children, hideCloseButton = false, closeBtnClassName, ...props }, ref) => {
+const DialogContent = React.forwardRef(({ className, children, hideCloseButton = true, closeBtnClassName, ...props }, ref) => {
     const container = typeof window !== "undefined" ? document.getElementById("b3-root") : null;
-    return ((0, jsx_runtime_1.jsxs)(DialogPortal, { container: container, children: [(0, jsx_runtime_1.jsx)(DialogOverlay, {}), (0, jsx_runtime_1.jsxs)(DialogPrimitive.Content, { ref: ref, className: (0, utils_1.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 && ((0, jsx_runtime_1.jsxs)(DialogPrimitive.Close, { className: (0, utils_1.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: [(0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-5 w-5" }), (0, jsx_runtime_1.jsx)("span", { className: "sr-only", children: "Close" })] }))] })] }));
+    return ((0, jsx_runtime_1.jsxs)(DialogPortal, { container: container, children: [(0, jsx_runtime_1.jsx)(DialogOverlay, {}), (0, jsx_runtime_1.jsxs)(DialogPrimitive.Content, { ref: ref, className: (0, utils_1.cn)("fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border 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: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 flex-col overflow-hidden rounded-xl border border-[#D1D1D6] bg-white shadow-[0_20px_24px_-4px_rgba(10,13,18,0.08),0_8px_8px_-4px_rgba(10,13,18,0.03),0_3px_3px_-1.5px_rgba(10,13,18,0.04)]", children: [children, !hideCloseButton && ((0, jsx_runtime_1.jsxs)(DialogPrimitive.Close, { className: (0, utils_1.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: [(0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-5 w-5" }), (0, jsx_runtime_1.jsx)("span", { className: "sr-only", children: "Close" })] }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center gap-1.5 pt-[10px]", children: [(0, jsx_runtime_1.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [(0, jsx_runtime_1.jsx)("path", { d: "M2 4.66667C2 3.19391 3.19391 2 4.66667 2H11.3333C12.8061 2 14 3.19391 14 4.66667V11.3333C14 12.8061 12.8061 14 11.3333 14H4.66667C3.19391 14 2 12.8061 2 11.3333V4.66667Z", fill: "#0B57C2" }), (0, jsx_runtime_1.jsx)("path", { d: "M5.33333 6C5.33333 5.63181 5.63181 5.33333 6 5.33333H10C10.3682 5.33333 10.6667 5.63181 10.6667 6V10C10.6667 10.3682 10.3682 10.6667 10 10.6667H6C5.63181 10.6667 5.33333 10.3682 5.33333 10V6Z", fill: "white" })] }), (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-xs uppercase leading-none tracking-[0.72px] text-[#0B57C2]", children: "Global Account" })] })] })] }));
 });
 exports.DialogContent = DialogContent;
 DialogContent.displayName = DialogPrimitive.Content.displayName;

package/dist/cjs/global-account/react/hooks/index.d.ts

@@ -23,7 +23,7 @@ export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
 export { useMediaQuery } from "./useMediaQuery";
 export { useNativeBalance, useNativeBalanceFromRPC } from "./useNativeBalance";
 export { useOneBalance } from "./useOneBalance";
-export { useProfile, useProfilePreference, type CombinedProfile, type PreferenceRequestBody, type Profile, } from "./useProfile";
+export { useProfile, useProfilePreference, useProfileSettings, useDisplayName, type CombinedProfile, type PreferenceRequestBody, type Profile, type DisplayNameRequestBody, } from "./useProfile";
 export { useQueryB3 } from "./useQueryB3";
 export { useQueryBSMNT } from "./useQueryBSMNT";
 export { useRemoveSessionKey } from "./useRemoveSessionKey";

package/dist/cjs/global-account/react/hooks/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useUnifiedChainSwitchAndExecute = exports.useURLParams = exports.useTokensFromAddress = exports.useTokenPriceWithFallback = exports.useTokenPrice = exports.useTokenFromUrl = exports.useTokenData = exports.useTokenBalancesByChain = exports.useTokenBalanceDirect = exports.useTokenBalance = exports.useSiwe = exports.useSimBalance = exports.useSearchParamsSSR = exports.useRouter = exports.useRemoveSessionKey = exports.useQueryBSMNT = exports.useQueryB3 = exports.useProfilePreference = exports.useProfile = exports.useOneBalance = exports.useNativeBalanceFromRPC = exports.useNativeBalance = exports.useMediaQuery = exports.useIsomorphicLayoutEffect = exports.useIsMobile = exports.useHasMounted = exports.useHandleConnectWithPrivy = exports.useGlobalAccount = exports.useGetGeo = exports.useGetAllTWSigners = exports.useFirstEOA = exports.useExchangeRate = exports.useConnect = exports.useClient = exports.useChainSwitchWithAction = exports.useBestTransactionPath = exports.useB3EnsName = exports.useB3BalanceFromAddresses = exports.useAuthentication = exports.useAnalytics = exports.useAddTWSessionKey = exports.useAccountWallet = exports.useAccountAssets = exports.createWagmiConfig = void 0;
+exports.useUnifiedChainSwitchAndExecute = exports.useURLParams = exports.useTokensFromAddress = exports.useTokenPriceWithFallback = exports.useTokenPrice = exports.useTokenFromUrl = exports.useTokenData = exports.useTokenBalancesByChain = exports.useTokenBalanceDirect = exports.useTokenBalance = exports.useSiwe = exports.useSimBalance = exports.useSearchParamsSSR = exports.useRouter = exports.useRemoveSessionKey = exports.useQueryBSMNT = exports.useQueryB3 = exports.useDisplayName = exports.useProfileSettings = exports.useProfilePreference = exports.useProfile = exports.useOneBalance = exports.useNativeBalanceFromRPC = exports.useNativeBalance = exports.useMediaQuery = exports.useIsomorphicLayoutEffect = exports.useIsMobile = exports.useHasMounted = exports.useHandleConnectWithPrivy = exports.useGlobalAccount = exports.useGetGeo = exports.useGetAllTWSigners = exports.useFirstEOA = exports.useExchangeRate = exports.useConnect = exports.useClient = exports.useChainSwitchWithAction = exports.useBestTransactionPath = exports.useB3EnsName = exports.useB3BalanceFromAddresses = exports.useAuthentication = exports.useAnalytics = exports.useAddTWSessionKey = exports.useAccountWallet = exports.useAccountAssets = exports.createWagmiConfig = void 0;
 var createWagmiConfig_1 = require("../utils/createWagmiConfig");
 Object.defineProperty(exports, "createWagmiConfig", { enumerable: true, get: function () { return createWagmiConfig_1.createWagmiConfig; } });
 var useAccountAssets_1 = require("./useAccountAssets");
@@ -68,6 +68,8 @@ Object.defineProperty(exports, "useOneBalance", { enumerable: true, get: functio
 var useProfile_1 = require("./useProfile");
 Object.defineProperty(exports, "useProfile", { enumerable: true, get: function () { return useProfile_1.useProfile; } });
 Object.defineProperty(exports, "useProfilePreference", { enumerable: true, get: function () { return useProfile_1.useProfilePreference; } });
+Object.defineProperty(exports, "useProfileSettings", { enumerable: true, get: function () { return useProfile_1.useProfileSettings; } });
+Object.defineProperty(exports, "useDisplayName", { enumerable: true, get: function () { return useProfile_1.useDisplayName; } });
 var useQueryB3_1 = require("./useQueryB3");
 Object.defineProperty(exports, "useQueryB3", { enumerable: true, get: function () { return useQueryB3_1.useQueryB3; } });
 var useQueryBSMNT_1 = require("./useQueryBSMNT");

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

@@ -44,17 +44,6 @@ function useAuthentication(partnerId) {
     const activeWagmiAccount = (0, wagmi_1.useAccount)();
     const { switchAccount } = (0, wagmi_1.useSwitchAccount)();
     debug("@@activeWagmiAccount", activeWagmiAccount);
-    // Check localStorage version and clear if not found or mismatched
-    (0, react_2.useEffect)(() => {
-        if (typeof localStorage !== "undefined") {
-            const version = localStorage.getItem("version");
-            if (version !== "1") {
-                debug("@@localStorage:clearing due to version mismatch", { version });
-                localStorage.clear();
-                localStorage.setItem("version", "1");
-            }
-        }
-    }, []);
     const wallet = (0, wallets_1.ecosystemWallet)(constants_1.ecosystemWalletId, {
         partnerId: partnerId,
     });

package/dist/cjs/global-account/react/hooks/useB3BalanceFromAddresses.js

@@ -77,6 +77,7 @@ function useB3BalanceFromAddresses(addresses, options) {
         enabled: (options?.enabled ?? true) && normalizedAddresses.length > 0,
         refetchInterval: options?.refetchInterval ?? 30000, // Default 30s refresh
         staleTime: 10000, // Consider data stale after 10s
+        structuralSharing: false, // Disable structural sharing because data contains BigInt values
     });
 }
 exports.default = useB3BalanceFromAddresses;

package/dist/cjs/global-account/react/hooks/useGlobalAccount.d.ts

@@ -3,4 +3,5 @@ export declare function useGlobalAccount(): {
     account: Wallet | undefined;
     address: string | undefined;
     info: import("@tanstack/react-query").UseQueryResult<import("thirdweb/wallets").WalletInfo, Error>;
+    wallet: Wallet | undefined;
 };

package/dist/cjs/global-account/react/hooks/useGlobalAccount.js

@@ -10,6 +10,7 @@ function useGlobalAccount() {
     const wallets = (0, react_3.useConnectedWallets)();
     const isConnected = (0, react_1.useAuthStore)(state => state.isConnected);
     const [globalAccount, setGlobalAccount] = (0, react_2.useState)(undefined);
+    const [globalAccountWallet, setGlobalAccountWallet] = (0, react_2.useState)(undefined);
     const [address, setAddress] = (0, react_2.useState)(undefined);
     const walletInfo = (0, react_3.useWalletInfo)(globalAccount?.id);
     (0, react_2.useEffect)(() => {
@@ -20,6 +21,7 @@ function useGlobalAccount() {
             return;
         }
         const globalAccountWallet = wallets.find(wallet => wallet.id.startsWith("ecosystem."));
+        setGlobalAccountWallet(globalAccountWallet);
         const account = globalAccountWallet?.getAccount();
         setGlobalAccount(globalAccountWallet);
         setAddress(account?.address);
@@ -28,5 +30,6 @@ function useGlobalAccount() {
         account: globalAccount,
         address,
         info: walletInfo,
+        wallet: globalAccountWallet,
     };
 }

package/dist/cjs/global-account/react/stores/index.d.ts

@@ -1,3 +1,4 @@
 export { useAuthStore } from "./useAuthStore";
 export { useModalStore } from "./useModalStore";
+export { useRecentAddressesStore } from "./useRecentAddressesStore";
 export type { AnySpendBuySpinProps, AnySpendFundTournamentProps, AnySpendJoinTournamentProps, AnySpendModalProps, AnySpendNftProps, AnySpendOrderHistoryProps, AnySpendStakeB3Props, AnyspendOrderDetailsProps, ManageAccountModalProps, ModalContentType, RequestPermissionsModalProps, SignInWithB3ModalProps, } from "./useModalStore";

package/dist/cjs/global-account/react/stores/index.js

@@ -1,7 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useModalStore = exports.useAuthStore = void 0;
+exports.useRecentAddressesStore = exports.useModalStore = exports.useAuthStore = void 0;
 var useAuthStore_1 = require("./useAuthStore");
 Object.defineProperty(exports, "useAuthStore", { enumerable: true, get: function () { return useAuthStore_1.useAuthStore; } });
 var useModalStore_1 = require("./useModalStore");
 Object.defineProperty(exports, "useModalStore", { enumerable: true, get: function () { return useModalStore_1.useModalStore; } });
+var useRecentAddressesStore_1 = require("./useRecentAddressesStore");
+Object.defineProperty(exports, "useRecentAddressesStore", { enumerable: true, get: function () { return useRecentAddressesStore_1.useRecentAddressesStore; } });

package/dist/cjs/global-account/react/stores/useModalStore.d.ts

@@ -77,9 +77,9 @@ export interface ManageAccountModalProps extends BaseModalProps {
     /** Partner ID */
     partnerId: string;
     /** Active Tab */
-    activeTab?: "overview" | "tokens" | "nfts" | "apps" | "settings";
+    activeTab?: "home" | "tokens" | "nfts" | "apps" | "settings" | "swap";
     /** Function to set the active tab */
-    setActiveTab?: (tab: "overview" | "tokens" | "nfts" | "apps" | "settings") => void;
+    setActiveTab?: (tab: "home" | "tokens" | "nfts" | "apps" | "settings" | "swap") => void;
     /** Whether to show the referral information */
     showReferralInfo?: boolean;
     /** Whether to show the swap button */
@@ -325,6 +325,15 @@ export interface LinkAccountModalProps extends BaseModalProps {
     partnerId: string;
     chain: Chain;
 }
+export interface LinkNewAccountModalProps extends BaseModalProps {
+    type: "linkNewAccount";
+    showBackButton?: boolean;
+    onSuccess?: () => void;
+    onError?: (error: Error) => void;
+    onClose?: () => void;
+    partnerId: string;
+    chain: Chain;
+}
 export interface AnySpendDepositHypeProps extends BaseModalProps {
     /** Modal type identifier */
     type: "anySpendDepositHype";
@@ -357,10 +366,32 @@ export interface ProfileEditorModalProps extends BaseModalProps {
     /** Callback function called when profile is successfully updated */
     onSuccess?: () => void;
 }
+/**
+ * Props for the Deposit modal
+ * Allows users to deposit tokens into their global account
+ */
+export interface DepositModalProps extends BaseModalProps {
+    /** Modal type identifier */
+    type: "deposit";
+    /** Callback function called when deposit is successful */
+    onSuccess?: () => void;
+}
+/**
+ * Props for the Send modal
+ * Allows users to send tokens from their global account to another address
+ */
+export interface SendModalProps extends BaseModalProps {
+    /** Modal type identifier */
+    type: "send";
+    /** Pre-filled recipient address (optional) */
+    recipientAddress?: string;
+    /** Callback function called when send is successful */
+    onSuccess?: (txHash?: string) => void;
+}
 /**
  * Union type of all possible modal content types
  */
-export type ModalContentType = SignInWithB3ModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendStakeB3ExactInProps | AnySpendStakeUpsideProps | AnySpendStakeUpsideExactInProps | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps | LinkAccountModalProps | AnySpendDepositHypeProps | AvatarEditorModalProps | ProfileEditorModalProps;
+export type ModalContentType = SignInWithB3ModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendStakeB3ExactInProps | AnySpendStakeUpsideProps | AnySpendStakeUpsideExactInProps | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps | LinkAccountModalProps | LinkNewAccountModalProps | AnySpendDepositHypeProps | AvatarEditorModalProps | DepositModalProps | SendModalProps | ProfileEditorModalProps;
 /**
  * State interface for the modal store
  */

package/dist/cjs/global-account/react/stores/useRecentAddressesStore.d.ts

@@ -0,0 +1,25 @@
+interface RecentAddress {
+    address: string;
+    timestamp: number;
+}
+interface RecentAddressesStore {
+    recentAddresses: RecentAddress[];
+    addRecentAddress: (address: string) => void;
+    clearRecentAddresses: () => void;
+}
+/**
+ * Store for managing recently used addresses in the Send flow
+ * Persists to localStorage and keeps the last 6 unique addresses
+ */
+export declare const useRecentAddressesStore: import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<RecentAddressesStore>, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<RecentAddressesStore, RecentAddressesStore>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => Promise<void> | void;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: RecentAddressesStore) => void) => () => void;
+        onFinishHydration: (fn: (state: RecentAddressesStore) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<RecentAddressesStore, RecentAddressesStore>>;
+    };
+}>;
+export {};