{"repo":"tanem/react-nprogress","free":true,"listed":false,"github":"https://github.com/tanem/react-nprogress","clone":"git clone https://github.com/tanem/react-nprogress.git","description":":hourglass: A React primitive for building slim progress bars.","language":"TypeScript","stars":463,"topics":["animation","component","higher-order-component","hoc","hook","hooks","javascript","loading","nprogress","progress"],"license":"MIT","category":"ui-components","readme_excerpt":"react-nprogress A React primitive for building slim progress bars. Background When to Use This Usage API Live Examples Installation Contributing License Background This is a React port of rstacruz's nprogress module. It exposes an API that encapsulates the logic of nprogress and renders nothing, allowing consumers to implement their own rendering. Two versions of nprogress are in circulation and they trickle differently. The 2014 npm release, 0.2.0 , adds a random amount of at most 0.02 every 800ms. The repository's master branch, never published to npm, adds tiered amounts every 200ms. This library mirrors master, so a side by side comparison against the npm package or the official demo page will show a different pace. The increment option covers the 0.2.0 pacing if you prefer the older feel. When to Use This This package is a headless primitive. It renders no markup and ships no CSS, supplying only the pacing state: a progress value that trickles towards completion, an isFinished flag, and the animationDuration to transition with. The bar itself is yours to write. - Use a drop-in bar such as nextjs-toploader , next-nprogress-bar , or nprogress itself when you want a styled bar wired up to your router with no rendering work. - Use this package when you render the bar yourself, for example with design-system components or custom containers and spinners, and want only the trickle and completion logic handled for you. - Use this package when you need several progress bars on on","default_branch":null,"files":null,"tree":[],"storefront":"/r/tanem","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/tanem/react-nprogress/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}