react-loading-skeleton

> React Loading Skeleton Library

 

Install

``bash
npm install --save @wadehrarshpreet/react-loading-skeleton

or

yarn add @wadehrarshpreet/react-loading-skeleton
`

Usage

`jsx
import React from 'react'

import Skeleton from '@wadehrarshpreet/react-loading-skeleton'

const Loader = ({count = 5}) => ; // Five-line loading skeleton;

export default Loader;
`

Theming

Using a component, you can easily change the colors of all
skeleton components below it in the React hierarchy:

`javascript
import Skeleton, { SkeletonTheme } from "@wadehrarshpreet/react-loading-skeleton";









;
`

Demo

Checkout Demo

Duration

`javascript

`

duration: Number, defaults to 1.2

Duration is how long it takes do one cycle of the skeleton animation.

Width

width: Number | String | null, defaults to null

`javascript

`

Width of the skeleton. Useful when the skeleton is inside an inline element with
no width of its own.

Height

Height: Number | String | null, defaults to null

`javascript

`

Height of the skeleton. Useful when you don't want to adapt the skeleton to a text element but for instance
a card. Also needed for the prop circle (see below).

Circle

Circle: Boolean | false, defaults to false

`javascript

``

Prop for making the skeleton look like a circle, for when you are creating a user card with a profile picture for instance.