@b3dotfun/sdk 0.0.7-alpha.2 → 0.0.7-alpha.21

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, CopyToClipboard, useAccountAssets, useAuthentication, useB3BalanceFromAddresses, useGetAllTWSigners, useNativeBalance, useRemoveSessionKey, useModalStore, TabsPrimitive, TabsContentPrimitive, TabsListPrimitive, TabTriggerPrimitive } from "../../../../global-account/react/index.js";
+import { Button, CopyToClipboard, useAccountAssets, useAuthentication, useB3BalanceFromAddresses, useGetAllTWSigners, useNativeBalance, useRemoveSessionKey, useModalStore, TabsPrimitive, TabsContentPrimitive, TabsListPrimitive, TabTriggerPrimitive, } from "../../../../global-account/react/index.js";
 import { formatAddress } from "../../../../shared/utils/formatAddress.js";
 import { formatNumber } from "../../../../shared/utils/formatNumber.js";
 import { ArrowRightLeft } from "lucide-react";
@@ -12,7 +12,7 @@ function centerTruncate(str, length = 4) {
         return str;
     return `${str.slice(0, length)}...${str.slice(-length)}`;
 }
-export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit, chain, partnerId }) {
+export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit, chain, partnerId, }) {
     const [activeTab, setActiveTab] = useState("balance");
     const [revokingSignerId, setRevokingSignerId] = useState(null);
     const account = useActiveAccount();
@@ -21,7 +21,7 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
     const { data: nativeBalance } = useNativeBalance(account?.address);
     const { data: signers, refetch: refetchSigners } = useGetAllTWSigners({
         chain,
-        accountAddress: account?.address
+        accountAddress: account?.address,
     });
     const { setB3ModalOpen, setB3ModalContentType } = useModalStore();
     const { logout } = useAuthentication(partnerId);
@@ -37,7 +37,7 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
             console.error("Error revoking access:", error);
             setRevokingSignerId(null);
         },
-        refetchSigners: () => refetchSigners()
+        refetchSigners: () => refetchSigners(),
     });
     const handleRevoke = async (signer) => {
         setRevokingSignerId(signer.id);
@@ -55,13 +55,13 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
                             setB3ModalContentType({
                                 type: "anySpend",
                                 defaultActiveTab: "fiat",
-                                showBackButton: true
+                                showBackButton: true,
                             });
                         }, children: "Deposit" }), _jsxs(Button, { variant: "default", className: "font-neue-montreal-medium flex-1", onClick: () => {
                             setB3ModalOpen(true);
                             setB3ModalContentType({
                                 type: "anySpend",
-                                showBackButton: true
+                                showBackButton: true,
                             });
                         }, children: [_jsx(ArrowRightLeft, { className: "mr-2 h-4 w-4" }), "Swap"] })] })] }));
     const AssetsContent = () => (_jsx("div", { className: "bg-b3-react-card border-b3-react-border rounded-lg border p-4", children: _jsx(AccountAssets, { nfts: assets?.nftResponse, isLoading: isLoading }) }));

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

@@ -13,5 +13,5 @@ interface MintButtonProps {
     onSuccess?: (tx: `0x${string}`) => void;
     onError?: (error: Error) => void;
 }
