{"repo":"TheSGJ/nextjs-toploader","free":true,"listed":false,"github":"https://github.com/TheSGJ/nextjs-toploader","clone":"git clone https://github.com/TheSGJ/nextjs-toploader.git","description":"A Next.js Top Loading Bar component made using nprogress, works with Next.js 16 , Next.js 15 and React.","language":"TypeScript","stars":1237,"topics":["next","next13","nextjs","nextjs13","progressbar","react","toploader","next14","nextjs14"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"Next Js TopLoader - A Next.js Top Loading Bar component made using nprogress, works with Next.js 14 and React. Install using npm: using yarn: Usage import using: Usage with app/layout.js for app folder structure For rendering add to your return() inside the of RootLayout() : Usage with pages/ app.js for pages folder structure For rendering add to your return() in MyApp() (Recommended): You can also use in pages router, but it's recommended to use for useRouter hook support from nextjs-toploader version 2.6.12 onwards Compatibility with useRouter hook useRouter hook usage with app/layout.js for app folder structure For triggering TopLoader when using useRouter hook (app router): Then simply use it in your code for example: useRouter hook usage with pages/ app.js for pages folder structure For triggering TopLoader when using useRouter add to your return() in MyApp() : --- useTopLoader Hook A custom hook for handling progress indicators using NextTopLoader. Methods Name Description ----------------- ------------------------------------------------------------------------------------------------------------------ start Starts the progress bar done Completes the progress bar. Can be forced to complete immediately with an optional force parameter remove Removes the progress bar element from the DOM setProgress Manually sets the progress value (between 0.0 and 1.0) inc Increments the progress bar by a specified amount. If no amount is specified, it makes a small automatic increment ","default_branch":null,"files":null,"tree":[],"storefront":"/r/TheSGJ","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/TheSGJ/nextjs-toploader/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."}