Merge pull request #22 from synacor/markuptext-fallback

Render all fallback children for MarkupText nodes instead of just the first one

src/lib/translate-mapping.js

@@ -27,8 +27,10 @@ export default function translateMapping(props, intl, onlyTextNodes) {
 			}
 			else if (def.nodeName===Text) {
 				// it's a <Text />, just grab its props:
+				let c = def.children;
 				def = assign({
-					fallback: def.children && def.children[0]
+					//no fallback if there are no children.  Return first child if there is only 1, or array of children if there are more than one
+					fallback: c.length && (c.length === 1 ? c[0] : c)
 				}, def.attributes);
 				out[name] = translate(def.id, intl.scope, intl.dictionary, def.fields, def.plural, def.fallback);
 			}

src/lib/translate.js

@@ -12,7 +12,7 @@ import template from './template';
  *	@param {Object} dictionary		A nested object containing translations
  *	@param {Object} [fields={}]		Template fields for use by translated strings
  *	@param {Number} [plural]		Indicates a quantity, used to trigger pluralization
- *	@param {String} [fallback='']	Text to return if no translation is found
+ *	@param {String|Array} [fallback]	Text to return if no translation is found
  *	@returns {String} translated
  */
 export default function translate(id, scope, dictionary, fields, plural, fallback) {

test/index.js

@@ -251,6 +251,16 @@ describe('intl', () => {
 			expect(root.innerHTML).to.equal('<span><b>FOO</b></span>');
 		});
 
+		it('should render multi-child fallback', () => {
+			rndr(
+				<div>
+					<MarkupText>This <b>is the fallback</b> with multiple children</MarkupText>
+				</div>
+			);
+
+			expect(root.innerHTML).to.equal('<span>This <b>is the fallback</b> with multiple children</span>');
+		});
+
 		it('should render text without scope', () => {
 			rndr(
 				<div>