import { ReactNode } from 'react';
export type SteppedProgressBarLabel = {
    /**
     * The element shown in the step element.
     *
     * This can be a single step number or an icon element.
     */
    icon?: string | ReactNode;
    /**
     * The label shown below the step element.
     */
    label?: string | ReactNode;
    /**
     * Additional classes to be set on the label element.
     */
    labelClassName?: string;
    /**
     * Additional classes to be set on the label wrapping element.
     */
    labelWrapperClassName?: string;
};
export type SteppedProgressBarProps = {
    /**
     * Objects to defining the icon and the label of the navigation items.
     *
     * The icon can be a string or an icon.
     */
    labels: SteppedProgressBarLabel[];
    /**
     * Index of the selected navigation item.
     */
    selectedStepNumber: number;
    /**
     * Called with the new selected index after the user clicked a nav item.
     */
    onSelectedChanged: (selectedKey: number) => void;
    /**
     * The SteppedProgressBar Variant.
     *
     * One of `circle`, `rectangle` or `roadsign`.
     *
     * @default 'circle'
     */
    variant?: 'circle' | 'rectangle' | 'roadsign';
    /**
     * All navigation items with a higher index than this will be disabled.
     */
    disableFollowingPages?: number;
    /**
     * Deactivating the wrapping of bubbles on mobile.
     *
     * @default true
     */
    mobileBreakpoint?: boolean;
    /**
     * Additional classes to be set on the wrapper element.
     */
    className?: string;
};
declare const SteppedProgressBar: {
    (props: SteppedProgressBarProps): import("react/jsx-runtime").JSX.Element;
    VARIANT_CIRCLE: "circle";
    VARIANT_RECTANGLE: "rectangle";
    VARIANT_ROADSIGN: "roadsign";
};
export default SteppedProgressBar;
