react-i18next 11.6.0 → 11.7.0

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+### 11.7.0
+
+- Trans interpolating self-closing tags in components prop(object) [1140](https://github.com/i18next/react-i18next/pull/1140)
+
 ### 11.6.0
 
 - Trans allow components props to be an object containing named interpolation elements

package/README.md

@@ -81,7 +81,7 @@ Head over to the **interactive playground** at [codesandbox](https://codesandbox
 - **Production ready** we know there are more needs for production than just doing i18n on the clientside, so we offer wider support on [serverside](https://www.i18next.com/supported-frameworks.html) too (nodejs, php, ruby, .net, ...). **Learn once - translate everywhere**.
 - **Beyond i18n** comes with [locize](https://locize.com) bridging the gap between developement and translations - covering the whole translation process.
 
-<img src="https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-L9iS6Wm2hynS5H9Gj7j%2F-L9iS7LlT2W7wFtJH-2n%2F-L9iSBP9U65-bHJBRSDv%2Fi18next-ecosystem.jpg?generation=1523345318122913&alt=media" alt="i18next ecossystem" width="400">
+![ecosystem](https://raw.githubusercontent.com/i18next/i18next/master/assets/i18next-ecosystem.jpg)
 
 ### Localization workflow
 

package/dist/amd/react-i18next.js

@@ -611,6 +611,19 @@ define(['exports', 'react'], function (exports, React) { 'use strict';
     var interpolatedString = i18n.services.interpolator.interpolate(targetString, _objectSpread2({}, data, {}, combinedTOpts), i18n.language);
     var ast = htmlParseStringify2.parse("<0>".concat(interpolatedString, "</0>"));
 
+    function renderInner(child, node, rootReactNode) {
+      var childs = getChildren(child);
+      var mappedChildren = mapAST(childs, node.children, rootReactNode);
+      return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
+    }
+
+    function pushTranslatedJSX(child, inner, mem, i) {
+      if (child.dummy) child.children = inner;
+      mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
+        key: i
+      }), inner));
+    }
+
     function mapAST(reactNode, astNode, rootReactNode) {
       var reactNodes = getAsArray(reactNode);
       var astNodes = getAsArray(astNode);
@@ -625,42 +638,44 @@ define(['exports', 'react'], function (exports, React) { 'use strict';
             props: node.attrs
           }, tmp) : tmp;
           var isElement = React__default.isValidElement(child);
+          var isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;
+          var isEmptyTransWithHTML = emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement;
+          var isKnownComponent = _typeof(children) === 'object' && children !== null && Object.hasOwnProperty.call(children, node.name);
 
           if (typeof child === 'string') {
             mem.push(child);
-          } else if (hasChildren(child) || isElement && hasChildren(node, true) && !node.voidElement) {
-              var childs = getChildren(child);
-              var mappedChildren = mapAST(childs, node.children, rootReactNode);
-              var inner = hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
-              if (child.dummy) child.children = inner;
-              mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
-                key: i
-              }), inner));
-            } else if (emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement) {
+          } else if (hasChildren(child) || isValidTranslationWithChildren) {
+              var inner = renderInner(child, node, rootReactNode);
+              pushTranslatedJSX(child, inner, mem, i);
+            } else if (isEmptyTransWithHTML) {
             var _inner = mapAST(reactNodes, node.children, rootReactNode);
 
             mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
               key: i
             }), _inner));
           } else if (Number.isNaN(parseFloat(node.name))) {
-            if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
+            if (isKnownComponent) {
+              var _inner2 = renderInner(child, node, rootReactNode);
+
+              pushTranslatedJSX(child, _inner2, mem, i);
+            } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
               if (node.voidElement) {
                 mem.push(React__default.createElement(node.name, {
                   key: "".concat(node.name, "-").concat(i)
                 }));
               } else {
-                var _inner2 = mapAST(reactNodes, node.children, rootReactNode);
+                var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
 
                 mem.push(React__default.createElement(node.name, {
                   key: "".concat(node.name, "-").concat(i)
-                }, _inner2));
+                }, _inner3));
               }
             } else if (node.voidElement) {
               mem.push("<".concat(node.name, " />"));
             } else {
-              var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
+              var _inner4 = mapAST(reactNodes, node.children, rootReactNode);
 
-              mem.push("<".concat(node.name, ">").concat(_inner3, "</").concat(node.name, ">"));
+              mem.push("<".concat(node.name, ">").concat(_inner4, "</").concat(node.name, ">"));
             }
           } else if (_typeof(child) === 'object' && !isElement) {
             var content = node.children[0] ? translationContent : null;

package/dist/amd/react-i18next.min.js

@@ -1 +1 @@
-define(["exports","react"],(function(e,n){"use strict";var t="default"in n?n.default:n;function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function i(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(t,!0).forEach((function(n){a(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(t).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function u(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var t=[],r=!0,i=!1,a=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(t.push(o.value),!n||t.length!==n);r=!0);}catch(e){i=!0,a=e}finally{try{r||null==c.return||c.return()}finally{if(i)throw a}}return t}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,menuitem:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},f=/([\w-]+)|=|(['"])([.\s\S]*?)\2/g,p=/(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g,d=Object.create?Object.create(null):{};function g(e,n,t,r,i){var a=n.indexOf("<",r),o=n.slice(r,-1===a?void 0:a);/^\s*$/.test(o)&&(o=" "),(!i&&a>-1&&t+e.length>=0||" "!==o)&&e.push({type:"text",content:o})}function m(e,n){switch(n.type){case"text":return e+n.content;case"tag":return e+="<"+n.name+(n.attrs?function(e){var n=[];for(var t in e)n.push(t+'="'+e[t]+'"');return n.length?" "+n.join(" "):""}(n.attrs):"")+(n.voidElement?"/>":">"),n.voidElement?e:e+n.children.reduce(m,"")+"</"+n.name+">"}}var h,y={parse:function(e,n){n||(n={}),n.components||(n.components=d);var t,r=[],i=-1,a=[],o={},c=!1;return e.replace(p,(function(s,u){if(c){if(s!=="</"+t.name+">")return;c=!1}var p,d="/"!==s.charAt(1),m=0===s.indexOf("\x3c!--"),h=u+s.length,y=e.charAt(h);d&&!m&&(i++,"tag"===(t=function(e){var n,t=0,r=!0,i={type:"tag",name:"",voidElement:!1,attrs:{},children:[]};return e.replace(f,(function(a){if("="===a)return r=!0,void t++;r?0===t?((l[a]||"/"===e.charAt(e.length-2))&&(i.voidElement=!0),i.name=a):(i.attrs[n]=a.replace(/^['"]|['"]$/g,""),n=void 0):(n&&(i.attrs[n]=n),n=a),t++,r=!1})),i}(s)).type&&n.components[t.name]&&(t.type="component",c=!0),t.voidElement||c||!y||"<"===y||g(t.children,e,i,h,n.ignoreWhitespace),o[t.tagName]=t,0===i&&r.push(t),(p=a[i-1])&&p.children.push(t),a[i]=t),(m||!d||t.voidElement)&&(m||i--,!c&&"<"!==y&&y&&g(p=-1===i?r:a[i].children,e,i,h,n.ignoreWhitespace))})),!r.length&&e.length&&g(r,e,0,0,n.ignoreWhitespace),r},stringify:function(e){return e.reduce((function(e,n){return e+m("",n)}),"")}},v={bindI18n:"languageChanged",bindI18nStore:"",transEmptyNodeValue:"",transSupportBasicHtmlNodes:!0,transKeepBasicHtmlNodesFor:["br","strong","i","p"],useSuspense:!0},b=t.createContext();function O(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};v=c({},v,{},e)}function w(){return v}var j=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.usedNamespaces={}}var n,t,r;return n=e,(t=[{key:"addUsedNamespaces",value:function(e){var n=this;e.forEach((function(e){n.usedNamespaces[e]||(n.usedNamespaces[e]=!0)}))}},{key:"getUsedNamespaces",value:function(){return Object.keys(this.usedNamespaces)}}])&&i(n.prototype,t),r&&i(n,r),e}();function E(e){h=e}function S(){return h}var N={type:"3rdParty",init:function(e){O(e.options.react),E(e)}};function x(e){return function(n){return new Promise((function(t){var r=k();e.getInitialProps?e.getInitialProps(n).then((function(e){t(c({},e,{},r))})):t(r)}))}}function k(){var e=S(),n=e.reportNamespaces?e.reportNamespaces.getUsedNamespaces():[],t={},r={};return e.languages.forEach((function(t){r[t]={},n.forEach((function(n){r[t][n]=e.getResourceBundle(t,n)||{}}))})),t.initialI18nStore=r,t.initialLanguage=e.language,t}function I(){if(console&&console.warn){for(var e,n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];"string"==typeof t[0]&&(t[0]="react-i18next:: ".concat(t[0])),(e=console).warn.apply(e,t)}}var P={};function R(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];"string"==typeof n[0]&&P[n[0]]||("string"==typeof n[0]&&(P[n[0]]=new Date),I.apply(void 0,n))}function C(e,n,t){e.loadNamespaces(n,(function(){if(e.isInitialized)t();else{e.on("initialized",(function n(){setTimeout((function(){e.off("initialized",n)}),0),t()}))}}))}function T(e){return e.displayName||e.name||("string"==typeof e&&e.length>0?e:"Unknown")}function A(e,n){if(!e)return!1;var t=e.props?e.props.children:e.children;return n?t.length>0:!!t}function L(e){return e?e&&e.children?e.children:e.props&&e.props.children:[]}function z(e){return Array.isArray(e)?e:[e]}function D(e,n,i,a,o){if(""===n)return[];var s=a.transKeepBasicHtmlNodesFor||[],u=n&&new RegExp(s.join("|")).test(n);if(!e&&!u)return[n];var l={};!function e(n){z(n).forEach((function(n){"string"!=typeof n&&(A(n)?e(L(n)):"object"!==r(n)||t.isValidElement(n)||Object.assign(l,n))}))}(e);var f=i.services.interpolator.interpolate(n,c({},l,{},o),i.language);var p=function e(n,i,o){var l=z(n);return z(i).reduce((function(n,i,f){var p,d,g,m=i.children&&i.children[0]&&i.children[0].content;if("tag"===i.type){var h=l[parseInt(i.name,10)];!h&&1===o.length&&o[0][i.name]&&(h=o[0][i.name]),h||(h={});var y=0!==Object.keys(i.attrs).length?(p={props:i.attrs},(g=c({},d=h)).props=Object.assign(p.props,d.props),g):h,v=t.isValidElement(y);if("string"==typeof y)n.push(y);else if(A(y)||v&&A(i,!0)&&!i.voidElement){var b=L(y),O=e(b,i.children,o),w=function(e){return"[object Array]"===Object.prototype.toString.call(e)&&e.every((function(e){return t.isValidElement(e)}))}(b)&&0===O.length?b:O;y.dummy&&(y.children=w),n.push(t.cloneElement(y,c({},y.props,{key:f}),w))}else if(u&&"object"===r(y)&&y.dummy&&!v){var j=e(l,i.children,o);n.push(t.cloneElement(y,c({},y.props,{key:f}),j))}else if(Number.isNaN(parseFloat(i.name)))if(a.transSupportBasicHtmlNodes&&s.indexOf(i.name)>-1)if(i.voidElement)n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)}));else{var E=e(l,i.children,o);n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)},E))}else if(i.voidElement)n.push("<".concat(i.name," />"));else{var S=e(l,i.children,o);n.push("<".concat(i.name,">").concat(S,"</").concat(i.name,">"))}else if("object"!==r(y)||v)1===i.children.length&&m?n.push(t.cloneElement(y,c({},y.props,{key:f}),m)):n.push(t.cloneElement(y,c({},y.props,{key:f})));else{var N=i.children[0]?m:null;N&&n.push(N)}}else"text"===i.type&&n.push(i.content);return n}),[])}([{dummy:!0,children:e}],y.parse("<0>".concat(f,"</0>")),z(e||[]));return L(p[0])}function B(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.i18n,i=n.useContext(b)||{},a=i.i18n,o=i.defaultNS,s=r||a||S();if(s&&!s.reportNamespaces&&(s.reportNamespaces=new j),!s){R("You will need pass in an i18next instance by using initReactI18next");var l=function(e){return Array.isArray(e)?e[e.length-1]:e},f=[l,{},!1];return f.t=l,f.i18n={},f.ready=!1,f}var p=c({},w(),{},s.options.react,{},t),d=p.useSuspense,g=e||o||s.options&&s.options.defaultNS;g="string"==typeof g?[g]:g||["translation"],s.reportNamespaces.addUsedNamespaces&&s.reportNamespaces.addUsedNamespaces(g);var m=(s.isInitialized||s.initializedStoreOnce)&&g.every((function(e){return function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!n.languages||!n.languages.length)return R("i18n.languages were undefined or empty",n.languages),!0;var r=n.languages[0],i=!!n.options&&n.options.fallbackLng,a=n.languages[n.languages.length-1];if("cimode"===r.toLowerCase())return!0;var o=function(e,t){var r=n.services.backendConnector.state["".concat(e,"|").concat(t)];return-1===r||2===r};return!(t.bindI18n&&t.bindI18n.indexOf("languageChanging")>-1&&n.services.backendConnector.backend&&n.isLanguageChangingTo&&!o(n.isLanguageChangingTo,e))&&(!!n.hasResourceBundle(r,e)||(!n.services.backendConnector.backend||!(!o(r,e)||i&&!o(a,e))))}(e,s,p)}));function h(){return{t:s.getFixedT(null,"fallback"===p.nsMode?g:g[0])}}var y=u(n.useState(h()),2),v=y[0],O=y[1],E=n.useRef(!0);n.useEffect((function(){var e=p.bindI18n,n=p.bindI18nStore;function t(){E.current&&O(h())}return E.current=!0,m||d||C(s,g,(function(){E.current&&O(h())})),e&&s&&s.on(e,t),n&&s&&s.store.on(n,t),function(){E.current=!1,e&&s&&e.split(" ").forEach((function(e){return s.off(e,t)})),n&&s&&n.split(" ").forEach((function(e){return s.store.off(e,t)}))}}),[g.join()]);var N=[v.t,s,m];if(N.t=v.t,N.i18n=s,N.ready=m,m)return N;if(!m&&!d)return N;throw new Promise((function(e){C(s,g,(function(){E.current&&O(h()),e()}))}))}function V(e,t){var r=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).i18n,i=(n.useContext(b)||{}).i18n,a=r||i||S();a.options&&a.options.isClone||(e&&!a.initializedStoreOnce&&(a.services.resourceStore.data=e,a.options.ns=Object.values(e).reduce((function(e,n){return Object.keys(n).forEach((function(n){e.indexOf(n)<0&&e.push(n)})),e}),a.options.ns),a.initializedStoreOnce=!0,a.isInitialized=!0),t&&!a.initializedLanguageOnce&&(a.changeLanguage(t),a.initializedLanguageOnce=!0))}e.I18nContext=b,e.I18nextProvider=function(e){var t=e.i18n,r=e.defaultNS,i=e.children;return n.createElement(b.Provider,{value:{i18n:t,defaultNS:r}},i)},e.Trans=function(e){var i=e.children,a=e.count,o=e.parent,u=e.i18nKey,l=e.tOptions,f=e.values,p=e.defaults,d=e.components,g=e.ns,m=e.i18n,h=e.t,y=s(e,["children","count","parent","i18nKey","tOptions","values","defaults","components","ns","i18n","t"]),v=n.useContext(b)||{},O=v.i18n,j=v.defaultNS,E=m||O||S();if(!E)return R("You will need pass in an i18next instance by using i18nextReactModule"),i;var N=h||E.t.bind(E)||function(e){return e},x=c({},w(),{},E.options&&E.options.react),k=g||N.ns||j||E.options&&E.options.defaultNS;k="string"==typeof k?[k]:k||["translation"];var P=p||function e(n,i){if(!n)return"";var a="",o=z(n),c=i.transKeepBasicHtmlNodesFor||[];return o.forEach((function(n,o){if("string"==typeof n)a+="".concat(n);else if(t.isValidElement(n)){var u=Object.keys(n.props).length,l=c.indexOf(n.type)>-1,f=n.props.children;if(!f&&l&&0===u)a+="<".concat(n.type,"/>");else if(f||l&&0===u)if(n.props.i18nIsDynamicList)a+="<".concat(o,"></").concat(o,">");else if(l&&1===u&&"string"==typeof f)a+="<".concat(n.type,">").concat(f,"</").concat(n.type,">");else{var p=e(f,i);a+="<".concat(o,">").concat(p,"</").concat(o,">")}else a+="<".concat(o,"></").concat(o,">")}else if("object"===r(n)){var d=n.format,g=s(n,["format"]),m=Object.keys(g);if(1===m.length){var h=d?"".concat(m[0],", ").concat(d):m[0];a+="{{".concat(h,"}}")}else I("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.",n)}else I("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.",n)})),a}(i,x)||x.transEmptyNodeValue||u,C=x.hashTransKey,T=u||(C?C(P):P),A=c({},l,{count:a},f,{},f?{}:{interpolation:{prefix:"#$?",suffix:"?$#"}},{defaultValue:P,ns:k}),L=D(d||i,T?N(T,A):P,E,x,A),B=void 0!==o?o:x.defaultTransParent;return B?t.createElement(B,y,L):L},e.Translation=function(e){var n=e.ns,t=e.children,r=u(B(n,s(e,["ns","children"])),3),i=r[0],a=r[1],o=r[2];return t(i,{i18n:a,lng:a.language},o)},e.composeInitialProps=x,e.getDefaults=w,e.getI18n=S,e.getInitialProps=k,e.initReactI18next=N,e.setDefaults=O,e.setI18n=E,e.useSSR=V,e.useTranslation=B,e.withSSR=function(){return function(e){function n(n){var r=n.initialI18nStore,i=n.initialLanguage,a=s(n,["initialI18nStore","initialLanguage"]);return V(r,i),t.createElement(e,c({},a))}return n.getInitialProps=x(e),n.displayName="withI18nextSSR(".concat(T(e),")"),n.WrappedComponent=e,n}},e.withTranslation=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(r){function i(i){var a=i.forwardedRef,o=s(i,["forwardedRef"]),l=u(B(e,o),3),f=c({},o,{t:l[0],i18n:l[1],tReady:l[2]});return n.withRef&&a?f.ref=a:!n.withRef&&a&&(f.forwardedRef=a),t.createElement(r,f)}i.displayName="withI18nextTranslation(".concat(T(r),")"),i.WrappedComponent=r;return n.withRef?t.forwardRef((function(e,n){return t.createElement(i,Object.assign({},e,{forwardedRef:n}))})):i}},Object.defineProperty(e,"__esModule",{value:!0})}));
+define(["exports","react"],(function(e,n){"use strict";var t="default"in n?n.default:n;function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function i(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(t,!0).forEach((function(n){a(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(t).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function u(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var t=[],r=!0,i=!1,a=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(t.push(o.value),!n||t.length!==n);r=!0);}catch(e){i=!0,a=e}finally{try{r||null==c.return||c.return()}finally{if(i)throw a}}return t}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,menuitem:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},f=/([\w-]+)|=|(['"])([.\s\S]*?)\2/g,p=/(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g,d=Object.create?Object.create(null):{};function g(e,n,t,r,i){var a=n.indexOf("<",r),o=n.slice(r,-1===a?void 0:a);/^\s*$/.test(o)&&(o=" "),(!i&&a>-1&&t+e.length>=0||" "!==o)&&e.push({type:"text",content:o})}function m(e,n){switch(n.type){case"text":return e+n.content;case"tag":return e+="<"+n.name+(n.attrs?function(e){var n=[];for(var t in e)n.push(t+'="'+e[t]+'"');return n.length?" "+n.join(" "):""}(n.attrs):"")+(n.voidElement?"/>":">"),n.voidElement?e:e+n.children.reduce(m,"")+"</"+n.name+">"}}var h,y={parse:function(e,n){n||(n={}),n.components||(n.components=d);var t,r=[],i=-1,a=[],o={},c=!1;return e.replace(p,(function(s,u){if(c){if(s!=="</"+t.name+">")return;c=!1}var p,d="/"!==s.charAt(1),m=0===s.indexOf("\x3c!--"),h=u+s.length,y=e.charAt(h);d&&!m&&(i++,"tag"===(t=function(e){var n,t=0,r=!0,i={type:"tag",name:"",voidElement:!1,attrs:{},children:[]};return e.replace(f,(function(a){if("="===a)return r=!0,void t++;r?0===t?((l[a]||"/"===e.charAt(e.length-2))&&(i.voidElement=!0),i.name=a):(i.attrs[n]=a.replace(/^['"]|['"]$/g,""),n=void 0):(n&&(i.attrs[n]=n),n=a),t++,r=!1})),i}(s)).type&&n.components[t.name]&&(t.type="component",c=!0),t.voidElement||c||!y||"<"===y||g(t.children,e,i,h,n.ignoreWhitespace),o[t.tagName]=t,0===i&&r.push(t),(p=a[i-1])&&p.children.push(t),a[i]=t),(m||!d||t.voidElement)&&(m||i--,!c&&"<"!==y&&y&&g(p=-1===i?r:a[i].children,e,i,h,n.ignoreWhitespace))})),!r.length&&e.length&&g(r,e,0,0,n.ignoreWhitespace),r},stringify:function(e){return e.reduce((function(e,n){return e+m("",n)}),"")}},v={bindI18n:"languageChanged",bindI18nStore:"",transEmptyNodeValue:"",transSupportBasicHtmlNodes:!0,transKeepBasicHtmlNodesFor:["br","strong","i","p"],useSuspense:!0},b=t.createContext();function O(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};v=c({},v,{},e)}function w(){return v}var j=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.usedNamespaces={}}var n,t,r;return n=e,(t=[{key:"addUsedNamespaces",value:function(e){var n=this;e.forEach((function(e){n.usedNamespaces[e]||(n.usedNamespaces[e]=!0)}))}},{key:"getUsedNamespaces",value:function(){return Object.keys(this.usedNamespaces)}}])&&i(n.prototype,t),r&&i(n,r),e}();function E(e){h=e}function S(){return h}var N={type:"3rdParty",init:function(e){O(e.options.react),E(e)}};function x(e){return function(n){return new Promise((function(t){var r=k();e.getInitialProps?e.getInitialProps(n).then((function(e){t(c({},e,{},r))})):t(r)}))}}function k(){var e=S(),n=e.reportNamespaces?e.reportNamespaces.getUsedNamespaces():[],t={},r={};return e.languages.forEach((function(t){r[t]={},n.forEach((function(n){r[t][n]=e.getResourceBundle(t,n)||{}}))})),t.initialI18nStore=r,t.initialLanguage=e.language,t}function I(){if(console&&console.warn){for(var e,n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];"string"==typeof t[0]&&(t[0]="react-i18next:: ".concat(t[0])),(e=console).warn.apply(e,t)}}var P={};function R(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];"string"==typeof n[0]&&P[n[0]]||("string"==typeof n[0]&&(P[n[0]]=new Date),I.apply(void 0,n))}function C(e,n,t){e.loadNamespaces(n,(function(){if(e.isInitialized)t();else{e.on("initialized",(function n(){setTimeout((function(){e.off("initialized",n)}),0),t()}))}}))}function T(e){return e.displayName||e.name||("string"==typeof e&&e.length>0?e:"Unknown")}function A(e,n){if(!e)return!1;var t=e.props?e.props.children:e.children;return n?t.length>0:!!t}function L(e){return e?e&&e.children?e.children:e.props&&e.props.children:[]}function z(e){return Array.isArray(e)?e:[e]}function D(e,n,i,a,o){if(""===n)return[];var s=a.transKeepBasicHtmlNodesFor||[],u=n&&new RegExp(s.join("|")).test(n);if(!e&&!u)return[n];var l={};!function e(n){z(n).forEach((function(n){"string"!=typeof n&&(A(n)?e(L(n)):"object"!==r(n)||t.isValidElement(n)||Object.assign(l,n))}))}(e);var f=i.services.interpolator.interpolate(n,c({},l,{},o),i.language),p=y.parse("<0>".concat(f,"</0>"));function d(e,n,r){var i=L(e),a=m(i,n.children,r);return function(e){return"[object Array]"===Object.prototype.toString.call(e)&&e.every((function(e){return t.isValidElement(e)}))}(i)&&0===a.length?i:a}function g(e,n,r,i){e.dummy&&(e.children=n),r.push(t.cloneElement(e,c({},e.props,{key:i}),n))}function m(n,i,o){var l=z(n);return z(i).reduce((function(n,i,f){var p,h,y,v=i.children&&i.children[0]&&i.children[0].content;if("tag"===i.type){var b=l[parseInt(i.name,10)];!b&&1===o.length&&o[0][i.name]&&(b=o[0][i.name]),b||(b={});var O=0!==Object.keys(i.attrs).length?(p={props:i.attrs},(y=c({},h=b)).props=Object.assign(p.props,h.props),y):b,w=t.isValidElement(O),j=w&&A(i,!0)&&!i.voidElement,E=u&&"object"===r(O)&&O.dummy&&!w,S="object"===r(e)&&null!==e&&Object.hasOwnProperty.call(e,i.name);if("string"==typeof O)n.push(O);else if(A(O)||j){g(O,d(O,i,o),n,f)}else if(E){var N=m(l,i.children,o);n.push(t.cloneElement(O,c({},O.props,{key:f}),N))}else if(Number.isNaN(parseFloat(i.name))){if(S)g(O,d(O,i,o),n,f);else if(a.transSupportBasicHtmlNodes&&s.indexOf(i.name)>-1)if(i.voidElement)n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)}));else{var x=m(l,i.children,o);n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)},x))}else if(i.voidElement)n.push("<".concat(i.name," />"));else{var k=m(l,i.children,o);n.push("<".concat(i.name,">").concat(k,"</").concat(i.name,">"))}}else if("object"!==r(O)||w)1===i.children.length&&v?n.push(t.cloneElement(O,c({},O.props,{key:f}),v)):n.push(t.cloneElement(O,c({},O.props,{key:f})));else{var I=i.children[0]?v:null;I&&n.push(I)}}else"text"===i.type&&n.push(i.content);return n}),[])}return L(m([{dummy:!0,children:e}],p,z(e||[]))[0])}function B(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.i18n,i=n.useContext(b)||{},a=i.i18n,o=i.defaultNS,s=r||a||S();if(s&&!s.reportNamespaces&&(s.reportNamespaces=new j),!s){R("You will need pass in an i18next instance by using initReactI18next");var l=function(e){return Array.isArray(e)?e[e.length-1]:e},f=[l,{},!1];return f.t=l,f.i18n={},f.ready=!1,f}var p=c({},w(),{},s.options.react,{},t),d=p.useSuspense,g=e||o||s.options&&s.options.defaultNS;g="string"==typeof g?[g]:g||["translation"],s.reportNamespaces.addUsedNamespaces&&s.reportNamespaces.addUsedNamespaces(g);var m=(s.isInitialized||s.initializedStoreOnce)&&g.every((function(e){return function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!n.languages||!n.languages.length)return R("i18n.languages were undefined or empty",n.languages),!0;var r=n.languages[0],i=!!n.options&&n.options.fallbackLng,a=n.languages[n.languages.length-1];if("cimode"===r.toLowerCase())return!0;var o=function(e,t){var r=n.services.backendConnector.state["".concat(e,"|").concat(t)];return-1===r||2===r};return!(t.bindI18n&&t.bindI18n.indexOf("languageChanging")>-1&&n.services.backendConnector.backend&&n.isLanguageChangingTo&&!o(n.isLanguageChangingTo,e))&&(!!n.hasResourceBundle(r,e)||(!n.services.backendConnector.backend||!(!o(r,e)||i&&!o(a,e))))}(e,s,p)}));function h(){return{t:s.getFixedT(null,"fallback"===p.nsMode?g:g[0])}}var y=u(n.useState(h()),2),v=y[0],O=y[1],E=n.useRef(!0);n.useEffect((function(){var e=p.bindI18n,n=p.bindI18nStore;function t(){E.current&&O(h())}return E.current=!0,m||d||C(s,g,(function(){E.current&&O(h())})),e&&s&&s.on(e,t),n&&s&&s.store.on(n,t),function(){E.current=!1,e&&s&&e.split(" ").forEach((function(e){return s.off(e,t)})),n&&s&&n.split(" ").forEach((function(e){return s.store.off(e,t)}))}}),[g.join()]);var N=[v.t,s,m];if(N.t=v.t,N.i18n=s,N.ready=m,m)return N;if(!m&&!d)return N;throw new Promise((function(e){C(s,g,(function(){E.current&&O(h()),e()}))}))}function V(e,t){var r=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).i18n,i=(n.useContext(b)||{}).i18n,a=r||i||S();a.options&&a.options.isClone||(e&&!a.initializedStoreOnce&&(a.services.resourceStore.data=e,a.options.ns=Object.values(e).reduce((function(e,n){return Object.keys(n).forEach((function(n){e.indexOf(n)<0&&e.push(n)})),e}),a.options.ns),a.initializedStoreOnce=!0,a.isInitialized=!0),t&&!a.initializedLanguageOnce&&(a.changeLanguage(t),a.initializedLanguageOnce=!0))}e.I18nContext=b,e.I18nextProvider=function(e){var t=e.i18n,r=e.defaultNS,i=e.children;return n.createElement(b.Provider,{value:{i18n:t,defaultNS:r}},i)},e.Trans=function(e){var i=e.children,a=e.count,o=e.parent,u=e.i18nKey,l=e.tOptions,f=e.values,p=e.defaults,d=e.components,g=e.ns,m=e.i18n,h=e.t,y=s(e,["children","count","parent","i18nKey","tOptions","values","defaults","components","ns","i18n","t"]),v=n.useContext(b)||{},O=v.i18n,j=v.defaultNS,E=m||O||S();if(!E)return R("You will need pass in an i18next instance by using i18nextReactModule"),i;var N=h||E.t.bind(E)||function(e){return e},x=c({},w(),{},E.options&&E.options.react),k=g||N.ns||j||E.options&&E.options.defaultNS;k="string"==typeof k?[k]:k||["translation"];var P=p||function e(n,i){if(!n)return"";var a="",o=z(n),c=i.transKeepBasicHtmlNodesFor||[];return o.forEach((function(n,o){if("string"==typeof n)a+="".concat(n);else if(t.isValidElement(n)){var u=Object.keys(n.props).length,l=c.indexOf(n.type)>-1,f=n.props.children;if(!f&&l&&0===u)a+="<".concat(n.type,"/>");else if(f||l&&0===u)if(n.props.i18nIsDynamicList)a+="<".concat(o,"></").concat(o,">");else if(l&&1===u&&"string"==typeof f)a+="<".concat(n.type,">").concat(f,"</").concat(n.type,">");else{var p=e(f,i);a+="<".concat(o,">").concat(p,"</").concat(o,">")}else a+="<".concat(o,"></").concat(o,">")}else if("object"===r(n)){var d=n.format,g=s(n,["format"]),m=Object.keys(g);if(1===m.length){var h=d?"".concat(m[0],", ").concat(d):m[0];a+="{{".concat(h,"}}")}else I("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.",n)}else I("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.",n)})),a}(i,x)||x.transEmptyNodeValue||u,C=x.hashTransKey,T=u||(C?C(P):P),A=c({},l,{count:a},f,{},f?{}:{interpolation:{prefix:"#$?",suffix:"?$#"}},{defaultValue:P,ns:k}),L=D(d||i,T?N(T,A):P,E,x,A),B=void 0!==o?o:x.defaultTransParent;return B?t.createElement(B,y,L):L},e.Translation=function(e){var n=e.ns,t=e.children,r=u(B(n,s(e,["ns","children"])),3),i=r[0],a=r[1],o=r[2];return t(i,{i18n:a,lng:a.language},o)},e.composeInitialProps=x,e.getDefaults=w,e.getI18n=S,e.getInitialProps=k,e.initReactI18next=N,e.setDefaults=O,e.setI18n=E,e.useSSR=V,e.useTranslation=B,e.withSSR=function(){return function(e){function n(n){var r=n.initialI18nStore,i=n.initialLanguage,a=s(n,["initialI18nStore","initialLanguage"]);return V(r,i),t.createElement(e,c({},a))}return n.getInitialProps=x(e),n.displayName="withI18nextSSR(".concat(T(e),")"),n.WrappedComponent=e,n}},e.withTranslation=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(r){function i(i){var a=i.forwardedRef,o=s(i,["forwardedRef"]),l=u(B(e,o),3),f=c({},o,{t:l[0],i18n:l[1],tReady:l[2]});return n.withRef&&a?f.ref=a:!n.withRef&&a&&(f.forwardedRef=a),t.createElement(r,f)}i.displayName="withI18nextTranslation(".concat(T(r),")"),i.WrappedComponent=r;return n.withRef?t.forwardRef((function(e,n){return t.createElement(i,Object.assign({},e,{forwardedRef:n}))})):i}},Object.defineProperty(e,"__esModule",{value:!0})}));

