react-intl 4.4.0 → 4.5.0

package/src/components/provider.tsx

@@ -4,54 +4,54 @@
  * See the accompanying LICENSE file for terms.
  */
 
-import * as React from 'react';
-import {Provider} from './injectIntl';
+import * as React from 'react'
+import {Provider} from './injectIntl'
 import {
   DEFAULT_INTL_CONFIG,
   createFormatters,
   invariantIntlContext,
   createIntlCache,
-} from '../utils';
-import {IntlConfig, IntlShape, Omit, IntlCache} from '../types';
-import {formatNumber, formatNumberToParts} from '../formatters/number';
-import {formatRelativeTime} from '../formatters/relativeTime';
+} from '../utils'
+import {IntlConfig, IntlShape, Omit, IntlCache} from '../types'
+import {formatNumber, formatNumberToParts} from '../formatters/number'
+import {formatRelativeTime} from '../formatters/relativeTime'
 import {
   formatDate,
   formatTime,
   formatDateToParts,
   formatTimeToParts,
-} from '../formatters/dateTime';
-import {formatPlural} from '../formatters/plural';
-import {formatMessage} from '../formatters/message';
-import * as shallowEquals_ from 'shallow-equal/objects';
-import {formatList} from '../formatters/list';
-import {formatDisplayName} from '../formatters/displayName';
-import {ReactIntlError, ReactIntlErrorCode} from '../error';
+} from '../formatters/dateTime'
+import {formatPlural} from '../formatters/plural'
+import {formatMessage} from '../formatters/message'
+import * as shallowEquals_ from 'shallow-equal/objects'
+import {formatList} from '../formatters/list'
+import {formatDisplayName} from '../formatters/displayName'
+import {ReactIntlError, ReactIntlErrorCode} from '../error'
 const shallowEquals: typeof shallowEquals_ =
-  (shallowEquals_ as any).default || shallowEquals_;
+  (shallowEquals_ as any).default || shallowEquals_
 
 interface State {
   /**
    * Explicit intl cache to prevent memory leaks
    */
-  cache: IntlCache;
+  cache: IntlCache
   /**
    * Intl object we created
    */
-  intl?: IntlShape;
+  intl?: IntlShape
   /**
    * list of memoized config we care about.
    * This is important since creating intl is
    * very expensive
    */
-  prevConfig: OptionalIntlConfig;
+  prevConfig: OptionalIntlConfig
 }
 
 export type OptionalIntlConfig = Omit<
   IntlConfig,
   keyof typeof DEFAULT_INTL_CONFIG
 > &
