@pinnacle0/web-ui 0.4.4 → 0.4.6
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/core/VirtualTable/TableHeader.d.ts +3 -3
- package/core/VirtualTable/TableHeader.js +2 -2
- package/core/VirtualTable/TableHeader.js.map +1 -1
- package/core/VirtualTable/TableRow.d.ts +3 -3
- package/core/VirtualTable/TableRow.js +2 -2
- package/core/VirtualTable/TableRow.js.map +1 -1
- package/core/VirtualTable/hooks/useColumns.d.ts +14 -11
- package/core/VirtualTable/hooks/useColumns.js +23 -35
- package/core/VirtualTable/hooks/useColumns.js.map +1 -1
- package/core/VirtualTable/hooks/useScroll.d.ts +7 -1
- package/core/VirtualTable/hooks/useScroll.js +39 -3
- package/core/VirtualTable/hooks/useScroll.js.map +1 -1
- package/core/VirtualTable/index.js +4 -4
- package/core/VirtualTable/index.js.map +1 -1
- package/core/VirtualTable/type.d.ts +3 -0
- package/package.json +1 -1
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import type { VirtualTableColumn,
|
|
2
|
+
import type { VirtualTableColumn, ColumnsStickyPosition } from "./type";
|
|
3
3
|
interface Props<RowType extends object> {
|
|
4
4
|
headerRef: React.MutableRefObject<HTMLDivElement | null>;
|
|
5
5
|
headerHeight: number;
|
|
6
6
|
columns: VirtualTableColumn<RowType>[];
|
|
7
|
-
|
|
7
|
+
columnsStickyPosition: ColumnsStickyPosition;
|
|
8
8
|
}
|
|
9
|
-
export declare const TableHeader: <RowType extends object>({ headerRef, headerHeight, columns,
|
|
9
|
+
export declare const TableHeader: <RowType extends object>({ headerRef, headerHeight, columns, columnsStickyPosition }: Props<RowType>) => JSX.Element;
|
|
10
10
|
export {};
|
|
@@ -2,10 +2,10 @@ import React from "react";
|
|
|
2
2
|
import { ReactUtil } from "../../util/ReactUtil";
|
|
3
3
|
import { classNames } from "../../util/ClassNames";
|
|
4
4
|
export var TableHeader = ReactUtil.memo("TableHeader", function (_a) {
|
|
5
|
-
var headerRef = _a.headerRef, headerHeight = _a.headerHeight, columns = _a.columns,
|
|
5
|
+
var headerRef = _a.headerRef, headerHeight = _a.headerHeight, columns = _a.columns, columnsStickyPosition = _a.columnsStickyPosition;
|
|
6
6
|
return (React.createElement("div", { className: "table-headers", ref: headerRef, style: { height: headerHeight, width: scrollX || "100%" } }, columns.map(function (_a, columnIndex) {
|
|
7
7
|
var title = _a.title, width = _a.width, align = _a.align, fixed = _a.fixed, display = _a.display;
|
|
8
|
-
var stickyPosition =
|
|
8
|
+
var stickyPosition = columnsStickyPosition[columnIndex];
|
|
9
9
|
return (React.createElement("div", { className: classNames("table-header", { fixed: fixed, left: fixed === "left", right: fixed === "right", last: stickyPosition === null || stickyPosition === void 0 ? void 0 : stickyPosition.isLast }), key: columnIndex, style: {
|
|
10
10
|
display: display !== "hidden" ? "flex" : "none",
|
|
11
11
|
flex: "1 0 ".concat(width, "px"),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableHeader.js","sourceRoot":"","sources":["../../../src/core/VirtualTable/TableHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAC,UAAU,EAAC,MAAM,uBAAuB,CAAC;AAUjD,MAAM,CAAC,IAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,aAAa,EAAE,UAAkC,
|
|
1
|
+
{"version":3,"file":"TableHeader.js","sourceRoot":"","sources":["../../../src/core/VirtualTable/TableHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAC,UAAU,EAAC,MAAM,uBAAuB,CAAC;AAUjD,MAAM,CAAC,IAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,aAAa,EAAE,UAAkC,EAAyE;QAAxE,SAAS,eAAA,EAAE,YAAY,kBAAA,EAAE,OAAO,aAAA,EAAE,qBAAqB,2BAAA;IAC/I,OAAO,CACH,6BAAK,SAAS,EAAC,eAAe,EAAC,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,EAAC,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,IAAI,MAAM,EAAC,IACjG,OAAO,CAAC,GAAG,CAAC,UAAC,EAAqC,EAAE,WAAW;YAAjD,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,OAAO,aAAA;QAC9C,IAAM,cAAc,GAAG,qBAAqB,CAAC,WAAW,CAAC,CAAC;QAC1D,OAAO,CACH,6BACI,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,EAAC,KAAK,OAAA,EAAE,IAAI,EAAE,KAAK,KAAK,MAAM,EAAE,KAAK,EAAE,KAAK,KAAK,OAAO,EAAE,IAAI,EAAE,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,MAAM,EAAC,CAAC,EAC9H,GAAG,EAAE,WAAW,EAChB,KAAK,EAAE;gBACH,OAAO,EAAE,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;gBAC/C,IAAI,EAAE,cAAO,KAAK,OAAI;gBACtB,SAAS,EAAE,KAAK;gBAChB,IAAI,EAAE,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,CAAC,CAAC,CAAC,SAAS;gBAC1D,KAAK,EAAE,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,CAAC,CAAC,CAAC,SAAS;aAC/D,IAEA,KAAK,CACJ,CACT,CAAC;IACN,CAAC,CAAC,CACA,CACT,CAAC;AACN,CAAC,CAAC,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { VirtualItem } from "@tanstack/react-virtual";
|
|
3
|
-
import type { VirtualTableColumn,
|
|
3
|
+
import type { VirtualTableColumn, ColumnsStickyPosition } from "./type";
|
|
4
4
|
interface Props<RowType extends object> {
|
|
5
5
|
data: RowType;
|
|
6
6
|
columns: VirtualTableColumn<RowType>[];
|
|
@@ -8,9 +8,9 @@ interface Props<RowType extends object> {
|
|
|
8
8
|
columnWidths: number[];
|
|
9
9
|
rowHeight: number;
|
|
10
10
|
scrollBarSize: number;
|
|
11
|
-
|
|
11
|
+
columnsStickyPosition: ColumnsStickyPosition;
|
|
12
12
|
rowClassName?: string;
|
|
13
13
|
onRowClick?: (record: RowType, rowIndex: number) => void;
|
|
14
14
|
}
|
|
15
|
-
export declare const TableRow: <RowType extends object>({ virtualItem, data, columns, columnWidths, rowHeight, scrollBarSize,
|
|
15
|
+
export declare const TableRow: <RowType extends object>({ virtualItem, data, columns, columnWidths, rowHeight, scrollBarSize, columnsStickyPosition, rowClassName, onRowClick }: Props<RowType>) => JSX.Element;
|
|
16
16
|
export {};
|
|
@@ -27,7 +27,7 @@ import React from "react";
|
|
|
27
27
|
import { ReactUtil } from "../../util/ReactUtil";
|
|
28
28
|
import { classNames } from "../../util/ClassNames";
|
|
29
29
|
export var TableRow = ReactUtil.memo("TableRow", function (_a) {
|
|
30
|
-
var virtualItem = _a.virtualItem, data = _a.data, columns = _a.columns, columnWidths = _a.columnWidths, rowHeight = _a.rowHeight, scrollBarSize = _a.scrollBarSize,
|
|
30
|
+
var virtualItem = _a.virtualItem, data = _a.data, columns = _a.columns, columnWidths = _a.columnWidths, rowHeight = _a.rowHeight, scrollBarSize = _a.scrollBarSize, columnsStickyPosition = _a.columnsStickyPosition, rowClassName = _a.rowClassName, onRowClick = _a.onRowClick;
|
|
31
31
|
var rowIndex = virtualItem.index;
|
|
32
32
|
var lastShownColumnIndex = React.useMemo(function () { return columns.length - 1 - __spreadArray([], __read(columns), false).reverse().findIndex(function (_) { return _.display !== "hidden"; }); }, [columns]);
|
|
33
33
|
return (React.createElement("div", { key: rowIndex, className: classNames("table-row", rowClassName, rowIndex % 2 ? "odd" : "even"), style: { transform: "translateY(".concat(virtualItem.start, "px)") }, onClick: function () { return onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(data, rowIndex); } }, columns.map(function (column, columnIndex) {
|
|
@@ -37,7 +37,7 @@ export var TableRow = ReactUtil.memo("TableRow", function (_a) {
|
|
|
37
37
|
var renderData = column.display !== "hidden" && column.renderData(data, rowIndex);
|
|
38
38
|
// minus the scroll bar size of the last column & minus the scroll bar size in the right sticky value of the right fixed columns
|
|
39
39
|
var isLastShownColumn = lastShownColumnIndex === columnIndex;
|
|
40
|
-
var stickyPosition =
|
|
40
|
+
var stickyPosition = columnsStickyPosition[columnIndex];
|
|
41
41
|
return (renderData && (React.createElement("div", { className: classNames("table-cell", { fixed: column.fixed, left: column.fixed === "left", right: column.fixed === "right", last: stickyPosition === null || stickyPosition === void 0 ? void 0 : stickyPosition.isLast }), key: columnIndex, style: {
|
|
42
42
|
height: rowHeight,
|
|
43
43
|
width: cellWidth - (isLastShownColumn ? scrollBarSize : 0),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../src/core/VirtualTable/TableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAC,UAAU,EAAC,MAAM,uBAAuB,CAAC;AAgBjD,MAAM,CAAC,IAAM,QAAQ,GAAG,SAAS,CAAC,IAAI,CAAC,UAAU,EAAE,UAEjD,
|
|
1
|
+
{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../src/core/VirtualTable/TableRow.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,15 +1,22 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import type { VirtualTableColumn,
|
|
2
|
+
import type { VirtualTableColumn, ColumnsStickyPosition } from "../type";
|
|
3
3
|
interface Props<RowType extends object> {
|
|
4
4
|
columns: VirtualTableColumn<RowType>[];
|
|
5
|
-
scrollContentRef: React.RefObject<HTMLDivElement>;
|
|
6
|
-
isScrollable: boolean;
|
|
7
5
|
}
|
|
8
|
-
|
|
6
|
+
/**
|
|
7
|
+
*
|
|
8
|
+
* VirtualTable is not crated by <table>, the header cell width cannot auto align the body cell width which has large content.
|
|
9
|
+
* So VirtualTable get the columns widths by following steps:
|
|
10
|
+
* 1. Only render the headers with flex style
|
|
11
|
+
* 2. Get the widths of the table headers in ref
|
|
12
|
+
* 3. Calculate the sticky position of the fixed column/header if exists
|
|
13
|
+
* 4. Render the table body columns with the headers widths gotten in step 2
|
|
14
|
+
*
|
|
15
|
+
*/
|
|
16
|
+
export declare function useColumns<RowType extends object>({ columns }: Props<RowType>): {
|
|
9
17
|
columnWidths: number[];
|
|
10
18
|
getColumnWidths: () => void;
|
|
11
|
-
|
|
12
|
-
scrollBarSize: number;
|
|
19
|
+
columnsStickyPosition: ColumnsStickyPosition;
|
|
13
20
|
headerRef: React.MutableRefObject<HTMLDivElement | null>;
|
|
14
21
|
};
|
|
15
22
|
/**
|
|
@@ -24,9 +31,5 @@ export declare const useColumnWidths: () => {
|
|
|
24
31
|
getColumnWidths: () => void;
|
|
25
32
|
headerRef: React.MutableRefObject<HTMLDivElement | null>;
|
|
26
33
|
};
|
|
27
|
-
export declare const
|
|
28
|
-
export declare const useScrollBar: (scrollContentRef: React.RefObject<HTMLDivElement>) => {
|
|
29
|
-
scrollBarSize: number;
|
|
30
|
-
calculateScrollBarSize: () => void;
|
|
31
|
-
};
|
|
34
|
+
export declare const useColumnsStickyPosition: <RowType extends object>(columns: VirtualTableColumn<RowType>[], columnWidths: number[]) => ColumnsStickyPosition;
|
|
32
35
|
export {};
|
|
@@ -17,23 +17,30 @@ var __read = (this && this.__read) || function (o, n) {
|
|
|
17
17
|
import React from "react";
|
|
18
18
|
import { useDebounce } from "../../../hooks/useDebounce";
|
|
19
19
|
import { ArrayUtil } from "../../../internal/ArrayUtil";
|
|
20
|
+
/**
|
|
21
|
+
*
|
|
22
|
+
* VirtualTable is not crated by <table>, the header cell width cannot auto align the body cell width which has large content.
|
|
23
|
+
* So VirtualTable get the columns widths by following steps:
|
|
24
|
+
* 1. Only render the headers with flex style
|
|
25
|
+
* 2. Get the widths of the table headers in ref
|
|
26
|
+
* 3. Calculate the sticky position of the fixed column/header if exists
|
|
27
|
+
* 4. Render the table body columns with the headers widths gotten in step 2
|
|
28
|
+
*
|
|
29
|
+
*/
|
|
20
30
|
export function useColumns(_a) {
|
|
21
|
-
var columns = _a.columns
|
|
31
|
+
var columns = _a.columns;
|
|
22
32
|
var _b = useColumnWidths(), columnWidths = _b.columnWidths, headerRef = _b.headerRef, getColumnWidths = _b.getColumnWidths;
|
|
23
|
-
var
|
|
24
|
-
var _c = useScrollBar(scrollContentRef), scrollBarSize = _c.scrollBarSize, calculateScrollBarSize = _c.calculateScrollBarSize;
|
|
33
|
+
var columnsStickyPosition = useColumnsStickyPosition(columns, columnWidths);
|
|
25
34
|
var debouncedGetColumnWidths = useDebounce(getColumnWidths);
|
|
26
|
-
var debouncedCalculateScrollBarSize = useDebounce(calculateScrollBarSize);
|
|
27
35
|
var handler = React.useCallback(function (event) {
|
|
28
36
|
if (event.currentTarget && "querySelector" in event.currentTarget && headerRef.current) {
|
|
29
37
|
var element = event.currentTarget;
|
|
30
38
|
var result = element.querySelector(".g-virtual-table");
|
|
31
39
|
if (result) {
|
|
32
40
|
debouncedGetColumnWidths();
|
|
33
|
-
debouncedCalculateScrollBarSize();
|
|
34
41
|
}
|
|
35
42
|
}
|
|
36
|
-
}, [headerRef, debouncedGetColumnWidths
|
|
43
|
+
}, [headerRef, debouncedGetColumnWidths]);
|
|
37
44
|
React.useEffect(function () {
|
|
38
45
|
document.body.addEventListener("transitionend", handler);
|
|
39
46
|
document.body.addEventListener("animationend", handler);
|
|
@@ -42,14 +49,10 @@ export function useColumns(_a) {
|
|
|
42
49
|
document.body.removeEventListener("animationend", handler);
|
|
43
50
|
};
|
|
44
51
|
}, [handler]);
|
|
45
|
-
React.useEffect(function () {
|
|
46
|
-
calculateScrollBarSize();
|
|
47
|
-
}, [isScrollable, columnWidths, calculateScrollBarSize]);
|
|
48
52
|
return {
|
|
49
53
|
columnWidths: columnWidths,
|
|
50
54
|
getColumnWidths: getColumnWidths,
|
|
51
|
-
|
|
52
|
-
scrollBarSize: scrollBarSize,
|
|
55
|
+
columnsStickyPosition: columnsStickyPosition,
|
|
53
56
|
headerRef: headerRef,
|
|
54
57
|
};
|
|
55
58
|
}
|
|
@@ -75,38 +78,23 @@ export var useColumnWidths = function () {
|
|
|
75
78
|
}, [headerRef]);
|
|
76
79
|
return { columnWidths: columnWidths, getColumnWidths: getColumnWidths, headerRef: headerRef };
|
|
77
80
|
};
|
|
78
|
-
export var
|
|
81
|
+
export var useColumnsStickyPosition = function (columns, columnWidths) {
|
|
79
82
|
return React.useMemo(function () {
|
|
80
|
-
var
|
|
81
|
-
var
|
|
82
|
-
var
|
|
83
|
+
var columnsStickyPosition = {};
|
|
84
|
+
var leftColumnsStackPositionValue = 0;
|
|
85
|
+
var rightColumnsStackPositionValue = 0;
|
|
83
86
|
var leftFixedCols = ArrayUtil.compactMap(columns, function (_, columnIndex) { return (_.fixed === "left" ? { columnIndex: columnIndex, width: columnWidths[columnIndex] || 0 } : null); });
|
|
84
87
|
// the right sticky value stack in reverse direction
|
|
85
88
|
var rightFixedCols = ArrayUtil.compactMap(columns, function (_, columnIndex) { return (_.fixed === "right" ? { columnIndex: columnIndex, width: columnWidths[columnIndex] || 0 } : null); }).reverse();
|
|
86
89
|
leftFixedCols.forEach(function (column, idx) {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
stickyPositionMap[column.columnIndex] = { value: stackedPositionValue, isLast: idx === leftFixedCols.length - 1 };
|
|
90
|
+
columnsStickyPosition[column.columnIndex] = { value: leftColumnsStackPositionValue, isLast: idx === leftFixedCols.length - 1 };
|
|
91
|
+
leftColumnsStackPositionValue += column.width;
|
|
90
92
|
});
|
|
91
93
|
rightFixedCols.forEach(function (column, idx) {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
stickyPositionMap[column.columnIndex] = { value: stackedPositionValue, isLast: idx === rightFixedCols.length - 1 };
|
|
94
|
+
columnsStickyPosition[column.columnIndex] = { value: rightColumnsStackPositionValue, isLast: idx === rightFixedCols.length - 1 };
|
|
95
|
+
rightColumnsStackPositionValue += column.width;
|
|
95
96
|
});
|
|
96
|
-
return
|
|
97
|
+
return columnsStickyPosition;
|
|
97
98
|
}, [columnWidths, columns]);
|
|
98
99
|
};
|
|
99
|
-
export var useScrollBar = function (scrollContentRef) {
|
|
100
|
-
var _a = __read(React.useState(0), 2), scrollBarSize = _a[0], setScrollBarSize = _a[1];
|
|
101
|
-
var calculateScrollBarSize = React.useCallback(function () {
|
|
102
|
-
if (scrollContentRef.current) {
|
|
103
|
-
var _a = scrollContentRef.current, clientWidth = _a.clientWidth, offsetWidth = _a.offsetWidth;
|
|
104
|
-
setScrollBarSize(offsetWidth - clientWidth);
|
|
105
|
-
}
|
|
106
|
-
}, [scrollContentRef, setScrollBarSize]);
|
|
107
|
-
return {
|
|
108
|
-
scrollBarSize: scrollBarSize,
|
|
109
|
-
calculateScrollBarSize: calculateScrollBarSize,
|
|
110
|
-
};
|
|
111
|
-
};
|
|
112
100
|
//# sourceMappingURL=useColumns.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColumns.js","sourceRoot":"","sources":["../../../../src/core/VirtualTable/hooks/useColumns.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,WAAW,EAAC,MAAM,4BAA4B,CAAC;AACvD,OAAO,EAAC,SAAS,EAAC,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"useColumns.js","sourceRoot":"","sources":["../../../../src/core/VirtualTable/hooks/useColumns.ts"],"names":[],"mappings":"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"}
|
|
@@ -2,10 +2,16 @@ import React from "react";
|
|
|
2
2
|
interface Props {
|
|
3
3
|
scrollContentRef: React.RefObject<HTMLDivElement>;
|
|
4
4
|
headerRef: React.RefObject<HTMLDivElement>;
|
|
5
|
+
isScrollable: boolean;
|
|
5
6
|
}
|
|
6
|
-
export declare const useScroll: ({ scrollContentRef, headerRef }: Props) => {
|
|
7
|
+
export declare const useScroll: ({ scrollContentRef, headerRef, isScrollable }: Props) => {
|
|
7
8
|
onScroll: () => void;
|
|
9
|
+
scrollBarSize: number;
|
|
8
10
|
tableBodyRef: (node: HTMLDivElement) => void;
|
|
9
11
|
};
|
|
10
12
|
export declare const useScrollToEdge: (scrollContentRef: React.RefObject<HTMLDivElement>) => () => void;
|
|
13
|
+
export declare const useScrollBarSize: (scrollContentRef: React.RefObject<HTMLDivElement>, isScrollable: boolean) => {
|
|
14
|
+
scrollBarSize: number;
|
|
15
|
+
calculateScrollBarSize: () => void;
|
|
16
|
+
};
|
|
11
17
|
export {};
|
|
@@ -1,7 +1,24 @@
|
|
|
1
|
+
var __read = (this && this.__read) || function (o, n) {
|
|
2
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
3
|
+
if (!m) return o;
|
|
4
|
+
var i = m.call(o), r, ar = [], e;
|
|
5
|
+
try {
|
|
6
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
7
|
+
}
|
|
8
|
+
catch (error) { e = { error: error }; }
|
|
9
|
+
finally {
|
|
10
|
+
try {
|
|
11
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
12
|
+
}
|
|
13
|
+
finally { if (e) throw e.error; }
|
|
14
|
+
}
|
|
15
|
+
return ar;
|
|
16
|
+
};
|
|
1
17
|
import React from "react";
|
|
2
18
|
export var useScroll = function (_a) {
|
|
3
|
-
var scrollContentRef = _a.scrollContentRef, headerRef = _a.headerRef;
|
|
19
|
+
var scrollContentRef = _a.scrollContentRef, headerRef = _a.headerRef, isScrollable = _a.isScrollable;
|
|
4
20
|
var checkIsScrollToEdge = useScrollToEdge(scrollContentRef);
|
|
21
|
+
var _b = useScrollBarSize(scrollContentRef, isScrollable), scrollBarSize = _b.scrollBarSize, calculateScrollBarSize = _b.calculateScrollBarSize;
|
|
5
22
|
var onScroll = React.useCallback(function () {
|
|
6
23
|
requestAnimationFrame(function () {
|
|
7
24
|
if (scrollContentRef.current && headerRef.current && scrollContentRef.current.scrollLeft !== headerRef.current.scrollLeft) {
|
|
@@ -10,16 +27,19 @@ export var useScroll = function (_a) {
|
|
|
10
27
|
}
|
|
11
28
|
});
|
|
12
29
|
}, [scrollContentRef, headerRef, checkIsScrollToEdge]);
|
|
13
|
-
var tableBodyRef = function (node) {
|
|
30
|
+
var tableBodyRef = React.useCallback(function (node) {
|
|
14
31
|
if (node) {
|
|
15
32
|
checkIsScrollToEdge();
|
|
33
|
+
calculateScrollBarSize();
|
|
16
34
|
}
|
|
17
|
-
};
|
|
35
|
+
}, [calculateScrollBarSize, checkIsScrollToEdge]);
|
|
18
36
|
return {
|
|
19
37
|
onScroll: onScroll,
|
|
38
|
+
scrollBarSize: scrollBarSize,
|
|
20
39
|
tableBodyRef: tableBodyRef,
|
|
21
40
|
};
|
|
22
41
|
};
|
|
42
|
+
// for the box shadow transition of the fixed columns
|
|
23
43
|
export var useScrollToEdge = function (scrollContentRef) {
|
|
24
44
|
var checkIsScrollToEdge = React.useCallback(function () {
|
|
25
45
|
if (scrollContentRef.current) {
|
|
@@ -32,4 +52,20 @@ export var useScrollToEdge = function (scrollContentRef) {
|
|
|
32
52
|
}, [scrollContentRef]);
|
|
33
53
|
return checkIsScrollToEdge;
|
|
34
54
|
};
|
|
55
|
+
export var useScrollBarSize = function (scrollContentRef, isScrollable) {
|
|
56
|
+
var _a = __read(React.useState(0), 2), scrollBarSize = _a[0], setScrollBarSize = _a[1];
|
|
57
|
+
var calculateScrollBarSize = React.useCallback(function () {
|
|
58
|
+
if (scrollContentRef.current) {
|
|
59
|
+
var _a = scrollContentRef.current, clientWidth = _a.clientWidth, offsetWidth = _a.offsetWidth;
|
|
60
|
+
setScrollBarSize(offsetWidth - clientWidth);
|
|
61
|
+
}
|
|
62
|
+
}, [scrollContentRef, setScrollBarSize]);
|
|
63
|
+
React.useEffect(function () {
|
|
64
|
+
calculateScrollBarSize();
|
|
65
|
+
}, [calculateScrollBarSize, isScrollable]);
|
|
66
|
+
return {
|
|
67
|
+
scrollBarSize: scrollBarSize,
|
|
68
|
+
calculateScrollBarSize: calculateScrollBarSize,
|
|
69
|
+
};
|
|
70
|
+
};
|
|
35
71
|
//# sourceMappingURL=useScroll.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useScroll.js","sourceRoot":"","sources":["../../../../src/core/VirtualTable/hooks/useScroll.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"useScroll.js","sourceRoot":"","sources":["../../../../src/core/VirtualTable/hooks/useScroll.ts"],"names":[],"mappings":"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"}
|
|
@@ -29,8 +29,8 @@ export var VirtualTable = Object.assign(function (_a) {
|
|
|
29
29
|
getColumnWidths();
|
|
30
30
|
},
|
|
31
31
|
});
|
|
32
|
-
var _d = useColumns({ columns: transformedColumns
|
|
33
|
-
var _e = useScroll({ scrollContentRef: scrollContentRef, headerRef: headerRef }), onScroll = _e.onScroll, tableBodyRef = _e.tableBodyRef;
|
|
32
|
+
var _d = useColumns({ columns: transformedColumns }), headerRef = _d.headerRef, columnWidths = _d.columnWidths, getColumnWidths = _d.getColumnWidths, columnsStickyPosition = _d.columnsStickyPosition;
|
|
33
|
+
var _e = useScroll({ scrollContentRef: scrollContentRef, headerRef: headerRef, isScrollable: isVerticalScrollable }), onScroll = _e.onScroll, scrollBarSize = _e.scrollBarSize, tableBodyRef = _e.tableBodyRef;
|
|
34
34
|
// TODO/David: This is temporary fix of issue: https://github.com/TanStack/virtual/issues/363, please remove the code after update
|
|
35
35
|
var virtualizerRef = React.useRef(rowVirtualizer);
|
|
36
36
|
virtualizerRef.current = rowVirtualizer;
|
|
@@ -44,11 +44,11 @@ export var VirtualTable = Object.assign(function (_a) {
|
|
|
44
44
|
React.createElement(Spin, { spinning: loading }))),
|
|
45
45
|
React.createElement("div", { className: "scroll-content", ref: scrollContentRef, style: { height: "calc(100% - ".concat(headerHeight, "px)"), top: headerHeight }, onScroll: onScroll },
|
|
46
46
|
React.createElement("div", { className: "table", style: { height: totalSize } },
|
|
47
|
-
React.createElement(TableHeader, { headerRef: headerRef, headerHeight: headerHeight, columns: transformedColumns,
|
|
47
|
+
React.createElement(TableHeader, { headerRef: headerRef, headerHeight: headerHeight, columns: transformedColumns, columnsStickyPosition: columnsStickyPosition }),
|
|
48
48
|
columnWidths.length > 0 && (React.createElement("div", { className: "table-body", ref: tableBodyRef }, dataSource.length === 0
|
|
49
49
|
? emptyElement
|
|
50
50
|
: rowVirtualizer
|
|
51
51
|
.getVirtualItems()
|
|
52
|
-
.map(function (virtualItem) { return (React.createElement(TableRow, { key: virtualItem.key, rowHeight: rowHeight, onRowClick: onRowClick, virtualItem: virtualItem, data: dataSource[virtualItem.index], columns: transformedColumns, columnWidths: columnWidths, scrollBarSize: scrollBarSize,
|
|
52
|
+
.map(function (virtualItem) { return (React.createElement(TableRow, { key: virtualItem.key, rowHeight: rowHeight, onRowClick: onRowClick, virtualItem: virtualItem, data: dataSource[virtualItem.index], columns: transformedColumns, columnWidths: columnWidths, scrollBarSize: scrollBarSize, columnsStickyPosition: columnsStickyPosition, rowClassName: rowClassName })); })))))));
|
|
53
53
|
}, { displayName: "VirtualTable" });
|
|
54
54
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/VirtualTable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,wCAAwC,CAAC;AAChD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,cAAc,EAAE,kBAAkB,EAAC,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAC,UAAU,EAAC,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAC,IAAI,EAAC,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAC;AACpC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAC,eAAe,EAAC,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAC,UAAU,EAAC,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAC,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAC5C,OAAO,cAAc,CAAC;AAEtB,IAAM,4BAA4B,GAAG,EAAE,CAAC;AAwBxC,MAAM,CAAC,IAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CACrC,UAAkC,EAcL;QAbzB,OAAO,aAAA,EACP,SAAS,eAAA,EACT,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,OAAO,aAAA,EACP,gBAAgB,sBAAA,EAChB,UAAU,gBAAA,EACV,OAAO,aAAA,EACP,OAAO,aAAA,EACP,YAAY,kBAAA,EACZ,oBAAiB,EAAjB,YAAY,mBAAG,EAAE,KAAA,EACjB,cAAgB,EAAhB,MAAM,mBAAG,OAAO,KAAA;IAEhB,IAAM,KAAK,GAAG,UAAU,CAAC,MAAM,CAAC;IAChC,IAAM,gBAAgB,GAAG,KAAK,CAAC,MAAM,CAAwB,IAAI,CAAC,CAAC;IACnE,IAAM,SAAS,GAAG,KAAK,GAAG,SAAS,CAAC;IACpC,IAAM,oBAAoB,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,GAAG,gBAAgB,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC;IAClH,IAAM,sBAAsB,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,OAAO,CAAC,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC;IAC9I,IAAM,eAAe,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,GAAG,YAAY,GAAG,CAAC,sBAAsB,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IAChI,IAAM,YAAY,GAAG,gBAAgB,IAAI,MAAM,CAAC;IAEhD,IAAM,kBAAkB,GAAG,eAAe,CAAC,EAAC,OAAO,SAAA,EAAE,UAAU,YAAA,EAAE,MAAM,QAAA,EAAE,YAAY,cAAA,EAAC,CAAC,CAAC;IACxF,IAAM,cAAc,GAAG,cAAc,CAAC;QAClC,KAAK,OAAA;QACL,gBAAgB,EAAE,cAAM,OAAA,gBAAgB,CAAC,OAAO,EAAxB,CAAwB;QAChD,YAAY,EAAE,cAAM,OAAA,SAAS,EAAT,CAAS;QAC7B,kBAAkB,EAAE,UAAC,QAAQ,EAAE,EAAE;YAC7B,kBAAkB,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;YACjC,eAAe,EAAE,CAAC;QACtB,CAAC;KACJ,CAAC,CAAC;IACG,IAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/VirtualTable/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
declare type ColumnIndex = number;
|
|
2
3
|
export declare type ColumnFixedPosition = "left" | "right";
|
|
3
4
|
export interface StickyPosition {
|
|
4
5
|
value: number;
|
|
5
6
|
isLast: boolean;
|
|
6
7
|
}
|
|
8
|
+
export declare type ColumnsStickyPosition = Record<ColumnIndex, StickyPosition>;
|
|
7
9
|
/**
|
|
8
10
|
* Similar usage of Antd Table but only support partial features: fixed columns, row selection, on row click
|
|
9
11
|
*/
|
|
@@ -41,3 +43,4 @@ export declare type VirtualTableColumn<RowType extends object> = {
|
|
|
41
43
|
*/
|
|
42
44
|
colSpan?: (record: RowType, rowIndex: number, colIndex: number) => number;
|
|
43
45
|
};
|
|
46
|
+
export {};
|