@b3dotfun/sdk 0.1.69-test.0 → 0.1.70-alpha.1

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

@@ -0,0 +1,37 @@
+export type BetterAuthVerifyEmailState = "success" | "expired" | "invalid" | "already-verified" | "error";
+export interface BetterAuthVerifyEmailProps {
+    /**
+     * Error code from the callback URL's `?error=` query param. Pass `null` /
+     * `undefined` when the user landed here cleanly (successful verification).
+     * Better Auth appends this param when server-side verification fails.
+     */
+    errorCode?: string | null;
+    /** Called when the user clicks the "Go to sign in" button. */
+    onGoToSignIn?: () => void;
+    /** Fallback href used when `onGoToSignIn` is not provided. Defaults to "/login". */
+    signInHref?: string;
+    /** Optional override for the success headline. */
+    successTitle?: string;
+    /** Optional override for the success body text. */
+    successMessage?: string;
+    /** Optional class name for the root container. */
+    className?: string;
+}
+/**
+ * Standalone email-verification confirmation page. Render on the route you
+ * set as `callbackURL` when calling `betterAuthClient.sendVerificationEmail`
+ * (or the `verifyCallbackURL` arg on `useBetterAuth().signUpWithEmail`).
+ *
+ * Better Auth verifies the token server-side before redirecting here. This
+ * component only displays the outcome based on the `?error=` query param.
+ *
+ * Usage:
+ * ```tsx
+ * const error = new URLSearchParams(window.location.search).get("error");
+ * <BetterAuthVerifyEmail
+ *   errorCode={error}
+ *   onGoToSignIn={() => router.push("/login")}
+ * />
+ * ```
+ */
+export declare function BetterAuthVerifyEmail({ errorCode, onGoToSignIn, signInHref, successTitle, successMessage, className, }: BetterAuthVerifyEmailProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,82 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "../../../../global-account/react/index.js";
+import { debugB3React } from "../../../../shared/utils/debug.js";
+const debug = debugB3React("BetterAuthVerifyEmail");
+function classifyError(code) {
+    if (!code)
+        return "success";
+    const normalized = code.toLowerCase();
+    // Exact matches for Better Auth's documented verification error codes.
+    if (normalized === "expired_token")
+        return "expired";
+    if (normalized === "invalid_token")
+        return "invalid";
+    if (normalized === "already_verified" || normalized === "email_already_verified")
+        return "already-verified";
+    // Loose fallbacks for close variants. Order matters — check "already" before
+    // "verified" so `email_already_verified` maps to already-verified, not invalid.
+    if (normalized.includes("expired"))
+        return "expired";
+    if (normalized.includes("already"))
+        return "already-verified";
+    if (normalized.includes("invalid"))
+        return "invalid";
+    return "error";
+}
+const COPY = {
+    success: {
+        title: "Email verified",
+        message: "Your email is confirmed. You can now sign in to your account.",
+    },
+    expired: {
+        title: "Link expired",
+        message: "This verification link has expired. Request a new one from the sign-in page.",
+    },
+    invalid: {
+        title: "Invalid link",
+        message: "This verification link is invalid or has already been used. Try signing in or request a new link.",
+    },
+    "already-verified": {
+        title: "Already verified",
+        message: "Your email was already confirmed. You can sign in now.",
+    },
+    error: {
+        title: "Verification failed",
+        message: "We couldn't verify your email. Request a new link from the sign-in page.",
+    },
+};
+/**
+ * Standalone email-verification confirmation page. Render on the route you
+ * set as `callbackURL` when calling `betterAuthClient.sendVerificationEmail`
+ * (or the `verifyCallbackURL` arg on `useBetterAuth().signUpWithEmail`).
+ *
+ * Better Auth verifies the token server-side before redirecting here. This
+ * component only displays the outcome based on the `?error=` query param.
+ *
+ * Usage:
+ * ```tsx
+ * const error = new URLSearchParams(window.location.search).get("error");
+ * <BetterAuthVerifyEmail
+ *   errorCode={error}
+ *   onGoToSignIn={() => router.push("/login")}
+ * />
+ * ```
+ */
+export function BetterAuthVerifyEmail({ errorCode, onGoToSignIn, signInHref = "/login", successTitle, successMessage, className, }) {
+    const state = classifyError(errorCode);
+    const isSuccess = state === "success" || state === "already-verified";
+    const copy = COPY[state];
+    const title = isSuccess && successTitle ? successTitle : copy.title;
+    const message = isSuccess && successMessage ? successMessage : copy.message;
+    debug("Rendering verify-email state", { state, errorCode });
+    const handleClick = () => {
+        if (onGoToSignIn) {
+            onGoToSignIn();
+            return;
+        }
+        if (typeof window !== "undefined") {
+            window.location.href = signInHref;
+        }
+    };
+    return (_jsx("div", { className: `w-full max-w-[400px] px-6 ${className || ""}`, children: _jsxs("div", { className: "space-y-6 text-center", children: [_jsx("div", { className: `mx-auto flex h-12 w-12 items-center justify-center rounded-full ${isSuccess ? "bg-green-100" : "bg-red-100"}`, children: isSuccess ? (_jsx("svg", { className: "h-6 w-6 text-green-600", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) })) : (_jsx("svg", { className: "h-6 w-6 text-red-600", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })) }), _jsxs("div", { children: [_jsx("h1", { className: "text-[28px] font-semibold tracking-tight text-gray-900 dark:text-gray-100", children: title }), _jsx("p", { className: "mt-3 text-[15px] text-gray-500 dark:text-gray-400", children: message })] }), _jsx(Button, { onClick: handleClick, className: "h-11 w-full bg-gray-900 text-[15px] font-medium text-white hover:bg-gray-800 dark:bg-white dark:text-gray-900 dark:hover:bg-gray-100", children: isSuccess ? "Go to sign in" : "Back to sign in" })] }) }));
+}

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

