vuetify/lib/components/VVirtualScroll/VVirtualScroll.mjs

Vue Material Component Framework

import { createVNode as _createVNode } from "vue";
// Styles
import "./VVirtualScroll.css";

// Components
import { VVirtualScrollItem } from "./VVirtualScrollItem.mjs"; // Composables
import { makeComponentProps } from "../../composables/component.mjs";
import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs";
import { makeVirtualProps, useVirtual } from "../../composables/virtual.mjs"; // Utilities
import { toRef } from 'vue';
import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
export const makeVVirtualScrollProps = propsFactory({
  items: {
    type: Array,
    default: () => []
  },
  ...makeVirtualProps(),
  ...makeComponentProps(),
  ...makeDimensionProps()
}, 'VVirtualScroll');
export const VVirtualScroll = genericComponent()({
  name: 'VVirtualScroll',
  props: makeVVirtualScrollProps(),
  setup(props, _ref) {
    let {
      slots
    } = _ref;
    const {
      dimensionStyles
    } = useDimension(props);
    const {
      containerRef,
      handleScroll,
      handleItemResize,
      scrollToIndex,
      paddingTop,
      paddingBottom,
      computedItems
    } = useVirtual(props, toRef(props, 'items'));
    useRender(() => _createVNode("div", {
      "ref": containerRef,
      "class": ['v-virtual-scroll', props.class],
      "onScroll": handleScroll,
      "style": [dimensionStyles.value, props.style]
    }, [_createVNode("div", {
      "class": "v-virtual-scroll__container",
      "style": {
        paddingTop: convertToUnit(paddingTop.value),
        paddingBottom: convertToUnit(paddingBottom.value)
      }
    }, [computedItems.value.map(item => _createVNode(VVirtualScrollItem, {
      "key": item.index,
      "dynamicHeight": !props.itemHeight,
      "onUpdate:height": height => handleItemResize(item.index, height)
    }, {
      default: () => [slots.default?.({
        item: item.raw,
        index: item.index
      })]
    }))])]));
    return {
      scrollToIndex
    };
  }
});
//# sourceMappingURL=VVirtualScroll.mjs.map