@wordpress/react-i18n 4.31.1-next.f56bd8138.0 → 4.32.1-next.47f435fc9.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/CHANGELOG.md +2 -0
- package/build/index.js +44 -103
- package/build/index.js.map +7 -1
- package/build-module/index.js +24 -93
- package/build-module/index.js.map +7 -1
- package/package.json +12 -5
package/CHANGELOG.md
CHANGED
package/build/index.js
CHANGED
|
@@ -1,27 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.
|
|
4
|
-
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
var index_exports = {};
|
|
20
|
+
__export(index_exports, {
|
|
21
|
+
I18nProvider: () => I18nProvider,
|
|
22
|
+
useI18n: () => useI18n,
|
|
23
|
+
withI18n: () => withI18n
|
|
5
24
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
var
|
|
10
|
-
var _i18n = require("@wordpress/i18n");
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
-
/**
|
|
13
|
-
* External dependencies
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* WordPress dependencies
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* Utility to make a new context value
|
|
22
|
-
*
|
|
23
|
-
* @param i18n
|
|
24
|
-
*/
|
|
25
|
+
module.exports = __toCommonJS(index_exports);
|
|
26
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
27
|
+
var import_element = require("@wordpress/element");
|
|
28
|
+
var import_i18n = require("@wordpress/i18n");
|
|
25
29
|
function makeContextValue(i18n) {
|
|
26
30
|
return {
|
|
27
31
|
__: i18n.__.bind(i18n),
|
|
@@ -32,92 +36,29 @@ function makeContextValue(i18n) {
|
|
|
32
36
|
hasTranslation: i18n.hasTranslation.bind(i18n)
|
|
33
37
|
};
|
|
34
38
|
}
|
|
35
|
-
const I18nContext = (0,
|
|
36
|
-
I18nContext.displayName =
|
|
37
|
-
/**
|
|
38
|
-
* The `I18nProvider` should be mounted above any localized components:
|
|
39
|
-
*
|
|
40
|
-
* @example
|
|
41
|
-
* ```js
|
|
42
|
-
* import { createI18n } from '@wordpress/i18n';
|
|
43
|
-
* import { I18nProvider } from '@wordpress/react-i18n';
|
|
44
|
-
* const i18n = createI18n();
|
|
45
|
-
*
|
|
46
|
-
* ReactDom.render(
|
|
47
|
-
* <I18nProvider i18n={ i18n }>
|
|
48
|
-
* <App />
|
|
49
|
-
* </I18nProvider>,
|
|
50
|
-
* el
|
|
51
|
-
* );
|
|
52
|
-
* ```
|
|
53
|
-
*
|
|
54
|
-
* You can also instantiate the provider without the `i18n` prop. In that case it will use the
|
|
55
|
-
* default `I18n` instance exported from `@wordpress/i18n`.
|
|
56
|
-
*
|
|
57
|
-
* @param props i18n provider props.
|
|
58
|
-
* @return Children wrapped in the I18nProvider.
|
|
59
|
-
*/
|
|
39
|
+
const I18nContext = (0, import_element.createContext)(makeContextValue(import_i18n.defaultI18n));
|
|
40
|
+
I18nContext.displayName = "I18nContext";
|
|
60
41
|
function I18nProvider(props) {
|
|
61
|
-
const {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
// Rerender translations whenever the i18n instance fires a change event.
|
|
68
|
-
(0, _element.useEffect)(() => i18n.subscribe(forceUpdate), [i18n]);
|
|
69
|
-
const value = (0, _element.useMemo)(() => makeContextValue(i18n), [i18n, update]);
|
|
70
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(I18nContext.Provider, {
|
|
71
|
-
value: value,
|
|
72
|
-
children: children
|
|
73
|
-
});
|
|
42
|
+
const { children, i18n = import_i18n.defaultI18n } = props;
|
|
43
|
+
const [update, forceUpdate] = (0, import_element.useReducer)(() => [], []);
|
|
44
|
+
(0, import_element.useEffect)(() => i18n.subscribe(forceUpdate), [i18n]);
|
|
45
|
+
const value = (0, import_element.useMemo)(() => makeContextValue(i18n), [i18n, update]);
|
|
46
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(I18nContext.Provider, { value, children });
|
|
74
47
|
}
|
|
75
|
-
|
|
76
|
-
/**
|
|
77
|
-
* React hook providing access to i18n functions. It exposes the `__`, `_x`, `_n`, `_nx`,
|
|
78
|
-
* `isRTL` and `hasTranslation` functions from [`@wordpress/i18n`](../i18n).
|
|
79
|
-
* Refer to their documentation there.
|
|
80
|
-
*
|
|
81
|
-
* @example
|
|
82
|
-
* ```js
|
|
83
|
-
* import { useI18n } from '@wordpress/react-i18n';
|
|
84
|
-
*
|
|
85
|
-
* function MyComponent() {
|
|
86
|
-
* const { __ } = useI18n();
|
|
87
|
-
* return __( 'Hello, world!' );
|
|
88
|
-
* }
|
|
89
|
-
* ```
|
|
90
|
-
*/
|
|
91
|
-
const useI18n = () => (0, _element.useContext)(I18nContext);
|
|
92
|
-
exports.useI18n = useI18n;
|
|
93
|
-
/**
|
|
94
|
-
* React higher-order component that passes the i18n translate functions (the same set
|
|
95
|
-
* as exposed by the `useI18n` hook) to the wrapped component as props.
|
|
96
|
-
*
|
|
97
|
-
* @example
|
|
98
|
-
* ```js
|
|
99
|
-
* import { withI18n } from '@wordpress/react-i18n';
|
|
100
|
-
*
|
|
101
|
-
* function MyComponent( { __ } ) {
|
|
102
|
-
* return __( 'Hello, world!' );
|
|
103
|
-
* }
|
|
104
|
-
*
|
|
105
|
-
* export default withI18n( MyComponent );
|
|
106
|
-
* ```
|
|
107
|
-
*
|
|
108
|
-
* @param InnerComponent React component to be wrapped and receive the i18n functions like `__`
|
|
109
|
-
* @return The wrapped component
|
|
110
|
-
*/
|
|
48
|
+
const useI18n = () => (0, import_element.useContext)(I18nContext);
|
|
111
49
|
function withI18n(InnerComponent) {
|
|
112
|
-
const EnhancedComponent = props => {
|
|
50
|
+
const EnhancedComponent = (props) => {
|
|
113
51
|
const i18nProps = useI18n();
|
|
114
|
-
return
|
|
115
|
-
...props,
|
|
116
|
-
...i18nProps
|
|
117
|
-
});
|
|
52
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InnerComponent, { ...props, ...i18nProps });
|
|
118
53
|
};
|
|
119
|
-
const innerComponentName = InnerComponent.displayName || InnerComponent.name ||
|
|
54
|
+
const innerComponentName = InnerComponent.displayName || InnerComponent.name || "Component";
|
|
120
55
|
EnhancedComponent.displayName = `WithI18n(${innerComponentName})`;
|
|
121
56
|
return EnhancedComponent;
|
|
122
57
|
}
|
|
123
|
-
|
|
58
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
59
|
+
0 && (module.exports = {
|
|
60
|
+
I18nProvider,
|
|
61
|
+
useI18n,
|
|
62
|
+
withI18n
|
|
63
|
+
});
|
|
64
|
+
//# sourceMappingURL=index.js.map
|
package/build/index.js.map
CHANGED
|
@@ -1 +1,7 @@
|
|
|
1
|
-
{
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/index.tsx"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type {\n\tComponentType,\n\tFunctionComponent,\n\tPropsWithChildren,\n} from 'react';\nimport type { Subtract } from 'utility-types';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseReducer,\n} from '@wordpress/element';\nimport { defaultI18n } from '@wordpress/i18n';\nimport type { I18n } from '@wordpress/i18n';\ninterface I18nContextProps {\n\t__: I18n[ '__' ];\n\t_x: I18n[ '_x' ];\n\t_n: I18n[ '_n' ];\n\t_nx: I18n[ '_nx' ];\n\tisRTL: I18n[ 'isRTL' ];\n\thasTranslation: I18n[ 'hasTranslation' ];\n}\n\n/**\n * Utility to make a new context value\n *\n * @param i18n\n */\nfunction makeContextValue( i18n: I18n ): I18nContextProps {\n\treturn {\n\t\t__: i18n.__.bind( i18n ),\n\t\t_x: i18n._x.bind( i18n ),\n\t\t_n: i18n._n.bind( i18n ),\n\t\t_nx: i18n._nx.bind( i18n ),\n\t\tisRTL: i18n.isRTL.bind( i18n ),\n\t\thasTranslation: i18n.hasTranslation.bind( i18n ),\n\t};\n}\n\nconst I18nContext = createContext( makeContextValue( defaultI18n ) );\nI18nContext.displayName = 'I18nContext';\n\ntype I18nProviderProps = PropsWithChildren< { i18n: I18n } >;\n\n/**\n * The `I18nProvider` should be mounted above any localized components:\n *\n * @example\n * ```js\n * import { createI18n } from '@wordpress/i18n';\n * import { I18nProvider } from '@wordpress/react-i18n';\n * const i18n = createI18n();\n *\n * ReactDom.render(\n * \t<I18nProvider i18n={ i18n }>\n * \t\t<App />\n * \t</I18nProvider>,\n * \tel\n * );\n * ```\n *\n * You can also instantiate the provider without the `i18n` prop. In that case it will use the\n * default `I18n` instance exported from `@wordpress/i18n`.\n *\n * @param props i18n provider props.\n * @return Children wrapped in the I18nProvider.\n */\nexport function I18nProvider( props: I18nProviderProps ): JSX.Element {\n\tconst { children, i18n = defaultI18n } = props;\n\tconst [ update, forceUpdate ] = useReducer( () => [], [] );\n\n\t// Rerender translations whenever the i18n instance fires a change event.\n\tuseEffect( () => i18n.subscribe( forceUpdate ), [ i18n ] );\n\n\tconst value = useMemo( () => makeContextValue( i18n ), [ i18n, update ] );\n\n\treturn (\n\t\t<I18nContext.Provider value={ value }>\n\t\t\t{ children }\n\t\t</I18nContext.Provider>\n\t);\n}\n\n/**\n * React hook providing access to i18n functions. It exposes the `__`, `_x`, `_n`, `_nx`,\n * `isRTL` and `hasTranslation` functions from [`@wordpress/i18n`](../i18n).\n * Refer to their documentation there.\n *\n * @example\n * ```js\n * import { useI18n } from '@wordpress/react-i18n';\n *\n * function MyComponent() {\n * \tconst { __ } = useI18n();\n * \treturn __( 'Hello, world!' );\n * }\n * ```\n */\nexport const useI18n = () => useContext( I18nContext );\n\ntype PropsAndI18n< P > = Pick<\n\tP,\n\tExclude< keyof P, '__' | '_x' | '_n' | '_nx' | 'isRTL' | 'hasTranslation' >\n>;\n\n/**\n * React higher-order component that passes the i18n translate functions (the same set\n * as exposed by the `useI18n` hook) to the wrapped component as props.\n *\n * @example\n * ```js\n * import { withI18n } from '@wordpress/react-i18n';\n *\n * function MyComponent( { __ } ) {\n * \treturn __( 'Hello, world!' );\n * }\n *\n * export default withI18n( MyComponent );\n * ```\n *\n * @param InnerComponent React component to be wrapped and receive the i18n functions like `__`\n * @return The wrapped component\n */\nexport function withI18n< P extends I18nContextProps >(\n\tInnerComponent: ComponentType< P >\n): FunctionComponent< PropsAndI18n< P > > {\n\tconst EnhancedComponent: ComponentType<\n\t\tSubtract< P, I18nContextProps >\n\t> = ( props ) => {\n\t\tconst i18nProps = useI18n();\n\t\treturn <InnerComponent { ...( props as P ) } { ...i18nProps } />;\n\t};\n\tconst innerComponentName =\n\t\tInnerComponent.displayName || InnerComponent.name || 'Component';\n\tEnhancedComponent.displayName = `WithI18n(${ innerComponentName })`;\n\treturn EnhancedComponent;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqFE;AAxEF,qBAMO;AACP,kBAA4B;AAgB5B,SAAS,iBAAkB,MAA+B;AACzD,SAAO;AAAA,IACN,IAAI,KAAK,GAAG,KAAM,IAAK;AAAA,IACvB,IAAI,KAAK,GAAG,KAAM,IAAK;AAAA,IACvB,IAAI,KAAK,GAAG,KAAM,IAAK;AAAA,IACvB,KAAK,KAAK,IAAI,KAAM,IAAK;AAAA,IACzB,OAAO,KAAK,MAAM,KAAM,IAAK;AAAA,IAC7B,gBAAgB,KAAK,eAAe,KAAM,IAAK;AAAA,EAChD;AACD;AAEA,MAAM,kBAAc,8BAAe,iBAAkB,uBAAY,CAAE;AACnE,YAAY,cAAc;AA2BnB,SAAS,aAAc,OAAwC;AACrE,QAAM,EAAE,UAAU,OAAO,wBAAY,IAAI;AACzC,QAAM,CAAE,QAAQ,WAAY,QAAI,2BAAY,MAAM,CAAC,GAAG,CAAC,CAAE;AAGzD,gCAAW,MAAM,KAAK,UAAW,WAAY,GAAG,CAAE,IAAK,CAAE;AAEzD,QAAM,YAAQ,wBAAS,MAAM,iBAAkB,IAAK,GAAG,CAAE,MAAM,MAAO,CAAE;AAExE,SACC,4CAAC,YAAY,UAAZ,EAAqB,OACnB,UACH;AAEF;AAiBO,MAAM,UAAU,UAAM,2BAAY,WAAY;AAyB9C,SAAS,SACf,gBACyC;AACzC,QAAM,oBAEF,CAAE,UAAW;AAChB,UAAM,YAAY,QAAQ;AAC1B,WAAO,4CAAC,kBAAiB,GAAK,OAAiB,GAAG,WAAY;AAAA,EAC/D;AACA,QAAM,qBACL,eAAe,eAAe,eAAe,QAAQ;AACtD,oBAAkB,cAAc,YAAa,kBAAmB;AAChE,SAAO;AACR;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/build-module/index.js
CHANGED
|
@@ -1,18 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
import { defaultI18n } from
|
|
10
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
|
-
/**
|
|
12
|
-
* Utility to make a new context value
|
|
13
|
-
*
|
|
14
|
-
* @param i18n
|
|
15
|
-
*/
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import {
|
|
3
|
+
createContext,
|
|
4
|
+
useContext,
|
|
5
|
+
useEffect,
|
|
6
|
+
useMemo,
|
|
7
|
+
useReducer
|
|
8
|
+
} from "@wordpress/element";
|
|
9
|
+
import { defaultI18n } from "@wordpress/i18n";
|
|
16
10
|
function makeContextValue(i18n) {
|
|
17
11
|
return {
|
|
18
12
|
__: i18n.__.bind(i18n),
|
|
@@ -24,90 +18,27 @@ function makeContextValue(i18n) {
|
|
|
24
18
|
};
|
|
25
19
|
}
|
|
26
20
|
const I18nContext = createContext(makeContextValue(defaultI18n));
|
|
27
|
-
I18nContext.displayName =
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
*
|
|
31
|
-
* @example
|
|
32
|
-
* ```js
|
|
33
|
-
* import { createI18n } from '@wordpress/i18n';
|
|
34
|
-
* import { I18nProvider } from '@wordpress/react-i18n';
|
|
35
|
-
* const i18n = createI18n();
|
|
36
|
-
*
|
|
37
|
-
* ReactDom.render(
|
|
38
|
-
* <I18nProvider i18n={ i18n }>
|
|
39
|
-
* <App />
|
|
40
|
-
* </I18nProvider>,
|
|
41
|
-
* el
|
|
42
|
-
* );
|
|
43
|
-
* ```
|
|
44
|
-
*
|
|
45
|
-
* You can also instantiate the provider without the `i18n` prop. In that case it will use the
|
|
46
|
-
* default `I18n` instance exported from `@wordpress/i18n`.
|
|
47
|
-
*
|
|
48
|
-
* @param props i18n provider props.
|
|
49
|
-
* @return Children wrapped in the I18nProvider.
|
|
50
|
-
*/
|
|
51
|
-
export function I18nProvider(props) {
|
|
52
|
-
const {
|
|
53
|
-
children,
|
|
54
|
-
i18n = defaultI18n
|
|
55
|
-
} = props;
|
|
21
|
+
I18nContext.displayName = "I18nContext";
|
|
22
|
+
function I18nProvider(props) {
|
|
23
|
+
const { children, i18n = defaultI18n } = props;
|
|
56
24
|
const [update, forceUpdate] = useReducer(() => [], []);
|
|
57
|
-
|
|
58
|
-
// Rerender translations whenever the i18n instance fires a change event.
|
|
59
25
|
useEffect(() => i18n.subscribe(forceUpdate), [i18n]);
|
|
60
26
|
const value = useMemo(() => makeContextValue(i18n), [i18n, update]);
|
|
61
|
-
return
|
|
62
|
-
value: value,
|
|
63
|
-
children: children
|
|
64
|
-
});
|
|
27
|
+
return /* @__PURE__ */ jsx(I18nContext.Provider, { value, children });
|
|
65
28
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
* `isRTL` and `hasTranslation` functions from [`@wordpress/i18n`](../i18n).
|
|
70
|
-
* Refer to their documentation there.
|
|
71
|
-
*
|
|
72
|
-
* @example
|
|
73
|
-
* ```js
|
|
74
|
-
* import { useI18n } from '@wordpress/react-i18n';
|
|
75
|
-
*
|
|
76
|
-
* function MyComponent() {
|
|
77
|
-
* const { __ } = useI18n();
|
|
78
|
-
* return __( 'Hello, world!' );
|
|
79
|
-
* }
|
|
80
|
-
* ```
|
|
81
|
-
*/
|
|
82
|
-
export const useI18n = () => useContext(I18nContext);
|
|
83
|
-
/**
|
|
84
|
-
* React higher-order component that passes the i18n translate functions (the same set
|
|
85
|
-
* as exposed by the `useI18n` hook) to the wrapped component as props.
|
|
86
|
-
*
|
|
87
|
-
* @example
|
|
88
|
-
* ```js
|
|
89
|
-
* import { withI18n } from '@wordpress/react-i18n';
|
|
90
|
-
*
|
|
91
|
-
* function MyComponent( { __ } ) {
|
|
92
|
-
* return __( 'Hello, world!' );
|
|
93
|
-
* }
|
|
94
|
-
*
|
|
95
|
-
* export default withI18n( MyComponent );
|
|
96
|
-
* ```
|
|
97
|
-
*
|
|
98
|
-
* @param InnerComponent React component to be wrapped and receive the i18n functions like `__`
|
|
99
|
-
* @return The wrapped component
|
|
100
|
-
*/
|
|
101
|
-
export function withI18n(InnerComponent) {
|
|
102
|
-
const EnhancedComponent = props => {
|
|
29
|
+
const useI18n = () => useContext(I18nContext);
|
|
30
|
+
function withI18n(InnerComponent) {
|
|
31
|
+
const EnhancedComponent = (props) => {
|
|
103
32
|
const i18nProps = useI18n();
|
|
104
|
-
return
|
|
105
|
-
...props,
|
|
106
|
-
...i18nProps
|
|
107
|
-
});
|
|
33
|
+
return /* @__PURE__ */ jsx(InnerComponent, { ...props, ...i18nProps });
|
|
108
34
|
};
|
|
109
|
-
const innerComponentName = InnerComponent.displayName || InnerComponent.name ||
|
|
35
|
+
const innerComponentName = InnerComponent.displayName || InnerComponent.name || "Component";
|
|
110
36
|
EnhancedComponent.displayName = `WithI18n(${innerComponentName})`;
|
|
111
37
|
return EnhancedComponent;
|
|
112
38
|
}
|
|
113
|
-
|
|
39
|
+
export {
|
|
40
|
+
I18nProvider,
|
|
41
|
+
useI18n,
|
|
42
|
+
withI18n
|
|
43
|
+
};
|
|
44
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1,7 @@
|
|
|
1
|
-
{
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/index.tsx"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type {\n\tComponentType,\n\tFunctionComponent,\n\tPropsWithChildren,\n} from 'react';\nimport type { Subtract } from 'utility-types';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseReducer,\n} from '@wordpress/element';\nimport { defaultI18n } from '@wordpress/i18n';\nimport type { I18n } from '@wordpress/i18n';\ninterface I18nContextProps {\n\t__: I18n[ '__' ];\n\t_x: I18n[ '_x' ];\n\t_n: I18n[ '_n' ];\n\t_nx: I18n[ '_nx' ];\n\tisRTL: I18n[ 'isRTL' ];\n\thasTranslation: I18n[ 'hasTranslation' ];\n}\n\n/**\n * Utility to make a new context value\n *\n * @param i18n\n */\nfunction makeContextValue( i18n: I18n ): I18nContextProps {\n\treturn {\n\t\t__: i18n.__.bind( i18n ),\n\t\t_x: i18n._x.bind( i18n ),\n\t\t_n: i18n._n.bind( i18n ),\n\t\t_nx: i18n._nx.bind( i18n ),\n\t\tisRTL: i18n.isRTL.bind( i18n ),\n\t\thasTranslation: i18n.hasTranslation.bind( i18n ),\n\t};\n}\n\nconst I18nContext = createContext( makeContextValue( defaultI18n ) );\nI18nContext.displayName = 'I18nContext';\n\ntype I18nProviderProps = PropsWithChildren< { i18n: I18n } >;\n\n/**\n * The `I18nProvider` should be mounted above any localized components:\n *\n * @example\n * ```js\n * import { createI18n } from '@wordpress/i18n';\n * import { I18nProvider } from '@wordpress/react-i18n';\n * const i18n = createI18n();\n *\n * ReactDom.render(\n * \t<I18nProvider i18n={ i18n }>\n * \t\t<App />\n * \t</I18nProvider>,\n * \tel\n * );\n * ```\n *\n * You can also instantiate the provider without the `i18n` prop. In that case it will use the\n * default `I18n` instance exported from `@wordpress/i18n`.\n *\n * @param props i18n provider props.\n * @return Children wrapped in the I18nProvider.\n */\nexport function I18nProvider( props: I18nProviderProps ): JSX.Element {\n\tconst { children, i18n = defaultI18n } = props;\n\tconst [ update, forceUpdate ] = useReducer( () => [], [] );\n\n\t// Rerender translations whenever the i18n instance fires a change event.\n\tuseEffect( () => i18n.subscribe( forceUpdate ), [ i18n ] );\n\n\tconst value = useMemo( () => makeContextValue( i18n ), [ i18n, update ] );\n\n\treturn (\n\t\t<I18nContext.Provider value={ value }>\n\t\t\t{ children }\n\t\t</I18nContext.Provider>\n\t);\n}\n\n/**\n * React hook providing access to i18n functions. It exposes the `__`, `_x`, `_n`, `_nx`,\n * `isRTL` and `hasTranslation` functions from [`@wordpress/i18n`](../i18n).\n * Refer to their documentation there.\n *\n * @example\n * ```js\n * import { useI18n } from '@wordpress/react-i18n';\n *\n * function MyComponent() {\n * \tconst { __ } = useI18n();\n * \treturn __( 'Hello, world!' );\n * }\n * ```\n */\nexport const useI18n = () => useContext( I18nContext );\n\ntype PropsAndI18n< P > = Pick<\n\tP,\n\tExclude< keyof P, '__' | '_x' | '_n' | '_nx' | 'isRTL' | 'hasTranslation' >\n>;\n\n/**\n * React higher-order component that passes the i18n translate functions (the same set\n * as exposed by the `useI18n` hook) to the wrapped component as props.\n *\n * @example\n * ```js\n * import { withI18n } from '@wordpress/react-i18n';\n *\n * function MyComponent( { __ } ) {\n * \treturn __( 'Hello, world!' );\n * }\n *\n * export default withI18n( MyComponent );\n * ```\n *\n * @param InnerComponent React component to be wrapped and receive the i18n functions like `__`\n * @return The wrapped component\n */\nexport function withI18n< P extends I18nContextProps >(\n\tInnerComponent: ComponentType< P >\n): FunctionComponent< PropsAndI18n< P > > {\n\tconst EnhancedComponent: ComponentType<\n\t\tSubtract< P, I18nContextProps >\n\t> = ( props ) => {\n\t\tconst i18nProps = useI18n();\n\t\treturn <InnerComponent { ...( props as P ) } { ...i18nProps } />;\n\t};\n\tconst innerComponentName =\n\t\tInnerComponent.displayName || InnerComponent.name || 'Component';\n\tEnhancedComponent.displayName = `WithI18n(${ innerComponentName })`;\n\treturn EnhancedComponent;\n}\n"],
|
|
5
|
+
"mappings": "AAqFE;AAxEF;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,mBAAmB;AAgB5B,SAAS,iBAAkB,MAA+B;AACzD,SAAO;AAAA,IACN,IAAI,KAAK,GAAG,KAAM,IAAK;AAAA,IACvB,IAAI,KAAK,GAAG,KAAM,IAAK;AAAA,IACvB,IAAI,KAAK,GAAG,KAAM,IAAK;AAAA,IACvB,KAAK,KAAK,IAAI,KAAM,IAAK;AAAA,IACzB,OAAO,KAAK,MAAM,KAAM,IAAK;AAAA,IAC7B,gBAAgB,KAAK,eAAe,KAAM,IAAK;AAAA,EAChD;AACD;AAEA,MAAM,cAAc,cAAe,iBAAkB,WAAY,CAAE;AACnE,YAAY,cAAc;AA2BnB,SAAS,aAAc,OAAwC;AACrE,QAAM,EAAE,UAAU,OAAO,YAAY,IAAI;AACzC,QAAM,CAAE,QAAQ,WAAY,IAAI,WAAY,MAAM,CAAC,GAAG,CAAC,CAAE;AAGzD,YAAW,MAAM,KAAK,UAAW,WAAY,GAAG,CAAE,IAAK,CAAE;AAEzD,QAAM,QAAQ,QAAS,MAAM,iBAAkB,IAAK,GAAG,CAAE,MAAM,MAAO,CAAE;AAExE,SACC,oBAAC,YAAY,UAAZ,EAAqB,OACnB,UACH;AAEF;AAiBO,MAAM,UAAU,MAAM,WAAY,WAAY;AAyB9C,SAAS,SACf,gBACyC;AACzC,QAAM,oBAEF,CAAE,UAAW;AAChB,UAAM,YAAY,QAAQ;AAC1B,WAAO,oBAAC,kBAAiB,GAAK,OAAiB,GAAG,WAAY;AAAA,EAC/D;AACA,QAAM,qBACL,eAAe,eAAe,eAAe,QAAQ;AACtD,oBAAkB,cAAc,YAAa,kBAAmB;AAChE,SAAO;AACR;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/react-i18n",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.32.1-next.47f435fc9.0",
|
|
4
4
|
"description": "React bindings for @wordpress/i18n.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -24,18 +24,25 @@
|
|
|
24
24
|
},
|
|
25
25
|
"main": "build/index.js",
|
|
26
26
|
"module": "build-module/index.js",
|
|
27
|
+
"exports": {
|
|
28
|
+
".": {
|
|
29
|
+
"types": "./build-types/index.d.ts",
|
|
30
|
+
"import": "./build-module/index.js",
|
|
31
|
+
"require": "./build/index.js"
|
|
32
|
+
},
|
|
33
|
+
"./package.json": "./package.json"
|
|
34
|
+
},
|
|
27
35
|
"react-native": "src/index",
|
|
28
36
|
"wpScript": true,
|
|
29
37
|
"types": "build-types",
|
|
30
38
|
"sideEffects": false,
|
|
31
39
|
"dependencies": {
|
|
32
|
-
"@
|
|
33
|
-
"@wordpress/
|
|
34
|
-
"@wordpress/i18n": "^6.4.1-next.f56bd8138.0",
|
|
40
|
+
"@wordpress/element": "^6.32.1-next.47f435fc9.0",
|
|
41
|
+
"@wordpress/i18n": "^6.5.1-next.47f435fc9.0",
|
|
35
42
|
"utility-types": "^3.10.0"
|
|
36
43
|
},
|
|
37
44
|
"publishConfig": {
|
|
38
45
|
"access": "public"
|
|
39
46
|
},
|
|
40
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "9720f22c138771d2ed1a0522725c3cdf1c242953"
|
|
41
48
|
}
|