@simon_he/vue-tui 1.0.0 → 1.0.1

package/dist/experimental.js

@@ -4,7 +4,7 @@ import "./wheel-scroll-vBRaQ7p-.js";
 import "./linkify-D_gzn9Xq.js";
 import "./terminal-selection-DBinO6p5.js";
 import "./frame-perf-C6Xfg85O.js";
-import { TLogLinksPanel, TLogMinimap, TLogScrollbar, TLogSearchBar, TLogSearchPager, TLogSearchResults, TLogView, TLogVirtualLinksPanel, TLogVirtualSearchResults, TTranscriptView, TVirtualList, createAppendOnlyLogStore, createTLogDensityBucketsFromMarkers, createTLogLevelPlugin, createTLogLineMatcherPlugin, createTLogLinkActionPlugin, createTLogOsc8LinkPlugin, createTLogUrlPlugin, detectTLogUrls, dispatchTLogPluginLinkAction, getTLogPluginMetadata, handleTLogKeymapEvent, matchesTLogKeyBinding, parseTLogAnnotatedText, resolveTLogLinksPanelTheme, resolveTLogMinimapTheme, resolveTLogScrollbarTheme, resolveTLogSearchBarTheme, resolveTLogSearchPagerTheme, resolveTLogSearchResultsTheme, resolveTLogViewTheme, stripTLogAnsiText, tlogDarkPreset, tlogDarkTheme, tlogDefaultKeymap, tlogDefaultPreset, tlogDefaultTheme, tlogHighContrastKeymap, tlogHighContrastPreset, tlogHighContrastTheme, toTLogExternalLinkFromVisibleLink, useTLogLinkController, useTLogRetainedIndex, useTLogSearchController, useTLogSearchResultsPage, useTLogVirtualSearchResults } from "./tlog-theme-qPBt5rge.js";
+import { TLogLinksPanel, TLogMinimap, TLogScrollbar, TLogSearchBar, TLogSearchPager, TLogSearchResults, TLogView, TLogVirtualLinksPanel, TLogVirtualSearchResults, TTranscriptView, TVirtualList, createAppendOnlyLogStore, createTLogDensityBucketsFromMarkers, createTLogLevelPlugin, createTLogLineMatcherPlugin, createTLogLinkActionPlugin, createTLogOsc8LinkPlugin, createTLogUrlPlugin, detectTLogUrls, dispatchTLogPluginLinkAction, getTLogPluginMetadata, handleTLogKeymapEvent, matchesTLogKeyBinding, parseTLogAnnotatedText, resolveTLogLinksPanelTheme, resolveTLogMinimapTheme, resolveTLogScrollbarTheme, resolveTLogSearchBarTheme, resolveTLogSearchPagerTheme, resolveTLogSearchResultsTheme, resolveTLogViewTheme, stripTLogAnsiText, tlogDarkPreset, tlogDarkTheme, tlogDefaultKeymap, tlogDefaultPreset, tlogDefaultTheme, tlogHighContrastKeymap, tlogHighContrastPreset, tlogHighContrastTheme, toTLogExternalLinkFromVisibleLink, useTLogLinkController, useTLogRetainedIndex, useTLogSearchController, useTLogSearchResultsPage, useTLogVirtualSearchResults } from "./tlog-theme-CvLFNMwk.js";
 import { ref } from "vue";
 
 //#region src/vue/log/tlog-session.ts

package/dist/index.cjs

@@ -14463,22 +14463,40 @@ function normalizeVisibleLimit(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();
@@ -14646,14 +14664,22 @@ var TCommandPalette = (0, import_vue20.defineComponent)({
     const filteredEntries = (0, import_vue20.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 (!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") {
-          return q ? [] : [{ item, sourceIndex, match: { score: 0 } }];
+          if (!q)
+            entries.push({ item, sourceIndex, match: { score: 0 } });
+          continue;
         }
         const match = matcher(item, q);
-        return match ? [{ item, sourceIndex, match }] : [];
-      });
+        if (match)
+          entries.push({ item, sourceIndex, match });
+      }
       entries.sort((a, b) => b.match.score - a.match.score || a.sourceIndex - b.sourceIndex);
       return entries;
     });
