Yours Wallet Provider 🌱

A React provider to make interactions with Yours Wallet a breeze.

Description

The Yours Wallet Provider simplifies the process of integrating Yours Wallet into your react application by creating a provider that wraps your application.

For detailed instructions on integration and all available methods, be sure to check out the Provider API Docs.

Installation

Install the package using npm:

npm install yours-wallet-provider

Usage

Setup the Provider

First, wrap your application with the YoursProvider.

//... other imports
import { YoursProvider } from "yours-wallet-provider";

const root = ReactDOM.createRoot(
  document.getElementById("root") as HTMLElement
);
root.render(
  <YoursProvider>
    <App />
  </YoursProvider>
);

Use the Wallet Hook

You can now use the useYoursWallet hook to interact with the wallet.

import { useYoursWallet } from 'yours-wallet-provider';

function YourComponent() {
  const wallet = useYoursWallet();
  const isReady = wallet.isReady;
  console.log(isReady);
  // true

  return (
    // Your TSX
  );
}

Use the Yours.org Icon

You can also import the YoursIcon for use in your project.

import { YoursIcon } from "yours-wallet-provider";

function YourComponent() {
  return (
    <div>
      <YoursIcon size="32px" />
    </div>
  );
}