fast-table - npm Package Compare versions

Comparing version 1.1.9 to 1.2.1

lib/BaseTable.js

@@ -69,4 +69,3 @@ 'use strict';
           fixed = _this$props.fixed,
-          showData = _this$props.showData,
-          tops = _this$props.tops;
+          showData = _this$props.showData;
 
@@ -78,4 +77,2 @@ var table = _this.context.table;
           rowRef = _table$props.rowRef,
-          getRowHeight = _table$props.getRowHeight,
-          rowHeight = _table$props.rowHeight,
           rowClassName = _table$props.rowClassName,
@@ -86,14 +83,6 @@ indentSize = _table$props.indentSize,
       var dataManager = table.dataManager;
-      var columnManager = table.columnManager;
-      var columns = [];
-      if (fixed === 'left') {
-        columns = columnManager.leftLeafColumns();
-      } else if (fixed === 'right') {
-        columns = columnManager.rightLeafColumns();
-      } else {
-        columns = columnManager.leafColumns();
-      }
+      var columns = table.columnManager.bodyColumns(fixed);
       (showData || []).forEach(function (record, i) {
-        var className = typeof rowClassName === 'function' ? rowClassName(record, record.index) : rowClassName;
-        var key = rowKey(record, record.index);
+        var className = typeof rowClassName === 'function' ? rowClassName(record, record._index) : rowClassName;
+        var key = rowKey(record, record._index);
         var props = {
@@ -109,7 +98,6 @@ key: i,
           rowKey: key,
-          index: record.index,
-          top: tops[record._showIndex],
-          ref: rowRef(record, record.index),
+          index: record._index,
+          ref: rowRef(record, record._index),
+          hasExpanded: dataManager._hasExpanded,
           components: table.components,
-          height: getRowHeight(record, record.index) * rowHeight,
           onHover: _this.handleRowHover,
@@ -138,4 +126,2 @@ expanded: dataManager.rowIsExpanded(record),
       var columnManager = table.columnManager;
-      var width = table.columnManager.getWidth(fixed);
-      width = width || '100%';
       var body = void 0;
@@ -152,11 +138,3 @@ var Table = components.table;
 
-      var columns = [];
-      if (fixed === 'left') {
-        columns = columnManager.leftColumns();
-      } else if (fixed === 'right') {
-        columns = columnManager.rightColumns();
-      } else {
-        columns = columnManager.groupedColumns();
-      }
-
+      var width = columnManager.getWidth(fixed) || '100%';
       var style = { width: width };
@@ -170,3 +148,3 @@ if (!fixed) {
         hasHead && _react2.default.createElement(_TableHeader2.default, {
-          columns: columns,
+          columns: columnManager.headColumns(fixed),
           fixed: fixed,
@@ -184,9 +162,10 @@ onSort: this.handleSort,
 
+BaseTable.contextTypes = {
+  table: _propTypes2.default.any
+};
 exports.default = (0, _miniStore.connect)(function (state) {
   var hasScroll = state.hasScroll,
       bodyHeight = state.bodyHeight,
-      tops = state.tops,
       showData = state.showData,
-      orders = state.orders,
-      newColumns = state.newColumns;
+      orders = state.orders;
 
@@ -196,12 +175,5 @@ return {
     bodyHeight: bodyHeight,
-    tops: tops,
-    showData: showData || [],
-    orders: orders,
-    newColumns: newColumns
+    showData: showData,
+    orders: orders
   };
-})(BaseTable);
-
-
-BaseTable.contextTypes = {
-  table: _propTypes2.default.any
-};
+})(BaseTable);

lib/BodyTable.js

@@ -34,4 +34,2 @@ 'use strict';
       showHeader = _table$props.showHeader,
-      footer = _table$props.footer,
-      footerHeight = _table$props.footerHeight,
       dataSource = _table$props.dataSource,
@@ -41,7 +39,6 @@ bodyMaxHeight = _table$props.bodyMaxHeight;
   var columnManager = table.columnManager;
+  var tableSize = table.tableSize();
   var fixed = props.fixed,
-      columns = props.columns,
       hasScroll = props.hasScroll,
-      handleBodyScroll = props.handleBodyScroll,
-      headHeight = props.headHeight;
+      handleBodyScroll = props.handleBodyScroll;
 
@@ -51,11 +48,10 @@ var baseTable = _react2.default.createElement(_BaseTable2.default, {
     hasBody: true,
-    fixed: fixed,
-    columns: columns
+    fixed: fixed
   });
   var height = 0;
   if (dataSource && dataSource.length > 0) {
-    var hHeight = fixedHeader ? headHeight : 0;
-    var fHeight = footer && !fixed ? footerHeight : 0;
-    height = showHeader ? 'calc(100% - ' + (hHeight + 1 + fHeight) + 'px)' : '100%';
+    height = showHeader && fixedHeader ? tableSize.height - tableSize.footerHeight - tableSize.headHeight : tableSize.height - tableSize.footerHeight;
   }
+
+  var scrollbarWidth = (0, _Utils.measureScrollbar)();
   var style = {
@@ -68,7 +64,3 @@ height: height,
   }
-  if (!columnManager.overflowX()) {
-    style.overflowX = 'hidden';
-  }
-  var scrollbarWidth = (0, _Utils.measureScrollbar)();
-  if (scrollbarWidth > 0 && fixed) {
+  if (scrollbarWidth > 0 && fixed && columnManager.overflowX()) {
     style.marginBottom = '-' + scrollbarWidth + 'px';
@@ -97,4 +89,5 @@ style.paddingBottom = '0px';
           style: {
-            height: 'calc(100% - ' + (columnManager.overflowX() ? scrollbarWidth : 0) + 'px)',
-            overflowY: hasScroll ? 'scroll' : 'hidden'
+            height: '100%',
+            overflowY: hasScroll ? 'scroll' : 'hidden',
+            overflowX: columnManager.overflowX() ? 'scroll' : 'hidden'
           },
@@ -121,8 +114,6 @@ onScroll: handleBodyScroll
 exports.default = (0, _miniStore.connect)(function (state) {
-  var hasScroll = state.hasScroll,
-      headHeight = state.headHeight;
+  var hasScroll = state.hasScroll;
 
   return {
-    hasScroll: hasScroll,
-    headHeight: headHeight
+    hasScroll: hasScroll
   };
@@ -129,0 +120,0 @@ })(BodyTable);

lib/ColumnManager.js

@@ -31,6 +31,2 @@ 'use strict';
 
-var _sumBy = require('lodash/sumBy');
-
-var _sumBy2 = _interopRequireDefault(_sumBy);
-
 var _multiply = require('lodash/multiply');
@@ -56,2 +52,10 @@
 
+var _sumBy = require('lodash/sumBy');
+
+var _sumBy2 = _interopRequireDefault(_sumBy);
+
+var _isNaN = require('lodash/isNaN');
+
+var _isNaN2 = _interopRequireDefault(_isNaN);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -74,9 +78,14 @@
     this.wrapperWidth = 0;
-    this.width = 0;
-    this.leftWidth = 0;
-    this.rightWidth = 0;
     this.hasOverflowX = false;
+    this.init();
   }
 
   _createClass(ColumnManager, [{
+    key: 'init',
+    value: function init() {
+      this.width = 0;
+      this.leftWidth = 0;
+      this.rightWidth = 0;
+    }
+  }, {
     key: 'isAnyColumnsLeftFixed',
@@ -104,2 +113,22 @@ value: function isAnyColumnsLeftFixed() {
   }, {
+    key: 'headColumns',
+    value: function headColumns(fixed) {
+      if (fixed === 'left') {
+        return this.leftColumns();
+      } else if (fixed === 'right') {
+        return this.rightColumns();
+      }
+      return this.groupedColumns();
+    }
+  }, {
+    key: 'bodyColumns',
+    value: function bodyColumns(fixed) {
+      if (fixed === 'left') {
+        return this.leftLeafColumns();
+      } else if (fixed === 'right') {
+        return this.rightLeafColumns();
+      }
+      return this.leafColumns();
+    }
+  }, {
     key: 'leftColumns',
@@ -169,16 +198,6 @@ value: function leftColumns() {
       return this._cache('groupedColumns', function () {
-        return _this9._groupColumns(_this9.columns);
+        return _this9._updateWidth(_this9._groupColumns(_this9.columns));
       });
     }
   }, {
-    key: 'updateGroupedColumns',
-    value: function updateGroupedColumns(columns) {
-      this._cached['groupedColumns'] = columns;
-      delete this._cached['leafColumns'];
-      delete this._cached['leftColumns'];
-      delete this._cached['rightColumns'];
-      delete this._cached['leftLeafColumns'];
-      delete this._cached['rightLeafColumns'];
-    }
-  }, {
     key: 'overflowX',
@@ -193,57 +212,8 @@ value: function overflowX() {
         this.wrapperWidth = wrapperWidth;
-        this.updateColWidth(wrapperWidth);
+        this._cached = {};
+        this.init();
+        this.groupedColumns();
       }
     }
   }, {
-    key: 'updateColWidth',
-    value: function updateColWidth(wrapperWidth) {
-      var _this10 = this;
-
-      var columns = this.groupedColumns();
-      var leafColumns = this.leafColumns();
-      var minWidths = this._getColWidth(columns, wrapperWidth);
-      var len = leafColumns.length;
-      var last = leafColumns[len - 1];
-      var baseWidth = (0, _sumBy2.default)(columns, function (column) {
-        return minWidths[column._pathKey];
-      });
-      this.width = 0;
-      this.leftWidth = 0;
-      this.rightWidth = 0;
-      var average = (0, _floor2.default)((wrapperWidth - baseWidth) / len);
-      var update = function update(columns) {
-        return columns.map(function (column) {
-          var newColumn = _extends({}, column);
-          var key = newColumn.path.join('-');
-          var width = minWidths[key];
-          if (newColumn._pathKey === last._pathKey) {
-            newColumn._width = wrapperWidth - _this10.width;
-          } else {
-            newColumn._width = width + average;
-          }
-          newColumn._minWidth = width;
-          var children = newColumn.children || [];
-          if (children.length > 0) {
-            newColumn.children = update(children);
-            newColumn._width = (0, _sumBy2.default)(newColumn.children, '_width');
-            newColumn._minWidth = (0, _sumBy2.default)(newColumn.children, '_minWidth');
-          }
-          if (newColumn._width < newColumn._minWidth) {
-            newColumn._width = newColumn._minWidth;
-          }
-          if (newColumn._currentRow === 0) {
-            _this10.width += newColumn._width;
-            if (newColumn.fixed === 'left' || newColumn.fixed === true) {
-              _this10.leftWidth += newColumn._width;
-            } else if (newColumn.fixed === 'right') {
-              _this10.rightWidth += newColumn._width;
-            }
-          }
-          return newColumn;
-        });
-      };
-      this.updateGroupedColumns(update(columns));
-      this.hasOverflowX = this.width > wrapperWidth;
-    }
-  }, {
     key: 'getWidth',
@@ -263,5 +233,3 @@ value: function getWidth(fixed) {
       this._cached = {};
-      if (this.wrapperWidth) {
-        this.updateColWidth(this.wrapperWidth);
-      }
+      this.init();
     }
@@ -271,3 +239,3 @@ }, {
     value: function _calcWidth(widths, wrapperWidth) {
-      var _this11 = this;
+      var _this10 = this;
 
@@ -277,3 +245,3 @@ widths = widths.map(function (w) {
           var i = w.replace('%', '');
-          return (0, _floor2.default)(_this11._minWidth((0, _multiply2.default)(wrapperWidth, (0, _divide2.default)(i, 100))));
+          return (0, _floor2.default)(_this10._minWidth((0, _multiply2.default)(wrapperWidth, (0, _divide2.default)(i, 100))));
         }
@@ -284,6 +252,6 @@ if (w && typeof w === 'string') {
         var ww = (0, _toNumber2.default)(w);
-        if (!isNaN(ww) && (0, _isNumber2.default)(ww)) {
-          return (0, _floor2.default)(_this11._minWidth(ww));
+        if (!(0, _isNaN2.default)(ww) && (0, _isNumber2.default)(ww)) {
+          return (0, _floor2.default)(_this10._minWidth(ww));
         }
-        return (0, _floor2.default)(_this11._minWidth(w));
+        return (0, _floor2.default)(_this10._minWidth(w));
       });
@@ -322,2 +290,50 @@ return widths.filter(function (w) {
     }
+  }, {
+    key: '_updateWidth',
+    value: function _updateWidth(columns) {
+      var _this11 = this;
+
+      var wrapperWidth = this.wrapperWidth || 0;
+      var leafColumns = this._leafColumns(columns);
+      var len = leafColumns.length;
+      var last = leafColumns[len - 1];
+      var baseWidth = (0, _sumBy2.default)(columns, function (column) {
+        return column._width;
+      });
+      this.width = 0;
+      this.leftWidth = 0;
+      this.rightWidth = 0;
+      var average = (0, _floor2.default)((wrapperWidth - baseWidth) / len);
+      var update = function update(columns) {
+        return columns.map(function (column) {
+          var width = column._width;
+          if (column._pathKey === last._pathKey) {
+            column._width = wrapperWidth - _this11.width;
+          } else {
+            column._width = width + average;
+          }
+          var children = column.children || [];
+          if (children.length > 0) {
+            column.children = update(children);
+            column._width = (0, _sumBy2.default)(column.children, '_width');
+          } else {
+            if (column._width < column._minWidth) {
+              column._width = column._minWidth;
+            }
+          }
+          if (column._currentRow === 0) {
+            _this11.width += column._width;
+            if (column.fixed === 'left' || column.fixed === true) {
+              _this11.leftWidth += column._width;
+            } else if (column.fixed === 'right') {
+              _this11.rightWidth += column._width;
+            }
+          }
+          return column;
+        });
+      };
+      var result = update(columns);
+      this.hasOverflowX = this.width > wrapperWidth;
+      return result;
+    }
   }]);
@@ -366,2 +382,14 @@
       newColumn.widths = (0, _flattenDeep2.default)(newColumn.widths);
+
+      var widths = newColumn.widths || [];
+      widths = _this12._calcWidth(widths, _this12.wrapperWidth);
+      var width = newColumn.width;
+      if (widths.length > 0) {
+        width = (0, _sum2.default)(widths);
+      }
+      newColumn._width = width;
+      if ((0, _isNaN2.default)(width) || width < _this12.minWidth) {
+        column._width = _this12.minWidth;
+      }
+      newColumn._minWidth = newColumn._width;
       for (var i = 0; i < rows[currentRow].length - 1; ++i) {
@@ -375,43 +403,7 @@ setRowSpan(rows[currentRow][i]);
     }
+    _this12.hasOverflowX = _this12.width > _this12.wrapperWidth && _this12.wrapperWidth !== 0;
     return grouped;
   };
-
-  this._getColWidth = function (columns, wrapperWidth) {
-    var colWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-    var currentRow = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-
-    colWidth = colWidth || {};
-    for (var index = 0; index < columns.length; index++) {
-      var column = columns[index];
-      var key = column._pathKey;
-      if (!key) key = column.path.join('-');
-      var width = column._minWidth;
-      var widths = column.widths || [];
-      widths = _this12._calcWidth(widths, wrapperWidth);
-      width = column.width;
-      if (widths.length > 0) {
-        width = (0, _sum2.default)(widths);
-      }
-      if (key in colWidth) {
-        throw Error('duplicate column title - ' + key);
-      }
-      colWidth[key] = width;
-      var children = column.children || [];
-      if (children.length > 0) {
-        colWidth = _this12._getColWidth(children, wrapperWidth, colWidth, currentRow + 1);
-      }
-      var fixed = column.fixed;
-      if (currentRow === 0) {
-        if (fixed === 'left' || fixed === true) {
-          _this12.leftWidth += width;
-        } else if (fixed === 'right') {
-          _this12.rightWidth += width;
-        }
-        _this12.width += width;
-      }
-    }
-    return colWidth;
-  };
 };
 
 exports.default = ColumnManager;

lib/DataManager.js

@@ -24,2 +24,4 @@ 'use strict';
     this._cached = {};
+    this._bodyHeight = 0;
+    this._hasExpanded = false;
 
@@ -38,8 +40,2 @@ this.getData = function () {
 
-    this.getRowsHeight = function () {
-      return _this._cache('getRowsHeight', function () {
-        return _this._getRowsHeight(_this.showData());
-      });
-    };
-
     this.isExpanded = function () {
@@ -85,21 +81,2 @@ return _this._cache('isExpanded', function () {
 
-    this._getRowsHeight = function (dataSource) {
-      dataSource = dataSource || [];
-      var bodyRowsHeight = [];
-      var tops = [];
-      var bodyHeight = 0;
-      for (var index = 0; index < dataSource.length; index++) {
-        var record = dataSource[index];
-        var height = _this.getRowHeight(record, index) * _this.rowHeight;
-        tops.push(bodyHeight);
-        bodyHeight += height;
-        bodyRowsHeight.push(height);
-      }
-      return {
-        bodyRowsHeight: bodyRowsHeight,
-        tops: tops,
-        bodyHeight: bodyHeight
-      };
-    };
-
     this._getData = function (dataSource) {
@@ -110,4 +87,6 @@ var level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
       for (var index = 0; index < dataSource.length; index++) {
-        dataSource[index]['index'] = index;
+        var height = _this.getRowHeight(dataSource[index], index) * _this.rowHeight;
+        dataSource[index]['_index'] = index;
         dataSource[index]['_expandedLevel'] = level;
+        dataSource[index]['_height'] = height;
         if (!dataSource[index]['key']) {
@@ -117,2 +96,4 @@ dataSource[index]['key'] = _this.rowKey(dataSource[index], index);
         var children = dataSource[index]['children'] || [];
+        dataSource[index]['_expandedEnable'] = children.length > 0;
+        _this._hasExpanded = _this._hasExpanded || children.length > 0;
         if (children.length > 0) {
@@ -128,6 +109,11 @@ dataSource[index]['children'] = _this._getData(children, level + 1);
       data = data || [];
+      if (data.length === 0) {
+        _this._bodyHeight = 0;
+      }
       var expandedKeys = _this.expandedRowKeys || [];
       for (var index = 0; index < dataSource.length; index++) {
         var record = dataSource[index];
-        record['_showIndex'] = data.length;
+        record._showIndex = data.length;
+        record._top = _this._bodyHeight;
+        _this._bodyHeight += record._height;
         var children = record.children || [];
@@ -147,2 +133,3 @@ data.push(record);
     this.rowKey = props.rowKey;
+    this.showData();
   }
@@ -149,0 +136,0 @@

lib/HeadTable.js

@@ -30,4 +30,3 @@ 'use strict';
       showHeader = _table$props.showHeader;
-  var columns = props.columns,
-      fixed = props.fixed,
+  var fixed = props.fixed,
       hasScroll = props.hasScroll;
@@ -49,3 +48,3 @@ var saveRef = table.saveRef;
   }
-  headStyle.overflowY = hasScroll ? 'scroll' : 'auto';
+  headStyle.overflowY = hasScroll ? 'scroll' : 'hidden';
   return _react2.default.createElement(
@@ -62,4 +61,3 @@ 'div',
       hasBody: false,
-      fixed: fixed,
-      columns: columns
+      fixed: fixed
     })
@@ -69,3 +67,3 @@ );
 
-exports.default = (0, _miniStore.connect)(function (state, props) {
+exports.default = (0, _miniStore.connect)(function (state) {
   var hasScroll = state.hasScroll;
@@ -79,10 +77,4 @@
 
-HeadTable.propTypes = {
-  fixed: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.bool]),
-  columns: _propTypes2.default.array.isRequired,
-  onSort: _propTypes2.default.func
-};
-
 HeadTable.contextTypes = {
   table: _propTypes2.default.any
 };

lib/Table.js

@@ -19,4 +19,2 @@ 'use strict';
 
-var _reactDom = require('react-dom');
-
 var _classnames = require('classnames');
@@ -68,8 +66,10 @@
 
+var _AutoSizer = require('./AutoSizer');
+
+var _AutoSizer2 = _interopRequireDefault(_AutoSizer);
+
 var _miniStore = require('./mini-store');
 
-var _TableProps2 = require('./TableProps');
+var _types = require('./types');
 
-var _TableProps3 = _interopRequireDefault(_TableProps2);
-
 require('../theme/table.css');
@@ -87,4 +87,4 @@
 
-var Table = function (_TableProps) {
-  _inherits(Table, _TableProps);
+var Table = function (_React$Component) {
+  _inherits(Table, _React$Component);
 
@@ -98,4 +98,4 @@ function Table(props) {
       var dataSource = _this.dataManager.showData();
-      _this.bodyHeight = _this['bodyTable'].getBoundingClientRect().height;
-      var showCount = 5 + _this.bodyHeight / _this.props.rowHeight;
+      var _height = _this._height || 0;
+      var showCount = 5 + _height / _this.props.rowHeight;
       showCount = showCount > dataSource.length ? dataSource.length : showCount;
@@ -106,11 +106,47 @@ showCount = Math.max(showCount, _this.props.defaultShowCount);
 
-    _this.handleWindowResize = function () {
+    _this.tableSize = function () {
+      var _this$props = _this.props,
+          footer = _this$props.footer,
+          footerHeight = _this$props.footerHeight;
+
+      return {
+        width: _this._width || 0,
+        height: _this._height || 0,
+        headHeight: _this._headHeight,
+        footerHeight: footer ? footerHeight : 0
+      };
+    };
+
+    _this.hasScroll = function () {
+      var fullHeight = _this.fullSize();
+      _this._hasScroll = _this._height > 0 && fullHeight > _this._height;
+      return _this._hasScroll;
+    };
+
+    _this.fullSize = function () {
+      var bodyHeight = _this.dataManager._bodyHeight;
+      var _this$props2 = _this.props,
+          showHeader = _this$props2.showHeader,
+          footerHeight = _this$props2.footerHeight,
+          footer = _this$props2.footer,
+          rowHeight = _this$props2.rowHeight;
+
+      return bodyHeight + (showHeader ? _this._headHeight : 0) + (footer ? footerHeight : 0) + (_this.dataManager.isEmpty() ? rowHeight : 0) + (_this.columnManager.overflowX() && _this._scrollSize ? _this._scrollSize : 0);
+    };
+
+    _this.onResize = function (_ref) {
+      var width = _ref.width,
+          height = _ref.height;
+
+      _this._width = width;
+      _this._height = height;
       _this.showCount = _this.getShowCount();
       _this.resetData();
+      _this.setScrollPositionClassName();
     };
 
-    _this.updateColumn = function (hasScroll) {
-      var scrollSize = (0, _Utils.measureScrollbar)();
-      if (_this['tableNode']) {
-        var width = (0, _reactDom.findDOMNode)(_this['tableNode']).getBoundingClientRect().width - (hasScroll ? scrollSize : 0);
+    _this.updateColumn = function () {
+      _this.hasScroll();
+      if (_this._width > 0) {
+        var width = _this._width - (_this._hasScroll ? _this._scrollSize : 0);
         _this.columnManager.updateWidth(width);
@@ -121,7 +157,4 @@ }
     _this.resetData = function () {
-      var result = _this.resetRenderInterval(_this['bodyTable']);
-      _this.updateColumn(result.hasScroll);
-      _this.store.setState(_extends({}, _this.dataManager.getRowsHeight(), result, {
-        newColumns: _this.columnManager.groupedColumns()
-      }));
+      var result = _this.resetShowData(_this['bodyTable']);
+      _this.store.setState(_extends({}, result));
     };
@@ -162,3 +195,3 @@
       if (_this.lastScrollTop !== target.scrollTop && target !== headTable) {
-        var result = _this.resetRenderInterval(target);
+        var result = _this.resetShowData(target);
         if (fixedColumnsBodyLeft && target !== fixedColumnsBodyLeft) {
@@ -174,13 +207,13 @@ fixedColumnsBodyLeft.scrollTop = target.scrollTop;
         _this.store.setState(result);
+        if (_this.props.refreshEnable) {
+          _this.scrollRefresh(target);
+        }
       }
       _this.lastScrollTop = target.scrollTop;
-      if (_this.props.refreshEnable) {
-        _this.scrollRefresh(target);
-      }
     };
 
     _this.scrollRefresh = function (target) {
-      var _this$props = _this.props,
-          scrollEndPosition = _this$props.scrollEndPosition,
-          onScrollEnd = _this$props.onScrollEnd;
+      var _this$props3 = _this.props,
+          scrollEndPosition = _this$props3.scrollEndPosition,
+          onScrollEnd = _this$props3.onScrollEnd;
 
@@ -197,14 +230,11 @@ if (target.scrollTop + target.clientHeight + scrollEndPosition > target.scrollHeight && _this.refreshAble) {
 
-    _this.resetRenderInterval = function (target) {
-      var scrollTop = target.scrollTop;
+    _this.resetShowData = function (target) {
+      var scrollTop = 0;
+      if (target) {
+        scrollTop = target.scrollTop;
+      }
       var rowHeight = _this.props.rowHeight;
 
       var dataSource = _this.dataManager.showData() || [];
-
-      var _this$dataManager$get = _this.dataManager.getRowsHeight(),
-          bodyHeight = _this$dataManager$get.bodyHeight;
-
-      var bHeight = _this['bodyTable'].getBoundingClientRect().height;
-      var hasScroll = bHeight !== 0 && bHeight < bodyHeight;
-
+      var hasScroll = _this.hasScroll();
       if (!hasScroll) {
@@ -219,3 +249,4 @@ return { hasScroll: hasScroll, showData: dataSource };
         hasScroll: hasScroll,
-        showData: showData
+        showData: showData,
+        bodHeight: _this.dataManager._bodyHeight
       };
@@ -238,7 +269,7 @@ };
 
-      var _this$props2 = _this.props,
-          prefixCls = _this$props2.prefixCls,
-          className = _this$props2.className,
-          fixedHeader = _this$props2.fixedHeader,
-          bordered = _this$props2.bordered;
+      var _this$props4 = _this.props,
+          prefixCls = _this$props4.prefixCls,
+          className = _this$props4.className,
+          fixedHeader = _this$props4.fixedHeader,
+          bordered = _this$props4.bordered;
 
@@ -248,14 +279,2 @@ return (0, _classnames2.default)(prefixCls, className, (_classNames = {}, _defineProperty(_classNames, prefixCls + '-fixed-header', fixedHeader), _defineProperty(_classNames, 'bordered', bordered), _defineProperty(_classNames, prefixCls + '-expanded', _this.dataManager.isExpanded()), _classNames));
 
-    _this.getStyle = function () {
-      var _this$props3 = _this.props,
-          width = _this$props3.width,
-          height = _this$props3.height,
-          style = _this$props3.style;
-
-      var baseStyle = Object.assign({}, style);
-      width && (baseStyle.width = width);
-      height && (baseStyle.height = height);
-      return baseStyle;
-    };
-
     _this.getRowKey = function (record, index) {
@@ -274,8 +293,6 @@ var rowKey = _this.props.rowKey;
     _this.renderTable = function (options) {
-      var columns = options.columns,
-          fixed = options.fixed;
+      var fixed = options.fixed;
 
       var headTable = _react2.default.createElement(_HeadTable2.default, {
         key: 'head',
-        columns: columns,
         fixed: fixed
@@ -285,3 +302,2 @@ });
         key: 'body',
-        columns: columns,
         fixed: fixed,
@@ -293,31 +309,16 @@ handleBodyScroll: _this.handleBodyScroll
 
-    _this.getFixedProps = function (fixed) {
-      var _this$props4 = _this.props,
-          prefixCls = _this$props4.prefixCls,
-          footerHeight = _this$props4.footerHeight,
-          rowHeight = _this$props4.rowHeight,
-          footer = _this$props4.footer;
-
-      var height = (footer ? footerHeight : 0) + (_this.dataManager.isEmpty() ? rowHeight : 0);
-      return {
-        className: prefixCls + '-fixed-' + fixed,
-        style: { height: 'calc(100% - ' + height + 'px)' }
-      };
+    _this.fixedClassName = function (fixed) {
+      return _this.props.prefixCls + '-fixed-' + fixed;
     };
 
     _this.renderMainTable = function () {
-      var table = _this.renderTable({
-        columns: _this.columnManager.groupedColumns()
-      });
-      return [table, _this.renderEmptyText(), _this.renderFooter()];
+      var table = _this.renderTable({});
+      return [table, _this.renderEmptyText()];
     };
 
     _this.renderLeftFixedTable = function () {
-      var table = _this.renderTable({
-        columns: _this.columnManager.leftColumns(),
-        fixed: 'left'
-      });
+      var table = _this.renderTable({ fixed: 'left' });
       return _react2.default.createElement(
         'div',
-        _this.getFixedProps('left'),
+        { className: _this.fixedClassName('left') },
         table
@@ -328,9 +329,6 @@ );
     _this.renderRightFixedTable = function () {
-      var table = _this.renderTable({
-        columns: _this.columnManager.rightColumns(),
-        fixed: 'right'
-      });
+      var table = _this.renderTable({ fixed: 'right' });
       return _react2.default.createElement(
         'div',
-        _this.getFixedProps('right'),
+        { className: _this.fixedClassName('right') },
         table
@@ -395,12 +393,12 @@ );
     _this.sortManager = new _SortManager2.default(_this.columnManager.groupedColumns(), props.sortMulti);
-    _this.store = (0, _miniStore.create)(_extends({
+    _this._headHeight = _this.columnManager.maxRowSpan() * props.headerRowHeight;
+    _this._hasScroll = _this.hasScroll();
+
+    _this.store = (0, _miniStore.create)({
       currentHoverKey: null,
-      hasScroll: false,
-      headHeight: _this.columnManager.maxRowSpan() * props.headerRowHeight,
-      minWidths: {},
-      orders: _this.sortManager.enabled()
-    }, _this.dataManager.getRowsHeight(), {
-      newColumns: _this.columnManager.groupedColumns()
-    }));
-    _this.debouncedWindowResize = (0, _Utils.debounce)(_this.handleWindowResize, 150);
+      hasScroll: _this._hasScroll,
+      headHeight: _this._headHeight,
+      orders: _this.sortManager.enabled(),
+      bodyHeight: _this.dataManager._bodyHeight
+    });
     return _this;
@@ -416,2 +414,3 @@ }
           saveRef: this.saveRef,
+          tableSize: this.tableSize,
           columnManager: this.columnManager,
@@ -441,4 +440,3 @@ dataManager: this.dataManager,
     value: function componentDidMount() {
-      this.handleWindowResize();
-      this.resizeEvent = (0, _Utils.addEventListener)(window, 'resize', this.debouncedWindowResize);
+      this._scrollSize = (0, _Utils.measureScrollbar)();
     }
@@ -450,2 +448,3 @@ }, {
         this.dataManager.reset(nextProps.dataSource);
+        this.hasScroll();
         this.resetData();
@@ -455,19 +454,11 @@ }
         this.columnManager.reset(nextProps.columns, this.props.colMinWidth);
-        this.handleWindowResize();
+        this.onResize({ width: this._width || 0, height: this._height || 0 });
       }
     }
   }, {
-    key: 'componentWillUnmount',
-    value: function componentWillUnmount() {
-      if (this.resizeEvent) {
-        this.resizeEvent.remove();
-      }
+    key: 'shouldComponentUpdate',
+    value: function shouldComponentUpdate() {
+      return false;
     }
   }, {
-    key: 'componentDidUpdate',
-    value: function componentDidUpdate() {
-      var showCount = this.getShowCount();
-      if (this.showCount !== showCount) this.resetData();
-    }
-  }, {
     key: 'setScrollPosition',
@@ -507,2 +498,8 @@ value: function setScrollPosition(position) {
     value: function render() {
+      var _this2 = this;
+
+      var _props = this.props,
+          style = _props.style,
+          prefixCls = _props.prefixCls;
+
       var hasLeftFixed = this.columnManager.isAnyColumnsLeftFixed();
@@ -514,11 +511,32 @@ var hasRightFixed = this.columnManager.isAnyColumnsRightFixed();
         _react2.default.createElement(
-          'div',
-          {
-            className: this.getClassName(),
-            ref: this.saveRef('tableNode'),
-            style: this.getStyle()
-          },
-          this.renderMainTable(),
-          hasLeftFixed && this.renderLeftFixedTable(),
-          hasRightFixed && this.renderRightFixedTable()
+          _AutoSizer2.default,
+          { onResize: this.onResize },
+          function (_ref2) {
+            var width = _ref2.width,
+                height = _ref2.height;
+
+            _this2._width = width;
+            var fullHeight = _this2.fullSize();
+            if (fullHeight < height) {
+              height = fullHeight;
+            }
+            _this2._height = height;
+            _this2.updateColumn();
+            return _react2.default.createElement(
+              'div',
+              {
+                className: _this2.getClassName(),
+                ref: _this2.saveRef('tableNode'),
+                style: _extends({}, style, { width: width, height: height })
+              },
+              _react2.default.createElement(
+                'div',
+                { className: prefixCls + '-content' },
+                _this2.renderMainTable(),
+                hasLeftFixed && _this2.renderLeftFixedTable(),
+                hasRightFixed && _this2.renderRightFixedTable()
+              ),
+              _this2.renderFooter()
+            );
+          }
         )
@@ -530,9 +548,8 @@ );
   return Table;
-}(_TableProps3.default);
+}(_react2.default.Component);
 
-exports.default = Table;
-
-
+Table.defaultProps = _types.TableDefaultParams;
 Table.childContextTypes = {
   table: _propTypes2.default.any
-};
+};
+exports.default = Table;

lib/TableCell.js

@@ -15,6 +15,2 @@ 'use strict';
 
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
 var _classnames = require('classnames');
@@ -34,2 +30,4 @@
 
+var _types = require('./types');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -77,4 +75,3 @@
       var _ref2 = column || {},
-          _width = _ref2._width,
-          _minWidth = _ref2._minWidth;
+          _width = _ref2._width;
 
@@ -87,5 +84,2 @@ if (_width) {
       }
-      // if (_minWidth) {
-      //   style.minWidth = _minWidth;
-      // }
       return style;
@@ -125,3 +119,4 @@ }, _this.getText = function () {
           indentSize = _this$props3.indentSize,
-          fixed = _this$props3.fixed;
+          fixed = _this$props3.fixed,
+          hasExpanded = _this$props3.hasExpanded;
 
@@ -135,2 +130,4 @@ var children = record.children || [];
         });
+      } else if (hasExpanded && !record._expandedEnable && colIndex === 0) {
+        return _react2.default.createElement('span', { style: { width: 17 } });
       }
@@ -188,19 +185,2 @@ if (colIndex === 0) {
 
-exports.default = TableCell;
-
-
-TableCell.propTypes = {
-  record: _propTypes2.default.object,
-  prefixCls: _propTypes2.default.string,
-  index: _propTypes2.default.number,
-  indent: _propTypes2.default.number,
-  indentSize: _propTypes2.default.number,
-  column: _propTypes2.default.object,
-  component: _propTypes2.default.any,
-  isLast: _propTypes2.default.bool,
-  onExpandedRowsChange: _propTypes2.default.func
-};
-
-TableCell.defaultProps = {
-  isLast: false
-};
+exports.default = TableCell;

lib/TableHeader.js

@@ -6,2 +6,3 @@ 'use strict';
 });
+exports.default = TableHeader;
 
@@ -28,5 +29,3 @@ var _react = require('react');
       fixed = props.fixed;
-  var _table$props = table.props,
-      headerRowHeight = _table$props.headerRowHeight,
-      bordered = _table$props.bordered;
+  var headerRowHeight = table.props.headerRowHeight;
 
@@ -36,4 +35,2 @@ var components = table.components;
   var HeaderRow = components.header.row;
-  var HeaderCell = components.header.cell;
-  var rowHeight = headerRowHeight - (bordered ? 1 : 0);
   return _react2.default.createElement(
@@ -50,3 +47,3 @@ HeaderWrapper,
           fixed: fixed,
-          headerRowHeight: rowHeight,
+          headerRowHeight: headerRowHeight,
           column: column,
@@ -63,12 +60,4 @@ columns: columns,
 
-exports.default = TableHeader;
-
-
-TableHeader.propTypes = {
-  fixed: _propTypes2.default.string,
-  columns: _propTypes2.default.array.isRequired
-};
-
 TableHeader.contextTypes = {
   table: _propTypes2.default.any
 };

lib/TableHeaderCell.js

@@ -13,6 +13,2 @@ 'use strict';
 
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
 var _classnames = require('classnames');
@@ -28,2 +24,4 @@
 
+var _types = require('./types');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -107,5 +105,2 @@
       }
-      // if (column._minWidth) {
-      //   style.minWidth = column._minWidth;
-      // }
       var sorter = void 0;
@@ -177,9 +172,2 @@ var order = orders[column.dataIndex];
 
-exports.default = TableHeaderCell;
-
-TableHeaderCell.propTypes = {
-  column: _propTypes2.default.object,
-  headerRowHeight: _propTypes2.default.number,
-  columns: _propTypes2.default.array,
-  index: _propTypes2.default.number
-};
+exports.default = TableHeaderCell;

lib/TableProps.js

 'use strict';
 
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
@@ -23,102 +23,102 @@
 
-var TableProps = function (_React$PureComponent) {
-  _inherits(TableProps, _React$PureComponent);
+var TableProps = function (_React$Component) {
+    _inherits(TableProps, _React$Component);
 
-  function TableProps(props) {
-    _classCallCheck(this, TableProps);
+    function TableProps(props) {
+        _classCallCheck(this, TableProps);
 
-    return _possibleConstructorReturn(this, (TableProps.__proto__ || Object.getPrototypeOf(TableProps)).call(this, props));
-  }
+        return _possibleConstructorReturn(this, (TableProps.__proto__ || Object.getPrototypeOf(TableProps)).call(this, props));
+    }
 
-  return TableProps;
-}(_react2.default.PureComponent);
+    return TableProps;
+}(_react2.default.Component);
 
 TableProps.propTypes = {
-  prefixCls: _propTypes2.default.string,
-  columns: _propTypes2.default.array,
-  dataSource: _propTypes2.default.array,
-  expandedRowKeys: _propTypes2.default.array,
+    prefixCls: _propTypes2.default.string,
+    columns: _propTypes2.default.array,
+    dataSource: _propTypes2.default.array,
+    expandedRowKeys: _propTypes2.default.array,
 
-  className: _propTypes2.default.string,
+    className: _propTypes2.default.string,
 
-  showHeader: _propTypes2.default.bool,
-  bordered: _propTypes2.default.bool,
-  fixedHeader: _propTypes2.default.bool,
-  sortMulti: _propTypes2.default.bool,
-  refreshEnable: _propTypes2.default.bool,
-  expandedRowByClick: _propTypes2.default.bool,
+    showHeader: _propTypes2.default.bool,
+    bordered: _propTypes2.default.bool,
+    fixedHeader: _propTypes2.default.bool,
+    sortMulti: _propTypes2.default.bool,
+    refreshEnable: _propTypes2.default.bool,
+    expandedRowByClick: _propTypes2.default.bool,
 
-  rowRef: _propTypes2.default.func,
-  getRowHeight: _propTypes2.default.func,
-  rowClassName: _propTypes2.default.func,
-  footer: _propTypes2.default.func,
-  emptyText: _propTypes2.default.oneOfType([_propTypes2.default.node, _propTypes2.default.func]),
-  onSort: _propTypes2.default.func,
-  onScrollEnd: _propTypes2.default.func,
-  onExpandedRowsChange: _propTypes2.default.func,
+    rowRef: _propTypes2.default.func,
+    getRowHeight: _propTypes2.default.func,
+    rowClassName: _propTypes2.default.func,
+    footer: _propTypes2.default.func,
+    emptyText: _propTypes2.default.oneOfType([_propTypes2.default.node, _propTypes2.default.func]),
+    onSort: _propTypes2.default.func,
+    onScrollEnd: _propTypes2.default.func,
+    onExpandedRowsChange: _propTypes2.default.func,
 
-  rowHeight: _propTypes2.default.number,
-  headerRowHeight: _propTypes2.default.number,
-  footerHeight: _propTypes2.default.number,
-  defaultShowCount: _propTypes2.default.number,
-  colMinWidth: _propTypes2.default.number,
-  scrollEndPosition: _propTypes2.default.number,
-  indentSize: _propTypes2.default.number,
-  bodyMaxHeight: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]),
+    rowHeight: _propTypes2.default.number,
+    headerRowHeight: _propTypes2.default.number,
+    footerHeight: _propTypes2.default.number,
+    defaultShowCount: _propTypes2.default.number,
+    colMinWidth: _propTypes2.default.number,
+    scrollEndPosition: _propTypes2.default.number,
+    indentSize: _propTypes2.default.number,
+    bodyMaxHeight: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]),
 
-  style: _propTypes2.default.object,
+    style: _propTypes2.default.object,
 
-  pagination: _propTypes2.default.oneOfType([_propTypes2.default.shape({
-    current: _propTypes2.default.number,
-    pageSize: _propTypes2.default.number,
-    total: _propTypes2.default.number
-  }), _propTypes2.default.bool])
+    pagination: _propTypes2.default.oneOfType([_propTypes2.default.shape({
+        current: _propTypes2.default.number,
+        pageSize: _propTypes2.default.number,
+        total: _propTypes2.default.number
+    }), _propTypes2.default.bool])
 };
 TableProps.defaultProps = {
-  prefixCls: 'vt',
-  columns: [],
-  dataSource: [],
+    prefixCls: 'vt',
+    columns: [],
+    dataSource: [],
 
-  showHeader: true,
-  bordered: false,
-  fixedHeader: true,
-  sortMulti: false,
-  refreshEnable: true,
-  expandedRowByClick: true,
+    showHeader: true,
+    bordered: false,
+    fixedHeader: true,
+    sortMulti: false,
+    refreshEnable: true,
+    expandedRowByClick: true,
 
-  rowRef: function rowRef() {
-    return null;
-  },
-  getRowHeight: function getRowHeight() {
-    return 1;
-  },
-  rowClassName: function rowClassName() {
-    return '';
-  },
-  emptyText: function emptyText() {
-    return '暂无数据';
-  },
-  onScrollEnd: function onScrollEnd() {
-    return null;
-  },
-  onExpandedRowsChange: function onExpandedRowsChange() {
-    return null;
-  },
+    rowRef: function rowRef() {
+        return null;
+    },
+    getRowHeight: function getRowHeight() {
+        return 1;
+    },
+    rowClassName: function rowClassName() {
+        return '';
+    },
+    emptyText: function emptyText() {
+        return '暂无数据';
+    },
+    onScrollEnd: function onScrollEnd() {
+        return null;
+    },
+    onExpandedRowsChange: function onExpandedRowsChange() {
+        return null;
+    },
 
-  rowHeight: 30,
-  headerRowHeight: 35,
-  footerHeight: 30,
-  defaultShowCount: 30,
-  colMinWidth: 60,
-  scrollEndPosition: 60,
-  indentSize: 17,
+    rowHeight: 30,
+    headerRowHeight: 35,
+    footerHeight: 30,
+    defaultShowCount: 30,
+    colMinWidth: 100,
+    scrollEndPosition: 60,
+    indentSize: 17,
 
-  style: {},
+    style: {},
 
-  pagination: {
-    current: 1,
-    pageSize: 20,
-    total: 0
-  }
+    pagination: {
+        current: 1,
+        pageSize: 20,
+        total: 0
+    }
 };
 exports.default = TableProps;

lib/TableRow.js

@@ -13,6 +13,2 @@ 'use strict';
 
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
 var _classnames = require('classnames');
@@ -28,2 +24,4 @@
 
+var _types = require('./types');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -56,3 +54,2 @@
           record = _this$props.record,
-          index = _this$props.index,
           onRowMouseEnter = _this$props.onRowMouseEnter,
@@ -64,3 +61,3 @@ onHover = _this$props.onHover,
       if (onRowMouseEnter) {
-        onRowMouseEnter(record, index, event);
+        onRowMouseEnter(record, record._index, event);
       }
@@ -70,3 +67,2 @@ }, _this.onMouseLeave = function (event) {
           record = _this$props2.record,
-          index = _this$props2.index,
           onRowMouseLeave = _this$props2.onRowMouseLeave,
@@ -78,3 +74,3 @@ onHover = _this$props2.onHover,
       if (onRowMouseLeave) {
-        onRowMouseLeave(record, index, event);
+        onRowMouseLeave(record, record._index, event);
       }
@@ -102,5 +98,4 @@ }, _this.onExpandedRowsChange = function (key, expanded) {
           record = _this$props4.record,
-          index = _this$props4.index,
           components = _this$props4.components,
-          height = _this$props4.height,
+          hasExpanded = _this$props4.hasExpanded,
           expanded = _this$props4.expanded,
@@ -112,3 +107,2 @@ indentSize = _this$props4.indentSize,
       var cells = [];
-      var columnSize = columns.length;
       columns.forEach(function (column, i) {
@@ -119,3 +113,3 @@ cells.push(_react2.default.createElement(_TableCell2.default, {
           fixed: fixed,
-          index: index,
+          index: record._index,
           colIndex: i,
@@ -125,5 +119,5 @@ column: column,
           component: components.body.cell,
-          height: height,
-          isLast: i + 1 === columnSize,
+          height: record._height,
           expanded: expanded,
+          hasExpanded: hasExpanded,
           indentSize: indentSize,
@@ -140,2 +134,4 @@ onExpandedRowsChange: onExpandedRowsChange
     value: function render() {
+      var _classNames;
+
       var _props = this.props,
@@ -145,12 +141,12 @@ components = _props.components,
           hovered = _props.hovered,
-          top = _props.top,
           className = _props.className,
-          height = _props.height;
+          record = _props.record,
+          hasExpanded = _props.hasExpanded;
 
       var BodyRow = components.body.row;
-      var rowClass = (0, _classnames2.default)('tr', prefixCls + '-row', className, _defineProperty({}, prefixCls + '-hover', hovered));
+      var rowClass = (0, _classnames2.default)('tr', prefixCls + '-row', prefixCls + '-row-' + record._showIndex % 2, className, (_classNames = {}, _defineProperty(_classNames, prefixCls + '-hover', hovered), _defineProperty(_classNames, prefixCls + '-expanded-row-' + record._expandedLevel, hasExpanded), _classNames));
       var style = {
         position: 'absolute',
-        top: top,
-        height: height
+        top: record._top,
+        height: record._height
       };
@@ -174,2 +170,5 @@ return _react2.default.createElement(
 
+TableRow.defaultProps = {
+  hasExpanded: false
+};
 exports.default = (0, _miniStore.connect)(function (state, props) {
@@ -182,16 +181,2 @@ var currentHoverKey = state.currentHoverKey;
   };
-})(TableRow);
-
-
-TableRow.propTypes = {
-  record: _propTypes2.default.object,
-  prefixCls: _propTypes2.default.string,
-  columns: _propTypes2.default.array,
-  height: _propTypes2.default.number,
-  indentSize: _propTypes2.default.number,
-  rowKey: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]).isRequired,
-  className: _propTypes2.default.string,
-  fixed: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]),
-  onExpandedRowsChange: _propTypes2.default.func,
-  expanded: _propTypes2.default.bool
-};
+})(TableRow);

package.json

 {
   "name": "fast-table",
-  "version": "1.1.9",
+  "version": "1.2.1",
   "description": "react table fast",
@@ -44,2 +44,3 @@ "main": "./lib/index.js",
     "babel-preset-env": "^1.6.1",
+    "babel-preset-flow": "^6.23.0",
     "babel-preset-react": "^6.24.1",
@@ -46,0 +47,0 @@ "babel-preset-stage-0": "^6.24.1",

README.md

@@ -0,0 +0,0 @@ # fast-table

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

120686

increased by10.68%

Number of package files

30

increased by11.11%

Lines of code

3147

increased by8.22%

Worsened metrics

Dev dependency count

9

increased by12.5%

No dependency changes