react-intl 6.0.6 → 6.1.1

package/lib/src/components/provider.js

@@ -0,0 +1,112 @@
+/*
+ * Copyright 2015, Yahoo Inc.
+ * Copyrights licensed under the New BSD License.
+ * See the accompanying LICENSE file for terms.
+ */
+import { __assign, __extends, __rest, __spreadArray } from "tslib";
+import * as React from 'react';
+import { Provider } from './injectIntl';
+import { DEFAULT_INTL_CONFIG, invariantIntlContext, assignUniqueKeysToParts, shallowEqual, } from '../utils';
+import { formatMessage as coreFormatMessage, createIntl as coreCreateIntl, createIntlCache, } from '@formatjs/intl';
+import { isFormatXMLElementFn, } from 'intl-messageformat';
+function processIntlConfig(config) {
+    return {
+        locale: config.locale,
+        timeZone: config.timeZone,
+        fallbackOnEmptyString: config.fallbackOnEmptyString,
+        formats: config.formats,
+        textComponent: config.textComponent,
+        messages: config.messages,
+        defaultLocale: config.defaultLocale,
+        defaultFormats: config.defaultFormats,
+        onError: config.onError,
+        onWarn: config.onWarn,
+        wrapRichTextChunksInFragment: config.wrapRichTextChunksInFragment,
+        defaultRichTextElements: config.defaultRichTextElements,
+    };
+}
+function assignUniqueKeysToFormatXMLElementFnArgument(values) {
+    if (!values) {
+        return values;
+    }
+    return Object.keys(values).reduce(function (acc, k) {
+        var v = values[k];
+        acc[k] = isFormatXMLElementFn(v)
+            ? assignUniqueKeysToParts(v)
+            : v;
+        return acc;
+    }, {});
+}
+var formatMessage = function (config, formatters, descriptor, rawValues) {
+    var rest = [];
+    for (var _i = 4; _i < arguments.length; _i++) {
+        rest[_i - 4] = arguments[_i];
+    }
+    var values = assignUniqueKeysToFormatXMLElementFnArgument(rawValues);
+    var chunks = coreFormatMessage.apply(void 0, __spreadArray([config,
+        formatters,
+        descriptor,
+        values], rest, false));
+    if (Array.isArray(chunks)) {
+        return React.Children.toArray(chunks);
+    }
+    return chunks;
+};
+/**
+ * Create intl object
+ * @param config intl config
+ * @param cache cache for formatter instances to prevent memory leak
+ */
+export var createIntl = function (_a, cache) {
+    var rawDefaultRichTextElements = _a.defaultRichTextElements, config = __rest(_a, ["defaultRichTextElements"]);
+    var defaultRichTextElements = assignUniqueKeysToFormatXMLElementFnArgument(rawDefaultRichTextElements);
+    var coreIntl = coreCreateIntl(__assign(__assign(__assign({}, DEFAULT_INTL_CONFIG), config), { defaultRichTextElements: defaultRichTextElements }), cache);
+    var resolvedConfig = {
+        locale: coreIntl.locale,
+        timeZone: coreIntl.timeZone,
+        fallbackOnEmptyString: coreIntl.fallbackOnEmptyString,
+        formats: coreIntl.formats,
+        defaultLocale: coreIntl.defaultLocale,
+        defaultFormats: coreIntl.defaultFormats,
+        messages: coreIntl.messages,
+        onError: coreIntl.onError,
+        defaultRichTextElements: defaultRichTextElements,
+    };
+    return __assign(__assign({}, coreIntl), { 
+        // @ts-expect-error fix this
+        formatMessage: formatMessage.bind(null, resolvedConfig, coreIntl.formatters), 
+        // @ts-expect-error fix this
+        $t: formatMessage.bind(null, resolvedConfig, coreIntl.formatters) });
+};
+var IntlProvider = /** @class */ (function (_super) {
+    __extends(IntlProvider, _super);
+    function IntlProvider() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.cache = createIntlCache();
+        _this.state = {
+            cache: _this.cache,
+            intl: createIntl(processIntlConfig(_this.props), _this.cache),
+            prevConfig: processIntlConfig(_this.props),
+        };
+        return _this;
+    }
+    IntlProvider.getDerivedStateFromProps = function (props, _a) {
+        var prevConfig = _a.prevConfig, cache = _a.cache;
+        var config = processIntlConfig(props);
+        if (!shallowEqual(prevConfig, config)) {
+            return {
+                intl: createIntl(config, cache),
+                prevConfig: config,
+            };
+        }
+        return null;
+    };
+    IntlProvider.prototype.render = function () {
+        invariantIntlContext(this.state.intl);
+        return React.createElement(Provider, { value: this.state.intl }, this.props.children);
+    };
+    IntlProvider.displayName = 'IntlProvider';
+    IntlProvider.defaultProps = DEFAULT_INTL_CONFIG;
+    return IntlProvider;
+}(React.PureComponent));
+export default IntlProvider;

