@depup/react-virtualized 9.22.6-depup.0

package/dist/es/CellMeasurer/CellMeasurer.jest.js

@@ -0,0 +1,340 @@
+import * as React from 'react';
+import { findDOMNode } from 'react-dom';
+import { render } from '../TestUtils';
+import CellMeasurer from './CellMeasurer';
+import CellMeasurerCache, { DEFAULT_HEIGHT, DEFAULT_WIDTH } from './CellMeasurerCache';
+
+// Accounts for the fact that JSDom doesn't support measurements.
+function mockClientWidthAndHeight(_ref) {
+  var height = _ref.height,
+    width = _ref.width;
+  var object = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : HTMLElement.prototype;
+  var heightFn = jest.fn().mockReturnValue(height);
+  var widthFn = jest.fn().mockReturnValue(width);
+  Object.defineProperty(object, 'offsetHeight', {
+    configurable: true,
+    get: heightFn
+  });
+  Object.defineProperty(object, 'offsetWidth', {
+    configurable: true,
+    get: widthFn
+  });
+  return {
+    heightFn: heightFn,
+    widthFn: widthFn
+  };
+}
+function createParent() {
+  var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    cache = _ref2.cache,
+    _ref2$invalidateCellS = _ref2.invalidateCellSizeAfterRender,
+    invalidateCellSizeAfterRender = _ref2$invalidateCellS === void 0 ? jest.fn() : _ref2$invalidateCellS;
+  return {
+    invalidateCellSizeAfterRender: invalidateCellSizeAfterRender,
+    props: {
+      deferredMeasurementCache: cache
+    }
+  };
+}
+function renderHelper() {
+  var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    _ref3$cache = _ref3.cache,
+    cache = _ref3$cache === void 0 ? new CellMeasurerCache({
+      fixedWidth: true
+    }) : _ref3$cache,
+    _ref3$children = _ref3.children,
+    children = _ref3$children === void 0 ? /*#__PURE__*/React.createElement("div", null) : _ref3$children,
+    parent = _ref3.parent;
+  render(/*#__PURE__*/React.createElement(CellMeasurer, {
+    cache: cache,
+    columnIndex: 0,
+    parent: parent,
+    rowIndex: 0,
+    style: {}
+  }, children));
+}
+describe('CellMeasurer', function () {
+  it('componentDidMount() should measure content that is not already in the cache', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    var parent = createParent({
+      cache: cache
+    });
+    var _mockClientWidthAndHe = mockClientWidthAndHeight({
+        height: 20,
+        width: 100
+      }),
+      heightFn = _mockClientWidthAndHe.heightFn,
+      widthFn = _mockClientWidthAndHe.widthFn;
+    expect(heightFn).toHaveBeenCalledTimes(0);
+    expect(widthFn).toHaveBeenCalledTimes(0);
+    expect(cache.has(0, 0)).toBe(false);
+    renderHelper({
+      cache: cache,
+      parent: parent
+    });
+    expect(parent.invalidateCellSizeAfterRender).toHaveBeenCalled();
+    expect(heightFn).toHaveBeenCalledTimes(1);
+    expect(widthFn).toHaveBeenCalledTimes(1);
+    expect(cache.has(0, 0)).toBe(true);
+    expect(cache.getWidth(0, 0)).toBe(100);
+    expect(cache.getHeight(0, 0)).toBe(20);
+  });
+  it('componentDidMount() should not measure content that is already in the cache', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    cache.set(0, 0, 100, 20);
+    var parent = createParent({
+      cache: cache
+    });
+    var _mockClientWidthAndHe2 = mockClientWidthAndHeight({
+        height: 20,
+        width: 100
+      }),
+      heightFn = _mockClientWidthAndHe2.heightFn,
+      widthFn = _mockClientWidthAndHe2.widthFn;
+    expect(cache.has(0, 0)).toBe(true);
+    renderHelper({
+      cache: cache,
+      parent: parent
+    });
+    expect(parent.invalidateCellSizeAfterRender).not.toHaveBeenCalled();
+    expect(heightFn).toHaveBeenCalledTimes(0);
+    expect(widthFn).toHaveBeenCalledTimes(0);
+  });
+  it('componentDidUpdate() should measure content that is not already in the cache', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    var parent = createParent({
+      cache: cache
+    });
+    renderHelper({
+      cache: cache,
+      parent: parent
+    });
+    cache.clear(0, 0);
+    parent.invalidateCellSizeAfterRender.mockReset();
+    expect(cache.has(0, 0)).toBe(false);
+    expect(cache.getWidth(0, 0)).toBe(DEFAULT_WIDTH);
+    expect(cache.getHeight(0, 0)).toBe(DEFAULT_HEIGHT);
+    var _mockClientWidthAndHe3 = mockClientWidthAndHeight({
+        height: 20,
+        width: 100
+      }),
+      heightFn = _mockClientWidthAndHe3.heightFn,
+      widthFn = _mockClientWidthAndHe3.widthFn;
+    renderHelper({
+      cache: cache,
+      parent: parent
+    });
+    expect(cache.has(0, 0)).toBe(true);
+    expect(parent.invalidateCellSizeAfterRender).toHaveBeenCalled();
+    expect(heightFn).toHaveBeenCalledTimes(1);
+    expect(widthFn).toHaveBeenCalledTimes(1);
+    expect(cache.getWidth(0, 0)).toBe(100);
+    expect(cache.getHeight(0, 0)).toBe(20);
+  });
+  it('componentDidUpdate() should not measure content that is already in the cache', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    cache.set(0, 0, 100, 20);
+    var parent = createParent({
+      cache: cache
+    });
+    expect(cache.has(0, 0)).toBe(true);
+    var _mockClientWidthAndHe4 = mockClientWidthAndHeight({
+        height: 20,
+        width: 100
+      }),
+      heightFn = _mockClientWidthAndHe4.heightFn,
+      widthFn = _mockClientWidthAndHe4.widthFn;
+    renderHelper({
+      cache: cache,
+      parent: parent
+    });
+    renderHelper({
+      cache: cache,
+      parent: parent
+    });
+    expect(parent.invalidateCellSizeAfterRender).not.toHaveBeenCalled();
+    expect(heightFn).toHaveBeenCalledTimes(0);
+    expect(widthFn).toHaveBeenCalledTimes(0);
+  });
+  it('registerChild() should measure content that is not already in the cache', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    var parent = createParent({
+      cache: cache
+    });
+    var element = document.createElement('div');
+    var _mockClientWidthAndHe5 = mockClientWidthAndHeight({
+        height: 20,
+        width: 100
+      }, element),
+      heightFn = _mockClientWidthAndHe5.heightFn,
+      widthFn = _mockClientWidthAndHe5.widthFn;
+    expect(heightFn).toHaveBeenCalledTimes(0);
+    expect(widthFn).toHaveBeenCalledTimes(0);
+    expect(cache.has(0, 0)).toBe(false);
+    renderHelper({
+      cache: cache,
+      parent: parent,
+      children: function children(_ref4) {
+        var registerChild = _ref4.registerChild;
+        registerChild(element);
+        return null;
+      }
+    });
+    expect(parent.invalidateCellSizeAfterRender).toHaveBeenCalled();
+    expect(heightFn).toHaveBeenCalledTimes(1);
+    expect(widthFn).toHaveBeenCalledTimes(1);
+    expect(cache.has(0, 0)).toBe(true);
+    expect(cache.getWidth(0, 0)).toBe(100);
+    expect(cache.getHeight(0, 0)).toBe(20);
+  });
+  it('registerChild() should not measure content that is already in the cache', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    cache.set(0, 0, 100, 20);
+    var parent = createParent({
+      cache: cache
+    });
+    var element = document.createElement('div');
+    var _mockClientWidthAndHe6 = mockClientWidthAndHeight({
+        height: 20,
+        width: 100
+      }, element),
+      heightFn = _mockClientWidthAndHe6.heightFn,
+      widthFn = _mockClientWidthAndHe6.widthFn;
+    expect(cache.has(0, 0)).toBe(true);
+    renderHelper({
+      cache: cache,
+      parent: parent,
+      children: function children(_ref5) {
+        var registerChild = _ref5.registerChild;
+        registerChild(element);
+        return null;
+      }
+    });
+    expect(parent.invalidateCellSizeAfterRender).not.toHaveBeenCalled();
+    expect(heightFn).toHaveBeenCalledTimes(0);
+    expect(widthFn).toHaveBeenCalledTimes(0);
+  });
+  it('should pass a :measure param to a function child', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    var children = jest.fn().mockReturnValue(/*#__PURE__*/React.createElement("div", null));
+    renderHelper({
+      cache: cache,
+      children: children
+    });
+    expect(children).toHaveBeenCalled();
+    var params = children.mock.calls[0][0];
+    expect(typeof params.measure === 'function').toBe(true);
+  });
+  it('should still update cache without a parent Grid', function () {
+    jest.spyOn(console, 'warn');
+    mockClientWidthAndHeight({
+      height: 20,
+      width: 100
+    });
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    renderHelper({
+      cache: cache
+    }); // No parent Grid
+
+    expect(cache.has(0, 0)).toBe(true);
+    expect(console.warn).not.toHaveBeenCalled();
+  });
+
+  // See issue #593
+  it('should explicitly set width/height style to "auto" before re-measuring', function () {
+    var cache = new CellMeasurerCache({
+      fixedWidth: true
+    });
+    var parent = createParent({
+      cache: cache
+    });
+    var child = jest.fn().mockReturnValue(/*#__PURE__*/React.createElement("div", {
+      style: {
+        width: 100,
+        height: 30
+      }
+    }));
+    var measurer;
+    var node = findDOMNode(render(/*#__PURE__*/React.createElement(CellMeasurer, {
+      ref: function ref(_ref6) {
+        measurer = _ref6;
+      },
+      cache: cache,
+      columnIndex: 0,
+      parent: parent,
+      rowIndex: 0,
+      style: {}
+    }, child)));
+    var styleHeights = [30];
+    var styleWidths = [100];
+    Object.defineProperties(node.style, {
+      height: {
+        get: function get() {
+          return styleHeights[styleHeights.length - 1];
+        },
+        set: function set(value) {
+          return styleHeights.push(value);
+        }
+      },
+      width: {
+        get: function get() {
+          return styleWidths[styleWidths.length - 1];
+        },
+        set: function set(value) {
+          return styleWidths.push(value);
+        }
+      }
+    });
+    var _measurer$_getCellMea = measurer._getCellMeasurements(node),
+      height = _measurer$_getCellMea.height,
+      width = _measurer$_getCellMea.width;
+    expect(height).toBeGreaterThan(0);
+    expect(width).toBeGreaterThan(0);
+    expect(styleHeights).toEqual([30, 'auto', 30]);
+    expect(styleWidths).toEqual([100, 100]);
+  });
+
+  // See issue #660
+  it('should reset width/height style values after measuring with style "auto"', function () {
+    var cache = new CellMeasurerCache({
+      fixedHeight: true
+    });
+    var parent = createParent({
+      cache: cache
+    });
+    var child = jest.fn().mockReturnValue(/*#__PURE__*/React.createElement("div", {
+      style: {
+        width: 100,
+        height: 30
+      }
+    }));
+    var node = findDOMNode(render(/*#__PURE__*/React.createElement(CellMeasurer, {
+      cache: cache,
+      columnIndex: 0,
+      parent: parent,
+      rowIndex: 0,
+      style: {}
+    }, child)));
+    node.style.width = 200;
+    node.style.height = 60;
+    child.mock.calls[0][0].measure();
+    expect(node.style.height).toBe('30px');
+    expect(node.style.width).toBe('100px');
+  });
+});

