@fluentui/react-virtualizer 9.0.0-alpha.21 → 9.0.0-alpha.22

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.
Files changed (149) hide show
  1. package/CHANGELOG.json +40 -1
  2. package/CHANGELOG.md +15 -2
  3. package/lib/Hooks.js +0 -1
  4. package/lib/Hooks.js.map +1 -1
  5. package/lib/Utilities.js +0 -1
  6. package/lib/Utilities.js.map +1 -1
  7. package/lib/Virtualizer.js +0 -1
  8. package/lib/Virtualizer.js.map +1 -1
  9. package/lib/VirtualizerScrollView.js +0 -1
  10. package/lib/VirtualizerScrollView.js.map +1 -1
  11. package/lib/VirtualizerScrollViewDynamic.js +0 -1
  12. package/lib/VirtualizerScrollViewDynamic.js.map +1 -1
  13. package/lib/components/Virtualizer/Virtualizer.js +5 -7
  14. package/lib/components/Virtualizer/Virtualizer.js.map +1 -1
  15. package/lib/components/Virtualizer/Virtualizer.types.js +0 -1
  16. package/lib/components/Virtualizer/Virtualizer.types.js.map +1 -1
  17. package/lib/components/Virtualizer/index.js +1 -2
  18. package/lib/components/Virtualizer/index.js.map +1 -1
  19. package/lib/components/Virtualizer/renderVirtualizer.js +9 -13
  20. package/lib/components/Virtualizer/renderVirtualizer.js.map +1 -1
  21. package/lib/components/Virtualizer/useVirtualizer.js +348 -354
  22. package/lib/components/Virtualizer/useVirtualizer.js.map +1 -1
  23. package/lib/components/Virtualizer/{useVirtualizerStyles.js → useVirtualizerStyles.styles.js} +1 -1
  24. package/lib/components/Virtualizer/useVirtualizerStyles.styles.js.map +1 -0
  25. package/lib/components/VirtualizerScrollView/VirtualizerScrollView.js +5 -7
  26. package/lib/components/VirtualizerScrollView/VirtualizerScrollView.js.map +1 -1
  27. package/lib/components/VirtualizerScrollView/VirtualizerScrollView.types.js +1 -2
  28. package/lib/components/VirtualizerScrollView/VirtualizerScrollView.types.js.map +1 -1
  29. package/lib/components/VirtualizerScrollView/index.js +1 -2
  30. package/lib/components/VirtualizerScrollView/index.js.map +1 -1
  31. package/lib/components/VirtualizerScrollView/renderVirtualizerScrollView.js +4 -8
  32. package/lib/components/VirtualizerScrollView/renderVirtualizerScrollView.js.map +1 -1
  33. package/lib/components/VirtualizerScrollView/useVirtualizerScrollView.js +26 -32
  34. package/lib/components/VirtualizerScrollView/useVirtualizerScrollView.js.map +1 -1
  35. package/lib/components/VirtualizerScrollView/{useVirtualizerScrollViewStyles.js → useVirtualizerScrollViewStyles.styles.js} +2 -2
  36. package/lib/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.styles.js.map +1 -0
  37. package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js +5 -7
  38. package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js.map +1 -1
  39. package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js +1 -2
  40. package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js.map +1 -1
  41. package/lib/components/VirtualizerScrollViewDynamic/index.js +1 -2
  42. package/lib/components/VirtualizerScrollViewDynamic/index.js.map +1 -1
  43. package/lib/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js +4 -8
  44. package/lib/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js.map +1 -1
  45. package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js +31 -37
  46. package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map +1 -1
  47. package/lib/components/VirtualizerScrollViewDynamic/{useVirtualizerScrollViewDynamicStyles.js → useVirtualizerScrollViewDynamicStyles.styles.js} +2 -2
  48. package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js.map +1 -0
  49. package/lib/hooks/hooks.types.js +1 -2
  50. package/lib/hooks/hooks.types.js.map +1 -1
  51. package/lib/hooks/index.js +0 -1
  52. package/lib/hooks/index.js.map +1 -1
  53. package/lib/hooks/useDynamicVirtualizerMeasure.js +91 -91
  54. package/lib/hooks/useDynamicVirtualizerMeasure.js.map +1 -1
  55. package/lib/hooks/useIntersectionObserver.js +31 -32
  56. package/lib/hooks/useIntersectionObserver.js.map +1 -1
  57. package/lib/hooks/useResizeObserverRef.js +34 -32
  58. package/lib/hooks/useResizeObserverRef.js.map +1 -1
  59. package/lib/hooks/useVirtualizerMeasure.js +38 -47
  60. package/lib/hooks/useVirtualizerMeasure.js.map +1 -1
  61. package/lib/index.js +0 -1
  62. package/lib/index.js.map +1 -1
  63. package/lib/utilities/VirtualizerContext/VirtualizerContext.js +26 -22
  64. package/lib/utilities/VirtualizerContext/VirtualizerContext.js.map +1 -1
  65. package/lib/utilities/VirtualizerContext/index.js +0 -1
  66. package/lib/utilities/VirtualizerContext/index.js.map +1 -1
  67. package/lib/utilities/VirtualizerContext/types.js +1 -2
  68. package/lib/utilities/VirtualizerContext/types.js.map +1 -1
  69. package/lib/utilities/debounce.js +13 -14
  70. package/lib/utilities/debounce.js.map +1 -1
  71. package/lib/utilities/index.js +0 -1
  72. package/lib/utilities/index.js.map +1 -1
  73. package/lib-commonjs/Hooks.js +0 -3
  74. package/lib-commonjs/Hooks.js.map +1 -1
  75. package/lib-commonjs/Utilities.js +0 -3
  76. package/lib-commonjs/Utilities.js.map +1 -1
  77. package/lib-commonjs/Virtualizer.js +0 -3
  78. package/lib-commonjs/Virtualizer.js.map +1 -1
  79. package/lib-commonjs/VirtualizerScrollView.js +0 -3
  80. package/lib-commonjs/VirtualizerScrollView.js.map +1 -1
  81. package/lib-commonjs/VirtualizerScrollViewDynamic.js +0 -3
  82. package/lib-commonjs/VirtualizerScrollViewDynamic.js.map +1 -1
  83. package/lib-commonjs/components/Virtualizer/Virtualizer.js +3 -5
  84. package/lib-commonjs/components/Virtualizer/Virtualizer.js.map +1 -1
  85. package/lib-commonjs/components/Virtualizer/Virtualizer.types.js +0 -3
  86. package/lib-commonjs/components/Virtualizer/Virtualizer.types.js.map +1 -1
  87. package/lib-commonjs/components/Virtualizer/index.js +1 -4
  88. package/lib-commonjs/components/Virtualizer/index.js.map +1 -1
  89. package/lib-commonjs/components/Virtualizer/renderVirtualizer.js +1 -3
  90. package/lib-commonjs/components/Virtualizer/renderVirtualizer.js.map +1 -1
  91. package/lib-commonjs/components/Virtualizer/useVirtualizer.js +1 -3
  92. package/lib-commonjs/components/Virtualizer/useVirtualizer.js.map +1 -1
  93. package/lib-commonjs/components/Virtualizer/{useVirtualizerStyles.js → useVirtualizerStyles.styles.js} +1 -3
  94. package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.styles.js.map +1 -0
  95. package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.js +3 -5
  96. package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.js.map +1 -1
  97. package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.types.js +0 -3
  98. package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.types.js.map +1 -1
  99. package/lib-commonjs/components/VirtualizerScrollView/index.js +1 -4
  100. package/lib-commonjs/components/VirtualizerScrollView/index.js.map +1 -1
  101. package/lib-commonjs/components/VirtualizerScrollView/renderVirtualizerScrollView.js +1 -3
  102. package/lib-commonjs/components/VirtualizerScrollView/renderVirtualizerScrollView.js.map +1 -1
  103. package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollView.js +1 -3
  104. package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollView.js.map +1 -1
  105. package/lib-commonjs/components/VirtualizerScrollView/{useVirtualizerScrollViewStyles.js → useVirtualizerScrollViewStyles.styles.js} +4 -6
  106. package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.styles.js.map +1 -0
  107. package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js +3 -5
  108. package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js.map +1 -1
  109. package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js +0 -3
  110. package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js.map +1 -1
  111. package/lib-commonjs/components/VirtualizerScrollViewDynamic/index.js +1 -4
  112. package/lib-commonjs/components/VirtualizerScrollViewDynamic/index.js.map +1 -1
  113. package/lib-commonjs/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js +1 -3
  114. package/lib-commonjs/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js.map +1 -1
  115. package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js +1 -3
  116. package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map +1 -1
  117. package/lib-commonjs/components/VirtualizerScrollViewDynamic/{useVirtualizerScrollViewDynamicStyles.js → useVirtualizerScrollViewDynamicStyles.styles.js} +4 -6
  118. package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js.map +1 -0
  119. package/lib-commonjs/hooks/hooks.types.js +0 -3
  120. package/lib-commonjs/hooks/hooks.types.js.map +1 -1
  121. package/lib-commonjs/hooks/index.js +0 -3
  122. package/lib-commonjs/hooks/index.js.map +1 -1
  123. package/lib-commonjs/hooks/useDynamicVirtualizerMeasure.js +5 -7
  124. package/lib-commonjs/hooks/useDynamicVirtualizerMeasure.js.map +1 -1
  125. package/lib-commonjs/hooks/useIntersectionObserver.js +1 -3
  126. package/lib-commonjs/hooks/useIntersectionObserver.js.map +1 -1
  127. package/lib-commonjs/hooks/useResizeObserverRef.js +1 -3
  128. package/lib-commonjs/hooks/useResizeObserverRef.js.map +1 -1
  129. package/lib-commonjs/hooks/useVirtualizerMeasure.js +7 -9
  130. package/lib-commonjs/hooks/useVirtualizerMeasure.js.map +1 -1
  131. package/lib-commonjs/index.js +0 -3
  132. package/lib-commonjs/index.js.map +1 -1
  133. package/lib-commonjs/utilities/VirtualizerContext/VirtualizerContext.js +3 -5
  134. package/lib-commonjs/utilities/VirtualizerContext/VirtualizerContext.js.map +1 -1
  135. package/lib-commonjs/utilities/VirtualizerContext/index.js +0 -3
  136. package/lib-commonjs/utilities/VirtualizerContext/index.js.map +1 -1
  137. package/lib-commonjs/utilities/VirtualizerContext/types.js +0 -3
  138. package/lib-commonjs/utilities/VirtualizerContext/types.js.map +1 -1
  139. package/lib-commonjs/utilities/debounce.js +1 -3
  140. package/lib-commonjs/utilities/debounce.js.map +1 -1
  141. package/lib-commonjs/utilities/index.js +0 -3
  142. package/lib-commonjs/utilities/index.js.map +1 -1
  143. package/package.json +5 -5
  144. package/lib/components/Virtualizer/useVirtualizerStyles.js.map +0 -1
  145. package/lib/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.js.map +0 -1
  146. package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.js.map +0 -1
  147. package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.js.map +0 -1
  148. package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.js.map +0 -1
  149. package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.js.map +0 -1
