woocommerce/plugins/woocommerce-admin/packages/number
Darren Ethier 33c5b41e3f Align WooCommerce javascript code standards/linting/styles with WordPress core. (https://github.com/woocommerce/woocommerce-admin/pull/3674)
* align code styles with the same configuration as Woo-Blocks

* initial pass of reformat-files

* applies manual fixes to various new linting errors surfaced by the configuration change.

* Fix state mutation in image-upload

* remove unused pre-commit-hook.js

* requestAnimationFrame -> window.requestAnimationFrame

* wc-api eslint changes

* eslint fixes on client/lib and client/settings

* client/header eslint changes

* fixes for client/dashboard part 1

* fixes client/dashboard part 2 of 2

* client/analytics part 1

* client/analytics continued

* client/analytics, last batch

* rename __mock__ directory

* pass in useEffect, useState from React component or function

* remove '+' from sprintf string argument

* use ref instead of findDOMNode

* reformat and repaply package.json changes

* install deps before running linter in Travis

* useGetCountryStateAutofill

* counryStateAutofill

* countryStateAutofill

Co-authored-by: Paul Sealock <psealock@gmail.com>
2020-02-14 15:23:21 +13:00
..
src Align WooCommerce javascript code standards/linting/styles with WordPress core. (https://github.com/woocommerce/woocommerce-admin/pull/3674) 2020-02-14 15:23:21 +13:00
.npmrc Build: Create new number package (https://github.com/woocommerce/woocommerce-admin/pull/1399) 2019-01-28 15:34:56 -08:00
CHANGELOG.md Packages: Prep for release. (https://github.com/woocommerce/woocommerce-admin/pull/3325) 2019-12-02 08:08:35 -05:00
README.md Decouple currency and numbers packages from `wcSettings`. (https://github.com/woocommerce/woocommerce-admin/pull/3277) 2019-11-21 16:51:52 -05:00
package.json Update babel monorepo to v7.8.4 (https://github.com/woocommerce/woocommerce-admin/pull/3668) 2020-02-06 14:16:24 +13:00

README.md

Number

A collection of utilities to propery localize numerical values in WooCommerce

Installation

Install the module

npm install @woocommerce/number --save

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 or @babel/polyfill will add support for these methods. Learn more about it in Babel docs.

Usage

import { formatNumber, formatValue, calculateDelta } from '@woocommerce/number';

// 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 = {
    precision: 2,
	decimalSeparator: '.',
	thousandSeparator: ',',
};
// Compose.
const formatStoreNumber = partial( siteNumberOptions, formatNumber );
const formatStoreValue = partial( siteNumberOptions, formatValue );

// Formats a number using site's current locale.
const localizedNumber = formatStoreNumber( 1337 ); // '1,377'

// 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 )

// Get a rounded percent change/delta between two numbers
const delta = calculateDelta( 10, 8 ); // '25'