niuma-ui 2.0.3 → 2.0.9

package/dist/components/virtual-list/src/RsVirtualList.impl.js

@@ -1,75 +1,386 @@
+import { useRsConfigOptional } from "../../../composables/useRsConfig.js";
+import { resolveDirMode } from "../../../locale/apply.js";
+import { useRsI18n } from "../../../composables/useRsI18n.js";
 import { rsRadiusCss, useResolvedRsRadius } from "../../_shared/src/resolve-radius.js";
-import { isVirtualListFillHeight, resolveItemSize, resolveVirtualListHeight } from "./virtual-list-utils.js";
-import { Fragment, computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onActivated, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, toDisplayString, watch } from "vue";
+import { buildVirtualMetrics, contentToScroll, detectRtlScrollType, isVirtualListFillHeight, parseVirtualListHeightPx, readHorizontalOffset, readVirtualItemBox, resolveAlignedOffset, resolveItemSize, resolveVirtualListHeight, resolveVirtualListKeyIndex, resolveVisibleRange, scrollToContent, windowOrigin, writeHorizontalOffset } from "./virtual-list-utils.js";
+import { Fragment, computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onActivated, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, toDisplayString, useAttrs, useId, useModel, watch } from "vue";
 //#region src/components/virtual-list/src/RsVirtualList.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"id",
+	"role",
+	"aria-label",
+	"aria-activedescendant",
+	"tabindex"
+];
+var _hoisted_2 = {
+	key: 0,
+	class: "rs-virtual-list__empty",
+	role: "status"
+};
+var _hoisted_3 = { class: "rs-virtual-list__items" };
+var _hoisted_4 = [
+	"id",
+	"role",
+	"aria-selected",
+	"aria-current",
+	"onClick"
+];
 var RsVirtualList_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsVirtualList",
 	__name: "RsVirtualList",
