Need private packages and team management tools?Check out npm Teams »

@fenderdigital/react-radial-meter

1.1.0 • Public • Published

RadialMeter for Fender React UI Kit

Description

RadialMeter is used to display progress in a circle form.

Installation and Usage

yarn install @fenderdigital/react-radial-meter --save
import RadialMeter from '@fenderdigital/react-radial-meter';

Props

  • size - width and height in pixels of the circle.
  • circleColor - fill color of the circle
  • progressColor - color of the progress meter
  • strokeWidth - width of the progress meter ring
  • percentCompleted - percentage completed in decimal. e.g. .8 (80%), .6 (60%), 1 (100%)
  • centerIcon - icon name
propName propType defaultValue isRequired
size number 40 -
circleColor string "#E6E6E6" -
progressColor string "#2AC278" -
strokeWidth number 4 -
percentCompleted number .5 -
centerIcon string "check" -

Development

Check the Monorepo README for development documentation.

Install

npm i @fenderdigital/react-radial-meter

DownloadsWeekly Downloads

38

Version

1.1.0

License

UNLICENSED

Unpacked Size

46 kB

Total Files

6

Last publish

Collaborators

  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar