stackable-components 1.0.0

package/dist/components/Pricing/PricingSpreadCard.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface PricingSpreadCardFeature {
+    text?: string;
+}
+export interface PricingSpreadCardCta {
+    title?: string;
+    href?: string;
+}
+export interface PricingSpreadCardProps {
+    badge_left_text?: string;
+    heading?: string;
+    description?: string;
+    features_heading?: string;
+    features?: PricingSpreadCardFeature[];
+    badge_right_text?: string;
+    currency?: string;
+    price?: string;
+    price_suffix?: string;
+    cta?: PricingSpreadCardCta;
+    caption?: string;
+    /** Asset URL, or a Contentstack asset object. Falls back to a built-in decorative illustration when unset. */
+    illustration?: string | {
+        url?: string;
+    };
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    accent_color?: StackableColorValue;
+    className?: string;
+}
+export declare function PricingSpreadCard({ badge_left_text, heading, description, features_heading, features, badge_right_text, currency, price, price_suffix, cta, caption, illustration, background_color, text_color, accent_color, className, }: PricingSpreadCardProps): React.JSX.Element;
+export default PricingSpreadCard;

package/dist/components/Pricing/index.d.ts

@@ -0,0 +1,4 @@
+export { Pricing } from './Pricing';
+export type { PricingProps, PricingTier, PricingFeature, PricingLogo } from './Pricing';
+export { PricingSpreadCard } from './PricingSpreadCard';
+export type { PricingSpreadCardProps, PricingSpreadCardFeature, PricingSpreadCardCta } from './PricingSpreadCard';

package/dist/components/Process/ProcessStep.d.ts

@@ -0,0 +1,51 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+/** Native Contentstack link field: `{ title, href }`. */
+export interface ProcessStepLink {
+    title?: string;
+    href?: string;
+}
+export interface ProcessStepItem {
+    /**
+     * The oversized glyph. Free text straight from the CMS — `01`, `A`, `IV`,
+     * `§` all render. Never parsed as a number and never used for ordering, so
+     * editors are free to label steps however the content calls for.
+     */
+    label?: string;
+    /**
+     * Named `step_title` rather than `title`: a group subfield with the uid
+     * `title` collides with the content type's mandatory Title field on import.
+     * Props map 1:1 onto field uids, so the prop carries the same name.
+     */
+    step_title?: string;
+    description?: string;
+    /**
+     * Clipped inside the glyph rather than shown as a picture. Asset URL or a
+     * Contentstack asset object — both are accepted.
+     */
+    image?: string | {
+        url?: string;
+    };
+    image_alt?: string;
+    link?: ProcessStepLink;
+}
+export interface ProcessStepProps {
+    heading?: string;
+    subheading?: string;
+    heading_alignment?: 'left' | 'center' | 'right' | string;
+    steps?: ProcessStepItem[];
+    /** `Alternating` mirrors every second row, as in a zig-zag. */
+    layout?: 'Alternating' | 'Text Left' | 'Text Right' | string;
+    /** Hairline rule between rows. */
+    show_dividers?: boolean;
+    /** Short accent bar under each step title. */
+    show_accent_rule?: boolean;
+    glyph_scale?: 'Small' | 'Medium' | 'Large' | string;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    /** Accent bar, and the glyph itself when a step has no image. */
+    accent_color?: StackableColorValue;
+    className?: string;
+}
+export declare function ProcessStep({ heading, subheading, heading_alignment, steps, layout, show_dividers, show_accent_rule, glyph_scale, background_color, text_color, accent_color, className, }: ProcessStepProps): React.JSX.Element;
+export default ProcessStep;

package/dist/components/Process/index.d.ts

@@ -0,0 +1,2 @@
+export { ProcessStep } from './ProcessStep';
+export type { ProcessStepProps, ProcessStepItem, ProcessStepLink } from './ProcessStep';

