@compass-labs/widgets 0.1.26 → 0.1.27

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
 import { ReactNode } from 'react';
 import { Address } from 'viem';
 import * as _tanstack_query_core from '@tanstack/query-core';
@@ -366,209 +367,10 @@ interface CompassProviderProps {
 }
 declare function CompassProvider({ children, apiKey, defaultChain, theme, wallet, }: CompassProviderProps): react_jsx_runtime.JSX.Element;
 
-type ApyPeriod = '7d' | '30d' | '90d';
-type SortOption$1 = 'apy_7d' | 'apy_30d' | 'apy_90d' | 'tvl';
-interface VaultData {
-    vaultAddress: string;
-    name: string;
-    assetSymbol: string;
-    apy7d: string | null;
-    apy30d: string | null;
-    apy90d: string | null;
-    tvlUsd: string | null;
-}
-interface UserVaultPosition {
-    vaultAddress: string;
-    balance: string;
-    pnl?: {
-        unrealizedPnl: string;
-        realizedPnl: string;
-        totalPnl: string;
-        totalDeposited: string;
-    };
-    deposits?: Array<{
-        amount: string;
-        blockNumber: number;
-        txHash: string;
-    }>;
-    withdrawals?: Array<{
-        amount: string;
-        blockNumber: number;
-        txHash: string;
-    }>;
-}
-/**
- * Props for the VaultsList widget.
- *
- * Sensible defaults are applied automatically:
- * - All display options enabled (APY, TVL, positions, P&L, history)
- * - Search and sorting enabled
- * - Sorted by 7-day APY (best recent performers first)
- * - TVL filter available but no minimum set
- */
-interface VaultsListProps {
-    /** Show APY metrics @default true */
-    showApy?: boolean;
-    /** Which APY periods to display @default ['7d', '30d', '90d'] */
-    apyPeriods?: ApyPeriod[];
-    /** Show total value locked @default true */
-    showTvl?: boolean;
-    /** Show user's current position @default true */
-    showUserPosition?: boolean;
-    /** Show profit/loss summary @default true */
-    showPnL?: boolean;
-    /** Show transaction history @default true */
-    showHistory?: boolean;
-    /** Enable search functionality @default true */
-    showSearch?: boolean;
-    /** Enable sorting options @default true */
-    showSort?: boolean;
-    /** Default sort option @default 'apy_7d' */
-    defaultSort?: SortOption$1;
-    /** Filter by asset symbols (e.g., ['USDC', 'ETH']) @default undefined (show all) */
-    assetFilter?: string[];
-    /** Minimum APY filter @default undefined (no minimum) */
-    minApy?: number;
-    /** Minimum TVL filter in USD @default undefined (no minimum) */
-    minTvl?: number;
-    /** Show TVL filter input @default true */
-    showTvlFilter?: boolean;
-    /** Callback when vault is clicked */
-    onVaultSelect?: (vault: VaultData) => void;
-    /** Callback after successful deposit */
-    onDeposit?: (vault: VaultData, amount: string, txHash: string) => void;
-    /** Callback after successful withdraw */
-    onWithdraw?: (vault: VaultData, amount: string, txHash: string) => void;
-}
-
-/**
- * VaultsList widget displays ERC-4626 yield vaults with APY, TVL, and user positions.
- *
- * @example
- * ```tsx
- * <VaultsList
- *   showApy={true}
- *   showTvl={true}
- *   showUserPosition={true}
- *   onVaultSelect={(vault) => console.log('Selected:', vault)}
- * />
- * ```
- */
-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$1;
-    assetFilter?: string[];
-    minApy?: number;
-    minTvl?: number;
-}
-declare function useVaultsData(options?: UseVaultsDataOptions): {
-    vaults: {
-        userPosition: UserVaultPosition | undefined;
-        vaultAddress: string;
-        name: string;
-        assetSymbol: string;
-        apy7d: string | null;
-        apy30d: string | null;
-        apy90d: string | null;
-        tvlUsd: string | null;
-    }[];
-    isLoading: boolean;
-    isError: boolean;
-    error: Error | null;
-    refetch: () => void;
-};
-
-interface AaveMarketData {
-    marketAddress: string;
-    reserveSymbol: string;
-    underlyingSymbol: string;
-    supplyApy: string | null;
-    borrowApy: string | null;
-}
-interface TransactionEvent$1 {
-    amount: string;
-    blockNumber: number;
-    txHash: string;
-}
-interface UserAavePosition {
-    marketAddress: string;
-    reserveSymbol: string;
-    balance: string;
-    pnl?: {
-        unrealizedPnl: string;
-        realizedPnl: string;
-        totalPnl: string;
-        totalDeposited: string;
-    };
-    deposits?: TransactionEvent$1[];
-    withdrawals?: TransactionEvent$1[];
-}
-/**
- * Props for the AaveMarketsList widget.
- *
- * Sensible defaults are applied automatically:
- * - All display options enabled (APY, positions, P&L, history)
- * - Search enabled for quick market discovery
- * - Shows supply APY (lending rates)
- */
-interface AaveMarketsListProps {
-    /** Show APY metrics @default true */
-    showApy?: boolean;
-    /** Show user's current position @default true */
-    showUserPosition?: boolean;
-    /** Show profit/loss summary @default true */
-    showPnL?: boolean;
-    /** Show transaction history @default true */
-    showHistory?: boolean;
-    /** Enable search functionality @default true */
-    showSearch?: boolean;
-    /** Filter by asset symbols (e.g., ['USDC', 'ETH']) @default undefined (show all) */
-    assetFilter?: string[];
-    /** Callback when market is clicked */
-    onMarketSelect?: (market: AaveMarketData) => void;
-    /** Callback after successful supply */
-    onSupply?: (market: AaveMarketData, amount: string, txHash: string) => void;
-    /** Callback after successful withdraw */
-    onWithdraw?: (market: AaveMarketData, amount: string, txHash: string) => void;
-}
-
-/**
- * AaveMarketsList widget displays Aave V3 lending markets with supply APY.
- *
- * @example
- * ```tsx
- * <AaveMarketsList
- *   showApy={true}
- *   showUserPosition={true}
- *   onMarketSelect={(market) => console.log('Selected:', market)}
- * />
- * ```
- */
-declare function AaveMarketsList({ showApy, showUserPosition, showPnL, showHistory, showSearch, assetFilter, onMarketSelect, onSupply, onWithdraw, }: AaveMarketsListProps): react_jsx_runtime.JSX.Element;
-
-interface UseAaveDataOptions {
-    assetFilter?: string[];
-}
-declare function useAaveData(options?: UseAaveDataOptions): {
-    markets: {
-        userPosition: UserAavePosition | undefined;
-        marketAddress: string;
-        reserveSymbol: string;
-        underlyingSymbol: string;
-        supplyApy: string | null;
-        borrowApy: string | null;
-    }[];
-    isLoading: boolean;
-    isError: boolean;
-    error: Error | null;
-    refetch: () => void;
-};
-
 type MarketType = 'aave' | 'pendle' | 'vaults';
 /** UI tab type for the market selector */
 type UIMarketTab = 'variable' | 'fixed';