-	props: {
+	props: /*@__PURE__*/ mergeModels({
 		items: {},
 		itemSize: {
-			type: [Number, Function],
+			type: [
+				Number,
+				Function,
+				String
+			],
 			default: 32
 		},
+		estimateSize: { default: 32 },
 		height: { default: 240 },
 		overscan: { default: 4 },
-		activeIndex: { default: null },
 		layoutActive: { type: Boolean },
-		radius: {}
-	},
-	setup(__props, { expose: __expose }) {
+		radius: {},
+		orientation: { default: "vertical" },
+		itemKey: {},
+		keyboard: {
+			type: Boolean,
+			default: false
+		},
+		bordered: {
+			type: Boolean,
+			default: true
+		},
+		ariaLabel: {},
+		id: {}
+	}, {
+		"activeIndex": { default: null },
+		"activeIndexModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["scroll", "change"], ["update:activeIndex"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
+		const activeIndex = useModel(__props, "activeIndex");
+		const emit = __emit;
+		const attrs = useAttrs();
+		const { t } = useRsI18n();
+		const config = useRsConfigOptional();
+		const uid = useId();
 		const resolvedRadius = useResolvedRsRadius(() => props.radius, "sm");
 		const rootRef = ref(null);
-		const scrollTop = ref(0);
-		const measuredHeight = ref(0);
+		const scrollOffset = ref(0);
+		const measured = ref(0);
+		const scrolling = ref(false);
+		const rtl = ref(false);
+		const measureVersion = ref(0);
+		const measuredSizes = /* @__PURE__ */ new Map();
+		const indexByEl = /* @__PURE__ */ new WeakMap();
+		const observed = /* @__PURE__ */ new Set();
+		let resizeObserver = null;
+		let itemObserver = null;
+		let disposed = false;
+		let ignoreActiveScroll = false;
+		let layoutGen = 0;
+		let layoutFrame = 0;
+		let activeFrame = 0;
+		let scrollIdle = 0;
+		let rtlScrollType = detectRtlScrollType();
 		const fillHeight = computed(() => isVirtualListFillHeight(props.height));
+		const horizontal = computed(() => props.orientation === "horizontal");
+		const rootId = computed(() => props.id || `rs-virtual-list-${uid}`);
+		const listRole = computed(() => {
+			if (attrs.role) return void 0;
+			return props.keyboard ? "listbox" : void 0;
+		});
+		const resolvedAriaLabel = computed(() => {
+			if (props.ariaLabel) return props.ariaLabel;
+			if (attrs["aria-label"] || attrs.ariaLabel) return void 0;
+			if (props.keyboard) return t("virtualList.label");
+		});
+		const emptyLabel = computed(() => t("virtualList.empty"));
 		const heightStyle = computed(() => {
 			const resolved = resolveVirtualListHeight(props.height);
 			return resolved ? { height: resolved } : void 0;
 		});
-		const rootStyle = computed(() => ({
-			...heightStyle.value,
-			"--rs-virtual-list-radius": rsRadiusCss(resolvedRadius.value)
-		}));
-		const fixedItemSize = computed(() => resolveItemSize(props.itemSize));
-		const viewportHeightPx = computed(() => {
-			if (typeof props.height === "number" && props.height > 0) return props.height;
-			if (typeof props.height === "string") {
-				const parsed = Number.parseInt(props.height, 10);
-				if (Number.isFinite(parsed) && parsed > 0 && !props.height.includes("%")) return parsed;
+		const metrics = computed(() => {
+			const version = measureVersion.value;
+			return buildVirtualMetrics(props.items.length, props.itemSize, version >= 0 ? measuredSizes : null, resolveItemSize(props.estimateSize));
+		});
+		const viewportPx = computed(() => {
+			if (!horizontal.value) {
+				const parsed = parseVirtualListHeightPx(props.height);
+				if (parsed != null) return parsed;
 			}
-			if (measuredHeight.value > 0) return measuredHeight.value;
+			if (measured.value > 0) return measured.value;
 			const el = rootRef.value;
-			if (el && el.clientHeight > 0) return el.clientHeight;
+			if (el) {
+				const live = horizontal.value ? el.clientWidth : el.clientHeight;
+				if (live > 0) return live;
+			}
 			return 240;
 		});
-		let resizeObserver = null;
-		function syncMeasuredHeight() {
+		const contentOffset = computed(() => scrollToContent(scrollOffset.value, metrics.value.total, viewportPx.value, metrics.value.extent));
+		const range = computed(() => resolveVisibleRange(props.items.length, contentOffset.value, viewportPx.value, props.overscan, metrics.value));
+		const origin = computed(() => windowOrigin(scrollOffset.value, contentOffset.value, range.value.offset));
+		const shiftX = computed(() => {
+			if (!horizontal.value) return 0;
+			return rtl.value ? -origin.value : origin.value;
+		});
+		const shiftY = computed(() => horizontal.value ? 0 : origin.value);
+		const rootStyle = computed(() => ({
+			...heightStyle.value,
+			"--rs-virtual-list-radius": rsRadiusCss(resolvedRadius.value),
+			"--rs-virtual-list-x": `${shiftX.value}px`,
+			"--rs-virtual-list-y": `${shiftY.value}px`
+		}));
+		const spacerStyle = computed(() => {
+			const extent = `${metrics.value.extent}px`;
+			return horizontal.value ? {
+				width: extent,
+				height: "100%"
+			} : { height: extent };
+		});
+		const visibleItems = computed(() => {
+			const { start, end } = range.value;
+			return props.items.slice(start, end).map((item, index) => {
+				const itemIndex = start + index;
+				return {
+					item,
+					index: itemIndex,
+					key: props.itemKey ? props.itemKey(item, itemIndex) : itemIndex
+				};
+			});
+		});
+		const activeDescendant = computed(() => {
+			if (!props.keyboard || activeIndex.value == null || activeIndex.value < 0) return void 0;
+			return `${rootId.value}-opt-${activeIndex.value}`;
+		});
+		function itemStyle(index) {
+			if (props.itemSize === "auto") {
+				const known = measuredSizes.get(index);
+				if (known == null) return void 0;
+				const size = `${known}px`;
+				return horizontal.value ? { width: size } : { height: size };
+			}
+			const size = `${metrics.value.sizeAt(index)}px`;
+			return horizontal.value ? { width: size } : { height: size };
+		}
+		function optionId(index) {
+			if (!props.keyboard || attrs.role) return void 0;
+			return `${rootId.value}-opt-${index}`;
+		}
+		function isRtlHost() {
+			if (config) return resolveDirMode(config.dir.value, config.locale.value) === "rtl";
+			const parent = rootRef.value?.parentElement;
+			if (parent && typeof getComputedStyle === "function") return getComputedStyle(parent).direction === "rtl";
+			return false;
+		}
+		function syncDir() {
+			rtl.value = isRtlHost();
+		}
+		function axisSize(el) {
+			return horizontal.value ? el.clientWidth : el.clientHeight;
+		}
+		function readRawScroll(el) {
+			if (!horizontal.value) return el.scrollTop;
+			const max = Math.max(0, el.scrollWidth - el.clientWidth);
+			return readHorizontalOffset(el.scrollLeft, max, rtl.value, rtlScrollType);
+		}
+		function writeRawScroll(el, offset) {
+			if (!horizontal.value) {
+				el.scrollTop = offset;
+				return;
+			}
+			el.scrollLeft = writeHorizontalOffset(offset, Math.max(0, el.scrollWidth - el.clientWidth), rtl.value, rtlScrollType);
+		}
+		function syncMeasured() {
 			const el = rootRef.value;
 			if (!el) return;
-			const next = el.clientHeight;
-			if (next > 0 && next !== measuredHeight.value) measuredHeight.value = next;
+			const next = horizontal.value ? el.clientWidth : el.clientHeight;
+			if (next > 0 && next !== measured.value) measured.value = next;
 		}
 		function syncLayoutFromDom() {
-			syncMeasuredHeight();
+			syncDir();
+			syncMeasured();
 			const el = rootRef.value;
-			if (el) scrollTop.value = el.scrollTop;
+			if (el) scrollOffset.value = readRawScroll(el);
+		}
+		function frame(callback) {
+			if (typeof requestAnimationFrame !== "function") {
+				callback();
+				return 0;
+			}
+			return requestAnimationFrame(callback);
 		}
 		function scheduleLayoutSync() {
+			if (disposed) return;
+			const gen = ++layoutGen;
 			syncLayoutFromDom();
 			nextTick(() => {
+				if (disposed || gen !== layoutGen) return;
 				syncLayoutFromDom();
-				requestAnimationFrame(() => {
-					syncLayoutFromDom();
+				if (layoutFrame && typeof cancelAnimationFrame === "function") cancelAnimationFrame(layoutFrame);
+				layoutFrame = frame(() => {
+					layoutFrame = 0;
+					if (!disposed && gen === layoutGen) syncLayoutFromDom();
 				});
 			});
 		}
+		function markScrolling() {
+			if (disposed) return;
+			if (!scrolling.value) scrolling.value = true;
+			if (scrollIdle) clearTimeout(scrollIdle);
+			scrollIdle = setTimeout(() => {
+				scrollIdle = 0;
+				if (!disposed) scrolling.value = false;
+			}, 120);
+		}
+		function onScroll(event) {
+			emit("scroll", event);
+			const el = event.currentTarget;
+			if (!(el instanceof HTMLElement) || disposed) return;
+			const next = readRawScroll(el);
+			if (next !== scrollOffset.value) scrollOffset.value = next;
+			markScrolling();
+		}
+		function scrollToIndex(index, align = "center") {
+			const el = rootRef.value;
+			if (!el || index < 0 || index >= props.items.length) return;
+			const view = axisSize(el) > 0 ? axisSize(el) : viewportPx.value;
+			const content = scrollToContent(readRawScroll(el), metrics.value.total, view, metrics.value.extent);
+			const nextContent = resolveAlignedOffset({
+				index,
+				align,
+				count: props.items.length,
+				viewport: view,
+				contentOffset: content,
+				total: metrics.value.total,
+				offsetAt: metrics.value.offsetAt,
+				sizeAt: metrics.value.sizeAt
+			});
+			if (nextContent == null) return;
+			writeRawScroll(el, contentToScroll(nextContent, metrics.value.total, view, metrics.value.extent));
+			scrollOffset.value = readRawScroll(el);
+		}
+		function scrollToOffset(offset) {
+			const el = rootRef.value;
+			if (!el || !Number.isFinite(offset)) return;
+			const view = axisSize(el) > 0 ? axisSize(el) : viewportPx.value;
+			writeRawScroll(el, contentToScroll(Math.max(0, offset), metrics.value.total, view, metrics.value.extent));
+			scrollOffset.value = readRawScroll(el);
+		}
+		function getScrollOffset() {
+			const el = rootRef.value;
+			const raw = el ? readRawScroll(el) : scrollOffset.value;
+			const view = el && axisSize(el) > 0 ? axisSize(el) : viewportPx.value;
+			return scrollToContent(raw, metrics.value.total, view, metrics.value.extent);
+		}
+		function getViewport() {
+			return rootRef.value ?? void 0;
+		}
+		function focus() {
+			rootRef.value?.focus();
+		}
+		function selectIndex(index, item) {
+			if (index < 0 || index >= props.items.length) return;
+			activeIndex.value = index;
+			emit("change", index, item);
+		}
+		function onItemClick(index, item) {
+			selectIndex(index, item);
+		}
+		function isTypingTarget(target) {
+			if (!(target instanceof HTMLElement)) return false;
+			return Boolean(target.closest("input, textarea, select, [contenteditable=\"true\"]"));
+		}
+		function pageSize() {
+			const sample = metrics.value.fixed ?? metrics.value.sizeAt(0);
+			if (sample <= 0) return 1;
+			return Math.max(1, Math.floor(viewportPx.value / sample));
+		}
+		function onKeydown(event) {
+			if (!props.keyboard || isTypingTarget(event.target)) return;
+			const next = resolveVirtualListKeyIndex({
+				key: event.key,
+				index: activeIndex.value,
+				count: props.items.length,
+				orientation: props.orientation,
+				rtl: rtl.value,
+				pageSize: pageSize()
+			});
+			if (next == null) return;
+			event.preventDefault();
+			if (next === activeIndex.value) return;
+			const item = props.items[next];
+			if (item === void 0) return;
+			ignoreActiveScroll = true;
+			selectIndex(next, item);
+			scrollToIndex(next, "nearest");
+		}
+		function ensureItemObserver() {
+			if (itemObserver || props.itemSize !== "auto" || typeof ResizeObserver === "undefined") return;
+			itemObserver = new ResizeObserver((entries) => {
+				if (disposed || props.itemSize !== "auto") return;
+				let changed = false;
+				for (const entry of entries) {
+					const index = indexByEl.get(entry.target);
+					if (index == null) continue;
+					if (applyMeasure(index, readVirtualItemBox(entry, props.orientation))) changed = true;
+				}
+				if (changed) measureVersion.value += 1;
+			});
+		}
+		function applyMeasure(index, next) {
+			if (next <= 0) return false;
+			const estimate = resolveItemSize(props.estimateSize);
+			const prev = measuredSizes.get(index);
+			const before = prev ?? estimate;
+			if (prev != null && Math.abs(prev - next) < .5) return false;
+			measuredSizes.set(index, next);
+			if (prev == null && Math.abs(next - estimate) < .5) return false;
+			const delta = next - before;
+			const el = rootRef.value;
+			if (el && delta !== 0 && metrics.value.extent === metrics.value.total && index < range.value.start) {
+				writeRawScroll(el, readRawScroll(el) + delta);
+				scrollOffset.value = readRawScroll(el);
+			}
+			return true;
+		}
+		function bindItem(el, index) {
+			if (props.itemSize !== "auto" || !(el instanceof Element)) return;
+			indexByEl.set(el, index);
+			if (observed.has(el)) return;
+			ensureItemObserver();
+			observed.add(el);
+			itemObserver?.observe(el);
+		}
+		function sweepObserved() {
+			for (const el of observed) if (!el.isConnected) {
+				itemObserver?.unobserve(el);
+				observed.delete(el);
+			}
+		}
+		function disconnectItemObserver() {
+			itemObserver?.disconnect();
+			itemObserver = null;
+			observed.clear();
+		}
+		function releaseItemObserver() {
+			disconnectItemObserver();
+			measuredSizes.clear();
+		}
 		onMounted(() => {
+			rtlScrollType = detectRtlScrollType();
 			scheduleLayoutSync();
 			const el = rootRef.value;
 			if (!el || typeof ResizeObserver === "undefined") return;
-			resizeObserver = new ResizeObserver(() => syncMeasuredHeight());
+			resizeObserver = new ResizeObserver(() => {
+				if (!disposed) syncMeasured();
+			});
 			resizeObserver.observe(el);
+			if (props.itemSize === "auto") ensureItemObserver();
 		});
 		onActivated(() => {
 			scheduleLayoutSync();
@@ -77,65 +388,103 @@ var RsVirtualList_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		watch(() => props.layoutActive, (active) => {
 			if (active) scheduleLayoutSync();
 		}, { flush: "post" });
+		watch(() => props.items.length, (count) => {
+			for (const key of measuredSizes.keys()) if (key >= count) measuredSizes.delete(key);
+		});
+		watch(() => props.itemSize === "auto", (auto) => {
+			if (!auto) {
+				releaseItemObserver();
+				measureVersion.value += 1;
+				return;
+			}
+			ensureItemObserver();
+		});
+		watch(() => [range.value.start, range.value.end], () => {
+			if (props.itemSize !== "auto") return;
+			nextTick(() => {
+				if (!disposed) sweepObserved();
+			});
+		});
+		watch(() => [activeIndex.value, props.items.length], async ([index, length]) => {
+			if (ignoreActiveScroll) {
+				ignoreActiveScroll = false;
+				return;
+			}
+			if (disposed || index == null || index < 0 || length === 0) return;
+			await nextTick();
+			if (disposed || ignoreActiveScroll) {
+				ignoreActiveScroll = false;
+				return;
+			}
+			if (activeFrame && typeof cancelAnimationFrame === "function") cancelAnimationFrame(activeFrame);
+			activeFrame = frame(() => {
+				activeFrame = 0;
+				if (!disposed) scrollToIndex(index);
+			});
+		}, { immediate: true });
 		onUnmounted(() => {
+			disposed = true;
+			layoutGen += 1;
+			if (typeof cancelAnimationFrame === "function") {
+				if (layoutFrame) cancelAnimationFrame(layoutFrame);
+				if (activeFrame) cancelAnimationFrame(activeFrame);
+			}
+			layoutFrame = 0;
+			activeFrame = 0;
+			if (scrollIdle) clearTimeout(scrollIdle);
+			scrollIdle = 0;
 			resizeObserver?.disconnect();
 			resizeObserver = null;
+			disconnectItemObserver();
+		});
+		__expose({
+			scrollToIndex,
+			scrollToOffset,
+			getScrollOffset,
+			getViewport,
+			focus
 		});
-		const startIndex = computed(() => Math.max(0, Math.floor(scrollTop.value / fixedItemSize.value) - props.overscan));
-		const visibleCount = computed(() => Math.ceil(viewportHeightPx.value / fixedItemSize.value) + props.overscan * 2);
-		const visibleItems = computed(() => props.items.slice(startIndex.value, startIndex.value + visibleCount.value).map((item, index) => ({
-			item,
-			index: startIndex.value + index
-		})));
-		const totalHeight = computed(() => props.items.length * fixedItemSize.value);
-		const offsetY = computed(() => startIndex.value * fixedItemSize.value);
-		function scrollToIndex(index, align = "center") {
-			const el = rootRef.value;
-			if (!el || index < 0 || index >= props.items.length) return;
-			const itemTop = index * fixedItemSize.value;
-			const itemBottom = itemTop + fixedItemSize.value;
-			const viewTop = el.scrollTop;
-			const viewBottom = viewTop + el.clientHeight;
-			if (align === "nearest" && itemTop >= viewTop && itemBottom <= viewBottom) return;
-			const maxScroll = Math.max(0, totalHeight.value - el.clientHeight);
-			let next = itemTop - (el.clientHeight - fixedItemSize.value) / 2;
-			if (align === "start") next = itemTop;
-			if (align === "end") next = itemBottom - el.clientHeight;
-			if (align === "nearest") if (itemTop < viewTop) next = itemTop;
-			else if (itemBottom > viewBottom) next = itemBottom - el.clientHeight;
-			else return;
-			el.scrollTop = Math.min(maxScroll, Math.max(0, next));
-			scrollTop.value = el.scrollTop;
-		}
-		watch(() => [props.activeIndex, props.items.length], async ([index, length]) => {
-			if (index == null || index < 0 || length === 0) return;
-			await nextTick();
-			requestAnimationFrame(() => scrollToIndex(index));
-		}, { immediate: true });
-		__expose({ scrollToIndex });
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
+				id: rootId.value,
 				ref_key: "rootRef",
 				ref: rootRef,
-				class: normalizeClass(["rs-virtual-list", { "rs-virtual-list--fill": fillHeight.value }]),
+				class: normalizeClass(["rs-virtual-list", {
+					"rs-virtual-list--fill": fillHeight.value,
+					"rs-virtual-list--horizontal": horizontal.value,
+					"rs-virtual-list--borderless": !__props.bordered,
+					"rs-virtual-list--keyboard": __props.keyboard,
+					"rs-virtual-list--auto": __props.itemSize === "auto",
+					"rs-virtual-list--scrolling": scrolling.value
+				}]),
 				style: normalizeStyle(rootStyle.value),
-				onScroll: _cache[0] || (_cache[0] = ($event) => scrollTop.value = $event.target.scrollTop)
-			}, [createElementVNode("div", {
+				role: listRole.value || void 0,
+				"aria-label": resolvedAriaLabel.value || void 0,
+				"aria-activedescendant": activeDescendant.value,
+				tabindex: __props.keyboard ? 0 : void 0,
+				onScroll,
+				onKeydown
+			}, [__props.items.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_2, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(emptyLabel.value), 1)], true)])) : (openBlock(), createElementBlock("div", {
+				key: 1,
 				class: "rs-virtual-list__spacer",
-				style: normalizeStyle({ height: `${totalHeight.value}px` })
-			}, [createElementVNode("div", {
-				class: "rs-virtual-list__items",
-				style: normalizeStyle({ transform: `translateY(${offsetY.value}px)` })
-			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleItems.value, (entry) => {
+				style: normalizeStyle(spacerStyle.value)
+			}, [createElementVNode("div", _hoisted_3, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleItems.value, (entry) => {
 				return openBlock(), createElementBlock("div", {
-					key: entry.index,
-					class: normalizeClass(["rs-virtual-list__item", { "rs-virtual-list__item--active": __props.activeIndex === entry.index }]),
-					style: normalizeStyle({ height: `${fixedItemSize.value}px` })
+					key: entry.key,
+					ref_for: true,
+					ref: (el) => bindItem(el, entry.index),
+					class: normalizeClass(["rs-virtual-list__item", { "rs-virtual-list__item--active": activeIndex.value === entry.index }]),
+					id: optionId(entry.index),
+					role: listRole.value === "listbox" ? "option" : void 0,
+					"aria-selected": listRole.value === "listbox" ? activeIndex.value === entry.index ? "true" : "false" : void 0,
+					"aria-current": listRole.value === "listbox" ? void 0 : activeIndex.value === entry.index ? "true" : void 0,
+					style: normalizeStyle(itemStyle(entry.index)),
+					onClick: ($event) => onItemClick(entry.index, entry.item)
 				}, [renderSlot(_ctx.$slots, "default", {
 					item: entry.item,
 					index: entry.index
-				}, () => [createTextVNode(toDisplayString(entry.item), 1)], true)], 6);
-			}), 128))], 4)], 4)], 38);
+				}, () => [createTextVNode(toDisplayString(entry.item), 1)], true)], 14, _hoisted_4);
+			}), 128))])], 4))], 46, _hoisted_1);
 		};
 	}
 });

