react-intl 3.9.1 → 3.11.0

package/dist/types.d.ts

@@ -37,6 +37,7 @@ export interface IntlFormatters {
     formatMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType>): string;
     formatMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType | React.ReactElement | FormatXMLElementFn>): string | React.ReactNodeArray;
     formatHTMLMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType>): React.ReactNode;
+    formatList(values: Array<string>, opts?: FormatListOptions): string;
     formatList(values: Array<string | React.ReactNode>, opts?: FormatListOptions): React.ReactNode;
 }
 export interface Formatters {
@@ -59,7 +60,7 @@ export interface IntlCache {
     list: Record<string, IntlListFormat>;
 }
 export interface MessageDescriptor {
-    id?: string;
+    id?: string | number;
     description?: string | object;
     defaultMessage?: string;
 }

package/dist/utils.d.ts

@@ -2,7 +2,7 @@ import { IntlConfig, IntlCache, CustomFormats, Formatters } from './types';
 import { IntlRelativeTimeFormatOptions } from '@formatjs/intl-relativetimeformat';
 export declare function escape(str: string): string;
 export declare function filterProps<T extends Record<string, any>, K extends string>(props: T, whitelist: Array<K>, defaults?: Partial<T>): Pick<T, K>;
-export declare function invariantIntlContext(intl?: any): void;
+export declare function invariantIntlContext(intl?: any): asserts intl;
 export declare function createError(message: string, exception?: Error): string;
 export declare function defaultErrorHandler(error: string): void;
 export declare const DEFAULT_INTL_CONFIG: Pick<IntlConfig, 'formats' | 'messages' | 'timeZone' | 'textComponent' | 'defaultLocale' | 'defaultFormats' | 'onError'>;

package/dist/utils.js

@@ -13,12 +13,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var React = require("react");
 var intl_messageformat_1 = require("intl-messageformat");
 var intl_format_cache_1 = require("intl-format-cache");
-// Since rollup cannot deal with namespace being a function,
-// this is to interop with TypeScript since `invariant`
-// does not export a default
-// https://github.com/rollup/rollup/issues/1267
-var invariant_ = require("invariant");
-var invariant = invariant_.default || invariant_;
+var intl_utils_1 = require("@formatjs/intl-utils");
 var ESCAPED_CHARS = {
     38: '&',
     62: '>',
@@ -45,7 +40,7 @@ function filterProps(props, whitelist, defaults) {
 }
 exports.filterProps = filterProps;
 function invariantIntlContext(intl) {
-    invariant(intl, '[React Intl] Could not find required `intl` object. ' +
+    intl_utils_1.invariant(intl, '[React Intl] Could not find required `intl` object. ' +
         '<IntlProvider> needs to exist in the component ancestry.');
 }
 exports.invariantIntlContext = invariantIntlContext;

package/lib/components/createFormattedComponent.js

@@ -3,8 +3,10 @@ var __rest = (this && this.__rest) || function (s, e) {
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
         t[p] = s[p];
     if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
     return t;
 };
 import * as React from 'react';

package/lib/components/html-message.js

@@ -39,5 +39,5 @@ class FormattedHTMLMessage extends FormattedMessage {
     }
 }
 FormattedHTMLMessage.displayName = 'FormattedHTMLMessage';
-FormattedHTMLMessage.defaultProps = Object.assign({}, FormattedMessage.defaultProps, { tagName: 'span' });
+FormattedHTMLMessage.defaultProps = Object.assign(Object.assign({}, FormattedMessage.defaultProps), { tagName: 'span' });
 export default FormattedHTMLMessage;

package/lib/components/injectIntl.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { IntlShape, Omit } from '../types';
-export declare const Provider: React.ProviderExoticComponent<React.ProviderProps<IntlShape>>;
+export declare const Provider: React.Provider<IntlShape>;
 export declare const Context: React.Context<IntlShape>;
 export interface Opts<IntlPropName extends string = 'intl', ForwardRef extends boolean = false> {
     intlPropName?: IntlPropName;

package/lib/components/message.js

@@ -8,8 +8,10 @@ var __rest = (this && this.__rest) || function (s, e) {
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
         t[p] = s[p];
     if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
     return t;
 };
 import * as React from 'react';
@@ -22,7 +24,7 @@ const defaultFormatMessage = (descriptor, values) => {
     if (process.env.NODE_ENV !== 'production') {
         console.error('[React Intl] Could not find required `intl` object. <IntlProvider> needs to exist in the component ancestry. Using default message as fallback.');
     }
-    return formatMessage(Object.assign({}, DEFAULT_INTL_CONFIG, { locale: 'en' }), createFormatters(), descriptor, values);
+    return formatMessage(Object.assign(Object.assign({}, DEFAULT_INTL_CONFIG), { locale: 'en' }), createFormatters(), descriptor, values);
 };
 class FormattedMessage extends React.Component {
     shouldComponentUpdate(nextProps) {

package/lib/components/plural.d.ts

@@ -11,7 +11,7 @@ interface Props extends FormatPluralOptions {
     many?: React.ReactNode;
     children?(value: React.ReactNode): React.ReactElement | null;
 }
-declare const _default: React.ForwardRefExoticComponent<Pick<Props, "children" | "other" | "zero" | "one" | "two" | "few" | "many" | "localeMatcher" | "type" | "format" | "value"> & {
+declare const _default: React.ForwardRefExoticComponent<Pick<Props, "children" | "other" | "zero" | "one" | "two" | "few" | "many" | "format" | "localeMatcher" | "type" | "value"> & {
     forwardedRef?: ((instance: any) => void) | React.RefObject<any> | null | undefined;
 } & React.RefAttributes<any>> & {
     WrappedComponent: React.ComponentType<Props>;

package/lib/components/provider.js

@@ -34,7 +34,7 @@ function processIntlConfig(config) {
  */
 export function createIntl(config, cache) {
     const formatters = createFormatters(cache);
-    const resolvedConfig = Object.assign({}, DEFAULT_INTL_CONFIG, config);
+    const resolvedConfig = Object.assign(Object.assign({}, DEFAULT_INTL_CONFIG), config);
     if (!resolvedConfig.locale ||
         !areIntlLocalesSupported(resolvedConfig.locale)) {
         const { locale, defaultLocale, onError } = resolvedConfig;
@@ -49,7 +49,7 @@ export function createIntl(config, cache) {
         // each <FormattedMessage> contains a `defaultMessage` prop.
         resolvedConfig.locale = resolvedConfig.defaultLocale || 'en';
     }
-    return Object.assign({}, resolvedConfig, { formatters, formatNumber: formatNumber.bind(null, resolvedConfig, formatters.getNumberFormat), formatNumberToParts: formatNumberToParts.bind(null, resolvedConfig, formatters.getNumberFormat), formatRelativeTime: formatRelativeTime.bind(null, resolvedConfig, formatters.getRelativeTimeFormat), formatDate: formatDate.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatDateToParts: formatDateToParts.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatTime: formatTime.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatTimeToParts: formatTimeToParts.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatPlural: formatPlural.bind(null, resolvedConfig, formatters.getPluralRules), formatMessage: formatMessage.bind(null, resolvedConfig, formatters), formatHTMLMessage: formatHTMLMessage.bind(null, resolvedConfig, formatters), formatList: formatList.bind(null, resolvedConfig, formatters.getListFormat) });
+    return Object.assign(Object.assign({}, resolvedConfig), { formatters, formatNumber: formatNumber.bind(null, resolvedConfig, formatters.getNumberFormat), formatNumberToParts: formatNumberToParts.bind(null, resolvedConfig, formatters.getNumberFormat), formatRelativeTime: formatRelativeTime.bind(null, resolvedConfig, formatters.getRelativeTimeFormat), formatDate: formatDate.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatDateToParts: formatDateToParts.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatTime: formatTime.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatTimeToParts: formatTimeToParts.bind(null, resolvedConfig, formatters.getDateTimeFormat), formatPlural: formatPlural.bind(null, resolvedConfig, formatters.getPluralRules), formatMessage: formatMessage.bind(null, resolvedConfig, formatters), formatHTMLMessage: formatHTMLMessage.bind(null, resolvedConfig, formatters), formatList: formatList.bind(null, resolvedConfig, formatters.getListFormat) });
 }
 export default class IntlProvider extends React.PureComponent {
     constructor() {

package/lib/components/relative.js

@@ -6,12 +6,7 @@
 import * as React from 'react';
 import { Context } from './injectIntl';
 import { invariantIntlContext } from '../utils';
-// Since rollup cannot deal with namespace being a function,
-// this is to interop with TypeScript since `invariant`
-// does not export a default
-// https://github.com/rollup/rollup/issues/1267
-import * as invariant_ from 'invariant';
-const invariant = invariant_.default || invariant_;
+import { invariant } from '@formatjs/intl-utils';
 const MINUTE = 60;
 const HOUR = 60 * 60;
 const DAY = 60 * 60 * 24;
@@ -57,9 +52,6 @@ const INCREMENTABLE_UNITS = ['second', 'minute', 'hour'];
 function canIncrement(unit = 'second') {
     return INCREMENTABLE_UNITS.includes(unit);
 }
-function verifyProps(updateIntervalInSeconds, unit) {
-    invariant(!updateIntervalInSeconds || (updateIntervalInSeconds && canIncrement(unit)), 'Cannot schedule update with unit longer than hour');
-}
 export class FormattedRelativeTime extends React.PureComponent {
     constructor(props) {
         super(props);
@@ -72,7 +64,8 @@ export class FormattedRelativeTime extends React.PureComponent {
                 ? valueToSeconds(this.props.value, this.props.unit)
                 : 0,
         };
-        verifyProps(props.updateIntervalInSeconds, props.unit);
+        invariant(!props.updateIntervalInSeconds ||
+            !!(props.updateIntervalInSeconds && canIncrement(props.unit)), 'Cannot schedule update with unit longer than hour');
     }
     scheduleNextUpdate({ updateIntervalInSeconds, unit }, { currentValueInSeconds }) {
         clearTimeout(this._updateTimer);

package/lib/formatters/dateTime.js

@@ -21,14 +21,14 @@ const DATE_TIME_FORMAT_OPTIONS = [
 ];
 export function getFormatter({ locale, formats, onError, timeZone, }, type, getDateTimeFormat, options = {}) {
     const { format } = options;
-    const defaults = Object.assign({}, (timeZone && { timeZone }), (format && getNamedFormat(formats, type, format, onError)));
+    const defaults = Object.assign(Object.assign({}, (timeZone && { timeZone })), (format && getNamedFormat(formats, type, format, onError)));
     let filteredOptions = filterProps(options, DATE_TIME_FORMAT_OPTIONS, defaults);
     if (type === 'time' &&
         !filteredOptions.hour &&
         !filteredOptions.minute &&
         !filteredOptions.second) {
         // Add default formatting options if hour, minute, or second isn't defined.
-        filteredOptions = Object.assign({}, filteredOptions, { hour: 'numeric', minute: 'numeric' });
+        filteredOptions = Object.assign(Object.assign({}, filteredOptions), { hour: 'numeric', minute: 'numeric' });
     }
     return getDateTimeFormat(locale, filteredOptions);
 }

package/lib/formatters/list.d.ts

@@ -1,3 +1,2 @@
-import * as React from 'react';
 import { IntlConfig, Formatters, IntlFormatters } from '../types';
-export declare function formatList({ locale, onError }: Pick<IntlConfig, 'locale' | 'onError'>, getListFormat: Formatters['getListFormat'], values: Parameters<IntlFormatters['formatList']>[0], options?: Parameters<IntlFormatters['formatList']>[1]): string | React.ReactNode;
+export declare function formatList({ locale, onError }: Pick<IntlConfig, 'locale' | 'onError'>, getListFormat: Formatters['getListFormat'], values: Array<string>, options: Parameters<IntlFormatters['formatList']>[1]): string;

package/lib/formatters/message.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { Formatters, IntlConfig, MessageDescriptor } from '../types';
 import { PrimitiveType } from 'intl-messageformat';
+export declare const prepareIntlMessageFormatHtmlOutput: (chunks: (string | object)[]) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
 export declare function formatMessage({ locale, formats, messages, defaultLocale, defaultFormats, onError, }: Pick<IntlConfig, 'locale' | 'formats' | 'messages' | 'defaultLocale' | 'defaultFormats' | 'onError'>, state: Formatters, messageDescriptor?: MessageDescriptor, values?: Record<string, PrimitiveType>): string;
 export declare function formatHTMLMessage(config: Pick<IntlConfig, 'locale' | 'formats' | 'messages' | 'defaultLocale' | 'defaultFormats' | 'onError'>, state: Formatters, messageDescriptor?: MessageDescriptor, rawValues?: Record<string, PrimitiveType>): React.ReactNode;

package/lib/formatters/message.js

@@ -3,12 +3,8 @@
  * Copyrights licensed under the New BSD License.
  * See the accompanying LICENSE file for terms.
  */
-// Since rollup cannot deal with namespace being a function,
-// this is to interop with TypeScript since `invariant`
-// does not export a default
-// https://github.com/rollup/rollup/issues/1267
-import * as invariant_ from 'invariant';
-const invariant = invariant_.default || invariant_;
+import * as React from 'react';
+import { invariant } from '@formatjs/intl-utils';
 import { createError, escape } from '../utils';
 import IntlMessageFormat from 'intl-messageformat';
 function setTimeZoneInOptions(opts, timeZone) {
@@ -18,9 +14,9 @@ function setTimeZoneInOptions(opts, timeZone) {
     }, {});
 }
 function deepMergeOptions(opts1, opts2) {
-    const keys = Object.keys(Object.assign({}, opts1, opts2));
+    const keys = Object.keys(Object.assign(Object.assign({}, opts1), opts2));
     return keys.reduce((all, k) => {
-        all[k] = Object.assign({}, (opts1[k] || {}), (opts2[k] || {}));
+        all[k] = Object.assign(Object.assign({}, (opts1[k] || {})), (opts2[k] || {}));
         return all;
     }, {});
 }
@@ -29,16 +25,14 @@ function deepMergeFormatsAndSetTimeZone(f1, timeZone) {
         return f1;
     }
     const mfFormats = IntlMessageFormat.formats;
-    return Object.assign({}, mfFormats, f1, { date: deepMergeOptions(setTimeZoneInOptions(mfFormats.date, timeZone), setTimeZoneInOptions(f1.date || {}, timeZone)), time: deepMergeOptions(setTimeZoneInOptions(mfFormats.time, timeZone), setTimeZoneInOptions(f1.time || {}, timeZone)) });
+    return Object.assign(Object.assign(Object.assign({}, mfFormats), f1), { date: deepMergeOptions(setTimeZoneInOptions(mfFormats.date, timeZone), setTimeZoneInOptions(f1.date || {}, timeZone)), time: deepMergeOptions(setTimeZoneInOptions(mfFormats.time, timeZone), setTimeZoneInOptions(f1.time || {}, timeZone)) });
 }
+export const prepareIntlMessageFormatHtmlOutput = (chunks) => React.createElement(React.Fragment, null, ...chunks);
 export function formatMessage({ locale, formats, messages, defaultLocale, defaultFormats, onError, timeZone, }, state, messageDescriptor = { id: '' }, values = {}) {
     const { id, defaultMessage } = messageDescriptor;
     // `id` is a required field of a Message Descriptor.
-    invariant(id, '[React Intl] An `id` must be provided to format a message.');
-    if (!id) {
-        throw new Error('[React Intl] An `id` must be provided to format a message.');
-    }
-    const message = messages && messages[id];
+    invariant(!!id, '[React Intl] An `id` must be provided to format a message.');
+    const message = messages && messages[String(id)];
     formats = deepMergeFormatsAndSetTimeZone(formats, timeZone);
     defaultFormats = deepMergeFormatsAndSetTimeZone(defaultFormats, timeZone);
     let formattedMessageParts = [];
@@ -77,15 +71,15 @@ export function formatMessage({ locale, formats, messages, defaultLocale, defaul
         onError(createError(`Cannot format message: "${id}", ` +
             `using message ${message || defaultMessage ? 'source' : 'id'} as fallback.`));
         if (typeof message === 'string') {
-            return message || defaultMessage || id;
+            return message || defaultMessage || String(id);
         }
-        return defaultMessage || id;
+        return defaultMessage || String(id);
     }
     if (formattedMessageParts.length === 1 &&
         typeof formattedMessageParts[0] === 'string') {
-        return formattedMessageParts[0] || defaultMessage || id;
+        return formattedMessageParts[0] || defaultMessage || String(id);
     }
-    return formattedMessageParts;
+    return prepareIntlMessageFormatHtmlOutput(formattedMessageParts);
 }
 export function formatHTMLMessage(config, state, messageDescriptor = { id: '' }, rawValues = {}) {
     // Process all the values before they are used when formatting the ICU

package/lib/index.d.ts

@@ -19,11 +19,11 @@ export declare const FormattedNumber: React.FC<UnifiedNumberFormatOptions & Cust
 export declare const FormattedList: React.FC<IntlListFormatOptions & {
     value: React.ReactNode[];
 }>;
-export declare const FormattedDateParts: React.FunctionComponent<Intl.DateTimeFormatOptions & CustomFormatConfig & {
+export declare const FormattedDateParts: React.FC<Intl.DateTimeFormatOptions & CustomFormatConfig & {
     value: string | number | Date | undefined;
     children(val: Intl.DateTimeFormatPart[]): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
 }>;
-export declare const FormattedTimeParts: React.FunctionComponent<Intl.DateTimeFormatOptions & CustomFormatConfig & {
+export declare const FormattedTimeParts: React.FC<Intl.DateTimeFormatOptions & CustomFormatConfig & {
     value: string | number | Date | undefined;
     children(val: Intl.DateTimeFormatPart[]): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
 }>;

package/lib/react-intl.d.ts

@@ -46,7 +46,7 @@ export declare const FormattedDate: React.FC<Intl.DateTimeFormatOptions & Custom
     value: string | number | Date | undefined;
 }>;
 
-export declare const FormattedDateParts: React.FunctionComponent<Intl.DateTimeFormatOptions & CustomFormatConfig & {
+export declare const FormattedDateParts: React.FC<Intl.DateTimeFormatOptions & CustomFormatConfig & {
     value: string | number | Date | undefined;
     children(val: Intl.DateTimeFormatPart[]): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
 }>;
@@ -82,7 +82,7 @@ export declare const FormattedNumberParts: React.FC<Formatter['formatNumber'] &
     children(val: Intl.NumberFormatPart[]): React.ReactElement | null;
 }>;
 
-export declare const FormattedPlural: React.ForwardRefExoticComponent<Pick<Props_2, "children" | "other" | "zero" | "one" | "two" | "few" | "many" | "localeMatcher" | "type" | "format" | "value"> & {
+export declare const FormattedPlural: React.ForwardRefExoticComponent<Pick<Props_2, "children" | "other" | "zero" | "one" | "two" | "few" | "many" | "format" | "localeMatcher" | "type" | "value"> & {
     forwardedRef?: ((instance: any) => void) | React.RefObject<any> | null | undefined;
 } & React.RefAttributes<any>> & {
     WrappedComponent: React.ComponentType<Props_2>;
@@ -106,7 +106,7 @@ export declare const FormattedTime: React.FC<Intl.DateTimeFormatOptions & Custom
     value: string | number | Date | undefined;
 }>;
 
-export declare const FormattedTimeParts: React.FunctionComponent<Intl.DateTimeFormatOptions & CustomFormatConfig & {
+export declare const FormattedTimeParts: React.FC<Intl.DateTimeFormatOptions & CustomFormatConfig & {
     value: string | number | Date | undefined;
     children(val: Intl.DateTimeFormatPart[]): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
 }>;
@@ -169,6 +169,7 @@ export declare interface IntlFormatters {
     formatMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType>): string;
     formatMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType | React.ReactElement | FormatXMLElementFn>): string | React.ReactNodeArray;
     formatHTMLMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType>): React.ReactNode;
+    formatList(values: Array<string>, opts?: FormatListOptions): string;
     formatList(values: Array<string | React.ReactNode>, opts?: FormatListOptions): React.ReactNode;
 }
 
@@ -186,7 +187,7 @@ export declare interface IntlShape extends IntlConfig, IntlFormatters {
 }
 
 export declare interface MessageDescriptor {
-    id?: string;
+    id?: string | number;
     description?: string | object;
     defaultMessage?: string;
 }
@@ -226,7 +227,7 @@ declare interface Props_3<V extends Record<string, any> = Record<string, React.R
     children?(...nodes: React.ReactNodeArray): React.ReactNode;
 }
 
-export declare const RawIntlProvider: React.ProviderExoticComponent<React.ProviderProps<IntlShape>>;
+export declare const RawIntlProvider: React.Provider<IntlShape>;
 
 declare interface State {
     /**

package/lib/tsdoc-metadata.json

@@ -5,7 +5,7 @@
   "toolPackages": [
     {
       "packageName": "@microsoft/api-extractor",
-      "packageVersion": "7.6.2"
+      "packageVersion": "7.7.1"
     }
   ]
 }

package/lib/types.d.ts

@@ -37,6 +37,7 @@ export interface IntlFormatters {
     formatMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType>): string;
     formatMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType | React.ReactElement | FormatXMLElementFn>): string | React.ReactNodeArray;
     formatHTMLMessage(descriptor: MessageDescriptor, values?: Record<string, PrimitiveType>): React.ReactNode;
+    formatList(values: Array<string>, opts?: FormatListOptions): string;
     formatList(values: Array<string | React.ReactNode>, opts?: FormatListOptions): React.ReactNode;
 }
 export interface Formatters {
@@ -59,7 +60,7 @@ export interface IntlCache {
     list: Record<string, IntlListFormat>;
 }
 export interface MessageDescriptor {
-    id?: string;
+    id?: string | number;
     description?: string | object;
     defaultMessage?: string;
 }

package/lib/utils.d.ts

@@ -2,7 +2,7 @@ import { IntlConfig, IntlCache, CustomFormats, Formatters } from './types';
 import { IntlRelativeTimeFormatOptions } from '@formatjs/intl-relativetimeformat';
 export declare function escape(str: string): string;
 export declare function filterProps<T extends Record<string, any>, K extends string>(props: T, whitelist: Array<K>, defaults?: Partial<T>): Pick<T, K>;
-export declare function invariantIntlContext(intl?: any): void;
+export declare function invariantIntlContext(intl?: any): asserts intl;
 export declare function createError(message: string, exception?: Error): string;
 export declare function defaultErrorHandler(error: string): void;
 export declare const DEFAULT_INTL_CONFIG: Pick<IntlConfig, 'formats' | 'messages' | 'timeZone' | 'textComponent' | 'defaultLocale' | 'defaultFormats' | 'onError'>;

package/lib/utils.js

@@ -11,12 +11,7 @@ file in the root directory of React's source tree.
 import * as React from 'react';
 import IntlMessageFormat from 'intl-messageformat';
 import memoizeIntlConstructor from 'intl-format-cache';
-// Since rollup cannot deal with namespace being a function,
-// this is to interop with TypeScript since `invariant`
-// does not export a default
-// https://github.com/rollup/rollup/issues/1267
-import * as invariant_ from 'invariant';
-const invariant = invariant_.default || invariant_;
+import { invariant } from '@formatjs/intl-utils';
 const ESCAPED_CHARS = {
     38: '&',
     62: '>',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-intl",
-  "version": "3.9.1",
+  "version": "3.11.0",
   "description": "Internationalize React apps. This library provides React components and an API to format dates, numbers, and strings, including pluralization and handling translations.",
   "keywords": [
     "intl",
@@ -131,49 +131,49 @@
   "types": "./lib/react-intl.d.ts",
   "sideEffects": false,
   "dependencies": {
-    "@formatjs/intl-listformat": "^1.3.1",
-    "@formatjs/intl-relativetimeformat": "^4.5.1",
-    "@formatjs/intl-unified-numberformat": "^2.2.0",
+    "@formatjs/intl-listformat": "^1.3.7",
+    "@formatjs/intl-relativetimeformat": "^4.5.7",
+    "@formatjs/intl-unified-numberformat": "^3.0.4",
+    "@formatjs/intl-utils": "^2.0.4",
     "@formatjs/macro": "^0.2.6",
     "@types/hoist-non-react-statics": "^3.3.1",
-    "@types/invariant": "^2.2.30",
+    "@types/invariant": "^2.2.31",
     "hoist-non-react-statics": "^3.3.1",
-    "intl-format-cache": "^4.2.13",
+    "intl-format-cache": "^4.2.19",
     "intl-locales-supported": "^1.8.4",
-    "intl-messageformat": "^7.7.0",
-    "intl-messageformat-parser": "^3.5.0",
-    "invariant": "^2.1.1",
-    "shallow-equal": "^1.1.0"
+    "intl-messageformat": "^7.8.2",
+    "intl-messageformat-parser": "^3.6.2",
+    "shallow-equal": "^1.2.1"
   },
   "peerDependencies": {
     "react": "^16.3.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.7.4",
-    "@babel/node": "^7.7.4",
+    "@babel/core": "^7.7.7",
+    "@babel/node": "^7.7.7",
     "@babel/plugin-proposal-class-properties": "^7.7.4",
-    "@babel/plugin-transform-modules-commonjs": "^7.7.4",
-    "@babel/preset-env": "^7.7.4",
+    "@babel/plugin-transform-modules-commonjs": "^7.7.5",
+    "@babel/preset-env": "^7.7.7",
     "@babel/preset-react": "^7.7.4",
-    "@formatjs/intl-pluralrules": "^1.3.9",
-    "@microsoft/api-documenter": "^7.7.0",
-    "@microsoft/api-extractor": "^7.6.2",
+    "@formatjs/intl-pluralrules": "^1.5.0",
+    "@microsoft/api-documenter": "^7.7.3",
+    "@microsoft/api-extractor": "^7.7.1",
     "@types/benchmark": "^1.0.31",
-    "@types/enzyme": "^3.10.3",
-    "@types/jest": "^24.0.23",
+    "@types/enzyme": "^3.10.4",
+    "@types/jest": "^24.0.25",
     "@types/prop-types": "^15.7.3",
-    "@types/react": "^16.9.13",
+    "@types/react": "^16.9.17",
     "@types/react-dom": "^16.9.4",
-    "@typescript-eslint/eslint-plugin": "^2.9.0",
-    "@typescript-eslint/parser": "^2.9.0",
+    "@typescript-eslint/eslint-plugin": "^2.15.0",
+    "@typescript-eslint/parser": "^2.15.0",
     "babel-jest": "^24.9.0",
     "benchmark": "^2.1.0",
-    "core-js": "^3.4.5",
+    "core-js": "^3.6.2",
     "cross-env": "^6.0.3",
-    "enzyme": "^3.6.0",
-    "enzyme-adapter-react-16": "^1.15.1",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.2",
     "enzyme-to-json": "^3.4.3",
-    "eslint": "^6.7.2",
+    "eslint": "^6.8.0",
     "eslint-plugin-react": "^7.17.0",
     "fs-extra": "^8.1.0",
     "full-icu": "^1.3.0",
@@ -187,18 +187,18 @@
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "rimraf": "^3.0.0",
-    "rollup": "^1.27.8",
+    "rollup": "^1.29.0",
     "rollup-plugin-babel": "^4.3.3",
     "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-replace": "^2.0.0",
-    "rollup-plugin-typescript2": "^0.25.0",
-    "rollup-plugin-uglify": "^6.0.3",
+    "rollup-plugin-typescript2": "^0.25.3",
+    "rollup-plugin-uglify": "^6.0.4",
     "standard-version": "^7.0.1",
-    "ts-jest": "^24.2.0",
+    "ts-jest": "^24.3.0",
     "ts-node": "^8.5.4",
     "tslib": "^1.9.3",
-    "typescript": "~3.3.0"
+    "typescript": "^3.7.0"
   },
   "scripts": {
     "benchmark": "cross-env NODE_ENV=production TS_NODE_PROJECT=./tsconfig.cjs.json ts-node test/perf/index.tsx",

package/src/components/provider.tsx

@@ -178,6 +178,6 @@ export default class IntlProvider extends React.PureComponent<
 
   render(): JSX.Element {
     invariantIntlContext(this.state.intl);
-    return <Provider value={this.state.intl!}>{this.props.children}</Provider>;
+    return <Provider value={this.state.intl}>{this.props.children}</Provider>;
   }
 }

package/src/components/relative.tsx

@@ -8,13 +8,7 @@ import {Context} from './injectIntl';
 import {FormatRelativeTimeOptions} from '../types';
 import {Unit} from '@formatjs/intl-relativetimeformat';
 import {invariantIntlContext} from '../utils';
-
-// Since rollup cannot deal with namespace being a function,
-// this is to interop with TypeScript since `invariant`
-// does not export a default
-// https://github.com/rollup/rollup/issues/1267
-import * as invariant_ from 'invariant';
-const invariant: typeof invariant_ = (invariant_ as any).default || invariant_;
+import {invariant} from '@formatjs/intl-utils';
 const MINUTE = 60;
 const HOUR = 60 * 60;
 const DAY = 60 * 60 * 24;
@@ -82,13 +76,6 @@ function canIncrement(unit: Unit = 'second'): boolean {
   return INCREMENTABLE_UNITS.includes(unit);
 }
 
-function verifyProps(updateIntervalInSeconds?: number, unit?: Unit): void {
-  invariant(
-    !updateIntervalInSeconds || (updateIntervalInSeconds && canIncrement(unit)),
-    'Cannot schedule update with unit longer than hour'
-  );
-}
-
 export class FormattedRelativeTime extends React.PureComponent<Props, State> {
   // Public for testing
   _updateTimer: any = null;
@@ -107,7 +94,11 @@ export class FormattedRelativeTime extends React.PureComponent<Props, State> {
 
   constructor(props: Props) {
     super(props);
-    verifyProps(props.updateIntervalInSeconds, props.unit);
+    invariant(
+      !props.updateIntervalInSeconds ||
+        !!(props.updateIntervalInSeconds && canIncrement(props.unit)),
+      'Cannot schedule update with unit longer than hour'
+    );
   }
 
   scheduleNextUpdate(

package/src/formatters/list.ts

@@ -15,12 +15,18 @@ function generateToken(i: number): string {
   return `${now}_${i}_${now}`;
 }
 
+export function formatList(
+  {locale, onError}: Pick<IntlConfig, 'locale' | 'onError'>,
+  getListFormat: Formatters['getListFormat'],
+  values: Array<string>,
+  options: Parameters<IntlFormatters['formatList']>[1]
+): string;
 export function formatList(
   {locale, onError}: Pick<IntlConfig, 'locale' | 'onError'>,
   getListFormat: Formatters['getListFormat'],
   values: Parameters<IntlFormatters['formatList']>[0],
   options: Parameters<IntlFormatters['formatList']>[1] = {}
-): string | React.ReactNode {
+): React.ReactNode {
   const ListFormat: typeof IntlListFormat = (Intl as any).ListFormat;
   if (!ListFormat) {
     onError(