@tap-payments/apple-pay-button 0.0.55-development → 0.0.57-development

package/build/components/InitialLoader/InitialLoader.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Lottie from 'lottie-react';
+import DarkLoader from '../../assets/lottie/Dark_Mode_Loader.json';
+import LightLoader from '../../assets/lottie/Light_Mode_Loader.json';
+import { Edges, ThemeMode } from '../../@types/enums';
+import { styled } from '@mui/material/styles';
+var StyledLottie = styled(Lottie, {
+    shouldForwardProp: function (prop) { return !['edges'].includes(prop); }
+})(function (_a) {
+    var edges = _a.edges;
+    return ({
+        border: 'none',
+        width: '100%',
+        borderRadius: edges === Edges.STRAIGHT ? '0' : '10px',
+        overflow: 'hidden',
+        height: '48px',
+        maxWidth: '360px',
+        minWidth: '170px',
+        '& svg': {
+            width: '100%'
+        }
+    });
+});
+export default function InitialLoader(_a) {
+    var open = _a.open, themeMode = _a.themeMode, edges = _a.edges;
+    if (!open)
+        return null;
+    return (_jsx(StyledLottie, { animationData: themeMode === ThemeMode.DARK ? DarkLoader : LightLoader, edges: edges, loop: true }));
+}

package/build/components/InitialLoader/index.d.ts

@@ -0,0 +1,2 @@
+import InitialLoader from './InitialLoader';
+export default InitialLoader;

package/build/components/InitialLoader/index.js

@@ -0,0 +1,2 @@
+import InitialLoader from './InitialLoader';
+export default InitialLoader;

package/build/components/Loader/Loader.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+export interface LoaderProps {
+    outerColor?: string;
+    innerColor?: string;
+    duration?: number;
+    toggleAnimation?: boolean;
+    size?: number | string;
+    style?: React.CSSProperties;
+    className?: string;
+}
+declare function Loader({ duration, innerColor, outerColor, size, style, toggleAnimation }: LoaderProps): JSX.Element;
+declare namespace Loader {
+    var defaultProps: {
+        outerColor: string;
+        innerColor: string;
+        duration: number;
+        toggleAnimation: boolean;
+        size: number;
+        style: null;
+        className: string;
+    };
+}
+declare const _default: React.MemoExoticComponent<typeof Loader>;
+export default _default;

package/build/components/Loader/Loader.js

@@ -0,0 +1,48 @@
+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 { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { styled } from '@mui/material/styles';
+var RootStyled = styled('div')(function (_a) {
+    var size = _a.size;
+    return (__assign({ '&:before': {
+            content: '""',
+            display: 'block',
+            paddingTop: '100%'
+        }, position: 'relative', margin: '0px auto', width: '30px', height: '30px' }, (size && {
+        width: size,
+        height: size
+    })));
+});
+var LoaderBoxStyled = styled('svg')(function () { return ({
+    height: '100%',
+    transformOrigin: 'center center',
+    width: '100%',
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    margin: 'auto'
+}); });
+function Loader(_a) {
+    var duration = _a.duration, innerColor = _a.innerColor, outerColor = _a.outerColor, size = _a.size, style = _a.style, toggleAnimation = _a.toggleAnimation;
+    return (_jsx(RootStyled, __assign({ className: 'loader', style: style, size: size }, { children: _jsxs(LoaderBoxStyled, __assign({ className: 'circular-loader', viewBox: '25 25 50 50' }, { children: [_jsx("circle", __assign({ cx: '50', cy: '50', r: '20', fill: 'none', stroke: outerColor || 'black', strokeWidth: '3.6px', strokeLinecap: 'round', strokeDasharray: ' 125, 124' }, { children: toggleAnimation && (_jsxs(_Fragment, { children: [_jsx("animateTransform", { attributeName: 'transform', type: 'rotate', from: '0 50 50', to: '360 50 50', dur: "".concat(duration || 0 / 3, "s"), repeatCount: 'indefinite' }), _jsx("animate", { attributeName: 'stroke-dashoffset', values: '0; 122; 122; 0; 0', keyTimes: '0; 0.45; 0.55; 0.9; 1', dur: "".concat(duration, "s"), repeatCount: 'indefinite' })] })) })), _jsx("circle", __assign({ cx: '50', cy: '50', r: '14', fill: 'none', stroke: innerColor || 'black', strokeWidth: ' 3.6px', strokeLinecap: 'round', strokeDasharray: ' 88, 124' }, { children: toggleAnimation && (_jsxs(_Fragment, { children: [_jsx("animateTransform", { attributeName: 'transform', type: 'rotate', from: '360 50 50', to: '0 50 50', dur: "".concat(duration || 0 / 3, "s"), repeatCount: 'indefinite' }), _jsx("animate", { attributeName: 'stroke-dashoffset', values: '0; -85; -85; 0; 0', keyTimes: '0; 0.45; 0.55; 0.9; 1', dur: "".concat(duration, "s"), repeatCount: 'indefinite' })] })) }))] })) })));
+}
+Loader.defaultProps = {
+    outerColor: '#423e3c',
+    innerColor: '#423e3c',
+    duration: 5,
+    toggleAnimation: false,
+    size: 50,
+    style: null,
+    className: ''
+};
+export default React.memo(Loader);

package/build/components/Loader/index.d.ts

@@ -0,0 +1,2 @@
+import Loader from './Loader';
+export default Loader;

package/build/components/Loader/index.js

@@ -0,0 +1,2 @@
+import Loader from './Loader';
+export default Loader;

package/build/components/PayButton/PayButton.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Edges, ThemeMode } from '../../@types/enums';
+export interface PayButtonProps {
+    theme: ThemeMode;
+    isRounded?: boolean;
+    isFailed?: boolean;
+    isSuccess?: boolean;
+    bgColor?: string;
+    gradientColor?: string;
+    edges?: Edges;
+    titleAsset?: string;
+    onClick: () => void;
+}
+declare const _default: React.NamedExoticComponent<PayButtonProps>;
+export default _default;

