开发者社区> 镜像站> NPM> @zippytech/react-load-mask
@zippytech/react-load-mask
React load mask
Last updated 4 years ago by zippyui .
Apache-2.0 · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @zippytech/react-load-mask 
SYNC missed versions from official npm registry.

react-load-mask

A carefully crafted LoadMask for React

Install

$ npm i @zippytech/react-load-mask --save

Key features

  • adjustable size
  • adjustable visibility
  • easily themeable
  • css animations
  • small footprint

Usage

import '@zippytech/react-load-mask/index.css'
import LoadMask from '@zippytech/react-load-mask'

<LoadMask visible={true} />
<LoadMask visible={true} size={20} />
<LoadMask visible={false} size={120} />

Props

  • visible - defaults to false. Set to true if you want the LoadMask to be visible.
  • size - defaults to 40. The size of the loader inside the LoadMask
  • theme - defaults to "default". See the theming section below.

Theming

The base css class of the component is @zippytech/react-load-mask.

For having the default theme, just import @zippytech/react-load-mask/index.css. Basically, that uses @zippytech/react-load-mask/base.css (the functional styles) AND @zippytech/react-load-mask/theme/default.css (the default theme styles).

If you want to use/build another theme, you can render the LoadMask as:

<LoadMask theme="custom" visible />

The code above makes the LoadMask component have the zippy-react-load-mask--theme-custom className.

LICENSE

Apache2

Current Tags

  • 4.0.0                                ...           latest (4 years ago)

1 Versions

  • 4.0.0                                ...           4 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 1
Dependencies (2)
Dev Dependencies (17)
Dependents (1)