Move number parser to stately, and refactor controlled selection behavior (adobe#1487)

* Move number parser to stately, and refactor controlled selection behavior
* Fix parsing currency symbols with valid number characters and add number parser tests
* Prevent invalid deletions, e.g. inside currency symbol

Author: devongovett

packages/@react-aria/i18n/package.json

@@ -20,6 +20,7 @@
     "@babel/runtime": "^7.6.2",
     "@react-aria/ssr": "^3.0.1",
     "@react-aria/utils": "^3.4.0",
+    "@react-stately/i18n": "3.0.0-alpha.1",
     "@react-types/shared": "^3.3.0",
     "intl-messageformat": "^2.2.0"
   },

packages/@react-aria/i18n/src/index.ts

@@ -15,7 +15,6 @@
 export * from './context';
 export * from './useMessageFormatter';
 export * from './useDateFormatter';
-export * from './useNumberParser';
 export * from './useNumberFormatter';
 export * from './useCollator';
 export * from './useFilter';

packages/@react-aria/i18n/src/useNumberFormatter.ts

@@ -10,54 +10,15 @@
  * governing permissions and limitations under the License.
  */
 
-import {numberFormatSignDisplayPolyfill} from './utils';
+import {getNumberFormatter, NumberFormatOptions} from '@react-stately/i18n';
 import {useLocale} from './context';
 
-let formatterCache = new Map<string, Intl.NumberFormat>();
-
-let supportsSignDisplay = false;
-try {
-  // @ts-ignore
-  supportsSignDisplay = (new Intl.NumberFormat('de-DE', {signDisplay: 'exceptZero'})).resolvedOptions().signDisplay === 'exceptZero';
-  // eslint-disable-next-line no-empty
-} catch (e) {}
-
-export type NumeralSystem = 'arab' | 'hanidec' | 'latn';
-
-export interface NumberFormatOptions extends Intl.NumberFormatOptions {
-  /** Overrides the CLDR or browser default numeral system for the current locale. */
-  numeralSystem?: NumeralSystem
-}
-
 /**
  * Provides localized number formatting for the current locale. Automatically updates when the locale changes,
  * and handles caching of the number formatter for performance.
  * @param options - Formatting options.
  */
 export function useNumberFormatter(options: NumberFormatOptions = {}): Intl.NumberFormat {
-  let {numeralSystem} = options;
   let {locale} = useLocale();
-
-  if (numeralSystem && locale.indexOf('-u-nu-') === -1) {
-    locale = `${locale}-u-nu-${numeralSystem}`;
-  }
-
-  let cacheKey = locale + (options ? Object.entries(options).sort((a, b) => a[0] < b[0] ? -1 : 1).join() : '');
-  if (formatterCache.has(cacheKey)) {
-    return formatterCache.get(cacheKey);
-  }
-
-  let numberFormatter = new Intl.NumberFormat(locale, options);
-  // @ts-ignore
-  let {signDisplay} = options || {};
-  formatterCache.set(cacheKey, (!supportsSignDisplay && signDisplay != null) ? new Proxy(numberFormatter, {
-    get(target, property) {
-      if (property === 'format') {
-        return (v) => numberFormatSignDisplayPolyfill(numberFormatter, signDisplay, v);
-      } else {
-        return target[property];
-      }
-    }
-  }) : numberFormatter);
-  return numberFormatter;
+  return getNumberFormatter(locale, options);
 }

packages/@react-aria/i18n/src/useNumberParser.ts

@@ -31,36 +31,3 @@ export function isRTL(locale: string) {
   let lang = locale.split('-')[0];
   return RTL_LANGS.has(lang);
 }
-
-export function numberFormatSignDisplayPolyfill(numberFormat: Intl.NumberFormat, signDisplay: 'always' | 'exceptZero' | 'auto' | 'never', num: number) {
-  if (signDisplay === 'auto') {
-    return numberFormat.format(num);
-  } else if (signDisplay === 'never') {
-    return numberFormat.format(Math.abs(num));
-  } else {
-    let needsPositiveSign = false;
-    if (signDisplay === 'always') {
-      needsPositiveSign = num > 0 || Object.is(num, 0);
-    } else if (signDisplay === 'exceptZero') {
-      if (Object.is(num, -0) || Object.is(num, 0)) {
-        num = Math.abs(num);
-      } else {
-        needsPositiveSign = num > 0;
-      }
-    }
-
-    if (needsPositiveSign) {
-      let negative = numberFormat.format(-num);
-      let noSign = numberFormat.format(num);
-      // ignore RTL/LTR marker character
-      let minus = negative.replace(noSign, '').replace(/\u200e|\u061C/, '');
-      if ([...minus].length !== 1) {
-        console.warn('@react-aria/i18n polyfill for NumberFormat signDisplay: Unsupported case');
-      }
-      let positive = negative.replace(noSign, '!!!').replace(minus, '+').replace('!!!', noSign);
-      return positive;
-    } else {
-      return numberFormat.format(num);
-    }
-  }
-}

packages/@react-aria/i18n/src/utils.ts

@@ -25,6 +25,7 @@
     "@react-aria/spinbutton": "^3.0.0-alpha.1",
     "@react-aria/textfield": "^3.1.0",
     "@react-aria/utils": "^3.1.0",
+    "@react-stately/i18n": "3.0.0-alpha.1",
     "@react-stately/numberfield": "3.0.0-alpha.1",
     "@react-types/button": "^3.1.0",
     "@react-types/numberfield": "^3.0.0-alpha.1",