virtual-scroller 1.8.1 → 1.9.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 +57 -0
- package/README.md +337 -160
- 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 +23 -27
- package/commonjs/BeforeResize.js.map +1 -1
- package/commonjs/DOM/Engine.js +7 -7
- package/commonjs/DOM/Engine.js.map +1 -1
- package/commonjs/DOM/ItemsContainer.js +1 -1
- package/commonjs/DOM/ItemsContainer.js.map +1 -1
- package/commonjs/DOM/ListTopOffsetWatcher.js +15 -9
- package/commonjs/DOM/ListTopOffsetWatcher.js.map +1 -1
- package/commonjs/DOM/ScrollableContainer.js +28 -28
- package/commonjs/DOM/ScrollableContainer.js.map +1 -1
- package/commonjs/DOM/VirtualScroller.js +20 -17
- package/commonjs/DOM/VirtualScroller.js.map +1 -1
- package/commonjs/DOM/tbody.js +16 -10
- package/commonjs/DOM/tbody.js.map +1 -1
- package/commonjs/ItemHeights.js +13 -7
- package/commonjs/ItemHeights.js.map +1 -1
- package/commonjs/Layout.js +15 -13
- package/commonjs/Layout.js.map +1 -1
- package/commonjs/Layout.test.js +8 -3
- package/commonjs/Layout.test.js.map +1 -1
- package/commonjs/{ListHeightChangeWatcher.js → ListHeightMeasurement.js} +26 -28
- package/commonjs/ListHeightMeasurement.js.map +1 -0
- package/commonjs/Resize.js +38 -28
- package/commonjs/Resize.js.map +1 -1
- package/commonjs/Scroll.js +28 -44
- package/commonjs/Scroll.js.map +1 -1
- package/commonjs/VirtualScroller.columns.js +43 -0
- package/commonjs/VirtualScroller.columns.js.map +1 -0
- package/commonjs/VirtualScroller.constructor.js +408 -0
- package/commonjs/VirtualScroller.constructor.js.map +1 -0
- package/commonjs/VirtualScroller.items.js +305 -0
- package/commonjs/VirtualScroller.items.js.map +1 -0
- package/commonjs/VirtualScroller.js +132 -1872
- package/commonjs/VirtualScroller.js.map +1 -1
- package/commonjs/VirtualScroller.layout.js +562 -0
- package/commonjs/VirtualScroller.layout.js.map +1 -0
- package/commonjs/VirtualScroller.onRender.js +357 -0
- package/commonjs/VirtualScroller.onRender.js.map +1 -0
- package/commonjs/VirtualScroller.resize.js +186 -0
- package/commonjs/VirtualScroller.resize.js.map +1 -0
- package/commonjs/VirtualScroller.state.js +301 -0
- package/commonjs/VirtualScroller.state.js.map +1 -0
- package/commonjs/VirtualScroller.verticalSpacing.js +65 -0
- package/commonjs/VirtualScroller.verticalSpacing.js.map +1 -0
- package/commonjs/getItemCoordinates.js.map +1 -1
- package/commonjs/getItemsDiff.js.map +1 -1
- package/commonjs/getVerticalSpacing.js.map +1 -1
- package/commonjs/package.json +5 -0
- package/commonjs/react/VirtualScroller.js +180 -620
- package/commonjs/react/VirtualScroller.js.map +1 -1
- package/commonjs/react/useClassName.js +26 -0
- package/commonjs/react/useClassName.js.map +1 -0
- package/commonjs/react/useHandleItemsChange.js +116 -0
- package/commonjs/react/useHandleItemsChange.js.map +1 -0
- package/commonjs/react/useInstanceMethods.js +37 -0
- package/commonjs/react/useInstanceMethods.js.map +1 -0
- package/commonjs/react/useItemKeys.js +60 -0
- package/commonjs/react/useItemKeys.js.map +1 -0
- package/commonjs/react/useOnItemHeightChange.js +32 -0
- package/commonjs/react/useOnItemHeightChange.js.map +1 -0
- package/commonjs/react/useOnItemStateChange.js +32 -0
- package/commonjs/react/useOnItemStateChange.js.map +1 -0
- package/commonjs/react/useState.js +140 -0
- package/commonjs/react/useState.js.map +1 -0
- package/commonjs/react/useStyle.js +29 -0
- package/commonjs/react/useStyle.js.map +1 -0
- package/commonjs/react/useVirtualScroller.js +62 -0
- package/commonjs/react/useVirtualScroller.js.map +1 -0
- package/commonjs/react/useVirtualScrollerStartStop.js +20 -0
- package/commonjs/react/useVirtualScrollerStartStop.js.map +1 -0
- package/commonjs/test/Engine.js +23 -0
- package/commonjs/test/Engine.js.map +1 -0
- package/commonjs/test/ItemsContainer.js +127 -0
- package/commonjs/test/ItemsContainer.js.map +1 -0
- package/commonjs/test/ScrollableContainer.js +130 -0
- package/commonjs/test/ScrollableContainer.js.map +1 -0
- package/commonjs/test/VirtualScroller.js +281 -0
- package/commonjs/test/VirtualScroller.js.map +1 -0
- package/commonjs/utility/debounce.js +2 -2
- package/commonjs/utility/debounce.js.map +1 -1
- package/commonjs/utility/debug.js.map +1 -1
- package/commonjs/utility/getStateSnapshot.js +2 -2
- package/commonjs/utility/getStateSnapshot.js.map +1 -1
- package/commonjs/utility/px.js.map +1 -1
- package/commonjs/utility/px.test.js +1 -1
- package/commonjs/utility/px.test.js.map +1 -1
- 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.cjs +4 -0
- package/dom/index.cjs.js +9 -0
- package/dom/index.d.ts +6 -4
- package/dom/index.js +1 -1
- package/dom/package.json +10 -4
- package/index.cjs +4 -0
- package/index.cjs.js +9 -0
- package/index.d.ts +30 -15
- package/index.js +1 -1
- package/modules/BeforeResize.js +22 -27
- package/modules/BeforeResize.js.map +1 -1
- package/modules/DOM/Engine.js +6 -6
- package/modules/DOM/Engine.js.map +1 -1
- package/modules/DOM/ItemsContainer.js +1 -1
- package/modules/DOM/ItemsContainer.js.map +1 -1
- package/modules/DOM/ListTopOffsetWatcher.js +15 -9
- package/modules/DOM/ListTopOffsetWatcher.js.map +1 -1
- package/modules/DOM/ScrollableContainer.js +28 -28
- package/modules/DOM/ScrollableContainer.js.map +1 -1
- package/modules/DOM/VirtualScroller.js +19 -16
- package/modules/DOM/VirtualScroller.js.map +1 -1
- package/modules/DOM/tbody.js +11 -9
- package/modules/DOM/tbody.js.map +1 -1
- package/modules/ItemHeights.js +12 -6
- package/modules/ItemHeights.js.map +1 -1
- package/modules/Layout.js +14 -12
- package/modules/Layout.js.map +1 -1
- package/modules/Layout.test.js +8 -3
- package/modules/Layout.test.js.map +1 -1
- package/modules/{ListHeightChangeWatcher.js → ListHeightMeasurement.js} +25 -27
- package/modules/ListHeightMeasurement.js.map +1 -0
- package/modules/Resize.js +38 -28
- package/modules/Resize.js.map +1 -1
- package/modules/Scroll.js +28 -44
- package/modules/Scroll.js.map +1 -1
- package/modules/VirtualScroller.columns.js +36 -0
- package/modules/VirtualScroller.columns.js.map +1 -0
- package/modules/VirtualScroller.constructor.js +371 -0
- package/modules/VirtualScroller.constructor.js.map +1 -0
- package/modules/VirtualScroller.items.js +288 -0
- package/modules/VirtualScroller.items.js.map +1 -0
- package/modules/VirtualScroller.js +132 -1860
- package/modules/VirtualScroller.js.map +1 -1
- package/modules/VirtualScroller.layout.js +549 -0
- package/modules/VirtualScroller.layout.js.map +1 -0
- package/modules/VirtualScroller.onRender.js +337 -0
- package/modules/VirtualScroller.onRender.js.map +1 -0
- package/modules/VirtualScroller.resize.js +176 -0
- package/modules/VirtualScroller.resize.js.map +1 -0
- package/modules/VirtualScroller.state.js +283 -0
- package/modules/VirtualScroller.state.js.map +1 -0
- package/modules/VirtualScroller.verticalSpacing.js +54 -0
- package/modules/VirtualScroller.verticalSpacing.js.map +1 -0
- package/modules/getItemCoordinates.js.map +1 -1
- package/modules/getItemsDiff.js.map +1 -1
- package/modules/getVerticalSpacing.js.map +1 -1
- package/modules/react/VirtualScroller.js +176 -625
- package/modules/react/VirtualScroller.js.map +1 -1
- package/modules/react/useClassName.js +18 -0
- package/modules/react/useClassName.js.map +1 -0
- package/modules/react/useHandleItemsChange.js +108 -0
- package/modules/react/useHandleItemsChange.js.map +1 -0
- package/modules/react/useInstanceMethods.js +28 -0
- package/modules/react/useInstanceMethods.js.map +1 -0
- package/modules/react/useItemKeys.js +52 -0
- package/modules/react/useItemKeys.js.map +1 -0
- package/modules/react/useOnItemHeightChange.js +24 -0
- package/modules/react/useOnItemHeightChange.js.map +1 -0
- package/modules/react/useOnItemStateChange.js +24 -0
- package/modules/react/useOnItemStateChange.js.map +1 -0
- package/modules/react/useState.js +132 -0
- package/modules/react/useState.js.map +1 -0
- package/modules/react/useStyle.js +19 -0
- package/modules/react/useStyle.js.map +1 -0
- package/modules/react/useVirtualScroller.js +51 -0
- package/modules/react/useVirtualScroller.js.map +1 -0
- package/modules/react/useVirtualScrollerStartStop.js +12 -0
- package/modules/react/useVirtualScrollerStartStop.js.map +1 -0
- package/modules/test/Engine.js +11 -0
- package/modules/test/Engine.js.map +1 -0
- package/modules/test/ItemsContainer.js +120 -0
- package/modules/test/ItemsContainer.js.map +1 -0
- package/modules/test/ScrollableContainer.js +123 -0
- package/modules/test/ScrollableContainer.js.map +1 -0
- package/modules/test/VirtualScroller.js +270 -0
- package/modules/test/VirtualScroller.js.map +1 -0
- package/modules/utility/debounce.js +2 -2
- package/modules/utility/debounce.js.map +1 -1
- package/modules/utility/debug.js.map +1 -1
- package/modules/utility/getStateSnapshot.js +2 -2
- package/modules/utility/getStateSnapshot.js.map +1 -1
- package/modules/utility/px.js.map +1 -1
- package/modules/utility/px.test.js +1 -1
- package/modules/utility/px.test.js.map +1 -1
- 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 +46 -23
- package/react/index.cjs +4 -0
- package/react/index.cjs.js +9 -0
- package/react/index.d.ts +10 -9
- package/react/index.js +1 -1
- package/react/package.json +10 -4
- package/rollup.config.mjs +62 -0
- package/runnable/create-commonjs-package-json.js +11 -0
- package/source/BeforeResize.js +16 -21
- package/source/DOM/Engine.js +8 -10
- package/source/DOM/ListTopOffsetWatcher.js +13 -8
- package/source/DOM/ScrollableContainer.js +23 -21
- package/source/DOM/VirtualScroller.js +27 -11
- package/source/DOM/tbody.js +30 -21
- package/source/ItemHeights.js +9 -4
- package/source/Layout.js +12 -9
- package/source/Layout.test.js +8 -3
- package/source/{ListHeightChangeWatcher.js → ListHeightMeasurement.js} +21 -20
- package/source/Resize.js +41 -25
- package/source/Scroll.js +27 -35
- package/source/VirtualScroller.columns.js +26 -0
- package/source/VirtualScroller.constructor.js +336 -0
- package/source/VirtualScroller.items.js +302 -0
- package/source/VirtualScroller.js +144 -1875
- package/source/VirtualScroller.layout.js +539 -0
- package/source/VirtualScroller.onRender.js +345 -0
- package/source/VirtualScroller.resize.js +189 -0
- package/source/VirtualScroller.state.js +284 -0
- package/source/VirtualScroller.verticalSpacing.js +51 -0
- package/source/react/VirtualScroller.js +243 -587
- package/source/react/useClassName.js +14 -0
- package/source/react/useHandleItemsChange.js +115 -0
- package/source/react/useInstanceMethods.js +25 -0
- package/source/react/useItemKeys.js +59 -0
- package/source/react/useOnItemHeightChange.js +28 -0
- package/source/react/useOnItemStateChange.js +28 -0
- package/source/react/useState.js +114 -0
- package/source/react/useStyle.js +20 -0
- package/source/react/useVirtualScroller.js +59 -0
- package/source/react/useVirtualScrollerStartStop.js +12 -0
- package/source/test/Engine.js +11 -0
- package/source/test/ItemsContainer.js +87 -0
- package/source/test/ScrollableContainer.js +88 -0
- package/source/test/VirtualScroller.js +232 -0
- package/source/utility/debounce.js +2 -2
- package/source/utility/px.test.js +1 -1
- package/babel.config.js +0 -25
- package/babel.js +0 -5
- package/commonjs/ListHeightChangeWatcher.js.map +0 -1
- package/dom/index.commonjs.js +0 -4
- package/index.commonjs.js +0 -4
- package/modules/ListHeightChangeWatcher.js.map +0 -1
- package/react/index.commonjs.js +0 -4
|
@@ -0,0 +1,232 @@
|
|
|
1
|
+
import VirtualScroller from '../VirtualScroller.js'
|
|
2
|
+
import Engine from './Engine.js'
|
|
3
|
+
|
|
4
|
+
const DEBUG = false
|
|
5
|
+
|
|
6
|
+
export default class TestVirtualScroller {
|
|
7
|
+
constructor({
|
|
8
|
+
screenWidth: scrollableContainerWidth,
|
|
9
|
+
screenHeight: scrollableContainerHeight,
|
|
10
|
+
columnsCount,
|
|
11
|
+
verticalSpacing,
|
|
12
|
+
items,
|
|
13
|
+
state: initialState
|
|
14
|
+
}) {
|
|
15
|
+
this.expectedStateUpdates = []
|
|
16
|
+
|
|
17
|
+
const scrollableContainerElement = {
|
|
18
|
+
width: scrollableContainerWidth,
|
|
19
|
+
height: scrollableContainerHeight
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
const containerElement = {
|
|
23
|
+
paddingTop: 0,
|
|
24
|
+
paddingBottom: 0,
|
|
25
|
+
width: scrollableContainerElement.width,
|
|
26
|
+
children: []
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
this.setScrollableContainerWidth = (width) => {
|
|
30
|
+
scrollableContainerElement.width = width
|
|
31
|
+
containerElement.width = width
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
this.setScrollableContainerHeight = (height) => {
|
|
35
|
+
scrollableContainerElement.height = height
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
const getItemsContainerElement = () => containerElement
|
|
39
|
+
|
|
40
|
+
this.__columnsCount = columnsCount
|
|
41
|
+
|
|
42
|
+
const getColumnsCount = () => this.__columnsCount
|
|
43
|
+
const getItemWidth = () => scrollableContainerElement.width / getColumnsCount()
|
|
44
|
+
|
|
45
|
+
this.hasPausedStateUpdates = undefined
|
|
46
|
+
this.pausedStateUpdate = undefined
|
|
47
|
+
this.pausedStateUpdateAction = undefined
|
|
48
|
+
|
|
49
|
+
const onBeforeUpdateState = (stateUpdate) => {
|
|
50
|
+
if (this.expectedStateUpdates.length > 0) {
|
|
51
|
+
const expectedStateUpdate = this.expectedStateUpdates.shift()
|
|
52
|
+
expect(stateUpdate).to.deep.equal(expectedStateUpdate.stateUpdate)
|
|
53
|
+
if (expectedStateUpdate.callback) {
|
|
54
|
+
expectedStateUpdate.callback()
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
const render = () => {
|
|
60
|
+
const {
|
|
61
|
+
items,
|
|
62
|
+
beforeItemsHeight,
|
|
63
|
+
afterItemsHeight,
|
|
64
|
+
firstShownItemIndex,
|
|
65
|
+
lastShownItemIndex
|
|
66
|
+
} = this.virtualScroller.getState()
|
|
67
|
+
|
|
68
|
+
console.log('~ Render List ~')
|
|
69
|
+
|
|
70
|
+
containerElement.paddingTop = beforeItemsHeight
|
|
71
|
+
containerElement.paddingBottom = afterItemsHeight
|
|
72
|
+
|
|
73
|
+
containerElement.children = items
|
|
74
|
+
.slice(firstShownItemIndex, lastShownItemIndex + 1)
|
|
75
|
+
.map((item) => ({
|
|
76
|
+
width: getItemWidth(),
|
|
77
|
+
height: item.area / getItemWidth(),
|
|
78
|
+
marginTop: verticalSpacing
|
|
79
|
+
}))
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
this.virtualScroller = new VirtualScroller(getItemsContainerElement, items, {
|
|
83
|
+
scrollableContainer: scrollableContainerElement,
|
|
84
|
+
engine: Engine,
|
|
85
|
+
_waitForScrollingToStop: false,
|
|
86
|
+
getColumnsCount,
|
|
87
|
+
state: initialState,
|
|
88
|
+
onStateChange(state) {
|
|
89
|
+
if (DEBUG) {
|
|
90
|
+
console.log('~ Updated State ~')
|
|
91
|
+
console.log(state)
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
})
|
|
95
|
+
|
|
96
|
+
let state = this.virtualScroller.getInitialState()
|
|
97
|
+
|
|
98
|
+
this.virtualScroller.useState({
|
|
99
|
+
getState: () => state,
|
|
100
|
+
updateState: (stateUpdate) => {
|
|
101
|
+
const stateUpdateAction = (stateUpdate) => {
|
|
102
|
+
// Is only used in tests.
|
|
103
|
+
if (onBeforeUpdateState) {
|
|
104
|
+
onBeforeUpdateState(stateUpdate)
|
|
105
|
+
}
|
|
106
|
+
state = {
|
|
107
|
+
...state,
|
|
108
|
+
...stateUpdate
|
|
109
|
+
}
|
|
110
|
+
render()
|
|
111
|
+
this.virtualScroller.onRender()
|
|
112
|
+
}
|
|
113
|
+
if (this.hasPausedStateUpdates) {
|
|
114
|
+
this.pausedStateUpdate = {
|
|
115
|
+
...this.pausedStateUpdate,
|
|
116
|
+
...stateUpdate
|
|
117
|
+
}
|
|
118
|
+
this.pausedStateUpdateAction = stateUpdateAction
|
|
119
|
+
} else {
|
|
120
|
+
stateUpdateAction(stateUpdate)
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
})
|
|
124
|
+
|
|
125
|
+
render()
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
pauseStateUpdates() {
|
|
129
|
+
if (this.hasPausedStateUpdates) {
|
|
130
|
+
throw new Error('[virtual-scroller] State updates have already been paused')
|
|
131
|
+
}
|
|
132
|
+
this.hasPausedStateUpdates = true
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
resumeStateUpdates() {
|
|
136
|
+
if (this.pausedStateUpdate) {
|
|
137
|
+
this.pausedStateUpdateAction(this.pausedStateUpdate)
|
|
138
|
+
this.pausedStateUpdate = undefined
|
|
139
|
+
this.pausedStateUpdateAction = undefined
|
|
140
|
+
}
|
|
141
|
+
this.hasPausedStateUpdates = false
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
verifyState(expectedState) {
|
|
145
|
+
// `mocha`/`chai`.
|
|
146
|
+
this.virtualScroller.getState().should.deep.include(expectedState)
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
expectStateUpdate(stateUpdate, callback) {
|
|
150
|
+
this.expectedStateUpdates.push({
|
|
151
|
+
stateUpdate,
|
|
152
|
+
callback
|
|
153
|
+
})
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
getFirstNonMeasuredItemIndex() {
|
|
157
|
+
return this.virtualScroller.firstNonMeasuredItemIndex
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
getScrollY() {
|
|
161
|
+
return this.virtualScroller.scrollableContainer.getScrollY()
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
scrollTo(scrollPosition) {
|
|
165
|
+
this.virtualScroller.scrollableContainer.scrollToY(scrollPosition)
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
resize({
|
|
169
|
+
screenWidth: scrollableContainerWidth,
|
|
170
|
+
screenHeight: scrollableContainerHeight,
|
|
171
|
+
columnsCount
|
|
172
|
+
}) {
|
|
173
|
+
// Resize scrollable container.
|
|
174
|
+
this.setScrollableContainerWidth(scrollableContainerWidth)
|
|
175
|
+
this.setScrollableContainerHeight(scrollableContainerHeight)
|
|
176
|
+
|
|
177
|
+
// Update columns count.
|
|
178
|
+
this.__columnsCount = columnsCount
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
// Returns a `Promise`.
|
|
182
|
+
triggerResize({
|
|
183
|
+
screenWidth,
|
|
184
|
+
screenHeight,
|
|
185
|
+
columnsCount,
|
|
186
|
+
verticalSpacing
|
|
187
|
+
}) {
|
|
188
|
+
this.resize({
|
|
189
|
+
screenWidth,
|
|
190
|
+
screenHeight,
|
|
191
|
+
columnsCount,
|
|
192
|
+
verticalSpacing
|
|
193
|
+
})
|
|
194
|
+
|
|
195
|
+
// Call "on resize" listener.
|
|
196
|
+
return this.virtualScroller.scrollableContainer._triggerResizeListener()
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
stop() {
|
|
200
|
+
if (this.expectedStateUpdates.length > 0) {
|
|
201
|
+
throw new Error(`[virtual-scroller] Expected ${this.expectedStateUpdates.length} state updates which didn't happen:\n${JSON.stringify(this.expectedStateUpdates, null, 2)}`)
|
|
202
|
+
}
|
|
203
|
+
if (this.pausedStateUpdate) {
|
|
204
|
+
throw new Error('[virtual-scroller] State updates were paused and haven\'t been resumed afterwards')
|
|
205
|
+
}
|
|
206
|
+
this.virtualScroller.stop()
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
start() {
|
|
210
|
+
this.virtualScroller.start()
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
getState() {
|
|
214
|
+
return this.virtualScroller.getState()
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
updateLayout() {
|
|
218
|
+
this.virtualScroller.updateLayout()
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
getItemScrollPosition(i) {
|
|
222
|
+
return this.virtualScroller.getItemScrollPosition(i)
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
getAverageItemHeight() {
|
|
226
|
+
return this.virtualScroller.itemHeights.getAverage()
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
setItems(newItems, options) {
|
|
230
|
+
this.virtualScroller.setItems(newItems, options)
|
|
231
|
+
}
|
|
232
|
+
}
|
|
@@ -6,11 +6,11 @@ import { setTimeout, clearTimeout } from 'request-animation-frame-timeout'
|
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
8
|
* Same as `lodash`'s `debounce()` for functions with no arguments.
|
|
9
|
-
* @param {function} func
|
|
9
|
+
* @param {function} func — The function.
|
|
10
10
|
* @param {number} interval
|
|
11
11
|
* @param {function} [options.onStart]
|
|
12
12
|
* @param {function} [options.onStop]
|
|
13
|
-
* @return {function}
|
|
13
|
+
* @return {function} A function that returns a `Promise` which resolves when the underlying (original) function gets executed.
|
|
14
14
|
*/
|
|
15
15
|
export default function debounce(func, interval, { onStart, onStop } = {}) {
|
|
16
16
|
let timeout
|
package/babel.config.js
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
"presets": [
|
|
3
|
-
"@babel/preset-env",
|
|
4
|
-
"@babel/preset-react"
|
|
5
|
-
],
|
|
6
|
-
|
|
7
|
-
"plugins": [
|
|
8
|
-
["@babel/plugin-transform-for-of", { loose: true }],
|
|
9
|
-
"@babel/plugin-proposal-object-rest-spread",
|
|
10
|
-
"@babel/plugin-proposal-class-properties"
|
|
11
|
-
],
|
|
12
|
-
|
|
13
|
-
"env": {
|
|
14
|
-
"es6": {
|
|
15
|
-
"presets": [
|
|
16
|
-
["@babel/preset-env", { modules: false }]
|
|
17
|
-
]
|
|
18
|
-
},
|
|
19
|
-
"test": {
|
|
20
|
-
"plugins": [
|
|
21
|
-
"babel-plugin-istanbul"
|
|
22
|
-
]
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
}
|
package/babel.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../source/ListHeightChangeWatcher.js"],"names":["ListHeightChangeWatcher","itemsContainer","getListTopOffset","previousItems","newItems","prependedItemsCount","length","_snapshot","itemIndex","itemTopOffset","getNthRenderedItemTopOffset","listTopOffset","undefined","itemTopOffsetNew","listTopOffsetNew"],"mappings":";;;;;;;;;;;;;IAAqBA,uB;AACpB,yCAGG;AAAA,QAFFC,cAEE,QAFFA,cAEE;AAAA,QADFC,gBACE,QADFA,gBACE;;AAAA;;AACF,SAAKD,cAAL,GAAsBA,cAAtB;AACA,SAAKC,gBAAL,GAAwBA,gBAAxB;AACA;AAED;AACD;AACA;AACA;AACA;AACA;;;;;WACC,yBAIG;AAAA,UAHFC,aAGE,SAHFA,aAGE;AAAA,UAFFC,QAEE,SAFFA,QAEE;AAAA,UADFC,mBACE,SADFA,mBACE;;AACF;AACA;AACA,UAAIF,aAAa,CAACG,MAAd,KAAyB,CAA7B,EAAgC;AAC/B;AACA,OALC,CAMF;;;AACA,UAAID,mBAAmB,KAAK,CAA5B,EAA+B;AAC9B;AACA,OATC,CAUF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,UAAI,KAAKE,SAAL,IACH,KAAKA,SAAL,CAAeJ,aAAf,KAAiCA,aAD9B,IAEH,KAAKI,SAAL,CAAeH,QAAf,KAA4BA,QAF7B,EAEuC;AACtC;AACA;;AACD,WAAKG,SAAL,GAAiB;AAChBJ,QAAAA,aAAa,EAAbA,aADgB;AAEhBC,QAAAA,QAAQ,EAARA,QAFgB;AAGhBI,QAAAA,SAAS,EAAEH,mBAHK;AAIhBI,QAAAA,aAAa,EAAE,KAAKR,cAAL,CAAoBS,2BAApB,CAAgD,CAAhD,CAJC;AAKhB;AACA;AACA;AACA;AACA;AACA;AACAC,QAAAA,aAAa,EAAE,KAAKT,gBAAL;AAXC,OAAjB;AAaA;;;WAED,8BAAqB;AACpB,aAAO,KAAKK,SAAL,CAAeC,SAAtB;AACA;;;WAED,uBAAc;AACb,aAAO,KAAKD,SAAL,KAAmBK,SAA1B;AACA;;;WAED,qCAA4B;AAC3B,4BAAoD,KAAKL,SAAzD;AAAA,UAAQC,SAAR,mBAAQA,SAAR;AAAA,UAAmBC,aAAnB,mBAAmBA,aAAnB;AAAA,UAAkCE,aAAlC,mBAAkCA,aAAlC,CAD2B,CAE3B;AACA;;AACA,UAAME,gBAAgB,GAAG,KAAKZ,cAAL,CAAoBS,2BAApB,CAAgDF,SAAhD,CAAzB;AACA,UAAMM,gBAAgB,GAAG,KAAKZ,gBAAL,EAAzB;AACA,aAAQW,gBAAgB,GAAGJ,aAApB,IAAsCK,gBAAgB,GAAGH,aAAzD,CAAP;AACA;;;WAED,iBAAQ;AACP,WAAKJ,SAAL,GAAiBK,SAAjB;AACA","sourcesContent":["export default class ListHeightChangeWatcher {\r\n\tconstructor({\r\n\t\titemsContainer,\r\n\t\tgetListTopOffset\r\n\t}) {\r\n\t\tthis.itemsContainer = itemsContainer\r\n\t\tthis.getListTopOffset = getListTopOffset\r\n\t}\r\n\r\n\t/**\r\n\t * `<ReactVirtualScroller/>` calls this method.\r\n\t * @param {any[]} previousItems\r\n\t * @param {any[]} newItems\r\n\t * @param {number} prependedItemsCount\r\n\t */\r\n\tsnapshot({\r\n\t\tpreviousItems,\r\n\t\tnewItems,\r\n\t\tprependedItemsCount\r\n\t}) {\r\n\t\t// If there were no items in the list\r\n\t\t// then there's no point in restoring scroll position.\r\n\t\tif (previousItems.length === 0) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\t// If no items were prepended then no need to restore scroll position.\r\n\t\tif (prependedItemsCount === 0) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\t// The first item is supposed to be shown when the user clicks\r\n\t\t// \"Show previous items\" button. If it isn't shown though,\r\n\t\t// could still calculate the first item's top position using\r\n\t\t// the values from `itemHeights` and `verticalSpacing`.\r\n\t\t// But that would be a weird non-realistic scenario.\r\n\t\t// if (firstShownItemIndex > 0) {\r\n\t\t// \tlet i = firstShownItemIndex - 1\r\n\t\t// \twhile (i >= 0) {\r\n\t\t// \t\tfirstItemTopOffset += itemHeights[i] + verticalSpacing\r\n\t\t// \t\ti--\r\n\t\t// \t}\r\n\t\t// }\r\n\t\t// If the scroll position has already been captured for restoration,\r\n\t\t// then don't capture it the second time.\r\n\t\t// Capturing scroll position could happen when using `<ReactVirtualScroller/>`\r\n\t\t// because it calls `ListHeightChangeWatcher.snapshot()` inside `ReactVirtualScroller.render()`\r\n\t\t// which is followed by `<VirtualScroller/>`'s `.componentDidUpdate()`\r\n\t\t// that also calls `ListHeightChangeWatcher.snapshot()` with the same arguments,\r\n\t\t// so that second call to `ListHeightChangeWatcher.snapshot()` is ignored.\r\n\t\t// Calling `ListHeightChangeWatcher.snapshot()` inside `ReactVirtualScroller.render()`\r\n\t\t// is done to prevent scroll Y position from jumping\r\n\t\t// when showing the first page of the \"Previous items\".\r\n\t\t// See the long section of comments in `ReactVirtualScroller.render()`\r\n\t\t// method for more info on why is `ListHeightChangeWatcher.snapshot()` called there.\r\n\t\tif (this._snapshot &&\r\n\t\t\tthis._snapshot.previousItems === previousItems &&\r\n\t\t\tthis._snapshot.newItems === newItems) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\tthis._snapshot = {\r\n\t\t\tpreviousItems,\r\n\t\t\tnewItems,\r\n\t\t\titemIndex: prependedItemsCount,\r\n\t\t\titemTopOffset: this.itemsContainer.getNthRenderedItemTopOffset(0),\r\n\t\t\t// Snapshot list top offset inside the scrollable container too\r\n\t\t\t// because it's common to hide the \"Show previous items\" button\r\n\t\t\t// when the user has browsed to the top of the list, which causes\r\n\t\t\t// the list's top position to shift upwards due to the button\r\n\t\t\t// no longer being rendered. Tracking list top offset doesn't\r\n\t\t\t// fit here that well, but it makes sense in real-world applications.\r\n\t\t\tlistTopOffset: this.getListTopOffset()\r\n\t\t}\r\n\t}\r\n\r\n\tgetAnchorItemIndex() {\r\n\t\treturn this._snapshot.itemIndex\r\n\t}\r\n\r\n\thasSnapshot() {\r\n\t\treturn this._snapshot !== undefined\r\n\t}\r\n\r\n\tgetListBottomOffsetChange() {\r\n\t\tconst { itemIndex, itemTopOffset, listTopOffset } = this._snapshot\r\n\t\t// `firstShownItemIndex` is supposed to be `0` at this point,\r\n\t\t// so `renderedElementIndex` would be the same as the `itemIndex`.\r\n\t\tconst itemTopOffsetNew = this.itemsContainer.getNthRenderedItemTopOffset(itemIndex)\r\n\t\tconst listTopOffsetNew = this.getListTopOffset()\r\n\t\treturn (itemTopOffsetNew - itemTopOffset) + (listTopOffsetNew - listTopOffset)\r\n\t}\r\n\r\n\treset() {\r\n\t\tthis._snapshot = undefined\r\n\t}\r\n}"],"file":"ListHeightChangeWatcher.js"}
|
package/dom/index.commonjs.js
DELETED
package/index.commonjs.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../source/ListHeightChangeWatcher.js"],"names":["ListHeightChangeWatcher","itemsContainer","getListTopOffset","previousItems","newItems","prependedItemsCount","length","_snapshot","itemIndex","itemTopOffset","getNthRenderedItemTopOffset","listTopOffset","undefined","itemTopOffsetNew","listTopOffsetNew"],"mappings":";;;;;;IAAqBA,uB;AACpB,yCAGG;AAAA,QAFFC,cAEE,QAFFA,cAEE;AAAA,QADFC,gBACE,QADFA,gBACE;;AAAA;;AACF,SAAKD,cAAL,GAAsBA,cAAtB;AACA,SAAKC,gBAAL,GAAwBA,gBAAxB;AACA;AAED;AACD;AACA;AACA;AACA;AACA;;;;;WACC,yBAIG;AAAA,UAHFC,aAGE,SAHFA,aAGE;AAAA,UAFFC,QAEE,SAFFA,QAEE;AAAA,UADFC,mBACE,SADFA,mBACE;;AACF;AACA;AACA,UAAIF,aAAa,CAACG,MAAd,KAAyB,CAA7B,EAAgC;AAC/B;AACA,OALC,CAMF;;;AACA,UAAID,mBAAmB,KAAK,CAA5B,EAA+B;AAC9B;AACA,OATC,CAUF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,UAAI,KAAKE,SAAL,IACH,KAAKA,SAAL,CAAeJ,aAAf,KAAiCA,aAD9B,IAEH,KAAKI,SAAL,CAAeH,QAAf,KAA4BA,QAF7B,EAEuC;AACtC;AACA;;AACD,WAAKG,SAAL,GAAiB;AAChBJ,QAAAA,aAAa,EAAbA,aADgB;AAEhBC,QAAAA,QAAQ,EAARA,QAFgB;AAGhBI,QAAAA,SAAS,EAAEH,mBAHK;AAIhBI,QAAAA,aAAa,EAAE,KAAKR,cAAL,CAAoBS,2BAApB,CAAgD,CAAhD,CAJC;AAKhB;AACA;AACA;AACA;AACA;AACA;AACAC,QAAAA,aAAa,EAAE,KAAKT,gBAAL;AAXC,OAAjB;AAaA;;;WAED,8BAAqB;AACpB,aAAO,KAAKK,SAAL,CAAeC,SAAtB;AACA;;;WAED,uBAAc;AACb,aAAO,KAAKD,SAAL,KAAmBK,SAA1B;AACA;;;WAED,qCAA4B;AAC3B,4BAAoD,KAAKL,SAAzD;AAAA,UAAQC,SAAR,mBAAQA,SAAR;AAAA,UAAmBC,aAAnB,mBAAmBA,aAAnB;AAAA,UAAkCE,aAAlC,mBAAkCA,aAAlC,CAD2B,CAE3B;AACA;;AACA,UAAME,gBAAgB,GAAG,KAAKZ,cAAL,CAAoBS,2BAApB,CAAgDF,SAAhD,CAAzB;AACA,UAAMM,gBAAgB,GAAG,KAAKZ,gBAAL,EAAzB;AACA,aAAQW,gBAAgB,GAAGJ,aAApB,IAAsCK,gBAAgB,GAAGH,aAAzD,CAAP;AACA;;;WAED,iBAAQ;AACP,WAAKJ,SAAL,GAAiBK,SAAjB;AACA;;;;;;SA5FmBZ,uB","sourcesContent":["export default class ListHeightChangeWatcher {\r\n\tconstructor({\r\n\t\titemsContainer,\r\n\t\tgetListTopOffset\r\n\t}) {\r\n\t\tthis.itemsContainer = itemsContainer\r\n\t\tthis.getListTopOffset = getListTopOffset\r\n\t}\r\n\r\n\t/**\r\n\t * `<ReactVirtualScroller/>` calls this method.\r\n\t * @param {any[]} previousItems\r\n\t * @param {any[]} newItems\r\n\t * @param {number} prependedItemsCount\r\n\t */\r\n\tsnapshot({\r\n\t\tpreviousItems,\r\n\t\tnewItems,\r\n\t\tprependedItemsCount\r\n\t}) {\r\n\t\t// If there were no items in the list\r\n\t\t// then there's no point in restoring scroll position.\r\n\t\tif (previousItems.length === 0) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\t// If no items were prepended then no need to restore scroll position.\r\n\t\tif (prependedItemsCount === 0) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\t// The first item is supposed to be shown when the user clicks\r\n\t\t// \"Show previous items\" button. If it isn't shown though,\r\n\t\t// could still calculate the first item's top position using\r\n\t\t// the values from `itemHeights` and `verticalSpacing`.\r\n\t\t// But that would be a weird non-realistic scenario.\r\n\t\t// if (firstShownItemIndex > 0) {\r\n\t\t// \tlet i = firstShownItemIndex - 1\r\n\t\t// \twhile (i >= 0) {\r\n\t\t// \t\tfirstItemTopOffset += itemHeights[i] + verticalSpacing\r\n\t\t// \t\ti--\r\n\t\t// \t}\r\n\t\t// }\r\n\t\t// If the scroll position has already been captured for restoration,\r\n\t\t// then don't capture it the second time.\r\n\t\t// Capturing scroll position could happen when using `<ReactVirtualScroller/>`\r\n\t\t// because it calls `ListHeightChangeWatcher.snapshot()` inside `ReactVirtualScroller.render()`\r\n\t\t// which is followed by `<VirtualScroller/>`'s `.componentDidUpdate()`\r\n\t\t// that also calls `ListHeightChangeWatcher.snapshot()` with the same arguments,\r\n\t\t// so that second call to `ListHeightChangeWatcher.snapshot()` is ignored.\r\n\t\t// Calling `ListHeightChangeWatcher.snapshot()` inside `ReactVirtualScroller.render()`\r\n\t\t// is done to prevent scroll Y position from jumping\r\n\t\t// when showing the first page of the \"Previous items\".\r\n\t\t// See the long section of comments in `ReactVirtualScroller.render()`\r\n\t\t// method for more info on why is `ListHeightChangeWatcher.snapshot()` called there.\r\n\t\tif (this._snapshot &&\r\n\t\t\tthis._snapshot.previousItems === previousItems &&\r\n\t\t\tthis._snapshot.newItems === newItems) {\r\n\t\t\treturn\r\n\t\t}\r\n\t\tthis._snapshot = {\r\n\t\t\tpreviousItems,\r\n\t\t\tnewItems,\r\n\t\t\titemIndex: prependedItemsCount,\r\n\t\t\titemTopOffset: this.itemsContainer.getNthRenderedItemTopOffset(0),\r\n\t\t\t// Snapshot list top offset inside the scrollable container too\r\n\t\t\t// because it's common to hide the \"Show previous items\" button\r\n\t\t\t// when the user has browsed to the top of the list, which causes\r\n\t\t\t// the list's top position to shift upwards due to the button\r\n\t\t\t// no longer being rendered. Tracking list top offset doesn't\r\n\t\t\t// fit here that well, but it makes sense in real-world applications.\r\n\t\t\tlistTopOffset: this.getListTopOffset()\r\n\t\t}\r\n\t}\r\n\r\n\tgetAnchorItemIndex() {\r\n\t\treturn this._snapshot.itemIndex\r\n\t}\r\n\r\n\thasSnapshot() {\r\n\t\treturn this._snapshot !== undefined\r\n\t}\r\n\r\n\tgetListBottomOffsetChange() {\r\n\t\tconst { itemIndex, itemTopOffset, listTopOffset } = this._snapshot\r\n\t\t// `firstShownItemIndex` is supposed to be `0` at this point,\r\n\t\t// so `renderedElementIndex` would be the same as the `itemIndex`.\r\n\t\tconst itemTopOffsetNew = this.itemsContainer.getNthRenderedItemTopOffset(itemIndex)\r\n\t\tconst listTopOffsetNew = this.getListTopOffset()\r\n\t\treturn (itemTopOffsetNew - itemTopOffset) + (listTopOffsetNew - listTopOffset)\r\n\t}\r\n\r\n\treset() {\r\n\t\tthis._snapshot = undefined\r\n\t}\r\n}"],"file":"ListHeightChangeWatcher.js"}
|
package/react/index.commonjs.js
DELETED