package/build/components/PayButton/PayButton.js

@@ -0,0 +1,40 @@
+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 { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import Loader from '../Loader';
+import ActionButton from '../ActionButton';
+import WhiteSuccessGif from '../../assets/gif/success-white.gif';
+import WhiteErrorGif from '../../assets/gif/error-white.gif';
+import BlackSuccessGif from '../../assets/gif/success-black.gif';
+import BlackErrorGif from '../../assets/gif/error-black.gif';
+import { StyledContainerLoader } from './style';
+import { Edges, ThemeMode } from '../../@types/enums';
+var PayButton = function (_a) {
+    var theme = _a.theme, isRounded = _a.isRounded, isFailed = _a.isFailed, isSuccess = _a.isSuccess, bgColor = _a.bgColor, gradientColor = _a.gradientColor, edges = _a.edges, titleAsset = _a.titleAsset, onClick = _a.onClick;
+    var renderButtonLabel = function () {
+        if (isFailed) {
+            return _jsx("img", { src: theme === ThemeMode.DARK ? BlackErrorGif : WhiteErrorGif, alt: 'error', width: 30, height: 30 });
+        }
+        if (isSuccess) {
+            return (_jsx("img", { src: theme === ThemeMode.DARK ? BlackSuccessGif : WhiteSuccessGif, alt: 'success', width: 30, height: 30 }));
+        }
+        if (isRounded) {
+            return (_jsx(Loader, { toggleAnimation: true, size: 28, outerColor: theme === ThemeMode.DARK ? 'black' : 'white', innerColor: theme === ThemeMode.DARK ? 'black' : 'white' }));
+        }
+        return _jsx("img", { src: titleAsset, alt: 'logo' });
+    };
+    return (_jsx(StyledContainerLoader, __assign({ "data-testid": 'PayButton', "data-src": 'apple-pay-button-element', "data-is-rounded": isRounded, "data-is-error": isFailed, "data-is-success": isSuccess, edges: edges }, { children: _jsx(ActionButton, __assign({ "data-testid": 'PayButton-ActionButton', "data-src": 'apple-pay-button-element', "data-is-error": isFailed, "data-is-success": isSuccess, gradientColor: gradientColor, bgColor: bgColor, rounded: isRounded, onClick: onClick, style: {
+                borderRadius: edges === Edges.STRAIGHT ? '0px' : '30px'
+            } }, { children: renderButtonLabel() })) })));
+};
+export default memo(PayButton);

package/build/components/PayButton/index.d.ts

@@ -0,0 +1,2 @@
+import PayButton from './PayButton';
+export default PayButton;

package/build/components/PayButton/index.js

@@ -0,0 +1,2 @@
+import PayButton from './PayButton';
+export default PayButton;

package/build/components/PayButton/style.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { Edges } from '../../@types';
+export declare const StyledContainerLoader: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+    edges?: Edges | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const DisabledButton: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+    edges?: Edges | undefined;
+    backgroundColor?: string | undefined;
+    color?: string | undefined;
+    font?: string | undefined;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;

package/build/components/PayButton/style.js

@@ -0,0 +1,41 @@
+import { styled } from '@mui/material/styles';
+import { Edges } from '../../@types';
+export var StyledContainerLoader = styled('section', {
+    shouldForwardProp: function (prop) { return prop !== 'edges'; }
+})(function (_a) {
+    var edges = _a.edges;
+    return ({
+        width: '100%',
+        height: '48px',
+        maxWidth: '360px',
+        justifyContent: 'center',
+        display: 'flex',
+        background: 'transparent',
+        borderRadius: edges === Edges.STRAIGHT ? '0px' : '30px',
+        padding: 0,
+        margin: 0,
+        overflow: 'hidden'
+    });
+});
+export var DisabledButton = styled('button', {
+    shouldForwardProp: function (prop) { return !['edges', 'backgroundColor', 'color', 'font'].includes(prop); }
+})(function (_a) {
+    var edges = _a.edges, backgroundColor = _a.backgroundColor, color = _a.color, font = _a.font;
+    return ({
+        border: 'none',
+        width: 'calc(100% - 16px)',
+        borderRadius: edges === Edges.STRAIGHT ? '0px' : '30px',
+        overflow: 'hidden',
+        height: '48px',
+        color: color,
+        backgroundColor: backgroundColor,
+        maxWidth: '360px',
+        minWidth: '170px',
+        pointerEvents: 'none',
+        cursor: 'not-allowed',
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        font: font
+    });
+});

package/build/constants/index.d.ts

@@ -1,72 +1,8 @@
-export declare const Scope: {
-    readonly CHARGE: "charge";
-    readonly AUTHORIZE: "authorize";
-    readonly TAP_TOKEN: "taptoken";
-    readonly APPLE_PAY_TOKEN: "applepaytoken";
-};
-export declare const ButtonStyle: {
-    readonly Black: "black";
-    readonly White: "white";
-    readonly WhiteOutline: "white-outline";
-};
-export declare const Locale: {
-    readonly EN: "en";
-    readonly AR: "ar";
-    readonly DYNAMIC: "dynamic";
-};
-export declare const ColorStyle: {
-    readonly COLORED: "colored";
-    readonly MONOCHROME: "monochrome";
-};
-export declare const FullThemeMode: {
-    readonly DARK: "dark";
-    readonly LIGHT: "light";
-    readonly LIGHT_MONO: "light_mono";
-    readonly DARK_COLORED: "dark_colored";
-};
-export declare const ButtonType: {
-    readonly BOOK: "book";
-    readonly BUY: "buy";
-    readonly CHECK_OUT: "check-out";
-    readonly PAY: "pay";
-    readonly PLAIN: "plain";
-    readonly SUBSCRIBE: "subscribe";
-};
-export declare const ThemeMode: {
-    readonly DARK: "dark";
-    readonly LIGHT: "light";
-    readonly DYNAMIC: "dynamic";
-};
-export declare const Edges: {
-    readonly STRAIGHT: "straight";
-    readonly CURVED: "curved";
-};
-export declare const MerchantCapabilities: {
-    readonly Supports3DS: "supports3DS";
-    readonly SupportsCredit: "supportsCredit";
-    readonly SupportsDebit: "supportsDebit";
-};
-export declare const SupportedNetworks: {
-    readonly Amex: "amex";
-    readonly Mada: "mada";
-    readonly MasterCard: "masterCard";
-    readonly Visa: "visa";
-    readonly ChinaUnionPay: "chinaUnionPay";
-    readonly Discover: "discover";
-    readonly Electron: "electron";
-    readonly Jcb: "jcb";
-    readonly Maestro: "maestro";
-};
 export declare const ApplePayVersion = 5;
-export declare const Environment: {
-    readonly Production: "production";
-    readonly Sandbox: "sandbox";
-    readonly Beta: "beta";
-    readonly Development: "development";
-    readonly Staging: "staging";
-};
 export declare const RSA_DEV_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC8AX++RtxPZFtns4XzXFlDIxPBh0umN4qRXZaKDIlb6a3MknaB7psJWmf2l+e4Cfh9b5tey/+rZqpQ065eXTZfGCAuBLt+fYLQBhLfjRpk8S6hlIzc1Kdjg65uqzMwcTd0p7I4KLwHk1I0oXzuEu53fU1LSZhWp4Mnd6wjVgXAsQIDAQAB\n-----END PUBLIC KEY-----";
 export declare const RSA_SANDBOX_MW_PUBLIC_KEY = "";
 export declare const RSA_PRODUCTION_MW_PUBLIC_KEY = "";
 export declare const RSA_BETA_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
 export declare const RSA_STAGING_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCi9W5jyTvA4Iwv3V5sfNQ7VdSz\n7WqwBbnWFbIUL/GjaaE93mvDv4zbgRSznHaHQPH6pxrMhMh0tV58njkvjHvQ/tvg\npwM8SemNPKEEAPl69tnMvCrJRPh2dWL3OHY8yCW4c38Hyx4fy56Zd5cdoVWfCReu\njCsvASLGz+cfRrj2swIDAQAB\n-----END PUBLIC KEY-----";
+export declare const MW_BASE_DEV_URL = "https://mw-sdk.dev.tap.company/v2/checkout";
+export declare const MW_BASE_BETA_URL = "https://mw-sdk.beta.tap.company/v2/checkout";

package/build/constants/index.js

@@ -1,72 +1,8 @@
-export var Scope = {
-    CHARGE: 'charge',
-    AUTHORIZE: 'authorize',
-    TAP_TOKEN: 'taptoken',
-    APPLE_PAY_TOKEN: 'applepaytoken'
-};
-export var ButtonStyle = {
-    Black: 'black',
-    White: 'white',
-    WhiteOutline: 'white-outline'
-};
-export var Locale = {
-    EN: 'en',
-    AR: 'ar',
-    DYNAMIC: 'dynamic'
-};
-export var ColorStyle = {
-    COLORED: 'colored',
-    MONOCHROME: 'monochrome'
-};
-export var FullThemeMode = {
-    DARK: 'dark',
-    LIGHT: 'light',
-    LIGHT_MONO: 'light_mono',
-    DARK_COLORED: 'dark_colored'
-};
-export var ButtonType = {
-    BOOK: 'book',
-    BUY: 'buy',
-    CHECK_OUT: 'check-out',
-    PAY: 'pay',
-    PLAIN: 'plain',
-    SUBSCRIBE: 'subscribe'
-};
-export var ThemeMode = {
-    DARK: 'dark',
-    LIGHT: 'light',
-    DYNAMIC: 'dynamic'
-};
-export var Edges = {
-    STRAIGHT: 'straight',
-    CURVED: 'curved'
-};
-export var MerchantCapabilities = {
-    Supports3DS: 'supports3DS',
-    SupportsCredit: 'supportsCredit',
-    SupportsDebit: 'supportsDebit'
-};
-export var SupportedNetworks = {
-    Amex: 'amex',
-    Mada: 'mada',
-    MasterCard: 'masterCard',
-    Visa: 'visa',
-    ChinaUnionPay: 'chinaUnionPay',
-    Discover: 'discover',
-    Electron: 'electron',
-    Jcb: 'jcb',
-    Maestro: 'maestro'
-};
 export var ApplePayVersion = 5;
-export var Environment = {
-    Production: 'production',
-    Sandbox: 'sandbox',
-    Beta: 'beta',
-    Development: 'development',
-    Staging: 'staging'
-};
 export var RSA_DEV_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC8AX++RtxPZFtns4XzXFlDIxPBh0umN4qRXZaKDIlb6a3MknaB7psJWmf2l+e4Cfh9b5tey/+rZqpQ065eXTZfGCAuBLt+fYLQBhLfjRpk8S6hlIzc1Kdjg65uqzMwcTd0p7I4KLwHk1I0oXzuEu53fU1LSZhWp4Mnd6wjVgXAsQIDAQAB\n-----END PUBLIC KEY-----";
 export var RSA_SANDBOX_MW_PUBLIC_KEY = "";
 export var RSA_PRODUCTION_MW_PUBLIC_KEY = "";
 export var RSA_BETA_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hSRms7Ir1HmzdZxGXFYgmpi3\nez7VBFje0f8wwrxYS9oVoBtN4iAt0DOs3DbeuqtueI31wtpFVUMGg8W7R0SbtkZd\nGzszQNqt/wyqxpDC9q+97XdXwkWQFA72s76ud7eMXQlsWKsvgwhY+Ywzt0KlpNC3\nHj+N6UWFOYK98Xi+sQIDAQAB\n-----END PUBLIC KEY-----";
 export var RSA_STAGING_MW_PUBLIC_KEY = "-----BEGIN PUBLIC KEY-----\nMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCi9W5jyTvA4Iwv3V5sfNQ7VdSz\n7WqwBbnWFbIUL/GjaaE93mvDv4zbgRSznHaHQPH6pxrMhMh0tV58njkvjHvQ/tvg\npwM8SemNPKEEAPl69tnMvCrJRPh2dWL3OHY8yCW4c38Hyx4fy56Zd5cdoVWfCReu\njCsvASLGz+cfRrj2swIDAQAB\n-----END PUBLIC KEY-----";
+export var MW_BASE_DEV_URL = 'https://mw-sdk.dev.tap.company/v2/checkout';
+export var MW_BASE_BETA_URL = 'https://mw-sdk.beta.tap.company/v2/checkout';

package/build/features/ApplePayButton/ApplePayButton.js

@@ -9,36 +9,24 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import { createRoot } from 'react-dom/client';
 import { findOrCreateElementAndInject } from '../../utils';
 import { useApplePay } from '../../hooks/useApplePay';
-import { getDefaultValues } from '../../utils/defaultValues';
-import { ButtonStyle, Edges, ThemeMode } from '../../constants';
+import InitialLoader from '../../components/InitialLoader';
 import './ApplePayButton.css';
+import { StyledContainer } from './style';
+import PayButton from '../../components/PayButton';
 var ApplePay = React.memo(function (props) {
-    var mappedProps = getDefaultValues(props);
-    var _a = useApplePay(mappedProps), loading = _a.loading, onApplePayButtonClicked = _a.onApplePayButtonClicked, disabled = _a.disabled, applePayRequestData = _a.applePayRequestData, applePayRequestConfiguration = _a.applePayRequestConfiguration;
-    var isIframeIntegration = props.integration === 'iframe';
+    var _a, _b, _c;
+    var _d = useApplePay({ buttonProps: props }), onClick = _d.onClick, loading = _d.loading, onApplePayButtonClicked = _d.onApplePayButtonClicked, disabled = _d.disabled, applePayRequestData = _d.applePayRequestData, isIframeIntegration = _d.isIframeIntegration, applePayRequestConfiguration = _d.applePayRequestConfiguration, mappedProps = _d.mappedProps, theme = _d.theme, isRounded = _d.isRounded, success = _d.success, error = _d.error, backgroundColor = _d.backgroundColor, gradientColor = _d.gradientColor, titleAsset = _d.titleAsset;
     React.useEffect(function () {
         if (props.debug) {
             console.log('ApplePayButtonProps', props);
         }
     }, []);
-    return (_jsx("button", { className: 'button-applepay-tap', style: {
-            ApplePayButtonType: mappedProps.interface.type,
-            ApplePayButtonStyle: mappedProps.interface.theme === ThemeMode.DARK ? ButtonStyle.Black : ButtonStyle.White,
-            borderRadius: mappedProps.interface.edges === Edges.STRAIGHT ? '0' : '10px'
-        }, onClick: function () {
-            var _a, _b;
-            if (isIframeIntegration) {
-                (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, __assign(__assign({}, applePayRequestConfiguration), { applePayRequestData: applePayRequestData }));
-                return;
-            }
-            onApplePayButtonClicked();
-            (_b = props.onClick) === null || _b === void 0 ? void 0 : _b.call(props);
-        }, lang: mappedProps.interface.locale, disabled: loading || disabled }));
+    return (_jsx(StyledContainer, __assign({ "data-src": 'apple-pay-button-element', "data-testid": 'ApplePayButton-section' }, { children: loading ? (_jsx(InitialLoader, { open: true, themeMode: (_a = mappedProps.interface) === null || _a === void 0 ? void 0 : _a.theme, edges: (_b = mappedProps.interface) === null || _b === void 0 ? void 0 : _b.edges })) : (_jsx(_Fragment, { children: _jsx(PayButton, { "data-src": 'apple-pay-button-element', "data-testid": 'ApplePayButton', theme: theme, isRounded: isRounded, isSuccess: success, isFailed: error, bgColor: backgroundColor, gradientColor: gradientColor, titleAsset: titleAsset, edges: (_c = mappedProps.interface) === null || _c === void 0 ? void 0 : _c.edges, onClick: onClick }) })) })));
 });
 export function ApplePayButton(props) {
     return _jsx(ApplePay, __assign({}, props));

package/build/features/ApplePayButton/style.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const StyledContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;

package/build/features/ApplePayButton/style.js

@@ -0,0 +1,12 @@
+import { styled } from '@mui/material';
+export var StyledContainer = styled('section')(function () { return ({
+    width: '100%',
+    display: 'flex',
+    justifyContent: 'center',
+    alignItems: 'center',
+    flexDirection: 'column',
+    margin: '0 auto',
+    height: '48px',
+    maxWidth: '360px',
+    minWidth: '170px'
+}); });

package/build/hooks/useApplePay.d.ts

@@ -1,11 +1,91 @@
-import { ApplePayButtonProps, ApplePayDataToLunchSDKFromMerchantSide, ApplePayRequestData } from '../@types';
-declare type UseApplePayProps = Omit<ApplePayButtonProps, 'buttonStyle'>;
-interface UseApplePayReturnProps {
+import { Locale, Scope } from '../@types/enums';
+import { ApplePayButtonProps, ApplePayDataToLunchSDKFromMerchantSide, ApplePayRequestData, MetaData } from '../@types';
+interface UsaApplePayProps {
+    buttonProps: ApplePayButtonProps;
+}
+export declare const useApplePay: ({ buttonProps }: UsaApplePayProps) => {
+    onClick: () => void;
     loading: boolean;
+    isIframeIntegration: boolean;
     onApplePayButtonClicked: () => Promise<void>;
     disabled: boolean;
-    applePayRequestData?: ApplePayRequestData;
-    applePayRequestConfiguration?: Omit<ApplePayDataToLunchSDKFromMerchantSide, 'applePayRequestData'>;
-}
-export declare const useApplePay: ({ environment, interface: interfaceObj, merchant, customer, acceptance, scope, debug, onError, onSuccess, onCancel, onReady, metaData, headers, operator, order, onOrderCreated, integration, transaction, post, redirect }: UseApplePayProps) => UseApplePayReturnProps;
+    applePayRequestData: ApplePayRequestData | undefined;
+    applePayRequestConfiguration: Omit<ApplePayDataToLunchSDKFromMerchantSide, "applePayRequestData"> | undefined;
+    mappedProps: {
+        interface: {
+            locale?: Locale | undefined;
+            theme?: import("../@types").ThemeMode | undefined;
+            edges?: import("../@types").Edges | undefined;
+            type?: import("../@types").ButtonType | undefined;
+            colorStyle?: import("../@types").ColorStyle | undefined;
+            loader?: boolean | undefined;
+        };
+        operator: {
+            publicKey: string;
+            hashstring?: string | undefined;
+        };
+        merchant: {
+            id: string;
+        };
+        scope: Scope;
+        environment: import("../@types").Environment;
+        customer?: import("../@types").Customer | undefined;
+        acceptance?: import("../@types").Acceptance | undefined;
+        transaction?: {
+            authentication?: boolean | undefined;
+            authorize?: {
+                auto: {
+                    type: string;
+                    time: number;
+                };
+            } | undefined;
+            metadata?: Record<string, string> | undefined;
+            reference?: string | undefined;
+            paymentAgreement?: {
+                id: string;
+                contract?: {
+                    id: string;
+                } | undefined;
+            } | undefined;
+            destinations?: Record<string, any> | undefined;
+        } | undefined;
+        invoice?: {
+            id: string;
+        } | undefined;
+        order: {
+            amount: number;
+            currency: string;
+            id?: string | undefined;
+            description?: string | undefined;
+            metadata?: Record<string, string> | undefined;
+            reference?: string | undefined;
+        };
+        post?: {
+            url: string;
+        } | undefined;
+        redirect?: {
+            url: string;
+        } | undefined;
+        onOrderCreated?: ((orderId: string) => void) | undefined;
+        onCancel?: (() => void) | undefined;
+        onError?: ((error: any) => void) | undefined;
+        onSuccess?: ((data: Record<string, any>) => void) | undefined;
+        onClick?: ((data?: ApplePayDataToLunchSDKFromMerchantSide | undefined) => void) | undefined;
+        onReady?: (() => void) | undefined;
+        metaData?: MetaData | undefined;
+        debug?: boolean | undefined;
+        integration?: "sdk" | "iframe" | undefined;
+        headers?: {
+            mdn: string;
+            application: string;
+        } | undefined;
+    };
+    theme: import("../@types").ThemeMode;
+    isRounded: boolean;
+    success: boolean;
+    error: boolean;
+    backgroundColor: string | undefined;
+    gradientColor: string | undefined;
+    titleAsset: string | undefined;
+};
 export {};