@paydock/client-sdk 1.103.1 → 1.103.24-beta

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.
Files changed (51) hide show
  1. package/README.md +245 -199
  2. package/bundles/widget.umd.js +144 -214
  3. package/bundles/widget.umd.min.js +1 -1
  4. package/lib/api/api-service-internal.d.ts +2 -1
  5. package/lib/api/api-service-internal.js +1 -0
  6. package/lib/api/api-service-internal.js.map +1 -1
  7. package/lib/components/iframe-event.d.ts +2 -0
  8. package/lib/components/iframe-event.js +2 -0
  9. package/lib/components/iframe-event.js.map +1 -1
  10. package/lib/components/link.d.ts +3 -2
  11. package/lib/components/link.js +1 -0
  12. package/lib/components/link.js.map +1 -1
  13. package/lib/components/param.d.ts +2 -2
  14. package/lib/components/param.js.map +1 -1
  15. package/lib/configs/env/env.d.ts +3 -0
  16. package/lib/configs/env/env.js +9 -0
  17. package/lib/configs/env/env.js.map +1 -1
  18. package/lib/configs/sdk.js +1 -1
  19. package/lib/secure-remote-commerce/index.d.ts +102 -1
  20. package/lib/secure-remote-commerce/index.js +102 -1
  21. package/lib/secure-remote-commerce/index.js.map +1 -1
  22. package/lib/secure-remote-commerce/interfaces.d.ts +109 -32
  23. package/lib/secure-remote-commerce/interfaces.js +31 -11
  24. package/lib/secure-remote-commerce/interfaces.js.map +1 -1
  25. package/lib/secure-remote-commerce/mastercard-secure-remote-commerce.d.ts +30 -0
  26. package/lib/secure-remote-commerce/mastercard-secure-remote-commerce.js +39 -0
  27. package/lib/secure-remote-commerce/mastercard-secure-remote-commerce.js.map +1 -0
  28. package/lib/secure-remote-commerce/providers/mastercard-src/index.d.ts +1 -0
  29. package/lib/secure-remote-commerce/providers/mastercard-src/index.js +2 -0
  30. package/lib/secure-remote-commerce/providers/mastercard-src/index.js.map +1 -0
  31. package/lib/secure-remote-commerce/providers/{visa-src/visa-src.d.ts → mastercard-src/mastercard-src.d.ts} +4 -7
  32. package/lib/secure-remote-commerce/providers/mastercard-src/mastercard-src.js +88 -0
  33. package/lib/secure-remote-commerce/providers/mastercard-src/mastercard-src.js.map +1 -0
  34. package/lib/secure-remote-commerce/secure-remote-commerce.d.ts +13 -91
  35. package/lib/secure-remote-commerce/secure-remote-commerce.js +15 -98
  36. package/lib/secure-remote-commerce/secure-remote-commerce.js.map +1 -1
  37. package/lib/wallet-buttons/flypay-v2.wallet-service.js +1 -1
  38. package/lib/wallet-buttons/flypay-v2.wallet-service.js.map +1 -1
  39. package/package.json +1 -1
  40. package/slate.md +59 -84
  41. package/lib/secure-remote-commerce/providers/visa-src/helper.d.ts +0 -7
  42. package/lib/secure-remote-commerce/providers/visa-src/helper.js +0 -36
  43. package/lib/secure-remote-commerce/providers/visa-src/helper.js.map +0 -1
  44. package/lib/secure-remote-commerce/providers/visa-src/index.d.ts +0 -1
  45. package/lib/secure-remote-commerce/providers/visa-src/index.js +0 -2
  46. package/lib/secure-remote-commerce/providers/visa-src/index.js.map +0 -1
  47. package/lib/secure-remote-commerce/providers/visa-src/visa-src.js +0 -113
  48. package/lib/secure-remote-commerce/providers/visa-src/visa-src.js.map +0 -1
  49. package/lib/secure-remote-commerce/providers/visa-src/visa-src.styles.d.ts +0 -8
  50. package/lib/secure-remote-commerce/providers/visa-src/visa-src.styles.js +0 -10
  51. package/lib/secure-remote-commerce/providers/visa-src/visa-src.styles.js.map +0 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@paydock/client-sdk",
