@tagadapay/plugin-sdk 2.3.9 → 2.3.10

package/dist/react/components/ApplePayUniversalButton.example.js

@@ -1,39 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ApplePayUniversalButton } from './ApplePayUniversalButton';
-// Example usage of ApplePayUniversalButton
-export const ApplePayUniversalButtonExample = () => {
-    const checkoutSessionId = 'example-session-123';
-    const lineItems = [
-        {
-            label: 'Product 1',
-            amount: '29.99',
-            type: 'final',
-        },
-        {
-            label: 'Shipping',
-            amount: '5.99',
-            type: 'final',
-        },
-    ];
-    const total = {
-        label: 'Total',
-        amount: '35.98',
-        type: 'final',
-    };
-    const config = {
-        countryCode: 'US',
-        supportedNetworks: ['visa', 'masterCard', 'amex', 'discover'],
-        merchantCapabilities: ['supports3DS'],
-    };
-    const handleSuccess = (payment) => {
-        console.log('Payment successful:', payment);
-    };
-    const handleError = (error) => {
-        console.error('Payment error:', error);
-    };
-    const handleCancel = () => {
-        console.log('Payment cancelled');
-    };
-    return (_jsxs("div", { className: "max-w-md mx-auto p-6 bg-white rounded-lg shadow-lg", children: [_jsx("h2", { className: "text-2xl font-bold mb-4", children: "Apple Pay Universal Button Example" }), _jsxs("div", { className: "space-y-4", children: [_jsxs("div", { children: [_jsx("h3", { className: "font-semibold mb-2", children: "Order Summary:" }), lineItems.map((item, index) => (_jsxs("div", { className: "flex justify-between text-sm", children: [_jsx("span", { children: item.label }), _jsxs("span", { children: ["$", item.amount] })] }, index))), _jsxs("div", { className: "flex justify-between font-bold border-t pt-2 mt-2", children: [_jsx("span", { children: total.label }), _jsxs("span", { children: ["$", total.amount] })] })] }), _jsx(ApplePayUniversalButton, { checkoutSessionId: checkoutSessionId, lineItems: lineItems, total: total, config: config, onSuccess: handleSuccess, onError: handleError, onCancel: handleCancel, className: "w-full" }), _jsxs("div", { className: "text-xs text-gray-500 mt-4", children: [_jsx("p", { children: "This button will:" }), _jsxs("ul", { className: "list-disc list-inside space-y-1", children: [_jsx("li", { children: "Show Apple Pay on supported devices (Safari iOS/macOS)" }), _jsx("li", { children: "Show QR code on other mobile browsers" }), _jsx("li", { children: "Show \"Unavailable\" on unsupported browsers" })] })] })] })] }));
-};
-export default ApplePayUniversalButtonExample;

package/dist/react/components/ApplePayUniversalButton.js

@@ -1,62 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { useApplePay } from '../hooks/useApplePay';
-export const ApplePayUniversalButton = ({ checkoutSessionId, lineItems, total, config = {}, onSuccess, onError, onCancel, className = '', children, disabled = false, }) => {
-    const [showQRCode, setShowQRCode] = useState(false);
-    const { handleApplePayClick, processingPayment, applePayError, isApplePayAvailable, shouldShowQRCode, qrCodeData, generateQRCode, } = useApplePay({
-        onSuccess,
-        onError,
-        onCancel,
-        config,
-    });
-    const handleClick = () => {
-        if (isApplePayAvailable) {
-            handleApplePayClick(checkoutSessionId, lineItems, total, config);
-        }
-        else if (shouldShowQRCode) {
-            setShowQRCode(true);
-            // Generate QR code data
-            const qrData = {
-                checkoutSessionId,
-                lineItems,
-                total,
-                config,
-                qrCodeUrl: generateQRCode({ checkoutSessionId, lineItems, total, config }),
-            };
-            handleApplePayClick(checkoutSessionId, lineItems, total, config);
-        }
-        else {
-            onError?.('Apple Pay is not available on this device');
-        }
-    };
-    const getButtonText = () => {
-        if (processingPayment)
-            return 'Processing...';
-        if (isApplePayAvailable)
-            return 'Pay with Apple Pay';
-        if (shouldShowQRCode)
-            return 'Show QR Code';
-        return 'Apple Pay Unavailable';
-    };
-    const getButtonIcon = () => {
-        if (isApplePayAvailable) {
-            return (_jsx("svg", { className: "h-6 w-6", viewBox: "0 0 24 24", fill: "currentColor", children: _jsx("path", { d: "M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z" }) }));
-        }
-        if (shouldShowQRCode) {
-            return (_jsx("svg", { className: "h-6 w-6", viewBox: "0 0 24 24", fill: "currentColor", children: _jsx("path", { d: "M3 3h7v7H3V3zm2 2v3h3V5H5zm8-2h7v7h-7V3zm2 2v3h3V5h-3zM3 13h7v7H3v-7zm2 2v3h3v-3H5zm8-2h7v7h-7v-7zm2 2v3h3v-3h-3z" }) }));
-        }
-        return (_jsx("svg", { className: "h-6 w-6", viewBox: "0 0 24 24", fill: "currentColor", children: _jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" }) }));
-    };
-    const getButtonStyle = () => {
-        const baseStyle = "h-10 w-full text-base shadow-sm transition-colors duration-200 flex items-center justify-center gap-2";
-        if (isApplePayAvailable) {
-            return `${baseStyle} bg-black text-white hover:bg-black/80 ${className}`;
-        }
-        if (shouldShowQRCode) {
-            return `${baseStyle} bg-blue-600 text-white hover:bg-blue-700 ${className}`;
-        }
-        return `${baseStyle} bg-gray-400 text-gray-600 cursor-not-allowed ${className}`;
-    };
-    return (_jsxs("div", { className: "w-full", children: [_jsxs("button", { onClick: handleClick, disabled: disabled || processingPayment || (!isApplePayAvailable && !shouldShowQRCode), className: getButtonStyle(), style: { margin: 0 }, children: [getButtonIcon(), children || getButtonText()] }), showQRCode && qrCodeData && (_jsx("div", { className: "mt-4 p-4 bg-white border border-gray-200 rounded-lg shadow-sm", children: _jsxs("div", { className: "text-center", children: [_jsx("h3", { className: "text-lg font-medium text-gray-900 mb-2", children: "Scan QR Code to Pay" }), _jsx("p", { className: "text-sm text-gray-600 mb-4", children: "Use your mobile device to scan this QR code and complete your Apple Pay payment" }), _jsx("div", { className: "flex justify-center", children: _jsx("img", { src: qrCodeData.qrCodeUrl, alt: "Apple Pay QR Code", className: "w-48 h-48 border border-gray-200 rounded" }) }), _jsxs("div", { className: "mt-4 text-xs text-gray-500", children: [_jsxs("p", { children: ["Total: ", total.amount, " ", total.label] }), _jsxs("p", { children: ["Session: ", checkoutSessionId.slice(0, 8), "..."] })] }), _jsx("button", { onClick: () => setShowQRCode(false), className: "mt-3 px-4 py-2 text-sm text-gray-600 hover:text-gray-800 underline", children: "Close QR Code" })] }) })), applePayError && (_jsx("div", { className: "mt-2 p-2 bg-red-50 border border-red-200 rounded text-sm text-red-600", children: applePayError }))] }));
-};
-export default ApplePayUniversalButton;