package/dist/components/virtual-list/src/RsVirtualList.js

@@ -3,6 +3,6 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import RsVirtualList_vue_vue_type_script_setup_true_lang_default from "./RsVirtualList.impl.js";
 
 //#region src/components/virtual-list/src/RsVirtualList.vue
-var RsVirtualList_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsVirtualList_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4d459ccc"]]);
+var RsVirtualList_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsVirtualList_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-c4f5f6d4"]]);
 //#endregion
 export { RsVirtualList_default as default };

package/dist/components/virtual-list/src/virtual-list-utils.d.ts

@@ -1,7 +1,70 @@
-export type RsVirtualListItemSize = number | ((index: number) => number);
+export type RsVirtualListAlign = 'nearest' | 'center' | 'start' | 'end';
+export type RsVirtualListOrientation = 'vertical' | 'horizontal';
+/** 固定像素、按索引返回像素，或 `'auto'`（量内容）。 */
+export type RsVirtualListItemSize = number | ((index: number) => number) | 'auto';
+export type RsVirtualListItemKey<T> = (item: T, index: number) => string | number;
+export interface RsVirtualListExpose {
+    scrollToIndex: (index: number, align?: RsVirtualListAlign) => void;
+    scrollToOffset: (offset: number) => void;
+    getScrollOffset: () => number;
+    getViewport: () => HTMLElement | undefined;
+    focus: () => void;
+}
+export type RsVirtualListInstance = RsVirtualListExpose;
+/** Chrome / Firefox 可滚动高度上限之下，避免超长列表把滚动条撑爆。 */
+export declare const RS_VIRTUAL_LIST_MAX_EXTENT = 8000000;
+export type RsRtlScrollType = 'default' | 'negative' | 'reverse';
+export interface RsVirtualMetrics {
+    /** 定高时为行高；函数 / auto 时为 null。 */
+    fixed: number | null;
+    total: number;
+    extent: number;
+    sizeAt: (index: number) => number;
+    offsetAt: (index: number) => number;
+}
 export declare function resolveItemSize(itemSize: RsVirtualListItemSize, index?: number): number;
 export declare function resolveVirtualListHeight(height?: number | string, fallback?: number): string | undefined;
 /** height 为 0 / 百分比时由父级撑满，组件内用 ResizeObserver 测量可视高度 */
 export declare function isVirtualListFillHeight(height?: number | string): boolean;
 /** 解析虚拟列表数值视口高度；百分比 / 填满模式返回 null，交由测量值处理 */
 export declare function parseVirtualListHeightPx(height?: number | string): number | null;
