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

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

@@ -0,0 +1,46 @@
+import './AgencyFooterCta.css';
+/**
+ * AgencyFooterCta — Agency footer led by a giant "Let's talk" link, then link columns, offices,
+ * socials and the legal line.
+ *
+ * @param {string} kicker - Line above the CTA. Default 'Have a project in mind?'.
+ * @param {{label: string, href: string}} cta - Giant CTA link. Default "Let's talk".
+ * @param {string} email - Email shown under the CTA (optional).
+ * @param {Array<{title: string, links: {label: string, href: string}[]}>} columns - Link columns.
+ * @param {Array<{city: string, address: string}>} offices - Office addresses.
+ * @param {Array<{label: string, href: string}>} socials - Social links.
+ * @param {string} brand - Brand for the legal line. Default 'Volta'.
+ * @param {string} variant - Style (accent|plain). Default 'accent'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: footer landmark with a visually hidden heading; the CTA is a single large link;
+ * columns are nav lists.
+ */
+export interface AgencyFooterCtaProps {
+    kicker?: string;
+    cta?: {
+        label: string;
+        href: string;
+    };
+    email?: string;
+    columns?: Array<{
+        title: string;
+        links: Array<{
+            label: string;
+            href: string;
+        }>;
+    }>;
+    offices?: Array<{
+        city: string;
+        address: string;
+    }>;
+    socials?: Array<{
+        label: string;
+        href: string;
+    }>;
+    brand?: string;
+    variant?: 'accent' | 'plain';
+    className?: string;
+}
+export declare function AgencyFooterCta({ kicker, cta, email, columns, offices, socials, brand, variant, className, }: AgencyFooterCtaProps): import("react").JSX.Element;
+export default AgencyFooterCta;

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

@@ -0,0 +1,37 @@
+import './AgencyHeader.css';
+/**
+ * AgencyHeader — Floating pill navigation for agency and studio sites: logo, links, theme toggle,
+ * "Start a project" CTA and an animated full-screen mobile menu.
+ *
+ * @param {string} brand - Logo text. Default 'Volta'.
+ * @param {string} brandHref - Logo link. Default '/'.
+ * @param {Array<{label: string, href: string}>} links - Menu links.
+ * @param {{label: string, href: string}} cta - Call to action. Default 'Start a project'.
+ * @param {string} currentHref - Marks the active link with aria-current.
+ * @param {boolean} themeToggle - Show the light/dark toggle. Default true.
+ * @param {boolean} sticky - Float over the page while scrolling. Default true.
+ * @param {string} variant - Style (pill|bar). Default 'pill'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: nav landmark; the mobile menu is a disclosure (aria-expanded) closed with
+ * Escape, which returns focus to the toggle; links have 44px targets.
+ */
+export interface AgencyHeaderProps {
+    brand?: string;
+    brandHref?: string;
+    links?: Array<{
+        label: string;
+        href: string;
+    }>;
+    cta?: {
+        label: string;
+        href: string;
+    };
+    currentHref?: string;
+    themeToggle?: boolean;
+    sticky?: boolean;
+    variant?: 'pill' | 'bar';
+    className?: string;
+}
+export declare function AgencyHeader({ brand, brandHref, links, cta, currentHref, themeToggle, sticky, variant, className, }: AgencyHeaderProps): import("react").JSX.Element;
+export default AgencyHeader;

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

@@ -0,0 +1,45 @@
+import './AgencyHeroKinetic.css';
+/**
+ * AgencyHeroKinetic — Agency hero with an oversized headline whose last word rotates through a
+ * list (highlighted like a marker stroke), intro text, CTAs, client proof and rotating stickers.
+ *
+ * @param {string} before - Headline text before the rotating word. Default 'We build brands people'.
+ * @param {string[]} words - Rotating words. Default ['remember', 'share', 'choose', 'love'].
+ * @param {string} text - Intro paragraph.
+ * @param {{label: string, href: string}} primary - Main CTA.
+ * @param {{label: string, href: string}} secondary - Secondary CTA (optional).
+ * @param {{count: string, label: string, people?: string[]}} proof - Client proof with avatar initials.
+ * @param {string[]} stickers - Small rotated badges around the headline (max 3).
+ * @param {number} interval - Rotation speed in ms. Default 2200.
+ * @param {string} variant - Layout (left|centered). Default 'left'.
+ * @param {string} size - Type scale (md|lg|xl). Default 'lg'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: the h1 contains the full sentence for screen readers (first word); the rotating
+ * copy is aria-hidden; rotation stops with prefers-reduced-motion and pauses on hover/focus.
+ */
+export interface AgencyHeroKineticProps {
+    before?: string;
+    words?: string[];
+    text?: string;
+    primary?: {
+        label: string;
+        href: string;
+    };
+    secondary?: {
+        label: string;
+        href: string;
+    };
+    proof?: {
+        count: string;
+        label: string;
+        people?: string[];
+    };
+    stickers?: string[];
+    interval?: number;
+    variant?: 'left' | 'centered';
+    size?: 'md' | 'lg' | 'xl';
+    className?: string;
+}
+export declare function AgencyHeroKinetic({ before, words, text, primary, secondary, proof, stickers, interval, variant, size, className, }: AgencyHeroKineticProps): import("react").JSX.Element;
+export default AgencyHeroKinetic;

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