-  Partial<typeof DEFAULT_INTL_CONFIG>;
+  Partial<typeof DEFAULT_INTL_CONFIG>
 
 function processIntlConfig<P extends OptionalIntlConfig = OptionalIntlConfig>(
   config: P
@@ -65,7 +65,7 @@ function processIntlConfig<P extends OptionalIntlConfig = OptionalIntlConfig>(
     defaultLocale: config.defaultLocale,
     defaultFormats: config.defaultFormats,
     onError: config.onError,
-  };
+  }
 }
 
 /**
@@ -77,9 +77,9 @@ export function createIntl(
   config: OptionalIntlConfig,
   cache?: IntlCache
 ): IntlShape {
-  const formatters = createFormatters(cache);
-  const resolvedConfig = {...DEFAULT_INTL_CONFIG, ...config};
-  const {locale, defaultLocale, onError} = resolvedConfig;
+  const formatters = createFormatters(cache)
+  const resolvedConfig = {...DEFAULT_INTL_CONFIG, ...config}
+  const {locale, defaultLocale, onError} = resolvedConfig
   if (!locale) {
     if (onError) {
       onError(
@@ -87,21 +87,21 @@ export function createIntl(
           ReactIntlErrorCode.INVALID_CONFIG,
           `"locale" was not configured, using "${defaultLocale}" as fallback. See https://github.com/formatjs/react-intl/blob/master/docs/API.md#intlshape for more details`
         )
-      );
+      )
     }
     // Since there's no registered locale data for `locale`, this will
     // fallback to the `defaultLocale` to make sure things can render.
     // The `messages` are overridden to the `defaultProps` empty object
     // to maintain referential equality across re-renders. It's assumed
     // each <FormattedMessage> contains a `defaultMessage` prop.
-    resolvedConfig.locale = resolvedConfig.defaultLocale || 'en';
+    resolvedConfig.locale = resolvedConfig.defaultLocale || 'en'
   } else if (!Intl.NumberFormat.supportedLocalesOf(locale).length && onError) {
     onError(
       new ReactIntlError(
         ReactIntlErrorCode.MISSING_DATA,
         `Missing locale data for locale: "${locale}" in Intl.NumberFormat. Using default locale: "${defaultLocale}" as fallback. See https://github.com/formatjs/react-intl/blob/master/docs/Getting-Started.md#runtime-requirements for more details`
       )
-    );
+    )
   } else if (
     !Intl.DateTimeFormat.supportedLocalesOf(locale).length &&
     onError
@@ -111,7 +111,7 @@ export function createIntl(
         ReactIntlErrorCode.MISSING_DATA,
         `Missing locale data for locale: "${locale}" in Intl.DateTimeFormat. Using default locale: "${defaultLocale}" as fallback. See https://github.com/formatjs/react-intl/blob/master/docs/Getting-Started.md#runtime-requirements for more details`
       )
-    );
+    )
   }
   return {
     ...resolvedConfig,
@@ -163,38 +163,38 @@ export function createIntl(
       resolvedConfig,
       formatters.getDisplayNames
     ),
-  };
+  }
 }
 
 export default class IntlProvider extends React.PureComponent<
   OptionalIntlConfig,
   State
 > {
-  static displayName = 'IntlProvider';
-  static defaultProps = DEFAULT_INTL_CONFIG;
-  private cache: IntlCache = createIntlCache();
+  static displayName = 'IntlProvider'
+  static defaultProps = DEFAULT_INTL_CONFIG
+  private cache: IntlCache = createIntlCache()
   state: State = {
     cache: this.cache,
     intl: createIntl(processIntlConfig(this.props), this.cache),
     prevConfig: processIntlConfig(this.props),
-  };
+  }
 
   static getDerivedStateFromProps(
     props: OptionalIntlConfig,
     {prevConfig, cache}: State
   ): Partial<State> | null {
-    const config = processIntlConfig(props);
+    const config = processIntlConfig(props)
     if (!shallowEquals(prevConfig, config)) {
       return {
         intl: createIntl(config, cache),
         prevConfig: config,
-      };
+      }
     }
-    return null;
+    return null
   }
 
   render(): JSX.Element {
-    invariantIntlContext(this.state.intl);
-    return <Provider value={this.state.intl}>{this.props.children}</Provider>;
+    invariantIntlContext(this.state.intl)
+    return <Provider value={this.state.intl}>{this.props.children}</Provider>
   }
 }

package/src/components/relative.tsx

@@ -3,132 +3,132 @@
  * Copyrights licensed under the New BSD License.
  * See the accompanying LICENSE file for terms.
  */
