react-intl 6.5.2 → 6.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.js +20 -45
- package/lib/src/components/createFormattedComponent.js +17 -24
- package/lib/src/components/dateTimeRange.js +6 -8
- package/lib/src/components/injectIntl.js +11 -15
- package/lib/src/components/message.js +10 -12
- package/lib/src/components/plural.js +4 -7
- package/lib/src/components/provider.js +22 -26
- package/lib/src/components/relative.js +10 -12
- package/lib/src/components/useIntl.js +6 -10
- package/lib/src/types.js +1 -2
- package/lib/src/utils.js +9 -15
- package/package.json +9 -9
- package/react-intl.iife.js +4395 -12407
package/lib/index.js
CHANGED
|
@@ -1,50 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var provider_1 = tslib_1.__importStar(require("./src/components/provider"));
|
|
13
|
-
exports.IntlProvider = provider_1.default;
|
|
14
|
-
Object.defineProperty(exports, "createIntl", { enumerable: true, get: function () { return provider_1.createIntl; } });
|
|
15
|
-
var relative_1 = tslib_1.__importDefault(require("./src/components/relative"));
|
|
16
|
-
exports.FormattedRelativeTime = relative_1.default;
|
|
17
|
-
var plural_1 = tslib_1.__importDefault(require("./src/components/plural"));
|
|
18
|
-
exports.FormattedPlural = plural_1.default;
|
|
19
|
-
var message_1 = tslib_1.__importDefault(require("./src/components/message"));
|
|
20
|
-
exports.FormattedMessage = message_1.default;
|
|
21
|
-
var dateTimeRange_1 = tslib_1.__importDefault(require("./src/components/dateTimeRange"));
|
|
22
|
-
exports.FormattedDateTimeRange = dateTimeRange_1.default;
|
|
23
|
-
var intl_1 = require("@formatjs/intl");
|
|
24
|
-
Object.defineProperty(exports, "createIntlCache", { enumerable: true, get: function () { return intl_1.createIntlCache; } });
|
|
25
|
-
Object.defineProperty(exports, "UnsupportedFormatterError", { enumerable: true, get: function () { return intl_1.UnsupportedFormatterError; } });
|
|
26
|
-
Object.defineProperty(exports, "InvalidConfigError", { enumerable: true, get: function () { return intl_1.InvalidConfigError; } });
|
|
27
|
-
Object.defineProperty(exports, "MissingDataError", { enumerable: true, get: function () { return intl_1.MissingDataError; } });
|
|
28
|
-
Object.defineProperty(exports, "MessageFormatError", { enumerable: true, get: function () { return intl_1.MessageFormatError; } });
|
|
29
|
-
Object.defineProperty(exports, "MissingTranslationError", { enumerable: true, get: function () { return intl_1.MissingTranslationError; } });
|
|
30
|
-
Object.defineProperty(exports, "ReactIntlErrorCode", { enumerable: true, get: function () { return intl_1.IntlErrorCode; } });
|
|
31
|
-
Object.defineProperty(exports, "ReactIntlError", { enumerable: true, get: function () { return intl_1.IntlError; } });
|
|
32
|
-
function defineMessages(msgs) {
|
|
1
|
+
import { createFormattedComponent, createFormattedDateTimePartsComponent, } from './src/components/createFormattedComponent';
|
|
2
|
+
import injectIntl, { Provider as RawIntlProvider, Context as IntlContext, } from './src/components/injectIntl';
|
|
3
|
+
import useIntl from './src/components/useIntl';
|
|
4
|
+
import IntlProvider, { createIntl } from './src/components/provider';
|
|
5
|
+
import FormattedRelativeTime from './src/components/relative';
|
|
6
|
+
import FormattedPlural from './src/components/plural';
|
|
7
|
+
import FormattedMessage from './src/components/message';
|
|
8
|
+
import FormattedDateTimeRange from './src/components/dateTimeRange';
|
|
9
|
+
export { FormattedDateTimeRange, FormattedMessage, FormattedPlural, FormattedRelativeTime, IntlContext, IntlProvider, RawIntlProvider, createIntl, injectIntl, useIntl, };
|
|
10
|
+
export { createIntlCache, UnsupportedFormatterError, InvalidConfigError, MissingDataError, MessageFormatError, MissingTranslationError, IntlErrorCode as ReactIntlErrorCode, IntlError as ReactIntlError, } from '@formatjs/intl';
|
|
11
|
+
export function defineMessages(msgs) {
|
|
33
12
|
return msgs;
|
|
34
13
|
}
|
|
35
|
-
|
|
36
|
-
function defineMessage(msg) {
|
|
14
|
+
export function defineMessage(msg) {
|
|
37
15
|
return msg;
|
|
38
16
|
}
|
|
39
|
-
exports.defineMessage = defineMessage;
|
|
40
17
|
// IMPORTANT: Explicit here to prevent api-extractor from outputing `import('./src/types').CustomFormatConfig`
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
Object.defineProperty(exports, "FormattedNumberParts", { enumerable: true, get: function () { return createFormattedComponent_2.FormattedNumberParts; } });
|
|
50
|
-
Object.defineProperty(exports, "FormattedListParts", { enumerable: true, get: function () { return createFormattedComponent_2.FormattedListParts; } });
|
|
18
|
+
export var FormattedDate = createFormattedComponent('formatDate');
|
|
19
|
+
export var FormattedTime = createFormattedComponent('formatTime');
|
|
20
|
+
export var FormattedNumber = createFormattedComponent('formatNumber');
|
|
21
|
+
export var FormattedList = createFormattedComponent('formatList');
|
|
22
|
+
export var FormattedDisplayName = createFormattedComponent('formatDisplayName');
|
|
23
|
+
export var FormattedDateParts = createFormattedDateTimePartsComponent('formatDate');
|
|
24
|
+
export var FormattedTimeParts = createFormattedDateTimePartsComponent('formatTime');
|
|
25
|
+
export { FormattedNumberParts, FormattedListParts, } from './src/components/createFormattedComponent';
|
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var React = tslib_1.__importStar(require("react"));
|
|
6
|
-
var useIntl_1 = tslib_1.__importDefault(require("./useIntl"));
|
|
1
|
+
import { __rest } from "tslib";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import useIntl from './useIntl';
|
|
7
4
|
var DisplayName;
|
|
8
5
|
(function (DisplayName) {
|
|
9
6
|
DisplayName["formatDate"] = "FormattedDate";
|
|
@@ -21,24 +18,22 @@ var DisplayNameParts;
|
|
|
21
18
|
DisplayNameParts["formatNumber"] = "FormattedNumberParts";
|
|
22
19
|
DisplayNameParts["formatList"] = "FormattedListParts";
|
|
23
20
|
})(DisplayNameParts || (DisplayNameParts = {}));
|
|
24
|
-
var FormattedNumberParts = function (props) {
|
|
25
|
-
var intl = (
|
|
26
|
-
var value = props.value, children = props.children, formatProps =
|
|
21
|
+
export var FormattedNumberParts = function (props) {
|
|
22
|
+
var intl = useIntl();
|
|
23
|
+
var value = props.value, children = props.children, formatProps = __rest(props, ["value", "children"]);
|
|
27
24
|
return children(intl.formatNumberToParts(value, formatProps));
|
|
28
25
|
};
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
var
|
|
32
|
-
var
|
|
33
|
-
var value = props.value, children = props.children, formatProps = tslib_1.__rest(props, ["value", "children"]);
|
|
26
|
+
FormattedNumberParts.displayName = 'FormattedNumberParts';
|
|
27
|
+
export var FormattedListParts = function (props) {
|
|
28
|
+
var intl = useIntl();
|
|
29
|
+
var value = props.value, children = props.children, formatProps = __rest(props, ["value", "children"]);
|
|
34
30
|
return children(intl.formatListToParts(value, formatProps));
|
|
35
31
|
};
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
function createFormattedDateTimePartsComponent(name) {
|
|
32
|
+
FormattedNumberParts.displayName = 'FormattedNumberParts';
|
|
33
|
+
export function createFormattedDateTimePartsComponent(name) {
|
|
39
34
|
var ComponentParts = function (props) {
|
|
40
|
-
var intl = (
|
|
41
|
-
var value = props.value, children = props.children, formatProps =
|
|
35
|
+
var intl = useIntl();
|
|
36
|
+
var value = props.value, children = props.children, formatProps = __rest(props, ["value", "children"]);
|
|
42
37
|
var date = typeof value === 'string' ? new Date(value || 0) : value;
|
|
43
38
|
var formattedParts = name === 'formatDate'
|
|
44
39
|
? intl.formatDateToParts(date, formatProps)
|
|
@@ -48,11 +43,10 @@ function createFormattedDateTimePartsComponent(name) {
|
|
|
48
43
|
ComponentParts.displayName = DisplayNameParts[name];
|
|
49
44
|
return ComponentParts;
|
|
50
45
|
}
|
|
51
|
-
|
|
52
|
-
function createFormattedComponent(name) {
|
|
46
|
+
export function createFormattedComponent(name) {
|
|
53
47
|
var Component = function (props) {
|
|
54
|
-
var intl = (
|
|
55
|
-
var value = props.value, children = props.children, formatProps =
|
|
48
|
+
var intl = useIntl();
|
|
49
|
+
var value = props.value, children = props.children, formatProps = __rest(props
|
|
56
50
|
// TODO: fix TS type definition for localeMatcher upstream
|
|
57
51
|
, ["value", "children"]);
|
|
58
52
|
// TODO: fix TS type definition for localeMatcher upstream
|
|
@@ -66,4 +60,3 @@ function createFormattedComponent(name) {
|
|
|
66
60
|
Component.displayName = DisplayName[name];
|
|
67
61
|
return Component;
|
|
68
62
|
}
|
|
69
|
-
exports.createFormattedComponent = createFormattedComponent;
|
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var React = tslib_1.__importStar(require("react"));
|
|
5
|
-
var useIntl_1 = tslib_1.__importDefault(require("./useIntl"));
|
|
1
|
+
import { __rest } from "tslib";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import useIntl from './useIntl';
|
|
6
4
|
var FormattedDateTimeRange = function (props) {
|
|
7
|
-
var intl = (
|
|
8
|
-
var from = props.from, to = props.to, children = props.children, formatProps =
|
|
5
|
+
var intl = useIntl();
|
|
6
|
+
var from = props.from, to = props.to, children = props.children, formatProps = __rest(props, ["from", "to", "children"]);
|
|
9
7
|
var formattedValue = intl.formatDateTimeRange(from, to, formatProps);
|
|
10
8
|
if (typeof children === 'function') {
|
|
11
9
|
return children(formattedValue);
|
|
@@ -14,4 +12,4 @@ var FormattedDateTimeRange = function (props) {
|
|
|
14
12
|
return React.createElement(Text, null, formattedValue);
|
|
15
13
|
};
|
|
16
14
|
FormattedDateTimeRange.displayName = 'FormattedDateTimeRange';
|
|
17
|
-
|
|
15
|
+
export default FormattedDateTimeRange;
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var React = tslib_1.__importStar(require("react"));
|
|
6
|
-
var hoist_non_react_statics_1 = tslib_1.__importDefault(require("hoist-non-react-statics"));
|
|
7
|
-
var utils_1 = require("../utils");
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import hoistNonReactStatics from 'hoist-non-react-statics';
|
|
4
|
+
import { invariantIntlContext } from '../utils';
|
|
8
5
|
function getDisplayName(Component) {
|
|
9
6
|
return Component.displayName || Component.name || 'Component';
|
|
10
7
|
}
|
|
@@ -15,23 +12,22 @@ var IntlContext = typeof window !== 'undefined' && !window.__REACT_INTL_BYPASS_G
|
|
|
15
12
|
(window.__REACT_INTL_CONTEXT__ = React.createContext(null))
|
|
16
13
|
: React.createContext(null);
|
|
17
14
|
var IntlConsumer = IntlContext.Consumer, IntlProvider = IntlContext.Provider;
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
function injectIntl(WrappedComponent, options) {
|
|
15
|
+
export var Provider = IntlProvider;
|
|
16
|
+
export var Context = IntlContext;
|
|
17
|
+
export default function injectIntl(WrappedComponent, options) {
|
|
21
18
|
var _a = options || {}, _b = _a.intlPropName, intlPropName = _b === void 0 ? 'intl' : _b, _c = _a.forwardRef, forwardRef = _c === void 0 ? false : _c, _d = _a.enforceContext, enforceContext = _d === void 0 ? true : _d;
|
|
22
19
|
var WithIntl = function (props) { return (React.createElement(IntlConsumer, null, function (intl) {
|
|
23
20
|
var _a;
|
|
24
21
|
if (enforceContext) {
|
|
25
|
-
|
|
22
|
+
invariantIntlContext(intl);
|
|
26
23
|
}
|
|
27
24
|
var intlProp = (_a = {}, _a[intlPropName] = intl, _a);
|
|
28
|
-
return (React.createElement(WrappedComponent,
|
|
25
|
+
return (React.createElement(WrappedComponent, __assign({}, props, intlProp, { ref: forwardRef ? props.forwardedRef : null })));
|
|
29
26
|
})); };
|
|
30
27
|
WithIntl.displayName = "injectIntl(".concat(getDisplayName(WrappedComponent), ")");
|
|
31
28
|
WithIntl.WrappedComponent = WrappedComponent;
|
|
32
29
|
if (forwardRef) {
|
|
33
|
-
return (
|
|
30
|
+
return hoistNonReactStatics(React.forwardRef(function (props, ref) { return (React.createElement(WithIntl, __assign({}, props, { forwardedRef: ref }))); }), WrappedComponent);
|
|
34
31
|
}
|
|
35
|
-
return (
|
|
32
|
+
return hoistNonReactStatics(WithIntl, WrappedComponent);
|
|
36
33
|
}
|
|
37
|
-
exports.default = injectIntl;
|
|
@@ -1,22 +1,20 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/*
|
|
3
2
|
* Copyright 2015, Yahoo Inc.
|
|
4
3
|
* Copyrights licensed under the New BSD License.
|
|
5
4
|
* See the accompanying LICENSE file for terms.
|
|
6
5
|
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
var utils_1 = require("../utils");
|
|
6
|
+
import { __rest } from "tslib";
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import useIntl from './useIntl';
|
|
9
|
+
import { shallowEqual } from '../utils';
|
|
12
10
|
function areEqual(prevProps, nextProps) {
|
|
13
|
-
var values = prevProps.values, otherProps =
|
|
14
|
-
var nextValues = nextProps.values, nextOtherProps =
|
|
15
|
-
return (
|
|
16
|
-
|
|
11
|
+
var values = prevProps.values, otherProps = __rest(prevProps, ["values"]);
|
|
12
|
+
var nextValues = nextProps.values, nextOtherProps = __rest(nextProps, ["values"]);
|
|
13
|
+
return (shallowEqual(nextValues, values) &&
|
|
14
|
+
shallowEqual(otherProps, nextOtherProps));
|
|
17
15
|
}
|
|
18
16
|
function FormattedMessage(props) {
|
|
19
|
-
var intl = (
|
|
17
|
+
var intl = useIntl();
|
|
20
18
|
var formatMessage = intl.formatMessage, _a = intl.textComponent, Text = _a === void 0 ? React.Fragment : _a;
|
|
21
19
|
var id = props.id, description = props.description, defaultMessage = props.defaultMessage, values = props.values, children = props.children, _b = props.tagName, Component = _b === void 0 ? Text : _b, ignoreTag = props.ignoreTag;
|
|
22
20
|
var descriptor = { id: id, description: description, defaultMessage: defaultMessage };
|
|
@@ -34,4 +32,4 @@ function FormattedMessage(props) {
|
|
|
34
32
|
FormattedMessage.displayName = 'FormattedMessage';
|
|
35
33
|
var MemoizedFormattedMessage = React.memo(FormattedMessage, areEqual);
|
|
36
34
|
MemoizedFormattedMessage.displayName = 'MemoizedFormattedMessage';
|
|
37
|
-
|
|
35
|
+
export default MemoizedFormattedMessage;
|
|
@@ -1,15 +1,12 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/*
|
|
3
2
|
* Copyright 2015, Yahoo Inc.
|
|
4
3
|
* Copyrights licensed under the New BSD License.
|
|
5
4
|
* See the accompanying LICENSE file for terms.
|
|
6
5
|
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
var React = tslib_1.__importStar(require("react"));
|
|
10
|
-
var useIntl_1 = tslib_1.__importDefault(require("./useIntl"));
|
|
6
|
+
import * as React from 'react';
|
|
7
|
+
import useIntl from './useIntl';
|
|
11
8
|
var FormattedPlural = function (props) {
|
|
12
|
-
var _a = (
|
|
9
|
+
var _a = useIntl(), formatPlural = _a.formatPlural, Text = _a.textComponent;
|
|
13
10
|
var value = props.value, other = props.other, children = props.children;
|
|
14
11
|
var pluralCategory = formatPlural(value, props);
|
|
15
12
|
var formattedPlural = props[pluralCategory] || other;
|
|
@@ -26,4 +23,4 @@ FormattedPlural.defaultProps = {
|
|
|
26
23
|
type: 'cardinal',
|
|
27
24
|
};
|
|
28
25
|
FormattedPlural.displayName = 'FormattedPlural';
|
|
29
|
-
|
|
26
|
+
export default FormattedPlural;
|
|
@@ -1,17 +1,14 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/*
|
|
3
2
|
* Copyright 2015, Yahoo Inc.
|
|
4
3
|
* Copyrights licensed under the New BSD License.
|
|
5
4
|
* See the accompanying LICENSE file for terms.
|
|
6
5
|
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
var injectIntl_1 = require("./injectIntl");
|
|
14
|
-
var intl_messageformat_1 = require("intl-messageformat");
|
|
6
|
+
import { __assign, __extends, __rest, __spreadArray } from "tslib";
|
|
7
|
+
import { createIntl as coreCreateIntl, formatMessage as coreFormatMessage, createIntlCache, } from '@formatjs/intl';
|
|
8
|
+
import * as React from 'react';
|
|
9
|
+
import { DEFAULT_INTL_CONFIG, assignUniqueKeysToParts, invariantIntlContext, shallowEqual, } from '../utils';
|
|
10
|
+
import { Provider } from './injectIntl';
|
|
11
|
+
import { isFormatXMLElementFn, } from 'intl-messageformat';
|
|
15
12
|
function processIntlConfig(config) {
|
|
16
13
|
return {
|
|
17
14
|
locale: config.locale,
|
|
@@ -34,8 +31,8 @@ function assignUniqueKeysToFormatXMLElementFnArgument(values) {
|
|
|
34
31
|
}
|
|
35
32
|
return Object.keys(values).reduce(function (acc, k) {
|
|
36
33
|
var v = values[k];
|
|
37
|
-
acc[k] =
|
|
38
|
-
?
|
|
34
|
+
acc[k] = isFormatXMLElementFn(v)
|
|
35
|
+
? assignUniqueKeysToParts(v)
|
|
39
36
|
: v;
|
|
40
37
|
return acc;
|
|
41
38
|
}, {});
|
|
@@ -46,7 +43,7 @@ var formatMessage = function (config, formatters, descriptor, rawValues) {
|
|
|
46
43
|
rest[_i - 4] = arguments[_i];
|
|
47
44
|
}
|
|
48
45
|
var values = assignUniqueKeysToFormatXMLElementFnArgument(rawValues);
|
|
49
|
-
var chunks =
|
|
46
|
+
var chunks = coreFormatMessage.apply(void 0, __spreadArray([config,
|
|
50
47
|
formatters,
|
|
51
48
|
descriptor,
|
|
52
49
|
values], rest, false));
|
|
@@ -60,10 +57,10 @@ var formatMessage = function (config, formatters, descriptor, rawValues) {
|
|
|
60
57
|
* @param config intl config
|
|
61
58
|
* @param cache cache for formatter instances to prevent memory leak
|
|
62
59
|
*/
|
|
63
|
-
var createIntl = function (_a, cache) {
|
|
64
|
-
var rawDefaultRichTextElements = _a.defaultRichTextElements, config =
|
|
60
|
+
export var createIntl = function (_a, cache) {
|
|
61
|
+
var rawDefaultRichTextElements = _a.defaultRichTextElements, config = __rest(_a, ["defaultRichTextElements"]);
|
|
65
62
|
var defaultRichTextElements = assignUniqueKeysToFormatXMLElementFnArgument(rawDefaultRichTextElements);
|
|
66
|
-
var coreIntl = (
|
|
63
|
+
var coreIntl = coreCreateIntl(__assign(__assign(__assign({}, DEFAULT_INTL_CONFIG), config), { defaultRichTextElements: defaultRichTextElements }), cache);
|
|
67
64
|
var resolvedConfig = {
|
|
68
65
|
locale: coreIntl.locale,
|
|
69
66
|
timeZone: coreIntl.timeZone,
|
|
@@ -75,21 +72,20 @@ var createIntl = function (_a, cache) {
|
|
|
75
72
|
onError: coreIntl.onError,
|
|
76
73
|
defaultRichTextElements: defaultRichTextElements,
|
|
77
74
|
};
|
|
78
|
-
return
|
|
75
|
+
return __assign(__assign({}, coreIntl), { formatMessage: formatMessage.bind(null, resolvedConfig,
|
|
79
76
|
// @ts-expect-error fix this
|
|
80
77
|
coreIntl.formatters),
|
|
81
78
|
// @ts-expect-error fix this
|
|
82
79
|
$t: formatMessage.bind(null, resolvedConfig, coreIntl.formatters) });
|
|
83
80
|
};
|
|
84
|
-
exports.createIntl = createIntl;
|
|
85
81
|
var IntlProvider = /** @class */ (function (_super) {
|
|
86
|
-
|
|
82
|
+
__extends(IntlProvider, _super);
|
|
87
83
|
function IntlProvider() {
|
|
88
84
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
89
|
-
_this.cache =
|
|
85
|
+
_this.cache = createIntlCache();
|
|
90
86
|
_this.state = {
|
|
91
87
|
cache: _this.cache,
|
|
92
|
-
intl:
|
|
88
|
+
intl: createIntl(processIntlConfig(_this.props), _this.cache),
|
|
93
89
|
prevConfig: processIntlConfig(_this.props),
|
|
94
90
|
};
|
|
95
91
|
return _this;
|
|
@@ -97,20 +93,20 @@ var IntlProvider = /** @class */ (function (_super) {
|
|
|
97
93
|
IntlProvider.getDerivedStateFromProps = function (props, _a) {
|
|
98
94
|
var prevConfig = _a.prevConfig, cache = _a.cache;
|
|
99
95
|
var config = processIntlConfig(props);
|
|
100
|
-
if (!
|
|
96
|
+
if (!shallowEqual(prevConfig, config)) {
|
|
101
97
|
return {
|
|
102
|
-
intl:
|
|
98
|
+
intl: createIntl(config, cache),
|
|
103
99
|
prevConfig: config,
|
|
104
100
|
};
|
|
105
101
|
}
|
|
106
102
|
return null;
|
|
107
103
|
};
|
|
108
104
|
IntlProvider.prototype.render = function () {
|
|
109
|
-
|
|
110
|
-
return React.createElement(
|
|
105
|
+
invariantIntlContext(this.state.intl);
|
|
106
|
+
return React.createElement(Provider, { value: this.state.intl }, this.props.children);
|
|
111
107
|
};
|
|
112
108
|
IntlProvider.displayName = 'IntlProvider';
|
|
113
|
-
IntlProvider.defaultProps =
|
|
109
|
+
IntlProvider.defaultProps = DEFAULT_INTL_CONFIG;
|
|
114
110
|
return IntlProvider;
|
|
115
111
|
}(React.PureComponent));
|
|
116
|
-
|
|
112
|
+
export default IntlProvider;
|
|
@@ -1,14 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
var tslib_1 = require("tslib");
|
|
1
|
+
import { __assign, __rest } from "tslib";
|
|
4
2
|
/*
|
|
5
3
|
* Copyright 2015, Yahoo Inc.
|
|
6
4
|
* Copyrights licensed under the New BSD License.
|
|
7
5
|
* See the accompanying LICENSE file for terms.
|
|
8
6
|
*/
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { invariant, } from '@formatjs/ecma402-abstract';
|
|
9
|
+
import useIntl from './useIntl';
|
|
12
10
|
var MINUTE = 60;
|
|
13
11
|
var HOUR = 60 * 60;
|
|
14
12
|
var DAY = 60 * 60 * 24;
|
|
@@ -60,8 +58,8 @@ function canIncrement(unit) {
|
|
|
60
58
|
return INCREMENTABLE_UNITS.indexOf(unit) > -1;
|
|
61
59
|
}
|
|
62
60
|
var SimpleFormattedRelativeTime = function (props) {
|
|
63
|
-
var _a = (
|
|
64
|
-
var children = props.children, value = props.value, unit = props.unit, otherProps =
|
|
61
|
+
var _a = useIntl(), formatRelativeTime = _a.formatRelativeTime, Text = _a.textComponent;
|
|
62
|
+
var children = props.children, value = props.value, unit = props.unit, otherProps = __rest(props, ["children", "value", "unit"]);
|
|
65
63
|
var formattedRelativeTime = formatRelativeTime(value || 0, unit, otherProps);
|
|
66
64
|
if (typeof children === 'function') {
|
|
67
65
|
return children(formattedRelativeTime);
|
|
@@ -72,8 +70,8 @@ var SimpleFormattedRelativeTime = function (props) {
|
|
|
72
70
|
return React.createElement(React.Fragment, null, formattedRelativeTime);
|
|
73
71
|
};
|
|
74
72
|
var FormattedRelativeTime = function (_a) {
|
|
75
|
-
var value = _a.value, unit = _a.unit, updateIntervalInSeconds = _a.updateIntervalInSeconds, otherProps =
|
|
76
|
-
|
|
73
|
+
var value = _a.value, unit = _a.unit, updateIntervalInSeconds = _a.updateIntervalInSeconds, otherProps = __rest(_a, ["value", "unit", "updateIntervalInSeconds"]);
|
|
74
|
+
invariant(!updateIntervalInSeconds ||
|
|
77
75
|
!!(updateIntervalInSeconds && canIncrement(unit)), 'Cannot schedule update with unit longer than hour');
|
|
78
76
|
var _b = React.useState(), prevUnit = _b[0], setPrevUnit = _b[1];
|
|
79
77
|
var _c = React.useState(0), prevValue = _c[0], setPrevValue = _c[1];
|
|
@@ -121,11 +119,11 @@ var FormattedRelativeTime = function (_a) {
|
|
|
121
119
|
var unitDuration = getDurationInSeconds(currentUnit);
|
|
122
120
|
currentValue = Math.round(currentValueInSeconds / unitDuration);
|
|
123
121
|
}
|
|
124
|
-
return (React.createElement(SimpleFormattedRelativeTime,
|
|
122
|
+
return (React.createElement(SimpleFormattedRelativeTime, __assign({ value: currentValue, unit: currentUnit }, otherProps)));
|
|
125
123
|
};
|
|
126
124
|
FormattedRelativeTime.displayName = 'FormattedRelativeTime';
|
|
127
125
|
FormattedRelativeTime.defaultProps = {
|
|
128
126
|
value: 0,
|
|
129
127
|
unit: 'second',
|
|
130
128
|
};
|
|
131
|
-
|
|
129
|
+
export default FormattedRelativeTime;
|
|
@@ -1,12 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
function useIntl() {
|
|
8
|
-
var intl = React.useContext(injectIntl_1.Context);
|
|
9
|
-
(0, utils_1.invariantIntlContext)(intl);
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Context } from './injectIntl';
|
|
3
|
+
import { invariantIntlContext } from '../utils';
|
|
4
|
+
export default function useIntl() {
|
|
5
|
+
var intl = React.useContext(Context);
|
|
6
|
+
invariantIntlContext(intl);
|
|
10
7
|
return intl;
|
|
11
8
|
}
|
|
12
|
-
exports.default = useIntl;
|
package/lib/src/types.js
CHANGED
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
1
|
+
export {};
|
package/lib/src/utils.js
CHANGED
|
@@ -1,30 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var intl_1 = require("@formatjs/intl");
|
|
8
|
-
function invariantIntlContext(intl) {
|
|
9
|
-
(0, ecma402_abstract_1.invariant)(intl, '[React Intl] Could not find required `intl` object. ' +
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { invariant } from '@formatjs/ecma402-abstract';
|
|
4
|
+
import { DEFAULT_INTL_CONFIG as CORE_DEFAULT_INTL_CONFIG } from '@formatjs/intl';
|
|
5
|
+
export function invariantIntlContext(intl) {
|
|
6
|
+
invariant(intl, '[React Intl] Could not find required `intl` object. ' +
|
|
10
7
|
'<IntlProvider> needs to exist in the component ancestry.');
|
|
11
8
|
}
|
|
12
|
-
|
|
13
|
-
exports.DEFAULT_INTL_CONFIG = tslib_1.__assign(tslib_1.__assign({}, intl_1.DEFAULT_INTL_CONFIG), { textComponent: React.Fragment });
|
|
9
|
+
export var DEFAULT_INTL_CONFIG = __assign(__assign({}, CORE_DEFAULT_INTL_CONFIG), { textComponent: React.Fragment });
|
|
14
10
|
/**
|
|
15
11
|
* Takes a `formatXMLElementFn`, and composes it in function, which passes
|
|
16
12
|
* argument `parts` through, assigning unique key to each part, to prevent
|
|
17
13
|
* "Each child in a list should have a unique "key"" React error.
|
|
18
14
|
* @param formatXMLElementFn
|
|
19
15
|
*/
|
|
20
|
-
function assignUniqueKeysToParts(formatXMLElementFn) {
|
|
16
|
+
export function assignUniqueKeysToParts(formatXMLElementFn) {
|
|
21
17
|
return function (parts) {
|
|
22
18
|
// eslint-disable-next-line prefer-rest-params
|
|
23
19
|
return formatXMLElementFn(React.Children.toArray(parts));
|
|
24
20
|
};
|
|
25
21
|
}
|
|
26
|
-
|
|
27
|
-
function shallowEqual(objA, objB) {
|
|
22
|
+
export function shallowEqual(objA, objB) {
|
|
28
23
|
if (objA === objB) {
|
|
29
24
|
return true;
|
|
30
25
|
}
|
|
@@ -46,4 +41,3 @@ function shallowEqual(objA, objB) {
|
|
|
46
41
|
}
|
|
47
42
|
return true;
|
|
48
43
|
}
|
|
49
|
-
exports.shallowEqual = shallowEqual;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-intl",
|
|
3
|
-
"version": "6.5.
|
|
3
|
+
"version": "6.5.4",
|
|
4
4
|
"description": "Internationalize React apps. This library provides React components and an API to format dates, numbers, and strings, including pluralization and handling translations.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"intl",
|
|
@@ -132,16 +132,16 @@
|
|
|
132
132
|
"@types/react": "16 || 17 || 18",
|
|
133
133
|
"hoist-non-react-statics": "^3.3.2",
|
|
134
134
|
"tslib": "^2.4.0",
|
|
135
|
-
"@formatjs/
|
|
136
|
-
"@formatjs/
|
|
137
|
-
"@formatjs/
|
|
138
|
-
"@formatjs/
|
|
139
|
-
"@formatjs/intl-listformat": "7.5.
|
|
140
|
-
"intl-messageformat": "10.5.
|
|
135
|
+
"@formatjs/intl-displaynames": "6.6.3",
|
|
136
|
+
"@formatjs/intl": "2.9.8",
|
|
137
|
+
"@formatjs/icu-messageformat-parser": "2.7.2",
|
|
138
|
+
"@formatjs/ecma402-abstract": "1.17.4",
|
|
139
|
+
"@formatjs/intl-listformat": "7.5.2",
|
|
140
|
+
"intl-messageformat": "10.5.7"
|
|
141
141
|
},
|
|
142
142
|
"devDependencies": {
|
|
143
|
-
"@formatjs/intl-numberformat": "8.8.
|
|
144
|
-
"@formatjs/intl-relativetimeformat": "11.2.
|
|
143
|
+
"@formatjs/intl-numberformat": "8.8.2",
|
|
144
|
+
"@formatjs/intl-relativetimeformat": "11.2.9"
|
|
145
145
|
},
|
|
146
146
|
"peerDependencies": {
|
|
147
147
|
"react": "^16.6.0 || 17 || 18",
|