@@ -0,0 +1,35 @@
+import './AgencyServicesList.css';
+interface Service {
+    name: string;
+    pitch: string;
+    deliverables?: string[];
+    timeline?: string;
+    from?: string;
+    href?: string;
+}
+/**
+ * AgencyServicesList — Numbered, expandable service rows: big service names, short pitch,
+ * deliverable chips, typical timeline and "from" price, with a hover/focus reveal.
+ *
+ * @param {string} eyebrow - Small label. Default 'What we do'.
+ * @param {string} title - Section heading. Default 'Services that move the needle'.
+ * @param {Array<{name: string, pitch: string, deliverables?: string[], timeline?: string, from?: string, href?: string}>} services - Rows.
+ * @param {number} open - Index opened by default (-1 for none). Default 0.
+ * @param {boolean} exclusive - Opening one row closes the others. Default true.
+ * @param {string} variant - Style (lines|cards). Default 'lines'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: native <details>/<summary> rows (keyboard and screen-reader friendly); each row
+ * has a heading; the decorative number and arrow are aria-hidden.
+ */
+export interface AgencyServicesListProps {
+    eyebrow?: string;
+    title?: string;
+    services?: Service[];
+    open?: number;
+    exclusive?: boolean;
+    variant?: 'lines' | 'cards';
+    className?: string;
+}
+export declare function AgencyServicesList({ eyebrow, title, services, open, exclusive, variant, className, }: AgencyServicesListProps): import("react").JSX.Element;
+export default AgencyServicesList;

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

@@ -0,0 +1,45 @@
+import './AgencyTeamGrid.css';
+interface Person {
+    name: string;
+    role: string;
+    location?: string;
+    fact?: string;
+    photo?: string;
+    links?: Array<{
+        label: string;
+        href: string;
+    }>;
+}
+/**
+ * AgencyTeamGrid — Team portraits with name, role, location, a personal "fun fact" revealed on
+ * hover/focus and social links, plus an optional "we're hiring" card.
+ *
+ * @param {string} eyebrow - Small label. Default 'The studio'.
+ * @param {string} title - Heading. Default 'Small team, senior people'.
+ * @param {string} text - Intro paragraph.
+ * @param {Array<{name: string, role: string, location?: string, fact?: string, photo?: string, links?: {label: string, href: string}[]}>} people - Team members.
+ * @param {{title: string, text: string, href: string, label?: string}} hiring - Hiring card (optional).
+ * @param {number} columns - Desktop columns (3–4). Default 4.
+ * @param {string} variant - Style (portrait|compact). Default 'portrait'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: each person is an article with a heading; the fun fact is real text (visible on
+ * hover and on keyboard focus of the card); social links have descriptive labels.
+ */
+export interface AgencyTeamGridProps {
+    eyebrow?: string;
+    title?: string;
+    text?: string;
+    people?: Person[];
+    hiring?: {
+        title: string;
+        text: string;
+        href: string;
+        label?: string;
+    };
+    columns?: 3 | 4;
+    variant?: 'portrait' | 'compact';
+    className?: string;
+}
+export declare function AgencyTeamGrid({ eyebrow, title, text, people, hiring, columns, variant, className, }: AgencyTeamGridProps): import("react").JSX.Element;
+export default AgencyTeamGrid;

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

