Package Exports

react-stepa
react-stepa/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-stepa) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

🚀 Installation

  npm install react-stepa --save

📍 Preview

Demo App

✨ Usage

import { Stepper, useStepper } from "react-stepa";

const App = () => {
  const initialStep = 0;
  const { next, previous, step } = useStepper(initialStep);

  return (
    <>
    <Stepper
      steps={[
        {
          label: "Step 1",
          description: "Loremur adipiscing elit, sed do eiusmod tem",
        },
        {
          label: "Step 2",
          description:
            "Lorem ipsum d  r incididunt ut labore et is nostru",
        },
        {
          label: "Step 3",
          description:
            "Lorem ipsum dolor sit a e e magnminim veniam, quis nostru",
        },
      ]}
      activeStep={step}
    />

    <button onClick={()=> next()}> Next </button>
    <button onClick={()=> previous()}> Previous </button>

    </>
  );
};

📌 API

Name	Type	Default	Description
steps	array of {label: string, description: string}		Steps content.
verticalOrientation	boolean	false	Direction of Steps. `Vertical` or `horizantal`.
activeStep	number	0	Index of current Step.
customStyle	{completed: string, pending: string, progress: string}	{completed:#4BB543, pending:#e9e9e9, progress:#2178FF}	Steps style.