Messages: Support React elements in the message (start-end tags)

Author: rxaviers

src/message.js

@@ -101,7 +101,7 @@ function replaceElements(componentProps, formatted) {
             var element = elements[key];
 
             ret.forEach(function(string, i) {
-                var aux;
+                var aux, contents, regexp, regexp2;
 
                 // Insert array into the correct ret position.
                 function replaceRetItem(array) {
@@ -119,6 +119,20 @@ function replaceElements(componentProps, formatted) {
                     replaceRetItem(aux);
                     return; // continue;
                 }
+
+                // Start-end tags, e.g., `[foo]content[/foo]`.
+                regexp = new RegExp("\\[" + key + "\\][\\s\\S]*?\\[\\/" + key + "\\]", "g");
+                regexp2 = new RegExp("\\[" + key + "\\]([\\s\\S]*?)\\[\\/" + key + "\\]");
+                aux = string.split(regexp);
+                if (aux.length > 1) {
+                    contents = string.match(regexp).map(function(content) {
+                        return content.replace(regexp2, "$1");
+                    });
+                    aux = spreadElementsInBetweenItems(aux, function(i) {
+                        return React.cloneElement(element, {}, contents[i]);
+                    });
+                    replaceRetItem(aux);
+                }
             });
 
             return ret;