package/dist/components/ProductCard/DarkCard.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+/** Internal — reached through `ProductCard` with `card_style: 'Dark'`. */
+export interface ProductCardDarkProps {
+    product_name?: string;
+    brand?: string;
+    /** Asset URL, or a Contentstack asset object — both are accepted. */
+    product_image?: string | {
+        url?: string;
+    };
+    image_alt?: string;
+    price?: number;
+    currency?: string;
+    /** `59$` (suffix, as in the reference) vs `$59` (prefix). */
+    currency_position?: 'prefix' | 'suffix' | string;
+    href?: string;
+    /** Accessible label for the add-to-cart button. */
+    cta_label?: string;
+    image_aspect_ratio?: 'Square' | 'Landscape' | 'Portrait' | string;
+    /** `Contain` suits cut-out product shots; `Cover` suits lifestyle photography. */
+    image_fit?: 'Contain' | 'Cover' | string;
+    show_wishlist?: boolean;
+    show_cart_button?: boolean;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    /** Heart fill once wishlisted. */
+    accent_color?: StackableColorValue;
+    className?: string;
+}
+export declare function ProductCardDark({ product_name, brand, product_image, image_alt, price, currency, currency_position, href, cta_label, image_aspect_ratio, image_fit, show_wishlist, show_cart_button, background_color, text_color, accent_color, className, }: ProductCardDarkProps): React.JSX.Element;
+export default ProductCardDark;

package/dist/components/ProductCard/LargeCard.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface ProductCardLargeProps {
+    product_name?: string;
+    product_image?: string;
+    price?: number;
+    href?: string;
+    cta_label?: string;
+    className?: string;
+}
+export declare function ProductCardLarge({ product_name: productName, product_image: productImage, price, href, cta_label, className, }: ProductCardLargeProps): React.JSX.Element;
+export default ProductCardLarge;

package/dist/components/ProductCard/ProductBanner.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+export interface ProductBannerItem {
+    image?: string;
+    name?: string;
+    subtext?: string;
+    price?: number | string;
+    original_price?: number | string;
+    discount_label?: string;
+    price_note?: string;
+    unit_price?: string;
+    unit_note?: string;
+    href?: string;
+}
+export interface ProductBannerProps {
+    badge_label?: string;
+    heading?: string;
+    description?: string;
+    banner_image?: string;
+    banner_link?: string;
+    shop_all_label?: string;
+    shop_all_link?: string;
+    products?: ProductBannerItem[];
+    /** Which side the banner image sits on relative to the product row */
+    banner_position?: 'left' | 'right' | string;
+    className?: string;
+}
+export declare function ProductBanner({ badge_label, heading, description, banner_image, banner_link, shop_all_label, shop_all_link, products, banner_position, className, }: ProductBannerProps): React.JSX.Element;
+export default ProductBanner;

package/dist/components/ProductCard/index.d.ts

@@ -0,0 +1,61 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface ProductColorOption {
+    label?: string;
+    hex?: string;
+}
+export interface ProductSizeOption {
+    label?: string;
+}
+export interface ProductCardProps {
+    /**
+     * Which layout to render. `Regular` is the original light card with colour and
+     * size pickers; `Dark` is the rounded dark card with a wishlist heart and a
+     * circular cart button. Fields belonging to the other style are ignored.
+     */
+    card_style?: 'Regular' | 'Dark' | string;
+    product_name?: string;
+    /** Asset URL, or a Contentstack asset object — both are accepted. */
+    product_image?: string | {
+        url?: string;
+    };
+    /** Falls back to the product name when empty. */
+    image_alt?: string;
+    price?: number;
+    href?: string;
+    cta_label?: string;
+    /** Regular only — `Large` widens the card. */
+    card_size?: string;
+    /** Regular only. */
+    colors?: ProductColorOption[];
+    /** Regular only. */
+    sizes?: ProductSizeOption[];
+    /** Dark only. */
+    brand?: string;
+    /** Dark only. */
+    currency?: string;
+    /** Dark only. */
+    currency_position?: 'prefix' | 'suffix' | string;
+    /** Dark only. */
+    image_aspect_ratio?: 'Square' | 'Landscape' | 'Portrait' | string;
+    /** Dark only. */
+    image_fit?: 'Contain' | 'Cover' | string;
+    /** Dark only. */
+    show_wishlist?: boolean;
+    /** Dark only. */
+    show_cart_button?: boolean;
+    /** Dark only. */
+    background_color?: StackableColorValue;
+    /** Dark only. */
+    text_color?: StackableColorValue;
+    /** Dark only. */
+    accent_color?: StackableColorValue;
+    className?: string;
+}
+export { ProductCardLarge } from './LargeCard';
+export type { ProductCardLargeProps } from './LargeCard';
+export { ProductBanner } from './ProductBanner';
+export type { ProductBannerProps, ProductBannerItem } from './ProductBanner';
+export declare function ProductCard({ card_style, product_name: productName, product_image: productImage, image_alt, card_size: cardSize, price, colors, sizes, href, cta_label, className, ...darkOnly }: ProductCardProps): React.JSX.Element;
+export { ProductCard as ProductCardRegular };
+export default ProductCard;

