mirror of
https://github.com/wu736139669/ASHEBShop-h5.git
synced 2026-10-07 19:26:23 +00:00
657 lines
24 KiB
JavaScript
657 lines
24 KiB
JavaScript
'use strict';
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
|
|
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
|
|
var _propTypes = require('prop-types');
|
|
|
|
var _propTypes2 = _interopRequireDefault(_propTypes);
|
|
|
|
var _react = require('react');
|
|
|
|
var _react2 = _interopRequireDefault(_react);
|
|
|
|
var _classnames = require('classnames');
|
|
|
|
var _classnames2 = _interopRequireDefault(_classnames);
|
|
|
|
var _createCallbackMemoizer = require('../utils/createCallbackMemoizer');
|
|
|
|
var _createCallbackMemoizer2 = _interopRequireDefault(_createCallbackMemoizer);
|
|
|
|
var _scrollbarSize = require('dom-helpers/util/scrollbarSize');
|
|
|
|
var _scrollbarSize2 = _interopRequireDefault(_scrollbarSize);
|
|
|
|
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 && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
|
|
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { 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: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
|
|
// @TODO Merge Collection and CollectionView
|
|
|
|
/**
|
|
* Specifies the number of miliseconds during which to disable pointer events while a scroll is in progress.
|
|
* This improves performance and makes scrolling smoother.
|
|
*/
|
|
var IS_SCROLLING_TIMEOUT = 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).
|
|
*/
|
|
var SCROLL_POSITION_CHANGE_REASONS = {
|
|
OBSERVED: 'observed',
|
|
REQUESTED: 'requested'
|
|
};
|
|
|
|
/**
|
|
* Monitors changes in properties (eg. cellCount) and state (eg. scroll offsets) to determine when rendering needs to occur.
|
|
* This component does not render any visible content itself; it defers to the specified :cellLayoutManager.
|
|
*/
|
|
|
|
var CollectionView = function (_PureComponent) {
|
|
_inherits(CollectionView, _PureComponent);
|
|
|
|
function CollectionView(props, context) {
|
|
_classCallCheck(this, CollectionView);
|
|
|
|
var _this = _possibleConstructorReturn(this, (CollectionView.__proto__ || Object.getPrototypeOf(CollectionView)).call(this, props, context));
|
|
|
|
_this.state = {
|
|
isScrolling: false,
|
|
scrollLeft: 0,
|
|
scrollTop: 0
|
|
};
|
|
|
|
_this._calculateSizeAndPositionDataOnNextUpdate = false;
|
|
|
|
// Invokes callbacks only when their values have changed.
|
|
_this._onSectionRenderedMemoizer = (0, _createCallbackMemoizer2.default)();
|
|
_this._onScrollMemoizer = (0, _createCallbackMemoizer2.default)(false);
|
|
|
|
// Bind functions to instance so they don't lose context when passed around.
|
|
_this._invokeOnSectionRenderedHelper = _this._invokeOnSectionRenderedHelper.bind(_this);
|
|
_this._onScroll = _this._onScroll.bind(_this);
|
|
_this._setScrollingContainerRef = _this._setScrollingContainerRef.bind(_this);
|
|
_this._updateScrollPositionForScrollToCell = _this._updateScrollPositionForScrollToCell.bind(_this);
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Forced recompute of cell sizes and positions.
|
|
* This function should be called if cell sizes have changed but nothing else has.
|
|
* Since cell positions are calculated by callbacks, the collection view has no way of detecting when the underlying data has changed.
|
|
*/
|
|
|
|
|
|
_createClass(CollectionView, [{
|
|
key: 'recomputeCellSizesAndPositions',
|
|
value: function recomputeCellSizesAndPositions() {
|
|
this._calculateSizeAndPositionDataOnNextUpdate = true;
|
|
this.forceUpdate();
|
|
}
|
|
|
|
/* ---------------------------- Component lifecycle methods ---------------------------- */
|
|
|
|
}, {
|
|
key: 'componentDidMount',
|
|
value: function componentDidMount() {
|
|
var _props = this.props,
|
|
cellLayoutManager = _props.cellLayoutManager,
|
|
scrollLeft = _props.scrollLeft,
|
|
scrollToCell = _props.scrollToCell,
|
|
scrollTop = _props.scrollTop;
|
|
|
|
// If this component was first rendered server-side, scrollbar size will be undefined.
|
|
// In that event we need to remeasure.
|
|
|
|
if (!this._scrollbarSizeMeasured) {
|
|
this._scrollbarSize = (0, _scrollbarSize2.default)();
|
|
this._scrollbarSizeMeasured = true;
|
|
this.setState({});
|
|
}
|
|
|
|
if (scrollToCell >= 0) {
|
|
this._updateScrollPositionForScrollToCell();
|
|
} else if (scrollLeft >= 0 || scrollTop >= 0) {
|
|
this._setScrollPosition({ scrollLeft: scrollLeft, scrollTop: scrollTop });
|
|
}
|
|
|
|
// Update onSectionRendered callback.
|
|
this._invokeOnSectionRenderedHelper();
|
|
|
|
var _cellLayoutManager$ge = cellLayoutManager.getTotalSize(),
|
|
totalHeight = _cellLayoutManager$ge.height,
|
|
totalWidth = _cellLayoutManager$ge.width;
|
|
|
|
// Initialize onScroll callback.
|
|
|
|
|
|
this._invokeOnScrollMemoizer({
|
|
scrollLeft: scrollLeft || 0,
|
|
scrollTop: scrollTop || 0,
|
|
totalHeight: totalHeight,
|
|
totalWidth: totalWidth
|
|
});
|
|
}
|
|
}, {
|
|
key: 'componentDidUpdate',
|
|
value: function componentDidUpdate(prevProps, prevState) {
|
|
var _props2 = this.props,
|
|
height = _props2.height,
|
|
scrollToAlignment = _props2.scrollToAlignment,
|
|
scrollToCell = _props2.scrollToCell,
|
|
width = _props2.width;
|
|
var _state = this.state,
|
|
scrollLeft = _state.scrollLeft,
|
|
scrollPositionChangeReason = _state.scrollPositionChangeReason,
|
|
scrollTop = _state.scrollTop;
|
|
|
|
// 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) {
|
|
if (scrollLeft >= 0 && scrollLeft !== prevState.scrollLeft && scrollLeft !== this._scrollingContainer.scrollLeft) {
|
|
this._scrollingContainer.scrollLeft = scrollLeft;
|
|
}
|
|
if (scrollTop >= 0 && scrollTop !== prevState.scrollTop && scrollTop !== this._scrollingContainer.scrollTop) {
|
|
this._scrollingContainer.scrollTop = scrollTop;
|
|
}
|
|
}
|
|
|
|
// Update scroll offsets if the current :scrollToCell values requires it
|
|
if (height !== prevProps.height || scrollToAlignment !== prevProps.scrollToAlignment || scrollToCell !== prevProps.scrollToCell || width !== prevProps.width) {
|
|
this._updateScrollPositionForScrollToCell();
|
|
}
|
|
|
|
// Update onRowsRendered callback if start/stop indices have changed
|
|
this._invokeOnSectionRenderedHelper();
|
|
}
|
|
}, {
|
|
key: 'componentWillMount',
|
|
value: function componentWillMount() {
|
|
var cellLayoutManager = this.props.cellLayoutManager;
|
|
|
|
|
|
cellLayoutManager.calculateSizeAndPositionData();
|
|
|
|
// If this component is being rendered server-side, getScrollbarSize() will return undefined.
|
|
// We handle this case in componentDidMount()
|
|
this._scrollbarSize = (0, _scrollbarSize2.default)();
|
|
if (this._scrollbarSize === undefined) {
|
|
this._scrollbarSizeMeasured = false;
|
|
this._scrollbarSize = 0;
|
|
} else {
|
|
this._scrollbarSizeMeasured = true;
|
|
}
|
|
}
|
|
}, {
|
|
key: 'componentWillUnmount',
|
|
value: function componentWillUnmount() {
|
|
if (this._disablePointerEventsTimeoutId) {
|
|
clearTimeout(this._disablePointerEventsTimeoutId);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @private
|
|
* 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: 'componentWillReceiveProps',
|
|
value: function componentWillReceiveProps(nextProps) {
|
|
var _state2 = this.state,
|
|
scrollLeft = _state2.scrollLeft,
|
|
scrollTop = _state2.scrollTop;
|
|
|
|
|
|
if (nextProps.cellCount === 0 && (scrollLeft !== 0 || scrollTop !== 0)) {
|
|
this._setScrollPosition({
|
|
scrollLeft: 0,
|
|
scrollTop: 0
|
|
});
|
|
} else if (nextProps.scrollLeft !== this.props.scrollLeft || nextProps.scrollTop !== this.props.scrollTop) {
|
|
this._setScrollPosition({
|
|
scrollLeft: nextProps.scrollLeft,
|
|
scrollTop: nextProps.scrollTop
|
|
});
|
|
}
|
|
|
|
if (nextProps.cellCount !== this.props.cellCount || nextProps.cellLayoutManager !== this.props.cellLayoutManager || this._calculateSizeAndPositionDataOnNextUpdate) {
|
|
nextProps.cellLayoutManager.calculateSizeAndPositionData();
|
|
}
|
|
|
|
if (this._calculateSizeAndPositionDataOnNextUpdate) {
|
|
this._calculateSizeAndPositionDataOnNextUpdate = false;
|
|
}
|
|
}
|
|
}, {
|
|
key: 'render',
|
|
value: function render() {
|
|
var _props3 = this.props,
|
|
autoHeight = _props3.autoHeight,
|
|
cellCount = _props3.cellCount,
|
|
cellLayoutManager = _props3.cellLayoutManager,
|
|
className = _props3.className,
|
|
height = _props3.height,
|
|
horizontalOverscanSize = _props3.horizontalOverscanSize,
|
|
id = _props3.id,
|
|
noContentRenderer = _props3.noContentRenderer,
|
|
style = _props3.style,
|
|
verticalOverscanSize = _props3.verticalOverscanSize,
|
|
width = _props3.width;
|
|
var _state3 = this.state,
|
|
isScrolling = _state3.isScrolling,
|
|
scrollLeft = _state3.scrollLeft,
|
|
scrollTop = _state3.scrollTop;
|
|
|
|
var _cellLayoutManager$ge2 = cellLayoutManager.getTotalSize(),
|
|
totalHeight = _cellLayoutManager$ge2.height,
|
|
totalWidth = _cellLayoutManager$ge2.width;
|
|
|
|
// Safely expand the rendered area by the specified overscan amount
|
|
|
|
|
|
var left = Math.max(0, scrollLeft - horizontalOverscanSize);
|
|
var top = Math.max(0, scrollTop - verticalOverscanSize);
|
|
var right = Math.min(totalWidth, scrollLeft + width + horizontalOverscanSize);
|
|
var bottom = Math.min(totalHeight, scrollTop + height + verticalOverscanSize);
|
|
|
|
var childrenToDisplay = height > 0 && width > 0 ? cellLayoutManager.cellRenderers({
|
|
height: bottom - top,
|
|
isScrolling: isScrolling,
|
|
width: right - left,
|
|
x: left,
|
|
y: top
|
|
}) : [];
|
|
|
|
var collectionStyle = {
|
|
boxSizing: 'border-box',
|
|
direction: 'ltr',
|
|
height: autoHeight ? 'auto' : height,
|
|
position: 'relative',
|
|
WebkitOverflowScrolling: 'touch',
|
|
width: width,
|
|
willChange: 'transform'
|
|
};
|
|
|
|
// 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 = totalHeight > height ? this._scrollbarSize : 0;
|
|
var horizontalScrollBarSize = totalWidth > width ? this._scrollbarSize : 0;
|
|
|
|
// 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
|
|
collectionStyle.overflowX = totalWidth + verticalScrollBarSize <= width ? 'hidden' : 'auto';
|
|
collectionStyle.overflowY = totalHeight + horizontalScrollBarSize <= height ? 'hidden' : 'auto';
|
|
|
|
return _react2.default.createElement(
|
|
'div',
|
|
{
|
|
ref: this._setScrollingContainerRef,
|
|
'aria-label': this.props['aria-label'],
|
|
className: (0, _classnames2.default)('ReactVirtualized__Collection', className),
|
|
id: id,
|
|
onScroll: this._onScroll,
|
|
role: 'grid',
|
|
style: _extends({}, collectionStyle, style),
|
|
tabIndex: 0
|
|
},
|
|
cellCount > 0 && _react2.default.createElement(
|
|
'div',
|
|
{
|
|
className: 'ReactVirtualized__Collection__innerScrollContainer',
|
|
style: {
|
|
height: totalHeight,
|
|
maxHeight: totalHeight,
|
|
maxWidth: totalWidth,
|
|
overflow: 'hidden',
|
|
pointerEvents: isScrolling ? 'none' : '',
|
|
width: totalWidth
|
|
}
|
|
},
|
|
childrenToDisplay
|
|
),
|
|
cellCount === 0 && noContentRenderer()
|
|
);
|
|
}
|
|
|
|
/* ---------------------------- Helper methods ---------------------------- */
|
|
|
|
/**
|
|
* Sets an :isScrolling flag for a small window of time.
|
|
* This flag is used to disable pointer events on the scrollable portion of the Collection.
|
|
* This prevents jerky/stuttery mouse-wheel scrolling.
|
|
*/
|
|
|
|
}, {
|
|
key: '_enablePointerEventsAfterDelay',
|
|
value: function _enablePointerEventsAfterDelay() {
|
|
var _this2 = this;
|
|
|
|
if (this._disablePointerEventsTimeoutId) {
|
|
clearTimeout(this._disablePointerEventsTimeoutId);
|
|
}
|
|
|
|
this._disablePointerEventsTimeoutId = setTimeout(function () {
|
|
var isScrollingChange = _this2.props.isScrollingChange;
|
|
|
|
|
|
isScrollingChange(false);
|
|
|
|
_this2._disablePointerEventsTimeoutId = null;
|
|
_this2.setState({
|
|
isScrolling: false
|
|
});
|
|
}, IS_SCROLLING_TIMEOUT);
|
|
}
|
|
}, {
|
|
key: '_invokeOnSectionRenderedHelper',
|
|
value: function _invokeOnSectionRenderedHelper() {
|
|
var _props4 = this.props,
|
|
cellLayoutManager = _props4.cellLayoutManager,
|
|
onSectionRendered = _props4.onSectionRendered;
|
|
|
|
|
|
this._onSectionRenderedMemoizer({
|
|
callback: onSectionRendered,
|
|
indices: {
|
|
indices: cellLayoutManager.getLastRenderedIndices()
|
|
}
|
|
});
|
|
}
|
|
}, {
|
|
key: '_invokeOnScrollMemoizer',
|
|
value: function _invokeOnScrollMemoizer(_ref) {
|
|
var _this3 = this;
|
|
|
|
var scrollLeft = _ref.scrollLeft,
|
|
scrollTop = _ref.scrollTop,
|
|
totalHeight = _ref.totalHeight,
|
|
totalWidth = _ref.totalWidth;
|
|
|
|
this._onScrollMemoizer({
|
|
callback: function callback(_ref2) {
|
|
var scrollLeft = _ref2.scrollLeft,
|
|
scrollTop = _ref2.scrollTop;
|
|
var _props5 = _this3.props,
|
|
height = _props5.height,
|
|
onScroll = _props5.onScroll,
|
|
width = _props5.width;
|
|
|
|
|
|
onScroll({
|
|
clientHeight: height,
|
|
clientWidth: width,
|
|
scrollHeight: totalHeight,
|
|
scrollLeft: scrollLeft,
|
|
scrollTop: scrollTop,
|
|
scrollWidth: totalWidth
|
|
});
|
|
},
|
|
indices: {
|
|
scrollLeft: scrollLeft,
|
|
scrollTop: scrollTop
|
|
}
|
|
});
|
|
}
|
|
}, {
|
|
key: '_setScrollingContainerRef',
|
|
value: function _setScrollingContainerRef(ref) {
|
|
this._scrollingContainer = ref;
|
|
}
|
|
}, {
|
|
key: '_setScrollPosition',
|
|
value: function _setScrollPosition(_ref3) {
|
|
var scrollLeft = _ref3.scrollLeft,
|
|
scrollTop = _ref3.scrollTop;
|
|
|
|
var newState = {
|
|
scrollPositionChangeReason: SCROLL_POSITION_CHANGE_REASONS.REQUESTED
|
|
};
|
|
|
|
if (scrollLeft >= 0) {
|
|
newState.scrollLeft = scrollLeft;
|
|
}
|
|
|
|
if (scrollTop >= 0) {
|
|
newState.scrollTop = scrollTop;
|
|
}
|
|
|
|
if (scrollLeft >= 0 && scrollLeft !== this.state.scrollLeft || scrollTop >= 0 && scrollTop !== this.state.scrollTop) {
|
|
this.setState(newState);
|
|
}
|
|
}
|
|
}, {
|
|
key: '_updateScrollPositionForScrollToCell',
|
|
value: function _updateScrollPositionForScrollToCell() {
|
|
var _props6 = this.props,
|
|
cellLayoutManager = _props6.cellLayoutManager,
|
|
height = _props6.height,
|
|
scrollToAlignment = _props6.scrollToAlignment,
|
|
scrollToCell = _props6.scrollToCell,
|
|
width = _props6.width;
|
|
var _state4 = this.state,
|
|
scrollLeft = _state4.scrollLeft,
|
|
scrollTop = _state4.scrollTop;
|
|
|
|
|
|
if (scrollToCell >= 0) {
|
|
var scrollPosition = cellLayoutManager.getScrollPositionForCell({
|
|
align: scrollToAlignment,
|
|
cellIndex: scrollToCell,
|
|
height: height,
|
|
scrollLeft: scrollLeft,
|
|
scrollTop: scrollTop,
|
|
width: width
|
|
});
|
|
|
|
if (scrollPosition.scrollLeft !== scrollLeft || scrollPosition.scrollTop !== scrollTop) {
|
|
this._setScrollPosition(scrollPosition);
|
|
}
|
|
}
|
|
}
|
|
}, {
|
|
key: '_onScroll',
|
|
value: function _onScroll(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) {
|
|
return;
|
|
}
|
|
|
|
// Prevent pointer events from interrupting a smooth scroll
|
|
this._enablePointerEventsAfterDelay();
|
|
|
|
// 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 scrollTop never exceeds the total height.
|
|
var _props7 = this.props,
|
|
cellLayoutManager = _props7.cellLayoutManager,
|
|
height = _props7.height,
|
|
isScrollingChange = _props7.isScrollingChange,
|
|
width = _props7.width;
|
|
|
|
var scrollbarSize = this._scrollbarSize;
|
|
|
|
var _cellLayoutManager$ge3 = cellLayoutManager.getTotalSize(),
|
|
totalHeight = _cellLayoutManager$ge3.height,
|
|
totalWidth = _cellLayoutManager$ge3.width;
|
|
|
|
var scrollLeft = Math.max(0, Math.min(totalWidth - width + scrollbarSize, event.target.scrollLeft));
|
|
var scrollTop = Math.max(0, Math.min(totalHeight - height + scrollbarSize, event.target.scrollTop));
|
|
|
|
// 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) {
|
|
// Browsers with cancelable scroll events (eg. Firefox) interrupt scrolling animations if scrollTop/scrollLeft is set.
|
|
// Other browsers (eg. Safari) don't scroll as well without the help under certain conditions (DOM or style changes during scrolling).
|
|
// All things considered, this seems to be the best current work around that I'm aware of.
|
|
// For more information see https://github.com/bvaughn/react-virtualized/pull/124
|
|
var scrollPositionChangeReason = event.cancelable ? SCROLL_POSITION_CHANGE_REASONS.OBSERVED : SCROLL_POSITION_CHANGE_REASONS.REQUESTED;
|
|
|
|
// Synchronously set :isScrolling the first time (since _setNextState will reschedule its animation frame each time it's called)
|
|
if (!this.state.isScrolling) {
|
|
isScrollingChange(true);
|
|
}
|
|
|
|
this.setState({
|
|
isScrolling: true,
|
|
scrollLeft: scrollLeft,
|
|
scrollPositionChangeReason: scrollPositionChangeReason,
|
|
scrollTop: scrollTop
|
|
});
|
|
}
|
|
|
|
this._invokeOnScrollMemoizer({
|
|
scrollLeft: scrollLeft,
|
|
scrollTop: scrollTop,
|
|
totalWidth: totalWidth,
|
|
totalHeight: totalHeight
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return CollectionView;
|
|
}(_react.PureComponent);
|
|
|
|
CollectionView.defaultProps = {
|
|
'aria-label': 'grid',
|
|
horizontalOverscanSize: 0,
|
|
noContentRenderer: function noContentRenderer() {
|
|
return null;
|
|
},
|
|
onScroll: function onScroll() {
|
|
return null;
|
|
},
|
|
onSectionRendered: function onSectionRendered() {
|
|
return null;
|
|
},
|
|
scrollToAlignment: 'auto',
|
|
scrollToCell: -1,
|
|
style: {},
|
|
verticalOverscanSize: 0
|
|
};
|
|
exports.default = CollectionView;
|
|
process.env.NODE_ENV !== "production" ? CollectionView.propTypes = {
|
|
'aria-label': _propTypes2.default.string,
|
|
|
|
/**
|
|
* Removes fixed height from the scrollingContainer so that the total height
|
|
* of rows can stretch the window. Intended for use with WindowScroller
|
|
*/
|
|
autoHeight: _propTypes2.default.bool,
|
|
|
|
/**
|
|
* Number of cells in collection.
|
|
*/
|
|
cellCount: _propTypes2.default.number.isRequired,
|
|
|
|
/**
|
|
* Calculates cell sizes and positions and manages rendering the appropriate cells given a specified window.
|
|
*/
|
|
cellLayoutManager: _propTypes2.default.object.isRequired,
|
|
|
|
/**
|
|
* Optional custom CSS class name to attach to root Collection element.
|
|
*/
|
|
className: _propTypes2.default.string,
|
|
|
|
/**
|
|
* Height of Collection; this property determines the number of visible (vs virtualized) rows.
|
|
*/
|
|
height: _propTypes2.default.number.isRequired,
|
|
|
|
/**
|
|
* Optional custom id to attach to root Collection element.
|
|
*/
|
|
id: _propTypes2.default.string,
|
|
|
|
/**
|
|
* Enables the `Collection` to horiontally "overscan" its content similar to how `Grid` does.
|
|
* This can reduce flicker around the edges when a user scrolls quickly.
|
|
*/
|
|
horizontalOverscanSize: _propTypes2.default.number.isRequired,
|
|
|
|
isScrollingChange: _propTypes2.default.func,
|
|
|
|
/**
|
|
* Optional renderer to be used in place of rows when either :rowCount or :cellCount is 0.
|
|
*/
|
|
noContentRenderer: _propTypes2.default.func.isRequired,
|
|
|
|
/**
|
|
* 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.
|
|
* ({ clientHeight, clientWidth, scrollHeight, scrollLeft, scrollTop, scrollWidth }): void
|
|
*/
|
|
onScroll: _propTypes2.default.func.isRequired,
|
|
|
|
/**
|
|
* Callback invoked with information about the section of the Collection that was just rendered.
|
|
* This callback is passed a named :indices parameter which is an Array of the most recently rendered section indices.
|
|
*/
|
|
onSectionRendered: _propTypes2.default.func.isRequired,
|
|
|
|
/**
|
|
* Horizontal offset.
|
|
*/
|
|
scrollLeft: _propTypes2.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: _propTypes2.default.oneOf(['auto', 'end', 'start', 'center']).isRequired,
|
|
|
|
/**
|
|
* Cell index to ensure visible (by forcefully scrolling if necessary).
|
|
*/
|
|
scrollToCell: _propTypes2.default.number.isRequired,
|
|
|
|
/**
|
|
* Vertical offset.
|
|
*/
|
|
scrollTop: _propTypes2.default.number,
|
|
|
|
/**
|
|
* Optional custom inline style to attach to root Collection element.
|
|
*/
|
|
style: _propTypes2.default.object,
|
|
|
|
/**
|
|
* Enables the `Collection` to vertically "overscan" its content similar to how `Grid` does.
|
|
* This can reduce flicker around the edges when a user scrolls quickly.
|
|
*/
|
|
verticalOverscanSize: _propTypes2.default.number.isRequired,
|
|
|
|
/**
|
|
* Width of Collection; this property determines the number of visible (vs virtualized) columns.
|
|
*/
|
|
width: _propTypes2.default.number.isRequired
|
|
} : void 0; |