@dnanpm/styleguide/build/cjs/components/ProgressIndicator/ProgressIndicator.d.ts

DNA Styleguide repository provides the set of components and theme object used in various DNA projects.

import type { MouseEvent, KeyboardEvent } from 'react';
import React from 'react';
type ProgressIndicatorStatus = 'error';
interface Props {
    /**
     * Array of strings to be used as labels or number of steps.
     * If number is passed as a value, no labels will be generated
     */
    steps: string[] | number;
    /**
     * Allows to set the active step (zero based index) by passing the index of item from `steps` array
     */
    activeStep?: number;
    /**
     * On Progress Indicator Item label or number click callback
     * Use `e.currentTarget.parentElement` to get Progress Indicator Item element
     */
    onStepClick?: (stepIndex: number, e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => void;
    /**
     * Allows to change version of component to small
     */
    small?: boolean;
    /**
     * Depending on the passed status, the styling of component changes
     *
     * @param {ProgressIndicatorStatus} error Displays `error` icon with `theme.color.notification.error` color in currently active step
     */
    status?: ProgressIndicatorStatus;
    /**
     * Allows to pass a custom className
     */
    className?: string;
    /**
     * Allows to pass testid string for testing purposes
     */
    'data-testid'?: string;
    /**
     * Screen reader label describing the purpose of the ProgressIndicator,
     */
    ariaLabel?: string;
    /**
     * Screen reader label describing the completed step,
     */
    completedStepLabel?: string;
}
/** @visibleName Progress Indicator */
declare const ProgressIndicator: ({ activeStep, "data-testid": dataTestId, ...props }: Props) => React.JSX.Element;
/** @component */
export default ProgressIndicator;