package/dist/components/SectionIntroduction/SectionIntroduction.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface SectionIntroductionCtaButton {
+    title?: string;
+    url?: string;
+    open_in_new_tab?: boolean;
+    apply_border?: boolean;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+}
+export interface SectionIntroductionColorValue {
+    hex?: string;
+}
+export interface SectionIntroductionProps {
+    className?: string;
+    eyebrow_text?: string;
+    heading?: string;
+    subheading?: string;
+    description?: string;
+    cta_button?: SectionIntroductionCtaButton;
+    secondary_cta_button?: SectionIntroductionCtaButton;
+    alignment?: 'Left' | 'Center' | 'Right' | string;
+    background_color?: SectionIntroductionColorValue;
+    text_color?: SectionIntroductionColorValue;
+}
+export declare function SectionIntroduction({ className, eyebrow_text: eyebrowText, heading, subheading, description, cta_button: ctaButton, secondary_cta_button: secondaryCtaButton, alignment, background_color: backgroundColor, text_color: textColor, }: SectionIntroductionProps): React.JSX.Element;
+export default SectionIntroduction;

package/dist/components/SectionIntroduction/SectionIntroductionTwoColumn.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+export interface SectionIntroductionTwoColumnColorValue {
+    hex?: string;
+}
+export interface SectionIntroductionTwoColumnProps {
+    className?: string;
+    step_number?: string;
+    eyebrow_text?: string;
+    heading?: string;
+    left_description?: string;
+    right_description?: string;
+    left_background_image?: string;
+    right_background_image?: string;
+    background_color?: SectionIntroductionTwoColumnColorValue;
+    text_color?: SectionIntroductionTwoColumnColorValue;
+}
+export declare function SectionIntroductionTwoColumn({ className, step_number, eyebrow_text: eyebrowText, heading, left_description: leftDescription, right_description: rightDescription, left_background_image: leftBgImage, right_background_image: rightBgImage, background_color: backgroundColor, text_color: textColor, }: SectionIntroductionTwoColumnProps): React.JSX.Element;
+export default SectionIntroductionTwoColumn;

package/dist/components/SectionIntroduction/index.d.ts

@@ -0,0 +1,4 @@
+export { SectionIntroduction } from './SectionIntroduction';
+export type { SectionIntroductionProps, SectionIntroductionCtaButton, SectionIntroductionColorValue } from './SectionIntroduction';
+export { SectionIntroductionTwoColumn } from './SectionIntroductionTwoColumn';
+export type { SectionIntroductionTwoColumnProps, SectionIntroductionTwoColumnColorValue } from './SectionIntroductionTwoColumn';

package/dist/components/Sidebar/Sidebar.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface SidebarLink {
+    text?: string;
+    link?: string;
+}
+export interface SidebarItem {
+    link?: SidebarLink;
+    icon?: string;
+}
+export interface SidebarProps {
+    title?: string;
+    subtitle?: string;
+    logo?: string;
+    items?: SidebarItem[];
+    cta_button?: SidebarLink;
+    collapsible?: boolean;
+    default_open?: boolean;
+    position?: 'left' | 'right' | string;
+    width?: 'narrow' | 'medium' | 'wide' | string;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    className?: string;
+}
+export declare function Sidebar({ title, subtitle, logo, items, cta_button, collapsible, default_open, position, width, background_color, text_color, className, }: SidebarProps): React.JSX.Element;
+export default Sidebar;

package/dist/components/Sidebar/index.d.ts

@@ -0,0 +1,2 @@
+export { Sidebar } from './Sidebar';
+export type { SidebarProps, SidebarItem, SidebarLink } from './Sidebar';

package/dist/components/Sliders/ProductSlider.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface ProductSliderCtaButton {
+    text?: string;
+    link?: string;
+}
+export interface ProductSliderSlide {
+    background_image?: string;
+    eyebrow_text?: string;
+    heading?: string;
+    subheading?: string;
+    content_position?: 'left' | 'right' | string;
+    cta_button?: ProductSliderCtaButton;
+    text_color?: StackableColorValue;
+    button_color?: StackableColorValue;
+    button_text_color?: StackableColorValue;
+}
+export interface ProductSliderProps {
+    slides?: ProductSliderSlide[];
+    className?: string;
+}
+export declare function ProductSlider({ slides, className }: ProductSliderProps): React.JSX.Element;
+export default ProductSlider;