package/dist/commonjs/Trans.js

@@ -121,6 +121,19 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
 
   var ast = _htmlParseStringify["default"].parse("<0>".concat(interpolatedString, "</0>"));
 
+  function renderInner(child, node, rootReactNode) {
+    var childs = getChildren(child);
+    var mappedChildren = mapAST(childs, node.children, rootReactNode);
+    return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
+  }
+
+  function pushTranslatedJSX(child, inner, mem, i) {
+    if (child.dummy) child.children = inner;
+    mem.push(_react["default"].cloneElement(child, _objectSpread({}, child.props, {
+      key: i
+    }), inner));
+  }
+
   function mapAST(reactNode, astNode, rootReactNode) {
     var reactNodes = getAsArray(reactNode);
     var astNodes = getAsArray(astNode);
@@ -137,41 +150,44 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
 
         var isElement = _react["default"].isValidElement(child);
 
+        var isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;
+        var isEmptyTransWithHTML = emptyChildrenButNeedsHandling && (0, _typeof2["default"])(child) === 'object' && child.dummy && !isElement;
+        var isKnownComponent = (0, _typeof2["default"])(children) === 'object' && children !== null && Object.hasOwnProperty.call(children, node.name);
+
         if (typeof child === 'string') {
           mem.push(child);
-        } else if (hasChildren(child) || isElement && hasChildren(node, true) && !node.voidElement) {
-            var childs = getChildren(child);
-            var mappedChildren = mapAST(childs, node.children, rootReactNode);
-            var inner = hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
-            if (child.dummy) child.children = inner;
-            mem.push(_react["default"].cloneElement(child, _objectSpread({}, child.props, {
-              key: i
-            }), inner));
-          } else if (emptyChildrenButNeedsHandling && (0, _typeof2["default"])(child) === 'object' && child.dummy && !isElement) {
+        } else if (hasChildren(child) || isValidTranslationWithChildren) {
+            var inner = renderInner(child, node, rootReactNode);
+            pushTranslatedJSX(child, inner, mem, i);
+          } else if (isEmptyTransWithHTML) {
           var _inner = mapAST(reactNodes, node.children, rootReactNode);
 
           mem.push(_react["default"].cloneElement(child, _objectSpread({}, child.props, {
             key: i
           }), _inner));
         } else if (Number.isNaN(parseFloat(node.name))) {
-          if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
+          if (isKnownComponent) {
+            var _inner2 = renderInner(child, node, rootReactNode);
+
+            pushTranslatedJSX(child, _inner2, mem, i);
+          } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
             if (node.voidElement) {
               mem.push(_react["default"].createElement(node.name, {
                 key: "".concat(node.name, "-").concat(i)
               }));
             } else {
-              var _inner2 = mapAST(reactNodes, node.children, rootReactNode);
+              var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
 
               mem.push(_react["default"].createElement(node.name, {
                 key: "".concat(node.name, "-").concat(i)
-              }, _inner2));
+              }, _inner3));
             }
           } else if (node.voidElement) {
             mem.push("<".concat(node.name, " />"));
           } else {
-            var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
+            var _inner4 = mapAST(reactNodes, node.children, rootReactNode);
 
-            mem.push("<".concat(node.name, ">").concat(_inner3, "</").concat(node.name, ">"));
+            mem.push("<".concat(node.name, ">").concat(_inner4, "</").concat(node.name, ">"));
           }
         } else if ((0, _typeof2["default"])(child) === 'object' && !isElement) {
           var content = node.children[0] ? translationContent : null;

package/dist/es/Trans.js

@@ -104,6 +104,19 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
   var interpolatedString = i18n.services.interpolator.interpolate(targetString, _objectSpread({}, data, {}, combinedTOpts), i18n.language);
   var ast = HTML.parse("<0>".concat(interpolatedString, "</0>"));
 
+  function renderInner(child, node, rootReactNode) {
+    var childs = getChildren(child);
+    var mappedChildren = mapAST(childs, node.children, rootReactNode);
+    return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
+  }
+
+  function pushTranslatedJSX(child, inner, mem, i) {
+    if (child.dummy) child.children = inner;
+    mem.push(React.cloneElement(child, _objectSpread({}, child.props, {
+      key: i
+    }), inner));
+  }
+
   function mapAST(reactNode, astNode, rootReactNode) {
     var reactNodes = getAsArray(reactNode);
     var astNodes = getAsArray(astNode);
@@ -118,42 +131,44 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
           props: node.attrs
         }, tmp) : tmp;
         var isElement = React.isValidElement(child);
