2.1.2

.travis.yml

@@ -0,0 +1,4 @@
+language: node_js
+node_js:
+  - "6"
+script: npm test

README.md

@@ -3,7 +3,8 @@
 # react-table
 A fast, lightweight, opinionated table and datagrid built on React
 
-[![react-table on Slack](https://img.shields.io/badge/slack-reactTable-blue.svg)](https://react-table-slack.herokuapp.com/)
+[![Build Status](https://travis-ci.org/tannerlinsley/react-table.svg?branch=master)](https://travis-ci.org/tannerlinsley/react-table)
+[![react-table on Slack](https://img.shields.io/badge/slack-react--table-blue.svg)](https://react-table-slack.herokuapp.com/)
 
 ## Features
 
@@ -15,8 +16,7 @@ A fast, lightweight, opinionated table and datagrid built on React
 - Minimal design & easily themeable
 
 Why you may **not** want to use this component:
-- No support for infinite scrolling. We chose to avoid the complex problems that come with it, and instead provide reliable and predictable pagination.
-- You need tables built in something other than traditional HTML table elements.
+- No support for infinite scrolling yet. We chose to avoid the complex problems that come with it, and instead provide reliable and predictable pagination.
 
 ## [Demo](http://react-table.zabapps.com)
 
@@ -131,18 +131,7 @@ When clicking on a column header, hold shift to multi-sort! You can toggle `asce
   },
   // Text
   previousText: 'Previous',
-  nextText: 'Next',
-  // Component Overrides
-  tableComponent: null,
-  theadComponent: null,
-  tbodyComponent: null,
-  trComponent: null,
-  thComponent: null,
-  tdComponent: null,
-  paginationComponent: null,
-  previousComponent: null,
-  nextComponent: null,
-  loadingComponent: null
+  nextText: 'Next'
 }
 ```
 
@@ -165,7 +154,7 @@ Or just define them on the component
   pageSize={10}
   minRows={3}
   // etc...
-})
+  />
 ```
 
 ## Column Props
@@ -183,7 +172,7 @@ Or just define them on the component
   className: '', // Set the classname of the `th/td` element of the column
   innerClassName: '', // Set the classname of the `.th-inner/.td-inner` element of the column
   columns: [...] // See Header Groups section below
-  render: JSX eg. ({row, value, index}) => <span>{value}</span>, // Provide a JSX element or stateless function to render whatever you want as the column's cell with access to the entire row
+  render: JSX eg. ({row, value, index, viewIndex}) => <span>{value}</span>, // Provide a JSX element or stateless function to render whatever you want as the column's cell with access to the entire row
   sortable: true,
   sort: 'asc' or 'desc',
   show: true,
@@ -210,6 +199,35 @@ const columns = [{
 }]
 ```
 
+## Component Overrides
+Though we wouldn't suggest it, `react-table` has the ability to change the core componentry it used to render it's table. You can do so by assigning a react component to it's corresponding global prop, or on a one-off basis like so:
+```javascript
+// Change the global default
+import { ReactTableDefaults } from 'react-table'
+Object.assign(ReactTableDefaults, {
+  tableComponent: Component,
+  theadComponent: Component,
+  tbodyComponent: Component,
+  trComponent: Component,
+  thComponent: Component,
+  tdComponent: Component,
+  paginationComponent: Component,
+  previousComponent: Component,
+  nextComponent: Component,
+  loadingComponent: Component
+})
+
+// Or change per instance
+<ReactTable
+  tableComponent={Component},
+  theadComponent={Component},
+  // etc...
+  />
+```
+
+If you choose to change the core components React-Table uses to render, you must make sure your components support and utilized all of the neeeded features for that component to work properly. For a broad reference on how to do this, investigate [the source](https://github.com/tannerlinsley/react-table/blob/master/src/index.js) for the component you wish to replace.
+
+
 ## Contributing
 To suggest a feature, create an issue if it does not already exist.
 If you would like to help develop a suggested feature follow these steps:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-table",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "description": "A fast, lightweight, opinionated table and datagrid built on React",
   "license": "MIT",
   "homepage": "https://github.com/tannerlinsley/react-table#readme",
@@ -14,17 +14,19 @@
     "react-table",
     "datagrid"
   ],
-  "main": "react-table.js",
+  "main": "lib/index.js",
   "scripts": {
-    "build:js": "rm -rf react-table.js && browserify src/index.js -s reactTable -u react -t babelify -g uglifyify -o react-table.js",
+    "build:node": "babel src --out-dir lib --source-maps inline",
     "build:css": "rm -rf react-table.css && stylus src/index.styl --use ./node_modules/nib/lib/nib.js --compress -o react-table.css",
     "watch": "onchange 'src/**' -i -- npm-run-all build:*",
     "test": "standard",
-    "prepublish": "npm-run-all build:*"
+    "umd": "rm -rf react-table.js && browserify lib/index.js -s reactTable -x react -t babelify -g uglifyify -o react-table.js",
+    "prepublish": "npm-run-all build:* && npm run umd"
   },
   "dependencies": {
-    "classnames": "^2.2.5",
-    "lodash": "^4.16.4",
+    "classnames": "^2.2.5"
+  },
+  "peerDependencies": {
     "react": "^15.3.1"
   },
   "devDependencies": {
@@ -35,17 +37,22 @@
     "babel-preset-stage-2": "6.13.0",
     "babelify": "^7.3.0",
     "browserify": "13.1.0",
+    "nib": "^1.1.2",
+    "npm-run-all": "^3.1.1",
     "onchange": "^3.0.2",
-    "react": "15.3.1",
     "standard": "8.0.0",
     "stylus": "^0.54.5",
     "uglifyify": "3.0.3"
   },
+  "browserify-shim": {
+    "react": "global:React"
+  },
   "standard": {
     "parser": "babel-eslint",
     "ignore": [
       "node_modules",
       "dist",
+      "lib",
       "example",
       "react-table.js"
     ]

src/index.js

@@ -196,9 +196,10 @@ export default React.createClass({
     }
   },
   accessData (data) {
-    return data.map((d) => {
+    return data.map((d, i) => {
       const row = {
-        __original: d
+        __original: d,
+        __index: i
       }
       this.decoratedColumns.forEach(column => {
         row[column.id] = column.accessor(d)
@@ -337,7 +338,8 @@ export default React.createClass({
                             <Cell
                               value={row[column.id]}
                               row={row.__original}
-                              index={i}
+                              index={row.__index}
+                              viewIndex={i}
                             />
                             ) : typeof Cell !== 'undefined' ? Cell
                           : row[column.id]}