fixed-data-table-2 - npm Package Compare versions

Comparing version 1.0.0-beta.20 to 1.0.0-beta.21

internal/FixedDataTableBufferedRows.js

 'use strict';
 
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@@ -85,72 +87,31 @@
     value: function render() /*object*/{
-      var _this2 = this;
+      var _props = this.props,
+          offsetTop = _props.offsetTop,
+          scrollTop = _props.scrollTop,
+          isScrolling = _props.isScrolling,
+          rowsToRender = _props.rowsToRender;
 
-      var props = this.props;
-      var rowClassNameGetter = props.rowClassNameGetter || _emptyFunction2.default;
-      var rowsToRender = this.props.rowsToRender || [];
+      var baseOffsetTop = offsetTop - scrollTop;
+      rowsToRender = rowsToRender || [];
 
-      if (props.isScrolling) {
-        // We are scrolling, so there's no need to display any rows which lie outside the viewport.
-        // We still need to render them though, so as to not cause any mounts/unmounts.
-        this._staticRowArray.forEach(function (row, i) {
-          var rowOutsideViewport = !_this2.isRowInsideViewport(row.props.index);
-          if (rowOutsideViewport) {
-            _this2._staticRowArray[i] = _this2.getStubRow(i, false, row.props.index);
-          }
-        });
+      if (isScrolling) {
+        // allow static array to grow while scrolling
+        this._staticRowArray.length = Math.max(this._staticRowArray.length, rowsToRender.length);
       } else {
+        // when scrolling is done, static array can shrink to fit the buffer
         this._staticRowArray.length = rowsToRender.length;
       }
 
-      var baseOffsetTop = props.offsetTop - props.scrollTop;
-
-      for (var i = 0; i < rowsToRender.length; i++) {
+      // render each row from the buffer into the static row array
+      for (var i = 0; i < this._staticRowArray.length; i++) {
         var rowIndex = rowsToRender[i];
-
-        // if the row doesn't exist in the buffer, assign a fake row to it.
-        // this is so that we can get rid of unnecessary row mounts/unmounts
+        // if the row doesn't exist in the buffer set, then take the previous one
         if (rowIndex === undefined) {
-          // if a previous row existed, let's just make use of that
-          if (this._staticRowArray[i] === undefined) {
-            this._staticRowArray[i] = this.getStubRow(i, true, -1);
-          }
-          continue;
+          rowIndex = this._staticRowArray[i] && this._staticRowArray[i].props.index;
         }
 
-        var currentRowHeight = this.props.rowSettings.rowHeightGetter(rowIndex);
-        var currentSubRowHeight = this.props.rowSettings.subRowHeightGetter(rowIndex);
-        var rowOffsetTop = baseOffsetTop + props.rowOffsets[rowIndex];
-        var rowKey = props.rowKeyGetter ? props.rowKeyGetter(rowIndex) : i;
-        var hasBottomBorder = rowIndex === props.rowSettings.rowsCount - 1 && props.showLastRowBorder;
-        var visible = this.isRowInsideViewport(rowIndex);
-
-        this._staticRowArray[i] = _react2.default.createElement(_FixedDataTableRow2.default, {
-          key: rowKey,
-          isScrolling: props.isScrolling,
-          index: rowIndex,
-          width: props.width,
-          height: currentRowHeight,
-          subRowHeight: currentSubRowHeight,
-          rowExpanded: props.rowExpanded,
-          scrollLeft: Math.round(props.scrollLeft),
-          offsetTop: Math.round(rowOffsetTop),
-          visible: visible,
-          fixedColumns: props.fixedColumns,
-          fixedRightColumns: props.fixedRightColumns,
-          scrollableColumns: props.scrollableColumns,
-          onClick: props.onRowClick,
-          onContextMenu: props.onRowContextMenu,
-          onDoubleClick: props.onRowDoubleClick,
-          onMouseDown: props.onRowMouseDown,
-          onMouseUp: props.onRowMouseUp,
-          onMouseEnter: props.onRowMouseEnter,
-          onMouseLeave: props.onRowMouseLeave,
-          onTouchStart: props.onRowTouchStart,
-          onTouchEnd: props.onRowTouchEnd,
-          onTouchMove: props.onRowTouchMove,
-          showScrollbarY: props.showScrollbarY,
-          className: (0, _joinClasses2.default)(rowClassNameGetter(rowIndex), (0, _cx2.default)('public/fixedDataTable/bodyRow'), (0, _cx2.default)({
-            'fixedDataTableLayout/hasBottomBorder': hasBottomBorder,
-            'public/fixedDataTable/hasBottomBorder': hasBottomBorder
-          }))
+        this._staticRowArray[i] = this.renderRow({
+          rowIndex: rowIndex,
+          key: i,
+          baseOffsetTop: baseOffsetTop
         });
@@ -162,3 +123,5 @@ }
         null,
-        this._staticRowArray
+        ' ',
+        this._staticRowArray,
+        ' '
       );
@@ -168,8 +131,5 @@ }
     /**
-     * Returns a stub row which won't be visible to the user.
-     * This allows us to still render a row and React won't unmount it.
-     *
+     * @param {number} rowIndex
      * @param {number} key
-     * @param {boolean} fake
-     * @param {number} index
+     * @param {number} baseOffsetTop
      * @return {!Object}
@@ -179,25 +139,54 @@ */
   }, {
-    key: 'getStubRow',
-    value: function getStubRow(key, fake, index) /*object*/{
+    key: 'renderRow',
+    value: function renderRow(_ref) /*object*/{
+      var rowIndex = _ref.rowIndex,
+          key = _ref.key,
+          baseOffsetTop = _ref.baseOffsetTop;
+
       var props = this.props;
-      return _react2.default.createElement(_FixedDataTableRow2.default, {
+      var rowClassNameGetter = props.rowClassNameGetter || _emptyFunction2.default;
+      var fake = rowIndex === undefined;
+      var rowProps = {};
+
+      // if row exists, then calculate row specific props
+      if (!fake) {
+        rowProps.height = this.props.rowSettings.rowHeightGetter(rowIndex);
+        rowProps.subRowHeight = this.props.rowSettings.subRowHeightGetter(rowIndex);
+        rowProps.offsetTop = Math.round(baseOffsetTop + props.rowOffsets[rowIndex]);
+        rowProps.key = props.rowKeyGetter ? props.rowKeyGetter(rowIndex) : key;
+
+        var hasBottomBorder = rowIndex === props.rowSettings.rowsCount - 1 && props.showLastRowBorder;
+        rowProps.className = (0, _joinClasses2.default)(rowClassNameGetter(rowIndex), (0, _cx2.default)('public/fixedDataTable/bodyRow'), (0, _cx2.default)({
+          'fixedDataTableLayout/hasBottomBorder': hasBottomBorder,
+          'public/fixedDataTable/hasBottomBorder': hasBottomBorder
+        }));
+      }
+
+      var visible = (0, _inRange2.default)(rowIndex, this.props.firstViewportRowIndex, this.props.endViewportRowIndex);
+
+      return _react2.default.createElement(_FixedDataTableRow2.default, _extends({
         key: key,
+        index: rowIndex,
         isScrolling: props.isScrolling,
-        index: index,
         width: props.width,
-        height: 0,
-        offsetTop: 0,
+        rowExpanded: props.rowExpanded,
         scrollLeft: Math.round(props.scrollLeft),
-        visible: false,
-        fake: fake,
         fixedColumns: props.fixedColumns,
         fixedRightColumns: props.fixedRightColumns,
-        scrollableColumns: props.scrollableColumns
-      });
+        scrollableColumns: props.scrollableColumns,
+        onClick: props.onRowClick,
+        onContextMenu: props.onRowContextMenu,
+        onDoubleClick: props.onRowDoubleClick,
+        onMouseDown: props.onRowMouseDown,
+        onMouseUp: props.onRowMouseUp,
+        onMouseEnter: props.onRowMouseEnter,
+        onMouseLeave: props.onRowMouseLeave,
+        onTouchStart: props.onRowTouchStart,
+        onTouchEnd: props.onRowTouchEnd,
+        onTouchMove: props.onRowTouchMove,
+        showScrollbarY: props.showScrollbarY,
+        visible: visible,
+        fake: fake
+      }, rowProps));
     }
-  }, {
-    key: 'isRowInsideViewport',
-    value: function isRowInsideViewport( /*number*/rowIndex) {
-      return (0, _inRange2.default)(rowIndex, this.props.firstViewportRowIndex, this.props.endViewportRowIndex);
-    }
   }]);
@@ -204,0 +193,0 @@

internal/FixedDataTableColumnResizeHandle.js

@@ -11,5 +11,5 @@ 'use strict';
 
-var _react = require('react');
+var _React = require('./React');
 
-var _react2 = _interopRequireDefault(_react);
+var _React2 = _interopRequireDefault(_React);
 
@@ -108,8 +108,3 @@ var _createReactClass = require('create-react-class');
      */
-    columnKey: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]),
-
-    /**
-     * Whether the resize handle should respond to touch events or not.
-     */
-    touchEnabled: _propTypes2.default.bool
+    columnKey: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number])
   },