+        var isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;
+        var isEmptyTransWithHTML = emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement;
+        var isKnownComponent = _typeof(children) === 'object' && children !== null && Object.hasOwnProperty.call(children, node.name);
 
         if (typeof child === 'string') {
           mem.push(child);
-        } else if (hasChildren(child) || isElement && hasChildren(node, true) && !node.voidElement) {
-            var childs = getChildren(child);
-            var mappedChildren = mapAST(childs, node.children, rootReactNode);
-            var inner = hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
-            if (child.dummy) child.children = inner;
-            mem.push(React.cloneElement(child, _objectSpread({}, child.props, {
-              key: i
-            }), inner));
-          } else if (emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement) {
+        } else if (hasChildren(child) || isValidTranslationWithChildren) {
+            var inner = renderInner(child, node, rootReactNode);
+            pushTranslatedJSX(child, inner, mem, i);
+          } else if (isEmptyTransWithHTML) {
           var _inner = mapAST(reactNodes, node.children, rootReactNode);
 
           mem.push(React.cloneElement(child, _objectSpread({}, child.props, {
             key: i
           }), _inner));
         } else if (Number.isNaN(parseFloat(node.name))) {
-          if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
+          if (isKnownComponent) {
+            var _inner2 = renderInner(child, node, rootReactNode);
+
+            pushTranslatedJSX(child, _inner2, mem, i);
+          } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
             if (node.voidElement) {
               mem.push(React.createElement(node.name, {
                 key: "".concat(node.name, "-").concat(i)
               }));
             } else {
-              var _inner2 = mapAST(reactNodes, node.children, rootReactNode);
+              var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
 
               mem.push(React.createElement(node.name, {
                 key: "".concat(node.name, "-").concat(i)
-              }, _inner2));
+              }, _inner3));
             }
           } else if (node.voidElement) {
             mem.push("<".concat(node.name, " />"));
           } else {
-            var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
+            var _inner4 = mapAST(reactNodes, node.children, rootReactNode);
 
-            mem.push("<".concat(node.name, ">").concat(_inner3, "</").concat(node.name, ">"));
+            mem.push("<".concat(node.name, ">").concat(_inner4, "</").concat(node.name, ">"));
           }
         } else if (_typeof(child) === 'object' && !isElement) {
           var content = node.children[0] ? translationContent : null;

package/dist/umd/react-i18next.js

@@ -615,6 +615,19 @@
     var interpolatedString = i18n.services.interpolator.interpolate(targetString, _objectSpread2({}, data, {}, combinedTOpts), i18n.language);
     var ast = htmlParseStringify2.parse("<0>".concat(interpolatedString, "</0>"));
 
+    function renderInner(child, node, rootReactNode) {
+      var childs = getChildren(child);
+      var mappedChildren = mapAST(childs, node.children, rootReactNode);
+      return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
+    }
+
+    function pushTranslatedJSX(child, inner, mem, i) {
+      if (child.dummy) child.children = inner;
+      mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
+        key: i
+      }), inner));
+    }
+
     function mapAST(reactNode, astNode, rootReactNode) {
       var reactNodes = getAsArray(reactNode);
       var astNodes = getAsArray(astNode);
@@ -629,42 +642,44 @@
             props: node.attrs
           }, tmp) : tmp;
           var isElement = React__default.isValidElement(child);
