react-progressbar-on-scroll

react-progressbar-on-scroll

Progress bar on scroll React component

live example on codesandbox

Installation

npm install react-progressbar-on-scroll
# or
yarn add react-progressbar-on-scroll

Usage

import React from 'react'
import ProgressBar from 'react-progressbar-on-scroll'

const App = () => (
  <div className="app">
    <ProgressBar />
    <div>Your content...</div>
  </div>
)

export default App

Available props

key	type	default	description
color	string	#1ce	color of progress bar
height	number	4	height of progress bar in px
direction	right-left	right	towards where the progress bar fills
position	top-bottom	top	position of progress bar in window
gradient	boolean	false	activate gradient on progress bar
gradientColor	string	yellow	Second color of progress bar

Example

<ProgressBar
  color="#fff"
  height={10}
  direction="left"
  position="bottom"
  gradient={true}
  gradientColor="#eee"
/>

Licence

MIT

Changelog

2.0.0

• Bump path-parse from 1.0.6 to 1.0.7 #7
• Bump minimist from 1.2.5 to 1.2.6 #8
• Bump lodash from 4.17.15 to 4.17.21 #4
• Bump browserslist from 4.11.1 to 4.16.6 #5
• chore: setup release-it 399b494
• chore: upgrade deps b51b7df
• chore: switch from rollup to vitejs and add cjs/es exports ce1ce4a