react-glide-table 1.4.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -27,20 +27,31 @@ __export(src_exports, {
27
27
  DEFAULT_TREE_PARENT_ID_FIELD: () => DEFAULT_TREE_PARENT_ID_FIELD,
28
28
  DEFAULT_TREE_QTY_FIELD: () => DEFAULT_TREE_QTY_FIELD,
29
29
  DataTable: () => DataTable,
30
+ INLINE_SEARCH_MAX_RESULTS: () => INLINE_SEARCH_MAX_RESULTS,
30
31
  Table: () => Table,
31
32
  applyCellEdit: () => applyCellEdit,
32
33
  applyFillData: () => applyFillData,
33
34
  applySelectionUpdater: () => applySelectionUpdater,
34
35
  buildColumnFreezeOffsets: () => buildColumnFreezeOffsets,
35
36
  buildColumnRowSpanMap: () => buildColumnRowSpanMap,
37
+ buildFlatSearchCorpus: () => buildFlatSearchCorpus,
36
38
  buildRowsPastePayload: () => buildRowsPastePayload,
39
+ buildSearchMatchKey: () => buildSearchMatchKey,
40
+ buildSearchMatchKeys: () => buildSearchMatchKeys,
41
+ buildTreeSearchCorpus: () => buildTreeSearchCorpus,
37
42
  canExpandRow: () => canExpandRow,
43
+ cellValueToSearchText: () => cellValueToSearchText,
44
+ collectAncestorKeysToExpand: () => collectAncestorKeysToExpand,
38
45
  collectCopyRowEntries: () => collectCopyRowEntries,
39
46
  collectCopyRows: () => collectCopyRows,
40
47
  collectFillChanges: () => collectFillChanges,
41
48
  collectRowSpanColumns: () => collectRowSpanColumns,
49
+ collectSearchMatchesInRange: () => collectSearchMatchesInRange,
50
+ createSearchRegex: () => createSearchRegex,
42
51
  createTable: () => createTable,
52
+ escapeSearchRegex: () => escapeSearchRegex,
43
53
  flattenSubtreeRows: () => flattenSubtreeRows,
54
+ formatSearchResultLabel: () => formatSearchResultLabel,
44
55
  getCellEditDraftValue: () => getCellEditDraftValue,
45
56
  getCellSelectionEdgeStyle: () => getCellSelectionEdgeStyle,
46
57
  getColumnEditType: () => getColumnEditType,
@@ -52,10 +63,15 @@ __export(src_exports, {
52
63
  isCellInSelection: () => isCellInSelection,
53
64
  isColumnEditable: () => isColumnEditable,
54
65
  isEditablePasteTarget: () => isEditablePasteTarget,
66
+ mapSearchResultToVisibleItem: () => mapSearchResultToVisibleItem,
67
+ mapSearchResultsToVisibleKeys: () => mapSearchResultsToVisibleKeys,
55
68
  measureMergedSpanRowHeights: () => measureMergedSpanRowHeights,
69
+ nextSearchIndex: () => nextSearchIndex,
70
+ nextSearchStride: () => nextSearchStride,
56
71
  parseCellEditValue: () => parseCellEditValue,
57
72
  parseClipboardTSV: () => parseClipboardTSV,
58
73
  parseClipboardTSVWithDepths: () => parseClipboardTSVWithDepths,
74
+ previousSearchIndex: () => previousSearchIndex,
59
75
  resolveColumnFreezeSide: () => resolveColumnFreezeSide,
60
76
  resolveDataTableLabels: () => resolveDataTableLabels,
61
77
  resolvePasteColumnIds: () => resolvePasteColumnIds,
@@ -69,6 +85,7 @@ __export(src_exports, {
69
85
  useCellSelection: () => useCellSelection,
70
86
  useConvertTreeData: () => useConvertTreeData,
71
87
  useGlideTable: () => useGlideTable,
88
+ useInlineSearch: () => useInlineSearch,
72
89
  writeSelectionToClipboard: () => writeSelectionToClipboard
73
90
  });
74
91
  module.exports = __toCommonJS(src_exports);
@@ -80,7 +97,12 @@ var DEFAULT_DATA_TABLE_LABELS = {
80
97
  selection: (selectedCount) => selectedCount > 0 ? `\u2713 ${selectedCount} selected` : null,
81
98
  expandRow: "Expand row",
82
99
  collapseRow: "Collapse row",
83
- resizeColumn: "Resize column"
100
+ resizeColumn: "Resize column",
101
+ searchPlaceholder: "Search\u2026",
102
+ searchResultHint: "Type to search",
103
+ searchPrevious: "Previous result",
104
+ searchNext: "Next result",
105
+ searchClose: "Close search"
84
106
  };
85
107
  function resolveDataTableLabels(partial) {
86
108
  return {
@@ -98,7 +120,7 @@ var DEFAULT_TREE_QTY_FIELD = "qty";
98
120
  // src/core/useGlideTable.ts
99
121
  var import_react_table = require("@tanstack/react-table");
100
122
  var import_react_virtual = require("@tanstack/react-virtual");
101
- var import_react4 = require("react");
123
+ var import_react5 = require("react");
102
124
 
103
125
  // src/components/ui/table/constants.ts
104
126
  var CELL_ALIGN_CLASS = {
@@ -263,6 +285,36 @@ function getCellSelectionBounds(start, end) {
263
285
  endCol: Math.max(start.col, end.col)
264
286
  };
265
287
  }
288
+ function getCellNavigationDelta(key) {
289
+ switch (key) {
290
+ case "ArrowUp":
291
+ case "w":
292
+ case "W":
293
+ return { row: -1, col: 0 };
294
+ case "ArrowDown":
295
+ case "s":
296
+ case "S":
297
+ return { row: 1, col: 0 };
298
+ case "ArrowLeft":
299
+ case "a":
300
+ case "A":
301
+ return { row: 0, col: -1 };
302
+ case "ArrowRight":
303
+ case "d":
304
+ case "D":
305
+ return { row: 0, col: 1 };
306
+ default:
307
+ return null;
308
+ }
309
+ }
310
+ function clampCellPosition(position, rowCount, columnCount) {
311
+ const maxRow = Math.max(rowCount - 1, 0);
312
+ const maxCol = Math.max(columnCount - 1, 0);
313
+ return {
314
+ row: Math.min(Math.max(position.row, 0), maxRow),
315
+ col: Math.min(Math.max(position.col, 0), maxCol)
316
+ };
317
+ }
266
318
  function measureMergedSpanRowHeights(rowIndex, rowSpan, cellElement) {
267
319
  if (rowSpan <= 1) return void 0;
268
320
  const tbody = cellElement?.closest("tbody") ?? (typeof document !== "undefined" ? document.querySelector("tbody.data-table-body") : null);
@@ -786,26 +838,44 @@ function useCellSelection({
786
838
  data,
787
839
  rows,
788
840
  enabled = true,
841
+ columnCount = 0,
789
842
  enableSubtreeCopy = false,
790
843
  enableInsertPaste = true,
791
844
  onDataChange,
792
845
  onBatchChange,
793
- onRowsPaste
846
+ onRowsPaste,
847
+ onCellNavigate
794
848
  }) {
795
849
  const [dragState, setDragState] = (0, import_react2.useState)(INITIAL_DRAG_STATE);
796
850
  const pendingPasteModeRef = (0, import_react2.useRef)(null);
851
+ const dragStateRef = (0, import_react2.useRef)(dragState);
852
+ const onCellNavigateRef = (0, import_react2.useRef)(onCellNavigate);
853
+ dragStateRef.current = dragState;
854
+ onCellNavigateRef.current = onCellNavigate;
797
855
  const cellSelectionBounds = getCellSelectionBounds(dragState.start, dragState.end);
798
856
  const activeSelectionBounds = enabled ? getActiveSelectionBounds(dragState, cellSelectionBounds) : null;
799
857
  const handleCellMouseDown = (0, import_react2.useCallback)(
800
- (rowIndex, colIndex) => {
858
+ (rowIndex, colIndex, options) => {
801
859
  if (!enabled) return;
802
- setDragState({
803
- isSelecting: true,
804
- isFillDragging: false,
805
- start: { row: rowIndex, col: colIndex },
806
- end: { row: rowIndex, col: colIndex },
807
- fillAnchor: null,
808
- fillEnd: null
860
+ setDragState((prev) => {
861
+ if (options?.shiftKey && prev.start) {
862
+ return {
863
+ ...prev,
864
+ isSelecting: true,
865
+ isFillDragging: false,
866
+ end: { row: rowIndex, col: colIndex },
867
+ fillAnchor: null,
868
+ fillEnd: null
869
+ };
870
+ }
871
+ return {
872
+ isSelecting: true,
873
+ isFillDragging: false,
874
+ start: { row: rowIndex, col: colIndex },
875
+ end: { row: rowIndex, col: colIndex },
876
+ fillAnchor: null,
877
+ fillEnd: null
878
+ };
809
879
  });
810
880
  },
811
881
  [enabled]
@@ -847,6 +917,53 @@ function useCellSelection({
847
917
  setDragState(INITIAL_DRAG_STATE);
848
918
  }
849
919
  }, [enabled]);
920
+ (0, import_react2.useEffect)(() => {
921
+ if (!enabled) return;
922
+ const handleKeyDown = (e) => {
923
+ if (e.ctrlKey || e.metaKey || e.altKey) return;
924
+ if (isEditablePasteTarget(e.target) || isEditablePasteTarget(document.activeElement)) {
925
+ return;
926
+ }
927
+ const delta = getCellNavigationDelta(e.key);
928
+ if (!delta) return;
929
+ const prev = dragStateRef.current;
930
+ if (!prev.start || !prev.end) return;
931
+ if (prev.isSelecting || prev.isFillDragging) return;
932
+ const rowCount = rows.length;
933
+ const resolvedColumnCount = columnCount > 0 ? columnCount : rows[0]?.getVisibleCells().length ?? 0;
934
+ if (rowCount <= 0 || resolvedColumnCount <= 0) return;
935
+ const nextEnd = clampCellPosition(
936
+ {
937
+ row: prev.end.row + delta.row,
938
+ col: prev.end.col + delta.col
939
+ },
940
+ rowCount,
941
+ resolvedColumnCount
942
+ );
943
+ if (nextEnd.row === prev.end.row && nextEnd.col === prev.end.col) return;
944
+ e.preventDefault();
945
+ const nextState = e.shiftKey ? {
946
+ ...prev,
947
+ isSelecting: false,
948
+ isFillDragging: false,
949
+ end: nextEnd,
950
+ fillAnchor: null,
951
+ fillEnd: null
952
+ } : {
953
+ isSelecting: false,
954
+ isFillDragging: false,
955
+ start: nextEnd,
956
+ end: nextEnd,
957
+ fillAnchor: null,
958
+ fillEnd: null
959
+ };
960
+ dragStateRef.current = nextState;
961
+ setDragState(nextState);
962
+ onCellNavigateRef.current?.(nextEnd);
963
+ };
964
+ window.addEventListener("keydown", handleKeyDown);
965
+ return () => window.removeEventListener("keydown", handleKeyDown);
966
+ }, [columnCount, enabled, rows]);
850
967
  const copySelection = (0, import_react2.useCallback)(
851
968
  async (options) => {
852
969
  if (!enabled || !activeSelectionBounds) return false;
@@ -1087,8 +1204,462 @@ function getColumnFreezeStyle(offset, options) {
1087
1204
  };
1088
1205
  }
1089
1206
 
1090
- // src/components/ui/table/features/row-expand/row-expand.ts
1207
+ // src/components/ui/table/features/inline-search/inlineSearch.ts
1208
+ var INLINE_SEARCH_MAX_RESULTS = 1e3;
1209
+ var INLINE_SEARCH_TARGET_TICK_MS = 10;
1210
+ var INLINE_SEARCH_INITIAL_STRIDE = 10;
1211
+ function escapeSearchRegex(value) {
1212
+ return value.replace(/([$()*+.?[\\\]^{|}-])/g, "\\$1");
1213
+ }
1214
+ function createSearchRegex(query) {
1215
+ const trimmed = query.trim();
1216
+ if (!trimmed) return null;
1217
+ return new RegExp(escapeSearchRegex(trimmed), "i");
1218
+ }
1219
+ function cellValueToSearchText(value) {
1220
+ if (value == null) return void 0;
1221
+ if (typeof value === "string") return value;
1222
+ if (typeof value === "number" || typeof value === "boolean") {
1223
+ return String(value);
1224
+ }
1225
+ if (Array.isArray(value)) {
1226
+ return value.map((item) => cellValueToSearchText(item) ?? "").join(" ");
1227
+ }
1228
+ if (typeof value === "object") {
1229
+ try {
1230
+ return JSON.stringify(value);
1231
+ } catch {
1232
+ return String(value);
1233
+ }
1234
+ }
1235
+ return String(value);
1236
+ }
1237
+ function formatSearchResultLabel(status) {
1238
+ const countLabel = status.results >= INLINE_SEARCH_MAX_RESULTS ? `over ${INLINE_SEARCH_MAX_RESULTS}` : `${status.results} result${status.results !== 1 ? "s" : ""}`;
1239
+ if (status.selectedIndex >= 0 && status.results > 0) {
1240
+ return `${status.selectedIndex + 1} of ${countLabel}`;
1241
+ }
1242
+ return countLabel;
1243
+ }
1244
+ function nextSearchIndex(selectedIndex, results) {
1245
+ if (results <= 0) return -1;
1246
+ if (selectedIndex < 0) return 0;
1247
+ return (selectedIndex + 1) % results;
1248
+ }
1249
+ function previousSearchIndex(selectedIndex, results) {
1250
+ if (results <= 0) return -1;
1251
+ if (selectedIndex < 0) return results - 1;
1252
+ let next = (selectedIndex - 1) % results;
1253
+ if (next < 0) next += results;
1254
+ return next;
1255
+ }
1256
+ function buildSearchMatchKey(colIndex, rowIndex) {
1257
+ return `${colIndex}:${rowIndex}`;
1258
+ }
1259
+ function buildSearchMatchKeys(results) {
1260
+ const keys = /* @__PURE__ */ new Set();
1261
+ for (const [colIndex, rowIndex] of results) {
1262
+ keys.add(buildSearchMatchKey(colIndex, rowIndex));
1263
+ }
1264
+ return keys;
1265
+ }
1266
+ function collectSearchMatchesInRange(options) {
1267
+ const {
1268
+ query,
1269
+ startRow,
1270
+ rowCount,
1271
+ columnCount,
1272
+ getCellValue,
1273
+ maxResults = INLINE_SEARCH_MAX_RESULTS
1274
+ } = options;
1275
+ const regex = createSearchRegex(query);
1276
+ if (!regex || rowCount <= 0 || columnCount <= 0) return [];
1277
+ const matches = [];
1278
+ for (let rowOffset = 0; rowOffset < rowCount; rowOffset += 1) {
1279
+ const rowIndex = startRow + rowOffset;
1280
+ for (let colIndex = 0; colIndex < columnCount; colIndex += 1) {
1281
+ const text = cellValueToSearchText(getCellValue(rowIndex, colIndex));
1282
+ if (text !== void 0 && regex.test(text)) {
1283
+ matches.push([colIndex, rowIndex]);
1284
+ if (matches.length >= maxResults) {
1285
+ return matches;
1286
+ }
1287
+ }
1288
+ }
1289
+ }
1290
+ return matches;
1291
+ }
1292
+ function nextSearchStride(currentStride, elapsedMs, targetMs = INLINE_SEARCH_TARGET_TICK_MS) {
1293
+ const rounded = Math.max(elapsedMs, 1);
1294
+ const scalar = targetMs / rounded;
1295
+ return Math.max(1, Math.ceil(currentStride * scalar));
1296
+ }
1297
+ function buildFlatSearchCorpus(rows, getRowId) {
1298
+ return rows.map((data, index) => ({
1299
+ id: getRowId(data, index),
1300
+ data,
1301
+ ancestorToggleKeys: []
1302
+ }));
1303
+ }
1304
+ function buildTreeSearchCorpus(visibleRows, options) {
1305
+ const { toggleField, getRowId } = options;
1306
+ const corpus = [];
1307
+ const seen = /* @__PURE__ */ new Set();
1308
+ const walk = (node, ancestorToggleKeys) => {
1309
+ const id = getRowId(node, corpus.length);
1310
+ if (seen.has(id)) return;
1311
+ seen.add(id);
1312
+ corpus.push({
1313
+ id,
1314
+ data: node,
1315
+ ancestorToggleKeys
1316
+ });
1317
+ const children = node.children;
1318
+ if (!Array.isArray(children) || children.length === 0) return;
1319
+ const toggleValue = node[toggleField];
1320
+ const childAncestors = typeof toggleValue === "string" && toggleValue.length > 0 ? [...ancestorToggleKeys, toggleValue] : ancestorToggleKeys;
1321
+ for (const child of children) {
1322
+ if (child && typeof child === "object") {
1323
+ walk(child, childAncestors);
1324
+ }
1325
+ }
1326
+ };
1327
+ for (const row of visibleRows) {
1328
+ const level = row.level;
1329
+ if (level === 0 || level === void 0) {
1330
+ walk(row, []);
1331
+ }
1332
+ }
1333
+ for (const row of visibleRows) {
1334
+ const id = getRowId(row, corpus.length);
1335
+ if (seen.has(id)) continue;
1336
+ walk(row, []);
1337
+ }
1338
+ return corpus;
1339
+ }
1340
+ function mapSearchResultsToVisibleKeys(results, corpus, visibleRowIndexById) {
1341
+ const keys = /* @__PURE__ */ new Set();
1342
+ for (const [colIndex, corpusRowIndex] of results) {
1343
+ const corpusRow = corpus[corpusRowIndex];
1344
+ if (!corpusRow) continue;
1345
+ const visibleRowIndex = visibleRowIndexById.get(corpusRow.id);
1346
+ if (visibleRowIndex === void 0) continue;
1347
+ keys.add(buildSearchMatchKey(colIndex, visibleRowIndex));
1348
+ }
1349
+ return keys;
1350
+ }
1351
+ function mapSearchResultToVisibleItem(item, corpus, visibleRowIndexById) {
1352
+ const [colIndex, corpusRowIndex] = item;
1353
+ const corpusRow = corpus[corpusRowIndex];
1354
+ if (!corpusRow) return null;
1355
+ const visibleRowIndex = visibleRowIndexById.get(corpusRow.id);
1356
+ if (visibleRowIndex === void 0) return null;
1357
+ return [colIndex, visibleRowIndex];
1358
+ }
1359
+ function collectAncestorKeysToExpand(corpusRow, expandedRows) {
1360
+ return corpusRow.ancestorToggleKeys.filter((key) => !expandedRows.has(key));
1361
+ }
1362
+
1363
+ // src/components/ui/table/features/inline-search/useInlineSearch.ts
1091
1364
  var import_react3 = require("react");
1365
+ var EMPTY_MATCH_KEYS = /* @__PURE__ */ new Set();
1366
+ function useInlineSearch({
1367
+ enabled = false,
1368
+ rowCount,
1369
+ columnCount,
1370
+ getCellValue,
1371
+ initialStartRow = 0,
1372
+ showSearch: controlledShowSearch,
1373
+ searchValue: controlledSearchValue,
1374
+ searchResults: controlledSearchResults,
1375
+ onSearchValueChange,
1376
+ onSearchClose,
1377
+ onSearchResultsChanged,
1378
+ onNavigateToResult,
1379
+ rootRef
1380
+ }) {
1381
+ const searchInputId = (0, import_react3.useId)();
1382
+ const searchInputRef = (0, import_react3.useRef)(null);
1383
+ const [internalShowSearch, setInternalShowSearch] = (0, import_react3.useState)(false);
1384
+ const [internalSearchValue, setInternalSearchValue] = (0, import_react3.useState)("");
1385
+ const [internalResults, setInternalResults] = (0, import_react3.useState)(
1386
+ []
1387
+ );
1388
+ const [searchStatus, setSearchStatus] = (0, import_react3.useState)();
1389
+ const searchStatusRef = (0, import_react3.useRef)(searchStatus);
1390
+ searchStatusRef.current = searchStatus;
1391
+ const abortControllerRef = (0, import_react3.useRef)(null);
1392
+ const searchHandleRef = (0, import_react3.useRef)(void 0);
1393
+ const initialStartRowRef = (0, import_react3.useRef)(initialStartRow);
1394
+ initialStartRowRef.current = initialStartRow;
1395
+ const getCellValueRef = (0, import_react3.useRef)(getCellValue);
1396
+ getCellValueRef.current = getCellValue;
1397
+ const showSearch = controlledShowSearch ?? internalShowSearch;
1398
+ const searchValue = controlledSearchValue ?? internalSearchValue;
1399
+ const searchResults = controlledSearchResults ?? internalResults;
1400
+ const setSearchValue = (0, import_react3.useCallback)(
1401
+ (value) => {
1402
+ setInternalSearchValue(value);
1403
+ onSearchValueChange?.(value);
1404
+ },
1405
+ [onSearchValueChange]
1406
+ );
1407
+ const cancelSearch = (0, import_react3.useCallback)(() => {
1408
+ if (searchHandleRef.current !== void 0) {
1409
+ window.cancelAnimationFrame(searchHandleRef.current);
1410
+ searchHandleRef.current = void 0;
1411
+ }
1412
+ abortControllerRef.current?.abort();
1413
+ }, []);
1414
+ const emitResultsChanged = (0, import_react3.useCallback)(
1415
+ (results, navIndex) => {
1416
+ onSearchResultsChanged?.(results, navIndex);
1417
+ },
1418
+ [onSearchResultsChanged]
1419
+ );
1420
+ const navigateToIndex = (0, import_react3.useCallback)(
1421
+ (results, navIndex) => {
1422
+ if (onSearchResultsChanged) return;
1423
+ if (navIndex < 0 || navIndex >= results.length) return;
1424
+ const item = results[navIndex];
1425
+ if (!item) return;
1426
+ onNavigateToResult?.(item);
1427
+ },
1428
+ [onNavigateToResult, onSearchResultsChanged]
1429
+ );
1430
+ const beginSearch = (0, import_react3.useCallback)(
1431
+ (query) => {
1432
+ if (controlledSearchResults !== void 0) return;
1433
+ const totalRows = rowCount;
1434
+ if (totalRows === 0 || columnCount === 0) {
1435
+ setSearchStatus(void 0);
1436
+ setInternalResults([]);
1437
+ emitResultsChanged([], -1);
1438
+ return;
1439
+ }
1440
+ let startY = Math.min(
1441
+ Math.max(0, initialStartRowRef.current),
1442
+ totalRows - 1
1443
+ );
1444
+ let searchStride = Math.min(INLINE_SEARCH_INITIAL_STRIDE, totalRows);
1445
+ let rowsSearched = 0;
1446
+ const runningResult = [];
1447
+ setSearchStatus(void 0);
1448
+ setInternalResults([]);
1449
+ const tick = () => {
1450
+ if (abortControllerRef.current?.signal.aborted) return;
1451
+ const tStart = performance.now();
1452
+ const rowsLeft = totalRows - rowsSearched;
1453
+ const height = Math.min(searchStride, rowsLeft, totalRows - startY);
1454
+ if (height <= 0) {
1455
+ return;
1456
+ }
1457
+ const chunk = collectSearchMatchesInRange({
1458
+ query,
1459
+ startRow: startY,
1460
+ rowCount: height,
1461
+ columnCount,
1462
+ getCellValue: (rowIndex, colIndex) => getCellValueRef.current(rowIndex, colIndex),
1463
+ maxResults: INLINE_SEARCH_MAX_RESULTS - runningResult.length
1464
+ });
1465
+ if (chunk.length > 0) {
1466
+ runningResult.push(...chunk);
1467
+ setInternalResults([...runningResult]);
1468
+ }
1469
+ rowsSearched += height;
1470
+ const selectedIndex = searchStatusRef.current?.selectedIndex ?? -1;
1471
+ setSearchStatus({
1472
+ results: runningResult.length,
1473
+ rowsSearched,
1474
+ selectedIndex
1475
+ });
1476
+ emitResultsChanged(runningResult, selectedIndex);
1477
+ if (startY + height >= totalRows) {
1478
+ startY = 0;
1479
+ } else {
1480
+ startY += height;
1481
+ }
1482
+ searchStride = nextSearchStride(
1483
+ searchStride,
1484
+ performance.now() - tStart
1485
+ );
1486
+ if (rowsSearched < totalRows && runningResult.length < INLINE_SEARCH_MAX_RESULTS) {
1487
+ searchHandleRef.current = window.requestAnimationFrame(tick);
1488
+ }
1489
+ };
1490
+ cancelSearch();
1491
+ abortControllerRef.current = new AbortController();
1492
+ searchHandleRef.current = window.requestAnimationFrame(tick);
1493
+ },
1494
+ [
1495
+ cancelSearch,
1496
+ columnCount,
1497
+ controlledSearchResults,
1498
+ emitResultsChanged,
1499
+ rowCount
1500
+ ]
1501
+ );
1502
+ const openSearch = (0, import_react3.useCallback)(() => {
1503
+ if (controlledShowSearch === void 0) {
1504
+ setInternalShowSearch(true);
1505
+ }
1506
+ }, [controlledShowSearch]);
1507
+ const closeSearch = (0, import_react3.useCallback)(() => {
1508
+ if (controlledShowSearch === void 0) {
1509
+ setInternalShowSearch(false);
1510
+ }
1511
+ onSearchClose?.();
1512
+ setSearchStatus(void 0);
1513
+ setInternalResults([]);
1514
+ emitResultsChanged([], -1);
1515
+ cancelSearch();
1516
+ }, [
1517
+ cancelSearch,
1518
+ controlledShowSearch,
1519
+ emitResultsChanged,
1520
+ onSearchClose
1521
+ ]);
1522
+ const goToNext = (0, import_react3.useCallback)(() => {
1523
+ if (!searchStatus || searchStatus.results === 0) return;
1524
+ const newIndex = nextSearchIndex(
1525
+ searchStatus.selectedIndex,
1526
+ searchStatus.results
1527
+ );
1528
+ setSearchStatus({ ...searchStatus, selectedIndex: newIndex });
1529
+ emitResultsChanged(searchResults, newIndex);
1530
+ navigateToIndex(searchResults, newIndex);
1531
+ }, [emitResultsChanged, navigateToIndex, searchResults, searchStatus]);
1532
+ const goToPrevious = (0, import_react3.useCallback)(() => {
1533
+ if (!searchStatus || searchStatus.results === 0) return;
1534
+ const newIndex = previousSearchIndex(
1535
+ searchStatus.selectedIndex,
1536
+ searchStatus.results
1537
+ );
1538
+ setSearchStatus({ ...searchStatus, selectedIndex: newIndex });
1539
+ emitResultsChanged(searchResults, newIndex);
1540
+ navigateToIndex(searchResults, newIndex);
1541
+ }, [emitResultsChanged, navigateToIndex, searchResults, searchStatus]);
1542
+ (0, import_react3.useEffect)(() => {
1543
+ if (controlledSearchResults === void 0) return;
1544
+ if (controlledSearchResults.length > 0) {
1545
+ setSearchStatus((current) => ({
1546
+ rowsSearched: rowCount,
1547
+ results: controlledSearchResults.length,
1548
+ selectedIndex: current?.selectedIndex ?? -1
1549
+ }));
1550
+ } else {
1551
+ setSearchStatus(void 0);
1552
+ }
1553
+ }, [controlledSearchResults, rowCount]);
1554
+ (0, import_react3.useEffect)(() => {
1555
+ if (!enabled) return;
1556
+ setSearchStatus(void 0);
1557
+ setInternalResults([]);
1558
+ emitResultsChanged([], -1);
1559
+ if (showSearch) {
1560
+ queueMicrotask(() => {
1561
+ searchInputRef.current?.focus({ preventScroll: true });
1562
+ });
1563
+ } else {
1564
+ cancelSearch();
1565
+ }
1566
+ }, [enabled, showSearch]);
1567
+ (0, import_react3.useEffect)(() => {
1568
+ if (!enabled || !showSearch) return;
1569
+ if (controlledSearchResults !== void 0) return;
1570
+ if (searchValue.trim() === "") {
1571
+ setSearchStatus(void 0);
1572
+ setInternalResults([]);
1573
+ cancelSearch();
1574
+ emitResultsChanged([], -1);
1575
+ return;
1576
+ }
1577
+ beginSearch(searchValue);
1578
+ }, [
1579
+ beginSearch,
1580
+ cancelSearch,
1581
+ controlledSearchResults,
1582
+ emitResultsChanged,
1583
+ enabled,
1584
+ searchValue,
1585
+ showSearch
1586
+ ]);
1587
+ (0, import_react3.useEffect)(() => {
1588
+ if (!enabled) return;
1589
+ const handleKeyDown = (event) => {
1590
+ if (!(event.ctrlKey || event.metaKey)) return;
1591
+ if (event.key.toLowerCase() !== "f") return;
1592
+ const root = rootRef?.current;
1593
+ if (root) {
1594
+ const active = document.activeElement;
1595
+ const focusInside = active === root || active instanceof Node && root.contains(active);
1596
+ if (!focusInside && active !== document.body) {
1597
+ return;
1598
+ }
1599
+ }
1600
+ event.preventDefault();
1601
+ event.stopPropagation();
1602
+ if (showSearch) {
1603
+ searchInputRef.current?.focus({ preventScroll: true });
1604
+ searchInputRef.current?.select();
1605
+ return;
1606
+ }
1607
+ if (controlledShowSearch === void 0) {
1608
+ setInternalShowSearch(true);
1609
+ }
1610
+ };
1611
+ window.addEventListener("keydown", handleKeyDown, true);
1612
+ return () => window.removeEventListener("keydown", handleKeyDown, true);
1613
+ }, [controlledShowSearch, enabled, rootRef, showSearch]);
1614
+ (0, import_react3.useEffect)(() => () => cancelSearch(), [cancelSearch]);
1615
+ const searchMatchKeys = (0, import_react3.useMemo)(
1616
+ () => buildSearchMatchKeys(searchResults),
1617
+ [searchResults]
1618
+ );
1619
+ const activeMatch = (0, import_react3.useMemo)(() => {
1620
+ if (!searchStatus || searchStatus.selectedIndex < 0) return null;
1621
+ return searchResults[searchStatus.selectedIndex] ?? null;
1622
+ }, [searchResults, searchStatus]);
1623
+ if (!enabled) {
1624
+ return {
1625
+ enabled: false,
1626
+ showSearch: false,
1627
+ searchValue: "",
1628
+ searchResults: [],
1629
+ searchStatus: void 0,
1630
+ searchMatchKeys: EMPTY_MATCH_KEYS,
1631
+ activeMatch: null,
1632
+ searchInputRef,
1633
+ searchInputId,
1634
+ canClose: false,
1635
+ openSearch,
1636
+ closeSearch,
1637
+ setSearchValue,
1638
+ goToNext,
1639
+ goToPrevious
1640
+ };
1641
+ }
1642
+ return {
1643
+ enabled: true,
1644
+ showSearch,
1645
+ searchValue,
1646
+ searchResults,
1647
+ searchStatus,
1648
+ searchMatchKeys,
1649
+ activeMatch,
1650
+ searchInputRef,
1651
+ searchInputId,
1652
+ canClose: controlledShowSearch === void 0 || onSearchClose !== void 0,
1653
+ openSearch,
1654
+ closeSearch,
1655
+ setSearchValue,
1656
+ goToNext,
1657
+ goToPrevious
1658
+ };
1659
+ }
1660
+
1661
+ // src/components/ui/table/features/row-expand/row-expand.ts
1662
+ var import_react4 = require("react");
1092
1663
  function getFieldValue(row, key) {
1093
1664
  return row[key];
1094
1665
  }
@@ -1118,12 +1689,12 @@ var useConvertTreeData = ({
1118
1689
  expandedRows,
1119
1690
  onExpandedRowsChange
1120
1691
  }) => {
1121
- const onExpandedRowsChangeRef = (0, import_react3.useRef)(onExpandedRowsChange);
1122
- const hasInitializedRef = (0, import_react3.useRef)(false);
1123
- (0, import_react3.useEffect)(() => {
1692
+ const onExpandedRowsChangeRef = (0, import_react4.useRef)(onExpandedRowsChange);
1693
+ const hasInitializedRef = (0, import_react4.useRef)(false);
1694
+ (0, import_react4.useEffect)(() => {
1124
1695
  onExpandedRowsChangeRef.current = onExpandedRowsChange;
1125
1696
  }, [onExpandedRowsChange]);
1126
- (0, import_react3.useEffect)(() => {
1697
+ (0, import_react4.useEffect)(() => {
1127
1698
  if (!data || data.length === 0) {
1128
1699
  hasInitializedRef.current = false;
1129
1700
  return;
@@ -1133,7 +1704,7 @@ var useConvertTreeData = ({
1133
1704
  onExpandedRowsChangeRef.current?.(new Set(ids));
1134
1705
  hasInitializedRef.current = true;
1135
1706
  }, [enabled, data, toggleField]);
1136
- const processedData = (0, import_react3.useMemo)(() => {
1707
+ const processedData = (0, import_react4.useMemo)(() => {
1137
1708
  if (!enabled || !data || data.length === 0) return [];
1138
1709
  const flattenedData = [];
1139
1710
  const flattenItems = (items) => {
@@ -1197,7 +1768,7 @@ var useConvertTreeData = ({
1197
1768
  });
1198
1769
  return rootItems;
1199
1770
  }, [enabled, data, toggleField, childField, flattenField]);
1200
- const flattenTree = (0, import_react3.useMemo)(() => {
1771
+ const flattenTree = (0, import_react4.useMemo)(() => {
1201
1772
  if (!enabled) return [];
1202
1773
  const flatten = (nodes, result = [], level = 0) => {
1203
1774
  nodes.forEach((node, index) => {
@@ -1247,7 +1818,7 @@ var useConvertTreeData = ({
1247
1818
  preventExpand,
1248
1819
  expandedRows
1249
1820
  ]);
1250
- const sortedData = (0, import_react3.useMemo)(() => {
1821
+ const sortedData = (0, import_react4.useMemo)(() => {
1251
1822
  if (!enabled) {
1252
1823
  return data ?? [];
1253
1824
  }
@@ -1353,6 +1924,7 @@ function collectRowSpanColumns(columns) {
1353
1924
 
1354
1925
  // src/core/useGlideTable.ts
1355
1926
  var EMPTY_COLUMN_FREEZE_OFFSETS = /* @__PURE__ */ new Map();
1927
+ var EMPTY_SEARCH_MATCH_KEYS = /* @__PURE__ */ new Set();
1356
1928
  function useGlideTable(options) {
1357
1929
  const {
1358
1930
  data,
@@ -1393,9 +1965,16 @@ function useGlideTable(options) {
1393
1965
  columnSizing: controlledColumnSizing,
1394
1966
  onColumnSizingChange,
1395
1967
  columnResizeMode = "onChange",
1396
- enableColumnFreeze = false
1968
+ enableColumnFreeze = false,
1969
+ enableInlineSearch = false,
1970
+ showSearch,
1971
+ searchValue,
1972
+ onSearchValueChange,
1973
+ onSearchClose,
1974
+ searchResults,
1975
+ onSearchResultsChanged
1397
1976
  } = options;
1398
- const labels = (0, import_react4.useMemo)(() => {
1977
+ const labels = (0, import_react5.useMemo)(() => {
1399
1978
  const resolved = resolveDataTableLabels(labelsProp);
1400
1979
  return {
1401
1980
  ...resolved,
@@ -1406,15 +1985,16 @@ function useGlideTable(options) {
1406
1985
  }, [labelsProp, emptyText, loadingText, selectionLabel]);
1407
1986
  const enableExpand = Boolean(toggleField);
1408
1987
  const resolvedEnableSubtreeCopy = enableSubtreeCopy ?? enableExpand;
1409
- const [internalRowSelection, setInternalRowSelection] = (0, import_react4.useState)({});
1410
- const [internalColumnSizing, setInternalColumnSizing] = (0, import_react4.useState)({});
1411
- const [internalExpandedRows, setInternalExpandedRows] = (0, import_react4.useState)(
1988
+ const [internalRowSelection, setInternalRowSelection] = (0, import_react5.useState)({});
1989
+ const [internalColumnSizing, setInternalColumnSizing] = (0, import_react5.useState)({});
1990
+ const [internalExpandedRows, setInternalExpandedRows] = (0, import_react5.useState)(
1412
1991
  () => /* @__PURE__ */ new Set()
1413
1992
  );
1414
- const [hoveredRowIndex, setHoveredRowIndex] = (0, import_react4.useState)(null);
1415
- const scrollRef = (0, import_react4.useRef)(null);
1993
+ const [hoveredRowIndex, setHoveredRowIndex] = (0, import_react5.useState)(null);
1994
+ const scrollRef = (0, import_react5.useRef)(null);
1995
+ const rootRef = (0, import_react5.useRef)(null);
1416
1996
  const shouldVirtualize = enableVirtualization && !enableRowSpan;
1417
- (0, import_react4.useEffect)(() => {
1997
+ (0, import_react5.useEffect)(() => {
1418
1998
  if (enableVirtualization && enableRowSpan) {
1419
1999
  console.warn(
1420
2000
  "[useGlideTable] enableRowSpan is on; virtualization is disabled to preserve cell merges."
@@ -1428,7 +2008,7 @@ function useGlideTable(options) {
1428
2008
  );
1429
2009
  const columnSizing = controlledColumnSizing ?? internalColumnSizing;
1430
2010
  const expandedRows = controlledExpandedRows ?? internalExpandedRows;
1431
- const handleExpandedRowsChange = (0, import_react4.useCallback)(
2011
+ const handleExpandedRowsChange = (0, import_react5.useCallback)(
1432
2012
  (next) => {
1433
2013
  if (onExpandedRowsChange) {
1434
2014
  onExpandedRowsChange(next);
@@ -1489,13 +2069,13 @@ function useGlideTable(options) {
1489
2069
  getCoreRowModel: (0, import_react_table.getCoreRowModel)(),
1490
2070
  getRowId: getRowId ? (originalRow, index) => getRowId(originalRow, index) : (_originalRow, index) => String(index)
1491
2071
  });
1492
- const rowSpanColumnKeys = (0, import_react4.useMemo)(() => {
2072
+ const rowSpanColumnKeys = (0, import_react5.useMemo)(() => {
1493
2073
  if (!enableRowSpan) return [];
1494
2074
  return collectRowSpanColumns(columns);
1495
2075
  }, [enableRowSpan, columns]);
1496
2076
  const primaryRowSpanKey = rowSpanColumnKeys[0]?.rowSpanKey;
1497
2077
  const primaryRowSpanColumnId = rowSpanColumnKeys[0]?.columnId;
1498
- const columnRowSpanMap = (0, import_react4.useMemo)(
2078
+ const columnRowSpanMap = (0, import_react5.useMemo)(
1499
2079
  () => buildColumnRowSpanMap(tableData, rowSpanColumnKeys),
1500
2080
  [tableData, rowSpanColumnKeys]
1501
2081
  );
@@ -1504,7 +2084,7 @@ function useGlideTable(options) {
1504
2084
  const rows = table.getRowModel().rows;
1505
2085
  const columnCount = table.getAllLeafColumns().length || 1;
1506
2086
  const visibleLeafColumns = table.getVisibleLeafColumns();
1507
- const columnFreezeOffsets = (0, import_react4.useMemo)(() => {
2087
+ const columnFreezeOffsets = (0, import_react5.useMemo)(() => {
1508
2088
  if (!enableColumnFreeze) return EMPTY_COLUMN_FREEZE_OFFSETS;
1509
2089
  return buildColumnFreezeOffsets(
1510
2090
  visibleLeafColumns.map((column) => ({
@@ -1524,13 +2104,46 @@ function useGlideTable(options) {
1524
2104
  const totalSize = rowVirtualizer.getTotalSize();
1525
2105
  const paddingTop = virtualRows.length > 0 ? virtualRows[0]?.start ?? 0 : 0;
1526
2106
  const paddingBottom = virtualRows.length > 0 ? totalSize - (virtualRows[virtualRows.length - 1]?.end ?? 0) : 0;
1527
- const selectedRowIndices = (0, import_react4.useMemo)(() => {
2107
+ const selectedRowIndices = (0, import_react5.useMemo)(() => {
1528
2108
  const indices = /* @__PURE__ */ new Set();
1529
2109
  for (const selectedRow of selectedRows) {
1530
2110
  indices.add(selectedRow.index);
1531
2111
  }
1532
2112
  return indices;
1533
2113
  }, [selectedRows]);
2114
+ const scrollCellIntoView = (0, import_react5.useCallback)(
2115
+ (rowIndex, colIndex, options2) => {
2116
+ const align = options2?.align ?? "nearest";
2117
+ const blockAlign = align === "center" ? "center" : "nearest";
2118
+ if (shouldVirtualize) {
2119
+ rowVirtualizer.scrollToIndex(rowIndex, {
2120
+ align: align === "nearest" ? "auto" : align
2121
+ });
2122
+ }
2123
+ const scrollElement = scrollRef.current;
2124
+ if (!scrollElement) return;
2125
+ const scrollToMatchedCell = () => {
2126
+ const cell = scrollElement.querySelector(
2127
+ `[data-row-index="${rowIndex}"][data-col-index="${colIndex}"]`
2128
+ );
2129
+ if (cell instanceof HTMLElement) {
2130
+ cell.scrollIntoView({ block: blockAlign, inline: "nearest" });
2131
+ }
2132
+ };
2133
+ if (shouldVirtualize) {
2134
+ requestAnimationFrame(scrollToMatchedCell);
2135
+ return;
2136
+ }
2137
+ scrollToMatchedCell();
2138
+ },
2139
+ [rowVirtualizer, shouldVirtualize]
2140
+ );
2141
+ const handleCellNavigate = (0, import_react5.useCallback)(
2142
+ (position) => {
2143
+ scrollCellIntoView(position.row, position.col, { align: "nearest" });
2144
+ },
2145
+ [scrollCellIntoView]
2146
+ );
1534
2147
  const {
1535
2148
  dragState,
1536
2149
  activeSelectionBounds,
@@ -1542,11 +2155,13 @@ function useGlideTable(options) {
1542
2155
  data: tableData,
1543
2156
  rows,
1544
2157
  enabled: enableCellSelection,
2158
+ columnCount: visibleLeafColumns.length,
1545
2159
  enableSubtreeCopy: resolvedEnableSubtreeCopy,
1546
2160
  enableInsertPaste: enableInsertPaste ?? true,
1547
2161
  onDataChange,
1548
2162
  onBatchChange,
1549
- onRowsPaste
2163
+ onRowsPaste,
2164
+ onCellNavigate: handleCellNavigate
1550
2165
  });
1551
2166
  const {
1552
2167
  editingCell,
@@ -1556,23 +2171,193 @@ function useGlideTable(options) {
1556
2171
  commitEdit,
1557
2172
  cancelEdit
1558
2173
  } = useCellEdit({ data: tableData, rows, onDataChange, onCellChange });
1559
- const handleCellMouseDownWithCommit = (0, import_react4.useCallback)(
1560
- (rowIndex, colIndex) => {
2174
+ const handleCellMouseDownWithCommit = (0, import_react5.useCallback)(
2175
+ (rowIndex, colIndex, options2) => {
1561
2176
  const isSameEditingCell = editingCell?.rowIndex === rowIndex && editingCell?.colIndex === colIndex;
1562
2177
  if (editingCell && !isSameEditingCell && !commitEdit()) {
1563
2178
  return;
1564
2179
  }
1565
- handleCellMouseDown(rowIndex, colIndex);
2180
+ handleCellMouseDown(rowIndex, colIndex, options2);
1566
2181
  },
1567
2182
  [commitEdit, editingCell, handleCellMouseDown]
1568
2183
  );
1569
- const clearHover = (0, import_react4.useCallback)(() => {
2184
+ const navigateToSearchResult = (0, import_react5.useCallback)(
2185
+ (item) => {
2186
+ const [colIndex, rowIndex] = item;
2187
+ handleCellMouseDownWithCommit(rowIndex, colIndex);
2188
+ scrollCellIntoView(rowIndex, colIndex, { align: "center" });
2189
+ },
2190
+ [handleCellMouseDownWithCommit, scrollCellIntoView]
2191
+ );
2192
+ const resolveSearchRowId = (0, import_react5.useCallback)(
2193
+ (row, index) => {
2194
+ if (getRowId) return getRowId(row, index);
2195
+ if (enableExpand) {
2196
+ const record = row;
2197
+ const idValue = record.id;
2198
+ if (idValue != null && String(idValue).length > 0) {
2199
+ return String(idValue);
2200
+ }
2201
+ const uniqueId = record.uniqueId;
2202
+ if (uniqueId != null && String(uniqueId).length > 0) {
2203
+ return String(uniqueId);
2204
+ }
2205
+ if (toggleField) {
2206
+ const toggleValue = record[toggleField];
2207
+ if (toggleValue != null && String(toggleValue).length > 0) {
2208
+ return String(toggleValue);
2209
+ }
2210
+ }
2211
+ }
2212
+ return String(index);
2213
+ },
2214
+ [enableExpand, getRowId, toggleField]
2215
+ );
2216
+ const searchCorpus = (0, import_react5.useMemo)(() => {
2217
+ if (!enableInlineSearch) return [];
2218
+ if (enableExpand && toggleField) {
2219
+ return buildTreeSearchCorpus(tableData, {
2220
+ toggleField,
2221
+ getRowId: resolveSearchRowId
2222
+ });
2223
+ }
2224
+ return buildFlatSearchCorpus(tableData, resolveSearchRowId);
2225
+ }, [
2226
+ enableExpand,
2227
+ enableInlineSearch,
2228
+ resolveSearchRowId,
2229
+ tableData,
2230
+ toggleField
2231
+ ]);
2232
+ const searchCorpusRef = (0, import_react5.useRef)(searchCorpus);
2233
+ searchCorpusRef.current = searchCorpus;
2234
+ const visibleRowIndexById = (0, import_react5.useMemo)(() => {
2235
+ const map = /* @__PURE__ */ new Map();
2236
+ for (const row of rows) {
2237
+ map.set(resolveSearchRowId(row.original, row.index), row.index);
2238
+ }
2239
+ return map;
2240
+ }, [resolveSearchRowId, rows]);
2241
+ const getSearchCellValue = (0, import_react5.useCallback)(
2242
+ (rowIndex, colIndex) => {
2243
+ const corpusRow = searchCorpusRef.current[rowIndex];
2244
+ const column = visibleLeafColumns[colIndex];
2245
+ if (!corpusRow || !column) return void 0;
2246
+ const visibleIndex = visibleRowIndexById.get(corpusRow.id);
2247
+ if (visibleIndex !== void 0) {
2248
+ const visibleRow = rows[visibleIndex];
2249
+ if (visibleRow) {
2250
+ return visibleRow.getValue(column.id);
2251
+ }
2252
+ }
2253
+ const columnDef = column.columnDef;
2254
+ if ("accessorFn" in columnDef && typeof columnDef.accessorFn === "function") {
2255
+ return columnDef.accessorFn(corpusRow.data, rowIndex);
2256
+ }
2257
+ if ("accessorKey" in columnDef && columnDef.accessorKey != null && columnDef.accessorKey !== "") {
2258
+ return corpusRow.data[String(columnDef.accessorKey)];
2259
+ }
2260
+ return corpusRow.data[column.id];
2261
+ },
2262
+ [rows, visibleLeafColumns, visibleRowIndexById]
2263
+ );
2264
+ const pendingSearchNavRef = (0, import_react5.useRef)(null);
2265
+ const focusSearchResult = (0, import_react5.useCallback)(
2266
+ (colIndex, visibleRowIndex) => {
2267
+ navigateToSearchResult([colIndex, visibleRowIndex]);
2268
+ },
2269
+ [navigateToSearchResult]
2270
+ );
2271
+ const navigateToCorpusSearchResult = (0, import_react5.useCallback)(
2272
+ (item) => {
2273
+ const [colIndex, corpusRowIndex] = item;
2274
+ const corpusRow = searchCorpusRef.current[corpusRowIndex];
2275
+ if (!corpusRow) return;
2276
+ const missingKeys = collectAncestorKeysToExpand(corpusRow, expandedRows);
2277
+ if (missingKeys.length > 0) {
2278
+ pendingSearchNavRef.current = {
2279
+ colIndex,
2280
+ rowId: corpusRow.id
2281
+ };
2282
+ const next = new Set(expandedRows);
2283
+ for (const key of corpusRow.ancestorToggleKeys) {
2284
+ next.add(key);
2285
+ }
2286
+ handleExpandedRowsChange(next);
2287
+ return;
2288
+ }
2289
+ const visibleItem = mapSearchResultToVisibleItem(
2290
+ item,
2291
+ searchCorpusRef.current,
2292
+ visibleRowIndexById
2293
+ );
2294
+ if (!visibleItem) return;
2295
+ focusSearchResult(visibleItem[0], visibleItem[1]);
2296
+ },
2297
+ [
2298
+ expandedRows,
2299
+ focusSearchResult,
2300
+ handleExpandedRowsChange,
2301
+ visibleRowIndexById
2302
+ ]
2303
+ );
2304
+ (0, import_react5.useEffect)(() => {
2305
+ const pending = pendingSearchNavRef.current;
2306
+ if (!pending) return;
2307
+ const visibleRowIndex = visibleRowIndexById.get(pending.rowId);
2308
+ if (visibleRowIndex === void 0) return;
2309
+ pendingSearchNavRef.current = null;
2310
+ focusSearchResult(pending.colIndex, visibleRowIndex);
2311
+ }, [focusSearchResult, rows, visibleRowIndexById]);
2312
+ const initialSearchStartRow = virtualRows[0]?.index ?? 0;
2313
+ const inlineSearch = useInlineSearch({
2314
+ enabled: enableInlineSearch,
2315
+ rowCount: searchCorpus.length,
2316
+ columnCount: visibleLeafColumns.length,
2317
+ getCellValue: getSearchCellValue,
2318
+ initialStartRow: initialSearchStartRow,
2319
+ showSearch,
2320
+ searchValue,
2321
+ searchResults,
2322
+ onSearchValueChange,
2323
+ onSearchClose,
2324
+ onSearchResultsChanged,
2325
+ onNavigateToResult: navigateToCorpusSearchResult,
2326
+ rootRef
2327
+ });
2328
+ const visibleSearchMatchKeys = (0, import_react5.useMemo)(() => {
2329
+ if (!enableInlineSearch) return EMPTY_SEARCH_MATCH_KEYS;
2330
+ return mapSearchResultsToVisibleKeys(
2331
+ inlineSearch.searchResults,
2332
+ searchCorpus,
2333
+ visibleRowIndexById
2334
+ );
2335
+ }, [
2336
+ enableInlineSearch,
2337
+ inlineSearch.searchResults,
2338
+ searchCorpus,
2339
+ visibleRowIndexById
2340
+ ]);
2341
+ const visibleActiveMatch = (0, import_react5.useMemo)(() => {
2342
+ if (!enableInlineSearch || !inlineSearch.activeMatch) return null;
2343
+ return mapSearchResultToVisibleItem(
2344
+ inlineSearch.activeMatch,
2345
+ searchCorpus,
2346
+ visibleRowIndexById
2347
+ );
2348
+ }, [
2349
+ enableInlineSearch,
2350
+ inlineSearch.activeMatch,
2351
+ searchCorpus,
2352
+ visibleRowIndexById
2353
+ ]);
2354
+ const clearHover = (0, import_react5.useCallback)(() => {
1570
2355
  setHoveredRowIndex(null);
1571
2356
  }, []);
1572
- const handleRowHover = (0, import_react4.useCallback)((rowIndex, _rowData) => {
2357
+ const handleRowHover = (0, import_react5.useCallback)((rowIndex, _rowData) => {
1573
2358
  setHoveredRowIndex(rowIndex);
1574
2359
  }, []);
1575
- const handleToggleSelect = (0, import_react4.useCallback)(
2360
+ const handleToggleSelect = (0, import_react5.useCallback)(
1576
2361
  (row) => {
1577
2362
  if (!row.getCanSelect()) return;
1578
2363
  if (preserveRowSelection && row.getIsSelected()) {
@@ -1582,14 +2367,14 @@ function useGlideTable(options) {
1582
2367
  },
1583
2368
  [preserveRowSelection]
1584
2369
  );
1585
- const handleToggleExpand = (0, import_react4.useCallback)(
2370
+ const handleToggleExpand = (0, import_react5.useCallback)(
1586
2371
  (rowKey) => {
1587
2372
  if (preventExpand) return;
1588
2373
  handleExpandedRowsChange(toggleExpandedRowId(rowKey, expandedRows));
1589
2374
  },
1590
2375
  [preventExpand, handleExpandedRowsChange, expandedRows]
1591
2376
  );
1592
- const rowContextValue = (0, import_react4.useMemo)(() => {
2377
+ const rowContextValue = (0, import_react5.useMemo)(() => {
1593
2378
  return {
1594
2379
  rowSpan: {
1595
2380
  enableRowSpan,
@@ -1637,6 +2422,11 @@ function useGlideTable(options) {
1637
2422
  columnFreeze: {
1638
2423
  enableColumnFreeze,
1639
2424
  offsets: columnFreezeOffsets
2425
+ },
2426
+ inlineSearch: {
2427
+ enabled: enableInlineSearch,
2428
+ matchKeys: visibleSearchMatchKeys,
2429
+ activeMatch: visibleActiveMatch
1640
2430
  }
1641
2431
  };
1642
2432
  }, [
@@ -1672,14 +2462,17 @@ function useGlideTable(options) {
1672
2462
  labels.collapseRow,
1673
2463
  enableColumnResize,
1674
2464
  enableColumnFreeze,
1675
- columnFreezeOffsets
2465
+ columnFreezeOffsets,
2466
+ enableInlineSearch,
2467
+ visibleSearchMatchKeys,
2468
+ visibleActiveMatch
1676
2469
  ]);
1677
- const copySelectionRef = (0, import_react4.useRef)(copySelection);
1678
- (0, import_react4.useEffect)(() => {
2470
+ const copySelectionRef = (0, import_react5.useRef)(copySelection);
2471
+ (0, import_react5.useEffect)(() => {
1679
2472
  copySelectionRef.current = copySelection;
1680
2473
  }, [copySelection]);
1681
- const stableCopySelection = (0, import_react4.useCallback)((options2) => copySelectionRef.current(options2), []);
1682
- (0, import_react4.useEffect)(() => {
2474
+ const stableCopySelection = (0, import_react5.useCallback)((options2) => copySelectionRef.current(options2), []);
2475
+ (0, import_react5.useEffect)(() => {
1683
2476
  onCopyActionsReady?.({ copySelection: stableCopySelection });
1684
2477
  }, [onCopyActionsReady, stableCopySelection]);
1685
2478
  return {
@@ -1695,8 +2488,10 @@ function useGlideTable(options) {
1695
2488
  enableCellSelection,
1696
2489
  enableColumnResize,
1697
2490
  enableColumnFreeze,
2491
+ enableInlineSearch,
1698
2492
  shouldVirtualize,
1699
2493
  scrollRef,
2494
+ rootRef,
1700
2495
  rowVirtualizer,
1701
2496
  virtualRows,
1702
2497
  paddingTop,
@@ -1704,7 +2499,21 @@ function useGlideTable(options) {
1704
2499
  rowContextValue,
1705
2500
  handleToggleSelect,
1706
2501
  clearHover,
1707
- copySelection: stableCopySelection
2502
+ copySelection: stableCopySelection,
2503
+ inlineSearch: {
2504
+ showSearch: inlineSearch.showSearch,
2505
+ searchValue: inlineSearch.searchValue,
2506
+ searchStatus: inlineSearch.searchStatus,
2507
+ searchInputRef: inlineSearch.searchInputRef,
2508
+ searchInputId: inlineSearch.searchInputId,
2509
+ canClose: inlineSearch.canClose,
2510
+ searchRowCount: searchCorpus.length,
2511
+ setSearchValue: inlineSearch.setSearchValue,
2512
+ closeSearch: inlineSearch.closeSearch,
2513
+ goToNext: inlineSearch.goToNext,
2514
+ goToPrevious: inlineSearch.goToPrevious,
2515
+ openSearch: inlineSearch.openSearch
2516
+ }
1708
2517
  };
1709
2518
  }
1710
2519
 
@@ -1723,18 +2532,18 @@ function getColumnSizeStyle(size, options) {
1723
2532
 
1724
2533
  // src/components/ui/table/components/DataTable/DataTable.tsx
1725
2534
  var import_react_table3 = require("@tanstack/react-table");
1726
- var import_react7 = require("react");
2535
+ var import_react8 = require("react");
1727
2536
 
1728
2537
  // src/components/ui/table/components/DataTable/DataTableRow.tsx
1729
2538
  var import_react_table2 = require("@tanstack/react-table");
1730
- var import_react6 = require("react");
2539
+ var import_react7 = require("react");
1731
2540
 
1732
2541
  // src/components/ui/table/DataTableContext.tsx
1733
- var import_react5 = require("react");
2542
+ var import_react6 = require("react");
1734
2543
  var import_jsx_runtime = require("react/jsx-runtime");
1735
- var DataTableContext = (0, import_react5.createContext)(null);
2544
+ var DataTableContext = (0, import_react6.createContext)(null);
1736
2545
  function useDataTableRowContext() {
1737
- const context = (0, import_react5.use)(DataTableContext);
2546
+ const context = (0, import_react6.use)(DataTableContext);
1738
2547
  if (!context) {
1739
2548
  throw new Error("useDataTableRowContext must be used within a DataTableContextProvider");
1740
2549
  }
@@ -1935,10 +2744,16 @@ function DataTableRow({
1935
2744
  cellEdit,
1936
2745
  expand,
1937
2746
  columnResize,
1938
- columnFreeze
2747
+ columnFreeze,
2748
+ inlineSearch
1939
2749
  } = useDataTableRowContext();
1940
2750
  const { enableColumnResize } = columnResize;
1941
2751
  const { enableColumnFreeze, offsets: freezeOffsets } = columnFreeze;
2752
+ const {
2753
+ enabled: enableInlineSearch,
2754
+ matchKeys: searchMatchKeys,
2755
+ activeMatch
2756
+ } = inlineSearch;
1942
2757
  const {
1943
2758
  enableRowSpan,
1944
2759
  primaryRowSpanColumnId,
@@ -2032,9 +2847,9 @@ function DataTableRow({
2032
2847
  const expandKey = toggleField && rowData[toggleField] !== null && rowData[toggleField] !== void 0 ? String(rowData[toggleField]) : null;
2033
2848
  const isExpanded = expandKey !== null && Boolean(expandedRows?.has(expandKey));
2034
2849
  const rowLevel = typeof rowData.level === "number" ? rowData.level : 0;
2035
- const editInputRef = (0, import_react6.useRef)(null);
2850
+ const editInputRef = (0, import_react7.useRef)(null);
2036
2851
  const isRowEditing = editingCell?.rowIndex === rowIndex;
2037
- (0, import_react6.useEffect)(() => {
2852
+ (0, import_react7.useEffect)(() => {
2038
2853
  if (!isRowEditing) return;
2039
2854
  editInputRef.current?.focus();
2040
2855
  editInputRef.current?.select();
@@ -2130,17 +2945,25 @@ function DataTableRow({
2130
2945
  ...freezeStyle,
2131
2946
  ...selectionEdgeStyle
2132
2947
  };
2948
+ const searchMatchKey = buildSearchMatchKey(cellIndex, rowIndex);
2949
+ const isSearchMatch = enableInlineSearch && searchMatchKeys.has(searchMatchKey);
2950
+ const isSearchActive = isSearchMatch && activeMatch !== null && activeMatch[0] === cellIndex && activeMatch[1] === rowIndex;
2133
2951
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2134
2952
  "td",
2135
2953
  {
2954
+ "data-row-index": rowIndex,
2955
+ "data-col-index": cellIndex,
2136
2956
  rowSpan: rowSpanInfo && rowSpanInfo.rowSpan > 1 ? rowSpanInfo.rowSpan : void 0,
2137
2957
  "data-merged": isMerged && cellIndex > 0 ? "" : void 0,
2138
2958
  "data-merged-edge-right": showMergedRightEdge ? "" : void 0,
2139
2959
  "data-merged-row-first": isMerged && cellIndex === 0 && showMergedRightEdge ? "" : void 0,
2960
+ "data-selected": !enableRowSpan && showCellSelected ? "" : void 0,
2140
2961
  "data-group-selected": enableRowSpan && showCellSelected ? "" : void 0,
2141
2962
  "data-group-hovered": enableRowSpan && showCellHover && !showCellSelected ? "" : void 0,
2142
2963
  "data-selection-fill": isCellDragSelected ? "" : void 0,
2143
2964
  "data-selection-edges": hasSelectionEdges ? "" : void 0,
2965
+ "data-search-match": isSearchMatch ? "" : void 0,
2966
+ "data-search-active": isSearchActive ? "" : void 0,
2144
2967
  "data-editable": editable ? "" : void 0,
2145
2968
  "data-editing": isEditing ? "" : void 0,
2146
2969
  "data-frozen": freezeOffset?.side,
@@ -2155,7 +2978,8 @@ function DataTableRow({
2155
2978
  event.preventDefault();
2156
2979
  onCellMouseDown(
2157
2980
  resolveCellRowIndex(event.clientY, event.currentTarget),
2158
- cellIndex
2981
+ cellIndex,
2982
+ { shiftKey: event.shiftKey }
2159
2983
  );
2160
2984
  },
2161
2985
  onMouseEnter: (event) => {
@@ -2192,6 +3016,8 @@ function DataTableRow({
2192
3016
  enableRowSpan && showCellHover && !showCellSelected && "is-group-hovered",
2193
3017
  isCellDragSelected && CELL_SELECTION_FILL_CLASS,
2194
3018
  hasSelectionEdges && CELL_SELECTION_EDGES_CLASS,
3019
+ isSearchMatch && "is-search-match",
3020
+ isSearchActive && "is-search-active",
2195
3021
  editable && "is-editable",
2196
3022
  classNames?.cell
2197
3023
  ),
@@ -2326,8 +3152,169 @@ function DataTableRow({
2326
3152
  );
2327
3153
  }
2328
3154
 
2329
- // src/components/ui/table/components/DataTable/DataTableToolbar.tsx
3155
+ // src/components/ui/table/components/DataTable/DataTableSearch.tsx
2330
3156
  var import_jsx_runtime4 = require("react/jsx-runtime");
3157
+ function SearchCloseIcon({ className }) {
3158
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
3159
+ "svg",
3160
+ {
3161
+ className,
3162
+ "aria-hidden": true,
3163
+ width: "16",
3164
+ height: "16",
3165
+ viewBox: "0 0 24 24",
3166
+ fill: "none",
3167
+ stroke: "currentColor",
3168
+ strokeWidth: "2",
3169
+ strokeLinecap: "round",
3170
+ strokeLinejoin: "round",
3171
+ children: [
3172
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M18 6 6 18" }),
3173
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "m6 6 12 12" })
3174
+ ]
3175
+ }
3176
+ );
3177
+ }
3178
+ function DataTableSearch({
3179
+ showSearch,
3180
+ searchValue,
3181
+ searchStatus,
3182
+ searchInputId,
3183
+ searchInputRef,
3184
+ canClose,
3185
+ placeholder,
3186
+ resultHint,
3187
+ previousLabel,
3188
+ nextLabel,
3189
+ closeLabel,
3190
+ rowsTotal,
3191
+ classNames,
3192
+ onSearchValueChange,
3193
+ onClose,
3194
+ onNext,
3195
+ onPrevious
3196
+ }) {
3197
+ if (!showSearch) return null;
3198
+ const resultString = searchStatus ? formatSearchResultLabel(searchStatus) : resultHint;
3199
+ const progress = rowsTotal > 0 ? Math.floor((searchStatus?.rowsSearched ?? 0) / rowsTotal * 100) : 0;
3200
+ const handleKeyDown = (event) => {
3201
+ if ((event.ctrlKey || event.metaKey) && event.code === "KeyF" || event.key === "Escape") {
3202
+ event.preventDefault();
3203
+ event.stopPropagation();
3204
+ if (canClose) {
3205
+ onClose();
3206
+ }
3207
+ return;
3208
+ }
3209
+ if (event.key === "ArrowDown" || event.key === "Enter" && !event.shiftKey) {
3210
+ event.preventDefault();
3211
+ onNext();
3212
+ return;
3213
+ }
3214
+ if (event.key === "ArrowUp" || event.key === "Enter" && event.shiftKey) {
3215
+ event.preventDefault();
3216
+ onPrevious();
3217
+ }
3218
+ };
3219
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
3220
+ "div",
3221
+ {
3222
+ className: cn("data-table-search", classNames?.search),
3223
+ role: "search",
3224
+ onMouseDown: (event) => event.stopPropagation(),
3225
+ children: [
3226
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "data-table-search-row", children: [
3227
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3228
+ "input",
3229
+ {
3230
+ ref: searchInputRef,
3231
+ id: searchInputId,
3232
+ type: "search",
3233
+ value: searchValue,
3234
+ placeholder,
3235
+ autoComplete: "off",
3236
+ spellCheck: false,
3237
+ "aria-label": placeholder,
3238
+ className: cn("data-table-search-input", classNames?.searchInput),
3239
+ onChange: (event) => onSearchValueChange(event.target.value),
3240
+ onKeyDown: handleKeyDown
3241
+ }
3242
+ ),
3243
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3244
+ "button",
3245
+ {
3246
+ type: "button",
3247
+ "aria-label": previousLabel,
3248
+ className: cn("data-table-search-button", classNames?.searchButton),
3249
+ onClick: (event) => {
3250
+ event.stopPropagation();
3251
+ onPrevious();
3252
+ },
3253
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ChevronUp, { className: "data-table-search-icon" })
3254
+ }
3255
+ ),
3256
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3257
+ "button",
3258
+ {
3259
+ type: "button",
3260
+ "aria-label": nextLabel,
3261
+ className: cn("data-table-search-button", classNames?.searchButton),
3262
+ onClick: (event) => {
3263
+ event.stopPropagation();
3264
+ onNext();
3265
+ },
3266
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ChevronDown, { className: "data-table-search-icon" })
3267
+ }
3268
+ ),
3269
+ canClose ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3270
+ "button",
3271
+ {
3272
+ type: "button",
3273
+ "aria-label": closeLabel,
3274
+ className: cn("data-table-search-button", classNames?.searchButton),
3275
+ onClick: (event) => {
3276
+ event.stopPropagation();
3277
+ onClose();
3278
+ },
3279
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SearchCloseIcon, { className: "data-table-search-icon" })
3280
+ }
3281
+ ) : null
3282
+ ] }),
3283
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3284
+ "div",
3285
+ {
3286
+ className: cn("data-table-search-status", classNames?.searchStatus),
3287
+ "aria-live": "polite",
3288
+ children: resultString
3289
+ }
3290
+ ),
3291
+ searchStatus !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3292
+ "div",
3293
+ {
3294
+ className: cn(
3295
+ "data-table-search-progress",
3296
+ classNames?.searchProgress
3297
+ ),
3298
+ role: "progressbar",
3299
+ "aria-valuemin": 0,
3300
+ "aria-valuemax": 100,
3301
+ "aria-valuenow": progress,
3302
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3303
+ "div",
3304
+ {
3305
+ className: "data-table-search-progress-bar",
3306
+ style: { width: `${progress}%` }
3307
+ }
3308
+ )
3309
+ }
3310
+ ) : null
3311
+ ]
3312
+ }
3313
+ );
3314
+ }
3315
+
3316
+ // src/components/ui/table/components/DataTable/DataTableToolbar.tsx
3317
+ var import_jsx_runtime5 = require("react/jsx-runtime");
2331
3318
  function DataTableToolbar({
2332
3319
  filteredCount,
2333
3320
  totalCount,
@@ -2345,39 +3332,39 @@ function DataTableToolbar({
2345
3332
  const selectionContent = selectionLabel?.(selectedCount) ?? null;
2346
3333
  const hasSelectionContent = selectionContent !== null && selectionContent !== false && selectionContent !== void 0 && typeof selectionContent !== "boolean";
2347
3334
  if (!hasLeftContent && !hasToolbar && !hasSelectionContent) return null;
2348
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: cn("DataTableToolbarJSX", classNames?.toolbar, className), children: [
2349
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: cn("toolbar-left", classNames?.toolbarLeft), children: [
2350
- hasCount && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: cn("toolbar-count", classNames?.toolbarCount), children: displayFiltered !== void 0 && totalCount !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
2351
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "toolbar-count-primary", children: displayFiltered }),
2352
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "toolbar-count-placeholder", children: [
3335
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: cn("DataTableToolbarJSX", classNames?.toolbar, className), children: [
3336
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: cn("toolbar-left", classNames?.toolbarLeft), children: [
3337
+ hasCount && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: cn("toolbar-count", classNames?.toolbarCount), children: displayFiltered !== void 0 && totalCount !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
3338
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "toolbar-count-primary", children: displayFiltered }),
3339
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "toolbar-count-placeholder", children: [
2353
3340
  " / ",
2354
3341
  totalCount
2355
3342
  ] })
2356
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "toolbar-count-primary", children: displayFiltered ?? totalCount }) }),
3343
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "toolbar-count-primary", children: displayFiltered ?? totalCount }) }),
2357
3344
  summary
2358
3345
  ] }),
2359
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: cn("toolbar-right", classNames?.toolbarRight), children: [
2360
- hasSelectionContent && (typeof selectionContent === "string" || typeof selectionContent === "number" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: cn("toolbar-selection", classNames?.toolbarSelection), children: selectionContent }) : selectionContent),
2361
- hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: cn("toolbar-actions", classNames?.toolbarActions), children: toolbar })
3346
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: cn("toolbar-right", classNames?.toolbarRight), children: [
3347
+ hasSelectionContent && (typeof selectionContent === "string" || typeof selectionContent === "number" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: cn("toolbar-selection", classNames?.toolbarSelection), children: selectionContent }) : selectionContent),
3348
+ hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: cn("toolbar-actions", classNames?.toolbarActions), children: toolbar })
2362
3349
  ] })
2363
3350
  ] });
2364
3351
  }
2365
3352
 
2366
3353
  // src/components/ui/table/components/DataTable/DataTable.tsx
2367
- var import_jsx_runtime5 = require("react/jsx-runtime");
3354
+ var import_jsx_runtime6 = require("react/jsx-runtime");
2368
3355
  function DefaultScroll({
2369
3356
  scrollRef,
2370
3357
  children,
2371
3358
  className
2372
3359
  }) {
2373
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref: scrollRef, className: cn("data-table-scroll", className), children });
3360
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { ref: scrollRef, className: cn("data-table-scroll", className), children });
2374
3361
  }
2375
3362
  function DefaultPending({
2376
3363
  loadingText,
2377
3364
  className,
2378
3365
  classNames
2379
3366
  }) {
2380
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3367
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2381
3368
  "div",
2382
3369
  {
2383
3370
  className: cn(
@@ -2387,7 +3374,7 @@ function DefaultPending({
2387
3374
  classNames?.pending,
2388
3375
  className
2389
3376
  ),
2390
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: cn("data-table-loading-text", classNames?.loadingText), children: loadingText })
3377
+ children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: cn("data-table-loading-text", classNames?.loadingText), children: loadingText })
2391
3378
  }
2392
3379
  );
2393
3380
  }
@@ -2396,7 +3383,7 @@ function DefaultEmpty({
2396
3383
  columnCount,
2397
3384
  classNames
2398
3385
  }) {
2399
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3386
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2400
3387
  "td",
2401
3388
  {
2402
3389
  colSpan: columnCount,
@@ -2429,15 +3416,18 @@ function DataTable({
2429
3416
  enableCellSelection,
2430
3417
  enableColumnResize,
2431
3418
  enableColumnFreeze,
3419
+ enableInlineSearch,
2432
3420
  shouldVirtualize,
2433
3421
  scrollRef,
3422
+ rootRef,
2434
3423
  rowVirtualizer,
2435
3424
  virtualRows,
2436
3425
  paddingTop,
2437
3426
  paddingBottom,
2438
3427
  rowContextValue,
2439
3428
  handleToggleSelect,
2440
- clearHover
3429
+ clearHover,
3430
+ inlineSearch
2441
3431
  } = useGlideTable(glideOptions);
2442
3432
  const ToolbarSlot = slots?.Toolbar ?? DataTableToolbar;
2443
3433
  const ScrollSlot = slots?.Scroll ?? DefaultScroll;
@@ -2445,12 +3435,12 @@ function DataTable({
2445
3435
  const PendingSlot = slots?.Pending ?? DefaultPending;
2446
3436
  const EmptySlot = slots?.Empty ?? DefaultEmpty;
2447
3437
  const freezeOffsets = rowContextValue.columnFreeze.offsets;
2448
- const contextValue = (0, import_react7.useMemo)(
3438
+ const contextValue = (0, import_react8.useMemo)(
2449
3439
  () => ({ ...rowContextValue, classNames }),
2450
3440
  [rowContextValue, classNames]
2451
3441
  );
2452
3442
  if (isPending) {
2453
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3443
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2454
3444
  PendingSlot,
2455
3445
  {
2456
3446
  loadingText,
@@ -2459,19 +3449,21 @@ function DataTable({
2459
3449
  }
2460
3450
  );
2461
3451
  }
2462
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
3452
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
2463
3453
  "div",
2464
3454
  {
3455
+ ref: rootRef,
2465
3456
  className: cn(
2466
3457
  "DataTableJSX",
2467
3458
  !enableCellSelection && "DataTableJSX--no-cell-selection",
2468
3459
  enableColumnResize && "DataTableJSX--column-resize",
2469
3460
  enableColumnFreeze && "DataTableJSX--column-freeze",
3461
+ enableInlineSearch && "DataTableJSX--inline-search",
2470
3462
  classNames?.root,
2471
3463
  className
2472
3464
  ),
2473
3465
  children: [
2474
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3466
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2475
3467
  ToolbarSlot,
2476
3468
  {
2477
3469
  filteredCount: filteredCount ?? tableData.length,
@@ -2483,14 +3475,36 @@ function DataTable({
2483
3475
  classNames
2484
3476
  }
2485
3477
  ),
2486
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ScrollSlot, { scrollRef, className: classNames?.scroll, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
3478
+ enableInlineSearch ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
3479
+ DataTableSearch,
3480
+ {
3481
+ showSearch: inlineSearch.showSearch,
3482
+ searchValue: inlineSearch.searchValue,
3483
+ searchStatus: inlineSearch.searchStatus,
3484
+ searchInputId: inlineSearch.searchInputId,
3485
+ searchInputRef: inlineSearch.searchInputRef,
3486
+ canClose: inlineSearch.canClose,
3487
+ placeholder: labels.searchPlaceholder,
3488
+ resultHint: labels.searchResultHint,
3489
+ previousLabel: labels.searchPrevious,
3490
+ nextLabel: labels.searchNext,
3491
+ closeLabel: labels.searchClose,
3492
+ rowsTotal: inlineSearch.searchRowCount,
3493
+ classNames,
3494
+ onSearchValueChange: inlineSearch.setSearchValue,
3495
+ onClose: inlineSearch.closeSearch,
3496
+ onNext: inlineSearch.goToNext,
3497
+ onPrevious: inlineSearch.goToPrevious
3498
+ }
3499
+ ) : null,
3500
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ScrollSlot, { scrollRef, className: classNames?.scroll, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
2487
3501
  "table",
2488
3502
  {
2489
3503
  className: cn("data-table", classNames?.table),
2490
3504
  style: enableColumnResize ? { width: table.getTotalSize() } : void 0,
2491
3505
  onDragStart: enableCellSelection ? (event) => event.preventDefault() : void 0,
2492
3506
  children: [
2493
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("thead", { className: cn("data-table-head", classNames?.head), children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3507
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("thead", { className: cn("data-table-head", classNames?.head), children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2494
3508
  "tr",
2495
3509
  {
2496
3510
  className: cn("data-table-head-row", classNames?.headRow),
@@ -2510,7 +3524,7 @@ function DataTable({
2510
3524
  ...sizeStyle,
2511
3525
  ...freezeStyle
2512
3526
  };
2513
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
3527
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
2514
3528
  "th",
2515
3529
  {
2516
3530
  "data-resizing": header.column.getIsResizing() ? "" : void 0,
@@ -2526,7 +3540,7 @@ function DataTable({
2526
3540
  ),
2527
3541
  children: [
2528
3542
  header.isPlaceholder ? null : (0, import_react_table3.flexRender)(header.column.columnDef.header, header.getContext()),
2529
- canResize ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3543
+ canResize ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2530
3544
  "div",
2531
3545
  {
2532
3546
  role: "separator",
@@ -2552,20 +3566,20 @@ function DataTable({
2552
3566
  },
2553
3567
  headerGroup.id
2554
3568
  )) }),
2555
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DataTableContextProvider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3569
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DataTableContextProvider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2556
3570
  "tbody",
2557
3571
  {
2558
3572
  onMouseLeave: clearHover,
2559
3573
  className: cn("data-table-body", classNames?.body),
2560
- children: rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3574
+ children: rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2561
3575
  EmptySlot,
2562
3576
  {
2563
3577
  emptyText,
2564
3578
  columnCount,
2565
3579
  classNames
2566
3580
  }
2567
- ) : shouldVirtualize ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
2568
- paddingTop > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3581
+ ) : shouldVirtualize ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
3582
+ paddingTop > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2569
3583
  "tr",
2570
3584
  {
2571
3585
  "aria-hidden": true,
@@ -2573,7 +3587,7 @@ function DataTable({
2573
3587
  "data-table-virtual-spacer",
2574
3588
  classNames?.virtualSpacer
2575
3589
  ),
2576
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3590
+ children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2577
3591
  "td",
2578
3592
  {
2579
3593
  colSpan: columnCount,
@@ -2589,7 +3603,7 @@ function DataTable({
2589
3603
  virtualRows.map((virtualRow) => {
2590
3604
  const row = rows[virtualRow.index];
2591
3605
  if (!row) return null;
2592
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3606
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2593
3607
  RowSlot,
2594
3608
  {
2595
3609
  row,
@@ -2600,7 +3614,7 @@ function DataTable({
2600
3614
  row.id
2601
3615
  );
2602
3616
  }),
2603
- paddingBottom > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3617
+ paddingBottom > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2604
3618
  "tr",
2605
3619
  {
2606
3620
  "aria-hidden": true,
@@ -2608,7 +3622,7 @@ function DataTable({
2608
3622
  "data-table-virtual-spacer",
2609
3623
  classNames?.virtualSpacer
2610
3624
  ),
2611
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3625
+ children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2612
3626
  "td",
2613
3627
  {
2614
3628
  colSpan: columnCount,
@@ -2621,7 +3635,7 @@ function DataTable({
2621
3635
  )
2622
3636
  }
2623
3637
  )
2624
- ] }) : rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3638
+ ] }) : rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
2625
3639
  RowSlot,
2626
3640
  {
2627
3641
  row,
@@ -2640,10 +3654,10 @@ function DataTable({
2640
3654
  }
2641
3655
 
2642
3656
  // src/components/ui/table/components/Table/Table.tsx
2643
- var import_react10 = require("react");
3657
+ var import_react11 = require("react");
2644
3658
 
2645
3659
  // src/components/ui/table/components/Table/buildColumnDef.tsx
2646
- var import_jsx_runtime6 = require("react/jsx-runtime");
3660
+ var import_jsx_runtime7 = require("react/jsx-runtime");
2647
3661
  function SortableHeader({
2648
3662
  label,
2649
3663
  field,
@@ -2652,15 +3666,15 @@ function SortableHeader({
2652
3666
  }) {
2653
3667
  const isActive = sort?.field === field;
2654
3668
  const Icon = isActive ? sort.direction === "asc" ? ArrowUp : ArrowDown : ArrowUpDown;
2655
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
3669
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
2656
3670
  "button",
2657
3671
  {
2658
3672
  type: "button",
2659
3673
  className: cn("SortableHeaderJSX", isActive ? "is-active" : "is-inactive"),
2660
3674
  onClick: () => onSort(field),
2661
3675
  children: [
2662
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { children: label }),
2663
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: "sortable-header-icon" })
3676
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: label }),
3677
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { className: "sortable-header-icon" })
2664
3678
  ]
2665
3679
  }
2666
3680
  );
@@ -2693,7 +3707,7 @@ function buildColumnDef(props, sort, onSort) {
2693
3707
  ...minWidth != null ? { minSize: minWidth } : {},
2694
3708
  ...maxWidth != null ? { maxSize: maxWidth } : {},
2695
3709
  ...resizable === false ? { enableResizing: false } : {},
2696
- header: sortable ? () => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SortableHeader, { label: children, field, sort, onSort }) : (
3710
+ header: sortable ? () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SortableHeader, { label: children, field, sort, onSort }) : (
2697
3711
  // eslint-disable-next-line @typescript-eslint/promise-function-async
2698
3712
  () => children
2699
3713
  ),
@@ -2720,10 +3734,10 @@ function buildColumnDef(props, sort, onSort) {
2720
3734
  }
2721
3735
 
2722
3736
  // src/components/ui/table/components/Table/parseTableChildren.ts
2723
- var import_react9 = require("react");
3737
+ var import_react10 = require("react");
2724
3738
 
2725
3739
  // src/components/ui/table/components/Table/tableChildTypes.ts
2726
- var import_react8 = require("react");
3740
+ var import_react9 = require("react");
2727
3741
  var TABLE_HEADER_DISPLAY_NAME = "Table.Header";
2728
3742
  var TABLE_BODY_DISPLAY_NAME = "Table.Body";
2729
3743
  var TABLE_COLUMN_DISPLAY_NAME = "Table.Column";
@@ -2735,16 +3749,16 @@ function getComponentDisplayName(type) {
2735
3749
  return void 0;
2736
3750
  }
2737
3751
  function isTableHeaderElement(child) {
2738
- return (0, import_react8.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_HEADER_DISPLAY_NAME;
3752
+ return (0, import_react9.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_HEADER_DISPLAY_NAME;
2739
3753
  }
2740
3754
  function isTableBodyElement(child) {
2741
- return (0, import_react8.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_BODY_DISPLAY_NAME;
3755
+ return (0, import_react9.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_BODY_DISPLAY_NAME;
2742
3756
  }
2743
3757
  function isTableColumnElement(child) {
2744
- return (0, import_react8.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_COLUMN_DISPLAY_NAME;
3758
+ return (0, import_react9.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_COLUMN_DISPLAY_NAME;
2745
3759
  }
2746
3760
  function isTablePaginationElement(child) {
2747
- return (0, import_react8.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_PAGINATION_DISPLAY_NAME;
3761
+ return (0, import_react9.isValidElement)(child) && getComponentDisplayName(child.type) === TABLE_PAGINATION_DISPLAY_NAME;
2748
3762
  }
2749
3763
 
2750
3764
  // src/components/ui/table/components/Table/parseTableChildren.ts
@@ -2754,7 +3768,7 @@ function parseTableChildren(children) {
2754
3768
  body: null,
2755
3769
  pagination: null
2756
3770
  };
2757
- for (const child of import_react9.Children.toArray(children)) {
3771
+ for (const child of import_react10.Children.toArray(children)) {
2758
3772
  if (isTableHeaderElement(child)) {
2759
3773
  slots.header = child;
2760
3774
  continue;
@@ -2771,12 +3785,12 @@ function parseTableChildren(children) {
2771
3785
  }
2772
3786
  function flattenColumnElements(children) {
2773
3787
  const result = [];
2774
- for (const child of import_react9.Children.toArray(children)) {
3788
+ for (const child of import_react10.Children.toArray(children)) {
2775
3789
  if (isTableColumnElement(child)) {
2776
3790
  result.push(child);
2777
3791
  continue;
2778
3792
  }
2779
- if ((0, import_react9.isValidElement)(child)) {
3793
+ if ((0, import_react10.isValidElement)(child)) {
2780
3794
  const nested = child.props.children;
2781
3795
  if (nested != null) {
2782
3796
  result.push(...flattenColumnElements(nested));
@@ -2841,7 +3855,7 @@ function TableHeader(props) {
2841
3855
  TableHeader.displayName = TABLE_HEADER_DISPLAY_NAME;
2842
3856
 
2843
3857
  // src/components/ui/table/components/Table/TablePagination.tsx
2844
- var import_jsx_runtime7 = require("react/jsx-runtime");
3858
+ var import_jsx_runtime8 = require("react/jsx-runtime");
2845
3859
  function TablePagination({
2846
3860
  page,
2847
3861
  pageSize = 10,
@@ -2853,8 +3867,8 @@ function TablePagination({
2853
3867
  const safePage = Math.min(Math.max(1, page), totalPages);
2854
3868
  const canGoPrev = safePage > 1;
2855
3869
  const canGoNext = safePage < totalPages;
2856
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cn("TablePaginationJSX", className), children: [
2857
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
3870
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cn("TablePaginationJSX", className), children: [
3871
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2858
3872
  "button",
2859
3873
  {
2860
3874
  type: "button",
@@ -2862,15 +3876,15 @@ function TablePagination({
2862
3876
  disabled: !canGoPrev,
2863
3877
  onClick: () => onChange(safePage - 1),
2864
3878
  "aria-label": "Previous page",
2865
- children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ChevronLeft, { className: "pagination-button-icon" })
3879
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ChevronLeft, { className: "pagination-button-icon" })
2866
3880
  }
2867
3881
  ),
2868
- /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "pagination-label", children: [
3882
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "pagination-label", children: [
2869
3883
  safePage,
2870
3884
  " / ",
2871
3885
  totalPages
2872
3886
  ] }),
2873
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
3887
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2874
3888
  "button",
2875
3889
  {
2876
3890
  type: "button",
@@ -2878,7 +3892,7 @@ function TablePagination({
2878
3892
  disabled: !canGoNext,
2879
3893
  onClick: () => onChange(safePage + 1),
2880
3894
  "aria-label": "Next page",
2881
- children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ChevronRight, { className: "pagination-button-icon" })
3895
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ChevronRight, { className: "pagination-button-icon" })
2882
3896
  }
2883
3897
  )
2884
3898
  ] });
@@ -2886,7 +3900,7 @@ function TablePagination({
2886
3900
  TablePagination.displayName = TABLE_PAGINATION_DISPLAY_NAME;
2887
3901
 
2888
3902
  // src/components/ui/table/components/Table/Table.tsx
2889
- var import_jsx_runtime8 = require("react/jsx-runtime");
3903
+ var import_jsx_runtime9 = require("react/jsx-runtime");
2890
3904
  function TableRoot({
2891
3905
  data,
2892
3906
  children,
@@ -2895,12 +3909,12 @@ function TableRoot({
2895
3909
  filteredCount,
2896
3910
  ...dataTableProps
2897
3911
  }) {
2898
- const { header, pagination: paginationElement } = (0, import_react10.useMemo)(
3912
+ const { header, pagination: paginationElement } = (0, import_react11.useMemo)(
2899
3913
  () => parseTableChildren(children),
2900
3914
  [children]
2901
3915
  );
2902
- const [sort, setSort] = (0, import_react10.useState)(null);
2903
- const handleSort = (0, import_react10.useCallback)((field) => {
3916
+ const [sort, setSort] = (0, import_react11.useState)(null);
3917
+ const handleSort = (0, import_react11.useCallback)((field) => {
2904
3918
  setSort((previous) => {
2905
3919
  if (previous?.field !== field) {
2906
3920
  return { field, direction: "asc" };
@@ -2911,7 +3925,7 @@ function TableRoot({
2911
3925
  return null;
2912
3926
  });
2913
3927
  }, []);
2914
- const columns = (0, import_react10.useMemo)(() => {
3928
+ const columns = (0, import_react11.useMemo)(() => {
2915
3929
  return extractColumnElements(header).map(
2916
3930
  (columnElement) => buildColumnDef(columnElement.props, sort, handleSort)
2917
3931
  );
@@ -2920,7 +3934,7 @@ function TableRoot({
2920
3934
  const pageSize = paginationProps?.pageSize ?? 10;
2921
3935
  const page = paginationProps?.page ?? 1;
2922
3936
  const resolvedTotalCount = paginationProps?.totalCount ?? totalCount ?? data.length;
2923
- const tableData = (0, import_react10.useMemo)(() => {
3937
+ const tableData = (0, import_react11.useMemo)(() => {
2924
3938
  const sortedData = sortTableData(data, sort);
2925
3939
  if (!paginationProps) return sortedData;
2926
3940
  return paginateTableData(sortedData, page, pageSize);
@@ -2928,8 +3942,8 @@ function TableRoot({
2928
3942
  if (columns.length === 0) {
2929
3943
  console.warn("[Table] Declare at least one Table.Column inside Table.Header.");
2930
3944
  }
2931
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "TableJSX", children: [
2932
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
3945
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "TableJSX", children: [
3946
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2933
3947
  DataTable,
2934
3948
  {
2935
3949
  ...dataTableProps,
@@ -2940,7 +3954,7 @@ function TableRoot({
2940
3954
  className: cn(className, paginationProps && "DataTableJSX--with-pagination")
2941
3955
  }
2942
3956
  ),
2943
- paginationProps && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
3957
+ paginationProps && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2944
3958
  TablePagination,
2945
3959
  {
2946
3960
  page,
@@ -2960,7 +3974,7 @@ function createTable() {
2960
3974
  Column.displayName = TABLE_COLUMN_DISPLAY_NAME;
2961
3975
  return Object.assign(
2962
3976
  function BoundTable(props) {
2963
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(TableRoot, { ...props });
3977
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableRoot, { ...props });
2964
3978
  },
2965
3979
  {
2966
3980
  Header: TableHeader,
@@ -2985,20 +3999,31 @@ var Table = Object.assign(TableRoot, {
2985
3999
  DEFAULT_TREE_PARENT_ID_FIELD,
2986
4000
  DEFAULT_TREE_QTY_FIELD,
2987
4001
  DataTable,
4002
+ INLINE_SEARCH_MAX_RESULTS,
2988
4003
  Table,
2989
4004
  applyCellEdit,
2990
4005
  applyFillData,
2991
4006
  applySelectionUpdater,
2992
4007
  buildColumnFreezeOffsets,
2993
4008
  buildColumnRowSpanMap,
4009
+ buildFlatSearchCorpus,
2994
4010
  buildRowsPastePayload,
4011
+ buildSearchMatchKey,
4012
+ buildSearchMatchKeys,
4013
+ buildTreeSearchCorpus,
2995
4014
  canExpandRow,
4015
+ cellValueToSearchText,
4016
+ collectAncestorKeysToExpand,
2996
4017
  collectCopyRowEntries,
2997
4018
  collectCopyRows,
2998
4019
  collectFillChanges,
2999
4020
  collectRowSpanColumns,
4021
+ collectSearchMatchesInRange,
4022
+ createSearchRegex,
3000
4023
  createTable,
4024
+ escapeSearchRegex,
3001
4025
  flattenSubtreeRows,
4026
+ formatSearchResultLabel,
3002
4027
  getCellEditDraftValue,
3003
4028
  getCellSelectionEdgeStyle,
3004
4029
  getColumnEditType,
@@ -3010,10 +4035,15 @@ var Table = Object.assign(TableRoot, {
3010
4035
  isCellInSelection,
3011
4036
  isColumnEditable,
3012
4037
  isEditablePasteTarget,
4038
+ mapSearchResultToVisibleItem,
4039
+ mapSearchResultsToVisibleKeys,
3013
4040
  measureMergedSpanRowHeights,
4041
+ nextSearchIndex,
4042
+ nextSearchStride,
3014
4043
  parseCellEditValue,
3015
4044
  parseClipboardTSV,
3016
4045
  parseClipboardTSVWithDepths,
4046
+ previousSearchIndex,
3017
4047
  resolveColumnFreezeSide,
3018
4048
  resolveDataTableLabels,
3019
4049
  resolvePasteColumnIds,
@@ -3027,5 +4057,6 @@ var Table = Object.assign(TableRoot, {
3027
4057
  useCellSelection,
3028
4058
  useConvertTreeData,
3029
4059
  useGlideTable,
4060
+ useInlineSearch,
3030
4061
  writeSelectionToClipboard
3031
4062
  });