@react-aria/i18n 3.3.2 → 3.3.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-aria/i18n",
-  "version": "3.3.2",
+  "version": "3.3.6",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -18,11 +18,12 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.6.2",
-    "@internationalized/message": "^3.0.2",
-    "@internationalized/number": "^3.0.2",
-    "@react-aria/ssr": "^3.0.3",
-    "@react-aria/utils": "^3.8.2",
-    "@react-types/shared": "^3.8.0"
+    "@internationalized/date": "3.0.0-alpha.3",
+    "@internationalized/message": "^3.0.5",
+    "@internationalized/number": "^3.0.5",
+    "@react-aria/ssr": "^3.1.2",
+    "@react-aria/utils": "^3.11.2",
+    "@react-types/shared": "^3.11.1"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0-rc.1"
@@ -30,5 +31,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9204e1b8cb61dac767e91087fb16203611dc67c5"
+  "gitHead": "404d41859b7d6f56201d7fc01bd9f22ae3512937"
 }

package/src/useDateFormatter.ts

@@ -10,33 +10,48 @@
  * governing permissions and limitations under the License.
  */
 
+import {DateFormatter} from '@internationalized/date';
 import {useLocale} from './context';
+import {useMemo, useRef} from 'react';
 
 interface DateFormatterOptions extends Intl.DateTimeFormatOptions {
   calendar?: string
 }
 
-let formatterCache = new Map<string, Intl.DateTimeFormat>();
-
 /**
  * Provides localized date formatting for the current locale. Automatically updates when the locale changes,
  * and handles caching of the date formatter for performance.
  * @param options - Formatting options.
  */
-export function useDateFormatter(options?: DateFormatterOptions): Intl.DateTimeFormat {
+export function useDateFormatter(options?: DateFormatterOptions): DateFormatter {
+  // Reuse last options object if it is shallowly equal, which allows the useMemo result to also be reused.
+  let lastOptions = useRef(null);
+  if (options && lastOptions.current && isEqual(options, lastOptions.current)) {
+    options = lastOptions.current;
+  }
+
+  lastOptions.current = options;
+
   let {locale} = useLocale();
+  return useMemo(() => new DateFormatter(locale, options), [locale, options]);
+}
+
+function isEqual(a: DateFormatterOptions, b: DateFormatterOptions) {
+  if (a === b) {
+    return true;
+  }
 
-  // Polyfill the `calendar` option - not supported in Safari.
-  if (options?.calendar && !locale.includes('-u-ca-')) {
-    locale += '-u-ca-' + options.calendar;
+  let aKeys = Object.keys(a);
+  let bKeys = Object.keys(b);
+  if (aKeys.length !== bKeys.length) {
+    return false;
   }
 
-  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);
+  for (let key of aKeys) {
+    if (b[key] !== a[key]) {
+      return false;
+    }
   }
 
-  let formatter = new Intl.DateTimeFormat(locale, options);
-  formatterCache.set(cacheKey, formatter);
-  return formatter;
+  return true;
 }