+
+
+ {/* Token selector */}
+
+ 
+
+
+
+
+ + {connection.name} +
++ {connection.chainId} +
+
+
+
+ Active
+
+
+
+
+
+
+ {/* Balance */}
+ {selectedToken && (
+
+
+ {/* Address input */}
+ + {`Balance: ${formatBalances( + ethers.formatUnits( + selectedTokenInfo?.amount || 0, + selectedTokenInfo?.exponent || 18 + ) + )} ${selectedToken}`} +
+ )} +
+
+ setAddress(e.target.value)}
+ style={{
+ backgroundColor: theme.bgColor,
+ borderColor: "transparent",
+ color: theme.primaryTextColor,
+ }}
+ className="border-0 placeholder:text-gray-500"
+ />
+
+
+ {/* Amount input */}
+
+
+ setAmount(e.target.value)}
+ style={{
+ backgroundColor: theme.bgColor,
+ borderColor: "transparent",
+ color: theme.primaryTextColor,
+ MozAppearance: "textfield",
+ }}
+ className="border-0 placeholder:text-gray-500 [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
+ />
+
+
+ {/* Send button */}
+
+
+ {/* Show explorer */}
+
+
+ + {`Want to verify balances on ${connection.name}? `} + + View on Explorer + +
+
+ {/* Header */}
+
+
+
+
+
+ );
+}
diff --git a/src/components/ui/icons.tsx b/src/components/ui/icons.tsx
index 9e2dd80..fb5a7c4 100644
--- a/src/components/ui/icons.tsx
+++ b/src/components/ui/icons.tsx
@@ -440,3 +440,26 @@ export function ArrowDownIcon(props: React.SVGProps
+
+
+ {/* Stats cards */}
+
+
+ + IBC Bridges +
++ Transfer tokens between KiiChain and other Cosmos chains +
+
+
+
+ {/* Bridge Cards */}
+
+ {connections.map((connection) => (
+
+
+ {/* Info Section */}
+
+
+
+ i
+
+
+
+ + About IBC Transfers +
++ Inter-Blockchain Communication (IBC) allows secure token + transfers between different Cosmos chains. Transfers typically + take 1-3 minutes to complete and require a small fee on both + source and destination chains. +
+