@firecms/core 3.0.0-canary.85 → 3.0.0-canary.86
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/VirtualTable/VirtualTableProps.d.ts +10 -6
- package/dist/index.es.js +30 -9
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +30 -9
- package/dist/index.umd.js.map +1 -1
- package/dist/types/datasource.d.ts +4 -0
- package/package.json +6 -6
- package/src/components/SelectableTable/SelectableTable.tsx +0 -1
- package/src/components/VirtualTable/VirtualTable.tsx +33 -9
- package/src/components/VirtualTable/VirtualTableProps.tsx +12 -8
- package/src/types/datasource.ts +5 -0
|
@@ -25,10 +25,6 @@ export interface VirtualTableProps<T extends Record<string, any>> {
|
|
|
25
25
|
* The renderer receives props `{ cellData, columns, column, columnIndex, rowData, rowIndex, container, isScrolling }`
|
|
26
26
|
*/
|
|
27
27
|
cellRenderer: React.ComponentType<CellRendererParams<T>>;
|
|
28
|
-
/**
|
|
29
|
-
* If enabled, content is loaded in batch
|
|
30
|
-
*/
|
|
31
|
-
paginationEnabled?: boolean;
|
|
32
28
|
/**
|
|
33
29
|
* Set this callback if you want to support some combinations
|
|
34
30
|
* of filter combinations only.
|
|
@@ -40,6 +36,10 @@ export interface VirtualTableProps<T extends Record<string, any>> {
|
|
|
40
36
|
* A callback function when scrolling the table to near the end
|
|
41
37
|
*/
|
|
42
38
|
onEndReached?: () => void;
|
|
39
|
+
/**
|
|
40
|
+
* Offset in pixels where the onEndReached callback is triggered
|
|
41
|
+
*/
|
|
42
|
+
endOffset?: number;
|
|
43
43
|
/**
|
|
44
44
|
* When the pagination should be reset. E.g. the filters or sorting
|
|
45
45
|
* has been reset.
|
|
@@ -119,8 +119,12 @@ export interface VirtualTableProps<T extends Record<string, any>> {
|
|
|
119
119
|
* @param column
|
|
120
120
|
*/
|
|
121
121
|
AddColumnComponent?: React.ComponentType;
|
|
122
|
+
/**
|
|
123
|
+
* Debug mode
|
|
124
|
+
*/
|
|
125
|
+
debug?: boolean;
|
|
122
126
|
}
|
|
123
|
-
export type CellRendererParams<T
|
|
127
|
+
export type CellRendererParams<T = any> = {
|
|
124
128
|
column: VirtualTableColumn;
|
|
125
129
|
columns: VirtualTableColumn[];
|
|
126
130
|
columnIndex: number;
|
|
@@ -133,7 +137,7 @@ export type CellRendererParams<T extends any = any> = {
|
|
|
133
137
|
* @see Table
|
|
134
138
|
* @group Components
|
|
135
139
|
*/
|
|
136
|
-
export interface VirtualTableColumn<CustomProps
|
|
140
|
+
export interface VirtualTableColumn<CustomProps = any> {
|
|
137
141
|
/**
|
|
138
142
|
* Data key for the cell value, could be "a.b.c"
|
|
139
143
|
*/
|
package/dist/index.es.js
CHANGED
|
@@ -9052,6 +9052,7 @@ const VirtualTable = React__default.memo(
|
|
|
9052
9052
|
data,
|
|
9053
9053
|
onResetPagination,
|
|
9054
9054
|
onEndReached,
|
|
9055
|
+
endOffset = 600,
|
|
9055
9056
|
rowHeight = 54,
|
|
9056
9057
|
columns: columnsProp,
|
|
9057
9058
|
onRowClick,
|
|
@@ -9071,7 +9072,8 @@ const VirtualTable = React__default.memo(
|
|
|
9071
9072
|
style,
|
|
9072
9073
|
className,
|
|
9073
9074
|
endAdornment,
|
|
9074
|
-
AddColumnComponent
|
|
9075
|
+
AddColumnComponent,
|
|
9076
|
+
debug
|
|
9075
9077
|
}) {
|
|
9076
9078
|
const sortByProperty = sortBy ? sortBy[0] : void 0;
|
|
9077
9079
|
const currentSort = sortBy ? sortBy[1] : void 0;
|
|
@@ -9083,9 +9085,13 @@ const VirtualTable = React__default.memo(
|
|
|
9083
9085
|
}, [columnsProp]);
|
|
9084
9086
|
const [measureRef, bounds] = useMeasure();
|
|
9085
9087
|
const onColumnResizeInternal = useCallback((params) => {
|
|
9088
|
+
if (debug)
|
|
9089
|
+
console.log("onColumnResizeInternal", params);
|
|
9086
9090
|
setColumns(columns.map((column) => column.key === params.column.key ? params.column : column));
|
|
9087
9091
|
}, [columns]);
|
|
9088
9092
|
const onColumnResizeEndInternal = useCallback((params) => {
|
|
9093
|
+
if (debug)
|
|
9094
|
+
console.log("onColumnResizeEndInternal", params);
|
|
9089
9095
|
setColumns(columns.map((column) => column.key === params.column.key ? params.column : column));
|
|
9090
9096
|
if (onColumnResize) {
|
|
9091
9097
|
onColumnResize(params);
|
|
@@ -9093,15 +9099,21 @@ const VirtualTable = React__default.memo(
|
|
|
9093
9099
|
}, [columns, onColumnResize]);
|
|
9094
9100
|
const filterRef = useRef();
|
|
9095
9101
|
useEffect(() => {
|
|
9102
|
+
if (debug)
|
|
9103
|
+
console.log("Filter updated", filterInput);
|
|
9096
9104
|
filterRef.current = filterInput;
|
|
9097
9105
|
}, [filterInput]);
|
|
9098
9106
|
const scrollToTop = useCallback(() => {
|
|
9107
|
+
if (debug)
|
|
9108
|
+
console.log("scrollToTop");
|
|
9099
9109
|
endReachCallbackThreshold.current = 0;
|
|
9100
9110
|
if (tableRef.current) {
|
|
9101
9111
|
tableRef.current.scrollTo(tableRef.current?.scrollLeft, 0);
|
|
9102
9112
|
}
|
|
9103
9113
|
}, []);
|
|
9104
9114
|
const onColumnSort = useCallback((key) => {
|
|
9115
|
+
if (debug)
|
|
9116
|
+
console.log("onColumnSort", key);
|
|
9105
9117
|
const isDesc = sortByProperty === key && currentSort === "desc";
|
|
9106
9118
|
const isAsc = sortByProperty === key && currentSort === "asc";
|
|
9107
9119
|
const newSort = isAsc ? "desc" : isDesc ? void 0 : "asc";
|
|
@@ -9122,26 +9134,34 @@ const VirtualTable = React__default.memo(
|
|
|
9122
9134
|
}
|
|
9123
9135
|
scrollToTop();
|
|
9124
9136
|
}, [checkFilterCombination, currentSort, onFilterUpdate, onResetPagination, onSortByUpdate, scrollToTop, sortByProperty]);
|
|
9125
|
-
useCallback(() => {
|
|
9126
|
-
endReachCallbackThreshold.current = 0;
|
|
9127
|
-
if (onSortByUpdate)
|
|
9128
|
-
onSortByUpdate(void 0);
|
|
9129
|
-
}, [onSortByUpdate]);
|
|
9130
9137
|
const maxScroll = Math.max((data?.length ?? 0) * rowHeight - bounds.height, 0);
|
|
9138
|
+
if (debug)
|
|
9139
|
+
console.log("maxScroll", maxScroll);
|
|
9131
9140
|
const onEndReachedInternal = useCallback((scrollOffset) => {
|
|
9132
|
-
if (
|
|
9141
|
+
if (debug)
|
|
9142
|
+
console.log("onEndReachedInternal", scrollOffset, endReachCallbackThreshold.current + endOffset);
|
|
9143
|
+
if (onEndReached && (data?.length ?? 0) > 0 && scrollOffset > endReachCallbackThreshold.current + endOffset) {
|
|
9133
9144
|
endReachCallbackThreshold.current = scrollOffset;
|
|
9134
9145
|
onEndReached();
|
|
9135
9146
|
}
|
|
9136
9147
|
}, [data?.length, onEndReached]);
|
|
9137
9148
|
const onScroll = useCallback(({
|
|
9149
|
+
scrollDirection,
|
|
9138
9150
|
scrollOffset,
|
|
9139
9151
|
scrollUpdateWasRequested
|
|
9140
9152
|
}) => {
|
|
9141
|
-
if (
|
|
9153
|
+
if (debug)
|
|
9154
|
+
console.log("onScroll", {
|
|
9155
|
+
scrollDirection,
|
|
9156
|
+
scrollOffset,
|
|
9157
|
+
scrollUpdateWasRequested
|
|
9158
|
+
});
|
|
9159
|
+
if (!scrollUpdateWasRequested && scrollOffset >= maxScroll - endOffset)
|
|
9142
9160
|
onEndReachedInternal(scrollOffset);
|
|
9143
9161
|
}, [maxScroll, onEndReachedInternal]);
|
|
9144
9162
|
const onFilterUpdateInternal = useCallback((column, filterForProperty) => {
|
|
9163
|
+
if (debug)
|
|
9164
|
+
console.log("onFilterUpdateInternal", column, filterForProperty);
|
|
9145
9165
|
endReachCallbackThreshold.current = 0;
|
|
9146
9166
|
const filter = filterRef.current;
|
|
9147
9167
|
let newFilterValue = filter ? { ...filter } : {};
|
|
@@ -9203,6 +9223,8 @@ const VirtualTable = React__default.memo(
|
|
|
9203
9223
|
endAdornment,
|
|
9204
9224
|
AddColumnComponent
|
|
9205
9225
|
};
|
|
9226
|
+
if (debug)
|
|
9227
|
+
console.log("VirtualTable render", virtualListController);
|
|
9206
9228
|
return /* @__PURE__ */ jsx(
|
|
9207
9229
|
"div",
|
|
9208
9230
|
{
|
|
@@ -9863,7 +9885,6 @@ const SelectableTable = React__default.memo(
|
|
|
9863
9885
|
onEndReached: loadNextPage,
|
|
9864
9886
|
onResetPagination: resetPagination,
|
|
9865
9887
|
error: dataLoadingError,
|
|
9866
|
-
paginationEnabled,
|
|
9867
9888
|
onColumnResize,
|
|
9868
9889
|
rowHeight: getRowHeight(size),
|
|
9869
9890
|
loading: dataLoading,
|