@wordpress/react-i18n 3.56.0 → 4.0.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 CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
+ ## 4.0.0 (2024-05-31)
6
+
7
+ ### Breaking Changes
8
+
9
+ - Increase the minimum required Node.js version to v18.12.0 matching long-term support releases ([#31270](https://github.com/WordPress/gutenberg/pull/61930)). Learn more about [Node.js releases](https://nodejs.org/en/about/previous-releases).
10
+
5
11
  ## 3.56.0 (2024-05-16)
6
12
 
7
13
  ## 3.55.0 (2024-05-02)
package/build/index.js CHANGED
@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.I18nProvider = I18nProvider;
7
7
  exports.useI18n = void 0;
8
8
  exports.withI18n = withI18n;
9
- var _react = require("react");
10
9
  var _element = require("@wordpress/element");
11
10
  var _i18n = require("@wordpress/i18n");
11
+ var _jsxRuntime = require("react/jsx-runtime");
12
12
  /**
13
13
  * External dependencies
14
14
  */
@@ -66,9 +66,10 @@ function I18nProvider(props) {
66
66
  // Rerender translations whenever the i18n instance fires a change event.
67
67
  (0, _element.useEffect)(() => i18n.subscribe(forceUpdate), [i18n]);
68
68
  const value = (0, _element.useMemo)(() => makeContextValue(i18n), [i18n, update]);
69
- return (0, _react.createElement)(I18nContext.Provider, {
70
- value: value
71
- }, children);
69
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(I18nContext.Provider, {
70
+ value: value,
71
+ children: children
72
+ });
72
73
  }
73
74
 
74
75
  /**
@@ -109,7 +110,7 @@ exports.useI18n = useI18n;
109
110
  function withI18n(InnerComponent) {
110
111
  const EnhancedComponent = props => {
111
112
  const i18nProps = useI18n();
112
- return (0, _react.createElement)(InnerComponent, {
113
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(InnerComponent, {
113
114
  ...props,
114
115
  ...i18nProps
115
116
  });
@@ -1 +1 @@
1
- {"version":3,"names":["_element","require","_i18n","makeContextValue","i18n","__","bind","_x","_n","_nx","isRTL","hasTranslation","I18nContext","createContext","defaultI18n","I18nProvider","props","children","update","forceUpdate","useReducer","useEffect","subscribe","value","useMemo","_react","createElement","Provider","useI18n","useContext","exports","withI18n","InnerComponent","EnhancedComponent","i18nProps","innerComponentName","displayName","name"],"sources":["@wordpress/react-i18n/src/index.tsx"],"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 ) );\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"],"mappings":";;;;;;;;;AAaA,IAAAA,QAAA,GAAAC,OAAA;AAOA,IAAAC,KAAA,GAAAD,OAAA;AApBA;AACA;AACA;;AAQA;AACA;AACA;;AAmBA;AACA;AACA;AACA;AACA;AACA,SAASE,gBAAgBA,CAAEC,IAAU,EAAqB;EACzD,OAAO;IACNC,EAAE,EAAED,IAAI,CAACC,EAAE,CAACC,IAAI,CAAEF,IAAK,CAAC;IACxBG,EAAE,EAAEH,IAAI,CAACG,EAAE,CAACD,IAAI,CAAEF,IAAK,CAAC;IACxBI,EAAE,EAAEJ,IAAI,CAACI,EAAE,CAACF,IAAI,CAAEF,IAAK,CAAC;IACxBK,GAAG,EAAEL,IAAI,CAACK,GAAG,CAACH,IAAI,CAAEF,IAAK,CAAC;IAC1BM,KAAK,EAAEN,IAAI,CAACM,KAAK,CAACJ,IAAI,CAAEF,IAAK,CAAC;IAC9BO,cAAc,EAAEP,IAAI,CAACO,cAAc,CAACL,IAAI,CAAEF,IAAK;EAChD,CAAC;AACF;AAEA,MAAMQ,WAAW,GAAG,IAAAC,sBAAa,EAAEV,gBAAgB,CAAEW,iBAAY,CAAE,CAAC;AAIpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,YAAYA,CAAEC,KAAwB,EAAgB;EACrE,MAAM;IAAEC,QAAQ;IAAEb,IAAI,GAAGU;EAAY,CAAC,GAAGE,KAAK;EAC9C,MAAM,CAAEE,MAAM,EAAEC,WAAW,CAAE,GAAG,IAAAC,mBAAU,EAAE,MAAM,EAAE,EAAE,EAAG,CAAC;;EAE1D;EACA,IAAAC,kBAAS,EAAE,MAAMjB,IAAI,CAACkB,SAAS,CAAEH,WAAY,CAAC,EAAE,CAAEf,IAAI,CAAG,CAAC;EAE1D,MAAMmB,KAAK,GAAG,IAAAC,gBAAO,EAAE,MAAMrB,gBAAgB,CAAEC,IAAK,CAAC,EAAE,CAAEA,IAAI,EAAEc,MAAM,CAAG,CAAC;EAEzE,OACC,IAAAO,MAAA,CAAAC,aAAA,EAACd,WAAW,CAACe,QAAQ;IAACJ,KAAK,EAAGA;EAAO,GAClCN,QACmB,CAAC;AAEzB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMW,OAAO,GAAGA,CAAA,KAAM,IAAAC,mBAAU,EAAEjB,WAAY,CAAC;AAACkB,OAAA,CAAAF,OAAA,GAAAA,OAAA;AAOvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASG,QAAQA,CACvBC,cAAkC,EACO;EACzC,MAAMC,iBAEL,GAAKjB,KAAK,IAAM;IAChB,MAAMkB,SAAS,GAAGN,OAAO,CAAC,CAAC;IAC3B,OAAO,IAAAH,MAAA,CAAAC,aAAA,EAACM,cAAc;MAAA,GAAQhB,KAAK;MAAA,GAAekB;IAAS,CAAI,CAAC;EACjE,CAAC;EACD,MAAMC,kBAAkB,GACvBH,cAAc,CAACI,WAAW,IAAIJ,cAAc,CAACK,IAAI,IAAI,WAAW;EACjEJ,iBAAiB,CAACG,WAAW,GAAI,YAAYD,kBAAoB,GAAE;EACnE,OAAOF,iBAAiB;AACzB","ignoreList":[]}
1
+ {"version":3,"names":["_element","require","_i18n","_jsxRuntime","makeContextValue","i18n","__","bind","_x","_n","_nx","isRTL","hasTranslation","I18nContext","createContext","defaultI18n","I18nProvider","props","children","update","forceUpdate","useReducer","useEffect","subscribe","value","useMemo","jsx","Provider","useI18n","useContext","exports","withI18n","InnerComponent","EnhancedComponent","i18nProps","innerComponentName","displayName","name"],"sources":["@wordpress/react-i18n/src/index.tsx"],"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 ) );\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"],"mappings":";;;;;;;;AAaA,IAAAA,QAAA,GAAAC,OAAA;AAOA,IAAAC,KAAA,GAAAD,OAAA;AAA8C,IAAAE,WAAA,GAAAF,OAAA;AApB9C;AACA;AACA;;AAQA;AACA;AACA;;AAmBA;AACA;AACA;AACA;AACA;AACA,SAASG,gBAAgBA,CAAEC,IAAU,EAAqB;EACzD,OAAO;IACNC,EAAE,EAAED,IAAI,CAACC,EAAE,CAACC,IAAI,CAAEF,IAAK,CAAC;IACxBG,EAAE,EAAEH,IAAI,CAACG,EAAE,CAACD,IAAI,CAAEF,IAAK,CAAC;IACxBI,EAAE,EAAEJ,IAAI,CAACI,EAAE,CAACF,IAAI,CAAEF,IAAK,CAAC;IACxBK,GAAG,EAAEL,IAAI,CAACK,GAAG,CAACH,IAAI,CAAEF,IAAK,CAAC;IAC1BM,KAAK,EAAEN,IAAI,CAACM,KAAK,CAACJ,IAAI,CAAEF,IAAK,CAAC;IAC9BO,cAAc,EAAEP,IAAI,CAACO,cAAc,CAACL,IAAI,CAAEF,IAAK;EAChD,CAAC;AACF;AAEA,MAAMQ,WAAW,GAAG,IAAAC,sBAAa,EAAEV,gBAAgB,CAAEW,iBAAY,CAAE,CAAC;AAIpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,YAAYA,CAAEC,KAAwB,EAAgB;EACrE,MAAM;IAAEC,QAAQ;IAAEb,IAAI,GAAGU;EAAY,CAAC,GAAGE,KAAK;EAC9C,MAAM,CAAEE,MAAM,EAAEC,WAAW,CAAE,GAAG,IAAAC,mBAAU,EAAE,MAAM,EAAE,EAAE,EAAG,CAAC;;EAE1D;EACA,IAAAC,kBAAS,EAAE,MAAMjB,IAAI,CAACkB,SAAS,CAAEH,WAAY,CAAC,EAAE,CAAEf,IAAI,CAAG,CAAC;EAE1D,MAAMmB,KAAK,GAAG,IAAAC,gBAAO,EAAE,MAAMrB,gBAAgB,CAAEC,IAAK,CAAC,EAAE,CAAEA,IAAI,EAAEc,MAAM,CAAG,CAAC;EAEzE,oBACC,IAAAhB,WAAA,CAAAuB,GAAA,EAACb,WAAW,CAACc,QAAQ;IAACH,KAAK,EAAGA,KAAO;IAAAN,QAAA,EAClCA;EAAQ,CACW,CAAC;AAEzB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMU,OAAO,GAAGA,CAAA,KAAM,IAAAC,mBAAU,EAAEhB,WAAY,CAAC;AAACiB,OAAA,CAAAF,OAAA,GAAAA,OAAA;AAOvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASG,QAAQA,CACvBC,cAAkC,EACO;EACzC,MAAMC,iBAEL,GAAKhB,KAAK,IAAM;IAChB,MAAMiB,SAAS,GAAGN,OAAO,CAAC,CAAC;IAC3B,oBAAO,IAAAzB,WAAA,CAAAuB,GAAA,EAACM,cAAc;MAAA,GAAQf,KAAK;MAAA,GAAeiB;IAAS,CAAI,CAAC;EACjE,CAAC;EACD,MAAMC,kBAAkB,GACvBH,cAAc,CAACI,WAAW,IAAIJ,cAAc,CAACK,IAAI,IAAI,WAAW;EACjEJ,iBAAiB,CAACG,WAAW,GAAI,YAAYD,kBAAoB,GAAE;EACnE,OAAOF,iBAAiB;AACzB","ignoreList":[]}
@@ -1,4 +1,3 @@
1
- import { createElement } from "react";
2
1
  /**
3
2
  * External dependencies
4
3
  */
@@ -8,6 +7,7 @@ import { createElement } from "react";
8
7
  */
9
8
  import { createContext, useContext, useEffect, useMemo, useReducer } from '@wordpress/element';
10
9
  import { defaultI18n } from '@wordpress/i18n';
10
+ import { jsx as _jsx } from "react/jsx-runtime";
11
11
  /**
12
12
  * Utility to make a new context value
13
13
  *
@@ -57,9 +57,10 @@ export function I18nProvider(props) {
57
57
  // Rerender translations whenever the i18n instance fires a change event.
58
58
  useEffect(() => i18n.subscribe(forceUpdate), [i18n]);
59
59
  const value = useMemo(() => makeContextValue(i18n), [i18n, update]);
60
- return createElement(I18nContext.Provider, {
61
- value: value
62
- }, children);
60
+ return /*#__PURE__*/_jsx(I18nContext.Provider, {
61
+ value: value,
62
+ children: children
63
+ });
63
64
  }
64
65
 
65
66
  /**
@@ -99,7 +100,7 @@ export const useI18n = () => useContext(I18nContext);
99
100
  export function withI18n(InnerComponent) {
100
101
  const EnhancedComponent = props => {
101
102
  const i18nProps = useI18n();
102
- return createElement(InnerComponent, {
103
+ return /*#__PURE__*/_jsx(InnerComponent, {
103
104
  ...props,
104
105
  ...i18nProps
105
106
  });
@@ -1 +1 @@
1
- {"version":3,"names":["createContext","useContext","useEffect","useMemo","useReducer","defaultI18n","makeContextValue","i18n","__","bind","_x","_n","_nx","isRTL","hasTranslation","I18nContext","I18nProvider","props","children","update","forceUpdate","subscribe","value","createElement","Provider","useI18n","withI18n","InnerComponent","EnhancedComponent","i18nProps","innerComponentName","displayName","name"],"sources":["@wordpress/react-i18n/src/index.tsx"],"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 ) );\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"],"mappings":";AAAA;AACA;AACA;;AAQA;AACA;AACA;AACA,SACCA,aAAa,EACbC,UAAU,EACVC,SAAS,EACTC,OAAO,EACPC,UAAU,QACJ,oBAAoB;AAC3B,SAASC,WAAW,QAAQ,iBAAiB;AAW7C;AACA;AACA;AACA;AACA;AACA,SAASC,gBAAgBA,CAAEC,IAAU,EAAqB;EACzD,OAAO;IACNC,EAAE,EAAED,IAAI,CAACC,EAAE,CAACC,IAAI,CAAEF,IAAK,CAAC;IACxBG,EAAE,EAAEH,IAAI,CAACG,EAAE,CAACD,IAAI,CAAEF,IAAK,CAAC;IACxBI,EAAE,EAAEJ,IAAI,CAACI,EAAE,CAACF,IAAI,CAAEF,IAAK,CAAC;IACxBK,GAAG,EAAEL,IAAI,CAACK,GAAG,CAACH,IAAI,CAAEF,IAAK,CAAC;IAC1BM,KAAK,EAAEN,IAAI,CAACM,KAAK,CAACJ,IAAI,CAAEF,IAAK,CAAC;IAC9BO,cAAc,EAAEP,IAAI,CAACO,cAAc,CAACL,IAAI,CAAEF,IAAK;EAChD,CAAC;AACF;AAEA,MAAMQ,WAAW,GAAGf,aAAa,CAAEM,gBAAgB,CAAED,WAAY,CAAE,CAAC;AAIpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASW,YAAYA,CAAEC,KAAwB,EAAgB;EACrE,MAAM;IAAEC,QAAQ;IAAEX,IAAI,GAAGF;EAAY,CAAC,GAAGY,KAAK;EAC9C,MAAM,CAAEE,MAAM,EAAEC,WAAW,CAAE,GAAGhB,UAAU,CAAE,MAAM,EAAE,EAAE,EAAG,CAAC;;EAE1D;EACAF,SAAS,CAAE,MAAMK,IAAI,CAACc,SAAS,CAAED,WAAY,CAAC,EAAE,CAAEb,IAAI,CAAG,CAAC;EAE1D,MAAMe,KAAK,GAAGnB,OAAO,CAAE,MAAMG,gBAAgB,CAAEC,IAAK,CAAC,EAAE,CAAEA,IAAI,EAAEY,MAAM,CAAG,CAAC;EAEzE,OACCI,aAAA,CAACR,WAAW,CAACS,QAAQ;IAACF,KAAK,EAAGA;EAAO,GAClCJ,QACmB,CAAC;AAEzB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMO,OAAO,GAAGA,CAAA,KAAMxB,UAAU,CAAEc,WAAY,CAAC;AAOtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASW,QAAQA,CACvBC,cAAkC,EACO;EACzC,MAAMC,iBAEL,GAAKX,KAAK,IAAM;IAChB,MAAMY,SAAS,GAAGJ,OAAO,CAAC,CAAC;IAC3B,OAAOF,aAAA,CAACI,cAAc;MAAA,GAAQV,KAAK;MAAA,GAAeY;IAAS,CAAI,CAAC;EACjE,CAAC;EACD,MAAMC,kBAAkB,GACvBH,cAAc,CAACI,WAAW,IAAIJ,cAAc,CAACK,IAAI,IAAI,WAAW;EACjEJ,iBAAiB,CAACG,WAAW,GAAI,YAAYD,kBAAoB,GAAE;EACnE,OAAOF,iBAAiB;AACzB","ignoreList":[]}
1
+ {"version":3,"names":["createContext","useContext","useEffect","useMemo","useReducer","defaultI18n","jsx","_jsx","makeContextValue","i18n","__","bind","_x","_n","_nx","isRTL","hasTranslation","I18nContext","I18nProvider","props","children","update","forceUpdate","subscribe","value","Provider","useI18n","withI18n","InnerComponent","EnhancedComponent","i18nProps","innerComponentName","displayName","name"],"sources":["@wordpress/react-i18n/src/index.tsx"],"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 ) );\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"],"mappings":"AAAA;AACA;AACA;;AAQA;AACA;AACA;AACA,SACCA,aAAa,EACbC,UAAU,EACVC,SAAS,EACTC,OAAO,EACPC,UAAU,QACJ,oBAAoB;AAC3B,SAASC,WAAW,QAAQ,iBAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAW9C;AACA;AACA;AACA;AACA;AACA,SAASC,gBAAgBA,CAAEC,IAAU,EAAqB;EACzD,OAAO;IACNC,EAAE,EAAED,IAAI,CAACC,EAAE,CAACC,IAAI,CAAEF,IAAK,CAAC;IACxBG,EAAE,EAAEH,IAAI,CAACG,EAAE,CAACD,IAAI,CAAEF,IAAK,CAAC;IACxBI,EAAE,EAAEJ,IAAI,CAACI,EAAE,CAACF,IAAI,CAAEF,IAAK,CAAC;IACxBK,GAAG,EAAEL,IAAI,CAACK,GAAG,CAACH,IAAI,CAAEF,IAAK,CAAC;IAC1BM,KAAK,EAAEN,IAAI,CAACM,KAAK,CAACJ,IAAI,CAAEF,IAAK,CAAC;IAC9BO,cAAc,EAAEP,IAAI,CAACO,cAAc,CAACL,IAAI,CAAEF,IAAK;EAChD,CAAC;AACF;AAEA,MAAMQ,WAAW,GAAGjB,aAAa,CAAEQ,gBAAgB,CAAEH,WAAY,CAAE,CAAC;AAIpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASa,YAAYA,CAAEC,KAAwB,EAAgB;EACrE,MAAM;IAAEC,QAAQ;IAAEX,IAAI,GAAGJ;EAAY,CAAC,GAAGc,KAAK;EAC9C,MAAM,CAAEE,MAAM,EAAEC,WAAW,CAAE,GAAGlB,UAAU,CAAE,MAAM,EAAE,EAAE,EAAG,CAAC;;EAE1D;EACAF,SAAS,CAAE,MAAMO,IAAI,CAACc,SAAS,CAAED,WAAY,CAAC,EAAE,CAAEb,IAAI,CAAG,CAAC;EAE1D,MAAMe,KAAK,GAAGrB,OAAO,CAAE,MAAMK,gBAAgB,CAAEC,IAAK,CAAC,EAAE,CAAEA,IAAI,EAAEY,MAAM,CAAG,CAAC;EAEzE,oBACCd,IAAA,CAACU,WAAW,CAACQ,QAAQ;IAACD,KAAK,EAAGA,KAAO;IAAAJ,QAAA,EAClCA;EAAQ,CACW,CAAC;AAEzB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,OAAO,GAAGA,CAAA,KAAMzB,UAAU,CAAEgB,WAAY,CAAC;AAOtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASU,QAAQA,CACvBC,cAAkC,EACO;EACzC,MAAMC,iBAEL,GAAKV,KAAK,IAAM;IAChB,MAAMW,SAAS,GAAGJ,OAAO,CAAC,CAAC;IAC3B,oBAAOnB,IAAA,CAACqB,cAAc;MAAA,GAAQT,KAAK;MAAA,GAAeW;IAAS,CAAI,CAAC;EACjE,CAAC;EACD,MAAMC,kBAAkB,GACvBH,cAAc,CAACI,WAAW,IAAIJ,cAAc,CAACK,IAAI,IAAI,WAAW;EACjEJ,iBAAiB,CAACG,WAAW,GAAI,YAAYD,kBAAoB,GAAE;EACnE,OAAOF,iBAAiB;AACzB","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/react-i18n",
3
- "version": "3.56.0",
3
+ "version": "4.0.0",
4
4
  "description": "React bindings for @wordpress/i18n.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -19,7 +19,8 @@
19
19
  "url": "https://github.com/WordPress/gutenberg/issues"
20
20
  },
21
21
  "engines": {
22
- "node": ">=12"
22
+ "node": ">=18.12.0",
23
+ "npm": ">=8.19.2"
23
24
  },
24
25
  "main": "build/index.js",
25
26
  "module": "build-module/index.js",
@@ -28,12 +29,12 @@
28
29
  "sideEffects": false,
29
30
  "dependencies": {
30
31
  "@babel/runtime": "^7.16.0",
31
- "@wordpress/element": "^5.35.0",
32
- "@wordpress/i18n": "^4.58.0",
32
+ "@wordpress/element": "^6.0.0",
33
+ "@wordpress/i18n": "^5.0.0",
33
34
  "utility-types": "^3.10.0"
34
35
  },
35
36
  "publishConfig": {
36
37
  "access": "public"
37
38
  },
38
- "gitHead": "42f38f287506a6b3ed8ccba839b18ad066821044"
39
+ "gitHead": "2f30cddff15723ac7017fd009fc5913b7b419400"
39
40
  }