@@ -1,15 +1,18 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { IPFSMediaRenderer, SignInWithB3, StyleRoot, useAccountWallet, useAuthentication, useB3Config, useIsMobile, } from "../../../../global-account/react/index.js";
+import { IPFSMediaRenderer, SignInWithB3, StyleRoot, useAccountWallet, useAuthStore, useAuthentication, useB3Config, useIsMobile, } from "../../../../global-account/react/index.js";
 import Icon from "../../../../global-account/react/components/custom/Icon.js";
 import { ecosystemWalletId } from "../../../../shared/constants/index.js";
 import { cn, truncateAddress } from "../../../../shared/utils/index.js";
 import { Menu, MenuButton, MenuItems, Transition } from "@headlessui/react";
 import { useEffect } from "react";
 import { useConnectedWallets, useSetActiveWallet, useWalletImage } from "thirdweb/react";
+import { useUser } from "../../hooks/useUser.js";
+import { UserAvatar } from "../UserAvatar/UserAvatar.js";
 import { ManageAccountButton } from "../custom/ManageAccountButton.js";
 export function SignIn(props) {
     const { className } = props;
-    const { automaticallySetFirstEoa, partnerId } = useB3Config();
+    const { automaticallySetFirstEoa, partnerId, authStrategy } = useB3Config();
+    const isBetterAuth = authStrategy === "better-auth";
     const { address: globalAddress, ensName, connectedSmartWallet, connectedEOAWallet, isActiveSmartWallet, isActiveEOAWallet, smartWalletIcon, } = useAccountWallet();
     const { data: walletImage } = useWalletImage(connectedEOAWallet?.id);
     const isMobile = useIsMobile();
@@ -19,6 +22,10 @@ export function SignIn(props) {
     };
     const connectedWallets = useConnectedWallets();
     const setActiveWallet = useSetActiveWallet();
+    // Better Auth state
+    const isAuthenticated = useAuthStore(state => state.isAuthenticated);
+    const { user } = useUser();
+    const userDisplayName = user?.username || user?.email || "Account";
     const handleSetActiveAccount = (selectedWalletId) => {
         if (!selectedWalletId ||
             !connectedWallets ||
@@ -34,12 +41,15 @@ export function SignIn(props) {
             setActiveWallet(connectedEOAWallet);
         }
     }, [connectedEOAWallet, isActiveEOAWallet, setActiveWallet, automaticallySetFirstEoa]);
+    const isLoggedIn = isBetterAuth ? isAuthenticated : !!globalAddress;
     // Desktop version - original dropdown menu
-    return (_jsx(StyleRoot, { children: _jsx(Menu, { className: `relative flex items-center ${className || ""}`, as: "div", children: globalAddress ? (_jsxs(_Fragment, { children: [_jsxs(MenuButton, { className: "bg-b3-react-background group flex h-10 items-center gap-1 rounded-xl px-3 focus:outline-none", children: [!!walletImage && (_jsx(IPFSMediaRenderer, { src: walletImage, alt: "Wallet Image", className: "bg-b3-react-primary h-6 w-6 rounded-full object-cover opacity-100" })), _jsx("div", { className: "text-as-primary", children: ensName ? ensName : truncateAddress(globalAddress) })] }), _jsx(Transition, { enter: "duration-200 ease-out", enterFrom: "scale-95 opacity-0", enterTo: "scale-100 opacity-100", leave: "duration-300 ease-out", leaveFrom: "scale-100 opacity-100", leaveTo: "scale-95 opacity-0", children: _jsx(MenuItems, { className: "b3-root absolute -right-4 top-full min-w-64 rounded-2xl border focus:outline-none lg:right-0", modal: false, 
+    return (_jsx(StyleRoot, { children: _jsx(Menu, { className: `relative flex items-center ${className || ""}`, as: "div", children: isLoggedIn ? (_jsxs(_Fragment, { children: [_jsxs(MenuButton, { className: "bg-b3-react-background group flex h-10 items-center gap-1 rounded-xl px-3 focus:outline-none", children: [isBetterAuth ? (_jsx(UserAvatar, { avatarUrl: user?.avatar, name: userDisplayName, size: 24 })) : (!!walletImage && (_jsx(IPFSMediaRenderer, { src: walletImage, alt: "Wallet Image", className: "bg-b3-react-primary h-6 w-6 rounded-full object-cover opacity-100" }))), _jsx("div", { className: "text-as-primary", children: isBetterAuth ? userDisplayName : ensName ? ensName : truncateAddress(globalAddress ?? "") })] }), _jsx(Transition, { enter: "duration-200 ease-out", enterFrom: "scale-95 opacity-0", enterTo: "scale-100 opacity-100", leave: "duration-300 ease-out", leaveFrom: "scale-100 opacity-100", leaveTo: "scale-95 opacity-0", children: _jsx(MenuItems, { className: "b3-root absolute -right-4 top-full min-w-64 rounded-2xl border focus:outline-none lg:right-0", modal: false, 
                             // TODO: Figure out why setting anchor on mobile causes z-index issues where it appears under elements
-                            anchor: isMobile ? "top end" : undefined, children: _jsxs("div", { className: "bg-b3-react-background", children: [connectedEOAWallet ? (_jsxs("div", { className: cn("border-b3-react-subtle bg-b3-react-background flex cursor-pointer items-center justify-between rounded-xl p-3"), onClick: () => handleSetActiveAccount(connectedEOAWallet?.id), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("img", { className: "bg-b3-react-primary h-16 w-16 rounded-full opacity-100", src: walletImage, alt: connectedEOAWallet?.id }), _jsxs("div", { className: "ml-4 grow", children: [ensName && _jsx("div", { children: ensName }), _jsx("div", { children: truncateAddress(globalAddress) })] })] }), isActiveEOAWallet && _jsx(Icon, { className: "fill-b3-react-primary", name: "check" })] })) : (connectedSmartWallet && (_jsxs("div", { className: cn("mb-2 flex cursor-pointer items-center justify-between rounded-xl p-3", isActiveSmartWallet
+                            anchor: isMobile ? "top end" : undefined, children: _jsxs("div", { className: "bg-b3-react-background", children: [isBetterAuth ? (
+                                    /* Better Auth: show user info instead of wallet switching */
+                                    _jsxs("div", { className: "flex items-center gap-3 rounded-xl p-3", children: [_jsx(UserAvatar, { avatarUrl: user?.avatar, name: userDisplayName, size: 48 }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [user?.username && _jsx("div", { className: "text-b3-react-primary font-semibold", children: user.username }), user?.email && _jsx("div", { className: "text-b3-react-secondary text-sm", children: user.email })] })] })) : connectedEOAWallet ? (_jsxs("div", { className: cn("border-b3-react-subtle bg-b3-react-background flex cursor-pointer items-center justify-between rounded-xl p-3"), onClick: () => handleSetActiveAccount(connectedEOAWallet?.id), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("img", { className: "bg-b3-react-primary h-16 w-16 rounded-full opacity-100", src: walletImage, alt: connectedEOAWallet?.id }), _jsxs("div", { className: "ml-4 grow", children: [ensName && _jsx("div", { children: ensName }), _jsx("div", { children: truncateAddress(globalAddress ?? "") })] })] }), isActiveEOAWallet && _jsx(Icon, { className: "fill-b3-react-primary", name: "check" })] })) : (connectedSmartWallet && (_jsxs("div", { className: cn("mb-2 flex cursor-pointer items-center justify-between rounded-xl p-3", isActiveSmartWallet
                                             ? "bg-b3-react-background"
-                                            : "bg-b3-react-background hover:bg-b3-react-background"), onClick: () => handleSetActiveAccount(connectedSmartWallet?.id), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("img", { className: "bg-b3-react-primary h-16 w-16 rounded-full opacity-100", src: smartWalletIcon, alt: connectedSmartWallet?.id }), _jsxs("div", { className: "grow pl-4", children: [ensName && _jsx("div", { children: ensName }), _jsx("div", { children: truncateAddress(globalAddress) }), _jsx("div", { children: "Smart wallet" })] })] }), isActiveSmartWallet && _jsx(Icon, { className: "fill-b3-react-primary", name: "check" })] }))), _jsx("div", { className: "ml-3", children: _jsx(ManageAccountButton, { ...props, className: "w-[calc(100%-12px)]" }) }), _jsx("button", { className: "mb-2 w-full space-y-1", onClick: onDisconnect, children: _jsxs("div", { className: "hover:bg-b3-react-background group flex h-12 items-center rounded-xl px-4 transition-colors", children: [_jsx(Icon, { className: "fill-b3-react-primary mr-4 shrink-0 transition-colors", name: "logout" }), _jsx("div", { className: "text-b3-react-primary mr-auto transition-colors", children: "Disconnect" })] }) })] }) }) })] })) : (_jsx(SignInWithB3, { closeAfterLogin: true, onLoginSuccess: async (globalAccount) => {
+                                            : "bg-b3-react-background hover:bg-b3-react-background"), onClick: () => handleSetActiveAccount(connectedSmartWallet?.id), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("img", { className: "bg-b3-react-primary h-16 w-16 rounded-full opacity-100", src: smartWalletIcon, alt: connectedSmartWallet?.id }), _jsxs("div", { className: "grow pl-4", children: [ensName && _jsx("div", { children: ensName }), _jsx("div", { children: truncateAddress(globalAddress ?? "") }), _jsx("div", { children: "Smart wallet" })] })] }), isActiveSmartWallet && _jsx(Icon, { className: "fill-b3-react-primary", name: "check" })] }))), _jsx("div", { className: "ml-3", children: _jsx(ManageAccountButton, { ...props, className: "w-[calc(100%-12px)]" }) }), _jsx("button", { className: "mb-2 w-full space-y-1", onClick: onDisconnect, children: _jsxs("div", { className: "hover:bg-b3-react-background group flex h-12 items-center rounded-xl px-4 transition-colors", children: [_jsx(Icon, { className: "fill-b3-react-primary mr-4 shrink-0 transition-colors", name: "logout" }), _jsx("div", { className: "text-b3-react-primary mr-auto transition-colors", children: isBetterAuth ? "Sign out" : "Disconnect" })] }) })] }) }) })] })) : (_jsx(SignInWithB3, { closeAfterLogin: true, onLoginSuccess: async (globalAccount) => {
                     console.log("User authenticated with Global Account!", globalAccount);
                 }, ...props })) }) }));
 }

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

