1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
import { ZentraTerminal } from '@zentrafi/terminal'
import '@zentrafi/terminal/styles'
<ZentraTerminal initProps={{
// ── Display ──────────────────────────────────────────
// "Integrated" | "Modal" | "Widget"
displayMode: "Integrated",
// ── Theme ────────────────────────────────────────────
// "Dark" | "Light"
themeType: "Dark",
// Fine-grained color overrides (all fields optional)
theme: {
"bg_primary": "#0a0f1a",
"primary": "#97CBDC",
"text_primary": "#FFFFFF",
"text_secondary": "rgba(151,203,220,0.50)",
"success": "#4ade80",
"warning": "#fbbf24",
"error": "#f87171",
"btn_text": "#0a0f1a",
"bg_overlay": "rgba(10,15,26,0.85)",
"border": "#475B74"
},
// ── Wallet ───────────────────────────────────────────
// true → terminal manages its own wallet connection
// false → reuses host dApp's wagmi/RainbowKit context
independentWallet: true,
walletConnectProjectId: "YOUR_WALLETCONNECT_PROJECT_ID",
// App name shown in wallet connection dialogs
appName: "My dApp",
// ── Token defaults ───────────────────────────────────
// Accepts token symbol ("PHRS", "USDC") or address ("0x..." / "NATIVE")
defaultPair: { from: "PHRS", to: "USDC" },
// Slippage tolerance in percent (e.g. 0.5 = 0.5%)
initialSlippage: 0.5,
// ── Widget options (displayMode: "Widget" only) ───────
// "bottom-right" | "bottom-left" | "top-right" | "top-left"
widgetPosition: "bottom-right",
// "default" | "small"
widgetSize: "default",
// ── Branding ─────────────────────────────────────────
// Show "Powered by ZentraFi" footer
showBranding: true,
// Custom logo URL (replaces default ZentraFi icon on FAB / Modal trigger)
// logoUrl: "https://your-domain.com/logo.png",
// ── Callbacks ────────────────────────────────────────
onSwapSuccess: (txHash) => console.log("Swap succeeded:", txHash),
onError: (error) => console.error("Swap error:", error),
}} />