@vuu-ui/vuu-table 0.8.94 → 0.8.96
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/cjs/Row.css.js +1 -1
- package/cjs/Row.js +1 -1
- package/cjs/Row.js.map +1 -1
- package/cjs/Table.css.js +1 -1
- package/cjs/Table.js +113 -31
- package/cjs/Table.js.map +1 -1
- package/cjs/cell-block/CellBlock.css.js +6 -0
- package/cjs/cell-block/CellBlock.css.js.map +1 -0
- package/cjs/cell-block/CellBlock.js +41 -0
- package/cjs/cell-block/CellBlock.js.map +1 -0
- package/cjs/cell-block/cellblock-utils.js +140 -0
- package/cjs/cell-block/cellblock-utils.js.map +1 -0
- package/cjs/cell-block/useCellBlockSelection.js +232 -0
- package/cjs/cell-block/useCellBlockSelection.js.map +1 -0
- package/cjs/index.js +5 -0
- package/cjs/index.js.map +1 -1
- package/cjs/moving-window.js +21 -9
- package/cjs/moving-window.js.map +1 -1
- package/cjs/pagination/PaginationControl.css.js +6 -0
- package/cjs/pagination/PaginationControl.css.js.map +1 -0
- package/cjs/pagination/PaginationControl.js +38 -0
- package/cjs/pagination/PaginationControl.js.map +1 -0
- package/cjs/pagination/usePagination.js +38 -0
- package/cjs/pagination/usePagination.js.map +1 -0
- package/cjs/table-dom-utils.js +67 -10
- package/cjs/table-dom-utils.js.map +1 -1
- package/cjs/table-header/useTableHeader.js +1 -1
- package/cjs/table-header/useTableHeader.js.map +1 -1
- package/cjs/useCellFocus.js +56 -0
- package/cjs/useCellFocus.js.map +1 -0
- package/cjs/useControlledTableNavigation.js +3 -1
- package/cjs/useControlledTableNavigation.js.map +1 -1
- package/cjs/useDataSource.js +13 -0
- package/cjs/useDataSource.js.map +1 -1
- package/cjs/useKeyboardNavigation.js +8 -82
- package/cjs/useKeyboardNavigation.js.map +1 -1
- package/cjs/useMeasuredHeight.js +5 -5
- package/cjs/useMeasuredHeight.js.map +1 -1
- package/cjs/useTable.js +63 -16
- package/cjs/useTable.js.map +1 -1
- package/cjs/useTableContextMenu.js +2 -1
- package/cjs/useTableContextMenu.js.map +1 -1
- package/cjs/useTableScroll.js.map +1 -1
- package/cjs/useTableViewport.js +31 -13
- package/cjs/useTableViewport.js.map +1 -1
- package/esm/Row.css.js +1 -1
- package/esm/Row.js +1 -1
- package/esm/Row.js.map +1 -1
- package/esm/Table.css.js +1 -1
- package/esm/Table.js +115 -33
- package/esm/Table.js.map +1 -1
- package/esm/cell-block/CellBlock.css.js +4 -0
- package/esm/cell-block/CellBlock.css.js.map +1 -0
- package/esm/cell-block/CellBlock.js +39 -0
- package/esm/cell-block/CellBlock.js.map +1 -0
- package/esm/cell-block/cellblock-utils.js +131 -0
- package/esm/cell-block/cellblock-utils.js.map +1 -0
- package/esm/cell-block/useCellBlockSelection.js +230 -0
- package/esm/cell-block/useCellBlockSelection.js.map +1 -0
- package/esm/index.js +2 -1
- package/esm/index.js.map +1 -1
- package/esm/moving-window.js +21 -9
- package/esm/moving-window.js.map +1 -1
- package/esm/pagination/PaginationControl.css.js +4 -0
- package/esm/pagination/PaginationControl.css.js.map +1 -0
- package/esm/pagination/PaginationControl.js +36 -0
- package/esm/pagination/PaginationControl.js.map +1 -0
- package/esm/pagination/usePagination.js +36 -0
- package/esm/pagination/usePagination.js.map +1 -0
- package/esm/table-dom-utils.js +64 -10
- package/esm/table-dom-utils.js.map +1 -1
- package/esm/table-header/useTableHeader.js +1 -1
- package/esm/table-header/useTableHeader.js.map +1 -1
- package/esm/useCellFocus.js +54 -0
- package/esm/useCellFocus.js.map +1 -0
- package/esm/useControlledTableNavigation.js +3 -2
- package/esm/useControlledTableNavigation.js.map +1 -1
- package/esm/useDataSource.js +13 -0
- package/esm/useDataSource.js.map +1 -1
- package/esm/useKeyboardNavigation.js +8 -82
- package/esm/useKeyboardNavigation.js.map +1 -1
- package/esm/useMeasuredHeight.js +5 -5
- package/esm/useMeasuredHeight.js.map +1 -1
- package/esm/useTable.js +63 -16
- package/esm/useTable.js.map +1 -1
- package/esm/useTableContextMenu.js +2 -1
- package/esm/useTableContextMenu.js.map +1 -1
- package/esm/useTableScroll.js.map +1 -1
- package/esm/useTableViewport.js +31 -13
- package/esm/useTableViewport.js.map +1 -1
- package/package.json +9 -9
- package/types/Table.d.ts +40 -0
- package/types/cell-block/CellBlock.d.ts +6 -0
- package/types/cell-block/cellblock-utils.d.ts +37 -0
- package/types/cell-block/useCellBlockSelection.d.ts +16 -0
- package/types/index.d.ts +1 -0
- package/types/moving-window.d.ts +3 -1
- package/types/pagination/PaginationControl.d.ts +6 -0
- package/types/pagination/index.d.ts +1 -0
- package/types/pagination/usePagination.d.ts +9 -0
- package/types/table-dom-utils.d.ts +6 -1
- package/types/useCellFocus.d.ts +13 -0
- package/types/useControlledTableNavigation.d.ts +1 -0
- package/types/useKeyboardNavigation.d.ts +5 -5
- package/types/useMeasuredHeight.d.ts +2 -2
- package/types/useTable.d.ts +13 -11
- package/types/useTableScroll.d.ts +1 -0
- package/types/useTableViewport.d.ts +3 -2
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
4
|
+
var tableDomUtils = require('../table-dom-utils.js');
|
|
5
|
+
|
|
6
|
+
const isNullCellBox = ({ bottom, left, right, top }) => {
|
|
7
|
+
return bottom === -1 && left === -1 && right === -1 && top === -1;
|
|
8
|
+
};
|
|
9
|
+
const Hi = Number.MAX_SAFE_INTEGER;
|
|
10
|
+
const getEndCellDirection = (startBox, endBox) => {
|
|
11
|
+
const { bottom: sBottom, left: sLeft, right: sRight, top: sTop } = startBox;
|
|
12
|
+
const { bottom: eBottom, left: eLeft, right: eRight, top: eTop } = endBox;
|
|
13
|
+
const north = eTop < sTop;
|
|
14
|
+
const east = eRight > sRight;
|
|
15
|
+
const south = eBottom > sBottom;
|
|
16
|
+
const west = eLeft < sLeft;
|
|
17
|
+
if (north && east) return "ne";
|
|
18
|
+
else if (south && east) return "se";
|
|
19
|
+
else if (south && west) return "sw";
|
|
20
|
+
else if (north && west) return "nw";
|
|
21
|
+
else if (north) return "n";
|
|
22
|
+
else if (east) return "e";
|
|
23
|
+
else if (south) return "s";
|
|
24
|
+
else if (west) return "w";
|
|
25
|
+
else return "self";
|
|
26
|
+
};
|
|
27
|
+
const setElementBox = (el, box) => {
|
|
28
|
+
const { bottom, left, right, top } = el.getBoundingClientRect();
|
|
29
|
+
box.bottom = bottom;
|
|
30
|
+
box.left = left;
|
|
31
|
+
box.right = right;
|
|
32
|
+
box.top = top;
|
|
33
|
+
};
|
|
34
|
+
const outsideBox = ({ bottom, left, right, top }, x, y) => x < left || x > right || y < top || y > bottom;
|
|
35
|
+
const getColIndex = ({ ariaColIndex }) => {
|
|
36
|
+
if (ariaColIndex !== null) {
|
|
37
|
+
return parseInt(ariaColIndex);
|
|
38
|
+
}
|
|
39
|
+
throw Error("invalid aria-colindex in table cell");
|
|
40
|
+
};
|
|
41
|
+
const getRowIndex = (cell) => {
|
|
42
|
+
const row = vuuUtils.queryClosest(cell, ".vuuTableRow");
|
|
43
|
+
if (row) {
|
|
44
|
+
const { ariaRowIndex } = row;
|
|
45
|
+
if (ariaRowIndex !== null) {
|
|
46
|
+
return parseInt(ariaRowIndex);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
throw Error("invalid aria-rowindex in table row");
|
|
50
|
+
};
|
|
51
|
+
const getTableCellBlock = (startCell, endCell) => {
|
|
52
|
+
const colStart = getColIndex(startCell);
|
|
53
|
+
const colEnd = getColIndex(endCell);
|
|
54
|
+
const rowStart = getRowIndex(startCell);
|
|
55
|
+
const rowEnd = getRowIndex(endCell);
|
|
56
|
+
const columnRange = {
|
|
57
|
+
from: Math.min(colStart, colEnd),
|
|
58
|
+
to: Math.max(colStart, colEnd)
|
|
59
|
+
};
|
|
60
|
+
const rowRange = {
|
|
61
|
+
from: Math.min(rowStart, rowEnd),
|
|
62
|
+
to: Math.max(rowStart, rowEnd)
|
|
63
|
+
};
|
|
64
|
+
return {
|
|
65
|
+
columnRange,
|
|
66
|
+
rowRange
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
const refState = {
|
|
70
|
+
cellBlock: null,
|
|
71
|
+
cellBlockClassName: "",
|
|
72
|
+
dragState: "pending",
|
|
73
|
+
endBox: { bottom: -1, left: Hi, right: -1, top: Hi },
|
|
74
|
+
endCell: null,
|
|
75
|
+
endPos: [-1, -1],
|
|
76
|
+
mousePosX: -1,
|
|
77
|
+
mousePosY: -1,
|
|
78
|
+
mouseStartX: -1,
|
|
79
|
+
mouseStartY: -1,
|
|
80
|
+
startBox: { bottom: -1, left: -1, right: -1, top: -1 },
|
|
81
|
+
startCell: null,
|
|
82
|
+
startPos: [-1, -1]
|
|
83
|
+
};
|
|
84
|
+
const updateCellBlockClassName = (state) => {
|
|
85
|
+
const { cellBlock, cellBlockClassName, startBox, endBox } = state;
|
|
86
|
+
const endBlockDirection = getEndCellDirection(startBox, endBox);
|
|
87
|
+
const newCellBlockClassName = `cellblock-direction-${endBlockDirection}`;
|
|
88
|
+
if (newCellBlockClassName !== cellBlockClassName) {
|
|
89
|
+
if (cellBlockClassName) {
|
|
90
|
+
cellBlock?.classList.replace(cellBlockClassName, newCellBlockClassName);
|
|
91
|
+
} else {
|
|
92
|
+
cellBlock?.classList.add(newCellBlockClassName);
|
|
93
|
+
}
|
|
94
|
+
state.cellBlockClassName = newCellBlockClassName;
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
const getTextFromCells = (startCell, endCell) => {
|
|
98
|
+
const tableBody = vuuUtils.queryClosest(
|
|
99
|
+
startCell,
|
|
100
|
+
".vuuTable-body",
|
|
101
|
+
true
|
|
102
|
+
);
|
|
103
|
+
const [startRow, startCol] = tableDomUtils.getTableCellPos(startCell);
|
|
104
|
+
const [endRow, endCol] = tableDomUtils.getTableCellPos(endCell);
|
|
105
|
+
const rowRange = {
|
|
106
|
+
from: Math.min(startRow, endRow),
|
|
107
|
+
to: Math.max(startRow, endRow)
|
|
108
|
+
};
|
|
109
|
+
const colRange = {
|
|
110
|
+
from: Math.min(startCol, endCol),
|
|
111
|
+
to: Math.max(startCol, endCol)
|
|
112
|
+
};
|
|
113
|
+
const results = [];
|
|
114
|
+
for (let rowIdx = rowRange.from; rowIdx <= rowRange.to; rowIdx++) {
|
|
115
|
+
const row = tableBody.querySelector(
|
|
116
|
+
`.vuuTableRow[aria-rowindex='${rowIdx + 1}']`
|
|
117
|
+
);
|
|
118
|
+
const rowData = [];
|
|
119
|
+
for (let colIdx = colRange.from; colIdx <= colRange.to; colIdx++) {
|
|
120
|
+
const cell = row?.querySelector(
|
|
121
|
+
`.vuuTableCell[aria-colindex='${colIdx + 1}']`
|
|
122
|
+
);
|
|
123
|
+
if (cell) {
|
|
124
|
+
rowData.push(cell.textContent ?? "");
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
results.push(rowData);
|
|
128
|
+
}
|
|
129
|
+
return results.map((r) => r.join(" ")).join("\n");
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
exports.getEndCellDirection = getEndCellDirection;
|
|
133
|
+
exports.getTableCellBlock = getTableCellBlock;
|
|
134
|
+
exports.getTextFromCells = getTextFromCells;
|
|
135
|
+
exports.isNullCellBox = isNullCellBox;
|
|
136
|
+
exports.outsideBox = outsideBox;
|
|
137
|
+
exports.refState = refState;
|
|
138
|
+
exports.setElementBox = setElementBox;
|
|
139
|
+
exports.updateCellBlockClassName = updateCellBlockClassName;
|
|
140
|
+
//# sourceMappingURL=cellblock-utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cellblock-utils.js","sources":["../../src/cell-block/cellblock-utils.ts"],"sourcesContent":["import { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { getTableCellPos } from \"../table-dom-utils\";\n\nexport type TableCellBlock = {\n columnRange: VuuRange;\n rowRange: VuuRange;\n};\n\nexport type CellBox = {\n bottom: number;\n left: number;\n right: number;\n top: number;\n};\n\nexport const isNullCellBox = ({ bottom, left, right, top }: CellBox) => {\n return bottom === -1 && left === -1 && right === -1 && top === -1;\n};\n\nconst Hi = Number.MAX_SAFE_INTEGER;\n\ntype EndCellDirection =\n | \"self\"\n | \"n\"\n | \"ne\"\n | \"e\"\n | \"se\"\n | \"s\"\n | \"sw\"\n | \"w\"\n | \"nw\";\n\nexport const getEndCellDirection = (\n startBox: CellBox,\n endBox: CellBox,\n): EndCellDirection => {\n const { bottom: sBottom, left: sLeft, right: sRight, top: sTop } = startBox;\n const { bottom: eBottom, left: eLeft, right: eRight, top: eTop } = endBox;\n const north = eTop < sTop;\n const east = eRight > sRight;\n const south = eBottom > sBottom;\n const west = eLeft < sLeft;\n\n if (north && east) return \"ne\";\n else if (south && east) return \"se\";\n else if (south && west) return \"sw\";\n else if (north && west) return \"nw\";\n else if (north) return \"n\";\n else if (east) return \"e\";\n else if (south) return \"s\";\n else if (west) return \"w\";\n else return \"self\";\n};\n\nexport const setElementBox = (el: HTMLElement, box: CellBox) => {\n const { bottom, left, right, top } = el.getBoundingClientRect();\n box.bottom = bottom;\n box.left = left;\n box.right = right;\n box.top = top;\n};\n\nexport const outsideBox = (\n { bottom, left, right, top }: CellBox,\n x: number,\n y: number,\n) => x < left || x > right || y < top || y > bottom;\n\nconst getColIndex = ({ ariaColIndex }: HTMLDivElement) => {\n if (ariaColIndex !== null) {\n return parseInt(ariaColIndex);\n }\n throw Error(\"invalid aria-colindex in table cell\");\n};\n\nconst getRowIndex = (cell: HTMLDivElement) => {\n const row = queryClosest<HTMLDivElement>(cell, \".vuuTableRow\");\n if (row) {\n const { ariaRowIndex } = row;\n if (ariaRowIndex !== null) {\n return parseInt(ariaRowIndex);\n }\n }\n throw Error(\"invalid aria-rowindex in table row\");\n};\n\nexport const getTableCellBlock = (\n startCell: HTMLDivElement,\n endCell: HTMLDivElement,\n): TableCellBlock => {\n const colStart = getColIndex(startCell);\n const colEnd = getColIndex(endCell);\n const rowStart = getRowIndex(startCell);\n const rowEnd = getRowIndex(endCell);\n\n const columnRange = {\n from: Math.min(colStart, colEnd),\n to: Math.max(colStart, colEnd),\n };\n const rowRange = {\n from: Math.min(rowStart, rowEnd),\n to: Math.max(rowStart, rowEnd),\n };\n\n return {\n columnRange,\n rowRange,\n };\n};\n\nexport type RefState = {\n dragState: \"pending\" | \"active\";\n cellBlock: HTMLDivElement | null;\n cellBlockClassName: string;\n endBox: CellBox;\n endCell: HTMLDivElement | null;\n endPos: PosTuple; // used during keyboard operation\n mousePosX: number;\n mousePosY: number;\n mouseStartX: number;\n mouseStartY: number;\n startCell: HTMLDivElement | null;\n startBox: CellBox;\n startPos: PosTuple; // used during keyboard operation\n};\n\nexport type PosTuple = [number, number];\n\nexport const refState: RefState = {\n cellBlock: null,\n cellBlockClassName: \"\",\n dragState: \"pending\",\n endBox: { bottom: -1, left: Hi, right: -1, top: Hi },\n endCell: null,\n endPos: [-1, -1],\n mousePosX: -1,\n mousePosY: -1,\n mouseStartX: -1,\n mouseStartY: -1,\n startBox: { bottom: -1, left: -1, right: -1, top: -1 },\n startCell: null,\n startPos: [-1, -1],\n} as const;\n\nexport const updateCellBlockClassName = (state: RefState) => {\n const { cellBlock, cellBlockClassName, startBox, endBox } = state;\n const endBlockDirection = getEndCellDirection(startBox, endBox);\n const newCellBlockClassName = `cellblock-direction-${endBlockDirection}`;\n if (newCellBlockClassName !== cellBlockClassName) {\n if (cellBlockClassName) {\n cellBlock?.classList.replace(cellBlockClassName, newCellBlockClassName);\n } else {\n cellBlock?.classList.add(newCellBlockClassName);\n }\n state.cellBlockClassName = newCellBlockClassName;\n }\n};\n\nexport const getTextFromCells = (\n startCell: HTMLDivElement,\n endCell: HTMLDivElement,\n) => {\n const tableBody = queryClosest<HTMLDivElement>(\n startCell,\n \".vuuTable-body\",\n true,\n );\n const [startRow, startCol] = getTableCellPos(startCell);\n const [endRow, endCol] = getTableCellPos(endCell);\n\n const rowRange = {\n from: Math.min(startRow, endRow),\n to: Math.max(startRow, endRow),\n };\n\n const colRange = {\n from: Math.min(startCol, endCol),\n to: Math.max(startCol, endCol),\n };\n\n const results: string[][] = [];\n for (let rowIdx = rowRange.from; rowIdx <= rowRange.to; rowIdx++) {\n const row = tableBody.querySelector(\n `.vuuTableRow[aria-rowindex='${rowIdx + 1}']`,\n );\n const rowData = [];\n for (let colIdx = colRange.from; colIdx <= colRange.to; colIdx++) {\n const cell = row?.querySelector(\n `.vuuTableCell[aria-colindex='${colIdx + 1}']`,\n );\n if (cell) {\n rowData.push(cell.textContent ?? \"\");\n }\n }\n results.push(rowData);\n }\n return results.map((r) => r.join(\"\\t\")).join(\"\\n\");\n};\n"],"names":["queryClosest","getTableCellPos"],"mappings":"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"}
|
|
@@ -0,0 +1,232 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
5
|
+
var react = require('react');
|
|
6
|
+
var tableDomUtils = require('../table-dom-utils.js');
|
|
7
|
+
var CellBlock = require('./CellBlock.js');
|
|
8
|
+
var cellblockUtils = require('./cellblock-utils.js');
|
|
9
|
+
|
|
10
|
+
const clone = (posTuple) => posTuple.slice();
|
|
11
|
+
const NullHandler = () => console.error("no handler installed");
|
|
12
|
+
const mouseHandlers = {
|
|
13
|
+
mouseMove: NullHandler,
|
|
14
|
+
mouseMovePreDrag: NullHandler,
|
|
15
|
+
mouseUp: NullHandler,
|
|
16
|
+
mouseUpPreDrag: NullHandler
|
|
17
|
+
};
|
|
18
|
+
const mouseType = (name) => name.startsWith("mouseMove") ? "mousemove" : "mouseup";
|
|
19
|
+
const DRAG_THRESHOLD = 5;
|
|
20
|
+
const useCellBlockSelection = ({
|
|
21
|
+
allowCellBlockSelection,
|
|
22
|
+
columnCount = 0,
|
|
23
|
+
containerRef,
|
|
24
|
+
focusCell,
|
|
25
|
+
onSelectCellBlock,
|
|
26
|
+
rowCount = 0
|
|
27
|
+
}) => {
|
|
28
|
+
const [cellBlock, setCellBlock] = react.useState(null);
|
|
29
|
+
const stateRef = react.useRef(cellblockUtils.refState);
|
|
30
|
+
const handlersRef = react.useRef(mouseHandlers);
|
|
31
|
+
const handleCopy = react.useCallback(async () => {
|
|
32
|
+
const { startCell, endCell } = stateRef.current;
|
|
33
|
+
if (startCell && endCell) {
|
|
34
|
+
const tsvText = cellblockUtils.getTextFromCells(startCell, endCell);
|
|
35
|
+
const type = "text/plain";
|
|
36
|
+
const blob = new Blob([tsvText], { type });
|
|
37
|
+
const data = [new ClipboardItem({ [type]: blob })];
|
|
38
|
+
await navigator.clipboard.write(data);
|
|
39
|
+
}
|
|
40
|
+
}, []);
|
|
41
|
+
const cellBlockRef = react.useCallback((el) => {
|
|
42
|
+
stateRef.current.cellBlock = el;
|
|
43
|
+
}, []);
|
|
44
|
+
const createCellBlock = react.useCallback(
|
|
45
|
+
(method = "mouse") => {
|
|
46
|
+
const { startBox, startCell } = stateRef.current;
|
|
47
|
+
if (startCell) {
|
|
48
|
+
const table = vuuUtils.queryClosest(startCell, ".vuuTable");
|
|
49
|
+
if (table) {
|
|
50
|
+
table.classList.add(`vuu-cellblock-select-in-progress-${method}`);
|
|
51
|
+
}
|
|
52
|
+
cellblockUtils.setElementBox(startCell, startBox);
|
|
53
|
+
startCell.classList.add("vuu-cellblock-start");
|
|
54
|
+
setCellBlock(/* @__PURE__ */ jsxRuntime.jsx(CellBlock.CellBlock, { onCopy: handleCopy, ref: cellBlockRef }));
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
[cellBlockRef, handleCopy]
|
|
58
|
+
);
|
|
59
|
+
const initializeStateRef = react.useCallback(() => {
|
|
60
|
+
const { cellBlock: cellBlock2, cellBlockClassName, startCell, endCell } = stateRef.current;
|
|
61
|
+
if (startCell) {
|
|
62
|
+
startCell.classList.remove("vuu-cellblock-start");
|
|
63
|
+
}
|
|
64
|
+
if (endCell) {
|
|
65
|
+
endCell.classList.remove("vuu-cellblock-end");
|
|
66
|
+
}
|
|
67
|
+
if (cellBlock2?.classList.contains(cellBlockClassName)) {
|
|
68
|
+
cellBlock2.classList.remove(cellBlockClassName);
|
|
69
|
+
}
|
|
70
|
+
const { endBox, startBox } = cellblockUtils.refState;
|
|
71
|
+
stateRef.current = {
|
|
72
|
+
...cellblockUtils.refState,
|
|
73
|
+
cellBlock: cellBlock2,
|
|
74
|
+
endBox: { ...endBox },
|
|
75
|
+
endPos: [-1, -1],
|
|
76
|
+
startBox: { ...startBox },
|
|
77
|
+
startPos: [-1, -1]
|
|
78
|
+
};
|
|
79
|
+
}, []);
|
|
80
|
+
const addMouseListener = react.useCallback(
|
|
81
|
+
(mouseOperation, handler) => {
|
|
82
|
+
window.addEventListener(mouseType(mouseOperation), handler);
|
|
83
|
+
handlersRef.current[mouseOperation] = handler;
|
|
84
|
+
},
|
|
85
|
+
[]
|
|
86
|
+
);
|
|
87
|
+
const removeMouseListener = react.useCallback((name) => {
|
|
88
|
+
window.removeEventListener(mouseType(name), handlersRef.current[name]);
|
|
89
|
+
}, []);
|
|
90
|
+
handlersRef.current.mouseMove = react.useCallback((evt) => {
|
|
91
|
+
const { clientX: x, clientY: y } = evt;
|
|
92
|
+
const { endBox, startBox } = stateRef.current;
|
|
93
|
+
if (cellblockUtils.outsideBox(startBox, x, y) && cellblockUtils.outsideBox(endBox, x, y)) {
|
|
94
|
+
const cell = vuuUtils.queryClosest(
|
|
95
|
+
evt.target,
|
|
96
|
+
".vuuTableCell, .vuuCellBlock"
|
|
97
|
+
);
|
|
98
|
+
if (cell?.classList.contains("vuuTableCell")) {
|
|
99
|
+
cellblockUtils.setElementBox(cell, endBox);
|
|
100
|
+
stateRef.current.endCell = cell;
|
|
101
|
+
cellblockUtils.updateCellBlockClassName(stateRef.current);
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}, []);
|
|
105
|
+
handlersRef.current.mouseUp = react.useCallback(
|
|
106
|
+
(evt) => {
|
|
107
|
+
removeMouseListener("mouseMove");
|
|
108
|
+
removeMouseListener("mouseUp");
|
|
109
|
+
const { cellBlock: cellBlock2, endCell, startCell } = stateRef.current;
|
|
110
|
+
const table = vuuUtils.queryClosest(evt.target, ".vuuTable");
|
|
111
|
+
endCell?.classList.add("vuu-cellblock-end");
|
|
112
|
+
if (table) {
|
|
113
|
+
table.classList.remove("vuu-cellblock-select-in-progress-mouse");
|
|
114
|
+
}
|
|
115
|
+
if (startCell && endCell) {
|
|
116
|
+
const tableCellBlock = cellblockUtils.getTableCellBlock(startCell, endCell);
|
|
117
|
+
onSelectCellBlock?.(tableCellBlock);
|
|
118
|
+
}
|
|
119
|
+
if (cellBlock2) {
|
|
120
|
+
cellBlock2.focus();
|
|
121
|
+
}
|
|
122
|
+
},
|
|
123
|
+
[onSelectCellBlock, removeMouseListener]
|
|
124
|
+
);
|
|
125
|
+
handlersRef.current.mouseMovePreDrag = react.useCallback(
|
|
126
|
+
(evt) => {
|
|
127
|
+
const { current: state } = stateRef;
|
|
128
|
+
const { mouseStartX, mouseStartY } = state;
|
|
129
|
+
const x = state.mousePosX = evt.clientX;
|
|
130
|
+
const y = state.mousePosY = evt.clientY;
|
|
131
|
+
const distance = Math.max(
|
|
132
|
+
Math.abs(x - mouseStartX),
|
|
133
|
+
Math.abs(y - mouseStartY)
|
|
134
|
+
);
|
|
135
|
+
if (distance > DRAG_THRESHOLD) {
|
|
136
|
+
createCellBlock("mouse");
|
|
137
|
+
const { mouseMove, mouseUp } = handlersRef.current;
|
|
138
|
+
removeMouseListener("mouseMovePreDrag");
|
|
139
|
+
removeMouseListener("mouseUpPreDrag");
|
|
140
|
+
addMouseListener("mouseMove", mouseMove);
|
|
141
|
+
addMouseListener("mouseUp", mouseUp);
|
|
142
|
+
}
|
|
143
|
+
},
|
|
144
|
+
[addMouseListener, createCellBlock, removeMouseListener]
|
|
145
|
+
);
|
|
146
|
+
handlersRef.current.mouseUpPreDrag = react.useCallback(() => {
|
|
147
|
+
removeMouseListener("mouseMovePreDrag");
|
|
148
|
+
removeMouseListener("mouseUpPreDrag");
|
|
149
|
+
}, [removeMouseListener]);
|
|
150
|
+
const handleMouseDown = react.useCallback(
|
|
151
|
+
(evt) => {
|
|
152
|
+
initializeStateRef();
|
|
153
|
+
const { current: state } = stateRef;
|
|
154
|
+
const cell = vuuUtils.queryClosest(evt.target, ".vuuTableCell");
|
|
155
|
+
if (cell) {
|
|
156
|
+
state.startCell = cell;
|
|
157
|
+
state.mouseStartX = evt.clientX;
|
|
158
|
+
state.mouseStartY = evt.clientY;
|
|
159
|
+
const { mouseMovePreDrag, mouseUpPreDrag } = handlersRef.current;
|
|
160
|
+
addMouseListener("mouseMovePreDrag", mouseMovePreDrag);
|
|
161
|
+
addMouseListener("mouseUpPreDrag", mouseUpPreDrag);
|
|
162
|
+
}
|
|
163
|
+
},
|
|
164
|
+
[addMouseListener, initializeStateRef]
|
|
165
|
+
);
|
|
166
|
+
const nativeKeyDownHandlerRef = react.useRef(NullHandler);
|
|
167
|
+
const handleNativeKeyUp = react.useCallback((evt) => {
|
|
168
|
+
if (evt.key === "Shift") {
|
|
169
|
+
const { endCell } = stateRef.current;
|
|
170
|
+
const table = vuuUtils.queryClosest(evt.target, ".vuuTable");
|
|
171
|
+
endCell?.classList.add("vuu-cellblock-end");
|
|
172
|
+
if (table) {
|
|
173
|
+
table.classList.remove("vuu-cellblock-select-in-progress-keyboard");
|
|
174
|
+
}
|
|
175
|
+
window.removeEventListener("keydown", nativeKeyDownHandlerRef.current, {
|
|
176
|
+
capture: true
|
|
177
|
+
});
|
|
178
|
+
window.removeEventListener("keyup", handleNativeKeyUp, {
|
|
179
|
+
capture: true
|
|
180
|
+
});
|
|
181
|
+
}
|
|
182
|
+
}, []);
|
|
183
|
+
const handleNativeKeyDown = nativeKeyDownHandlerRef.current = react.useCallback(
|
|
184
|
+
({ key }) => {
|
|
185
|
+
if (vuuUtils.isArrowKey(key)) {
|
|
186
|
+
const { endBox, endPos, startBox } = stateRef.current;
|
|
187
|
+
if (cellblockUtils.isNullCellBox(startBox)) {
|
|
188
|
+
createCellBlock("keyboard");
|
|
189
|
+
}
|
|
190
|
+
const nextCell = tableDomUtils.getNextCellPos(key, endPos, columnCount, rowCount);
|
|
191
|
+
stateRef.current.endPos = nextCell;
|
|
192
|
+
focusCell(nextCell);
|
|
193
|
+
const cell = tableDomUtils.getTableCell(containerRef, nextCell);
|
|
194
|
+
stateRef.current.endCell = cell;
|
|
195
|
+
cellblockUtils.setElementBox(cell, endBox);
|
|
196
|
+
cellblockUtils.updateCellBlockClassName(stateRef.current);
|
|
197
|
+
}
|
|
198
|
+
},
|
|
199
|
+
[columnCount, containerRef, createCellBlock, focusCell, rowCount]
|
|
200
|
+
);
|
|
201
|
+
const handleKeyDown = react.useCallback(
|
|
202
|
+
(evt) => {
|
|
203
|
+
if (evt.key === "Shift") {
|
|
204
|
+
initializeStateRef();
|
|
205
|
+
const cell = vuuUtils.queryClosest(evt.target, ".vuuTableCell");
|
|
206
|
+
if (cell) {
|
|
207
|
+
const startPos = tableDomUtils.getTableCellPos(cell);
|
|
208
|
+
stateRef.current.startPos = startPos;
|
|
209
|
+
stateRef.current.endPos = clone(startPos);
|
|
210
|
+
const { current: state } = stateRef;
|
|
211
|
+
state.startCell = cell;
|
|
212
|
+
window.addEventListener("keydown", handleNativeKeyDown, {
|
|
213
|
+
capture: true
|
|
214
|
+
});
|
|
215
|
+
window.addEventListener("keyup", handleNativeKeyUp, {
|
|
216
|
+
capture: true
|
|
217
|
+
});
|
|
218
|
+
evt.preventDefault();
|
|
219
|
+
}
|
|
220
|
+
}
|
|
221
|
+
},
|
|
222
|
+
[handleNativeKeyDown, handleNativeKeyUp, initializeStateRef]
|
|
223
|
+
);
|
|
224
|
+
return {
|
|
225
|
+
cellBlock,
|
|
226
|
+
onKeyDown: allowCellBlockSelection ? handleKeyDown : void 0,
|
|
227
|
+
onMouseDown: allowCellBlockSelection ? handleMouseDown : void 0
|
|
228
|
+
};
|
|
229
|
+
};
|
|
230
|
+
|
|
231
|
+
exports.useCellBlockSelection = useCellBlockSelection;
|
|
232
|
+
//# sourceMappingURL=useCellBlockSelection.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCellBlockSelection.js","sources":["../../src/cell-block/useCellBlockSelection.tsx"],"sourcesContent":["import { isArrowKey, queryClosest } from \"@vuu-ui/vuu-utils\";\nimport {\n KeyboardEventHandler,\n MouseEventHandler,\n ReactElement,\n RefCallback,\n RefObject,\n useCallback,\n useRef,\n useState,\n} from \"react\";\nimport {\n getNextCellPos,\n getTableCell,\n getTableCellPos,\n} from \"../table-dom-utils\";\nimport { FocusCell } from \"../useCellFocus\";\nimport { CellBlock } from \"./CellBlock\";\nimport {\n PosTuple,\n RefState,\n TableCellBlock,\n getTableCellBlock,\n getTextFromCells,\n isNullCellBox,\n outsideBox,\n refState,\n setElementBox,\n updateCellBlockClassName,\n} from \"./cellblock-utils\";\n\nconst clone = (posTuple: PosTuple) => posTuple.slice() as PosTuple;\n\ntype NativeKeyboardHandler = (evt: KeyboardEvent) => void;\ntype NativeMouseHandler = (evt: MouseEvent) => void;\ntype MouseHandlers = {\n mouseMove: NativeMouseHandler;\n mouseMovePreDrag: NativeMouseHandler;\n mouseUp: NativeMouseHandler;\n mouseUpPreDrag: NativeMouseHandler;\n};\n\nconst NullHandler = () => console.error(\"no handler installed\");\nconst mouseHandlers: MouseHandlers = {\n mouseMove: NullHandler,\n mouseMovePreDrag: NullHandler,\n mouseUp: NullHandler,\n mouseUpPreDrag: NullHandler,\n};\n\ntype MouseOperation = keyof typeof mouseHandlers;\n\nconst mouseType = (name: string) =>\n name.startsWith(\"mouseMove\") ? \"mousemove\" : \"mouseup\";\n\nconst DRAG_THRESHOLD = 5;\n\nexport interface CellblockSelectionHookProps {\n allowCellBlockSelection?: boolean;\n columnCount?: number;\n containerRef: RefObject<HTMLElement>;\n focusCell: FocusCell;\n onSelectCellBlock?: (cellBlock: TableCellBlock) => void;\n rowCount?: number;\n}\n\nexport const useCellBlockSelection = ({\n allowCellBlockSelection,\n columnCount = 0,\n containerRef,\n focusCell,\n onSelectCellBlock,\n rowCount = 0,\n}: CellblockSelectionHookProps) => {\n const [cellBlock, setCellBlock] = useState<ReactElement | null>(null);\n const stateRef = useRef<RefState>(refState);\n const handlersRef = useRef<MouseHandlers>(mouseHandlers);\n\n const handleCopy = useCallback(async () => {\n const { startCell, endCell } = stateRef.current;\n if (startCell && endCell) {\n const tsvText = getTextFromCells(startCell, endCell);\n const type = \"text/plain\";\n const blob = new Blob([tsvText], { type });\n const data = [new ClipboardItem({ [type]: blob })];\n await navigator.clipboard.write(data);\n }\n }, []);\n\n const cellBlockRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n stateRef.current.cellBlock = el;\n }, []);\n\n const createCellBlock = useCallback(\n (method: \"mouse\" | \"keyboard\" = \"mouse\") => {\n const { startBox, startCell } = stateRef.current;\n if (startCell) {\n const table = queryClosest<HTMLDivElement>(startCell, \".vuuTable\");\n if (table) {\n table.classList.add(`vuu-cellblock-select-in-progress-${method}`);\n }\n setElementBox(startCell, startBox);\n startCell.classList.add(\"vuu-cellblock-start\");\n setCellBlock(<CellBlock onCopy={handleCopy} ref={cellBlockRef} />);\n }\n },\n [cellBlockRef, handleCopy],\n );\n\n const initializeStateRef = useCallback(() => {\n const { cellBlock, cellBlockClassName, startCell, endCell } =\n stateRef.current;\n if (startCell) {\n startCell.classList.remove(\"vuu-cellblock-start\");\n }\n if (endCell) {\n endCell.classList.remove(\"vuu-cellblock-end\");\n }\n if (cellBlock?.classList.contains(cellBlockClassName)) {\n cellBlock.classList.remove(cellBlockClassName);\n }\n\n const { endBox, startBox } = refState;\n\n stateRef.current = {\n ...refState,\n cellBlock,\n endBox: { ...endBox },\n endPos: [-1, -1],\n startBox: { ...startBox },\n startPos: [-1, -1],\n };\n }, []);\n\n const addMouseListener = useCallback(\n (mouseOperation: MouseOperation, handler: NativeMouseHandler) => {\n window.addEventListener(mouseType(mouseOperation), handler);\n handlersRef.current[mouseOperation] = handler;\n },\n [],\n );\n\n const removeMouseListener = useCallback((name: MouseOperation) => {\n window.removeEventListener(mouseType(name), handlersRef.current[name]);\n }, []);\n\n handlersRef.current.mouseMove = useCallback((evt: MouseEvent) => {\n const { clientX: x, clientY: y } = evt;\n const { endBox, startBox } = stateRef.current;\n if (outsideBox(startBox, x, y) && outsideBox(endBox, x, y)) {\n const cell = queryClosest<HTMLDivElement>(\n evt.target,\n \".vuuTableCell, .vuuCellBlock\",\n );\n if (cell?.classList.contains(\"vuuTableCell\")) {\n setElementBox(cell, endBox);\n stateRef.current.endCell = cell;\n updateCellBlockClassName(stateRef.current);\n }\n }\n }, []);\n\n handlersRef.current.mouseUp = useCallback(\n (evt: MouseEvent) => {\n removeMouseListener(\"mouseMove\");\n removeMouseListener(\"mouseUp\");\n\n const { cellBlock, endCell, startCell } = stateRef.current;\n\n const table = queryClosest<HTMLDivElement>(evt.target, \".vuuTable\");\n endCell?.classList.add(\"vuu-cellblock-end\");\n if (table) {\n table.classList.remove(\"vuu-cellblock-select-in-progress-mouse\");\n }\n\n if (startCell && endCell) {\n const tableCellBlock = getTableCellBlock(startCell, endCell);\n onSelectCellBlock?.(tableCellBlock);\n }\n\n if (cellBlock) {\n cellBlock.focus();\n }\n },\n [onSelectCellBlock, removeMouseListener],\n );\n\n handlersRef.current.mouseMovePreDrag = useCallback(\n (evt: MouseEvent) => {\n const { current: state } = stateRef;\n const { mouseStartX, mouseStartY } = state;\n\n const x = (state.mousePosX = evt.clientX);\n const y = (state.mousePosY = evt.clientY);\n\n const distance = Math.max(\n Math.abs(x - mouseStartX),\n Math.abs(y - mouseStartY),\n );\n\n if (distance > DRAG_THRESHOLD) {\n createCellBlock(\"mouse\");\n\n const { mouseMove, mouseUp } = handlersRef.current;\n removeMouseListener(\"mouseMovePreDrag\");\n removeMouseListener(\"mouseUpPreDrag\");\n addMouseListener(\"mouseMove\", mouseMove);\n addMouseListener(\"mouseUp\", mouseUp);\n }\n },\n [addMouseListener, createCellBlock, removeMouseListener],\n );\n\n handlersRef.current.mouseUpPreDrag = useCallback(() => {\n removeMouseListener(\"mouseMovePreDrag\");\n removeMouseListener(\"mouseUpPreDrag\");\n }, [removeMouseListener]);\n\n const handleMouseDown = useCallback<MouseEventHandler>(\n (evt) => {\n initializeStateRef();\n const { current: state } = stateRef;\n const cell = queryClosest<HTMLDivElement>(evt.target, \".vuuTableCell\");\n if (cell) {\n state.startCell = cell;\n state.mouseStartX = evt.clientX;\n state.mouseStartY = evt.clientY;\n\n const { mouseMovePreDrag, mouseUpPreDrag } = handlersRef.current;\n addMouseListener(\"mouseMovePreDrag\", mouseMovePreDrag);\n addMouseListener(\"mouseUpPreDrag\", mouseUpPreDrag);\n }\n },\n [addMouseListener, initializeStateRef],\n );\n\n const nativeKeyDownHandlerRef = useRef<NativeKeyboardHandler>(NullHandler);\n\n const handleNativeKeyUp = useCallback((evt: KeyboardEvent) => {\n if (evt.key === \"Shift\") {\n const { endCell } = stateRef.current;\n const table = queryClosest<HTMLDivElement>(evt.target, \".vuuTable\");\n endCell?.classList.add(\"vuu-cellblock-end\");\n if (table) {\n table.classList.remove(\"vuu-cellblock-select-in-progress-keyboard\");\n }\n\n window.removeEventListener(\"keydown\", nativeKeyDownHandlerRef.current, {\n capture: true,\n });\n window.removeEventListener(\"keyup\", handleNativeKeyUp, {\n capture: true,\n });\n }\n }, []);\n const handleNativeKeyDown = (nativeKeyDownHandlerRef.current = useCallback(\n ({ key }: KeyboardEvent) => {\n if (isArrowKey(key)) {\n const { endBox, endPos, startBox } = stateRef.current;\n if (isNullCellBox(startBox)) {\n createCellBlock(\"keyboard\");\n }\n const nextCell = getNextCellPos(key, endPos, columnCount, rowCount);\n stateRef.current.endPos = nextCell;\n focusCell(nextCell);\n const cell = getTableCell(containerRef, nextCell);\n stateRef.current.endCell = cell as HTMLDivElement;\n setElementBox(cell, endBox);\n updateCellBlockClassName(stateRef.current);\n }\n },\n [columnCount, containerRef, createCellBlock, focusCell, rowCount],\n ));\n const handleKeyDown = useCallback<KeyboardEventHandler>(\n (evt) => {\n if (evt.key === \"Shift\") {\n initializeStateRef();\n const cell = queryClosest<HTMLDivElement>(evt.target, \".vuuTableCell\");\n if (cell) {\n const startPos = getTableCellPos(cell);\n stateRef.current.startPos = startPos;\n stateRef.current.endPos = clone(startPos);\n const { current: state } = stateRef;\n state.startCell = cell;\n\n window.addEventListener(\"keydown\", handleNativeKeyDown, {\n capture: true,\n });\n window.addEventListener(\"keyup\", handleNativeKeyUp, {\n capture: true,\n });\n\n evt.preventDefault();\n }\n }\n },\n [handleNativeKeyDown, handleNativeKeyUp, initializeStateRef],\n );\n\n return {\n cellBlock,\n onKeyDown: allowCellBlockSelection ? handleKeyDown : undefined,\n onMouseDown: allowCellBlockSelection ? handleMouseDown : undefined,\n };\n};\n"],"names":["useState","useRef","refState","useCallback","getTextFromCells","queryClosest","setElementBox","CellBlock","cellBlock","outsideBox","updateCellBlockClassName","getTableCellBlock","isArrowKey","isNullCellBox","getNextCellPos","getTableCell","getTableCellPos"],"mappings":"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"}
|
package/cjs/index.js
CHANGED
|
@@ -14,6 +14,7 @@ var tableConfig = require('./table-config.js');
|
|
|
14
14
|
var HeaderProvider = require('./table-header/HeaderProvider.js');
|
|
15
15
|
var TableHeader = require('./table-header/TableHeader.js');
|
|
16
16
|
var useControlledTableNavigation = require('./useControlledTableNavigation.js');
|
|
17
|
+
var useKeyboardNavigation = require('./useKeyboardNavigation.js');
|
|
17
18
|
var useTableModel = require('./useTableModel.js');
|
|
18
19
|
var useTableScroll = require('./useTableScroll.js');
|
|
19
20
|
var useTableViewport = require('./useTableViewport.js');
|
|
@@ -35,7 +36,11 @@ exports.updateTableConfig = tableConfig.updateTableConfig;
|
|
|
35
36
|
exports.HeaderProvider = HeaderProvider.HeaderProvider;
|
|
36
37
|
exports.useHeaderProps = HeaderProvider.useHeaderProps;
|
|
37
38
|
exports.TableHeader = TableHeader.TableHeader;
|
|
39
|
+
exports.isRowSelectionKey = useControlledTableNavigation.isRowSelectionKey;
|
|
38
40
|
exports.useControlledTableNavigation = useControlledTableNavigation.useControlledTableNavigation;
|
|
41
|
+
exports.isNavigationKey = useKeyboardNavigation.isNavigationKey;
|
|
42
|
+
exports.isPagingKey = useKeyboardNavigation.isPagingKey;
|
|
43
|
+
exports.useKeyboardNavigation = useKeyboardNavigation.useKeyboardNavigation;
|
|
39
44
|
exports.isShowColumnSettings = useTableModel.isShowColumnSettings;
|
|
40
45
|
exports.isShowTableSettings = useTableModel.isShowTableSettings;
|
|
41
46
|
exports.useTableModel = useTableModel.useTableModel;
|
package/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/cjs/moving-window.js
CHANGED
|
@@ -3,28 +3,36 @@
|
|
|
3
3
|
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
4
4
|
|
|
5
5
|
var __defProp = Object.defineProperty;
|
|
6
|
+
var __typeError = (msg) => {
|
|
7
|
+
throw TypeError(msg);
|
|
8
|
+
};
|
|
6
9
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
7
10
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
11
|
+
var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
|
|
12
|
+
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
13
|
+
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
14
|
+
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
|
|
15
|
+
var _range;
|
|
8
16
|
const { SELECTED } = vuuUtils.metadataKeys;
|
|
9
17
|
class MovingWindow {
|
|
10
18
|
constructor({ from, to }) {
|
|
11
19
|
__publicField(this, "data");
|
|
12
20
|
__publicField(this, "rowCount", 0);
|
|
13
|
-
|
|
21
|
+
__privateAdd(this, _range);
|
|
14
22
|
__publicField(this, "setRowCount", (rowCount) => {
|
|
15
23
|
if (rowCount < this.data.length) {
|
|
16
24
|
this.data.length = rowCount;
|
|
17
25
|
}
|
|
18
26
|
this.rowCount = rowCount;
|
|
19
27
|
});
|
|
20
|
-
this
|
|
28
|
+
__privateSet(this, _range, new vuuUtils.WindowRange(from, to));
|
|
21
29
|
this.data = new Array(Math.max(0, to - from));
|
|
22
30
|
this.rowCount = 0;
|
|
23
31
|
}
|
|
24
32
|
add(data) {
|
|
25
33
|
const [index] = data;
|
|
26
34
|
if (this.isWithinRange(index)) {
|
|
27
|
-
const internalIndex = index - this.
|
|
35
|
+
const internalIndex = index - __privateGet(this, _range).from;
|
|
28
36
|
this.data[internalIndex] = data;
|
|
29
37
|
if (data[SELECTED]) {
|
|
30
38
|
const previousRow = this.data[internalIndex - 1];
|
|
@@ -36,14 +44,14 @@ class MovingWindow {
|
|
|
36
44
|
}
|
|
37
45
|
}
|
|
38
46
|
getAtIndex(index) {
|
|
39
|
-
return this.
|
|
47
|
+
return __privateGet(this, _range).isWithin(index) && this.data[index - __privateGet(this, _range).from] != null ? this.data[index - __privateGet(this, _range).from] : void 0;
|
|
40
48
|
}
|
|
41
49
|
isWithinRange(index) {
|
|
42
|
-
return this.
|
|
50
|
+
return __privateGet(this, _range).isWithin(index);
|
|
43
51
|
}
|
|
44
52
|
setRange({ from, to }) {
|
|
45
|
-
if (from !== this.
|
|
46
|
-
const [overlapFrom, overlapTo] = this.
|
|
53
|
+
if (from !== __privateGet(this, _range).from || to !== __privateGet(this, _range).to) {
|
|
54
|
+
const [overlapFrom, overlapTo] = __privateGet(this, _range).overlap(from, to);
|
|
47
55
|
const newData = new Array(Math.max(0, to - from));
|
|
48
56
|
for (let i = overlapFrom; i < overlapTo; i++) {
|
|
49
57
|
const data = this.getAtIndex(i);
|
|
@@ -53,14 +61,18 @@ class MovingWindow {
|
|
|
53
61
|
}
|
|
54
62
|
}
|
|
55
63
|
this.data = newData;
|
|
56
|
-
this.
|
|
57
|
-
this.
|
|
64
|
+
__privateGet(this, _range).from = from;
|
|
65
|
+
__privateGet(this, _range).to = to;
|
|
58
66
|
}
|
|
59
67
|
}
|
|
60
68
|
getSelectedRows() {
|
|
61
69
|
return this.data.filter((row) => row[SELECTED] !== 0);
|
|
62
70
|
}
|
|
71
|
+
get range() {
|
|
72
|
+
return __privateGet(this, _range);
|
|
73
|
+
}
|
|
63
74
|
}
|
|
75
|
+
_range = new WeakMap();
|
|
64
76
|
|
|
65
77
|
exports.MovingWindow = MovingWindow;
|
|
66
78
|
//# sourceMappingURL=moving-window.js.map
|
package/cjs/moving-window.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"moving-window.js","sources":["../src/moving-window.ts"],"sourcesContent":["import { DataSourceRow } from \"@vuu-ui/vuu-data-types\";\nimport {\n isRowSelectedLast,\n metadataKeys,\n WindowRange,\n} from \"@vuu-ui/vuu-utils\";\nimport { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\n\nconst { SELECTED } = metadataKeys;\n\nexport class MovingWindow {\n public data: DataSourceRow[];\n public rowCount = 0;\n
|
|
1
|
+
{"version":3,"file":"moving-window.js","sources":["../src/moving-window.ts"],"sourcesContent":["import { DataSourceRow } from \"@vuu-ui/vuu-data-types\";\nimport {\n isRowSelectedLast,\n metadataKeys,\n WindowRange,\n} from \"@vuu-ui/vuu-utils\";\nimport { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\n\nconst { SELECTED } = metadataKeys;\n\nexport class MovingWindow {\n public data: DataSourceRow[];\n public rowCount = 0;\n #range: WindowRange;\n\n constructor({ from, to }: VuuRange) {\n this.#range = new WindowRange(from, to);\n //internal data is always 0 based, we add range.from to determine an offset\n this.data = new Array(Math.max(0, to - from));\n this.rowCount = 0;\n }\n\n setRowCount = (rowCount: number) => {\n if (rowCount < this.data.length) {\n this.data.length = rowCount;\n }\n\n this.rowCount = rowCount;\n };\n\n add(data: DataSourceRow) {\n const [index] = data;\n if (this.isWithinRange(index)) {\n const internalIndex = index - this.#range.from;\n this.data[internalIndex] = data;\n\n // Hack until we can deal with this more elegantly. When we have a block\n // select operation, first row is selected (and updated via server), then\n // remaining rows are selected when we select the block-end row. We get an\n // update for all rows except first. Because we're extending the select status\n // on the client, we have to adjust the first row selected (its still selected\n // but is no longer the 'last selected row in block')\n // Maybe answer is to apply ALL the selection status code here, not in Viewport\n if (data[SELECTED]) {\n const previousRow = this.data[internalIndex - 1];\n if (isRowSelectedLast(previousRow)) {\n this.data[internalIndex - 1] = previousRow.slice() as DataSourceRow;\n this.data[internalIndex - 1][SELECTED] -= 4;\n }\n }\n }\n }\n\n getAtIndex(index: number) {\n return this.#range.isWithin(index) &&\n this.data[index - this.#range.from] != null\n ? this.data[index - this.#range.from]\n : undefined;\n }\n\n isWithinRange(index: number) {\n return this.#range.isWithin(index);\n }\n\n setRange({ from, to }: VuuRange) {\n if (from !== this.#range.from || to !== this.#range.to) {\n const [overlapFrom, overlapTo] = this.#range.overlap(from, to);\n const newData = new Array(Math.max(0, to - from));\n for (let i = overlapFrom; i < overlapTo; i++) {\n const data = this.getAtIndex(i);\n if (data) {\n const index = i - from;\n newData[index] = data;\n }\n }\n this.data = newData;\n this.#range.from = from;\n this.#range.to = to;\n }\n }\n\n getSelectedRows() {\n return this.data.filter((row) => row[SELECTED] !== 0);\n }\n\n get range() {\n return this.#range;\n }\n}\n"],"names":["metadataKeys","WindowRange","isRowSelectedLast"],"mappings":"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"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var paginationControlCss = ".vuuPaginationControl {\n padding: 0 var(--salt-spacing-100);\n .saltButton {\n .saltIcon {\n display: block !important;\n }\n }\n}\n";
|
|
4
|
+
|
|
5
|
+
module.exports = paginationControlCss;
|
|
6
|
+
//# sourceMappingURL=PaginationControl.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PaginationControl.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var styles = require('@salt-ds/styles');
|
|
5
|
+
var window = require('@salt-ds/window');
|
|
6
|
+
var core = require('@salt-ds/core');
|
|
7
|
+
var cx = require('clsx');
|
|
8
|
+
var usePagination = require('./usePagination.js');
|
|
9
|
+
var PaginationControl$1 = require('./PaginationControl.css.js');
|
|
10
|
+
var react = require('react');
|
|
11
|
+
|
|
12
|
+
const classBase = "vuuPaginationControl";
|
|
13
|
+
const PaginationControl = react.forwardRef(function PaginationControl2({ className, dataSource, ...htmlAttributes }, forwardedRef) {
|
|
14
|
+
const targetWindow = window.useWindow();
|
|
15
|
+
styles.useComponentCssInjection({
|
|
16
|
+
testId: "vuu-table",
|
|
17
|
+
css: PaginationControl$1,
|
|
18
|
+
window: targetWindow
|
|
19
|
+
});
|
|
20
|
+
const { onPageChange, pageCount } = usePagination.usePagination({
|
|
21
|
+
dataSource
|
|
22
|
+
});
|
|
23
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
24
|
+
"div",
|
|
25
|
+
{
|
|
26
|
+
...htmlAttributes,
|
|
27
|
+
className: cx(classBase, className),
|
|
28
|
+
ref: forwardedRef,
|
|
29
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(core.Pagination, { count: pageCount, onPageChange, children: [
|
|
30
|
+
/* @__PURE__ */ jsxRuntime.jsx(core.GoToInput, {}),
|
|
31
|
+
/* @__PURE__ */ jsxRuntime.jsx(core.Paginator, {})
|
|
32
|
+
] })
|
|
33
|
+
}
|
|
34
|
+
);
|
|
35
|
+
});
|
|
36
|
+
|
|
37
|
+
exports.PaginationControl = PaginationControl;
|
|
38
|
+
//# sourceMappingURL=PaginationControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PaginationControl.js","sources":["../../src/pagination/PaginationControl.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { GoToInput, Pagination, Paginator } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { usePagination } from \"./usePagination\";\n\nimport paginationControlCss from \"./PaginationControl.css\";\nimport { HtmlHTMLAttributes, forwardRef } from \"react\";\nimport { DataSource } from \"@vuu-ui/vuu-data-types\";\n\nconst classBase = \"vuuPaginationControl\";\n\nexport interface PaginationControlProps\n extends HtmlHTMLAttributes<HTMLDivElement> {\n dataSource: DataSource;\n}\n\nexport const PaginationControl = forwardRef<\n HTMLDivElement,\n PaginationControlProps\n>(function PaginationControl(\n { className, dataSource, ...htmlAttributes },\n forwardedRef,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-table\",\n css: paginationControlCss,\n window: targetWindow,\n });\n\n const { onPageChange, pageCount } = usePagination({\n dataSource,\n });\n\n return (\n <div\n {...htmlAttributes}\n className={cx(classBase, className)}\n ref={forwardedRef}\n >\n <Pagination count={pageCount} onPageChange={onPageChange}>\n <GoToInput />\n <Paginator />\n </Pagination>\n </div>\n );\n});\n"],"names":["forwardRef","PaginationControl","useWindow","useComponentCssInjection","paginationControlCss","usePagination","jsx","jsxs","Pagination","GoToInput","Paginator"],"mappings":";;;;;;;;;;;AAUA,MAAM,SAAY,GAAA,sBAAA,CAAA;AAOL,MAAA,iBAAA,GAAoBA,gBAG/B,CAAA,SAASC,kBACT,CAAA,EAAE,WAAW,UAAY,EAAA,GAAG,cAAe,EAAA,EAC3C,YACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,YAAA,EAAc,SAAU,EAAA,GAAIC,2BAAc,CAAA;AAAA,IAChD,UAAA;AAAA,GACD,CAAA,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,GAAK,EAAA,YAAA;AAAA,MAEL,QAAC,kBAAAC,eAAA,CAAAC,eAAA,EAAA,EAAW,KAAO,EAAA,SAAA,EAAW,YAC5B,EAAA,QAAA,EAAA;AAAA,wBAAAF,cAAA,CAACG,cAAU,EAAA,EAAA,CAAA;AAAA,uCACVC,cAAU,EAAA,EAAA,CAAA;AAAA,OACb,EAAA,CAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ,CAAC;;;;"}
|