@sudobility/building_blocks 0.0.154 → 0.0.156

package/dist/index.js

@@ -1,9 +1,4 @@
 import { b, a, S, u } from "./SafeSubscriptionContext-CNuEKeqJ.js";
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import React, { useState, useRef, useMemo, useCallback, useEffect } from "react";
-import { SubscriptionLayout, SubscriptionTile, SegmentedControl } from "@sudobility/subscription-components";
-import { useSubscriptionPeriods, useSubscriptionForPeriod, useSubscribable, useUserSubscription, refreshSubscription } from "@sudobility/subscription_lib";
-import { TopbarProvider, Topbar, TopbarLeft, TopbarNavigation, TopbarLogo, Logo, TopbarCenter, TopbarRight, TopbarActions, TopbarMobileContent, Footer, FooterCompact, FooterCompactLeft, FooterVersion, FooterCopyright, FooterCompactRight, FooterGrid, FooterLinkSection, FooterLink, FooterBottom, FooterBrand, FooterSocialLinks, LayoutProvider, AspectFitView, Label, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, MasterListItem, Section, MasterDetailLayout } from "@sudobility/components";
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
 import i18n from "i18next";
@@ -11,6 +6,9 @@ import { default as default2 } from "i18next";
 import { initReactI18next } from "react-i18next";
 import Backend from "i18next-http-backend";
 import LanguageDetector from "i18next-browser-languagedetector";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import React, { useState, useRef, useMemo, useCallback, useEffect } from "react";
+import { TopbarProvider, Topbar, TopbarLeft, TopbarNavigation, TopbarLogo, Logo, TopbarCenter, TopbarRight, TopbarActions, TopbarMobileContent, Footer, FooterCompact, FooterCompactLeft, FooterVersion, FooterCopyright, FooterCompactRight, FooterGrid, FooterLinkSection, FooterLink, FooterBottom, FooterBrand, FooterSocialLinks, LayoutProvider, AspectFitView, Label, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, MasterListItem, Section, MasterDetailLayout } from "@sudobility/components";
 import { ChevronDownIcon, CalendarDaysIcon, PaintBrushIcon, LanguageIcon, ChevronRightIcon, EnvelopeIcon, DocumentTextIcon, CogIcon, HomeIcon } from "@heroicons/react/24/outline";
 import { GRADIENT_CLASSES, textVariants } from "@sudobility/design";
 import { cva } from "class-variance-authority";
@@ -2023,728 +2021,6 @@ function LoginPage({
     }
   );
 }
