react-spinning-cat

Install

npm install react-spinning-cat

Usage

Full-page loader

import { Loader } from "react-spinning-cat";

function LoadingPage() {
  return <Loader />;
}

Inline spinner

import { Spinner } from "react-spinning-cat";

function SaveButton({ saving }: { saving: boolean }) {
  return (
    <button>
      {saving && <Spinner size={14} />}
      Save
    </button>
  );
}

Components

<Loader />

Full-page loading screen with "Loading..." text.

Prop	Type	Default	Description
text	string	"Loading"	Loading text displayed below the cat
scale	number	1	Scale factor (1 = 110x88px)
className	string	—	CSS class for the container
style	CSSProperties	—	Inline styles for the container

<Spinner />

Inline spinner for compact loading states.

Prop	Type	Default	Description
size	number	16	Spinner size in pixels
className	string	—	CSS class for the img element
style	CSSProperties	—	Inline styles for the img element

License

MIT