virtual-scroller 1.7.9 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -1
- package/README.md +139 -33
- package/babel.config.js +25 -0
- package/babel.js +5 -0
- package/bundle/index-bypass.html +1 -1
- package/bundle/index-dom.html +1 -1
- package/bundle/index-grid.html +1 -2
- package/bundle/index-scrollableContainer.html +1 -1
- package/bundle/index-tbody-scrollableContainer.html +2 -0
- package/bundle/index-tbody.html +2 -0
- package/bundle/virtual-scroller-dom.js +1 -1
- package/bundle/virtual-scroller-dom.js.map +1 -1
- package/bundle/virtual-scroller-react.js +1 -1
- package/bundle/virtual-scroller-react.js.map +1 -1
- package/bundle/virtual-scroller.js +1 -1
- package/bundle/virtual-scroller.js.map +1 -1
- package/commonjs/BeforeResize.js +319 -0
- package/commonjs/BeforeResize.js.map +1 -0
- package/commonjs/DOM/Engine.js +46 -0
- package/commonjs/DOM/Engine.js.map +1 -0
- package/commonjs/DOM/ItemsContainer.js +78 -0
- package/commonjs/DOM/ItemsContainer.js.map +1 -0
- package/commonjs/DOM/{WaitForStylesToLoad.js → ListTopOffsetWatcher.js} +56 -35
- package/commonjs/DOM/ListTopOffsetWatcher.js.map +1 -0
- package/commonjs/DOM/ScrollableContainer.js +48 -80
- package/commonjs/DOM/ScrollableContainer.js.map +1 -1
- package/commonjs/DOM/VirtualScroller.js +20 -15
- package/commonjs/DOM/VirtualScroller.js.map +1 -1
- package/commonjs/DOM/tbody.js +2 -2
- package/commonjs/ItemHeights.js +13 -20
- package/commonjs/ItemHeights.js.map +1 -1
- package/commonjs/Layout.js +588 -215
- package/commonjs/Layout.js.map +1 -1
- package/commonjs/Layout.test.js +191 -0
- package/commonjs/Layout.test.js.map +1 -0
- package/commonjs/ListHeightChangeWatcher.js +126 -0
- package/commonjs/ListHeightChangeWatcher.js.map +1 -0
- package/commonjs/Resize.js +22 -21
- package/commonjs/Resize.js.map +1 -1
- package/commonjs/Scroll.js +148 -88
- package/commonjs/Scroll.js.map +1 -1
- package/commonjs/VirtualScroller.js +1269 -390
- package/commonjs/VirtualScroller.js.map +1 -1
- package/commonjs/getItemCoordinates.js.map +1 -1
- package/commonjs/getItemsDiff.js.map +1 -1
- package/commonjs/getVerticalSpacing.js +8 -8
- package/commonjs/getVerticalSpacing.js.map +1 -1
- package/commonjs/react/VirtualScroller.js +31 -37
- package/commonjs/react/VirtualScroller.js.map +1 -1
- package/commonjs/utility/debounce.js +26 -4
- package/commonjs/utility/debounce.js.map +1 -1
- package/commonjs/utility/debug.js +51 -12
- package/commonjs/utility/debug.js.map +1 -1
- package/commonjs/utility/getStateSnapshot.js +50 -0
- package/commonjs/utility/getStateSnapshot.js.map +1 -0
- package/commonjs/utility/px.js +1 -1
- package/commonjs/utility/px.js.map +1 -1
- package/commonjs/utility/px.test.js +14 -0
- package/commonjs/utility/px.test.js.map +1 -0
- package/commonjs/utility/shallowEqual.js +1 -1
- package/commonjs/utility/shallowEqual.js.map +1 -1
- package/commonjs/utility/throttle.js.map +1 -1
- package/dom/index.d.ts +23 -0
- package/index.d.ts +84 -0
- package/modules/BeforeResize.js +310 -0
- package/modules/BeforeResize.js.map +1 -0
- package/modules/DOM/Engine.js +27 -0
- package/modules/DOM/Engine.js.map +1 -0
- package/modules/DOM/ItemsContainer.js +71 -0
- package/modules/DOM/ItemsContainer.js.map +1 -0
- package/modules/DOM/{WaitForStylesToLoad.js → ListTopOffsetWatcher.js} +57 -35
- package/modules/DOM/ListTopOffsetWatcher.js.map +1 -0
- package/modules/DOM/ScrollableContainer.js +47 -79
- package/modules/DOM/ScrollableContainer.js.map +1 -1
- package/modules/DOM/VirtualScroller.js +15 -14
- package/modules/DOM/VirtualScroller.js.map +1 -1
- package/modules/ItemHeights.js +8 -19
- package/modules/ItemHeights.js.map +1 -1
- package/modules/Layout.js +582 -213
- package/modules/Layout.js.map +1 -1
- package/modules/Layout.test.js +185 -0
- package/modules/Layout.test.js.map +1 -0
- package/modules/ListHeightChangeWatcher.js +119 -0
- package/modules/ListHeightChangeWatcher.js.map +1 -0
- package/modules/Resize.js +21 -20
- package/modules/Resize.js.map +1 -1
- package/modules/Scroll.js +148 -87
- package/modules/Scroll.js.map +1 -1
- package/modules/VirtualScroller.js +1263 -390
- package/modules/VirtualScroller.js.map +1 -1
- package/modules/getItemCoordinates.js.map +1 -1
- package/modules/getItemsDiff.js.map +1 -1
- package/modules/getVerticalSpacing.js +8 -8
- package/modules/getVerticalSpacing.js.map +1 -1
- package/modules/react/VirtualScroller.js +31 -37
- package/modules/react/VirtualScroller.js.map +1 -1
- package/modules/utility/debounce.js +26 -4
- package/modules/utility/debounce.js.map +1 -1
- package/modules/utility/debug.js +47 -10
- package/modules/utility/debug.js.map +1 -1
- package/modules/utility/getStateSnapshot.js +43 -0
- package/modules/utility/getStateSnapshot.js.map +1 -0
- package/modules/utility/px.js +1 -1
- package/modules/utility/px.js.map +1 -1
- package/modules/utility/px.test.js +9 -0
- package/modules/utility/px.test.js.map +1 -0
- package/modules/utility/shallowEqual.js +1 -1
- package/modules/utility/shallowEqual.js.map +1 -1
- package/modules/utility/throttle.js.map +1 -1
- package/package.json +24 -22
- package/react/index.d.ts +27 -0
- package/source/BeforeResize.js +317 -0
- package/source/DOM/Engine.js +32 -0
- package/source/DOM/ItemsContainer.js +48 -0
- package/source/DOM/{WaitForStylesToLoad.js → ListTopOffsetWatcher.js} +48 -22
- package/source/DOM/ScrollableContainer.js +31 -55
- package/source/DOM/VirtualScroller.js +6 -7
- package/source/ItemHeights.js +10 -15
- package/source/Layout.js +626 -252
- package/source/Layout.test.js +171 -0
- package/source/ListHeightChangeWatcher.js +94 -0
- package/source/Resize.js +23 -15
- package/source/Scroll.js +139 -78
- package/source/VirtualScroller.js +1240 -286
- package/source/getVerticalSpacing.js +7 -7
- package/source/react/VirtualScroller.js +2 -18
- package/source/utility/debounce.js +20 -3
- package/source/utility/debug.js +34 -3
- package/source/utility/getStateSnapshot.js +36 -0
- package/source/utility/px.js +1 -1
- package/source/utility/px.test.js +9 -0
- package/website/index-bypass.html +195 -0
- package/website/index-grid.html +0 -1
- package/website/index-scrollableContainer.html +208 -0
- package/website/index-tbody-scrollableContainer.html +68 -0
- package/website/index-tbody.html +55 -0
- package/commonjs/DOM/RenderingEngine.js +0 -33
- package/commonjs/DOM/RenderingEngine.js.map +0 -1
- package/commonjs/DOM/Screen.js +0 -87
- package/commonjs/DOM/Screen.js.map +0 -1
- package/commonjs/DOM/WaitForStylesToLoad.js.map +0 -1
- package/commonjs/RestoreScroll.js +0 -118
- package/commonjs/RestoreScroll.js.map +0 -1
- package/modules/DOM/RenderingEngine.js +0 -19
- package/modules/DOM/RenderingEngine.js.map +0 -1
- package/modules/DOM/Screen.js +0 -80
- package/modules/DOM/Screen.js.map +0 -1
- package/modules/DOM/WaitForStylesToLoad.js.map +0 -1
- package/modules/RestoreScroll.js +0 -111
- package/modules/RestoreScroll.js.map +0 -1
- package/source/DOM/RenderingEngine.js +0 -22
- package/source/DOM/Screen.js +0 -51
- package/source/RestoreScroll.js +0 -86
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
var _excluded = ["onMount", "onItemUnmount"];
|
|
2
|
+
|
|
3
|
+
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; }
|
|
4
|
+
|
|
5
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
2
6
|
|
|
3
7
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
8
|
|
|
@@ -16,10 +20,8 @@ import VirtualScrollerCore from '../VirtualScroller';
|
|
|
16
20
|
import log, { warn } from '../utility/debug';
|
|
17
21
|
import px from '../utility/px';
|
|
18
22
|
|
|
19
|
-
var VirtualScroller =
|
|
20
|
-
|
|
21
|
-
function () {
|
|
22
|
-
function VirtualScroller(element, _items, renderItem) {
|
|
23
|
+
var VirtualScroller = /*#__PURE__*/function () {
|
|
24
|
+
function VirtualScroller(itemsContainerElement, _items, renderItem) {
|
|
23
25
|
var _this = this;
|
|
24
26
|
|
|
25
27
|
var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
@@ -49,15 +51,14 @@ function () {
|
|
|
49
51
|
var diffRender = prevState && items === prevState.items && items.length > 0; // Remove no longer visible items from the DOM.
|
|
50
52
|
|
|
51
53
|
if (diffRender) {
|
|
52
|
-
|
|
54
|
+
// Decrement instead of increment here because
|
|
53
55
|
// `this.container.removeChild()` changes indexes.
|
|
54
|
-
|
|
55
56
|
var _i = prevState.lastShownItemIndex;
|
|
56
57
|
|
|
57
58
|
while (_i >= prevState.firstShownItemIndex) {
|
|
58
59
|
if (_i >= firstShownItemIndex && _i <= lastShownItemIndex) {// The item is still visible.
|
|
59
60
|
} else {
|
|
60
|
-
log('Remove item index', _i); // The item is no longer visible. Remove it.
|
|
61
|
+
log('DOM: Remove element for item index', _i); // The item is no longer visible. Remove it.
|
|
61
62
|
|
|
62
63
|
_this.unmountItem(_this.container.childNodes[_i - prevState.firstShownItemIndex]);
|
|
63
64
|
}
|
|
@@ -65,7 +66,7 @@ function () {
|
|
|
65
66
|
_i--;
|
|
66
67
|
}
|
|
67
68
|
} else {
|
|
68
|
-
log('Rerender from scratch');
|
|
69
|
+
log('DOM: Rerender the list from scratch');
|
|
69
70
|
|
|
70
71
|
while (_this.container.firstChild) {
|
|
71
72
|
_this.unmountItem(_this.container.firstChild);
|
|
@@ -88,11 +89,11 @@ function () {
|
|
|
88
89
|
var item = _this.renderItem(items[i]);
|
|
89
90
|
|
|
90
91
|
if (shouldPrependItems) {
|
|
91
|
-
log('Prepend item index', i); // Append `item` to `this.container` before the retained items.
|
|
92
|
+
log('DOM: Prepend element for item index', i); // Append `item` to `this.container` before the retained items.
|
|
92
93
|
|
|
93
94
|
_this.container.insertBefore(item, prependBeforeItemElement);
|
|
94
95
|
} else {
|
|
95
|
-
log('Append item index', i); // Append `item` to `this.container`.
|
|
96
|
+
log('DOM: Append element for item index', i); // Append `item` to `this.container`.
|
|
96
97
|
|
|
97
98
|
_this.container.appendChild(item);
|
|
98
99
|
}
|
|
@@ -118,18 +119,18 @@ function () {
|
|
|
118
119
|
_this.virtualScroller.stop();
|
|
119
120
|
});
|
|
120
121
|
|
|
121
|
-
this.container =
|
|
122
|
+
this.container = itemsContainerElement;
|
|
122
123
|
this.renderItem = renderItem;
|
|
123
124
|
|
|
124
125
|
var onMount = options.onMount,
|
|
125
126
|
onItemUnmount = options.onItemUnmount,
|
|
126
|
-
restOptions = _objectWithoutProperties(options,
|
|
127
|
+
restOptions = _objectWithoutProperties(options, _excluded);
|
|
127
128
|
|
|
128
129
|
this.onItemUnmount = onItemUnmount;
|
|
129
130
|
this.tbody = this.container.tagName === 'TBODY';
|
|
130
131
|
this.virtualScroller = new VirtualScrollerCore(function () {
|
|
131
132
|
return _this.container;
|
|
132
|
-
}, _items, _objectSpread({}, restOptions, {
|
|
133
|
+
}, _items, _objectSpread(_objectSpread({}, restOptions), {}, {
|
|
133
134
|
tbody: this.tbody,
|
|
134
135
|
onStateChange: this.onStateChange
|
|
135
136
|
})); // `onMount()` option is deprecated due to no longer being used.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../source/DOM/VirtualScroller.js"],"names":["VirtualScrollerCore","log","warn","px","VirtualScroller","
|
|
1
|
+
{"version":3,"sources":["../../source/DOM/VirtualScroller.js"],"names":["VirtualScrollerCore","log","warn","px","VirtualScroller","itemsContainerElement","items","renderItem","options","state","prevState","firstShownItemIndex","lastShownItemIndex","beforeItemsHeight","afterItemsHeight","tbody","container","style","paddingTop","paddingBottom","diffRender","length","i","unmountItem","childNodes","firstChild","shouldPrependItems","prependBeforeItemElement","item","insertBefore","appendChild","stop","virtualScroller","onMount","onItemUnmount","restOptions","tagName","onStateChange","listen","itemElement","removeChild","onItemHeightChange","newItems","setItems"],"mappings":"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","sourcesContent":["import VirtualScrollerCore from '../VirtualScroller'\r\n\r\nimport log, { warn } from '../utility/debug'\r\nimport px from '../utility/px'\r\n\r\nexport default class VirtualScroller {\r\n constructor(itemsContainerElement, items, renderItem, options = {}) {\r\n this.container = itemsContainerElement\r\n this.renderItem = renderItem\r\n const {\r\n onMount,\r\n onItemUnmount,\r\n ...restOptions\r\n } = options\r\n this.onItemUnmount = onItemUnmount\r\n this.tbody = this.container.tagName === 'TBODY'\r\n this.virtualScroller = new VirtualScrollerCore(\r\n () => this.container,\r\n items,\r\n {\r\n ...restOptions,\r\n tbody: this.tbody,\r\n onStateChange: this.onStateChange\r\n }\r\n )\r\n // `onMount()` option is deprecated due to no longer being used.\r\n // If someone thinks there's a valid use case for it, create an issue.\r\n if (onMount) {\r\n onMount()\r\n }\r\n this.virtualScroller.listen()\r\n }\r\n\r\n onStateChange = (state, prevState) => {\r\n const {\r\n items,\r\n firstShownItemIndex,\r\n lastShownItemIndex,\r\n beforeItemsHeight,\r\n afterItemsHeight\r\n } = state\r\n log('~ On state change ~')\r\n log('Previous state', prevState)\r\n log('New state', state)\r\n // Set container padding top and bottom.\r\n // Work around `<tbody/>` not being able to have `padding`.\r\n // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1\r\n // `this.virtualScroller` hasn't been initialized yet at this stage,\r\n // so using `this.tbody` instead of `this.virtualScroller.tbody`.\r\n if (!this.tbody) {\r\n this.container.style.paddingTop = px(beforeItemsHeight)\r\n this.container.style.paddingBottom = px(afterItemsHeight)\r\n }\r\n // Perform an intelligent \"diff\" re-render if the `items` are the same.\r\n const diffRender = prevState && items === prevState.items && items.length > 0\r\n // Remove no longer visible items from the DOM.\r\n if (diffRender) {\r\n // Decrement instead of increment here because\r\n // `this.container.removeChild()` changes indexes.\r\n let i = prevState.lastShownItemIndex\r\n while (i >= prevState.firstShownItemIndex) {\r\n if (i >= firstShownItemIndex && i <= lastShownItemIndex) {\r\n // The item is still visible.\r\n } else {\r\n log('DOM: Remove element for item index', i)\r\n // The item is no longer visible. Remove it.\r\n this.unmountItem(this.container.childNodes[i - prevState.firstShownItemIndex])\r\n }\r\n i--\r\n }\r\n } else {\r\n log('DOM: Rerender the list from scratch')\r\n while (this.container.firstChild) {\r\n this.unmountItem(this.container.firstChild)\r\n }\r\n }\r\n // Add newly visible items to the DOM.\r\n let shouldPrependItems = diffRender\r\n const prependBeforeItemElement = shouldPrependItems && this.container.firstChild\r\n let i = firstShownItemIndex\r\n while (i <= lastShownItemIndex) {\r\n if (diffRender && i >= prevState.firstShownItemIndex && i <= prevState.lastShownItemIndex) {\r\n // The item is already being rendered.\r\n // Next items will be appended rather than prepended.\r\n if (shouldPrependItems) {\r\n shouldPrependItems = false\r\n }\r\n } else {\r\n const item = this.renderItem(items[i])\r\n if (shouldPrependItems) {\r\n log('DOM: Prepend element for item index', i)\r\n // Append `item` to `this.container` before the retained items.\r\n this.container.insertBefore(item, prependBeforeItemElement)\r\n } else {\r\n log('DOM: Append element for item index', i)\r\n // Append `item` to `this.container`.\r\n this.container.appendChild(item)\r\n }\r\n }\r\n i++\r\n }\r\n }\r\n\r\n // Public API. Should be \"bound\" to `this`.\r\n onUnmount = () => {\r\n warn('`.onUnmount()` instance method name is deprecated, use `.stop()` instance method name instead.')\r\n this.stop()\r\n }\r\n\r\n // Public API. Should be \"bound\" to `this`.\r\n destroy = () => {\r\n warn('`.destroy()` instance method name is deprecated, use `.stop()` instance method name instead.')\r\n this.stop()\r\n }\r\n\r\n // Public API. Should be \"bound\" to `this`.\r\n stop = () => {\r\n this.virtualScroller.stop()\r\n }\r\n\r\n unmountItem(itemElement) {\r\n this.container.removeChild(itemElement)\r\n if (this.onItemUnmount) {\r\n this.onItemUnmount(itemElement)\r\n }\r\n }\r\n\r\n onItemHeightChange(i) {\r\n this.virtualScroller.onItemHeightChange(i)\r\n }\r\n\r\n /**\r\n * @deprecated\r\n * `.updateItems()` has been renamed to `.setItems()`.\r\n */\r\n updateItems(newItems, options) {\r\n this.setItems(newItems, options)\r\n }\r\n\r\n setItems(newItems, options) {\r\n this.virtualScroller.setItems(newItems, options)\r\n }\r\n\r\n /*\r\n getItemCoordinates(i) {\r\n return this.virtualScroller.getItemCoordinates(i)\r\n }\r\n */\r\n}"],"file":"VirtualScroller.js"}
|
package/modules/ItemHeights.js
CHANGED
|
@@ -6,14 +6,11 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
|
|
|
6
6
|
|
|
7
7
|
import log, { warn, isDebug, reportError } from './utility/debug';
|
|
8
8
|
|
|
9
|
-
var ItemHeights =
|
|
10
|
-
|
|
11
|
-
function () {
|
|
12
|
-
function ItemHeights(screen, getContainerElement, getItemHeight, setItemHeight) {
|
|
9
|
+
var ItemHeights = /*#__PURE__*/function () {
|
|
10
|
+
function ItemHeights(container, getItemHeight, setItemHeight) {
|
|
13
11
|
_classCallCheck(this, ItemHeights);
|
|
14
12
|
|
|
15
|
-
this.
|
|
16
|
-
this.getContainerElement = getContainerElement;
|
|
13
|
+
this.container = container;
|
|
17
14
|
this._get = getItemHeight;
|
|
18
15
|
this._set = setItemHeight;
|
|
19
16
|
this.reset();
|
|
@@ -81,15 +78,7 @@ function () {
|
|
|
81
78
|
}, {
|
|
82
79
|
key: "_measureItemHeight",
|
|
83
80
|
value: function _measureItemHeight(i, firstShownItemIndex) {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
if (container) {
|
|
87
|
-
var elementIndex = i - firstShownItemIndex;
|
|
88
|
-
|
|
89
|
-
if (elementIndex >= 0 && elementIndex < this.screen.getChildElementsCount(container)) {
|
|
90
|
-
return this.screen.getChildElementHeight(container, elementIndex);
|
|
91
|
-
}
|
|
92
|
-
}
|
|
81
|
+
return this.container.getNthRenderedItemHeight(i - firstShownItemIndex);
|
|
93
82
|
}
|
|
94
83
|
/**
|
|
95
84
|
* Measures item heights:
|
|
@@ -113,7 +102,8 @@ function () {
|
|
|
113
102
|
}, {
|
|
114
103
|
key: "measureItemHeights",
|
|
115
104
|
value: function measureItemHeights(firstShownItemIndex, lastShownItemIndex) {
|
|
116
|
-
// If no items are rendered, don't measure anything.
|
|
105
|
+
log('~ Measure item heights ~'); // If no items are rendered, don't measure anything.
|
|
106
|
+
|
|
117
107
|
if (firstShownItemIndex === undefined) {
|
|
118
108
|
return;
|
|
119
109
|
} // Reset `this.measuredItemsHeight` if it's not a "continuous" measured items list:
|
|
@@ -149,11 +139,10 @@ function () {
|
|
|
149
139
|
// // then the user might have clicked that "Show more" button.
|
|
150
140
|
if (this._get(i) === undefined) {
|
|
151
141
|
nonPreviouslyMeasuredItemIndexes.push(i);
|
|
152
|
-
log('Item', i, 'hasn\'t been previously measured');
|
|
153
142
|
|
|
154
143
|
var height = this._measureItemHeight(i, firstShownItemIndex);
|
|
155
144
|
|
|
156
|
-
log('
|
|
145
|
+
log('Item index', i, 'height', height);
|
|
157
146
|
|
|
158
147
|
this._set(i, height); // Update average item height calculation variables
|
|
159
148
|
// related to the previously measured items
|
|
@@ -202,7 +191,7 @@ function () {
|
|
|
202
191
|
var _height = this._measureItemHeight(i, firstShownItemIndex);
|
|
203
192
|
|
|
204
193
|
if (previousHeight !== _height) {
|
|
205
|
-
warn('Item', i, 'height was', previousHeight, 'before it was hidden, but, after showing it again, its height is', _height, '. Perhaps you forgot to persist the item\'s state by calling `onItemStateChange(i, newState)` when it changed, and that state got lost when the item element was unmounted, which resulted in a different height when the item was shown again, but with the missing state.');
|
|
194
|
+
warn('Item index', i, 'height was', previousHeight, 'before it was hidden, but, after showing it again, its height is', _height, '. Perhaps you forgot to persist the item\'s state by calling `onItemStateChange(i, newState)` when it changed, and that state got lost when the item element was unmounted, which resulted in a different height when the item was shown again, but with the missing state.');
|
|
206
195
|
}
|
|
207
196
|
}
|
|
208
197
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../source/ItemHeights.js"],"names":["log","warn","isDebug","reportError","ItemHeights","screen","getContainerElement","getItemHeight","setItemHeight","_get","_set","reset","measuredItemsHeight","firstMeasuredItemIndex","undefined","lastMeasuredItemIndex","itemHeights","i","length","firstShownItemIndex","container","elementIndex","getChildElementsCount","getChildElementHeight","lastShownItemIndex","nonPreviouslyMeasuredItemIndexes","previousFirstMeasuredItemIndex","previousLastMeasuredItemIndex","firstMeasuredItemIndexHasBeenUpdated","push","height","_measureItemHeight","previousHeight","count"],"mappings":"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","sourcesContent":["import log, { warn, isDebug, reportError } from './utility/debug'\r\n\r\nexport default class ItemHeights {\r\n\tconstructor(screen, getContainerElement, getItemHeight, setItemHeight) {\r\n\t\tthis.screen = screen\r\n\t\tthis.getContainerElement = getContainerElement\r\n\t\tthis._get = getItemHeight\r\n\t\tthis._set = setItemHeight\r\n\t\tthis.reset()\r\n\t}\r\n\r\n\treset() {\r\n\t\tthis.measuredItemsHeight = 0\r\n\t\t// \"First measured item index\" variable was introduced\r\n\t\t// because it's not always `0`: when `virtualScroller.setItems()`\r\n\t\t// is called, some items might get prepended, in which case\r\n\t\t// `this.lastMeasuredItemIndex` is updated. If there was no\r\n\t\t// `this.firstMeasuredItemIndex`, then the average item height\r\n\t\t// calculated in `.getAverage()` would be incorrect in the timeframe\r\n\t\t// between `.setItems()` is called and those changes have been rendered.\r\n\t\t// And in that timeframe, `.getAverage()` is used to calculate the \"layout\":\r\n\t\t// stuff like \"before/after items height\" and \"estimated items count on screen\".\r\n\t\tthis.firstMeasuredItemIndex = undefined\r\n\t\tthis.lastMeasuredItemIndex = undefined\r\n\t}\r\n\r\n\t/**\r\n\t * Is called after `.reset()`.\r\n\t * Initializes `this.measuredItemsHeight`, `this.firstMeasuredItemIndex`\r\n\t * and `this.lastMeasuredItemIndex` instance variables from `VirtualScroller` `state`.\r\n\t * These instance variables are used when calculating \"average\" item height:\r\n\t * the \"average\" item height is simply `this.measuredItemsHeight` divided by\r\n\t * `this.lastMeasuredItemIndex` minus `this.firstMeasuredItemIndex` plus 1.\r\n\t */\r\n\tinitialize(itemHeights) {\r\n\t\tlet i = 0\r\n\t\twhile (i < itemHeights.length) {\r\n\t\t\tif (itemHeights[i] === undefined) {\r\n\t\t\t\tif (this.firstMeasuredItemIndex !== undefined) {\r\n\t\t\t\t\tthis.lastMeasuredItemIndex = i - 1\r\n\t\t\t\t\tbreak\r\n\t\t\t\t}\r\n\t\t\t} else {\r\n\t\t\t\tif (this.firstMeasuredItemIndex === undefined) {\r\n\t\t\t\t\tthis.firstMeasuredItemIndex = i\r\n\t\t\t\t}\r\n\t\t\t\tthis.measuredItemsHeight += itemHeights[i]\r\n\t\t\t}\r\n\t\t\ti++\r\n\t\t}\r\n\t}\r\n\r\n\t// Seems to be no longer used.\r\n\t// getItemHeight(i, firstShownItemIndex) {\r\n\t// \tif (this._get(i)) {\r\n\t// \t\treturn this._get(i)\r\n\t// \t}\r\n\t// \tconst itemHeight = this._measureItemHeight(i, firstShownItemIndex)\r\n\t// \tif (itemHeight) {\r\n\t// \t\tthis._set(i, itemHeight)\r\n\t// \t\treturn itemHeight\r\n\t// \t}\r\n\t// \treturn this.getAverage()\r\n\t// }\r\n\r\n\t_measureItemHeight(i, firstShownItemIndex) {\r\n\t\tconst container = this.getContainerElement()\r\n\t\tif (container) {\r\n\t\t\tconst elementIndex = i - firstShownItemIndex\r\n\t\t\tif (elementIndex >= 0 && elementIndex < this.screen.getChildElementsCount(container)) {\r\n\t\t\t\treturn this.screen.getChildElementHeight(container, elementIndex)\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t/**\r\n\t * Measures item heights:\r\n\t *\r\n\t * * For the items that haven't been previously measured,\r\n\t * measures them for the first time.\r\n\t *\r\n\t * * For the items that have been previoulsy measured,\r\n\t * validate that their previously measured height\r\n\t * is still equal to their current height.\r\n\t * The unequalness may not necessarily be caused by\r\n\t * incorrect use of `virtual-scroller`: there are\r\n\t * also some valid use cases when such unequalness\r\n\t * could happen (see the comments in the code).\r\n\t *\r\n\t * @param {number} firstShownItemIndex\r\n\t * @param {number} lastShownItemIndex\r\n\t * @return {number[]} The indexes of the items that have not previously been measured and have been measured now.\r\n\t */\r\n\tmeasureItemHeights(firstShownItemIndex, lastShownItemIndex) {\r\n\t\t// If no items are rendered, don't measure anything.\r\n\t\tif (firstShownItemIndex === undefined) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\t// Reset `this.measuredItemsHeight` if it's not a \"continuous\" measured items list:\r\n\t\t// if a group of items has been measured previously, and now it has rendered a completely\r\n\t\t// different group of items, and there's a non-measured \"gap\" between those two groups,\r\n\t\t// then reset `this.measuredItemsHeight` and \"first measured\"/\"last measured\" item indexes.\r\n\t\t// For example, this could happen when `.setItems()` prepends a lot of new items.\r\n\t\tif (this.firstMeasuredItemIndex !== undefined) {\r\n\t\t\tif (firstShownItemIndex > this.lastMeasuredItemIndex + 1 ||\r\n\t\t\t\t\tlastShownItemIndex < this.firstMeasuredItemIndex - 1) {\r\n\t\t\t\t// Reset.\r\n\t\t\t\tlog('Non-measured items gap detected. Reset first and last measured item indexes.')\r\n\t\t\t\tthis.reset()\r\n\t\t\t}\r\n\t\t}\r\n\t\tconst nonPreviouslyMeasuredItemIndexes = []\r\n\t\tconst previousFirstMeasuredItemIndex = this.firstMeasuredItemIndex\r\n\t\tconst previousLastMeasuredItemIndex = this.lastMeasuredItemIndex\r\n\t\tlet firstMeasuredItemIndexHasBeenUpdated = false\r\n\t\tlet i = firstShownItemIndex\r\n\t\twhile (i <= lastShownItemIndex) {\r\n\t\t\t// Don't re-measure item heights that have been measured previously.\r\n\t\t\t// The rationale is that developers are supposed to manually call\r\n\t\t\t// `.onItemHeightChange()` every time an item's height changes.\r\n\t\t\t// If developers aren't neglecting that rule, item heights won't\r\n\t\t\t// change unexpectedly.\r\n\t\t\t// // Re-measure all shown items' heights, because an item's height\r\n\t\t\t// // might have changed since it has been measured initially.\r\n\t\t\t// // For example, if an item is a long comment with a \"Show more\" button,\r\n\t\t\t// // then the user might have clicked that \"Show more\" button.\r\n\t\t\tif (this._get(i) === undefined) {\r\n\t\t\t\tnonPreviouslyMeasuredItemIndexes.push(i)\r\n\t\t\t\tlog('Item', i, 'hasn\\'t been previously measured')\r\n\t\t\t\tconst height = this._measureItemHeight(i, firstShownItemIndex)\r\n\t\t\t\tlog('Height', height)\r\n\t\t\t\tthis._set(i, height)\r\n\t\t\t\t// Update average item height calculation variables\r\n\t\t\t\t// related to the previously measured items\r\n\t\t\t\t// that're above the items currently being shown.\r\n\t\t\t\t// It is known to be a \"continuous\" measured items list,\r\n\t\t\t\t// because the code at the start of this function checks that.\r\n\t\t\t\tif (previousFirstMeasuredItemIndex === undefined || i < previousFirstMeasuredItemIndex) {\r\n\t\t\t\t\tthis.measuredItemsHeight += height\r\n\t\t\t\t\t// Update first measured item index.\r\n\t\t\t\t\tif (!firstMeasuredItemIndexHasBeenUpdated) {\r\n\t\t\t\t\t\t// log('Set first measured item index', i)\r\n\t\t\t\t\t\tthis.firstMeasuredItemIndex = i\r\n\t\t\t\t\t\tfirstMeasuredItemIndexHasBeenUpdated = true\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t// Update average item height calculation variables\r\n\t\t\t\t// related to the previously measured items\r\n\t\t\t\t// that're below the items currently being shown.\r\n\t\t\t\t// It is known to be a \"continuous\" measured items list,\r\n\t\t\t\t// because the code at the start of this function checks that.\r\n\t\t\t\tif (previousLastMeasuredItemIndex === undefined || i > previousLastMeasuredItemIndex) {\r\n\t\t\t\t\t// If `previousLastMeasuredItemIndex` is `undefined`\r\n\t\t\t\t\t// then `previousFirstMeasuredItemIndex` is also `undefined`\r\n\t\t\t\t\t// which means that the item's `height` has already been added\r\n\t\t\t\t\t// to `this.measuredItemsHeight` in the code above,\r\n\t\t\t\t\t// so this condition guards against counting the item's `height`\r\n\t\t\t\t\t// twice in `this.measuredItemsHeight`.\r\n\t\t\t\t\tif (previousLastMeasuredItemIndex !== undefined) {\r\n\t\t\t\t\t\t// Add newly shown item height.\r\n\t\t\t\t\t\tthis.measuredItemsHeight += height\r\n\t\t\t\t\t}\r\n\t\t\t\t\t// Update last measured item index.\r\n\t\t\t\t\tthis.lastMeasuredItemIndex = i\r\n\t\t\t\t}\r\n\t\t\t} else {\r\n\t\t\t\t// Validate the item's height right after showing it after being hidden,\r\n\t\t\t\t// because, if the stored item's state isn't applied properly, the item's\r\n\t\t\t\t// height might be incorrect when it's rendered with that state not applied,\r\n\t\t\t\t// and so a developer could know that there's a bug in their code.\r\n\t\t\t\tconst previousHeight = this._get(i)\r\n\t\t\t\tconst height = this._measureItemHeight(i, firstShownItemIndex)\r\n\t\t\t\tif (previousHeight !== height) {\r\n\t\t\t\t\twarn('Item', i, 'height was', previousHeight, 'before it was hidden, but, after showing it again, its height is', height, '. Perhaps you forgot to persist the item\\'s state by calling `onItemStateChange(i, newState)` when it changed, and that state got lost when the item element was unmounted, which resulted in a different height when the item was shown again, but with the missing state.')\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t\ti++\r\n\t\t}\r\n\t\t// // Update average item height.\r\n\t\t// this.updateAverageItemHeight()\r\n\t\treturn nonPreviouslyMeasuredItemIndexes\r\n\t}\r\n\r\n\t/**\r\n\t * Re-measures item height.\r\n\t * @param {number} i — Item index.\r\n\t * @param {number} firstShownItemIndex\r\n\t */\r\n\tremeasureItemHeight(i, firstShownItemIndex) {\r\n\t\tconst previousHeight = this._get(i)\r\n\t\tconst height = this._measureItemHeight(i, firstShownItemIndex)\r\n\t\t// // Because this function is called from `.onItemHeightChange()`,\r\n\t\t// // there're no guarantees in which circumstances a developer calls it,\r\n\t\t// // and for which item indexes.\r\n\t\t// // Therefore, to guard against cases of incorrect usage,\r\n\t\t// // this function won't crash anything if the item isn't rendered\r\n\t\t// // or hasn't been previously rendered.\r\n\t\t// if (height !== undefined) {\r\n\t\t// \treportError(`\"onItemHeightChange()\" has been called for item ${i}, but that item isn't rendered.`)\r\n\t\t// \treturn\r\n\t\t// }\r\n\t\t// if (previousHeight === undefined) {\r\n\t\t// \treportError(`\"onItemHeightChange()\" has been called for item ${i}, but that item hasn't been rendered before.`)\r\n\t\t// \treturn\r\n\t\t// }\r\n\t\tthis._set(i, height)\r\n\t\tthis.measuredItemsHeight += height - previousHeight\r\n\t\treturn height\r\n\t}\r\n\r\n\t// /**\r\n\t// * \"Average\" item height is stored as an instance variable.\r\n\t// * For example, for caching, so that it isn't calculated every time it's requested.\r\n\t// * But that would be negligible performance gain, not really worth the extra code.\r\n\t// * Another thing it's stored for as an instance variable is\r\n\t// * keeping \"previous\" \"average\" item height, because it can be more precise\r\n\t// * than the newly calculated \"average\" item height, provided it had\r\n\t// * more \"samples\" (measured items). The newly calculated average item height\r\n\t// * could get less samples in a scenario when the scroll somehow jumps\r\n\t// * from one position to some other distant position: in that case previous\r\n\t// * \"total measured items height\" is discarded and the new one is initialized.\r\n\t// * Could such situation happen in real life? I guess, it's unlikely.\r\n\t// * So I'm commenting out this code, but still keeping it just in case.\r\n\t// */\r\n\t// updateAverageItemHeight() {\r\n\t// \tthis.averageItemHeightSamplesCount = this.lastMeasuredItemIndex - this.firstMeasuredItemIndex + 1\r\n\t// \tthis.averageItemHeight = this.measuredItemsHeight / this.averageItemHeightSamplesCount\r\n\t// }\r\n\t//\r\n\t// /**\r\n\t// * Public API: is called by `VirtualScroller`.\r\n\t// * @return {number}\r\n\t// */\r\n\t// getAverage() {\r\n\t// \t// Previously measured average item height might still be\r\n\t// \t// more precise if it contains more measured items (\"samples\").\r\n\t// \tif (this.previousAverageItemHeight) {\r\n\t// \t\tif (this.previousAverageItemHeightSamplesCount > this.averageItemHeightSamplesCount) {\r\n\t// \t\t\treturn this.previousAverageItemHeight\r\n\t// \t\t}\r\n\t// \t}\r\n\t// \treturn this.averageItemHeight || 0\r\n\t// }\r\n\r\n\t/**\r\n\t * Public API: is called by `VirtualScroller`.\r\n\t * @return {number}\r\n\t */\r\n\tgetAverage() {\r\n\t\tif (this.lastMeasuredItemIndex === undefined) {\r\n\t\t\treturn 0\r\n\t\t}\r\n\t\treturn this.measuredItemsHeight / (this.lastMeasuredItemIndex - this.firstMeasuredItemIndex + 1)\r\n\t}\r\n\r\n\tonPrepend(count) {\r\n\t\tif (this.firstMeasuredItemIndex !== undefined) {\r\n\t\t\tthis.firstMeasuredItemIndex += count\r\n\t\t\tthis.lastMeasuredItemIndex += count\r\n\t\t}\r\n\t}\r\n}"],"file":"ItemHeights.js"}
|
|
1
|
+
{"version":3,"sources":["../source/ItemHeights.js"],"names":["log","warn","isDebug","reportError","ItemHeights","container","getItemHeight","setItemHeight","_get","_set","reset","measuredItemsHeight","firstMeasuredItemIndex","undefined","lastMeasuredItemIndex","itemHeights","i","length","firstShownItemIndex","getNthRenderedItemHeight","lastShownItemIndex","nonPreviouslyMeasuredItemIndexes","previousFirstMeasuredItemIndex","previousLastMeasuredItemIndex","firstMeasuredItemIndexHasBeenUpdated","push","height","_measureItemHeight","previousHeight","count"],"mappings":"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","sourcesContent":["import log, { warn, isDebug, reportError } from './utility/debug'\r\n\r\nexport default class ItemHeights {\r\n\tconstructor(container, getItemHeight, setItemHeight) {\r\n\t\tthis.container = container\r\n\t\tthis._get = getItemHeight\r\n\t\tthis._set = setItemHeight\r\n\t\tthis.reset()\r\n\t}\r\n\r\n\treset() {\r\n\t\tthis.measuredItemsHeight = 0\r\n\t\t// \"First measured item index\" variable was introduced\r\n\t\t// because it's not always `0`: when `virtualScroller.setItems()`\r\n\t\t// is called, some items might get prepended, in which case\r\n\t\t// `this.lastMeasuredItemIndex` is updated. If there was no\r\n\t\t// `this.firstMeasuredItemIndex`, then the average item height\r\n\t\t// calculated in `.getAverage()` would be incorrect in the timeframe\r\n\t\t// between `.setItems()` is called and those changes have been rendered.\r\n\t\t// And in that timeframe, `.getAverage()` is used to calculate the \"layout\":\r\n\t\t// stuff like \"before/after items height\" and \"estimated items count on screen\".\r\n\t\tthis.firstMeasuredItemIndex = undefined\r\n\t\tthis.lastMeasuredItemIndex = undefined\r\n\t}\r\n\r\n\t/**\r\n\t * Is called after `.reset()`.\r\n\t * Initializes `this.measuredItemsHeight`, `this.firstMeasuredItemIndex`\r\n\t * and `this.lastMeasuredItemIndex` instance variables from `VirtualScroller` `state`.\r\n\t * These instance variables are used when calculating \"average\" item height:\r\n\t * the \"average\" item height is simply `this.measuredItemsHeight` divided by\r\n\t * `this.lastMeasuredItemIndex` minus `this.firstMeasuredItemIndex` plus 1.\r\n\t */\r\n\tinitialize(itemHeights) {\r\n\t\tlet i = 0\r\n\t\twhile (i < itemHeights.length) {\r\n\t\t\tif (itemHeights[i] === undefined) {\r\n\t\t\t\tif (this.firstMeasuredItemIndex !== undefined) {\r\n\t\t\t\t\tthis.lastMeasuredItemIndex = i - 1\r\n\t\t\t\t\tbreak\r\n\t\t\t\t}\r\n\t\t\t} else {\r\n\t\t\t\tif (this.firstMeasuredItemIndex === undefined) {\r\n\t\t\t\t\tthis.firstMeasuredItemIndex = i\r\n\t\t\t\t}\r\n\t\t\t\tthis.measuredItemsHeight += itemHeights[i]\r\n\t\t\t}\r\n\t\t\ti++\r\n\t\t}\r\n\t}\r\n\r\n\t// Seems to be no longer used.\r\n\t// getItemHeight(i, firstShownItemIndex) {\r\n\t// \tif (this._get(i)) {\r\n\t// \t\treturn this._get(i)\r\n\t// \t}\r\n\t// \tconst itemHeight = this._measureItemHeight(i, firstShownItemIndex)\r\n\t// \tif (itemHeight) {\r\n\t// \t\tthis._set(i, itemHeight)\r\n\t// \t\treturn itemHeight\r\n\t// \t}\r\n\t// \treturn this.getAverage()\r\n\t// }\r\n\r\n\t_measureItemHeight(i, firstShownItemIndex) {\r\n\t\treturn this.container.getNthRenderedItemHeight(i - firstShownItemIndex)\r\n\t}\r\n\r\n\t/**\r\n\t * Measures item heights:\r\n\t *\r\n\t * * For the items that haven't been previously measured,\r\n\t * measures them for the first time.\r\n\t *\r\n\t * * For the items that have been previoulsy measured,\r\n\t * validate that their previously measured height\r\n\t * is still equal to their current height.\r\n\t * The unequalness may not necessarily be caused by\r\n\t * incorrect use of `virtual-scroller`: there are\r\n\t * also some valid use cases when such unequalness\r\n\t * could happen (see the comments in the code).\r\n\t *\r\n\t * @param {number} firstShownItemIndex\r\n\t * @param {number} lastShownItemIndex\r\n\t * @return {number[]} The indexes of the items that have not previously been measured and have been measured now.\r\n\t */\r\n\tmeasureItemHeights(firstShownItemIndex, lastShownItemIndex) {\r\n\t\tlog('~ Measure item heights ~')\r\n\t\t// If no items are rendered, don't measure anything.\r\n\t\tif (firstShownItemIndex === undefined) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\t// Reset `this.measuredItemsHeight` if it's not a \"continuous\" measured items list:\r\n\t\t// if a group of items has been measured previously, and now it has rendered a completely\r\n\t\t// different group of items, and there's a non-measured \"gap\" between those two groups,\r\n\t\t// then reset `this.measuredItemsHeight` and \"first measured\"/\"last measured\" item indexes.\r\n\t\t// For example, this could happen when `.setItems()` prepends a lot of new items.\r\n\t\tif (this.firstMeasuredItemIndex !== undefined) {\r\n\t\t\tif (\r\n\t\t\t\tfirstShownItemIndex > this.lastMeasuredItemIndex + 1 ||\r\n\t\t\t\tlastShownItemIndex < this.firstMeasuredItemIndex - 1\r\n\t\t\t) {\r\n\t\t\t\t// Reset.\r\n\t\t\t\tlog('Non-measured items gap detected. Reset first and last measured item indexes.')\r\n\t\t\t\tthis.reset()\r\n\t\t\t}\r\n\t\t}\r\n\t\tconst nonPreviouslyMeasuredItemIndexes = []\r\n\t\tconst previousFirstMeasuredItemIndex = this.firstMeasuredItemIndex\r\n\t\tconst previousLastMeasuredItemIndex = this.lastMeasuredItemIndex\r\n\t\tlet firstMeasuredItemIndexHasBeenUpdated = false\r\n\t\tlet i = firstShownItemIndex\r\n\t\twhile (i <= lastShownItemIndex) {\r\n\t\t\t// Don't re-measure item heights that have been measured previously.\r\n\t\t\t// The rationale is that developers are supposed to manually call\r\n\t\t\t// `.onItemHeightChange()` every time an item's height changes.\r\n\t\t\t// If developers aren't neglecting that rule, item heights won't\r\n\t\t\t// change unexpectedly.\r\n\t\t\t// // Re-measure all shown items' heights, because an item's height\r\n\t\t\t// // might have changed since it has been measured initially.\r\n\t\t\t// // For example, if an item is a long comment with a \"Show more\" button,\r\n\t\t\t// // then the user might have clicked that \"Show more\" button.\r\n\t\t\tif (this._get(i) === undefined) {\r\n\t\t\t\tnonPreviouslyMeasuredItemIndexes.push(i)\r\n\t\t\t\tconst height = this._measureItemHeight(i, firstShownItemIndex)\r\n\t\t\t\tlog('Item index', i, 'height', height)\r\n\t\t\t\tthis._set(i, height)\r\n\t\t\t\t// Update average item height calculation variables\r\n\t\t\t\t// related to the previously measured items\r\n\t\t\t\t// that're above the items currently being shown.\r\n\t\t\t\t// It is known to be a \"continuous\" measured items list,\r\n\t\t\t\t// because the code at the start of this function checks that.\r\n\t\t\t\tif (previousFirstMeasuredItemIndex === undefined || i < previousFirstMeasuredItemIndex) {\r\n\t\t\t\t\tthis.measuredItemsHeight += height\r\n\t\t\t\t\t// Update first measured item index.\r\n\t\t\t\t\tif (!firstMeasuredItemIndexHasBeenUpdated) {\r\n\t\t\t\t\t\t// log('Set first measured item index', i)\r\n\t\t\t\t\t\tthis.firstMeasuredItemIndex = i\r\n\t\t\t\t\t\tfirstMeasuredItemIndexHasBeenUpdated = true\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t// Update average item height calculation variables\r\n\t\t\t\t// related to the previously measured items\r\n\t\t\t\t// that're below the items currently being shown.\r\n\t\t\t\t// It is known to be a \"continuous\" measured items list,\r\n\t\t\t\t// because the code at the start of this function checks that.\r\n\t\t\t\tif (previousLastMeasuredItemIndex === undefined || i > previousLastMeasuredItemIndex) {\r\n\t\t\t\t\t// If `previousLastMeasuredItemIndex` is `undefined`\r\n\t\t\t\t\t// then `previousFirstMeasuredItemIndex` is also `undefined`\r\n\t\t\t\t\t// which means that the item's `height` has already been added\r\n\t\t\t\t\t// to `this.measuredItemsHeight` in the code above,\r\n\t\t\t\t\t// so this condition guards against counting the item's `height`\r\n\t\t\t\t\t// twice in `this.measuredItemsHeight`.\r\n\t\t\t\t\tif (previousLastMeasuredItemIndex !== undefined) {\r\n\t\t\t\t\t\t// Add newly shown item height.\r\n\t\t\t\t\t\tthis.measuredItemsHeight += height\r\n\t\t\t\t\t}\r\n\t\t\t\t\t// Update last measured item index.\r\n\t\t\t\t\tthis.lastMeasuredItemIndex = i\r\n\t\t\t\t}\r\n\t\t\t} else {\r\n\t\t\t\t// Validate the item's height right after showing it after being hidden,\r\n\t\t\t\t// because, if the stored item's state isn't applied properly, the item's\r\n\t\t\t\t// height might be incorrect when it's rendered with that state not applied,\r\n\t\t\t\t// and so a developer could know that there's a bug in their code.\r\n\t\t\t\tconst previousHeight = this._get(i)\r\n\t\t\t\tconst height = this._measureItemHeight(i, firstShownItemIndex)\r\n\t\t\t\tif (previousHeight !== height) {\r\n\t\t\t\t\twarn('Item index', i, 'height was', previousHeight, 'before it was hidden, but, after showing it again, its height is', height, '. Perhaps you forgot to persist the item\\'s state by calling `onItemStateChange(i, newState)` when it changed, and that state got lost when the item element was unmounted, which resulted in a different height when the item was shown again, but with the missing state.')\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t\ti++\r\n\t\t}\r\n\t\t// // Update average item height.\r\n\t\t// this.updateAverageItemHeight()\r\n\t\treturn nonPreviouslyMeasuredItemIndexes\r\n\t}\r\n\r\n\t/**\r\n\t * Re-measures item height.\r\n\t * @param {number} i — Item index.\r\n\t * @param {number} firstShownItemIndex\r\n\t */\r\n\tremeasureItemHeight(i, firstShownItemIndex) {\r\n\t\tconst previousHeight = this._get(i)\r\n\t\tconst height = this._measureItemHeight(i, firstShownItemIndex)\r\n\t\t// // Because this function is called from `.onItemHeightChange()`,\r\n\t\t// // there're no guarantees in which circumstances a developer calls it,\r\n\t\t// // and for which item indexes.\r\n\t\t// // Therefore, to guard against cases of incorrect usage,\r\n\t\t// // this function won't crash anything if the item isn't rendered\r\n\t\t// // or hasn't been previously rendered.\r\n\t\t// if (height !== undefined) {\r\n\t\t// \treportError(`\"onItemHeightChange()\" has been called for item ${i}, but that item isn't rendered.`)\r\n\t\t// \treturn\r\n\t\t// }\r\n\t\t// if (previousHeight === undefined) {\r\n\t\t// \treportError(`\"onItemHeightChange()\" has been called for item ${i}, but that item hasn't been rendered before.`)\r\n\t\t// \treturn\r\n\t\t// }\r\n\t\tthis._set(i, height)\r\n\t\tthis.measuredItemsHeight += height - previousHeight\r\n\t\treturn height\r\n\t}\r\n\r\n\t// /**\r\n\t// * \"Average\" item height is stored as an instance variable.\r\n\t// * For example, for caching, so that it isn't calculated every time it's requested.\r\n\t// * But that would be negligible performance gain, not really worth the extra code.\r\n\t// * Another thing it's stored for as an instance variable is\r\n\t// * keeping \"previous\" \"average\" item height, because it can be more precise\r\n\t// * than the newly calculated \"average\" item height, provided it had\r\n\t// * more \"samples\" (measured items). The newly calculated average item height\r\n\t// * could get less samples in a scenario when the scroll somehow jumps\r\n\t// * from one position to some other distant position: in that case previous\r\n\t// * \"total measured items height\" is discarded and the new one is initialized.\r\n\t// * Could such situation happen in real life? I guess, it's unlikely.\r\n\t// * So I'm commenting out this code, but still keeping it just in case.\r\n\t// */\r\n\t// updateAverageItemHeight() {\r\n\t// \tthis.averageItemHeightSamplesCount = this.lastMeasuredItemIndex - this.firstMeasuredItemIndex + 1\r\n\t// \tthis.averageItemHeight = this.measuredItemsHeight / this.averageItemHeightSamplesCount\r\n\t// }\r\n\t//\r\n\t// /**\r\n\t// * Public API: is called by `VirtualScroller`.\r\n\t// * @return {number}\r\n\t// */\r\n\t// getAverage() {\r\n\t// \t// Previously measured average item height might still be\r\n\t// \t// more precise if it contains more measured items (\"samples\").\r\n\t// \tif (this.previousAverageItemHeight) {\r\n\t// \t\tif (this.previousAverageItemHeightSamplesCount > this.averageItemHeightSamplesCount) {\r\n\t// \t\t\treturn this.previousAverageItemHeight\r\n\t// \t\t}\r\n\t// \t}\r\n\t// \treturn this.averageItemHeight || 0\r\n\t// }\r\n\r\n\t/**\r\n\t * Public API: is called by `VirtualScroller`.\r\n\t * @return {number}\r\n\t */\r\n\tgetAverage() {\r\n\t\tif (this.lastMeasuredItemIndex === undefined) {\r\n\t\t\treturn 0\r\n\t\t}\r\n\t\treturn this.measuredItemsHeight / (this.lastMeasuredItemIndex - this.firstMeasuredItemIndex + 1)\r\n\t}\r\n\r\n\tonPrepend(count) {\r\n\t\tif (this.firstMeasuredItemIndex !== undefined) {\r\n\t\t\tthis.firstMeasuredItemIndex += count\r\n\t\t\tthis.lastMeasuredItemIndex += count\r\n\t\t}\r\n\t}\r\n}"],"file":"ItemHeights.js"}
|