@tap-payments/apple-pay-button 0.0.37-development → 0.0.37-test

package/build/hooks/useMerchantApplePay.js

@@ -0,0 +1,176 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import * as React from 'react';
+import appService from '../api';
+import { Scope, CHARGE_CODE } from '../@types';
+var EVENT_NAME = 'TAP_BUTTON::APPLE_PAY_ON_PAYMENT_AUTHORIZED';
+export var useMerchantApplePay = function (_a) {
+    var isIframeIntegration = _a.isIframeIntegration, onError = _a.onError, onSuccess = _a.onSuccess, setLoading = _a.setLoading, setError = _a.setError, setSuccess = _a.setSuccess, scope = _a.scope, profileData = _a.profileData, order = _a.order, customer = _a.customer, transaction = _a.transaction, operator = _a.operator, redirect = _a.redirect, post = _a.post;
+    var onMessageReceived = React.useCallback(function (_a) {
+        var message = _a.data;
+        return __awaiter(void 0, void 0, void 0, function () {
+            var _b, event, data, _c, response, tokenId, supportCurrency, transactionRequest, transactionResponse, _d, successState, e_1;
+            var _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+            return __generator(this, function (_w) {
+                switch (_w.label) {
+                    case 0:
+                        _b = message !== null && message !== void 0 ? message : {}, event = _b.event, data = _b.data;
+                        if (!data || event !== EVENT_NAME)
+                            return [2];
+                        _w.label = 1;
+                    case 1:
+                        _w.trys.push([1, 13, 14, 15]);
+                        _c = scope;
+                        switch (_c) {
+                            case Scope.APPLE_PAY_TOKEN: return [3, 2];
+                            case Scope.TAP_TOKEN: return [3, 3];
+                            case Scope.AUTHORIZE: return [3, 5];
+                            case Scope.CHARGE: return [3, 5];
+                        }
+                        return [3, 11];
+                    case 2:
+                        onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(data);
+                        return [3, 12];
+                    case 3:
+                        setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
+                        return [4, appService.tapTokenization(data)];
+                    case 4:
+                        response = _w.sent();
+                        setSuccess === null || setSuccess === void 0 ? void 0 : setSuccess(true);
+                        onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(response);
+                        return [3, 12];
+                    case 5:
+                        setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
+                        return [4, appService.tapTokenization(data)];
+                    case 6:
+                        tokenId = (_w.sent()).id;
+                        supportCurrency = ((_f = (_e = profileData === null || profileData === void 0 ? void 0 : profileData.payment_options) === null || _e === void 0 ? void 0 : _e.supported_currencies) !== null && _f !== void 0 ? _f : [])[0];
+                        transactionRequest = {
+                            auto: (_g = transaction === null || transaction === void 0 ? void 0 : transaction.authorize) === null || _g === void 0 ? void 0 : _g.auto,
+                            amount: order.amount,
+                            currency: order.currency,
+                            selected_amount: supportCurrency === null || supportCurrency === void 0 ? void 0 : supportCurrency.amount,
+                            selected_currency: supportCurrency === null || supportCurrency === void 0 ? void 0 : supportCurrency.currency,
+                            customer: (customer === null || customer === void 0 ? void 0 : customer.id)
+                                ? { id: customer === null || customer === void 0 ? void 0 : customer.id }
+                                : {
+                                    email: (_h = customer === null || customer === void 0 ? void 0 : customer.contact) === null || _h === void 0 ? void 0 : _h.email,
+                                    first_name: ((_j = customer === null || customer === void 0 ? void 0 : customer.name) === null || _j === void 0 ? void 0 : _j.length) ? customer.name[0].first : '',
+                                    last_name: ((_k = customer === null || customer === void 0 ? void 0 : customer.name) === null || _k === void 0 ? void 0 : _k.length) ? customer.name[0].last : '',
+                                    phone: {
+                                        country_code: (_o = (_m = (_l = customer === null || customer === void 0 ? void 0 : customer.contact) === null || _l === void 0 ? void 0 : _l.phone) === null || _m === void 0 ? void 0 : _m.countryCode) !== null && _o !== void 0 ? _o : '',
+                                        number: (_r = (_q = (_p = customer === null || customer === void 0 ? void 0 : customer.contact) === null || _p === void 0 ? void 0 : _p.phone) === null || _q === void 0 ? void 0 : _q.number) !== null && _r !== void 0 ? _r : ''
+                                    }
+                                },
+                            fee: 0,
+                            merchant: {
+                                id: (_t = (_s = profileData === null || profileData === void 0 ? void 0 : profileData.merchant) === null || _s === void 0 ? void 0 : _s.id) !== null && _t !== void 0 ? _t : ''
+                            },
+                            order: (_u = profileData === null || profileData === void 0 ? void 0 : profileData.payment_options) === null || _u === void 0 ? void 0 : _u.order,
+                            product: 'Apple-Pay-Button',
+                            save_card: false,
+                            source: { id: tokenId !== null && tokenId !== void 0 ? tokenId : '' },
+                            threeDSecure: transaction === null || transaction === void 0 ? void 0 : transaction.authentication,
+                            hashstring: operator.hashstring,
+                            redirect: redirect,
+                            metadata: transaction === null || transaction === void 0 ? void 0 : transaction.metadata,
+                            post: post,
+                            payment_agreement: transaction === null || transaction === void 0 ? void 0 : transaction.paymentAgreement,
+                            destinations: transaction === null || transaction === void 0 ? void 0 : transaction.destinations,
+                            reference: {
+                                order: order === null || order === void 0 ? void 0 : order.reference,
+                                transaction: transaction === null || transaction === void 0 ? void 0 : transaction.reference
+                            }
+                        };
+                        if (!(scope === Scope.AUTHORIZE)) return [3, 8];
+                        return [4, appService.createAuthorize(transactionRequest)];
+                    case 7:
+                        _d = _w.sent();
+                        return [3, 10];
+                    case 8: return [4, appService.createCharge(transactionRequest)];
+                    case 9:
+                        _d = _w.sent();
+                        _w.label = 10;
+                    case 10:
+                        transactionResponse = _d;
+                        successState = scope === Scope.AUTHORIZE ? CHARGE_CODE.AUTHORIZED : CHARGE_CODE.SUCCESS;
+                        if ((transactionResponse === null || transactionResponse === void 0 ? void 0 : transactionResponse.response.code) === successState) {
+                            setSuccess === null || setSuccess === void 0 ? void 0 : setSuccess(true);
+                        }
+                        else {
+                            setError === null || setError === void 0 ? void 0 : setError(true);
+                        }
+                        onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(transactionResponse);
+                        return [3, 12];
+                    case 11:
+                        console.error("We only support: ".concat(Object.values(Scope).join(', '), " for now"));
+                        onError === null || onError === void 0 ? void 0 : onError({ message: "We only support: ".concat(Object.values(Scope).join(', '), " for now"), code: '000' });
+                        return [3, 12];
+                    case 12: return [3, 15];
+                    case 13:
+                        e_1 = _w.sent();
+                        if (!onError)
+                            return [2];
+                        if (e_1.errors) {
+                            onError(e_1.errors);
+                            return [2];
+                        }
+                        if ((_v = e_1.response) === null || _v === void 0 ? void 0 : _v.data.errors) {
+                            onError(e_1.response.data.errors);
+                            return [2];
+                        }
+                        if (e_1.message) {
+                            onError([{ message: e_1.message, code: '400' }]);
+                            return [2];
+                        }
+                        onError(e_1);
+                        return [3, 15];
+                    case 14:
+                        setLoading === null || setLoading === void 0 ? void 0 : setLoading(false);
+                        return [7];
+                    case 15: return [2];
+                }
+            });
+        });
+    }, [onError, onSuccess, scope, profileData, order, customer, transaction, operator, redirect, post]);
+    React.useEffect(function () {
+        if (!isIframeIntegration)
+            return;
+        window.addEventListener('message', onMessageReceived);
+        return function () { return window.removeEventListener('message', onMessageReceived); };
+    }, [isIframeIntegration, onMessageReceived]);
+};

