Vue Yoonit Components

Home | Atoms | Molecules | Bosons | Quarks

YooStepper

The component is used to create steps (numbers or dots).

This issues and receives next or previous commands that can be created by the user or using the YooPagination component that is responsible for receiving the navigation buttons

Usage

To use the component, simply invoke it in your template with the desired props

Input

<template>
  <yoo-stepper
    counterType="number"
    :totalSteps="5"
  />
</template>

Output

The output of the above code will be:

Dots

Props

Parameter	Type	Default	Valid values	Description	Required
counterType	String	number	number dot	Sets the type of pagination the component will use	false
totalSteps	Number	1	Any positive number	Sets the total number of steps	false
currentStep	Number	0	Any positive number	Set the current step	false

Next component ▶️

◀️ Previous component

To contribute and make it better

Clone the repo, change what you want and send PR. For commit messages we use Conventional Commits.

Contributions are always welcome!

---

Code with ❤ by the Yoonit Team