getQuote

import { getQuote } from '@silentswap/vue';

<script setup lang="ts">
import { getQuote } from '@silentswap/vue';
import { useAccount } from 'wagmi';
 
const { address } = useAccount();
 
const {
  getQuote: getBridgeQuote,
  isLoading,
  error,
  ingressEstimates,
  egressEstimates,
} = getQuote({
  address: address.value || undefined,
  maxImpactPercent: 5,
});
 
const handleGetQuote = async () => {
  const quote = await getBridgeQuote(
    1, // Source chain ID (Ethereum)
    '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48', // Source token (USDC)
    '1000000', // Amount in token units (1 USDC = 1e6)
    43114, // Destination chain ID (Avalanche)
    '0xB97EF9Ef8734C71904D8002F8b6Bc66Dd9c48a6E' // Destination token (USDC.e)
  );
 
  if (quote) {
    console.log('Provider:', quote.provider);
    console.log('Output Amount:', quote.outputAmount);
    console.log('Fee (USD):', quote.feeUsd);
  }
};
</script>
 
<template>
  <div>
    <button @click="handleGetQuote" :disabled="isLoading">
      Get Quote
    </button>
    <div v-if="error">Error: {{ error.message }}</div>
  </div>
</template>

interface GetQuoteOptions {
  /** User's EVM address */
  address?: `0x${string}`;
  /** Maximum price impact percentage allowed (default from SDK constants) */
  maxImpactPercent?: number;
  /** Timeout for quote requests in milliseconds (default: 30000) */
  quoteTimeout?: number;
}

interface GetQuoteReturn {
  // State (reactive)
  isLoading: Readonly<Ref<boolean>>;
  error: Readonly<Ref<Error | null>>;
  
  // Estimates cache (reactive)
  ingressEstimates: Readonly<Ref<Record<string, Estimate>>>;
  egressEstimates: Readonly<Ref<Record<string, Estimate>>>;
 
  // Methods
  getQuote: (
    srcChainId: number,
    srcToken: string,
    srcAmount: string,
    dstChainId: number,
    dstToken: string
  ) => Promise<BridgeQuoteResult>;
  
  solveUsdcAmount: (
    srcChainId: number,
    srcToken: string,
    srcAmount: string,
    depositCalldata?: string
  ) => Promise<SolveResult>;
  
  estimateLive: (
    direction: 'ingress' | 'egress',
    assetCaip19: string,
    chainId: number,
    tokenAddress: string,
    amount: number,
    usdPrice: number
  ) => Promise<EstimateResult>;
  
  interpolateSamples: (
    samples: EstimateSample[],
    usdValue: number,
    marginHi?: number
  ) => number;
}

<script setup lang="ts">
import { ref, watch } from 'vue';
import { getQuote } from '@silentswap/vue';
import { parseUnits } from 'viem';
 
const amount = ref('');
const quote = ref<BridgeQuoteResult | null>(null);
 
const { getQuote: getBridgeQuote, isLoading } = getQuote({ address });
 
watch(amount, async (newAmount) => {
  if (!newAmount || parseFloat(newAmount) <= 0) {
    quote.value = null;
    return;
  }
 
  // Debounce
  const timeout = setTimeout(async () => {
    const result = await getBridgeQuote(
      1, // Ethereum
      '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48', // USDC
      parseUnits(newAmount, 6).toString(),
      43114, // Avalanche
      '0xB97EF9Ef8734C71904D8002F8b6Bc66Dd9c48a6E' // USDC.e
    );
    quote.value = result;
  }, 800);
 
  return () => clearTimeout(timeout);
});
</script>