react-component-kit-ui 0.0.0-stage → 0.1.0

package/dist/types/components/lib/sections/FeatureIconGrid.d.ts

@@ -0,0 +1,33 @@
+import './FeatureIconGrid.css';
+interface Feature {
+    icon: string;
+    title: string;
+    text: string;
+    href?: string;
+}
+/**
+ * FeatureIconGrid — Classic 3-column feature grid with SVG icons, titles,
+ * descriptions and optional "learn more" links. Cards light up on hover/focus.
+ *
+ * @param {string} eyebrow - Small label above the heading.
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{icon: string, title: string, text: string, href?: string}>} features - Feature cards.
+ *   `icon` is one of: bolt, shield, layers, chart, globe, code, sparkles, lock, users.
+ * @param {number} columns - Max columns on desktop (2|3|4).
+ * @param {string} variant - Card style (card|plain|bordered).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface FeatureIconGridProps {
+    eyebrow?: string;
+    title?: string;
+    subtitle?: string;
+    features?: Feature[];
+    columns?: 2 | 3 | 4;
+    variant?: 'card' | 'plain' | 'bordered';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function FeatureIconGrid({ eyebrow, title, subtitle, features, columns, variant, size, className, }: FeatureIconGridProps): import("react").JSX.Element;
+export default FeatureIconGrid;

package/dist/types/components/lib/sections/FeatureTabsShowcase.d.ts

@@ -0,0 +1,30 @@
+import './FeatureTabsShowcase.css';
+interface Tab {
+    label: string;
+    title: string;
+    text: string;
+    points: string[];
+    stat: string;
+    statLabel: string;
+}
+/**
+ * FeatureTabsShowcase — Interactive feature section using the WAI-ARIA tabs
+ * pattern (arrow keys, Home/End) to switch between product capabilities.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{label: string, title: string, text: string, points: string[], stat: string, statLabel: string}>} tabs - Tab panels.
+ * @param {string} variant - Tab style (pills|underline|cards).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface FeatureTabsShowcaseProps {
+    title?: string;
+    subtitle?: string;
+    tabs?: Tab[];
+    variant?: 'pills' | 'underline' | 'cards';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function FeatureTabsShowcase({ title, subtitle, tabs, variant, size, className, }: FeatureTabsShowcaseProps): import("react").JSX.Element;
+export default FeatureTabsShowcase;

package/dist/types/components/lib/sections/FeatureTimelineFlow.d.ts

@@ -0,0 +1,16 @@
+import './FeatureTimelineFlow.css';
+/**
+ * FeatureTimelineFlow — Full-page step-by-step product architecture and workflow section with glowing nodes.
+ *
+ * @param {string} badge - Eyebrow badge text.
+ * @param {string} title - Section main heading.
+ * @param {string} subtitle - Description text.
+ */
+export interface FeatureTimelineFlowProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function FeatureTimelineFlow({ badge, title, subtitle, className }: FeatureTimelineFlowProps): import("react").JSX.Element;
+export default FeatureTimelineFlow;

package/dist/types/components/lib/sections/FeedbackShowcase.d.ts

@@ -0,0 +1,8 @@
+import './FeedbackShowcase.css';
+/** FeedbackShowcase */
+export interface FeedbackShowcaseProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function FeedbackShowcase({ title, subtitle }: FeedbackShowcaseProps): import("react").JSX.Element;
+export default FeedbackShowcase;

package/dist/types/components/lib/sections/FooterMegaSection.d.ts

@@ -0,0 +1,40 @@
+import './FooterMegaSection.css';
+interface Column {
+    title: string;
+    links: Array<{
+        label: string;
+        href: string;
+    }>;
+}
+interface Social {
+    label: string;
+    href: string;
+    icon: 'github' | 'x' | 'discord' | 'youtube';
+}
+/**
+ * FooterMegaSection — Full site footer: brand blurb, newsletter field, four link
+ * columns, social icons, system-status pill and legal row.
+ *
+ * @param {string} brand - Brand name.
+ * @param {string} tagline - Short brand description.
+ * @param {Array<{title: string, links: Array<{label: string, href: string}>}>} columns - Link columns.
+ * @param {Array<{label: string, href: string, icon: 'github'|'x'|'discord'|'youtube'}>} socials - Social links.
+ * @param {string} status - System status text (empty to hide).
+ * @param {string} copyright - Copyright line.
+ * @param {string} variant - Footer style (default|bordered|minimal).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface FooterMegaSectionProps {
+    brand?: string;
+    tagline?: string;
+    columns?: Column[];
+    socials?: Social[];
+    status?: string;
+    copyright?: string;
+    variant?: 'default' | 'bordered' | 'minimal';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function FooterMegaSection({ brand, tagline, columns, socials, status, copyright, variant, size, className, }: FooterMegaSectionProps): import("react").JSX.Element;
+export default FooterMegaSection;

package/dist/types/components/lib/sections/FormsShowcase.d.ts

@@ -0,0 +1,8 @@
+import './FormsShowcase.css';
+/** FormsShowcase */
+export interface FormsShowcaseProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function FormsShowcase({ title, subtitle }: FormsShowcaseProps): import("react").JSX.Element;
+export default FormsShowcase;

