@licuido-ui/ui_responsive-stepper
v0.0.1
Published
The Stepper component is a customizable React component that allows you to create a step-by-step user interface for guiding users through a process or workflow. It can be used to represent a multi-step form, a progress tracker, or any scenario where seque
Readme
Stepper
The Stepper component is a customizable React component that allows you to create a step-by-step user interface for guiding users through a process or workflow. It can be used to represent a multi-step form, a progress tracker, or any scenario where sequential navigation is required.
Author
- @author Vasanth Raj [email protected]
Link
PlayGround
Installation
npm i @licuido-ui/ui_responsive-stepperImport component
import { Stepper } from '@licuido-ui/ui_responsive-stepper';Usage
<ResponsiveStepper
variant='vertical'
steps={steps}
icons={icons}
activeStep={activeStep}
labelPositionStyle={{ top: 19 }}
/> />Image

Sample Code
<ResponsiveStepper
variant='vertical'
steps={steps}
icons={icons}
activeStep={activeStep}
labelPositionStyle={{ top: 19 }}
/>Props
| Name | Description | Default | Control | | ---------------------- | -------------- | ------- | ------------ | | variant | string | string | string | | steps | StepData[] | [] | string[] | | icons | ReactElement | { } | ReactElement | | activeStep | number | [] | number | | activeLineStyle | SxProps | 0 | SxProps | | className | string | - | string | | sx | SxProps | - | SxProps | | completedLineStyle | SxProps | - | SxProps | | lineStyle | SxProps | - | SxProps | | labelStyle | SxProps | - | SxProps | | stepIconStyle | SxProps | - | SxProps | | activeStepIconStyle | SxProps | - | SxProps | | completedStepIconStyle | SxProps | - | SxProps | | connectorOverAllStyle | SxProps | - | SxProps |
