name: nexus-elements-transfer description: Install and use the Fast Transfer widget (registry name: transfer) from Nexus Elements. Use for intent-based cross-chain transfers to a recipient.
Nexus Elements - Transfer
Overview
Install the FastTransfer component (registry item name is transfer) for intent-based cross-chain transfers with allowance flow and progress UI.
Prerequisites
- NexusProvider installed and initialized on wallet connect.
- Wallet connection configured.
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/transfer
Alternative:
npx shadcn@latest add https://elements.nexus.availproject.org/r/transfer.json
Manual install (no shadcn)
- Download
https://elements.nexus.availproject.org/r/transfer.json. - Create each file in
files[].targetwithfiles[].content. - Install dependencies listed in
dependenciesand eachregistryDependenciesitem.
Usage
import FastTransfer from "@/components/transfer/transfer";
import { SUPPORTED_CHAINS } from "@avail-project/nexus-core";
<FastTransfer
prefill={{
token: "USDC",
chainId: SUPPORTED_CHAINS.BASE,
}}
=> {}}
=> {}}
=> console.error(message)}
/>
SDK flow mapping
- Uses
sdk.bridgeAndTransfer(...)under the hood. - Relies on intent + allowance hooks (
intent,allowance) for confirmation UI. - Progress updates come from
NEXUS_EVENTS.STEPS_LISTandNEXUS_EVENTS.STEP_COMPLETE.
Props (FastTransferProps)
prefill:{ token, chainId, amount?, recipient? }onStart,onComplete,onError
Notes
- Docs refer to this as
fast-transfer, but the registry item istransfer. - FastTransfer renders
ViewHistoryif installed.