@solvapay/react 1.0.9-preview.1 → 1.0.9

package/dist/chunk-HWVJL5X6.js

@@ -0,0 +1,429 @@
+import {
+  BalanceBadge,
+  CancelPlanButton,
+  Slot,
+  UsageMeter,
+  composeEventHandlers,
+  createHttpTransport,
+  createTransportCacheKey,
+  formatPrice,
+  interpolate,
+  useCopy,
+  usePurchase,
+  usePurchaseStatus,
+  useSolvaPay,
+  useTransport
+} from "./chunk-37R5NZGF.js";
+
+// src/hooks/usePaymentMethod.ts
+import { useCallback, useEffect, useState } from "react";
+var paymentMethodCache = /* @__PURE__ */ new Map();
+var CACHE_DURATION = 5 * 60 * 1e3;
+function cacheKeyFor(config) {
+  return createTransportCacheKey(
+    config,
+    config?.api?.getPaymentMethod || "/api/payment-method"
+  );
+}
+async function fetchPaymentMethod(config) {
+  const transport = config?.transport ?? createHttpTransport(config);
+  if (!transport.getPaymentMethod) return null;
+  return transport.getPaymentMethod();
+}
+function usePaymentMethod() {
+  const { _config } = useSolvaPay();
+  const key = cacheKeyFor(_config);
+  const [paymentMethod, setPaymentMethod] = useState(
+    () => paymentMethodCache.get(key)?.paymentMethod ?? null
+  );
+  const [loading, setLoading] = useState(() => {
+    const cached = paymentMethodCache.get(key);
+    return !cached || !cached.paymentMethod && !cached.promise;
+  });
+  const [error, setError] = useState(null);
+  const load = useCallback(
+    async (force = false) => {
+      const cached = paymentMethodCache.get(key);
+      const now = Date.now();
+      if (!force && cached?.paymentMethod && now - cached.timestamp < CACHE_DURATION) {
+        setPaymentMethod(cached.paymentMethod);
+        setLoading(false);
+        setError(null);
+        return;
+      }
+      if (!force && cached?.promise) {
+        try {
+          setLoading(true);
+          const pm = await cached.promise;
+          setPaymentMethod(pm);
+          setError(null);
+        } catch (err) {
+          setError(err instanceof Error ? err : new Error("Failed to load payment method"));
+        } finally {
+          setLoading(false);
+        }
+        return;
+      }
+      try {
+        setLoading(true);
+        setError(null);
+        const promise = fetchPaymentMethod(_config);
+        paymentMethodCache.set(key, {
+          paymentMethod: cached?.paymentMethod ?? null,
+          promise,
+          timestamp: now
+        });
+        const pm = await promise;
+        if (pm === null) {
+          paymentMethodCache.set(key, {
+            paymentMethod: cached?.paymentMethod ?? null,
+            promise: null,
+            timestamp: cached?.timestamp ?? now
+          });
+          setPaymentMethod(cached?.paymentMethod ?? null);
+          setLoading(false);
+          return;
+        }
+        paymentMethodCache.set(key, { paymentMethod: pm, promise: null, timestamp: now });
+        setPaymentMethod(pm);
+      } catch (err) {
+        paymentMethodCache.delete(key);
+        setError(err instanceof Error ? err : new Error("Failed to load payment method"));
+        setPaymentMethod(null);
+      } finally {
+        setLoading(false);
+      }
+    },
+    [_config, key]
+  );
+  useEffect(() => {
+    load();
+  }, [load]);
+  return {
+    paymentMethod,
+    loading,
+    error,
+    refetch: () => load(true)
+  };
+}
+
+// src/components/LaunchCustomerPortalButton.tsx
+import { forwardRef, useEffect as useEffect2, useRef, useState as useState2 } from "react";
+
+// src/components/ExternalLinkGlyph.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var ExternalLinkGlyph = ({ className }) => {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      className: `solvapay-mcp-external-glyph${className ? ` ${className}` : ""}`,
+      width: "0.9em",
+      height: "0.9em",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M21 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h6" }),
+        /* @__PURE__ */ jsx("path", { d: "M15 3h6v6" }),
+        /* @__PURE__ */ jsx("path", { d: "m10 14 11-11" })
+      ]
+    }
+  );
+};
+
+// src/components/LaunchCustomerPortalButton.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var LaunchCustomerPortalButton = forwardRef(function LaunchCustomerPortalButton2({
+  children,
+  onLaunch,
+  onError,
+  onClick,
+  loadingClassName,
+  errorClassName,
+  asChild,
+  ...rest
+}, forwardedRef) {
+  const transport = useTransport();
+  const copy = useCopy();
+  const [state, setState] = useState2({ status: "loading" });
+  const onErrorRef = useRef(onError);
+  useEffect2(() => {
+    onErrorRef.current = onError;
+  }, [onError]);
+  useEffect2(() => {
+    let cancelled = false;
+    transport.createCustomerSession().then(({ customerUrl }) => {
+      if (cancelled) return;
+      setState({ status: "ready", href: customerUrl });
+    }).catch((err) => {
+      if (cancelled) return;
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ status: "error", message: error.message });
+      onErrorRef.current?.(error);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [transport]);
+  if (state.status === "ready") {
+    const label = children ?? copy.customerPortal.launchButton;
+    const labelText = typeof label === "string" ? label : copy.customerPortal.launchButton;
+    const readyProps = {
+      href: state.href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      "data-solvapay-launch-customer-portal": "",
+      "data-state": "ready",
+      "aria-label": `${labelText} (opens in a new tab)`,
+      onClick: composeEventHandlers(onClick, () => {
+        onLaunch?.(state.href);
+      }),
+      ...rest
+    };
+    if (asChild) {
+      return (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        /* @__PURE__ */ jsx2(Slot, { ref: forwardedRef, ...readyProps, children: label })
+      );
+    }
+    return /* @__PURE__ */ jsxs2("a", { ref: forwardedRef, ...readyProps, children: [
+      label,
+      /* @__PURE__ */ jsx2(ExternalLinkGlyph, {})
+    ] });
+  }
+  if (state.status === "error") {
+    return /* @__PURE__ */ jsx2(
+      "button",
+      {
+        type: "button",
+        className: errorClassName,
+        "data-solvapay-launch-customer-portal": "",
+        "data-state": "error",
+        "aria-disabled": true,
+        disabled: true,
+        children: children ?? copy.customerPortal.launchButton
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx2(
+    "button",
+    {
+      type: "button",
+      className: loadingClassName,
+      "data-solvapay-launch-customer-portal": "",
+      "data-state": "loading",
+      "aria-busy": true,
+      "aria-disabled": true,
+      disabled: true,
+      children: copy.customerPortal.loadingLabel
+    }
+  );
+});
+
+// src/components/UpdatePaymentMethodButton.tsx
+import { forwardRef as forwardRef2 } from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var UpdatePaymentMethodButton = forwardRef2(function UpdatePaymentMethodButton2({ mode = "portal", children, ...rest }, forwardedRef) {
+  const copy = useCopy();
+  if (mode !== "portal") {
+    throw new Error(
+      `<UpdatePaymentMethodButton mode="${mode}"> is not implemented yet \u2014 use mode="portal" or omit the prop.`
+    );
+  }
+  return /* @__PURE__ */ jsx3(
+    LaunchCustomerPortalButton,
+    {
+      ref: forwardedRef,
+      "data-solvapay-update-payment-method": "",
+      ...rest,
+      children: children ?? copy.currentPlan.updatePaymentButton
+    }
+  );
+});
+
+// src/components/CurrentPlanCard.tsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function PlanTypeLine({
+  purchase,
+  formatDate,
+  className
+}) {
+  const copy = useCopy();
+  const planType = purchase.planSnapshot?.planType ?? "one-time";
+  if (planType === "recurring" || purchase.isRecurring) {
+    const date2 = formatDate(purchase.nextBillingDate);
+    if (!date2) return null;
+    return /* @__PURE__ */ jsx4(
+      "span",
+      {
+        className,
+        "data-solvapay-current-plan-next-billing": "",
+        children: interpolate(copy.currentPlan.nextBilling, { date: date2 })
+      }
+    );
+  }
+  if (planType === "usage-based") {
+    return null;
+  }
+  const date = formatDate(purchase.endDate);
+  return /* @__PURE__ */ jsx4("span", { className, "data-solvapay-current-plan-expires": "", children: date ? interpolate(copy.currentPlan.expiresOn, { date }) : copy.currentPlan.validIndefinitely });
+}
+function PaymentMethodLine({
+  paymentMethod,
+  className
+}) {
+  const copy = useCopy();
+  if (paymentMethod.kind === "none") {
+    return /* @__PURE__ */ jsx4("span", { className, "data-solvapay-current-plan-payment-method": "none", children: copy.currentPlan.noPaymentMethod });
+  }
+  const brandDisplay = paymentMethod.brand.charAt(0).toUpperCase() + paymentMethod.brand.slice(1);
+  const label = interpolate(copy.currentPlan.paymentMethod, {
+    brand: brandDisplay,
+    last4: paymentMethod.last4
+  });
+  const expires = interpolate(copy.currentPlan.paymentMethodExpires, {
+    month: String(paymentMethod.expMonth).padStart(2, "0"),
+    year: paymentMethod.expYear
+  });
+  return /* @__PURE__ */ jsxs3("span", { className, "data-solvapay-current-plan-payment-method": "card", children: [
+    label,
+    ", ",
+    expires
+  ] });
+}
+var CurrentPlanCard = ({
+  hidePaymentMethod,
+  hideCancelButton,
+  hideUpdatePaymentButton,
+  hideUsageMeter,
+  classNames: overrides,
+  className
+}) => {
+  const copy = useCopy();
+  const { activePurchase } = usePurchase();
+  const { formatDate } = usePurchaseStatus();
+  const { paymentMethod } = usePaymentMethod();
+  if (!activePurchase) return null;
+  const planType = activePurchase.planSnapshot?.planType ?? "one-time";
+  const isUsageBased = planType === "usage-based";
+  const amount = activePurchase.originalAmount ?? activePurchase.amount ?? 0;
+  const currency = activePurchase.currency ?? "usd";
+  const cycleKey = activePurchase.billingCycle;
+  const intervalLabel = cycleKey ? copy.currentPlan.cycleUnit[cycleKey] ?? cycleKey : void 0;
+  const priceLabel = formatPrice(amount, currency, {
+    interval: intervalLabel
+  });
+  const planName = activePurchase.planSnapshot?.name ?? activePurchase.productName;
+  const productContext = activePurchase.productName && activePurchase.productName !== planName ? activePurchase.productName : null;
+  const rootClass = [
+    "solvapay-current-plan-card",
+    overrides?.root,
+    className
+  ].filter(Boolean).join(" ");
+  const shouldShowPaymentMethod = !hidePaymentMethod && paymentMethod !== null;
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: rootClass,
+      "data-solvapay-current-plan-card": "",
+      "data-plan-type": planType,
+      "data-solvapay-current-plan-ref": activePurchase.planRef ?? void 0,
+      children: [
+        /* @__PURE__ */ jsx4(
+          "h2",
+          {
+            className: overrides?.heading ?? "solvapay-current-plan-heading",
+            "data-solvapay-current-plan-heading": "",
+            children: copy.currentPlan.heading
+          }
+        ),
+        productContext && /* @__PURE__ */ jsx4(
+          "div",
+          {
+            className: overrides?.productContext ?? "solvapay-current-plan-product-context",
+            "data-solvapay-current-plan-product-context": "",
+            children: productContext
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          "div",
+          {
+            className: overrides?.planName ?? "solvapay-current-plan-name",
+            "data-solvapay-current-plan-name": "",
+            children: planName
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          "div",
+          {
+            className: overrides?.price ?? "solvapay-current-plan-price",
+            "data-solvapay-current-plan-price": "",
+            children: priceLabel
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          PlanTypeLine,
+          {
+            purchase: activePurchase,
+            formatDate,
+            className: overrides?.dateLine ?? "solvapay-current-plan-date-line"
+          }
+        ),
+        isUsageBased && !hideUsageMeter && /* @__PURE__ */ jsx4(
+          "div",
+          {
+            className: overrides?.usageMeter ?? "solvapay-current-plan-usage-meter",
+            "data-solvapay-current-plan-usage-meter": "",
+            children: /* @__PURE__ */ jsxs3(UsageMeter.Root, { children: [
+              /* @__PURE__ */ jsx4(UsageMeter.Label, {}),
+              /* @__PURE__ */ jsx4(UsageMeter.Bar, {}),
+              /* @__PURE__ */ jsx4(UsageMeter.Percentage, {}),
+              /* @__PURE__ */ jsx4(UsageMeter.ResetsIn, {}),
+              /* @__PURE__ */ jsx4(UsageMeter.Loading, {})
+            ] })
+          }
+        ),
+        isUsageBased && /* @__PURE__ */ jsx4(
+          "div",
+          {
+            className: overrides?.balanceLine ?? "solvapay-current-plan-balance-line",
+            "data-solvapay-current-plan-balance-line": "",
+            children: /* @__PURE__ */ jsx4(BalanceBadge, {})
+          }
+        ),
+        shouldShowPaymentMethod && paymentMethod && /* @__PURE__ */ jsx4(
+          PaymentMethodLine,
+          {
+            paymentMethod,
+            className: overrides?.paymentMethod ?? "solvapay-current-plan-payment-method"
+          }
+        ),
+        /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            className: overrides?.actions ?? "solvapay-current-plan-actions",
+            "data-solvapay-current-plan-actions": "",
+            children: [
+              !hideUpdatePaymentButton && /* @__PURE__ */ jsx4(UpdatePaymentMethodButton, {}),
+              !hideCancelButton && /* @__PURE__ */ jsx4(CancelPlanButton, {})
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+
+export {
+  paymentMethodCache,
+  usePaymentMethod,
+  ExternalLinkGlyph,
+  LaunchCustomerPortalButton,
+  UpdatePaymentMethodButton,
+  CurrentPlanCard
+};

package/dist/chunk-MLKGABMK.js

@@ -0,0 +1,9 @@
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+export {
+  __export
+};