@foundbyte-loading

Loading the animation library

Install

yarn add @foundbyte/loading

npm install @foundbyte/loading

Use

import React from 'react';
import '@foundbyte/loading/es/components/loading/style';
import { Loading } from '@foundbyte/loading';

const svgs = [
    'audio',
    'ball-triangle',
    'bars',
    'circles',
    'grid',
    'hearts',
    'oval',
    'puff',
    'rings',
    'spinning-circles',
    'tail-spin',
    'three-dots'
]

const Demo: React.FC<{}> = () => {
    return <div className={'fb-loading-demo'}>
        <div />
        <ul>
            {svgs.map((svg, i) => {
                const key = i.toString();
                return (
                    <li key={key}>
                        <Loading style={{marginBottom: '0.5rem'}} type={svg} />
                        <span>&#60;Loading type={`'${svg}'`} /&#62;</span>
                    </li>
                );
            })}
        </ul>
    </div>
}

export default Demo;