@b3dotfun/sdk 0.1.69 → 0.1.70-alpha.2

package/dist/esm/shared/constants/index.d.ts

@@ -16,3 +16,4 @@ export declare const CLIENT_APP_BUNDLE_ID: string;
 export declare const B3_AUTH_COOKIE_NAME = "b3-auth";
 export declare const ENS_GATEWAY_URL = "https://ens-gateway.b3.fun/";
 export declare const PUBLIC_BASE_RPC_URL = "https://base-rpc.publicnode.com";
+export declare const AVATAR_COLORS: string[];

package/dist/esm/shared/constants/index.js

@@ -21,3 +21,4 @@ export const CLIENT_APP_BUNDLE_ID = process.env.EXPO_PUBLIC_B3_BUNDLE_ID || "";
 export const B3_AUTH_COOKIE_NAME = "b3-auth";
 export const ENS_GATEWAY_URL = "https://ens-gateway.b3.fun/";
 export const PUBLIC_BASE_RPC_URL = "https://base-rpc.publicnode.com";
+export const AVATAR_COLORS = ["#3368ef", "#272727", "#6366f1", "#06b6d4", "#eeb0d9", "#ba3fbf", "#ff777b", "#dfbb53"];

package/dist/esm/shared/generated/chain-networks.json

@@ -5,8 +5,8 @@
     "name": "B3",
     "rpcUrls": {
       "default": {
-        "http": "https://mainnet-rpc.b3.fun",
-        "ws": "wss://mainnet-rpc.b3.fun/ws"
+        "http": "https://late-dimensional-yard.b3-mainnet.quiknode.pro/461dbdbd44158cd7a7a764a58ffb01a67eef77f2/",
+        "ws": "wss://late-dimensional-yard.b3-mainnet.quiknode.pro/461dbdbd44158cd7a7a764a58ffb01a67eef77f2/"
       },
       "backups": []
     },

package/dist/esm/shared/utils/chains.d.ts

@@ -1,4 +1,4 @@
-import { Chain } from "viem/chains";
+import type { Chain } from "viem";
 export declare function getChainById(id: number): Chain | undefined;
 export declare function chainIdToName(id: number): string | undefined;
 export declare function getExplorerUrl(chain: Chain, txHash: string): string;

package/dist/esm/shared/utils/chains.js

@@ -1,5 +1,5 @@
+import { b3Viem } from "../../shared/constants/chains/b3Viem.js";
 import { supportedChains } from "../../shared/constants/chains/supported.js";
