# format-currency-input

> Reformat inputted currency text.

Latest version **0.3.0** (published 2020-05-11) · MIT license · 0 weekly downloads

## Install

```sh
npm install format-currency-input
pnpm add format-currency-input
yarn add format-currency-input
bun add format-currency-input
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.3.0 |
| Published | 2020-05-11 |
| First published | 2020-05-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 5.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Brian Swank |
| Maintainers | bswank |
| Keywords | format, formatting, currency, money, input, string, dollar, cent |

## Links

- npm: https://www.npmjs.com/package/format-currency-input
- Repository: https://github.com/bswank/format-currency-input
- Homepage: https://github.com/bswank/format-currency-input#readme
- Issues: https://github.com/bswank/format-currency-input/issues
- npm.io page: https://npm.io/package/format-currency-input

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.3.0 (latest) — 2020-05-11
- 0.2.3 — 2020-05-10
- 0.2.2 — 2020-05-09
- 0.2.1 — 2020-05-09
- 0.2.0 — 2020-05-09
- 0.1.4 — 2020-05-09
- 0.1.3 — 2020-05-09
- 0.1.2 — 2020-05-09
- 0.1.1 — 2020-05-09
- 0.1.0 — 2020-05-09

## README

# format-currency-input

`format-currency-input` is a small utility that reformats currency in an input and also exposes some helper functions.

**Check out a [demo](https://format-currency-input.netlify.app/).**

## Notes

- This package makes use of `Intl.NumberFormat`; your environment must support it or have the appropriate polyfill.
- This package was created for a very specific use-case when I couldn't find anything slim enough that exactly matched what I needed. I'm happy to entertain further development.

## Installation

```
npm i format-currency-input
```

## Usage

CommonJS Require:

```js
const formatCurrencyInput = require('format-currency-input')
```

ES6 Import:

```js
import formatCurrencyInput from 'format-currency-input'
```

### Primary Usage:

The `watch` method accepts an input selector and options. It will find all inputs with a given selector via `querySelectorAll` and then reformat the input on `blur`.

```js
formatCurrencyInput.watch('.currency-input')
```

**With options:**

```js
formatCurrencyInput.watch('.currency-input', {
  removeCents: true,
  removeSymbol: true,
})
```

### Helper Functions:

The `format` and `cents` methods expose a couple internal helper functions.

```js
formatCurrencyInput.format('2500') // $2,500.00
formatCurrencyInput.format('2500.235') // $2,500.24
formatCurrencyInput.format(200) // $200.00
formatCurrencyInput.format(200, { removeSymbol: true, removeCents: true }) // 200
```

```js
formatCurrencyInput.cents('$2,500') // 250000
formatCurrencyInput.cents('$2,500.55') // 250055
formatCurrencyInput.cents(2) // 200
formatCurrencyInput.cents(300) // 30000
```

### `data-cents` Attribute

Reformatting text in an input is good practice to ensure your users are inputting their amount correctly, but we need to ensure the data we send to our servers is properly formatted – probably in cents.

Upon reformatting, this utility also sets the currency value in cents as the value of `data-cents` on the input element.

### Options

The second argument of any method is an optional `options` object.

| Option                     | Default | Use                                 |
| -------------------------- | ------- | ----------------------------------- |
| `removeCents`              | `false` | Remove cents (\$2,500)              |
| `removeSymbol`             | `false` | Remove symbol (2,500.00)            |
| `removeCommas`             | `false` | Remove commas (\$2500.00)           |
| `removeDataCentsAttribute` | `false` | Don't set `data-cents` after format |

## License

MIT

---
_Source: https://npm.io/package/format-currency-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._