@paprika/progress-bar
v1.1.13
Published
ProgressBar is a component that shows the current progress of an action
Downloads
381
Keywords
Readme
@paprika/progress-bar
Description
ProgressBar is a component that shows the current progress of an action
Installation
yarn add @paprika/progress-bar
or with npm:
npm install @paprika/progress-bar
Props
ProgressBar
| Prop | Type | required | default | Description | | ----------- | ------------------- | -------- | ------- | --------------------------------------------------------- | | a11yText | string | false | null | Descriptive a11y text for assistive technologies. | | bodyText | string | false | null | Description for the ProgressBar | | completed | number | false | 0 | Specifies how much progress has been completed from 0-100 | | header | node | false | null | Text for the heading displayed above ProgressBar | | headerLevel | [ 1, 2, 3, 4, 5, 6] | false | 3 | Semantic heading level of header | | isCompact | bool | false | false | If ProgressBar is displayed in a compact style |
Usage
import ProgressBar from "@paprika/progress-bar";
<ProgressBar
header="Preparing your file..."
bodyText="Control attributes are getting updated. This might take more than 15secs."
completed={30}
/>;