react-loading-placeholder

Inspired by Facebook Content Placeholder and this article: https://cloudcannon.com/deconstructions/2014/11/15/facebook-content-placeholder-deconstruction.html. Can be used for both tables and lists.

Installation

npm install --save react-loading-placeholder

Including it:

import LoadingPlaceholder from 'react-loading-placeholder'
 
<LoadingPlaceholder numberOfRows={10}></LoadingPlaceholder>

Settings:

Set row height and space between:

<LoadingPlaceholder numberOfRows={10} heightOfRows={40} spaceBetween={10}></LoadingPlaceholder>

Table Layout:

<LoadingPlaceholder numberOfRows={10} tableLayout={true}></LoadingPlaceholder>

Set filter placeholder size:

<LoadingPlaceholder numberOfRows={10} tableLayout={true} filterOptions={{width: 300, height: 50}}></LoadingPlaceholder>