package/dist/types/components/lib/sections/HeroDashboardPreview.d.ts

@@ -0,0 +1,32 @@
+import './HeroDashboardPreview.css';
+/**
+ * HeroDashboardPreview — SaaS hero with headline, CTAs and a live-rendered
+ * product dashboard mockup built from the kit's own SVG charts.
+ *
+ * @param {string} badge - Eyebrow badge.
+ * @param {string} title - Headline.
+ * @param {string} subtitle - Supporting paragraph.
+ * @param {{label: string, href: string}} primary - Primary CTA.
+ * @param {{label: string, href: string}} secondary - Secondary CTA.
+ * @param {string} variant - Mockup frame (browser|floating|flat).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface HeroDashboardPreviewProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    primary?: {
+        label: string;
+        href: string;
+    };
+    secondary?: {
+        label: string;
+        href: string;
+    };
+    variant?: 'browser' | 'floating' | 'flat';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function HeroDashboardPreview({ badge, title, subtitle, primary, secondary, variant, size, className, }: HeroDashboardPreviewProps): import("react").JSX.Element;
+export default HeroDashboardPreview;

package/dist/types/components/lib/sections/HeroGlass.d.ts

@@ -0,0 +1,8 @@
+import './HeroGlass.css';
+/** HeroGlass */
+export interface HeroGlassProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function HeroGlass({ title, subtitle, }: HeroGlassProps): import("react").JSX.Element;
+export default HeroGlass;

package/dist/types/components/lib/sections/HeroGradient.d.ts

@@ -0,0 +1,8 @@
+import './HeroGradient.css';
+/** HeroGradient */
+export interface HeroGradientProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function HeroGradient({ title, subtitle, }: HeroGradientProps): import("react").JSX.Element;
+export default HeroGradient;

package/dist/types/components/lib/sections/HeroMinimalCentered.d.ts

@@ -0,0 +1,36 @@
+import './HeroMinimalCentered.css';
+/**
+ * HeroMinimalCentered — Typography-first centered hero with an announcement pill,
+ * two CTAs and a row of trust signals. No imagery, loads instantly.
+ *
+ * @param {string} announcement - Text in the top pill (empty to hide).
+ * @param {string} announcementHref - Link for the pill.
+ * @param {string} title - Main headline. Wrap a word in *asterisks* to highlight it.
+ * @param {string} subtitle - Supporting paragraph.
+ * @param {{label: string, href: string}} primary - Primary CTA.
+ * @param {{label: string, href: string}} secondary - Secondary CTA.
+ * @param {string[]} trust - Short trust signals under the CTAs.
+ * @param {string} variant - Background treatment (default|glow|grid).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface HeroMinimalCenteredProps {
+    announcement?: string;
+    announcementHref?: string;
+    title?: string;
+    subtitle?: string;
+    primary?: {
+        label: string;
+        href: string;
+    };
+    secondary?: {
+        label: string;
+        href: string;
+    };
+    trust?: string[];
+    variant?: 'default' | 'glow' | 'grid';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function HeroMinimalCentered({ announcement, announcementHref, title, subtitle, primary, secondary, trust, variant, size, className, }: HeroMinimalCenteredProps): import("react").JSX.Element;
+export default HeroMinimalCentered;

package/dist/types/components/lib/sections/HeroShowcaseSplit.d.ts

@@ -0,0 +1,25 @@
+import type { ReactNode } from 'react';
+import './HeroShowcaseSplit.css';
+/**
+ * HeroShowcaseSplit — Two-column modern landing hero section with install command, action CTAs, and interactive preview widget.
+ *
+ * @param {string} badge - Header lead badge. Default is 'NEW: REACT 19 SUITE'.
+ * @param {string} title - Primary headline string.
+ * @param {string} subtitle - Subtitle paragraph text.
+ * @param {string} primaryCtaText - Primary CTA button text.
+ * @param {string} primaryCtaHref - Primary CTA link.
+ * @param {string} secondaryCtaText - Secondary button text.
+ * @param {string} secondaryCtaHref - Secondary link.
+ */
+export interface HeroShowcaseSplitProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    primaryCtaText?: string;
+    primaryCtaHref?: string;
+    secondaryCtaText?: string;
+    secondaryCtaHref?: string;
+    children?: ReactNode;
+}
+export declare function HeroShowcaseSplit({ badge, title, subtitle, primaryCtaText, primaryCtaHref, secondaryCtaText, secondaryCtaHref, children }: HeroShowcaseSplitProps): import("react").JSX.Element;
+export default HeroShowcaseSplit;