+export declare function normalizeOverscan(value: number | undefined, fallback?: number): number;
+export declare function capExtent(total: number, max?: number): number;
+export declare function axisMax(total: number, viewport: number): number;
+/** 内容偏移 → 滚动条偏移。未触顶时二者相同。 */
+export declare function contentToScroll(content: number, total: number, viewport: number, extent: number): number;
+/** 滚动条偏移 → 内容偏移。未触顶时二者相同。 */
+export declare function scrollToContent(scroll: number, total: number, viewport: number, extent: number): number;
+/** 窗口在滚动内容里的平移。scale 为 1 时等于条目偏移。 */
+export declare function windowOrigin(scroll: number, contentOffset: number, itemOffset: number): number;
+export declare function buildVirtualMetrics(count: number, itemSize: RsVirtualListItemSize, measured?: ReadonlyMap<number, number> | null, estimate?: number): RsVirtualMetrics;
+export declare function findIndexAtOffset(count: number, offset: number, metrics: RsVirtualMetrics): number;
+export declare function resolveVisibleRange(count: number, contentOffset: number, viewport: number, overscan: number | undefined, metrics: RsVirtualMetrics): {
+    start: number;
+    end: number;
+    offset: number;
+};
+export declare function resolveAlignedOffset(options: {
+    index: number;
+    align: RsVirtualListAlign;
+    count: number;
+    viewport: number;
+    contentOffset: number;
+    total: number;
+    offsetAt: (index: number) => number;
+    sizeAt: (index: number) => number;
+}): number | null;
+export declare function readHorizontalOffset(scrollLeft: number, max: number, rtl: boolean, type: RsRtlScrollType): number;
+export declare function writeHorizontalOffset(offset: number, max: number, rtl: boolean, type: RsRtlScrollType): number;
+/** 探测当前引擎的 RTL scrollLeft。探测节点用完即删。无 document 时按 default。 */
+export declare function detectRtlScrollType(): RsRtlScrollType;
+export declare function resetRtlScrollTypeCache(): void;
+export declare function resolveVirtualListKeyIndex(options: {
+    key: string;
+    index: number | null;
+    count: number;
+    orientation: RsVirtualListOrientation;
+    rtl: boolean;
+    pageSize: number;
+}): number | null;
+export declare function readVirtualItemBox(entry: ResizeObserverEntry, orientation: RsVirtualListOrientation): number;