-interface MarketOption {
+interface MarketOption$1 {
     id: string;
     name: string;
     apy: number;
@@ -604,9 +406,9 @@ interface EarnAccountProps {
     /** Custom title for the header @default "Savings Account" */
     title?: string;
     /** Callback after successful deposit */
-    onDeposit?: (market: MarketOption, amount: number, txHash: string) => void;
+    onDeposit?: (market: MarketOption$1, amount: number, txHash: string) => void;
     /** Callback after successful withdraw */
-    onWithdraw?: (market: MarketOption, amount: number, txHash: string) => void;
+    onWithdraw?: (market: MarketOption$1, amount: number, txHash: string) => void;
     /** Default market tab to show @default 'variable' */
     defaultMarketTab?: UIMarketTab;
     /**
@@ -634,114 +436,6 @@ interface EarnAccountProps {
  */
 declare function EarnAccount({ showHeader, showInterestRate, showTopUpButton, showTrustBadge, compact, title, onDeposit, onWithdraw, defaultMarketTab, allowedVariableMarkets, allowedFixedMarkets, chain: chainProp, }: EarnAccountProps): react_jsx_runtime.JSX.Element;
 
-type SortOption = 'fixed_apy' | 'tvl' | 'expiry';
-interface PendleMarketData {
-    marketAddress: string;
-    ptAddress: string;
-    name: string;
-    underlyingSymbol: string;
-    fixedApy: string | null;
-    impliedApy: string | null;
-    tvlUsd: string | null;
-    expiry: string;
-}
-interface TransactionEvent {
-    amount: string;
-    blockNumber: number;
-    txHash: string;
-}
-interface UserPendlePosition {
-    marketAddress: string;
-    balance: string;
-    pnl?: {
-        unrealizedPnl: string;
-        realizedPnl: string;
-        totalPnl: string;
-        totalDeposited: string;
-    };
-    deposits?: TransactionEvent[];
-    withdrawals?: TransactionEvent[];
-}
-/**
- * Props for the PendleMarketsList widget.
- *
- * Sensible defaults are applied automatically:
- * - All display options enabled (APY, TVL, expiry, positions, P&L, history)
- * - Search and sorting enabled
- * - Sorted by fixed APY (best yields first)
- * - Shows only non-expired markets
- */
-interface PendleMarketsListProps {
-    /** Show APY metrics @default true */
-    showApy?: boolean;
-    /** Show total value locked @default true */
-    showTvl?: boolean;
-    /** Show expiry dates @default true */
-    showExpiry?: boolean;
-    /** Show user's current position @default true */
-    showUserPosition?: boolean;
-    /** Show profit/loss summary @default true */
-    showPnL?: boolean;
-    /** Show transaction history @default true */
-    showHistory?: boolean;
-    /** Enable search functionality @default true */
-    showSearch?: boolean;
-    /** Enable sorting options @default true */
-    showSort?: boolean;
-    /** Default sort option @default 'fixed_apy' */
-    defaultSort?: SortOption;
-    /** Filter by asset symbols (e.g., ['USDC', 'ETH']) @default undefined (show all) */
-    assetFilter?: string[];
-    /** Minimum TVL filter in USD @default undefined (no minimum) */
-    minTvl?: number;
-    /** Show TVL filter input @default true */
-    showTvlFilter?: boolean;
-    /** Callback when market is clicked */
-    onMarketSelect?: (market: PendleMarketData) => void;
-    /** Callback after successful deposit */
-    onDeposit?: (market: PendleMarketData, amount: string, txHash: string) => void;
-    /** Callback after successful withdraw */
-    onWithdraw?: (market: PendleMarketData, amount: string, txHash: string) => void;
-}
-
-/**
- * PendleMarketsList widget displays Pendle fixed-yield markets.
- *
- * @example
- * ```tsx
- * <PendleMarketsList
- *   showApy={true}
- *   showExpiry={true}
- *   showTvl={true}
- *   onMarketSelect={(market) => console.log('Selected:', market)}
- * />
- * ```
- */
-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: {
-        userPosition: UserPendlePosition | undefined;
-        marketAddress: string;
-        ptAddress: string;
-        name: string;
-        underlyingSymbol: string;
-        fixedApy: string | null;
-        impliedApy: string | null;
-        tvlUsd: string | null;
-        expiry: string;
-    }[];
-    isLoading: boolean;
-    isError: boolean;
-    error: Error | null;
-    refetch: () => void;
-};
-
 type SwapLayout = 'compact' | 'full';
 interface SwapQuote {
     inputAmount: string;
@@ -794,8 +488,8 @@ declare function useSwapQuote({ fromToken, toToken, amount, enabled }: UseSwapQu
     refetch: (options?: _tanstack_query_core.RefetchOptions) => Promise<_tanstack_query_core.QueryObserverResult<SwapQuote | null, Error>>;
 };
 
-type TabId = 'vaults' | 'aave' | 'pendle' | 'swap' | 'positions';
-type FeaturePreset = 'full' | 'earn-only' | 'swap-only' | 'vaults-only';
+type TabId = 'swap' | 'positions' | 'rebalance';
+type FeaturePreset = 'full' | 'swap-only';
 interface TabConfig {
     id: TabId;
     label: string;
@@ -803,32 +497,126 @@ interface TabConfig {
 }
 /**
  * Props for the CompassEarnWidget (unified tabbed experience).
- *
- * Sensible defaults are applied automatically:
- * - Starts on Vaults tab (highest yield opportunities)
- * - All tabs enabled (Vaults, Aave, Pendle, Swap)
- * - Full-featured experience out of the box
  */
 interface CompassEarnWidgetProps {
     preset?: FeaturePreset;
-    enableVaults?: boolean;
-    enableAave?: boolean;
-    enablePendle?: boolean;
     enableSwap?: boolean;
     enablePositions?: boolean;
+    enableRebalance?: boolean;
     defaultTab?: TabId;
     showHeader?: boolean;
-    showApy?: boolean;
-    showTvl?: boolean;
-    showExpiry?: boolean;
-    showUserPosition?: boolean;
     showPnL?: boolean;
-    showSearch?: boolean;
-    showSort?: boolean;
     onTabChange?: (tab: TabId) => void;
 }
 
-declare function CompassEarnWidget({ preset, enableVaults, enableAave, enablePendle, enableSwap, enablePositions, defaultTab, showHeader, showApy, showTvl, showExpiry, showUserPosition, showPnL, showSearch, showSort, onTabChange, }: CompassEarnWidgetProps): react_jsx_runtime.JSX.Element;
+declare function CompassEarnWidget({ preset, enableSwap, enablePositions, enableRebalance, defaultTab, showHeader, showPnL, onTabChange, }: CompassEarnWidgetProps): react_jsx_runtime.JSX.Element;
+
+type VenueType$1 = 'vault' | 'aave' | 'pendle_pt';
+interface PortfolioPosition {
+    id: string;
+    venueType: VenueType$1;
+    venueName: string;
+    venueAddress: string;
+    token: string;
+    balance: number;
+    usdValue: number;
+    apy: number;
+    /** Computed: usdValue / totalUsd * 100 */
+    allocationPercent: number;
+}
+interface IdleBalance {
+    token: string;
+    balance: number;
+    usdValue: number;
+}
+interface PortfolioState {
+    positions: PortfolioPosition[];
+    idleBalances: IdleBalance[];
+    totalUsd: number;
+    totalIdleUsd: number;
+}
+interface TargetAllocation {
+    venueType: VenueType$1;
+    venueAddress: string;
+    venueName: string;
+    token: string;
+    targetPercent: number;
+}
+type RebalanceActionType = 'withdraw' | 'swap' | 'deposit';
+interface RebalanceAction {
+    type: RebalanceActionType;
+    venueType?: VenueType$1;
+    venueAddress?: string;
+    token: string;
+    amount: number;
+    usdValue: number;
+    /** For swaps: output token */
+    tokenOut?: string;
+    /** For swaps: estimated output amount */
+    estimatedAmountOut?: number;
+}
+interface RebalancePlan {
+    actions: RebalanceAction[];
+    totalActions: number;
+    estimatedGasSavings: string;
+    warnings: string[];
+}
+/**
+ * Props for the RebalancingWidget.
+ *
+ * Sensible defaults are applied automatically:
+ * - Chain switcher and wallet status shown
+ * - $1 minimum rebalance threshold (skips dust)
+ * - 0.5% default slippage for swaps
+ */
+interface RebalancingWidgetProps {
+    /** Show chain switcher in header @default true */
+    showChainSwitcher?: boolean;
+    /** Show wallet status in header @default true */
+    showWalletStatus?: boolean;
+    /** Minimum USD value to include in rebalance actions @default 1 */
+    minRebalanceThresholdUsd?: number;
+    /** Default slippage for swaps in percent @default 0.5 */
+    defaultSlippage?: number;
+    /** Lock to specific chain (hides chain switcher) */
+    chain?: string;
+    /** Callback after successful rebalance */
+    onRebalance?: (plan: RebalancePlan, txHash: string) => void;
+    /** Callback when rebalance fails */
+    onError?: (error: Error) => void;
+    /** Widget title displayed in the header. Default: "Portfolio Manager" */
+    title?: string;
+    /** Filter which venues appear in "Add Venue". If omitted, all available venues are shown. */
+    venues?: {
+        vaults?: string[];
+        aave?: string[];
+        pendle?: string[];
+    };
+    /** Whether to show the "Top Up" button in the balance card. Default: true */
+    showTopUp?: boolean;
+    /** Fixed height for the widget. Default: "600px" */
+    height?: string;
+}
+
+declare function RebalancingWidget({ showChainSwitcher, showWalletStatus, minRebalanceThresholdUsd, defaultSlippage, chain, onRebalance, onError, title, venues, showTopUp, height, }: RebalancingWidgetProps): react_jsx_runtime.JSX.Element;
+
+interface MarketOption {
+    venueType: VenueType$1;
+    venueAddress: string;
+    venueName: string;
+    token: string;
+    apy: number;
+}
+declare function useRebalancingData(chainOverride?: string): {
+    portfolio: PortfolioState | null;
+    availableVenues: MarketOption[];
+    earnAccountMarkets: MarketOption$1[];
+    isMarketsLoading: boolean;
+    isLoading: boolean;
+    isError: boolean;
+    error: Error | null;
+    refetch: () => void;
+};
 
 /**
  * Theme Presets for Compass Embeddable Widgets
@@ -1036,10 +824,15 @@ type TransferAction = 'deposit' | 'withdraw';
 interface EarnAccountBalanceProps {
     /** Compact mode - just show total USD value */
     compact?: boolean;
+    /** Hide visual buttons, only render modals (for external trigger via ref) */
+    hideVisual?: boolean;
     /** Callback when transfer completes */
     onTransferComplete?: (action: TransferAction, token: string, amount: string, txHash: string) => void;
 }
-declare function EarnAccountBalance({ compact, onTransferComplete, }: EarnAccountBalanceProps): react_jsx_runtime.JSX.Element | null;
+interface EarnAccountBalanceHandle {
+    openTransferModal: () => void;
+}
+declare const EarnAccountBalance: react.ForwardRefExoticComponent<EarnAccountBalanceProps & react.RefAttributes<EarnAccountBalanceHandle>>;
 
 interface TokenBalance {
     symbol: string;
@@ -1066,4 +859,4 @@ interface ChainConfig {
 }
 declare const CHAINS: Record<SupportedChainId, ChainConfig>;
 
-export { type AaveMarketData, AaveMarketsList, type AaveMarketsListProps, AccountBalancesModal, type AccountBalancesModalProps, ActionModal, ApiProvider, type ApyPeriod, CHAINS, type ChainConfig, ChainSwitcher, CompassEarnWidget, type CompassEarnWidgetProps, CompassProvider, type CompassProviderProps, type CompassTheme, DEFAULT_SWAP_TOKENS, DepositWithdrawForm, EarnAccount, EarnAccountBalance, type EarnAccountBalanceProps, type EarnAccountContextValue, EarnAccountGuard, type EarnAccountProps, 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, type TokenBalance, TransactionHistory, type TypedDataToSign, type UserAavePosition, type UserPendlePosition, type UserVaultPosition, type VaultData, VaultsList, type VaultsListProps, type SortOption$1 as VaultsSortOption, type WalletAdapter, WalletStatus, themePresets, useAaveData, useChain, useCompassApi, useCompassChain, useCompassWallet, useEarnAccount, useEmbeddableApi, useEmbeddableWallet, usePendleData, useSwapQuote, useTheme, useVaultsData };
+export { AccountBalancesModal, type AccountBalancesModalProps, ActionModal, ApiProvider, CHAINS, type ChainConfig, ChainSwitcher, CompassEarnWidget, type CompassEarnWidgetProps, CompassProvider, type CompassProviderProps, type CompassTheme, DEFAULT_SWAP_TOKENS, DepositWithdrawForm, EarnAccount, EarnAccountBalance, type EarnAccountBalanceProps, type EarnAccountContextValue, EarnAccountGuard, type EarnAccountProps, type FeaturePreset, type IdleBalance, PnLSummary, type PortfolioPosition, type PortfolioState, type RebalanceAction, type RebalanceActionType, type RebalancePlan, RebalancingWidget, type RebalancingWidgetProps, type SupportedChain, type SupportedChainId, type SwapLayout, type SwapQuote, SwapWidget, type SwapWidgetProps, type TabConfig, type TabId, type TargetAllocation, type ThemeInput, type ThemeMode, type ThemePresetName, ThemeProvider, type TokenBalance, TransactionHistory, type TypedDataToSign, type VenueType$1 as VenueType, type WalletAdapter, WalletStatus, themePresets, useChain, useCompassApi, useCompassChain, useCompassWallet, useEarnAccount, useEmbeddableApi, useEmbeddableWallet, useRebalancingData, useSwapQuote, useTheme };