{"version":3,"file":"VVirtualScroll.mjs","names":["VVirtualScrollItem","makeDimensionProps","useDimension","useDisplay","useResizeObserver","computed","onMounted","ref","watch","watchEffect","clamp","convertToUnit","createRange","genericComponent","useRender","UP","DOWN","VVirtualScroll","name","props","items","type","Array","default","itemHeight","Number","String","visibleItems","setup","slots","first","baseItemHeight","get","parseInt","value","set","val","rootEl","resizeRef","contentRect","display","sizeMap","Map","sizes","length","map","Math","max","ceil","height","handleItemResize","index","calculateOffset","slice","reduce","curr","calculateMidPointIndex","scrollTop","start","end","middle","floor","middleOffset","lastScrollTop","handleScroll","direction","midPointIndex","buffer","round","scrollToIndex","offset","last","min","computedItems","paddingTop","paddingBottom","dimensionStyles","forEach","item","indexOf","delete"],"sources":["../../../src/labs/VVirtualScroll/VVirtualScroll.tsx"],"sourcesContent":["// Styles\nimport './VVirtualScroll.sass'\n\n// Components\nimport { VVirtualScrollItem } from './VVirtualScrollItem'\n\n// Composables\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { useDisplay } from '@/composables/display'\nimport { useResizeObserver } from '@/composables/resizeObserver'\n\n// Utilities\nimport { computed, onMounted, ref, watch, watchEffect } from 'vue'\nimport {\n clamp,\n convertToUnit,\n createRange,\n genericComponent,\n useRender,\n} from '@/util'\n\n// Types\nimport type { SlotsToProps } from '@/util'\n\nconst UP = -1\nconst DOWN = 1\n\nexport interface VVirtualScrollSlot {\n item: T\n index: number\n}\n\nexport const VVirtualScroll = genericComponent() => {\n $props: {\n items: readonly T[]\n } & SlotsToProps<{\n default: [VVirtualScrollSlot]\n }>\n}>()({\n name: 'VVirtualScroll',\n\n props: {\n items: {\n type: Array,\n default: () => ([]),\n },\n itemHeight: [Number, String],\n visibleItems: [Number, String],\n\n ...makeDimensionProps(),\n },\n\n setup (props, { slots }) {\n const first = ref(0)\n const baseItemHeight = ref(props.itemHeight)\n const itemHeight = computed({\n get: () => parseInt(baseItemHeight.value ?? 0, 10),\n set (val) {\n baseItemHeight.value = val\n },\n })\n const rootEl = ref()\n const { resizeRef, contentRect } = useResizeObserver()\n watchEffect(() => {\n resizeRef.value = rootEl.value\n })\n const display = useDisplay()\n\n const sizeMap = new Map()\n let sizes = createRange(props.items.length).map(() => itemHeight.value)\n const visibleItems = computed(() => {\n return props.visibleItems\n ? parseInt(props.visibleItems, 10)\n : Math.max(12,\n Math.ceil(((contentRect.value?.height ?? display.height.value) / itemHeight.value) * 1.7 + 1)\n )\n })\n\n function handleItemResize (index: number, height: number) {\n itemHeight.value = Math.max(itemHeight.value, height)\n sizes[index] = height\n sizeMap.set(props.items[index], height)\n }\n\n function calculateOffset (index: number) {\n return sizes.slice(0, index).reduce((curr, value) => curr + (value || itemHeight.value), 0)\n }\n\n function calculateMidPointIndex (scrollTop: number) {\n let start = 0\n let end = props.items.length\n\n while (start <= end) {\n const middle = start + Math.floor((end - start) / 2)\n const middleOffset = calculateOffset(middle)\n\n if (middleOffset === scrollTop) {\n return middle\n } else if (middleOffset < scrollTop) {\n start = middle + 1\n } else if (middleOffset > scrollTop) {\n end = middle - 1\n }\n }\n\n return start\n }\n\n let lastScrollTop = 0\n function handleScroll () {\n if (!rootEl.value || !contentRect.value) return\n\n const height = contentRect.value.height\n const scrollTop = rootEl.value.scrollTop\n const direction = scrollTop < lastScrollTop ? UP : DOWN\n\n const midPointIndex = calculateMidPointIndex(scrollTop + height / 2)\n const buffer = Math.round(visibleItems.value / 3)\n if (direction === UP && midPointIndex <= first.value + (buffer * 2) - 1) {\n first.value = clamp(midPointIndex - buffer, 0, props.items.length)\n } else if (direction === DOWN && midPointIndex >= first.value + (buffer * 2) - 1) {\n first.value = clamp(midPointIndex - buffer, 0, props.items.length - visibleItems.value)\n }\n\n lastScrollTop = rootEl.value.scrollTop\n }\n\n function scrollToIndex (index: number) {\n if (!rootEl.value) return\n\n const offset = calculateOffset(index)\n rootEl.value.scrollTop = offset\n }\n\n const last = computed(() => Math.min(props.items.length, first.value + visibleItems.value))\n const computedItems = computed(() => props.items.slice(first.value, last.value))\n const paddingTop = computed(() => calculateOffset(first.value))\n const paddingBottom = computed(() => calculateOffset(props.items.length) - calculateOffset(last.value))\n\n const { dimensionStyles } = useDimension(props)\n\n onMounted(() => {\n if (!itemHeight.value) {\n // If itemHeight prop is not set, then calculate an estimated height from the average of inital items\n itemHeight.value = sizes.slice(first.value, last.value).reduce((curr, height) => curr + height, 0) / (visibleItems.value)\n }\n })\n\n watch(() => props.items.length, () => {\n sizes = createRange(props.items.length).map(() => itemHeight.value)\n sizeMap.forEach((height, item) => {\n const index = props.items.indexOf(item)\n if (index === -1) {\n sizeMap.delete(item)\n } else {\n sizes[index] = height\n }\n })\n })\n\n useRender(() => (\n \n \n { computedItems.value.map((item, index) => (\n handleItemResize(index + first.value, height) }\n >\n { slots.default?.({ item, index: index + first.value }) }\n \n )) }\n \n \n ))\n\n return {\n scrollToIndex,\n }\n },\n})\n\nexport type VVirtualScroll = InstanceType\n"],"mappings":"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"}