🎉Welcome to Bit Cloud's new home!Start freeor check out our newcommunity site

grid

v1.2.1arrow_drop_down
v1.2.1
v1.1.8
v1.1.7
v1.1.4
v1.1.2
v1.1.0
v1.0.8
v1.0.7
v1.0.5
v1.0.4
v1.0.3
STATUS
Passing
DOWNLOADS
1,390
LICENSE
MIT
VISIBILITY
Public
PUBLISHED
2 years ago
SIZE
2 KB
grid react spinner
1 contributor
Install grid as a package?
Copied
npm i @bit/joshk.react-spinners-css.grid
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Files
index.js
32 Lines(24 sloc)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames'
import styles from './style.module.css'

export default function Grid({ color, className, style, size }) {
  const circles = [...Array(9)].map((_, index) => <div key={index} style={{ background: `${color}` }} />)

  return (
    <div className={classNames(styles['lds-grid'], className)} style={{ width: size, height: size, ...style }}>
      {circles}
    </div>
  )
}

Grid.propTypes = {
  /** hex color */
  color: PropTypes.string,
  /** size in pixel */
  size: PropTypes.number,
  /** class name  */
  className: PropTypes.string,
  /** style object */
  style: PropTypes.object,
}

Grid.defaultProps = {
  color: '#7f58af',
  size: 80,
  className: '',
  style: {},
}
Help and resources