@m6web/react-i18n - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

lib/index.js

@@ -31,3 +31,3 @@ 'use strict';
 
-var _i18n3 = require('./components/i18n.component');
+var _i18nString = require('./components/i18nString.component');
 
@@ -37,13 +37,22 @@ Object.defineProperty(exports, 'Trans', {
   get: function get() {
-    return _i18n3.Trans;
+    return _i18nString.Trans;
   }
 });
 
-var _i18n4 = require('./components/i18n.provider');
+var _i18nElement = require('./components/i18nElement.component');
 
+Object.defineProperty(exports, 'HtmlTrans', {
+  enumerable: true,
+  get: function get() {
+    return _i18nElement.HtmlTrans;
+  }
+});
+
+var _i18n3 = require('./components/i18n.provider');
+
 Object.defineProperty(exports, 'I18nProvider', {
   enumerable: true,
   get: function get() {
-    return _i18n4.I18nProvider;
+    return _i18n3.I18nProvider;
   }
 });

package.json

 {
   "name": "@m6web/react-i18n",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Provider and utils for translation in a react app",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -14,3 +14,3 @@ # React i18n for 6play apps
 ```shell
-yarn add -E git+https://github.m6web.fr/m6web/react-i18n
+yarn add -E @m6web/react-i18n
 ```
@@ -22,3 +22,3 @@
 // Import the provider
-import { I18nProvider } from 'react-i18n';
+import { I18nProvider } from '@m6we/react-i18n';
 
@@ -48,3 +48,3 @@ // Dictionnary for your app, you should have a different dictionary for each language
 
-### i18n component
+### i18n String component
 
@@ -55,3 +55,3 @@ This component needs React 16 at least because its render returns a string value.
 import React from 'react';
-import { Trans } from 'react-i18n';
+import { Trans } from '@m6we/react-i18n';
 
@@ -80,2 +80,27 @@ // Interpolation values
 
+### i18n HTML component
+
+```jsx harmony
+import React from 'react';
+import { HtmlTrans } from '@m6we/react-i18n';
+
+// Interpolation values
+const data = { element: 'foo' };
+
+export default const MyComponent = ({ nbExample, t }) => {
+  return (
+    <div class="foo">
+      <HtmlTrans i18nKey="foo.bar" element="h1" />
+      <HtmlTrans i18nKey="foo.exemple" number={nbExample} data={data} general element="p" />
+    </div>
+  );
+};
+```
+
+* **i18nKeys**: key from the dictionary (required)
+* **number**: amount used for plural forms
+* **data**: object containing key/values used for interpolation in the translation
+* **general**: use general plural form if truthy
+* **element**: HTML element used to generate ReactElement. (default value: `span`) 
+
 Note that **number** and **data** can be used together.
@@ -89,3 +114,3 @@
 import React from 'react';
-import { translate } from 'react-i18n';
+import { translate } from '@m6we/react-i18n';
 
@@ -124,3 +149,3 @@ // Interpolation values
 ```jsx harmony
-import { buildListFunction } from 'react-i18n';
+import { buildListFunction } from '@m6we/react-i18n';
 
@@ -127,0 +152,0 @@ // Define separators with translations

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

Total package byte prevSize

30454

increased by15.7%

Number of package files

13

increased by30%

Lines of code

512

increased by19.35%

Number of lines in readme file

179

increased by16.23%

No dependency changes