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

package/src/global-account/react/components/ManageAccount/ManageAccount.tsx

@@ -1,6 +1,5 @@
 import {
   Button,
-  CopyToClipboard,
   ManageAccountModalProps,
   TabsContentPrimitive,
   TabsListPrimitive,
@@ -9,30 +8,26 @@ import {
   TWSignerWithMetadata,
   useAccountAssets,
   useAuthentication,
-  useB3BalanceFromAddresses,
   useGetAllTWSigners,
   useModalStore,
-  useNativeBalance,
-  useProfile,
   useRemoveSessionKey,
 } from "@b3dotfun/sdk/global-account/react";
-import { BankIcon } from "@b3dotfun/sdk/global-account/react/components/icons/BankIcon";
 import { SignOutIcon } from "@b3dotfun/sdk/global-account/react/components/icons/SignOutIcon";
-import { SwapIcon } from "@b3dotfun/sdk/global-account/react/components/icons/SwapIcon";
-import { formatUsername } from "@b3dotfun/sdk/shared/utils";
 import { formatNumber } from "@b3dotfun/sdk/shared/utils/formatNumber";
 
 import { client } from "@b3dotfun/sdk/shared/utils/thirdweb";
-import { BarChart3, Coins, Image, LinkIcon, Loader2, Pencil, Settings, Triangle, UnlinkIcon } from "lucide-react";
+import { BarChart3, Coins, Image, LinkIcon, Loader2, Settings, UnlinkIcon } from "lucide-react";
 import { useState } from "react";
 import { Chain } from "thirdweb";
 import { useActiveAccount, useProfiles, useUnlinkProfile } from "thirdweb/react";
 import { formatUnits } from "viem";
-import useFirstEOA from "../../hooks/useFirstEOA";
+
 import { getProfileDisplayInfo } from "../../utils/profileDisplay";
 import { AccountAssets } from "../AccountAssets/AccountAssets";
 import { ContentTokens } from "./ContentTokens";
 
+import { BalanceContent } from "./BalanceContent";
+
 type TabValue = "overview" | "tokens" | "nfts" | "apps" | "settings";
 
 interface ManageAccountProps {
@@ -45,11 +40,6 @@ interface ManageAccountProps {
   containerClassName?: string;
 }
 
-function centerTruncate(str: string, length = 4) {
-  if (str.length <= length * 2) return str;
-  return `${str.slice(0, length)}...${str.slice(-length)}`;
-}
-
 export function ManageAccount({
   onLogout,
   onSwap: _onSwap,
@@ -60,20 +50,12 @@ export function ManageAccount({
   const [revokingSignerId, setRevokingSignerId] = useState<string | null>(null);
   const account = useActiveAccount();
   const { data: nfts, isLoading } = useAccountAssets(account?.address);
-  const { data: b3Balance } = useB3BalanceFromAddresses(account?.address);
-  const { data: nativeBalance } = useNativeBalance(account?.address);
-  const { address: eoaAddress } = useFirstEOA();
-  const { data: profile } = useProfile({
-    address: eoaAddress || account?.address,
-    fresh: true,
-  });
-  const { data: eoaNativeBalance } = useNativeBalance(eoaAddress);
-  const { data: eoaB3Balance } = useB3BalanceFromAddresses(eoaAddress);
+
   const { data: signers, refetch: refetchSigners } = useGetAllTWSigners({
     chain,
     accountAddress: account?.address,
   });
-  const { setB3ModalOpen, setB3ModalContentType, contentType } = useModalStore();
+  const { setB3ModalOpen, contentType } = useModalStore();
   const { activeTab = "overview", setActiveTab } = contentType as ManageAccountModalProps;
   const { logout } = useAuthentication(partnerId);
   const [logoutLoading, setLogoutLoading] = useState(false);
@@ -104,266 +86,6 @@ export function ManageAccount({
     setLogoutLoading(false);
   };
 
-  const BalanceContent = () => {
-    const { info: eoaInfo } = useFirstEOA();
-
-    return (
-      <div className="flex flex-col gap-6">
-        {/* Profile Section */}
-        <div className="flex items-center justify-between">
-          <div className="flex items-center gap-4">
-            <div className="relative">
-              {profile?.avatar ? (
-                <img src={profile?.avatar} alt="Profile" className="size-24 rounded-full" />
-              ) : (
-                <div className="bg-b3-primary-wash size-24 rounded-full" />
-              )}
-              <div className="bg-b3-grey border-b3-background absolute -bottom-1 -right-1 flex size-8 items-center justify-center rounded-full border-4">
-                <Pencil size={16} className="text-b3-background" />
-              </div>
-            </div>
-            <div>
-              <h2 className="text-b3-grey text-xl font-semibold">
-                {profile?.displayName || formatUsername(profile?.name || "")}
-              </h2>
-              <div className="border-b3-line bg-b3-line/20 hover:bg-b3-line/40 flex w-fit items-center gap-2 rounded-full border px-3 py-1 transition-colors">
-                <span className="text-b3-foreground-muted font-mono text-xs">
-                  {centerTruncate(account?.address || "", 6)}
-                </span>
-                <CopyToClipboard text={account?.address || ""} />
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Quick Actions */}
-        <div className="grid grid-cols-2 gap-3">
-          <Button
-            className="manage-account-deposit bg-b3-primary-wash hover:bg-b3-primary-wash/70 h-[84px] w-full flex-col items-start gap-2 rounded-2xl"
-            onClick={() => {
-              setB3ModalOpen(true);
-              setB3ModalContentType({
-                type: "anySpend",
-                defaultActiveTab: "fiat",
-                showBackButton: true,
-              });
-            }}
-          >
-            <BankIcon size={24} className="text-b3-primary-blue shrink-0" />
-            <div className="text-b3-grey font-neue-montreal-semibold">Deposit</div>
-          </Button>
-          <Button
-            className="manage-account-swap bg-b3-primary-wash hover:bg-b3-primary-wash/70 flex h-[84px] w-full flex-col items-start gap-2 rounded-2xl"
-            onClick={() => {
-              setB3ModalOpen(true);
-              setB3ModalContentType({
-                type: "anySpend",
-                showBackButton: true,
-              });
-            }}
-          >
-            <SwapIcon size={24} className="text-b3-primary-blue" />
-            <div className="text-b3-grey font-neue-montreal-semibold">Swap</div>
-          </Button>
-        </div>
-
-        {/* Balance Section */}
-        <div className="space-y-4">
-          <h3 className="text-b3-grey font-neue-montreal-semibold">Balance</h3>
-
-          {/* B3 Balance */}
-          <div className="flex items-center justify-between">
-            <div className="flex items-center gap-3">
-              <div className="flex h-10 w-10 items-center justify-center rounded-full">
-                <img src="https://cdn.b3.fun/b3-coin-3d.png" alt="B3" className="size-10" />
-              </div>
-              <div>
-                <div className="flex items-center gap-2">
-                  <span className="text-b3-grey font-neue-montreal-semibold">B3</span>
-                </div>
-                <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">
-                  {b3Balance?.formattedTotal || "0.00"} B3
-                </div>
-              </div>
-            </div>
-            <div className="text-right">
-              <div className="text-b3-grey font-neue-montreal-semibold">
-                ${b3Balance?.balanceUsdFormatted || "0.00"}
-              </div>
-              <div className="flex items-center gap-1">
-                {b3Balance?.priceChange24h !== null && b3Balance?.priceChange24h !== undefined ? (
-                  <>
-                    <Triangle
-                      className={`size-3 ${b3Balance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}`}
-                    />
-                    <span
-                      className={`font-neue-montreal-medium text-sm ${b3Balance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`}
-                    >
-                      {b3Balance.priceChange24h >= 0 ? "+" : ""}
-                      {b3Balance.priceChange24h.toFixed(2)}%
-                    </span>
-                  </>
-                ) : (
-                  <span className="text-b3-foreground-muted font-neue-montreal-medium text-sm">--</span>
-                )}
-              </div>
-            </div>
-          </div>
-
-          {/* ETH Balance */}
-          <div className="flex items-center justify-between">
-            <div className="flex items-center gap-3">
-              <div className="flex h-10 w-10 items-center justify-center rounded-full">
-                <img src="https://cdn.b3.fun/ethereum.svg" alt="ETH" className="size-10" />
-              </div>
-              <div>
-                <div className="flex items-center gap-2">
-                  <span className="text-b3-grey font-neue-montreal-semibold">Ethereum</span>
-                </div>
-                <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">
-                  {nativeBalance?.formattedTotal || "0.00"} ETH
-                </div>
-              </div>
-            </div>
-            <div className="text-right">
-              <div className="text-b3-grey font-neue-montreal-semibold">
-                ${nativeBalance?.formattedTotalUsd || "0.00"}
-              </div>
-              <div className="flex items-center gap-2">
-                {nativeBalance?.priceChange24h !== null && nativeBalance?.priceChange24h !== undefined ? (
-                  <>
-                    <Triangle
-                      className={`size-3 ${nativeBalance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}`}
-                    />
-                    <span
-                      className={`font-neue-montreal-medium text-sm ${nativeBalance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`}
-                    >
-                      {nativeBalance.priceChange24h >= 0 ? "+" : ""}
-                      {nativeBalance.priceChange24h.toFixed(2)}%
-                    </span>
-                  </>
-                ) : (
-                  <span className="text-b3-foreground-muted font-neue-montreal-medium text-sm">--</span>
-                )}
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* EOA Account Balance Section - matching global overview styling */}
-        {eoaAddress && (
-          <div className="space-y-4">
-            <div className="flex items-center gap-3">
-              <h3 className="text-b3-grey font-neue-montreal-semibold">Connected {eoaInfo?.data?.name || "Wallet"}</h3>
-              <div className="border-b3-line bg-b3-line/20 hover:bg-b3-line/40 flex w-fit items-center gap-2 rounded-full border px-3 py-1 transition-colors">
-                <span className="text-b3-foreground-muted font-mono text-xs">{centerTruncate(eoaAddress, 6)}</span>
-                <CopyToClipboard text={eoaAddress} />
-              </div>
-            </div>
-
-            {/* EOA B3 Balance */}
-            <div className="flex items-center justify-between">
-              <div className="flex items-center gap-3">
-                <div className="flex h-10 w-10 items-center justify-center rounded-full">
-                  <img src="https://cdn.b3.fun/b3-coin-3d.png" alt="B3" className="size-10" />
-                </div>
-                <div>
-                  <div className="flex items-center gap-2">
-                    <span className="text-b3-grey font-neue-montreal-semibold">B3</span>
-                  </div>
-                  <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">
-                    {eoaB3Balance?.formattedTotal || "0.00"} B3
-                  </div>
-                </div>
-              </div>
-              <div className="text-right">
-                <div className="text-b3-grey font-neue-montreal-semibold">
-                  ${eoaB3Balance?.balanceUsdFormatted || "0.00"}
-                </div>
-                <div className="flex items-center gap-1">
-                  {eoaB3Balance?.priceChange24h !== null && eoaB3Balance?.priceChange24h !== undefined ? (
-                    <>
-                      <Triangle
-                        className={`size-3 ${eoaB3Balance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}`}
-                      />
-                      <span
-                        className={`font-neue-montreal-medium text-sm ${eoaB3Balance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`}
-                      >
-                        {eoaB3Balance.priceChange24h >= 0 ? "+" : ""}
-                        {eoaB3Balance.priceChange24h.toFixed(2)}%
-                      </span>
-                    </>
-                  ) : (
-                    <span className="text-b3-foreground-muted font-neue-montreal-medium text-sm">--</span>
-                  )}
-                </div>
-              </div>
-            </div>
-
-            {/* EOA ETH Balance */}
-            <div className="flex items-center justify-between">
-              <div className="flex items-center gap-3">
-                <div className="flex h-10 w-10 items-center justify-center rounded-full">
-                  <img src="https://cdn.b3.fun/ethereum.svg" alt="ETH" className="size-10" />
-                </div>
-                <div>
-                  <div className="flex items-center gap-2">
-                    <span className="text-b3-grey font-neue-montreal-semibold">Ethereum</span>
-                  </div>
-                  <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">
-                    {eoaNativeBalance?.formattedTotal || "0.00"} ETH
-                  </div>
-                </div>
-              </div>
-              <div className="text-right">
-                <div className="text-b3-grey font-neue-montreal-semibold">
-                  ${eoaNativeBalance?.formattedTotalUsd || "0.00"}
-                </div>
-                <div className="flex items-center gap-2">
-                  {eoaNativeBalance?.priceChange24h !== null && eoaNativeBalance?.priceChange24h !== undefined ? (
-                    <>
-                      <Triangle
-                        className={`size-3 ${eoaNativeBalance.priceChange24h >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}`}
-                      />
-                      <span
-                        className={`font-neue-montreal-medium text-sm ${eoaNativeBalance.priceChange24h >= 0 ? "text-b3-positive" : "text-b3-negative"}`}
-                      >
-                        {eoaNativeBalance.priceChange24h >= 0 ? "+" : ""}
-                        {eoaNativeBalance.priceChange24h.toFixed(2)}%
-                      </span>
-                    </>
-                  ) : (
-                    <span className="text-b3-foreground-muted font-neue-montreal-medium text-sm">--</span>
-                  )}
-                </div>
-              </div>
-            </div>
-          </div>
-        )}
-
-        {/* Global Account Info */}
-        <div className="border-b3-line flex items-center justify-between rounded-2xl border p-4">
-          <div className="">
-            <div className="flex items-center gap-2">
-              <img src="https://cdn.b3.fun/b3_logo.svg" alt="B3" className="h-4" />
-              <h3 className="font-neue-montreal-semibold text-b3-grey">Global Account</h3>
-            </div>
-
-            <p className="text-b3-foreground-muted font-neue-montreal-medium mt-2 text-sm">
-              Your universal account for all B3 apps
-            </p>
-          </div>
-          <button
-            className="text-b3-grey hover:text-b3-grey/80 hover:bg-b3-line border-b3-line flex size-12 items-center justify-center rounded-full border"
-            onClick={onLogoutEnhanced}
-          >
-            {logoutLoading ? <Loader2 className="animate-spin" /> : <SignOutIcon size={16} className="text-b3-grey" />}
-          </button>
-        </div>
-      </div>
-    );
-  };
-
   const AppsContent = () => (
     <div className="space-y-4">
       {signers?.map((signer: TWSignerWithMetadata) => (
@@ -629,7 +351,7 @@ export function ManageAccount({
           </div>
 
           <TabsContentPrimitive value="overview" className="px-4 pb-4 pt-2">
-            <BalanceContent />
+            <BalanceContent onLogout={onLogout} partnerId={partnerId} />
           </TabsContentPrimitive>
 
           <TabsContentPrimitive value="tokens" className="px-4 pb-4 pt-2">

package/src/global-account/react/components/ManageAccount/TokenBalanceRow.tsx

@@ -0,0 +1,46 @@
+import { Triangle } from "lucide-react";
+import { ReactNode } from "react";
+
+interface TokenBalanceRowProps {
+  icon: ReactNode;
+  name: string;
+  balance: string;
+  usdValue: string;
+  priceChange?: number | null;
+}
+
+export function TokenBalanceRow({ icon, name, balance, usdValue, priceChange }: TokenBalanceRowProps) {
+  return (
+    <div className="flex items-center justify-between">
+      <div className="flex items-center gap-3">
+        <div className="flex h-10 w-10 items-center justify-center rounded-full">{icon}</div>
+        <div>
+          <div className="flex items-center gap-2">
+            <span className="text-b3-grey font-neue-montreal-semibold">{name}</span>
+          </div>
+          <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">{balance}</div>
+        </div>
+      </div>
+      <div className="text-right">
+        <div className="text-b3-grey font-neue-montreal-semibold">${usdValue}</div>
+        <div className="flex items-center gap-1">
+          {priceChange !== null && priceChange !== undefined ? (
+            <>
+              <Triangle
+                className={`size-3 ${priceChange >= 0 ? "text-b3-positive fill-b3-positive" : "text-b3-negative fill-b3-negative rotate-180"}`}
+              />
+              <span
+                className={`font-neue-montreal-medium text-sm ${priceChange >= 0 ? "text-b3-positive" : "text-b3-negative"}`}
+              >
+                {priceChange >= 0 ? "+" : ""}
+                {priceChange.toFixed(2)}%
+              </span>
+            </>
+          ) : (
+            <span className="text-b3-foreground-muted font-neue-montreal-medium text-sm">--</span>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}

package/src/global-account/react/components/TokenIcon.tsx

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

package/src/global-account/react/components/ui/accordion.tsx

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

package/src/global-account/react/components/ui/dialog.tsx

@@ -64,7 +64,7 @@ const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.
             {!hideCloseButton && (
               <DialogPrimitive.Close
                 className={cn(
-                  "data-[state=open]:bg-b3-react-background data-[state=open]:text-b3-react-muted-foreground absolute right-2 top-2 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none dark:data-[state=open]:bg-gray-800 dark:data-[state=open]:text-gray-400",
+                  "modal-close-button data-[state=open]:bg-b3-react-background data-[state=open]:text-b3-react-muted-foreground absolute right-2 top-2 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none dark:data-[state=open]:bg-gray-800 dark:data-[state=open]:text-gray-400",
                   closeBtnClassName,
                 )}
               >

package/src/global-account/react/hooks/useB3BalanceFromAddresses.ts

@@ -46,7 +46,7 @@ async function fetchB3Balances(addresses: string[]): Promise<{
     const balances = await Promise.all(
       addresses.map(async address => {
         const balance = await client.readContract({
-          address: B3_TOKEN.address,
+          address: B3_TOKEN.address as `0x${string}`,
           abi,
           functionName: "balanceOf",
           args: [address as `0x${string}`],

package/src/global-account/react/hooks/useUnifiedChainSwitchAndExecute.ts

@@ -9,6 +9,7 @@ import { prepareTransaction, sendTransaction as twSendTransaction } from "thirdw
 import { useSwitchChain, useWalletClient } from "wagmi";
 import { useB3 } from "../components";
 import { useAccountWallet } from "./useAccountWallet";
+import { isAddress } from "viem";
 
 export interface UnifiedTransactionParams {
   to: string;
@@ -56,6 +57,8 @@ export function useUnifiedChainSwitchAndExecute() {
           throw new Error(`Chain ${targetChainId} is not supported`);
         }
 
+        invariant(isAddress(params.to), "params.to is not a valid address");
+
         const hash = await walletClient.sendTransaction({
           account: signer,
           chain: targetChain,

package/src/global-account/utils/analytics.ts

@@ -1,3 +1,13 @@
+// Global window interface augmentations for B3 SDK
+
+declare global {
+  interface Window {
+    // Google Analytics 4
+    gtag: (...args: any[]) => void;
+    dataLayer: any[];
+  }
+}
+
 const GA4_MEASUREMENT_ID = "G-VER9DKJH87";
 
 /**

package/dist/cjs/index.js

@@ -1,2 +0,0 @@
-"use strict";
-//

package/dist/esm/index.js

@@ -1,2 +0,0 @@
-"use strict";
-//

package/src/index.ts

@@ -1 +0,0 @@
-//