package/dist/components/Sliders/index.d.ts

@@ -0,0 +1,2 @@
+export { ProductSlider } from './ProductSlider';
+export type { ProductSliderProps, ProductSliderSlide, ProductSliderCtaButton } from './ProductSlider';

package/dist/components/Social/SocialLinks.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface SocialLinksItem {
+    /** One of the curated platforms; decides the brand mark and its default colour. */
+    platform?: string;
+    /** Account name. Falls back to the section-level handle, so it's set once by default. */
+    handle?: string;
+    /** Line under the handle. Falls back to the platform's own wording. */
+    label?: string;
+    url?: string;
+    /** Overrides the platform's official colour for this card only. */
+    brand_color?: StackableColorValue;
+}
+export interface SocialLinksProps {
+    heading?: string;
+    /** Small group glyph beside the heading. */
+    show_heading_icon?: boolean;
+    /** Used by every card that doesn't set its own handle. */
+    handle?: string;
+    /** Cards per row. They stay equal width, so the grid keeps square edges. */
+    columns?: number;
+    /**
+     * `Brand tint` washes each card in its platform colour. `Neutral` makes every
+     * card identical and leaves only the mark coloured. `Outline` is a hairline
+     * border with no fill.
+     */
+    card_style?: 'Brand tint' | 'Neutral' | 'Outline' | string;
+    /** Colours the mark with its brand colour. Off renders every mark in the text colour. */
+    colour_icons?: boolean;
+    links?: SocialLinksItem[];
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    className?: string;
+}
+export declare function SocialLinks({ heading, show_heading_icon, handle, columns, card_style, colour_icons, links, background_color, text_color, className, }: SocialLinksProps): React.JSX.Element;
+export default SocialLinks;

package/dist/components/Social/SocialPostEmbed.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export type SocialPostPlatform = 'x' | 'instagram' | 'tiktok';
+export interface SocialPostEmbedProps {
+    /** Public post URL — platform is detected from the domain (x.com/twitter.com,
+     *  instagram.com, or tiktok.com), so there's no separate platform field to keep in
+     *  sync. LinkedIn/Facebook aren't supported — they don't offer a "just paste a
+     *  public post URL" embed without extra setup (LinkedIn requires their own generated
+     *  embed HTML, Facebook now requires an App ID). Works for any post type a platform's
+     *  own widget renders — image, video, GIF, poll — since that's the platform's embed
+     *  script rendering whatever the post actually contains, not something this component
+     *  special-cases. */
+    post_url?: string;
+    /** Optional supplementary caption shown below the embed. */
+    caption?: string;
+    /** Position of the embed within its container. */
+    alignment?: 'left' | 'center' | 'right' | string;
+    /** X only — when the linked post is itself a reply, hides the parent tweet X
+     *  would otherwise show above it, so the embed focuses on just this one post
+     *  (maps to X's own `data-conversation="none"` embed attribute). Has no visible
+     *  effect on a post that isn't a reply. */
+    hide_parent_context?: boolean;
+    /** Instagram only — shows the post's own caption text under the embed, distinct
+     *  from the custom `caption` field above (maps to Instagram's own
+     *  `data-instgrm-captioned` embed attribute). Ignored for a profile link, since
+     *  that attribute is documented for posts only and breaks Instagram's embed
+     *  widget when applied to a profile URL. */
+    show_native_caption?: boolean;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    className?: string;
+}
+export declare function SocialPostEmbed({ post_url, caption, alignment, hide_parent_context, show_native_caption, background_color, text_color, className, }: SocialPostEmbedProps): React.JSX.Element;
+export default SocialPostEmbed;

package/dist/components/Social/index.d.ts

@@ -0,0 +1,4 @@
+export { SocialPostEmbed } from './SocialPostEmbed';
+export type { SocialPostEmbedProps, SocialPostPlatform } from './SocialPostEmbed';
+export { SocialLinks } from './SocialLinks';
+export type { SocialLinksProps, SocialLinksItem } from './SocialLinks';

