Remove react-addons-create-fragment dependency

CHANGELOG.md

@@ -1,5 +1,8 @@
 # Changelog
 
+## 1.1.2-alpha.1
+* Remove `react-addons-create-fragment` dependency, use `cloneElement` to specify a key manually instead.
+
 ## 1.1.1
 * Drop deprecated React.createClass, React.DOM from test
 * Bump to allow for React ^16.0.0

package.json

@@ -1,6 +1,6 @@
 {
   "name": "interpolate-components",
-  "version": "1.1.1",
+  "version": "1.1.2-alpha.1",
   "description": "Convert strings into structured React components.",
   "repository": {
     "type": "git",
@@ -34,7 +34,6 @@
   },
   "dependencies": {
     "react": "^0.14.3 || ^15.1.0 || ^16.0.0",
-    "react-addons-create-fragment": "^0.14.3 || ^15.1.0",
     "react-dom": "^0.14.3 || ^15.1.0 || ^16.0.0"
   },
   "author": "Bob Ralian <[email protected]> (http://github.com/rralian)",

src/index.es6

@@ -2,7 +2,6 @@
  * External Dependencies
  */
 import React from 'react';
-import createFragment from 'react-addons-create-fragment';
 
 /**
  * Internal Dependencies
@@ -36,8 +35,7 @@ function getCloseIndex( openIndex, tokens ) {
 
 function buildChildren( tokens, components ) {
 	var children = [],
-		childrenObject = {},
-		openComponent, clonedOpenComponent, openIndex, closeIndex, token, i, grandChildTokens, grandChildren, siblingTokens, siblings;
+		clonedOpenComponent, openIndex, closeIndex, token, i, grandChildTokens, grandChildren, siblingTokens, siblings;
 
 	for ( i = 0; i < tokens.length; i++ ) {
 		token = tokens[ i ];
@@ -58,40 +56,29 @@ function buildChildren( tokens, components ) {
 			throw new Error( 'Missing opening component token: `' + token.value + '`' );
 		}
 		if ( token.type === 'componentOpen' ) {
-			openComponent = components[ token.value ];
 			openIndex = i;
-			break;
+
+			closeIndex = getCloseIndex( openIndex, tokens );
+			grandChildTokens = tokens.slice( ( openIndex + 1 ), closeIndex );
+			grandChildren = buildChildren( grandChildTokens, components );
+
+			clonedOpenComponent = React.cloneElement( components[ token.value ], { key: openIndex }, grandChildren );
+			children.push( clonedOpenComponent );
+			i = closeIndex;
+			continue;
 		}
 		// componentSelfClosing token
-		children.push( components[ token.value ] );
-		continue;
-	}
-
-	if ( openComponent ) {
-		closeIndex = getCloseIndex( openIndex, tokens );
-		grandChildTokens = tokens.slice( ( openIndex + 1 ), closeIndex );
-		grandChildren = buildChildren( grandChildTokens, components );
-		clonedOpenComponent = React.cloneElement( openComponent, {}, grandChildren );
-		children.push( clonedOpenComponent );
-
-		if ( closeIndex < tokens.length - 1 ) {
-			siblingTokens = tokens.slice( closeIndex + 1 );
-			siblings = buildChildren( siblingTokens, components );
-			children = children.concat( siblings );
+		if ( components[ token.value ] ) {
+			children.push( React.cloneElement( components[ token.value ], { key: i } ) );
 		}
+		continue;
 	}
 
 	if ( children.length === 1 ) {
 		return children[ 0 ];
 	}
 
-	children.forEach( ( child, index ) => {
-		if ( child ) {
-			childrenObject[ `interpolation-child-${index}` ] = child;
-		}
-	} );
-
-	return createFragment( childrenObject );
+	return children;
 }
 
 function interpolate( options ) {