-export declare function MintButton({ contractAddress, quantity, chain, account, to, tokenId, className, children, onSuccess, onError }: MintButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function MintButton({ contractAddress, quantity, chain, account, to, tokenId, className, children, onSuccess, onError, }: MintButtonProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -3,7 +3,7 @@ import { Button, useClaim } from "../../../../global-account/react/index.js";
 import { client } from "../../../../shared/utils/thirdweb.js";
 import { useActiveAccount } from "thirdweb/react";
 import { smartWallet } from "thirdweb/wallets";
-export function MintButton({ contractAddress, quantity = 1, chain, account, to, tokenId, className, children = "Mint", onSuccess, onError }) {
+export function MintButton({ contractAddress, quantity = 1, chain, account, to, tokenId, className, children = "Mint", onSuccess, onError, }) {
     const ecoSystemWallet = useActiveAccount();
     console.log("@@ecoSystemWallet", ecoSystemWallet);
     const { claim, isMinting } = useClaim({
@@ -11,7 +11,7 @@ export function MintButton({ contractAddress, quantity = 1, chain, account, to,
         quantity,
         chain,
         to,
-        tokenId
+        tokenId,
     });
     const smartAccountWithSignerOverride = ecoSystemWallet?.address !== to;
     const handleMint = async () => {
@@ -21,12 +21,12 @@ export function MintButton({ contractAddress, quantity = 1, chain, account, to,
                     chain,
                     sponsorGas: true,
                     overrides: {
-                        accountAddress: ecoSystemWallet?.address
-                    }
+                        accountAddress: ecoSystemWallet?.address,
+                    },
                 });
                 const smartAccountWithSigner = await wallet.connect({
                     client,
-                    personalAccount: account
+                    personalAccount: account,
                 });
                 const tx = await claim(smartAccountWithSigner);
                 onSuccess?.(tx);

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

@@ -16,11 +16,11 @@ export function RelayKitProviderWrapper({ isMainnet, children }) {
             source: "anyspend",
             duneConfig: {
                 apiKey: "OkvN2bWlBPwXkvtmnTeYMQR1hYZBGDJt",
-                apiBaseUrl: "https://api.dune.com"
+                apiBaseUrl: "https://api.dune.com",
             },
             chains: relayChains,
             privateChainIds: undefined,
             appName: "AnySpend",
-            useGasFeeEstimations: true
+            useGasFeeEstimations: true,
         }, children: _jsx(_Fragment, { children: children }) }));
 }

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

@@ -3,4 +3,4 @@ import { RequestPermissionsModalProps } from "../../../../global-account/react";
  * Component for requesting permissions to access user accounts and contracts
  * Allows users to approve session keys with specific permission settings
  */
-export declare function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddress, permissions }: RequestPermissionsModalProps): import("react/jsx-runtime").JSX.Element;
+export declare function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddress, permissions, }: RequestPermissionsModalProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, useB3, useAddTWSessionKey, useGetAllTWSigners } from "../../../../global-account/react/index.js";
+import { Button, useB3, useAddTWSessionKey, useGetAllTWSigners, } from "../../../../global-account/react/index.js";
 import { PermissionItem } from "../../../../global-account/react/index.js";
 import { debugB3React } from "../../../../shared/utils/debug.js";
 import { formatAddress } from "../../../../shared/utils/formatAddress.js";
@@ -12,14 +12,14 @@ const debug = debugB3React("RequestPermissions");
  * Component for requesting permissions to access user accounts and contracts
  * Allows users to approve session keys with specific permission settings
  */