package/lib/src/components/relative.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { RelativeTimeFormatSingularUnit } from '@formatjs/ecma402-abstract';
+import { FormatRelativeTimeOptions } from '@formatjs/intl';
+export interface Props extends FormatRelativeTimeOptions {
+    value?: number;
+    unit?: RelativeTimeFormatSingularUnit;
+    updateIntervalInSeconds?: number;
+    children?(value: string): React.ReactElement | null;
+}
+declare const FormattedRelativeTime: React.FC<Props>;
+export default FormattedRelativeTime;
+//# sourceMappingURL=relative.d.ts.map

package/lib/src/components/relative.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"relative.d.ts","sourceRoot":"","sources":["../../../src/components/relative.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAEL,8BAA8B,EAC/B,MAAM,4BAA4B,CAAA;AACnC,OAAO,EAAC,yBAAyB,EAAC,MAAM,gBAAgB,CAAA;AAuDxD,MAAM,WAAW,KAAM,SAAQ,yBAAyB;IACtD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,8BAA8B,CAAA;IACrC,uBAAuB,CAAC,EAAE,MAAM,CAAA;IAChC,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;CACpD;AA8BD,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmF1C,CAAA;AAQD,eAAe,qBAAqB,CAAA"}

package/lib/src/components/relative.js

