fix(localize): use minus sign unicode instead of hypen-minus

Author: Joren Broekema

packages/localize/src/number/formatNumberToParts.js

@@ -28,7 +28,14 @@ export function formatNumberToParts(number, options) {
   const formattedNumber = Intl.NumberFormat(computedLocale, options).format(parsedNumber);
   const regexSymbol = /[A-Z.,\s0-9]/;
   const regexCode = /[A-Z]/;
-  const regexMinusSign = /[-]/;
+
+  /**
+   * TODO: Preprocessor should convert other "dashes" unicodes to −
+   * Then our regex should test for −
+   * See also https://www.deque.com/blog/dont-screen-readers-read-whats-screen-part-1-punctuation-typographic-symbols/
+   */
+  const regexMinusSign = /[-]/; // U+002D, Hyphen-Minus, -  is what we test on for now, since most keyboards give you this for dash
+
   const regexNum = /[0-9]/;
   const regexSeparator = /[.,]/;
   const regexSpace = /[\s]/;
@@ -38,7 +45,7 @@ export function formatNumberToParts(number, options) {
   for (let i = 0; i < formattedNumber.length; i += 1) {
     // detect minusSign
     if (regexMinusSign.test(formattedNumber[i])) {
-      formattedParts.push({ type: 'minusSign', value: formattedNumber[i] });
+      formattedParts.push({ type: 'minusSign', value: '−' /* U+2212, 'Minus-Sign', &minus; */ });
     }
     // detect numbers
     if (regexNum.test(formattedNumber[i])) {

packages/localize/test/number/formatNumber.test.js

@@ -27,32 +27,32 @@ describe('formatNumber', () => {
     expect(formatNumber(123456.789, currencySymbol('USD'))).to.equal('$123,456.79');
   });
 
-  it('uses minus (and not dash) to indicate negative numbers ', () => {
-    expect(formatNumber(-12, { style: 'decimal', maximumFractionDigits: 0 })).to.equal('-12');
+  it('uses minus U+2212 (and not dash) to indicate negative numbers ', () => {
+    expect(formatNumber(-12, { style: 'decimal', maximumFractionDigits: 0 })).to.equal('−12');
   });
 
   it('rounds (negative) numbers e.g. `roundMode: round`', () => {
     expect(formatNumber(12.4, { roundMode: 'round' })).to.equal('12');
     expect(formatNumber(12.6, { roundMode: 'round' })).to.equal('13');
 
-    expect(formatNumber(-12.4, { roundMode: 'round' })).to.equal('-12');
-    expect(formatNumber(-12.6, { roundMode: 'round' })).to.equal('-13');
+    expect(formatNumber(-12.4, { roundMode: 'round' })).to.equal('−12');
+    expect(formatNumber(-12.6, { roundMode: 'round' })).to.equal('−13');
   });
 
   it("rounds (negative) numbers up when `roundMode: 'ceiling'`", () => {
     expect(formatNumber(12.4, { roundMode: 'ceiling' })).to.equal('13');
     expect(formatNumber(12.6, { roundMode: 'ceiling' })).to.equal('13');
 
-    expect(formatNumber(-12.4, { roundMode: 'ceiling' })).to.equal('-12');
-    expect(formatNumber(-12.6, { roundMode: 'ceiling' })).to.equal('-12');
+    expect(formatNumber(-12.4, { roundMode: 'ceiling' })).to.equal('−12');
+    expect(formatNumber(-12.6, { roundMode: 'ceiling' })).to.equal('−12');
   });
 
   it('rounds (negative) numbers down when `roundMode: floor`', () => {
     expect(formatNumber(12.4, { roundMode: 'floor' })).to.equal('12');
     expect(formatNumber(12.6, { roundMode: 'floor' })).to.equal('12');
 
-    expect(formatNumber(-12.4, { roundMode: 'floor' })).to.equal('-13');
-    expect(formatNumber(-12.6, { roundMode: 'floor' })).to.equal('-13');
+    expect(formatNumber(-12.4, { roundMode: 'floor' })).to.equal('−13');
+    expect(formatNumber(-12.6, { roundMode: 'floor' })).to.equal('−13');
   });
 
   it('returns empty string when NaN', () => {

packages/localize/test/number/formatNumberToParts.test.js

@@ -10,7 +10,7 @@ const i = v => ({ type: 'integer', value: v });
 const f = v => ({ type: 'fraction', value: v });
 const g = v => ({ type: 'group', value: v });
 const l = v => ({ type: 'literal', value: v });
-const m = { type: 'minusSign', value: '-' };
+const m = { type: 'minusSign', value: '−' };
 
 const stringifyParts = parts => parts.map(part => part.value).join('');