sussol-react-table - npm Package Compare versions

Comparing version 0.1.9 to 0.1.10

lib/__tests__/SussolReactTable.spec.js

@@ -38,2 +38,3 @@ 'use strict';
 */
+/* eslint-disable function-paren-newline */
 var MountWithMuiContext = exports.MountWithMuiContext = function MountWithMuiContext(node) {
@@ -40,0 +41,0 @@ return (0, _enzyme.mount)(node, {

lib/SussolReactTable.js

@@ -49,18 +49,24 @@ 'use strict';
 
-var noop = function noop() {};
+var renderSortIcon = function renderSortIcon(direction) {
+  return direction === 'asc' ? _react2.default.createElement(
+    'svg',
+    { width: '18', height: '18', viewBox: '0 0 24 24' },
+    _react2.default.createElement('path', { d: 'M7 10l5 5 5-5z' }),
+    _react2.default.createElement('path', { d: 'M0 0h24v24H0z', fill: 'none' })
+  ) : _react2.default.createElement(
+    'svg',
+    { width: '18', height: '18', viewBox: '0 0 24 24' },
+    _react2.default.createElement('path', { d: 'M7 14l5-5 5 5z' }),
+    _react2.default.createElement('path', { d: 'M0 0h24v24H0z', fill: 'none' })
+  );
+};
 
-var SussolReactTable = exports.SussolReactTable = function (_React$Component) {
-  _inherits(SussolReactTable, _React$Component);
+var SussolReactTable = exports.SussolReactTable = function (_PureComponent) {
+  _inherits(SussolReactTable, _PureComponent);
 
   function SussolReactTable(props) {
-    var _ref;
-
     _classCallCheck(this, SussolReactTable);
 
-    for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-      args[_key - 1] = arguments[_key];
-    }
+    var _this = _possibleConstructorReturn(this, (SussolReactTable.__proto__ || Object.getPrototypeOf(SussolReactTable)).call(this, props));
 
-    var _this = _possibleConstructorReturn(this, (_ref = SussolReactTable.__proto__ || Object.getPrototypeOf(SussolReactTable)).call.apply(_ref, [this, props].concat(args)));
-
     _this.state = {
@@ -72,2 +78,3 @@ columns: props.columns || [],
     };
+
     _this.editCell = _this.editCell.bind(_this);
@@ -85,12 +92,18 @@ _this.renderCell = _this.renderCell.bind(_this);
     key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(nextProps) {
-      this.setState({ tableData: nextProps.tableData });
+    value: function componentWillReceiveProps(_ref) {
+      var tableData = _ref.tableData;
+
+      this.setState({ tableData: tableData });
     }
   }, {
     key: 'toggleSortOrder',
-    value: function toggleSortOrder(columnKey) {
+    value: function toggleSortOrder(column) {
+      if (!column.sortable) return;
+
+      var key = column.key;
+
       this.setState({
-        sortBy: columnKey,
+        sortBy: key,
         isAscending: !this.state.isAscending,
-        tableData: this.sortColumn(columnKey, compare)
+        tableData: this.sortColumn(key, compare)
       });
@@ -112,8 +125,8 @@ }
     value: function sortColumn(columnKey, comparator) {
-      var _this2 = this;
+      var _state = this.state,
+          isAscending = _state.isAscending,
+          tableData = _state.tableData;
 
-      var tableData = this.state.tableData;
-
       return tableData.sort(function (a, b) {
-        return comparator(a[columnKey], b[columnKey], _this2.state.isAscending);
+        return comparator(a[columnKey], b[columnKey], isAscending);
       });
@@ -125,2 +138,3 @@ }
       var tableData = this.state.tableData;
+
       tableData[rowIndex][columnKey] = newValue;
@@ -137,8 +151,14 @@ this.setState({
     value: function renderColumnHeader(column) {
-      var _this3 = this;
+      var _this2 = this;
 
       var sortIcon = void 0;
+      var key = column.key,
+          sortable = column.sortable;
+      var _state2 = this.state,
+          isAscending = _state2.isAscending,
+          sortBy = _state2.sortBy;
 
-      if (column.sortable && this.state.sortBy === column.key) {
-        sortIcon = this.state.isAscending ? this.renderSortIcon('asc') : this.renderSortIcon('desc');
+
+      if (sortable && sortBy === key) {
+        sortIcon = isAscending ? renderSortIcon('asc') : renderSortIcon('desc');
       }
@@ -153,5 +173,5 @@
           icon: sortIcon,
-          onClick: column.sortable ? function () {
-            return _this3.toggleSortOrder(column.key);
-          } : noop,
+          onClick: function onClick() {
+            return _this2.toggleSortOrder(column);
+          },
           style: { width: '100%' }
@@ -165,10 +185,10 @@ })
       var cellDataKey = _ref2.cellDataKey;
+      var tableData = this.state.tableData;
 
-      var tableData = this.state.tableData;
       var value = tableData[rowIndex][columnKey] !== null ? tableData[rowIndex][columnKey] : '';
+      var keyClassName = cellDataKey ? cellDataKey + '-' + tableData[rowIndex][cellDataKey] : '';
+
       return _react2.default.createElement(
         _table.Cell,
-        {
-          className: cellDataKey + '-' + tableData[rowIndex][cellDataKey]
-        },
+        { className: keyClassName },
         value
@@ -180,12 +200,14 @@ );
     value: function renderEditableCell(rowIndex, columnKey, _ref3) {
-      var _this4 = this;
+      var _this3 = this;
 
       var cellDataKey = _ref3.cellDataKey;
+      var tableData = this.state.tableData;
 
-      var tableData = this.state.tableData;
       var value = tableData[rowIndex][columnKey] !== null ? tableData[rowIndex][columnKey] : '';
+      var keyClassName = cellDataKey ? cellDataKey + '-' + tableData[rowIndex][cellDataKey] : '';
+
       return _react2.default.createElement(_table.EditableCell, {
-        className: cellDataKey + '-' + tableData[rowIndex][cellDataKey],
+        className: keyClassName,
         onConfirm: function onConfirm(newValue) {
-          _this4.editCell(rowIndex, columnKey, newValue);
+          _this3.editCell(rowIndex, columnKey, newValue);
         },
@@ -198,14 +220,17 @@ value: value
     value: function renderColumns(props) {
-      var _this5 = this;
+      var _this4 = this;
 
-      var columnDefinitions = this.state.columns;
+      var columns = this.state.columns;
 
-      return columnDefinitions.map(function (columnDef, index) {
+      var key = 0;
+
+      return columns.map(function (column) {
+        key += 1;
         return _react2.default.createElement(_table.Column, {
-          key: index,
+          key: key,
           renderCell: function renderCell(rowIndex) {
-            return columnDef.editable ? _this5.renderEditableCell(rowIndex, columnDef.key, props) : _this5.renderCell(rowIndex, columnDef.key, props);
+            return column.editable ? _this4.renderEditableCell(rowIndex, column.key, props) : _this4.renderCell(rowIndex, column.key, props);
           },
           renderColumnHeader: function renderColumnHeader() {
-            return _this5.renderColumnHeader(columnDef);
+            return _this4.renderColumnHeader(column);
           }
@@ -216,17 +241,2 @@ });
   }, {
-    key: 'renderSortIcon',
-    value: function renderSortIcon(direction) {
-      return direction === 'asc' ? _react2.default.createElement(
-        'svg',
-        { width: '18', height: '18', viewBox: '0 0 24 24' },
-        _react2.default.createElement('path', { d: 'M7 10l5 5 5-5z' }),
-        _react2.default.createElement('path', { d: 'M0 0h24v24H0z', fill: 'none' })
-      ) : _react2.default.createElement(
-        'svg',
-        { width: '18', height: '18', viewBox: '0 0 24 24' },
-        _react2.default.createElement('path', { d: 'M7 14l5-5 5 5z' }),
-        _react2.default.createElement('path', { d: 'M0 0h24v24H0z', fill: 'none' })
-      );
-    }
-  }, {
     key: 'render',
@@ -243,9 +253,8 @@ value: function render() {
   return SussolReactTable;
-}(_react2.default.Component);
+}(_react.PureComponent);
 
 SussolReactTable.propTypes = _extends({}, _table.Table.propTypes, {
-  columns: _propTypes2.default.array,
-  tableData: _propTypes2.default.array,
+  columns: _propTypes2.default.arrayOf(_propTypes2.default.objectOf(_propTypes2.default.any)).isRequired,
+  tableData: _propTypes2.default.arrayOf(_propTypes2.default.objectOf(_propTypes2.default.any)).isRequired,
   defaultSortKey: _propTypes2.default.string,
-  hideSearchBar: _propTypes2.default.bool,
   rowHeight: _propTypes2.default.number
@@ -255,3 +264,4 @@ });
 SussolReactTable.defaultProps = {
+  defaultSortKey: '',
   rowHeight: 45
 };

package.json

@@ -8,3 +8,3 @@ {
   "main": "lib/index.js",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "license": "MIT",
@@ -19,4 +19,5 @@ "description": "A Sussol themed wrapper and simple API for the blueprintjs table component",
   "scripts": {
-    "build": "babel --presets stage-0,es2015 src --out-dir lib",
-    "prepublish": "npm run build",
+    "build": "babel --presets stage-0,env src --out-dir lib",
+    "lint": "eslint ./ --ext=\".js,.jsx\" --ignore-pattern __tests__/ --ignore-pattern __mocks__/ --ignore-pattern node_modules/ --ignore-pattern lib/ --ignore-pattern examples/",
+    "prepublish": "yarn build",
     "test": "jest src/__tests__/SussolReactTable.spec.js"
@@ -41,12 +42,13 @@ },
     "babel-core": "^6.6.5",
-    "babel-eslint": "^6.1.2",
-    "babel-preset-es2015": "^6.3.13",
+    "babel-eslint": "^8.0.2",
+    "babel-preset-env": "^1.6.1",
     "babel-preset-react": "^6.3.13",
     "babel-preset-stage-0": "^6.3.13",
     "enzyme": "^2.9.1",
-    "eslint": "^2.7.0",
-    "eslint-config-airbnb": "^7.0.0",
-    "eslint-plugin-jsx-a11y": "^0.6.2",
-    "eslint-plugin-react": "^4.3.0",
-    "jest": "18.1.0",
+    "eslint": "^4.10.0",
+    "eslint-config-airbnb": "^16.1.0",
+    "eslint-plugin-import": "^2.8.0",
+    "eslint-plugin-jsx-a11y": "^6.0.2",
+    "eslint-plugin-react": "^7.4.0",
+    "jest": "^21.2.1",
     "material-ui": "^0.19.4",
@@ -53,0 +55,0 @@ "react": "^15.6.1",

README.md

@@ -0,1 +1,3 @@
+![Build Status](http://54.206.8.184:8080/buildStatus/icon?job=sussol-react-table-test)
+
 # sussol-react-table
@@ -2,0 +4,0 @@ A wrapper and simple API for using the blueprintjs data table

No alert changes

Improved metrics

Total package byte prevSize

201934

increased by6.21%

Number of package files

16

increased by6.67%

Lines of code

460

increased by10.58%

Number of lines in readme file

83

increased by2.47%

Worsened metrics

Dev dependency count

17

increased by6.25%

No dependency changes