@@ -3,4 +3,4 @@ import { SignInWithB3ModalProps } from "../../../../global-account/react";
  * Component that manages the authentication flow for Sign In With B3
  * Handles different login providers, authentication steps, and session key management
  */
-export declare function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin, source, signersEnabled, }: SignInWithB3ModalProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin, source, signersEnabled, verifyEmailRedirectTo, }: SignInWithB3ModalProps): import("react/jsx-runtime").JSX.Element | null;

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

@@ -13,7 +13,7 @@ const MAX_REFETCH_ATTEMPTS = 20;
  * Component that manages the authentication flow for Sign In With B3
  * Handles different login providers, authentication steps, and session key management
  */
-export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin = false, source = "signInWithB3Button", signersEnabled = false, }) {
+export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin = false, source = "signInWithB3Button", signersEnabled = false, verifyEmailRedirectTo, }) {
     const { automaticallySetFirstEoa, authStrategy } = useB3Config();
     // skipAutoConnect: this component intentionally logs out on mount to show a fresh login screen.
     // AuthenticationProvider is the sole owner of useAutoConnect to avoid competing auth cycles.
@@ -244,7 +244,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
             // Better Auth manages its own loading/verification states internally.
             // Don't gate on isAuthenticating — it would unmount the component
             // and lose verification state when setIsAuthenticating(false) fires.
-            content = _jsx(LoginStepBetterAuth, { onSuccess: () => handleLoginSuccess({}), onError: onError });
+            content = (_jsx(LoginStepBetterAuth, { onSuccess: () => handleLoginSuccess({}), onError: onError, verifyEmailRedirectTo: verifyEmailRedirectTo }));
         }
         else if (!readyToShowLogin || isAuthenticating || isFetchingSigners) {
             content = (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx("div", { className: "my-8 flex min-h-[350px] items-center justify-center", children: _jsx(Loading, { variant: "white", size: "lg" }) }) }));

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

