@compass-labs/widgets 0.1.1 → 0.1.2

package/dist/index.d.mts

@@ -297,6 +297,11 @@ interface TypedDataToSign {
 interface WalletAdapter {
     /** Connected wallet address, or null if not connected */
     address: Address | null;
+    /**
+     * Current chain ID the wallet is connected to (optional)
+     * If provided, widgets will verify the wallet is on the correct chain before signing
+     */
+    chainId?: number;
     /**
      * Sign EIP-712 typed data
      * Called when user initiates a deposit/withdraw transaction
@@ -409,6 +414,10 @@ interface VaultsListProps {
     assetFilter?: string[];
     /** Minimum APY filter */
     minApy?: number;
+    /** Minimum TVL filter (in USD) */
+    minTvl?: number;
+    /** Show TVL filter input */
+    showTvlFilter?: boolean;
     /** Callback when vault is clicked */
     onVaultSelect?: (vault: VaultData) => void;
     /** Callback after successful deposit */
@@ -430,12 +439,13 @@ interface VaultsListProps {
  * />
  * ```
  */
-declare function VaultsList({ showApy, apyPeriods, showTvl, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, minApy, onVaultSelect, onDeposit, onWithdraw, }: VaultsListProps): react_jsx_runtime.JSX.Element;
+declare function VaultsList({ showApy, apyPeriods, showTvl, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, minApy, minTvl: initialMinTvl, showTvlFilter, onVaultSelect, onDeposit, onWithdraw, }: VaultsListProps): react_jsx_runtime.JSX.Element;
 
 interface UseVaultsDataOptions {
     sortBy?: SortOption$2;
     assetFilter?: string[];
     minApy?: number;
+    minTvl?: number;
 }
 declare function useVaultsData(options?: UseVaultsDataOptions): {
     vaults: {
@@ -593,6 +603,10 @@ interface PendleMarketsListProps {
     defaultSort?: SortOption;
     /** Filter by asset symbols */
     assetFilter?: string[];
+    /** Minimum TVL filter (in USD) */
+    minTvl?: number;
+    /** Show TVL filter input */
+    showTvlFilter?: boolean;
     /** Callback when market is clicked */
     onMarketSelect?: (market: PendleMarketData) => void;
     /** Callback after successful deposit */
@@ -614,11 +628,12 @@ interface PendleMarketsListProps {
  * />
  * ```
  */
-declare function PendleMarketsList({ showApy, showTvl, showExpiry, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, onMarketSelect, onDeposit, onWithdraw, }: PendleMarketsListProps): react_jsx_runtime.JSX.Element;
+declare function PendleMarketsList({ showApy, showTvl, showExpiry, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, minTvl: initialMinTvl, showTvlFilter, onMarketSelect, onDeposit, onWithdraw, }: PendleMarketsListProps): react_jsx_runtime.JSX.Element;
 
 interface UsePendleDataOptions {
     sortBy?: SortOption;
     assetFilter?: string[];
+    minTvl?: number;
 }
 declare function usePendleData(options?: UsePendleDataOptions): {
     markets: {
@@ -643,8 +658,6 @@ interface SwapQuote {
     inputAmount: string;
     outputAmount: string;
     rate: string;
-    priceImpact: string;
-    fee: string;
 }
 interface SwapWidgetProps {
     layout?: SwapLayout;
@@ -653,12 +666,11 @@ interface SwapWidgetProps {
     allowedTokens?: string[];
     showReverseButton?: boolean;
     showSettings?: boolean;
-    showPriceImpact?: boolean;
     onSwapSuccess?: (fromToken: string, toToken: string, fromAmount: string, toAmount: string, txHash: string) => void;
     onSwapError?: (error: Error) => void;
 }
 
-declare function SwapWidget({ layout, defaultFromToken, defaultToToken, allowedTokens, showReverseButton, showSettings, showPriceImpact, onSwapSuccess, onSwapError, }: SwapWidgetProps): react_jsx_runtime.JSX.Element;
+declare function SwapWidget({ layout, defaultFromToken, defaultToToken, allowedTokens, showReverseButton, showSettings, onSwapSuccess, onSwapError, }: SwapWidgetProps): react_jsx_runtime.JSX.Element;
 
 interface UseSwapQuoteOptions {
     fromToken: string;
@@ -670,28 +682,19 @@ declare function useSwapQuote({ fromToken, toToken, amount, enabled }: UseSwapQu
     quote: SwapQuote | null | undefined;
     isLoading: boolean;
     isError: boolean;
+    error: Error | null;
     refetch: (options?: _tanstack_query_core.RefetchOptions) => Promise<_tanstack_query_core.QueryObserverResult<SwapQuote | null, Error>>;
 };
 
-type TabId = 'vaults' | 'aave' | 'pendle' | 'swap';
-type FeaturePreset = 'full' | 'earn-only' | 'swap-only' | 'vaults-only';
-interface TabConfig {
-    id: TabId;
-    label: string;
-    enabled: boolean;
-}
+type TabId = 'vaults' | 'aave' | 'pendle' | 'swap' | 'positions';
 interface CompassEarnWidgetProps {
-    preset?: FeaturePreset;
-    enableVaults?: boolean;
-    enableAave?: boolean;
-    enablePendle?: boolean;
-    enableSwap?: boolean;
+    /** Starting tab (defaults to 'vaults') */
     defaultTab?: TabId;
-    showHeader?: boolean;
+    /** Called when user switches tabs */
     onTabChange?: (tab: TabId) => void;
 }
 
-declare function CompassEarnWidget({ preset, enableVaults, enableAave, enablePendle, enableSwap, defaultTab, showHeader, onTabChange, }: CompassEarnWidgetProps): react_jsx_runtime.JSX.Element;
+declare function CompassEarnWidget({ defaultTab, onTabChange, }: CompassEarnWidgetProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Theme Presets for Compass Embeddable Widgets
@@ -768,6 +771,8 @@ interface WalletContextValue {
     address: Address | null;
     /** Whether a wallet is connected */
     isConnected: boolean;
+    /** Current chain ID the wallet is connected to */
+    walletChainId: number | undefined;
     /** Sign EIP-712 typed data - throws if wallet not connected */
     signTypedData: (data: TypedDataToSign) => Promise<string>;
     /** Switch chain - may not be available depending on wallet adapter */
@@ -891,14 +896,27 @@ declare function EarnAccountGuard({ children, loadingComponent, createAccountCom
 
 type TransferAction = 'deposit' | 'withdraw';
 interface EarnAccountBalanceProps {
-    /** Tokens to show/allow transfers for */
-    tokens?: string[];
     /** Compact mode - just show total USD value */
     compact?: boolean;
     /** Callback when transfer completes */
     onTransferComplete?: (action: TransferAction, token: string, amount: string, txHash: string) => void;
 }
-declare function EarnAccountBalance({ tokens, compact, onTransferComplete, }: EarnAccountBalanceProps): react_jsx_runtime.JSX.Element | null;
+declare function EarnAccountBalance({ compact, onTransferComplete, }: EarnAccountBalanceProps): react_jsx_runtime.JSX.Element | null;
+
+interface TokenBalance {
+    symbol: string;
+    balance: string;
+    usdValue: string;
+}
+interface AccountBalancesModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    balances: TokenBalance[];
+    totalUsdValue: string;
+    isLoading?: boolean;
+    earnAccountAddress?: string;
+}
+declare function AccountBalancesModal({ isOpen, onClose, balances, totalUsdValue, isLoading, earnAccountAddress, }: AccountBalancesModalProps): react_jsx_runtime.JSX.Element | null;
 
 type SupportedChainId = 'ethereum' | 'base' | 'arbitrum';
 interface ChainConfig {
@@ -910,4 +928,4 @@ interface ChainConfig {
 }
 declare const CHAINS: Record<SupportedChainId, ChainConfig>;
 
-export { type AaveMarketData, AaveMarketsList, type AaveMarketsListProps, type SortOption$1 as AaveSortOption, ActionModal, ApiProvider, type ApyPeriod, CHAINS, type ChainConfig, ChainSwitcher, CompassEarnWidget, type CompassEarnWidgetProps, CompassProvider, type CompassProviderProps, type CompassTheme, DepositWithdrawForm, EarnAccountBalance, type EarnAccountBalanceProps, type EarnAccountContextValue, EarnAccountGuard, type FeaturePreset, type PendleMarketData, PendleMarketsList, type PendleMarketsListProps, type SortOption as PendleSortOption, PnLSummary, type SupportedChain, type SupportedChainId, type SwapLayout, type SwapQuote, SwapWidget, type SwapWidgetProps, type TabConfig, type TabId, type ThemeInput, type ThemeMode, type ThemePresetName, ThemeProvider, TransactionHistory, type TypedDataToSign, type UserAavePosition, type UserPendlePosition, type UserVaultPosition, type VaultData, VaultsList, type VaultsListProps, type SortOption$2 as VaultsSortOption, type WalletAdapter, WalletStatus, themePresets, useAaveData, useChain, useCompassApi, useCompassChain, useCompassWallet, useEarnAccount, useEmbeddableApi, useEmbeddableWallet, usePendleData, useSwapQuote, useTheme, useVaultsData };
+export { type AaveMarketData, AaveMarketsList, type AaveMarketsListProps, type SortOption$1 as AaveSortOption, AccountBalancesModal, type AccountBalancesModalProps, ActionModal, ApiProvider, type ApyPeriod, CHAINS, type ChainConfig, ChainSwitcher, CompassEarnWidget, type CompassEarnWidgetProps, CompassProvider, type CompassProviderProps, type CompassTheme, DepositWithdrawForm, EarnAccountBalance, type EarnAccountBalanceProps, type EarnAccountContextValue, EarnAccountGuard, type PendleMarketData, PendleMarketsList, type PendleMarketsListProps, type SortOption as PendleSortOption, PnLSummary, type SupportedChain, type SupportedChainId, type SwapLayout, type SwapQuote, SwapWidget, type SwapWidgetProps, type TabId, type ThemeInput, type ThemeMode, type ThemePresetName, ThemeProvider, type TokenBalance, TransactionHistory, type TypedDataToSign, type UserAavePosition, type UserPendlePosition, type UserVaultPosition, type VaultData, VaultsList, type VaultsListProps, type SortOption$2 as VaultsSortOption, type WalletAdapter, WalletStatus, themePresets, useAaveData, useChain, useCompassApi, useCompassChain, useCompassWallet, useEarnAccount, useEmbeddableApi, useEmbeddableWallet, usePendleData, useSwapQuote, useTheme, useVaultsData };

package/dist/index.d.ts

@@ -297,6 +297,11 @@ interface TypedDataToSign {
 interface WalletAdapter {
     /** Connected wallet address, or null if not connected */
     address: Address | null;
+    /**
+     * Current chain ID the wallet is connected to (optional)
+     * If provided, widgets will verify the wallet is on the correct chain before signing
+     */
+    chainId?: number;
     /**
      * Sign EIP-712 typed data
      * Called when user initiates a deposit/withdraw transaction
@@ -409,6 +414,10 @@ interface VaultsListProps {
     assetFilter?: string[];
     /** Minimum APY filter */
     minApy?: number;
+    /** Minimum TVL filter (in USD) */
+    minTvl?: number;
+    /** Show TVL filter input */
+    showTvlFilter?: boolean;
     /** Callback when vault is clicked */
     onVaultSelect?: (vault: VaultData) => void;
     /** Callback after successful deposit */
@@ -430,12 +439,13 @@ interface VaultsListProps {
  * />
  * ```
  */
-declare function VaultsList({ showApy, apyPeriods, showTvl, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, minApy, onVaultSelect, onDeposit, onWithdraw, }: VaultsListProps): react_jsx_runtime.JSX.Element;
+declare function VaultsList({ showApy, apyPeriods, showTvl, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, minApy, minTvl: initialMinTvl, showTvlFilter, onVaultSelect, onDeposit, onWithdraw, }: VaultsListProps): react_jsx_runtime.JSX.Element;
 
 interface UseVaultsDataOptions {
     sortBy?: SortOption$2;
     assetFilter?: string[];
     minApy?: number;
+    minTvl?: number;
 }
 declare function useVaultsData(options?: UseVaultsDataOptions): {
     vaults: {
@@ -593,6 +603,10 @@ interface PendleMarketsListProps {
     defaultSort?: SortOption;
     /** Filter by asset symbols */
     assetFilter?: string[];
+    /** Minimum TVL filter (in USD) */
+    minTvl?: number;
+    /** Show TVL filter input */
+    showTvlFilter?: boolean;
     /** Callback when market is clicked */
     onMarketSelect?: (market: PendleMarketData) => void;
     /** Callback after successful deposit */
@@ -614,11 +628,12 @@ interface PendleMarketsListProps {
  * />
  * ```
  */
-declare function PendleMarketsList({ showApy, showTvl, showExpiry, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, onMarketSelect, onDeposit, onWithdraw, }: PendleMarketsListProps): react_jsx_runtime.JSX.Element;
+declare function PendleMarketsList({ showApy, showTvl, showExpiry, showUserPosition, showPnL, showHistory, showSearch, showSort, defaultSort, assetFilter, minTvl: initialMinTvl, showTvlFilter, onMarketSelect, onDeposit, onWithdraw, }: PendleMarketsListProps): react_jsx_runtime.JSX.Element;
 
 interface UsePendleDataOptions {
     sortBy?: SortOption;
     assetFilter?: string[];
+    minTvl?: number;
 }
 declare function usePendleData(options?: UsePendleDataOptions): {
     markets: {
@@ -643,8 +658,6 @@ interface SwapQuote {
     inputAmount: string;
     outputAmount: string;
     rate: string;
-    priceImpact: string;
-    fee: string;
 }
 interface SwapWidgetProps {
     layout?: SwapLayout;
@@ -653,12 +666,11 @@ interface SwapWidgetProps {
     allowedTokens?: string[];
     showReverseButton?: boolean;
     showSettings?: boolean;
-    showPriceImpact?: boolean;
     onSwapSuccess?: (fromToken: string, toToken: string, fromAmount: string, toAmount: string, txHash: string) => void;
     onSwapError?: (error: Error) => void;
 }
 
-declare function SwapWidget({ layout, defaultFromToken, defaultToToken, allowedTokens, showReverseButton, showSettings, showPriceImpact, onSwapSuccess, onSwapError, }: SwapWidgetProps): react_jsx_runtime.JSX.Element;
+declare function SwapWidget({ layout, defaultFromToken, defaultToToken, allowedTokens, showReverseButton, showSettings, onSwapSuccess, onSwapError, }: SwapWidgetProps): react_jsx_runtime.JSX.Element;
 
 interface UseSwapQuoteOptions {
     fromToken: string;
@@ -670,28 +682,19 @@ declare function useSwapQuote({ fromToken, toToken, amount, enabled }: UseSwapQu
     quote: SwapQuote | null | undefined;
     isLoading: boolean;
     isError: boolean;
+    error: Error | null;
     refetch: (options?: _tanstack_query_core.RefetchOptions) => Promise<_tanstack_query_core.QueryObserverResult<SwapQuote | null, Error>>;
 };
 
-type TabId = 'vaults' | 'aave' | 'pendle' | 'swap';
-type FeaturePreset = 'full' | 'earn-only' | 'swap-only' | 'vaults-only';
-interface TabConfig {
-    id: TabId;
-    label: string;
-    enabled: boolean;
-}
+type TabId = 'vaults' | 'aave' | 'pendle' | 'swap' | 'positions';
 interface CompassEarnWidgetProps {
-    preset?: FeaturePreset;
-    enableVaults?: boolean;
-    enableAave?: boolean;
-    enablePendle?: boolean;
-    enableSwap?: boolean;
+    /** Starting tab (defaults to 'vaults') */
     defaultTab?: TabId;
-    showHeader?: boolean;
+    /** Called when user switches tabs */
     onTabChange?: (tab: TabId) => void;
 }
 
-declare function CompassEarnWidget({ preset, enableVaults, enableAave, enablePendle, enableSwap, defaultTab, showHeader, onTabChange, }: CompassEarnWidgetProps): react_jsx_runtime.JSX.Element;
+declare function CompassEarnWidget({ defaultTab, onTabChange, }: CompassEarnWidgetProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Theme Presets for Compass Embeddable Widgets
@@ -768,6 +771,8 @@ interface WalletContextValue {
     address: Address | null;
     /** Whether a wallet is connected */
     isConnected: boolean;
+    /** Current chain ID the wallet is connected to */
+    walletChainId: number | undefined;
     /** Sign EIP-712 typed data - throws if wallet not connected */
     signTypedData: (data: TypedDataToSign) => Promise<string>;
     /** Switch chain - may not be available depending on wallet adapter */
@@ -891,14 +896,27 @@ declare function EarnAccountGuard({ children, loadingComponent, createAccountCom
 
 type TransferAction = 'deposit' | 'withdraw';
 interface EarnAccountBalanceProps {
-    /** Tokens to show/allow transfers for */
-    tokens?: string[];
     /** Compact mode - just show total USD value */
     compact?: boolean;
     /** Callback when transfer completes */
     onTransferComplete?: (action: TransferAction, token: string, amount: string, txHash: string) => void;
 }
-declare function EarnAccountBalance({ tokens, compact, onTransferComplete, }: EarnAccountBalanceProps): react_jsx_runtime.JSX.Element | null;
+declare function EarnAccountBalance({ compact, onTransferComplete, }: EarnAccountBalanceProps): react_jsx_runtime.JSX.Element | null;
+
+interface TokenBalance {
+    symbol: string;
+    balance: string;
+    usdValue: string;
+}
+interface AccountBalancesModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    balances: TokenBalance[];
+    totalUsdValue: string;
+    isLoading?: boolean;
+    earnAccountAddress?: string;
+}
+declare function AccountBalancesModal({ isOpen, onClose, balances, totalUsdValue, isLoading, earnAccountAddress, }: AccountBalancesModalProps): react_jsx_runtime.JSX.Element | null;
 
 type SupportedChainId = 'ethereum' | 'base' | 'arbitrum';
 interface ChainConfig {
@@ -910,4 +928,4 @@ interface ChainConfig {
 }
 declare const CHAINS: Record<SupportedChainId, ChainConfig>;
 
-export { type AaveMarketData, AaveMarketsList, type AaveMarketsListProps, type SortOption$1 as AaveSortOption, ActionModal, ApiProvider, type ApyPeriod, CHAINS, type ChainConfig, ChainSwitcher, CompassEarnWidget, type CompassEarnWidgetProps, CompassProvider, type CompassProviderProps, type CompassTheme, DepositWithdrawForm, EarnAccountBalance, type EarnAccountBalanceProps, type EarnAccountContextValue, EarnAccountGuard, type FeaturePreset, type PendleMarketData, PendleMarketsList, type PendleMarketsListProps, type SortOption as PendleSortOption, PnLSummary, type SupportedChain, type SupportedChainId, type SwapLayout, type SwapQuote, SwapWidget, type SwapWidgetProps, type TabConfig, type TabId, type ThemeInput, type ThemeMode, type ThemePresetName, ThemeProvider, TransactionHistory, type TypedDataToSign, type UserAavePosition, type UserPendlePosition, type UserVaultPosition, type VaultData, VaultsList, type VaultsListProps, type SortOption$2 as VaultsSortOption, type WalletAdapter, WalletStatus, themePresets, useAaveData, useChain, useCompassApi, useCompassChain, useCompassWallet, useEarnAccount, useEmbeddableApi, useEmbeddableWallet, usePendleData, useSwapQuote, useTheme, useVaultsData };
+export { type AaveMarketData, AaveMarketsList, type AaveMarketsListProps, type SortOption$1 as AaveSortOption, AccountBalancesModal, type AccountBalancesModalProps, ActionModal, ApiProvider, type ApyPeriod, CHAINS, type ChainConfig, ChainSwitcher, CompassEarnWidget, type CompassEarnWidgetProps, CompassProvider, type CompassProviderProps, type CompassTheme, DepositWithdrawForm, EarnAccountBalance, type EarnAccountBalanceProps, type EarnAccountContextValue, EarnAccountGuard, type PendleMarketData, PendleMarketsList, type PendleMarketsListProps, type SortOption as PendleSortOption, PnLSummary, type SupportedChain, type SupportedChainId, type SwapLayout, type SwapQuote, SwapWidget, type SwapWidgetProps, type TabId, type ThemeInput, type ThemeMode, type ThemePresetName, ThemeProvider, type TokenBalance, TransactionHistory, type TypedDataToSign, type UserAavePosition, type UserPendlePosition, type UserVaultPosition, type VaultData, VaultsList, type VaultsListProps, type SortOption$2 as VaultsSortOption, type WalletAdapter, WalletStatus, themePresets, useAaveData, useChain, useCompassApi, useCompassChain, useCompassWallet, useEarnAccount, useEmbeddableApi, useEmbeddableWallet, usePendleData, useSwapQuote, useTheme, useVaultsData };