@simon_he/vue-tui 1.0.0 → 1.0.1

package/dist/{TSelect-BwJJbuTt.js → TSelect-HzILuti9.js}

@@ -4466,18 +4466,45 @@ function normalizeVisibleLimit$1(value) {
 function isCommandPaletteRowSelectable(item) {
 	return Boolean(item && item.kind !== "separator" && item.kind !== "group" && !item.disabled);
 }
-function substringMatcher(item, query) {
-	const q = query.trim().toLowerCase();
-	if (!q) return { score: 0 };
-	const labelRanges = computeCommandPaletteMatchRanges(item.label, q);
-	const detailRanges = item.detail ? computeCommandPaletteMatchRanges(item.detail, q) : [];
-	const keywordMatch = (item.keywords ?? []).some((keyword) => String(keyword ?? "").toLowerCase().includes(q));
-	if (!labelRanges.length && !detailRanges.length && !keywordMatch) return null;
-	return {
-		score: labelRanges.length ? 100 : detailRanges.length ? 50 : 10,
-		labelRanges,
-		detailRanges
-	};
+function defaultSubstringEntries(sourceItems, query) {
+	const q = query.trim();
+	if (!q) return sourceItems.map((item, sourceIndex) => ({
+		item,
+		sourceIndex,
+		match: { score: 0 }
+	}));
+	const needle = q.toLowerCase();
+	const labelMatches = [];
+	const detailMatches = [];
+	const keywordMatches = [];
+	for (let sourceIndex = 0; sourceIndex < sourceItems.length; sourceIndex++) {
+		const item = sourceItems[sourceIndex];
+		if (item.kind === "separator" || item.kind === "group") continue;
+		const label = String(item.label ?? "");
+		const detail = item.detail == null ? "" : String(item.detail);
+		if (label.toLowerCase().includes(needle)) {
+			labelMatches.push({
+				item,
+				sourceIndex,
+				match: { score: 100 }
+			});
+			continue;
+		}
+		if (detail.toLowerCase().includes(needle)) {
+			detailMatches.push({
+				item,
+				sourceIndex,
+				match: { score: 50 }
+			});
+			continue;
+		}
+		if ((item.keywords ?? []).some((keyword) => String(keyword ?? "").toLowerCase().includes(needle))) keywordMatches.push({
+			item,
+			sourceIndex,
+			match: { score: 10 }
+		});
+	}
+	return labelMatches.concat(detailMatches, keywordMatches);
 }
 function fuzzyMatcher(item, query) {
 	const q = query.trim().toLowerCase();
@@ -4732,20 +4759,26 @@ const TCommandPalette = defineComponent({
 		const filteredEntries = computed(() => {
 			const q = query.value.trim();
 			const sourceItems = props.itemsProvider ? providerItems.value ?? [] : props.items;
-			const matcher = props.matcher ?? (props.filterStrategy === "fuzzy" ? fuzzyMatcher : substringMatcher);
-			const entries = sourceItems.flatMap((item, sourceIndex) => {
-				if (item.kind === "separator" || item.kind === "group") return q ? [] : [{
-					item,
-					sourceIndex,
-					match: { score: 0 }
-				}];
+			if (!props.matcher && props.filterStrategy === "substring") return defaultSubstringEntries(sourceItems, q);
+			const matcher = props.matcher ?? fuzzyMatcher;
+			const entries = [];
+			for (let sourceIndex = 0; sourceIndex < sourceItems.length; sourceIndex++) {
+				const item = sourceItems[sourceIndex];
+				if (item.kind === "separator" || item.kind === "group") {
+					if (!q) entries.push({
+						item,
+						sourceIndex,
+						match: { score: 0 }
+					});
+					continue;
+				}
 				const match = matcher(item, q);
-				return match ? [{
+				if (match) entries.push({
 					item,
 					sourceIndex,
 					match
-				}] : [];
-			});
+				});
+			}
 			entries.sort((a, b) => b.match.score - a.match.score || a.sourceIndex - b.sourceIndex);
 			return entries;
 		});
@@ -5383,6 +5416,40 @@ const TSelect = defineComponent({
 		const typeaheadQuery = ref("");
 		const query = computed(() => props.query ?? innerQuery.value);
 		const options = computed(() => providerOptions.value ?? props.options);
+		function getOptionLabel(opt) {
+			return isOptionObject(opt) ? opt.label : opt;
+		}
+		function getOptionKind(opt) {
+			return isOptionObject(opt) ? opt.kind : void 0;
+		}
+		function getOptionValue(opt, index) {
+			if (props.valueMode === "index") return index;
+			if (props.valueMode === "option") return opt;
+			return isOptionObject(opt) && "value" in opt ? opt.value : getOptionLabel(opt);
+		}
+		const optionValueIndex = computed(() => {
+			if (props.valueMode === "index") return null;
+			const indexed = new Map();
+			const opts = options.value;
+			for (let index = 0; index < opts.length; index++) {
+				const value = getOptionValue(opts[index], index);
+				if (typeof value === "number" && value === 0) continue;
+				if (!indexed.has(value)) indexed.set(value, index);
+			}
+			return indexed;
+		});
+		function valuesEqual(a, b) {
+			return Object.is(a, b);
+		}
+		function modelIndex(value, useValueIndex = props.multiple) {
+			if (props.valueMode === "index") return normalizeModelIndex(value);
+			if (useValueIndex) {
+				const indexed = optionValueIndex.value;
+				const cached = indexed?.get(value);
+				if (cached != null) return cached;
+			}
+			return options.value.findIndex((opt, optIndex) => valuesEqual(getOptionValue(opt, optIndex), value));
+		}
 		const initialActive = (() => {
 			const max = Math.max(0, options.value.length - 1);
 			if (!props.multiple) {
@@ -5442,24 +5509,6 @@ const TSelect = defineComponent({
 			}
 			innerActive.value = clamp(active.value, 0, max);
 		});
-		function getOptionLabel(opt) {
-			return isOptionObject(opt) ? opt.label : opt;
-		}
-		function getOptionKind(opt) {
-			return isOptionObject(opt) ? opt.kind : void 0;
-		}
-		function getOptionValue(opt, index) {
-			if (props.valueMode === "index") return index;
-			if (props.valueMode === "option") return opt;
-			return isOptionObject(opt) && "value" in opt ? opt.value : getOptionLabel(opt);
-		}
-		function valuesEqual(a, b) {
-			return Object.is(a, b);
-		}
-		function modelIndex(value) {
-			if (props.valueMode === "index") return normalizeModelIndex(value);
-			return options.value.findIndex((opt, optIndex) => valuesEqual(getOptionValue(opt, optIndex), value));
-		}
 		function isOptionInteractive(opt) {
 			if (!opt) return false;
 			const kind = getOptionKind(opt);

package/dist/{TTree-DK_DQBYm.js → TTree-ChOot2Bh.js}

@@ -7,7 +7,7 @@ import { SUPPRESS_TERMINAL_POINTER_DOWN, SUPPRESS_TERMINAL_POINTER_MOVE, SUPPRES
 import { createFramePerfStore, createTraceStore } from "./trace-CjzYeIxN.js";
 import { envFlag, envString, firstNonEmptyEnv } from "./env-Cl8qmNFN.js";
 import { createTerminalSelectionController } from "./terminal-selection-DBinO6p5.js";
-import { TBox, TInput, TRenderPlane, TText, clamp, fitCellText, mergeStyle, repeatToCells, resolveOverlayPlacement } from "./TSelect-BwJJbuTt.js";
+import { TBox, TInput, TRenderPlane, TText, clamp, fitCellText, mergeStyle, repeatToCells, resolveOverlayPlacement } from "./TSelect-HzILuti9.js";
 import { framePerfNow, mergeFramePerfReason } from "./frame-perf-C6Xfg85O.js";
 import { computed, defineComponent, effectScope, getCurrentInstance, h, inject, nextTick, onBeforeUnmount, onMounted, onScopeDispose, onUnmounted, provide, ref, shallowReactive, shallowRef, toRef, watch, watchEffect } from "vue";
 
@@ -2991,6 +2991,17 @@ function rowKey$1(row, index, key) {
 function sameRowKey(a, b) {
 	return Object.is(a, b);
 }
+function selectedRowKeyIndex(keys) {
+	if (!keys?.length) return null;
+	const indexed = new Set();
+	for (let index = 0; index < keys.length; index++) {
+		if (!(index in keys)) continue;
+		const key = keys[index];
+		if (typeof key === "number" && key === 0) return null;
+		indexed.add(key);
+	}
+	return indexed;
+}
 const TTable = defineComponent({
 	name: "TTable",
 	props: {
@@ -3099,10 +3110,19 @@ const TTable = defineComponent({
 		const rowStyle = computed(() => mergeStyle(defaultStyle.value, theme.value.components.TTable?.rowStyle, props.style));
 		const selectedRowStyle = computed(() => mergeStyle(rowStyle.value, theme.value.components.TTable?.selectedStyle, props.selectedStyle));
 		const activeRowStyle = computed(() => mergeStyle(theme.value.components.TTable?.activeStyle, props.activeStyle));
+		const selectedRowKeysIndex = computed(() => selectedRowKeyIndex(props.selectedRowKeys));
 		const bodyRows = computed(() => {
 			const top = props.header ? 2 : 0;
 			return props.rows.slice(0, Math.max(0, props.h - top));
 		});
+		function isRowSelected(key) {
+			if (props.selectedRowKey !== void 0 && sameRowKey(key, props.selectedRowKey)) return true;
+			const selectedKeys = props.selectedRowKeys;
+			if (!selectedKeys?.length) return false;
+			const indexed = selectedRowKeysIndex.value;
+			if (indexed) return indexed.has(key);
+			return selectedKeys.some((candidate) => sameRowKey(candidate, key));
+		}
 		return () => {
 			const children = [];
 			if (props.header && props.h > 0) {
@@ -3169,7 +3189,7 @@ const TTable = defineComponent({
 				const row = bodyRows.value[index];
 				const y = (props.header ? 2 : 0) + index;
 				const key = rowKey$1(row, index, props.rowKey);
-				const selected = props.selectedRowKey !== void 0 && sameRowKey(key, props.selectedRowKey) || Boolean(props.selectedRowKeys?.some((candidate) => sameRowKey(candidate, key)));
+				const selected = isRowSelected(key);
 				const active = props.activeRowKey !== void 0 && sameRowKey(key, props.activeRowKey);
 				children.push(h(TView, {
 					key: `row:${String(key)}`,
@@ -3387,34 +3407,45 @@ const TDataTable = defineComponent({
 	},
 	setup(props, { emit }) {
 		const innerScrollTop = ref(0);
-		const indexedRows = computed(() => props.rows.map((row, originalIndex) => ({
-			row,
-			originalIndex
-		})));
+		const hasLocalFilter = computed(() => !props.manualFilter && props.filterable && Boolean(props.filter.trim()));
+		const hasLocalSort = computed(() => !props.manualSort && props.sortable && Boolean(props.sortBy));
+		const indexedRows = computed(() => {
+			if (!hasLocalFilter.value && !hasLocalSort.value) return null;
+			return props.rows.map((row, originalIndex) => ({
+				row,
+				originalIndex
+			}));
+		});
 		const filteredRows = computed(() => {
-			if (props.manualFilter) return indexedRows.value;
-			if (!props.filterable || !props.filter.trim()) return indexedRows.value;
+			const rows = indexedRows.value;
+			if (!rows) return null;
+			if (!hasLocalFilter.value) return rows;
 			const query = props.filter.trim().toLowerCase();
-			if (props.filterPredicate) return indexedRows.value.filter(({ row, originalIndex }) => props.filterPredicate(row, query, props.columns, originalIndex));
-			return indexedRows.value.filter(({ row, originalIndex }) => props.columns.some((column) => displayValue(column, row, originalIndex).toLowerCase().includes(query)));
+			if (props.filterPredicate) return rows.filter(({ row, originalIndex }) => props.filterPredicate(row, query, props.columns, originalIndex));
+			return rows.filter(({ row, originalIndex }) => props.columns.some((column) => displayValue(column, row, originalIndex).toLowerCase().includes(query)));
 		});
 		const sortedRows = computed(() => {
-			const rows = [...filteredRows.value];
-			if (props.manualSort || !props.sortable || !props.sortBy) return rows;
+			const rows = filteredRows.value;
+			if (!rows) return null;
+			if (!hasLocalSort.value) return rows;
+			const sorted = [...rows];
 			const column = props.columns.find((candidate) => candidate.key === props.sortBy);
-			rows.sort((a, b) => {
+			sorted.sort((a, b) => {
 				const result = props.sorter && column ? props.sorter(a.row, b.row, column) : compareValues(a.row[props.sortBy], b.row[props.sortBy]);
 				return props.sortDirection === "desc" ? -result : result;
 			});
-			return rows;
+			return sorted;
 		});
 		function nonNegativeInteger(value) {
 			const n = Math.floor(Number(value));
 			return Number.isFinite(n) ? Math.max(0, n) : 0;
 		}
 		const visibleRowCapacity = computed(() => Math.max(0, nonNegativeInteger(props.h) - 2));
+		function processedRowCount() {
+			return sortedRows.value?.length ?? props.rows.length;
+		}
 		function maxScrollTop$1() {
-			return Math.max(0, sortedRows.value.length - visibleRowCapacity.value);
+			return Math.max(0, processedRowCount() - visibleRowCapacity.value);
 		}
 		function clampScrollTop$1(value) {
 			return Math.min(maxScrollTop$1(), nonNegativeInteger(value));
@@ -3430,7 +3461,28 @@ const TDataTable = defineComponent({
 		watch(() => [normalizedScrollTop.value, requestedScrollTop.value], ([next, requested]) => {
 			if (next !== requested) setScrollTop(next);
 		}, { immediate: true });
-		const visibleRows = computed(() => sortedRows.value.slice(normalizedScrollTop.value, normalizedScrollTop.value + visibleRowCapacity.value));
+		function dataEntryAt(absoluteIndex) {
+			const rows = sortedRows.value;
+			if (rows) return rows[absoluteIndex];
+			const row = props.rows[absoluteIndex];
+			return row ? {
+				row,
+				originalIndex: absoluteIndex
+			} : void 0;
+		}
+		function originalIndexForAbsoluteIndex(absoluteIndex) {
+			return dataEntryAt(absoluteIndex)?.originalIndex ?? absoluteIndex;
+		}
+		const visibleRows = computed(() => {
+			const top = normalizedScrollTop.value;
+			const bottom = top + visibleRowCapacity.value;
+			const rows = sortedRows.value;
+			if (rows) return rows.slice(top, bottom);
+			return props.rows.slice(top, bottom).map((row, index) => ({
+				row,
+				originalIndex: top + index
+			}));
+		});
 		const tableRows = computed(() => visibleRows.value.map(({ row }) => row));
 		const activeAbsoluteIndex = ref(null);
 		const activeRowIdentity = ref(NO_ACTIVE_ROW);
@@ -3438,7 +3490,7 @@ const TDataTable = defineComponent({
 		const columns = computed(() => props.columns.map((column) => {
 			const format = column.format ? (value, row, visibleIndex) => {
 				const absoluteIndex = normalizedScrollTop.value + visibleIndex;
-				const originalIndex = sortedRows.value[absoluteIndex]?.originalIndex ?? absoluteIndex;
+				const originalIndex = originalIndexForAbsoluteIndex(absoluteIndex);
 				return column.format(value, row, originalIndex);
 			} : void 0;
 			if (!props.sortable || column.key !== props.sortBy) return format ? {
@@ -3454,7 +3506,7 @@ const TDataTable = defineComponent({
 		}));
 		function originalIndexAt(index) {
 			const absoluteIndex = normalizedScrollTop.value + index;
-			return sortedRows.value[absoluteIndex]?.originalIndex ?? absoluteIndex;
+			return originalIndexForAbsoluteIndex(absoluteIndex);
 		}
 		function dataTableRowKey(row, index) {
 			return rowKey(row, originalIndexAt(index), props.rowKey);
@@ -3472,18 +3524,42 @@ const TDataTable = defineComponent({
 			return new Set(props.selectedRowKey === void 0 ? [] : [props.selectedRowKey]);
 		}
 		const activeRowKey = computed(() => activeRowIdentity.value === NO_ACTIVE_ROW ? void 0 : activeRowIdentity.value);
-		watch(() => [props.rowKey, ...sortedRows.value.map((entry) => dataRowKey(entry))], () => {
+		const activeRawRowKey = computed(() => {
+			if (activeAbsoluteIndex.value == null || sortedRows.value) return NO_ACTIVE_ROW;
+			const index = activeAbsoluteIndex.value;
+			const row = props.rows[index];
+			return row ? rowKey(row, index, props.rowKey) : NO_ACTIVE_ROW;
+		});
+		function findDataIndexByKey(key) {
+			const rows = sortedRows.value;
+			if (rows) return rows.findIndex((entry) => Object.is(dataRowKey(entry), key));
+			return props.rows.findIndex((row, index) => Object.is(rowKey(row, index, props.rowKey), key));
+		}
+		watch(() => [
+			props.rowKey,
+			props.rows,
+			sortedRows.value,
+			activeRowIdentity.value
+		], () => {
 			if (activeRowIdentity.value === NO_ACTIVE_ROW) return;
-			const nextIndex = sortedRows.value.findIndex((entry) => Object.is(dataRowKey(entry), activeRowIdentity.value));
+			const nextIndex = findDataIndexByKey(activeRowIdentity.value);
 			if (nextIndex < 0) {
 				clearActiveRow();
 				return;
 			}
 			activeAbsoluteIndex.value = nextIndex;
 		});
+		watch(() => [props.rowKey, activeRawRowKey.value], ([, key]) => {
+			if (activeRowIdentity.value === NO_ACTIVE_ROW) return;
+			if (key === NO_ACTIVE_ROW) {
+				clearActiveRow();
+				return;
+			}
+			if (!Object.is(activeRowIdentity.value, key)) activeRowIdentity.value = key;
+		});
 		function setActiveAbsoluteIndex(absoluteIndex) {
-			const clamped = Math.max(0, Math.min(sortedRows.value.length - 1, absoluteIndex));
-			const entry = sortedRows.value[clamped];
+			const clamped = Math.max(0, Math.min(processedRowCount() - 1, absoluteIndex));
+			const entry = dataEntryAt(clamped);
 			if (!entry) {
 				clearActiveRow();
 				return null;
@@ -3550,7 +3626,7 @@ const TDataTable = defineComponent({
 			if (event.key === "Enter" || event.key === " ") {
 				const active = setActiveAbsoluteIndex(current);
 				if (!active) return;
-				const entry = sortedRows.value[active.dataIndex];
+				const entry = dataEntryAt(active.dataIndex);
 				if (!entry) return;
 				const visibleIndex = active.dataIndex - active.scrollTop;
 				commitSelection(entry, Math.max(0, Math.min(Math.max(0, visibleRowCapacity.value - 1), visibleIndex)), active.dataIndex);
@@ -6315,8 +6391,10 @@ const TLinkifyText = defineComponent({
 
 //#endregion
 //#region src/vue/components/TTree.ts
-function flattenTree(nodes, expanded, depth = 0, out = []) {
+function flattenTree(nodes, expanded, limit, depth = 0, out = []) {
+	if (out.length >= limit) return out;
 	for (const node of nodes) {
+		if (out.length >= limit) break;
 		const expandable = Boolean(node.children?.length);
 		const isExpanded = expanded.has(node.id);
 		out.push({
@@ -6325,10 +6403,14 @@ function flattenTree(nodes, expanded, depth = 0, out = []) {
 			expandable,
 			expanded: isExpanded
 		});
-		if (expandable && isExpanded) flattenTree(node.children, expanded, depth + 1, out);
+		if (expandable && isExpanded) flattenTree(node.children, expanded, limit, depth + 1, out);
 	}
 	return out;
 }
+function visibleRowLimit(height) {
+	const limit = Math.floor(height);
+	return Number.isFinite(limit) ? Math.max(0, limit) : 0;
+}
 const TTree = defineComponent({
 	name: "TTree",
 	props: {
@@ -6395,7 +6477,7 @@ const TTree = defineComponent({
 		const { defaultStyle } = useTerminal();
 		const baseStyle = computed(() => mergeStyle(defaultStyle.value, props.style));
 		const expandedSet = computed(() => new Set(props.expandedIds));
-		const rows = computed(() => flattenTree(props.nodes, expandedSet.value).slice(0, props.h));
+		const rows = computed(() => flattenTree(props.nodes, expandedSet.value, visibleRowLimit(props.h)));
 		function toggle(item) {
 			if (item.node.disabled || !item.expandable) return;
 			const ids = new Set(props.expandedIds);