Tab Config

Configure titles, default chains, assets, currencies for each tab. You can also specify allowed chains, allowed tokens for each tab.

All tabs are enabled by default and have the following titles:

• Tabs.SWAP: 'IBC Swaps'

• Tabs.TRANSFER: 'Send'

• Tabs.FIAT_ON_RAMP: 'Fiat On-Ramp'

• Tabs.AGGREGATED: 'Bridge'

import { Tabs, SELECT_NONE, SELECT_NATIVE } from '@leapwallet/elements'

const tabsConfig = {
  [Tabs.SWAP]: {
    className: 'border',
    showPoweredByBanner: true,
    enabled: true
  },
  [Tabs.FIAT_ON_RAMP]: {
    className: 'border',
    enabled: true,
    showPoweredByBanner: true,
    defaultValues: {
      currency: 'USD',
      destinationChainId: 'cosmoshub-4',
      destinationAsset: {
        originChainId: 'cosmoshub-4',
        originDenom: 'uatom'
      }
    }
  },
  [Tabs.AGGREGATED]: {
    className: 'border',
    enabled: true,
    showPoweredByBanner: false,
    defaultValues: {
      sourceChainId: '1',
      sourceAsset: {
        originChainId: '1',
        originDenom: '0x4Fabb145d64652a948d72533023f6E7A623C7C53'
      },
    }
  },
  [Tabs.TRANSFER]: {
    className: 'border',
    enabled: true,
    showPoweredByBanner: false,
    defaultValues: {
      sourceChainId: 'osmosis-1',
      sourceAsset: {
        originChainId: 'osmosis-1',
        originDenom: 'uosmo'
      },
    }
  }
}

Type Definition

Here's the type definitions for TabsConfig. You don't need to go through this, if your code editor has TS/auto-completion support, it will do the job for you.

export type TabConfig<K = unknown> = Prettify<
  {
    enabled?: boolean
    orderIndex?: number
  } & K
>


export type IBCSwapTabConfig = TabConfig<
 IBCSwapsProps
>

export type FiatOnRampTabConfig = TabConfig<
  FiatOnRampProps
>

export type AggregatedSwapTabConfig = TabConfig<
  SwapsProps
>

export type TransferTabConfig = TabConfig<
  IBCTransferProps
>


export type TabsConfig = {
  [Tabs.SWAP]?: IBCSwapTabConfig
  [Tabs.TRANSFER]?: TransferTabConfig
  [Tabs.FIAT_ON_RAMP]?: FiatOnRampTabConfig
  [Tabs.AGGREGATED]?: AggregatedSwapTabConfig
}