芝麻web文件管理V1.00
编辑当前文件:/home/freeclou/app.optimyar.com/backend/node_modules/react-virtualized/dist/commonjs/Grid/Grid.js
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard"); Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = exports.DEFAULT_SCROLLING_RESET_TIME_INTERVAL = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")); var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")); var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized")); var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var React = _interopRequireWildcard(require("react")); var _clsx = _interopRequireDefault(require("clsx")); var _calculateSizeAndPositionDataAndUpdateScrollOffset = _interopRequireDefault(require("./utils/calculateSizeAndPositionDataAndUpdateScrollOffset")); var _ScalingCellSizeAndPositionManager = _interopRequireDefault(require("./utils/ScalingCellSizeAndPositionManager")); var _createCallbackMemoizer = _interopRequireDefault(require("../utils/createCallbackMemoizer")); var _defaultOverscanIndicesGetter = _interopRequireWildcard(require("./defaultOverscanIndicesGetter")); var _updateScrollIndexHelper = _interopRequireDefault(require("./utils/updateScrollIndexHelper")); var _defaultCellRangeRenderer = _interopRequireDefault(require("./defaultCellRangeRenderer")); var _scrollbarSize = _interopRequireDefault(require("dom-helpers/scrollbarSize")); var _reactLifecyclesCompat = require("react-lifecycles-compat"); var _requestAnimationTimeout = require("../utils/requestAnimationTimeout"); var _types = require("./types"); var _propTypes = _interopRequireDefault(require("prop-types")); var _class, _temp; function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } /** * Specifies the number of milliseconds during which to disable pointer events while a scroll is in progress. * This improves performance and makes scrolling smoother. */ var DEFAULT_SCROLLING_RESET_TIME_INTERVAL = 150; /** * Controls whether the Grid updates the DOM element's scrollLeft/scrollTop based on the current state or just observes it. * This prevents Grid from interrupting mouse-wheel animations (see issue #2). */ exports.DEFAULT_SCROLLING_RESET_TIME_INTERVAL = DEFAULT_SCROLLING_RESET_TIME_INTERVAL; var SCROLL_POSITION_CHANGE_REASONS = { OBSERVED: 'observed', REQUESTED: 'requested' }; var renderNull = function renderNull() { return null; }; /** * Renders tabular data with virtualization along the vertical and horizontal axes. * Row heights and column widths must be known ahead of time and specified as properties. */ var Grid = (_temp = _class = /*#__PURE__*/ function (_React$PureComponent) { (0, _inherits2["default"])(Grid, _React$PureComponent); // Invokes onSectionRendered callback only when start/stop row or column indices change function Grid(props) { var _this; (0, _classCallCheck2["default"])(this, Grid); _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(Grid).call(this, props)); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_onGridRenderedMemoizer", (0, _createCallbackMemoizer["default"])()); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_onScrollMemoizer", (0, _createCallbackMemoizer["default"])(false)); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_deferredInvalidateColumnIndex", null); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_deferredInvalidateRowIndex", null); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_recomputeScrollLeftFlag", false); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_recomputeScrollTopFlag", false); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_horizontalScrollBarSize", 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_verticalScrollBarSize", 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_scrollbarPresenceChanged", false); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_scrollingContainer", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_childrenToDisplay", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_columnStartIndex", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_columnStopIndex", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_rowStartIndex", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_rowStopIndex", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_renderedColumnStartIndex", 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_renderedColumnStopIndex", 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_renderedRowStartIndex", 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_renderedRowStopIndex", 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_initialScrollTop", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_initialScrollLeft", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_disablePointerEventsTimeoutId", void 0); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_styleCache", {}); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_cellCache", {}); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_debounceScrollEndedCallback", function () { _this._disablePointerEventsTimeoutId = null; // isScrolling is used to determine if we reset styleCache _this.setState({ isScrolling: false, needToResetStyleCache: false }); }); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_invokeOnGridRenderedHelper", function () { var onSectionRendered = _this.props.onSectionRendered; _this._onGridRenderedMemoizer({ callback: onSectionRendered, indices: { columnOverscanStartIndex: _this._columnStartIndex, columnOverscanStopIndex: _this._columnStopIndex, columnStartIndex: _this._renderedColumnStartIndex, columnStopIndex: _this._renderedColumnStopIndex, rowOverscanStartIndex: _this._rowStartIndex, rowOverscanStopIndex: _this._rowStopIndex, rowStartIndex: _this._renderedRowStartIndex, rowStopIndex: _this._renderedRowStopIndex } }); }); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_setScrollingContainerRef", function (ref) { _this._scrollingContainer = ref; }); (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_onScroll", function (event) { // In certain edge-cases React dispatches an onScroll event with an invalid target.scrollLeft / target.scrollTop. // This invalid event can be detected by comparing event.target to this component's scrollable DOM element. // See issue #404 for more information. if (event.target === _this._scrollingContainer) { _this.handleScrollEvent(event.target); } }); var columnSizeAndPositionManager = new _ScalingCellSizeAndPositionManager["default"]({ cellCount: props.columnCount, cellSizeGetter: function cellSizeGetter(params) { return Grid._wrapSizeGetter(props.columnWidth)(params); }, estimatedCellSize: Grid._getEstimatedColumnSize(props) }); var rowSizeAndPositionManager = new _ScalingCellSizeAndPositionManager["default"]({ cellCount: props.rowCount, cellSizeGetter: function cellSizeGetter(params) { return Grid._wrapSizeGetter(props.rowHeight)(params); }, estimatedCellSize: Grid._getEstimatedRowSize(props) }); _this.state = { instanceProps: { columnSizeAndPositionManager: columnSizeAndPositionManager, rowSizeAndPositionManager: rowSizeAndPositionManager, prevColumnWidth: props.columnWidth, prevRowHeight: props.rowHeight, prevColumnCount: props.columnCount, prevRowCount: props.rowCount, prevIsScrolling: props.isScrolling === true, prevScrollToColumn: props.scrollToColumn, prevScrollToRow: props.scrollToRow, scrollbarSize: 0, scrollbarSizeMeasured: false }, isScrolling: false, scrollDirectionHorizontal: _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD, scrollDirectionVertical: _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD, scrollLeft: 0, scrollTop: 0, scrollPositionChangeReason: null, needToResetStyleCache: false }; if (props.scrollToRow > 0) { _this._initialScrollTop = _this._getCalculatedScrollTop(props, _this.state); } if (props.scrollToColumn > 0) { _this._initialScrollLeft = _this._getCalculatedScrollLeft(props, _this.state); } return _this; } /** * Gets offsets for a given cell and alignment. */ (0, _createClass2["default"])(Grid, [{ key: "getOffsetForCell", value: function getOffsetForCell() { var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, _ref$alignment = _ref.alignment, alignment = _ref$alignment === void 0 ? this.props.scrollToAlignment : _ref$alignment, _ref$columnIndex = _ref.columnIndex, columnIndex = _ref$columnIndex === void 0 ? this.props.scrollToColumn : _ref$columnIndex, _ref$rowIndex = _ref.rowIndex, rowIndex = _ref$rowIndex === void 0 ? this.props.scrollToRow : _ref$rowIndex; var offsetProps = _objectSpread({}, this.props, { scrollToAlignment: alignment, scrollToColumn: columnIndex, scrollToRow: rowIndex }); return { scrollLeft: this._getCalculatedScrollLeft(offsetProps), scrollTop: this._getCalculatedScrollTop(offsetProps) }; } /** * Gets estimated total rows' height. */ }, { key: "getTotalRowsHeight", value: function getTotalRowsHeight() { return this.state.instanceProps.rowSizeAndPositionManager.getTotalSize(); } /** * Gets estimated total columns' width. */ }, { key: "getTotalColumnsWidth", value: function getTotalColumnsWidth() { return this.state.instanceProps.columnSizeAndPositionManager.getTotalSize(); } /** * This method handles a scroll event originating from an external scroll control. * It's an advanced method and should probably not be used unless you're implementing a custom scroll-bar solution. */ }, { key: "handleScrollEvent", value: function handleScrollEvent(_ref2) { var _ref2$scrollLeft = _ref2.scrollLeft, scrollLeftParam = _ref2$scrollLeft === void 0 ? 0 : _ref2$scrollLeft, _ref2$scrollTop = _ref2.scrollTop, scrollTopParam = _ref2$scrollTop === void 0 ? 0 : _ref2$scrollTop; // On iOS, we can arrive at negative offsets by swiping past the start. // To prevent flicker here, we make playing in the negative offset zone cause nothing to happen. if (scrollTopParam < 0) { return; } // Prevent pointer events from interrupting a smooth scroll this._debounceScrollEnded(); var _this$props = this.props, autoHeight = _this$props.autoHeight, autoWidth = _this$props.autoWidth, height = _this$props.height, width = _this$props.width; var instanceProps = this.state.instanceProps; // When this component is shrunk drastically, React dispatches a series of back-to-back scroll events, // Gradually converging on a scrollTop that is within the bounds of the new, smaller height. // This causes a series of rapid renders that is slow for long lists. // We can avoid that by doing some simple bounds checking to ensure that scroll offsets never exceed their bounds. var scrollbarSize = instanceProps.scrollbarSize; var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize(); var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize(); var scrollLeft = Math.min(Math.max(0, totalColumnsWidth - width + scrollbarSize), scrollLeftParam); var scrollTop = Math.min(Math.max(0, totalRowsHeight - height + scrollbarSize), scrollTopParam); // Certain devices (like Apple touchpad) rapid-fire duplicate events. // Don't force a re-render if this is the case. // The mouse may move faster then the animation frame does. // Use requestAnimationFrame to avoid over-updating. if (this.state.scrollLeft !== scrollLeft || this.state.scrollTop !== scrollTop) { // Track scrolling direction so we can more efficiently overscan rows to reduce empty space around the edges while scrolling. // Don't change direction for an axis unless scroll offset has changed. var scrollDirectionHorizontal = scrollLeft !== this.state.scrollLeft ? scrollLeft > this.state.scrollLeft ? _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter.SCROLL_DIRECTION_BACKWARD : this.state.scrollDirectionHorizontal; var scrollDirectionVertical = scrollTop !== this.state.scrollTop ? scrollTop > this.state.scrollTop ? _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter.SCROLL_DIRECTION_BACKWARD : this.state.scrollDirectionVertical; var newState = { isScrolling: true, scrollDirectionHorizontal: scrollDirectionHorizontal, scrollDirectionVertical: scrollDirectionVertical, scrollPositionChangeReason: SCROLL_POSITION_CHANGE_REASONS.OBSERVED }; if (!autoHeight) { newState.scrollTop = scrollTop; } if (!autoWidth) { newState.scrollLeft = scrollLeft; } newState.needToResetStyleCache = false; this.setState(newState); } this._invokeOnScrollMemoizer({ scrollLeft: scrollLeft, scrollTop: scrollTop, totalColumnsWidth: totalColumnsWidth, totalRowsHeight: totalRowsHeight }); } /** * Invalidate Grid size and recompute visible cells. * This is a deferred wrapper for recomputeGridSize(). * It sets a flag to be evaluated on cDM/cDU to avoid unnecessary renders. * This method is intended for advanced use-cases like CellMeasurer. */ // @TODO (bvaughn) Add automated test coverage for this. }, { key: "invalidateCellSizeAfterRender", value: function invalidateCellSizeAfterRender(_ref3) { var columnIndex = _ref3.columnIndex, rowIndex = _ref3.rowIndex; this._deferredInvalidateColumnIndex = typeof this._deferredInvalidateColumnIndex === 'number' ? Math.min(this._deferredInvalidateColumnIndex, columnIndex) : columnIndex; this._deferredInvalidateRowIndex = typeof this._deferredInvalidateRowIndex === 'number' ? Math.min(this._deferredInvalidateRowIndex, rowIndex) : rowIndex; } /** * Pre-measure all columns and rows in a Grid. * Typically cells are only measured as needed and estimated sizes are used for cells that have not yet been measured. * This method ensures that the next call to getTotalSize() returns an exact size (as opposed to just an estimated one). */ }, { key: "measureAllCells", value: function measureAllCells() { var _this$props2 = this.props, columnCount = _this$props2.columnCount, rowCount = _this$props2.rowCount; var instanceProps = this.state.instanceProps; instanceProps.columnSizeAndPositionManager.getSizeAndPositionOfCell(columnCount - 1); instanceProps.rowSizeAndPositionManager.getSizeAndPositionOfCell(rowCount - 1); } /** * Forced recompute of row heights and column widths. * This function should be called if dynamic column or row sizes have changed but nothing else has. * Since Grid only receives :columnCount and :rowCount it has no way of detecting when the underlying data changes. */ }, { key: "recomputeGridSize", value: function recomputeGridSize() { var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, _ref4$columnIndex = _ref4.columnIndex, columnIndex = _ref4$columnIndex === void 0 ? 0 : _ref4$columnIndex, _ref4$rowIndex = _ref4.rowIndex, rowIndex = _ref4$rowIndex === void 0 ? 0 : _ref4$rowIndex; var _this$props3 = this.props, scrollToColumn = _this$props3.scrollToColumn, scrollToRow = _this$props3.scrollToRow; var instanceProps = this.state.instanceProps; instanceProps.columnSizeAndPositionManager.resetCell(columnIndex); instanceProps.rowSizeAndPositionManager.resetCell(rowIndex); // Cell sizes may be determined by a function property. // In this case the cDU handler can't know if they changed. // Store this flag to let the next cDU pass know it needs to recompute the scroll offset. this._recomputeScrollLeftFlag = scrollToColumn >= 0 && (this.state.scrollDirectionHorizontal === _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD ? columnIndex <= scrollToColumn : columnIndex >= scrollToColumn); this._recomputeScrollTopFlag = scrollToRow >= 0 && (this.state.scrollDirectionVertical === _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD ? rowIndex <= scrollToRow : rowIndex >= scrollToRow); // Clear cell cache in case we are scrolling; // Invalid row heights likely mean invalid cached content as well. this._styleCache = {}; this._cellCache = {}; this.forceUpdate(); } /** * Ensure column and row are visible. */ }, { key: "scrollToCell", value: function scrollToCell(_ref5) { var columnIndex = _ref5.columnIndex, rowIndex = _ref5.rowIndex; var columnCount = this.props.columnCount; var props = this.props; // Don't adjust scroll offset for single-column grids (eg List, Table). // This can cause a funky scroll offset because of the vertical scrollbar width. if (columnCount > 1 && columnIndex !== undefined) { this._updateScrollLeftForScrollToColumn(_objectSpread({}, props, { scrollToColumn: columnIndex })); } if (rowIndex !== undefined) { this._updateScrollTopForScrollToRow(_objectSpread({}, props, { scrollToRow: rowIndex })); } } }, { key: "componentDidMount", value: function componentDidMount() { var _this$props4 = this.props, getScrollbarSize = _this$props4.getScrollbarSize, height = _this$props4.height, scrollLeft = _this$props4.scrollLeft, scrollToColumn = _this$props4.scrollToColumn, scrollTop = _this$props4.scrollTop, scrollToRow = _this$props4.scrollToRow, width = _this$props4.width; var instanceProps = this.state.instanceProps; // Reset initial offsets to be ignored in browser this._initialScrollTop = 0; this._initialScrollLeft = 0; // If cell sizes have been invalidated (eg we are using CellMeasurer) then reset cached positions. // We must do this at the start of the method as we may calculate and update scroll position below. this._handleInvalidatedGridSize(); // If this component was first rendered server-side, scrollbar size will be undefined. // In that event we need to remeasure. if (!instanceProps.scrollbarSizeMeasured) { this.setState(function (prevState) { var stateUpdate = _objectSpread({}, prevState, { needToResetStyleCache: false }); stateUpdate.instanceProps.scrollbarSize = getScrollbarSize(); stateUpdate.instanceProps.scrollbarSizeMeasured = true; return stateUpdate; }); } if (typeof scrollLeft === 'number' && scrollLeft >= 0 || typeof scrollTop === 'number' && scrollTop >= 0) { var stateUpdate = Grid._getScrollToPositionStateUpdate({ prevState: this.state, scrollLeft: scrollLeft, scrollTop: scrollTop }); if (stateUpdate) { stateUpdate.needToResetStyleCache = false; this.setState(stateUpdate); } } // refs don't work in `react-test-renderer` if (this._scrollingContainer) { // setting the ref's scrollLeft and scrollTop. // Somehow in MultiGrid the main grid doesn't trigger a update on mount. if (this._scrollingContainer.scrollLeft !== this.state.scrollLeft) { this._scrollingContainer.scrollLeft = this.state.scrollLeft; } if (this._scrollingContainer.scrollTop !== this.state.scrollTop) { this._scrollingContainer.scrollTop = this.state.scrollTop; } } // Don't update scroll offset if the size is 0; we don't render any cells in this case. // Setting a state may cause us to later thing we've updated the offce when we haven't. var sizeIsBiggerThanZero = height > 0 && width > 0; if (scrollToColumn >= 0 && sizeIsBiggerThanZero) { this._updateScrollLeftForScrollToColumn(); } if (scrollToRow >= 0 && sizeIsBiggerThanZero) { this._updateScrollTopForScrollToRow(); } // Update onRowsRendered callback this._invokeOnGridRenderedHelper(); // Initialize onScroll callback this._invokeOnScrollMemoizer({ scrollLeft: scrollLeft || 0, scrollTop: scrollTop || 0, totalColumnsWidth: instanceProps.columnSizeAndPositionManager.getTotalSize(), totalRowsHeight: instanceProps.rowSizeAndPositionManager.getTotalSize() }); this._maybeCallOnScrollbarPresenceChange(); } /** * @private * This method updates scrollLeft/scrollTop in state for the following conditions: * 1) New scroll-to-cell props have been set */ }, { key: "componentDidUpdate", value: function componentDidUpdate(prevProps, prevState) { var _this2 = this; var _this$props5 = this.props, autoHeight = _this$props5.autoHeight, autoWidth = _this$props5.autoWidth, columnCount = _this$props5.columnCount, height = _this$props5.height, rowCount = _this$props5.rowCount, scrollToAlignment = _this$props5.scrollToAlignment, scrollToColumn = _this$props5.scrollToColumn, scrollToRow = _this$props5.scrollToRow, width = _this$props5.width; var _this$state = this.state, scrollLeft = _this$state.scrollLeft, scrollPositionChangeReason = _this$state.scrollPositionChangeReason, scrollTop = _this$state.scrollTop, instanceProps = _this$state.instanceProps; // If cell sizes have been invalidated (eg we are using CellMeasurer) then reset cached positions. // We must do this at the start of the method as we may calculate and update scroll position below. this._handleInvalidatedGridSize(); // Handle edge case where column or row count has only just increased over 0. // In this case we may have to restore a previously-specified scroll offset. // For more info see bvaughn/react-virtualized/issues/218 var columnOrRowCountJustIncreasedFromZero = columnCount > 0 && prevProps.columnCount === 0 || rowCount > 0 && prevProps.rowCount === 0; // Make sure requested changes to :scrollLeft or :scrollTop get applied. // Assigning to scrollLeft/scrollTop tells the browser to interrupt any running scroll animations, // And to discard any pending async changes to the scroll position that may have happened in the meantime (e.g. on a separate scrolling thread). // So we only set these when we require an adjustment of the scroll position. // See issue #2 for more information. if (scrollPositionChangeReason === SCROLL_POSITION_CHANGE_REASONS.REQUESTED) { // @TRICKY :autoHeight and :autoWidth properties instructs Grid to leave :scrollTop and :scrollLeft management to an external HOC (eg WindowScroller). // In this case we should avoid checking scrollingContainer.scrollTop and scrollingContainer.scrollLeft since it forces layout/flow. if (!autoWidth && scrollLeft >= 0 && (scrollLeft !== this._scrollingContainer.scrollLeft || columnOrRowCountJustIncreasedFromZero)) { this._scrollingContainer.scrollLeft = scrollLeft; } if (!autoHeight && scrollTop >= 0 && (scrollTop !== this._scrollingContainer.scrollTop || columnOrRowCountJustIncreasedFromZero)) { this._scrollingContainer.scrollTop = scrollTop; } } // Special case where the previous size was 0: // In this case we don't show any windowed cells at all. // So we should always recalculate offset afterwards. var sizeJustIncreasedFromZero = (prevProps.width === 0 || prevProps.height === 0) && height > 0 && width > 0; // Update scroll offsets if the current :scrollToColumn or :scrollToRow values requires it // @TODO Do we also need this check or can the one in componentWillUpdate() suffice? if (this._recomputeScrollLeftFlag) { this._recomputeScrollLeftFlag = false; this._updateScrollLeftForScrollToColumn(this.props); } else { (0, _updateScrollIndexHelper["default"])({ cellSizeAndPositionManager: instanceProps.columnSizeAndPositionManager, previousCellsCount: prevProps.columnCount, previousCellSize: prevProps.columnWidth, previousScrollToAlignment: prevProps.scrollToAlignment, previousScrollToIndex: prevProps.scrollToColumn, previousSize: prevProps.width, scrollOffset: scrollLeft, scrollToAlignment: scrollToAlignment, scrollToIndex: scrollToColumn, size: width, sizeJustIncreasedFromZero: sizeJustIncreasedFromZero, updateScrollIndexCallback: function updateScrollIndexCallback() { return _this2._updateScrollLeftForScrollToColumn(_this2.props); } }); } if (this._recomputeScrollTopFlag) { this._recomputeScrollTopFlag = false; this._updateScrollTopForScrollToRow(this.props); } else { (0, _updateScrollIndexHelper["default"])({ cellSizeAndPositionManager: instanceProps.rowSizeAndPositionManager, previousCellsCount: prevProps.rowCount, previousCellSize: prevProps.rowHeight, previousScrollToAlignment: prevProps.scrollToAlignment, previousScrollToIndex: prevProps.scrollToRow, previousSize: prevProps.height, scrollOffset: scrollTop, scrollToAlignment: scrollToAlignment, scrollToIndex: scrollToRow, size: height, sizeJustIncreasedFromZero: sizeJustIncreasedFromZero, updateScrollIndexCallback: function updateScrollIndexCallback() { return _this2._updateScrollTopForScrollToRow(_this2.props); } }); } // Update onRowsRendered callback if start/stop indices have changed this._invokeOnGridRenderedHelper(); // Changes to :scrollLeft or :scrollTop should also notify :onScroll listeners if (scrollLeft !== prevState.scrollLeft || scrollTop !== prevState.scrollTop) { var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize(); var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize(); this._invokeOnScrollMemoizer({ scrollLeft: scrollLeft, scrollTop: scrollTop, totalColumnsWidth: totalColumnsWidth, totalRowsHeight: totalRowsHeight }); } this._maybeCallOnScrollbarPresenceChange(); } }, { key: "componentWillUnmount", value: function componentWillUnmount() { if (this._disablePointerEventsTimeoutId) { (0, _requestAnimationTimeout.cancelAnimationTimeout)(this._disablePointerEventsTimeoutId); } } /** * This method updates scrollLeft/scrollTop in state for the following conditions: * 1) Empty content (0 rows or columns) * 2) New scroll props overriding the current state * 3) Cells-count or cells-size has changed, making previous scroll offsets invalid */ }, { key: "render", value: function render() { var _this$props6 = this.props, autoContainerWidth = _this$props6.autoContainerWidth, autoHeight = _this$props6.autoHeight, autoWidth = _this$props6.autoWidth, className = _this$props6.className, containerProps = _this$props6.containerProps, containerRole = _this$props6.containerRole, containerStyle = _this$props6.containerStyle, height = _this$props6.height, id = _this$props6.id, noContentRenderer = _this$props6.noContentRenderer, role = _this$props6.role, style = _this$props6.style, tabIndex = _this$props6.tabIndex, width = _this$props6.width; var _this$state2 = this.state, instanceProps = _this$state2.instanceProps, needToResetStyleCache = _this$state2.needToResetStyleCache; var isScrolling = this._isScrolling(); var gridStyle = { boxSizing: 'border-box', direction: 'ltr', height: autoHeight ? 'auto' : height, position: 'relative', width: autoWidth ? 'auto' : width, WebkitOverflowScrolling: 'touch', willChange: 'transform' }; if (needToResetStyleCache) { this._styleCache = {}; } // calculate _styleCache here // if state.isScrolling (not from _isScrolling) then reset if (!this.state.isScrolling) { this._resetStyleCache(); } // calculate children to render here this._calculateChildrenToRender(this.props, this.state); var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize(); var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize(); // Force browser to hide scrollbars when we know they aren't necessary. // Otherwise once scrollbars appear they may not disappear again. // For more info see issue #116 var verticalScrollBarSize = totalRowsHeight > height ? instanceProps.scrollbarSize : 0; var horizontalScrollBarSize = totalColumnsWidth > width ? instanceProps.scrollbarSize : 0; if (horizontalScrollBarSize !== this._horizontalScrollBarSize || verticalScrollBarSize !== this._verticalScrollBarSize) { this._horizontalScrollBarSize = horizontalScrollBarSize; this._verticalScrollBarSize = verticalScrollBarSize; this._scrollbarPresenceChanged = true; } // Also explicitly init styles to 'auto' if scrollbars are required. // This works around an obscure edge case where external CSS styles have not yet been loaded, // But an initial scroll index of offset is set as an external prop. // Without this style, Grid would render the correct range of cells but would NOT update its internal offset. // This was originally reported via clauderic/react-infinite-calendar/issues/23 gridStyle.overflowX = totalColumnsWidth + verticalScrollBarSize <= width ? 'hidden' : 'auto'; gridStyle.overflowY = totalRowsHeight + horizontalScrollBarSize <= height ? 'hidden' : 'auto'; var childrenToDisplay = this._childrenToDisplay; var showNoContentRenderer = childrenToDisplay.length === 0 && height > 0 && width > 0; return React.createElement("div", (0, _extends2["default"])({ ref: this._setScrollingContainerRef }, containerProps, { "aria-label": this.props['aria-label'], "aria-readonly": this.props['aria-readonly'], className: (0, _clsx["default"])('ReactVirtualized__Grid', className), id: id, onScroll: this._onScroll, role: role, style: _objectSpread({}, gridStyle, {}, style), tabIndex: tabIndex }), childrenToDisplay.length > 0 && React.createElement("div", { className: "ReactVirtualized__Grid__innerScrollContainer", role: containerRole, style: _objectSpread({ width: autoContainerWidth ? 'auto' : totalColumnsWidth, height: totalRowsHeight, maxWidth: totalColumnsWidth, maxHeight: totalRowsHeight, overflow: 'hidden', pointerEvents: isScrolling ? 'none' : '', position: 'relative' }, containerStyle) }, childrenToDisplay), showNoContentRenderer && noContentRenderer()); } /* ---------------------------- Helper methods ---------------------------- */ }, { key: "_calculateChildrenToRender", value: function _calculateChildrenToRender() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props; var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state; var cellRenderer = props.cellRenderer, cellRangeRenderer = props.cellRangeRenderer, columnCount = props.columnCount, deferredMeasurementCache = props.deferredMeasurementCache, height = props.height, overscanColumnCount = props.overscanColumnCount, overscanIndicesGetter = props.overscanIndicesGetter, overscanRowCount = props.overscanRowCount, rowCount = props.rowCount, width = props.width, isScrollingOptOut = props.isScrollingOptOut; var scrollDirectionHorizontal = state.scrollDirectionHorizontal, scrollDirectionVertical = state.scrollDirectionVertical, instanceProps = state.instanceProps; var scrollTop = this._initialScrollTop > 0 ? this._initialScrollTop : state.scrollTop; var scrollLeft = this._initialScrollLeft > 0 ? this._initialScrollLeft : state.scrollLeft; var isScrolling = this._isScrolling(props, state); this._childrenToDisplay = []; // Render only enough columns and rows to cover the visible area of the grid. if (height > 0 && width > 0) { var visibleColumnIndices = instanceProps.columnSizeAndPositionManager.getVisibleCellRange({ containerSize: width, offset: scrollLeft }); var visibleRowIndices = instanceProps.rowSizeAndPositionManager.getVisibleCellRange({ containerSize: height, offset: scrollTop }); var horizontalOffsetAdjustment = instanceProps.columnSizeAndPositionManager.getOffsetAdjustment({ containerSize: width, offset: scrollLeft }); var verticalOffsetAdjustment = instanceProps.rowSizeAndPositionManager.getOffsetAdjustment({ containerSize: height, offset: scrollTop }); // Store for _invokeOnGridRenderedHelper() this._renderedColumnStartIndex = visibleColumnIndices.start; this._renderedColumnStopIndex = visibleColumnIndices.stop; this._renderedRowStartIndex = visibleRowIndices.start; this._renderedRowStopIndex = visibleRowIndices.stop; var overscanColumnIndices = overscanIndicesGetter({ direction: 'horizontal', cellCount: columnCount, overscanCellsCount: overscanColumnCount, scrollDirection: scrollDirectionHorizontal, startIndex: typeof visibleColumnIndices.start === 'number' ? visibleColumnIndices.start : 0, stopIndex: typeof visibleColumnIndices.stop === 'number' ? visibleColumnIndices.stop : -1 }); var overscanRowIndices = overscanIndicesGetter({ direction: 'vertical', cellCount: rowCount, overscanCellsCount: overscanRowCount, scrollDirection: scrollDirectionVertical, startIndex: typeof visibleRowIndices.start === 'number' ? visibleRowIndices.start : 0, stopIndex: typeof visibleRowIndices.stop === 'number' ? visibleRowIndices.stop : -1 }); // Store for _invokeOnGridRenderedHelper() var columnStartIndex = overscanColumnIndices.overscanStartIndex; var columnStopIndex = overscanColumnIndices.overscanStopIndex; var rowStartIndex = overscanRowIndices.overscanStartIndex; var rowStopIndex = overscanRowIndices.overscanStopIndex; // Advanced use-cases (eg CellMeasurer) require batched measurements to determine accurate sizes. if (deferredMeasurementCache) { // If rows have a dynamic height, scan the rows we are about to render. // If any have not yet been measured, then we need to render all columns initially, // Because the height of the row is equal to the tallest cell within that row, // (And so we can't know the height without measuring all column-cells first). if (!deferredMeasurementCache.hasFixedHeight()) { for (var rowIndex = rowStartIndex; rowIndex <= rowStopIndex; rowIndex++) { if (!deferredMeasurementCache.has(rowIndex, 0)) { columnStartIndex = 0; columnStopIndex = columnCount - 1; break; } } } // If columns have a dynamic width, scan the columns we are about to render. // If any have not yet been measured, then we need to render all rows initially, // Because the width of the column is equal to the widest cell within that column, // (And so we can't know the width without measuring all row-cells first). if (!deferredMeasurementCache.hasFixedWidth()) { for (var columnIndex = columnStartIndex; columnIndex <= columnStopIndex; columnIndex++) { if (!deferredMeasurementCache.has(0, columnIndex)) { rowStartIndex = 0; rowStopIndex = rowCount - 1; break; } } } } this._childrenToDisplay = cellRangeRenderer({ cellCache: this._cellCache, cellRenderer: cellRenderer, columnSizeAndPositionManager: instanceProps.columnSizeAndPositionManager, columnStartIndex: columnStartIndex, columnStopIndex: columnStopIndex, deferredMeasurementCache: deferredMeasurementCache, horizontalOffsetAdjustment: horizontalOffsetAdjustment, isScrolling: isScrolling, isScrollingOptOut: isScrollingOptOut, parent: this, rowSizeAndPositionManager: instanceProps.rowSizeAndPositionManager, rowStartIndex: rowStartIndex, rowStopIndex: rowStopIndex, scrollLeft: scrollLeft, scrollTop: scrollTop, styleCache: this._styleCache, verticalOffsetAdjustment: verticalOffsetAdjustment, visibleColumnIndices: visibleColumnIndices, visibleRowIndices: visibleRowIndices }); // update the indices this._columnStartIndex = columnStartIndex; this._columnStopIndex = columnStopIndex; this._rowStartIndex = rowStartIndex; this._rowStopIndex = rowStopIndex; } } /** * Sets an :isScrolling flag for a small window of time. * This flag is used to disable pointer events on the scrollable portion of the Grid. * This prevents jerky/stuttery mouse-wheel scrolling. */ }, { key: "_debounceScrollEnded", value: function _debounceScrollEnded() { var scrollingResetTimeInterval = this.props.scrollingResetTimeInterval; if (this._disablePointerEventsTimeoutId) { (0, _requestAnimationTimeout.cancelAnimationTimeout)(this._disablePointerEventsTimeoutId); } this._disablePointerEventsTimeoutId = (0, _requestAnimationTimeout.requestAnimationTimeout)(this._debounceScrollEndedCallback, scrollingResetTimeInterval); } }, { key: "_handleInvalidatedGridSize", /** * Check for batched CellMeasurer size invalidations. * This will occur the first time one or more previously unmeasured cells are rendered. */ value: function _handleInvalidatedGridSize() { if (typeof this._deferredInvalidateColumnIndex === 'number' && typeof this._deferredInvalidateRowIndex === 'number') { var columnIndex = this._deferredInvalidateColumnIndex; var rowIndex = this._deferredInvalidateRowIndex; this._deferredInvalidateColumnIndex = null; this._deferredInvalidateRowIndex = null; this.recomputeGridSize({ columnIndex: columnIndex, rowIndex: rowIndex }); } } }, { key: "_invokeOnScrollMemoizer", value: function _invokeOnScrollMemoizer(_ref6) { var _this3 = this; var scrollLeft = _ref6.scrollLeft, scrollTop = _ref6.scrollTop, totalColumnsWidth = _ref6.totalColumnsWidth, totalRowsHeight = _ref6.totalRowsHeight; this._onScrollMemoizer({ callback: function callback(_ref7) { var scrollLeft = _ref7.scrollLeft, scrollTop = _ref7.scrollTop; var _this3$props = _this3.props, height = _this3$props.height, onScroll = _this3$props.onScroll, width = _this3$props.width; onScroll({ clientHeight: height, clientWidth: width, scrollHeight: totalRowsHeight, scrollLeft: scrollLeft, scrollTop: scrollTop, scrollWidth: totalColumnsWidth }); }, indices: { scrollLeft: scrollLeft, scrollTop: scrollTop } }); } }, { key: "_isScrolling", value: function _isScrolling() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props; var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state; // If isScrolling is defined in props, use it to override the value in state // This is a performance optimization for WindowScroller + Grid return Object.hasOwnProperty.call(props, 'isScrolling') ? Boolean(props.isScrolling) : Boolean(state.isScrolling); } }, { key: "_maybeCallOnScrollbarPresenceChange", value: function _maybeCallOnScrollbarPresenceChange() { if (this._scrollbarPresenceChanged) { var onScrollbarPresenceChange = this.props.onScrollbarPresenceChange; this._scrollbarPresenceChanged = false; onScrollbarPresenceChange({ horizontal: this._horizontalScrollBarSize > 0, size: this.state.instanceProps.scrollbarSize, vertical: this._verticalScrollBarSize > 0 }); } } }, { key: "scrollToPosition", /** * Scroll to the specified offset(s). * Useful for animating position changes. */ value: function scrollToPosition(_ref8) { var scrollLeft = _ref8.scrollLeft, scrollTop = _ref8.scrollTop; var stateUpdate = Grid._getScrollToPositionStateUpdate({ prevState: this.state, scrollLeft: scrollLeft, scrollTop: scrollTop }); if (stateUpdate) { stateUpdate.needToResetStyleCache = false; this.setState(stateUpdate); } } }, { key: "_getCalculatedScrollLeft", value: function _getCalculatedScrollLeft() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props; var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state; return Grid._getCalculatedScrollLeft(props, state); } }, { key: "_updateScrollLeftForScrollToColumn", value: function _updateScrollLeftForScrollToColumn() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props; var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state; var stateUpdate = Grid._getScrollLeftForScrollToColumnStateUpdate(props, state); if (stateUpdate) { stateUpdate.needToResetStyleCache = false; this.setState(stateUpdate); } } }, { key: "_getCalculatedScrollTop", value: function _getCalculatedScrollTop() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props; var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state; return Grid._getCalculatedScrollTop(props, state); } }, { key: "_resetStyleCache", value: function _resetStyleCache() { var styleCache = this._styleCache; var cellCache = this._cellCache; var isScrollingOptOut = this.props.isScrollingOptOut; // Reset cell and style caches once scrolling stops. // This makes Grid simpler to use (since cells commonly change). // And it keeps the caches from growing too large. // Performance is most sensitive when a user is scrolling. // Don't clear visible cells from cellCache if isScrollingOptOut is specified. // This keeps the cellCache to a resonable size. this._cellCache = {}; this._styleCache = {}; // Copy over the visible cell styles so avoid unnecessary re-render. for (var rowIndex = this._rowStartIndex; rowIndex <= this._rowStopIndex; rowIndex++) { for (var columnIndex = this._columnStartIndex; columnIndex <= this._columnStopIndex; columnIndex++) { var key = "".concat(rowIndex, "-").concat(columnIndex); this._styleCache[key] = styleCache[key]; if (isScrollingOptOut) { this._cellCache[key] = cellCache[key]; } } } } }, { key: "_updateScrollTopForScrollToRow", value: function _updateScrollTopForScrollToRow() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props; var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state; var stateUpdate = Grid._getScrollTopForScrollToRowStateUpdate(props, state); if (stateUpdate) { stateUpdate.needToResetStyleCache = false; this.setState(stateUpdate); } } }], [{ key: "getDerivedStateFromProps", value: function getDerivedStateFromProps(nextProps, prevState) { var newState = {}; if (nextProps.columnCount === 0 && prevState.scrollLeft !== 0 || nextProps.rowCount === 0 && prevState.scrollTop !== 0) { newState.scrollLeft = 0; newState.scrollTop = 0; // only use scroll{Left,Top} from props if scrollTo{Column,Row} isn't specified // scrollTo{Column,Row} should override scroll{Left,Top} } else if (nextProps.scrollLeft !== prevState.scrollLeft && nextProps.scrollToColumn < 0 || nextProps.scrollTop !== prevState.scrollTop && nextProps.scrollToRow < 0) { Object.assign(newState, Grid._getScrollToPositionStateUpdate({ prevState: prevState, scrollLeft: nextProps.scrollLeft, scrollTop: nextProps.scrollTop })); } var instanceProps = prevState.instanceProps; // Initially we should not clearStyleCache newState.needToResetStyleCache = false; if (nextProps.columnWidth !== instanceProps.prevColumnWidth || nextProps.rowHeight !== instanceProps.prevRowHeight) { // Reset cache. set it to {} in render newState.needToResetStyleCache = true; } instanceProps.columnSizeAndPositionManager.configure({ cellCount: nextProps.columnCount, estimatedCellSize: Grid._getEstimatedColumnSize(nextProps), cellSizeGetter: Grid._wrapSizeGetter(nextProps.columnWidth) }); instanceProps.rowSizeAndPositionManager.configure({ cellCount: nextProps.rowCount, estimatedCellSize: Grid._getEstimatedRowSize(nextProps), cellSizeGetter: Grid._wrapSizeGetter(nextProps.rowHeight) }); if (instanceProps.prevColumnCount === 0 || instanceProps.prevRowCount === 0) { instanceProps.prevColumnCount = 0; instanceProps.prevRowCount = 0; } // If scrolling is controlled outside this component, clear cache when scrolling stops if (nextProps.autoHeight && nextProps.isScrolling === false && instanceProps.prevIsScrolling === true) { Object.assign(newState, { isScrolling: false }); } var maybeStateA; var maybeStateB; (0, _calculateSizeAndPositionDataAndUpdateScrollOffset["default"])({ cellCount: instanceProps.prevColumnCount, cellSize: typeof instanceProps.prevColumnWidth === 'number' ? instanceProps.prevColumnWidth : null, computeMetadataCallback: function computeMetadataCallback() { return instanceProps.columnSizeAndPositionManager.resetCell(0); }, computeMetadataCallbackProps: nextProps, nextCellsCount: nextProps.columnCount, nextCellSize: typeof nextProps.columnWidth === 'number' ? nextProps.columnWidth : null, nextScrollToIndex: nextProps.scrollToColumn, scrollToIndex: instanceProps.prevScrollToColumn, updateScrollOffsetForScrollToIndex: function updateScrollOffsetForScrollToIndex() { maybeStateA = Grid._getScrollLeftForScrollToColumnStateUpdate(nextProps, prevState); } }); (0, _calculateSizeAndPositionDataAndUpdateScrollOffset["default"])({ cellCount: instanceProps.prevRowCount, cellSize: typeof instanceProps.prevRowHeight === 'number' ? instanceProps.prevRowHeight : null, computeMetadataCallback: function computeMetadataCallback() { return instanceProps.rowSizeAndPositionManager.resetCell(0); }, computeMetadataCallbackProps: nextProps, nextCellsCount: nextProps.rowCount, nextCellSize: typeof nextProps.rowHeight === 'number' ? nextProps.rowHeight : null, nextScrollToIndex: nextProps.scrollToRow, scrollToIndex: instanceProps.prevScrollToRow, updateScrollOffsetForScrollToIndex: function updateScrollOffsetForScrollToIndex() { maybeStateB = Grid._getScrollTopForScrollToRowStateUpdate(nextProps, prevState); } }); instanceProps.prevColumnCount = nextProps.columnCount; instanceProps.prevColumnWidth = nextProps.columnWidth; instanceProps.prevIsScrolling = nextProps.isScrolling === true; instanceProps.prevRowCount = nextProps.rowCount; instanceProps.prevRowHeight = nextProps.rowHeight; instanceProps.prevScrollToColumn = nextProps.scrollToColumn; instanceProps.prevScrollToRow = nextProps.scrollToRow; // getting scrollBarSize (moved from componentWillMount) instanceProps.scrollbarSize = nextProps.getScrollbarSize(); if (instanceProps.scrollbarSize === undefined) { instanceProps.scrollbarSizeMeasured = false; instanceProps.scrollbarSize = 0; } else { instanceProps.scrollbarSizeMeasured = true; } newState.instanceProps = instanceProps; return _objectSpread({}, newState, {}, maybeStateA, {}, maybeStateB); } }, { key: "_getEstimatedColumnSize", value: function _getEstimatedColumnSize(props) { return typeof props.columnWidth === 'number' ? props.columnWidth : props.estimatedColumnSize; } }, { key: "_getEstimatedRowSize", value: function _getEstimatedRowSize(props) { return typeof props.rowHeight === 'number' ? props.rowHeight : props.estimatedRowSize; } }, { key: "_getScrollToPositionStateUpdate", /** * Get the updated state after scrolling to * scrollLeft and scrollTop */ value: function _getScrollToPositionStateUpdate(_ref9) { var prevState = _ref9.prevState, scrollLeft = _ref9.scrollLeft, scrollTop = _ref9.scrollTop; var newState = { scrollPositionChangeReason: SCROLL_POSITION_CHANGE_REASONS.REQUESTED }; if (typeof scrollLeft === 'number' && scrollLeft >= 0) { newState.scrollDirectionHorizontal = scrollLeft > prevState.scrollLeft ? _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter.SCROLL_DIRECTION_BACKWARD; newState.scrollLeft = scrollLeft; } if (typeof scrollTop === 'number' && scrollTop >= 0) { newState.scrollDirectionVertical = scrollTop > prevState.scrollTop ? _defaultOverscanIndicesGetter.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter.SCROLL_DIRECTION_BACKWARD; newState.scrollTop = scrollTop; } if (typeof scrollLeft === 'number' && scrollLeft >= 0 && scrollLeft !== prevState.scrollLeft || typeof scrollTop === 'number' && scrollTop >= 0 && scrollTop !== prevState.scrollTop) { return newState; } return {}; } }, { key: "_wrapSizeGetter", value: function _wrapSizeGetter(value) { return typeof value === 'function' ? value : function () { return value; }; } }, { key: "_getCalculatedScrollLeft", value: function _getCalculatedScrollLeft(nextProps, prevState) { var columnCount = nextProps.columnCount, height = nextProps.height, scrollToAlignment = nextProps.scrollToAlignment, scrollToColumn = nextProps.scrollToColumn, width = nextProps.width; var scrollLeft = prevState.scrollLeft, instanceProps = prevState.instanceProps; if (columnCount > 0) { var finalColumn = columnCount - 1; var targetIndex = scrollToColumn < 0 ? finalColumn : Math.min(finalColumn, scrollToColumn); var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize(); var scrollBarSize = instanceProps.scrollbarSizeMeasured && totalRowsHeight > height ? instanceProps.scrollbarSize : 0; return instanceProps.columnSizeAndPositionManager.getUpdatedOffsetForIndex({ align: scrollToAlignment, containerSize: width - scrollBarSize, currentOffset: scrollLeft, targetIndex: targetIndex }); } return 0; } }, { key: "_getScrollLeftForScrollToColumnStateUpdate", value: function _getScrollLeftForScrollToColumnStateUpdate(nextProps, prevState) { var scrollLeft = prevState.scrollLeft; var calculatedScrollLeft = Grid._getCalculatedScrollLeft(nextProps, prevState); if (typeof calculatedScrollLeft === 'number' && calculatedScrollLeft >= 0 && scrollLeft !== calculatedScrollLeft) { return Grid._getScrollToPositionStateUpdate({ prevState: prevState, scrollLeft: calculatedScrollLeft, scrollTop: -1 }); } return {}; } }, { key: "_getCalculatedScrollTop", value: function _getCalculatedScrollTop(nextProps, prevState) { var height = nextProps.height, rowCount = nextProps.rowCount, scrollToAlignment = nextProps.scrollToAlignment, scrollToRow = nextProps.scrollToRow, width = nextProps.width; var scrollTop = prevState.scrollTop, instanceProps = prevState.instanceProps; if (rowCount > 0) { var finalRow = rowCount - 1; var targetIndex = scrollToRow < 0 ? finalRow : Math.min(finalRow, scrollToRow); var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize(); var scrollBarSize = instanceProps.scrollbarSizeMeasured && totalColumnsWidth > width ? instanceProps.scrollbarSize : 0; return instanceProps.rowSizeAndPositionManager.getUpdatedOffsetForIndex({ align: scrollToAlignment, containerSize: height - scrollBarSize, currentOffset: scrollTop, targetIndex: targetIndex }); } return 0; } }, { key: "_getScrollTopForScrollToRowStateUpdate", value: function _getScrollTopForScrollToRowStateUpdate(nextProps, prevState) { var scrollTop = prevState.scrollTop; var calculatedScrollTop = Grid._getCalculatedScrollTop(nextProps, prevState); if (typeof calculatedScrollTop === 'number' && calculatedScrollTop >= 0 && scrollTop !== calculatedScrollTop) { return Grid._getScrollToPositionStateUpdate({ prevState: prevState, scrollLeft: -1, scrollTop: calculatedScrollTop }); } return {}; } }]); return Grid; }(React.PureComponent), (0, _defineProperty2["default"])(_class, "propTypes", process.env.NODE_ENV === 'production' ? null : { "aria-label": _propTypes["default"].string.isRequired, "aria-readonly": _propTypes["default"].bool, /** * Set the width of the inner scrollable container to 'auto'. * This is useful for single-column Grids to ensure that the column doesn't extend below a vertical scrollbar. */ "autoContainerWidth": _propTypes["default"].bool.isRequired, /** * Removes fixed height from the scrollingContainer so that the total height of rows can stretch the window. * Intended for use with WindowScroller */ "autoHeight": _propTypes["default"].bool.isRequired, /** * Removes fixed width from the scrollingContainer so that the total width of rows can stretch the window. * Intended for use with WindowScroller */ "autoWidth": _propTypes["default"].bool.isRequired, /** Responsible for rendering a cell given an row and column index. */ "cellRenderer": function cellRenderer() { return (typeof _types.bpfrpt_proptype_CellRenderer === "function" ? _types.bpfrpt_proptype_CellRenderer.isRequired ? _types.bpfrpt_proptype_CellRenderer.isRequired : _types.bpfrpt_proptype_CellRenderer : _propTypes["default"].shape(_types.bpfrpt_proptype_CellRenderer).isRequired).apply(this, arguments); }, /** Responsible for rendering a group of cells given their index ranges. */ "cellRangeRenderer": function cellRangeRenderer() { return (typeof _types.bpfrpt_proptype_CellRangeRenderer === "function" ? _types.bpfrpt_proptype_CellRangeRenderer.isRequired ? _types.bpfrpt_proptype_CellRangeRenderer.isRequired : _types.bpfrpt_proptype_CellRangeRenderer : _propTypes["default"].shape(_types.bpfrpt_proptype_CellRangeRenderer).isRequired).apply(this, arguments); }, /** Optional custom CSS class name to attach to root Grid element. */ "className": _propTypes["default"].string, /** Number of columns in grid. */ "columnCount": _propTypes["default"].number.isRequired, /** Either a fixed column width (number) or a function that returns the width of a column given its index. */ "columnWidth": function columnWidth() { return (typeof _types.bpfrpt_proptype_CellSize === "function" ? _types.bpfrpt_proptype_CellSize.isRequired ? _types.bpfrpt_proptype_CellSize.isRequired : _types.bpfrpt_proptype_CellSize : _propTypes["default"].shape(_types.bpfrpt_proptype_CellSize).isRequired).apply(this, arguments); }, /** Unfiltered props for the Grid container. */ "containerProps": _propTypes["default"].object, /** ARIA role for the cell-container. */ "containerRole": _propTypes["default"].string.isRequired, /** Optional inline style applied to inner cell-container */ "containerStyle": _propTypes["default"].object.isRequired, /** * If CellMeasurer is used to measure this Grid's children, this should be a pointer to its CellMeasurerCache. * A shared CellMeasurerCache reference enables Grid and CellMeasurer to share measurement data. */ "deferredMeasurementCache": _propTypes["default"].object, /** * Used to estimate the total width of a Grid before all of its columns have actually been measured. * The estimated total width is adjusted as columns are rendered. */ "estimatedColumnSize": _propTypes["default"].number.isRequired, /** * Used to estimate the total height of a Grid before all of its rows have actually been measured. * The estimated total height is adjusted as rows are rendered. */ "estimatedRowSize": _propTypes["default"].number.isRequired, /** Exposed for testing purposes only. */ "getScrollbarSize": _propTypes["default"].func.isRequired, /** Height of Grid; this property determines the number of visible (vs virtualized) rows. */ "height": _propTypes["default"].number.isRequired, /** Optional custom id to attach to root Grid element. */ "id": _propTypes["default"].string, /** * Override internal is-scrolling state tracking. * This property is primarily intended for use with the WindowScroller component. */ "isScrolling": _propTypes["default"].bool, /** * Opt-out of isScrolling param passed to cellRangeRenderer. * To avoid the extra render when scroll stops. */ "isScrollingOptOut": _propTypes["default"].bool.isRequired, /** Optional renderer to be used in place of rows when either :rowCount or :columnCount is 0. */ "noContentRenderer": function noContentRenderer() { return (typeof _types.bpfrpt_proptype_NoContentRenderer === "function" ? _types.bpfrpt_proptype_NoContentRenderer.isRequired ? _types.bpfrpt_proptype_NoContentRenderer.isRequired : _types.bpfrpt_proptype_NoContentRenderer : _propTypes["default"].shape(_types.bpfrpt_proptype_NoContentRenderer).isRequired).apply(this, arguments); }, /** * Callback invoked whenever the scroll offset changes within the inner scrollable region. * This callback can be used to sync scrolling between lists, tables, or grids. */ "onScroll": _propTypes["default"].func.isRequired, /** * Called whenever a horizontal or vertical scrollbar is added or removed. * This prop is not intended for end-user use; * It is used by MultiGrid to support fixed-row/fixed-column scroll syncing. */ "onScrollbarPresenceChange": _propTypes["default"].func.isRequired, /** Callback invoked with information about the section of the Grid that was just rendered. */ "onSectionRendered": _propTypes["default"].func.isRequired, /** * Number of columns to render before/after the visible section of the grid. * These columns can help for smoother scrolling on touch devices or browsers that send scroll events infrequently. */ "overscanColumnCount": _propTypes["default"].number.isRequired, /** * Calculates the number of cells to overscan before and after a specified range. * This function ensures that overscanning doesn't exceed the available cells. */ "overscanIndicesGetter": function overscanIndicesGetter() { return (typeof _types.bpfrpt_proptype_OverscanIndicesGetter === "function" ? _types.bpfrpt_proptype_OverscanIndicesGetter.isRequired ? _types.bpfrpt_proptype_OverscanIndicesGetter.isRequired : _types.bpfrpt_proptype_OverscanIndicesGetter : _propTypes["default"].shape(_types.bpfrpt_proptype_OverscanIndicesGetter).isRequired).apply(this, arguments); }, /** * Number of rows to render above/below the visible section of the grid. * These rows can help for smoother scrolling on touch devices or browsers that send scroll events infrequently. */ "overscanRowCount": _propTypes["default"].number.isRequired, /** ARIA role for the grid element. */ "role": _propTypes["default"].string.isRequired, /** * Either a fixed row height (number) or a function that returns the height of a row given its index. * Should implement the following interface: ({ index: number }): number */ "rowHeight": function rowHeight() { return (typeof _types.bpfrpt_proptype_CellSize === "function" ? _types.bpfrpt_proptype_CellSize.isRequired ? _types.bpfrpt_proptype_CellSize.isRequired : _types.bpfrpt_proptype_CellSize : _propTypes["default"].shape(_types.bpfrpt_proptype_CellSize).isRequired).apply(this, arguments); }, /** Number of rows in grid. */ "rowCount": _propTypes["default"].number.isRequired, /** Wait this amount of time after the last scroll event before resetting Grid `pointer-events`. */ "scrollingResetTimeInterval": _propTypes["default"].number.isRequired, /** Horizontal offset. */ "scrollLeft": _propTypes["default"].number, /** * Controls scroll-to-cell behavior of the Grid. * The default ("auto") scrolls the least amount possible to ensure that the specified cell is fully visible. * Use "start" to align cells to the top/left of the Grid and "end" to align bottom/right. */ "scrollToAlignment": function scrollToAlignment() { return (typeof _types.bpfrpt_proptype_Alignment === "function" ? _types.bpfrpt_proptype_Alignment.isRequired ? _types.bpfrpt_proptype_Alignment.isRequired : _types.bpfrpt_proptype_Alignment : _propTypes["default"].shape(_types.bpfrpt_proptype_Alignment).isRequired).apply(this, arguments); }, /** Column index to ensure visible (by forcefully scrolling if necessary) */ "scrollToColumn": _propTypes["default"].number.isRequired, /** Vertical offset. */ "scrollTop": _propTypes["default"].number, /** Row index to ensure visible (by forcefully scrolling if necessary) */ "scrollToRow": _propTypes["default"].number.isRequired, /** Optional inline style */ "style": _propTypes["default"].object.isRequired, /** Tab index for focus */ "tabIndex": _propTypes["default"].number, /** Width of Grid; this property determines the number of visible (vs virtualized) columns. */ "width": _propTypes["default"].number.isRequired }), _temp); (0, _defineProperty2["default"])(Grid, "defaultProps", { 'aria-label': 'grid', 'aria-readonly': true, autoContainerWidth: false, autoHeight: false, autoWidth: false, cellRangeRenderer: _defaultCellRangeRenderer["default"], containerRole: 'rowgroup', containerStyle: {}, estimatedColumnSize: 100, estimatedRowSize: 30, getScrollbarSize: _scrollbarSize["default"], noContentRenderer: renderNull, onScroll: function onScroll() {}, onScrollbarPresenceChange: function onScrollbarPresenceChange() {}, onSectionRendered: function onSectionRendered() {}, overscanColumnCount: 0, overscanIndicesGetter: _defaultOverscanIndicesGetter["default"], overscanRowCount: 10, role: 'grid', scrollingResetTimeInterval: DEFAULT_SCROLLING_RESET_TIME_INTERVAL, scrollToAlignment: 'auto', scrollToColumn: -1, scrollToRow: -1, style: {}, tabIndex: 0, isScrollingOptOut: false }); (0, _reactLifecyclesCompat.polyfill)(Grid); var _default = Grid; exports["default"] = _default;