import * as React from 'react';

export interface StepperProps {
  /** Hook for testing purposes. */
  dataHook?: string;
  /** Event triggered on step click: `onClick(stepIndex)` */
  onClick?: (index: number) => void;
  /** Index of the active step. */
  activeStep: number;
  /**
   * An array of steps, where each step is an object with the following properties:
   * - `text` - step title text (required).
   * - `type` - step type (`completed`, `disabled`, `error` or default `normal`).
   */
  steps: StepperStep[];
  /** Style type.
   * @default 'circle'
   */
  type?: StepperType;
  /**
   * Fit mode for steps. In `stretched` mode the component will grow to fill parent
   * container width.
   * @default 'compact'
   */
  fit?: StepperFit;
  /** Sets the size of the items
   * @default 'small'
   */
  size?: StepperSize;
}

export default class Stepper extends React.PureComponent<StepperProps> {}

export interface StepperStep {
  text: string;
  /** Style type.
   * @default 'circle'
   */
  type?: StepperStepType;
}

export type StepperType = 'circle' | 'text';
export type StepperFit = 'compact' | 'stretched';
export type StepperStepType = 'completed' | 'disabled' | 'error' | 'normal';
export type StepperSize = 'medium' | 'small';