Package Exports

react-simple-loading

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-simple-loading) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-simple-loading

A simple React component to display while you're fetching data or waiting for something to load. This component consists of 2 divs: an inner, which is the spinner, and an outer, which is the container. The outer has its height and width set to 100% and uses flexbox to display the spinner perfectly in the center of its parent container.

Installation

npm i --save react-simple-loading

Demo

Example

import React, { Component } from 'react';
import Loading from 'react-simple-loading';

class App extends Component {
    render() {
        return (
            <div>
                <Loading />
            </div>
        );
    }
}

Options

You can change the component size, stroke color, and stroke size by passing props like so:

<Loading 
    color={'firebrick'}
    stroke={'10px'}
    size={'100px'} />

color can be any valid css color:

LightSeaGreen
rgb(0, 0, 0)
rgba(0, 0, 0, 1)
hsl(0, 0%, 0%)
hsla(0, 0%, 0%, 1)
#000
#000000

License

MIT