@b3dotfun/sdk 0.0.8-alpha.1 → 0.0.8-alpha.3

package/dist/types/global-account/react/components/ui/TabSystem.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import React, { ReactNode } from "react";
 interface TabsRootProps {
     value: string;
     onValueChange: (value: string) => void;
@@ -18,7 +18,7 @@ interface TabTriggerProps {
     icon?: ReactNode;
     disabled?: boolean;
 }
-export declare function TabTrigger({ value, children, icon, disabled }: TabTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare const TabTrigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 interface TabsContentProps {
     value: string;
     children: ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@b3dotfun/sdk",
-  "version": "0.0.8-alpha.1",
+  "version": "0.0.8-alpha.3",
   "source": "src/index.ts",
   "main": "./dist/cjs/index.js",
   "react-native": "./dist/cjs/index.native.js",

package/src/anyspend/react/components/AnySpend.tsx

@@ -27,7 +27,7 @@ import { ArrowDown, ChevronRightCircle, ChevronsUpDown, CircleAlert, ClipboardIc
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { toast } from "sonner";
 import { parseUnits } from "viem";
-import { b3, b3Sepolia, base, mainnet, sepolia } from "viem/chains";
+import { b3Sepolia, base, mainnet, sepolia } from "viem/chains";
 import { OrderDetails, OrderDetailsLoadingView } from "./common/OrderDetails";
 import { OrderHistory } from "./common/OrderHistory";
 import { OrderStatus } from "./common/OrderStatus";
@@ -35,7 +35,6 @@ import { OrderTokenAmount } from "./common/OrderTokenAmount";
 import { PanelOnramp } from "./common/PanelOnramp";
 import { PanelOnrampPayment } from "./common/PanelOnrampPayment";
 import { TokenBalance } from "./common/TokenBalance";
-import { Warning } from "./common/Warning";
 import { EnterRecipientModal } from "./modals/EnterRecipientModal";
 
 export interface RecipientOption {

package/src/anyspend/react/components/AnySpendBondKit.tsx

@@ -155,8 +155,10 @@ export function AnySpendBondKit({
       return;
     }
 
-    // Only allow numbers and one decimal point
-    if (!/^\d*\.?\d*$/.test(value)) {
+    // Only allow valid number format (no leading zeros unless decimal)
+    if (!/^(0|[1-9]\d*)?\.?\d*$/.test(value)) {
+      setIsAmountValid(false);
+      setValidationError("Please enter a valid number");
       return;
     }
 
@@ -171,14 +173,33 @@ export function AnySpendBondKit({
       return;
     }
 
-    setEthAmount(value);
+    // Clean the input - remove leading zeros if not decimal
+    const cleanedValue = value.startsWith("0") && !value.startsWith("0.") ? value.replace(/^0+/, "0") : value;
+    setEthAmount(cleanedValue);
+
+    try {
+      const parsedAmount = parseEther(cleanedValue);
+      if (parsedAmount <= BigInt(0)) {
+        setIsAmountValid(false);
+        setValidationError("Amount must be greater than 0");
+        return;
+      }
+
+      setIsAmountValid(true);
+      setValidationError("");
+      debouncedGetQuote(cleanedValue);
+    } catch (error) {
+      console.error("Error validating amount:", error);
+      setIsAmountValid(false);
+      setValidationError("Please enter a valid amount");
+    }
   };
 
   const header = () => (
     <div className="w-full px-6 py-4">
       <div className="flex w-full flex-col items-center space-y-6">
         <h2 className="text-[28px] font-bold">
-          {tokenName} ({tokenSymbol})
+          Buy {tokenName} ({tokenSymbol})
         </h2>
         <div className="flex w-full flex-col items-center space-y-2">
           <span className="text-[28px] font-bold">{ethAmount} ETH</span>
@@ -267,7 +288,7 @@ export function AnySpendBondKit({
           >
             <div className="space-y-4">
               <div className="flex items-center justify-between">
-                <p className="text-as-primary/70 text-sm font-medium">Amount in ETH</p>
+                <p className="text-as-primary/70 text-sm font-medium">ETH Amount</p>
               </div>
 
               <div className="relative">

package/src/anyspend/react/components/AnySpendCustom.tsx

@@ -488,7 +488,7 @@ export function AnySpendCustom({
           blockExplorers: [{ name: "B3 Explorer", url: "https://explorer.b3.fun/" }],
           testnet: undefined,
         },
-        partnerId: String(process.env.NEXT_PUBLIC_GLOBAL_ACCOUNTS_PARTNER_ID),
+        partnerId: String(process.env.NEXT_PUBLIC_THIRDWEB_PARTNER_ID),
         type: "signInWithB3",
         showBackButton: false,
       });

package/src/anyspend/react/hooks/useAnyspendOrderAndTransactions.ts

@@ -1,9 +1,31 @@
 import { anyspendService } from "@b3dotfun/sdk/anyspend/services/anyspend";
 import { GetOrderAndTxsResponse } from "@b3dotfun/sdk/anyspend/types";
 import { useQuery } from "@tanstack/react-query";
-import isEqual from "lodash/isEqual.js";
 import { useCallback, useMemo } from "react";
 
+// Custom deep equality function that handles BigInt
+function customDeepEqual(oldData: any, newData: any): boolean {
+  // Handle BigInt comparison
+  if (typeof oldData === "bigint" && typeof newData === "bigint") {
+    return oldData === newData;
+  }
+
+  // Handle arrays
+  if (Array.isArray(oldData) && Array.isArray(newData)) {
+    return oldData.length === newData.length && oldData.every((item, index) => customDeepEqual(item, newData[index]));
+  }
+
+  // Handle objects
+  if (oldData && newData && typeof oldData === "object" && typeof newData === "object") {
+    const keys1 = Object.keys(oldData);
+    const keys2 = Object.keys(newData);
+    return keys1.length === keys2.length && keys1.every(key => customDeepEqual(oldData[key], newData[key]));
+  }
+
+  // Handle primitive values
+  return oldData === newData;
+}
+
 // Hook to fetch and auto-refresh order status and transaction details
 export function useAnyspendOrderAndTransactions(isMainnet: boolean, orderId: string | undefined) {
   const selectFn = useCallback((data: any) => {
@@ -13,13 +35,13 @@ export function useAnyspendOrderAndTransactions(isMainnet: boolean, orderId: str
 
   const { data, isLoading, refetch, error } = useQuery<GetOrderAndTxsResponse>({
     queryKey: ["getAnyspendOrderAndTransactions", orderId],
-    queryFn: () => anyspendService.getOrderAndTransactions(isMainnet, orderId),
-    enabled: Boolean(orderId),
+    queryFn: () => anyspendService.getOrderAndTransactions(isMainnet, orderId!),
+    enabled: !!orderId,
     refetchInterval: 3000,
     staleTime: 1000,
     select: selectFn,
     structuralSharing: (oldData, newData) => {
-      if (isEqual(oldData, newData)) return oldData;
+      if (customDeepEqual(oldData, newData)) return oldData;
       return newData;
     },
   });

package/src/anyspend/types/req-res/getOrderAndTransactions.ts

@@ -8,16 +8,19 @@ export const zGetOrderAndTransactionsRequest = z.object({
   }),
 });
 
+export const zGetOrderAndTxsResponseData = z.object({
+  order: zOrder,
+  depositTxs: z.array(zDepositTransaction).nullable(),
+  relayTx: zRelayTransaction.nullable(),
+  executeTx: zExecuteTransaction.nullable(),
+  refundTxs: z.array(zRefundTransaction).nullable(),
+});
+export type GetOrderAndTxsResponseData = z.infer<typeof zGetOrderAndTxsResponseData>;
+
 export const zGetOrderAndTxsResponse = z.object({
   success: z.boolean(),
   message: z.string(),
-  data: z.object({
-    order: zOrder,
-    depositTxs: z.array(zDepositTransaction).nullable(),
-    relayTx: zRelayTransaction.nullable(),
-    executeTx: zExecuteTransaction.nullable(),
-    refundTxs: z.array(zRefundTransaction).nullable(),
-  }),
+  data: zGetOrderAndTxsResponseData,
   statusCode: z.number(),
 });
 export type GetOrderAndTxsResponse = z.infer<typeof zGetOrderAndTxsResponse>;

package/src/global-account/react/components/SignInWithB3/SignIn.tsx

@@ -43,7 +43,7 @@ export function SignIn(props: SignInWithB3Props) {
   } = useAccountWallet();
 
   const isMobile = useIsMobile();
-  const { logout } = useAuthentication(String(process.env.NEXT_PUBLIC_GLOBAL_ACCOUNTS_PARTNER_ID));
+  const { logout } = useAuthentication(String(process.env.NEXT_PUBLIC_THIRDWEB_PARTNER_ID));
   const onDisconnect = async () => {
     await logout();
   };

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

@@ -3,6 +3,7 @@ import { useB3 } from "./B3Provider/useB3";
 
 export function StyleRoot({ children, id }: PropsWithChildren<{ id?: string }>) {
   const { theme: b3Theme } = useB3();
+
   return (
     <div className="b3-root" id={id} data-theme={b3Theme}>
       {children}

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

@@ -1,7 +1,7 @@
 "use client";
 
-import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { TransitionPanel } from "@b3dotfun/sdk/global-account/react";
+import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { AnimatePresence, motion } from "framer-motion";
 import React, { ReactNode, createContext, useContext } from "react";
 
@@ -67,39 +67,42 @@ interface TabTriggerProps {
   disabled?: boolean;
 }
 
-export function TabTrigger({ value, children, icon, disabled = false }: TabTriggerProps) {
-  const context = useContext(TabsContext);
-  if (!context) throw new Error("TabTrigger must be used within Tabs");
-
-  const { selectedTab, onTabChange } = context;
-  const isSelected = selectedTab === value;
-
-  return (
-    <button
-      role="tab"
-      aria-selected={isSelected}
-      aria-controls={`panel-${value}`}
-      id={`tab-${value}`}
-      onClick={() => onTabChange(value)}
-      className={`relative rounded-full px-4 py-2 text-sm text-white transition-all duration-200 hover:text-white focus:outline-none`}
-      disabled={disabled}
-    >
-      <span
-        className={`${isSelected ? "opacity-100" : "opacity-50"} relative z-10 flex items-center gap-2 font-semibold uppercase`}
+export const TabTrigger = React.forwardRef<HTMLButtonElement, TabTriggerProps>(
+  ({ value, children, icon, disabled = false }, ref) => {
+    const context = useContext(TabsContext);
+    if (!context) throw new Error("TabTrigger must be used within Tabs");
+
+    const { selectedTab, onTabChange } = context;
+    const isSelected = selectedTab === value;
+
+    return (
+      <button
+        ref={ref}
+        role="tab"
+        aria-selected={isSelected}
+        aria-controls={`panel-${value}`}
+        id={`tab-${value}`}
+        onClick={() => onTabChange(value)}
+        className={`relative rounded-full px-4 py-2 text-sm text-white transition-all duration-200 hover:text-white focus:outline-none`}
+        disabled={disabled}
       >
-        {children}
-        {icon}
-      </span>
-      {isSelected && (
-        <motion.span
-          layoutId="activeTab"
-          transition={{ type: "spring", duration: 0.4 }}
-          className="from-as-light-brand to-as-brand/10 border-as-brand/30 absolute inset-0 z-0 rounded-full border border-t-white/15 bg-gradient-to-b shadow-lg"
-        />
-      )}
-    </button>
-  );
-}
+        <span
+          className={`${isSelected ? "opacity-100" : "opacity-50"} relative z-10 flex items-center gap-2 font-semibold uppercase`}
+        >
+          {children}
+          {icon}
+        </span>
+        {isSelected && (
+          <motion.span
+            layoutId="activeTab"
+            transition={{ type: "spring", duration: 0.4 }}
+            className="from-as-light-brand to-as-brand/10 border-as-brand/30 absolute inset-0 z-0 rounded-full border border-t-white/15 bg-gradient-to-b shadow-lg"
+          />
+        )}
+      </button>
+    );
+  },
+);
 
 interface TabsContentProps {
   value: string;