-import { b3 } from "viem/chains";
 const baseChainBaseUrl = "https://basescan.org";
 export function getChainById(id) {
     return Object.values(supportedChains).find(chain => chain.id === id);
@@ -9,7 +9,7 @@ export function chainIdToName(id) {
     return name === "Base Mainnet" ? "Base" : name === "The Open Network" ? "Open Network" : name;
 }
 export function getExplorerUrl(chain, txHash) {
-    if (chain.id === b3.id) {
+    if (chain.id === b3Viem.id) {
         return "https://explorer.b3.fun/b3/tx/" + txHash;
     }
     let baseUrl = chain.blockExplorers?.default.url;

package/dist/esm/shared/utils/session-duration.d.ts

@@ -0,0 +1,15 @@
+export declare const SESSION_DURATION_OPTIONS: readonly [0, 1, 7, 14, 30];
+export type SessionDurationDays = (typeof SESSION_DURATION_OPTIONS)[number];
+/**
+ * Read session duration for a specific partner.
+ *
+ * preferences shape: { [partnerId]: { sessionDuration: number }, sessionDuration?: number }
+ *
+ * Priority: user.preferences[partnerId].sessionDuration
+ *           → user.preferences.sessionDuration (global fallback)
+ *           → localStorage (per-partner) → localStorage (global) → default 7d
+ */
+export declare function getSessionDurationDays(userPreferences?: Record<string, any>, partnerId?: string): SessionDurationDays;
+export declare const SESSION_DURATION_LABELS: Record<SessionDurationDays, string>;
+/** Cache the preference locally so it's available immediately on next login */
+export declare function setSessionDurationDays(days: SessionDurationDays, partnerId?: string): void;

package/dist/esm/shared/utils/session-duration.js

@@ -0,0 +1,64 @@
+const STORAGE_KEY_PREFIX = "b3-session-duration";
+const DEFAULT_DAYS = 7;
+// 0 = session cookie (expires when browser closes)
+export const SESSION_DURATION_OPTIONS = [0, 1, 7, 14, 30];
+function storageKey(partnerId) {
+    return partnerId ? `${STORAGE_KEY_PREFIX}_${partnerId}` : STORAGE_KEY_PREFIX;
+}
+/**
+ * Read session duration for a specific partner.
+ *
+ * preferences shape: { [partnerId]: { sessionDuration: number }, sessionDuration?: number }
+ *
+ * Priority: user.preferences[partnerId].sessionDuration
+ *           → user.preferences.sessionDuration (global fallback)
+ *           → localStorage (per-partner) → localStorage (global) → default 7d
+ */
+export function getSessionDurationDays(userPreferences, partnerId) {
+    if (userPreferences) {
+        if (partnerId) {
+            const v = userPreferences[partnerId]?.sessionDuration;
+            if (SESSION_DURATION_OPTIONS.includes(v))
+                return v;
+        }
+        const v = userPreferences["sessionDuration"];
+        if (SESSION_DURATION_OPTIONS.includes(v))
+            return v;
+    }
+    try {
+        if (partnerId) {
+            const stored = localStorage.getItem(storageKey(partnerId));
+            if (stored !== null) {
+                const parsed = Number(stored);
+                if (SESSION_DURATION_OPTIONS.includes(parsed))
+                    return parsed;
+            }
+        }
+        const stored = localStorage.getItem(STORAGE_KEY_PREFIX);
+        if (stored !== null) {
+            const parsed = Number(stored);
+            if (SESSION_DURATION_OPTIONS.includes(parsed))
+                return parsed;
+        }
+    }
+    catch {
+        // localStorage unavailable (e.g. SSR)
+    }
+    return DEFAULT_DAYS;
+}
+export const SESSION_DURATION_LABELS = {
+    0: "Session only",
+    1: "1 day",
+    7: "7 days",
+    14: "14 days",
+    30: "30 days",
+};
+/** Cache the preference locally so it's available immediately on next login */
+export function setSessionDurationDays(days, partnerId) {
+    try {
+        localStorage.setItem(storageKey(partnerId), String(days));
+    }
+    catch {
+        // ignore
+    }
+}

package/dist/esm/wallet/react/components/ConnectWallet.d.ts

@@ -0,0 +1,11 @@
+export interface ConnectWalletProps {
+    /** Theme for the modal and button. Defaults to "light". */
+    theme?: "light" | "dark";
+    /** Label for the connect button. Defaults to "Connect Wallet". */
+    buttonLabel?: string;
+}
+/**
+ * Drop-in wallet connection component styled to match the B3 design system.
+ * Uses inline styles — works in any app without tailwind configuration.
+ */
+export declare function ConnectWallet({ theme: themeProp, buttonLabel }: ConnectWalletProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/wallet/react/components/ConnectWallet.js

@@ -0,0 +1,431 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { WalletCoinbase, WalletMetamask, WalletPhantom, WalletRabby, WalletRainbow, WalletWalletConnect, } from "@web3icons/react";
+import { truncateAddress } from "../../../shared/utils/index.js";
+import { AlertCircle, Check, ChevronDown, Copy, Loader2, LogOut, Wallet, X } from "lucide-react";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { useWalletDisconnect } from "../hooks/useWalletDisconnect.js";
+import { useWalletState } from "../hooks/useWalletState.js";
+/** Injects the spinner keyframe once into the document head (idempotent via DOM id). */
+function SpinnerKeyframes() {
+    useEffect(() => {
+        if (document.getElementById("b3-spin-keyframes"))
+            return;
+        const style = document.createElement("style");
+        style.id = "b3-spin-keyframes";
+        style.textContent = "@keyframes b3-spin { to { transform: rotate(360deg) } }";
+        document.head.appendChild(style);
+    }, []);
+    return null;
+}
+const WALLET_DOWNLOAD_URLS = {
+    metamask: "https://metamask.io/download/",
+    "coinbase wallet": "https://www.coinbase.com/wallet/downloads",
+    phantom: "https://phantom.app/download",
+    rabby: "https://rabby.io/",
+    rainbow: "https://rainbow.me/download",
+    walletconnect: "https://walletconnect.com/",
+};
+function getWalletIcon(name, size = 24) {
+    switch (name.toLowerCase()) {
+        case "metamask":
+            return _jsx(WalletMetamask, { width: size, height: size });
+        case "coinbase wallet":
+            return _jsx(WalletCoinbase, { width: size, height: size });
+        case "phantom":
+            return _jsx(WalletPhantom, { width: size, height: size });
+        case "walletconnect":
+            return _jsx(WalletWalletConnect, { width: size, height: size });
+        case "rabby wallet":
+        case "rabby":
+            return _jsx(WalletRabby, { width: size, height: size });
+        case "rainbow":
+            return _jsx(WalletRainbow, { width: size, height: size });
+        default:
+            return _jsx(Wallet, { width: size, height: size });
+    }
+}
+// B3 brand colors
+const B3_BLUE = "#3368ef";
+const B3_BLUE_HOVER = "#2554d4";
+const theme = {
+    light: {
+        bg: "#ffffff",
+        cardBg: "#ffffff",
+        text: "#1a1a2e",
+        textSecondary: "#64748b",
+        textTertiary: "#94a3b8",
+        border: "#D1D1D6",
+        borderLight: "#e2e8f0",
+        hoverBg: "#f1f5f9",
+        iconBg: "#f1f5f9",
+        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)",
+        popoverShadow: "0 10px 30px -5px rgba(10,13,18,0.1), 0 4px 6px -4px rgba(10,13,18,0.05)",
+        overlayBg: "rgba(0,0,0,0.8)",
+        badgeInstalledBg: "#ecfdf5",
+        badgeInstalledText: "#059669",
+        badgeInstallBg: "#f1f5f9",
+        badgeInstallText: "#64748b",
+        connectedDot: "#10b981",
+        disconnectBorder: "#fca5a5",
+        disconnectText: "#dc2626",
+        disconnectHoverBg: "#fef2f2",
+        copyHoverBg: "#f1f5f9",
+    },
+    dark: {
+        bg: "#0f0f14",
+        cardBg: "#1a1a24",
+        text: "#f1f5f9",
+        textSecondary: "#94a3b8",
+        textTertiary: "#64748b",
+        border: "#2a2a3a",
+        borderLight: "#2a2a3a",
+        hoverBg: "#22222e",
+        iconBg: "#22222e",
+        shadow: "0 20px 24px -4px rgba(0,0,0,0.3), 0 8px 8px -4px rgba(0,0,0,0.2)",
+        popoverShadow: "0 10px 30px -5px rgba(0,0,0,0.4)",
+        overlayBg: "rgba(0,0,0,0.85)",
+        badgeInstalledBg: "#052e16",
+        badgeInstalledText: "#34d399",
+        badgeInstallBg: "#22222e",
+        badgeInstallText: "#64748b",
+        connectedDot: "#34d399",
+        disconnectBorder: "#7f1d1d",
+        disconnectText: "#f87171",
+        disconnectHoverBg: "#1c1017",
+        copyHoverBg: "#22222e",
+    },
+};
+/**
+ * Drop-in wallet connection component styled to match the B3 design system.
+ * Uses inline styles — works in any app without tailwind configuration.
+ */
+export function ConnectWallet({ theme: themeProp = "light", buttonLabel = "Connect Wallet" }) {
+    const { address, isConnected, chain, connectors } = useWalletState();
+    const { disconnect } = useWalletDisconnect();
+    const [modalOpen, setModalOpen] = useState(false);
+    const [popoverOpen, setPopoverOpen] = useState(false);
+    const [copied, setCopied] = useState(false);
+    const [hoveredUid, setHoveredUid] = useState(null);
+    const [btnHover, setBtnHover] = useState(false);
+    const [disconnectHover, setDisconnectHover] = useState(false);
+    const [copyHover, setCopyHover] = useState(false);
+    const [connectingUid, setConnectingUid] = useState(null);
+    const [connectError, setConnectError] = useState(null);
+    const [connectSuccess, setConnectSuccess] = useState(false);
+    const t = theme[themeProp];
+    const successTimerRef = useRef(null);
+    const resetConnectState = useCallback(() => {
+        setConnectingUid(null);
+        setConnectError(null);
+        setConnectSuccess(false);
+        if (successTimerRef.current) {
+            clearTimeout(successTimerRef.current);
+            successTimerRef.current = null;
+        }
+    }, []);
+    // Cleanup success timer on unmount
+    useEffect(() => {
+        return () => {
+            if (successTimerRef.current)
+                clearTimeout(successTimerRef.current);
+        };
+    }, []);
+    const handleConnect = useCallback(async (connector) => {
+        if (!connector.isInstalled) {
+            const url = WALLET_DOWNLOAD_URLS[connector.name.toLowerCase()];
+            if (url)
+                window.open(url, "_blank", "noopener,noreferrer");
+            return;
+        }
+        setConnectingUid(connector.uid);
+        setConnectError(null);
+        setConnectSuccess(false);
+        try {
+            await connector.connect();
+            setConnectSuccess(true);
+            successTimerRef.current = setTimeout(() => {
+                setModalOpen(false);
+                resetConnectState();
+            }, 800);
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : "Connection failed";
+            if (message.includes("rejected") || message.includes("denied") || message.includes("User rejected")) {
+                setConnectError("Connection rejected");
+            }
+            else {
+                setConnectError(message.length > 60 ? message.slice(0, 60) + "..." : message);
+            }
+            setConnectingUid(null);
+        }
+    }, [resetConnectState]);
+    const handleDisconnect = useCallback(() => {
+        disconnect();
+        setPopoverOpen(false);
+    }, [disconnect]);
+    const handleCopyAddress = useCallback(async () => {
+        if (address) {
+            try {
+                await navigator.clipboard.writeText(address);
+                setCopied(true);
+            }
+            catch {
+                // Clipboard API may be denied
+            }
+        }
+    }, [address]);
+    useEffect(() => {
+        if (!copied)
+            return;
+        const timer = setTimeout(() => setCopied(false), 2000);
+        return () => clearTimeout(timer);
+    }, [copied]);
+    // Close popover on Escape key
+    useEffect(() => {
+        if (!popoverOpen)
+            return;
+        const handleKeyDown = (e) => {
+            if (e.key === "Escape")
+                setPopoverOpen(false);
+        };
+        document.addEventListener("keydown", handleKeyDown);
+        return () => document.removeEventListener("keydown", handleKeyDown);
+    }, [popoverOpen]);
+    // --- Connected state ---
+    if (isConnected && address) {
+        return (_jsxs("div", { style: {
+                position: "relative",
+                display: "inline-block",
+                fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
+            }, children: [_jsxs("button", { onClick: () => setPopoverOpen(!popoverOpen), "aria-expanded": popoverOpen, "aria-haspopup": "true", style: {
+                        display: "flex",
+                        alignItems: "center",
+                        gap: 10,
+                        padding: "10px 16px",
+                        borderRadius: 12,
+                        border: `1.5px solid ${t.border}`,
+                        background: t.cardBg,
+                        color: t.text,
+                        fontSize: 14,
+                        fontWeight: 600,
+                        cursor: "pointer",
+                        letterSpacing: "-0.01em",
+                        transition: "all 150ms ease",
+                    }, children: [_jsx("span", { style: {
+                                width: 8,
+                                height: 8,
+                                borderRadius: "50%",
+                                background: t.connectedDot,
+                                display: "inline-block",
+                                boxShadow: `0 0 6px ${t.connectedDot}`,
+                            } }), _jsx("span", { style: { fontFamily: "'SF Mono', 'Fira Code', 'Cascadia Code', monospace", fontSize: 13 }, children: truncateAddress(address) }), _jsx(ChevronDown, { size: 14, color: t.textTertiary, style: { transition: "transform 200ms", transform: popoverOpen ? "rotate(180deg)" : "none" } })] }), popoverOpen && (_jsxs(_Fragment, { children: [_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 40 }, onClick: () => setPopoverOpen(false) }), _jsxs("div", { role: "dialog", "aria-label": "Wallet details", onClick: e => e.stopPropagation(), style: {
+                                position: "absolute",
+                                right: 0,
+                                top: "100%",
+                                marginTop: 8,
+                                width: 320,
+                                borderRadius: 16,
+                                border: `1.5px solid ${t.border}`,
+                                background: t.cardBg,
+                                boxShadow: t.popoverShadow,
+                                zIndex: 50,
+                                overflow: "hidden",
+                            }, children: [_jsxs("div", { style: {
+                                        padding: "16px 20px 14px",
+                                        borderBottom: `1px solid ${t.borderLight}`,
+                                        display: "flex",
+                                        alignItems: "center",
+                                        justifyContent: "space-between",
+                                    }, children: [_jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [_jsx("span", { style: {
+                                                        width: 8,
+                                                        height: 8,
+                                                        borderRadius: "50%",
+                                                        background: t.connectedDot,
+                                                        display: "inline-block",
+                                                        boxShadow: `0 0 6px ${t.connectedDot}`,
+                                                    } }), _jsx("span", { style: { fontSize: 13, fontWeight: 600, color: t.text, letterSpacing: "-0.01em" }, children: "Connected" })] }), chain && (_jsx("span", { style: {
+                                                fontSize: 11,
+                                                fontWeight: 600,
+                                                padding: "3px 10px",
+                                                borderRadius: 99,
+                                                background: t.iconBg,
+                                                color: t.textSecondary,
+                                                letterSpacing: "0.02em",
+                                                textTransform: "uppercase",
+                                            }, children: chain.name }))] }), _jsxs("div", { style: { padding: "12px 12px 16px" }, children: [_jsxs("button", { onClick: handleCopyAddress, onMouseEnter: () => setCopyHover(true), onMouseLeave: () => setCopyHover(false), style: {
+                                                display: "flex",
+                                                alignItems: "center",
+                                                gap: 10,
+                                                width: "100%",
+                                                padding: "10px 12px",
+                                                borderRadius: 10,
+                                                border: "none",
+                                                background: copyHover ? t.copyHoverBg : "transparent",
+                                                textAlign: "left",
+                                                fontFamily: "'SF Mono', 'Fira Code', 'Cascadia Code', monospace",
+                                                fontSize: 12,
+                                                color: t.text,
+                                                cursor: "pointer",
+                                                marginBottom: 8,
+                                                wordBreak: "break-all",
+                                                lineHeight: 1.5,
+                                                transition: "background 150ms ease",
+                                            }, children: [_jsx("span", { style: { flex: 1 }, children: address }), copied ? (_jsx(Check, { size: 14, color: t.connectedDot, style: { flexShrink: 0 } })) : (_jsx(Copy, { size: 14, color: t.textTertiary, style: { flexShrink: 0 } }))] }), _jsxs("button", { onClick: handleDisconnect, onMouseEnter: () => setDisconnectHover(true), onMouseLeave: () => setDisconnectHover(false), style: {
+                                                display: "flex",
+                                                alignItems: "center",
+                                                justifyContent: "center",
+                                                gap: 8,
+                                                width: "100%",
+                                                padding: "10px 16px",
+                                                borderRadius: 10,
+                                                border: `1.5px solid ${t.disconnectBorder}`,
+                                                background: disconnectHover ? t.disconnectHoverBg : "transparent",
+                                                color: t.disconnectText,
+                                                fontSize: 13,
+                                                fontWeight: 600,
+                                                cursor: "pointer",
+                                                transition: "all 150ms ease",
+                                            }, children: [_jsx(LogOut, { size: 15 }), "Disconnect"] })] })] })] }))] }));
+    }
+    // --- Disconnected state ---
+    return (_jsxs(DialogPrimitive.Root, { open: modalOpen, onOpenChange: open => {
+            setModalOpen(open);
+            if (!open)
+                resetConnectState();
+        }, children: [_jsx(DialogPrimitive.Trigger, { asChild: true, children: _jsx("button", { onMouseEnter: () => setBtnHover(true), onMouseLeave: () => setBtnHover(false), style: {
+                        padding: "12px 24px",
+                        borderRadius: 12,
+                        border: "none",
+                        background: btnHover ? B3_BLUE_HOVER : B3_BLUE,
+                        color: "#ffffff",
+                        fontSize: 14,
+                        fontWeight: 600,
+                        cursor: "pointer",
+                        letterSpacing: "-0.01em",
+                        transition: "all 150ms ease",
+                        boxShadow: btnHover ? `0 4px 12px ${B3_BLUE}40, 0 1px 3px rgba(0,0,0,0.1)` : `0 2px 8px ${B3_BLUE}30`,
+                        fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
+                    }, children: buttonLabel }) }), _jsx(SpinnerKeyframes, {}), _jsxs(DialogPrimitive.Portal, { children: [_jsx(DialogPrimitive.Overlay, { style: {
+                            position: "fixed",
+                            inset: 0,
+                            zIndex: 50,
+                            background: t.overlayBg,
+                            backdropFilter: "blur(20px)",
+                            WebkitBackdropFilter: "blur(20px)",
+                        } }), _jsxs(DialogPrimitive.Content, { style: {
+                            position: "fixed",
+                            left: "50%",
+                            top: "50%",
+                            transform: "translate(-50%, -50%)",
+                            zIndex: 50,
+                            width: "calc(100% - 32px)",
+                            maxWidth: 400,
+                            borderRadius: 20,
+                            border: `1.5px solid ${t.border}`,
+                            background: t.cardBg,
+                            color: t.text,
+                            boxShadow: t.shadow,
+                            overflow: "hidden",
+                            fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
+                        }, children: [_jsxs("div", { style: {
+                                    display: "flex",
+                                    alignItems: "center",
+                                    justifyContent: "space-between",
+                                    padding: "20px 24px 16px",
+                                }, children: [_jsxs("div", { children: [_jsx(DialogPrimitive.Title, { style: {
+                                                    fontSize: 18,
+                                                    fontWeight: 700,
+                                                    margin: 0,
+                                                    letterSpacing: "-0.02em",
+                                                    color: t.text,
+                                                }, children: "Connect Wallet" }), _jsx("p", { style: { fontSize: 13, color: t.textSecondary, margin: "4px 0 0", letterSpacing: "-0.01em" }, children: "Choose your preferred wallet" })] }), _jsx(DialogPrimitive.Close, { style: {
+                                            background: t.iconBg,
+                                            border: "none",
+                                            cursor: "pointer",
+                                            padding: 8,
+                                            borderRadius: 10,
+                                            color: t.textSecondary,
+                                            display: "flex",
+                                            alignItems: "center",
+                                            justifyContent: "center",
+                                            transition: "all 150ms ease",
+                                        }, children: _jsx(X, { size: 16 }) })] }), connectError && (_jsxs("div", { style: {
+                                    margin: "0 12px 8px",
+                                    padding: "10px 14px",
+                                    borderRadius: 10,
+                                    background: themeProp === "dark" ? "#1c1017" : "#fef2f2",
+                                    border: `1px solid ${t.disconnectBorder}`,
+                                    display: "flex",
+                                    alignItems: "center",
+                                    gap: 8,
+                                    fontSize: 13,
+                                    color: t.disconnectText,
+                                }, children: [_jsx(AlertCircle, { size: 16, style: { flexShrink: 0 } }), _jsx("span", { style: { flex: 1 }, children: connectError }), _jsx("button", { onClick: () => setConnectError(null), style: { background: "none", border: "none", cursor: "pointer", color: t.disconnectText, padding: 2 }, children: _jsx(X, { size: 14 }) })] })), _jsx("div", { style: { padding: "0 12px 16px" }, children: connectors.length === 0 ? (_jsx("p", { style: { padding: "40px 0", textAlign: "center", fontSize: 14, color: t.textSecondary }, children: "No wallets detected" })) : (_jsx("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: connectors.map(connector => {
+                                        const isLoading = connectingUid === connector.uid;
+                                        const isSuccess = connectSuccess && connectingUid === connector.uid;
+                                        const isDisabled = connectingUid !== null && connectingUid !== connector.uid;
+                                        return (_jsxs("button", { onClick: () => !connectingUid && handleConnect(connector), onMouseEnter: () => setHoveredUid(connector.uid), onMouseLeave: () => setHoveredUid(null), style: {
+                                                display: "flex",
+                                                alignItems: "center",
+                                                gap: 14,
+                                                width: "100%",
+                                                padding: "14px 16px",
+                                                borderRadius: 14,
+                                                border: isLoading
+                                                    ? `1.5px solid ${B3_BLUE}`
+                                                    : isSuccess
+                                                        ? `1.5px solid ${t.connectedDot}`
+                                                        : hoveredUid === connector.uid && !isDisabled
+                                                            ? `1.5px solid ${B3_BLUE}40`
+                                                            : "1.5px solid transparent",
+                                                background: isLoading
+                                                    ? themeProp === "dark"
+                                                        ? "#1a1a30"
+                                                        : "#eff6ff"
+                                                    : isSuccess
+                                                        ? themeProp === "dark"
+                                                            ? "#0a1f15"
+                                                            : "#ecfdf5"
+                                                        : hoveredUid === connector.uid && !isDisabled
+                                                            ? t.hoverBg
+                                                            : "transparent",
+                                                textAlign: "left",
+                                                cursor: isDisabled ? "default" : "pointer",
+                                                color: t.text,
+                                                opacity: isDisabled ? 0.4 : 1,
+                                                transition: "all 150ms ease",
+                                            }, children: [_jsx("div", { style: {
+                                                        width: 44,
+                                                        height: 44,
+                                                        borderRadius: 12,
+                                                        background: t.iconBg,
+                                                        display: "flex",
+                                                        alignItems: "center",
+                                                        justifyContent: "center",
+                                                        flexShrink: 0,
+                                                        border: `1px solid ${t.borderLight}`,
+                                                    }, children: getWalletIcon(connector.name, 24) }), _jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [_jsx("div", { style: { fontSize: 14, fontWeight: 600, letterSpacing: "-0.01em" }, children: connector.name }), isLoading && (_jsx("div", { style: { fontSize: 12, color: B3_BLUE, marginTop: 2 }, children: "Waiting for approval..." })), isSuccess && (_jsx("div", { style: { fontSize: 12, color: t.connectedDot, marginTop: 2 }, children: "Connected" }))] }), isLoading && (_jsx(Loader2, { size: 18, color: B3_BLUE, style: { flexShrink: 0, animation: "b3-spin 1s linear infinite" } })), isSuccess && _jsx(Check, { size: 18, color: t.connectedDot, style: { flexShrink: 0 } }), !isLoading && !isSuccess && !connector.isInstalled && (_jsx("span", { style: {
+                                                        fontSize: 11,
+                                                        fontWeight: 600,
+                                                        padding: "4px 10px",
+                                                        borderRadius: 99,
+                                                        background: t.badgeInstallBg,
+                                                        color: t.badgeInstallText,
+                                                        letterSpacing: "0.01em",
+                                                    }, children: "Install" }))] }, connector.uid));
+                                    }) })) }), _jsxs("div", { style: {
+                                    padding: "12px 24px 16px",
+                                    borderTop: `1px solid ${t.borderLight}`,
+                                    display: "flex",
+                                    alignItems: "center",
+                                    justifyContent: "center",
+                                    gap: 6,
+                                }, children: [_jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", width: 16, height: 16 }), _jsx("span", { style: {
+                                            fontSize: 11,
+                                            fontWeight: 700,
+                                            color: B3_BLUE,
+                                            letterSpacing: "0.06em",
+                                            textTransform: "uppercase",
+                                        }, children: "Powered by B3" })] })] })] })] }));
+}