@@ -0,0 +1,42 @@
+import './AgencyWorkGrid.css';
+interface Project {
+    slug: string;
+    client: string;
+    title: string;
+    category: string;
+    services?: string[];
+    result?: string;
+    year?: string;
+    hue?: number;
+    image?: string;
+    href?: string;
+}
+/**
+ * AgencyWorkGrid — Case-study grid with category filter chips: large art tiles, client, title,
+ * services and a headline result, in an alternating big/small rhythm.
+ *
+ * @param {string} eyebrow - Small label. Default 'Selected work'.
+ * @param {string} title - Heading. Default 'Work we are proud of'.
+ * @param {Array<{slug: string, client: string, title: string, category: string, services?: string[], result?: string, year?: string, hue?: number, image?: string, href?: string}>} projects - Case studies.
+ * @param {boolean} filters - Show category chips. Default true.
+ * @param {{label: string, href: string}} link - "All work" link (optional).
+ * @param {string} variant - Layout (mosaic|grid). Default 'mosaic'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: each card is one link with a heading; filter chips are toggle buttons and the
+ * number of visible projects is announced; art is decorative.
+ */
+export interface AgencyWorkGridProps {
+    eyebrow?: string;
+    title?: string;
+    projects?: Project[];
+    filters?: boolean;
+    link?: {
+        label: string;
+        href: string;
+    };
+    variant?: 'mosaic' | 'grid';
+    className?: string;
+}
+export declare function AgencyWorkGrid({ eyebrow, title, projects, filters, link, variant, className, }: AgencyWorkGridProps): import("react").JSX.Element;
+export default AgencyWorkGrid;

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

@@ -0,0 +1,35 @@
+import './BlogGridSection.css';
+interface Post {
+    title: string;
+    excerpt: string;
+    category: string;
+    date: string;
+    readTime: string;
+    author: string;
+    href: string;
+    image?: string;
+}
+/**
+ * BlogGridSection — Latest articles section with one featured post and a grid of
+ * smaller posts. Covers are CSS gradients by default (pass `image` for photos).
+ *
+ * @param {string} title - Section heading.
+ * @param {{label: string, href: string}} viewAll - Link to the full blog.
+ * @param {Array<{title: string, excerpt: string, category: string, date: string, readTime: string, author: string, href: string, image?: string}>} posts - Posts (first is featured).
+ * @param {string} variant - Card style (cards|minimal|overlay).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface BlogGridSectionProps {
+    title?: string;
+    viewAll?: {
+        label: string;
+        href: string;
+    };
+    posts?: Post[];
+    variant?: 'cards' | 'minimal' | 'overlay';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function BlogGridSection({ title, viewAll, posts, variant, size, className, }: BlogGridSectionProps): import("react").JSX.Element;
+export default BlogGridSection;

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

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

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

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

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

@@ -0,0 +1,37 @@
+import './CareersOpenings.css';
+interface Job {
+    title: string;
+    department: string;
+    location: string;
+    type: string;
+    remote?: boolean;
+    href: string;
+}
+/**
+ * CareersOpenings — Job listings section grouped by department, with location,
+ * type and remote badges, plus perks strip and a general-application CTA.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{title: string, department: string, location: string, type: string, remote?: boolean, href: string}>} jobs - Open roles.
+ * @param {string[]} perks - Short perk labels.
+ * @param {{label: string, href: string}} cta - General application link.
+ * @param {string} variant - Row style (list|cards|minimal).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface CareersOpeningsProps {
+    title?: string;
+    subtitle?: string;
+    jobs?: Job[];
+    perks?: string[];
+    cta?: {
+        label: string;
+        href: string;
+    };
+    variant?: 'list' | 'cards' | 'minimal';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function CareersOpenings({ title, subtitle, jobs, perks, cta, variant, size, className, }: CareersOpeningsProps): import("react").JSX.Element;
+export default CareersOpenings;

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

@@ -0,0 +1,37 @@
+import './ChangelogSection.css';
+interface Change {
+    type: 'new' | 'improved' | 'fixed';
+    text: string;
+}
+interface Release {
+    version: string;
+    date: string;
+    title: string;
+    changes: Change[];
+}
+/**
+ * ChangelogSection — Release notes timeline with version tags, dates and
+ * categorised entries (new / improved / fixed), each labelled with text + icon.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{version: string, date: string, title: string, changes: Array<{type: 'new'|'improved'|'fixed', text: string}>}>} releases - Releases, newest first.
+ * @param {{label: string, href: string}} subscribe - Optional RSS/updates link.
+ * @param {string} variant - Layout (timeline|cards|compact).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface ChangelogSectionProps {
+    title?: string;
+    subtitle?: string;
+    releases?: Release[];
+    subscribe?: {
+        label: string;
+        href: string;
+    };
+    variant?: 'timeline' | 'cards' | 'compact';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function ChangelogSection({ title, subtitle, releases, subscribe, variant, size, className, }: ChangelogSectionProps): import("react").JSX.Element;
+export default ChangelogSection;

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

@@ -0,0 +1,16 @@
+import './ContactGlassForm.css';
+/**
+ * ContactGlassForm — Full-page interactive contact and support section with glassmorphism form and live channel indicators.
+ *
+ * @param {string} badge - Eyebrow badge text.
+ * @param {string} title - Section main heading.
+ * @param {string} subtitle - Description text.
+ */
+export interface ContactGlassFormProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function ContactGlassForm({ badge, title, subtitle, className }: ContactGlassFormProps): import("react").JSX.Element;
+export default ContactGlassForm;

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

