@tap-payments/auth-jsconnect

v2.7.6

Published

2 days ago

connect library, auth

Downloads

2,072

0High
0Medium
0Low

Auth-JsConnect

Handling user authentication and identification

Install

This is a React module available through the npm registry. Installation is done using the npm install command:

npm install @tap-payments/auth-jsconnect

---------------------------- OR -------------------------

yarn add @tap-payments/auth-jsconnect

Features

Examples

ES6

import { ConnectLib } from '@tap-payments/auth-jsconnect'

const App = () => {
	return (
		<ConnectLib
			open={true}
			merchantDomain={'https://www.example.com'}
			publicKey={'pk_test_xxxxxx'}
			appInfo={{
				identifier: 'tap_connect_demo',
				name: 'Tap Connect Demo',
				version: 'V2.0.0'
			}}
			businessCountryCode='SA'
			language='en'
			onError={(error) => {
				alert(JSON.stringify({ error }))
			}}
			onFlowCompleted={(data) => {
				console.log(data)
			}}
			onReady={() => {
				console.log('ready!')
			}}
			onStepCompleted={(name, data) => {
				console.log(name, data)
			}}
			onStepStarted={(name) => {
				console.log(name)
			}}
			scope={[]}
		/>
	)
}

Vanilla JS

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,shrink-to-fit=no" />
    <title>Auth-JsConnect</title>
    <script src="https://auth-jsconnect.b-cdn.net/build-2.0.0/main.js"></script>
    <link href="https://auth-jsconnect.b-cdn.net/build-2.0.0/main.css" rel="stylesheet" />
  </head>
  <body>
    <div id="root"></div>
    <script>
      const { renderConnectLib, unmountConnectLib } = window.TapAuth
      const startConnect = () => {
       const {unmount}= renderConnectLib(
                      {
                        open: true,
                        merchantDomain: window.location.origin,
                        publicKey: "pk_test_lat64TEDSvHrUOYAxVRe28PQ",
                        appInfo: {
                          identifier: "tap_connect_demo",
                          name: "Tap Connect Demo",
                          version: "V2.0.0"
                        },
                        businessCountryCode: "SA",
                        language: "en",
                        onError: (error) => {
                          alert(JSON.stringify({ error }))
                        },
                        onFlowCompleted: (data) => {
                          console.log(data)
                        },
                        onReady: () => {
                          console.log("ready!")
                        },
                        onStepCompleted: (name, data) => {
                          console.log(name, data)
                        },
                        onStepError: (name, error) => {
                          console.log(name, error)
                        },
                        onStepStarted: (name) => {
                          console.log(name)
                        },
                        scope: []
                      },

          "root"
        )
      }
      const stopConnect = () => {
        unmount("root")
      }

    </script>
    <button onclick="startConnect()">Start</button>
    <button onclick="stopConnect()">Stop</button>
  </body>
</html>


## Connect
- Help our merchants to create a account with Tap Payments

## Business

## Password

## Individual

## Bank

## Tax

Properties

| name | description | | ----------------------------------------- | ----------------------------------------------------------------------- | | open required - boolean | open/close the library | | merchantDomain required - string | domain name https://expamle.com | | publicKey required - string | merchant public key | | appInfo required | it's an object from type AppInfo | | businessCountryCode required - string | merchant country code and it should be the ISO2 of the country | | scope required - string | it's an string | | language required - string | it can be enor ar | | onError required - function | callback function will call in case of any error happened | | onFlowCompleted required - function | callback function will called after completing the flow | | onReady required - function | callback function will call after loading library configuration | | onStepError required - function | callback function will call in case if any error happened in the screen | | onStepStarted required - function | callback function will call in the begging of each step |

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme