@sdata/web-vue 1.10.0 → 1.11.0

package/es/_components/virtual-list/virtual-list.vue.d.ts

@@ -1,6 +1,7 @@
 import { type CSSProperties, type Component, PropType } from 'vue';
 import { type CacheSnapshot, type ClassValue, type DynamicScrollerExposed, type ItemSizeValue, type KeyFieldValue, type KeyValue, type RecycleScrollerExposed, type ScrollDirection } from 'vue-virtual-scroller';
 import type { ScrollbarProps } from '../../scrollbar';
+import type { VirtualItemKey } from './interface';
 type ScrollerExpose = RecycleScrollerExposed<any, KeyValue> | DynamicScrollerExposed<any>;
 type ScrollerSlotProps = {
     item: unknown;
@@ -67,15 +68,177 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     itemClass: {
         type: PropType<ClassValue>;
     };
+    threshold: {
+        type: NumberConstructor;
+        default: number;
+    };
+    fixedSize: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    estimatedSize: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    component: {
+        type: PropType<keyof HTMLElementTagNameMap | Record<string, unknown>>;
+        default: undefined;
+    };
+    listAttrs: {
+        type: PropType<Record<string, unknown> | undefined>;
+        default: undefined;
+    };
+    contentWrapperAttrs: {
+        type: PropType<Record<string, unknown> | undefined>;
+        default: undefined;
+    };
+    contentAttrs: {
+        type: PropType<Record<string, unknown> | undefined>;
+        default: undefined;
+    };
+    listStyle: {
+        type: PropType<CSSProperties | undefined>;
+        default: undefined;
+    };
+    paddingPosition: {
+        type: PropType<"content" | "list">;
+        default: string;
+    };
     scrollbar: {
         type: PropType<boolean | ScrollbarProps>;
         default: boolean;
     };
 }>, {
     prefixCls: string;
+    props: import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        items: {
+            type: PropType<unknown[]>;
+            default: () => never[];
+        };
+        height: {
+            type: PropType<number | string>;
+            default: undefined;
+        };
+        keyField: {
+            type: PropType<KeyFieldValue<any>>;
+            default: string;
+        };
+        direction: {
+            type: PropType<ScrollDirection>;
+            default: string;
+        };
+        listTag: {
+            type: StringConstructor;
+            default: string;
+        };
+        itemTag: {
+            type: StringConstructor;
+            default: string;
+        };
+        itemSize: {
+            type: PropType<ItemSizeValue<any>>;
+            default: undefined;
+        };
+        gridItems: NumberConstructor;
+        itemSecondarySize: NumberConstructor;
+        minItemSize: {
+            type: PropType<number | string | null>;
+            default: undefined;
+        };
+        sizeField: StringConstructor;
+        typeField: StringConstructor;
+        buffer: NumberConstructor;
+        shift: BooleanConstructor;
+        cache: PropType<CacheSnapshot>;
+        prerender: NumberConstructor;
+        emitUpdate: BooleanConstructor;
+        disableTransform: BooleanConstructor;
+        flowMode: BooleanConstructor;
+        hiddenPosition: NumberConstructor;
+        updateInterval: NumberConstructor;
+        skipHover: BooleanConstructor;
+        enabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        listClass: {
+            type: PropType<ClassValue>;
+        };
+        itemClass: {
+            type: PropType<ClassValue>;
+        };
+        threshold: {
+            type: NumberConstructor;
+            default: number;
+        };
+        fixedSize: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        estimatedSize: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+        component: {
+            type: PropType<keyof HTMLElementTagNameMap | Record<string, unknown>>;
+            default: undefined;
+        };
+        listAttrs: {
+            type: PropType<Record<string, unknown> | undefined>;
+            default: undefined;
+        };
+        contentWrapperAttrs: {
+            type: PropType<Record<string, unknown> | undefined>;
+            default: undefined;
+        };
+        contentAttrs: {
+            type: PropType<Record<string, unknown> | undefined>;
+            default: undefined;
+        };
+        listStyle: {
+            type: PropType<CSSProperties | undefined>;
+            default: undefined;
+        };
+        paddingPosition: {
+            type: PropType<"content" | "list">;
+            default: string;
+        };
+        scrollbar: {
+            type: PropType<boolean | ScrollbarProps>;
+            default: boolean;
+        };
+    }>> & Readonly<{
+        onResize?: (() => any) | undefined;
+        onScroll?: ((_ev: Event) => any) | undefined;
+        onVisible?: (() => any) | undefined;
+        onUpdate?: ((_startIndex: number, _endIndex: number, _visibleStartIndex: number, _visibleEndIndex: number) => any) | undefined;
+        onHidden?: (() => any) | undefined;
+        onReachBottom?: ((_ev: Event) => any) | undefined;
+        onScrollStart?: (() => any) | undefined;
+        onScrollEnd?: (() => any) | undefined;
+    }> & {}>;
     hostClassNames: import("vue").ComputedRef<(string | undefined)[]>;
     scrollbarHostRef: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
     scrollerRef: import("vue").Ref<ScrollerExpose | undefined, ScrollerExpose | undefined>;
+    viewportRef: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    isCompatMode: import("vue").ComputedRef<boolean>;
+    mergedCompatComponent: import("vue").ComputedRef<{
+        container: string;
+        list: string;
+        content: string;
+        item: string;
+    }>;
+    hasCompatContentWrapper: import("vue").ComputedRef<boolean>;
+    compatViewportStyle: import("vue").ComputedRef<CSSProperties>;
+    compatListStyle: import("vue").ComputedRef<CSSProperties | undefined>;
+    compatContentStyle: import("vue").ComputedRef<CSSProperties | undefined>;
+    compatContentWrapperStyle: import("vue").ComputedRef<CSSProperties | undefined>;
+    compatCurrentList: import("vue").ComputedRef<unknown[]>;
+    compatStart: import("vue").ComputedRef<number>;
+    getCompatItemKey: (item: unknown, index: number) => VirtualItemKey;
+    setCompatItemRef: (key: VirtualItemKey, value: unknown) => void;
+    getCompatContentStyle: (index: number) => CSSProperties | undefined;
+    onCompatScroll: (ev: Event) => void;
     currentScroller: import("vue").ComputedRef<Component>;
     isDynamicScroller: import("vue").ComputedRef<boolean>;
     containerOuterStyle: import("vue").ComputedRef<{
@@ -166,6 +329,42 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     itemClass: {
         type: PropType<ClassValue>;
     };
+    threshold: {
+        type: NumberConstructor;
+        default: number;
+    };
+    fixedSize: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    estimatedSize: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    component: {
+        type: PropType<keyof HTMLElementTagNameMap | Record<string, unknown>>;
+        default: undefined;
+    };
+    listAttrs: {
+        type: PropType<Record<string, unknown> | undefined>;
+        default: undefined;
+    };
+    contentWrapperAttrs: {
+        type: PropType<Record<string, unknown> | undefined>;
+        default: undefined;
+    };
+    contentAttrs: {
+        type: PropType<Record<string, unknown> | undefined>;
+        default: undefined;
+    };
+    listStyle: {
+        type: PropType<CSSProperties | undefined>;
+        default: undefined;
+    };
+    paddingPosition: {
+        type: PropType<"content" | "list">;
+        default: string;
+    };
     scrollbar: {
         type: PropType<boolean | ScrollbarProps>;
         default: boolean;
@@ -183,6 +382,9 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     shift: boolean;
     height: string | number;
     direction: ScrollDirection;
+    listStyle: CSSProperties | undefined;
+    fixedSize: boolean;
+    estimatedSize: number;
     emitUpdate: boolean;
     disableTransform: boolean;
     flowMode: boolean;
@@ -194,6 +396,12 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     itemSize: ItemSizeValue<any>;
     minItemSize: string | number | null;
     enabled: boolean;
+    threshold: number;
+    component: Record<string, unknown> | keyof HTMLElementTagNameMap;
+    listAttrs: Record<string, unknown> | undefined;
+    contentWrapperAttrs: Record<string, unknown> | undefined;
+    contentAttrs: Record<string, unknown> | undefined;
+    paddingPosition: "content" | "list";
     scrollbar: boolean | ScrollbarProps;
 }, {}, {
     RecycleScroller: <TItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: {

package/es/_components/virtual-list/virtual-list.vue_vue_type_script_lang.js

@@ -1,8 +1,9 @@
 import { _objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.124.0/helpers/objectSpread2.js";
 import { getPrefixCls } from "../../_utils/global-config.js";
-import { isString } from "../../_utils/is.js";
+import { isObject, isString } from "../../_utils/is.js";
+import { useVirtualSize } from "./use-virtual-size.js";
 import { _asyncToGenerator } from "../../_virtual/_@oxc-project_runtime@0.124.0/helpers/asyncToGenerator.js";
-import { computed, defineComponent, nextTick, onBeforeUnmount, onMounted, ref, watch } from "vue";
+import { computed, defineComponent, nextTick, onBeforeUnmount, onMounted, onUpdated, ref, watch } from "vue";
 import { OverlayScrollbars } from "overlayscrollbars";
 import { DynamicScroller, DynamicScrollerItem, RecycleScroller } from "vue-virtual-scroller";
 //#region components/_components/virtual-list/virtual-list.vue?vue&type=script&lang.ts
@@ -78,6 +79,42 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 			Object,
 			Array
 		] },
+		threshold: {
+			type: Number,
+			default: 0
+		},
+		fixedSize: {
+			type: Boolean,
+			default: false
+		},
+		estimatedSize: {
+			type: Number,
+			default: void 0
+		},
+		component: {
+			type: [String, Object],
+			default: void 0
+		},
+		listAttrs: {
+			type: Object,
+			default: void 0
+		},
+		contentWrapperAttrs: {
+			type: Object,
+			default: void 0
+		},
+		contentAttrs: {
+			type: Object,
+			default: void 0
+		},
+		listStyle: {
+			type: Object,
+			default: void 0
+		},
+		paddingPosition: {
+			type: String,
+			default: "content"
+		},
 		scrollbar: {
 			type: [Boolean, Object],
 			default: true
@@ -97,12 +134,20 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 		const prefixCls = getPrefixCls("virtual-list");
 		const scrollbarHostRef = ref();
 		const scrollerRef = ref();
+		const viewportRef = ref();
+		const compatItemRefs = /* @__PURE__ */ new Map();
 		const osInstanceRef = ref(null);
 		const overlayViewportReadyRef = ref(false);
 		const resolvedItems = computed(() => {
 			var _props$items;
 			return (_props$items = props.items) !== null && _props$items !== void 0 ? _props$items : [];
 		});
+		const isCompatMode = computed(() => {
+			return Boolean(props.component || props.listAttrs || props.contentWrapperAttrs || props.contentAttrs || props.listStyle || props.paddingPosition !== "content");
+		});
+		const hasCompatContentWrapper = computed(() => {
+			return Boolean(props.contentWrapperAttrs || isObject(props.component) && props.component.item);
+		});
 		const resolvedScrollbarProps = computed(() => {
 			if (!props.scrollbar) return;
 			if (typeof props.scrollbar === "boolean") return { type: "embed" };
@@ -125,8 +170,150 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 			if (props.height === void 0) return;
 			return typeof props.height === "number" ? `${props.height}px` : props.height;
 		});
+		const mergedCompatComponent = computed(() => {
+			var _props$component;
+			if (isObject(props.component)) return _objectSpread2({
+				container: "div",
+				list: "div",
+				content: "div",
+				item: "div"
+			}, props.component);
+			return {
+				container: (_props$component = props.component) !== null && _props$component !== void 0 ? _props$component : "div",
+				list: "div",
+				content: "div",
+				item: "div"
+			};
+		});
+		const compatFixedSize = computed(() => {
+			return props.fixedSize || typeof props.itemSize === "number";
+		});
+		const compatEstimatedSize = computed(() => {
+			if (props.estimatedSize !== void 0) return props.estimatedSize;
+			if (typeof props.itemSize === "number") return props.itemSize;
+			if (typeof props.minItemSize === "number") return props.minItemSize;
+		});
+		const compatViewportSize = ref(0);
+		const compatResolvedItemSize = computed(() => {
+			var _compatEstimatedSize$;
+			return (_compatEstimatedSize$ = compatEstimatedSize.value) !== null && _compatEstimatedSize$ !== void 0 ? _compatEstimatedSize$ : 30;
+		});
+		const compatBuffer = computed(() => {
+			var _props$buffer;
+			return (_props$buffer = props.buffer) !== null && _props$buffer !== void 0 ? _props$buffer : 200;
+		});
+		const compatOverscan = computed(() => {
+			const baseItemSize = Math.max(compatResolvedItemSize.value, 1);
+			return Math.max(Math.ceil(compatBuffer.value / baseItemSize), 0);
+		});
+		const compatVisibleCount = computed(() => {
+			const baseItemSize = Math.max(compatResolvedItemSize.value, 1);
+			if (compatViewportSize.value <= 0) return 1;
+			return Math.max(Math.ceil(compatViewportSize.value / baseItemSize), 1);
+		});
+		const getCompatItemKey = (item, index) => {
+			const keyField = props.keyField;
+			if (typeof keyField === "function") return keyField(item, index);
+			if (item && typeof item === "object" && isString(keyField)) {
+				var _item$keyField;
+				return (_item$keyField = item[keyField]) !== null && _item$keyField !== void 0 ? _item$keyField : index;
+			}
+			return index;
+		};
+		const { frontPadding: compatFrontPadding, behindPadding: compatBehindPadding, start: compatStartRef, end: compatEnd, getStartByScroll: getCompatStartByScroll, setItemSize: compatSetItemSize, setStart: setCompatStart, getScrollOffset: getCompatScrollOffset, getItemSize: getCompatItemSize } = useVirtualSize({
+			dataKeys: computed(() => {
+				return resolvedItems.value.map((item, index) => getCompatItemKey(item, index));
+			}),
+			fixedSize: compatFixedSize,
+			estimatedSize: compatEstimatedSize,
+			overscan: compatOverscan,
+			visibleCount: compatVisibleCount
+		});
+		const compatCurrentList = computed(() => {
+			if (!isCompatMode.value) return [];
+			if (props.threshold && resolvedItems.value.length <= props.threshold) return resolvedItems.value;
+			return resolvedItems.value.slice(compatStartRef.value, compatEnd.value);
+		});
+		const compatStart = computed(() => {
+			if (props.threshold && resolvedItems.value.length <= props.threshold) return 0;
+			return compatStartRef.value;
+		});
+		const compatViewportStyle = computed(() => {
+			const style = { minHeight: 0 };
+			if (resolvedHeightValue.value !== void 0) style.height = resolvedScrollbarProps.value && resolvedHeightValue.value !== "auto" ? "100%" : resolvedHeightValue.value;
+			if (!resolvedScrollbarProps.value || !overlayViewportReadyRef.value) if (props.direction === "horizontal") {
+				style.overflowX = "auto";
+				style.overflowY = "hidden";
+			} else {
+				style.overflowY = "auto";
+				style.overflowX = "hidden";
+			}
+			return style;
+		});
+		const compatListPaddingStyle = computed(() => {
+			if (props.paddingPosition !== "list") return;
+			return {
+				paddingTop: `${compatFrontPadding.value}px`,
+				paddingBottom: `${compatBehindPadding.value}px`
+			};
+		});
+		const compatContentPaddingStyle = computed(() => {
+			if (props.paddingPosition !== "content") return;
+			return {
+				paddingTop: `${compatFrontPadding.value}px`,
+				paddingBottom: `${compatBehindPadding.value}px`
+			};
+		});
+		const compatListStyle = computed(() => {
+			if (!props.listStyle && !compatListPaddingStyle.value) return;
+			return _objectSpread2(_objectSpread2({}, props.listStyle), compatListPaddingStyle.value);
+		});
+		const compatContentStyle = computed(() => {
+			return compatContentPaddingStyle.value;
+		});
+		const compatContentWrapperStyle = computed(() => {
+			if (!hasCompatContentWrapper.value || props.paddingPosition !== "content") return;
+			return compatContentStyle.value;
+		});
+		const updateCompatItemSize = (key, element) => {
+			const height = element.getBoundingClientRect().height || element.offsetHeight;
+			if (height) compatSetItemSize(key, height);
+		};
+		const updateCompatItemSizes = () => {
+			compatItemRefs.forEach((element, key) => {
+				updateCompatItemSize(key, element);
+			});
+		};
+		const updateCompatViewportSize = () => {
+			var _scrollerElement$clie, _scrollerElement$clie2;
+			if (!isCompatMode.value) {
+				compatViewportSize.value = 0;
+				return;
+			}
+			const scrollerElement = getScrollerElement();
+			const nextViewportSize = props.direction === "horizontal" ? (_scrollerElement$clie = scrollerElement === null || scrollerElement === void 0 ? void 0 : scrollerElement.clientWidth) !== null && _scrollerElement$clie !== void 0 ? _scrollerElement$clie : 0 : (_scrollerElement$clie2 = scrollerElement === null || scrollerElement === void 0 ? void 0 : scrollerElement.clientHeight) !== null && _scrollerElement$clie2 !== void 0 ? _scrollerElement$clie2 : 0;
+			if (nextViewportSize > 0) compatViewportSize.value = nextViewportSize;
+		};
+		const setCompatItemRef = (key, value) => {
+			var _value$$el;
+			const element = (_value$$el = value === null || value === void 0 ? void 0 : value.$el) !== null && _value$$el !== void 0 ? _value$$el : value;
+			if (!(element instanceof HTMLElement)) {
+				compatItemRefs.delete(key);
+				return;
+			}
+			compatItemRefs.set(key, element);
+			updateCompatItemSize(key, element);
+		};
+		const getCompatContentStyle = (index) => {
+			if (hasCompatContentWrapper.value) return;
+			if (props.paddingPosition !== "content") return compatContentStyle.value;
+			const style = _objectSpread2({}, compatContentStyle.value);
+			if (index === 0) style.paddingTop = `${compatFrontPadding.value}px`;
+			if (index === compatCurrentList.value.length - 1) style.paddingBottom = `${compatBehindPadding.value}px`;
+			return style;
+		};
 		const isDynamicScroller = computed(() => {
-			return props.itemSize === void 0;
+			return !isCompatMode.value && props.itemSize === void 0;
 		});
 		const currentScroller = computed(() => {
 			return isDynamicScroller.value ? DynamicScroller : RecycleScroller;
@@ -172,6 +359,10 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 			return instance;
 		};
 		const getScrollerElement = () => {
+			if (isCompatMode.value) {
+				var _viewportRef$value;
+				return (_viewportRef$value = viewportRef.value) !== null && _viewportRef$value !== void 0 ? _viewportRef$value : null;
+			}
 			const scroller = scrollerRef.value;
 			return (scroller === null || scroller === void 0 ? void 0 : scroller.$el) instanceof HTMLElement ? scroller.$el : null;
 		};
@@ -238,7 +429,7 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 						content: false
 					}
 				}, resolvedOverlayOptions.value, { scroll: (_instance, event) => {
-					onScroll(event);
+					if (!isCompatMode.value) onScroll(event);
 				} });
 				overlayViewportReadyRef.value = true;
 			});
@@ -246,8 +437,16 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 				return _ref2.apply(this, arguments);
 			};
 		}();
-		onMounted(() => {
+		onMounted(_asyncToGenerator(function* () {
+			yield nextTick();
+			updateCompatViewportSize();
 			initOverlayScrollbar(false);
+		}));
+		onUpdated(() => {
+			if (isCompatMode.value) {
+				updateCompatItemSizes();
+				updateCompatViewportSize();
+			}
 		});
 		watch([currentScroller, resolvedOverlayOptions], _asyncToGenerator(function* () {
 			if (!resolvedOverlayOptions.value) {
@@ -269,6 +468,10 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 			var _ref3 = _asyncToGenerator(function* (nextItems, previousItems) {
 				var _resolveOSInstance, _resolveOSInstance2;
 				yield nextTick();
+				if (isCompatMode.value) {
+					updateCompatItemSizes();
+					updateCompatViewportSize();
+				}
 				(_resolveOSInstance = resolveOSInstance()) === null || _resolveOSInstance === void 0 || _resolveOSInstance.update(true);
 				yield waitForLayoutFrame();
 				if (shouldResetScrollForSmallList(nextItems, previousItems)) {
@@ -332,6 +535,14 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 			if (!target) return;
 			if (Math.floor(target.scrollHeight - (target.scrollTop + target.clientHeight)) <= 0) emit("reachBottom", ev);
 		};
+		const onCompatScroll = (ev) => {
+			const target = ev.target;
+			if (target) {
+				const nextStart = getCompatStartByScroll(target.scrollTop);
+				if (nextStart !== compatStartRef.value) setCompatStart(nextStart);
+			}
+			onScroll(ev);
+		};
 		const onScrollEnd = () => {
 			var _osInstance$elements$;
 			emit("scrollEnd");
@@ -365,22 +576,44 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 		const getScroller = () => scrollerRef.value;
 		const scrollToItem = (index, options) => {
 			var _getScroller;
+			if (isCompatMode.value) {
+				scrollTo({
+					index,
+					align: (options === null || options === void 0 ? void 0 : options.smooth) ? "auto" : void 0,
+					smooth: options === null || options === void 0 ? void 0 : options.smooth,
+					offset: options === null || options === void 0 ? void 0 : options.offset
+				});
+				return;
+			}
 			(_getScroller = getScroller()) === null || _getScroller === void 0 || _getScroller.scrollToItem(index, options);
 		};
 		const scrollToPosition = (position, options) => {
 			var _getScroller2;
+			if (isCompatMode.value) {
+				const viewport = getScrollerElement();
+				if (!viewport) return;
+				if (options === null || options === void 0 ? void 0 : options.smooth) viewport.scrollTo({
+					top: position,
+					behavior: "smooth"
+				});
+				else viewport.scrollTop = position;
+				return;
+			}
 			(_getScroller2 = getScroller()) === null || _getScroller2 === void 0 || _getScroller2.scrollToPosition(position, options);
 		};
 		const findItemIndex = (offset) => {
 			var _getScroller$findItem, _getScroller3;
+			if (isCompatMode.value) return getCompatStartByScroll(offset);
 			return (_getScroller$findItem = (_getScroller3 = getScroller()) === null || _getScroller3 === void 0 ? void 0 : _getScroller3.findItemIndex(offset)) !== null && _getScroller$findItem !== void 0 ? _getScroller$findItem : -1;
 		};
 		const getItemOffset = (index) => {
 			var _getScroller$getItemO, _getScroller4;
+			if (isCompatMode.value) return getCompatScrollOffset(index);
 			return (_getScroller$getItemO = (_getScroller4 = getScroller()) === null || _getScroller4 === void 0 ? void 0 : _getScroller4.getItemOffset(index)) !== null && _getScroller$getItemO !== void 0 ? _getScroller$getItemO : 0;
 		};
 		const getItemSize = (index) => {
 			var _getScroller$getItemS, _getScroller5;
+			if (isCompatMode.value) return getCompatItemSize(index);
 			if (isDynamicScroller.value) {
 				const dynamicScroller = getScroller();
 				if (!dynamicScroller) return 0;
@@ -403,15 +636,26 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 			scroller === null || scroller === void 0 || scroller.updateVisibleItems(itemsChanged, checkPositionDiff);
 		};
 		const scrollToBottom = () => {
+			if (isCompatMode.value) {
+				const viewport = getScrollerElement();
+				if (!viewport) return;
+				scrollToPosition(viewport.scrollHeight);
+				return;
+			}
 			const scroller = getScroller();
 			scroller === null || scroller === void 0 || scroller.scrollToBottom();
 		};
 		const forceUpdate = (clear) => {
+			if (isCompatMode.value) {
+				if (clear) setCompatStart(0);
+				return;
+			}
 			const scroller = getScroller();
 			scroller === null || scroller === void 0 || scroller.forceUpdate(clear);
 		};
 		const getDynamicItemSize = (item, index) => {
 			var _scroller$getItemSize;
+			if (isCompatMode.value) return typeof index === "number" ? getCompatItemSize(index) : 0;
 			const scroller = getScroller();
 			return (_scroller$getItemSize = scroller === null || scroller === void 0 ? void 0 : scroller.getItemSize(item, index)) !== null && _scroller$getItemSize !== void 0 ? _scroller$getItemSize : 0;
 		};
@@ -430,6 +674,19 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 				});
 			}
 			if (typeof index !== "number" || index < 0) return;
+			if (isCompatMode.value) {
+				setCompatStart(index - compatOverscan.value);
+				scrollToPosition(getCompatScrollOffset(index), {
+					smooth: options.smooth,
+					offset: options.offset
+				});
+				nextTick(() => {
+					const scrollTop = getCompatScrollOffset(index);
+					const viewport = getScrollerElement();
+					if (viewport && scrollTop !== viewport.scrollTop) viewport.scrollTop = scrollTop;
+				});
+				return;
+			}
 			scrollToItem(index, {
 				align: normalizeAlign(options.align),
 				smooth: options.smooth,
@@ -452,9 +709,24 @@ var virtual_list_vue_vue_type_script_lang_default = defineComponent({
 		});
 		return {
 			prefixCls,
+			props,
 			hostClassNames,
 			scrollbarHostRef,
 			scrollerRef,
+			viewportRef,
+			isCompatMode,
+			mergedCompatComponent,
+			hasCompatContentWrapper,
+			compatViewportStyle,
+			compatListStyle,
+			compatContentStyle,
+			compatContentWrapperStyle,
+			compatCurrentList,
+			compatStart,
+			getCompatItemKey,
+			setCompatItemRef,
+			getCompatContentStyle,
+			onCompatScroll,
 			currentScroller,
 			isDynamicScroller,
 			containerOuterStyle,

package/es/_utils/clipboard.js

@@ -19,7 +19,8 @@ var clipboard = function() {
 		range.selectNode(span);
 		selection === null || selection === void 0 || selection.addRange(range);
 		try {
-			window.document.execCommand("copy");
+			var _window$document$exec, _window$document;
+			(_window$document$exec = (_window$document = window.document).execCommand) === null || _window$document$exec === void 0 || _window$document$exec.call(_window$document, "copy");
 		} catch (err) {
 			console.error(`execCommand Error: ${err}`);
 		}

package/es/auto-complete/auto-complete.d.ts

@@ -104,9 +104,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     disabled: boolean;
     defaultValue: string;
     data: (string | number | SelectOptionData | SelectOptionGroup)[];
+    strict: boolean;
     modelValue: string;
     allowClear: boolean;
     filterOption: FilterOption;
-    strict: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;