react-virtualized
Version:
React components for efficiently rendering large, scrollable lists and tabular data
894 lines (890 loc) • 120 kB
JavaScript
!function(root, factory) {
"object" == typeof exports && "object" == typeof module ? module.exports = factory(require("react"), require("react-dom")) : "function" == typeof define && define.amd ? define([ "react", "react-dom" ], factory) : "object" == typeof exports ? exports.ReactVirtualized = factory(require("react"), require("react-dom")) : root.ReactVirtualized = factory(root.React, root.ReactDOM);
}(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_26__) {
/******/
return function(modules) {
/******/
/******/
// The require function
/******/
function __webpack_require__(moduleId) {
/******/
/******/
// Check if module is in cache
/******/
if (installedModules[moduleId]) /******/
return installedModules[moduleId].exports;
/******/
/******/
// Create a new module (and put it into the cache)
/******/
var module = installedModules[moduleId] = {
/******/
exports: {},
/******/
id: moduleId,
/******/
loaded: !1
};
/******/
/******/
// Return the exports of the module
/******/
/******/
/******/
// Execute the module function
/******/
/******/
/******/
// Flag the module as loaded
/******/
return modules[moduleId].call(module.exports, module, module.exports, __webpack_require__),
module.loaded = !0, module.exports;
}
// webpackBootstrap
/******/
// The module cache
/******/
var installedModules = {};
/******/
/******/
// Load entry module and return exports
/******/
/******/
/******/
/******/
// expose the modules object (__webpack_modules__)
/******/
/******/
/******/
// expose the module cache
/******/
/******/
/******/
// __webpack_public_path__
/******/
return __webpack_require__.m = modules, __webpack_require__.c = installedModules,
__webpack_require__.p = "", __webpack_require__(0);
}([ /* 0 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
});
var _ArrowKeyStepper = __webpack_require__(1);
Object.defineProperty(exports, "ArrowKeyStepper", {
enumerable: !0,
get: function() {
return _ArrowKeyStepper.ArrowKeyStepper;
}
});
var _AutoSizer = __webpack_require__(7);
Object.defineProperty(exports, "AutoSizer", {
enumerable: !0,
get: function() {
return _AutoSizer.AutoSizer;
}
});
var _ColumnSizer = __webpack_require__(10);
Object.defineProperty(exports, "ColumnSizer", {
enumerable: !0,
get: function() {
return _ColumnSizer.ColumnSizer;
}
});
var _FlexTable = __webpack_require__(21);
Object.defineProperty(exports, "FlexTable", {
enumerable: !0,
get: function() {
return _FlexTable.FlexTable;
}
}), Object.defineProperty(exports, "FlexColumn", {
enumerable: !0,
get: function() {
return _FlexTable.FlexColumn;
}
}), Object.defineProperty(exports, "SortDirection", {
enumerable: !0,
get: function() {
return _FlexTable.SortDirection;
}
}), Object.defineProperty(exports, "SortIndicator", {
enumerable: !0,
get: function() {
return _FlexTable.SortIndicator;
}
});
var _Grid = __webpack_require__(12);
Object.defineProperty(exports, "Grid", {
enumerable: !0,
get: function() {
return _Grid.Grid;
}
});
var _InfiniteLoader = __webpack_require__(27);
Object.defineProperty(exports, "InfiniteLoader", {
enumerable: !0,
get: function() {
return _InfiniteLoader.InfiniteLoader;
}
});
var _ScrollSync = __webpack_require__(29);
Object.defineProperty(exports, "ScrollSync", {
enumerable: !0,
get: function() {
return _ScrollSync.ScrollSync;
}
});
var _VirtualScroll = __webpack_require__(31);
Object.defineProperty(exports, "VirtualScroll", {
enumerable: !0,
get: function() {
return _VirtualScroll.VirtualScroll;
}
});
}, /* 1 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.ArrowKeyStepper = exports["default"] = void 0;
var _ArrowKeyStepper2 = __webpack_require__(2), _ArrowKeyStepper3 = _interopRequireDefault(_ArrowKeyStepper2);
exports["default"] = _ArrowKeyStepper3["default"], exports.ArrowKeyStepper = _ArrowKeyStepper3["default"];
}, /* 2 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) throw new TypeError("Cannot call a class as a function");
}
function _possibleConstructorReturn(self, call) {
if (!self) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return !call || "object" != typeof call && "function" != typeof call ? self : call;
}
function _inherits(subClass, superClass) {
if ("function" != typeof superClass && null !== superClass) throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: !1,
writable: !0,
configurable: !0
}
}), superClass && (Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass);
}
Object.defineProperty(exports, "__esModule", {
value: !0
});
var _createClass = function() {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || !1, descriptor.configurable = !0,
"value" in descriptor && (descriptor.writable = !0), Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function(Constructor, protoProps, staticProps) {
return protoProps && defineProperties(Constructor.prototype, protoProps), staticProps && defineProperties(Constructor, staticProps),
Constructor;
};
}(), _react = __webpack_require__(3), _react2 = _interopRequireDefault(_react), _reactAddonsShallowCompare = __webpack_require__(4), _reactAddonsShallowCompare2 = _interopRequireDefault(_reactAddonsShallowCompare), ArrowKeyStepper = function(_Component) {
function ArrowKeyStepper(props, context) {
_classCallCheck(this, ArrowKeyStepper);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(ArrowKeyStepper).call(this, props, context));
return _this.state = {
scrollToColumn: 0,
scrollToRow: 0
}, _this._columnStartIndex = 0, _this._columnStopIndex = 0, _this._rowStartIndex = 0,
_this._rowStopIndex = 0, _this._onKeyDown = _this._onKeyDown.bind(_this), _this._onSectionRendered = _this._onSectionRendered.bind(_this),
_this;
}
return _inherits(ArrowKeyStepper, _Component), _createClass(ArrowKeyStepper, [ {
key: "render",
value: function() {
var _props = this.props, className = _props.className, children = _props.children, _state = this.state, scrollToColumn = _state.scrollToColumn, scrollToRow = _state.scrollToRow;
return _react2["default"].createElement("div", {
className: className,
onKeyDown: this._onKeyDown
}, children({
onSectionRendered: this._onSectionRendered,
scrollToColumn: scrollToColumn,
scrollToRow: scrollToRow
}));
}
}, {
key: "shouldComponentUpdate",
value: function(nextProps, nextState) {
return (0, _reactAddonsShallowCompare2["default"])(this, nextProps, nextState);
}
}, {
key: "_onKeyDown",
value: function(event) {
var _props2 = this.props, columnsCount = _props2.columnsCount, rowsCount = _props2.rowsCount;
switch (event.key) {
case "ArrowDown":
event.preventDefault(), this.setState({
scrollToRow: Math.min(this._rowStopIndex + 1, rowsCount - 1)
});
break;
case "ArrowLeft":
event.preventDefault(), this.setState({
scrollToColumn: Math.max(this._columnStartIndex - 1, 0)
});
break;
case "ArrowRight":
event.preventDefault(), this.setState({
scrollToColumn: Math.min(this._columnStopIndex + 1, columnsCount - 1)
});
break;
case "ArrowUp":
event.preventDefault(), this.setState({
scrollToRow: Math.max(this._rowStartIndex - 1, 0)
});
}
}
}, {
key: "_onSectionRendered",
value: function(_ref) {
var columnStartIndex = _ref.columnStartIndex, columnStopIndex = _ref.columnStopIndex, rowStartIndex = _ref.rowStartIndex, rowStopIndex = _ref.rowStopIndex;
this._columnStartIndex = columnStartIndex, this._columnStopIndex = columnStopIndex,
this._rowStartIndex = rowStartIndex, this._rowStopIndex = rowStopIndex;
}
} ]), ArrowKeyStepper;
}(_react.Component);
ArrowKeyStepper.propTypes = {
children: _react.PropTypes.func.isRequired,
className: _react.PropTypes.string,
columnsCount: _react.PropTypes.number.isRequired,
rowsCount: _react.PropTypes.number.isRequired
}, exports["default"] = ArrowKeyStepper;
}, /* 3 */
/***/
function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_3__;
}, /* 4 */
/***/
function(module, exports, __webpack_require__) {
module.exports = __webpack_require__(5);
}, /* 5 */
/***/
function(module, exports, __webpack_require__) {
/**
* Copyright 2013-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule shallowCompare
*/
"use strict";
/**
* Does a shallow comparison for props and state.
* See ReactComponentWithPureRenderMixin
*/
function shallowCompare(instance, nextProps, nextState) {
return !shallowEqual(instance.props, nextProps) || !shallowEqual(instance.state, nextState);
}
var shallowEqual = __webpack_require__(6);
module.exports = shallowCompare;
}, /* 6 */
/***/
function(module, exports) {
/**
* Copyright 2013-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule shallowEqual
* @typechecks
*
*/
"use strict";
/**
* Performs equality by iterating through keys on an object and returning false
* when any key has values which are not strictly equal between the arguments.
* Returns true when the values of all keys are strictly equal.
*/
function shallowEqual(objA, objB) {
if (objA === objB) return !0;
if ("object" != typeof objA || null === objA || "object" != typeof objB || null === objB) return !1;
var keysA = Object.keys(objA), keysB = Object.keys(objB);
if (keysA.length !== keysB.length) return !1;
for (var bHasOwnProperty = hasOwnProperty.bind(objB), i = 0; i < keysA.length; i++) if (!bHasOwnProperty(keysA[i]) || objA[keysA[i]] !== objB[keysA[i]]) return !1;
return !0;
}
var hasOwnProperty = Object.prototype.hasOwnProperty;
module.exports = shallowEqual;
}, /* 7 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.AutoSizer = exports["default"] = void 0;
var _AutoSizer2 = __webpack_require__(8), _AutoSizer3 = _interopRequireDefault(_AutoSizer2);
exports["default"] = _AutoSizer3["default"], exports.AutoSizer = _AutoSizer3["default"];
}, /* 8 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) throw new TypeError("Cannot call a class as a function");
}
function _possibleConstructorReturn(self, call) {
if (!self) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return !call || "object" != typeof call && "function" != typeof call ? self : call;
}
function _inherits(subClass, superClass) {
if ("function" != typeof superClass && null !== superClass) throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: !1,
writable: !0,
configurable: !0
}
}), superClass && (Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass);
}
Object.defineProperty(exports, "__esModule", {
value: !0
});
var _createClass = function() {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || !1, descriptor.configurable = !0,
"value" in descriptor && (descriptor.writable = !0), Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function(Constructor, protoProps, staticProps) {
return protoProps && defineProperties(Constructor.prototype, protoProps), staticProps && defineProperties(Constructor, staticProps),
Constructor;
};
}(), _react = __webpack_require__(3), _react2 = _interopRequireDefault(_react), _reactAddonsShallowCompare = __webpack_require__(4), _reactAddonsShallowCompare2 = _interopRequireDefault(_reactAddonsShallowCompare), AutoSizer = function(_Component) {
function AutoSizer(props) {
_classCallCheck(this, AutoSizer);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(AutoSizer).call(this, props));
return _this.state = {
height: 0,
width: 0
}, _this._onResize = _this._onResize.bind(_this), _this._onScroll = _this._onScroll.bind(_this),
_this._setRef = _this._setRef.bind(_this), _this;
}
return _inherits(AutoSizer, _Component), _createClass(AutoSizer, [ {
key: "componentDidMount",
value: function() {
this._detectElementResize = __webpack_require__(9), this._detectElementResize.addResizeListener(this._parentNode, this._onResize),
this._onResize();
}
}, {
key: "componentWillUnmount",
value: function() {
this._detectElementResize.removeResizeListener(this._parentNode, this._onResize);
}
}, {
key: "render",
value: function() {
var _props = this.props, children = _props.children, disableHeight = _props.disableHeight, disableWidth = _props.disableWidth, _state = this.state, height = _state.height, width = _state.width, outerStyle = {
overflow: "visible"
};
return disableHeight || (outerStyle.height = 0), disableWidth || (outerStyle.width = 0),
_react2["default"].createElement("div", {
ref: this._setRef,
onScroll: this._onScroll,
style: outerStyle
}, children({
height: height,
width: width
}));
}
}, {
key: "shouldComponentUpdate",
value: function(nextProps, nextState) {
return (0, _reactAddonsShallowCompare2["default"])(this, nextProps, nextState);
}
}, {
key: "_onResize",
value: function() {
var onResize = this.props.onResize, _parentNode$getBoundi = this._parentNode.getBoundingClientRect(), height = _parentNode$getBoundi.height, width = _parentNode$getBoundi.width, style = getComputedStyle(this._parentNode), paddingLeft = parseInt(style.paddingLeft, 10), paddingRight = parseInt(style.paddingRight, 10), paddingTop = parseInt(style.paddingTop, 10), paddingBottom = parseInt(style.paddingBottom, 10);
this.setState({
height: height - paddingTop - paddingBottom,
width: width - paddingLeft - paddingRight
}), onResize({
height: height,
width: width
});
}
}, {
key: "_onScroll",
value: function(event) {
event.stopPropagation();
}
}, {
key: "_setRef",
value: function(autoSizer) {
this._parentNode = autoSizer && autoSizer.parentNode;
}
} ]), AutoSizer;
}(_react.Component);
AutoSizer.propTypes = {
children: _react.PropTypes.func.isRequired,
disableHeight: _react.PropTypes.bool,
disableWidth: _react.PropTypes.bool,
onResize: _react.PropTypes.func.isRequired
}, AutoSizer.defaultProps = {
onResize: function() {}
}, exports["default"] = AutoSizer;
}, /* 9 */
/***/
function(module, exports) {
"use strict";
var _window;
_window = "undefined" != typeof window ? window : "undefined" != typeof self ? self : void 0;
var attachEvent = "undefined" != typeof document && document.attachEvent, stylesCreated = !1;
if (!attachEvent) {
var requestFrame = function() {
var raf = _window.requestAnimationFrame || _window.mozRequestAnimationFrame || _window.webkitRequestAnimationFrame || function(fn) {
return _window.setTimeout(fn, 20);
};
return function(fn) {
return raf(fn);
};
}(), cancelFrame = function() {
var cancel = _window.cancelAnimationFrame || _window.mozCancelAnimationFrame || _window.webkitCancelAnimationFrame || _window.clearTimeout;
return function(id) {
return cancel(id);
};
}(), resetTriggers = function(element) {
var triggers = element.__resizeTriggers__, expand = triggers.firstElementChild, contract = triggers.lastElementChild, expandChild = expand.firstElementChild;
contract.scrollLeft = contract.scrollWidth, contract.scrollTop = contract.scrollHeight,
expandChild.style.width = expand.offsetWidth + 1 + "px", expandChild.style.height = expand.offsetHeight + 1 + "px",
expand.scrollLeft = expand.scrollWidth, expand.scrollTop = expand.scrollHeight;
}, checkTriggers = function(element) {
return element.offsetWidth != element.__resizeLast__.width || element.offsetHeight != element.__resizeLast__.height;
}, scrollListener = function(e) {
var element = this;
resetTriggers(this), this.__resizeRAF__ && cancelFrame(this.__resizeRAF__), this.__resizeRAF__ = requestFrame(function() {
checkTriggers(element) && (element.__resizeLast__.width = element.offsetWidth, element.__resizeLast__.height = element.offsetHeight,
element.__resizeListeners__.forEach(function(fn) {
fn.call(element, e);
}));
});
}, animation = !1, animationstring = "animation", keyframeprefix = "", animationstartevent = "animationstart", domPrefixes = "Webkit Moz O ms".split(" "), startEvents = "webkitAnimationStart animationstart oAnimationStart MSAnimationStart".split(" "), pfx = "", elm = document.createElement("fakeelement");
if (void 0 !== elm.style.animationName && (animation = !0), animation === !1) for (var i = 0; i < domPrefixes.length; i++) if (void 0 !== elm.style[domPrefixes[i] + "AnimationName"]) {
pfx = domPrefixes[i], animationstring = pfx + "Animation", keyframeprefix = "-" + pfx.toLowerCase() + "-",
animationstartevent = startEvents[i], animation = !0;
break;
}
var animationName = "resizeanim", animationKeyframes = "@" + keyframeprefix + "keyframes " + animationName + " { from { opacity: 0; } to { opacity: 0; } } ", animationStyle = keyframeprefix + "animation: 1ms " + animationName + "; ";
}
var createStyles = function() {
if (!stylesCreated) {
var css = (animationKeyframes ? animationKeyframes : "") + ".resize-triggers { " + (animationStyle ? animationStyle : "") + 'visibility: hidden; opacity: 0; } .resize-triggers, .resize-triggers > div, .contract-trigger:before { content: " "; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; } .resize-triggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }', head = document.head || document.getElementsByTagName("head")[0], style = document.createElement("style");
style.type = "text/css", style.styleSheet ? style.styleSheet.cssText = css : style.appendChild(document.createTextNode(css)),
head.appendChild(style), stylesCreated = !0;
}
}, addResizeListener = function(element, fn) {
attachEvent ? element.attachEvent("onresize", fn) : (element.__resizeTriggers__ || ("static" == getComputedStyle(element).position && (element.style.position = "relative"),
createStyles(), element.__resizeLast__ = {}, element.__resizeListeners__ = [], (element.__resizeTriggers__ = document.createElement("div")).className = "resize-triggers",
element.__resizeTriggers__.innerHTML = '<div class="expand-trigger"><div></div></div><div class="contract-trigger"></div>',
element.appendChild(element.__resizeTriggers__), resetTriggers(element), element.addEventListener("scroll", scrollListener, !0),
animationstartevent && element.__resizeTriggers__.addEventListener(animationstartevent, function(e) {
e.animationName == animationName && resetTriggers(element);
})), element.__resizeListeners__.push(fn));
}, removeResizeListener = function(element, fn) {
attachEvent ? element.detachEvent("onresize", fn) : (element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1),
element.__resizeListeners__.length || (element.removeEventListener("scroll", scrollListener),
element.__resizeTriggers__ = !element.removeChild(element.__resizeTriggers__)));
};
module.exports = {
addResizeListener: addResizeListener,
removeResizeListener: removeResizeListener
};
}, /* 10 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.ColumnSizer = exports["default"] = void 0;
var _ColumnSizer2 = __webpack_require__(11), _ColumnSizer3 = _interopRequireDefault(_ColumnSizer2);
exports["default"] = _ColumnSizer3["default"], exports.ColumnSizer = _ColumnSizer3["default"];
}, /* 11 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) throw new TypeError("Cannot call a class as a function");
}
function _possibleConstructorReturn(self, call) {
if (!self) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return !call || "object" != typeof call && "function" != typeof call ? self : call;
}
function _inherits(subClass, superClass) {
if ("function" != typeof superClass && null !== superClass) throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: !1,
writable: !0,
configurable: !0
}
}), superClass && (Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass);
}
Object.defineProperty(exports, "__esModule", {
value: !0
});
var _createClass = function() {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || !1, descriptor.configurable = !0,
"value" in descriptor && (descriptor.writable = !0), Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function(Constructor, protoProps, staticProps) {
return protoProps && defineProperties(Constructor.prototype, protoProps), staticProps && defineProperties(Constructor, staticProps),
Constructor;
};
}(), _react = __webpack_require__(3), _reactAddonsShallowCompare = __webpack_require__(4), _reactAddonsShallowCompare2 = _interopRequireDefault(_reactAddonsShallowCompare), _Grid = __webpack_require__(12), _Grid2 = _interopRequireDefault(_Grid), ColumnSizer = function(_Component) {
function ColumnSizer(props, context) {
_classCallCheck(this, ColumnSizer);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(ColumnSizer).call(this, props, context));
return _this._registerChild = _this._registerChild.bind(_this), _this;
}
return _inherits(ColumnSizer, _Component), _createClass(ColumnSizer, [ {
key: "componentDidUpdate",
value: function(prevProps, prevState) {
var _props = this.props, columnMaxWidth = _props.columnMaxWidth, columnMinWidth = _props.columnMinWidth, columnsCount = _props.columnsCount, width = _props.width;
columnMaxWidth === prevProps.columnMaxWidth && columnMinWidth === prevProps.columnMinWidth && columnsCount === prevProps.columnsCount && width === prevProps.width || this._registeredChild && this._registeredChild.recomputeGridSize();
}
}, {
key: "render",
value: function() {
var _props2 = this.props, children = _props2.children, columnMaxWidth = _props2.columnMaxWidth, columnMinWidth = _props2.columnMinWidth, columnsCount = _props2.columnsCount, width = _props2.width, safeColumnMinWidth = columnMinWidth || 1, safeColumnMaxWidth = columnMaxWidth ? Math.min(columnMaxWidth, width) : width, columnWidth = width / columnsCount;
columnWidth = Math.max(safeColumnMinWidth, columnWidth), columnWidth = Math.min(safeColumnMaxWidth, columnWidth),
columnWidth = Math.floor(columnWidth);
var adjustedWidth = Math.min(width, columnWidth * columnsCount);
return children({
adjustedWidth: adjustedWidth,
getColumnWidth: function() {
return columnWidth;
},
registerChild: this._registerChild
});
}
}, {
key: "shouldComponentUpdate",
value: function(nextProps, nextState) {
return (0, _reactAddonsShallowCompare2["default"])(this, nextProps, nextState);
}
}, {
key: "_registerChild",
value: function(child) {
if (null !== child && !(child instanceof _Grid2["default"])) throw Error("Unexpected child type registered; only Grid children are supported.");
this._registeredChild = child, this._registeredChild && this._registeredChild.recomputeGridSize();
}
} ]), ColumnSizer;
}(_react.Component);
ColumnSizer.propTypes = {
children: _react.PropTypes.func.isRequired,
columnMaxWidth: _react.PropTypes.number,
columnMinWidth: _react.PropTypes.number,
columnsCount: _react.PropTypes.number.isRequired,
width: _react.PropTypes.number.isRequired
}, exports["default"] = ColumnSizer;
}, /* 12 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.Grid = exports["default"] = void 0;
var _Grid2 = __webpack_require__(13), _Grid3 = _interopRequireDefault(_Grid2);
exports["default"] = _Grid3["default"], exports.Grid = _Grid3["default"];
}, /* 13 */
/***/
function(module, exports, __webpack_require__) {
"use strict";
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) throw new TypeError("Cannot call a class as a function");
}
function _possibleConstructorReturn(self, call) {
if (!self) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return !call || "object" != typeof call && "function" != typeof call ? self : call;
}
function _inherits(subClass, superClass) {
if ("function" != typeof superClass && null !== superClass) throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: !1,
writable: !0,
configurable: !0
}
}), superClass && (Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass);
}
Object.defineProperty(exports, "__esModule", {
value: !0
});
var _createClass = function() {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || !1, descriptor.configurable = !0,
"value" in descriptor && (descriptor.writable = !0), Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function(Constructor, protoProps, staticProps) {
return protoProps && defineProperties(Constructor.prototype, protoProps), staticProps && defineProperties(Constructor, staticProps),
Constructor;
};
}(), _GridUtils = __webpack_require__(14), _classnames = __webpack_require__(15), _classnames2 = _interopRequireDefault(_classnames), _raf = __webpack_require__(16), _raf2 = _interopRequireDefault(_raf), _scrollbarSize = __webpack_require__(19), _scrollbarSize2 = _interopRequireDefault(_scrollbarSize), _react = __webpack_require__(3), _react2 = _interopRequireDefault(_react), _reactAddonsShallowCompare = __webpack_require__(4), _reactAddonsShallowCompare2 = _interopRequireDefault(_reactAddonsShallowCompare), IS_SCROLLING_TIMEOUT = 150, SCROLL_POSITION_CHANGE_REASONS = {
OBSERVED: "observed",
REQUESTED: "requested"
}, Grid = function(_Component) {
function Grid(props, context) {
_classCallCheck(this, Grid);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Grid).call(this, props, context));
return _this.state = {
computeGridMetadataOnNextUpdate: !1,
isScrolling: !1,
scrollLeft: 0,
scrollTop: 0
}, _this._onGridRenderedMemoizer = (0, _GridUtils.createCallbackMemoizer)(), _this._onScrollMemoizer = (0,
_GridUtils.createCallbackMemoizer)(!1), _this._computeGridMetadata = _this._computeGridMetadata.bind(_this),
_this._invokeOnGridRenderedHelper = _this._invokeOnGridRenderedHelper.bind(_this),
_this._onScroll = _this._onScroll.bind(_this), _this._updateScrollLeftForScrollToColumn = _this._updateScrollLeftForScrollToColumn.bind(_this),
_this._updateScrollTopForScrollToRow = _this._updateScrollTopForScrollToRow.bind(_this),
_this;
}
return _inherits(Grid, _Component), _createClass(Grid, [ {
key: "recomputeGridSize",
value: function() {
this.setState({
computeGridMetadataOnNextUpdate: !0
});
}
}, {
key: "componentDidMount",
value: function() {
var _props = this.props, scrollLeft = _props.scrollLeft, scrollToColumn = _props.scrollToColumn, scrollTop = _props.scrollTop, scrollToRow = _props.scrollToRow;
this._scrollbarSize = (0, _scrollbarSize2["default"])(), (scrollLeft >= 0 || scrollTop >= 0) && this._setScrollPosition({
scrollLeft: scrollLeft,
scrollTop: scrollTop
}), (scrollToColumn >= 0 || scrollToRow >= 0) && (this._updateScrollLeftForScrollToColumn(),
this._updateScrollTopForScrollToRow()), this._invokeOnGridRenderedHelper(), this._invokeOnScrollMemoizer({
scrollLeft: scrollLeft || 0,
scrollTop: scrollTop || 0,
totalColumnsWidth: this._getTotalColumnsWidth(),
totalRowsHeight: this._getTotalRowsHeight()
});
}
}, {
key: "componentDidUpdate",
value: function(prevProps, prevState) {
var _props2 = this.props, columnsCount = _props2.columnsCount, columnWidth = _props2.columnWidth, height = _props2.height, rowHeight = _props2.rowHeight, rowsCount = _props2.rowsCount, scrollToColumn = _props2.scrollToColumn, scrollToRow = _props2.scrollToRow, width = _props2.width, _state = this.state, scrollLeft = _state.scrollLeft, scrollPositionChangeReason = _state.scrollPositionChangeReason, scrollTop = _state.scrollTop;
scrollPositionChangeReason === SCROLL_POSITION_CHANGE_REASONS.REQUESTED && (scrollLeft >= 0 && scrollLeft !== prevState.scrollLeft && scrollLeft !== this.refs.scrollingContainer.scrollLeft && (this.refs.scrollingContainer.scrollLeft = scrollLeft),
scrollTop >= 0 && scrollTop !== prevState.scrollTop && scrollTop !== this.refs.scrollingContainer.scrollTop && (this.refs.scrollingContainer.scrollTop = scrollTop)),
(0, _GridUtils.updateScrollIndexHelper)({
cellsCount: columnsCount,
cellMetadata: this._columnMetadata,
cellSize: columnWidth,
previousCellsCount: prevProps.columnsCount,
previousCellSize: prevProps.columnWidth,
previousScrollToIndex: prevProps.scrollToColumn,
previousSize: prevProps.width,
scrollOffset: scrollLeft,
scrollToIndex: scrollToColumn,
size: width,
updateScrollIndexCallback: this._updateScrollLeftForScrollToColumn
}), (0, _GridUtils.updateScrollIndexHelper)({
cellsCount: rowsCount,
cellMetadata: this._rowMetadata,
cellSize: rowHeight,
previousCellsCount: prevProps.rowsCount,
previousCellSize: prevProps.rowHeight,
previousScrollToIndex: prevProps.scrollToRow,
previousSize: prevProps.height,
scrollOffset: scrollTop,
scrollToIndex: scrollToRow,
size: height,
updateScrollIndexCallback: this._updateScrollTopForScrollToRow
}), this._invokeOnGridRenderedHelper();
}
}, {
key: "componentWillMount",
value: function() {
this._computeGridMetadata(this.props);
}
}, {
key: "componentWillUnmount",
value: function() {
this._disablePointerEventsTimeoutId && clearTimeout(this._disablePointerEventsTimeoutId),
this._setNextStateAnimationFrameId && _raf2["default"].cancel(this._setNextStateAnimationFrameId);
}
}, {
key: "componentWillUpdate",
value: function(nextProps, nextState) {
0 === nextProps.columnsCount && 0 !== nextState.scrollLeft || 0 === nextProps.rowsCount && 0 !== nextState.scrollTop ? this._setScrollPosition({
scrollLeft: 0,
scrollTop: 0
}) : nextProps.scrollLeft === this.props.scrollLeft && nextProps.scrollTop === this.props.scrollTop || this._setScrollPosition({
scrollLeft: nextProps.scrollLeft,
scrollTop: nextProps.scrollTop
}), (0, _GridUtils.computeCellMetadataAndUpdateScrollOffsetHelper)({
cellsCount: this.props.columnsCount,
cellSize: this.props.columnWidth,
computeMetadataCallback: this._computeGridMetadata,
computeMetadataCallbackProps: nextProps,
computeMetadataOnNextUpdate: nextState.computeGridMetadataOnNextUpdate,
nextCellsCount: nextProps.columnsCount,
nextCellSize: nextProps.columnWidth,
nextScrollToIndex: nextProps.scrollToColumn,
scrollToIndex: this.props.scrollToColumn,
updateScrollOffsetForScrollToIndex: this._updateScrollLeftForScrollToColumn
}), (0, _GridUtils.computeCellMetadataAndUpdateScrollOffsetHelper)({
cellsCount: this.props.rowsCount,
cellSize: this.props.rowHeight,
computeMetadataCallback: this._computeGridMetadata,
computeMetadataCallbackProps: nextProps,
computeMetadataOnNextUpdate: nextState.computeGridMetadataOnNextUpdate,
nextCellsCount: nextProps.rowsCount,
nextCellSize: nextProps.rowHeight,
nextScrollToIndex: nextProps.scrollToRow,
scrollToIndex: this.props.scrollToRow,
updateScrollOffsetForScrollToIndex: this._updateScrollTopForScrollToRow
}), this.setState({
computeGridMetadataOnNextUpdate: !1
});
}
}, {
key: "render",
value: function() {
var _props3 = this.props, className = _props3.className, columnsCount = _props3.columnsCount, height = _props3.height, noContentRenderer = _props3.noContentRenderer, overscanColumnsCount = _props3.overscanColumnsCount, overscanRowsCount = _props3.overscanRowsCount, renderCell = _props3.renderCell, rowsCount = _props3.rowsCount, width = _props3.width, _state2 = this.state, isScrolling = _state2.isScrolling, scrollLeft = _state2.scrollLeft, scrollTop = _state2.scrollTop, childrenToDisplay = [];
if (height > 0 && width > 0) {
var visibleColumnIndices = (0, _GridUtils.getVisibleCellIndices)({
cellsCount: columnsCount,
cellMetadata: this._columnMetadata,
containerSize: width,
currentOffset: scrollLeft
}), visibleRowIndices = (0, _GridUtils.getVisibleCellIndices)({
cellsCount: rowsCount,
cellMetadata: this._rowMetadata,
containerSize: height,
currentOffset: scrollTop
});
this._renderedColumnStartIndex = visibleColumnIndices.start, this._renderedColumnStopIndex = visibleColumnIndices.stop,
this._renderedRowStartIndex = visibleRowIndices.start, this._renderedRowStopIndex = visibleRowIndices.stop;
var overscanColumnIndices = (0, _GridUtils.getOverscanIndices)({
cellsCount: columnsCount,
overscanCellsCount: overscanColumnsCount,
startIndex: this._renderedColumnStartIndex,
stopIndex: this._renderedColumnStopIndex
}), overscanRowIndices = (0, _GridUtils.getOverscanIndices)({
cellsCount: rowsCount,
overscanCellsCount: overscanRowsCount,
startIndex: this._renderedRowStartIndex,
stopIndex: this._renderedRowStopIndex
});
this._columnStartIndex = overscanColumnIndices.overscanStartIndex, this._columnStopIndex = overscanColumnIndices.overscanStopIndex,
this._rowStartIndex = overscanRowIndices.overscanStartIndex, this._rowStopIndex = overscanRowIndices.overscanStopIndex;
for (var rowIndex = this._rowStartIndex; rowIndex <= this._rowStopIndex; rowIndex++) for (var rowDatum = this._rowMetadata[rowIndex], columnIndex = this._columnStartIndex; columnIndex <= this._columnStopIndex; columnIndex++) {
var columnDatum = this._columnMetadata[columnIndex], renderedCell = renderCell({
columnIndex: columnIndex,
rowIndex: rowIndex
}), key = rowIndex + "-" + columnIndex;
if (null != renderedCell && renderedCell !== !1) {
var child = _react2["default"].createElement("div", {
key: key,
className: "Grid__cell",
style: {
height: this._getRowHeight(rowIndex),
left: columnDatum.offset + "px",
top: rowDatum.offset + "px",
width: this._getColumnWidth(columnIndex)
}
}, renderedCell);
childrenToDisplay.push(child);
}
}
}
var gridStyle = {
height: height,
width: width
}, totalColumnsWidth = this._getTotalColumnsWidth(), totalRowsHeight = this._getTotalRowsHeight();
return width >= totalColumnsWidth && (gridStyle.overflowX = "hidden"), height >= totalRowsHeight && (gridStyle.overflowY = "hidden"),
_react2["default"].createElement("div", {
ref: "scrollingContainer",
className: (0, _classnames2["default"])("Grid", className),
onScroll: this._onScroll,
tabIndex: 0,
style: gridStyle
}, childrenToDisplay.length > 0 && _react2["default"].createElement("div", {
className: "Grid__innerScrollContainer",
style: {
width: totalColumnsWidth,
height: totalRowsHeight,
maxWidth: totalColumnsWidth,
maxHeight: totalRowsHeight,
pointerEvents: isScrolling ? "none" : "auto"
}
}, childrenToDisplay), 0 === childrenToDisplay.length && noContentRenderer());
}
}, {
key: "shouldComponentUpdate",
value: function(nextProps, nextState) {
return (0, _reactAddonsShallowCompare2["default"])(this, nextProps, nextState);
}
}, {
key: "_computeGridMetadata",
value: function(props) {
var columnsCount = props.columnsCount, columnWidth = props.columnWidth, rowHeight = props.rowHeight, rowsCount = props.rowsCount;
this._columnMetadata = (0, _GridUtils.initCellMetadata)({