@b3dotfun/sdk 0.0.88-alpha.7 → 0.0.88-alpha.9

package/dist/esm/anyspend/index.js

@@ -1,5 +1,6 @@
 // Types
 export * from "./types/api.js";
+export * from "./types/gas.js";
 // Utils
 export * from "./utils/address.js";
 export * from "./utils/chain.js";
@@ -11,6 +12,8 @@ export * from "./utils/token.js";
 export * from "./utils/validation.js";
 // Constants
 export * from "./constants/index.js";
+// Services
+export * from "./services/gas.js";
 // Abis
 export * from "./abis/abiUsdcBase.js";
 export * from "./abis/erc20Staking.js";

package/dist/esm/anyspend/react/components/AnySpend.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { eqci, getDefaultToken, getHyperliquidUSDCToken, HYPERLIQUID_CHAIN_ID, HYPERLIQUID_USDC_ADDRESS, USDC_BASE, ZERO_ADDRESS, } from "../../../anyspend/index.js";
-import { useAnyspendCreateOnrampOrder, useAnyspendCreateOrder, useAnyspendOrderAndTransactions, useAnyspendQuote, useGeoOnrampOptions, } from "../../../anyspend/react/index.js";
+import { useAnyspendCreateOnrampOrder, useAnyspendCreateOrder, useAnyspendOrderAndTransactions, useAnyspendQuote, useGasPrice, useGeoOnrampOptions, } from "../../../anyspend/react/index.js";
 import { Button, ShinyButton, StyleRoot, TabsPrimitive, toast, TransitionPanel, useAccountWallet, useB3Config, useModalStore, useProfile, useRouter, useSearchParamsSSR, useTokenBalanceDirect, useTokenData, useTokenFromUrl, } from "../../../global-account/react/index.js";
 import BottomNavigation from "../../../global-account/react/components/ManageAccount/BottomNavigation.js";
 import { useAccountWalletImage } from "../../../global-account/react/hooks/useAccountWallet.js";
@@ -24,6 +24,7 @@ import { CryptoPaySection } from "./common/CryptoPaySection.js";
 import { CryptoReceiveSection } from "./common/CryptoReceiveSection.js";
 import { FeeDetailPanel } from "./common/FeeDetailPanel.js";
 import { FiatPaymentMethod, FiatPaymentMethodComponent } from "./common/FiatPaymentMethod.js";
+import { GasIndicator } from "./common/GasIndicator.js";
 import { OrderDetails, OrderDetailsLoadingView } from "./common/OrderDetails.js";
 import { OrderHistory } from "./common/OrderHistory.js";
 import { PanelOnramp } from "./common/PanelOnramp.js";
@@ -365,6 +366,8 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
     });
     // Get geo-based onramp options for fiat payments
     const { geoData, coinbaseAvailablePaymentMethods, stripeOnrampSupport, stripeWeb2Support } = useGeoOnrampOptions(srcAmountOnRamp);
+    // Get gas price for source chain (where the user pays from)
+    const { gasPrice: gasPriceData, isLoading: isLoadingGas } = useGasPrice(selectedSrcChainId);
     // Helper function to map payment method to onramp vendor
     const getOnrampVendor = (paymentMethod) => {
         switch (paymentMethod) {
@@ -853,7 +856,7 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
                                     }, children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) })), activeTab === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: isBuyMode, effectiveRecipientAddress: effectiveRecipientAddress, recipientName: recipientName || undefined, customRecipientLabel: customRecipientLabel, onSelectRecipient: () => navigateToPanel(PanelView.RECIPIENT_SELECTION, "forward"), dstAmount: dstAmount, dstToken: selectedDstToken, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: setSelectedDstChainId, setSelectedDstToken: setSelectedDstToken, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
                                     setIsSrcInputDirty(false);
                                     setDstAmount(value);
