Widget

The MAAT Widget allows developers to embed MAAT’s functionality into their websites. It offers two integration methods: an iFrame for fast setup or an npm package for deep customization. Both options include deposit management, portfolio tracking, and multi-network support.

Integration Methods

iFrame

The iFrame option provides a pre-configured, customizable widget that can be embedded by generating a URL through the widget constructor. Developers can modify UI elements such as button and container rounding, colors, and select from predefined themes (Light, Dark, Ocean). Once configured, the iFrame code can be copied and inserted into any platform, requiring minimal effort for integration.

npm package

For more control, the npm package allows developers to integrate a React component directly into their projects. This method offers full control over the widget’s behavior and styling, making it suitable for developers looking for a native integration with deeper customization options.

Key Features

The widget includes real-time APY display for USDC and USDT, enabling users to view returns before depositing. Users can also switch between networks and select different vaults for deposit management.

For setup, developers can either copy the iFrame URL or install the npm package, which includes not only the React component but also helper functions for API interactions, TypeScript definitions, and built-in analytics integration. This ensures consistency across projects and simplifies future updates.