Asteroid Loading Spinner

This is React component which has a small, simple loading indicator displaying a moving asteroid. It is created with a svg and a little bit of css animation magic.

In order to use this package, you need to install react and react-dom to your project.

Installation

Install the package:

npm install --save asteroid-loading-spinner

then, import the package to the desired file:

import AsteroidLoadingSpinner from 'asteroid-loading-spinner'

Props v2

Name | Optional | Description | Default value | ----|---| --- | --- | asteroidColor | :heavy_check_mark: | Color of the asteroid |"#ea7317" | lineColor | :heavy_check_mark: | Color of the lines | "currentColor" |

Props v1

Name | Optional | Description | Default value | ----|---| --- | --- | circleClassName | :heavy_check_mark: | Class name to override the colors of the asteroid (the circles) |"circle" | lineClassName | :heavy_check_mark: | Class name to override the colors for the lines that indicate that the asteroid is moving | "line" |

Example Usage

import AsteroidLoadingSpinner from 'asteroid-loading-spinner'

const App = () => (
  <AsteroidLoadingSpinner circleClassName="class-name" />
)