@tap-payments/apple-pay-button 1.0.2 → 1.0.4-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.
@@ -20,6 +20,14 @@ export declare const ButtonType: {
20
20
  readonly PLAIN: "plain";
21
21
  readonly SUBSCRIBE: "subscribe";
22
22
  };
23
+ export declare const ThemeMode: {
24
+ readonly DARK: "dark";
25
+ readonly LIGHT: "light";
26
+ };
27
+ export declare const Edges: {
28
+ readonly STRAIGHT: "straight";
29
+ readonly CURVED: "curved";
30
+ };
23
31
  export declare const MerchantCapabilities: {
24
32
  readonly Supports3DS: "supports3DS";
25
33
  readonly SupportsCredit: "supportsCredit";
@@ -46,6 +54,6 @@ export declare const Environment: {
46
54
  };
47
55
  export declare const RSA_DEV_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC8AX++RtxPZFtns4XzXFlDIxPBh0umN4qRXZaKDIlb6a3MknaB7psJWmf2l+e4Cfh9b5tey/+rZqpQ065eXTZfGCAuBLt+fYLQBhLfjRpk8S6hlIzc1Kdjg65uqzMwcTd0p7I4KLwHk1I0oXzuEu53fU1LSZhWp4Mnd6wjVgXAsQIDAQAB\n-----END PUBLIC KEY-----";
48
56
  export declare const RSA_SANDBOX_MW_PUBLIC_KEY = "";
49
- export declare const RSA_PRODUCTION_MW_PUBLIC_KEY = "";
50
- export declare const RSA_BETA_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
51
57
  export declare const RSA_STAGING_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCi9W5jyTvA4Iwv3V5sfNQ7VdSz\n7WqwBbnWFbIUL/GjaaE93mvDv4zbgRSznHaHQPH6pxrMhMh0tV58njkvjHvQ/tvg\npwM8SemNPKEEAPl69tnMvCrJRPh2dWL3OHY8yCW4c38Hyx4fy56Zd5cdoVWfCReu\njCsvASLGz+cfRrj2swIDAQAB\n-----END PUBLIC KEY-----";
58
+ export declare const RSA_BETA_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
59
+ export declare const RSA_PRODUCTION_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
@@ -20,6 +20,14 @@ export var ButtonType = {
20
20
  PLAIN: 'plain',
21
21
  SUBSCRIBE: 'subscribe'
22
22
  };
23
+ export var ThemeMode = {
24
+ DARK: 'dark',
25
+ LIGHT: 'light'
26
+ };
27
+ export var Edges = {
28
+ STRAIGHT: 'straight',
29
+ CURVED: 'curved'
30
+ };
23
31
  export var MerchantCapabilities = {
24
32
  Supports3DS: 'supports3DS',
25
33
  SupportsCredit: 'supportsCredit',
@@ -46,6 +54,6 @@ export var Environment = {
46
54
  };
47
55
  export var RSA_DEV_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC8AX++RtxPZFtns4XzXFlDIxPBh0umN4qRXZaKDIlb6a3MknaB7psJWmf2l+e4Cfh9b5tey/+rZqpQ065eXTZfGCAuBLt+fYLQBhLfjRpk8S6hlIzc1Kdjg65uqzMwcTd0p7I4KLwHk1I0oXzuEu53fU1LSZhWp4Mnd6wjVgXAsQIDAQAB\n-----END PUBLIC KEY-----";
48
56
  export var RSA_SANDBOX_MW_PUBLIC_KEY = "";
49
- export var RSA_PRODUCTION_MW_PUBLIC_KEY = "";
50
- export var RSA_BETA_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
51
57
  export var RSA_STAGING_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCi9W5jyTvA4Iwv3V5sfNQ7VdSz\n7WqwBbnWFbIUL/GjaaE93mvDv4zbgRSznHaHQPH6pxrMhMh0tV58njkvjHvQ/tvg\npwM8SemNPKEEAPl69tnMvCrJRPh2dWL3OHY8yCW4c38Hyx4fy56Zd5cdoVWfCReu\njCsvASLGz+cfRrj2swIDAQAB\n-----END PUBLIC KEY-----";
58
+ export var RSA_BETA_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
59
+ export var RSA_PRODUCTION_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
@@ -3,4 +3,5 @@ import { ApplePayButtonProps } from '../../@types';
3
3
  import './ApplePayButton.css';
4
4
  export type { ApplePayButtonProps };
5
5
  export declare function ApplePayButton(props: ApplePayButtonProps): JSX.Element;
6
- export declare const renderApplePayButton: (props: ApplePayButtonProps, elementId: string) => any;
6
+ export declare function abortApplePaySession(): void;
7
+ export declare const render: (props: ApplePayButtonProps, elementId: string) => any;
@@ -14,57 +14,42 @@ import * as React from 'react';
14
14
  import { createRoot } from 'react-dom/client';
15
15
  import { findOrCreateElementAndInject } from '../../utils';
16
16
  import { useApplePay } from '../../hooks/useApplePay';
17
- import { ButtonStyle, ButtonType, Locale, Scope } from '../../constants';
18
17
  import './ApplePayButton.css';
19
- var ApplePay = React.memo(function (_a) {
20
- var publicKey = _a.publicKey, merchant = _a.merchant, transaction = _a.transaction, billingContact = _a.billingContact, supportedNetworks = _a.supportedNetworks, onCancel = _a.onCancel, onError = _a.onError, onSuccess = _a.onSuccess, onClick = _a.onClick, metaData = _a.metaData, _b = _a.scope, scope = _b === void 0 ? Scope.TapToken : _b, _c = _a.buttonStyle, buttonStyle = _c === void 0 ? ButtonStyle.WhiteOutline : _c, _d = _a.type, type = _d === void 0 ? ButtonType.PLAIN : _d, _e = _a.locale, locale = _e === void 0 ? Locale.EN : _e, debug = _a.debug, merchantIdentifier = _a.merchantIdentifier, environment = _a.environment, onReady = _a.onReady;
21
- var _f = useApplePay({
22
- publicKey: publicKey,
23
- merchant: merchant,
24
- transaction: transaction,
25
- billingContact: billingContact,
26
- supportedNetworks: supportedNetworks,
27
- onError: onError,
28
- onSuccess: onSuccess,
29
- onCancel: onCancel,
30
- scope: scope,
31
- metaData: metaData,
32
- debug: debug,
33
- merchantIdentifier: merchantIdentifier,
34
- environment: environment,
35
- locale: locale,
36
- onReady: onReady
37
- }), loading = _f.loading, onApplePayButtonClicked = _f.onApplePayButtonClicked, disabled = _f.disabled;
18
+ import { getDefaultValues } from '../../utils/defaultValues';
19
+ import { ButtonStyle, Edges, ThemeMode } from '../../constants';
20
+ import { GetEvents, useGetEvents } from '../../hooks/useGetEvents';
21
+ var ApplePay = React.memo(function (props) {
22
+ var mappedProps = getDefaultValues(props);
23
+ var _a = useApplePay(mappedProps), loading = _a.loading, onApplePayButtonClicked = _a.onApplePayButtonClicked, disabled = _a.disabled, abortApplePaySession = _a.abortApplePaySession;
24
+ var onEventReceieved = React.useCallback(function (event) {
25
+ if (event === GetEvents.ABORT) {
26
+ abortApplePaySession();
27
+ }
28
+ }, [abortApplePaySession]);
29
+ useGetEvents(onEventReceieved);
38
30
  React.useEffect(function () {
39
- if (debug) {
40
- console.log('ApplePayButtonProps', {
41
- publicKey: publicKey,
42
- merchant: merchant,
43
- transaction: transaction,
44
- billingContact: billingContact,
45
- supportedNetworks: supportedNetworks,
46
- metaData: metaData,
47
- scope: scope,
48
- buttonStyle: buttonStyle,
49
- type: type,
50
- locale: locale,
51
- debug: debug
52
- });
31
+ if (props.debug) {
32
+ console.log('ApplePayButtonProps', props);
53
33
  }
54
34
  }, []);
55
35
  return (_jsx("button", { className: 'button-applepay-tap', style: {
56
- '-apple-pay-button-type': type,
57
- '-apple-pay-button-style': buttonStyle
36
+ ApplePayButtonType: mappedProps.interface.type,
37
+ ApplePayButtonStyle: mappedProps.interface.theme === ThemeMode.DARK ? ButtonStyle.Black : ButtonStyle.White,
38
+ borderRadius: mappedProps.interface.edges === Edges.STRAIGHT ? '0' : '10px'
58
39
  }, onClick: function () {
40
+ var _a;
59
41
  onApplePayButtonClicked();
60
- onClick === null || onClick === void 0 ? void 0 : onClick();
61
- }, lang: locale, disabled: loading || disabled }));
42
+ (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props);
43
+ }, lang: mappedProps.interface.locale, disabled: loading || disabled }));
62
44
  });
63
45
  export function ApplePayButton(props) {
64
46
  return _jsx(ApplePay, __assign({}, props));
65
47
  }
48
+ export function abortApplePaySession() {
49
+ window.postMessage({ event: GetEvents.ABORT }, '*');
50
+ }
66
51
  var tapConnectInstance = null;
67
- export var renderApplePayButton = function (props, elementId) {
52
+ export var render = function (props, elementId) {
68
53
  if (tapConnectInstance) {
69
54
  return tapConnectInstance;
70
55
  }
@@ -1,3 +1,3 @@
1
- import { ApplePayButtonProps, ApplePayButton, renderApplePayButton } from './ApplePayButton';
2
- export { ApplePayButton, renderApplePayButton };
1
+ import { ApplePayButtonProps, ApplePayButton, render, abortApplePaySession } from './ApplePayButton';
2
+ export { ApplePayButton, render, abortApplePaySession };
3
3
  export type { ApplePayButtonProps };
@@ -1,2 +1,2 @@
1
- import { ApplePayButton, renderApplePayButton } from './ApplePayButton';
2
- export { ApplePayButton, renderApplePayButton };
1
+ import { ApplePayButton, render, abortApplePaySession } from './ApplePayButton';
2
+ export { ApplePayButton, render, abortApplePaySession };
@@ -2,8 +2,9 @@ import { ApplePayButtonProps } from '../@types';
2
2
  declare type UseApplePayProps = Omit<ApplePayButtonProps, 'buttonStyle'>;
3
3
  interface UseApplePayReturnProps {
4
4
  loading: boolean;
5
- onApplePayButtonClicked: () => Promise<void>;
6
5
  disabled: boolean;
6
+ onApplePayButtonClicked: () => Promise<void>;
7
+ abortApplePaySession: () => void;
7
8
  }
8
- export declare const useApplePay: ({ publicKey, merchant, transaction, billingContact, onCancel, onError, onSuccess, scope, supportedNetworks, metaData, debug, merchantIdentifier, environment, locale, onReady }: UseApplePayProps) => UseApplePayReturnProps;
9
+ export declare const useApplePay: ({ publicKey, merchant, transaction, interface: interfaceObj, customer, onCancel, onError, onSuccess, scope, acceptance, metaData, debug, environment, onReady, onMerchantValidation, onShippingContactSelected, onPaymentMethodSelected, onCouponChanged }: UseApplePayProps) => UseApplePayReturnProps;
9
10
  export {};
@@ -50,40 +50,76 @@ import appService from '../api/app.service';
50
50
  import { ApplePayVersion } from '../constants';
51
51
  import { setAxiosGlobalHeaders } from '../api/httpClient';
52
52
  import { getApplePayPaymentMethod, getApplePayRequest, validateCurrency, validateSupportedNetworks } from '../utils/config';
53
+ import { getMerchantCapaplities } from '../utils/defaultValues';
53
54
  export var useApplePay = function (_a) {
54
- var publicKey = _a.publicKey, merchant = _a.merchant, transaction = _a.transaction, billingContact = _a.billingContact, onCancel = _a.onCancel, onError = _a.onError, onSuccess = _a.onSuccess, scope = _a.scope, supportedNetworks = _a.supportedNetworks, metaData = _a.metaData, debug = _a.debug, merchantIdentifier = _a.merchantIdentifier, environment = _a.environment, locale = _a.locale, onReady = _a.onReady;
55
+ var publicKey = _a.publicKey, merchant = _a.merchant, transaction = _a.transaction, interfaceObj = _a.interface, customer = _a.customer, onCancel = _a.onCancel, onError = _a.onError, onSuccess = _a.onSuccess, scope = _a.scope, acceptance = _a.acceptance, metaData = _a.metaData, debug = _a.debug, environment = _a.environment, onReady = _a.onReady, onMerchantValidation = _a.onMerchantValidation, onShippingContactSelected = _a.onShippingContactSelected, onPaymentMethodSelected = _a.onPaymentMethodSelected, onCouponChanged = _a.onCouponChanged;
55
56
  var _b = useState(false), loading = _b[0], setLoading = _b[1];
56
57
  var _c = useState(null), profileData = _c[0], setProfile = _c[1];
57
58
  var _d = useState(false), disabled = _d[0], setDisabled = _d[1];
59
+ var _e = useState(undefined), applePaySession = _e[0], setApplePaySession = _e[1];
60
+ var abortApplePaySession = useCallback(function () {
61
+ applePaySession === null || applePaySession === void 0 ? void 0 : applePaySession.abort();
62
+ }, [applePaySession]);
58
63
  var initialize = useCallback(function (metaData) { return __awaiter(void 0, void 0, void 0, function () {
59
64
  var merchantProfile, payment_options, headers, data, err_1;
60
- return __generator(this, function (_a) {
61
- switch (_a.label) {
65
+ var _a, _b, _c, _d, _e, _f, _g;
66
+ return __generator(this, function (_h) {
67
+ switch (_h.label) {
62
68
  case 0:
63
69
  setLoading(true);
64
70
  appService.setEnv(environment);
65
71
  appService.setBaseUrl();
66
- _a.label = 1;
72
+ _h.label = 1;
67
73
  case 1:
68
- _a.trys.push([1, 4, 5, 6]);
74
+ _h.trys.push([1, 4, 5, 6]);
69
75
  if (metaData) {
70
76
  merchantProfile = metaData.merchant, payment_options = metaData.payment_options, headers = metaData.headers;
71
77
  setAxiosGlobalHeaders(__assign({}, headers));
72
78
  setProfile({ merchant: merchantProfile, payment_options: payment_options });
73
79
  return [2];
74
80
  }
75
- return [4, appService.setBrowserHeaders({ locale: locale, domain: merchant.domain, pk: publicKey })];
81
+ return [4, appService.setBrowserHeaders({
82
+ locale: interfaceObj === null || interfaceObj === void 0 ? void 0 : interfaceObj.locale,
83
+ domain: merchant.domain,
84
+ pk: publicKey
85
+ })];
76
86
  case 2:
77
- _a.sent();
78
- return [4, appService.checkoutProfile()];
87
+ _h.sent();
88
+ return [4, appService.checkoutProfile({
89
+ currency: transaction.currency,
90
+ merchant_id: merchant.id,
91
+ total_amount: Number(transaction.amount),
92
+ order: __assign(__assign({ amount: Number(transaction.amount), currency: transaction.currency }, (customer && {
93
+ customer: {
94
+ id: customer.id,
95
+ email: (_a = customer.contact) === null || _a === void 0 ? void 0 : _a.email,
96
+ first_name: ((_b = customer.name) === null || _b === void 0 ? void 0 : _b.length) ? customer.name[0].first : '',
97
+ last_name: ((_c = customer.name) === null || _c === void 0 ? void 0 : _c.length) ? customer.name[0].last : '',
98
+ phone: {
99
+ country_code: ((_e = (_d = customer.contact) === null || _d === void 0 ? void 0 : _d.phone) === null || _e === void 0 ? void 0 : _e.countryCode) || '',
100
+ number: ((_g = (_f = customer.contact) === null || _f === void 0 ? void 0 : _f.phone) === null || _g === void 0 ? void 0 : _g.number) || ''
101
+ }
102
+ }
103
+ })), { merchant: {
104
+ id: merchant.id
105
+ }, items: [
106
+ {
107
+ amount: Number(transaction.amount),
108
+ currency: transaction.currency,
109
+ name: 'apple pay sdk order item',
110
+ quantity: 1,
111
+ requiresShipping: 'no'
112
+ }
113
+ ] })
114
+ })];
79
115
  case 3:
80
- data = _a.sent();
116
+ data = _h.sent();
81
117
  if (debug)
82
118
  console.log('merchant configuration: ', data);
83
119
  setProfile(data);
84
120
  return [3, 6];
85
121
  case 4:
86
- err_1 = _a.sent();
122
+ err_1 = _h.sent();
87
123
  onError && onError(err_1.errors || err_1);
88
124
  return [3, 6];
89
125
  case 5:
@@ -93,7 +129,7 @@ export var useApplePay = function (_a) {
93
129
  case 6: return [2];
94
130
  }
95
131
  });
96
- }); }, [environment, locale, merchant.domain, publicKey, debug, onError]);
132
+ }); }, [environment, interfaceObj === null || interfaceObj === void 0 ? void 0 : interfaceObj.locale, merchant.domain, publicKey, debug, onError]);
97
133
  useEffect(function () {
98
134
  initialize(metaData);
99
135
  }, [initialize, metaData]);
@@ -115,23 +151,27 @@ export var useApplePay = function (_a) {
115
151
  try {
116
152
  paymentMethod = getApplePayPaymentMethod(profileData.payment_options.payment_methods || []);
117
153
  currency = validateCurrency(transaction.currency, paymentMethod.supported_currencies);
118
- cardBrands = validateSupportedNetworks(paymentMethod.supported_card_brands, supportedNetworks);
154
+ cardBrands = validateSupportedNetworks(paymentMethod.supported_card_brands, acceptance.supportedBrands);
119
155
  request = getApplePayRequest({
156
+ acceptance: acceptance,
120
157
  countryCode: profileData.merchant.country_code,
121
158
  transaction: __assign(__assign({}, transaction), { currency: currency }),
122
- billingContact: billingContact,
159
+ customer: customer,
123
160
  supportedNetworks: cardBrands,
161
+ merchantCapabilities: getMerchantCapaplities(acceptance === null || acceptance === void 0 ? void 0 : acceptance.supportedCards),
124
162
  name: profileData.merchant.name
125
163
  });
126
164
  if (debug) {
127
165
  console.info("Creating ApplePaySession with version: ".concat(ApplePayVersion, " and request: ").concat(JSON.stringify(request)));
128
166
  }
129
167
  session_1 = new ApplePaySession(ApplePayVersion, request);
168
+ setApplePaySession(session_1);
130
169
  session_1.onvalidatemerchant = function (event) { return __awaiter(void 0, void 0, void 0, function () {
131
170
  var merchantSession, error_1;
132
171
  return __generator(this, function (_a) {
133
172
  switch (_a.label) {
134
173
  case 0:
174
+ onMerchantValidation === null || onMerchantValidation === void 0 ? void 0 : onMerchantValidation('initiated');
135
175
  if (debug) {
136
176
  console.info('Creating merchant session and validating merchant session');
137
177
  console.info('onvalidatemerchant event', event);
@@ -143,16 +183,19 @@ export var useApplePay = function (_a) {
143
183
  if (debug) {
144
184
  console.info("creating merchant session for merchantData: ".concat(JSON.stringify(profileData.merchant), " and validationURL: ").concat(event.validationURL, " and merchant.domain: ").concat(merchant.domain));
145
185
  }
146
- return [4, appService.appleSession(profileData.merchant, event.validationURL, merchant.domain, merchantIdentifier)];
186
+ return [4, appService.appleSession(__assign(__assign({}, profileData.merchant), { id: merchant.id }), event.validationURL, merchant.domain, merchant.identifier || merchant.id)];
147
187
  case 2:
148
188
  merchantSession = _a.sent();
149
189
  if (debug)
150
190
  console.info('merchantSession', merchantSession);
151
191
  session_1.completeMerchantValidation(merchantSession);
152
- console.info('merchantSession completed successfully!');
192
+ onMerchantValidation === null || onMerchantValidation === void 0 ? void 0 : onMerchantValidation('completed');
193
+ if (debug)
194
+ console.info('merchantSession completed successfully!');
153
195
  return [3, 4];
154
196
  case 3:
155
197
  error_1 = _a.sent();
198
+ onMerchantValidation === null || onMerchantValidation === void 0 ? void 0 : onMerchantValidation('error');
156
199
  if (debug)
157
200
  console.error('error in onvalidatemerchant', error_1);
158
201
  session_1.completePayment({ status: ApplePaySession.STATUS_FAILURE });
@@ -212,6 +255,63 @@ export var useApplePay = function (_a) {
212
255
  }
213
256
  });
214
257
  }); };
258
+ if (onShippingContactSelected) {
259
+ session_1.onshippingcontactselected = function (_a) {
260
+ var shippingContact = _a.shippingContact;
261
+ return __awaiter(void 0, void 0, void 0, function () {
262
+ var response;
263
+ return __generator(this, function (_b) {
264
+ switch (_b.label) {
265
+ case 0: return [4, onShippingContactSelected(shippingContact)];
266
+ case 1:
267
+ response = _b.sent();
268
+ if (response) {
269
+ session_1.completeShippingContactSelection(response);
270
+ }
271
+ return [2];
272
+ }
273
+ });
274
+ });
275
+ };
276
+ }
277
+ if (onPaymentMethodSelected) {
278
+ session_1.onpaymentmethodselected = function (_a) {
279
+ var paymentMethod = _a.paymentMethod;
280
+ return __awaiter(void 0, void 0, void 0, function () {
281
+ var response;
282
+ return __generator(this, function (_b) {
283
+ switch (_b.label) {
284
+ case 0: return [4, onPaymentMethodSelected(paymentMethod)];
285
+ case 1:
286
+ response = _b.sent();
287
+ if (response) {
288
+ session_1.completePaymentMethodSelection(response);
289
+ }
290
+ return [2];
291
+ }
292
+ });
293
+ });
294
+ };
295
+ }
296
+ if (onCouponChanged) {
297
+ session_1.oncouponcodechanged = function (_a) {
298
+ var couponCode = _a.couponCode;
299
+ return __awaiter(void 0, void 0, void 0, function () {
300
+ var response;
301
+ return __generator(this, function (_b) {
302
+ switch (_b.label) {
303
+ case 0: return [4, onCouponChanged(couponCode)];
304
+ case 1:
305
+ response = _b.sent();
306
+ if (response) {
307
+ session_1.completeCouponCodeChange(response);
308
+ }
309
+ return [2];
310
+ }
311
+ });
312
+ });
313
+ };
314
+ }
215
315
  session_1.oncancel = function (event) {
216
316
  console.info('oncancel event', event);
217
317
  if (onCancel)
@@ -239,5 +339,10 @@ export var useApplePay = function (_a) {
239
339
  return [2];
240
340
  });
241
341
  }); };
242
- return { loading: loading, onApplePayButtonClicked: onApplePayButtonClicked, disabled: !profileData || disabled };
342
+ return {
343
+ loading: loading,
344
+ disabled: !profileData || disabled,
345
+ onApplePayButtonClicked: onApplePayButtonClicked,
346
+ abortApplePaySession: abortApplePaySession
347
+ };
243
348
  };
@@ -0,0 +1,4 @@
1
+ export declare enum GetEvents {
2
+ ABORT = "applepaySDK:abort"
3
+ }
4
+ export declare const useGetEvents: (onEventReceieved: (event: GetEvents) => void) => void;
@@ -0,0 +1,15 @@
1
+ import { useCallback, useEffect } from 'react';
2
+ export var GetEvents;
3
+ (function (GetEvents) {
4
+ GetEvents["ABORT"] = "applepaySDK:abort";
5
+ })(GetEvents || (GetEvents = {}));
6
+ export var useGetEvents = function (onEventReceieved) {
7
+ var onEventReceievedFun = useCallback(function (msg) {
8
+ var event = msg.data.event;
9
+ onEventReceieved(event);
10
+ }, [onEventReceieved]);
11
+ useEffect(function () {
12
+ window.addEventListener('message', onEventReceievedFun);
13
+ return function () { return window.removeEventListener('message', onEventReceievedFun); };
14
+ }, [onEventReceievedFun]);
15
+ };
@@ -1 +1 @@
1
- export declare function useScript(src: string, async?: boolean): "loading" | "ready" | "idle" | "error";
1
+ export declare function useScript(src: string, async?: boolean): "error" | "loading" | "ready" | "idle";
package/build/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { ApplePayButtonProps, ApplePayButton } from './features/ApplePayButton';
2
- import { ButtonStyle, Scope, SupportedNetworks, Environment } from './constants';
1
+ import { ApplePayButtonProps, ApplePayButton, abortApplePaySession } from './features/ApplePayButton';
2
+ import { ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities } from './constants';
3
3
  export type { ApplePayButtonProps };
4
- export { ApplePayButton, ButtonStyle, Scope, SupportedNetworks, Environment };
4
+ export { ApplePayButton, abortApplePaySession, ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities };
package/build/index.js CHANGED
@@ -1,10 +1,15 @@
1
- import { ApplePayButton, renderApplePayButton } from './features/ApplePayButton';
2
- import { ButtonStyle, Scope, SupportedNetworks, Environment } from './constants';
3
- export { ApplePayButton, ButtonStyle, Scope, SupportedNetworks, Environment };
4
- window['TapSDKs'] = {
5
- renderApplePayButton: renderApplePayButton,
6
- ButtonStyle: ButtonStyle,
1
+ import { ApplePayButton, render, abortApplePaySession } from './features/ApplePayButton';
2
+ import { ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities } from './constants';
3
+ export { ApplePayButton, abortApplePaySession, ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities };
4
+ window['TapApplepaySDK'] = {
5
+ render: render,
6
+ abortApplePaySession: abortApplePaySession,
7
7
  Scope: Scope,
8
8
  SupportedNetworks: SupportedNetworks,
9
- Environment: Environment
9
+ Environment: Environment,
10
+ Locale: Locale,
11
+ ButtonType: ButtonType,
12
+ ThemeMode: ThemeMode,
13
+ Edges: Edges,
14
+ MerchantCapabilities: MerchantCapabilities
10
15
  };
@@ -1,8 +1,10 @@
1
- import { ApplePayButtonProps, ApplePayRequestData, PaymentMethod } from '../@types';
1
+ import { Acceptance, ApplePayButtonProps, ApplePayRequestData, PaymentMethod } from '../@types';
2
2
  import { SupportedNetworks } from '../constants';
3
- export declare const validateSupportedNetworks: (supportedNetworksConfig: Array<(typeof SupportedNetworks)[keyof typeof SupportedNetworks]>, supportedNetworks: ApplePayButtonProps['supportedNetworks']) => ("amex" | "mada" | "masterCard" | "visa" | "chinaUnionPay" | "discover" | "electron" | "jcb" | "maestro")[];
3
+ export declare const validateSupportedNetworks: (supportedNetworksConfig: Array<(typeof SupportedNetworks)[keyof typeof SupportedNetworks]>, supportedNetworks: Acceptance['supportedBrands']) => ("amex" | "mada" | "masterCard" | "visa" | "chinaUnionPay" | "discover" | "electron" | "jcb" | "maestro")[];
4
4
  export declare const validateCurrency: (currency: string, currencies: string[]) => string;
5
- export declare const getApplePayRequest: ({ transaction, billingContact, supportedNetworks, countryCode, name }: Pick<ApplePayButtonProps, "supportedNetworks" | "transaction" | "billingContact"> & {
5
+ export declare const getApplePayRequest: ({ transaction, customer, supportedNetworks, merchantCapabilities, countryCode, name, acceptance }: Pick<ApplePayButtonProps, "transaction" | "customer" | "acceptance"> & {
6
+ supportedNetworks: Acceptance['supportedBrands'];
7
+ merchantCapabilities: ApplePayRequestData['merchantCapabilities'];
6
8
  countryCode: string;
7
9
  name: string;
8
10
  }) => ApplePayRequestData;
@@ -1,4 +1,3 @@
1
- import { MerchantCapabilities } from '../constants';
2
1
  import { JSEncrypt } from 'jsencrypt';
3
2
  export var validateSupportedNetworks = function (supportedNetworksConfig, supportedNetworks) {
4
3
  var toLowerCase = function (item) { return item.toLowerCase(); };
@@ -25,22 +24,28 @@ export var validateCurrency = function (currency, currencies) {
25
24
  return currency;
26
25
  };
27
26
  export var getApplePayRequest = function (_a) {
28
- var transaction = _a.transaction, billingContact = _a.billingContact, supportedNetworks = _a.supportedNetworks, countryCode = _a.countryCode, name = _a.name;
27
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k;
28
+ var transaction = _a.transaction, customer = _a.customer, supportedNetworks = _a.supportedNetworks, merchantCapabilities = _a.merchantCapabilities, countryCode = _a.countryCode, name = _a.name, acceptance = _a.acceptance;
29
29
  return {
30
30
  countryCode: countryCode,
31
31
  currencyCode: transaction.currency,
32
- merchantCapabilities: [MerchantCapabilities.Supports3DS],
32
+ merchantCapabilities: merchantCapabilities,
33
33
  supportedNetworks: supportedNetworks,
34
- billingContact: billingContact && {
35
- phoneNumber: billingContact.phone.code + billingContact.phone.number,
36
- emailAddress: billingContact.email.address,
37
- givenName: billingContact.name.first,
38
- familyName: billingContact.name.last
34
+ billingContact: customer && {
35
+ phoneNumber: ((_c = (_b = customer.contact) === null || _b === void 0 ? void 0 : _b.phone) === null || _c === void 0 ? void 0 : _c.countryCode) || '' + ((_e = (_d = customer.contact) === null || _d === void 0 ? void 0 : _d.phone) === null || _e === void 0 ? void 0 : _e.number),
36
+ emailAddress: (_f = customer.contact) === null || _f === void 0 ? void 0 : _f.email,
37
+ givenName: ((_g = customer.name) === null || _g === void 0 ? void 0 : _g.length) ? (_h = customer.name[0]) === null || _h === void 0 ? void 0 : _h.first : '',
38
+ familyName: ((_j = customer.name) === null || _j === void 0 ? void 0 : _j.length) ? (_k = customer.name[0]) === null || _k === void 0 ? void 0 : _k.last : ''
39
39
  },
40
40
  total: {
41
41
  amount: Number(transaction.amount),
42
42
  label: name
43
- }
43
+ },
44
+ supportsCouponCode: acceptance.supportsCouponCode,
45
+ couponCode: transaction.couponCode,
46
+ requiredShippingContactFields: customer === null || customer === void 0 ? void 0 : customer.shippingContactFields,
47
+ shippingMethods: transaction.shipping,
48
+ lineItems: transaction.lineItems
44
49
  };
45
50
  };
46
51
  export var getApplePayPaymentMethod = function (paymentMethods) {
@@ -0,0 +1,32 @@
1
+ import { ApplePayButtonProps } from '../@types';
2
+ export declare const getDefaultValues: (mainObject: ApplePayButtonProps) => {
3
+ interface: {
4
+ locale?: "en" | "ar" | "fr" | undefined;
5
+ theme?: "dark" | "light" | undefined;
6
+ edges?: "straight" | "curved" | undefined;
7
+ type?: "book" | "buy" | "check-out" | "pay" | "plain" | "subscribe" | undefined;
8
+ };
9
+ scope?: "AppleToken" | "TapToken" | undefined;
10
+ publicKey: string;
11
+ environment: "production" | "sandbox" | "beta" | "development" | "staging";
12
+ merchant: {
13
+ id: string;
14
+ domain: string;
15
+ identifier?: string | undefined;
16
+ };
17
+ customer?: import("../@types").Customer | undefined;
18
+ acceptance: import("../@types").Acceptance;
19
+ transaction: import("../@types").Transaction;
20
+ onCancel?: (() => void) | undefined;
21
+ onError?: ((error: any) => void) | undefined;
22
+ onSuccess?: ((data: Record<string, any>) => Promise<void>) | undefined;
23
+ onClick?: (() => void) | undefined;
24
+ onReady?: (() => void) | undefined;
25
+ onMerchantValidation?: ((status: "initiated" | "completed" | "error") => void) | undefined;
26
+ onShippingContactSelected?: ((shippingContact: import("../@types").ApplePayPaymentContact) => Promise<void | import("../@types").ApplePayUpdateData>) | undefined;
27
+ onPaymentMethodSelected?: ((paymentMethod: import("../@types").ApplePayPaymentMethod) => Promise<void | import("../@types").ApplePayUpdateData>) | undefined;
28
+ onCouponChanged?: ((couponCode: string) => Promise<void | import("../@types").ApplePayUpdateData>) | undefined;
29
+ metaData?: import("../@types").MetaData | undefined;
30
+ debug?: boolean | undefined;
31
+ };
32
+ export declare const getMerchantCapaplities: (supportedCards?: Array<string>) => ("supports3DS" | "supportsCredit" | "supportsDebit")[];
@@ -0,0 +1,48 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
13
+ if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
14
+ if (ar || !(i in from)) {
15
+ if (!ar) ar = Array.prototype.slice.call(from, 0, i);
16
+ ar[i] = from[i];
17
+ }
18
+ }
19
+ return to.concat(ar || Array.prototype.slice.call(from));
20
+ };
21
+ import { ThemeMode, Locale, ButtonType, Edges, MerchantCapabilities } from '../constants';
22
+ export var getDefaultValues = function (mainObject) {
23
+ var userThemeMode = window.matchMedia('(prefers-color-scheme: light)').matches ? ThemeMode.LIGHT : ThemeMode.DARK;
24
+ var userLang = navigator.language.toLowerCase().includes(Locale.AR) ? Locale.AR : Locale.EN;
25
+ var defaultInterface = {
26
+ locale: userLang,
27
+ theme: userThemeMode,
28
+ type: ButtonType.PLAIN,
29
+ edges: Edges.CURVED
30
+ };
31
+ return __assign(__assign({}, mainObject), { interface: __assign(__assign({}, defaultInterface), mainObject.interface) });
32
+ };
33
+ export var getMerchantCapaplities = function (supportedCards) {
34
+ var merchantCapaplities = [MerchantCapabilities.Supports3DS];
35
+ if (!supportedCards) {
36
+ merchantCapaplities = __spreadArray(__spreadArray([], merchantCapaplities, true), [
37
+ MerchantCapabilities.SupportsCredit,
38
+ MerchantCapabilities.SupportsDebit
39
+ ], false);
40
+ }
41
+ else if (supportedCards.includes('CREDIT')) {
42
+ merchantCapaplities.push(MerchantCapabilities.SupportsCredit);
43
+ }
44
+ else if (supportedCards.includes('DEBIT')) {
45
+ merchantCapaplities.push(MerchantCapabilities.SupportsDebit);
46
+ }
47
+ return merchantCapaplities;
48
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tap-payments/apple-pay-button",
3
- "version": "1.0.2",
3
+ "version": "1.0.4-test",
4
4
  "description": "Apple Pay Button React Component",
5
5
  "main": "build/index.js",
6
6
  "module": "build/index.js",
@@ -20,7 +20,7 @@
20
20
  "copy:files": "copyfiles -u 1 src/**/*.css build/",
21
21
  "tsc:alias": "tsc-alias -p tsconfig.json",
22
22
  "ts:build": "rm -rf build && tsc && yarn tsc:alias && yarn copy:files",
23
- "push": "npm publish --access public"
23
+ "push": "npm publish --access public --tag test"
24
24
  },
25
25
  "keywords": [],
26
26
  "author": {