-import * as React from 'react';
-import {Context} from './injectIntl';
-import {FormatRelativeTimeOptions} from '../types';
-import {Unit} from '@formatjs/intl-relativetimeformat';
-import {invariantIntlContext} from '../utils';
-import {invariant} from '@formatjs/intl-utils';
-const MINUTE = 60;
-const HOUR = 60 * 60;
-const DAY = 60 * 60 * 24;
+import * as React from 'react'
+import {Context} from './injectIntl'
+import {FormatRelativeTimeOptions} from '../types'
+import {Unit} from '@formatjs/intl-relativetimeformat'
+import {invariantIntlContext} from '../utils'
+import {invariant} from '@formatjs/intl-utils'
+const MINUTE = 60
+const HOUR = 60 * 60
+const DAY = 60 * 60 * 24
 
 function selectUnit(seconds: number): Unit {
-  const absValue = Math.abs(seconds);
+  const absValue = Math.abs(seconds)
 
   if (absValue < MINUTE) {
-    return 'second';
+    return 'second'
   }
 
   if (absValue < HOUR) {
-    return 'minute';
+    return 'minute'
   }
 
   if (absValue < DAY) {
-    return 'hour';
+    return 'hour'
   }
 
-  return 'day';
+  return 'day'
 }
 
 function getDurationInSeconds(unit?: Unit): number {
   switch (unit) {
     case 'second':
-      return 1;
+      return 1
     case 'minute':
-      return MINUTE;
+      return MINUTE
     case 'hour':
-      return HOUR;
+      return HOUR
     default:
-      return DAY;
+      return DAY
   }
 }
 
 function valueToSeconds(value?: number, unit?: Unit): number {
   if (!value) {
-    return 0;
+    return 0
   }
   switch (unit) {
     case 'second':
-      return value;
+      return value
     case 'minute':
-      return value * MINUTE;
+      return value * MINUTE
     default:
-      return value * HOUR;
+      return value * HOUR
   }
 }
 
 export interface Props extends FormatRelativeTimeOptions {
-  value?: number;
-  unit?: Unit;
-  updateIntervalInSeconds?: number;
-  children?(value: string): React.ReactChild;
+  value?: number
+  unit?: Unit
+  updateIntervalInSeconds?: number
+  children?(value: string): React.ReactChild
 }
 
 interface State {
-  prevUnit?: Unit;
-  prevValue?: number;
-  currentValueInSeconds: number;
+  prevUnit?: Unit
+  prevValue?: number
+  currentValueInSeconds: number
 }
 
-const INCREMENTABLE_UNITS: Unit[] = ['second', 'minute', 'hour'];
+const INCREMENTABLE_UNITS: Unit[] = ['second', 'minute', 'hour']
 function canIncrement(unit: Unit = 'second'): boolean {
-  return INCREMENTABLE_UNITS.includes(unit);
+  return INCREMENTABLE_UNITS.includes(unit)
 }
 
 export class FormattedRelativeTime extends React.PureComponent<Props, State> {
   // Public for testing
-  _updateTimer: any = null;
-  static displayName = 'FormattedRelativeTime';
+  _updateTimer: any = null
+  static displayName = 'FormattedRelativeTime'
   static defaultProps: Pick<Props, 'unit' | 'value'> = {
     value: 0,
     unit: 'second',
-  };
+  }
   state: State = {
     prevUnit: this.props.unit,
     prevValue: this.props.value,
     currentValueInSeconds: canIncrement(this.props.unit)
       ? valueToSeconds(this.props.value, this.props.unit)
       : 0,
-  };
+  }
 
   constructor(props: Props) {
-    super(props);
+    super(props)
     invariant(
       !props.updateIntervalInSeconds ||
         !!(props.updateIntervalInSeconds && canIncrement(props.unit)),
       'Cannot schedule update with unit longer than hour'
-    );
+    )
   }
 
   scheduleNextUpdate(
     {updateIntervalInSeconds, unit}: Props,
     {currentValueInSeconds}: State
   ): void {
-    clearTimeout(this._updateTimer);
-    this._updateTimer = null;
+    clearTimeout(this._updateTimer)
+    this._updateTimer = null
     // If there's no interval and we cannot increment this unit, do nothing
     if (!updateIntervalInSeconds || !canIncrement(unit)) {
-      return;
+      return
     }
     // Figure out the next interesting time
-    const nextValueInSeconds = currentValueInSeconds - updateIntervalInSeconds;
-    const nextUnit = selectUnit(nextValueInSeconds);
+    const nextValueInSeconds = currentValueInSeconds - updateIntervalInSeconds
+    const nextUnit = selectUnit(nextValueInSeconds)
     // We've reached the max auto incrementable unit, don't schedule another update
     if (nextUnit === 'day') {
-      return;
+      return
     }
 
-    const unitDuration = getDurationInSeconds(nextUnit);
-    const remainder = nextValueInSeconds % unitDuration;
-    const prevInterestingValueInSeconds = nextValueInSeconds - remainder;
+    const unitDuration = getDurationInSeconds(nextUnit)
+    const remainder = nextValueInSeconds % unitDuration
+    const prevInterestingValueInSeconds = nextValueInSeconds - remainder
     const nextInterestingValueInSeconds =
       prevInterestingValueInSeconds >= currentValueInSeconds
         ? prevInterestingValueInSeconds - unitDuration
-        : prevInterestingValueInSeconds;
+        : prevInterestingValueInSeconds
     const delayInSeconds = Math.abs(
       nextInterestingValueInSeconds - currentValueInSeconds
-    );
+    )
 
     this._updateTimer = setTimeout(
       () =>
@@ -136,20 +136,20 @@ export class FormattedRelativeTime extends React.PureComponent<Props, State> {
           currentValueInSeconds: nextInterestingValueInSeconds,
         }),
       delayInSeconds * 1e3
