react-glide-table 2.3.0 → 2.3.2
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/README.md +27 -0
- package/dist/compound.cjs +219 -105
- package/dist/compound.d.cts +2 -2
- package/dist/compound.d.ts +2 -2
- package/dist/compound.js +219 -105
- package/dist/core.cjs +219 -107
- package/dist/core.d.cts +3 -2
- package/dist/core.d.ts +3 -2
- package/dist/core.js +219 -107
- package/dist/index.cjs +222 -108
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +222 -108
- package/dist/{types-DdeVn-9s.d.cts → types-hf2ruVdu.d.cts} +25 -1
- package/dist/{types-DdeVn-9s.d.ts → types-hf2ruVdu.d.ts} +25 -1
- package/package.json +1 -1
package/dist/core.cjs
CHANGED
|
@@ -526,9 +526,126 @@ function withCellUpdate(context, commitValue) {
|
|
|
526
526
|
};
|
|
527
527
|
}
|
|
528
528
|
|
|
529
|
+
// src/components/ui/table/features/cell-selection/pasteData.ts
|
|
530
|
+
function countLeadingEmptyCells(cells) {
|
|
531
|
+
let depth = 0;
|
|
532
|
+
while (depth < cells.length && cells[depth] === "") {
|
|
533
|
+
depth += 1;
|
|
534
|
+
}
|
|
535
|
+
return depth;
|
|
536
|
+
}
|
|
537
|
+
function looksLikeSubtreeIndentation(leadingEmptyCounts) {
|
|
538
|
+
if (leadingEmptyCounts.length === 0) return false;
|
|
539
|
+
const firstDepth = leadingEmptyCounts[0] ?? 0;
|
|
540
|
+
if (firstDepth !== 0) return false;
|
|
541
|
+
return leadingEmptyCounts.some((depth) => depth > 0);
|
|
542
|
+
}
|
|
543
|
+
function parseClipboardTSV(text) {
|
|
544
|
+
return parseClipboardTSVWithDepths(text).values;
|
|
545
|
+
}
|
|
546
|
+
function parseClipboardTSVWithDepths(text) {
|
|
547
|
+
if (!text) return { values: [], depths: [] };
|
|
548
|
+
const normalized = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
|
|
549
|
+
const withoutTrailing = normalized.replace(/\n+$/, "");
|
|
550
|
+
if (!withoutTrailing) return { values: [], depths: [] };
|
|
551
|
+
const rows = withoutTrailing.split("\n").map((line) => line.split(" "));
|
|
552
|
+
const leadingEmptyCounts = rows.map(countLeadingEmptyCells);
|
|
553
|
+
const treatAsDepth = looksLikeSubtreeIndentation(leadingEmptyCounts);
|
|
554
|
+
const values = [];
|
|
555
|
+
const depths = [];
|
|
556
|
+
for (let index = 0; index < rows.length; index += 1) {
|
|
557
|
+
const cells = rows[index] ?? [];
|
|
558
|
+
const depth = leadingEmptyCounts[index] ?? 0;
|
|
559
|
+
if (treatAsDepth) {
|
|
560
|
+
values.push(cells.slice(depth));
|
|
561
|
+
depths.push(depth);
|
|
562
|
+
} else {
|
|
563
|
+
values.push(cells);
|
|
564
|
+
depths.push(0);
|
|
565
|
+
}
|
|
566
|
+
}
|
|
567
|
+
return { values, depths };
|
|
568
|
+
}
|
|
569
|
+
function resolvePasteColumnIds(rows, startCol, width) {
|
|
570
|
+
if (width <= 0) return [];
|
|
571
|
+
const cells = rows[0]?.getVisibleCells() ?? [];
|
|
572
|
+
const columnIds = [];
|
|
573
|
+
for (let offset = 0; offset < width; offset += 1) {
|
|
574
|
+
const cell = cells[startCol + offset];
|
|
575
|
+
if (!cell) break;
|
|
576
|
+
columnIds.push(cell.column.id);
|
|
577
|
+
}
|
|
578
|
+
return columnIds;
|
|
579
|
+
}
|
|
580
|
+
function buildRowsPastePayload(rows, startRow, startCol, text, mode, endRow = startRow) {
|
|
581
|
+
const { values, depths } = parseClipboardTSVWithDepths(text);
|
|
582
|
+
if (values.length === 0) return null;
|
|
583
|
+
const width = Math.max(...values.map((row) => row.length), 0);
|
|
584
|
+
if (width === 0) return null;
|
|
585
|
+
const columnIds = resolvePasteColumnIds(rows, startCol, width);
|
|
586
|
+
if (columnIds.length === 0) return null;
|
|
587
|
+
const rowIds = [];
|
|
588
|
+
for (let offset = 0; offset < values.length; offset += 1) {
|
|
589
|
+
const row = rows[startRow + offset];
|
|
590
|
+
if (!row) break;
|
|
591
|
+
rowIds.push(row.id);
|
|
592
|
+
}
|
|
593
|
+
const anchorRow = rows[endRow] ?? rows[startRow];
|
|
594
|
+
return {
|
|
595
|
+
mode,
|
|
596
|
+
startRow,
|
|
597
|
+
startCol,
|
|
598
|
+
endRow,
|
|
599
|
+
rowIds,
|
|
600
|
+
anchorRowId: anchorRow?.id ?? "",
|
|
601
|
+
columnIds,
|
|
602
|
+
values,
|
|
603
|
+
depths
|
|
604
|
+
};
|
|
605
|
+
}
|
|
606
|
+
function isEditablePasteTarget(target) {
|
|
607
|
+
if (!(target instanceof HTMLElement)) return false;
|
|
608
|
+
const tag = target.tagName;
|
|
609
|
+
if (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT") return true;
|
|
610
|
+
return Boolean(target.isContentEditable);
|
|
611
|
+
}
|
|
612
|
+
|
|
529
613
|
// src/components/ui/table/features/cell-selection/useCellSelection.ts
|
|
530
614
|
var import_react3 = require("react");
|
|
531
615
|
|
|
616
|
+
// src/components/ui/table/features/cell-selection/activeCellSelectionOwner.ts
|
|
617
|
+
var activeOwner = null;
|
|
618
|
+
var clearByOwner = /* @__PURE__ */ new Map();
|
|
619
|
+
function createCellSelectionOwner() {
|
|
620
|
+
return /* @__PURE__ */ Symbol("cell-selection-owner");
|
|
621
|
+
}
|
|
622
|
+
function registerCellSelectionOwner(owner, clearSelection) {
|
|
623
|
+
clearByOwner.set(owner, clearSelection);
|
|
624
|
+
return () => {
|
|
625
|
+
clearByOwner.delete(owner);
|
|
626
|
+
if (activeOwner === owner) {
|
|
627
|
+
activeOwner = null;
|
|
628
|
+
}
|
|
629
|
+
};
|
|
630
|
+
}
|
|
631
|
+
function claimCellSelectionOwner(owner) {
|
|
632
|
+
if (activeOwner === owner) return;
|
|
633
|
+
activeOwner = owner;
|
|
634
|
+
for (const [id, clearSelection] of clearByOwner) {
|
|
635
|
+
if (id !== owner) {
|
|
636
|
+
clearSelection();
|
|
637
|
+
}
|
|
638
|
+
}
|
|
639
|
+
}
|
|
640
|
+
function isActiveCellSelectionOwner(owner) {
|
|
641
|
+
return activeOwner === owner;
|
|
642
|
+
}
|
|
643
|
+
function releaseCellSelectionOwner(owner) {
|
|
644
|
+
if (activeOwner === owner) {
|
|
645
|
+
activeOwner = null;
|
|
646
|
+
}
|
|
647
|
+
}
|
|
648
|
+
|
|
532
649
|
// src/components/ui/table/features/cell-selection/cellSelection.ts
|
|
533
650
|
var INITIAL_DRAG_STATE = {
|
|
534
651
|
isSelecting: false,
|
|
@@ -1006,19 +1123,31 @@ function extractRenderedCopyText(node, value, cellPosition, root) {
|
|
|
1006
1123
|
function formatCopyCellText(rowData, columnDef, columnId, visibleRow, fallbackIndex, sourceCell, cellPosition, options) {
|
|
1007
1124
|
const meta = columnDef.meta;
|
|
1008
1125
|
const value = sourceCell ? sourceCell.getValue() : readRowColumnValue(rowData, columnDef);
|
|
1126
|
+
const row = visibleRow ?? createCopyRenderRow(rowData, fallbackIndex);
|
|
1127
|
+
const ctx = {
|
|
1128
|
+
value,
|
|
1129
|
+
row,
|
|
1130
|
+
index: row.index,
|
|
1131
|
+
columnId,
|
|
1132
|
+
cellProps: meta?.cellProps,
|
|
1133
|
+
update: () => {
|
|
1134
|
+
}
|
|
1135
|
+
};
|
|
1136
|
+
const copyValue = meta?.copyValue;
|
|
1137
|
+
if (typeof copyValue === "function") {
|
|
1138
|
+
try {
|
|
1139
|
+
return sanitizeClipboardCell(copyValue(ctx));
|
|
1140
|
+
} catch {
|
|
1141
|
+
return formatCellValue(value);
|
|
1142
|
+
}
|
|
1143
|
+
}
|
|
1144
|
+
if (copyValue === "value") {
|
|
1145
|
+
return formatCellValue(value);
|
|
1146
|
+
}
|
|
1009
1147
|
const cellRender = meta?.cellRender;
|
|
1010
1148
|
if (typeof cellRender === "function") {
|
|
1011
1149
|
try {
|
|
1012
|
-
const
|
|
1013
|
-
const node = cellRender({
|
|
1014
|
-
value,
|
|
1015
|
-
row,
|
|
1016
|
-
index: row.index,
|
|
1017
|
-
columnId,
|
|
1018
|
-
cellProps: meta?.cellProps,
|
|
1019
|
-
update: () => {
|
|
1020
|
-
}
|
|
1021
|
-
});
|
|
1150
|
+
const node = cellRender(ctx);
|
|
1022
1151
|
return extractRenderedCopyText(node, value, cellPosition, options?.root);
|
|
1023
1152
|
} catch {
|
|
1024
1153
|
return formatCellValue(value);
|
|
@@ -1026,16 +1155,6 @@ function formatCopyCellText(rowData, columnDef, columnId, visibleRow, fallbackIn
|
|
|
1026
1155
|
}
|
|
1027
1156
|
if (options?.registry && meta?.kind && isPrimitiveCopyValue(value)) {
|
|
1028
1157
|
try {
|
|
1029
|
-
const row = visibleRow ?? createCopyRenderRow(rowData, fallbackIndex);
|
|
1030
|
-
const ctx = {
|
|
1031
|
-
value,
|
|
1032
|
-
row,
|
|
1033
|
-
index: row.index,
|
|
1034
|
-
columnId,
|
|
1035
|
-
cellProps: meta.cellProps,
|
|
1036
|
-
update: () => {
|
|
1037
|
-
}
|
|
1038
|
-
};
|
|
1039
1158
|
const renderer = resolveCellRenderer(options.registry, meta.kind, ctx);
|
|
1040
1159
|
if (renderer) {
|
|
1041
1160
|
const node = renderer.render(ctx);
|
|
@@ -1161,11 +1280,16 @@ function serializeCopyRowsToTSV(copyRows, visibleRows, bounds, depths, options)
|
|
|
1161
1280
|
const resolvedDepths = depths && depths.length === copyRows.length ? depths : copyRows.map((row) => getRowDepth(row));
|
|
1162
1281
|
const minDepth = Math.min(...resolvedDepths);
|
|
1163
1282
|
const visibleRowByOriginal = buildVisibleRowLookup(visibleRows);
|
|
1283
|
+
const copyableColumns = columnCells.flatMap((templateCell, colOffset) => {
|
|
1284
|
+
const meta = templateCell.column.columnDef.meta;
|
|
1285
|
+
if (meta?.copyValue === "omit") return [];
|
|
1286
|
+
return [{ templateCell, colOffset }];
|
|
1287
|
+
});
|
|
1164
1288
|
return copyRows.map((rowData, index) => {
|
|
1165
1289
|
const relativeDepth = Math.max(0, (resolvedDepths[index] ?? 0) - minDepth);
|
|
1166
1290
|
const visibleRow = visibleRowByOriginal.get(rowData);
|
|
1167
1291
|
const matchingCells = visibleRow?.getVisibleCells().slice(startCol, endCol + 1);
|
|
1168
|
-
const line =
|
|
1292
|
+
const line = copyableColumns.map(({ templateCell, colOffset }) => {
|
|
1169
1293
|
const sourceCell = matchingCells?.[colOffset];
|
|
1170
1294
|
const column = sourceCell?.column ?? templateCell.column;
|
|
1171
1295
|
return formatCopyCellText(
|
|
@@ -1259,90 +1383,6 @@ function hasFillExtension(sourceBounds, fillBounds) {
|
|
|
1259
1383
|
return fillBounds.startRow < sourceBounds.startRow || fillBounds.endRow > sourceBounds.endRow || fillBounds.startCol < sourceBounds.startCol || fillBounds.endCol > sourceBounds.endCol;
|
|
1260
1384
|
}
|
|
1261
1385
|
|
|
1262
|
-
// src/components/ui/table/features/cell-selection/pasteData.ts
|
|
1263
|
-
function countLeadingEmptyCells(cells) {
|
|
1264
|
-
let depth = 0;
|
|
1265
|
-
while (depth < cells.length && cells[depth] === "") {
|
|
1266
|
-
depth += 1;
|
|
1267
|
-
}
|
|
1268
|
-
return depth;
|
|
1269
|
-
}
|
|
1270
|
-
function looksLikeSubtreeIndentation(leadingEmptyCounts) {
|
|
1271
|
-
if (leadingEmptyCounts.length === 0) return false;
|
|
1272
|
-
const firstDepth = leadingEmptyCounts[0] ?? 0;
|
|
1273
|
-
if (firstDepth !== 0) return false;
|
|
1274
|
-
return leadingEmptyCounts.some((depth) => depth > 0);
|
|
1275
|
-
}
|
|
1276
|
-
function parseClipboardTSV(text) {
|
|
1277
|
-
return parseClipboardTSVWithDepths(text).values;
|
|
1278
|
-
}
|
|
1279
|
-
function parseClipboardTSVWithDepths(text) {
|
|
1280
|
-
if (!text) return { values: [], depths: [] };
|
|
1281
|
-
const normalized = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
|
|
1282
|
-
const withoutTrailing = normalized.replace(/\n+$/, "");
|
|
1283
|
-
if (!withoutTrailing) return { values: [], depths: [] };
|
|
1284
|
-
const rows = withoutTrailing.split("\n").map((line) => line.split(" "));
|
|
1285
|
-
const leadingEmptyCounts = rows.map(countLeadingEmptyCells);
|
|
1286
|
-
const treatAsDepth = looksLikeSubtreeIndentation(leadingEmptyCounts);
|
|
1287
|
-
const values = [];
|
|
1288
|
-
const depths = [];
|
|
1289
|
-
for (let index = 0; index < rows.length; index += 1) {
|
|
1290
|
-
const cells = rows[index] ?? [];
|
|
1291
|
-
const depth = leadingEmptyCounts[index] ?? 0;
|
|
1292
|
-
if (treatAsDepth) {
|
|
1293
|
-
values.push(cells.slice(depth));
|
|
1294
|
-
depths.push(depth);
|
|
1295
|
-
} else {
|
|
1296
|
-
values.push(cells);
|
|
1297
|
-
depths.push(0);
|
|
1298
|
-
}
|
|
1299
|
-
}
|
|
1300
|
-
return { values, depths };
|
|
1301
|
-
}
|
|
1302
|
-
function resolvePasteColumnIds(rows, startCol, width) {
|
|
1303
|
-
if (width <= 0) return [];
|
|
1304
|
-
const cells = rows[0]?.getVisibleCells() ?? [];
|
|
1305
|
-
const columnIds = [];
|
|
1306
|
-
for (let offset = 0; offset < width; offset += 1) {
|
|
1307
|
-
const cell = cells[startCol + offset];
|
|
1308
|
-
if (!cell) break;
|
|
1309
|
-
columnIds.push(cell.column.id);
|
|
1310
|
-
}
|
|
1311
|
-
return columnIds;
|
|
1312
|
-
}
|
|
1313
|
-
function buildRowsPastePayload(rows, startRow, startCol, text, mode, endRow = startRow) {
|
|
1314
|
-
const { values, depths } = parseClipboardTSVWithDepths(text);
|
|
1315
|
-
if (values.length === 0) return null;
|
|
1316
|
-
const width = Math.max(...values.map((row) => row.length), 0);
|
|
1317
|
-
if (width === 0) return null;
|
|
1318
|
-
const columnIds = resolvePasteColumnIds(rows, startCol, width);
|
|
1319
|
-
if (columnIds.length === 0) return null;
|
|
1320
|
-
const rowIds = [];
|
|
1321
|
-
for (let offset = 0; offset < values.length; offset += 1) {
|
|
1322
|
-
const row = rows[startRow + offset];
|
|
1323
|
-
if (!row) break;
|
|
1324
|
-
rowIds.push(row.id);
|
|
1325
|
-
}
|
|
1326
|
-
const anchorRow = rows[endRow] ?? rows[startRow];
|
|
1327
|
-
return {
|
|
1328
|
-
mode,
|
|
1329
|
-
startRow,
|
|
1330
|
-
startCol,
|
|
1331
|
-
endRow,
|
|
1332
|
-
rowIds,
|
|
1333
|
-
anchorRowId: anchorRow?.id ?? "",
|
|
1334
|
-
columnIds,
|
|
1335
|
-
values,
|
|
1336
|
-
depths
|
|
1337
|
-
};
|
|
1338
|
-
}
|
|
1339
|
-
function isEditablePasteTarget(target) {
|
|
1340
|
-
if (!(target instanceof HTMLElement)) return false;
|
|
1341
|
-
const tag = target.tagName;
|
|
1342
|
-
if (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT") return true;
|
|
1343
|
-
return Boolean(target.isContentEditable);
|
|
1344
|
-
}
|
|
1345
|
-
|
|
1346
1386
|
// src/components/ui/table/features/cell-selection/useCellSelection.ts
|
|
1347
1387
|
function useCellSelection({
|
|
1348
1388
|
data,
|
|
@@ -1358,6 +1398,7 @@ function useCellSelection({
|
|
|
1358
1398
|
cellRendererRegistry,
|
|
1359
1399
|
rootRef
|
|
1360
1400
|
}) {
|
|
1401
|
+
const ownerRef = (0, import_react3.useRef)(createCellSelectionOwner());
|
|
1361
1402
|
const [dragState, setDragState] = (0, import_react3.useState)(INITIAL_DRAG_STATE);
|
|
1362
1403
|
const pendingPasteModeRef = (0, import_react3.useRef)(null);
|
|
1363
1404
|
const dragStateRef = (0, import_react3.useRef)(dragState);
|
|
@@ -1369,6 +1410,7 @@ function useCellSelection({
|
|
|
1369
1410
|
const handleCellMouseDown = (0, import_react3.useCallback)(
|
|
1370
1411
|
(rowIndex, colIndex, options) => {
|
|
1371
1412
|
if (!enabled) return;
|
|
1413
|
+
claimCellSelectionOwner(ownerRef.current);
|
|
1372
1414
|
setDragState((prev) => {
|
|
1373
1415
|
if (options?.shiftKey && prev.start) {
|
|
1374
1416
|
return {
|
|
@@ -1410,6 +1452,7 @@ function useCellSelection({
|
|
|
1410
1452
|
const handleFillHandleMouseDown = (0, import_react3.useCallback)(
|
|
1411
1453
|
(rowIndex, colIndex) => {
|
|
1412
1454
|
if (!enabled) return;
|
|
1455
|
+
claimCellSelectionOwner(ownerRef.current);
|
|
1413
1456
|
setDragState((prev) => {
|
|
1414
1457
|
const bounds = getCellSelectionBounds(prev.start, prev.end);
|
|
1415
1458
|
if (!bounds) return prev;
|
|
@@ -1424,14 +1467,27 @@ function useCellSelection({
|
|
|
1424
1467
|
},
|
|
1425
1468
|
[enabled]
|
|
1426
1469
|
);
|
|
1470
|
+
const clearSelection = (0, import_react3.useCallback)(() => {
|
|
1471
|
+
const prev = dragStateRef.current;
|
|
1472
|
+
if (prev.start === null && prev.end === null && !prev.isSelecting && !prev.isFillDragging) {
|
|
1473
|
+
return;
|
|
1474
|
+
}
|
|
1475
|
+
releaseCellSelectionOwner(ownerRef.current);
|
|
1476
|
+
dragStateRef.current = INITIAL_DRAG_STATE;
|
|
1477
|
+
setDragState(INITIAL_DRAG_STATE);
|
|
1478
|
+
}, []);
|
|
1427
1479
|
(0, import_react3.useEffect)(() => {
|
|
1428
1480
|
if (!enabled) {
|
|
1429
|
-
|
|
1481
|
+
clearSelection();
|
|
1430
1482
|
}
|
|
1431
|
-
}, [enabled]);
|
|
1483
|
+
}, [clearSelection, enabled]);
|
|
1484
|
+
(0, import_react3.useEffect)(() => {
|
|
1485
|
+
return registerCellSelectionOwner(ownerRef.current, clearSelection);
|
|
1486
|
+
}, [clearSelection]);
|
|
1432
1487
|
(0, import_react3.useEffect)(() => {
|
|
1433
1488
|
if (!enabled) return;
|
|
1434
1489
|
const handleKeyDown = (e) => {
|
|
1490
|
+
if (!isActiveCellSelectionOwner(ownerRef.current)) return;
|
|
1435
1491
|
if (e.ctrlKey || e.metaKey || e.altKey) return;
|
|
1436
1492
|
if (isEditablePasteTarget(e.target) || isEditablePasteTarget(document.activeElement)) {
|
|
1437
1493
|
return;
|
|
@@ -1497,6 +1553,7 @@ function useCellSelection({
|
|
|
1497
1553
|
(0, import_react3.useEffect)(() => {
|
|
1498
1554
|
if (!enabled) return;
|
|
1499
1555
|
const handleKeyDown = (e) => {
|
|
1556
|
+
if (!isActiveCellSelectionOwner(ownerRef.current)) return;
|
|
1500
1557
|
if (!activeSelectionBounds) return;
|
|
1501
1558
|
if (!(e.ctrlKey || e.metaKey)) return;
|
|
1502
1559
|
if (isEditablePasteTarget(e.target) || isEditablePasteTarget(document.activeElement)) {
|
|
@@ -1533,6 +1590,7 @@ function useCellSelection({
|
|
|
1533
1590
|
const pasteHandledRef = { current: false };
|
|
1534
1591
|
const ignoreNextPasteRef = { current: false };
|
|
1535
1592
|
const handleKeyDown = (e) => {
|
|
1593
|
+
if (!isActiveCellSelectionOwner(ownerRef.current)) return;
|
|
1536
1594
|
if (!activeSelectionBounds) return;
|
|
1537
1595
|
if (!(e.ctrlKey || e.metaKey)) return;
|
|
1538
1596
|
if (e.key.toLowerCase() !== "v") return;
|
|
@@ -1553,6 +1611,7 @@ function useCellSelection({
|
|
|
1553
1611
|
const text = await navigator.clipboard.readText();
|
|
1554
1612
|
if (pasteHandledRef.current) return;
|
|
1555
1613
|
if (pendingPasteModeRef.current !== mode) return;
|
|
1614
|
+
if (!isActiveCellSelectionOwner(ownerRef.current)) return;
|
|
1556
1615
|
if (!text) return;
|
|
1557
1616
|
pasteHandledRef.current = true;
|
|
1558
1617
|
emitRowsPaste(text, mode);
|
|
@@ -1562,6 +1621,7 @@ function useCellSelection({
|
|
|
1562
1621
|
})();
|
|
1563
1622
|
};
|
|
1564
1623
|
const handlePaste = (e) => {
|
|
1624
|
+
if (!isActiveCellSelectionOwner(ownerRef.current)) return;
|
|
1565
1625
|
if (!activeSelectionBounds) return;
|
|
1566
1626
|
if (isEditablePasteTarget(e.target) || isEditablePasteTarget(document.activeElement)) {
|
|
1567
1627
|
return;
|
|
@@ -1642,10 +1702,30 @@ function useCellSelection({
|
|
|
1642
1702
|
handleCellMouseDown,
|
|
1643
1703
|
handleCellMouseEnter,
|
|
1644
1704
|
handleFillHandleMouseDown,
|
|
1705
|
+
clearSelection,
|
|
1645
1706
|
copySelection
|
|
1646
1707
|
};
|
|
1647
1708
|
}
|
|
1648
1709
|
|
|
1710
|
+
// src/components/ui/table/features/selection-dismiss/isOutsideDismissTarget.ts
|
|
1711
|
+
var OVERLAY_DISMISS_IGNORE_SELECTOR = [
|
|
1712
|
+
'[role="dialog"]',
|
|
1713
|
+
'[role="alertdialog"]',
|
|
1714
|
+
'[role="menu"]',
|
|
1715
|
+
'[role="listbox"]',
|
|
1716
|
+
'[role="tooltip"]',
|
|
1717
|
+
'[aria-modal="true"]',
|
|
1718
|
+
"[data-radix-portal]",
|
|
1719
|
+
"[data-radix-popper-content-wrapper]",
|
|
1720
|
+
"[data-floating-ui-portal]",
|
|
1721
|
+
"[data-table-ignore-outside-dismiss]"
|
|
1722
|
+
].join(",");
|
|
1723
|
+
function isOverlayDismissIgnoreTarget(target) {
|
|
1724
|
+
const element = target instanceof Element ? target : target instanceof Node ? target.parentElement : null;
|
|
1725
|
+
if (!element) return false;
|
|
1726
|
+
return element.closest(OVERLAY_DISMISS_IGNORE_SELECTOR) !== null;
|
|
1727
|
+
}
|
|
1728
|
+
|
|
1649
1729
|
// src/components/ui/table/features/column-reorder/columnReorder.ts
|
|
1650
1730
|
function getColumnDefId(column) {
|
|
1651
1731
|
if (column.id != null && column.id !== "") return column.id;
|
|
@@ -2919,6 +2999,7 @@ function useGlideTable(options) {
|
|
|
2919
2999
|
handleCellMouseDown,
|
|
2920
3000
|
handleCellMouseEnter,
|
|
2921
3001
|
handleFillHandleMouseDown,
|
|
3002
|
+
clearSelection: clearCellSelection,
|
|
2922
3003
|
copySelection
|
|
2923
3004
|
} = useCellSelection({
|
|
2924
3005
|
data: tableData,
|
|
@@ -2934,6 +3015,37 @@ function useGlideTable(options) {
|
|
|
2934
3015
|
cellRendererRegistry,
|
|
2935
3016
|
rootRef
|
|
2936
3017
|
});
|
|
3018
|
+
const clearRowSelection = (0, import_react6.useCallback)(() => {
|
|
3019
|
+
if (rowSelectionMode === "none") return;
|
|
3020
|
+
const hasSelection = Object.values(rowSelection).some(Boolean);
|
|
3021
|
+
if (!hasSelection) return;
|
|
3022
|
+
if (onRowSelectionChange) {
|
|
3023
|
+
onRowSelectionChange(() => ({}));
|
|
3024
|
+
return;
|
|
3025
|
+
}
|
|
3026
|
+
setInternalRowSelection({});
|
|
3027
|
+
}, [onRowSelectionChange, rowSelection, rowSelectionMode]);
|
|
3028
|
+
(0, import_react6.useEffect)(() => {
|
|
3029
|
+
const clearAllSelections = () => {
|
|
3030
|
+
clearCellSelection();
|
|
3031
|
+
clearRowSelection();
|
|
3032
|
+
};
|
|
3033
|
+
const handleKeyDown = (event) => {
|
|
3034
|
+
if (event.key !== "Escape") return;
|
|
3035
|
+
if (event.defaultPrevented) return;
|
|
3036
|
+
if (isEditablePasteTarget(event.target) || isEditablePasteTarget(document.activeElement)) {
|
|
3037
|
+
return;
|
|
3038
|
+
}
|
|
3039
|
+
if (isOverlayDismissIgnoreTarget(event.target) || isOverlayDismissIgnoreTarget(document.activeElement)) {
|
|
3040
|
+
return;
|
|
3041
|
+
}
|
|
3042
|
+
clearAllSelections();
|
|
3043
|
+
};
|
|
3044
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
3045
|
+
return () => {
|
|
3046
|
+
window.removeEventListener("keydown", handleKeyDown);
|
|
3047
|
+
};
|
|
3048
|
+
}, [clearCellSelection, clearRowSelection]);
|
|
2937
3049
|
const {
|
|
2938
3050
|
editingCell,
|
|
2939
3051
|
draftValue,
|
package/dist/core.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { B as BuiltinCellKind, b as CellRenderFn, d as
|
|
1
|
+
import { X as CellEditType, c as CellRenderer, C as CellKind, a as CellRenderContext, j as DataTableClassNames, R as RowSelectionMode, h as ColumnFreezeOffset, q as SearchResultItem, r as SearchStatus, m as DataTableProps, l as DataTableLabels, k as DataTableCopyActions, P as PasteMode, p as RowsPastePayload } from './types-hf2ruVdu.cjs';
|
|
2
|
+
export { B as BuiltinCellKind, b as CellRenderFn, d as ColumnCopyValue, e as ColumnFreezeColumnInput, f as ColumnFreezeEdgeSide, g as ColumnFreezeMeta, i as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, I as INLINE_SEARCH_MAX_RESULTS, S as SearchCorpusRow, u as buildColumnFreezeOffsets, v as buildFlatSearchCorpus, w as buildSearchMatchKey, x as buildSearchMatchKeys, y as buildTreeSearchCorpus, z as cellValueToSearchText, A as collectAncestorKeysToExpand, E as collectSearchMatchesInRange, F as createSearchRegex, G as escapeSearchRegex, H as formatSearchResultLabel, J as getColumnFreezeEdgeAttr, K as getColumnFreezeStyle, L as mapSearchResultToVisibleItem, M as mapSearchResultsToVisibleKeys, N as nextSearchIndex, O as nextSearchStride, Q as previousSearchIndex, U as resolveColumnFreezeSide, V as resolveDataTableLabels, W as resolveHeaderFreezeOffset } from './types-hf2ruVdu.cjs';
|
|
3
3
|
import { Row, ColumnDef, CellContext, Table, Cell, ColumnOrderState, Updater, RowSelectionState } from '@tanstack/react-table';
|
|
4
4
|
export { ColumnDef, ColumnOrderState, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';
|
|
5
5
|
import { Virtualizer, VirtualItem } from '@tanstack/react-virtual';
|
|
@@ -463,6 +463,7 @@ declare function useCellSelection<T extends Record<string, unknown>>({ data, row
|
|
|
463
463
|
handleCellMouseDown: (rowIndex: number, colIndex: number, options?: CellMouseDownOptions) => void;
|
|
464
464
|
handleCellMouseEnter: (rowIndex: number, colIndex: number) => void;
|
|
465
465
|
handleFillHandleMouseDown: (rowIndex: number, colIndex: number) => void;
|
|
466
|
+
clearSelection: () => void;
|
|
466
467
|
copySelection: (options?: CopySelectionOptions) => Promise<boolean>;
|
|
467
468
|
};
|
|
468
469
|
|
package/dist/core.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { B as BuiltinCellKind, b as CellRenderFn, d as
|
|
1
|
+
import { X as CellEditType, c as CellRenderer, C as CellKind, a as CellRenderContext, j as DataTableClassNames, R as RowSelectionMode, h as ColumnFreezeOffset, q as SearchResultItem, r as SearchStatus, m as DataTableProps, l as DataTableLabels, k as DataTableCopyActions, P as PasteMode, p as RowsPastePayload } from './types-hf2ruVdu.js';
|
|
2
|
+
export { B as BuiltinCellKind, b as CellRenderFn, d as ColumnCopyValue, e as ColumnFreezeColumnInput, f as ColumnFreezeEdgeSide, g as ColumnFreezeMeta, i as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, I as INLINE_SEARCH_MAX_RESULTS, S as SearchCorpusRow, u as buildColumnFreezeOffsets, v as buildFlatSearchCorpus, w as buildSearchMatchKey, x as buildSearchMatchKeys, y as buildTreeSearchCorpus, z as cellValueToSearchText, A as collectAncestorKeysToExpand, E as collectSearchMatchesInRange, F as createSearchRegex, G as escapeSearchRegex, H as formatSearchResultLabel, J as getColumnFreezeEdgeAttr, K as getColumnFreezeStyle, L as mapSearchResultToVisibleItem, M as mapSearchResultsToVisibleKeys, N as nextSearchIndex, O as nextSearchStride, Q as previousSearchIndex, U as resolveColumnFreezeSide, V as resolveDataTableLabels, W as resolveHeaderFreezeOffset } from './types-hf2ruVdu.js';
|
|
3
3
|
import { Row, ColumnDef, CellContext, Table, Cell, ColumnOrderState, Updater, RowSelectionState } from '@tanstack/react-table';
|
|
4
4
|
export { ColumnDef, ColumnOrderState, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';
|
|
5
5
|
import { Virtualizer, VirtualItem } from '@tanstack/react-virtual';
|
|
@@ -463,6 +463,7 @@ declare function useCellSelection<T extends Record<string, unknown>>({ data, row
|
|
|
463
463
|
handleCellMouseDown: (rowIndex: number, colIndex: number, options?: CellMouseDownOptions) => void;
|
|
464
464
|
handleCellMouseEnter: (rowIndex: number, colIndex: number) => void;
|
|
465
465
|
handleFillHandleMouseDown: (rowIndex: number, colIndex: number) => void;
|
|
466
|
+
clearSelection: () => void;
|
|
466
467
|
copySelection: (options?: CopySelectionOptions) => Promise<boolean>;
|
|
467
468
|
};
|
|
468
469
|
|