lifinance / widget

LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.
https://li.fi/widget
Apache License 2.0
114 stars 74 forks source link
bridge bridge-aggregation cross-chain cross-chain-applications cross-chain-bridge cross-chain-swap dapp defi ethereum integration lifi react solana ui viem wagmi web3 widget
[![license](https://img.shields.io/badge/license-Apache%202-blue)](/LICENSE.md) [![npm latest package](https://img.shields.io/npm/v/@lifi/widget/latest.svg)](https://www.npmjs.com/package/@lifi/widget) [![npm downloads](https://img.shields.io/npm/dm/@lifi/widget.svg)](https://www.npmjs.com/package/@lifi/widget) [![Crowdin](https://badges.crowdin.net/lifi-widget/localized.svg)](https://crowdin.com/project/lifi-widget) [![Follow on Twitter](https://img.shields.io/twitter/follow/lifiprotocol.svg?label=follow+LI.FI)](https://twitter.com/lifiprotocol)

LI.FI Widget

GitHub_Repo_Card

LI.FI Widget is a set of prebuilt UI components that will help you integrate a secure cross-chain bridging and swapping experience that can be styled to match your web app design perfectly and helps drive your multi-chain strategy and attract new users from everywhere.

LI.FI Widget features include:

Installation

LI.FI Widget

LI.FI Widget is available as an npm package.

npm:

npm install @lifi/widget

yarn:

yarn add @lifi/widget

LI.FI Wallet Management

LI.FI Wallet Management is available as an npm package.

npm:

npm install @lifi/wallet-management

yarn:

yarn add @lifi/wallet-management

Getting started with LI.FI Widget

Here is an example of a basic app using LI.FI Widget:

import { LiFiWidget, WidgetConfig } from '@lifi/widget';

const widgetConfig: WidgetConfig = {
  theme: {
    container: {
      border: '1px solid rgb(234, 234, 234)',
      borderRadius: '16px',
    },
  },
};

export const WidgetPage = () => {
  return (
    <LiFiWidget integrator="Your dApp/company name" config={widgetConfig} />
  );
};

Examples

Visit our playground to see how you can customize your LI.FI Widget experience. Additionally, see examples folder in this repository.

Documentation

Please visit LI.FI Widget Documentation.

Contributing Translations

We appreciate your interest in helping translate our project!

If you'd like to contribute translations, please visit our Crowdin project page at Crowdin LI.FI Widget. Register on Crowdin and you can start translating the project into your preferred language. Your contributions will help make our project accessible to a wider audience around the world.

Thank you for your support!

Changelog

The changelog is regularly updated to reflect what's changed in each new release.

License

This project is licensed under the terms of the Apache-2.0.