Basic


Multiple options

size="20" - show-step-number - shadow - variant="square"

Disabled click on steps buttons - space="between"


Disabled next steps from active step


Disabled previous steps from active step


Disabled specifique steps ([2, 4])


Colors


color="primary"

color="secondary"

color="third"

color="success"

color="danger"

color="warning"

color="grey"

color="info"

color="light"

color="dark"

color="default"

color="white"

color="black"

color="transparent"


How to use it ?

  <template>
  <MazStepper
    v-model="activeStep"
    :steps="4"
  />
</template>

<script>
  import { MazStepper } from 'maz-ui'
  export default {
    components: { MazStepper },
    data () {
      return {
        activeStep: 2
      }
    }
  }
</script>