@unifold/connect-react-native 0.1.10 → 0.1.11

package/README.md

@@ -83,6 +83,58 @@ function DepositScreen() {
 }
 ```
 
+## Theming & Customization
+
+The SDK provides comprehensive theming options. For full documentation, see [docs/theming.mdx](./docs/theming.mdx).
+
+### Quick Theme Setup
+
+```tsx
+<UnifoldProvider
+  publishableKey="pk_live_..."
+  config={{
+    appearance: "dark",        // 'light' | 'dark' | 'auto'
+    accentColor: "#8B5CF6",    // Brand color
+    
+    // Custom fonts (must be loaded by your app)
+    fonts: {
+      regular: "Inter-Regular",
+      medium: "Inter-Medium",
+      semibold: "Inter-SemiBold",
+    },
+    
+    // Full color customization
+    theme: {
+      dark: {
+        primary: "#8B5CF6",
+        background: "#0F0F10",
+        card: "#1A1A1D",
+      }
+    },
+    
+    // Granular component overrides
+    components: {
+      header: { titleColor: "#FFFFFF" },
+      card: { backgroundColor: "#1A1A1D" },
+    }
+  }}
+>
+```
+
+### Pre-selecting Source Token
+
+```tsx
+await beginDeposit({
+  externalUserId: "user_123",
+  // ... destination params
+  
+  // Pre-select USDC on Polygon as the source token
+  defaultChainType: "ethereum",
+  defaultChainId: "137",
+  defaultTokenAddress: "0x2791bca1f2de4661ed88a30c99a7a9449aa84174",
+});
+```
+
 ## API Reference
 
 ### UnifoldProvider
@@ -93,6 +145,12 @@ function DepositScreen() {
 | `config.appearance` | `'light' \| 'dark' \| 'auto'` | No | Theme mode (default: `'dark'`) |
 | `config.modalTitle` | `string` | No | Custom modal title |
 | `config.hideDepositTracker` | `boolean` | No | Hide the deposit tracker button |
+| `config.transferInputVariant` | `'single_input' \| 'double_input'` | No | Token selector style (default: `'double_input'`) |
+| `config.accentColor` | `string` | No | Primary brand color |
+| `config.theme` | `ThemeConfig` | No | Full color customization |
+| `config.fontFamily` | `string` | No | Single font family for all text |
+| `config.fonts` | `FontConfig` | No | Granular font weight configuration |
+| `config.components` | `ComponentConfig` | No | Component-specific token overrides |
 
 ### useUnifold Hook
 
@@ -116,6 +174,9 @@ const { beginDeposit, closeDeposit, publishableKey } = useUnifold();
 | `destinationTokenAddress` | `string` | No | Target token contract address |
 | `destinationTokenSymbol` | `string` | No | Target token symbol (e.g., `'USDC'`) |
 | `recipientAddress` | `string` | No | Wallet address to receive funds |
+| `defaultChainType` | `'ethereum' \| 'solana' \| 'bitcoin'` | No | Pre-select source network type |
+| `defaultChainId` | `string` | No | Pre-select source chain ID |
+| `defaultTokenAddress` | `string` | No | Pre-select source token address |
 | `onSuccess` | `(data: DepositResult) => void` | No | Called when deposit succeeds |
 | `onError` | `(error: DepositError) => void` | No | Called when an error occurs |
 
@@ -149,6 +210,9 @@ import type {
   DepositResult, 
   DepositError,
   ThemeMode,
+  ThemeConfig,
+  FontConfig,
+  ComponentConfig,
   UnifoldProviderProps,
 } from '@unifold/connect-react-native';
 ```