package/dist/es/CellMeasurer/CellMeasurer.js

@@ -0,0 +1,187 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import * as React from 'react';
+/*:: import type {CellMeasureCache} from './types';*/
+import { cloneElement } from 'react';
+/*:: type Children = (params: {measure: () => void}) => React.Element<*>;*/
+/*:: type Cell = {
+  columnIndex: number,
+  rowIndex: number,
+};*/
+/*:: type Props = {
+  cache: CellMeasureCache,
+  children: Children | React.Element<*>,
+  columnIndex?: number,
+  index?: number,
+  parent: {
+    invalidateCellSizeAfterRender?: (cell: Cell) => void,
+    recomputeGridSize?: (cell: Cell) => void,
+  },
+  rowIndex?: number,
+};*/
+/**
+ * Wraps a cell and measures its rendered content.
+ * Measurements are stored in a per-cell cache.
+ * Cached-content is not be re-measured.
+ */
+var CellMeasurer = /*#__PURE__*/function (_React$PureComponent) {
+  function CellMeasurer() {
+    var _this;
+    _classCallCheck(this, CellMeasurer);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, CellMeasurer, [].concat(args));
+    _defineProperty(_this, "_child", /*#__PURE__*/React.createRef());
+    _defineProperty(_this, "_measure", function () {
+      var _this$props = _this.props,
+        cache = _this$props.cache,
+        _this$props$columnInd = _this$props.columnIndex,
+        columnIndex = _this$props$columnInd === void 0 ? 0 : _this$props$columnInd,
+        parent = _this$props.parent,
+        _this$props$rowIndex = _this$props.rowIndex,
+        rowIndex = _this$props$rowIndex === void 0 ? _this.props.index || 0 : _this$props$rowIndex;
+      var _this$_getCellMeasure = _this._getCellMeasurements(),
+        height = _this$_getCellMeasure.height,
+        width = _this$_getCellMeasure.width;
+      if (height !== cache.getHeight(rowIndex, columnIndex) || width !== cache.getWidth(rowIndex, columnIndex)) {
+        cache.set(rowIndex, columnIndex, width, height);
+        if (parent && typeof parent.recomputeGridSize === 'function') {
+          parent.recomputeGridSize({
+            columnIndex: columnIndex,
+            rowIndex: rowIndex
+          });
+        }
+      }
+    });
+    _defineProperty(_this, "_registerChild", function (element) {
+      if (element && !(element instanceof Element)) {
+        console.warn('CellMeasurer registerChild expects to be passed Element or null');
+      }
+      _this._child.current = element;
+      if (element) {
+        _this._maybeMeasureCell();
+      }
+    });
+    return _this;
+  }
+  _inherits(CellMeasurer, _React$PureComponent);
+  return _createClass(CellMeasurer, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this._maybeMeasureCell();
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      this._maybeMeasureCell();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+      var children = this.props.children;
+      var resolvedChildren = typeof children === 'function' ? children({
+        measure: this._measure,
+        registerChild: this._registerChild
+      }) : children;
+      if (resolvedChildren === null) {
+        return resolvedChildren;
+      }
+      return /*#__PURE__*/cloneElement(resolvedChildren, {
+        ref: function ref(node) {
+          if (typeof resolvedChildren.ref === 'function') {
+            resolvedChildren.ref(node);
+          } else if (resolvedChildren.ref) {
+            resolvedChildren.ref.current = node;
+          }
+          _this2._child.current = node;
+        }
+      });
+    }
+  }, {
+    key: "_getCellMeasurements",
+    value: function _getCellMeasurements() {
+      var cache = this.props.cache;
+      var node = this._child.current;
+
+      // TODO Check for a bad combination of fixedWidth and missing numeric width or vice versa with height
+
+      if (node && node.ownerDocument && node.ownerDocument.defaultView && node instanceof node.ownerDocument.defaultView.HTMLElement) {
+        var styleWidth = node.style.width;
+        var styleHeight = node.style.height;
+
+        // If we are re-measuring a cell that has already been measured,
+        // It will have a hard-coded width/height from the previous measurement.
+        // The fact that we are measuring indicates this measurement is probably stale,
+        // So explicitly clear it out (eg set to "auto") so we can recalculate.
+        // See issue #593 for more info.
+        // Even if we are measuring initially- if we're inside of a MultiGrid component,
+        // Explicitly clear width/height before measuring to avoid being tainted by another Grid.
+        // eg top/left Grid renders before bottom/right Grid
+        // Since the CellMeasurerCache is shared between them this taints derived cell size values.
+        if (!cache.hasFixedWidth()) {
+          node.style.width = 'auto';
+        }
+        if (!cache.hasFixedHeight()) {
+          node.style.height = 'auto';
+        }
+        var height = Math.ceil(node.offsetHeight);
+        var width = Math.ceil(node.offsetWidth);
+
+        // Reset after measuring to avoid breaking styles; see #660
+        if (styleWidth) {
+          node.style.width = styleWidth;
+        }
+        if (styleHeight) {
+          node.style.height = styleHeight;
+        }
+        return {
+          height: height,
+          width: width
+        };
+      } else {
+        return {
+          height: 0,
+          width: 0
+        };
+      }
+    }
+  }, {
+    key: "_maybeMeasureCell",
+    value: function _maybeMeasureCell() {
+      var _this$props2 = this.props,
+        cache = _this$props2.cache,
+        _this$props2$columnIn = _this$props2.columnIndex,
+        columnIndex = _this$props2$columnIn === void 0 ? 0 : _this$props2$columnIn,
+        parent = _this$props2.parent,
+        _this$props2$rowIndex = _this$props2.rowIndex,
+        rowIndex = _this$props2$rowIndex === void 0 ? this.props.index || 0 : _this$props2$rowIndex;
+      if (!cache.has(rowIndex, columnIndex)) {
+        var _this$_getCellMeasure2 = this._getCellMeasurements(),
+          height = _this$_getCellMeasure2.height,
+          width = _this$_getCellMeasure2.width;
+        cache.set(rowIndex, columnIndex, width, height);
+
+        // If size has changed, let Grid know to re-render.
+        if (parent && typeof parent.invalidateCellSizeAfterRender === 'function') {
+          parent.invalidateCellSizeAfterRender({
+            columnIndex: columnIndex,
+            rowIndex: rowIndex
+          });
+        }
+      }
+    }
+  }]);
+}(React.PureComponent); // Used for DEV mode warning check
+_defineProperty(CellMeasurer, "__internalCellMeasurerFlag", false);
+export { CellMeasurer as default };
+if (process.env.NODE_ENV !== 'production') {
+  CellMeasurer.__internalCellMeasurerFlag = true;
+}