package/dist/esm/wallet/react/components/WalletProvider.d.ts

@@ -0,0 +1,35 @@
+import { QueryClient } from "@tanstack/react-query";
+import { type Config, type CreateConnectorFn } from "wagmi";
+import type { Chain } from "viem";
+export interface WalletProviderProps {
+    children: React.ReactNode;
+    /**
+     * Chains to support. Defaults to SDK's supportedChains.
+     * Must be memoized or defined outside the component — inline arrays cause the
+     * wagmi config to rebuild on every render, losing wallet connection state.
+     */
+    chains?: Chain[];
+    /**
+     * Wagmi connectors. Must be memoized or defined outside the component — inline
+     * arrays cause the wagmi config to rebuild on every render, losing wallet connection state.
+     */
+    connectors?: CreateConnectorFn[];
+    /**
+     * Optional RPC URL overrides per chain ID.
+     * Must be memoized or defined outside the component — inline objects cause the
+     * wagmi config to rebuild on every render, losing wallet connection state.
+     */
+    rpcUrls?: Record<number, string>;
+    /** Escape hatch: pass a fully custom wagmi config. Overrides chains/connectors/rpcUrls. */
+    wagmiConfig?: Config;
+    /** Provide your own QueryClient for React Query. Defaults to an internal instance. */
+    queryClient?: QueryClient;
+    /** Whether to auto-reconnect the last wallet on mount. Defaults to false. */
+    reconnectOnMount?: boolean;
+}
+/**
+ * Standalone wallet connection provider.
+ * Wraps ThirdwebProvider, WagmiProvider, and QueryClientProvider.
+ * Use wagmi hooks (useAccount, useConnect, useDisconnect) directly inside.
+ */
+export declare function WalletProvider({ children, chains, connectors, rpcUrls, wagmiConfig: wagmiConfigProp, queryClient: queryClientProp, reconnectOnMount, }: WalletProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/wallet/react/components/WalletProvider.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { useMemo, useState } from "react";
+import { ThirdwebProvider } from "thirdweb/react";
+import { WagmiProvider } from "wagmi";
+import { createWalletConfig } from "../../utils/createWalletConfig.js";
+/**
+ * Standalone wallet connection provider.
+ * Wraps ThirdwebProvider, WagmiProvider, and QueryClientProvider.
+ * Use wagmi hooks (useAccount, useConnect, useDisconnect) directly inside.
+ */
+export function WalletProvider({ children, chains, connectors, rpcUrls, wagmiConfig: wagmiConfigProp, queryClient: queryClientProp, reconnectOnMount = false, }) {
+    const [defaultQueryClient] = useState(() => new QueryClient());
+    const queryClient = queryClientProp ?? defaultQueryClient;
+    const wagmiConfig = useMemo(() => wagmiConfigProp ?? createWalletConfig({ chains, connectors, rpcUrls }), [wagmiConfigProp, chains, connectors, rpcUrls]);
+    return (_jsx(ThirdwebProvider, { children: _jsx(WagmiProvider, { config: wagmiConfig, reconnectOnMount: reconnectOnMount, children: _jsx(QueryClientProvider, { client: queryClient, children: children }) }) }));
+}

package/dist/esm/wallet/react/hooks/useWalletDisconnect.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Disconnect the current wallet via wagmi.
+ * Consumers should use this instead of wagmi's useDisconnect directly
+ * to ensure a consistent disconnect API across the wallet module.
+ *
+ * Note: this only disconnects the wagmi layer. When used inside B3Provider,
+ * the thirdweb auth session is managed separately by B3Provider's own logout
+ * flow (useAuthentication). ConnectWallet is intended for standalone
+ * WalletProvider usage where thirdweb auth is not involved.
+ */
+export declare function useWalletDisconnect(): {
+    disconnect: () => void;
+};