import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
import { type VariantProps } from 'class-variance-authority';
export interface CarouselHandle {
    /** Programmatically focus + scroll to the item at index `i`. */
    scrollTo: (index: number) => void;
    /** Currently snapped item index (0-based). */
    getActiveIndex: () => number;
    /** Total slide count. */
    getCount: () => number;
    /** Scroll one slide to the previous direction. */
    scrollPrev: () => void;
    /** Scroll one slide to the next direction. */
    scrollNext: () => void;
}
export interface CarouselProps extends Omit<ComponentPropsWithoutRef<'section'>, 'children'>, VariantProps<typeof rootVariants> {
    children: ReactNode;
    /** Accessible label (falls back to `t('carousel.label')`). */
    'aria-label'?: string;
    /** Show prev / next IconButton pair in the header (visible ≥ md). */
    showControls?: boolean;
    /** Show dot indicators below the strip. */
    showIndicators?: boolean;
    /** Optional "view all" affordance on the trailing edge of the default header. */
    viewAllSlot?: ReactNode;
    /** Snap behaviour. Default `mandatory` aligns each item to the start. */
    snap?: 'mandatory' | 'proximity';
    /** Consumer-supplied instance id, surfaced as `data-component-id`. */
    id?: string;
    /**
     * Fade the inline edges of the viewport so offscreen slides on the
     * leading and trailing edges appear to dissolve into the surrounding
     * surface instead of being clipped abruptly. Defaults to `true`.
     *
     * The fade is conditionally suppressed when the carousel is at the
     * start of the strip (leading edge stays solid) or at the end
     * (trailing edge stays solid) — there is no offscreen content to
     * hint at in those positions, and a fade would just look like a
     * decorative haze.
     *
     * The gradient width is controlled by `--carousel-fade-distance`,
     * which defaults to `var(--spacing-xl)`. Consumers can override it
     * by setting the variable on the Carousel root via className, e.g.
     * `<Carousel className="ds:[--carousel-fade-distance:5rem]" …>`.
     *
     * Automatically disabled under `prefers-reduced-motion`, the
     * `theme-accessible` palette, and Windows High Contrast Mode so the
     * mask never strips information from users who need it.
     */
    fadeEdges?: boolean;
}
export interface CarouselItemProps extends ComponentPropsWithoutRef<'div'> {
    children: ReactNode;
}
export interface CarouselHeaderProps extends ComponentPropsWithoutRef<'div'> {
    children: ReactNode;
}
declare const rootVariants: (props?: ({
    size?: "sm" | "md" | "lg" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
export declare const Carousel: import("react").ForwardRefExoticComponent<CarouselProps & import("react").RefAttributes<HTMLElement>> & {
    Header: import("react").ForwardRefExoticComponent<CarouselHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
    Item: import("react").ForwardRefExoticComponent<CarouselItemProps & import("react").RefAttributes<HTMLDivElement>>;
    Controls: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
};
export {};
//# sourceMappingURL=carousel.d.ts.map