use-intl 2.7.7-alpha.0 → 2.8.0
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/dist/core/IntlConfiguration.d.ts +46 -0
- package/dist/core/createBaseTranslator.d.ts +3 -11
- package/dist/core/createTranslator.d.ts +3 -2
- package/dist/core/createTranslatorImpl.d.ts +4 -11
- package/dist/core/defaults.d.ts +11 -0
- package/dist/core/use-intl.esm.js +41 -31
- package/dist/core/use-intl.esm.js.map +1 -1
- package/dist/core/use-intl.esm2.js +38 -41
- package/dist/core/use-intl.esm2.js.map +1 -1
- package/dist/core/use-intl.esm3.js +1 -1
- package/dist/core/use-intl.esm3.js.map +1 -1
- package/dist/core/use-intl.esm4.js +6 -8
- package/dist/core/use-intl.esm4.js.map +1 -1
- package/dist/core/use-intl.esm5.js +6 -4
- package/dist/core/use-intl.esm5.js.map +1 -1
- package/dist/core/use-intl.esm6.js +1 -1
- package/dist/core/use-intl.esm7.js +2 -2
- package/dist/core/use-intl.esm7.js.map +1 -1
- package/dist/react/IntlProvider.d.ts +5 -36
- package/dist/react/use-intl.esm.js +30 -19
- package/dist/react/use-intl.esm.js.map +1 -1
- package/dist/react/use-intl.esm2.js +2 -2
- package/dist/react/use-intl.esm3.js +21 -4
- package/dist/react/use-intl.esm3.js.map +1 -1
- package/dist/react/use-intl.esm4.js +4 -46
- package/dist/react/use-intl.esm4.js.map +1 -1
- package/dist/react/use-intl.esm5.js +4 -32
- package/dist/react/use-intl.esm5.js.map +1 -1
- package/dist/react/use-intl.esm6.js +46 -4
- package/dist/react/use-intl.esm6.js.map +1 -1
- package/dist/react/use-intl.esm7.js +3 -12
- package/dist/react/use-intl.esm7.js.map +1 -1
- package/dist/react/use-intl.esm8.js +9 -38
- package/dist/react/use-intl.esm8.js.map +1 -1
- package/dist/react/use-intl.esm9.js +41 -3
- package/dist/react/use-intl.esm9.js.map +1 -1
- package/dist/use-intl.cjs.development.js +26 -19
- package/dist/use-intl.cjs.development.js.map +1 -1
- package/dist/use-intl.cjs.production.min.js +1 -1
- package/dist/use-intl.cjs.production.min.js.map +1 -1
- package/dist/use-intl.esm.js +7 -7
- package/package.json +2 -2
- package/src/core/IntlConfiguration.tsx +50 -0
- package/src/core/TranslationValues.tsx +3 -0
- package/src/core/createBaseTranslator.tsx +8 -15
- package/src/core/createIntl.tsx +1 -1
- package/src/core/createTranslator.tsx +7 -5
- package/src/core/createTranslatorImpl.tsx +10 -20
- package/src/core/defaults.tsx +18 -0
- package/src/react/IntlProvider.tsx +6 -37
- package/dist/core/config.d.ts +0 -6
- package/src/core/config.tsx +0 -15
package/dist/use-intl.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
export { default as IntlError, IntlErrorCode } from './core/use-intl.
|
|
2
|
-
export { default as createTranslator } from './core/use-intl.
|
|
1
|
+
export { default as IntlError, IntlErrorCode } from './core/use-intl.esm.js';
|
|
2
|
+
export { default as createTranslator } from './core/use-intl.esm2.js';
|
|
3
3
|
export { default as createIntl } from './core/use-intl.esm3.js';
|
|
4
|
-
export { default as IntlProvider } from './react/use-intl.
|
|
4
|
+
export { default as IntlProvider } from './react/use-intl.esm.js';
|
|
5
5
|
export { default as useTranslations } from './react/use-intl.esm2.js';
|
|
6
|
-
export { default as useIntl } from './react/use-intl.
|
|
7
|
-
export { default as useLocale } from './react/use-intl.
|
|
8
|
-
export { default as useNow } from './react/use-intl.
|
|
9
|
-
export { default as useTimeZone } from './react/use-intl.
|
|
6
|
+
export { default as useIntl } from './react/use-intl.esm3.js';
|
|
7
|
+
export { default as useLocale } from './react/use-intl.esm4.js';
|
|
8
|
+
export { default as useNow } from './react/use-intl.esm6.js';
|
|
9
|
+
export { default as useTimeZone } from './react/use-intl.esm5.js';
|
|
10
10
|
//# sourceMappingURL=use-intl.esm.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "use-intl",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.8.0",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"author": "Jan Amann <jan@amann.me>",
|
|
6
6
|
"description": "Minimal, but complete solution for managing internationalization in React apps.",
|
|
@@ -60,5 +60,5 @@
|
|
|
60
60
|
"engines": {
|
|
61
61
|
"node": ">=10"
|
|
62
62
|
},
|
|
63
|
-
"gitHead": "
|
|
63
|
+
"gitHead": "a924207b28e11578f7a16f90c3f2ee3dae995d82"
|
|
64
64
|
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import Formats from './Formats';
|
|
2
|
+
import IntlError from './IntlError';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Should be used for entry points that configure the library.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
type IntlConfiguration = {
|
|
9
|
+
/** A valid Unicode locale tag (e.g. "en" or "en-GB"). */
|
|
10
|
+
locale: string;
|
|
11
|
+
/** Global formats can be provided to achieve consistent
|
|
12
|
+
* formatting across components. */
|
|
13
|
+
formats?: Partial<Formats>;
|
|
14
|
+
/** A time zone as defined in [the tz database](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) which will be applied when formatting dates and times. If this is absent, the user time zone will be used. You can override this by supplying an explicit time zone to `formatDateTime`. */
|
|
15
|
+
timeZone?: string;
|
|
16
|
+
/** This callback will be invoked when an error is encountered during
|
|
17
|
+
* resolving a message or formatting it. This defaults to `console.error` to
|
|
18
|
+
* keep your app running. You can customize the handling by taking
|
|
19
|
+
* `error.code` into account. */
|
|
20
|
+
onError?(error: IntlError): void;
|
|
21
|
+
/** Will be called when a message couldn't be resolved or formatting it led to
|
|
22
|
+
* an error. This defaults to `${namespace}.${key}` You can use this to
|
|
23
|
+
* customize what will be rendered in this case. */
|
|
24
|
+
getMessageFallback?(info: {
|
|
25
|
+
error: IntlError;
|
|
26
|
+
key: string;
|
|
27
|
+
namespace?: string;
|
|
28
|
+
}): string;
|
|
29
|
+
/**
|
|
30
|
+
* Providing this value will have two effects:
|
|
31
|
+
* 1. It will be used as the default for the `now` argument of
|
|
32
|
+
* `useIntl().formatRelativeTime` if no explicit value is provided.
|
|
33
|
+
* 2. It will be returned as a static value from the `useNow` hook. Note
|
|
34
|
+
* however that when `updateInterval` is configured on the `useNow` hook,
|
|
35
|
+
* the global `now` value will only be used for the initial render, but
|
|
36
|
+
* afterwards the current date will be returned continuously.
|
|
37
|
+
*/
|
|
38
|
+
now?: Date;
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
/**
|
|
42
|
+
* A stricter set of the configuration that should be used internally
|
|
43
|
+
* once defaults are assigned to `IntlConfiguration`.
|
|
44
|
+
*/
|
|
45
|
+
export type InitializedIntlConfiguration = IntlConfiguration & {
|
|
46
|
+
onError: NonNullable<IntlConfiguration['onError']>;
|
|
47
|
+
getMessageFallback: NonNullable<IntlConfiguration['getMessageFallback']>;
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
export default IntlConfiguration;
|
|
@@ -11,6 +11,9 @@ export type TranslationValue =
|
|
|
11
11
|
|
|
12
12
|
type TranslationValues = Record<string, TranslationValue>;
|
|
13
13
|
|
|
14
|
+
// We could consider renaming this to `ReactRichTranslationValues` and defining
|
|
15
|
+
// it in the `react` namespace if the core becomes useful to other frameworks.
|
|
16
|
+
// It would be a breaking change though, so let's wait for now.
|
|
14
17
|
export type RichTranslationValues = Record<
|
|
15
18
|
string,
|
|
16
19
|
TranslationValue | ((chunks: ReactNode) => ReactNode)
|
|
@@ -8,10 +8,11 @@ import {
|
|
|
8
8
|
} from 'react';
|
|
9
9
|
import AbstractIntlMessages from './AbstractIntlMessages';
|
|
10
10
|
import Formats from './Formats';
|
|
11
|
+
import {InitializedIntlConfiguration} from './IntlConfiguration';
|
|
11
12
|
import IntlError, {IntlErrorCode} from './IntlError';
|
|
12
13
|
import TranslationValues, {RichTranslationValues} from './TranslationValues';
|
|
13
|
-
import {defaultGetMessageFallback, defaultOnError} from './config';
|
|
14
14
|
import convertFormatsToIntlMessageFormat from './convertFormatsToIntlMessageFormat';
|
|
15
|
+
import {defaultGetMessageFallback, defaultOnError} from './defaults';
|
|
15
16
|
import MessageKeys from './utils/MessageKeys';
|
|
16
17
|
import NestedKeyOf from './utils/NestedKeyOf';
|
|
17
18
|
import NestedValueOf from './utils/NestedValueOf';
|
|
@@ -115,21 +116,13 @@ export function getMessagesOrError<Messages extends AbstractIntlMessages>({
|
|
|
115
116
|
}
|
|
116
117
|
}
|
|
117
118
|
|
|
118
|
-
export type CreateBaseTranslatorProps<Messages> =
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
getMessageFallback?(info: {
|
|
123
|
-
error: IntlError;
|
|
124
|
-
key: string;
|
|
119
|
+
export type CreateBaseTranslatorProps<Messages> =
|
|
120
|
+
InitializedIntlConfiguration & {
|
|
121
|
+
cachedFormatsByLocale?: Record<string, Record<string, IntlMessageFormat>>;
|
|
122
|
+
defaultTranslationValues?: RichTranslationValues;
|
|
125
123
|
namespace?: string;
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
messagesOrError: Messages | IntlError;
|
|
129
|
-
namespace?: string;
|
|
130
|
-
onError(error: IntlError): void;
|
|
131
|
-
timeZone?: string;
|
|
132
|
-
};
|
|
124
|
+
messagesOrError: Messages | IntlError;
|
|
125
|
+
};
|
|
133
126
|
|
|
134
127
|
export default function createBaseTranslator<
|
|
135
128
|
Messages extends AbstractIntlMessages,
|
package/src/core/createIntl.tsx
CHANGED
|
@@ -2,7 +2,7 @@ import DateTimeFormatOptions from './DateTimeFormatOptions';
|
|
|
2
2
|
import Formats from './Formats';
|
|
3
3
|
import IntlError, {IntlErrorCode} from './IntlError';
|
|
4
4
|
import NumberFormatOptions from './NumberFormatOptions';
|
|
5
|
-
import {defaultOnError} from './
|
|
5
|
+
import {defaultOnError} from './defaults';
|
|
6
6
|
|
|
7
7
|
const MINUTE = 60;
|
|
8
8
|
const HOUR = MINUTE * 60;
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import Formats from './Formats';
|
|
2
|
+
import IntlConfiguration from './IntlConfiguration';
|
|
2
3
|
import TranslationValues from './TranslationValues';
|
|
3
4
|
import createTranslatorImpl, {
|
|
4
|
-
CreateTranslatorImplProps,
|
|
5
5
|
CoreRichTranslationValues
|
|
6
6
|
} from './createTranslatorImpl';
|
|
7
|
+
import {defaultGetMessageFallback, defaultOnError} from './defaults';
|
|
7
8
|
import MessageKeys from './utils/MessageKeys';
|
|
8
9
|
import NamespaceKeys from './utils/NamespaceKeys';
|
|
9
10
|
import NestedKeyOf from './utils/NestedKeyOf';
|
|
@@ -23,13 +24,12 @@ export default function createTranslator<
|
|
|
23
24
|
NestedKeyOf<IntlMessages>
|
|
24
25
|
> = never
|
|
25
26
|
>({
|
|
27
|
+
onError = defaultOnError,
|
|
28
|
+
getMessageFallback = defaultGetMessageFallback,
|
|
26
29
|
messages,
|
|
27
30
|
namespace,
|
|
28
31
|
...rest
|
|
29
|
-
}:
|
|
30
|
-
CreateTranslatorImplProps<IntlMessages>,
|
|
31
|
-
'messagesOrError' | 'namespace' | 'namespacePrefix'
|
|
32
|
-
> & {
|
|
32
|
+
}: IntlConfiguration & {
|
|
33
33
|
messages: IntlMessages;
|
|
34
34
|
namespace?: NestedKey;
|
|
35
35
|
}): // Explicitly defining the return type is necessary as TypeScript would get it wrong
|
|
@@ -101,6 +101,8 @@ export default function createTranslator<
|
|
|
101
101
|
>(
|
|
102
102
|
{
|
|
103
103
|
...rest,
|
|
104
|
+
onError,
|
|
105
|
+
getMessageFallback,
|
|
104
106
|
messages: {'!': messages},
|
|
105
107
|
// @ts-ignore
|
|
106
108
|
namespace: namespace ? `!.${namespace}` : '!'
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
import AbstractIntlMessages from './AbstractIntlMessages';
|
|
2
|
+
import {InitializedIntlConfiguration} from './IntlConfiguration';
|
|
2
3
|
import IntlError, {IntlErrorCode} from './IntlError';
|
|
3
4
|
import {RichTranslationValues, TranslationValue} from './TranslationValues';
|
|
4
|
-
import
|
|
5
|
-
import createBaseTranslator, {
|
|
6
|
-
CreateBaseTranslatorProps,
|
|
7
|
-
getMessagesOrError
|
|
8
|
-
} from './createBaseTranslator';
|
|
5
|
+
import createBaseTranslator, {getMessagesOrError} from './createBaseTranslator';
|
|
9
6
|
import resolveNamespace from './resolveNamespace';
|
|
10
7
|
import NestedKeyOf from './utils/NestedKeyOf';
|
|
11
8
|
|
|
@@ -14,29 +11,21 @@ export type CoreRichTranslationValues = Record<
|
|
|
14
11
|
TranslationValue | ((chunks: string) => string)
|
|
15
12
|
>;
|
|
16
13
|
|
|
17
|
-
export type CreateTranslatorImplProps<Messages> =
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
onError?(error: IntlError): void;
|
|
23
|
-
getMessageFallback?(info: {
|
|
24
|
-
error: IntlError;
|
|
25
|
-
key: string;
|
|
26
|
-
namespace?: string;
|
|
27
|
-
}): string;
|
|
28
|
-
namespace: string;
|
|
29
|
-
};
|
|
14
|
+
export type CreateTranslatorImplProps<Messages> =
|
|
15
|
+
InitializedIntlConfiguration & {
|
|
16
|
+
namespace: string;
|
|
17
|
+
messages: Messages;
|
|
18
|
+
};
|
|
30
19
|
|
|
31
20
|
export default function createTranslatorImpl<
|
|
32
21
|
Messages extends AbstractIntlMessages,
|
|
33
22
|
NestedKey extends NestedKeyOf<Messages>
|
|
34
23
|
>(
|
|
35
24
|
{
|
|
25
|
+
getMessageFallback,
|
|
36
26
|
messages,
|
|
37
27
|
namespace,
|
|
38
|
-
onError
|
|
39
|
-
getMessageFallback = defaultGetMessageFallback,
|
|
28
|
+
onError,
|
|
40
29
|
...rest
|
|
41
30
|
}: CreateTranslatorImplProps<Messages>,
|
|
42
31
|
namespacePrefix: string
|
|
@@ -49,6 +38,7 @@ export default function createTranslatorImpl<
|
|
|
49
38
|
const translator = createBaseTranslator<Messages, NestedKey>({
|
|
50
39
|
...rest,
|
|
51
40
|
onError,
|
|
41
|
+
getMessageFallback,
|
|
52
42
|
messagesOrError: getMessagesOrError({
|
|
53
43
|
messages,
|
|
54
44
|
namespace,
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import IntlError from './IntlError';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Contains defaults that are used for all entry points into the core.
|
|
5
|
+
* See also `InitializedIntlConfiguration`.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
export function defaultGetMessageFallback(props: {
|
|
9
|
+
error: IntlError;
|
|
10
|
+
key: string;
|
|
11
|
+
namespace?: string;
|
|
12
|
+
}) {
|
|
13
|
+
return [props.namespace, props.key].filter((part) => part != null).join('.');
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
export function defaultOnError(error: IntlError) {
|
|
17
|
+
console.error(error);
|
|
18
|
+
}
|
|
@@ -1,51 +1,20 @@
|
|
|
1
1
|
import React, {ReactNode, useEffect} from 'react';
|
|
2
|
-
import AbstractIntlMessages from '../core
|
|
3
|
-
import
|
|
4
|
-
import IntlError from '../core/IntlError';
|
|
2
|
+
import {AbstractIntlMessages} from '../core';
|
|
3
|
+
import IntlConfiguration from '../core/IntlConfiguration';
|
|
5
4
|
import {RichTranslationValues} from '../core/TranslationValues';
|
|
6
|
-
import {defaultGetMessageFallback, defaultOnError} from '../core/
|
|
5
|
+
import {defaultGetMessageFallback, defaultOnError} from '../core/defaults';
|
|
7
6
|
import validateMessages from '../core/validateMessages';
|
|
8
7
|
import IntlContext from './IntlContext';
|
|
9
8
|
|
|
10
|
-
type Props = {
|
|
11
|
-
/** All messages that will be available in your components. */
|
|
12
|
-
messages?: AbstractIntlMessages;
|
|
13
|
-
/** A valid Unicode locale tag (e.g. "en" or "en-GB"). */
|
|
14
|
-
locale: string;
|
|
15
|
-
/** Global formats can be provided to achieve consistent
|
|
16
|
-
* formatting across components. */
|
|
17
|
-
formats?: Partial<Formats>;
|
|
18
|
-
/** A time zone as defined in [the tz database](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) which will be applied when formatting dates and times. If this is absent, the user time zone will be used. You can override this by supplying an explicit time zone to `formatDateTime`. */
|
|
19
|
-
timeZone?: string;
|
|
20
|
-
/** This callback will be invoked when an error is encountered during
|
|
21
|
-
* resolving a message or formatting it. This defaults to `console.error` to
|
|
22
|
-
* keep your app running. You can customize the handling by taking
|
|
23
|
-
* `error.code` into account. */
|
|
24
|
-
onError?(error: IntlError): void;
|
|
25
|
-
/** Will be called when a message couldn't be resolved or formatting it led to
|
|
26
|
-
* an error. This defaults to `${namespace}.${key}` You can use this to
|
|
27
|
-
* customize what will be rendered in this case. */
|
|
28
|
-
getMessageFallback?(info: {
|
|
29
|
-
namespace?: string;
|
|
30
|
-
key: string;
|
|
31
|
-
error: IntlError;
|
|
32
|
-
}): string;
|
|
9
|
+
type Props = IntlConfiguration & {
|
|
33
10
|
/** All components that use the provided hooks should be within this tree. */
|
|
34
11
|
children: ReactNode;
|
|
35
|
-
/**
|
|
36
|
-
* Providing this value will have two effects:
|
|
37
|
-
* 1. It will be used as the default for the `now` argument of
|
|
38
|
-
* `useIntl().formatRelativeTime` if no explicit value is provided.
|
|
39
|
-
* 2. It will be returned as a static value from the `useNow` hook. Note
|
|
40
|
-
* however that when `updateInterval` is configured on the `useNow` hook,
|
|
41
|
-
* the global `now` value will only be used for the initial render, but
|
|
42
|
-
* afterwards the current date will be returned continuously.
|
|
43
|
-
*/
|
|
44
|
-
now?: Date;
|
|
45
12
|
/** Global default values for translation values and rich text elements.
|
|
46
13
|
* Can be used for consistent usage or styling of rich text elements.
|
|
47
14
|
* Defaults will be overidden by locally provided values. */
|
|
48
15
|
defaultTranslationValues?: RichTranslationValues;
|
|
16
|
+
/** All messages that will be available in your components. */
|
|
17
|
+
messages?: AbstractIntlMessages;
|
|
49
18
|
};
|
|
50
19
|
|
|
51
20
|
export default function IntlProvider({
|
package/dist/core/config.d.ts
DELETED
package/src/core/config.tsx
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import IntlError from './IntlError';
|
|
2
|
-
|
|
3
|
-
export function defaultGetMessageFallback({
|
|
4
|
-
key,
|
|
5
|
-
namespace
|
|
6
|
-
}: {
|
|
7
|
-
key: string;
|
|
8
|
-
namespace?: string;
|
|
9
|
-
}) {
|
|
10
|
-
return [namespace, key].filter((part) => part != null).join('.');
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
export function defaultOnError(error: IntlError) {
|
|
14
|
-
console.error(error);
|
|
15
|
-
}
|