@@ -0,0 +1,10 @@
+interface PasswordInputProps {
+    value: string;
+    onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    disabled?: boolean;
+    placeholder?: string;
+    onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
+    className?: string;
+}
+export declare function PasswordInput({ value, onChange, disabled, placeholder, onKeyDown, className, }: PasswordInputProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Input } from "../../../../../global-account/react/index.js";
+import { useState } from "react";
+export function PasswordInput({ value, onChange, disabled, placeholder = "Password", onKeyDown, className, }) {
+    const [showPassword, setShowPassword] = useState(false);
+    return (_jsxs("div", { className: "relative", children: [_jsx(Input, { type: showPassword ? "text" : "password", placeholder: placeholder, value: value, onChange: onChange, disabled: disabled, onKeyDown: onKeyDown, className: className }), _jsx("button", { type: "button", onClick: () => setShowPassword(!showPassword), "aria-label": showPassword ? "Hide password" : "Show password", className: "absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300", tabIndex: -1, children: showPassword ? (_jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 1.5, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88" }) })) : (_jsxs("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 1.5, children: [_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z" }), _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" })] })) })] }));
+}

package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepBetterAuth.d.ts

@@ -1,6 +1,8 @@
 interface LoginStepBetterAuthProps {
     onSuccess?: () => void;
     onError?: (error: Error) => Promise<void>;
+    /** URL Better Auth redirects to after server-side email verification. */
+    verifyEmailRedirectTo?: string;
 }