-export function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddress, permissions }) {
+export function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddress, permissions, }) {
     const [isApproving, setIsApproving] = useState(false);
     const account = useActiveAccount();
     const { defaultPermissions } = useB3();
     const DEFAULT_PERMISSIONS = useMemo(() => permissions ?? defaultPermissions, [defaultPermissions, permissions]);
     const { refetch: refetchSigners } = useGetAllTWSigners({
         chain,
-        accountAddress: account?.address
+        accountAddress: account?.address,
     });
     const { newSessionKey } = useAddTWSessionKey({
         onSuccess: transactionResult => {
@@ -33,7 +33,7 @@ export function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddres
         refetchSigners: () => {
             return refetchSigners();
         },
-        chain
+        chain,
     });
     const handleApprove = useCallback(async () => {
         debug("@@handleApprove");
@@ -48,7 +48,7 @@ export function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddres
                 approvedTargets: DEFAULT_PERMISSIONS.approvedTargets,
                 nativeTokenLimitPerTransaction: DEFAULT_PERMISSIONS.nativeTokenLimitPerTransaction,
                 permissionStartTimestamp: DEFAULT_PERMISSIONS.startDate,
-                permissionEndTimestamp: DEFAULT_PERMISSIONS.endDate
+                permissionEndTimestamp: DEFAULT_PERMISSIONS.endDate,
             });
         }
         catch (error) {
@@ -62,7 +62,7 @@ export function RequestPermissions({ onSuccess, onError, chain, sessionKeyAddres
     const formatDate = (date) => {
         return new Intl.DateTimeFormat("en-US", {
             dateStyle: "medium",
-            timeStyle: "short"
+            timeStyle: "short",
         }).format(date);
     };
     return (_jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "text-center", children: [_jsx("h2", { className: "mb-2 text-2xl font-bold", children: "Allow Access" }), _jsx("p", { className: "text-b3-react-muted-foreground opacity-70", children: "This app would like permission to:" })] }), _jsx(PermissionItem, { title: "Make transactions on your behalf", description: _jsxs("span", { children: ["Up to", " ", _jsxs("span", { className: "text-b3-react-primary font-medium", children: [DEFAULT_PERMISSIONS.nativeTokenLimitPerTransaction, " ETH"] }), " ", "per transaction"] }), icon: _jsx(CreditCard, { className: "h-5 w-5" }) }), _jsx(PermissionItem, { title: "View your account", description: "See your wallet address and balance", icon: _jsx(Eye, { className: "h-5 w-5" }) }), _jsxs("div", { className: "bg-b3-react-card rounded-lg border p-5 py-4", children: [_jsx("h3", { className: "mb-2 text-base font-medium", children: "Approved Contracts" }), _jsx("div", { className: "space-y-2", children: DEFAULT_PERMISSIONS.approvedTargets.map((target) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "bg-b3-react-background text-b3-react-muted-foreground rounded-md border px-3 py-2 font-mono text-sm", children: formatAddress(target) }), _jsx("span", { className: "text-b3-react-muted-foreground text-sm", children: "\u2022 Game Contract" })] }, target))) })] }), _jsxs("div", { className: "bg-b3-react-card rounded-lg border p-5 py-4", children: [_jsx("h3", { className: "mb-2 text-base font-medium", children: "Permission" }), _jsxs("div", { className: "space-y-1 text-sm", children: [_jsxs("div", { className: "text-b3-react-muted-foreground", children: [_jsx("span", { children: `Valid for ` }), _jsx("span", { children: _jsx(TimeAgo, { date: DEFAULT_PERMISSIONS.endDate, live: false, formatter: (value, unit) => {

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

@@ -7,5 +7,5 @@ type RequestPermissionsButtonProps = {
     permissions?: PermissionsConfig;
     closeOnSuccess?: boolean;
 };
-export declare function RequestPermissionsButton({ chain, sessionKeyAddress, onSuccess, onError, permissions, closeOnSuccess }: RequestPermissionsButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function RequestPermissionsButton({ chain, sessionKeyAddress, onSuccess, onError, permissions, closeOnSuccess, }: RequestPermissionsButtonProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/global-account/react/components/RequestPermissions/RequestPermissionsButton.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button, useModalStore } from "../../../../global-account/react/index.js";
-export function RequestPermissionsButton({ chain, sessionKeyAddress, onSuccess, onError, permissions, closeOnSuccess = true }) {
+export function RequestPermissionsButton({ chain, sessionKeyAddress, onSuccess, onError, permissions, closeOnSuccess = true, }) {
     const { setB3ModalOpen, setB3ModalContentType } = useModalStore();
     const handleClick = () => {
         setB3ModalContentType({
@@ -14,7 +14,7 @@ export function RequestPermissionsButton({ chain, sessionKeyAddress, onSuccess,
                 }
             },
             onError,
-            permissions
+            permissions,
         });
         setB3ModalOpen(true);
     };

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

@@ -0,0 +1,14 @@
+import { SignInWithB3ModalProps } from "../../../../global-account/react";
+import { ReactNode } from "react";
+type SignInProps = {
+    className?: string;
+    isMobile?: boolean;
+};
+type SignInWithB3Props = Omit<SignInWithB3ModalProps, "type" | "showBackButton"> & {
+    buttonText?: string | ReactNode;
+    loggedInButtonText?: string | ReactNode;
+    loadingButtonText?: string | ReactNode;
+    withLogo?: boolean;
+} & SignInProps;
+export declare function SignIn(props: SignInWithB3Props): import("react/jsx-runtime").JSX.Element;
+export default SignIn;

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

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { SignInWithB3, StyleRoot, useAccountWallet, useAuthentication, useB3, 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, useWalletInfo } from "thirdweb/react";
+import { ManageAccountButton } from "../custom/ManageAccountButton.js";
+export function SignIn(props) {
+    const { className } = props;
+    const { automaticallySetFirstEoa } = useB3();
+    const { wallet, address: globalAddress, ensName, connectedSmartWallet, connectedEOAWallet, isActiveSmartWallet, isActiveEOAWallet, smartWalletIcon, eoaWalletIcon, } = useAccountWallet();
+    const isMobile = useIsMobile();
+    const { logout } = useAuthentication(String(process.env.NEXT_PUBLIC_GLOBAL_ACCOUNTS_PARTNER_ID));
+    const onDisconnect = async () => {
+        await logout();
+    };
+    const connectedWallets = useConnectedWallets();
+    const { data: walletInfo } = useWalletInfo(isActiveSmartWallet ? connectedSmartWallet?.id : connectedEOAWallet?.id);
+    const setActiveWallet = useSetActiveWallet();
+    const handleSetActiveAccount = (selectedWalletId) => {
+        if (!selectedWalletId ||
+            !connectedWallets ||
+            !connectedEOAWallet ||
+            !connectedSmartWallet ||
+            !automaticallySetFirstEoa)
+            return;
+        setActiveWallet(selectedWalletId === ecosystemWalletId ? connectedSmartWallet : connectedEOAWallet);
+    };
+    // Automatically set EOA wallet as active when available
+    useEffect(() => {
+        if (connectedEOAWallet && automaticallySetFirstEoa) {
+            setActiveWallet(connectedEOAWallet);
+        }
+    }, [connectedEOAWallet, isActiveEOAWallet, setActiveWallet, automaticallySetFirstEoa]);
+    // 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-theme-on-surface-2 group flex h-10 items-center gap-1 rounded-xl px-3", children: [!!wallet.meta?.icon && (_jsx("img", { src: wallet.meta.icon, alt: wallet.meta.icon, className: "bg-theme-primary h-6 w-6 rounded-full object-cover opacity-100" })), _jsx("div", { className: "text-body-1m text-theme-secondary", 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 shadow-depth-1 absolute -right-4 top-full min-w-64 rounded-2xl border 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", "hover:bg-theme-on-surface-2"), onClick: () => handleSetActiveAccount(connectedEOAWallet?.id), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("img", { className: "bg-theme-primary h-16 w-16 rounded-full opacity-100", src: eoaWalletIcon, alt: connectedEOAWallet?.id }), _jsxs("div", { className: "ml-4 grow", children: [ensName && _jsx("div", { className: "text-title-1s", children: ensName }), _jsx("div", { className: "text-title-1s", children: truncateAddress(globalAddress) }), _jsx("div", { className: "text-body-1m text-theme-secondary", children: walletInfo?.name })] })] }), isActiveEOAWallet && _jsx(Icon, { className: "fill-theme-primary", name: "check" })] })) : (connectedSmartWallet && (_jsxs("div", { className: cn("mb-2 flex cursor-pointer items-center justify-between rounded-xl p-3", isActiveSmartWallet ? "bg-theme-n-8" : "bg-b3-react-background hover:bg-theme-on-surface-2"), onClick: () => handleSetActiveAccount(connectedSmartWallet?.id), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("img", { className: "bg-theme-primary h-16 w-16 rounded-full opacity-100", src: smartWalletIcon, alt: connectedSmartWallet?.id }), _jsxs("div", { className: "pl-4.5 grow", children: [ensName && _jsx("div", { className: "text-title-1s", children: ensName }), _jsx("div", { className: "text-title-1s", children: truncateAddress(globalAddress) }), _jsx("div", { className: "text-body-1m text-theme-secondary", children: "Smart wallet" })] })] }), isActiveSmartWallet && _jsx(Icon, { className: "fill-theme-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-theme-on-surface-2 group flex h-12 items-center rounded-xl px-4 transition-colors", children: [_jsx(Icon, { className: "fill-theme-secondary group-hover:fill-theme-primary mr-4 shrink-0 transition-colors", name: "logout" }), _jsx("div", { className: "text-base-1s text-theme-secondary group-hover:text-theme-primary mr-auto transition-colors", children: "Disconnect" })] }) })] }) }) })] })) : (_jsx(SignInWithB3, { closeAfterLogin: true, onLoginSuccess: async (globalAccount) => {
+                    console.log("User authenticated with Global Account!", globalAccount);
+                }, ...props })) }) }));
+}
+export default SignIn;

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

@@ -1,10 +1,9 @@
 import { SignInWithB3ModalProps } from "../../../../global-account/react";
 import { ReactNode } from "react";
-type SignInWithB3Props = Omit<SignInWithB3ModalProps, "type" | "showBackButton"> & {
+export type SignInWithB3Props = Omit<SignInWithB3ModalProps, "type" | "showBackButton"> & {
     buttonText?: string | ReactNode;
     loggedInButtonText?: string | ReactNode;
     loadingButtonText?: string | ReactNode;
     withLogo?: boolean;
 };
 export declare function SignInWithB3(props: SignInWithB3Props): import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useAuthentication } from "../../../../global-account/react/index.js";
-import { Button, StyleRoot, useModalStore } from "../../../../global-account/react/index.js";
+import { Button, StyleRoot, useAuthentication, useIsMobile, useModalStore, } from "../../../../global-account/react/index.js";
 import { useEffect } from "react";
 import { useActiveAccount } from "thirdweb/react";
+import { ManageAccountButton } from "../custom/ManageAccountButton.js";
+import { Loading } from "../ui/Loading.js";
 export function SignInWithB3(props) {
     const { setB3ModalOpen, setB3ModalContentType, setEcoSystemAccountAddress } = useModalStore();
     const account = useActiveAccount();
     const { isAuthenticating, isAuthenticated } = useAuthentication(props.partnerId, props.loginWithSiwe);
+    const isMobile = useIsMobile();
     useEffect(() => {
         if (account) {
             setEcoSystemAccountAddress(account.address);
@@ -16,22 +18,15 @@ export function SignInWithB3(props) {
         setB3ModalContentType({
             ...props,
             type: "signInWithB3",
-            showBackButton: false
-        });
-        setB3ModalOpen(true);
-    };
-    const handleClickManageAccount = () => {
-        setB3ModalContentType({
-            ...props,
-            type: "manageAccount"
+            showBackButton: false,
         });
         setB3ModalOpen(true);
     };
     if (isAuthenticated) {
-        return (_jsx(StyleRoot, { children: _jsxs(Button, { onClick: handleClickManageAccount, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loggedInButtonText || "Manage Account"] }) }));
+        return _jsx(ManageAccountButton, { ...props });
     }
     if (isAuthenticating) {
-        return (_jsx(StyleRoot, { children: _jsxs(Button, { disabled: true, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loadingButtonText || "Signing in..."] }) }));
+        return (_jsx(StyleRoot, { children: _jsxs(Button, { disabled: true, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loadingButtonText || (isMobile ? _jsx(Loading, { size: "sm" }) : "Signing in…")] }) }));
     }
-    return (_jsx(StyleRoot, { children: _jsx(Button, { onClick: handleClick, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 font-medium text-white", children: props.buttonText ? (props.buttonText) : (_jsxs(_Fragment, { children: [_jsx("span", { children: "Sign in with" }), props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-6" }))] })) }) }));
+    return (_jsx(StyleRoot, { children: _jsx(Button, { onClick: handleClick, style: { backgroundColor: "#3368ef" }, className: "b3-sign-in-button flex items-center gap-2 font-medium text-white", children: props.buttonText ? (props.buttonText) : (_jsxs(_Fragment, { children: [_jsx("span", { children: "Sign in with" }), props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-6" }))] })) }) }));
 }

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, loginWithSiwe, source, signersEnabled }: SignInWithB3ModalProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin, loginWithSiwe, source, signersEnabled, }: SignInWithB3ModalProps): import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useB3, Loading, useGetAllTWSigners, useSiwe, useModalStore } from "../../../../global-account/react/index.js";
+import { useB3, Loading, useGetAllTWSigners, useSiwe, useModalStore, } from "../../../../global-account/react/index.js";
 import { debugB3React } from "../../../../shared/utils/debug.js";
 import { useCallback, useEffect, useState } from "react";
 import { useActiveAccount } from "thirdweb/react";
@@ -12,7 +12,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, loginWithSiwe = false, source = "signInWithB3Button", signersEnabled = false }) {
+export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin = false, loginWithSiwe = false, source = "signInWithB3Button", signersEnabled = false, }) {
     const { setUser, automaticallySetFirstEoa } = useB3();
     const [step, setStep] = useState(source === "requestPermissions" ? null : "login");
     const [sessionKeyAdded, setSessionKeyAdded] = useState(source === "requestPermissions" ? true : false);
@@ -21,12 +21,12 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
     const [loginComplete, setLoginComplete] = useState(source === "requestPermissions" ? true : false);
     const [refetchCount, setRefetchCount] = useState(0);
     const [refetchError, setRefetchError] = useState(null);
-    const { data: signers, refetch: refetchSigners, isFetching: isFetchingSigners } = useGetAllTWSigners({
+    const { data: signers, refetch: refetchSigners, isFetching: isFetchingSigners, } = useGetAllTWSigners({
         chain,
         accountAddress: account?.address,
         queryOptions: {
-            enabled: signersEnabled
-        }
+            enabled: signersEnabled,
+        },
     });
     const { authenticate } = useSiwe();
     const [authenticatingWithB3, setAuthenticatingWithB3] = useState(false);
@@ -57,7 +57,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
         debug("@@SignInWithB3Flow:useEffect", {
             loginComplete,
             isFetchingSigners,
-            source
+            source,
         });
         if (loginComplete && !isFetchingSigners) {
             // Check if we already have a signer for this partner
@@ -72,7 +72,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
                     setB3ModalContentType({
                         type: "manageAccount",
                         chain,
-                        partnerId
+                        partnerId,
                     });
                 }
             }
@@ -92,7 +92,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
             setB3ModalContentType({
                 type: "manageAccount",
                 chain,
-                partnerId
+                partnerId,
             });
         }
     }, [
@@ -107,7 +107,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
         chain,
         onSessionKeySuccess,
         setB3ModalOpen,
-        signersEnabled
+        signersEnabled,
     ]);
     debug("render", {
         step,
@@ -115,7 +115,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
         account,
         signers,
         refetchCount,
-        refetchError
+        refetchError,
     });
     // Keep this effect for handling closeAfterLogin when adding new session keys
     useEffect(() => {
@@ -136,7 +136,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
             partnerId,
             closeAfterLogin,
             loginWithSiwe,
-            source: "requestPermissions"
+            source: "requestPermissions",
         });
     }, [
         chain,
@@ -148,7 +148,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
         partnerId,
         sessionKeyAddress,
         setB3ModalContentType,
-        strategies
+        strategies,
     ]);
     const handleLoginSuccess = useCallback(async (account) => {
         debug("Authenticating with B3 via SIWE");
@@ -169,7 +169,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
                 chain,
                 sessionKeyAddress,
                 onSuccess: onSessionKeySuccessEnhanced,
-                onError
+                onError,
             });
         }
     }, [chain, onError, onSessionKeySuccessEnhanced, sessionKeyAddress, setB3ModalContentType, step]);

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Loading, useAuthentication, useHandleConnectWithPrivy, useAuthStore } from "../../../../global-account/react/index.js";
+import { Loading, useAuthentication, useHandleConnectWithPrivy, useAuthStore, } from "../../../../global-account/react/index.js";
 import { debugB3React } from "../../../../shared/utils/debug.js";
 import { useEffect } from "react";
 const debug = debugB3React("SignInWithB3Privy");
