@tap-payments/connect 0.0.13-test → 0.0.15-test

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,178 +1,181 @@
1
- # Connect Package
2
-
3
- Handling user onboarding and authentication for Tap Payments.
4
-
5
- ## Installs
6
-
7
- This is a [React](https://reactjs.org/) module available through the
8
- [npm registry](https://www.npmjs.com/). Installation is done using the
9
- [`npm install` command](https://docs.npmjs.com/getting-started/installing-npm-packages-locally):
10
-
11
- ```console
12
- npm install @tap-payments/connect
13
- ```
14
-
15
- ---------------------------- OR -------------------------
16
-
17
- ```console
18
- yarn add @tap-payments/connect
19
- ```
20
-
21
- ## Examples
22
-
23
- ### Connect Library
24
-
25
- ### ES6
26
-
27
- ```js
28
- import { TapConnect, Language } from '@tap-payments/connect'
29
-
30
- // we have two ways to use the connect element
31
- // 1- express flow
32
- const ConnectExpressComponent = () => {
33
- return (
34
- <TapConnect
35
- // required (the public key of the merchant account provided by Tap Payments)
36
- publicKey={'pk_test_XXXXXXXXXXXXXXXXXXXXXXX'}
37
- // required (the domain of the merchant)
38
- domain={'https://example.com'}
39
- // required (Language flag to control the language of the connect element and only we support [en,ar])
40
- language={Language.EN}
41
- // required (the country ISO2 of the merchant)
42
- country={'SA'}
43
- // required (the scope of the merchant)
44
- scope={'merchant'}
45
- // optional (Lead Id can be passed in case of you already created a lead using our API )
46
- lead={'led_xxxxxxxxxxxxxxxxxxxxxx'}
47
- // required (Decide the maturity of the TapConnect library)
48
- mature={false}
49
- // optional (show/hide board screen after creating an account)
50
- board={true}
51
- // required (boolean to open/close the connect element)
52
- open={true}
53
- // optional (The POST Method URL used to push te data from our server to the merchant server)
54
- postURL={'https://api.example.com/post'}
55
- //optional (Callback function to handle the ready state of the TapConnect )
56
- onReady={() => console.log('onReady')}
57
- // optional (Callback function runs after creating an account)
58
- onCreated={(data) => console.log('onCreated', data)}
59
- // optional (Callback function runs when the user close TaConnect)
60
- onClose={() => console.log('onClose')}
61
- // optional (Callback function to handle the error)
62
- onError={(err) => console.log('onError', err)}
63
- // optional (Callback function runs after finishing all the flows)
64
- onBoardCompleted={() => console.log('onBoardCompleted')}
65
- />
66
- )
67
- }
68
- // 2- full flow
69
- const ConnectFullComponent = () => {
70
- return (
71
- <TapConnect
72
- // required (the public key of the merchant account provided by Tap Payments)
73
- publicKey={'pk_test_XXXXXXXXXXXXXXXXXXXXXXX'}
74
- // required (the domain of the merchant)
75
- domain={'https://example.com'}
76
- // required (Language flag to control the language of the connect element and only we support [en,ar])
77
- language={Language.EN}
78
- // required (the country ISO2 of the merchant)
79
- country={'SA'}
80
- // required (the scope of the merchant)
81
- scope={'merchant'}
82
- // required (Decide the maturity of the TapConnect library)
83
- mature={true}
84
- // required (boolean to open/close the connect element)
85
- open={true}
86
- //optional (Callback function to handle the ready state of the TapConnect )
87
- onReady={() => console.log('onReady')}
88
- // optional (Callback function runs after finishing the flow)
89
- onSuccess={(data) => console.log('onSuccess', data)}
90
- // optional (Callback function runs when the user close TaConnect)
91
- onClose={() => console.log('onClose')}
92
- // optional (Callback function to handle the error)
93
- onError={(err) => console.log('onError', err)}
94
- />
95
- )
96
- }
97
- ```
98
-
99
- ### Vanilla JS
100
-
101
- ```js
102
- <!DOCTYPE html>
103
- <html lang="en">
104
- <head>
105
- <meta charset="utf-8" />
106
- <meta
107
- name="viewport"
108
- content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,shrink-to-fit=no"
109
- />
110
- <title>Auth-JsConnect</title>
111
- <script src="https://connect-auth.b-cdn.net/build-0.0.13-test/main.js"></script>
112
- </head>
113
- <body>
114
- <div id="root"></div>
115
- <script>
116
- // once our cdn script is loaded we can use the window.TapPayments object
117
- const { renderTapConnect, Language } = window.TapPayments
118
- let unmountConnect = null
119
- const startConnectAuth = () => {
120
- const { unmount } = renderTapConnect(
121
- {
122
- publicKey: 'pk_test_xxxxxxxxxxxxxxxxxxxxxxxx',
123
- language: Language.EN,
124
- domain: 'https://example.com',
125
- country: 'SA',
126
- scope: 'merchant',
127
- lead: 'led_xxxxxxxxxxxxxxxxxxxxxx',
128
- mature: false,
129
- board: true,
130
- open: true,
131
- postURL: 'https://api.example.com/post',
132
- onReady: () => console.log('onReady'),
133
- onCreated: (data) => console.log('onCreated', data),
134
- onError: (err) => console.log('onError', err),
135
- onClose: () => console.log('onClose'),
136
- onBoardCompleted: () => console.log('onBoardCompleted'),
137
-
138
- },
139
- 'root'
140
- )
141
- // save the unmount function to be able to unmount the component
142
- unmountConnect = unmount
143
- }
144
-
145
- const stopConnectAuth = () => {
146
- unmountConnect && unmountConnect()
147
- }
148
- </script>
149
- <button onclick="startConnectAuth()">Start</button>
150
- <button onclick="stopConnectAuth()">Stop</button>
151
- </body>
152
- </html>
153
-
154
-
155
- ```
156
-
157
- ## Properties
158
-
159
- | name | type | description |
160
- | --------------------------- | ----------- | -------------------------------------------------------------------------------------------- |
161
- | publicKey `required` | `string` | Public key of the merchant account provided by Tap Payments |
162
- | domain `required` | `string` | Domain of the merchant |
163
- | language `required` | `Languages` | language flag to control the language of the connect element and only accept [ar,en] |
164
- | country `required` | `string` | Country ISO2 of the merchant |
165
- | scope `required` | `string` | the scope of the merchant |
166
- | lead `optional` | `string` | Lead Id can be passed in case of you already created a lead using our API |
167
- | mature `required` | `boolean` | Decide the mode of connect |
168
- | board `optional` | `string` | Show/Hide board screens |
169
- | open `required` | `boolean` | Open/Close the connect library |
170
- | postURL `optional` | `string` | The POST Method URL used to push te data from our server to the merchant server and |
171
- | | | it's required only if `mature` is `false` |
172
- | onReady `optional` | `function` | Callback function to handle the ready state of the `TapConnect` |
173
- | onCreated `optional` | `function` | Callback function to called the the account created successfully |
174
- | | | it calls only if `mature` is `false` |
175
- | onSuccess `optional` | `function` | Callback function to handle the success response, it will run after the user finish the flow |
176
- | onError `optional` | `function` | Callback function to handle the error response, it will run if the user face any error |
177
- | onClose `optional` | `function` | Callback function to called when `TapConnect` get close |
178
- | onBoardCompleted `optional` | `function` | Callback function to called when you complete all flows |
1
+ # Connect Package
2
+
3
+ Handling user onboarding and authentication for Tap Payments.
4
+
5
+ ## Installs
6
+
7
+ This is a [React](https://reactjs.org/) module available through the
8
+ [npm registry](https://www.npmjs.com/). Installation is done using the
9
+ [`npm install` command](https://docs.npmjs.com/getting-started/installing-npm-packages-locally):
10
+
11
+ ```console
12
+ npm install @tap-payments/connect
13
+ ```
14
+
15
+ ---------------------------- OR -------------------------
16
+
17
+ ```console
18
+ yarn add @tap-payments/connect
19
+ ```
20
+
21
+ ## Examples
22
+
23
+ ### Connect Library
24
+
25
+ ### ES6
26
+
27
+ ```js
28
+ import { TapConnect, Language } from '@tap-payments/connect'
29
+
30
+ // we have two ways to use the connect element
31
+ // 1- express flow
32
+ const ConnectExpressComponent = () => {
33
+ return (
34
+ <TapConnect
35
+ // required (the public key of the merchant account provided by Tap Payments)
36
+ publicKey={'pk_test_XXXXXXXXXXXXXXXXXXXXXXX'}
37
+ // required (the domain of the merchant)
38
+ domain={'https://example.com'}
39
+ // required (Language flag to control the language of the connect element and only we support [en,ar])
40
+ language={Language.EN}
41
+ // required (the country ISO2 of the merchant)
42
+ country={'SA'}
43
+ // required (the scope of the merchant)
44
+ scope={'merchant'}
45
+ // optional (Lead Id can be passed in case of you already created a lead using our API )
46
+ lead={'led_xxxxxxxxxxxxxxxxxxxxxx'}
47
+ // required (Decide the maturity of the TapConnect library)
48
+ mature={false}
49
+ // optional (show/hide board screen after creating an account)
50
+ board={true}
51
+ boardMaturity={false}
52
+ // required (boolean to open/close the connect element)
53
+ open={true}
54
+ // optional (The POST Method URL used to push te data from our server to the merchant server)
55
+ postURL={'https://api.example.com/post'}
56
+ //optional (Callback function to handle the ready state of the TapConnect )
57
+ onReady={() => console.log('onReady')}
58
+ // optional (Callback function runs after creating an account)
59
+ onCreated={(data) => console.log('onCreated', data)}
60
+ // optional (Callback function runs when the user close TaConnect)
61
+ onClose={() => console.log('onClose')}
62
+ // optional (Callback function to handle the error)
63
+ onError={(err) => console.log('onError', err)}
64
+ // optional (Callback function runs after finishing all the flows)
65
+ onBoardCompleted={() => console.log('onBoardCompleted')}
66
+ />
67
+ )
68
+ }
69
+ // 2- full flow
70
+ const ConnectFullComponent = () => {
71
+ return (
72
+ <TapConnect
73
+ // required (the public key of the merchant account provided by Tap Payments)
74
+ publicKey={'pk_test_XXXXXXXXXXXXXXXXXXXXXXX'}
75
+ // required (the domain of the merchant)
76
+ domain={'https://example.com'}
77
+ // required (Language flag to control the language of the connect element and only we support [en,ar])
78
+ language={Language.EN}
79
+ // required (the country ISO2 of the merchant)
80
+ country={'SA'}
81
+ // required (the scope of the merchant)
82
+ scope={'merchant'}
83
+ // required (Decide the maturity of the TapConnect library)
84
+ mature={true}
85
+ // required (boolean to open/close the connect element)
86
+ open={true}
87
+ //optional (Callback function to handle the ready state of the TapConnect )
88
+ onReady={() => console.log('onReady')}
89
+ // optional (Callback function runs after finishing the flow)
90
+ onSuccess={(data) => console.log('onSuccess', data)}
91
+ // optional (Callback function runs when the user close TaConnect)
92
+ onClose={() => console.log('onClose')}
93
+ // optional (Callback function to handle the error)
94
+ onError={(err) => console.log('onError', err)}
95
+ />
96
+ )
97
+ }
98
+ ```
99
+
100
+ ### Vanilla JS
101
+
102
+ ```js
103
+ <!DOCTYPE html>
104
+ <html lang="en">
105
+ <head>
106
+ <meta charset="utf-8" />
107
+ <meta
108
+ name="viewport"
109
+ content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,shrink-to-fit=no"
110
+ />
111
+ <title>Auth-JsConnect</title>
112
+ <script src="https://connect-auth.b-cdn.net/build-0.0.14-test/main.js"></script>
113
+ </head>
114
+ <body>
115
+ <div id="root"></div>
116
+ <script>
117
+ // once our cdn script is loaded we can use the window.TapPayments object
118
+ const { renderTapConnect, Language } = window.TapPayments
119
+ let unmountConnect = null
120
+ const startConnectAuth = () => {
121
+ const { unmount } = renderTapConnect(
122
+ {
123
+ publicKey: 'pk_test_xxxxxxxxxxxxxxxxxxxxxxxx',
124
+ language: Language.EN,
125
+ domain: 'https://example.com',
126
+ country: 'SA',
127
+ scope: 'merchant',
128
+ lead: 'led_xxxxxxxxxxxxxxxxxxxxxx',
129
+ mature: false,
130
+ board: true,
131
+ boardMaturity: false,
132
+ open: true,
133
+ postURL: 'https://api.example.com/post',
134
+ onReady: () => console.log('onReady'),
135
+ onCreated: (data) => console.log('onCreated', data),
136
+ onError: (err) => console.log('onError', err),
137
+ onClose: () => console.log('onClose'),
138
+ onBoardCompleted: () => console.log('onBoardCompleted'),
139
+
140
+ },
141
+ 'root'
142
+ )
143
+ // save the unmount function to be able to unmount the component
144
+ unmountConnect = unmount
145
+ }
146
+
147
+ const stopConnectAuth = () => {
148
+ unmountConnect && unmountConnect()
149
+ }
150
+ </script>
151
+ <button onclick="startConnectAuth()">Start</button>
152
+ <button onclick="stopConnectAuth()">Stop</button>
153
+ </body>
154
+ </html>
155
+
156
+
157
+ ```
158
+
159
+ ## Properties
160
+
161
+ | name | type | description |
162
+ | --------------------------- | ----------- | -------------------------------------------------------------------------------------------- |
163
+ | publicKey `required` | `string` | Public key of the merchant account provided by Tap Payments |
164
+ | domain `required` | `string` | Domain of the merchant |
165
+ | language `required` | `Languages` | language flag to control the language of the connect element and only accept [ar,en] |
166
+ | country `required` | `string` | Country ISO2 of the merchant |
167
+ | scope `required` | `string` | the scope of the merchant |
168
+ | lead `optional` | `string` | Lead Id can be passed in case of you already created a lead using our API |
169
+ | mature `required` | `boolean` | Decide the mode of connect |
170
+ | board `optional` | `string` | Show/Hide board screens |
171
+ | open `required` | `boolean` | Open/Close the connect library |
172
+ | boardMaturity `optional` | `boolean` | Decide the board maturity |
173
+ | postURL `optional` | `string` | The POST Method URL used to push te data from our server to the merchant server and |
174
+ | | | it's required only if `mature` is `false` |
175
+ | onReady `optional` | `function` | Callback function to handle the ready state of the `TapConnect` |
176
+ | onCreated `optional` | `function` | Callback function to called the the account created successfully |
177
+ | | | it calls only if `mature` is `false` |
178
+ | onSuccess `optional` | `function` | Callback function to handle the success response, it will run after the user finish the flow |
179
+ | onError `optional` | `function` | Callback function to handle the error response, it will run if the user face any error |
180
+ | onClose `optional` | `function` | Callback function to called when `TapConnect` get close |
181
+ | onBoardCompleted `optional` | `function` | Callback function to called when you complete all flows |
@@ -1,42 +1,44 @@
1
- import { Language } from '../constants';
2
- export interface ConnectProps {
3
- elementId: string;
4
- publicKey: string;
5
- domain: string;
6
- language: (typeof Language)[keyof typeof Language];
7
- country: string;
8
- scope: string;
9
- lead?: string;
10
- mature: boolean;
11
- board?: boolean;
12
- open: boolean;
13
- postURL?: string;
14
- onError?: (err: Error) => void;
15
- onReady?: () => void;
16
- onClose?: () => void;
17
- onCreated?: (res: object) => void;
18
- onSuccess?: (res: object) => void;
19
- onBoardCompleted?: () => void;
20
- }
21
- export interface OriginalConnectProps {
22
- publicKey: string;
23
- open: boolean;
24
- merchantDomain: string;
25
- language: string;
26
- appInfo: Record<string, string>;
27
- businessCountryCode: string;
28
- scope: string;
29
- leadId?: string;
30
- postURL?: string;
31
- showBoard?: boolean;
32
- verifyToken?: string;
33
- onFlowCompleted: (res: object, headers?: Record<string, string>) => void;
34
- onError: (err: any) => void;
35
- onStepCompleted?: (name: string, info: any) => void;
36
- onReady?: () => void;
37
- onStepStarted?: (name: string) => void;
38
- onBoardButtonClick?: (data: Record<string, any>) => void;
39
- onCreated?: (res: Record<string, any>) => void;
40
- onClose?: () => void;
41
- onBoardCompleted?: () => void;
42
- }
1
+ import { Language } from '../constants';
2
+ export interface ConnectProps {
3
+ elementId: string;
4
+ publicKey: string;
5
+ domain: string;
6
+ language: (typeof Language)[keyof typeof Language];
7
+ country: string;
8
+ scope: string;
9
+ lead?: string;
10
+ mature: boolean;
11
+ board?: boolean;
12
+ boardMaturity?: boolean;
13
+ open: boolean;
14
+ postURL?: string;
15
+ onError?: (err: Error) => void;
16
+ onReady?: () => void;
17
+ onClose?: () => void;
18
+ onCreated?: (res: object) => void;
19
+ onSuccess?: (res: object) => void;
20
+ onBoardCompleted?: () => void;
21
+ }
22
+ export interface OriginalConnectProps {
23
+ publicKey: string;
24
+ open: boolean;
25
+ merchantDomain: string;
26
+ language: string;
27
+ appInfo: Record<string, string>;
28
+ businessCountryCode: string;
29
+ scope: string;
30
+ leadId?: string;
31
+ postURL?: string;
32
+ showBoard?: boolean;
33
+ boardMaturity?: boolean;
34
+ verifyToken?: string;
35
+ onFlowCompleted: (res: object, headers?: Record<string, string>) => void;
36
+ onError: (err: any) => void;
37
+ onStepCompleted?: (name: string, info: any) => void;
38
+ onReady?: () => void;
39
+ onStepStarted?: (name: string) => void;
40
+ onBoardButtonClick?: (data: Record<string, any>) => void;
41
+ onCreated?: (res: Record<string, any>) => void;
42
+ onClose?: () => void;
43
+ onBoardCompleted?: () => void;
44
+ }
@@ -1 +1 @@
1
- export {};
1
+ export {};
@@ -1,9 +1,9 @@
1
- export declare const CDN_LIBRARY_BASE_URL = "https://auth-jsconnect.b-cdn.net/build-2.1.97-test";
2
- export declare const Maturity: {
3
- readonly FULL: "full";
4
- readonly EXPRESS: "express";
5
- };
6
- export declare const Language: {
7
- readonly EN: "en";
8
- readonly AR: "ar";
9
- };
1
+ export declare const CDN_LIBRARY_BASE_URL = "https://auth-jsconnect.b-cdn.net/build-2.3.46-test/";
2
+ export declare const Maturity: {
3
+ readonly FULL: "full";
4
+ readonly EXPRESS: "express";
5
+ };
6
+ export declare const Language: {
7
+ readonly EN: "en";
8
+ readonly AR: "ar";
9
+ };
@@ -1,9 +1,9 @@
1
- export var CDN_LIBRARY_BASE_URL = 'https://auth-jsconnect.b-cdn.net/build-2.1.97-test';
2
- export var Maturity = {
3
- FULL: 'full',
4
- EXPRESS: 'express'
5
- };
6
- export var Language = {
7
- EN: 'en',
8
- AR: 'ar'
9
- };
1
+ export var CDN_LIBRARY_BASE_URL = 'https://auth-jsconnect.b-cdn.net/build-2.3.46-test/';
2
+ export var Maturity = {
3
+ FULL: 'full',
4
+ EXPRESS: 'express'
5
+ };
6
+ export var Language = {
7
+ EN: 'en',
8
+ AR: 'ar'
9
+ };
@@ -1,5 +1,5 @@
1
- import * as React from 'react';
2
- import { ConnectProps as ConnectAttrs } from '../../@types';
3
- export type ConnectProps = Omit<ConnectAttrs, 'elementId'>;
4
- export declare const TapConnect: React.MemoExoticComponent<(props: ConnectAttrs) => JSX.Element>;
5
- export declare const renderTapConnect: (props: ConnectProps, elementId: string) => any;
1
+ import * as React from 'react';
2
+ import { ConnectProps as ConnectAttrs } from '../../@types';
3
+ export type ConnectProps = Omit<ConnectAttrs, 'elementId'>;
4
+ export declare const TapConnect: React.MemoExoticComponent<(props: ConnectAttrs) => JSX.Element>;
5
+ export declare const renderTapConnect: (props: ConnectProps, elementId: string) => any;