react-loading

React loading component

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-loading
804192.0.36 years ago9 years agoMinified + gzip package size for react-loading in KB

Readme

react-loading
Build Status Coverage Status
Easy to use loading animations for React projects. Uses SVG animations from Brent Jackson's loading project.

Installation

npm i react-loading
or
yarn add react-loading

Demo

Check here

Loading Types

  • blank
  • balls
  • bars
  • bubbles
  • cubes
  • cylon
  • spin
  • spinningBubbles
  • spokes

Examples

import React from 'react';
import ReactLoading from 'react-loading';

const Example = ({ type, color }) => (
	<ReactLoading type={type} color={color} height={667} width={375} />
);

export default Example;

import React from 'react';
import ReactLoading from 'react-loading';

const Example = ({ type, color }) => (
	<ReactLoading type={type} color={color} height={'20%'} width={'20%'} />
);

export default Example;

Props

| Name | Type | Default Value | |:------:|:------:|:---------------:| | type | String | balls | | color | String | #ffffff | | delay | Number | 0 (msecs) | | height | Number or String | 64 (px) | | width | Number or String | 64 (px) | | className | String | '' |

License

MIT