@@ -0,0 +1,36 @@
+import './ContactSplitMap.css';
+interface Office {
+    city: string;
+    address: string;
+    x: number;
+    y: number;
+}
+interface Channel {
+    label: string;
+    value: string;
+    href: string;
+    icon: 'mail' | 'phone' | 'chat';
+}
+/**
+ * ContactSplitMap — Contact section with office cards and contact channels on
+ * one side and a stylised SVG dot-map with location pins on the other.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Section description.
+ * @param {Array<{city: string, address: string, x: number, y: number}>} offices - Offices with map coords (0–100).
+ * @param {Array<{label: string, value: string, href: string, icon: 'mail'|'phone'|'chat'}>} channels - Contact channels.
+ * @param {string} variant - Map style (dots|grid|plain).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface ContactSplitMapProps {
+    title?: string;
+    subtitle?: string;
+    offices?: Office[];
+    channels?: Channel[];
+    variant?: 'dots' | 'grid' | 'plain';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function ContactSplitMap({ title, subtitle, offices, channels, variant, size, className, }: ContactSplitMapProps): import("react").JSX.Element;
+export default ContactSplitMap;

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

@@ -0,0 +1,16 @@
+import './CtaAppDownload.css';
+/**
+ * CtaAppDownload — Full-page mobile app showcase and download CTA section with device mockup and store buttons.
+ *
+ * @param {string} badge - Eyebrow badge text.
+ * @param {string} title - Main headline.
+ * @param {string} subtitle - Description text.
+ */
+export interface CtaAppDownloadProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function CtaAppDownload({ badge, title, subtitle, className }: CtaAppDownloadProps): import("react").JSX.Element;
+export default CtaAppDownload;

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

@@ -0,0 +1,20 @@
+import './CtaGlowBanner.css';
+/**
+ * CtaGlowBanner — Full-width high-converting CTA section with radial cyber mesh and interactive action group.
+ *
+ * @param {string} badge - Eyebrow badge.
+ * @param {string} title - Main headline.
+ * @param {string} subtitle - Description text.
+ * @param {string} primaryCtaText - Primary button text.
+ * @param {string} secondaryCtaText - Secondary button text.
+ */
+export interface CtaGlowBannerProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    primaryCtaText?: string;
+    secondaryCtaText?: string;
+    className?: string;
+}
+export declare function CtaGlowBanner({ badge, title, subtitle, primaryCtaText, secondaryCtaText, className }: CtaGlowBannerProps): import("react").JSX.Element;
+export default CtaGlowBanner;

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

@@ -0,0 +1,28 @@
+import './CtaNewsletterSection.css';
+/**
+ * CtaNewsletterSection — Newsletter signup band with benefits list, accessible
+ * email form, inline validation and privacy note.
+ *
+ * @param {string} title - Heading.
+ * @param {string} subtitle - Supporting copy.
+ * @param {string[]} perks - Short benefit bullets.
+ * @param {string} action - Form action URL.
+ * @param {string} buttonLabel - Submit label.
+ * @param {string} privacy - Privacy note under the form.
+ * @param {string} variant - Band style (gradient|glass|bordered).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface CtaNewsletterSectionProps {
+    title?: string;
+    subtitle?: string;
+    perks?: string[];
+    action?: string;
+    buttonLabel?: string;
+    privacy?: string;
+    variant?: 'gradient' | 'glass' | 'bordered';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function CtaNewsletterSection({ title, subtitle, perks, action, buttonLabel, privacy, variant, size, className, }: CtaNewsletterSectionProps): import("react").JSX.Element;
+export default CtaNewsletterSection;

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

@@ -0,0 +1,39 @@
+import './CtaSplitImage.css';
+/**
+ * CtaSplitImage — Conversion banner split into copy + CTA and a decorative
+ * visual panel (CSS gradient mesh with floating stat chips). Optional real image.
+ *
+ * @param {string} title - Heading.
+ * @param {string} text - Supporting copy.
+ * @param {{label: string, href: string}} primary - Primary CTA.
+ * @param {{label: string, href: string}} secondary - Secondary CTA.
+ * @param {string} image - Optional image URL (replaces the CSS visual).
+ * @param {string} imageAlt - Alt text when an image is used.
+ * @param {Array<{value: string, label: string}>} chips - Floating stat chips on the visual.
+ * @param {string} variant - Panel style (mesh|solid|outline).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface CtaSplitImageProps {
+    title?: string;
+    text?: string;
+    primary?: {
+        label: string;
+        href: string;
+    };
+    secondary?: {
+        label: string;
+        href: string;
+    };
+    image?: string;
+    imageAlt?: string;
+    chips?: Array<{
+        value: string;
+        label: string;
+    }>;
+    variant?: 'mesh' | 'solid' | 'outline';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function CtaSplitImage({ title, text, primary, secondary, image, imageAlt, chips, variant, size, className, }: CtaSplitImageProps): import("react").JSX.Element;
+export default CtaSplitImage;

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

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

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

@@ -0,0 +1,16 @@
+import './FaqAccordionSection.css';
+/**
+ * FaqAccordionSection — Full-page interactive FAQ section with category tabs, search filter, and accessible accordions.
+ *
+ * @param {string} badge - Eyebrow badge.
+ * @param {string} title - Section main heading.
+ * @param {string} subtitle - Supporting description text.
+ */
+export interface FaqAccordionSectionProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function FaqAccordionSection({ badge, title, subtitle, className }: FaqAccordionSectionProps): import("react").JSX.Element;
+export default FaqAccordionSection;

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

