feat: add @avalanche-sdk/ui package

[0xstt]

Add @avalanche-sdk/ui Package

Overview

This PR introduces the @avalanche-sdk/ui package - a comprehensive React component library and TypeScript utilities for building Avalanche blockchain applications. This package provides ready-to-use UI components for wallet management, token transfers, staking, earning, and interchain operations.

Package Details

• Package Name: @avalanche-sdk/ui
• Version: 0.1.0
• License: BSD-3-Clause
• Type: ESM Module
• Node Requirement: >=20.0.0

Key Features

Core Components

• Wallet Components: Connect, balance display, portfolio, transactions, network selector
• Transfer Components: Cross-chain transfers, amount inputs, chain selectors
• Staking Components: Validator selection, duration input, stake management
• Earn Components: Pool listings, deposit/withdraw, provider integration (Aave, Benqi)
• ICTT Components: Interchain token transfer interface with home/mirror token support
• Chain Components: Chain logos, selectors, and configuration utilities
• Token Components: Token selection, display, and management

Additional Features

• Theme System: Customizable Avalanche-themed UI with light/dark mode support
• shadcn/ui Integration: Pre-built accessible components
• TypeScript: Full type safety with comprehensive type definitions
• Tree-shaking Support: Optimized bundle sizes with sideEffects: false

Dependencies

Peer Dependencies

• react: ^18 || ^19
• react-dom: ^18 || ^19
• viem: ^2.0.0

Dependencies

• @avalanche-sdk/chainkit: 0.3.0-alpha.8
• @avalanche-sdk/client: ^0.0.4-alpha.16
• @avalanche-sdk/interchain: ^0.1.1-alpha.1
• Radix UI components (dialog, dropdown, select, tabs, toast, etc.)
• Tailwind CSS utilities

Notes

• The playground (ui/playground/) references the published package (^0.1.0) rather than workspace protocol, as the root pnpm-workspace.yaml is not tracked in git
• Minor TypeScript errors exist in the playground (non-blocking, can be addressed in follow-up)
• Package is ready for initial publish to npm

Next Steps

After merge:

1. Create git tag: ui/v0.1.0
2. GitHub Actions will automatically publish to npm
3. Package will be available as @avalanche-sdk/ui@0.1.0

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
avalanche-sdk-typescript	Ready	Preview	Comment	Nov 11, 2025 9:21am

[SayanKar]

Lets switch to v0.1.0-alpha.2 as we have some breaking changes where the avalanche specific txn preparation methods and the send txn method takes amount in nAvax instead of avax.

[SayanKar]

I think we can define the type for the params and returned values for most of the methods in a separate types file And use those here. Also we expose a Address type from client (reexport of viem), which can be used instead of 0x${string}

[SayanKar]

I think you already have it, just need to move the type definitions here ui/src/earn/types.ts