@ttoss/react-i18n 2.2.12 → 2.2.14

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.
Files changed (7) hide show
  1. package/dist/index.cjs +136 -0
  2. package/dist/index.d.cts +37 -0
  3. package/dist/index.d.mts +37 -0
  4. package/dist/index.mjs +84 -0
  5. package/package.json +7 -7
  6. package/dist/esm/index.js +0 -69
  7. package/dist/index.d.ts +0 -32
package/dist/index.cjs ADDED
@@ -0,0 +1,136 @@
1
+ /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
+ Object.defineProperty(exports, Symbol.toStringTag, {
3
+ value: 'Module'
4
+ });
5
+ //#region \0rolldown/runtime.js
6
+ var __create = Object.create;
7
+ var __defProp = Object.defineProperty;
8
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
9
+ var __getOwnPropNames = Object.getOwnPropertyNames;
10
+ var __getProtoOf = Object.getPrototypeOf;
11
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
15
+ key = keys[i];
16
+ if (!__hasOwnProp.call(to, key) && key !== except) {
17
+ __defProp(to, key, {
18
+ get: (k => from[k]).bind(null, key),
19
+ enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
20
+ });
21
+ }
22
+ }
23
+ }
24
+ return to;
25
+ };
26
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
27
+ value: mod,
28
+ enumerable: true
29
+ }) : target, mod));
30
+
31
+ //#endregion
32
+ let react = require("react");
33
+ let react$1 = __toESM(react, 1);
34
+ react = __toESM(react);
35
+ let react_intl = require("react-intl");
36
+ let react_jsx_runtime = require("react/jsx-runtime");
37
+
38
+ //#region src/i18Provider.tsx
39
+ /**
40
+ * `DEFAULT_LOCALE` must be `en` because is the default of the other modules.
41
+ */
42
+ const DEFAULT_LOCALE = "en";
43
+ const I18nConfigContext = react.createContext({
44
+ defaultLocale: "en",
45
+ messages: {},
46
+ setLocale: () => {
47
+ return null;
48
+ }
49
+ });
50
+ const I18nProvider = ({
51
+ children,
52
+ locale: initialLocale,
53
+ loadLocaleData,
54
+ ...intlConfig
55
+ }) => {
56
+ /**
57
+ * This is state is a internal state of the I18nProvider. Users modify it
58
+ * through the `setLocale` function or by changing the `locale` prop. It
59
+ * triggers the useEffect below to load the locale data.
60
+ */
61
+ const [locale, setLocale] = react.useState(initialLocale || "en");
62
+ /**
63
+ * This state exists because of the `loadLocaleData` async characteristic.
64
+ * It is used to store the locale and the loaded messages because `messages`
65
+ * can be undefined while they are being loaded. This way, we need to sync
66
+ * the `messages` with a `locale` before passing to the IntlProvider.
67
+ * If we pass `locale` defined and `messages` undefined, the IntlProvider
68
+ * will display a MISSING TRANSLATION error on console.
69
+ */
70
+ const [messagesAndLocale, setMessagesAndLocale] = react.useState({
71
+ locale: "en"
72
+ });
73
+ react.useEffect(() => {
74
+ if (loadLocaleData && locale)
75
+ /**
76
+ * https://stackoverflow.com/a/27760489/8786986
77
+ */
78
+ Promise.resolve(loadLocaleData(locale)).then(messages => {
79
+ setMessagesAndLocale({
80
+ messages,
81
+ locale
82
+ });
83
+ });
84
+ }, [loadLocaleData, locale]);
85
+ return /* @__PURE__ */(0, react_jsx_runtime.jsx)(I18nConfigContext.Provider, {
86
+ value: {
87
+ locale,
88
+ defaultLocale: "en",
89
+ messages: messagesAndLocale.messages,
90
+ setLocale,
91
+ ...intlConfig
92
+ },
93
+ children: /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_intl.IntlProvider, {
94
+ defaultLocale: "en",
95
+ locale: messagesAndLocale.locale,
96
+ messages: messagesAndLocale.messages,
97
+ ...intlConfig,
98
+ children: /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, {
99
+ children
100
+ })
101
+ })
102
+ });
103
+ };
104
+
105
+ //#endregion
106
+ //#region src/useI18n.ts
107
+ const useI18n = () => {
108
+ const intl = (0, react_intl.useIntl)();
109
+ return {
110
+ ...react$1.useContext(I18nConfigContext),
111
+ intl
112
+ };
113
+ };
114
+
115
+ //#endregion
116
+ exports.DEFAULT_LOCALE = DEFAULT_LOCALE;
117
+ Object.defineProperty(exports, 'FormattedMessage', {
118
+ enumerable: true,
119
+ get: function () {
120
+ return react_intl.FormattedMessage;
121
+ }
122
+ });
123
+ exports.I18nProvider = I18nProvider;
124
+ Object.defineProperty(exports, 'defineMessage', {
125
+ enumerable: true,
126
+ get: function () {
127
+ return react_intl.defineMessage;
128
+ }
129
+ });
130
+ Object.defineProperty(exports, 'defineMessages', {
131
+ enumerable: true,
132
+ get: function () {
133
+ return react_intl.defineMessages;
134
+ }
135
+ });
136
+ exports.useI18n = useI18n;
package/dist/index.d.cts ADDED
@@ -0,0 +1,37 @@
1
+
2
+ import * as React from "react";
3
+ import { FormattedMessage, IntlShape, MessageDescriptor, MessageFormatElement, defineMessage, defineMessages } from "react-intl";
4
+
5
+ //#region src/i18Provider.d.ts
6
+ type Messages = Record<string, string> | Record<string, MessageFormatElement[]>;
7
+ type LoadLocaleData = (locale: string) => Promise<Messages> | Messages;
8
+ type I18nProviderProps = {
9
+ locale?: string;
10
+ loadLocaleData?: LoadLocaleData;
11
+ children?: React.ReactNode;
12
+ onError?: (err: Error) => void;
13
+ };
14
+ /**
15
+ * `DEFAULT_LOCALE` must be `en` because is the default of the other modules.
16
+ */
17
+ declare const DEFAULT_LOCALE = "en";
18
+ declare const I18nProvider: ({
19
+ children,
20
+ locale: initialLocale,
21
+ loadLocaleData,
22
+ ...intlConfig
23
+ }: I18nProviderProps) => import("react/jsx-runtime").JSX.Element;
24
+ //#endregion
25
+ //#region src/useI18n.d.ts
26
+ declare const useI18n: () => {
27
+ intl: import("react-intl").IntlShape;
28
+ locale?: string | undefined;
29
+ loadLocaleData?: LoadLocaleData | undefined;
30
+ children?: React.ReactNode;
31
+ onError?: ((err: Error) => void) | undefined;
32
+ defaultLocale: string;
33
+ messages?: Messages;
34
+ setLocale: (language: string) => void;
35
+ };
36
+ //#endregion
37
+ export { DEFAULT_LOCALE, FormattedMessage, I18nProvider, type I18nProviderProps, type IntlShape, type LoadLocaleData, type MessageDescriptor, defineMessage, defineMessages, useI18n };
package/dist/index.d.mts ADDED
@@ -0,0 +1,37 @@
1
+
2
+ import * as React from "react";
3
+ import { FormattedMessage, IntlShape, MessageDescriptor, MessageFormatElement, defineMessage, defineMessages } from "react-intl";
4
+
5
+ //#region src/i18Provider.d.ts
6
+ type Messages = Record<string, string> | Record<string, MessageFormatElement[]>;
7
+ type LoadLocaleData = (locale: string) => Promise<Messages> | Messages;
8
+ type I18nProviderProps = {
9
+ locale?: string;
10
+ loadLocaleData?: LoadLocaleData;
11
+ children?: React.ReactNode;
12
+ onError?: (err: Error) => void;
13
+ };
14
+ /**
15
+ * `DEFAULT_LOCALE` must be `en` because is the default of the other modules.
16
+ */
17
+ declare const DEFAULT_LOCALE = "en";
18
+ declare const I18nProvider: ({
19
+ children,
20
+ locale: initialLocale,
21
+ loadLocaleData,
22
+ ...intlConfig
23
+ }: I18nProviderProps) => import("react/jsx-runtime").JSX.Element;
24
+ //#endregion
25
+ //#region src/useI18n.d.ts
26
+ declare const useI18n: () => {
27
+ intl: import("react-intl").IntlShape;
28
+ locale?: string | undefined;
29
+ loadLocaleData?: LoadLocaleData | undefined;
30
+ children?: React.ReactNode;
31
+ onError?: ((err: Error) => void) | undefined;
32
+ defaultLocale: string;
33
+ messages?: Messages;
34
+ setLocale: (language: string) => void;
35
+ };
36
+ //#endregion
37
+ export { DEFAULT_LOCALE, FormattedMessage, I18nProvider, type I18nProviderProps, type IntlShape, type LoadLocaleData, type MessageDescriptor, defineMessage, defineMessages, useI18n };
package/dist/index.mjs ADDED
@@ -0,0 +1,84 @@
1
+ /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
+ import * as React from "react";
3
+ import { FormattedMessage, IntlProvider, defineMessage, defineMessages, useIntl } from "react-intl";
4
+ import { Fragment, jsx } from "react/jsx-runtime";
5
+
6
+ //#region src/i18Provider.tsx
7
+ /**
8
+ * `DEFAULT_LOCALE` must be `en` because is the default of the other modules.
9
+ */
10
+ const DEFAULT_LOCALE = "en";
11
+ const I18nConfigContext = React.createContext({
12
+ defaultLocale: "en",
13
+ messages: {},
14
+ setLocale: () => {
15
+ return null;
16
+ }
17
+ });
18
+ const I18nProvider = ({
19
+ children,
20
+ locale: initialLocale,
21
+ loadLocaleData,
22
+ ...intlConfig
23
+ }) => {
24
+ /**
25
+ * This is state is a internal state of the I18nProvider. Users modify it
26
+ * through the `setLocale` function or by changing the `locale` prop. It
27
+ * triggers the useEffect below to load the locale data.
28
+ */
29
+ const [locale, setLocale] = React.useState(initialLocale || "en");
30
+ /**
31
+ * This state exists because of the `loadLocaleData` async characteristic.
32
+ * It is used to store the locale and the loaded messages because `messages`
33
+ * can be undefined while they are being loaded. This way, we need to sync
34
+ * the `messages` with a `locale` before passing to the IntlProvider.
35
+ * If we pass `locale` defined and `messages` undefined, the IntlProvider
36
+ * will display a MISSING TRANSLATION error on console.
37
+ */
38
+ const [messagesAndLocale, setMessagesAndLocale] = React.useState({
39
+ locale: "en"
40
+ });
41
+ React.useEffect(() => {
42
+ if (loadLocaleData && locale)
43
+ /**
44
+ * https://stackoverflow.com/a/27760489/8786986
45
+ */
46
+ Promise.resolve(loadLocaleData(locale)).then(messages => {
47
+ setMessagesAndLocale({
48
+ messages,
49
+ locale
50
+ });
51
+ });
52
+ }, [loadLocaleData, locale]);
53
+ return /* @__PURE__ */jsx(I18nConfigContext.Provider, {
54
+ value: {
55
+ locale,
56
+ defaultLocale: "en",
57
+ messages: messagesAndLocale.messages,
58
+ setLocale,
59
+ ...intlConfig
60
+ },
61
+ children: /* @__PURE__ */jsx(IntlProvider, {
62
+ defaultLocale: "en",
63
+ locale: messagesAndLocale.locale,
64
+ messages: messagesAndLocale.messages,
65
+ ...intlConfig,
66
+ children: /* @__PURE__ */jsx(Fragment, {
67
+ children
68
+ })
69
+ })
70
+ });
71
+ };
72
+
73
+ //#endregion
74
+ //#region src/useI18n.ts
75
+ const useI18n = () => {
76
+ const intl = useIntl();
77
+ return {
78
+ ...React.useContext(I18nConfigContext),
79
+ intl
80
+ };
81
+ };
82
+
83
+ //#endregion
84
+ export { DEFAULT_LOCALE, FormattedMessage, I18nProvider, defineMessage, defineMessages, useI18n };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ttoss/react-i18n",
3
- "version": "2.2.12",
3
+ "version": "2.2.14",
4
4
  "keywords": [
5
5
  "React",
6
6
  "ui",
@@ -35,12 +35,12 @@
35
35
  "@formatjs/cli": "^6.14.1",
36
36
  "@types/react": "^19.2.14",
37
37
  "jest": "^30.3.0",
38
- "react": "^19.2.4",
39
- "tsup": "^8.5.1",
38
+ "react": "^19.2.6",
39
+ "tsdown": "^0.22.0",
40
40
  "typescript": "~6.0.3",
41
- "@ttoss/config": "^1.37.11",
42
- "@ttoss/test-utils": "^4.2.11",
43
- "@ttoss/i18n-cli": "^0.8.11"
41
+ "@ttoss/config": "^1.37.13",
42
+ "@ttoss/test-utils": "^4.2.13",
43
+ "@ttoss/i18n-cli": "^0.8.13"
44
44
  },
