virtual-scroller 1.11.3 → 1.12.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/README.md +6 -4
- 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/DOM/ItemsContainer.js +10 -3
- package/commonjs/DOM/ItemsContainer.js.map +1 -1
- package/commonjs/ItemNotRenderedError.js +64 -0
- package/commonjs/ItemNotRenderedError.js.map +1 -0
- package/commonjs/Layout.test.js +10 -0
- package/commonjs/Layout.test.js.map +1 -1
- package/commonjs/VirtualScroller.js +2 -1
- package/commonjs/VirtualScroller.js.map +1 -1
- package/commonjs/VirtualScroller.layout.js +61 -19
- package/commonjs/VirtualScroller.layout.js.map +1 -1
- package/commonjs/VirtualScroller.onRender.js +97 -45
- package/commonjs/VirtualScroller.onRender.js.map +1 -1
- package/commonjs/VirtualScroller.state.js +50 -18
- package/commonjs/VirtualScroller.state.js.map +1 -1
- package/commonjs/react/VirtualScroller.js +26 -42
- package/commonjs/react/VirtualScroller.js.map +1 -1
- package/commonjs/react/useItemKeys.js +11 -3
- package/commonjs/react/useItemKeys.js.map +1 -1
- package/commonjs/react/useOnChange.js +19 -0
- package/commonjs/react/useOnChange.js.map +1 -0
- package/commonjs/react/{useHandleItemsPropertyChange.js → useSetNewItemsOnItemsPropertyChange.js} +15 -14
- package/commonjs/react/useSetNewItemsOnItemsPropertyChange.js.map +1 -0
- package/commonjs/react/useState.js +162 -69
- package/commonjs/react/useState.js.map +1 -1
- package/commonjs/react/useStyle.js +3 -5
- package/commonjs/react/useStyle.js.map +1 -1
- package/commonjs/react/useUpdateItemKeysOnItemsChange.js +61 -0
- package/commonjs/react/useUpdateItemKeysOnItemsChange.js.map +1 -0
- package/commonjs/test/ItemsContainer.js +22 -1
- package/commonjs/test/ItemsContainer.js.map +1 -1
- package/commonjs/utility/debug.js +30 -6
- package/commonjs/utility/debug.js.map +1 -1
- package/index.cjs +2 -0
- package/index.d.ts +6 -0
- package/index.js +1 -0
- package/modules/DOM/ItemsContainer.js +8 -3
- package/modules/DOM/ItemsContainer.js.map +1 -1
- package/modules/ItemNotRenderedError.js +57 -0
- package/modules/ItemNotRenderedError.js.map +1 -0
- package/modules/Layout.test.js +10 -0
- package/modules/Layout.test.js.map +1 -1
- package/modules/VirtualScroller.js +2 -1
- package/modules/VirtualScroller.js.map +1 -1
- package/modules/VirtualScroller.layout.js +58 -19
- package/modules/VirtualScroller.layout.js.map +1 -1
- package/modules/VirtualScroller.onRender.js +98 -46
- package/modules/VirtualScroller.onRender.js.map +1 -1
- package/modules/VirtualScroller.state.js +50 -18
- package/modules/VirtualScroller.state.js.map +1 -1
- package/modules/react/VirtualScroller.js +26 -42
- package/modules/react/VirtualScroller.js.map +1 -1
- package/modules/react/useItemKeys.js +8 -3
- package/modules/react/useItemKeys.js.map +1 -1
- package/modules/react/useOnChange.js +11 -0
- package/modules/react/useOnChange.js.map +1 -0
- package/modules/react/{useHandleItemsPropertyChange.js → useSetNewItemsOnItemsPropertyChange.js} +11 -13
- package/modules/react/useSetNewItemsOnItemsPropertyChange.js.map +1 -0
- package/modules/react/useState.js +156 -73
- package/modules/react/useState.js.map +1 -1
- package/modules/react/useStyle.js +3 -5
- package/modules/react/useStyle.js.map +1 -1
- package/{commonjs/react/useHandleItemIndexesChange.js → modules/react/useUpdateItemKeysOnItemsChange.js} +18 -21
- package/modules/react/useUpdateItemKeysOnItemsChange.js.map +1 -0
- package/modules/test/ItemsContainer.js +20 -1
- package/modules/test/ItemsContainer.js.map +1 -1
- package/modules/utility/debug.js +31 -6
- package/modules/utility/debug.js.map +1 -1
- package/package.json +1 -1
- package/source/DOM/ItemsContainer.js +8 -3
- package/source/ItemNotRenderedError.js +16 -0
- package/source/Layout.test.js +9 -0
- package/source/VirtualScroller.js +2 -0
- package/source/VirtualScroller.layout.js +57 -18
- package/source/VirtualScroller.onRender.js +95 -42
- package/source/VirtualScroller.state.js +57 -20
- package/source/react/VirtualScroller.js +23 -35
- package/source/react/useItemKeys.js +9 -2
- package/source/react/useOnChange.js +11 -0
- package/source/react/{useHandleItemsPropertyChange.js → useSetNewItemsOnItemsPropertyChange.js} +11 -11
- package/source/react/useState.js +159 -71
- package/source/react/useStyle.js +2 -2
- package/source/react/{useHandleItemIndexesChange.js → useUpdateItemKeysOnItemsChange.js} +17 -9
- package/source/test/ItemsContainer.js +22 -1
- package/source/utility/debug.js +18 -4
- package/commonjs/react/useHandleItemIndexesChange.js.map +0 -1
- package/commonjs/react/useHandleItemsPropertyChange.js.map +0 -1
- package/modules/react/useHandleItemIndexesChange.js +0 -45
- package/modules/react/useHandleItemIndexesChange.js.map +0 -1
- package/modules/react/useHandleItemsPropertyChange.js.map +0 -1
|
@@ -73,7 +73,13 @@ function createStateHelpers(_ref) {
|
|
|
73
73
|
(0, _debug["default"])('New state' + '\n' + JSON.stringify(newItemState, null, 2));
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
_this.getState().itemStates[i] = newItemState; //
|
|
76
|
+
_this.getState().itemStates[i] = newItemState; // If there was a request for `setState()` with new `items`, then the changes
|
|
77
|
+
// to `currentState.itemStates[]` made above would be overwritten when that
|
|
78
|
+
// pending `setState()` call gets applied.
|
|
79
|
+
// To fix that, the updates to current `itemStates[]` are noted in
|
|
80
|
+
// `this.itemStatesThatChangedWhileNewItemsWereBeingRendered` variable.
|
|
81
|
+
// That variable is then checked when the `setState()` call with the new `items`
|
|
82
|
+
// has been updated.
|
|
77
83
|
|
|
78
84
|
if (_this.newItemsWillBeRendered) {
|
|
79
85
|
if (!_this.itemStatesThatChangedWhileNewItemsWereBeingRendered) {
|
|
@@ -102,11 +108,20 @@ function createStateHelpers(_ref) {
|
|
|
102
108
|
}
|
|
103
109
|
}
|
|
104
110
|
|
|
105
|
-
_this._isSettingNewItems = undefined;
|
|
111
|
+
_this._isSettingNewItems = undefined;
|
|
112
|
+
_this.waitingForRender = true; // Store previous `state`.
|
|
106
113
|
|
|
107
|
-
_this.previousState = _this.getState();
|
|
114
|
+
_this.previousState = _this.getState(); // If it's the first call to `this.updateState()` then initialize
|
|
115
|
+
// the most recent `setState()` value to be the current state.
|
|
108
116
|
|
|
109
|
-
_this.
|
|
117
|
+
if (!_this.mostRecentSetStateValue) {
|
|
118
|
+
_this.mostRecentSetStateValue = _this.getState();
|
|
119
|
+
} // Accumulates all "pending" state updates until they have been applied.
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
_this.mostRecentSetStateValue = _objectSpread(_objectSpread({}, _this.mostRecentSetStateValue), stateUpdate); // Update `state`.
|
|
123
|
+
|
|
124
|
+
_this._setState(_this.mostRecentSetStateValue, stateUpdate);
|
|
110
125
|
};
|
|
111
126
|
|
|
112
127
|
this.getInitialState = function () {
|
|
@@ -121,6 +136,7 @@ function createStateHelpers(_ref) {
|
|
|
121
136
|
|
|
122
137
|
this.useState = function (_ref2) {
|
|
123
138
|
var getState = _ref2.getState,
|
|
139
|
+
setState = _ref2.setState,
|
|
124
140
|
updateState = _ref2.updateState;
|
|
125
141
|
|
|
126
142
|
if (_this._isActive) {
|
|
@@ -132,26 +148,37 @@ function createStateHelpers(_ref) {
|
|
|
132
148
|
}
|
|
133
149
|
|
|
134
150
|
if (render) {
|
|
135
|
-
throw new Error('[virtual-scroller] Creating a `VirtualScroller` class instance with a `render()` parameter
|
|
151
|
+
throw new Error('[virtual-scroller] Creating a `VirtualScroller` class instance with a `render()` parameter implies using the default (internal) state storage');
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
if (setState && updateState) {
|
|
155
|
+
throw new Error('[virtual-scroller] When using a custom state storage, one must supply either `setState()` or `updateState()` function but not both');
|
|
136
156
|
}
|
|
137
157
|
|
|
138
|
-
if (!getState || !updateState) {
|
|
139
|
-
throw new Error('[virtual-scroller] When using a custom state storage, one must supply both `getState()` and `updateState()` functions');
|
|
158
|
+
if (!getState || !(setState || updateState)) {
|
|
159
|
+
throw new Error('[virtual-scroller] When using a custom state storage, one must supply both `getState()` and `setState()`/`updateState()` functions');
|
|
140
160
|
}
|
|
141
161
|
|
|
142
162
|
_this._usesCustomStateStorage = true;
|
|
143
163
|
_this._getState = getState;
|
|
144
|
-
|
|
164
|
+
|
|
165
|
+
_this._setState = function (newState, stateUpdate) {
|
|
166
|
+
if (setState) {
|
|
167
|
+
setState(newState);
|
|
168
|
+
} else {
|
|
169
|
+
updateState(stateUpdate);
|
|
170
|
+
}
|
|
171
|
+
};
|
|
145
172
|
};
|
|
146
173
|
|
|
147
174
|
this.useDefaultStateStorage = function () {
|
|
148
175
|
if (!render) {
|
|
149
176
|
throw new Error('[virtual-scroller] When using the default (internal) state management, one must supply a `render(state, prevState)` function parameter');
|
|
150
|
-
} // Create default `getState()`/`
|
|
177
|
+
} // Create default `getState()`/`setState()` functions.
|
|
151
178
|
|
|
152
179
|
|
|
153
180
|
_this._getState = defaultGetState.bind(_this);
|
|
154
|
-
_this.
|
|
181
|
+
_this._setState = defaultSetState.bind(_this); // When `state` is stored externally, a developer is responsible for
|
|
155
182
|
// initializing it with the initial value.
|
|
156
183
|
// Otherwise, if default state management is used, set the initial state now.
|
|
157
184
|
|
|
@@ -167,14 +194,19 @@ function createStateHelpers(_ref) {
|
|
|
167
194
|
this.state = newState;
|
|
168
195
|
}
|
|
169
196
|
|
|
170
|
-
function
|
|
171
|
-
// Because
|
|
172
|
-
//
|
|
173
|
-
//
|
|
174
|
-
//
|
|
175
|
-
//
|
|
176
|
-
//
|
|
177
|
-
|
|
197
|
+
function defaultSetState(newState, stateUpdate) {
|
|
198
|
+
// // Because the default state updates are "synchronous" (immediate),
|
|
199
|
+
// // the `...stateUpdate` could be applied over `...this.state`,
|
|
200
|
+
// // and no state updates would be lost.
|
|
201
|
+
// // But if it was "asynchronous" (not immediate), then `...this.state`
|
|
202
|
+
// // wouldn't work in all cases, because it could be stale in cases
|
|
203
|
+
// // when more than a single `setState()` call is made before
|
|
204
|
+
// // the state actually updates, making some properties of `this.state` stale.
|
|
205
|
+
// this.state = {
|
|
206
|
+
// ...this.state,
|
|
207
|
+
// ...stateUpdate
|
|
208
|
+
// }
|
|
209
|
+
this.state = newState;
|
|
178
210
|
render(this.state, this.previousState);
|
|
179
211
|
this.onRender();
|
|
180
212
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VirtualScroller.state.js","names":["createStateHelpers","initialState","state","getInitialItemState","onStateChange","render","initialItems","items","_render","_setItemState","i","newItemState","isDebug","log","JSON","stringify","getState","itemStates","newItemsWillBeRendered","itemStatesThatChangedWhileNewItemsWereBeingRendered","String","_getState","updateState","stateUpdate","getStateSnapshot","_isSettingNewItems","reportError","undefined","previousState","_updateState","getInitialState","getRestoredState","call","getInitialStateFromScratch","useState","_isActive","Error","_usesCustomStateStorage","useDefaultStateStorage","defaultGetState","bind","defaultUpdateState","setInitialState","defaultSetInitialState","newState","onRender","getInitialLayoutState","beforeStart","fillArray","Array","length","firstShownItemIndex","lastShownItemIndex","cleanUpBeforeResizeState","verticalSpacing","isStateColumnsCountMismatch","columnsCount","getActualColumnsCount","warn","itemsCount","getColumnsCount","layout","getInitialLayoutValueWithFallback","getInitialLayoutValues","beforeItemsHeight","afterItemsHeight","itemHeights","onBeforeShowItems","getActualColumnsCountForState","stateColumnsCount","Math","floor"],"sources":["../source/VirtualScroller.state.js"],"sourcesContent":["import fillArray from './utility/fillArray.js'\r\nimport log, { warn, isDebug, reportError } from './utility/debug.js'\r\nimport { cleanUpBeforeResizeState } from './BeforeResize.js'\r\nimport getStateSnapshot from './utility/getStateSnapshot.js'\r\n\r\n// There're three main places where state is updated:\r\n//\r\n// * On scroll.\r\n// * On window resize.\r\n// * On set new items.\r\n//\r\n// State updates may be \"asynchronous\" (like in React), in which case the\r\n// corresponding operation is \"pending\" until the state update is applied.\r\n//\r\n// If there's a \"pending\" window resize or a \"pending\" update of the set of items,\r\n// then \"on scroll\" updates aren't dispatched.\r\n//\r\n// If there's a \"pending\" on scroll update and the window is resize or a new set\r\n// of items is set, then that \"pending\" on scroll update gets overwritten.\r\n//\r\n// If there's a \"pending\" update of the set of items, then window resize handler\r\n// sees that \"pending\" update and dispatches its own state update so that the\r\n// \"pending\" state update originating from `setItems()` is not lost.\r\n//\r\n// If there's a \"pending\" window resize, and a new set of items is set,\r\n// then the state update of the window resize handler gets overwritten.\r\n\r\nexport default function createStateHelpers({\r\n\tstate: initialState,\r\n\tgetInitialItemState,\r\n\tonStateChange,\r\n\trender,\r\n\titems: initialItems\r\n}) {\r\n\tthis.onStateChange = onStateChange\r\n\tthis._render = render\r\n\r\n\tthis.getInitialItemState = getInitialItemState\r\n\r\n\tthis._setItemState = (i, newItemState) => {\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('~ Item state changed ~')\r\n\t\t\tlog('Item index', i)\r\n\t\t\t// Uses `JSON.stringify()` here instead of just outputting the JSON objects as is\r\n\t\t\t// because outputting JSON objects as is would show different results later when\r\n\t\t\t// the developer inspects those in the web browser console if those state objects\r\n\t\t\t// get modified in between they've been output to the console and the developer\r\n\t\t\t// decided to inspect them.\r\n\t\t\tlog('Previous state' + '\\n' + JSON.stringify(this.getState().itemStates[i], null, 2))\r\n\t\t\tlog('New state' + '\\n' + JSON.stringify(newItemState, null, 2))\r\n\t\t}\r\n\r\n\t\tthis.getState().itemStates[i] = newItemState\r\n\r\n\t\t// Schedule the item state update for after the new items have been rendered.\r\n\t\tif (this.newItemsWillBeRendered) {\r\n\t\t\tif (!this.itemStatesThatChangedWhileNewItemsWereBeingRendered) {\r\n\t\t\t\tthis.itemStatesThatChangedWhileNewItemsWereBeingRendered = {}\r\n\t\t\t}\r\n\t\t\tthis.itemStatesThatChangedWhileNewItemsWereBeingRendered[String(i)] = newItemState\r\n\t\t}\r\n\t}\r\n\r\n\tthis.getState = () => this._getState()\r\n\r\n\tthis.updateState = (stateUpdate) => {\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('~ Set state ~')\r\n\t\t\tlog(getStateSnapshot(stateUpdate))\r\n\t\t}\r\n\r\n\t\t// Ensure that a non-initial `stateUpdate` can only contain an `items`\r\n\t\t// property when it comes from a `setItems()` call.\r\n\t\tif (stateUpdate.items) {\r\n\t\t\tif (!this._isSettingNewItems) {\r\n\t\t\t\treportError('A `stateUpdate` can only contain `items` property as a result of calling `.setItems()`')\r\n\t\t\t}\r\n\t\t}\r\n\t\tthis._isSettingNewItems = undefined\r\n\r\n\t\t// Update `state`.\r\n\t\tthis.previousState = this.getState()\r\n\t\tthis._updateState(stateUpdate)\r\n\t}\r\n\r\n\tthis.getInitialState = () => {\r\n\t\tif (initialState) {\r\n\t\t\treturn getRestoredState.call(this, initialState)\r\n\t\t}\r\n\t\treturn getInitialStateFromScratch.call(this, { getInitialItemState })\r\n\t}\r\n\r\n\tthis.useState = ({\r\n\t\tgetState,\r\n\t\tupdateState\r\n\t}) => {\r\n\t\tif (this._isActive) {\r\n\t\t\tthrow new Error('[virtual-scroller] `VirtualScroller` has already been started')\r\n\t\t}\r\n\r\n\t\tif (this._getState) {\r\n\t\t\tthrow new Error('[virtual-scroller] Custom state storage has already been configured')\r\n\t\t}\r\n\r\n\t\tif (render) {\r\n\t\t\tthrow new Error('[virtual-scroller] Creating a `VirtualScroller` class instance with a `render()` parameter means using the default (internal) state storage')\r\n\t\t}\r\n\r\n\t\tif (!getState || !updateState) {\r\n\t\t\tthrow new Error('[virtual-scroller] When using a custom state storage, one must supply both `getState()` and `updateState()` functions')\r\n\t\t}\r\n\r\n\t\tthis._usesCustomStateStorage = true\r\n\r\n\t\tthis._getState = getState\r\n\t\tthis._updateState = updateState\r\n\t}\r\n\r\n\tthis.useDefaultStateStorage = () => {\r\n\t\tif (!render) {\r\n\t\t\tthrow new Error('[virtual-scroller] When using the default (internal) state management, one must supply a `render(state, prevState)` function parameter')\r\n\t\t}\r\n\r\n\t\t// Create default `getState()`/`updateState()` functions.\r\n\t\tthis._getState = defaultGetState.bind(this)\r\n\t\tthis._updateState = defaultUpdateState.bind(this)\r\n\r\n\t\t// When `state` is stored externally, a developer is responsible for\r\n\t\t// initializing it with the initial value.\r\n\t\t// Otherwise, if default state management is used, set the initial state now.\r\n\t\tconst setInitialState = defaultSetInitialState.bind(this)\r\n\t\tsetInitialState(this.getInitialState())\r\n\t}\r\n\r\n\tfunction defaultGetState() {\r\n\t\treturn this.state\r\n\t}\r\n\r\n\tfunction defaultSetInitialState(newState) {\r\n\t\tthis.state = newState\r\n\t}\r\n\r\n\tfunction defaultUpdateState(stateUpdate) {\r\n\t\t// Because this variant of `.updateState()` is \"synchronous\" (immediate),\r\n\t\t// it can be written like `...prevState`, and no state updates would be lost.\r\n\t\t// But if it was \"asynchronous\" (not immediate), then `...prevState`\r\n\t\t// wouldn't work in all cases, because it could be stale in cases\r\n\t\t// when more than a single `updateState()` call is made before\r\n\t\t// the state actually updates, making `prevState` stale.\r\n\t\tthis.state = {\r\n\t\t\t...this.state,\r\n\t\t\t...stateUpdate\r\n\t\t}\r\n\r\n\t\trender(this.state, this.previousState)\r\n\r\n\t\tthis.onRender()\r\n\t}\r\n\r\n\t/**\r\n\t * Returns the initial state of the `VirtualScroller` \"from scratch\".\r\n\t * (i.e. not from a previously saved one).\r\n\t * @param {function} [options.getInitialItemState] — Gets initial item state.\r\n\t * @return {object}\r\n\t */\r\n\tfunction getInitialStateFromScratch({ getInitialItemState }) {\r\n\t\tconst items = initialItems\r\n\r\n\t\tconst state = {\r\n\t\t\t...getInitialLayoutState.call(this, items, { beforeStart: true }),\r\n\t\t\titems,\r\n\t\t\titemStates: fillArray(new Array(items.length), (i) => getInitialItemState(items[i]))\r\n\t\t}\r\n\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('Initial state (autogenerated)', getStateSnapshot(state))\r\n\t\t}\r\n\t\tlog('First shown item index', state.firstShownItemIndex)\r\n\t\tlog('Last shown item index', state.lastShownItemIndex)\r\n\r\n\t\treturn state\r\n\t}\r\n\r\n\tfunction getRestoredState(state) {\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('Restore state', getStateSnapshot(state))\r\n\t\t}\r\n\r\n\t\t// Possibly clean up \"before resize\" property in state.\r\n\t\t// \"Before resize\" state property is cleaned up when all \"before resize\" item heights\r\n\t\t// have been re-measured in an asynchronous `this.updateState({ beforeResize: undefined })` call.\r\n\t\t// If `VirtualScroller` state was snapshotted externally before that `this.updateState()` call\r\n\t\t// has been applied, then \"before resize\" property might have not been cleaned up properly.\r\n\t\tstate = cleanUpBeforeResizeState(state)\r\n\r\n\t\t// Reset `verticalSpacing` so that it re-measures it after the list\r\n\t\t// has been rendered initially. The rationale is that a previously captured\r\n\t\t// inter-item vertical spacing can't be \"trusted\" in a sense that the user\r\n\t\t// might have resized the window after the previous `state` has been snapshotted.\r\n\t\t// If the user has resized the window, then changing window width might have\r\n\t\t// activated different CSS `@media()` \"queries\" resulting in a potentially different\r\n\t\t// vertical spacing when the `VirtualScroller` is re-created with such previously\r\n\t\t// snapshotted state.\r\n\t\tstate = {\r\n\t\t\t...state,\r\n\t\t\tverticalSpacing: undefined\r\n\t\t}\r\n\r\n\t\t// `this.verticalSpacing` acts as a \"true\" source for vertical spacing value.\r\n\t\t// Vertical spacing is also stored in `state` but `state` updates could be\r\n\t\t// \"asynchronous\" (not applied immediately) and `this.onUpdateShownItemIndexes()`\r\n\t\t// requires vertical spacing to be correct at any time, without any delays.\r\n\t\t// So, vertical spacing is also duplicated in `state`, but the \"true\" source\r\n\t\t// is still `this.verticalSpacing`.\r\n\t\t//\r\n\t\t// `this.verticalSpacing` must be initialized before calling `this.getInitialStateFromScratch()`\r\n\t\t// because `this.getInitialStateFromScratch()` uses `this.verticalSpacing` in its calculations.\r\n\t\t//\r\n\t\t// With the code above, `state.verticalSpacing` is always gonna be `undefined`,\r\n\t\t// so commented out this code. It's safer to just re-measure vertical spacing\r\n\t\t// from scratch when `VirtualScroller` is mounted.\r\n\t\t//\r\n\t\t// this.verticalSpacing = state ? state.verticalSpacing : undefined\r\n\r\n\t\t// Check if the actual `columnsCount` on the screen matches the one from state.\r\n\t\tif (isStateColumnsCountMismatch(state, {\r\n\t\t\tcolumnsCount: this.getActualColumnsCount()\r\n\t\t})) {\r\n\t\t\twarn('Reset Layout')\r\n\t\t\tstate = {\r\n\t\t\t\t...state,\r\n\t\t\t\t...getInitialLayoutState.call(this, state.items, { beforeStart: false })\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\treturn state\r\n\t}\r\n\r\n\tfunction getInitialLayoutState(items, { beforeStart }) {\r\n\t\tconst itemsCount = items.length\r\n\r\n\t\tconst getColumnsCount = () => this.getActualColumnsCount()\r\n\r\n\t\tconst columnsCount = beforeStart\r\n\t\t\t? this.layout.getInitialLayoutValueWithFallback(\r\n\t\t\t\t'columnsCount',\r\n\t\t\t\tgetColumnsCount,\r\n\t\t\t\t1\r\n\t\t\t)\r\n\t\t\t: getColumnsCount()\r\n\r\n\t\tconst {\r\n\t\t\tfirstShownItemIndex,\r\n\t\t\tlastShownItemIndex,\r\n\t\t\tbeforeItemsHeight,\r\n\t\t\tafterItemsHeight\r\n\t\t} = this.layout.getInitialLayoutValues({\r\n\t\t\titemsCount,\r\n\t\t\tcolumnsCount: this.getActualColumnsCount(),\r\n\t\t\tbeforeStart\r\n\t\t})\r\n\r\n\t\tconst itemHeights = new Array(itemsCount)\r\n\r\n\t\t// Optionally preload items to be rendered.\r\n\t\tthis.onBeforeShowItems(\r\n\t\t\titems,\r\n\t\t\titemHeights,\r\n\t\t\tfirstShownItemIndex,\r\n\t\t\tlastShownItemIndex\r\n\t\t)\r\n\r\n\t\treturn {\r\n\t\t\titemHeights,\r\n\t\t\tcolumnsCount: this.getActualColumnsCountForState(),\r\n\t\t\tverticalSpacing: this.verticalSpacing,\r\n\t\t\tfirstShownItemIndex,\r\n\t\t\tlastShownItemIndex,\r\n\t\t\tbeforeItemsHeight,\r\n\t\t\tafterItemsHeight\r\n\t\t}\r\n\t}\r\n\r\n\t// Checks if the actual `columnsCount` on the screen matches the one from state.\r\n\t//\r\n\t// For example, a developer might snapshot `VirtualScroller` state\r\n\t// when the user navigates from the page containing the list\r\n\t// in order to later restore the list's state when the user goes \"Back\".\r\n\t// But, the user might have also resized the window while being on that\r\n\t// \"other\" page, and when they come \"Back\", their snapshotted state\r\n\t// no longer qualifies. Well, it does qualify, but only partially.\r\n\t// For example, `itemStates` are still valid, but first and last shown\r\n\t// item indexes aren't.\r\n\t//\r\n\tfunction isStateColumnsCountMismatch(state, { columnsCount }) {\r\n\t\tconst stateColumnsCount = state.columnsCount || 1\r\n\t\tif (stateColumnsCount !== columnsCount) {\r\n\t\t\twarn('~ Columns Count changed from', stateColumnsCount, 'to', columnsCount, '~')\r\n\t\t\treturn true\r\n\t\t}\r\n\t\tconst firstShownItemIndex = Math.floor(state.firstShownItemIndex / columnsCount) * columnsCount\r\n\t\tif (firstShownItemIndex !== state.firstShownItemIndex) {\r\n\t\t\twarn('~ First Shown Item Index', state.firstShownItemIndex, 'is not divisible by Columns Count', columnsCount, '~')\r\n\t\t\treturn true\r\n\t\t}\r\n\t}\r\n}"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEe,SAASA,kBAAT,OAMZ;EAAA;;EAAA,IALKC,YAKL,QALFC,KAKE;EAAA,IAJFC,mBAIE,QAJFA,mBAIE;EAAA,IAHFC,aAGE,QAHFA,aAGE;EAAA,IAFFC,MAEE,QAFFA,MAEE;EAAA,IADKC,YACL,QADFC,KACE;EACF,KAAKH,aAAL,GAAqBA,aAArB;EACA,KAAKI,OAAL,GAAeH,MAAf;EAEA,KAAKF,mBAAL,GAA2BA,mBAA3B;;EAEA,KAAKM,aAAL,GAAqB,UAACC,CAAD,EAAIC,YAAJ,EAAqB;IACzC,IAAI,IAAAC,cAAA,GAAJ,EAAe;MACd,IAAAC,iBAAA,EAAI,wBAAJ;MACA,IAAAA,iBAAA,EAAI,YAAJ,EAAkBH,CAAlB,EAFc,CAGd;MACA;MACA;MACA;MACA;;MACA,IAAAG,iBAAA,EAAI,mBAAmB,IAAnB,GAA0BC,IAAI,CAACC,SAAL,CAAe,KAAI,CAACC,QAAL,GAAgBC,UAAhB,CAA2BP,CAA3B,CAAf,EAA8C,IAA9C,EAAoD,CAApD,CAA9B;MACA,IAAAG,iBAAA,EAAI,cAAc,IAAd,GAAqBC,IAAI,CAACC,SAAL,CAAeJ,YAAf,EAA6B,IAA7B,EAAmC,CAAnC,CAAzB;IACA;;IAED,KAAI,CAACK,QAAL,GAAgBC,UAAhB,CAA2BP,CAA3B,IAAgCC,YAAhC,CAbyC,CAezC;;IACA,IAAI,KAAI,CAACO,sBAAT,EAAiC;MAChC,IAAI,CAAC,KAAI,CAACC,mDAAV,EAA+D;QAC9D,KAAI,CAACA,mDAAL,GAA2D,EAA3D;MACA;;MACD,KAAI,CAACA,mDAAL,CAAyDC,MAAM,CAACV,CAAD,CAA/D,IAAsEC,YAAtE;IACA;EACD,CAtBD;;EAwBA,KAAKK,QAAL,GAAgB;IAAA,OAAM,KAAI,CAACK,SAAL,EAAN;EAAA,CAAhB;;EAEA,KAAKC,WAAL,GAAmB,UAACC,WAAD,EAAiB;IACnC,IAAI,IAAAX,cAAA,GAAJ,EAAe;MACd,IAAAC,iBAAA,EAAI,eAAJ;MACA,IAAAA,iBAAA,EAAI,IAAAW,4BAAA,EAAiBD,WAAjB,CAAJ;IACA,CAJkC,CAMnC;IACA;;;IACA,IAAIA,WAAW,CAAChB,KAAhB,EAAuB;MACtB,IAAI,CAAC,KAAI,CAACkB,kBAAV,EAA8B;QAC7B,IAAAC,kBAAA,EAAY,wFAAZ;MACA;IACD;;IACD,KAAI,CAACD,kBAAL,GAA0BE,SAA1B,CAbmC,CAenC;;IACA,KAAI,CAACC,aAAL,GAAqB,KAAI,CAACZ,QAAL,EAArB;;IACA,KAAI,CAACa,YAAL,CAAkBN,WAAlB;EACA,CAlBD;;EAoBA,KAAKO,eAAL,GAAuB,YAAM;IAC5B,IAAI7B,YAAJ,EAAkB;MACjB,OAAO8B,gBAAgB,CAACC,IAAjB,CAAsB,KAAtB,EAA4B/B,YAA5B,CAAP;IACA;;IACD,OAAOgC,0BAA0B,CAACD,IAA3B,CAAgC,KAAhC,EAAsC;MAAE7B,mBAAmB,EAAnBA;IAAF,CAAtC,CAAP;EACA,CALD;;EAOA,KAAK+B,QAAL,GAAgB,iBAGV;IAAA,IAFLlB,QAEK,SAFLA,QAEK;IAAA,IADLM,WACK,SADLA,WACK;;IACL,IAAI,KAAI,CAACa,SAAT,EAAoB;MACnB,MAAM,IAAIC,KAAJ,CAAU,+DAAV,CAAN;IACA;;IAED,IAAI,KAAI,CAACf,SAAT,EAAoB;MACnB,MAAM,IAAIe,KAAJ,CAAU,qEAAV,CAAN;IACA;;IAED,IAAI/B,MAAJ,EAAY;MACX,MAAM,IAAI+B,KAAJ,CAAU,6IAAV,CAAN;IACA;;IAED,IAAI,CAACpB,QAAD,IAAa,CAACM,WAAlB,EAA+B;MAC9B,MAAM,IAAIc,KAAJ,CAAU,uHAAV,CAAN;IACA;;IAED,KAAI,CAACC,uBAAL,GAA+B,IAA/B;IAEA,KAAI,CAAChB,SAAL,GAAiBL,QAAjB;IACA,KAAI,CAACa,YAAL,GAAoBP,WAApB;EACA,CAxBD;;EA0BA,KAAKgB,sBAAL,GAA8B,YAAM;IACnC,IAAI,CAACjC,MAAL,EAAa;MACZ,MAAM,IAAI+B,KAAJ,CAAU,wIAAV,CAAN;IACA,CAHkC,CAKnC;;;IACA,KAAI,CAACf,SAAL,GAAiBkB,eAAe,CAACC,IAAhB,CAAqB,KAArB,CAAjB;IACA,KAAI,CAACX,YAAL,GAAoBY,kBAAkB,CAACD,IAAnB,CAAwB,KAAxB,CAApB,CAPmC,CASnC;IACA;IACA;;IACA,IAAME,eAAe,GAAGC,sBAAsB,CAACH,IAAvB,CAA4B,KAA5B,CAAxB;IACAE,eAAe,CAAC,KAAI,CAACZ,eAAL,EAAD,CAAf;EACA,CAdD;;EAgBA,SAASS,eAAT,GAA2B;IAC1B,OAAO,KAAKrC,KAAZ;EACA;;EAED,SAASyC,sBAAT,CAAgCC,QAAhC,EAA0C;IACzC,KAAK1C,KAAL,GAAa0C,QAAb;EACA;;EAED,SAASH,kBAAT,CAA4BlB,WAA5B,EAAyC;IACxC;IACA;IACA;IACA;IACA;IACA;IACA,KAAKrB,KAAL,mCACI,KAAKA,KADT,GAEIqB,WAFJ;IAKAlB,MAAM,CAAC,KAAKH,KAAN,EAAa,KAAK0B,aAAlB,CAAN;IAEA,KAAKiB,QAAL;EACA;EAED;AACD;AACA;AACA;AACA;AACA;;;EACC,SAASZ,0BAAT,QAA6D;IAAA,IAAvB9B,mBAAuB,SAAvBA,mBAAuB;IAC5D,IAAMI,KAAK,GAAGD,YAAd;;IAEA,IAAMJ,KAAK,mCACP4C,qBAAqB,CAACd,IAAtB,CAA2B,IAA3B,EAAiCzB,KAAjC,EAAwC;MAAEwC,WAAW,EAAE;IAAf,CAAxC,CADO;MAEVxC,KAAK,EAALA,KAFU;MAGVU,UAAU,EAAE,IAAA+B,qBAAA,EAAU,IAAIC,KAAJ,CAAU1C,KAAK,CAAC2C,MAAhB,CAAV,EAAmC,UAACxC,CAAD;QAAA,OAAOP,mBAAmB,CAACI,KAAK,CAACG,CAAD,CAAN,CAA1B;MAAA,CAAnC;IAHF,EAAX;;IAMA,IAAI,IAAAE,cAAA,GAAJ,EAAe;MACd,IAAAC,iBAAA,EAAI,+BAAJ,EAAqC,IAAAW,4BAAA,EAAiBtB,KAAjB,CAArC;IACA;;IACD,IAAAW,iBAAA,EAAI,wBAAJ,EAA8BX,KAAK,CAACiD,mBAApC;IACA,IAAAtC,iBAAA,EAAI,uBAAJ,EAA6BX,KAAK,CAACkD,kBAAnC;IAEA,OAAOlD,KAAP;EACA;;EAED,SAAS6B,gBAAT,CAA0B7B,KAA1B,EAAiC;IAChC,IAAI,IAAAU,cAAA,GAAJ,EAAe;MACd,IAAAC,iBAAA,EAAI,eAAJ,EAAqB,IAAAW,4BAAA,EAAiBtB,KAAjB,CAArB;IACA,CAH+B,CAKhC;IACA;IACA;IACA;IACA;;;IACAA,KAAK,GAAG,IAAAmD,sCAAA,EAAyBnD,KAAzB,CAAR,CAVgC,CAYhC;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;IACAA,KAAK,mCACDA,KADC;MAEJoD,eAAe,EAAE3B;IAFb,EAAL,CApBgC,CAyBhC;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAEA;;IACA,IAAI4B,2BAA2B,CAACrD,KAAD,EAAQ;MACtCsD,YAAY,EAAE,KAAKC,qBAAL;IADwB,CAAR,CAA/B,EAEI;MACH,IAAAC,WAAA,EAAK,cAAL;MACAxD,KAAK,mCACDA,KADC,GAED4C,qBAAqB,CAACd,IAAtB,CAA2B,IAA3B,EAAiC9B,KAAK,CAACK,KAAvC,EAA8C;QAAEwC,WAAW,EAAE;MAAf,CAA9C,CAFC,CAAL;IAIA;;IAED,OAAO7C,KAAP;EACA;;EAED,SAAS4C,qBAAT,CAA+BvC,KAA/B,SAAuD;IAAA;;IAAA,IAAfwC,WAAe,SAAfA,WAAe;IACtD,IAAMY,UAAU,GAAGpD,KAAK,CAAC2C,MAAzB;;IAEA,IAAMU,eAAe,GAAG,SAAlBA,eAAkB;MAAA,OAAM,MAAI,CAACH,qBAAL,EAAN;IAAA,CAAxB;;IAEA,IAAMD,YAAY,GAAGT,WAAW,GAC7B,KAAKc,MAAL,CAAYC,iCAAZ,CACD,cADC,EAEDF,eAFC,EAGD,CAHC,CAD6B,GAM7BA,eAAe,EANlB;;IAQA,4BAKI,KAAKC,MAAL,CAAYE,sBAAZ,CAAmC;MACtCJ,UAAU,EAAVA,UADsC;MAEtCH,YAAY,EAAE,KAAKC,qBAAL,EAFwB;MAGtCV,WAAW,EAAXA;IAHsC,CAAnC,CALJ;IAAA,IACCI,mBADD,yBACCA,mBADD;IAAA,IAECC,kBAFD,yBAECA,kBAFD;IAAA,IAGCY,iBAHD,yBAGCA,iBAHD;IAAA,IAICC,gBAJD,yBAICA,gBAJD;;IAWA,IAAMC,WAAW,GAAG,IAAIjB,KAAJ,CAAUU,UAAV,CAApB,CAxBsD,CA0BtD;;IACA,KAAKQ,iBAAL,CACC5D,KADD,EAEC2D,WAFD,EAGCf,mBAHD,EAICC,kBAJD;IAOA,OAAO;MACNc,WAAW,EAAXA,WADM;MAENV,YAAY,EAAE,KAAKY,6BAAL,EAFR;MAGNd,eAAe,EAAE,KAAKA,eAHhB;MAINH,mBAAmB,EAAnBA,mBAJM;MAKNC,kBAAkB,EAAlBA,kBALM;MAMNY,iBAAiB,EAAjBA,iBANM;MAONC,gBAAgB,EAAhBA;IAPM,CAAP;EASA,CAxPC,CA0PF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;EACA,SAASV,2BAAT,CAAqCrD,KAArC,SAA8D;IAAA,IAAhBsD,YAAgB,SAAhBA,YAAgB;IAC7D,IAAMa,iBAAiB,GAAGnE,KAAK,CAACsD,YAAN,IAAsB,CAAhD;;IACA,IAAIa,iBAAiB,KAAKb,YAA1B,EAAwC;MACvC,IAAAE,WAAA,EAAK,8BAAL,EAAqCW,iBAArC,EAAwD,IAAxD,EAA8Db,YAA9D,EAA4E,GAA5E;MACA,OAAO,IAAP;IACA;;IACD,IAAML,mBAAmB,GAAGmB,IAAI,CAACC,KAAL,CAAWrE,KAAK,CAACiD,mBAAN,GAA4BK,YAAvC,IAAuDA,YAAnF;;IACA,IAAIL,mBAAmB,KAAKjD,KAAK,CAACiD,mBAAlC,EAAuD;MACtD,IAAAO,WAAA,EAAK,0BAAL,EAAiCxD,KAAK,CAACiD,mBAAvC,EAA4D,mCAA5D,EAAiGK,YAAjG,EAA+G,GAA/G;MACA,OAAO,IAAP;IACA;EACD;AACD"}
|
|
1
|
+
{"version":3,"file":"VirtualScroller.state.js","names":["createStateHelpers","initialState","state","getInitialItemState","onStateChange","render","initialItems","items","_render","_setItemState","i","newItemState","isDebug","log","JSON","stringify","getState","itemStates","newItemsWillBeRendered","itemStatesThatChangedWhileNewItemsWereBeingRendered","String","_getState","updateState","stateUpdate","getStateSnapshot","_isSettingNewItems","reportError","undefined","waitingForRender","previousState","mostRecentSetStateValue","_setState","getInitialState","getRestoredState","call","getInitialStateFromScratch","useState","setState","_isActive","Error","_usesCustomStateStorage","newState","useDefaultStateStorage","defaultGetState","bind","defaultSetState","setInitialState","defaultSetInitialState","onRender","getInitialLayoutState","beforeStart","fillArray","Array","length","firstShownItemIndex","lastShownItemIndex","cleanUpBeforeResizeState","verticalSpacing","isStateColumnsCountMismatch","columnsCount","getActualColumnsCount","warn","itemsCount","getColumnsCount","layout","getInitialLayoutValueWithFallback","getInitialLayoutValues","beforeItemsHeight","afterItemsHeight","itemHeights","onBeforeShowItems","getActualColumnsCountForState","stateColumnsCount","Math","floor"],"sources":["../source/VirtualScroller.state.js"],"sourcesContent":["import fillArray from './utility/fillArray.js'\r\nimport log, { warn, isDebug, reportError } from './utility/debug.js'\r\nimport { cleanUpBeforeResizeState } from './BeforeResize.js'\r\nimport getStateSnapshot from './utility/getStateSnapshot.js'\r\n\r\n// There're three main places where state is updated:\r\n//\r\n// * On scroll.\r\n// * On window resize.\r\n// * On set new items.\r\n//\r\n// State updates may be \"asynchronous\" (like in React), in which case the\r\n// corresponding operation is \"pending\" until the state update is applied.\r\n//\r\n// If there's a \"pending\" window resize or a \"pending\" update of the set of items,\r\n// then \"on scroll\" updates aren't dispatched.\r\n//\r\n// If there's a \"pending\" on scroll update and the window is resize or a new set\r\n// of items is set, then that \"pending\" on scroll update gets overwritten.\r\n//\r\n// If there's a \"pending\" update of the set of items, then window resize handler\r\n// sees that \"pending\" update and dispatches its own state update so that the\r\n// \"pending\" state update originating from `setItems()` is not lost.\r\n//\r\n// If there's a \"pending\" window resize, and a new set of items is set,\r\n// then the state update of the window resize handler gets overwritten.\r\n\r\nexport default function createStateHelpers({\r\n\tstate: initialState,\r\n\tgetInitialItemState,\r\n\tonStateChange,\r\n\trender,\r\n\titems: initialItems\r\n}) {\r\n\tthis.onStateChange = onStateChange\r\n\tthis._render = render\r\n\r\n\tthis.getInitialItemState = getInitialItemState\r\n\r\n\tthis._setItemState = (i, newItemState) => {\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('~ Item state changed ~')\r\n\t\t\tlog('Item index', i)\r\n\t\t\t// Uses `JSON.stringify()` here instead of just outputting the JSON objects as is\r\n\t\t\t// because outputting JSON objects as is would show different results later when\r\n\t\t\t// the developer inspects those in the web browser console if those state objects\r\n\t\t\t// get modified in between they've been output to the console and the developer\r\n\t\t\t// decided to inspect them.\r\n\t\t\tlog('Previous state' + '\\n' + JSON.stringify(this.getState().itemStates[i], null, 2))\r\n\t\t\tlog('New state' + '\\n' + JSON.stringify(newItemState, null, 2))\r\n\t\t}\r\n\r\n\t\tthis.getState().itemStates[i] = newItemState\r\n\r\n\t\t// If there was a request for `setState()` with new `items`, then the changes\r\n\t\t// to `currentState.itemStates[]` made above would be overwritten when that\r\n\t\t// pending `setState()` call gets applied.\r\n\t\t// To fix that, the updates to current `itemStates[]` are noted in\r\n\t\t// `this.itemStatesThatChangedWhileNewItemsWereBeingRendered` variable.\r\n\t\t// That variable is then checked when the `setState()` call with the new `items`\r\n\t\t// has been updated.\r\n\t\tif (this.newItemsWillBeRendered) {\r\n\t\t\tif (!this.itemStatesThatChangedWhileNewItemsWereBeingRendered) {\r\n\t\t\t\tthis.itemStatesThatChangedWhileNewItemsWereBeingRendered = {}\r\n\t\t\t}\r\n\t\t\tthis.itemStatesThatChangedWhileNewItemsWereBeingRendered[String(i)] = newItemState\r\n\t\t}\r\n\t}\r\n\r\n\tthis.getState = () => this._getState()\r\n\r\n\tthis.updateState = (stateUpdate) => {\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('~ Set state ~')\r\n\t\t\tlog(getStateSnapshot(stateUpdate))\r\n\t\t}\r\n\r\n\t\t// Ensure that a non-initial `stateUpdate` can only contain an `items`\r\n\t\t// property when it comes from a `setItems()` call.\r\n\t\tif (stateUpdate.items) {\r\n\t\t\tif (!this._isSettingNewItems) {\r\n\t\t\t\treportError('A `stateUpdate` can only contain `items` property as a result of calling `.setItems()`')\r\n\t\t\t}\r\n\t\t}\r\n\t\tthis._isSettingNewItems = undefined\r\n\r\n\t\tthis.waitingForRender = true\r\n\r\n\t\t// Store previous `state`.\r\n\t\tthis.previousState = this.getState()\r\n\r\n\t\t// If it's the first call to `this.updateState()` then initialize\r\n\t\t// the most recent `setState()` value to be the current state.\r\n\t\tif (!this.mostRecentSetStateValue) {\r\n\t\t\tthis.mostRecentSetStateValue = this.getState()\r\n\t\t}\r\n\r\n\t\t// Accumulates all \"pending\" state updates until they have been applied.\r\n\t\tthis.mostRecentSetStateValue = {\r\n\t\t\t...this.mostRecentSetStateValue,\r\n\t\t\t...stateUpdate\r\n\t\t}\r\n\r\n\t\t// Update `state`.\r\n\t\tthis._setState(this.mostRecentSetStateValue, stateUpdate)\r\n\t}\r\n\r\n\tthis.getInitialState = () => {\r\n\t\tif (initialState) {\r\n\t\t\treturn getRestoredState.call(this, initialState)\r\n\t\t}\r\n\t\treturn getInitialStateFromScratch.call(this, { getInitialItemState })\r\n\t}\r\n\r\n\tthis.useState = ({\r\n\t\tgetState,\r\n\t\tsetState,\r\n\t\tupdateState\r\n\t}) => {\r\n\t\tif (this._isActive) {\r\n\t\t\tthrow new Error('[virtual-scroller] `VirtualScroller` has already been started')\r\n\t\t}\r\n\r\n\t\tif (this._getState) {\r\n\t\t\tthrow new Error('[virtual-scroller] Custom state storage has already been configured')\r\n\t\t}\r\n\r\n\t\tif (render) {\r\n\t\t\tthrow new Error('[virtual-scroller] Creating a `VirtualScroller` class instance with a `render()` parameter implies using the default (internal) state storage')\r\n\t\t}\r\n\r\n\t\tif (setState && updateState) {\r\n\t\t\tthrow new Error('[virtual-scroller] When using a custom state storage, one must supply either `setState()` or `updateState()` function but not both')\r\n\t\t}\r\n\r\n\t\tif (!getState || !(setState || updateState)) {\r\n\t\t\tthrow new Error('[virtual-scroller] When using a custom state storage, one must supply both `getState()` and `setState()`/`updateState()` functions')\r\n\t\t}\r\n\r\n\t\tthis._usesCustomStateStorage = true\r\n\r\n\t\tthis._getState = getState\r\n\r\n\t\tthis._setState = (newState, stateUpdate) => {\r\n\t\t\tif (setState) {\r\n\t\t\t\tsetState(newState)\r\n\t\t\t} else {\r\n\t\t\t\tupdateState(stateUpdate)\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\tthis.useDefaultStateStorage = () => {\r\n\t\tif (!render) {\r\n\t\t\tthrow new Error('[virtual-scroller] When using the default (internal) state management, one must supply a `render(state, prevState)` function parameter')\r\n\t\t}\r\n\r\n\t\t// Create default `getState()`/`setState()` functions.\r\n\t\tthis._getState = defaultGetState.bind(this)\r\n\t\tthis._setState = defaultSetState.bind(this)\r\n\r\n\t\t// When `state` is stored externally, a developer is responsible for\r\n\t\t// initializing it with the initial value.\r\n\t\t// Otherwise, if default state management is used, set the initial state now.\r\n\t\tconst setInitialState = defaultSetInitialState.bind(this)\r\n\t\tsetInitialState(this.getInitialState())\r\n\t}\r\n\r\n\tfunction defaultGetState() {\r\n\t\treturn this.state\r\n\t}\r\n\r\n\tfunction defaultSetInitialState(newState) {\r\n\t\tthis.state = newState\r\n\t}\r\n\r\n\tfunction defaultSetState(newState, stateUpdate) {\r\n\t\t// // Because the default state updates are \"synchronous\" (immediate),\r\n\t\t// // the `...stateUpdate` could be applied over `...this.state`,\r\n\t\t// // and no state updates would be lost.\r\n\t\t// // But if it was \"asynchronous\" (not immediate), then `...this.state`\r\n\t\t// // wouldn't work in all cases, because it could be stale in cases\r\n\t\t// // when more than a single `setState()` call is made before\r\n\t\t// // the state actually updates, making some properties of `this.state` stale.\r\n\t\t// this.state = {\r\n\t\t// \t...this.state,\r\n\t\t// \t...stateUpdate\r\n\t\t// }\r\n\r\n\t\tthis.state = newState\r\n\r\n\t\trender(this.state, this.previousState)\r\n\r\n\t\tthis.onRender()\r\n\t}\r\n\r\n\t/**\r\n\t * Returns the initial state of the `VirtualScroller` \"from scratch\".\r\n\t * (i.e. not from a previously saved one).\r\n\t * @param {function} [options.getInitialItemState] — Gets initial item state.\r\n\t * @return {object}\r\n\t */\r\n\tfunction getInitialStateFromScratch({ getInitialItemState }) {\r\n\t\tconst items = initialItems\r\n\r\n\t\tconst state = {\r\n\t\t\t...getInitialLayoutState.call(this, items, { beforeStart: true }),\r\n\t\t\titems,\r\n\t\t\titemStates: fillArray(new Array(items.length), (i) => getInitialItemState(items[i]))\r\n\t\t}\r\n\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('Initial state (autogenerated)', getStateSnapshot(state))\r\n\t\t}\r\n\t\tlog('First shown item index', state.firstShownItemIndex)\r\n\t\tlog('Last shown item index', state.lastShownItemIndex)\r\n\r\n\t\treturn state\r\n\t}\r\n\r\n\tfunction getRestoredState(state) {\r\n\t\tif (isDebug()) {\r\n\t\t\tlog('Restore state', getStateSnapshot(state))\r\n\t\t}\r\n\r\n\t\t// Possibly clean up \"before resize\" property in state.\r\n\t\t// \"Before resize\" state property is cleaned up when all \"before resize\" item heights\r\n\t\t// have been re-measured in an asynchronous `this.updateState({ beforeResize: undefined })` call.\r\n\t\t// If `VirtualScroller` state was snapshotted externally before that `this.updateState()` call\r\n\t\t// has been applied, then \"before resize\" property might have not been cleaned up properly.\r\n\t\tstate = cleanUpBeforeResizeState(state)\r\n\r\n\t\t// Reset `verticalSpacing` so that it re-measures it after the list\r\n\t\t// has been rendered initially. The rationale is that a previously captured\r\n\t\t// inter-item vertical spacing can't be \"trusted\" in a sense that the user\r\n\t\t// might have resized the window after the previous `state` has been snapshotted.\r\n\t\t// If the user has resized the window, then changing window width might have\r\n\t\t// activated different CSS `@media()` \"queries\" resulting in a potentially different\r\n\t\t// vertical spacing when the `VirtualScroller` is re-created with such previously\r\n\t\t// snapshotted state.\r\n\t\tstate = {\r\n\t\t\t...state,\r\n\t\t\tverticalSpacing: undefined\r\n\t\t}\r\n\r\n\t\t// `this.verticalSpacing` acts as a \"true\" source for vertical spacing value.\r\n\t\t// Vertical spacing is also stored in `state` but `state` updates could be\r\n\t\t// \"asynchronous\" (not applied immediately) and `this.onUpdateShownItemIndexes()`\r\n\t\t// requires vertical spacing to be correct at any time, without any delays.\r\n\t\t// So, vertical spacing is also duplicated in `state`, but the \"true\" source\r\n\t\t// is still `this.verticalSpacing`.\r\n\t\t//\r\n\t\t// `this.verticalSpacing` must be initialized before calling `this.getInitialStateFromScratch()`\r\n\t\t// because `this.getInitialStateFromScratch()` uses `this.verticalSpacing` in its calculations.\r\n\t\t//\r\n\t\t// With the code above, `state.verticalSpacing` is always gonna be `undefined`,\r\n\t\t// so commented out this code. It's safer to just re-measure vertical spacing\r\n\t\t// from scratch when `VirtualScroller` is mounted.\r\n\t\t//\r\n\t\t// this.verticalSpacing = state ? state.verticalSpacing : undefined\r\n\r\n\t\t// Check if the actual `columnsCount` on the screen matches the one from state.\r\n\t\tif (isStateColumnsCountMismatch(state, {\r\n\t\t\tcolumnsCount: this.getActualColumnsCount()\r\n\t\t})) {\r\n\t\t\twarn('Reset Layout')\r\n\t\t\tstate = {\r\n\t\t\t\t...state,\r\n\t\t\t\t...getInitialLayoutState.call(this, state.items, { beforeStart: false })\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\treturn state\r\n\t}\r\n\r\n\tfunction getInitialLayoutState(items, { beforeStart }) {\r\n\t\tconst itemsCount = items.length\r\n\r\n\t\tconst getColumnsCount = () => this.getActualColumnsCount()\r\n\r\n\t\tconst columnsCount = beforeStart\r\n\t\t\t? this.layout.getInitialLayoutValueWithFallback(\r\n\t\t\t\t'columnsCount',\r\n\t\t\t\tgetColumnsCount,\r\n\t\t\t\t1\r\n\t\t\t)\r\n\t\t\t: getColumnsCount()\r\n\r\n\t\tconst {\r\n\t\t\tfirstShownItemIndex,\r\n\t\t\tlastShownItemIndex,\r\n\t\t\tbeforeItemsHeight,\r\n\t\t\tafterItemsHeight\r\n\t\t} = this.layout.getInitialLayoutValues({\r\n\t\t\titemsCount,\r\n\t\t\tcolumnsCount: this.getActualColumnsCount(),\r\n\t\t\tbeforeStart\r\n\t\t})\r\n\r\n\t\tconst itemHeights = new Array(itemsCount)\r\n\r\n\t\t// Optionally preload items to be rendered.\r\n\t\tthis.onBeforeShowItems(\r\n\t\t\titems,\r\n\t\t\titemHeights,\r\n\t\t\tfirstShownItemIndex,\r\n\t\t\tlastShownItemIndex\r\n\t\t)\r\n\r\n\t\treturn {\r\n\t\t\titemHeights,\r\n\t\t\tcolumnsCount: this.getActualColumnsCountForState(),\r\n\t\t\tverticalSpacing: this.verticalSpacing,\r\n\t\t\tfirstShownItemIndex,\r\n\t\t\tlastShownItemIndex,\r\n\t\t\tbeforeItemsHeight,\r\n\t\t\tafterItemsHeight\r\n\t\t}\r\n\t}\r\n\r\n\t// Checks if the actual `columnsCount` on the screen matches the one from state.\r\n\t//\r\n\t// For example, a developer might snapshot `VirtualScroller` state\r\n\t// when the user navigates from the page containing the list\r\n\t// in order to later restore the list's state when the user goes \"Back\".\r\n\t// But, the user might have also resized the window while being on that\r\n\t// \"other\" page, and when they come \"Back\", their snapshotted state\r\n\t// no longer qualifies. Well, it does qualify, but only partially.\r\n\t// For example, `itemStates` are still valid, but first and last shown\r\n\t// item indexes aren't.\r\n\t//\r\n\tfunction isStateColumnsCountMismatch(state, { columnsCount }) {\r\n\t\tconst stateColumnsCount = state.columnsCount || 1\r\n\t\tif (stateColumnsCount !== columnsCount) {\r\n\t\t\twarn('~ Columns Count changed from', stateColumnsCount, 'to', columnsCount, '~')\r\n\t\t\treturn true\r\n\t\t}\r\n\t\tconst firstShownItemIndex = Math.floor(state.firstShownItemIndex / columnsCount) * columnsCount\r\n\t\tif (firstShownItemIndex !== state.firstShownItemIndex) {\r\n\t\t\twarn('~ First Shown Item Index', state.firstShownItemIndex, 'is not divisible by Columns Count', columnsCount, '~')\r\n\t\t\treturn true\r\n\t\t}\r\n\t}\r\n}"],"mappings":"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"}
|
|
@@ -25,9 +25,9 @@ var _useSetItemState = _interopRequireDefault(require("./useSetItemState.js"));
|
|
|
25
25
|
|
|
26
26
|
var _useOnItemHeightDidChange = _interopRequireDefault(require("./useOnItemHeightDidChange.js"));
|
|
27
27
|
|
|
28
|
-
var
|
|
28
|
+
var _useSetNewItemsOnItemsPropertyChange = _interopRequireDefault(require("./useSetNewItemsOnItemsPropertyChange.js"));
|
|
29
29
|
|
|
30
|
-
var
|
|
30
|
+
var _useUpdateItemKeysOnItemsChange = _interopRequireDefault(require("./useUpdateItemKeysOnItemsChange.js"));
|
|
31
31
|
|
|
32
32
|
var _useClassName = _interopRequireDefault(require("./useClassName.js"));
|
|
33
33
|
|
|
@@ -47,28 +47,16 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
47
47
|
|
|
48
48
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
49
49
|
|
|
50
|
-
// When `items` property changes
|
|
51
|
-
//
|
|
52
|
-
//
|
|
53
|
-
//
|
|
54
|
-
//
|
|
55
|
-
//
|
|
56
|
-
//
|
|
57
|
-
//
|
|
58
|
-
//
|
|
59
|
-
//
|
|
60
|
-
//
|
|
61
|
-
// Another reason for using this feature is:
|
|
62
|
-
//
|
|
63
|
-
// Since `useHandleItemsPropertyChange()` runs at render time
|
|
64
|
-
// and not after the render has finished (not in an "effect"),
|
|
65
|
-
// if the state update was done "conventionally" (by calling `_setNewState()`),
|
|
66
|
-
// React would throw an error about updating state during render.
|
|
67
|
-
// No one knows what the original error message was.
|
|
68
|
-
// Perhaps it's no longer relevant in newer versions of React.
|
|
69
|
-
//
|
|
70
|
-
var USE_ITEMS_UPDATE_NO_SECOND_RENDER_OPTIMIZATION = true;
|
|
71
|
-
|
|
50
|
+
// When `items` property changes:
|
|
51
|
+
// * A new `items` property is supplied to the React component.
|
|
52
|
+
// * The React component re-renders itself.
|
|
53
|
+
// * `useSetNewItemsOnItemsPropertyChange()` hook is run.
|
|
54
|
+
// * `useSetNewItemsOnItemsPropertyChange()` hook detects that the `items` property
|
|
55
|
+
// has changed and calls `VirtualScroller.setItems(items)`.
|
|
56
|
+
// * `VirtualScroller.setItems(items)` calls `VirtualScroller.setState()`.
|
|
57
|
+
// * `VirtualScroller.setState()` calls the `setState()` function.
|
|
58
|
+
// * The `setState()` function calls a setter from a `useState()` hook.
|
|
59
|
+
// * The React component re-renders itself the second time.
|
|
72
60
|
function VirtualScroller(_ref, ref) {
|
|
73
61
|
var AsComponent = _ref.as,
|
|
74
62
|
itemsProperty = _ref.items,
|
|
@@ -139,18 +127,17 @@ function VirtualScroller(_ref, ref) {
|
|
|
139
127
|
var _useState = (0, _useState2["default"])({
|
|
140
128
|
initialState: _initialState,
|
|
141
129
|
onRender: virtualScroller.onRender,
|
|
142
|
-
itemsProperty: itemsProperty
|
|
143
|
-
USE_ITEMS_UPDATE_NO_SECOND_RENDER_OPTIMIZATION: USE_ITEMS_UPDATE_NO_SECOND_RENDER_OPTIMIZATION
|
|
130
|
+
itemsProperty: itemsProperty
|
|
144
131
|
}),
|
|
145
132
|
getState = _useState.getState,
|
|
146
|
-
|
|
147
|
-
|
|
133
|
+
setState = _useState.setState,
|
|
134
|
+
stateToRender = _useState.stateToRender; // Use custom (external) state storage in the `VirtualScroller`.
|
|
148
135
|
|
|
149
136
|
|
|
150
137
|
(0, _react.useMemo)(function () {
|
|
151
138
|
virtualScroller.useState({
|
|
152
139
|
getState: getState,
|
|
153
|
-
|
|
140
|
+
setState: setState
|
|
154
141
|
});
|
|
155
142
|
}, []); // Start `VirtualScroller` on mount.
|
|
156
143
|
// Stop `VirtualScroller` on unmount.
|
|
@@ -162,6 +149,7 @@ function VirtualScroller(_ref, ref) {
|
|
|
162
149
|
getItemId: getItemId
|
|
163
150
|
}),
|
|
164
151
|
getItemKey = _useItemKeys.getItemKey,
|
|
152
|
+
usesAutogeneratedItemKeys = _useItemKeys.usesAutogeneratedItemKeys,
|
|
165
153
|
updateItemKeysForNewItems = _useItemKeys.updateItemKeysForNewItems; // Cache per-item `setItemState` functions' "references"
|
|
166
154
|
// so that item components don't get re-rendered needlessly.
|
|
167
155
|
|
|
@@ -177,18 +165,17 @@ function VirtualScroller(_ref, ref) {
|
|
|
177
165
|
virtualScroller: virtualScroller
|
|
178
166
|
}); // Calls `.setItems()` if `items` property has changed.
|
|
179
167
|
|
|
180
|
-
(0,
|
|
168
|
+
(0, _useSetNewItemsOnItemsPropertyChange["default"])(itemsProperty, {
|
|
181
169
|
virtualScroller: virtualScroller,
|
|
182
170
|
// `preserveScrollPosition` property name is deprecated,
|
|
183
171
|
// use `preserveScrollPositionOnPrependItems` property instead.
|
|
184
172
|
preserveScrollPosition: preserveScrollPosition,
|
|
185
|
-
preserveScrollPositionOnPrependItems: preserveScrollPositionOnPrependItems
|
|
186
|
-
nextItems: getNextState().items
|
|
173
|
+
preserveScrollPositionOnPrependItems: preserveScrollPositionOnPrependItems
|
|
187
174
|
}); // Updates `key`s if item indexes have changed.
|
|
188
175
|
|
|
189
|
-
(0,
|
|
176
|
+
(0, _useUpdateItemKeysOnItemsChange["default"])(stateToRender.items, {
|
|
190
177
|
virtualScroller: virtualScroller,
|
|
191
|
-
|
|
178
|
+
usesAutogeneratedItemKeys: usesAutogeneratedItemKeys,
|
|
192
179
|
updateItemKeysForNewItems: updateItemKeysForNewItems
|
|
193
180
|
}); // Add instance methods to the React component.
|
|
194
181
|
|
|
@@ -222,15 +209,12 @@ function VirtualScroller(_ref, ref) {
|
|
|
222
209
|
});
|
|
223
210
|
var style = (0, _useStyle["default"])({
|
|
224
211
|
tbody: tbody,
|
|
225
|
-
|
|
212
|
+
state: stateToRender
|
|
226
213
|
});
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
firstShownItemIndex = _getNextState.firstShownItemIndex,
|
|
232
|
-
lastShownItemIndex = _getNextState.lastShownItemIndex;
|
|
233
|
-
|
|
214
|
+
var currentItems = stateToRender.items,
|
|
215
|
+
itemStates = stateToRender.itemStates,
|
|
216
|
+
firstShownItemIndex = stateToRender.firstShownItemIndex,
|
|
217
|
+
lastShownItemIndex = stateToRender.lastShownItemIndex;
|
|
234
218
|
return /*#__PURE__*/_react["default"].createElement(AsComponent, _extends({}, rest, {
|
|
235
219
|
ref: container,
|
|
236
220
|
className: className,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VirtualScroller.js","names":["USE_ITEMS_UPDATE_NO_SECOND_RENDER_OPTIMIZATION","VirtualScroller","ref","AsComponent","as","itemsProperty","items","Component","itemComponent","itemComponentProps","estimatedItemHeight","getEstimatedItemHeight","getEstimatedVisibleItemRowsCount","bypass","tbody","preserveScrollPosition","preserveScrollPositionOnPrependItems","measureItemsBatchSize","scrollableContainer","getScrollableContainer","getColumnsCount","getItemId","className","onMount","onItemFirstRender","onItemInitialRender","initialScrollPosition","onScrollPositionChange","onStateChange","initialState","getInitialItemState","rest","container","useRef","virtualScroller","useVirtualScroller","_initialState","useMemo","getInitialState","useState","onRender","getState","updateState","getNextState","useVirtualScrollerStartStop","useItemKeys","getItemKey","updateItemKeysForNewItems","getSetItemState","useSetItemState","initialItemsCount","length","getOnItemHeightDidChange","useOnItemHeightDidChange","useHandleItemsPropertyChange","nextItems","useHandleItemIndexesChange","itemsBeingRendered","useInstanceMethods","useLayoutEffect","useClassName","style","useStyle","currentItems","itemStates","firstShownItemIndex","lastShownItemIndex","map","item","i","React","forwardRef","elementType","PropTypes","oneOfType","string","func","object","propTypes","arrayOf","any","isRequired","number","bool","shape","beforeItemsHeight","afterItemsHeight","itemHeights","columnsCount","verticalSpacing","defaultProps"],"sources":["../../source/react/VirtualScroller.js"],"sourcesContent":["import React, { useRef, useMemo, useLayoutEffect } from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport useState from './useState.js'\r\nimport useVirtualScroller from './useVirtualScroller.js'\r\nimport useVirtualScrollerStartStop from './useVirtualScrollerStartStop.js'\r\nimport useInstanceMethods from './useInstanceMethods.js'\r\nimport useItemKeys from './useItemKeys.js'\r\nimport useSetItemState from './useSetItemState.js'\r\nimport useOnItemHeightDidChange from './useOnItemHeightDidChange.js'\r\nimport useHandleItemsPropertyChange from './useHandleItemsPropertyChange.js'\r\nimport useHandleItemIndexesChange from './useHandleItemIndexesChange.js'\r\nimport useClassName from './useClassName.js'\r\nimport useStyle from './useStyle.js'\r\n\r\n// When `items` property changes, `useHandleItemsPropertyChange()` hook detects that\r\n// and calls `VirtualScroller.setItems()` which in turn calls the `updateState()` function.\r\n// At this point, an insignificant optimization could be applied:\r\n// the component could avoid re-rendering the second time.\r\n// Instead, the state update could be applied \"immediately\" if it originated\r\n// from `.setItems()` function call, eliminating the unneeded second re-render.\r\n//\r\n// I could see how this minor optimization could get brittle when modifiying the code,\r\n// so I put it under a feature flag so that it could potentially be turned off\r\n// in case of any potential weird issues in some future.\r\n//\r\n// Another reason for using this feature is:\r\n//\r\n// Since `useHandleItemsPropertyChange()` runs at render time\r\n// and not after the render has finished (not in an \"effect\"),\r\n// if the state update was done \"conventionally\" (by calling `_setNewState()`),\r\n// React would throw an error about updating state during render.\r\n// No one knows what the original error message was.\r\n// Perhaps it's no longer relevant in newer versions of React.\r\n//\r\nconst USE_ITEMS_UPDATE_NO_SECOND_RENDER_OPTIMIZATION = true\r\n\r\nfunction VirtualScroller({\r\n\tas: AsComponent,\r\n\titems: itemsProperty,\r\n\titemComponent: Component,\r\n\titemComponentProps,\r\n\t// `estimatedItemHeight` property name is deprecated,\r\n\t// use `getEstimatedItemHeight` property instead.\r\n\testimatedItemHeight,\r\n\tgetEstimatedItemHeight,\r\n\tgetEstimatedVisibleItemRowsCount,\r\n\tbypass,\r\n\ttbody,\r\n\t// `preserveScrollPosition` property name is deprecated,\r\n\t// use `preserveScrollPositionOnPrependItems` property instead.\r\n\tpreserveScrollPosition,\r\n\tpreserveScrollPositionOnPrependItems,\r\n\tmeasureItemsBatchSize,\r\n\t// `scrollableContainer` property is deprecated.\r\n\t// Use `getScrollableContainer()` property instead.\r\n\tscrollableContainer,\r\n\tgetScrollableContainer,\r\n\tgetColumnsCount,\r\n\tgetItemId,\r\n\tclassName,\r\n\tonMount,\r\n\t// `onItemFirstRender(i)` is deprecated, use `onItemInitialRender(item)` instead.\r\n\tonItemFirstRender,\r\n\tonItemInitialRender,\r\n\tinitialScrollPosition,\r\n\tonScrollPositionChange,\r\n\tonStateChange,\r\n\tinitialState,\r\n\tgetInitialItemState,\r\n\t...rest\r\n}, ref) {\r\n\t// List items \"container\" DOM Element reference.\r\n\tconst container = useRef()\r\n\r\n\t// Create a `VirtualScroller` instance.\r\n\tconst virtualScroller = useVirtualScroller({\r\n\t\titems: itemsProperty,\r\n\t\t// `estimatedItemHeight` property name is deprecated,\r\n\t\t// use `getEstimatedItemHeight` property instead.\r\n\t\testimatedItemHeight,\r\n\t\tgetEstimatedItemHeight,\r\n\t\tgetEstimatedVisibleItemRowsCount,\r\n\t\tbypass,\r\n\t\t// bypassBatchSize,\r\n\t\ttbody,\r\n\t\tonItemInitialRender,\r\n\t\t// `onItemFirstRender(i)` is deprecated, use `onItemInitialRender(item)` instead.\r\n\t\tonItemFirstRender,\r\n\t\tinitialScrollPosition,\r\n\t\tonScrollPositionChange,\r\n\t\tmeasureItemsBatchSize,\r\n\t\t// `scrollableContainer` property is deprecated.\r\n\t\t// Use `getScrollableContainer()` property instead.\r\n\t\tscrollableContainer,\r\n\t\tgetScrollableContainer,\r\n\t\tgetColumnsCount,\r\n\t\tgetItemId,\r\n\t\tAsComponent,\r\n\t\tinitialState,\r\n\t\tgetInitialItemState,\r\n\t\tonStateChange\r\n\t}, {\r\n\t\tcontainer\r\n\t})\r\n\r\n\t// Only compute the initial state once.\r\n\tconst _initialState = useMemo(() => {\r\n\t\treturn virtualScroller.getInitialState()\r\n\t}, [])\r\n\r\n\t// Use React's `useState()` hook for managing `VirtualScroller`'s state lifecycle.\r\n\t// This way, React will re-render the component on every state update.\r\n\tconst {\r\n\t\tgetState,\r\n\t\tupdateState,\r\n\t\tgetNextState\r\n\t} = useState({\r\n\t\tinitialState: _initialState,\r\n\t\tonRender: virtualScroller.onRender,\r\n\t\titemsProperty,\r\n\t\tUSE_ITEMS_UPDATE_NO_SECOND_RENDER_OPTIMIZATION\r\n\t})\r\n\r\n\t// Use custom (external) state storage in the `VirtualScroller`.\r\n\tuseMemo(() => {\r\n\t\tvirtualScroller.useState({\r\n\t\t\tgetState,\r\n\t\t\tupdateState\r\n\t\t})\r\n\t}, [])\r\n\r\n\t// Start `VirtualScroller` on mount.\r\n\t// Stop `VirtualScroller` on unmount.\r\n\tuseVirtualScrollerStartStop(virtualScroller)\r\n\r\n\t// List items are rendered with `key`s so that React doesn't\r\n\t// \"reuse\" `itemComponent`s in cases when `items` are changed.\r\n\tconst {\r\n\t\tgetItemKey,\r\n\t\tupdateItemKeysForNewItems\r\n\t} = useItemKeys({\r\n\t\tgetItemId\r\n\t})\r\n\r\n\t// Cache per-item `setItemState` functions' \"references\"\r\n\t// so that item components don't get re-rendered needlessly.\r\n\tconst getSetItemState = useSetItemState({\r\n\t\tinitialItemsCount: itemsProperty.length,\r\n\t\tvirtualScroller\r\n\t})\r\n\r\n\t// Cache per-item `onItemHeightDidChange` functions' \"references\"\r\n\t// so that item components don't get re-rendered needlessly.\r\n\tconst getOnItemHeightDidChange = useOnItemHeightDidChange({\r\n\t\tinitialItemsCount: itemsProperty.length,\r\n\t\tvirtualScroller\r\n\t})\r\n\r\n\t// Calls `.setItems()` if `items` property has changed.\r\n\tuseHandleItemsPropertyChange(itemsProperty, {\r\n\t\tvirtualScroller,\r\n\t\t// `preserveScrollPosition` property name is deprecated,\r\n\t\t// use `preserveScrollPositionOnPrependItems` property instead.\r\n\t\tpreserveScrollPosition,\r\n\t\tpreserveScrollPositionOnPrependItems,\r\n\t\tnextItems: getNextState().items\r\n\t})\r\n\r\n\t// Updates `key`s if item indexes have changed.\r\n\tuseHandleItemIndexesChange({\r\n\t\tvirtualScroller,\r\n\t\titemsBeingRendered: getNextState().items,\r\n\t\tupdateItemKeysForNewItems\r\n\t})\r\n\r\n\t// Add instance methods to the React component.\r\n\tuseInstanceMethods(ref, {\r\n\t\tvirtualScroller\r\n\t})\r\n\r\n\tuseLayoutEffect(() => {\r\n\t\t// (deprecated)\r\n\t\t// `onMount()` option is deprecated due to no longer being used.\r\n\t\t// If someone thinks there's a valid use case for it, create an issue.\r\n\t\tif (onMount) {\r\n\t\t\tonMount()\r\n\t\t}\r\n\t}, [])\r\n\r\n\t// `willRender()` function is no longer used.\r\n\t//\r\n\t// // `getSnapshotBeforeUpdate()` is called right before `componentDidUpdate()`.\r\n\t// // A hook equivalent/workaround for `getSnapshotBeforeUpdate()`:\r\n\t// // https://github.com/facebook/react/issues/15221#issuecomment-583448887\r\n\t// //\r\n\t// getSnapshotBeforeUpdate(prevProps, prevState) {\r\n\t// \tif (this.state !== prevState) {\r\n\t// \t\tthis.willRender(this.state, prevState)\r\n\t// \t}\r\n\t// \t// Returns `null` to avoid React warning:\r\n\t// \t// \"A snapshot value (or null) must be returned. You have returned undefined\".\r\n\t// \treturn null\r\n\t// }\r\n\r\n\tclassName = useClassName(className, {\r\n\t\ttbody\r\n\t})\r\n\r\n\tconst style = useStyle({\r\n\t\ttbody,\r\n\t\tgetNextState\r\n\t})\r\n\r\n\tconst {\r\n\t\titems: currentItems,\r\n\t\titemStates,\r\n\t\tfirstShownItemIndex,\r\n\t\tlastShownItemIndex\r\n\t} = getNextState()\r\n\r\n\treturn (\r\n\t\t<AsComponent\r\n\t\t\t{...rest}\r\n\t\t\tref={container}\r\n\t\t\tclassName={className}\r\n\t\t\tstyle={style}>\r\n\t\t\t{currentItems.map((item, i) => {\r\n\t\t\t\tif (i >= firstShownItemIndex && i <= lastShownItemIndex) {\r\n\t\t\t\t\t// * Passing `item` as `children` property is legacy and is deprecated.\r\n\t\t\t\t\t// If version `2.x` is published in some hypothetical future,\r\n\t\t\t\t\t// the `item` and `itemIndex` properties should be moved below\r\n\t\t\t\t\t// `{...itemComponentProps}`.\r\n\t\t\t\t\t//\r\n\t\t\t\t\t// * Passing `itemIndex` property is legacy and is deprecated.\r\n\t\t\t\t\t// The rationale is that setting new `items` on a React component\r\n\t\t\t\t\t// is an asynchronous operation, so when a user obtains `itemIndex`,\r\n\t\t\t\t\t// they don't know which `items` list does that index correspond to,\r\n\t\t\t\t\t// therefore making it useless, or even buggy if used incorreclty.\r\n\t\t\t\t\t//\r\n\t\t\t\t\t// * Passing `onStateChange` property for legacy reasons.\r\n\t\t\t\t\t// The new property name is `setState`.\r\n\t\t\t\t\t// The old property name `onStateChange` is deprecated.\r\n\t\t\t\t\t//\r\n\t\t\t\t\treturn (\r\n\t\t\t\t\t\t<Component\r\n\t\t\t\t\t\t\titem={item}\r\n\t\t\t\t\t\t\titemIndex={i}\r\n\t\t\t\t\t\t\t{...itemComponentProps}\r\n\t\t\t\t\t\t\tkey={getItemKey(item, i)}\r\n\t\t\t\t\t\t\tstate={itemStates && itemStates[i]}\r\n\t\t\t\t\t\t\tsetState={getSetItemState(i)}\r\n\t\t\t\t\t\t\tonStateChange={getSetItemState(i)}\r\n\t\t\t\t\t\t\tonHeightChange={getOnItemHeightDidChange(i)}\r\n\t\t\t\t\t\t\tonHeightDidChange={getOnItemHeightDidChange(i)}>\r\n\t\t\t\t\t\t\t{item}\r\n\t\t\t\t\t\t</Component>\r\n\t\t\t\t\t)\r\n\t\t\t\t}\r\n\t\t\t\treturn null\r\n\t\t\t})}\r\n\t\t</AsComponent>\r\n\t)\r\n}\r\n\r\nVirtualScroller = React.forwardRef(VirtualScroller)\r\n\r\nexport default VirtualScroller\r\n\r\n// `PropTypes.elementType` is available in some version of `prop-types`.\r\n// https://github.com/facebook/prop-types/issues/200\r\nconst elementType = PropTypes.elementType || PropTypes.oneOfType([\r\n\tPropTypes.string,\r\n\tPropTypes.func,\r\n\tPropTypes.object\r\n])\r\n\r\nVirtualScroller.propTypes = {\r\n\tas: elementType,\r\n\titems: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n\titemComponent: elementType.isRequired,\r\n\titemComponentProps: PropTypes.object,\r\n\t// `estimatedItemHeight` property name is deprecated,\r\n\t// use `getEstimatedItemHeight` property instead.\r\n\testimatedItemHeight: PropTypes.number,\r\n\tgetEstimatedItemHeight: PropTypes.func,\r\n\tgetEstimatedVisibleItemRowsCount: PropTypes.func,\r\n\tbypass: PropTypes.bool,\r\n\t// bypassBatchSize: PropTypes.number,\r\n\ttbody: PropTypes.bool,\r\n\tpreserveScrollPositionOnPrependItems: PropTypes.bool,\r\n\t// `preserveScrollPosition` property name is deprecated,\r\n\t// use `preserveScrollPositionOnPrependItems` instead.\r\n\tpreserveScrollPosition: PropTypes.bool,\r\n\tmeasureItemsBatchSize: PropTypes.number,\r\n\t// `scrollableContainer` property is deprecated.\r\n\t// Use `getScrollableContainer()` property instead.\r\n\tscrollableContainer: PropTypes.any,\r\n\tgetScrollableContainer: PropTypes.func,\r\n\tgetColumnsCount: PropTypes.func,\r\n\tgetItemId: PropTypes.func,\r\n\tclassName: PropTypes.string,\r\n\tonMount: PropTypes.func,\r\n\tonItemInitialRender: PropTypes.func,\r\n\t// `onItemFirstRender(i)` is deprecated, use `onItemInitialRender(item)` instead.\r\n\tonItemFirstRender: PropTypes.func,\r\n\tinitialScrollPosition: PropTypes.number,\r\n\tonScrollPositionChange: PropTypes.func,\r\n\tonStateChange: PropTypes.func,\r\n\tinitialState: PropTypes.shape({\r\n\t\titems: PropTypes.arrayOf(PropTypes.object).isRequired,\r\n\t\titemStates: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n\t\tfirstShownItemIndex: PropTypes.number.isRequired,\r\n\t\tlastShownItemIndex: PropTypes.number.isRequired,\r\n\t\tbeforeItemsHeight: PropTypes.number.isRequired,\r\n\t\tafterItemsHeight: PropTypes.number.isRequired,\r\n\t\titemHeights: PropTypes.arrayOf(PropTypes.number).isRequired,\r\n\t\tcolumnsCount: PropTypes.number,\r\n\t\tverticalSpacing: PropTypes.number\r\n\t}),\r\n\tgetInitialItemState: PropTypes.func\r\n}\r\n\r\nVirtualScroller.defaultProps = {\r\n\tas: 'div'\r\n}\r\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"VirtualScroller.js","names":["VirtualScroller","ref","AsComponent","as","itemsProperty","items","Component","itemComponent","itemComponentProps","estimatedItemHeight","getEstimatedItemHeight","getEstimatedVisibleItemRowsCount","bypass","tbody","preserveScrollPosition","preserveScrollPositionOnPrependItems","measureItemsBatchSize","scrollableContainer","getScrollableContainer","getColumnsCount","getItemId","className","onMount","onItemFirstRender","onItemInitialRender","initialScrollPosition","onScrollPositionChange","onStateChange","initialState","getInitialItemState","rest","container","useRef","virtualScroller","useVirtualScroller","_initialState","useMemo","getInitialState","useState","onRender","getState","setState","stateToRender","useVirtualScrollerStartStop","useItemKeys","getItemKey","usesAutogeneratedItemKeys","updateItemKeysForNewItems","getSetItemState","useSetItemState","initialItemsCount","length","getOnItemHeightDidChange","useOnItemHeightDidChange","useSetNewItemsOnItemsPropertyChange","useUpdateItemKeysOnItemsChange","useInstanceMethods","useLayoutEffect","useClassName","style","useStyle","state","currentItems","itemStates","firstShownItemIndex","lastShownItemIndex","map","item","i","React","forwardRef","elementType","PropTypes","oneOfType","string","func","object","propTypes","arrayOf","any","isRequired","number","bool","shape","beforeItemsHeight","afterItemsHeight","itemHeights","columnsCount","verticalSpacing","defaultProps"],"sources":["../../source/react/VirtualScroller.js"],"sourcesContent":["import React, { useRef, useMemo, useLayoutEffect } from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport useState from './useState.js'\r\nimport useVirtualScroller from './useVirtualScroller.js'\r\nimport useVirtualScrollerStartStop from './useVirtualScrollerStartStop.js'\r\nimport useInstanceMethods from './useInstanceMethods.js'\r\nimport useItemKeys from './useItemKeys.js'\r\nimport useSetItemState from './useSetItemState.js'\r\nimport useOnItemHeightDidChange from './useOnItemHeightDidChange.js'\r\nimport useSetNewItemsOnItemsPropertyChange from './useSetNewItemsOnItemsPropertyChange.js'\r\nimport useUpdateItemKeysOnItemsChange from './useUpdateItemKeysOnItemsChange.js'\r\nimport useClassName from './useClassName.js'\r\nimport useStyle from './useStyle.js'\r\n\r\n// When `items` property changes:\r\n// * A new `items` property is supplied to the React component.\r\n// * The React component re-renders itself.\r\n// * `useSetNewItemsOnItemsPropertyChange()` hook is run.\r\n// * `useSetNewItemsOnItemsPropertyChange()` hook detects that the `items` property\r\n// has changed and calls `VirtualScroller.setItems(items)`.\r\n// * `VirtualScroller.setItems(items)` calls `VirtualScroller.setState()`.\r\n// * `VirtualScroller.setState()` calls the `setState()` function.\r\n// * The `setState()` function calls a setter from a `useState()` hook.\r\n// * The React component re-renders itself the second time.\r\n\r\nfunction VirtualScroller({\r\n\tas: AsComponent,\r\n\titems: itemsProperty,\r\n\titemComponent: Component,\r\n\titemComponentProps,\r\n\t// `estimatedItemHeight` property name is deprecated,\r\n\t// use `getEstimatedItemHeight` property instead.\r\n\testimatedItemHeight,\r\n\tgetEstimatedItemHeight,\r\n\tgetEstimatedVisibleItemRowsCount,\r\n\tbypass,\r\n\ttbody,\r\n\t// `preserveScrollPosition` property name is deprecated,\r\n\t// use `preserveScrollPositionOnPrependItems` property instead.\r\n\tpreserveScrollPosition,\r\n\tpreserveScrollPositionOnPrependItems,\r\n\tmeasureItemsBatchSize,\r\n\t// `scrollableContainer` property is deprecated.\r\n\t// Use `getScrollableContainer()` property instead.\r\n\tscrollableContainer,\r\n\tgetScrollableContainer,\r\n\tgetColumnsCount,\r\n\tgetItemId,\r\n\tclassName,\r\n\tonMount,\r\n\t// `onItemFirstRender(i)` is deprecated, use `onItemInitialRender(item)` instead.\r\n\tonItemFirstRender,\r\n\tonItemInitialRender,\r\n\tinitialScrollPosition,\r\n\tonScrollPositionChange,\r\n\tonStateChange,\r\n\tinitialState,\r\n\tgetInitialItemState,\r\n\t...rest\r\n}, ref) {\r\n\t// List items \"container\" DOM Element reference.\r\n\tconst container = useRef()\r\n\r\n\t// Create a `VirtualScroller` instance.\r\n\tconst virtualScroller = useVirtualScroller({\r\n\t\titems: itemsProperty,\r\n\t\t// `estimatedItemHeight` property name is deprecated,\r\n\t\t// use `getEstimatedItemHeight` property instead.\r\n\t\testimatedItemHeight,\r\n\t\tgetEstimatedItemHeight,\r\n\t\tgetEstimatedVisibleItemRowsCount,\r\n\t\tbypass,\r\n\t\t// bypassBatchSize,\r\n\t\ttbody,\r\n\t\tonItemInitialRender,\r\n\t\t// `onItemFirstRender(i)` is deprecated, use `onItemInitialRender(item)` instead.\r\n\t\tonItemFirstRender,\r\n\t\tinitialScrollPosition,\r\n\t\tonScrollPositionChange,\r\n\t\tmeasureItemsBatchSize,\r\n\t\t// `scrollableContainer` property is deprecated.\r\n\t\t// Use `getScrollableContainer()` property instead.\r\n\t\tscrollableContainer,\r\n\t\tgetScrollableContainer,\r\n\t\tgetColumnsCount,\r\n\t\tgetItemId,\r\n\t\tAsComponent,\r\n\t\tinitialState,\r\n\t\tgetInitialItemState,\r\n\t\tonStateChange\r\n\t}, {\r\n\t\tcontainer\r\n\t})\r\n\r\n\t// Only compute the initial state once.\r\n\tconst _initialState = useMemo(() => {\r\n\t\treturn virtualScroller.getInitialState()\r\n\t}, [])\r\n\r\n\t// Use React's `useState()` hook for managing `VirtualScroller`'s state lifecycle.\r\n\t// This way, React will re-render the component on every state update.\r\n\tconst {\r\n\t\tgetState,\r\n\t\tsetState,\r\n\t\tstateToRender\r\n\t} = useState({\r\n\t\tinitialState: _initialState,\r\n\t\tonRender: virtualScroller.onRender,\r\n\t\titemsProperty\r\n\t})\r\n\r\n\t// Use custom (external) state storage in the `VirtualScroller`.\r\n\tuseMemo(() => {\r\n\t\tvirtualScroller.useState({\r\n\t\t\tgetState,\r\n\t\t\tsetState\r\n\t\t})\r\n\t}, [])\r\n\r\n\t// Start `VirtualScroller` on mount.\r\n\t// Stop `VirtualScroller` on unmount.\r\n\tuseVirtualScrollerStartStop(virtualScroller)\r\n\r\n\t// List items are rendered with `key`s so that React doesn't\r\n\t// \"reuse\" `itemComponent`s in cases when `items` are changed.\r\n\tconst {\r\n\t\tgetItemKey,\r\n\t\tusesAutogeneratedItemKeys,\r\n\t\tupdateItemKeysForNewItems\r\n\t} = useItemKeys({\r\n\t\tgetItemId\r\n\t})\r\n\r\n\t// Cache per-item `setItemState` functions' \"references\"\r\n\t// so that item components don't get re-rendered needlessly.\r\n\tconst getSetItemState = useSetItemState({\r\n\t\tinitialItemsCount: itemsProperty.length,\r\n\t\tvirtualScroller\r\n\t})\r\n\r\n\t// Cache per-item `onItemHeightDidChange` functions' \"references\"\r\n\t// so that item components don't get re-rendered needlessly.\r\n\tconst getOnItemHeightDidChange = useOnItemHeightDidChange({\r\n\t\tinitialItemsCount: itemsProperty.length,\r\n\t\tvirtualScroller\r\n\t})\r\n\r\n\t// Calls `.setItems()` if `items` property has changed.\r\n\tuseSetNewItemsOnItemsPropertyChange(itemsProperty, {\r\n\t\tvirtualScroller,\r\n\t\t// `preserveScrollPosition` property name is deprecated,\r\n\t\t// use `preserveScrollPositionOnPrependItems` property instead.\r\n\t\tpreserveScrollPosition,\r\n\t\tpreserveScrollPositionOnPrependItems\r\n\t})\r\n\r\n\t// Updates `key`s if item indexes have changed.\r\n\tuseUpdateItemKeysOnItemsChange(stateToRender.items, {\r\n\t\tvirtualScroller,\r\n\t\tusesAutogeneratedItemKeys,\r\n\t\tupdateItemKeysForNewItems\r\n\t})\r\n\r\n\t// Add instance methods to the React component.\r\n\tuseInstanceMethods(ref, {\r\n\t\tvirtualScroller\r\n\t})\r\n\r\n\tuseLayoutEffect(() => {\r\n\t\t// (deprecated)\r\n\t\t// `onMount()` option is deprecated due to no longer being used.\r\n\t\t// If someone thinks there's a valid use case for it, create an issue.\r\n\t\tif (onMount) {\r\n\t\t\tonMount()\r\n\t\t}\r\n\t}, [])\r\n\r\n\t// `willRender()` function is no longer used.\r\n\t//\r\n\t// // `getSnapshotBeforeUpdate()` is called right before `componentDidUpdate()`.\r\n\t// // A hook equivalent/workaround for `getSnapshotBeforeUpdate()`:\r\n\t// // https://github.com/facebook/react/issues/15221#issuecomment-583448887\r\n\t// //\r\n\t// getSnapshotBeforeUpdate(prevProps, prevState) {\r\n\t// \tif (this.state !== prevState) {\r\n\t// \t\tthis.willRender(this.state, prevState)\r\n\t// \t}\r\n\t// \t// Returns `null` to avoid React warning:\r\n\t// \t// \"A snapshot value (or null) must be returned. You have returned undefined\".\r\n\t// \treturn null\r\n\t// }\r\n\r\n\tclassName = useClassName(className, {\r\n\t\ttbody\r\n\t})\r\n\r\n\tconst style = useStyle({\r\n\t\ttbody,\r\n\t\tstate: stateToRender\r\n\t})\r\n\r\n\tconst {\r\n\t\titems: currentItems,\r\n\t\titemStates,\r\n\t\tfirstShownItemIndex,\r\n\t\tlastShownItemIndex\r\n\t} = stateToRender\r\n\r\n\treturn (\r\n\t\t<AsComponent\r\n\t\t\t{...rest}\r\n\t\t\tref={container}\r\n\t\t\tclassName={className}\r\n\t\t\tstyle={style}>\r\n\t\t\t{currentItems.map((item, i) => {\r\n\t\t\t\tif (i >= firstShownItemIndex && i <= lastShownItemIndex) {\r\n\t\t\t\t\t// * Passing `item` as `children` property is legacy and is deprecated.\r\n\t\t\t\t\t// If version `2.x` is published in some hypothetical future,\r\n\t\t\t\t\t// the `item` and `itemIndex` properties should be moved below\r\n\t\t\t\t\t// `{...itemComponentProps}`.\r\n\t\t\t\t\t//\r\n\t\t\t\t\t// * Passing `itemIndex` property is legacy and is deprecated.\r\n\t\t\t\t\t// The rationale is that setting new `items` on a React component\r\n\t\t\t\t\t// is an asynchronous operation, so when a user obtains `itemIndex`,\r\n\t\t\t\t\t// they don't know which `items` list does that index correspond to,\r\n\t\t\t\t\t// therefore making it useless, or even buggy if used incorreclty.\r\n\t\t\t\t\t//\r\n\t\t\t\t\t// * Passing `onStateChange` property for legacy reasons.\r\n\t\t\t\t\t// The new property name is `setState`.\r\n\t\t\t\t\t// The old property name `onStateChange` is deprecated.\r\n\t\t\t\t\t//\r\n\t\t\t\t\treturn (\r\n\t\t\t\t\t\t<Component\r\n\t\t\t\t\t\t\titem={item}\r\n\t\t\t\t\t\t\titemIndex={i}\r\n\t\t\t\t\t\t\t{...itemComponentProps}\r\n\t\t\t\t\t\t\tkey={getItemKey(item, i)}\r\n\t\t\t\t\t\t\tstate={itemStates && itemStates[i]}\r\n\t\t\t\t\t\t\tsetState={getSetItemState(i)}\r\n\t\t\t\t\t\t\tonStateChange={getSetItemState(i)}\r\n\t\t\t\t\t\t\tonHeightChange={getOnItemHeightDidChange(i)}\r\n\t\t\t\t\t\t\tonHeightDidChange={getOnItemHeightDidChange(i)}>\r\n\t\t\t\t\t\t\t{item}\r\n\t\t\t\t\t\t</Component>\r\n\t\t\t\t\t)\r\n\t\t\t\t}\r\n\t\t\t\treturn null\r\n\t\t\t})}\r\n\t\t</AsComponent>\r\n\t)\r\n}\r\n\r\nVirtualScroller = React.forwardRef(VirtualScroller)\r\n\r\nexport default VirtualScroller\r\n\r\n// `PropTypes.elementType` is available in some version of `prop-types`.\r\n// https://github.com/facebook/prop-types/issues/200\r\nconst elementType = PropTypes.elementType || PropTypes.oneOfType([\r\n\tPropTypes.string,\r\n\tPropTypes.func,\r\n\tPropTypes.object\r\n])\r\n\r\nVirtualScroller.propTypes = {\r\n\tas: elementType,\r\n\titems: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n\titemComponent: elementType.isRequired,\r\n\titemComponentProps: PropTypes.object,\r\n\t// `estimatedItemHeight` property name is deprecated,\r\n\t// use `getEstimatedItemHeight` property instead.\r\n\testimatedItemHeight: PropTypes.number,\r\n\tgetEstimatedItemHeight: PropTypes.func,\r\n\tgetEstimatedVisibleItemRowsCount: PropTypes.func,\r\n\tbypass: PropTypes.bool,\r\n\t// bypassBatchSize: PropTypes.number,\r\n\ttbody: PropTypes.bool,\r\n\tpreserveScrollPositionOnPrependItems: PropTypes.bool,\r\n\t// `preserveScrollPosition` property name is deprecated,\r\n\t// use `preserveScrollPositionOnPrependItems` instead.\r\n\tpreserveScrollPosition: PropTypes.bool,\r\n\tmeasureItemsBatchSize: PropTypes.number,\r\n\t// `scrollableContainer` property is deprecated.\r\n\t// Use `getScrollableContainer()` property instead.\r\n\tscrollableContainer: PropTypes.any,\r\n\tgetScrollableContainer: PropTypes.func,\r\n\tgetColumnsCount: PropTypes.func,\r\n\tgetItemId: PropTypes.func,\r\n\tclassName: PropTypes.string,\r\n\tonMount: PropTypes.func,\r\n\tonItemInitialRender: PropTypes.func,\r\n\t// `onItemFirstRender(i)` is deprecated, use `onItemInitialRender(item)` instead.\r\n\tonItemFirstRender: PropTypes.func,\r\n\tinitialScrollPosition: PropTypes.number,\r\n\tonScrollPositionChange: PropTypes.func,\r\n\tonStateChange: PropTypes.func,\r\n\tinitialState: PropTypes.shape({\r\n\t\titems: PropTypes.arrayOf(PropTypes.object).isRequired,\r\n\t\titemStates: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n\t\tfirstShownItemIndex: PropTypes.number.isRequired,\r\n\t\tlastShownItemIndex: PropTypes.number.isRequired,\r\n\t\tbeforeItemsHeight: PropTypes.number.isRequired,\r\n\t\tafterItemsHeight: PropTypes.number.isRequired,\r\n\t\titemHeights: PropTypes.arrayOf(PropTypes.number).isRequired,\r\n\t\tcolumnsCount: PropTypes.number,\r\n\t\tverticalSpacing: PropTypes.number\r\n\t}),\r\n\tgetInitialItemState: PropTypes.func\r\n}\r\n\r\nVirtualScroller.defaultProps = {\r\n\tas: 'div'\r\n}\r\n"],"mappings":"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"}
|
|
@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = useItemKeys;
|
|
7
7
|
|
|
8
|
+
var _debug = _interopRequireDefault(require("../utility/debug.js"));
|
|
9
|
+
|
|
8
10
|
var _react = require("react");
|
|
9
11
|
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
|
+
|
|
10
14
|
function useItemKeys(_ref) {
|
|
11
15
|
var getItemId = _ref.getItemId;
|
|
12
16
|
// List items are rendered with `key`s so that React doesn't
|
|
@@ -32,12 +36,15 @@ function useItemKeys(_ref) {
|
|
|
32
36
|
(0, _react.useMemo)(function () {
|
|
33
37
|
// Generate an initial unique `key` prefix for list item components.
|
|
34
38
|
generateItemKeyPrefix();
|
|
35
|
-
}, []);
|
|
39
|
+
}, []); // If `getItemId()` function is defined, then item `id`s are gonna be the item element `key`s.
|
|
40
|
+
|
|
41
|
+
var usesAutogeneratedItemKeys = !getItemId;
|
|
36
42
|
var generateItemKeyPrefixIfNotUsingItemIds = (0, _react.useCallback)(function () {
|
|
37
|
-
if (
|
|
43
|
+
if (usesAutogeneratedItemKeys) {
|
|
38
44
|
generateItemKeyPrefix();
|
|
45
|
+
(0, _debug["default"])('React: ~ Item key prefix:', itemKeyPrefix.current);
|
|
39
46
|
}
|
|
40
|
-
}, [
|
|
47
|
+
}, [usesAutogeneratedItemKeys, generateItemKeyPrefix]);
|
|
41
48
|
/**
|
|
42
49
|
* Returns a `key` for an `item`'s element.
|
|
43
50
|
* @param {object} item — The item.
|
|
@@ -54,6 +61,7 @@ function useItemKeys(_ref) {
|
|
|
54
61
|
}, [getItemId, itemKeyPrefix]);
|
|
55
62
|
return {
|
|
56
63
|
getItemKey: getItemKey,
|
|
64
|
+
usesAutogeneratedItemKeys: usesAutogeneratedItemKeys,
|
|
57
65
|
updateItemKeysForNewItems: generateItemKeyPrefixIfNotUsingItemIds
|
|
58
66
|
};
|
|
59
67
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useItemKeys.js","names":["useItemKeys","getItemId","itemKeyPrefix","useRef","generateItemKeyPrefix","useMemo","counter","getNextCounter","Number","MAX_SAFE_INTEGER","current","String","generateItemKeyPrefixIfNotUsingItemIds","useCallback","getItemKey","item","i","updateItemKeysForNewItems"],"sources":["../../source/react/useItemKeys.js"],"sourcesContent":["import { useRef, useMemo, useCallback } from 'react'\r\n\r\nexport default function useItemKeys({ getItemId }) {\r\n\t// List items are rendered with `key`s so that React doesn't\r\n\t// \"reuse\" `itemComponent`s in cases when `items` are changed.\r\n const itemKeyPrefix = useRef()\r\n\r\n\t// Generates a unique `key` prefix for list item components.\r\n\tconst generateItemKeyPrefix = useMemo(() => {\r\n\t\tlet counter = 0\r\n\t\tfunction getNextCounter() {\r\n\t\t\tif (counter === Number.MAX_SAFE_INTEGER) {\r\n\t\t\t\tcounter = 0\r\n\t\t\t}\r\n\t\t\tcounter++\r\n\t\t\treturn counter\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\titemKeyPrefix.current = String(getNextCounter())\r\n\t\t}\r\n\t}, [\r\n\t\titemKeyPrefix\r\n\t])\r\n\r\n\tuseMemo(() => {\r\n\t\t// Generate an initial unique `key` prefix for list item components.\r\n\t\tgenerateItemKeyPrefix()\r\n\t}, [])\r\n\r\n\tconst generateItemKeyPrefixIfNotUsingItemIds = useCallback(() => {\r\n\t\tif (
|
|
1
|
+
{"version":3,"file":"useItemKeys.js","names":["useItemKeys","getItemId","itemKeyPrefix","useRef","generateItemKeyPrefix","useMemo","counter","getNextCounter","Number","MAX_SAFE_INTEGER","current","String","usesAutogeneratedItemKeys","generateItemKeyPrefixIfNotUsingItemIds","useCallback","log","getItemKey","item","i","updateItemKeysForNewItems"],"sources":["../../source/react/useItemKeys.js"],"sourcesContent":["import log from '../utility/debug.js'\r\n\r\nimport { useRef, useMemo, useCallback } from 'react'\r\n\r\nexport default function useItemKeys({ getItemId }) {\r\n\t// List items are rendered with `key`s so that React doesn't\r\n\t// \"reuse\" `itemComponent`s in cases when `items` are changed.\r\n const itemKeyPrefix = useRef()\r\n\r\n\t// Generates a unique `key` prefix for list item components.\r\n\tconst generateItemKeyPrefix = useMemo(() => {\r\n\t\tlet counter = 0\r\n\t\tfunction getNextCounter() {\r\n\t\t\tif (counter === Number.MAX_SAFE_INTEGER) {\r\n\t\t\t\tcounter = 0\r\n\t\t\t}\r\n\t\t\tcounter++\r\n\t\t\treturn counter\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\titemKeyPrefix.current = String(getNextCounter())\r\n\t\t}\r\n\t}, [\r\n\t\titemKeyPrefix\r\n\t])\r\n\r\n\tuseMemo(() => {\r\n\t\t// Generate an initial unique `key` prefix for list item components.\r\n\t\tgenerateItemKeyPrefix()\r\n\t}, [])\r\n\r\n\t// If `getItemId()` function is defined, then item `id`s are gonna be the item element `key`s.\r\n\tconst usesAutogeneratedItemKeys = !getItemId\r\n\r\n\tconst generateItemKeyPrefixIfNotUsingItemIds = useCallback(() => {\r\n\t\tif (usesAutogeneratedItemKeys) {\r\n\t\t\tgenerateItemKeyPrefix()\r\n\t\t\tlog('React: ~ Item key prefix:', itemKeyPrefix.current)\r\n\t\t}\r\n\t}, [\r\n\t\tusesAutogeneratedItemKeys,\r\n\t\tgenerateItemKeyPrefix\r\n\t])\r\n\r\n\t/**\r\n\t * Returns a `key` for an `item`'s element.\r\n\t * @param {object} item — The item.\r\n\t * @param {number} i — Item's index in `items` list.\r\n\t * @return {any}\r\n\t */\r\n\tconst getItemKey = useCallback((item, i) => {\r\n\t\tif (getItemId) {\r\n\t\t\treturn getItemId(item)\r\n\t\t}\r\n\t\treturn `${itemKeyPrefix.current}:${i}`\r\n\t}, [\r\n\t\tgetItemId,\r\n\t\titemKeyPrefix\r\n\t])\r\n\r\n\treturn {\r\n\t\tgetItemKey,\r\n\t\tusesAutogeneratedItemKeys,\r\n\t\tupdateItemKeysForNewItems: generateItemKeyPrefixIfNotUsingItemIds\r\n\t}\r\n}"],"mappings":";;;;;;;AAAA;;AAEA;;;;AAEe,SAASA,WAAT,OAAoC;EAAA,IAAbC,SAAa,QAAbA,SAAa;EAClD;EACA;EACC,IAAMC,aAAa,GAAG,IAAAC,aAAA,GAAtB,CAHiD,CAKlD;;EACA,IAAMC,qBAAqB,GAAG,IAAAC,cAAA,EAAQ,YAAM;IAC3C,IAAIC,OAAO,GAAG,CAAd;;IACA,SAASC,cAAT,GAA0B;MACzB,IAAID,OAAO,KAAKE,MAAM,CAACC,gBAAvB,EAAyC;QACxCH,OAAO,GAAG,CAAV;MACA;;MACDA,OAAO;MACP,OAAOA,OAAP;IACA;;IACD,OAAO,YAAM;MACZJ,aAAa,CAACQ,OAAd,GAAwBC,MAAM,CAACJ,cAAc,EAAf,CAA9B;IACA,CAFD;EAGA,CAZ6B,EAY3B,CACFL,aADE,CAZ2B,CAA9B;EAgBA,IAAAG,cAAA,EAAQ,YAAM;IACb;IACAD,qBAAqB;EACrB,CAHD,EAGG,EAHH,EAtBkD,CA2BlD;;EACA,IAAMQ,yBAAyB,GAAG,CAACX,SAAnC;EAEA,IAAMY,sCAAsC,GAAG,IAAAC,kBAAA,EAAY,YAAM;IAChE,IAAIF,yBAAJ,EAA+B;MAC9BR,qBAAqB;MACrB,IAAAW,iBAAA,EAAI,2BAAJ,EAAiCb,aAAa,CAACQ,OAA/C;IACA;EACD,CAL8C,EAK5C,CACFE,yBADE,EAEFR,qBAFE,CAL4C,CAA/C;EAUA;AACD;AACA;AACA;AACA;AACA;;EACC,IAAMY,UAAU,GAAG,IAAAF,kBAAA,EAAY,UAACG,IAAD,EAAOC,CAAP,EAAa;IAC3C,IAAIjB,SAAJ,EAAe;MACd,OAAOA,SAAS,CAACgB,IAAD,CAAhB;IACA;;IACD,iBAAUf,aAAa,CAACQ,OAAxB,cAAmCQ,CAAnC;EACA,CALkB,EAKhB,CACFjB,SADE,EAEFC,aAFE,CALgB,CAAnB;EAUA,OAAO;IACNc,UAAU,EAAVA,UADM;IAENJ,yBAAyB,EAAzBA,yBAFM;IAGNO,yBAAyB,EAAEN;EAHrB,CAAP;AAKA"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = useOnChange;
|
|
7
|
+
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
|
|
10
|
+
function useOnChange(value, onChange) {
|
|
11
|
+
var previousValueRef = (0, _react.useRef)(value);
|
|
12
|
+
var previousValue = previousValueRef.current;
|
|
13
|
+
previousValueRef.current = value;
|
|
14
|
+
|
|
15
|
+
if (value !== previousValue) {
|
|
16
|
+
onChange(value, previousValue);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
//# sourceMappingURL=useOnChange.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useOnChange.js","names":["useOnChange","value","onChange","previousValueRef","useRef","previousValue","current"],"sources":["../../source/react/useOnChange.js"],"sourcesContent":["import { useRef } from 'react'\r\n\r\nexport default function useOnChange(value, onChange) {\r\n\tconst previousValueRef = useRef(value)\r\n\tconst previousValue = previousValueRef.current\r\n\tpreviousValueRef.current = value\r\n\r\n\tif (value !== previousValue) {\r\n\t\tonChange(value, previousValue)\r\n\t}\r\n}"],"mappings":";;;;;;;AAAA;;AAEe,SAASA,WAAT,CAAqBC,KAArB,EAA4BC,QAA5B,EAAsC;EACpD,IAAMC,gBAAgB,GAAG,IAAAC,aAAA,EAAOH,KAAP,CAAzB;EACA,IAAMI,aAAa,GAAGF,gBAAgB,CAACG,OAAvC;EACAH,gBAAgB,CAACG,OAAjB,GAA2BL,KAA3B;;EAEA,IAAIA,KAAK,KAAKI,aAAd,EAA6B;IAC5BH,QAAQ,CAACD,KAAD,EAAQI,aAAR,CAAR;EACA;AACD"}
|
package/commonjs/react/{useHandleItemsPropertyChange.js → useSetNewItemsOnItemsPropertyChange.js}
RENAMED
|
@@ -3,9 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports["default"] =
|
|
6
|
+
exports["default"] = useSetNewItemsOnItemsPropertyChange;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _debug = _interopRequireDefault(require("../utility/debug.js"));
|
|
9
|
+
|
|
10
|
+
var _useOnChange = _interopRequireDefault(require("./useOnChange.js"));
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
9
13
|
|
|
10
14
|
// If new `items` property is passed:
|
|
11
15
|
//
|
|
@@ -15,11 +19,10 @@ var _react = require("react");
|
|
|
15
19
|
//
|
|
16
20
|
// * Call `VirtualScroller.setItems()` function.
|
|
17
21
|
//
|
|
18
|
-
function
|
|
22
|
+
function useSetNewItemsOnItemsPropertyChange(itemsProperty, _ref) {
|
|
19
23
|
var virtualScroller = _ref.virtualScroller,
|
|
20
24
|
preserveScrollPosition = _ref.preserveScrollPosition,
|
|
21
|
-
preserveScrollPositionOnPrependItems = _ref.preserveScrollPositionOnPrependItems
|
|
22
|
-
nextItems = _ref.nextItems;
|
|
25
|
+
preserveScrollPositionOnPrependItems = _ref.preserveScrollPositionOnPrependItems;
|
|
23
26
|
// During render, check if the `items` list has changed.
|
|
24
27
|
// If it has, capture the Y scroll position and updated item element `key`s.
|
|
25
28
|
// A long "advanced" sidenote on why capturing scroll Y position
|
|
@@ -62,14 +65,11 @@ function useHandleItemsPropertyChange(itemsProperty, _ref) {
|
|
|
62
65
|
// time rather than later in `componentDidUpdate()`: this way,
|
|
63
66
|
// scroll Y position is captured while the "Show previous" button
|
|
64
67
|
// is still being shown.
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
previousItemsProperty.current = itemsProperty;
|
|
68
|
-
|
|
69
|
-
if (hasItemsPropertyChanged) {
|
|
68
|
+
(0, _useOnChange["default"])(itemsProperty, function (itemsProperty, prevItemsProperty) {
|
|
69
|
+
(0, _debug["default"])('React: ~ Different `items` property has been passed', itemsProperty);
|
|
70
70
|
var shouldUpdateItems = true; // Analyze the upcoming `items` change.
|
|
71
71
|
|
|
72
|
-
var itemsDiff = virtualScroller.getItemsDiff(
|
|
72
|
+
var itemsDiff = virtualScroller.getItemsDiff(prevItemsProperty, itemsProperty); // `itemsDiff` will be `undefined` in case of a non-incremental items list change.
|
|
73
73
|
|
|
74
74
|
if (itemsDiff) {
|
|
75
75
|
var prependedItemsCount = itemsDiff.prependedItemsCount,
|
|
@@ -78,12 +78,13 @@ function useHandleItemsPropertyChange(itemsProperty, _ref) {
|
|
|
78
78
|
if (prependedItemsCount === 0 && appendedItemsCount === 0) {
|
|
79
79
|
// The items order hasn't changed.
|
|
80
80
|
// No need to update them in `VirtualScroller` or to snapshot the Y scroll position.
|
|
81
|
+
(0, _debug["default"])('React: ~ The `items` elements are identical to the previous ones');
|
|
81
82
|
shouldUpdateItems = false;
|
|
82
83
|
}
|
|
83
84
|
}
|
|
84
85
|
|
|
85
86
|
if (shouldUpdateItems) {
|
|
86
|
-
//
|
|
87
|
+
// Make a request to update the `items` in `VirtualScroller`.
|
|
87
88
|
// This will result in a `setState()` call.
|
|
88
89
|
// The new items won't be rendered until that state update is applied.
|
|
89
90
|
virtualScroller.setItems(itemsProperty, {
|
|
@@ -92,6 +93,6 @@ function useHandleItemsPropertyChange(itemsProperty, _ref) {
|
|
|
92
93
|
preserveScrollPositionOnPrependItems: preserveScrollPositionOnPrependItems || preserveScrollPosition
|
|
93
94
|
});
|
|
94
95
|
}
|
|
95
|
-
}
|
|
96
|
+
});
|
|
96
97
|
}
|
|
97
|
-
//# sourceMappingURL=
|
|
98
|
+
//# sourceMappingURL=useSetNewItemsOnItemsPropertyChange.js.map
|