Migration from NProgress-V2

To clarify the library’s identity and enable it to evolve more freely, we decided to move away from the name NProgress-V2 and adopt a new identity: BProgress. This rebranding gives us the opportunity to start fresh on a solid foundation, introduce new features, and provide more integration libraries while fostering a richer ecosystem around the project.

There are some differences with the nprogress-v2 package.

Migration to BProgress 1.1

The first difference is the name of the nprogress-v2 package, which is now called @bprogress/core. So you can change the import like this:

- import { NProgress } from 'nprogress-v2';
+ import { BProgress } from '@bprogress/core';

The second difference is that all occurrences of “nprogress” have been replaced by “bprogress” in the code.

So you can change your code like this for example:

- NProgress.start();
+ BProgress.start();

CSS has also changed, so if you're using custom CSS, be sure to rename all your .nprogress to .bprogress.

- .nprogress
+ .bprogress

Migration to BProgress 1.2

The difference is about the template, barSelector and spinnerSelector options. We no longer use roles as selectors, as the “bar” and “spinner” roles are not valid ARIA roles.

So you can change your code like this (only if you use these options):

- NProgress.configure({
-   template: `<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>`,
-   barSelector: '[role="bar"]',
-   spinnerSelector: '[role="spinner"]',
- });
+ BProgress.configure({
+   template: '<div class="bar"><div class="peg"></div></div><div class="spinner"><div class="spinner-icon"></div></div><div class="indeterminate"><div class="inc"></div><div class="dec"></div></div>',
+   barSelector: '.bar',
+   spinnerSelector: '.spinner',
+ });

And then you can use the BProgress object as you would use the NProgress object.