@varity-labs/ui-kit 2.0.0-beta.8 → 2.0.0-beta.9

package/dist/components/PaymentWidget/useVarityPayment.js

@@ -1,8 +1,15 @@
 /**
  * useVarityPayment Hook
- *
- * Payments are coming soon. Returns safe defaults until payment processing
- * is enabled in a future release.
+ * Manages purchase state for developer apps with 90/10 revenue split
+ */
+import { useState, useEffect, useCallback } from 'react';
+import { useActiveAccount, useSendTransaction } from 'thirdweb/react';
+import { prepareContractCall, readContract, getContract } from 'thirdweb';
+import { createThirdwebClient } from 'thirdweb';
+import { arbitrumOne, THIRDWEB_CLIENT_ID } from '../../config/chains';
+import { VARITY_PAYMENTS_ADDRESS, VARITY_PAYMENTS_ABI, } from './types';
+/**
+ * Hook for managing app purchase state
  *
  * @example
  * ```tsx
@@ -13,15 +20,144 @@
  * return <PremiumContent />;
  * ```
  */
-export function useVarityPayment(_options) {
+export function useVarityPayment({ appId, autoFetch = true, }) {
+    const [hasPurchased, setHasPurchased] = useState(false);
+    const [isLoading, setIsLoading] = useState(true);
+    const [isPurchasing, setIsPurchasing] = useState(false);
+    const [error, setError] = useState(null);
+    const [pricing, setPricing] = useState(null);
+    const account = useActiveAccount();
+    const { mutateAsync: sendTx } = useSendTransaction();
+    // Create thirdweb client
+    const client = createThirdwebClient({ clientId: THIRDWEB_CLIENT_ID });
+    // Get contract instance
+    const getPaymentsContract = useCallback(() => {
+        return getContract({
+            client,
+            chain: arbitrumOne, // Payments on Arb One (mainnet, real USDC)
+            address: VARITY_PAYMENTS_ADDRESS,
+        });
+    }, [client]);
+    /**
+     * Fetch pricing and purchase status
+     */
+    const fetchData = useCallback(async () => {
+        if (!appId) {
+            setIsLoading(false);
+            return;
+        }
+        try {
+            setIsLoading(true);
+            setError(null);
+            const contract = getPaymentsContract();
+            // Get app pricing
+            const pricingMethod = VARITY_PAYMENTS_ABI.find(m => m.name === 'getAppPricing');
+            if (pricingMethod) {
+                const pricingData = await readContract({
+                    contract,
+                    method: pricingMethod,
+                    params: [BigInt(appId)],
+                });
+                setPricing({
+                    priceUsdc: pricingData[0],
+                    developer: pricingData[1],
+                    isSubscription: pricingData[2],
+                    intervalDays: Number(pricingData[3]),
+                    isActive: pricingData[4],
+                });
+            }
+            // Check if user has purchased (if connected)
+            if (account?.address) {
+                const purchasedMethod = VARITY_PAYMENTS_ABI.find(m => m.name === 'hasUserPurchased');
+                if (purchasedMethod) {
+                    const purchased = await readContract({
+                        contract,
+                        method: purchasedMethod,
+                        params: [BigInt(appId), account.address],
+                    });
+                    setHasPurchased(purchased);
+                }
+            }
+            else {
+                setHasPurchased(false);
+            }
+        }
+        catch (err) {
+            console.error('Failed to fetch payment data:', err);
+            // Don't show error for apps without pricing - just set pricing to null
+            setPricing(null);
+            setHasPurchased(false);
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [appId, account?.address, getPaymentsContract]);
+    /**
+     * Purchase the app
+     */
+    const purchase = useCallback(async () => {
+        if (!account) {
+            setError('Please sign in first');
+            return null;
+        }
+        if (!pricing || !pricing.isActive) {
+            setError('This app is not available for purchase');
+            return null;
+        }
+        if (hasPurchased) {
+            setError('You have already purchased this app');
+            return null;
+        }
+        try {
+            setIsPurchasing(true);
+            setError(null);
+            const contract = getPaymentsContract();
+            const purchaseMethod = VARITY_PAYMENTS_ABI.find(m => m.name === 'purchaseApp');
+            if (!purchaseMethod) {
+                throw new Error('Purchase method not found in ABI');
+            }
+            const transaction = prepareContractCall({
+                contract,
+                method: purchaseMethod,
+                params: [BigInt(appId)],
+                // No value — purchaseApp is nonpayable, pulls USDC via ERC-20 transferFrom
+            });
+            const result = await sendTx(transaction);
+            const txHash = result.transactionHash;
+            // Update purchase status
+            setHasPurchased(true);
+            return txHash;
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : 'Purchase failed';
+            setError(errorMessage);
+            console.error('Purchase error:', err);
+            return null;
+        }
+        finally {
+            setIsPurchasing(false);
+        }
+    }, [account, pricing, hasPurchased, appId, getPaymentsContract, sendTx]);
+    /**
+     * Refresh purchase status
+     */
+    const refresh = useCallback(async () => {
+        await fetchData();
+    }, [fetchData]);
+    // Auto-fetch on mount and when dependencies change
+    useEffect(() => {
+        if (autoFetch) {
+            fetchData();
+        }
+    }, [autoFetch, fetchData]);
     return {
-        hasPurchased: false,
-        isLoading: false,
-        isPurchasing: false,
-        error: null,
-        pricing: null,
-        purchase: async () => null,
-        refresh: async () => { },
+        hasPurchased,
+        isLoading,
+        isPurchasing,
+        error,
+        pricing,
+        purchase,
+        refresh,
     };
 }
 export default useVarityPayment;

package/dist/components/PaymentWidget/useVarityPayment.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVarityPayment.js","sourceRoot":"","sources":["../../../src/components/PaymentWidget/useVarityPayment.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,MAAM,UAAU,gBAAgB,CAC9B,QAAiC;IAEjC,OAAO;QACL,YAAY,EAAE,KAAK;QACnB,SAAS,EAAE,KAAK;QAChB,YAAY,EAAE,KAAK;QACnB,KAAK,EAAE,IAAI;QACX,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,KAAK,IAAI,EAAE,CAAC,IAAI;QAC1B,OAAO,EAAE,KAAK,IAAI,EAAE,GAAE,CAAC;KACxB,CAAC;AACJ,CAAC;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"useVarityPayment.js","sourceRoot":"","sources":["../../../src/components/PaymentWidget/useVarityPayment.ts"],"names":[],"mappings":"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"}

package/dist/components/Payments/CheckoutModal.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { SubscriptionPlan } from './types';
+/**
+ * Checkout Modal Component
+ * Handles USDC payment processing for subscriptions
+ */
+interface CheckoutModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    plan: SubscriptionPlan;
+    clientId: string;
+    paymentRecipient: string;
+    onSuccess?: (txHash: string) => void;
+    onError?: (error: Error) => void;
+    theme?: 'light' | 'dark';
+}
+export declare const CheckoutModal: React.FC<CheckoutModalProps>;
+export default CheckoutModal;
+//# sourceMappingURL=CheckoutModal.d.ts.map

package/dist/components/Payments/CheckoutModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutModal.d.ts","sourceRoot":"","sources":["../../../src/components/Payments/CheckoutModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAKnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAK3C;;;GAGG;AAEH,UAAU,kBAAkB;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,gBAAgB,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC1B;AAWD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAuLtD,CAAC;AA0NF,eAAe,aAAa,CAAC"}

package/dist/components/Payments/CheckoutModal.js

@@ -0,0 +1,194 @@
+import React, { useState, useEffect } from 'react';
+import { useActiveAccount, useSendTransaction } from 'thirdweb/react';
+import { prepareContractCall, waitForReceipt } from 'thirdweb';
+import { getContract } from 'thirdweb';
+import { createThirdwebClient } from 'thirdweb';
+import { formatUSDC, USDC_CONTRACT_ADDRESS } from './constants';
+import { useSIWE } from '../SIWE/SIWEProvider';
+import { varityL3Testnet } from '../../config/chains';
+var CheckoutStep;
+(function (CheckoutStep) {
+    CheckoutStep["REVIEW"] = "review";
+    CheckoutStep["APPROVE"] = "approve";
+    CheckoutStep["PAYMENT"] = "payment";
+    CheckoutStep["CONFIRMING"] = "confirming";
+    CheckoutStep["SUCCESS"] = "success";
+    CheckoutStep["ERROR"] = "error";
+})(CheckoutStep || (CheckoutStep = {}));
+export const CheckoutModal = ({ isOpen, onClose, plan, clientId, paymentRecipient, onSuccess, onError, theme = 'dark', }) => {
+    const [currentStep, setCurrentStep] = useState(CheckoutStep.REVIEW);
+    const [error, setError] = useState(null);
+    const [txHash, setTxHash] = useState(null);
+    const { isAuthenticated } = useSIWE();
+    const account = useActiveAccount();
+    const { mutate: sendTransaction, isPending } = useSendTransaction();
+    const client = createThirdwebClient({ clientId });
+    // Reset state when modal opens
+    useEffect(() => {
+        if (isOpen) {
+            setCurrentStep(CheckoutStep.REVIEW);
+            setError(null);
+            setTxHash(null);
+        }
+    }, [isOpen]);
+    if (!isOpen)
+        return null;
+    const bgColor = theme === 'dark' ? 'bg-gray-900' : 'bg-white';
+    const textColor = theme === 'dark' ? 'text-white' : 'text-gray-900';
+    const mutedTextColor = theme === 'dark' ? 'text-gray-400' : 'text-gray-600';
+    const borderColor = theme === 'dark' ? 'border-gray-700' : 'border-gray-200';
+    const handlePayment = async () => {
+        if (!account || !isAuthenticated) {
+            setError('Please connect wallet and authenticate first');
+            setCurrentStep(CheckoutStep.ERROR);
+            return;
+        }
+        try {
+            setCurrentStep(CheckoutStep.PAYMENT);
+            setError(null);
+            // Get USDC contract
+            const usdcContract = getContract({
+                client,
+                chain: varityL3Testnet,
+                address: USDC_CONTRACT_ADDRESS,
+            });
+            // Prepare USDC transfer transaction
+            const transaction = prepareContractCall({
+                contract: usdcContract,
+                method: 'function transfer(address to, uint256 amount) returns (bool)',
+                params: [paymentRecipient, BigInt(plan.price)],
+            });
+            // Send transaction
+            sendTransaction(transaction, {
+                onSuccess: async (result) => {
+                    setTxHash(result.transactionHash);
+                    setCurrentStep(CheckoutStep.CONFIRMING);
+                    try {
+                        // Wait for on-chain confirmation instead of a fixed timeout
+                        await waitForReceipt({
+                            client,
+                            chain: varityL3Testnet,
+                            transactionHash: result.transactionHash,
+                        });
+                        setCurrentStep(CheckoutStep.SUCCESS);
+                        onSuccess?.(result.transactionHash);
+                    }
+                    catch (receiptErr) {
+                        const msg = receiptErr?.message || 'Transaction failed on-chain';
+                        setError(msg);
+                        setCurrentStep(CheckoutStep.ERROR);
+                        onError?.(receiptErr);
+                    }
+                },
+                onError: (err) => {
+                    const errorMessage = err.message || 'Payment failed';
+                    setError(errorMessage);
+                    setCurrentStep(CheckoutStep.ERROR);
+                    onError?.(err);
+                },
+            });
+        }
+        catch (err) {
+            const errorMessage = err.message || 'Payment failed';
+            setError(errorMessage);
+            setCurrentStep(CheckoutStep.ERROR);
+            onError?.(err);
+        }
+    };
+    const handleClose = () => {
+        if (currentStep !== CheckoutStep.PAYMENT && currentStep !== CheckoutStep.CONFIRMING) {
+            onClose();
+        }
+    };
+    return (React.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center" },
+        React.createElement("div", { className: "absolute inset-0 bg-black bg-opacity-50", onClick: handleClose }),
+        React.createElement("div", { className: `relative w-full max-w-2xl mx-4 rounded-2xl shadow-2xl ${bgColor} ${textColor} border ${borderColor}` },
+            currentStep !== CheckoutStep.PAYMENT && currentStep !== CheckoutStep.CONFIRMING && (React.createElement("button", { onClick: handleClose, className: "absolute top-4 right-4 text-gray-400 hover:text-gray-600 transition-colors" },
+                React.createElement("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
+                    React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" })))),
+            React.createElement("div", { className: "p-8" },
+                React.createElement("h2", { className: "text-3xl font-bold mb-6" }, "Complete Your Subscription"),
+                currentStep === CheckoutStep.REVIEW && (React.createElement(ReviewStep, { plan: plan, onProceed: handlePayment, theme: theme, textColor: textColor, mutedTextColor: mutedTextColor, borderColor: borderColor, isPending: isPending })),
+                currentStep === CheckoutStep.PAYMENT && (React.createElement(ProcessingStep, { message: "Processing payment...", theme: theme, textColor: textColor })),
+                currentStep === CheckoutStep.CONFIRMING && (React.createElement(ProcessingStep, { message: "Confirming transaction...", txHash: txHash, theme: theme, textColor: textColor, mutedTextColor: mutedTextColor })),
+                currentStep === CheckoutStep.SUCCESS && (React.createElement(SuccessStep, { plan: plan, txHash: txHash, onClose: onClose, theme: theme, textColor: textColor, mutedTextColor: mutedTextColor })),
+                currentStep === CheckoutStep.ERROR && (React.createElement(ErrorStep, { error: error, onRetry: handlePayment, onClose: onClose, theme: theme, textColor: textColor }))))));
+};
+const ReviewStep = ({ plan, onProceed, theme, textColor, mutedTextColor, borderColor, isPending, }) => (React.createElement(React.Fragment, null,
+    React.createElement("div", { className: `border ${borderColor} rounded-lg p-6 mb-6` },
+        React.createElement("div", { className: "flex justify-between items-start mb-4" },
+            React.createElement("div", null,
+                React.createElement("h3", { className: `text-xl font-bold ${textColor}` },
+                    plan.name,
+                    " Plan"),
+                React.createElement("p", { className: mutedTextColor }, plan.description)),
+            React.createElement("div", { className: "text-right" },
+                React.createElement("p", { className: `text-2xl font-bold ${textColor}` }, formatUSDC(plan.price)),
+                React.createElement("p", { className: `text-sm ${mutedTextColor}` }, "per month"))),
+        React.createElement("div", { className: "space-y-2" },
+            React.createElement("p", { className: `font-semibold ${textColor} mb-2` }, "Included features:"),
+            plan.features.slice(0, 5).map((feature, index) => (React.createElement("div", { key: index, className: "flex items-center gap-2" },
+                React.createElement("svg", { className: "w-4 h-4 text-green-500", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
+                    React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" })),
+                React.createElement("span", { className: `text-sm ${mutedTextColor}` }, feature)))))),
+    React.createElement("div", { className: `bg-${theme === 'dark' ? 'gray-800' : 'gray-50'} rounded-lg p-6 mb-6` },
+        React.createElement("h4", { className: `font-semibold mb-4 ${textColor}` }, "Payment Details"),
+        React.createElement("div", { className: "space-y-2" },
+            React.createElement("div", { className: "flex justify-between" },
+                React.createElement("span", { className: mutedTextColor }, "Subtotal"),
+                React.createElement("span", { className: textColor }, formatUSDC(plan.price))),
+            React.createElement("div", { className: "flex justify-between" },
+                React.createElement("span", { className: mutedTextColor }, "Currency"),
+                React.createElement("span", { className: textColor }, "USDC (Varity L3)")),
+            React.createElement("div", { className: `border-t ${borderColor} pt-2 mt-2` }),
+            React.createElement("div", { className: "flex justify-between font-bold" },
+                React.createElement("span", { className: textColor }, "Total Due Today"),
+                React.createElement("span", { className: `text-xl ${textColor}` }, formatUSDC(plan.price))))),
+    React.createElement("button", { onClick: onProceed, disabled: isPending, className: "w-full py-4 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2" }, isPending ? (React.createElement(React.Fragment, null,
+        React.createElement(LoadingSpinner, null),
+        "Processing...")) : (React.createElement(React.Fragment, null,
+        "Pay ",
+        formatUSDC(plan.price),
+        " USDC"))),
+    React.createElement("p", { className: `text-xs text-center mt-4 ${mutedTextColor}` }, "Your payment is secure and encrypted. Powered by Thirdweb on Varity L3.")));
+const ProcessingStep = ({ message, txHash, theme, textColor, mutedTextColor }) => (React.createElement("div", { className: "text-center py-12" },
+    React.createElement("div", { className: "inline-flex items-center justify-center w-20 h-20 rounded-full bg-blue-500 text-white mb-6 animate-pulse" },
+        React.createElement(LoadingSpinner, null)),
+    React.createElement("h3", { className: `text-2xl font-bold mb-2 ${textColor}` }, message),
+    React.createElement("p", { className: mutedTextColor }, "Please wait while we process your transaction"),
+    txHash && (React.createElement("div", { className: "mt-6" },
+        React.createElement("p", { className: `text-sm ${mutedTextColor} mb-2` }, "Transaction Hash:"),
+        React.createElement("code", { className: `text-xs ${theme === 'dark' ? 'bg-gray-800 text-gray-300' : 'bg-gray-100 text-gray-700'} px-3 py-1 rounded` },
+            txHash.substring(0, 10),
+            "...",
+            txHash.substring(txHash.length - 10))))));
+const SuccessStep = ({ plan, txHash, onClose, theme, textColor, mutedTextColor }) => (React.createElement("div", { className: "text-center py-12" },
+    React.createElement("div", { className: "inline-flex items-center justify-center w-20 h-20 rounded-full bg-green-500 text-white mb-6" },
+        React.createElement("svg", { className: "w-12 h-12", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
+            React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }))),
+    React.createElement("h3", { className: `text-2xl font-bold mb-2 ${textColor}` }, "Payment Successful!"),
+    React.createElement("p", { className: mutedTextColor },
+        "You're now subscribed to the ",
+        plan.name,
+        " plan"),
+    txHash && (React.createElement("div", { className: "mt-6" },
+        React.createElement("p", { className: `text-sm ${mutedTextColor} mb-2` }, "Transaction Hash:"),
+        React.createElement("code", { className: `text-xs ${theme === 'dark' ? 'bg-gray-800 text-gray-300' : 'bg-gray-100 text-gray-700'} px-3 py-1 rounded` }, txHash))),
+    React.createElement("button", { onClick: onClose, className: "mt-8 px-8 py-3 bg-blue-600 hover:bg-blue-700 text-white font-semibold rounded-lg transition-colors" }, "Go to Dashboard")));
+const ErrorStep = ({ error, onRetry, onClose, theme, textColor }) => (React.createElement("div", { className: "text-center py-12" },
+    React.createElement("div", { className: "inline-flex items-center justify-center w-20 h-20 rounded-full bg-red-500 text-white mb-6" },
+        React.createElement("svg", { className: "w-12 h-12", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
+            React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }))),
+    React.createElement("h3", { className: `text-2xl font-bold mb-2 ${textColor}` }, "Payment Failed"),
+    React.createElement("p", { className: "text-red-500 mb-8" }, error || 'An error occurred during payment'),
+    React.createElement("div", { className: "flex gap-4 justify-center" },
+        React.createElement("button", { onClick: onRetry, className: "px-6 py-3 bg-blue-600 hover:bg-blue-700 text-white font-semibold rounded-lg transition-colors" }, "Try Again"),
+        React.createElement("button", { onClick: onClose, className: `px-6 py-3 ${theme === 'dark' ? 'bg-gray-700 hover:bg-gray-600' : 'bg-gray-200 hover:bg-gray-300'} ${textColor} font-semibold rounded-lg transition-colors` }, "Cancel"))));
+/**
+ * Loading Spinner Component
+ */
+const LoadingSpinner = () => (React.createElement("svg", { className: "animate-spin h-6 w-6", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" },
+    React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+    React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })));
+export default CheckoutModal;
+//# sourceMappingURL=CheckoutModal.js.map

package/dist/components/Payments/CheckoutModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutModal.js","sourceRoot":"","sources":["../../../src/components/Payments/CheckoutModal.tsx"],"names":[],"mappings":"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"}

package/dist/components/Payments/SubscriptionWidget.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { SubscriptionTier } from './types';
+/**
+ * Subscription Widget Component
+ * Displays subscription plans with feature comparison
+ */
+interface SubscriptionWidgetProps {
+    currentPlan?: SubscriptionTier;
+    onSelectPlan: (planId: string) => void;
+    theme?: 'light' | 'dark';
+    showAnnualToggle?: boolean;
+    className?: string;
+    isLoading?: boolean;
+}
+export declare const SubscriptionWidget: React.FC<SubscriptionWidgetProps>;
+export default SubscriptionWidget;
+//# sourceMappingURL=SubscriptionWidget.d.ts.map

package/dist/components/Payments/SubscriptionWidget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubscriptionWidget.d.ts","sourceRoot":"","sources":["../../../src/components/Payments/SubscriptionWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAoB,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAG7D;;;GAGG;AAEH,UAAU,uBAAuB;IAC/B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA6FhE,CAAC;AA6KF,eAAe,kBAAkB,CAAC"}

package/dist/components/Payments/SubscriptionWidget.js

@@ -0,0 +1,89 @@
+import React, { useState } from 'react';
+import { SUBSCRIPTION_PLANS, formatUSDC } from './constants';
+export const SubscriptionWidget = ({ currentPlan, onSelectPlan, theme = 'dark', showAnnualToggle = false, className = '', isLoading = false, }) => {
+    const [billingPeriod, setBillingPeriod] = useState('monthly');
+    const bgColor = theme === 'dark' ? 'bg-gray-900' : 'bg-white';
+    const textColor = theme === 'dark' ? 'text-white' : 'text-gray-900';
+    const mutedTextColor = theme === 'dark' ? 'text-gray-400' : 'text-gray-600';
+    const borderColor = theme === 'dark' ? 'border-gray-700' : 'border-gray-200';
+    const calculateAnnualPrice = (monthlyPrice) => {
+        // 20% discount for annual billing
+        return Math.floor(monthlyPrice * 12 * 0.8);
+    };
+    return (React.createElement("div", { className: `${className}` },
+        React.createElement("div", { className: "text-center mb-12" },
+            React.createElement("h2", { className: `text-4xl font-bold mb-4 ${textColor}` }, "Choose Your Plan"),
+            React.createElement("p", { className: `text-lg ${mutedTextColor}` }, "Select the perfect plan for your business needs")),
+        showAnnualToggle && (React.createElement("div", { className: "flex justify-center items-center gap-4 mb-8" },
+            React.createElement("button", { onClick: () => setBillingPeriod('monthly'), className: `px-4 py-2 rounded-lg font-semibold transition-colors ${billingPeriod === 'monthly'
+                    ? 'bg-blue-600 text-white'
+                    : theme === 'dark'
+                        ? 'bg-gray-800 text-gray-400 hover:bg-gray-700'
+                        : 'bg-gray-200 text-gray-600 hover:bg-gray-300'}` }, "Monthly"),
+            React.createElement("button", { onClick: () => setBillingPeriod('annual'), className: `px-4 py-2 rounded-lg font-semibold transition-colors relative ${billingPeriod === 'annual'
+                    ? 'bg-blue-600 text-white'
+                    : theme === 'dark'
+                        ? 'bg-gray-800 text-gray-400 hover:bg-gray-700'
+                        : 'bg-gray-200 text-gray-600 hover:bg-gray-300'}` },
+                "Annual",
+                React.createElement("span", { className: "absolute -top-2 -right-2 bg-green-500 text-white text-xs px-2 py-0.5 rounded-full" }, "Save 20%")))),
+        React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 max-w-7xl mx-auto" }, SUBSCRIPTION_PLANS.map((plan) => (React.createElement(PlanCard, { key: plan.id, plan: plan, isCurrentPlan: currentPlan === plan.tier, onSelect: () => onSelectPlan(plan.id), billingPeriod: billingPeriod, calculateAnnualPrice: calculateAnnualPrice, theme: theme, bgColor: bgColor, textColor: textColor, mutedTextColor: mutedTextColor, borderColor: borderColor, isLoading: isLoading })))),
+        React.createElement("div", { className: "text-center mt-12" },
+            React.createElement("button", { className: `${mutedTextColor} hover:text-blue-500 underline transition-colors` }, "View detailed feature comparison"))));
+};
+const PlanCard = ({ plan, isCurrentPlan, onSelect, billingPeriod, calculateAnnualPrice, theme, bgColor, textColor, mutedTextColor, borderColor, isLoading, }) => {
+    const displayPrice = billingPeriod === 'annual'
+        ? calculateAnnualPrice(plan.price)
+        : plan.price;
+    const pricePerMonth = billingPeriod === 'annual'
+        ? formatUSDC(displayPrice / 12)
+        : formatUSDC(displayPrice);
+    const totalPrice = formatUSDC(displayPrice);
+    const cardBg = plan.isRecommended
+        ? theme === 'dark'
+            ? 'bg-gradient-to-br from-blue-900 to-gray-900'
+            : 'bg-gradient-to-br from-blue-50 to-white'
+        : theme === 'dark'
+            ? 'bg-gray-800'
+            : 'bg-white';
+    const cardBorder = plan.isRecommended
+        ? 'border-blue-500'
+        : borderColor;
+    return (React.createElement("div", { className: `relative rounded-2xl border-2 ${cardBorder} ${cardBg} p-8 shadow-xl transition-transform hover:scale-105` },
+        plan.isRecommended && (React.createElement("div", { className: "absolute -top-4 left-1/2 transform -translate-x-1/2" },
+            React.createElement("span", { className: "bg-blue-500 text-white px-4 py-1 rounded-full text-sm font-semibold" }, "Recommended"))),
+        plan.isPopular && !plan.isRecommended && (React.createElement("div", { className: "absolute top-4 right-4" },
+            React.createElement("span", { className: "bg-green-500 text-white px-3 py-1 rounded-full text-xs font-semibold" }, "Popular"))),
+        React.createElement("h3", { className: `text-2xl font-bold mb-2 ${textColor}` }, plan.name),
+        React.createElement("p", { className: `mb-6 ${mutedTextColor}` }, plan.description),
+        React.createElement("div", { className: "mb-6" },
+            React.createElement("div", { className: "flex items-baseline gap-2" },
+                React.createElement("span", { className: `text-4xl font-bold ${textColor}` }, pricePerMonth),
+                React.createElement("span", { className: mutedTextColor }, "/month")),
+            billingPeriod === 'annual' && (React.createElement("p", { className: `text-sm mt-1 ${mutedTextColor}` },
+                totalPrice,
+                " billed annually"))),
+        React.createElement("button", { onClick: onSelect, disabled: isCurrentPlan || isLoading, className: `w-full py-3 rounded-lg font-semibold transition-colors mb-6 ${isCurrentPlan
+                ? theme === 'dark'
+                    ? 'bg-gray-700 text-gray-400 cursor-not-allowed'
+                    : 'bg-gray-200 text-gray-500 cursor-not-allowed'
+                : plan.isRecommended
+                    ? 'bg-blue-600 hover:bg-blue-700 text-white'
+                    : theme === 'dark'
+                        ? 'bg-gray-700 hover:bg-gray-600 text-white'
+                        : 'bg-gray-900 hover:bg-gray-800 text-white'}` }, isLoading ? (React.createElement("span", { className: "flex items-center justify-center gap-2" },
+            React.createElement(LoadingSpinner, null),
+            "Processing...")) : isCurrentPlan ? ('Current Plan') : ('Select Plan')),
+        React.createElement("div", { className: "space-y-3" }, plan.features.map((feature, index) => (React.createElement("div", { key: index, className: "flex items-start gap-3" },
+            React.createElement("svg", { className: `w-5 h-5 mt-0.5 flex-shrink-0 ${plan.isRecommended ? 'text-blue-500' : 'text-green-500'}`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
+                React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" })),
+            React.createElement("span", { className: `text-sm ${mutedTextColor}` }, feature)))))));
+};
+/**
+ * Loading Spinner Component
+ */
+const LoadingSpinner = () => (React.createElement("svg", { className: "animate-spin h-5 w-5", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" },
+    React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+    React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })));
+export default SubscriptionWidget;
+//# sourceMappingURL=SubscriptionWidget.js.map

package/dist/components/Payments/SubscriptionWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubscriptionWidget.js","sourceRoot":"","sources":["../../../src/components/Payments/SubscriptionWidget.tsx"],"names":[],"mappings":"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"}

package/dist/components/Payments/constants.d.ts

@@ -0,0 +1,59 @@
+/**
+ * Payment Constants
+ * Subscription plans, pricing, and USDC configuration
+ */
+import { SubscriptionPlan, SubscriptionTier } from './types';
+/**
+ * Varity L3 Chain Configuration
+ */
+export declare const VARITY_L3_CHAIN_ID = 33529;
+export declare const USDC_CONTRACT_ADDRESS = "0x6Fd8ee6B4C2193e9E2e0E2EC5D295689B607c0cE";
+export declare const USDC_DECIMALS = 6;
+/**
+ * Subscription Plans
+ * Prices in USDC (with 6 decimals)
+ */
+export declare const SUBSCRIPTION_PLANS: SubscriptionPlan[];
+/**
+ * Get subscription plan by ID
+ */
+export declare function getSubscriptionPlan(planId: string): SubscriptionPlan | undefined;
+/**
+ * Get subscription plan by tier
+ */
+export declare function getSubscriptionPlanByTier(tier: SubscriptionTier): SubscriptionPlan | undefined;
+/**
+ * Format USDC amount for display
+ * Converts from 6 decimal representation to human-readable
+ */
+export declare function formatUSDC(amount: number): string;
+/**
+ * Convert human amount to USDC contract amount
+ * e.g., 99 -> 99_000000 (6 decimals)
+ */
+export declare function toUSDCAmount(humanAmount: number): number;
+/**
+ * Convert USDC contract amount to human amount
+ * e.g., 99_000000 -> 99
+ */
+export declare function fromUSDCAmount(contractAmount: number): number;
+/**
+ * Payment API Endpoints
+ */
+export declare const PAYMENT_ENDPOINTS: {
+    CREATE_CHECKOUT: string;
+    GET_SUBSCRIPTION: string;
+    CANCEL_SUBSCRIPTION: string;
+    RESUME_SUBSCRIPTION: string;
+    UPGRADE_SUBSCRIPTION: string;
+    DOWNGRADE_SUBSCRIPTION: string;
+    GET_INVOICES: string;
+    GET_USAGE: string;
+    WEBHOOK: string;
+};
+/**
+ * Trial Period Configuration
+ */
+export declare const TRIAL_PERIOD_DAYS = 14;
+export declare const TRIAL_ENABLED = true;
+//# sourceMappingURL=constants.d.ts.map

package/dist/components/Payments/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/Payments/constants.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAE7D;;GAEG;AACH,eAAO,MAAM,kBAAkB,QAAQ,CAAC;AACxC,eAAO,MAAM,qBAAqB,+CAA+C,CAAC;AAClF,eAAO,MAAM,aAAa,IAAI,CAAC;AAE/B;;;GAGG;AACH,eAAO,MAAM,kBAAkB,EAAE,gBAAgB,EAyEhD,CAAC;AAEF;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,GAAG,gBAAgB,GAAG,SAAS,CAEhF;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,gBAAgB,GAAG,gBAAgB,GAAG,SAAS,CAE9F;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAKjD;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAExD;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,cAAc,EAAE,MAAM,GAAG,MAAM,CAE7D;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;CAU7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,aAAa,OAAO,CAAC"}