with-progress-bar

A lightweight utility that wraps async functions with NProgress to automatically show a progress bar during their execution.

Note: This utility works only for async functions. Synchronous functions block the main thread, so progress bars will not animate properly.

Installation

npm install with-progress-bar

Usage

Import and wrap your async functions to automatically display a progress bar:

import withProgressBar from 'with-progress-bar'
import 'with-progress-bar/style.css'

// Wrap any async function
const fetchData = withProgressBar(async (url: string) => {
  const response = await fetch(url)
  return response.json()
})

// Use the wrapped function. The progress bar will show automatically.
const data = await fetchData('https://api.example.com/data')

Styling: import 'with-progress-bar/style.css' imports the original CSS of NProgress. If you want to customize the CSS, do not import this file and use your own.

API

withProgressBar<T, K extends unknown[]>(func: (...args: K) => Promise<T>)

Wraps an async function to automatically show a progress bar during its execution.

Parameters:

• func: The async function to wrap.

Returns:

• A new async function that behaves identically to the original but shows a progress bar during execution.

Development Instructions

For development, open ./playground.html to check that the built package works correctly.

This repository is initialized with starter-ts.