feat(grid): auto-scroll while dragging cell selection

This commit is contained in:
t8y2 committed 2026-07-10 23:35:54 +08:00
1 parent 43f52463de
commit 8339dec428
3 files changed
+152 -3

No files matched your search

@@ -4599,6 +4599,8 @@ const selection = useDataGridSelection({
showTranspose,
transposeRowIndex,
gridRef,
getScrollElement: dataGridSelectionScroller,
cellFromClientPoint: dataGridCellFromClientPoint,
});
const {
@@ -5616,6 +5618,35 @@ function canvasScrollerElement(): HTMLElement | null {
return null;
}
function dataGridSelectionScroller(): HTMLElement | null {
if (showTranspose.value) return null;
return canvasScrollerElement();
}
function dataGridCellFromClientPoint(clientX: number, clientY: number): { rowIndex: number; colIndex: number } | null {
const scroller = dataGridSelectionScroller();
if (!scroller) return null;
const rect = scroller.getBoundingClientRect();
const clampedX = Math.min(rect.right - 1, Math.max(rect.left + DATA_GRID_ROW_NUM_WIDTH + 1, clientX));
const clampedY = Math.min(rect.bottom - 1, Math.max(rect.top + 1, clientY));
if (useCanvasGridRows.value) {
const rowIndex = Math.floor((scroller.scrollTop + clampedY - rect.top) / CANVAS_DATA_GRID_ROW_HEIGHT);
const visibleColIdx = canvasColumnAt(scroller.scrollLeft + clampedX - rect.left - DATA_GRID_ROW_NUM_WIDTH);
if (rowIndex < 0 || rowIndex >= displayRowCount.value || visibleColIdx < 0) return null;
const item = displayItemAt(rowIndex);
return item ? { rowIndex: item.displayIndex, colIndex: visibleColIdx } : null;
}
const target = document.elementFromPoint(clampedX, clampedY);
const cell = target instanceof Element ? target.closest<HTMLElement>("[data-row-index] [data-visible-col-index]") : null;
const row = cell?.closest<HTMLElement>("[data-row-index]");
const rowIndex = Number(row?.dataset.rowIndex);
const colIndex = Number(cell?.dataset.visibleColIndex);
if (!Number.isInteger(rowIndex) || !Number.isInteger(colIndex)) return null;
return { rowIndex, colIndex };
}
function syncCanvasViewport() {
if (!dataGridIsActive) return;
const scroller = canvasScrollerElement();