package/dist/types/components/lib/sections/HeroSplit.d.ts

@@ -0,0 +1,8 @@
+import './HeroSplit.css';
+/** HeroSplit */
+export interface HeroSplitProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function HeroSplit({ title, subtitle, }: HeroSplitProps): import("react").JSX.Element;
+export default HeroSplit;

package/dist/types/components/lib/sections/HeroTerminal.d.ts

@@ -0,0 +1,35 @@
+import './HeroTerminal.css';
+interface Line {
+    type: 'cmd' | 'out' | 'ok';
+    text: string;
+}
+/**
+ * HeroTerminal — Developer-focused split hero with an animated terminal showing
+ * install and build commands, plus a copyable install snippet.
+ *
+ * @param {string} eyebrow - Small label above the title.
+ * @param {string} title - Headline.
+ * @param {string} subtitle - Supporting paragraph.
+ * @param {string} command - Install command shown in the copy field.
+ * @param {Array<{type: 'cmd'|'out'|'ok', text: string}>} lines - Terminal transcript.
+ * @param {{label: string, href: string}} primary - Primary CTA.
+ * @param {string} variant - Terminal style (default|glass|minimal).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface HeroTerminalProps {
+    eyebrow?: string;
+    title?: string;
+    subtitle?: string;
+    command?: string;
+    lines?: Line[];
+    primary?: {
+        label: string;
+        href: string;
+    };
+    variant?: 'default' | 'glass' | 'minimal';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function HeroTerminal({ eyebrow, title, subtitle, command, lines, primary, variant, size, className, }: HeroTerminalProps): import("react").JSX.Element;
+export default HeroTerminal;

package/dist/types/components/lib/sections/HeroWaitlist.d.ts

@@ -0,0 +1,30 @@
+import './HeroWaitlist.css';
+/**
+ * HeroWaitlist — Pre-launch hero with an accessible email capture form,
+ * inline validation, success state and avatar-stack social proof.
+ *
+ * @param {string} badge - Status pill text (e.g. 'Private beta').
+ * @param {string} title - Headline.
+ * @param {string} subtitle - Supporting paragraph.
+ * @param {string} action - Form action URL (posts `email`).
+ * @param {string} buttonLabel - Submit button text.
+ * @param {string} successMessage - Message after a valid submission.
+ * @param {number} count - Number of people already on the list.
+ * @param {string} variant - Background treatment (default|aurora|minimal).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface HeroWaitlistProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    action?: string;
+    buttonLabel?: string;
+    successMessage?: string;
+    count?: number;
+    variant?: 'default' | 'aurora' | 'minimal';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function HeroWaitlist({ badge, title, subtitle, action, buttonLabel, successMessage, count, variant, size, className, }: HeroWaitlistProps): import("react").JSX.Element;
+export default HeroWaitlist;

package/dist/types/components/lib/sections/HowItWorksSteps.d.ts

@@ -0,0 +1,32 @@
+import './HowItWorksSteps.css';
+interface Step {
+    title: string;
+    text: string;
+    time?: string;
+}
+/**
+ * HowItWorksSteps — Numbered process section ("How it works") with a connecting
+ * line between steps. Horizontal on desktop, vertical on mobile.
+ *
+ * @param {string} eyebrow - Small label above the heading.
+ * @param {string} title - Section heading.
+ * @param {Array<{title: string, text: string, time?: string}>} steps - Ordered steps.
+ * @param {{label: string, href: string}} cta - Optional CTA under the steps.
+ * @param {string} variant - Step marker style (numbers|dots|cards).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface HowItWorksStepsProps {
+    eyebrow?: string;
+    title?: string;
+    steps?: Step[];
+    cta?: {
+        label: string;
+        href: string;
+    };
+    variant?: 'numbers' | 'dots' | 'cards';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function HowItWorksSteps({ eyebrow, title, steps, cta, variant, size, className, }: HowItWorksStepsProps): import("react").JSX.Element;
+export default HowItWorksSteps;

package/dist/types/components/lib/sections/IntegrationsGrid.d.ts

@@ -0,0 +1,28 @@
+import './IntegrationsGrid.css';
+interface Item {
+    name: string;
+    category: string;
+    description: string;
+    status?: 'available' | 'beta' | 'soon';
+}
+/**
+ * IntegrationsGrid — Integrations directory with category filter chips
+ * (progressively enhanced), monogram tiles and connection status badges.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{name: string, category: string, description: string, status?: 'available'|'beta'|'soon'}>} items - Integrations.
+ * @param {string} variant - Tile style (card|compact|outline).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface IntegrationsGridProps {
+    title?: string;
+    subtitle?: string;
+    items?: Item[];
+    variant?: 'card' | 'compact' | 'outline';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function IntegrationsGrid({ title, subtitle, items, variant, size, className, }: IntegrationsGridProps): import("react").JSX.Element;
+export default IntegrationsGrid;

package/dist/types/components/lib/sections/LayoutShowcase.d.ts

@@ -0,0 +1,8 @@
+import './LayoutShowcase.css';
+/** LayoutShowcase */
+export interface LayoutShowcaseProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function LayoutShowcase({ title, subtitle }: LayoutShowcaseProps): import("react").JSX.Element;
+export default LayoutShowcase;

