ino-stepper: Design component

[janivo]

Description

The ino-stepper component is a new addition to our component library, intended to provide users with a visual indication of their progress within wizards or multi-step processes. As a fundamental part of user interfaces, steppers help users navigate through sequential tasks by highlighting the current, past, and future steps.

Acceptance Criteria

• A new design for the ino-stepper component is created, aligning with its intended use within wizards or multi-step processes.
• The design includes clear visual indicators for current, past, and future steps, aiding users in understanding their progress.
• The ino-stepper component supports both vertical and horizontal orientations to cater to different layout requirements.
• Each step within the ino-stepper can display either a step number or an icon, along with an optional label for additional context.
• Steps within the ino-stepper can be visually distinguished as unfinished or finished, providing clear feedback on the user's progress.
• Design elements such as colors, typography, and spacing adhere to our design system and brand guidelines, ensuring consistency across the application.
• The design is flexible and customizable to accommodate various configurations and use cases of the ino-stepper component.

Examples

• https://mui.com/material-ui/react-stepper/
• https://www.primefaces.org/primereact-v8/steps/
• https://chakra-ui.com/docs/components/stepper/usage