Progress

A Progress component visually indicates the completion status of a task or process. It typically consists of a progress bar that fills up as the task progresses, providing users with a clear and immediate understanding of how much of the task is completed and how much remains. This component is commonly used in forms, uploads, downloads, and loading states to enhance user experience by managing expectations and keeping users informed.

Demo

Usage

import { NProgress } from '@nayan-ui/react';
const Progress = () => {
return <NProgress value={50} />;
};
export default Progress;

Attributes

NameTypeDefaultDetails
valuenumberRequiredCurrent progress value.
classNamestring' 'You can customise by passing tailwind classes.
labelstringOptionalLabel for the progress bar.
showLabelbooleanOptionalWhether to show the label.