@burdenoff/website-sdk 2026.1101.1 → 2026.1101.3

package/dist/chunk-TGYQHO2E.mjs

@@ -0,0 +1,864 @@
+import { PageHead } from './chunk-N5EC53MH.mjs';
+import { Button } from './chunk-KHYXK7FG.mjs';
+import { useProduct } from './chunk-GCFLCO2Z.mjs';
+import { useWebSDK, useWebSDKConfig } from './chunk-5JRJ57CL.mjs';
+import { useState, useEffect, useMemo } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/components/pricing-catalog.ts
+var UUID_PATTERN = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+function isUuidLike(value) {
+  return UUID_PATTERN.test(value.trim());
+}
+var PricingProductKeyError = class extends Error {
+  constructor(productId) {
+    super(
+      `PricingPage was given the product id "${productId}", which matches no public product. publicPlans(productId) expects the product slug (for example "vibecontrols"); pass product.slug.`
+    );
+    this.name = "PricingProductKeyError";
+  }
+};
+function resolvePricingProductKey(productId, candidates) {
+  const trimmed = productId.trim();
+  if (!isUuidLike(trimmed)) return trimmed;
+  const wanted = trimmed.toLowerCase();
+  const match = candidates.find(
+    (c) => !!c && c.id.toLowerCase() === wanted && c.slug.trim().length > 0
+  );
+  return match ? match.slug.trim() : null;
+}
+var PERIOD_SUFFIX = /\s*[([]\s*(monthly|month|annual|annually|yearly|year)\s*[)\]]\s*$/i;
+var PRODUCT_PREFIX = /^\S.*?\s[-–—]\s+(?=\S)/;
+function cleanPlanDisplayName(name) {
+  const withoutPeriod = name.replace(PERIOD_SUFFIX, "").trim();
+  const withoutProduct = withoutPeriod.replace(PRODUCT_PREFIX, "").trim();
+  if (withoutProduct.length > 0) return withoutProduct;
+  if (withoutPeriod.length > 0) return withoutPeriod;
+  return name.trim();
+}
+function isFiniteNumber(value) {
+  return typeof value === "number" && Number.isFinite(value);
+}
+function planPriceIn(plan, currency) {
+  const code = currency.toUpperCase();
+  if (plan.price === 0) return 0;
+  if (plan.currency.toUpperCase() === code) return plan.price;
+  const prices = plan.currencyPrices;
+  if (!prices) return null;
+  const direct = prices[code];
+  if (isFiniteNumber(direct)) return direct;
+  const key = Object.keys(prices).find((k) => k.toUpperCase() === code);
+  const value = key === void 0 ? void 0 : prices[key];
+  return isFiniteNumber(value) ? value : null;
+}
+function availablePlanCurrencies(plans) {
+  if (plans.length === 0) return [];
+  const all = /* @__PURE__ */ new Set();
+  for (const plan of plans) {
+    all.add(plan.currency.toUpperCase());
+    for (const key of Object.keys(plan.currencyPrices ?? {})) {
+      all.add(key.toUpperCase());
+    }
+  }
+  const usable = [...all].filter(
+    (code) => plans.every((plan) => planPriceIn(plan, code) !== null)
+  );
+  const base = plans.find((p) => p.price > 0)?.currency.toUpperCase();
+  return usable.sort((a, b) => {
+    if (a === base) return -1;
+    if (b === base) return 1;
+    return a.localeCompare(b);
+  });
+}
+var EURO_REGIONS = [
+  "AT",
+  "BE",
+  "CY",
+  "DE",
+  "EE",
+  "ES",
+  "FI",
+  "FR",
+  "GR",
+  "HR",
+  "IE",
+  "IT",
+  "LT",
+  "LU",
+  "LV",
+  "MT",
+  "NL",
+  "PT",
+  "SI",
+  "SK"
+];
+var REGION_CURRENCY = Object.freeze({
+  AU: "AUD",
+  BR: "BRL",
+  CA: "CAD",
+  CH: "CHF",
+  CN: "CNY",
+  DK: "DKK",
+  GB: "GBP",
+  HK: "HKD",
+  IN: "INR",
+  JP: "JPY",
+  KR: "KRW",
+  MX: "MXN",
+  MY: "MYR",
+  NO: "NOK",
+  NZ: "NZD",
+  PL: "PLN",
+  SE: "SEK",
+  SG: "SGD",
+  TH: "THB",
+  US: "USD",
+  ...Object.fromEntries(EURO_REGIONS.map((r) => [r, "EUR"]))
+});
+var TIME_ZONE_REGION = Object.freeze({
+  "Asia/Kolkata": "IN",
+  "Asia/Calcutta": "IN"
+});
+function regionOfLanguage(tag) {
+  const parts = tag.replace(/_/g, "-").split("-");
+  for (const part of parts.slice(1)) {
+    if (/^[A-Za-z]{2}$/.test(part)) return part.toUpperCase();
+  }
+  return null;
+}
+function detectRegionalCurrency(available, locale) {
+  const sellable = new Set(available.map((c) => c.toUpperCase()));
+  const regions = [];
+  const tzRegion = locale.timeZone ? TIME_ZONE_REGION[locale.timeZone] : null;
+  if (tzRegion) regions.push(tzRegion);
+  for (const tag of locale.languages ?? []) {
+    const region = regionOfLanguage(tag);
+    if (region) regions.push(region);
+  }
+  for (const region of regions) {
+    const currency = REGION_CURRENCY[region];
+    if (currency && sellable.has(currency)) return currency;
+  }
+  return null;
+}
+function formatCatalogPrice(amount, currency) {
+  const code = currency.toUpperCase();
+  const whole = amount % 1 === 0;
+  try {
+    return new Intl.NumberFormat("en-US", {
+      style: "currency",
+      currency: code,
+      minimumFractionDigits: whole ? 0 : 2,
+      maximumFractionDigits: whole ? 0 : 2
+    }).format(amount);
+  } catch {
+    return `${code} ${whole ? amount.toString() : amount.toFixed(2)}`;
+  }
+}
+function plansForBillingCycle(plans, cycle) {
+  if (cycle === "monthly") {
+    return plans.filter((p) => p.duration === "monthly");
+  }
+  const yearly = plans.filter((p) => p.duration === "yearly");
+  if (yearly.some((p) => p.priceRaw === 0)) return yearly;
+  const free = plans.filter(
+    (p) => p.duration === "monthly" && p.priceRaw === 0
+  );
+  return [...free, ...yearly];
+}
+var GET_PLANS_QUERY = `
+  query GetPublicPlans($productId: String!) {
+    publicPlans(productId: $productId) {
+      id
+      name
+      price
+      currency
+      currencyPrices
+      duration
+      features {
+        id
+        quotaId
+        context
+        quota {
+          id
+          name
+          limits
+        }
+      }
+      isActive
+      productID
+      createdAt
+    }
+  }
+`;
+var PUBLIC_PRODUCT_KEYS_QUERY = `
+  query PricingProductKeys {
+    publicProducts(limit: 200) {
+      items {
+        id
+        slug
+      }
+    }
+  }
+`;
+var CURRENCY_STORAGE_KEY = "burdenoff.pricing.currency";
+function readStoredCurrency() {
+  try {
+    if (typeof window === "undefined") return null;
+    return window.localStorage.getItem(CURRENCY_STORAGE_KEY);
+  } catch {
+    return null;
+  }
+}
+function storeCurrency(code) {
+  try {
+    if (typeof window === "undefined") return;
+    window.localStorage.setItem(CURRENCY_STORAGE_KEY, code);
+  } catch {
+  }
+}
+function readVisitorLocale() {
+  let timeZone = null;
+  try {
+    timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone ?? null;
+  } catch {
+    timeZone = null;
+  }
+  const languages = typeof navigator === "undefined" ? [] : [...navigator.languages ?? [], navigator.language].filter(
+    (l) => typeof l === "string" && l.length > 0
+  );
+  return { timeZone, languages };
+}
+function formatPrice(price, currencyCode = "USD", currencies) {
+  const currency = currencies?.[currencyCode];
+  if (!currency) {
+    return formatCatalogPrice(price, currencyCode);
+  }
+  const formattedNumber = price % 1 === 0 ? price.toString() : price.toFixed(2);
+  return currency.position === "prefix" ? `${currency.symbol}${formattedNumber}` : `${formattedNumber}${currency.symbol}`;
+}
+function formatInterval(duration, billingIntervals) {
+  const defaultIntervals = {
+    monthly: "/month",
+    yearly: "/year"
+  };
+  const intervals = billingIntervals || defaultIntervals;
+  return intervals[duration] || `/${duration}`;
+}
+function isEnterprisePlan(planName) {
+  const name = planName.toLowerCase();
+  return name.includes("team") || name.includes("business") || name.includes("enterprise");
+}
+function isEnterpriseAudiencePlan(plan) {
+  if (!isEnterprisePlan(plan.name)) {
+    return false;
+  }
+  if (typeof plan.priceRaw === "number") {
+    return plan.priceRaw === 0;
+  }
+  return true;
+}
+function splitPlansByAudience(plans, showAudienceTabs) {
+  if (!showAudienceTabs) {
+    return { individualPlans: plans, enterprisePlans: [] };
+  }
+  return {
+    individualPlans: plans.filter((p) => !isEnterpriseAudiencePlan(p)),
+    enterprisePlans: plans.filter((p) => isEnterpriseAudiencePlan(p))
+  };
+}
+function resolveEnterprisePlans(apiEnterprisePlans, staticEnterprisePlans, defaultEnterpriseCard) {
+  const staticPlans = staticEnterprisePlans || [];
+  if (apiEnterprisePlans.length === 0 && staticPlans.length === 0) {
+    return [defaultEnterpriseCard];
+  }
+  const apiNames = new Set(apiEnterprisePlans.map((p) => p.name.toLowerCase()));
+  const dedupedStaticPlans = staticPlans.filter(
+    (p) => !apiNames.has(p.name.toLowerCase())
+  );
+  return [...apiEnterprisePlans, ...dedupedStaticPlans];
+}
+function detectPlanTier(planName) {
+  const name = planName.toLowerCase();
+  if (name.includes("free") || name.includes("basic") || name.includes("starter") || name.includes("hobby")) {
+    return "basic";
+  } else if (name.includes("pro") || name.includes("professional") || name.includes("premium") || name.includes("team")) {
+    return "professional";
+  } else if (name.includes("enterprise") || name.includes("business")) {
+    return "enterprise";
+  }
+  return null;
+}
+function getFallbackFeaturesForTier(tier, fallbackFeatures) {
+  return [...fallbackFeatures?.[tier] || []];
+}
+function getMetadataForPlan(planName, priceRaw, planMetadata) {
+  const normalizedName = planName.toLowerCase();
+  const cleanName = cleanPlanDisplayName(planName);
+  const meta = planMetadata?.[normalizedName] ?? planMetadata?.[cleanName.toLowerCase()];
+  if (meta) {
+    return {
+      tier: meta.tier || "basic",
+      displayName: meta.displayName || cleanName,
+      defaultDescription: meta.defaultDescription || "Choose this plan",
+      popular: meta.popular ?? false,
+      ctaText: meta.ctaText || "Get Started",
+      ctaType: meta.ctaType || "signup",
+      features: meta.features
+    };
+  }
+  const tier = detectPlanTier(planName);
+  if (tier) {
+    const isPaidEnterpriseName = tier === "enterprise" && typeof priceRaw === "number" && priceRaw > 0;
+    if (isPaidEnterpriseName) {
+      return {
+        tier: "professional",
+        displayName: cleanName,
+        defaultDescription: "Choose this plan",
+        popular: false,
+        ctaText: "Get Started",
+        ctaType: "signup"
+      };
+    }
+    return {
+      tier,
+      displayName: cleanName,
+      defaultDescription: "Choose this plan",
+      popular: tier === "professional",
+      ctaText: tier === "enterprise" ? "Contact Sales" : "Get Started",
+      ctaType: tier === "enterprise" ? "contact" : "signup"
+    };
+  }
+  return {
+    tier: "basic",
+    displayName: cleanName,
+    defaultDescription: "Choose this plan",
+    popular: false,
+    ctaText: "Get Started",
+    ctaType: "signup"
+  };
+}
+function humanizeQuotaName(name) {
+  const parts = name.split(".");
+  const resource = parts.length >= 3 ? parts[parts.length - 2] : parts[parts.length - 1];
+  return resource.replace(/[-_]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
+}
+function transformFeatureToLabel(feature) {
+  const quota = feature.quota;
+  if (!quota) return "";
+  const { name, limits } = quota;
+  const featureContext = feature.context && typeof feature.context === "object" ? feature.context : null;
+  const limitsObj = limits && typeof limits === "object" ? limits : null;
+  const value = typeof featureContext?.quantity === "number" ? featureContext.quantity : typeof limitsObj?.value === "number" ? limitsObj.value : void 0;
+  const unit = typeof featureContext?.unit === "string" && featureContext.unit || typeof limitsObj?.unit === "string" && limitsObj.unit || void 0;
+  const description = typeof featureContext?.description === "string" && featureContext.description || typeof limitsObj?.description === "string" && limitsObj.description || void 0;
+  const type = limitsObj?.type;
+  if (description) {
+    if (type === "number" && typeof value === "number") {
+      return `${value.toLocaleString()} ${description}`;
+    }
+    return description;
+  }
+  if (unit) {
+    if (typeof value === "number") {
+      return `${value.toLocaleString()} ${unit}`;
+    }
+    return unit;
+  }
+  const label = humanizeQuotaName(name);
+  if (type === "boolean") {
+    return label;
+  }
+  if (typeof value === "number") {
+    return `${value.toLocaleString()} ${label}`;
+  }
+  return label;
+}
+function extractDisplayFeatures(features, planName, fallbackFeatures) {
+  const tier = detectPlanTier(planName);
+  if (tier) {
+    const tierFeatures = getFallbackFeaturesForTier(tier, fallbackFeatures);
+    if (tierFeatures.length > 0) {
+      return tierFeatures;
+    }
+  }
+  const quotaFeatures = features.filter((f) => f.quota).map((f) => transformFeatureToLabel(f));
+  if (quotaFeatures.length > 0) {
+    return quotaFeatures;
+  }
+  return [];
+}
+function transformToDisplayCard(plan, props, currency) {
+  const metadata = getMetadataForPlan(
+    plan.name,
+    plan.price,
+    props.planMetadata
+  );
+  const selectedPrice = currency ? planPriceIn(plan, currency) : null;
+  const formattedPrice = currency && selectedPrice !== null ? formatPrice(selectedPrice, currency.toUpperCase(), props.currencies) : formatPrice(plan.price, plan.currency, props.currencies);
+  const interval = formatInterval(plan.duration, props.billingIntervals);
+  const features = metadata.features && metadata.features.length > 0 ? metadata.features : extractDisplayFeatures(
+    plan.features,
+    plan.name,
+    props.fallbackFeatures
+  );
+  const contactUrl = props.contactUrl || "/contact";
+  const ctaLink = metadata.ctaType === "contact" ? contactUrl : props.appLoginUrl;
+  const isQuoteBased = metadata.ctaType === "contact" && plan.price === 0;
+  return {
+    id: plan.id,
+    name: metadata.displayName,
+    description: metadata.defaultDescription,
+    price: isQuoteBased ? "Custom" : formattedPrice,
+    priceRaw: plan.price,
+    interval: isQuoteBased ? "" : interval,
+    duration: plan.duration,
+    features,
+    popular: metadata.popular,
+    ctaText: metadata.ctaText,
+    ctaLink,
+    tier: metadata.tier
+  };
+}
+function PricingSection(props) {
+  const {
+    sectionHeading = "Pricing Plans",
+    sectionSubtitle = "Choose the perfect plan for your needs",
+    id,
+    className = ""
+  } = props;
+  const client = useWebSDK();
+  const config = useWebSDKConfig();
+  const { product: contextProduct } = useProduct();
+  const requestedProductId = (props.productId || config.productId || "").trim();
+  const contextKey = resolvePricingProductKey(requestedProductId, [
+    contextProduct
+  ]);
+  const productKey = contextKey ?? requestedProductId;
+  const [catalogPlans, setCatalogPlans] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const [billingCycle, setBillingCycle] = useState(
+    "monthly"
+  );
+  const [audience, setAudience] = useState(
+    "individual"
+  );
+  const [selectedCurrency, setSelectedCurrency] = useState(
+    props.defaultCurrency ? props.defaultCurrency.toUpperCase() : null
+  );
+  useEffect(() => {
+    let cancelled = false;
+    async function resolveKey() {
+      if (!productKey) {
+        throw new Error(
+          "PricingPage needs a product slug: pass productId or set WebSDKConfig.productId."
+        );
+      }
+      if (!isUuidLike(productKey)) return productKey;
+      const response = await client.query(
+        PUBLIC_PRODUCT_KEYS_QUERY
+      );
+      if (response.errors && response.errors.length > 0) {
+        throw new Error(response.errors[0].message);
+      }
+      const resolved = resolvePricingProductKey(
+        productKey,
+        response.data?.publicProducts?.items ?? []
+      );
+      if (!resolved) throw new PricingProductKeyError(productKey);
+      return resolved;
+    }
+    async function loadPlans() {
+      try {
+        setLoading(true);
+        const key = await resolveKey();
+        if (cancelled) return;
+        const response = await client.query(GET_PLANS_QUERY, {
+          productId: key
+        });
+        if (cancelled) return;
+        if (response.errors && response.errors.length > 0) {
+          throw new Error(response.errors[0].message);
+        }
+        if (!response.data?.publicPlans) {
+          throw new Error("No plans data received");
+        }
+        const active = response.data.publicPlans.filter(
+          (plan) => plan.isActive
+        );
+        if (active.length === 0) {
+          throw new Error(
+            `publicPlans returned no active plans for product "${key}".`
+          );
+        }
+        setCatalogPlans(active);
+        setError(null);
+      } catch (err) {
+        if (cancelled) return;
+        console.error("Failed to load plans:", err);
+        setCatalogPlans([]);
+        setError("Unable to load pricing information. Please try again later.");
+      } finally {
+        if (!cancelled) {
+          setLoading(false);
+        }
+      }
+    }
+    loadPlans();
+    return () => {
+      cancelled = true;
+    };
+  }, [client, productKey]);
+  const currencyOptions = useMemo(
+    () => availablePlanCurrencies(catalogPlans),
+    [catalogPlans]
+  );
+  useEffect(() => {
+    if (selectedCurrency || currencyOptions.length < 2) return;
+    const stored = readStoredCurrency()?.toUpperCase();
+    if (stored && currencyOptions.includes(stored)) {
+      setSelectedCurrency(stored);
+      return;
+    }
+    const regional = detectRegionalCurrency(
+      currencyOptions,
+      readVisitorLocale()
+    );
+    if (regional) setSelectedCurrency(regional);
+  }, [currencyOptions, selectedCurrency]);
+  const activeCurrency = selectedCurrency && currencyOptions.includes(selectedCurrency) ? selectedCurrency : currencyOptions[0] ?? null;
+  const allPlans = catalogPlans.map((plan) => transformToDisplayCard(plan, props, activeCurrency)).sort((a, b) => {
+    const aCustom = a.price === "Custom" ? 1 : 0;
+    const bCustom = b.price === "Custom" ? 1 : 0;
+    return aCustom - bCustom || a.priceRaw - b.priceRaw;
+  });
+  const showCurrencySelector = props.showCurrencySelector !== false && currencyOptions.length > 1;
+  const {
+    individualPlans: individualAllPlans,
+    enterprisePlans: enterpriseApiPlans
+  } = splitPlansByAudience(allPlans, props.showAudienceTabs);
+  const individualPlans = plansForBillingCycle(
+    individualAllPlans,
+    billingCycle
+  );
+  const enterpriseCards = enterpriseApiPlans.map((p) => {
+    if (p.priceRaw === 0 && p.name.toLowerCase().includes("enterprise")) {
+      return {
+        ...p,
+        price: "Custom",
+        interval: "",
+        ctaText: "Contact Sales",
+        ctaLink: props.contactUrl || "/contact"
+      };
+    }
+    return p;
+  });
+  const defaultEnterpriseCard = {
+    name: "Enterprise",
+    subtitle: "For organizations that need more",
+    description: "For organizations that need more",
+    price: "Custom",
+    period: "",
+    interval: "",
+    button: "Contact Sales",
+    buttonLink: props.contactUrl || "/contact",
+    ctaText: "Contact Sales",
+    ctaLink: props.contactUrl || "/contact",
+    popular: false,
+    features: props.fallbackFeatures?.enterprise || [
+      "Unlimited everything",
+      "SSO & SAML",
+      "Audit logs",
+      "Dedicated support",
+      "Self-hosted option"
+    ]
+  };
+  const resolvedEnterprisePlans = resolveEnterprisePlans(
+    enterpriseCards,
+    props.enterprisePlans,
+    defaultEnterpriseCard
+  );
+  const plans = props.showAudienceTabs && audience === "enterprise" ? [] : individualPlans;
+  if (loading) {
+    return /* @__PURE__ */ jsx("section", { id, className: `py-12 sm:py-16 md:py-20 ${className}`, children: /* @__PURE__ */ jsxs("div", { className: "container mx-auto px-4 sm:px-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: "text-center mb-8 sm:mb-12", children: [
+        sectionHeading ? /* @__PURE__ */ jsx("h2", { className: "text-2xl sm:text-3xl md:text-4xl font-bold mb-3 sm:mb-4", children: sectionHeading }) : (
+          // Visually hidden but DOM-present heading so axe's heading-order
+          // rule still sees an h2 between the consumer's hero h1 and the
+          // h3 plan-card titles. See `getMetadataForPlan` for why a falsy
+          // sectionHeading is the canonical "no visible heading" signal.
+          /* @__PURE__ */ jsx("h2", { className: "sr-only", children: "Pricing" })
+        ),
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm sm:text-base md:text-lg", children: "Loading pricing information..." })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "grid md:grid-cols-3 gap-6 sm:gap-8", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "bg-card border rounded-lg p-6 animate-pulse",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "h-6 bg-muted rounded w-1/2 mb-4" }),
+            /* @__PURE__ */ jsx("div", { className: "h-4 bg-muted rounded w-3/4 mb-6" }),
+            /* @__PURE__ */ jsx("div", { className: "h-10 bg-muted rounded w-1/3 mb-6" }),
+            /* @__PURE__ */ jsx("div", { className: "space-y-3 mb-6", children: [1, 2, 3, 4].map((j) => /* @__PURE__ */ jsx("div", { className: "h-4 bg-muted rounded" }, j)) }),
+            /* @__PURE__ */ jsx("div", { className: "h-10 bg-muted rounded" })
+          ]
+        },
+        i
+      )) })
+    ] }) });
+  }
+  if (error && plans.length === 0) {
+    return /* @__PURE__ */ jsx("section", { id, className: `py-12 sm:py-16 md:py-20 ${className}`, children: /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 sm:px-6", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      sectionHeading ? /* @__PURE__ */ jsx("h2", { className: "text-2xl sm:text-3xl md:text-4xl font-bold mb-4", children: sectionHeading }) : /* @__PURE__ */ jsx("h2", { className: "sr-only", children: "Pricing" }),
+      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mb-8", children: error }),
+      /* @__PURE__ */ jsx(Button, { onClick: () => window.location.reload(), children: "Retry" })
+    ] }) }) });
+  }
+  return /* @__PURE__ */ jsx("section", { id, className: `py-12 sm:py-16 md:py-20 ${className}`, children: /* @__PURE__ */ jsxs("div", { className: "container mx-auto px-4 sm:px-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center mb-8 sm:mb-12", children: [
+      sectionHeading ? /* @__PURE__ */ jsx("h2", { className: "text-2xl sm:text-3xl md:text-4xl font-bold mb-3 sm:mb-4", children: sectionHeading }) : /* @__PURE__ */ jsx("h2", { className: "sr-only", children: "Pricing" }),
+      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm sm:text-base md:text-lg mb-6", children: sectionSubtitle }),
+      props.showAudienceTabs && /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-4", children: /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center bg-muted p-1.5 rounded-xl", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setAudience("individual"),
+            className: `px-6 sm:px-8 py-2.5 rounded-lg text-sm font-semibold transition-all ${audience === "individual" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
+            children: "Individual"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setAudience("enterprise"),
+            className: `px-6 sm:px-8 py-2.5 rounded-lg text-sm font-semibold transition-all ${audience === "enterprise" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
+            children: "Enterprise"
+          }
+        )
+      ] }) }),
+      (audience === "individual" || !props.showAudienceTabs) && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center bg-muted/60 p-1.5 rounded-xl", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setBillingCycle("monthly"),
+            className: `px-5 sm:px-6 py-2 rounded-lg text-sm font-medium transition-all ${billingCycle === "monthly" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
+            children: "Monthly"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setBillingCycle("yearly"),
+            className: `px-5 sm:px-6 py-2 rounded-lg text-sm font-medium transition-all ${billingCycle === "yearly" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
+            children: "Yearly"
+          }
+        )
+      ] }) }),
+      showCurrencySelector && /* @__PURE__ */ jsx("div", { className: "flex justify-center mt-4", children: /* @__PURE__ */ jsxs("label", { className: "inline-flex items-center gap-2 text-sm text-muted-foreground", children: [
+        /* @__PURE__ */ jsx("span", { children: "Currency" }),
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            value: activeCurrency ?? "",
+            onChange: (event) => {
+              const code = event.target.value;
+              setSelectedCurrency(code);
+              storeCurrency(code);
+            },
+            className: "h-9 rounded-md border border-input bg-background px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+            "data-testid": "pricing-currency-select",
+            children: currencyOptions.map((code) => /* @__PURE__ */ jsx("option", { value: code, children: code }, code))
+          }
+        )
+      ] }) })
+    ] }),
+    props.showAudienceTabs && audience === "enterprise" && /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl text-center mb-8", children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-xl sm:text-2xl font-bold text-foreground", children: props.enterpriseHeading || "Enterprise Solutions" }),
+      /* @__PURE__ */ jsx("p", { className: "mt-3 text-muted-foreground", children: props.enterpriseSubtitle || "Built for teams, agencies, and organizations that need advanced collaboration, security, support, and scale." })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "grid md:grid-cols-3 gap-6 sm:gap-8 max-w-6xl mx-auto items-stretch", children: props.showAudienceTabs && audience === "enterprise" ? (
+      /* Enterprise cards — from API, static prop, or built-in default */
+      resolvedEnterprisePlans.map((ep) => {
+        const subtitle = ep.subtitle || ep.description || "";
+        const btnText = ep.button || ep.ctaText || "Get Started";
+        const btnLink = ep.buttonLink || ep.ctaLink || props.appLoginUrl;
+        const period = ep.period || ep.interval || "";
+        const note = ep.note || "";
+        const badge = ep.badge || "";
+        const isPopular = ep.popular;
+        const features = ep.features || [];
+        const price = String(ep.price);
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `bg-card rounded-xl p-6 sm:p-8 transition-all duration-300 flex flex-col ${isPopular ? "border-2 border-primary shadow-xl ring-1 ring-primary/20" : "border hover:shadow-lg hover:border-primary/50"}`,
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "text-center mb-6", children: [
+                isPopular && badge && /* @__PURE__ */ jsx("span", { className: "inline-block bg-primary text-primary-foreground px-4 py-1 rounded-full text-xs font-semibold mb-3", children: badge }),
+                /* @__PURE__ */ jsx("h3", { className: "text-xl sm:text-2xl font-bold mb-2", children: ep.name }),
+                /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: subtitle })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "text-center mb-2", children: [
+                price === "Custom" ? /* @__PURE__ */ jsx("p", { className: "text-3xl sm:text-4xl font-bold", children: "Custom" }) : /* @__PURE__ */ jsxs("p", { className: "flex items-baseline justify-center gap-1", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-4xl sm:text-5xl font-extrabold", children: price }),
+                  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-lg", children: period })
+                ] }),
+                note && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm font-medium text-primary", children: note })
+              ] }),
+              /* @__PURE__ */ jsx("ul", { className: "space-y-3 mb-8 mt-6 flex-1", children: features.map((feature) => /* @__PURE__ */ jsxs(
+                "li",
+                {
+                  className: "text-sm flex items-start gap-2",
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "text-primary mt-0.5 flex-shrink-0", children: "\u2713" }),
+                    /* @__PURE__ */ jsx("span", { children: feature })
+                  ]
+                },
+                feature
+              )) }),
+              btnLink.startsWith("/") ? /* @__PURE__ */ jsx(
+                Button,
+                {
+                  className: "w-full h-11",
+                  variant: isPopular ? "default" : "outline",
+                  size: "lg",
+                  asChild: true,
+                  children: /* @__PURE__ */ jsx(
+                    "a",
+                    {
+                      href: btnLink,
+                      onClick: () => window.scrollTo({ top: 0, behavior: "smooth" }),
+                      children: btnText
+                    }
+                  )
+                }
+              ) : /* @__PURE__ */ jsx(
+                Button,
+                {
+                  className: "w-full h-11",
+                  variant: isPopular ? "default" : "outline",
+                  size: "lg",
+                  asChild: true,
+                  children: /* @__PURE__ */ jsx(
+                    "a",
+                    {
+                      href: btnLink,
+                      target: "_blank",
+                      rel: "noopener noreferrer",
+                      children: btnText
+                    }
+                  )
+                }
+              )
+            ]
+          },
+          ep.name
+        );
+      })
+    ) : (
+      /* Individual API-fetched cards */
+      plans.map((plan) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: `bg-card rounded-xl p-6 sm:p-8 transition-all duration-300 flex flex-col ${plan.popular ? "border-2 border-primary shadow-xl ring-1 ring-primary/20" : "border hover:shadow-lg hover:border-primary/50"}`,
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "text-center mb-6", children: [
+              plan.popular && /* @__PURE__ */ jsx("span", { className: "inline-block bg-primary text-primary-foreground px-4 py-1 rounded-full text-xs font-semibold mb-3", children: "Most Popular" }),
+              /* @__PURE__ */ jsx("h3", { className: "text-xl sm:text-2xl font-bold mb-2", children: plan.name }),
+              /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: plan.description })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "text-center mb-8", children: plan.price === "Custom" ? /* @__PURE__ */ jsx("p", { className: "text-3xl sm:text-4xl font-bold", children: "Custom" }) : /* @__PURE__ */ jsxs("p", { className: "flex items-baseline justify-center gap-1", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-4xl sm:text-5xl font-bold", children: plan.price }),
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-lg", children: plan.interval })
+            ] }) }),
+            /* @__PURE__ */ jsx("ul", { className: "space-y-3 mb-8 flex-1", children: plan.features.map((feature, index) => /* @__PURE__ */ jsxs(
+              "li",
+              {
+                className: "text-sm flex items-start gap-2",
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-primary mt-0.5 flex-shrink-0", children: "\u2713" }),
+                  /* @__PURE__ */ jsx("span", { children: feature })
+                ]
+              },
+              index
+            )) }),
+            plan.ctaLink.startsWith("/") ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                className: "w-full h-11",
+                variant: plan.popular ? "default" : "outline",
+                size: "lg",
+                asChild: true,
+                children: /* @__PURE__ */ jsx(
+                  "a",
+                  {
+                    href: plan.ctaLink,
+                    onClick: () => window.scrollTo({ top: 0, behavior: "smooth" }),
+                    children: plan.ctaText
+                  }
+                )
+              }
+            ) : /* @__PURE__ */ jsx(
+              Button,
+              {
+                className: "w-full h-11",
+                variant: plan.popular ? "default" : "outline",
+                size: "lg",
+                asChild: true,
+                children: /* @__PURE__ */ jsx(
+                  "a",
+                  {
+                    href: plan.ctaLink,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    children: plan.ctaText
+                  }
+                )
+              }
+            )
+          ]
+        },
+        plan.id
+      ))
+    ) })
+  ] }) });
+}
+function PricingPage(props) {
+  const {
+    productName,
+    heroHeading = "Simple, Transparent Pricing",
+    heroSubtitle = "Choose the plan that's right for you. No hidden fees, no surprises.",
+    seoTitle,
+    seoDescription,
+    seoKeywords,
+    seoImage,
+    seoUrl
+  } = props;
+  return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+    seoTitle && /* @__PURE__ */ jsx(
+      PageHead,
+      {
+        title: seoTitle,
+        description: seoDescription || heroSubtitle,
+        productName,
+        keywords: seoKeywords,
+        image: seoImage,
+        url: seoUrl
+      }
+    ),
+    /* @__PURE__ */ jsx("section", { className: "bg-gradient-to-b from-background to-muted/20 py-12 sm:py-16 md:py-20 lg:py-24", children: /* @__PURE__ */ jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxs("div", { className: "text-center max-w-3xl mx-auto", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-3xl sm:text-4xl md:text-5xl font-bold mb-4 sm:mb-6", children: heroHeading }),
+      /* @__PURE__ */ jsx("p", { className: "text-lg sm:text-xl text-muted-foreground leading-relaxed", children: heroSubtitle })
+    ] }) }) }),
+    /* @__PURE__ */ jsx(PricingSection, { ...props })
+  ] });
+}
+
+export { PricingPage, PricingProductKeyError, PricingSection, availablePlanCurrencies, cleanPlanDisplayName, isUuidLike, planPriceIn, resolveEnterprisePlans, resolvePricingProductKey, splitPlansByAudience, transformFeatureToLabel };
+//# sourceMappingURL=chunk-TGYQHO2E.mjs.map
+//# sourceMappingURL=chunk-TGYQHO2E.mjs.map