@salesmind-ai/design-system 0.5.0 → 0.7.0

package/dist/index-BxMqCbqE.d.ts

@@ -0,0 +1,1100 @@
+import * as React from 'react';
+import React__default from 'react';
+import { a as SectionShellProps } from './SectionShell-CrgrzWK6.js';
+
+type AuroraVoidIntensity = 'light' | 'base' | 'heavy';
+interface AuroraVoidProps {
+    /**
+     * Controls the intensity of the aurora gradients and vignette overlay.
+     * @default 'base'
+     */
+    intensity?: AuroraVoidIntensity;
+    /**
+     * When true, animates the aurora layer via a slow 30s transform rotation.
+     * Overridden by `static` prop and `prefers-reduced-motion`.
+     * @default true
+     */
+    animated?: boolean;
+    /**
+     * When true, disables all animation regardless of `animated`.
+     * Useful for screenshots, tests, or reduced-motion contexts.
+     * @default false
+     */
+    static?: boolean;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Child content rendered above the aurora layers. */
+    children?: React__default.ReactNode;
+}
+/**
+ * AuroraVoid — v2 page-level aurora background primitive.
+ *
+ * Renders a 3-gradient aurora trio (pink/gold/plum) + vignette overlay
+ * on a single full-frame absolutely-positioned div. Intended to sit behind
+ * all page content on hero and marketing surfaces.
+ *
+ * Implementation:
+ * - Single-element approach with stacked radial-gradient backgrounds
+ * - Animation via transform:rotate only (not gradient property animation)
+ * - prefers-reduced-motion: kills animation, holds static composition
+ *
+ * @since v2
+ * @replaces VoidBackground
+ */
+declare const AuroraVoid: React__default.ForwardRefExoticComponent<AuroraVoidProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface StickyActionBarProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** The main message or value prop to display */
+    message: React__default.ReactNode;
+    /** Primary call to action button */
+    primaryAction: React__default.ReactNode;
+    /** Optional secondary action */
+    secondaryAction?: React__default.ReactNode;
+    /** Threshold in pixels before showing the bar (default: 300) */
+    showThreshold?: number;
+    /** Position variant */
+    position?: 'top' | 'bottom';
+    /** Visual theme */
+    variant?: 'glass' | 'solid' | 'brand';
+}
+/**
+ * A floating action bar that appears after scrolling past a threshold,
+ * keeping primary CTAs accessible on long pages.
+ */
+declare const StickyActionBar: React__default.ForwardRefExoticComponent<StickyActionBarProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface BookingEmbedProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onError'> {
+    /** The Go High Level widget URL or other booking URL */
+    url: string;
+    /** Aspect ratio of the embed container (default: 16/9) */
+    aspectRatio?: string;
+    /** Title for the iframe accessibility */
+    title?: string;
+    /** Whether to lazy load the iframe */
+    lazyLoad?: boolean;
+    /** Reserve initial height to prevent CLS */
+    expectedHeight?: number;
+    /** Called on load timeout or load error */
+    onError?: (reason: 'timeout' | 'load-error') => void;
+    /** Called when iframe successfully loads or first setHeight arrives */
+    onReady?: () => void;
+    /** Custom analytics callback (e.g., for PostHog) */
+    onEvent?: (name: string, props: Record<string, string | number | boolean | undefined>) => void;
+    /** Show retry button on error */
+    showRetry?: boolean;
+    /** Max retry attempts before showing fallback link */
+    maxRetries?: number;
+    /** TEST/STORY ONLY: override 8000ms timeout */
+    timeoutMs?: number;
+}
+/**
+ * A responsive container for embedding booking widgets (like Go High Level or Calendly).
+ * Includes loading states, status state machine, 8s timeout, and analytics tracking.
+ */
+declare const BookingEmbed: React__default.ForwardRefExoticComponent<BookingEmbedProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface AgitationPoint {
+    /** The problem state (old way) */
+    problem: React__default.ReactNode;
+    /** The solution state (new way) */
+    solution: React__default.ReactNode;
+}
+interface ProblemAgitationProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Section title */
+    title: string;
+    /** Section description */
+    description?: React__default.ReactNode;
+    /** The points to compare */
+    points: AgitationPoint[];
+    /** Label for the old way column */
+    oldWayLabel?: string;
+    /** Label for the new way column */
+    newWayLabel?: string;
+}
+/**
+ * A "Before & After" or "Old Way vs New Way" comparison block,
+ * frequently used in marketing to agitate a problem before presenting
+ * the product as the solution.
+ */
+declare const ProblemAgitation: React__default.ForwardRefExoticComponent<ProblemAgitationProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** A single metric shown on the card */
+interface CaseStudyMetric {
+    /** Metric value (e.g., "312%") */
+    value: string;
+    /** Metric label (e.g., "increase in meetings") */
+    label: string;
+    /** Value prefix (e.g., "+") */
+    prefix?: string;
+    /** Value suffix (e.g., "%") */
+    suffix?: string;
+}
+interface CaseStudyCardProps extends React__default.HTMLAttributes<HTMLElement> {
+    /** Company name */
+    company: string;
+    /** Company logo */
+    logo?: React__default.ReactNode;
+    /** Industry tag */
+    industry?: string;
+    /** One-line outcome summary */
+    headline: string;
+    /** Key metrics achieved */
+    metrics?: CaseStudyMetric[];
+    /** Link to full case study */
+    href: string;
+    /** Optional cover image */
+    coverImage?: string;
+    /** Optional quote excerpt */
+    quote?: string;
+}
+/**
+ * Case study preview card with company info and key metrics.
+ *
+ * @example
+ * ```tsx
+ * <CaseStudyCard
+ *   company="Acme Corp"
+ *   industry="SaaS"
+ *   headline="312% increase in qualified meetings in 90 days"
+ *   metrics={[
+ *     { value: '312', suffix: '%', label: 'More meetings' },
+ *     { value: '45', suffix: '%', label: 'Lower cost per lead' },
+ *   ]}
+ *   href="/case-studies/acme-corp"
+ * />
+ * ```
+ */
+declare const CaseStudyCard: React__default.ForwardRefExoticComponent<CaseStudyCardProps & React__default.RefAttributes<HTMLElement>>;
+
+/** Item in the before or after column */
+interface BeforeAfterItem {
+    /** Item text */
+    text: string;
+    /** Sentiment affects visual treatment */
+    sentiment?: 'negative' | 'positive' | 'neutral';
+}
+/** One side of the comparison */
+interface BeforeAfterSide {
+    /** Column label (e.g., "Before SalesMind", "After SalesMind") */
+    label: string;
+    /** List of items */
+    items: BeforeAfterItem[];
+    /** Optional media */
+    media?: React__default.ReactNode;
+}
+interface BeforeAfterBlockProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title?: React__default.ReactNode;
+    /** Before state */
+    before: BeforeAfterSide;
+    /** After state */
+    after: BeforeAfterSide;
+    /** Layout variant */
+    variant?: 'split' | 'slider' | 'stacked';
+}
+/**
+ * Transformation visualization: before vs. after comparison.
+ *
+ * @example
+ * ```tsx
+ * <BeforeAfterBlock
+ *   title="The SalesMind Transformation"
+ *   before={{
+ *     label: 'Without SalesMind',
+ *     items: [
+ *       { text: 'Manual prospecting 40hrs/week', sentiment: 'negative' },
+ *       { text: 'Unpredictable pipeline', sentiment: 'negative' },
+ *     ],
+ *   }}
+ *   after={{
+ *     label: 'With SalesMind',
+ *     items: [
+ *       { text: 'AI handles outreach 24/7', sentiment: 'positive' },
+ *       { text: 'Predictable qualified meetings', sentiment: 'positive' },
+ *     ],
+ *   }}
+ *   variant="split"
+ * />
+ * ```
+ */
+declare const BeforeAfterBlock: React__default.ForwardRefExoticComponent<BeforeAfterBlockProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** A single comparison dimension */
+interface CompetitorDiffItem {
+    /** The dimension being compared (e.g., "Approach") */
+    dimension: string;
+    /** How the competitor/category handles it */
+    them: string;
+    /** How we handle it */
+    us: string;
+}
+interface CompetitorDiffProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Comparison items */
+    items: CompetitorDiffItem[];
+    /** Competitor/category label (e.g., "Traditional SDR tools") */
+    competitorLabel?: string;
+    /** Our label (e.g., "SalesMind AI") */
+    ourLabel?: string;
+    /** Layout variant */
+    variant?: 'table' | 'cards' | 'narrative';
+    /** Optional CTA */
+    cta?: {
+        label: string;
+        href: string;
+    };
+}
+/**
+ * Competitive differentiation block.
+ *
+ * @example
+ * ```tsx
+ * <CompetitorDiff
+ *   eyebrow="Why SalesMind"
+ *   title="Not Another LinkedIn Tool"
+ *   items={[
+ *     { dimension: 'Approach', them: 'Spray-and-pray sequences', us: 'AI-personalized at scale' },
+ *     { dimension: 'Setup', them: 'Weeks of configuration', us: 'Live in 48 hours' },
+ *   ]}
+ *   variant="table"
+ * />
+ * ```
+ */
+declare const CompetitorDiff: React__default.ForwardRefExoticComponent<CompetitorDiffProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** Status of a compliance certification */
+type ComplianceStatus = 'certified' | 'in-progress' | 'planned';
+/** A single compliance item */
+interface ComplianceItem {
+    /** Certification name */
+    name: string;
+    /** Current status */
+    status: ComplianceStatus;
+    /** Icon */
+    icon?: React__default.ReactNode;
+    /** Description */
+    description?: string;
+    /** Link to documentation or certificate */
+    documentHref?: string;
+}
+interface ComplianceGridProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Compliance items */
+    items: ComplianceItem[];
+}
+/**
+ * Compliance certifications grid with status badges.
+ *
+ * @example
+ * ```tsx
+ * <ComplianceGrid
+ *   eyebrow="Compliance"
+ *   title="Enterprise-Grade Security"
+ *   items={[
+ *     { name: 'SOC 2 Type II', status: 'certified', icon: <ShieldIcon /> },
+ *     { name: 'ISO 27001', status: 'in-progress', icon: <LockIcon /> },
+ *     { name: 'HIPAA', status: 'planned', icon: <HospitalIcon /> },
+ *   ]}
+ * />
+ * ```
+ */
+declare const ComplianceGrid: React__default.ForwardRefExoticComponent<ComplianceGridProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** Node type determines visual treatment */
+type ArchitectureNodeType = 'source' | 'process' | 'destination' | 'integration';
+/** A node in the architecture diagram */
+interface ArchitectureNode {
+    /** Unique identifier */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Optional icon */
+    icon?: React__default.ReactNode;
+    /** Node type affects styling */
+    type: ArchitectureNodeType;
+    /** Tooltip description */
+    description?: string;
+}
+/** A connection between two nodes */
+interface ArchitectureConnection {
+    /** Source node ID */
+    from: string;
+    /** Destination node ID */
+    to: string;
+    /** Connection label */
+    label?: string;
+    /** Show animated dashes */
+    animated?: boolean;
+}
+interface ArchitectureDiagramProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Nodes in the diagram */
+    nodes: ArchitectureNode[];
+    /** Connections between nodes */
+    connections: ArchitectureConnection[];
+    /** Flow direction */
+    direction?: 'horizontal' | 'vertical';
+}
+/**
+ * System architecture visualization with nodes and connections.
+ *
+ * @example
+ * ```tsx
+ * <ArchitectureDiagram
+ *   nodes={[
+ *     { id: 'linkedin', label: 'LinkedIn', type: 'source' },
+ *     { id: 'ai', label: 'SalesMind AI', type: 'process' },
+ *     { id: 'crm', label: 'CRM', type: 'destination' },
+ *   ]}
+ *   connections={[
+ *     { from: 'linkedin', to: 'ai', animated: true },
+ *     { from: 'ai', to: 'crm', animated: true },
+ *   ]}
+ *   direction="horizontal"
+ * />
+ * ```
+ */
+declare const ArchitectureDiagram: React__default.ForwardRefExoticComponent<ArchitectureDiagramProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface SegmentSwitchProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Active segment key */
+    segment?: string;
+    /** Map of segment keys to content */
+    segments: Record<string, React__default.ReactNode>;
+    /** Fallback content when no segment matches */
+    fallback?: React__default.ReactNode;
+    /** Segment source for auto-detection */
+    source?: 'utm' | 'cookie' | 'manual';
+    /** UTM parameter name (default: "utm_segment") */
+    utmParam?: string;
+    /** Cookie name (default: "ds_segment") */
+    cookieName?: string;
+}
+/**
+ * Segment-based content renderer.
+ *
+ * @example
+ * ```tsx
+ * <SegmentSwitch
+ *   segment="founder"
+ *   segments={{
+ *     founder: <FounderContent />,
+ *     operator: <OperatorContent />,
+ *   }}
+ *   fallback={<DefaultContent />}
+ * />
+ * ```
+ */
+declare const SegmentSwitch: React__default.ForwardRefExoticComponent<SegmentSwitchProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** What triggers a stage change */
+type IntentTriggerType = 'scroll' | 'time' | 'pages';
+/** A single CTA stage */
+interface IntentStage {
+    /** What triggers this stage */
+    trigger: {
+        type: IntentTriggerType;
+        threshold: number;
+    };
+    /** CTA label */
+    label: string;
+    /** CTA link */
+    href: string;
+    /** Button variant (escalates with intent) */
+    variant?: 'outline' | 'primary';
+}
+interface IntentCTAProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** CTA stages ordered by escalation */
+    stages: IntentStage[];
+    /** Default CTA (shown before any stage triggers) */
+    defaultCta: {
+        label: string;
+        href: string;
+        variant?: 'outline' | 'primary';
+    };
+    /** External page count for 'pages' trigger type (tracked by consuming app) */
+    pageCount?: number;
+}
+/**
+ * Adaptive CTA that escalates with demonstrated visitor intent.
+ *
+ * @example
+ * ```tsx
+ * <IntentCTA
+ *   defaultCta={{ label: 'Learn More', href: '/about', variant: 'outline' }}
+ *   stages={[
+ *     { trigger: { type: 'scroll', threshold: 50 }, label: 'See Pricing', href: '/pricing', variant: 'outline' },
+ *     { trigger: { type: 'time', threshold: 30 }, label: 'Book a Demo', href: '/demo', variant: 'primary' },
+ *     { trigger: { type: 'scroll', threshold: 80 }, label: 'Start Free Trial', href: '/signup', variant: 'primary' },
+ *   ]}
+ * />
+ * ```
+ */
+declare const IntentCTA: React__default.ForwardRefExoticComponent<IntentCTAProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** Sentiment determines visual treatment */
+type EraSentiment = 'past' | 'present' | 'future';
+/** A single era in the evolution */
+interface EvolutionEra {
+    /** Era label (e.g., "Manual SDRs") */
+    label: string;
+    /** Time period (e.g., "2010-2018") */
+    period: string;
+    /** Era description */
+    description: string;
+    /** Characteristics of this era */
+    traits: string[];
+    /** Whether this is the current/highlighted era */
+    current?: boolean;
+    /** Icon or illustration */
+    icon?: React__default.ReactNode;
+    /** Visual sentiment — past eras fade, future glows */
+    sentiment: EraSentiment;
+}
+interface EvolutionTimelineProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Evolution eras */
+    eras: EvolutionEra[];
+    /** "You are here" indicator (index) */
+    youAreHere?: number;
+    /** CTA after timeline */
+    cta?: {
+        label: string;
+        href: string;
+    };
+}
+/**
+ * Category evolution timeline — positions SalesMind as the inevitable next phase.
+ *
+ * @example
+ * ```tsx
+ * <EvolutionTimeline
+ *   eyebrow="The Evolution"
+ *   title="From Tools to Infrastructure"
+ *   eras={[
+ *     { label: 'Manual SDRs', period: '2010-2018', description: '...', traits: [...], sentiment: 'past' },
+ *     { label: 'Automation Tools', period: '2018-2024', description: '...', traits: [...], sentiment: 'present', current: true },
+ *     { label: 'Pipeline Infrastructure', period: '2024+', description: '...', traits: [...], sentiment: 'future' },
+ *   ]}
+ *   youAreHere={1}
+ * />
+ * ```
+ */
+declare const EvolutionTimeline: React__default.ForwardRefExoticComponent<EvolutionTimelineProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** A single ecosystem layer */
+interface EcosystemLayer {
+    /** Layer name */
+    name: string;
+    /** Short description */
+    description: string;
+    /** Key capabilities */
+    capabilities: string[];
+    /** Icon */
+    icon?: React__default.ReactNode;
+}
+/** A connection between layers */
+interface EcosystemConnection {
+    /** From layer index */
+    from: number;
+    /** To layer index */
+    to: number;
+    /** What flows between layers */
+    label: string;
+}
+interface EcosystemDiagramProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Ecosystem layers (typically 3) */
+    layers: EcosystemLayer[];
+    /** Connections between layers (flywheel arrows) */
+    connections: EcosystemConnection[];
+    /** Layout variant */
+    variant?: 'flywheel' | 'pyramid' | 'concentric';
+    /** Center label (e.g., "Predictable Pipeline") */
+    centerLabel?: string;
+}
+/**
+ * Ecosystem flywheel / pyramid / concentric diagram.
+ *
+ * @example
+ * ```tsx
+ * <EcosystemDiagram
+ *   title="The SalesMind Ecosystem"
+ *   layers={[
+ *     { name: 'AI Software', description: '...', capabilities: ['...'] },
+ *     { name: 'Compound Intelligence', description: '...', capabilities: ['...'] },
+ *     { name: 'Expert Operations', description: '...', capabilities: ['...'] },
+ *   ]}
+ *   connections={[
+ *     { from: 0, to: 1, label: 'Interaction data' },
+ *     { from: 1, to: 2, label: 'AI insights' },
+ *     { from: 2, to: 0, label: 'Human refinements' },
+ *   ]}
+ *   centerLabel="Predictable Pipeline"
+ *   variant="flywheel"
+ * />
+ * ```
+ */
+declare const EcosystemDiagram: React__default.ForwardRefExoticComponent<EcosystemDiagramProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** Calculator input definition */
+interface ValueAnchorInput {
+    /** Input name (form key) */
+    name: string;
+    /** Display label */
+    label: string;
+    /** Input type */
+    type: 'number' | 'slider';
+    /** Default value */
+    defaultValue: number;
+    /** Min for slider */
+    min?: number;
+    /** Max for slider */
+    max?: number;
+    /** Step for slider */
+    step?: number;
+    /** Display prefix (e.g., "$") */
+    prefix?: string;
+    /** Display suffix (e.g., "%") */
+    suffix?: string;
+}
+/** Calculator output */
+interface ValueAnchorOutput {
+    /** Primary metric (large display) */
+    primaryMetric: {
+        value: number;
+        label: string;
+        prefix?: string;
+        suffix?: string;
+    };
+    /** Supporting metrics */
+    secondaryMetrics: Array<{
+        value: number;
+        label: string;
+        prefix?: string;
+        suffix?: string;
+    }>;
+    /** Optional cost comparison */
+    costComparison?: {
+        without: {
+            value: number;
+            label: string;
+        };
+        with: {
+            value: number;
+            label: string;
+        };
+        savings: {
+            value: number;
+            label: string;
+        };
+    };
+}
+interface ValueAnchorProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Calculator inputs */
+    inputs: ValueAnchorInput[];
+    /** Calculation function */
+    calculate: (values: Record<string, number>) => ValueAnchorOutput;
+    /** CTA shown after calculation */
+    cta?: {
+        label: string;
+        href: string;
+    };
+}
+/**
+ * Pipeline value calculator — anchors on outcome value before showing cost.
+ *
+ * @example
+ * ```tsx
+ * <ValueAnchor
+ *   title="See Your Pipeline Potential"
+ *   inputs={[
+ *     { name: 'meetings', label: 'Monthly meetings', type: 'slider', defaultValue: 10, min: 5, max: 50 },
+ *     { name: 'dealSize', label: 'Avg deal size', type: 'number', defaultValue: 5000, prefix: '$' },
+ *   ]}
+ *   calculate={(v) => ({
+ *     primaryMetric: { value: v.meetings * 12 * v.dealSize * 0.2, label: 'Annual Pipeline Value', prefix: '$' },
+ *     secondaryMetrics: [...],
+ *   })}
+ * />
+ * ```
+ */
+declare const ValueAnchor: React__default.ForwardRefExoticComponent<ValueAnchorProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** Status of a trust signal item */
+type EnterpriseSignalStatus = 'active' | 'in-progress' | 'planned';
+/** A single trust signal item */
+interface EnterpriseSignalItem {
+    /** Signal name (e.g., "SOC 2 Type II") */
+    name: string;
+    /** Status */
+    status: EnterpriseSignalStatus;
+    /** Detail text */
+    detail?: string;
+    /** Link to documentation */
+    href?: string;
+}
+/** A category of trust signals */
+interface EnterpriseSignalCategory {
+    /** Category name (e.g., "Security") */
+    name: string;
+    /** Category icon */
+    icon?: React__default.ReactNode;
+    /** Items in this category */
+    items: EnterpriseSignalItem[];
+}
+/** SLA commitment */
+interface EnterpriseSLA {
+    /** Metric name */
+    metric: string;
+    /** SLA commitment */
+    commitment: string;
+    /** Current actual value */
+    current?: string;
+}
+interface EnterpriseSignalingProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Trust signal categories */
+    categories: EnterpriseSignalCategory[];
+    /** SLA commitments */
+    sla?: EnterpriseSLA[];
+    /** Layout variant */
+    variant?: 'full' | 'compact' | 'strip';
+}
+/**
+ * Enterprise trust and procurement enablement block.
+ *
+ * @example
+ * ```tsx
+ * <EnterpriseSignaling
+ *   title="Enterprise-Ready"
+ *   categories={[
+ *     { name: 'Security', items: [{ name: 'GDPR', status: 'active' }] },
+ *   ]}
+ *   sla={[{ metric: 'Uptime', commitment: '99.9%', current: '99.97%' }]}
+ *   variant="full"
+ * />
+ * ```
+ */
+declare const EnterpriseSignaling: React__default.ForwardRefExoticComponent<EnterpriseSignalingProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** A compound intelligence metric */
+interface IntelligenceMetric {
+    /** Target value */
+    value: number;
+    /** Label below the number */
+    label: string;
+    /** Value prefix */
+    prefix?: string;
+    /** Value suffix */
+    suffix?: string;
+    /** Growth indicator text */
+    growth?: string;
+}
+/** A compound intelligence capability */
+interface IntelligenceCapability {
+    /** Capability title */
+    title: string;
+    /** Description */
+    description: string;
+    /** Icon */
+    icon?: React__default.ReactNode;
+    /** Compounding example */
+    compoundingExample?: {
+        before: string;
+        after: string;
+        timeframe: string;
+    };
+}
+interface IntelligenceBlockProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Intelligence metrics */
+    metrics: IntelligenceMetric[];
+    /** Intelligence capabilities */
+    capabilities: IntelligenceCapability[];
+    /** Visual variant */
+    variant?: 'metrics-first' | 'capabilities-first' | 'timeline';
+}
+/**
+ * Data compound effect visualization.
+ *
+ * @example
+ * ```tsx
+ * <IntelligenceBlock
+ *   title="Intelligence That Compounds"
+ *   metrics={[
+ *     { value: 2000000, suffix: '+', label: 'Prospect Interactions' },
+ *   ]}
+ *   capabilities={[
+ *     { title: 'Message Optimization', description: '...',
+ *       compoundingExample: { before: 'Generic templates', after: 'Persona-specific scripts', timeframe: '6 months' } },
+ *   ]}
+ * />
+ * ```
+ */
+declare const IntelligenceBlock: React__default.ForwardRefExoticComponent<IntelligenceBlockProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/** Calculator input */
+interface PartnerCalcInput {
+    /** Input name */
+    name: string;
+    /** Display label */
+    label: string;
+    /** Input type */
+    type: 'number' | 'slider';
+    /** Default value */
+    defaultValue: number;
+    /** Min value */
+    min?: number;
+    /** Max value */
+    max?: number;
+    /** Display prefix */
+    prefix?: string;
+    /** Display suffix */
+    suffix?: string;
+}
+/** Calculator output */
+interface PartnerCalcOutput {
+    monthlyRevenue: number;
+    monthlyCost: number;
+    monthlyMargin: number;
+    marginPercentage: number;
+    annualRevenue: number;
+}
+/** Partner benefit */
+interface PartnerBenefit {
+    title: string;
+    description: string;
+    icon?: React__default.ReactNode;
+}
+/** Build-vs-buy differentiator */
+interface PartnerDifferentiator {
+    dimension: string;
+    buildInHouse: string;
+    withPartner: string;
+}
+interface PartnerValuePropProps extends Omit<SectionShellProps, 'title'> {
+    /** Section eyebrow */
+    eyebrow?: React__default.ReactNode;
+    /** Section title */
+    title: React__default.ReactNode;
+    /** Section subtitle */
+    subtitle?: React__default.ReactNode;
+    /** Calculator configuration */
+    calculator?: {
+        inputs: PartnerCalcInput[];
+        calculate: (values: Record<string, number>) => PartnerCalcOutput;
+    };
+    /** Partner benefits */
+    benefits: PartnerBenefit[];
+    /** Build-vs-buy comparison */
+    differentiators?: PartnerDifferentiator[];
+    /** Comparison section title */
+    differentiatorTitle?: string;
+    /** Column header for the "build" option */
+    differentiatorBuildLabel?: string;
+    /** Column header for the partner/white-label option */
+    differentiatorPartnerLabel?: string;
+    /** CTA */
+    cta: {
+        label: string;
+        href: string;
+    };
+}
+/**
+ * White-label partner economics and value proposition.
+ *
+ * @example
+ * ```tsx
+ * <PartnerValueProp
+ *   title="Partner With SalesMind"
+ *   benefits={[{ title: 'White-Label', description: 'Your brand, our tech.' }]}
+ *   cta={{ label: 'Apply Now', href: '/partners/apply' }}
+ * />
+ * ```
+ */
+declare const PartnerValueProp: React__default.ForwardRefExoticComponent<PartnerValuePropProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface PricingFeature {
+    /** Feature label text */
+    text: string;
+    /** Whether this feature is included in the tier */
+    included?: boolean;
+    /** Optional tooltip or emphasis text */
+    detail?: string;
+}
+interface PricingCardProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Tier label (e.g. "Operator Mode", "Founder Mode") */
+    tier: string;
+    /** Short tagline under the tier name */
+    tagline?: string;
+    /** Price display string (e.g. "$1,499", "$999") */
+    price: string;
+    /** Price suffix (e.g. "/month", "one-time") */
+    priceSuffix?: string;
+    /** Previous/anchor price for strikethrough display */
+    anchorPrice?: string;
+    /** Badge text (e.g. "Most Popular", "Best Value") */
+    badge?: string;
+    /** Whether this card is visually highlighted as the recommended option */
+    highlighted?: boolean;
+    /** List of features included in this tier */
+    features?: PricingFeature[];
+    /** Primary CTA button content */
+    cta?: React__default.ReactNode;
+    /** Optional secondary action below CTA */
+    secondaryCta?: React__default.ReactNode;
+    /** Footer note text (e.g. "3-month minimum") */
+    footerNote?: string;
+}
+declare const PricingCard: React__default.ForwardRefExoticComponent<PricingCardProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface ComparisonColumn {
+    /** Column heading (e.g. "Hiring SDRs", "SalesMind") */
+    label: string;
+    /** Whether this column is highlighted as the recommended option */
+    highlighted?: boolean;
+    /** Optional badge above the column header */
+    badge?: string;
+}
+interface ComparisonRow {
+    /** Row label (the thing being compared) */
+    label: string;
+    /** Values for each column, in the same order as columns */
+    values: (string | React__default.ReactNode)[];
+    /** Optional category divider — if true, renders as a category header */
+    isCategory?: boolean;
+}
+interface ComparisonTableProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Column definitions */
+    columns: ComparisonColumn[];
+    /** Row data */
+    rows: ComparisonRow[];
+    /** Optional table caption for accessibility */
+    caption?: string;
+}
+declare const ComparisonTable: React__default.ForwardRefExoticComponent<ComparisonTableProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface GuaranteeHighlightProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** The guarantee statement (e.g. "10+ qualified meetings per month") */
+    guarantee: string;
+    /** Supporting detail or condition text */
+    detail?: string;
+    /** Optional fine print (e.g. "Guarantee activates after onboarding alignment") */
+    finePrint?: string;
+    /** Visual variant */
+    variant?: 'default' | 'brand' | 'minimal';
+    /** Optional icon — pass a React node (e.g. an SVG) */
+    icon?: React__default.ReactNode;
+}
+declare const GuaranteeHighlight: React__default.ForwardRefExoticComponent<GuaranteeHighlightProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface ROIComparisonItem {
+    /** Label (e.g. "Hiring 3 SDRs") */
+    label: string;
+    /** Monthly cost string */
+    monthlyCost: string;
+    /** Annual cost string */
+    annualCost: string;
+    /** Whether this item is the "winner" (highlighted) */
+    isRecommended?: boolean;
+    /** Additional context text */
+    context?: string;
+}
+interface ROICalculatorProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Section eyebrow text */
+    eyebrow?: string;
+    /** Section title */
+    title?: string;
+    /** Comparison items to display */
+    items: ROIComparisonItem[];
+    /** Optional summary text below the comparison */
+    summary?: React__default.ReactNode;
+    /** Optional savings callout (e.g. "Save $120,000/year") */
+    savingsCallout?: string;
+}
+declare const ROICalculator: React__default.ForwardRefExoticComponent<ROICalculatorProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface ICPFilterItem {
+    /** Description text */
+    text: string;
+}
+interface ICPFilterProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Items describing who this IS for */
+    qualifiedItems: ICPFilterItem[];
+    /** Items describing who this is NOT for */
+    disqualifiedItems: ICPFilterItem[];
+    /** Heading for the qualified column */
+    qualifiedHeading?: string;
+    /** Heading for the disqualified column */
+    disqualifiedHeading?: string;
+    /** Layout variant */
+    variant?: 'columns' | 'stacked';
+}
+declare const ICPFilter: React__default.ForwardRefExoticComponent<ICPFilterProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface ObjectionItem {
+    /** The objection/question (e.g. "Is this just LinkedIn automation?") */
+    question: string;
+    /** The strategic answer/reframe */
+    answer: string;
+    /** Optional tag/category (e.g. "Safety", "Quality", "Process") */
+    tag?: string;
+}
+interface ObjectionFAQProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** List of objection items */
+    items: ObjectionItem[];
+    /** Section title */
+    title?: string;
+    /** Section subtitle */
+    subtitle?: string;
+    /** Whether multiple items can be open simultaneously */
+    allowMultiple?: boolean;
+    /** Initial open item index */
+    defaultOpenIndex?: number;
+}
+declare const ObjectionFAQ: React__default.ForwardRefExoticComponent<ObjectionFAQProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface KPITrend {
+    /** Direction of the trend arrow. */
+    direction: 'up' | 'down';
+    /** Formatted delta string, e.g. "16%", "+$1.2M". */
+    delta: string;
+    /**
+     * Semantic valence — determines colour of the trend indicator.
+     * Defaults to green for 'up', red for 'down' when not specified.
+     */
+    valence?: 'positive' | 'negative' | 'neutral';
+}
+interface KPICell {
+    /** Tiny UPPERCASE metric label, e.g. "LEADS". */
+    label: string;
+    /** Large formatted value, e.g. "1,248", "$3.4M". */
+    value: string;
+    /** Optional trend indicator with direction, delta and semantic valence. */
+    trend?: KPITrend;
+    /**
+     * D8 provenance string — data source footnote rendered below the trend.
+     * @example "7-day rolling avg"
+     * @since v2
+     */
+    provenance?: string;
+}
+interface KPIPanelProps {
+    /**
+     * Array of KPI cell definitions. Renders in a responsive CSS grid:
+     * - mobile: 1 column
+     * - md (≥768px): 2 columns
+     * - lg (≥1024px): 4 columns
+     *
+     * Default cells mirror Figma Showcase 05.
+     */
+    cells?: KPICell[];
+    /** Additional CSS class names. */
+    className?: string;
+}
+/**
+ * KPIPanel — 4-cell composed metric panel with provenance (D8).
+ *
+ * Composes 4 Card v2 instances (tier=1) in a responsive CSS grid.
+ * Each cell shows a label, value, optional trend indicator, and optional provenance.
+ *
+ * @example
+ * <KPIPanel />
+ * <KPIPanel cells={[{ label: 'MRR', value: '$24K', trend: { direction: 'up', delta: '12%' } }]} />
+ */
+declare const KPIPanel: React.ForwardRefExoticComponent<KPIPanelProps & React.RefAttributes<HTMLDivElement>>;
+
+interface HeroCompositionProps {
+    /**
+     * Headline lines. The first character of the first line receives the
+     * C3 Anton drop-cap treatment (`::first-letter`).
+     *
+     * @example ['Pipeline that runs', 'while you sleep']
+     * @default ['Pipeline that runs', 'while you sleep']
+     */
+    headline?: string[];
+    /**
+     * Body copy rendered below the headline.
+     */
+    subline?: string;
+    /**
+     * Optional eyebrow label rendered above the headline (all-caps).
+     * @example 'PIPELINE OPERATING SYSTEM'
+     */
+    eyebrow?: string;
+    /**
+     * KPI cells passed directly to the KPIPanel in the right column.
+     * Defaults to KPIPanel's own defaults (Figma Showcase 05 data).
+     */
+    metrics?: KPIPanelProps['cells'];
+    /**
+     * D5 headline tone variant.
+     * - `'sentence'` — normal sentence-case rendering (default)
+     * - `'shouty'` — ALL-CAPS via CSS `text-transform: uppercase`
+     * @default 'sentence'
+     */
+    tone?: 'sentence' | 'shouty';
+    /** Additional CSS class names. */
+    className?: string;
+}
+/**
+ * HeroComposition — full v2 hero with aurora + grid + Anton drop-cap (C3 finalist).
+ *
+ * Layer order (back to front):
+ * 1. `<AuroraVoid />` — animated aurora background
+ * 2. `<Vignette />` — radial-gradient dark mask
+ * 3. `<GridOverlay />` — 64px grid lines
+ * 4. 2-column content (headline + KPIPanel)
+ *
+ * **C3 drop-cap signature**: First letter of the first headline line uses
+ * `::first-letter` at 5.25em in Anton with aurora-primary colour.
+ *
+ * @example
+ * <HeroComposition
+ *   eyebrow="PIPELINE OPERATING SYSTEM"
+ *   headline={['Pipeline that runs', 'while you sleep']}
+ *   subline="Outbound sequences powered by intent signals."
+ *   tone="sentence"
+ * />
+ */
+declare const HeroComposition: React.ForwardRefExoticComponent<HeroCompositionProps & React.RefAttributes<HTMLDivElement>>;
+
+export { type IntelligenceMetric as $, type AgitationPoint as A, BeforeAfterBlock as B, CaseStudyCard as C, EcosystemDiagram as D, type EcosystemConnection as E, type EcosystemDiagramProps as F, type EcosystemLayer as G, type EnterpriseSLA as H, type EnterpriseSignalCategory as I, type EnterpriseSignalItem as J, type EnterpriseSignalStatus as K, EnterpriseSignaling as L, type EnterpriseSignalingProps as M, type EraSentiment as N, type EvolutionEra as O, EvolutionTimeline as P, type EvolutionTimelineProps as Q, GuaranteeHighlight as R, type GuaranteeHighlightProps as S, HeroComposition as T, type HeroCompositionProps as U, ICPFilter as V, type ICPFilterItem as W, type ICPFilterProps as X, IntelligenceBlock as Y, type IntelligenceBlockProps as Z, type IntelligenceCapability as _, type ArchitectureConnection as a, IntentCTA as a0, type IntentCTAProps as a1, type IntentStage as a2, type IntentTriggerType as a3, type KPICell as a4, KPIPanel as a5, type KPIPanelProps as a6, type KPITrend as a7, ObjectionFAQ as a8, type ObjectionFAQProps as a9, type ObjectionItem as aa, type PartnerBenefit as ab, type PartnerCalcInput as ac, type PartnerCalcOutput as ad, type PartnerDifferentiator as ae, PartnerValueProp as af, type PartnerValuePropProps as ag, PricingCard as ah, type PricingCardProps as ai, type PricingFeature as aj, ProblemAgitation as ak, type ProblemAgitationProps as al, ROICalculator as am, type ROICalculatorProps as an, type ROIComparisonItem as ao, SegmentSwitch as ap, type SegmentSwitchProps as aq, StickyActionBar as ar, type StickyActionBarProps as as, ValueAnchor as at, type ValueAnchorInput as au, type ValueAnchorOutput as av, type ValueAnchorProps as aw, ArchitectureDiagram as b, type ArchitectureDiagramProps as c, type ArchitectureNode as d, type ArchitectureNodeType as e, AuroraVoid as f, type AuroraVoidIntensity as g, type AuroraVoidProps as h, type BeforeAfterBlockProps as i, type BeforeAfterItem as j, type BeforeAfterSide as k, BookingEmbed as l, type BookingEmbedProps as m, type CaseStudyCardProps as n, type CaseStudyMetric as o, type ComparisonColumn as p, type ComparisonRow as q, ComparisonTable as r, type ComparisonTableProps as s, CompetitorDiff as t, type CompetitorDiffItem as u, type CompetitorDiffProps as v, ComplianceGrid as w, type ComplianceGridProps as x, type ComplianceItem as y, type ComplianceStatus as z };