2019-01-28 23:34:56 +00:00
# Number
2022-04-11 09:45:09 +00:00
A collection of utilities to properly localize numerical values in WooCommerce
2019-01-28 23:34:56 +00:00
## Installation
Install the module
```bash
2022-03-04 04:01:16 +00:00
pnpm install @woocommerce/number --save
2019-01-28 23:34:56 +00:00
```
_This package assumes that your code will run in an **ES2015+** environment. If you're using an environment that has limited or no support for ES2015+ such as lower versions of IE then using [core-js ](https://github.com/zloirock/core-js ) or [@babel/polyfill ](https://babeljs.io/docs/en/next/babel-polyfill ) will add support for these methods. Learn more about it in [Babel docs ](https://babeljs.io/docs/en/next/caveats )._
## Usage
```JS
2022-04-11 09:44:51 +00:00
import { numberFormat, formatValue, calculateDelta } from '@woocommerce/number';
2019-01-28 23:34:56 +00:00
2019-11-21 21:51:52 +00:00
// It's best to retrieve the site currency settings and compose them with the format functions.
import { partial } from 'lodash';
// Retrieve this from the API or a global settings object.
const siteNumberOptions = {
2022-04-11 09:44:51 +00:00
precision: 2,
decimalSeparator: '.',
thousandSeparator: ',',
2019-11-21 21:51:52 +00:00
};
// Compose.
2022-04-11 09:44:51 +00:00
const formatStoreNumber = partial( numberFormat, siteNumberOptions );
const formatStoreValue = partial( formatValue, siteNumberOptions );
2019-11-21 21:51:52 +00:00
2019-01-28 23:34:56 +00:00
// Formats a number using site's current locale.
2019-11-21 21:51:52 +00:00
const localizedNumber = formatStoreNumber( 1337 ); // '1,377'
2019-01-28 23:34:56 +00:00
2019-11-21 21:51:52 +00:00
// formatValue's second argument is a type: average, or number
// The third argument is the number/value to format
// (The first argument is the config object we composed with earlier)
const formattedAverage = formatStoreValue( 'average', '10.5' ); // 11 just uses Math.round
const formattedNumber = formatStoreValue( 'number', '1337' ); // 1,337 calls formatNumber ( see above )
2019-01-28 23:34:56 +00:00
// Get a rounded percent change/delta between two numbers
const delta = calculateDelta( 10, 8 ); // '25'
```