@hixme-ui/percentage

hixme-ui Percentage component

Stats

StarsIssuesVersionUpdatedCreatedSize
@hixme-ui/percentage
2.0.0-alpha.124 months ago4 years agoMinified + gzip package size for @hixme-ui/percentage in KB

Readme

Percentage

npm i --save @hixme-ui/percentage

View it live

Props

Name Type Default
hideDecimals bool false
value number null

Basic Usage

Percentage can use a child value or a value prop for the number, and handles decimal placement and rounding.

import Input from '@hixme-ui/percentage'

<Percentage value='0.314' />
<Percentage>0.314</Percentage>
// both output 31.40%

hideDecimals

<Percentage hideDecimals value='0.891342' />
// outputs 89%

Format

Percentage has a static format function if needed outside of a JSX context.

Percentage.format({
  value: 0.1234
})
// outputs 12.34%

Percentage.format({
  value: 0.1234,
  hideDecimals: true,
})
// outputs 12%

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.