package/dist/components/Statistics/StatCounterRow.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+/** Curated preset — editors pick one of these, or override with `icon_image`. */
+declare const STAT_ICONS: Record<string, React.ComponentType<{
+    className?: string;
+    style?: React.CSSProperties;
+}>>;
+export interface StatCounterItem {
+    /** Preset icon key from STAT_ICONS. Ignored when `icon_image` is set. */
+    icon?: keyof typeof STAT_ICONS | string;
+    /** Uploaded asset URL, or a Contentstack asset object — takes precedence over `icon`. */
+    icon_image?: string | {
+        url?: string;
+    };
+    icon_alt?: string;
+    value?: string;
+    label?: string;
+}
+export interface StatCounterRowProps {
+    eyebrow_text?: string;
+    heading?: string;
+    subheading?: string;
+    stats?: StatCounterItem[];
+    show_dividers?: boolean;
+    /** Counts each stat's numeric value up from 0 when it scrolls into view. */
+    animate_numbers?: boolean;
+    /** Tints the preset icon set. Uploaded `icon_image`s render as-is and ignore this. */
+    icon_color?: StackableColorValue;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    className?: string;
+}
+export declare function StatCounterRow({ eyebrow_text, heading, subheading, stats, show_dividers, animate_numbers, icon_color, background_color, text_color, className, }: StatCounterRowProps): React.JSX.Element;
+export default StatCounterRow;

package/dist/components/Statistics/index.d.ts

@@ -0,0 +1,2 @@
+export { StatCounterRow } from './StatCounterRow';
+export type { StatCounterRowProps, StatCounterItem } from './StatCounterRow';

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface TabItem {
+    label?: string;
+    /** Emoji/glyph, an icon URL, or a Contentstack asset object. */
+    icon?: string | {
+        url?: string;
+    };
+    heading?: string;
+    body?: string;
+    image?: string;
+    cta_label?: string;
+    cta_url?: string;
+}
+export interface TabsProps {
+    tabs?: TabItem[];
+    layout?: 'editorial' | 'icon-underline' | 'pill' | 'vertical' | 'card-carousel' | 'underline-split' | 'dark' | string;
+    default_tab?: number;
+    className?: string;
+    section_heading?: string;
+    section_sub_heading?: string;
+    text_color?: StackableColorValue;
+    heading_alignment?: 'left' | 'center' | 'right';
+    label_position?: 'top' | 'bottom';
+    image_position?: 'left' | 'right';
+    pill_style?: 'plain' | 'pill';
+    pill_bg_color?: StackableColorValue;
+    dark_header_enabled?: boolean;
+    header_bg_color?: StackableColorValue;
+    carousel_enabled?: boolean;
+    tab_label_position?: 'left' | 'right';
+    tab_bg_color?: StackableColorValue;
+}
+export declare function Tabs({ tabs, layout, default_tab, className, section_heading, section_sub_heading, text_color, heading_alignment, label_position, image_position, pill_style, pill_bg_color, dark_header_enabled, header_bg_color, carousel_enabled, tab_label_position, tab_bg_color, }: TabsProps): React.JSX.Element;
+export default Tabs;

package/dist/components/Tabs/index.d.ts

@@ -0,0 +1,2 @@
+export { Tabs } from './Tabs';
+export type { TabsProps, TabItem } from './Tabs';

package/dist/components/Team/TeamBanner.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface TeamBannerMember {
+    /** Asset URL, or a Contentstack asset object — both are accepted. */
+    image?: string | {
+        url?: string;
+    };
+    image_alt?: string;
+    name?: string;
+    designation?: string;
+    /** Draws the accent-coloured border, like the featured centre card. */
+    highlight?: boolean;
+}
+export interface TeamBannerProps {
+    eyebrow_text?: string;
+    heading?: string;
+    subheading?: string;
+    heading_alignment?: 'left' | 'center' | 'right' | string;
+    /** Cards per row on wide screens; wraps naturally below that. */
+    columns?: number;
+    /** Zig-zag the cards vertically (odd cards pushed down). */
+    staggered?: boolean;
+    card_aspect?: 'Portrait Tall' | 'Portrait' | 'Square' | string;
+    members?: TeamBannerMember[];
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    /** Eyebrow, designation and the featured card's border. */
+    accent_color?: StackableColorValue;
+    className?: string;
+}
+export declare function TeamBanner({ eyebrow_text, heading, subheading, heading_alignment, columns, staggered, card_aspect, members, background_color, text_color, accent_color, className, }: TeamBannerProps): React.JSX.Element;
+export default TeamBanner;

package/dist/components/Team/index.d.ts

