> ## Documentation Index
> Fetch the complete documentation index at: https://anypay-docs-sdk-0-15-0-updates.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Configuration

> Complete configuration reference for the Trails SDK

## Focused components

### Shared props

All focused components accept these optional props in addition to their mode-specific props.

#### Appearance

| Prop           | Type                               | Default  | Description                                   |
| -------------- | ---------------------------------- | -------- | --------------------------------------------- |
| `theme`        | `"light" \| "dark" \| "auto"`      | `"auto"` | Color theme; `auto` follows system preference |
| `customCss`    | `string \| Record<string, string>` | —        | Custom CSS to inject into the widget          |
| `disableCss`   | `boolean`                          | `false`  | Disable default CSS injection                 |
| `renderInline` | `boolean`                          | `false`  | Render inline instead of as a modal           |
| `buttonText`   | `string`                           | —        | Custom CTA button text                        |

#### App metadata

Used in wallet connection dialogs (WalletConnect, etc.):

```tsx theme={null}
appMetadata={{
  name: "My App",
  url: "https://myapp.com",
  imageUrl: "https://myapp.com/logo.png",
  description: "Short description",
}}
```

#### Wallet options

| Prop                     | Type          | Description                                                         |
| ------------------------ | ------------- | ------------------------------------------------------------------- |
| `walletConnectProjectId` | `string`      | WalletConnect project ID                                            |
| `walletOptions`          | `string[]`    | Wallet connector IDs to show (e.g. `["metamask", "walletconnect"]`) |
| `wagmiConnectors`        | `Connector[]` | Custom wagmi connectors                                             |
| `decoupleWagmi`          | `boolean`     | Decouple from external wagmi provider                               |
| `hideDisconnect`         | `boolean`     | Hide the disconnect button                                          |
| `hideAddWallet`          | `boolean`     | Hide "Add wallet" option                                            |
| `isSmartWallet`          | `boolean`     | Signal that the connected wallet is a smart wallet                  |

#### Route options

| Prop                             | Type                    | Description                                           |
| -------------------------------- | ----------------------- | ----------------------------------------------------- |
| `slippageTolerance`              | `number \| string`      | Slippage tolerance (e.g. `0.005` for 0.5%)            |
| `swapProvider`                   | `RouteProvider`         | Preferred same-chain swap provider                    |
| `swapProviderFallback`           | `boolean`               | Fall back if preferred swap provider is unavailable   |
| `bridgeProvider`                 | `RouteProvider`         | Preferred bridge provider                             |
| `bridgeProviderFallback`         | `boolean`               | Fall back if preferred bridge provider is unavailable |
| `priceImpactWarningThresholdBps` | `number`                | Basis points before showing a price impact warning    |
| `priceImpactWarningMessage`      | `string`                | Custom price impact warning message                   |
| `priceImpactFallbackBridgeUrl`   | `string`                | URL to redirect when price impact is too high         |
| `intentProtocolVersion`          | `IntentProtocolVersion` | Force a specific intent protocol version              |

#### Debug / dev

```tsx theme={null}
dev={{
  debug: true,
  sequenceIndexerUrl: "https://...",
  trailsApiUrl: "https://...",
}}
```

#### General callbacks

These callbacks are available on all focused components (in addition to mode-specific lifecycle callbacks):

| Callback                    | When it fires                           |
| --------------------------- | --------------------------------------- |
| `onOpen`                    | Widget modal opens                      |
| `onClose`                   | Widget modal closes                     |
| `onOriginConfirmation`      | Origin-chain transaction confirmed      |
| `onDestinationConfirmation` | Destination-chain transaction confirmed |
| `onQuote`                   | Quote is received                       |
| `onSignRequest`             | Wallet signature requested              |
| `onSign`                    | Wallet signature obtained               |
| `onSignReject`              | User rejected the signature             |
| `onApproveRequest`          | ERC-20 approval requested               |
| `onApprove`                 | ERC-20 approval confirmed               |
| `onApproveReject`           | User rejected the approval              |
| `onStatus`                  | Transaction status update               |

### ChainIdentifier

All `chain` fields accept a `ChainIdentifier`, which can be:

* A chain name string: `"base"`, `"ethereum"`, `"polygon"`, `"arbitrum"`, `"optimism"`, `"avalanche"`, `"bsc"`, `"katana"`, etc.
* A numeric chain ID: `8453`, `1`, `137`, etc.
* A viem `Chain` object

### PaymentMethod

The `paymentMethod` prop on focused components accepts:

| Value                 | Method                                  |
| --------------------- | --------------------------------------- |
| `"CONNECTED_WALLET"`  | Connected wallet (default when omitted) |
| `"CRYPTO_TRANSFER"`   | QR code / address deposit               |
| `"CREDIT_DEBIT_CARD"` | Fiat on-ramp (credit/debit card)        |
| `"EXCHANGE"`          | CEX transfer (Coinbase, Binance, etc.)  |

### Mode-specific props

See the individual mode pages for full prop details:

* [Pay](/sdk/modes/pay) — `to.recipient`, `to.currency`, `to.chain`, `to.amount`, `payMessage`, `onPaymentStart/Success/Error`
* [Fund](/sdk/modes/fund) — `to`, `fundMethodsList`, `hideUnlistedFundMethods`, `hideSwap`, `onFundingStart/Success/Error`
* [Swap](/sdk/modes/swap) — `from`, `to`, `onSwapStart/Success/Error`
* [Withdraw](/sdk/modes/withdraw) — `from`, `to`, `onWithdrawStart/Success/Error`
* [Earn](/sdk/modes/earn) — `to` with `calldata`, `onEarnStart/Success/Error`