feat: add data-prevent-nprogress and disableSameURL props

README.md

@@ -20,7 +20,7 @@
   - [TypeScript](#typescript)
     - [First approach in a use client layout](#first-approach-in-a-use-client-layout)
     - [Second approach wrap in a use client Providers component](#second-approach-wrap-in-a-use-client-providers-component)
-- [Tips](#tips)
+- [Data attributes](#data-attributes)
   - [Disable progress bar on specific links](#disable-progress-bar-on-specific-links)
 - [Props](#props)
   - [height](#height)
@@ -30,6 +30,7 @@
   - [shallowRouting](#shallowrouting)
   - [startPosition](#startposition)
   - [delay](#delay)
+  - [disableSameURL](#disableSameURL)
   - [stopDelay](#stopdelay)
   - [nonce](#nonce)
   - [style](#style)
@@ -284,7 +285,7 @@ export default function RootLayout({
 }
 ```
 
-## Tips
+## Data attributes
 
 ### Disable progress bar on specific links
 
@@ -298,6 +299,19 @@ _/!\ This will not work for Link in svg elements._
 </Link>
 ```
 
+### Prevent progress
+
+You can prevent the progress bar from starting by adding the `data-prevent-nprogress={true}` attribute.
+
+```jsx
+<Link href="/dashboard">
+  <span>Dashboard</span>
+  <span onClick={(e) => e.preventDefault()} data-prevent-nprogress={true}>
+    preventDefault
+  </span>
+</Link>
+```
+
 ## Props
 
 ### height _optional_ - _string_
@@ -328,6 +342,10 @@ The position the progress bar starts at from 0 to 1 - **by default 0**
 
 When the page loads faster than the progress bar, it does not display - **by default 0**
 
+### disableSameURL _optional_ - _boolen_
+
+Disable the progress bar when the target URL is the same as the current URL - **by default true**
+
 ### stopDelay _optional_ - _number_
 
 The delay in milliseconds before the progress bar stops - **by default 0**
@@ -336,6 +354,10 @@ The delay in milliseconds before the progress bar stops - **by default 0**
 
 A cryptographic nonce (number used once) used to declare inline scripts for Content Security Policy - **by default undefined**
 
+### memo _optional_ - _boolean_
+
+A cryptographic nonce (number used once) used to declare inline scripts for Content Security Policy - **by default true**
+
 ### style _optional_ - _string_
 
 Your custom CSS - **by default [NProgress CSS](https://github.com/rstacruz/nprogress/blob/master/nprogress.css)**

demo/app-dir/src/app/page.tsx

@@ -13,6 +13,25 @@ export default function Home() {
       <Link href="/">Same route</Link>
       <Link href="/?test=param">Sallow</Link>
       <Link href="/dashboard">Dashboard</Link>
+      <Link
+        href="/dashboard"
+        style={{
+          display: 'flex',
+          flexDirection: 'column',
+        }}
+      >
+        <span>Dashboard</span>
+
+        <span
+          style={{
+            marginTop: 15,
+          }}
+          onClick={(e) => e.preventDefault()}
+          data-prevent-nprogress={true}
+        >
+          e.preventDefault()
+        </span>
+      </Link>
       <Link href="#test">Link with href</Link>
       <Link href="/dashboard" data-disable-nprogress={true}>
         Link with nprogress disabled

dist/AppProgressBar.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ProgressBarProps, RouterNProgressOptions } from '.';
 import { NavigateOptions } from 'next/dist/shared/lib/app-router-context.shared-runtime';
-export declare const AppProgressBar: React.MemoExoticComponent<({ color, height, options, shallowRouting, startPosition, delay, stopDelay, style, nonce, targetPreprocessor, }: ProgressBarProps) => React.JSX.Element>;
+export declare const AppProgressBar: React.MemoExoticComponent<({ color, height, options, shallowRouting, disableSameURL, startPosition, delay, stopDelay, style, nonce, targetPreprocessor, }: ProgressBarProps) => React.JSX.Element>;
 export declare function useRouter(): {
     push: (href: string, options?: NavigateOptions, NProgressOptions?: RouterNProgressOptions) => void;
     replace: (href: string, options?: NavigateOptions, NProgressOptions?: RouterNProgressOptions) => void;

dist/PagesProgressBar.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { ProgressBarProps } from '.';
-export declare const PagesProgressBar: React.MemoExoticComponent<({ color, height, options, shallowRouting, startPosition, delay, stopDelay, style, nonce, }: Omit<ProgressBarProps, 'targetPreprocessor'>) => React.JSX.Element>;
+export declare const PagesProgressBar: React.MemoExoticComponent<({ color, height, options, shallowRouting, disableSameURL, startPosition, delay, stopDelay, style, nonce, }: Omit<ProgressBarProps, 'targetPreprocessor'>) => React.JSX.Element>;

dist/index.d.ts

@@ -31,11 +31,13 @@ export interface ProgressBarProps {
     height?: string;
     options?: Partial<NProgressOptions>;
     shallowRouting?: boolean;
+    disableSameURL?: boolean;
     startPosition?: number;
     delay?: number;
     stopDelay?: number;
     style?: string;
     nonce?: string;
+    memo?: boolean;
     shouldCompareComplexProps?: boolean;
     targetPreprocessor?: (url: URL) => URL;
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-nprogress-bar",
-  "version": "2.3.9",
+  "version": "2.3.10",
   "description": "NextJS progress bar compatible with new app directory",
   "repository": {
     "type": "git",