@shopify/react-i18n - npm Package Compare versions

Comparing version 7.4.0 to 7.5.0

build/cjs/constants/index.js

@@ -89,5 +89,7 @@ 'use strict';
 };
+const DIRECTION_CONTROL_CHARACTERS = '\\p{Cf}';
 
 exports.CurrencyShortFormException = CurrencyShortFormException;
 exports.DEFAULT_WEEK_START_DAY = DEFAULT_WEEK_START_DAY;
+exports.DIRECTION_CONTROL_CHARACTERS = DIRECTION_CONTROL_CHARACTERS;
 exports.EASTERN_NAME_ORDER_FORMATTERS = EASTERN_NAME_ORDER_FORMATTERS;
@@ -94,0 +96,0 @@ exports.RTL_LANGUAGES = RTL_LANGUAGES;

build/cjs/i18n.js

@@ -24,2 +24,3 @@ 'use strict';
 const REGEX_PERIODS = /\./g;
+const NEGATIVE_CHARACTERS = '\\p{Pd}\u2212';
 let I18n = (_dec = decorators.memoize(), (_class = class I18n {
@@ -364,6 +365,10 @@ get language() {
   formatCurrencyShort(amount, options = {}) {
+    var _negativeRegex$exec;
+
     const formattedAmount = this.formatCurrencyNone(amount, options);
+    const negativeRegex = new RegExp(`[${index.DIRECTION_CONTROL_CHARACTERS}]*[${NEGATIVE_CHARACTERS}]`, 'gu');
+    const negativeMatch = ((_negativeRegex$exec = negativeRegex.exec(formattedAmount)) === null || _negativeRegex$exec === void 0 ? void 0 : _negativeRegex$exec.shift()) || '';
     const shortSymbol = this.getShortCurrencySymbol(options.currency);
     const formattedWithSymbol = shortSymbol.prefixed ? `${shortSymbol.symbol}${formattedAmount}` : `${formattedAmount}${shortSymbol.symbol}`;
-    return amount < 0 ? `-${formattedWithSymbol.replace(/[-−]/, '')}` : formattedWithSymbol;
+    return `${negativeMatch}${formattedWithSymbol.replace(negativeMatch, '')}`;
   }
@@ -644,4 +649,4 @@
     const decimalValue = this.decimalValue(input, lastIndexOfDecimal);
-    const isNegative = input.trim().startsWith(NEGATIVE_SIGN);
-    const negativeSign = isNegative ? NEGATIVE_SIGN : '';
+    const negativeRegex = new RegExp(`^[${index.DIRECTION_CONTROL_CHARACTERS}\\s]*[${NEGATIVE_CHARACTERS}]`, 'u');
+    const negativeSign = input.match(negativeRegex) ? NEGATIVE_SIGN : '';
     const normalizedDecimal = lastIndexOfDecimal === -1 ? '' : PERIOD;
@@ -648,0 +653,0 @@ const normalizedValue = `${negativeSign}${integerValue}${normalizedDecimal}${decimalValue}`;

build/cjs/utilities/money.js

@@ -5,11 +5,10 @@ 'use strict';
 
+var index = require('../constants/index.js');
 var translate = require('./translate.js');
 
 function getCurrencySymbol(locale, options) {
-  const delimiters = ',.';
-  const directionControlCharacters = /[\u200E\u200F]/;
-  const numReg = new RegExp(`0[${delimiters}]*0*`);
   const currencyStringRaw = formatCurrency(0, locale, options);
-  const currencyString = currencyStringRaw.replace(directionControlCharacters, '');
-  const matchResult = numReg.exec(currencyString);
+  const controlChars = new RegExp(`[${index.DIRECTION_CONTROL_CHARACTERS}]*`, 'gu');
+  const currencyString = currencyStringRaw.replace(controlChars, '');
+  const matchResult = /\p{Nd}\p{Po}*\p{Nd}*/gu.exec(currencyString);
 
@@ -16,0 +15,0 @@ if (!matchResult) {

build/cjs/utilities/translate.js

@@ -24,3 +24,5 @@ 'use strict';
 function memoizedNumberFormatter(locales, options) {
-  const key = numberFormatCacheKey(locales, options);
+  // force a latin locale for number formatting
+  const latnLocales = latinLocales(locales);
+  const key = numberFormatCacheKey(latnLocales, options);
 
@@ -31,6 +33,18 @@ if (numberFormats.has(key)) {
 
-  const i = new Intl.NumberFormat(locales, options);
+  const i = new Intl.NumberFormat(latnLocales, options);
   numberFormats.set(key, i);
   return i;
 }
+
+function latinLocales(locales) {
+  return Array.isArray(locales) ? locales.map(locale => latinLocale(locale)) : latinLocale(locales);
+}
+
+function latinLocale(locale) {
+  if (!locale) return locale;
+  return new Intl.Locale(locale, {
+    numberingSystem: 'latn'
+  }).toString();
+}
+
 const PSEUDOTRANSLATE_OPTIONS = {
@@ -37,0 +51,0 @@ startDelimiter: '{',

build/ts/constants/index.d.ts

@@ -55,2 +55,3 @@ export declare enum DateStyle {
 };
+export declare const DIRECTION_CONTROL_CHARACTERS = "\\p{Cf}";
 //# sourceMappingURL=index.d.ts.map

package.json

 {
   "name": "@shopify/react-i18n",
-  "version": "7.4.0",
+  "version": "7.5.0",
   "license": "MIT",
@@ -5,0 +5,0 @@ "description": "i18n utilities for React handling translations, formatting, and more",

README.md

@@ -12,3 +12,3 @@ # `@shopify/react-i18n`
 ```bash
-$ yarn add @shopify/react-i18n
+yarn add @shopify/react-i18n
 ```
@@ -130,5 +130,5 @@
 
-- `formatNumber()`: formats a number according to the locale. You can optionally pass an `as` option to format the number as a currency or percentage; in the case of currency, the `defaultCurrency` supplied to the i18n `I18nContext.Provider` component will be used where no custom currency code is passed.
+- `formatNumber()`: formats a number in the latin numbering system according to the locale. You can optionally pass an `as` option to format the number as a currency or percentage; in the case of currency, the `defaultCurrency` supplied to the i18n `I18nContext.Provider` component will be used where no custom currency code is passed.
 - `unformatNumber()`: converts a localized number string to a number string parseable by JavaScript. Example: `123.456,45 => 123456.45`
-- `formatCurrency()`: formats a number as a currency according to the locale. Its behaviour depends on the `form:` option.
+- `formatCurrency()`: formats a number as a currency in the latin numbering system according to the locale. Its behaviour depends on the `form:` option.
   - if `form: 'short'` is given, then a possibly-ambiguous short form is used, consisting of the bare symbol if the currency has a symbol, or the ISO 4217 code if there is no symbol for that currency. Examples: `CHF 1.25`, `€1.25`, `OMR 1.250`, `$1.25`
@@ -135,0 +135,0 @@ - if `form: 'none'` is given, the number will be formatted with currency rules but will not include a currency symbol or ISO code in the string. Examples: `1,234.56`, `1 234,56`

No alert changes

Improved metrics

Total package byte prevSize

279263

increased by1.05%

Lines of code

4214

increased by0.77%

No dependency changes