@@ -0,0 +1,129 @@
+import { __assign, __rest } from "tslib";
+/*
+ * Copyright 2015, Yahoo Inc.
+ * Copyrights licensed under the New BSD License.
+ * See the accompanying LICENSE file for terms.
+ */
+import * as React from 'react';
+import { invariant, } from '@formatjs/ecma402-abstract';
+import useIntl from './useIntl';
+var MINUTE = 60;
+var HOUR = 60 * 60;
+var DAY = 60 * 60 * 24;
+function selectUnit(seconds) {
+    var absValue = Math.abs(seconds);
+    if (absValue < MINUTE) {
+        return 'second';
+    }
+    if (absValue < HOUR) {
+        return 'minute';
+    }
+    if (absValue < DAY) {
+        return 'hour';
+    }
+    return 'day';
+}
+function getDurationInSeconds(unit) {
+    switch (unit) {
+        case 'second':
+            return 1;
+        case 'minute':
+            return MINUTE;
+        case 'hour':
+            return HOUR;
+        default:
+            return DAY;
+    }
+}
+function valueToSeconds(value, unit) {
+    if (!value) {
+        return 0;
+    }
+    switch (unit) {
+        case 'second':
+            return value;
+        case 'minute':
+            return value * MINUTE;
+        default:
+            return value * HOUR;
+    }
+}
+var INCREMENTABLE_UNITS = [
+    'second',
+    'minute',
+    'hour',
+];
+function canIncrement(unit) {
+    if (unit === void 0) { unit = 'second'; }
+    return INCREMENTABLE_UNITS.indexOf(unit) > -1;
+}
+var SimpleFormattedRelativeTime = function (props) {
+    var _a = useIntl(), formatRelativeTime = _a.formatRelativeTime, Text = _a.textComponent;
+    var children = props.children, value = props.value, unit = props.unit, otherProps = __rest(props, ["children", "value", "unit"]);
+    var formattedRelativeTime = formatRelativeTime(value || 0, unit, otherProps);
+    if (typeof children === 'function') {
+        return children(formattedRelativeTime);
+    }
+    if (Text) {
+        return React.createElement(Text, null, formattedRelativeTime);
+    }
+    return React.createElement(React.Fragment, null, formattedRelativeTime);
+};
+var FormattedRelativeTime = function (_a) {
+    var value = _a.value, unit = _a.unit, updateIntervalInSeconds = _a.updateIntervalInSeconds, otherProps = __rest(_a, ["value", "unit", "updateIntervalInSeconds"]);
+    invariant(!updateIntervalInSeconds ||
+        !!(updateIntervalInSeconds && canIncrement(unit)), 'Cannot schedule update with unit longer than hour');
+    var _b = React.useState(), prevUnit = _b[0], setPrevUnit = _b[1];
+    var _c = React.useState(0), prevValue = _c[0], setPrevValue = _c[1];
+    var _d = React.useState(0), currentValueInSeconds = _d[0], setCurrentValueInSeconds = _d[1];
+    var updateTimer;
+    if (unit !== prevUnit || value !== prevValue) {
+        setPrevValue(value || 0);
+        setPrevUnit(unit);
+        setCurrentValueInSeconds(canIncrement(unit) ? valueToSeconds(value, unit) : 0);
+    }
+    React.useEffect(function () {
+        function clearUpdateTimer() {
+            clearTimeout(updateTimer);
+        }
+        clearUpdateTimer();
+        // If there's no interval and we cannot increment this unit, do nothing
+        if (!updateIntervalInSeconds || !canIncrement(unit)) {
+            return clearUpdateTimer;
+        }
+        // Figure out the next interesting time
+        var nextValueInSeconds = currentValueInSeconds - updateIntervalInSeconds;
+        var nextUnit = selectUnit(nextValueInSeconds);
+        // We've reached the max auto incrementable unit, don't schedule another update
+        if (nextUnit === 'day') {
+            return clearUpdateTimer;
+        }
+        var unitDuration = getDurationInSeconds(nextUnit);
+        var remainder = nextValueInSeconds % unitDuration;
+        var prevInterestingValueInSeconds = nextValueInSeconds - remainder;
+        var nextInterestingValueInSeconds = prevInterestingValueInSeconds >= currentValueInSeconds
+            ? prevInterestingValueInSeconds - unitDuration
+            : prevInterestingValueInSeconds;
+        var delayInSeconds = Math.abs(nextInterestingValueInSeconds - currentValueInSeconds);
+        if (currentValueInSeconds !== nextInterestingValueInSeconds) {
+            updateTimer = setTimeout(function () { return setCurrentValueInSeconds(nextInterestingValueInSeconds); }, delayInSeconds * 1e3);
+        }
+        return clearUpdateTimer;
+    }, [currentValueInSeconds, updateIntervalInSeconds, unit]);
+    var currentValue = value || 0;
+    var currentUnit = unit;
+    if (canIncrement(unit) &&
+        typeof currentValueInSeconds === 'number' &&
+        updateIntervalInSeconds) {
+        currentUnit = selectUnit(currentValueInSeconds);
+        var unitDuration = getDurationInSeconds(currentUnit);
+        currentValue = Math.round(currentValueInSeconds / unitDuration);
+    }
+    return (React.createElement(SimpleFormattedRelativeTime, __assign({ value: currentValue, unit: currentUnit }, otherProps)));
+};
+FormattedRelativeTime.displayName = 'FormattedRelativeTime';
+FormattedRelativeTime.defaultProps = {
+    value: 0,
+    unit: 'second',
+};
+export default FormattedRelativeTime;

package/lib/src/components/useIntl.d.ts

@@ -0,0 +1,3 @@
+import { IntlShape } from '../types';
+export default function useIntl(): IntlShape;
+//# sourceMappingURL=useIntl.d.ts.map

