@broxus/tvm-connect

TVM Connect

This is a powerful and easy-to-use TypeScript SDK designed to simplify connecting to crypto wallets that work with TVM-compatible blockchains (such as TON, Hamster, Everscale and so on) via Nekoton, as well as interacting with dApps (decentralized applications) that use Nekoton to work with the blockchain. It provides a unified interface for connecting to various types of wallets, making dApp development more efficient and convenient.

Table of Contents

• Usage
• Advanced usage
• React integration
• Styling
• Helpful utils
• Migration from v2 to v3
• License

Installation and requirements

To apply this component, install it with npm using following command:

npm install @broxus/tvm-connect

or using yarn:

yarn add @broxus/tvm-connect

Usage

This section covers the basic usage of the TvmConnect component, which is the main entry point for connecting to Nekoton-compatible wallets and interacting with dApps. It provides a simple and intuitive API for developers to integrate wallet connections into their applications, manage network configurations, and handle user interactions with wallets.

Read more ➜

Advanced usage

This section provides a more in-depth look at the TvmConnect SDK, focusing on its framework-agnostic service (TvmConnectService) and how to configure networks and providers. It also covers advanced usage scenarios, such as integrating with different UI frameworks (like React) and customizing wallet connections. This allows developers to create tailored user experiences while maintaining the core functionality of connecting to Nekoton-compatible wallets.

Read more ➜

React integration

TvmConnect provides ready-to-use React components and hooks to simplify integration with React applications. These components handle wallet connection UI, state management, and reactive updates when connection status changes.

When using React integration, you should import TvmConnect and related components from the /react submodule instead of the root. The /react submodule already includes everything from the /sdk submodule (all classes, wallet connectors, networks), so you don't need to import them separately.

Read more ➜

Styling

This section describes how to apply the default styles for the TvmConnect components, ensuring that all components and dialogs are styled correctly. It covers both standalone styles and inherited styles, as well as how to use CSS variables (CSS-tokens) for customization. This allows developers to easily adapt the appearance of the TvmConnect components to match their application's design while maintaining a consistent user interface.

Read more ➜

Helpful utils

You can use isSparXWalletBrowser, isEverWalletBrowser or isVenomWalletBrowser to check the environment.

• isSparXWalletBrowser(userAgent: string): boolean - checks if your dApp is opened in mobile SparX Wallet WebView
• isEverWalletBrowser(userAgent: string): boolean - checks if your dApp is opened in mobile Ever Wallet WebView
• isVenomWalletBrowser(userAgent: string): boolean - checks if your dApp is opened in mobile Venom Wallet WebView
• isNekotonWebview(userAgent: string): boolean - checks if your dApp is opened in mobile WebView of any of the mobile wallets above
• getRecentConnectionMeta(storageKey?: string): TvmRecentConnectionMeta - retrieves the last connection metadata from localStorage
• storeRecentConnectionMeta(meta: TvmRecentConnectionMeta, storageKey?: string): void - saves the last connection metadata to localStorage
• toChainParams(networkConfig: TvmNetworkConfig): AddNetwork - converts the network configuration to chain parameters

This will help you determine which connectors to use for mobile applications and for all other cases.

Migration from v2 to v3

If you are migrating from version 2 to version 3 of the tvm-connect, please refer to the migration guide for detailed instructions on how to update your codebase. The migration guide covers breaking changes, new features, and best practices for transitioning to the latest version of the SDK. It is essential to follow the migration steps to ensure compatibility with the new version and to take advantage of the improvements and enhancements introduced in v3.

License

This project is licensed under the GNU Affero General Public License version 3 - see the LICENSE file for details or view license on OpenSourceInitiative.