package/dist/types/components/lib/sections/LogoCloudSection.d.ts

@@ -0,0 +1,16 @@
+import './LogoCloudSection.css';
+/**
+ * LogoCloudSection — High-trust partner and client brand wall with monochrome glass badges.
+ *
+ * @param {string} title - Section headline. Default is 'TRUSTED BY MODERN TECH STACKS'.
+ * @param {Array<{name: string, symbol: string}>} logos - Partner entries list.
+ */
+export interface LogoCloudSectionProps {
+    title?: string;
+    logos?: Array<{
+        name: string;
+        symbol: string;
+    }>;
+}
+export declare function LogoCloudSection({ title, logos, }: LogoCloudSectionProps): import("react").JSX.Element;
+export default LogoCloudSection;

package/dist/types/components/lib/sections/LogoWallGrid.d.ts

@@ -0,0 +1,28 @@
+import './LogoWallGrid.css';
+interface Logo {
+    name: string;
+    src?: string;
+    href?: string;
+}
+/**
+ * LogoWallGrid — Static grid of customer wordmarks with hairline dividers and
+ * an optional headline stat. Logos render as text wordmarks by default; pass
+ * image URLs to use real logos.
+ *
+ * @param {string} title - Small heading above the grid.
+ * @param {Array<{name: string, src?: string, href?: string}>} logos - Customers.
+ * @param {number} columns - Columns on desktop (3|4|6).
+ * @param {string} variant - Grid style (divided|cards|plain).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface LogoWallGridProps {
+    title?: string;
+    logos?: Logo[];
+    columns?: 3 | 4 | 6;
+    variant?: 'divided' | 'cards' | 'plain';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function LogoWallGrid({ title, logos, columns, variant, size, className, }: LogoWallGridProps): import("react").JSX.Element;
+export default LogoWallGrid;

package/dist/types/components/lib/sections/NavigationShowcase.d.ts

@@ -0,0 +1,8 @@
+import './NavigationShowcase.css';
+/** NavigationShowcase */
+export interface NavigationShowcaseProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function NavigationShowcase({ title, subtitle }: NavigationShowcaseProps): import("react").JSX.Element;
+export default NavigationShowcase;

package/dist/types/components/lib/sections/OverlaysShowcase.d.ts

@@ -0,0 +1,8 @@
+import './OverlaysShowcase.css';
+/** OverlaysShowcase */
+export interface OverlaysShowcaseProps {
+    title?: string;
+    subtitle?: string;
+}
+export declare function OverlaysShowcase({ title, subtitle }: OverlaysShowcaseProps): import("react").JSX.Element;
+export default OverlaysShowcase;

package/dist/types/components/lib/sections/PricingComparisonMatrix.d.ts

@@ -0,0 +1,16 @@
+import './PricingComparisonMatrix.css';
+/**
+ * PricingComparisonMatrix — Full-page interactive pricing matrix with billing toggle and feature comparison.
+ *
+ * @param {string} badge - Eyebrow badge text.
+ * @param {string} title - Section main heading.
+ * @param {string} subtitle - Supporting description text.
+ */
+export interface PricingComparisonMatrixProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function PricingComparisonMatrix({ badge, title, subtitle, className }: PricingComparisonMatrixProps): import("react").JSX.Element;
+export default PricingComparisonMatrix;

package/dist/types/components/lib/sections/PricingSinglePlan.d.ts

