@b3dotfun/sdk 0.0.87 → 0.0.88-alpha.1

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

@@ -90,6 +90,7 @@ const ANYSPEND_RECIPIENTS_KEY = "anyspend_recipients";
 export function AnySpend(props: {
   mode?: "page" | "modal";
   defaultActiveTab?: "crypto" | "fiat";
+  sourceChainId?: number;
   destinationTokenAddress?: string;
   destinationTokenChainId?: number;
   recipientAddress?: string;
@@ -102,6 +103,10 @@ export function AnySpend(props: {
   onTokenSelect?: (token: components["schemas"]["Token"], event: { preventDefault: () => void }) => void;
   onSuccess?: (txHash?: string) => void;
   customUsdInputValues?: string[];
+  hideHeader?: boolean;
+  hideBottomNavigation?: boolean;
+  /** When true, disables URL parameter management for swap configuration */
+  disableUrlParamManagement?: boolean;
 }) {
   const fingerprintConfig = getFingerprintConfig();
 
@@ -113,6 +118,7 @@ export function AnySpend(props: {
 }
 
 function AnySpendInner({
+  sourceChainId,
   destinationTokenAddress,
   destinationTokenChainId,
   mode = "modal",
@@ -123,7 +129,11 @@ function AnySpendInner({
   onTokenSelect,
   onSuccess,
   customUsdInputValues,
+  hideHeader,
+  hideBottomNavigation = false,
+  disableUrlParamManagement = false,
 }: {
+  sourceChainId?: number;
   destinationTokenAddress?: string;
   destinationTokenChainId?: number;
   mode?: "page" | "modal";
@@ -134,6 +144,9 @@ function AnySpendInner({
   onTokenSelect?: (token: components["schemas"]["Token"], event: { preventDefault: () => void }) => void;
   onSuccess?: (txHash?: string) => void;
   customUsdInputValues?: string[];
+  hideHeader?: boolean;
+  hideBottomNavigation?: boolean;
+  disableUrlParamManagement?: boolean;
 }) {
   const searchParams = useSearchParamsSSR();
   const router = useRouter();
@@ -211,7 +224,7 @@ function AnySpendInner({
   // const recipientInputRef = useRef<HTMLInputElement>(null);
 
   // Get initial chain IDs from URL or defaults
-  const initialSrcChainId = parseInt(searchParams.get("fromChainId") || "0") || mainnet.id;
+  const initialSrcChainId = sourceChainId || parseInt(searchParams.get("fromChainId") || "0") || mainnet.id;
   const initialDstChainId =
     parseInt(searchParams.get("toChainId") || "0") || (isBuyMode ? destinationTokenChainId : base.id);
 
@@ -323,8 +336,8 @@ function AnySpendInner({
 
   // Load swap configuration from URL on initial render
   useEffect(() => {
-    // Skip if we've already processed the URL or if we have an order to load
-    if (initialUrlProcessed.current || loadOrder) return;
+    // Skip if we've already processed the URL, if we have an order to load, or if URL param management is disabled
+    if (initialUrlProcessed.current || loadOrder || disableUrlParamManagement) return;
 
     try {
       const tabParam = searchParams.get("tab");
@@ -357,7 +370,7 @@ function AnySpendInner({
 
     // Mark that we've processed the initial URL
     initialUrlProcessed.current = true;
-  }, [searchParams, loadOrder]);
+  }, [searchParams, loadOrder, disableUrlParamManagement]);
 
   // Update URL when swap configuration changes - but not on initial load
   const updateSwapParamsInURL = useCallback(() => {
@@ -370,7 +383,8 @@ function AnySpendInner({
       activePanel !== PanelView.MAIN ||
       !initialUrlProcessed.current ||
       searchParams.has("orderId") ||
-      mode === "modal"
+      mode === "modal" ||
+      disableUrlParamManagement
     )
       return;
 
@@ -441,6 +455,7 @@ function AnySpendInner({
     dstAmount,
     router,
     srcAmountOnRamp,
+    disableUrlParamManagement,
   ]);
 
   // Update URL when relevant state changes - but only after initial render
@@ -650,20 +665,20 @@ function AnySpendInner({
       // setNewRecipientAddress("");
       navigateToPanel(PanelView.ORDER_DETAILS, "forward");
 
-      // Debug: Check payment method before setting URL
-      console.log("Creating order - selectedCryptoPaymentMethod:", selectedCryptoPaymentMethod);
+      if (!disableUrlParamManagement) {
+        // Debug: Check payment method before setting URL
+        console.log("Creating order - selectedCryptoPaymentMethod:", selectedCryptoPaymentMethod);
 
-      // Add orderId and payment method to URL for persistence
-      const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
-      params.set("orderId", orderId);
-      if (effectiveCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
-        console.log("Setting cryptoPaymentMethod in URL:", effectiveCryptoPaymentMethod);
-        params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
-      } else {
-        console.log("Payment method is NONE, not setting in URL");
+        // Add orderId and payment method to URL for persistence
+        const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
+        params.set("orderId", orderId);
+        if (effectiveCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+          params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
+        } else {
+          console.log("Payment method is NONE, not setting in URL");
+        }
+        router.push(`${window.location.pathname}?${params.toString()}`);
       }
-      console.log("Final URL params:", params.toString());
-      router.push(`${window.location.pathname}?${params.toString()}`);
     },
     onError: error => {
       console.error(error);
@@ -678,11 +693,13 @@ function AnySpendInner({
       setOrderId(orderId);
       navigateToPanel(PanelView.ORDER_DETAILS, "forward");
 
-      // Add orderId and payment method to URL for persistence
-      const params = new URLSearchParams(searchParams.toString());
-      params.set("orderId", orderId);
-      params.set("paymentMethod", "fiat");
-      router.push(`${window.location.pathname}?${params.toString()}`);
+      if (!disableUrlParamManagement) {
+        // Add orderId and payment method to URL for persistence
+        const params = new URLSearchParams(searchParams.toString());
+        params.set("orderId", orderId);
+        params.set("paymentMethod", "fiat");
+        router.push(`${window.location.pathname}?${params.toString()}`);
+      }
     },
     onError: error => {
       console.error(error);
@@ -831,11 +848,13 @@ function AnySpendInner({
       type: "anySpendOrderHistory",
       showBackButton: false,
     });
-    // Remove orderId and paymentMethod from URL when going back to history
-    const params = new URLSearchParams(searchParams.toString());
-    params.delete("orderId");
-    params.delete("paymentMethod");
-    router.push(`${window.location.pathname}?${params.toString()}`);
+    if (!disableUrlParamManagement) {
+      // Remove orderId and paymentMethod from URL when going back to history
+      const params = new URLSearchParams(searchParams.toString());
+      params.delete("orderId");
+      params.delete("paymentMethod");
+      router.push(`${window.location.pathname}?${params.toString()}`);
+    }
   };
 
   // Handle crypto swap creation
@@ -952,23 +971,25 @@ function AnySpendInner({
 
   // Update useEffect for URL parameter to not override loadOrder
   useEffect(() => {
-    if (loadOrder) return; // Skip if we have a loadOrder
+    if (loadOrder || disableUrlParamManagement) return; // Skip if we have a loadOrder or URL param management is disabled
 
     const orderIdParam = searchParams.get("orderId");
     if (orderIdParam) {
       setOrderId(orderIdParam);
       setActivePanel(PanelView.ORDER_DETAILS);
     }
-  }, [searchParams, loadOrder]);
+  }, [searchParams, loadOrder, disableUrlParamManagement]);
 
   const onSelectOrder = (selectedOrderId: string) => {
     setOrderId(selectedOrderId);
     navigateToPanel(PanelView.ORDER_DETAILS, "forward");
-    // Update URL with the new orderId and preserve existing parameters
-    const params = new URLSearchParams(searchParams.toString());
-    params.set("orderId", selectedOrderId);
-    // Keep existing paymentMethod if present
-    router.push(`${window.location.pathname}?${params.toString()}`);
+    if (!disableUrlParamManagement) {
+      // Update URL with the new orderId and preserve existing parameters
+      const params = new URLSearchParams(searchParams.toString());
+      params.set("orderId", selectedOrderId);
+      // Keep existing paymentMethod if present
+      router.push(`${window.location.pathname}?${params.toString()}`);
+    }
   };
 
   // Save custom recipients to local storage when they change
@@ -1056,7 +1077,7 @@ function AnySpendInner({
     <div className={"mx-auto flex w-[460px] max-w-full flex-col items-center gap-2 pt-5"}>
       <div className={"flex w-full max-w-full flex-col items-center gap-2 px-5"}>
         {/* Token Header - Show when in buy mode */}
-        {isBuyMode && (
+        {isBuyMode && !hideHeader && (
           <div className="mb-4 flex flex-col items-center gap-3 text-center">
             {selectedDstToken.metadata?.logoURI && (
               <div className="relative">
@@ -1141,47 +1162,44 @@ function AnySpendInner({
           )}
 
           {/* Reverse swap direction section */}
-          <Button
-            variant="ghost"
-            className={cn(
-              "border-as-stroke bg-as-surface-primary absolute left-1/2 top-1/2 z-10 h-10 w-10 -translate-x-1/2 -translate-y-1/2 rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl",
-              isBuyMode && "top-[calc(50%+56px)] cursor-default",
-              activeTab === "fiat" && "hidden",
-              selectedDstChainId === HYPERLIQUID_CHAIN_ID && "cursor-not-allowed opacity-50",
-            )}
-            onClick={() => {
-              if (activeTab === "fiat" || isBuyMode) {
-                return;
-              }
-
-              // Prevent swapping if destination is Hyperliquid (only supported as destination, not source)
-              if (selectedDstChainId === HYPERLIQUID_CHAIN_ID) {
-                return;
-              }
-
-              // Swap chain selections
-              const tempSrcChainId = selectedSrcChainId;
-              const tempDstChainId = selectedDstChainId;
-              setSelectedSrcChainId(tempDstChainId);
-              setSelectedDstChainId(tempSrcChainId);
-
-              // Swap token selections
-              const tempSrcToken = selectedSrcToken;
-              const tempDstToken = selectedDstToken;
-              setSelectedSrcToken(tempDstToken);
-              setSelectedDstToken(tempSrcToken);
-
-              // Swap amounts
-              const tempSrcAmount = srcAmount;
-              const tempDstAmount = dstAmount;
-              setSrcAmount(tempDstAmount);
-              setDstAmount(tempSrcAmount);
-            }}
-          >
-            <div className="relative flex items-center justify-center transition-opacity">
-              <ArrowDown className="text-as-primary/50 h-5 w-5" />
+          {activeTab === "crypto" && (
+            <div className="z-10 -my-6 flex justify-center">
+              <Button
+                variant="ghost"
+                className={cn(
+                  "border-as-stroke bg-as-surface-primary h-10 w-10 rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl",
+                  isBuyMode && "cursor-default",
+                  selectedDstChainId === HYPERLIQUID_CHAIN_ID && "cursor-not-allowed opacity-50",
+                )}
+                onClick={() => {
+                  if (isBuyMode) {
+                    return;
+                  }
+
+                  // Prevent swapping if destination is Hyperliquid (only supported as destination, not source)
+                  if (selectedDstChainId === HYPERLIQUID_CHAIN_ID) {
+                    return;
+                  }
+
+                  // Swap chain selections
+                  setSelectedSrcChainId(selectedDstChainId);
+                  setSelectedDstChainId(selectedSrcChainId);
+
+                  // Swap token selections
+                  setSelectedSrcToken(selectedDstToken);
+                  setSelectedDstToken(selectedSrcToken);
+
+                  // Swap amounts
+                  setSrcAmount(dstAmount);
+                  setDstAmount(srcAmount);
+                }}
+              >
+                <div className="relative flex items-center justify-center transition-opacity">
+                  <ArrowDown className="text-as-primary/50 h-5 w-5" />
+                </div>
+              </Button>
             </div>
-          </Button>
+          )}
 
           {/* Receive section - Hidden when fiat tab is active */}
           {/* Receive section - Hidden when fiat tab is active */}
@@ -1262,7 +1280,7 @@ function AnySpendInner({
             }
           }}
         >
-          {mode !== "page" && <BottomNavigation />}
+          {mode !== "page" && !hideBottomNavigation && <BottomNavigation />}
         </TabsPrimitive>
       </div>
     </div>
@@ -1284,16 +1302,18 @@ function AnySpendInner({
       onOrderCreated={orderId => {
         setOrderId(orderId);
         navigateToPanel(PanelView.ORDER_DETAILS, "forward");
-        // Add orderId and payment method to URL for persistence
-        const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
-        params.set("orderId", orderId);
-        // For fiat payments, the payment method is always fiat (but we use the active tab context)
-        if (activeTab === "fiat") {
-          params.set("paymentMethod", "fiat");
-        } else if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
-          params.set("paymentMethod", selectedCryptoPaymentMethod);
+        if (!disableUrlParamManagement) {
+          // Add orderId and payment method to URL for persistence
+          const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
+          params.set("orderId", orderId);
+          // For fiat payments, the payment method is always fiat (but we use the active tab context)
+          if (activeTab === "fiat") {
+            params.set("paymentMethod", "fiat");
+          } else if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+            params.set("paymentMethod", selectedCryptoPaymentMethod);
+          }
+          router.push(`${window.location.pathname}?${params.toString()}`);
         }
-        router.push(`${window.location.pathname}?${params.toString()}`);
       }}
       onBack={navigateBack}
       recipientEnsName={globalWallet?.ensName}

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

@@ -336,8 +336,6 @@ function AnySpendCustomInner({
     }
   }, [srcChainId, tokenList, getTokenWithBalance, nativeTokens, fungibleTokens, dirtySelectSrcToken, dstToken.address]);
 
-  // const { account: isAuthenticated } = useB3();
-
   const getRelayQuoteRequest = useMemo(() => {
     return generateGetRelayQuoteRequest({
       orderType: orderType,

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

@@ -57,7 +57,7 @@ export interface AnySpendCustomExactInProps {
   customUsdInputValues?: string[];
   preferEoa?: boolean;
   customExactInConfig?: CustomExactInConfig;
-  orderType?: "hype_duel" | "custom_exact_in";
+  orderType?: "hype_duel" | "custom_exact_in" | "swap";
   minDestinationAmount?: number;
   header?: ({
     anyspendPrice,
@@ -147,7 +147,6 @@ function AnySpendCustomExactInInner({
     paymentType,
     recipientAddress,
     loadOrder,
-    isDepositMode: true,
     onTransactionSuccess: onSuccess,
     sourceTokenAddress,
     sourceTokenChainId,
@@ -314,7 +313,7 @@ function AnySpendCustomExactInInner({
   );
 
   const mainView = (
-    <div className="mx-auto flex w-[460px] max-w-full flex-col items-center gap-2">
+    <div className="anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2">
       {headerContent}
 
       <div className="relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2">