fix(input, input-number): decimals no longer contain groupSeparators and remove leading zeros

src/utils/locale.ts

@@ -257,7 +257,7 @@ export interface NumberStringFormatOptions extends Intl.NumberFormatOptions {
 /**
  * This util formats and parses numbers for localization
  */
-class NumberStringFormat {
+export class NumberStringFormat {
   /**
    * The actual group separator for the specified locale.
    * Some white space group separators don't render correctly in the browser,
@@ -350,7 +350,7 @@ class NumberStringFormat {
     this._getDigitIndex = (d: string) => index.get(d);
   }
 
-  delocalize = (numberString: string) =>
+  delocalize = (numberString: string): string =>
     // For performance, (de)localization is skipped if the formatter isn't initialized.
     // In order to localize/delocalize, e.g. when lang/numberingSystem props are not default values,
     // `numberFormatOptions` must be set in a component to create and cache the formatter.
@@ -365,12 +365,12 @@ class NumberStringFormat {
         )
       : numberString;
 
-  localize = (numberString: string) =>
+  localize = (numberString: string): string =>
     this._numberFormatOptions
       ? sanitizeExponentialNumberString(numberString, (nonExpoNumString: string): string =>
           isValidNumber(nonExpoNumString.trim())
             ? new BigDecimal(nonExpoNumString.trim())
-                .format(this._numberFormatter)
+                .format(this)
                 .replace(new RegExp(`[${this._actualGroup}]`, "g"), this._group)
             : nonExpoNumString
         )

src/utils/number.spec.ts

@@ -111,6 +111,15 @@ describe("BigDecimal", () => {
     expect(negativeZero).toBe("-0");
   });
 
+  it("correctly formats long decimal numbers", () => {
+    numberStringFormatter.numberFormatOptions = {
+      locale: "en",
+      numberingSystem: "latn",
+      useGrouping: true
+    };
+    expect(new BigDecimal("123.123456789").format(numberStringFormatter)).toBe("123.123456789");
+  });
+
   locales.forEach((locale) => {
     it(`correctly localizes number parts - ${locale}`, () => {
       numberStringFormatter.numberFormatOptions = {
@@ -120,7 +129,7 @@ describe("BigDecimal", () => {
         useGrouping: true
       };
 
-      const parts = new BigDecimal("-12345678.9").formatToParts(numberStringFormatter.numberFormatter);
+      const parts = new BigDecimal("-12345678.9").formatToParts(numberStringFormatter);
       const groupPart = parts.find((part) => part.type === "group").value;
       expect(groupPart.trim().length === 0 ? " " : groupPart).toBe(numberStringFormatter.group);
       expect(parts.find((part) => part.type === "decimal").value).toBe(numberStringFormatter.decimal);

src/utils/number.ts

@@ -1,5 +1,8 @@
 import { numberKeys } from "./key";
-import { numberStringFormatter } from "./locale";
+import { NumberStringFormat } from "./locale";
+
+const defaultMinusSignRegex = new RegExp("-", "g");
+const unnecessaryDecimalRegex = new RegExp("\\.?0+$");
 
 // adopted from https://stackoverflow.com/a/66939244
 export class BigDecimal {
@@ -27,77 +30,62 @@ export class BigDecimal {
     this.isNegative = input.charAt(0) === "-";
   }
 
-  static _divRound(dividend: bigint, divisor: bigint): bigint {
-    return BigDecimal.fromBigInt(
+  static _divRound = (dividend: bigint, divisor: bigint): bigint =>
+    BigDecimal.fromBigInt(
       dividend / divisor + (BigDecimal.ROUNDED ? ((dividend * BigInt(2)) / divisor) % BigInt(2) : BigInt(0))
     );
-  }
 
-  static fromBigInt(bigint: bigint): bigint {
-    return Object.assign(Object.create(BigDecimal.prototype), { value: bigint });
-  }
+  static fromBigInt = (bigint: bigint): bigint => Object.assign(Object.create(BigDecimal.prototype), { value: bigint });
 
-  toString(): string {
+  getIntegersAndDecimals(): { integers: string; decimals: string } {
     const s = this.value
       .toString()
-      .replace(new RegExp("-", "g"), "")
+      .replace(defaultMinusSignRegex, "")
       .padStart(BigDecimal.DECIMALS + 1, "0");
-
-    const i = s.slice(0, -BigDecimal.DECIMALS);
-    const d = s.slice(-BigDecimal.DECIMALS).replace(/\.?0+$/, "");
-    const value = i.concat(d.length ? "." + d : "");
-    return `${this.isNegative ? "-" : ""}${value}`;
+    const integers = s.slice(0, -BigDecimal.DECIMALS);
+    const decimals = s.slice(-BigDecimal.DECIMALS).replace(unnecessaryDecimalRegex, "");
+    return { integers, decimals };
   }
 
-  formatToParts(formatter: Intl.NumberFormat): Intl.NumberFormatPart[] {
-    const s = this.value
-      .toString()
-      .replace(new RegExp("-", "g"), "")
-      .padStart(BigDecimal.DECIMALS + 1, "0");
-
-    const i = s.slice(0, -BigDecimal.DECIMALS);
-    const d = s.slice(-BigDecimal.DECIMALS).replace(/\.?0+$/, "");
+  toString(): string {
+    const { integers, decimals } = this.getIntegersAndDecimals();
+    return `${this.isNegative ? "-" : ""}${integers}${decimals.length ? "." + decimals : ""}`;
+  }
 
-    const parts = formatter.formatToParts(BigInt(i));
-    this.isNegative && parts.unshift({ type: "minusSign", value: numberStringFormatter.minusSign });
+  formatToParts(formatter: NumberStringFormat): Intl.NumberFormatPart[] {
+    const { integers, decimals } = this.getIntegersAndDecimals();
+    const parts = formatter.numberFormatter.formatToParts(BigInt(integers));
+    this.isNegative && parts.unshift({ type: "minusSign", value: formatter.minusSign });
 
-    if (d.length) {
-      parts.push({ type: "decimal", value: numberStringFormatter.decimal });
-      d.split("").forEach((char: string) => parts.push({ type: "fraction", value: char }));
+    if (decimals.length) {
+      parts.push({ type: "decimal", value: formatter.decimal });
+      decimals.split("").forEach((char: string) => parts.push({ type: "fraction", value: char }));
     }
 
     return parts;
   }
 
-  format(formatter: Intl.NumberFormat): string {
-    const s = this.value
-      .toString()
-      .replace(new RegExp("-", "g"), "")
-      .padStart(BigDecimal.DECIMALS + 1, "0");
-
-    const i = s.slice(0, -BigDecimal.DECIMALS);
-    const d = s.slice(-BigDecimal.DECIMALS).replace(/\.?0+$/, "");
-
-    const iFormatted = `${this.isNegative ? numberStringFormatter.minusSign : ""}${formatter.format(BigInt(i))}`;
-    const dFormatted = d.length ? `${numberStringFormatter.decimal}${formatter.format(BigInt(d))}` : "";
-    return `${iFormatted}${dFormatted}`;
+  format(formatter: NumberStringFormat): string {
+    const { integers, decimals } = this.getIntegersAndDecimals();
+    const integersFormatted = `${this.isNegative ? formatter.minusSign : ""}${formatter.numberFormatter.format(
+      BigInt(integers)
+    )}`;
+    const decimalsFormatted = decimals.length
+      ? `${formatter.decimal}${decimals
+          .split("")
+          .map((char: string) => formatter.numberFormatter.format(Number(char)))
+          .join("")}`
+      : "";
+    return `${integersFormatted}${decimalsFormatted}`;
   }
 
-  add(num: string): bigint {
-    return BigDecimal.fromBigInt(this.value + new BigDecimal(num).value);
-  }
+  add = (num: string): bigint => BigDecimal.fromBigInt(this.value + new BigDecimal(num).value);
 
-  subtract(num: string): bigint {
-    return BigDecimal.fromBigInt(this.value - new BigDecimal(num).value);
-  }
+  subtract = (num: string): bigint => BigDecimal.fromBigInt(this.value - new BigDecimal(num).value);
 
-  multiply(num: string): bigint {
-    return BigDecimal._divRound(this.value * new BigDecimal(num).value, BigDecimal.SHIFT);
-  }
+  multiply = (num: string): bigint => BigDecimal._divRound(this.value * new BigDecimal(num).value, BigDecimal.SHIFT);
 
-  divide(num: string): bigint {
-    return BigDecimal._divRound(this.value * BigDecimal.SHIFT, new BigDecimal(num).value);
-  }
+  divide = (num: string): bigint => BigDecimal._divRound(this.value * BigDecimal.SHIFT, new BigDecimal(num).value);
 }
 
 export function isValidNumber(numberString: string): boolean {