+          var isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;
+          var isEmptyTransWithHTML = emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement;
+          var isKnownComponent = _typeof(children) === 'object' && children !== null && Object.hasOwnProperty.call(children, node.name);
 
           if (typeof child === 'string') {
             mem.push(child);
-          } else if (hasChildren(child) || isElement && hasChildren(node, true) && !node.voidElement) {
-              var childs = getChildren(child);
-              var mappedChildren = mapAST(childs, node.children, rootReactNode);
-              var inner = hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
-              if (child.dummy) child.children = inner;
-              mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
-                key: i
-              }), inner));
-            } else if (emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement) {
+          } else if (hasChildren(child) || isValidTranslationWithChildren) {
+              var inner = renderInner(child, node, rootReactNode);
+              pushTranslatedJSX(child, inner, mem, i);
+            } else if (isEmptyTransWithHTML) {
             var _inner = mapAST(reactNodes, node.children, rootReactNode);
 
             mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
               key: i
             }), _inner));
           } else if (Number.isNaN(parseFloat(node.name))) {
-            if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
+            if (isKnownComponent) {
+              var _inner2 = renderInner(child, node, rootReactNode);
+
+              pushTranslatedJSX(child, _inner2, mem, i);
+            } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
               if (node.voidElement) {
                 mem.push(React__default.createElement(node.name, {
                   key: "".concat(node.name, "-").concat(i)
                 }));
               } else {
-                var _inner2 = mapAST(reactNodes, node.children, rootReactNode);
+                var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
 
                 mem.push(React__default.createElement(node.name, {
                   key: "".concat(node.name, "-").concat(i)
-                }, _inner2));
+                }, _inner3));
               }
             } else if (node.voidElement) {
               mem.push("<".concat(node.name, " />"));
             } else {
-              var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
+              var _inner4 = mapAST(reactNodes, node.children, rootReactNode);
 
-              mem.push("<".concat(node.name, ">").concat(_inner3, "</").concat(node.name, ">"));
+              mem.push("<".concat(node.name, ">").concat(_inner4, "</").concat(node.name, ">"));
             }
           } else if (_typeof(child) === 'object' && !isElement) {
             var content = node.children[0] ? translationContent : null;

package/dist/umd/react-i18next.min.js

@@ -1 +1 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((e=e||self).ReactI18next={},e.React)}(this,(function(e,n){"use strict";var t="default"in n?n.default:n;function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function i(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(t,!0).forEach((function(n){a(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(t).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function u(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var t=[],r=!0,i=!1,a=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(t.push(o.value),!n||t.length!==n);r=!0);}catch(e){i=!0,a=e}finally{try{r||null==c.return||c.return()}finally{if(i)throw a}}return t}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,menuitem:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},f=/([\w-]+)|=|(['"])([.\s\S]*?)\2/g,p=/(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g,d=Object.create?Object.create(null):{};function g(e,n,t,r,i){var a=n.indexOf("<",r),o=n.slice(r,-1===a?void 0:a);/^\s*$/.test(o)&&(o=" "),(!i&&a>-1&&t+e.length>=0||" "!==o)&&e.push({type:"text",content:o})}function m(e,n){switch(n.type){case"text":return e+n.content;case"tag":return e+="<"+n.name+(n.attrs?function(e){var n=[];for(var t in e)n.push(t+'="'+e[t]+'"');return n.length?" "+n.join(" "):""}(n.attrs):"")+(n.voidElement?"/>":">"),n.voidElement?e:e+n.children.reduce(m,"")+"</"+n.name+">"}}var h,y={parse:function(e,n){n||(n={}),n.components||(n.components=d);var t,r=[],i=-1,a=[],o={},c=!1;return e.replace(p,(function(s,u){if(c){if(s!=="</"+t.name+">")return;c=!1}var p,d="/"!==s.charAt(1),m=0===s.indexOf("\x3c!--"),h=u+s.length,y=e.charAt(h);d&&!m&&(i++,"tag"===(t=function(e){var n,t=0,r=!0,i={type:"tag",name:"",voidElement:!1,attrs:{},children:[]};return e.replace(f,(function(a){if("="===a)return r=!0,void t++;r?0===t?((l[a]||"/"===e.charAt(e.length-2))&&(i.voidElement=!0),i.name=a):(i.attrs[n]=a.replace(/^['"]|['"]$/g,""),n=void 0):(n&&(i.attrs[n]=n),n=a),t++,r=!1})),i}(s)).type&&n.components[t.name]&&(t.type="component",c=!0),t.voidElement||c||!y||"<"===y||g(t.children,e,i,h,n.ignoreWhitespace),o[t.tagName]=t,0===i&&r.push(t),(p=a[i-1])&&p.children.push(t),a[i]=t),(m||!d||t.voidElement)&&(m||i--,!c&&"<"!==y&&y&&g(p=-1===i?r:a[i].children,e,i,h,n.ignoreWhitespace))})),!r.length&&e.length&&g(r,e,0,0,n.ignoreWhitespace),r},stringify:function(e){return e.reduce((function(e,n){return e+m("",n)}),"")}},v={bindI18n:"languageChanged",bindI18nStore:"",transEmptyNodeValue:"",transSupportBasicHtmlNodes:!0,transKeepBasicHtmlNodesFor:["br","strong","i","p"],useSuspense:!0},b=t.createContext();function O(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};v=c({},v,{},e)}function w(){return v}var j=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.usedNamespaces={}}var n,t,r;return n=e,(t=[{key:"addUsedNamespaces",value:function(e){var n=this;e.forEach((function(e){n.usedNamespaces[e]||(n.usedNamespaces[e]=!0)}))}},{key:"getUsedNamespaces",value:function(){return Object.keys(this.usedNamespaces)}}])&&i(n.prototype,t),r&&i(n,r),e}();function E(e){h=e}function S(){return h}var x={type:"3rdParty",init:function(e){O(e.options.react),E(e)}};function N(e){return function(n){return new Promise((function(t){var r=k();e.getInitialProps?e.getInitialProps(n).then((function(e){t(c({},e,{},r))})):t(r)}))}}function k(){var e=S(),n=e.reportNamespaces?e.reportNamespaces.getUsedNamespaces():[],t={},r={};return e.languages.forEach((function(t){r[t]={},n.forEach((function(n){r[t][n]=e.getResourceBundle(t,n)||{}}))})),t.initialI18nStore=r,t.initialLanguage=e.language,t}function I(){if(console&&console.warn){for(var e,n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];"string"==typeof t[0]&&(t[0]="react-i18next:: ".concat(t[0])),(e=console).warn.apply(e,t)}}var P={};function R(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];"string"==typeof n[0]&&P[n[0]]||("string"==typeof n[0]&&(P[n[0]]=new Date),I.apply(void 0,n))}function C(e,n,t){e.loadNamespaces(n,(function(){if(e.isInitialized)t();else{e.on("initialized",(function n(){setTimeout((function(){e.off("initialized",n)}),0),t()}))}}))}function T(e){return e.displayName||e.name||("string"==typeof e&&e.length>0?e:"Unknown")}function A(e,n){if(!e)return!1;var t=e.props?e.props.children:e.children;return n?t.length>0:!!t}function L(e){return e?e&&e.children?e.children:e.props&&e.props.children:[]}function z(e){return Array.isArray(e)?e:[e]}function D(e,n,i,a,o){if(""===n)return[];var s=a.transKeepBasicHtmlNodesFor||[],u=n&&new RegExp(s.join("|")).test(n);if(!e&&!u)return[n];var l={};!function e(n){z(n).forEach((function(n){"string"!=typeof n&&(A(n)?e(L(n)):"object"!==r(n)||t.isValidElement(n)||Object.assign(l,n))}))}(e);var f=i.services.interpolator.interpolate(n,c({},l,{},o),i.language);var p=function e(n,i,o){var l=z(n);return z(i).reduce((function(n,i,f){var p,d,g,m=i.children&&i.children[0]&&i.children[0].content;if("tag"===i.type){var h=l[parseInt(i.name,10)];!h&&1===o.length&&o[0][i.name]&&(h=o[0][i.name]),h||(h={});var y=0!==Object.keys(i.attrs).length?(p={props:i.attrs},(g=c({},d=h)).props=Object.assign(p.props,d.props),g):h,v=t.isValidElement(y);if("string"==typeof y)n.push(y);else if(A(y)||v&&A(i,!0)&&!i.voidElement){var b=L(y),O=e(b,i.children,o),w=function(e){return"[object Array]"===Object.prototype.toString.call(e)&&e.every((function(e){return t.isValidElement(e)}))}(b)&&0===O.length?b:O;y.dummy&&(y.children=w),n.push(t.cloneElement(y,c({},y.props,{key:f}),w))}else if(u&&"object"===r(y)&&y.dummy&&!v){var j=e(l,i.children,o);n.push(t.cloneElement(y,c({},y.props,{key:f}),j))}else if(Number.isNaN(parseFloat(i.name)))if(a.transSupportBasicHtmlNodes&&s.indexOf(i.name)>-1)if(i.voidElement)n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)}));else{var E=e(l,i.children,o);n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)},E))}else if(i.voidElement)n.push("<".concat(i.name," />"));else{var S=e(l,i.children,o);n.push("<".concat(i.name,">").concat(S,"</").concat(i.name,">"))}else if("object"!==r(y)||v)1===i.children.length&&m?n.push(t.cloneElement(y,c({},y.props,{key:f}),m)):n.push(t.cloneElement(y,c({},y.props,{key:f})));else{var x=i.children[0]?m:null;x&&n.push(x)}}else"text"===i.type&&n.push(i.content);return n}),[])}([{dummy:!0,children:e}],y.parse("<0>".concat(f,"</0>")),z(e||[]));return L(p[0])}function B(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.i18n,i=n.useContext(b)||{},a=i.i18n,o=i.defaultNS,s=r||a||S();if(s&&!s.reportNamespaces&&(s.reportNamespaces=new j),!s){R("You will need pass in an i18next instance by using initReactI18next");var l=function(e){return Array.isArray(e)?e[e.length-1]:e},f=[l,{},!1];return f.t=l,f.i18n={},f.ready=!1,f}var p=c({},w(),{},s.options.react,{},t),d=p.useSuspense,g=e||o||s.options&&s.options.defaultNS;g="string"==typeof g?[g]:g||["translation"],s.reportNamespaces.addUsedNamespaces&&s.reportNamespaces.addUsedNamespaces(g);var m=(s.isInitialized||s.initializedStoreOnce)&&g.every((function(e){return function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!n.languages||!n.languages.length)return R("i18n.languages were undefined or empty",n.languages),!0;var r=n.languages[0],i=!!n.options&&n.options.fallbackLng,a=n.languages[n.languages.length-1];if("cimode"===r.toLowerCase())return!0;var o=function(e,t){var r=n.services.backendConnector.state["".concat(e,"|").concat(t)];return-1===r||2===r};return!(t.bindI18n&&t.bindI18n.indexOf("languageChanging")>-1&&n.services.backendConnector.backend&&n.isLanguageChangingTo&&!o(n.isLanguageChangingTo,e))&&(!!n.hasResourceBundle(r,e)||(!n.services.backendConnector.backend||!(!o(r,e)||i&&!o(a,e))))}(e,s,p)}));function h(){return{t:s.getFixedT(null,"fallback"===p.nsMode?g:g[0])}}var y=u(n.useState(h()),2),v=y[0],O=y[1],E=n.useRef(!0);n.useEffect((function(){var e=p.bindI18n,n=p.bindI18nStore;function t(){E.current&&O(h())}return E.current=!0,m||d||C(s,g,(function(){E.current&&O(h())})),e&&s&&s.on(e,t),n&&s&&s.store.on(n,t),function(){E.current=!1,e&&s&&e.split(" ").forEach((function(e){return s.off(e,t)})),n&&s&&n.split(" ").forEach((function(e){return s.store.off(e,t)}))}}),[g.join()]);var x=[v.t,s,m];if(x.t=v.t,x.i18n=s,x.ready=m,m)return x;if(!m&&!d)return x;throw new Promise((function(e){C(s,g,(function(){E.current&&O(h()),e()}))}))}function V(e,t){var r=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).i18n,i=(n.useContext(b)||{}).i18n,a=r||i||S();a.options&&a.options.isClone||(e&&!a.initializedStoreOnce&&(a.services.resourceStore.data=e,a.options.ns=Object.values(e).reduce((function(e,n){return Object.keys(n).forEach((function(n){e.indexOf(n)<0&&e.push(n)})),e}),a.options.ns),a.initializedStoreOnce=!0,a.isInitialized=!0),t&&!a.initializedLanguageOnce&&(a.changeLanguage(t),a.initializedLanguageOnce=!0))}e.I18nContext=b,e.I18nextProvider=function(e){var t=e.i18n,r=e.defaultNS,i=e.children;return n.createElement(b.Provider,{value:{i18n:t,defaultNS:r}},i)},e.Trans=function(e){var i=e.children,a=e.count,o=e.parent,u=e.i18nKey,l=e.tOptions,f=e.values,p=e.defaults,d=e.components,g=e.ns,m=e.i18n,h=e.t,y=s(e,["children","count","parent","i18nKey","tOptions","values","defaults","components","ns","i18n","t"]),v=n.useContext(b)||{},O=v.i18n,j=v.defaultNS,E=m||O||S();if(!E)return R("You will need pass in an i18next instance by using i18nextReactModule"),i;var x=h||E.t.bind(E)||function(e){return e},N=c({},w(),{},E.options&&E.options.react),k=g||x.ns||j||E.options&&E.options.defaultNS;k="string"==typeof k?[k]:k||["translation"];var P=p||function e(n,i){if(!n)return"";var a="",o=z(n),c=i.transKeepBasicHtmlNodesFor||[];return o.forEach((function(n,o){if("string"==typeof n)a+="".concat(n);else if(t.isValidElement(n)){var u=Object.keys(n.props).length,l=c.indexOf(n.type)>-1,f=n.props.children;if(!f&&l&&0===u)a+="<".concat(n.type,"/>");else if(f||l&&0===u)if(n.props.i18nIsDynamicList)a+="<".concat(o,"></").concat(o,">");else if(l&&1===u&&"string"==typeof f)a+="<".concat(n.type,">").concat(f,"</").concat(n.type,">");else{var p=e(f,i);a+="<".concat(o,">").concat(p,"</").concat(o,">")}else a+="<".concat(o,"></").concat(o,">")}else if("object"===r(n)){var d=n.format,g=s(n,["format"]),m=Object.keys(g);if(1===m.length){var h=d?"".concat(m[0],", ").concat(d):m[0];a+="{{".concat(h,"}}")}else I("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.",n)}else I("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.",n)})),a}(i,N)||N.transEmptyNodeValue||u,C=N.hashTransKey,T=u||(C?C(P):P),A=c({},l,{count:a},f,{},f?{}:{interpolation:{prefix:"#$?",suffix:"?$#"}},{defaultValue:P,ns:k}),L=D(d||i,T?x(T,A):P,E,N,A),B=void 0!==o?o:N.defaultTransParent;return B?t.createElement(B,y,L):L},e.Translation=function(e){var n=e.ns,t=e.children,r=u(B(n,s(e,["ns","children"])),3),i=r[0],a=r[1],o=r[2];return t(i,{i18n:a,lng:a.language},o)},e.composeInitialProps=N,e.getDefaults=w,e.getI18n=S,e.getInitialProps=k,e.initReactI18next=x,e.setDefaults=O,e.setI18n=E,e.useSSR=V,e.useTranslation=B,e.withSSR=function(){return function(e){function n(n){var r=n.initialI18nStore,i=n.initialLanguage,a=s(n,["initialI18nStore","initialLanguage"]);return V(r,i),t.createElement(e,c({},a))}return n.getInitialProps=N(e),n.displayName="withI18nextSSR(".concat(T(e),")"),n.WrappedComponent=e,n}},e.withTranslation=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(r){function i(i){var a=i.forwardedRef,o=s(i,["forwardedRef"]),l=u(B(e,o),3),f=c({},o,{t:l[0],i18n:l[1],tReady:l[2]});return n.withRef&&a?f.ref=a:!n.withRef&&a&&(f.forwardedRef=a),t.createElement(r,f)}i.displayName="withI18nextTranslation(".concat(T(r),")"),i.WrappedComponent=r;return n.withRef?t.forwardRef((function(e,n){return t.createElement(i,Object.assign({},e,{forwardedRef:n}))})):i}},Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((e=e||self).ReactI18next={},e.React)}(this,(function(e,n){"use strict";var t="default"in n?n.default:n;function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function i(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(t,!0).forEach((function(n){a(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(t).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function u(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var t=[],r=!0,i=!1,a=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(t.push(o.value),!n||t.length!==n);r=!0);}catch(e){i=!0,a=e}finally{try{r||null==c.return||c.return()}finally{if(i)throw a}}return t}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,menuitem:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},f=/([\w-]+)|=|(['"])([.\s\S]*?)\2/g,p=/(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g,d=Object.create?Object.create(null):{};function g(e,n,t,r,i){var a=n.indexOf("<",r),o=n.slice(r,-1===a?void 0:a);/^\s*$/.test(o)&&(o=" "),(!i&&a>-1&&t+e.length>=0||" "!==o)&&e.push({type:"text",content:o})}function m(e,n){switch(n.type){case"text":return e+n.content;case"tag":return e+="<"+n.name+(n.attrs?function(e){var n=[];for(var t in e)n.push(t+'="'+e[t]+'"');return n.length?" "+n.join(" "):""}(n.attrs):"")+(n.voidElement?"/>":">"),n.voidElement?e:e+n.children.reduce(m,"")+"</"+n.name+">"}}var h,y={parse:function(e,n){n||(n={}),n.components||(n.components=d);var t,r=[],i=-1,a=[],o={},c=!1;return e.replace(p,(function(s,u){if(c){if(s!=="</"+t.name+">")return;c=!1}var p,d="/"!==s.charAt(1),m=0===s.indexOf("\x3c!--"),h=u+s.length,y=e.charAt(h);d&&!m&&(i++,"tag"===(t=function(e){var n,t=0,r=!0,i={type:"tag",name:"",voidElement:!1,attrs:{},children:[]};return e.replace(f,(function(a){if("="===a)return r=!0,void t++;r?0===t?((l[a]||"/"===e.charAt(e.length-2))&&(i.voidElement=!0),i.name=a):(i.attrs[n]=a.replace(/^['"]|['"]$/g,""),n=void 0):(n&&(i.attrs[n]=n),n=a),t++,r=!1})),i}(s)).type&&n.components[t.name]&&(t.type="component",c=!0),t.voidElement||c||!y||"<"===y||g(t.children,e,i,h,n.ignoreWhitespace),o[t.tagName]=t,0===i&&r.push(t),(p=a[i-1])&&p.children.push(t),a[i]=t),(m||!d||t.voidElement)&&(m||i--,!c&&"<"!==y&&y&&g(p=-1===i?r:a[i].children,e,i,h,n.ignoreWhitespace))})),!r.length&&e.length&&g(r,e,0,0,n.ignoreWhitespace),r},stringify:function(e){return e.reduce((function(e,n){return e+m("",n)}),"")}},v={bindI18n:"languageChanged",bindI18nStore:"",transEmptyNodeValue:"",transSupportBasicHtmlNodes:!0,transKeepBasicHtmlNodesFor:["br","strong","i","p"],useSuspense:!0},b=t.createContext();function O(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};v=c({},v,{},e)}function w(){return v}var j=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.usedNamespaces={}}var n,t,r;return n=e,(t=[{key:"addUsedNamespaces",value:function(e){var n=this;e.forEach((function(e){n.usedNamespaces[e]||(n.usedNamespaces[e]=!0)}))}},{key:"getUsedNamespaces",value:function(){return Object.keys(this.usedNamespaces)}}])&&i(n.prototype,t),r&&i(n,r),e}();function E(e){h=e}function S(){return h}var x={type:"3rdParty",init:function(e){O(e.options.react),E(e)}};function N(e){return function(n){return new Promise((function(t){var r=k();e.getInitialProps?e.getInitialProps(n).then((function(e){t(c({},e,{},r))})):t(r)}))}}function k(){var e=S(),n=e.reportNamespaces?e.reportNamespaces.getUsedNamespaces():[],t={},r={};return e.languages.forEach((function(t){r[t]={},n.forEach((function(n){r[t][n]=e.getResourceBundle(t,n)||{}}))})),t.initialI18nStore=r,t.initialLanguage=e.language,t}function I(){if(console&&console.warn){for(var e,n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];"string"==typeof t[0]&&(t[0]="react-i18next:: ".concat(t[0])),(e=console).warn.apply(e,t)}}var P={};function R(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];"string"==typeof n[0]&&P[n[0]]||("string"==typeof n[0]&&(P[n[0]]=new Date),I.apply(void 0,n))}function C(e,n,t){e.loadNamespaces(n,(function(){if(e.isInitialized)t();else{e.on("initialized",(function n(){setTimeout((function(){e.off("initialized",n)}),0),t()}))}}))}function T(e){return e.displayName||e.name||("string"==typeof e&&e.length>0?e:"Unknown")}function A(e,n){if(!e)return!1;var t=e.props?e.props.children:e.children;return n?t.length>0:!!t}function L(e){return e?e&&e.children?e.children:e.props&&e.props.children:[]}function z(e){return Array.isArray(e)?e:[e]}function D(e,n,i,a,o){if(""===n)return[];var s=a.transKeepBasicHtmlNodesFor||[],u=n&&new RegExp(s.join("|")).test(n);if(!e&&!u)return[n];var l={};!function e(n){z(n).forEach((function(n){"string"!=typeof n&&(A(n)?e(L(n)):"object"!==r(n)||t.isValidElement(n)||Object.assign(l,n))}))}(e);var f=i.services.interpolator.interpolate(n,c({},l,{},o),i.language),p=y.parse("<0>".concat(f,"</0>"));function d(e,n,r){var i=L(e),a=m(i,n.children,r);return function(e){return"[object Array]"===Object.prototype.toString.call(e)&&e.every((function(e){return t.isValidElement(e)}))}(i)&&0===a.length?i:a}function g(e,n,r,i){e.dummy&&(e.children=n),r.push(t.cloneElement(e,c({},e.props,{key:i}),n))}function m(n,i,o){var l=z(n);return z(i).reduce((function(n,i,f){var p,h,y,v=i.children&&i.children[0]&&i.children[0].content;if("tag"===i.type){var b=l[parseInt(i.name,10)];!b&&1===o.length&&o[0][i.name]&&(b=o[0][i.name]),b||(b={});var O=0!==Object.keys(i.attrs).length?(p={props:i.attrs},(y=c({},h=b)).props=Object.assign(p.props,h.props),y):b,w=t.isValidElement(O),j=w&&A(i,!0)&&!i.voidElement,E=u&&"object"===r(O)&&O.dummy&&!w,S="object"===r(e)&&null!==e&&Object.hasOwnProperty.call(e,i.name);if("string"==typeof O)n.push(O);else if(A(O)||j){g(O,d(O,i,o),n,f)}else if(E){var x=m(l,i.children,o);n.push(t.cloneElement(O,c({},O.props,{key:f}),x))}else if(Number.isNaN(parseFloat(i.name))){if(S)g(O,d(O,i,o),n,f);else if(a.transSupportBasicHtmlNodes&&s.indexOf(i.name)>-1)if(i.voidElement)n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)}));else{var N=m(l,i.children,o);n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)},N))}else if(i.voidElement)n.push("<".concat(i.name," />"));else{var k=m(l,i.children,o);n.push("<".concat(i.name,">").concat(k,"</").concat(i.name,">"))}}else if("object"!==r(O)||w)1===i.children.length&&v?n.push(t.cloneElement(O,c({},O.props,{key:f}),v)):n.push(t.cloneElement(O,c({},O.props,{key:f})));else{var I=i.children[0]?v:null;I&&n.push(I)}}else"text"===i.type&&n.push(i.content);return n}),[])}return L(m([{dummy:!0,children:e}],p,z(e||[]))[0])}function B(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.i18n,i=n.useContext(b)||{},a=i.i18n,o=i.defaultNS,s=r||a||S();if(s&&!s.reportNamespaces&&(s.reportNamespaces=new j),!s){R("You will need pass in an i18next instance by using initReactI18next");var l=function(e){return Array.isArray(e)?e[e.length-1]:e},f=[l,{},!1];return f.t=l,f.i18n={},f.ready=!1,f}var p=c({},w(),{},s.options.react,{},t),d=p.useSuspense,g=e||o||s.options&&s.options.defaultNS;g="string"==typeof g?[g]:g||["translation"],s.reportNamespaces.addUsedNamespaces&&s.reportNamespaces.addUsedNamespaces(g);var m=(s.isInitialized||s.initializedStoreOnce)&&g.every((function(e){return function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!n.languages||!n.languages.length)return R("i18n.languages were undefined or empty",n.languages),!0;var r=n.languages[0],i=!!n.options&&n.options.fallbackLng,a=n.languages[n.languages.length-1];if("cimode"===r.toLowerCase())return!0;var o=function(e,t){var r=n.services.backendConnector.state["".concat(e,"|").concat(t)];return-1===r||2===r};return!(t.bindI18n&&t.bindI18n.indexOf("languageChanging")>-1&&n.services.backendConnector.backend&&n.isLanguageChangingTo&&!o(n.isLanguageChangingTo,e))&&(!!n.hasResourceBundle(r,e)||(!n.services.backendConnector.backend||!(!o(r,e)||i&&!o(a,e))))}(e,s,p)}));function h(){return{t:s.getFixedT(null,"fallback"===p.nsMode?g:g[0])}}var y=u(n.useState(h()),2),v=y[0],O=y[1],E=n.useRef(!0);n.useEffect((function(){var e=p.bindI18n,n=p.bindI18nStore;function t(){E.current&&O(h())}return E.current=!0,m||d||C(s,g,(function(){E.current&&O(h())})),e&&s&&s.on(e,t),n&&s&&s.store.on(n,t),function(){E.current=!1,e&&s&&e.split(" ").forEach((function(e){return s.off(e,t)})),n&&s&&n.split(" ").forEach((function(e){return s.store.off(e,t)}))}}),[g.join()]);var x=[v.t,s,m];if(x.t=v.t,x.i18n=s,x.ready=m,m)return x;if(!m&&!d)return x;throw new Promise((function(e){C(s,g,(function(){E.current&&O(h()),e()}))}))}function V(e,t){var r=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).i18n,i=(n.useContext(b)||{}).i18n,a=r||i||S();a.options&&a.options.isClone||(e&&!a.initializedStoreOnce&&(a.services.resourceStore.data=e,a.options.ns=Object.values(e).reduce((function(e,n){return Object.keys(n).forEach((function(n){e.indexOf(n)<0&&e.push(n)})),e}),a.options.ns),a.initializedStoreOnce=!0,a.isInitialized=!0),t&&!a.initializedLanguageOnce&&(a.changeLanguage(t),a.initializedLanguageOnce=!0))}e.I18nContext=b,e.I18nextProvider=function(e){var t=e.i18n,r=e.defaultNS,i=e.children;return n.createElement(b.Provider,{value:{i18n:t,defaultNS:r}},i)},e.Trans=function(e){var i=e.children,a=e.count,o=e.parent,u=e.i18nKey,l=e.tOptions,f=e.values,p=e.defaults,d=e.components,g=e.ns,m=e.i18n,h=e.t,y=s(e,["children","count","parent","i18nKey","tOptions","values","defaults","components","ns","i18n","t"]),v=n.useContext(b)||{},O=v.i18n,j=v.defaultNS,E=m||O||S();if(!E)return R("You will need pass in an i18next instance by using i18nextReactModule"),i;var x=h||E.t.bind(E)||function(e){return e},N=c({},w(),{},E.options&&E.options.react),k=g||x.ns||j||E.options&&E.options.defaultNS;k="string"==typeof k?[k]:k||["translation"];var P=p||function e(n,i){if(!n)return"";var a="",o=z(n),c=i.transKeepBasicHtmlNodesFor||[];return o.forEach((function(n,o){if("string"==typeof n)a+="".concat(n);else if(t.isValidElement(n)){var u=Object.keys(n.props).length,l=c.indexOf(n.type)>-1,f=n.props.children;if(!f&&l&&0===u)a+="<".concat(n.type,"/>");else if(f||l&&0===u)if(n.props.i18nIsDynamicList)a+="<".concat(o,"></").concat(o,">");else if(l&&1===u&&"string"==typeof f)a+="<".concat(n.type,">").concat(f,"</").concat(n.type,">");else{var p=e(f,i);a+="<".concat(o,">").concat(p,"</").concat(o,">")}else a+="<".concat(o,"></").concat(o,">")}else if("object"===r(n)){var d=n.format,g=s(n,["format"]),m=Object.keys(g);if(1===m.length){var h=d?"".concat(m[0],", ").concat(d):m[0];a+="{{".concat(h,"}}")}else I("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.",n)}else I("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.",n)})),a}(i,N)||N.transEmptyNodeValue||u,C=N.hashTransKey,T=u||(C?C(P):P),A=c({},l,{count:a},f,{},f?{}:{interpolation:{prefix:"#$?",suffix:"?$#"}},{defaultValue:P,ns:k}),L=D(d||i,T?x(T,A):P,E,N,A),B=void 0!==o?o:N.defaultTransParent;return B?t.createElement(B,y,L):L},e.Translation=function(e){var n=e.ns,t=e.children,r=u(B(n,s(e,["ns","children"])),3),i=r[0],a=r[1],o=r[2];return t(i,{i18n:a,lng:a.language},o)},e.composeInitialProps=N,e.getDefaults=w,e.getI18n=S,e.getInitialProps=k,e.initReactI18next=x,e.setDefaults=O,e.setI18n=E,e.useSSR=V,e.useTranslation=B,e.withSSR=function(){return function(e){function n(n){var r=n.initialI18nStore,i=n.initialLanguage,a=s(n,["initialI18nStore","initialLanguage"]);return V(r,i),t.createElement(e,c({},a))}return n.getInitialProps=N(e),n.displayName="withI18nextSSR(".concat(T(e),")"),n.WrappedComponent=e,n}},e.withTranslation=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(r){function i(i){var a=i.forwardedRef,o=s(i,["forwardedRef"]),l=u(B(e,o),3),f=c({},o,{t:l[0],i18n:l[1],tReady:l[2]});return n.withRef&&a?f.ref=a:!n.withRef&&a&&(f.forwardedRef=a),t.createElement(r,f)}i.displayName="withI18nextTranslation(".concat(T(r),")"),i.WrappedComponent=r;return n.withRef?t.forwardRef((function(e,n){return t.createElement(i,Object.assign({},e,{forwardedRef:n}))})):i}},Object.defineProperty(e,"__esModule",{value:!0})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-i18next",
-  "version": "11.6.0",
+  "version": "11.7.0",
   "description": "Internationalization for react done right. Using the i18next i18n ecosystem.",
   "main": "dist/commonjs/index.js",
   "types": "src/index.d.ts",