3
3
  "description": "Paydock client sdk",
4
- "version": "1.103.1",
4
+ "version": "1.103.24-beta",
5
5
  "homepage": "https://paydock.com",
6
6
  "author": {},
7
7
  "bugs": {
package/slate.md CHANGED
@@ -1638,26 +1638,22 @@ Similarly, for **GooglePay via MPGS** you can initialize the `PaymentMethodSpeci
1638
1638
  ## Secure Remote Commerce
1639
1639
  You can find description of all methods and parameters [here](https://www.npmjs.com/package/@paydock/client-sdk#SRC).
1640
1640
 
1641
- This widget provides you with the ability to easily integrate with SRC providers. Currently Visa SRC is supported.
1641
+ This widget provides you with the ability to easily integrate with Mastercard SRC.
1642
1642
 
1643
1643
  ## SRC simple example
1644
1644
 
1645
1645
  ### Container
1646
+ To integrate the SRC checkout iFrame you first need to create a container within your HTML code. This container will serve as the placeholder for the iFrame.
1646
1647
 
1647
1648
  ```html
1648
- <div id="checkoutButton"></div>
1649
1649
  <div id="checkoutIframe"></div>
1650
1650
  ```
1651
1651
 
1652
- You must create a container for the initial checkout button, and a different one for the checkout iFrame. Inside the first tag the button will be initialized, and inside the second one the iFrame will be loaded once the button is clicked.
1653
-
1654
-
1655
1652
  ### Initialization
1656
1653
  ```javascript
1657
- var src = new paydock.SRC(
1658
- "#checkoutButton",
1654
+ var src = new paydock.MastercardSRCClickToPay(
1659
1655
  "#checkoutIframe",
1660
- "scheme_service_id",
1656
+ "service_id",
1661
1657
  "paydock_public_key_or_access_token",
1662
1658
  {}, // meta
1663
1659
  );
@@ -1667,19 +1663,18 @@ src.load();
1667
1663
  ```javascript--es2015
1668
1664
  // ES2015 | TypeScript
1669
1665
 
1670
- import { SRC } from '@paydock/client-sdk';
1666
+ import { MastercardSRCClickToPay } from '@paydock/client-sdk';
1671
1667
 
1672
- var src = new SRC(
1673
- "#checkoutButton",
1668
+ var src = new MastercardSRCClickToPay(
1674
1669
  "#checkoutIframe",
1675
- "scheme_service_id",
1670
+ "service_id",
1676
1671
  "paydock_public_key_or_access_token",
1677
1672
  {}, // meta
1678
1673
  );
1679
1674
  src.load();
1680
1675
  ```
1681
1676
 
1682
- *NOTE:* it's highly recommended to use a Paydock Access Token instead of the public key for security reasons. When creating it, you will need to enable the `Secure Remote Commerce` and add a whiteliste for the domain of your checkout screen.
1677
+ *NOTE:* it's highly recommended to use a Paydock Access Token instead of the public key for security reasons in production environments. When creating it, you will need to enable the `Secure Remote Commerce` and add a whitelist for the domain of your checkout screen.
1683
1678
 
1684
1679
  ### Full example
1685
1680
 
@@ -1692,14 +1687,12 @@ src.load();
1692
1687
  <style>iframe {border: 0;width: 40%;height: 300px;}</style>
1693
1688
  </head>
1694
1689
  <body>
1695
- <div id="checkoutButton"></div>
1696
1690
  <div id="checkoutIframe"></div>
1697
1691
  <script src="https://widget.paydock.com/sdk/latest/widget.umd.min.js" ></script>
1698
1692
  <script>
1699
- var src = new paydock.SRC(
1700
- "#checkoutButton",
1693
+ var src = new paydock.MastercardSRCClickToPay(
1701
1694
  "#checkoutIframe",
1702
- "scheme_service_id",
1695
+ "service_id",
1703
1696
  "paydock_public_key_or_access_token",
1704
1697
  {},
1705
1698
  );
@@ -1715,25 +1708,12 @@ src.load();
1715
1708
  ### Settings
1716
1709
 
1717
1710
  ```javascript
1718
-
1719
- src.setEnv('sandbox'); // set enviroment
1720
-
1721
- src.hideButton(); // hide button
1722
-
1723
- src.showButton(); // show button
1711
+ src.setEnv('sandbox'); // set environment
1724
1712
 
1725
1713
  src.hideCheckout(); // hide checkout iframe
1726
1714
 
1727
1715
  src.showCheckout(); // show checkout iframe
1728
1716
 
1729
- src.on('checkoutButtonLoaded', () => {
1730
- console.log("Button loaded");
1731
- });
1732
-
1733
- src.on('checkoutButtonClicked', () => {
1734
- console.log("Button clicked");
1735
- });
1736
-
1737
1717
  src.on('iframeLoaded', () => {
1738
1718
  console.log("Initial iframe loaded");
1739
1719
  });
@@ -1764,18 +1744,20 @@ Here you can see how you can use this methods to customize your checkout experie
1764
1744
  <style>iframe {border: 0;width: 40%;height: 450px;}</style>
1765
1745
  </head>
1766
1746
  <body>
1767
- <div id="checkoutButton"></div>
1768
1747
  <div id="checkoutIframe"></div>
1769
1748
  <script src="https://widget.paydock.com/sdk/latest/widget.umd.min.js" ></script>
1770
1749
  <script>
1771
- var src = new paydock.SRC(
1772
- "#checkoutButton",
1750
+ var src = new paydock.MastercardSRCClickToPay(
1773
1751
  "#checkoutIframe",
1774
- "scheme_service_id",
1752
+ "service_id",
1775
1753
  "paydock_public_key_or_access_token",
1776
1754
  {},
1777
1755
  );
1778
1756
 
1757
+ src.on('iframeLoaded', () => {
1758
+ console.log("Initial iframe loaded");
1759
+ });
1760
+
1779
1761
  src.on('checkoutReady', () => {
1780
1762
  console.log("Checkout ready to be used");
1781
1763
  });
@@ -1783,34 +1765,37 @@ Here you can see how you can use this methods to customize your checkout experie
1783
1765
  src.on('checkoutCompleted', (token) => {
1784
1766
  console.log(token);
1785
1767
  });
1768
+
1769
+ src.on('checkoutError', (error) => {
1770
+ console.log(error);
1771
+ });
1772
+
1786
1773
  src.load();
1787
1774
  </script>
1788
1775
  </body>
1789
1776
  </html>
1790
1777
  ```
1791
1778
 
1792
- ## Customization options for address fields
1793
- ### Shipping address:
1779
+ ## Customization options for billing address fields
1794
1780
 
1795
- To customize shipping address experience we use a flag that manages how VisaSRC requires or not shipping address to the customer. Options are NONE (default option), POSTAL_COUNTRY or ALL.
1781
+ To customize billing address experience we use a flag that manages how MastercardSRC requires or not billing address to the customer. Options are NONE (default option), POSTAL_COUNTRY or FULL.
1796
1782
 
1797
1783
  ```
1798
- var src = new paydock.SRC(
1799
- "#checkoutButton",
1784
+ var src = new paydock.MastercardSRCClickToPay(
1800
1785
  "#checkoutIframe",
1801
- "scheme_service_id",
1786
+ "service_id",
1802
1787
  "paydock_public_key_or_access_token",
1803
1788
  {
1804
1789
  "dpa_transaction_options": {
1805
- "dpa_shipping_preference": "ALL"
1790
+ "dpa_billing_preference": "FULL"
1806
1791
  }
1807
1792
  },
1808
1793
  );
1809
1794
  ```
1810
1795
 
1811
- With this the Visa popup requires the shipping address from consumer, and these information will be stored in the Paydock charge.
1796
+ With this the SRC checkout will require the billing address from consumer and be returned as part of the checkout data. These information will be stored and leveraged in the Paydock charge as well.
1812
1797
 
1813
- Another option is at time of creating the charge. Say that you have a different way of collecting the shipping address (outside Paydock checkout), you can then disable the shipping address on our SRC widget and send it when creating the charge creation after getting the One Time Token out of the SRC widget:
1798
+ Another option is to provide it at the time of creating the charge. Say that you have a different way of collecting the billing address (outside SRC checkout), you can then disable the shipping address on our SRC widget and send it when creating the charge after getting the One Time Token out of the SRC widget, alongside other details that may have been collected outside the SRC checkout as the shipping address.
1814
1799
 
1815
1800
  ```
1816
1801
  POST v1/charges
@@ -1818,10 +1803,16 @@ POST v1/charges
1818
1803
  {
1819
1804
  "amount": "10.00",
1820
1805
  "currency": "AUD",
1821
- "token": "token",
1806
+ "token": "one_time_token",
1822
1807
  "customer": {
1823
1808
  "payment_source": {
1824
- "gateway_id": "gateway_id"
1809
+ "gateway_id": "gateway_id",
1810
+ "address_line1": "address_line1",
1811
+ "address_line2": "address_line2",
1812
+ "address_city": "address_city",
1813
+ "address_postcode": "address_postcode",
1814
+ "address_state": "address_state",
1815
+ "address_country": "address_country"
1825
1816
  }
1826
1817
  },
1827
1818
  "shipping": {
@@ -1836,60 +1827,44 @@ POST v1/charges
1836
1827
  }
1837
1828
  ```
1838
1829
 
1839
- - Billing address:
1830
+ ## Customization options for accepted cards
1840
1831
 
1841
- Billing address fields are always present on the checkout and required when adding a new credit card (or for new consumer checkout). You can send billing fields on the meta data to pre-fill these fields inside the customer object:
1832
+ To improve the experience in the use of the widget, it is allowed to send a flag `unaccepted_card_type` to block the usage of an specific card type. The available options are 'DEBIT' and 'CREDIT'.
1833
+
1834
+ ### Example code
1842
1835
 
1843
1836
  ```
1844
- var src = new paydock.SRC(
1845
- "#checkoutButton",
1837
+ var src = new paydock.MastercardSRCClickToPay(
1846
1838
  "#checkoutIframe",
1847
- "scheme_service_id",
1848
- "paydock_public_key_or_access_token",
1839
+ "service_id",
1840
+ "paydock_public_key",
1849
1841
  {
1850
- "customer": {
1851
- "email": "test@email.com",
1852
- "first_name": "Name",
1853
- "last_name": "Surname",
1854
- "phone": {
1855
- "country_code": "1",
1856
- "phone": "2124567890"
1857
- },
1858
- "payment_source": {
1859
- "address_line1": "Line 1",
1860
- "address_line2": "Line 2",
1861
- "address_city": "Miami",
1862
- "address_postcode": "33126",
1863
- "address_state": "FL",
1864
- "address_country": "US"
1865
- }
1866
- }
1842
+ unaccepted_card_type: 'DEBIT'
1867
1843
  },
1868
1844
  );
1845
+
1869
1846
  ```
1870
1847
 
1871
- ## Personalization Styling
1848
+ ## Styling Personalization
1872
1849
 
1873
- To improve the experience in the use of the widget, it is allowed to send props that customize the UI.
1850
+ To improve the experience in the use of the widget, it is allowed to send props that customize the UI look and feel.
1874
1851
 
1875
1852
  ### Example code
1876
1853
 
1877
1854
  ```
1878
- var src = new paydock.SRC(
1879
- "#checkoutButton",
1855
+ var src = new paydock.MastercardSRCClickToPay(
1880
1856
  "#checkoutIframe",
1881
- "scheme_service_id",
1857
+ "service_id",
1882
1858
  "paydock_public_key",
1859
+ {},
1883
1860
  );
1884
1861
 
1885
- button.setStyles({"primary_color":"#a83232","button_text_color":"#171e9c","font_family":"sans-serif"})
1886
-
1862
+ src.setStyles({
1863
+ enable_src_popup: true,
1864
+ primary_button_color: 'red',
1865
+ secondary_button_color: 'red',
1866
+ primary_button_text_color: 'red',
1867
+ secondary_button_text_color: 'red',
1868
+ font_family: 'Arial',
1869
+ });
1887
1870
  ```
1888
- ## Event and Values
1889
-
1890
- | Event Value | Type | Description |
1891
- | ------------------- | ------------------- | -------------------------------------------------------------- |
1892
- | primary_color | <code>string</code> | HEX color for the principal buttons, example : #32a852 |
1893
- | button_text_color | <code>string</code> | HEX color for the text of the buttons, example : #32a852|
1894
- | font_family | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family)|
1895
- | card_schemes | <code>[string] - array of string</code> | Possible values "visa", "mastercard", "amex" and "discover" - Default show all logos
@@ -1,7 +0,0 @@
1
- export declare const CARD_SCHEME: {
2
- VISA: string;
3
- MASTERCARD: string;
4
- AMEX: string;
5
- DISCOVER: string;
6
- };
7
- export declare const GenerateCardSchemesLogo: (card_scheme: string[], chevron?: boolean) => string;
@@ -1,36 +0,0 @@
1
- export const CARD_SCHEME = {
2
- VISA: 'visa',
3
- MASTERCARD: 'mastercard',
4
- AMEX: 'amex',
5
- DISCOVER: 'discover',
6
- };
7
- const CHEVRON_VMAD_IMG_PATH = '/images/visa-src/Chevron_Large_VMAD.png';
8
- const CHEVRON_VMA_IMG_PATH = '/images/visa-src/Chevron_Large_VMA.png';
9
- const CHEVRON_VM_IMG_PATH = '/images/visa-src/Chevron_Large_VM.png';
10
- const CHEVRON_M_IMG_PATH = '/images/visa-src/Chevron_Large_M.png';
11
- const CHEVRON_D_IMG_PATH = '/images/visa-src/Chevron_Large_D.png';
12
- const CHEVRON_V_IMG_PATH = '/images/visa-src/Chevron_Large_V.png';
13
- const VMAD_IMG_PATH = '/images/visa-src/vmad.svg';
14
- const VMA_IMG_PATH = '/images/visa-src/logos/Networks_Large_VMA.png';
15
- const VM_IMG_PATH = '/images/visa-src/logos/Networks_Large_VM.png';
16
- const M_IMG_PATH = '/images/visa-src/logos/master-logo.png';
17
- const D_IMG_PATH = '/images/visa-src/logos/Networks_Large_D.png';
18
- const V_IMG_PATH = '/images/visa-src/logos/visa-logo.png';
19
- export const GenerateCardSchemesLogo = (card_scheme, chevron = false) => {
20
- if (!card_scheme || !Array.isArray(card_scheme))
21
- return chevron ? CHEVRON_VMAD_IMG_PATH : VMAD_IMG_PATH;
22
- const card_scheme_sort = card_scheme.sort();
23
- if (includeArray([CARD_SCHEME.AMEX, CARD_SCHEME.MASTERCARD, CARD_SCHEME.VISA], card_scheme_sort))
24
- return chevron ? CHEVRON_VMA_IMG_PATH : VMA_IMG_PATH;
25
- if (includeArray([CARD_SCHEME.MASTERCARD, CARD_SCHEME.VISA], card_scheme_sort))
26
- return chevron ? CHEVRON_VM_IMG_PATH : VM_IMG_PATH;
27
- if (includeArray([CARD_SCHEME.MASTERCARD], card_scheme_sort))
28
- return chevron ? CHEVRON_M_IMG_PATH : M_IMG_PATH;
29
- if (includeArray([CARD_SCHEME.DISCOVER], card_scheme_sort))
30
- return chevron ? CHEVRON_D_IMG_PATH : D_IMG_PATH;
31
- if (includeArray([CARD_SCHEME.VISA], card_scheme_sort))
32
- return chevron ? CHEVRON_V_IMG_PATH : V_IMG_PATH;
33
- return chevron ? CHEVRON_V_IMG_PATH : VMAD_IMG_PATH;
34
- };
35
- const includeArray = (condition, card_scheme) => condition.every((card, index) => card === card_scheme[index]);
36
- //# sourceMappingURL=../../../../src/lib/secure-remote-commerce/providers/visa-src/helper.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"helper.js","sourceRoot":"","sources":["../../../../secure-remote-commerce/providers/visa-src/helper.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,IAAI,EAAE,MAAM;IACZ,UAAU,EAAE,YAAY;IACxB,IAAI,EAAE,MAAM;IACZ,QAAQ,EAAE,UAAU;CACvB,CAAC;AAEF,MAAM,qBAAqB,GAAG,yCAAyC,CAAC;AACxE,MAAM,oBAAoB,GAAG,wCAAwC,CAAC;AACtE,MAAM,mBAAmB,GAAG,uCAAuC,CAAC;AACpE,MAAM,kBAAkB,GAAG,sCAAsC,CAAC;AAClE,MAAM,kBAAkB,GAAG,sCAAsC,CAAC;AAClE,MAAM,kBAAkB,GAAG,sCAAsC,CAAC;AAElE,MAAM,aAAa,GAAG,2BAA2B,CAAC;AAClD,MAAM,YAAY,GAAG,+CAA+C,CAAC;AACrE,MAAM,WAAW,GAAG,8CAA8C,CAAC;AACnE,MAAM,UAAU,GAAG,wCAAwC,CAAC;AAC5D,MAAM,UAAU,GAAG,6CAA6C,CAAC;AACjE,MAAM,UAAU,GAAG,sCAAsC,CAAC;AAE1D,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,WAAqB,EAAE,UAAmB,KAAK,EAAU,EAAE;IAC/F,IAAI,CAAC,WAAW,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC;QAC3C,OAAO,OAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,aAAa,CAAC;IAE3D,MAAM,gBAAgB,GAAG,WAAW,CAAC,IAAI,EAAc,CAAC;IAExD,IAAI,YAAY,CAAC,CAAC,WAAW,CAAC,IAAI,EAAE,WAAW,CAAC,UAAU,EAAE,WAAW,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAC;QAC5F,OAAO,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,YAAY,CAAC;IAEzD,IAAI,YAAY,CAAC,CAAC,WAAW,CAAC,UAAU,EAAE,WAAW,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAC;QAC1E,OAAO,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,WAAW,CAAC;IAEvD,IAAI,YAAY,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,EAAE,gBAAgB,CAAC;QACxD,OAAO,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC;IAErD,IAAI,YAAY,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAC,EAAE,gBAAgB,CAAC;QACtD,OAAO,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC;IAErD,IAAI,YAAY,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAC;QAClD,OAAO,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC;IAErD,OAAO,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,aAAa,CAAC;AACxD,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,SAAmB,EAAE,WAAqB,EAAE,EAAE,CAChE,SAAS,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,KAAK,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC"}
@@ -1 +0,0 @@
1
- export { VisaSRC } from './visa-src';
@@ -1,2 +0,0 @@
1
- export { VisaSRC } from './visa-src';
2
- //# sourceMappingURL=../../../../src/lib/secure-remote-commerce/providers/visa-src/index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../secure-remote-commerce/providers/visa-src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC"}
@@ -1,113 +0,0 @@
1
- import { Link, VISA_SRC } from '../../../components/link';
2
- import { Container } from '../../../components/container';
3
- import { IFrame } from '../../../components/iframe';
4
- import { IFrameEvent } from '../../../components/iframe-event';
5
- import { VisaSRCStyles } from "./visa-src.styles";
6
- import { EVENT } from '../../interfaces';
7
- import { GenerateCardSchemesLogo } from "./helper";
8
- import { SDK } from '../../../configs/sdk';
9
- export class VisaSRC {
10
- constructor(button_selector, iframe_selector, service_id, public_key, meta, eventEmitter, autoResize, env, alias) {
11
- this.meta = meta;
12
- this.eventEmitter = eventEmitter;
13
- this.autoResize = autoResize;
14
- this.link = new Link(VISA_SRC);
15
- this.link.setParams(Object.assign({ service_id, public_key }, meta && { meta: JSON.stringify(meta) }));
16
- if (SDK.version) {
17
- this.link.setParams({
18
- sdk_version: SDK.version,
19
- sdk_type: SDK.type,
20
- });
21
- }
22
- if (env)
23
- this.link.setEnv(env, alias);
24
- this.iFrameContainer = new Container(iframe_selector);
25
- this.iFrame = new IFrame(this.iFrameContainer);
26
- this.buttonContainer = new Container(button_selector);
27
- this.iFrameEvent = new IFrameEvent(window);
28
- this.setupIFrameEvents();
29
- }
30
- setupIFrameEvents() {
31
- const widgetId = this.link.getParams().widget_id;
32
- this.iFrameEvent.on(EVENT.CHECKOUT_READY, widgetId, ({ data }) => {
33
- this.eventEmitter.emit(EVENT.CHECKOUT_READY, data);
34
- });
35
- this.iFrameEvent.on(EVENT.CHECKOUT_COMPLETED, widgetId, ({ data }) => {
36
- this.eventEmitter.emit(EVENT.CHECKOUT_COMPLETED, data);
37
- });
38
- this.iFrameEvent.on(EVENT.CHECKOUT_ERROR, widgetId, ({ data }) => {
39
- this.eventEmitter.emit(EVENT.CHECKOUT_ERROR, data);
40
- });
41
- if (this.autoResize)
42
- this.useAutoResize(true);
43
- }
44
- load() {
45
- var _a;
46
- const container = document.createElement('div');
47
- container.setAttribute('style', VisaSRCStyles.buttonContainerStyles);
48
- const checkoutButton = document.createElement('button');
49
- checkoutButton.setAttribute('style', VisaSRCStyles.buttonStyles);
50
- if (this.meta.customizations.primary_color)
51
- checkoutButton.style.backgroundColor = this.meta.customizations.primary_color;
52
- if (this.meta.customizations.button_text_color)
53
- checkoutButton.style.color = this.meta.customizations.button_text_color;
54
- checkoutButton.innerHTML = 'Checkout';
55
- const footerContainer = document.createElement('div');
56
- footerContainer.setAttribute('style', VisaSRCStyles.footerContainerStyles);
57
- const verticalLine = document.createElement('div');
58
- verticalLine.setAttribute('style', VisaSRCStyles.verticalLineStyle);
59
- const footerText = document.createElement('p');
60
- footerText.setAttribute('style', VisaSRCStyles.footerTextStyles);
61
- footerText.innerHTML = 'WE ACCEPT';
62
- const clickToPayAllCards = document.createElement('img');
63
- clickToPayAllCards.setAttribute('style', VisaSRCStyles.clickToPayAllCardsStyle);
64
- clickToPayAllCards.src = this.link.getBaseUrl() + `${GenerateCardSchemesLogo((_a = this.meta.customizations) === null || _a === void 0 ? void 0 : _a.card_schemes, true)}`;
65
- checkoutButton.onclick = () => {
66
- this.eventEmitter.emit(EVENT.CHECKOUT_BUTTON_CLICKED, {});
67
- this.iFrame.load(this.link.getUrl(), { title: 'Visa SRC checkout' });
68
- this.iFrame.getElement().onload = () => this.eventEmitter.emit(EVENT.IFRAME_LOADED, {});
69
- };
70
- container.appendChild(checkoutButton);
71
- container.appendChild(footerContainer);
72
- footerContainer.appendChild(footerText);
73
- footerContainer.appendChild(clickToPayAllCards);
74
- this.buttonContainer.getElement().appendChild(container);
75
- this.eventEmitter.emit(EVENT.CHECKOUT_BUTTON_LOADED, {});
76
- }
77
- getEnv() {
78
- return this.link.getEnv();
79
- }
80
- hideButton(_saveSize) {
81
- if (this.buttonContainer.getElement())
82
- this.buttonContainer.getElement().style['display'] = 'none';
83
- }
84
- showButton() {
85
- if (this.buttonContainer.getElement())
86
- this.buttonContainer.getElement().style['display'] = 'block';
87
- }
88
- hideCheckout(saveSize) {
89
- if (this.iFrame)
90
- this.iFrame.hide();
91
- }
92
- showCheckout() {
93
- if (this.iFrame)
94
- this.iFrame.show();
95
- }
96
- reload() {
97
- this.iFrame.remove();
98
- this.load();
99
- }
100
- useAutoResize(force) {
101
- if (this.autoResize && !force)
102
- return;
103
- this.autoResize = true;
104
- this.iFrameEvent.on('resize', this.link.getParams().widget_id, ({ data }) => {
105
- if (this.iFrame.getElement()) {
106
- this.iFrame.getElement().scrolling = 'no';
107
- if (data.height)
108
- this.iFrame.setStyle('height', data.height + 'px');
109
- }
110
- });
111
- }
112
- }
113
- //# sourceMappingURL=../../../../src/lib/secure-remote-commerce/providers/visa-src/visa-src.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"visa-src.js","sourceRoot":"","sources":["../../../../secure-remote-commerce/providers/visa-src/visa-src.ts"],"names":[],"mappings":"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"}
@@ -1,8 +0,0 @@
1
- export declare class VisaSRCStyles {
2
- static buttonContainerStyles: string;
3
- static buttonStyles: string;
4
- static footerContainerStyles: string;
5
- static footerTextStyles: string;
6
- static verticalLineStyle: string;
7
- static clickToPayAllCardsStyle: string;
8
- }
@@ -1,10 +0,0 @@
1
- export class VisaSRCStyles {
2
- }
3
- VisaSRCStyles.buttonContainerStyles = "display: flex; flex-direction: column; justify-content: center; align-items: center;";
4
- VisaSRCStyles.buttonStyles = "color: #ffff; background-color: #ffbe24; border: none; width: 100%; min-height: 40px; font-size: 16px; font-weight: bold; line-height: 19px; letter-spacing: 0.7px; text-transform: uppercase; border-radius: 4px; margin-bottom: 15px; cursor: pointer;";
5
- VisaSRCStyles.footerContainerStyles = "display: flex; flex: 1; flex-wrap: wrap; justify-content: center;";
6
- VisaSRCStyles.footerTextStyles = "text-align: center; color: #666666; margin: 2px 0;";
7
- VisaSRCStyles.verticalLineStyle = "display: inline-block; padding: 0.5px; background-color: #E5E5E5; height: 15px;";
8
- VisaSRCStyles.clickToPayAllCardsStyle = "height: 17px; margin-left: 8px; vertical-align: middle; padding-top: 3px;";
9
- // TODO: Remind to add in docs that if merchant's div is smaller than 240px the button styles will broke
10
- //# sourceMappingURL=../../../../src/lib/secure-remote-commerce/providers/visa-src/visa-src.styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"visa-src.styles.js","sourceRoot":"","sources":["../../../../secure-remote-commerce/providers/visa-src/visa-src.styles.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,aAAa;;AACR,mCAAqB,GAAG,sFAAsF,CAAC;AAE/G,0BAAY,GAAG,0PAA0P,CAAC;AAE1Q,mCAAqB,GAAG,mEAAmE,CAAC;AAE5F,8BAAgB,GAAG,oDAAoD,CAAC;AAExE,+BAAiB,GAAG,iFAAiF,CAAC;AAEtG,qCAAuB,GAAG,2EAA2E,CAAC;AAGxH,wGAAwG"}