-    );
+    )
   }
 
   componentDidMount(): void {
-    this.scheduleNextUpdate(this.props, this.state);
+    this.scheduleNextUpdate(this.props, this.state)
   }
 
   componentDidUpdate(): void {
-    this.scheduleNextUpdate(this.props, this.state);
+    this.scheduleNextUpdate(this.props, this.state)
   }
 
   componentWillUnmount(): void {
-    clearTimeout(this._updateTimer);
-    this._updateTimer = null;
+    clearTimeout(this._updateTimer)
+    this._updateTimer = null
   }
 
   static getDerivedStateFromProps(
@@ -163,31 +163,31 @@ export class FormattedRelativeTime extends React.PureComponent<Props, State> {
         currentValueInSeconds: canIncrement(props.unit)
           ? valueToSeconds(props.value, props.unit)
           : 0,
-      };
+      }
     }
-    return null;
+    return null
   }
 
   render(): JSX.Element {
     return (
       <Context.Consumer>
         {(intl): React.ReactNode => {
-          invariantIntlContext(intl);
+          invariantIntlContext(intl)
 
-          const {formatRelativeTime, textComponent: Text} = intl;
-          const {children, value, unit, updateIntervalInSeconds} = this.props;
-          const {currentValueInSeconds} = this.state;
-          let currentValue = value || 0;
-          let currentUnit = unit;
+          const {formatRelativeTime, textComponent: Text} = intl
+          const {children, value, unit, updateIntervalInSeconds} = this.props
+          const {currentValueInSeconds} = this.state
+          let currentValue = value || 0
+          let currentUnit = unit
 
           if (
             canIncrement(unit) &&
             typeof currentValueInSeconds === 'number' &&
             updateIntervalInSeconds
           ) {
-            currentUnit = selectUnit(currentValueInSeconds);
-            const unitDuration = getDurationInSeconds(currentUnit);
-            currentValue = Math.round(currentValueInSeconds / unitDuration);
+            currentUnit = selectUnit(currentValueInSeconds)
+            const unitDuration = getDurationInSeconds(currentUnit)
+            currentValue = Math.round(currentValueInSeconds / unitDuration)
           }
 
           const formattedRelativeTime = formatRelativeTime(
@@ -196,19 +196,19 @@ export class FormattedRelativeTime extends React.PureComponent<Props, State> {
             {
               ...this.props,
             }
-          );
+          )
 
           if (typeof children === 'function') {
-            return children(formattedRelativeTime);
+            return children(formattedRelativeTime)
           }
           if (Text) {
-            return <Text>{formattedRelativeTime}</Text>;
+            return <Text>{formattedRelativeTime}</Text>
           }
-          return formattedRelativeTime;
+          return formattedRelativeTime
         }}
       </Context.Consumer>
-    );
+    )
   }
 }
 
-export default FormattedRelativeTime;
+export default FormattedRelativeTime

package/src/components/useIntl.ts