-                                }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => navigateToPanel(PanelView.POINTS_DETAIL, "forward"), onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward") }))] }), _jsxs(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: cn("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: [_jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: cn("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: _jsxs("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && _jsx(Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }), !hideTransactionHistoryButton && (globalAddress || effectiveRecipientAddress) ? (_jsxs(Button, { variant: "link", onClick: onClickHistory, className: "text-as-primary/50 hover:text-as-primary flex items-center gap-1 transition-colors", children: [_jsx(HistoryIcon, { className: "h-4 w-4" }), " ", _jsx("span", { className: "pr-4", children: "Transaction History" })] })) : null] })] }), _jsx("div", { className: "w-full", children: _jsx(TabsPrimitive, { defaultValue: "swap", onValueChange: value => {
+                                }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => navigateToPanel(PanelView.POINTS_DETAIL, "forward"), onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward") }))] }), gasPriceData && !isLoadingGas && activeTab === "crypto" && (_jsx(GasIndicator, { gasPrice: gasPriceData, className: "mt-2 w-full" })), _jsxs(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: cn("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: [_jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: cn("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: _jsxs("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && _jsx(Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }), !hideTransactionHistoryButton && (globalAddress || effectiveRecipientAddress) ? (_jsxs(Button, { variant: "link", onClick: onClickHistory, className: "text-as-primary/50 hover:text-as-primary flex items-center gap-1 transition-colors", children: [_jsx(HistoryIcon, { className: "h-4 w-4" }), " ", _jsx("span", { className: "pr-4", children: "Transaction History" })] })) : null] })] }), _jsx("div", { className: "w-full", children: _jsx(TabsPrimitive, { defaultValue: "swap", onValueChange: value => {
                         if (value === "settings" || value === "home") {
                             setB3ModalContentType({
                                 type: "manageAccount",

package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useGasPrice } from "../../../anyspend/react/index.js";
 import { normalizeAddress } from "../../../anyspend/utils/index.js";
 import { Button, ShinyButton, StyleRoot, toast, TransitionPanel, useAccountWallet, } from "../../../global-account/react/index.js";
 import { cn } from "../../../shared/utils/cn.js";
@@ -16,6 +17,7 @@ import { CryptoPaymentMethod, CryptoPaymentMethodType } from "./common/CryptoPay
 import { CryptoReceiveSection } from "./common/CryptoReceiveSection.js";
 import { FeeDetailPanel } from "./common/FeeDetailPanel.js";
 import { FiatPaymentMethod, FiatPaymentMethodComponent } from "./common/FiatPaymentMethod.js";
+import { GasIndicator } from "./common/GasIndicator.js";
 import { OrderDetails } from "./common/OrderDetails.js";
 import { PanelOnramp } from "./common/PanelOnramp.js";
 import { PointsDetailPanel } from "./common/PointsDetailPanel.js";
@@ -46,6 +48,8 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
     });
     const { connectedEOAWallet } = useAccountWallet();
     const setActiveWallet = useSetActiveWallet();
+    // Get gas price for source chain (where the user pays from)
+    const { gasPrice: gasPriceData, isLoading: isLoadingGas } = useGasPrice(selectedSrcChainId);
     const appliedPreferEoa = useRef(false);
     useEffect(() => {
         if (preferEoa && !appliedPreferEoa.current) {
@@ -178,7 +182,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
     const mainView = (_jsxs("div", { className: "anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: selectedRecipientOrDefault, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues, customRecipientLabel: customRecipientLabel }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: cn("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, effectiveRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, customRecipientLabel: customRecipientLabel, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: selectedDstToken, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: DESTINATION_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
                                 setIsSrcInputDirty(false);
                                 setSrcAmount(value);
-                            }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL) }))] }) }), _jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: cn("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: cn("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: _jsxs("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && _jsx(Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }) }), mainFooter ? mainFooter : null] }));
+                            }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL) }))] }) }), _jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: cn("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: cn("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: _jsxs("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && _jsx(Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }) }), gasPriceData && !isLoadingGas && paymentType === "crypto" && (_jsx(GasIndicator, { gasPrice: gasPriceData, className: "mt-2 w-full" })), mainFooter ? mainFooter : null] }));
     const handleCryptoOrder = async () => {
         try {
             invariant(anyspendQuote, "Relay price is not found");

package/dist/esm/anyspend/react/components/common/GasIndicator.d.ts

@@ -0,0 +1,6 @@
+import type { GasPriceData } from "../../../types/gas";
+export interface GasIndicatorProps {
+    gasPrice: GasPriceData;
+    className?: string;
+}
+export declare function GasIndicator({ gasPrice, className }: GasIndicatorProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/anyspend/react/components/common/GasIndicator.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../../../../shared/utils/cn.js";
+import { motion } from "motion/react";
+const LEVEL_LABELS = {
+    low: "Low",
+    normal: "Normal",
+    elevated: "Elevated",
+    high: "High",
+    spike: "Spike",
+};
+const LEVEL_STYLES = {
+    low: "bg-green-500/20 text-green-500",
+    normal: "bg-as-surface-tertiary text-as-secondary",
+    elevated: "bg-yellow-500/20 text-yellow-600",
+    high: "bg-orange-500/20 text-orange-500",
+    spike: "bg-red-500/20 text-red-500",
+};
+function formatGasPrice(gweiString) {
+    const gwei = parseFloat(gweiString);
+    if (gwei < 0.001)
+        return "<0.001";
+    if (gwei < 1)
+        return gwei.toFixed(3);
+    if (gwei < 10)
+        return gwei.toFixed(2);
+    return gwei.toFixed(1);
+}
+export function GasIndicator({ gasPrice, className }) {
+    return (_jsxs(motion.div, { initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.2 }, className: cn("flex items-center justify-between rounded-lg px-3 py-2", gasPrice.isSpike ? "bg-yellow-500/10" : "bg-as-surface-secondary", className), children: [_jsx("div", { className: "flex items-center gap-2", children: _jsxs("span", { className: "text-as-secondary text-xs", children: ["Gas on ", gasPrice.chainName] }) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: cn("rounded px-1.5 py-0.5 text-xs font-medium", LEVEL_STYLES[gasPrice.level]), children: LEVEL_LABELS[gasPrice.level] }), _jsxs("span", { className: "text-as-primary text-xs font-medium", children: [formatGasPrice(gasPrice.gasPriceGwei), " Gwei"] })] })] }));
+}

package/dist/esm/anyspend/react/hooks/index.d.ts

@@ -7,6 +7,7 @@ export * from "./useAnyspendQuote";
 export * from "./useAnyspendTokens";
 export * from "./useCoinbaseOnrampOptions";
 export * from "./useConnectedUserProfile";
+export * from "./useGasPrice";
 export * from "./useGeoOnrampOptions";
 export * from "./useGetGeo";
 export * from "./useHyperliquidTransfer";

package/dist/esm/anyspend/react/hooks/index.js

@@ -7,6 +7,7 @@ export * from "./useAnyspendQuote.js";
 export * from "./useAnyspendTokens.js";
 export * from "./useCoinbaseOnrampOptions.js";
 export * from "./useConnectedUserProfile.js";
+export * from "./useGasPrice.js";
 export * from "./useGeoOnrampOptions.js";
 export * from "./useGetGeo.js";
 export * from "./useHyperliquidTransfer.js";

package/dist/esm/anyspend/react/hooks/useGasPrice.d.ts

@@ -0,0 +1,37 @@
+import type { GasPriceData } from "../../types/gas";
+export interface UseGasPriceOptions {
+    /** Refetch interval in ms (default: 10000 = 10s) */
+    refetchInterval?: number;
+    /** Whether to enable the query (default: true if chainId is supported) */
+    enabled?: boolean;
+}
+export interface UseGasPriceResult {
+    /** Gas price data */
+    gasPrice: GasPriceData | undefined;
+    /** Whether the query is loading */
+    isLoading: boolean;
+    /** Whether there's an error */
+    isError: boolean;
+    /** Error object if any */
+    error: Error | null;
+    /** Whether gas is currently spiking */
+    isSpike: boolean;
+    /** Refetch function */
+    refetch: () => void;
+}
+/**
+ * React hook to fetch current gas price for a chain.
+ *
+ * @param chainId - The chain ID to fetch gas price for
+ * @param options - Optional configuration
+ *
+ * @example
+ * ```tsx
+ * const { gasPrice, isSpike, isLoading } = useGasPrice(8453); // Base
+ *
+ * if (isSpike) {
+ *   return <Warning>Gas prices are high: {gasPrice?.recommendation}</Warning>;
+ * }
+ * ```
+ */
+export declare function useGasPrice(chainId: number | undefined, options?: UseGasPriceOptions): UseGasPriceResult;

package/dist/esm/anyspend/react/hooks/useGasPrice.js

@@ -0,0 +1,40 @@
+import { useQuery } from "@tanstack/react-query";
+import { useMemo } from "react";
+import { gasService, isGasOracleSupported } from "../../services/gas.js";
+/**
+ * React hook to fetch current gas price for a chain.
+ *
+ * @param chainId - The chain ID to fetch gas price for
+ * @param options - Optional configuration
+ *
+ * @example
+ * ```tsx
+ * const { gasPrice, isSpike, isLoading } = useGasPrice(8453); // Base
+ *
+ * if (isSpike) {
+ *   return <Warning>Gas prices are high: {gasPrice?.recommendation}</Warning>;
+ * }
+ * ```
+ */
+export function useGasPrice(chainId, options = {}) {
+    const { refetchInterval = 10000, enabled } = options;
+    const isSupported = chainId !== undefined && isGasOracleSupported(chainId);
+    const queryEnabled = enabled ?? isSupported;
+    const { data, isLoading, isError, error, refetch } = useQuery({
+        queryKey: ["gasPrice", chainId],
+        queryFn: () => gasService.fetch(chainId),
+        enabled: queryEnabled && chainId !== undefined,
+        refetchInterval,
+        staleTime: 5000, // Consider data fresh for 5s
+        retry: 2,
+        refetchOnWindowFocus: true,
+    });
+    return useMemo(() => ({
+        gasPrice: data,
+        isLoading,
+        isError,
+        error: error,
+        isSpike: data?.isSpike ?? false,
+        refetch,
+    }), [data, isLoading, isError, error, refetch]);
+}

package/dist/esm/anyspend/services/gas.d.ts

@@ -0,0 +1,21 @@
+import type { GasOracleResponse, GasPriceData } from "../types/gas";
+/** Supported chain IDs for gas oracle */
+export declare const GAS_ORACLE_SUPPORTED_CHAINS: readonly [1, 137, 42161, 8453, 56, 10, 43114, 8333, 2741, 4689, 3338, 1329];
+export type GasOracleSupportedChainId = (typeof GAS_ORACLE_SUPPORTED_CHAINS)[number];
+/** Check if a chain is supported by the gas oracle */
+export declare function isGasOracleSupported(chainId: number): chainId is GasOracleSupportedChainId;
+/** Fetch gas price data from the gas oracle */
+export declare function fetchGasPrice(chainId: number): Promise<GasOracleResponse>;
+/** Transform raw oracle response to simplified UI data */
+export declare function toGasPriceData(response: GasOracleResponse): GasPriceData;
+/** Gas service for fetching and transforming gas data */
+export declare const gasService: {
+    /** Fetch raw gas oracle response */
+    fetchRaw: typeof fetchGasPrice;
+    /** Fetch and transform to UI-friendly format */
+    fetch: (chainId: number) => Promise<GasPriceData>;
+    /** Check if chain is supported */
+    isSupported: typeof isGasOracleSupported;
+    /** List of supported chain IDs */
+    supportedChains: readonly [1, 137, 42161, 8453, 56, 10, 43114, 8333, 2741, 4689, 3338, 1329];
+};

package/dist/esm/anyspend/services/gas.js

@@ -0,0 +1,59 @@
+import { GAS_ORACLE_BASE_URL } from "../constants/index.js";
+/** Supported chain IDs for gas oracle */
+export const GAS_ORACLE_SUPPORTED_CHAINS = [
+    1, // Ethereum
+    137, // Polygon
+    42161, // Arbitrum
+    8453, // Base
+    56, // BSC
+    10, // Optimism
+    43114, // Avalanche
+    8333, // B3
+    2741, // Abstract
+    4689, // IoTeX
+    3338, // Peaq
+    1329, // Sei
+];
+/** Check if a chain is supported by the gas oracle */
+export function isGasOracleSupported(chainId) {
+    return GAS_ORACLE_SUPPORTED_CHAINS.includes(chainId);
+}
+/** Fetch gas price data from the gas oracle */
+export async function fetchGasPrice(chainId) {
+    const response = await fetch(`${GAS_ORACLE_BASE_URL}/gas/${chainId}`);
+    if (!response.ok) {
+        throw new Error(`Failed to fetch gas price for chain ${chainId}: ${response.status}`);
+    }
+    return response.json();
+}
+/** Transform raw oracle response to simplified UI data */
+export function toGasPriceData(response) {
+    const { analysis } = response;
+    const isSpike = analysis.level === "elevated" || analysis.level === "high" || analysis.level === "spike";
+    return {
+        chainId: response.chainId,
+        chainName: response.chainName,
+        gasPriceGwei: response.gasPrice.standard,
+        baseFeeGwei: response.eip1559?.baseFee,
+        level: analysis.level,
+        isSpike,
+        recommendation: analysis.recommendation,
+        vsMedian: analysis.vs1h, // Use 1h as primary comparison
+        source: response.source,
+        timestamp: response.timestamp,
+    };
+}
+/** Gas service for fetching and transforming gas data */
+export const gasService = {
+    /** Fetch raw gas oracle response */
+    fetchRaw: fetchGasPrice,
+    /** Fetch and transform to UI-friendly format */
+    fetch: async (chainId) => {
+        const response = await fetchGasPrice(chainId);
+        return toGasPriceData(response);
+    },
+    /** Check if chain is supported */
+    isSupported: isGasOracleSupported,
+    /** List of supported chain IDs */
+    supportedChains: GAS_ORACLE_SUPPORTED_CHAINS,
+};

package/dist/esm/anyspend/types/gas.d.ts

@@ -0,0 +1,61 @@
+/** Gas level classification based on historical percentiles */
+export type GasLevel = "low" | "normal" | "elevated" | "high" | "spike";
+/** Gas prices in Gwei for different speed tiers */
+export interface GasPrices {
+    low: string;
+    standard: string;
+    fast: string;
+    instant?: string;
+}
+/** EIP-1559 specific gas data */
+export interface Eip1559Data {
+    baseFee: string;
+    maxPriorityFee: GasPrices;
+    maxFee: GasPrices;
+}
+/** Spike analysis comparing current gas to historical data */
+export interface GasSpikeAnalysis {
+    level: GasLevel;
+    percentile: number;
+    /** Ratio to 1h median (primary spike detection) */
+    vs1h: number;
+    /** Ratio to 4h median (short-term context) */
+    vs4h: number;
+    /** Ratio to 24h median (daily context) */
+    vs24h: number;
+    recommendation: string;
+}
+/** Full gas response from the gas oracle */
+export interface GasOracleResponse {
+    chainId: number;
+    chainName: string;
+    timestamp: string;
+    blockNumber?: number;
+    source: "blocknative" | "rpc";
+    gasPrice: GasPrices;
+    eip1559?: Eip1559Data;
+    analysis: GasSpikeAnalysis;
+    cached: boolean;
+    cacheAge?: number;
+}
+/** Simplified gas data for UI display */
+export interface GasPriceData {
+    chainId: number;
+    chainName: string;
+    /** Standard gas price in Gwei */
+    gasPriceGwei: string;
+    /** Base fee in Gwei (EIP-1559 chains) */
+    baseFeeGwei?: string;
+    /** Gas level classification */
+    level: GasLevel;
+    /** Whether gas is currently spiking (elevated, high, or spike) */
+    isSpike: boolean;
+    /** Human-readable recommendation */
+    recommendation: string;
+    /** Ratio to recent median (1 = normal, >1.5 = elevated) */
+    vsMedian: number;
+    /** Data source */
+    source: "blocknative" | "rpc";
+    /** Timestamp of the data */
+    timestamp: string;
+}

package/dist/esm/anyspend/types/gas.js

@@ -0,0 +1 @@
+export {};

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

@@ -22,7 +22,7 @@ export function B3Provider({ theme = "light", children, accountOverride, environ
 // deprecated since v0.0.87
 toaster: _toaster, clientType = "rest", rpcUrls, partnerId, stripePublishableKey, onConnect, connectors, overrideDefaultConnectors = false, createClientReferenceId, enableTurnkey = false, defaultPermissions, }) {
     const setConfig = useB3ConfigStore(state => state.setConfig);
-    // Initialize config store on mount - props are static and never change
+    // Initialize config store on mount
     useEffect(() => {
         setConfig({
             accountOverride,
@@ -36,7 +36,19 @@ toaster: _toaster, clientType = "rest", rpcUrls, partnerId, stripePublishableKey
             enableTurnkey,
             defaultPermissions,
         });
-    }, []); // eslint-disable-line react-hooks/exhaustive-deps
+    }, [
+        accountOverride,
+        environment,
+        automaticallySetFirstEoa,
+        theme,
+        clientType,
+        partnerId,
+        stripePublishableKey,
+        createClientReferenceId,
+        enableTurnkey,
+        defaultPermissions,
+        setConfig,
+    ]); // eslint-disable-line react-hooks/exhaustive-deps
     // Initialize Google Analytics on mount
     useEffect(() => {
         loadGA4Script();

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

@@ -4,8 +4,8 @@ import { useQuery } from "@tanstack/react-query";
 import { viemToThirdwebChain } from "../../../shared/constants/chains/b3Chain.js";
 import { getChainById } from "../../../shared/utils/chains.js";
 import { client } from "../../../shared/utils/thirdweb.js";
-import { getWalletBalance } from "thirdweb/wallets";
 import invariant from "invariant";
+import { getWalletBalance } from "thirdweb/wallets";
 export function useTokenBalancesByChain({ address, chainsIds, enabled = true, }) {
     // Normalize chains to array
     const chainIds = Array.isArray(chainsIds) ? chainsIds : [chainsIds];
@@ -46,7 +46,9 @@ export function useTokenBalancesByChain({ address, chainsIds, enabled = true, })
         staleTime: 30000, // Consider data fresh for 30 seconds
         gcTime: 5 * 60 * 1000, // Keep in cache for 5 minutes
         retry: 2, // Limit retries on failure
-        structuralSharing: false,
+        // Enable structural sharing to prevent infinite loops
+        // This ensures we only get new references when data actually changes
+        structuralSharing: true,
     });
     return {
         nativeTokens: combinedData?.nativeTokens ?? [],