0.4.5 • Published 3 years ago

yibanchen-login-react v0.4.5

Weekly downloads
-
License
Apache
Repository
-
Last release
3 years ago

YibanChen React Login

This package contains React components to allow verification with YibanChen addresses via the Polkadot browser extension.

Installation

npm i yibanchen-login-react

To make sure Bootstrap styles are loaded, add

import "bootstrap/dist/css/bootstrap.css";

into the file importing the component(s).

Components and Props

LoginButton

Description

A button that enables a user to sign in with their Substrate/Polkadot wallet

Props

PropTypeDescription
messageDatastringThe message to be signed (required)
signedDatastringIf not first log in, The signed data to verify (required)
walletAddressstringThe address of the Polkadot/Substrate wallet (required)
firstTimeLoginbooleanBoolean indicating if this is the wallet's first log in (required)
handleSignedDatafunctionA function from the parent component to handle the signed data after signing
handleDataWasVerifiedfunctionA function from the parent component to handle whether the data was signed or verified after successful login
handleVerificationAttemptedfunctionA function from the parent component to handle whether verification was attempted
buttonSizestringSize of the login button, options are 'sm', 'md', or "lg" (default "md")
buttonBackgroundstringColor of the button background (default "#F19135")
buttonBorderstringColor of the button border (default "#F19135")
identiconThemestringtheme for the Polkadot identicon, options are 'polkadot', 'substrate', 'beachball' or 'jdenticon'
walletNamestringname attached to the wallet (optional)

Example

<LoginButton
  messageData={this.dataToSign}
  signedData={this.findSignedData()}
  walletAddress={this.state.selectedAccount.address}
  firstTimeLogin={this.determineIfFirstTimeLogin(
    this.state.selectedAccount.address
  )}
  handleSignedData={this.setSignedData}
  handleDataWasVerified={(data) => {
    this.setState({ dataWasVerified: data });
  }}
  handleVerificationAttempted={(data) => {
    this.setState({ verificationAttempted: data });
  }}
  buttonSize={"lg"}
  identiconTheme={"polkadot"}
></LoginButton>
0.3.9

3 years ago

0.4.5

3 years ago

0.4.4

3 years ago

0.3.8

3 years ago

0.3.7

3 years ago

0.4.1

3 years ago

0.4.3

3 years ago

0.4.2

3 years ago

0.3.6

3 years ago

0.3.5

3 years ago

0.3.4

3 years ago

0.3.3

3 years ago

0.3.2

3 years ago

0.3.1

3 years ago

0.2.9

3 years ago

0.2.8

3 years ago

0.2.7

3 years ago

0.2.6

3 years ago

0.2.4

3 years ago

0.2.3

3 years ago

0.2.2

3 years ago

0.2.1

3 years ago

0.1.9

3 years ago

0.1.8

3 years ago

0.1.7

3 years ago

0.1.6

3 years ago

0.1.5

3 years ago

0.1.3

3 years ago

0.1.2

3 years ago

0.1.1

3 years ago

0.1.0

3 years ago