@burdenoff/website-sdk 0.0.0-dev

package/dist/components/pricing.d.ts

@@ -0,0 +1,194 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * Pricing Component
+ * GraphQL-powered pricing component with quota-based features and monthly/yearly toggle
+ *
+ * @example
+ * ```tsx
+ * import { PricingPage, PricingSection } from '@burdenoff/website-sdk/components/pricing'
+ *
+ * // Full page with hero
+ * <PricingPage
+ *   productName="BigConsole"
+ *   productId="bigconsole-123"
+ *   appLoginUrl="https://app.bigconsole.com/login"
+ *   contactUrl="/contact"
+ *   fallbackFeatures={{
+ *     basic: ['Up to 5 dashboards', '10 data sources'],
+ *     professional: ['Unlimited dashboards', 'API access'],
+ *     enterprise: ['Everything in Professional', 'Dedicated support']
+ *   }}
+ * />
+ *
+ * // Embeddable section
+ * <PricingSection {...props} id="pricing" className="bg-muted/30" />
+ * ```
+ */
+interface PlanCard {
+    id: string;
+    name: string;
+    price: number;
+    currency: string;
+    currencyPrices?: Record<string, number> | null;
+    duration: string;
+    features: Array<{
+        id: string;
+        quotaId?: string | null;
+        quota?: {
+            id: string;
+            name: string;
+            limits?: unknown;
+        } | null;
+    }>;
+    isActive: boolean;
+    productID?: string | null;
+}
+interface CurrencyConfig {
+    code: string;
+    symbol: string;
+    position: "prefix" | "suffix";
+}
+interface PlanMetadata {
+    tier: "basic" | "professional" | "enterprise";
+    displayName: string;
+    defaultDescription: string;
+    popular: boolean;
+    ctaText: string;
+    ctaType: "signup" | "contact";
+    /**
+     * Curated feature bullets for this specific plan. When provided, these win
+     * over the tier-based `fallbackFeatures` and the raw quota list — letting a
+     * consumer differentiate plans that share a tier keyword (e.g. Free vs Hobby,
+     * Pro vs Team) with concise, accurate copy.
+     */
+    features?: string[];
+}
+interface PricingProps {
+    /**
+     * Product name (used in branding and SEO)
+     */
+    productName?: string;
+    /**
+     * Product ID for GraphQL query (falls back to WebSDKConfig.productId)
+     */
+    productId?: string;
+    /**
+     * App login URL for signup CTA
+     */
+    appLoginUrl: string;
+    /**
+     * Contact page URL for enterprise CTA
+     * @default '/contact'
+     */
+    contactUrl?: string;
+    /**
+     * Supported currencies
+     */
+    currencies?: Record<string, CurrencyConfig>;
+    /**
+     * Billing interval display text
+     */
+    billingIntervals?: Record<string, string>;
+    /**
+     * Plan metadata (tier info, CTA text, etc.)
+     */
+    planMetadata?: Record<string, Partial<PlanMetadata>>;
+    /**
+     * Fallback features when API doesn't provide them or is unavailable
+     */
+    fallbackFeatures?: {
+        basic?: string[];
+        professional?: string[];
+        enterprise?: string[];
+    };
+    /**
+     * Enable audience tabs (Individual / Enterprise).
+     * When enabled, shows a two-level tab system.
+     * @default false
+     */
+    showAudienceTabs?: boolean;
+    /**
+     * Enterprise plans to show when Enterprise tab is selected.
+     * Each entry defines a static plan card (not fetched from API).
+     */
+    enterprisePlans?: Array<{
+        name: string;
+        subtitle: string;
+        price: string;
+        period: string;
+        note?: string;
+        button: string;
+        buttonLink: string;
+        popular: boolean;
+        badge?: string;
+        features: string[];
+    }>;
+    /**
+     * Enterprise section heading
+     * @default 'Enterprise Solutions'
+     */
+    enterpriseHeading?: string;
+    /**
+     * Enterprise section subtitle
+     */
+    enterpriseSubtitle?: string;
+    /**
+     * Hero section heading (for PricingPage)
+     * @default 'Simple, Transparent Pricing'
+     */
+    heroHeading?: string;
+    /**
+     * Hero section subtitle (for PricingPage)
+     * @default "Choose the plan that's right for you. No hidden fees, no surprises."
+     */
+    heroSubtitle?: string;
+    /**
+     * Section heading (for PricingSection)
+     * @default 'Pricing Plans'
+     */
+    sectionHeading?: string;
+    /**
+     * Section subtitle (for PricingSection)
+     * @default 'Choose the perfect plan for your needs'
+     */
+    sectionSubtitle?: string;
+    /**
+     * Custom CSS class
+     */
+    className?: string;
+    /**
+     * Section ID for anchor links
+     */
+    id?: string;
+    /**
+     * SEO: Page title (optional, for PricingPage)
+     */
+    seoTitle?: string;
+    /**
+     * SEO: Page description (optional, for PricingPage)
+     */
+    seoDescription?: string;
+    /**
+     * SEO: Keywords (optional, for PricingPage)
+     */
+    seoKeywords?: string;
+    /**
+     * SEO: OG Image URL (optional, for PricingPage)
+     */
+    seoImage?: string;
+    /**
+     * SEO: Canonical URL (optional, for PricingPage)
+     */
+    seoUrl?: string;
+}
+/**
+ * Pricing Section Component - Embeddable
+ */
+declare function PricingSection(props: PricingProps): react_jsx_runtime.JSX.Element;
+/**
+ * Pricing Page Component - Full Page with Hero
+ */
+declare function PricingPage(props: PricingProps): react_jsx_runtime.JSX.Element;
+
+export { type PlanCard, PricingPage, type PricingProps, PricingSection };