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): React.JSX.Element; //# sourceMappingURL=steps-progress.d.ts.map