@bever1337/react-dot-spinner

Your favorite node spinner, in React!

Usage no npm install needed!

<script type="module">
  import bever1337ReactDotSpinner from 'https://cdn.skypack.dev/@bever1337/react-dot-spinner';
</script>

README

react-dot-spinner

'⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'

Your favorite node spinner, in React!

Documentation

Gif animation of react-dot-spinner: dot spinner

  1. Prerequisities

  • This component library relies on the (global) window API requestAnimationFrame.

  • ES6 module syntax must be supported in your JavaScript environment.

  • Peer dependencies: React ^16.13.1

  1. Installation
npm install @bever1337/react-dot-spinner
  1. Usage
/* Idiomatic JSX Example (assumes transpiling, bundling, etc.) */
import React from 'react';
import { DotSpinner } from '@bever1337/react-dot-spinner';

function MyComponent() {
  return (
    <span>
      <DotSpinner />
    </span>
  );
}
  1. Styling
import React from 'react';
import { DotSpinner } from '@bever1337/react-dot-spinner';

function MyComponent() {
  // Use your favorite styling techniques. Inline styles are used here for simplicity.
  return (
    <span
      style={{
        color: 'red',
      }}
    >
      <DotSpinner />
    </span>
  );
}