1.0.1 • Published 2 years ago
react-stepa v1.0.1
🚀 Installation
npm install react-stepa --save
📍 Preview
✨ 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. |