package/build/index.d.ts

@@ -1,6 +1,4 @@
-import { ApplePayGetFromMerchantEvents } from './hooks/useApplePayFromMerchantSide';
-import { ApplePayButtonProps, ApplePayButton } from './features/ApplePayButton';
-import { ApplePayPostFromMerchantEvents, useApplePayFromMerchantSide } from './hooks/useApplePayFromMerchantSide';
-import { ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities } from './constants';
-export type { ApplePayButtonProps };
-export { ApplePayButton, ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities, ApplePayPostFromMerchantEvents, useApplePayFromMerchantSide, ApplePayGetFromMerchantEvents };
+import { ApplePayButtonProps, ApplePayButton, ApplePayRequestData } from './features/ApplePayButton';
+import { ThemeMode, Scope, SupportedNetworks, Locale, ButtonType, Edges, MerchantCapabilities } from './@types/enums';
+export type { ApplePayButtonProps, ApplePayRequestData };
+export { ApplePayButton, ThemeMode, Scope, SupportedNetworks, Locale, ButtonType, Edges, MerchantCapabilities };

package/build/index.js

@@ -1,19 +1,13 @@
-import { ApplePayGetFromMerchantEvents } from './hooks/useApplePayFromMerchantSide';
 import { ApplePayButton, renderApplePayButton } from './features/ApplePayButton';
