Merge branch 'develop'

README.md

@@ -48,10 +48,16 @@ see how to create table with JSX bellow.
 ## Few screen-shots
 
 ### Multiple select with Ctrl and Shift
-![alt tag](https://raw.githubusercontent.com/GigaTables/gigatables/master/GigaTables_basic_view.png)
+![alt tag](https://raw.githubusercontent.com/GigaTables/reactables/master/screens/GigaTables_basic_view.png)
 
 ### CRUD pop-ups
-![alt tag](https://raw.githubusercontent.com/GigaTables/gigatables/master/GigaTables_edit_item.png)
+![alt tag](https://raw.githubusercontent.com/GigaTables/reactables/master/screens/GigaTables_edit_item.png)
+
+### Pagination + sorting
+![alt tag](https://raw.githubusercontent.com/GigaTables/reactables/master/screens/GigaTables_pagination_with_sort.png)
+
+### Delete items
+![alt tag](https://raw.githubusercontent.com/GigaTables/reactables/master/screens/GigaTables_delete_items.png)
 
 ## Installation based on browser script implementation (which U can download from build/ dir)
 ```HTML

src/components/Header.js

@@ -12,6 +12,13 @@ class Header extends React.Component {
     this.isDiscreteSearch = false;
   }
 
+  shouldComponentUpdate(nextProps)
+  {
+    return this.props.sortId !== nextProps.sortId
+    || this.props.columns[this.props.sortId] !== nextProps.columns[this.props.sortId]
+    || this.props.sortDirection !== nextProps.sortDirection;
+  }
+
   getHeaderContent()
   {
     const {

src/components/Pagination.js

@@ -7,6 +7,14 @@ var EditorConstants = require('./EditorConstants');
 var Lang = require('./Lang');
 
 class Pagination extends React.Component {
+  shouldComponentUpdate(nextProps)
+  {
+    return this.props.countRows !== nextProps.countRows
+      || this.props.page !== nextProps.page
+      || this.props.perPage !== nextProps.perPage
+      || this.props.fromRow !== nextProps.fromRow;
+  }
+
   render()
   {
     var lang = Lang[this.props.lang];

src/components/Row.js

@@ -3,6 +3,17 @@ import styles from '../css/styles.css'
 import classNames from 'classnames/bind'
 
 export default class Row extends React.Component {
+  shouldComponentUpdate(nextProps) {
+    const { gteRowId, count, selectedRows, minRow, maxRow } = this.props;
+    return gteRowId !== nextProps.gteRowId
+      || count !== nextProps.count
+      || selectedRows.length !== nextProps.selectedRows.length
+      || selectedRows.indexOf(count) !== nextProps.selectedRows.indexOf(count) // on multiple merged rows selection Shift+Clk
+      || selectedRows.indexOf(count) !== -1 // on multiple splited rows selection Ctrl+Clk
+      || minRow !== nextProps.minRow
+      || maxRow !== nextProps.maxRow;
+  }
+
   render()
   {
     const {