A fully-featured React loader overlay component

#react #javascript #npm #opensource

I got tired of copy-pasting loading overlay code between React projects — so I published it as an npm package.

how many times have you written something like this?

const [isLoading, setIsLoading] = useState(false);

// then somewhere... a semi-transparent div, a spinner, z-index battles,
// position: fixed, you know the drill.

yeah. same.

so I built loader-overlay — a simple React component that wraps your content and handles all of that for you.

getting started:

npm install loader-overlay

then in your component:

import LoaderOverlay from 'loader-overlay';

function MyPage() {
  const [loading, setLoading] = useState(false);

  return (
    <LoaderOverlay active={loading}>
      <YourContent />
    </LoaderOverlay>
  );
}

that's genuinely it. no 15-step config, no provider wrapping your whole app, no style clashes.

I built this because the existing options were either too heavy or too rigid. loader-overlay is intentionally small and flexible — use your own spinner, scope it to a section, or go full page. your call.

try it out, open an issue, send a PR — all welcome.

loader-overlay