@@ -0,0 +1,2 @@
+export { TeamBanner } from './TeamBanner';
+export type { TeamBannerProps, TeamBannerMember } from './TeamBanner';

package/dist/components/Testimonial/CardStack.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface CardStackItem {
+    content?: string;
+    /** Exact substring of `content` to highlight in the accent colour. */
+    highlight_text?: string;
+    name?: string;
+    designation?: string;
+    /** Uploaded asset URL, or a Contentstack asset object. Optional. */
+    avatar?: string | {
+        url?: string;
+    };
+}
+export interface CardStackProps {
+    eyebrow_text?: string;
+    heading?: string;
+    items?: CardStackItem[];
+    /** `auto` cycles on a timer (pausing while hovered); `drag` waits for the
+     *  visitor to throw the front card aside. Either way the front card goes to
+     *  the back of the stack and the one behind it takes its place. */
+    interaction_mode?: 'auto' | 'drag' | string;
+    /** Seconds between cycles in `auto` mode. */
+    auto_interval?: number;
+    background_color?: StackableColorValue;
+    card_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    accent_color?: StackableColorValue;
+    className?: string;
+}
+export declare function CardStack({ eyebrow_text, heading, items, interaction_mode, auto_interval, background_color, card_color, text_color, accent_color, className, }: CardStackProps): React.JSX.Element | null;
+export default CardStack;

package/dist/components/Testimonial/RatingSummary.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+export interface RatingSummaryLink {
+    title?: string;
+    href?: string;
+}
+export interface RatingSummaryProps {
+    rating?: number;
+    max_rating?: number;
+    review_count?: number;
+    source_name?: string;
+    link?: RatingSummaryLink;
+    alignment?: 'left' | 'center' | 'right' | string;
+    background_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    star_color?: StackableColorValue;
+    className?: string;
+}
+export declare function RatingSummary({ rating, max_rating, review_count, source_name, link, alignment, background_color, text_color, star_color, className, }: RatingSummaryProps): React.JSX.Element;
+export default RatingSummary;

package/dist/components/Testimonial/Reviews.d.ts

@@ -0,0 +1,55 @@
+import React from 'react';
+import type { StackableColorValue } from '../../types';
+/** Native Contentstack link field: `{ title, href }`. */
+export interface ReviewsLink {
+    title?: string;
+    href?: string;
+}
+export interface ReviewsItem {
+    /** The testimonial itself. Line breaks are kept. */
+    quote?: string;
+    author_name?: string;
+    /** Role and company, e.g. `VP of Finance — Billy`. */
+    author_role?: string;
+    /**
+     * Asset URL or a Contentstack asset object — both are accepted, since a file
+     * field arrives as a URL from the catalog but as `{ url, … }` from the
+     * Delivery API.
+     */
+    avatar?: string | {
+        url?: string;
+    };
+    avatar_alt?: string;
+}
+export interface ReviewsProps {
+    eyebrow_text?: string;
+    heading?: string;
+    heading_alignment?: 'left' | 'center' | 'right' | string;
+    testimonials?: ReviewsItem[];
+    /** Columns of cards. Reduced automatically when they would get too narrow. */
+    columns?: number;
+    /** Height of the scrolling area. */
+    wall_height?: 'Short' | 'Medium' | 'Tall' | string;
+    /** Seconds for one full loop. Higher is slower. */
+    scroll_seconds?: number;
+    /** Neighbouring columns travel in opposite directions. */
+    alternate_direction?: boolean;
+    pause_on_hover?: boolean;
+    /** The rounded outer container. */
+    show_frame?: boolean;
+    /** Fades the cards out at the top and bottom edges. */
+    show_fade?: boolean;
+    /** Small line inside the floating footer pill. */
+    footer_note?: string;
+    /** Button inside the footer pill. The pill is hidden when both are empty. */
+    footer_cta?: ReviewsLink;
+    background_color?: StackableColorValue;
+    /** The cards themselves. */
+    card_color?: StackableColorValue;
+    text_color?: StackableColorValue;
+    button_color?: StackableColorValue;
+    button_text_color?: StackableColorValue;
+    className?: string;
+}
+export declare function Reviews({ eyebrow_text, heading, heading_alignment, testimonials, columns, wall_height, scroll_seconds, alternate_direction, pause_on_hover, show_frame, show_fade, footer_note, footer_cta, background_color, card_color, text_color, button_color, button_text_color, className, }: ReviewsProps): React.JSX.Element;
+export default Reviews;