@@ -10,7 +10,7 @@ export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
     const { logout } = useAuthentication(partnerId);
     debug("@@SignInWithB3Privy", {
         isLoading,
-        fullToken
+        fullToken,
     });
     useEffect(() => {
         async function autoConnect() {

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

@@ -1,4 +1,4 @@
-export declare function AuthButton({ strategy, onClick, isLoading }: {
+export declare function AuthButton({ strategy, onClick, isLoading, }: {
     strategy: string;
     onClick: () => void;
     isLoading: boolean;

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from "../../custom/Button.js";
 import { strategyIcons } from "../utils/signInUtils.js";
-export function AuthButton({ strategy, onClick, isLoading }) {
+export function AuthButton({ strategy, onClick, isLoading, }) {
     return (_jsx(Button, { onClick: onClick, disabled: isLoading, className: "flex w-full items-center justify-center bg-gray-100 px-2 py-3 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700", children: _jsx("img", { src: strategyIcons[strategy], className: "h-9 w-9" }) }, strategy));
 }

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

@@ -1,5 +1,5 @@
 import { WalletId } from "thirdweb/wallets";
-export declare function WalletRow({ walletId, onClick, isLoading }: {
+export declare function WalletRow({ walletId, onClick, isLoading, }: {
     walletId: WalletId;
     onClick: () => void;
     isLoading: boolean;

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { WalletIcon, WalletName, WalletProvider } from "thirdweb/react";
 import { Button } from "../../custom/Button.js";
-export function WalletRow({ walletId, onClick, isLoading }) {
+export function WalletRow({ walletId, onClick, isLoading, }) {
     return (_jsx(WalletProvider, { id: walletId, children: _jsxs(Button, { onClick: onClick, disabled: isLoading, className: "flex w-full items-center justify-normal gap-3 rounded-lg border border-gray-200 bg-transparent px-4 py-3 text-gray-900 hover:bg-gray-100 dark:border-gray-700 dark:text-gray-100 dark:hover:bg-gray-800", children: [_jsx(WalletIcon, { className: "h-12 w-12", loadingComponent: _jsx("div", { className: "h-8 w-8 animate-pulse rounded-full bg-gray-200 dark:bg-gray-700" }) }), _jsx(WalletName, { className: "font-bold text-gray-900 dark:text-gray-100", loadingComponent: _jsx("div", { className: "h-4 w-24 animate-pulse rounded bg-gray-200 dark:bg-gray-700" }) })] }) }, walletId));
 }

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

@@ -8,15 +8,15 @@ export function LoginStepContainer({ children, partnerId }) {
     const { data: partner } = useQueryB3("global-accounts-partners", "find", {
         query: {
             partnerId,
-            $limit: 1
-        }
+            $limit: 1,
+        },
     }, !!partnerId);
     const partnerLogo = partner?.data?.[0]?.loginCustomization?.logoUrl;
     return (_jsxs("div", { className: "flex flex-col items-center justify-center py-6", children: [partnerLogo && _jsx("img", { src: partnerLogo, alt: "Partner Logo", className: "mb-4 h-12 w-auto object-contain" }), children, _jsxs("h2", { className: "mt-3 flex items-center gap-2 text-lg font-bold", children: ["Powered by", _jsx("img", { alt: "B3 Logo", className: "h-5", src: "https://cdn.b3.fun/b3_logo.svg" }), "Connect"] })] }));
 }
 export function LoginStep({ onSuccess, onError, partnerId, chain }) {
     const wallet = ecosystemWallet(ecosystemWalletId, {
-        partnerId: partnerId
+        partnerId: partnerId,
     });
     const { theme } = useB3();
     const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
@@ -25,17 +25,17 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
     return (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx(ConnectEmbed, { showThirdwebBranding: false, client: client, chain: chain, wallets: [wallet], theme: theme === "light"
                 ? lightTheme({
                     colors: {
-                        modalBg: "hsl(var(--b3-react-background))"
-                    }
+                        modalBg: "hsl(var(--b3-react-background))",
+                    },
                 })
                 : darkTheme({
                     colors: {
-                        modalBg: "hsl(var(--b3-react-background))"
-                    }
+                        modalBg: "hsl(var(--b3-react-background))",
+                    },
                 }), autoConnect: true, style: {
                 width: "100%",
                 height: "100%",
-                border: 0
+                border: 0,
             }, 
             // TODO: Integrate with SIWE in useSIWE
             // auth={{
@@ -56,7 +56,7 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
             // }}
             header: {
                 title: "Sign in with B3",
-                titleIcon: "https://cdn.b3.fun/b3_logo.svg"
+                titleIcon: "https://cdn.b3.fun/b3_logo.svg",
             }, onConnect: async (wallet) => {
                 try {
                     setIsAuthenticating(true);

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

@@ -10,5 +10,5 @@ interface LoginStepCustomProps {
     strategies: AllowedStrategy[];
     maxInitialWallets?: number;
 }
-export declare function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, maxInitialWallets, automaticallySetFirstEoa }: LoginStepCustomProps): import("react/jsx-runtime").JSX.Element;
+export declare function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, maxInitialWallets, automaticallySetFirstEoa, }: LoginStepCustomProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, AuthButton, WalletRow, useAuthentication, useConnect, LoginStepContainer, useAuthStore, getConnectOptionsFromStrategy, isWalletType } from "../../../../../global-account/react/index.js";
+import { Button, AuthButton, WalletRow, useAuthentication, useConnect, LoginStepContainer, useAuthStore, getConnectOptionsFromStrategy, isWalletType, } from "../../../../../global-account/react/index.js";
 import { client } from "../../../../../shared/utils/thirdweb.js";
 import { useState } from "react";
 import { useConnect as useConnectTW } from "thirdweb/react";
 import { createWallet } from "thirdweb/wallets";
-export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, maxInitialWallets = 2, automaticallySetFirstEoa }) {
+export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, maxInitialWallets = 2, automaticallySetFirstEoa, }) {
     const [isLoading, setIsLoading] = useState(false);
     const [showAllWallets, setShowAllWallets] = useState(false);
     const { connect } = useConnect(partnerId, chain);
@@ -30,7 +30,7 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
                 connectResult = await connectTW(async () => {
                     const wallet = createWallet(options.wallet?.id);
                     await wallet.connect({
-                        client
+                        client,
                     });
                     return wallet;
                 });

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

@@ -15,7 +15,7 @@ export const allowedStrategies = [
     "com.coinbase.wallet",
     // Custom strategies
     // TODO: Audit we don't use "privy" directly anymore
-    ...customStrategies
+    ...customStrategies,
 ];
 export function isWalletType(strategy) {
     // Check if it's a known wallet ID pattern (com.*, io.*, etc.)
@@ -42,7 +42,7 @@ export const strategyIcons = {
     x: "https://cdn.b3.fun/x.svg?1",
     discord: "https://cdn.b3.fun/discord.svg",
     apple: "https://cdn.b3.fun/apple.svg",
-    guest: "https://cdn.b3.fun/incognito.svg"
+    guest: "https://cdn.b3.fun/incognito.svg",
     // Add more strategies as needed
 };
 // Test it

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

@@ -2,6 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useB3 } from "./B3Provider/useB3.js";
 export function StyleRoot({ children, id }) {
     const { theme: b3Theme } = useB3();
-    // eslint-disable-next-line tailwindcss/no-custom-classname
     return (_jsx("div", { className: "b3-root", id: id, "data-theme": b3Theme, children: children }));
 }

package/dist/esm/global-account/react/components/Transak/TransakModal.js

@@ -27,7 +27,7 @@ export function TransakModal() {
             exchangeScreenTitle: "Buy ETH on B3",
             isFeeCalculationHidden: true,
             cryptoCurrencyCode: "ETH",
-            network: "b3"
+            network: "b3",
         };
     }, [environment]);
     const { ready } = useB3();
@@ -47,7 +47,7 @@ export function TransakModal() {
             defaultCryptoAmount,
             disableWalletAddressForm: !!destinationWalletAddress || !!account?.address, // Only disable the form if we have an address
             fiatAmount: fiatAmount,
-            countryCode: countryCode
+            countryCode: countryCode,
         };
         const transak = new Transak(config);
         try {
@@ -92,13 +92,13 @@ export function TransakModal() {
         onSuccess,
         fiatAmount,
         transakConfig,
-        countryCode
+        countryCode,
     ]);
     return (_jsxs(_Fragment, { children: [isLoading && (_jsxs("div", { className: "flex h-full min-h-[650px] flex-col items-center justify-center gap-4", children: [_jsx(Loader2, { className: "h-24 w-24 animate-spin opacity-10" }), _jsx(TextShimmer, { children: "Powering up our credit card processor..." })] })), _jsx("div", { id: "transakMount", style: {
                     display: isLoading ? "none" : "block",
                     width: "100%",
                     height: "650px",
                     borderRadius: "25px",
-                    overflow: "hidden"
+                    overflow: "hidden",
                 } })] }));
 }