@@ -15273,6 +15299,20 @@ function rowKey(row, index, key) {
 function sameRowKey(a, b) {
   return Object.is(a, b);
 }
+function selectedRowKeyIndex(keys) {
+  if (!keys?.length)
+    return null;
+  const indexed = /* @__PURE__ */ 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;
+}
 var TTable = (0, import_vue21.defineComponent)({
   name: "TTable",
   props: {
@@ -15345,10 +15385,22 @@ var TTable = (0, import_vue21.defineComponent)({
     const activeRowStyle = (0, import_vue21.computed)(
       () => mergeStyle(theme.value.components.TTable?.activeStyle, props.activeStyle)
     );
+    const selectedRowKeysIndex = (0, import_vue21.computed)(() => selectedRowKeyIndex(props.selectedRowKeys));
     const bodyRows = (0, import_vue21.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) {
@@ -15426,7 +15478,7 @@ var TTable = (0, import_vue21.defineComponent)({
         const row = bodyRows.value[index];
         const y = (props.header ? 2 : 0) + index;
         const key = rowKey(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(
           (0, import_vue21.h)(
@@ -15595,44 +15647,59 @@ var TDataTable = (0, import_vue22.defineComponent)({
   },
   setup(props, { emit }) {
     const innerScrollTop = (0, import_vue22.ref)(0);
-    const indexedRows = (0, import_vue22.computed)(
-      () => props.rows.map((row, originalIndex) => ({ row, originalIndex }))
+    const hasLocalFilter = (0, import_vue22.computed)(
+      () => !props.manualFilter && props.filterable && Boolean(props.filter.trim())
+    );
+    const hasLocalSort = (0, import_vue22.computed)(
+      () => !props.manualSort && props.sortable && Boolean(props.sortBy)
     );
+    const indexedRows = (0, import_vue22.computed)(() => {
+      if (!hasLocalFilter.value && !hasLocalSort.value)
+        return null;
+      return props.rows.map((row, originalIndex) => ({ row, originalIndex }));
+    });
     const filteredRows = (0, import_vue22.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(
+        return rows.filter(
           ({ row, originalIndex }) => props.filterPredicate(row, query, props.columns, originalIndex)
         );
       }
-      return indexedRows.value.filter(
+      return rows.filter(
         ({ row, originalIndex }) => props.columns.some(
           (column) => displayValue(column, row, originalIndex).toLowerCase().includes(query)
         )
       );
     });
     const sortedRows = (0, import_vue22.computed)(() => {
-      const rows = [...filteredRows.value];
-      if (props.manualSort || !props.sortable || !props.sortBy)
+      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 = (0, import_vue22.computed)(() => Math.max(0, nonNegativeInteger(props.h) - 2));
+    function processedRowCount() {
+      return sortedRows.value?.length ?? props.rows.length;
+    }
     function maxScrollTop2() {
-      return Math.max(0, sortedRows.value.length - visibleRowCapacity.value);
+      return Math.max(0, processedRowCount() - visibleRowCapacity.value);
     }
     function clampScrollTop2(value) {
       return Math.min(maxScrollTop2(), nonNegativeInteger(value));
@@ -15656,12 +15723,27 @@ var TDataTable = (0, import_vue22.defineComponent)({
       },
       { immediate: true }
     );
-    const visibleRows = (0, import_vue22.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 = (0, import_vue22.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 = (0, import_vue22.computed)(() => visibleRows.value.map(({ row }) => row));
     const activeAbsoluteIndex = (0, import_vue22.ref)(null);
     const activeRowIdentity = (0, import_vue22.ref)(NO_ACTIVE_ROW);
@@ -15670,7 +15752,7 @@ var TDataTable = (0, import_vue22.defineComponent)({
       () => 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) {
@@ -15682,7 +15764,7 @@ var TDataTable = (0, import_vue22.defineComponent)({
     );
     function originalIndexAt(index) {
       const absoluteIndex = normalizedScrollTop.value + index;
-      return sortedRows.value[absoluteIndex]?.originalIndex ?? absoluteIndex;
+      return originalIndexForAbsoluteIndex(absoluteIndex);
     }
     function dataTableRowKey(row, index) {
       return rowKey2(row, originalIndexAt(index), props.rowKey);
@@ -15703,14 +15785,28 @@ var TDataTable = (0, import_vue22.defineComponent)({
     const activeRowKey = (0, import_vue22.computed)(
       () => activeRowIdentity.value === NO_ACTIVE_ROW ? void 0 : activeRowIdentity.value
     );
+    const activeRawRowKey = (0, import_vue22.computed)(() => {
+      if (activeAbsoluteIndex.value == null || sortedRows.value)
+        return NO_ACTIVE_ROW;
+      const index = activeAbsoluteIndex.value;
+      const row = props.rows[index];
+      return row ? rowKey2(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(rowKey2(row, index, props.rowKey), key)
+      );
+    }
     (0, import_vue22.watch)(
-      () => [props.rowKey, ...sortedRows.value.map((entry) => dataRowKey(entry))],
+      () => [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;
@@ -15718,9 +15814,22 @@ var TDataTable = (0, import_vue22.defineComponent)({
         activeAbsoluteIndex.value = nextIndex;
       }
     );
+    (0, import_vue22.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;
@@ -15796,7 +15905,7 @@ var TDataTable = (0, import_vue22.defineComponent)({
         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;
@@ -18786,6 +18895,49 @@ var TSelect = (0, import_vue28.defineComponent)({
     const typeaheadQuery = (0, import_vue28.ref)("");
     const query = (0, import_vue28.computed)(() => props.query ?? innerQuery.value);
     const options = (0, import_vue28.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 = (0, import_vue28.computed)(() => {
+      if (props.valueMode === "index")
+        return null;
+      const indexed = /* @__PURE__ */ 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) {
@@ -18843,29 +18995,6 @@ var TSelect = (0, import_vue28.defineComponent)({
       }
       innerActive.value = clamp10(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;
@@ -19517,16 +19646,24 @@ var TSelect = (0, import_vue28.defineComponent)({
 
 // src/vue/components/TTree.ts
 var import_vue29 = require("vue");
-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({ node, depth, expandable, expanded: isExpanded });
     if (expandable && isExpanded)
-      flattenTree(node.children, expanded, depth + 1, out);
+      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;
+}
 var TTree = (0, import_vue29.defineComponent)({
   name: "TTree",
   props: {
@@ -19560,7 +19697,9 @@ var TTree = (0, import_vue29.defineComponent)({
     const { defaultStyle } = useTerminal();
     const baseStyle = (0, import_vue29.computed)(() => mergeStyle(defaultStyle.value, props.style));
     const expandedSet = (0, import_vue29.computed)(() => new Set(props.expandedIds));
-    const rows = (0, import_vue29.computed)(() => flattenTree(props.nodes, expandedSet.value).slice(0, props.h));
+    const rows = (0, import_vue29.computed)(
+      () => flattenTree(props.nodes, expandedSet.value, visibleRowLimit(props.h))
+    );
     function toggle(item) {
       if (item.node.disabled || !item.expandable)
         return;

package/dist/index.js

@@ -8,9 +8,9 @@ import { TView, createTheme, linkifyTextSegments, tuiDefaultTheme } from "./link
 import "./runtime-rfcZCyJq.js";
 import "./trace-CjzYeIxN.js";
 import "./env-Cl8qmNFN.js";
-import { TAutocompleteInput, TBadge, TCheckbox, TCode, TDataTable, TDivider, TFormField, TLink, TLinkifyText, TList, TPasswordInput, TRadioGroup, TSlider, TSwitch, TTable, TTag, TTree, TerminalProvider, createTInputHostPlugin } from "./TTree-DK_DQBYm.js";
+import { TAutocompleteInput, TBadge, TCheckbox, TCode, TDataTable, TDivider, TFormField, TLink, TLinkifyText, TList, TPasswordInput, TRadioGroup, TSlider, TSwitch, TTable, TTag, TTree, TerminalProvider, createTInputHostPlugin } from "./TTree-ChOot2Bh.js";
 import "./terminal-selection-DBinO6p5.js";
-import { TBox, TCommandPalette, TDialog, TInput, TSelect, TText, computeCommandPaletteMatchRanges } from "./TSelect-BwJJbuTt.js";
+import { TBox, TCommandPalette, TDialog, TInput, TSelect, TText, computeCommandPaletteMatchRanges } from "./TSelect-HzILuti9.js";
 import "./frame-perf-C6Xfg85O.js";
 import "./path-mnSgEpCm.js";