45
45
  "peerDependencies": {
46
46
  "react": ">=16.8.0"
@@ -50,7 +50,7 @@
50
50
  "provenance": true
51
51
  },
52
52
  "scripts": {
53
- "build": "tsup",
53
+ "build": "tsdown",
54
54
  "dev": "pnpm --filter @docs/storybook run dev",
55
55
  "i18n": "ttoss-i18n --pattern 'tests/**/*.test.{ts,tsx}'",
56
56
  "pretest": "pnpm run i18n",
package/dist/esm/index.js DELETED
@@ -1,69 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- var __defProp = Object.defineProperty;
3
- var __name = (target, value) => __defProp(target, "name", {
4
- value,
5
- configurable: true
6
- });
7
-
8
- // src/i18Provider.tsx
9
- import * as React from "react";
10
- import { IntlProvider } from "react-intl";
11
- var DEFAULT_LOCALE = "en";
12
- var I18nConfigContext = /* @__PURE__ */React.createContext({
13
- defaultLocale: DEFAULT_LOCALE,
14
- messages: {},
15
- setLocale: /* @__PURE__ */__name(() => {
16
- return null;
17
- }, "setLocale")
18
- });
19
- var I18nProvider = /* @__PURE__ */__name(({
20
- children,
21
- locale: initialLocale,
22
- loadLocaleData,
23
- ...intlConfig
24
- }) => {
25
- const [locale, setLocale] = React.useState(initialLocale || DEFAULT_LOCALE);
26
- const [messagesAndLocale, setMessagesAndLocale] = React.useState({
27
- locale: DEFAULT_LOCALE
28
- });
29
- React.useEffect(() => {
30
- if (loadLocaleData && locale) {
31
- Promise.resolve(loadLocaleData(locale)).then(messages => {
32
- setMessagesAndLocale({
33
- messages,
34
- locale
35
- });
36
- });
37
- }
38
- }, [loadLocaleData, locale]);
39
- return /* @__PURE__ */React.createElement(I18nConfigContext.Provider, {
40
- value: {
41
- locale,
42
- defaultLocale: DEFAULT_LOCALE,
43
- messages: messagesAndLocale.messages,
44
- setLocale,
45
- ...intlConfig
46
- }
47
- }, /* @__PURE__ */React.createElement(IntlProvider, {
48
- defaultLocale: DEFAULT_LOCALE,
49
- locale: messagesAndLocale.locale,
50
- messages: messagesAndLocale.messages,
51
- ...intlConfig
52
- }, /* @__PURE__ */React.createElement(React.Fragment, null, children)));
53
- }, "I18nProvider");
54
-
55
- // src/useI18n.ts
56
- import * as React2 from "react";
57
- import { useIntl } from "react-intl";
58
- var useI18n = /* @__PURE__ */__name(() => {
59
- const intl = useIntl();
60
- const config = React2.useContext(I18nConfigContext);
61
- return {
62
- ...config,
63
- intl
64
- };
65
- }, "useI18n");
66
-
67
- // src/index.ts
68
- import { defineMessage, defineMessages, FormattedMessage } from "react-intl";
69
- export { DEFAULT_LOCALE, FormattedMessage, I18nProvider, defineMessage, defineMessages, useI18n };
package/dist/index.d.ts DELETED
@@ -1,32 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import * as react_intl from 'react-intl';
4
- import { MessageFormatElement } from 'react-intl';
5
- export { FormattedMessage, IntlShape, MessageDescriptor, defineMessage, defineMessages } from 'react-intl';
6
-
7
- type Messages = Record<string, string> | Record<string, MessageFormatElement[]>;
8
- type LoadLocaleData = (locale: string) => Promise<Messages> | Messages;
9
- type I18nProviderProps = {
10
- locale?: string;
11
- loadLocaleData?: LoadLocaleData;
12
- children?: React.ReactNode;
13
- onError?: (err: Error) => void;
14
- };
15
- /**
16
- * `DEFAULT_LOCALE` must be `en` because is the default of the other modules.
17
- */
18
- declare const DEFAULT_LOCALE = "en";
19
- declare const I18nProvider: ({ children, locale: initialLocale, loadLocaleData, ...intlConfig }: I18nProviderProps) => react_jsx_runtime.JSX.Element;
20
-
21
- declare const useI18n: () => {
22
- intl: react_intl.IntlShape;
23
- locale?: string | undefined;
24
- loadLocaleData?: LoadLocaleData | undefined;
25
- children?: React.ReactNode;
26
- onError?: ((err: Error) => void) | undefined;
27
- defaultLocale: string;
28
- messages?: Messages;
29
- setLocale: (language: string) => void;
30
- };
31
-
32
- export { DEFAULT_LOCALE, I18nProvider, type I18nProviderProps, type LoadLocaleData, useI18n };