-function AppSubscriptionsPage({
-  offerId,
-  rateLimitsConfig,
-  labels,
-  formatters,
-  onPurchase,
-  onRestore,
-  onPurchaseSuccess,
-  onRestoreSuccess,
-  onError,
-  onWarning,
-  onTrack
-}) {
-  const {
-    periods,
-    isLoading: periodsLoading,
-    error: periodsError
-  } = useSubscriptionPeriods(offerId);
-  const [selectedPeriod, setSelectedPeriod] = useState("monthly");
-  useEffect(() => {
-    if (periods.length > 0 && !periods.includes(selectedPeriod)) {
-      setSelectedPeriod(periods[0]);
-    }
-  }, [periods, selectedPeriod]);
-  const {
-    packages,
-    isLoading: packagesLoading,
-    error: packagesError
-  } = useSubscriptionForPeriod(offerId, selectedPeriod);
-  const {
-    subscribablePackageIds,
-    isLoading: subscribableLoading,
-    error: subscribableError
-  } = useSubscribable(offerId);
-  const {
-    subscription: currentSubscription,
-    isLoading: subscriptionLoading,
-    error: subscriptionError,
-    update: updateSubscription
-  } = useUserSubscription();
-  useEffect(() => {
-    updateSubscription();
-  }, [updateSubscription]);
-  const isLoading = periodsLoading || packagesLoading || subscribableLoading || subscriptionLoading;
-  const error = periodsError || packagesError || subscribableError || subscriptionError;
-  const [selectedPlan, setSelectedPlan] = useState(null);
-  const [isPurchasing, setIsPurchasing] = useState(false);
-  const [isRestoring, setIsRestoring] = useState(false);
-  const track = useCallback(
-    (label, params) => {
-      onTrack == null ? void 0 : onTrack({
-        eventType: "subscription_action",
-        componentName: "AppSubscriptionsPage",
-        label,
-        params
-      });
-    },
-    [onTrack]
-  );
-  const handlePeriodChange = useCallback(
-    (value) => {
-      const newPeriod = value;
-      setSelectedPeriod(newPeriod);
-      setSelectedPlan(null);
-      track("billing_period_changed", { billing_period: newPeriod });
-    },
-    [track]
-  );
-  const getPeriodLabel = useCallback(
-    (period) => {
-      switch (period) {
-        case "yearly":
-          return labels.periodYear;
-        case "monthly":
-          return labels.periodMonth;
-        case "weekly":
-          return labels.periodWeek;
-        default:
-          return period;
-      }
-    },
-    [labels]
-  );
-  const getYearlySavingsPercent = useCallback(
-    (yearlyPackage) => {
-      if (!yearlyPackage.product) return void 0;
-      const monthlyPackageId = yearlyPackage.packageId.replace(
-        "_yearly",
-        "_monthly"
-      );
-      const monthlyPkg = packages.find((p) => p.packageId === monthlyPackageId);
-      if (!(monthlyPkg == null ? void 0 : monthlyPkg.product)) return void 0;
-      const yearlyPrice = yearlyPackage.product.price;
-      const monthlyPrice = monthlyPkg.product.price;
-      if (monthlyPrice <= 0 || yearlyPrice <= 0) return void 0;
-      const annualizedMonthly = monthlyPrice * 12;
-      const savings = (annualizedMonthly - yearlyPrice) / annualizedMonthly * 100;
-      return Math.round(savings);
-    },
-    [packages]
-  );
-  const billingPeriodOptions = useMemo(() => {
-    return periods.map((period) => ({
-      value: period,
-      label: period === "monthly" ? labels.billingMonthly : labels.billingYearly
-    }));
-  }, [periods, labels]);
-  const isCurrentPlan = useCallback(
-    (packageId, productId) => {
-      if (!(currentSubscription == null ? void 0 : currentSubscription.isActive)) return false;
-      return productId === currentSubscription.productId || packageId === currentSubscription.packageId;
-    },
-    [currentSubscription]
-  );
-  const isPackageEnabled = useCallback(
-    (packageId) => {
-      if (subscribableLoading || subscribablePackageIds.length === 0)
-        return true;
-      return subscribablePackageIds.includes(packageId);
-    },
-    [subscribableLoading, subscribablePackageIds]
-  );
-  const canUpgradeTo = useCallback(
-    (packageId, productId) => {
-      return isPackageEnabled(packageId) && !isCurrentPlan(packageId, productId);
-    },
-    [isPackageEnabled, isCurrentPlan]
-  );
-  useEffect(() => {
-    if ((currentSubscription == null ? void 0 : currentSubscription.isActive) && currentSubscription.packageId) {
-      setSelectedPlan(currentSubscription.packageId);
-      if (currentSubscription.period && periods.includes(currentSubscription.period)) {
-        setSelectedPeriod(currentSubscription.period);
-      }
-    }
-  }, [currentSubscription, periods]);
-  const handlePlanSelect = useCallback(
-    (planIdentifier) => {
-      setSelectedPlan(planIdentifier);
-      track("plan_selected", {
-        plan_identifier: planIdentifier ?? "free",
-        is_free_tier: planIdentifier === null
-      });
-    },
-    [track]
-  );
-  const handlePurchase = useCallback(async () => {
-    if (!selectedPlan) return;
-    setIsPurchasing(true);
-    track("purchase_initiated", { plan_identifier: selectedPlan });
-    try {
-      const result = await onPurchase(selectedPlan);
-      if (result) {
-        await refreshSubscription();
-        track("purchase_completed", { plan_identifier: selectedPlan });
-        onPurchaseSuccess == null ? void 0 : onPurchaseSuccess();
-        setSelectedPlan(null);
-      } else {
-        track("purchase_failed", {
-          plan_identifier: selectedPlan,
-          reason: "purchase_returned_false"
-        });
-      }
-    } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : labels.purchaseError;
-      track("purchase_failed", {
-        plan_identifier: selectedPlan,
-        reason: errorMessage
-      });
-      onError == null ? void 0 : onError(labels.errorTitle, errorMessage);
-    } finally {
-      setIsPurchasing(false);
-    }
-  }, [
-    selectedPlan,
-    track,
-    onPurchase,
-    onPurchaseSuccess,
-    labels.errorTitle,
-    labels.purchaseError,
-    onError
-  ]);
-  const handleRestore = useCallback(async () => {
-    setIsRestoring(true);
-    track("restore_initiated");
-    try {
-      const result = await onRestore();
-      if (result) {
-        await refreshSubscription();
-        track("restore_completed");
-        onRestoreSuccess == null ? void 0 : onRestoreSuccess();
-      } else {
-        track("restore_failed", { reason: "no_purchases_found" });
-        onWarning == null ? void 0 : onWarning(labels.errorTitle, labels.restoreNoPurchases);
-      }
-    } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : labels.restoreError;
-      track("restore_failed", { reason: errorMessage });
-      onError == null ? void 0 : onError(labels.errorTitle, errorMessage);
-    } finally {
-      setIsRestoring(false);
-    }
-  }, [
-    track,
-    onRestore,
-    onRestoreSuccess,
-    labels.errorTitle,
-    labels.restoreNoPurchases,
-    labels.restoreError,
-    onWarning,
-    onError
-  ]);
-  const isUpgrading = useMemo(() => {
-    if (!(currentSubscription == null ? void 0 : currentSubscription.isActive)) return false;
-    if (!selectedPlan) return false;
-    return selectedPlan !== currentSubscription.packageId && selectedPlan !== currentSubscription.productId;
-  }, [currentSubscription, selectedPlan]);
-  const handleUpgrade = useCallback(() => {
-    if (!(currentSubscription == null ? void 0 : currentSubscription.managementUrl)) {
-      onError == null ? void 0 : onError(
-        labels.errorTitle,
-        "Unable to open subscription management. Please try again."
-      );
-      return;
-    }
-    track("upgrade_initiated", {
-      current_plan: currentSubscription.packageId,
-      target_plan: selectedPlan
-    });
-    window.open(currentSubscription.managementUrl, "_blank");
-  }, [currentSubscription, selectedPlan, track, onError, labels.errorTitle]);
-  const formatExpirationDate = useCallback((date) => {
-    if (!date) return "";
-    return new Intl.DateTimeFormat(void 0, {
-      year: "numeric",
-      month: "long",
-      day: "numeric"
-    }).format(date);
-  }, []);
-  const formatProductName = useCallback(
-    (packageId, productId) => {
-      if (!packageId && !productId) return labels.labelPremium;
-      const pkg = packages.find(
-        (p) => {
-          var _a;
-          return p.packageId === packageId || ((_a = p.product) == null ? void 0 : _a.productId) === productId;
-        }
-      );
-      if (pkg == null ? void 0 : pkg.name) return pkg.name;
-      const identifier = packageId || productId || "";
-      return identifier.split(/[_-]/).map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
-    },
-    [packages, labels.labelPremium]
-  );
-  const formatRateLimit = useCallback(
-    (limit) => {
-      if (limit === null) return labels.unlimited;
-      return limit.toLocaleString();
-    },
-    [labels.unlimited]
-  );
-  const freeTierPackage = packages.find((p) => !p.product);
-  const paidPackages = packages.filter((p) => p.product);
-  return /* @__PURE__ */ jsx(
-    SubscriptionLayout,
-    {
-      title: labels.title,
-      error: error == null ? void 0 : error.message,
-      currentStatusLabel: labels.currentStatusLabel,
-      currentStatus: {
-        isActive: (currentSubscription == null ? void 0 : currentSubscription.isActive) ?? false,
-        activeContent: (currentSubscription == null ? void 0 : currentSubscription.isActive) ? {
-          title: labels.statusActive,
-          fields: [
-            {
-              label: labels.labelPlan,
-              value: formatProductName(
-                currentSubscription.packageId,
-                currentSubscription.productId
-              )
-            },
-            {
-              label: labels.labelExpires,
-              value: formatExpirationDate(
-                currentSubscription.expirationDate
-              )
-            },
-            {
-              label: labels.labelWillRenew,
-              value: currentSubscription.willRenew ? labels.yes : labels.no
-            },
-            ...rateLimitsConfig ? [
-              {
-                label: labels.labelMonthlyUsage,
-                value: `${rateLimitsConfig.currentUsage.monthly.toLocaleString()} / ${formatRateLimit(rateLimitsConfig.currentLimits.monthly)}`
-              },
-              {
-                label: labels.labelDailyUsage,
-                value: `${rateLimitsConfig.currentUsage.daily.toLocaleString()} / ${formatRateLimit(rateLimitsConfig.currentLimits.daily)}`
-              }
-            ] : []
-          ]
-        } : void 0,
-        inactiveContent: !(currentSubscription == null ? void 0 : currentSubscription.isActive) ? {
-          title: labels.statusInactive,
-          message: labels.statusInactiveMessage
-        } : void 0
-      },
-      aboveProducts: !isLoading && periods.length > 1 ? /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsx(
-        SegmentedControl,
-        {
-          options: billingPeriodOptions,
-          value: selectedPeriod,
-          onChange: handlePeriodChange
-        }
-      ) }) : null,
-      primaryAction: {
-        label: isPurchasing ? labels.buttonPurchasing : isUpgrading ? labels.buttonUpgrade : labels.buttonSubscribe,
-        onClick: isUpgrading ? handleUpgrade : handlePurchase,
-        disabled: !selectedPlan || isPurchasing || isRestoring,
-        loading: isPurchasing
-      },
-      secondaryAction: {
-        label: isRestoring ? labels.buttonRestoring : labels.buttonRestore,
-        onClick: handleRestore,
-        disabled: isPurchasing || isRestoring,
-        loading: isRestoring
-      },
-      children: isLoading ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ jsx("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600" }) }) : error ? /* @__PURE__ */ jsx("div", { className: "text-center py-12 text-red-500", children: error.message }) : packages.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-center py-12 text-theme-text-secondary", children: labels.noProducts }) : paidPackages.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-center py-12 text-theme-text-secondary", children: labels.noProductsForPeriod }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        freeTierPackage && !(currentSubscription == null ? void 0 : currentSubscription.isActive) && /* @__PURE__ */ jsx(
-          SubscriptionTile,
-          {
-            id: "free",
-            title: labels.freeTierTitle,
-            price: labels.freeTierPrice,
-            periodLabel: labels.periodMonth,
-            features: labels.freeTierFeatures,
-            isSelected: selectedPlan === null,
-            isCurrentPlan: !(currentSubscription == null ? void 0 : currentSubscription.isActive),
-            onSelect: () => handlePlanSelect(null),
-            enabled: isPackageEnabled("free"),
-            topBadge: {
-              text: labels.currentPlanBadge,
-              color: "green"
-            },
-            disabled: isPurchasing || isRestoring,
-            hideSelectionIndicator: true
-          },
-          "free"
-        ),
-        paidPackages.map((pkg) => {
-          var _a, _b, _c, _d, _e, _f;
-          const isCurrent = isCurrentPlan(
-            pkg.packageId,
-            (_a = pkg.product) == null ? void 0 : _a.productId
-          );
-          const isEnabled = isPackageEnabled(pkg.packageId);
-          const canUpgrade = canUpgradeTo(
-            pkg.packageId,
-            (_b = pkg.product) == null ? void 0 : _b.productId
-          );
-          const canSelect = canUpgrade || isCurrent;
-          return /* @__PURE__ */ jsx(
-            SubscriptionTile,
-            {
-              id: pkg.packageId,
-              title: pkg.name,
-              price: ((_c = pkg.product) == null ? void 0 : _c.priceString) ?? "$0",
-              periodLabel: getPeriodLabel(((_d = pkg.product) == null ? void 0 : _d.period) ?? "monthly"),
-              features: formatters.getProductFeatures(pkg.packageId),
-              isSelected: selectedPlan === pkg.packageId,
-              isCurrentPlan: isCurrent,
-              onSelect: () => canSelect && handlePlanSelect(pkg.packageId),
-              enabled: isEnabled,
-              isBestValue: pkg.packageId.includes("pro"),
-              topBadge: isCurrent ? {
-                text: labels.currentPlanBadge,
-                color: "green"
-              } : void 0,
-              discountBadge: selectedPeriod === "yearly" ? (() => {
-                const savings = getYearlySavingsPercent(pkg);
-                return savings && savings > 0 ? {
-                  text: formatters.formatSavePercent(savings),
-                  isBestValue: true
-                } : void 0;
-              })() : void 0,
-              introPriceNote: ((_e = pkg.product) == null ? void 0 : _e.trialPeriod) ? (() => {
-                var _a2;
-                const period = (_a2 = pkg.product) == null ? void 0 : _a2.trialPeriod;
-                if (!period) return void 0;
-                const num = parseInt(
-                  period.replace(/\D/g, "") || "1",
-                  10
-                );
-                if (period.includes("W"))
-                  return formatters.formatTrialWeeks(num);
-                if (period.includes("M"))
-                  return formatters.formatTrialMonths(num);
-                return formatters.formatTrialDays(num);
-              })() : ((_f = pkg.product) == null ? void 0 : _f.introPrice) ? formatters.formatIntroNote(pkg.product.introPrice) : void 0,
-              disabled: isPurchasing || isRestoring || !canSelect
-            },
-            pkg.packageId
-          );
-        })
-      ] })
-    }
-  );
-}
-function AppPricingPage({
-  isAuthenticated,
-  labels,
-  formatters,
-  onPlanClick,
-  onFreePlanClick,
-  onPurchase,
-  onPurchaseSuccess,
-  onPurchaseError,
-  faqItems,
-  className,
-  onTrack,
-  offerId
-}) {
-  const [isPurchasing, setIsPurchasing] = useState(false);
-  const {
-    subscription: currentSubscription,
-    isLoading: subscriptionLoading,
-    error: subscriptionError,
-    update: updateSubscription
-  } = useUserSubscription();
-  useEffect(() => {
-    updateSubscription();
-  }, [updateSubscription]);
-  const hasActiveSubscription = (currentSubscription == null ? void 0 : currentSubscription.isActive) ?? false;
-  const currentProductIdentifier = currentSubscription == null ? void 0 : currentSubscription.productId;
-  const {
-    periods,
-    isLoading: periodsLoading,
-    error: periodsError
-  } = useSubscriptionPeriods(offerId);
-  const [selectedPeriod, setSelectedPeriod] = useState("monthly");
-  useEffect(() => {
-    if (periods.length > 0 && !periods.includes(selectedPeriod)) {
-      setSelectedPeriod(periods[0]);
-    }
-  }, [periods, selectedPeriod]);
-  const {
-    packages,
-    isLoading: packagesLoading,
-    error: packagesError
-  } = useSubscriptionForPeriod(offerId, selectedPeriod);
-  const {
-    subscribablePackageIds,
-    isLoading: subscribableLoading,
-    error: subscribableError
-  } = useSubscribable(offerId);
-  const isLoading = periodsLoading || packagesLoading || subscribableLoading || subscriptionLoading || isPurchasing;
-  const error = periodsError || packagesError || subscribableError || subscriptionError;
-  const track = useCallback(
-    (label, params) => {
-      onTrack == null ? void 0 : onTrack({
-        eventType: "subscription_action",
-        componentName: "AppPricingPage",
-        label,
-        params
-      });
-    },
-    [onTrack]
-  );
-  const handleBillingPeriodChange = useCallback(
-    (value) => {
-      const newPeriod = value;
-      setSelectedPeriod(newPeriod);
-      track("billing_period_changed", { billing_period: newPeriod });
-    },
-    [track]
-  );
-  const handleFreePlanClick = useCallback(() => {
-    track("free_plan_clicked", { plan: "free" });
-    onFreePlanClick();
-  }, [track, onFreePlanClick]);
-  const handlePlanClick = useCallback(
-    async (planIdentifier, actionType) => {
-      track("plan_clicked", {
-        plan_identifier: planIdentifier,
-        action_type: actionType
-      });
-      if (actionType === "login") {
-        onPlanClick(planIdentifier);
-        return;
-      }
-      if (onPurchase) {
-        setIsPurchasing(true);
-        try {
-          const result = await onPurchase(planIdentifier);
-          if (result) {
-            await refreshSubscription();
-            track("purchase_completed", { plan_identifier: planIdentifier });
-            onPurchaseSuccess == null ? void 0 : onPurchaseSuccess();
-          }
-        } catch (err) {
-          track("purchase_failed", {
-            plan_identifier: planIdentifier,
-            reason: err instanceof Error ? err.message : "Unknown error"
-          });
-          onPurchaseError == null ? void 0 : onPurchaseError(
-            err instanceof Error ? err : new Error("Purchase failed")
-          );
-        } finally {
-          setIsPurchasing(false);
-        }
-      } else {
-        onPlanClick(planIdentifier);
-      }
-    },
-    [track, onPlanClick, onPurchase, onPurchaseSuccess, onPurchaseError]
-  );
-  const getPeriodLabel = useCallback(
-    (period) => {
-      switch (period) {
-        case "yearly":
-          return labels.periodYear;
-        case "monthly":
-          return labels.periodMonth;
-        case "weekly":
-          return labels.periodWeek;
-        default:
-          return period;
-      }
-    },
-    [labels]
-  );
-  const getYearlySavingsPercent = useCallback(
-    (yearlyPackage) => {
-      if (!yearlyPackage.product) return void 0;
-      const monthlyPackageId = yearlyPackage.packageId.replace(
-        "_yearly",
-        "_monthly"
-      );
-      const monthlyPkg = packages.find((p) => p.packageId === monthlyPackageId);
-      if (!(monthlyPkg == null ? void 0 : monthlyPkg.product)) return void 0;
-      const yearlyPrice = yearlyPackage.product.price;
-      const monthlyPrice = monthlyPkg.product.price;
-      if (monthlyPrice <= 0 || yearlyPrice <= 0) return void 0;
-      const annualizedMonthly = monthlyPrice * 12;
-      const savings = (annualizedMonthly - yearlyPrice) / annualizedMonthly * 100;
-      return Math.round(savings);
-    },
-    [packages]
-  );
-  const billingPeriodOptions = useMemo(() => {
-    return periods.map((period) => ({
-      value: period,
-      label: period === "monthly" ? labels.billingMonthly : labels.billingYearly
-    }));
-  }, [periods, labels]);
-  const isCurrentPlan = useCallback(
-    (packageId, productId) => {
-      if (!isAuthenticated) return false;
-      if (!hasActiveSubscription) return false;
-      return productId === currentProductIdentifier || packageId === currentProductIdentifier;
-    },
-    [isAuthenticated, hasActiveSubscription, currentProductIdentifier]
-  );
-  const isPackageEnabled = useCallback(
-    (packageId) => {
-      if (!isAuthenticated) return true;
-      if (subscribableLoading || subscribablePackageIds.length === 0)
-        return true;
-      return subscribablePackageIds.includes(packageId);
-    },
-    [isAuthenticated, subscribableLoading, subscribablePackageIds]
-  );
-  const canUpgradeTo = useCallback(
-    (packageId, productId) => {
-      return isPackageEnabled(packageId) && !isCurrentPlan(packageId, productId);
-    },
-    [isPackageEnabled, isCurrentPlan]
-  );
-  const freeTierPackage = packages.find((p) => !p.product);
-  const paidPackages = packages.filter((p) => p.product);
-  return /* @__PURE__ */ jsxs("div", { className, children: [
-    /* @__PURE__ */ jsx(Section, { spacing: "2xl", maxWidth: "4xl", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
-      /* @__PURE__ */ jsx("h1", { className: "text-4xl sm:text-5xl font-bold text-theme-text-primary mb-4", children: labels.title }),
-      /* @__PURE__ */ jsx("p", { className: "text-lg text-theme-text-secondary", children: labels.subtitle })
-    ] }) }),
-    /* @__PURE__ */ jsxs(Section, { spacing: "3xl", maxWidth: "6xl", children: [
-      periods.length > 1 && /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-8", children: /* @__PURE__ */ jsx(
-        SegmentedControl,
-        {
-          options: billingPeriodOptions,
-          value: selectedPeriod,
-          onChange: handleBillingPeriodChange
-        }
-      ) }),
-      isLoading && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ jsx("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600" }) }),
-      error && !isLoading && /* @__PURE__ */ jsx("div", { className: "text-center py-12 text-red-500", children: error.message }),
-      !isLoading && !error && /* @__PURE__ */ jsxs(
-        "div",
-        {
-          style: {
-            display: "grid",
-            gridTemplateColumns: "repeat(auto-fit, minmax(min(100%, 280px), 1fr))",
-            gridAutoRows: "1fr",
-            gap: "1.5rem",
-            overflow: "visible"
-          },
-          children: [
-            freeTierPackage && /* @__PURE__ */ jsx(
-              SubscriptionTile,
-              {
-                id: "free",
-                title: labels.freeTierTitle,
-                price: labels.freeTierPrice,
-                periodLabel: labels.periodMonth,
-                features: labels.freeTierFeatures,
-                isSelected: false,
-                isCurrentPlan: isAuthenticated && !hasActiveSubscription,
-                onSelect: () => {
-                },
-                enabled: isPackageEnabled("free"),
-                topBadge: isAuthenticated && !hasActiveSubscription ? {
-                  text: labels.currentPlanBadge,
-                  color: "green"
-                } : void 0,
-                ctaButton: (
-                  // Not logged in: show "Try it for Free"
-                  // Logged in on free plan: no CTA (current plan)
-                  // Logged in with subscription: no CTA (can't downgrade here)
-                  !isAuthenticated ? {
-                    label: labels.ctaTryFree,
-                    onClick: handleFreePlanClick
-                  } : void 0
-                ),
-                hideSelectionIndicator: isAuthenticated
-              }
-            ),
-            paidPackages.map((pkg) => {
-              var _a, _b, _c, _d;
-              const isCurrent = isCurrentPlan(
-                pkg.packageId,
-                (_a = pkg.product) == null ? void 0 : _a.productId
-              );
-              const isEnabled = isPackageEnabled(pkg.packageId);
-              const canUpgrade = canUpgradeTo(
-                pkg.packageId,
-                (_b = pkg.product) == null ? void 0 : _b.productId
-              );
-              let ctaButton;
-              if (!isAuthenticated) {
-                ctaButton = {
-                  label: labels.ctaLogIn,
-                  onClick: () => handlePlanClick(pkg.packageId, "login")
-                };
-              } else if (isCurrent) {
-                ctaButton = void 0;
-              } else if (canUpgrade) {
-                ctaButton = {
-                  label: labels.ctaUpgrade,
-                  onClick: () => handlePlanClick(pkg.packageId, "upgrade")
-                };
-              }
-              let topBadge;
-              if (isCurrent) {
-                topBadge = {
-                  text: labels.currentPlanBadge,
-                  color: "green"
-                };
-              } else if (pkg.packageId.includes("pro")) {
-                topBadge = {
-                  text: labels.mostPopularBadge,
-                  color: "yellow"
-                };
-              }
-              return /* @__PURE__ */ jsx(
-                SubscriptionTile,
-                {
-                  id: pkg.packageId,
-                  title: pkg.name,
-                  price: ((_c = pkg.product) == null ? void 0 : _c.priceString) ?? "$0",
-                  periodLabel: getPeriodLabel(((_d = pkg.product) == null ? void 0 : _d.period) ?? "monthly"),
-                  features: formatters.getProductFeatures(pkg.packageId),
-                  isSelected: false,
-                  isCurrentPlan: isCurrent,
-                  onSelect: () => {
-                  },
-                  enabled: isEnabled,
-                  isBestValue: pkg.packageId.includes("pro"),
-                  topBadge,
-                  discountBadge: selectedPeriod === "yearly" ? (() => {
-                    const savings = getYearlySavingsPercent(pkg);
-                    return savings && savings > 0 ? {
-                      text: formatters.formatSavePercent(savings),
-                      isBestValue: true
-                    } : void 0;
-                  })() : void 0,
-                  ctaButton,
-                  hideSelectionIndicator: !ctaButton
-                },
-                pkg.packageId
-              );
-            })
-          ]
-        }
-      )
-    ] }),
-    faqItems && faqItems.length > 0 && /* @__PURE__ */ jsxs(Section, { spacing: "3xl", background: "surface", maxWidth: "3xl", children: [
-      /* @__PURE__ */ jsx("h2", { className: "text-3xl font-bold text-theme-text-primary text-center mb-12", children: labels.faqTitle }),
-      /* @__PURE__ */ jsx("div", { className: "space-y-6", children: faqItems.map((item, index) => /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "bg-theme-bg-primary p-6 rounded-xl border border-theme-border",
-          children: [
-            /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-theme-text-primary mb-2", children: item.question }),
-            /* @__PURE__ */ jsx("p", { className: "text-theme-text-secondary", children: item.answer })
-          ]
-        },
-        index
-      )) })
-    ] })
-  ] });
-}
 const DEFAULT_SUPPORTED_LANGUAGES = ["en"];
 const DEFAULT_NAMESPACES = [
   "common",
@@ -2830,9 +2106,7 @@ export {
   AppFooter,
   AppFooterForHomePage,
   AppPageLayout,
-  AppPricingPage,
   AppSitemapPage,
-  AppSubscriptionsPage,
   AppTextPage,
   AppTopBar,
   AppTopBarWithFirebaseAuth,