4f431afebf18347744853a947d74c2fab9f1ad214078379d177b28d67ac9c9322e6341f796d23c60f64402772b88299aa644ed88eb28023fe92889660db52b 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. import createList from '../builders/build-list.mjs';
  2. import { isHorizontal } from '../utils.mjs';
  3. import { AUTO_ALIGNMENT, CENTERED_ALIGNMENT, END_ALIGNMENT, START_ALIGNMENT, DEFAULT_DYNAMIC_LIST_ITEM_SIZE, SMART_ALIGNMENT } from '../defaults.mjs';
  4. const getItemFromCache = (props, index, listCache) => {
  5. const { itemSize } = props;
  6. const { items, lastVisitedIndex } = listCache;
  7. if (index > lastVisitedIndex) {
  8. let offset = 0;
  9. if (lastVisitedIndex >= 0) {
  10. const item = items[lastVisitedIndex];
  11. offset = item.offset + item.size;
  12. }
  13. for (let i = lastVisitedIndex + 1; i <= index; i++) {
  14. const size = itemSize(i);
  15. items[i] = {
  16. offset,
  17. size
  18. };
  19. offset += size;
  20. }
  21. listCache.lastVisitedIndex = index;
  22. }
  23. return items[index];
  24. };
  25. const findItem = (props, listCache, offset) => {
  26. const { items, lastVisitedIndex } = listCache;
  27. const lastVisitedOffset = lastVisitedIndex > 0 ? items[lastVisitedIndex].offset : 0;
  28. if (lastVisitedOffset >= offset) {
  29. return bs(props, listCache, 0, lastVisitedIndex, offset);
  30. }
  31. return es(props, listCache, Math.max(0, lastVisitedIndex), offset);
  32. };
  33. const bs = (props, listCache, low, high, offset) => {
  34. while (low <= high) {
  35. const mid = low + Math.floor((high - low) / 2);
  36. const currentOffset = getItemFromCache(props, mid, listCache).offset;
  37. if (currentOffset === offset) {
  38. return mid;
  39. } else if (currentOffset < offset) {
  40. low = mid + 1;
  41. } else if (currentOffset > offset) {
  42. high = mid - 1;
  43. }
  44. }
  45. return Math.max(0, low - 1);
  46. };
  47. const es = (props, listCache, index, offset) => {
  48. const { total } = props;
  49. let exponent = 1;
  50. while (index < total && getItemFromCache(props, index, listCache).offset < offset) {
  51. index += exponent;
  52. exponent *= 2;
  53. }
  54. return bs(props, listCache, Math.floor(index / 2), Math.min(index, total - 1), offset);
  55. };
  56. const getEstimatedTotalSize = ({ total }, { items, estimatedItemSize, lastVisitedIndex }) => {
  57. let totalSizeOfMeasuredItems = 0;
  58. if (lastVisitedIndex >= total) {
  59. lastVisitedIndex = total - 1;
  60. }
  61. if (lastVisitedIndex >= 0) {
  62. const item = items[lastVisitedIndex];
  63. totalSizeOfMeasuredItems = item.offset + item.size;
  64. }
  65. const numUnmeasuredItems = total - lastVisitedIndex - 1;
  66. const totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedItemSize;
  67. return totalSizeOfMeasuredItems + totalSizeOfUnmeasuredItems;
  68. };
  69. const DynamicSizeList = createList({
  70. name: "ElDynamicSizeList",
  71. getItemOffset: (props, index, listCache) => getItemFromCache(props, index, listCache).offset,
  72. getItemSize: (_, index, { items }) => items[index].size,
  73. getEstimatedTotalSize,
  74. getOffset: (props, index, alignment, scrollOffset, listCache) => {
  75. const { height, layout, width } = props;
  76. const size = isHorizontal(layout) ? width : height;
  77. const item = getItemFromCache(props, index, listCache);
  78. const estimatedTotalSize = getEstimatedTotalSize(props, listCache);
  79. const maxOffset = Math.max(0, Math.min(estimatedTotalSize - size, item.offset));
  80. const minOffset = Math.max(0, item.offset - size + item.size);
  81. if (alignment === SMART_ALIGNMENT) {
  82. if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {
  83. alignment = AUTO_ALIGNMENT;
  84. } else {
  85. alignment = CENTERED_ALIGNMENT;
  86. }
  87. }
  88. switch (alignment) {
  89. case START_ALIGNMENT: {
  90. return maxOffset;
  91. }
  92. case END_ALIGNMENT: {
  93. return minOffset;
  94. }
  95. case CENTERED_ALIGNMENT: {
  96. return Math.round(minOffset + (maxOffset - minOffset) / 2);
  97. }
  98. case AUTO_ALIGNMENT:
  99. default: {
  100. if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
  101. return scrollOffset;
  102. } else if (scrollOffset < minOffset) {
  103. return minOffset;
  104. } else {
  105. return maxOffset;
  106. }
  107. }
  108. }
  109. },
  110. getStartIndexForOffset: (props, offset, listCache) => findItem(props, listCache, offset),
  111. getStopIndexForStartIndex: (props, startIndex, scrollOffset, listCache) => {
  112. const { height, total, layout, width } = props;
  113. const size = isHorizontal(layout) ? width : height;
  114. const item = getItemFromCache(props, startIndex, listCache);
  115. const maxOffset = scrollOffset + size;
  116. let offset = item.offset + item.size;
  117. let stopIndex = startIndex;
  118. while (stopIndex < total - 1 && offset < maxOffset) {
  119. stopIndex++;
  120. offset += getItemFromCache(props, stopIndex, listCache).size;
  121. }
  122. return stopIndex;
  123. },
  124. initCache({ estimatedItemSize = DEFAULT_DYNAMIC_LIST_ITEM_SIZE }, instance) {
  125. const cache = {
  126. items: {},
  127. estimatedItemSize,
  128. lastVisitedIndex: -1
  129. };
  130. cache.clearCacheAfterIndex = (index, forceUpdate = true) => {
  131. var _a, _b;
  132. cache.lastVisitedIndex = Math.min(cache.lastVisitedIndex, index - 1);
  133. (_a = instance.exposed) == null ? void 0 : _a.getItemStyleCache(-1);
  134. if (forceUpdate) {
  135. (_b = instance.proxy) == null ? void 0 : _b.$forceUpdate();
  136. }
  137. };
  138. return cache;
  139. },
  140. clearCache: false,
  141. validateProps: ({ itemSize }) => {
  142. }
  143. });
  144. export { DynamicSizeList as default };
  145. //# sourceMappingURL=dynamic-size-list.mjs.map