@mui/x-virtualizer 0.2.10 → 0.2.11
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/CHANGELOG.md +112 -0
- package/constants.d.ts +22 -0
- package/constants.js +26 -0
- package/esm/constants.d.ts +22 -0
- package/esm/constants.js +20 -0
- package/esm/features/colspan.d.ts +4 -4
- package/esm/features/dimensions.d.ts +14 -8
- package/esm/features/dimensions.js +26 -7
- package/esm/features/index.d.ts +1 -1
- package/esm/features/index.js +1 -1
- package/esm/features/keyboard.d.ts +3 -3
- package/esm/features/keyboard.js +1 -1
- package/esm/features/rowspan.d.ts +4 -4
- package/esm/features/virtualization/index.d.ts +2 -0
- package/esm/features/virtualization/index.js +2 -0
- package/esm/features/virtualization/layout.d.ts +129 -0
- package/esm/features/virtualization/layout.js +152 -0
- package/esm/features/{virtualization.d.ts → virtualization/virtualization.d.ts} +35 -58
- package/esm/features/{virtualization.js → virtualization/virtualization.js} +97 -134
- package/esm/index.d.ts +2 -1
- package/esm/index.js +3 -2
- package/esm/models/core.d.ts +7 -0
- package/esm/models/core.js +7 -0
- package/esm/models/dimensions.d.ts +8 -0
- package/esm/useVirtualizer.d.ts +25 -69
- package/esm/useVirtualizer.js +21 -4
- package/features/colspan.d.ts +4 -4
- package/features/dimensions.d.ts +14 -8
- package/features/dimensions.js +26 -7
- package/features/index.d.ts +1 -1
- package/features/keyboard.d.ts +3 -3
- package/features/rowspan.d.ts +4 -4
- package/features/virtualization/index.d.ts +2 -0
- package/features/virtualization/index.js +27 -0
- package/features/virtualization/layout.d.ts +129 -0
- package/features/virtualization/layout.js +163 -0
- package/features/{virtualization.d.ts → virtualization/virtualization.d.ts} +35 -58
- package/features/{virtualization.js → virtualization/virtualization.js} +97 -134
- package/index.d.ts +2 -1
- package/index.js +12 -1
- package/models/core.d.ts +7 -0
- package/models/core.js +8 -1
- package/models/dimensions.d.ts +8 -0
- package/package.json +2 -2
- package/useVirtualizer.d.ts +25 -69
- package/useVirtualizer.js +20 -3
package/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @mui/x-virtualizer v0.2.
|
|
2
|
+
* @mui/x-virtualizer v0.2.11
|
|
3
3
|
*
|
|
4
4
|
* @license MIT
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
@@ -31,4 +31,15 @@ Object.keys(_features).forEach(function (key) {
|
|
|
31
31
|
return _features[key];
|
|
32
32
|
}
|
|
33
33
|
});
|
|
34
|
+
});
|
|
35
|
+
var _constants = require("./constants");
|
|
36
|
+
Object.keys(_constants).forEach(function (key) {
|
|
37
|
+
if (key === "default" || key === "__esModule") return;
|
|
38
|
+
if (key in exports && exports[key] === _constants[key]) return;
|
|
39
|
+
Object.defineProperty(exports, key, {
|
|
40
|
+
enumerable: true,
|
|
41
|
+
get: function () {
|
|
42
|
+
return _constants[key];
|
|
43
|
+
}
|
|
44
|
+
});
|
|
34
45
|
});
|
package/models/core.d.ts
CHANGED
|
@@ -62,6 +62,13 @@ export type ScrollPosition = {
|
|
|
62
62
|
top: number;
|
|
63
63
|
left: number;
|
|
64
64
|
};
|
|
65
|
+
export declare const ScrollPosition: {
|
|
66
|
+
EMPTY: {
|
|
67
|
+
top: number;
|
|
68
|
+
left: number;
|
|
69
|
+
};
|
|
70
|
+
equals: (a: ScrollPosition, b: ScrollPosition) => boolean;
|
|
71
|
+
};
|
|
65
72
|
export declare enum ScrollDirection {
|
|
66
73
|
NONE = 0,
|
|
67
74
|
UP = 1,
|
package/models/core.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.Size = exports.ScrollDirection = exports.PinnedRows = exports.PinnedColumns = void 0;
|
|
6
|
+
exports.Size = exports.ScrollPosition = exports.ScrollDirection = exports.PinnedRows = exports.PinnedColumns = void 0;
|
|
7
7
|
/* eslint-disable @typescript-eslint/no-redeclare */
|
|
8
8
|
|
|
9
9
|
const Size = exports.Size = {
|
|
@@ -28,6 +28,13 @@ const PinnedColumns = exports.PinnedColumns = {
|
|
|
28
28
|
right: []
|
|
29
29
|
}
|
|
30
30
|
};
|
|
31
|
+
const ScrollPosition = exports.ScrollPosition = {
|
|
32
|
+
EMPTY: {
|
|
33
|
+
top: 0,
|
|
34
|
+
left: 0
|
|
35
|
+
},
|
|
36
|
+
equals: (a, b) => a.top === b.top && a.left === b.left
|
|
37
|
+
};
|
|
31
38
|
let ScrollDirection = exports.ScrollDirection = /*#__PURE__*/function (ScrollDirection) {
|
|
32
39
|
ScrollDirection[ScrollDirection["NONE"] = 0] = "NONE";
|
|
33
40
|
ScrollDirection[ScrollDirection["UP"] = 1] = "UP";
|
package/models/dimensions.d.ts
CHANGED
|
@@ -65,6 +65,14 @@ export interface DimensionsState {
|
|
|
65
65
|
* Size of the bottom container.
|
|
66
66
|
*/
|
|
67
67
|
bottomContainerHeight: number;
|
|
68
|
+
/**
|
|
69
|
+
* Indicates that the container takes the height of its content.
|
|
70
|
+
*/
|
|
71
|
+
autoHeight: boolean;
|
|
72
|
+
/**
|
|
73
|
+
* Minimal height to display the content area.
|
|
74
|
+
*/
|
|
75
|
+
minimalContentHeight: string | number | undefined;
|
|
68
76
|
}
|
|
69
77
|
/**
|
|
70
78
|
* The rows total height and positions.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/x-virtualizer",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.11",
|
|
4
4
|
"author": "MUI Team",
|
|
5
5
|
"description": "MUI virtualization library",
|
|
6
6
|
"license": "MIT",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"@babel/runtime": "^7.28.4",
|
|
31
31
|
"@mui/utils": "^7.3.5",
|
|
32
|
-
"@mui/x-internals": "8.
|
|
32
|
+
"@mui/x-internals": "8.21.0"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
package/useVirtualizer.d.ts
CHANGED
|
@@ -1,25 +1,21 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { integer
|
|
2
|
+
import { integer } from '@mui/x-internals/types';
|
|
3
3
|
import { Store } from '@mui/x-internals/store';
|
|
4
4
|
import { Colspan } from "./features/colspan.js";
|
|
5
5
|
import { Dimensions } from "./features/dimensions.js";
|
|
6
6
|
import { Rowspan } from "./features/rowspan.js";
|
|
7
|
-
import { Virtualization } from "./features/virtualization.js";
|
|
7
|
+
import { Virtualization } from "./features/virtualization/index.js";
|
|
8
|
+
import type { Layout } from "./features/virtualization/layout.js";
|
|
8
9
|
import type { HeightEntry, RowSpacing } from "./models/dimensions.js";
|
|
9
10
|
import type { ColspanParams } from "./features/colspan.js";
|
|
10
11
|
import type { DimensionsParams } from "./features/dimensions.js";
|
|
11
|
-
import type { VirtualizationParams } from "./features/virtualization.js";
|
|
12
|
+
import type { VirtualizationParams } from "./features/virtualization/index.js";
|
|
12
13
|
import { ColumnWithWidth, FocusedCell, Size, PinnedRows, PinnedColumns, RenderContext, Row, RowEntry } from "./models/index.js";
|
|
13
14
|
export type Virtualizer = ReturnType<typeof useVirtualizer>;
|
|
14
|
-
export type VirtualScrollerCompat = Virtualization.State['getters'];
|
|
15
|
-
export type BaseState = Virtualization.State & Dimensions.State;
|
|
16
|
-
export type VirtualizerParams = {
|
|
17
|
-
|
|
18
|
-
container: RefObject<HTMLDivElement | null>;
|
|
19
|
-
scroller: RefObject<HTMLDivElement | null>;
|
|
20
|
-
scrollbarVertical: RefObject<HTMLDivElement | null>;
|
|
21
|
-
scrollbarHorizontal: RefObject<HTMLDivElement | null>;
|
|
22
|
-
};
|
|
15
|
+
export type VirtualScrollerCompat<L extends Layout = Layout> = Virtualization.State<L>['getters'];
|
|
16
|
+
export type BaseState<L extends Layout = Layout> = Virtualization.State<L> & Dimensions.State;
|
|
17
|
+
export type VirtualizerParams<L extends Layout = Layout> = {
|
|
18
|
+
layout: L;
|
|
23
19
|
dimensions: DimensionsParams;
|
|
24
20
|
virtualization: VirtualizationParams;
|
|
25
21
|
colspan?: ColspanParams;
|
|
@@ -29,7 +25,7 @@ export type VirtualizerParams = {
|
|
|
29
25
|
left: number;
|
|
30
26
|
};
|
|
31
27
|
rowSpanning?: Rowspan.State['rowSpanning'];
|
|
32
|
-
virtualization?: Partial<Virtualization.State['virtualization']>;
|
|
28
|
+
virtualization?: Partial<Virtualization.State<L>['virtualization']>;
|
|
33
29
|
};
|
|
34
30
|
/** current page rows */
|
|
35
31
|
rows: RowEntry[];
|
|
@@ -39,13 +35,11 @@ export type VirtualizerParams = {
|
|
|
39
35
|
lastRowIndex: integer;
|
|
40
36
|
} | null;
|
|
41
37
|
rowCount: integer;
|
|
42
|
-
columns
|
|
38
|
+
columns?: ColumnWithWidth[];
|
|
43
39
|
pinnedRows?: PinnedRows;
|
|
44
40
|
pinnedColumns?: PinnedColumns;
|
|
45
|
-
autoHeight: boolean;
|
|
46
41
|
disableHorizontalScroll?: boolean;
|
|
47
42
|
disableVerticalScroll?: boolean;
|
|
48
|
-
minimalContentHeight?: number | string;
|
|
49
43
|
getRowHeight?: (row: RowEntry) => number | null | undefined | 'auto';
|
|
50
44
|
/**
|
|
51
45
|
* Function that returns the estimated height for a row.
|
|
@@ -68,7 +62,7 @@ export type VirtualizerParams = {
|
|
|
68
62
|
*/
|
|
69
63
|
applyRowHeight?: (entry: HeightEntry, rowEntry: RowEntry) => void;
|
|
70
64
|
virtualizeColumnsWithAutoRowHeight?: boolean;
|
|
71
|
-
resizeThrottleMs
|
|
65
|
+
resizeThrottleMs?: number;
|
|
72
66
|
onResize?: (lastSize: Size) => void;
|
|
73
67
|
onWheel?: (event: React.WheelEvent) => void;
|
|
74
68
|
onTouchMove?: (event: React.TouchEvent) => void;
|
|
@@ -94,10 +88,15 @@ export type VirtualizerParams = {
|
|
|
94
88
|
isVirtualFocusRow: boolean;
|
|
95
89
|
showBottomBorder: boolean;
|
|
96
90
|
}) => React.ReactElement;
|
|
97
|
-
renderInfiniteLoadingTrigger
|
|
91
|
+
renderInfiniteLoadingTrigger?: (id: any) => React.ReactElement;
|
|
92
|
+
};
|
|
93
|
+
type RequiredFields<T, K extends keyof T> = T & Required<Pick<T, K>>;
|
|
94
|
+
export type ParamsWithDefaults = RequiredFields<VirtualizerParams, 'resizeThrottleMs' | 'columns'> & {
|
|
95
|
+
dimensions: RequiredFields<VirtualizerParams['dimensions'], 'columnsTotalWidth' | 'leftPinnedWidth' | 'rightPinnedWidth' | 'topPinnedHeight' | 'bottomPinnedHeight' | 'autoHeight'>;
|
|
96
|
+
virtualization: RequiredFields<VirtualizerParams['virtualization'], 'isRtl' | 'rowBufferPx' | 'columnBufferPx'>;
|
|
98
97
|
};
|
|
99
|
-
export declare const useVirtualizer: (params: VirtualizerParams) => {
|
|
100
|
-
store: Store<Dimensions.State & Virtualization.State & Colspan.State & Rowspan.State>;
|
|
98
|
+
export declare const useVirtualizer: <L extends Layout = Layout>(params: VirtualizerParams<L>) => {
|
|
99
|
+
store: Store<Dimensions.State & Virtualization.State<L> & Colspan.State & Rowspan.State>;
|
|
101
100
|
api: {
|
|
102
101
|
updateDimensions: (firstUpdate?: boolean) => void;
|
|
103
102
|
debouncedUpdateDimensions: (((firstUpdate?: boolean) => void) & import("@mui/x-internals/throttle").Cancelable) | undefined;
|
|
@@ -113,57 +112,13 @@ export declare const useVirtualizer: (params: VirtualizerParams) => {
|
|
|
113
112
|
resetRowHeights: () => void;
|
|
114
113
|
};
|
|
115
114
|
} & {
|
|
116
|
-
getters: {
|
|
117
|
-
setPanels: React.Dispatch<React.SetStateAction<Readonly<Map<any, React.ReactNode>>>>;
|
|
118
|
-
getOffsetTop: () => number;
|
|
119
|
-
getRows: (rowParams?: {
|
|
120
|
-
rows?: RowEntry[];
|
|
121
|
-
position?: import("./models/index.js").PinnedRowPosition;
|
|
122
|
-
renderContext?: RenderContext;
|
|
123
|
-
}, unstable_rowTree?: Record<import("./models/index.js").RowId, any>) => React.ReactNode[];
|
|
124
|
-
rows: RowEntry[];
|
|
125
|
-
getContainerProps: () => {
|
|
126
|
-
ref: (node: HTMLDivElement | null) => (() => void | undefined) | undefined;
|
|
127
|
-
};
|
|
128
|
-
getScrollerProps: () => {
|
|
129
|
-
ref: (node: HTMLDivElement | null) => (() => void | undefined) | undefined;
|
|
130
|
-
style: React.CSSProperties;
|
|
131
|
-
role: string;
|
|
132
|
-
tabIndex: number | undefined;
|
|
133
|
-
};
|
|
134
|
-
getContentProps: () => {
|
|
135
|
-
ref: (node: HTMLDivElement | null) => void;
|
|
136
|
-
style: React.CSSProperties;
|
|
137
|
-
role: string;
|
|
138
|
-
};
|
|
139
|
-
getScrollbarVerticalProps: () => {
|
|
140
|
-
ref: (node: HTMLDivElement | null) => void;
|
|
141
|
-
scrollPosition: React.RefObject<{
|
|
142
|
-
top: number;
|
|
143
|
-
left: number;
|
|
144
|
-
}>;
|
|
145
|
-
};
|
|
146
|
-
getScrollbarHorizontalProps: () => {
|
|
147
|
-
ref: (node: HTMLDivElement | null) => void;
|
|
148
|
-
scrollPosition: React.RefObject<{
|
|
149
|
-
top: number;
|
|
150
|
-
left: number;
|
|
151
|
-
}>;
|
|
152
|
-
};
|
|
153
|
-
getScrollAreaProps: () => {
|
|
154
|
-
scrollPosition: React.RefObject<{
|
|
155
|
-
top: number;
|
|
156
|
-
left: number;
|
|
157
|
-
}>;
|
|
158
|
-
};
|
|
159
|
-
};
|
|
160
|
-
useVirtualization: () => BaseState;
|
|
161
|
-
setPanels: React.Dispatch<React.SetStateAction<Readonly<Map<any, React.ReactNode>>>>;
|
|
162
|
-
forceUpdateRenderContext: () => void;
|
|
163
|
-
scheduleUpdateRenderContext: () => void;
|
|
164
115
|
getCellColSpanInfo: (rowId: import("./models/index.js").RowId, columnIndex: integer) => import("./models/index.js").CellColSpanInfo;
|
|
165
116
|
calculateColSpan: (rowId: import("./models/index.js").RowId, minFirstColumn: integer, maxLastColumn: integer, columns: ColumnWithWidth[]) => void;
|
|
166
117
|
getHiddenCellsOrigin: () => Record<import("./models/index.js").RowId, Record<number, number>>;
|
|
118
|
+
getters: any;
|
|
119
|
+
setPanels: React.Dispatch<React.SetStateAction<Readonly<Map<any, React.ReactNode>>>>;
|
|
120
|
+
forceUpdateRenderContext: () => void;
|
|
121
|
+
scheduleUpdateRenderContext: () => void;
|
|
167
122
|
} & {
|
|
168
123
|
resetColSpan: () => void;
|
|
169
124
|
getCellColSpanInfo: (rowId: import("./models/index.js").RowId, columnIndex: integer) => import("./models/index.js").CellColSpanInfo | undefined;
|
|
@@ -173,4 +128,5 @@ export declare const useVirtualizer: (params: VirtualizerParams) => {
|
|
|
173
128
|
} & {
|
|
174
129
|
getViewportPageSize: () => number;
|
|
175
130
|
};
|
|
176
|
-
};
|
|
131
|
+
};
|
|
132
|
+
export {};
|
package/useVirtualizer.js
CHANGED
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.useVirtualizer = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
8
9
|
var _useLazyRef = _interopRequireDefault(require("@mui/utils/useLazyRef"));
|
|
9
10
|
var _store = require("@mui/x-internals/store");
|
|
10
11
|
var _colspan = require("./features/colspan");
|
|
@@ -12,22 +13,38 @@ var _dimensions = require("./features/dimensions");
|
|
|
12
13
|
var _keyboard = require("./features/keyboard");
|
|
13
14
|
var _rowspan = require("./features/rowspan");
|
|
14
15
|
var _virtualization = require("./features/virtualization");
|
|
16
|
+
var _constants = require("./constants");
|
|
15
17
|
/* eslint-disable jsdoc/require-param-type */
|
|
16
18
|
/* eslint-disable jsdoc/require-param-description */
|
|
17
19
|
/* eslint-disable jsdoc/require-returns-type */
|
|
18
20
|
|
|
19
21
|
const FEATURES = [_dimensions.Dimensions, _virtualization.Virtualization, _colspan.Colspan, _rowspan.Rowspan, _keyboard.Keyboard];
|
|
20
22
|
const useVirtualizer = params => {
|
|
23
|
+
const paramsWithDefault = mergeDefaults(params, _constants.DEFAULT_PARAMS);
|
|
21
24
|
const store = (0, _useLazyRef.default)(() => {
|
|
22
|
-
return new _store.Store(FEATURES.map(f => f.initialize(
|
|
25
|
+
return new _store.Store(FEATURES.map(f => f.initialize(paramsWithDefault)).reduce((state, partial) => Object.assign(state, partial), {}));
|
|
23
26
|
}).current;
|
|
24
27
|
const api = {};
|
|
25
28
|
for (const feature of FEATURES) {
|
|
26
|
-
Object.assign(api, feature.use(store,
|
|
29
|
+
Object.assign(api, feature.use(store, paramsWithDefault, api));
|
|
27
30
|
}
|
|
28
31
|
return {
|
|
29
32
|
store,
|
|
30
33
|
api
|
|
31
34
|
};
|
|
32
35
|
};
|
|
33
|
-
exports.useVirtualizer = useVirtualizer;
|
|
36
|
+
exports.useVirtualizer = useVirtualizer;
|
|
37
|
+
function mergeDefaults(params, defaults) {
|
|
38
|
+
const result = (0, _extends2.default)({}, params);
|
|
39
|
+
for (const key in defaults) {
|
|
40
|
+
if (Object.hasOwn(defaults, key)) {
|
|
41
|
+
const value = defaults[key];
|
|
42
|
+
if (value !== null && typeof value === 'object' && !Array.isArray(value)) {
|
|
43
|
+
result[key] = mergeDefaults(params[key] ?? {}, value);
|
|
44
|
+
} else {
|
|
45
|
+
result[key] = params[key] ?? value;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
return result;
|
|
50
|
+
}
|