package/lib/src/components/useIntl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIntl.d.ts","sourceRoot":"","sources":["../../../src/components/useIntl.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,SAAS,EAAC,MAAM,UAAU,CAAA;AAElC,MAAM,CAAC,OAAO,UAAU,OAAO,IAAI,SAAS,CAI3C"}

package/lib/src/components/useIntl.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { Context } from './injectIntl';
+import { invariantIntlContext } from '../utils';
+export default function useIntl() {
+    var intl = React.useContext(Context);
+    invariantIntlContext(intl);
+    return intl;
+}

package/lib/src/types.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { ResolvedIntlConfig as CoreResolvedIntlConfig, IntlFormatters, Formatters } from '@formatjs/intl';
+import { DEFAULT_INTL_CONFIG } from './utils';
+export declare type IntlConfig = Omit<ResolvedIntlConfig, keyof typeof DEFAULT_INTL_CONFIG> & Partial<typeof DEFAULT_INTL_CONFIG>;
+export interface ResolvedIntlConfig extends CoreResolvedIntlConfig<React.ReactNode> {
+    textComponent?: React.ComponentType | keyof React.ReactHTML;
+    wrapRichTextChunksInFragment?: boolean;
+}
+export interface IntlShape extends ResolvedIntlConfig, IntlFormatters<React.ReactNode> {
+    formatters: Formatters;
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EACL,kBAAkB,IAAI,sBAAsB,EAC5C,cAAc,EACd,UAAU,EACX,MAAM,gBAAgB,CAAA;AACvB,OAAO,EAAC,mBAAmB,EAAC,MAAM,SAAS,CAAA;AAC3C,oBAAY,UAAU,GAAG,IAAI,CAC3B,kBAAkB,EAClB,MAAM,OAAO,mBAAmB,CACjC,GACC,OAAO,CAAC,OAAO,mBAAmB,CAAC,CAAA;AAErC,MAAM,WAAW,kBACf,SAAQ,sBAAsB,CAAC,KAAK,CAAC,SAAS,CAAC;IAC/C,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,MAAM,KAAK,CAAC,SAAS,CAAA;IAC3D,4BAA4B,CAAC,EAAE,OAAO,CAAA;CACvC;AAED,MAAM,WAAW,SACf,SAAQ,kBAAkB,EACxB,cAAc,CAAC,KAAK,CAAC,SAAS,CAAC;IACjC,UAAU,EAAE,UAAU,CAAA;CACvB"}

package/lib/src/types.js

@@ -0,0 +1 @@
+export {};

package/lib/src/utils.d.ts

@@ -0,0 +1,14 @@
+import { ResolvedIntlConfig } from './types';
+import * as React from 'react';
+import { FormatXMLElementFn } from 'intl-messageformat';
+export declare function invariantIntlContext(intl?: any): asserts intl;
+export declare const DEFAULT_INTL_CONFIG: Pick<ResolvedIntlConfig, 'fallbackOnEmptyString' | 'formats' | 'messages' | 'timeZone' | 'textComponent' | 'defaultLocale' | 'defaultFormats' | 'onError'>;
+/**
+ * Takes a `formatXMLElementFn`, and composes it in function, which passes
+ * argument `parts` through, assigning unique key to each part, to prevent
+ * "Each child in a list should have a unique "key"" React error.
+ * @param formatXMLElementFn
+ */
+export declare function assignUniqueKeysToParts(formatXMLElementFn: FormatXMLElementFn<React.ReactNode>): FormatXMLElementFn<React.ReactNode>;
+export declare function shallowEqual<T extends Record<string, unknown> = Record<string, unknown>>(objA?: T, objB?: T): boolean;
+//# sourceMappingURL=utils.d.ts.map

package/lib/src/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,kBAAkB,EAAC,MAAM,oBAAoB,CAAA;AAKrD,wBAAgB,oBAAoB,CAAC,IAAI,CAAC,EAAE,GAAG,GAAG,OAAO,CAAC,IAAI,CAM7D;AAED,eAAO,MAAM,mBAAmB,EAAE,IAAI,CACpC,kBAAkB,EAChB,uBAAuB,GACvB,SAAS,GACT,UAAU,GACV,UAAU,GACV,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,SAAS,CAIZ,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,uBAAuB,CACrC,kBAAkB,EAAE,kBAAkB,CAAC,KAAK,CAAC,SAAS,CAAC,GACtD,kBAAkB,CAAC,KAAK,CAAC,SAAS,CAAC,CAKrC;AAED,wBAAgB,YAAY,CAC1B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC3D,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,WA6BnB"}

package/lib/src/utils.js

@@ -0,0 +1,43 @@
+import { __assign } from "tslib";
+import * as React from 'react';
+import { invariant } from '@formatjs/ecma402-abstract';
+import { DEFAULT_INTL_CONFIG as CORE_DEFAULT_INTL_CONFIG } from '@formatjs/intl';
+export function invariantIntlContext(intl) {
+    invariant(intl, '[React Intl] Could not find required `intl` object. ' +
+        '<IntlProvider> needs to exist in the component ancestry.');
+}
+export var DEFAULT_INTL_CONFIG = __assign(__assign({}, CORE_DEFAULT_INTL_CONFIG), { textComponent: React.Fragment });
+/**
+ * Takes a `formatXMLElementFn`, and composes it in function, which passes
+ * argument `parts` through, assigning unique key to each part, to prevent
+ * "Each child in a list should have a unique "key"" React error.
+ * @param formatXMLElementFn
+ */
+export function assignUniqueKeysToParts(formatXMLElementFn) {
+    return function (parts) {
+        // eslint-disable-next-line prefer-rest-params
+        return formatXMLElementFn(React.Children.toArray(parts));
+    };
+}
+export function shallowEqual(objA, objB) {
+    if (objA === objB) {
+        return true;
+    }
+    if (!objA || !objB) {
+        return false;
+    }
+    var aKeys = Object.keys(objA);
+    var bKeys = Object.keys(objB);
+    var len = aKeys.length;
+    if (bKeys.length !== len) {
+        return false;
+    }
+    for (var i = 0; i < len; i++) {
+        var key = aKeys[i];
+        if (objA[key] !== objB[key] ||
+            !Object.prototype.hasOwnProperty.call(objB, key)) {
+            return false;
+        }
+    }
+    return true;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-intl",
-  "version": "6.0.6",
+  "version": "6.1.1",
   "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",
@@ -128,24 +128,24 @@
   "types": "index.d.ts",
   "sideEffects": false,
   "dependencies": {
-    "@formatjs/ecma402-abstract": "1.11.9",
-    "@formatjs/icu-messageformat-parser": "2.1.5",
-    "@formatjs/intl": "2.3.2",
-    "@formatjs/intl-displaynames": "6.1.0",
-    "@formatjs/intl-listformat": "7.1.0",
+    "@formatjs/ecma402-abstract": "1.12.0",
+    "@formatjs/icu-messageformat-parser": "2.1.7",
+    "@formatjs/intl": "2.4.1",
+    "@formatjs/intl-displaynames": "6.1.3",
+    "@formatjs/intl-listformat": "7.1.2",
     "@types/hoist-non-react-statics": "^3.3.1",
     "@types/react": "16 || 17 || 18",
     "hoist-non-react-statics": "^3.3.2",
-    "intl-messageformat": "10.1.2",
+    "intl-messageformat": "10.1.4",
     "tslib": "2.4.0"
   },
   "devDependencies": {
-    "@formatjs/intl-numberformat": "8.1.0",
-    "@formatjs/intl-relativetimeformat": "11.1.0"
+    "@formatjs/intl-numberformat": "8.1.3",
+    "@formatjs/intl-relativetimeformat": "11.1.3"
   },
   "peerDependencies": {
     "react": "^16.6.0 || 17 || 18",
-    "typescript": "^4.5"
+    "typescript": "^4.7"
   },
   "peerDependenciesMeta": {
     "typescript": {