Split i18n engine to specific parts by tech and by env (#20513)
* split to packages in accordance to specific library * split to packages depending on tech and environment * make env modules names consistent * remove intl polyfilling * move laoder to root, i18n folder to core
This commit is contained in:
parent
6ddc9db376
commit
adc4185898
|
@ -192,9 +192,7 @@ uses I18n engine under the hood:
|
|||
```js
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import { ReactI18n } from '@kbn/i18n';
|
||||
|
||||
const { I18nProvider } = ReactI18n;
|
||||
import { I18nProvider } from '@kbn/i18n/react';
|
||||
|
||||
ReactDOM.render(
|
||||
<I18nProvider>
|
||||
|
@ -209,9 +207,7 @@ ReactDOM.render(
|
|||
After that we can use `FormattedMessage` components inside `RootComponent`:
|
||||
```js
|
||||
import React, { Component } from 'react';
|
||||
import { ReactI18n } from '@kbn/i18n';
|
||||
|
||||
const { FormattedMessage } = ReactI18n;
|
||||
import { FormattedMessage } from '@kbn/i18n/react';
|
||||
|
||||
class RootComponent extends Component {
|
||||
constructor(props) {
|
||||
|
@ -259,9 +255,7 @@ React component as a pure function:
|
|||
|
||||
```js
|
||||
import React from 'react';
|
||||
import { ReactI18n } from '@kbn/i18n';
|
||||
|
||||
const { injectI18n, intlShape } = ReactI18n;
|
||||
import { injectI18n, intlShape } from '@kbn/i18n/react';
|
||||
|
||||
const MyComponentContent = ({ intl }) => (
|
||||
<input
|
||||
|
@ -284,10 +278,7 @@ React component as a class:
|
|||
|
||||
```js
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { ReactI18n } from '@kbn/i18n';
|
||||
|
||||
const { injectI18n, intlShape } = ReactI18n;
|
||||
import { injectI18n, intlShape } from '@kbn/i18n/react';
|
||||
|
||||
class MyComponentContent extends React.Component {
|
||||
static propTypes = {
|
||||
|
|
4
packages/kbn-i18n/angular/package.json
Normal file
4
packages/kbn-i18n/angular/package.json
Normal file
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"browser": "../target/web/angular",
|
||||
"main": "../target/node/angular"
|
||||
}
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "@kbn/i18n",
|
||||
"browser": "./target/web/browser.js",
|
||||
"main": "./target/node/index.js",
|
||||
"browser": "./target/web",
|
||||
"main": "./target/node",
|
||||
"module": "./src/index.js",
|
||||
"version": "1.0.0",
|
||||
"license": "Apache-2.0",
|
||||
|
|
4
packages/kbn-i18n/react/package.json
Normal file
4
packages/kbn-i18n/react/package.json
Normal file
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"browser": "../target/web/react",
|
||||
"main": "../target/node/react"
|
||||
}
|
2
packages/kbn-i18n/src/angular/provider.js
vendored
2
packages/kbn-i18n/src/angular/provider.js
vendored
|
@ -17,7 +17,7 @@
|
|||
* under the License.
|
||||
*/
|
||||
|
||||
import * as i18n from '../core/i18n';
|
||||
import * as i18n from '../core';
|
||||
|
||||
export function i18nProvider() {
|
||||
this.addMessages = i18n.addMessages;
|
||||
|
|
|
@ -17,12 +17,5 @@
|
|||
* under the License.
|
||||
*/
|
||||
|
||||
import * as angular from './angular';
|
||||
import * as react from './react';
|
||||
import * as i18nCore from './core/i18n';
|
||||
|
||||
export { formats } from './core/formats';
|
||||
|
||||
export const AngularI18n = angular;
|
||||
export const ReactI18n = react;
|
||||
export const i18n = i18nCore;
|
||||
export { formats } from './formats';
|
||||
export * from './i18n';
|
|
@ -17,10 +17,8 @@
|
|||
* under the License.
|
||||
*/
|
||||
|
||||
import * as i18nCore from './core/i18n';
|
||||
import * as loader from './core/loader';
|
||||
|
||||
export { formats } from './core/formats';
|
||||
import * as i18nCore from './core';
|
||||
import * as loader from './loader';
|
||||
|
||||
export const i18n = i18nCore;
|
||||
export const i18nLoader = loader;
|
||||
|
|
|
@ -29,7 +29,7 @@ import { readFile } from 'fs';
|
|||
import { promisify } from 'util';
|
||||
import { pick } from 'accept-language-parser';
|
||||
import JSON5 from 'json5';
|
||||
import { unique } from './helper';
|
||||
import { unique } from './core/helper';
|
||||
|
||||
const asyncReadFile = promisify(readFile);
|
||||
|
|
@ -21,7 +21,7 @@ import React, { PureComponent } from 'react';
|
|||
import PropTypes from 'prop-types';
|
||||
import { IntlProvider } from 'react-intl';
|
||||
|
||||
import * as i18n from '../core/i18n';
|
||||
import * as i18n from '../core';
|
||||
|
||||
/**
|
||||
* The library uses the provider pattern to scope an i18n context to a tree
|
||||
|
|
|
@ -17,15 +17,13 @@
|
|||
* under the License.
|
||||
*/
|
||||
|
||||
import { AngularI18n } from '@kbn/i18n';
|
||||
import { uiModules } from 'ui/modules';
|
||||
import { metadata } from 'ui/metadata';
|
||||
|
||||
const {
|
||||
import {
|
||||
i18nProvider,
|
||||
i18nFilter,
|
||||
i18nDirective,
|
||||
} = AngularI18n;
|
||||
} from '@kbn/i18n/angular';
|
||||
|
||||
uiModules.get('i18n')
|
||||
.provider('i18n', i18nProvider)
|
||||
|
|
Loading…
Reference in a new issue