Split i18n engine to specific parts by tech and by env (#20513) (#21543)

* 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
elastic · Aug 2, 2018 · 7026148 · 7026148
1 parent 320c81c
commit 7026148
Show file tree

Hide file tree

Showing 10 changed files with 23 additions and 35 deletions.
diff --git a/packages/kbn-i18n/README.md b/packages/kbn-i18n/README.md
@@ -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 = {

diff --git a/packages/kbn-i18n/angular/package.json b/packages/kbn-i18n/angular/package.json
@@ -0,0 +1,4 @@
+{
+  "browser": "../target/web/angular",
+  "main": "../target/node/angular"
+}
diff --git a/packages/kbn-i18n/package.json b/packages/kbn-i18n/package.json
@@ -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",

diff --git a/packages/kbn-i18n/react/package.json b/packages/kbn-i18n/react/package.json
@@ -0,0 +1,4 @@
+{
+  "browser": "../target/web/react",
+  "main": "../target/node/react"
+}
diff --git a/packages/kbn-i18n/src/angular/provider.js b/packages/kbn-i18n/src/angular/provider.js
@@ -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;

diff --git a/packages/kbn-i18n/src/browser.js → packages/kbn-i18n/src/core/index.js b/packages/kbn-i18n/src/browser.js → packages/kbn-i18n/src/core/index.js
@@ -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';
diff --git a/packages/kbn-i18n/src/index.js b/packages/kbn-i18n/src/index.js
@@ -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;
diff --git a/packages/kbn-i18n/src/core/loader.js → packages/kbn-i18n/src/loader.js b/packages/kbn-i18n/src/core/loader.js → packages/kbn-i18n/src/loader.js
@@ -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);
 

diff --git a/packages/kbn-i18n/src/react/provider.js b/packages/kbn-i18n/src/react/provider.js
@@ -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

diff --git a/src/ui/public/i18n/index.js b/src/ui/public/i18n/index.js
@@ -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)