# asteroid-loading-spinner

> A simple asteroid loading spinner

Latest version **2.0.2** (published 2021-02-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install asteroid-loading-spinner
pnpm add asteroid-loading-spinner
yarn add asteroid-loading-spinner
bun add asteroid-loading-spinner
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.2 |
| Published | 2021-02-05 |
| First published | 2021-01-30 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 12.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 5 |
| Author | eevajonnapanula |
| Maintainers | eevajonnapanula |
| Keywords | react, loading-spinner |

## Links

- npm: https://www.npmjs.com/package/asteroid-loading-spinner
- Repository: https://github.com/eevajonnapanula/asteroid-loading-spinner
- Homepage: https://github.com/eevajonnapanula/asteroid-loading-spinner#readme
- Issues: https://github.com/eevajonnapanula/asteroid-loading-spinner/issues
- npm.io page: https://npm.io/package/asteroid-loading-spinner

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 2.0.2 (latest) — 2021-02-05
- 2.0.1 — 2021-01-31
- 2.0.0 — 2021-01-31
- 1.0.1 — 2021-01-30
- 1.0.0 — 2021-01-30

## README

# Asteroid Loading Spinner

<img src="./assets/asteroid-loading-spinner.gif" alt="" height="200" >

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

```react
import AsteroidLoadingSpinner from 'asteroid-loading-spinner'

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

[1]: https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentcolor_keyword

---
_Source: https://npm.io/package/asteroid-loading-spinner · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._