@motopays/pay-form 1.0.17-rc.0 → 1.0.17-rc.1

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
@@ -22,11 +22,6 @@ import "@motopays/pay-form/lib/styles/styles.css";
22
22
 
23
23
  const payment$ = document.querySelector("#payment");
24
24
 
25
- //This listener has to be assigned before payment and settings fields set
26
- payment$.addEventListener("analyticsTracked", (event) => {
27
- console.log("analytics data was detected: ", e); // Custom event
28
- });
29
-
30
25
  payment$.payment = {
31
26
  userAuthToken?: string;
32
27
  userId: string;
@@ -166,7 +161,7 @@ declare module "@motopays/pay-form/pay";
166
161
 
167
162
 
168
163
  ILink interface:
169
- ```javascript
164
+ ```
170
165
  interface ILink {
171
166
  text: string;
172
167
  href: string;
@@ -174,7 +169,7 @@ interface ILink {
174
169
  ```
175
170
 
176
171
  ITermCheckbox interface:
177
- ```javascript
172
+ ```
178
173
  interface ITermCheckbox {
179
174
  text: string;
180
175
  link?: ILink;
@@ -182,7 +177,7 @@ interface ITermCheckbox {
182
177
  ```
183
178
 
184
179
  IUserPreferenceCheckbox interface:
185
- ```javascript
180
+ ```
186
181
  interface IUserPreferenceCheckbox {
187
182
  name: string;
188
183
  text: string;
@@ -192,7 +187,7 @@ interface IUserPreferenceCheckbox {
192
187
  ```
193
188
 
194
189
  Example of merchantInfo:
195
- ```javascript
190
+ ```
196
191
  merchantInfo: {
197
192
  "visible": true,
198
193
  "text": "The vendor prides itself on designing and implementing state-of-the-art payment infrastructures that cater to a wide range of commercial activities. Specializing in the creation of robust payment processing platforms, the merchant provides tailored solutions that support the dynamic needs of the global market",
@@ -210,7 +205,7 @@ merchantInfo: {
210
205
  ```
211
206
 
212
207
  Example of chargeTerms:
213
- ```javascript
208
+ ```
214
209
  chargeTerms: {
215
210
  "visible": true,
216
211
  "text": "By checking this box, I am affirming my full and complete understanding of, as well as my agreement to, all the terms and conditions that were previously presented to me, acknowledging that they form a binding contractual agreement.",
@@ -234,7 +229,7 @@ chargeTerms: {
234
229
  ```
235
230
 
236
231
  Example of userPreferences:
237
- ```javascript
232
+ ```
238
233
  "userPreferences": {
239
234
  "visible": true,
240
235
  "text": "By checking this box, I am affirming my full and complete understanding of, as well as my agreement to, all the terms and conditions that were previously presented to me, acknowledging that they form a binding contractual agreement.",
@@ -266,7 +261,6 @@ Example of userPreferences:
266
261
  | ----- | -------------- | -------------------------------------------- |
267
262
  | close | void | triggered by clicking on the closing icon |
268
263
  | paid | Payment Result | triggered after receiving a payment response |
269
- | analyticsTracked | IAnalyticsData | triggered by analytics events |
270
264
 
271
265
  ### Payment Result Structure
272
266
 
@@ -325,76 +319,6 @@ IRedirectData {
325
319
  }
326
320
  ```
327
321
 
328
- ### Analytics
329
- For receiving analytics listen analyticsTracked events.
330
-
331
- 'init-start' - the form has started initializtion. Payload: void.
332
- 'loading-finish' - the form has finished initialization and loading. Payload: void.
333
- 'card-number-field-click' - the card number field has been clicked. Payload: void.
334
- 'expiration-date-field-click' - the expiration date field has been clicked. Payload: void.
335
- 'cvv-field-click' - the cvv field has been clicked. Payload: void.
336
- 'card-holder-field-click' - the card holder field has been clicked. Payload: void.
337
- 'charge-term-checkbox-<number>-check' - the charge term checkbox has been checked. Payload: IChargeTermsAnalytics.
338
- 'charge-term-checkbox-<number>-uncheck' - the charge term checkbox has been unchecked. Payload: IChargeTermsAnalytics.
339
- 'user-preference-checkbox-<number>-check' - the user preference checbox has been checked. Payload: IUserPreferencesAnalytics.
340
- 'user-preference-checkbox-<number>-uncheck' - the user preference checbox has been unchecked. Payload: IUserPreferencesAnalytics.
341
- 'pay-button-click' - the 'Pay' button has been clicked (payment by card). Payload: void.
342
- '<apm>-button-click' - the apm payment button has been clicked. Payload: void.
343
- 'add-card-button-click' - the "Add New Card" button has been clicked. Payload: void.
344
- 'card-options-button-click' - the card options button has been clicked (existing card menu visualised as 3 vertical dots). Payload: ICardAnalytics.
345
- 'remove-card-button-click' - the card removing button has been clicked. Payload: ICardAnalytics.
346
- 'select-card-button-click' - the card selecting button has been clicked. Payload: ICardAnalytics.
347
-
348
- Examples of dynamic event types (number inserting):
349
- &emsp;1. Example of the first checkbox: 'charge-term-checkbox-0-check'
350
- &emsp;2. Example of the second checkbox: 'charge-term-checkbox-1-check'
351
-
352
- Examples of dynamic event types (apm inserting):
353
- &emsp;1. 'coinbase-button-click'
354
- &emsp;2. 'moto-button-click'
355
-
356
- ```javascript
357
- //structure
358
- interface IAnalyticsData {
359
- type: TAnalyticsData,
360
- payload?: any
361
- }
362
-
363
- //event types
364
- type TAnalyticsData =
365
- | 'init-start'
366
- | 'loading-finish'
367
- | 'card-number-field-click'
368
- | 'expiration-date-field-click'
369
- | 'cvv-field-click'
370
- | 'card-holder-field-click'
371
- | `charge-term-checkbox${`-${number}`}-check`
372
- | `charge-term-checkbox${`-${number}`}-uncheck`
373
- | `user-preference-checkbox${`-${number}`}-check`
374
- | `user-preference-checkbox${`-${number}`}-uncheck`
375
- | 'pay-button-click'
376
- | `${string}-button-click`
377
- | 'add-card-button-click'
378
- | 'card-options-button-click'
379
- | 'remove-card-button-click'
380
- | 'select-card-button-click'
381
-
382
-
383
- //payload types
384
- interface ICardAnalytics {
385
- last4Digits: string;
386
- }
387
-
388
- interface IChargeTermsAnalytics {
389
- text: string;
390
- }
391
-
392
- interface IUserPreferencesAnalytics {
393
- name: string;
394
- text: string;
395
- }
396
- ```
397
-
398
322
  ### Webpack 5 Issues
399
323
 
400
324
  During the integration process, you might face multiple issues with webpack 5. This issue is caused due to the fact that some packages have certain dependencies, which are not present within the browser environment by webpack 5. Hence, you require certain [node polyfills](https://webpack.js.org/configuration/resolve/#resolvefallback) to be added to your project, while overriding the configurations to enable their usage. When that is done, your project should run without any issues.