-import { ApplePayPostFromMerchantEvents, useApplePayFromMerchantSide } from './hooks/useApplePayFromMerchantSide';
-import { ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities } from './constants';
-export { ApplePayButton, ThemeMode, Scope, SupportedNetworks, Environment, Locale, ButtonType, Edges, MerchantCapabilities, ApplePayPostFromMerchantEvents, useApplePayFromMerchantSide, ApplePayGetFromMerchantEvents };
+import { ThemeMode, Scope, SupportedNetworks, Locale, ButtonType, Edges, MerchantCapabilities } from './@types/enums';
+export { ApplePayButton, ThemeMode, Scope, SupportedNetworks, Locale, ButtonType, Edges, MerchantCapabilities };
 window['TapSDKs'] = {
     renderApplePayButton: renderApplePayButton,
     Scope: Scope,
     SupportedNetworks: SupportedNetworks,
-    Environment: Environment,
     Locale: Locale,
     ButtonType: ButtonType,
     ThemeMode: ThemeMode,
     Edges: Edges,
-    MerchantCapabilities: MerchantCapabilities,
-    ApplePayPostFromMerchantEvents: ApplePayPostFromMerchantEvents,
-    useApplePayFromMerchantSide: useApplePayFromMerchantSide,
-    ApplePayGetFromMerchantEvents: ApplePayGetFromMerchantEvents
+    MerchantCapabilities: MerchantCapabilities
 };

package/build/utils/config.d.ts

