lingui-react - npm Package Compare versions

Comparing version 0.13.0-3 to 1.0.0-1

lib/index.es.js

@@ -147,2 +147,3 @@ import { date, number } from 'lingui-formats';
       languageData = _ref.languageData,
+      development = _ref.development,
       i18n = _ref.i18n;
@@ -155,2 +156,4 @@
   this.i18n = i18n || new I18n(language, messages, languageData);
+
+  if (development) this.i18n.development(development);
 };
@@ -202,5 +205,6 @@
         languageData = _this$props.languageData,
+        development = _this$props.development,
         i18n = _this$props.i18n;
 
-    _this.i18nManager = new I18nManager({ language: language, messages: messages, languageData: languageData, i18n: i18n });
+    _this.i18nManager = new I18nManager({ language: language, messages: messages, languageData: languageData, i18n: i18n, development: development });
     return _this;
@@ -348,3 +352,3 @@ }
 
-    var translation = _this.getTranslation(props);
+    var translation = _this.getTranslation();
 
@@ -358,3 +362,2 @@ if (process.env.NODE_ENV !== 'production') {
     _this.state = {
-      msgCache: _this.compileMessage(translation),
       language: props.i18n.language,
@@ -368,57 +371,24 @@ translation: translation
     key: 'getTranslation',
-    value: function getTranslation(props) {
-      var _props$id = props.id,
+    value: function getTranslation() {
+      var _props = this.props,
+          _props$id = _props.id,
           id = _props$id === undefined ? '' : _props$id,
-          defaults = props.defaults,
-          i18n = props.i18n;
-
-
-      return (i18n.messages && id ? i18n.messages[id] : '') || defaults || id;
-    }
-  }, {
-    key: 'compileMessage',
-    value: function compileMessage(translation) {
-      var _props = this.props,
+          defaults = _props.defaults,
           i18n = _props.i18n,
+          params = _props.params,
           formats = _props.formats;
 
-
-      if (!i18n.compile) return function () {
-        return translation;
-      };
-      return i18n.compile(translation, formats);
+      return typeof i18n._ === 'function' ? i18n._({ id: id, defaults: defaults, params: params, formats: formats }) : id;
     }
   }, {
-    key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(nextProps) {
-      var i18n = this.props.i18n;
-      var _state = this.state,
-          language = _state.language,
-          translation = _state.translation;
-
-      var nextTranslation = this.getTranslation(nextProps);
-
-      if (translation !== nextTranslation || language !== i18n.language) {
-        this.setState({
-          msgCache: this.compileMessage(nextTranslation),
-          language: i18n.language,
-          translation: nextTranslation
-        });
-      }
-    }
-  }, {
     key: 'render',
     value: function render() {
-      var _props2 = this.props,
-          params = _props2.params,
-          components = _props2.components;
-      var msgCache = this.state.msgCache;
+      var components = this.props.components;
 
+      var translation = formatElements(this.getTranslation(), components);
 
-      var translation = formatElements(msgCache(params), components);
+      var _props2 = this.props,
+          className = _props2.className,
+          render = _props2.render;
 
-      var _props3 = this.props,
-          className = _props3.className,
-          render = _props3.render;
-
       return React.createElement(
@@ -425,0 +395,0 @@ Render,

lib/index.js

@@ -154,2 +154,3 @@ 'use strict';
       languageData = _ref.languageData,
+      development = _ref.development,
       i18n = _ref.i18n;
@@ -162,2 +163,4 @@
   this.i18n = i18n || new linguiI18n.I18n(language, messages, languageData);
+
+  if (development) this.i18n.development(development);
 };
@@ -209,5 +212,6 @@
         languageData = _this$props.languageData,
+        development = _this$props.development,
         i18n = _this$props.i18n;
 
-    _this.i18nManager = new I18nManager({ language: language, messages: messages, languageData: languageData, i18n: i18n });
+    _this.i18nManager = new I18nManager({ language: language, messages: messages, languageData: languageData, i18n: i18n, development: development });
     return _this;
@@ -355,3 +359,3 @@ }
 
-    var translation = _this.getTranslation(props);
+    var translation = _this.getTranslation();
 
@@ -365,3 +369,2 @@ if (process.env.NODE_ENV !== 'production') {
     _this.state = {
-      msgCache: _this.compileMessage(translation),
       language: props.i18n.language,
@@ -375,57 +378,24 @@ translation: translation
     key: 'getTranslation',
-    value: function getTranslation(props) {
-      var _props$id = props.id,
+    value: function getTranslation() {
+      var _props = this.props,
+          _props$id = _props.id,
           id = _props$id === undefined ? '' : _props$id,
-          defaults = props.defaults,
-          i18n = props.i18n;
-
-
-      return (i18n.messages && id ? i18n.messages[id] : '') || defaults || id;
-    }
-  }, {
-    key: 'compileMessage',
-    value: function compileMessage(translation) {
-      var _props = this.props,
+          defaults = _props.defaults,
           i18n = _props.i18n,
+          params = _props.params,
           formats = _props.formats;
 
-
-      if (!i18n.compile) return function () {
-        return translation;
-      };
-      return i18n.compile(translation, formats);
+      return typeof i18n._ === 'function' ? i18n._({ id: id, defaults: defaults, params: params, formats: formats }) : id;
     }
   }, {
-    key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(nextProps) {
-      var i18n = this.props.i18n;
-      var _state = this.state,
-          language = _state.language,
-          translation = _state.translation;
-
-      var nextTranslation = this.getTranslation(nextProps);
-
-      if (translation !== nextTranslation || language !== i18n.language) {
-        this.setState({
-          msgCache: this.compileMessage(nextTranslation),
-          language: i18n.language,
-          translation: nextTranslation
-        });
-      }
-    }
-  }, {
     key: 'render',
     value: function render() {
-      var _props2 = this.props,
-          params = _props2.params,
-          components = _props2.components;
-      var msgCache = this.state.msgCache;
+      var components = this.props.components;
 
+      var translation = formatElements(this.getTranslation(), components);
 
-      var translation = formatElements(msgCache(params), components);
+      var _props2 = this.props,
+          className = _props2.className,
+          render = _props2.render;
 
-      var _props3 = this.props,
-          className = _props3.className,
-          render = _props3.render;
-
       return React__default.createElement(
@@ -432,0 +402,0 @@ Render,

package.json

 {
   "name": "lingui-react",
-  "version": "0.13.0-3",
+  "version": "1.0.0-1",
   "description": "React components for translations",
@@ -37,4 +37,4 @@ "main": "lib/index.js",
     "babel-runtime": "^6.23.0",
-    "lingui-formats": "^0.4.0-3",
-    "lingui-i18n": "^0.7.0-3",
+    "lingui-formats": "^1.0.0-1",
+    "lingui-i18n": "^1.0.0-1",
     "prop-types": "^15.5.10"
@@ -41,0 +41,0 @@ },

src/createFormat.js

@@ -15,3 +15,3 @@ // @flow
 
-function createFormat<V, FormatOptions, P: FormatProps<V, FormatOptions>> (formatFunction: (language: string, format?: FormatOptions) => (value: V) => string): Class<React$Component<void, P, void>> {
+function createFormat<V, FormatOptions, P: FormatProps<V, FormatOptions>> (formatFunction: (language: string, format?: FormatOptions) => (value: V) => string): ReactClass<*> {
   return function ({ value, format, i18n, className, render }: FormatProps<V, FormatOptions>) {
@@ -18,0 +18,0 @@ const formatter = formatFunction(i18n.language, format)

src/I18nProvider.js

@@ -12,2 +12,3 @@ /* @flow */
   languageData?: AllLanguageData,
+  development?: Object,
   i18n?: I18n
@@ -24,9 +25,12 @@ }
 
-  constructor ({ language, messages, languageData, i18n }: {
+  constructor ({ language, messages, languageData, development, i18n }: {
     language: string,
     messages?: Catalogs,
     languageData?: AllLanguageData,
+    development?: Object,
     i18n?: I18n
   }) {
     this.i18n = i18n || new I18n(language, messages, languageData)
+
+    if (development) this.i18n.development(development)
   }
@@ -59,4 +63,4 @@
     super(props)
-    const { language, messages, languageData, i18n } = this.props
-    this.i18nManager = new I18nManager({ language, messages, languageData, i18n })
+    const { language, messages, languageData, development, i18n } = this.props
+    this.i18nManager = new I18nManager({ language, messages, languageData, i18n, development })
   }
@@ -63,0 +67,0 @@

src/I18nProvider.test.js

@@ -8,2 +8,3 @@ // @flow
 import { mockConsole } from './mocks'
+import linguiDev from './dev'
 
@@ -84,3 +85,4 @@ describe('I18nProvider', function () {
         fr: { msg: 'salut' }
-      }
+      },
+      development: linguiDev
     })
@@ -125,3 +127,4 @@
       language: 'en',
-      messages: { en: {}, fr: {} }
+      messages: { en: {}, fr: {} },
+      development: linguiDev
     })
@@ -128,0 +131,0 @@ i18nManager.subscribe(listener)

src/index.js

@@ -7,3 +7,5 @@ // @flow
 import WithI18n from './WithI18n'
+import type { WithI18nProps } from './WithI18n'
 export { WithI18n }
+export type { WithI18nProps }
 
@@ -10,0 +12,0 @@ export { default as I18nProvider } from './I18nProvider'

src/Plural.test.js

@@ -7,5 +7,10 @@ // @flow
 import Plural from './Plural'
+import linguiDev from './dev'
 
 describe('Plural', function () {
-  const i18n = code => new I18n(code, {[code]: {}})
+  const i18n = code => {
+    const _ = new I18n(code, {[code]: {}})
+    _.development(linguiDev)
+    return _
+  }
   const languageContext = (code) => ({ context: { i18nManager: { i18n: i18n(code) } } })
@@ -12,0 +17,0 @@

src/SelectOrdinal.test.js

@@ -7,5 +7,10 @@ // @flow
 import SelectOrdinal from './SelectOrdinal'
+import linguiDev from './dev'
 
 describe('SelectOrdinal', function () {
-  const i18n = code => new I18n(code, {[code]: {}})
+  const i18n = code => {
+    const _ = new I18n(code, {[code]: {}})
+    _.development(linguiDev)
+    return _
+  }
   const languageContext = (code) => ({ context: { i18nManager: { i18n: i18n(code) } } })
@@ -12,0 +17,0 @@

src/Trans.js

@@ -17,6 +17,6 @@ // @flow
   components?: Array<React$Element<*>>,
+  i18n: Object
 } & WithI18nProps & RenderProps
 
 type TransState = {
-  msgCache: Function,
   language: string,
@@ -38,3 +38,3 @@ translation: string
 
-    const translation = this.getTranslation(props)
+    const translation = this.getTranslation()
 
@@ -53,3 +53,2 @@ if (process.env.NODE_ENV !== 'production') {
     this.state = {
-      msgCache: this.compileMessage(translation),
       language: props.i18n.language,
@@ -60,38 +59,11 @@ translation
 
-  getTranslation (props): string {
-    const { id = '', defaults, i18n } = props
-
-    return (i18n.messages && id ? i18n.messages[id] : '') || defaults || id
+  getTranslation (): string {
+    const { id = '', defaults, i18n, params, formats } = this.props
+    return typeof i18n._ === 'function' ? i18n._({ id, defaults, params, formats }) : id
   }
 
-  compileMessage (translation: string): Function {
-    const { i18n, formats } = this.props
-
-    if (!i18n.compile) return () => translation
-    return i18n.compile(translation, formats)
-  }
-
-  componentWillReceiveProps (nextProps) {
-    const { i18n } = this.props
-    const { language, translation } = this.state
-    const nextTranslation = this.getTranslation(nextProps)
-
-    if (
-      translation !== nextTranslation ||
-      language !== i18n.language
-    ) {
-      this.setState({
-        msgCache: this.compileMessage(nextTranslation),
-        language: i18n.language,
-        translation: nextTranslation
-      })
-    }
-  }
-
   render () {
-    const { params, components } = this.props
-    const { msgCache } = this.state
+    const { components } = this.props
+    const translation = formatElements(this.getTranslation(), components)
 
-    const translation = formatElements(msgCache(params), components)
-
     const { className, render } = this.props
@@ -98,0 +70,0 @@ return <Render className={className} render={render}>{translation}</Render>

src/Trans.test.js

 /* @flow */
 import React from 'react'
-import { Trans } from '.'
+import { mount } from 'enzyme'
 import { I18n } from 'lingui-i18n'
-import { mount } from 'enzyme'
 
+import { Trans } from '.'
+import linguiDev from './dev'
+
 describe('Trans component', function () {
@@ -11,15 +13,16 @@ /*
    */
-  const context = {
-    i18nManager: {
-      i18n: new I18n('en', {
-        en: {
-          'All human beings are born free and equal in dignity and rights.': 'Všichni lidé rodí se svobodní a sobě rovní co do důstojnosti a práv.',
-          'My name is {name}': 'Jmenuji se {name}',
-          'Original': 'Původní',
-          'Updated': 'Aktualizovaný',
-          'msg.currency': '{value, number, currency}'
-        }
-      })
+  const i18n = new I18n()
+  i18n.development(linguiDev)
+  i18n.load({
+    en: {
+      'All human beings are born free and equal in dignity and rights.': 'Všichni lidé rodí se svobodní a sobě rovní co do důstojnosti a práv.',
+      'My name is {name}': 'Jmenuji se {name}',
+      'Original': 'Původní',
+      'Updated': 'Aktualizovaný',
+      'msg.currency': '{value, number, currency}'
     }
-  }
+  })
+  i18n.activate('en')
+
+  const context = { i18nManager: { i18n } }
   const text = (node) => mount(node, { context }).find('Render').text()
@@ -32,3 +35,4 @@
   it("shouldn't throw runtime error without i18n context", function () {
-    expect(mount(<Trans id="unknown" />).find('Render').text()).toEqual('unknown')
+    expect(mount(
+      <Trans id="unknown"/>).find('Render').text()).toEqual('unknown')
   })
@@ -50,3 +54,3 @@
   it('should recompile msg when id or defaults changes', function () {
-    const node = mount(<Trans id="Original" defaults="Original" />, { context })
+    const node = mount(<Trans id="Original" defaults="Original"/>, { context })
     const t = () => node.find('Render').text()
@@ -70,6 +74,6 @@ expect(t()).toEqual('Původní')
   it('should render default string', function () {
-    expect(text(<Trans id="unknown" />))
+    expect(text(<Trans id="unknown"/>))
       .toEqual('unknown')
 
-    expect(text(<Trans id="unknown" defaults="Not translated yet" />))
+    expect(text(<Trans id="unknown" defaults="Not translated yet"/>))
       .toEqual('Not translated yet')
@@ -80,3 +84,3 @@ })
     const translation = text(
-      <Trans id="All human beings are born free and equal in dignity and rights." />
+      <Trans id="All human beings are born free and equal in dignity and rights."/>
     )
@@ -91,6 +95,7 @@
     const html1 = mount(
-      <Trans render={<p className="lead"/>} id="Original" />, { context }
+      <Trans render={<p className="lead"/>} id="Original"/>, { context }
     ).find('Render').html()
     const html2 = mount(
-      <Trans render={({ translation }) => <p className="lead">{translation}</p>} id="Original" />, { context }
+      <Trans render={({ translation }) =>
+        <p className="lead">{translation}</p>} id="Original"/>, { context }
     ).find('Render').html()
@@ -107,7 +112,9 @@
         params={{ value: 1 }}
-        formats={{ currency: {
-          style: 'currency',
-          currency: 'EUR',
-          minimumFractionDigits: 2
-        }}}
+        formats={{
+          currency: {
+            style: 'currency',
+            currency: 'EUR',
+            minimumFractionDigits: 2
+          }
+        }}
       />)
@@ -114,0 +121,0 @@ expect(translation).toEqual('€1.00')

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of package files

39

increased by5.41%

Worsened metrics

Total package byte prevSize

99588

decreased by-2%

Lines of code

1884

decreased by-2.48%

Dependency changes

• + Addedlingui-formats@1.0.4(transitive)

• + Addedlingui-i18n@1.3.4(transitive)

• + Addedmessageformat-parser@2.0.0(transitive)

• - Removedlingui-formats@0.4.6(transitive)

• - Removedlingui-i18n@0.7.0-3(transitive)

• - Removedmessageformat-parser@1.1.0(transitive)

• Updatedlingui-formats@^1.0.0-1

• Updatedlingui-i18n@^1.0.0-1