@@ -1,10 +1,10 @@
-import {useContext} from 'react';
-import {Context} from './injectIntl';
-import {invariantIntlContext} from '../utils';
-import {IntlShape} from '../types';
+import {useContext} from 'react'
+import {Context} from './injectIntl'
+import {invariantIntlContext} from '../utils'
+import {IntlShape} from '../types'
 
 export default function useIntl(): IntlShape {
-  const intl = useContext(Context);
-  invariantIntlContext(intl);
-  return intl;
+  const intl = useContext(Context)
+  invariantIntlContext(intl)
+  return intl
 }

package/src/error.ts

@@ -1,22 +1,31 @@
-import { MessageDescriptor } from "./types"
+import {MessageDescriptor} from './types'
 
 export const enum ReactIntlErrorCode {
-    FORMAT_ERROR = 'FORMAT_ERROR',
-    UNSUPPORTED_FORMATTER = 'UNSUPPORTED_FORMATTER',
-    INVALID_CONFIG = 'INVALID_CONFIG',
-    MISSING_DATA = 'MISSING_DATA',
-    MISSING_TRANSLATION = 'MISSING_TRANSLATION'
+  FORMAT_ERROR = 'FORMAT_ERROR',
+  UNSUPPORTED_FORMATTER = 'UNSUPPORTED_FORMATTER',
+  INVALID_CONFIG = 'INVALID_CONFIG',
+  MISSING_DATA = 'MISSING_DATA',
+  MISSING_TRANSLATION = 'MISSING_TRANSLATION',
 }
 
 export class ReactIntlError extends Error {
-    public readonly code: ReactIntlErrorCode
-    public readonly descriptor?: MessageDescriptor
-    constructor(code: ReactIntlErrorCode, message: string, descriptor?: MessageDescriptor, exception?: Error) {
-        super(`[React Intl Error ${code}] ${message} ${exception ? `\n${exception.stack}` : ''}`)
-        this.code = code
-        this.descriptor = descriptor
-        if (typeof Error.captureStackTrace === 'function') {
-            Error.captureStackTrace(this, ReactIntlError)
-        }
+  public readonly code: ReactIntlErrorCode
+  public readonly descriptor?: MessageDescriptor
+  constructor(
+    code: ReactIntlErrorCode,
+    message: string,
+    descriptor?: MessageDescriptor,
+    exception?: Error
+  ) {
+    super(
+      `[React Intl Error ${code}] ${message} ${
+        exception ? `\n${exception.stack}` : ''
+      }`
+    )
+    this.code = code
+    this.descriptor = descriptor
+    if (typeof Error.captureStackTrace === 'function') {
+      Error.captureStackTrace(this, ReactIntlError)
     }
-}
+  }
+}

package/src/formatters/dateTime.ts

@@ -4,10 +4,10 @@
  * See the accompanying LICENSE file for terms.
  */
 
-import {Formatters, IntlConfig, IntlFormatters} from '../types';
+import {Formatters, IntlConfig, IntlFormatters} from '../types'
 
