Nexus Elements - Fast Bridge
Overview
Install the FastBridge component and wire it to NexusProvider for intent-based bridging with allowance handling and progress steps.
Prerequisites
- NexusProvider installed and initialized on wallet connect.
- Wallet connection configured; you have the connected wallet address.
Install (shadcn registry)
- Ensure shadcn/ui is initialized (
components.jsonexists). - Ensure registry mapping exists:
"registries": {
"@nexus-elements/": "https://elements.nexus.availproject.org/r/{name}.json"
}
- Install:
npx shadcn@latest add @nexus-elements/fast-bridge
Alternative:
npx shadcn@latest add https://elements.nexus.availproject.org/r/fast-bridge.json
Manual install (no shadcn)
- Download
https://elements.nexus.availproject.org/r/fast-bridge.json. - Create each file in
files[].targetwithfiles[].content. - Install dependencies listed in
dependenciesand eachregistryDependenciesitem.
Usage
import FastBridge from "@/components/fast-bridge/fast-bridge";
import { SUPPORTED_CHAINS } from "@avail-project/nexus-core";
<FastBridge
connectedAddress={address}
prefill={{
token: "USDC",
chainId: SUPPORTED_CHAINS.BASE,
}}
=> {}}
=> {}}
=> console.error(message)}
/>
SDK flow mapping
- Uses
sdk.bridge(...)under the hood (intent-based bridge). - Relies on intent + allowance hooks (
intent,allowance) for confirmation UI. - Progress updates come from
NEXUS_EVENTS.STEPS_LISTandNEXUS_EVENTS.STEP_COMPLETE.
Props (FastBridgeProps)
connectedAddress: connected wallet address (required)prefill:{ token, chainId, amount?, recipient? }onStart,onComplete,onError
Notes
- FastBridge renders
ViewHistoryif installed; keep it if you want intent history. - If the wallet disconnects, ensure you re-run
handleIniton reconnect.