@digilogiclabs/saas-factory-payments 0.1.0

package/dist/web/index.js

@@ -0,0 +1,1651 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/web/index.ts
+var index_exports = {};
+__export(index_exports, {
+  BillingPortal: () => BillingPortal,
+  CheckoutButton: () => CheckoutButton,
+  PaymentForm: () => PaymentForm,
+  PricingTable: () => PricingTable,
+  StripeProvider: () => StripeProvider,
+  confirmPayment: () => confirmPayment,
+  createCheckoutSession: () => createCheckoutSession,
+  createPaymentIntent: () => createPaymentIntent,
+  createPortalSession: () => createPortalSession,
+  formatStripeError: () => formatStripeError,
+  getStripe: () => getStripe2,
+  initializeStripe: () => initializeStripe,
+  redirectToCheckout: () => redirectToCheckout,
+  useCheckout: () => useCheckout,
+  useCustomer: () => useCustomer,
+  useSubscription: () => useSubscription
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/web/components/CheckoutButton.tsx
+var import_react2 = require("react");
+var import_react_stripe_js = require("@stripe/react-stripe-js");
+
+// src/shared/providers/PaymentsProvider.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var PaymentsContext = (0, import_react.createContext)(
+  void 0
+);
+var usePaymentsConfig = () => {
+  const context = (0, import_react.useContext)(PaymentsContext);
+  if (!context) {
+    throw new Error("usePaymentsConfig must be used within PaymentsProvider");
+  }
+  return context;
+};
+
+// src/shared/constants.ts
+var CURRENCY_SYMBOLS = {
+  USD: "$",
+  EUR: "\u20AC",
+  GBP: "\xA3",
+  JPY: "\xA5",
+  CAD: "C$",
+  AUD: "A$",
+  CHF: "CHF",
+  CNY: "\xA5",
+  SEK: "kr",
+  NZD: "NZ$"
+};
+var DEFAULT_CURRENCY = "USD";
+var ERROR_MESSAGES = {
+  PROVIDER_NOT_CONFIGURED: "Payments provider is not properly configured",
+  STRIPE_NOT_LOADED: "Stripe has not been loaded yet",
+  INVALID_PRICE_ID: "Invalid price ID provided",
+  INVALID_CUSTOMER_ID: "Invalid customer ID provided",
+  CHECKOUT_FAILED: "Checkout session creation failed",
+  PAYMENT_FAILED: "Payment processing failed",
+  SUBSCRIPTION_NOT_FOUND: "Subscription not found",
+  CUSTOMER_NOT_FOUND: "Customer not found"
+};
+
+// src/shared/utils/validation.ts
+var validateEmail = (email) => {
+  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+  return emailRegex.test(email);
+};
+var validateStripeId = (id, type) => {
+  const prefixes = {
+    customer: "cus_",
+    subscription: "sub_",
+    price: "price_",
+    product: "prod_",
+    payment_intent: "pi_"
+  };
+  return id.startsWith(prefixes[type]);
+};
+
+// src/web/components/CheckoutButton.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CheckoutButton = ({
+  priceId,
+  customerId,
+  customerEmail,
+  successUrl = typeof window !== "undefined" ? `${window.location.origin}/success` : "/success",
+  cancelUrl = typeof window !== "undefined" ? `${window.location.origin}/cancel` : "/cancel",
+  children,
+  className = "",
+  disabled = false,
+  allowPromotionCodes = true,
+  billingAddressCollection = "auto",
+  metadata,
+  trialPeriodDays,
+  onSuccess,
+  onError,
+  onLoading
+}) => {
+  const stripe = (0, import_react_stripe_js.useStripe)();
+  const { isConfigured } = usePaymentsConfig();
+  const [loading, setLoading] = (0, import_react2.useState)(false);
+  const handleCheckout = async () => {
+    if (!stripe) {
+      const error = ERROR_MESSAGES.STRIPE_NOT_LOADED;
+      onError?.(error);
+      console.error(error);
+      return;
+    }
+    if (!isConfigured) {
+      const error = ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED;
+      onError?.(error);
+      console.error(error);
+      return;
+    }
+    if (!validateStripeId(priceId, "price")) {
+      const error = ERROR_MESSAGES.INVALID_PRICE_ID;
+      onError?.(error);
+      console.error(error);
+      return;
+    }
+    if (customerId && !validateStripeId(customerId, "customer")) {
+      const error = ERROR_MESSAGES.INVALID_CUSTOMER_ID;
+      onError?.(error);
+      console.error(error);
+      return;
+    }
+    setLoading(true);
+    onLoading?.(true);
+    try {
+      const response = await fetch("/api/payments/create-checkout-session", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          priceId,
+          customerId,
+          customerEmail,
+          successUrl,
+          cancelUrl,
+          allowPromotionCodes,
+          billingAddressCollection,
+          metadata,
+          trialPeriodDays
+        })
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({ error: "Network error" }));
+        throw new Error(errorData.error || ERROR_MESSAGES.CHECKOUT_FAILED);
+      }
+      const { sessionId } = await response.json();
+      if (!sessionId) {
+        throw new Error("No session ID returned from server");
+      }
+      const result = await stripe.redirectToCheckout({ sessionId });
+      if (result.error) {
+        throw new Error(result.error.message || ERROR_MESSAGES.CHECKOUT_FAILED);
+      }
+      onSuccess?.();
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : ERROR_MESSAGES.CHECKOUT_FAILED;
+      onError?.(errorMessage);
+      console.error("Checkout error:", error);
+    } finally {
+      setLoading(false);
+      onLoading?.(false);
+    }
+  };
+  const isDisabled = !stripe || loading || disabled || !isConfigured;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "button",
+    {
+      onClick: handleCheckout,
+      disabled: isDisabled,
+      className: `
+        inline-flex items-center justify-center px-4 py-2 
+        border border-transparent text-sm font-medium rounded-md 
+        text-white bg-blue-600 hover:bg-blue-700 
+        focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500
+        disabled:opacity-50 disabled:cursor-not-allowed
+        transition-colors duration-200
+        ${className}
+      `,
+      "aria-label": typeof children === "string" ? children : "Checkout",
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          "svg",
+          {
+            className: "animate-spin -ml-1 mr-3 h-4 w-4 text-white",
+            xmlns: "http://www.w3.org/2000/svg",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "circle",
+                {
+                  className: "opacity-25",
+                  cx: "12",
+                  cy: "12",
+                  r: "10",
+                  stroke: "currentColor",
+                  strokeWidth: "4"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "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"
+                }
+              )
+            ]
+          }
+        ),
+        "Processing..."
+      ] }) : children
+    }
+  );
+};
+
+// src/shared/utils/formatting.ts
+var formatCurrency = (amount, currency = DEFAULT_CURRENCY, options = {}) => {
+  const { showSymbol = true, showCents = true, locale = "en-US" } = options;
+  const currencyCode = currency.toUpperCase();
+  const isZeroDecimalCurrency = ["JPY", "KRW", "VND", "CLP"].includes(
+    currencyCode
+  );
+  const displayAmount = isZeroDecimalCurrency ? amount : amount / 100;
+  if (showSymbol) {
+    try {
+      return new Intl.NumberFormat(locale, {
+        style: "currency",
+        currency: currencyCode,
+        minimumFractionDigits: showCents && !isZeroDecimalCurrency ? 2 : 0,
+        maximumFractionDigits: showCents && !isZeroDecimalCurrency ? 2 : 0
+      }).format(displayAmount);
+    } catch (error) {
+      const symbol = CURRENCY_SYMBOLS[currencyCode] || currencyCode;
+      const formattedAmount = showCents && !isZeroDecimalCurrency ? displayAmount.toFixed(2) : Math.round(displayAmount).toString();
+      return `${symbol}${formattedAmount}`;
+    }
+  }
+  return showCents && !isZeroDecimalCurrency ? displayAmount.toFixed(2) : Math.round(displayAmount).toString();
+};
+var formatPricingPlan = (plan) => {
+  const price = formatCurrency(plan.price, plan.currency);
+  const interval = plan.intervalCount && plan.intervalCount > 1 ? `${plan.intervalCount} ${plan.interval}s` : plan.interval;
+  return `${price}/${interval}`;
+};
+var formatTrialPeriod = (days) => {
+  if (days === 0) return "No trial";
+  if (days === 1) return "1 day trial";
+  if (days < 7) return `${days} days trial`;
+  if (days === 7) return "1 week trial";
+  if (days < 30) return `${Math.floor(days / 7)} weeks trial`;
+  if (days === 30) return "1 month trial";
+  return `${Math.floor(days / 30)} months trial`;
+};
+
+// src/web/components/PricingTable.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var PricingTable = ({
+  plans,
+  customerId,
+  customerEmail,
+  successUrl,
+  cancelUrl,
+  className = "",
+  onPlanSelect,
+  onCheckoutSuccess,
+  onCheckoutError,
+  showFeatures = true,
+  showTrialInfo = true,
+  layout = "grid",
+  maxColumns = 3
+}) => {
+  if (!plans || plans.length === 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "text-center py-8 text-gray-500", children: "No pricing plans available" });
+  }
+  const gridCols = Math.min(plans.length, maxColumns);
+  const gridClass = layout === "grid" ? `grid gap-6 ${gridCols === 1 ? "grid-cols-1" : gridCols === 2 ? "grid-cols-1 md:grid-cols-2" : "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"}` : "space-y-6";
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: `pricing-table ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: gridClass, children: plans.map((plan) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    PricingCard,
+    {
+      plan,
+      customerId,
+      customerEmail,
+      successUrl,
+      cancelUrl,
+      onSelect: () => onPlanSelect?.(plan),
+      onCheckoutSuccess: () => onCheckoutSuccess?.(plan),
+      onCheckoutError: (error) => onCheckoutError?.(plan, error),
+      showFeatures,
+      showTrialInfo
+    },
+    plan.id
+  )) }) });
+};
+var PricingCard = ({
+  plan,
+  customerId,
+  customerEmail,
+  successUrl,
+  cancelUrl,
+  onSelect,
+  onCheckoutSuccess,
+  onCheckoutError,
+  showFeatures = true,
+  showTrialInfo = true
+}) => {
+  const isPopular = plan.popular;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    "div",
+    {
+      className: `
+      relative bg-white rounded-lg shadow-lg overflow-hidden
+      ${isPopular ? "ring-2 ring-blue-500 ring-opacity-50" : "border border-gray-200"}
+      transition-transform duration-200 hover:scale-105
+    `,
+      children: [
+        isPopular && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "absolute top-0 left-0 right-0 bg-blue-500 text-white text-center py-2 text-sm font-medium", children: "Most Popular" }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: `p-6 ${isPopular ? "pt-12" : ""}`, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "text-center mb-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h3", { className: "text-xl font-semibold text-gray-900 mb-2", children: plan.name }),
+            plan.description && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "text-gray-600 text-sm mb-4", children: plan.description }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-3xl font-bold text-gray-900", children: formatPricingPlan(plan) }) }),
+            showTrialInfo && plan.trialPeriodDays && plan.trialPeriodDays > 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "text-sm text-green-600 font-medium", children: formatTrialPeriod(plan.trialPeriodDays) })
+          ] }),
+          showFeatures && plan.features && plan.features.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "mb-6", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("ul", { className: "space-y-3", children: plan.features.map((feature, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("li", { className: "flex items-start", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "svg",
+              {
+                className: "flex-shrink-0 w-5 h-5 text-green-500 mt-0.5 mr-3",
+                fill: "none",
+                stroke: "currentColor",
+                viewBox: "0 0 24 24",
+                children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  "path",
+                  {
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    strokeWidth: 2,
+                    d: "M5 13l4 4L19 7"
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-gray-700 text-sm", children: feature })
+          ] }, index)) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "mt-6", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            CheckoutButton,
+            {
+              priceId: plan.stripePriceId,
+              customerId,
+              customerEmail,
+              successUrl,
+              cancelUrl,
+              trialPeriodDays: plan.trialPeriodDays,
+              metadata: plan.metadata,
+              onSuccess: onCheckoutSuccess,
+              onError: onCheckoutError,
+              className: `
+              w-full justify-center py-3 px-4 text-base font-medium
+              ${isPopular ? "bg-blue-600 hover:bg-blue-700 text-white" : "bg-gray-100 hover:bg-gray-200 text-gray-900 border border-gray-300"}
+            `,
+              children: "Get Started"
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+};
+
+// src/web/components/PaymentForm.tsx
+var import_react3 = require("react");
+var import_react_stripe_js2 = require("@stripe/react-stripe-js");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var PaymentForm = ({
+  clientSecret,
+  customerId,
+  customerEmail,
+  amount,
+  currency = "usd",
+  description,
+  metadata,
+  onSuccess,
+  onError,
+  onLoading,
+  className = "",
+  showBillingDetails = true,
+  elementType = "payment"
+}) => {
+  const stripe = (0, import_react_stripe_js2.useStripe)();
+  const elements = (0, import_react_stripe_js2.useElements)();
+  const { isConfigured } = usePaymentsConfig();
+  const [loading, setLoading] = (0, import_react3.useState)(false);
+  const [email, setEmail] = (0, import_react3.useState)(customerEmail || "");
+  const [billingDetails, setBillingDetails] = (0, import_react3.useState)({
+    name: "",
+    email: customerEmail || "",
+    phone: "",
+    address: {
+      line1: "",
+      line2: "",
+      city: "",
+      state: "",
+      postal_code: "",
+      country: "US"
+    }
+  });
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    if (!stripe || !elements) {
+      const error = ERROR_MESSAGES.STRIPE_NOT_LOADED;
+      onError?.(error);
+      return;
+    }
+    if (!isConfigured) {
+      const error = ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED;
+      onError?.(error);
+      return;
+    }
+    if (showBillingDetails && email && !validateEmail(email)) {
+      onError?.("Please enter a valid email address");
+      return;
+    }
+    setLoading(true);
+    onLoading?.(true);
+    try {
+      let result;
+      if (elementType === "payment" && clientSecret) {
+        result = await stripe.confirmPayment({
+          elements,
+          confirmParams: {
+            return_url: window.location.href,
+            receipt_email: email || billingDetails.email
+          },
+          redirect: "if_required"
+        });
+      } else if (elementType === "card") {
+        const cardElement = elements.getElement(import_react_stripe_js2.CardElement);
+        if (!cardElement) {
+          throw new Error("Card element not found");
+        }
+        if (clientSecret) {
+          result = await stripe.confirmCardPayment(clientSecret, {
+            payment_method: {
+              card: cardElement,
+              billing_details: showBillingDetails ? {
+                name: billingDetails.name || void 0,
+                email: billingDetails.email || void 0,
+                phone: billingDetails.phone || void 0,
+                address: billingDetails.address.line1 ? billingDetails.address : void 0
+              } : void 0
+            }
+          });
+        } else if (amount) {
+          const response = await fetch("/api/payments/create-payment-intent", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({
+              amount,
+              currency,
+              customerId,
+              description,
+              metadata
+            })
+          });
+          if (!response.ok) {
+            throw new Error("Failed to create payment intent");
+          }
+          const { client_secret } = await response.json();
+          result = await stripe.confirmCardPayment(client_secret, {
+            payment_method: {
+              card: cardElement,
+              billing_details: showBillingDetails ? {
+                name: billingDetails.name || void 0,
+                email: billingDetails.email || void 0,
+                phone: billingDetails.phone || void 0,
+                address: billingDetails.address.line1 ? billingDetails.address : void 0
+              } : void 0
+            }
+          });
+        } else {
+          throw new Error("Either clientSecret or amount is required");
+        }
+      }
+      if (result?.error) {
+        throw new Error(result.error.message || ERROR_MESSAGES.PAYMENT_FAILED);
+      }
+      if (result?.paymentIntent?.status === "succeeded") {
+        onSuccess?.(result.paymentIntent);
+      }
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : ERROR_MESSAGES.PAYMENT_FAILED;
+      onError?.(errorMessage);
+      console.error("Payment error:", error);
+    } finally {
+      setLoading(false);
+      onLoading?.(false);
+    }
+  };
+  const cardElementOptions = {
+    style: {
+      base: {
+        fontSize: "16px",
+        color: "#424770",
+        "::placeholder": {
+          color: "#aab7c4"
+        }
+      },
+      invalid: {
+        color: "#9e2146"
+      }
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("form", { onSubmit: handleSubmit, className: `payment-form ${className}`, children: [
+    showBillingDetails && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "mb-6 space-y-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "label",
+          {
+            htmlFor: "email",
+            className: "block text-sm font-medium text-gray-700 mb-1",
+            children: "Email"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            type: "email",
+            id: "email",
+            value: email,
+            onChange: (e) => {
+              setEmail(e.target.value);
+              setBillingDetails((prev) => ({ ...prev, email: e.target.value }));
+            },
+            className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500",
+            placeholder: "your@email.com",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "label",
+          {
+            htmlFor: "name",
+            className: "block text-sm font-medium text-gray-700 mb-1",
+            children: "Full Name"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            type: "text",
+            id: "name",
+            value: billingDetails.name,
+            onChange: (e) => setBillingDetails((prev) => ({ ...prev, name: e.target.value })),
+            className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500",
+            placeholder: "John Doe"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "mb-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: "Payment Information" }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "p-3 border border-gray-300 rounded-md", children: elementType === "payment" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_stripe_js2.PaymentElement, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_stripe_js2.CardElement, { options: cardElementOptions }) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "button",
+      {
+        type: "submit",
+        disabled: !stripe || loading,
+        className: "w-full bg-blue-600 text-white py-3 px-4 rounded-md font-medium hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed transition-colors duration-200",
+        children: loading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+            "svg",
+            {
+              className: "animate-spin -ml-1 mr-3 h-4 w-4 text-white inline",
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                  "circle",
+                  {
+                    className: "opacity-25",
+                    cx: "12",
+                    cy: "12",
+                    r: "10",
+                    stroke: "currentColor",
+                    strokeWidth: "4"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                  "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"
+                  }
+                )
+              ]
+            }
+          ),
+          "Processing..."
+        ] }) : `Pay ${amount ? `$${(amount / 100).toFixed(2)}` : ""}`
+      }
+    )
+  ] });
+};
+
+// src/web/components/BillingPortal.tsx
+var import_react4 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var BillingPortal = ({
+  customerId,
+  returnUrl = typeof window !== "undefined" ? window.location.href : "/",
+  children,
+  className = "",
+  onSuccess,
+  onError,
+  onLoading
+}) => {
+  const { isConfigured } = usePaymentsConfig();
+  const [loading, setLoading] = (0, import_react4.useState)(false);
+  const handleOpenPortal = async () => {
+    if (!isConfigured) {
+      const error = ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED;
+      onError?.(error);
+      console.error(error);
+      return;
+    }
+    if (!validateStripeId(customerId, "customer")) {
+      const error = ERROR_MESSAGES.INVALID_CUSTOMER_ID;
+      onError?.(error);
+      console.error(error);
+      return;
+    }
+    setLoading(true);
+    onLoading?.(true);
+    try {
+      const response = await fetch("/api/payments/create-portal-session", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          customerId,
+          returnUrl
+        })
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({ error: "Network error" }));
+        throw new Error(errorData.error || "Failed to create portal session");
+      }
+      const { url } = await response.json();
+      if (!url) {
+        throw new Error("No portal URL returned from server");
+      }
+      window.location.href = url;
+      onSuccess?.();
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : "Failed to open billing portal";
+      onError?.(errorMessage);
+      console.error("Billing portal error:", error);
+    } finally {
+      setLoading(false);
+      onLoading?.(false);
+    }
+  };
+  const isDisabled = loading || !isConfigured || !customerId;
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "button",
+    {
+      onClick: handleOpenPortal,
+      disabled: isDisabled,
+      className: `
+        inline-flex items-center justify-center px-4 py-2 
+        border border-gray-300 text-sm font-medium rounded-md 
+        text-gray-700 bg-white hover:bg-gray-50 
+        focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500
+        disabled:opacity-50 disabled:cursor-not-allowed
+        transition-colors duration-200
+        ${className}
+      `,
+      "aria-label": "Manage billing",
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+          "svg",
+          {
+            className: "animate-spin -ml-1 mr-3 h-4 w-4 text-gray-700",
+            xmlns: "http://www.w3.org/2000/svg",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                "circle",
+                {
+                  className: "opacity-25",
+                  cx: "12",
+                  cy: "12",
+                  r: "10",
+                  stroke: "currentColor",
+                  strokeWidth: "4"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                "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"
+                }
+              )
+            ]
+          }
+        ),
+        "Loading..."
+      ] }) : children || /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+          "svg",
+          {
+            className: "w-4 h-4 mr-2",
+            fill: "none",
+            stroke: "currentColor",
+            viewBox: "0 0 24 24",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z"
+                }
+              )
+            ]
+          }
+        ),
+        "Manage Billing"
+      ] })
+    }
+  );
+};
+
+// src/web/providers/StripeProvider.tsx
+var import_react5 = __toESM(require("react"));
+var import_stripe_js = require("@stripe/stripe-js");
+var import_react_stripe_js3 = require("@stripe/react-stripe-js");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var stripePromise = null;
+var getStripe = (publishableKey) => {
+  if (!stripePromise) {
+    stripePromise = (0, import_stripe_js.loadStripe)(publishableKey);
+  }
+  return stripePromise;
+};
+var StripeProvider = ({
+  children,
+  options = {}
+}) => {
+  const { config, isConfigured } = usePaymentsConfig();
+  const stripe = import_react5.default.useMemo(() => {
+    if (!isConfigured) {
+      console.error(ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED);
+      return null;
+    }
+    return getStripe(config.publishableKey);
+  }, [config.publishableKey, isConfigured]);
+  if (!isConfigured) {
+    if (config.environment === "development") {
+      return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        "div",
+        {
+          style: {
+            padding: "20px",
+            backgroundColor: "#fee",
+            border: "1px solid #fcc",
+            borderRadius: "4px",
+            margin: "10px",
+            fontFamily: "monospace"
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("strong", { children: "Payments Provider Error:" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("br", {}),
+            ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED,
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("br", {}),
+            "Please check your PaymentsProvider configuration."
+          ]
+        }
+      );
+    }
+    return null;
+  }
+  const elementsOptions = {
+    fonts: options.fonts,
+    locale: options.locale,
+    appearance: {
+      theme: "stripe"
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_stripe_js3.Elements, { stripe, options: elementsOptions, children });
+};
+
+// src/web/hooks/useSubscription.ts
+var import_react6 = require("react");
+var useSubscription = (options = {}) => {
+  const { customerId, subscriptionId, autoFetch = true, onError } = options;
+  const [subscription, setSubscription] = (0, import_react6.useState)(null);
+  const [subscriptions, setSubscriptions] = (0, import_react6.useState)([]);
+  const [loading, setLoading] = (0, import_react6.useState)(false);
+  const [error, setError] = (0, import_react6.useState)(null);
+  const handleError = (0, import_react6.useCallback)(
+    (errorMessage) => {
+      setError(errorMessage);
+      onError?.(errorMessage);
+      console.error("Subscription error:", errorMessage);
+    },
+    [onError]
+  );
+  const fetchSubscription = (0, import_react6.useCallback)(
+    async (id) => {
+      if (!validateStripeId(id, "subscription")) {
+        handleError("Invalid subscription ID");
+        return null;
+      }
+      try {
+        const response = await fetch(`/api/payments/subscription/${id}`);
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(
+            errorData.error || ERROR_MESSAGES.SUBSCRIPTION_NOT_FOUND
+          );
+        }
+        const data = await response.json();
+        return data;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : ERROR_MESSAGES.SUBSCRIPTION_NOT_FOUND;
+        handleError(errorMessage);
+        return null;
+      }
+    },
+    [handleError]
+  );
+  const fetchCustomerSubscriptions = (0, import_react6.useCallback)(
+    async (id) => {
+      if (!validateStripeId(id, "customer")) {
+        handleError("Invalid customer ID");
+        return [];
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/customer/${id}/subscriptions`
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || ERROR_MESSAGES.CUSTOMER_NOT_FOUND);
+        }
+        const data = await response.json();
+        return data.subscriptions || [];
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : ERROR_MESSAGES.CUSTOMER_NOT_FOUND;
+        handleError(errorMessage);
+        return [];
+      }
+    },
+    [handleError]
+  );
+  const refetch = (0, import_react6.useCallback)(async () => {
+    if (!customerId && !subscriptionId) {
+      handleError("Either customerId or subscriptionId is required");
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      if (subscriptionId) {
+        const sub = await fetchSubscription(subscriptionId);
+        setSubscription(sub);
+      }
+      if (customerId) {
+        const subs = await fetchCustomerSubscriptions(customerId);
+        setSubscriptions(subs);
+        if (!subscriptionId && subs.length > 0) {
+          const activeSub = subs.find((s) => s.status === "active") || subs[0];
+          setSubscription(activeSub);
+        }
+      }
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    customerId,
+    subscriptionId,
+    fetchSubscription,
+    fetchCustomerSubscriptions,
+    handleError
+  ]);
+  const cancel = (0, import_react6.useCallback)(
+    async (targetSubscriptionId) => {
+      const idToCancel = targetSubscriptionId || subscriptionId;
+      if (!idToCancel) {
+        handleError("Subscription ID is required to cancel");
+        return false;
+      }
+      if (!validateStripeId(idToCancel, "subscription")) {
+        handleError("Invalid subscription ID");
+        return false;
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/subscription/${idToCancel}/cancel`,
+          {
+            method: "POST",
+            headers: { "Content-Type": "application/json" }
+          }
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to cancel subscription");
+        }
+        await refetch();
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to cancel subscription";
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [subscriptionId, refetch, handleError]
+  );
+  const reactivate = (0, import_react6.useCallback)(
+    async (targetSubscriptionId) => {
+      const idToReactivate = targetSubscriptionId || subscriptionId;
+      if (!idToReactivate) {
+        handleError("Subscription ID is required to reactivate");
+        return false;
+      }
+      if (!validateStripeId(idToReactivate, "subscription")) {
+        handleError("Invalid subscription ID");
+        return false;
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/subscription/${idToReactivate}/reactivate`,
+          {
+            method: "POST",
+            headers: { "Content-Type": "application/json" }
+          }
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(
+            errorData.error || "Failed to reactivate subscription"
+          );
+        }
+        await refetch();
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to reactivate subscription";
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [subscriptionId, refetch, handleError]
+  );
+  const updatePaymentMethod = (0, import_react6.useCallback)(
+    async (targetSubscriptionId, paymentMethodId) => {
+      if (!validateStripeId(targetSubscriptionId, "subscription")) {
+        handleError("Invalid subscription ID");
+        return false;
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/subscription/${targetSubscriptionId}/payment-method`,
+          {
+            method: "PUT",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ paymentMethodId })
+          }
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to update payment method");
+        }
+        await refetch();
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to update payment method";
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [refetch, handleError]
+  );
+  (0, import_react6.useEffect)(() => {
+    if (autoFetch && (customerId || subscriptionId)) {
+      refetch();
+    }
+  }, [autoFetch, customerId, subscriptionId, refetch]);
+  return {
+    subscription,
+    subscriptions,
+    loading,
+    error,
+    refetch,
+    cancel,
+    reactivate,
+    updatePaymentMethod
+  };
+};
+
+// src/web/hooks/useCheckout.ts
+var import_react7 = require("react");
+var import_react_stripe_js4 = require("@stripe/react-stripe-js");
+var useCheckout = (options = {}) => {
+  const { onSuccess, onError, onLoading } = options;
+  const stripe = (0, import_react_stripe_js4.useStripe)();
+  const { isConfigured } = usePaymentsConfig();
+  const [loading, setLoading] = (0, import_react7.useState)(false);
+  const [error, setError] = (0, import_react7.useState)(null);
+  const handleError = (0, import_react7.useCallback)(
+    (errorMessage) => {
+      setError(errorMessage);
+      onError?.(errorMessage);
+      console.error("Checkout error:", errorMessage);
+    },
+    [onError]
+  );
+  const validateCheckoutParams = (0, import_react7.useCallback)(
+    (params) => {
+      if (!params.priceId) {
+        return "Price ID is required";
+      }
+      if (!validateStripeId(params.priceId, "price")) {
+        return ERROR_MESSAGES.INVALID_PRICE_ID;
+      }
+      if (params.customerId && !validateStripeId(params.customerId, "customer")) {
+        return ERROR_MESSAGES.INVALID_CUSTOMER_ID;
+      }
+      if (params.customerEmail && !validateEmail(params.customerEmail)) {
+        return "Invalid customer email";
+      }
+      if (!params.successUrl) {
+        return "Success URL is required";
+      }
+      if (!params.cancelUrl) {
+        return "Cancel URL is required";
+      }
+      return null;
+    },
+    []
+  );
+  const createCheckoutSession2 = (0, import_react7.useCallback)(
+    async (params) => {
+      if (!isConfigured) {
+        handleError(ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED);
+        return null;
+      }
+      const validationError = validateCheckoutParams(params);
+      if (validationError) {
+        handleError(validationError);
+        return null;
+      }
+      setLoading(true);
+      setError(null);
+      onLoading?.(true);
+      try {
+        const response = await fetch("/api/payments/create-checkout-session", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify(params)
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || ERROR_MESSAGES.CHECKOUT_FAILED);
+        }
+        const { sessionId } = await response.json();
+        if (!sessionId) {
+          throw new Error("No session ID returned from server");
+        }
+        onSuccess?.(sessionId);
+        return sessionId;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : ERROR_MESSAGES.CHECKOUT_FAILED;
+        handleError(errorMessage);
+        return null;
+      } finally {
+        setLoading(false);
+        onLoading?.(false);
+      }
+    },
+    [isConfigured, validateCheckoutParams, handleError, onSuccess, onLoading]
+  );
+  const redirectToCheckout2 = (0, import_react7.useCallback)(
+    async (params) => {
+      if (!stripe) {
+        handleError(ERROR_MESSAGES.STRIPE_NOT_LOADED);
+        return false;
+      }
+      const sessionId = await createCheckoutSession2(params);
+      if (!sessionId) {
+        return false;
+      }
+      try {
+        const result = await stripe.redirectToCheckout({ sessionId });
+        if (result.error) {
+          throw new Error(
+            result.error.message || ERROR_MESSAGES.CHECKOUT_FAILED
+          );
+        }
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : ERROR_MESSAGES.CHECKOUT_FAILED;
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [stripe, createCheckoutSession2, handleError]
+  );
+  const createPaymentIntent2 = (0, import_react7.useCallback)(
+    async (params) => {
+      if (!isConfigured) {
+        handleError(ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED);
+        return null;
+      }
+      if (params.amount <= 0) {
+        handleError("Amount must be greater than 0");
+        return null;
+      }
+      if (params.customerId && !validateStripeId(params.customerId, "customer")) {
+        handleError(ERROR_MESSAGES.INVALID_CUSTOMER_ID);
+        return null;
+      }
+      setLoading(true);
+      setError(null);
+      onLoading?.(true);
+      try {
+        const response = await fetch("/api/payments/create-payment-intent", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify(params)
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to create payment intent");
+        }
+        const { client_secret } = await response.json();
+        if (!client_secret) {
+          throw new Error("No client secret returned from server");
+        }
+        return client_secret;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to create payment intent";
+        handleError(errorMessage);
+        return null;
+      } finally {
+        setLoading(false);
+        onLoading?.(false);
+      }
+    },
+    [isConfigured, handleError, onLoading]
+  );
+  return {
+    loading,
+    error,
+    createCheckoutSession: createCheckoutSession2,
+    redirectToCheckout: redirectToCheckout2,
+    createPaymentIntent: createPaymentIntent2
+  };
+};
+
+// src/web/hooks/useCustomer.ts
+var import_react8 = require("react");
+var useCustomer = (options = {}) => {
+  const { customerId, autoFetch = true, onError } = options;
+  const [customer, setCustomer] = (0, import_react8.useState)(null);
+  const [paymentMethods, setPaymentMethods] = (0, import_react8.useState)([]);
+  const [loading, setLoading] = (0, import_react8.useState)(false);
+  const [error, setError] = (0, import_react8.useState)(null);
+  const handleError = (0, import_react8.useCallback)(
+    (errorMessage) => {
+      setError(errorMessage);
+      onError?.(errorMessage);
+      console.error("Customer error:", errorMessage);
+    },
+    [onError]
+  );
+  const fetchCustomer = (0, import_react8.useCallback)(
+    async (id) => {
+      if (!validateStripeId(id, "customer")) {
+        handleError("Invalid customer ID");
+        return null;
+      }
+      try {
+        const response = await fetch(`/api/payments/customer/${id}`);
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || ERROR_MESSAGES.CUSTOMER_NOT_FOUND);
+        }
+        const data = await response.json();
+        return data;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : ERROR_MESSAGES.CUSTOMER_NOT_FOUND;
+        handleError(errorMessage);
+        return null;
+      }
+    },
+    [handleError]
+  );
+  const refetch = (0, import_react8.useCallback)(async () => {
+    if (!customerId) {
+      handleError("Customer ID is required");
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      const customerData = await fetchCustomer(customerId);
+      setCustomer(customerData);
+    } finally {
+      setLoading(false);
+    }
+  }, [customerId, fetchCustomer, handleError]);
+  const createCustomer = (0, import_react8.useCallback)(
+    async (params) => {
+      if (!validateEmail(params.email)) {
+        handleError("Invalid email address");
+        return null;
+      }
+      setLoading(true);
+      setError(null);
+      try {
+        const response = await fetch("/api/payments/customer", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(params)
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to create customer");
+        }
+        const customerData = await response.json();
+        setCustomer(customerData);
+        return customerData;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to create customer";
+        handleError(errorMessage);
+        return null;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [handleError]
+  );
+  const updateCustomer = (0, import_react8.useCallback)(
+    async (params) => {
+      if (!customerId) {
+        handleError("Customer ID is required");
+        return false;
+      }
+      if (params.email && !validateEmail(params.email)) {
+        handleError("Invalid email address");
+        return false;
+      }
+      setLoading(true);
+      setError(null);
+      try {
+        const response = await fetch(`/api/payments/customer/${customerId}`, {
+          method: "PUT",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(params)
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to update customer");
+        }
+        await refetch();
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to update customer";
+        handleError(errorMessage);
+        return false;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [customerId, refetch, handleError]
+  );
+  const deleteCustomer = (0, import_react8.useCallback)(async () => {
+    if (!customerId) {
+      handleError("Customer ID is required");
+      return false;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      const response = await fetch(`/api/payments/customer/${customerId}`, {
+        method: "DELETE"
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({ error: "Network error" }));
+        throw new Error(errorData.error || "Failed to delete customer");
+      }
+      setCustomer(null);
+      setPaymentMethods([]);
+      return true;
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to delete customer";
+      handleError(errorMessage);
+      return false;
+    } finally {
+      setLoading(false);
+    }
+  }, [customerId, handleError]);
+  const fetchPaymentMethods = (0, import_react8.useCallback)(async () => {
+    if (!customerId) {
+      handleError("Customer ID is required");
+      return [];
+    }
+    try {
+      const response = await fetch(
+        `/api/payments/customer/${customerId}/payment-methods`
+      );
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({ error: "Network error" }));
+        throw new Error(errorData.error || "Failed to fetch payment methods");
+      }
+      const data = await response.json();
+      const methods = data.paymentMethods || [];
+      setPaymentMethods(methods);
+      return methods;
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to fetch payment methods";
+      handleError(errorMessage);
+      return [];
+    }
+  }, [customerId, handleError]);
+  const addPaymentMethod = (0, import_react8.useCallback)(
+    async (paymentMethodId) => {
+      if (!customerId) {
+        handleError("Customer ID is required");
+        return false;
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/customer/${customerId}/payment-methods`,
+          {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ paymentMethodId })
+          }
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to add payment method");
+        }
+        await fetchPaymentMethods();
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to add payment method";
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [customerId, fetchPaymentMethods, handleError]
+  );
+  const removePaymentMethod = (0, import_react8.useCallback)(
+    async (paymentMethodId) => {
+      if (!customerId) {
+        handleError("Customer ID is required");
+        return false;
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/customer/${customerId}/payment-methods/${paymentMethodId}`,
+          {
+            method: "DELETE"
+          }
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(errorData.error || "Failed to remove payment method");
+        }
+        await fetchPaymentMethods();
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to remove payment method";
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [customerId, fetchPaymentMethods, handleError]
+  );
+  const setDefaultPaymentMethod = (0, import_react8.useCallback)(
+    async (paymentMethodId) => {
+      if (!customerId) {
+        handleError("Customer ID is required");
+        return false;
+      }
+      try {
+        const response = await fetch(
+          `/api/payments/customer/${customerId}/default-payment-method`,
+          {
+            method: "PUT",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ paymentMethodId })
+          }
+        );
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({ error: "Network error" }));
+          throw new Error(
+            errorData.error || "Failed to set default payment method"
+          );
+        }
+        await Promise.all([refetch(), fetchPaymentMethods()]);
+        return true;
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : "Failed to set default payment method";
+        handleError(errorMessage);
+        return false;
+      }
+    },
+    [customerId, refetch, fetchPaymentMethods, handleError]
+  );
+  (0, import_react8.useEffect)(() => {
+    if (autoFetch && customerId) {
+      refetch();
+      fetchPaymentMethods();
+    }
+  }, [autoFetch, customerId, refetch, fetchPaymentMethods]);
+  return {
+    customer,
+    paymentMethods,
+    loading,
+    error,
+    refetch,
+    createCustomer,
+    updateCustomer,
+    deleteCustomer,
+    fetchPaymentMethods,
+    addPaymentMethod,
+    removePaymentMethod,
+    setDefaultPaymentMethod
+  };
+};
+
+// src/web/utils/stripe-web.ts
+var import_stripe_js2 = require("@stripe/stripe-js");
+var stripeInstance = null;
+var getStripe2 = (publishableKey) => {
+  if (!stripeInstance) {
+    stripeInstance = (0, import_stripe_js2.loadStripe)(publishableKey);
+  }
+  return stripeInstance;
+};
+var initializeStripe = async (config) => {
+  if (!config.publishableKey) {
+    console.error(ERROR_MESSAGES.PROVIDER_NOT_CONFIGURED);
+    return null;
+  }
+  try {
+    const stripe = await getStripe2(config.publishableKey);
+    return stripe;
+  } catch (error) {
+    console.error("Failed to initialize Stripe:", error);
+    return null;
+  }
+};
+var createCheckoutSession = async (params) => {
+  try {
+    const response = await fetch("/api/payments/create-checkout-session", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(params)
+    });
+    if (!response.ok) {
+      const errorData = await response.json().catch(() => ({ error: "Network error" }));
+      return { error: errorData.error || ERROR_MESSAGES.CHECKOUT_FAILED };
+    }
+    const data = await response.json();
+    return { sessionId: data.sessionId };
+  } catch (error) {
+    return {
+      error: error instanceof Error ? error.message : ERROR_MESSAGES.CHECKOUT_FAILED
+    };
+  }
+};
+var createPaymentIntent = async (params) => {
+  try {
+    const response = await fetch("/api/payments/create-payment-intent", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(params)
+    });
+    if (!response.ok) {
+      const errorData = await response.json().catch(() => ({ error: "Network error" }));
+      return { error: errorData.error || "Failed to create payment intent" };
+    }
+    const data = await response.json();
+    return { clientSecret: data.client_secret };
+  } catch (error) {
+    return {
+      error: error instanceof Error ? error.message : "Failed to create payment intent"
+    };
+  }
+};
+var createPortalSession = async (params) => {
+  try {
+    const response = await fetch("/api/payments/create-portal-session", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(params)
+    });
+    if (!response.ok) {
+      const errorData = await response.json().catch(() => ({ error: "Network error" }));
+      return { error: errorData.error || "Failed to create portal session" };
+    }
+    const data = await response.json();
+    return { url: data.url };
+  } catch (error) {
+    return {
+      error: error instanceof Error ? error.message : "Failed to create portal session"
+    };
+  }
+};
+var confirmPayment = async (stripe, elements, clientSecret, options = {}) => {
+  try {
+    const result = await stripe.confirmPayment({
+      elements,
+      clientSecret,
+      confirmParams: {
+        return_url: options.returnUrl || window.location.href,
+        receipt_email: options.receiptEmail
+      },
+      redirect: "if_required"
+    });
+    if (result.error) {
+      return { success: false, error: result.error.message };
+    }
+    if (result.paymentIntent?.status === "succeeded") {
+      return { success: true, paymentIntent: result.paymentIntent };
+    }
+    return { success: false, error: "Payment was not completed" };
+  } catch (error) {
+    return {
+      success: false,
+      error: error instanceof Error ? error.message : ERROR_MESSAGES.PAYMENT_FAILED
+    };
+  }
+};
+var redirectToCheckout = async (stripe, sessionId) => {
+  try {
+    const result = await stripe.redirectToCheckout({ sessionId });
+    if (result.error) {
+      return { success: false, error: result.error.message };
+    }
+    return { success: true };
+  } catch (error) {
+    return {
+      success: false,
+      error: error instanceof Error ? error.message : ERROR_MESSAGES.CHECKOUT_FAILED
+    };
+  }
+};
+var formatStripeError = (error) => {
+  if (typeof error === "string") {
+    return error;
+  }
+  if (error?.message) {
+    return error.message;
+  }
+  if (error?.code) {
+    const errorMessages = {
+      card_declined: "Your card was declined.",
+      expired_card: "Your card has expired.",
+      incorrect_cvc: "Your card's security code is incorrect.",
+      processing_error: "An error occurred while processing your card.",
+      incorrect_number: "Your card number is incorrect."
+    };
+    return errorMessages[error.code] || `Payment failed: ${error.code}`;
+  }
+  return "An unexpected error occurred.";
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BillingPortal,
+  CheckoutButton,
+  PaymentForm,
+  PricingTable,
+  StripeProvider,
+  confirmPayment,
+  createCheckoutSession,
+  createPaymentIntent,
+  createPortalSession,
+  formatStripeError,
+  getStripe,
+  initializeStripe,
+  redirectToCheckout,
+  useCheckout,
+  useCustomer,
+  useSubscription
+});