Support react elements on properties

Author: rxaviers

examples/components/messages.js

@@ -1,6 +1,6 @@
 var FormatMessage = require('../react-globalize').FormatMessage;
+var FormatNumber = require('../react-globalize').FormatNumber;
 var React = require('react');
-var Globalize = require('globalize');
 
 module.exports = React.createClass({
     getInitialState: function() {
@@ -46,7 +46,10 @@ module.exports = React.createClass({
                 <br/>
                 task count 0 - <FormatMessage locale={this.state.locale} path="task" variables={{count: 0}} />
                 <br/>
-                task count 1000 formatted - <FormatMessage ref="formattedTask" locale={this.state.locale} path="task" variables={{count: 1000, formattedCount: Globalize(this.state.locale).formatNumber(1000)}} />
+                task count 1000 formatted - <FormatMessage ref="formattedTask" locale={this.state.locale} path="task" variables={{
+                    count: 1000,
+                    formattedCount: <FormatNumber locale={this.state.locale} value={1000} />
+                }} />
                 <br/>
                 like count 0 with offset:1 - <FormatMessage locale={this.state.locale} path="likeIncludingMe" variables={{count: 0}} />
                 <br/>

index.js

@@ -6,6 +6,25 @@ function capitalizeFirstLetter(string) {
     return string.charAt(0).toUpperCase() + string.slice(1);
 }
 
+function isPlainObject(value) {
+    return value && typeof value === "object" &&
+        !(value.constructor &&
+        !value.constructor.prototype.hasOwnProperty("isPrototypeOf")) &&
+        !React.isValidElement(value);
+}
+
+function supportReactElements(value) {
+    if (isPlainObject(value)) {
+        return Object.keys(value).reduce(function(sum, i) {
+            sum[i] = supportReactElements(value[i]);
+            return sum;
+        }, {});
+    } else if (React.isValidElement(value)) {
+        value = new ReactGlobalize[value.type.displayName](value._store.props).render()._store.props.children;
+    }
+    return value;
+}
+
 Object.getOwnPropertyNames(Globalize).forEach(function(fn) {
     if (fn.indexOf("format") === 0) {
         var Fn = capitalizeFirstLetter(fn);
@@ -21,7 +40,7 @@ Object.getOwnPropertyNames(Globalize).forEach(function(fn) {
                 var instance = Globalize;
                 var propArgs = argArray.map(function(element) {
                     return componentProps[element.replace(/(\s\/\*|\*\/)/,"").trim()];
-                });
+                }).map(supportReactElements);
 
                 if (componentProps["locale"]) {
                   instance = Globalize(componentProps["locale"]);