use-intl 2.7.1-alpha.4 → 2.7.2-alpha.1
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/_virtual/use-intl.esm.js +126 -0
- package/dist/_virtual/use-intl.esm.js.map +1 -0
- package/dist/use-intl.cjs.development.js +69 -32
- 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 -674
- package/dist/use-intl.esm.js.map +1 -1
- package/dist/use-intl.esm10.js +15 -0
- package/dist/use-intl.esm10.js.map +1 -0
- package/dist/use-intl.esm11.js +6 -0
- package/dist/use-intl.esm11.js.map +1 -0
- package/dist/use-intl.esm12.js +213 -0
- package/dist/use-intl.esm12.js.map +1 -0
- package/dist/use-intl.esm13.js +34 -0
- package/dist/use-intl.esm13.js.map +1 -0
- package/dist/use-intl.esm2.js +155 -0
- package/dist/use-intl.esm2.js.map +1 -0
- package/dist/use-intl.esm3.js +48 -0
- package/dist/use-intl.esm3.js.map +1 -0
- package/dist/use-intl.esm4.js +34 -0
- package/dist/use-intl.esm4.js.map +1 -0
- package/dist/use-intl.esm5.js +50 -0
- package/dist/use-intl.esm5.js.map +1 -0
- package/dist/use-intl.esm6.js +42 -0
- package/dist/use-intl.esm6.js.map +1 -0
- package/dist/use-intl.esm7.js +8 -0
- package/dist/use-intl.esm7.js.map +1 -0
- package/dist/use-intl.esm8.js +8 -0
- package/dist/use-intl.esm8.js.map +1 -0
- package/dist/use-intl.esm9.js +32 -0
- package/dist/use-intl.esm9.js.map +1 -0
- package/dist/validateMessages.d.ts +3 -0
- package/package.json +3 -2
- package/src/IntlProvider.tsx +11 -1
- package/src/validateMessages.tsx +43 -0
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from './_virtual/use-intl.esm.js';
|
|
2
|
+
import React, { useEffect } from 'react';
|
|
3
|
+
import IntlContext from './use-intl.esm11.js';
|
|
4
|
+
import validateMessages from './use-intl.esm9.js';
|
|
5
|
+
|
|
6
|
+
var _excluded = ["children", "onError", "getMessageFallback", "messages"];
|
|
7
|
+
|
|
8
|
+
function defaultGetMessageFallback(_ref) {
|
|
9
|
+
var key = _ref.key,
|
|
10
|
+
namespace = _ref.namespace;
|
|
11
|
+
return [namespace, key].filter(function (part) {
|
|
12
|
+
return part != null;
|
|
13
|
+
}).join('.');
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
function defaultOnError(error) {
|
|
17
|
+
console.error(error);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
function IntlProvider(_ref2) {
|
|
21
|
+
var children = _ref2.children,
|
|
22
|
+
_ref2$onError = _ref2.onError,
|
|
23
|
+
onError = _ref2$onError === void 0 ? defaultOnError : _ref2$onError,
|
|
24
|
+
_ref2$getMessageFallb = _ref2.getMessageFallback,
|
|
25
|
+
getMessageFallback = _ref2$getMessageFallb === void 0 ? defaultGetMessageFallback : _ref2$getMessageFallb,
|
|
26
|
+
messages = _ref2.messages,
|
|
27
|
+
contextValues = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
28
|
+
|
|
29
|
+
if (process.env.NODE_ENV !== "production") {
|
|
30
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
31
|
+
useEffect(function () {
|
|
32
|
+
if (messages) {
|
|
33
|
+
validateMessages(messages, onError);
|
|
34
|
+
}
|
|
35
|
+
}, [messages, onError]);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
return React.createElement(IntlContext.Provider, {
|
|
39
|
+
value: _extends({}, contextValues, {
|
|
40
|
+
messages: messages,
|
|
41
|
+
onError: onError,
|
|
42
|
+
getMessageFallback: getMessageFallback
|
|
43
|
+
})
|
|
44
|
+
}, children);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
export { IntlProvider as default };
|
|
48
|
+
//# sourceMappingURL=use-intl.esm3.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm3.js","sources":["../src/IntlProvider.tsx"],"sourcesContent":["import React, {ReactNode, useEffect} from 'react';\nimport AbstractIntlMessages from './AbstractIntlMessages';\nimport Formats from './Formats';\nimport IntlContext from './IntlContext';\nimport IntlError from './IntlError';\nimport {RichTranslationValues} from './TranslationValues';\nimport validateMessages from './validateMessages';\n\ntype Props = {\n /** All messages that will be available in your components. */\n messages?: AbstractIntlMessages;\n /** A valid Unicode locale tag (e.g. \"en\" or \"en-GB\"). */\n locale: string;\n /** Global formats can be provided to achieve consistent\n * formatting across components. */\n formats?: Partial<Formats>;\n /** 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`. */\n timeZone?: string;\n /** This callback will be invoked when an error is encountered during\n * resolving a message or formatting it. This defaults to `console.error` to\n * keep your app running. You can customize the handling by taking\n * `error.code` into account. */\n onError?(error: IntlError): void;\n /** Will be called when a message couldn't be resolved or formatting it led to\n * an error. This defaults to `${namespace}.${key}` You can use this to\n * customize what will be rendered in this case. */\n getMessageFallback?(info: {\n namespace?: string;\n key: string;\n error: IntlError;\n }): string;\n /** All components that use the provided hooks should be within this tree. */\n children: ReactNode;\n /**\n * Providing this value will have two effects:\n * 1. It will be used as the default for the `now` argument of\n * `useIntl().formatRelativeTime` if no explicit value is provided.\n * 2. It will be returned as a static value from the `useNow` hook. Note\n * however that when `updateInterval` is configured on the `useNow` hook,\n * the global `now` value will only be used for the initial render, but\n * afterwards the current date will be returned continuously.\n */\n now?: Date;\n /** Global default values for translation values and rich text elements.\n * Can be used for consistent usage or styling of rich text elements.\n * Defaults will be overidden by locally provided values. */\n defaultTranslationValues?: RichTranslationValues;\n};\n\nfunction defaultGetMessageFallback({\n key,\n namespace\n}: {\n key: string;\n namespace?: string;\n}) {\n return [namespace, key].filter((part) => part != null).join('.');\n}\n\nfunction defaultOnError(error: IntlError) {\n console.error(error);\n}\n\nexport default function IntlProvider({\n children,\n onError = defaultOnError,\n getMessageFallback = defaultGetMessageFallback,\n messages,\n ...contextValues\n}: Props) {\n if (__DEV__) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (messages) {\n validateMessages(messages, onError);\n }\n }, [messages, onError]);\n }\n\n return (\n <IntlContext.Provider\n value={{...contextValues, messages, onError, getMessageFallback}}\n >\n {children}\n </IntlContext.Provider>\n );\n}\n"],"names":["defaultGetMessageFallback","key","namespace","filter","part","join","defaultOnError","error","console","IntlProvider","children","onError","getMessageFallback","messages","contextValues","useEffect","validateMessages","React","IntlContext","Provider","value"],"mappings":";;;;;;;AAiDA,SAASA,yBAAT,CAMC,IAAA,EAAA;AAAA,EALCC,IAAAA,GAKD,QALCA,GAKD;AAAA,MAJCC,SAID,QAJCA,SAID,CAAA;AACC,EAAO,OAAA,CAACA,SAAD,EAAYD,GAAZ,EAAiBE,MAAjB,CAAwB,UAACC,IAAD,EAAA;AAAA,IAAUA,OAAAA,IAAI,IAAI,IAAlB,CAAA;AAAA,GAAxB,CAAgDC,CAAAA,IAAhD,CAAqD,GAArD,CAAP,CAAA;AACD,CAAA;;AAED,SAASC,cAAT,CAAwBC,KAAxB,EAAwC;AACtCC,EAAAA,OAAO,CAACD,KAAR,CAAcA,KAAd,CAAA,CAAA;AACD,CAAA;;AAEuB,SAAAE,YAAA,CAMhB,KAAA,EAAA;AAAA,EALNC,IAAAA,QAKM,SALNA,QAKM;AAAA,MAAA,aAAA,GAAA,KAAA,CAJNC,OAIM;AAAA,MAJNA,OAIM,8BAJIL,cAIJ,GAAA,aAAA;AAAA,MAAA,qBAAA,GAAA,KAAA,CAHNM,kBAGM;AAAA,MAHNA,kBAGM,sCAHeZ,yBAGf,GAAA,qBAAA;AAAA,MAFNa,QAEM,SAFNA,QAEM;AAAA,MADHC,aACG,GAAA,6BAAA,CAAA,KAAA,EAAA,SAAA,CAAA,CAAA;;AACN,EAAa,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,EAAA;AACX;AACAC,IAAAA,SAAS,CAAC,YAAK;AACb,MAAA,IAAIF,QAAJ,EAAc;AACZG,QAAAA,gBAAgB,CAACH,QAAD,EAAWF,OAAX,CAAhB,CAAA;AACD,OAAA;AACF,KAJQ,EAIN,CAACE,QAAD,EAAWF,OAAX,CAJM,CAAT,CAAA;AAKD,GAAA;;AAED,EAAA,OACEM,mBAAA,CAACC,WAAW,CAACC,QAAb,EACE;AAAAC,IAAAA,KAAK,eAAMN,aAAN,EAAA;AAAqBD,MAAAA,QAAQ,EAARA,QAArB;AAA+BF,MAAAA,OAAO,EAAPA,OAA/B;AAAwCC,MAAAA,kBAAkB,EAAlBA,kBAAAA;AAAxC,KAAA,CAAA;AAAL,GADF,EAGGF,QAHH,CADF,CAAA;AAOD;;;;"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import IntlError, { IntlErrorCode } from './use-intl.esm6.js';
|
|
2
|
+
import useIntlContext from './use-intl.esm10.js';
|
|
3
|
+
import useTranslationsImpl from './use-intl.esm12.js';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Translates messages from the given namespace by using the ICU syntax.
|
|
7
|
+
* See https://formatjs.io/docs/core-concepts/icu-syntax.
|
|
8
|
+
*
|
|
9
|
+
* If no namespace is provided, all available messages are returned.
|
|
10
|
+
* The namespace can also indicate nesting by using a dot
|
|
11
|
+
* (e.g. `namespace.Component`).
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
function useTranslations(namespace) {
|
|
15
|
+
var context = useIntlContext();
|
|
16
|
+
var messages = context.messages;
|
|
17
|
+
|
|
18
|
+
if (!messages) {
|
|
19
|
+
var intlError = new IntlError(IntlErrorCode.MISSING_MESSAGE, process.env.NODE_ENV !== "production" ? "No messages were configured on the provider." : undefined);
|
|
20
|
+
context.onError(intlError);
|
|
21
|
+
throw intlError;
|
|
22
|
+
} // We have to wrap the actual hook so the type inference for the optional
|
|
23
|
+
// namespace works correctly. See https://stackoverflow.com/a/71529575/343045
|
|
24
|
+
// The prefix ("!"") is arbitrary, but we have to use some.
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
return useTranslationsImpl({
|
|
28
|
+
'!': messages
|
|
29
|
+
}, // @ts-ignore
|
|
30
|
+
namespace ? "!." + namespace : '!', '!');
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export { useTranslations as default };
|
|
34
|
+
//# sourceMappingURL=use-intl.esm4.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm4.js","sources":["../src/useTranslations.tsx"],"sourcesContent":["import {ReactElement, ReactNodeArray} from 'react';\nimport Formats from './Formats';\nimport IntlError, {IntlErrorCode} from './IntlError';\nimport TranslationValues, {RichTranslationValues} from './TranslationValues';\nimport useIntlContext from './useIntlContext';\nimport useTranslationsImpl from './useTranslationsImpl';\nimport MessageKeys from './utils/MessageKeys';\nimport NamespaceKeys from './utils/NamespaceKeys';\nimport NestedKeyOf from './utils/NestedKeyOf';\nimport NestedValueOf from './utils/NestedValueOf';\n\n/**\n * Translates messages from the given namespace by using the ICU syntax.\n * See https://formatjs.io/docs/core-concepts/icu-syntax.\n *\n * If no namespace is provided, all available messages are returned.\n * The namespace can also indicate nesting by using a dot\n * (e.g. `namespace.Component`).\n */\nexport default function useTranslations<\n NestedKey extends NamespaceKeys<IntlMessages, NestedKeyOf<IntlMessages>>\n>(\n namespace?: NestedKey\n): // Explicitly defining the return type is necessary as TypeScript would get it wrong\n{\n // Default invocation\n <\n TargetKey extends MessageKeys<\n NestedValueOf<\n {'!': IntlMessages},\n NamespaceKeys<IntlMessages, NestedKeyOf<IntlMessages>> extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >,\n NestedKeyOf<\n NestedValueOf<\n {'!': IntlMessages},\n NamespaceKeys<\n IntlMessages,\n NestedKeyOf<IntlMessages>\n > extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >\n >\n >\n >(\n key: TargetKey,\n values?: TranslationValues,\n formats?: Partial<Formats>\n ): string;\n\n // `rich`\n rich<\n TargetKey extends MessageKeys<\n NestedValueOf<\n {'!': IntlMessages},\n NamespaceKeys<IntlMessages, NestedKeyOf<IntlMessages>> extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >,\n NestedKeyOf<\n NestedValueOf<\n {'!': IntlMessages},\n NamespaceKeys<\n IntlMessages,\n NestedKeyOf<IntlMessages>\n > extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >\n >\n >\n >(\n key: TargetKey,\n values?: RichTranslationValues,\n formats?: Partial<Formats>\n ): string | ReactElement | ReactNodeArray;\n\n // `raw`\n raw<\n TargetKey extends MessageKeys<\n NestedValueOf<\n {'!': IntlMessages},\n NamespaceKeys<IntlMessages, NestedKeyOf<IntlMessages>> extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >,\n NestedKeyOf<\n NestedValueOf<\n {'!': IntlMessages},\n NamespaceKeys<\n IntlMessages,\n NestedKeyOf<IntlMessages>\n > extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >\n >\n >\n >(\n key: TargetKey\n ): any;\n} {\n const context = useIntlContext();\n\n const messages = context.messages as IntlMessages;\n if (!messages) {\n const intlError = new IntlError(\n IntlErrorCode.MISSING_MESSAGE,\n __DEV__ ? `No messages were configured on the provider.` : undefined\n );\n context.onError(intlError);\n throw intlError;\n }\n\n // We have to wrap the actual hook so the type inference for the optional\n // namespace works correctly. See https://stackoverflow.com/a/71529575/343045\n // The prefix (\"!\"\") is arbitrary, but we have to use some.\n return useTranslationsImpl<\n {'!': IntlMessages},\n NamespaceKeys<IntlMessages, NestedKeyOf<IntlMessages>> extends NestedKey\n ? '!'\n : `!.${NestedKey}`\n >(\n {'!': messages},\n // @ts-ignore\n namespace ? `!.${namespace}` : '!',\n '!'\n );\n}\n"],"names":["useTranslations","namespace","context","useIntlContext","messages","intlError","IntlError","IntlErrorCode","MISSING_MESSAGE","undefined","onError","useTranslationsImpl"],"mappings":";;;;AAWA;;;;;;;AAOG;;AACqB,SAAAA,eAAA,CAGtBC,SAHsB,EAGD;AAkFrB,EAAMC,IAAAA,OAAO,GAAGC,cAAc,EAA9B,CAAA;AAEA,EAAA,IAAMC,QAAQ,GAAGF,OAAO,CAACE,QAAzB,CAAA;;AACA,EAAI,IAAA,CAACA,QAAL,EAAe;AACb,IAAMC,IAAAA,SAAS,GAAG,IAAIC,SAAJ,CAChBC,aAAa,CAACC,eADE,EAEhB,OAA2DC,CAAAA,GAAAA,CAAAA,QAAAA,KAAAA,YAAAA,GAAAA,8CAAAA,GAAAA,SAF3C,CAAlB,CAAA;AAIAP,IAAAA,OAAO,CAACQ,OAAR,CAAgBL,SAAhB,CAAA,CAAA;AACA,IAAA,MAAMA,SAAN,CAAA;AACD,GA5FoB;AA+FrB;AACA;;;AACA,EAAA,OAAOM,mBAAmB,CAMxB;AAAC,IAAKP,GAAAA,EAAAA,QAAAA;AAAN,GANwB;AAQxBH,EAAAA,SAAS,GAAQA,IAAAA,GAAAA,SAAR,GAAsB,GARP,EASxB,GATwB,CAA1B,CAAA;AAWD;;;;"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { useState, useEffect } from 'react';
|
|
2
|
+
import useIntlContext from './use-intl.esm10.js';
|
|
3
|
+
|
|
4
|
+
function getNow() {
|
|
5
|
+
return new Date();
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* Reading the current date via `new Date()` in components should be avoided, as
|
|
9
|
+
* it causes components to be impure and can lead to flaky tests. Instead, this
|
|
10
|
+
* hook can be used.
|
|
11
|
+
*
|
|
12
|
+
* By default, it returns the time when the component mounts. If `updateInterval`
|
|
13
|
+
* is specified, the value will be updated based on the interval.
|
|
14
|
+
*
|
|
15
|
+
* You can however also return a static value from this hook, if you
|
|
16
|
+
* configure the `now` parameter on the context provider. Note however,
|
|
17
|
+
* that if `updateInterval` is configured in this case, the component
|
|
18
|
+
* will initialize with the global value, but will afterwards update
|
|
19
|
+
* continuously based on the interval.
|
|
20
|
+
*
|
|
21
|
+
* For unit tests, this can be mocked to a constant value. For end-to-end
|
|
22
|
+
* testing, an environment parameter can be passed to the `now` parameter
|
|
23
|
+
* of the provider to mock this to a static value.
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
function useNow(options) {
|
|
28
|
+
var updateInterval = options == null ? void 0 : options.updateInterval;
|
|
29
|
+
|
|
30
|
+
var _useIntlContext = useIntlContext(),
|
|
31
|
+
globalNow = _useIntlContext.now;
|
|
32
|
+
|
|
33
|
+
var _useState = useState(globalNow || getNow()),
|
|
34
|
+
now = _useState[0],
|
|
35
|
+
setNow = _useState[1];
|
|
36
|
+
|
|
37
|
+
useEffect(function () {
|
|
38
|
+
if (!updateInterval) return;
|
|
39
|
+
var intervalId = setInterval(function () {
|
|
40
|
+
setNow(getNow());
|
|
41
|
+
}, updateInterval);
|
|
42
|
+
return function () {
|
|
43
|
+
clearInterval(intervalId);
|
|
44
|
+
};
|
|
45
|
+
}, [globalNow, updateInterval]);
|
|
46
|
+
return now;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
export { useNow as default };
|
|
50
|
+
//# sourceMappingURL=use-intl.esm5.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm5.js","sources":["../src/useNow.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\nimport useIntlContext from './useIntlContext';\n\ntype Options = {\n updateInterval?: number;\n};\n\nfunction getNow() {\n return new Date();\n}\n\n/**\n * Reading the current date via `new Date()` in components should be avoided, as\n * it causes components to be impure and can lead to flaky tests. Instead, this\n * hook can be used.\n *\n * By default, it returns the time when the component mounts. If `updateInterval`\n * is specified, the value will be updated based on the interval.\n *\n * You can however also return a static value from this hook, if you\n * configure the `now` parameter on the context provider. Note however,\n * that if `updateInterval` is configured in this case, the component\n * will initialize with the global value, but will afterwards update\n * continuously based on the interval.\n *\n * For unit tests, this can be mocked to a constant value. For end-to-end\n * testing, an environment parameter can be passed to the `now` parameter\n * of the provider to mock this to a static value.\n */\nexport default function useNow(options?: Options) {\n const updateInterval = options?.updateInterval;\n\n const {now: globalNow} = useIntlContext();\n const [now, setNow] = useState(globalNow || getNow());\n\n useEffect(() => {\n if (!updateInterval) return;\n\n const intervalId = setInterval(() => {\n setNow(getNow());\n }, updateInterval);\n\n return () => {\n clearInterval(intervalId);\n };\n }, [globalNow, updateInterval]);\n\n return now;\n}\n"],"names":["getNow","Date","useNow","options","updateInterval","useIntlContext","globalNow","now","useState","setNow","useEffect","intervalId","setInterval","clearInterval"],"mappings":";;;AAOA,SAASA,MAAT,GAAe;AACb,EAAO,OAAA,IAAIC,IAAJ,EAAP,CAAA;AACD,CAAA;AAED;;;;;;;;;;;;;;;;;AAiBG;;;AACqB,SAAAC,MAAA,CAAOC,OAAP,EAAwB;AAC9C,EAAA,IAAMC,cAAc,GAAGD,OAAH,IAAGA,IAAAA,GAAAA,KAAAA,CAAAA,GAAAA,OAAO,CAAEC,cAAhC,CAAA;;AAEA,EAAA,IAAA,eAAA,GAAyBC,cAAc,EAAvC;AAAA,MAAYC,SAAZ,mBAAOC,GAAP,CAAA;;AACA,EAAA,IAAA,SAAA,GAAsBC,QAAQ,CAACF,SAAS,IAAIN,MAAM,EAApB,CAA9B;AAAA,MAAOO,GAAP,GAAA,SAAA,CAAA,CAAA,CAAA;AAAA,MAAYE,MAAZ,GAAA,SAAA,CAAA,CAAA,CAAA,CAAA;;AAEAC,EAAAA,SAAS,CAAC,YAAK;AACb,IAAI,IAAA,CAACN,cAAL,EAAqB,OAAA;AAErB,IAAA,IAAMO,UAAU,GAAGC,WAAW,CAAC,YAAK;AAClCH,MAAAA,MAAM,CAACT,MAAM,EAAP,CAAN,CAAA;AACD,KAF6B,EAE3BI,cAF2B,CAA9B,CAAA;AAIA,IAAA,OAAO,YAAK;AACVS,MAAAA,aAAa,CAACF,UAAD,CAAb,CAAA;AACD,KAFD,CAAA;AAGD,GAVQ,EAUN,CAACL,SAAD,EAAYF,cAAZ,CAVM,CAAT,CAAA;AAYA,EAAA,OAAOG,GAAP,CAAA;AACD;;;;"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { inheritsLoose as _inheritsLoose, wrapNativeSuper as _wrapNativeSuper } from './_virtual/use-intl.esm.js';
|
|
2
|
+
|
|
3
|
+
var IntlErrorCode;
|
|
4
|
+
|
|
5
|
+
(function (IntlErrorCode) {
|
|
6
|
+
IntlErrorCode["MISSING_MESSAGE"] = "MISSING_MESSAGE";
|
|
7
|
+
IntlErrorCode["MISSING_FORMAT"] = "MISSING_FORMAT";
|
|
8
|
+
IntlErrorCode["INSUFFICIENT_PATH"] = "INSUFFICIENT_PATH";
|
|
9
|
+
IntlErrorCode["INVALID_MESSAGE"] = "INVALID_MESSAGE";
|
|
10
|
+
IntlErrorCode["INVALID_KEY"] = "INVALID_KEY";
|
|
11
|
+
IntlErrorCode["FORMATTING_ERROR"] = "FORMATTING_ERROR";
|
|
12
|
+
})(IntlErrorCode || (IntlErrorCode = {}));
|
|
13
|
+
|
|
14
|
+
var IntlError = /*#__PURE__*/function (_Error) {
|
|
15
|
+
_inheritsLoose(IntlError, _Error);
|
|
16
|
+
|
|
17
|
+
function IntlError(code, originalMessage) {
|
|
18
|
+
var _this;
|
|
19
|
+
|
|
20
|
+
var message = code;
|
|
21
|
+
|
|
22
|
+
if (originalMessage) {
|
|
23
|
+
message += ': ' + originalMessage;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
_this = _Error.call(this, message) || this;
|
|
27
|
+
_this.code = void 0;
|
|
28
|
+
_this.originalMessage = void 0;
|
|
29
|
+
_this.code = code;
|
|
30
|
+
|
|
31
|
+
if (originalMessage) {
|
|
32
|
+
_this.originalMessage = originalMessage;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
return _this;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
return IntlError;
|
|
39
|
+
}( /*#__PURE__*/_wrapNativeSuper(Error));
|
|
40
|
+
|
|
41
|
+
export { IntlErrorCode, IntlError as default };
|
|
42
|
+
//# sourceMappingURL=use-intl.esm6.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm6.js","sources":["../src/IntlError.tsx"],"sourcesContent":["export enum IntlErrorCode {\n MISSING_MESSAGE = 'MISSING_MESSAGE',\n MISSING_FORMAT = 'MISSING_FORMAT',\n INSUFFICIENT_PATH = 'INSUFFICIENT_PATH',\n INVALID_MESSAGE = 'INVALID_MESSAGE',\n INVALID_KEY = 'INVALID_KEY',\n FORMATTING_ERROR = 'FORMATTING_ERROR'\n}\n\nexport default class IntlError extends Error {\n public readonly code: IntlErrorCode;\n public readonly originalMessage: string | undefined;\n\n constructor(code: IntlErrorCode, originalMessage?: string) {\n let message: string = code;\n if (originalMessage) {\n message += ': ' + originalMessage;\n }\n super(message);\n\n this.code = code;\n if (originalMessage) {\n this.originalMessage = originalMessage;\n }\n }\n}\n"],"names":["IntlErrorCode","IntlError","code","originalMessage","message","Error"],"mappings":";;IAAYA,cAAZ;;AAAA,CAAA,UAAYA,aAAZ,EAAyB;AACvBA,EAAAA,aAAA,CAAA,iBAAA,CAAA,GAAA,iBAAA,CAAA;AACAA,EAAAA,aAAA,CAAA,gBAAA,CAAA,GAAA,gBAAA,CAAA;AACAA,EAAAA,aAAA,CAAA,mBAAA,CAAA,GAAA,mBAAA,CAAA;AACAA,EAAAA,aAAA,CAAA,iBAAA,CAAA,GAAA,iBAAA,CAAA;AACAA,EAAAA,aAAA,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;AACAA,EAAAA,aAAA,CAAA,kBAAA,CAAA,GAAA,kBAAA,CAAA;AACD,CAPD,EAAYA,aAAa,KAAbA,aAAa,GAOxB,EAPwB,CAAzB,CAAA,CAAA;;IASqBC;;;AAInB,EAAYC,SAAAA,SAAAA,CAAAA,IAAZ,EAAiCC,eAAjC,EAAyD;AAAA,IAAA,IAAA,KAAA,CAAA;;AACvD,IAAIC,IAAAA,OAAO,GAAWF,IAAtB,CAAA;;AACA,IAAA,IAAIC,eAAJ,EAAqB;AACnBC,MAAAA,OAAO,IAAI,IAAA,GAAOD,eAAlB,CAAA;AACD,KAAA;;AACD,IAAA,KAAA,GAAA,MAAA,CAAA,IAAA,CAAA,IAAA,EAAMC,OAAN,CAAA,IAAA,IAAA,CAAA;AALuD,IAAA,KAAA,CAHzCF,IAGyC,GAAA,KAAA,CAAA,CAAA;AAAA,IAAA,KAAA,CAFzCC,eAEyC,GAAA,KAAA,CAAA,CAAA;AAOvD,IAAKD,KAAAA,CAAAA,IAAL,GAAYA,IAAZ,CAAA;;AACA,IAAA,IAAIC,eAAJ,EAAqB;AACnB,MAAKA,KAAAA,CAAAA,eAAL,GAAuBA,eAAvB,CAAA;AACD,KAAA;;AAVsD,IAAA,OAAA,KAAA,CAAA;AAWxD,GAAA;;;iCAfoCE;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm7.js","sources":["../src/useLocale.tsx"],"sourcesContent":["import useIntlContext from './useIntlContext';\n\nexport default function useLocale() {\n return useIntlContext().locale;\n}\n"],"names":["useLocale","useIntlContext","locale"],"mappings":";;AAEc,SAAUA,SAAV,GAAmB;AAC/B,EAAOC,OAAAA,cAAc,GAAGC,MAAxB,CAAA;AACD;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm8.js","sources":["../src/useTimeZone.tsx"],"sourcesContent":["import useIntlContext from './useIntlContext';\n\nexport default function useTimeZone() {\n return useIntlContext().timeZone;\n}\n"],"names":["useTimeZone","useIntlContext","timeZone"],"mappings":";;AAEc,SAAUA,WAAV,GAAqB;AACjC,EAAOC,OAAAA,cAAc,GAAGC,QAAxB,CAAA;AACD;;;;"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import IntlError, { IntlErrorCode } from './use-intl.esm6.js';
|
|
2
|
+
|
|
3
|
+
function validateMessagesSegment(messages, invalidKeyLabels, parentPath) {
|
|
4
|
+
Object.entries(messages).forEach(function (_ref) {
|
|
5
|
+
var key = _ref[0],
|
|
6
|
+
messageOrMessages = _ref[1];
|
|
7
|
+
|
|
8
|
+
if (key.includes('.')) {
|
|
9
|
+
var keyLabel = key;
|
|
10
|
+
if (parentPath) keyLabel += " (at " + parentPath + ")";
|
|
11
|
+
invalidKeyLabels.push(keyLabel);
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
if (messageOrMessages != null && typeof messageOrMessages === 'object') {
|
|
15
|
+
validateMessagesSegment(messageOrMessages, invalidKeyLabels, [parentPath, key].filter(function (part) {
|
|
16
|
+
return part != null;
|
|
17
|
+
}).join('.'));
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
function validateMessages(messages, onError) {
|
|
23
|
+
var invalidKeyLabels = [];
|
|
24
|
+
validateMessagesSegment(messages, invalidKeyLabels);
|
|
25
|
+
|
|
26
|
+
if (invalidKeyLabels.length > 0) {
|
|
27
|
+
onError(new IntlError(IntlErrorCode.INVALID_KEY, "Namespace keys can not contain the character \".\" as this is used to express nesting. Please remove it or replace it with another character.\n\nInvalid " + (invalidKeyLabels.length === 1 ? 'key' : 'keys') + ": " + invalidKeyLabels.join(', ')));
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
export { validateMessages as default };
|
|
32
|
+
//# sourceMappingURL=use-intl.esm9.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-intl.esm9.js","sources":["../src/validateMessages.tsx"],"sourcesContent":["import AbstractIntlMessages from './AbstractIntlMessages';\nimport IntlError, {IntlErrorCode} from './IntlError';\n\nfunction validateMessagesSegment(\n messages: AbstractIntlMessages,\n invalidKeyLabels: Array<string>,\n parentPath?: string\n) {\n Object.entries(messages).forEach(([key, messageOrMessages]) => {\n if (key.includes('.')) {\n let keyLabel = key;\n if (parentPath) keyLabel += ` (at ${parentPath})`;\n invalidKeyLabels.push(keyLabel);\n }\n\n if (messageOrMessages != null && typeof messageOrMessages === 'object') {\n validateMessagesSegment(\n messageOrMessages,\n invalidKeyLabels,\n [parentPath, key].filter((part) => part != null).join('.')\n );\n }\n });\n}\n\nexport default function validateMessages(\n messages: AbstractIntlMessages,\n onError: (error: IntlError) => void\n) {\n const invalidKeyLabels: Array<string> = [];\n validateMessagesSegment(messages, invalidKeyLabels);\n\n if (invalidKeyLabels.length > 0) {\n onError(\n new IntlError(\n IntlErrorCode.INVALID_KEY,\n `Namespace keys can not contain the character \".\" as this is used to express nesting. Please remove it or replace it with another character.\\n\\nInvalid ${\n invalidKeyLabels.length === 1 ? 'key' : 'keys'\n }: ${invalidKeyLabels.join(', ')}`\n )\n );\n }\n}\n"],"names":["validateMessagesSegment","messages","invalidKeyLabels","parentPath","Object","entries","forEach","key","messageOrMessages","includes","keyLabel","push","filter","part","join","validateMessages","onError","length","IntlError","IntlErrorCode","INVALID_KEY"],"mappings":";;AAGA,SAASA,uBAAT,CACEC,QADF,EAEEC,gBAFF,EAGEC,UAHF,EAGqB;AAEnBC,EAAAA,MAAM,CAACC,OAAP,CAAeJ,QAAf,CAAyBK,CAAAA,OAAzB,CAAiC,UAA6B,IAAA,EAAA;AAAA,IAAA,IAA3BC,GAA2B,GAAA,IAAA,CAAA,CAAA,CAAA;AAAA,QAAtBC,iBAAsB,GAAA,IAAA,CAAA,CAAA,CAAA,CAAA;;AAC5D,IAAA,IAAID,GAAG,CAACE,QAAJ,CAAa,GAAb,CAAJ,EAAuB;AACrB,MAAIC,IAAAA,QAAQ,GAAGH,GAAf,CAAA;AACA,MAAA,IAAIJ,UAAJ,EAAgBO,QAAQ,IAAA,OAAA,GAAYP,UAAZ,GAAR,GAAA,CAAA;AAChBD,MAAAA,gBAAgB,CAACS,IAAjB,CAAsBD,QAAtB,CAAA,CAAA;AACD,KAAA;;AAED,IAAIF,IAAAA,iBAAiB,IAAI,IAArB,IAA6B,OAAOA,iBAAP,KAA6B,QAA9D,EAAwE;AACtER,MAAAA,uBAAuB,CACrBQ,iBADqB,EAErBN,gBAFqB,EAGrB,CAACC,UAAD,EAAaI,GAAb,CAAA,CAAkBK,MAAlB,CAAyB,UAACC,IAAD,EAAA;AAAA,QAAUA,OAAAA,IAAI,IAAI,IAAlB,CAAA;AAAA,OAAzB,CAAiDC,CAAAA,IAAjD,CAAsD,GAAtD,CAHqB,CAAvB,CAAA;AAKD,KAAA;AACF,GAdD,CAAA,CAAA;AAeD,CAAA;;AAEa,SAAUC,gBAAV,CACZd,QADY,EAEZe,OAFY,EAEuB;AAEnC,EAAMd,IAAAA,gBAAgB,GAAkB,EAAxC,CAAA;AACAF,EAAAA,uBAAuB,CAACC,QAAD,EAAWC,gBAAX,CAAvB,CAAA;;AAEA,EAAA,IAAIA,gBAAgB,CAACe,MAAjB,GAA0B,CAA9B,EAAiC;AAC/BD,IAAAA,OAAO,CACL,IAAIE,SAAJ,CACEC,aAAa,CAACC,WADhB,EAAA,2JAAA,IAGIlB,gBAAgB,CAACe,MAAjB,KAA4B,CAA5B,GAAgC,KAAhC,GAAwC,MAH5C,CAIOf,GAAAA,IAAAA,GAAAA,gBAAgB,CAACY,IAAjB,CAAsB,IAAtB,CAJP,CADK,CAAP,CAAA;AAQD,GAAA;AACF;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "use-intl",
|
|
3
|
-
"version": "2.7.
|
|
3
|
+
"version": "2.7.2-alpha.1",
|
|
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.",
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
"prepublishOnly": "yarn test && yarn lint && yarn build"
|
|
18
18
|
},
|
|
19
19
|
"main": "dist/index.js",
|
|
20
|
+
"module": "dist/use-intl.esm.js",
|
|
20
21
|
"typings": "dist/index.d.ts",
|
|
21
22
|
"jest": {
|
|
22
23
|
"testEnvironment": "jsdom"
|
|
@@ -58,5 +59,5 @@
|
|
|
58
59
|
"engines": {
|
|
59
60
|
"node": ">=10"
|
|
60
61
|
},
|
|
61
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "25a01ee749abb7106df1699be1ae71d0493a45e4"
|
|
62
63
|
}
|
package/src/IntlProvider.tsx
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
import React, {ReactNode} from 'react';
|
|
1
|
+
import React, {ReactNode, useEffect} from 'react';
|
|
2
2
|
import AbstractIntlMessages from './AbstractIntlMessages';
|
|
3
3
|
import Formats from './Formats';
|
|
4
4
|
import IntlContext from './IntlContext';
|
|
5
5
|
import IntlError from './IntlError';
|
|
6
6
|
import {RichTranslationValues} from './TranslationValues';
|
|
7
|
+
import validateMessages from './validateMessages';
|
|
7
8
|
|
|
8
9
|
type Props = {
|
|
9
10
|
/** All messages that will be available in your components. */
|
|
@@ -67,6 +68,15 @@ export default function IntlProvider({
|
|
|
67
68
|
messages,
|
|
68
69
|
...contextValues
|
|
69
70
|
}: Props) {
|
|
71
|
+
if (__DEV__) {
|
|
72
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
73
|
+
useEffect(() => {
|
|
74
|
+
if (messages) {
|
|
75
|
+
validateMessages(messages, onError);
|
|
76
|
+
}
|
|
77
|
+
}, [messages, onError]);
|
|
78
|
+
}
|
|
79
|
+
|
|
70
80
|
return (
|
|
71
81
|
<IntlContext.Provider
|
|
72
82
|
value={{...contextValues, messages, onError, getMessageFallback}}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import AbstractIntlMessages from './AbstractIntlMessages';
|
|
2
|
+
import IntlError, {IntlErrorCode} from './IntlError';
|
|
3
|
+
|
|
4
|
+
function validateMessagesSegment(
|
|
5
|
+
messages: AbstractIntlMessages,
|
|
6
|
+
invalidKeyLabels: Array<string>,
|
|
7
|
+
parentPath?: string
|
|
8
|
+
) {
|
|
9
|
+
Object.entries(messages).forEach(([key, messageOrMessages]) => {
|
|
10
|
+
if (key.includes('.')) {
|
|
11
|
+
let keyLabel = key;
|
|
12
|
+
if (parentPath) keyLabel += ` (at ${parentPath})`;
|
|
13
|
+
invalidKeyLabels.push(keyLabel);
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
if (messageOrMessages != null && typeof messageOrMessages === 'object') {
|
|
17
|
+
validateMessagesSegment(
|
|
18
|
+
messageOrMessages,
|
|
19
|
+
invalidKeyLabels,
|
|
20
|
+
[parentPath, key].filter((part) => part != null).join('.')
|
|
21
|
+
);
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
export default function validateMessages(
|
|
27
|
+
messages: AbstractIntlMessages,
|
|
28
|
+
onError: (error: IntlError) => void
|
|
29
|
+
) {
|
|
30
|
+
const invalidKeyLabels: Array<string> = [];
|
|
31
|
+
validateMessagesSegment(messages, invalidKeyLabels);
|
|
32
|
+
|
|
33
|
+
if (invalidKeyLabels.length > 0) {
|
|
34
|
+
onError(
|
|
35
|
+
new IntlError(
|
|
36
|
+
IntlErrorCode.INVALID_KEY,
|
|
37
|
+
`Namespace keys can not contain the character "." as this is used to express nesting. Please remove it or replace it with another character.\n\nInvalid ${
|
|
38
|
+
invalidKeyLabels.length === 1 ? 'key' : 'keys'
|
|
39
|
+
}: ${invalidKeyLabels.join(', ')}`
|
|
40
|
+
)
|
|
41
|
+
);
|
|
42
|
+
}
|
|
43
|
+
}
|