-import {filterProps, getNamedFormat} from '../utils';
-import {ReactIntlError, ReactIntlErrorCode} from '../error';
+import {filterProps, getNamedFormat} from '../utils'
+import {ReactIntlError, ReactIntlErrorCode} from '../error'
 
 const DATE_TIME_FORMAT_OPTIONS: Array<keyof Intl.DateTimeFormatOptions> = [
   'localeMatcher',
@@ -25,7 +25,7 @@ const DATE_TIME_FORMAT_OPTIONS: Array<keyof Intl.DateTimeFormatOptions> = [
   'minute',
   'second',
   'timeZoneName',
-];
+]
 
 export function getFormatter(
   {
@@ -38,17 +38,13 @@ export function getFormatter(
   getDateTimeFormat: Formatters['getDateTimeFormat'],
   options: Parameters<IntlFormatters['formatDate']>[1] = {}
 ): Intl.DateTimeFormat {
-  const {format} = options;
+  const {format} = options
   const defaults = {
     ...(timeZone && {timeZone}),
     ...(format && getNamedFormat(formats!, type, format, onError)),
-  };
+  }
 
-  let filteredOptions = filterProps(
-    options,
-    DATE_TIME_FORMAT_OPTIONS,
-    defaults
-  );
+  let filteredOptions = filterProps(options, DATE_TIME_FORMAT_OPTIONS, defaults)
 
   if (
     type === 'time' &&
@@ -57,10 +53,10 @@ export function getFormatter(
     !filteredOptions.second
   ) {
     // Add default formatting options if hour, minute, or second isn't defined.
-    filteredOptions = {...filteredOptions, hour: 'numeric', minute: 'numeric'};
+    filteredOptions = {...filteredOptions, hour: 'numeric', minute: 'numeric'}
   }
 
-  return getDateTimeFormat(locale, filteredOptions);
+  return getDateTimeFormat(locale, filteredOptions)
 }
 
 export function formatDate(
@@ -69,11 +65,9 @@ export function formatDate(
   value?: Parameters<IntlFormatters['formatDate']>[0],
   options: Parameters<IntlFormatters['formatDate']>[1] = {}
 ): string {
-  const date = typeof value === 'string' ? new Date(value || 0) : value;
+  const date = typeof value === 'string' ? new Date(value || 0) : value
   try {
-    return getFormatter(config, 'date', getDateTimeFormat, options).format(
-      date
-    );
+    return getFormatter(config, 'date', getDateTimeFormat, options).format(date)
   } catch (e) {
     config.onError(
       new ReactIntlError(
@@ -81,10 +75,10 @@ export function formatDate(
         'Error formatting date.',
         e
       )
-    );
+    )
   }
 
-  return String(date);
+  return String(date)
 }
 
 export function formatTime(
@@ -93,12 +87,10 @@ export function formatTime(
   value?: Parameters<IntlFormatters['formatTime']>[0],
   options: Parameters<IntlFormatters['formatTime']>[1] = {}
 ): string {
-  const date = typeof value === 'string' ? new Date(value || 0) : value;
+  const date = typeof value === 'string' ? new Date(value || 0) : value
 
   try {
-    return getFormatter(config, 'time', getDateTimeFormat, options).format(
-      date
-    );
+    return getFormatter(config, 'time', getDateTimeFormat, options).format(date)
   } catch (e) {
     config.onError(
       new ReactIntlError(
@@ -106,10 +98,10 @@ export function formatTime(
         'Error formatting time.',
         e
       )
-    );
+    )
   }
 
-  return String(date);
+  return String(date)
 }
 
 export function formatDateToParts(
@@ -118,14 +110,14 @@ export function formatDateToParts(
   value?: Parameters<IntlFormatters['formatDate']>[0],
   options: Parameters<IntlFormatters['formatDate']>[1] = {}
 ): Intl.DateTimeFormatPart[] {
-  const date = typeof value === 'string' ? new Date(value || 0) : value;
+  const date = typeof value === 'string' ? new Date(value || 0) : value
   try {
     return getFormatter(
       config,
       'date',
       getDateTimeFormat,
       options
-    ).formatToParts(date);
+    ).formatToParts(date)
   } catch (e) {
     config.onError(
       new ReactIntlError(
@@ -133,10 +125,10 @@ export function formatDateToParts(
         'Error formatting date.',
         e
       )
-    );
+    )
   }
 
-  return [];
+  return []
 }
 
 export function formatTimeToParts(
@@ -145,7 +137,7 @@ export function formatTimeToParts(
   value?: Parameters<IntlFormatters['formatTime']>[0],
   options: Parameters<IntlFormatters['formatTime']>[1] = {}
 ): Intl.DateTimeFormatPart[] {
-  const date = typeof value === 'string' ? new Date(value || 0) : value;
+  const date = typeof value === 'string' ? new Date(value || 0) : value
 
   try {
     return getFormatter(
@@ -153,7 +145,7 @@ export function formatTimeToParts(
       'time',
       getDateTimeFormat,
       options
-    ).formatToParts(date);
+    ).formatToParts(date)
   } catch (e) {
     config.onError(
       new ReactIntlError(
@@ -161,8 +153,8 @@ export function formatTimeToParts(
         'Error formatting time.',
         e
       )
-    );
+    )
   }
 
-  return [];
+  return []
 }