Package Exports

@socket.tech/plugin
@socket.tech/plugin/dist/index.es.js
@socket.tech/plugin/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@socket.tech/plugin) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Socket Plugin

Seamless bridging experience into a single fully customizable React Component

Socket Plugin is a React component that can be easily imported in any React (JS/TS) project. The plugin supports most features from Bungee.exchange. It brings the seamless bridging UX from Bungee to any DApp!

Themes

The plugin requires provider from user’s connected wallet & Socket’s API_KEY as props to initialise. Optional props can be passed to customize the plugin’s color scheme, pre-select the chains/tokens & also customize token lists.

The full documentation for the plugin can be found here

Installation

The plugin can be installed via NPM or Yarn.

NPM :

npm install @socket.tech/plugin

Yarn :

yarn add @socket.tech/plugin

Note : The plugin requires react (>=17.0.1) and react-dom (>=17.0.1) as peerDepencies.

Initialization

Copy the snippet below to get started! Pass the API_KEY from a .env file and Provider from user’s connected wallet.

import { Bridge } from "@socket.tech/plugin";
import { Provider } from "./providerComponent"

function SocketBridge() {
    return (    
        <Bridge
      provider={Provider}
      API_KEY={process.env.SOCKET_API_KEY} 
    />
    )
}

export default SocketBridge;

That’s it! You’ve successfully plugged your DApp into Socket! 🔌 For further customising the plugin, check the plugin docs.

JSPM

@socket.tech/plugin

Package Exports

Readme

Socket Plugin

Installation

Initialization

Documentation

Example App

More themes... 😎