-export declare function LoginStepBetterAuth({ onSuccess, onError }: LoginStepBetterAuthProps): import("react/jsx-runtime").JSX.Element;
+export declare function LoginStepBetterAuth({ onSuccess, onError, verifyEmailRedirectTo }: LoginStepBetterAuthProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -4,6 +4,7 @@ import { debugB3React } from "../../../../../shared/utils/debug.js";
 import { useState } from "react";
 import { EmailVerificationRequiredError, useBetterAuth, } from "../../../hooks/useBetterAuth.js";
 import { AuthButton } from "../components/AuthButton.js";
+import { PasswordInput } from "../components/PasswordInput.js";
 const debug = debugB3React("LoginStepBetterAuth");
 const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 const SOCIAL_PROVIDERS = [
@@ -13,7 +14,7 @@ const SOCIAL_PROVIDERS = [
     { id: "microsoft", label: "Microsoft" },
     { id: "slack", label: "Slack" },
 ];
-export function LoginStepBetterAuth({ onSuccess, onError }) {
+export function LoginStepBetterAuth({ onSuccess, onError, verifyEmailRedirectTo }) {
     const { partnerId } = useB3Config();
     const { signInWithEmail, signUpWithEmail, signInWithSocial, requestPasswordReset } = useBetterAuth();
     const [mode, setMode] = useState("sign-in");
@@ -44,7 +45,7 @@ export function LoginStepBetterAuth({ onSuccess, onError }) {
             setError(null);
             if (mode === "sign-up") {
                 debug("Signing up", { email: normalizedEmail, name: name.trim() });
-                await signUpWithEmail(normalizedEmail, password, name.trim());
+                await signUpWithEmail(normalizedEmail, password, name.trim(), verifyEmailRedirectTo);
             }
             else {
                 debug("Signing in", { email: normalizedEmail });
@@ -111,7 +112,9 @@ export function LoginStepBetterAuth({ onSuccess, onError }) {
                             setPassword("");
                         }, className: "text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300", children: "Back to sign in" })] }) }));
     }