package/react-i18next.js

@@ -615,6 +615,19 @@
     var interpolatedString = i18n.services.interpolator.interpolate(targetString, _objectSpread2({}, data, {}, combinedTOpts), i18n.language);
     var ast = htmlParseStringify2.parse("<0>".concat(interpolatedString, "</0>"));
 
+    function renderInner(child, node, rootReactNode) {
+      var childs = getChildren(child);
+      var mappedChildren = mapAST(childs, node.children, rootReactNode);
+      return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
+    }
+
+    function pushTranslatedJSX(child, inner, mem, i) {
+      if (child.dummy) child.children = inner;
+      mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
+        key: i
+      }), inner));
+    }
+
     function mapAST(reactNode, astNode, rootReactNode) {
       var reactNodes = getAsArray(reactNode);
       var astNodes = getAsArray(astNode);
@@ -629,42 +642,44 @@
             props: node.attrs
           }, tmp) : tmp;
           var isElement = React__default.isValidElement(child);
+          var isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;
+          var isEmptyTransWithHTML = emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement;
+          var isKnownComponent = _typeof(children) === 'object' && children !== null && Object.hasOwnProperty.call(children, node.name);
 
           if (typeof child === 'string') {
             mem.push(child);
-          } else if (hasChildren(child) || isElement && hasChildren(node, true) && !node.voidElement) {
-              var childs = getChildren(child);
-              var mappedChildren = mapAST(childs, node.children, rootReactNode);
-              var inner = hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
-              if (child.dummy) child.children = inner;
-              mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
-                key: i
-              }), inner));
-            } else if (emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement) {
+          } else if (hasChildren(child) || isValidTranslationWithChildren) {
+              var inner = renderInner(child, node, rootReactNode);
+              pushTranslatedJSX(child, inner, mem, i);
+            } else if (isEmptyTransWithHTML) {
             var _inner = mapAST(reactNodes, node.children, rootReactNode);
 
             mem.push(React__default.cloneElement(child, _objectSpread2({}, child.props, {
               key: i
             }), _inner));
           } else if (Number.isNaN(parseFloat(node.name))) {
-            if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
+            if (isKnownComponent) {
+              var _inner2 = renderInner(child, node, rootReactNode);
+
+              pushTranslatedJSX(child, _inner2, mem, i);
+            } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
               if (node.voidElement) {
                 mem.push(React__default.createElement(node.name, {
                   key: "".concat(node.name, "-").concat(i)
                 }));
               } else {
-                var _inner2 = mapAST(reactNodes, node.children, rootReactNode);
+                var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
 
                 mem.push(React__default.createElement(node.name, {
                   key: "".concat(node.name, "-").concat(i)
-                }, _inner2));
+                }, _inner3));
               }
             } else if (node.voidElement) {
               mem.push("<".concat(node.name, " />"));
             } else {
-              var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
+              var _inner4 = mapAST(reactNodes, node.children, rootReactNode);
 
-              mem.push("<".concat(node.name, ">").concat(_inner3, "</").concat(node.name, ">"));
+              mem.push("<".concat(node.name, ">").concat(_inner4, "</").concat(node.name, ">"));
             }
           } else if (_typeof(child) === 'object' && !isElement) {
             var content = node.children[0] ? translationContent : null;

package/react-i18next.min.js

@@ -1 +1 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((e=e||self).ReactI18next={},e.React)}(this,(function(e,n){"use strict";var t="default"in n?n.default:n;function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function i(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(t,!0).forEach((function(n){a(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(t).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function u(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var t=[],r=!0,i=!1,a=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(t.push(o.value),!n||t.length!==n);r=!0);}catch(e){i=!0,a=e}finally{try{r||null==c.return||c.return()}finally{if(i)throw a}}return t}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,menuitem:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},f=/([\w-]+)|=|(['"])([.\s\S]*?)\2/g,p=/(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g,d=Object.create?Object.create(null):{};function g(e,n,t,r,i){var a=n.indexOf("<",r),o=n.slice(r,-1===a?void 0:a);/^\s*$/.test(o)&&(o=" "),(!i&&a>-1&&t+e.length>=0||" "!==o)&&e.push({type:"text",content:o})}function m(e,n){switch(n.type){case"text":return e+n.content;case"tag":return e+="<"+n.name+(n.attrs?function(e){var n=[];for(var t in e)n.push(t+'="'+e[t]+'"');return n.length?" "+n.join(" "):""}(n.attrs):"")+(n.voidElement?"/>":">"),n.voidElement?e:e+n.children.reduce(m,"")+"</"+n.name+">"}}var h,y={parse:function(e,n){n||(n={}),n.components||(n.components=d);var t,r=[],i=-1,a=[],o={},c=!1;return e.replace(p,(function(s,u){if(c){if(s!=="</"+t.name+">")return;c=!1}var p,d="/"!==s.charAt(1),m=0===s.indexOf("\x3c!--"),h=u+s.length,y=e.charAt(h);d&&!m&&(i++,"tag"===(t=function(e){var n,t=0,r=!0,i={type:"tag",name:"",voidElement:!1,attrs:{},children:[]};return e.replace(f,(function(a){if("="===a)return r=!0,void t++;r?0===t?((l[a]||"/"===e.charAt(e.length-2))&&(i.voidElement=!0),i.name=a):(i.attrs[n]=a.replace(/^['"]|['"]$/g,""),n=void 0):(n&&(i.attrs[n]=n),n=a),t++,r=!1})),i}(s)).type&&n.components[t.name]&&(t.type="component",c=!0),t.voidElement||c||!y||"<"===y||g(t.children,e,i,h,n.ignoreWhitespace),o[t.tagName]=t,0===i&&r.push(t),(p=a[i-1])&&p.children.push(t),a[i]=t),(m||!d||t.voidElement)&&(m||i--,!c&&"<"!==y&&y&&g(p=-1===i?r:a[i].children,e,i,h,n.ignoreWhitespace))})),!r.length&&e.length&&g(r,e,0,0,n.ignoreWhitespace),r},stringify:function(e){return e.reduce((function(e,n){return e+m("",n)}),"")}},v={bindI18n:"languageChanged",bindI18nStore:"",transEmptyNodeValue:"",transSupportBasicHtmlNodes:!0,transKeepBasicHtmlNodesFor:["br","strong","i","p"],useSuspense:!0},b=t.createContext();function O(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};v=c({},v,{},e)}function w(){return v}var j=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.usedNamespaces={}}var n,t,r;return n=e,(t=[{key:"addUsedNamespaces",value:function(e){var n=this;e.forEach((function(e){n.usedNamespaces[e]||(n.usedNamespaces[e]=!0)}))}},{key:"getUsedNamespaces",value:function(){return Object.keys(this.usedNamespaces)}}])&&i(n.prototype,t),r&&i(n,r),e}();function E(e){h=e}function S(){return h}var x={type:"3rdParty",init:function(e){O(e.options.react),E(e)}};function N(e){return function(n){return new Promise((function(t){var r=k();e.getInitialProps?e.getInitialProps(n).then((function(e){t(c({},e,{},r))})):t(r)}))}}function k(){var e=S(),n=e.reportNamespaces?e.reportNamespaces.getUsedNamespaces():[],t={},r={};return e.languages.forEach((function(t){r[t]={},n.forEach((function(n){r[t][n]=e.getResourceBundle(t,n)||{}}))})),t.initialI18nStore=r,t.initialLanguage=e.language,t}function I(){if(console&&console.warn){for(var e,n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];"string"==typeof t[0]&&(t[0]="react-i18next:: ".concat(t[0])),(e=console).warn.apply(e,t)}}var P={};function R(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];"string"==typeof n[0]&&P[n[0]]||("string"==typeof n[0]&&(P[n[0]]=new Date),I.apply(void 0,n))}function C(e,n,t){e.loadNamespaces(n,(function(){if(e.isInitialized)t();else{e.on("initialized",(function n(){setTimeout((function(){e.off("initialized",n)}),0),t()}))}}))}function T(e){return e.displayName||e.name||("string"==typeof e&&e.length>0?e:"Unknown")}function A(e,n){if(!e)return!1;var t=e.props?e.props.children:e.children;return n?t.length>0:!!t}function L(e){return e?e&&e.children?e.children:e.props&&e.props.children:[]}function z(e){return Array.isArray(e)?e:[e]}function D(e,n,i,a,o){if(""===n)return[];var s=a.transKeepBasicHtmlNodesFor||[],u=n&&new RegExp(s.join("|")).test(n);if(!e&&!u)return[n];var l={};!function e(n){z(n).forEach((function(n){"string"!=typeof n&&(A(n)?e(L(n)):"object"!==r(n)||t.isValidElement(n)||Object.assign(l,n))}))}(e);var f=i.services.interpolator.interpolate(n,c({},l,{},o),i.language);var p=function e(n,i,o){var l=z(n);return z(i).reduce((function(n,i,f){var p,d,g,m=i.children&&i.children[0]&&i.children[0].content;if("tag"===i.type){var h=l[parseInt(i.name,10)];!h&&1===o.length&&o[0][i.name]&&(h=o[0][i.name]),h||(h={});var y=0!==Object.keys(i.attrs).length?(p={props:i.attrs},(g=c({},d=h)).props=Object.assign(p.props,d.props),g):h,v=t.isValidElement(y);if("string"==typeof y)n.push(y);else if(A(y)||v&&A(i,!0)&&!i.voidElement){var b=L(y),O=e(b,i.children,o),w=function(e){return"[object Array]"===Object.prototype.toString.call(e)&&e.every((function(e){return t.isValidElement(e)}))}(b)&&0===O.length?b:O;y.dummy&&(y.children=w),n.push(t.cloneElement(y,c({},y.props,{key:f}),w))}else if(u&&"object"===r(y)&&y.dummy&&!v){var j=e(l,i.children,o);n.push(t.cloneElement(y,c({},y.props,{key:f}),j))}else if(Number.isNaN(parseFloat(i.name)))if(a.transSupportBasicHtmlNodes&&s.indexOf(i.name)>-1)if(i.voidElement)n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)}));else{var E=e(l,i.children,o);n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)},E))}else if(i.voidElement)n.push("<".concat(i.name," />"));else{var S=e(l,i.children,o);n.push("<".concat(i.name,">").concat(S,"</").concat(i.name,">"))}else if("object"!==r(y)||v)1===i.children.length&&m?n.push(t.cloneElement(y,c({},y.props,{key:f}),m)):n.push(t.cloneElement(y,c({},y.props,{key:f})));else{var x=i.children[0]?m:null;x&&n.push(x)}}else"text"===i.type&&n.push(i.content);return n}),[])}([{dummy:!0,children:e}],y.parse("<0>".concat(f,"</0>")),z(e||[]));return L(p[0])}function B(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.i18n,i=n.useContext(b)||{},a=i.i18n,o=i.defaultNS,s=r||a||S();if(s&&!s.reportNamespaces&&(s.reportNamespaces=new j),!s){R("You will need pass in an i18next instance by using initReactI18next");var l=function(e){return Array.isArray(e)?e[e.length-1]:e},f=[l,{},!1];return f.t=l,f.i18n={},f.ready=!1,f}var p=c({},w(),{},s.options.react,{},t),d=p.useSuspense,g=e||o||s.options&&s.options.defaultNS;g="string"==typeof g?[g]:g||["translation"],s.reportNamespaces.addUsedNamespaces&&s.reportNamespaces.addUsedNamespaces(g);var m=(s.isInitialized||s.initializedStoreOnce)&&g.every((function(e){return function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!n.languages||!n.languages.length)return R("i18n.languages were undefined or empty",n.languages),!0;var r=n.languages[0],i=!!n.options&&n.options.fallbackLng,a=n.languages[n.languages.length-1];if("cimode"===r.toLowerCase())return!0;var o=function(e,t){var r=n.services.backendConnector.state["".concat(e,"|").concat(t)];return-1===r||2===r};return!(t.bindI18n&&t.bindI18n.indexOf("languageChanging")>-1&&n.services.backendConnector.backend&&n.isLanguageChangingTo&&!o(n.isLanguageChangingTo,e))&&(!!n.hasResourceBundle(r,e)||(!n.services.backendConnector.backend||!(!o(r,e)||i&&!o(a,e))))}(e,s,p)}));function h(){return{t:s.getFixedT(null,"fallback"===p.nsMode?g:g[0])}}var y=u(n.useState(h()),2),v=y[0],O=y[1],E=n.useRef(!0);n.useEffect((function(){var e=p.bindI18n,n=p.bindI18nStore;function t(){E.current&&O(h())}return E.current=!0,m||d||C(s,g,(function(){E.current&&O(h())})),e&&s&&s.on(e,t),n&&s&&s.store.on(n,t),function(){E.current=!1,e&&s&&e.split(" ").forEach((function(e){return s.off(e,t)})),n&&s&&n.split(" ").forEach((function(e){return s.store.off(e,t)}))}}),[g.join()]);var x=[v.t,s,m];if(x.t=v.t,x.i18n=s,x.ready=m,m)return x;if(!m&&!d)return x;throw new Promise((function(e){C(s,g,(function(){E.current&&O(h()),e()}))}))}function V(e,t){var r=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).i18n,i=(n.useContext(b)||{}).i18n,a=r||i||S();a.options&&a.options.isClone||(e&&!a.initializedStoreOnce&&(a.services.resourceStore.data=e,a.options.ns=Object.values(e).reduce((function(e,n){return Object.keys(n).forEach((function(n){e.indexOf(n)<0&&e.push(n)})),e}),a.options.ns),a.initializedStoreOnce=!0,a.isInitialized=!0),t&&!a.initializedLanguageOnce&&(a.changeLanguage(t),a.initializedLanguageOnce=!0))}e.I18nContext=b,e.I18nextProvider=function(e){var t=e.i18n,r=e.defaultNS,i=e.children;return n.createElement(b.Provider,{value:{i18n:t,defaultNS:r}},i)},e.Trans=function(e){var i=e.children,a=e.count,o=e.parent,u=e.i18nKey,l=e.tOptions,f=e.values,p=e.defaults,d=e.components,g=e.ns,m=e.i18n,h=e.t,y=s(e,["children","count","parent","i18nKey","tOptions","values","defaults","components","ns","i18n","t"]),v=n.useContext(b)||{},O=v.i18n,j=v.defaultNS,E=m||O||S();if(!E)return R("You will need pass in an i18next instance by using i18nextReactModule"),i;var x=h||E.t.bind(E)||function(e){return e},N=c({},w(),{},E.options&&E.options.react),k=g||x.ns||j||E.options&&E.options.defaultNS;k="string"==typeof k?[k]:k||["translation"];var P=p||function e(n,i){if(!n)return"";var a="",o=z(n),c=i.transKeepBasicHtmlNodesFor||[];return o.forEach((function(n,o){if("string"==typeof n)a+="".concat(n);else if(t.isValidElement(n)){var u=Object.keys(n.props).length,l=c.indexOf(n.type)>-1,f=n.props.children;if(!f&&l&&0===u)a+="<".concat(n.type,"/>");else if(f||l&&0===u)if(n.props.i18nIsDynamicList)a+="<".concat(o,"></").concat(o,">");else if(l&&1===u&&"string"==typeof f)a+="<".concat(n.type,">").concat(f,"</").concat(n.type,">");else{var p=e(f,i);a+="<".concat(o,">").concat(p,"</").concat(o,">")}else a+="<".concat(o,"></").concat(o,">")}else if("object"===r(n)){var d=n.format,g=s(n,["format"]),m=Object.keys(g);if(1===m.length){var h=d?"".concat(m[0],", ").concat(d):m[0];a+="{{".concat(h,"}}")}else I("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.",n)}else I("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.",n)})),a}(i,N)||N.transEmptyNodeValue||u,C=N.hashTransKey,T=u||(C?C(P):P),A=c({},l,{count:a},f,{},f?{}:{interpolation:{prefix:"#$?",suffix:"?$#"}},{defaultValue:P,ns:k}),L=D(d||i,T?x(T,A):P,E,N,A),B=void 0!==o?o:N.defaultTransParent;return B?t.createElement(B,y,L):L},e.Translation=function(e){var n=e.ns,t=e.children,r=u(B(n,s(e,["ns","children"])),3),i=r[0],a=r[1],o=r[2];return t(i,{i18n:a,lng:a.language},o)},e.composeInitialProps=N,e.getDefaults=w,e.getI18n=S,e.getInitialProps=k,e.initReactI18next=x,e.setDefaults=O,e.setI18n=E,e.useSSR=V,e.useTranslation=B,e.withSSR=function(){return function(e){function n(n){var r=n.initialI18nStore,i=n.initialLanguage,a=s(n,["initialI18nStore","initialLanguage"]);return V(r,i),t.createElement(e,c({},a))}return n.getInitialProps=N(e),n.displayName="withI18nextSSR(".concat(T(e),")"),n.WrappedComponent=e,n}},e.withTranslation=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(r){function i(i){var a=i.forwardedRef,o=s(i,["forwardedRef"]),l=u(B(e,o),3),f=c({},o,{t:l[0],i18n:l[1],tReady:l[2]});return n.withRef&&a?f.ref=a:!n.withRef&&a&&(f.forwardedRef=a),t.createElement(r,f)}i.displayName="withI18nextTranslation(".concat(T(r),")"),i.WrappedComponent=r;return n.withRef?t.forwardRef((function(e,n){return t.createElement(i,Object.assign({},e,{forwardedRef:n}))})):i}},Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((e=e||self).ReactI18next={},e.React)}(this,(function(e,n){"use strict";var t="default"in n?n.default:n;function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function i(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(t,!0).forEach((function(n){a(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(t).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function u(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var t=[],r=!0,i=!1,a=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(t.push(o.value),!n||t.length!==n);r=!0);}catch(e){i=!0,a=e}finally{try{r||null==c.return||c.return()}finally{if(i)throw a}}return t}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,menuitem:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},f=/([\w-]+)|=|(['"])([.\s\S]*?)\2/g,p=/(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g,d=Object.create?Object.create(null):{};function g(e,n,t,r,i){var a=n.indexOf("<",r),o=n.slice(r,-1===a?void 0:a);/^\s*$/.test(o)&&(o=" "),(!i&&a>-1&&t+e.length>=0||" "!==o)&&e.push({type:"text",content:o})}function m(e,n){switch(n.type){case"text":return e+n.content;case"tag":return e+="<"+n.name+(n.attrs?function(e){var n=[];for(var t in e)n.push(t+'="'+e[t]+'"');return n.length?" "+n.join(" "):""}(n.attrs):"")+(n.voidElement?"/>":">"),n.voidElement?e:e+n.children.reduce(m,"")+"</"+n.name+">"}}var h,y={parse:function(e,n){n||(n={}),n.components||(n.components=d);var t,r=[],i=-1,a=[],o={},c=!1;return e.replace(p,(function(s,u){if(c){if(s!=="</"+t.name+">")return;c=!1}var p,d="/"!==s.charAt(1),m=0===s.indexOf("\x3c!--"),h=u+s.length,y=e.charAt(h);d&&!m&&(i++,"tag"===(t=function(e){var n,t=0,r=!0,i={type:"tag",name:"",voidElement:!1,attrs:{},children:[]};return e.replace(f,(function(a){if("="===a)return r=!0,void t++;r?0===t?((l[a]||"/"===e.charAt(e.length-2))&&(i.voidElement=!0),i.name=a):(i.attrs[n]=a.replace(/^['"]|['"]$/g,""),n=void 0):(n&&(i.attrs[n]=n),n=a),t++,r=!1})),i}(s)).type&&n.components[t.name]&&(t.type="component",c=!0),t.voidElement||c||!y||"<"===y||g(t.children,e,i,h,n.ignoreWhitespace),o[t.tagName]=t,0===i&&r.push(t),(p=a[i-1])&&p.children.push(t),a[i]=t),(m||!d||t.voidElement)&&(m||i--,!c&&"<"!==y&&y&&g(p=-1===i?r:a[i].children,e,i,h,n.ignoreWhitespace))})),!r.length&&e.length&&g(r,e,0,0,n.ignoreWhitespace),r},stringify:function(e){return e.reduce((function(e,n){return e+m("",n)}),"")}},v={bindI18n:"languageChanged",bindI18nStore:"",transEmptyNodeValue:"",transSupportBasicHtmlNodes:!0,transKeepBasicHtmlNodesFor:["br","strong","i","p"],useSuspense:!0},b=t.createContext();function O(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};v=c({},v,{},e)}function w(){return v}var j=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.usedNamespaces={}}var n,t,r;return n=e,(t=[{key:"addUsedNamespaces",value:function(e){var n=this;e.forEach((function(e){n.usedNamespaces[e]||(n.usedNamespaces[e]=!0)}))}},{key:"getUsedNamespaces",value:function(){return Object.keys(this.usedNamespaces)}}])&&i(n.prototype,t),r&&i(n,r),e}();function E(e){h=e}function S(){return h}var x={type:"3rdParty",init:function(e){O(e.options.react),E(e)}};function N(e){return function(n){return new Promise((function(t){var r=k();e.getInitialProps?e.getInitialProps(n).then((function(e){t(c({},e,{},r))})):t(r)}))}}function k(){var e=S(),n=e.reportNamespaces?e.reportNamespaces.getUsedNamespaces():[],t={},r={};return e.languages.forEach((function(t){r[t]={},n.forEach((function(n){r[t][n]=e.getResourceBundle(t,n)||{}}))})),t.initialI18nStore=r,t.initialLanguage=e.language,t}function I(){if(console&&console.warn){for(var e,n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];"string"==typeof t[0]&&(t[0]="react-i18next:: ".concat(t[0])),(e=console).warn.apply(e,t)}}var P={};function R(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];"string"==typeof n[0]&&P[n[0]]||("string"==typeof n[0]&&(P[n[0]]=new Date),I.apply(void 0,n))}function C(e,n,t){e.loadNamespaces(n,(function(){if(e.isInitialized)t();else{e.on("initialized",(function n(){setTimeout((function(){e.off("initialized",n)}),0),t()}))}}))}function T(e){return e.displayName||e.name||("string"==typeof e&&e.length>0?e:"Unknown")}function A(e,n){if(!e)return!1;var t=e.props?e.props.children:e.children;return n?t.length>0:!!t}function L(e){return e?e&&e.children?e.children:e.props&&e.props.children:[]}function z(e){return Array.isArray(e)?e:[e]}function D(e,n,i,a,o){if(""===n)return[];var s=a.transKeepBasicHtmlNodesFor||[],u=n&&new RegExp(s.join("|")).test(n);if(!e&&!u)return[n];var l={};!function e(n){z(n).forEach((function(n){"string"!=typeof n&&(A(n)?e(L(n)):"object"!==r(n)||t.isValidElement(n)||Object.assign(l,n))}))}(e);var f=i.services.interpolator.interpolate(n,c({},l,{},o),i.language),p=y.parse("<0>".concat(f,"</0>"));function d(e,n,r){var i=L(e),a=m(i,n.children,r);return function(e){return"[object Array]"===Object.prototype.toString.call(e)&&e.every((function(e){return t.isValidElement(e)}))}(i)&&0===a.length?i:a}function g(e,n,r,i){e.dummy&&(e.children=n),r.push(t.cloneElement(e,c({},e.props,{key:i}),n))}function m(n,i,o){var l=z(n);return z(i).reduce((function(n,i,f){var p,h,y,v=i.children&&i.children[0]&&i.children[0].content;if("tag"===i.type){var b=l[parseInt(i.name,10)];!b&&1===o.length&&o[0][i.name]&&(b=o[0][i.name]),b||(b={});var O=0!==Object.keys(i.attrs).length?(p={props:i.attrs},(y=c({},h=b)).props=Object.assign(p.props,h.props),y):b,w=t.isValidElement(O),j=w&&A(i,!0)&&!i.voidElement,E=u&&"object"===r(O)&&O.dummy&&!w,S="object"===r(e)&&null!==e&&Object.hasOwnProperty.call(e,i.name);if("string"==typeof O)n.push(O);else if(A(O)||j){g(O,d(O,i,o),n,f)}else if(E){var x=m(l,i.children,o);n.push(t.cloneElement(O,c({},O.props,{key:f}),x))}else if(Number.isNaN(parseFloat(i.name))){if(S)g(O,d(O,i,o),n,f);else if(a.transSupportBasicHtmlNodes&&s.indexOf(i.name)>-1)if(i.voidElement)n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)}));else{var N=m(l,i.children,o);n.push(t.createElement(i.name,{key:"".concat(i.name,"-").concat(f)},N))}else if(i.voidElement)n.push("<".concat(i.name," />"));else{var k=m(l,i.children,o);n.push("<".concat(i.name,">").concat(k,"</").concat(i.name,">"))}}else if("object"!==r(O)||w)1===i.children.length&&v?n.push(t.cloneElement(O,c({},O.props,{key:f}),v)):n.push(t.cloneElement(O,c({},O.props,{key:f})));else{var I=i.children[0]?v:null;I&&n.push(I)}}else"text"===i.type&&n.push(i.content);return n}),[])}return L(m([{dummy:!0,children:e}],p,z(e||[]))[0])}function B(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.i18n,i=n.useContext(b)||{},a=i.i18n,o=i.defaultNS,s=r||a||S();if(s&&!s.reportNamespaces&&(s.reportNamespaces=new j),!s){R("You will need pass in an i18next instance by using initReactI18next");var l=function(e){return Array.isArray(e)?e[e.length-1]:e},f=[l,{},!1];return f.t=l,f.i18n={},f.ready=!1,f}var p=c({},w(),{},s.options.react,{},t),d=p.useSuspense,g=e||o||s.options&&s.options.defaultNS;g="string"==typeof g?[g]:g||["translation"],s.reportNamespaces.addUsedNamespaces&&s.reportNamespaces.addUsedNamespaces(g);var m=(s.isInitialized||s.initializedStoreOnce)&&g.every((function(e){return function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!n.languages||!n.languages.length)return R("i18n.languages were undefined or empty",n.languages),!0;var r=n.languages[0],i=!!n.options&&n.options.fallbackLng,a=n.languages[n.languages.length-1];if("cimode"===r.toLowerCase())return!0;var o=function(e,t){var r=n.services.backendConnector.state["".concat(e,"|").concat(t)];return-1===r||2===r};return!(t.bindI18n&&t.bindI18n.indexOf("languageChanging")>-1&&n.services.backendConnector.backend&&n.isLanguageChangingTo&&!o(n.isLanguageChangingTo,e))&&(!!n.hasResourceBundle(r,e)||(!n.services.backendConnector.backend||!(!o(r,e)||i&&!o(a,e))))}(e,s,p)}));function h(){return{t:s.getFixedT(null,"fallback"===p.nsMode?g:g[0])}}var y=u(n.useState(h()),2),v=y[0],O=y[1],E=n.useRef(!0);n.useEffect((function(){var e=p.bindI18n,n=p.bindI18nStore;function t(){E.current&&O(h())}return E.current=!0,m||d||C(s,g,(function(){E.current&&O(h())})),e&&s&&s.on(e,t),n&&s&&s.store.on(n,t),function(){E.current=!1,e&&s&&e.split(" ").forEach((function(e){return s.off(e,t)})),n&&s&&n.split(" ").forEach((function(e){return s.store.off(e,t)}))}}),[g.join()]);var x=[v.t,s,m];if(x.t=v.t,x.i18n=s,x.ready=m,m)return x;if(!m&&!d)return x;throw new Promise((function(e){C(s,g,(function(){E.current&&O(h()),e()}))}))}function V(e,t){var r=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).i18n,i=(n.useContext(b)||{}).i18n,a=r||i||S();a.options&&a.options.isClone||(e&&!a.initializedStoreOnce&&(a.services.resourceStore.data=e,a.options.ns=Object.values(e).reduce((function(e,n){return Object.keys(n).forEach((function(n){e.indexOf(n)<0&&e.push(n)})),e}),a.options.ns),a.initializedStoreOnce=!0,a.isInitialized=!0),t&&!a.initializedLanguageOnce&&(a.changeLanguage(t),a.initializedLanguageOnce=!0))}e.I18nContext=b,e.I18nextProvider=function(e){var t=e.i18n,r=e.defaultNS,i=e.children;return n.createElement(b.Provider,{value:{i18n:t,defaultNS:r}},i)},e.Trans=function(e){var i=e.children,a=e.count,o=e.parent,u=e.i18nKey,l=e.tOptions,f=e.values,p=e.defaults,d=e.components,g=e.ns,m=e.i18n,h=e.t,y=s(e,["children","count","parent","i18nKey","tOptions","values","defaults","components","ns","i18n","t"]),v=n.useContext(b)||{},O=v.i18n,j=v.defaultNS,E=m||O||S();if(!E)return R("You will need pass in an i18next instance by using i18nextReactModule"),i;var x=h||E.t.bind(E)||function(e){return e},N=c({},w(),{},E.options&&E.options.react),k=g||x.ns||j||E.options&&E.options.defaultNS;k="string"==typeof k?[k]:k||["translation"];var P=p||function e(n,i){if(!n)return"";var a="",o=z(n),c=i.transKeepBasicHtmlNodesFor||[];return o.forEach((function(n,o){if("string"==typeof n)a+="".concat(n);else if(t.isValidElement(n)){var u=Object.keys(n.props).length,l=c.indexOf(n.type)>-1,f=n.props.children;if(!f&&l&&0===u)a+="<".concat(n.type,"/>");else if(f||l&&0===u)if(n.props.i18nIsDynamicList)a+="<".concat(o,"></").concat(o,">");else if(l&&1===u&&"string"==typeof f)a+="<".concat(n.type,">").concat(f,"</").concat(n.type,">");else{var p=e(f,i);a+="<".concat(o,">").concat(p,"</").concat(o,">")}else a+="<".concat(o,"></").concat(o,">")}else if("object"===r(n)){var d=n.format,g=s(n,["format"]),m=Object.keys(g);if(1===m.length){var h=d?"".concat(m[0],", ").concat(d):m[0];a+="{{".concat(h,"}}")}else I("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.",n)}else I("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.",n)})),a}(i,N)||N.transEmptyNodeValue||u,C=N.hashTransKey,T=u||(C?C(P):P),A=c({},l,{count:a},f,{},f?{}:{interpolation:{prefix:"#$?",suffix:"?$#"}},{defaultValue:P,ns:k}),L=D(d||i,T?x(T,A):P,E,N,A),B=void 0!==o?o:N.defaultTransParent;return B?t.createElement(B,y,L):L},e.Translation=function(e){var n=e.ns,t=e.children,r=u(B(n,s(e,["ns","children"])),3),i=r[0],a=r[1],o=r[2];return t(i,{i18n:a,lng:a.language},o)},e.composeInitialProps=N,e.getDefaults=w,e.getI18n=S,e.getInitialProps=k,e.initReactI18next=x,e.setDefaults=O,e.setI18n=E,e.useSSR=V,e.useTranslation=B,e.withSSR=function(){return function(e){function n(n){var r=n.initialI18nStore,i=n.initialLanguage,a=s(n,["initialI18nStore","initialLanguage"]);return V(r,i),t.createElement(e,c({},a))}return n.getInitialProps=N(e),n.displayName="withI18nextSSR(".concat(T(e),")"),n.WrappedComponent=e,n}},e.withTranslation=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(r){function i(i){var a=i.forwardedRef,o=s(i,["forwardedRef"]),l=u(B(e,o),3),f=c({},o,{t:l[0],i18n:l[1],tReady:l[2]});return n.withRef&&a?f.ref=a:!n.withRef&&a&&(f.forwardedRef=a),t.createElement(r,f)}i.displayName="withI18nextTranslation(".concat(T(r),")"),i.WrappedComponent=r;return n.withRef?t.forwardRef((function(e,n){return t.createElement(i,Object.assign({},e,{forwardedRef:n}))})):i}},Object.defineProperty(e,"__esModule",{value:!0})}));

