// @flow
import React, {PropTypes as t} from 'react'

type PropsType = {steps: Array<string>}

const WizardSteps = ({steps}: PropsType) =>
  (
    <div className="wizard-steps-container">
      {
        steps.map((s, i) =>
          (<div className="step-container" key={i}>
            <span className="badge">{i}</span> {s}
          </div>))
      }
    </div>
  )

WizardSteps.displayName = 'WizardSteps'

WizardSteps.propTypes = {
  steps: t.arrayOf(t.string)
}

export default WizardSteps

@@ -135,15 +135,11 @@
 ) =%3E
-%0A 
  (%0A
-  
   %3Cd
@@ -185,20 +185,9 @@
     
-  %7B%0A        
+%7B
 step
@@ -205,20 +205,17 @@
 ) =%3E
-%0A    
+ (%0A
       
-(
 %3Cdiv
@@ -259,20 +259,16 @@
         
-   
- 
 %3Cspan cl
@@ -298,20 +298,16 @@
 an%3E %7Bs%7D%0A
-    
       %3C/
@@ -314,21 +314,17 @@
 div%3E
-))
 %0A    
-  %7D%0A  
+))%7D%0A
   %3C/
@@ -328,18 +328,16 @@
  %3C/div%3E%0A
-  
 )%0A%0AWizar
@@ -398,16 +398,16 @@
 pes = %7B%0A
-
   steps:
@@ -426,16 +426,17 @@
 .string)
+,
 %0A%7D%0A%0Aexpo

format with prettier