load-club

A lightweight, dependency-free fullscreen loading overlay for browser applications.

Install

npm install load-club

Use

import { show, hide } from "load-club";

show("Saving...", "Please keep this page open");

try {
  await saveForm();
} finally {
  hide();
}

show() can be called more than once. Each call must be paired with hide(); the overlay disappears only after the matching final hide() call.

Custom defaults

import { createLoading } from "load-club";

const uploadLoading = createLoading({
  text: "Uploading files...",
  subText: "Do not close this page",
});

uploadLoading.show();
await uploadFiles();
uploadLoading.hide();

You may override the defaults for a single call:

uploadLoading.show("Preparing upload...", "This may take a moment");

API

• show(text?, subText?): Shows the overlay and returns its DOM element. It is safe to import in SSR; it returns null when document is unavailable.
• hide(force?): Decrements the show count. Pass true to immediately clear every outstanding show call.
• createLoading({ text?, subText? }): Returns a controller with show() and hide() methods using these defaults.
• showBodyLoading and hideBodyLoading: Backward-compatible aliases for show and hide.

CommonJS

const { show, hide } = require("load-club");

Development

npm install
npm test
npm run build

npm run build creates ESM, CommonJS, and TypeScript declaration files in dist/.

Publishing and versioning

This project follows semantic versioning:

• Patch (0.1.1): compatible bug fixes.
• Minor (0.2.0): compatible new APIs.
• Major (1.0.0): breaking changes.

Before publishing, update version in package.json, then run:

npm publish --access public

The prepublishOnly script runs tests and builds the distributable files first.

License

MIT