@@ -0,0 +1,37 @@
+import './PricingSinglePlan.css';
+/**
+ * PricingSinglePlan — One-plan pricing section: price card on one side,
+ * full feature checklist on the other, with a money-back guarantee note.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {string} planName - Plan name.
+ * @param {string} price - Formatted price.
+ * @param {string} period - Billing period label.
+ * @param {string} originalPrice - Optional struck-through price.
+ * @param {string[]} features - Included features.
+ * @param {{label: string, href: string}} cta - CTA button.
+ * @param {string} guarantee - Reassurance note under the CTA.
+ * @param {string} variant - Card style (glow|glass|minimal).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface PricingSinglePlanProps {
+    title?: string;
+    subtitle?: string;
+    planName?: string;
+    price?: string;
+    period?: string;
+    originalPrice?: string;
+    features?: string[];
+    cta?: {
+        label: string;
+        href: string;
+    };
+    guarantee?: string;
+    variant?: 'glow' | 'glass' | 'minimal';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function PricingSinglePlan({ title, subtitle, planName, price, period, originalPrice, features, cta, guarantee, variant, size, className, }: PricingSinglePlanProps): import("react").JSX.Element;
+export default PricingSinglePlan;

package/dist/types/components/lib/sections/PricingTierCards.d.ts

@@ -0,0 +1,16 @@
+import './PricingTierCards.css';
+/**
+ * PricingTierCards — Full-page 3-tier pricing cards section with animated highlights and feature breakdowns.
+ *
+ * @param {string} badge - Eyebrow badge text.
+ * @param {string} title - Main headline.
+ * @param {string} subtitle - Description text.
+ */
+export interface PricingTierCardsProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function PricingTierCards({ badge, title, subtitle, className }: PricingTierCardsProps): import("react").JSX.Element;
+export default PricingTierCards;

package/dist/types/components/lib/sections/PricingToggleCards.d.ts

@@ -0,0 +1,36 @@
+import './PricingToggleCards.css';
+interface Plan {
+    name: string;
+    monthly: number;
+    yearly: number;
+    description: string;
+    features: string[];
+    cta: string;
+    href: string;
+    featured?: boolean;
+}
+/**
+ * PricingToggleCards — Three pricing tiers with an accessible monthly/yearly
+ * switch (role="switch"), savings badge and a highlighted recommended plan.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{name: string, monthly: number, yearly: number, description: string, features: string[], cta: string, href: string, featured?: boolean}>} plans - Tiers.
+ * @param {string} currency - Currency symbol.
+ * @param {string} savingsLabel - Badge next to the yearly option.
+ * @param {string} variant - Card style (glass|solid|outline).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface PricingToggleCardsProps {
+    title?: string;
+    subtitle?: string;
+    plans?: Plan[];
+    currency?: string;
+    savingsLabel?: string;
+    variant?: 'glass' | 'solid' | 'outline';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function PricingToggleCards({ title, subtitle, plans, currency, savingsLabel, variant, size, className, }: PricingToggleCardsProps): import("react").JSX.Element;
+export default PricingToggleCards;

package/dist/types/components/lib/sections/ShopCategoryHero.d.ts

@@ -0,0 +1,41 @@
+import './ShopCategoryHero.css';
+/**
+ * ShopCategoryHero — Catalogue page header: breadcrumb, oversized category title with item
+ * count, intro text, sub-category links and a strip of three visuals.
+ *
+ * @param {Array<{label: string, href?: string}>} breadcrumb - Trail; the last item is the current page.
+ * @param {string} title - Category name. Default 'Clothing'.
+ * @param {number} count - Number of products (superscript). Optional.
+ * @param {string} text - Intro paragraph.
+ * @param {Array<{label: string, href: string, active?: boolean}>} links - Sub-category links.
+ * @param {Array<{icon?: string, hue?: number, image?: string}>} visuals - Up to three images (empty hides the strip).
+ * @param {string} variant - Layout (split|centered). Default 'split'.
+ * @param {string} size - Vertical rhythm (sm|md|lg). Default 'md'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: breadcrumb nav with aria-current; one h1; visuals are decorative.
+ */
+export interface ShopCategoryHeroProps {
+    breadcrumb?: Array<{
+        label: string;
+        href?: string;
+    }>;
+    title?: string;
+    count?: number;
+    text?: string;
+    links?: Array<{
+        label: string;
+        href: string;
+        active?: boolean;
+    }>;
+    visuals?: Array<{
+        icon?: string;
+        hue?: number;
+        image?: string;
+    }>;
+    variant?: 'split' | 'centered';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function ShopCategoryHero({ breadcrumb, title, count, text, links, visuals, variant, size, className, }: ShopCategoryHeroProps): import("react").JSX.Element;
+export default ShopCategoryHero;