import type * as React from "react";
export type StepStatus = "incomplete" | "active" | "complete";
export type Step = {
    id: string;
    label: string;
    status: StepStatus;
    onClick?: () => void;
};
export type StepsProgressProps = {
    steps: Step[];
    onDismiss?: () => void;
    /**
     * When true, `StepsProgress` watches for any step whose status transitions
     * into `complete` and renders a one-shot `SparkleBurst` overlay on that step
     * to celebrate. The overlay is `aria-hidden` + `pointer-events-none`, so the
     * underlying step (including its click handler) remains fully interactive.
     *
     * Nothing animates on initial mount — only on subsequent status changes —
     * so already-complete steps won't sparkle on first render. The sparkle lasts
     * for `DS_SPARKLE_DURATION_MS` (see `sparkle-burst.tsx`) and then clears.
     *
     * Respects `prefers-reduced-motion` via token CSS.
     */
    animateStepTransitions?: boolean;
    /** Render steps in a vertical list instead of a horizontal bar. */
    orientation?: "horizontal" | "vertical";
} & React.ComponentProps<"section">;
export declare function getMobileIndexForSteps(steps: Step[], options?: {
    currentIndex?: number;
    isDismissible?: boolean;
}): number;
export declare function StepsProgress({ steps, onDismiss, animateStepTransitions, orientation, className, ...props }: StepsProgressProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=steps-progress.d.ts.map