@@ -133,3 +128,3 @@
   componentDidMount: function componentDidMount() {
-    this._mouseMoveTracker = new _DOMMouseMoveTracker2.default(this._onMove, this._onColumnResizeEnd, document.body, this.props.touchEnabled);
+    this._mouseMoveTracker = new _DOMMouseMoveTracker2.default(this._onMove, this._onColumnResizeEnd, document.body);
   },
@@ -150,3 +145,3 @@ componentWillUnmount: function componentWillUnmount() {
     }
-    return _react2.default.createElement(
+    return _React2.default.createElement(
       'div',
@@ -160,3 +155,3 @@ {
         style: style },
-      _react2.default.createElement('div', {
+      _React2.default.createElement('div', {
         className: (0, _cx2.default)('fixedDataTableColumnResizerLineLayout/mouseArea'),
@@ -163,0 +158,0 @@ style: { height: this.props.height }

internal/FixedDataTableRoot.js

@@ -39,3 +39,3 @@ /**
 
-FixedDataTableRoot.version = '1.0.0-beta.20';
+FixedDataTableRoot.version = '1.0.0-beta.21';
 module.exports = FixedDataTableRoot;

internal/FixedDataTableWidthHelper.js

@@ -15,5 +15,5 @@ /**
 
-var _react = require('react');
+var _React = require('./React');
 
-var _react2 = _interopRequireDefault(_react);
+var _React2 = _interopRequireDefault(_React);
 
@@ -65,3 +65,3 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-    newColumns.push(_react2.default.cloneElement(column, { width: newColumnWidth }));
+    newColumns.push(_React2.default.cloneElement(column, { width: newColumnWidth }));
   }
@@ -81,3 +81,3 @@
   for (i = 0; i < columnGroups.length; ++i) {
-    _react2.default.Children.forEach(columnGroups[i].props.children, function (column) {
+    _React2.default.Children.forEach(columnGroups[i].props.children, function (column) {
       allColumns.push(column);
@@ -97,3 +97,3 @@ });
 
-    _react2.default.Children.forEach(columnGroup.props.children, function (column) {
+    _React2.default.Children.forEach(columnGroup.props.children, function (column) {
       currentColumns.push(column);
@@ -114,3 +114,3 @@ });
 
-    newColumnGroups.push(_react2.default.cloneElement(columnGroup, { width: newColumnSettings.width }));
+    newColumnGroups.push(_React2.default.cloneElement(columnGroup, { width: newColumnSettings.width }));
   }
@@ -117,0 +117,0 @@

package.json

 {
   "name": "fixed-data-table-2",
-  "version": "1.0.0-beta.20",
+  "version": "1.0.0-beta.21",
   "description": "A React table component designed to allow presenting thousands of rows of data.",
@@ -5,0 +5,0 @@ "main": "main.js",

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

1993947

increased by1.16%

Number of package files

144

increased by2.86%

Lines of code

29880

increased by1.99%

No dependency changes