Mooni widget allows to quickly add Mooni into any web app in minutes.

The widget can either appear as a modal on top of an app, or included inside an HTML element.

If the hosting app already has a connected user with web3, this wallet can be forwarded to the widget.

🎁 Quick start

Install

yarn add @mooni/widget

​NPM package​

Start widget

// Import package
import MooniWidget from '@mooni/widget';
​
// Instanciate the widget
const mooni = new MooniWidget();
​
// Open the widget as a modal when you want it
mooni.open();

📺 Example apps

An example app including Mooni widget have been published to let you try it out, or check the code.

🎛 Reference

Instanciation

• new MooniWidget(options = {})

  Instanciate a Mooni widget.

options.containerElement: Include Mooni inside of an HTML element on your website. If not set, the widget will appear as a modal.

options.web3Provider: Use your own connected web3 provider.

options.token: Add a custom token to the list of input currencies. This must be the address of the contract and the token must be available on Uniswap.

If used as a modal:

• mooni.open()

  Opens the Mooni widget modal.

• mooni.close()

  Closes the Mooni widget modal. Not mandatory, a button is present to enable the user to close it.

Additional information

Import on different module systems

• ES6

import MooniWidget from '@mooni/widget';

• CommonJS

const MooniWidget = require('@mooni/widget');

• UMD

<script src="https://unpkg.com/@mooni/widget"></script>
<script> 
  MooniWidget.open()
</script>