@@ -0,0 +1,32 @@
+import './FaqTwoColumn.css';
+/**
+ * FaqTwoColumn — FAQ section with a sticky intro column (heading + support CTA)
+ * and native <details> accordions on the right. Works without JavaScript.
+ *
+ * @param {string} title - Section heading.
+ * @param {string} subtitle - Intro copy.
+ * @param {Array<{q: string, a: string}>} items - Questions and answers.
+ * @param {{label: string, href: string}} support - Support link.
+ * @param {boolean} exclusive - Only one item open at a time (uses the `name` attribute).
+ * @param {string} variant - Item style (bordered|cards|plain).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface FaqTwoColumnProps {
+    title?: string;
+    subtitle?: string;
+    items?: Array<{
+        q: string;
+        a: string;
+    }>;
+    support?: {
+        label: string;
+        href: string;
+    };
+    exclusive?: boolean;
+    variant?: 'bordered' | 'cards' | 'plain';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function FaqTwoColumn({ title, subtitle, items, support, exclusive, variant, size, className, }: FaqTwoColumnProps): import("react").JSX.Element;
+export default FaqTwoColumn;

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

@@ -0,0 +1,29 @@
+import './FeatureAlternatingRows.css';
+interface Row {
+    eyebrow: string;
+    title: string;
+    text: string;
+    bullets: string[];
+    visual: 'chart' | 'code' | 'stack';
+}
+/**
+ * FeatureAlternatingRows — Zig-zag feature section: text and a visual alternate
+ * sides on each row. Visuals are pure-CSS illustrations (no images to load).
+ *
+ * @param {string} title - Section heading (visually hidden if empty-styled).
+ * @param {Array<{eyebrow: string, title: string, text: string, bullets: string[], visual: 'chart'|'code'|'stack'}>} rows - Feature rows.
+ * @param {boolean} startReversed - Put the visual on the left in the first row.
+ * @param {string} variant - Visual frame (glass|outline|plain).
+ * @param {string} size - Vertical rhythm (sm|md|lg).
+ * @param {string} className - Extra CSS class.
+ */
+export interface FeatureAlternatingRowsProps {
+    title?: string;
+    rows?: Row[];
+    startReversed?: boolean;
+    variant?: 'glass' | 'outline' | 'plain';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function FeatureAlternatingRows({ title, rows, startReversed, variant, size, className, }: FeatureAlternatingRowsProps): import("react").JSX.Element;
+export default FeatureAlternatingRows;

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

@@ -0,0 +1,16 @@
+import './FeatureBentoGrid.css';
+/**
+ * FeatureBentoGrid — Full-page modern Bento-Grid features section with interactive widgets and metric cards.
+ *
+ * @param {string} badge - Eyebrow badge text.
+ * @param {string} title - Main section heading.
+ * @param {string} subtitle - Supporting description text.
+ */
+export interface FeatureBentoGridProps {
+    badge?: string;
+    title?: string;
+    subtitle?: string;
+    className?: string;
+}
+export declare function FeatureBentoGrid({ badge, title, subtitle, className }: FeatureBentoGridProps): import("react").JSX.Element;
+export default FeatureBentoGrid;