import * as react_jsx_runtime from 'react/jsx-runtime';

interface CarouselGradientOverlayItem {
    id: string;
    title: string;
    description: string;
    href: string;
    image: string;
}
interface CarouselGradientOverlayProps {
    title?: string;
    description?: string;
    items?: CarouselGradientOverlayItem[];
    className?: string;
    /** Optional Optix Flow configuration for @page-speed/img */
    optixFlowConfig?: {
        apiKey: string;
        compression?: number;
    };
}
/**
 * CarouselGradientOverlay displays cards with gradient overlay and dot indicators.
 *
 * Each card features a full-bleed background image with a gradient overlay from
 * primary color, title, description, and "Read more" link. Includes dot navigation
 * indicators at the bottom and arrow buttons in the header. Ideal for showcasing
 * case studies, portfolio items, or featured content with strong visual impact.
 *
 * @example
 * ```tsx
 * <CarouselGradientOverlay
 *   title="Case Studies"
 *   description="Discover how leading companies leverage modern web technologies."
 *   items={[
 *     {
 *       id: "1",
 *       title: "E-commerce Platform",
 *       description: "A complete redesign of the shopping experience",
 *       href: "/case-studies/ecommerce",
 *       image: "/images/case-1.jpg"
 *     }
 *   ]}
 * />
 * ```
 */
declare function CarouselGradientOverlay({ title, description, items, className, optixFlowConfig, }: CarouselGradientOverlayProps): react_jsx_runtime.JSX.Element;

export { CarouselGradientOverlay, type CarouselGradientOverlayItem, type CarouselGradientOverlayProps };