-    return (_jsx(LoginStepContainer, { partnerId: partnerId, children: mode === "forgot-password" ? (_jsxs("div", { className: "mb-6 w-full space-y-3 px-3", children: [_jsx("p", { className: "text-center text-sm font-medium text-gray-900 dark:text-gray-100", children: "Reset password" }), _jsx("p", { className: "text-center text-xs text-gray-500", children: "Enter your email and we'll send you a reset link" }), resetEmailSent ? (_jsx("div", { className: "space-y-3 py-4 text-center", children: _jsx("p", { className: "text-sm text-green-600", children: "Check your email for a reset link." }) })) : (_jsxs(_Fragment, { children: [_jsx(Input, { type: "email", placeholder: "you@example.com", value: email, onChange: event => setEmail(event.target.value), disabled: isLoading, onKeyDown: event => {
+    return (_jsx(LoginStepContainer, { partnerId: partnerId, children: mode === "forgot-password" ? (_jsxs("div", { className: "mb-6 w-full space-y-3 px-3", children: [_jsx("p", { className: "text-center text-sm font-medium text-gray-900 dark:text-gray-100", children: "Reset password" }), _jsx("p", { className: "text-center text-xs text-gray-500", children: resetEmailSent
+                        ? "We've sent a password reset link to your email"
+                        : "Enter your email and we'll send you a reset link" }), resetEmailSent ? (_jsx("div", { className: "space-y-3 py-4 text-center", children: _jsx("p", { className: "text-sm text-green-600", children: "Check your email for a reset link." }) })) : (_jsxs(_Fragment, { children: [_jsx(Input, { type: "email", placeholder: "you@example.com", value: email, onChange: event => setEmail(event.target.value), disabled: isLoading, onKeyDown: event => {
                                 if (event.key === "Enter")
                                     handleForgotPassword();
                             } }), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx(Button, { onClick: handleForgotPassword, disabled: isLoading, className: "w-full", children: isLoading ? "Sending..." : "Send reset link" })] })), _jsx("button", { onClick: () => {
@@ -119,10 +122,10 @@ export function LoginStepBetterAuth({ onSuccess, onError }) {
                         setShowEmailForm(true);
                         setError(null);
                         setResetEmailSent(false);
-                    }, className: "w-full text-center text-sm text-gray-500 hover:text-gray-700", children: "Back to sign in" })] })) : showEmailForm ? (_jsxs("div", { className: "mb-6 w-full space-y-3 px-3", children: [_jsx("p", { className: "text-center text-sm font-medium text-gray-900 dark:text-gray-100", children: mode === "sign-in" ? "Sign in with email" : "Create an account" }), mode === "sign-up" && (_jsx(Input, { type: "text", placeholder: "Your name", value: name, onChange: event => setName(event.target.value), disabled: isLoading })), _jsx(Input, { type: "email", placeholder: "you@example.com", value: email, onChange: event => setEmail(event.target.value), disabled: isLoading }), _jsx(Input, { type: "password", placeholder: "Password", value: password, onChange: event => setPassword(event.target.value), disabled: isLoading, onKeyDown: event => {
+                    }, className: "w-full text-center text-sm text-gray-500 hover:text-gray-700", children: "Back to sign in" })] })) : showEmailForm ? (_jsxs("div", { className: "mb-6 w-full space-y-3 px-3", children: [_jsx("p", { className: "text-center text-sm font-medium text-gray-900 dark:text-gray-100", children: mode === "sign-in" ? "Sign in with email" : "Create an account" }), mode === "sign-up" && (_jsx(Input, { type: "text", placeholder: "Your name", value: name, onChange: event => setName(event.target.value), disabled: isLoading })), _jsx(Input, { type: "email", placeholder: "you@example.com", value: email, onChange: event => setEmail(event.target.value), disabled: isLoading }), _jsx(PasswordInput, { value: password, onChange: event => setPassword(event.target.value), disabled: isLoading, onKeyDown: event => {
                         if (event.key === "Enter")
                             handleEmailSubmit();
-                    } }), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx(Button, { onClick: handleEmailSubmit, disabled: isLoading, className: "w-full", children: isLoading ? "Loading..." : mode === "sign-in" ? "Sign in" : "Sign up" }), mode === "sign-in" && (_jsx("button", { onClick: () => {
+                    }, className: "pr-11" }, mode), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx(Button, { onClick: handleEmailSubmit, disabled: isLoading, className: "w-full", children: isLoading ? "Loading..." : mode === "sign-in" ? "Sign in" : "Sign up" }), mode === "sign-in" && (_jsx("button", { onClick: () => {
                         setMode("forgot-password");
                         setError(null);
                     }, disabled: isLoading, className: "w-full text-center text-xs text-gray-500 hover:text-gray-700", children: "Forgot password?" })), _jsx("button", { onClick: () => {

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

@@ -0,0 +1,18 @@
+interface UserAvatarProps {
+    /** Direct avatar URL (IPFS or HTTP). Resolved and validated internally. */
+    avatarUrl?: string | null;
+    /** Seed for the generated fallback avatar + alt text. Use email, username, or address. */
+    name?: string;
+    /** Avatar size in pixels (square). */
+    size?: number;
+    /** Additional className for the outer container. */
+    className?: string;
+}
+/**
+ * Renders a user avatar with IPFS support and boring-avatars fallback.
+ *
+ * - If `avatarUrl` is provided and valid, renders via IPFSMediaRenderer.
+ * - On load failure or missing URL, falls back to a deterministic boring-avatars beam.
+ */
+export declare function UserAvatar({ avatarUrl, name, size, className }: UserAvatarProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { validateImageUrl } from "../../../../global-account/react/utils/profileDisplay.js";
+import { AVATAR_COLORS } from "../../../../shared/constants/index.js";
+import Avatar from "boring-avatars";
+import { useCallback, useEffect, useState } from "react";
+import { IPFSMediaRenderer } from "../IPFSMediaRenderer/IPFSMediaRenderer.js";
+/**
+ * Renders a user avatar with IPFS support and boring-avatars fallback.
+ *
+ * - If `avatarUrl` is provided and valid, renders via IPFSMediaRenderer.
+ * - On load failure or missing URL, falls back to a deterministic boring-avatars beam.
+ */
+export function UserAvatar({ avatarUrl, name = "user", size = 40, className }) {
+    const resolvedSrc = validateImageUrl(avatarUrl);
+    const [imgError, setImgError] = useState(false);
+    useEffect(() => {
+        setImgError(false);
+    }, [avatarUrl]);
+    const handleImgError = useCallback(() => setImgError(true), []);
+    return (_jsx("div", { className: className, style: { width: size, height: size, minWidth: size, minHeight: size }, children: resolvedSrc && !imgError ? (_jsx("div", { onErrorCapture: handleImgError, className: "h-full w-full overflow-hidden rounded-full", children: _jsx(IPFSMediaRenderer, { src: resolvedSrc, alt: name, className: "h-full w-full object-cover" }) })) : (_jsx(Avatar, { name: name, variant: "beam", size: size, colors: AVATAR_COLORS })) }));
+}

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

@@ -5,9 +5,11 @@ export { RelayKitProviderWrapper } from "./B3Provider/RelayKitProviderWrapper";
 export { useB3 } from "./B3Provider/useB3";
 export { useB3Account } from "./B3Provider/useB3Account";
 export { useB3Config } from "./B3Provider/useB3Config";
+export { useBetterAuthClient } from "./B3Provider/BetterAuthClientProvider";
 export { StyleRoot } from "./StyleRoot";
 export { BetterAuthResetPassword, type BetterAuthResetPasswordProps } from "./SignInWithB3/BetterAuthResetPassword";
 export { BetterAuthSignIn, type BetterAuthSignInProps } from "./SignInWithB3/BetterAuthSignIn";
+export { BetterAuthVerifyEmail, type BetterAuthVerifyEmailProps, type BetterAuthVerifyEmailState, } from "./SignInWithB3/BetterAuthVerifyEmail";
 export { AuthButton } from "./SignInWithB3/components/AuthButton";
 export { PermissionItem } from "./SignInWithB3/components/PermissionItem";
 export { WalletRow } from "./SignInWithB3/components/WalletRow";
@@ -17,6 +19,7 @@ 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 { UserAvatar } from "./UserAvatar/UserAvatar";
 export { Deposit } from "./Deposit/Deposit";
 export { Send } from "./Send/Send";
 export { IPFSMediaRenderer } from "./IPFSMediaRenderer/IPFSMediaRenderer";

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

@@ -6,10 +6,12 @@ export { RelayKitProviderWrapper } from "./B3Provider/RelayKitProviderWrapper.js
 export { useB3 } from "./B3Provider/useB3.js";
 export { useB3Account } from "./B3Provider/useB3Account.js";
 export { useB3Config } from "./B3Provider/useB3Config.js";
+export { useBetterAuthClient } from "./B3Provider/BetterAuthClientProvider.js";
 export { StyleRoot } from "./StyleRoot.js";
 // SignInWithB3 Components
 export { BetterAuthResetPassword } from "./SignInWithB3/BetterAuthResetPassword.js";
 export { BetterAuthSignIn } from "./SignInWithB3/BetterAuthSignIn.js";
+export { BetterAuthVerifyEmail, } from "./SignInWithB3/BetterAuthVerifyEmail.js";
 export { AuthButton } from "./SignInWithB3/components/AuthButton.js";
 export { PermissionItem } from "./SignInWithB3/components/PermissionItem.js";
 export { WalletRow } from "./SignInWithB3/components/WalletRow.js";
@@ -20,6 +22,8 @@ export { LoginStepContainer } from "./SignInWithB3/steps/LoginStep.js";
 export { getConnectOptionsFromStrategy, isWalletType } from "./SignInWithB3/utils/signInUtils.js";
 // ManageAccount Components
 export { ManageAccount } from "./ManageAccount/ManageAccount.js";
+// UserAvatar
+export { UserAvatar } from "./UserAvatar/UserAvatar.js";
 // Deposit Components
 export { Deposit } from "./Deposit/Deposit.js";
 // Send Components

package/dist/esm/global-account/react/hooks/useBetterAuth.d.ts

@@ -13,7 +13,7 @@ export declare class EmailVerificationRequiredError extends Error {
  */
 export declare function useBetterAuth(): {
     signInWithEmail: (email: string, password: string) => Promise<import("@feathersjs/authentication").AuthenticationResult>;
-    signUpWithEmail: (email: string, password: string, name: string) => Promise<import("@feathersjs/authentication").AuthenticationResult>;
+    signUpWithEmail: (email: string, password: string, name: string, verifyCallbackURL?: string) => Promise<import("@feathersjs/authentication").AuthenticationResult>;
     signInWithSocial: (provider: BetterAuthSocialProvider) => Promise<void>;
     requestPasswordReset: (email: string, redirectTo?: string) => Promise<{
         data: {

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

@@ -2,7 +2,7 @@ import app from "../../../global-account/app.js";
 import { useAuthStore, useB3Config } from "../../../global-account/react/index.js";
 import { debugB3React } from "../../../shared/utils/debug.js";
 import { useCallback } from "react";
-import { betterAuthClient } from "../../better-auth-client.js";
+import { useBetterAuthClient } from "../components/B3Provider/BetterAuthClientProvider.js";
 import { useUserQuery } from "./useUserQuery.js";
 const debug = debugB3React("useBetterAuth");
 /** Thrown when email verification is required before the user can sign in. */
@@ -22,6 +22,7 @@ export class EmailVerificationRequiredError extends Error {
  */
 export function useBetterAuth() {
     const { partnerId } = useB3Config();
+    const betterAuthClient = useBetterAuthClient();
     const { setUser } = useUserQuery();
     const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
     const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
@@ -64,8 +65,8 @@ export function useBetterAuth() {
             debug("Sign in failed", error);
             throw error;
         }
-    }, [exchangeForFeathersJWT, setIsAuthenticating, setHasStartedConnecting]);
-    const signUpWithEmail = useCallback(async (email, password, name) => {
+    }, [exchangeForFeathersJWT, setIsAuthenticating, setHasStartedConnecting, betterAuthClient]);
+    const signUpWithEmail = useCallback(async (email, password, name, verifyCallbackURL) => {
         debug("Signing up with email", { email, name });
         setHasStartedConnecting(true);
         setIsAuthenticating(true);
@@ -76,11 +77,12 @@ export function useBetterAuth() {
             }
             const token = result.data?.token;
             if (!token) {
-                // requireEmailVerification is enabled — send verification email
-                // with the client's origin as callbackURL so the user returns here
+                // requireEmailVerification is enabled — send verification email with
+                // a callbackURL Better Auth redirects to after server-side verify.
+                // Pass verifyCallbackURL to land on a dedicated confirmation page.
                 await betterAuthClient.sendVerificationEmail({
                     email,
-                    callbackURL: `${window.location.origin}?authStrategy=better-auth`,
+                    callbackURL: verifyCallbackURL || `${window.location.origin}?authStrategy=better-auth`,
                 });
                 throw new EmailVerificationRequiredError();
             }
@@ -91,7 +93,7 @@ export function useBetterAuth() {
             debug("Sign up failed", error);
             throw error;
         }
-    }, [exchangeForFeathersJWT, setIsAuthenticating, setHasStartedConnecting]);
+    }, [exchangeForFeathersJWT, setIsAuthenticating, setHasStartedConnecting, betterAuthClient]);
     const signInWithSocial = useCallback(async (provider) => {
         debug("Signing in with social provider", { provider });
         setHasStartedConnecting(true);
@@ -112,7 +114,7 @@ export function useBetterAuth() {
             debug("Social sign in failed", error);
             throw error;
         }
-    }, [setIsAuthenticating, setHasStartedConnecting]);
+    }, [setIsAuthenticating, setHasStartedConnecting, betterAuthClient]);
     const requestPasswordReset = useCallback(async (email, redirectTo) => {
         debug("Requesting password reset", { email });
         const result = await betterAuthClient.requestPasswordReset({
@@ -124,7 +126,7 @@ export function useBetterAuth() {
         }
         debug("Password reset email sent");
         return result;
-    }, []);
+    }, [betterAuthClient]);
     const resetPassword = useCallback(async (newPassword, token) => {
         debug("Resetting password");
         const result = await betterAuthClient.resetPassword({
@@ -136,7 +138,7 @@ export function useBetterAuth() {
         }
         debug("Password reset successful");
         return result;
-    }, []);
+    }, [betterAuthClient]);
     return {
         signInWithEmail,
         signUpWithEmail,

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

@@ -41,6 +41,8 @@ export interface SignInWithB3ModalProps extends BaseModalProps {
     source?: "signInWithB3Button" | "requestPermissions";
     /** Whether to show the signers enabled modal */
     signersEnabled?: boolean;
+    /** URL Better Auth redirects to after server-side email verification. */
+    verifyEmailRedirectTo?: string;
 }
 /**
  * Props for the Request Permissions modal
@@ -609,6 +611,8 @@ export interface AnySpendDepositModalProps extends BaseModalProps {
     actionLabel?: string;
     /** Whether to show chain selection step. Defaults to true if sourceTokenChainId is not provided */
     showChainSelection?: boolean;
+    /** Whether to show the "Fund with Fiat" option in the deposit options list. Defaults to true */
+    showFiatOption?: boolean;
     /** Minimum pool size for filtering tokens (default: 1,000,000) */
     minPoolSize?: number;
     /** Custom title for chain selection step */

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"];