nexus-elements-overview

Select the right Nexus Elements sub-skill and ensure prerequisites (shadcn registry + NexusProvider + wallet connection) are in place.

• Ensure shadcn/ui is initialized (a components.json exists) or be ready to manual copy files from /r JSON.
• Ensure wallet connection is configured (wagmi or any EIP-1193 provider).
• Install and wrap the app with NexusProvider; call handleInit on wallet connect.

Provider setup (minimal)

```tsx

"use client";

import NexusProvider from "@/components/nexus/NexusProvider";

export default function RootLayout({ children }: { children: React.ReactNode }) {

return {children};

}

```

```tsx

"use client";

import { useEffect } from "react";

import { useAccount } from "wagmi";

import type { EthereumProvider } from "@avail-project/nexus-core";

import { useNexus } from "@/components/nexus/NexusProvider";

export function InitNexusOnConnect() {

const { status, connector } = useAccount();

const { handleInit } = useNexus();

useEffect(() => {

if (status === "connected") {

connector?.getProvider().then((p) => handleInit(p as EthereumProvider));

}

}, [status, connector, handleInit]);

return null;

}

```

• Base registry URL: https://elements.nexus.availproject.org/r/{name}.json
• If components.json exists, ensure this registry mapping exists:

```json

"registries": {

"@nexus-elements/": "https://elements.nexus.availproject.org/r/{name}.json"

}

```

• Fast bridge UI: nexus-elements-fast-bridge
• Transfer UI: nexus-elements-transfer (registry name is transfer, docs sometimes say fast-transfer)
• Deposit widget (swap + execute via swapAndExecute): nexus-elements-deposit
• Bridge deposit (bridge + execute via bridgeAndExecute): nexus-elements-bridge-deposit
• Swaps widget: nexus-elements-swaps
• Unified balance display: nexus-elements-unified-balance
• View history (intent history): nexus-elements-view-history (no view-intent component exists)
• Provider setup: nexus-elements-nexus-provider
• Shared hooks/utils: nexus-elements-common

• Fast bridge → sdk.bridge + intent/allowance hooks + NEXUS_EVENTS.STEPS_LIST/STEP_COMPLETE.
• Transfer → sdk.bridgeAndTransfer + intent/allowance hooks.
• Deposit → sdk.swapAndExecute + swap intent hook (swapIntent).
• Bridge deposit → sdk.bridgeAndExecute + intent/allowance hooks.
• Swaps → sdk.swapWithExactIn / sdk.swapWithExactOut + swap intent hook + NEXUS_EVENTS.SWAP_STEP_COMPLETE.
• Unified balance → sdk.getBalancesForBridge / sdk.getBalancesForSwap (via NexusProvider).
• View history → sdk.getMyIntents().

If shadcn is not initialized, use the /r JSON for a component and create each file in files[].target with files[].content. Repeat for all registryDependencies listed in that JSON and install the dependencies array.