package/src/Trans.js

@@ -135,6 +135,18 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
   // -> avoids issues in parser removing prepending text nodes
   const ast = HTML.parse(`<0>${interpolatedString}</0>`);
 
+  function renderInner(child, node, rootReactNode) {
+    const childs = getChildren(child);
+    const mappedChildren = mapAST(childs, node.children, rootReactNode);
+    // console.warn('INNER', node.name, node, child, childs, node.children, mappedChildren);
+    return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
+  }
+
+  function pushTranslatedJSX(child, inner, mem, i) {
+    if (child.dummy) child.children = inner; // needed on preact!
+    mem.push(React.cloneElement(child, { ...child.props, key: i }, inner));
+  }
+
   // reactNode (the jsx root element or child)
   // astNode (the translation string as html ast)
   // rootReactNode (the most outer jsx children array or trans components prop)
@@ -154,28 +166,28 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
           Object.keys(node.attrs).length !== 0 ? mergeProps({ props: node.attrs }, tmp) : tmp;
 
         const isElement = React.isValidElement(child);
+
+        const isValidTranslationWithChildren =
+          isElement && hasChildren(node, true) && !node.voidElement;
+
+        const isEmptyTransWithHTML =
+          emptyChildrenButNeedsHandling && typeof child === 'object' && child.dummy && !isElement;
+
+        const isKnownComponent =
+          typeof children === 'object' &&
+          children !== null &&
+          Object.hasOwnProperty.call(children, node.name);
         // console.warn('CHILD', node.name, node, isElement, child);
 
         if (typeof child === 'string') {
           mem.push(child);
         } else if (
           hasChildren(child) || // the jsx element has children -> loop
-          (isElement && hasChildren(node, true) && !node.voidElement) // valid jsx element with no children but the translation has -> loop
-        ) {
-          const childs = getChildren(child);
-          const mappedChildren = mapAST(childs, node.children, rootReactNode);
-          // console.warn('INNER', node.name, node, child, childs, node.children, mappedChildren);
-          const inner =
-            hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
-
-          if (child.dummy) child.children = inner; // needed on preact!
-          mem.push(React.cloneElement(child, { ...child.props, key: i }, inner));
-        } else if (
-          emptyChildrenButNeedsHandling &&
-          typeof child === 'object' &&
-          child.dummy &&
-          !isElement
+          isValidTranslationWithChildren // valid jsx element with no children but the translation has -> loop
         ) {
+          const inner = renderInner(child, node, rootReactNode);
+          pushTranslatedJSX(child, inner, mem, i);
+        } else if (isEmptyTransWithHTML) {
           // we have a empty Trans node (the dummy element) with a targetstring that contains html tags needing
           // conversion to react nodes
           // so we just need to map the inner stuff
@@ -186,7 +198,10 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
           );
           mem.push(React.cloneElement(child, { ...child.props, key: i }, inner));
         } else if (Number.isNaN(parseFloat(node.name))) {
-          if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
+          if (isKnownComponent) {
+            const inner = renderInner(child, node, rootReactNode);
+            pushTranslatedJSX(child, inner, mem, i);
+          } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
             if (node.voidElement) {
               mem.push(React.createElement(node.name, { key: `${node.name}-${i}` }));
             } else {

package/src/index.d.ts

@@ -33,7 +33,7 @@ export interface TransProps<E extends Element = HTMLDivElement>
   extends React.HTMLProps<E>,
     Partial<WithT> {
   children?: React.ReactNode;
-  components?: readonly React.ReactNode[];
+  components?: readonly React.ReactNode[] | { [tagName: string]: React.ReactNode };
   count?: number;
   defaults?: string;
   i18n?: i18n;

package/src/utils.js

@@ -41,6 +41,28 @@ export function loadNamespaces(i18n, ns, cb) {
 }
 
 export function hasLoadedNamespace(ns, i18n, options = {}) {
+  /*
+
+  IN I18NEXT > v19.4.5 WE CAN (INTRODUCED JUNE 2020)
+
+  return i18n.hasLoadedNamespace(ns, {
+    precheck: (i18nInstance, loadNotPending) => {
+      if (
+        options.bindI18n &&
+        options.bindI18n.indexOf('languageChanging') > -1 &&
+        i18n.services.backendConnector.backend &&
+        i18n.isLanguageChangingTo &&
+        !loadNotPending(i18n.isLanguageChangingTo, ns)
+      )
+        return false;
+    }
+  })
+
+  // WILL BE BREAKING AS DEPENDS ON SPECIFIC I18NEXT VERSION
+  // WAIT A LITTLE FOR I18NEXT BEING UPDATED IN THE WILD
+
+  */
+
   if (!i18n.languages || !i18n.languages.length) {
     warnOnce('i18n.languages were undefined or empty', i18n.languages);
     return true;