@@ -1,13 +1,14 @@
-import { Acceptance, ApplePayButtonProps, ApplePayRequestData, PaymentMethod } from '../@types';
-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, merchantCapabilities, countryCode, name }: Pick<ApplePayButtonProps, "transaction" | "customer"> & {
-    supportedNetworks: Acceptance['supportedBrands'];
+import { Acceptance, ApplePayButtonProps, ApplePayRequestData, MetaData, PaymentMethod } from '../@types';
+export declare const validateSupportedNetworks: (supportedNetworksOptions: Acceptance['supportedSchemes'], merchantSupportedNetworks?: Acceptance['supportedSchemes']) => Acceptance['supportedSchemes'];
+export declare const getApplePayPaymentMethod: (paymentMethods: Array<PaymentMethod>) => PaymentMethod;
+export declare const getApplePayRequest: ({ order, customer, supportedNetworks, merchantCapabilities, countryCode, name }: Pick<ApplePayButtonProps, "order" | "customer"> & {
+    supportedNetworks: Acceptance['supportedSchemes'];
     merchantCapabilities: ApplePayRequestData['merchantCapabilities'];
     countryCode: string;
     name: string;
 }) => ApplePayRequestData;
-export declare const getApplePayPaymentMethod: (paymentMethods: Array<PaymentMethod>) => PaymentMethod;
-export declare const rsaSetup: (key: string) => (string: string) => string;
-export declare function generateApplicationHeader(obj: Record<string, string | any>): string;
+export declare const prepareApplePayRequest: ({ payment_options, merchant, order, customer, acceptance }: Pick<MetaData, 'merchant' | 'payment_options'> & Pick<ApplePayButtonProps, 'order' | 'customer' | 'acceptance'>) => {
+    applePaySessionRequest: ApplePayRequestData;
+    paymentMethod: PaymentMethod;
+};
+export declare const shallRenderApplePay: () => boolean;

package/build/utils/config.js

@@ -1,34 +1,36 @@
-import { JSEncrypt } from 'jsencrypt';
-export var validateSupportedNetworks = function (supportedNetworksConfig, supportedNetworks) {
+import { getMerchantCapabilities } from './defaultValues';
+export var validateSupportedNetworks = function (supportedNetworksOptions, merchantSupportedNetworks) {
     var toLowerCase = function (item) { return item.toLowerCase(); };
-    if (!supportedNetworks)
-        return supportedNetworksConfig.map(toLowerCase);
-    if (supportedNetworks.length === 0)
-        return supportedNetworksConfig.map(toLowerCase);
-    if (supportedNetworks.length > supportedNetworksConfig.length) {
-        throw new Error("The supported networks list is not valid");
-    }
-    supportedNetworks.forEach(function (network) {
-        var isSupported = supportedNetworksConfig.some(function (item) { return item.toLowerCase() === network.toLowerCase(); });
-        if (!isSupported) {
-            throw new Error("The supported network ".concat(network, " is not supported"));
-        }
+    if (!supportedNetworksOptions)
+        throw new Error("There is no supported networks available in your acceptance object");
+    if (!merchantSupportedNetworks)
+        return supportedNetworksOptions.map(toLowerCase);
+    if (merchantSupportedNetworks.length === 0)
+        return supportedNetworksOptions.map(toLowerCase);
+    var supportedNetworks = supportedNetworksOptions.filter(function (item) {
+        return merchantSupportedNetworks.find(function (network) { return network.toLowerCase() === item.toLowerCase(); });
     });
-    return supportedNetworks;
+    if (supportedNetworks.length === 0) {
+        throw new Error("It seems that there is no supported networks available in based on your acceptance object");
+    }
+    return supportedNetworks.map(toLowerCase);
 };
-export var validateCurrency = function (currency, currencies) {
-    var isSupported = currencies.some(function (item) { return item.toLowerCase() === currency.toLowerCase(); });
-    if (!isSupported) {
-        throw new Error("The currency \"".concat(currency, "\" is not supported, you have to use one of these currencies: ").concat(currencies));
+export var getApplePayPaymentMethod = function (paymentMethods) {
+    var paymentMethod = paymentMethods.find(function (_a) {
+        var name = _a.name, payment_type = _a.payment_type;
+        return [name, payment_type].some(function (item) { return item.toLowerCase() === 'apple_pay'; });
+    });
+    if (!paymentMethod) {
+        throw new Error('apple_pay is not configured in your payment options');
     }
-    return currency;
+    return paymentMethod;
 };
 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, merchantCapabilities = _a.merchantCapabilities, countryCode = _a.countryCode, name = _a.name;
+    var order = _a.order, customer = _a.customer, supportedNetworks = _a.supportedNetworks, merchantCapabilities = _a.merchantCapabilities, countryCode = _a.countryCode, name = _a.name;
     return {
         countryCode: countryCode,
-        currencyCode: transaction.currency,
+        currencyCode: order.currency,
         merchantCapabilities: merchantCapabilities,
         supportedNetworks: supportedNetworks,
         billingContact: customer && {
@@ -38,35 +40,26 @@ export var getApplePayRequest = function (_a) {
             familyName: ((_j = customer.name) === null || _j === void 0 ? void 0 : _j.length) ? (_k = customer.name[0]) === null || _k === void 0 ? void 0 : _k.last : ''
         },
         total: {
-            amount: Number(transaction.amount),
+            amount: Number(Number(order.amount).toFixed(2)),
             label: name
         }
     };
 };
-export var getApplePayPaymentMethod = function (paymentMethods) {
-    var paymentMethod = paymentMethods.find(function (_a) {
-        var name = _a.name, payment_type = _a.payment_type;
-        return [name, payment_type].some(function (item) { return item.toLowerCase() === 'apple_pay'; });
+export var prepareApplePayRequest = function (_a) {
+    var payment_options = _a.payment_options, merchant = _a.merchant, order = _a.order, customer = _a.customer, acceptance = _a.acceptance;
+    var paymentMethod = getApplePayPaymentMethod(payment_options.payment_methods || []);
+    var supportedNetworks = validateSupportedNetworks(paymentMethod.supported_card_brands, acceptance === null || acceptance === void 0 ? void 0 : acceptance.supportedSchemes);
+    var request = getApplePayRequest({
+        countryCode: merchant.country_code,
+        order: order,
+        customer: customer,
+        supportedNetworks: supportedNetworks,
+        merchantCapabilities: getMerchantCapabilities(acceptance === null || acceptance === void 0 ? void 0 : acceptance.supportedFundSource),
+        name: merchant.name
     });
-    if (!paymentMethod) {
-        throw new Error('Apple Pay is not configured in your payment options');
-    }
-    return paymentMethod;
+    return { applePaySessionRequest: request, paymentMethod: paymentMethod };
 };
-export var rsaSetup = function (key) {
-    var rsa = new JSEncrypt();
-    rsa.setPublicKey(key);
-    return function (string) {
-        if (typeof string !== 'string')
-            throw new Error('string should be from type string');
-        var encrypted = rsa.encrypt(string);
-        if (!encrypted)
-            throw new Error('encryption data reached max allowed length');
-        return encrypted;
-    };
+export var shallRenderApplePay = function () {
+    var https = window.location.protocol === 'https:';
+    return https;
 };
-export function generateApplicationHeader(obj) {
-    return Object.keys(obj)
-        .map(function (key) { return "".concat(key, "=").concat(obj[key]); })
-        .join('|');
-}

package/build/utils/defaultValues.d.ts

@@ -1,30 +1,2 @@
-import { ApplePayButtonProps } from '../@types';
-export declare const getDefaultValues: (mainObject: ApplePayButtonProps) => {
-    interface: {
-        locale?: "en" | "ar" | "fr" | undefined;
-        theme?: "dark" | "light" | undefined;
-        edges?: "straight" | "curved" | undefined;
-        type?: "book" | "buy" | "check-out" | "pay" | "plain" | "subscribe" | undefined;
-    };
-    scope?: "AppleToken" | "TapToken" | undefined;
-    publicKey: string;
-    environment: "production" | "sandbox" | "beta" | "development" | "staging";
-    merchant: {
-        id: string;
-        domain: string;
-    };
-    customer?: import("../@types").Customer | undefined;
-    acceptance: import("../@types").Acceptance;
-    transaction: {
-        amount: string;
-        currency: string;
-    };
-    onCancel?: (() => void) | undefined;
-    onError?: ((error: any) => void) | undefined;
-    onSuccess?: ((data: Record<string, any>) => Promise<void>) | undefined;
-    onClick?: (() => void) | undefined;
-    onReady?: (() => void) | undefined;
-    metaData?: import("../@types").MetaData | undefined;
-    debug?: boolean | undefined;
-};
-export declare const getMerchantCapaplities: (supportedCards?: Array<string>) => ("supports3DS" | "supportsCredit" | "supportsDebit")[];
+import { MerchantCapabilities } from '../@types/enums';
+export declare const getMerchantCapabilities: (supportedCards?: Array<string>) => MerchantCapabilities[];

package/build/utils/defaultValues.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 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)) {
@@ -18,31 +7,21 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     }
     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;
-    var defaultInterface = {
-        locale: userLang,
-        theme: userThemeMode,
-        type: ButtonType.PLAIN,
-        edges: Edges.CURVED
-    };
-    return __assign(__assign({}, mainObject), { interface: __assign(__assign({}, defaultInterface), mainObject.interface) });
-};
-export var getMerchantCapaplities = function (supportedCards) {
-    var merchantCapaplities = [MerchantCapabilities.Supports3DS];
+import { MerchantCapabilities } from '../@types/enums';
+export var getMerchantCapabilities = function (supportedCards) {
+    var merchantCapabilities = [MerchantCapabilities.Supports3DS];
     if (!supportedCards) {
-        merchantCapaplities = __spreadArray(__spreadArray([], merchantCapaplities, true), [
+        merchantCapabilities = __spreadArray(__spreadArray([], merchantCapabilities, true), [
             MerchantCapabilities.SupportsCredit,
             MerchantCapabilities.SupportsDebit
         ], false);
+        return merchantCapabilities;
     }
-    else if (supportedCards.includes('CREDIT')) {
-        merchantCapaplities.push(MerchantCapabilities.SupportsCredit);
+    if (supportedCards.includes('CREDIT')) {
+        merchantCapabilities.push(MerchantCapabilities.SupportsCredit);
     }
-    else if (supportedCards.includes('DEBIT')) {
-        merchantCapaplities.push(MerchantCapabilities.SupportsDebit);
+    if (supportedCards.includes('DEBIT')) {
+        merchantCapabilities.push(MerchantCapabilities.SupportsDebit);
     }
-    return merchantCapaplities;
+    return merchantCapabilities;
 };

package/build/utils/index.d.ts

@@ -1 +1,4 @@
 export * from './html';
+export * from './theme';
+export * from './config';
+export * from './defaultValues';

package/build/utils/index.js

@@ -1 +1,4 @@
 export * from './html';
+export * from './theme';
+export * from './config';
+export * from './defaultValues';

package/build/utils/theme.d.ts

@@ -0,0 +1,12 @@
+import { TapThemeResponse } from '../@types';
+import { ColorStyle, FullThemeMode, Locale, ThemeMode } from '../@types/enums';
+import { ApplePayButtonProps } from '..';
+export declare const mappingInterface: (interfaceParam?: ApplePayButtonProps['interface']) => ApplePayButtonProps['interface'];
+export declare const getDefaultThemeMode: (themeMode?: ThemeMode) => ThemeMode;
+export declare const getDefaultLocale: (locale?: Locale) => Locale;
+export declare const getFullThemeMode: (themeMode?: ThemeMode, colorStyle?: ColorStyle) => FullThemeMode;
+export declare const appendColors: (colors: Record<string, string>) => void;
+export declare const getTapThemeValue: ({ tapTheme, value }: {
+    tapTheme: TapThemeResponse | null;
+    value?: string | undefined;
+}) => string;

package/build/utils/theme.js

@@ -0,0 +1,61 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { ColorStyle, Edges, FullThemeMode, Locale, ThemeMode } from '../@types/enums';
+export var mappingInterface = function (interfaceParam) {
+    return __assign(__assign({ edges: Edges.CURVED, colorStyle: ColorStyle.COLORED, loader: true }, interfaceParam), { locale: getDefaultLocale(interfaceParam === null || interfaceParam === void 0 ? void 0 : interfaceParam.locale), theme: getDefaultThemeMode(interfaceParam === null || interfaceParam === void 0 ? void 0 : interfaceParam.theme) });
+};
+export var getDefaultThemeMode = function (themeMode) {
+    return themeMode === ThemeMode.DYNAMIC || themeMode === undefined
+        ? window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? ThemeMode.DARK
+            : ThemeMode.LIGHT
+        : themeMode;
+};
+export var getDefaultLocale = function (locale) {
+    var _a;
+    return locale === Locale.DYNAMIC || locale === undefined
+        ? (_a = window.navigator.language.split('-')) === null || _a === void 0 ? void 0 : _a[0]
+        : locale;
+};
+export var getFullThemeMode = function (themeMode, colorStyle) {
+    var themeModeValue = getDefaultThemeMode(themeMode);
+    if (themeModeValue === ThemeMode.DARK) {
+        return colorStyle === ColorStyle.MONOCHROME ? FullThemeMode.DARK : FullThemeMode.DARK_COLORED;
+    }
+    else {
+        return colorStyle === ColorStyle.MONOCHROME ? FullThemeMode.LIGHT_MONO : FullThemeMode.LIGHT;
+    }
+};
+export var appendColors = function (colors) {
+    try {
+        var root_1 = document.documentElement;
+        Object.entries(colors).forEach(function (_a) {
+            var key = _a[0], value = _a[1];
+            root_1.style.setProperty("--".concat(key), value);
+        });
+    }
+    catch (e) {
+        throw e;
+    }
+};
+export var getTapThemeValue = function (_a) {
+    var tapTheme = _a.tapTheme, value = _a.value;
+    if (!tapTheme)
+        return '';
+    if (!value)
+        return '';
+    if (value[0] === '#')
+        return value;
+    var colorsObject = tapTheme === null || tapTheme === void 0 ? void 0 : tapTheme.GlobalValues.Colors;
+    var valueFromGlobalColors = colorsObject === null || colorsObject === void 0 ? void 0 : colorsObject[value];
+    return valueFromGlobalColors !== null && valueFromGlobalColors !== void 0 ? valueFromGlobalColors : '';
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/apple-pay-button",
-	"version": "0.0.37-development",
+	"version": "0.0.37-test",
 	"description": "Apple Pay Button React Component",
 	"main": "build/index.js",
 	"module": "build/index.js",
@@ -10,17 +10,17 @@
 		"README.md"
 	],
 	"scripts": {
+		"start": "cross-env NODE_ENV=development webpack serve",
 		"prepare": "npx husky install",
 		"prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\" *.json *.js",
 		"prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"  *.json *.js",
 		"lint": "eslint src --color --ext .js,.jsx,.ts,.tsx,.json",
 		"lint:fix": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
-		"start": "cross-env NODE_ENV=development webpack serve",
 		"build": "cross-env NODE_ENV=production webpack",
-		"copy:files": "copyfiles -u 1 src/**/*.css build/",
+		"copy:files": "copyfiles -u 1 src/**/*.gif build/ && 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 development"
+		"push": "npm publish --access public --tag test"
 	},
 	"keywords": [],
 	"author": {
@@ -28,11 +28,23 @@
 		"email": "a.elsharkawy@tap.company"
 	},
 	"license": "ISC",
+	"dependencies": {
+		"@tap-payments/acceptance-sdk": "^0.0.46",
+		"@tap-payments/browser-info": "^1.0.2",
+		"@tap-payments/web-error-handing": "^1.0.1",
+		"axios": "^1.2.2",
+		"framer-motion": "^10.16.5",
+		"jsencrypt": "^3.3.2",
+		"lottie-react": "^2.4.0",
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0"
+	},
 	"devDependencies": {
 		"@babel/core": "^7.18.6",
 		"@babel/preset-env": "^7.18.6",
 		"@babel/preset-react": "^7.18.6",
 		"@babel/preset-typescript": "^7.18.6",
+		"@types/applepayjs": "^14.0.3",
 		"@types/crypto-js": "^4.1.1",
 		"@types/react": "^18.0.15",
 		"@types/react-dom": "^18.0.6",
@@ -71,13 +83,6 @@
 		"webpack-dev-server": "^4.9.3",
 		"webpack-merge": "^5.8.0"
 	},
-	"dependencies": {
-		"@tap-payments/browser-info": "^1.0.2",
-		"axios": "^1.2.2",
-		"jsencrypt": "^3.3.2",
-		"react": ">=17.0.2",
-		"react-dom": ">=17.0.2"
-	},
 	"peerDependencies": {
 		"react": ">=17.0.2",
 		"react-dom": ">=17.0.2"

package/build/api/app.service.d.ts

@@ -1,23 +0,0 @@
-import { MerchantResponse, ApplePayButtonProps, CheckoutProfileRequest } from '../@types';
-import BaseService from './base';
-declare class APPService extends BaseService {
-    private baseUrl;
-    private env;
-    constructor();
-    setEnv(env: ApplePayButtonProps['environment']): void;
-    setBaseUrl(): void;
-    getHeaderPublicKey(): "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC8AX++RtxPZFtns4XzXFlDIxPBh0umN4qRXZaKDIlb6a3MknaB7psJWmf2l+e4Cfh9b5tey/+rZqpQ065eXTZfGCAuBLt+fYLQBhLfjRpk8S6hlIzc1Kdjg65uqzMwcTd0p7I4KLwHk1I0oXzuEu53fU1LSZhWp4Mnd6wjVgXAsQIDAQAB\n-----END PUBLIC KEY-----" | "" | "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----" | "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCi9W5jyTvA4Iwv3V5sfNQ7VdSz\n7WqwBbnWFbIUL/GjaaE93mvDv4zbgRSznHaHQPH6pxrMhMh0tV58njkvjHvQ/tvg\npwM8SemNPKEEAPl69tnMvCrJRPh2dWL3OHY8yCW4c38Hyx4fy56Zd5cdoVWfCReu\njCsvASLGz+cfRrj2swIDAQAB\n-----END PUBLIC KEY-----";
-    setBrowserHeaders({ locale, pk, domain }: {
-        locale: string;
-        pk: string;
-        domain: string;
-    }): Promise<void>;
-    checkoutProfile(request: CheckoutProfileRequest): Promise<{
-        merchant: any;
-        payment_options: any;
-    }>;
-    appleSession(merchant: Pick<MerchantResponse, 'name' | 'id'>, validationURL: string, merchantRegisteredDomain: string): Promise<any>;
-    tapTokenization(applePaymentData: Record<string, string>): Promise<any>;
-}
-declare const appService: APPService;
-export default appService;

package/build/api/base.d.ts

@@ -1,9 +0,0 @@
-import { AxiosInstance, AxiosRequestConfig } from 'axios';
-export default class BaseService {
-    httpClient: AxiosInstance;
-    constructor(httpClient: AxiosInstance);
-    get(url: string, config?: AxiosRequestConfig<any>): Promise<import("axios").AxiosResponse<any, any>>;
-    post(url: string, data?: any, config?: AxiosRequestConfig<any>): Promise<import("axios").AxiosResponse<any, any>>;
-    put(url: string, data?: any, config?: AxiosRequestConfig<any>): Promise<import("axios").AxiosResponse<any, any>>;
-    delete(url: string, config?: AxiosRequestConfig<any>): Promise<import("axios").AxiosResponse<any, any>>;
-}