[FR] - New component to represent process stages / timelines

I have a suggestion for a new component, a stepper component; I'm partial to Semantic UI's but Material UI's feels like a good "minmal" version of it.

I could see these options being available on the component.

• Label - A bigger font sized label of the step.
• Description - A short description of the text, usually in a smaller font.
• Icon - An Icon for the step.
• IconCompleted - The icon to display if the step is completed.
• numeralStep - Bool, if true instead of an icon a step count would show. E.G. 1,2,3 and so on.

In which you can combine to use all of them, or just for example the Icon or Label, or any combination of them to create an step item. Preferably the layout and size would go from Big (with all options) to a smaller layout if you just use the Label or Icon for example.

Could be nice if some animations where used while transitioning between steps, such as having the Description hidden until that step is the active one and fading in or whatnot.

A pseudo code example;

const currentStep = 0;

<Stepper currentStep={currentStep} numeralStep={false}>
<Step value={0} icon="fa fa-truck" iconCompleted="fa fa-check" label="Shipping" description="Please enter your shipping details"/>
<Step value={1} icon="fa fa-credit-card-alt" iconCompleted="fa fa-check" label="Credit Card Details" description="Please enter your credit card details"/>
<Step value={2} icon="fa fa-info" iconCompleted="fa fa-check" label="Order Confirmed" description="Your order have been confirmed and sent!"/>
</Stepper>