@tap-payments/apple-pay-button 0.0.28-test → 0.0.29-test

package/README.md

@@ -38,75 +38,73 @@ import {
 const App = () => {
 	return (
 		<ApplePayButton
-			// required (The public Key provided by Tap)
+			// The public Key provided by Tap
 			publicKey={'pk_test_xxxxxxxxxxxxxxxzh'}
-			// optional (The environment of the SDK and it can be one of these environments)
+			//The environment of the SDK and it can be one of these environments
 			environment={Environment.Development}
-			// optional (to enable the debug mode)
+			//to enable the debug mode
 			debug
-			// required
 			merchant={{
-				// required (The merchant domain name)
+				//  The merchant domain name
 				domain: 'example.com',
-				// required (The merchant identifier provided by Tap)
+				//  The merchant identifier provided by Tap
 				id: '1xxxxx8'
 			}}
-			// required
 			transaction={{
-				// required (The amount to be charged)
+				// The amount to be charged
 				amount: '12',
-				// required (The currency of the amount)
+				// The currency of the amount
 				currency: 'KWD'
 			}}
-			// optional (The scope of the SDK and it can be one of these scopes:
+			// The scope of the SDK and it can be one of these scopes:
 			// [TapToken,AppleToken], by default it is TapToken)
 			scope={Scope.TapToken}
-			// optional
 			acceptance={{
-				// optional (The supported networks for the Apple Pay button and it
+				// The supported networks for the Apple Pay button and it
 				// can be one of these networks: [Mada,Visa,MasterCard], by default
-				// we bring all the supported networks from tap merchant configuration)
+				// we bring all the supported networks from tap merchant configuration
 				supportedBrands: [SupportedNetworks.Mada, SupportedNetworks.Visa, SupportedNetworks.MasterCard]
+				supportedCards : ["DEBIT","CREDIT"], 
+      			supportedCardsWithAuthentications : ["3DS","EMV"]
 			}}
-			// optional (The billing contact information)
+			// The billing contact information
 			customer={{
-				//"OPTIONAL : Customer ID",
 				id: 'cus_xxx',
 				name: [
 					{
-						//"REQUIRED : en or ar",
+						//"en or ar",
 						lang: Locale.EN,
-						// "OPTIONAL : First name of the customer.",
+						// "First name of the customer.",
 						first: 'test',
-						//"OPTIONAL : Last name of the customer.",
+						//"Last name of the customer.",
 						last: 'tester',
-						// "OPTIONAL : Middle name of the customer.",
+						// "Middle name of the customer.",
 						middle: 'test'
 					}
 				],
 				// Defines the contact details for the customer & to be used in creating the billing contact info in Apple pay request
 				contact: {
-					//"OPTIONAL :  The customer's email",
+					//"The customer's email",
 					email: 'test@gmail.com',
-					//"OPTIONAL :  The customer's phone number"
+					//"The customer's phone number"
 					phone: {
-						//"OPTIONAL :  The customer's country code",
+						//"The customer's country code",
 						countryCode: '+20',
-						//"OPTIONAL :  The customer's phone number
+						//"The customer's phone number
 						number: '10XXXXXX56'
 					}
 				}
 			}}
-			//optional (for styling button)
+			//for styling button
 			interface={{
-				// optional (The locale of the Apple Pay button and it can be one of these locales:[EN,AR])
+				//The locale of the Apple Pay button and it can be one of these locales:[EN,AR]
 				locale: Locale.EN,
-				// optional (The theme of the Apple Pay button and it can be one of
-				// these values : [light,Dark], by default it is detected from user device )
+				// The theme of the Apple Pay button and it can be one of
+				// these values : [light,Dark], by default it is detected from user device 
 				theme: ThemeMode.DARK,
-				// optional (The type of the Apple Pay )
+				// The type of the Apple Pay 
 				type: ButtonType.BUY,
-				// optional (The border of the Apple Pay button and it can be one of these values:[curved,straight])
+				// The border of the Apple Pay button and it can be one of these values:[curved,straight]
 				edges: Edges.CURVED
 			}}
 			// optional (A callback function that will be called when you cancel
@@ -143,8 +141,8 @@ const App = () => {
 		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<title>apple pay button</title>
-		<link rel="stylesheet" href="https://apple-pay-button.b-cdn.net/build-0.0.21-test/main.css" />
-		<script src="https://apple-pay-button.b-cdn.net/build-0.0.21-test/main.js"></script>
+		<link rel="stylesheet" href="https://tap-sdks.b-cdn.net/apple-pay/build-1.0.29-test/main.css" />
+		<script src="https://tap-sdks.b-cdn.net/apple-pay/build-1.0.29-test/main.js"></script>
 	</head>
 
 	<body>
@@ -158,7 +156,7 @@ const App = () => {
 			        scope: Scope.TapToken,
 			        merchant: {
 			            domain: 'tp-txxxxxxxx',
-			            id: 'merchant_xxxxxxxxxx"
+			            id: 'merchant_xxxxxxxxxx'
 			        },
 			        transaction: {
 			            currency: 'SAR',
@@ -166,6 +164,8 @@ const App = () => {
 			        },
 			        acceptance: {
 			            supportedBrands: [SupportedNetworks.Mada, SupportedNetworks.Visa, SupportedNetworks.MasterCard]
+						supportedCards : ["DEBIT","CREDIT"], 
+      				    supportedCardsWithAuthentications : ["3DS","EMV"]
 			        },
 
 			        customer: {

package/build/hooks/useApplePay.js

@@ -50,6 +50,7 @@ import appService from '../api/app.service';
 import { ApplePayVersion } from '../constants';
 import { setAxiosGlobalHeaders } from '../api/httpClient';
 import { getApplePayPaymentMethod, getApplePayRequest, validateCurrency, validateSupportedNetworks } from '../utils/config';
+import { getMerchantCapaplities } from '../utils/defaultValues';
 export var useApplePay = function (_a) {
     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;
     var _b = useState(false), loading = _b[0], setLoading = _b[1];
@@ -152,6 +153,7 @@ export var useApplePay = function (_a) {
                     transaction: __assign(__assign({}, transaction), { currency: currency }),
                     customer: customer,
                     supportedNetworks: cardBrands,
+                    merchantCapabilities: getMerchantCapaplities(acceptance === null || acceptance === void 0 ? void 0 : acceptance.supportedCards),
                     name: profileData.merchant.name
                 });
                 if (debug) {

package/build/utils/config.d.ts

@@ -2,8 +2,9 @@ import { Acceptance, ApplePayButtonProps, ApplePayRequestData, PaymentMethod } f
 import { SupportedNetworks } from '../constants';
 export declare const validateSupportedNetworks: (supportedNetworksConfig: Array<(typeof SupportedNetworks)[keyof typeof SupportedNetworks]>, supportedNetworks: Acceptance['supportedBrands']) => ("amex" | "mada" | "masterCard" | "visa" | "chinaUnionPay" | "discover" | "electron" | "jcb" | "maestro")[];
 export declare const validateCurrency: (currency: string, currencies: string[]) => string;
-export declare const getApplePayRequest: ({ transaction, customer, supportedNetworks, countryCode, name }: Pick<ApplePayButtonProps, "transaction" | "customer"> & {
+export declare const getApplePayRequest: ({ transaction, customer, supportedNetworks, merchantCapabilities, countryCode, name }: Pick<ApplePayButtonProps, "transaction" | "customer"> & {
     supportedNetworks: Acceptance['supportedBrands'];
+    merchantCapabilities: ApplePayRequestData['merchantCapabilities'];
     countryCode: string;
     name: string;
 }) => ApplePayRequestData;

package/build/utils/config.js

@@ -1,4 +1,3 @@
-import { MerchantCapabilities } from '../constants';
 import { JSEncrypt } from 'jsencrypt';
 export var validateSupportedNetworks = function (supportedNetworksConfig, supportedNetworks) {
     var toLowerCase = function (item) { return item.toLowerCase(); };
@@ -26,11 +25,11 @@ export var validateCurrency = function (currency, currencies) {
 };
 export var getApplePayRequest = function (_a) {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    var transaction = _a.transaction, customer = _a.customer, supportedNetworks = _a.supportedNetworks, countryCode = _a.countryCode, name = _a.name;
+    var transaction = _a.transaction, customer = _a.customer, supportedNetworks = _a.supportedNetworks, merchantCapabilities = _a.merchantCapabilities, countryCode = _a.countryCode, name = _a.name;
     return {
         countryCode: countryCode,
         currencyCode: transaction.currency,
-        merchantCapabilities: [MerchantCapabilities.Supports3DS],
+        merchantCapabilities: merchantCapabilities,
         supportedNetworks: supportedNetworks,
         billingContact: customer && {
             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),

package/build/utils/defaultValues.d.ts

@@ -1,4 +1,4 @@
-import { ApplePayButtonProps } from '..';
+import { ApplePayButtonProps } from '../@types';
 export declare const getDefaultValues: (mainObject: ApplePayButtonProps) => {
     interface: {
         locale?: "en" | "ar" | "fr" | undefined;
@@ -27,3 +27,4 @@ export declare const getDefaultValues: (mainObject: ApplePayButtonProps) => {
     metaData?: import("../@types").MetaData | undefined;
     debug?: boolean | undefined;
 };
+export declare const getMerchantCapaplities: (supportedCards?: Array<string>) => ("supports3DS" | "supportsCredit" | "supportsDebit")[];

package/build/utils/defaultValues.js

@@ -9,7 +9,16 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { ThemeMode, Locale, ButtonType, Edges } from '../constants';
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { ThemeMode, Locale, ButtonType, Edges, MerchantCapabilities } from '../constants';
 export var getDefaultValues = function (mainObject) {
     var userThemeMode = window.matchMedia('(prefers-color-scheme: light)').matches ? ThemeMode.LIGHT : ThemeMode.DARK;
     var userLang = navigator.language.toLowerCase().includes(Locale.AR) ? Locale.AR : Locale.EN;
@@ -21,3 +30,19 @@ export var getDefaultValues = function (mainObject) {
     };
     return __assign(__assign({}, mainObject), { interface: __assign(__assign({}, defaultInterface), mainObject.interface) });
 };
+export var getMerchantCapaplities = function (supportedCards) {
+    var merchantCapaplities = [MerchantCapabilities.Supports3DS];
+    if (!supportedCards) {
+        merchantCapaplities = __spreadArray(__spreadArray([], merchantCapaplities, true), [
+            MerchantCapabilities.SupportsCredit,
+            MerchantCapabilities.SupportsDebit
+        ], false);
+    }
+    else if (supportedCards.includes('CREDIT')) {
+        merchantCapaplities.push(MerchantCapabilities.SupportsCredit);
+    }
+    else if (supportedCards.includes('DEBIT')) {
+        merchantCapaplities.push(MerchantCapabilities.SupportsDebit);
+    }
+    return merchantCapaplities;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/apple-pay-button",
-	"version": "0.0.28-test",
+	"version": "0.0.29-test",
 	"description": "Apple Pay Button React Component",
 	"main": "build/index.js",
 	"module": "build/index.js",
@@ -20,7 +20,7 @@
 		"copy:files": "copyfiles -u 1 src/**/*.css build/",
 		"tsc:alias": "tsc-alias -p tsconfig.json",
 		"ts:build": "rm -rf build && tsc && yarn tsc:alias && yarn copy:files",
-		"push": "npm publish --access public --tag test"
+		"push": "npm publish --access public"
 	},
 	"keywords": [],
 	"author": {