react-native-format-currency 0.0.5 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +105 -154
- package/dist/currencies.d.ts +1103 -0
- package/dist/currencies.js +1262 -0
- package/dist/format.d.ts +104 -0
- package/dist/format.js +142 -0
- package/dist/index.d.ts +3 -11
- package/dist/index.js +10 -264
- package/dist/types.d.ts +61 -0
- package/dist/types.js +2 -0
- package/package.json +26 -16
- package/.eslintrc.js +0 -49
- package/test/test.js +0 -544
- package/tsconfig-build.json +0 -6
- package/tsconfig.json +0 -72
package/README.md
CHANGED
|
@@ -1,192 +1,143 @@
|
|
|
1
|
+
<!-- NOTE: Keep this README concise and copy/paste-friendly. -->
|
|
2
|
+
|
|
1
3
|
# react-native-format-currency
|
|
2
4
|
|
|
3
|
-
[](https://www.npmjs.com/package/react-native-format-currency)
|
|
4
|
-
[](https://www.npmjs.com/package/react-native-format-currency)
|
|
5
|
-
[](https://www.npmjs.com/package/react-native-format-currency)
|
|
6
|
+
[](https://www.npmjs.com/package/react-native-format-currency)
|
|
7
|
+
[](https://x.com/AwesomeLabsLLC)
|
|
8
|
+
|
|
9
|
+
A lightweight currency formatter for **React Native** and **Expo**. Format amounts using ISO 4217 currency codes with correct symbol placement and common thousands/decimal separator styles.
|
|
6
10
|
|
|
11
|
+
- **Zero runtime deps** (pure JS/TS)
|
|
12
|
+
- **165+ currencies**
|
|
13
|
+
- **Typed** (TypeScript declarations included)
|
|
14
|
+
- **Fast** (memoized with a small LRU cache)
|
|
7
15
|
|
|
8
|
-
|
|
16
|
+
## Install
|
|
9
17
|
|
|
10
|
-
## Installation
|
|
11
18
|
```sh
|
|
12
|
-
|
|
19
|
+
yarn add react-native-format-currency
|
|
13
20
|
```
|
|
14
|
-
|
|
21
|
+
|
|
15
22
|
```sh
|
|
16
|
-
|
|
23
|
+
npm install react-native-format-currency
|
|
17
24
|
```
|
|
18
25
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
Import library with
|
|
22
|
-
```js
|
|
23
|
-
import { formatCurrency, getSupportedCurrencies } from "react-native-format-currency";
|
|
26
|
+
```sh
|
|
27
|
+
pnpm add react-native-format-currency
|
|
24
28
|
```
|
|
25
29
|
|
|
26
|
-
##
|
|
30
|
+
## Quick start
|
|
27
31
|
|
|
28
|
-
|
|
32
|
+
```ts
|
|
33
|
+
import { formatCurrency } from "react-native-format-currency";
|
|
29
34
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
35
|
+
const [withSymbol, withoutSymbol, symbol] = formatCurrency({
|
|
36
|
+
amount: 1234.56,
|
|
37
|
+
code: "USD",
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
// withSymbol: "$1,234.56"
|
|
41
|
+
// withoutSymbol: "1,234.56"
|
|
42
|
+
// symbol: "$"
|
|
36
43
|
```
|
|
37
44
|
|
|
38
|
-
|
|
45
|
+
## API
|
|
46
|
+
|
|
47
|
+
### `formatCurrency({ amount, code, returnType? })`
|
|
48
|
+
|
|
49
|
+
Formats a numeric amount for a given ISO 4217 currency code.
|
|
50
|
+
|
|
51
|
+
- **Params**
|
|
52
|
+
- `amount: number`: the numeric amount (negative supported)
|
|
53
|
+
- `code: string`: ISO 4217 currency code (e.g. `"USD"`, `"EUR"`, `"JPY"`)
|
|
54
|
+
- `returnType?: "array" | "object"`: optional return format (default: `"array"`)
|
|
55
|
+
- **Returns**
|
|
56
|
+
- Array (default): `[formattedWithSymbol, formattedWithoutSymbol, symbol]`
|
|
57
|
+
- Object: `{ formatted, value, symbol }`
|
|
39
58
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
| `amount` | `Number` | null | currency amount
|
|
43
|
-
| `code` | `String` | null | 3-letter [ISO 4217 Currency Code](https://en.wikipedia.org/wiki/ISO_4217)
|
|
59
|
+
```ts
|
|
60
|
+
import { formatCurrency } from "react-native-format-currency";
|
|
44
61
|
|
|
45
|
-
|
|
62
|
+
// Array format (default)
|
|
63
|
+
formatCurrency({ amount: 1234.56, code: "ARS" });
|
|
64
|
+
// ["$ 1.234,56", "1.234,56", "$"]
|
|
46
65
|
|
|
47
|
-
|
|
66
|
+
formatCurrency({ amount: -99.99, code: "GBP" });
|
|
67
|
+
// ["-£99.99", "-99.99", "£"]
|
|
48
68
|
|
|
49
|
-
|
|
50
|
-
|
|
69
|
+
// Object format
|
|
70
|
+
formatCurrency({ amount: 1234.56, code: "USD", returnType: "object" });
|
|
71
|
+
// { formatted: "$1,234.56", value: "1,234.56", symbol: "$" }
|
|
51
72
|
```
|
|
52
73
|
|
|
74
|
+
**Notes**
|
|
75
|
+
- Formatting is based on this package's internal currency rules (symbol, separators, symbol position, decimals). It does **not** take a locale argument.
|
|
76
|
+
- For floating-point sensitive values, consider passing integers (e.g. cents) and dividing/rounding prior to formatting.
|
|
53
77
|
|
|
54
78
|
### `getSupportedCurrencies()`
|
|
79
|
+
|
|
80
|
+
Returns all supported currencies as `{ code, name }[]`.
|
|
81
|
+
|
|
82
|
+
```ts
|
|
83
|
+
import { getSupportedCurrencies } from "react-native-format-currency";
|
|
84
|
+
|
|
85
|
+
const currencies = getSupportedCurrencies();
|
|
86
|
+
// [{ code: "AED", name: "United Arab Emirates Dirham" }, ...]
|
|
55
87
|
```
|
|
56
|
-
|
|
88
|
+
|
|
89
|
+
### Cache helpers
|
|
90
|
+
|
|
91
|
+
`formatCurrency` memoizes results (LRU, max 100 entries) for speed.
|
|
92
|
+
|
|
93
|
+
```ts
|
|
94
|
+
import { clearFormatCache, getFormatCacheSize } from "react-native-format-currency";
|
|
95
|
+
|
|
96
|
+
console.log(getFormatCacheSize());
|
|
97
|
+
clearFormatCache();
|
|
57
98
|
```
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
{ code: "BGN", name: "Bulgaria Lev" },
|
|
65
|
-
{ code: "BRL", name: "Brazil Real" },
|
|
66
|
-
{ code: "CAD", name: "Canada Dollar" },
|
|
67
|
-
{ code: "CHF", name: "Switzerland Franc" },
|
|
68
|
-
{ code: "CLP", name: "Chile Peso" },
|
|
69
|
-
{ code: "CNY", name: "China Yuan Renminbi" },
|
|
70
|
-
{ code: "COP", name: "Colombia Peso" },
|
|
71
|
-
{ code: "CZK", name: "Czech Republic Koruna" },
|
|
72
|
-
{ code: "DKK", name: "Denmark Krone" },
|
|
73
|
-
{ code: "EUR", name: "Euro Member Countries" },
|
|
74
|
-
{ code: "GBP", name: "United Kingdom Pound" },
|
|
75
|
-
{ code: "HKD", name: "Hong Kong Dollar" },
|
|
76
|
-
...
|
|
77
|
-
]
|
|
99
|
+
|
|
100
|
+
### Currency data and types
|
|
101
|
+
|
|
102
|
+
```ts
|
|
103
|
+
import type { CurrencyCode, CurrencyConfig, FormatResult, FormatResultObject, SupportedCurrency } from "react-native-format-currency";
|
|
104
|
+
import { CURRENCIES } from "react-native-format-currency";
|
|
78
105
|
```
|
|
79
106
|
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
View,
|
|
94
|
-
} from "react-native";
|
|
95
|
-
import {
|
|
96
|
-
formatCurrency,
|
|
97
|
-
getSupportedCurrencies,
|
|
98
|
-
} from "react-native-format-currency";
|
|
99
|
-
|
|
100
|
-
export default function App() {
|
|
101
|
-
const [inputValue, setInputValue] = useState("1234.56");
|
|
102
|
-
|
|
103
|
-
// get all of the supported currency codes
|
|
104
|
-
const currencyCodes = getSupportedCurrencies();
|
|
105
|
-
|
|
106
|
-
// loop through each currency code and show formatted value
|
|
107
|
-
const renderItem = ({ item }) => {
|
|
108
|
-
const [valueFormattedWithSymbol, valueFormattedWithoutSymbol, symbol] =
|
|
109
|
-
formatCurrency({ amount: Number(inputValue), code: item.code });
|
|
110
|
-
|
|
111
|
-
return (
|
|
112
|
-
<View style={styles.currencyRow}>
|
|
113
|
-
<Text style={styles.currencyRowText}>
|
|
114
|
-
{item.code} {symbol}
|
|
115
|
-
</Text>
|
|
116
|
-
<Text style={styles.currencyRowText}>{item.name}</Text>
|
|
117
|
-
<Text style={styles.currencyRowText}>{valueFormattedWithSymbol}</Text>
|
|
118
|
-
</View>
|
|
119
|
-
);
|
|
120
|
-
};
|
|
121
|
-
|
|
122
|
-
return (
|
|
123
|
-
<SafeAreaView style={styles.container}>
|
|
124
|
-
<View style={styles.inputContainer}>
|
|
125
|
-
<TextInput
|
|
126
|
-
style={styles.input}
|
|
127
|
-
textAlign="center"
|
|
128
|
-
value={inputValue}
|
|
129
|
-
onChangeText={(value) => setInputValue(value)}
|
|
130
|
-
keyboardType="decimal-pad"
|
|
131
|
-
/>
|
|
132
|
-
</View>
|
|
133
|
-
|
|
134
|
-
<FlatList
|
|
135
|
-
style={styles.scrollView}
|
|
136
|
-
data={currencyCodes}
|
|
137
|
-
renderItem={renderItem}
|
|
138
|
-
keyExtractor={(code) => code.code}
|
|
139
|
-
/>
|
|
140
|
-
<StatusBar style="auto" />
|
|
141
|
-
</SafeAreaView>
|
|
142
|
-
);
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
const styles = StyleSheet.create({
|
|
146
|
-
container: {
|
|
147
|
-
flex: 1,
|
|
148
|
-
backgroundColor: "#fff",
|
|
149
|
-
alignItems: "flex-start",
|
|
150
|
-
},
|
|
151
|
-
inputContainer: {
|
|
152
|
-
flex: 1,
|
|
153
|
-
alignSelf: "stretch",
|
|
154
|
-
marginTop: 10,
|
|
155
|
-
marginBottom: 15,
|
|
156
|
-
},
|
|
157
|
-
input: {
|
|
158
|
-
backgroundColor: "#eee",
|
|
159
|
-
height: 38,
|
|
160
|
-
fontSize: 30,
|
|
161
|
-
fontWeight: "bold",
|
|
162
|
-
},
|
|
163
|
-
scrollView: {
|
|
164
|
-
width: "100%",
|
|
165
|
-
paddingHorizontal: 5,
|
|
166
|
-
marginTop: 40,
|
|
167
|
-
marginBottom: 40,
|
|
168
|
-
},
|
|
169
|
-
currencyRow: {
|
|
170
|
-
flex: 1,
|
|
171
|
-
flexDirection: "row",
|
|
172
|
-
justifyContent: "space-between",
|
|
173
|
-
},
|
|
174
|
-
currencyRowText: {
|
|
175
|
-
alignContent: "flex-start",
|
|
176
|
-
color: "#000",
|
|
177
|
-
fontSize: 16,
|
|
178
|
-
},
|
|
179
|
-
});
|
|
107
|
+
- `CURRENCIES`: full currency config map (symbols, separators, etc.)
|
|
108
|
+
- `CurrencyCode`: union of supported ISO currency codes
|
|
109
|
+
- `FormatResult`: array return type `[string, string, string]`
|
|
110
|
+
- `FormatResultObject`: object return type `{ formatted, value, symbol }`
|
|
111
|
+
|
|
112
|
+
## Example app
|
|
113
|
+
|
|
114
|
+
The repo includes an Expo example in [`example/`](example/).
|
|
115
|
+
|
|
116
|
+
```sh
|
|
117
|
+
cd example
|
|
118
|
+
yarn install
|
|
119
|
+
yarn start
|
|
180
120
|
```
|
|
181
121
|
|
|
122
|
+
If Expo complains about your Node version, use an LTS-compatible Node version required by the Expo SDK you’re running (see Expo’s docs for the current requirement).
|
|
123
|
+
|
|
124
|
+
## Development
|
|
182
125
|
|
|
183
|
-
## Testing
|
|
184
126
|
```sh
|
|
127
|
+
yarn install
|
|
185
128
|
yarn build
|
|
186
129
|
yarn test
|
|
187
130
|
```
|
|
188
131
|
|
|
189
|
-
##
|
|
190
|
-
|
|
132
|
+
## Contributing
|
|
133
|
+
|
|
134
|
+
- Please open an issue (or a PR) for bugs/feature requests.
|
|
135
|
+
- Keep changes small and add/adjust tests where relevant.
|
|
136
|
+
|
|
137
|
+
## Security
|
|
138
|
+
|
|
139
|
+
Please **do not** open public issues for security vulnerabilities. Prefer reporting privately via the project’s maintainer contact (see `package.json` / GitHub profile).
|
|
191
140
|
|
|
141
|
+
## License
|
|
192
142
|
|
|
143
|
+
MIT — see [`LICENSE`](LICENSE).
|