Add rowKeyGetter to Table component. (schrodinger#117)

If you set a rowKeyGetter then the `key` value for each FixedDataTableRow can
be overridden based on the rowIndex.

This is particularly useful when using CSS animations where you only want
transitions to animate if the data source remains the same.

See also: facebookarchive/fixed-data-table#353

Author: conorbranagan

docs/api-v0.5/TableAPI.md

@@ -146,6 +146,14 @@ To get any additional CSS classes that should be added to a row,
 type: `func`
 
 
+### `rowKeyGetter`
+
+If specified, `rowKeyGetter(index)` is called for each row and the
+returned value overrides `key` for the particular row.
+
+type: `func`
+
+
 ### `groupHeaderHeight`
 
 Pixel height of the column group header.

src/FixedDataTable.js

@@ -187,6 +187,12 @@ var FixedDataTable = React.createClass({
      */
     rowClassNameGetter: PropTypes.func,
 
+    /**
+     * If specified, `rowKeyGetter(index)` is called for each row and the
+     * returned value overrides `key` for the particular row.
+     */
+    rowKeyGetter: PropTypes.func,
+
     /**
      * Pixel height of the column group header.
      */
@@ -666,6 +672,7 @@ var FixedDataTable = React.createClass({
         rowsCount={state.rowsCount}
         rowGetter={state.rowGetter}
         rowHeightGetter={state.rowHeightGetter}
+        rowKeyGetter={state.rowKeyGetter}
         scrollLeft={state.scrollX}
         scrollableColumns={state.bodyScrollableColumns}
         showLastRowBorder={true}

src/FixedDataTableBufferedRows.js

@@ -38,6 +38,7 @@ var FixedDataTableBufferedRows = React.createClass({
     rowClassNameGetter: PropTypes.func,
     rowsCount: PropTypes.number.isRequired,
     rowHeightGetter: PropTypes.func,
+    rowKeyGetter: PropTypes.func,
     rowPositionGetter: PropTypes.func.isRequired,
     scrollLeft: PropTypes.number.isRequired,
     scrollableColumns: PropTypes.array.isRequired,
@@ -136,13 +137,14 @@ var FixedDataTableBufferedRows = React.createClass({
       var rowIndex = rowsToRender[i];
       var currentRowHeight = this._getRowHeight(rowIndex);
       var rowOffsetTop = baseOffsetTop + rowPositions[rowIndex];
+      var rowKey = props.rowKeyGetter ? props.rowKeyGetter(rowIndex) : i;
 
       var hasBottomBorder =
         rowIndex === props.rowsCount - 1 && props.showLastRowBorder;
 
       this._staticRowArray[i] =
         <FixedDataTableRow
-          key={i}
+          key={rowKey}
           isScrolling={props.isScrolling}
           index={rowIndex}
           width={props.width}