@@ -5,364 +5,358 @@ import { flushSync } from 'react-dom';
5
5
  import { useVirtualizerContextState_unstable } from '../../Utilities';
6
6
  import { renderVirtualizerChildPlaceholder } from './renderVirtualizer';
7
7
  export function useVirtualizer_unstable(props) {
8
- const {
9
- itemSize,
10
- numItems,
11
- virtualizerLength,
12
- children: renderChild,
13
- getItemSize,
14
- bufferItems = Math.round(virtualizerLength / 4.0),
15
- bufferSize = Math.floor(bufferItems / 2.0) * itemSize,
16
- scrollViewRef,
17
- axis = 'vertical',
18
- reversed = false,
19
- virtualizerContext
20
- } = props;
21
- /* The context is optional, it's useful for injecting additional index logic, or performing uniform state updates*/
22
- const _virtualizerContext = useVirtualizerContextState_unstable(virtualizerContext);
23
- const actualIndex = _virtualizerContext.contextIndex;
24
- const setActualIndex = _virtualizerContext.setContextIndex;
25
- // Store ref to before padding element
26
- const beforeElementRef = useRef(null);
27
- // Store ref to before padding element
28
- const afterElementRef = useRef(null);
29
- // We need to store an array to track dynamic sizes, we can use this to incrementally update changes
30
- const childSizes = useRef(new Array(getItemSize ? numItems : 0));
31
- /* We keep track of the progressive sizing/placement down the list,
32
- this helps us skip re-calculations unless children/size changes */
33
- const childProgressiveSizes = useRef(new Array(getItemSize ? numItems : 0));
34
- // The internal tracking REF for child array (updates often).
35
- const childArray = useRef(new Array(virtualizerLength));
36
- // We want to be methodical about updating the render with child reference array
37
- const forceUpdate = useReducer(() => ({}), {})[1];
38
- const horizontal = axis === 'horizontal';
39
- const populateSizeArrays = () => {
40
- if (!getItemSize) {
41
- // Static sizes, never mind!
42
- return;
43
- }
44
- if (numItems !== childSizes.current.length) {
45
- childSizes.current = new Array(numItems);
46
- }
47
- if (numItems !== childProgressiveSizes.current.length) {
48
- childProgressiveSizes.current = new Array(numItems);
49
- }
50
- for (let index = 0; index < numItems; index++) {
51
- childSizes.current[index] = getItemSize(index);
52
- if (index === 0) {
53
- childProgressiveSizes.current[index] = childSizes.current[index];
54
- } else {
55
- childProgressiveSizes.current[index] = childProgressiveSizes.current[index - 1] + childSizes.current[index];
56
- }
57
- }
58
- };
59
- const batchUpdateNewIndex = index => {
60
- // Local updates
61
- updateChildRows(index);
62
- updateCurrentItemSizes(index);
63
- // State setters
64
- setActualIndex(index);
65
- };
66
- // Observe intersections of virtualized components
67
- const {
68
- setObserverList
69
- } = useIntersectionObserver((entries, observer) => {
70
- /* Sanity check - do we even need virtualization? */if (virtualizerLength > numItems) {
71
- if (actualIndex !== 0) {
72
- batchUpdateNewIndex(0);
73
- }
74
- // No-op
75
- return;
76
- }
77
- /* IO initiates this function when needed (bookend entering view) */
78
- let measurementPos = 0;
79
- let bufferCount = bufferItems;
80
- // Grab latest entry that is intersecting
81
- const latestEntry = entries.length === 1 ? entries[0] : entries.sort((entry1, entry2) => entry2.time - entry1.time).find(entry => {
82
- return entry.intersectionRatio > 0;
83
- });
84
- if (!latestEntry) {
85
- // If we don't find an intersecting area, ignore for now.
86
- return;
87
- }
88
- if (latestEntry.target === afterElementRef.current) {
89
- // We need to inverse the buffer count
90
- bufferCount = virtualizerLength - bufferItems;
91
- measurementPos = reversed ? calculateAfter() : calculateTotalSize() - calculateAfter();
92
- if (!horizontal) {
93
- if (reversed) {
94
- // Scrolling 'up' and hit the after element below
95
- measurementPos -= Math.abs(latestEntry.boundingClientRect.bottom);
96
- } else if (latestEntry.boundingClientRect.top < 0) {
97
- // Scrolling 'down' and hit the after element above top: 0
98
- measurementPos -= latestEntry.boundingClientRect.top;
8
+ const { itemSize , numItems , virtualizerLength , children: renderChild , getItemSize , bufferItems =Math.round(virtualizerLength / 4.0) , bufferSize =Math.floor(bufferItems / 2.0) * itemSize , scrollViewRef , axis ='vertical' , reversed =false , virtualizerContext } = props;
9
+ /* The context is optional, it's useful for injecting additional index logic, or performing uniform state updates*/ const _virtualizerContext = useVirtualizerContextState_unstable(virtualizerContext);
10
+ const actualIndex = _virtualizerContext.contextIndex;
11
+ const setActualIndex = _virtualizerContext.setContextIndex;
12
+ // Store ref to before padding element
13
+ const beforeElementRef = useRef(null);
14
+ // Store ref to before padding element
15
+ const afterElementRef = useRef(null);
16
+ // We need to store an array to track dynamic sizes, we can use this to incrementally update changes
17
+ const childSizes = useRef(new Array(getItemSize ? numItems : 0));
18
+ /* We keep track of the progressive sizing/placement down the list,
19
+ this helps us skip re-calculations unless children/size changes */ const childProgressiveSizes = useRef(new Array(getItemSize ? numItems : 0));
20
+ // The internal tracking REF for child array (updates often).
21
+ const childArray = useRef(new Array(virtualizerLength));
22
+ // We want to be methodical about updating the render with child reference array
23
+ const forceUpdate = useReducer(()=>({}), {})[1];
24
+ const horizontal = axis === 'horizontal';
25
+ const populateSizeArrays = ()=>{
26
+ if (!getItemSize) {
27
+ // Static sizes, never mind!
28
+ return;
29
+ }
30
+ if (numItems !== childSizes.current.length) {
31
+ childSizes.current = new Array(numItems);
32
+ }
33
+ if (numItems !== childProgressiveSizes.current.length) {
34
+ childProgressiveSizes.current = new Array(numItems);
35
+ }
36
+ for(let index = 0; index < numItems; index++){
37
+ childSizes.current[index] = getItemSize(index);
38
+ if (index === 0) {
39
+ childProgressiveSizes.current[index] = childSizes.current[index];
40
+ } else {
41
+ childProgressiveSizes.current[index] = childProgressiveSizes.current[index - 1] + childSizes.current[index];
42
+ }
43
+ }
44
+ };
45
+ const batchUpdateNewIndex = (index)=>{
46
+ // Local updates
47
+ updateChildRows(index);
48
+ updateCurrentItemSizes(index);
49
+ // State setters
50
+ setActualIndex(index);
51
+ };
52
+ // Observe intersections of virtualized components
53
+ const { setObserverList } = useIntersectionObserver((entries, observer)=>{
54
+ /* Sanity check - do we even need virtualization? */ if (virtualizerLength > numItems) {
55
+ if (actualIndex !== 0) {
56
+ batchUpdateNewIndex(0);
57
+ }
58
+ // No-op
59
+ return;
60
+ }
61
+ /* IO initiates this function when needed (bookend entering view) */ let measurementPos = 0;
62
+ let bufferCount = bufferItems;
63
+ // Grab latest entry that is intersecting
64
+ const latestEntry = entries.length === 1 ? entries[0] : entries.sort((entry1, entry2)=>entry2.time - entry1.time).find((entry)=>{
65
+ return entry.intersectionRatio > 0;
66
+ });
67
+ if (!latestEntry) {
68
+ // If we don't find an intersecting area, ignore for now.
69
+ return;
70
+ }
71
+ if (latestEntry.target === afterElementRef.current) {
72
+ // We need to inverse the buffer count
73
+ bufferCount = virtualizerLength - bufferItems;
74
+ measurementPos = reversed ? calculateAfter() : calculateTotalSize() - calculateAfter();
75
+ if (!horizontal) {
76
+ if (reversed) {
77
+ // Scrolling 'up' and hit the after element below
78
+ measurementPos -= Math.abs(latestEntry.boundingClientRect.bottom);
79
+ } else if (latestEntry.boundingClientRect.top < 0) {
80
+ // Scrolling 'down' and hit the after element above top: 0
81
+ measurementPos -= latestEntry.boundingClientRect.top;
82
+ }
83
+ } else {
84
+ if (reversed) {
85
+ // Scrolling 'left' and hit the after element
86
+ measurementPos -= Math.abs(latestEntry.boundingClientRect.right);
87
+ } else if (latestEntry.boundingClientRect.left < 0) {
88
+ // Scrolling 'right' and hit the after element
89
+ measurementPos -= latestEntry.boundingClientRect.left;
90
+ }
91
+ }
92
+ } else if (latestEntry.target === beforeElementRef.current) {
93
+ measurementPos = reversed ? calculateTotalSize() - calculateBefore() : calculateBefore();
94
+ if (!horizontal) {
95
+ if (!reversed) {
96
+ measurementPos -= Math.abs(latestEntry.boundingClientRect.bottom);
97
+ } else if (latestEntry.boundingClientRect.top < 0) {
98
+ // Scrolling 'down' in reverse order and hit the before element above top: 0
99
+ measurementPos -= latestEntry.boundingClientRect.top;
100
+ }
101
+ } else {
102
+ if (!reversed) {
103
+ measurementPos -= Math.abs(latestEntry.boundingClientRect.right);
104
+ } else if (latestEntry.boundingClientRect.left < 0) {
105
+ // Scrolling 'left' and hit before element
106
+ measurementPos -= latestEntry.boundingClientRect.left;
107
+ }
108
+ }
99
109
  }
100
- } else {
101
110
  if (reversed) {
102
- // Scrolling 'left' and hit the after element
103
- measurementPos -= Math.abs(latestEntry.boundingClientRect.right);
104
- } else if (latestEntry.boundingClientRect.left < 0) {
105
- // Scrolling 'right' and hit the after element
106
- measurementPos -= latestEntry.boundingClientRect.left;
107
- }
108
- }
109
- } else if (latestEntry.target === beforeElementRef.current) {
110
- measurementPos = reversed ? calculateTotalSize() - calculateBefore() : calculateBefore();
111
- if (!horizontal) {
112
- if (!reversed) {
113
- measurementPos -= Math.abs(latestEntry.boundingClientRect.bottom);
114
- } else if (latestEntry.boundingClientRect.top < 0) {
115
- // Scrolling 'down' in reverse order and hit the before element above top: 0
116
- measurementPos -= latestEntry.boundingClientRect.top;
117
- }
118
- } else {
119
- if (!reversed) {
120
- measurementPos -= Math.abs(latestEntry.boundingClientRect.right);
121
- } else if (latestEntry.boundingClientRect.left < 0) {
122
- // Scrolling 'left' and hit before element
123
- measurementPos -= latestEntry.boundingClientRect.left;
124
- }
125
- }
126
- }
127
- if (reversed) {
128
- // We're reversed, up is down, left is right, invert the scroll measure.
129
- measurementPos = Math.max(calculateTotalSize() - Math.abs(measurementPos), 0);
130
- }
131
- // For now lets use hardcoded size to assess current element to paginate on
132
- const startIndex = getIndexFromScrollPosition(measurementPos);
133
- const bufferedIndex = Math.max(startIndex - bufferCount, 0);
134
- // Safety limits
135
- const maxIndex = Math.max(numItems - virtualizerLength, 0);
136
- const newStartIndex = Math.min(Math.max(bufferedIndex, 0), maxIndex);
137
- if (actualIndex !== newStartIndex) {
138
- // We flush sync this and perform an immediate state update
139
- flushSync(() => {
140
- batchUpdateNewIndex(newStartIndex);
141
- });
142
- }
143
- }, {
144
- root: scrollViewRef ? scrollViewRef === null || scrollViewRef === void 0 ? void 0 : scrollViewRef.current : null,
145
- rootMargin: '0px',
146
- threshold: 0
147
- });
148
- const findIndexRecursive = (scrollPos, lowIndex, highIndex) => {
149
- if (lowIndex > highIndex) {
150
- // We shouldn't get here - but no-op the index if we do.
151
- return actualIndex;
152
- }
153
- const midpoint = Math.floor((lowIndex + highIndex) / 2);
154
- const iBefore = Math.max(midpoint - 1, 0);
155
- const iAfter = Math.min(midpoint + 1, childProgressiveSizes.current.length - 1);
156
- const indexValue = childProgressiveSizes.current[midpoint];
157
- const afterIndexValue = childProgressiveSizes.current[iAfter];
158
- const beforeIndexValue = childProgressiveSizes.current[iBefore];
159
- if (scrollPos <= afterIndexValue && scrollPos >= beforeIndexValue) {
160
- /* We've found our index - if we are exactly matching before/after index that's ok,
161
- better to reduce checks if it's right on the boundary. */
162
- return midpoint;
163
- }
164
- if (indexValue > scrollPos) {
165
- return findIndexRecursive(scrollPos, lowIndex, midpoint - 1);
166
- } else {
167
- return findIndexRecursive(scrollPos, midpoint + 1, highIndex);
168
- }
169
- };
170
- const getIndexFromSizeArray = scrollPos => {
171
- /* Quick searches our progressive height array */if (scrollPos === 0 || childProgressiveSizes.current.length === 0 || scrollPos <= childProgressiveSizes.current[0]) {
172
- // Check start
173
- return 0;
174
- }
175
- if (scrollPos >= childProgressiveSizes.current[childProgressiveSizes.current.length - 1]) {
176
- // Check end
177
- return childProgressiveSizes.current.length - 1;
178
- }
179
- return findIndexRecursive(scrollPos, 0, childProgressiveSizes.current.length - 1);
180
- };
181
- const getIndexFromScrollPosition = scrollPos => {
182
- if (!getItemSize) {
183
- return Math.round(scrollPos / itemSize);
184
- }
185
- return getIndexFromSizeArray(scrollPos);
186
- };
187
- const calculateTotalSize = () => {
188
- if (!getItemSize) {
189
- return itemSize * numItems;
190
- }
191
- // Time for custom size calcs
192
- return childProgressiveSizes.current[numItems - 1];
193
- };
194
- const calculateBefore = () => {
195
- const currentIndex = Math.min(actualIndex, numItems);
196
- if (!getItemSize) {
197
- // The missing items from before virtualization starts height
198
- return currentIndex * itemSize;
199
- }
200
- if (currentIndex <= 0) {
201
- return 0;
202
- }
203
- // Time for custom size calcs
204
- return childProgressiveSizes.current[currentIndex - 1];
205
- };
206
- const calculateAfter = () => {
207
- if (numItems === 0) {
208
- return 0;
209
- }
210
- const lastItemIndex = Math.min(actualIndex + virtualizerLength, numItems - 1);
211
- if (!getItemSize) {
212
- // The missing items from after virtualization ends height
213
- const remainingItems = numItems - lastItemIndex - 1;
214
- return remainingItems * itemSize;
215
- }
216
- // Time for custom size calcs
217
- return childProgressiveSizes.current[numItems - 1] - childProgressiveSizes.current[lastItemIndex];
218
- };
219
- const updateChildRows = useCallback(newIndex => {
220
- if (numItems === 0) {
221
- /* Nothing to virtualize */return [];
222
- }
223
- if (childArray.current.length !== numItems) {
224
- childArray.current = new Array(virtualizerLength);
225
- }
226
- const _actualIndex = Math.max(newIndex, 0);
227
- const end = Math.min(_actualIndex + virtualizerLength, numItems);
228
- for (let i = _actualIndex; i < end; i++) {
229
- childArray.current[i - _actualIndex] = renderVirtualizerChildPlaceholder(renderChild(i), i);
230
- }
231
- }, [numItems, renderChild, virtualizerLength]);
232
- const setBeforeRef = useCallback(element => {
233
- if (!element || beforeElementRef.current === element) {
234
- return;
235
- }
236
- beforeElementRef.current = element;
237
- const newList = [];
238
- newList.push(beforeElementRef.current);
239
- if (afterElementRef.current) {
240
- newList.push(afterElementRef.current);
241
- }
242
- // Ensure we update array if before element changed
243
- setObserverList(newList);
244
- }, [setObserverList]);
245
- const setAfterRef = useCallback(element => {
246
- if (!element || afterElementRef.current === element) {
247
- return;
248
- }
249
- afterElementRef.current = element;
250
- const newList = [];
251
- if (beforeElementRef.current) {
252
- newList.push(beforeElementRef.current);
253
- }
254
- newList.push(afterElementRef.current);
255
- // Ensure we update array if after element changed
256
- setObserverList(newList);
257
- }, [setObserverList]);
258
- const updateCurrentItemSizes = newIndex => {
259
- if (!getItemSize) {
260
- // Static sizes, not required.
261
- return;
262
- }
263
- // We should always call our size function on index change (only for the items that will be rendered)
264
- // This ensures we request the latest data for incoming items in case sizing has changed.
265
- const endIndex = Math.min(newIndex + virtualizerLength, numItems);
266
- const startIndex = Math.max(newIndex, 0);
267
- let didUpdate = false;
268
- for (let i = startIndex; i < endIndex; i++) {
269
- const newSize = getItemSize(i);
270
- if (newSize !== childSizes.current[i]) {
271
- childSizes.current[i] = newSize;
272
- didUpdate = true;
273
- }
274
- }
275
- if (didUpdate) {
276
- // Update our progressive size array
277
- for (let i = startIndex; i < numItems; i++) {
278
- const prevSize = i > 0 ? childProgressiveSizes.current[i - 1] : 0;
279
- childProgressiveSizes.current[i] = prevSize + childSizes.current[i];
280
- }
281
- }
282
- };
283
- // Initialize the size array before first render.
284
- const hasInitialized = useRef(false);
285
- const initializeSizeArray = () => {
286
- if (hasInitialized.current === false) {
287
- hasInitialized.current = true;
288
- populateSizeArrays();
289
- }
290
- };
291
- // Initialization on mount - update array index to 0 (ready state).
292
- // Only fire on mount (no deps).
293
- useEffect(() => {
294
- if (actualIndex < 0) {
295
- batchUpdateNewIndex(0);
296
- }
111
+ // We're reversed, up is down, left is right, invert the scroll measure.
112
+ measurementPos = Math.max(calculateTotalSize() - Math.abs(measurementPos), 0);
113
+ }
114
+ // For now lets use hardcoded size to assess current element to paginate on
115
+ const startIndex = getIndexFromScrollPosition(measurementPos);
116
+ const bufferedIndex = Math.max(startIndex - bufferCount, 0);
117
+ // Safety limits
118
+ const maxIndex = Math.max(numItems - virtualizerLength, 0);
119
+ const newStartIndex = Math.min(Math.max(bufferedIndex, 0), maxIndex);
120
+ if (actualIndex !== newStartIndex) {
121
+ // We flush sync this and perform an immediate state update
122
+ flushSync(()=>{
123
+ batchUpdateNewIndex(newStartIndex);
124
+ });
125
+ }
126
+ }, {
127
+ root: scrollViewRef ? scrollViewRef === null || scrollViewRef === void 0 ? void 0 : scrollViewRef.current : null,
128
+ rootMargin: '0px',
129
+ threshold: 0
130
+ });
131
+ const findIndexRecursive = (scrollPos, lowIndex, highIndex)=>{
132
+ if (lowIndex > highIndex) {
133
+ // We shouldn't get here - but no-op the index if we do.
134
+ return actualIndex;
135
+ }
136
+ const midpoint = Math.floor((lowIndex + highIndex) / 2);
137
+ const iBefore = Math.max(midpoint - 1, 0);
138
+ const iAfter = Math.min(midpoint + 1, childProgressiveSizes.current.length - 1);
139
+ const indexValue = childProgressiveSizes.current[midpoint];
140
+ const afterIndexValue = childProgressiveSizes.current[iAfter];
141
+ const beforeIndexValue = childProgressiveSizes.current[iBefore];
142
+ if (scrollPos <= afterIndexValue && scrollPos >= beforeIndexValue) {
143
+ /* We've found our index - if we are exactly matching before/after index that's ok,
144
+ better to reduce checks if it's right on the boundary. */ return midpoint;
145
+ }
146
+ if (indexValue > scrollPos) {
147
+ return findIndexRecursive(scrollPos, lowIndex, midpoint - 1);
148
+ } else {
149
+ return findIndexRecursive(scrollPos, midpoint + 1, highIndex);
150
+ }
151
+ };
152
+ const getIndexFromSizeArray = (scrollPos)=>{
153
+ /* Quick searches our progressive height array */ if (scrollPos === 0 || childProgressiveSizes.current.length === 0 || scrollPos <= childProgressiveSizes.current[0]) {
154
+ // Check start
155
+ return 0;
156
+ }
157
+ if (scrollPos >= childProgressiveSizes.current[childProgressiveSizes.current.length - 1]) {
158
+ // Check end
159
+ return childProgressiveSizes.current.length - 1;
160
+ }
161
+ return findIndexRecursive(scrollPos, 0, childProgressiveSizes.current.length - 1);
162
+ };
163
+ const getIndexFromScrollPosition = (scrollPos)=>{
164
+ if (!getItemSize) {
165
+ return Math.round(scrollPos / itemSize);
166
+ }
167
+ return getIndexFromSizeArray(scrollPos);
168
+ };
169
+ const calculateTotalSize = ()=>{
170
+ if (!getItemSize) {
171
+ return itemSize * numItems;
172
+ }
173
+ // Time for custom size calcs
174
+ return childProgressiveSizes.current[numItems - 1];
175
+ };
176
+ const calculateBefore = ()=>{
177
+ const currentIndex = Math.min(actualIndex, numItems);
178
+ if (!getItemSize) {
179
+ // The missing items from before virtualization starts height
180
+ return currentIndex * itemSize;
181
+ }
182
+ if (currentIndex <= 0) {
183
+ return 0;
184
+ }
185
+ // Time for custom size calcs
186
+ return childProgressiveSizes.current[currentIndex - 1];
187
+ };
188
+ const calculateAfter = ()=>{
189
+ if (numItems === 0) {
190
+ return 0;
191
+ }
192
+ const lastItemIndex = Math.min(actualIndex + virtualizerLength, numItems - 1);
193
+ if (!getItemSize) {
194
+ // The missing items from after virtualization ends height
195
+ const remainingItems = numItems - lastItemIndex - 1;
196
+ return remainingItems * itemSize;
197
+ }
198
+ // Time for custom size calcs
199
+ return childProgressiveSizes.current[numItems - 1] - childProgressiveSizes.current[lastItemIndex];
200
+ };
201
+ const updateChildRows = useCallback((newIndex)=>{
202
+ if (numItems === 0) {
203
+ /* Nothing to virtualize */ return [];
204
+ }
205
+ if (childArray.current.length !== numItems) {
206
+ childArray.current = new Array(virtualizerLength);
207
+ }
208
+ const _actualIndex = Math.max(newIndex, 0);
209
+ const end = Math.min(_actualIndex + virtualizerLength, numItems);
210
+ for(let i = _actualIndex; i < end; i++){
211
+ childArray.current[i - _actualIndex] = renderVirtualizerChildPlaceholder(renderChild(i), i);
212
+ }
213
+ }, [
214
+ numItems,
215
+ renderChild,
216
+ virtualizerLength
217
+ ]);
218
+ const setBeforeRef = useCallback((element)=>{
219
+ if (!element || beforeElementRef.current === element) {
220
+ return;
221
+ }
222
+ beforeElementRef.current = element;
223
+ const newList = [];
224
+ newList.push(beforeElementRef.current);
225
+ if (afterElementRef.current) {
226
+ newList.push(afterElementRef.current);
227
+ }
228
+ // Ensure we update array if before element changed
229
+ setObserverList(newList);
230
+ }, [
231
+ setObserverList
232
+ ]);
233
+ const setAfterRef = useCallback((element)=>{
234
+ if (!element || afterElementRef.current === element) {
235
+ return;
236
+ }
237
+ afterElementRef.current = element;
238
+ const newList = [];
239
+ if (beforeElementRef.current) {
240
+ newList.push(beforeElementRef.current);
241
+ }
242
+ newList.push(afterElementRef.current);
243
+ // Ensure we update array if after element changed
244
+ setObserverList(newList);
245
+ }, [
246
+ setObserverList
247
+ ]);
248
+ const updateCurrentItemSizes = (newIndex)=>{
249
+ if (!getItemSize) {
250
+ // Static sizes, not required.
251
+ return;
252
+ }
253
+ // We should always call our size function on index change (only for the items that will be rendered)
254
+ // This ensures we request the latest data for incoming items in case sizing has changed.
255
+ const endIndex = Math.min(newIndex + virtualizerLength, numItems);
256
+ const startIndex = Math.max(newIndex, 0);
257
+ let didUpdate = false;
258
+ for(let i = startIndex; i < endIndex; i++){
259
+ const newSize = getItemSize(i);
260
+ if (newSize !== childSizes.current[i]) {
261
+ childSizes.current[i] = newSize;
262
+ didUpdate = true;
263
+ }
264
+ }
265
+ if (didUpdate) {
266
+ // Update our progressive size array
267
+ for(let i = startIndex; i < numItems; i++){
268
+ const prevSize = i > 0 ? childProgressiveSizes.current[i - 1] : 0;
269
+ childProgressiveSizes.current[i] = prevSize + childSizes.current[i];
270
+ }
271
+ }
272
+ };
273
+ // Initialize the size array before first render.
274
+ const hasInitialized = useRef(false);
275
+ const initializeSizeArray = ()=>{
276
+ if (hasInitialized.current === false) {
277
+ hasInitialized.current = true;
278
+ populateSizeArrays();
279
+ }
280
+ };
281
+ // Initialization on mount - update array index to 0 (ready state).
282
+ // Only fire on mount (no deps).
283
+ useEffect(()=>{
284
+ if (actualIndex < 0) {
285
+ batchUpdateNewIndex(0);
286
+ }
297
287
  // eslint-disable-next-line react-hooks/exhaustive-deps
298
- }, []);
299
- // If the user passes in an updated renderChild function - update current children
300
- useEffect(() => {
301
- if (actualIndex >= 0) {
302
- updateChildRows(actualIndex);
303
- forceUpdate();
304
- }
288
+ }, []);
289
+ // If the user passes in an updated renderChild function - update current children
290
+ useEffect(()=>{
291
+ if (actualIndex >= 0) {
292
+ updateChildRows(actualIndex);
293
+ forceUpdate();
294
+ }
305
295
  // eslint-disable-next-line react-hooks/exhaustive-deps
306
- }, [renderChild, updateChildRows]);
307
- useEffect(() => {
308
- // Ensure we repopulate if getItemSize callback changes
309
- populateSizeArrays();
296
+ }, [
297
+ renderChild,
298
+ updateChildRows
299
+ ]);
300
+ useEffect(()=>{
301
+ // Ensure we repopulate if getItemSize callback changes
302
+ populateSizeArrays();
310
303
  // We only run this effect on getItemSize change (recalc dynamic sizes)
311
304
  // eslint-disable-next-line react-hooks/exhaustive-deps
312
- }, [getItemSize]);
313
- // Ensure we have run through and updated the whole size list array at least once.
314
- initializeSizeArray();
315
- if (getItemSize && (numItems !== childSizes.current.length || numItems !== childProgressiveSizes.current.length)) {
316
- // Child length mismatch, repopulate size arrays.
317
- populateSizeArrays();
318
- }
319
- // Ensure we recalc if virtualizer length changes
320
- const maxCompare = Math.min(virtualizerLength, numItems);
321
- if (childArray.current.length !== maxCompare && actualIndex + childArray.current.length < numItems) {
322
- updateChildRows(actualIndex);
323
- }
324
- const isFullyInitialized = hasInitialized.current && actualIndex >= 0;
325
- return {
326
- components: {
327
- before: 'div',
328
- after: 'div',
329
- beforeContainer: 'div',
330
- afterContainer: 'div'
331
- },
332
- virtualizedChildren: childArray.current,
333
- before: resolveShorthand(props.before, {
334
- required: true,
335
- defaultProps: {
336
- ref: setBeforeRef,
337
- role: 'none'
338
- }
339
- }),
340
- after: resolveShorthand(props.after, {
341
- required: true,
342
- defaultProps: {
343
- ref: setAfterRef,
344
- role: 'none'
345
- }
346
- }),
347
- beforeContainer: resolveShorthand(props.beforeContainer, {
348
- required: true,
349
- defaultProps: {
350
- role: 'none'
351
- }
352
- }),
353
- afterContainer: resolveShorthand(props.afterContainer, {
354
- required: true,
355
- defaultProps: {
356
- role: 'none'
357
- }
358
- }),
359
- beforeBufferHeight: isFullyInitialized ? calculateBefore() : 0,
360
- afterBufferHeight: isFullyInitialized ? calculateAfter() : 0,
361
- totalVirtualizerHeight: isFullyInitialized ? calculateTotalSize() : virtualizerLength * itemSize,
362
- virtualizerStartIndex: actualIndex,
363
- axis,
364
- bufferSize,
365
- reversed
366
- };
305
+ }, [
306
+ getItemSize
307
+ ]);
308
+ // Ensure we have run through and updated the whole size list array at least once.
309
+ initializeSizeArray();
310
+ if (getItemSize && (numItems !== childSizes.current.length || numItems !== childProgressiveSizes.current.length)) {
311
+ // Child length mismatch, repopulate size arrays.
312
+ populateSizeArrays();
313
+ }
314
+ // Ensure we recalc if virtualizer length changes
315
+ const maxCompare = Math.min(virtualizerLength, numItems);
316
+ if (childArray.current.length !== maxCompare && actualIndex + childArray.current.length < numItems) {
317
+ updateChildRows(actualIndex);
318
+ }
319
+ const isFullyInitialized = hasInitialized.current && actualIndex >= 0;
320
+ return {
321
+ components: {
322
+ before: 'div',
323
+ after: 'div',
324
+ beforeContainer: 'div',
325
+ afterContainer: 'div'
326
+ },
327
+ virtualizedChildren: childArray.current,
328
+ before: resolveShorthand(props.before, {
329
+ required: true,
330
+ defaultProps: {
331
+ ref: setBeforeRef,
332
+ role: 'none'
333
+ }
334
+ }),
335
+ after: resolveShorthand(props.after, {
336
+ required: true,
337
+ defaultProps: {
338
+ ref: setAfterRef,
339
+ role: 'none'
340
+ }
341
+ }),
342
+ beforeContainer: resolveShorthand(props.beforeContainer, {
343
+ required: true,
344
+ defaultProps: {
345
+ role: 'none'
346
+ }
347
+ }),
348
+ afterContainer: resolveShorthand(props.afterContainer, {
349
+ required: true,
350
+ defaultProps: {
351
+ role: 'none'
352
+ }
353
+ }),
354
+ beforeBufferHeight: isFullyInitialized ? calculateBefore() : 0,
355
+ afterBufferHeight: isFullyInitialized ? calculateAfter() : 0,
356
+ totalVirtualizerHeight: isFullyInitialized ? calculateTotalSize() : virtualizerLength * itemSize,
357
+ virtualizerStartIndex: actualIndex,
358
+ axis,
359
+ bufferSize,
360
+ reversed
361
+ };
367
362
  }
368
- //# sourceMappingURL=useVirtualizer.js.map